@helixui/library 1.0.1 → 1.1.2
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/custom-elements.json +2936 -9700
- package/dist/components/hx-accordion/hx-accordion-item.d.ts +7 -0
- package/dist/components/hx-accordion/hx-accordion-item.d.ts.map +1 -1
- package/dist/components/hx-accordion/hx-accordion.d.ts +3 -0
- package/dist/components/hx-accordion/hx-accordion.d.ts.map +1 -1
- package/dist/components/hx-accordion/index.js +1 -1
- package/dist/components/hx-action-bar/hx-action-bar.d.ts +13 -3
- package/dist/components/hx-action-bar/hx-action-bar.d.ts.map +1 -1
- package/dist/components/hx-action-bar/index.js +1 -1
- package/dist/components/hx-alert/hx-alert.d.ts +23 -0
- package/dist/components/hx-alert/hx-alert.d.ts.map +1 -1
- package/dist/components/hx-alert/hx-alert.styles.d.ts.map +1 -1
- package/dist/components/hx-alert/index.js +1 -1
- package/dist/components/hx-avatar/hx-avatar.d.ts +8 -1
- package/dist/components/hx-avatar/hx-avatar.d.ts.map +1 -1
- package/dist/components/hx-avatar/index.js +1 -1
- package/dist/components/hx-badge/hx-badge.d.ts +8 -1
- package/dist/components/hx-badge/hx-badge.d.ts.map +1 -1
- package/dist/components/hx-badge/index.js +1 -1
- package/dist/components/hx-banner/hx-banner.d.ts +11 -0
- package/dist/components/hx-banner/hx-banner.d.ts.map +1 -1
- package/dist/components/hx-banner/index.js +1 -1
- package/dist/components/hx-breadcrumb/hx-breadcrumb.d.ts +17 -2
- package/dist/components/hx-breadcrumb/hx-breadcrumb.d.ts.map +1 -1
- package/dist/components/hx-breadcrumb/index.js +1 -1
- package/dist/components/hx-button/hx-button.d.ts +6 -0
- package/dist/components/hx-button/hx-button.d.ts.map +1 -1
- package/dist/components/hx-button/hx-button.styles.d.ts.map +1 -1
- package/dist/components/hx-button/index.js +1 -1
- package/dist/components/hx-card/hx-card.d.ts +7 -0
- package/dist/components/hx-card/hx-card.d.ts.map +1 -1
- package/dist/components/hx-card/index.js +1 -1
- package/dist/components/hx-carousel/hx-carousel-item.d.ts +2 -0
- package/dist/components/hx-carousel/hx-carousel-item.d.ts.map +1 -1
- package/dist/components/hx-carousel/hx-carousel-item.styles.d.ts +2 -0
- package/dist/components/hx-carousel/hx-carousel-item.styles.d.ts.map +1 -0
- package/dist/components/hx-carousel/hx-carousel.d.ts +27 -0
- package/dist/components/hx-carousel/hx-carousel.d.ts.map +1 -1
- package/dist/components/hx-carousel/index.js +1 -1
- package/dist/components/hx-checkbox/hx-checkbox.d.ts +18 -2
- package/dist/components/hx-checkbox/hx-checkbox.d.ts.map +1 -1
- package/dist/components/hx-checkbox/index.js +1 -1
- package/dist/components/hx-checkbox-group/hx-checkbox-group.d.ts +20 -4
- package/dist/components/hx-checkbox-group/hx-checkbox-group.d.ts.map +1 -1
- package/dist/components/hx-checkbox-group/index.js +1 -1
- package/dist/components/hx-code-snippet/hx-code-snippet.d.ts +10 -0
- package/dist/components/hx-code-snippet/hx-code-snippet.d.ts.map +1 -1
- package/dist/components/hx-code-snippet/hx-code-snippet.styles.d.ts.map +1 -1
- package/dist/components/hx-code-snippet/index.js +1 -1
- package/dist/components/hx-color-picker/hx-color-picker.d.ts +70 -2
- package/dist/components/hx-color-picker/hx-color-picker.d.ts.map +1 -1
- package/dist/components/hx-color-picker/hx-color-picker.styles.d.ts.map +1 -1
- package/dist/components/hx-color-picker/index.js +1 -1
- package/dist/components/hx-combobox/hx-combobox.d.ts +37 -2
- package/dist/components/hx-combobox/hx-combobox.d.ts.map +1 -1
- package/dist/components/hx-combobox/hx-combobox.styles.d.ts.map +1 -1
- package/dist/components/hx-combobox/index.js +1 -1
- package/dist/components/hx-copy-button/hx-copy-button.d.ts +11 -0
- package/dist/components/hx-copy-button/hx-copy-button.d.ts.map +1 -1
- package/dist/components/hx-copy-button/index.js +1 -1
- package/dist/components/hx-counter/hx-counter.d.ts +12 -3
- package/dist/components/hx-counter/hx-counter.d.ts.map +1 -1
- package/dist/components/hx-counter/index.js +1 -1
- package/dist/components/hx-data-table/hx-data-table.d.ts +19 -2
- package/dist/components/hx-data-table/hx-data-table.d.ts.map +1 -1
- package/dist/components/hx-data-table/hx-data-table.styles.d.ts.map +1 -1
- package/dist/components/hx-data-table/index.js +1 -1
- package/dist/components/hx-date-picker/hx-date-picker.d.ts +62 -3
- package/dist/components/hx-date-picker/hx-date-picker.d.ts.map +1 -1
- package/dist/components/hx-date-picker/hx-date-picker.styles.d.ts.map +1 -1
- package/dist/components/hx-date-picker/index.js +1 -1
- package/dist/components/hx-dialog/hx-dialog.d.ts +31 -4
- package/dist/components/hx-dialog/hx-dialog.d.ts.map +1 -1
- package/dist/components/hx-dialog/hx-dialog.styles.d.ts.map +1 -1
- package/dist/components/hx-dialog/index.js +1 -1
- package/dist/components/hx-divider/hx-divider.d.ts +4 -1
- package/dist/components/hx-divider/hx-divider.d.ts.map +1 -1
- package/dist/components/hx-divider/index.js +1 -1
- package/dist/components/hx-drawer/hx-drawer.d.ts +25 -3
- package/dist/components/hx-drawer/hx-drawer.d.ts.map +1 -1
- package/dist/components/hx-drawer/hx-drawer.styles.d.ts.map +1 -1
- package/dist/components/hx-drawer/index.js +1 -1
- package/dist/components/hx-dropdown/hx-dropdown.d.ts +15 -2
- package/dist/components/hx-dropdown/hx-dropdown.d.ts.map +1 -1
- package/dist/components/hx-dropdown/index.js +1 -1
- package/dist/components/hx-field/hx-field.d.ts +10 -2
- package/dist/components/hx-field/hx-field.d.ts.map +1 -1
- package/dist/components/hx-field/index.js +1 -1
- package/dist/components/hx-file-upload/hx-file-upload.d.ts +39 -2
- package/dist/components/hx-file-upload/hx-file-upload.d.ts.map +1 -1
- package/dist/components/hx-file-upload/hx-file-upload.styles.d.ts.map +1 -1
- package/dist/components/hx-file-upload/index.js +1 -1
- package/dist/components/hx-form/hx-form.d.ts.map +1 -1
- package/dist/components/hx-form/index.js +1 -1
- package/dist/components/hx-format-date/hx-format-date.d.ts +8 -0
- package/dist/components/hx-format-date/hx-format-date.d.ts.map +1 -1
- package/dist/components/hx-format-date/index.js +1 -1
- package/dist/components/hx-grid/hx-grid.d.ts +9 -3
- package/dist/components/hx-grid/hx-grid.d.ts.map +1 -1
- package/dist/components/hx-grid/index.js +1 -1
- package/dist/components/hx-help-text/index.js +1 -1
- package/dist/components/hx-icon/hx-icon.d.ts +10 -2
- package/dist/components/hx-icon/hx-icon.d.ts.map +1 -1
- package/dist/components/hx-icon/index.js +1 -1
- package/dist/components/hx-icon-button/hx-icon-button.d.ts +11 -0
- package/dist/components/hx-icon-button/hx-icon-button.d.ts.map +1 -1
- package/dist/components/hx-icon-button/index.js +1 -1
- package/dist/components/hx-image/hx-image.d.ts +8 -0
- package/dist/components/hx-image/hx-image.d.ts.map +1 -1
- package/dist/components/hx-image/index.js +1 -1
- package/dist/components/hx-link/hx-link.d.ts +3 -0
- package/dist/components/hx-link/hx-link.d.ts.map +1 -1
- package/dist/components/hx-link/hx-link.styles.d.ts.map +1 -1
- package/dist/components/hx-link/index.js +1 -1
- package/dist/components/hx-list/hx-list-item.d.ts +8 -2
- package/dist/components/hx-list/hx-list-item.d.ts.map +1 -1
- package/dist/components/hx-list/hx-list-item.styles.d.ts.map +1 -1
- package/dist/components/hx-list/hx-list.d.ts +6 -2
- package/dist/components/hx-list/hx-list.d.ts.map +1 -1
- package/dist/components/hx-list/index.js +1 -1
- package/dist/components/hx-menu/hx-menu-item.d.ts +11 -0
- package/dist/components/hx-menu/hx-menu-item.d.ts.map +1 -1
- package/dist/components/hx-menu/hx-menu-item.styles.d.ts.map +1 -1
- package/dist/components/hx-menu/hx-menu.d.ts +10 -1
- package/dist/components/hx-menu/hx-menu.d.ts.map +1 -1
- package/dist/components/hx-menu/index.js +1 -1
- package/dist/components/hx-meter/hx-meter.d.ts +8 -0
- package/dist/components/hx-meter/hx-meter.d.ts.map +1 -1
- package/dist/components/hx-meter/hx-meter.styles.d.ts.map +1 -1
- package/dist/components/hx-meter/index.js +1 -1
- package/dist/components/hx-nav/hx-nav.d.ts +15 -0
- package/dist/components/hx-nav/hx-nav.d.ts.map +1 -1
- package/dist/components/hx-nav/index.js +1 -1
- package/dist/components/hx-number-input/hx-number-input.d.ts +47 -1
- package/dist/components/hx-number-input/hx-number-input.d.ts.map +1 -1
- package/dist/components/hx-number-input/index.js +1 -1
- package/dist/components/hx-overflow-menu/hx-overflow-menu.d.ts +15 -0
- package/dist/components/hx-overflow-menu/hx-overflow-menu.d.ts.map +1 -1
- package/dist/components/hx-overflow-menu/index.js +1 -1
- package/dist/components/hx-pagination/hx-pagination.d.ts +30 -0
- package/dist/components/hx-pagination/hx-pagination.d.ts.map +1 -1
- package/dist/components/hx-pagination/index.js +1 -1
- package/dist/components/hx-popover/hx-popover.d.ts +53 -2
- package/dist/components/hx-popover/hx-popover.d.ts.map +1 -1
- package/dist/components/hx-popover/index.js +1 -1
- package/dist/components/hx-popup/hx-popup.d.ts +8 -0
- package/dist/components/hx-popup/hx-popup.d.ts.map +1 -1
- package/dist/components/hx-popup/hx-popup.styles.d.ts.map +1 -1
- package/dist/components/hx-popup/index.js +1 -1
- package/dist/components/hx-progress-bar/hx-progress-bar.d.ts +8 -2
- package/dist/components/hx-progress-bar/hx-progress-bar.d.ts.map +1 -1
- package/dist/components/hx-progress-bar/hx-progress-bar.styles.d.ts.map +1 -1
- package/dist/components/hx-progress-bar/index.js +1 -1
- package/dist/components/hx-progress-ring/hx-progress-ring.d.ts +8 -2
- package/dist/components/hx-progress-ring/hx-progress-ring.d.ts.map +1 -1
- package/dist/components/hx-progress-ring/index.js +1 -1
- package/dist/components/hx-prose/hx-prose.d.ts +5 -3
- package/dist/components/hx-prose/hx-prose.d.ts.map +1 -1
- package/dist/components/hx-prose/index.js +1 -1
- package/dist/components/hx-radio-group/hx-radio-group.d.ts.map +1 -1
- package/dist/components/hx-radio-group/hx-radio.d.ts +4 -2
- package/dist/components/hx-radio-group/hx-radio.d.ts.map +1 -1
- package/dist/components/hx-radio-group/hx-radio.styles.d.ts.map +1 -1
- package/dist/components/hx-radio-group/index.js +1 -1
- package/dist/components/hx-rating/hx-rating.d.ts +54 -2
- package/dist/components/hx-rating/hx-rating.d.ts.map +1 -1
- package/dist/components/hx-rating/index.js +1 -1
- package/dist/components/hx-select/hx-select.d.ts +22 -2
- package/dist/components/hx-select/hx-select.d.ts.map +1 -1
- package/dist/components/hx-select/hx-select.styles.d.ts.map +1 -1
- package/dist/components/hx-select/index.js +1 -1
- package/dist/components/hx-side-nav/hx-nav-item.d.ts +6 -0
- package/dist/components/hx-side-nav/hx-nav-item.d.ts.map +1 -1
- package/dist/components/hx-side-nav/hx-nav-item.styles.d.ts.map +1 -1
- package/dist/components/hx-side-nav/hx-side-nav.d.ts +6 -1
- package/dist/components/hx-side-nav/hx-side-nav.d.ts.map +1 -1
- package/dist/components/hx-side-nav/hx-side-nav.styles.d.ts.map +1 -1
- package/dist/components/hx-side-nav/index.js +1 -1
- package/dist/components/hx-slider/hx-slider.d.ts +22 -1
- package/dist/components/hx-slider/hx-slider.d.ts.map +1 -1
- package/dist/components/hx-slider/hx-slider.styles.d.ts.map +1 -1
- package/dist/components/hx-slider/index.js +1 -1
- package/dist/components/hx-spinner/hx-spinner.d.ts +3 -1
- package/dist/components/hx-spinner/hx-spinner.d.ts.map +1 -1
- package/dist/components/hx-spinner/index.js +1 -1
- package/dist/components/hx-split-button/hx-split-button.d.ts +12 -0
- package/dist/components/hx-split-button/hx-split-button.d.ts.map +1 -1
- package/dist/components/hx-split-button/index.js +1 -1
- package/dist/components/hx-split-panel/hx-split-panel.d.ts +32 -2
- package/dist/components/hx-split-panel/hx-split-panel.d.ts.map +1 -1
- package/dist/components/hx-split-panel/hx-split-panel.styles.d.ts.map +1 -1
- package/dist/components/hx-split-panel/index.js +1 -1
- package/dist/components/hx-stack/index.js +1 -1
- package/dist/components/hx-stat/hx-stat.d.ts +5 -1
- package/dist/components/hx-stat/hx-stat.d.ts.map +1 -1
- package/dist/components/hx-stat/index.js +1 -1
- package/dist/components/hx-status-indicator/hx-status-indicator.d.ts +13 -12
- package/dist/components/hx-status-indicator/hx-status-indicator.d.ts.map +1 -1
- package/dist/components/hx-status-indicator/index.js +1 -1
- package/dist/components/hx-steps/hx-step.d.ts +7 -9
- package/dist/components/hx-steps/hx-step.d.ts.map +1 -1
- package/dist/components/hx-steps/hx-step.styles.d.ts.map +1 -1
- package/dist/components/hx-steps/hx-steps.d.ts +3 -3
- package/dist/components/hx-steps/hx-steps.d.ts.map +1 -1
- package/dist/components/hx-steps/index.js +1 -1
- package/dist/components/hx-switch/hx-switch.d.ts +21 -1
- package/dist/components/hx-switch/hx-switch.d.ts.map +1 -1
- package/dist/components/hx-switch/index.js +1 -1
- package/dist/components/hx-table/hx-table.d.ts +7 -2
- package/dist/components/hx-table/hx-table.d.ts.map +1 -1
- package/dist/components/hx-table/hx-table.styles.d.ts.map +1 -1
- package/dist/components/hx-table/hx-th.d.ts +4 -0
- package/dist/components/hx-table/hx-th.d.ts.map +1 -1
- package/dist/components/hx-table/index.js +1 -1
- package/dist/components/hx-tabs/hx-tab.d.ts +3 -0
- package/dist/components/hx-tabs/hx-tab.d.ts.map +1 -1
- package/dist/components/hx-tabs/hx-tabs.d.ts +6 -0
- package/dist/components/hx-tabs/hx-tabs.d.ts.map +1 -1
- package/dist/components/hx-tabs/index.js +1 -1
- package/dist/components/hx-tag/hx-tag.d.ts +2 -0
- package/dist/components/hx-tag/hx-tag.d.ts.map +1 -1
- package/dist/components/hx-tag/index.js +1 -1
- package/dist/components/hx-text/hx-text.d.ts +1 -0
- package/dist/components/hx-text/hx-text.d.ts.map +1 -1
- package/dist/components/hx-text/index.js +1 -1
- package/dist/components/hx-text-input/hx-text-input.d.ts +8 -3
- package/dist/components/hx-text-input/hx-text-input.d.ts.map +1 -1
- package/dist/components/hx-text-input/index.js +1 -1
- package/dist/components/hx-textarea/hx-textarea.d.ts +9 -3
- package/dist/components/hx-textarea/hx-textarea.d.ts.map +1 -1
- package/dist/components/hx-textarea/hx-textarea.styles.d.ts.map +1 -1
- package/dist/components/hx-textarea/index.js +1 -1
- package/dist/components/hx-theme/hx-theme.d.ts +2 -2
- package/dist/components/hx-theme/hx-theme.d.ts.map +1 -1
- package/dist/components/hx-time-picker/hx-time-picker.d.ts +22 -3
- package/dist/components/hx-time-picker/hx-time-picker.d.ts.map +1 -1
- package/dist/components/hx-time-picker/hx-time-picker.styles.d.ts.map +1 -1
- package/dist/components/hx-time-picker/index.js +1 -1
- package/dist/components/hx-toast/hx-toast.d.ts +8 -0
- package/dist/components/hx-toast/hx-toast.d.ts.map +1 -1
- package/dist/components/hx-toast/hx-toast.styles.d.ts.map +1 -1
- package/dist/components/hx-toast/index.js +1 -1
- package/dist/components/hx-toggle-button/hx-toggle-button.d.ts +23 -0
- package/dist/components/hx-toggle-button/hx-toggle-button.d.ts.map +1 -1
- package/dist/components/hx-toggle-button/index.js +1 -1
- package/dist/components/hx-tooltip/hx-tooltip.d.ts +57 -0
- package/dist/components/hx-tooltip/hx-tooltip.d.ts.map +1 -1
- package/dist/components/hx-tooltip/index.js +1 -1
- package/dist/components/hx-top-nav/hx-top-nav.d.ts +4 -0
- package/dist/components/hx-top-nav/hx-top-nav.d.ts.map +1 -1
- package/dist/components/hx-top-nav/index.js +1 -1
- package/dist/components/hx-tree-view/hx-tree-item.d.ts +2 -0
- package/dist/components/hx-tree-view/hx-tree-item.d.ts.map +1 -1
- package/dist/components/hx-tree-view/hx-tree-view.d.ts +11 -0
- package/dist/components/hx-tree-view/hx-tree-view.d.ts.map +1 -1
- package/dist/components/hx-tree-view/index.js +1 -1
- package/dist/index.js +70 -70
- package/dist/shared/{hx-accordion-DT8qHOay.js → hx-accordion-D1kFhdeQ.js} +15 -3
- package/dist/shared/hx-accordion-D1kFhdeQ.js.map +1 -0
- package/dist/shared/{hx-action-bar-we_WJety.js → hx-action-bar-D4bulGQP.js} +38 -31
- package/dist/shared/hx-action-bar-D4bulGQP.js.map +1 -0
- package/dist/shared/{hx-alert-D6uok29t.js → hx-alert-CSxCF2rr.js} +74 -53
- package/dist/shared/hx-alert-CSxCF2rr.js.map +1 -0
- package/dist/shared/{hx-avatar-Cep6Urm3.js → hx-avatar-Cun-O99h.js} +5 -1
- package/dist/shared/hx-avatar-Cun-O99h.js.map +1 -0
- package/dist/shared/{hx-badge-BeuWuUj_.js → hx-badge-CsFd2xtw.js} +53 -43
- package/dist/shared/hx-badge-CsFd2xtw.js.map +1 -0
- package/dist/shared/{hx-banner-DnCBJtRR.js → hx-banner-BTV-X2xF.js} +55 -43
- package/dist/shared/{hx-banner-DnCBJtRR.js.map → hx-banner-BTV-X2xF.js.map} +1 -1
- package/dist/shared/{hx-breadcrumb-item-Bj2UqhzR.js → hx-breadcrumb-item-4IwaLgaO.js} +34 -22
- package/dist/shared/hx-breadcrumb-item-4IwaLgaO.js.map +1 -0
- package/dist/shared/{hx-button-Cbhqpm5i.js → hx-button-7k-KeCYU.js} +29 -15
- package/dist/shared/hx-button-7k-KeCYU.js.map +1 -0
- package/dist/shared/{hx-card-B9j2SHyI.js → hx-card-0hT3G5hi.js} +10 -3
- package/dist/shared/hx-card-0hT3G5hi.js.map +1 -0
- package/dist/shared/{hx-carousel-item-Be0bC-7o.js → hx-carousel-item-DgeYyYZJ.js} +106 -89
- package/dist/shared/hx-carousel-item-DgeYyYZJ.js.map +1 -0
- package/dist/shared/{hx-checkbox-CuaJqEo7.js → hx-checkbox-BvjO-O41.js} +13 -6
- package/dist/shared/hx-checkbox-BvjO-O41.js.map +1 -0
- package/dist/shared/{hx-checkbox-group-ydUdV9Sx.js → hx-checkbox-group-Z5VvWzcj.js} +50 -37
- package/dist/shared/hx-checkbox-group-Z5VvWzcj.js.map +1 -0
- package/dist/shared/{hx-code-snippet-DBwIjl5p.js → hx-code-snippet-DqzPkH4K.js} +17 -1
- package/dist/shared/hx-code-snippet-DqzPkH4K.js.map +1 -0
- package/dist/shared/hx-color-picker-Da8z6AlQ.js +596 -0
- package/dist/shared/hx-color-picker-Da8z6AlQ.js.map +1 -0
- package/dist/shared/{hx-combobox-CNvY-es8.js → hx-combobox-CivfelTS.js} +93 -459
- package/dist/shared/hx-combobox-CivfelTS.js.map +1 -0
- package/dist/shared/{hx-copy-button-CLBA31to.js → hx-copy-button--0dymSvw.js} +9 -1
- package/dist/shared/{hx-copy-button-CLBA31to.js.map → hx-copy-button--0dymSvw.js.map} +1 -1
- package/dist/shared/{hx-counter-D-1NXzGs.js → hx-counter-Duf00H7p.js} +58 -49
- package/dist/shared/hx-counter-Duf00H7p.js.map +1 -0
- package/dist/shared/{hx-data-table-BwoJCFgs.js → hx-data-table-BWvd5NNx.js} +123 -89
- package/dist/shared/hx-data-table-BWvd5NNx.js.map +1 -0
- package/dist/shared/{hx-date-picker-DDcIBJir.js → hx-date-picker-6voxxxNE.js} +119 -485
- package/dist/shared/hx-date-picker-6voxxxNE.js.map +1 -0
- package/dist/shared/{hx-dialog-M7so0sRT.js → hx-dialog-DkUSnVgw.js} +72 -52
- package/dist/shared/hx-dialog-DkUSnVgw.js.map +1 -0
- package/dist/shared/{hx-divider-XgWIz4Mr.js → hx-divider-DNNs4e8q.js} +2 -1
- package/dist/shared/{hx-divider-XgWIz4Mr.js.map → hx-divider-DNNs4e8q.js.map} +1 -1
- package/dist/shared/{hx-drawer-CYxuhIQ0.js → hx-drawer-CJcRZcns.js} +85 -56
- package/dist/shared/hx-drawer-CJcRZcns.js.map +1 -0
- package/dist/shared/{hx-dropdown-7cfowTWv.js → hx-dropdown-Bo0KTM1A.js} +29 -20
- package/dist/shared/hx-dropdown-Bo0KTM1A.js.map +1 -0
- package/dist/shared/{hx-field-CDP8EXuj.js → hx-field-3MmzJ4kZ.js} +21 -13
- package/dist/shared/hx-field-3MmzJ4kZ.js.map +1 -0
- package/dist/shared/{hx-file-upload-9HbONfqt.js → hx-file-upload-ByjAgfNy.js} +103 -64
- package/dist/shared/hx-file-upload-ByjAgfNy.js.map +1 -0
- package/dist/shared/hx-form-BpS6v3Iu.js +258 -0
- package/dist/shared/hx-form-BpS6v3Iu.js.map +1 -0
- package/dist/shared/{hx-format-date-BsVr8gpD.js → hx-format-date-BdnWV2kX.js} +7 -1
- package/dist/shared/hx-format-date-BdnWV2kX.js.map +1 -0
- package/dist/shared/{hx-grid-BsDBCTbt.js → hx-grid-gEjuF0cR.js} +25 -18
- package/dist/shared/hx-grid-gEjuF0cR.js.map +1 -0
- package/dist/shared/{hx-help-text-DaOPN1iB.js → hx-help-text-BAcEGRUE.js} +2 -2
- package/dist/shared/{hx-help-text-DaOPN1iB.js.map → hx-help-text-BAcEGRUE.js.map} +1 -1
- package/dist/shared/{hx-icon--xsJztDh.js → hx-icon-CP6OnLoM.js} +6 -1
- package/dist/shared/hx-icon-CP6OnLoM.js.map +1 -0
- package/dist/shared/{hx-icon-button-iu0i_faq.js → hx-icon-button-DzH_bRtC.js} +15 -1
- package/dist/shared/{hx-icon-button-iu0i_faq.js.map → hx-icon-button-DzH_bRtC.js.map} +1 -1
- package/dist/shared/{hx-image-xyb_tHCR.js → hx-image-C6pGiI6c.js} +6 -1
- package/dist/shared/hx-image-C6pGiI6c.js.map +1 -0
- package/dist/shared/{hx-link-DfNy_UU8.js → hx-link-Tmk_YPvW.js} +46 -37
- package/dist/shared/hx-link-Tmk_YPvW.js.map +1 -0
- package/dist/shared/{hx-list-CdRNgeoP.js → hx-list-DwInEX2H.js} +63 -37
- package/dist/shared/hx-list-DwInEX2H.js.map +1 -0
- package/dist/shared/{hx-menu-divider-DR8klkFT.js → hx-menu-divider-DR4G_rqw.js} +71 -40
- package/dist/shared/hx-menu-divider-DR4G_rqw.js.map +1 -0
- package/dist/shared/{hx-meter-CZ7lnMra.js → hx-meter-uXkTZq-W.js} +77 -61
- package/dist/shared/hx-meter-uXkTZq-W.js.map +1 -0
- package/dist/shared/{hx-nav-DM6-cGKF.js → hx-nav-3JsN2Oak.js} +64 -47
- package/dist/shared/hx-nav-3JsN2Oak.js.map +1 -0
- package/dist/shared/{hx-nav-item-D54-5eUM.js → hx-nav-item-D3EJatzc.js} +40 -16
- package/dist/shared/hx-nav-item-D3EJatzc.js.map +1 -0
- package/dist/shared/{hx-number-input-BP6TIA92.js → hx-number-input-CIpL2BEh.js} +65 -34
- package/dist/shared/hx-number-input-CIpL2BEh.js.map +1 -0
- package/dist/shared/{hx-overflow-menu-CobkjAb8.js → hx-overflow-menu-2kgOJ_ht.js} +76 -64
- package/dist/shared/hx-overflow-menu-2kgOJ_ht.js.map +1 -0
- package/dist/shared/{hx-pagination-10dpXS95.js → hx-pagination-Blt-fFqV.js} +113 -94
- package/dist/shared/hx-pagination-Blt-fFqV.js.map +1 -0
- package/dist/shared/{hx-popover-ULjonbaO.js → hx-popover-DxE67miP.js} +71 -66
- package/dist/shared/hx-popover-DxE67miP.js.map +1 -0
- package/dist/shared/{hx-popup-CYf9Q5sj.js → hx-popup-Dg6n_PbY.js} +13 -1
- package/dist/shared/hx-popup-Dg6n_PbY.js.map +1 -0
- package/dist/shared/{hx-progress-bar-CnTibV63.js → hx-progress-bar-Dm_EHyng.js} +65 -47
- package/dist/shared/hx-progress-bar-Dm_EHyng.js.map +1 -0
- package/dist/shared/{hx-progress-ring-BHJBaXNk.js → hx-progress-ring-DpxBDD5d.js} +35 -28
- package/dist/shared/hx-progress-ring-DpxBDD5d.js.map +1 -0
- package/dist/shared/hx-prose-Ml_L2zje.js +59 -0
- package/dist/shared/hx-prose-Ml_L2zje.js.map +1 -0
- package/dist/shared/{hx-radio-BnKcRuQu.js → hx-radio-BywgVSEu.js} +7 -8
- package/dist/shared/hx-radio-BywgVSEu.js.map +1 -0
- package/dist/shared/{hx-rating-Y_t7Z4qb.js → hx-rating-CUWBQ0fZ.js} +131 -64
- package/dist/shared/hx-rating-CUWBQ0fZ.js.map +1 -0
- package/dist/shared/{hx-select-C50lD7NS.js → hx-select-BwDwxk-M.js} +107 -169
- package/dist/shared/hx-select-BwDwxk-M.js.map +1 -0
- package/dist/shared/hx-skeleton-BHvALyd7.js.map +1 -1
- package/dist/shared/{hx-slider-CprSNrRi.js → hx-slider-D_0EKJyk.js} +23 -7
- package/dist/shared/hx-slider-D_0EKJyk.js.map +1 -0
- package/dist/shared/{hx-spinner-BOApJ-g9.js → hx-spinner-DMn4SChS.js} +35 -28
- package/dist/shared/hx-spinner-DMn4SChS.js.map +1 -0
- package/dist/shared/{hx-split-button-CHGy4FUc.js → hx-split-button-CypgLXw1.js} +14 -3
- package/dist/shared/{hx-split-button-CHGy4FUc.js.map → hx-split-button-CypgLXw1.js.map} +1 -1
- package/dist/shared/{hx-split-panel-DYtB45Tr.js → hx-split-panel-CV_Kr4EK.js} +58 -37
- package/dist/shared/hx-split-panel-CV_Kr4EK.js.map +1 -0
- package/dist/shared/{hx-stack-CfoW7jU7.js → hx-stack-BStY1RmV.js} +29 -29
- package/dist/shared/hx-stack-BStY1RmV.js.map +1 -0
- package/dist/shared/{hx-stat-C2wfph8W.js → hx-stat-CHntLHJM.js} +18 -10
- package/dist/shared/hx-stat-CHntLHJM.js.map +1 -0
- package/dist/shared/{hx-status-indicator-oYWOkWlD.js → hx-status-indicator-C1BwEvUw.js} +15 -12
- package/dist/shared/hx-status-indicator-C1BwEvUw.js.map +1 -0
- package/dist/shared/{hx-step-DYoIumpR.js → hx-step-BIVWSPxd.js} +45 -33
- package/dist/shared/hx-step-BIVWSPxd.js.map +1 -0
- package/dist/shared/{hx-switch-DkKchcuP.js → hx-switch-BgX8kuWt.js} +12 -3
- package/dist/shared/hx-switch-BgX8kuWt.js.map +1 -0
- package/dist/shared/{hx-tab-panel-BRNcLICw.js → hx-tab-panel-DhOq67jj.js} +11 -2
- package/dist/shared/hx-tab-panel-DhOq67jj.js.map +1 -0
- package/dist/shared/{hx-tag-B3N-vZ6B.js → hx-tag-CzOTDcXI.js} +2 -1
- package/dist/shared/{hx-tag-B3N-vZ6B.js.map → hx-tag-CzOTDcXI.js.map} +1 -1
- package/dist/shared/{hx-td-CVwCGBYf.js → hx-td-h6oeW6YC.js} +43 -41
- package/dist/shared/hx-td-h6oeW6YC.js.map +1 -0
- package/dist/shared/{hx-text-NjKoQATI.js → hx-text-DTXjiviE.js} +2 -1
- package/dist/shared/{hx-text-NjKoQATI.js.map → hx-text-DTXjiviE.js.map} +1 -1
- package/dist/shared/{hx-text-input-CCZZbWQ9.js → hx-text-input-CqEdDHMU.js} +82 -65
- package/dist/shared/hx-text-input-CqEdDHMU.js.map +1 -0
- package/dist/shared/{hx-textarea-BsQdB1Rk.js → hx-textarea-BgX7rxyo.js} +21 -12
- package/dist/shared/hx-textarea-BgX7rxyo.js.map +1 -0
- package/dist/shared/hx-theme-6GDoUG8j.js.map +1 -1
- package/dist/shared/{hx-time-picker-CJcIjH3C.js → hx-time-picker-DmLu7WUC.js} +73 -273
- package/dist/shared/hx-time-picker-DmLu7WUC.js.map +1 -0
- package/dist/shared/{hx-toggle-button-D4F1soEM.js → hx-toggle-button-D1jpDvSA.js} +75 -38
- package/dist/shared/hx-toggle-button-D1jpDvSA.js.map +1 -0
- package/dist/shared/{hx-tooltip-Bk1iQRHs.js → hx-tooltip-kh7QFPKu.js} +66 -49
- package/dist/shared/hx-tooltip-kh7QFPKu.js.map +1 -0
- package/dist/shared/{hx-top-nav-D2bQpns3.js → hx-top-nav-DYlnzDaU.js} +3 -1
- package/dist/shared/{hx-top-nav-D2bQpns3.js.map → hx-top-nav-DYlnzDaU.js.map} +1 -1
- package/dist/shared/{hx-tree-item-BobGN76x.js → hx-tree-item-BP6UF_H1.js} +29 -16
- package/dist/shared/hx-tree-item-BP6UF_H1.js.map +1 -0
- package/dist/shared/{toast-factory-MvMMreTu.js → toast-factory-DTy-qN8r.js} +70 -59
- package/dist/shared/toast-factory-DTy-qN8r.js.map +1 -0
- package/dist/styles/shared-field.styles.d.ts +6 -0
- package/dist/styles/shared-field.styles.d.ts.map +1 -0
- package/package.json +2 -5
- package/dist/shared/hx-accordion-DT8qHOay.js.map +0 -1
- package/dist/shared/hx-action-bar-we_WJety.js.map +0 -1
- package/dist/shared/hx-alert-D6uok29t.js.map +0 -1
- package/dist/shared/hx-avatar-Cep6Urm3.js.map +0 -1
- package/dist/shared/hx-badge-BeuWuUj_.js.map +0 -1
- package/dist/shared/hx-breadcrumb-item-Bj2UqhzR.js.map +0 -1
- package/dist/shared/hx-button-Cbhqpm5i.js.map +0 -1
- package/dist/shared/hx-card-B9j2SHyI.js.map +0 -1
- package/dist/shared/hx-carousel-item-Be0bC-7o.js.map +0 -1
- package/dist/shared/hx-checkbox-CuaJqEo7.js.map +0 -1
- package/dist/shared/hx-checkbox-group-ydUdV9Sx.js.map +0 -1
- package/dist/shared/hx-code-snippet-DBwIjl5p.js.map +0 -1
- package/dist/shared/hx-color-picker-Bb2UPVc3.js +0 -803
- package/dist/shared/hx-color-picker-Bb2UPVc3.js.map +0 -1
- package/dist/shared/hx-combobox-CNvY-es8.js.map +0 -1
- package/dist/shared/hx-counter-D-1NXzGs.js.map +0 -1
- package/dist/shared/hx-data-table-BwoJCFgs.js.map +0 -1
- package/dist/shared/hx-date-picker-DDcIBJir.js.map +0 -1
- package/dist/shared/hx-dialog-M7so0sRT.js.map +0 -1
- package/dist/shared/hx-drawer-CYxuhIQ0.js.map +0 -1
- package/dist/shared/hx-dropdown-7cfowTWv.js.map +0 -1
- package/dist/shared/hx-field-CDP8EXuj.js.map +0 -1
- package/dist/shared/hx-file-upload-9HbONfqt.js.map +0 -1
- package/dist/shared/hx-form-BFv_N1dm.js +0 -1272
- package/dist/shared/hx-form-BFv_N1dm.js.map +0 -1
- package/dist/shared/hx-format-date-BsVr8gpD.js.map +0 -1
- package/dist/shared/hx-grid-BsDBCTbt.js.map +0 -1
- package/dist/shared/hx-icon--xsJztDh.js.map +0 -1
- package/dist/shared/hx-image-xyb_tHCR.js.map +0 -1
- package/dist/shared/hx-link-DfNy_UU8.js.map +0 -1
- package/dist/shared/hx-list-CdRNgeoP.js.map +0 -1
- package/dist/shared/hx-menu-divider-DR8klkFT.js.map +0 -1
- package/dist/shared/hx-meter-CZ7lnMra.js.map +0 -1
- package/dist/shared/hx-nav-DM6-cGKF.js.map +0 -1
- package/dist/shared/hx-nav-item-D54-5eUM.js.map +0 -1
- package/dist/shared/hx-number-input-BP6TIA92.js.map +0 -1
- package/dist/shared/hx-overflow-menu-CobkjAb8.js.map +0 -1
- package/dist/shared/hx-pagination-10dpXS95.js.map +0 -1
- package/dist/shared/hx-popover-ULjonbaO.js.map +0 -1
- package/dist/shared/hx-popup-CYf9Q5sj.js.map +0 -1
- package/dist/shared/hx-progress-bar-CnTibV63.js.map +0 -1
- package/dist/shared/hx-progress-ring-BHJBaXNk.js.map +0 -1
- package/dist/shared/hx-prose-DZh2KrMb.js +0 -876
- package/dist/shared/hx-prose-DZh2KrMb.js.map +0 -1
- package/dist/shared/hx-radio-BnKcRuQu.js.map +0 -1
- package/dist/shared/hx-rating-Y_t7Z4qb.js.map +0 -1
- package/dist/shared/hx-select-C50lD7NS.js.map +0 -1
- package/dist/shared/hx-slider-CprSNrRi.js.map +0 -1
- package/dist/shared/hx-spinner-BOApJ-g9.js.map +0 -1
- package/dist/shared/hx-split-panel-DYtB45Tr.js.map +0 -1
- package/dist/shared/hx-stack-CfoW7jU7.js.map +0 -1
- package/dist/shared/hx-stat-C2wfph8W.js.map +0 -1
- package/dist/shared/hx-status-indicator-oYWOkWlD.js.map +0 -1
- package/dist/shared/hx-step-DYoIumpR.js.map +0 -1
- package/dist/shared/hx-switch-DkKchcuP.js.map +0 -1
- package/dist/shared/hx-tab-panel-BRNcLICw.js.map +0 -1
- package/dist/shared/hx-td-CVwCGBYf.js.map +0 -1
- package/dist/shared/hx-text-input-CCZZbWQ9.js.map +0 -1
- package/dist/shared/hx-textarea-BsQdB1Rk.js.map +0 -1
- package/dist/shared/hx-time-picker-CJcIjH3C.js.map +0 -1
- package/dist/shared/hx-toggle-button-D4F1soEM.js.map +0 -1
- package/dist/shared/hx-tooltip-Bk1iQRHs.js.map +0 -1
- package/dist/shared/hx-tree-item-BobGN76x.js.map +0 -1
- package/dist/shared/toast-factory-MvMMreTu.js.map +0 -1
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { css as b, LitElement as w, nothing as p, html as h } from "lit";
|
|
2
|
-
import { query as f, state as c, property as d, customElement as
|
|
3
|
-
import { classMap as
|
|
2
|
+
import { query as f, state as c, property as d, customElement as _ } from "lit/decorators.js";
|
|
3
|
+
import { classMap as y } from "lit/directives/class-map.js";
|
|
4
4
|
import { ifDefined as m } from "lit/directives/if-defined.js";
|
|
5
|
-
import { tokenStyles as
|
|
6
|
-
import { l as
|
|
7
|
-
const
|
|
5
|
+
import { tokenStyles as x } from "@helixui/tokens/lit";
|
|
6
|
+
import { l as g, u as S } from "./body-scroll-lock-VBa5TFP-.js";
|
|
7
|
+
const E = b`
|
|
8
8
|
/* P2-03: Explicit [hidden] rule to survive CSS resets that may override the UA stylesheet. */
|
|
9
9
|
[hidden] {
|
|
10
10
|
display: none !important;
|
|
@@ -82,6 +82,10 @@ const S = b`
|
|
|
82
82
|
.drawer-panel {
|
|
83
83
|
transition: none;
|
|
84
84
|
}
|
|
85
|
+
|
|
86
|
+
.drawer-close-button {
|
|
87
|
+
transition: none;
|
|
88
|
+
}
|
|
85
89
|
}
|
|
86
90
|
|
|
87
91
|
/* ─── Placement: end (default — right) ─── */
|
|
@@ -89,7 +93,7 @@ const S = b`
|
|
|
89
93
|
:host([placement='end']) .drawer-panel,
|
|
90
94
|
:host(:not([placement])) .drawer-panel {
|
|
91
95
|
top: 0;
|
|
92
|
-
|
|
96
|
+
inset-inline-end: 0;
|
|
93
97
|
bottom: 0;
|
|
94
98
|
width: var(--_drawer-size, var(--hx-drawer-size-md, 30rem));
|
|
95
99
|
max-width: 100%;
|
|
@@ -106,7 +110,7 @@ const S = b`
|
|
|
106
110
|
|
|
107
111
|
:host([placement='start']) .drawer-panel {
|
|
108
112
|
top: 0;
|
|
109
|
-
|
|
113
|
+
inset-inline-start: 0;
|
|
110
114
|
bottom: 0;
|
|
111
115
|
width: var(--_drawer-size, var(--hx-drawer-size-md, 30rem));
|
|
112
116
|
max-width: 100%;
|
|
@@ -122,8 +126,8 @@ const S = b`
|
|
|
122
126
|
|
|
123
127
|
:host([placement='top']) .drawer-panel {
|
|
124
128
|
top: 0;
|
|
125
|
-
|
|
126
|
-
|
|
129
|
+
inset-inline-start: 0;
|
|
130
|
+
inset-inline-end: 0;
|
|
127
131
|
height: var(--_drawer-size, var(--hx-drawer-size-md, 30rem));
|
|
128
132
|
max-height: 100%;
|
|
129
133
|
width: 100%;
|
|
@@ -139,8 +143,8 @@ const S = b`
|
|
|
139
143
|
|
|
140
144
|
:host([placement='bottom']) .drawer-panel {
|
|
141
145
|
bottom: 0;
|
|
142
|
-
|
|
143
|
-
|
|
146
|
+
inset-inline-start: 0;
|
|
147
|
+
inset-inline-end: 0;
|
|
144
148
|
height: var(--_drawer-size, var(--hx-drawer-size-md, 30rem));
|
|
145
149
|
max-height: 100%;
|
|
146
150
|
width: 100%;
|
|
@@ -158,11 +162,8 @@ const S = b`
|
|
|
158
162
|
display: flex;
|
|
159
163
|
align-items: center;
|
|
160
164
|
justify-content: space-between;
|
|
161
|
-
gap: var(--hx-
|
|
162
|
-
padding: var(
|
|
163
|
-
--hx-drawer-header-padding,
|
|
164
|
-
var(--hx-spacing-5, 1.25rem) var(--hx-spacing-6, 1.5rem)
|
|
165
|
-
);
|
|
165
|
+
gap: var(--hx-space-4, 1rem);
|
|
166
|
+
padding: var(--hx-drawer-header-padding, var(--hx-space-5, 1.25rem) var(--hx-space-6, 1.5rem));
|
|
166
167
|
border-bottom: var(--hx-border-width-1, 1px) solid
|
|
167
168
|
var(--hx-drawer-header-border-color, var(--hx-color-neutral-200));
|
|
168
169
|
flex-shrink: 0;
|
|
@@ -181,7 +182,7 @@ const S = b`
|
|
|
181
182
|
.drawer-header-actions {
|
|
182
183
|
display: flex;
|
|
183
184
|
align-items: center;
|
|
184
|
-
gap: var(--hx-
|
|
185
|
+
gap: var(--hx-space-2, 0.5rem);
|
|
185
186
|
flex-shrink: 0;
|
|
186
187
|
}
|
|
187
188
|
|
|
@@ -222,7 +223,7 @@ const S = b`
|
|
|
222
223
|
|
|
223
224
|
.drawer-body {
|
|
224
225
|
flex: 1 1 auto;
|
|
225
|
-
padding: var(--hx-drawer-body-padding, var(--hx-
|
|
226
|
+
padding: var(--hx-drawer-body-padding, var(--hx-space-6, 1.5rem));
|
|
226
227
|
overflow-y: auto;
|
|
227
228
|
overscroll-behavior: contain;
|
|
228
229
|
}
|
|
@@ -233,20 +234,20 @@ const S = b`
|
|
|
233
234
|
display: flex;
|
|
234
235
|
align-items: center;
|
|
235
236
|
justify-content: flex-end;
|
|
236
|
-
gap: var(--hx-
|
|
237
|
-
padding: var(--hx-drawer-footer-padding, var(--hx-
|
|
237
|
+
gap: var(--hx-space-3, 0.75rem);
|
|
238
|
+
padding: var(--hx-drawer-footer-padding, var(--hx-space-4, 1rem) var(--hx-space-6, 1.5rem));
|
|
238
239
|
border-top: var(--hx-border-width-1, 1px) solid
|
|
239
240
|
var(--hx-drawer-footer-border-color, var(--hx-color-neutral-200));
|
|
240
241
|
flex-shrink: 0;
|
|
241
242
|
}
|
|
242
243
|
`;
|
|
243
|
-
var k = Object.defineProperty,
|
|
244
|
-
for (var
|
|
245
|
-
(l = e[n]) && (
|
|
246
|
-
return s &&
|
|
244
|
+
var k = Object.defineProperty, A = Object.getOwnPropertyDescriptor, o = (e, t, r, s) => {
|
|
245
|
+
for (var i = s > 1 ? void 0 : s ? A(t, r) : t, n = e.length - 1, l; n >= 0; n--)
|
|
246
|
+
(l = e[n]) && (i = (s ? l(t, r, i) : l(i)) || i);
|
|
247
|
+
return s && i && k(t, r, i), i;
|
|
247
248
|
};
|
|
248
|
-
let
|
|
249
|
-
const
|
|
249
|
+
let F = 0;
|
|
250
|
+
const L = {
|
|
250
251
|
sm: "20rem",
|
|
251
252
|
md: "30rem",
|
|
252
253
|
lg: "40rem",
|
|
@@ -263,7 +264,7 @@ const C = {
|
|
|
263
264
|
].join(",");
|
|
264
265
|
let a = class extends w {
|
|
265
266
|
constructor() {
|
|
266
|
-
super(...arguments), this._isOpen = !1, this._hasHeaderActionsSlot = !1, this._hasFooterSlot = !1, this._hasLabelSlot = !1, this._cachedFocusableElements = [], this._triggerElement = null, this._animationTimeout = null, this._hasScrollLock = !1, this._siblingAriaHiddenElements = [], this._titleId = `hx-drawer-title-${++
|
|
267
|
+
super(...arguments), this._isOpen = !1, this._hasHeaderActionsSlot = !1, this._hasFooterSlot = !1, this._hasLabelSlot = !1, this._cachedFocusableElements = [], this._triggerElement = null, this._animationTimeout = null, this._hasScrollLock = !1, this._siblingAriaHiddenElements = [], this._titleId = `hx-drawer-title-${++F}`, this.open = !1, this.placement = "end", this.size = "md", this.contained = !1, this.noHeader = !1, this.noFooter = !1, this.label = "", this.closeLabel = "Close drawer", this._handleKeyDown = (e) => {
|
|
267
268
|
if (this._isOpen) {
|
|
268
269
|
if (e.key === "Escape") {
|
|
269
270
|
e.preventDefault(), this.open = !1;
|
|
@@ -277,6 +278,11 @@ let a = class extends w {
|
|
|
277
278
|
};
|
|
278
279
|
}
|
|
279
280
|
// ─── Lifecycle ───
|
|
281
|
+
connectedCallback() {
|
|
282
|
+
super.connectedCallback();
|
|
283
|
+
const e = this.getAttribute("size");
|
|
284
|
+
e !== null && !this.hasAttribute("hx-size") && (this.size = e);
|
|
285
|
+
}
|
|
280
286
|
disconnectedCallback() {
|
|
281
287
|
super.disconnectedCallback(), this._removeListeners(), this._animationTimeout !== null && clearTimeout(this._animationTimeout), this._restoreBodyScroll();
|
|
282
288
|
}
|
|
@@ -293,27 +299,34 @@ let a = class extends w {
|
|
|
293
299
|
this.open = !1;
|
|
294
300
|
}
|
|
295
301
|
// ─── Private: Size CSS variable ───
|
|
302
|
+
/** @internal */
|
|
296
303
|
_applySizeVar() {
|
|
297
|
-
const e =
|
|
304
|
+
const e = L[this.size] ?? this.size;
|
|
298
305
|
this.style.setProperty("--_drawer-size", e);
|
|
299
306
|
}
|
|
300
307
|
// ─── Private: Open / Close ───
|
|
308
|
+
/** @internal */
|
|
301
309
|
_lockBodyScroll() {
|
|
302
|
-
this.contained || this._hasScrollLock || (
|
|
310
|
+
this.contained || this._hasScrollLock || (g(), this._hasScrollLock = !0);
|
|
303
311
|
}
|
|
312
|
+
/** @internal */
|
|
304
313
|
_restoreBodyScroll() {
|
|
305
|
-
this._hasScrollLock && (
|
|
314
|
+
this._hasScrollLock && (S(), this._hasScrollLock = !1);
|
|
306
315
|
}
|
|
316
|
+
/** @internal */
|
|
307
317
|
_openDrawer() {
|
|
308
318
|
const e = document.activeElement;
|
|
309
319
|
this._triggerElement = e instanceof HTMLElement ? e : null, this._animationTimeout !== null && (clearTimeout(this._animationTimeout), this._animationTimeout = null), this._applySizeVar(), this._lockBodyScroll(), this._hideBackgroundFromScreenReaders(), this.dispatchEvent(new CustomEvent("hx-show", { bubbles: !0, composed: !0 })), this.updateComplete.then(() => (this._isOpen = !0, this._addListeners(), this.updateComplete)).then(() => {
|
|
310
320
|
this._cachedFocusableElements = this._getFocusableElements(), this._setInitialFocus();
|
|
311
321
|
const t = this._getAnimationDuration();
|
|
312
322
|
this._animationTimeout = setTimeout(() => {
|
|
313
|
-
this.dispatchEvent(
|
|
323
|
+
this.dispatchEvent(
|
|
324
|
+
new CustomEvent("hx-after-show", { bubbles: !0, composed: !0 })
|
|
325
|
+
);
|
|
314
326
|
}, t);
|
|
315
327
|
}).catch(console.error);
|
|
316
328
|
}
|
|
329
|
+
/** @internal */
|
|
317
330
|
_closeDrawer() {
|
|
318
331
|
this._animationTimeout !== null && (clearTimeout(this._animationTimeout), this._animationTimeout = null), this._isOpen = !1, this._removeListeners(), this._cachedFocusableElements = [], this._restoreBodyScroll(), this._restoreBackgroundForScreenReaders(), this.dispatchEvent(new CustomEvent("hx-hide", { bubbles: !0, composed: !0 })), this._triggerElement && typeof this._triggerElement.focus == "function" && this._triggerElement.focus(), this._triggerElement = null;
|
|
319
332
|
const e = this._getAnimationDuration();
|
|
@@ -321,28 +334,34 @@ let a = class extends w {
|
|
|
321
334
|
this.dispatchEvent(new CustomEvent("hx-after-hide", { bubbles: !0, composed: !0 }));
|
|
322
335
|
}, e);
|
|
323
336
|
}
|
|
337
|
+
/** @internal */
|
|
324
338
|
_getAnimationDuration() {
|
|
325
339
|
return window.matchMedia("(prefers-reduced-motion: reduce)").matches ? 0 : 300;
|
|
326
340
|
}
|
|
327
341
|
// ─── Background aria-hidden management (P1-03) ───
|
|
342
|
+
/** @internal */
|
|
328
343
|
_hideBackgroundFromScreenReaders() {
|
|
329
344
|
this.contained || (this._siblingAriaHiddenElements = [], Array.from(document.body.children).forEach((e) => {
|
|
330
345
|
e === this || e.contains(this) || e.hasAttribute("aria-hidden") || (e.setAttribute("aria-hidden", "true"), this._siblingAriaHiddenElements.push(e));
|
|
331
346
|
}));
|
|
332
347
|
}
|
|
348
|
+
/** @internal */
|
|
333
349
|
_restoreBackgroundForScreenReaders() {
|
|
334
350
|
this._siblingAriaHiddenElements.forEach((e) => {
|
|
335
351
|
e.removeAttribute("aria-hidden");
|
|
336
352
|
}), this._siblingAriaHiddenElements = [];
|
|
337
353
|
}
|
|
338
354
|
// ─── Event Listeners (P1-01: use only document listener, not overlay) ───
|
|
355
|
+
/** @internal */
|
|
339
356
|
_addListeners() {
|
|
340
357
|
document.addEventListener("keydown", this._handleKeyDown);
|
|
341
358
|
}
|
|
359
|
+
/** @internal */
|
|
342
360
|
_removeListeners() {
|
|
343
361
|
document.removeEventListener("keydown", this._handleKeyDown);
|
|
344
362
|
}
|
|
345
363
|
// ─── Focus ───
|
|
364
|
+
/** @internal */
|
|
346
365
|
_setInitialFocus() {
|
|
347
366
|
var t;
|
|
348
367
|
const e = new CustomEvent("hx-initial-focus", {
|
|
@@ -355,11 +374,12 @@ let a = class extends w {
|
|
|
355
374
|
r.length > 0 && r[0] ? r[0].focus() : (t = this._panelEl) == null || t.focus();
|
|
356
375
|
}
|
|
357
376
|
}
|
|
377
|
+
/** @internal */
|
|
358
378
|
_getFocusableElements() {
|
|
359
|
-
var s,
|
|
379
|
+
var s, i;
|
|
360
380
|
const e = Array.from(
|
|
361
381
|
((s = this.shadowRoot) == null ? void 0 : s.querySelectorAll(u)) ?? []
|
|
362
|
-
), t = ((
|
|
382
|
+
), t = ((i = this.shadowRoot) == null ? void 0 : i.querySelectorAll("slot")) ?? [], r = [];
|
|
363
383
|
return t.forEach((n) => {
|
|
364
384
|
n.assignedElements({ flatten: !0 }).forEach((l) => {
|
|
365
385
|
l instanceof HTMLElement && (l.matches(u) && r.push(l), l.querySelectorAll(u).forEach((v) => {
|
|
@@ -370,31 +390,36 @@ let a = class extends w {
|
|
|
370
390
|
(n) => !n.hasAttribute("disabled") && n.getAttribute("tabindex") !== "-1"
|
|
371
391
|
);
|
|
372
392
|
}
|
|
393
|
+
/** @internal */
|
|
373
394
|
_trapFocus(e) {
|
|
374
395
|
const t = this._cachedFocusableElements.length > 0 ? this._cachedFocusableElements : this._getFocusableElements();
|
|
375
396
|
if (t.length === 0) {
|
|
376
397
|
e.preventDefault();
|
|
377
398
|
return;
|
|
378
399
|
}
|
|
379
|
-
const [r, ...s] = t,
|
|
380
|
-
if (!r || !
|
|
400
|
+
const [r, ...s] = t, i = s.length > 0 ? s[s.length - 1] : r;
|
|
401
|
+
if (!r || !i) return;
|
|
381
402
|
const n = document.activeElement;
|
|
382
|
-
e.shiftKey ? n === r && (e.preventDefault(),
|
|
403
|
+
e.shiftKey ? n === r && (e.preventDefault(), i.focus()) : n === i && (e.preventDefault(), r.focus());
|
|
383
404
|
}
|
|
384
405
|
// ─── Slot change handlers ───
|
|
406
|
+
/** @internal */
|
|
385
407
|
_handleHeaderActionsSlotChange(e) {
|
|
386
408
|
const t = e.target;
|
|
387
409
|
this._hasHeaderActionsSlot = t.assignedNodes({ flatten: !0 }).length > 0;
|
|
388
410
|
}
|
|
411
|
+
/** @internal */
|
|
389
412
|
_handleFooterSlotChange(e) {
|
|
390
413
|
const t = e.target;
|
|
391
414
|
this._hasFooterSlot = t.assignedNodes({ flatten: !0 }).length > 0;
|
|
392
415
|
}
|
|
416
|
+
/** @internal */
|
|
393
417
|
_handleLabelSlotChange(e) {
|
|
394
418
|
const t = e.target;
|
|
395
419
|
this._hasLabelSlot = t.assignedNodes({ flatten: !0 }).length > 0;
|
|
396
420
|
}
|
|
397
421
|
// ─── Render Helpers ───
|
|
422
|
+
/** @internal */
|
|
398
423
|
_renderHeader() {
|
|
399
424
|
return this.noHeader ? p : h`
|
|
400
425
|
<div part="header" class="drawer-header">
|
|
@@ -413,7 +438,7 @@ let a = class extends w {
|
|
|
413
438
|
<button
|
|
414
439
|
part="close-btn"
|
|
415
440
|
class="drawer-close-button"
|
|
416
|
-
aria-label
|
|
441
|
+
aria-label=${this.closeLabel}
|
|
417
442
|
@click=${() => {
|
|
418
443
|
this.open = !1;
|
|
419
444
|
}}
|
|
@@ -438,6 +463,7 @@ let a = class extends w {
|
|
|
438
463
|
</div>
|
|
439
464
|
`;
|
|
440
465
|
}
|
|
466
|
+
/** @internal */
|
|
441
467
|
_renderFooter() {
|
|
442
468
|
return this.noFooter ? p : h`
|
|
443
469
|
<div part="footer" class="drawer-footer" ?hidden=${!this._hasFooterSlot}>
|
|
@@ -454,7 +480,7 @@ let a = class extends w {
|
|
|
454
480
|
return h`
|
|
455
481
|
<div
|
|
456
482
|
part="overlay"
|
|
457
|
-
class=${
|
|
483
|
+
class=${y(e)}
|
|
458
484
|
role="dialog"
|
|
459
485
|
aria-modal="true"
|
|
460
486
|
aria-labelledby=${m(t)}
|
|
@@ -474,50 +500,53 @@ let a = class extends w {
|
|
|
474
500
|
`;
|
|
475
501
|
}
|
|
476
502
|
};
|
|
477
|
-
a.styles = [
|
|
478
|
-
|
|
503
|
+
a.styles = [x, E];
|
|
504
|
+
o([
|
|
479
505
|
f(".drawer-overlay")
|
|
480
506
|
], a.prototype, "_overlayEl", 2);
|
|
481
|
-
|
|
507
|
+
o([
|
|
482
508
|
f(".drawer-panel")
|
|
483
509
|
], a.prototype, "_panelEl", 2);
|
|
484
|
-
|
|
510
|
+
o([
|
|
485
511
|
c()
|
|
486
512
|
], a.prototype, "_isOpen", 2);
|
|
487
|
-
|
|
513
|
+
o([
|
|
488
514
|
c()
|
|
489
515
|
], a.prototype, "_hasHeaderActionsSlot", 2);
|
|
490
|
-
|
|
516
|
+
o([
|
|
491
517
|
c()
|
|
492
518
|
], a.prototype, "_hasFooterSlot", 2);
|
|
493
|
-
|
|
519
|
+
o([
|
|
494
520
|
c()
|
|
495
521
|
], a.prototype, "_hasLabelSlot", 2);
|
|
496
|
-
|
|
522
|
+
o([
|
|
497
523
|
d({ type: Boolean, reflect: !0 })
|
|
498
524
|
], a.prototype, "open", 2);
|
|
499
|
-
|
|
525
|
+
o([
|
|
500
526
|
d({ type: String, reflect: !0 })
|
|
501
527
|
], a.prototype, "placement", 2);
|
|
502
|
-
|
|
503
|
-
d({ type: String, reflect: !0 })
|
|
528
|
+
o([
|
|
529
|
+
d({ type: String, reflect: !0, attribute: "hx-size" })
|
|
504
530
|
], a.prototype, "size", 2);
|
|
505
|
-
|
|
531
|
+
o([
|
|
506
532
|
d({ type: Boolean, reflect: !0 })
|
|
507
533
|
], a.prototype, "contained", 2);
|
|
508
|
-
|
|
534
|
+
o([
|
|
509
535
|
d({ type: Boolean, reflect: !0, attribute: "no-header" })
|
|
510
536
|
], a.prototype, "noHeader", 2);
|
|
511
|
-
|
|
537
|
+
o([
|
|
512
538
|
d({ type: Boolean, reflect: !0, attribute: "no-footer" })
|
|
513
539
|
], a.prototype, "noFooter", 2);
|
|
514
|
-
|
|
540
|
+
o([
|
|
515
541
|
d({ type: String })
|
|
516
542
|
], a.prototype, "label", 2);
|
|
517
|
-
|
|
518
|
-
|
|
543
|
+
o([
|
|
544
|
+
d({ type: String, attribute: "close-label" })
|
|
545
|
+
], a.prototype, "closeLabel", 2);
|
|
546
|
+
a = o([
|
|
547
|
+
_("hx-drawer")
|
|
519
548
|
], a);
|
|
520
549
|
export {
|
|
521
550
|
a as H
|
|
522
551
|
};
|
|
523
|
-
//# sourceMappingURL=hx-drawer-
|
|
552
|
+
//# sourceMappingURL=hx-drawer-CJcRZcns.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hx-drawer-CJcRZcns.js","sources":["../../src/components/hx-drawer/hx-drawer.styles.ts","../../src/components/hx-drawer/hx-drawer.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixDrawerStyles = css`\n /* P2-03: Explicit [hidden] rule to survive CSS resets that may override the UA stylesheet. */\n [hidden] {\n display: none !important;\n }\n\n :host {\n display: contents;\n }\n\n :host([contained]) {\n display: block;\n position: relative;\n overflow: hidden;\n }\n\n /* ─── Overlay ─── */\n\n .drawer-overlay {\n position: fixed;\n inset: 0;\n z-index: var(--hx-z-index-modal, 400);\n display: flex;\n pointer-events: none;\n visibility: hidden;\n }\n\n :host([contained]) .drawer-overlay {\n position: absolute;\n }\n\n .drawer-overlay.is-open {\n pointer-events: auto;\n visibility: visible;\n }\n\n /* ─── Backdrop ─── */\n\n .drawer-backdrop {\n position: absolute;\n inset: 0;\n background-color: var(--hx-drawer-backdrop-color, var(--hx-color-neutral-900));\n opacity: 0;\n transition: opacity var(--hx-duration-300, 300ms) var(--hx-ease-out, ease-out);\n }\n\n .drawer-overlay.is-open .drawer-backdrop {\n opacity: var(--hx-drawer-backdrop-opacity, 0.5);\n }\n\n @media (prefers-reduced-motion: reduce) {\n .drawer-backdrop {\n transition: none;\n }\n }\n\n /* ─── Panel ─── */\n\n .drawer-panel {\n position: absolute;\n display: flex;\n flex-direction: column;\n background-color: var(--hx-drawer-bg, var(--hx-color-neutral-0));\n color: var(--hx-drawer-color, var(--hx-color-neutral-900));\n box-shadow: var(--hx-drawer-shadow, var(--hx-shadow-xl));\n overflow: hidden;\n outline: none;\n z-index: 1;\n transition:\n transform var(--hx-duration-300, 300ms) var(--hx-ease-out, ease-out),\n opacity var(--hx-duration-300, 300ms) var(--hx-ease-out, ease-out);\n opacity: 0;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .drawer-panel {\n transition: none;\n }\n\n .drawer-close-button {\n transition: none;\n }\n }\n\n /* ─── Placement: end (default — right) ─── */\n\n :host([placement='end']) .drawer-panel,\n :host(:not([placement])) .drawer-panel {\n top: 0;\n inset-inline-end: 0;\n bottom: 0;\n width: var(--_drawer-size, var(--hx-drawer-size-md, 30rem));\n max-width: 100%;\n transform: translateX(100%);\n }\n\n :host([placement='end']) .drawer-overlay.is-open .drawer-panel,\n :host(:not([placement])) .drawer-overlay.is-open .drawer-panel {\n transform: translateX(0);\n opacity: 1;\n }\n\n /* ─── Placement: start (left) ─── */\n\n :host([placement='start']) .drawer-panel {\n top: 0;\n inset-inline-start: 0;\n bottom: 0;\n width: var(--_drawer-size, var(--hx-drawer-size-md, 30rem));\n max-width: 100%;\n transform: translateX(-100%);\n }\n\n :host([placement='start']) .drawer-overlay.is-open .drawer-panel {\n transform: translateX(0);\n opacity: 1;\n }\n\n /* ─── Placement: top ─── */\n\n :host([placement='top']) .drawer-panel {\n top: 0;\n inset-inline-start: 0;\n inset-inline-end: 0;\n height: var(--_drawer-size, var(--hx-drawer-size-md, 30rem));\n max-height: 100%;\n width: 100%;\n transform: translateY(-100%);\n }\n\n :host([placement='top']) .drawer-overlay.is-open .drawer-panel {\n transform: translateY(0);\n opacity: 1;\n }\n\n /* ─── Placement: bottom ─── */\n\n :host([placement='bottom']) .drawer-panel {\n bottom: 0;\n inset-inline-start: 0;\n inset-inline-end: 0;\n height: var(--_drawer-size, var(--hx-drawer-size-md, 30rem));\n max-height: 100%;\n width: 100%;\n transform: translateY(100%);\n }\n\n :host([placement='bottom']) .drawer-overlay.is-open .drawer-panel {\n transform: translateY(0);\n opacity: 1;\n }\n\n /* ─── Header ─── */\n\n .drawer-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--hx-space-4, 1rem);\n padding: var(--hx-drawer-header-padding, var(--hx-space-5, 1.25rem) var(--hx-space-6, 1.5rem));\n border-bottom: var(--hx-border-width-1, 1px) solid\n var(--hx-drawer-header-border-color, var(--hx-color-neutral-200));\n flex-shrink: 0;\n }\n\n .drawer-title {\n margin: 0;\n flex: 1 1 auto;\n font-family: var(--hx-font-family-sans);\n font-size: var(--hx-font-size-lg);\n font-weight: var(--hx-font-weight-semibold);\n line-height: var(--hx-line-height-snug);\n color: var(--hx-drawer-title-color, var(--hx-color-neutral-900));\n }\n\n .drawer-header-actions {\n display: flex;\n align-items: center;\n gap: var(--hx-space-2, 0.5rem);\n flex-shrink: 0;\n }\n\n .drawer-close-button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n /* WCAG 2.5.5 (healthcare mandate): minimum 44x44px touch target */\n min-width: var(--hx-touch-target-min, 2.75rem);\n min-height: var(--hx-touch-target-min, 2.75rem);\n width: var(--hx-touch-target-min, 2.75rem);\n height: var(--hx-touch-target-min, 2.75rem);\n padding: 0;\n border: none;\n border-radius: var(--hx-border-radius-md, 0.375rem);\n background: transparent;\n color: var(--hx-color-neutral-500);\n cursor: pointer;\n flex-shrink: 0;\n transition: background-color var(--hx-duration-100, 100ms) ease;\n }\n\n .drawer-close-button:hover {\n background-color: var(--hx-color-neutral-100);\n color: var(--hx-color-neutral-900);\n }\n\n .drawer-close-button:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(\n --hx-drawer-close-btn-focus-ring-color,\n var(--hx-focus-ring-color, var(--hx-color-primary-500))\n );\n outline-offset: var(--hx-focus-ring-offset, 2px);\n }\n\n /* ─── Body ─── */\n\n .drawer-body {\n flex: 1 1 auto;\n padding: var(--hx-drawer-body-padding, var(--hx-space-6, 1.5rem));\n overflow-y: auto;\n overscroll-behavior: contain;\n }\n\n /* ─── Footer ─── */\n\n .drawer-footer {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: var(--hx-space-3, 0.75rem);\n padding: var(--hx-drawer-footer-padding, var(--hx-space-4, 1rem) var(--hx-space-6, 1.5rem));\n border-top: var(--hx-border-width-1, 1px) solid\n var(--hx-drawer-footer-border-color, var(--hx-color-neutral-200));\n flex-shrink: 0;\n }\n`;\n","import { LitElement, html, nothing, type PropertyValues } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { lockBodyScroll, unlockBodyScroll } from '../../utils/body-scroll-lock.js';\nimport { devWarn } from '../../utils/dev-warn.js';\nimport { helixDrawerStyles } from './hx-drawer.styles.js';\n\n// Module-level counter for stable, SSR-safe IDs (avoids Math.random() hydration mismatch)\nlet _hxDrawerIdCounter = 0;\n\ntype DrawerPlacement = 'start' | 'end' | 'top' | 'bottom';\ntype DrawerSizePreset = 'sm' | 'md' | 'lg' | 'full';\ntype DrawerSize = DrawerSizePreset | (string & Record<never, never>);\n\nconst DRAWER_SIZE_MAP: Record<DrawerSizePreset, string> = {\n sm: '20rem',\n md: '30rem',\n lg: '40rem',\n full: '100%',\n};\n\nconst FOCUSABLE_SELECTORS = [\n 'a[href]',\n 'area[href]',\n 'button:not([disabled])',\n 'input:not([disabled])',\n 'select:not([disabled])',\n 'textarea:not([disabled])',\n '[tabindex]:not([tabindex=\"-1\"])',\n 'details > summary',\n].join(',');\n\n/**\n * A slide-in drawer panel that can appear from any edge of the viewport.\n * Supports focus trapping, overlay backdrop, keyboard navigation, and full\n * ARIA labelling for enterprise healthcare accessibility requirements.\n *\n * @summary Slide-in panel overlay from any viewport edge.\n *\n * @tag hx-drawer\n *\n * @slot label - The drawer title text.\n * @slot header-actions - Action buttons displayed in the header near the close button.\n * @slot - Default slot for the drawer body content.\n * @slot footer - Action buttons or footer content.\n *\n * @fires {CustomEvent<void>} hx-show - Fired when the drawer begins to open.\n * @fires {CustomEvent<void>} hx-after-show - Fired after the drawer open animation completes.\n * @fires {CustomEvent<void>} hx-hide - Fired when the drawer begins to close.\n * @fires {CustomEvent<void>} hx-after-hide - Fired after the drawer close animation completes.\n * @fires {CustomEvent<void>} hx-initial-focus - Fired when initial focus is set inside the drawer. Cancelable to override focus behavior.\n *\n * @csspart overlay - The full-screen overlay container (includes backdrop and panel).\n * @csspart panel - The drawer panel itself.\n * @csspart header - The header region containing the title and actions.\n * @csspart title - The drawer title element.\n * @csspart close-btn - The built-in close button.\n * @csspart body - The scrollable body region.\n * @csspart footer - The footer region.\n *\n * @attr [label] - Accessible label for the dialog when no visible label slot is provided.\n *\n * @cssprop [--hx-drawer-bg=var(--hx-color-neutral-0)] - Drawer panel background color.\n * @cssprop [--hx-drawer-color=var(--hx-color-neutral-900)] - Drawer panel text color.\n * @cssprop [--hx-drawer-shadow=var(--hx-shadow-xl)] - Drawer panel box shadow.\n * @cssprop [--hx-drawer-backdrop-color=var(--hx-color-neutral-900)] - Backdrop color.\n * @cssprop [--hx-drawer-backdrop-opacity=0.5] - Backdrop opacity.\n * @cssprop [--hx-drawer-header-padding] - Padding inside the header.\n * @cssprop [--hx-drawer-header-border-color=var(--hx-color-neutral-200)] - Header border color.\n * @cssprop [--hx-drawer-title-color=var(--hx-color-neutral-900)] - Title text color.\n * @cssprop [--hx-drawer-body-padding] - Padding inside the body.\n * @cssprop [--hx-drawer-footer-padding] - Padding inside the footer.\n * @cssprop [--hx-drawer-footer-border-color=var(--hx-color-neutral-200)] - Footer border color.\n */\n@customElement('hx-drawer')\nexport class HelixDrawer extends LitElement {\n static override styles = [tokenStyles, helixDrawerStyles];\n\n // ─── Queries ───\n\n /**\n * Reference to the overlay element that wraps the backdrop and panel.\n * @internal\n */\n @query('.drawer-overlay')\n private _overlayEl: HTMLElement | null | undefined;\n\n /**\n * Reference to the drawer panel element used for focus management.\n * @internal\n */\n @query('.drawer-panel')\n private _panelEl: HTMLElement | null | undefined;\n\n // ─── Internal state ───\n\n /**\n * Whether the drawer is in the open state and visible to the user.\n * @internal\n */\n @state()\n private _isOpen = false;\n\n /**\n * Whether the header-actions slot has any assigned content.\n * @internal\n */\n @state()\n private _hasHeaderActionsSlot = false;\n\n /**\n * Whether the footer slot has any assigned content.\n * @internal\n */\n @state()\n private _hasFooterSlot = false;\n\n /**\n * Whether the label slot has any assigned content.\n * @internal\n */\n @state()\n private _hasLabelSlot = false;\n\n /**\n * Cached list of focusable elements within the drawer, used for focus trapping.\n * @internal\n */\n private _cachedFocusableElements: HTMLElement[] = [];\n /**\n * The element that triggered the drawer to open, restored focus when the drawer closes.\n * @internal\n */\n private _triggerElement: HTMLElement | null = null;\n /**\n * Handle for the pending animation end timeout, cleared when the drawer opens or closes again.\n * @internal\n */\n private _animationTimeout: ReturnType<typeof setTimeout> | null = null;\n /** Whether this drawer instance currently holds a body-scroll lock. */\n /** @internal */\n private _hasScrollLock = false;\n /**\n * Elements outside the drawer that were given aria-hidden during open, restored on close.\n * @internal\n */\n private _siblingAriaHiddenElements: Element[] = [];\n\n /**\n * Unique ID for the title element, used by aria-labelledby to link the dialog to its label.\n * @internal\n */\n private readonly _titleId = `hx-drawer-title-${++_hxDrawerIdCounter}`;\n\n // ─── Public Properties ───\n\n /**\n * Controls whether the drawer is open.\n * @attr open\n */\n @property({ type: Boolean, reflect: true })\n open = false;\n\n /**\n * Which edge of the viewport the drawer slides in from.\n * @attr placement\n */\n @property({ type: String, reflect: true })\n placement: DrawerPlacement = 'end';\n\n /**\n * The size of the drawer panel. Use 'sm', 'md', 'lg', 'full', or any valid CSS length.\n * @attr hx-size\n */\n @property({ type: String, reflect: true, attribute: 'hx-size' })\n size: DrawerSize = 'md';\n\n /**\n * When true, the drawer is constrained to its positioned parent instead of the viewport.\n * The host element must have `position: relative` (or the library handles it via :host).\n * @attr contained\n */\n @property({ type: Boolean, reflect: true })\n contained = false;\n\n /**\n * When true, the header (title, header-actions, close button) is hidden.\n * @attr no-header\n */\n @property({ type: Boolean, reflect: true, attribute: 'no-header' })\n noHeader = false;\n\n /**\n * When true, the footer slot is hidden.\n * @attr no-footer\n */\n @property({ type: Boolean, reflect: true, attribute: 'no-footer' })\n noFooter = false;\n\n /**\n * Accessible label for the dialog when the `label` slot is not populated.\n * When the `label` slot is used, `aria-labelledby` takes precedence.\n * @attr label\n */\n @property({ type: String })\n label = '';\n\n /** Accessible label for the built-in close button. Override for localized text. */\n @property({ type: String, attribute: 'close-label' })\n closeLabel = 'Close drawer';\n\n // ─── Lifecycle ───\n\n override connectedCallback(): void {\n super.connectedCallback();\n // Backward compat: accept legacy `size` attribute. When present and `hx-size`\n // is not set, map the value and emit a deprecation warning.\n const legacySize = this.getAttribute('size');\n if (legacySize !== null && !this.hasAttribute('hx-size')) {\n devWarn('hx-drawer', 'The \"size\" attribute is deprecated. Use \"hx-size\" instead.');\n this.size = legacySize as DrawerSize;\n }\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this._removeListeners();\n if (this._animationTimeout !== null) {\n clearTimeout(this._animationTimeout);\n }\n this._restoreBodyScroll();\n }\n\n override updated(changedProperties: PropertyValues<this>): void {\n super.updated(changedProperties);\n\n if (changedProperties.has('open')) {\n if (this.open) {\n this._openDrawer();\n } else {\n this._closeDrawer();\n }\n }\n\n if (changedProperties.has('size')) {\n this._applySizeVar();\n }\n }\n\n // ─── Public Methods ───\n\n /** Opens the drawer. */\n show(): void {\n this.open = true;\n }\n\n /** Closes the drawer. */\n hide(): void {\n this.open = false;\n }\n\n // ─── Private: Size CSS variable ───\n\n /** @internal */\n private _applySizeVar(): void {\n const resolvedSize = DRAWER_SIZE_MAP[this.size as DrawerSizePreset] ?? this.size;\n this.style.setProperty('--_drawer-size', resolvedSize);\n }\n\n // ─── Private: Open / Close ───\n\n /** @internal */\n private _lockBodyScroll(): void {\n if (this.contained || this._hasScrollLock) return;\n // Uses a shared reference-counted lock so that simultaneous hx-dialog / hx-drawer\n // instances don't clobber each other when one closes before the other\n // (see utils/body-scroll-lock.ts).\n lockBodyScroll();\n this._hasScrollLock = true;\n }\n\n /** @internal */\n private _restoreBodyScroll(): void {\n if (!this._hasScrollLock) return;\n unlockBodyScroll();\n this._hasScrollLock = false;\n }\n\n /** @internal */\n private _openDrawer(): void {\n // Capture trigger for focus restoration (P2-04: use instanceof guard)\n const active = document.activeElement;\n this._triggerElement = active instanceof HTMLElement ? active : null;\n\n // P1-05: clear any pending animation timeout before scheduling a new one\n if (this._animationTimeout !== null) {\n clearTimeout(this._animationTimeout);\n this._animationTimeout = null;\n }\n\n this._applySizeVar();\n this._lockBodyScroll();\n this._hideBackgroundFromScreenReaders();\n\n // Dispatch hx-show before visual update\n this.dispatchEvent(new CustomEvent<void>('hx-show', { bubbles: true, composed: true }));\n\n // Transition to open state\n void this.updateComplete\n .then(() => {\n this._isOpen = true;\n this._addListeners();\n\n // Set initial focus after next render\n return this.updateComplete;\n })\n .then(() => {\n this._cachedFocusableElements = this._getFocusableElements();\n this._setInitialFocus();\n\n // Dispatch hx-after-show after animation duration\n const duration = this._getAnimationDuration();\n this._animationTimeout = setTimeout(() => {\n this.dispatchEvent(\n new CustomEvent<void>('hx-after-show', { bubbles: true, composed: true }),\n );\n }, duration);\n })\n .catch(console.error);\n }\n\n /** @internal */\n private _closeDrawer(): void {\n // P1-05: clear any pending animation timeout before scheduling a new one\n if (this._animationTimeout !== null) {\n clearTimeout(this._animationTimeout);\n this._animationTimeout = null;\n }\n\n this._isOpen = false;\n this._removeListeners();\n this._cachedFocusableElements = [];\n this._restoreBodyScroll();\n this._restoreBackgroundForScreenReaders();\n\n this.dispatchEvent(new CustomEvent<void>('hx-hide', { bubbles: true, composed: true }));\n\n // Restore focus to the trigger immediately — before any animation timeout.\n // WCAG 2.4.3: focus must never remain on invisible or inert content.\n if (this._triggerElement && typeof this._triggerElement.focus === 'function') {\n this._triggerElement.focus();\n }\n this._triggerElement = null;\n\n // Animation cleanup only — no focus management inside this timeout.\n const duration = this._getAnimationDuration();\n this._animationTimeout = setTimeout(() => {\n this.dispatchEvent(new CustomEvent<void>('hx-after-hide', { bubbles: true, composed: true }));\n }, duration);\n }\n\n /** @internal */\n private _getAnimationDuration(): number {\n if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) return 0;\n return 300;\n }\n\n // ─── Background aria-hidden management (P1-03) ───\n\n /** @internal */\n private _hideBackgroundFromScreenReaders(): void {\n if (this.contained) return;\n this._siblingAriaHiddenElements = [];\n Array.from(document.body.children).forEach((child) => {\n if (child === this || child.contains(this)) return;\n if (!child.hasAttribute('aria-hidden')) {\n child.setAttribute('aria-hidden', 'true');\n this._siblingAriaHiddenElements.push(child);\n }\n });\n }\n\n /** @internal */\n private _restoreBackgroundForScreenReaders(): void {\n this._siblingAriaHiddenElements.forEach((el) => {\n el.removeAttribute('aria-hidden');\n });\n this._siblingAriaHiddenElements = [];\n }\n\n // ─── Event Listeners (P1-01: use only document listener, not overlay) ───\n\n /** @internal */\n private _addListeners(): void {\n document.addEventListener('keydown', this._handleKeyDown);\n }\n\n /** @internal */\n private _removeListeners(): void {\n document.removeEventListener('keydown', this._handleKeyDown);\n }\n\n // ─── Keyboard Handler ───\n\n /**\n * Handles keyboard events on the document to trap focus and close the drawer on Escape.\n * @internal\n */\n private _handleKeyDown = (e: KeyboardEvent): void => {\n if (!this._isOpen) return;\n\n if (e.key === 'Escape') {\n e.preventDefault();\n this.open = false;\n return;\n }\n\n if (e.key === 'Tab') {\n this._trapFocus(e);\n }\n };\n\n // ─── Focus ───\n\n /** @internal */\n private _setInitialFocus(): void {\n const event = new CustomEvent<void>('hx-initial-focus', {\n bubbles: true,\n composed: true,\n cancelable: true,\n });\n this.dispatchEvent(event);\n\n if (!event.defaultPrevented) {\n const focusable = this._cachedFocusableElements;\n if (focusable.length > 0 && focusable[0]) {\n focusable[0].focus();\n } else {\n this._panelEl?.focus();\n }\n }\n }\n\n /** @internal */\n private _getFocusableElements(): HTMLElement[] {\n const shadowFocusable = Array.from(\n this.shadowRoot?.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTORS) ?? [],\n );\n\n const slots = this.shadowRoot?.querySelectorAll<HTMLSlotElement>('slot') ?? [];\n const lightFocusable: HTMLElement[] = [];\n\n slots.forEach((slot) => {\n slot.assignedElements({ flatten: true }).forEach((el) => {\n if (el instanceof HTMLElement) {\n if (el.matches(FOCUSABLE_SELECTORS)) {\n lightFocusable.push(el);\n }\n el.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTORS).forEach((child) => {\n lightFocusable.push(child);\n });\n }\n });\n });\n\n return [...shadowFocusable, ...lightFocusable].filter(\n (el) => !el.hasAttribute('disabled') && el.getAttribute('tabindex') !== '-1',\n );\n }\n\n /** @internal */\n private _trapFocus(e: KeyboardEvent): void {\n const focusable =\n this._cachedFocusableElements.length > 0\n ? this._cachedFocusableElements\n : this._getFocusableElements();\n\n if (focusable.length === 0) {\n e.preventDefault();\n return;\n }\n\n const [first, ...rest] = focusable;\n const last = rest.length > 0 ? rest[rest.length - 1] : first;\n\n if (!first || !last) return;\n\n // P1-02: Use document.activeElement for reliable detection of slotted (light DOM) elements.\n // shadowRoot.activeElement returns the <slot> host for slotted content, not the actual element.\n const active = document.activeElement as HTMLElement | null;\n\n if (e.shiftKey) {\n if (active === first) {\n e.preventDefault();\n last.focus();\n }\n } else {\n if (active === last) {\n e.preventDefault();\n first.focus();\n }\n }\n }\n\n // ─── Overlay Click ───\n\n /**\n * Handles clicks on the overlay backdrop to close the drawer when the user clicks outside the panel.\n * @internal\n */\n private _handleOverlayClick = (e: MouseEvent): void => {\n // Only close when clicking the overlay itself (backdrop), not the panel\n const target = e.target as HTMLElement;\n if (target === this._overlayEl || target.classList.contains('drawer-backdrop')) {\n this.open = false;\n }\n };\n\n // ─── Slot change handlers ───\n\n /** @internal */\n private _handleHeaderActionsSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasHeaderActionsSlot = slot.assignedNodes({ flatten: true }).length > 0;\n }\n\n /** @internal */\n private _handleFooterSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasFooterSlot = slot.assignedNodes({ flatten: true }).length > 0;\n }\n\n /** @internal */\n private _handleLabelSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasLabelSlot = slot.assignedNodes({ flatten: true }).length > 0;\n }\n\n // ─── Render Helpers ───\n\n /** @internal */\n private _renderHeader() {\n if (this.noHeader) return nothing;\n\n return html`\n <div part=\"header\" class=\"drawer-header\">\n <p part=\"title\" id=${this._titleId} class=\"drawer-title\">\n <slot name=\"label\" @slotchange=${this._handleLabelSlotChange}></slot>\n </p>\n <div class=\"drawer-header-actions\">\n ${this._hasHeaderActionsSlot\n ? html`<slot\n name=\"header-actions\"\n @slotchange=${this._handleHeaderActionsSlotChange}\n ></slot>`\n : html`<slot\n name=\"header-actions\"\n @slotchange=${this._handleHeaderActionsSlotChange}\n style=\"display:none\"\n ></slot>`}\n <button\n part=\"close-btn\"\n class=\"drawer-close-button\"\n aria-label=${this.closeLabel}\n @click=${() => {\n this.open = false;\n }}\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"></line>\n <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"></line>\n </svg>\n </button>\n </div>\n </div>\n `;\n }\n\n /** @internal */\n private _renderFooter() {\n if (this.noFooter) return nothing;\n\n return html`\n <div part=\"footer\" class=\"drawer-footer\" ?hidden=${!this._hasFooterSlot}>\n <slot name=\"footer\" @slotchange=${this._handleFooterSlotChange}></slot>\n </div>\n `;\n }\n\n // ─── Render ───\n\n override render() {\n const overlayClasses = {\n 'drawer-overlay': true,\n 'is-open': this._isOpen,\n };\n\n // P1-06: ensure the dialog always has an accessible name.\n // Priority: aria-labelledby (slot) > aria-label (prop) > aria-label (fallback \"Drawer\")\n const ariaLabelledby = this._hasLabelSlot ? this._titleId : undefined;\n const ariaLabel = !this._hasLabelSlot ? this.label || 'Drawer' : undefined;\n\n return html`\n <div\n part=\"overlay\"\n class=${classMap(overlayClasses)}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby=${ifDefined(ariaLabelledby)}\n aria-label=${ifDefined(ariaLabel)}\n tabindex=\"-1\"\n @click=${this._handleOverlayClick}\n >\n <div class=\"drawer-backdrop\" aria-hidden=\"true\"></div>\n <div part=\"panel\" class=\"drawer-panel\" tabindex=\"-1\">\n ${this._renderHeader()}\n <div part=\"body\" class=\"drawer-body\">\n <slot></slot>\n </div>\n ${this._renderFooter()}\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-drawer': HelixDrawer;\n }\n}\n"],"names":["helixDrawerStyles","css","_hxDrawerIdCounter","DRAWER_SIZE_MAP","FOCUSABLE_SELECTORS","HelixDrawer","LitElement","target","legacySize","changedProperties","resolvedSize","lockBodyScroll","unlockBodyScroll","active","duration","child","el","event","focusable","_a","shadowFocusable","slots","_b","lightFocusable","slot","first","rest","last","nothing","html","overlayClasses","ariaLabelledby","ariaLabel","classMap","ifDefined","tokenStyles","__decorateClass","query","state","property","customElement"],"mappings":";;;;;;AAEO,MAAMA,IAAoBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;A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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { css as h, LitElement as c, html as u } from "lit";
|
|
2
|
-
import { property as l, state as f, query as
|
|
2
|
+
import { property as l, state as f, query as d, customElement as g } from "lit/decorators.js";
|
|
3
3
|
import { tokenStyles as m } from "@helixui/tokens/lit";
|
|
4
|
-
import { computePosition as b, offset as
|
|
4
|
+
import { computePosition as b, offset as v, flip as _, shift as y } from "@floating-ui/dom";
|
|
5
5
|
const w = h`
|
|
6
6
|
:host {
|
|
7
7
|
display: inline-block;
|
|
@@ -32,8 +32,8 @@ const w = h`
|
|
|
32
32
|
opacity: 0;
|
|
33
33
|
pointer-events: none;
|
|
34
34
|
transition:
|
|
35
|
-
opacity
|
|
36
|
-
visibility
|
|
35
|
+
opacity var(--hx-transition-fast, 150ms ease),
|
|
36
|
+
visibility var(--hx-transition-fast, 150ms ease);
|
|
37
37
|
outline: none;
|
|
38
38
|
}
|
|
39
39
|
|
|
@@ -50,22 +50,27 @@ const w = h`
|
|
|
50
50
|
}
|
|
51
51
|
`;
|
|
52
52
|
var x = Object.defineProperty, k = Object.getOwnPropertyDescriptor, a = (e, t, n, i) => {
|
|
53
|
-
for (var s = i > 1 ? void 0 : i ? k(t, n) : t, o = e.length - 1,
|
|
54
|
-
(
|
|
53
|
+
for (var s = i > 1 ? void 0 : i ? k(t, n) : t, o = e.length - 1, p; o >= 0; o--)
|
|
54
|
+
(p = e[o]) && (s = (i ? p(t, n, s) : p(s)) || s);
|
|
55
55
|
return i && s && x(t, n, s), s;
|
|
56
56
|
};
|
|
57
57
|
let r = class extends c {
|
|
58
58
|
constructor() {
|
|
59
|
-
super(...arguments), this.open = !1, this.placement = "bottom-start", this.disabled = !1, this.distance = 4, this._panelVisible = !1, this._panelId = `hx-dropdown-panel-${++r._instanceCounter}
|
|
59
|
+
super(...arguments), this.open = !1, this.placement = "bottom-start", this.disabled = !1, this.distance = 4, this._panelVisible = !1, this._panelId = `hx-dropdown-panel-${++r._instanceCounter}`, this._handleKeydown = (e) => {
|
|
60
|
+
e.key === "Escape" && this.open ? (e.stopPropagation(), this._hide(!0)) : e.key === "Tab" && this.open ? this._hide(!1) : this.open && (e.key === "ArrowDown" || e.key === "ArrowUp" || e.key === "Home" || e.key === "End") && (e.preventDefault(), this._handleMenuNavigation(e.key));
|
|
61
|
+
}, this._handleOutsideClick = (e) => {
|
|
62
|
+
e.composedPath().includes(this) || this._hide();
|
|
63
|
+
};
|
|
60
64
|
}
|
|
61
65
|
// ─── Lifecycle ───
|
|
62
66
|
connectedCallback() {
|
|
63
|
-
super.connectedCallback(), this.
|
|
67
|
+
super.connectedCallback(), this.addEventListener("keydown", this._handleKeydown);
|
|
64
68
|
}
|
|
65
69
|
disconnectedCallback() {
|
|
66
|
-
super.disconnectedCallback(), this.removeEventListener("keydown", this._handleKeydown), document.removeEventListener("click", this._handleOutsideClick);
|
|
70
|
+
super.disconnectedCallback(), this.removeEventListener("keydown", this._handleKeydown), document.removeEventListener("click", this._handleOutsideClick, { capture: !0 });
|
|
67
71
|
}
|
|
68
72
|
// ─── Open/Close ───
|
|
73
|
+
/** @internal */
|
|
69
74
|
async _show() {
|
|
70
75
|
if (this.open || this.disabled) return;
|
|
71
76
|
if (this.open = !0, this._panelVisible = !0, document.addEventListener("click", this._handleOutsideClick, { capture: !0 }), await this.updateComplete, this._panel) {
|
|
@@ -75,21 +80,23 @@ let r = class extends c {
|
|
|
75
80
|
await this._updatePosition(), this.dispatchEvent(new CustomEvent("hx-show", { bubbles: !0, composed: !0 }));
|
|
76
81
|
}
|
|
77
82
|
// P2-02: returnFocus=true only on Escape; Tab should let focus advance naturally.
|
|
83
|
+
/** @internal */
|
|
78
84
|
_hide(e = !0) {
|
|
79
85
|
var t;
|
|
80
|
-
if (this.open && (this.open = !1, this._panelVisible = !1, document.removeEventListener("click", this._handleOutsideClick), this.dispatchEvent(new CustomEvent("hx-hide", { bubbles: !0, composed: !0 })), e)) {
|
|
86
|
+
if (this.open && (this.open = !1, this._panelVisible = !1, document.removeEventListener("click", this._handleOutsideClick, { capture: !0 }), this.dispatchEvent(new CustomEvent("hx-hide", { bubbles: !0, composed: !0 })), e)) {
|
|
81
87
|
const n = (t = this.shadowRoot) == null ? void 0 : t.querySelector('slot[name="trigger"]'), i = n == null ? void 0 : n.assignedElements()[0];
|
|
82
88
|
i == null || i.focus();
|
|
83
89
|
}
|
|
84
90
|
}
|
|
85
91
|
// ─── Positioning ───
|
|
92
|
+
/** @internal */
|
|
86
93
|
async _updatePosition() {
|
|
87
94
|
const e = this._triggerWrapper, t = this._panel;
|
|
88
95
|
if (!e || !t) return;
|
|
89
96
|
const n = this.placement.replace(/^start$/, "left").replace(/^end$/, "right"), { x: i, y: s } = await b(e, t, {
|
|
90
97
|
placement: n,
|
|
91
98
|
strategy: "fixed",
|
|
92
|
-
middleware: [
|
|
99
|
+
middleware: [v(this.distance), _(), y({ padding: 8 })]
|
|
93
100
|
});
|
|
94
101
|
Object.assign(t.style, {
|
|
95
102
|
left: `${i}px`,
|
|
@@ -97,16 +104,16 @@ let r = class extends c {
|
|
|
97
104
|
});
|
|
98
105
|
}
|
|
99
106
|
// ─── Event Handlers ───
|
|
107
|
+
/** @internal */
|
|
100
108
|
_handleTriggerClick(e) {
|
|
101
109
|
e.stopPropagation(), this.open ? this._hide() : this._show();
|
|
102
110
|
}
|
|
111
|
+
/** @internal */
|
|
103
112
|
_handleTriggerKeydown(e) {
|
|
104
113
|
(e.key === "Enter" || e.key === " " || e.key === "ArrowDown") && (e.preventDefault(), this._show());
|
|
105
114
|
}
|
|
106
|
-
_handleKeydown(e) {
|
|
107
|
-
e.key === "Escape" && this.open ? (e.stopPropagation(), this._hide(!0)) : e.key === "Tab" && this.open ? this._hide(!1) : this.open && (e.key === "ArrowDown" || e.key === "ArrowUp" || e.key === "Home" || e.key === "End") && (e.preventDefault(), this._handleMenuNavigation(e.key));
|
|
108
|
-
}
|
|
109
115
|
// P2-01: Move focus among menuitem elements using arrow keys.
|
|
116
|
+
/** @internal */
|
|
110
117
|
_handleMenuNavigation(e) {
|
|
111
118
|
var s;
|
|
112
119
|
const t = this._getFocusableMenuItems();
|
|
@@ -116,6 +123,7 @@ let r = class extends c {
|
|
|
116
123
|
e === "ArrowDown" ? i = n < t.length - 1 ? n + 1 : 0 : e === "ArrowUp" ? i = n > 0 ? n - 1 : t.length - 1 : e === "Home" ? i = 0 : i = t.length - 1, (s = t[i]) == null || s.focus();
|
|
117
124
|
}
|
|
118
125
|
// P0-01 / P2-01: Get focusable menu items from slotted content.
|
|
126
|
+
/** @internal */
|
|
119
127
|
_getFocusableMenuItems() {
|
|
120
128
|
const e = this._panel;
|
|
121
129
|
if (!e) return [];
|
|
@@ -125,6 +133,7 @@ let r = class extends c {
|
|
|
125
133
|
return i;
|
|
126
134
|
}
|
|
127
135
|
// P0-01: Find the first focusable element in slotted panel content.
|
|
136
|
+
/** @internal */
|
|
128
137
|
_getFirstFocusableItem() {
|
|
129
138
|
const e = this._panel;
|
|
130
139
|
if (!e) return null;
|
|
@@ -137,9 +146,7 @@ let r = class extends c {
|
|
|
137
146
|
}
|
|
138
147
|
return null;
|
|
139
148
|
}
|
|
140
|
-
|
|
141
|
-
e.composedPath().includes(this) || this._hide();
|
|
142
|
-
}
|
|
149
|
+
/** @internal */
|
|
143
150
|
_handlePanelClick(e) {
|
|
144
151
|
var o;
|
|
145
152
|
const n = e.target.closest('[role="menuitem"], [data-value]');
|
|
@@ -176,12 +183,14 @@ let r = class extends c {
|
|
|
176
183
|
`;
|
|
177
184
|
}
|
|
178
185
|
// ─── ARIA setup for trigger slot ───
|
|
186
|
+
/** @internal */
|
|
179
187
|
_onTriggerSlotChange() {
|
|
180
188
|
this._setupTriggerAria();
|
|
181
189
|
}
|
|
182
190
|
firstUpdated() {
|
|
183
191
|
this._setupTriggerAria();
|
|
184
192
|
}
|
|
193
|
+
/** @internal */
|
|
185
194
|
_setupTriggerAria() {
|
|
186
195
|
var n;
|
|
187
196
|
const e = (n = this.shadowRoot) == null ? void 0 : n.querySelector('slot[name="trigger"]');
|
|
@@ -215,10 +224,10 @@ a([
|
|
|
215
224
|
f()
|
|
216
225
|
], r.prototype, "_panelVisible", 2);
|
|
217
226
|
a([
|
|
218
|
-
|
|
227
|
+
d('[part="panel"]')
|
|
219
228
|
], r.prototype, "_panel", 2);
|
|
220
229
|
a([
|
|
221
|
-
|
|
230
|
+
d('[part="trigger"]')
|
|
222
231
|
], r.prototype, "_triggerWrapper", 2);
|
|
223
232
|
r = a([
|
|
224
233
|
g("hx-dropdown")
|
|
@@ -226,4 +235,4 @@ r = a([
|
|
|
226
235
|
export {
|
|
227
236
|
r as H
|
|
228
237
|
};
|
|
229
|
-
//# sourceMappingURL=hx-dropdown-
|
|
238
|
+
//# sourceMappingURL=hx-dropdown-Bo0KTM1A.js.map
|