q2-tecton-elements 1.53.1 → 1.53.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/click-elsewhere_2.cjs.entry.js +73 -69
- package/dist/cjs/click-elsewhere_2.cjs.entry.js.map +1 -1
- package/dist/cjs/{index-07285783.js → index-7aecfed8.js} +30 -18
- package/dist/cjs/index-7aecfed8.js.map +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/q2-action-group.cjs.entry.js +2 -2
- package/dist/cjs/q2-action-sheet.cjs.entry.js +2 -2
- package/dist/cjs/q2-avatar.cjs.entry.js +1 -1
- package/dist/cjs/q2-badge_7.cjs.entry.js +4 -4
- package/dist/cjs/q2-calendar.cjs.entry.js +1 -1
- package/dist/cjs/q2-card.cjs.entry.js +1 -1
- package/dist/cjs/q2-carousel-pane.cjs.entry.js +3 -3
- package/dist/cjs/q2-carousel.cjs.entry.js +1 -1
- package/dist/cjs/q2-chart-area.cjs.entry.js +2 -2
- package/dist/cjs/q2-chart-bar.cjs.entry.js +2 -2
- package/dist/cjs/q2-chart-donut.cjs.entry.js +2 -2
- package/dist/cjs/q2-checkbox-group.cjs.entry.js +1 -1
- package/dist/cjs/q2-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/q2-currency.cjs.entry.js +1 -1
- package/dist/cjs/q2-data-table.cjs.entry.js +1 -1
- package/dist/cjs/q2-detail.cjs.entry.js +2 -2
- package/dist/cjs/q2-dropdown-item.cjs.entry.js +1 -1
- package/dist/cjs/q2-dropdown.cjs.entry.js +4 -2
- package/dist/cjs/q2-dropdown.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-editable-field.cjs.entry.js +1 -1
- package/dist/cjs/q2-example.cjs.entry.js +1 -1
- package/dist/cjs/q2-file-picker.cjs.entry.js +1 -1
- package/dist/cjs/q2-formatted-text.cjs.entry.js +1 -1
- package/dist/cjs/q2-item_3.cjs.entry.js +3 -3
- package/dist/cjs/q2-legend.cjs.entry.js +1 -1
- package/dist/cjs/q2-loc.cjs.entry.js +2 -2
- package/dist/cjs/q2-message.cjs.entry.js +2 -2
- package/dist/cjs/q2-month-picker.cjs.entry.js +3 -3
- package/dist/cjs/q2-optgroup.cjs.entry.js +2 -2
- package/dist/cjs/q2-option-list.cjs.entry.js +1 -1
- package/dist/cjs/q2-option.cjs.entry.js +2 -2
- package/dist/cjs/q2-pagination.cjs.entry.js +4 -4
- package/dist/cjs/q2-pill.cjs.entry.js +2 -2
- package/dist/cjs/q2-radio-group.cjs.entry.js +1 -1
- package/dist/cjs/q2-radio.cjs.entry.js +1 -1
- package/dist/cjs/q2-relative-time.cjs.entry.js +2 -2
- package/dist/cjs/q2-resize-observer.cjs.entry.js +1 -1
- package/dist/cjs/q2-section.cjs.entry.js +3 -3
- package/dist/cjs/q2-select.cjs.entry.js +130 -14
- package/dist/cjs/q2-select.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-stepper-pane.cjs.entry.js +1 -1
- package/dist/cjs/q2-stepper-vertical.cjs.entry.js +2 -2
- package/dist/cjs/q2-stepper.cjs.entry.js +2 -2
- package/dist/cjs/q2-tag.cjs.entry.js +2 -2
- package/dist/cjs/q2-tecton-elements.cjs.js +1 -1
- package/dist/cjs/q2-textarea.cjs.entry.js +2 -2
- package/dist/cjs/q2-tooltip.cjs.entry.js +1 -1
- package/dist/cjs/tecton-tab-pane.cjs.entry.js +2 -2
- package/dist/collection/components/click-elsewhere/click-elsewhere.js.map +1 -1
- package/dist/collection/components/click-elsewhere/test/click-elsewhere-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-action-group/q2-action-group.js +1 -1
- package/dist/collection/components/q2-action-group/q2-action-group.js.map +1 -1
- package/dist/collection/components/q2-action-group/test/q2-action-group.e2e.js.map +1 -1
- package/dist/collection/components/q2-action-group/test/q2-action-group.spec.js.map +1 -1
- package/dist/collection/components/q2-action-sheet/q2-action-sheet.js +1 -1
- package/dist/collection/components/q2-action-sheet/q2-action-sheet.js.map +1 -1
- package/dist/collection/components/q2-action-sheet/test/q2-action-sheet-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-avatar/q2-avatar.js +1 -1
- package/dist/collection/components/q2-avatar/q2-avatar.js.map +1 -1
- package/dist/collection/components/q2-avatar/test/q2-avatar-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-badge/q2-badge.js.map +1 -1
- package/dist/collection/components/q2-badge/test/q2-badge-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-btn/q2-btn.js.map +1 -1
- package/dist/collection/components/q2-btn/test/q2-btn-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-calendar/q2-calendar-helpers.js.map +1 -1
- package/dist/collection/components/q2-calendar/q2-calendar-types.js.map +1 -1
- package/dist/collection/components/q2-calendar/q2-calendar-validation.js.map +1 -1
- package/dist/collection/components/q2-calendar/q2-calendar.js.map +1 -1
- package/dist/collection/components/q2-calendar/q2-month-picker.js +2 -2
- package/dist/collection/components/q2-calendar/q2-month-picker.js.map +1 -1
- package/dist/collection/components/q2-calendar/test/helpers-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-calendar/test/q2-calendar-month-picker-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-calendar/test/q2-calendar-test.e2e.js +2 -2
- package/dist/collection/components/q2-calendar/test/q2-calendar-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-calendar/test/validation-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-card/q2-card.js.map +1 -1
- package/dist/collection/components/q2-card/test/q2-card-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-carousel/q2-carousel.js.map +1 -1
- package/dist/collection/components/q2-carousel/test/q2-carousel-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-carousel-pane/q2-carousel-pane.js +2 -2
- package/dist/collection/components/q2-carousel-pane/q2-carousel-pane.js.map +1 -1
- package/dist/collection/components/q2-carousel-pane/test/q2-carousel-pane-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-carousel-pane/test/q2-carousel-pane-test.spec.js.map +1 -1
- package/dist/collection/components/q2-chart-area/q2-chart-area.js +1 -1
- package/dist/collection/components/q2-chart-area/q2-chart-area.js.map +1 -1
- package/dist/collection/components/q2-chart-area/test/q2-chart-area-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-chart-bar/q2-chart-bar.js +1 -1
- package/dist/collection/components/q2-chart-bar/q2-chart-bar.js.map +1 -1
- package/dist/collection/components/q2-chart-bar/test/q2-chart-bar-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-chart-donut/q2-chart-donut.js +1 -1
- package/dist/collection/components/q2-chart-donut/q2-chart-donut.js.map +1 -1
- package/dist/collection/components/q2-chart-donut/test/q2-chart-donut-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-checkbox/q2-checkbox.js.map +1 -1
- package/dist/collection/components/q2-checkbox/test/q2-checkbox-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-checkbox-group/q2-checkbox-group.js.map +1 -1
- package/dist/collection/components/q2-checkbox-group/test/q2-checkbox-group-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-currency/q2-currency.js +1 -1
- package/dist/collection/components/q2-currency/q2-currency.js.map +1 -1
- package/dist/collection/components/q2-currency/test/q2-currency-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-data-table/q2-data-table.js.map +1 -1
- package/dist/collection/components/q2-data-table/test/q2-data-table-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-detail/q2-detail.js +1 -1
- package/dist/collection/components/q2-detail/q2-detail.js.map +1 -1
- package/dist/collection/components/q2-detail/test/q2-detail-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-dropdown/q2-dropdown.js +3 -1
- package/dist/collection/components/q2-dropdown/q2-dropdown.js.map +1 -1
- package/dist/collection/components/q2-dropdown/test/q2-dropdown-test.e2e.js +5 -17
- package/dist/collection/components/q2-dropdown/test/q2-dropdown-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-dropdown-item/q2-dropdown-item.js.map +1 -1
- package/dist/collection/components/q2-dropdown-item/test/q2-dropdown-item-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-editable-field/q2-editable-field.js.map +1 -1
- package/dist/collection/components/q2-editable-field/test/q2-editable-field-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-example/q2-example.js +1 -1
- package/dist/collection/components/q2-example/q2-example.js.map +1 -1
- package/dist/collection/components/q2-example/test/q2-example.e2e.js.map +1 -1
- package/dist/collection/components/q2-example/test/q2-example.spec.js.map +1 -1
- package/dist/collection/components/q2-file-picker/q2-file-picker.js.map +1 -1
- package/dist/collection/components/q2-file-picker/test/q2-file-picker-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-file-picker/test/q2-file-picker-test.spec.js.map +1 -1
- package/dist/collection/components/q2-formatted-text/q2-formatted-text.js +1 -1
- package/dist/collection/components/q2-formatted-text/q2-formatted-text.js.map +1 -1
- package/dist/collection/components/q2-formatted-text/test/q2-formatted-text-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-icon/q2-icon-types.js.map +1 -1
- package/dist/collection/components/q2-icon/q2-icon.js.map +1 -1
- package/dist/collection/components/q2-icon/test/q2-icon-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/alpha.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/alpha.spec.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/alphanumeric.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/alphanumeric.spec.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/credit-card.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/credit-card.spec.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/currency.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/currency.spec.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/date.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/date.spec.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/generic.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/number.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/numeric.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/numeric.spec.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/phone.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/phone.spec.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/postal.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/postal.spec.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/ssn.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/ssn.spec.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/tin.js.map +1 -1
- package/dist/collection/components/q2-input/formatting/tin.spec.js.map +1 -1
- package/dist/collection/components/q2-input/q2-input-types.js.map +1 -1
- package/dist/collection/components/q2-input/q2-input.js +1 -1
- package/dist/collection/components/q2-input/q2-input.js.map +1 -1
- package/dist/collection/components/q2-input/test/q2-input-credit-card-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-input/test/q2-input-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-input/test/q2-input-test.spec.js.map +1 -1
- package/dist/collection/components/q2-item/q2-item.js +1 -1
- package/dist/collection/components/q2-item/q2-item.js.map +1 -1
- package/dist/collection/components/q2-item/test/q2-item-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-item/test/q2-item-test.spec.js.map +1 -1
- package/dist/collection/components/q2-legend/q2-legend.js +1 -1
- package/dist/collection/components/q2-legend/q2-legend.js.map +1 -1
- package/dist/collection/components/q2-legend/test/q2-legend-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-legend/test/q2-legend-test.spec.js.map +1 -1
- package/dist/collection/components/q2-link/q2-link.js.map +1 -1
- package/dist/collection/components/q2-link/test/q2-link-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-list/q2-list.js +1 -1
- package/dist/collection/components/q2-list/q2-list.js.map +1 -1
- package/dist/collection/components/q2-list/test/q2-list-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-loading/q2-loading.js.map +1 -1
- package/dist/collection/components/q2-loading/skeleton/q2-loading-element/index.js.map +1 -1
- package/dist/collection/components/q2-loading/skeleton/shapes.js.map +1 -1
- package/dist/collection/components/q2-loading/test/q2-loading-element-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-loading/test/q2-loading-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-loc/q2-loc.js +1 -1
- package/dist/collection/components/q2-loc/q2-loc.js.map +1 -1
- package/dist/collection/components/q2-loc/test/q2-loc-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-loc/test/q2-loc-test.spec.js.map +1 -1
- package/dist/collection/components/q2-message/q2-message.js +1 -1
- package/dist/collection/components/q2-message/q2-message.js.map +1 -1
- package/dist/collection/components/q2-message/test/q2-message-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-optgroup/q2-optgroup.js +1 -1
- package/dist/collection/components/q2-optgroup/q2-optgroup.js.map +1 -1
- package/dist/collection/components/q2-optgroup/test/q2-optgroup-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-option/q2-option.js +1 -1
- package/dist/collection/components/q2-option/q2-option.js.map +1 -1
- package/dist/collection/components/q2-option/test/q2-option-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-option/test/q2-option-test.spec.js.map +1 -1
- package/dist/collection/components/q2-option-list/q2-option-list.js.map +1 -1
- package/dist/collection/components/q2-option-list/test/q2-option-list-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-pagination/q2-pagination.js +3 -3
- package/dist/collection/components/q2-pagination/q2-pagination.js.map +1 -1
- package/dist/collection/components/q2-pagination/test/q2-pagination-test.e2e.js +1 -0
- package/dist/collection/components/q2-pagination/test/q2-pagination-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-pill/q2-pill.js +1 -1
- package/dist/collection/components/q2-pill/q2-pill.js.map +1 -1
- package/dist/collection/components/q2-pill/test/q2-pill-test.e2e.js +2 -2
- package/dist/collection/components/q2-pill/test/q2-pill-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-popover/q2-popover.css +18 -10
- package/dist/collection/components/q2-popover/q2-popover.js +74 -69
- package/dist/collection/components/q2-popover/q2-popover.js.map +1 -1
- package/dist/collection/components/q2-popover/test/q2-popover-test.e2e.js +1 -34
- package/dist/collection/components/q2-popover/test/q2-popover-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-popover/test/q2-popover-test.spec.js +902 -511
- package/dist/collection/components/q2-popover/test/q2-popover-test.spec.js.map +1 -1
- package/dist/collection/components/q2-radio/q2-radio.js.map +1 -1
- package/dist/collection/components/q2-radio/test/q2-radio-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-radio-group/q2-radio-group.js.map +1 -1
- package/dist/collection/components/q2-radio-group/test/q2-radio-group-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-relative-time/q2-relative-time.js +1 -1
- package/dist/collection/components/q2-relative-time/q2-relative-time.js.map +1 -1
- package/dist/collection/components/q2-relative-time/test/q2-relative-time-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-resize-observer/q2-resize-observer.js +1 -1
- package/dist/collection/components/q2-resize-observer/q2-resize-observer.js.map +1 -1
- package/dist/collection/components/q2-resize-observer/test/q2-resize-observer.e2e.js.map +1 -1
- package/dist/collection/components/q2-resize-observer/test/q2-resize-observer.spec.js.map +1 -1
- package/dist/collection/components/q2-section/q2-section.js +2 -2
- package/dist/collection/components/q2-section/q2-section.js.map +1 -1
- package/dist/collection/components/q2-section/test/q2-section-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-select/q2-select.js +151 -16
- package/dist/collection/components/q2-select/q2-select.js.map +1 -1
- package/dist/collection/components/q2-select/test/q2-select-test.e2e.js +1 -1
- package/dist/collection/components/q2-select/test/q2-select-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-select/test/q2-select-test.spec.js +552 -0
- package/dist/collection/components/q2-select/test/q2-select-test.spec.js.map +1 -0
- package/dist/collection/components/q2-stepper/q2-stepper.js +1 -1
- package/dist/collection/components/q2-stepper/q2-stepper.js.map +1 -1
- package/dist/collection/components/q2-stepper/test/q2-stepper-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-stepper-pane/q2-stepper-pane.js.map +1 -1
- package/dist/collection/components/q2-stepper-pane/test/q2-stepper-pane-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-stepper-vertical/q2-stepper-vertical.js +1 -1
- package/dist/collection/components/q2-stepper-vertical/q2-stepper-vertical.js.map +1 -1
- package/dist/collection/components/q2-stepper-vertical/test/q2-stepper-vertical-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-tab-container/q2-tab-container.js +1 -1
- package/dist/collection/components/q2-tab-container/q2-tab-container.js.map +1 -1
- package/dist/collection/components/q2-tab-container/test/q2-tab-container-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-tab-container/test/q2-tab-container-test.spec.js.map +1 -1
- package/dist/collection/components/q2-tab-pane/q2-tab-pane.js +1 -1
- package/dist/collection/components/q2-tab-pane/q2-tab-pane.js.map +1 -1
- package/dist/collection/components/q2-tab-pane/test/q2-tab-pane-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-tag/q2-tag.js +1 -1
- package/dist/collection/components/q2-tag/q2-tag.js.map +1 -1
- package/dist/collection/components/q2-tag/test/q2-tag-test.e2e.js +6 -1
- package/dist/collection/components/q2-tag/test/q2-tag-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-textarea/q2-textarea.js +1 -1
- package/dist/collection/components/q2-textarea/q2-textarea.js.map +1 -1
- package/dist/collection/components/q2-textarea/test/q2-textarea-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-tooltip/q2-tooltip.js.map +1 -1
- package/dist/collection/components/q2-tooltip/test/q2-tooltip-test.e2e.js.map +1 -1
- package/dist/collection/components/tecton-tab-pane/tecton-tab-pane-types.js.map +1 -1
- package/dist/collection/components/tecton-tab-pane/tecton-tab-pane.js +2 -2
- package/dist/collection/components/tecton-tab-pane/tecton-tab-pane.js.map +1 -1
- package/dist/collection/components/tecton-tab-pane/test/tecton-tab-pane-test.e2e.js.map +1 -1
- package/dist/collection/index.js.map +1 -1
- package/dist/collection/utils/action-sheet.js.map +1 -1
- package/dist/collection/utils/charting.js.map +1 -1
- package/dist/collection/utils/helpers.js.map +1 -1
- package/dist/collection/utils/index.js +37 -0
- package/dist/collection/utils/index.js.map +1 -1
- package/dist/collection/utils/sanitize-html-string.js.map +1 -1
- package/dist/collection/utils/sanitize-regex-string.js.map +1 -1
- package/dist/collection/utils/test/action-sheet-test.e2e.js.map +1 -1
- package/dist/collection/utils/test/index.spec.js.map +1 -1
- package/dist/components/index2.js +29 -17
- package/dist/components/index2.js.map +1 -1
- package/dist/components/q2-action-group.js +1 -1
- package/dist/components/q2-action-sheet.js +1 -1
- package/dist/components/q2-avatar2.js +1 -1
- package/dist/components/q2-carousel-pane.js +2 -2
- package/dist/components/q2-chart-area.js +1 -1
- package/dist/components/q2-chart-bar.js +1 -1
- package/dist/components/q2-chart-donut.js +1 -1
- package/dist/components/q2-currency.js +1 -1
- package/dist/components/q2-detail.js +1 -1
- package/dist/components/q2-dropdown.js +3 -1
- package/dist/components/q2-dropdown.js.map +1 -1
- package/dist/components/q2-example.js +1 -1
- package/dist/components/q2-formatted-text.js +1 -1
- package/dist/components/q2-input2.js +1 -1
- package/dist/components/q2-item2.js +1 -1
- package/dist/components/q2-legend2.js +1 -1
- package/dist/components/q2-list2.js +1 -1
- package/dist/components/q2-loc.js +1 -1
- package/dist/components/q2-message2.js +1 -1
- package/dist/components/q2-month-picker.js +2 -2
- package/dist/components/q2-optgroup2.js +1 -1
- package/dist/components/q2-option2.js +1 -1
- package/dist/components/q2-pagination.js +3 -3
- package/dist/components/q2-pill.js +1 -1
- package/dist/components/q2-popover2.js +73 -69
- package/dist/components/q2-popover2.js.map +1 -1
- package/dist/components/q2-relative-time.js +1 -1
- package/dist/components/q2-resize-observer2.js +1 -1
- package/dist/components/q2-section.js +2 -2
- package/dist/components/q2-select2.js +133 -17
- package/dist/components/q2-select2.js.map +1 -1
- package/dist/components/q2-stepper-vertical.js +1 -1
- package/dist/components/q2-stepper.js +1 -1
- package/dist/components/q2-tab-container.js +1 -1
- package/dist/components/q2-tab-pane.js +1 -1
- package/dist/components/q2-tag.js +1 -1
- package/dist/components/q2-textarea.js +1 -1
- package/dist/components/tecton-tab-pane.js +2 -2
- package/dist/esm/click-elsewhere_2.entry.js +73 -69
- package/dist/esm/click-elsewhere_2.entry.js.map +1 -1
- package/dist/esm/{index-d18e2a20.js → index-99c46474.js} +30 -18
- package/dist/esm/index-99c46474.js.map +1 -0
- package/dist/esm/loader.js +1 -1
- package/dist/esm/q2-action-group.entry.js +2 -2
- package/dist/esm/q2-action-sheet.entry.js +2 -2
- package/dist/esm/q2-avatar.entry.js +1 -1
- package/dist/esm/q2-badge_7.entry.js +4 -4
- package/dist/esm/q2-calendar.entry.js +1 -1
- package/dist/esm/q2-card.entry.js +1 -1
- package/dist/esm/q2-carousel-pane.entry.js +3 -3
- package/dist/esm/q2-carousel.entry.js +1 -1
- package/dist/esm/q2-chart-area.entry.js +2 -2
- package/dist/esm/q2-chart-bar.entry.js +2 -2
- package/dist/esm/q2-chart-donut.entry.js +2 -2
- package/dist/esm/q2-checkbox-group.entry.js +1 -1
- package/dist/esm/q2-checkbox.entry.js +1 -1
- package/dist/esm/q2-currency.entry.js +1 -1
- package/dist/esm/q2-data-table.entry.js +1 -1
- package/dist/esm/q2-detail.entry.js +2 -2
- package/dist/esm/q2-dropdown-item.entry.js +1 -1
- package/dist/esm/q2-dropdown.entry.js +4 -2
- package/dist/esm/q2-dropdown.entry.js.map +1 -1
- package/dist/esm/q2-editable-field.entry.js +1 -1
- package/dist/esm/q2-example.entry.js +1 -1
- package/dist/esm/q2-file-picker.entry.js +1 -1
- package/dist/esm/q2-formatted-text.entry.js +1 -1
- package/dist/esm/q2-item_3.entry.js +3 -3
- package/dist/esm/q2-legend.entry.js +1 -1
- package/dist/esm/q2-loc.entry.js +2 -2
- package/dist/esm/q2-message.entry.js +2 -2
- package/dist/esm/q2-month-picker.entry.js +3 -3
- package/dist/esm/q2-optgroup.entry.js +2 -2
- package/dist/esm/q2-option-list.entry.js +1 -1
- package/dist/esm/q2-option.entry.js +2 -2
- package/dist/esm/q2-pagination.entry.js +4 -4
- package/dist/esm/q2-pill.entry.js +2 -2
- package/dist/esm/q2-radio-group.entry.js +1 -1
- package/dist/esm/q2-radio.entry.js +1 -1
- package/dist/esm/q2-relative-time.entry.js +2 -2
- package/dist/esm/q2-resize-observer.entry.js +1 -1
- package/dist/esm/q2-section.entry.js +3 -3
- package/dist/esm/q2-select.entry.js +131 -15
- package/dist/esm/q2-select.entry.js.map +1 -1
- package/dist/esm/q2-stepper-pane.entry.js +1 -1
- package/dist/esm/q2-stepper-vertical.entry.js +2 -2
- package/dist/esm/q2-stepper.entry.js +2 -2
- package/dist/esm/q2-tag.entry.js +2 -2
- package/dist/esm/q2-tecton-elements.js +1 -1
- package/dist/esm/q2-textarea.entry.js +2 -2
- package/dist/esm/q2-tooltip.entry.js +1 -1
- package/dist/esm/tecton-tab-pane.entry.js +2 -2
- package/dist/jest.setup.js +33 -0
- package/dist/jest.setup.js.map +1 -0
- package/dist/q2-tecton-elements/click-elsewhere_2.entry.js +103 -92
- package/dist/q2-tecton-elements/click-elsewhere_2.entry.js.map +1 -1
- package/dist/q2-tecton-elements/{index-d18e2a20.js → index-99c46474.js} +24 -17
- package/dist/q2-tecton-elements/index-99c46474.js.map +1 -0
- package/dist/q2-tecton-elements/q2-action-group.entry.js +4 -4
- package/dist/q2-tecton-elements/q2-action-sheet.entry.js +34 -34
- package/dist/q2-tecton-elements/q2-avatar.entry.js +6 -6
- package/dist/q2-tecton-elements/q2-badge_7.entry.js +17 -17
- package/dist/q2-tecton-elements/q2-calendar.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-card.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-carousel-pane.entry.js +21 -21
- package/dist/q2-tecton-elements/q2-carousel.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-chart-area.entry.js +3 -3
- package/dist/q2-tecton-elements/q2-chart-bar.entry.js +80 -80
- package/dist/q2-tecton-elements/q2-chart-donut.entry.js +101 -101
- package/dist/q2-tecton-elements/q2-checkbox-group.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-checkbox.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-currency.entry.js +6 -6
- package/dist/q2-tecton-elements/q2-data-table.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-detail.entry.js +39 -39
- package/dist/q2-tecton-elements/q2-dropdown-item.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-dropdown.entry.js +13 -11
- package/dist/q2-tecton-elements/q2-dropdown.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-editable-field.entry.js +8 -8
- package/dist/q2-tecton-elements/q2-example.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-file-picker.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-formatted-text.entry.js +2 -2
- package/dist/q2-tecton-elements/q2-item_3.entry.js +19 -19
- package/dist/q2-tecton-elements/q2-legend.entry.js +2 -2
- package/dist/q2-tecton-elements/q2-loc.entry.js +2 -2
- package/dist/q2-tecton-elements/q2-message.entry.js +21 -21
- package/dist/q2-tecton-elements/q2-month-picker.entry.js +14 -14
- package/dist/q2-tecton-elements/q2-optgroup.entry.js +8 -8
- package/dist/q2-tecton-elements/q2-option-list.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-option.entry.js +14 -14
- package/dist/q2-tecton-elements/q2-pagination.entry.js +34 -34
- package/dist/q2-tecton-elements/q2-pill.entry.js +14 -14
- package/dist/q2-tecton-elements/q2-radio-group.entry.js +5 -5
- package/dist/q2-tecton-elements/q2-radio.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-relative-time.entry.js +2 -2
- package/dist/q2-tecton-elements/q2-resize-observer.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-section.entry.js +19 -19
- package/dist/q2-tecton-elements/q2-select.entry.js +196 -93
- package/dist/q2-tecton-elements/q2-select.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-stepper-pane.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-stepper-vertical.entry.js +37 -37
- package/dist/q2-tecton-elements/q2-stepper.entry.js +29 -29
- package/dist/q2-tecton-elements/q2-tag.entry.js +25 -25
- package/dist/q2-tecton-elements/q2-tecton-elements.esm.js +1 -1
- package/dist/q2-tecton-elements/q2-tecton-elements.esm.js.map +1 -1
- package/dist/q2-tecton-elements/q2-textarea.entry.js +3 -3
- package/dist/q2-tecton-elements/q2-tooltip.entry.js +1 -1
- package/dist/q2-tecton-elements/tecton-tab-pane.entry.js +6 -6
- package/dist/types/builds/q2e/development/tecton/tecton/packages/q2-tecton-elements/.stencil/jest.setup.d.ts +10 -0
- package/dist/types/components/q2-popover/q2-popover.d.ts +4 -4
- package/dist/types/components/q2-select/q2-select.d.ts +23 -0
- package/dist/types/utils/index.d.ts +3 -0
- package/package.json +3 -3
- package/dist/cjs/index-07285783.js.map +0 -1
- package/dist/esm/index-d18e2a20.js.map +0 -1
- package/dist/q2-tecton-elements/index-d18e2a20.js.map +0 -1
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import { r as
|
|
1
|
+
import { r as t, h as e, g as i } from "./index-7a5365e2.js";
|
|
2
2
|
|
|
3
|
-
import { e as l, l as s } from "./index-
|
|
3
|
+
import { e as l, l as s } from "./index-99c46474.js";
|
|
4
4
|
|
|
5
5
|
const a = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block}::slotted([slot]){display:flex;align-items:center;--tct-icon-size:var(--tct-detail-label-icon-size, 16px)}.detail{column-gap:var(--tct-detail-gap-column, var(--app-scale-1x, 5px));row-gap:var(--tct-detail-gap-row, 0px)}.detail-block{display:flex;width:100%}.detail-inline{display:flex}.detail-horizontal{align-items:var(--tct-detail-vertical-alignment, baseline);flex-direction:row}.detail-stacked{flex-direction:column}.detail-stacked-alignment-left{align-items:flex-start}.detail-stacked-alignment-right{align-items:flex-end}.label{flex:1;text-align:left;line-height:1.5;color:var(--tct-detail-label-font-color, #141430)}.label-size-xsmall{color:var(--tct-detail-label-xsmall-font-color, #6f6f82);font-size:var(--tct-detail-label-xsmall-font-size, 14px)}.label-size-small{color:var(--tct-detail-label-small-font-color);font-size:var(--tct-detail-label-small-font-size, 14px)}.label-size-medium{color:var(--tct-detail-label-medium-font-color);font-size:var(--tct-detail-label-medium-font-size, 14px)}.label-size-large{color:var(--tct-detail-label-large-font-color);font-size:var(--tct-detail-label-large-font-size, 16px)}.label-size-xlarge{color:var(--tct-detail-label-xlarge-font-color);font-size:var(--tct-detail-label-xlarge-font-size, 18px)}.label-size-inline{font-size:var(--tct-detail-label-inline-font-size, 1em);color:inherit}.description{flex:1;display:flex;align-items:center;line-height:1.5;color:var(--tct-detail-description-font-color, #141430);column-gap:var(--tct-detail-description-gap-column, var(--app-scale-1x, 5px))}.description-alignment-right{justify-content:flex-end}.description-size-xsmall{color:var(--tct-detail-description-xsmall-font-color, #6f6f82);font-size:var(--tct-detail-description-xsmall-font-size, 14px)}.description-size-small{color:var(--tct-detail-description-small-font-color);font-size:var(--tct-detail-description-small-font-size, 14px)}.description-size-medium{color:var(--tct-detail-description-medium-font-color);font-size:var(--tct-detail-description-medium-font-size, 24px)}.description-size-large{color:var(--tct-detail-description-large-font-color);font-size:var(--tct-detail-description-large-font-size, 28px)}.description-size-xlarge{color:var(--tct-detail-description-xlarge-font-color);font-size:var(--tct-detail-description-xlarge-font-size, 32px)}.description-size-inline{font-size:var(--tct-detail-description-inline-font-size, 1em);color:inherit}";
|
|
6
6
|
|
|
7
7
|
const o = a;
|
|
8
8
|
|
|
9
9
|
const n = class {
|
|
10
|
-
constructor(
|
|
11
|
-
|
|
10
|
+
constructor(e) {
|
|
11
|
+
t(this, e);
|
|
12
12
|
this.alignment = "left";
|
|
13
13
|
this.description = undefined;
|
|
14
14
|
this.label = undefined;
|
|
@@ -23,36 +23,36 @@ const n = class {
|
|
|
23
23
|
// #endregion
|
|
24
24
|
// #region Local Methods
|
|
25
25
|
get descriptionClasses() {
|
|
26
|
-
const
|
|
26
|
+
const t = [ "description" ];
|
|
27
27
|
if (this.size) {
|
|
28
|
-
|
|
28
|
+
t.push(`description-size-${this.size}`);
|
|
29
29
|
} else {
|
|
30
|
-
|
|
30
|
+
t.push(`description-size-inline`);
|
|
31
31
|
}
|
|
32
32
|
if (!this.stacked) {
|
|
33
|
-
|
|
33
|
+
t.push(`description-alignment-right`);
|
|
34
34
|
}
|
|
35
|
-
return
|
|
35
|
+
return t.join(" ");
|
|
36
36
|
}
|
|
37
37
|
get detailClasses() {
|
|
38
|
-
const
|
|
38
|
+
const t = [ "detail" ];
|
|
39
39
|
if (this.size) {
|
|
40
|
-
|
|
40
|
+
t.push(`detail-block`);
|
|
41
41
|
} else {
|
|
42
|
-
|
|
42
|
+
t.push(`detail-inline`);
|
|
43
43
|
}
|
|
44
44
|
if (this.stacked || this.onlyHasDescripiton || this.onlyHasLabel) {
|
|
45
|
-
|
|
45
|
+
t.push("detail-stacked", `detail-stacked-alignment-${this.alignment}`);
|
|
46
46
|
} else {
|
|
47
|
-
|
|
47
|
+
t.push("detail-horizontal");
|
|
48
48
|
}
|
|
49
|
-
return
|
|
49
|
+
return t.join(" ");
|
|
50
50
|
}
|
|
51
51
|
get hasDefaultSlotContent() {
|
|
52
|
-
const
|
|
53
|
-
const
|
|
52
|
+
const t = !!this.hostElement.innerHTML.trim();
|
|
53
|
+
const e = this.hostElement.querySelectorAll(":scope > [slot]").length;
|
|
54
54
|
const i = this.hostElement.childNodes.length;
|
|
55
|
-
return
|
|
55
|
+
return t && i > e;
|
|
56
56
|
}
|
|
57
57
|
get hasDescripiton() {
|
|
58
58
|
return !!this.description || this.hasDefaultSlotContent;
|
|
@@ -64,16 +64,16 @@ const n = class {
|
|
|
64
64
|
return l(this.hostElement, "label");
|
|
65
65
|
}
|
|
66
66
|
get labelClasses() {
|
|
67
|
-
const
|
|
67
|
+
const t = [ "label" ];
|
|
68
68
|
if (this.size) {
|
|
69
|
-
|
|
69
|
+
t.push(`label-size-${this.size}`);
|
|
70
70
|
} else {
|
|
71
|
-
|
|
71
|
+
t.push(`label-size-inline`);
|
|
72
72
|
}
|
|
73
73
|
if (!this.stacked) {
|
|
74
|
-
|
|
74
|
+
t.push(`label-align-left`);
|
|
75
75
|
}
|
|
76
|
-
return
|
|
76
|
+
return t.join(" ");
|
|
77
77
|
}
|
|
78
78
|
get onlyHasDescripiton() {
|
|
79
79
|
return this.hasDescripiton && !this.hasLabel;
|
|
@@ -82,40 +82,40 @@ const n = class {
|
|
|
82
82
|
return this.hasLabel && !this.hasDescripiton;
|
|
83
83
|
}
|
|
84
84
|
setSlotSizeProps() {
|
|
85
|
-
const
|
|
86
|
-
|
|
87
|
-
let
|
|
88
|
-
if (
|
|
89
|
-
switch (
|
|
85
|
+
const t = Array.from(this.hostElement.querySelectorAll(':scope > *:not([slot]), :scope > [slot="label"] > *'));
|
|
86
|
+
t.forEach((t => {
|
|
87
|
+
let e = this.size;
|
|
88
|
+
if (t.localName === "q2-currency") {
|
|
89
|
+
switch (e) {
|
|
90
90
|
case "xsmall":
|
|
91
|
-
|
|
91
|
+
e = "small";
|
|
92
92
|
break;
|
|
93
93
|
|
|
94
94
|
case "xlarge":
|
|
95
|
-
|
|
95
|
+
e = "large";
|
|
96
96
|
break;
|
|
97
97
|
}
|
|
98
98
|
}
|
|
99
|
-
|
|
99
|
+
t.slotSize = e;
|
|
100
100
|
}));
|
|
101
101
|
}
|
|
102
102
|
// #endregion
|
|
103
103
|
// #region Render Methods
|
|
104
104
|
render() {
|
|
105
|
-
return
|
|
106
|
-
key: "
|
|
105
|
+
return e("div", {
|
|
106
|
+
key: "811c54a224bbbefce94cbf397a29a4cb1f98ba2b",
|
|
107
107
|
class: this.detailClasses
|
|
108
|
-
}, this.hasLabel &&
|
|
109
|
-
key: "
|
|
108
|
+
}, this.hasLabel && e("div", {
|
|
109
|
+
key: "b2c294eb4c1b5cd525351dc67c2dc58ed4b75b70",
|
|
110
110
|
class: this.labelClasses,
|
|
111
111
|
"aria-describedby": !!this.description ? "label-description" : undefined
|
|
112
|
-
}, !!this.label ? s(this.label) : this.hasLabelSlotContent ?
|
|
112
|
+
}, !!this.label ? s(this.label) : this.hasLabelSlotContent ? e("slot", {
|
|
113
113
|
name: "label"
|
|
114
|
-
}) : ""), this.hasDescripiton &&
|
|
115
|
-
key: "
|
|
114
|
+
}) : ""), this.hasDescripiton && e("div", {
|
|
115
|
+
key: "9d979c672eeefd21882fa676483cd8020e15dc7c",
|
|
116
116
|
id: "label-description",
|
|
117
117
|
class: this.descriptionClasses
|
|
118
|
-
}, !!this.description ? s(this.description) : this.hasDefaultSlotContent ?
|
|
118
|
+
}, !!this.description ? s(this.description) : this.hasDefaultSlotContent ? e("slot", null) : ""));
|
|
119
119
|
}
|
|
120
120
|
get hostElement() {
|
|
121
121
|
return i(this);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as t, h as o, g as e } from "./index-7a5365e2.js";
|
|
2
2
|
|
|
3
|
-
import { l as r, a as i } from "./index-
|
|
3
|
+
import { l as r, a as i } from "./index-99c46474.js";
|
|
4
4
|
|
|
5
5
|
const d = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}.dropdown-separator{--comp-default-separator-margin:0 var(--tct-scale-1, var(--app-scale-3x, 15px));margin:var(--tct-dropdown-separator-margin, var(--t-dropdown-separator-margin, var(--comp-default-separator-margin)));border-bottom:1px solid var(--tct-dropdown-item-separator-color, var(--t-dropdown-item-separator-color, var(--tct-gray-11, var(--t-gray-11, var(--tct-gray-l1, var(--app-gray-l1, #cccccc))))))}.dropdown-item-wrapper{display:flex}.dropdown-item-button{--comp-dropdown-item-tween:var(--tct-tween-1, var(--app-tween-1, cubic-bezier(0.4, 0, 0.2, 1)));margin:var(--tct-scale-0, var(--app-scale-0x, 0));padding:var(--tct-scale-0, var(--app-scale-0x, 0));min-height:44px;min-width:44px;border:none;background:transparent;outline:0;transition:var(--tct-dropdown-item-tween, var(--comp-dropdown-item-tween));transition-property:background, color, box-shadow, fill, border-color, border-width}.dropdown-item-button:disabled{opacity:var(--tct-dropdown-item-disabled-opacity, var(--tct-disabled-opacity, var(--app-disabled-opacity, 0.4)));cursor:not-allowed}.dropdown-item{--comp-default-dropdown-item-padding:var(--app-scale-2x, 10px) var(--app-scale-3x, 15px);flex:1;text-align:left;padding:var(--tct-dropdown-item-padding, var(--t-dropdown-item-padding, var(--comp-default-dropdown-item-padding)));background:var(--tct-dropdown-item-background, var(--tct-dropdown-item-bg, var(--t-dropdown-item-bg, var(--tct-white, var(--t-base, var(--app-white, #ffffff))))));color:var(--tct-dropdown-item-font-color, var(--t-dropdown-item-font-color, inherit));overflow:hidden;text-overflow:ellipsis}:host(:not([disabled])) .remove-dropdown-item:hover,:host(:not([disabled])) .remove-dropdown-item:focus,:host(:not([disabled])) .dropdown-item:hover,:host(:not([disabled])) .dropdown-item:focus{background:var(--tct-dropdown-item-hover-background, var(--tct-dropdown-item-selected-bg, var(--t-dropdown-item-selected-bg, var(--tct-gray-14, var(--t-gray-14, var(--tct-gray-l3, var(--app-gray-l3, var(--t-base, #f2f2f2))))))))}:host(:not([disabled])) .dropdown-item:hover,:host(:not([disabled])) .dropdown-item:focus{color:var(--tct-dropdown-item-hover-color, var(--tct-dropdown-item-selected-font-color, var(--t-dropdown-item-selected-font-color, inherit)))}:host(:not([disabled])) .dropdown-item:focus,:host(:not([disabled])) .remove-dropdown-item:focus{box-shadow:var(--tct-dropdown-item-focus-box-shadow, var(--const-inset-double-focus-ring, inset 0 0 0 2px var(--t-base), inset 0 0 0 4px var(--const-focus-color), inset 0 0 0 6px var(--t-base)))}.remove-dropdown-item{flex:0 0 44px}";
|
|
6
6
|
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { r as t, h as e, F as i, g as n } from "./index-7a5365e2.js";
|
|
2
2
|
|
|
3
|
-
import { w as s, o, i as r, j as a, a as d, l as h } from "./index-
|
|
3
|
+
import { w as s, o, i as r, j as a, a as d, l as h } from "./index-99c46474.js";
|
|
4
4
|
|
|
5
|
-
const
|
|
5
|
+
const c = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline-flex}:host([block]){display:block}q2-icon{pointer-events:none;margin-block:-100px}click-elsewhere{position:relative;display:block}q2-popover{--tct-popover-min-width:var(--tct-dropdown-width, var(--t-dropdown-width))}";
|
|
6
6
|
|
|
7
|
-
const
|
|
7
|
+
const l = c;
|
|
8
8
|
|
|
9
9
|
const u = class {
|
|
10
10
|
constructor(e) {
|
|
@@ -69,6 +69,7 @@ const u = class {
|
|
|
69
69
|
}
|
|
70
70
|
};
|
|
71
71
|
this.onToggleClick = () => {
|
|
72
|
+
this.popoverElement.controlElement = this.controlElement;
|
|
72
73
|
if (this.open) {
|
|
73
74
|
this.closeDropdown();
|
|
74
75
|
} else {
|
|
@@ -76,6 +77,7 @@ const u = class {
|
|
|
76
77
|
}
|
|
77
78
|
};
|
|
78
79
|
this.onToggleKeydown = async t => {
|
|
80
|
+
this.popoverElement.controlElement = this.controlElement;
|
|
79
81
|
switch (t.key) {
|
|
80
82
|
case "ArrowUp":
|
|
81
83
|
t.preventDefault();
|
|
@@ -255,7 +257,7 @@ const u = class {
|
|
|
255
257
|
const a = this.open;
|
|
256
258
|
const d = !!this.disabled;
|
|
257
259
|
const h = this.open;
|
|
258
|
-
const
|
|
260
|
+
const c = !n && !s && !r ? "unstyled" : "";
|
|
259
261
|
return {
|
|
260
262
|
icon: n,
|
|
261
263
|
fab: s,
|
|
@@ -263,7 +265,7 @@ const u = class {
|
|
|
263
265
|
active: a,
|
|
264
266
|
disabled: d,
|
|
265
267
|
ariaExpanded: h,
|
|
266
|
-
className:
|
|
268
|
+
className: c,
|
|
267
269
|
custom: o
|
|
268
270
|
};
|
|
269
271
|
}
|
|
@@ -352,12 +354,12 @@ const u = class {
|
|
|
352
354
|
render() {
|
|
353
355
|
const t = this.toggleButtonProps;
|
|
354
356
|
return e("click-elsewhere", {
|
|
355
|
-
key: "
|
|
357
|
+
key: "e83fd5a2a75b1e963930da8eb75b967cb4f97eb3",
|
|
356
358
|
class: this.open ? "dropdown-open" : "",
|
|
357
359
|
onChange: this.onClickElsewhere,
|
|
358
360
|
"test-id": "dropdownContainer"
|
|
359
361
|
}, e("q2-btn", {
|
|
360
|
-
key: "
|
|
362
|
+
key: "ed6b0e6ca0785be6e4d35c1a02aec0e6e2d8ae4d",
|
|
361
363
|
ref: t => this.controlElement = t,
|
|
362
364
|
class: t.className,
|
|
363
365
|
onClick: this.onToggleClick,
|
|
@@ -383,7 +385,7 @@ const u = class {
|
|
|
383
385
|
}) : " ", this.label && !this.hideLabel && e("span", {
|
|
384
386
|
class: "dropdown-button-text"
|
|
385
387
|
}, h(this.label)))), e("q2-popover", {
|
|
386
|
-
key: "
|
|
388
|
+
key: "0cb61bd6326f75533e76d18d95e7c9e591abe160",
|
|
387
389
|
ref: t => this.popoverElement = t,
|
|
388
390
|
controlElement: this.controlElement,
|
|
389
391
|
open: this.open,
|
|
@@ -394,13 +396,13 @@ const u = class {
|
|
|
394
396
|
mode: this.popoverMode || undefined,
|
|
395
397
|
block: this.block
|
|
396
398
|
}, e("div", {
|
|
397
|
-
key: "
|
|
399
|
+
key: "afb21f6a1a8ec020ca1a7c008bf9dea003b291fb",
|
|
398
400
|
onClick: this.onDropdownMenuClick,
|
|
399
401
|
onKeyDown: this.onDropdownMenuKeydown,
|
|
400
402
|
role: "menu",
|
|
401
403
|
"aria-label": h(this.label) || undefined
|
|
402
404
|
}, e("slot", {
|
|
403
|
-
key: "
|
|
405
|
+
key: "ed769744aea9c93fd2caaabd0c3c9e21084382c5"
|
|
404
406
|
}))));
|
|
405
407
|
}
|
|
406
408
|
get hostElement() {
|
|
@@ -420,7 +422,7 @@ const u = class {
|
|
|
420
422
|
}
|
|
421
423
|
};
|
|
422
424
|
|
|
423
|
-
u.style =
|
|
425
|
+
u.style = l;
|
|
424
426
|
|
|
425
427
|
export { u as q2_dropdown };
|
|
426
428
|
//# sourceMappingURL=q2-dropdown.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["q2DropdownCss","Q2DropdownStyle0","Q2Dropdown","this","dropdownItemSelector","closeDropdown","open","focusFirstItem","async","firstItem","hostElement","querySelector","waitForNextPaint","dispatchEvent","FocusEvent","focusLastItem","lastItem","focusToggle","controlElement","focus","onClickElsewhere","event","target","localName","stopPropagation","popoverElement","onDropdownMenuClick","item","disabled","separator","onDropdownMenuKeydown","key","preventDefault","focusAdjacentItem","onToggleClick","openDropdown","onToggleKeydown","componentWillLoad","popDirectionHandler","alignmentHandler","ariaLabelHandler","componentDidLoad","orchestrateResolvedMenuItems","overrideFocus","delegateFocus","isEventFromElement","popoverStateHandler","detail","_a","scrollContainerTo","top","closePopover","_togglePopover","openPopover","selectItem","value","itemBtn","shadowRoot","click","selectRemoveItem","removeButton","additionalContextHandler","handleRenamedProp","handleAriaLabel","contextHandler","contextValueHandler","nameHandler","resolvedTypeHandler","determineDropdownItemCount","querySelectorAll","length","hasCustomControl","toggleButtonProps","allowedIntents","allowedTypes","type","includes","icon","fab","custom","intent","active","ariaExpanded","className","activeItem","direction","dropdownItems","Array","from","activeIndex","indexOf","targetIndex","targetItem","Event","name","context","removeResolvedElements","resolveMenuItemElements","then","data","forEach","element","appendChild","catch","err","resolvedElements","removeChild","resolveMenu","window","TectonElements","contextValue","resolvedType","additionalContext","datas","map","menuItemData","onClickFn","queryParams","contextIdParamName","action","_b","navigateTo","call","featureName","moduleName","showOverpanel","undefined","newDropdownItem","document","createElement","setAttribute","itemLabel","classList","add","textContent","onclick","render","btnProps","h","class","onChange","ref","el","onClick","onKeyDown","label","hideLabel","loc","ariaHasPopup","block","description","Fragment","popoverMaxHeight","minHeight","popoverMinHeight","popoverDirection","align","popoverAlignment","mode","popoverMode","role"],"sources":["src/components/q2-dropdown/q2-dropdown.scss?tag=q2-dropdown&encapsulation=shadow","src/components/q2-dropdown/q2-dropdown.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n display: inline-flex;\n}\n\n:host([block]) {\n display: block;\n}\n\nq2-icon {\n pointer-events: none;\n margin-block: -100px;\n}\n\nclick-elsewhere {\n position: relative;\n display: block;\n}\n\nq2-popover {\n --tct-popover-min-width: #{var-list(var-prefixer(dropdown-width))};\n}\n","import { Component, ComponentInterface, Prop, Method, Element, Watch, h, Fragment, Listen } from '@stencil/core';\nimport {\n handleAriaLabel,\n handleRenamedProp,\n isEventFromElement,\n loc,\n overrideFocus,\n waitForNextPaint,\n} from 'src/utils';\n\n@Component({ tag: 'q2-dropdown', shadow: true, styleUrl: 'q2-dropdown.scss' })\nexport class Q2Dropdown implements ComponentInterface {\n // #region Own Properties\n\n controlElement?: HTMLQ2BtnElement;\n dropdownItemSelector: string = 'q2-dropdown-item:not([disabled]):not([separator])';\n popoverElement?: HTMLQ2PopoverElement;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n @Prop({ reflect: true })\n additionalContext: string;\n\n /** @deprecated */\n @Prop({ reflect: true })\n alignment: 'left' | 'right';\n\n /** @deprecated */\n @Prop({ reflect: true, mutable: true })\n ariaLabel: string;\n\n /** If `true`, component expands to fill the width of its parent element. */\n @Prop({ reflect: true })\n block: boolean;\n\n /**\n * Tells the outlet what the type of object being passed in as contextValue.\n * This will allow for the hierarchy resolution logic to work to determine if an option should or should not be shown.\n *\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n context: string;\n\n /**\n * Passes important information to the outlet (e.g., pass an account id that your platform can use to look up what module to show for that account type).\n *\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n contextValue: string;\n\n /** Indicates the menu cannot be focused or interacted with. */\n @Prop({ reflect: true })\n disabled: boolean;\n\n /**\n * Hide's the field's `<label>` element from view.\n * @warning\n * Only use when a visible label is impractical.\n */\n @Prop({ reflect: true, mutable: true })\n hideLabel: boolean;\n\n /** The icon that will render within the toggle button. You may use any of the `q2-icon` types. */\n @Prop({ reflect: true })\n icon: string;\n\n /**\n * The text that appears within the button.\n * @warning\n * This property should not be used if the `type` is `icon`.\n * @localizable\n */\n @Prop({ reflect: true, mutable: true })\n label: string;\n\n /**\n * Identifies this menu as an outlet. Used in conjunction with context and, optionally, `contextValue`.\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n name: string;\n\n /**\n * Determine whether the popover is open or closed.\n *\n * @readonly\n */\n @Prop({ reflect: true, mutable: true })\n open: boolean;\n\n /** @deprecated */\n @Prop({ reflect: true })\n popDirection: 'up' | 'down';\n\n /** Aligns the popover dropdown to the left or right side of the input field. */\n @Prop({ mutable: true })\n popoverAlignment: 'left' | 'right' = 'left'; // being used in dropdown.scss\n\n /**\n * Force the direction of the popover dropdown when it opens.\n * If no value is passed, the component will auto-detect the direction based on available space.\n */\n @Prop({ mutable: true })\n popoverDirection: 'up' | 'down';\n\n /**\n * Force the maximum height of the popover. This value will be interpreted as pixels.\n * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n */\n @Prop()\n popoverMaxHeight: number;\n\n /** @deprecated */\n @Prop()\n popoverMinHeight: number;\n\n /**\n * Determines the display mode of the popover.\n *\n * Providing a value of `legacy` instructs the popover to use absolute positioning instead of fixed positioning.\n *\n * @info\n * This is a temporary solution to work around styling issues related to using fixed positioning for the popover\n * when nested inside of elements with transform properties. This will be removed once the popover API is available\n * for use.\n */\n @Prop({ mutable: true })\n popoverMode: 'legacy' = null;\n\n /**\n * Use with `context` to tell the outlet where it appears. It will be matched with the appropriately configured module for that context.\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n resolvedType: string;\n\n /** The type of button used as the menu toggle.\n * @info\n * Type must be \"custom\" to use the custom button slot.\n */\n @Prop({ reflect: true })\n type: 'icon' | 'fab' | 'custom' | 'primary' | 'secondary' | 'neutral' = 'icon';\n\n // #endregion\n // #region Component Lifecycle Events\n\n componentWillLoad() {\n this.popDirectionHandler();\n this.alignmentHandler();\n this.ariaLabelHandler();\n }\n\n componentDidLoad() {\n this.orchestrateResolvedMenuItems();\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n this.focusToggle();\n }\n\n @Listen('popoverStateChanged')\n popoverStateHandler({ detail: { open } }: CustomEvent<{ open: boolean }>) {\n if (this.open !== open) this.open = open;\n this.popoverElement?.scrollContainerTo({ top: 0 });\n }\n\n // #endregion\n // #region Public Methods API\n\n /**\n * Emulates clicking the dropdown `<button>` to hide the popover if it is showing.\n * @testOnly\n */\n @Method()\n async closePopover() {\n if (!this.open || this.disabled) return;\n this._togglePopover();\n }\n\n /**\n * Emulates clicking the dropdown `<button>` to show the popover if it is hidden.\n * @testOnly\n */\n @Method()\n async openPopover() {\n if (this.open || this.disabled) return;\n this._togglePopover();\n }\n\n /**\n * Emulates opening the dropdown and selecting a [Dropdown Item](https://tecton.q2developer.com/design-system/q2-dropdown-item/).\n *\n * If the dropdown is closed, this will open it before selecting the item.\n *\n * If the value does not match any item's value, this method does nothing.\n * @testOnly\n */\n @Method()\n async selectItem(value: string) {\n const item = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}[value=\"${value}\"]`\n );\n const itemBtn = item?.shadowRoot.querySelector<HTMLButtonElement>('.dropdown-item');\n if (!item || this.disabled) return;\n if (!this.open) {\n this.controlElement?.click();\n await waitForNextPaint();\n }\n itemBtn.click();\n await waitForNextPaint();\n }\n\n /**\n * Emulates opening the dropdown and selecting a [Dropdown Item](https://tecton.q2developer.com/design-system/q2-dropdown-item/)'s *remove* button.\n *\n * If the dropdown is closed, this will open it before selecting the remove item button.\n *\n * Requirements for this method to work properly:\n * - Provided `value` matches the item's `value` property\n * - Item has the `removable` property enabled\n * @testOnly\n */\n @Method()\n async selectRemoveItem(value: string) {\n const item = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}[value=\"${value}\"]`\n );\n const removeButton = item?.shadowRoot.querySelector<HTMLButtonElement>('.remove-dropdown-item');\n if (!item || !removeButton || this.disabled) return;\n if (!this.open) {\n this.controlElement?.click();\n await waitForNextPaint();\n }\n removeButton.click();\n await waitForNextPaint();\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('additionalContext')\n additionalContextHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('alignment')\n alignmentHandler() {\n handleRenamedProp(this, 'alignment', 'popoverAlignment');\n }\n\n @Watch('ariaLabel')\n ariaLabelHandler() {\n handleAriaLabel(this);\n }\n\n @Watch('context')\n contextHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('contextValue')\n contextValueHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('name')\n nameHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('popDirection')\n popDirectionHandler() {\n handleRenamedProp(this, 'popDirection', 'popoverDirection');\n }\n\n @Watch('resolvedType')\n resolvedTypeHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n // #endregion\n // #region Local Methods\n\n get determineDropdownItemCount() {\n return this.hostElement.querySelectorAll(this.dropdownItemSelector).length;\n }\n\n get hasCustomControl() {\n return !!this.hostElement.querySelector('[slot=control]');\n }\n\n get toggleButtonProps() {\n const allowedIntents = ['primary', 'secondary', 'neutral'];\n const allowedTypes = ['icon', 'fab', 'custom', ...allowedIntents];\n const type = allowedTypes.includes(this.type) ? this.type : '';\n const icon = type === 'icon';\n const fab = type === 'fab';\n const custom = type === 'custom';\n let intent;\n if (allowedIntents.includes(type)) {\n intent = type === 'neutral' ? type : `workflow-${type}`;\n }\n const active = this.open;\n const disabled = !!this.disabled;\n const ariaExpanded = this.open;\n const className = !icon && !fab && !intent ? 'unstyled' : '';\n\n return {\n icon,\n fab,\n intent,\n active,\n disabled,\n ariaExpanded,\n className,\n custom,\n };\n }\n\n _togglePopover() {\n const { controlElement } = this;\n if (!controlElement) return;\n controlElement.click();\n controlElement.focus();\n controlElement.dispatchEvent(new FocusEvent('focus'));\n }\n\n closeDropdown = () => {\n if (!this.open) return;\n this.open = false;\n };\n\n focusAdjacentItem(activeItem: HTMLQ2DropdownItemElement, direction: 'next' | 'prev') {\n const dropdownItems: HTMLQ2DropdownItemElement[] = Array.from(\n this.hostElement.querySelectorAll(this.dropdownItemSelector)\n );\n\n const activeIndex = dropdownItems.indexOf(activeItem);\n\n if (activeIndex === -1) {\n return;\n }\n\n let targetIndex: number = 0;\n if (direction === 'next') {\n targetIndex = activeIndex < dropdownItems.length - 1 ? activeIndex + 1 : 0;\n } else if (direction === 'prev') {\n if (activeIndex > 0) {\n targetIndex = activeIndex - 1;\n } else {\n targetIndex = dropdownItems.length - 1;\n }\n }\n const targetItem = dropdownItems[targetIndex];\n targetItem && targetItem.dispatchEvent(new Event('focus'));\n }\n\n focusFirstItem = async () => {\n const firstItem = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}:first-child`\n );\n if (!firstItem) return;\n await waitForNextPaint();\n firstItem.dispatchEvent(new FocusEvent('focus'));\n };\n\n focusLastItem = async () => {\n const lastItem = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}:last-child`\n );\n if (!lastItem) return;\n await waitForNextPaint();\n lastItem.dispatchEvent(new FocusEvent('focus'));\n };\n\n focusToggle = () => {\n this.controlElement.focus();\n };\n\n onClickElsewhere = (event: CustomEvent) => {\n const target = event.target as HTMLClickElsewhereElement;\n if (target.localName === 'click-elsewhere') {\n event.stopPropagation();\n const { popoverElement } = this;\n if (!popoverElement) return;\n popoverElement.open = false;\n }\n };\n\n onDropdownMenuClick = async (event: MouseEvent | CustomEvent) => {\n const item = event.target as HTMLQ2DropdownItemElement;\n if (item.disabled || item.separator) return;\n this.closeDropdown();\n await waitForNextPaint();\n this.focusToggle();\n };\n\n onDropdownMenuKeydown = (event: KeyboardEvent) => {\n const item = event.target as HTMLQ2DropdownItemElement;\n switch (event.key) {\n case 'Escape':\n this.closeDropdown();\n this.focusToggle();\n break;\n\n case 'Tab':\n this.closeDropdown();\n break;\n\n case 'ArrowUp':\n event.preventDefault();\n this.focusAdjacentItem(item, 'prev');\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n this.focusAdjacentItem(item, 'next');\n break;\n\n default:\n break;\n }\n };\n\n onToggleClick = () => {\n if (this.open) {\n this.closeDropdown();\n } else {\n this.openDropdown();\n }\n };\n\n onToggleKeydown = async (event: KeyboardEvent) => {\n switch (event.key) {\n case 'ArrowUp':\n event.preventDefault();\n this.openDropdown();\n await waitForNextPaint();\n this.focusLastItem();\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n this.openDropdown();\n await waitForNextPaint();\n this.focusFirstItem();\n return;\n\n case 'Escape':\n event.preventDefault();\n this.closeDropdown();\n break;\n\n case 'Tab':\n if (this.open) this.closeDropdown();\n break;\n\n default:\n break;\n }\n };\n\n openDropdown = () => {\n if (this.open) return;\n this.open = true;\n };\n\n orchestrateResolvedMenuItems() {\n if (!this.name || !this.context) {\n // this is only for contextual menu outlets\n this.removeResolvedElements();\n return;\n }\n\n this.resolveMenuItemElements()\n .then(data => {\n this.removeResolvedElements();\n data.forEach(element => {\n this.hostElement.appendChild(element);\n });\n })\n .catch(err => {\n this.removeResolvedElements();\n throw err;\n });\n }\n\n removeResolvedElements() {\n const resolvedElements = this.hostElement.querySelectorAll('q2-dropdown-item.resolved-menu-item');\n resolvedElements.forEach(element => this.hostElement.removeChild(element));\n }\n\n resolveMenu() {\n return (\n this.name &&\n window.TectonElements &&\n window.TectonElements.resolveMenu(this.name, this.contextValue, this.resolvedType, this.additionalContext)\n );\n }\n\n resolveMenuItemElements() {\n return this.resolveMenu().then(datas => {\n return datas.map(menuItemData => {\n let onClickFn;\n let queryParams;\n if (menuItemData['tct-ctxid']) {\n queryParams = {};\n queryParams[menuItemData.contextIdParamName] = menuItemData['tct-ctxid'];\n }\n\n switch (menuItemData.action) {\n case 'navigateTo':\n onClickFn = function () {\n return window.TectonElements?.navigateTo?.(\n menuItemData.featureName,\n menuItemData.moduleName,\n queryParams\n );\n };\n break;\n case 'showOverpanel':\n onClickFn = function () {\n return window.TectonElements?.showOverpanel?.(\n `${menuItemData.featureName}.${menuItemData.moduleName}`,\n queryParams,\n undefined,\n true\n );\n };\n break;\n }\n\n const newDropdownItem = document.createElement('q2-dropdown-item');\n newDropdownItem.setAttribute('value', menuItemData.itemLabel);\n newDropdownItem.classList.add('resolved-menu-item');\n newDropdownItem.textContent = menuItemData.itemLabel;\n newDropdownItem.onclick = onClickFn;\n\n return newDropdownItem;\n });\n });\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n const btnProps = this.toggleButtonProps;\n\n return (\n <click-elsewhere\n class={this.open ? 'dropdown-open' : ''}\n onChange={this.onClickElsewhere}\n test-id=\"dropdownContainer\"\n >\n <q2-btn\n ref={el => (this.controlElement = el)}\n class={btnProps.className}\n onClick={this.onToggleClick}\n onKeyDown={this.onToggleKeydown}\n fab={btnProps.fab}\n intent={btnProps.intent}\n active={btnProps.active}\n disabled={btnProps.disabled}\n ariaExpanded={`${!!btnProps.ariaExpanded}`}\n label={this.hideLabel && this.label ? loc(this.label) : undefined}\n hideLabel={this.hideLabel}\n ariaHasPopup=\"menu\"\n test-id=\"dropdownButton\"\n block={this.block}\n description={loc('tecton.element.dropdown.itemCount', [this.determineDropdownItemCount])}\n >\n {this.hasCustomControl ? (\n <div\n test-id=\"dropdownControl\"\n class={btnProps.custom ? '' : 'hidden'}\n >\n <slot name=\"control\" />\n </div>\n ) : (\n <Fragment>\n {this.icon ? <q2-icon type={this.icon} /> : ' '}\n {this.label && !this.hideLabel && (\n <span class=\"dropdown-button-text\">{loc(this.label)}</span>\n )}\n </Fragment>\n )}\n </q2-btn>\n <q2-popover\n ref={el => (this.popoverElement = el)}\n controlElement={this.controlElement}\n open={this.open}\n max-height={this.popoverMaxHeight}\n minHeight={this.popoverMinHeight}\n direction={this.popoverDirection}\n align={this.popoverAlignment}\n mode={this.popoverMode || undefined}\n block={this.block}\n >\n <div\n onClick={this.onDropdownMenuClick}\n onKeyDown={this.onDropdownMenuKeydown}\n role=\"menu\"\n aria-label={loc(this.label) || undefined}\n >\n <slot />\n </div>\n </q2-popover>\n </click-elsewhere>\n );\n }\n\n // #endregion\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["q2DropdownCss","Q2DropdownStyle0","Q2Dropdown","this","dropdownItemSelector","closeDropdown","open","focusFirstItem","async","firstItem","hostElement","querySelector","waitForNextPaint","dispatchEvent","FocusEvent","focusLastItem","lastItem","focusToggle","controlElement","focus","onClickElsewhere","event","target","localName","stopPropagation","popoverElement","onDropdownMenuClick","item","disabled","separator","onDropdownMenuKeydown","key","preventDefault","focusAdjacentItem","onToggleClick","openDropdown","onToggleKeydown","componentWillLoad","popDirectionHandler","alignmentHandler","ariaLabelHandler","componentDidLoad","orchestrateResolvedMenuItems","overrideFocus","delegateFocus","isEventFromElement","popoverStateHandler","detail","_a","scrollContainerTo","top","closePopover","_togglePopover","openPopover","selectItem","value","itemBtn","shadowRoot","click","selectRemoveItem","removeButton","additionalContextHandler","handleRenamedProp","handleAriaLabel","contextHandler","contextValueHandler","nameHandler","resolvedTypeHandler","determineDropdownItemCount","querySelectorAll","length","hasCustomControl","toggleButtonProps","allowedIntents","allowedTypes","type","includes","icon","fab","custom","intent","active","ariaExpanded","className","activeItem","direction","dropdownItems","Array","from","activeIndex","indexOf","targetIndex","targetItem","Event","name","context","removeResolvedElements","resolveMenuItemElements","then","data","forEach","element","appendChild","catch","err","resolvedElements","removeChild","resolveMenu","window","TectonElements","contextValue","resolvedType","additionalContext","datas","map","menuItemData","onClickFn","queryParams","contextIdParamName","action","_b","navigateTo","call","featureName","moduleName","showOverpanel","undefined","newDropdownItem","document","createElement","setAttribute","itemLabel","classList","add","textContent","onclick","render","btnProps","h","class","onChange","ref","el","onClick","onKeyDown","label","hideLabel","loc","ariaHasPopup","block","description","Fragment","popoverMaxHeight","minHeight","popoverMinHeight","popoverDirection","align","popoverAlignment","mode","popoverMode","role"],"sources":["src/components/q2-dropdown/q2-dropdown.scss?tag=q2-dropdown&encapsulation=shadow","src/components/q2-dropdown/q2-dropdown.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n display: inline-flex;\n}\n\n:host([block]) {\n display: block;\n}\n\nq2-icon {\n pointer-events: none;\n margin-block: -100px;\n}\n\nclick-elsewhere {\n position: relative;\n display: block;\n}\n\nq2-popover {\n --tct-popover-min-width: #{var-list(var-prefixer(dropdown-width))};\n}\n","import { Component, ComponentInterface, Prop, Method, Element, Watch, h, Fragment, Listen } from '@stencil/core';\nimport {\n handleAriaLabel,\n handleRenamedProp,\n isEventFromElement,\n loc,\n overrideFocus,\n waitForNextPaint,\n} from 'src/utils';\n\n@Component({ tag: 'q2-dropdown', shadow: true, styleUrl: 'q2-dropdown.scss' })\nexport class Q2Dropdown implements ComponentInterface {\n // #region Own Properties\n\n controlElement?: HTMLQ2BtnElement;\n dropdownItemSelector: string = 'q2-dropdown-item:not([disabled]):not([separator])';\n popoverElement?: HTMLQ2PopoverElement;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n @Prop({ reflect: true })\n additionalContext: string;\n\n /** @deprecated */\n @Prop({ reflect: true })\n alignment: 'left' | 'right';\n\n /** @deprecated */\n @Prop({ reflect: true, mutable: true })\n ariaLabel: string;\n\n /** If `true`, component expands to fill the width of its parent element. */\n @Prop({ reflect: true })\n block: boolean;\n\n /**\n * Tells the outlet what the type of object being passed in as contextValue.\n * This will allow for the hierarchy resolution logic to work to determine if an option should or should not be shown.\n *\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n context: string;\n\n /**\n * Passes important information to the outlet (e.g., pass an account id that your platform can use to look up what module to show for that account type).\n *\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n contextValue: string;\n\n /** Indicates the menu cannot be focused or interacted with. */\n @Prop({ reflect: true })\n disabled: boolean;\n\n /**\n * Hide's the field's `<label>` element from view.\n * @warning\n * Only use when a visible label is impractical.\n */\n @Prop({ reflect: true, mutable: true })\n hideLabel: boolean;\n\n /** The icon that will render within the toggle button. You may use any of the `q2-icon` types. */\n @Prop({ reflect: true })\n icon: string;\n\n /**\n * The text that appears within the button.\n * @warning\n * This property should not be used if the `type` is `icon`.\n * @localizable\n */\n @Prop({ reflect: true, mutable: true })\n label: string;\n\n /**\n * Identifies this menu as an outlet. Used in conjunction with context and, optionally, `contextValue`.\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n name: string;\n\n /**\n * Determine whether the popover is open or closed.\n *\n * @readonly\n */\n @Prop({ reflect: true, mutable: true })\n open: boolean;\n\n /** @deprecated */\n @Prop({ reflect: true })\n popDirection: 'up' | 'down';\n\n /** Aligns the popover dropdown to the left or right side of the input field. */\n @Prop({ mutable: true })\n popoverAlignment: 'left' | 'right' = 'left'; // being used in dropdown.scss\n\n /**\n * Force the direction of the popover dropdown when it opens.\n * If no value is passed, the component will auto-detect the direction based on available space.\n */\n @Prop({ mutable: true })\n popoverDirection: 'up' | 'down';\n\n /**\n * Force the maximum height of the popover. This value will be interpreted as pixels.\n * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n */\n @Prop()\n popoverMaxHeight: number;\n\n /** @deprecated */\n @Prop()\n popoverMinHeight: number;\n\n /**\n * Determines the display mode of the popover.\n *\n * Providing a value of `legacy` instructs the popover to use absolute positioning instead of fixed positioning.\n *\n * @info\n * This is a temporary solution to work around styling issues related to using fixed positioning for the popover\n * when nested inside of elements with transform properties. This will be removed once the popover API is available\n * for use.\n */\n @Prop({ mutable: true })\n popoverMode: 'legacy' = null;\n\n /**\n * Use with `context` to tell the outlet where it appears. It will be matched with the appropriately configured module for that context.\n * @info\n * Only applicable when using `<q2-dropdown>` for outlets.\n */\n @Prop({ reflect: true })\n resolvedType: string;\n\n /** The type of button used as the menu toggle.\n * @info\n * Type must be \"custom\" to use the custom button slot.\n */\n @Prop({ reflect: true })\n type: 'icon' | 'fab' | 'custom' | 'primary' | 'secondary' | 'neutral' = 'icon';\n\n // #endregion\n // #region Component Lifecycle Events\n\n componentWillLoad() {\n this.popDirectionHandler();\n this.alignmentHandler();\n this.ariaLabelHandler();\n }\n\n componentDidLoad() {\n this.orchestrateResolvedMenuItems();\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n this.focusToggle();\n }\n\n @Listen('popoverStateChanged')\n popoverStateHandler({ detail: { open } }: CustomEvent<{ open: boolean }>) {\n if (this.open !== open) this.open = open;\n this.popoverElement?.scrollContainerTo({ top: 0 });\n }\n\n // #endregion\n // #region Public Methods API\n\n /**\n * Emulates clicking the dropdown `<button>` to hide the popover if it is showing.\n * @testOnly\n */\n @Method()\n async closePopover() {\n if (!this.open || this.disabled) return;\n this._togglePopover();\n }\n\n /**\n * Emulates clicking the dropdown `<button>` to show the popover if it is hidden.\n * @testOnly\n */\n @Method()\n async openPopover() {\n if (this.open || this.disabled) return;\n this._togglePopover();\n }\n\n /**\n * Emulates opening the dropdown and selecting a [Dropdown Item](https://tecton.q2developer.com/design-system/q2-dropdown-item/).\n *\n * If the dropdown is closed, this will open it before selecting the item.\n *\n * If the value does not match any item's value, this method does nothing.\n * @testOnly\n */\n @Method()\n async selectItem(value: string) {\n const item = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}[value=\"${value}\"]`\n );\n const itemBtn = item?.shadowRoot.querySelector<HTMLButtonElement>('.dropdown-item');\n if (!item || this.disabled) return;\n if (!this.open) {\n this.controlElement?.click();\n await waitForNextPaint();\n }\n itemBtn.click();\n await waitForNextPaint();\n }\n\n /**\n * Emulates opening the dropdown and selecting a [Dropdown Item](https://tecton.q2developer.com/design-system/q2-dropdown-item/)'s *remove* button.\n *\n * If the dropdown is closed, this will open it before selecting the remove item button.\n *\n * Requirements for this method to work properly:\n * - Provided `value` matches the item's `value` property\n * - Item has the `removable` property enabled\n * @testOnly\n */\n @Method()\n async selectRemoveItem(value: string) {\n const item = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}[value=\"${value}\"]`\n );\n const removeButton = item?.shadowRoot.querySelector<HTMLButtonElement>('.remove-dropdown-item');\n if (!item || !removeButton || this.disabled) return;\n if (!this.open) {\n this.controlElement?.click();\n await waitForNextPaint();\n }\n removeButton.click();\n await waitForNextPaint();\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('additionalContext')\n additionalContextHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('alignment')\n alignmentHandler() {\n handleRenamedProp(this, 'alignment', 'popoverAlignment');\n }\n\n @Watch('ariaLabel')\n ariaLabelHandler() {\n handleAriaLabel(this);\n }\n\n @Watch('context')\n contextHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('contextValue')\n contextValueHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('name')\n nameHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n @Watch('popDirection')\n popDirectionHandler() {\n handleRenamedProp(this, 'popDirection', 'popoverDirection');\n }\n\n @Watch('resolvedType')\n resolvedTypeHandler() {\n this.orchestrateResolvedMenuItems();\n }\n\n // #endregion\n // #region Local Methods\n\n get determineDropdownItemCount() {\n return this.hostElement.querySelectorAll(this.dropdownItemSelector).length;\n }\n\n get hasCustomControl() {\n return !!this.hostElement.querySelector('[slot=control]');\n }\n\n get toggleButtonProps() {\n const allowedIntents = ['primary', 'secondary', 'neutral'];\n const allowedTypes = ['icon', 'fab', 'custom', ...allowedIntents];\n const type = allowedTypes.includes(this.type) ? this.type : '';\n const icon = type === 'icon';\n const fab = type === 'fab';\n const custom = type === 'custom';\n let intent;\n if (allowedIntents.includes(type)) {\n intent = type === 'neutral' ? type : `workflow-${type}`;\n }\n const active = this.open;\n const disabled = !!this.disabled;\n const ariaExpanded = this.open;\n const className = !icon && !fab && !intent ? 'unstyled' : '';\n\n return {\n icon,\n fab,\n intent,\n active,\n disabled,\n ariaExpanded,\n className,\n custom,\n };\n }\n\n _togglePopover() {\n const { controlElement } = this;\n if (!controlElement) return;\n controlElement.click();\n controlElement.focus();\n controlElement.dispatchEvent(new FocusEvent('focus'));\n }\n\n closeDropdown = () => {\n if (!this.open) return;\n this.open = false;\n };\n\n focusAdjacentItem(activeItem: HTMLQ2DropdownItemElement, direction: 'next' | 'prev') {\n const dropdownItems: HTMLQ2DropdownItemElement[] = Array.from(\n this.hostElement.querySelectorAll(this.dropdownItemSelector)\n );\n\n const activeIndex = dropdownItems.indexOf(activeItem);\n\n if (activeIndex === -1) {\n return;\n }\n\n let targetIndex: number = 0;\n if (direction === 'next') {\n targetIndex = activeIndex < dropdownItems.length - 1 ? activeIndex + 1 : 0;\n } else if (direction === 'prev') {\n if (activeIndex > 0) {\n targetIndex = activeIndex - 1;\n } else {\n targetIndex = dropdownItems.length - 1;\n }\n }\n const targetItem = dropdownItems[targetIndex];\n targetItem && targetItem.dispatchEvent(new Event('focus'));\n }\n\n focusFirstItem = async () => {\n const firstItem = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}:first-child`\n );\n if (!firstItem) return;\n await waitForNextPaint();\n firstItem.dispatchEvent(new FocusEvent('focus'));\n };\n\n focusLastItem = async () => {\n const lastItem = this.hostElement.querySelector<HTMLQ2DropdownItemElement>(\n `${this.dropdownItemSelector}:last-child`\n );\n if (!lastItem) return;\n await waitForNextPaint();\n lastItem.dispatchEvent(new FocusEvent('focus'));\n };\n\n focusToggle = () => {\n this.controlElement.focus();\n };\n\n onClickElsewhere = (event: CustomEvent) => {\n const target = event.target as HTMLClickElsewhereElement;\n if (target.localName === 'click-elsewhere') {\n event.stopPropagation();\n const { popoverElement } = this;\n if (!popoverElement) return;\n popoverElement.open = false;\n }\n };\n\n onDropdownMenuClick = async (event: MouseEvent | CustomEvent) => {\n const item = event.target as HTMLQ2DropdownItemElement;\n if (item.disabled || item.separator) return;\n this.closeDropdown();\n await waitForNextPaint();\n this.focusToggle();\n };\n\n onDropdownMenuKeydown = (event: KeyboardEvent) => {\n const item = event.target as HTMLQ2DropdownItemElement;\n switch (event.key) {\n case 'Escape':\n this.closeDropdown();\n this.focusToggle();\n break;\n\n case 'Tab':\n this.closeDropdown();\n break;\n\n case 'ArrowUp':\n event.preventDefault();\n this.focusAdjacentItem(item, 'prev');\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n this.focusAdjacentItem(item, 'next');\n break;\n\n default:\n break;\n }\n };\n\n onToggleClick = () => {\n this.popoverElement.controlElement = this.controlElement;\n if (this.open) {\n this.closeDropdown();\n } else {\n this.openDropdown();\n }\n };\n\n onToggleKeydown = async (event: KeyboardEvent) => {\n this.popoverElement.controlElement = this.controlElement;\n switch (event.key) {\n case 'ArrowUp':\n event.preventDefault();\n this.openDropdown();\n await waitForNextPaint();\n this.focusLastItem();\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n this.openDropdown();\n await waitForNextPaint();\n this.focusFirstItem();\n return;\n\n case 'Escape':\n event.preventDefault();\n this.closeDropdown();\n break;\n\n case 'Tab':\n if (this.open) this.closeDropdown();\n break;\n\n default:\n break;\n }\n };\n\n openDropdown = () => {\n if (this.open) return;\n this.open = true;\n };\n\n orchestrateResolvedMenuItems() {\n if (!this.name || !this.context) {\n // this is only for contextual menu outlets\n this.removeResolvedElements();\n return;\n }\n\n this.resolveMenuItemElements()\n .then(data => {\n this.removeResolvedElements();\n data.forEach(element => {\n this.hostElement.appendChild(element);\n });\n })\n .catch(err => {\n this.removeResolvedElements();\n throw err;\n });\n }\n\n removeResolvedElements() {\n const resolvedElements = this.hostElement.querySelectorAll('q2-dropdown-item.resolved-menu-item');\n resolvedElements.forEach(element => this.hostElement.removeChild(element));\n }\n\n resolveMenu() {\n return (\n this.name &&\n window.TectonElements &&\n window.TectonElements.resolveMenu(this.name, this.contextValue, this.resolvedType, this.additionalContext)\n );\n }\n\n resolveMenuItemElements() {\n return this.resolveMenu().then(datas => {\n return datas.map(menuItemData => {\n let onClickFn;\n let queryParams;\n if (menuItemData['tct-ctxid']) {\n queryParams = {};\n queryParams[menuItemData.contextIdParamName] = menuItemData['tct-ctxid'];\n }\n\n switch (menuItemData.action) {\n case 'navigateTo':\n onClickFn = function () {\n return window.TectonElements?.navigateTo?.(\n menuItemData.featureName,\n menuItemData.moduleName,\n queryParams\n );\n };\n break;\n case 'showOverpanel':\n onClickFn = function () {\n return window.TectonElements?.showOverpanel?.(\n `${menuItemData.featureName}.${menuItemData.moduleName}`,\n queryParams,\n undefined,\n true\n );\n };\n break;\n }\n\n const newDropdownItem = document.createElement('q2-dropdown-item');\n newDropdownItem.setAttribute('value', menuItemData.itemLabel);\n newDropdownItem.classList.add('resolved-menu-item');\n newDropdownItem.textContent = menuItemData.itemLabel;\n newDropdownItem.onclick = onClickFn;\n\n return newDropdownItem;\n });\n });\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n const btnProps = this.toggleButtonProps;\n\n return (\n <click-elsewhere\n class={this.open ? 'dropdown-open' : ''}\n onChange={this.onClickElsewhere}\n test-id=\"dropdownContainer\"\n >\n <q2-btn\n ref={el => (this.controlElement = el)}\n class={btnProps.className}\n onClick={this.onToggleClick}\n onKeyDown={this.onToggleKeydown}\n fab={btnProps.fab}\n intent={btnProps.intent}\n active={btnProps.active}\n disabled={btnProps.disabled}\n ariaExpanded={`${!!btnProps.ariaExpanded}`}\n label={this.hideLabel && this.label ? loc(this.label) : undefined}\n hideLabel={this.hideLabel}\n ariaHasPopup=\"menu\"\n test-id=\"dropdownButton\"\n block={this.block}\n description={loc('tecton.element.dropdown.itemCount', [this.determineDropdownItemCount])}\n >\n {this.hasCustomControl ? (\n <div\n test-id=\"dropdownControl\"\n class={btnProps.custom ? '' : 'hidden'}\n >\n <slot name=\"control\" />\n </div>\n ) : (\n <Fragment>\n {this.icon ? <q2-icon type={this.icon} /> : ' '}\n {this.label && !this.hideLabel && (\n <span class=\"dropdown-button-text\">{loc(this.label)}</span>\n )}\n </Fragment>\n )}\n </q2-btn>\n <q2-popover\n ref={el => (this.popoverElement = el)}\n controlElement={this.controlElement}\n open={this.open}\n max-height={this.popoverMaxHeight}\n minHeight={this.popoverMinHeight}\n direction={this.popoverDirection}\n align={this.popoverAlignment}\n mode={this.popoverMode || undefined}\n block={this.block}\n >\n <div\n onClick={this.onDropdownMenuClick}\n onKeyDown={this.onDropdownMenuKeydown}\n role=\"menu\"\n aria-label={loc(this.label) || undefined}\n >\n <slot />\n </div>\n </q2-popover>\n </click-elsewhere>\n );\n }\n\n // #endregion\n}\n"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as t, c as i, h as e, g as s } from "./index-7a5365e2.js";
|
|
2
2
|
|
|
3
|
-
import { a as n, o as a, i as h, w as
|
|
3
|
+
import { a as n, o as a, i as h, w as r, l as d } from "./index-99c46474.js";
|
|
4
4
|
|
|
5
5
|
const l = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline-block;max-width:100%}.q2-editable-field-wrapper:not([hidden]){display:flex}.q2-editable-field-wrapper.editing{align-items:flex-end}:host([block]){display:block;width:100%}:host([block]) .q2-editable-field-wrapper:not([hidden]){display:grid;grid-template-columns:1fr auto auto}q2-input,.text-wrapper{margin:0 var(--tct-scale-2, var(--app-scale-2x, 10px)) 0 0}q2-input{flex:1 1 auto;min-width:170px}.text-wrapper{flex:0 auto;align-self:center;display:inline-block}:host([truncated]) .text-wrapper{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}q2-btn{flex:0 0 44px}dl{margin:var(--tct-scale-0, var(--app-scale-0x, 0))}dt{font-weight:600}dd{margin-left:var(--tct-scale-0, var(--app-scale-0x, 0));display:flex;align-items:center}";
|
|
6
6
|
|
|
@@ -165,11 +165,11 @@ const c = class {
|
|
|
165
165
|
clickSave: true
|
|
166
166
|
}) {
|
|
167
167
|
await this.clickEdit();
|
|
168
|
-
await
|
|
168
|
+
await r();
|
|
169
169
|
await this.inputElement.setValue(t);
|
|
170
170
|
if (i.clickSave) {
|
|
171
171
|
await this.clickSave();
|
|
172
|
-
await
|
|
172
|
+
await r();
|
|
173
173
|
}
|
|
174
174
|
}
|
|
175
175
|
// #endregion
|
|
@@ -197,7 +197,7 @@ const c = class {
|
|
|
197
197
|
return Array.isArray(this.hints) && !!this.hints.length;
|
|
198
198
|
}
|
|
199
199
|
get locLabel() {
|
|
200
|
-
return this.label &&
|
|
200
|
+
return this.label && d(this.label) || "";
|
|
201
201
|
}
|
|
202
202
|
get wrapperClass() {
|
|
203
203
|
return `q2-editable-field-wrapper ${this.editing ? "editing" : ""}`;
|
|
@@ -225,7 +225,7 @@ const c = class {
|
|
|
225
225
|
}), e("q2-btn", {
|
|
226
226
|
ref: t => this.cancelBtnElement = t,
|
|
227
227
|
class: "cancel-edit",
|
|
228
|
-
label: `${
|
|
228
|
+
label: `${d("tecton.element.editableField.cancel")} ${this.locLabel}`,
|
|
229
229
|
"hide-label": true,
|
|
230
230
|
"test-id": "cancelButton",
|
|
231
231
|
onClick: this.cancelClick
|
|
@@ -234,7 +234,7 @@ const c = class {
|
|
|
234
234
|
})), e("q2-btn", {
|
|
235
235
|
ref: t => this.saveBtnElement = t,
|
|
236
236
|
class: "save-edit",
|
|
237
|
-
label: `${
|
|
237
|
+
label: `${d("tecton.element.editableField.save")} ${this.locLabel}`,
|
|
238
238
|
"hide-label": true,
|
|
239
239
|
"test-id": "saveButton",
|
|
240
240
|
onClick: this.saveClick
|
|
@@ -254,7 +254,7 @@ const c = class {
|
|
|
254
254
|
}, this.formattedValue || this.value), e("q2-btn", {
|
|
255
255
|
ref: t => this.editBtnElement = t,
|
|
256
256
|
class: "begin-edit",
|
|
257
|
-
label: `${
|
|
257
|
+
label: `${d("tecton.element.editableField.edit")} ${this.locLabel}`,
|
|
258
258
|
"hide-label": true,
|
|
259
259
|
disabled: this.disabled,
|
|
260
260
|
"test-id": "editButton",
|
|
@@ -271,7 +271,7 @@ const c = class {
|
|
|
271
271
|
}, this.formattedValue || this.value), e("q2-btn", {
|
|
272
272
|
ref: t => this.editBtnElement = t,
|
|
273
273
|
class: "begin-edit",
|
|
274
|
-
label: `${
|
|
274
|
+
label: `${d("tecton.element.editableField.edit")} ${this.locLabel}`,
|
|
275
275
|
"hide-label": true,
|
|
276
276
|
disabled: this.disabled,
|
|
277
277
|
"test-id": "editButton",
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as e, c as i, h as t, F as r, g as o } from "./index-7a5365e2.js";
|
|
2
2
|
|
|
3
|
-
import { l as s, e as a } from "./index-
|
|
3
|
+
import { l as s, e as a } from "./index-99c46474.js";
|
|
4
4
|
|
|
5
5
|
const n = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}@keyframes growFromCenterFadeIn{from{transform:scaleX(0.75) scaleY(0.75);opacity:0}to{transform:scaleX(1) scaleY(1);opacity:1}}@keyframes shrinkToCenterFadeOut{from{transform:scaleX(1) scaleY(1);opacity:1}to{transform:scaleX(0.75) scaleY(0.75);opacity:0}}:host{display:block}.browse{text-align:left}.drop-zone-text{color:var(--tct-file-picker-drop-zone-text-color, var(--t-gray-6, #4D4D4D));font-size:var(--tct-file-picker-drop-zone-font-size, var(--app-font-size-small, 12px));font-weight:var(--tct-file-picker-browse-link-font-weight, 700);margin-bottom:0;margin-top:var(--tct-file-picker-drop-zone-text-margin-top, var(--app-scale-2x, 10px))}.description{color:var(--tct-file-picker-description-text-color, var(--t-gray-1, #0D0D0D));font-size:var(--tct-file-picker-description-font-size, var(--app-font-size-small, 12px));font-weight:var(--tct-file-picker-description-font-weight, 400);text-align:var(--tct-file-picker-description-text-align, left)}.drop-zone{align-items:center;background-color:var(--tct-file-picker-drop-zone-background, var(--t-tertiary, #E8F5FC));border-radius:var(--tct-file-picker-drop-zone-border-radius, var(--app-border-radius-2, 6px));border-width:var(--tct-file-picker-drop-zone-border-width, 2px);border-style:var(--tct-file-picker-drop-zone-border-style, dashed);border-color:var(--tct-file-picker-drop-zone-border-color, var(--t-gray-8, #808080));color:var(--tct-file-picker-drop-zone-color, #747474);display:flex;flex-direction:column;font-size:var(--tct-file-picker-drop-zone-font-size, --app-font-size, 14px);font-weight:var(--tct-file-picker-drop-zone-font-weight, 400);height:var(--tct-file-picker-drop-zone-height, 150px);justify-content:center;padding:var(--tct-file-picker-drop-zone-padding, 20px);text-align:center;width:var(--tct-file-picker-drop-zone-width, 100%)}.drop-zone-highlighted{background-color:var(--tct-file-picker-drop-zone-highlighted-background, var(--tertiary-d-1, #BEE1F6));border-color:var(--tct-file-picker-drop-zone-highlighted-border, var(--t-gray-8, #808080))}.fade-in{animation-fill-mode:both;animation-play-state:running;animation:growFromCenterFadeIn 0.2s ease-in}.fade-out{animation:shrinkToCenterFadeOut 0.1s ease-out;animation-play-state:running;animation-fill-mode:both}.file-item{--tct-btn-neutral-text-font-color:var(--tct-file-picker-item-close-btn-color, var(--t-gray-1, #0D0D0D));--tct-btn-padding:0;--tct-item-body-color:var(--tct-file-picker-file-item-size-color, var(--t-gray-6, #4D4D4D));--tct-item-body-font-size:var(--tct-file-picker-file-item-size-font-size, var(--app-font-size-small, 12px));--tct-item-body-font-weight:var(--tct-file-picker-file-item-size-font-weight, 400);--tct-item-border-radius:var(--tct-file-picker-file-item-border-radius, var(--app-border-radius-3, 12px));--tct-item-border:var(--tct-file-picker-file-item-border-width, 1px) solid var(--tct-file-picker-file-item-border-color, var(--t-gray-8, #808080));--tct-item-header-color:var(--tct-file-picker-file-item-name-color, var(--t-gray-1, #0D0D0D));--tct-item-header-font-size:var(--tct-file-picker-file-item-name-font-size, var(--app-font-size-small, 12px));--tct-item-header-font-weight:var(--tct-file-picker-file-item-name-font-weight, 400);--tct-item-padding:var(--tct-file-picker-file-item-padding, var(--app-scale-1x, 5px) var(--app-scale-2x, 10px))}.file-item-loading{font-size:var(--tct-file-picker-file-item-loading-size, var(--app-scale-6x, 30px));margin-bottom:calc(var(--tct-file-picker-file-item-loading-margin-bottom, var(--app-scale-6x, 30px)) / 8.57);margin-left:calc(var(--tct-file-picker-file-item-loading-margin-bottom, var(--app-scale-1x, 5px)) / 2)}.file-list{--tct-list-item-gap:var(--tct-file-picker-section-gap, var(--app-scale-3x, 15px))}.file-list-container{max-height:182px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--tct-file-picker-scrollbar-color, var(--t-a11y-gray-color, #949494)) transparent}.file-picker{display:flex;flex-direction:column;gap:var(--tct-file-picker-file-item-gap, var(--app-scale-3x, 15px))}.heading{display:flex;flex-direction:column;gap:var(--tct-file-picker-heading-gap, var(--app-scale-1x, 5px));justify-content:space-between}.icon-success,.icon-error{--tct-icon-size:var(--tct-file-picker-file-item-icon-size, var(--app-scale-6x, 30px));--tct-icon-stroke-width:2px}.label{color:var(--tct-file-picker-label-color, var(--t-gray-1, #0D0D0D));font-size:var(--tct-file-picker-label-font-size, var(--app-font-size, 14px));font-weight:var(--tct-file-picker-label-font-weight, 600);text-align:var(--tct-file-picker-label-text-align, left)}.loading{font-size:var(--tct-file-picker-loading-size, var(--app-scale-6x, 25px))}.loading-file{color:var(--tct-file-picker-loading-file-color, var(--t-gray-1, #0D0D0D));font-size:var(--tct-file-picker-loading-file-font-size, var(--app-font-size-small, 12px));font-weight:var(--tct-file-picker-loading-file-font-weight, 400);margin:0}.loading-message{color:var(--tct-file-picker-loading-message-color, var(--t-gray-1, #0D0D0D));font-size:var(--tct-file-picker-loading-message-font-size, var(--app-font-size-small, 12px));font-weight:var(--tct-file-picker-loading-message-font-weight, 700);margin-bottom:var(--tct-file-picker-loading-message-margin-bottom, var(--app-scale-2x, 10px));margin-top:var(--tct-file-picker-loading-message-margin-top, var(--app-scale-2x, 10px))}";
|
|
6
6
|
|
|
@@ -49,11 +49,11 @@ const s = class {
|
|
|
49
49
|
render() {
|
|
50
50
|
const {formattedTextClasses: t} = this;
|
|
51
51
|
return e("div", {
|
|
52
|
-
key: "
|
|
52
|
+
key: "0deb2247f66e39d44ab56bc889520cd67caf20dc",
|
|
53
53
|
class: t,
|
|
54
54
|
"aria-label": this.formattedValue
|
|
55
55
|
}, e("span", {
|
|
56
|
-
key: "
|
|
56
|
+
key: "7b8bba7f894f439d4628329082dd41a3629b3f79"
|
|
57
57
|
}, this.formattedValue));
|
|
58
58
|
}
|
|
59
59
|
static get watchers() {
|