@helixui/library 3.6.0 → 3.8.0-next.145
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +41 -0
- package/aaa-verdicts.json +2036 -0
- package/custom-elements.json +3045 -1254
- package/dist/components/hx-accordion/hx-accordion-item.d.ts.map +1 -1
- package/dist/components/hx-accordion/hx-accordion-item.styles.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 +18 -0
- package/dist/components/hx-action-bar/hx-action-bar.d.ts.map +1 -1
- package/dist/components/hx-action-bar/hx-action-bar.styles.d.ts.map +1 -1
- package/dist/components/hx-action-bar/index.js +1 -1
- package/dist/components/hx-alert/hx-alert.d.ts +18 -8
- 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 +4 -1
- package/dist/components/hx-avatar/hx-avatar.d.ts.map +1 -1
- package/dist/components/hx-avatar/hx-avatar.styles.d.ts.map +1 -1
- package/dist/components/hx-avatar/index.js +1 -1
- package/dist/components/hx-badge/hx-badge.d.ts.map +1 -1
- package/dist/components/hx-badge/hx-badge.styles.d.ts.map +1 -1
- package/dist/components/hx-badge/index.js +1 -1
- package/dist/components/hx-banner/hx-banner.d.ts +19 -8
- package/dist/components/hx-banner/hx-banner.d.ts.map +1 -1
- package/dist/components/hx-banner/hx-banner.styles.d.ts.map +1 -1
- package/dist/components/hx-banner/index.js +1 -1
- package/dist/components/hx-breadcrumb/hx-breadcrumb-item.d.ts.map +1 -1
- package/dist/components/hx-breadcrumb/hx-breadcrumb-item.styles.d.ts.map +1 -1
- package/dist/components/hx-breadcrumb/hx-breadcrumb.d.ts +18 -0
- package/dist/components/hx-breadcrumb/hx-breadcrumb.d.ts.map +1 -1
- package/dist/components/hx-breadcrumb/index.js +1 -1
- package/dist/components/hx-button/hx-button.d.ts +18 -0
- package/dist/components/hx-button/hx-button.d.ts.map +1 -1
- package/dist/components/hx-button/hx-button.styles.d.ts.map +1 -1
- package/dist/components/hx-button/index.js +1 -1
- package/dist/components/hx-button-group/hx-button-group.d.ts +47 -0
- package/dist/components/hx-button-group/hx-button-group.d.ts.map +1 -1
- package/dist/components/hx-button-group/index.js +1 -1
- package/dist/components/hx-carousel/hx-carousel.d.ts.map +1 -1
- package/dist/components/hx-carousel/hx-carousel.styles.d.ts.map +1 -1
- package/dist/components/hx-carousel/index.js +1 -1
- package/dist/components/hx-checkbox/hx-checkbox.d.ts +18 -0
- package/dist/components/hx-checkbox/hx-checkbox.d.ts.map +1 -1
- package/dist/components/hx-checkbox/hx-checkbox.styles.d.ts.map +1 -1
- package/dist/components/hx-checkbox/index.js +1 -1
- package/dist/components/hx-checkbox-group/hx-checkbox-group.d.ts +36 -0
- package/dist/components/hx-checkbox-group/hx-checkbox-group.d.ts.map +1 -1
- package/dist/components/hx-checkbox-group/hx-checkbox-group.styles.d.ts.map +1 -1
- package/dist/components/hx-checkbox-group/index.js +1 -1
- package/dist/components/hx-clinical-status/hx-clinical-status.d.ts +26 -9
- package/dist/components/hx-clinical-status/hx-clinical-status.d.ts.map +1 -1
- package/dist/components/hx-clinical-status/hx-clinical-status.styles.d.ts.map +1 -1
- package/dist/components/hx-clinical-status/index.js +1 -1
- package/dist/components/hx-color-picker/hx-color-picker.d.ts +18 -0
- package/dist/components/hx-color-picker/hx-color-picker.d.ts.map +1 -1
- package/dist/components/hx-color-picker/hx-color-picker.styles.d.ts.map +1 -1
- package/dist/components/hx-color-picker/index.js +1 -1
- package/dist/components/hx-combobox/hx-combobox.d.ts +18 -0
- package/dist/components/hx-combobox/hx-combobox.d.ts.map +1 -1
- package/dist/components/hx-combobox/hx-combobox.styles.d.ts.map +1 -1
- package/dist/components/hx-combobox/index.js +1 -1
- package/dist/components/hx-copy-button/hx-copy-button.d.ts +18 -0
- package/dist/components/hx-copy-button/hx-copy-button.d.ts.map +1 -1
- package/dist/components/hx-copy-button/hx-copy-button.styles.d.ts.map +1 -1
- package/dist/components/hx-copy-button/index.js +1 -1
- package/dist/components/hx-date-picker/hx-date-picker.d.ts +18 -0
- package/dist/components/hx-date-picker/hx-date-picker.d.ts.map +1 -1
- package/dist/components/hx-date-picker/hx-date-picker.styles.d.ts.map +1 -1
- package/dist/components/hx-date-picker/index.js +1 -1
- package/dist/components/hx-dialog/hx-dialog.d.ts +18 -0
- package/dist/components/hx-dialog/hx-dialog.d.ts.map +1 -1
- package/dist/components/hx-drawer/hx-drawer.d.ts +18 -0
- 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 +18 -0
- package/dist/components/hx-dropdown/hx-dropdown.d.ts.map +1 -1
- package/dist/components/hx-dropdown/hx-dropdown.styles.d.ts.map +1 -1
- package/dist/components/hx-dropdown/index.js +1 -1
- package/dist/components/hx-field/hx-field.d.ts +17 -0
- package/dist/components/hx-field/hx-field.d.ts.map +1 -1
- package/dist/components/hx-field-label/hx-field-label.d.ts +17 -0
- package/dist/components/hx-field-label/hx-field-label.d.ts.map +1 -1
- package/dist/components/hx-file-upload/hx-file-upload.d.ts +46 -0
- package/dist/components/hx-file-upload/hx-file-upload.d.ts.map +1 -1
- package/dist/components/hx-file-upload/hx-file-upload.styles.d.ts.map +1 -1
- package/dist/components/hx-file-upload/index.js +1 -1
- package/dist/components/hx-form/hx-form.d.ts +19 -0
- package/dist/components/hx-form/hx-form.d.ts.map +1 -1
- package/dist/components/hx-help-text/hx-help-text.d.ts +17 -0
- package/dist/components/hx-help-text/hx-help-text.d.ts.map +1 -1
- package/dist/components/hx-help-text/hx-help-text.styles.d.ts.map +1 -1
- package/dist/components/hx-help-text/index.js +1 -1
- package/dist/components/hx-icon/hx-icon.d.ts +108 -12
- package/dist/components/hx-icon/hx-icon.d.ts.map +1 -1
- package/dist/components/hx-icon/hx-icon.styles.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 +18 -0
- package/dist/components/hx-icon-button/hx-icon-button.d.ts.map +1 -1
- package/dist/components/hx-icon-button/hx-icon-button.styles.d.ts.map +1 -1
- package/dist/components/hx-icon-button/index.js +1 -1
- package/dist/components/hx-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-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 +18 -0
- package/dist/components/hx-menu/hx-menu.d.ts.map +1 -1
- package/dist/components/hx-menu/index.js +1 -1
- package/dist/components/hx-nav/hx-nav.d.ts +18 -0
- package/dist/components/hx-nav/hx-nav.d.ts.map +1 -1
- package/dist/components/hx-nav/hx-nav.styles.d.ts.map +1 -1
- package/dist/components/hx-nav/index.js +1 -1
- package/dist/components/hx-number-input/hx-number-input.d.ts +18 -0
- package/dist/components/hx-number-input/hx-number-input.d.ts.map +1 -1
- package/dist/components/hx-number-input/hx-number-input.styles.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 +23 -1
- package/dist/components/hx-overflow-menu/hx-overflow-menu.d.ts.map +1 -1
- package/dist/components/hx-overflow-menu/hx-overflow-menu.styles.d.ts.map +1 -1
- package/dist/components/hx-overflow-menu/index.js +1 -1
- package/dist/components/hx-pagination/hx-pagination.styles.d.ts.map +1 -1
- package/dist/components/hx-pagination/index.js +1 -1
- package/dist/components/hx-phi-field/hx-phi-field.d.ts.map +1 -1
- package/dist/components/hx-phi-field/hx-phi-field.styles.d.ts.map +1 -1
- package/dist/components/hx-phi-field/index.js +1 -1
- package/dist/components/hx-popover/hx-popover.d.ts +18 -0
- package/dist/components/hx-popover/hx-popover.d.ts.map +1 -1
- package/dist/components/hx-popover/hx-popover.styles.d.ts.map +1 -1
- package/dist/components/hx-popover/index.js +1 -1
- package/dist/components/hx-popup/hx-popup.d.ts +18 -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-radio-group/hx-radio-group.d.ts +18 -0
- package/dist/components/hx-radio-group/hx-radio-group.d.ts.map +1 -1
- package/dist/components/hx-radio-group/hx-radio-group.styles.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 +19 -0
- package/dist/components/hx-rating/hx-rating.d.ts.map +1 -1
- package/dist/components/hx-rating/hx-rating.styles.d.ts.map +1 -1
- package/dist/components/hx-rating/index.js +1 -1
- package/dist/components/hx-select/hx-select.d.ts +18 -0
- package/dist/components/hx-select/hx-select.d.ts.map +1 -1
- 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 +18 -0
- 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 +47 -0
- package/dist/components/hx-slider/hx-slider.d.ts.map +1 -1
- package/dist/components/hx-slider/index.js +1 -1
- package/dist/components/hx-split-button/hx-split-button.d.ts +18 -0
- package/dist/components/hx-split-button/hx-split-button.d.ts.map +1 -1
- package/dist/components/hx-split-button/hx-split-button.styles.d.ts.map +1 -1
- package/dist/components/hx-split-button/index.js +1 -1
- package/dist/components/hx-stat/hx-stat.d.ts.map +1 -1
- package/dist/components/hx-stat/hx-stat.styles.d.ts.map +1 -1
- package/dist/components/hx-stat/index.js +1 -1
- 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/index.js +1 -1
- package/dist/components/hx-switch/hx-switch.d.ts +18 -0
- package/dist/components/hx-switch/hx-switch.d.ts.map +1 -1
- package/dist/components/hx-switch/hx-switch.styles.d.ts.map +1 -1
- package/dist/components/hx-switch/index.js +1 -1
- package/dist/components/hx-tabs/hx-tab.styles.d.ts.map +1 -1
- package/dist/components/hx-tabs/hx-tabs.d.ts +18 -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.map +1 -1
- package/dist/components/hx-tag/hx-tag.styles.d.ts.map +1 -1
- package/dist/components/hx-tag/index.js +1 -1
- package/dist/components/hx-text-input/hx-text-input.d.ts +18 -0
- package/dist/components/hx-text-input/hx-text-input.d.ts.map +1 -1
- package/dist/components/hx-text-input/hx-text-input.styles.d.ts.map +1 -1
- package/dist/components/hx-text-input/index.js +1 -1
- package/dist/components/hx-textarea/hx-textarea.d.ts +18 -0
- package/dist/components/hx-textarea/hx-textarea.d.ts.map +1 -1
- package/dist/components/hx-time-picker/hx-time-picker.d.ts +18 -0
- 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 +19 -8
- 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 +18 -0
- package/dist/components/hx-toggle-button/hx-toggle-button.d.ts.map +1 -1
- package/dist/components/hx-toggle-button/hx-toggle-button.styles.d.ts.map +1 -1
- package/dist/components/hx-toggle-button/index.js +1 -1
- package/dist/components/hx-tooltip/hx-tooltip.d.ts +18 -0
- package/dist/components/hx-tooltip/hx-tooltip.d.ts.map +1 -1
- package/dist/components/hx-tooltip/hx-tooltip.styles.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 +18 -0
- package/dist/components/hx-top-nav/hx-top-nav.d.ts.map +1 -1
- package/dist/components/hx-top-nav/hx-top-nav.styles.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.map +1 -1
- package/dist/components/hx-tree-view/hx-tree-item.styles.d.ts.map +1 -1
- package/dist/components/hx-tree-view/index.js +1 -1
- package/dist/css/helix-all.css +414 -118
- package/dist/css/helix-core.css +43 -19
- package/dist/css/helix-feedback.css +15 -18
- package/dist/css/helix-forms.css +172 -44
- package/dist/css/helix-media.css +6 -3
- package/dist/css/helix-navigation.css +65 -12
- package/dist/css/helix-overlay.css +63 -0
- package/dist/css/helix-tokens.css +18 -15
- package/dist/css/helix-utility.css +44 -12
- package/dist/css/hx-action-bar.css +12 -0
- package/dist/css/hx-alert.css +4 -8
- package/dist/css/hx-avatar.css +1 -2
- package/dist/css/hx-badge.css +10 -5
- package/dist/css/hx-banner.css +4 -8
- package/dist/css/hx-button.css +15 -5
- package/dist/css/hx-carousel.css +6 -3
- package/dist/css/hx-checkbox-group.css +11 -0
- package/dist/css/hx-checkbox.css +24 -13
- package/dist/css/hx-clinical-status.css +4 -7
- package/dist/css/hx-color-picker.css +14 -1
- package/dist/css/hx-combobox.css +8 -0
- package/dist/css/hx-copy-button.css +5 -2
- package/dist/css/hx-date-picker.css +16 -3
- package/dist/css/hx-drawer.css +5 -0
- package/dist/css/hx-dropdown.css +18 -0
- package/dist/css/hx-file-upload.css +4 -0
- package/dist/css/hx-help-text.css +5 -0
- package/dist/css/hx-icon-button.css +4 -5
- package/dist/css/hx-icon.css +7 -0
- package/dist/css/hx-link.css +1 -2
- package/dist/css/hx-nav.css +31 -2
- package/dist/css/hx-number-input.css +10 -11
- package/dist/css/hx-overflow-menu.css +5 -0
- package/dist/css/hx-pagination.css +6 -3
- package/dist/css/hx-phi-field.css +2 -3
- package/dist/css/hx-popover.css +13 -0
- package/dist/css/hx-popup.css +14 -0
- package/dist/css/hx-radio-group.css +10 -0
- package/dist/css/hx-rating.css +6 -0
- package/dist/css/hx-side-nav.css +10 -5
- package/dist/css/hx-split-button.css +27 -10
- package/dist/css/hx-stat.css +1 -2
- package/dist/css/hx-switch.css +19 -1
- package/dist/css/hx-tag.css +5 -0
- package/dist/css/hx-text-input.css +4 -1
- package/dist/css/hx-time-picker.css +12 -2
- package/dist/css/hx-toast.css +6 -0
- package/dist/css/hx-toggle-button.css +29 -12
- package/dist/css/hx-tooltip.css +13 -0
- package/dist/css/hx-top-nav.css +13 -2
- package/dist/css/index.css +1 -1
- package/dist/css/manifest.json +60 -20
- package/dist/index.js +49 -49
- package/dist/shared/{hx-accordion-ZVzgDzTG.js → hx-accordion-DR--Ev4t.js} +48 -54
- package/dist/shared/hx-accordion-DR--Ev4t.js.map +1 -0
- package/dist/shared/{hx-action-bar-CitgcpGv.js → hx-action-bar-BlEG4aZv.js} +41 -29
- package/dist/shared/hx-action-bar-BlEG4aZv.js.map +1 -0
- package/dist/shared/{hx-alert-Bto8-TIi.js → hx-alert-C0axS32J.js} +40 -79
- package/dist/shared/hx-alert-C0axS32J.js.map +1 -0
- package/dist/shared/{hx-avatar-C9hOmlAb.js → hx-avatar-ChAYWnK8.js} +22 -24
- package/dist/shared/hx-avatar-ChAYWnK8.js.map +1 -0
- package/dist/shared/{hx-badge-JlFtAdxS.js → hx-badge-vX-1cuLA.js} +25 -20
- package/dist/shared/hx-badge-vX-1cuLA.js.map +1 -0
- package/dist/shared/{hx-banner-fpRnciIO.js → hx-banner-PbHwFNSb.js} +51 -90
- package/dist/shared/hx-banner-PbHwFNSb.js.map +1 -0
- package/dist/shared/{hx-breadcrumb-item-3tKppF9h.js → hx-breadcrumb-item-D8xYqe3s.js} +56 -43
- package/dist/shared/hx-breadcrumb-item-D8xYqe3s.js.map +1 -0
- package/dist/shared/{hx-button-BOwAEcF1.js → hx-button-DOZTZnz-.js} +29 -19
- package/dist/shared/hx-button-DOZTZnz-.js.map +1 -0
- package/dist/shared/hx-button-group-D3QUmSzl.js +248 -0
- package/dist/shared/hx-button-group-D3QUmSzl.js.map +1 -0
- package/dist/shared/{hx-carousel-item-z1Lc24op.js → hx-carousel-item-BVIKgQ4i.js} +72 -102
- package/dist/shared/hx-carousel-item-BVIKgQ4i.js.map +1 -0
- package/dist/shared/{hx-checkbox-CYd0YV_u.js → hx-checkbox-DDSXXhps.js} +56 -47
- package/dist/shared/hx-checkbox-DDSXXhps.js.map +1 -0
- package/dist/shared/{hx-checkbox-group-D5piJLY8.js → hx-checkbox-group-C0q6HDqn.js} +101 -58
- package/dist/shared/hx-checkbox-group-C0q6HDqn.js.map +1 -0
- package/dist/shared/{hx-clinical-status-D3XQIOqX.js → hx-clinical-status-ZSVEc3Qg.js} +68 -87
- package/dist/shared/hx-clinical-status-ZSVEc3Qg.js.map +1 -0
- package/dist/shared/{hx-color-picker-DBwJzT5f.js → hx-color-picker-CYjx8i8R.js} +97 -84
- package/dist/shared/hx-color-picker-CYjx8i8R.js.map +1 -0
- package/dist/shared/{hx-combobox-NgJaLbs2.js → hx-combobox-Be-mqOv4.js} +35 -45
- package/dist/shared/hx-combobox-Be-mqOv4.js.map +1 -0
- package/dist/shared/{hx-copy-button-sUVuikyH.js → hx-copy-button-DJirFCUL.js} +18 -15
- package/dist/shared/hx-copy-button-DJirFCUL.js.map +1 -0
- package/dist/shared/{hx-date-picker-B49yo4Vm.js → hx-date-picker-CziP3Hm1.js} +85 -84
- package/dist/shared/hx-date-picker-CziP3Hm1.js.map +1 -0
- package/dist/shared/hx-dialog-B4weoj_1.js.map +1 -1
- package/dist/shared/{hx-drawer-CM_upadk.js → hx-drawer-BlU2oX8-.js} +32 -36
- package/dist/shared/hx-drawer-BlU2oX8-.js.map +1 -0
- package/dist/shared/{hx-dropdown-D626S2ZG.js → hx-dropdown-DREqpIpm.js} +51 -33
- package/dist/shared/hx-dropdown-DREqpIpm.js.map +1 -0
- package/dist/shared/hx-field-label-BVRyyKeh.js.map +1 -1
- package/dist/shared/hx-field-zw0U1KVi.js.map +1 -1
- package/dist/shared/{hx-file-upload-D3rKROK5.js → hx-file-upload-CU5QGZSP.js} +137 -80
- package/dist/shared/hx-file-upload-CU5QGZSP.js.map +1 -0
- package/dist/shared/hx-form-CkChEATa.js.map +1 -1
- package/dist/shared/hx-help-text-CNaZ82LT.js +137 -0
- package/dist/shared/hx-help-text-CNaZ82LT.js.map +1 -0
- package/dist/shared/{hx-icon-button-a6OpeQz5.js → hx-icon-button-B2BdVdyK.js} +10 -11
- package/dist/shared/hx-icon-button-B2BdVdyK.js.map +1 -0
- package/dist/shared/hx-icon-bxz9eB9a.js +386 -0
- package/dist/shared/hx-icon-bxz9eB9a.js.map +1 -0
- package/dist/shared/{hx-link-CMnZRUtQ.js → hx-link-BURSdYLp.js} +19 -26
- package/dist/shared/hx-link-BURSdYLp.js.map +1 -0
- package/dist/shared/{hx-menu-divider-A6Guuzi_.js → hx-menu-divider-g0grbWV9.js} +19 -31
- package/dist/shared/hx-menu-divider-g0grbWV9.js.map +1 -0
- package/dist/shared/{hx-nav-ldFM3Fle.js → hx-nav-GTsAZGOx.js} +94 -85
- package/dist/shared/hx-nav-GTsAZGOx.js.map +1 -0
- package/dist/shared/{hx-nav-item-CODtUlew.js → hx-nav-item-CxE7Mp3M.js} +46 -41
- package/dist/shared/hx-nav-item-CxE7Mp3M.js.map +1 -0
- package/dist/shared/{hx-number-input-yUzFOSC1.js → hx-number-input-Bvyc9kOi.js} +59 -64
- package/dist/shared/hx-number-input-Bvyc9kOi.js.map +1 -0
- package/dist/shared/{hx-overflow-menu-DFjJAziP.js → hx-overflow-menu-LrTteeR1.js} +32 -39
- package/dist/shared/{hx-overflow-menu-DFjJAziP.js.map → hx-overflow-menu-LrTteeR1.js.map} +1 -1
- package/dist/shared/{hx-pagination-C7y8GVyU.js → hx-pagination-D726PyTM.js} +7 -4
- package/dist/shared/hx-pagination-D726PyTM.js.map +1 -0
- package/dist/shared/{hx-phi-field-C19oxlrr.js → hx-phi-field-sZt_rYIL.js} +46 -66
- package/dist/shared/hx-phi-field-sZt_rYIL.js.map +1 -0
- package/dist/shared/{hx-popover-BAlAFOH9.js → hx-popover-BjB0nkcq.js} +51 -38
- package/dist/shared/hx-popover-BjB0nkcq.js.map +1 -0
- package/dist/shared/{hx-popup-COUXXZ9X.js → hx-popup-BiV_2evC.js} +59 -45
- package/dist/shared/hx-popup-BiV_2evC.js.map +1 -0
- package/dist/shared/{hx-radio-C7eTj5YI.js → hx-radio-BD_c9NJy.js} +52 -39
- package/dist/shared/hx-radio-BD_c9NJy.js.map +1 -0
- package/dist/shared/{hx-rating-C3QP53k9.js → hx-rating-BGK4AxvI.js} +45 -71
- package/dist/shared/hx-rating-BGK4AxvI.js.map +1 -0
- package/dist/shared/hx-select-DahFehiZ.js.map +1 -1
- package/dist/shared/{hx-slider-Blmv_rwS.js → hx-slider-CkOk5BCY.js} +83 -23
- package/dist/shared/hx-slider-CkOk5BCY.js.map +1 -0
- package/dist/shared/{hx-split-button-Ddle8iVx.js → hx-split-button-Bg9FHrFK.js} +73 -65
- package/dist/shared/hx-split-button-Bg9FHrFK.js.map +1 -0
- package/dist/shared/{hx-stat-Gtw_SpK8.js → hx-stat-wKxbyep6.js} +22 -55
- package/dist/shared/hx-stat-wKxbyep6.js.map +1 -0
- package/dist/shared/{hx-step-R2rjp1fT.js → hx-step-CyGQAuiB.js} +7 -27
- package/dist/shared/hx-step-CyGQAuiB.js.map +1 -0
- package/dist/shared/{hx-switch-TvKGvZJz.js → hx-switch-BCXuNxEH.js} +42 -24
- package/dist/shared/hx-switch-BCXuNxEH.js.map +1 -0
- package/dist/shared/{hx-tab-panel-DzsX8BHV.js → hx-tab-panel-BfisavKo.js} +47 -32
- package/dist/shared/hx-tab-panel-BfisavKo.js.map +1 -0
- package/dist/shared/{hx-tag-C5aCUpVi.js → hx-tag-BqO6HY6V.js} +26 -21
- package/dist/shared/hx-tag-BqO6HY6V.js.map +1 -0
- package/dist/shared/{hx-text-input-D6FlOZM-.js → hx-text-input-V5sQOpDh.js} +5 -2
- package/dist/shared/hx-text-input-V5sQOpDh.js.map +1 -0
- package/dist/shared/hx-textarea-CNG590KY.js.map +1 -1
- package/dist/shared/{hx-time-picker-Bo7FWzmf.js → hx-time-picker-if5Cl0Ei.js} +42 -43
- package/dist/shared/hx-time-picker-if5Cl0Ei.js.map +1 -0
- package/dist/shared/{hx-toggle-button-DwBers3A.js → hx-toggle-button-xNVYeA3X.js} +64 -47
- package/dist/shared/hx-toggle-button-xNVYeA3X.js.map +1 -0
- package/dist/shared/{hx-tooltip-DVqtKPCD.js → hx-tooltip-CamO-9nd.js} +24 -11
- package/dist/shared/hx-tooltip-CamO-9nd.js.map +1 -0
- package/dist/shared/{hx-top-nav-DP6OFS8C.js → hx-top-nav-vP6oDWMV.js} +42 -44
- package/dist/shared/hx-top-nav-vP6oDWMV.js.map +1 -0
- package/dist/shared/{hx-tree-item-CXyspGxI.js → hx-tree-item-D8hwKd5m.js} +54 -57
- package/dist/shared/hx-tree-item-D8hwKd5m.js.map +1 -0
- package/dist/shared/{toast-factory-Dht3pVsw.js → toast-factory-DgnbFxVs.js} +127 -153
- package/dist/shared/toast-factory-DgnbFxVs.js.map +1 -0
- package/figma-inventory.json +1280 -429
- package/package.json +8 -4
- package/dist/shared/hx-accordion-ZVzgDzTG.js.map +0 -1
- package/dist/shared/hx-action-bar-CitgcpGv.js.map +0 -1
- package/dist/shared/hx-alert-Bto8-TIi.js.map +0 -1
- package/dist/shared/hx-avatar-C9hOmlAb.js.map +0 -1
- package/dist/shared/hx-badge-JlFtAdxS.js.map +0 -1
- package/dist/shared/hx-banner-fpRnciIO.js.map +0 -1
- package/dist/shared/hx-breadcrumb-item-3tKppF9h.js.map +0 -1
- package/dist/shared/hx-button-BOwAEcF1.js.map +0 -1
- package/dist/shared/hx-button-group-4NUBpkyC.js +0 -181
- package/dist/shared/hx-button-group-4NUBpkyC.js.map +0 -1
- package/dist/shared/hx-carousel-item-z1Lc24op.js.map +0 -1
- package/dist/shared/hx-checkbox-CYd0YV_u.js.map +0 -1
- package/dist/shared/hx-checkbox-group-D5piJLY8.js.map +0 -1
- package/dist/shared/hx-clinical-status-D3XQIOqX.js.map +0 -1
- package/dist/shared/hx-color-picker-DBwJzT5f.js.map +0 -1
- package/dist/shared/hx-combobox-NgJaLbs2.js.map +0 -1
- package/dist/shared/hx-copy-button-sUVuikyH.js.map +0 -1
- package/dist/shared/hx-date-picker-B49yo4Vm.js.map +0 -1
- package/dist/shared/hx-drawer-CM_upadk.js.map +0 -1
- package/dist/shared/hx-dropdown-D626S2ZG.js.map +0 -1
- package/dist/shared/hx-file-upload-D3rKROK5.js.map +0 -1
- package/dist/shared/hx-help-text-Xb2Yr8x2.js +0 -156
- package/dist/shared/hx-help-text-Xb2Yr8x2.js.map +0 -1
- package/dist/shared/hx-icon-button-a6OpeQz5.js.map +0 -1
- package/dist/shared/hx-icon-fuVm4-bk.js +0 -283
- package/dist/shared/hx-icon-fuVm4-bk.js.map +0 -1
- package/dist/shared/hx-link-CMnZRUtQ.js.map +0 -1
- package/dist/shared/hx-menu-divider-A6Guuzi_.js.map +0 -1
- package/dist/shared/hx-nav-item-CODtUlew.js.map +0 -1
- package/dist/shared/hx-nav-ldFM3Fle.js.map +0 -1
- package/dist/shared/hx-number-input-yUzFOSC1.js.map +0 -1
- package/dist/shared/hx-pagination-C7y8GVyU.js.map +0 -1
- package/dist/shared/hx-phi-field-C19oxlrr.js.map +0 -1
- package/dist/shared/hx-popover-BAlAFOH9.js.map +0 -1
- package/dist/shared/hx-popup-COUXXZ9X.js.map +0 -1
- package/dist/shared/hx-radio-C7eTj5YI.js.map +0 -1
- package/dist/shared/hx-rating-C3QP53k9.js.map +0 -1
- package/dist/shared/hx-slider-Blmv_rwS.js.map +0 -1
- package/dist/shared/hx-split-button-Ddle8iVx.js.map +0 -1
- package/dist/shared/hx-stat-Gtw_SpK8.js.map +0 -1
- package/dist/shared/hx-step-R2rjp1fT.js.map +0 -1
- package/dist/shared/hx-switch-TvKGvZJz.js.map +0 -1
- package/dist/shared/hx-tab-panel-DzsX8BHV.js.map +0 -1
- package/dist/shared/hx-tag-C5aCUpVi.js.map +0 -1
- package/dist/shared/hx-text-input-D6FlOZM-.js.map +0 -1
- package/dist/shared/hx-time-picker-Bo7FWzmf.js.map +0 -1
- package/dist/shared/hx-toggle-button-DwBers3A.js.map +0 -1
- package/dist/shared/hx-tooltip-DVqtKPCD.js.map +0 -1
- package/dist/shared/hx-top-nav-DP6OFS8C.js.map +0 -1
- package/dist/shared/hx-tree-item-CXyspGxI.js.map +0 -1
- package/dist/shared/toast-factory-Dht3pVsw.js.map +0 -1
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { css as g, nothing as p, html as l } from "lit";
|
|
2
2
|
import { property as n, state as c, customElement as f } from "lit/decorators.js";
|
|
3
3
|
import { classMap as x } from "lit/directives/class-map.js";
|
|
4
|
-
import { f as
|
|
4
|
+
import { f as y } from "./forced-colors-CTEDFRGa.js";
|
|
5
5
|
import { H as _ } from "./helix-element-BNEYeiys.js";
|
|
6
|
-
const
|
|
6
|
+
const m = g`
|
|
7
7
|
:host {
|
|
8
8
|
display: block;
|
|
9
9
|
position: relative;
|
|
@@ -76,9 +76,12 @@ const y = g`
|
|
|
76
76
|
cursor: not-allowed;
|
|
77
77
|
}
|
|
78
78
|
|
|
79
|
-
.nav-btn
|
|
80
|
-
|
|
81
|
-
|
|
79
|
+
.nav-btn .carousel__nav-glyph {
|
|
80
|
+
--hx-icon-size: 1.25em;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
.play-pause-btn .carousel__autoplay-glyph {
|
|
84
|
+
--hx-icon-size: 1em;
|
|
82
85
|
}
|
|
83
86
|
|
|
84
87
|
/* ─── Play/Pause ─── */
|
|
@@ -243,75 +246,42 @@ const y = g`
|
|
|
243
246
|
}
|
|
244
247
|
}
|
|
245
248
|
`;
|
|
246
|
-
var b = Object.defineProperty,
|
|
247
|
-
for (var
|
|
248
|
-
(u = t[h]) && (
|
|
249
|
-
return r &&
|
|
249
|
+
var b = Object.defineProperty, P = Object.getOwnPropertyDescriptor, s = (t, e, i, r) => {
|
|
250
|
+
for (var a = r > 1 ? void 0 : r ? P(e, i) : e, h = t.length - 1, u; h >= 0; h--)
|
|
251
|
+
(u = t[h]) && (a = (r ? u(e, i, a) : u(a)) || a);
|
|
252
|
+
return r && a && b(e, i, a), a;
|
|
250
253
|
};
|
|
251
|
-
const
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
stroke="currentColor"
|
|
256
|
-
stroke-width="2"
|
|
257
|
-
stroke-linecap="round"
|
|
258
|
-
stroke-linejoin="round"
|
|
254
|
+
const w = l`<hx-icon
|
|
255
|
+
class="carousel__nav-glyph"
|
|
256
|
+
library="helix"
|
|
257
|
+
name="chevron-left"
|
|
259
258
|
aria-hidden="true"
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
viewBox="0 0 24 24"
|
|
265
|
-
fill="none"
|
|
266
|
-
stroke="currentColor"
|
|
267
|
-
stroke-width="2"
|
|
268
|
-
stroke-linecap="round"
|
|
269
|
-
stroke-linejoin="round"
|
|
259
|
+
></hx-icon>`, I = l`<hx-icon
|
|
260
|
+
class="carousel__nav-glyph"
|
|
261
|
+
library="helix"
|
|
262
|
+
name="chevron-up"
|
|
270
263
|
aria-hidden="true"
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
viewBox="0 0 24 24"
|
|
276
|
-
fill="none"
|
|
277
|
-
stroke="currentColor"
|
|
278
|
-
stroke-width="2"
|
|
279
|
-
stroke-linecap="round"
|
|
280
|
-
stroke-linejoin="round"
|
|
264
|
+
></hx-icon>`, M = l`<hx-icon
|
|
265
|
+
class="carousel__nav-glyph"
|
|
266
|
+
library="helix"
|
|
267
|
+
name="chevron-right"
|
|
281
268
|
aria-hidden="true"
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
viewBox="0 0 24 24"
|
|
287
|
-
fill="none"
|
|
288
|
-
stroke="currentColor"
|
|
289
|
-
stroke-width="2"
|
|
290
|
-
stroke-linecap="round"
|
|
291
|
-
stroke-linejoin="round"
|
|
269
|
+
></hx-icon>`, T = l`<hx-icon
|
|
270
|
+
class="carousel__nav-glyph"
|
|
271
|
+
library="helix"
|
|
272
|
+
name="chevron-down"
|
|
292
273
|
aria-hidden="true"
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
viewBox="0 0 24 24"
|
|
298
|
-
fill="currentColor"
|
|
274
|
+
></hx-icon>`, S = l`<hx-icon
|
|
275
|
+
class="carousel__autoplay-glyph"
|
|
276
|
+
library="fa-free"
|
|
277
|
+
name="play"
|
|
299
278
|
aria-hidden="true"
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
</svg>`, T = l`<svg
|
|
305
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
306
|
-
viewBox="0 0 24 24"
|
|
307
|
-
fill="currentColor"
|
|
279
|
+
></hx-icon>`, $ = l`<hx-icon
|
|
280
|
+
class="carousel__autoplay-glyph"
|
|
281
|
+
library="fa-free"
|
|
282
|
+
name="pause"
|
|
308
283
|
aria-hidden="true"
|
|
309
|
-
|
|
310
|
-
height="1em"
|
|
311
|
-
>
|
|
312
|
-
<rect x="6" y="4" width="4" height="16"></rect>
|
|
313
|
-
<rect x="14" y="4" width="4" height="16"></rect>
|
|
314
|
-
</svg>`;
|
|
284
|
+
></hx-icon>`;
|
|
315
285
|
let o = class extends _ {
|
|
316
286
|
constructor() {
|
|
317
287
|
super(...arguments), this.label = "Carousel", this.loop = !1, this.autoplay = !1, this.autoplayInterval = 3e3, this.slidesPerPage = 1, this.slidesPerMove = 1, this.orientation = "horizontal", this.mouseDragging = !1, this.labelPrevSlide = "Previous slide", this.labelNextSlide = "Next slide", this.labelPauseAutoplay = "Pause autoplay", this.labelPlayAutoplay = "Play autoplay", this.labelSlideOf = (t, e) => `Slide ${t} of ${e}`, this._currentIndex = 0, this._slides = [], this._isPlaying = !1, this._liveText = "", this._livePolite = !0, this._autoplayTimer = null, this._reducedMotion = !1, this._mql = null, this._isHovered = !1, this._isFocused = !1, this._dragStartCoord = 0, this._isDragging = !1, this._dragMoved = !1, this._touchStartCoord = 0, this._touchMoved = !1, this._autoplayTick = () => {
|
|
@@ -348,8 +318,8 @@ let o = class extends _ {
|
|
|
348
318
|
const t = (i = this.shadowRoot) == null ? void 0 : i.querySelector("slot:not([name])");
|
|
349
319
|
if (!t) return;
|
|
350
320
|
const e = t.assignedElements({ flatten: !0 }).filter((r) => r.tagName.toLowerCase() === "hx-carousel-item");
|
|
351
|
-
this._slides = e, e.forEach((r,
|
|
352
|
-
r.slideIndex =
|
|
321
|
+
this._slides = e, e.forEach((r, a) => {
|
|
322
|
+
r.slideIndex = a, r.totalSlides = e.length;
|
|
353
323
|
const h = `${100 / this.slidesPerPage}%`;
|
|
354
324
|
r.style.setProperty("--_hx-carousel-slide-width", h);
|
|
355
325
|
}), this._currentIndex >= e.length && (this._currentIndex = Math.max(0, e.length - 1));
|
|
@@ -445,8 +415,8 @@ let o = class extends _ {
|
|
|
445
415
|
if (!this._isDragging) return;
|
|
446
416
|
const e = t.changedTouches[0];
|
|
447
417
|
if (!e) return;
|
|
448
|
-
const r = (this.orientation === "horizontal" ? e.clientX : e.clientY) - this._touchStartCoord,
|
|
449
|
-
this._touchMoved && (r >
|
|
418
|
+
const r = (this.orientation === "horizontal" ? e.clientX : e.clientY) - this._touchStartCoord, a = 50;
|
|
419
|
+
this._touchMoved && (r > a ? this.previous() : r < -a && this.next()), this._isDragging = !1, this._touchMoved = !1;
|
|
450
420
|
}
|
|
451
421
|
/** @internal */
|
|
452
422
|
_goToManual(t) {
|
|
@@ -549,19 +519,19 @@ let o = class extends _ {
|
|
|
549
519
|
}
|
|
550
520
|
/** @internal */
|
|
551
521
|
_renderPrevIcon() {
|
|
552
|
-
return this.orientation === "horizontal" ?
|
|
522
|
+
return this.orientation === "horizontal" ? w : I;
|
|
553
523
|
}
|
|
554
524
|
/** @internal */
|
|
555
525
|
_renderNextIcon() {
|
|
556
|
-
return this.orientation === "horizontal" ?
|
|
526
|
+
return this.orientation === "horizontal" ? M : T;
|
|
557
527
|
}
|
|
558
528
|
/** @internal */
|
|
559
529
|
_renderPlayIcon() {
|
|
560
|
-
return
|
|
530
|
+
return S;
|
|
561
531
|
}
|
|
562
532
|
/** @internal */
|
|
563
533
|
_renderPauseIcon() {
|
|
564
|
-
return
|
|
534
|
+
return $;
|
|
565
535
|
}
|
|
566
536
|
// ─── Render ───
|
|
567
537
|
render() {
|
|
@@ -606,65 +576,65 @@ let o = class extends _ {
|
|
|
606
576
|
`;
|
|
607
577
|
}
|
|
608
578
|
};
|
|
609
|
-
o.styles = [
|
|
610
|
-
|
|
579
|
+
o.styles = [m, y];
|
|
580
|
+
s([
|
|
611
581
|
n({ type: String, reflect: !0 })
|
|
612
582
|
], o.prototype, "label", 2);
|
|
613
|
-
|
|
583
|
+
s([
|
|
614
584
|
n({ type: Boolean, reflect: !0 })
|
|
615
585
|
], o.prototype, "loop", 2);
|
|
616
|
-
|
|
586
|
+
s([
|
|
617
587
|
n({ type: Boolean, reflect: !0 })
|
|
618
588
|
], o.prototype, "autoplay", 2);
|
|
619
|
-
|
|
589
|
+
s([
|
|
620
590
|
n({ type: Number, attribute: "autoplay-interval" })
|
|
621
591
|
], o.prototype, "autoplayInterval", 2);
|
|
622
|
-
|
|
592
|
+
s([
|
|
623
593
|
n({ type: Number, attribute: "slides-per-page" })
|
|
624
594
|
], o.prototype, "slidesPerPage", 2);
|
|
625
|
-
|
|
595
|
+
s([
|
|
626
596
|
n({ type: Number, attribute: "slides-per-move" })
|
|
627
597
|
], o.prototype, "slidesPerMove", 2);
|
|
628
|
-
|
|
598
|
+
s([
|
|
629
599
|
n({ type: String, reflect: !0 })
|
|
630
600
|
], o.prototype, "orientation", 2);
|
|
631
|
-
|
|
601
|
+
s([
|
|
632
602
|
n({ type: Boolean, attribute: "mouse-dragging", reflect: !0 })
|
|
633
603
|
], o.prototype, "mouseDragging", 2);
|
|
634
|
-
|
|
604
|
+
s([
|
|
635
605
|
n({ type: String, attribute: "label-prev-slide" })
|
|
636
606
|
], o.prototype, "labelPrevSlide", 2);
|
|
637
|
-
|
|
607
|
+
s([
|
|
638
608
|
n({ type: String, attribute: "label-next-slide" })
|
|
639
609
|
], o.prototype, "labelNextSlide", 2);
|
|
640
|
-
|
|
610
|
+
s([
|
|
641
611
|
n({ type: String, attribute: "label-pause-autoplay" })
|
|
642
612
|
], o.prototype, "labelPauseAutoplay", 2);
|
|
643
|
-
|
|
613
|
+
s([
|
|
644
614
|
n({ type: String, attribute: "label-play-autoplay" })
|
|
645
615
|
], o.prototype, "labelPlayAutoplay", 2);
|
|
646
|
-
|
|
616
|
+
s([
|
|
647
617
|
n({ attribute: !1 })
|
|
648
618
|
], o.prototype, "labelSlideOf", 2);
|
|
649
|
-
|
|
619
|
+
s([
|
|
650
620
|
c()
|
|
651
621
|
], o.prototype, "_currentIndex", 2);
|
|
652
|
-
|
|
622
|
+
s([
|
|
653
623
|
c()
|
|
654
624
|
], o.prototype, "_slides", 2);
|
|
655
|
-
|
|
625
|
+
s([
|
|
656
626
|
c()
|
|
657
627
|
], o.prototype, "_isPlaying", 2);
|
|
658
|
-
|
|
628
|
+
s([
|
|
659
629
|
c()
|
|
660
630
|
], o.prototype, "_liveText", 2);
|
|
661
|
-
|
|
631
|
+
s([
|
|
662
632
|
c()
|
|
663
633
|
], o.prototype, "_livePolite", 2);
|
|
664
|
-
o =
|
|
634
|
+
o = s([
|
|
665
635
|
f("hx-carousel")
|
|
666
636
|
], o);
|
|
667
|
-
const
|
|
637
|
+
const C = g`
|
|
668
638
|
:host {
|
|
669
639
|
display: block;
|
|
670
640
|
flex-shrink: 0;
|
|
@@ -691,10 +661,10 @@ const S = g`
|
|
|
691
661
|
}
|
|
692
662
|
}
|
|
693
663
|
`;
|
|
694
|
-
var
|
|
695
|
-
for (var
|
|
696
|
-
(u = t[h]) && (
|
|
697
|
-
return r &&
|
|
664
|
+
var D = Object.defineProperty, k = Object.getOwnPropertyDescriptor, v = (t, e, i, r) => {
|
|
665
|
+
for (var a = r > 1 ? void 0 : r ? k(e, i) : e, h = t.length - 1, u; h >= 0; h--)
|
|
666
|
+
(u = t[h]) && (a = (r ? u(e, i, a) : u(a)) || a);
|
|
667
|
+
return r && a && D(e, i, a), a;
|
|
698
668
|
};
|
|
699
669
|
let d = class extends _ {
|
|
700
670
|
constructor() {
|
|
@@ -709,7 +679,7 @@ let d = class extends _ {
|
|
|
709
679
|
`;
|
|
710
680
|
}
|
|
711
681
|
};
|
|
712
|
-
d.styles = [
|
|
682
|
+
d.styles = [C];
|
|
713
683
|
v([
|
|
714
684
|
n({ type: Number, attribute: "slide-index" })
|
|
715
685
|
], d.prototype, "slideIndex", 2);
|
|
@@ -723,4 +693,4 @@ export {
|
|
|
723
693
|
o as H,
|
|
724
694
|
d as a
|
|
725
695
|
};
|
|
726
|
-
//# sourceMappingURL=hx-carousel-item-
|
|
696
|
+
//# sourceMappingURL=hx-carousel-item-BVIKgQ4i.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hx-carousel-item-BVIKgQ4i.js","sources":["../../src/components/hx-carousel/hx-carousel.styles.ts","../../src/components/hx-carousel/hx-carousel.ts","../../src/components/hx-carousel/hx-carousel-item.styles.ts","../../src/components/hx-carousel/hx-carousel-item.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixCarouselStyles = css`\n :host {\n display: block;\n position: relative;\n }\n\n /* ─── Base ─── */\n\n .base {\n display: flex;\n flex-direction: column;\n gap: var(--hx-space-3, 0.75rem);\n }\n\n :host([orientation='vertical']) .base {\n flex-direction: row;\n }\n\n /* ─── Navigation ─── */\n\n .navigation {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: var(--hx-space-2, 0.5rem);\n }\n\n :host([orientation='vertical']) .navigation {\n flex-direction: column;\n }\n\n .nav-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: var(--hx-carousel-nav-btn-size, var(--hx-size-10, 2.5rem));\n height: var(--hx-carousel-nav-btn-size, var(--hx-size-10, 2.5rem));\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 border: var(--hx-border-width-thin, 1px) solid\n var(--hx-carousel-nav-btn-border-color, var(--hx-color-neutral-200, #d6dbd5));\n border-radius: var(--hx-border-radius-full, 9999px);\n background: var(--hx-carousel-nav-btn-bg, var(--hx-color-neutral-0, #ffffff));\n color: var(--hx-carousel-nav-btn-color, var(--hx-color-neutral-700, #313e4b));\n cursor: pointer;\n padding: 0;\n transition:\n background-color var(--hx-transition-fast, 150ms ease),\n color var(--hx-transition-fast, 150ms ease),\n border-color var(--hx-transition-fast, 150ms ease);\n flex-shrink: 0;\n }\n\n .nav-btn:hover:not([disabled]) {\n background: var(--hx-carousel-nav-btn-hover-bg, var(--hx-color-neutral-50, #f5f8f3));\n border-color: var(\n --hx-carousel-nav-btn-hover-border-color,\n var(--hx-color-neutral-400, #8e9c98)\n );\n }\n\n .nav-btn:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-carousel-focus-ring-color, var(--hx-focus-ring-color, #0f7078));\n outline-offset: var(--hx-focus-ring-offset, 2px);\n }\n\n .nav-btn[disabled] {\n opacity: var(--hx-opacity-disabled, 0.5);\n cursor: not-allowed;\n }\n\n .nav-btn .carousel__nav-glyph {\n --hx-icon-size: 1.25em;\n }\n\n .play-pause-btn .carousel__autoplay-glyph {\n --hx-icon-size: 1em;\n }\n\n /* ─── Play/Pause ─── */\n\n .play-pause-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n /* WCAG 2.5.5 (healthcare mandate): minimum 44x44px touch target */\n min-width: var(--hx-touch-target-min, 2.75rem);\n min-height: var(--hx-touch-target-min, 2.75rem);\n width: var(--hx-touch-target-min, 2.75rem);\n height: var(--hx-touch-target-min, 2.75rem);\n border: var(--hx-border-width-thin, 1px) solid transparent;\n border-radius: var(--hx-border-radius-md, 0.375rem);\n background: transparent;\n color: var(--hx-carousel-play-pause-color, var(--hx-color-neutral-500, #66787b));\n cursor: pointer;\n padding: 0;\n font-size: var(--hx-font-size-sm, 0.875rem);\n transition: background-color var(--hx-transition-fast, 150ms ease);\n flex-shrink: 0;\n }\n\n .play-pause-btn:hover {\n background: var(--hx-carousel-play-pause-hover-bg, var(--hx-color-neutral-100, #ebeee9));\n }\n\n .play-pause-btn:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-carousel-focus-ring-color, var(--hx-focus-ring-color, #0f7078));\n outline-offset: var(--hx-focus-ring-offset, 2px);\n }\n\n /* ─── Scroll Container ─── */\n\n .scroll-container-wrapper {\n flex: 1;\n overflow: hidden;\n }\n\n .slide-viewport {\n overflow: hidden;\n border-radius: var(--hx-border-radius-md, 0.375rem);\n }\n\n .track {\n display: flex;\n transition: transform var(--hx-transition-base, 0.3s ease);\n }\n\n :host([orientation='vertical']) .track {\n flex-direction: column;\n }\n\n /* ─── Pagination ─── */\n\n .pagination {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: var(--hx-space-2, 0.5rem);\n flex-wrap: wrap;\n }\n\n :host([orientation='vertical']) .pagination {\n flex-direction: column;\n }\n\n .pagination-item {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n /* WCAG 2.5.5 (healthcare mandate): minimum 44x44px touch target */\n min-width: var(--hx-touch-target-min, 2.75rem);\n min-height: var(--hx-touch-target-min, 2.75rem);\n padding: 0;\n border: none;\n cursor: pointer;\n background: transparent;\n border-radius: var(--hx-border-radius-full, 9999px);\n }\n\n .pagination-dot {\n display: block;\n width: var(--hx-carousel-pagination-dot-size, 0.5rem);\n height: var(--hx-carousel-pagination-dot-size, 0.5rem);\n border-radius: var(--hx-border-radius-full, 9999px);\n background: var(--hx-carousel-pagination-dot-bg, var(--hx-color-neutral-300, #b6bfb9));\n transition:\n background-color var(--hx-transition-fast, 150ms ease),\n transform var(--hx-transition-fast, 150ms ease);\n }\n\n .pagination-item[aria-current='true'] .pagination-dot,\n .pagination-item.is-active .pagination-dot {\n background: var(--hx-carousel-pagination-dot-active-bg, var(--hx-color-primary-600, #0f7078));\n transform: scale(1.25);\n }\n\n .pagination-item:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-carousel-focus-ring-color, var(--hx-focus-ring-color, #0f7078));\n outline-offset: var(--hx-focus-ring-offset, 2px);\n border-radius: var(--hx-border-radius-full, 9999px);\n }\n\n /* ─── Controls row ─── */\n\n .controls {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: var(--hx-space-3, 0.75rem);\n }\n\n /* ─── Live Region ─── */\n\n .live-region {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n }\n\n /* ─── Reduced Motion ─── */\n\n @media (prefers-reduced-motion: reduce) {\n .track,\n .nav-btn,\n .pagination-dot,\n .play-pause-btn {\n transition: none;\n }\n }\n\n /* ─── Forced Colors (Windows High Contrast) ─── */\n\n @media (forced-colors: active) {\n .nav-btn {\n border-color: ButtonText;\n color: ButtonText;\n }\n\n .play-pause-btn {\n border-color: ButtonText;\n color: ButtonText;\n }\n\n .pagination-dot {\n border: 1px solid CanvasText;\n }\n\n .pagination-item[aria-current='true'] .pagination-dot,\n .pagination-item.is-active .pagination-dot {\n background: Highlight;\n border-color: Highlight;\n }\n }\n`;\n","import { html, nothing } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport '../hx-icon/hx-icon.js';\nimport { HelixElement } from '../../base/index.js';\nimport { helixCarouselStyles } from './hx-carousel.styles.js';\nimport { forcedColorsInteractive } from '../../styles/forced-colors.js';\nimport type { HelixCarouselItem } from './hx-carousel-item.js';\n\n// ─── Module-level icon templates (helix glyphs; play/pause from FA Free) ───\n\nconst _svgChevronLeft = html`<hx-icon\n class=\"carousel__nav-glyph\"\n library=\"helix\"\n name=\"chevron-left\"\n aria-hidden=\"true\"\n></hx-icon>`;\n\nconst _svgChevronUp = html`<hx-icon\n class=\"carousel__nav-glyph\"\n library=\"helix\"\n name=\"chevron-up\"\n aria-hidden=\"true\"\n></hx-icon>`;\n\nconst _svgChevronRight = html`<hx-icon\n class=\"carousel__nav-glyph\"\n library=\"helix\"\n name=\"chevron-right\"\n aria-hidden=\"true\"\n></hx-icon>`;\n\nconst _svgChevronDown = html`<hx-icon\n class=\"carousel__nav-glyph\"\n library=\"helix\"\n name=\"chevron-down\"\n aria-hidden=\"true\"\n></hx-icon>`;\n\n// Play / pause aren't part of the curated 32-glyph helix vocabulary, so the\n// carousel's autoplay toggle falls back to FA Free Solid.\nconst _svgPlay = html`<hx-icon\n class=\"carousel__autoplay-glyph\"\n library=\"fa-free\"\n name=\"play\"\n aria-hidden=\"true\"\n></hx-icon>`;\n\nconst _svgPause = html`<hx-icon\n class=\"carousel__autoplay-glyph\"\n library=\"fa-free\"\n name=\"pause\"\n aria-hidden=\"true\"\n></hx-icon>`;\n\n/**\n * A scrollable carousel/slider for images or content slides.\n *\n * @summary Scrollable carousel with navigation, pagination, autoplay, and an accessible label.\n *\n * @tag hx-carousel\n *\n * @slot - `hx-carousel-item` elements (the slides).\n * @slot next-button - Custom next navigation button.\n * @slot previous-button - Custom previous navigation button.\n *\n * @fires {CustomEvent<{index: number, slide: HelixCarouselItem}>} hx-slide-change - Dispatched when the active slide changes.\n *\n * @csspart base - The outer wrapper element.\n * @csspart slide-viewport - The slide viewport/overflow container.\n * @csspart pagination - The pagination dot container.\n * @csspart pagination-item - Individual pagination dot button.\n * @csspart navigation - The previous/next button wrapper.\n * @csspart prev-button - The previous navigation button.\n * @csspart next-button - The next navigation button.\n * @csspart play-pause-btn - The autoplay play/pause toggle button.\n *\n * @cssprop [--hx-carousel-gap=0px] - Gap between slides.\n * @cssprop [--hx-carousel-slide-width=100%] - Width override for each slide.\n * @cssprop [--hx-carousel-nav-btn-size=2.5rem] - Size of previous/next navigation buttons.\n * @cssprop [--hx-carousel-pagination-dot-size=0.5rem] - Size of pagination dots.\n * @cssprop [--hx-space-3] - Spacing token.\n * @cssprop [--hx-space-2] - Spacing token.\n * @cssprop [--hx-size-10] - Size token.\n * @cssprop [--hx-touch-target-min] - Minimum touch target size.\n * @cssprop [--hx-border-width-thin] - Width.\n * @cssprop [--hx-color-neutral-200] - Color.\n * @cssprop [--hx-border-radius-full] - CSS custom property.\n * @cssprop [--hx-color-neutral-0] - Color.\n * @cssprop [--hx-color-neutral-700] - Color.\n * @cssprop [--hx-transition-fast] - Transition timing.\n * @cssprop [--hx-color-neutral-50] - Color.\n * @cssprop [--hx-color-neutral-400] - Color.\n * @cssprop [--hx-focus-ring-width] - Width.\n * @cssprop [--hx-carousel-focus-ring-color=var(--hx-focus-ring-color)] - Color.\n * @cssprop [--hx-focus-ring-color] - Color.\n * @cssprop [--hx-color-primary-500] - Color.\n * @cssprop [--hx-focus-ring-offset] - CSS custom property.\n * @cssprop [--hx-opacity-disabled] - Opacity.\n * @cssprop [--hx-border-radius-md] - CSS custom property.\n * @cssprop [--hx-color-neutral-500] - Color.\n * @cssprop [--hx-font-size-sm] - Font size.\n * @cssprop [--hx-color-neutral-100] - Color.\n * @cssprop [--hx-transition-base] - Transition timing.\n * @cssprop [--hx-color-neutral-300] - Color.\n * @cssprop [--hx-color-primary-600] - Color.\n */\n@customElement('hx-carousel')\nexport class HelixCarousel extends HelixElement {\n static override styles = [helixCarouselStyles, forcedColorsInteractive];\n\n /**\n * Accessible label identifying this carousel to assistive technology.\n * When multiple carousels appear on the same page, each must have a unique label.\n * @attr label\n */\n @property({ type: String, reflect: true })\n label = 'Carousel';\n\n /**\n * Whether the carousel wraps around from last to first slide and vice-versa.\n * @attr loop\n */\n @property({ type: Boolean, reflect: true })\n loop = false;\n\n /**\n * Whether the carousel auto-advances slides.\n * Automatically pauses on hover, focus, and when prefers-reduced-motion is active.\n * @attr autoplay\n */\n @property({ type: Boolean, reflect: true })\n autoplay = false;\n\n /**\n * Milliseconds between auto-advance transitions.\n * @attr autoplay-interval\n */\n @property({ type: Number, attribute: 'autoplay-interval' })\n autoplayInterval = 3000;\n\n /**\n * Number of slides visible at once.\n * @attr slides-per-page\n */\n @property({ type: Number, attribute: 'slides-per-page' })\n slidesPerPage = 1;\n\n /**\n * Number of slides to advance per navigation action.\n * @attr slides-per-move\n */\n @property({ type: Number, attribute: 'slides-per-move' })\n slidesPerMove = 1;\n\n /**\n * Scroll axis of the carousel.\n * @attr orientation\n */\n @property({ type: String, reflect: true })\n orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n /**\n * Whether click-drag scrolling is enabled.\n * @attr mouse-dragging\n */\n @property({ type: Boolean, attribute: 'mouse-dragging', reflect: true })\n mouseDragging = false;\n\n /**\n * Accessible label for the previous slide button.\n * @attr label-prev-slide\n */\n @property({ type: String, attribute: 'label-prev-slide' })\n labelPrevSlide = 'Previous slide';\n\n /**\n * Accessible label for the next slide button.\n * @attr label-next-slide\n */\n @property({ type: String, attribute: 'label-next-slide' })\n labelNextSlide = 'Next slide';\n\n /**\n * Accessible label for the autoplay pause button.\n * @attr label-pause-autoplay\n */\n @property({ type: String, attribute: 'label-pause-autoplay' })\n labelPauseAutoplay = 'Pause autoplay';\n\n /**\n * Accessible label for the autoplay play button.\n * @attr label-play-autoplay\n */\n @property({ type: String, attribute: 'label-play-autoplay' })\n labelPlayAutoplay = 'Play autoplay';\n\n /**\n * Generates the live-region text for a slide position.\n * @param index - 1-based slide index\n * @param total - total slide count\n */\n @property({ attribute: false })\n labelSlideOf: (index: number, total: number) => string = (index, total) =>\n `Slide ${index} of ${total}`;\n\n /**\n * Index of the currently visible slide.\n * @internal\n */\n @state() private _currentIndex = 0;\n /**\n * Array of carousel item elements assigned to the default slot.\n * @internal\n */\n @state() private _slides: HelixCarouselItem[] = [];\n /**\n * Whether the autoplay is currently active and advancing slides.\n * @internal\n */\n @state() private _isPlaying = false;\n /**\n * Text content for the ARIA live region announcing slide changes.\n * @internal\n */\n @state() private _liveText = '';\n /** @internal */\n @state() private _livePolite = true;\n\n /**\n * Reference to the active autoplay interval timer, or null when stopped.\n * @internal\n */\n private _autoplayTimer: ReturnType<typeof setInterval> | null = null;\n /**\n * Whether the user has requested reduced motion via the OS media preference.\n * @internal\n */\n private _reducedMotion = false;\n /**\n * MediaQueryList instance for monitoring the prefers-reduced-motion media feature.\n * @internal\n */\n private _mql: MediaQueryList | null = null;\n /**\n * Whether the carousel is currently being hovered, used to pause autoplay on hover.\n * @internal\n */\n private _isHovered = false;\n /**\n * Whether a descendant of the carousel currently has focus, used to pause autoplay on focus.\n * @internal\n */\n private _isFocused = false;\n\n // ─── Drag state ───\n /**\n * Pointer coordinate at the start of a mouse drag gesture.\n * @internal\n */\n private _dragStartCoord = 0;\n /**\n * Whether a mouse drag gesture is currently in progress.\n * @internal\n */\n private _isDragging = false;\n /**\n * Whether the pointer has moved beyond the drag threshold during the current drag gesture.\n * @internal\n */\n private _dragMoved = false;\n /**\n * Touch coordinate at the start of a touch swipe gesture.\n * @internal\n */\n private _touchStartCoord = 0;\n /**\n * Whether the touch has moved beyond the swipe threshold during the current touch gesture.\n * @internal\n */\n private _touchMoved = false;\n\n // ─── Lifecycle ───\n\n override connectedCallback(): void {\n super.connectedCallback();\n\n // Guard for SSR — window.matchMedia is unavailable server-side\n if (typeof window !== 'undefined') {\n this._mql = window.matchMedia('(prefers-reduced-motion: reduce)');\n this._reducedMotion = this._mql.matches;\n this._mql.addEventListener('change', this._handleMotionChange);\n }\n\n this.addEventListener('mouseenter', this._handleMouseEnter);\n this.addEventListener('mouseleave', this._handleMouseLeave);\n this.addEventListener('focusin', this._handleFocusIn);\n this.addEventListener('focusout', this._handleFocusOut);\n this.addEventListener('keydown', this._handleKeydown);\n // Touch events are registered directly on the scroll-container in the template\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this._mql?.removeEventListener('change', this._handleMotionChange);\n this._stopAutoplay();\n this.removeEventListener('mouseenter', this._handleMouseEnter);\n this.removeEventListener('mouseleave', this._handleMouseLeave);\n this.removeEventListener('focusin', this._handleFocusIn);\n this.removeEventListener('focusout', this._handleFocusOut);\n this.removeEventListener('keydown', this._handleKeydown);\n }\n\n override firstUpdated(): void {\n this._syncSlides();\n if (this.autoplay && !this._reducedMotion) {\n this._startAutoplay();\n }\n }\n\n // ─── Slide Management ───\n\n /** @internal */\n private _syncSlides(): void {\n const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot:not([name])');\n if (!slot) return;\n\n const items = slot\n .assignedElements({ flatten: true })\n .filter((el) => el.tagName.toLowerCase() === 'hx-carousel-item') as HelixCarouselItem[];\n\n this._slides = items;\n\n // Update aria labels on each item\n items.forEach((item, i) => {\n item.slideIndex = i;\n item.totalSlides = items.length;\n const slideWidth = `${100 / this.slidesPerPage}%`;\n (item as HTMLElement).style.setProperty('--_hx-carousel-slide-width', slideWidth);\n });\n\n // Clamp currentIndex if slides changed\n if (this._currentIndex >= items.length) {\n this._currentIndex = Math.max(0, items.length - 1);\n }\n }\n\n /** @internal */\n private _handleSlotChange(): void {\n this._syncSlides();\n }\n\n // ─── Navigation ───\n\n /**\n * Maximum valid slide index accounting for the number of slides visible per page.\n * @internal\n */\n private get _maxIndex(): number {\n return Math.max(0, this._slides.length - this.slidesPerPage);\n }\n\n goTo(index: number): void {\n if (this._slides.length === 0) return;\n\n let next = index;\n if (this.loop) {\n next = ((index % this._slides.length) + this._slides.length) % this._slides.length;\n } else {\n next = Math.max(0, Math.min(index, this._maxIndex));\n }\n\n if (next === this._currentIndex) return;\n\n this._currentIndex = next;\n this._liveText = this.labelSlideOf(next + 1, this._slides.length);\n const slide = this._slides[next];\n if (!slide) return;\n this.dispatchEvent(\n new CustomEvent<{ index: number; slide: HelixCarouselItem | undefined }>('hx-slide-change', {\n bubbles: true,\n composed: true,\n detail: { index: next, slide },\n }),\n );\n }\n\n next(): void {\n const nextIndex = this._currentIndex + this.slidesPerMove;\n if (!this.loop && nextIndex > this._maxIndex) {\n return;\n }\n this._livePolite = true;\n this.goTo(nextIndex);\n }\n\n previous(): void {\n const prevIndex = this._currentIndex - this.slidesPerMove;\n if (!this.loop && prevIndex < 0) {\n return;\n }\n this._livePolite = true;\n this.goTo(prevIndex);\n }\n\n // ─── Autoplay ───\n\n /**\n * Callback invoked on each autoplay interval tick to advance to the next slide.\n * @internal\n */\n private _autoplayTick = (): void => {\n this._livePolite = false;\n if (this.loop) {\n this.goTo(this._currentIndex + this.slidesPerMove);\n } else if (this._currentIndex < this._maxIndex) {\n this.goTo(this._currentIndex + this.slidesPerMove);\n } else {\n this.goTo(0);\n }\n };\n\n /** @internal */\n private _startAutoplay(): void {\n if (this._autoplayTimer !== null) return;\n this._isPlaying = true;\n this._autoplayTimer = setInterval(this._autoplayTick, this.autoplayInterval);\n }\n\n /** @internal */\n private _stopAutoplay(): void {\n if (this._autoplayTimer !== null) {\n clearInterval(this._autoplayTimer);\n this._autoplayTimer = null;\n }\n this._isPlaying = false;\n }\n\n /** @internal */\n private _toggleAutoplay(): void {\n if (this._isPlaying) {\n this._stopAutoplay();\n } else if (!this._reducedMotion) {\n this._startAutoplay();\n }\n }\n\n /** @internal */\n private _pauseAutoplay(): void {\n if (!this._isPlaying || this._autoplayTimer === null) return;\n clearInterval(this._autoplayTimer);\n this._autoplayTimer = null;\n }\n\n /** @internal */\n private _resumeAutoplay(): void {\n if (!this.autoplay || !this._isPlaying || this._reducedMotion) return;\n if (this._autoplayTimer !== null) return;\n this._autoplayTimer = setInterval(this._autoplayTick, this.autoplayInterval);\n }\n\n // ─── Event Handlers ───\n\n /**\n * Handles changes to the prefers-reduced-motion media query, stopping or resuming autoplay accordingly.\n * @internal\n */\n private _handleMotionChange = (e: MediaQueryListEvent): void => {\n this._reducedMotion = e.matches;\n if (this._reducedMotion) {\n this._stopAutoplay();\n } else if (this.autoplay && !this._isHovered && !this._isFocused) {\n this._startAutoplay();\n }\n };\n\n /**\n * Handles the mouseenter event to pause autoplay while the user hovers over the carousel.\n * @internal\n */\n private _handleMouseEnter = (): void => {\n this._isHovered = true;\n this._pauseAutoplay();\n };\n\n /**\n * Handles the mouseleave event to resume autoplay when the user stops hovering.\n * @internal\n */\n private _handleMouseLeave = (): void => {\n this._isHovered = false;\n if (!this._isFocused) {\n this._resumeAutoplay();\n }\n };\n\n /**\n * Handles the focusin event to pause autoplay while a descendant has focus.\n * @internal\n */\n private _handleFocusIn = (): void => {\n this._isFocused = true;\n this._pauseAutoplay();\n };\n\n /**\n * Handles the focusout event to resume autoplay when focus leaves the carousel.\n * @internal\n */\n private _handleFocusOut = (): void => {\n this._isFocused = false;\n if (!this._isHovered) {\n this._resumeAutoplay();\n }\n };\n\n /**\n * Handles keyboard navigation to move between slides using arrow, Home, and End keys.\n * @internal\n */\n private _handleKeydown = (e: KeyboardEvent): void => {\n if (this.orientation === 'horizontal') {\n if (e.key === 'ArrowLeft') {\n e.preventDefault();\n this.previous();\n } else if (e.key === 'ArrowRight') {\n e.preventDefault();\n this.next();\n }\n } else {\n if (e.key === 'ArrowUp') {\n e.preventDefault();\n this.previous();\n } else if (e.key === 'ArrowDown') {\n e.preventDefault();\n this.next();\n }\n }\n\n if (e.key === 'Home') {\n e.preventDefault();\n this.goTo(0);\n } else if (e.key === 'End') {\n e.preventDefault();\n this.goTo(this._slides.length - 1);\n }\n };\n\n // ─── Drag Handlers ───\n\n /** @internal */\n private _handleDragStart(e: MouseEvent): void {\n if (!this.mouseDragging) return;\n this._isDragging = true;\n this._dragMoved = false;\n this._dragStartCoord = this.orientation === 'horizontal' ? e.clientX : e.clientY;\n (e.currentTarget as HTMLElement).style.cursor = 'grabbing';\n e.preventDefault();\n }\n\n /** @internal */\n private _handleDragMove(e: MouseEvent): void {\n if (!this._isDragging) return;\n const current = this.orientation === 'horizontal' ? e.clientX : e.clientY;\n const diff = current - this._dragStartCoord;\n if (Math.abs(diff) > 5) {\n this._dragMoved = true;\n }\n }\n\n /** @internal */\n private _handleDragEnd(e: MouseEvent): void {\n if (!this._isDragging) return;\n const current = this.orientation === 'horizontal' ? e.clientX : e.clientY;\n const diff = current - this._dragStartCoord;\n const threshold = 50;\n if (this._dragMoved) {\n if (diff > threshold) {\n this.previous();\n } else if (diff < -threshold) {\n this.next();\n }\n }\n this._isDragging = false;\n this._dragMoved = false;\n (e.currentTarget as HTMLElement).style.cursor = '';\n }\n\n // ─── Touch Handlers ───\n\n /** @internal */\n private _handleTouchStart(e: TouchEvent): void {\n if (!this.mouseDragging) return;\n const touch = e.touches[0];\n if (!touch) return;\n this._isDragging = true;\n this._touchMoved = false;\n this._touchStartCoord = this.orientation === 'horizontal' ? touch.clientX : touch.clientY;\n }\n\n /** @internal */\n private _handleTouchMove(e: TouchEvent): void {\n if (!this._isDragging) return;\n const touch = e.touches[0];\n if (!touch) return;\n const current = this.orientation === 'horizontal' ? touch.clientX : touch.clientY;\n const diff = current - this._touchStartCoord;\n if (Math.abs(diff) > 5) {\n this._touchMoved = true;\n }\n }\n\n /** @internal */\n private _handleTouchEnd(e: TouchEvent): void {\n if (!this._isDragging) return;\n const touch = e.changedTouches[0];\n if (!touch) return;\n const current = this.orientation === 'horizontal' ? touch.clientX : touch.clientY;\n const diff = current - this._touchStartCoord;\n const threshold = 50;\n if (this._touchMoved) {\n if (diff > threshold) {\n this.previous();\n } else if (diff < -threshold) {\n this.next();\n }\n }\n this._isDragging = false;\n this._touchMoved = false;\n }\n\n /** @internal */\n private _goToManual(index: number): void {\n this._livePolite = true;\n this.goTo(index);\n }\n\n // ─── Computed ───\n\n /**\n * CSS transform value applied to the slide track to scroll to the current index.\n * @internal\n */\n private get _trackTransform(): string {\n const slideSize = 100 / this.slidesPerPage;\n const offset = this._currentIndex * slideSize;\n return this.orientation === 'horizontal'\n ? `translateX(-${offset}%)`\n : `translateY(-${offset}%)`;\n }\n\n /**\n * Whether the previous navigation button should be enabled.\n * @internal\n */\n private get _canGoPrev(): boolean {\n return this.loop || this._currentIndex > 0;\n }\n\n /**\n * Whether the next navigation button should be enabled.\n * @internal\n */\n private get _canGoNext(): boolean {\n return this.loop || this._currentIndex < this._maxIndex;\n }\n\n // ─── Render Helpers ───\n\n /** @internal */\n private _renderNavigation() {\n return html`\n <div class=\"navigation\" part=\"navigation\">\n <slot name=\"previous-button\">\n <button\n class=\"nav-btn\"\n part=\"prev-button\"\n type=\"button\"\n aria-label=${this.labelPrevSlide}\n ?disabled=${!this._canGoPrev}\n @click=${() => this.previous()}\n >\n ${this._renderPrevIcon()}\n </button>\n </slot>\n ${this.autoplay\n ? html`\n <button\n class=\"play-pause-btn\"\n part=\"play-pause-btn\"\n type=\"button\"\n aria-label=${this._isPlaying ? this.labelPauseAutoplay : this.labelPlayAutoplay}\n @click=${() => this._toggleAutoplay()}\n >\n ${this._isPlaying ? this._renderPauseIcon() : this._renderPlayIcon()}\n </button>\n `\n : nothing}\n <slot name=\"next-button\">\n <button\n class=\"nav-btn\"\n part=\"next-button\"\n type=\"button\"\n aria-label=${this.labelNextSlide}\n ?disabled=${!this._canGoNext}\n @click=${() => this.next()}\n >\n ${this._renderNextIcon()}\n </button>\n </slot>\n </div>\n `;\n }\n\n /** @internal */\n private _renderPagination() {\n const count = this._slides.length;\n if (count <= 1) return nothing;\n const dots = Array.from({ length: count }, (_, i) => i);\n return html`\n <div class=\"controls\">\n <div class=\"pagination\" part=\"pagination\">\n ${dots.map(\n (i) => html`\n <button\n class=${classMap({\n 'pagination-item': true,\n 'is-active': i === this._currentIndex,\n })}\n part=\"pagination-item\"\n type=\"button\"\n aria-label=${this.labelSlideOf(i + 1, count)}\n aria-current=${i === this._currentIndex ? 'true' : nothing}\n @click=${() => this._goToManual(i)}\n >\n <span class=\"pagination-dot\"></span>\n </button>\n `,\n )}\n </div>\n </div>\n `;\n }\n\n /** @internal */\n private _renderPrevIcon() {\n return this.orientation === 'horizontal' ? _svgChevronLeft : _svgChevronUp;\n }\n\n /** @internal */\n private _renderNextIcon() {\n return this.orientation === 'horizontal' ? _svgChevronRight : _svgChevronDown;\n }\n\n /** @internal */\n private _renderPlayIcon() {\n return _svgPlay;\n }\n\n /** @internal */\n private _renderPauseIcon() {\n return _svgPause;\n }\n\n // ─── Render ───\n\n override render() {\n return html`\n <div\n class=\"base\"\n part=\"base\"\n role=\"region\"\n aria-label=${this.label}\n aria-roledescription=\"carousel\"\n >\n <div\n class=\"live-region\"\n role=\"status\"\n aria-live=${this._livePolite ? 'polite' : 'off'}\n aria-atomic=\"true\"\n >\n ${this._liveText}\n </div>\n ${this._renderNavigation()}\n <div class=\"scroll-container-wrapper\">\n <div\n class=\"slide-viewport\"\n part=\"slide-viewport\"\n aria-live=\"polite\"\n aria-atomic=\"false\"\n @mousedown=${this._handleDragStart}\n @mousemove=${this._handleDragMove}\n @mouseup=${this._handleDragEnd}\n @mouseleave=${this._handleDragEnd}\n @touchstart=${this._handleTouchStart}\n @touchmove=${this._handleTouchMove}\n @touchend=${this._handleTouchEnd}\n >\n <div class=\"track\" style=\"transform: ${this._trackTransform};\">\n <slot @slotchange=${this._handleSlotChange}></slot>\n </div>\n </div>\n </div>\n ${this._renderPagination()}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-carousel': HelixCarousel;\n }\n}\n","import { css } from 'lit';\n\nexport const helixCarouselItemStyles = css`\n :host {\n display: block;\n flex-shrink: 0;\n width: var(--_hx-carousel-slide-width, 100%);\n box-sizing: border-box;\n }\n\n .slide-group {\n height: 100%;\n outline: none;\n }\n\n .slide-group:focus-visible {\n outline: var(--hx-focus-ring-width) solid var(--hx-focus-ring-color);\n outline-offset: var(--hx-focus-ring-offset);\n }\n\n /* ─── High Contrast Mode (forced-colors) ─── */\n\n @media (forced-colors: active) {\n .slide-group:focus-visible {\n outline: 3px solid Highlight;\n outline-offset: 2px;\n }\n }\n`;\n","import { html } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property } from 'lit/decorators.js';\nimport { HelixElement } from '../../base/index.js';\nimport { helixCarouselItemStyles } from './hx-carousel-item.styles.js';\n\n/**\n * A wrapper for individual carousel slides.\n *\n * @summary Individual slide wrapper for use inside hx-carousel.\n *\n * @tag hx-carousel-item\n *\n * @slot - Slide content.\n *\n * @csspart slide - The slide wrapper element.\n */\n@customElement('hx-carousel-item')\nexport class HelixCarouselItem extends HelixElement {\n static override styles = [helixCarouselItemStyles];\n\n /**\n * The 0-based index of this slide within the carousel. Set by hx-carousel.\n * @attr slide-index\n */\n @property({ type: Number, attribute: 'slide-index' })\n slideIndex = 0;\n\n /**\n * Total number of slides in the carousel. Set by hx-carousel.\n * @attr total-slides\n */\n @property({ type: Number, attribute: 'total-slides' })\n totalSlides = 0;\n\n override render() {\n const label = `Slide ${this.slideIndex + 1} of ${this.totalSlides}`;\n return html`\n <div class=\"slide-group\" part=\"slide\" role=\"group\" aria-label=${label} tabindex=\"-1\">\n <slot></slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-carousel-item': HelixCarouselItem;\n }\n}\n"],"names":["helixCarouselStyles","css","_svgChevronLeft","html","_svgChevronUp","_svgChevronRight","_svgChevronDown","_svgPlay","_svgPause","HelixCarousel","HelixElement","index","total","e","_a","slot","items","el","item","i","slideWidth","next","slide","nextIndex","prevIndex","diff","threshold","touch","slideSize","offset","nothing","count","dots","_","classMap","forcedColorsInteractive","__decorateClass","property","state","customElement","helixCarouselItemStyles","HelixCarouselItem","label"],"mappings":";;;;;AAEO,MAAMA,IAAsBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { css as
|
|
2
|
-
import { property as l, query as
|
|
1
|
+
import { css as L, nothing as m, html as g } from "lit";
|
|
2
|
+
import { property as l, query as z, state as b, customElement as T } from "lit/decorators.js";
|
|
3
3
|
import { classMap as E } from "lit/directives/class-map.js";
|
|
4
4
|
import { ifDefined as d } from "lit/directives/if-defined.js";
|
|
5
5
|
import { live as y } from "lit/directives/live.js";
|
|
@@ -9,7 +9,7 @@ import { s as $, i as B, r as I } from "./aria-idref-DCuEaknC.js";
|
|
|
9
9
|
import { m as D } from "./aria-delegation-Doq6RRUy.js";
|
|
10
10
|
import { c as R } from "./id-counter-DuX8vsui.js";
|
|
11
11
|
import { H as q } from "./helix-element-BNEYeiys.js";
|
|
12
|
-
const F =
|
|
12
|
+
const F = L`
|
|
13
13
|
:host {
|
|
14
14
|
display: block;
|
|
15
15
|
}
|
|
@@ -81,6 +81,16 @@ const F = z`
|
|
|
81
81
|
|
|
82
82
|
/* ─── Focus Ring ─── */
|
|
83
83
|
|
|
84
|
+
/*
|
|
85
|
+
* Suppress the browser default ~1px host outline. Without this, the formal
|
|
86
|
+
* AAA audit harness (which measures computed outline-width on the focused
|
|
87
|
+
* host) records a sub-2px outline and reports WCAG 2.4.13 Partially Supports.
|
|
88
|
+
* The visual focus indicator is rendered on the inner .checkbox__box below.
|
|
89
|
+
*/
|
|
90
|
+
:host {
|
|
91
|
+
outline: none;
|
|
92
|
+
}
|
|
93
|
+
|
|
84
94
|
/*
|
|
85
95
|
* Host-focus path: on the modern (IDL element-references) render branch the
|
|
86
96
|
* host is the tabbable surface (tabindex=0) and the inner input is demoted
|
|
@@ -107,15 +117,21 @@ const F = z`
|
|
|
107
117
|
/* ─── Checked State ─── */
|
|
108
118
|
|
|
109
119
|
.checkbox--checked .checkbox__box {
|
|
110
|
-
background-color: var(--hx-checkbox-checked-bg, var(--hx-color-primary-
|
|
111
|
-
border-color: var(
|
|
120
|
+
background-color: var(--hx-checkbox-checked-bg, var(--hx-color-action-primary-bg, #0f7078));
|
|
121
|
+
border-color: var(
|
|
122
|
+
--hx-checkbox-checked-border-color,
|
|
123
|
+
var(--hx-color-action-primary-bg, #0f7078)
|
|
124
|
+
);
|
|
112
125
|
}
|
|
113
126
|
|
|
114
127
|
/* ─── Indeterminate State ─── */
|
|
115
128
|
|
|
116
129
|
.checkbox--indeterminate .checkbox__box {
|
|
117
|
-
background-color: var(--hx-checkbox-checked-bg, var(--hx-color-primary-
|
|
118
|
-
border-color: var(
|
|
130
|
+
background-color: var(--hx-checkbox-checked-bg, var(--hx-color-action-primary-bg, #0f7078));
|
|
131
|
+
border-color: var(
|
|
132
|
+
--hx-checkbox-checked-border-color,
|
|
133
|
+
var(--hx-color-action-primary-bg, #0f7078)
|
|
134
|
+
);
|
|
119
135
|
}
|
|
120
136
|
|
|
121
137
|
/* ─── Error State ─── */
|
|
@@ -148,17 +164,12 @@ const F = z`
|
|
|
148
164
|
border-color: var(--hx-checkbox-error-color, var(--hx-color-error-500, #e5493e));
|
|
149
165
|
}
|
|
150
166
|
|
|
151
|
-
/* ─── Checkmark Icon ─── */
|
|
167
|
+
/* ─── Checkmark Icon (hx-icon library="helix") ─── */
|
|
152
168
|
|
|
153
169
|
.checkbox__icon {
|
|
154
170
|
display: none;
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
fill: none;
|
|
158
|
-
stroke: var(--hx-checkbox-checkmark-color, var(--hx-color-text-on-primary, #ffffff));
|
|
159
|
-
stroke-width: 2.5;
|
|
160
|
-
stroke-linecap: round;
|
|
161
|
-
stroke-linejoin: round;
|
|
171
|
+
--hx-icon-size: calc(var(--hx-checkbox-size, var(--hx-size-5, 1.25rem)) * 0.65);
|
|
172
|
+
--hx-icon-color: var(--hx-checkbox-checkmark-color, var(--hx-color-text-on-primary, #ffffff));
|
|
162
173
|
}
|
|
163
174
|
|
|
164
175
|
.checkbox--checked .checkbox__icon--check {
|
|
@@ -265,7 +276,7 @@ const F = z`
|
|
|
265
276
|
}
|
|
266
277
|
|
|
267
278
|
.checkbox__icon {
|
|
268
|
-
|
|
279
|
+
--hx-icon-color: HighlightText;
|
|
269
280
|
}
|
|
270
281
|
|
|
271
282
|
.checkbox--error .checkbox__box {
|
|
@@ -310,12 +321,12 @@ const F = z`
|
|
|
310
321
|
}
|
|
311
322
|
}
|
|
312
323
|
`;
|
|
313
|
-
var M = Object.defineProperty, V = Object.getOwnPropertyDescriptor, o = (e, t,
|
|
314
|
-
for (var
|
|
315
|
-
(a = e[h]) && (
|
|
316
|
-
return c &&
|
|
324
|
+
var M = Object.defineProperty, V = Object.getOwnPropertyDescriptor, o = (e, t, s, c) => {
|
|
325
|
+
for (var i = c > 1 ? void 0 : c ? V(t, s) : t, h = e.length - 1, a; h >= 0; h--)
|
|
326
|
+
(a = e[h]) && (i = (c ? a(t, s, i) : a(i)) || i);
|
|
327
|
+
return c && i && M(t, s, i), i;
|
|
317
328
|
};
|
|
318
|
-
const
|
|
329
|
+
const G = R("hx-checkbox");
|
|
319
330
|
let r = class extends D(A(q)) {
|
|
320
331
|
constructor() {
|
|
321
332
|
super(...arguments), this.checked = !1, this.indeterminate = !1, this.disabled = !1, this.required = !1, this.name = "", this.value = "on", this.label = "", this.error = "", this.helpText = "", this.requiredMessage = "This field is required.", this.size = "md", this.accessibleLabel = "", this._hasErrorSlot = !1, this._hasHelpTextSlot = !1, this._hasLabelSlot = !1, this.__groupedSuppress = !1, this._announcedError = "", this._hasWarnedLabelConflict = !1, this._ariaMirror = null, this._handleHostKeyDown = (e) => {
|
|
@@ -336,7 +347,7 @@ let r = class extends D(A(q)) {
|
|
|
336
347
|
e.preventDefault(), e.stopPropagation();
|
|
337
348
|
}, this._suppressInnerChange = (e) => {
|
|
338
349
|
e.stopPropagation();
|
|
339
|
-
}, this._fallbackAriaLabelledBy = null, this._fallbackAriaDescribedBy = null, this._supportsIdrefRefs = !0, this._internalTabindexManaged = !1, this._id =
|
|
350
|
+
}, this._fallbackAriaLabelledBy = null, this._fallbackAriaDescribedBy = null, this._supportsIdrefRefs = !0, this._internalTabindexManaged = !1, this._id = G(), this._helpTextId = `${this._id}-help`, this._errorId = `${this._id}-error`, this._labelId = `${this._id}-label`;
|
|
340
351
|
}
|
|
341
352
|
/**
|
|
342
353
|
* Returns the effective label for the checkbox, checking accessible-label first,
|
|
@@ -344,8 +355,8 @@ let r = class extends D(A(q)) {
|
|
|
344
355
|
* @internal
|
|
345
356
|
*/
|
|
346
357
|
get _effectiveLabel() {
|
|
347
|
-
var e, t,
|
|
348
|
-
return ((e = this.accessibleLabel) == null ? void 0 : e.trim()) || ((t = this.getAttribute("data-aria-label")) == null ? void 0 : t.trim()) || ((
|
|
358
|
+
var e, t, s;
|
|
359
|
+
return ((e = this.accessibleLabel) == null ? void 0 : e.trim()) || ((t = this.getAttribute("data-aria-label")) == null ? void 0 : t.trim()) || ((s = this.getAttribute("aria-label")) == null ? void 0 : s.trim()) || "";
|
|
349
360
|
}
|
|
350
361
|
/**
|
|
351
362
|
* Set by `hx-checkbox-group` to mark this child as group-managed. While
|
|
@@ -399,10 +410,10 @@ let r = class extends D(A(q)) {
|
|
|
399
410
|
super.disconnectedCallback(), this.removeEventListener("keydown", this._handleHostKeyDown), this.removeEventListener("click", this._handleHostClick), (e = this._ariaMirror) == null || e.disconnect(), this._ariaMirror = null;
|
|
400
411
|
}
|
|
401
412
|
updated(e) {
|
|
402
|
-
var t,
|
|
413
|
+
var t, s, c, i, h;
|
|
403
414
|
super.updated(e), (e.has("checked") || e.has("value") || e.has("name")) && this._updateFormValue(), (e.has("disabled") || e.has("_supportsIdrefRefs")) && this._internalTabindexManaged && (this.disabled ? this.setAttribute("tabindex", "-1") : this.setAttribute("tabindex", this._supportsIdrefRefs ? "0" : "-1")), this._syncHostAriaSemantics();
|
|
404
415
|
{
|
|
405
|
-
const a = !!((t = this.accessibleLabel) != null && t.trim() || (
|
|
416
|
+
const a = !!((t = this.accessibleLabel) != null && t.trim() || (s = this.getAttribute("data-aria-label")) != null && s.trim() || (c = this.getAttribute("aria-label")) != null && c.trim()), x = !!this.label || (((h = (i = this.shadowRoot) == null ? void 0 : i.querySelector(".checkbox__label slot")) == null ? void 0 : h.assignedNodes({ flatten: !0 }).length) ?? 0) > 0;
|
|
406
417
|
a && x && !this._hasWarnedLabelConflict ? this._hasWarnedLabelConflict = !0 : (!a || !x) && (this._hasWarnedLabelConflict = !1);
|
|
407
418
|
}
|
|
408
419
|
e.has("error") && (e.get("error") && this.error ? (this._announcedError = "", requestAnimationFrame(() => {
|
|
@@ -512,13 +523,13 @@ let r = class extends D(A(q)) {
|
|
|
512
523
|
* @internal
|
|
513
524
|
*/
|
|
514
525
|
_syncHostAriaSemantics() {
|
|
515
|
-
var
|
|
526
|
+
var s, c, i;
|
|
516
527
|
const e = this._internals, t = this._effectiveLabel;
|
|
517
528
|
if (this._supportsIdrefRefs) {
|
|
518
529
|
e.role = "checkbox", e.ariaChecked = this.indeterminate ? "mixed" : this.checked ? "true" : "false", e.ariaRequired = this.required ? "true" : "false", e.ariaInvalid = e.validity.valid ? "false" : "true", e.ariaDisabled = this.disabled ? "true" : "false", e.ariaLabel = t || null;
|
|
519
|
-
const h = e, a = this.getAttribute("data-aria-labelledby"), x = this.getAttribute("data-aria-describedby"), u = I(this, a), _ = (
|
|
530
|
+
const h = e, a = this.getAttribute("data-aria-labelledby"), x = this.getAttribute("data-aria-describedby"), u = I(this, a), _ = (s = this.shadowRoot) == null ? void 0 : s.getElementById(this._labelId), v = !!this.label || this._hasLabelSlot;
|
|
520
531
|
u.length === 0 && !t && v && _ && u.push(_), h.ariaLabelledByElements = u.length > 0 ? u : null;
|
|
521
|
-
const p = I(this, x), n = (c = this.shadowRoot) == null ? void 0 : c.getElementById(this._helpTextId), f = (
|
|
532
|
+
const p = I(this, x), n = (c = this.shadowRoot) == null ? void 0 : c.getElementById(this._helpTextId), f = (i = this.shadowRoot) == null ? void 0 : i.getElementById(this._errorId), k = !!(this.error || this._hasErrorSlot);
|
|
522
533
|
n && (this.helpText || this._hasHelpTextSlot) && !k && p.push(n), f && k && p.push(f), h.ariaDescribedByElements = p.length > 0 ? p : null, this._fallbackAriaLabelledBy = null, this._fallbackAriaDescribedBy = null;
|
|
523
534
|
} else {
|
|
524
535
|
e.role = null, e.ariaChecked = null, e.ariaRequired = null, e.ariaInvalid = null, e.ariaDisabled = null, e.ariaLabel = null;
|
|
@@ -527,7 +538,7 @@ let r = class extends D(A(q)) {
|
|
|
527
538
|
}
|
|
528
539
|
}
|
|
529
540
|
render() {
|
|
530
|
-
const e = !!this.error || this._hasErrorSlot, t = !!this.helpText || this._hasHelpTextSlot,
|
|
541
|
+
const e = !!this.error || this._hasErrorSlot, t = !!this.helpText || this._hasHelpTextSlot, s = !!this.label || this._hasLabelSlot, c = e || this.required && !this.checked, i = {
|
|
531
542
|
checkbox: !0,
|
|
532
543
|
"checkbox--checked": this.checked,
|
|
533
544
|
"checkbox--indeterminate": this.indeterminate,
|
|
@@ -537,10 +548,10 @@ let r = class extends D(A(q)) {
|
|
|
537
548
|
"checkbox--sm": this.size === "sm",
|
|
538
549
|
"checkbox--md": this.size === "md",
|
|
539
550
|
"checkbox--lg": this.size === "lg"
|
|
540
|
-
}, h = [e ? null : t ? this._helpTextId : null, e ? this._errorId : null].filter(Boolean).join(" ") || void 0, a = this._effectiveLabel || void 0, x = !a &&
|
|
551
|
+
}, h = [e ? null : t ? this._helpTextId : null, e ? this._errorId : null].filter(Boolean).join(" ") || void 0, a = this._effectiveLabel || void 0, x = !a && s, u = this._fallbackAriaLabelledBy, _ = this._fallbackAriaDescribedBy, v = [h ?? null, _].filter(Boolean).join(" ") || void 0, p = u ?? (x ? this._labelId : void 0), n = !this._supportsIdrefRefs, f = n && !this.disabled ? "0" : "-1", k = n ? void 0 : this._suppressInnerClick, C = n ? this._handleInternalChange : this._suppressInnerChange, w = n ? void 0 : this._handleChange, S = n ? void 0 : this._handleKeyDown;
|
|
541
552
|
return g`
|
|
542
|
-
<div class=${E(
|
|
543
|
-
<label part="control" class="checkbox__control" @click=${d(
|
|
553
|
+
<div class=${E(i)}>
|
|
554
|
+
<label part="control" class="checkbox__control" @click=${d(w)}>
|
|
544
555
|
<input
|
|
545
556
|
class="checkbox__input"
|
|
546
557
|
type="checkbox"
|
|
@@ -558,27 +569,25 @@ let r = class extends D(A(q)) {
|
|
|
558
569
|
aria-label=${d(a)}
|
|
559
570
|
aria-labelledby=${d(p)}
|
|
560
571
|
aria-hidden=${n ? m : "true"}
|
|
561
|
-
@keydown=${d(
|
|
572
|
+
@keydown=${d(S)}
|
|
562
573
|
@click=${d(k)}
|
|
563
|
-
@change=${
|
|
574
|
+
@change=${C}
|
|
564
575
|
/>
|
|
565
576
|
|
|
566
577
|
<span part="checkbox" class="checkbox__box">
|
|
567
|
-
<
|
|
578
|
+
<hx-icon
|
|
568
579
|
part="checkmark"
|
|
569
580
|
class="checkbox__icon checkbox__icon--check"
|
|
570
|
-
|
|
581
|
+
library="helix"
|
|
582
|
+
name="check"
|
|
571
583
|
aria-hidden="true"
|
|
572
|
-
>
|
|
573
|
-
|
|
574
|
-
</svg>
|
|
575
|
-
<svg
|
|
584
|
+
></hx-icon>
|
|
585
|
+
<hx-icon
|
|
576
586
|
class="checkbox__icon checkbox__icon--indeterminate"
|
|
577
|
-
|
|
587
|
+
library="helix"
|
|
588
|
+
name="dash"
|
|
578
589
|
aria-hidden="true"
|
|
579
|
-
>
|
|
580
|
-
<line x1="4" y1="8" x2="12" y2="8"></line>
|
|
581
|
-
</svg>
|
|
590
|
+
></hx-icon>
|
|
582
591
|
</span>
|
|
583
592
|
|
|
584
593
|
<span part="label" class="checkbox__label" id=${this._labelId}>
|
|
@@ -664,7 +673,7 @@ o([
|
|
|
664
673
|
l({ type: String, attribute: "accessible-label" })
|
|
665
674
|
], r.prototype, "accessibleLabel", 2);
|
|
666
675
|
o([
|
|
667
|
-
|
|
676
|
+
z(".checkbox__input")
|
|
668
677
|
], r.prototype, "_inputEl", 2);
|
|
669
678
|
o([
|
|
670
679
|
b()
|
|
@@ -693,4 +702,4 @@ r = o([
|
|
|
693
702
|
export {
|
|
694
703
|
r as H
|
|
695
704
|
};
|
|
696
|
-
//# sourceMappingURL=hx-checkbox-
|
|
705
|
+
//# sourceMappingURL=hx-checkbox-DDSXXhps.js.map
|