@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
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hx-date-picker-6voxxxNE.js","sources":["../../src/components/hx-date-picker/hx-date-picker.styles.ts","../../src/components/hx-date-picker/hx-date-picker.ts"],"sourcesContent":["import { css } from 'lit';\n\n// prettier-ignore\nexport const helixDatePickerStyles = css`:host{display:block;position:relative}:host([disabled]){opacity:var(--hx-opacity-disabled, .5);pointer-events:none}*{box-sizing:border-box}.field{display:flex;flex-direction:column;gap:var(--hx-space-1, .25rem);font-family:var(--hx-date-picker-font-family, var(--hx-font-family-sans, sans-serif));position:relative}.field__label-wrapper{display:contents}.field__label{display:flex;align-items:baseline;gap:var(--hx-space-1, .25rem);font-size:var(--hx-font-size-sm, .875rem);font-weight:var(--hx-font-weight-medium, 500);color:var(--hx-date-picker-label-color, var(--hx-color-neutral-700, #343a40));line-height:var(--hx-line-height-normal, 1.5)}.field__required-marker{color:var(--hx-date-picker-error-color, var(--hx-color-error-text, #b91c1c));font-weight:var(--hx-font-weight-bold, 700)}.field__input-wrapper{display:flex;align-items:stretch;border:var(--hx-border-width-thin, 1px) solid var(--hx-date-picker-border-color, var(--hx-color-neutral-300, #ced4da));border-radius:var(--hx-date-picker-border-radius, var(--hx-border-radius-md, .375rem));background-color:var(--hx-date-picker-bg, var(--hx-color-neutral-0, #ffffff));transition:border-color var(--hx-transition-fast, .15s ease),box-shadow var(--hx-transition-fast, .15s ease);overflow:hidden}.field__input-wrapper:focus-within{border-color:var(--hx-date-picker-focus-ring-color, var(--hx-focus-ring-color, #2563eb));box-shadow:0 0 0 var(--hx-focus-ring-width, 2px) color-mix(in srgb,var(--hx-date-picker-focus-ring-color, var(--hx-focus-ring-color, #2563eb)) calc(var(--hx-focus-ring-opacity, .25) * 100%),transparent)}.field--error .field__input-wrapper{border-color:var(--hx-date-picker-error-color, var(--hx-color-error-500, #dc3545))}.field--error .field__input-wrapper:focus-within{border-color:var(--hx-date-picker-error-color, var(--hx-color-error-500, #dc3545));box-shadow:0 0 0 var(--hx-focus-ring-width, 2px) color-mix(in srgb,var(--hx-date-picker-error-color, var(--hx-color-error-500, #dc3545)) calc(var(--hx-focus-ring-opacity, .25) * 100%),transparent)}.field__input{flex:1;border:none;outline:none;background:transparent;padding:var(--hx-space-2, .5rem) var(--hx-space-3, .75rem);font-family:inherit;font-size:var(--hx-font-size-md, 1rem);color:var(--hx-date-picker-color, var(--hx-color-neutral-800, #212529));line-height:var(--hx-line-height-normal, 1.5);min-height:var(--hx-size-10, 2.5rem);width:100%;cursor:default}.field__input::placeholder{color:var(--hx-color-neutral-400, #adb5bd)}.field__input:disabled{cursor:not-allowed}.field__trigger{display:flex;align-items:center;justify-content:center;padding:0 var(--hx-space-3, .75rem);border:none;border-left:var(--hx-border-width-thin, 1px) solid var(--hx-date-picker-border-color, var(--hx-color-neutral-300, #ced4da));background:transparent;color:var(--hx-date-picker-trigger-color, var(--hx-color-neutral-500, #6c757d));cursor:pointer;flex-shrink:0;transition:color var(--hx-transition-fast, .15s ease);outline:none}.field__trigger:focus-visible{color:var(--hx-date-picker-focus-ring-color, var(--hx-focus-ring-color, #2563eb));background-color:color-mix(in srgb,var(--hx-date-picker-focus-ring-color, var(--hx-focus-ring-color, #2563eb)) 8%,transparent)}.field__trigger:hover:not(:disabled){color:var(--hx-date-picker-trigger-hover-color, var(--hx-color-neutral-700, #343a40));background-color:color-mix(in srgb,var(--hx-color-neutral-900, #212529) 4%,transparent)}.field__trigger:disabled{cursor:not-allowed}.calendar{position:absolute;top:calc(100% + var(--hx-space-1, .25rem));left:0;z-index:var(--hx-z-index-dropdown, 1000);min-width:var(--hx-date-picker-calendar-min-width, 18rem);background-color:var(--hx-date-picker-calendar-bg, var(--hx-color-neutral-0, #ffffff));border:var(--hx-border-width-thin, 1px) solid var(--hx-date-picker-calendar-border-color, var(--hx-color-neutral-200, #e9ecef));border-radius:var(--hx-date-picker-calendar-border-radius, var(--hx-border-radius-lg, .5rem));box-shadow:var( --hx-date-picker-calendar-shadow, 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1) );padding:var(--hx-space-3, .75rem);outline:none}@media(prefers-reduced-motion:no-preference){.calendar{animation:calendar-appear var(--hx-transition-fast, .15s ease) forwards}}@keyframes calendar-appear{0%{opacity:0;transform:translateY(-.25rem)}to{opacity:1;transform:translateY(0)}}.calendar__nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--hx-space-3, .75rem)}:is(.calendar__nav-btn,.calendar__day,.calendar__day-cell,.calendar__weekday){display:flex;align-items:center;justify-content:center}:is(.calendar__nav-btn,.calendar__day){width:var(--hx-touch-target-min, 2.75rem);height:var(--hx-touch-target-min, 2.75rem);border:none;border-radius:var(--hx-border-radius-sm, .25rem);background:transparent;cursor:pointer;outline:none;transition:background-color var(--hx-transition-fast, .15s ease),color var(--hx-transition-fast, .15s ease)}.calendar__nav-btn{color:var(--hx-color-neutral-600, #495057);font-size:var(--hx-font-size-lg, 1.125rem);line-height:1}.calendar__nav-btn:hover{background-color:var(--hx-color-neutral-100, #f8f9fa);color:var(--hx-color-neutral-900, #212529)}:is(.calendar__nav-btn,.calendar__day):focus-visible{box-shadow:0 0 0 var(--hx-focus-ring-width, 2px) var(--hx-date-picker-focus-ring-color, var(--hx-focus-ring-color, #2563eb));z-index:1}.calendar__nav-btn:disabled{opacity:var(--hx-opacity-disabled, .4);cursor:not-allowed;pointer-events:none}.calendar__month-label{font-size:var(--hx-font-size-sm, .875rem);font-weight:var(--hx-font-weight-semibold, 600);color:var(--hx-color-neutral-800, #212529);flex:1;text-align:center}.calendar__grid{display:flex;flex-direction:column;gap:var(--hx-space-1, .25rem)}.calendar__row{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--hx-space-1, .25rem)}.calendar__weekday{height:var(--hx-size-8, 2rem);font-size:var(--hx-font-size-xs, .75rem);font-weight:var(--hx-font-weight-semibold, 600);color:var(--hx-color-neutral-500, #6c757d);text-transform:uppercase;letter-spacing:.05em}.calendar__day{color:var(--hx-color-neutral-800, #212529);font-size:var(--hx-font-size-sm, .875rem);font-family:inherit;position:relative}.calendar__day:hover:not(.calendar__day--disabled):not(.calendar__day--selected){background-color:var(--hx-color-neutral-100, #f8f9fa);color:var(--hx-color-neutral-900, #212529)}.calendar__day--selected{background-color:var(--hx-date-picker-selected-bg, var(--hx-color-primary-500, #2563eb));color:var(--hx-date-picker-selected-color, var(--hx-color-neutral-0, #ffffff));font-weight:var(--hx-font-weight-semibold, 600)}.calendar__day--selected:hover{background-color:var(--hx-date-picker-selected-hover-bg, var(--hx-color-primary-600, #1d4ed8))}.calendar__day--today:not(.calendar__day--selected){font-weight:var(--hx-font-weight-bold, 700);color:var(--hx-date-picker-today-color, var(--hx-color-primary-600, #1d4ed8))}.calendar__day--today:not(.calendar__day--selected):after{content:\"\";position:absolute;bottom:.2rem;left:50%;transform:translate(-50%);width:.25rem;height:.25rem;border-radius:50%;background-color:currentColor}.calendar__day--disabled{opacity:var(--hx-opacity-disabled, .4);cursor:not-allowed;pointer-events:none}.calendar__live-region{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.field__help-text,.field__error{font-size:var(--hx-font-size-xs, .75rem);line-height:var(--hx-line-height-normal, 1.5)}.field__help-text{color:var(--hx-color-neutral-500, #6c757d)}.field__error{color:var(--hx-date-picker-error-color, var(--hx-color-error-text, #b91c1c))}@media(prefers-reduced-motion:reduce){.field__input-wrapper,.field__trigger,.calendar__nav-btn,.calendar__day{transition:none}}@media(forced-colors:active){.field__input-wrapper{border:1px solid ButtonText}.field__input-wrapper:focus-within{outline:2px solid Highlight;outline-offset:1px;box-shadow:none}:is(.calendar__day:focus-visible,.calendar__nav-btn:focus-visible){outline:2px solid Highlight;box-shadow:none}.calendar__day--selected{background-color:Highlight;color:HighlightText;border:1px solid Highlight}.calendar__day--today:not(.calendar__day--selected){border:2px solid LinkText}.calendar__day--today:not(.calendar__day--selected):after{display:none}.calendar__day--disabled{color:GrayText}.field--error .field__input-wrapper{border-color:LinkText}}`;\n","import { LitElement, html, nothing, type PropertyValues } from 'lit';\nimport { customElement, property, state, query } 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 { helixDatePickerStyles } from './hx-date-picker.styles.js';\n\nlet _instanceCounter = 0;\n\n/**\n * Date picker component for selecting dates with keyboard-accessible calendar popup.\n *\n * @summary Form-associated date picker with calendar popup and WCAG 2.1 AA accessibility.\n *\n * @tag hx-date-picker\n *\n * @slot label - Custom label content (overrides the label property).\n * @slot help-text - Custom help text content (overrides the helpText property).\n * @slot error - Custom error content (overrides the error property).\n *\n * @fires {CustomEvent<{value: string, date: Date | null}>} hx-change - Emitted when the selected date changes.\n *\n * @csspart field - The outer field container.\n * @csspart label - The label element.\n * @csspart input-wrapper - The wrapper around input and trigger.\n * @csspart input - The readonly text input displaying the formatted date.\n * @csspart trigger - The calendar icon button.\n * @csspart calendar - The calendar popup dialog.\n * @csspart month-nav - The month navigation header.\n * @csspart day - An individual day button in the calendar grid.\n * @csspart help-text - The help text container.\n * @csspart error - The error message container.\n *\n * @cssprop [--hx-date-picker-bg=var(--hx-color-neutral-0)] - Input background color.\n * @cssprop [--hx-date-picker-color=var(--hx-color-neutral-800)] - Input text color.\n * @cssprop [--hx-date-picker-border-color=var(--hx-color-neutral-300)] - Border color.\n * @cssprop [--hx-date-picker-border-radius=var(--hx-border-radius-md)] - Border radius.\n * @cssprop [--hx-date-picker-font-family=var(--hx-font-family-sans)] - Font family.\n * @cssprop [--hx-date-picker-focus-ring-color=var(--hx-focus-ring-color)] - Focus ring color.\n * @cssprop [--hx-date-picker-error-color=var(--hx-color-error-500)] - Error state color.\n * @cssprop [--hx-date-picker-label-color=var(--hx-color-neutral-700)] - Label text color.\n * @cssprop [--hx-date-picker-trigger-color=var(--hx-color-neutral-500)] - Trigger icon color.\n * @cssprop [--hx-date-picker-calendar-bg=var(--hx-color-neutral-0)] - Calendar background color.\n * @cssprop [--hx-date-picker-calendar-border-color=var(--hx-color-neutral-200)] - Calendar border color.\n * @cssprop [--hx-date-picker-calendar-min-width=18rem] - Calendar minimum width.\n * @cssprop [--hx-date-picker-selected-bg=var(--hx-color-primary-500)] - Selected day background.\n * @cssprop [--hx-date-picker-selected-color=var(--hx-color-neutral-0)] - Selected day text color.\n * @cssprop [--hx-date-picker-today-color=var(--hx-color-primary-600)] - Today indicator color.\n * @cssprop [--hx-date-picker-calendar-shadow=0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -2px rgba(0,0,0,0.1)] - Calendar popup box shadow.\n */\n@customElement('hx-date-picker')\nexport class HelixDatePicker extends LitElement {\n static override styles = [tokenStyles, helixDatePickerStyles];\n\n // ─── Form Association ───\n\n /**\n * Marks this component as form-associated for native form participation.\n * @internal\n */\n static formAssociated = true;\n\n /**\n * ElementInternals instance for form association.\n * @internal\n */\n private _internals: ElementInternals;\n\n constructor() {\n super();\n /** @internal */\n this._internals = this.attachInternals();\n }\n\n // ─── Properties ───\n\n /**\n * The name of the field, used for form submission.\n * @attr name\n */\n @property({ type: String })\n name = '';\n\n /**\n * The current value as an ISO 8601 date string (e.g. 2026-03-04).\n * @attr value\n */\n @property({ type: String })\n value = '';\n\n /**\n * The minimum selectable date as an ISO 8601 string.\n * @attr min\n */\n @property({ type: String })\n min = '';\n\n /**\n * The maximum selectable date as an ISO 8601 string.\n * @attr max\n */\n @property({ type: String })\n max = '';\n\n /**\n * The visible label text.\n * @attr label\n */\n @property({ type: String })\n label = '';\n\n /**\n * Whether the field is required for form submission.\n * @attr required\n */\n @property({ type: Boolean, reflect: true })\n required = false;\n\n /**\n * Whether the field is disabled.\n * @attr disabled\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * Error message to display. When set, the field enters an error state.\n * @attr error\n */\n @property({ type: String })\n error = '';\n\n /**\n * Help text displayed below the field for guidance.\n * @attr help-text\n */\n @property({ type: String, attribute: 'help-text' })\n helpText = '';\n\n /**\n * Display format hint shown as placeholder (e.g. MM/DD/YYYY).\n * @attr format\n */\n @property({ type: String })\n format = 'MM/DD/YYYY';\n\n /**\n * Locale string used for formatting the display value.\n * @attr locale\n */\n @property({ type: String })\n locale = 'en-US';\n\n /**\n * Validation message shown when the field is required but empty.\n * @attr required-message\n */\n @property({ attribute: 'required-message' })\n requiredMessage = 'This field is required.';\n\n /**\n * Accessible label for the calendar dialog.\n * @attr choose-date-label\n */\n @property({ attribute: 'choose-date-label' })\n chooseDateLabel = 'Choose a date';\n\n /**\n * Accessible label for the calendar trigger button when the calendar is closed.\n * @attr open-calendar-label\n */\n @property({ attribute: 'open-calendar-label' })\n openCalendarLabel = 'Open calendar';\n\n /**\n * Accessible label for the calendar trigger button when the calendar is open.\n * @attr close-calendar-label\n */\n @property({ attribute: 'close-calendar-label' })\n closeCalendarLabel = 'Close calendar';\n\n /**\n * Accessible label for the previous month navigation button.\n * @attr previous-month-label\n */\n @property({ attribute: 'previous-month-label' })\n previousMonthLabel = 'Previous month';\n\n /**\n * Accessible label for the next month navigation button.\n * @attr next-month-label\n */\n @property({ attribute: 'next-month-label' })\n nextMonthLabel = 'Next month';\n\n // ─── Internal State ───\n\n /**\n * Tracks whether the calendar popup is currently visible.\n * @internal\n */\n @state() private _isOpen = false;\n /**\n * The year currently displayed in the calendar view.\n * @internal\n */\n @state() private _viewYear: number = new Date().getFullYear();\n /**\n * The month (0-indexed) currently displayed in the calendar view.\n * @internal\n */\n @state() private _viewMonth: number = new Date().getMonth();\n /**\n * The day number currently focused within the calendar grid, or null when the calendar is closed.\n * @internal\n */\n @state() private _focusedDay: number | null = null;\n /**\n * The message announced to screen readers when the calendar month changes.\n * @internal\n */\n @state() private _liveMessage = '';\n\n // ─── Internal References ───\n\n /**\n * Reference to the readonly text input element displaying the formatted date.\n * @internal\n */\n @query('.field__input')\n private _input: HTMLInputElement | undefined;\n\n /**\n * Reference to the calendar icon button that opens and closes the popup.\n * @internal\n */\n @query('.field__trigger')\n private _trigger: HTMLButtonElement | undefined;\n\n /**\n * Reference to the calendar popup dialog element.\n * @internal\n */\n @query('.calendar')\n private _calendar: HTMLElement | undefined;\n\n // ─── Unique IDs ───\n\n /**\n * Unique base ID for this component instance, used to generate all child element IDs.\n * @internal\n */\n private _id = `hx-date-picker-${++_instanceCounter}`;\n /**\n * Unique ID for the text input element, used for label association.\n * @internal\n */\n private _inputId = `${this._id}-input`;\n /**\n * Unique ID for the help text element, used for aria-describedby association.\n * @internal\n */\n private _helpTextId = `${this._id}-help`;\n /**\n * Unique ID for the error message element, used for aria-describedby association.\n * @internal\n */\n private _errorId = `${this._id}-error`;\n /**\n * Unique ID for the calendar popup dialog element, used for aria-controls association.\n * @internal\n */\n private _calendarId = `${this._id}-calendar`;\n /**\n * Unique ID for the ARIA live region element that announces month navigation changes.\n * @internal\n */\n private _liveRegionId = `${this._id}-live`;\n\n // ─── Slot Tracking ───\n\n /**\n * Whether the label slot has any assigned elements, used to switch between slotted and property-based label rendering.\n * @internal\n */\n private _hasLabelSlot = false;\n /**\n * Whether the error slot has any assigned elements, used to switch between slotted and property-based error rendering.\n * @internal\n */\n private _hasErrorSlot = false;\n\n /** @internal */\n private _handleLabelSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasLabelSlot = slot.assignedElements().length > 0;\n if (this._hasLabelSlot) {\n const slottedLabel = slot.assignedElements()[0];\n if (slottedLabel && !slottedLabel.id) {\n slottedLabel.id = `${this._inputId}-slotted-label`;\n }\n }\n this.requestUpdate();\n }\n\n /** @internal */\n private _handleErrorSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasErrorSlot = slot.assignedElements().length > 0;\n this.requestUpdate();\n }\n\n // ─── Bound Handler References ───\n\n /**\n * Bound reference to the outside-click handler, stored so the same function reference can be removed from document listeners.\n * @internal\n */\n private _boundHandleOutsideClick: (e: MouseEvent) => void = () => undefined;\n /**\n * Bound reference to the document keydown handler, stored so the same function reference can be removed from document listeners.\n * @internal\n */\n private _boundHandleDocumentKeydown: (e: KeyboardEvent) => void = () => undefined;\n\n // ─── Lifecycle ───\n\n override connectedCallback(): void {\n super.connectedCallback();\n this._boundHandleOutsideClick = this._handleOutsideClick.bind(this);\n this._boundHandleDocumentKeydown = this._handleDocumentKeydown.bind(this);\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n document.removeEventListener('click', this._boundHandleOutsideClick);\n document.removeEventListener('keydown', this._boundHandleDocumentKeydown);\n }\n\n override updated(changedProperties: PropertyValues<this>): void {\n super.updated(changedProperties);\n\n if (changedProperties.has('value')) {\n this._internals.setFormValue(this.value);\n this._updateValidity();\n }\n\n if ((changedProperties as Map<PropertyKey, unknown>).has('_isOpen')) {\n if (this._isOpen) {\n // Sync view to the currently selected date when opening.\n const selected = this._parseISODate(this.value);\n if (selected) {\n this._viewYear = selected.getFullYear();\n this._viewMonth = selected.getMonth();\n }\n document.addEventListener('click', this._boundHandleOutsideClick);\n document.addEventListener('keydown', this._boundHandleDocumentKeydown);\n // Focus the calendar after it renders.\n this.updateComplete.then(() => {\n this._focusActiveDay();\n });\n } else {\n document.removeEventListener('click', this._boundHandleOutsideClick);\n document.removeEventListener('keydown', this._boundHandleDocumentKeydown);\n this._focusedDay = null;\n }\n }\n\n if (\n (changedProperties as Map<PropertyKey, unknown>).has('_viewMonth') ||\n (changedProperties as Map<PropertyKey, unknown>).has('_viewYear')\n ) {\n if (this._isOpen) {\n const monthName = this._getMonthName(this._viewMonth);\n this._liveMessage = `${monthName} ${this._viewYear}`;\n this.updateComplete.then(() => {\n this._focusActiveDay();\n });\n }\n }\n }\n\n /** @internal */\n private _handleOutsideClick(e: MouseEvent): void {\n const path = e.composedPath();\n if (!path.includes(this)) {\n this._closeCalendar();\n }\n }\n\n /** @internal */\n private _handleDocumentKeydown(e: KeyboardEvent): void {\n if (e.key === 'Escape' && this._isOpen) {\n this._closeCalendar();\n }\n }\n\n // ─── Form Integration ───\n\n /** The form element associated with this component, or null if not in a form. */\n get form(): HTMLFormElement | null {\n return this._internals.form;\n }\n\n /** The current validation message, or an empty string if the field is valid. */\n get validationMessage(): string {\n return this._internals.validationMessage;\n }\n\n /** The current validity state of the field. */\n get validity(): ValidityState {\n return this._internals.validity;\n }\n\n checkValidity(): boolean {\n return this._internals.checkValidity();\n }\n\n reportValidity(): boolean {\n return this._internals.reportValidity();\n }\n\n /** @internal */\n private _updateValidity(): void {\n if (this.required && !this.value) {\n this._internals.setValidity(\n { valueMissing: true },\n this.error || this.requiredMessage,\n this._input,\n );\n } else {\n this._internals.setValidity({});\n }\n }\n\n formResetCallback(): void {\n this.value = '';\n this._internals.setFormValue(null);\n this._isOpen = false;\n }\n\n formStateRestoreCallback(\n state: string | File | FormData | null,\n _mode: 'restore' | 'autocomplete',\n ): void {\n if (typeof state === 'string') {\n this.value = state;\n }\n }\n\n /** Called when a parent fieldset is disabled/enabled. */\n formDisabledCallback(disabled: boolean): void {\n this.disabled = disabled;\n }\n\n // ─── Public Methods ───\n\n override focus(options?: FocusOptions): void {\n this._trigger?.focus(options);\n }\n\n // ─── Date Utilities ───\n\n /** @internal */\n private _parseISODate(iso: string): Date | null {\n if (!iso) return null;\n const d = new Date(iso + 'T00:00:00');\n return isNaN(d.getTime()) ? null : d;\n }\n\n /** @internal */\n private _toISO(date: Date): string {\n const y = date.getFullYear();\n const m = String(date.getMonth() + 1).padStart(2, '0');\n const d = String(date.getDate()).padStart(2, '0');\n return `${y}-${m}-${d}`;\n }\n\n /** @internal */\n private _formatForDisplay(iso: string): string {\n const date = this._parseISODate(iso);\n if (!date) return '';\n return date.toLocaleDateString(this.locale, {\n year: 'numeric',\n month: '2-digit',\n day: '2-digit',\n });\n }\n\n /** @internal */\n private _isDateDisabled(date: Date): boolean {\n const iso = this._toISO(date);\n if (this.min && iso < this.min) return true;\n if (this.max && iso > this.max) return true;\n return false;\n }\n\n /** @internal */\n private _isSameDay(a: Date, b: Date): boolean {\n return (\n a.getFullYear() === b.getFullYear() &&\n a.getMonth() === b.getMonth() &&\n a.getDate() === b.getDate()\n );\n }\n\n /** @internal */\n private _isToday(date: Date): boolean {\n return this._isSameDay(date, new Date());\n }\n\n /** @internal */\n private _getMonthName(month: number): string {\n return new Date(2000, month, 1).toLocaleDateString(this.locale, { month: 'long' });\n }\n\n /** @internal */\n private _getDayName(dayIndex: number): string {\n // dayIndex: 0=Sun, 1=Mon, ...\n return new Date(2000, 0, 2 + dayIndex).toLocaleDateString(this.locale, {\n weekday: 'short',\n });\n }\n\n // ─── Calendar Grid ───\n\n /**\n * Returns an array of Date objects (or null for padding cells) representing\n * the 6-week grid for the current view month.\n */\n /** @internal */\n private _getDaysInGrid(): (Date | null)[] {\n const firstOfMonth = new Date(this._viewYear, this._viewMonth, 1);\n const leadingBlanks = firstOfMonth.getDay(); // 0=Sun\n const daysInMonth = new Date(this._viewYear, this._viewMonth + 1, 0).getDate();\n\n const cells: (Date | null)[] = [];\n\n // Leading blank cells for days before the 1st\n for (let i = 0; i < leadingBlanks; i++) {\n cells.push(null);\n }\n\n // Days of current month\n for (let d = 1; d <= daysInMonth; d++) {\n cells.push(new Date(this._viewYear, this._viewMonth, d));\n }\n\n // Trailing blank cells to complete a full 7-column row\n const remainder = cells.length % 7;\n if (remainder !== 0) {\n for (let i = 0; i < 7 - remainder; i++) {\n cells.push(null);\n }\n }\n\n return cells;\n }\n\n // ─── Calendar Open/Close ───\n\n /** @internal */\n private _openCalendar(): void {\n if (this.disabled) return;\n this._isOpen = true;\n }\n\n /** @internal */\n private _closeCalendar(): void {\n this._isOpen = false;\n // Return focus to trigger after calendar closes.\n this.updateComplete.then(() => {\n this._trigger?.focus();\n });\n }\n\n /** @internal */\n private _toggleCalendar(): void {\n if (this._isOpen) {\n this._closeCalendar();\n } else {\n this._openCalendar();\n }\n }\n\n // ─── Focus Management ───\n\n /** @internal */\n private _focusActiveDay(): void {\n if (!this._calendar) return;\n\n const selectedISO = this.value;\n const selected = this._parseISODate(selectedISO);\n\n // Try to focus: selected day > today (if in view) > first enabled day\n let targetDay: number | null = null;\n\n if (\n selected &&\n selected.getFullYear() === this._viewYear &&\n selected.getMonth() === this._viewMonth\n ) {\n targetDay = selected.getDate();\n } else {\n const today = new Date();\n if (today.getFullYear() === this._viewYear && today.getMonth() === this._viewMonth) {\n const todayDate = new Date(this._viewYear, this._viewMonth, today.getDate());\n if (!this._isDateDisabled(todayDate)) {\n targetDay = today.getDate();\n }\n }\n }\n\n if (targetDay === null) {\n // Find first enabled day in the month\n const daysInMonth = new Date(this._viewYear, this._viewMonth + 1, 0).getDate();\n for (let d = 1; d <= daysInMonth; d++) {\n const date = new Date(this._viewYear, this._viewMonth, d);\n if (!this._isDateDisabled(date)) {\n targetDay = d;\n break;\n }\n }\n }\n\n if (targetDay !== null) {\n this._focusedDay = targetDay;\n this.updateComplete.then(() => {\n const btn = this._calendar?.querySelector<HTMLButtonElement>(`[data-day=\"${targetDay}\"]`);\n btn?.focus();\n });\n }\n }\n\n // ─── Month Navigation ───\n\n /** @internal */\n private _prevMonth(): void {\n if (this._viewMonth === 0) {\n this._viewMonth = 11;\n this._viewYear = this._viewYear - 1;\n } else {\n this._viewMonth = this._viewMonth - 1;\n }\n }\n\n /** @internal */\n private _nextMonth(): void {\n if (this._viewMonth === 11) {\n this._viewMonth = 0;\n this._viewYear = this._viewYear + 1;\n } else {\n this._viewMonth = this._viewMonth + 1;\n }\n }\n\n // ─── Day Selection ───\n\n /** @internal */\n private _selectDay(date: Date): void {\n if (this._isDateDisabled(date)) return;\n\n const iso = this._toISO(date);\n this.value = iso;\n this._internals.setFormValue(iso);\n this._updateValidity();\n\n this.dispatchEvent(\n new CustomEvent<{ value: string; date: Date }>('hx-change', {\n bubbles: true,\n composed: true,\n detail: { value: iso, date },\n }),\n );\n\n this._closeCalendar();\n }\n\n // ─── Calendar Keyboard Navigation ───\n\n /** @internal */\n private _handleCalendarKeydown(e: KeyboardEvent): void {\n const { key } = e;\n\n if (key === 'Tab') {\n this._handleCalendarTab(e);\n return;\n }\n\n // Explicit Escape handler on the calendar container provides a reliable\n // exit path even when the document-level handler does not fire (e.g. when\n // the event is stopped by a descendant or the shadow boundary interferes).\n if (key === 'Escape') {\n e.stopPropagation();\n this._closeCalendar();\n return;\n }\n\n if (\n key !== 'ArrowLeft' &&\n key !== 'ArrowRight' &&\n key !== 'ArrowUp' &&\n key !== 'ArrowDown' &&\n key !== 'Enter' &&\n key !== ' ' &&\n key !== 'Home' &&\n key !== 'End' &&\n key !== 'PageUp' &&\n key !== 'PageDown'\n ) {\n return;\n }\n\n e.preventDefault();\n\n const currentFocused = this._focusedDay ?? 1;\n const daysInMonth = new Date(this._viewYear, this._viewMonth + 1, 0).getDate();\n\n if (key === 'Enter' || key === ' ') {\n const date = new Date(this._viewYear, this._viewMonth, currentFocused);\n if (!this._isDateDisabled(date)) {\n this._selectDay(date);\n }\n return;\n }\n\n if (key === 'PageUp') {\n this._prevMonth();\n return;\n }\n\n if (key === 'PageDown') {\n this._nextMonth();\n return;\n }\n\n if (key === 'Home') {\n // Move to start of current week (Sunday)\n const currentDate = new Date(this._viewYear, this._viewMonth, currentFocused);\n const dayOfWeek = currentDate.getDay();\n const newDay = currentFocused - dayOfWeek;\n if (newDay >= 1) {\n this._focusedDay = newDay;\n this.updateComplete.then(() => {\n this._calendar?.querySelector<HTMLButtonElement>(`[data-day=\"${newDay}\"]`)?.focus();\n });\n }\n return;\n }\n\n if (key === 'End') {\n // Move to end of current week (Saturday)\n const currentDate = new Date(this._viewYear, this._viewMonth, currentFocused);\n const dayOfWeek = currentDate.getDay();\n const daysToSaturday = 6 - dayOfWeek;\n const newDay = currentFocused + daysToSaturday;\n if (newDay <= daysInMonth) {\n this._focusedDay = newDay;\n this.updateComplete.then(() => {\n this._calendar?.querySelector<HTMLButtonElement>(`[data-day=\"${newDay}\"]`)?.focus();\n });\n }\n return;\n }\n\n let newDay = currentFocused;\n\n if (key === 'ArrowLeft') newDay = currentFocused - 1;\n if (key === 'ArrowRight') newDay = currentFocused + 1;\n if (key === 'ArrowUp') newDay = currentFocused - 7;\n if (key === 'ArrowDown') newDay = currentFocused + 7;\n\n if (newDay < 1) {\n // Wrap to previous month\n this._prevMonth();\n const prevDaysInMonth = new Date(this._viewYear, this._viewMonth + 1, 0).getDate();\n this._focusedDay = prevDaysInMonth + newDay;\n this.updateComplete.then(() => {\n const day = this._focusedDay;\n this._calendar?.querySelector<HTMLButtonElement>(`[data-day=\"${day}\"]`)?.focus();\n });\n return;\n }\n\n if (newDay > daysInMonth) {\n // Wrap to next month\n const overflow = newDay - daysInMonth;\n this._nextMonth();\n this._focusedDay = overflow;\n this.updateComplete.then(() => {\n const day = this._focusedDay;\n this._calendar?.querySelector<HTMLButtonElement>(`[data-day=\"${day}\"]`)?.focus();\n });\n return;\n }\n\n this._focusedDay = newDay;\n this.updateComplete.then(() => {\n this._calendar?.querySelector<HTMLButtonElement>(`[data-day=\"${newDay}\"]`)?.focus();\n });\n }\n\n // ─── Navigation Boundary Checks ───\n\n /** @internal */\n private _isPrevMonthDisabled(): boolean {\n if (!this.min) return false;\n const firstOfCurrentView = new Date(this._viewYear, this._viewMonth, 1);\n const minDate = this._parseISODate(this.min);\n if (!minDate) return false;\n return firstOfCurrentView <= minDate;\n }\n\n /** @internal */\n private _isNextMonthDisabled(): boolean {\n if (!this.max) return false;\n const lastOfCurrentView = new Date(this._viewYear, this._viewMonth + 1, 0);\n const maxDate = this._parseISODate(this.max);\n if (!maxDate) return false;\n return lastOfCurrentView >= maxDate;\n }\n\n // ─── Focus Trap ───\n\n /** @internal */\n private _handleCalendarTab(e: KeyboardEvent): void {\n if (e.key !== 'Tab' || !this._isOpen) return;\n\n const focusableEls = this._calendar?.querySelectorAll<HTMLElement>(\n 'button:not([disabled]), [tabindex=\"0\"]',\n );\n if (!focusableEls || focusableEls.length === 0) return;\n\n const first = focusableEls[0];\n const last = focusableEls[focusableEls.length - 1];\n\n // In shadow DOM, document.activeElement returns the host element, not the\n // focused inner element. Use shadowRoot.activeElement exclusively so the\n // comparison is accurate and the trap cannot malfunction and strand users.\n const shadowActive = this.shadowRoot?.activeElement;\n\n if (e.shiftKey) {\n if (shadowActive === first) {\n e.preventDefault();\n last?.focus();\n }\n } else {\n if (shadowActive === last) {\n e.preventDefault();\n first?.focus();\n }\n }\n }\n\n // ─── Render Helpers ───\n\n /** @internal */\n private _renderWeekdayHeaders() {\n const headers = Array.from(\n { length: 7 },\n (_, i) =>\n html`<div class=\"calendar__weekday\" role=\"columnheader\" aria-label=${this._getDayName(i)}>\n ${this._getDayName(i).slice(0, 2)}\n </div>`,\n );\n return html`<div class=\"calendar__row\" role=\"row\">${headers}</div>`;\n }\n\n /** @internal */\n private _renderDayGrid() {\n const cells = this._getDaysInGrid();\n const selectedDate = this._parseISODate(this.value);\n\n const rows: ReturnType<typeof html>[] = [];\n\n for (let rowStart = 0; rowStart < cells.length; rowStart += 7) {\n const rowCells = cells.slice(rowStart, rowStart + 7).map((date) => {\n if (date === null) {\n return html`<div class=\"calendar__day-cell\" role=\"gridcell\" aria-hidden=\"true\"></div>`;\n }\n\n const isSelected = selectedDate ? this._isSameDay(date, selectedDate) : false;\n const isToday = this._isToday(date);\n const isDisabled = this._isDateDisabled(date);\n const isFocused = this._focusedDay === date.getDate();\n const dayNumber = date.getDate();\n\n const ariaLabel = date.toLocaleDateString(this.locale, {\n weekday: 'long',\n year: 'numeric',\n month: 'long',\n day: 'numeric',\n });\n\n const dayClasses = {\n calendar__day: true,\n 'calendar__day--selected': isSelected,\n 'calendar__day--today': isToday,\n 'calendar__day--disabled': isDisabled,\n };\n\n return html`<div class=\"calendar__day-cell\">\n <button\n part=\"day\"\n class=${classMap(dayClasses)}\n type=\"button\"\n role=\"gridcell\"\n data-day=${dayNumber}\n aria-label=${ariaLabel}\n aria-selected=${isSelected ? 'true' : nothing}\n aria-disabled=${isDisabled ? 'true' : nothing}\n aria-current=${isToday ? 'date' : nothing}\n tabindex=${isFocused ? '0' : '-1'}\n ?disabled=${isDisabled}\n @click=${() => {\n this._selectDay(date);\n }}\n >\n ${dayNumber}\n </button>\n </div>`;\n });\n\n rows.push(html`<div class=\"calendar__row\" role=\"row\">${rowCells}</div>`);\n }\n\n return rows;\n }\n\n // ─── Render ───\n\n override render() {\n const hasError = !!this.error || this._hasErrorSlot;\n const displayValue = this._formatForDisplay(this.value);\n const monthName = this._getMonthName(this._viewMonth);\n\n const fieldClasses = {\n field: true,\n 'field--error': hasError,\n 'field--disabled': this.disabled,\n 'field--required': this.required,\n };\n\n const describedBy =\n [hasError ? this._errorId : null, this.helpText ? this._helpTextId : null]\n .filter(Boolean)\n .join(' ') || undefined;\n\n return html`\n <div part=\"field\" class=${classMap(fieldClasses)}>\n <!-- Label -->\n <div class=\"field__label-wrapper\">\n <slot name=\"label\" @slotchange=${this._handleLabelSlotChange}>\n ${this.label\n ? html`\n <label part=\"label\" class=\"field__label\" for=${this._inputId}>\n ${this.label}\n ${this.required\n ? html`<span class=\"field__required-marker\" aria-hidden=\"true\">*</span>`\n : nothing}\n </label>\n `\n : nothing}\n </slot>\n </div>\n\n <!-- Input + Trigger -->\n <div part=\"input-wrapper\" class=\"field__input-wrapper\">\n <input\n part=\"input\"\n class=\"field__input\"\n id=${this._inputId}\n type=\"text\"\n readonly\n .value=${displayValue}\n placeholder=${ifDefined(this.format || undefined)}\n ?disabled=${this.disabled}\n aria-labelledby=${ifDefined(\n this._hasLabelSlot ? `${this._inputId}-slotted-label` : undefined,\n )}\n aria-invalid=${hasError ? 'true' : nothing}\n aria-describedby=${ifDefined(describedBy)}\n aria-required=${this.required ? 'true' : nothing}\n aria-haspopup=\"dialog\"\n @click=${this._openCalendar}\n />\n <button\n part=\"trigger\"\n class=\"field__trigger\"\n type=\"button\"\n aria-label=${this._isOpen ? this.closeCalendarLabel : this.openCalendarLabel}\n aria-haspopup=\"dialog\"\n aria-expanded=${this._isOpen ? 'true' : nothing}\n aria-controls=${this._calendarId}\n ?disabled=${this.disabled}\n @click=${this._toggleCalendar}\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 focusable=\"false\"\n >\n <rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"></rect>\n <line x1=\"16\" y1=\"2\" x2=\"16\" y2=\"6\"></line>\n <line x1=\"8\" y1=\"2\" x2=\"8\" y2=\"6\"></line>\n <line x1=\"3\" y1=\"10\" x2=\"21\" y2=\"10\"></line>\n </svg>\n </button>\n </div>\n\n <!-- Calendar Popup -->\n ${this._isOpen\n ? html`\n <div\n part=\"calendar\"\n class=\"calendar\"\n id=${this._calendarId}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label=${this.chooseDateLabel}\n @keydown=${this._handleCalendarKeydown}\n >\n <!-- Screen reader live region -->\n <div\n id=${this._liveRegionId}\n class=\"calendar__live-region\"\n aria-live=\"polite\"\n aria-atomic=\"true\"\n >\n ${this._liveMessage}\n </div>\n\n <!-- Month Navigation -->\n <div part=\"month-nav\" class=\"calendar__nav\">\n <button\n class=\"calendar__nav-btn\"\n type=\"button\"\n aria-label=${this.previousMonthLabel}\n ?disabled=${this._isPrevMonthDisabled()}\n @click=${this._prevMonth}\n >\n ‹\n </button>\n <span class=\"calendar__month-label\" aria-hidden=\"true\">\n ${monthName} ${this._viewYear}\n </span>\n <button\n class=\"calendar__nav-btn\"\n type=\"button\"\n aria-label=${this.nextMonthLabel}\n ?disabled=${this._isNextMonthDisabled()}\n @click=${this._nextMonth}\n >\n ›\n </button>\n </div>\n\n <!-- Day Grid -->\n <div class=\"calendar__grid\" role=\"grid\" aria-label=\"${monthName} ${this._viewYear}\">\n ${this._renderWeekdayHeaders()} ${this._renderDayGrid()}\n </div>\n </div>\n `\n : nothing}\n\n <!-- Error -->\n <slot name=\"error\" @slotchange=${this._handleErrorSlotChange}>\n ${this.error\n ? html`\n <div part=\"error\" class=\"field__error\" id=${this._errorId} role=\"alert\">\n ${this.error}\n </div>\n `\n : nothing}\n </slot>\n\n <!-- Help Text -->\n ${this.helpText && !hasError\n ? html`\n <div part=\"help-text\" class=\"field__help-text\" id=${this._helpTextId}>\n <slot name=\"help-text\">${this.helpText}</slot>\n </div>\n `\n : nothing}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-date-picker': HelixDatePicker;\n }\n}\n"],"names":["helixDatePickerStyles","css","_instanceCounter","HelixDatePicker","LitElement","e","slot","slottedLabel","changedProperties","selected","monthName","state","_mode","disabled","options","_a","iso","d","date","y","m","a","b","month","dayIndex","leadingBlanks","daysInMonth","cells","remainder","selectedISO","targetDay","today","todayDate","btn","key","currentFocused","dayOfWeek","newDay","_b","daysToSaturday","prevDaysInMonth","day","overflow","firstOfCurrentView","minDate","lastOfCurrentView","maxDate","focusableEls","first","last","shadowActive","headers","_","i","html","selectedDate","rows","rowStart","rowCells","isSelected","isToday","isDisabled","isFocused","dayNumber","ariaLabel","classMap","nothing","hasError","displayValue","fieldClasses","describedBy","ifDefined","tokenStyles","__decorateClass","property","query","customElement"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { css as f, LitElement as m, nothing as
|
|
2
|
-
import { query as _, state as b, property as
|
|
1
|
+
import { css as f, LitElement as m, nothing as n, html as c } from "lit";
|
|
2
|
+
import { query as _, state as b, property as d, customElement as x } from "lit/decorators.js";
|
|
3
3
|
import { tokenStyles as y } from "@helixui/tokens/lit";
|
|
4
|
-
import { l as k, u
|
|
4
|
+
import { l as k, u } from "./body-scroll-lock-VBa5TFP-.js";
|
|
5
5
|
const E = f`
|
|
6
6
|
:host {
|
|
7
7
|
display: contents;
|
|
@@ -33,14 +33,14 @@ const E = f`
|
|
|
33
33
|
border-radius: var(--hx-dialog-border-radius, var(--hx-border-radius-lg));
|
|
34
34
|
box-shadow: var(--hx-dialog-shadow, var(--hx-shadow-xl));
|
|
35
35
|
width: var(--hx-dialog-width, var(--hx-size-128, 32rem));
|
|
36
|
-
max-width: calc(100vw - var(--hx-
|
|
37
|
-
max-height: calc(100vh - var(--hx-
|
|
36
|
+
max-width: calc(100vw - var(--hx-space-8, 2rem));
|
|
37
|
+
max-height: calc(100vh - var(--hx-space-8, 2rem));
|
|
38
38
|
overflow: hidden;
|
|
39
39
|
outline: none;
|
|
40
40
|
|
|
41
41
|
/* Open/close animation */
|
|
42
42
|
opacity: 0;
|
|
43
|
-
transform: translateY(var(--hx-
|
|
43
|
+
transform: translateY(var(--hx-space-4, 1rem)) scale(0.97);
|
|
44
44
|
transition:
|
|
45
45
|
opacity var(--hx-duration-200, 200ms) var(--hx-ease-out, ease-out),
|
|
46
46
|
transform var(--hx-duration-200, 200ms) var(--hx-ease-out, ease-out);
|
|
@@ -55,6 +55,10 @@ const E = f`
|
|
|
55
55
|
.dialog {
|
|
56
56
|
transition: none;
|
|
57
57
|
}
|
|
58
|
+
|
|
59
|
+
.dialog__close-btn {
|
|
60
|
+
transition: none;
|
|
61
|
+
}
|
|
58
62
|
}
|
|
59
63
|
|
|
60
64
|
/* ─── Native backdrop (modal mode) ─── */
|
|
@@ -92,10 +96,10 @@ const E = f`
|
|
|
92
96
|
display: flex;
|
|
93
97
|
align-items: center;
|
|
94
98
|
justify-content: space-between;
|
|
95
|
-
padding: var(--hx-dialog-header-padding, var(--hx-
|
|
99
|
+
padding: var(--hx-dialog-header-padding, var(--hx-space-5) var(--hx-space-6));
|
|
96
100
|
border-bottom: var(--hx-border-width-1) solid
|
|
97
101
|
var(--hx-dialog-header-border-color, var(--hx-color-neutral-200));
|
|
98
|
-
gap: var(--hx-
|
|
102
|
+
gap: var(--hx-space-4);
|
|
99
103
|
flex-shrink: 0;
|
|
100
104
|
}
|
|
101
105
|
|
|
@@ -157,7 +161,7 @@ const E = f`
|
|
|
157
161
|
|
|
158
162
|
.dialog__body {
|
|
159
163
|
flex: 1 1 auto;
|
|
160
|
-
padding: var(--hx-dialog-body-padding, var(--hx-
|
|
164
|
+
padding: var(--hx-dialog-body-padding, var(--hx-space-6));
|
|
161
165
|
overflow-y: auto;
|
|
162
166
|
overscroll-behavior: contain;
|
|
163
167
|
}
|
|
@@ -168,8 +172,8 @@ const E = f`
|
|
|
168
172
|
display: flex;
|
|
169
173
|
align-items: center;
|
|
170
174
|
justify-content: flex-end;
|
|
171
|
-
gap: var(--hx-
|
|
172
|
-
padding: var(--hx-dialog-footer-padding, var(--hx-
|
|
175
|
+
gap: var(--hx-space-3);
|
|
176
|
+
padding: var(--hx-dialog-footer-padding, var(--hx-space-4) var(--hx-space-6));
|
|
173
177
|
border-top: var(--hx-border-width-1) solid
|
|
174
178
|
var(--hx-dialog-footer-border-color, var(--hx-color-neutral-200));
|
|
175
179
|
flex-shrink: 0;
|
|
@@ -189,14 +193,14 @@ const E = f`
|
|
|
189
193
|
border: 0;
|
|
190
194
|
}
|
|
191
195
|
`;
|
|
192
|
-
var w = Object.defineProperty, D = Object.getOwnPropertyDescriptor,
|
|
193
|
-
for (var a = r > 1 ? void 0 : r ? D(t, o) : t,
|
|
194
|
-
(
|
|
196
|
+
var w = Object.defineProperty, D = Object.getOwnPropertyDescriptor, l = (e, t, o, r) => {
|
|
197
|
+
for (var a = r > 1 ? void 0 : r ? D(t, o) : t, s = e.length - 1, h; s >= 0; s--)
|
|
198
|
+
(h = e[s]) && (a = (r ? h(t, o, a) : h(a)) || a);
|
|
195
199
|
return r && a && w(t, o, a), a;
|
|
196
200
|
};
|
|
197
201
|
let v = 0, i = class extends m {
|
|
198
202
|
constructor() {
|
|
199
|
-
super(...arguments), this._hasHeaderSlot = !1, this._hasFooterSlot = !1, this._cachedFocusableElements = [], this._triggerElement = null, this._pendingReturnValue = void 0, this._headingId = `hx-dialog-heading-${++v}`, this._descriptionId = `hx-dialog-description-${v}`, this.open = !1, this.modal = !0, this.closeOnBackdrop = !0, this.heading = "", this.variant = "dialog", this.description = "", this._handleKeyDown = (e) => {
|
|
203
|
+
super(...arguments), this._hasHeaderSlot = !1, this._hasFooterSlot = !1, this._cachedFocusableElements = [], this._triggerElement = null, this._pendingReturnValue = void 0, this._headingId = `hx-dialog-heading-${++v}`, this._descriptionId = `hx-dialog-description-${v}`, this.open = !1, this.modal = !0, this.closeOnBackdrop = !0, this.heading = "", this.variant = "dialog", this.description = "", this.closeLabel = "Close dialog", this._handleKeyDown = (e) => {
|
|
200
204
|
if (e.key === "Escape") {
|
|
201
205
|
e.preventDefault(), this._cancel();
|
|
202
206
|
return;
|
|
@@ -232,7 +236,7 @@ let v = 0, i = class extends m {
|
|
|
232
236
|
this._hasHeaderSlot = this.querySelector('[slot="header"]') !== null;
|
|
233
237
|
}
|
|
234
238
|
disconnectedCallback() {
|
|
235
|
-
super.disconnectedCallback(), this._removeGlobalListeners(), this.modal && this.open &&
|
|
239
|
+
super.disconnectedCallback(), this._removeGlobalListeners(), this.modal && this.open && u();
|
|
236
240
|
}
|
|
237
241
|
updated(e) {
|
|
238
242
|
super.updated(e), e.has("open") && (this.open ? this._openDialog() : this._closeDialog());
|
|
@@ -254,6 +258,7 @@ let v = 0, i = class extends m {
|
|
|
254
258
|
e !== void 0 && (this._pendingReturnValue = e), this.open = !1;
|
|
255
259
|
}
|
|
256
260
|
// ─── Private: Open / Close ───
|
|
261
|
+
/** @internal */
|
|
257
262
|
_openDialog() {
|
|
258
263
|
const e = this._dialogEl;
|
|
259
264
|
e && (this._triggerElement = document.activeElement, this.modal ? (e.open || e.showModal(), k()) : e.open || e.show(), this._addGlobalListeners(), this.updateComplete.then(() => {
|
|
@@ -266,12 +271,13 @@ let v = 0, i = class extends m {
|
|
|
266
271
|
})
|
|
267
272
|
));
|
|
268
273
|
}
|
|
274
|
+
/** @internal */
|
|
269
275
|
_closeDialog() {
|
|
270
276
|
var o;
|
|
271
277
|
const e = this._dialogEl;
|
|
272
278
|
if (!e) return;
|
|
273
279
|
const t = e.open;
|
|
274
|
-
e.open && (this._pendingReturnValue !== void 0 ? (e.close(this._pendingReturnValue), this._pendingReturnValue = void 0) : e.close()),
|
|
280
|
+
e.open && (this._pendingReturnValue !== void 0 ? (e.close(this._pendingReturnValue), this._pendingReturnValue = void 0) : e.close()), u(), this._removeGlobalListeners(), this._cachedFocusableElements = [], (o = this._triggerElement) == null || o.focus(), this._triggerElement = null, t && this.dispatchEvent(
|
|
275
281
|
new CustomEvent("hx-close", {
|
|
276
282
|
bubbles: !0,
|
|
277
283
|
composed: !0
|
|
@@ -279,15 +285,18 @@ let v = 0, i = class extends m {
|
|
|
279
285
|
);
|
|
280
286
|
}
|
|
281
287
|
// ─── Event Listeners ───
|
|
288
|
+
/** @internal */
|
|
282
289
|
_addGlobalListeners() {
|
|
283
290
|
var e, t, o;
|
|
284
291
|
(e = this._dialogEl) == null || e.addEventListener("keydown", this._handleKeyDown), (t = this._dialogEl) == null || t.addEventListener("click", this._handleDialogClick), (o = this._dialogEl) == null || o.addEventListener("cancel", this._handleNativeCancel);
|
|
285
292
|
}
|
|
293
|
+
/** @internal */
|
|
286
294
|
_removeGlobalListeners() {
|
|
287
295
|
var e, t, o;
|
|
288
296
|
(e = this._dialogEl) == null || e.removeEventListener("keydown", this._handleKeyDown), (t = this._dialogEl) == null || t.removeEventListener("click", this._handleDialogClick), (o = this._dialogEl) == null || o.removeEventListener("cancel", this._handleNativeCancel);
|
|
289
297
|
}
|
|
290
298
|
// ─── Focus Trap ───
|
|
299
|
+
/** @internal */
|
|
291
300
|
_getFocusableElements() {
|
|
292
301
|
var r;
|
|
293
302
|
const e = [
|
|
@@ -301,17 +310,18 @@ let v = 0, i = class extends m {
|
|
|
301
310
|
"details > summary"
|
|
302
311
|
].join(","), t = ((r = this.shadowRoot) == null ? void 0 : r.querySelectorAll("slot")) ?? [], o = [];
|
|
303
312
|
return t.forEach((a) => {
|
|
304
|
-
a.assignedElements({ flatten: !0 }).forEach((
|
|
305
|
-
|
|
306
|
-
o.push(
|
|
313
|
+
a.assignedElements({ flatten: !0 }).forEach((s) => {
|
|
314
|
+
s instanceof HTMLElement && (s.matches(e) && o.push(s), s.querySelectorAll(e).forEach((h) => {
|
|
315
|
+
o.push(h);
|
|
307
316
|
}));
|
|
308
317
|
});
|
|
309
318
|
}), o.filter(
|
|
310
319
|
(a) => !a.hasAttribute("disabled") && a.getAttribute("tabindex") !== "-1"
|
|
311
320
|
);
|
|
312
321
|
}
|
|
322
|
+
/** @internal */
|
|
313
323
|
_trapFocus(e) {
|
|
314
|
-
var
|
|
324
|
+
var p;
|
|
315
325
|
const t = this._cachedFocusableElements.length > 0 ? this._cachedFocusableElements : this._getFocusableElements();
|
|
316
326
|
if (t.length === 0) {
|
|
317
327
|
e.preventDefault();
|
|
@@ -319,10 +329,11 @@ let v = 0, i = class extends m {
|
|
|
319
329
|
}
|
|
320
330
|
const [o, ...r] = t, a = r.length > 0 ? r[r.length - 1] : o;
|
|
321
331
|
if (!o || !a) return;
|
|
322
|
-
const
|
|
332
|
+
const s = document.activeElement, g = ((p = this.shadowRoot) == null ? void 0 : p.activeElement) ?? s;
|
|
323
333
|
e.shiftKey ? g === o && (e.preventDefault(), a.focus()) : g === a && (e.preventDefault(), o.focus());
|
|
324
334
|
}
|
|
325
335
|
// ─── Cancel logic ───
|
|
336
|
+
/** @internal */
|
|
326
337
|
_cancel() {
|
|
327
338
|
this.dispatchEvent(
|
|
328
339
|
new CustomEvent("hx-cancel", {
|
|
@@ -332,40 +343,45 @@ let v = 0, i = class extends m {
|
|
|
332
343
|
), this.open = !1;
|
|
333
344
|
}
|
|
334
345
|
// ─── Slot change handlers ───
|
|
346
|
+
/** @internal */
|
|
335
347
|
_handleHeaderSlotChange(e) {
|
|
336
348
|
const t = e.target;
|
|
337
349
|
this._hasHeaderSlot = t.assignedNodes({ flatten: !0 }).length > 0;
|
|
338
350
|
}
|
|
351
|
+
/** @internal */
|
|
339
352
|
_handleFooterSlotChange(e) {
|
|
340
353
|
const t = e.target;
|
|
341
354
|
this._hasFooterSlot = t.assignedNodes({ flatten: !0 }).length > 0;
|
|
342
355
|
}
|
|
343
356
|
// ─── Render Helpers ───
|
|
357
|
+
/** @internal */
|
|
344
358
|
_renderHeader() {
|
|
345
359
|
const e = this.heading.trim().length > 0;
|
|
346
|
-
return
|
|
360
|
+
return c`
|
|
347
361
|
<div part="header" class="dialog__header">
|
|
348
|
-
${e ?
|
|
362
|
+
${e ? c`<h2 id=${this._headingId} class="dialog__heading">${this.heading}</h2>` : n}
|
|
349
363
|
<slot name="header" @slotchange=${this._handleHeaderSlotChange}></slot>
|
|
350
364
|
<button
|
|
351
365
|
part="close-button"
|
|
352
366
|
class="dialog__close-btn"
|
|
353
367
|
type="button"
|
|
354
|
-
aria-label=${
|
|
368
|
+
aria-label=${this.closeLabel}
|
|
355
369
|
@click=${() => this.close()}
|
|
356
370
|
></button>
|
|
357
371
|
</div>
|
|
358
372
|
`;
|
|
359
373
|
}
|
|
374
|
+
/** @internal */
|
|
360
375
|
_renderFooter() {
|
|
361
|
-
return
|
|
376
|
+
return c`
|
|
362
377
|
<div part="footer" class="dialog__footer" ?hidden=${!this._hasFooterSlot}>
|
|
363
378
|
<slot name="footer" @slotchange=${this._handleFooterSlotChange}></slot>
|
|
364
379
|
</div>
|
|
365
380
|
`;
|
|
366
381
|
}
|
|
382
|
+
/** @internal */
|
|
367
383
|
_renderNonModalBackdrop() {
|
|
368
|
-
return this.modal || !this.open ?
|
|
384
|
+
return this.modal || !this.open ? n : c`
|
|
369
385
|
<div
|
|
370
386
|
part="backdrop"
|
|
371
387
|
class="dialog-backdrop"
|
|
@@ -375,22 +391,23 @@ let v = 0, i = class extends m {
|
|
|
375
391
|
`;
|
|
376
392
|
}
|
|
377
393
|
// D8 — render visually-hidden description for aria-describedby
|
|
394
|
+
/** @internal */
|
|
378
395
|
_renderDescription() {
|
|
379
|
-
return this.description ?
|
|
396
|
+
return this.description ? c`<span id=${this._descriptionId} class="dialog__description"
|
|
380
397
|
>${this.description}</span
|
|
381
|
-
>` :
|
|
398
|
+
>` : n;
|
|
382
399
|
}
|
|
383
400
|
// ─── Render ───
|
|
384
401
|
render() {
|
|
385
402
|
const e = this.heading.trim().length > 0, t = this.getAttribute("aria-label");
|
|
386
|
-
return
|
|
403
|
+
return c`
|
|
387
404
|
${this._renderNonModalBackdrop()}
|
|
388
405
|
<dialog
|
|
389
|
-
role=${this.variant !== "dialog" ? this.variant :
|
|
390
|
-
aria-labelledby=${e ? this._headingId :
|
|
391
|
-
aria-label=${e ?
|
|
392
|
-
aria-describedby=${this.description ? this._descriptionId :
|
|
393
|
-
aria-modal=${this.modal ? "true" :
|
|
406
|
+
role=${this.variant !== "dialog" ? this.variant : n}
|
|
407
|
+
aria-labelledby=${e ? this._headingId : n}
|
|
408
|
+
aria-label=${e ? n : t ?? "Dialog"}
|
|
409
|
+
aria-describedby=${this.description ? this._descriptionId : n}
|
|
410
|
+
aria-modal=${this.modal ? "true" : n}
|
|
394
411
|
>
|
|
395
412
|
<div part="dialog" class="dialog">
|
|
396
413
|
${this._renderHeader()} ${this._renderDescription()}
|
|
@@ -404,23 +421,23 @@ let v = 0, i = class extends m {
|
|
|
404
421
|
}
|
|
405
422
|
};
|
|
406
423
|
i.styles = [y, E];
|
|
407
|
-
|
|
424
|
+
l([
|
|
408
425
|
_("dialog")
|
|
409
426
|
], i.prototype, "_dialogEl", 2);
|
|
410
|
-
|
|
427
|
+
l([
|
|
411
428
|
b()
|
|
412
429
|
], i.prototype, "_hasHeaderSlot", 2);
|
|
413
|
-
|
|
430
|
+
l([
|
|
414
431
|
b()
|
|
415
432
|
], i.prototype, "_hasFooterSlot", 2);
|
|
416
|
-
|
|
417
|
-
|
|
433
|
+
l([
|
|
434
|
+
d({ type: Boolean, reflect: !0 })
|
|
418
435
|
], i.prototype, "open", 2);
|
|
419
|
-
|
|
420
|
-
|
|
436
|
+
l([
|
|
437
|
+
d({ type: Boolean, reflect: !0 })
|
|
421
438
|
], i.prototype, "modal", 2);
|
|
422
|
-
|
|
423
|
-
|
|
439
|
+
l([
|
|
440
|
+
d({
|
|
424
441
|
attribute: "close-on-backdrop",
|
|
425
442
|
reflect: !0,
|
|
426
443
|
converter: {
|
|
@@ -429,19 +446,22 @@ n([
|
|
|
429
446
|
}
|
|
430
447
|
})
|
|
431
448
|
], i.prototype, "closeOnBackdrop", 2);
|
|
432
|
-
|
|
433
|
-
|
|
449
|
+
l([
|
|
450
|
+
d({ type: String })
|
|
434
451
|
], i.prototype, "heading", 2);
|
|
435
|
-
|
|
436
|
-
|
|
452
|
+
l([
|
|
453
|
+
d({ type: String, reflect: !0 })
|
|
437
454
|
], i.prototype, "variant", 2);
|
|
438
|
-
|
|
439
|
-
|
|
455
|
+
l([
|
|
456
|
+
d({ type: String })
|
|
440
457
|
], i.prototype, "description", 2);
|
|
441
|
-
|
|
458
|
+
l([
|
|
459
|
+
d({ type: String, attribute: "close-label" })
|
|
460
|
+
], i.prototype, "closeLabel", 2);
|
|
461
|
+
i = l([
|
|
442
462
|
x("hx-dialog")
|
|
443
463
|
], i);
|
|
444
464
|
export {
|
|
445
465
|
i as H
|
|
446
466
|
};
|
|
447
|
-
//# sourceMappingURL=hx-dialog-
|
|
467
|
+
//# sourceMappingURL=hx-dialog-DkUSnVgw.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hx-dialog-DkUSnVgw.js","sources":["../../src/components/hx-dialog/hx-dialog.styles.ts","../../src/components/hx-dialog/hx-dialog.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixDialogStyles = css`\n :host {\n display: contents;\n }\n\n /* ─── Native dialog reset ─── */\n\n dialog {\n padding: 0;\n border: none;\n background: transparent;\n color: inherit;\n max-width: 100%;\n max-height: 100%;\n overflow: visible;\n /* D5 — ensure native dialog element renders above the non-modal backdrop sibling */\n position: relative;\n z-index: calc(var(--hx-z-index-modal, 100) + 1);\n }\n\n /* ─── Dialog container ─── */\n\n .dialog {\n display: flex;\n flex-direction: column;\n position: relative;\n background-color: var(--hx-dialog-bg, var(--hx-color-neutral-0));\n color: var(--hx-dialog-color, var(--hx-color-neutral-900));\n border-radius: var(--hx-dialog-border-radius, var(--hx-border-radius-lg));\n box-shadow: var(--hx-dialog-shadow, var(--hx-shadow-xl));\n width: var(--hx-dialog-width, var(--hx-size-128, 32rem));\n max-width: calc(100vw - var(--hx-space-8, 2rem));\n max-height: calc(100vh - var(--hx-space-8, 2rem));\n overflow: hidden;\n outline: none;\n\n /* Open/close animation */\n opacity: 0;\n transform: translateY(var(--hx-space-4, 1rem)) scale(0.97);\n transition:\n opacity var(--hx-duration-200, 200ms) var(--hx-ease-out, ease-out),\n transform var(--hx-duration-200, 200ms) var(--hx-ease-out, ease-out);\n }\n\n dialog[open] .dialog {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n\n @media (prefers-reduced-motion: reduce) {\n .dialog {\n transition: none;\n }\n\n .dialog__close-btn {\n transition: none;\n }\n }\n\n /* ─── Native backdrop (modal mode) ─── */\n\n dialog::backdrop {\n background-color: var(--hx-dialog-backdrop-color, var(--hx-color-neutral-900));\n opacity: 0;\n transition: opacity var(--hx-duration-200, 200ms) var(--hx-ease-out, ease-out);\n }\n\n dialog[open]::backdrop {\n opacity: var(--hx-dialog-backdrop-opacity, 0.5);\n }\n\n @media (prefers-reduced-motion: reduce) {\n dialog::backdrop {\n transition: none;\n }\n }\n\n /* ─── Non-modal backdrop overlay ─── */\n\n .dialog-backdrop {\n position: fixed;\n inset: 0;\n background-color: var(--hx-dialog-backdrop-color, var(--hx-color-neutral-900));\n opacity: var(--hx-dialog-backdrop-opacity, 0.5);\n /* D5 — backdrop z-index must be lower than the dialog element's z-index */\n z-index: var(--hx-z-index-modal, 100);\n }\n\n /* ─── Header ─── */\n\n .dialog__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: var(--hx-dialog-header-padding, var(--hx-space-5) var(--hx-space-6));\n border-bottom: var(--hx-border-width-1) solid\n var(--hx-dialog-header-border-color, var(--hx-color-neutral-200));\n gap: var(--hx-space-4);\n flex-shrink: 0;\n }\n\n .dialog__heading {\n margin: 0;\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-dialog-heading-color, var(--hx-color-neutral-900));\n flex: 1 1 auto;\n }\n\n /* ─── Built-in close button (D17) ─── */\n\n .dialog__close-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\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 margin-left: auto;\n background: transparent;\n border: none;\n border-radius: var(--hx-border-radius-sm, 0.25rem);\n cursor: pointer;\n color: var(--hx-color-neutral-500, #6b7280);\n font-size: var(--hx-font-size-xl, 1.25rem);\n line-height: var(--hx-line-height-none, 1);\n transition:\n color var(--hx-duration-100, 100ms) ease,\n background-color var(--hx-duration-100, 100ms) ease;\n }\n\n .dialog__close-btn::before {\n content: '×';\n }\n\n .dialog__close-btn:hover {\n color: var(--hx-color-neutral-900, #111827);\n background-color: var(--hx-color-neutral-100, #f3f4f6);\n }\n\n .dialog__close-btn:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(\n --hx-dialog-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 .dialog__body {\n flex: 1 1 auto;\n padding: var(--hx-dialog-body-padding, var(--hx-space-6));\n overflow-y: auto;\n overscroll-behavior: contain;\n }\n\n /* ─── Footer ─── */\n\n .dialog__footer {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: var(--hx-space-3);\n padding: var(--hx-dialog-footer-padding, var(--hx-space-4) var(--hx-space-6));\n border-top: var(--hx-border-width-1) solid\n var(--hx-dialog-footer-border-color, var(--hx-color-neutral-200));\n flex-shrink: 0;\n }\n\n /* ─── Visually-hidden description (D8) ─── */\n\n .dialog__description {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n }\n`;\n","import { LitElement, html, nothing, type PropertyValues } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { lockBodyScroll, unlockBodyScroll } from '../../utils/body-scroll-lock.js';\nimport { helixDialogStyles } from './hx-dialog.styles.js';\n\n// D21 — deterministic monotonic counter instead of Math.random()\nlet _dialogCounter = 0;\n\n/**\n * A modal and non-modal dialog component built on the native HTML `<dialog>` element.\n * Provides focus trapping, backdrop interaction, keyboard navigation, and full\n * ARIA labelling for enterprise healthcare accessibility requirements.\n *\n * @summary Accessible dialog overlay for confirmations, forms, and detailed content.\n *\n * @tag hx-dialog\n *\n * @slot - Default slot for the dialog body content.\n * @slot header - Slot for custom header content. When provided, replaces the built-in heading.\n * @slot footer - Slot for action buttons or footer content.\n *\n * @fires {CustomEvent<void>} hx-open - Fired when the dialog opens.\n * @fires {CustomEvent<void>} hx-close - Fired when the dialog closes for any reason.\n * @fires {CustomEvent<void>} hx-cancel - Fired when the dialog is dismissed via Escape key or cancel action.\n *\n * @csspart dialog - The inner container div that holds the dialog content.\n * @csspart backdrop - The non-modal backdrop overlay element.\n * @csspart header - The header region containing the heading and header slot.\n * @csspart close-button - The built-in close button in the dialog header.\n * @csspart body - The scrollable body region containing the default slot.\n * @csspart footer - The footer region containing the footer slot.\n *\n * @cssprop [--hx-dialog-bg=var(--hx-color-neutral-0)] - Dialog background color.\n * @cssprop [--hx-dialog-color=var(--hx-color-neutral-900)] - Dialog text color.\n * @cssprop [--hx-dialog-border-radius=var(--hx-border-radius-lg)] - Dialog corner radius.\n * @cssprop [--hx-dialog-shadow=var(--hx-shadow-xl)] - Dialog box shadow.\n * @cssprop [--hx-dialog-width=32rem] - Dialog width.\n * @cssprop [--hx-dialog-backdrop-color=var(--hx-color-neutral-900)] - Backdrop overlay color.\n * @cssprop [--hx-dialog-backdrop-opacity=0.5] - Backdrop overlay opacity (set to 0 to hide; note\n * that opacity:0 makes the backdrop invisible but still present in the layout — use pointer-events\n * carefully if you need a fully non-blocking backdrop).\n * @cssprop [--hx-dialog-header-padding] - Padding inside the dialog header.\n * @cssprop [--hx-dialog-header-border-color=var(--hx-color-neutral-200)] - Header bottom border color.\n * @cssprop [--hx-dialog-heading-color=var(--hx-color-neutral-900)] - Heading text color.\n * @cssprop [--hx-dialog-body-padding] - Padding inside the dialog body.\n * @cssprop [--hx-dialog-footer-padding] - Padding inside the dialog footer.\n * @cssprop [--hx-dialog-footer-border-color=var(--hx-color-neutral-200)] - Footer top border color.\n *\n * @remarks\n * **Browser support for `::backdrop`:** The `dialog::backdrop` pseudo-element inside Shadow DOM\n * is well-supported in Chrome/Chromium and Firefox 122+. For Firefox < 122, modal backdrop\n * animation will silently fall back to no animation. A non-modal backdrop fallback is rendered\n * for non-modal dialogs.\n *\n * **Drupal integration:** This component is Twig-renderable via attributes (`heading`, `open`,\n * `modal`, `close-on-backdrop`). For trigger-button wiring in Drupal behaviors:\n * ```js\n * Drupal.behaviors.hxDialog = {\n * attach(context) {\n * context.querySelectorAll('[data-hx-dialog-trigger]').forEach((btn) => {\n * btn.addEventListener('click', () => {\n * const id = btn.getAttribute('data-hx-dialog-trigger');\n * document.getElementById(id)?.showModal();\n * });\n * });\n * },\n * };\n * ```\n * Focus restoration to the trigger element is handled automatically by the component.\n */\n@customElement('hx-dialog')\nexport class HelixDialog extends LitElement {\n static override styles = [tokenStyles, helixDialogStyles];\n\n // D10 — observe aria-label attribute without shadowing ARIAMixin.ariaLabel\n static override get observedAttributes(): string[] {\n return [...super.observedAttributes, 'aria-label'];\n }\n\n // ─── Queries ───\n\n /** @internal */\n @query('dialog')\n private _dialogEl: HTMLDialogElement | null | undefined;\n\n // ─── Internal state ───\n\n /** Tracks whether a header slot has been assigned content. * @internal\n */\n @state()\n private _hasHeaderSlot = false;\n\n /** Tracks whether a footer slot has been assigned content. * @internal\n */\n @state()\n private _hasFooterSlot = false;\n\n /** Cached focusable elements — populated on open, cleared on close. */\n /** @internal */\n private _cachedFocusableElements: HTMLElement[] = [];\n\n /** The element that had focus when the dialog opened — restored on close (D1). */\n /** @internal */\n private _triggerElement: HTMLElement | null = null;\n\n /** Pending returnValue to pass to native dialog.close() (D11). */\n /** @internal */\n private _pendingReturnValue: string | undefined = undefined;\n\n // ─── Unique IDs for aria-labelledby / aria-describedby ───\n\n /** @internal */\n private readonly _headingId = `hx-dialog-heading-${++_dialogCounter}`;\n /** @internal */\n private readonly _descriptionId = `hx-dialog-description-${_dialogCounter}`;\n\n // ─── Public Properties ───\n\n /**\n * Controls whether the dialog is open.\n * @attr open\n */\n @property({ type: Boolean, reflect: true })\n open = false;\n\n /**\n * When true, renders as a modal dialog with a backdrop and focus trap.\n * When false, renders as a non-modal dialog.\n * @attr modal\n */\n @property({ type: Boolean, reflect: true })\n modal = true;\n\n /**\n * When true, clicking the backdrop closes the dialog.\n * @attr close-on-backdrop\n */\n @property({\n attribute: 'close-on-backdrop',\n reflect: true,\n converter: {\n fromAttribute: (value: string | null) => value !== 'false',\n toAttribute: (value: boolean) => String(value),\n },\n })\n closeOnBackdrop = true;\n\n /**\n * Text content for the dialog heading. Used as the accessible label via aria-labelledby.\n * @attr heading\n */\n @property({ type: String })\n heading = '';\n\n /**\n * ARIA role variant. Use `'alertdialog'` for urgent dialogs requiring immediate attention\n * (e.g., drug interaction warnings, critical lab alerts). Defaults to `'dialog'`.\n * @attr variant\n */\n @property({ type: String, reflect: true })\n variant: 'dialog' | 'alertdialog' = 'dialog';\n\n /**\n * Optional description text linked to the dialog via `aria-describedby`.\n * When provided, screen readers will announce this text when the dialog receives focus.\n * Recommended for dialogs that surface critical clinical information.\n * @attr description\n */\n @property({ type: String })\n description = '';\n\n /** Accessible label for the close button. Override for localized text. */\n @property({ type: String, attribute: 'close-label' })\n closeLabel = 'Close dialog';\n\n /**\n * Returns the dialog's return value — the string passed to `close(returnValue)`.\n * Mirrors `HTMLDialogElement.returnValue`.\n */\n get returnValue(): string {\n return this._dialogEl?.returnValue ?? '';\n }\n\n // ─── Lifecycle ───\n\n // D10 — re-render when aria-label attribute changes (without declaring a shadowing property)\n override attributeChangedCallback(\n name: string,\n oldVal: string | null,\n newVal: string | null,\n ): void {\n super.attributeChangedCallback(name, oldVal, newVal);\n if (name === 'aria-label' && oldVal !== newVal) {\n this.requestUpdate('aria-label', oldVal);\n }\n }\n\n override firstUpdated(): void {\n // Initialize header slot state without a querySelector in render()\n this._hasHeaderSlot = this.querySelector('[slot=\"header\"]') !== null;\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this._removeGlobalListeners();\n // Restore body scroll if disconnected while open\n if (this.modal && this.open) {\n unlockBodyScroll();\n }\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._openDialog();\n } else {\n this._closeDialog();\n }\n }\n }\n\n // ─── Public Methods ───\n\n /** Opens the dialog in the mode determined by the `modal` property. */\n show(): void {\n this.open = true;\n }\n\n /** Opens the dialog as a modal regardless of the `modal` property setting. */\n showModal(): void {\n this.modal = true;\n this.open = true;\n }\n\n /**\n * Closes the dialog.\n * @param returnValue - Optional return value string stored as `dialog.returnValue`.\n */\n close(returnValue?: string): void {\n if (returnValue !== undefined) {\n this._pendingReturnValue = returnValue;\n }\n this.open = false;\n }\n\n // ─── Private: Open / Close ───\n\n /** @internal */\n private _openDialog(): void {\n const dialog = this._dialogEl;\n if (!dialog) return;\n\n // D1 — store the element that triggered the dialog open for focus restoration on close\n this._triggerElement = document.activeElement as HTMLElement | null;\n\n if (this.modal) {\n if (!dialog.open) {\n dialog.showModal();\n }\n // D4 — lock body scroll when modal dialog is open. Uses a shared reference-counted\n // lock so that simultaneous hx-dialog / hx-drawer instances don't clobber each other\n // when one closes before the other (see utils/body-scroll-lock.ts).\n lockBodyScroll();\n } else {\n if (!dialog.open) {\n dialog.show();\n }\n }\n\n this._addGlobalListeners();\n\n // Cache focusable elements after the dialog is open in the DOM\n void this.updateComplete.then(() => {\n this._cachedFocusableElements = this._getFocusableElements();\n // D3 — explicitly move initial focus to the first focusable element inside the dialog\n // (browser's built-in focus delegation cannot reach slotted light DOM through Shadow DOM)\n this._cachedFocusableElements[0]?.focus();\n });\n\n this.dispatchEvent(\n new CustomEvent<void>('hx-open', {\n bubbles: true,\n composed: true,\n }),\n );\n }\n\n /** @internal */\n private _closeDialog(): void {\n const dialog = this._dialogEl;\n if (!dialog) return;\n\n const wasOpen = dialog.open;\n if (dialog.open) {\n // D11 — forward returnValue to native dialog.close() if provided\n if (this._pendingReturnValue !== undefined) {\n dialog.close(this._pendingReturnValue);\n this._pendingReturnValue = undefined;\n } else {\n dialog.close();\n }\n }\n\n // D4 — release body scroll lock. Uses shared counter so scroll is only restored\n // after every open overlay (hx-dialog + hx-drawer) has closed.\n unlockBodyScroll();\n\n this._removeGlobalListeners();\n this._cachedFocusableElements = [];\n\n // D1 — restore focus to the element that opened the dialog (WCAG 2.4.3)\n this._triggerElement?.focus();\n this._triggerElement = null;\n\n if (wasOpen) {\n this.dispatchEvent(\n new CustomEvent<void>('hx-close', {\n bubbles: true,\n composed: true,\n }),\n );\n }\n }\n\n // ─── Event Listeners ───\n\n /** @internal */\n private _addGlobalListeners(): void {\n this._dialogEl?.addEventListener('keydown', this._handleKeyDown);\n this._dialogEl?.addEventListener('click', this._handleDialogClick);\n this._dialogEl?.addEventListener('cancel', this._handleNativeCancel);\n }\n\n /** @internal */\n private _removeGlobalListeners(): void {\n this._dialogEl?.removeEventListener('keydown', this._handleKeyDown);\n this._dialogEl?.removeEventListener('click', this._handleDialogClick);\n this._dialogEl?.removeEventListener('cancel', this._handleNativeCancel);\n }\n\n // ─── Keyboard Handler ───\n\n /** @internal */\n private _handleKeyDown = (e: KeyboardEvent): void => {\n if (e.key === 'Escape') {\n // Native dialog fires a 'cancel' event before close when Escape is pressed.\n // We prevent default here and handle it ourselves so we fire hx-cancel\n // before setting open = false (which triggers hx-close).\n e.preventDefault();\n this._cancel();\n return;\n }\n\n if (e.key === 'Tab' && this.modal) {\n this._trapFocus(e);\n }\n };\n\n // ─── Focus Trap ───\n\n /** @internal */\n private _getFocusableElements(): HTMLElement[] {\n const focusableSelectors = [\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 // Collect focusable elements from slotted light DOM content only.\n // Shadow DOM elements (e.g., the built-in close button) remain accessible via\n // the native <dialog> tab order — including them here would cause focus to land\n // on shadow DOM elements whose document.activeElement resolves to the host,\n // breaking the test assertions and D7 initial focus behavior.\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(focusableSelectors)) {\n lightFocusable.push(el);\n }\n el.querySelectorAll<HTMLElement>(focusableSelectors).forEach((child) => {\n lightFocusable.push(child);\n });\n }\n });\n });\n\n return 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 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 const active = document.activeElement;\n // Also check shadow root active element\n const shadowActive = this.shadowRoot?.activeElement;\n const currentActive = (shadowActive ?? active) as HTMLElement | null;\n\n if (e.shiftKey) {\n // Shift+Tab: if focus is on first, wrap to last\n if (currentActive === first) {\n e.preventDefault();\n last.focus();\n }\n } else {\n // Tab: if focus is on last, wrap to first\n if (currentActive === last) {\n e.preventDefault();\n first.focus();\n }\n }\n }\n\n // ─── Backdrop Click ───\n\n /** @internal */\n private _handleDialogClick = (e: MouseEvent): void => {\n if (!this.closeOnBackdrop) return;\n\n // The native dialog element fills only the content area in showModal().\n // Clicks on the backdrop reach the <dialog> element itself.\n // We detect this by checking whether the click target is the dialog element.\n const target = e.target as HTMLElement;\n if (target === this._dialogEl) {\n this._cancel();\n }\n };\n\n // ─── Non-modal backdrop click ───\n\n /** @internal */\n private _handleBackdropClick = (): void => {\n if (!this.closeOnBackdrop) return;\n this._cancel();\n };\n\n // ─── Native cancel (Escape via browser, before our handler runs) ───\n\n /** @internal */\n private _handleNativeCancel = (e: Event): void => {\n // We always prevent the native cancel so we can manage close state ourselves.\n e.preventDefault();\n };\n\n // ─── Cancel logic ───\n\n /** @internal */\n private _cancel(): void {\n this.dispatchEvent(\n new CustomEvent<void>('hx-cancel', {\n bubbles: true,\n composed: true,\n }),\n );\n\n this.open = false;\n // hx-close is dispatched by _closeDialog() which is called via the open property setter\n }\n\n // ─── Slot change handlers ───\n\n /** @internal */\n private _handleHeaderSlotChange(e: Event): void {\n const slot = e.target as HTMLSlotElement;\n this._hasHeaderSlot = 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 // ─── Render Helpers ───\n\n /** @internal */\n private _renderHeader() {\n const hasHeading = this.heading.trim().length > 0;\n\n // Always render header to include the built-in close button (D17)\n return html`\n <div part=\"header\" class=\"dialog__header\">\n ${hasHeading\n ? html`<h2 id=${this._headingId} class=\"dialog__heading\">${this.heading}</h2>`\n : nothing}\n <slot name=\"header\" @slotchange=${this._handleHeaderSlotChange}></slot>\n <button\n part=\"close-button\"\n class=\"dialog__close-btn\"\n type=\"button\"\n aria-label=${this.closeLabel}\n @click=${() => this.close()}\n ></button>\n </div>\n `;\n }\n\n /** @internal */\n private _renderFooter() {\n return html`\n <div part=\"footer\" class=\"dialog__footer\" ?hidden=${!this._hasFooterSlot}>\n <slot name=\"footer\" @slotchange=${this._handleFooterSlotChange}></slot>\n </div>\n `;\n }\n\n /** @internal */\n private _renderNonModalBackdrop() {\n if (this.modal || !this.open) return nothing;\n return html`\n <div\n part=\"backdrop\"\n class=\"dialog-backdrop\"\n @click=${this._handleBackdropClick}\n aria-hidden=\"true\"\n ></div>\n `;\n }\n\n // D8 — render visually-hidden description for aria-describedby\n /** @internal */\n private _renderDescription() {\n if (!this.description) return nothing;\n return html`<span id=${this._descriptionId} class=\"dialog__description\"\n >${this.description}</span\n >`;\n }\n\n // ─── Render ───\n\n override render() {\n const hasHeading = this.heading.trim().length > 0;\n // D10 — read aria-label via getAttribute to avoid shadowing ARIAMixin.ariaLabel\n const ariaLabel = this.getAttribute('aria-label');\n\n return html`\n ${this._renderNonModalBackdrop()}\n <dialog\n role=${this.variant !== 'dialog' ? this.variant : nothing}\n aria-labelledby=${hasHeading ? this._headingId : nothing}\n aria-label=${!hasHeading ? (ariaLabel ?? 'Dialog') : nothing}\n aria-describedby=${this.description ? this._descriptionId : nothing}\n aria-modal=${this.modal ? 'true' : nothing}\n >\n <div part=\"dialog\" class=\"dialog\">\n ${this._renderHeader()} ${this._renderDescription()}\n <div part=\"body\" class=\"dialog__body\">\n <slot></slot>\n </div>\n ${this._renderFooter()}\n </div>\n </dialog>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-dialog': HelixDialog;\n }\n}\n"],"names":["helixDialogStyles","css","_dialogCounter","HelixDialog","LitElement","_a","name","oldVal","newVal","unlockBodyScroll","changedProperties","returnValue","dialog","lockBodyScroll","wasOpen","_b","_c","focusableSelectors","slots","lightFocusable","slot","el","child","focusable","first","rest","last","active","currentActive","hasHeading","html","nothing","ariaLabel","tokenStyles","__decorateClass","query","state","property","value","customElement"],"mappings":"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"}
|
|
@@ -100,6 +100,7 @@ let r = class extends v {
|
|
|
100
100
|
this._checkSlot(e.target);
|
|
101
101
|
};
|
|
102
102
|
}
|
|
103
|
+
/** @internal */
|
|
103
104
|
_checkSlot(e) {
|
|
104
105
|
const i = e.assignedNodes({ flatten: !0 });
|
|
105
106
|
this._hasLabel = i.some(
|
|
@@ -154,4 +155,4 @@ r = l([
|
|
|
154
155
|
export {
|
|
155
156
|
r as H
|
|
156
157
|
};
|
|
157
|
-
//# sourceMappingURL=hx-divider-
|
|
158
|
+
//# sourceMappingURL=hx-divider-DNNs4e8q.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hx-divider-
|
|
1
|
+
{"version":3,"file":"hx-divider-DNNs4e8q.js","sources":["../../src/components/hx-divider/hx-divider.styles.ts","../../src/components/hx-divider/hx-divider.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixDividerStyles = css`\n :host {\n display: block;\n --_divider-color: var(--hx-divider-color, var(--hx-color-neutral-200, #e2e8f0));\n --_divider-width: var(--hx-divider-width, var(--hx-border-width-thin, 1px));\n --_divider-label-color: var(--hx-divider-label-color, var(--hx-color-neutral-500, #64748b));\n --_divider-label-size: var(--hx-divider-label-font-size, var(--hx-font-size-sm, 0.875rem));\n --_divider-label-gap: var(--hx-divider-label-gap, var(--hx-space-3, 0.75rem));\n }\n\n /* ─── Spacing Variants ─── */\n\n :host([spacing='none']) {\n --_spacing: 0;\n }\n\n :host([spacing='sm']) {\n --_spacing: var(--hx-space-2, 0.5rem);\n }\n\n :host,\n :host([spacing='md']) {\n --_spacing: var(--hx-space-4, 1rem);\n }\n\n :host([spacing='lg']) {\n --_spacing: var(--hx-space-6, 1.5rem);\n }\n\n /* ─── Horizontal (default) ─── */\n\n :host([orientation='horizontal']) {\n margin-block: var(--_spacing);\n }\n\n /* ─── Vertical ─── */\n\n :host([orientation='vertical']) {\n display: inline-flex;\n align-self: stretch;\n margin-inline: var(--_spacing);\n }\n\n /* ─── Base (hr) — horizontal ─── */\n\n .divider {\n display: flex;\n align-items: center;\n gap: var(--_divider-label-gap);\n border: none;\n margin: 0;\n padding: 0;\n }\n\n /* ─── Base — vertical ─── */\n\n :host([orientation='vertical']) .divider {\n flex-direction: column;\n height: 100%;\n }\n\n /* ─── Lines flanking label ─── */\n\n .divider__line {\n flex: 1;\n background-color: var(--_divider-color);\n }\n\n :host(:not([orientation='vertical'])) .divider__line {\n height: var(--_divider-width);\n }\n\n :host([orientation='vertical']) .divider__line {\n width: var(--_divider-width);\n height: auto;\n min-height: 0;\n }\n\n /* ─── Label ─── */\n\n .divider__label {\n flex-shrink: 0;\n color: var(--_divider-label-color);\n font-size: var(--_divider-label-size);\n line-height: var(--hx-line-height-tight, 1.25);\n white-space: nowrap;\n }\n`;\n","import { LitElement, html, nothing, type PropertyValues } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixDividerStyles } from './hx-divider.styles.js';\n\n/**\n * A visual separator element for dividing content sections. Supports\n * horizontal and vertical orientations, configurable spacing, and an optional\n * centered label rendered between two lines.\n *\n * @summary Horizontal or vertical separator line with optional label.\n *\n * @tag hx-divider\n *\n * @slot - Optional label text rendered centered between two lines.\n *\n * @csspart base - The root divider element.\n * @csspart label - The optional centered label wrapper.\n *\n * @cssprop [--hx-divider-color=var(--hx-color-neutral-200)] - Line color.\n * @cssprop [--hx-divider-width=var(--hx-border-width-thin)] - Line thickness.\n * @cssprop [--hx-divider-label-color=var(--hx-color-neutral-500)] - Label text color.\n * @cssprop [--hx-divider-label-font-size=var(--hx-font-size-sm)] - Label font size.\n * @cssprop [--hx-divider-label-gap=var(--hx-space-3)] - Gap between lines and label.\n */\n@customElement('hx-divider')\nexport class HelixDivider extends LitElement {\n static override styles = [tokenStyles, helixDividerStyles];\n\n /**\n * Orientation of the divider.\n * @attr orientation\n */\n @property({ type: String, reflect: true })\n orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n /**\n * Spacing applied to the block axis (horizontal) or inline axis (vertical).\n * @attr spacing\n */\n @property({ type: String, reflect: true })\n spacing: 'none' | 'sm' | 'md' | 'lg' = 'md';\n\n /**\n * When true, renders the divider as decorative only (role=\"presentation\").\n * Screen readers will not announce decorative dividers.\n * @attr decorative\n */\n @property({ type: Boolean, reflect: true })\n decorative = false;\n\n /**\n * Optional text label rendered centered between the divider lines.\n * Also sets aria-label on the separator for assistive technologies.\n * @attr label\n */\n @property({ type: String, reflect: true })\n label?: string;\n\n /** @internal */\n @state()\n private _hasLabel = false;\n\n /** @internal */\n private _checkSlot(slot: HTMLSlotElement): void {\n const nodes = slot.assignedNodes({ flatten: true });\n this._hasLabel = nodes.some((node) =>\n node.nodeType === Node.TEXT_NODE\n ? (node.textContent ?? '').trim().length > 0\n : node.nodeType === Node.ELEMENT_NODE,\n );\n }\n\n /** @internal */\n private _slotChangeHandler = (e: Event): void => {\n this._checkSlot(e.target as HTMLSlotElement);\n };\n\n override firstUpdated(_changedProperties: PropertyValues<this>): void {\n super.firstUpdated(_changedProperties);\n const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot:not([name])');\n if (slot) this._checkSlot(slot);\n }\n\n override render() {\n const isDecorative = this.decorative;\n const showLabel = this._hasLabel || !!this.label;\n\n return html`\n <div\n part=\"base\"\n class=\"divider${showLabel ? ' divider--labeled' : ''}\"\n role=\"${isDecorative ? 'presentation' : 'separator'}\"\n aria-orientation=\"${isDecorative ? nothing : this.orientation}\"\n aria-label=\"${!isDecorative && this.label ? this.label : nothing}\"\n >\n <span class=\"divider__line\"></span>\n ${showLabel\n ? html`<span part=\"label\" class=\"divider__label\">\n ${this.label ? html`${this.label}` : nothing}\n <slot @slotchange=${this._slotChangeHandler}></slot>\n </span>`\n : html`<slot @slotchange=${this._slotChangeHandler}></slot>`}\n <span class=\"divider__line\"></span>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-divider': HelixDivider;\n }\n}\n\n/** Canonical type alias for the hx-divider component. */\nexport type HxDivider = HelixDivider;\n\n/** @deprecated Use {@link HxDivider} instead. The `Wc` prefix was a legacy naming convention. */\nexport type WcDivider = HelixDivider;\n"],"names":["helixDividerStyles","css","HelixDivider","LitElement","slot","nodes","node","_changedProperties","_a","isDecorative","showLabel","html","nothing","tokenStyles","__decorateClass","property","state","customElement"],"mappings":";;;AAEO,MAAMA,IAAqBC;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;;;;;;ACwB3B,IAAMC,IAAN,cAA2BC,EAAW;AAAA,EAAtC,cAAA;AAAA,UAAA,GAAA,SAAA,GAQL,KAAA,cAAyC,cAOzC,KAAA,UAAuC,MAQvC,KAAA,aAAa,IAYb,KAAQ,YAAY,IAapB,KAAQ,qBAAqB,CAAC,MAAmB;AAC/C,WAAK,WAAW,EAAE,MAAyB;AAAA,IAC7C;AAAA,EAAA;AAAA;AAAA,EAZQ,WAAWC,GAA6B;AAC9C,UAAMC,IAAQD,EAAK,cAAc,EAAE,SAAS,IAAM;AAClD,SAAK,YAAYC,EAAM;AAAA,MAAK,CAACC,MAC3BA,EAAK,aAAa,KAAK,aAClBA,EAAK,eAAe,IAAI,OAAO,SAAS,IACzCA,EAAK,aAAa,KAAK;AAAA,IAAA;AAAA,EAE/B;AAAA,EAOS,aAAaC,GAAgD;;AACpE,UAAM,aAAaA,CAAkB;AACrC,UAAMH,KAAOI,IAAA,KAAK,eAAL,gBAAAA,EAAiB,cAA+B;AAC7D,IAAIJ,KAAM,KAAK,WAAWA,CAAI;AAAA,EAChC;AAAA,EAES,SAAS;AAChB,UAAMK,IAAe,KAAK,YACpBC,IAAY,KAAK,aAAa,CAAC,CAAC,KAAK;AAE3C,WAAOC;AAAA;AAAA;AAAA,wBAGaD,IAAY,sBAAsB,EAAE;AAAA,gBAC5CD,IAAe,iBAAiB,WAAW;AAAA,4BAC/BA,IAAeG,IAAU,KAAK,WAAW;AAAA,sBAC/C,CAACH,KAAgB,KAAK,QAAQ,KAAK,QAAQG,CAAO;AAAA;AAAA;AAAA,UAG9DF,IACEC;AAAA,gBACI,KAAK,QAAQA,IAAO,KAAK,KAAK,KAAKC,CAAO;AAAA,kCACxB,KAAK,kBAAkB;AAAA,uBAE7CD,sBAAyB,KAAK,kBAAkB,UAAU;AAAA;AAAA;AAAA;AAAA,EAIpE;AACF;AAjFaT,EACK,SAAS,CAACW,GAAab,CAAkB;AAOzDc,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAP9Bb,EAQX,WAAA,eAAA,CAAA;AAOAY,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAd9Bb,EAeX,WAAA,WAAA,CAAA;AAQAY,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAtB/Bb,EAuBX,WAAA,cAAA,CAAA;AAQAY,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GA9B9Bb,EA+BX,WAAA,SAAA,CAAA;AAIQY,EAAA;AAAA,EADPE,EAAA;AAAM,GAlCId,EAmCH,WAAA,aAAA,CAAA;AAnCGA,IAANY,EAAA;AAAA,EADNG,EAAc,YAAY;AAAA,GACdf,CAAA;"}
|