From 8f1638e535e5cf64f2bc1d0a7f976c8c43c7e8d9 Mon Sep 17 00:00:00 2001 From: Doljinsuren Enkhbayar Date: Fri, 17 May 2024 17:55:04 +0800 Subject: [PATCH 01/11] implemented import modal --- addon/components/modals/import-form.hbs | 84 +++++++++++++++++++ addon/components/modals/import-form.js | 74 ++++++++++++++++ app/components/modals/import-form.js | 1 + .../components/modals/import-form-test.js | 26 ++++++ 4 files changed, 185 insertions(+) create mode 100644 addon/components/modals/import-form.hbs create mode 100644 addon/components/modals/import-form.js create mode 100644 app/components/modals/import-form.js create mode 100644 tests/integration/components/modals/import-form-test.js diff --git a/addon/components/modals/import-form.hbs b/addon/components/modals/import-form.hbs new file mode 100644 index 0000000..a899f3f --- /dev/null +++ b/addon/components/modals/import-form.hbs @@ -0,0 +1,84 @@ + +
+ {{#if @options.isProcessing}} +
+
+ +
+
+ {{else}} + {{#let (file-queue name="spreadsheets" onFileAdded=this.queueFile accept=(join "," @options.acceptedFileTypes)) as |queue|}} + + {{#if dropzone.active}} + {{#if dropzone.valid}} + {{t "fleet-ops.component.modals.order-import.drop-upload"}} + {{else}} + {{t "fleet-ops.component.modals.order-import.invalid"}} + {{/if}} + {{else if queue.files.length}} +
+ + {{pluralize queue.files.length "spreadsheet"}} {{t "fleet-ops.component.modals.order-import.ready-upload"}} +
+
({{queue.progress}}%)
+ {{else}} +

+ {{t "fleet-ops.component.modals.order-import.upload-spreadsheets"}} +

+
+ {{#if dropzone.supported}} +

{{t "fleet-ops.component.modals.order-import.drag-drop"}}

+ {{/if}} + + +
+ {{/if}} + + {{/let}} + + {{#if @options.uploadQueue}} +
+
+ {{t "fleet-ops.component.modals.order-import.upload-queue"}} +
+ +
+ + + + {{#each @options.fileQueueColumns as |column|}} + + {{/each}} + + + + {{#each @options.uploadQueue as |file|}} + + {{#each @options.fileQueueColumns as |column|}} + + {{/each}} + + {{/each}} + +
{{column.name}}
+ {{#if (eq column.key "delete")}} + + + + {{else if (eq column.key "type")}} + + {{else if (eq column.key "fileSize")}} + {{format-bytes (get file column.valuePath)}} + {{else if (eq column.key "uploadDate")}} + {{format-date (get file column.valuePath) "d MMM yyyy"}} + {{else}} +
{{get file column.valuePath}}
+ {{/if}} +
+
+
+ {{/if}} + {{/if}} + +
+ \ No newline at end of file diff --git a/addon/components/modals/import-form.js b/addon/components/modals/import-form.js new file mode 100644 index 0000000..522b409 --- /dev/null +++ b/addon/components/modals/import-form.js @@ -0,0 +1,74 @@ +import Component from '@glimmer/component'; +import { action } from '@ember/object'; +import { inject as service } from '@ember/service'; +import { task } from 'ember-concurrency-decorators'; +import { tracked } from '@glimmer/tracking'; + +export default class ModalsImportFormComponent extends Component { + @service fetch; + @service store; + @tracked uploadQueue = []; + @tracked isMultipleDropoffOrder = false; + @tracked pendingAttachmentFile; + @tracked pendingAttachmentFiles = []; + + constructor() { + super(...arguments); + } + + acceptedFileTypes = [ + 'application/vnd.ms-excel', + 'application/vnd.openxmlformats-officedocument.wordprocessingml.document', + 'application/vnd.openxmlformats-officedocument.presentationml.presentation', + 'application/msword', + 'application/pdf', + 'application/x-pdf', + 'image/jpeg', + 'image/png', + 'image/gif', + 'image/webp', + 'video/mp4', + 'video/quicktime', + 'video/x-msvideo', + 'video/x-flv', + 'video/x-ms-wmv', + 'audio/mpeg', + 'video/x-msvideo', + 'application/zip', + 'application/x-tar', + ]; + + @action handleFileChange(event) { + const file = event.target.files[0]; + if (file) { + this.uploadFile(file); + } + } + + @task *uploadFile(file) { + if (['queued', 'failed', 'timed_out', 'aborted'].indexOf(file.state) === -1) { + return; + } + + this.pendingAttachmentFile = file; + + yield this.fetch.uploadFile.perform( + file, + { + path: `uploads/fleet-ops/driver-imports/${this.currentUser.companyId}`, + type: `driver_import`, + }, + (uploadedFile) => { + this.pendingAttachmentFiles.pushObject(uploadedFile); + this.pendingAttachmentFile = undefined; + }, + () => { + // remove file from queue + if (file.queue && typeof file.queue.remove === 'function') { + file.queue.remove(file); + } + this.pendingAttachmentFile = undefined; + } + ); + } +} diff --git a/app/components/modals/import-form.js b/app/components/modals/import-form.js new file mode 100644 index 0000000..00d50c5 --- /dev/null +++ b/app/components/modals/import-form.js @@ -0,0 +1 @@ +export { default } from '@fleetbase/ember-ui/components/modals/import-form'; diff --git a/tests/integration/components/modals/import-form-test.js b/tests/integration/components/modals/import-form-test.js new file mode 100644 index 0000000..91f3ed6 --- /dev/null +++ b/tests/integration/components/modals/import-form-test.js @@ -0,0 +1,26 @@ +import { module, test } from 'qunit'; +import { setupRenderingTest } from 'dummy/tests/helpers'; +import { render } from '@ember/test-helpers'; +import { hbs } from 'ember-cli-htmlbars'; + +module('Integration | Component | modals/import-form', function (hooks) { + setupRenderingTest(hooks); + + test('it renders', async function (assert) { + // Set any properties with this.set('myProperty', 'value'); + // Handle any actions with this.set('myAction', function(val) { ... }); + + await render(hbs``); + + assert.dom().hasText(''); + + // Template block usage: + await render(hbs` + + template block text + + `); + + assert.dom().hasText('template block text'); + }); +}); From 2b34f3861e564f6489d7928e2c49c3d3624775de Mon Sep 17 00:00:00 2001 From: Doljinsuren Enkhbayar Date: Fri, 17 May 2024 18:13:28 +0800 Subject: [PATCH 02/11] fix translation --- addon/components/modals/import-form.hbs | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/addon/components/modals/import-form.hbs b/addon/components/modals/import-form.hbs index a899f3f..cf0f17f 100644 --- a/addon/components/modals/import-form.hbs +++ b/addon/components/modals/import-form.hbs @@ -3,7 +3,7 @@ {{#if @options.isProcessing}}
- +
{{else}} @@ -11,26 +11,26 @@ {{#if dropzone.active}} {{#if dropzone.valid}} - {{t "fleet-ops.component.modals.order-import.drop-upload"}} + {{t "component.import-modal.drop-upload"}} {{else}} - {{t "fleet-ops.component.modals.order-import.invalid"}} + {{t "component.import-modal.invalid"}} {{/if}} {{else if queue.files.length}}
- {{pluralize queue.files.length "spreadsheet"}} {{t "fleet-ops.component.modals.order-import.ready-upload"}} + {{pluralize queue.files.length "spreadsheet"}} {{t "component.import-modal.ready-upload"}}
({{queue.progress}}%)
{{else}}

- {{t "fleet-ops.component.modals.order-import.upload-spreadsheets"}} + {{t "component.import-modal.upload-spreadsheets"}}

{{#if dropzone.supported}} -

{{t "fleet-ops.component.modals.order-import.drag-drop"}}

+

{{t "component.import-modal.drag-drop"}}

{{/if}} - +
{{/if}} @@ -39,7 +39,7 @@ {{#if @options.uploadQueue}}
- {{t "fleet-ops.component.modals.order-import.upload-queue"}} + {{t "component.import-modal.upload-queue"}}
From 74460fb4e0b565baddb8dc30e80d69ac3f56bc4e Mon Sep 17 00:00:00 2001 From: "Ronald A. Richardson" Date: Mon, 20 May 2024 15:41:38 +0800 Subject: [PATCH 03/11] simplify and improve otp input component, and responsiveness on layout header --- addon/components/layout/header.hbs | 2 +- addon/components/otp-input.hbs | 7 +- addon/components/otp-input.js | 170 ++++++-------------------- addon/styles/components/input.css | 2 +- addon/styles/components/otp-input.css | 57 +++++++-- package.json | 2 +- 6 files changed, 91 insertions(+), 149 deletions(-) diff --git a/addon/components/layout/header.hbs b/addon/components/layout/header.hbs index cbc999c..fc69e76 100644 --- a/addon/components/layout/header.hbs +++ b/addon/components/layout/header.hbs @@ -43,7 +43,7 @@
{{first-char @user.company_name}}
-
{{@user.company_name}}
+
{{@user.company_name}}
diff --git a/addon/components/otp-input.hbs b/addon/components/otp-input.hbs index 1e068f9..a69c523 100644 --- a/addon/components/otp-input.hbs +++ b/addon/components/otp-input.hbs @@ -1,5 +1,4 @@ -
- {{#each this.otpValues as |value index|}} - - {{/each}} +
+ + {{!-- {{this.value}} --}}
\ No newline at end of file diff --git a/addon/components/otp-input.js b/addon/components/otp-input.js index d75ba16..4b58cd2 100644 --- a/addon/components/otp-input.js +++ b/addon/components/otp-input.js @@ -1,173 +1,81 @@ -// app/components/otp-input.js import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; -import { isBlank } from '@ember/utils'; -import { notifyPropertyChange } from '@ember/object'; +import { action } from '@ember/object'; +import IMask from 'imask'; /** * Glimmer component for handling OTP (One-Time Password) input. + * This component is responsible for rendering an OTP input field and managing its state. * * @class OtpInputComponent * @extends Component */ export default class OtpInputComponent extends Component { - numberOfDigits = 6; - /** - * Array to track individual digit values of the OTP. - * - * @property {Array} otpValues - * @default ['', '', '', '', '', ''] - * @tracked + * Tracks the size of the OTP, typically the number of characters the OTP should have. + * @property size + * @type {Number} + * @default 6 */ - @tracked otpValues; + @tracked size = 6; /** - * Tracked property for handling the OTP value passed from the parent. - * - * @property {String} value - * @tracked + * Tracks the current value entered by the user in the OTP input. + * @property value + * @type {String} */ @tracked value; + @tracked placeholder; /** - * Constructor for the OTP input component. + * Component constructor that initializes the component with specified properties. + * Allows setting the initial `size` and `value` of the OTP input upon component instantiation. * * @constructor + * @param owner The owner object of this component instance. + * @param {Object} args Component arguments. */ - constructor() { + constructor(owner, { size, value }) { super(...arguments); - this.otpValues = Array.from({ length: this.numberOfDigits }, () => ''); - this.handleInput = this.handleInput.bind(this); - this.handleFocus = this.handleFocus.bind(this); - this.handleKeyDown = this.handleKeyDown.bind(this); - } - - /** - * Getter for the complete OTP value obtained by joining individual digits. - * - * @property {String} otpValue - */ - get otpValue() { - return this.otpValues.join(''); + this.value = value; + this.size = size; + this.placeholder = '0'.repeat(size); } /** - * Setter for updating the OTP value based on user input. + * Focus action that sets the focus on the given HTML element. + * Typically used to focus the input element when the component is rendered. * - * @property {String} otpValue + * @method focus + * @param {HTMLElement} el The element to be focused. */ - set otpValue(newValue) { - if (typeof newValue === 'string') { - this.otpValues = newValue.split('').slice(0, this.numberOfDigits); - } + @action setup(inputEl) { + inputEl.focus(); } /** - * Handles focus on the input field at a specified index. + * Validates the input as the user types into the OTP field. + * Checks the length of the entered value and triggers appropriate callbacks on certain conditions. * - * @method handleFocus - * @param {Number} index - The index of the input field to focus on. + * @method validate + * @param {Event} event The input event that triggered this action. */ - handleFocus(index) { - const inputId = `otp-input-${index}`; - const inputElement = document.getElementById(inputId); - - if (inputElement) { - inputElement.focus(); - } - } - - /** - * Handles input events on the input field at a specified index. - * - * @method handleInput - * @param {Number} index - The index of the input field being edited. - * @param {Event} event - The input event object. - */ - handleInput(index, event) { - if (!event || !event.target) { - console.error('Invalid event object in handleInput'); - return; - } - - const inputValue = event.target.value; - - this.otpValues[index] = inputValue; + @action validate({ target }) { + const value = target.value; - if (inputValue === '' && index > 0) { - this.handleFocus(index - 1); - } else if (index < this.numberOfDigits - 1) { - this.handleFocus(index + 1); - } + // Update value + this.value = value; - // on every input + // Call the onInput function if provided in the component's arguments. if (typeof this.args.onInput === 'function') { - this.args.onInput(inputValue); + this.args.onInput(value); } - if (this.otpValues.every((value) => !isBlank(value))) { - const completeOtpValue = this.otpValues.join(''); - + // Check if the entered value meets the required size and if so, trigger the onInputCompleted callback. + if (typeof value === 'string' && value.length === this.size) { if (typeof this.args.onInputCompleted === 'function') { - this.args.onInputCompleted(completeOtpValue); + this.args.onInputCompleted(value); } } } - - /** - * Handles keydown events on the input field at a specified index. - * - * @method handleKeyDown - * @param {Number} index - The index of the input field. - * @param {Event} event - The keydown event object. - */ - handleKeyDown(index, event) { - switch (event.keyCode) { - case 37: - if (index > 0) { - this.handleFocus(index - 1); - } - break; - case 39: - if (index < this.numberOfDigits - 1) { - this.handleFocus(index + 1); - } - break; - case 8: - if (this.otpValues[index] !== '') { - this.otpValues[index] = ''; - } else if (index > 0) { - this.handleFocus(index - 1); - } - break; - default: - break; - } - } - - handlePaste = (index, event) => { - event.preventDefault(); - const pastedData = event.clipboardData.getData('text/plain'); - - if (/^\d{6}$/.test(pastedData)) { - const pastedValues = pastedData.split(''); - - for (let i = 0; i < this.numberOfDigits; i++) { - this.otpValues[index + i] = pastedValues[i] || ''; - } - const completeOtpValue = this.otpValues.join(''); - - if (typeof this.args.onInputCompleted === 'function') { - this.args.onInputCompleted(completeOtpValue); - } - } - notifyPropertyChange(this, 'otpValues'); - }; - - handleDidInsert(index, element) { - if (index === 0) { - element.focus(); - } - } } diff --git a/addon/styles/components/input.css b/addon/styles/components/input.css index 5b18fd7..1db5a5b 100644 --- a/addon/styles/components/input.css +++ b/addon/styles/components/input.css @@ -500,7 +500,7 @@ body[data-theme='dark'] .iti__dropdown-content { line-height: 1.25rem; } -body[data-theme="dark"] .iti__selected-dial-code { +body[data-theme='dark'] .iti__selected-dial-code { color: #fff; } diff --git a/addon/styles/components/otp-input.css b/addon/styles/components/otp-input.css index 21b3f07..9f54e10 100644 --- a/addon/styles/components/otp-input.css +++ b/addon/styles/components/otp-input.css @@ -1,29 +1,64 @@ .otp-input-container { + position: relative; + width: 100%; + padding: 0 2rem; display: flex; - justify-content: space-between; - width: 400px; + align-items: center; + justify-content: center; + font-size: 1.5rem; + line-height: 1.5rem; + letter-spacing: 1rem; + text-align: center; + font-family: monospace; } -.otp-input-container input { - width: 68px; - height: 68px; - font-size: 24px; +.otp-input-container > .otp-input-placeholder { + display: flex; + justify-content: center; + align-items: center; + font-size: 1.72rem; + line-height: 1.5rem; + letter-spacing: 1.1rem; + color: #6b7280; + opacity: 0.5; text-align: center; + font-family: monospace; + pointer-events: none; + background-color: transparent; + position: absolute; + left: 0; + right: 0; + bottom: 0; + top: 0; + width: 100%; + overflow: hidden; +} + +body[data-theme="dark"] > input.otp-input, +.otp-input-container > input.otp-input, +.otp-input-container > input { + text-align: center; + font-family: monospace; + font-size: 1.5rem; + line-height: 1.5rem; + letter-spacing: 1rem; border: 3px solid #3498db; - border-radius: 8px; - background-color: #2c3e50; color: #ecf0f1; - margin: 0; transition: all 0.3s ease; } +body[data-theme="dark"] > input.otp-input::placeholder, +.otp-input-container > input.otp-input::placeholder, +.otp-input-container > input::placeholder { + color: rgba(107, 114, 128, 0.5); + letter-spacing: 1rem; +} + .otp-input-container input:focus { outline: none; border-color: #2980b9; - transform: scale(1.1); } .otp-input-container input:hover { - transform: scale(1.1); box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); } diff --git a/package.json b/package.json index 59c2b63..7e96e88 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@fleetbase/ember-ui", - "version": "0.2.15", + "version": "0.2.16", "description": "Fleetbase UI provides all the interface components, helpers, services and utilities for building a Fleetbase extension into the Console.", "keywords": [ "fleetbase-ui", From 90085e7b7cec42998d6e887e96d75496d93b74ec Mon Sep 17 00:00:00 2001 From: "Ronald A. Richardson" Date: Mon, 20 May 2024 15:46:28 +0800 Subject: [PATCH 04/11] ran linter, allows custom placeholder in otp input --- addon/components/otp-input.js | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/addon/components/otp-input.js b/addon/components/otp-input.js index 4b58cd2..69eef2f 100644 --- a/addon/components/otp-input.js +++ b/addon/components/otp-input.js @@ -1,7 +1,6 @@ import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; import { action } from '@ember/object'; -import IMask from 'imask'; /** * Glimmer component for handling OTP (One-Time Password) input. @@ -25,6 +24,13 @@ export default class OtpInputComponent extends Component { * @type {String} */ @tracked value; + + /** + * The placeholder for the OTP input. + * + * @type {String} + * @memberof OtpInputComponent + */ @tracked placeholder; /** @@ -35,11 +41,11 @@ export default class OtpInputComponent extends Component { * @param owner The owner object of this component instance. * @param {Object} args Component arguments. */ - constructor(owner, { size, value }) { + constructor(owner, { size, value, placeholder }) { super(...arguments); this.value = value; this.size = size; - this.placeholder = '0'.repeat(size); + this.placeholder = placeholder ?? '0'.repeat(size); } /** From 96d37f56d179f535e41623eb20eee04af6a399a0 Mon Sep 17 00:00:00 2001 From: "Ronald A. Richardson" Date: Mon, 20 May 2024 15:46:49 +0800 Subject: [PATCH 05/11] removed placeholder span --- addon/components/otp-input.hbs | 1 - 1 file changed, 1 deletion(-) diff --git a/addon/components/otp-input.hbs b/addon/components/otp-input.hbs index a69c523..2af4fb4 100644 --- a/addon/components/otp-input.hbs +++ b/addon/components/otp-input.hbs @@ -1,4 +1,3 @@
- {{!-- {{this.value}} --}}
\ No newline at end of file From 9dd9fde1b6caa0895471e914cee9da29180e6f91 Mon Sep 17 00:00:00 2001 From: Doljinsuren Enkhbayar Date: Wed, 22 May 2024 15:50:37 +0800 Subject: [PATCH 06/11] removed unused file --- addon/components/modals/import-form.js | 74 -------------------------- 1 file changed, 74 deletions(-) delete mode 100644 addon/components/modals/import-form.js diff --git a/addon/components/modals/import-form.js b/addon/components/modals/import-form.js deleted file mode 100644 index 522b409..0000000 --- a/addon/components/modals/import-form.js +++ /dev/null @@ -1,74 +0,0 @@ -import Component from '@glimmer/component'; -import { action } from '@ember/object'; -import { inject as service } from '@ember/service'; -import { task } from 'ember-concurrency-decorators'; -import { tracked } from '@glimmer/tracking'; - -export default class ModalsImportFormComponent extends Component { - @service fetch; - @service store; - @tracked uploadQueue = []; - @tracked isMultipleDropoffOrder = false; - @tracked pendingAttachmentFile; - @tracked pendingAttachmentFiles = []; - - constructor() { - super(...arguments); - } - - acceptedFileTypes = [ - 'application/vnd.ms-excel', - 'application/vnd.openxmlformats-officedocument.wordprocessingml.document', - 'application/vnd.openxmlformats-officedocument.presentationml.presentation', - 'application/msword', - 'application/pdf', - 'application/x-pdf', - 'image/jpeg', - 'image/png', - 'image/gif', - 'image/webp', - 'video/mp4', - 'video/quicktime', - 'video/x-msvideo', - 'video/x-flv', - 'video/x-ms-wmv', - 'audio/mpeg', - 'video/x-msvideo', - 'application/zip', - 'application/x-tar', - ]; - - @action handleFileChange(event) { - const file = event.target.files[0]; - if (file) { - this.uploadFile(file); - } - } - - @task *uploadFile(file) { - if (['queued', 'failed', 'timed_out', 'aborted'].indexOf(file.state) === -1) { - return; - } - - this.pendingAttachmentFile = file; - - yield this.fetch.uploadFile.perform( - file, - { - path: `uploads/fleet-ops/driver-imports/${this.currentUser.companyId}`, - type: `driver_import`, - }, - (uploadedFile) => { - this.pendingAttachmentFiles.pushObject(uploadedFile); - this.pendingAttachmentFile = undefined; - }, - () => { - // remove file from queue - if (file.queue && typeof file.queue.remove === 'function') { - file.queue.remove(file); - } - this.pendingAttachmentFile = undefined; - } - ); - } -} From de4acb150fe8790278cd1a326a67424f54ccd71c Mon Sep 17 00:00:00 2001 From: "Ronald A. Richardson" Date: Wed, 29 May 2024 13:46:59 +0800 Subject: [PATCH 07/11] ui component improvements, better table footer calculation handling, and ran prettier --- addon/components/array-input.hbs | 11 ++- addon/components/aside-item-scroller.hbs | 52 ++++++++---- addon/components/attach/popover.hbs | 17 +++- addon/components/attach/tooltip.hbs | 20 ++++- addon/components/autocomplete-input.hbs | 26 +++++- addon/components/badge.hbs | 6 +- addon/components/basic-dropdown-hover.hbs | 37 +++++---- addon/components/button.hbs | 18 ++++- addon/components/chat-tray.hbs | 28 ++++++- addon/components/chat-window.hbs | 29 +++++-- addon/components/chat-window/message.hbs | 7 +- addon/components/checkbox.hbs | 15 +++- addon/components/combo-box.hbs | 12 ++- addon/components/comment-thread.hbs | 9 ++- addon/components/comment-thread/comment.hbs | 77 ++++++++++++++++-- addon/components/content-panel.hbs | 40 ++++++++-- addon/components/coordinates-input.hbs | 12 ++- addon/components/country-select.hbs | 16 +++- addon/components/currency-select.hbs | 16 +++- addon/components/date-time-input.hbs | 2 +- addon/components/drawer.hbs | 13 ++- addon/components/dropdown-button.hbs | 50 +++++++++++- addon/components/fetch-select.hbs | 60 +++++++++++++- addon/components/file-upload.hbs | 7 +- addon/components/file.hbs | 19 ++++- addon/components/filter/date.hbs | 10 ++- addon/components/filter/model.hbs | 14 +++- addon/components/filter/multi-option.hbs | 14 +++- addon/components/filter/select.hbs | 11 ++- addon/components/filters-picker.hbs | 50 ++++++++---- addon/components/floating.hbs | 2 +- addon/components/input-group.hbs | 13 ++- addon/components/input-label.hbs | 2 +- addon/components/key-input.hbs | 13 ++- addon/components/layout/header.hbs | 16 +++- addon/components/layout/header/dropdown.hbs | 11 ++- .../layout/header/dropdown/item.hbs | 8 +- .../layout/header/sidebar-toggle.hbs | 18 +++-- addon/components/layout/mobile-navbar.hbs | 2 +- addon/components/layout/section/header.hbs | 9 ++- addon/components/layout/sidebar/item.hbs | 17 +++- addon/components/layout/sidebar/panel.hbs | 45 ++++++++++- addon/components/locale-selector-tray.hbs | 11 ++- addon/components/modal.hbs | 70 ++++++++-------- addon/components/modal/body.hbs | 2 +- addon/components/modal/default.hbs | 23 +++++- addon/components/modal/dialog.hbs | 46 ++++++----- addon/components/modal/footer.hbs | 24 +++--- addon/components/modal/header.hbs | 39 ++++----- addon/components/modal/header/close.hbs | 2 +- addon/components/modal/header/title.hbs | 4 +- addon/components/modal/layouts/alert.hbs | 2 +- .../components/modal/layouts/bulk-action.hbs | 2 +- addon/components/modal/layouts/confirm.hbs | 7 +- addon/components/modal/layouts/loading.hbs | 2 +- .../modal/layouts/option-prompt.hbs | 9 ++- addon/components/modal/layouts/process.hbs | 2 +- addon/components/modal/layouts/progress.hbs | 2 +- addon/components/modal/layouts/prompt.hbs | 2 +- addon/components/modal/title-with-buttons.hbs | 12 ++- addon/components/modals-container.hbs | 14 ++-- addon/components/modals/bulk-action-model.hbs | 17 +++- addon/components/modals/bulk-delete-model.hbs | 14 +++- .../components/modals/create-or-join-org.hbs | 16 +++- addon/components/modals/extension-details.hbs | 4 +- addon/components/modals/import-form.hbs | 28 +++++-- addon/components/modals/install-prompt.hbs | 3 +- .../modals/resend-verification-email.hbs | 14 +++- addon/components/modals/verify-by-sms.hbs | 9 ++- addon/components/modals/verify-email.hbs | 25 ++++-- addon/components/model-select-multiple.hbs | 79 ++++++++++++++++++- addon/components/model-select.hbs | 59 +++++++++++++- addon/components/model-select/options.hbs | 12 ++- addon/components/model-select/spinner.hbs | 4 +- addon/components/money-input.hbs | 11 ++- addon/components/multi-select.hbs | 17 +++- addon/components/notification-tray.hbs | 12 ++- addon/components/otp-input.hbs | 11 ++- addon/components/overlay.hbs | 14 +++- addon/components/overlay/header.hbs | 24 +++++- addon/components/pagination.hbs | 9 ++- addon/components/select.hbs | 20 ++++- addon/components/table.hbs | 29 ++++--- addon/components/table.js | 8 ++ addon/components/table/body.hbs | 16 ++-- addon/components/table/cell/anchor.hbs | 10 ++- addon/components/table/cell/base.hbs | 2 +- addon/components/table/cell/driver-name.hbs | 4 +- addon/components/table/cell/dropdown.hbs | 11 ++- addon/components/table/cell/link-to.hbs | 10 ++- addon/components/table/cell/media-name.hbs | 4 +- addon/components/table/cell/resizer.hbs | 2 +- addon/components/table/cell/vehicle-name.hbs | 10 ++- addon/components/table/foot.hbs | 4 +- addon/components/table/foot.js | 52 +++++++++++- addon/components/tabs.hbs | 2 +- addon/components/tabs/tab.hbs | 6 +- addon/components/timeline.hbs | 7 +- addon/components/toggle.hbs | 25 +++--- addon/components/unit-input.hbs | 16 +++- addon/components/upload-button.hbs | 14 ++-- addon/components/visible-column-picker.hbs | 22 +++++- addon/modifiers/vertical-offset-by.js | 8 +- addon/styles/layout/next.css | 2 +- addon/styles/layout/reset.css | 31 ++++++++ 105 files changed, 1483 insertions(+), 343 deletions(-) diff --git a/addon/components/array-input.hbs b/addon/components/array-input.hbs index b224993..ff9b0eb 100644 --- a/addon/components/array-input.hbs +++ b/addon/components/array-input.hbs @@ -9,7 +9,16 @@
{{#each this.data as |datum index|}}
- +
diff --git a/addon/components/aside-item-scroller.hbs b/addon/components/aside-item-scroller.hbs index a61271f..85bde0d 100644 --- a/addon/components/aside-item-scroller.hbs +++ b/addon/components/aside-item-scroller.hbs @@ -6,7 +6,18 @@ {{/if}}
- +
{{#each-in this.itemsGroupByTitleLetter as |key items|}}
@@ -22,12 +33,12 @@
{{/each}} - {{else}} -
-
-

No {{pluralize this.resource}}

-
+ {{else}} +
+
+

No {{pluralize this.resource}}

+
{{/each-in}}
@@ -39,7 +50,8 @@

{{this.title}}

- Search {{pluralize @items.length this.resource}} + Search + {{pluralize @items.length this.resource}}

@@ -67,13 +79,17 @@ {{/if}} {{#each-in this.itemsGroupByTitleLetter as |key items|}} -
+

{{capitalize key}}

    {{#each items as |item|}}
  • -
    +
    {{yield item}}
    @@ -81,19 +97,25 @@
    • {{/each}}
- {{else}} -
-
-

No {{pluralize this.resource}}

-
+ {{else}} +
+
+

No {{pluralize this.resource}}

+
{{/each-in}} {{#if @customBottomItemComponent}}