@six-group/ui-library 0.0.0-insider.cd0cd0d → 0.0.0-insider.d82aaa2
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/README.md +9 -0
- package/dist/cjs/{event-listeners-b835dfae.js → event-listeners-fdfe838c.js} +1 -1
- package/dist/cjs/event-listeners-fdfe838c.js.map +1 -0
- package/dist/cjs/{execution-control-45c84c46.js → execution-control-b4707294.js} +1 -1
- package/dist/cjs/execution-control-b4707294.js.map +1 -0
- package/dist/cjs/{focus-visible-e0d93a95.js → focus-visible-ae2470dd.js} +1 -1
- package/dist/cjs/focus-visible-ae2470dd.js.map +1 -0
- package/dist/cjs/{form-8cbd4e0e.js → form-2df8c5bb.js} +1 -1
- package/dist/{esm/form-0b9c11cd.js.map → cjs/form-2df8c5bb.js.map} +1 -1
- package/dist/cjs/{form-control-8df00a52.js → form-control-d369af14.js} +2 -2
- package/dist/cjs/form-control-d369af14.js.map +1 -0
- package/dist/cjs/{index-2f6daa5b.js → index-900437fc.js} +396 -54
- package/dist/cjs/index-900437fc.js.map +1 -0
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/loader.cjs.js +3 -12
- package/dist/cjs/loader.cjs.js.map +1 -1
- package/dist/cjs/{modal-21350fb5.js → modal-d5f074c7.js} +1 -1
- package/dist/cjs/modal-d5f074c7.js.map +1 -0
- package/dist/cjs/{popover-8885d50f.js → popover-2df7e154.js} +1 -1
- package/dist/{esm/popover-2e72e7d8.js.map → cjs/popover-2df7e154.js.map} +1 -1
- package/dist/cjs/{popup-44836aaf.js → popup-f1d9910f.js} +1 -1
- package/dist/cjs/popup-f1d9910f.js.map +1 -0
- package/dist/cjs/{scroll-76e6f5d7.js → scroll-03678de1.js} +1 -1
- package/dist/cjs/scroll-03678de1.js.map +1 -0
- package/dist/cjs/set-attributes_2.cjs.entry.js +1 -1
- package/dist/cjs/set-attributes_2.cjs.entry.js.map +1 -1
- package/dist/cjs/six-alert.cjs.entry.js +1 -1
- package/dist/cjs/six-alert.cjs.entry.js.map +1 -1
- package/dist/cjs/six-avatar.cjs.entry.js +1 -1
- package/dist/cjs/six-avatar.cjs.entry.js.map +1 -1
- package/dist/cjs/six-badge.cjs.entry.js +1 -1
- package/dist/cjs/six-badge.cjs.entry.js.map +1 -1
- package/dist/cjs/six-button.cjs.entry.js +3 -3
- package/dist/cjs/six-button.cjs.entry.js.map +1 -1
- package/dist/cjs/six-card.cjs.entry.js +1 -1
- package/dist/cjs/six-card.cjs.entry.js.map +1 -1
- package/dist/cjs/six-checkbox.cjs.entry.js +6 -14
- package/dist/cjs/six-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/six-datepicker.cjs.entry.js +8 -6
- package/dist/cjs/six-datepicker.cjs.entry.js.map +1 -1
- package/dist/cjs/six-details.cjs.entry.js +2 -2
- package/dist/cjs/six-details.cjs.entry.js.map +1 -1
- package/dist/cjs/six-dialog.cjs.entry.js +4 -4
- package/dist/cjs/six-dialog.cjs.entry.js.map +1 -1
- package/dist/cjs/six-drawer.cjs.entry.js +4 -4
- package/dist/cjs/six-drawer.cjs.entry.js.map +1 -1
- package/dist/cjs/six-dropdown_2.cjs.entry.js +5 -5
- package/dist/cjs/six-dropdown_2.cjs.entry.js.map +1 -1
- package/dist/cjs/six-error-page.cjs.entry.js +1 -1
- package/dist/cjs/six-error-page.cjs.entry.js.map +1 -1
- package/dist/cjs/six-file-list-item.cjs.entry.js +1 -1
- package/dist/cjs/six-file-list-item.cjs.entry.js.map +1 -1
- package/dist/cjs/six-file-list.cjs.entry.js +1 -1
- package/dist/cjs/six-file-list.cjs.entry.js.map +1 -1
- package/dist/cjs/six-file-upload.cjs.entry.js +1 -1
- package/dist/cjs/six-file-upload.cjs.entry.js.map +1 -1
- package/dist/cjs/six-footer.cjs.entry.js +1 -1
- package/dist/cjs/six-footer.cjs.entry.js.map +1 -1
- package/dist/cjs/six-group-label.cjs.entry.js +3 -3
- package/dist/cjs/six-group-label.cjs.entry.js.map +1 -1
- package/dist/cjs/six-header.cjs.entry.js +3 -3
- package/dist/cjs/six-header.cjs.entry.js.map +1 -1
- package/dist/cjs/six-icon-button.cjs.entry.js +2 -2
- package/dist/cjs/six-icon-button.cjs.entry.js.map +1 -1
- package/dist/cjs/six-icon.cjs.entry.js +1 -1
- package/dist/cjs/six-icon.cjs.entry.js.map +1 -1
- package/dist/cjs/six-input.cjs.entry.js +6 -6
- package/dist/cjs/six-input.cjs.entry.js.map +1 -1
- package/dist/cjs/six-item-picker.cjs.entry.js +6 -6
- package/dist/cjs/six-item-picker.cjs.entry.js.map +1 -1
- package/dist/cjs/six-language-switcher.cjs.entry.js +1 -1
- package/dist/cjs/six-language-switcher.cjs.entry.js.map +1 -1
- package/dist/cjs/six-layout-grid.cjs.entry.js +1 -1
- package/dist/cjs/six-layout-grid.cjs.entry.js.map +1 -1
- package/dist/cjs/six-main-container.cjs.entry.js +1 -1
- package/dist/cjs/six-main-container.cjs.entry.js.map +1 -1
- package/dist/cjs/six-menu-divider.cjs.entry.js +1 -1
- package/dist/cjs/six-menu-divider.cjs.entry.js.map +1 -1
- package/dist/cjs/six-menu-item.cjs.entry.js +2 -2
- package/dist/cjs/six-menu-item.cjs.entry.js.map +1 -1
- package/dist/cjs/six-menu-label.cjs.entry.js +1 -1
- package/dist/cjs/six-menu-label.cjs.entry.js.map +1 -1
- package/dist/cjs/six-picto.cjs.entry.js +1 -1
- package/dist/cjs/six-picto.cjs.entry.js.map +1 -1
- package/dist/cjs/six-progress-bar.cjs.entry.js +1 -1
- package/dist/cjs/six-progress-bar.cjs.entry.js.map +1 -1
- package/dist/cjs/six-progress-ring.cjs.entry.js +1 -1
- package/dist/cjs/six-progress-ring.cjs.entry.js.map +1 -1
- package/dist/cjs/six-radio.cjs.entry.js +11 -19
- package/dist/cjs/six-radio.cjs.entry.js.map +1 -1
- package/dist/cjs/six-range.cjs.entry.js +4 -4
- package/dist/cjs/six-range.cjs.entry.js.map +1 -1
- package/dist/cjs/six-root.cjs.entry.js +1 -1
- package/dist/cjs/six-root.cjs.entry.js.map +1 -1
- package/dist/cjs/six-search-field.cjs.entry.js +3 -3
- package/dist/cjs/six-search-field.cjs.entry.js.map +1 -1
- package/dist/cjs/six-select.cjs.entry.js +12 -11
- package/dist/cjs/six-select.cjs.entry.js.map +1 -1
- package/dist/cjs/six-sidebar-item-group.cjs.entry.js +2 -2
- package/dist/cjs/six-sidebar-item-group.cjs.entry.js.map +1 -1
- package/dist/cjs/six-sidebar-item.cjs.entry.js +1 -1
- package/dist/cjs/six-sidebar-item.cjs.entry.js.map +1 -1
- package/dist/cjs/six-sidebar.cjs.entry.js +2 -2
- package/dist/cjs/six-sidebar.cjs.entry.js.map +1 -1
- package/dist/cjs/six-spinner.cjs.entry.js +1 -1
- package/dist/cjs/six-spinner.cjs.entry.js.map +1 -1
- package/dist/cjs/six-switch.cjs.entry.js +6 -4
- package/dist/cjs/six-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/six-tab-group.cjs.entry.js +3 -3
- package/dist/cjs/six-tab-group.cjs.entry.js.map +1 -1
- package/dist/cjs/six-tab-panel.cjs.entry.js +1 -1
- package/dist/cjs/six-tab-panel.cjs.entry.js.map +1 -1
- package/dist/cjs/six-tab.cjs.entry.js +1 -1
- package/dist/cjs/six-tab.cjs.entry.js.map +1 -1
- package/dist/cjs/six-tag.cjs.entry.js +2 -2
- package/dist/cjs/six-tag.cjs.entry.js.map +1 -1
- package/dist/cjs/six-textarea.cjs.entry.js +4 -4
- package/dist/cjs/six-textarea.cjs.entry.js.map +1 -1
- package/dist/cjs/six-tile.cjs.entry.js +2 -2
- package/dist/cjs/six-tile.cjs.entry.js.map +1 -1
- package/dist/cjs/six-timepicker.cjs.entry.js +6 -6
- package/dist/cjs/six-timepicker.cjs.entry.js.map +1 -1
- package/dist/cjs/six-tooltip.cjs.entry.js +2 -2
- package/dist/cjs/six-tooltip.cjs.entry.js.map +1 -1
- package/dist/cjs/{slot-bccbdb59.js → slot-6e6a400f.js} +1 -1
- package/dist/cjs/slot-6e6a400f.js.map +1 -0
- package/dist/cjs/{types-64878648.js → types-47199040.js} +1 -1
- package/dist/cjs/types-47199040.js.map +1 -0
- package/dist/cjs/ui-library.cjs.js +3 -6
- package/dist/cjs/ui-library.cjs.js.map +1 -1
- package/dist/collection/collection-manifest.json +54 -54
- package/dist/collection/components/six-alert/six-alert.js +15 -8
- package/dist/collection/components/six-alert/six-alert.js.map +1 -1
- package/dist/collection/components/six-alert/test/six-alert.spec.js +25 -0
- package/dist/collection/components/six-alert/test/six-alert.spec.js.map +1 -0
- package/dist/collection/components/six-avatar/six-avatar.js +1 -1
- package/dist/collection/components/six-avatar/test/six-avatar.spec.js +26 -0
- package/dist/collection/components/six-avatar/test/six-avatar.spec.js.map +1 -0
- package/dist/collection/components/six-badge/six-badge.js +1 -1
- package/dist/collection/components/six-badge/test/six-badge.spec.js +20 -0
- package/dist/collection/components/six-badge/test/six-badge.spec.js.map +1 -0
- package/dist/collection/components/six-button/six-button.js +13 -8
- package/dist/collection/components/six-button/six-button.js.map +1 -1
- package/dist/collection/components/six-button/test/six-button.spec.js +69 -0
- package/dist/collection/components/six-button/test/six-button.spec.js.map +1 -0
- package/dist/collection/components/six-card/six-card.js +1 -1
- package/dist/collection/components/six-card/test/six-card.spec.js +18 -0
- package/dist/collection/components/six-card/test/six-card.spec.js.map +1 -0
- package/dist/collection/components/six-checkbox/six-checkbox.js +18 -36
- package/dist/collection/components/six-checkbox/six-checkbox.js.map +1 -1
- package/dist/collection/components/six-checkbox/test/six-checkbox.spec.js +79 -0
- package/dist/collection/components/six-checkbox/test/six-checkbox.spec.js.map +1 -0
- package/dist/collection/components/six-datepicker/components/day-selection.js +1 -1
- package/dist/collection/components/six-datepicker/components/month-selection.js +2 -2
- package/dist/collection/components/six-datepicker/components/year-selection.js +2 -2
- package/dist/collection/components/six-datepicker/six-datepicker.js +37 -23
- package/dist/collection/components/six-datepicker/six-datepicker.js.map +1 -1
- package/dist/collection/components/six-datepicker/test/six-datepicker.spec.js +26 -0
- package/dist/collection/components/six-datepicker/test/six-datepicker.spec.js.map +1 -0
- package/dist/collection/components/six-details/six-details.js +14 -8
- package/dist/collection/components/six-details/six-details.js.map +1 -1
- package/dist/collection/components/six-details/test/six-details.spec.js +36 -0
- package/dist/collection/components/six-details/test/six-details.spec.js.map +1 -0
- package/dist/collection/components/six-dialog/six-dialog.js +21 -13
- package/dist/collection/components/six-dialog/six-dialog.js.map +1 -1
- package/dist/collection/components/six-dialog/test/six-dialog.spec.js +34 -0
- package/dist/collection/components/six-dialog/test/six-dialog.spec.js.map +1 -0
- package/dist/collection/components/six-drawer/six-drawer.js +21 -13
- package/dist/collection/components/six-drawer/six-drawer.js.map +1 -1
- package/dist/collection/components/six-drawer/test/six-drawer.spec.js +34 -0
- package/dist/collection/components/six-drawer/test/six-drawer.spec.js.map +1 -0
- package/dist/collection/components/six-dropdown/six-dropdown.js +30 -18
- package/dist/collection/components/six-dropdown/six-dropdown.js.map +1 -1
- package/dist/collection/components/six-dropdown/test/six-dropdown.spec.js +122 -0
- package/dist/collection/components/six-dropdown/test/six-dropdown.spec.js.map +1 -0
- package/dist/collection/components/six-error-page/six-error-page.js +1 -1
- package/dist/collection/components/six-error-page/test/six-error-page.spec.js +240 -0
- package/dist/collection/components/six-error-page/test/six-error-page.spec.js.map +1 -0
- package/dist/collection/components/six-file-list/six-file-list.js +1 -1
- package/dist/collection/components/six-file-list/test/six-file-list.spec.js +67 -0
- package/dist/collection/components/six-file-list/test/six-file-list.spec.js.map +1 -0
- package/dist/collection/components/six-file-list-item/six-file-list-item.js +5 -3
- package/dist/collection/components/six-file-list-item/six-file-list-item.js.map +1 -1
- package/dist/collection/components/six-file-list-item/test/six-file-list-item.spec.js +169 -0
- package/dist/collection/components/six-file-list-item/test/six-file-list-item.spec.js.map +1 -0
- package/dist/collection/components/six-file-upload/six-file-upload.js +5 -3
- package/dist/collection/components/six-file-upload/six-file-upload.js.map +1 -1
- package/dist/collection/components/six-file-upload/test/six-file-upload.spec.js +103 -0
- package/dist/collection/components/six-file-upload/test/six-file-upload.spec.js.map +1 -0
- package/dist/collection/components/six-footer/six-footer.js +1 -1
- package/dist/collection/components/six-footer/test/six-footer.spec.js +21 -0
- package/dist/collection/components/six-footer/test/six-footer.spec.js.map +1 -0
- package/dist/collection/components/six-group-label/six-group-label.js +3 -3
- package/dist/collection/components/six-group-label/test/six-group-label.spec.js +43 -0
- package/dist/collection/components/six-group-label/test/six-group-label.spec.js.map +1 -0
- package/dist/collection/components/six-header/six-header.js +19 -11
- package/dist/collection/components/six-header/six-header.js.map +1 -1
- package/dist/collection/components/six-header/test/six-header.spec.js +133 -0
- package/dist/collection/components/six-header/test/six-header.spec.js.map +1 -0
- package/dist/collection/components/six-icon/six-icon.js +1 -1
- package/dist/collection/components/six-icon/test/six-icon.spec.js +20 -0
- package/dist/collection/components/six-icon/test/six-icon.spec.js.map +1 -0
- package/dist/collection/components/six-icon-button/six-icon-button.js +2 -2
- package/dist/collection/components/six-icon-button/test/six-icon-button.spec.js +23 -0
- package/dist/collection/components/six-icon-button/test/six-icon-button.spec.js.map +1 -0
- package/dist/collection/components/six-input/six-input.css +1 -1
- package/dist/collection/components/six-input/six-input.js +27 -16
- package/dist/collection/components/six-input/six-input.js.map +1 -1
- package/dist/collection/components/six-input/test/six-input.spec.js +37 -0
- package/dist/collection/components/six-input/test/six-input.spec.js.map +1 -0
- package/dist/collection/components/six-item-picker/six-item-picker.js +14 -10
- package/dist/collection/components/six-item-picker/six-item-picker.js.map +1 -1
- package/dist/collection/components/six-item-picker/test/six-item-picker.spec.js +90 -0
- package/dist/collection/components/six-item-picker/test/six-item-picker.spec.js.map +1 -0
- package/dist/collection/components/six-language-switcher/six-language-switcher.js +5 -3
- package/dist/collection/components/six-language-switcher/six-language-switcher.js.map +1 -1
- package/dist/collection/components/six-language-switcher/test/six-language-switcher.spec.js +196 -0
- package/dist/collection/components/six-language-switcher/test/six-language-switcher.spec.js.map +1 -0
- package/dist/collection/components/six-layout-grid/six-layout-grid.js +1 -1
- package/dist/collection/components/six-layout-grid/test/six-layout-grid.spec.js +18 -0
- package/dist/collection/components/six-layout-grid/test/six-layout-grid.spec.js.map +1 -0
- package/dist/collection/components/six-main-container/six-main-container.js +1 -1
- package/dist/collection/components/six-main-container/test/six-main-container.spec.js +22 -0
- package/dist/collection/components/six-main-container/test/six-main-container.spec.js.map +1 -0
- package/dist/collection/components/six-menu/six-menu.js +12 -8
- package/dist/collection/components/six-menu/six-menu.js.map +1 -1
- package/dist/collection/components/six-menu/test/six-menu.spec.js +93 -0
- package/dist/collection/components/six-menu/test/six-menu.spec.js.map +1 -0
- package/dist/collection/components/six-menu-divider/six-menu-divider.js +1 -1
- package/dist/collection/components/six-menu-divider/test/six-menu-divider.spec.js +18 -0
- package/dist/collection/components/six-menu-divider/test/six-menu-divider.spec.js.map +1 -0
- package/dist/collection/components/six-menu-item/six-menu-item.js +10 -6
- package/dist/collection/components/six-menu-item/six-menu-item.js.map +1 -1
- package/dist/collection/components/six-menu-item/test/six-menu-item.spec.js +33 -0
- package/dist/collection/components/six-menu-item/test/six-menu-item.spec.js.map +1 -0
- package/dist/collection/components/six-menu-label/six-menu-label.js +1 -1
- package/dist/collection/components/six-menu-label/test/six-menu-label.spec.js +20 -0
- package/dist/collection/components/six-menu-label/test/six-menu-label.spec.js.map +1 -0
- package/dist/collection/components/six-picto/six-picto.js +1 -1
- package/dist/collection/components/six-picto/test/six-picto.spec.js +33 -0
- package/dist/collection/components/six-picto/test/six-picto.spec.js.map +1 -0
- package/dist/collection/components/six-progress-bar/six-progress-bar.js +1 -1
- package/dist/collection/components/six-progress-bar/test/six-progress-bar.spec.js +24 -0
- package/dist/collection/components/six-progress-bar/test/six-progress-bar.spec.js.map +1 -0
- package/dist/collection/components/six-progress-ring/six-progress-ring.js +1 -1
- package/dist/collection/components/six-progress-ring/test/six-progress-ring.spec.js +26 -0
- package/dist/collection/components/six-progress-ring/test/six-progress-ring.spec.js.map +1 -0
- package/dist/collection/components/six-radio/six-radio.js +23 -41
- package/dist/collection/components/six-radio/six-radio.js.map +1 -1
- package/dist/collection/components/six-radio/test/six-radio.spec.js +63 -0
- package/dist/collection/components/six-radio/test/six-radio.spec.js.map +1 -0
- package/dist/collection/components/six-range/six-range.js +16 -10
- package/dist/collection/components/six-range/six-range.js.map +1 -1
- package/dist/collection/components/six-range/test/six-range.spec.js +32 -0
- package/dist/collection/components/six-range/test/six-range.spec.js.map +1 -0
- package/dist/collection/components/six-root/six-root.js +5 -3
- package/dist/collection/components/six-root/six-root.js.map +1 -1
- package/dist/collection/components/six-root/test/six-root.spec.js +43 -0
- package/dist/collection/components/six-root/test/six-root.spec.js.map +1 -0
- package/dist/collection/components/six-search-field/six-search-field.js +5 -4
- package/dist/collection/components/six-search-field/six-search-field.js.map +1 -1
- package/dist/collection/components/six-search-field/test/six-search-field.spec.js +22 -0
- package/dist/collection/components/six-search-field/test/six-search-field.spec.js.map +1 -0
- package/dist/collection/components/six-select/six-select.css +6 -9
- package/dist/collection/components/six-select/six-select.js +24 -17
- package/dist/collection/components/six-select/six-select.js.map +1 -1
- package/dist/collection/components/six-select/test/six-select.spec.js +82 -0
- package/dist/collection/components/six-select/test/six-select.spec.js.map +1 -0
- package/dist/collection/components/six-select/test/util.spec.js +81 -0
- package/dist/collection/components/six-select/test/util.spec.js.map +1 -0
- package/dist/collection/components/six-sidebar/six-sidebar.js +26 -14
- package/dist/collection/components/six-sidebar/six-sidebar.js.map +1 -1
- package/dist/collection/components/six-sidebar/test/six-sidebar.spec.js +22 -0
- package/dist/collection/components/six-sidebar/test/six-sidebar.spec.js.map +1 -0
- package/dist/collection/components/six-sidebar-item/six-sidebar-item.js +1 -1
- package/dist/collection/components/six-sidebar-item/test/six-sidebar-item.spec.js +50 -0
- package/dist/collection/components/six-sidebar-item/test/six-sidebar-item.spec.js.map +1 -0
- package/dist/collection/components/six-sidebar-item-group/six-sidebar-item-group.js +2 -2
- package/dist/collection/components/six-sidebar-item-group/test/six-sidebar-item-group.spec.js +53 -0
- package/dist/collection/components/six-sidebar-item-group/test/six-sidebar-item-group.spec.js.map +1 -0
- package/dist/collection/components/six-spinner/six-spinner.js +1 -1
- package/dist/collection/components/six-spinner/test/six-spinner.spec.js +37 -0
- package/dist/collection/components/six-spinner/test/six-spinner.spec.js.map +1 -0
- package/dist/collection/components/six-stage-indicator/six-stage-indicator.js +3 -2
- package/dist/collection/components/six-stage-indicator/six-stage-indicator.js.map +1 -1
- package/dist/collection/components/six-stage-indicator/test/six-stage-indicator.spec.js +117 -0
- package/dist/collection/components/six-stage-indicator/test/six-stage-indicator.spec.js.map +1 -0
- package/dist/collection/components/six-switch/six-switch.js +14 -8
- package/dist/collection/components/six-switch/six-switch.js.map +1 -1
- package/dist/collection/components/six-switch/test/six-switch.spec.js +69 -0
- package/dist/collection/components/six-switch/test/six-switch.spec.js.map +1 -0
- package/dist/collection/components/six-tab/six-tab.js +9 -5
- package/dist/collection/components/six-tab/six-tab.js.map +1 -1
- package/dist/collection/components/six-tab/test/six-tab.spec.js +20 -0
- package/dist/collection/components/six-tab/test/six-tab.spec.js.map +1 -0
- package/dist/collection/components/six-tab-group/six-tab-group.js +10 -7
- package/dist/collection/components/six-tab-group/six-tab-group.js.map +1 -1
- package/dist/collection/components/six-tab-group/test/six-tab-group.spec.js +45 -0
- package/dist/collection/components/six-tab-group/test/six-tab-group.spec.js.map +1 -0
- package/dist/collection/components/six-tab-panel/six-tab-panel.js +1 -1
- package/dist/collection/components/six-tab-panel/test/six-tab-panel.spec.js +20 -0
- package/dist/collection/components/six-tab-panel/test/six-tab-panel.spec.js.map +1 -0
- package/dist/collection/components/six-tag/six-tag.css +6 -0
- package/dist/collection/components/six-tag/six-tag.js +3 -2
- package/dist/collection/components/six-tag/six-tag.js.map +1 -1
- package/dist/collection/components/six-tag/test/six-tag.spec.js +42 -0
- package/dist/collection/components/six-tag/test/six-tag.spec.js.map +1 -0
- package/dist/collection/components/six-textarea/six-textarea.js +24 -14
- package/dist/collection/components/six-textarea/six-textarea.js.map +1 -1
- package/dist/collection/components/six-textarea/test/six-textarea.spec.js +117 -0
- package/dist/collection/components/six-textarea/test/six-textarea.spec.js.map +1 -0
- package/dist/collection/components/six-tile/six-tile.js +10 -6
- package/dist/collection/components/six-tile/six-tile.js.map +1 -1
- package/dist/collection/components/six-tile/test/six-tile.spec.js +69 -0
- package/dist/collection/components/six-tile/test/six-tile.spec.js.map +1 -0
- package/dist/collection/components/six-timepicker/six-timepicker.js +19 -13
- package/dist/collection/components/six-timepicker/six-timepicker.js.map +1 -1
- package/dist/collection/components/six-timepicker/test/six-timepicker.spec.js +496 -0
- package/dist/collection/components/six-timepicker/test/six-timepicker.spec.js.map +1 -0
- package/dist/collection/components/six-tooltip/six-tooltip.js +14 -8
- package/dist/collection/components/six-tooltip/six-tooltip.js.map +1 -1
- package/dist/collection/components/six-tooltip/test/six-tooltip.spec.js +28 -0
- package/dist/collection/components/six-tooltip/test/six-tooltip.spec.js.map +1 -0
- package/dist/collection/functional-components/form-control/form-control.js +1 -1
- package/dist/collection/utils/date-util.js +1 -1
- package/dist/collection/utils/date-util.spec.js +995 -0
- package/dist/collection/utils/date-util.spec.js.map +1 -0
- package/dist/collection/utils/event-listeners.js.map +1 -1
- package/dist/collection/utils/popover.js +1 -1
- package/dist/collection/utils/scroll.js +1 -1
- package/dist/collection/utils/scroll.spec.js +122 -0
- package/dist/collection/utils/scroll.spec.js.map +1 -0
- package/dist/collection/utils/time.util.spec.js +368 -0
- package/dist/collection/utils/time.util.spec.js.map +1 -0
- package/dist/collection/wrappers/set-attributes/set-attributes.js +1 -1
- package/dist/collection/wrappers/set-attributes/test/set-attributes.spec.js +16 -0
- package/dist/collection/wrappers/set-attributes/test/set-attributes.spec.js.map +1 -0
- package/dist/components/event-listeners.js.map +1 -1
- package/dist/components/execution-control.js.map +1 -1
- package/dist/components/focus-visible.js.map +1 -1
- package/dist/components/form-control.js.map +1 -1
- package/dist/components/form.js.map +1 -1
- package/dist/components/index.js.map +1 -1
- package/dist/components/modal.js.map +1 -1
- package/dist/components/popover.js.map +1 -1
- package/dist/components/scroll.js.map +1 -1
- package/dist/components/set-attributes2.js.map +1 -1
- package/dist/components/six-alert.js.map +1 -1
- package/dist/components/six-avatar.js.map +1 -1
- package/dist/components/six-badge.js.map +1 -1
- package/dist/components/six-button.js.map +1 -1
- package/dist/components/six-card.js.map +1 -1
- package/dist/components/six-checkbox.js +3 -12
- package/dist/components/six-checkbox.js.map +1 -1
- package/dist/components/six-datepicker.js +3 -1
- package/dist/components/six-datepicker.js.map +1 -1
- package/dist/components/six-details2.js.map +1 -1
- package/dist/components/six-dialog.js.map +1 -1
- package/dist/components/six-drawer.js.map +1 -1
- package/dist/components/six-dropdown2.js.map +1 -1
- package/dist/components/six-error-page.js.map +1 -1
- package/dist/components/six-file-list-item.js.map +1 -1
- package/dist/components/six-file-list.js.map +1 -1
- package/dist/components/six-file-upload.js.map +1 -1
- package/dist/components/six-footer.js.map +1 -1
- package/dist/components/six-group-label.js.map +1 -1
- package/dist/components/six-header.js.map +1 -1
- package/dist/components/six-icon-button2.js.map +1 -1
- package/dist/components/six-icon2.js.map +1 -1
- package/dist/components/six-input2.js +1 -1
- package/dist/components/six-input2.js.map +1 -1
- package/dist/components/six-item-picker2.js +2 -2
- package/dist/components/six-item-picker2.js.map +1 -1
- package/dist/components/six-language-switcher.js.map +1 -1
- package/dist/components/six-layout-grid.js.map +1 -1
- package/dist/components/six-main-container.js.map +1 -1
- package/dist/components/six-menu-divider.js.map +1 -1
- package/dist/components/six-menu-item2.js.map +1 -1
- package/dist/components/six-menu-label.js.map +1 -1
- package/dist/components/six-menu2.js.map +1 -1
- package/dist/components/six-picto2.js.map +1 -1
- package/dist/components/six-progress-bar.js.map +1 -1
- package/dist/components/six-progress-ring.js.map +1 -1
- package/dist/components/six-radio.js +10 -19
- package/dist/components/six-radio.js.map +1 -1
- package/dist/components/six-range.js.map +1 -1
- package/dist/components/six-root.js.map +1 -1
- package/dist/components/six-search-field.js.map +1 -1
- package/dist/components/six-select.js +7 -6
- package/dist/components/six-select.js.map +1 -1
- package/dist/components/six-sidebar-item-group.js.map +1 -1
- package/dist/components/six-sidebar-item.js.map +1 -1
- package/dist/components/six-sidebar.js.map +1 -1
- package/dist/components/six-spinner2.js.map +1 -1
- package/dist/components/six-stage-indicator2.js.map +1 -1
- package/dist/components/six-switch.js +3 -1
- package/dist/components/six-switch.js.map +1 -1
- package/dist/components/six-tab-group.js.map +1 -1
- package/dist/components/six-tab-panel.js.map +1 -1
- package/dist/components/six-tab.js.map +1 -1
- package/dist/components/six-tag2.js +1 -1
- package/dist/components/six-tag2.js.map +1 -1
- package/dist/components/six-textarea.js.map +1 -1
- package/dist/components/six-tile.js.map +1 -1
- package/dist/components/six-timepicker2.js.map +1 -1
- package/dist/components/six-tooltip2.js.map +1 -1
- package/dist/components/slot.js.map +1 -1
- package/dist/components.d.ts +361 -88
- package/dist/components.json +3710 -78
- package/dist/esm/{event-listeners-535f3ad1.js → event-listeners-f6e5b0ab.js} +1 -1
- package/dist/esm/event-listeners-f6e5b0ab.js.map +1 -0
- package/dist/esm/{execution-control-72cc50f4.js → execution-control-e0892a05.js} +1 -1
- package/dist/esm/execution-control-e0892a05.js.map +1 -0
- package/dist/esm/{focus-visible-fa7129a0.js → focus-visible-fc6ac671.js} +1 -1
- package/dist/esm/focus-visible-fc6ac671.js.map +1 -0
- package/dist/esm/{form-0b9c11cd.js → form-81252534.js} +1 -1
- package/dist/esm/form-81252534.js.map +1 -0
- package/dist/esm/{form-control-785c5f79.js → form-control-32cb533f.js} +2 -2
- package/dist/esm/form-control-32cb533f.js.map +1 -0
- package/dist/esm/{index-5c0f6628.js → index-8a74f992.js} +396 -54
- package/dist/esm/index-8a74f992.js.map +1 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/loader.js +4 -13
- package/dist/esm/loader.js.map +1 -1
- package/dist/esm/{modal-b1d96441.js → modal-7d32e141.js} +1 -1
- package/dist/esm/modal-7d32e141.js.map +1 -0
- package/dist/esm/{popover-2e72e7d8.js → popover-136d1f73.js} +1 -1
- package/dist/esm/popover-136d1f73.js.map +1 -0
- package/dist/esm/{popup-678b8592.js → popup-7f89a001.js} +1 -1
- package/dist/esm/popup-7f89a001.js.map +1 -0
- package/dist/esm/{scroll-180b53fd.js → scroll-3fb087a2.js} +1 -1
- package/dist/esm/scroll-3fb087a2.js.map +1 -0
- package/dist/esm/set-attributes_2.entry.js +1 -1
- package/dist/esm/set-attributes_2.entry.js.map +1 -1
- package/dist/esm/six-alert.entry.js +1 -1
- package/dist/esm/six-alert.entry.js.map +1 -1
- package/dist/esm/six-avatar.entry.js +1 -1
- package/dist/esm/six-avatar.entry.js.map +1 -1
- package/dist/esm/six-badge.entry.js +1 -1
- package/dist/esm/six-badge.entry.js.map +1 -1
- package/dist/esm/six-button.entry.js +3 -3
- package/dist/esm/six-button.entry.js.map +1 -1
- package/dist/esm/six-card.entry.js +1 -1
- package/dist/esm/six-card.entry.js.map +1 -1
- package/dist/esm/six-checkbox.entry.js +6 -14
- package/dist/esm/six-checkbox.entry.js.map +1 -1
- package/dist/esm/six-datepicker.entry.js +8 -6
- package/dist/esm/six-datepicker.entry.js.map +1 -1
- package/dist/esm/six-details.entry.js +2 -2
- package/dist/esm/six-details.entry.js.map +1 -1
- package/dist/esm/six-dialog.entry.js +4 -4
- package/dist/esm/six-dialog.entry.js.map +1 -1
- package/dist/esm/six-drawer.entry.js +4 -4
- package/dist/esm/six-drawer.entry.js.map +1 -1
- package/dist/esm/six-dropdown_2.entry.js +5 -5
- package/dist/esm/six-dropdown_2.entry.js.map +1 -1
- package/dist/esm/six-error-page.entry.js +1 -1
- package/dist/esm/six-error-page.entry.js.map +1 -1
- package/dist/esm/six-file-list-item.entry.js +1 -1
- package/dist/esm/six-file-list-item.entry.js.map +1 -1
- package/dist/esm/six-file-list.entry.js +1 -1
- package/dist/esm/six-file-list.entry.js.map +1 -1
- package/dist/esm/six-file-upload.entry.js +1 -1
- package/dist/esm/six-file-upload.entry.js.map +1 -1
- package/dist/esm/six-footer.entry.js +1 -1
- package/dist/esm/six-footer.entry.js.map +1 -1
- package/dist/esm/six-group-label.entry.js +3 -3
- package/dist/esm/six-group-label.entry.js.map +1 -1
- package/dist/esm/six-header.entry.js +3 -3
- package/dist/esm/six-header.entry.js.map +1 -1
- package/dist/esm/six-icon-button.entry.js +2 -2
- package/dist/esm/six-icon-button.entry.js.map +1 -1
- package/dist/esm/six-icon.entry.js +1 -1
- package/dist/esm/six-icon.entry.js.map +1 -1
- package/dist/esm/six-input.entry.js +6 -6
- package/dist/esm/six-input.entry.js.map +1 -1
- package/dist/esm/six-item-picker.entry.js +6 -6
- package/dist/esm/six-item-picker.entry.js.map +1 -1
- package/dist/esm/six-language-switcher.entry.js +1 -1
- package/dist/esm/six-language-switcher.entry.js.map +1 -1
- package/dist/esm/six-layout-grid.entry.js +1 -1
- package/dist/esm/six-layout-grid.entry.js.map +1 -1
- package/dist/esm/six-main-container.entry.js +1 -1
- package/dist/esm/six-main-container.entry.js.map +1 -1
- package/dist/esm/six-menu-divider.entry.js +1 -1
- package/dist/esm/six-menu-divider.entry.js.map +1 -1
- package/dist/esm/six-menu-item.entry.js +2 -2
- package/dist/esm/six-menu-item.entry.js.map +1 -1
- package/dist/esm/six-menu-label.entry.js +1 -1
- package/dist/esm/six-menu-label.entry.js.map +1 -1
- package/dist/esm/six-picto.entry.js +1 -1
- package/dist/esm/six-picto.entry.js.map +1 -1
- package/dist/esm/six-progress-bar.entry.js +1 -1
- package/dist/esm/six-progress-bar.entry.js.map +1 -1
- package/dist/esm/six-progress-ring.entry.js +1 -1
- package/dist/esm/six-progress-ring.entry.js.map +1 -1
- package/dist/esm/six-radio.entry.js +11 -19
- package/dist/esm/six-radio.entry.js.map +1 -1
- package/dist/esm/six-range.entry.js +4 -4
- package/dist/esm/six-range.entry.js.map +1 -1
- package/dist/esm/six-root.entry.js +1 -1
- package/dist/esm/six-root.entry.js.map +1 -1
- package/dist/esm/six-search-field.entry.js +3 -3
- package/dist/esm/six-search-field.entry.js.map +1 -1
- package/dist/esm/six-select.entry.js +12 -11
- package/dist/esm/six-select.entry.js.map +1 -1
- package/dist/esm/six-sidebar-item-group.entry.js +2 -2
- package/dist/esm/six-sidebar-item-group.entry.js.map +1 -1
- package/dist/esm/six-sidebar-item.entry.js +1 -1
- package/dist/esm/six-sidebar-item.entry.js.map +1 -1
- package/dist/esm/six-sidebar.entry.js +2 -2
- package/dist/esm/six-sidebar.entry.js.map +1 -1
- package/dist/esm/six-spinner.entry.js +1 -1
- package/dist/esm/six-spinner.entry.js.map +1 -1
- package/dist/esm/six-switch.entry.js +6 -4
- package/dist/esm/six-switch.entry.js.map +1 -1
- package/dist/esm/six-tab-group.entry.js +3 -3
- package/dist/esm/six-tab-group.entry.js.map +1 -1
- package/dist/esm/six-tab-panel.entry.js +1 -1
- package/dist/esm/six-tab-panel.entry.js.map +1 -1
- package/dist/esm/six-tab.entry.js +1 -1
- package/dist/esm/six-tab.entry.js.map +1 -1
- package/dist/esm/six-tag.entry.js +2 -2
- package/dist/esm/six-tag.entry.js.map +1 -1
- package/dist/esm/six-textarea.entry.js +4 -4
- package/dist/esm/six-textarea.entry.js.map +1 -1
- package/dist/esm/six-tile.entry.js +2 -2
- package/dist/esm/six-tile.entry.js.map +1 -1
- package/dist/esm/six-timepicker.entry.js +6 -6
- package/dist/esm/six-timepicker.entry.js.map +1 -1
- package/dist/esm/six-tooltip.entry.js +2 -2
- package/dist/esm/six-tooltip.entry.js.map +1 -1
- package/dist/esm/{slot-2e64df19.js → slot-ad36df3a.js} +1 -1
- package/dist/esm/slot-ad36df3a.js.map +1 -0
- package/dist/esm/{types-4b10b413.js → types-59b455aa.js} +1 -1
- package/dist/esm/types-59b455aa.js.map +1 -0
- package/dist/esm/ui-library.js +4 -7
- package/dist/esm/ui-library.js.map +1 -1
- package/dist/types/components/six-checkbox/six-checkbox.d.ts +0 -4
- package/dist/types/components/six-radio/six-radio.d.ts +0 -5
- package/dist/types/components.d.ts +0 -8
- package/dist/types/stencil-public-runtime.d.ts +15 -2
- package/dist/types/utils/event-listeners.d.ts +3 -3
- package/dist/ui-library/index.esm.js.map +1 -1
- package/dist/ui-library/p-02981b91.entry.js +2 -0
- package/dist/ui-library/p-02981b91.entry.js.map +1 -0
- package/dist/ui-library/{p-25a3bf57.js → p-0f510624.js} +1 -1
- package/dist/ui-library/p-0f510624.js.map +1 -0
- package/dist/ui-library/{p-0b2c6348.js → p-0fdb185d.js} +1 -1
- package/dist/ui-library/p-0fdb185d.js.map +1 -0
- package/dist/ui-library/{p-a844cb72.entry.js → p-1256cc0a.entry.js} +2 -2
- package/dist/ui-library/p-1256cc0a.entry.js.map +1 -0
- package/dist/ui-library/{p-e8feb81f.entry.js → p-13b43e04.entry.js} +2 -2
- package/dist/ui-library/p-13b43e04.entry.js.map +1 -0
- package/dist/ui-library/{p-d87a6f4d.js → p-15559d38.js} +1 -1
- package/dist/ui-library/p-15559d38.js.map +1 -0
- package/dist/ui-library/{p-502ff3d3.entry.js → p-19ed7a4c.entry.js} +2 -2
- package/dist/ui-library/p-19ed7a4c.entry.js.map +1 -0
- package/dist/ui-library/{p-97323ad7.entry.js → p-1d5ee1a0.entry.js} +2 -2
- package/dist/ui-library/p-1d5ee1a0.entry.js.map +1 -0
- package/dist/ui-library/{p-eb8f05a9.js → p-1f18768a.js} +1 -1
- package/dist/ui-library/p-1f18768a.js.map +1 -0
- package/dist/ui-library/{p-b4547fb5.entry.js → p-21b3b321.entry.js} +2 -2
- package/dist/ui-library/p-21b3b321.entry.js.map +1 -0
- package/dist/ui-library/p-264d4ea8.entry.js +2 -0
- package/dist/ui-library/p-264d4ea8.entry.js.map +1 -0
- package/dist/ui-library/{p-778cf804.entry.js → p-29ac3d7d.entry.js} +2 -2
- package/dist/ui-library/p-29ac3d7d.entry.js.map +1 -0
- package/dist/ui-library/{p-92ca6a84.entry.js → p-314b2096.entry.js} +2 -2
- package/dist/ui-library/p-314b2096.entry.js.map +1 -0
- package/dist/ui-library/{p-66180e89.entry.js → p-330a4988.entry.js} +2 -2
- package/dist/ui-library/p-330a4988.entry.js.map +1 -0
- package/dist/ui-library/{p-21859bca.entry.js → p-346f9557.entry.js} +2 -2
- package/dist/ui-library/p-346f9557.entry.js.map +1 -0
- package/dist/ui-library/{p-03a145f5.entry.js → p-37557787.entry.js} +2 -2
- package/dist/ui-library/p-37557787.entry.js.map +1 -0
- package/dist/ui-library/{p-baa03951.entry.js → p-3cc5addb.entry.js} +2 -2
- package/dist/ui-library/p-3cc5addb.entry.js.map +1 -0
- package/dist/ui-library/{p-87032e26.entry.js → p-3d9de119.entry.js} +2 -2
- package/dist/ui-library/p-3d9de119.entry.js.map +1 -0
- package/dist/ui-library/{p-ef3936e5.entry.js → p-411ed539.entry.js} +2 -2
- package/dist/ui-library/p-411ed539.entry.js.map +1 -0
- package/dist/ui-library/{p-c5cdba08.entry.js → p-4705a51e.entry.js} +2 -2
- package/dist/ui-library/p-4705a51e.entry.js.map +1 -0
- package/dist/ui-library/{p-dc3f5996.entry.js → p-4abed9df.entry.js} +2 -2
- package/dist/ui-library/p-4abed9df.entry.js.map +1 -0
- package/dist/ui-library/{p-0cc08e91.js → p-5654e4c7.js} +1 -1
- package/dist/ui-library/p-5654e4c7.js.map +1 -0
- package/dist/ui-library/{p-0fe78f9b.js → p-59210f0b.js} +1 -1
- package/dist/ui-library/p-59210f0b.js.map +1 -0
- package/dist/ui-library/{p-28be55f0.entry.js → p-5af44076.entry.js} +2 -2
- package/dist/ui-library/p-5af44076.entry.js.map +1 -0
- package/dist/ui-library/{p-18e9f8b8.entry.js → p-5d6b7353.entry.js} +2 -2
- package/dist/ui-library/p-5d6b7353.entry.js.map +1 -0
- package/dist/ui-library/{p-097cced4.entry.js → p-613283a7.entry.js} +2 -2
- package/dist/ui-library/p-613283a7.entry.js.map +1 -0
- package/dist/ui-library/p-6153045b.js +3 -0
- package/dist/ui-library/p-6153045b.js.map +1 -0
- package/dist/ui-library/{p-e19a6c95.entry.js → p-6197fe2f.entry.js} +2 -2
- package/dist/ui-library/p-6197fe2f.entry.js.map +1 -0
- package/dist/ui-library/{p-8cf72af6.js → p-698bb2c8.js} +1 -1
- package/dist/ui-library/p-698bb2c8.js.map +1 -0
- package/dist/ui-library/{p-9337cdd6.entry.js → p-72254eef.entry.js} +2 -2
- package/dist/ui-library/p-72254eef.entry.js.map +1 -0
- package/dist/ui-library/{p-912092c0.entry.js → p-724875b0.entry.js} +2 -2
- package/dist/ui-library/p-724875b0.entry.js.map +1 -0
- package/dist/ui-library/{p-dd3c76f1.entry.js → p-7afafb9d.entry.js} +2 -2
- package/dist/ui-library/p-7afafb9d.entry.js.map +1 -0
- package/dist/ui-library/{p-60621dc6.js → p-7d95def3.js} +1 -1
- package/dist/ui-library/p-7d95def3.js.map +1 -0
- package/dist/ui-library/{p-63703ba3.entry.js → p-7e3ad38a.entry.js} +2 -2
- package/dist/ui-library/p-7e3ad38a.entry.js.map +1 -0
- package/dist/ui-library/{p-71035abf.entry.js → p-83864cfe.entry.js} +2 -2
- package/dist/ui-library/p-83864cfe.entry.js.map +1 -0
- package/dist/ui-library/{p-445ba5b8.entry.js → p-878226a0.entry.js} +2 -2
- package/dist/ui-library/p-878226a0.entry.js.map +1 -0
- package/dist/ui-library/{p-4d408fb4.js → p-8c0971e0.js} +1 -1
- package/dist/ui-library/p-8c0971e0.js.map +1 -0
- package/dist/ui-library/{p-afcbe9da.entry.js → p-91b51800.entry.js} +2 -2
- package/dist/ui-library/p-91b51800.entry.js.map +1 -0
- package/dist/ui-library/{p-f0dd77e1.entry.js → p-95fbdd0b.entry.js} +2 -2
- package/dist/ui-library/p-95fbdd0b.entry.js.map +1 -0
- package/dist/ui-library/{p-9461417e.entry.js → p-99e24daf.entry.js} +2 -2
- package/dist/ui-library/p-99e24daf.entry.js.map +1 -0
- package/dist/ui-library/{p-ba74863a.js → p-9ace84c7.js} +1 -1
- package/dist/ui-library/p-9ace84c7.js.map +1 -0
- package/dist/ui-library/{p-d6798d35.entry.js → p-9b354f5d.entry.js} +2 -2
- package/dist/ui-library/p-9b354f5d.entry.js.map +1 -0
- package/dist/ui-library/{p-3929b0af.entry.js → p-9c1be3fb.entry.js} +2 -2
- package/dist/ui-library/p-9c1be3fb.entry.js.map +1 -0
- package/dist/ui-library/p-9f0b43f9.entry.js +2 -0
- package/dist/ui-library/p-9f0b43f9.entry.js.map +1 -0
- package/dist/ui-library/{p-cdcde4cd.entry.js → p-a0f290d0.entry.js} +2 -2
- package/dist/ui-library/p-a0f290d0.entry.js.map +1 -0
- package/dist/ui-library/{p-09779e47.entry.js → p-a55c7258.entry.js} +2 -2
- package/dist/ui-library/p-a55c7258.entry.js.map +1 -0
- package/dist/ui-library/{p-6d75f216.entry.js → p-a6a9ee96.entry.js} +2 -2
- package/dist/ui-library/p-a6a9ee96.entry.js.map +1 -0
- package/dist/ui-library/{p-73597d13.entry.js → p-ac099e6b.entry.js} +2 -2
- package/dist/ui-library/p-ac099e6b.entry.js.map +1 -0
- package/dist/ui-library/{p-bd8f8eef.entry.js → p-ae601a0f.entry.js} +2 -2
- package/dist/ui-library/p-ae601a0f.entry.js.map +1 -0
- package/dist/ui-library/{p-dcd7c547.entry.js → p-b351f889.entry.js} +2 -2
- package/dist/ui-library/p-b351f889.entry.js.map +1 -0
- package/dist/ui-library/p-b550a258.entry.js +2 -0
- package/dist/ui-library/p-b550a258.entry.js.map +1 -0
- package/dist/ui-library/{p-b3bff992.entry.js → p-bf87464b.entry.js} +2 -2
- package/dist/ui-library/p-bf87464b.entry.js.map +1 -0
- package/dist/ui-library/{p-72ca96e1.entry.js → p-c03ebf7d.entry.js} +2 -2
- package/dist/ui-library/p-c03ebf7d.entry.js.map +1 -0
- package/dist/ui-library/{p-a1d4f6cf.entry.js → p-cd67da3d.entry.js} +2 -2
- package/dist/ui-library/p-cd67da3d.entry.js.map +1 -0
- package/dist/ui-library/{p-5a34c93e.entry.js → p-cdaed936.entry.js} +2 -2
- package/dist/ui-library/p-cdaed936.entry.js.map +1 -0
- package/dist/ui-library/{p-724e154d.entry.js → p-d367f4f9.entry.js} +2 -2
- package/dist/ui-library/p-d367f4f9.entry.js.map +1 -0
- package/dist/ui-library/{p-2761f908.js → p-d42c2025.js} +2 -2
- package/dist/ui-library/p-d42c2025.js.map +1 -0
- package/dist/ui-library/{p-820c23f0.entry.js → p-dfed33c5.entry.js} +2 -2
- package/dist/ui-library/p-dfed33c5.entry.js.map +1 -0
- package/dist/ui-library/{p-686b12ec.entry.js → p-ed381ad9.entry.js} +2 -2
- package/dist/ui-library/p-ed381ad9.entry.js.map +1 -0
- package/dist/ui-library/{p-a49ae60a.entry.js → p-ee8342e1.entry.js} +2 -2
- package/dist/ui-library/p-ee8342e1.entry.js.map +1 -0
- package/dist/ui-library/{p-8e0b6b7e.entry.js → p-ee950ce2.entry.js} +2 -2
- package/dist/ui-library/p-ee950ce2.entry.js.map +1 -0
- package/dist/ui-library/{p-087fdd96.entry.js → p-ff90ffd1.entry.js} +2 -2
- package/dist/ui-library/p-ff90ffd1.entry.js.map +1 -0
- package/dist/ui-library/ui-library.esm.js +1 -1
- package/dist/ui-library/ui-library.esm.js.map +1 -1
- package/loader/index.d.ts +1 -1
- package/package.json +7 -7
- package/dist/cjs/event-listeners-b835dfae.js.map +0 -1
- package/dist/cjs/execution-control-45c84c46.js.map +0 -1
- package/dist/cjs/focus-visible-e0d93a95.js.map +0 -1
- package/dist/cjs/form-8cbd4e0e.js.map +0 -1
- package/dist/cjs/form-control-8df00a52.js.map +0 -1
- package/dist/cjs/index-2f6daa5b.js.map +0 -1
- package/dist/cjs/modal-21350fb5.js.map +0 -1
- package/dist/cjs/popover-8885d50f.js.map +0 -1
- package/dist/cjs/popup-44836aaf.js.map +0 -1
- package/dist/cjs/scroll-76e6f5d7.js.map +0 -1
- package/dist/cjs/slot-bccbdb59.js.map +0 -1
- package/dist/cjs/types-64878648.js.map +0 -1
- package/dist/esm/event-listeners-535f3ad1.js.map +0 -1
- package/dist/esm/execution-control-72cc50f4.js.map +0 -1
- package/dist/esm/focus-visible-fa7129a0.js.map +0 -1
- package/dist/esm/form-control-785c5f79.js.map +0 -1
- package/dist/esm/index-5c0f6628.js.map +0 -1
- package/dist/esm/modal-b1d96441.js.map +0 -1
- package/dist/esm/polyfills/css-shim.js +0 -1
- package/dist/esm/popup-678b8592.js.map +0 -1
- package/dist/esm/scroll-180b53fd.js.map +0 -1
- package/dist/esm/slot-2e64df19.js.map +0 -1
- package/dist/esm/types-4b10b413.js.map +0 -1
- package/dist/ui-library/p-0108fe92.entry.js +0 -2
- package/dist/ui-library/p-0108fe92.entry.js.map +0 -1
- package/dist/ui-library/p-03a145f5.entry.js.map +0 -1
- package/dist/ui-library/p-087fdd96.entry.js.map +0 -1
- package/dist/ui-library/p-09779e47.entry.js.map +0 -1
- package/dist/ui-library/p-097cced4.entry.js.map +0 -1
- package/dist/ui-library/p-0b2c6348.js.map +0 -1
- package/dist/ui-library/p-0cc08e91.js.map +0 -1
- package/dist/ui-library/p-0fe78f9b.js.map +0 -1
- package/dist/ui-library/p-18e9f8b8.entry.js.map +0 -1
- package/dist/ui-library/p-21859bca.entry.js.map +0 -1
- package/dist/ui-library/p-25a3bf57.js.map +0 -1
- package/dist/ui-library/p-2761f908.js.map +0 -1
- package/dist/ui-library/p-28be55f0.entry.js.map +0 -1
- package/dist/ui-library/p-3929b0af.entry.js.map +0 -1
- package/dist/ui-library/p-445ba5b8.entry.js.map +0 -1
- package/dist/ui-library/p-4d408fb4.js.map +0 -1
- package/dist/ui-library/p-502ff3d3.entry.js.map +0 -1
- package/dist/ui-library/p-5a34c93e.entry.js.map +0 -1
- package/dist/ui-library/p-60621dc6.js.map +0 -1
- package/dist/ui-library/p-63703ba3.entry.js.map +0 -1
- package/dist/ui-library/p-66180e89.entry.js.map +0 -1
- package/dist/ui-library/p-686b12ec.entry.js.map +0 -1
- package/dist/ui-library/p-6d75f216.entry.js.map +0 -1
- package/dist/ui-library/p-71035abf.entry.js.map +0 -1
- package/dist/ui-library/p-724e154d.entry.js.map +0 -1
- package/dist/ui-library/p-72ca96e1.entry.js.map +0 -1
- package/dist/ui-library/p-73597d13.entry.js.map +0 -1
- package/dist/ui-library/p-778cf804.entry.js.map +0 -1
- package/dist/ui-library/p-820c23f0.entry.js.map +0 -1
- package/dist/ui-library/p-87032e26.entry.js.map +0 -1
- package/dist/ui-library/p-8cf72af6.js.map +0 -1
- package/dist/ui-library/p-8e0b6b7e.entry.js.map +0 -1
- package/dist/ui-library/p-912092c0.entry.js.map +0 -1
- package/dist/ui-library/p-92ca6a84.entry.js.map +0 -1
- package/dist/ui-library/p-9337cdd6.entry.js.map +0 -1
- package/dist/ui-library/p-9461417e.entry.js.map +0 -1
- package/dist/ui-library/p-97323ad7.entry.js.map +0 -1
- package/dist/ui-library/p-a1d4f6cf.entry.js.map +0 -1
- package/dist/ui-library/p-a49ae60a.entry.js.map +0 -1
- package/dist/ui-library/p-a844cb72.entry.js.map +0 -1
- package/dist/ui-library/p-ac4f4d45.js +0 -3
- package/dist/ui-library/p-ac4f4d45.js.map +0 -1
- package/dist/ui-library/p-afcbe9da.entry.js.map +0 -1
- package/dist/ui-library/p-b3bff992.entry.js.map +0 -1
- package/dist/ui-library/p-b4547fb5.entry.js.map +0 -1
- package/dist/ui-library/p-ba74863a.js.map +0 -1
- package/dist/ui-library/p-baa03951.entry.js.map +0 -1
- package/dist/ui-library/p-bd8f8eef.entry.js.map +0 -1
- package/dist/ui-library/p-c57f16af.entry.js +0 -2
- package/dist/ui-library/p-c57f16af.entry.js.map +0 -1
- package/dist/ui-library/p-c5cdba08.entry.js.map +0 -1
- package/dist/ui-library/p-c87810b0.entry.js +0 -2
- package/dist/ui-library/p-c87810b0.entry.js.map +0 -1
- package/dist/ui-library/p-cdcde4cd.entry.js.map +0 -1
- package/dist/ui-library/p-d6798d35.entry.js.map +0 -1
- package/dist/ui-library/p-d87a6f4d.js.map +0 -1
- package/dist/ui-library/p-dc3f5996.entry.js.map +0 -1
- package/dist/ui-library/p-dcd7c547.entry.js.map +0 -1
- package/dist/ui-library/p-dd3c76f1.entry.js.map +0 -1
- package/dist/ui-library/p-e07b3f0c.entry.js +0 -2
- package/dist/ui-library/p-e07b3f0c.entry.js.map +0 -1
- package/dist/ui-library/p-e19a6c95.entry.js.map +0 -1
- package/dist/ui-library/p-e8feb81f.entry.js.map +0 -1
- package/dist/ui-library/p-eb8f05a9.js.map +0 -1
- package/dist/ui-library/p-ef3936e5.entry.js.map +0 -1
- package/dist/ui-library/p-f0dd77e1.entry.js.map +0 -1
- package/readme.md +0 -156
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["sixSidebarCss","isSidebarItemGroup","node","_a","tagName","toLowerCase","SixSidebar","this","willShow","willHide","handleTransitionEnd","event","target","type","classList","contains","resetTransitionVariables","closeSiblingDetailsOnShow","clickedMenuItem","sidebar","scrollIntoView","closeAllSiblingsBySiblingProperty","getSibling","detailsElement","shadowRoot","querySelector","open","previousElementSibling","nextElementSibling","handleOpenChange","show","hide","componentWillLoad","componentDidRender","setupTogglableMenuItems","disconnectedCallback","removeEventListener","toggled","markAllMenuItemsAsSelectableEmpty","addEventListener","slot","nodes","assignedElements","menuItems","length","pop","menuItemsForCurrentNode","querySelectorAll","push","newItemGroups","Array","from","children","filter","forEach","details","selectableEmpty","toggle","sixShow","emit","defaultPrevented","isVisible","sixHide","selectItemByIndex","index","menuItemsOnRootLevel","flatMap","el","console","error","selectItemByName","value","sidebarItemGroups","indexOfSelectedElement","findIndex","name","selectedItem","_c","_b","at","sixAfterShow","sixAfterHide","render","h","class","sidebar__container","position","style","width","ref","onTransitionEnd"],"sources":["src/components/six-sidebar/six-sidebar.scss?tag=six-sidebar&encapsulation=shadow","src/components/six-sidebar/six-sidebar.tsx"],"sourcesContent":["@import 'src/global/component';\n@import 'src/global/mixins/hidden';\n@import 'src/global/mixins/scrollbar';\n\n:host {\n display: block;\n height: 100%;\n}\n\n.sidebar {\n &__container {\n // scroll\n height: 100%;\n overflow: auto;\n\n &.sidebar--open {\n box-shadow: var(--six-elevation-1dp);\n }\n\n &:not(.sidebar--visible) {\n @include hidden;\n }\n }\n\n &--left {\n color: var(--six-sidebar-color);\n background-color: var(--six-sidebar-background-color);\n // collapse\n transition: var(--six-transition-medium) margin-left;\n // six background\n background-size: 300vw 70%;\n background-position: bottom;\n background-repeat: no-repeat;\n }\n\n &--right {\n // collapse\n transition: var(--six-transition-medium) margin-right;\n }\n\n // if the sidebar is embedded within six-root it cuts-off the border styling, for thus we need to guarante a margin\n &--open {\n &.sidebar--left {\n margin-right: 2px;\n }\n\n &.sidebar--right {\n margin-left: 2px;\n }\n }\n}\n","import { Component, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\nimport { scrollIntoView } from '../../utils/scroll';\n\nconst isSidebarItemGroup = (node?: Element | null): boolean =>\n node?.tagName?.toLowerCase() === 'six-sidebar-item-group';\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot - Used to define the nested side bar [group] items.\n */\n\n@Component({\n tag: 'six-sidebar',\n styleUrl: 'six-sidebar.scss',\n shadow: true,\n})\nexport class SixSidebar {\n private willShow = false;\n private willHide = false;\n\n private sidebar?: HTMLElement;\n\n @State() isVisible = false;\n\n /** Sidebar position */\n @Prop() position: 'left' | 'right' = 'left';\n\n /** Indicates whether the sidebar is open. You can use this in lieu of the show/hide methods. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n /** Sidebar width */\n @Prop() width = '16rem';\n\n /** Define whether sidebar is toggled meaning only one menu can be open at the same time*/\n @Prop() toggled = false;\n\n /** Emitted when the sidebar opens. Calling `event.preventDefault()` will prevent it from being opened. */\n @Event({ eventName: 'six-sidebar-show' }) sixShow!: EventEmitter<EmptyPayload>;\n\n /** Emitted after the sidebar opens and all transitions are complete. */\n @Event({ eventName: 'six-sidebar-after-show' }) sixAfterShow!: EventEmitter<EmptyPayload>;\n\n /** Emitted when the sidebar closes. Calling `event.preventDefault()` will prevent it from being closed. */\n @Event({ eventName: 'six-sidebar-hide' }) sixHide!: EventEmitter<EmptyPayload>;\n\n /** Emitted after the sidebar closes and all transitions are complete. */\n @Event({ eventName: 'six-sidebar-after-hide' }) sixAfterHide!: EventEmitter<EmptyPayload>;\n\n /**\n * Emitted when the sidebar opens and the panel gains focus. Calling `event.preventDefault()` will prevent focus and\n * allow you to set it on a different element in the sidebar, such as an input or button.\n */\n @Event({ eventName: 'six-sidebar-initial-focus' }) sixInitialFocus!: EventEmitter<EmptyPayload>;\n\n @Watch('open')\n handleOpenChange() {\n this.open ? this.show() : this.hide();\n }\n\n private handleTransitionEnd = (event: TransitionEvent) => {\n const target = event.target as HTMLElement;\n\n // Ensure we only emit one event when the target element is no longer visible\n if (event.type === 'transitionend' && target.classList.contains('sidebar__container')) {\n this.resetTransitionVariables();\n }\n };\n\n componentWillLoad() {\n // Show on init if open\n if (this.open) {\n void this.show();\n // if the sidebar is open by default we need to manually reset the\n // transition variables since there will be no transition event\n this.resetTransitionVariables();\n }\n }\n\n componentDidRender() {\n this.setupTogglableMenuItems();\n }\n\n disconnectedCallback() {\n this.sidebar?.removeEventListener('six-details-show', this.closeSiblingDetailsOnShow);\n }\n\n private closeSiblingDetailsOnShow = (event: Event) => {\n const clickedMenuItem = event.target as HTMLElement;\n if (this.sidebar != null) {\n scrollIntoView(clickedMenuItem, this.sidebar);\n }\n\n const closeAllSiblingsBySiblingProperty = (\n getSibling: (node: Element | null | undefined) => Element | null | undefined\n ) => {\n let node: Element | null | undefined = clickedMenuItem;\n while (getSibling(node) != null) {\n node = getSibling(node);\n if (isSidebarItemGroup(node)) {\n const detailsElement = node?.shadowRoot?.querySelector('six-details');\n if (detailsElement != null) {\n detailsElement.open = false;\n }\n }\n }\n };\n\n // close all previous siblings\n closeAllSiblingsBySiblingProperty((node) => node?.previousElementSibling);\n // close all further siblings\n closeAllSiblingsBySiblingProperty((node) => node?.nextElementSibling);\n };\n\n private setupTogglableMenuItems() {\n if (!this.toggled || this.sidebar == null) return;\n this.markAllMenuItemsAsSelectableEmpty();\n this.sidebar.addEventListener('six-details-show', this.closeSiblingDetailsOnShow);\n }\n\n private markAllMenuItemsAsSelectableEmpty() {\n // when you have a toggled menu you also want to close other menu items when you click on an item without children\n // nice benefit this item will then also be highlighted\n const slot = this.sidebar?.querySelector('slot');\n const nodes = slot?.assignedElements() || [];\n\n // since we don't just want to make the top level empty menuItems selectable in toggled mode,\n // but also nested items we need to traverse the whole menu item tree\n const menuItems = [];\n while (nodes.length > 0) {\n const node = nodes.pop();\n if (node?.shadowRoot == null) {\n continue;\n }\n\n // collect six-details in the current shadowDOM\n const menuItemsForCurrentNode = node.shadowRoot.querySelectorAll('six-details');\n menuItems.push(...menuItemsForCurrentNode);\n\n // collect all six-sidebar-item-group children of the current node to afterwards check their shadowDOM too\n const newItemGroups = Array.from(node.children).filter(isSidebarItemGroup);\n nodes.push(...newItemGroups);\n }\n\n menuItems.forEach((details) => (details.selectableEmpty = true));\n }\n\n /** Toggles whether the sidebar should be shown or hidden */\n @Method()\n async toggle() {\n if (this.willShow || this.willHide) {\n return;\n }\n\n if (this.open) {\n await this.hide();\n } else {\n await this.show();\n }\n }\n\n /** Shows the sidebar */\n @Method()\n async show() {\n if (this.willShow) {\n return;\n }\n\n const sixShow = this.sixShow.emit();\n if (sixShow.defaultPrevented) {\n this.open = false;\n return;\n }\n\n this.willShow = true;\n this.isVisible = true;\n this.open = true;\n }\n\n /** Hides the sidebar */\n @Method()\n async hide() {\n if (this.willHide) {\n return;\n }\n\n const sixHide = this.sixHide.emit();\n if (sixHide.defaultPrevented) {\n this.open = true;\n return;\n }\n\n this.willHide = true;\n this.open = false;\n }\n\n /** Allows to select a menu item programmatically by index */\n @Method()\n async selectItemByIndex(index: number) {\n if (this.sidebar == null) return;\n\n const slot = this.sidebar.querySelector('slot');\n const menuItemsOnRootLevel: HTMLSixDetailsElement[] = (slot?.assignedElements() || []).flatMap((el) => {\n const detailsElement = el.shadowRoot?.querySelector('six-details');\n if (detailsElement == null) {\n return [];\n }\n return [detailsElement];\n });\n if (index < 0 || index > menuItemsOnRootLevel.length - 1) {\n console.error(\n `Tried to access sidebar menu item by index, but provided index out of range. Provided index: ${index}`\n );\n return;\n }\n await menuItemsOnRootLevel[index].show();\n }\n\n /** Allows to select a menu item programmatically by name */\n @Method()\n async selectItemByName(value: string) {\n const slot = this.sidebar?.querySelector('slot');\n const sidebarItemGroups = slot?.assignedElements() as HTMLSixSidebarItemGroupElement[];\n if (sidebarItemGroups == null) {\n return;\n }\n\n const indexOfSelectedElement = sidebarItemGroups.findIndex((el) => el?.name === value);\n const selectedItem = sidebarItemGroups.at(indexOfSelectedElement)?.shadowRoot?.querySelector('six-details');\n await selectedItem?.show();\n }\n\n private resetTransitionVariables() {\n this.isVisible = this.open;\n this.willShow = false;\n this.willHide = false;\n this.open ? this.sixAfterShow.emit() : this.sixAfterHide.emit();\n }\n\n render() {\n return (\n <host class=\"six-sidebar\">\n <div\n class={{\n sidebar__container: true,\n 'sidebar--visible': this.isVisible,\n 'sidebar--open': this.open,\n 'sidebar--left': this.position === 'left',\n 'sidebar--right': this.position === 'right',\n }}\n style={{\n width: this.width,\n [`margin-${this.position}`]: this.open ? '0' : `calc(1rem - ${this.width})`,\n }}\n ref={(el) => (this.sidebar = el)}\n aria-hidden={this.open ? 'false' : 'true'}\n onTransitionEnd={this.handleTransitionEnd}\n >\n <slot />\n </div>\n </host>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r,h as i}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r,h as i}from"./p-6153045b.js";const o=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:block}.menu-divider{border-top:solid var(--six-border-width) var(--six-menu-divider-color);margin:0}";const e=class{constructor(i){r(this,i)}render(){return i("div",{part:"base",class:"menu-divider",role:"separator","aria-hidden":"true"})}};e.style=o;export{e as six_menu_divider};
|
|
2
|
+
//# sourceMappingURL=p-346f9557.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["sixMenuDividerCss","SixMenuDivider","render","h","part","class","role"],"sources":["src/components/six-menu-divider/six-menu-divider.scss?tag=six-menu-divider&encapsulation=shadow","src/components/six-menu-divider/six-menu-divider.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n display: block;\n}\n\n.menu-divider {\n border-top: solid var(--six-border-width) var(--six-menu-divider-color);\n margin: 0;\n}\n","import { Component, h } from '@stencil/core';\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @part base - The component's base wrapper.\n */\n\n@Component({\n tag: 'six-menu-divider',\n styleUrl: 'six-menu-divider.scss',\n shadow: true,\n})\nexport class SixMenuDivider {\n render() {\n return <div part=\"base\" class=\"menu-divider\" role=\"separator\" aria-hidden=\"true\" />;\n }\n}\n"],"mappings":"sCAAA,MAAMA,EAAoB,2N,MCgBbC,EAAc,M,yBACzB,MAAAC,GACE,OAAOC,EAAA,OAAKC,KAAK,OAAOC,MAAM,eAAeC,KAAK,YAAW,cAAa,Q"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as s,c as i,h as t}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as s,c as i,h as t}from"./p-6153045b.js";import{D as e,a as h}from"./p-698bb2c8.js";import{E as a}from"./p-7d95def3.js";const o=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:block}.search-box{z-index:var(--six-z-index-search-field)}.search-box__icon{cursor:pointer}";const r=class{constructor(t){s(this,t);this.searchFieldChange=i(this,"six-search-field-change",7);this.eventListeners=new a;this.handleInputChange=()=>{if(this.inputElement!=null){this.searchFieldChange.emit({value:this.inputElement.value})}};this.placeholder=undefined;this.debounce=e;this.disabled=false;this.value="";this.clearable=false}handleValueChange(){if(this.inputElement!=null){this.inputElement.value=this.value}}componentDidLoad(){if(this.inputElement==null)return;this.eventListeners.add(this.inputElement,"six-input-input",h(this.handleInputChange,this.debounce));this.eventListeners.add(this.inputElement,"keydown",(s=>{const i=s;if(i.key==="Enter"){this.handleInputChange()}}))}disconnectedCallback(){this.eventListeners.removeAll()}render(){return t("div",{class:"search-box"},t("six-input",{ref:s=>this.inputElement=s,placeholder:this.placeholder,value:this.value,disabled:this.disabled,clearable:this.clearable},t("six-icon",{class:"search-box__icon",slot:"prefix",size:"small",onClick:this.handleInputChange},"search")),t("slot",null))}static get watchers(){return{value:["handleValueChange"]}}};r.style=o;export{r as six_search_field};
|
|
2
|
+
//# sourceMappingURL=p-37557787.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["sixSearchFieldCss","SixSearchField","this","eventListeners","EventListeners","handleInputChange","inputElement","searchFieldChange","emit","value","DEFAULT_DEBOUNCE_FAST","handleValueChange","componentDidLoad","add","debounce","event","keyboardEvent","key","disconnectedCallback","removeAll","render","h","class","ref","el","placeholder","disabled","clearable","slot","size","onClick"],"sources":["src/components/six-search-field/six-search-field.scss?tag=six-search-field&encapsulation=shadow","src/components/six-search-field/six-search-field.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n display: block;\n}\n\n.search-box {\n z-index: var(--six-z-index-search-field);\n\n &__icon {\n cursor: pointer;\n }\n}\n","import { Component, Event, EventEmitter, h, Prop, Watch } from '@stencil/core';\nimport { debounce, DEFAULT_DEBOUNCE_FAST } from '../../utils/execution-control';\nimport { EventListeners } from '../../utils/event-listeners';\n\nexport interface SixSearchFieldChangePayload {\n value: string;\n}\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot - Used to define the results below the search component.\n */\n\n@Component({\n tag: 'six-search-field',\n styleUrl: 'six-search-field.scss',\n shadow: true,\n})\nexport class SixSearchField {\n /** The input's placeholder text. */\n @Prop() placeholder?: string;\n\n /** Debounce time in milliseconds, default is 300 ms */\n @Prop({ reflect: true }) debounce = DEFAULT_DEBOUNCE_FAST;\n\n /** Set to true to disable the input. */\n @Prop({ reflect: true }) disabled = false;\n\n /** The input's value attribute. */\n @Prop({ reflect: true }) value = '';\n\n /** Set to true to add a clear button when the input is populated. */\n @Prop() clearable = false;\n\n /** Emitted when a search is triggered */\n @Event({ eventName: 'six-search-field-change' }) searchFieldChange!: EventEmitter<SixSearchFieldChangePayload>;\n\n private inputElement?: HTMLSixInputElement;\n\n private eventListeners = new EventListeners();\n\n private handleInputChange = () => {\n if (this.inputElement != null) {\n this.searchFieldChange.emit({ value: this.inputElement.value });\n }\n };\n\n @Watch('value')\n handleValueChange() {\n if (this.inputElement != null) {\n this.inputElement.value = this.value;\n }\n }\n\n componentDidLoad() {\n if (this.inputElement == null) return;\n\n this.eventListeners.add(this.inputElement, 'six-input-input', debounce(this.handleInputChange, this.debounce));\n this.eventListeners.add(this.inputElement, 'keydown', (event: Event) => {\n const keyboardEvent = event as KeyboardEvent;\n if (keyboardEvent.key === 'Enter') {\n // emit immediately\n this.handleInputChange();\n }\n });\n }\n\n disconnectedCallback() {\n this.eventListeners.removeAll();\n }\n\n render() {\n return (\n <div class=\"search-box\">\n <six-input\n ref={(el) => (this.inputElement = el)}\n placeholder={this.placeholder}\n value={this.value}\n disabled={this.disabled}\n clearable={this.clearable}\n >\n <six-icon class=\"search-box__icon\" slot=\"prefix\" size=\"small\" onClick={this.handleInputChange}>\n search\n </six-icon>\n </six-input>\n <slot />\n </div>\n );\n }\n}\n"],"mappings":"iIAAA,MAAMA,EAAoB,kN,MCoBbC,EAAc,M,oFAqBjBC,KAAAC,eAAiB,IAAIC,EAErBF,KAAAG,kBAAoB,KAC1B,GAAIH,KAAKI,cAAgB,KAAM,CAC7BJ,KAAKK,kBAAkBC,KAAK,CAAEC,MAAOP,KAAKI,aAAaG,O,4CApBvBC,E,cAGA,M,WAGH,G,eAGb,K,CAgBpB,iBAAAC,GACE,GAAIT,KAAKI,cAAgB,KAAM,CAC7BJ,KAAKI,aAAaG,MAAQP,KAAKO,K,EAInC,gBAAAG,GACE,GAAIV,KAAKI,cAAgB,KAAM,OAE/BJ,KAAKC,eAAeU,IAAIX,KAAKI,aAAc,kBAAmBQ,EAASZ,KAAKG,kBAAmBH,KAAKY,WACpGZ,KAAKC,eAAeU,IAAIX,KAAKI,aAAc,WAAYS,IACrD,MAAMC,EAAgBD,EACtB,GAAIC,EAAcC,MAAQ,QAAS,CAEjCf,KAAKG,mB,KAKX,oBAAAa,GACEhB,KAAKC,eAAegB,W,CAGtB,MAAAC,GACE,OACEC,EAAA,OAAKC,MAAM,cACTD,EAAA,aACEE,IAAMC,GAAQtB,KAAKI,aAAekB,EAClCC,YAAavB,KAAKuB,YAClBhB,MAAOP,KAAKO,MACZiB,SAAUxB,KAAKwB,SACfC,UAAWzB,KAAKyB,WAEhBN,EAAA,YAAUC,MAAM,mBAAmBM,KAAK,SAASC,KAAK,QAAQC,QAAS5B,KAAKG,mBAAiB,WAI/FgB,EAAA,a"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r,h as o}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r,h as o}from"./p-6153045b.js";const i=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{--height:16px;--track-color:var(--six-progress-track-color);--indicator-color:var(--six-progress-indicator-color);--label-color:var(--six-progress-label-color);display:block}.progress-bar{position:relative;background-color:var(--track-color);height:var(--height);border-radius:var(--sl-border-radius-pill);overflow:hidden}.progress-bar__indicator{height:100%;font-family:var(--six-font-sans);font-size:12px;font-weight:var(--six-font-weight-normal);background-color:var(--indicator-color);color:var(--label-color);text-align:center;line-height:var(--height);white-space:nowrap;overflow:hidden;transition:400ms width, 400ms background-color;user-select:none}.progress-bar--indeterminate .progress-bar__indicator{position:absolute;animation:indeterminate 2.5s infinite cubic-bezier(0.37, 0, 0.63, 1)}@keyframes indeterminate{0%{left:-50%;width:50%}75%,100%{left:100%;width:50%}}";const s=class{constructor(o){r(this,o);this.percentage=0;this.indeterminate=false}render(){return o("div",{part:"base",class:{"progress-bar":true,"progress-bar--indeterminate":this.indeterminate},role:"progressbar","aria-valuemin":"0","aria-valuemax":"100","aria-valuenow":this.indeterminate?null:this.percentage},o("div",{part:"indicator",class:"progress-bar__indicator",style:{width:`${this.percentage}%`}},!this.indeterminate&&o("span",{part:"label",class:"progress-bar__label"},o("slot",null))))}};s.style=i;export{s as six_progress_bar};
|
|
2
|
+
//# sourceMappingURL=p-3cc5addb.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["sixProgressBarCss","SixProgressBar","render","h","part","class","this","indeterminate","role","percentage","style","width"],"sources":["src/components/six-progress-bar/six-progress-bar.scss?tag=six-progress-bar&encapsulation=shadow","src/components/six-progress-bar/six-progress-bar.tsx"],"sourcesContent":["@import 'src/global/component';\n\n/**\n * @prop --height: The progress bar's height.\n * @prop --track-color: The track color.\n * @prop --indicator-color: The indicator color.\n * @prop --label-color: The label color.\n */\n:host {\n --height: 16px;\n --track-color: var(--six-progress-track-color);\n --indicator-color: var(--six-progress-indicator-color);\n --label-color: var(--six-progress-label-color);\n\n display: block;\n}\n\n.progress-bar {\n position: relative;\n background-color: var(--track-color);\n height: var(--height);\n border-radius: var(--sl-border-radius-pill);\n overflow: hidden;\n}\n\n.progress-bar__indicator {\n height: 100%;\n font-family: var(--six-font-sans);\n font-size: 12px;\n font-weight: var(--six-font-weight-normal);\n background-color: var(--indicator-color);\n color: var(--label-color);\n text-align: center;\n line-height: var(--height);\n white-space: nowrap;\n overflow: hidden;\n transition: 400ms width, 400ms background-color;\n user-select: none;\n}\n\n// Indeterminate\n.progress-bar--indeterminate .progress-bar__indicator {\n position: absolute;\n animation: indeterminate 2.5s infinite cubic-bezier(0.37, 0, 0.63, 1);\n}\n\n@keyframes indeterminate {\n 0% {\n left: -50%;\n width: 50%;\n }\n 75%,\n 100% {\n left: 100%;\n width: 50%;\n }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - A label to show inside the indicator.\n *\n * @part base - The component's base wrapper.\n * @part indicator - The progress bar indicator.\n * @part label - The progress bar label.\n */\n\n@Component({\n tag: 'six-progress-bar',\n styleUrl: 'six-progress-bar.scss',\n shadow: true,\n})\nexport class SixProgressBar {\n /** The progress bar's percentage, 0 to 100. */\n @Prop() percentage = 0;\n\n /** When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state. */\n @Prop() indeterminate = false;\n\n render() {\n return (\n <div\n part=\"base\"\n class={{\n 'progress-bar': true,\n 'progress-bar--indeterminate': this.indeterminate,\n }}\n role=\"progressbar\"\n aria-valuemin=\"0\"\n aria-valuemax=\"100\"\n aria-valuenow={this.indeterminate ? null : this.percentage}\n >\n <div\n part=\"indicator\"\n class=\"progress-bar__indicator\"\n style={{\n width: `${this.percentage}%`,\n }}\n >\n {!this.indeterminate && (\n <span part=\"label\" class=\"progress-bar__label\">\n <slot />\n </span>\n )}\n </div>\n </div>\n );\n }\n}\n"],"mappings":"sCAAA,MAAMA,EAAoB,29B,MCoBbC,EAAc,M,yCAEJ,E,mBAGG,K,CAExB,MAAAC,GACE,OACEC,EAAA,OACEC,KAAK,OACLC,MAAO,CACL,eAAgB,KAChB,8BAA+BC,KAAKC,eAEtCC,KAAK,cAAa,gBACJ,IAAG,gBACH,MAAK,gBACJF,KAAKC,cAAgB,KAAOD,KAAKG,YAEhDN,EAAA,OACEC,KAAK,YACLC,MAAM,0BACNK,MAAO,CACLC,MAAO,GAAGL,KAAKG,iBAGfH,KAAKC,eACLJ,EAAA,QAAMC,KAAK,QAAQC,MAAM,uBACvBF,EAAA,e"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as t,c as o,h as r,g as i}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as t,c as o,h as r,g as i}from"./p-6153045b.js";import{E as s}from"./p-7d95def3.js";import{F as e}from"./p-d42c2025.js";const l=':host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}.form-control .form-control__label{display:none}.form-control .form-control__help-text{display:none}.form-control .form-control__error-text{display:none}.form-control--has-label .form-control__label{display:inline-block;color:var(--six-input-label-color);font-weight:var(--six-font-weight-bold);margin-bottom:var(--six-spacing-x-small)}.form-control--has-label .form-control__label__required::after{color:var(--six-color-danger-800);content:"*"}.form-control--has-label.form-control--small .form-control__label{font-size:var(--six-input-label-font-size-small)}.form-control--has-label.form-control--medium .form-control__label{font-size:var(--six-input-label-font-size-medium)}.form-control--has-label.form-control--large .form-control_label{font-size:var(--six-input-label-font-size-large)}.form-control--has-help-text .form-control__help-text{display:block;color:var(--six-input-help-text-color);margin-top:var(--six-spacing-x-small)}.form-control--has-help-text .form-control__help-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-help-text.form-control--small .form-control__help-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-help-text.form-control--medium .form-control__help-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-help-text.form-control--large .form-control__help-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--has-error-text .form-control__error-text{display:block;color:var(--six-color-danger-800);margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text .form-control__error-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text.form-control--small .form-control__error-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-error-text.form-control--medium .form-control__error-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-error-text.form-control--large .form-control__error-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--disabled .form-control__help-text{color:var(--six-input-help-text-color-disabled)}.form-control--disabled .form-control__label{color:var(--six-input-label-color-disabled)}.form-control--invalid:not(.form-control--disabled) .form-control__label{color:var(--six-input-label-color)}:host{--height:var(--six-selection-control-toggle-size);--thumb-size:calc(var(--six-selection-control-toggle-size) - 4px);--width:calc(var(--height) * 2);display:inline-block}.switch{display:inline-flex;align-items:center;font-family:var(--six-font-family);font-size:var(--six-input-font-size-medium);font-weight:var(--six-input-font-weight);color:var(--six-input-color);vertical-align:middle;cursor:pointer}.switch__control{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--width);height:var(--height);background-color:var(--six-selection-control-color-disabled);border-radius:var(--height);transition:var(--six-transition-fast) border-color, var(--six-transition-fast) background-color}.switch__control .switch__thumb{width:var(--thumb-size);height:var(--thumb-size);background-color:var(--six-input-background-color);border-radius:50%;transform:translateX(calc(var(--width) / -2 + var(--thumb-size) / 2 - (var(--thumb-size) - var(--height)) / 2));transition:var(--six-transition-fast) transform ease, var(--six-transition-fast) background-color, var(--six-transition-fast) border-color, var(--six-transition-fast) box-shadow}.switch__control input[type=checkbox]{position:absolute;opacity:0;padding:0;margin:0;pointer-events:none}.switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover{background-color:var(--six-input-border-color-hover)}.switch--checked .switch__control{background-color:var(--six-selection-control-color)}.switch--checked .switch__control .switch__thumb{background-color:var(--six-color-white);transform:translateX(calc(var(--width) / 2 - var(--thumb-size) / 2 + (var(--thumb-size) - var(--height)) / 2))}.switch.switch--checked:not(.switch--disabled) .switch__control:hover{background-color:var(--six-input-border-color-focus)}.switch--disabled{cursor:not-allowed;color:var(--six-selection-control-color-disabled)}.switch--disabled .switch__control{background-color:var(--six-selection-control-color-disabled)}.switch--disabled.switch--checked .switch__control{background-color:var(--six-selection-control-color-disabled)}.switch__label{line-height:var(--height);margin-left:0.5em;user-select:none}';let a=0;const n=class{constructor(r){t(this,r);this.sixBlur=o(this,"six-switch-blur",7);this.sixChange=o(this,"six-switch-change",7);this.sixFocus=o(this,"six-switch-focus",7);this.switchId=`switch-${++a}`;this.labelId=`switch-label-${a}`;this.errorTextId=`input-error-text-${a}`;this.eventListeners=new s;this.handleClick=()=>{if(this.inputElement!=null){this.checked=this.inputElement.checked;this.sixChange.emit(this.checked)}};this.handleBlur=()=>{this.hasFocus=false;this.sixBlur.emit(this.checked)};this.handleFocus=()=>{this.hasFocus=true;this.sixFocus.emit()};this.handleKeyDown=t=>{if(t.key==="ArrowLeft"){t.preventDefault();this.checked=false;this.sixChange.emit(this.checked)}if(t.key==="ArrowRight"){t.preventDefault();this.checked=true;this.sixChange.emit(this.checked)}};this.handleMouseDown=t=>{var o;t.preventDefault();(o=this.inputElement)===null||o===void 0?void 0:o.focus()};this.hasFocus=false;this.name="";this.value="on";this.disabled=false;this.required=false;this.checked=false;this.label="";this.errorText="";this.invalid=false}handleCheckedChange(){if(this.inputElement!=null){this.inputElement.checked=this.checked;this.checked=this.inputElement.checked}}connectedCallback(){this.eventListeners.forward("six-switch-change","change",this.host);this.eventListeners.forward("six-switch-blur","blur",this.host);this.eventListeners.forward("six-switch-focus","focus",this.host)}disconnectedCallback(){this.eventListeners.removeAll()}async setFocus(t){var o;(o=this.inputElement)===null||o===void 0?void 0:o.focus(t)}async removeFocus(){var t;(t=this.inputElement)===null||t===void 0?void 0:t.blur()}render(){return r(e,{inputId:this.switchId,label:this.label,labelId:this.labelId,hasLabelSlot:false,errorTextId:this.errorTextId,errorText:this.errorText,size:"medium",disabled:this.disabled,required:this.required,displayError:this.invalid},r("label",{part:"base",htmlFor:this.switchId,class:{switch:true,"switch--checked":this.checked,"switch--disabled":this.disabled,"switch--focused":this.hasFocus},onMouseDown:this.handleMouseDown},r("span",{part:"control",class:"switch__control"},r("span",{part:"thumb",class:"switch__thumb"}),r("input",{ref:t=>this.inputElement=t,id:this.switchId,type:"checkbox",name:this.name,value:this.value,checked:this.checked,disabled:this.disabled,required:this.required,role:"switch","aria-checked":this.checked?"true":"false","aria-labelledby":this.labelId,onClick:this.handleClick,onBlur:this.handleBlur,onFocus:this.handleFocus,onKeyDown:this.handleKeyDown})),r("span",{part:"label",id:this.labelId,class:"switch__label"},r("slot",null))))}get host(){return i(this)}static get watchers(){return{checked:["handleCheckedChange"]}}};n.style=l;export{n as six_switch};
|
|
2
|
+
//# sourceMappingURL=p-3d9de119.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["sixSwitchCss","id","SixSwitch","this","switchId","labelId","errorTextId","eventListeners","EventListeners","handleClick","inputElement","checked","sixChange","emit","handleBlur","hasFocus","sixBlur","handleFocus","sixFocus","handleKeyDown","event","key","preventDefault","handleMouseDown","_a","focus","handleCheckedChange","connectedCallback","forward","host","disconnectedCallback","removeAll","setFocus","options","removeFocus","blur","render","h","FormControl","inputId","label","hasLabelSlot","errorText","size","disabled","required","displayError","invalid","part","htmlFor","class","switch","onMouseDown","ref","el","type","name","value","role","onClick","onBlur","onFocus","onKeyDown"],"sources":["src/components/six-switch/six-switch.scss?tag=six-switch&encapsulation=shadow","src/components/six-switch/six-switch.tsx"],"sourcesContent":["@import 'src/global/component';\n@import '../../functional-components/form-control/form-control';\n\n/**\n * @prop --width: The width of the switch.\n * @prop --height: The height of the switch.\n * @prop --thumb-size: The size of the thumb.\n */\n:host {\n --height: var(--six-selection-control-toggle-size);\n --thumb-size: calc(var(--six-selection-control-toggle-size) - 4px);\n --width: calc(var(--height) * 2);\n\n display: inline-block;\n}\n\n.switch {\n display: inline-flex;\n align-items: center;\n font-family: var(--six-font-family);\n font-size: var(--six-input-font-size-medium);\n font-weight: var(--six-input-font-weight);\n color: var(--six-input-color);\n vertical-align: middle;\n cursor: pointer;\n}\n\n.switch__control {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: var(--width);\n height: var(--height);\n background-color: var(--six-selection-control-color-disabled);\n border-radius: var(--height);\n transition: var(--six-transition-fast) border-color, var(--six-transition-fast) background-color;\n\n .switch__thumb {\n width: var(--thumb-size);\n height: var(--thumb-size);\n background-color: var(--six-input-background-color);\n border-radius: 50%;\n transform: translateX(calc(var(--width) / -2 + var(--thumb-size) / 2 - (var(--thumb-size) - var(--height)) / 2));\n transition: var(--six-transition-fast) transform ease, var(--six-transition-fast) background-color,\n var(--six-transition-fast) border-color, var(--six-transition-fast) box-shadow;\n }\n\n input[type='checkbox'] {\n position: absolute;\n opacity: 0;\n padding: 0;\n margin: 0;\n pointer-events: none;\n }\n}\n\n// Hover\n.switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {\n background-color: var(--six-input-border-color-hover);\n}\n\n// Checked\n.switch--checked .switch__control {\n background-color: var(--six-selection-control-color);\n\n .switch__thumb {\n background-color: var(--six-color-white);\n transform: translateX(calc(var(--width) / 2 - var(--thumb-size) / 2 + (var(--thumb-size) - var(--height)) / 2));\n }\n}\n\n// Checked + hover\n.switch.switch--checked:not(.switch--disabled) .switch__control:hover {\n background-color: var(--six-input-border-color-focus);\n}\n\n// Disabled\n.switch--disabled {\n cursor: not-allowed;\n color: var(--six-selection-control-color-disabled);\n\n .switch__control {\n background-color: var(--six-selection-control-color-disabled);\n }\n\n &.switch--checked .switch__control {\n background-color: var(--six-selection-control-color-disabled);\n }\n}\n\n.switch__label {\n line-height: var(--height);\n margin-left: 0.5em;\n user-select: none;\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\nimport FormControl from '../../functional-components/form-control/form-control';\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The switch's label.\n *\n * @part base - The component's base wrapper.\n * @part control - The switch control.\n * @part thumb - The switch position indicator.\n * @part label - The switch label.\n */\n\n@Component({\n tag: 'six-switch',\n styleUrl: 'six-switch.scss',\n shadow: true,\n})\nexport class SixSwitch {\n private switchId = `switch-${++id}`;\n private labelId = `switch-label-${id}`;\n private errorTextId = `input-error-text-${id}`;\n\n private inputElement?: HTMLInputElement;\n private eventListeners = new EventListeners();\n\n @Element() host!: HTMLSixSwitchElement;\n\n @State() hasFocus = false;\n\n /** The switch's name attribute. */\n @Prop() name = '';\n\n /** The switch's value attribute. */\n @Prop() value = 'on';\n\n /** Set to true to disable the switch. */\n @Prop() disabled = false;\n\n /** Set to true to show an asterisk beneath the label. */\n @Prop() required = false;\n\n /** Set to true to draw the switch in a checked state. */\n @Prop({ mutable: true, reflect: true }) checked = false;\n\n /** The label text. */\n @Prop() label = '';\n\n /** The error message shown, if `invalid` is set to true. */\n @Prop() errorText = '';\n\n /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed. */\n @Prop({ reflect: true }) invalid = false;\n\n @Watch('checked')\n handleCheckedChange() {\n if (this.inputElement != null) {\n this.inputElement.checked = this.checked;\n this.checked = this.inputElement.checked;\n }\n }\n\n /** Emitted when the control loses focus. */\n @Event({ eventName: 'six-switch-blur' }) sixBlur!: EventEmitter<boolean>;\n\n /** Emitted when the control's checked state changes. */\n @Event({ eventName: 'six-switch-change' }) sixChange!: EventEmitter<boolean>;\n\n /** Emitted when the control gains focus. */\n @Event({ eventName: 'six-switch-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n connectedCallback() {\n this.eventListeners.forward('six-switch-change', 'change', this.host);\n this.eventListeners.forward('six-switch-blur', 'blur', this.host);\n this.eventListeners.forward('six-switch-focus', 'focus', this.host);\n }\n\n disconnectedCallback() {\n this.eventListeners.removeAll();\n }\n\n /** Sets focus on the switch. */\n @Method()\n async setFocus(options?: FocusOptions) {\n this.inputElement?.focus(options);\n }\n\n /** Removes focus from the switch. */\n @Method()\n async removeFocus() {\n this.inputElement?.blur();\n }\n\n private handleClick = () => {\n if (this.inputElement != null) {\n this.checked = this.inputElement.checked;\n this.sixChange.emit(this.checked);\n }\n };\n\n private handleBlur = () => {\n this.hasFocus = false;\n this.sixBlur.emit(this.checked);\n };\n\n private handleFocus = () => {\n this.hasFocus = true;\n this.sixFocus.emit();\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'ArrowLeft') {\n event.preventDefault();\n this.checked = false;\n this.sixChange.emit(this.checked);\n }\n\n if (event.key === 'ArrowRight') {\n event.preventDefault();\n this.checked = true;\n this.sixChange.emit(this.checked);\n }\n };\n\n private handleMouseDown = (event: MouseEvent) => {\n // Prevent clicks on the label from briefly blurring the input\n event.preventDefault();\n this.inputElement?.focus();\n };\n\n render() {\n return (\n <FormControl\n inputId={this.switchId}\n label={this.label}\n labelId={this.labelId}\n hasLabelSlot={false}\n errorTextId={this.errorTextId}\n errorText={this.errorText}\n size=\"medium\"\n disabled={this.disabled}\n required={this.required}\n displayError={this.invalid}\n >\n <label\n part=\"base\"\n htmlFor={this.switchId}\n class={{\n switch: true,\n 'switch--checked': this.checked,\n 'switch--disabled': this.disabled,\n 'switch--focused': this.hasFocus,\n }}\n onMouseDown={this.handleMouseDown}\n >\n <span part=\"control\" class=\"switch__control\">\n <span part=\"thumb\" class=\"switch__thumb\" />\n\n <input\n ref={(el) => (this.inputElement = el)}\n id={this.switchId}\n type=\"checkbox\"\n name={this.name}\n value={this.value}\n checked={this.checked}\n disabled={this.disabled}\n required={this.required}\n role=\"switch\"\n aria-checked={this.checked ? 'true' : 'false'}\n aria-labelledby={this.labelId}\n onClick={this.handleClick}\n onBlur={this.handleBlur}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n />\n </span>\n\n <span part=\"label\" id={this.labelId} class=\"switch__label\">\n <slot />\n </span>\n </label>\n </FormControl>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as i,c as t,h as s,g as r}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as i,c as t,h as s,g as r}from"./p-6153045b.js";const e=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:contents;margin:0}.alert{position:relative;display:flex;align-items:stretch;background-color:var(--six-color-white);border:solid 1px var(--six-color-web-rock-200);border-top-width:3px;border-radius:var(--six-border-radius-medium);box-shadow:var(--box-shadow);font-family:var(--six-font-sans);font-size:var(--six-font-size-small);font-weight:var(--six-font-weight-normal);line-height:1.6;color:var(--six-color-web-rock-700);opacity:0;transform:scale(0.9);transition:var(--six-transition-medium) opacity ease, var(--six-transition-medium) transform ease;margin:inherit}.alert:not(.alert--visible){position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;pointer-events:none;visibility:hidden}.alert--open{opacity:1;transform:none}.alert__icon{flex:0 0 auto;display:flex;align-items:center;font-size:var(--six-font-size-large)}.alert__icon ::slotted(*){margin-left:var(--six-spacing-large)}.alert--primary{border-top-color:var(--six-color-web-rock-900)}.alert--primary .alert__icon{color:var(--six-color-web-rock-900)}.alert--success{border-top-color:var(--six-color-success-600)}.alert--success .alert__icon{color:var(--six-color-success-600)}.alert--info{border-top-color:var(--six-color-action-500)}.alert--info .alert__icon{color:var(--six-color-action-500)}.alert--warning{border-top-color:var(--six-color-warning-800)}.alert--warning .alert__icon{color:var(--six-color-warning-800)}.alert--danger{border-top-color:var(--six-color-danger-900)}.alert--danger .alert__icon{color:var(--six-color-danger-900)}.alert__message{flex:1 1 auto;padding:var(--six-spacing-large);overflow:hidden}.alert__close{flex:0 0 auto;display:flex;align-items:center;font-size:var(--six-font-size-large);padding-right:var(--six-spacing-medium)}";const a=Object.assign(document.createElement("div"),{className:"six-toast-stack"});const o=class{constructor(s){i(this,s);this.sixShow=t(this,"six-alert-show",7);this.sixAfterShow=t(this,"six-alert-after-show",7);this.sixHide=t(this,"six-alert-hide",7);this.sixAfterHide=t(this,"six-alert-after-hide",7);this.handleCloseClick=()=>{this.hide()};this.handleMouseMove=()=>{this.restartAutoHide()};this.handleTransitionEnd=i=>{const t=i.target;if(i.propertyName==="opacity"&&t.classList.contains("alert")){this.isVisible=this.open;this.open?this.sixAfterShow.emit():this.sixAfterHide.emit()}};this.isVisible=false;this.open=false;this.closable=false;this.type="primary";this.duration=Infinity}handleOpenChange(){this.open?this.show():this.hide()}handleDurationChange(){this.restartAutoHide()}componentWillLoad(){if(this.open){this.show()}}async show(){if(this.isVisible){return}const i=this.sixShow.emit();if(i.defaultPrevented){this.open=false;return}this.isVisible=true;this.open=true;if(this.duration<Infinity){this.autoHideTimeout=window.setTimeout((()=>this.hide()),this.duration)}}async hide(){if(!this.isVisible){return}const i=this.sixHide.emit();if(i.defaultPrevented){this.open=true;return}clearTimeout(this.autoHideTimeout);this.isVisible=false;this.open=false}async toast(){return new Promise((i=>{if(!a.parentElement){document.body.append(a)}a.append(this.host);requestAnimationFrame((()=>this.show()));this.host.addEventListener("six-alert-after-hide",(()=>{this.host.remove();i();if(a.querySelector("six-alert")===null){a.remove()}}),{once:true})}))}restartAutoHide(){clearTimeout(this.autoHideTimeout);if(this.open&&this.duration<Infinity){this.autoHideTimeout=window.setTimeout((()=>this.hide()),this.duration)}}render(){return s("div",{part:"base",class:{alert:true,"alert--open":this.open,"alert--visible":this.isVisible,"alert--closable":this.closable,"alert--primary":this.type==="primary","alert--success":this.type==="success","alert--info":this.type==="info","alert--warning":this.type==="warning","alert--danger":this.type==="danger"},role:"alert","aria-live":"assertive","aria-atomic":"true","aria-hidden":this.open?"false":"true",onMouseMove:this.handleMouseMove,onTransitionEnd:this.handleTransitionEnd},s("span",{part:"icon",class:"alert__icon"},s("slot",{name:"icon"})),s("span",{part:"message",class:"alert__message"},s("slot",null)),this.closable&&s("span",{class:"alert__close"},s("six-icon-button",{name:"clear",exportparts:"base:close-button",onClick:this.handleCloseClick})))}get host(){return r(this)}static get watchers(){return{open:["handleOpenChange"],duration:["handleDurationChange"]}}};o.style=e;export{o as six_alert};
|
|
2
|
+
//# sourceMappingURL=p-411ed539.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["sixAlertCss","toastStack","Object","assign","document","createElement","className","SixAlert","this","handleCloseClick","hide","handleMouseMove","restartAutoHide","handleTransitionEnd","event","target","propertyName","classList","contains","isVisible","open","sixAfterShow","emit","sixAfterHide","Infinity","handleOpenChange","show","handleDurationChange","componentWillLoad","sixShow","defaultPrevented","duration","autoHideTimeout","window","setTimeout","sixHide","clearTimeout","toast","Promise","resolve","parentElement","body","append","host","requestAnimationFrame","addEventListener","remove","querySelector","once","render","h","part","class","alert","closable","type","role","onMouseMove","onTransitionEnd","name","exportparts","onClick"],"sources":["src/components/six-alert/six-alert.scss?tag=six-alert&encapsulation=shadow","src/components/six-alert/six-alert.tsx"],"sourcesContent":["@import 'src/global/component';\n@import 'src/global/mixins/hidden';\n\n/**\n * @prop --box-shadow: The alert's box shadow.\n */\n:host {\n display: contents;\n\n // For better DX, we'll reset the margin here so the base part can inherit it\n margin: 0;\n}\n\n.alert {\n position: relative;\n display: flex;\n align-items: stretch;\n background-color: var(--six-color-white);\n border: solid 1px var(--six-color-web-rock-200);\n border-top-width: 3px;\n border-radius: var(--six-border-radius-medium);\n box-shadow: var(--box-shadow);\n font-family: var(--six-font-sans);\n font-size: var(--six-font-size-small);\n font-weight: var(--six-font-weight-normal);\n line-height: 1.6;\n color: var(--six-color-web-rock-700);\n opacity: 0;\n transform: scale(0.9);\n transition: var(--six-transition-medium) opacity ease, var(--six-transition-medium) transform ease;\n margin: inherit;\n\n &:not(.alert--visible) {\n @include hidden;\n }\n}\n\n.alert--open {\n opacity: 1;\n transform: none;\n}\n\n.alert__icon {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n font-size: var(--six-font-size-large);\n\n ::slotted(*) {\n margin-left: var(--six-spacing-large);\n }\n}\n\n.alert--primary {\n border-top-color: var(--six-color-web-rock-900);\n\n .alert__icon {\n color: var(--six-color-web-rock-900);\n }\n}\n\n.alert--success {\n border-top-color: var(--six-color-success-600);\n\n .alert__icon {\n color: var(--six-color-success-600);\n }\n}\n\n.alert--info {\n border-top-color: var(--six-color-action-500);\n\n .alert__icon {\n color: var(--six-color-action-500);\n }\n}\n\n.alert--warning {\n border-top-color: var(--six-color-warning-800);\n\n .alert__icon {\n color: var(--six-color-warning-800);\n }\n}\n\n.alert--danger {\n border-top-color: var(--six-color-danger-900);\n\n .alert__icon {\n color: var(--six-color-danger-900);\n }\n}\n\n.alert__message {\n flex: 1 1 auto;\n padding: var(--six-spacing-large);\n overflow: hidden;\n}\n\n.alert__close {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n font-size: var(--six-font-size-large);\n padding-right: var(--six-spacing-medium);\n}\n","import { Component, Element, Event, EventEmitter, Method, Prop, State, Watch, h } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\n\nconst toastStack = Object.assign(document.createElement('div'), { className: 'six-toast-stack' });\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The alert's content.\n * @slot icon - An icon to show in the alert.\n *\n * @part base - The component's base wrapper.\n * @part icon - The container that wraps the alert icon.\n * @part message - The alert message.\n * @part close-button - The close button.\n */\n\n@Component({\n tag: 'six-alert',\n styleUrl: 'six-alert.scss',\n shadow: true,\n})\nexport class SixAlert {\n private autoHideTimeout?: number;\n\n @Element() host!: HTMLSixAlertElement;\n\n @State() isVisible = false;\n\n /** Indicates whether or not the alert is open. You can use this in lieu of the show/hide methods. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n /** Set to true to make the alert closable. */\n @Prop({ reflect: true }) closable = false;\n\n /** The type of alert. */\n @Prop({ reflect: true }) type: 'primary' | 'success' | 'info' | 'warning' | 'danger' = 'primary';\n\n /**\n * The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with the\n * alert before it closes (e.g. moves the mouse over it), the timer will restart.\n */\n @Prop() duration = Infinity;\n\n @Watch('open')\n handleOpenChange() {\n this.open ? this.show() : this.hide();\n }\n\n @Watch('duration')\n handleDurationChange() {\n this.restartAutoHide();\n }\n\n /** Emitted when the alert opens. Calling `event.preventDefault()` will prevent it from being opened. */\n @Event({ eventName: 'six-alert-show' }) sixShow!: EventEmitter<EmptyPayload>;\n\n /** Emitted after the alert opens and all transitions are complete. */\n @Event({ eventName: 'six-alert-after-show' }) sixAfterShow!: EventEmitter<EmptyPayload>;\n\n /** Emitted when the alert closes. Calling `event.preventDefault()` will prevent it from being closed. */\n @Event({ eventName: 'six-alert-hide' }) sixHide!: EventEmitter<EmptyPayload>;\n\n /** Emitted after the alert closes and all transitions are complete. */\n @Event({ eventName: 'six-alert-after-hide' }) sixAfterHide!: EventEmitter<EmptyPayload>;\n\n componentWillLoad() {\n // Show on init if open\n if (this.open) {\n this.show();\n }\n }\n\n /** Shows the alert. */\n @Method()\n async show() {\n // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n if (this.isVisible) {\n return;\n }\n\n const sixShow = this.sixShow.emit();\n if (sixShow.defaultPrevented) {\n this.open = false;\n return;\n }\n\n this.isVisible = true;\n this.open = true;\n\n if (this.duration < Infinity) {\n this.autoHideTimeout = window.setTimeout(() => this.hide(), this.duration);\n }\n }\n\n /** Hides the alert */\n @Method()\n async hide() {\n // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n if (!this.isVisible) {\n return;\n }\n\n const sixHide = this.sixHide.emit();\n if (sixHide.defaultPrevented) {\n this.open = true;\n return;\n }\n\n clearTimeout(this.autoHideTimeout);\n this.isVisible = false;\n this.open = false;\n }\n\n /**\n * Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when\n * dismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by\n * calling this method again. The returned promise will resolve after the alert is hidden.\n */\n @Method()\n async toast() {\n return new Promise<void>((resolve) => {\n if (!toastStack.parentElement) {\n document.body.append(toastStack);\n }\n\n toastStack.append(this.host);\n requestAnimationFrame(() => this.show());\n\n this.host.addEventListener(\n 'six-alert-after-hide',\n () => {\n this.host.remove();\n resolve();\n\n // Remove the toast stack from the DOM when there are no more alerts\n if (toastStack.querySelector('six-alert') === null) {\n toastStack.remove();\n }\n },\n { once: true }\n );\n });\n }\n\n private handleCloseClick = () => {\n this.hide();\n };\n\n private handleMouseMove = () => {\n this.restartAutoHide();\n };\n\n private handleTransitionEnd = (event: TransitionEvent) => {\n const target = event.target as HTMLElement;\n\n // Ensure we only emit one event when the target element is no longer visible\n if (event.propertyName === 'opacity' && target.classList.contains('alert')) {\n this.isVisible = this.open;\n this.open ? this.sixAfterShow.emit() : this.sixAfterHide.emit();\n }\n };\n\n private restartAutoHide() {\n clearTimeout(this.autoHideTimeout);\n if (this.open && this.duration < Infinity) {\n this.autoHideTimeout = window.setTimeout(() => this.hide(), this.duration);\n }\n }\n\n render() {\n return (\n <div\n part=\"base\"\n class={{\n alert: true,\n 'alert--open': this.open,\n 'alert--visible': this.isVisible,\n 'alert--closable': this.closable,\n 'alert--primary': this.type === 'primary',\n 'alert--success': this.type === 'success',\n 'alert--info': this.type === 'info',\n 'alert--warning': this.type === 'warning',\n 'alert--danger': this.type === 'danger',\n }}\n role=\"alert\"\n aria-live=\"assertive\"\n aria-atomic=\"true\"\n aria-hidden={this.open ? 'false' : 'true'}\n onMouseMove={this.handleMouseMove}\n onTransitionEnd={this.handleTransitionEnd}\n >\n <span part=\"icon\" class=\"alert__icon\">\n <slot name=\"icon\" />\n </span>\n\n <span part=\"message\" class=\"alert__message\">\n <slot />\n </span>\n\n {this.closable && (\n <span class=\"alert__close\">\n <six-icon-button\n name=\"clear\"\n exportparts=\"base:close-button\"\n onClick={this.handleCloseClick}\n ></six-icon-button>\n </span>\n )}\n </div>\n );\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAc,w1DCGpB,MAAMC,EAAaC,OAAOC,OAAOC,SAASC,cAAc,OAAQ,CAAEC,UAAW,oB,MAsBhEC,EAAQ,M,+MA2HXC,KAAAC,iBAAmB,KACzBD,KAAKE,MAAM,EAGLF,KAAAG,gBAAkB,KACxBH,KAAKI,iBAAiB,EAGhBJ,KAAAK,oBAAuBC,IAC7B,MAAMC,EAASD,EAAMC,OAGrB,GAAID,EAAME,eAAiB,WAAaD,EAAOE,UAAUC,SAAS,SAAU,CAC1EV,KAAKW,UAAYX,KAAKY,KACtBZ,KAAKY,KAAOZ,KAAKa,aAAaC,OAASd,KAAKe,aAAaD,M,kBApIxC,M,UAG0B,M,cAGX,M,UAGmD,U,cAMpEE,Q,CAGnB,gBAAAC,GACEjB,KAAKY,KAAOZ,KAAKkB,OAASlB,KAAKE,M,CAIjC,oBAAAiB,GACEnB,KAAKI,iB,CAeP,iBAAAgB,GAEE,GAAIpB,KAAKY,KAAM,CACbZ,KAAKkB,M,EAMT,UAAMA,GAEJ,GAAIlB,KAAKW,UAAW,CAClB,M,CAGF,MAAMU,EAAUrB,KAAKqB,QAAQP,OAC7B,GAAIO,EAAQC,iBAAkB,CAC5BtB,KAAKY,KAAO,MACZ,M,CAGFZ,KAAKW,UAAY,KACjBX,KAAKY,KAAO,KAEZ,GAAIZ,KAAKuB,SAAWP,SAAU,CAC5BhB,KAAKwB,gBAAkBC,OAAOC,YAAW,IAAM1B,KAAKE,QAAQF,KAAKuB,S,EAMrE,UAAMrB,GAEJ,IAAKF,KAAKW,UAAW,CACnB,M,CAGF,MAAMgB,EAAU3B,KAAK2B,QAAQb,OAC7B,GAAIa,EAAQL,iBAAkB,CAC5BtB,KAAKY,KAAO,KACZ,M,CAGFgB,aAAa5B,KAAKwB,iBAClBxB,KAAKW,UAAY,MACjBX,KAAKY,KAAO,K,CASd,WAAMiB,GACJ,OAAO,IAAIC,SAAeC,IACxB,IAAKtC,EAAWuC,cAAe,CAC7BpC,SAASqC,KAAKC,OAAOzC,E,CAGvBA,EAAWyC,OAAOlC,KAAKmC,MACvBC,uBAAsB,IAAMpC,KAAKkB,SAEjClB,KAAKmC,KAAKE,iBACR,wBACA,KACErC,KAAKmC,KAAKG,SACVP,IAGA,GAAItC,EAAW8C,cAAc,eAAiB,KAAM,CAClD9C,EAAW6C,Q,IAGf,CAAEE,KAAM,MACT,G,CAsBG,eAAApC,GACNwB,aAAa5B,KAAKwB,iBAClB,GAAIxB,KAAKY,MAAQZ,KAAKuB,SAAWP,SAAU,CACzChB,KAAKwB,gBAAkBC,OAAOC,YAAW,IAAM1B,KAAKE,QAAQF,KAAKuB,S,EAIrE,MAAAkB,GACE,OACEC,EAAA,OACEC,KAAK,OACLC,MAAO,CACLC,MAAO,KACP,cAAe7C,KAAKY,KACpB,iBAAkBZ,KAAKW,UACvB,kBAAmBX,KAAK8C,SACxB,iBAAkB9C,KAAK+C,OAAS,UAChC,iBAAkB/C,KAAK+C,OAAS,UAChC,cAAe/C,KAAK+C,OAAS,OAC7B,iBAAkB/C,KAAK+C,OAAS,UAChC,gBAAiB/C,KAAK+C,OAAS,UAEjCC,KAAK,QAAO,YACF,YAAW,cACT,OAAM,cACLhD,KAAKY,KAAO,QAAU,OACnCqC,YAAajD,KAAKG,gBAClB+C,gBAAiBlD,KAAKK,qBAEtBqC,EAAA,QAAMC,KAAK,OAAOC,MAAM,eACtBF,EAAA,QAAMS,KAAK,UAGbT,EAAA,QAAMC,KAAK,UAAUC,MAAM,kBACzBF,EAAA,cAGD1C,KAAK8C,UACJJ,EAAA,QAAME,MAAM,gBACVF,EAAA,mBACES,KAAK,QACLC,YAAY,oBACZC,QAASrD,KAAKC,oB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as t,c as o,h as r,g as i}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as t,c as o,h as r,g as i}from"./p-6153045b.js";import{s,g as a}from"./p-1f18768a.js";import{f as e}from"./p-5654e4c7.js";const l=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{--tabs-border-color:var(--six-tab-border-color);display:block}.tab-group{display:flex;border:solid 1px transparent;border-radius:0}.tab-group .tab-group__tabs{display:flex;position:relative}.tab-group .tab-group__active-tab-indicator{position:absolute;transition:var(--six-transition-fast) transform ease, var(--six-transition-fast) width ease}.tab-group:not(.focus-visible) ::slotted(six-tab){--focus-ring:none}.tab-group--has-scroll-controls .tab-group__nav-container{position:relative;padding:0 var(--six-spacing-x-large)}.tab-group__scroll-button{display:flex;align-items:center;justify-content:center;position:absolute;top:0;bottom:0;width:var(--six-spacing-x-large)}.tab-group__scroll-button--left{left:0}.tab-group__scroll-button--right{right:0}.tab-group--top{flex-direction:column}.tab-group--top .tab-group__nav-container{order:1}.tab-group--top .tab-group__nav{display:flex;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.tab-group--top .tab-group__nav::-webkit-scrollbar{width:0;height:0}.tab-group--top .tab-group__tabs{flex:1 1 auto;position:relative;flex-direction:row;border-bottom:solid var(--six-tab-border-width) var(--tabs-border-color)}.tab-group--top .tab-group__active-tab-indicator{bottom:-2px;border-bottom:solid var(--six-tab-border-width-active) var(--six-tab-border-color-active)}.tab-group--top .tab-group__body{order:2}.tab-group--bottom{flex-direction:column}.tab-group--bottom .tab-group__nav-container{order:2}.tab-group--bottom .tab-group__nav{display:flex;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.tab-group--bottom .tab-group__nav::-webkit-scrollbar{width:0;height:0}.tab-group--bottom .tab-group__tabs{flex:1 1 auto;position:relative;flex-direction:row;border-top:solid var(--six-tab-border-width) var(--tabs-border-color)}.tab-group--bottom .tab-group__active-tab-indicator{top:-2px;border-top:solid var(--six-tab-border-width-active) var(--six-tab-border-color-active)}.tab-group--bottom .tab-group__body{order:1}.tab-group--left{flex-direction:row}.tab-group--left .tab-group__nav-container{order:1}.tab-group--left .tab-group__tabs{flex:0 0 auto;flex-direction:column;border-right:solid var(--six-tab-border-width) var(--tabs-border-color)}.tab-group--left .tab-group__active-tab-indicator{right:-2px;border-right:solid var(--six-tab-border-width-active) var(--six-tab-border-color-active)}.tab-group--left .tab-group__body{flex:1 1 auto;order:2}.tab-group--right{flex-direction:row}.tab-group--right .tab-group__nav-container{order:2}.tab-group--right .tab-group__tabs{flex:0 0 auto;flex-direction:column;border-left:solid var(--six-tab-border-width) var(--tabs-border-color)}.tab-group--right .tab-group__active-tab-indicator{left:-2px;border-left:solid var(--six-tab-border-width-active) var(--six-tab-border-color-active)}.tab-group--right .tab-group__body{flex:1 1 auto;order:1}";const n=class{constructor(r){t(this,r);this.sixTabShow=o(this,"six-tab-show",7);this.sixTabHide=o(this,"six-tab-hide",7);this.handleClick=t=>{const o=t.target;const r=o.closest("six-tab");const i=r===null||r===void 0?void 0:r.closest("six-tab-group");if(i!==this.host){return false}if(r!=null){this.setActiveTab(r)}};this.handleKeyDown=t=>{if(this.nav==null)return;const o=t.target;const r=o.closest("six-tab");const i=r===null||r===void 0?void 0:r.closest("six-tab-group");if(i!==this.host){return false}if(["Enter"," "].includes(t.key)){if(r!=null){this.setActiveTab(r);t.preventDefault()}}if(["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"].includes(t.key)){const o=document.activeElement;if(o&&o.tagName.toLowerCase()==="six-tab"){const r=this.getAllTabs();let i=r.indexOf(o);if(t.key==="Home"){i=0}else if(t.key==="End"){i=r.length-1}else if(t.key==="ArrowLeft"){i=Math.max(0,i-1)}else if(t.key==="ArrowRight"){i=Math.min(r.length-1,i+1)}r[i].setFocus({preventScroll:true});if(["top","bottom"].includes(this.placement)){s(r[i],this.nav,"horizontal")}t.preventDefault()}}};this.handleScrollLeft=()=>{if(this.nav==null)return;this.nav.scroll({left:this.nav.scrollLeft-this.nav.clientWidth,behavior:"smooth"})};this.handleScrollRight=()=>{if(this.nav==null)return;this.nav.scroll({left:this.nav.scrollLeft+this.nav.clientWidth,behavior:"smooth"})};this.syncActiveTabIndicator=()=>{if(this.activeTabIndicator==null||this.nav==null)return;const t=this.getActiveTab();if(t!=null){this.activeTabIndicator.style.display="block"}else{this.activeTabIndicator.style.display="none";return}const o=t.clientWidth;const r=t.clientHeight;const i=a(t,this.nav);const s=i.top+this.nav.scrollTop;const e=i.left+this.nav.scrollLeft;switch(this.placement){case"top":case"bottom":this.activeTabIndicator.style.width=`${o}px`;this.activeTabIndicator.style.height="";this.activeTabIndicator.style.transform=`translateX(${e}px)`;break;case"left":case"right":this.activeTabIndicator.style.width="";this.activeTabIndicator.style.height=`${r}px`;this.activeTabIndicator.style.transform=`translateY(${s}px)`;break}};this.hasScrollControls=false;this.placement="top";this.noScrollControls=false}handlePlacementChange(){this.syncActiveTabIndicator()}handleNoScrollControlsChange(){this.updateScrollControls()}componentDidLoad(){if(this.tabGroup==null||this.nav==null)return;const t=new IntersectionObserver(((t,o)=>{if(t[0].intersectionRatio>0){this.setAriaLabels();this.setActiveTab(this.getActiveTab()||this.getAllTabs()[0],false);o.unobserve(t[0].target)}}));t.observe(this.host);e.observe(this.tabGroup);this.resizeObserver=new ResizeObserver((()=>this.updateScrollControls()));this.resizeObserver.observe(this.nav);requestAnimationFrame((()=>this.updateScrollControls()));this.mutationObserver=new MutationObserver((t=>{if(t.some((t=>{var o;return!["aria-labelledby","aria-controls"].includes((o=t.attributeName)!==null&&o!==void 0?o:"")}))){setTimeout((()=>this.setAriaLabels()))}}));this.mutationObserver.observe(this.host,{attributes:true,childList:true,subtree:true})}disconnectedCallback(){if(this.mutationObserver==null||this.tabGroup==null||this.nav==null||this.resizeObserver==null){return}this.mutationObserver.disconnect();e.unobserve(this.tabGroup);this.resizeObserver.unobserve(this.nav)}async show(t){const o=this.getAllTabs();const r=o.find((o=>o.panel===t));if(r!=null){this.setActiveTab(r)}}getAllTabs(t=false){var o;const r=(o=this.tabs)===null||o===void 0?void 0:o.querySelector("slot");if(r==null)return[];return[...r.assignedElements()].filter((o=>t?o.tagName.toLowerCase()==="six-tab":o.tagName.toLowerCase()==="six-tab"&&!o.disabled))}getAllPanels(){var t;const o=(t=this.body)===null||t===void 0?void 0:t.querySelector("slot");if(o==null)return[];return[...o.assignedElements()].filter((t=>t.tagName.toLowerCase()==="six-tab-panel"))}getActiveTab(){return this.getAllTabs().find((t=>t.active))}updateScrollControls(){if(this.nav==null)return;this.hasScrollControls=this.noScrollControls?false:["top","bottom"].includes(this.placement)&&this.nav.scrollWidth>this.nav.clientWidth}setActiveTab(t,o=true){if(this.nav==null)return;if(t!=null&&t!==this.activeTab&&!t.disabled){const r=this.activeTab;this.activeTab=t;this.getAllTabs().map((t=>t.active=t===this.activeTab));this.getAllPanels().map((t=>{var o;return t.active=t.name===((o=this.activeTab)===null||o===void 0?void 0:o.panel)}));this.syncActiveTabIndicator();if(["top","bottom"].includes(this.placement)){s(this.activeTab,this.nav,"horizontal")}if(o){if(r!=null){this.sixTabHide.emit({name:r.panel})}this.sixTabShow.emit({name:this.activeTab.panel})}}}setAriaLabels(){const t=this.getAllTabs();const o=this.getAllPanels();t.map((t=>{var r,i;const s=o.find((o=>o.name===t.panel));if(s!=null){t.setAttribute("aria-controls",(r=s.getAttribute("id"))!==null&&r!==void 0?r:"");s.setAttribute("aria-labelledby",(i=t.getAttribute("id"))!==null&&i!==void 0?i:"")}}))}render(){return r("div",{part:"base",ref:t=>this.tabGroup=t,class:{"tab-group":true,"tab-group--top":this.placement==="top","tab-group--bottom":this.placement==="bottom","tab-group--left":this.placement==="left","tab-group--right":this.placement==="right","tab-group--has-scroll-controls":this.hasScrollControls},onClick:this.handleClick,onKeyDown:this.handleKeyDown},r("div",{class:"tab-group__nav-container"},this.hasScrollControls&&r("six-icon-button",{class:"tab-group__scroll-button tab-group__scroll-button--left",exportparts:"base:scroll-button",name:"chevron_left",onClick:this.handleScrollLeft}),r("div",{ref:t=>this.nav=t,key:"nav",part:"nav",class:"tab-group__nav"},r("div",{ref:t=>this.tabs=t,part:"tabs",class:"tab-group__tabs",role:"tablist"},r("div",{ref:t=>this.activeTabIndicator=t,part:"active-tab-indicator",class:"tab-group__active-tab-indicator"}),r("slot",{name:"nav",onSlotchange:this.syncActiveTabIndicator}))),this.hasScrollControls&&r("six-icon-button",{class:"tab-group__scroll-button tab-group__scroll-button--right",exportparts:"base:scroll-button",name:"chevron_right",onClick:this.handleScrollRight})),r("div",{ref:t=>this.body=t,part:"body",class:"tab-group__body"},r("slot",{onSlotchange:this.syncActiveTabIndicator})))}get host(){return i(this)}static get watchers(){return{placement:["handlePlacementChange"],noScrollControls:["handleNoScrollControlsChange"]}}};n.style=l;export{n as six_tab_group};
|
|
2
|
+
//# sourceMappingURL=p-4705a51e.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["sixTabGroupCss","SixTabGroup","this","handleClick","event","target","tab","closest","tabGroup","host","setActiveTab","handleKeyDown","nav","includes","key","preventDefault","activeEl","document","activeElement","tagName","toLowerCase","tabs","getAllTabs","index","indexOf","length","Math","max","min","setFocus","preventScroll","placement","scrollIntoView","handleScrollLeft","scroll","left","scrollLeft","clientWidth","behavior","handleScrollRight","syncActiveTabIndicator","activeTabIndicator","getActiveTab","style","display","width","height","clientHeight","offset","getOffset","offsetTop","top","scrollTop","offsetLeft","transform","handlePlacementChange","handleNoScrollControlsChange","updateScrollControls","componentDidLoad","observer","IntersectionObserver","entries","intersectionRatio","setAriaLabels","unobserve","observe","focusVisible","resizeObserver","ResizeObserver","requestAnimationFrame","mutationObserver","MutationObserver","mutations","some","mutation","_a","attributeName","setTimeout","attributes","childList","subtree","disconnectedCallback","disconnect","show","panel","find","el","includeDisabled","slot","querySelector","assignedElements","filter","disabled","getAllPanels","body","active","hasScrollControls","noScrollControls","scrollWidth","emitEvents","activeTab","previousTab","map","name","sixTabHide","emit","sixTabShow","panels","setAttribute","getAttribute","_b","render","h","part","ref","class","onClick","onKeyDown","exportparts","role","onSlotchange"],"sources":["src/components/six-tab-group/six-tab-group.scss?tag=six-tab-group&encapsulation=shadow","src/components/six-tab-group/six-tab-group.tsx"],"sourcesContent":["@import 'src/global/component';\n@import 'src/global/mixins/hide-scrollbar';\n\n/**\n * @prop --tabs-border-color: The color of the border that separates tabs.\n */\n:host {\n --tabs-border-color: var(--six-tab-border-color);\n display: block;\n}\n\n.tab-group {\n display: flex;\n border: solid 1px transparent;\n border-radius: 0;\n\n .tab-group__tabs {\n display: flex;\n position: relative;\n }\n\n .tab-group__active-tab-indicator {\n position: absolute;\n transition: var(--six-transition-fast) transform ease, var(--six-transition-fast) width ease;\n }\n\n // Remove the focus ring when the user isn't interacting with a keyboard\n &:not(.focus-visible) ::slotted(six-tab) {\n --focus-ring: none;\n }\n}\n\n.tab-group--has-scroll-controls .tab-group__nav-container {\n position: relative;\n padding: 0 var(--six-spacing-x-large);\n}\n\n.tab-group__scroll-button {\n display: flex;\n align-items: center;\n justify-content: center;\n position: absolute;\n top: 0;\n bottom: 0;\n width: var(--six-spacing-x-large);\n}\n\n.tab-group__scroll-button--left {\n left: 0;\n}\n\n.tab-group__scroll-button--right {\n right: 0;\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Top\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.tab-group--top {\n flex-direction: column;\n\n .tab-group__nav-container {\n order: 1;\n }\n\n .tab-group__nav {\n display: flex;\n overflow-x: auto;\n @include hide-scrollbar();\n }\n\n .tab-group__tabs {\n flex: 1 1 auto;\n position: relative;\n flex-direction: row;\n border-bottom: solid var(--six-tab-border-width) var(--tabs-border-color);\n }\n\n .tab-group__active-tab-indicator {\n bottom: -2px;\n border-bottom: solid var(--six-tab-border-width-active) var(--six-tab-border-color-active);\n }\n\n .tab-group__body {\n order: 2;\n }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Bottom\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.tab-group--bottom {\n flex-direction: column;\n\n .tab-group__nav-container {\n order: 2;\n }\n\n .tab-group__nav {\n display: flex;\n overflow-x: auto;\n @include hide-scrollbar();\n }\n\n .tab-group__tabs {\n flex: 1 1 auto;\n position: relative;\n flex-direction: row;\n border-top: solid var(--six-tab-border-width) var(--tabs-border-color);\n }\n\n .tab-group__active-tab-indicator {\n top: calc(-1 * 2px);\n border-top: solid var(--six-tab-border-width-active) var(--six-tab-border-color-active);\n }\n\n .tab-group__body {\n order: 1;\n }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Left\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.tab-group--left {\n flex-direction: row;\n\n .tab-group__nav-container {\n order: 1;\n }\n\n .tab-group__tabs {\n flex: 0 0 auto;\n flex-direction: column;\n border-right: solid var(--six-tab-border-width) var(--tabs-border-color);\n }\n\n .tab-group__active-tab-indicator {\n right: calc(-1 * 2px);\n border-right: solid var(--six-tab-border-width-active) var(--six-tab-border-color-active);\n }\n\n .tab-group__body {\n flex: 1 1 auto;\n order: 2;\n }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Right\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.tab-group--right {\n flex-direction: row;\n\n .tab-group__nav-container {\n order: 2;\n }\n\n .tab-group__tabs {\n flex: 0 0 auto;\n flex-direction: column;\n border-left: solid var(--six-tab-border-width) var(--tabs-border-color);\n }\n\n .tab-group__active-tab-indicator {\n left: calc(-1 * 2px);\n border-left: solid var(--six-tab-border-width-active) var(--six-tab-border-color-active);\n }\n\n .tab-group__body {\n flex: 1 1 auto;\n order: 1;\n }\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { getOffset } from '../../utils/offset';\nimport { scrollIntoView } from '../../utils/scroll';\nimport { focusVisible } from '../../utils/focus-visible';\n\nexport interface SixTabShowPayload {\n name: string;\n}\n\nexport interface SixTabHidePayload {\n name: string;\n}\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot nav - Used for grouping tabs in the tab group.\n * @slot - Used for grouping tab panels in the tab group.\n *\n * @part base - The component's base wrapper.\n * @part nav - The tab group navigation container.\n * @part tabs - The container that wraps the slotted tabs.\n * @part active-tab-indicator - An element that displays the currently selected tab. This is a child of the tab's container.\n * @part body - The tab group body where tab panels are slotted in.\n * @part scroll-button - The previous and next scroll buttons that appear when tabs are scrollable.\n */\n@Component({\n tag: 'six-tab-group',\n styleUrl: 'six-tab-group.scss',\n shadow: true,\n})\nexport class SixTabGroup {\n private activeTab?: HTMLSixTabElement;\n private activeTabIndicator?: HTMLElement;\n private body?: HTMLElement;\n private mutationObserver?: MutationObserver;\n private nav?: HTMLElement;\n private resizeObserver?: ResizeObserver;\n private tabGroup?: HTMLElement;\n private tabs?: HTMLElement;\n\n @Element() host!: HTMLSixTabGroupElement;\n\n @State() hasScrollControls = false;\n\n /** The placement of the tabs. */\n @Prop() placement: 'top' | 'bottom' | 'left' | 'right' = 'top';\n\n /** Disables the scroll arrows that appear when tabs overflow. */\n @Prop() noScrollControls = false;\n\n @Watch('placement')\n handlePlacementChange() {\n this.syncActiveTabIndicator();\n }\n\n @Watch('noScrollControls')\n handleNoScrollControlsChange() {\n this.updateScrollControls();\n }\n\n /** Emitted when a tab is shown. */\n @Event({ eventName: 'six-tab-show' }) sixTabShow!: EventEmitter<SixTabShowPayload>;\n\n /** Emitted when a tab is hidden. */\n @Event({ eventName: 'six-tab-hide' }) sixTabHide!: EventEmitter<SixTabHidePayload>;\n\n componentDidLoad() {\n if (this.tabGroup == null || this.nav == null) return;\n\n // Set initial tab state when the tabs first become visible\n const observer = new IntersectionObserver((entries, observer) => {\n if (entries[0].intersectionRatio > 0) {\n this.setAriaLabels();\n this.setActiveTab(this.getActiveTab() || this.getAllTabs()[0], false);\n observer.unobserve(entries[0].target);\n }\n });\n observer.observe(this.host);\n\n focusVisible.observe(this.tabGroup);\n\n this.resizeObserver = new ResizeObserver(() => this.updateScrollControls());\n this.resizeObserver.observe(this.nav);\n requestAnimationFrame(() => this.updateScrollControls());\n\n // Update aria labels if the DOM changes\n this.mutationObserver = new MutationObserver((mutations) => {\n if (\n mutations.some((mutation) => {\n return !['aria-labelledby', 'aria-controls'].includes(mutation.attributeName ?? '');\n })\n ) {\n setTimeout(() => this.setAriaLabels());\n }\n });\n this.mutationObserver.observe(this.host, { attributes: true, childList: true, subtree: true });\n }\n\n disconnectedCallback() {\n if (this.mutationObserver == null || this.tabGroup == null || this.nav == null || this.resizeObserver == null) {\n return;\n }\n\n this.mutationObserver.disconnect();\n focusVisible.unobserve(this.tabGroup);\n this.resizeObserver.unobserve(this.nav);\n }\n\n /** Shows the specified tab panel. */\n @Method()\n async show(panel: string) {\n const tabs = this.getAllTabs();\n const tab = tabs.find((el) => el.panel === panel);\n\n if (tab != null) {\n this.setActiveTab(tab);\n }\n }\n\n private getAllTabs(includeDisabled = false): HTMLSixTabElement[] {\n const slot = this.tabs?.querySelector('slot');\n if (slot == null) return [];\n\n return [...slot.assignedElements()].filter((el: Element) => {\n return includeDisabled\n ? el.tagName.toLowerCase() === 'six-tab'\n : el.tagName.toLowerCase() === 'six-tab' && !(el as HTMLSixTabElement).disabled;\n }) as [HTMLSixTabElement];\n }\n\n private getAllPanels(): HTMLSixTabPanelElement[] {\n const slot = this.body?.querySelector('slot');\n if (slot == null) return [];\n return [...slot.assignedElements()].filter((el: Element) => el.tagName.toLowerCase() === 'six-tab-panel') as [\n HTMLSixTabPanelElement\n ];\n }\n\n private getActiveTab() {\n return this.getAllTabs().find((el) => el.active);\n }\n\n private handleClick = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n const tab = target.closest('six-tab');\n const tabGroup = tab?.closest('six-tab-group');\n\n // Ensure the target tab is in this tab group\n if (tabGroup !== this.host) {\n return false;\n }\n\n if (tab != null) {\n this.setActiveTab(tab);\n }\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (this.nav == null) return;\n\n const target = event.target as HTMLElement;\n const tab = target.closest('six-tab');\n const tabGroup = tab?.closest('six-tab-group');\n\n // Ensure the target tab is in this tab group\n if (tabGroup !== this.host) {\n return false;\n }\n\n // Activate a tab\n if (['Enter', ' '].includes(event.key)) {\n if (tab != null) {\n this.setActiveTab(tab);\n event.preventDefault();\n }\n }\n\n // Move focus left or right\n if (['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Home', 'End'].includes(event.key)) {\n const activeEl = document.activeElement as HTMLSixTabElement;\n\n if (activeEl && activeEl.tagName.toLowerCase() === 'six-tab') {\n const tabs = this.getAllTabs();\n let index = tabs.indexOf(activeEl);\n\n if (event.key === 'Home') {\n index = 0;\n } else if (event.key === 'End') {\n index = tabs.length - 1;\n } else if (event.key === 'ArrowLeft') {\n index = Math.max(0, index - 1);\n } else if (event.key === 'ArrowRight') {\n index = Math.min(tabs.length - 1, index + 1);\n }\n\n tabs[index].setFocus({ preventScroll: true });\n\n if (['top', 'bottom'].includes(this.placement)) {\n scrollIntoView(tabs[index], this.nav, 'horizontal');\n }\n\n event.preventDefault();\n }\n }\n };\n\n private handleScrollLeft = () => {\n if (this.nav == null) return;\n\n this.nav.scroll({\n left: this.nav.scrollLeft - this.nav.clientWidth,\n behavior: 'smooth',\n });\n };\n\n private handleScrollRight = () => {\n if (this.nav == null) return;\n\n this.nav.scroll({\n left: this.nav.scrollLeft + this.nav.clientWidth,\n behavior: 'smooth',\n });\n };\n\n private updateScrollControls() {\n if (this.nav == null) return;\n\n this.hasScrollControls = this.noScrollControls\n ? false\n : ['top', 'bottom'].includes(this.placement) && this.nav.scrollWidth > this.nav.clientWidth;\n }\n\n private setActiveTab(tab: HTMLSixTabElement, emitEvents = true) {\n if (this.nav == null) return;\n\n if (tab != null && tab !== this.activeTab && !tab.disabled) {\n const previousTab = this.activeTab;\n this.activeTab = tab;\n\n // Sync tabs and panels\n this.getAllTabs().map((el) => (el.active = el === this.activeTab));\n this.getAllPanels().map((el) => (el.active = el.name === this.activeTab?.panel));\n this.syncActiveTabIndicator();\n\n if (['top', 'bottom'].includes(this.placement)) {\n scrollIntoView(this.activeTab, this.nav, 'horizontal');\n }\n\n // Emit events\n if (emitEvents) {\n if (previousTab != null) {\n this.sixTabHide.emit({ name: previousTab.panel });\n }\n\n this.sixTabShow.emit({ name: this.activeTab.panel });\n }\n }\n }\n\n private setAriaLabels() {\n const tabs = this.getAllTabs();\n const panels = this.getAllPanels();\n\n // Link each tab with its corresponding panel\n tabs.map((tab) => {\n const panel = panels.find((el) => el.name === tab.panel);\n if (panel != null) {\n tab.setAttribute('aria-controls', panel.getAttribute('id') ?? '');\n panel.setAttribute('aria-labelledby', tab.getAttribute('id') ?? '');\n }\n });\n }\n\n private syncActiveTabIndicator = () => {\n if (this.activeTabIndicator == null || this.nav == null) return;\n\n const tab = this.getActiveTab();\n\n if (tab != null) {\n this.activeTabIndicator.style.display = 'block';\n } else {\n this.activeTabIndicator.style.display = 'none';\n return;\n }\n\n const width = tab.clientWidth;\n const height = tab.clientHeight;\n const offset = getOffset(tab, this.nav);\n const offsetTop = offset.top + this.nav.scrollTop;\n const offsetLeft = offset.left + this.nav.scrollLeft;\n\n switch (this.placement) {\n case 'top':\n case 'bottom':\n this.activeTabIndicator.style.width = `${width}px`;\n this.activeTabIndicator.style.height = '';\n this.activeTabIndicator.style.transform = `translateX(${offsetLeft}px)`;\n break;\n\n case 'left':\n case 'right':\n this.activeTabIndicator.style.width = '';\n this.activeTabIndicator.style.height = `${height}px`;\n this.activeTabIndicator.style.transform = `translateY(${offsetTop}px)`;\n break;\n }\n };\n\n render() {\n return (\n <div\n part=\"base\"\n ref={(el) => (this.tabGroup = el)}\n class={{\n 'tab-group': true,\n\n // Placements\n 'tab-group--top': this.placement === 'top',\n 'tab-group--bottom': this.placement === 'bottom',\n 'tab-group--left': this.placement === 'left',\n 'tab-group--right': this.placement === 'right',\n\n 'tab-group--has-scroll-controls': this.hasScrollControls,\n }}\n onClick={this.handleClick}\n onKeyDown={this.handleKeyDown}\n >\n <div class=\"tab-group__nav-container\">\n {this.hasScrollControls && (\n <six-icon-button\n class=\"tab-group__scroll-button tab-group__scroll-button--left\"\n exportparts=\"base:scroll-button\"\n name=\"chevron_left\"\n onClick={this.handleScrollLeft}\n />\n )}\n <div ref={(el) => (this.nav = el)} key=\"nav\" part=\"nav\" class=\"tab-group__nav\">\n <div ref={(el) => (this.tabs = el)} part=\"tabs\" class=\"tab-group__tabs\" role=\"tablist\">\n <div\n ref={(el) => (this.activeTabIndicator = el)}\n part=\"active-tab-indicator\"\n class=\"tab-group__active-tab-indicator\"\n />\n <slot name=\"nav\" onSlotchange={this.syncActiveTabIndicator} />\n </div>\n </div>\n {this.hasScrollControls && (\n <six-icon-button\n class=\"tab-group__scroll-button tab-group__scroll-button--right\"\n exportparts=\"base:scroll-button\"\n name=\"chevron_right\"\n onClick={this.handleScrollRight}\n />\n )}\n </div>\n\n <div ref={(el) => (this.body = el)} part=\"body\" class=\"tab-group__body\">\n <slot onSlotchange={this.syncActiveTabIndicator} />\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as i,c as t,h as s,g as e}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as i,c as t,h as s,g as e}from"./p-6153045b.js";import{I as r}from"./p-0f510624.js";import{D as n,b as o,a as h}from"./p-698bb2c8.js";import{E as a}from"./p-7d95def3.js";import{h as c}from"./p-15559d38.js";import{a as l,m as p}from"./p-59210f0b.js";const u=()=>{const i=new Date;return{hours:i.getHours(),minutes:i.getMinutes(),seconds:i.getSeconds(),milliseconds:i.getMilliseconds(),has24Hours:true}};const m=12;const d=i=>i>m?i-m:i;const f=()=>{const i=new Date;const t=i.getHours();return{hours:d(t),minutes:i.getMinutes(),seconds:i.getSeconds(),milliseconds:i.getMilliseconds(),has24Hours:false,period:t>=m?"PM":"AM"}};const g=(i=true)=>i?u():f();const x=(i,t)=>{const s=i.split(":");const e=t.split(":");return s.length===e.length};const k=(i,t)=>{const s=i.split(":");const e=t.split(":");if(!x(i,t)){console.error(`Timestring did not match expected format.\nExpected format: ${t}\nReceived timestring: ${i}`)}const r={};s.forEach(((i,t)=>{const s=e[t];switch(s){case"HH":r.hours=Number(i);r.has24Hours=true;break;case"hh":r.hours=Number(i);r.has24Hours=false;break;case"mm":r.minutes=Number(i);break;case"ss":r.seconds=Number(i);break;case"ms":r.milliseconds=Number(i);break;case"aa":r.period=i.toUpperCase()==="PM"?"PM":"AM"}}));return r};const b=(i,t)=>{if(i==null){return""}const s=t.split(":");return s.map((t=>{switch(t){case"HH":case"hh":return String(i.hours).padStart(2,"0");case"mm":return String(i.minutes).padStart(2,"0");case"ss":return String(i.seconds).padStart(2,"0");case"ms":return String(i.milliseconds).padStart(3,"0");case"aa":return String(i.period)}})).join(":")};const v=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:block;font-family:var(--six-font-family)}.timepicker_clear{display:inline-flex;align-items:center;font-size:inherit;color:var(--six-input-icon-color);border:none;background:none;padding:0;transition:var(--six-transition-fast) color;cursor:pointer}.timepicker_clear:hover{color:var(--six-input-icon-color-hover)}.timepicker_clear:focus{outline:none}.timepicker_clear--right{right:0;position:absolute}.timepicker_clear--left{right:35px;position:absolute}.timepicker__container{position:relative}.timepicker__popup{display:flex;justify-content:center;min-width:min-content;min-height:145px;background-color:white;padding:0.5em 0.5em 1.5em;box-shadow:0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);user-select:none;position:absolute;z-index:var(--six-z-index-dropdown);right:0;left:0}.timepicker__popup--is-up{bottom:100%}.timepicker__popup--is-inline{position:initial;box-shadow:none;border:1px solid var(--six-color-web-rock-400)}.timepicker__separator{display:flex;align-items:center}.timepicker__item--wide{padding-left:0.5rem;padding-right:0.5rem}.input--empty .timepicker_clear{visibility:hidden}.input--hide{display:none}.prefix{cursor:pointer}.prefix--right{right:0;display:inline-flex;position:absolute;font-size:inherit;color:var(--six-input-icon-color);border:none;background:none;margin-right:var(--six-input-spacing-medium);transition:var(--six-transition-fast) color}";const _=145;const y=class{constructor(s){i(this,s);this.sixChange=t(this,"six-timepicker-change",7);this.sixChangeDebounced=t(this,"six-timepicker-change-debounced",7);this.sixClear=t(this,"six-timepicker-clear",7);this.eventListeners=new a;this.handlePickerChange=(i,t)=>{i.stopPropagation();if(this.popupValue==null){return}this.popupValue[t]=i.detail;const s=b(this.popupValue,this.format);this.value=s;this.sixChange.emit({changedProperty:t,value:this.popupValue,valueAsString:s})};this.handleDocumentMouseDown=i=>{const t=i.composedPath();if(!t.includes(this.host)){this.closePopup();return}};this.handleClearClick=i=>{i.stopPropagation();this.value="";this.sixClear.emit();this.sixChange.emit({value:{},valueAsString:""})};this.format="HH:mm:ss";this.separator=":";this.value="";this.open=false;this.inline=false;this.readonly=false;this.disabled=false;this.placement=undefined;this.size="medium";this.required=false;this.placeholder=undefined;this.errorText="";this.label="";this.invalid=false;this.name="";this.clearable=false;this.iconPosition="left";this.hoist=false;this.timeout=n;this.interval=o;this.defaultTime=undefined;this.debounce=n;this.isPopupContentUp=false;this.isDropDownContentUp=false;this.popupValue={}}async resizeHandler(){this.calcIsPopupContentUp();this.moveOpenHoistedPopup()}async scrollHandler(){this.calcIsPopupContentUp();this.moveOpenHoistedPopup()}valueChanged(){this.updateValue()}invalidChanged(i){if(this.inputElement){this.inputElement.invalid=i}}async setFocus(i){var t;(t=this.inputElement)===null||t===void 0?void 0:t.setFocus(i)}connectedCallback(){this.eventListeners.forward("six-timepicker-change","change",this.host)}componentWillLoad(){this.updateValue();if(this.inline){this.open=true}if(this.open){this.eventListeners.add(document,"mousedown",this.handleDocumentMouseDown)}}componentDidLoad(){if(this.inputElement==null)return;const i=this.inputElement;this.eventListeners.add(this.host,"six-timepicker-change",h((i=>this.sixChangeDebounced.emit(i.detail)),this.debounce));this.eventListeners.add(i,"six-input-input",h((t=>{t.stopPropagation();if(!x(i.value,this.format)){this.value=i.value;this.sixChange.emit({value:{},valueAsString:""});return}this.value=i.value;this.popupValue=k(i.value,this.format);this.sixChange.emit({value:this.popupValue,valueAsString:b(this.popupValue,this.format)})}),this.debounce))}componentDidRender(){l(this.hoist,this.popup,this.inputElement,this.wrapper,_,(i=>this.isDropDownContentUp=i))}disconnectedCallback(){this.eventListeners.removeAll()}updateValue(){if(typeof this.value!=="string"||!x(this.value,this.format)){this.value=""}if(this.value===""){if(this.defaultTime==null){this.popupValue=g(this.is24HourClock())}else{this.popupValue=k(this.defaultTime,this.format)}}else{this.popupValue=k(this.value,this.format)}}calcIsPopupContentUp(){if(this.inputElement==null||this.wrapper==null){return}const i=this.inputElement.getBoundingClientRect();const t=this.wrapper.getBoundingClientRect();const s=Math.max(t.height,_);const e=i.y>window.innerHeight/2;this.isPopupContentUp=e&&window.innerHeight<i.bottom+s}moveOpenHoistedPopup(){p(this.hoist,this.open,this.popup,this.inputElement,this.wrapper,_)}getSixTimeUnitPicker(i){return s("six-item-picker",{class:i.class,timeout:this.timeout,interval:this.interval,padded:true,min:i.min,max:i.max,value:this.popupValue[i.propertyName],items:i.items,type:i.type||r.NUMBER,"padding-length":i.paddingLength,"onSix-item-picker-change":t=>this.handlePickerChange(t,i.propertyName)})}getHour24Picker(){if(!this.is24HourClock()){return}return this.getSixTimeUnitPicker({min:0,max:23,propertyName:"hours"})}is24HourClock(){return this.format.includes("HH")}getHour12Picker(){if(!this.is12HourClock()){return}return this.getSixTimeUnitPicker({min:0,max:11,propertyName:"hours"})}is12HourClock(){return this.format.includes("hh")}getAmPmPicker(){if(!this.is12HourClock()){return}const i=["AM","PM"];return this.getSixTimeUnitPicker({items:i,type:r.CUSTOM,propertyName:"period"})}getMinutePicker(){if(!this.format.includes("mm")){return}return this.getSixTimeUnitPicker({min:0,max:59,propertyName:"minutes"})}getSecondsPicker(){if(!this.format.includes("ss")){return}return this.getSixTimeUnitPicker({min:0,max:59,propertyName:"seconds"})}getMillisecondsPicker(){if(!this.format.includes("ms")){return}return this.getSixTimeUnitPicker({min:0,max:999,class:"timepicker__item--wide",paddingLength:3,propertyName:"milliseconds"})}getSeparator(){return s("div",{class:"timepicker__separator"},s("span",null,this.separator))}getContent(){const i=[this.getHour24Picker(),this.getHour12Picker(),this.getMinutePicker(),this.getSecondsPicker(),this.getMillisecondsPicker()];const t=i.filter((i=>i!==undefined));return t.map(((i,s)=>{if(s===t.length-1){return[i]}return[i,this.getSeparator()]}))}openPopup(){if(!this.open&&!this.disabled){this.open=true;this.eventListeners.add(document,"mousedown",this.handleDocumentMouseDown)}}closePopup(){if(this.inline){return}this.open=false;this.eventListeners.remove(document,"mousedown",this.handleDocumentMouseDown)}renderClearable(){return this.clearable&&s("button",{slot:"suffix",class:{timepicker_clear:true,"timepicker_clear--right":this.iconPosition==="left","timepicker_clear--left":this.iconPosition==="right"},type:"button",onClick:this.handleClearClick,tabindex:"-1"},s("six-icon",{size:"small"},"clear"))}renderCustomIcon(){const i=c(this.host,"custom-icon")?s("slot",{name:"custom-icon"}):s("six-icon",{size:this.size==="large"?"medium":this.size},"watch_later");return s("span",{slot:"prefix",part:"icon",class:{prefix:true,"prefix--right":this.iconPosition==="right"}},i)}render(){return s("div",{part:"container",ref:i=>this.wrapper=i,class:"timepicker__container"},s("six-input",{ref:i=>this.inputElement=i,part:"input",onClick:()=>this.openPopup(),value:this.value,placeholder:this.placeholder,readonly:this.readonly,disabled:this.disabled,size:this.size,name:this.name,label:this.label,required:this.required,"error-text":this.errorText,class:{"input--empty":this.value==="","input--hide":this.inline}},this.renderCustomIcon(),this.renderClearable(),c(this.host,"label")?s("span",{slot:"label"},s("slot",{name:"label"})):null),this.open&&s("div",{ref:i=>this.popup=i,part:"popup",class:{timepicker__popup:true,"timepicker__popup--is-up":this.placement==null?this.placement==="top":this.isPopupContentUp,"timepicker__popup--is-inline":this.inline}},...this.getContent(),this.getAmPmPicker()))}get host(){return e(this)}static get watchers(){return{value:["valueChanged"],invalid:["invalidChanged"]}}};y.style=v;export{y as six_timepicker};
|
|
2
|
+
//# sourceMappingURL=p-4abed9df.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["getCurrentTimeIn24Hours","now","Date","hours","getHours","minutes","getMinutes","seconds","getSeconds","milliseconds","getMilliseconds","has24Hours","HOURS_IN_12_HOUR_CLOCK_FORMAT","getHoursIn12HourFormat","getCurrentTimeIn12Hours","period","getCurrentTime","isValidTimeString","timeStr","format","timeStringParts","split","timeFormatParts","length","parseTimeString","timeParts","formatParts","console","error","time","forEach","timeStringPart","i","formatStringPart","Number","toUpperCase","createTimeString","map","timeFormatPart","String","padStart","join","sixTimepickerCss","MIN_POPUP_HEIGHT","SixTimepicker","this","eventListeners","EventListeners","handlePickerChange","event","property","stopPropagation","popupValue","detail","timeString","value","sixChange","emit","changedProperty","valueAsString","handleDocumentMouseDown","path","composedPath","includes","host","closePopup","handleClearClick","sixClear","DEFAULT_DEBOUNCE_FAST","DEFAULT_DEBOUNCE_INSANELY_FAST","resizeHandler","calcIsPopupContentUp","moveOpenHoistedPopup","scrollHandler","valueChanged","updateValue","invalidChanged","invalid","inputElement","setFocus","options","_a","connectedCallback","forward","componentWillLoad","inline","open","add","document","componentDidLoad","debounce","sixChangeDebounced","componentDidRender","adjustPopupForHoisting","hoist","popup","wrapper","isUp","isDropDownContentUp","disconnectedCallback","removeAll","defaultTime","is24HourClock","inputBoundingRect","getBoundingClientRect","wrapperBoundingRect","minPopupHeight","Math","max","height","moreSpaceInTop","y","window","innerHeight","isPopupContentUp","bottom","movePopup","getSixTimeUnitPicker","params","h","class","timeout","interval","padded","min","propertyName","items","type","ItemPickerType","NUMBER","paddingLength","getHour24Picker","getHour12Picker","is12HourClock","getAmPmPicker","CUSTOM","getMinutePicker","getSecondsPicker","getMillisecondsPicker","getSeparator","separator","getContent","elementsInOrder","visibleElements","filter","el","undefined","idx","openPopup","disabled","remove","renderClearable","clearable","slot","timepicker_clear","iconPosition","onClick","tabindex","size","renderCustomIcon","icon","hasSlot","name","part","prefix","render","ref","placeholder","readonly","label","required","errorText","timepicker__popup","placement"],"sources":["src/utils/time.util.ts","src/components/six-timepicker/six-timepicker.scss?tag=six-timepicker&encapsulation=shadow","src/components/six-timepicker/six-timepicker.tsx"],"sourcesContent":["export type TimePeriod = 'AM' | 'PM';\n\nexport interface Time {\n hours?: number;\n minutes?: number;\n seconds?: number;\n milliseconds?: number;\n has24Hours?: boolean; // true => 24h, false => 12h\n period?: TimePeriod; // only needed for 12-hour clock\n}\n\nexport type TimeProperties = keyof Time;\n\nexport type TimeFormatChar =\n | 'HH' // 24h\n | 'hh' // 12h\n | 'mm' // minutes\n | 'ss' // seconds\n | 'ms' // milliseconds\n | 'aa'; // period (AM/PM)\n\n/*\n * Supported time formats\n */\nexport type TimeFormat =\n | 'HH:mm:ss'\n | 'hh:mm:ss:aa'\n | 'HH:mm:ss:ms'\n | 'hh:mm:ss:ms:aa'\n | 'HH:mm'\n | 'hh:mm:aa'\n | 'HH'\n | 'hh:aa'\n | 'mm'\n | 'ss'\n | 'ms';\n\nexport const getCurrentTimeIn24Hours = (): Time => {\n const now = new Date();\n return {\n hours: now.getHours(),\n minutes: now.getMinutes(),\n seconds: now.getSeconds(),\n milliseconds: now.getMilliseconds(),\n has24Hours: true,\n };\n};\n\nconst HOURS_IN_12_HOUR_CLOCK_FORMAT = 12;\n\nexport const getHoursIn12HourFormat = (hours: number) =>\n hours > HOURS_IN_12_HOUR_CLOCK_FORMAT ? hours - HOURS_IN_12_HOUR_CLOCK_FORMAT : hours;\n\nexport const getCurrentTimeIn12Hours = (): Time => {\n const now = new Date();\n const hours = now.getHours();\n return {\n hours: getHoursIn12HourFormat(hours),\n minutes: now.getMinutes(),\n seconds: now.getSeconds(),\n milliseconds: now.getMilliseconds(),\n has24Hours: false,\n period: hours >= HOURS_IN_12_HOUR_CLOCK_FORMAT ? 'PM' : 'AM',\n };\n};\n\nexport const getCurrentTime = (has24Hours = true): Time => {\n return has24Hours ? getCurrentTimeIn24Hours() : getCurrentTimeIn12Hours();\n};\n\nexport const isValidTimeString = (timeStr: string, format: TimeFormat) => {\n const timeStringParts = timeStr.split(':');\n const timeFormatParts = format.split(':');\n return timeStringParts.length === timeFormatParts.length;\n};\n\nexport const parseTimeString = (timeStr: string, format: TimeFormat): Time => {\n const timeParts = timeStr.split(':');\n const formatParts = format.split(':') as TimeFormatChar[];\n\n if (!isValidTimeString(timeStr, format)) {\n console.error(\n `Timestring did not match expected format.\\nExpected format: ${format}\\nReceived timestring: ${timeStr}`\n );\n }\n\n const time: Time = {};\n\n timeParts.forEach((timeStringPart, i) => {\n const formatStringPart: TimeFormatChar = formatParts[i];\n switch (formatStringPart) {\n case 'HH':\n time.hours = Number(timeStringPart);\n time.has24Hours = true;\n break;\n case 'hh':\n time.hours = Number(timeStringPart);\n time.has24Hours = false;\n break;\n case 'mm':\n time.minutes = Number(timeStringPart);\n break;\n case 'ss':\n time.seconds = Number(timeStringPart);\n break;\n case 'ms':\n time.milliseconds = Number(timeStringPart);\n break;\n case 'aa':\n time.period = timeStringPart.toUpperCase() === 'PM' ? 'PM' : 'AM';\n }\n });\n return time;\n};\n\nexport const createTimeString = (time: Time | undefined, format: TimeFormat): string => {\n if (time == null) {\n return '';\n }\n\n const formatParts = format.split(':') as TimeFormatChar[];\n\n return formatParts\n .map((timeFormatPart) => {\n switch (timeFormatPart) {\n case 'HH':\n case 'hh':\n return String(time.hours).padStart(2, '0');\n case 'mm':\n return String(time.minutes).padStart(2, '0');\n case 'ss':\n return String(time.seconds).padStart(2, '0');\n case 'ms':\n return String(time.milliseconds).padStart(3, '0');\n case 'aa':\n return String(time.period);\n }\n })\n .join(':');\n};\n","@import 'src/global/component';\n\n:host {\n display: block;\n font-family: var(--six-font-family);\n}\n\n.timepicker {\n &_clear {\n display: inline-flex;\n align-items: center;\n font-size: inherit;\n color: var(--six-input-icon-color);\n border: none;\n background: none;\n padding: 0;\n transition: var(--six-transition-fast) color;\n cursor: pointer;\n\n &:hover {\n color: var(--six-input-icon-color-hover);\n }\n\n &:focus {\n outline: none;\n }\n\n &--right {\n right: 0;\n position: absolute;\n }\n\n &--left {\n right: 35px;\n position: absolute;\n }\n }\n\n &__container {\n position: relative;\n }\n\n &__popup {\n display: flex;\n justify-content: center;\n min-width: min-content;\n min-height: 145px;\n background-color: white;\n padding: 0.5em 0.5em 1.5em;\n box-shadow: 0 2px 4px -1px rgb(0 0 0 / 20%), 0 4px 5px 0 rgb(0 0 0 / 14%), 0 1px 10px 0 rgb(0 0 0 / 12%);\n user-select: none;\n position: absolute;\n z-index: var(--six-z-index-dropdown);\n right: 0;\n left: 0;\n\n &--is-up {\n bottom: 100%;\n }\n\n &--is-inline {\n position: initial;\n box-shadow: none;\n border: 1px solid var(--six-color-web-rock-400);\n }\n }\n\n &__separator {\n display: flex;\n align-items: center;\n }\n\n &__item {\n &--wide {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n }\n }\n}\n\n.input--empty .timepicker_clear {\n visibility: hidden;\n}\n\n.input--hide {\n display: none;\n}\n\n// Icon position\n.prefix {\n cursor: pointer;\n\n &--right {\n right: 0;\n display: inline-flex;\n position: absolute;\n font-size: inherit;\n color: var(--six-input-icon-color);\n border: none;\n background: none;\n margin-right: var(--six-input-spacing-medium);\n transition: var(--six-transition-fast) color;\n }\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Method, Prop, State, Watch } from '@stencil/core';\nimport { ItemPickerType } from '../six-item-picker/types';\nimport {\n createTimeString,\n getCurrentTime,\n isValidTimeString,\n parseTimeString,\n Time,\n TimeFormat,\n TimeProperties,\n} from '../../utils/time.util';\nimport { debounce, DEFAULT_DEBOUNCE_FAST, DEFAULT_DEBOUNCE_INSANELY_FAST } from '../../utils/execution-control';\nimport { SixItemPickerChangePayload } from '../six-item-picker/six-item-picker';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { hasSlot } from '../../utils/slot';\nimport { EmptyPayload } from '../../utils/types';\nimport { adjustPopupForHoisting, movePopup } from '../../utils/popup';\n\nexport interface SixTimepickerChange {\n value?: Time;\n valueAsString: string;\n changedProperty?: string;\n}\n\ninterface SixTimeUnitPickerParams {\n min?: number;\n max?: number;\n items?: string[];\n type?: ItemPickerType;\n class?: string;\n paddingLength?: number;\n propertyName: TimeProperties;\n}\n\nconst MIN_POPUP_HEIGHT = 145;\n\n/**\n * @since 2.0.0\n * @status experimental\n *\n * @part input - The input field\n * @part container - The container of whole component\n * @part popup - The popup of the timepicker component\n *\n */\n@Component({\n tag: 'six-timepicker',\n styleUrl: 'six-timepicker.scss',\n shadow: true,\n})\nexport class SixTimepicker {\n private eventListeners = new EventListeners();\n private popup?: HTMLElement;\n private wrapper?: HTMLElement;\n private inputElement?: HTMLSixInputElement;\n @Element() host!: HTMLSixTimepickerElement;\n\n /**\n * Define the time format. Valid formats are:\n *\n * HH:mm:ss\n * hh:mm:ss:aa\n * HH:mm:ss:ms\n * hh:mm:ss:ms:aa\n * HH:mm\n * hh:mm:aa\n * HH\n * hh:aa\n * mm\n * ss\n * ms\n *\n * where HH is the 24 hour format\n * and hh is the 12 hour format\n *\n * Please notice that when using the 12-hour-clock (hh)\n * you always need a period indicator (aa). So the time can be parsed as either am or pm\n * */\n @Prop() format: TimeFormat = 'HH:mm:ss';\n\n /**\n * Define the separator to be shown between the time unit pickers.\n * Please be aware that this property will modify the displayed separator only.\n * The separator for a timestring is always expected to be a colon (eg. '13:52:20')\n * */\n @Prop() separator = ':';\n\n /**\n * The value of the timepicker provided as a string. The string mast match the provided format (or default format)\n */\n @Prop({ mutable: true }) value = '';\n\n /** Indicates whether the timepicker dropdown is open on startup. You can use this in lieu of the show/hide methods. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n /** Indicates whether the timepicker should be shown as an inline (always open) component */\n @Prop({ reflect: true }) inline = false;\n\n /**\n * If `true` the user can only select a time via the timepicker but not directly edit the input field.\n */\n @Prop() readonly = false;\n\n /**\n * If `true` the component is disabled.\n */\n @Prop() disabled = false;\n\n /**\n * The enforced placement of the dropdown panel.\n */\n @Prop() placement?: 'top' | 'bottom';\n\n /** Timepicker size. */\n @Prop() size: 'small' | 'medium' | 'large' = 'medium';\n\n /** Set to true to show an asterisk beneath the label. */\n @Prop() required = false;\n\n /**\n * The placeholder defines what text to be shown on the input element\n */\n @Prop() placeholder?: string;\n\n /** The input's error text. Alternatively, you can use the error-text slot. */\n @Prop() errorText = '';\n\n /** The input's label. Alternatively, you can use the label slot. */\n @Prop() label = '';\n\n /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed. */\n @Prop({ reflect: true }) invalid = false;\n\n /** The input's name attribute. */\n @Prop({ reflect: true }) name = '';\n\n /** Set to true to add a clear button when the input is populated. */\n @Prop() clearable = false;\n\n /** Set the position of the icon */\n @Prop() iconPosition: 'left' | 'right' = 'left';\n\n /**\n * Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n * `overflow: auto|scroll`.\n */\n @Prop() hoist = false;\n\n /**\n * Set the amount of time, in milliseconds, to wait to trigger faster switching between timeunits (e.g. hours).\n */\n @Prop() timeout = DEFAULT_DEBOUNCE_FAST;\n\n /**\n * Set the amount of time, in milliseconds, to wait between switching to next timeunit (e.g. next hour) when mouse button is held pressed.\n */\n @Prop() interval = DEFAULT_DEBOUNCE_INSANELY_FAST;\n\n /**\n * The defaultTime defines the default setting for the timepicker when you open the popup. Default time must match the provided format.\n */\n @Prop() defaultTime?: string;\n\n /**\n * Set the amount of time, in milliseconds, to wait to trigger the `six-timepicker-change-debounced` event.\n * If you want your change debounce event to not trigger when keeping the nav button pressed before, make sure debounce\n * is a bit bigger than timeout, otherwise keeping the button pressed will trigger the event twice: once you click\n * (and keep pressed) and once you release\n */\n @Prop() debounce = DEFAULT_DEBOUNCE_FAST;\n\n /**\n * Emitted when the timepicker's value changes\n */\n @Event({ eventName: 'six-timepicker-change' }) sixChange!: EventEmitter<SixTimepickerChange>;\n\n /**\n * Emitted when the timepicker's value changes, but debounced\n */\n @Event({ eventName: 'six-timepicker-change-debounced' }) sixChangeDebounced!: EventEmitter<SixTimepickerChange>;\n\n /**\n * Emitted when the clear button is activated.\n */\n @Event({ eventName: 'six-timepicker-clear' }) sixClear!: EventEmitter<EmptyPayload>;\n\n @State() isPopupContentUp = false;\n\n @State() isDropDownContentUp = false;\n\n @Listen('resize', { target: 'window' })\n async resizeHandler() {\n this.calcIsPopupContentUp();\n this.moveOpenHoistedPopup();\n }\n\n @Listen('scroll', { target: 'window' })\n async scrollHandler() {\n this.calcIsPopupContentUp();\n this.moveOpenHoistedPopup();\n }\n\n /**\n * Update the native input element when the value changes\n */\n @Watch('value')\n protected valueChanged() {\n this.updateValue();\n }\n\n @Watch('invalid')\n protected invalidChanged(invalid: boolean) {\n if (this.inputElement) {\n this.inputElement.invalid = invalid;\n }\n }\n\n /** Sets focus on the datepickers input. */\n @Method()\n async setFocus(options?: FocusOptions) {\n this.inputElement?.setFocus(options);\n }\n\n /*\n * Internally the six-timepicker uses a standardized representation of time, so we don't have a mess,\n * when switching between formats\n */\n @State() private popupValue: Time = {};\n\n connectedCallback() {\n this.eventListeners.forward('six-timepicker-change', 'change', this.host);\n }\n\n componentWillLoad() {\n this.updateValue();\n\n if (this.inline) {\n this.open = true;\n }\n\n if (this.open) {\n this.eventListeners.add(document, 'mousedown', this.handleDocumentMouseDown);\n }\n }\n\n componentDidLoad() {\n if (this.inputElement == null) return;\n const inputElement = this.inputElement;\n\n // emit debounced change event\n this.eventListeners.add(\n this.host,\n 'six-timepicker-change',\n debounce((event: Event) => this.sixChangeDebounced.emit((event as CustomEvent).detail), this.debounce)\n );\n\n // update value and popup value based on input-element value\n this.eventListeners.add(\n inputElement,\n 'six-input-input',\n debounce((event: Event) => {\n event.stopPropagation();\n\n // emit empty event if time string is invalid\n if (!isValidTimeString(inputElement.value, this.format)) {\n this.value = inputElement.value;\n this.sixChange.emit({\n value: {},\n valueAsString: '',\n });\n return;\n }\n\n // update value and popup value, and emit the new value\n this.value = inputElement.value;\n this.popupValue = parseTimeString(inputElement.value, this.format);\n this.sixChange.emit({\n value: this.popupValue,\n valueAsString: createTimeString(this.popupValue, this.format),\n });\n }, this.debounce)\n );\n }\n\n componentDidRender() {\n adjustPopupForHoisting(\n this.hoist,\n this.popup,\n this.inputElement,\n this.wrapper,\n MIN_POPUP_HEIGHT,\n (isUp) => (this.isDropDownContentUp = isUp)\n );\n }\n\n disconnectedCallback() {\n this.eventListeners.removeAll();\n }\n\n private updateValue() {\n // normalize value\n if (typeof this.value !== 'string' || !isValidTimeString(this.value, this.format)) {\n this.value = '';\n }\n\n // update popup value\n if (this.value === '') {\n if (this.defaultTime == null) {\n this.popupValue = getCurrentTime(this.is24HourClock());\n } else {\n this.popupValue = parseTimeString(this.defaultTime, this.format);\n }\n } else {\n this.popupValue = parseTimeString(this.value, this.format);\n }\n }\n\n private calcIsPopupContentUp() {\n if (this.inputElement == null || this.wrapper == null) {\n return;\n }\n\n const inputBoundingRect = this.inputElement.getBoundingClientRect();\n const wrapperBoundingRect = this.wrapper.getBoundingClientRect();\n const minPopupHeight = Math.max(wrapperBoundingRect.height, MIN_POPUP_HEIGHT);\n\n const moreSpaceInTop = inputBoundingRect.y > window.innerHeight / 2;\n this.isPopupContentUp = moreSpaceInTop && window.innerHeight < inputBoundingRect.bottom + minPopupHeight;\n }\n\n private moveOpenHoistedPopup() {\n movePopup(this.hoist, this.open, this.popup, this.inputElement, this.wrapper, MIN_POPUP_HEIGHT);\n }\n\n private handlePickerChange = (event: CustomEvent<SixItemPickerChangePayload>, property: TimeProperties) => {\n // stop propagation, since the timepicker should not expose the events of the underlying item-picker\n event.stopPropagation();\n if (this.popupValue == null) {\n return;\n }\n\n // update the internal state\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n this.popupValue[property] = event.detail;\n\n const timeString = createTimeString(this.popupValue, this.format);\n\n // update the input value\n this.value = timeString;\n\n // emit change event\n this.sixChange.emit({\n changedProperty: property,\n value: this.popupValue,\n valueAsString: timeString,\n });\n };\n\n private getSixTimeUnitPicker(params: SixTimeUnitPickerParams) {\n return (\n <six-item-picker\n class={params.class}\n timeout={this.timeout}\n interval={this.interval}\n padded\n min={params.min}\n max={params.max}\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n value={this.popupValue[params.propertyName]}\n items={params.items}\n type={params.type || ItemPickerType.NUMBER}\n padding-length={params.paddingLength}\n onSix-item-picker-change={(event) => this.handlePickerChange(event, params.propertyName)}\n ></six-item-picker>\n );\n }\n\n private getHour24Picker() {\n if (!this.is24HourClock()) {\n return;\n }\n return this.getSixTimeUnitPicker({ min: 0, max: 23, propertyName: 'hours' });\n }\n\n private is24HourClock() {\n return this.format.includes('HH');\n }\n\n private getHour12Picker() {\n if (!this.is12HourClock()) {\n return;\n }\n return this.getSixTimeUnitPicker({ min: 0, max: 11, propertyName: 'hours' });\n }\n\n private is12HourClock() {\n return this.format.includes('hh');\n }\n\n private getAmPmPicker() {\n if (!this.is12HourClock()) {\n return;\n }\n const items = ['AM', 'PM'];\n return this.getSixTimeUnitPicker({\n items,\n type: ItemPickerType.CUSTOM,\n propertyName: 'period',\n });\n }\n\n private getMinutePicker() {\n if (!this.format.includes('mm')) {\n return;\n }\n\n return this.getSixTimeUnitPicker({ min: 0, max: 59, propertyName: 'minutes' });\n }\n\n private getSecondsPicker() {\n if (!this.format.includes('ss')) {\n return;\n }\n\n return this.getSixTimeUnitPicker({ min: 0, max: 59, propertyName: 'seconds' });\n }\n\n private getMillisecondsPicker() {\n if (!this.format.includes('ms')) {\n return;\n }\n\n return this.getSixTimeUnitPicker({\n min: 0,\n max: 999,\n class: 'timepicker__item--wide',\n paddingLength: 3,\n propertyName: 'milliseconds',\n });\n }\n\n private getSeparator() {\n return (\n <div class=\"timepicker__separator\">\n <span>{this.separator}</span>\n </div>\n );\n }\n\n private getContent() {\n const elementsInOrder = [\n this.getHour24Picker(),\n this.getHour12Picker(),\n this.getMinutePicker(),\n this.getSecondsPicker(),\n this.getMillisecondsPicker(),\n ];\n\n const visibleElements = elementsInOrder.filter((el) => el !== undefined);\n\n return visibleElements.map((el, idx) => {\n if (idx === visibleElements.length - 1) {\n return [el];\n }\n\n return [el, this.getSeparator()];\n });\n }\n\n private openPopup() {\n if (!this.open && !this.disabled) {\n this.open = true;\n this.eventListeners.add(document, 'mousedown', this.handleDocumentMouseDown);\n }\n }\n\n private closePopup() {\n if (this.inline) {\n return;\n }\n\n this.open = false;\n this.eventListeners.remove(document, 'mousedown', this.handleDocumentMouseDown);\n }\n\n private handleDocumentMouseDown = (event: Event) => {\n // Close when clicking outside the containing element\n const path = event.composedPath() as EventTarget[];\n if (!path.includes(this.host)) {\n this.closePopup();\n return;\n }\n };\n\n private handleClearClick = (event: MouseEvent) => {\n event.stopPropagation();\n this.value = '';\n this.sixClear.emit();\n this.sixChange.emit({\n value: {},\n valueAsString: '',\n });\n };\n\n private renderClearable() {\n return (\n this.clearable && (\n <button\n slot=\"suffix\"\n class={{\n timepicker_clear: true,\n 'timepicker_clear--right': this.iconPosition === 'left',\n 'timepicker_clear--left': this.iconPosition === 'right',\n }}\n type=\"button\"\n onClick={this.handleClearClick}\n tabindex=\"-1\"\n >\n <six-icon size=\"small\">clear</six-icon>\n </button>\n )\n );\n }\n\n private renderCustomIcon() {\n const icon = hasSlot(this.host, 'custom-icon') ? (\n <slot name=\"custom-icon\"></slot>\n ) : (\n <six-icon size={this.size === 'large' ? 'medium' : this.size}>watch_later</six-icon>\n );\n\n return (\n <span\n slot=\"prefix\"\n part=\"icon\"\n class={{\n prefix: true,\n 'prefix--right': this.iconPosition === 'right',\n }}\n >\n {icon}\n </span>\n );\n }\n\n render() {\n return (\n <div part=\"container\" ref={(el) => (this.wrapper = el)} class=\"timepicker__container\">\n <six-input\n ref={(el) => (this.inputElement = el)}\n part=\"input\"\n onClick={() => this.openPopup()}\n value={this.value}\n placeholder={this.placeholder}\n readonly={this.readonly}\n disabled={this.disabled}\n size={this.size}\n name={this.name}\n label={this.label}\n required={this.required}\n error-text={this.errorText}\n class={{\n 'input--empty': this.value === '',\n 'input--hide': this.inline,\n }}\n >\n {this.renderCustomIcon()}\n {this.renderClearable()}\n {hasSlot(this.host, 'label') ? (\n <span slot=\"label\">\n <slot name=\"label\" />\n </span>\n ) : null}\n </six-input>\n {this.open && (\n <div\n ref={(el) => (this.popup = el)}\n part=\"popup\"\n class={{\n timepicker__popup: true,\n 'timepicker__popup--is-up': this.placement == null ? this.placement === 'top' : this.isPopupContentUp,\n 'timepicker__popup--is-inline': this.inline,\n }}\n >\n {...this.getContent()}\n {this.getAmPmPicker()}\n </div>\n )}\n </div>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
const o=new WeakMap;function n(n){if(n==null)return;const e=["Tab","ArrowUp","ArrowDown","ArrowLeft","ArrowRight","Home","End","PageDown","PageUp"];const s=o=>{if(e.includes(o.key)){n.classList.add("focus-visible")}};const i=()=>n.classList.remove("focus-visible");o.set(n,{is:s,isNot:i});n.addEventListener("keydown",s);n.addEventListener("keyup",s);n.addEventListener("mousedown",i);n.addEventListener("mousedown",i)}function e(n){if(n==null)return;const e=o.get(n);if(!e){return}const{is:s,isNot:i}=e;n.classList.remove("focus-visible");n.removeEventListener("keydown",s);n.removeEventListener("keyup",s);n.removeEventListener("mousedown",i);n.removeEventListener("mousedown",i)}const s={observe:n,unobserve:e};export{s as f};
|
|
2
|
-
//# sourceMappingURL=p-
|
|
2
|
+
//# sourceMappingURL=p-5654e4c7.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["listeners","WeakMap","observe","el","keys","is","event","includes","key","classList","add","isNot","remove","set","addEventListener","unobserve","listener","get","removeEventListener","focusVisible"],"sources":["src/utils/focus-visible.ts"],"sourcesContent":["//\n// Simulates :focus-visible behavior on an element by watching for certain keyboard and mouse heuristics and toggling a\n// `focus-visible` class. Works at the component level so no global polyfill is necessary.\n//\n// This will eventually be removed pending better :focus-visible support: https://caniuse.com/#search=focus-visible\n//\nconst listeners = new WeakMap();\n\nexport function observe(el: HTMLElement) {\n if (el == null) return;\n\n const keys = ['Tab', 'ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'Home', 'End', 'PageDown', 'PageUp'];\n const is = (event: KeyboardEvent) => {\n if (keys.includes(event.key)) {\n el.classList.add('focus-visible');\n }\n };\n const isNot = () => el.classList.remove('focus-visible');\n listeners.set(el, { is, isNot });\n\n el.addEventListener('keydown', is);\n el.addEventListener('keyup', is);\n el.addEventListener('mousedown', isNot);\n el.addEventListener('mousedown', isNot);\n}\n\nexport function unobserve(el: HTMLElement) {\n if (el == null) return;\n\n const listener = listeners.get(el);\n\n if (!listener) {\n return;\n }\n\n const { is, isNot } = listener;\n\n el.classList.remove('focus-visible');\n el.removeEventListener('keydown', is);\n el.removeEventListener('keyup', is);\n el.removeEventListener('mousedown', isNot);\n el.removeEventListener('mousedown', isNot);\n}\n\nexport const focusVisible = {\n observe,\n unobserve,\n};\n"],"mappings":"AAMA,MAAMA,EAAY,IAAIC,Q,SAENC,EAAQC,GACtB,GAAIA,GAAM,KAAM,OAEhB,MAAMC,EAAO,CAAC,MAAO,UAAW,YAAa,YAAa,aAAc,OAAQ,MAAO,WAAY,UACnG,MAAMC,EAAMC,IACV,GAAIF,EAAKG,SAASD,EAAME,KAAM,CAC5BL,EAAGM,UAAUC,IAAI,gB,GAGrB,MAAMC,EAAQ,IAAMR,EAAGM,UAAUG,OAAO,iBACxCZ,EAAUa,IAAIV,EAAI,CAAEE,KAAIM,UAExBR,EAAGW,iBAAiB,UAAWT,GAC/BF,EAAGW,iBAAiB,QAAST,GAC7BF,EAAGW,iBAAiB,YAAaH,GACjCR,EAAGW,iBAAiB,YAAaH,EACnC,C,SAEgBI,EAAUZ,GACxB,GAAIA,GAAM,KAAM,OAEhB,MAAMa,EAAWhB,EAAUiB,IAAId,GAE/B,IAAKa,EAAU,CACb,M,CAGF,MAAMX,GAAEA,EAAEM,MAAEA,GAAUK,EAEtBb,EAAGM,UAAUG,OAAO,iBACpBT,EAAGe,oBAAoB,UAAWb,GAClCF,EAAGe,oBAAoB,QAASb,GAChCF,EAAGe,oBAAoB,YAAaP,GACpCR,EAAGe,oBAAoB,YAAaP,EACtC,C,MAEaQ,EAAe,CAC1BjB,UACAa,oB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
function n(n,o,s,c,w,u){if(!n||o==null||s==null||c==null){return}const l=i(o);const f=s.getBoundingClientRect();const e=f.top;const d=l.top;const x=t(s,c,w);if(x&&e<d){o.style.top=`${d-l.height-f.height}px`}u(x)}function o(n){setTimeout((()=>{if(n==null){return}const o=n.getBoundingClientRect();if(o.y<0&&window.innerHeight-o.height>0&&Math.abs(o.y)<=o.height){i(n);n.style.top="0px"}else if(window.innerHeight<o.y+o.height&&window.innerHeight>o.height&&Math.abs(o.y-window.innerHeight)<=o.height){i(n);n.style.top=`${window.innerHeight-o.height}px`}if(window.innerWidth<o.x+o.width&&window.innerWidth>o.width&&Math.abs(o.x-window.innerWidth)<=o.width){i(n);n.style.left=`${window.innerWidth-o.width}px`}}),0)}function t(n,o,t){const i=n.getBoundingClientRect();const s=o.getBoundingClientRect();const c=Math.max(s.height,t);const w=i.y>window.innerHeight/2;return w&&window.innerHeight<i.bottom+c}function i(n){const o=n.getBoundingClientRect();n.style.position="fixed";n.style.top=o["top"]+"px";n.style.left=o["left"]+"px";n.style.width=o["width"]+"px";n.style.height=o["height"]+"px";return o}function s(n,o,i,s,c,w){if(!n||!o||i==null||s==null||c==null){return}const u=i.getBoundingClientRect();const l=u.height;const f=s.getBoundingClientRect();const e=f.top;const d=f.height;const x=t(s,c,w);if(x){i.style.top=`${e-l}px`}else{i.style.top=`${e+d}px`}}export{n as a,o as b,t as c,s as m};
|
|
2
|
-
//# sourceMappingURL=p-
|
|
2
|
+
//# sourceMappingURL=p-59210f0b.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["adjustPopupForHoisting","hoist","popup","inputElement","wrapper","minPopupHeight","dropdownDirectionChanged","popupDimensions","setPopupAsFixPosition","inputDimensions","getBoundingClientRect","inputTop","top","popupTop","isUp","calcIsDropDownContentUp","style","height","adjustPopupForSmallScreens","setTimeout","y","window","innerHeight","Math","abs","innerWidth","x","width","left","inputBoundingRect","wrapperBoundingRect","popupHeight","max","moreSpaceInTop","bottom","position","movePopup","open","popupBoundingClientRect","inputBoundingClientRect","inputHeight"],"sources":["src/utils/popup.ts"],"sourcesContent":["/**\n * If the popup is hoisted we popup is hoisted its position will change to fix to not be clipped of by a containing container.\n * To render the popup correctly we render it normally, and then assign this screenposition to the fixed popup\n */\nexport function adjustPopupForHoisting(\n hoist: boolean,\n popup: HTMLElement | undefined,\n inputElement: HTMLElement | undefined,\n wrapper: HTMLElement | undefined,\n minPopupHeight: number,\n dropdownDirectionChanged: (isUp: boolean) => void\n) {\n if (!hoist || popup == null || inputElement == null || wrapper == null) {\n return;\n }\n // take a snapshot of normally rendered popup\n const popupDimensions = setPopupAsFixPosition(popup);\n const inputDimensions = inputElement.getBoundingClientRect();\n const inputTop = inputDimensions.top;\n const popupTop = popupDimensions.top;\n\n const isUp = calcIsDropDownContentUp(inputElement, wrapper, minPopupHeight);\n // check screen position to check whether the popup should be moved above or below the trigger element\n if (isUp && inputTop < popupTop) {\n // move popup above input field if datepicker is at bottom of screen\n popup.style.top = `${popupTop - popupDimensions.height - inputDimensions.height}px`;\n }\n dropdownDirectionChanged(isUp);\n}\n\n/*\n * For small screens the datepicker popup could be cut-off even though there might still be space within the viewport.\n * This is because the popup is always aligned with the trigger input field. However in the scenario of small screens\n * we should reposition the popup to use the space available.\n */\nexport function adjustPopupForSmallScreens(popup?: HTMLElement) {\n // execute after dropdown has been rendered to make sure the popup reference is correctly set\n setTimeout(() => {\n if (popup == null) {\n return;\n }\n const popupDimensions = popup.getBoundingClientRect();\n if (\n popupDimensions.y < 0 &&\n window.innerHeight - popupDimensions.height > 0 &&\n Math.abs(popupDimensions.y) <= popupDimensions.height\n ) {\n // handle case where popup is cut-off on top but there is still space available\n setPopupAsFixPosition(popup);\n popup.style.top = '0px';\n } else if (\n window.innerHeight < popupDimensions.y + popupDimensions.height &&\n window.innerHeight > popupDimensions.height &&\n Math.abs(popupDimensions.y - window.innerHeight) <= popupDimensions.height\n ) {\n // handle case where popup is cut-off at the bottom but there is still space available above\n // apply screen position to fixed popup\n setPopupAsFixPosition(popup);\n popup.style.top = `${window.innerHeight - popupDimensions.height}px`;\n }\n\n if (\n window.innerWidth < popupDimensions.x + popupDimensions.width &&\n window.innerWidth > popupDimensions.width &&\n Math.abs(popupDimensions.x - window.innerWidth) <= popupDimensions.width\n ) {\n // handle case where popup is cut-off to the right\n setPopupAsFixPosition(popup);\n popup.style.left = `${window.innerWidth - popupDimensions.width}px`;\n }\n }, 0);\n}\n\nexport function calcIsDropDownContentUp(\n inputElement: HTMLElement,\n wrapper: HTMLElement,\n minPopupHeight: number\n): boolean {\n const inputBoundingRect = inputElement.getBoundingClientRect();\n const wrapperBoundingRect = wrapper.getBoundingClientRect();\n const popupHeight = Math.max(wrapperBoundingRect.height, minPopupHeight);\n const moreSpaceInTop = inputBoundingRect.y > window.innerHeight / 2;\n return moreSpaceInTop && window.innerHeight < inputBoundingRect.bottom + popupHeight;\n}\n\nexport function setPopupAsFixPosition(popup: HTMLElement): DOMRect {\n const popupDimensions = popup.getBoundingClientRect();\n popup.style.position = 'fixed';\n popup.style.top = popupDimensions['top'] + 'px';\n popup.style.left = popupDimensions['left'] + 'px';\n popup.style.width = popupDimensions['width'] + 'px';\n popup.style.height = popupDimensions['height'] + 'px';\n return popupDimensions;\n}\n\n/*\n * The position of the hoisted datepicker needs to be correctly calculated since the position changes to fixed.\n * Thus if the user scrolls or adjusts the screen size we need to recalculate the datepicker position.\n */\nexport function movePopup(\n hoist: boolean,\n open: boolean,\n popup: HTMLElement | undefined,\n inputElement: HTMLElement | undefined,\n wrapper: HTMLElement | undefined,\n minPopupHeight: number\n) {\n if (!hoist || !open || popup == null || inputElement == null || wrapper == null) {\n return;\n }\n const popupBoundingClientRect = popup.getBoundingClientRect();\n const popupHeight = popupBoundingClientRect.height;\n const inputBoundingClientRect = inputElement.getBoundingClientRect();\n const inputTop = inputBoundingClientRect.top;\n const inputHeight = inputBoundingClientRect.height;\n\n const isUp = calcIsDropDownContentUp(inputElement, wrapper, minPopupHeight);\n\n if (isUp) {\n popup.style.top = `${inputTop - popupHeight}px`;\n } else {\n popup.style.top = `${inputTop + inputHeight}px`;\n }\n}\n"],"mappings":"SAIgBA,EACdC,EACAC,EACAC,EACAC,EACAC,EACAC,GAEA,IAAKL,GAASC,GAAS,MAAQC,GAAgB,MAAQC,GAAW,KAAM,CACtE,M,CAGF,MAAMG,EAAkBC,EAAsBN,GAC9C,MAAMO,EAAkBN,EAAaO,wBACrC,MAAMC,EAAWF,EAAgBG,IACjC,MAAMC,EAAWN,EAAgBK,IAEjC,MAAME,EAAOC,EAAwBZ,EAAcC,EAASC,GAE5D,GAAIS,GAAQH,EAAWE,EAAU,CAE/BX,EAAMc,MAAMJ,IAAM,GAAGC,EAAWN,EAAgBU,OAASR,EAAgBQ,U,CAE3EX,EAAyBQ,EAC3B,C,SAOgBI,EAA2BhB,GAEzCiB,YAAW,KACT,GAAIjB,GAAS,KAAM,CACjB,M,CAEF,MAAMK,EAAkBL,EAAMQ,wBAC9B,GACEH,EAAgBa,EAAI,GACpBC,OAAOC,YAAcf,EAAgBU,OAAS,GAC9CM,KAAKC,IAAIjB,EAAgBa,IAAMb,EAAgBU,OAC/C,CAEAT,EAAsBN,GACtBA,EAAMc,MAAMJ,IAAM,K,MACb,GACLS,OAAOC,YAAcf,EAAgBa,EAAIb,EAAgBU,QACzDI,OAAOC,YAAcf,EAAgBU,QACrCM,KAAKC,IAAIjB,EAAgBa,EAAIC,OAAOC,cAAgBf,EAAgBU,OACpE,CAGAT,EAAsBN,GACtBA,EAAMc,MAAMJ,IAAM,GAAGS,OAAOC,YAAcf,EAAgBU,U,CAG5D,GACEI,OAAOI,WAAalB,EAAgBmB,EAAInB,EAAgBoB,OACxDN,OAAOI,WAAalB,EAAgBoB,OACpCJ,KAAKC,IAAIjB,EAAgBmB,EAAIL,OAAOI,aAAelB,EAAgBoB,MACnE,CAEAnB,EAAsBN,GACtBA,EAAMc,MAAMY,KAAO,GAAGP,OAAOI,WAAalB,EAAgBoB,S,IAE3D,EACL,C,SAEgBZ,EACdZ,EACAC,EACAC,GAEA,MAAMwB,EAAoB1B,EAAaO,wBACvC,MAAMoB,EAAsB1B,EAAQM,wBACpC,MAAMqB,EAAcR,KAAKS,IAAIF,EAAoBb,OAAQZ,GACzD,MAAM4B,EAAiBJ,EAAkBT,EAAIC,OAAOC,YAAc,EAClE,OAAOW,GAAkBZ,OAAOC,YAAcO,EAAkBK,OAASH,CAC3E,C,SAEgBvB,EAAsBN,GACpC,MAAMK,EAAkBL,EAAMQ,wBAC9BR,EAAMc,MAAMmB,SAAW,QACvBjC,EAAMc,MAAMJ,IAAML,EAAgB,OAAS,KAC3CL,EAAMc,MAAMY,KAAOrB,EAAgB,QAAU,KAC7CL,EAAMc,MAAMW,MAAQpB,EAAgB,SAAW,KAC/CL,EAAMc,MAAMC,OAASV,EAAgB,UAAY,KACjD,OAAOA,CACT,C,SAMgB6B,EACdnC,EACAoC,EACAnC,EACAC,EACAC,EACAC,GAEA,IAAKJ,IAAUoC,GAAQnC,GAAS,MAAQC,GAAgB,MAAQC,GAAW,KAAM,CAC/E,M,CAEF,MAAMkC,EAA0BpC,EAAMQ,wBACtC,MAAMqB,EAAcO,EAAwBrB,OAC5C,MAAMsB,EAA0BpC,EAAaO,wBAC7C,MAAMC,EAAW4B,EAAwB3B,IACzC,MAAM4B,EAAcD,EAAwBtB,OAE5C,MAAMH,EAAOC,EAAwBZ,EAAcC,EAASC,GAE5D,GAAIS,EAAM,CACRZ,EAAMc,MAAMJ,IAAM,GAAGD,EAAWoB,K,KAC3B,CACL7B,EAAMc,MAAMJ,IAAM,GAAGD,EAAW6B,K,CAEpC,Q"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as i,c as s,h as t}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as i,c as s,h as t}from"./p-6153045b.js";const e=".six-files-list-item{padding-bottom:0.5rem}.six-files-list-item__name{color:var(--six-color-action-600);cursor:pointer}.six-files-list-item__name--disabled{cursor:inherit;color:var(--six-color-web-rock-500)}.six-files-list-item__name:hover:not(.six-files-list-item__name--disabled){color:var(--six-color-action-500)}.six-files-list-item__date{padding-left:1rem;color:var(--six-color-web-rock-600)}.six-files-list-item__size{padding-left:1rem;color:var(--six-color-web-rock-600)}.six-files-list-item__icon{padding-left:0.5rem;display:inline-block;transform:translateY(-1px);cursor:pointer;color:var(--six-color-web-rock-600)}.six-files-list-item__icon--disabled{cursor:not-allowed;color:var(--six-color-web-rock-500)}.six-files-list-item__icon:hover:not(.six-files-list-item__icon--disabled){color:var(--six-color-web-rock-900)}";const l=class{constructor(t){i(this,t);this.downloadEvent=s(this,"six-file-list-item-download",7);this.removeEvent=s(this,"six-file-list-item-remove",7);this.downloadFile=()=>{if(this.nodownload){return}this.downloadEvent.emit({fileId:this.identifier,name:this.name})};this.removeFile=()=>{if(this.nodelete){return}this.removeEvent.emit({fileId:this.identifier,name:this.name})};this.identifier="";this.name="";this.date="";this.size=undefined;this.nodownload=false;this.nodelete=false}render(){return t("div",{class:"six-files-list-item"},t("span",{class:{"six-files-list-item__name":true,"six-files-list-item__name--disabled":this.nodownload},onClick:this.downloadFile},this.name),t("span",{class:"six-files-list-item__date"},this.date),this.size!=null&&t("span",{class:"six-files-list-item__size"},Math.round(this.size/1024)," KB"),t("six-icon",{class:{"six-files-list-item__icon":true,"six-files-list-item__icon--disabled":this.nodelete},size:"small",onClick:this.removeFile},"delete"))}};l.style=e;export{l as six_file_list_item};
|
|
2
|
+
//# sourceMappingURL=p-5af44076.entry.js.map
|