@helixui/library 0.3.4 → 1.0.1
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 +7076 -5902
- package/dist/components/hx-accordion/hx-accordion-item.d.ts +22 -0
- package/dist/components/hx-accordion/hx-accordion-item.d.ts.map +1 -1
- package/dist/components/hx-accordion/hx-accordion.d.ts +8 -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.map +1 -1
- package/dist/components/hx-action-bar/index.js +1 -1
- package/dist/components/hx-alert/hx-alert.d.ts +12 -5
- 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.map +1 -1
- package/dist/components/hx-avatar/index.js +1 -1
- package/dist/components/hx-badge/hx-badge.d.ts +2 -0
- package/dist/components/hx-badge/hx-badge.d.ts.map +1 -1
- package/dist/components/hx-badge/hx-badge.styles.d.ts.map +1 -1
- package/dist/components/hx-badge/index.js +1 -1
- package/dist/components/hx-banner/hx-banner.d.ts +105 -0
- package/dist/components/hx-banner/hx-banner.d.ts.map +1 -0
- package/dist/components/hx-banner/hx-banner.styles.d.ts +2 -0
- package/dist/components/hx-banner/hx-banner.styles.d.ts.map +1 -0
- package/dist/components/hx-banner/index.d.ts +3 -0
- package/dist/components/hx-banner/index.d.ts.map +1 -0
- package/dist/components/hx-banner/index.js +5 -0
- package/dist/components/hx-banner/index.js.map +1 -0
- package/dist/components/hx-breadcrumb/hx-breadcrumb-item.styles.d.ts.map +1 -1
- package/dist/components/hx-breadcrumb/hx-breadcrumb.d.ts +5 -0
- 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 +17 -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-button-group/hx-button-group.d.ts +8 -0
- package/dist/components/hx-button-group/hx-button-group.d.ts.map +1 -1
- package/dist/components/hx-button-group/index.js +1 -1
- package/dist/components/hx-card/hx-card.d.ts +17 -0
- package/dist/components/hx-card/hx-card.d.ts.map +1 -1
- package/dist/components/hx-card/hx-card.styles.d.ts.map +1 -1
- package/dist/components/hx-card/index.js +1 -1
- package/dist/components/hx-carousel/hx-carousel.d.ts +122 -0
- package/dist/components/hx-carousel/hx-carousel.d.ts.map +1 -1
- package/dist/components/hx-carousel/hx-carousel.styles.d.ts.map +1 -1
- package/dist/components/hx-carousel/index.js +1 -1
- package/dist/components/hx-checkbox/hx-checkbox.d.ts +3 -1
- package/dist/components/hx-checkbox/hx-checkbox.d.ts.map +1 -1
- package/dist/components/hx-checkbox/hx-checkbox.styles.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 +5 -1
- 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 +21 -6
- package/dist/components/hx-code-snippet/hx-code-snippet.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 +47 -0
- 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 +24 -0
- 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-container/hx-container.d.ts +3 -1
- package/dist/components/hx-container/hx-container.d.ts.map +1 -1
- package/dist/components/hx-copy-button/hx-copy-button.d.ts +6 -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 +79 -0
- package/dist/components/hx-counter/hx-counter.d.ts.map +1 -0
- package/dist/components/hx-counter/hx-counter.styles.d.ts +2 -0
- package/dist/components/hx-counter/hx-counter.styles.d.ts.map +1 -0
- package/dist/components/hx-counter/index.d.ts +3 -0
- package/dist/components/hx-counter/index.d.ts.map +1 -0
- package/dist/components/hx-counter/index.js +5 -0
- package/dist/components/hx-counter/index.js.map +1 -0
- package/dist/components/hx-data-table/hx-data-table.d.ts +6 -0
- 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 +124 -0
- 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.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 +3 -0
- package/dist/components/hx-divider/hx-divider.d.ts.map +1 -1
- package/dist/components/hx-drawer/hx-drawer.d.ts +54 -1
- 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 +20 -0
- 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 +31 -1
- 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 +12 -0
- 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 +24 -0
- 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-help-text/hx-help-text.d.ts +3 -0
- package/dist/components/hx-help-text/hx-help-text.d.ts.map +1 -1
- package/dist/components/hx-icon-button/hx-icon-button.d.ts.map +1 -1
- package/dist/components/hx-icon-button/hx-icon-button.styles.d.ts.map +1 -1
- package/dist/components/hx-icon-button/index.js +1 -1
- 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 +1 -0
- package/dist/components/hx-menu/hx-menu-item.d.ts.map +1 -1
- package/dist/components/hx-menu/hx-menu.d.ts +13 -0
- 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 +3 -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 -1
- package/dist/components/hx-nav/hx-nav.d.ts.map +1 -1
- package/dist/components/hx-nav/hx-nav.styles.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 +2 -0
- 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 +14 -0
- package/dist/components/hx-overflow-menu/hx-overflow-menu.d.ts.map +1 -1
- package/dist/components/hx-overflow-menu/hx-overflow-menu.styles.d.ts.map +1 -1
- package/dist/components/hx-overflow-menu/index.js +1 -1
- package/dist/components/hx-pagination/hx-pagination.d.ts +5 -0
- package/dist/components/hx-pagination/hx-pagination.d.ts.map +1 -1
- package/dist/components/hx-pagination/hx-pagination.styles.d.ts.map +1 -1
- package/dist/components/hx-pagination/index.js +1 -1
- package/dist/components/hx-popover/hx-popover.d.ts +43 -39
- package/dist/components/hx-popover/hx-popover.d.ts.map +1 -1
- package/dist/components/hx-popover/hx-popover.styles.d.ts.map +1 -1
- package/dist/components/hx-popover/index.js +1 -1
- package/dist/components/hx-progress-bar/hx-progress-bar.d.ts +12 -0
- package/dist/components/hx-progress-bar/hx-progress-bar.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.map +1 -1
- package/dist/components/hx-progress-ring/index.js +1 -1
- package/dist/components/hx-radio-group/hx-radio-group.d.ts +75 -3
- package/dist/components/hx-radio-group/hx-radio-group.d.ts.map +1 -1
- package/dist/components/hx-radio-group/hx-radio.d.ts +3 -1
- 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 +18 -3
- 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 +9 -0
- 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-side-nav.d.ts.map +1 -1
- package/dist/components/hx-side-nav/index.js +1 -1
- package/dist/components/hx-slider/hx-slider.d.ts +2 -0
- package/dist/components/hx-slider/hx-slider.d.ts.map +1 -1
- package/dist/components/hx-slider/index.js +1 -1
- package/dist/components/hx-split-button/hx-split-button.d.ts +16 -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 +44 -0
- 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-stat/hx-stat.d.ts +71 -0
- package/dist/components/hx-stat/hx-stat.d.ts.map +1 -0
- package/dist/components/hx-stat/hx-stat.styles.d.ts +2 -0
- package/dist/components/hx-stat/hx-stat.styles.d.ts.map +1 -0
- package/dist/components/hx-stat/index.d.ts +3 -0
- package/dist/components/hx-stat/index.d.ts.map +1 -0
- package/dist/components/hx-stat/index.js +5 -0
- package/dist/components/hx-stat/index.js.map +1 -0
- package/dist/components/hx-steps/hx-steps.d.ts +5 -0
- 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-structured-list/hx-structured-list.d.ts +2 -0
- package/dist/components/hx-structured-list/hx-structured-list.d.ts.map +1 -1
- package/dist/components/hx-structured-list/index.js +1 -1
- package/dist/components/hx-switch/hx-switch.d.ts +2 -0
- 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 +60 -0
- package/dist/components/hx-table/hx-table.d.ts.map +1 -0
- package/dist/components/hx-table/hx-table.styles.d.ts +9 -0
- package/dist/components/hx-table/hx-table.styles.d.ts.map +1 -0
- package/dist/components/hx-table/hx-tbody.d.ts +23 -0
- package/dist/components/hx-table/hx-tbody.d.ts.map +1 -0
- package/dist/components/hx-table/hx-td.d.ts +46 -0
- package/dist/components/hx-table/hx-td.d.ts.map +1 -0
- package/dist/components/hx-table/hx-tfoot.d.ts +23 -0
- package/dist/components/hx-table/hx-tfoot.d.ts.map +1 -0
- package/dist/components/hx-table/hx-th.d.ts +61 -0
- package/dist/components/hx-table/hx-th.d.ts.map +1 -0
- package/dist/components/hx-table/hx-thead.d.ts +23 -0
- package/dist/components/hx-table/hx-thead.d.ts.map +1 -0
- package/dist/components/hx-table/hx-tr.d.ts +33 -0
- package/dist/components/hx-table/hx-tr.d.ts.map +1 -0
- package/dist/components/hx-table/index.d.ts +9 -0
- package/dist/components/hx-table/index.d.ts.map +1 -0
- package/dist/components/hx-table/index.js +11 -0
- package/dist/components/hx-table/index.js.map +1 -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/hx-tag.styles.d.ts.map +1 -1
- package/dist/components/hx-tag/index.js +1 -1
- package/dist/components/hx-text-input/hx-text-input.d.ts +2 -1
- 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 +14 -0
- 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-time-picker/hx-time-picker.d.ts +83 -1
- package/dist/components/hx-time-picker/hx-time-picker.d.ts.map +1 -1
- package/dist/components/hx-time-picker/index.js +1 -1
- package/dist/components/hx-toast/hx-toast-stack.d.ts +36 -0
- package/dist/components/hx-toast/hx-toast-stack.d.ts.map +1 -0
- package/dist/components/hx-toast/hx-toast.d.ts +10 -52
- 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.d.ts +6 -2
- package/dist/components/hx-toast/index.d.ts.map +1 -1
- package/dist/components/hx-toast/index.js +1 -1
- package/dist/components/hx-toast/toast-factory.d.ts +25 -0
- package/dist/components/hx-toast/toast-factory.d.ts.map +1 -0
- package/dist/components/hx-toggle-button/hx-toggle-button.d.ts +1 -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 +1 -45
- 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.map +1 -1
- package/dist/components/hx-top-nav/index.js +1 -1
- package/dist/components/hx-tree-view/hx-tree-item.d.ts +61 -1
- package/dist/components/hx-tree-view/hx-tree-item.d.ts.map +1 -1
- package/dist/components/hx-tree-view/hx-tree-item.styles.d.ts.map +1 -1
- package/dist/components/hx-tree-view/hx-tree-view.d.ts +16 -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.d.ts +20 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +169 -155
- package/dist/index.js.map +1 -1
- package/dist/shared/body-scroll-lock-VBa5TFP-.js +12 -0
- package/dist/shared/body-scroll-lock-VBa5TFP-.js.map +1 -0
- package/dist/shared/dev-warn-YlwPHjtX.js +6 -0
- package/dist/shared/dev-warn-YlwPHjtX.js.map +1 -0
- package/dist/shared/{hx-accordion-D95XSAft.js → hx-accordion-DT8qHOay.js} +73 -53
- package/dist/shared/hx-accordion-DT8qHOay.js.map +1 -0
- package/dist/shared/{hx-action-bar-B4i9tBCP.js → hx-action-bar-we_WJety.js} +41 -40
- package/dist/shared/hx-action-bar-we_WJety.js.map +1 -0
- package/dist/shared/{hx-alert-BQpT4gL3.js → hx-alert-D6uok29t.js} +95 -28
- package/dist/shared/hx-alert-D6uok29t.js.map +1 -0
- package/dist/shared/{hx-avatar-yHjmNdtf.js → hx-avatar-Cep6Urm3.js} +62 -65
- package/dist/shared/hx-avatar-Cep6Urm3.js.map +1 -0
- package/dist/shared/{hx-badge-CjT0d8NK.js → hx-badge-BeuWuUj_.js} +57 -31
- package/dist/shared/hx-badge-BeuWuUj_.js.map +1 -0
- package/dist/shared/hx-banner-DnCBJtRR.js +353 -0
- package/dist/shared/hx-banner-DnCBJtRR.js.map +1 -0
- package/dist/shared/{hx-breadcrumb-item-DtSxRZ_W.js → hx-breadcrumb-item-Bj2UqhzR.js} +54 -48
- package/dist/shared/hx-breadcrumb-item-Bj2UqhzR.js.map +1 -0
- package/dist/shared/{hx-button-CtiJsmOg.js → hx-button-Cbhqpm5i.js} +111 -28
- package/dist/shared/hx-button-Cbhqpm5i.js.map +1 -0
- package/dist/shared/{hx-button-group-BMV5qFs4.js → hx-button-group-CWjWv-wS.js} +10 -10
- package/dist/shared/hx-button-group-CWjWv-wS.js.map +1 -0
- package/dist/shared/{hx-card-DAkEfpJd.js → hx-card-B9j2SHyI.js} +26 -22
- package/dist/shared/hx-card-B9j2SHyI.js.map +1 -0
- package/dist/shared/{hx-carousel-item-C2yBnM0r.js → hx-carousel-item-Be0bC-7o.js} +150 -98
- package/dist/shared/hx-carousel-item-Be0bC-7o.js.map +1 -0
- package/dist/shared/{hx-checkbox-BMayOpAM.js → hx-checkbox-CuaJqEo7.js} +3 -1
- package/dist/shared/hx-checkbox-CuaJqEo7.js.map +1 -0
- package/dist/shared/{hx-checkbox-group-DTS9iT4b.js → hx-checkbox-group-ydUdV9Sx.js} +7 -7
- package/dist/shared/hx-checkbox-group-ydUdV9Sx.js.map +1 -0
- package/dist/shared/{hx-code-snippet-DdEqy-1B.js → hx-code-snippet-DBwIjl5p.js} +71 -59
- package/dist/shared/hx-code-snippet-DBwIjl5p.js.map +1 -0
- package/dist/shared/{hx-color-picker-K2x_dyeG.js → hx-color-picker-Bb2UPVc3.js} +101 -91
- package/dist/shared/hx-color-picker-Bb2UPVc3.js.map +1 -0
- package/dist/shared/{hx-combobox-DjMigccw.js → hx-combobox-CNvY-es8.js} +104 -65
- package/dist/shared/hx-combobox-CNvY-es8.js.map +1 -0
- package/dist/shared/hx-container-DLUKnTi9.js.map +1 -1
- package/dist/shared/{hx-copy-button-BXL1xkxb.js → hx-copy-button-CLBA31to.js} +45 -50
- package/dist/shared/hx-copy-button-CLBA31to.js.map +1 -0
- package/dist/shared/hx-counter-D-1NXzGs.js +138 -0
- package/dist/shared/hx-counter-D-1NXzGs.js.map +1 -0
- package/dist/shared/{hx-data-table-D3NZvc3P.js → hx-data-table-BwoJCFgs.js} +102 -96
- package/dist/shared/hx-data-table-BwoJCFgs.js.map +1 -0
- package/dist/shared/{hx-date-picker-CIHwx9b3.js → hx-date-picker-DDcIBJir.js} +58 -47
- package/dist/shared/hx-date-picker-DDcIBJir.js.map +1 -0
- package/dist/shared/{hx-dialog-e4CSD8xX.js → hx-dialog-M7so0sRT.js} +33 -25
- package/dist/shared/hx-dialog-M7so0sRT.js.map +1 -0
- package/dist/shared/hx-divider-XgWIz4Mr.js.map +1 -1
- package/dist/shared/{hx-drawer-bTF0nbrg.js → hx-drawer-CYxuhIQ0.js} +53 -45
- package/dist/shared/hx-drawer-CYxuhIQ0.js.map +1 -0
- package/dist/shared/{hx-dropdown-DnjLnkTj.js → hx-dropdown-7cfowTWv.js} +30 -30
- package/dist/shared/hx-dropdown-7cfowTWv.js.map +1 -0
- package/dist/shared/{hx-field-Dz-7M_SC.js → hx-field-CDP8EXuj.js} +22 -19
- package/dist/shared/hx-field-CDP8EXuj.js.map +1 -0
- package/dist/shared/{hx-file-upload-DnYiIhyN.js → hx-file-upload-9HbONfqt.js} +63 -54
- package/dist/shared/hx-file-upload-9HbONfqt.js.map +1 -0
- package/dist/shared/{hx-form-BJeLK34m.js → hx-form-BFv_N1dm.js} +9 -1
- package/dist/shared/{hx-form-BJeLK34m.js.map → hx-form-BFv_N1dm.js.map} +1 -1
- package/dist/shared/hx-help-text-DaOPN1iB.js.map +1 -1
- package/dist/shared/{hx-icon-button-C_fsUJW4.js → hx-icon-button-iu0i_faq.js} +40 -32
- package/dist/shared/hx-icon-button-iu0i_faq.js.map +1 -0
- package/dist/shared/{hx-list-CF-AAnp-.js → hx-list-CdRNgeoP.js} +7 -9
- package/dist/shared/{hx-list-CF-AAnp-.js.map → hx-list-CdRNgeoP.js.map} +1 -1
- package/dist/shared/{hx-menu-divider-Buc5XA9E.js → hx-menu-divider-DR8klkFT.js} +46 -38
- package/dist/shared/hx-menu-divider-DR8klkFT.js.map +1 -0
- package/dist/shared/{hx-meter-qcXl0zCL.js → hx-meter-CZ7lnMra.js} +87 -49
- package/dist/shared/hx-meter-CZ7lnMra.js.map +1 -0
- package/dist/shared/{hx-nav-CWwByFdq.js → hx-nav-DM6-cGKF.js} +97 -95
- package/dist/shared/hx-nav-DM6-cGKF.js.map +1 -0
- package/dist/shared/{hx-nav-item-DItaMWl0.js → hx-nav-item-D54-5eUM.js} +12 -12
- package/dist/shared/hx-nav-item-D54-5eUM.js.map +1 -0
- package/dist/shared/{hx-number-input-CS6_w1lT.js → hx-number-input-BP6TIA92.js} +5 -1
- package/dist/shared/hx-number-input-BP6TIA92.js.map +1 -0
- package/dist/shared/{hx-overflow-menu-CAS1Mlus.js → hx-overflow-menu-CobkjAb8.js} +50 -37
- package/dist/shared/hx-overflow-menu-CobkjAb8.js.map +1 -0
- package/dist/shared/{hx-pagination-DNFgXQm3.js → hx-pagination-10dpXS95.js} +74 -69
- package/dist/shared/hx-pagination-10dpXS95.js.map +1 -0
- package/dist/shared/hx-popover-ULjonbaO.js +269 -0
- package/dist/shared/hx-popover-ULjonbaO.js.map +1 -0
- package/dist/shared/{hx-progress-bar-b3_m1hna.js → hx-progress-bar-CnTibV63.js} +69 -50
- package/dist/shared/hx-progress-bar-CnTibV63.js.map +1 -0
- package/dist/shared/{hx-progress-ring-wOSv2y_I.js → hx-progress-ring-BHJBaXNk.js} +2 -4
- package/dist/shared/hx-progress-ring-BHJBaXNk.js.map +1 -0
- package/dist/shared/{hx-radio-CGtFKls2.js → hx-radio-BnKcRuQu.js} +46 -12
- package/dist/shared/hx-radio-BnKcRuQu.js.map +1 -0
- package/dist/shared/{hx-rating-C4kTOyHF.js → hx-rating-Y_t7Z4qb.js} +104 -67
- package/dist/shared/hx-rating-Y_t7Z4qb.js.map +1 -0
- package/dist/shared/{hx-select-D9bYJcDv.js → hx-select-C50lD7NS.js} +19 -12
- package/dist/shared/hx-select-C50lD7NS.js.map +1 -0
- package/dist/shared/{hx-slider-Duzmuid9.js → hx-slider-CprSNrRi.js} +11 -6
- package/dist/shared/hx-slider-CprSNrRi.js.map +1 -0
- package/dist/shared/{hx-split-button-DhncgAtZ.js → hx-split-button-CHGy4FUc.js} +19 -18
- package/dist/shared/hx-split-button-CHGy4FUc.js.map +1 -0
- package/dist/shared/{hx-split-panel-Cxkeauwe.js → hx-split-panel-DYtB45Tr.js} +16 -8
- package/dist/shared/hx-split-panel-DYtB45Tr.js.map +1 -0
- package/dist/shared/hx-stat-C2wfph8W.js +212 -0
- package/dist/shared/hx-stat-C2wfph8W.js.map +1 -0
- package/dist/shared/{hx-step-nMT0fHEn.js → hx-step-DYoIumpR.js} +29 -29
- package/dist/shared/hx-step-DYoIumpR.js.map +1 -0
- package/dist/shared/{hx-structured-list-CMja1VXz.js → hx-structured-list-CMWllxGg.js} +23 -17
- package/dist/shared/{hx-structured-list-CMja1VXz.js.map → hx-structured-list-CMWllxGg.js.map} +1 -1
- package/dist/shared/{hx-switch-BPvIcDpM.js → hx-switch-DkKchcuP.js} +8 -3
- package/dist/shared/{hx-switch-BPvIcDpM.js.map → hx-switch-DkKchcuP.js.map} +1 -1
- package/dist/shared/{hx-tab-panel-C7h5lRpw.js → hx-tab-panel-BRNcLICw.js} +129 -120
- package/dist/shared/hx-tab-panel-BRNcLICw.js.map +1 -0
- package/dist/shared/{hx-tag-SJJtMlOS.js → hx-tag-B3N-vZ6B.js} +80 -55
- package/dist/shared/hx-tag-B3N-vZ6B.js.map +1 -0
- package/dist/shared/hx-td-CVwCGBYf.js +604 -0
- package/dist/shared/hx-td-CVwCGBYf.js.map +1 -0
- package/dist/shared/{hx-text-input-BUMgOQHX.js → hx-text-input-CCZZbWQ9.js} +10 -6
- package/dist/shared/hx-text-input-CCZZbWQ9.js.map +1 -0
- package/dist/shared/{hx-textarea-B_nmxzhC.js → hx-textarea-BsQdB1Rk.js} +51 -18
- package/dist/shared/hx-textarea-BsQdB1Rk.js.map +1 -0
- package/dist/shared/{hx-time-picker-a-BCkecJ.js → hx-time-picker-CJcIjH3C.js} +65 -54
- package/dist/shared/hx-time-picker-CJcIjH3C.js.map +1 -0
- package/dist/shared/{hx-toggle-button--xCXWRJW.js → hx-toggle-button-D4F1soEM.js} +34 -22
- package/dist/shared/{hx-toggle-button--xCXWRJW.js.map → hx-toggle-button-D4F1soEM.js.map} +1 -1
- package/dist/shared/{hx-tooltip-DN6lMlP5.js → hx-tooltip-Bk1iQRHs.js} +23 -23
- package/dist/shared/hx-tooltip-Bk1iQRHs.js.map +1 -0
- package/dist/shared/{hx-top-nav-8lDKNZUj.js → hx-top-nav-D2bQpns3.js} +43 -30
- package/dist/shared/{hx-top-nav-8lDKNZUj.js.map → hx-top-nav-D2bQpns3.js.map} +1 -1
- package/dist/shared/{hx-tree-item-Cesh_du5.js → hx-tree-item-BobGN76x.js} +202 -120
- package/dist/shared/hx-tree-item-BobGN76x.js.map +1 -0
- package/dist/shared/{hx-toast-ikwh9Y03.js → toast-factory-MvMMreTu.js} +181 -94
- package/dist/shared/toast-factory-MvMMreTu.js.map +1 -0
- package/dist/tools/cem-a11y-analyzer/analyzers/aria-analyzer.d.ts +12 -0
- package/dist/tools/cem-a11y-analyzer/analyzers/aria-analyzer.d.ts.map +1 -0
- package/dist/tools/cem-a11y-analyzer/analyzers/focus-analyzer.d.ts +13 -0
- package/dist/tools/cem-a11y-analyzer/analyzers/focus-analyzer.d.ts.map +1 -0
- package/dist/tools/cem-a11y-analyzer/analyzers/form-analyzer.d.ts +13 -0
- package/dist/tools/cem-a11y-analyzer/analyzers/form-analyzer.d.ts.map +1 -0
- package/dist/tools/cem-a11y-analyzer/analyzers/keyboard-analyzer.d.ts +12 -0
- package/dist/tools/cem-a11y-analyzer/analyzers/keyboard-analyzer.d.ts.map +1 -0
- package/dist/tools/cem-a11y-analyzer/analyzers/label-analyzer.d.ts +13 -0
- package/dist/tools/cem-a11y-analyzer/analyzers/label-analyzer.d.ts.map +1 -0
- package/dist/tools/cem-a11y-analyzer/analyzers/motion-analyzer.d.ts +12 -0
- package/dist/tools/cem-a11y-analyzer/analyzers/motion-analyzer.d.ts.map +1 -0
- package/dist/tools/cem-a11y-analyzer/index.d.ts +14 -0
- package/dist/tools/cem-a11y-analyzer/index.d.ts.map +1 -0
- package/dist/tools/cem-a11y-analyzer/reporter.d.ts +6 -0
- package/dist/tools/cem-a11y-analyzer/reporter.d.ts.map +1 -0
- package/dist/tools/cem-a11y-analyzer/scorer.d.ts +22 -0
- package/dist/tools/cem-a11y-analyzer/scorer.d.ts.map +1 -0
- package/dist/tools/cem-a11y-analyzer/types.d.ts +171 -0
- package/dist/tools/cem-a11y-analyzer/types.d.ts.map +1 -0
- package/dist/utils/body-scroll-lock.d.ts +34 -0
- package/dist/utils/body-scroll-lock.d.ts.map +1 -0
- package/dist/utils/dev-warn.d.ts +19 -0
- package/dist/utils/dev-warn.d.ts.map +1 -0
- package/package.json +1 -1
- package/dist/shared/hx-accordion-D95XSAft.js.map +0 -1
- package/dist/shared/hx-action-bar-B4i9tBCP.js.map +0 -1
- package/dist/shared/hx-alert-BQpT4gL3.js.map +0 -1
- package/dist/shared/hx-avatar-yHjmNdtf.js.map +0 -1
- package/dist/shared/hx-badge-CjT0d8NK.js.map +0 -1
- package/dist/shared/hx-breadcrumb-item-DtSxRZ_W.js.map +0 -1
- package/dist/shared/hx-button-CtiJsmOg.js.map +0 -1
- package/dist/shared/hx-button-group-BMV5qFs4.js.map +0 -1
- package/dist/shared/hx-card-DAkEfpJd.js.map +0 -1
- package/dist/shared/hx-carousel-item-C2yBnM0r.js.map +0 -1
- package/dist/shared/hx-checkbox-BMayOpAM.js.map +0 -1
- package/dist/shared/hx-checkbox-group-DTS9iT4b.js.map +0 -1
- package/dist/shared/hx-code-snippet-DdEqy-1B.js.map +0 -1
- package/dist/shared/hx-color-picker-K2x_dyeG.js.map +0 -1
- package/dist/shared/hx-combobox-DjMigccw.js.map +0 -1
- package/dist/shared/hx-copy-button-BXL1xkxb.js.map +0 -1
- package/dist/shared/hx-data-table-D3NZvc3P.js.map +0 -1
- package/dist/shared/hx-date-picker-CIHwx9b3.js.map +0 -1
- package/dist/shared/hx-dialog-e4CSD8xX.js.map +0 -1
- package/dist/shared/hx-drawer-bTF0nbrg.js.map +0 -1
- package/dist/shared/hx-dropdown-DnjLnkTj.js.map +0 -1
- package/dist/shared/hx-field-Dz-7M_SC.js.map +0 -1
- package/dist/shared/hx-file-upload-DnYiIhyN.js.map +0 -1
- package/dist/shared/hx-icon-button-C_fsUJW4.js.map +0 -1
- package/dist/shared/hx-menu-divider-Buc5XA9E.js.map +0 -1
- package/dist/shared/hx-meter-qcXl0zCL.js.map +0 -1
- package/dist/shared/hx-nav-CWwByFdq.js.map +0 -1
- package/dist/shared/hx-nav-item-DItaMWl0.js.map +0 -1
- package/dist/shared/hx-number-input-CS6_w1lT.js.map +0 -1
- package/dist/shared/hx-overflow-menu-CAS1Mlus.js.map +0 -1
- package/dist/shared/hx-pagination-DNFgXQm3.js.map +0 -1
- package/dist/shared/hx-popover-BjAyLbzp.js +0 -226
- package/dist/shared/hx-popover-BjAyLbzp.js.map +0 -1
- package/dist/shared/hx-progress-bar-b3_m1hna.js.map +0 -1
- package/dist/shared/hx-progress-ring-wOSv2y_I.js.map +0 -1
- package/dist/shared/hx-radio-CGtFKls2.js.map +0 -1
- package/dist/shared/hx-rating-C4kTOyHF.js.map +0 -1
- package/dist/shared/hx-select-D9bYJcDv.js.map +0 -1
- package/dist/shared/hx-slider-Duzmuid9.js.map +0 -1
- package/dist/shared/hx-split-button-DhncgAtZ.js.map +0 -1
- package/dist/shared/hx-split-panel-Cxkeauwe.js.map +0 -1
- package/dist/shared/hx-step-nMT0fHEn.js.map +0 -1
- package/dist/shared/hx-tab-panel-C7h5lRpw.js.map +0 -1
- package/dist/shared/hx-tag-SJJtMlOS.js.map +0 -1
- package/dist/shared/hx-text-input-BUMgOQHX.js.map +0 -1
- package/dist/shared/hx-textarea-B_nmxzhC.js.map +0 -1
- package/dist/shared/hx-time-picker-a-BCkecJ.js.map +0 -1
- package/dist/shared/hx-toast-ikwh9Y03.js.map +0 -1
- package/dist/shared/hx-tooltip-DN6lMlP5.js.map +0 -1
- package/dist/shared/hx-tree-item-Cesh_du5.js.map +0 -1
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
import { css as
|
|
2
|
-
import { property as
|
|
1
|
+
import { css as w, svg as S, LitElement as _, nothing as u, html as E } from "lit";
|
|
2
|
+
import { property as h, customElement as $ } from "lit/decorators.js";
|
|
3
3
|
import { tokenStyles as k } from "@helixui/tokens/lit";
|
|
4
|
-
import { classMap as
|
|
5
|
-
|
|
4
|
+
import { classMap as D } from "lit/directives/class-map.js";
|
|
5
|
+
import { d as A } from "./dev-warn-YlwPHjtX.js";
|
|
6
|
+
const L = w`
|
|
6
7
|
:host {
|
|
7
8
|
display: block;
|
|
8
9
|
font-family: var(--hx-font-family-sans, sans-serif);
|
|
@@ -12,7 +13,7 @@ const A = b`
|
|
|
12
13
|
border-radius: var(--hx-accordion-border-radius, var(--hx-border-radius-md, 0.375rem));
|
|
13
14
|
overflow: hidden;
|
|
14
15
|
}
|
|
15
|
-
`, I =
|
|
16
|
+
`, I = w`
|
|
16
17
|
:host {
|
|
17
18
|
display: block;
|
|
18
19
|
}
|
|
@@ -133,7 +134,7 @@ const A = b`
|
|
|
133
134
|
}
|
|
134
135
|
}
|
|
135
136
|
`;
|
|
136
|
-
var O = Object.defineProperty, P = Object.getOwnPropertyDescriptor,
|
|
137
|
+
var O = Object.defineProperty, P = Object.getOwnPropertyDescriptor, p = (e, r, o, t) => {
|
|
137
138
|
for (var n = t > 1 ? void 0 : t ? P(r, o) : r, i = e.length - 1, a; i >= 0; i--)
|
|
138
139
|
(a = e[i]) && (n = (t ? a(r, o, n) : a(n)) || n);
|
|
139
140
|
return t && n && O(r, o, n), n;
|
|
@@ -154,9 +155,21 @@ const j = S`
|
|
|
154
155
|
<polyline points="6 9 12 15 18 9"></polyline>
|
|
155
156
|
</svg>
|
|
156
157
|
`;
|
|
157
|
-
let
|
|
158
|
+
let s = class extends _ {
|
|
158
159
|
constructor() {
|
|
159
|
-
super(...arguments), this.expanded = !1, this.disabled = !1;
|
|
160
|
+
super(...arguments), this._uid = `hx-accordion-item-${++s._counter}`, this.expanded = !1, this.disabled = !1, this.level = 3;
|
|
161
|
+
}
|
|
162
|
+
// ─── Heading Level Helper ───
|
|
163
|
+
/**
|
|
164
|
+
* Returns a clamped heading level (1–6) for use as `aria-level` on the
|
|
165
|
+
* `<summary>` element. Per the WAI-ARIA APG Accordion pattern, the
|
|
166
|
+
* `<summary>` must be a **direct child** of `<details>` for native
|
|
167
|
+
* disclosure behaviour to work. Instead of wrapping `<summary>` inside
|
|
168
|
+
* an `<h3>` (which breaks the native toggle), we apply
|
|
169
|
+
* `role="heading" aria-level="N"` directly on `<summary>`.
|
|
170
|
+
*/
|
|
171
|
+
get _headingLevel() {
|
|
172
|
+
return Math.max(1, Math.min(6, this.level));
|
|
160
173
|
}
|
|
161
174
|
// ─── Toggle Logic ───
|
|
162
175
|
_toggle() {
|
|
@@ -182,16 +195,18 @@ let l = class extends w {
|
|
|
182
195
|
"item--expanded": this.expanded,
|
|
183
196
|
"item--disabled": this.disabled
|
|
184
197
|
};
|
|
185
|
-
return
|
|
186
|
-
<details part="item" class=${
|
|
198
|
+
return E`
|
|
199
|
+
<details part="item" class=${D(e)} ?open=${this.expanded}>
|
|
187
200
|
<summary
|
|
188
|
-
id
|
|
201
|
+
id=${`${this._uid}-trigger`}
|
|
189
202
|
part="trigger"
|
|
190
203
|
class="trigger"
|
|
204
|
+
role="heading"
|
|
205
|
+
aria-level=${this._headingLevel}
|
|
191
206
|
tabindex=${this.disabled ? "-1" : "0"}
|
|
192
|
-
aria-expanded=${this.expanded ? "true" :
|
|
193
|
-
aria-disabled=${this.disabled ? "true" :
|
|
194
|
-
aria-controls
|
|
207
|
+
aria-expanded=${this.expanded ? "true" : u}
|
|
208
|
+
aria-disabled=${this.disabled ? "true" : u}
|
|
209
|
+
aria-controls=${`${this._uid}-content`}
|
|
195
210
|
@click=${this._handleSummaryClick}
|
|
196
211
|
@keydown=${this._handleKeyDown}
|
|
197
212
|
>
|
|
@@ -201,12 +216,12 @@ let l = class extends w {
|
|
|
201
216
|
<div class="content-wrapper">
|
|
202
217
|
<div class="content-inner">
|
|
203
218
|
<div
|
|
204
|
-
id
|
|
219
|
+
id=${`${this._uid}-content`}
|
|
205
220
|
part="content"
|
|
206
221
|
class="content"
|
|
207
222
|
role="region"
|
|
208
|
-
aria-labelledby
|
|
209
|
-
aria-hidden=${this.expanded ?
|
|
223
|
+
aria-labelledby=${`${this._uid}-trigger`}
|
|
224
|
+
aria-hidden=${this.expanded ? u : "true"}
|
|
210
225
|
>
|
|
211
226
|
<slot></slot>
|
|
212
227
|
</div>
|
|
@@ -216,22 +231,26 @@ let l = class extends w {
|
|
|
216
231
|
`;
|
|
217
232
|
}
|
|
218
233
|
};
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
234
|
+
s.styles = [k, I];
|
|
235
|
+
s._counter = 0;
|
|
236
|
+
p([
|
|
237
|
+
h({ type: Boolean, reflect: !0 })
|
|
238
|
+
], s.prototype, "expanded", 2);
|
|
239
|
+
p([
|
|
240
|
+
h({ type: Boolean, reflect: !0 })
|
|
241
|
+
], s.prototype, "disabled", 2);
|
|
242
|
+
p([
|
|
243
|
+
h({ type: Number })
|
|
244
|
+
], s.prototype, "level", 2);
|
|
245
|
+
s = p([
|
|
246
|
+
$("hx-accordion-item")
|
|
247
|
+
], s);
|
|
248
|
+
var q = Object.defineProperty, R = Object.getOwnPropertyDescriptor, C = (e, r, o, t) => {
|
|
249
|
+
for (var n = t > 1 ? void 0 : t ? R(r, o) : r, i = e.length - 1, a; i >= 0; i--)
|
|
231
250
|
(a = e[i]) && (n = (t ? a(r, o, n) : a(n)) || n);
|
|
232
|
-
return t && n &&
|
|
251
|
+
return t && n && q(r, o, n), n;
|
|
233
252
|
};
|
|
234
|
-
let c = class extends
|
|
253
|
+
let c = class extends _ {
|
|
235
254
|
constructor() {
|
|
236
255
|
super(...arguments), this.mode = "single", this._handleChildExpand = (e) => {
|
|
237
256
|
if (this.mode !== "single") return;
|
|
@@ -240,41 +259,41 @@ let c = class extends w {
|
|
|
240
259
|
t !== r && t.expanded && (t.expanded = !1, t._dispatchToggleEvent(!1));
|
|
241
260
|
});
|
|
242
261
|
}, this._handleKeyDown = (e) => {
|
|
243
|
-
var f,
|
|
262
|
+
var f, v, x, y;
|
|
244
263
|
if (this._getTriggers().length === 0) return;
|
|
245
264
|
const o = ((f = this.shadowRoot) == null ? void 0 : f.activeElement) ?? document.activeElement;
|
|
246
265
|
let t = null;
|
|
247
266
|
const n = Array.from(this.querySelectorAll("hx-accordion-item"));
|
|
248
|
-
for (const
|
|
249
|
-
const
|
|
250
|
-
if (
|
|
251
|
-
t =
|
|
267
|
+
for (const l of n) {
|
|
268
|
+
const b = (v = l.shadowRoot) == null ? void 0 : v.querySelector('[part="trigger"]');
|
|
269
|
+
if (b === o || ((x = l.shadowRoot) == null ? void 0 : x.activeElement) === b) {
|
|
270
|
+
t = l;
|
|
252
271
|
break;
|
|
253
272
|
}
|
|
254
273
|
}
|
|
255
274
|
if (!t) return;
|
|
256
|
-
const i = n.filter((
|
|
275
|
+
const i = n.filter((l) => !l.disabled), a = i.indexOf(t);
|
|
257
276
|
if (a === -1) return;
|
|
258
|
-
let
|
|
277
|
+
let d = -1;
|
|
259
278
|
switch (e.key) {
|
|
260
279
|
case "ArrowDown":
|
|
261
|
-
|
|
280
|
+
d = (a + 1) % i.length;
|
|
262
281
|
break;
|
|
263
282
|
case "ArrowUp":
|
|
264
|
-
|
|
283
|
+
d = (a - 1 + i.length) % i.length;
|
|
265
284
|
break;
|
|
266
285
|
case "Home":
|
|
267
|
-
|
|
286
|
+
d = 0;
|
|
268
287
|
break;
|
|
269
288
|
case "End":
|
|
270
|
-
|
|
289
|
+
d = i.length - 1;
|
|
271
290
|
break;
|
|
272
291
|
default:
|
|
273
292
|
return;
|
|
274
293
|
}
|
|
275
294
|
e.preventDefault();
|
|
276
|
-
const
|
|
277
|
-
|
|
295
|
+
const g = i[d], m = (y = g == null ? void 0 : g.shadowRoot) == null ? void 0 : y.querySelector('[part="trigger"]');
|
|
296
|
+
m == null || m.focus();
|
|
278
297
|
};
|
|
279
298
|
}
|
|
280
299
|
// ─── Lifecycle ───
|
|
@@ -300,7 +319,7 @@ let c = class extends w {
|
|
|
300
319
|
const e = this.querySelectorAll("hx-accordion-item"), r = [];
|
|
301
320
|
return e.forEach((o) => {
|
|
302
321
|
var n;
|
|
303
|
-
const t = (n = o.shadowRoot) == null ? void 0 : n.querySelector("
|
|
322
|
+
const t = (n = o.shadowRoot) == null ? void 0 : n.querySelector('[part="trigger"]');
|
|
304
323
|
t && r.push(t);
|
|
305
324
|
}), r;
|
|
306
325
|
}
|
|
@@ -309,28 +328,29 @@ let c = class extends w {
|
|
|
309
328
|
const r = e.target;
|
|
310
329
|
if (!(r instanceof HTMLSlotElement)) return;
|
|
311
330
|
const o = r.assignedElements().filter((t) => t.tagName.toLowerCase() !== "hx-accordion-item");
|
|
312
|
-
o.length > 0 &&
|
|
313
|
-
|
|
331
|
+
o.length > 0 && A(
|
|
332
|
+
"hx-accordion",
|
|
333
|
+
`Default slot expects <hx-accordion-item> elements. Found unexpected: ${o.map((t) => `<${t.tagName.toLowerCase()}>`).join(", ")}`
|
|
314
334
|
);
|
|
315
335
|
}
|
|
316
336
|
// ─── Render ───
|
|
317
337
|
render() {
|
|
318
|
-
return
|
|
338
|
+
return E`
|
|
319
339
|
<div part="accordion" class="accordion">
|
|
320
340
|
<slot @slotchange=${this._handleSlotChange}></slot>
|
|
321
341
|
</div>
|
|
322
342
|
`;
|
|
323
343
|
}
|
|
324
344
|
};
|
|
325
|
-
c.styles = [k,
|
|
345
|
+
c.styles = [k, L];
|
|
326
346
|
C([
|
|
327
|
-
|
|
347
|
+
h({ type: String, reflect: !0 })
|
|
328
348
|
], c.prototype, "mode", 2);
|
|
329
349
|
c = C([
|
|
330
|
-
|
|
350
|
+
$("hx-accordion")
|
|
331
351
|
], c);
|
|
332
352
|
export {
|
|
333
353
|
c as H,
|
|
334
|
-
|
|
354
|
+
s as a
|
|
335
355
|
};
|
|
336
|
-
//# sourceMappingURL=hx-accordion-
|
|
356
|
+
//# sourceMappingURL=hx-accordion-DT8qHOay.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hx-accordion-DT8qHOay.js","sources":["../../src/components/hx-accordion/hx-accordion.styles.ts","../../src/components/hx-accordion/hx-accordion-item.styles.ts","../../src/components/hx-accordion/hx-accordion-item.ts","../../src/components/hx-accordion/hx-accordion.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixAccordionStyles = css`\n :host {\n display: block;\n font-family: var(--hx-font-family-sans, sans-serif);\n }\n\n .accordion {\n border-radius: var(--hx-accordion-border-radius, var(--hx-border-radius-md, 0.375rem));\n overflow: hidden;\n }\n`;\n","import { css } from 'lit';\n\nexport const helixAccordionItemStyles = css`\n :host {\n display: block;\n }\n\n .item {\n border-bottom: var(--hx-border-width-thin, 1px) solid\n var(--hx-accordion-border-color, var(--hx-color-neutral-200, #dee2e6));\n font-family: var(--hx-font-family-sans, sans-serif);\n }\n\n :host(:first-child) .item {\n border-top: var(--hx-border-width-thin, 1px) solid\n var(--hx-accordion-border-color, var(--hx-color-neutral-200, #dee2e6));\n }\n\n /* Remove native details marker */\n .trigger {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--hx-space-3, 0.75rem);\n padding: var(--hx-accordion-trigger-padding, var(--hx-space-4, 1rem));\n cursor: pointer;\n list-style: none;\n font-size: var(--hx-font-size-md, 1rem);\n font-weight: var(--hx-font-weight-semibold, 600);\n color: var(--hx-accordion-trigger-color, var(--hx-color-neutral-800, #212529));\n background-color: var(--hx-accordion-trigger-bg, transparent);\n user-select: none;\n transition: background-color var(--hx-transition-fast, 150ms ease);\n }\n\n /* Hide the native details disclosure triangle */\n .trigger::-webkit-details-marker {\n display: none;\n }\n\n .trigger::marker {\n display: none;\n }\n\n .item--disabled .trigger {\n cursor: not-allowed;\n }\n\n :host(:not([disabled])) .trigger:hover {\n background-color: var(--hx-accordion-trigger-hover-bg, var(--hx-color-neutral-50, #f8f9fa));\n }\n\n .trigger:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-focus-ring-color, var(--hx-color-primary-500, #2563eb));\n outline-offset: var(--hx-focus-ring-offset, -2px);\n }\n\n /* ─── Icon ─── */\n\n .icon {\n flex-shrink: 0;\n width: 1.25rem;\n height: 1.25rem;\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--hx-accordion-icon-color, var(--hx-color-neutral-500, #6c757d));\n transition: transform var(--hx-transition-normal, 250ms ease);\n }\n\n .item--expanded .icon {\n transform: rotate(180deg);\n }\n\n /* ─── Content animation via CSS grid trick ─── */\n\n .content-wrapper {\n display: grid;\n grid-template-rows: 0fr;\n transition: grid-template-rows var(--hx-transition-normal, 250ms ease);\n overflow: hidden;\n }\n\n .item--expanded .content-wrapper,\n details[open]:not(.item--expanded) .content-wrapper {\n grid-template-rows: 1fr;\n }\n\n .content-inner {\n overflow: hidden;\n }\n\n .content {\n padding: var(--hx-accordion-content-padding, 0 var(--hx-space-4, 1rem) var(--hx-space-4, 1rem));\n font-size: var(--hx-font-size-md, 1rem);\n line-height: var(--hx-line-height-normal, 1.5);\n color: var(--hx-accordion-content-color, var(--hx-color-neutral-600, #495057));\n }\n\n /* ─── Disabled host ─── */\n\n :host([disabled]) {\n pointer-events: none;\n opacity: 0.5;\n }\n\n /* ─── Reduced motion ─── */\n\n @media (prefers-reduced-motion: reduce) {\n .trigger {\n transition: none;\n }\n\n .icon {\n transition: none;\n }\n\n .content-wrapper {\n transition: none;\n }\n }\n`;\n","import { LitElement, html, svg, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixAccordionItemStyles } from './hx-accordion-item.styles.js';\n\nconst chevronIcon = svg`\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 <polyline points=\"6 9 12 15 18 9\"></polyline>\n </svg>\n`;\n\n/**\n * An individual accordion item with collapsible content.\n *\n * @summary Collapsible panel that can be expanded or collapsed.\n *\n * @tag hx-accordion-item\n *\n * @slot trigger - The heading/trigger content for this item.\n * @slot - Default slot for the collapsible body content.\n *\n * @attr {number} level - Heading level (1–6) for the trigger via `role=\"heading\" aria-level`.\n * Defaults to 3. Set this to match the document outline — e.g., use `level=\"2\"` when the\n * accordion appears under an `<h1>` landmark.\n *\n * @fires {CustomEvent<{expanded: boolean, itemId: string}>} hx-expand - Dispatched when the item is expanded.\n * @fires {CustomEvent<{expanded: boolean, itemId: string}>} hx-collapse - Dispatched when the item is collapsed.\n *\n * @csspart item - The outer details element container.\n * @csspart trigger - The summary/trigger element.\n * @csspart content - The collapsible content area.\n * @csspart icon - The expand/collapse icon.\n *\n * @cssprop [--hx-accordion-border-color=var(--hx-color-neutral-200)] - Border color between items.\n * @cssprop [--hx-accordion-trigger-padding=var(--hx-space-4)] - Trigger padding.\n * @cssprop [--hx-accordion-trigger-color=var(--hx-color-neutral-800)] - Trigger text color.\n * @cssprop [--hx-accordion-trigger-bg=transparent] - Trigger background color.\n * @cssprop [--hx-accordion-trigger-hover-bg=var(--hx-color-neutral-50)] - Trigger hover background.\n * @cssprop [--hx-accordion-icon-color=var(--hx-color-neutral-500)] - Icon color.\n * @cssprop [--hx-accordion-content-padding=0 var(--hx-space-4) var(--hx-space-4)] - Content padding.\n * @cssprop [--hx-accordion-content-color=var(--hx-color-neutral-600)] - Content text color.\n */\n@customElement('hx-accordion-item')\nexport class HelixAccordionItem extends LitElement {\n static override styles = [tokenStyles, helixAccordionItemStyles];\n\n private static _counter = 0;\n private _uid = `hx-accordion-item-${++HelixAccordionItem._counter}`;\n\n /**\n * Whether this item is expanded.\n * @attr expanded\n */\n @property({ type: Boolean, reflect: true })\n expanded = false;\n\n /**\n * Whether this item is disabled (cannot be toggled).\n * @attr disabled\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * Heading level (1–6) applied via `role=\"heading\" aria-level` on the summary\n * trigger. Defaults to 3. Set to match the document outline around the\n * accordion so screen readers surface accordion items in the heading list.\n * @attr level\n */\n @property({ type: Number })\n level: 1 | 2 | 3 | 4 | 5 | 6 = 3;\n\n // ─── Heading Level Helper ───\n\n /**\n * Returns a clamped heading level (1–6) for use as `aria-level` on the\n * `<summary>` element. Per the WAI-ARIA APG Accordion pattern, the\n * `<summary>` must be a **direct child** of `<details>` for native\n * disclosure behaviour to work. Instead of wrapping `<summary>` inside\n * an `<h3>` (which breaks the native toggle), we apply\n * `role=\"heading\" aria-level=\"N\"` directly on `<summary>`.\n */\n private get _headingLevel(): number {\n return Math.max(1, Math.min(6, this.level));\n }\n\n // ─── Toggle Logic ───\n\n private _toggle(): void {\n if (this.disabled) return;\n\n const willExpand = !this.expanded;\n this.expanded = willExpand;\n\n this._dispatchToggleEvent(willExpand);\n }\n\n _dispatchToggleEvent(expanded: boolean): void {\n const detail = { expanded, itemId: this.id || '' };\n const options = { bubbles: true, composed: true, detail };\n\n if (expanded) {\n this.dispatchEvent(new CustomEvent('hx-expand', options));\n } else {\n this.dispatchEvent(new CustomEvent('hx-collapse', options));\n }\n }\n\n // ─── Event Handlers ───\n\n private _handleSummaryClick(e: MouseEvent): void {\n e.preventDefault();\n this._toggle();\n }\n\n private _handleKeyDown(e: KeyboardEvent): void {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n this._toggle();\n }\n }\n\n // ─── Render ───\n\n override render() {\n const itemClasses = {\n item: true,\n 'item--expanded': this.expanded,\n 'item--disabled': this.disabled,\n };\n\n return html`\n <details part=\"item\" class=${classMap(itemClasses)} ?open=${this.expanded}>\n <summary\n id=${`${this._uid}-trigger`}\n part=\"trigger\"\n class=\"trigger\"\n role=\"heading\"\n aria-level=${this._headingLevel}\n tabindex=${this.disabled ? '-1' : '0'}\n aria-expanded=${this.expanded ? 'true' : nothing}\n aria-disabled=${this.disabled ? 'true' : nothing}\n aria-controls=${`${this._uid}-content`}\n @click=${this._handleSummaryClick}\n @keydown=${this._handleKeyDown}\n >\n <slot name=\"trigger\"></slot>\n <span part=\"icon\" class=\"icon\">${chevronIcon}</span>\n </summary>\n <div class=\"content-wrapper\">\n <div class=\"content-inner\">\n <div\n id=${`${this._uid}-content`}\n part=\"content\"\n class=\"content\"\n role=\"region\"\n aria-labelledby=${`${this._uid}-trigger`}\n aria-hidden=${this.expanded ? nothing : 'true'}\n >\n <slot></slot>\n </div>\n </div>\n </div>\n </details>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-accordion-item': HelixAccordionItem;\n }\n}\n","import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixAccordionStyles } from './hx-accordion.styles.js';\nimport './hx-accordion-item.js';\nimport type { HelixAccordionItem } from './hx-accordion-item.js';\nimport { devWarn } from '../../utils/dev-warn.js';\n\n/**\n * An accordion container that manages collapsible content sections.\n *\n * @summary Collapsible content sections with single or multi-expand modes.\n *\n * @tag hx-accordion\n *\n * @slot - Default slot for hx-accordion-item elements.\n *\n * @csspart accordion - The outer container wrapping all accordion items.\n *\n * @cssprop [--hx-accordion-border-radius=var(--hx-border-radius-md)] - Outer border radius.\n *\n * @example\n * ```html\n * <hx-accordion mode=\"single\">\n * <hx-accordion-item>\n * <span slot=\"trigger\">What is this?</span>\n * <p>Answer content here.</p>\n * </hx-accordion-item>\n * </hx-accordion>\n * ```\n */\n@customElement('hx-accordion')\nexport class HelixAccordion extends LitElement {\n static override styles = [tokenStyles, helixAccordionStyles];\n\n /**\n * Expansion mode: 'single' collapses all other items when one expands.\n * 'multi' allows multiple items open simultaneously.\n * @attr mode\n */\n @property({ type: String, reflect: true })\n mode: 'single' | 'multi' = 'single';\n\n // ─── Lifecycle ───\n\n override connectedCallback(): void {\n super.connectedCallback();\n this.addEventListener('hx-expand', this._handleChildExpand);\n this.addEventListener('keydown', this._handleKeyDown);\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.removeEventListener('hx-expand', this._handleChildExpand);\n this.removeEventListener('keydown', this._handleKeyDown);\n }\n\n protected override firstUpdated(): void {\n this._enforceSingleMode();\n }\n\n // ─── Single-expand coordination ───\n\n private _enforceSingleMode(): void {\n if (this.mode !== 'single') return;\n\n const items = this.querySelectorAll<HelixAccordionItem>('hx-accordion-item');\n let foundExpanded = false;\n\n items.forEach((item) => {\n if (item.expanded) {\n if (foundExpanded) {\n item.expanded = false;\n } else {\n foundExpanded = true;\n }\n }\n });\n }\n\n /**\n * Handles expand events from child accordion items to enforce single-expand mode.\n * @internal\n */\n private _handleChildExpand = (e: Event): void => {\n if (this.mode !== 'single') return;\n\n const expandedItem = e.composedPath()[0] as HelixAccordionItem;\n const items = this.querySelectorAll<HelixAccordionItem>('hx-accordion-item');\n\n items.forEach((item) => {\n if (item !== expandedItem && item.expanded) {\n item.expanded = false;\n item._dispatchToggleEvent(false);\n }\n });\n };\n\n // ─── Arrow key navigation (ARIA APG Accordion pattern) ───\n\n /**\n * Handles keyboard navigation between accordion triggers using arrow, Home, and End keys.\n * @internal\n */\n private _handleKeyDown = (e: KeyboardEvent): void => {\n const triggers = this._getTriggers();\n if (triggers.length === 0) return;\n\n const activeEl = this.shadowRoot?.activeElement ?? document.activeElement;\n let currentItem: HelixAccordionItem | null = null;\n\n const items = Array.from(this.querySelectorAll<HelixAccordionItem>('hx-accordion-item'));\n for (const item of items) {\n const summary = item.shadowRoot?.querySelector('[part=\"trigger\"]');\n if (summary === activeEl || item.shadowRoot?.activeElement === summary) {\n currentItem = item;\n break;\n }\n }\n\n if (!currentItem) return;\n\n const enabledItems = items.filter((item) => !item.disabled);\n const currentIndex = enabledItems.indexOf(currentItem);\n if (currentIndex === -1) return;\n\n let targetIndex = -1;\n\n switch (e.key) {\n case 'ArrowDown':\n targetIndex = (currentIndex + 1) % enabledItems.length;\n break;\n case 'ArrowUp':\n targetIndex = (currentIndex - 1 + enabledItems.length) % enabledItems.length;\n break;\n case 'Home':\n targetIndex = 0;\n break;\n case 'End':\n targetIndex = enabledItems.length - 1;\n break;\n default:\n return;\n }\n\n e.preventDefault();\n const targetItem = enabledItems[targetIndex];\n const targetSummary = targetItem?.shadowRoot?.querySelector<HTMLElement>('[part=\"trigger\"]');\n targetSummary?.focus();\n };\n\n private _getTriggers(): HTMLElement[] {\n const items = this.querySelectorAll<HelixAccordionItem>('hx-accordion-item');\n const triggers: HTMLElement[] = [];\n items.forEach((item) => {\n const summary = item.shadowRoot?.querySelector<HTMLElement>('[part=\"trigger\"]');\n if (summary) triggers.push(summary);\n });\n return triggers;\n }\n\n // ─── Slot validation ───\n\n private _handleSlotChange(e: Event): void {\n const slot = e.target;\n if (!(slot instanceof HTMLSlotElement)) return;\n const invalid = slot\n .assignedElements()\n .filter((el) => el.tagName.toLowerCase() !== 'hx-accordion-item');\n if (invalid.length > 0) {\n devWarn(\n 'hx-accordion',\n `Default slot expects <hx-accordion-item> elements. Found unexpected: ${invalid.map((el) => `<${el.tagName.toLowerCase()}>`).join(', ')}`,\n );\n }\n }\n\n // ─── Render ───\n\n override render() {\n return html`\n <div part=\"accordion\" class=\"accordion\">\n <slot @slotchange=${this._handleSlotChange}></slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-accordion': HelixAccordion;\n }\n}\n"],"names":["helixAccordionStyles","css","helixAccordionItemStyles","chevronIcon","svg","HelixAccordionItem","LitElement","willExpand","expanded","options","itemClasses","html","classMap","nothing","tokenStyles","__decorateClass","property","customElement","HelixAccordion","expandedItem","item","activeEl","_a","currentItem","items","summary","_b","_c","enabledItems","currentIndex","targetIndex","targetItem","targetSummary","_d","foundExpanded","triggers","slot","invalid","el","devWarn"],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { css as d, LitElement as b, html as f } from "lit";
|
|
2
|
-
import { property as
|
|
2
|
+
import { property as c, state as p, customElement as u } from "lit/decorators.js";
|
|
3
3
|
import { tokenStyles as v } from "@helixui/tokens/lit";
|
|
4
|
+
import { d as m } from "./dev-warn-YlwPHjtX.js";
|
|
4
5
|
const x = d`
|
|
5
6
|
:host {
|
|
6
7
|
display: block;
|
|
@@ -119,27 +120,27 @@ const x = d`
|
|
|
119
120
|
flex-shrink: 0;
|
|
120
121
|
}
|
|
121
122
|
`;
|
|
122
|
-
var
|
|
123
|
-
for (var i =
|
|
124
|
-
(r = t[o]) && (i = (
|
|
125
|
-
return
|
|
123
|
+
var g = Object.defineProperty, y = Object.getOwnPropertyDescriptor, l = (t, e, a, s) => {
|
|
124
|
+
for (var i = s > 1 ? void 0 : s ? y(e, a) : e, o = t.length - 1, r; o >= 0; o--)
|
|
125
|
+
(r = t[o]) && (i = (s ? r(e, a, i) : r(i)) || i);
|
|
126
|
+
return s && i && g(e, a, i), i;
|
|
126
127
|
};
|
|
127
128
|
let n = class extends b {
|
|
128
129
|
constructor() {
|
|
129
130
|
super(...arguments), this.size = "md", this.variant = "default", this.position = "top", this._sticky = !1, this.ariaLabel = "Actions", this._focusableCache = null, this._hasOverflow = !1, this._handleKeydown = (t) => {
|
|
130
|
-
var e,
|
|
131
|
+
var e, a;
|
|
131
132
|
if (t.key === "ArrowRight")
|
|
132
133
|
t.preventDefault(), this._moveFocus("next");
|
|
133
134
|
else if (t.key === "ArrowLeft")
|
|
134
135
|
t.preventDefault(), this._moveFocus("prev");
|
|
135
136
|
else if (t.key === "Home") {
|
|
136
137
|
t.preventDefault();
|
|
137
|
-
const
|
|
138
|
-
|
|
138
|
+
const s = this._getFocusableItems();
|
|
139
|
+
s.length && (s.forEach((i, o) => i.setAttribute("tabindex", o === 0 ? "0" : "-1")), (e = s[0]) == null || e.focus());
|
|
139
140
|
} else if (t.key === "End") {
|
|
140
141
|
t.preventDefault();
|
|
141
|
-
const
|
|
142
|
-
|
|
142
|
+
const s = this._getFocusableItems(), i = s.length - 1;
|
|
143
|
+
s.length && (s.forEach((o, r) => o.setAttribute("tabindex", r === i ? "0" : "-1")), (a = s[i]) == null || a.focus());
|
|
143
144
|
}
|
|
144
145
|
};
|
|
145
146
|
}
|
|
@@ -147,14 +148,14 @@ let n = class extends b {
|
|
|
147
148
|
return this._sticky;
|
|
148
149
|
}
|
|
149
150
|
set sticky(t) {
|
|
150
|
-
t && console.warn(
|
|
151
|
-
'[hx-action-bar] The `sticky` property is deprecated. Use `position="sticky"` instead.'
|
|
152
|
-
);
|
|
153
151
|
const e = this._sticky;
|
|
154
152
|
this._sticky = t, this.requestUpdate("sticky", e);
|
|
155
153
|
}
|
|
156
154
|
connectedCallback() {
|
|
157
|
-
super.connectedCallback(), this.hasAttribute("role")
|
|
155
|
+
super.connectedCallback(), this.hasAttribute("role") ? this.getAttribute("role") !== "none" && m(
|
|
156
|
+
"hx-action-bar",
|
|
157
|
+
`Setting role="${this.getAttribute("role")}" on the host creates a duplicate toolbar announcement. The shadow DOM already contains role="toolbar". Set role="none" on the host to suppress it.`
|
|
158
|
+
) : this.setAttribute("role", "none"), this.addEventListener("keydown", this._handleKeydown);
|
|
158
159
|
}
|
|
159
160
|
firstUpdated() {
|
|
160
161
|
this._initRovingTabindex();
|
|
@@ -166,15 +167,15 @@ let n = class extends b {
|
|
|
166
167
|
_isFocusable(t) {
|
|
167
168
|
if (t.hasAttribute("disabled") || t.disabled === !0) return !1;
|
|
168
169
|
if (t.tabIndex >= 0) return !0;
|
|
169
|
-
const
|
|
170
|
-
return
|
|
170
|
+
const a = t.tagName.toLowerCase();
|
|
171
|
+
return a === "button" || a === "input" || a === "select" || a === "textarea";
|
|
171
172
|
}
|
|
172
173
|
_getFocusableItems() {
|
|
173
|
-
var
|
|
174
|
+
var a;
|
|
174
175
|
if (this._focusableCache) return this._focusableCache;
|
|
175
|
-
const t = ((
|
|
176
|
-
for (const
|
|
177
|
-
const i =
|
|
176
|
+
const t = ((a = this.shadowRoot) == null ? void 0 : a.querySelectorAll("slot")) ?? [], e = [];
|
|
177
|
+
for (const s of Array.from(t)) {
|
|
178
|
+
const i = s.assignedElements({ flatten: !0 });
|
|
178
179
|
for (const o of i)
|
|
179
180
|
if (o instanceof HTMLElement)
|
|
180
181
|
if (this._isFocusable(o))
|
|
@@ -192,17 +193,17 @@ let n = class extends b {
|
|
|
192
193
|
this._focusableCache = null;
|
|
193
194
|
const t = this._getFocusableItems();
|
|
194
195
|
if (!t.length) return;
|
|
195
|
-
t.some((
|
|
196
|
-
|
|
197
|
-
}) : t.forEach((
|
|
196
|
+
t.some((a) => a.getAttribute("tabindex") === "0") ? t.forEach((a) => {
|
|
197
|
+
a.getAttribute("tabindex") === null && a.setAttribute("tabindex", "-1");
|
|
198
|
+
}) : t.forEach((a, s) => a.setAttribute("tabindex", s === 0 ? "0" : "-1"));
|
|
198
199
|
}
|
|
199
200
|
_moveFocus(t) {
|
|
200
201
|
var o;
|
|
201
202
|
const e = this._getFocusableItems();
|
|
202
203
|
if (!e.length) return;
|
|
203
|
-
const
|
|
204
|
+
const a = document.activeElement, s = e.indexOf(a);
|
|
204
205
|
let i;
|
|
205
|
-
t === "next" ? i =
|
|
206
|
+
t === "next" ? i = s < e.length - 1 ? s + 1 : 0 : i = s > 0 ? s - 1 : e.length - 1, e.forEach((r, h) => {
|
|
206
207
|
r.setAttribute("tabindex", h === i ? "0" : "-1");
|
|
207
208
|
}), (o = e[i]) == null || o.focus();
|
|
208
209
|
}
|
|
@@ -213,14 +214,14 @@ let n = class extends b {
|
|
|
213
214
|
}
|
|
214
215
|
// ─── Render ───
|
|
215
216
|
render() {
|
|
216
|
-
const t = this.position === "sticky" || this.sticky, e = this.position === "bottom",
|
|
217
|
+
const t = this.position === "sticky" || this.sticky, e = this.position === "bottom", a = t ? " base--sticky" : e ? " base--bottom" : "";
|
|
217
218
|
return f`
|
|
218
219
|
<div
|
|
219
220
|
part="base"
|
|
220
221
|
role="toolbar"
|
|
221
222
|
aria-label=${this.ariaLabel}
|
|
222
223
|
aria-orientation="horizontal"
|
|
223
|
-
class="base base--${this.size} base--${this.variant}${
|
|
224
|
+
class="base base--${this.size} base--${this.variant}${a}"
|
|
224
225
|
>
|
|
225
226
|
<div part="start" class="section section--start">
|
|
226
227
|
<slot name="start" @slotchange=${this._handleSlotChange}></slot>
|
|
@@ -239,28 +240,28 @@ let n = class extends b {
|
|
|
239
240
|
}
|
|
240
241
|
};
|
|
241
242
|
n.styles = [v, x];
|
|
242
|
-
|
|
243
|
-
|
|
243
|
+
l([
|
|
244
|
+
c({ type: String, reflect: !0 })
|
|
244
245
|
], n.prototype, "size", 2);
|
|
245
|
-
|
|
246
|
-
|
|
246
|
+
l([
|
|
247
|
+
c({ type: String, reflect: !0 })
|
|
247
248
|
], n.prototype, "variant", 2);
|
|
248
|
-
|
|
249
|
-
|
|
249
|
+
l([
|
|
250
|
+
c({ type: String, reflect: !0 })
|
|
250
251
|
], n.prototype, "position", 2);
|
|
251
|
-
|
|
252
|
-
|
|
252
|
+
l([
|
|
253
|
+
c({ type: Boolean, reflect: !0 })
|
|
253
254
|
], n.prototype, "sticky", 1);
|
|
254
|
-
|
|
255
|
-
|
|
255
|
+
l([
|
|
256
|
+
c({ attribute: "aria-label" })
|
|
256
257
|
], n.prototype, "ariaLabel", 2);
|
|
257
|
-
|
|
258
|
+
l([
|
|
258
259
|
p()
|
|
259
260
|
], n.prototype, "_hasOverflow", 2);
|
|
260
|
-
n =
|
|
261
|
+
n = l([
|
|
261
262
|
u("hx-action-bar")
|
|
262
263
|
], n);
|
|
263
264
|
export {
|
|
264
265
|
n as H
|
|
265
266
|
};
|
|
266
|
-
//# sourceMappingURL=hx-action-bar-
|
|
267
|
+
//# sourceMappingURL=hx-action-bar-we_WJety.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hx-action-bar-we_WJety.js","sources":["../../src/components/hx-action-bar/hx-action-bar.styles.ts","../../src/components/hx-action-bar/hx-action-bar.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixActionBarStyles = css`\n :host {\n display: block;\n }\n\n /* ─── Base ─── */\n\n .base {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--hx-action-bar-gap, var(--hx-space-2, 0.5rem));\n padding: var(--hx-action-bar-padding, var(--hx-space-2, 0.5rem) var(--hx-space-3, 0.75rem));\n background: var(--hx-action-bar-bg, transparent);\n border: var(--hx-action-bar-border, none);\n box-sizing: border-box;\n width: 100%;\n }\n\n /* ─── Sticky (top) ─── */\n\n .base--sticky {\n position: sticky;\n top: 0;\n padding-top: max(var(--hx-action-bar-padding-block-start, 0px), env(safe-area-inset-top, 0px));\n z-index: var(--hx-action-bar-z-index, 10);\n /*\n * Consumers: when this bar is sticky, add scroll-padding-top to the scroll container\n * equal to the bar's rendered height so anchor targets are not hidden behind the bar.\n * Example: .scroll-container { scroll-padding-top: 2.5rem; }\n */\n }\n\n /* ─── Bottom sticky ─── */\n\n .base--bottom {\n position: sticky;\n bottom: 0;\n /*\n * Respect iOS home-indicator safe area on devices with notch/home bar.\n * Falls back to 0px on devices that do not support env().\n */\n padding-bottom: max(\n var(--hx-action-bar-padding-block-end, 0px),\n env(safe-area-inset-bottom, 0px)\n );\n z-index: var(--hx-action-bar-z-index, 10);\n }\n\n /* ─── Variant: outlined ─── */\n\n .base--outlined {\n background: var(--hx-action-bar-bg, var(--hx-color-neutral-0, #fff));\n border: var(\n --hx-action-bar-border,\n var(--hx-border-width-thin, 1px) solid var(--hx-color-neutral-200, #e5e7eb)\n );\n border-radius: var(--hx-border-radius-md, 0.375rem);\n }\n\n /* ─── Variant: filled ─── */\n\n .base--filled {\n background: var(--hx-action-bar-bg, var(--hx-color-neutral-50, #f9fafb));\n border-radius: var(--hx-border-radius-md, 0.375rem);\n }\n\n /* ─── Size modifiers ─── */\n\n .base--sm {\n padding: var(--hx-action-bar-padding, var(--hx-space-1, 0.25rem) var(--hx-space-2, 0.5rem));\n gap: var(--hx-action-bar-gap, var(--hx-space-1, 0.25rem));\n min-height: var(--hx-size-8, 2rem);\n }\n\n .base--md {\n min-height: var(--hx-size-10, 2.5rem);\n }\n\n .base--lg {\n padding: var(--hx-action-bar-padding, var(--hx-space-3, 0.75rem) var(--hx-space-4, 1rem));\n gap: var(--hx-action-bar-gap, var(--hx-space-3, 0.75rem));\n min-height: var(--hx-size-12, 3rem);\n }\n\n /* ─── Sections ─── */\n\n .section {\n display: flex;\n align-items: center;\n gap: inherit;\n }\n\n /*\n * Equal flex-basis on start and end guarantees the center section is visually centered\n * within the full bar width, regardless of how wide start and end content are.\n */\n .section--start {\n flex: 1 1 0;\n justify-content: flex-start;\n }\n\n .section--center {\n flex: 0 0 auto;\n justify-content: center;\n }\n\n .section--end {\n flex: 1 1 0;\n justify-content: flex-end;\n }\n\n /* ─── Slotted content ─── */\n\n ::slotted(*) {\n flex-shrink: 0;\n }\n`;\n","import { LitElement, html } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixActionBarStyles } from './hx-action-bar.styles.js';\nimport { devWarn } from '../../utils/dev-warn.js';\n\n/**\n * A horizontal toolbar container for grouping related action buttons and controls.\n * Implements the ARIA toolbar pattern with roving tabindex keyboard navigation.\n *\n * @summary Horizontal action bar for grouping related controls.\n *\n * @tag hx-action-bar\n *\n * @slot start - Left-aligned actions.\n * @slot - Center content (default slot).\n * @slot end - Right-aligned actions.\n * @slot overflow - Actions revealed when the bar is constrained for space.\n *\n * @csspart base - The root toolbar container element.\n * @csspart start - The start (left) slot wrapper.\n * @csspart center - The center (default) slot wrapper.\n * @csspart end - The end (right) slot wrapper.\n * @csspart overflow - The overflow slot wrapper (hidden when no overflow content).\n *\n * @cssprop [--hx-action-bar-bg=transparent] - Bar background color (default variant).\n * @cssprop [--hx-action-bar-border=none] - Bar border (default variant).\n * @cssprop [--hx-action-bar-padding=var(--hx-space-2,0.5rem) var(--hx-space-3,0.75rem)] - Inner padding.\n * @cssprop [--hx-action-bar-gap=var(--hx-space-2,0.5rem)] - Gap between slotted items.\n * @cssprop [--hx-action-bar-z-index=10] - Z-index when sticky or bottom position.\n *\n * @attr {string} aria-label - Required. Identifies the toolbar to assistive technology.\n * When multiple toolbars appear on the same page, each must have a unique, descriptive label.\n *\n * @example\n * ```html\n * <hx-action-bar aria-label=\"Patient actions\">\n * <hx-button slot=\"start\">Save</hx-button>\n * <hx-button slot=\"end\" variant=\"ghost\">Cancel</hx-button>\n * </hx-action-bar>\n * ```\n */\n@customElement('hx-action-bar')\nexport class HelixActionBar extends LitElement {\n static override styles = [tokenStyles, helixActionBarStyles];\n\n /**\n * Size of the action bar — propagated as a data attribute to slotted children.\n * @attr size\n */\n @property({ type: String, reflect: true })\n size: 'sm' | 'md' | 'lg' = 'md';\n\n /**\n * Visual variant controlling the bar background.\n * @attr variant\n */\n @property({ type: String, reflect: true })\n variant: 'default' | 'outlined' | 'filled' = 'default';\n\n /**\n * Position and sticky behavior of the action bar.\n * - `top` — normal flow (default)\n * - `sticky` — sticks to the top of the scroll container; add `scroll-padding-top` to the\n * scroll container equal to the bar height to prevent anchor targets from scrolling behind it\n * - `bottom` — sticks to the bottom of the scroll container with iOS safe-area-inset support\n * @attr position\n */\n @property({ type: String, reflect: true })\n position: 'top' | 'bottom' | 'sticky' = 'top';\n\n /**\n * @deprecated Use `position=\"sticky\"` instead.\n * When true, the bar sticks to the top of its scroll container.\n * @attr sticky\n */\n @property({ type: Boolean, reflect: true })\n get sticky(): boolean {\n return this._sticky;\n }\n set sticky(value: boolean) {\n if (value) {\n devWarn(\n 'hx-action-bar',\n 'The `sticky` property is deprecated. Use `position=\"sticky\"` instead.',\n );\n }\n const old = this._sticky;\n this._sticky = value;\n this.requestUpdate('sticky', old);\n }\n private _sticky = false;\n\n /**\n * Accessible label for the toolbar.\n * Required when multiple toolbars appear on the same page.\n * @attr aria-label\n */\n @property({ attribute: 'aria-label' })\n ariaLabel: string = 'Actions';\n\n /** Cached list of focusable items — invalidated on slot change. */\n private _focusableCache: HTMLElement[] | null = null;\n\n /** Whether the overflow slot has assigned content. */\n @state()\n private _hasOverflow = false;\n\n // ─── Lifecycle ───\n\n /** Arrow function field — stable reference for add/removeEventListener. */\n private _handleKeydown = (e: KeyboardEvent): void => {\n if (e.key === 'ArrowRight') {\n e.preventDefault();\n this._moveFocus('next');\n } else if (e.key === 'ArrowLeft') {\n e.preventDefault();\n this._moveFocus('prev');\n } else if (e.key === 'Home') {\n e.preventDefault();\n // Move directly to first item — do NOT call _moveFocus which would visit other items first.\n const items = this._getFocusableItems();\n if (items.length) {\n items.forEach((el, i) => el.setAttribute('tabindex', i === 0 ? '0' : '-1'));\n items[0]?.focus();\n }\n } else if (e.key === 'End') {\n e.preventDefault();\n const items = this._getFocusableItems();\n const last = items.length - 1;\n if (items.length) {\n items.forEach((el, i) => el.setAttribute('tabindex', i === last ? '0' : '-1'));\n items[last]?.focus();\n }\n }\n };\n\n override connectedCallback(): void {\n super.connectedCallback();\n // Prevent dual aria-label announcement: the host carries the consumer's\n // aria-label attribute while the inner div[role=\"toolbar\"] receives the\n // same value. Setting role=\"none\" on the host hides it from the\n // accessibility tree so only the toolbar is announced.\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'none');\n } else if (this.getAttribute('role') !== 'none') {\n devWarn(\n 'hx-action-bar',\n `Setting role=\"${this.getAttribute('role')}\" on the host creates a duplicate toolbar announcement. ` +\n 'The shadow DOM already contains role=\"toolbar\". Set role=\"none\" on the host to suppress it.',\n );\n }\n this.addEventListener('keydown', this._handleKeydown);\n }\n\n override firstUpdated(): void {\n // Slot assignments are complete by firstUpdated; initialize roving tabindex\n // immediately rather than waiting for the async slotchange event.\n this._initRovingTabindex();\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this.removeEventListener('keydown', this._handleKeydown);\n }\n\n // ─── Focusable item discovery ───\n\n private _isFocusable(el: HTMLElement): boolean {\n // Check disabled via DOM attribute (native elements) or property (custom elements)\n if (el.hasAttribute('disabled')) return false;\n const elWithDisabled = el as HTMLElement & { disabled?: boolean };\n if (elWithDisabled.disabled === true) return false;\n\n // Use the IDL tabIndex property — covers both DOM attribute and ElementInternals settings.\n // Custom elements (e.g. hx-button) that set tabIndex via ElementInternals are discoverable.\n if (el.tabIndex >= 0) return true;\n\n const tag = el.tagName.toLowerCase();\n return tag === 'button' || tag === 'input' || tag === 'select' || tag === 'textarea';\n }\n\n private _getFocusableItems(): HTMLElement[] {\n if (this._focusableCache) return this._focusableCache;\n\n const slots = this.shadowRoot?.querySelectorAll('slot') ?? [];\n const items: HTMLElement[] = [];\n\n for (const slot of Array.from(slots)) {\n const assigned = (slot as HTMLSlotElement).assignedElements({ flatten: true });\n for (const el of assigned) {\n if (!(el instanceof HTMLElement)) continue;\n if (this._isFocusable(el)) {\n // Element is itself focusable — include it and do NOT also recurse into its children\n // to prevent double-counting compound components (e.g. <a><button>).\n items.push(el);\n } else {\n // Element is a non-focusable wrapper (e.g. <div>, <span>) — find focusable children.\n const descendants = el.querySelectorAll<HTMLElement>('*');\n for (const d of Array.from(descendants)) {\n if (this._isFocusable(d)) {\n items.push(d);\n }\n }\n }\n }\n }\n\n this._focusableCache = items;\n return items;\n }\n\n // ─── Roving tabindex helpers ───\n\n private _initRovingTabindex(): void {\n this._focusableCache = null; // invalidate cache on slot change\n const items = this._getFocusableItems();\n if (!items.length) return;\n const hasActive = items.some((el) => el.getAttribute('tabindex') === '0');\n if (!hasActive) {\n // No item is active yet — make the first item tabbable.\n items.forEach((el, i) => el.setAttribute('tabindex', i === 0 ? '0' : '-1'));\n } else {\n // An item is already active — ensure new items get tabindex=\"-1\"\n // without disturbing the currently active item.\n items.forEach((el) => {\n if (el.getAttribute('tabindex') === null) el.setAttribute('tabindex', '-1');\n });\n }\n }\n\n private _moveFocus(direction: 'next' | 'prev'): void {\n const items = this._getFocusableItems();\n if (!items.length) return;\n\n const focused = document.activeElement as HTMLElement | null;\n const currentIndex = items.indexOf(focused as HTMLElement);\n\n let nextIndex: number;\n if (direction === 'next') {\n nextIndex = currentIndex < items.length - 1 ? currentIndex + 1 : 0;\n } else {\n nextIndex = currentIndex > 0 ? currentIndex - 1 : items.length - 1;\n }\n\n items.forEach((el, i) => {\n el.setAttribute('tabindex', i === nextIndex ? '0' : '-1');\n });\n\n items[nextIndex]?.focus();\n }\n\n // ─── Event Handlers ───\n\n private _handleSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n if (slot.name === 'overflow') {\n this._hasOverflow = slot.assignedElements({ flatten: true }).length > 0;\n }\n this._initRovingTabindex();\n }\n\n // ─── Render ───\n\n override render() {\n const isSticky = this.position === 'sticky' || this.sticky;\n const isBottom = this.position === 'bottom';\n const positionClass = isSticky ? ' base--sticky' : isBottom ? ' base--bottom' : '';\n\n return html`\n <div\n part=\"base\"\n role=\"toolbar\"\n aria-label=${this.ariaLabel}\n aria-orientation=\"horizontal\"\n class=\"base base--${this.size} base--${this.variant}${positionClass}\"\n >\n <div part=\"start\" class=\"section section--start\">\n <slot name=\"start\" @slotchange=${this._handleSlotChange}></slot>\n </div>\n <div part=\"center\" class=\"section section--center\">\n <slot @slotchange=${this._handleSlotChange}></slot>\n </div>\n <div part=\"end\" class=\"section section--end\">\n <slot name=\"end\" @slotchange=${this._handleSlotChange}></slot>\n </div>\n <div part=\"overflow\" class=\"section section--overflow\" ?hidden=${!this._hasOverflow}>\n <slot name=\"overflow\" @slotchange=${this._handleSlotChange}></slot>\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-action-bar': HelixActionBar;\n }\n}\n"],"names":["helixActionBarStyles","css","HelixActionBar","LitElement","e","items","el","i","_a","last","_b","value","old","devWarn","tag","slots","slot","assigned","descendants","d","direction","focused","currentIndex","nextIndex","isSticky","isBottom","positionClass","html","tokenStyles","__decorateClass","property","state","customElement"],"mappings":"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"}
|