q2-tecton-elements 1.52.2 → 1.54.0
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/bundle-report.json +43422 -0
- package/dist/cjs/{action-sheet-d32c41ae.js → action-sheet-8254c0fd.js} +6 -3
- package/dist/cjs/action-sheet-8254c0fd.js.map +1 -0
- package/dist/cjs/click-elsewhere.cjs.entry.js +96 -0
- package/dist/cjs/click-elsewhere.cjs.entry.js.map +1 -0
- package/dist/cjs/{index-07285783.js → index-76f63767.js} +1 -21
- package/dist/cjs/index-76f63767.js.map +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/q2-action-group.cjs.entry.js +38 -17
- package/dist/cjs/q2-action-group.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-action-sheet.cjs.entry.js +1 -1
- package/dist/cjs/q2-avatar.cjs.entry.js +1 -1
- package/dist/cjs/q2-avatar.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-badge_7.cjs.entry.js +52 -18
- package/dist/cjs/q2-badge_7.cjs.entry.js.map +1 -1
- 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 +1 -1
- package/dist/cjs/q2-carousel.cjs.entry.js +1 -1
- package/dist/cjs/q2-chart-area.cjs.entry.js +1 -1
- package/dist/cjs/q2-chart-bar.cjs.entry.js +1 -1
- package/dist/cjs/q2-chart-donut.cjs.entry.js +1 -1
- 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-data-table.cjs.entry.js +1 -1
- package/dist/cjs/q2-detail.cjs.entry.js +1 -1
- package/dist/cjs/q2-dropdown-item.cjs.entry.js +17 -16
- package/dist/cjs/q2-dropdown-item.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-dropdown.cjs.entry.js +48 -99
- 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-file-picker.cjs.entry.js +236 -0
- package/dist/cjs/q2-file-picker.cjs.entry.js.map +1 -0
- package/dist/cjs/q2-item_3.cjs.entry.js +251 -0
- package/dist/cjs/q2-item_3.cjs.entry.js.map +1 -0
- package/dist/cjs/q2-loc.cjs.entry.js +1 -1
- package/dist/cjs/q2-message.cjs.entry.js +1 -1
- package/dist/cjs/q2-month-picker.cjs.entry.js +1 -1
- package/dist/cjs/q2-optgroup.cjs.entry.js +1 -1
- package/dist/cjs/{q2-option-list.cjs.entry.js → q2-option-list_2.cjs.entry.js} +355 -21
- package/dist/cjs/q2-option-list_2.cjs.entry.js.map +1 -0
- package/dist/cjs/q2-option.cjs.entry.js +18 -4
- package/dist/cjs/q2-option.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-pagination.cjs.entry.js +4 -4
- package/dist/cjs/q2-pill.cjs.entry.js +14 -9
- package/dist/cjs/q2-pill.cjs.entry.js.map +1 -1
- 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 +8 -5
- 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 +9 -4
- package/dist/cjs/q2-tag.cjs.entry.js.map +1 -1
- package/dist/cjs/q2-tecton-elements.cjs.js +1 -1
- package/dist/cjs/q2-textarea.cjs.entry.js +1 -1
- package/dist/cjs/q2-tooltip.cjs.entry.js +1 -1
- package/dist/cjs/tecton-tab-pane.cjs.entry.js +2 -2
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/q2-action-group/q2-action-group.css +25 -8
- package/dist/collection/components/q2-action-group/q2-action-group.js +55 -33
- 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 +142 -6
- 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 +126 -62
- package/dist/collection/components/q2-action-group/test/q2-action-group.spec.js.map +1 -1
- package/dist/collection/components/q2-action-sheet/test/q2-action-sheet-test.e2e.js +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.css +5 -0
- package/dist/collection/components/q2-btn/q2-btn.css +74 -0
- package/dist/collection/components/q2-btn/q2-btn.js +50 -16
- package/dist/collection/components/q2-btn/q2-btn.js.map +1 -1
- package/dist/collection/components/q2-btn/test/q2-btn-test.e2e.js +29 -0
- package/dist/collection/components/q2-btn/test/q2-btn-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-dropdown/q2-dropdown.js +83 -103
- package/dist/collection/components/q2-dropdown/q2-dropdown.js.map +1 -1
- package/dist/collection/components/q2-dropdown/test/q2-dropdown-test.e2e.js +188 -24
- 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.css +1 -1
- package/dist/collection/components/q2-dropdown-item/q2-dropdown-item.js +54 -16
- package/dist/collection/components/q2-dropdown-item/q2-dropdown-item.js.map +1 -1
- package/dist/collection/components/q2-file-picker/q2-file-picker.css +307 -0
- package/dist/collection/components/q2-file-picker/q2-file-picker.js +426 -0
- package/dist/collection/components/q2-file-picker/q2-file-picker.js.map +1 -0
- package/dist/collection/components/q2-file-picker/test/q2-file-picker-test.e2e.js +11 -0
- package/dist/collection/components/q2-file-picker/test/q2-file-picker-test.e2e.js.map +1 -0
- package/dist/collection/components/q2-file-picker/test/q2-file-picker-test.spec.js +435 -0
- package/dist/collection/components/q2-file-picker/test/q2-file-picker-test.spec.js.map +1 -0
- package/dist/collection/components/q2-item/q2-item.css +3 -0
- package/dist/collection/components/q2-link/q2-link.js +26 -7
- package/dist/collection/components/q2-link/q2-link.js.map +1 -1
- package/dist/collection/components/q2-link/test/q2-link-test.e2e.js +20 -118
- package/dist/collection/components/q2-link/test/q2-link-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-link/test/q2-link-test.spec.js +193 -0
- package/dist/collection/components/q2-link/test/q2-link-test.spec.js.map +1 -0
- package/dist/collection/components/q2-list/q2-list.css +6 -0
- package/dist/collection/components/q2-loading/q2-loading.js +1 -1
- package/dist/collection/components/q2-loading/q2-loading.js.map +1 -1
- package/dist/collection/components/q2-option/q2-option.css +9 -3
- package/dist/collection/components/q2-option/q2-option.js +37 -4
- package/dist/collection/components/q2-option/q2-option.js.map +1 -1
- package/dist/collection/components/q2-option/test/q2-option-test.spec.js +22 -0
- 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 +56 -29
- 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.spec.js +489 -0
- package/dist/collection/components/q2-option-list/test/q2-option-list.spec.js.map +1 -0
- package/dist/collection/components/q2-pagination/q2-pagination.js +3 -3
- package/dist/collection/components/q2-pill/q2-pill.js +12 -7
- package/dist/collection/components/q2-pill/q2-pill.js.map +1 -1
- package/dist/collection/components/q2-pill/test/q2-pill-test.e2e.js +109 -1
- package/dist/collection/components/q2-pill/test/q2-pill-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-popover/q2-popover.js +1 -1
- package/dist/collection/components/q2-popover/q2-popover.js.map +1 -1
- package/dist/collection/components/q2-relative-time/q2-relative-time.js +1 -1
- package/dist/collection/components/q2-resize-observer/q2-resize-observer.js +1 -1
- package/dist/collection/components/q2-section/q2-section.js +2 -2
- package/dist/collection/components/q2-select/q2-select.js +7 -4
- 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 -14
- package/dist/collection/components/q2-select/test/q2-select-test.e2e.js.map +1 -1
- package/dist/collection/components/q2-stepper/q2-stepper.js +1 -1
- package/dist/collection/components/q2-stepper-vertical/q2-stepper-vertical.js +1 -1
- package/dist/collection/components/q2-tab-container/q2-tab-container.js +1 -1
- package/dist/collection/components/q2-tab-pane/q2-tab-pane.js +1 -1
- package/dist/collection/components/q2-tag/q2-tag.js +7 -2
- package/dist/collection/components/q2-tag/q2-tag.js.map +1 -1
- package/dist/collection/components/q2-tag/test/q2-tag-test.e2e.js +1 -1
- package/dist/collection/components/q2-tag/test/q2-tag-test.e2e.js.map +1 -1
- package/dist/collection/components/tecton-tab-pane/tecton-tab-pane.js +2 -2
- package/dist/collection/utils/action-sheet.js +5 -2
- package/dist/collection/utils/action-sheet.js.map +1 -1
- package/dist/collection/utils/helpers.js +29 -3
- package/dist/collection/utils/helpers.js.map +1 -1
- package/dist/collection/utils/test/action-sheet-test.e2e.js +34 -6
- package/dist/collection/utils/test/action-sheet-test.e2e.js.map +1 -1
- package/dist/components/action-sheet.js +6 -3
- package/dist/components/action-sheet.js.map +1 -1
- package/dist/components/index.js +2 -0
- package/dist/components/index.js.map +1 -1
- package/dist/components/index2.js +1 -20
- package/dist/components/index2.js.map +1 -1
- package/dist/components/q2-action-group.js +41 -19
- package/dist/components/q2-action-group.js.map +1 -1
- package/dist/components/q2-avatar2.js +1 -1
- package/dist/components/q2-avatar2.js.map +1 -1
- package/dist/components/q2-btn2.js +50 -16
- package/dist/components/q2-btn2.js.map +1 -1
- package/dist/components/q2-dropdown-item2.js +19 -17
- package/dist/components/q2-dropdown-item2.js.map +1 -1
- package/dist/components/q2-dropdown.js +67 -110
- package/dist/components/q2-dropdown.js.map +1 -1
- package/dist/components/q2-file-picker.d.ts +11 -0
- package/dist/components/q2-file-picker.js +301 -0
- package/dist/components/q2-file-picker.js.map +1 -0
- package/dist/components/q2-item.js +1 -130
- package/dist/components/q2-item.js.map +1 -1
- package/dist/{esm/q2-item.entry.js → components/q2-item2.js} +29 -11
- package/dist/components/q2-item2.js.map +1 -0
- package/dist/components/q2-link.js +1 -86
- package/dist/components/q2-link.js.map +1 -1
- package/dist/{esm/q2-link.entry.js → components/q2-link2.js} +42 -10
- package/dist/components/q2-link2.js.map +1 -0
- package/dist/components/q2-list.js +1 -94
- package/dist/components/q2-list.js.map +1 -1
- package/dist/{esm/q2-list.entry.js → components/q2-list2.js} +30 -11
- package/dist/components/q2-list2.js.map +1 -0
- package/dist/components/q2-loading2.js.map +1 -1
- package/dist/components/q2-option-list2.js +44 -19
- package/dist/components/q2-option-list2.js.map +1 -1
- package/dist/components/q2-option2.js +20 -4
- package/dist/components/q2-option2.js.map +1 -1
- package/dist/components/q2-pagination.js +3 -3
- package/dist/components/q2-pill.js +13 -8
- package/dist/components/q2-pill.js.map +1 -1
- package/dist/components/q2-popover2.js +1 -1
- 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 +8 -5
- 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 +8 -3
- package/dist/components/q2-tag.js.map +1 -1
- package/dist/components/tecton-tab-pane.js +2 -2
- package/dist/esm/{action-sheet-e64cb6f7.js → action-sheet-1e24cb38.js} +7 -4
- package/dist/esm/action-sheet-1e24cb38.js.map +1 -0
- package/dist/esm/click-elsewhere.entry.js +92 -0
- package/dist/esm/click-elsewhere.entry.js.map +1 -0
- package/dist/esm/{index-d18e2a20.js → index-504f1a9e.js} +2 -21
- package/dist/esm/index-504f1a9e.js.map +1 -0
- package/dist/esm/loader.js +1 -1
- package/dist/esm/q2-action-group.entry.js +39 -18
- package/dist/esm/q2-action-group.entry.js.map +1 -1
- package/dist/esm/q2-action-sheet.entry.js +1 -1
- package/dist/esm/q2-avatar.entry.js +1 -1
- package/dist/esm/q2-avatar.entry.js.map +1 -1
- package/dist/esm/q2-badge_7.entry.js +52 -18
- package/dist/esm/q2-badge_7.entry.js.map +1 -1
- 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 +1 -1
- package/dist/esm/q2-carousel.entry.js +1 -1
- package/dist/esm/q2-chart-area.entry.js +1 -1
- package/dist/esm/q2-chart-bar.entry.js +1 -1
- package/dist/esm/q2-chart-donut.entry.js +1 -1
- package/dist/esm/q2-checkbox-group.entry.js +1 -1
- package/dist/esm/q2-checkbox.entry.js +1 -1
- package/dist/esm/q2-data-table.entry.js +1 -1
- package/dist/esm/q2-detail.entry.js +1 -1
- package/dist/esm/q2-dropdown-item.entry.js +18 -17
- package/dist/esm/q2-dropdown-item.entry.js.map +1 -1
- package/dist/esm/q2-dropdown.entry.js +48 -99
- package/dist/esm/q2-dropdown.entry.js.map +1 -1
- package/dist/esm/q2-editable-field.entry.js +1 -1
- package/dist/esm/q2-file-picker.entry.js +232 -0
- package/dist/esm/q2-file-picker.entry.js.map +1 -0
- package/dist/esm/q2-item_3.entry.js +245 -0
- package/dist/esm/q2-item_3.entry.js.map +1 -0
- package/dist/esm/q2-loc.entry.js +1 -1
- package/dist/esm/q2-message.entry.js +1 -1
- package/dist/esm/q2-month-picker.entry.js +1 -1
- package/dist/esm/q2-optgroup.entry.js +1 -1
- package/dist/esm/{q2-option-list.entry.js → q2-option-list_2.entry.js} +355 -22
- package/dist/esm/q2-option-list_2.entry.js.map +1 -0
- package/dist/esm/q2-option.entry.js +18 -4
- package/dist/esm/q2-option.entry.js.map +1 -1
- package/dist/esm/q2-pagination.entry.js +4 -4
- package/dist/esm/q2-pill.entry.js +14 -9
- package/dist/esm/q2-pill.entry.js.map +1 -1
- 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 +8 -5
- 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 +9 -4
- package/dist/esm/q2-tag.entry.js.map +1 -1
- package/dist/esm/q2-tecton-elements.js +1 -1
- package/dist/esm/q2-textarea.entry.js +1 -1
- package/dist/esm/q2-tooltip.entry.js +1 -1
- package/dist/esm/tecton-tab-pane.entry.js +2 -2
- package/dist/q2-tecton-elements/action-sheet-1e24cb38.js +80 -0
- package/dist/q2-tecton-elements/action-sheet-1e24cb38.js.map +1 -0
- package/dist/q2-tecton-elements/click-elsewhere.entry.js +90 -0
- package/dist/q2-tecton-elements/click-elsewhere.entry.js.map +1 -0
- package/dist/q2-tecton-elements/{index-d18e2a20.js → index-504f1a9e.js} +51 -69
- package/dist/q2-tecton-elements/index-504f1a9e.js.map +1 -0
- package/dist/q2-tecton-elements/q2-action-group.entry.js +57 -33
- package/dist/q2-tecton-elements/q2-action-group.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-action-sheet.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-avatar.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-avatar.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-badge_7.entry.js +222 -181
- package/dist/q2-tecton-elements/q2-badge_7.entry.js.map +1 -1
- 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 +1 -1
- package/dist/q2-tecton-elements/q2-carousel.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-chart-area.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-chart-bar.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-chart-donut.entry.js +1 -1
- 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-data-table.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-detail.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-dropdown-item.entry.js +34 -34
- package/dist/q2-tecton-elements/q2-dropdown-item.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-dropdown.entry.js +86 -137
- package/dist/q2-tecton-elements/q2-dropdown.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-editable-field.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-file-picker.entry.js +339 -0
- package/dist/q2-tecton-elements/q2-file-picker.entry.js.map +1 -0
- package/dist/q2-tecton-elements/q2-item_3.entry.js +332 -0
- package/dist/q2-tecton-elements/q2-item_3.entry.js.map +1 -0
- package/dist/q2-tecton-elements/q2-loc.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-message.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-month-picker.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-optgroup.entry.js +1 -1
- package/dist/q2-tecton-elements/q2-option-list_2.entry.js +902 -0
- package/dist/q2-tecton-elements/q2-option-list_2.entry.js.map +1 -0
- package/dist/q2-tecton-elements/q2-option.entry.js +31 -21
- package/dist/q2-tecton-elements/q2-option.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-pagination.entry.js +34 -34
- package/dist/q2-tecton-elements/q2-pill.entry.js +24 -20
- package/dist/q2-tecton-elements/q2-pill.entry.js.map +1 -1
- package/dist/q2-tecton-elements/q2-radio-group.entry.js +1 -1
- 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 +21 -18
- 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 +15 -11
- package/dist/q2-tecton-elements/q2-tag.entry.js.map +1 -1
- 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 +1 -1
- 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/components/q2-action-group/q2-action-group.d.ts +19 -11
- package/dist/types/components/q2-btn/q2-btn.d.ts +8 -3
- package/dist/types/components/q2-dropdown/q2-dropdown.d.ts +18 -9
- package/dist/types/components/q2-dropdown-item/q2-dropdown-item.d.ts +14 -1
- package/dist/types/components/q2-file-picker/q2-file-picker.d.ts +98 -0
- package/dist/types/components/q2-link/q2-link.d.ts +8 -6
- package/dist/types/components/q2-loading/q2-loading.d.ts +2 -2
- package/dist/types/components/q2-option/q2-option.d.ts +10 -1
- package/dist/types/components/q2-option-list/q2-option-list.d.ts +9 -8
- package/dist/types/components/q2-pill/q2-pill.d.ts +2 -2
- package/dist/types/components.d.ts +192 -28
- package/dist/types/util.d.ts +1 -0
- package/dist/types/utils/helpers.d.ts +1 -1
- package/package.json +4 -3
- package/dist/cjs/action-sheet-d32c41ae.js.map +0 -1
- package/dist/cjs/click-elsewhere_2.cjs.entry.js +0 -406
- package/dist/cjs/click-elsewhere_2.cjs.entry.js.map +0 -1
- package/dist/cjs/index-07285783.js.map +0 -1
- package/dist/cjs/q2-item.cjs.entry.js +0 -120
- package/dist/cjs/q2-item.cjs.entry.js.map +0 -1
- package/dist/cjs/q2-link.cjs.entry.js +0 -64
- package/dist/cjs/q2-link.cjs.entry.js.map +0 -1
- package/dist/cjs/q2-list.cjs.entry.js +0 -83
- package/dist/cjs/q2-list.cjs.entry.js.map +0 -1
- package/dist/cjs/q2-option-list.cjs.entry.js.map +0 -1
- package/dist/esm/action-sheet-e64cb6f7.js.map +0 -1
- package/dist/esm/click-elsewhere_2.entry.js +0 -401
- package/dist/esm/click-elsewhere_2.entry.js.map +0 -1
- package/dist/esm/index-d18e2a20.js.map +0 -1
- package/dist/esm/q2-item.entry.js.map +0 -1
- package/dist/esm/q2-link.entry.js.map +0 -1
- package/dist/esm/q2-list.entry.js.map +0 -1
- package/dist/esm/q2-option-list.entry.js.map +0 -1
- package/dist/q2-tecton-elements/action-sheet-e64cb6f7.js +0 -77
- package/dist/q2-tecton-elements/action-sheet-e64cb6f7.js.map +0 -1
- package/dist/q2-tecton-elements/click-elsewhere_2.entry.js +0 -398
- package/dist/q2-tecton-elements/click-elsewhere_2.entry.js.map +0 -1
- package/dist/q2-tecton-elements/index-d18e2a20.js.map +0 -1
- package/dist/q2-tecton-elements/q2-item.entry.js +0 -158
- package/dist/q2-tecton-elements/q2-item.entry.js.map +0 -1
- package/dist/q2-tecton-elements/q2-link.entry.js +0 -83
- package/dist/q2-tecton-elements/q2-link.entry.js.map +0 -1
- package/dist/q2-tecton-elements/q2-list.entry.js +0 -100
- package/dist/q2-tecton-elements/q2-list.entry.js.map +0 -1
- package/dist/q2-tecton-elements/q2-option-list.entry.js +0 -585
- package/dist/q2-tecton-elements/q2-option-list.entry.js.map +0 -1
|
@@ -1,401 +0,0 @@
|
|
|
1
|
-
import { r as registerInstance, c as createEvent, g as getElement, h } from './index-7a5365e2.js';
|
|
2
|
-
import { h as handleDeprecationWarning, w as waitForNextPaint } from './index-d18e2a20.js';
|
|
3
|
-
|
|
4
|
-
const ClickElsewhere = class {
|
|
5
|
-
constructor(hostRef) {
|
|
6
|
-
registerInstance(this, hostRef);
|
|
7
|
-
this.change = createEvent(this, "change", 7);
|
|
8
|
-
// #region Own Properties
|
|
9
|
-
this.isCurrentlyFocused = false;
|
|
10
|
-
/**
|
|
11
|
-
* Listens for mouse and window events that happen outside this click-elsewhere element so we can close popovers when users click outside them
|
|
12
|
-
*/
|
|
13
|
-
this.mouseEventList = ['mousedown', 'dragstart', 'touchstart'];
|
|
14
|
-
this.mouseHandler = (event) => {
|
|
15
|
-
const isCurrentlyFocused = this.shadowContains(this.findActiveElement());
|
|
16
|
-
const aboutToBeFocused = this.shadowContains(this.shadowEventTarget(event)) || this.originatesInSlots(event.target);
|
|
17
|
-
if (!aboutToBeFocused && (this.isCurrentlyFocused || isCurrentlyFocused)) {
|
|
18
|
-
this.isCurrentlyFocused = false;
|
|
19
|
-
this.change.emit();
|
|
20
|
-
return;
|
|
21
|
-
}
|
|
22
|
-
this.isCurrentlyFocused = aboutToBeFocused || isCurrentlyFocused;
|
|
23
|
-
};
|
|
24
|
-
this.windowBlurHandler = () => {
|
|
25
|
-
this.isCurrentlyFocused = false;
|
|
26
|
-
this.change.emit();
|
|
27
|
-
};
|
|
28
|
-
}
|
|
29
|
-
// #endregion
|
|
30
|
-
// #region Component Lifecycle Events
|
|
31
|
-
/* tslint:enable:no-empty */
|
|
32
|
-
connectedCallback() {
|
|
33
|
-
this.mouseEventList.forEach((eventName) => {
|
|
34
|
-
document.addEventListener(eventName, this.mouseHandler);
|
|
35
|
-
});
|
|
36
|
-
window.addEventListener('blur', this.windowBlurHandler);
|
|
37
|
-
}
|
|
38
|
-
disconnectedCallback() {
|
|
39
|
-
this.mouseEventList.forEach((eventName) => {
|
|
40
|
-
document.removeEventListener(eventName, this.mouseHandler);
|
|
41
|
-
});
|
|
42
|
-
window.removeEventListener('blur', this.windowBlurHandler);
|
|
43
|
-
}
|
|
44
|
-
/* TODO: Stencil/Rollup is having issues compiling without this here. Will try to remove in future Stencil upgrade. */
|
|
45
|
-
/* tslint:disable:no-empty */
|
|
46
|
-
componentWillLoad() { }
|
|
47
|
-
// #endregion
|
|
48
|
-
// #region Local Methods
|
|
49
|
-
findActiveElement() {
|
|
50
|
-
let workingElement = document.activeElement;
|
|
51
|
-
while (true) {
|
|
52
|
-
if (!workingElement || !workingElement.shadowRoot) {
|
|
53
|
-
return workingElement;
|
|
54
|
-
}
|
|
55
|
-
workingElement = workingElement.shadowRoot.activeElement;
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
originatesInSlots(target) {
|
|
59
|
-
const slots = this.hostElement.querySelectorAll('slot');
|
|
60
|
-
for (const currentSlot of Array.from(slots)) {
|
|
61
|
-
const lightNodes = (currentSlot && currentSlot.assignedNodes && currentSlot.assignedNodes()) ||
|
|
62
|
-
this.hostElement.childNodes;
|
|
63
|
-
for (const currentNode of Array.from(lightNodes)) {
|
|
64
|
-
if (currentNode.contains(target)) {
|
|
65
|
-
return true;
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
return false;
|
|
70
|
-
}
|
|
71
|
-
shadowContains(child) {
|
|
72
|
-
/**
|
|
73
|
-
* shadow-dom enabled version of Node.contains()
|
|
74
|
-
*/
|
|
75
|
-
while (true) {
|
|
76
|
-
if (child === this.hostElement) {
|
|
77
|
-
return true;
|
|
78
|
-
}
|
|
79
|
-
if (!child) {
|
|
80
|
-
return false;
|
|
81
|
-
}
|
|
82
|
-
child = child.parentNode || child.host;
|
|
83
|
-
}
|
|
84
|
-
}
|
|
85
|
-
shadowEventTarget(event) {
|
|
86
|
-
return event.composedPath()[0] || event.target;
|
|
87
|
-
}
|
|
88
|
-
get hostElement() { return getElement(this); }
|
|
89
|
-
};
|
|
90
|
-
|
|
91
|
-
const q2PopoverCss = "*{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}.container{display:none}.show{display:block;position:fixed;z-index:var(--tct-popover-z-index, 50);margin:0;padding:0;overflow:auto;background:var(--tct-popover-background, var(--app-white, #ffffff));color:var(--tct-popover-font-color, var(--t-text, #4d4d4d));min-width:var(--tct-popover-min-width, 135px);margin-block:var(--tct-popover-margin-block, 0);box-shadow:var(--tct-popover-box-shadow, var(--app-shadow-1, 0px 0px 2px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14)));border-width:var(--tct-popover-border-width, 0);border-style:solid;border-color:var(--tct-popover-border-color, transparent);border-radius:var(--tct-popover-border-radius, 0);max-height:var(--comp-pop-max-height);left:var(--comp-pop-left);opacity:var(--comp-pop-opacity, 0);--comp-scrollbar-size:var(--tct-scrollbar-size, var(--t-scrollbar-size, var(--app-scale-1x, 5px)));--comp-scrollbar-border-radius:var(--tct-scrollbar-border-radius, var(--t-scrollbar-border-radius, var(--app-border-radius-1, 4px)));--comp-scrollbar-color:var(--tct-scrollbar-color, var(--t-scrollbar-color, var(--t-a11y-gray-color, #747474)));scrollbar-width:thin;scrollbar-color:var(--comp-scrollbar-color) transparent}:host([block]) .show{right:unset;width:var(--comp-pop-width);min-width:var(--tct-popover-min-width, unset)}:host([align=left]) .show{left:var(--comp-pop-left);right:unset}:host([align=right]) .show{right:var(--comp-pop-right);left:unset}.show.down{top:var(--tct-popover-top, var(--comp-pop-top));bottom:unset}.show.up{top:unset;bottom:var(--comp-pop-bottom)}.show.legacy{position:absolute}.show::-webkit-scrollbar{width:var(--comp-scrollbar-size);height:var(--comp-scrollbar-size);margin:5px}.show::-webkit-scrollbar-thumb{background:var(--comp-scrollbar-color);border-radius:var(--comp-scrollbar-border-radius)}.show::-webkit-scrollbar-track{background:transparent;border-radius:var(--comp-scrollbar-border-radius)}click-elsewhere{position:relative;display:block}";
|
|
92
|
-
const Q2PopoverStyle0 = q2PopoverCss;
|
|
93
|
-
|
|
94
|
-
const Q2Popover = class {
|
|
95
|
-
constructor(hostRef) {
|
|
96
|
-
registerInstance(this, hostRef);
|
|
97
|
-
this.popoverStateChanged = createEvent(this, "popoverStateChanged", 7);
|
|
98
|
-
/**
|
|
99
|
-
* The number of pixels to leave between the popover and the edge of the viewport
|
|
100
|
-
*/
|
|
101
|
-
this.displayBuffer = 10;
|
|
102
|
-
/** remove when Popover API is supported in iOS */
|
|
103
|
-
this.orientationChanged = false;
|
|
104
|
-
this.handleMinHeight = () => {
|
|
105
|
-
if (this.minHeight) {
|
|
106
|
-
handleDeprecationWarning(this, 'minHeight', 'prop');
|
|
107
|
-
}
|
|
108
|
-
};
|
|
109
|
-
this.setAbsoluteCSSProperties = async () => {
|
|
110
|
-
const { controlElement, containerElement, currentDirection, align } = this;
|
|
111
|
-
if (align === 'right') {
|
|
112
|
-
containerElement.style.setProperty('--comp-pop-right', '0');
|
|
113
|
-
containerElement.style.setProperty('--comp-pop-left', 'unset');
|
|
114
|
-
}
|
|
115
|
-
else {
|
|
116
|
-
containerElement.style.setProperty('--comp-pop-left', '0');
|
|
117
|
-
containerElement.style.setProperty('--comp-pop-right', 'unset');
|
|
118
|
-
}
|
|
119
|
-
if (this.block) {
|
|
120
|
-
containerElement.style.setProperty('--comp-pop-width', '100%');
|
|
121
|
-
}
|
|
122
|
-
if (currentDirection === 'up') {
|
|
123
|
-
const controlStyle = getComputedStyle(controlElement);
|
|
124
|
-
const controlSize = parseInt(controlStyle.height || '0') +
|
|
125
|
-
parseInt(controlStyle.borderTopWidth || '0') +
|
|
126
|
-
parseInt(controlStyle.borderBottomWidth || '0');
|
|
127
|
-
containerElement.style.setProperty('--comp-pop-bottom', `${controlSize}px`);
|
|
128
|
-
}
|
|
129
|
-
// Wait for one paint to prevent layout thrashing
|
|
130
|
-
await waitForNextPaint();
|
|
131
|
-
containerElement.style.setProperty('--comp-pop-opacity', '1');
|
|
132
|
-
};
|
|
133
|
-
this.setFixedCSSProperties = async () => {
|
|
134
|
-
var _a, _b;
|
|
135
|
-
const { controlElement, containerElement, currentDirection, rootElementRect } = this;
|
|
136
|
-
const { top: controlTop, bottom: controlBottom, left: controlLeft, right: controlRight, } = (_b = (_a = controlElement === null || controlElement === void 0 ? void 0 : controlElement.getBoundingClientRect) === null || _a === void 0 ? void 0 : _a.call(controlElement)) !== null && _b !== void 0 ? _b : {
|
|
137
|
-
top: 0,
|
|
138
|
-
bottom: 0,
|
|
139
|
-
left: 0,
|
|
140
|
-
right: 0,
|
|
141
|
-
};
|
|
142
|
-
const popoverLeft = controlLeft - rootElementRect.left;
|
|
143
|
-
if (this.block)
|
|
144
|
-
containerElement.style.setProperty('--comp-pop-width', `${(controlElement === null || controlElement === void 0 ? void 0 : controlElement.offsetWidth) || 0}px`);
|
|
145
|
-
containerElement.style.setProperty('--comp-pop-left', `${popoverLeft}px`);
|
|
146
|
-
containerElement.style.setProperty('--comp-pop-right', `${rootElementRect.width + rootElementRect.left - controlRight}px`);
|
|
147
|
-
if (currentDirection === 'up') {
|
|
148
|
-
containerElement.style.setProperty('--comp-pop-bottom', `${rootElementRect.height + rootElementRect.top - controlTop}px`);
|
|
149
|
-
}
|
|
150
|
-
if (currentDirection === 'down') {
|
|
151
|
-
containerElement.style.setProperty('--comp-pop-top', `${controlBottom - rootElementRect.top}px`);
|
|
152
|
-
}
|
|
153
|
-
// Wait for one paint to prevent layout thrashing
|
|
154
|
-
await waitForNextPaint();
|
|
155
|
-
containerElement.style.setProperty('--comp-pop-opacity', '1');
|
|
156
|
-
};
|
|
157
|
-
this.viewPortChanged = () => {
|
|
158
|
-
if (!this.open)
|
|
159
|
-
return;
|
|
160
|
-
this.determinePopDirection();
|
|
161
|
-
};
|
|
162
|
-
this.viewPortOrientationChanged = () => {
|
|
163
|
-
this.orientationChanged = true;
|
|
164
|
-
this.viewPortChanged();
|
|
165
|
-
};
|
|
166
|
-
this.currentDirection = undefined;
|
|
167
|
-
this.show = false;
|
|
168
|
-
this.align = undefined;
|
|
169
|
-
this.block = undefined;
|
|
170
|
-
this.controlElement = undefined;
|
|
171
|
-
this.direction = undefined;
|
|
172
|
-
this.maxHeight = undefined;
|
|
173
|
-
this.minHeight = undefined;
|
|
174
|
-
this.mode = null;
|
|
175
|
-
this.open = undefined;
|
|
176
|
-
}
|
|
177
|
-
// #endregion
|
|
178
|
-
// #region Component Lifecycle Events
|
|
179
|
-
disconnectedCallback() {
|
|
180
|
-
this.removeViewportListeners();
|
|
181
|
-
}
|
|
182
|
-
componentDidLoad() {
|
|
183
|
-
this.handleMinHeight();
|
|
184
|
-
if (this.open)
|
|
185
|
-
this.determinePopDirection();
|
|
186
|
-
}
|
|
187
|
-
// #endregion
|
|
188
|
-
// #region Listeners
|
|
189
|
-
popoverStateHandler(event) {
|
|
190
|
-
const { detail: { open }, } = event;
|
|
191
|
-
if (open === this.open)
|
|
192
|
-
return;
|
|
193
|
-
this.open = open;
|
|
194
|
-
event.stopPropagation();
|
|
195
|
-
}
|
|
196
|
-
// #endregion
|
|
197
|
-
// #region Public Methods API
|
|
198
|
-
async scrollContainerTo(options) {
|
|
199
|
-
this.containerElement.scrollTo(options);
|
|
200
|
-
}
|
|
201
|
-
async toggle() {
|
|
202
|
-
this.open = !this.open;
|
|
203
|
-
}
|
|
204
|
-
// #endregion
|
|
205
|
-
// #region Watchers
|
|
206
|
-
minHeightProvided() {
|
|
207
|
-
this.handleMinHeight();
|
|
208
|
-
}
|
|
209
|
-
async openChanged(open) {
|
|
210
|
-
this.setRootElement();
|
|
211
|
-
this.popoverStateChanged.emit({ open });
|
|
212
|
-
if (open) {
|
|
213
|
-
this.addViewportListeners();
|
|
214
|
-
this.determinePopDirection();
|
|
215
|
-
}
|
|
216
|
-
else {
|
|
217
|
-
this.removeViewportListeners();
|
|
218
|
-
this.currentDirection = undefined;
|
|
219
|
-
this.show = false;
|
|
220
|
-
await waitForNextPaint();
|
|
221
|
-
this.clearCSSProperties();
|
|
222
|
-
}
|
|
223
|
-
}
|
|
224
|
-
// #endregion
|
|
225
|
-
// #region Local Methods
|
|
226
|
-
get isModule() {
|
|
227
|
-
var _a, _b;
|
|
228
|
-
const isIframe = window !== window.top;
|
|
229
|
-
const hasPlatformDimensions = Object.keys((_b = (_a = window.Tecton) === null || _a === void 0 ? void 0 : _a.platformDimensions) !== null && _b !== void 0 ? _b : {}).length > 0;
|
|
230
|
-
return isIframe && hasPlatformDimensions;
|
|
231
|
-
}
|
|
232
|
-
get providedDirection() {
|
|
233
|
-
const { direction } = this;
|
|
234
|
-
switch (direction) {
|
|
235
|
-
case 'up':
|
|
236
|
-
case 'down':
|
|
237
|
-
return direction;
|
|
238
|
-
default:
|
|
239
|
-
return undefined;
|
|
240
|
-
}
|
|
241
|
-
}
|
|
242
|
-
get validatedMaxHeight() {
|
|
243
|
-
const { maxHeight } = this;
|
|
244
|
-
return isNaN(maxHeight) ? undefined : maxHeight;
|
|
245
|
-
}
|
|
246
|
-
addViewportListeners() {
|
|
247
|
-
var _a;
|
|
248
|
-
window.addEventListener('resize', this.viewPortOrientationChanged);
|
|
249
|
-
// #region remove when Popover API is supported in iOS
|
|
250
|
-
window.addEventListener('scroll', this.viewPortChanged, { passive: true, capture: true });
|
|
251
|
-
(_a = screen === null || screen === void 0 ? void 0 : screen.orientation) === null || _a === void 0 ? void 0 : _a.addEventListener('change', this.viewPortOrientationChanged);
|
|
252
|
-
window.addEventListener('orientationchange', this.viewPortOrientationChanged);
|
|
253
|
-
// #endregion
|
|
254
|
-
}
|
|
255
|
-
clearCSSProperties() {
|
|
256
|
-
this.containerElement.style.removeProperty('--comp-pop-max-height');
|
|
257
|
-
this.containerElement.style.removeProperty('--comp-pop-top');
|
|
258
|
-
this.containerElement.style.removeProperty('--comp-pop-bottom');
|
|
259
|
-
this.containerElement.style.removeProperty('--comp-pop-left');
|
|
260
|
-
this.containerElement.style.removeProperty('--comp-pop-right');
|
|
261
|
-
this.containerElement.style.removeProperty('--comp-pop-width');
|
|
262
|
-
this.containerElement.style.removeProperty('--comp-pop-opacity');
|
|
263
|
-
}
|
|
264
|
-
async determinePopDirection() {
|
|
265
|
-
var _a, _b, _c;
|
|
266
|
-
const { containerElement, controlElement, providedDirection, displayBuffer } = this;
|
|
267
|
-
if (containerElement)
|
|
268
|
-
containerElement.style.maxHeight = null;
|
|
269
|
-
await waitForNextPaint();
|
|
270
|
-
const { isModule } = this;
|
|
271
|
-
const { top: controlTop, bottom: controlBottom } = (_b = (_a = controlElement === null || controlElement === void 0 ? void 0 : controlElement.getBoundingClientRect) === null || _a === void 0 ? void 0 : _a.call(controlElement)) !== null && _b !== void 0 ? _b : {
|
|
272
|
-
top: 0,
|
|
273
|
-
bottom: 0,
|
|
274
|
-
};
|
|
275
|
-
let windowHeight;
|
|
276
|
-
let maxSpaceAbove;
|
|
277
|
-
let maxSpaceBelow;
|
|
278
|
-
if (isModule) {
|
|
279
|
-
const { outletOffset = 0, innerHeight = window.innerHeight } = ((_c = window.Tecton) === null || _c === void 0 ? void 0 : _c.platformDimensions) || {};
|
|
280
|
-
const distanceToIframeBottom = window.visualViewport.height - controlBottom;
|
|
281
|
-
const viewableSpaceBelow = innerHeight - (outletOffset + controlBottom);
|
|
282
|
-
const isIframeShorterThanWindow = distanceToIframeBottom < viewableSpaceBelow;
|
|
283
|
-
windowHeight = innerHeight;
|
|
284
|
-
// If the top of the module is below the top of the window we just use the controlTop
|
|
285
|
-
// Otherwise we need to add the outletOffset to the controlTop
|
|
286
|
-
maxSpaceAbove = (outletOffset > 0 ? controlTop : controlTop + outletOffset) - displayBuffer;
|
|
287
|
-
maxSpaceBelow = isIframeShorterThanWindow
|
|
288
|
-
? distanceToIframeBottom - displayBuffer
|
|
289
|
-
: viewableSpaceBelow - displayBuffer;
|
|
290
|
-
}
|
|
291
|
-
else {
|
|
292
|
-
windowHeight = window.visualViewport.height;
|
|
293
|
-
maxSpaceAbove = controlTop - displayBuffer;
|
|
294
|
-
maxSpaceBelow = windowHeight - controlBottom - displayBuffer;
|
|
295
|
-
}
|
|
296
|
-
const directionWithMostSpace = maxSpaceAbove > maxSpaceBelow ? 'up' : 'down';
|
|
297
|
-
// We do not want to update the max height once the popover is open unless the page orientation shifts (resize or mobile use cases)
|
|
298
|
-
const shouldUpdateMaxHeight = !containerElement.style.getPropertyValue('--comp-pop-max-height') || this.orientationChanged;
|
|
299
|
-
// we do not want to constantly update the max-height after an orientation change, so we switch this back to false
|
|
300
|
-
this.orientationChanged = false;
|
|
301
|
-
const currentOrDetermineDirection = this.currentDirection || providedDirection || directionWithMostSpace;
|
|
302
|
-
switch (currentOrDetermineDirection) {
|
|
303
|
-
case 'up':
|
|
304
|
-
if (shouldUpdateMaxHeight) {
|
|
305
|
-
const priorityMaxHeight = this.validatedMaxHeight || maxSpaceAbove;
|
|
306
|
-
const maxHeight = Math.min(maxSpaceAbove, priorityMaxHeight);
|
|
307
|
-
containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);
|
|
308
|
-
}
|
|
309
|
-
this.setDirectionAndShow('up');
|
|
310
|
-
break;
|
|
311
|
-
case 'down':
|
|
312
|
-
if (shouldUpdateMaxHeight) {
|
|
313
|
-
const priorityMaxHeight = this.validatedMaxHeight || maxSpaceBelow;
|
|
314
|
-
const maxHeight = Math.min(maxSpaceBelow, priorityMaxHeight);
|
|
315
|
-
containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);
|
|
316
|
-
}
|
|
317
|
-
this.setDirectionAndShow('down');
|
|
318
|
-
break;
|
|
319
|
-
}
|
|
320
|
-
}
|
|
321
|
-
removeViewportListeners() {
|
|
322
|
-
var _a;
|
|
323
|
-
window.removeEventListener('resize', this.viewPortOrientationChanged);
|
|
324
|
-
// #region remove when Popover API is supported in iOS
|
|
325
|
-
window.removeEventListener('scroll', this.viewPortChanged);
|
|
326
|
-
(_a = screen === null || screen === void 0 ? void 0 : screen.orientation) === null || _a === void 0 ? void 0 : _a.removeEventListener('orientationchange', this.viewPortOrientationChanged);
|
|
327
|
-
window.removeEventListener('orientationchange', this.viewPortOrientationChanged);
|
|
328
|
-
// #endregion
|
|
329
|
-
}
|
|
330
|
-
setDirectionAndShow(direction) {
|
|
331
|
-
this.setRootElement();
|
|
332
|
-
// Due to some runtime inconsistency across devices/browsers we need to add one more check here because the
|
|
333
|
-
// popover can be closed between the time the popover is opened and the time the direction is determined
|
|
334
|
-
const isOpen = this.open;
|
|
335
|
-
if (!isOpen)
|
|
336
|
-
return;
|
|
337
|
-
this.currentDirection = direction;
|
|
338
|
-
this.show = true;
|
|
339
|
-
if (this.mode === 'legacy') {
|
|
340
|
-
this.setAbsoluteCSSProperties();
|
|
341
|
-
}
|
|
342
|
-
else {
|
|
343
|
-
this.setFixedCSSProperties();
|
|
344
|
-
}
|
|
345
|
-
}
|
|
346
|
-
setRootElement() {
|
|
347
|
-
let currentElement = this.hostElement;
|
|
348
|
-
while (currentElement && currentElement !== document.documentElement) {
|
|
349
|
-
const computedStyle = window.getComputedStyle(currentElement);
|
|
350
|
-
// Check if the element has any styles applied that create a new containg block
|
|
351
|
-
if (computedStyle.transform !== 'none' ||
|
|
352
|
-
computedStyle.filter !== 'none' ||
|
|
353
|
-
computedStyle.perspective !== 'none' ||
|
|
354
|
-
computedStyle.containerType !== 'normal' ||
|
|
355
|
-
['transform', 'perspective', 'filter'].includes(computedStyle.willChange) ||
|
|
356
|
-
['layout', 'paint', 'strict', 'content'].includes(computedStyle.contain)) {
|
|
357
|
-
this.rootElementRect = currentElement.getBoundingClientRect();
|
|
358
|
-
return;
|
|
359
|
-
}
|
|
360
|
-
const rootNode = currentElement.getRootNode();
|
|
361
|
-
const isRootNodeWebComponent = typeof ShadowRoot !== 'undefined' &&
|
|
362
|
-
rootNode instanceof ShadowRoot &&
|
|
363
|
-
rootNode.host instanceof HTMLElement;
|
|
364
|
-
if (isRootNodeWebComponent) {
|
|
365
|
-
currentElement = rootNode.host;
|
|
366
|
-
}
|
|
367
|
-
else {
|
|
368
|
-
currentElement = currentElement.parentElement;
|
|
369
|
-
}
|
|
370
|
-
}
|
|
371
|
-
// Return the document's bounding rect if no element is found
|
|
372
|
-
this.rootElementRect = {
|
|
373
|
-
top: 0,
|
|
374
|
-
bottom: 0,
|
|
375
|
-
left: 0,
|
|
376
|
-
right: 0,
|
|
377
|
-
height: window.visualViewport.height,
|
|
378
|
-
width: window.visualViewport.width,
|
|
379
|
-
};
|
|
380
|
-
}
|
|
381
|
-
// #endregion
|
|
382
|
-
// #region Render Methods
|
|
383
|
-
render() {
|
|
384
|
-
const containerClasses = ['container', this.currentDirection];
|
|
385
|
-
if (this.show)
|
|
386
|
-
containerClasses.push('show');
|
|
387
|
-
if (this.mode === 'legacy')
|
|
388
|
-
containerClasses.push('legacy');
|
|
389
|
-
return (h("div", { key: 'ea60a3f8f2005cd25dac56ac3c681aa5dbc27111', ref: el => (this.containerElement = el), class: containerClasses.join(' '), "test-id": "outerContainer" }, h("div", { key: '92041f64b8d066240de5653f9035bb9165697525', ref: el => (this.contentElement = el), class: "content" }, h("slot", { key: '65db5e767d8992e8c084c045094306b6be42879f' }))));
|
|
390
|
-
}
|
|
391
|
-
get hostElement() { return getElement(this); }
|
|
392
|
-
static get watchers() { return {
|
|
393
|
-
"minHeight": ["minHeightProvided"],
|
|
394
|
-
"open": ["openChanged"]
|
|
395
|
-
}; }
|
|
396
|
-
};
|
|
397
|
-
Q2Popover.style = Q2PopoverStyle0;
|
|
398
|
-
|
|
399
|
-
export { ClickElsewhere as click_elsewhere, Q2Popover as q2_popover };
|
|
400
|
-
|
|
401
|
-
//# sourceMappingURL=click-elsewhere_2.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"click-elsewhere.q2-popover.entry.js","mappings":";;;MAMa,cAAc;IAJ3B;;;;QAOI,uBAAkB,GAAY,KAAK,CAAC;;;;QAIpC,mBAAc,GAAa,CAAC,WAAW,EAAE,WAAW,EAAE,YAAY,CAAC,CAAC;QAqDpE,iBAAY,GAAG,CAAC,KAAY;YACxB,MAAM,kBAAkB,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,iBAAiB,EAAE,CAAC,CAAC;YACzE,MAAM,gBAAgB,GAClB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAC,IAAI,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,MAAiB,CAAC,CAAC;YAE1G,IAAI,CAAC,gBAAgB,KAAK,IAAI,CAAC,kBAAkB,IAAI,kBAAkB,CAAC,EAAE;gBACtE,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;gBAChC,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;gBACnB,OAAO;aACV;YACD,IAAI,CAAC,kBAAkB,GAAG,gBAAgB,IAAI,kBAAkB,CAAC;SACpE,CAAC;QAsCF,sBAAiB,GAAG;YAChB,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;YAChC,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;SACtB,CAAC;KACL;;;;IApFG,iBAAiB;QACb,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,SAAiB;YAC1C,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;SAC3D,CAAC,CAAC;QACH,MAAM,CAAC,gBAAgB,CAAC,MAAM,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;KAC3D;IAED,oBAAoB;QAChB,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,SAAiB;YAC1C,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;SAC9D,CAAC,CAAC;QACH,MAAM,CAAC,mBAAmB,CAAC,MAAM,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;KAC9D;;;IAID,iBAAiB,MAAK;;;IAKtB,iBAAiB;QACb,IAAI,cAAc,GAAG,QAAQ,CAAC,aAAc,CAAC;QAC7C,OAAO,IAAI,EAAE;YACT,IAAI,CAAC,cAAc,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE;gBAC/C,OAAO,cAAc,CAAC;aACzB;YACD,cAAc,GAAG,cAAc,CAAC,UAAU,CAAC,aAAa,CAAC;SAC5D;KACJ;IAeD,iBAAiB,CAAC,MAAe;QAC7B,MAAM,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC;QACxD,KAAK,MAAM,WAAW,IAAI,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;YACzC,MAAM,UAAU,GACZ,CAAC,WAAW,IAAI,WAAW,CAAC,aAAa,IAAI,WAAW,CAAC,aAAa,EAAE;gBACxE,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC;YAEhC,KAAK,MAAM,WAAW,IAAI,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE;gBAC9C,IAAI,WAAW,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;oBAC9B,OAAO,IAAI,CAAC;iBACf;aACJ;SACJ;QACD,OAAO,KAAK,CAAC;KAChB;IAED,cAAc,CAAC,KAAU;;;;QAKrB,OAAO,IAAI,EAAE;YACT,IAAI,KAAK,KAAK,IAAI,CAAC,WAAW,EAAE;gBAC5B,OAAO,IAAI,CAAC;aACf;YACD,IAAI,CAAC,KAAK,EAAE;gBACR,OAAO,KAAK,CAAC;aAChB;YACD,KAAK,GAAG,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,IAAI,CAAC;SAC1C;KACJ;IAED,iBAAiB,CAAC,KAAU;QACxB,OAAO,KAAK,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,MAAM,CAAC;KAClD;;;;ACjHL,MAAM,YAAY,GAAG,4iFAA4iF,CAAC;AAClkF,wBAAe,YAAY;;MCed,SAAS;;;;;;;QAQlB,kBAAa,GAAG,EAAE,CAAC;;QAEnB,uBAAkB,GAAY,KAAK,CAAC;QAkPpC,oBAAe,GAAG;YACd,IAAI,IAAI,CAAC,SAAS,EAAE;gBAChB,wBAAwB,CAAC,IAAI,EAAE,WAAW,EAAE,MAAM,CAAC,CAAC;aACvD;SACJ,CAAC;QAYF,6BAAwB,GAAG;YACvB,MAAM,EAAE,cAAc,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;YAE3E,IAAI,KAAK,KAAK,OAAO,EAAE;gBACnB,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,kBAAkB,EAAE,GAAG,CAAC,CAAC;gBAC5D,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,iBAAiB,EAAE,OAAO,CAAC,CAAC;aAClE;iBAAM;gBACH,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,iBAAiB,EAAE,GAAG,CAAC,CAAC;gBAC3D,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,kBAAkB,EAAE,OAAO,CAAC,CAAC;aACnE;YAED,IAAI,IAAI,CAAC,KAAK,EAAE;gBACZ,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,kBAAkB,EAAE,MAAM,CAAC,CAAC;aAClE;YAED,IAAI,gBAAgB,KAAK,IAAI,EAAE;gBAC3B,MAAM,YAAY,GAAG,gBAAgB,CAAC,cAAc,CAAC,CAAC;gBACtD,MAAM,WAAW,GACb,QAAQ,CAAC,YAAY,CAAC,MAAM,IAAI,GAAG,CAAC;oBACpC,QAAQ,CAAC,YAAY,CAAC,cAAc,IAAI,GAAG,CAAC;oBAC5C,QAAQ,CAAC,YAAY,CAAC,iBAAiB,IAAI,GAAG,CAAC,CAAC;gBAEpD,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,mBAAmB,EAAE,GAAG,WAAW,IAAI,CAAC,CAAC;aAC/E;;YAGD,MAAM,gBAAgB,EAAE,CAAC;YACzB,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,oBAAoB,EAAE,GAAG,CAAC,CAAC;SACjE,CAAC;QAkBF,0BAAqB,GAAG;;YACpB,MAAM,EAAE,cAAc,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,eAAe,EAAE,GAAG,IAAI,CAAC;YACrF,MAAM,EACF,GAAG,EAAE,UAAU,EACf,MAAM,EAAE,aAAa,EACrB,IAAI,EAAE,WAAW,EACjB,KAAK,EAAE,YAAY,GACtB,GAAG,MAAA,MAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,qBAAqB,8DAAI,mCAAI;gBAC7C,GAAG,EAAE,CAAC;gBACN,MAAM,EAAE,CAAC;gBACT,IAAI,EAAE,CAAC;gBACP,KAAK,EAAE,CAAC;aACX,CAAC;YACF,MAAM,WAAW,GAAW,WAAW,GAAG,eAAe,CAAC,IAAI,CAAC;YAE/D,IAAI,IAAI,CAAC,KAAK;gBAAE,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,kBAAkB,EAAE,GAAG,CAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,WAAW,KAAI,CAAC,IAAI,CAAC,CAAC;YAChH,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,iBAAiB,EAAE,GAAG,WAAW,IAAI,CAAC,CAAC;YAC1E,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAC9B,kBAAkB,EAClB,GAAG,eAAe,CAAC,KAAK,GAAG,eAAe,CAAC,IAAI,GAAG,YAAY,IAAI,CACrE,CAAC;YAEF,IAAI,gBAAgB,KAAK,IAAI,EAAE;gBAC3B,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAC9B,mBAAmB,EACnB,GAAG,eAAe,CAAC,MAAM,GAAG,eAAe,CAAC,GAAG,GAAG,UAAU,IAAI,CACnE,CAAC;aACL;YACD,IAAI,gBAAgB,KAAK,MAAM,EAAE;gBAC7B,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,gBAAgB,EAAE,GAAG,aAAa,GAAG,eAAe,CAAC,GAAG,IAAI,CAAC,CAAC;aACpG;;YAGD,MAAM,gBAAgB,EAAE,CAAC;YACzB,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,oBAAoB,EAAE,GAAG,CAAC,CAAC;SACjE,CAAC;QA4CF,oBAAe,GAAG;YACd,IAAI,CAAC,IAAI,CAAC,IAAI;gBAAE,OAAO;YACvB,IAAI,CAAC,qBAAqB,EAAE,CAAC;SAChC,CAAC;QAEF,+BAA0B,GAAG;YACzB,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;YAC/B,IAAI,CAAC,eAAe,EAAE,CAAC;SAC1B,CAAC;gCA1XgC,SAAS;oBAI3B,KAAK;;;;;;;oBAoCJ,IAAI;;;;;IAkBrB,oBAAoB;QAChB,IAAI,CAAC,uBAAuB,EAAE,CAAC;KAClC;IAED,gBAAgB;QACZ,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,IAAI,CAAC,IAAI;YAAE,IAAI,CAAC,qBAAqB,EAAE,CAAC;KAC/C;;;IAMD,mBAAmB,CAAC,KAAqC;QACrD,MAAM,EACF,MAAM,EAAE,EAAE,IAAI,EAAE,GACnB,GAAG,KAAK,CAAC;QACV,IAAI,IAAI,KAAK,IAAI,CAAC,IAAI;YAAE,OAAO;QAE/B,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,KAAK,CAAC,eAAe,EAAE,CAAC;KAC3B;;;IAMD,MAAM,iBAAiB,CAAC,OAAwB;QAC5C,IAAI,CAAC,gBAAgB,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;KAC3C;IAGD,MAAM,MAAM;QACR,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;KAC1B;;;IAMD,iBAAiB;QACb,IAAI,CAAC,eAAe,EAAE,CAAC;KAC1B;IAGD,MAAM,WAAW,CAAC,IAAa;QAC3B,IAAI,CAAC,cAAc,EAAE,CAAC;QACtB,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC;QAExC,IAAI,IAAI,EAAE;YACN,IAAI,CAAC,oBAAoB,EAAE,CAAC;YAC5B,IAAI,CAAC,qBAAqB,EAAE,CAAC;SAChC;aAAM;YACH,IAAI,CAAC,uBAAuB,EAAE,CAAC;YAC/B,IAAI,CAAC,gBAAgB,GAAG,SAAS,CAAC;YAClC,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;YAClB,MAAM,gBAAgB,EAAE,CAAC;YACzB,IAAI,CAAC,kBAAkB,EAAE,CAAC;SAC7B;KACJ;;;IAKD,IAAI,QAAQ;;QACR,MAAM,QAAQ,GAAG,MAAM,KAAK,MAAM,CAAC,GAAG,CAAC;QACvC,MAAM,qBAAqB,GAAG,MAAM,CAAC,IAAI,CAAC,MAAA,MAAA,MAAM,CAAC,MAAM,0CAAE,kBAAkB,mCAAI,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;QAC9F,OAAO,QAAQ,IAAI,qBAAqB,CAAC;KAC5C;IAED,IAAI,iBAAiB;QACjB,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;QAC3B,QAAQ,SAAS;YACb,KAAK,IAAI,CAAC;YACV,KAAK,MAAM;gBACP,OAAO,SAAS,CAAC;YACrB;gBACI,OAAO,SAAS,CAAC;SACxB;KACJ;IAED,IAAI,kBAAkB;QAClB,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;QAC3B,OAAO,KAAK,CAAC,SAAS,CAAC,GAAG,SAAS,GAAG,SAAS,CAAC;KACnD;IAED,oBAAoB;;QAChB,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,0BAA0B,CAAC,CAAC;;QAEnE,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,eAAe,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QAC1F,MAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,WAAW,0CAAE,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,0BAA0B,CAAC,CAAC;QACjF,MAAM,CAAC,gBAAgB,CAAC,mBAAmB,EAAE,IAAI,CAAC,0BAA0B,CAAC,CAAC;;KAGjF;IAED,kBAAkB;QACd,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,cAAc,CAAC,uBAAuB,CAAC,CAAC;QACpE,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,CAAC;QAC7D,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,cAAc,CAAC,mBAAmB,CAAC,CAAC;QAChE,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAC;QAC9D,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,cAAc,CAAC,kBAAkB,CAAC,CAAC;QAC/D,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,cAAc,CAAC,kBAAkB,CAAC,CAAC;QAC/D,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,cAAc,CAAC,oBAAoB,CAAC,CAAC;KACpE;IAED,MAAM,qBAAqB;;QACvB,MAAM,EAAE,gBAAgB,EAAE,cAAc,EAAE,iBAAiB,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC;QACpF,IAAI,gBAAgB;YAAE,gBAAgB,CAAC,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC;QAE9D,MAAM,gBAAgB,EAAE,CAAC;QAEzB,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QAC1B,MAAM,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,EAAE,aAAa,EAAE,GAAG,MAAA,MAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,qBAAqB,8DAAI,mCAAI;YAC5F,GAAG,EAAE,CAAC;YACN,MAAM,EAAE,CAAC;SACZ,CAAC;QAEF,IAAI,YAAoB,CAAC;QACzB,IAAI,aAAqB,CAAC;QAC1B,IAAI,aAAqB,CAAC;QAE1B,IAAI,QAAQ,EAAE;YACV,MAAM,EAAE,YAAY,GAAG,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC,WAAW,EAAE,GAAG,CAAA,MAAA,MAAM,CAAC,MAAM,0CAAE,kBAAkB,KAAI,EAAE,CAAC;YACvG,MAAM,sBAAsB,GAAG,MAAM,CAAC,cAAc,CAAC,MAAM,GAAG,aAAa,CAAC;YAC5E,MAAM,kBAAkB,GAAG,WAAW,IAAI,YAAY,GAAG,aAAa,CAAC,CAAC;YACxE,MAAM,yBAAyB,GAAG,sBAAsB,GAAG,kBAAkB,CAAC;YAC9E,YAAY,GAAG,WAAW,CAAC;;;YAG3B,aAAa,GAAG,CAAC,YAAY,GAAG,CAAC,GAAG,UAAU,GAAG,UAAU,GAAG,YAAY,IAAI,aAAa,CAAC;YAC5F,aAAa,GAAG,yBAAyB;kBACnC,sBAAsB,GAAG,aAAa;kBACtC,kBAAkB,GAAG,aAAa,CAAC;SAC5C;aAAM;YACH,YAAY,GAAG,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC;YAC5C,aAAa,GAAG,UAAU,GAAG,aAAa,CAAC;YAC3C,aAAa,GAAG,YAAY,GAAG,aAAa,GAAG,aAAa,CAAC;SAChE;QAED,MAAM,sBAAsB,GAAkB,aAAa,GAAG,aAAa,GAAG,IAAI,GAAG,MAAM,CAAC;;QAG5F,MAAM,qBAAqB,GACvB,CAAC,gBAAgB,CAAC,KAAK,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,IAAI,IAAI,CAAC,kBAAkB,CAAC;;QAEjG,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;QAChC,MAAM,2BAA2B,GAAG,IAAI,CAAC,gBAAgB,IAAI,iBAAiB,IAAI,sBAAsB,CAAC;QAEzG,QAAQ,2BAA2B;YAC/B,KAAK,IAAI;gBACL,IAAI,qBAAqB,EAAE;oBACvB,MAAM,iBAAiB,GAAG,IAAI,CAAC,kBAAkB,IAAI,aAAa,CAAC;oBACnE,MAAM,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,iBAAiB,CAAC,CAAC;oBAC7D,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,uBAAuB,EAAE,GAAG,SAAS,IAAI,CAAC,CAAC;iBACjF;gBACD,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,CAAC;gBAC/B,MAAM;YACV,KAAK,MAAM;gBACP,IAAI,qBAAqB,EAAE;oBACvB,MAAM,iBAAiB,GAAG,IAAI,CAAC,kBAAkB,IAAI,aAAa,CAAC;oBACnE,MAAM,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,iBAAiB,CAAC,CAAC;oBAC7D,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,uBAAuB,EAAE,GAAG,SAAS,IAAI,CAAC,CAAC;iBACjF;gBACD,IAAI,CAAC,mBAAmB,CAAC,MAAM,CAAC,CAAC;gBACjC,MAAM;SAGb;KACJ;IAQD,uBAAuB;;QACnB,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,0BAA0B,CAAC,CAAC;;QAEtE,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;QAC3D,MAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,WAAW,0CAAE,mBAAmB,CAAC,mBAAmB,EAAE,IAAI,CAAC,0BAA0B,CAAC,CAAC;QAC/F,MAAM,CAAC,mBAAmB,CAAC,mBAAmB,EAAE,IAAI,CAAC,0BAA0B,CAAC,CAAC;;KAGpF;IAgCD,mBAAmB,CAAC,SAAwB;QACxC,IAAI,CAAC,cAAc,EAAE,CAAC;;;QAGtB,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC;QACzB,IAAI,CAAC,MAAM;YAAE,OAAO;QAEpB,IAAI,CAAC,gBAAgB,GAAG,SAAS,CAAC;QAClC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;YACxB,IAAI,CAAC,wBAAwB,EAAE,CAAC;SACnC;aAAM;YACH,IAAI,CAAC,qBAAqB,EAAE,CAAC;SAChC;KACJ;IAuCD,cAAc;QACV,IAAI,cAAc,GAAgB,IAAI,CAAC,WAAW,CAAC;QAEnD,OAAO,cAAc,IAAI,cAAc,KAAK,QAAQ,CAAC,eAAe,EAAE;YAClE,MAAM,aAAa,GAAG,MAAM,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;;YAG9D,IACI,aAAa,CAAC,SAAS,KAAK,MAAM;gBAClC,aAAa,CAAC,MAAM,KAAK,MAAM;gBAC/B,aAAa,CAAC,WAAW,KAAK,MAAM;gBACpC,aAAa,CAAC,aAAa,KAAK,QAAQ;gBACxC,CAAC,WAAW,EAAE,aAAa,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC;gBACzE,CAAC,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,EAC1E;gBACE,IAAI,CAAC,eAAe,GAAG,cAAc,CAAC,qBAAqB,EAAE,CAAC;gBAC9D,OAAO;aACV;YAED,MAAM,QAAQ,GAAG,cAAc,CAAC,WAAW,EAAE,CAAC;YAC9C,MAAM,sBAAsB,GACxB,OAAO,UAAU,KAAK,WAAW;gBACjC,QAAQ,YAAY,UAAU;gBAC9B,QAAQ,CAAC,IAAI,YAAY,WAAW,CAAC;YACzC,IAAI,sBAAsB,EAAE;gBACxB,cAAc,GAAG,QAAQ,CAAC,IAAI,CAAC;aAClC;iBAAM;gBACH,cAAc,GAAG,cAAc,CAAC,aAAa,CAAC;aACjD;SACJ;;QAGD,IAAI,CAAC,eAAe,GAAG;YACnB,GAAG,EAAE,CAAC;YACN,MAAM,EAAE,CAAC;YACT,IAAI,EAAE,CAAC;YACP,KAAK,EAAE,CAAC;YACR,MAAM,EAAE,MAAM,CAAC,cAAc,CAAC,MAAM;YACpC,KAAK,EAAE,MAAM,CAAC,cAAc,CAAC,KAAK;SAC1B,CAAC;KAChB;;;IAeD,MAAM;QACF,MAAM,gBAAgB,GAAG,CAAC,WAAW,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QAC9D,IAAI,IAAI,CAAC,IAAI;YAAE,gBAAgB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QAC7C,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ;YAAE,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAE5D,QACI,4DACI,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC,EACvC,KAAK,EAAE,gBAAgB,CAAC,IAAI,CAAC,GAAG,CAAC,aACzB,gBAAgB,IAExB,4DACI,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC,EACrC,KAAK,EAAC,SAAS,IAEf,8DAAQ,CACN,CACJ,EACR;KACL;;;;;;;;;;;","names":[],"sources":["src/components/click-elsewhere/click-elsewhere.tsx","src/components/q2-popover/q2-popover.scss?tag=q2-popover&encapsulation=shadow","src/components/q2-popover/q2-popover.tsx"],"sourcesContent":["import { Component, ComponentInterface, Element, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'click-elsewhere',\n shadow: false,\n})\nexport class ClickElsewhere implements ComponentInterface {\n // #region Own Properties\n\n isCurrentlyFocused: boolean = false;\n /**\n * Listens for mouse and window events that happen outside this click-elsewhere element so we can close popovers when users click outside them\n */\n mouseEventList: string[] = ['mousedown', 'dragstart', 'touchstart'];\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when the user clicks outside the element\n */\n @Event()\n change: EventEmitter;\n\n // #endregion\n // #region Component Lifecycle Events\n\n /* tslint:enable:no-empty */\n\n connectedCallback() {\n this.mouseEventList.forEach((eventName: string) => {\n document.addEventListener(eventName, this.mouseHandler);\n });\n window.addEventListener('blur', this.windowBlurHandler);\n }\n\n disconnectedCallback() {\n this.mouseEventList.forEach((eventName: string) => {\n document.removeEventListener(eventName, this.mouseHandler);\n });\n window.removeEventListener('blur', this.windowBlurHandler);\n }\n\n /* TODO: Stencil/Rollup is having issues compiling without this here. Will try to remove in future Stencil upgrade. */\n /* tslint:disable:no-empty */\n componentWillLoad() {}\n\n // #endregion\n // #region Local Methods\n\n findActiveElement(): Element | null {\n let workingElement = document.activeElement!;\n while (true) {\n if (!workingElement || !workingElement.shadowRoot) {\n return workingElement;\n }\n workingElement = workingElement.shadowRoot.activeElement;\n }\n }\n\n mouseHandler = (event: Event): void => {\n const isCurrentlyFocused = this.shadowContains(this.findActiveElement());\n const aboutToBeFocused =\n this.shadowContains(this.shadowEventTarget(event)) || this.originatesInSlots(event.target as Element);\n\n if (!aboutToBeFocused && (this.isCurrentlyFocused || isCurrentlyFocused)) {\n this.isCurrentlyFocused = false;\n this.change.emit();\n return;\n }\n this.isCurrentlyFocused = aboutToBeFocused || isCurrentlyFocused;\n };\n\n originatesInSlots(target: Element): boolean {\n const slots = this.hostElement.querySelectorAll('slot');\n for (const currentSlot of Array.from(slots)) {\n const lightNodes =\n (currentSlot && currentSlot.assignedNodes && currentSlot.assignedNodes()) ||\n this.hostElement.childNodes;\n\n for (const currentNode of Array.from(lightNodes)) {\n if (currentNode.contains(target)) {\n return true;\n }\n }\n }\n return false;\n }\n\n shadowContains(child: any): boolean {\n /**\n * shadow-dom enabled version of Node.contains()\n */\n\n while (true) {\n if (child === this.hostElement) {\n return true;\n }\n if (!child) {\n return false;\n }\n child = child.parentNode || child.host;\n }\n }\n\n shadowEventTarget(event: any): Element {\n return event.composedPath()[0] || event.target;\n }\n\n windowBlurHandler = (): void => {\n this.isCurrentlyFocused = false;\n this.change.emit();\n };\n}\n","@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n.container {\n display: none;\n}\n\n.show {\n display: block;\n position: fixed;\n z-index: var-list(--tct-popover-z-index, 50);\n margin: 0;\n padding: 0;\n overflow: auto;\n background: var-list(--tct-popover-background, --app-white, #ffffff);\n color: var-list(--tct-popover-font-color, --t-text, #4d4d4d);\n min-width: var-list(--tct-popover-min-width, 135px);\n margin-block: var-list(--tct-popover-margin-block, 0);\n box-shadow: var-list(--tct-popover-box-shadow, --app-shadow-1, unquote(\"0px 0px 2px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14)\"));\n border-width: var-list(--tct-popover-border-width, 0);\n border-style: solid;\n border-color: var-list(--tct-popover-border-color, transparent);\n border-radius: var-list(--tct-popover-border-radius, 0);\n // the following --comp variables are set via JS\n max-height: var(--comp-pop-max-height);\n left: var(--comp-pop-left);\n opacity: var(--comp-pop-opacity, 0);\n\n :host([block]) & {\n right: unset;\n width: var(--comp-pop-width);\n min-width: var-list(--tct-popover-min-width, unset);\n }\n\n :host([align='left']) & {\n left: var(--comp-pop-left);\n right: unset;\n }\n\n :host([align='right']) & {\n right: var(--comp-pop-right);\n left: unset;\n }\n\n &.down {\n top: var-list(--tct-popover-top, --comp-pop-top);\n bottom: unset;\n }\n\n &.up {\n top: unset;\n bottom: var(--comp-pop-bottom);\n }\n\n &.legacy {\n position: absolute;\n }\n\n @include tiny-scrollbar();\n}\n\nclick-elsewhere {\n position: relative;\n display: block;\n}\n","import {\n Component,\n Prop,\n h,\n ComponentInterface,\n Element,\n Watch,\n Method,\n Listen,\n EventEmitter,\n Event,\n State,\n} from '@stencil/core';\nimport { handleDeprecationWarning, waitForNextPaint } from '../../utils';\n\n@Component({ tag: 'q2-popover', shadow: true, styleUrl: 'q2-popover.scss' })\nexport class Q2Popover implements ComponentInterface {\n // #region Own Properties\n\n containerElement: HTMLDivElement;\n contentElement: HTMLDivElement;\n /**\n * The number of pixels to leave between the popover and the edge of the viewport\n */\n displayBuffer = 10;\n /** remove when Popover API is supported in iOS */\n orientationChanged: boolean = false;\n rootElementRect: DOMRect;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n currentDirection: 'down' | 'up' = undefined;\n\n // remove `show` when Popover API is supported in iOS\n @State()\n show: boolean = false;\n\n // #endregion\n // #region Public Property API\n\n /** Aligns the popover to the left or right side of the control element. */\n @Prop({ reflect: true })\n align: 'left' | 'right';\n\n /** Indicates the popover will match the width of its parent element. */\n @Prop({ reflect: true })\n block: boolean;\n\n /** The element that controls the popover's behavior. */\n @Prop()\n controlElement: HTMLElement;\n\n /**\n * Force the direction of the popover when it opens.\n * If no value is passed, the component will auto-detect the direction based on available space.\n */\n @Prop({ reflect: true })\n direction: '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 maxHeight: number;\n\n /** @deprecated */\n @Prop()\n minHeight: number;\n\n @Prop()\n mode: 'legacy' = null;\n\n /** Controls whether the popover is open or closed. */\n @Prop({ reflect: true, mutable: true })\n open: boolean;\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when the popover is opened or closed.\n */\n @Event()\n popoverStateChanged: EventEmitter<{ open: boolean }>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n this.removeViewportListeners();\n }\n\n componentDidLoad() {\n this.handleMinHeight();\n if (this.open) this.determinePopDirection();\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('popoverState')\n popoverStateHandler(event: CustomEvent<{ open: boolean }>) {\n const {\n detail: { open },\n } = event;\n if (open === this.open) return;\n\n this.open = open;\n event.stopPropagation();\n }\n\n // #endregion\n // #region Public Methods API\n\n @Method()\n async scrollContainerTo(options: ScrollToOptions) {\n this.containerElement.scrollTo(options);\n }\n\n @Method()\n async toggle() {\n this.open = !this.open;\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('minHeight')\n minHeightProvided() {\n this.handleMinHeight();\n }\n\n @Watch('open')\n async openChanged(open: boolean) {\n this.setRootElement();\n this.popoverStateChanged.emit({ open });\n\n if (open) {\n this.addViewportListeners();\n this.determinePopDirection();\n } else {\n this.removeViewportListeners();\n this.currentDirection = undefined;\n this.show = false;\n await waitForNextPaint();\n this.clearCSSProperties();\n }\n }\n\n // #endregion\n // #region Local Methods\n\n get isModule() {\n const isIframe = window !== window.top;\n const hasPlatformDimensions = Object.keys(window.Tecton?.platformDimensions ?? {}).length > 0;\n return isIframe && hasPlatformDimensions;\n }\n\n get providedDirection(): 'up' | 'down' | undefined {\n const { direction } = this;\n switch (direction) {\n case 'up':\n case 'down':\n return direction;\n default:\n return undefined;\n }\n }\n\n get validatedMaxHeight(): number | undefined {\n const { maxHeight } = this;\n return isNaN(maxHeight) ? undefined : maxHeight;\n }\n\n addViewportListeners() {\n window.addEventListener('resize', this.viewPortOrientationChanged);\n // #region remove when Popover API is supported in iOS\n window.addEventListener('scroll', this.viewPortChanged, { passive: true, capture: true });\n screen?.orientation?.addEventListener('change', this.viewPortOrientationChanged);\n window.addEventListener('orientationchange', this.viewPortOrientationChanged);\n\n // #endregion\n }\n\n clearCSSProperties() {\n this.containerElement.style.removeProperty('--comp-pop-max-height');\n this.containerElement.style.removeProperty('--comp-pop-top');\n this.containerElement.style.removeProperty('--comp-pop-bottom');\n this.containerElement.style.removeProperty('--comp-pop-left');\n this.containerElement.style.removeProperty('--comp-pop-right');\n this.containerElement.style.removeProperty('--comp-pop-width');\n this.containerElement.style.removeProperty('--comp-pop-opacity');\n }\n\n async determinePopDirection() {\n const { containerElement, controlElement, providedDirection, displayBuffer } = this;\n if (containerElement) containerElement.style.maxHeight = null;\n\n await waitForNextPaint();\n\n const { isModule } = this;\n const { top: controlTop, bottom: controlBottom } = controlElement?.getBoundingClientRect?.() ?? {\n top: 0,\n bottom: 0,\n };\n\n let windowHeight: number;\n let maxSpaceAbove: number;\n let maxSpaceBelow: number;\n\n if (isModule) {\n const { outletOffset = 0, innerHeight = window.innerHeight } = window.Tecton?.platformDimensions || {};\n const distanceToIframeBottom = window.visualViewport.height - controlBottom;\n const viewableSpaceBelow = innerHeight - (outletOffset + controlBottom);\n const isIframeShorterThanWindow = distanceToIframeBottom < viewableSpaceBelow;\n windowHeight = innerHeight;\n // If the top of the module is below the top of the window we just use the controlTop\n // Otherwise we need to add the outletOffset to the controlTop\n maxSpaceAbove = (outletOffset > 0 ? controlTop : controlTop + outletOffset) - displayBuffer;\n maxSpaceBelow = isIframeShorterThanWindow\n ? distanceToIframeBottom - displayBuffer\n : viewableSpaceBelow - displayBuffer;\n } else {\n windowHeight = window.visualViewport.height;\n maxSpaceAbove = controlTop - displayBuffer;\n maxSpaceBelow = windowHeight - controlBottom - displayBuffer;\n }\n\n const directionWithMostSpace: 'up' | 'down' = maxSpaceAbove > maxSpaceBelow ? 'up' : 'down';\n\n // We do not want to update the max height once the popover is open unless the page orientation shifts (resize or mobile use cases)\n const shouldUpdateMaxHeight =\n !containerElement.style.getPropertyValue('--comp-pop-max-height') || this.orientationChanged;\n // we do not want to constantly update the max-height after an orientation change, so we switch this back to false\n this.orientationChanged = false;\n const currentOrDetermineDirection = this.currentDirection || providedDirection || directionWithMostSpace;\n\n switch (currentOrDetermineDirection) {\n case 'up':\n if (shouldUpdateMaxHeight) {\n const priorityMaxHeight = this.validatedMaxHeight || maxSpaceAbove;\n const maxHeight = Math.min(maxSpaceAbove, priorityMaxHeight);\n containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n }\n this.setDirectionAndShow('up');\n break;\n case 'down':\n if (shouldUpdateMaxHeight) {\n const priorityMaxHeight = this.validatedMaxHeight || maxSpaceBelow;\n const maxHeight = Math.min(maxSpaceBelow, priorityMaxHeight);\n containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n }\n this.setDirectionAndShow('down');\n break;\n default:\n break;\n }\n }\n\n handleMinHeight = () => {\n if (this.minHeight) {\n handleDeprecationWarning(this, 'minHeight', 'prop');\n }\n };\n\n removeViewportListeners() {\n window.removeEventListener('resize', this.viewPortOrientationChanged);\n // #region remove when Popover API is supported in iOS\n window.removeEventListener('scroll', this.viewPortChanged);\n screen?.orientation?.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n window.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n\n // #endregion\n }\n\n setAbsoluteCSSProperties = async () => {\n const { controlElement, containerElement, currentDirection, align } = this;\n\n if (align === 'right') {\n containerElement.style.setProperty('--comp-pop-right', '0');\n containerElement.style.setProperty('--comp-pop-left', 'unset');\n } else {\n containerElement.style.setProperty('--comp-pop-left', '0');\n containerElement.style.setProperty('--comp-pop-right', 'unset');\n }\n\n if (this.block) {\n containerElement.style.setProperty('--comp-pop-width', '100%');\n }\n\n if (currentDirection === 'up') {\n const controlStyle = getComputedStyle(controlElement);\n const controlSize =\n parseInt(controlStyle.height || '0') +\n parseInt(controlStyle.borderTopWidth || '0') +\n parseInt(controlStyle.borderBottomWidth || '0');\n\n containerElement.style.setProperty('--comp-pop-bottom', `${controlSize}px`);\n }\n\n // Wait for one paint to prevent layout thrashing\n await waitForNextPaint();\n containerElement.style.setProperty('--comp-pop-opacity', '1');\n };\n\n setDirectionAndShow(direction: 'up' | 'down') {\n this.setRootElement();\n // Due to some runtime inconsistency across devices/browsers we need to add one more check here because the\n // popover can be closed between the time the popover is opened and the time the direction is determined\n const isOpen = this.open;\n if (!isOpen) return;\n\n this.currentDirection = direction;\n this.show = true;\n if (this.mode === 'legacy') {\n this.setAbsoluteCSSProperties();\n } else {\n this.setFixedCSSProperties();\n }\n }\n\n setFixedCSSProperties = async () => {\n const { controlElement, containerElement, currentDirection, rootElementRect } = this;\n const {\n top: controlTop,\n bottom: controlBottom,\n left: controlLeft,\n right: controlRight,\n } = controlElement?.getBoundingClientRect?.() ?? {\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n };\n const popoverLeft: number = controlLeft - rootElementRect.left;\n\n if (this.block) containerElement.style.setProperty('--comp-pop-width', `${controlElement?.offsetWidth || 0}px`);\n containerElement.style.setProperty('--comp-pop-left', `${popoverLeft}px`);\n containerElement.style.setProperty(\n '--comp-pop-right',\n `${rootElementRect.width + rootElementRect.left - controlRight}px`\n );\n\n if (currentDirection === 'up') {\n containerElement.style.setProperty(\n '--comp-pop-bottom',\n `${rootElementRect.height + rootElementRect.top - controlTop}px`\n );\n }\n if (currentDirection === 'down') {\n containerElement.style.setProperty('--comp-pop-top', `${controlBottom - rootElementRect.top}px`);\n }\n\n // Wait for one paint to prevent layout thrashing\n await waitForNextPaint();\n containerElement.style.setProperty('--comp-pop-opacity', '1');\n };\n\n setRootElement() {\n let currentElement: HTMLElement = this.hostElement;\n\n while (currentElement && currentElement !== document.documentElement) {\n const computedStyle = window.getComputedStyle(currentElement);\n\n // Check if the element has any styles applied that create a new containg block\n if (\n computedStyle.transform !== 'none' ||\n computedStyle.filter !== 'none' ||\n computedStyle.perspective !== 'none' ||\n computedStyle.containerType !== 'normal' ||\n ['transform', 'perspective', 'filter'].includes(computedStyle.willChange) ||\n ['layout', 'paint', 'strict', 'content'].includes(computedStyle.contain)\n ) {\n this.rootElementRect = currentElement.getBoundingClientRect();\n return;\n }\n\n const rootNode = currentElement.getRootNode();\n const isRootNodeWebComponent =\n typeof ShadowRoot !== 'undefined' &&\n rootNode instanceof ShadowRoot &&\n rootNode.host instanceof HTMLElement;\n if (isRootNodeWebComponent) {\n currentElement = rootNode.host;\n } else {\n currentElement = currentElement.parentElement;\n }\n }\n\n // Return the document's bounding rect if no element is found\n this.rootElementRect = {\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n height: window.visualViewport.height,\n width: window.visualViewport.width,\n } as DOMRect;\n }\n\n viewPortChanged = () => {\n if (!this.open) return;\n this.determinePopDirection();\n };\n\n viewPortOrientationChanged = () => {\n this.orientationChanged = true;\n this.viewPortChanged();\n };\n\n // #endregion\n // #region Render Methods\n\n render() {\n const containerClasses = ['container', this.currentDirection];\n if (this.show) containerClasses.push('show');\n if (this.mode === 'legacy') containerClasses.push('legacy');\n\n return (\n <div\n ref={el => (this.containerElement = el)}\n class={containerClasses.join(' ')}\n test-id=\"outerContainer\"\n >\n <div\n ref={el => (this.contentElement = el)}\n class=\"content\"\n >\n <slot />\n </div>\n </div>\n );\n }\n\n // #endregion\n}\n"],"version":3}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"index-d18e2a20.js","mappings":"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","names":[],"sources":["src/utils/index.tsx"],"sourcesContent":["import { h } from '@stencil/core';\nimport { Q2Btn } from 'src/components/q2-btn/q2-btn';\nimport { Q2Calendar } from 'src/components/q2-calendar/q2-calendar';\nimport { Q2Carousel } from 'src/components/q2-carousel/q2-carousel';\nimport { Q2Checkbox } from 'src/components/q2-checkbox/q2-checkbox';\nimport { Q2CheckboxGroup } from 'src/components/q2-checkbox-group/q2-checkbox-group';\nimport { Q2RadioGroup } from 'src/components/q2-radio-group/q2-radio-group';\nimport { Q2Dropdown } from 'src/components/q2-dropdown/q2-dropdown';\nimport { Q2DropdownItem } from 'src/components/q2-dropdown-item/q2-dropdown-item';\nimport { Q2EditableField } from 'src/components/q2-editable-field/q2-editable-field';\nimport { Q2Input } from 'src/components/q2-input/q2-input';\nimport { Q2Loading } from 'src/components/q2-loading/q2-loading';\nimport { Q2Radio } from 'src/components/q2-radio/q2-radio';\nimport { Q2Select } from 'src/components/q2-select/q2-select';\nimport { FormFieldTypes, IDict } from 'src/util';\n\nexport const debounce = <F extends (...args: Parameters<F>) => ReturnType<F>>(fn: F, delay: number = 300) => {\n let timeout: ReturnType<typeof setTimeout>;\n return function (...args: Parameters<F>) {\n clearTimeout(timeout);\n timeout = setTimeout(() => {\n fn(...args);\n }, delay);\n };\n};\n\nexport function isMobile(): boolean {\n return /Android|webOS|iPhone|iPad|iPod|BlackBerry|Mobile|IEMobile|Windows Phone|Opera Mini/i.test(\n navigator.userAgent\n );\n}\n\nexport function isHostLosingFocus(event: FocusEvent, hostElement: HTMLElement) {\n const type = event.type;\n const focusInTypes = ['focusin', 'focus'];\n const isFocusIn = focusInTypes.includes(type);\n\n // on focusin: `target` is element losing focus, `relatedTarget` is element gaining focus\n // on focusout: `target` is element gaining focus, `relatedTarget` is element losing focus\n const elementGainingFocus = isFocusIn ? event.target : event.relatedTarget;\n\n const isElementNestedInHostElement = (element: HTMLElement) => {\n if (element === hostElement) return true;\n if (element.parentElement) {\n return isElementNestedInHostElement(element.parentElement);\n }\n return false;\n };\n\n if (!(elementGainingFocus instanceof HTMLElement)) return true;\n return !isElementNestedInHostElement(elementGainingFocus);\n}\n\nexport function isRelatedTargetWithinHost(event: FocusEvent, element: HTMLElement) {\n return event.relatedTarget !== element && !element.contains(event.relatedTarget as Node);\n}\n\nexport function isEventFromElement(event: Event, element: HTMLElement): boolean {\n return event.composedPath?.()[0] === element;\n}\n\nexport function overrideFocus(hostElement: HTMLElement) {\n hostElement.focus = () => hostElement?.dispatchEvent(new FocusEvent('focus', { bubbles: false }));\n}\n\nexport function isFirefox() {\n const userAgent = navigator.userAgent.toLowerCase();\n return userAgent.includes('firefox');\n}\n\nexport function isTouchDevice() {\n return 'ontouchstart' in window || navigator.maxTouchPoints > 0;\n}\n\nexport function isSafari() {\n const userAgent = navigator.userAgent.toLowerCase();\n return userAgent.includes('safari') && !userAgent.includes('chrome');\n}\n\n/**\n * Returns the value of a prop if it is defined and included in the `validValues`\n * array. This is used primarily to prevent Vue wrappers from setting aria props\n * to \"Symbol()\" when the prop is not set.\n */\nexport function getAriaValueFromProp(prop: string, validValues?: string[]) {\n if (prop === undefined) return prop;\n if (!validValues) return prop !== 'Symbol()' ? prop : undefined;\n return validValues.includes(prop) || prop === '' ? prop : undefined;\n}\n\nlet guid: number = 1000;\nexport function createGuid(): number {\n return guid++;\n}\n\nexport function nextPaint(fn: (value?: unknown) => void) {\n requestAnimationFrame(() => {\n requestAnimationFrame(fn);\n });\n}\n\nexport function isVisible(element: HTMLElement) {\n return element.offsetWidth > 0 || element.offsetHeight > 0 || element.getClientRects().length > 0;\n}\n\nexport function waitForNextPaint() {\n return new Promise(resolve => nextPaint(resolve));\n}\n\nexport function capitalize(value: string) {\n return `${value.charAt(0).toUpperCase()}${value.slice(1)}`;\n}\n\nexport function pick(props: string[]): (obj: object) => object {\n return obj => {\n return props.reduce((memo, prop) => {\n return {\n ...memo,\n [prop]: obj[prop],\n };\n }, {});\n };\n}\n\nexport function loc(key: string, subs?: IDict<any> | string[]) {\n if (!key) return '';\n if (window.Tecton?.noStrings === true) {\n return key;\n }\n return window?.TectonElements?.loc(key, subs) ?? key;\n}\n\nexport function renderLabel(target: FormFieldTypes | Q2RadioGroup | Q2CheckboxGroup) {\n const { label, hideLabel, optional, readonly } = target;\n const labelClasses: string[] = ['input-label'];\n let helpText = '';\n\n let shouldHideLabel = hideLabel;\n if (!shouldHideLabel) {\n const labelSlotElements = target.hostElement.querySelectorAll<HTMLSlotElement>('[slot=\"label\"]');\n const hasSlotContent = labelSlotElements.length > 0;\n const hasLabel = !!label;\n\n shouldHideLabel = hasLabel || hasSlotContent ? false : true;\n }\n\n if (shouldHideLabel) labelClasses.push('sr');\n if (optional) {\n helpText = <span class=\"optional-tag\">{loc('tecton.element.input.optional')}</span>;\n }\n if (readonly) {\n helpText = <span class=\"optional-tag\">{loc('tecton.element.input.readonly')}</span>;\n labelClasses.push('readonly-field');\n }\n return (\n <label\n htmlFor={target.inputId}\n class={labelClasses.join(' ')}\n >\n <slot name=\"label\">\n {label ? loc(label) : undefined}\n {helpText}\n </slot>\n </label>\n );\n}\n\nexport function hasSlotContent(target: HTMLElement, slotName: string) {\n return target.querySelector(`[slot=\"${slotName}\"]`) !== null;\n}\n\nexport function handleAriaLabel(\n target:\n | Q2Input\n | Q2Select\n | Q2Radio\n | Q2Checkbox\n | Q2EditableField\n | Q2Dropdown\n | Q2DropdownItem\n | Q2Loading\n | Q2Carousel\n | Q2Calendar\n | Q2Btn\n) {\n const { ariaLabel } = target;\n if (!ariaLabel) return;\n\n // If empty ariaLabel prop is set to primitive symbol by framework wrapper, set ariaLabel to undefined and return\n const FW_WRAPPERS_EMPTY_PROP = Symbol().toString();\n if (ariaLabel === FW_WRAPPERS_EMPTY_PROP) {\n target.ariaLabel = undefined;\n return;\n }\n\n // If ariaLabel is set, set hideLabel to true and set label to ariaLabel\n if ('hideLabel' in target) target.hideLabel = true;\n target.label = loc(ariaLabel);\n target.ariaLabel = undefined;\n}\n\n/**\n * Handles when a prop has been renamed on a component without introducing a breaking change.\n */\nexport function handleRenamedProp(target: object, oldProp: string, newProp: string, removeOldProp?: boolean) {\n if (typeof target[oldProp] === 'undefined') return;\n\n // If old prop has value, aka set in component, call handleDeprecationWarning()\n if (target[oldProp]) {\n handleDeprecationWarning(target, oldProp, 'prop');\n }\n\n target[newProp] = target[oldProp];\n\n if (removeOldProp) {\n delete target[oldProp];\n }\n}\n\nexport function handleDeprecationWarning(\n target: object,\n deprecatedItemName: string,\n deprecatedItemType: 'function' | 'prop' | 'method' | 'event'\n) {\n if (window.location.hostname === 'localhost' || window.location.host === 'stack.q2developer.com') {\n if (target[deprecatedItemName] === 'undefined') return;\n\n const componentName = target.constructor.name.toLowerCase().slice(2);\n\n switch (deprecatedItemType) {\n case 'prop':\n if (deprecatedItemName === 'size' && componentName === 'btn') {\n console.warn(\n `The property of size in q2-btn should not be typeof number, or typeof string containing a number. This functionality will be deprecated in an upcoming release. Instead, please use the value 'undefined', or typeof string with any of the following values: \"small\" / \"medium\" / \"large\" `\n );\n } else {\n console.warn(\n `The property ${deprecatedItemName} in q2-${componentName} has been marked for deprecation and will be removed in an upcoming major release.`\n );\n }\n break;\n\n case 'function':\n console.warn(\n `The function ${deprecatedItemName} in ${componentName} has been marked for deprecation and will be removed in an upcoming major release.`\n );\n break;\n\n case 'method':\n console.warn(\n `The method ${deprecatedItemName} in ${componentName} has been marked for deprecation and will be removed in an upcoming major release.`\n );\n break;\n\n case 'event':\n console.warn(\n `The event ${deprecatedItemName} in ${componentName} has been marked for deprecation and will be removed in an upcoming major release.`\n );\n break;\n\n default:\n console.error(\n `handleDeprecationWarning --> No type found for desired deprecation: ${deprecatedItemName} in q2-${componentName}: deprecatedItemType = ${deprecatedItemName}`\n );\n }\n }\n}\n\nexport function renderMessages(target: FormFieldTypes) {\n const type = target.hasError ? 'danger' : 'info';\n\n return (\n <div class=\"messages-container\">\n <q2-message\n appearance=\"minimal\"\n description\n type={type}\n test-id=\"message\"\n >\n <ul id={target.inputDescribedBy}>\n {target.messages.map(message => (\n <li test-id=\"messageListItem\">{loc(message)}</li>\n ))}\n </ul>\n </q2-message>\n </div>\n );\n}\n\nexport function setMessageHeight(target: FormFieldTypes) {\n const messageContainer = (target.hostElement.shadowRoot as ShadowRoot).querySelector<HTMLDivElement>(\n '.messages-container'\n );\n const q2Message = messageContainer.querySelector('q2-message');\n nextPaint(() => {\n const height = target.showMessages && target.hasFocus ? q2Message.getBoundingClientRect().height : 0;\n\n if (messageContainer.style.getPropertyValue('height') === `${height}px`) return;\n\n if (height === 0) {\n q2Message.classList.add('invisible');\n messageContainer.style.removeProperty('height');\n } else {\n q2Message.classList.remove('invisible');\n messageContainer.style.setProperty('height', `${height}px`);\n }\n });\n}\n\nexport const resizeIframe = () => {\n return window.TectonElements?.resizeIframe?.();\n};\n\n// Handling color attribute (deprecated)\nexport const handleColor = (target: Q2Btn) => {\n if (!target.intent && ['primary', 'secondary'].includes(target.color)) {\n target.intent = `workflow-${target.color}` as HTMLQ2BtnElement['intent'];\n target.color = undefined;\n }\n};\n\n/**\n * Gets all translated text content from an element, including shadow DOM content\n *\n * @param {Element} element - The element to extract text from\n * @param {Object} options - Configuration options\n * @param {boolean} [options.trim=true] - Whether to trim whitespace\n * @param {boolean} [options.normalizeWhitespace=false] - Whether to normalize whitespace\n * @param {boolean} [options.skipComponentReady=false] - Skip waiting for components (for test environments)\n * @return {Promise<string>} All translated text content in DOM order\n */\nexport const getAllText = async (element, options = {}) => {\n if (!element) return '';\n\n const opts = {\n trim: true,\n normalizeWhitespace: false,\n skipComponentReady: false,\n ...options,\n };\n\n const nodesToSkip = new Set(['STYLE', 'SCRIPT', 'NOSCRIPT', 'TEMPLATE', '#comment']);\n const processedNodes = new WeakSet();\n let result = '';\n\n async function processNode(node) {\n if (processedNodes.has(node) || nodesToSkip.has(node.nodeName)) return;\n\n processedNodes.add(node);\n\n // Handle text nodes\n if (node.nodeType === Node.TEXT_NODE) {\n const text = opts.trim ? node.textContent.trim() : node.textContent;\n\n if (text) {\n // Add space between adjacent text nodes if needed\n if (result && !result.endsWith(' ') && !text.startsWith(' ')) {\n result += ' ';\n }\n\n // Translate the text\n result += opts.skipComponentReady ? window.TectonElements?.loc(text) : loc(text);\n }\n return;\n }\n\n // Handle element nodes\n if (node.nodeType === Node.ELEMENT_NODE) {\n // Wait for Stencil component if needed\n const isStencilComponent = node.nodeName.startsWith('Q2-') && typeof node.componentOnReady === 'function';\n\n if (isStencilComponent && !opts.skipComponentReady) {\n await node.componentOnReady();\n }\n\n // Process children in light DOM\n for (const child of node.childNodes) {\n await processNode(child);\n }\n\n // Process shadow DOM if present\n if (node.shadowRoot) {\n for (const shadowChild of node.shadowRoot.childNodes) {\n await processNode(shadowChild);\n }\n }\n\n // Handle slot elements with assigned nodes\n if (node.nodeName === 'SLOT' && typeof node.assignedNodes === 'function') {\n const assignedNodes = node.assignedNodes();\n\n if (assignedNodes.length > 0) {\n for (const assigned of assignedNodes) {\n if (!processedNodes.has(assigned)) {\n await processNode(assigned);\n }\n }\n } else {\n // Process slot fallback content\n for (const fallback of node.childNodes) {\n if (!processedNodes.has(fallback)) {\n await processNode(fallback);\n }\n }\n }\n }\n }\n }\n\n await processNode(element);\n\n // Apply final formatting\n if (opts.trim) {\n result = result.trim();\n }\n\n if (opts.normalizeWhitespace) {\n result = result.replace(/\\s+/g, ' ');\n }\n\n return result;\n};\n"],"version":3}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"q2-item.entry.js","mappings":"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","names":[],"sources":["src/components/q2-item/q2-item.scss?tag=q2-item&encapsulation=shadow","src/components/q2-item/q2-item.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n@import '../q2-btn/q2-btn-mixins';\n\n:host {\n display: block;\n}\n\n:host([clickable]) {\n cursor: pointer;\n --comp-background: #{var-list(\n --tct-btn-primary-background,\n --tct-btn-primary-bg,\n --t-a11y-active-gray-color-AA,\n #404040\n )};\n .item {\n --comp-border-radius: #{var-list(--tct-item-border-radius, --app-border-radius-1, 4px)};\n --comp-btn-tween: #{var-list(var-prefixer(btn-tween), --tct-tween-1, --app-tween-1, unquote('0.2s ease'))};\n --comp-btn-fallback-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);\n --comp-hover-box-shadow: #{var-list(--tct-btn-primary-box-shadow, --comp-btn-fallback-box-shadow)};\n --comp-active-box-shadow: var(--tct-btn-primary-active-background, #0063a0);\n --comp-font-color: #{var-list(--tct-btn-primary-font-color, --app-white, #ffffff)};\n @include btn-ring(primary, hover, --comp-background, --comp-font-color, null);\n &:hover {\n box-shadow: var(--comp-hover-box-shadow);\n }\n &:active {\n box-shadow: var(--comp-active-box-shadow);\n }\n &:focus-visible {\n box-shadow: var(--const-double-focus-ring);\n }\n }\n}\n\n.action {\n --tct-btn-icon-height: #{var-list(--tct-item-action-icon-height, --app-scale-6x, 30px)};\n --tct-btn-icon-width: #{var-list(--tct-item-action-icon-width, --app-scale-6x, 30px)};\n --tct-icon-size: #{var-list(--tct-item-action-icon-size, --app-scale-6x, 30px)};\n --tct-radio-label-hidden-columns: 18px;\n --tct-radio-label-margin-right: 0;\n --tct-radio-margin: 0;\n\n align-items: center;\n display: flex;\n grid-row: 1;\n justify-content: center;\n\n &-no-bullet {\n grid-column: 2;\n }\n}\n\n.body {\n color: var-list(--tct-item-body-color, --t-textA, #747474);\n font-size: var-list(--tct-item-body-font-size, --app-font-size, 14px);\n font-weight: var-list(--tct-item-body-font-weight, 400);\n}\n\n.bullet {\n --tct-avatar-fallback-height: #{var-list(--tct-item-avatar-height, --app-scale-7x, 35px)};\n --tct-avatar-fallback-width: #{var-list(--tct-item-avatar-width, --app-scale-7x, 35px)};\n --tct-avatar-height: #{var-list(--tct-item-avatar-height, --app-scale-7x, 35px)};\n --tct-avatar-width: #{var-list(--tct-item-avatar-width, --app-scale-7x, 35px)};\n\n grid-column: 1;\n grid-row-start: 1;\n grid-row-end: 3;\n padding-top: var-list(--tct-item-bullet-padding-top, --app-scale-1x, 5px);\n text-align: center;\n\n &-no-footer {\n grid-row-end: 2;\n }\n}\n\n.footer {\n grid-column-start: 2;\n grid-column-end: 4;\n grid-row: 2;\n\n &-no-action-nor-bullet {\n grid-column-start: 1;\n grid-column-end: 2;\n }\n\n &-no-action {\n grid-column-start: 2;\n grid-column-end: 3;\n }\n\n &-no-bullet {\n grid-column-start: 1;\n grid-column-end: 3;\n }\n}\n\n.header {\n color: var-list(--tct-item-header-color, --t-text, #4d4d4d);\n font-size: var-list(--tct-item-header-font-size, 16px);\n font-weight: var-list(--tct-item-header-font-weight, 600);\n line-height: var-list(--tct-item-header-line-height, 1.5);\n}\n\n.item {\n border: var(--tct-item-border);\n border-radius: var(--comp-border-radius);\n transition: var(--comp-btn-tween);\n transition-property: box-shadow;\n column-gap: var-list(--tct-item-horizontal-spacing, --app-scale-3x, 15px);\n display: grid;\n grid-template-columns: minmax(var(--app-scale-7x, 35px), auto) minmax(auto, 1fr) minmax(\n var(--app-scale-5x, 25px),\n auto\n );\n grid-template-rows: auto auto;\n padding: var(--tct-item-padding, 0);\n row-gap: var(--tct-item-vertical-spacing, var(--app-scale-2x, 10px));\n\n &-no-action-nor-bullet {\n grid-template-columns: auto;\n }\n\n &-no-action {\n grid-template-columns: minmax(var(--app-scale-7x, 35px), auto) minmax(auto, 1fr);\n }\n\n &-no-footer {\n grid-template-rows: auto;\n }\n\n &-no-bullet {\n grid-template-columns: minmax(auto, 1fr) minmax(var(--app-scale-5x, 25px), auto);\n }\n}\n\n.main {\n grid-column: 2;\n grid-row: 1;\n\n &-no-action-nor-bullet {\n grid-column: 1;\n }\n\n &-no-bullet {\n grid-column: 1;\n }\n}\n","import { Component, Element, Listen, h, State, Prop } from '@stencil/core';\nimport { hasSlotContent, overrideFocus } from 'src/utils';\n\n@Component({\n tag: 'q2-item',\n styleUrl: 'q2-item.scss',\n shadow: true,\n})\nexport class Q2Item {\n // #region Own Properties\n\n itemElement: HTMLDivElement;\n mutationObserver: MutationObserver;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n renderTrigger: number = 0;\n\n // #endregion\n // #region Public Property API\n\n /** Makes the item clickable. */\n @Prop({ reflect: true })\n clickable: boolean;\n\n // #endregion\n // #region Component Lifecycle Events\n\n componentDidLoad() {\n if (typeof MutationObserver !== 'undefined') {\n const observer = new MutationObserver(() => (this.renderTrigger += 1));\n observer.observe(this.hostElement, { childList: true, subtree: true, attributes: true });\n this.mutationObserver = observer;\n }\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (this.clickable) {\n this.itemElement?.focus();\n } else {\n event.preventDefault();\n }\n }\n\n // #endregion\n // #region Local Methods\n\n get actionClasses() {\n const classes = ['action'];\n if (!this.hasBulletSlotContent) {\n classes.push(`action-no-bullet`);\n }\n\n return classes.join(' ');\n }\n\n get bulletClasses() {\n const classes = ['bullet'];\n if (!this.hasFooterSlotContent) {\n classes.push(`bullet-no-footer`);\n }\n\n return classes.join(' ');\n }\n\n get footerClasses() {\n const classes = ['footer'];\n if (!this.hasActionSlotContent && !this.hasBulletSlotContent) {\n classes.push(`footer-no-action-nor-bullet`);\n } else if (!this.hasActionSlotContent) {\n classes.push(`footer-no-action`);\n } else if (!this.hasBulletSlotContent) {\n classes.push(`footer-no-bullet`);\n }\n\n return classes.join(' ');\n }\n\n get hasActionSlotContent() {\n return hasSlotContent(this.hostElement, 'action');\n }\n\n get hasBodySlotContent() {\n return hasSlotContent(this.hostElement, 'body');\n }\n\n get hasBulletSlotContent() {\n return hasSlotContent(this.hostElement, 'bullet');\n }\n\n get hasFooterSlotContent() {\n return hasSlotContent(this.hostElement, 'footer');\n }\n\n get hasHeaderSlotContent() {\n return hasSlotContent(this.hostElement, 'header');\n }\n\n get itemClasses() {\n const classes = ['item'];\n if (!this.hasActionSlotContent && !this.hasBulletSlotContent) {\n classes.push(`item-no-action-nor-bullet`);\n } else if (!this.hasActionSlotContent) {\n classes.push(`item-no-action`);\n } else if (!this.hasBulletSlotContent) {\n classes.push(`item-no-bullet`);\n }\n if (!this.hasFooterSlotContent) {\n classes.push(`item-no-footer`);\n }\n\n return classes.join(' ');\n }\n\n get mainClasses() {\n const classes = ['main'];\n if (!this.hasActionSlotContent && !this.hasBulletSlotContent) {\n classes.push(`main-no-action-nor-bullet`);\n } else if (!this.hasBulletSlotContent) {\n classes.push(`main-no-bullet`);\n }\n\n return classes.join(' ');\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n const { clickable } = this;\n return (\n <div\n test-id=\"itemContainer\"\n class={this.itemClasses}\n ref={el => (this.itemElement = el)}\n role={clickable ? 'button' : undefined}\n tabIndex={clickable ? 0 : undefined}\n >\n {this.hasBulletSlotContent && (\n <div class={this.bulletClasses}>\n <slot name=\"bullet\" />\n </div>\n )}\n <div class={this.mainClasses}>\n {this.hasHeaderSlotContent && (\n <div class=\"header\">\n <slot name=\"header\" />\n </div>\n )}\n {this.hasBodySlotContent && (\n <div class=\"body\">\n <slot name=\"body\" />\n </div>\n )}\n </div>\n {this.hasActionSlotContent && (\n <div class={this.actionClasses}>\n <slot name=\"action\" />\n </div>\n )}\n {this.hasFooterSlotContent && (\n <div class={this.footerClasses}>\n <slot name=\"footer\" />\n </div>\n )}\n </div>\n );\n }\n\n // #endregion\n}\n"],"version":3}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"q2-link.entry.js","mappings":";;AAAA,MAAM,SAAS,GAAG,2kGAA2kG,CAAC;AAC9lG,qBAAe,SAAS;;MCCX,MAAM;;;;wBAWK,KAAK;oBAIV,GAAG;;;;;uBAoBA,QAAQ;;;;;;;;;IAqB1B,MAAM,SAAS;QACX,MAAM,MAAM,GAAG,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,aAAa,CAAC,wBAAwB,CAAC,CAAC;QAClF,MAA4B,aAA5B,MAAM,uBAAN,MAAM,CAAwB,KAAK,EAAE,CAAC;KAC1C;;;IAKD,IAAI,OAAO;QACP,MAAM,IAAI,GAAG,CAAC,gBAAgB,CAAC,CAAC;QAChC,IAAI,IAAI,CAAC,OAAO;YAAE,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAC1C,IAAI,CAAC,CAAC,IAAI,CAAC,QAAQ;YAAE,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAC3C,OAAO,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;KACzB;IAED,WAAW,CAAC,KAAiB;QACzB,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;YACf,MAAM,EAAE,IAAI,CAAC,MAAM;YACnB,cAAc,EAAE,IAAI,CAAC,cAAc;YACnC,IAAI,EAAE,IAAI,CAAC,IAAI;SAClB,CAAC,CAAC;KACN;;;IAKD,MAAM;QACF,OAAO,IAAI,CAAC,OAAO,KAAK,YAAY,IAChC,WACI,KAAK,EAAE,IAAI,CAAC,OAAO,gBACP,IAAI,CAAC,KAAK,IAEtB,SACI,KAAK,EAAC,MAAM,EACZ,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EACjC,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,SAAS,GAAG,IAAI,CAAC,IAAI,EAC7C,MAAM,EAAE,IAAI,CAAC,MAAM,IAAI,OAAO,EAC9B,cAAc,EAAE,IAAI,CAAC,cAAc,IAAI,SAAS,EAChD,KAAK,EAAE,IAAI,CAAC,QAAQ,IAAI,SAAS,aACzB,YAAY,IAEpB,YAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,EACvC,eAAS,IAAI,EAAC,eAAe,GAAW,CACxC,CACF,KAEN,SACI,KAAK,EAAE,IAAI,CAAC,OAAO,EACnB,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EACjC,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,SAAS,GAAG,IAAI,CAAC,IAAI,EAC7C,MAAM,EAAE,IAAI,CAAC,MAAM,IAAI,OAAO,EAC9B,cAAc,EAAE,IAAI,CAAC,cAAc,IAAI,SAAS,EAChD,KAAK,EAAE,IAAI,CAAC,QAAQ,IAAI,SAAS,aACzB,YAAY,IAEnB,IAAI,CAAC,KAAK,CACX,CACP,CAAC;KACL;;;;;;;","names":[],"sources":["src/components/q2-link/q2-link.scss?tag=q2-link&encapsulation=shadow","src/components/q2-link/q2-link.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n display: inline-block;\n}\n\n:host {\n &:active {\n box-shadow: none;\n }\n}\n\n.link-container {\n --comp-link-font-bold-stroke-width: 0.5px;\n background: transparent;\n border: none;\n font-size: var-list(--tct-link-font-size, inherit);\n font-weight: var-list(--tct-link-font-weight, inherit);\n\n &.standalone {\n --comp-icon-stroke: var(--tct-link-icon-stroke-width, 1.5);\n .link {\n color: var-list(--tct-link-color-standalone, --t-primary);\n height: var(--tct-link-height, 24px);\n display: flex;\n align-items: center;\n --tct-icon-size: 16px;\n text-decoration: none;\n q2-icon {\n margin-left: var(--tct-link-label-icon-gap, 6px);\n }\n }\n &:hover {\n text-decoration: underline;\n -webkit-text-stroke-width: var-list(--tct-link-font-bold-stroke-width, --comp-link-font-bold-stroke-width);\n text-stroke-width: var-list(--tct-link-font-bold-stroke-width, --comp-link-font-bold-stroke-width);\n --tct-icon-stroke-width: calc(var(--comp-icon-stroke) + 0.5);\n }\n &:active:hover {\n text-decoration: underline;\n -webkit-text-stroke-width: var-list(--tct-link-font-bold-stroke-width, --comp-link-font-bold-stroke-width);\n text-stroke-width: var-list(--tct-link-font-bold-stroke-width, --comp-link-font-bold-stroke-width);\n --tct-icon-stroke-width: calc(var(--comp-icon-stroke) + 0.5);\n .link {\n color: var-list(--tct-link-color-standalone-active, --t-primary-d2);\n box-shadow: none;\n }\n }\n &.disabled {\n .link {\n cursor: not-allowed;\n color: var-list(--tct-link-color-standalone-disabled, --t-primary);\n opacity: 0.5;\n text-decoration: none;\n }\n &:hover {\n text-decoration: none;\n }\n }\n }\n\n &.inline {\n margin: 0 var(--tct-link-side-margin, 6px);\n text-decoration: underline;\n color: var-list(--tct-link-color-inline, --t-primary);\n &:hover {\n -webkit-text-stroke-width: var-list(--tct-link-font-bold-stroke-width, --comp-link-font-bold-stroke-width);\n text-stroke-width: var-list(--tct-link-font-bold-stroke-width, --comp-link-font-bold-stroke-width);\n }\n &:active:hover {\n -webkit-text-stroke-width: var-list(--tct-link-font-bold-stroke-width, --comp-link-font-bold-stroke-width);\n text-stroke-width: var-list(--tct-link-font-bold-stroke-width, --comp-link-font-bold-stroke-width);\n color: var-list(--tct-link-color-inline-active, --t-primary-d2);\n box-shadow: none;\n }\n &.disabled {\n cursor: not-allowed;\n opacity: 0.5;\n }\n &:focus-visible & {\n box-shadow: var(--const-double-focus-ring);\n }\n }\n}\n\n","import { Component, Prop, h, ComponentInterface, Element, Event, EventEmitter, Method } from '@stencil/core';\n@Component({ tag: 'q2-link', shadow: true, styleUrl: 'q2-link.scss' })\nexport class Q2Link implements ComponentInterface {\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n /** The disabled. */\n @Prop({ reflect: true })\n disabled: boolean = false;\n\n /** The link when clicked. */\n @Prop({ reflect: true })\n href: string = '#';\n\n /** The label to display. */\n @Prop({ reflect: true })\n label: string;\n\n /** The [referrerpolicy](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#referrerpolicy) */\n @Prop({ reflect: true })\n referrerpolicy: ReferrerPolicy;\n\n /** The target. */\n @Prop({ reflect: true })\n target: string; // _self | _blank\n\n /** The title attribute on a tag in shadowRoot. */\n @Prop({ reflect: true })\n tctTitle: string;\n\n /** The value link to display. */\n @Prop({ reflect: true })\n variant: string = 'inline';\n\n // #endregion\n // #region Events\n\n /**\n * Emitted when the link is clicked.\n * @legacyEvent\n */\n @Event()\n tctClick: EventEmitter<{ target: string; referrerpolicy: string; href: string }>;\n\n // #endregion\n // #region Public Methods API\n\n /**\n * A method for click.\n *\n * @testOnly\n */\n @Method()\n async clickLink() {\n const anchor = this.hostElement.shadowRoot.querySelector(`[test-id=\"linkAnchor\"]`);\n (anchor as HTMLAnchorElement)?.click();\n }\n\n // #endregion\n // #region Local Methods\n\n get classes() {\n const list = ['link-container'];\n if (this.variant) list.push(this.variant);\n if (!!this.disabled) list.push('disabled');\n return list.join(' ');\n }\n\n handleClick(event: MouseEvent) {\n event.stopPropagation();\n if (this.disabled) return;\n this.tctClick.emit({\n target: this.target,\n referrerpolicy: this.referrerpolicy,\n href: this.href,\n });\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n return this.variant === 'standalone' ? (\n <div\n class={this.classes}\n aria-label={this.label}\n >\n <a\n class=\"link\"\n onClick={e => this.handleClick(e)}\n href={!!this.disabled ? undefined : this.href}\n target={this.target || '_self'}\n referrerPolicy={this.referrerpolicy || undefined}\n title={this.tctTitle || undefined}\n test-id=\"linkAnchor\"\n >\n <span class=\"label\">{this.label}</span>\n <q2-icon type=\"chevron-right\"></q2-icon>\n </a>\n </div>\n ) : (\n <a\n class={this.classes}\n onClick={e => this.handleClick(e)}\n href={!!this.disabled ? undefined : this.href}\n target={this.target || '_self'}\n referrerPolicy={this.referrerpolicy || undefined}\n title={this.tctTitle || undefined}\n test-id=\"linkAnchor\"\n >\n {this.label}\n </a>\n );\n }\n\n // #endregion\n}\n"],"version":3}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"q2-list.entry.js","mappings":"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","names":[],"sources":["src/components/q2-list/q2-list.scss?tag=q2-list&encapsulation=shadow","src/components/q2-list/q2-list.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n@import '../q2-btn/q2-btn-mixins';\n\n:host([bordered]:not([bordered='false'])) {\n ::slotted(q2-item:not(:last-child)),\n .header {\n border-style: var-list(--tct-list-item-border-style, solid);\n border-width: var-list(--tct-list-item-border-width, unquote('0 0 1px 0'));\n border-color: var-list(--tct-list-item-border-color, --t-gray-12, #d9d9d9);\n }\n}\n\n::slotted(q2-item) {\n --comp-item-padding: #{var-list(\n --tct-list-item-padding,\n unquote('#{var-list(--app-scale-2x, 10px) var-list(--app-scale-4x, 20px)}')\n )};\n --tct-item-padding: var(--comp-item-padding);\n}\n\n.header {\n --comp-default-header-padding: 0 var(--app-scale-4x, 20px);\n display: flex;\n gap: var(--app-scale-3x, 12px);\n padding: var-list(--tct-list-header-padding, --comp-default-header-padding);\n min-height: var-list(var-prefixer(list-header-min-height), 44px);\n &-spacebetween {\n justify-content: space-between;\n }\n &-start {\n justify-content: flex-start;\n }\n &-end {\n justify-content: flex-end;\n }\n .label {\n width: 100%;\n height: var(--tct-list-label-height, 44px);\n line-height: var(--tct-list-label-line-height, 44px);\n font-size: var-list(--tct-list-label-font-size, --app-font-size, 14px);\n font-weight: var(--tct-list-label-font-weight, 600);\n color: var-list(--tct-list-label-font-color, --t-text, #4d4d4d);\n }\n}\n","import { Component, Element, h, State, Prop } from '@stencil/core';\nimport { hasSlotContent } from 'src/utils';\n\n@Component({\n tag: 'q2-list',\n styleUrl: 'q2-list.scss',\n shadow: true,\n})\nexport class Q2List {\n // #region Own Properties\n\n listElement: HTMLDivElement;\n mutationObserver: MutationObserver;\n scheduledAfterRender: (() => void)[] = [];\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n renderTrigger: number = 0;\n\n // #endregion\n // #region Public Property API\n\n /** Adds a border between each items */\n @Prop({ mutable: true, reflect: true })\n bordered: boolean;\n\n /** label text on header area */\n @Prop({ reflect: true })\n label: string;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n this.mutationObserver?.disconnect();\n this.mutationObserver = null;\n }\n\n componentDidLoad() {\n if (typeof MutationObserver === 'undefined') return;\n const observer = new MutationObserver(this.onMutationObserved);\n observer.observe(this.hostElement, { childList: true, subtree: true });\n this.mutationObserver = observer;\n this.onMutationObserved();\n }\n\n componentDidRender() {\n this.scheduledAfterRender.forEach(fn => fn());\n this.scheduledAfterRender = [];\n }\n\n // #endregion\n // #region Local Methods\n\n get hasFilterSlot() {\n return !!this.hostElement.querySelector('q2-pill') || hasSlotContent(this.hostElement, 'pill');\n }\n\n get hasLabelContent() {\n return !!this.label;\n }\n\n get headerClasses() {\n const classes = ['header'];\n if (this.hasLabelContent && this.hasFilterSlot) {\n classes.push('header-spacebetween');\n } else if (this.hasLabelContent && !this.hasFilterSlot) {\n classes.push('header-start');\n } else if (!this.hasLabelContent && this.hasFilterSlot) {\n classes.push('header-end');\n }\n return classes.join(' ');\n }\n\n get listClasses() {\n const classes = ['list'];\n return classes.join(' ');\n }\n\n onMutationObserved = () => {\n this.renderTrigger += 1;\n this.scheduledAfterRender.push(() => {\n Array.from(this.hostElement.children).forEach(child => {\n if (child.tagName === 'Q2-ITEM') child.role = 'listitem';\n });\n });\n };\n\n // #endregion\n // #region Render Methods\n\n render() {\n return (\n <div\n class={this.listClasses}\n ref={el => (this.listElement = el)}\n >\n {(this.hasFilterSlot || this.hasLabelContent) && (\n <div class={this.headerClasses}>\n <div class=\"label\">{this.label}</div>\n {this.hasFilterSlot && <slot name=\"filter\" />}\n </div>\n )}\n <div role=\"list\">\n <slot />\n </div>\n </div>\n );\n }\n\n // #endregion\n}\n"],"version":3}
|