@pine-ds/core 4.8.0 → 4.9.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/attributes.js +1 -1
- package/components/floating-ui.dom.js +1 -1
- package/components/index.js +1 -1
- package/components/index2.js +1 -1
- package/components/keep-hydrated.js +1 -0
- package/components/mock-pds-modal.js +1 -1
- package/components/pds-alert.js +1 -1
- package/components/pds-avatar.js +1 -1
- package/components/pds-box2.js +1 -1
- package/components/pds-button2.js +1 -1
- package/components/pds-checkbox2.js +1 -1
- package/components/pds-chip2.js +1 -1
- package/components/pds-combobox.js +1 -1
- package/components/pds-container.js +1 -1
- package/components/pds-copytext.js +1 -1
- package/components/pds-datepicker.js +1 -1
- package/components/pds-divider.js +1 -1
- package/components/pds-drawer-content.js +1 -1
- package/components/pds-drawer-footer.js +1 -1
- package/components/pds-drawer-header.js +1 -1
- package/components/pds-drawer.js +1 -1
- package/components/pds-dropdown-menu-item.js +1 -1
- package/components/pds-dropdown-menu-separator.js +1 -1
- package/components/pds-dropdown-menu.js +1 -1
- package/components/pds-filter.js +1 -1
- package/components/pds-filters.js +1 -1
- package/components/pds-icon2.js +1 -1
- package/components/pds-image.js +1 -1
- package/components/pds-input2.js +1 -1
- package/components/pds-link2.js +1 -1
- package/components/pds-loader2.js +1 -1
- package/components/pds-modal-content.js +1 -1
- package/components/pds-modal-footer.js +1 -1
- package/components/pds-modal-header.js +1 -1
- package/components/pds-modal2.js +1 -1
- package/components/pds-multiselect.js +1 -1
- package/components/pds-popover.js +1 -1
- package/components/pds-progress.js +1 -1
- package/components/pds-property.js +1 -1
- package/components/pds-radio-group.js +1 -1
- package/components/pds-radio.js +1 -1
- package/components/pds-row.js +1 -1
- package/components/pds-select.js +1 -1
- package/components/pds-sortable-item.js +1 -1
- package/components/pds-sortable.js +2 -2
- package/components/pds-switch.js +1 -1
- package/components/pds-table-body.js +1 -1
- package/components/pds-table-cell2.js +1 -1
- package/components/pds-table-head-cell2.js +1 -1
- package/components/pds-table-head.js +1 -1
- package/components/pds-table-row.js +1 -1
- package/components/pds-tabpanel.js +1 -1
- package/components/pds-tabs.js +1 -1
- package/components/pds-text2.js +1 -1
- package/components/pds-textarea.js +1 -1
- package/components/pds-toast.js +1 -1
- package/components/pds-tooltip.js +1 -1
- package/components/portal-target.js +1 -0
- package/components/tabbable.js +1 -0
- package/components/truncation-tooltip.js +1 -1
- package/dist/cjs/{attributes-BJ7KBHql.js → attributes-CW49XqaL.js} +1 -1
- package/dist/cjs/{floating-ui.dom-Dc8Anyel.js → floating-ui.dom-Dw41zbyY.js} +1 -0
- package/dist/cjs/{index-Do70atou.js → index-BDnbr0DK.js} +1 -1
- package/dist/cjs/{index-jl_Q819j.js → index-D9iJuJCP.js} +13 -1
- package/dist/cjs/index.cjs.js +1 -1
- package/dist/cjs/{keep-hydrated-CiXgkEYd.js → keep-hydrated-AKoh0DG4.js} +1 -0
- package/dist/cjs/loader.cjs.js +3 -3
- package/dist/cjs/mock-pds-modal.cjs.entry.js +4 -4
- package/dist/cjs/pds-accordion.cjs.entry.js +3 -3
- package/dist/cjs/pds-alert.cjs.entry.js +17 -4
- package/dist/cjs/pds-avatar.cjs.entry.js +22 -12
- package/dist/cjs/pds-box.cjs.entry.js +4 -4
- package/dist/cjs/pds-button.cjs.entry.js +58 -26
- package/dist/cjs/pds-checkbox.cjs.entry.js +16 -8
- package/dist/cjs/pds-chip.cjs.entry.js +9 -11
- package/dist/cjs/pds-combobox.cjs.entry.js +41 -11
- package/dist/cjs/pds-container.cjs.entry.js +3 -3
- package/dist/cjs/pds-copytext.cjs.entry.js +8 -7
- package/dist/cjs/pds-datepicker.cjs.entry.js +8 -45
- package/dist/cjs/pds-divider.cjs.entry.js +3 -3
- package/dist/cjs/pds-drawer-content.cjs.entry.js +3 -3
- package/dist/cjs/pds-drawer-footer.cjs.entry.js +3 -3
- package/dist/cjs/pds-drawer-header.cjs.entry.js +3 -3
- package/dist/cjs/pds-drawer.cjs.entry.js +4 -4
- package/dist/cjs/pds-dropdown-menu-item.cjs.entry.js +4 -4
- package/dist/cjs/pds-dropdown-menu-separator.cjs.entry.js +3 -3
- package/dist/cjs/pds-dropdown-menu.cjs.entry.js +5 -5
- package/dist/cjs/pds-filter.cjs.entry.js +4 -4
- package/dist/cjs/pds-filters.cjs.entry.js +3 -3
- package/dist/cjs/pds-icon.cjs.entry.js +55 -22
- package/dist/cjs/pds-image.cjs.entry.js +4 -4
- package/dist/cjs/pds-input.cjs.entry.js +6 -6
- package/dist/cjs/pds-link.cjs.entry.js +16 -7
- package/dist/cjs/pds-loader.cjs.entry.js +4 -4
- package/dist/cjs/pds-modal-content.cjs.entry.js +4 -4
- package/dist/cjs/pds-modal-footer.cjs.entry.js +3 -3
- package/dist/cjs/pds-modal-header.cjs.entry.js +3 -3
- package/dist/cjs/pds-modal.cjs.entry.js +9 -89
- package/dist/cjs/pds-multiselect.cjs.entry.js +13 -7
- package/dist/cjs/pds-popover.cjs.entry.js +230 -153
- package/dist/cjs/pds-progress.cjs.entry.js +4 -4
- package/dist/cjs/pds-property.cjs.entry.js +3 -3
- package/dist/cjs/pds-radio-group.cjs.entry.js +67 -6
- package/dist/cjs/pds-radio.cjs.entry.js +24 -11
- package/dist/cjs/pds-row.cjs.entry.js +4 -4
- package/dist/cjs/pds-select.cjs.entry.js +132 -21
- package/dist/cjs/pds-sortable-item.cjs.entry.js +5 -5
- package/dist/cjs/pds-sortable.cjs.entry.js +4 -4
- package/dist/cjs/pds-switch.cjs.entry.js +7 -7
- package/dist/cjs/pds-tab.cjs.entry.js +3 -3
- package/dist/cjs/pds-table-body.cjs.entry.js +3 -3
- package/dist/cjs/pds-table-cell.cjs.entry.js +7 -6
- package/dist/cjs/pds-table-head-cell.cjs.entry.js +5 -5
- package/dist/cjs/pds-table-head.cjs.entry.js +3 -3
- package/dist/cjs/pds-table-row.cjs.entry.js +3 -3
- package/dist/cjs/pds-table.cjs.entry.js +2 -2
- package/dist/cjs/pds-tabpanel.cjs.entry.js +4 -4
- package/dist/cjs/pds-tabs.cjs.entry.js +4 -4
- package/dist/cjs/pds-text.cjs.entry.js +31 -5
- package/dist/cjs/pds-textarea.cjs.entry.js +8 -8
- package/dist/cjs/pds-toast.cjs.entry.js +14 -8
- package/dist/cjs/pds-tooltip.cjs.entry.js +128 -46
- package/dist/cjs/pine-core.cjs.js +3 -3
- package/dist/cjs/portal-target-e8WQ6dLx.js +70 -0
- package/dist/cjs/tabbable-BrrrGvdG.js +86 -0
- package/dist/cjs/{truncation-tooltip-BtuiXLV0.js → truncation-tooltip-DdB78RIe.js} +44 -4
- package/dist/collection/components/pds-alert/pds-alert.css +13 -0
- package/dist/collection/components/pds-alert/pds-alert.js +36 -1
- package/dist/collection/components/pds-alert/stories/pds-alert.stories.js +4 -0
- package/dist/collection/components/pds-avatar/pds-avatar.js +41 -9
- package/dist/collection/components/pds-avatar/stories/pds-avatar.stories.js +2 -0
- package/dist/collection/components/pds-box/pds-box.js +1 -1
- package/dist/collection/components/pds-button/pds-button.js +13 -23
- package/dist/collection/components/pds-checkbox/pds-checkbox.css +79 -0
- package/dist/collection/components/pds-checkbox/pds-checkbox.js +36 -5
- package/dist/collection/components/pds-checkbox/stories/pds-checkbox.stories.js +38 -0
- package/dist/collection/components/pds-chip/pds-chip.js +2 -5
- package/dist/collection/components/pds-combobox/pds-combobox.css +33 -0
- package/dist/collection/components/pds-combobox/pds-combobox.js +60 -7
- package/dist/collection/components/pds-combobox/stories/pds-combobox.stories.js +44 -0
- package/dist/collection/components/pds-container/pds-container.js +1 -1
- package/dist/collection/components/pds-copytext/pds-copytext.js +1 -1
- package/dist/collection/components/pds-datepicker/calendar-portal.js +1 -38
- package/dist/collection/components/pds-datepicker/pds-datepicker.js +2 -2
- package/dist/collection/components/pds-divider/pds-divider.js +1 -1
- package/dist/collection/components/pds-drawer/pds-drawer-content/pds-drawer-content.js +1 -1
- package/dist/collection/components/pds-drawer/pds-drawer-footer/pds-drawer-footer.js +1 -1
- package/dist/collection/components/pds-drawer/pds-drawer-header/pds-drawer-header.js +1 -1
- package/dist/collection/components/pds-drawer/pds-drawer.js +2 -2
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu-item/pds-dropdown-menu-item.js +24 -2
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu-separator/pds-dropdown-menu-separator.js +1 -1
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu.js +1 -1
- package/dist/collection/components/pds-filters/pds-filter/pds-filter.js +1 -1
- package/dist/collection/components/pds-filters/pds-filters.js +1 -1
- package/dist/collection/components/pds-image/pds-image.js +2 -2
- package/dist/collection/components/pds-input/pds-input.js +2 -2
- package/dist/collection/components/pds-input/stories/pds-input.stories.js +6 -6
- package/dist/collection/components/pds-link/pds-link.css +1 -1
- package/dist/collection/components/pds-link/pds-link.js +34 -3
- package/dist/collection/components/pds-link/stories/pds-link.stories.js +51 -2
- package/dist/collection/components/pds-loader/pds-loader.js +1 -1
- package/dist/collection/components/pds-modal/pds-modal-content/pds-modal-content.js +2 -2
- package/dist/collection/components/pds-modal/pds-modal-footer/pds-modal-footer.js +1 -1
- package/dist/collection/components/pds-modal/pds-modal-header/pds-modal-header.js +1 -1
- package/dist/collection/components/pds-modal/pds-modal.css +1 -1
- package/dist/collection/components/pds-modal/pds-modal.js +4 -84
- package/dist/collection/components/pds-modal/test/mock-pds-modal.js +1 -1
- package/dist/collection/components/pds-multiselect/pds-multiselect.js +9 -3
- package/dist/collection/components/pds-popover/pds-popover.css +6 -0
- package/dist/collection/components/pds-popover/pds-popover.js +226 -149
- package/dist/collection/components/pds-progress/pds-progress.js +1 -1
- package/dist/collection/components/pds-property/pds-property.js +1 -1
- package/dist/collection/components/pds-radio/pds-radio.css +57 -0
- package/dist/collection/components/pds-radio/pds-radio.js +45 -9
- package/dist/collection/components/pds-radio/stories/pds-radio.stories.js +15 -0
- package/dist/collection/components/pds-radio-group/pds-radio-group.js +65 -4
- package/dist/collection/components/pds-radio-group/stories/pds-radio-group.stories.js +45 -0
- package/dist/collection/components/pds-row/pds-row.js +1 -1
- package/dist/collection/components/pds-select/pds-select.js +128 -17
- package/dist/collection/components/pds-select/stories/pds-select.stories.js +2 -2
- package/dist/collection/components/pds-sortable/pds-sortable-item/pds-sortable-item.js +1 -1
- package/dist/collection/components/pds-sortable/pds-sortable.js +1 -1
- package/dist/collection/components/pds-switch/pds-switch.js +3 -3
- package/dist/collection/components/pds-table/pds-table-body/pds-table-body.js +1 -1
- package/dist/collection/components/pds-table/pds-table-cell/pds-table-cell.js +2 -2
- package/dist/collection/components/pds-table/pds-table-head/pds-table-head.js +1 -1
- package/dist/collection/components/pds-table/pds-table-head-cell/pds-table-head-cell.js +2 -2
- package/dist/collection/components/pds-table/pds-table-row/pds-table-row.js +1 -1
- package/dist/collection/components/pds-table/stories/pds-table.stories.js +3 -3
- package/dist/collection/components/pds-tabs/pds-tabpanel/pds-tabpanel.js +1 -1
- package/dist/collection/components/pds-tabs/pds-tabs.js +1 -1
- package/dist/collection/components/pds-text/pds-text.js +28 -3
- package/dist/collection/components/pds-text/stories/pds-text.stories.js +16 -0
- package/dist/collection/components/pds-textarea/pds-textarea.js +4 -4
- package/dist/collection/components/pds-textarea/stories/pds-textarea.stories.js +2 -2
- package/dist/collection/components/pds-toast/pds-toast.css +13 -0
- package/dist/collection/components/pds-toast/pds-toast.js +33 -5
- package/dist/collection/components/pds-toast/stories/pds-toast.stories.js +4 -1
- package/dist/collection/components/pds-tooltip/pds-tooltip.css +11 -0
- package/dist/collection/components/pds-tooltip/pds-tooltip.js +125 -42
- package/dist/collection/components/pds-tooltip/stories/pds-tooltip.stories.js +30 -0
- package/dist/collection/utils/aria-references.js +42 -0
- package/dist/collection/utils/portal-target.js +64 -0
- package/dist/collection/utils/tabbable.js +82 -0
- package/dist/collection/utils/truncation-tooltip.js +42 -3
- package/dist/docs.json +245 -8
- package/dist/esm/{attributes-WXw_I_uJ.js → attributes-DkeVeN0g.js} +1 -1
- package/dist/esm/{floating-ui.dom-BPqJgIq6.js → floating-ui.dom-Cuc0DYlm.js} +1 -1
- package/dist/esm/{index-Cw9J31qd.js → index-4_RRPJTO.js} +13 -2
- package/dist/esm/{index-BWDu62Mo.js → index-DvN3tyZp.js} +2 -2
- package/dist/esm/index.js +1 -1
- package/dist/esm/{keep-hydrated-BLG6RDBt.js → keep-hydrated-BgNaWLoS.js} +1 -1
- package/dist/esm/loader.js +4 -4
- package/dist/esm/mock-pds-modal.entry.js +4 -4
- package/dist/esm/pds-accordion.entry.js +3 -3
- package/dist/esm/pds-alert.entry.js +17 -4
- package/dist/esm/pds-avatar.entry.js +22 -12
- package/dist/esm/pds-box.entry.js +4 -4
- package/dist/esm/pds-button.entry.js +58 -26
- package/dist/esm/pds-checkbox.entry.js +16 -8
- package/dist/esm/pds-chip.entry.js +8 -10
- package/dist/esm/pds-combobox.entry.js +41 -11
- package/dist/esm/pds-container.entry.js +3 -3
- package/dist/esm/pds-copytext.entry.js +8 -7
- package/dist/esm/pds-datepicker.entry.js +7 -44
- package/dist/esm/pds-divider.entry.js +3 -3
- package/dist/esm/pds-drawer-content.entry.js +3 -3
- package/dist/esm/pds-drawer-footer.entry.js +3 -3
- package/dist/esm/pds-drawer-header.entry.js +3 -3
- package/dist/esm/pds-drawer.entry.js +4 -4
- package/dist/esm/pds-dropdown-menu-item.entry.js +4 -4
- package/dist/esm/pds-dropdown-menu-separator.entry.js +3 -3
- package/dist/esm/pds-dropdown-menu.entry.js +5 -5
- package/dist/esm/pds-filter.entry.js +4 -4
- package/dist/esm/pds-filters.entry.js +3 -3
- package/dist/esm/pds-icon.entry.js +55 -22
- package/dist/esm/pds-image.entry.js +4 -4
- package/dist/esm/pds-input.entry.js +6 -6
- package/dist/esm/pds-link.entry.js +16 -7
- package/dist/esm/pds-loader.entry.js +4 -4
- package/dist/esm/pds-modal-content.entry.js +4 -4
- package/dist/esm/pds-modal-footer.entry.js +3 -3
- package/dist/esm/pds-modal-header.entry.js +3 -3
- package/dist/esm/pds-modal.entry.js +7 -87
- package/dist/esm/pds-multiselect.entry.js +13 -7
- package/dist/esm/pds-popover.entry.js +230 -153
- package/dist/esm/pds-progress.entry.js +4 -4
- package/dist/esm/pds-property.entry.js +3 -3
- package/dist/esm/pds-radio-group.entry.js +67 -6
- package/dist/esm/pds-radio.entry.js +24 -11
- package/dist/esm/pds-row.entry.js +4 -4
- package/dist/esm/pds-select.entry.js +132 -21
- package/dist/esm/pds-sortable-item.entry.js +5 -5
- package/dist/esm/pds-sortable.entry.js +4 -4
- package/dist/esm/pds-switch.entry.js +7 -7
- package/dist/esm/pds-tab.entry.js +3 -3
- package/dist/esm/pds-table-body.entry.js +3 -3
- package/dist/esm/pds-table-cell.entry.js +7 -6
- package/dist/esm/pds-table-head-cell.entry.js +5 -5
- package/dist/esm/pds-table-head.entry.js +3 -3
- package/dist/esm/pds-table-row.entry.js +3 -3
- package/dist/esm/pds-table.entry.js +2 -2
- package/dist/esm/pds-tabpanel.entry.js +4 -4
- package/dist/esm/pds-tabs.entry.js +4 -4
- package/dist/esm/pds-text.entry.js +31 -5
- package/dist/esm/pds-textarea.entry.js +8 -8
- package/dist/esm/pds-toast.entry.js +14 -8
- package/dist/esm/pds-tooltip.entry.js +128 -46
- package/dist/esm/pine-core.js +4 -4
- package/dist/esm/portal-target-CKRzRKdO.js +66 -0
- package/dist/esm/tabbable-C6ZWpp3v.js +84 -0
- package/dist/esm/{truncation-tooltip-FaW67DiY.js → truncation-tooltip-CRSdYzpA.js} +44 -5
- package/dist/esm-es5/{attributes-WXw_I_uJ.js → attributes-DkeVeN0g.js} +1 -1
- package/dist/esm-es5/{floating-ui.dom-BPqJgIq6.js → floating-ui.dom-Cuc0DYlm.js} +1 -1
- package/dist/esm-es5/{index-Cw9J31qd.js → index-4_RRPJTO.js} +2 -2
- package/dist/esm-es5/{index-BWDu62Mo.js → index-DvN3tyZp.js} +1 -1
- package/dist/esm-es5/index.js +1 -1
- package/dist/esm-es5/{keep-hydrated-BLG6RDBt.js → keep-hydrated-BgNaWLoS.js} +1 -1
- package/dist/esm-es5/loader.js +1 -1
- package/dist/esm-es5/mock-pds-modal.entry.js +1 -1
- package/dist/esm-es5/pds-accordion.entry.js +1 -1
- package/dist/esm-es5/pds-alert.entry.js +1 -1
- package/dist/esm-es5/pds-avatar.entry.js +1 -1
- package/dist/esm-es5/pds-box.entry.js +1 -1
- package/dist/esm-es5/pds-button.entry.js +1 -1
- package/dist/esm-es5/pds-checkbox.entry.js +1 -1
- package/dist/esm-es5/pds-chip.entry.js +1 -1
- package/dist/esm-es5/pds-combobox.entry.js +2 -2
- package/dist/esm-es5/pds-container.entry.js +1 -1
- package/dist/esm-es5/pds-copytext.entry.js +1 -1
- package/dist/esm-es5/pds-datepicker.entry.js +1 -1
- package/dist/esm-es5/pds-divider.entry.js +1 -1
- package/dist/esm-es5/pds-drawer-content.entry.js +1 -1
- package/dist/esm-es5/pds-drawer-footer.entry.js +1 -1
- package/dist/esm-es5/pds-drawer-header.entry.js +1 -1
- package/dist/esm-es5/pds-drawer.entry.js +1 -1
- package/dist/esm-es5/pds-dropdown-menu-item.entry.js +1 -1
- package/dist/esm-es5/pds-dropdown-menu-separator.entry.js +1 -1
- package/dist/esm-es5/pds-dropdown-menu.entry.js +1 -1
- package/dist/esm-es5/pds-filter.entry.js +1 -1
- package/dist/esm-es5/pds-filters.entry.js +1 -1
- package/dist/esm-es5/pds-icon.entry.js +1 -1
- package/dist/esm-es5/pds-image.entry.js +1 -1
- package/dist/esm-es5/pds-input.entry.js +1 -1
- package/dist/esm-es5/pds-link.entry.js +1 -1
- package/dist/esm-es5/pds-loader.entry.js +1 -1
- package/dist/esm-es5/pds-modal-content.entry.js +1 -1
- package/dist/esm-es5/pds-modal-footer.entry.js +1 -1
- package/dist/esm-es5/pds-modal-header.entry.js +1 -1
- package/dist/esm-es5/pds-modal.entry.js +1 -1
- package/dist/esm-es5/pds-multiselect.entry.js +1 -1
- package/dist/esm-es5/pds-popover.entry.js +1 -1
- package/dist/esm-es5/pds-progress.entry.js +1 -1
- package/dist/esm-es5/pds-property.entry.js +1 -1
- package/dist/esm-es5/pds-radio-group.entry.js +1 -1
- package/dist/esm-es5/pds-radio.entry.js +1 -1
- package/dist/esm-es5/pds-row.entry.js +1 -1
- package/dist/esm-es5/pds-select.entry.js +1 -1
- package/dist/esm-es5/pds-sortable-item.entry.js +1 -1
- package/dist/esm-es5/pds-sortable.entry.js +2 -2
- package/dist/esm-es5/pds-switch.entry.js +1 -1
- package/dist/esm-es5/pds-tab.entry.js +1 -1
- package/dist/esm-es5/pds-table-body.entry.js +1 -1
- package/dist/esm-es5/pds-table-cell.entry.js +1 -1
- package/dist/esm-es5/pds-table-head-cell.entry.js +1 -1
- package/dist/esm-es5/pds-table-head.entry.js +1 -1
- package/dist/esm-es5/pds-table-row.entry.js +1 -1
- package/dist/esm-es5/pds-table.entry.js +1 -1
- package/dist/esm-es5/pds-tabpanel.entry.js +1 -1
- package/dist/esm-es5/pds-tabs.entry.js +1 -1
- package/dist/esm-es5/pds-text.entry.js +1 -1
- package/dist/esm-es5/pds-textarea.entry.js +1 -1
- package/dist/esm-es5/pds-toast.entry.js +1 -1
- package/dist/esm-es5/pds-tooltip.entry.js +1 -1
- package/dist/esm-es5/pine-core.js +1 -1
- package/dist/esm-es5/portal-target-CKRzRKdO.js +1 -0
- package/dist/esm-es5/tabbable-C6ZWpp3v.js +1 -0
- package/dist/esm-es5/truncation-tooltip-CRSdYzpA.js +1 -0
- package/dist/pine-core/index.esm.js +1 -1
- package/dist/pine-core/{p-9880d251.system.entry.js → p-01f1cdaf.system.entry.js} +1 -1
- package/dist/pine-core/{p-138b278b.entry.js → p-07323107.entry.js} +1 -1
- package/dist/pine-core/p-08b8e941.entry.js +1 -0
- package/dist/pine-core/p-0d5f0ab5.system.entry.js +1 -0
- package/dist/pine-core/{p-8c8cc079.system.entry.js → p-1415c988.system.entry.js} +1 -1
- package/dist/pine-core/{p-9109b90a.entry.js → p-143b33a6.entry.js} +1 -1
- package/dist/pine-core/{p-b9d145f8.system.entry.js → p-14dedf01.system.entry.js} +1 -1
- package/dist/pine-core/{p-80e6f3a0.system.entry.js → p-19cf1d91.system.entry.js} +1 -1
- package/dist/pine-core/p-1ca8d183.entry.js +1 -0
- package/dist/pine-core/p-1cc39908.system.entry.js +1 -0
- package/dist/pine-core/p-1e3ef425.entry.js +1 -0
- package/dist/pine-core/{p-b914dde8.entry.js → p-1f62bb71.entry.js} +2 -2
- package/dist/pine-core/p-20079552.system.entry.js +1 -0
- package/dist/pine-core/p-2a18852f.entry.js +1 -0
- package/dist/pine-core/{p-ca4ee736.system.entry.js → p-2b9622c1.system.entry.js} +1 -1
- package/dist/pine-core/p-2dd30d12.entry.js +1 -0
- package/dist/pine-core/{p-cccfe60f.system.entry.js → p-3306dc5a.system.entry.js} +1 -1
- package/dist/pine-core/{p-BGLP3keB.js → p-35s7h-dk.js} +1 -1
- package/dist/pine-core/{p-8c588ca0.entry.js → p-3610cb3b.entry.js} +1 -1
- package/dist/pine-core/p-37718637.entry.js +1 -0
- package/dist/pine-core/p-383d84f4.entry.js +2 -0
- package/dist/pine-core/p-39276663.entry.js +1 -0
- package/dist/pine-core/{p-62433f32.entry.js → p-39e57657.entry.js} +1 -1
- package/dist/pine-core/p-3c229091.entry.js +1 -0
- package/dist/pine-core/p-3d34b967.system.entry.js +1 -0
- package/dist/pine-core/p-3e30a761.entry.js +1 -0
- package/dist/pine-core/{p-7a5b21d2.system.entry.js → p-3f8bd3fb.system.entry.js} +1 -1
- package/dist/pine-core/p-42d43c3f.system.entry.js +1 -0
- package/dist/pine-core/{p-f029b7da.system.entry.js → p-42f70f93.system.entry.js} +1 -1
- package/dist/pine-core/{p-d3d69ca4.system.entry.js → p-4a90b9c8.system.entry.js} +1 -1
- package/dist/pine-core/{p-ca0a8f5c.entry.js → p-4cfe922b.entry.js} +1 -1
- package/dist/pine-core/p-4d1a8803.entry.js +1 -0
- package/dist/pine-core/p-4d47023c.system.entry.js +1 -0
- package/dist/pine-core/p-4d98bc0c.system.entry.js +1 -0
- package/dist/pine-core/{p-c97bfac9.entry.js → p-50ddadbf.entry.js} +1 -1
- package/dist/pine-core/{p-0913f696.system.entry.js → p-548bce53.system.entry.js} +1 -1
- package/dist/pine-core/p-54f1e86f.system.entry.js +1 -0
- package/dist/pine-core/{p-631f5bcc.entry.js → p-590df41a.entry.js} +1 -1
- package/dist/pine-core/p-5946203c.entry.js +1 -0
- package/dist/pine-core/{p-11d98408.system.entry.js → p-5f181694.system.entry.js} +1 -1
- package/dist/pine-core/p-60a30975.system.entry.js +1 -0
- package/dist/pine-core/{p-9ab95438.entry.js → p-61cfdbb2.entry.js} +1 -1
- package/dist/pine-core/p-62aa6a78.system.entry.js +1 -0
- package/dist/pine-core/{p-ecc7a531.system.entry.js → p-63f85859.system.entry.js} +1 -1
- package/dist/pine-core/p-64bcb378.entry.js +1 -0
- package/dist/pine-core/{p-bdac8f2b.entry.js → p-67999353.entry.js} +1 -1
- package/dist/pine-core/{p-cb6a3e4c.system.entry.js → p-67f795d5.system.entry.js} +1 -1
- package/dist/pine-core/p-6a1aa8d3.entry.js +1 -0
- package/dist/pine-core/p-6f4ab1ea.system.entry.js +1 -0
- package/dist/pine-core/{p-acca5f7b.system.entry.js → p-724baba3.system.entry.js} +1 -1
- package/dist/pine-core/p-72659a0e.system.entry.js +1 -0
- package/dist/pine-core/{p-4bfc8b3e.system.entry.js → p-73efb1ed.system.entry.js} +1 -1
- package/dist/pine-core/p-7a51f15e.entry.js +1 -0
- package/dist/pine-core/p-7b978fff.system.entry.js +1 -0
- package/dist/pine-core/p-8436cbfb.entry.js +1 -0
- package/dist/pine-core/p-849ec281.system.entry.js +1 -0
- package/dist/pine-core/p-87a32ded.system.entry.js +1 -0
- package/dist/pine-core/p-89d38a82.system.entry.js +1 -0
- package/dist/pine-core/p-8ade17ce.entry.js +1 -0
- package/dist/pine-core/{p-4d03d1e2.system.entry.js → p-8afd5f5b.system.entry.js} +1 -1
- package/dist/pine-core/p-8e7f75e6.entry.js +1 -0
- package/dist/pine-core/{p-8f531063.entry.js → p-8fb520df.entry.js} +1 -1
- package/dist/pine-core/{p-9df5e204.entry.js → p-92115e88.entry.js} +1 -1
- package/dist/pine-core/p-93fd7dd8.system.entry.js +1 -0
- package/dist/pine-core/p-947582e1.entry.js +1 -0
- package/dist/pine-core/{p-2ac2457b.system.entry.js → p-94c9b7d1.system.entry.js} +1 -1
- package/dist/pine-core/p-973c3ac0.entry.js +1 -0
- package/dist/pine-core/p-97653e60.entry.js +1 -0
- package/dist/pine-core/{p-55224683.entry.js → p-97b73359.entry.js} +1 -1
- package/dist/pine-core/{p-b1548a20.entry.js → p-99530cb5.entry.js} +1 -1
- package/dist/pine-core/p-9a776443.entry.js +1 -0
- package/dist/pine-core/p-9b32727a.system.entry.js +1 -0
- package/dist/pine-core/{p-CGRdQc49.system.js → p-BK1sLRfg.system.js} +2 -2
- package/dist/pine-core/{p-COtCa1Md.system.js → p-BNTlHhoO.system.js} +1 -1
- package/dist/pine-core/p-BZ1l3LGl.system.js +1 -0
- package/dist/pine-core/p-BgNaWLoS.js +1 -0
- package/dist/pine-core/p-C6ZWpp3v.js +1 -0
- package/dist/pine-core/{p-Cy8cvR7I.system.js → p-CANeE7Ss.system.js} +1 -1
- package/dist/pine-core/p-CKRzRKdO.js +1 -0
- package/dist/pine-core/{p-XW4H0W6i.system.js → p-CNXspDYs.system.js} +1 -1
- package/dist/pine-core/{p-BPqJgIq6.js → p-Cuc0DYlm.js} +1 -1
- package/dist/pine-core/p-DQyF6v9Q.system.js +1 -0
- package/dist/pine-core/{p-BWDu62Mo.js → p-DvN3tyZp.js} +1 -1
- package/dist/pine-core/p-DwQ5Tjis.js +1 -0
- package/dist/pine-core/{p-CmSJytt1.js → p-M31tvpDN.js} +2 -2
- package/dist/pine-core/p-XK45dzWR.system.js +1 -0
- package/dist/pine-core/{p-1dc5a7e0.system.entry.js → p-a09c9c5e.system.entry.js} +1 -1
- package/dist/pine-core/p-a4ce12ef.entry.js +1 -0
- package/dist/pine-core/{p-57a2f927.entry.js → p-a594c41f.entry.js} +1 -1
- package/dist/pine-core/p-a9d96e22.entry.js +1 -0
- package/dist/pine-core/{p-047433a4.system.entry.js → p-ad5208a4.system.entry.js} +1 -1
- package/dist/pine-core/p-b3d4f97a.system.entry.js +3 -0
- package/dist/pine-core/{p-0b71ecb6.system.entry.js → p-bcc378ba.system.entry.js} +2 -2
- package/dist/pine-core/p-bd7dc317.system.entry.js +1 -0
- package/dist/pine-core/p-beb7a430.entry.js +1 -0
- package/dist/pine-core/p-bfa34194.entry.js +1 -0
- package/dist/pine-core/{p-5870b092.system.entry.js → p-c2afe4f3.system.entry.js} +1 -1
- package/dist/pine-core/p-c5e1eb3c.system.entry.js +1 -0
- package/dist/pine-core/p-c7a53c4f.entry.js +1 -0
- package/dist/pine-core/{p-5cfd4d41.system.entry.js → p-c8a0b562.system.entry.js} +1 -1
- package/dist/pine-core/{p-f1702281.entry.js → p-c9ae7964.entry.js} +1 -1
- package/dist/pine-core/{p-db17c626.system.entry.js → p-cb9baf78.system.entry.js} +1 -1
- package/dist/pine-core/{p-e5420660.entry.js → p-ce9fa14b.entry.js} +1 -1
- package/dist/pine-core/{p-332590c7.system.entry.js → p-d018dc60.system.entry.js} +1 -1
- package/dist/pine-core/p-d47b2a6a.system.entry.js +1 -0
- package/dist/pine-core/{p-b75b0d09.system.entry.js → p-d48fe5a0.system.entry.js} +1 -1
- package/dist/pine-core/p-d6f338e0.entry.js +1 -0
- package/dist/pine-core/{p-8191498f.system.entry.js → p-d920d759.system.entry.js} +1 -1
- package/dist/pine-core/{p-26642718.entry.js → p-d9719e37.entry.js} +1 -1
- package/dist/pine-core/{p-c483997a.entry.js → p-db7fb5a3.entry.js} +1 -1
- package/dist/pine-core/{p-9713fb36.entry.js → p-e1d1b5d8.entry.js} +1 -1
- package/dist/pine-core/p-e3de6a1d.entry.js +1 -0
- package/dist/pine-core/{p-d2c91e7a.entry.js → p-e7002cee.entry.js} +1 -1
- package/dist/pine-core/{p-86040cac.system.entry.js → p-e82f758f.system.entry.js} +1 -1
- package/dist/pine-core/p-e84fa9ed.entry.js +1 -0
- package/dist/pine-core/{p-ee0e30bf.system.entry.js → p-eb4f0daa.system.entry.js} +1 -1
- package/dist/pine-core/p-eeYeEogd.system.js +1 -0
- package/dist/pine-core/{p-0af0d752.system.entry.js → p-eecd9ad8.system.entry.js} +1 -1
- package/dist/pine-core/p-ef0eba9b.system.entry.js +1 -0
- package/dist/pine-core/p-ef3a855f.system.entry.js +1 -0
- package/dist/pine-core/{p-717323e4.entry.js → p-f018af99.entry.js} +1 -1
- package/dist/pine-core/{p-121612a7.system.entry.js → p-f11cce27.system.entry.js} +1 -1
- package/dist/pine-core/{p-4fd454f6.entry.js → p-f6f4fd42.entry.js} +1 -1
- package/dist/pine-core/{p-a939b471.entry.js → p-f71d71ca.entry.js} +1 -1
- package/dist/pine-core/p-f9063262.system.entry.js +1 -0
- package/dist/pine-core/p-f99bd77f.entry.js +1 -0
- package/dist/pine-core/{p-ClDiSG97.system.js → p-vFsJv75D.system.js} +1 -1
- package/dist/pine-core/p-wB2y8gR7.system.js +1 -0
- package/dist/pine-core/pine-core.esm.js +1 -1
- package/dist/pine-core/pine-core.js +1 -1
- package/dist/types/components/pds-alert/pds-alert.d.ts +10 -0
- package/dist/types/components/pds-avatar/pds-avatar.d.ts +8 -0
- package/dist/types/components/pds-button/pds-button.d.ts +2 -2
- package/dist/types/components/pds-checkbox/pds-checkbox.d.ts +7 -1
- package/dist/types/components/pds-combobox/pds-combobox.d.ts +9 -0
- package/dist/types/components/pds-datepicker/calendar-portal.d.ts +0 -7
- package/dist/types/components/pds-dropdown-menu/pds-dropdown-menu-item/pds-dropdown-menu-item.d.ts +7 -0
- package/dist/types/components/pds-link/pds-link.d.ts +8 -0
- package/dist/types/components/pds-popover/pds-popover.d.ts +44 -20
- package/dist/types/components/pds-radio/pds-radio.d.ts +9 -3
- package/dist/types/components/pds-radio-group/pds-radio-group.d.ts +8 -0
- package/dist/types/components/pds-select/pds-select.d.ts +32 -4
- package/dist/types/components/pds-text/pds-text.d.ts +4 -0
- package/dist/types/components/pds-toast/pds-toast.d.ts +9 -0
- package/dist/types/components/pds-tooltip/pds-tooltip.d.ts +32 -0
- package/dist/types/components.d.ts +98 -10
- package/dist/types/utils/aria-references.d.ts +24 -0
- package/dist/types/utils/portal-target.d.ts +17 -0
- package/dist/types/utils/tabbable.d.ts +2 -0
- package/dist/types/utils/truncation-tooltip.d.ts +5 -2
- package/dist/vscode.html-data.json +82 -10
- package/hydrate/index.js +971 -408
- package/hydrate/index.mjs +971 -408
- package/package.json +2 -2
- package/dist/esm-es5/truncation-tooltip-FaW67DiY.js +0 -1
- package/dist/pine-core/p-0092444c.system.entry.js +0 -1
- package/dist/pine-core/p-00a50de5.system.entry.js +0 -3
- package/dist/pine-core/p-049f126a.entry.js +0 -1
- package/dist/pine-core/p-089c3e60.entry.js +0 -1
- package/dist/pine-core/p-158b2f51.entry.js +0 -1
- package/dist/pine-core/p-17f97f1a.entry.js +0 -1
- package/dist/pine-core/p-19ba2788.system.entry.js +0 -1
- package/dist/pine-core/p-208c7dbf.entry.js +0 -1
- package/dist/pine-core/p-25ea48d1.entry.js +0 -1
- package/dist/pine-core/p-295f64ea.entry.js +0 -1
- package/dist/pine-core/p-29cd4113.system.entry.js +0 -1
- package/dist/pine-core/p-2cb5483a.system.entry.js +0 -1
- package/dist/pine-core/p-36cb4bf6.entry.js +0 -1
- package/dist/pine-core/p-3c977d8d.system.entry.js +0 -1
- package/dist/pine-core/p-3d51891a.entry.js +0 -1
- package/dist/pine-core/p-432d5ec7.entry.js +0 -1
- package/dist/pine-core/p-44f546ae.entry.js +0 -1
- package/dist/pine-core/p-5442d983.system.entry.js +0 -1
- package/dist/pine-core/p-5833a072.system.entry.js +0 -1
- package/dist/pine-core/p-602c197f.entry.js +0 -1
- package/dist/pine-core/p-719542e1.system.entry.js +0 -1
- package/dist/pine-core/p-73f931a1.entry.js +0 -1
- package/dist/pine-core/p-75ee0403.entry.js +0 -1
- package/dist/pine-core/p-77395d62.system.entry.js +0 -1
- package/dist/pine-core/p-7a287635.system.entry.js +0 -1
- package/dist/pine-core/p-875b0436.system.entry.js +0 -1
- package/dist/pine-core/p-884cb31d.system.entry.js +0 -1
- package/dist/pine-core/p-8987fd45.system.entry.js +0 -1
- package/dist/pine-core/p-8cc302aa.system.entry.js +0 -1
- package/dist/pine-core/p-8e3ff75d.entry.js +0 -1
- package/dist/pine-core/p-90d5edc6.entry.js +0 -1
- package/dist/pine-core/p-91f60173.entry.js +0 -1
- package/dist/pine-core/p-9265497e.system.entry.js +0 -1
- package/dist/pine-core/p-94593f20.system.entry.js +0 -1
- package/dist/pine-core/p-99459e27.entry.js +0 -1
- package/dist/pine-core/p-99fdf70f.entry.js +0 -1
- package/dist/pine-core/p-9aaedded.entry.js +0 -1
- package/dist/pine-core/p-9dcd2cdb.entry.js +0 -1
- package/dist/pine-core/p-BLG6RDBt.js +0 -1
- package/dist/pine-core/p-BR5nujVX.system.js +0 -1
- package/dist/pine-core/p-CuSNnuFu.system.js +0 -1
- package/dist/pine-core/p-D04W0cAO.system.js +0 -1
- package/dist/pine-core/p-a0960b3d.system.entry.js +0 -1
- package/dist/pine-core/p-a1230a74.system.entry.js +0 -1
- package/dist/pine-core/p-a826f290.entry.js +0 -1
- package/dist/pine-core/p-acce8eb2.entry.js +0 -1
- package/dist/pine-core/p-aff411d0.entry.js +0 -1
- package/dist/pine-core/p-b182f806.entry.js +0 -2
- package/dist/pine-core/p-bb68431a.entry.js +0 -1
- package/dist/pine-core/p-be9b6e63.system.entry.js +0 -1
- package/dist/pine-core/p-bf30dec0.entry.js +0 -1
- package/dist/pine-core/p-c4e12f0a.entry.js +0 -1
- package/dist/pine-core/p-e0917a26.entry.js +0 -1
- package/dist/pine-core/p-e836a041.entry.js +0 -1
- package/dist/pine-core/p-ea340c55.system.entry.js +0 -1
- package/dist/pine-core/p-ea4d4741.system.entry.js +0 -1
- package/dist/pine-core/p-ea8f5d29.entry.js +0 -1
- package/dist/pine-core/p-eaf85be6.system.entry.js +0 -1
- package/dist/pine-core/p-ef13f665.system.entry.js +0 -1
- package/dist/pine-core/p-f3067d90.system.entry.js +0 -1
- package/dist/pine-core/p-jrkGLEPe.js +0 -1
package/components/pds-filter.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as e,HTMLElement as i,createEvent as t,h as r,Host as o,transformTag as n}from"@stencil/core/internal/client";import{a as s}from"./scroll.js";import{t as a,g as l}from"./index2.js";import{d as p}from"./pds-icon2.js";const c=e(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.pdsFilterOpen=t(this,"pdsFilterOpen",7),this.pdsFilterClose=t(this,"pdsFilterClose",7),this.pdsFilterClear=t(this,"pdsFilterClear",7),this.scrollRAF=null,this.lastScrollTime=0,this.variant="default",this.isOpen=!1,this.handleNativePopoverToggle=e=>{const i=e.target;if(i&&i.id===this.componentId+"-popover"){let e=!1;try{e=i.matches(":popover-open")}catch(t){e="block"===i.style.display}this.isOpen=e,this.isOpen?(setTimeout((()=>this.adjustPopoverPosition()),0),this.pdsFilterOpen.emit({componentId:this.componentId,variant:this.variant,text:this.text})):this.pdsFilterClose.emit({componentId:this.componentId,variant:this.variant,text:this.text})}},this.handleKeyDown=e=>{"clear"!==this.variant||"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this.handleClick())},this.handleClick=e=>{"clear"!==this.variant?(this.closeOtherPopovers(),i.prototype.showPopover&&!navigator.userAgent.includes("Firefox")||(e&&e.preventDefault(),setTimeout((()=>{null!=this.popoverEl&&(this.isOpen=!this.isOpen,this.isOpen?(this.popoverEl.style.display="block",this.popoverEl.classList.add("is-open"),this.adjustPopoverPosition(),this.pdsFilterOpen.emit({componentId:this.componentId,variant:this.variant,text:this.text})):(this.popoverEl.style.display="none",this.popoverEl.classList.remove("is-open"),this.pdsFilterClose.emit({componentId:this.componentId,variant:this.variant,text:this.text})))}),0))):this.pdsFilterClear.emit({componentId:this.componentId,text:this.text})}}disconnectedCallback(){if(this.scrollRAF&&(cancelAnimationFrame(this.scrollRAF),this.scrollRAF=null),this.lastScrollTime=0,this.popoverEl&&i.prototype.showPopover&&!navigator.userAgent.includes("Firefox")&&this.popoverEl.removeEventListener("toggle",this.handleNativePopoverToggle),this.isOpen&&this.popoverEl)try{this.popoverEl.hidePopover()}catch(e){this.popoverEl.style.display="none",this.popoverEl.classList.remove("is-open")}}componentDidRender(){this.popoverEl&&i.prototype.showPopover&&!navigator.userAgent.includes("Firefox")&&(this.popoverEl.removeEventListener("toggle",this.handleNativePopoverToggle),this.popoverEl.addEventListener("toggle",this.handleNativePopoverToggle))}handleWindowResize(){this.isOpen&&setTimeout((()=>this.adjustPopoverPosition()),16)}handleWindowScroll(){if(this.isOpen){const e="anchorName"in document.documentElement.style,i=performance.now();if(i-this.lastScrollTime<(e?66:33))return;this.lastScrollTime=i,this.scrollRAF&&cancelAnimationFrame(this.scrollRAF),this.scrollRAF=requestAnimationFrame((()=>{this.isOpen&&this.popoverEl&&this.el.isConnected&&this.adjustPopoverPosition(),this.scrollRAF=null}))}}closeOtherPopovers(){document.querySelectorAll("pds-filter").forEach((e=>{var i;if(e===this.el)return;const t=null===(i=e.shadowRoot)||void 0===i?void 0:i.querySelector(".pds-filter__popover");if(t){let e=!1;try{e=t.matches(":popover-open")}catch(i){e="block"===t.style.display}if(e)try{t.hidePopover()}catch(e){t.style.display="none",t.classList.remove("is-open")}}}))}adjustPopoverPosition(){var e;if(!this.popoverEl||"clear"===this.variant)return;const i=null===(e=this.el.shadowRoot)||void 0===e?void 0:e.querySelector(".pds-filter__trigger");if(!i)return;const t=i.getBoundingClientRect(),r=window.innerWidth,o=window.innerHeight,n="anchorName"in document.documentElement.style,a=228,l=this.popoverEl.getBoundingClientRect().height||200,p=s(this.el),c=p?t.right-a-20<0:t.left+a+20>r,d=t.bottom+8+l+20>o;if(n)this.popoverEl.classList.remove("popover-flip-horizontal","popover-flip-vertical"),c&&this.popoverEl.classList.add("popover-flip-horizontal"),d&&this.popoverEl.classList.add("popover-flip-vertical");else{let e=p?t.right-a:t.left,i=t.bottom+8,r=p?"top right":"top left";if(c){const i=this.popoverEl.getBoundingClientRect().width||a;e=p?t.left:t.right-i,r=p?"top left":"top right"}d&&(i=t.top-l-8,r=r.replace("top","bottom")),this.popoverEl.style.cssText=`\n position: fixed;\n left: ${e}px;\n top: ${i}px;\n z-index: var(--pine-z-index-overlay);\n transform-origin: ${r};\n `}}async showFilter(){if("clear"!==this.variant){if(null!=this.popoverEl)try{this.popoverEl.showPopover()}catch(e){this.popoverEl.style.display="block",this.popoverEl.classList.add("is-open")}}else console.warn("Clear variant does not support showFilter method")}async hideFilter(){if("clear"!==this.variant){if(null!=this.popoverEl)try{this.popoverEl.hidePopover()}catch(e){this.popoverEl.style.display="none",this.popoverEl.classList.remove("is-open")}}else console.warn("Clear variant does not support hideFilter method")}handlePopoverToggle(e){const t=e.target;if((!i.prototype.showPopover||navigator.userAgent.includes("Firefox"))&&t&&t.id===this.componentId+"-popover"){let e=!1;try{e=t.matches(":popover-open")}catch(i){e="block"===t.style.display}this.isOpen=e,this.isOpen?(setTimeout((()=>this.adjustPopoverPosition()),0),this.pdsFilterOpen.emit({componentId:this.componentId,variant:this.variant,text:this.text})):this.pdsFilterClose.emit({componentId:this.componentId,variant:this.variant,text:this.text})}}handleDocumentClick(e){!this.el.contains(e.target)&&this.isOpen&&"clear"!==this.variant&&setTimeout((()=>{if(this.popoverEl&&this.isOpen){const e=i.prototype.showPopover&&!navigator.userAgent.includes("Firefox");let t=!1;if(e)try{t=!this.popoverEl.matches(":popover-open")}catch(e){t="block"!==this.popoverEl.style.display}else t=!0;t&&(this.isOpen=!1,e||(this.popoverEl.style.display="none",this.popoverEl.classList.remove("is-open")),this.pdsFilterClose.emit({componentId:this.componentId,variant:this.variant,text:this.text}))}}),0)}handleEscapeKey(e){"Escape"===e.key&&this.isOpen&&"clear"!==this.variant&&setTimeout((()=>{if(this.popoverEl&&this.isOpen){const e=i.prototype.showPopover&&!navigator.userAgent.includes("Firefox");let t=!1;if(e)try{t=!this.popoverEl.matches(":popover-open")}catch(e){t="block"!==this.popoverEl.style.display}else t=!0;t&&(this.isOpen=!1,e||(this.popoverEl.style.display="none",this.popoverEl.classList.remove("is-open")),this.pdsFilterClose.emit({componentId:this.componentId,variant:this.variant,text:this.text}))}}),0)}getIcon(){return"clear"===this.variant?a:this.icon}getTriggerClasses(){const e=["pds-filter__trigger"];return e.push("pds-filter__trigger--"+this.variant),this.isOpen&&"clear"!==this.variant&&e.push("pds-filter__trigger--open"),e.join(" ")}renderIcon(){const e=this.getIcon();return null==e||""===e?null:r("pds-icon",{icon:e,size:"var(--pine-font-size-100)","aria-hidden":"true",part:"icon"})}renderDropdownIcon(){return"selected"===this.variant?r("pds-icon",{icon:l,size:"var(--pine-dimension-200)","aria-hidden":"true",class:"pds-filter__dropdown-icon",part:"icon"}):null}render(){return r(o,{key:"3cae951aee1f9c75f3e207cf6c68633a23f8f6dc",id:this.componentId},r("button",{key:"f4c644710dc936248995be9a49cef8ad13031d61",class:this.getTriggerClasses(),type:"button",popoverTarget:"clear"!==this.variant?this.componentId+"-popover":void 0,popoverTargetAction:"clear"!==this.variant?"toggle":void 0,onKeyDown:"clear"===this.variant?this.handleKeyDown:void 0,onClick:e=>this.handleClick(e),part:"button","aria-expanded":this.isOpen?"true":"false","aria-haspopup":"clear"!==this.variant?"true":void 0,"aria-controls":"clear"!==this.variant?this.componentId+"-popover":void 0},r("span",{key:"2dd87e53f363118becc762051ea1be664258b8b6",class:"pds-filter__button-content",part:"button-content"},this.renderIcon(),this.text&&r("span",{key:"733ceb5e07198e844fbdc1af294d2046c4c571d8",class:"pds-filter__button-text",part:"button-text"},this.text),this.renderDropdownIcon())),"clear"!==this.variant&&r("div",{key:"beb65a21192c6f5c16703aec7ab9a92ea378ef3c",ref:e=>this.popoverEl=e,id:this.componentId+"-popover",class:"pds-filter__popover",popover:"auto",part:"popover"},r("slot",{key:"5a481cc6b143b059a5fc33d377abe5ab79aefb4e"})))}get el(){return this}static get style(){return":host{--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);display:inline-block;position:relative}.pds-filter__trigger{-ms-flex-align:center;align-items:center;anchor-name:--filter-trigger;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-100);-webkit-box-shadow:var(--pine-box-shadow-050);box-shadow:var(--pine-box-shadow-050);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pine-color-text-tertiary);cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--pine-font-family-inter);font-size:var(--pine-font-size-100);font-weight:var(--pine-font-weight-400);gap:var(--pine-dimension-050);letter-spacing:var(--pine-letter-spacing-114);line-height:var(--pine-line-height-150);padding:var(--pine-dimension-025) var(--pine-dimension-125);position:relative;-webkit-transition:all var(--pine-motion-duration-base) ease;transition:all var(--pine-motion-duration-base) ease}.pds-filter__trigger pds-icon{block-size:var(--pine-font-size-100);color:var(--pine-color-text-secondary);-ms-flex-negative:0;flex-shrink:0;inline-size:var(--pine-font-size-100)}.pds-filter__trigger:hover,.pds-filter__trigger.pds-filter__trigger--open{background-color:var(--pine-color-background-subtle);border-color:var(--pine-color-border-hover);color:var(--pine-color-text-hover)}.pds-filter__trigger:hover pds-icon,.pds-filter__trigger.pds-filter__trigger--open pds-icon{color:var(--pine-color-text-secondary)}.pds-filter__trigger:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__trigger:disabled{cursor:not-allowed;opacity:0.5}.pds-filter__trigger--selected{background-color:var(--pine-color-purple-050);border-color:var(--pine-color-purple-500);color:var(--pine-color-purple-600)}.pds-filter__trigger--selected pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--selected:hover,.pds-filter__trigger--selected.pds-filter__trigger--open{background-color:var(--pine-color-purple-100);border-color:var(--pine-color-purple-500);color:var(--pine-color-purple-600)}.pds-filter__trigger--selected:hover pds-icon,.pds-filter__trigger--selected.pds-filter__trigger--open pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--selected:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__trigger--more{background-color:var(--pine-color-background-container-hover);border:var(--pine-border-width-thin) dashed var(--pine-color-border);color:var(--pine-color-text-tertiary)}.pds-filter__trigger--more pds-icon{color:var(--pine-color-text-secondary)}.pds-filter__trigger--more:hover,.pds-filter__trigger--more.pds-filter__trigger--open{background-color:var(--pine-color-background-subtle);border-color:var(--pine-color-border-hover);color:var(--pine-color-text-hover)}.pds-filter__trigger--more:hover pds-icon,.pds-filter__trigger--more.pds-filter__trigger--open pds-icon{color:var(--pine-color-text-secondary)}.pds-filter__trigger--more:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__trigger--clear{background:transparent;border:var(--pine-border-width-thin) solid transparent;border-radius:var(--pine-dimension-100);-webkit-box-shadow:none;box-shadow:none;color:var(--pine-color-purple-600)}.pds-filter__trigger--clear pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--clear:hover{background-color:var(--pine-color-purple-100);border-color:var(--pine-color-purple-100);color:var(--pine-color-purple-600)}.pds-filter__trigger--clear:hover pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--clear:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__button-content{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;gap:var(--pine-dimension-050);max-inline-size:148px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-filter__button-text{line-height:var(--pine-line-height-150);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-filter__dropdown-icon{block-size:var(--pine-dimension-200);-ms-flex-negative:0;flex-shrink:0;inline-size:var(--pine-dimension-200)}.pds-filter__popover{background-color:var(--pine-color-background-overlay);border:0;border-radius:var(--pine-dimension-100);-webkit-box-shadow:var(--pine-box-shadow-100);box-shadow:var(--pine-box-shadow-100);display:none;inline-size:228px;inset:unset;padding:var(--pine-dimension-100);z-index:var(--pine-z-index-overlay);}.pds-filter__popover:popover-open,.pds-filter__popover.is-open{display:block}.pds-filter__popover{}@supports (anchor-name: --test){.pds-filter__popover{inset-block-start:calc(anchor(--filter-trigger bottom) + var(--pine-dimension-100));inset-inline-start:anchor(--filter-trigger start);position:fixed;position-anchor:--filter-trigger;}.pds-filter__popover.popover-flip-horizontal{inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto}.pds-filter__popover.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}.pds-filter__popover.popover-flip-horizontal.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto;-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}.pds-filter__popover{}.pds-filter__popover.is-open.popover-flip-horizontal{inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto}.pds-filter__popover.is-open.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}.pds-filter__popover.is-open.popover-flip-horizontal.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto;-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}}"}},[257,"pds-filter",{componentId:[1,"component-id"],variant:[1],icon:[1],text:[1],isOpen:[32],showFilter:[64],hideFilter:[64]},[[9,"resize","handleWindowResize"],[9,"scroll","handleWindowScroll"],[4,"toggle","handlePopoverToggle"],[4,"click","handleDocumentClick"],[4,"keydown","handleEscapeKey"]]]),d=c,h=function(){"undefined"!=typeof customElements&&["pds-filter","pds-icon"].forEach((e=>{switch(e){case"pds-filter":customElements.get(n(e))||customElements.define(n(e),c);break;case"pds-icon":customElements.get(n(e))||p()}}))};export{d as PdsFilter,h as defineCustomElement}
|
|
1
|
+
import{proxyCustomElement as e,HTMLElement as i,createEvent as t,h as r,Host as o,transformTag as n}from"@stencil/core/internal/client";import{a as s}from"./scroll.js";import{t as a,g as l}from"./index2.js";import{d as p}from"./pds-icon2.js";const c=e(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.pdsFilterOpen=t(this,"pdsFilterOpen",7),this.pdsFilterClose=t(this,"pdsFilterClose",7),this.pdsFilterClear=t(this,"pdsFilterClear",7),this.scrollRAF=null,this.lastScrollTime=0,this.variant="default",this.isOpen=!1,this.handleNativePopoverToggle=e=>{const i=e.target;if(i&&i.id===this.componentId+"-popover"){let e=!1;try{e=i.matches(":popover-open")}catch(t){e="block"===i.style.display}this.isOpen=e,this.isOpen?(setTimeout((()=>this.adjustPopoverPosition()),0),this.pdsFilterOpen.emit({componentId:this.componentId,variant:this.variant,text:this.text})):this.pdsFilterClose.emit({componentId:this.componentId,variant:this.variant,text:this.text})}},this.handleKeyDown=e=>{"clear"!==this.variant||"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this.handleClick())},this.handleClick=e=>{"clear"!==this.variant?(this.closeOtherPopovers(),i.prototype.showPopover&&!navigator.userAgent.includes("Firefox")||(e&&e.preventDefault(),setTimeout((()=>{null!=this.popoverEl&&(this.isOpen=!this.isOpen,this.isOpen?(this.popoverEl.style.display="block",this.popoverEl.classList.add("is-open"),this.adjustPopoverPosition(),this.pdsFilterOpen.emit({componentId:this.componentId,variant:this.variant,text:this.text})):(this.popoverEl.style.display="none",this.popoverEl.classList.remove("is-open"),this.pdsFilterClose.emit({componentId:this.componentId,variant:this.variant,text:this.text})))}),0))):this.pdsFilterClear.emit({componentId:this.componentId,text:this.text})}}disconnectedCallback(){if(this.scrollRAF&&(cancelAnimationFrame(this.scrollRAF),this.scrollRAF=null),this.lastScrollTime=0,this.popoverEl&&i.prototype.showPopover&&!navigator.userAgent.includes("Firefox")&&this.popoverEl.removeEventListener("toggle",this.handleNativePopoverToggle),this.isOpen&&this.popoverEl)try{this.popoverEl.hidePopover()}catch(e){this.popoverEl.style.display="none",this.popoverEl.classList.remove("is-open")}}componentDidRender(){this.popoverEl&&i.prototype.showPopover&&!navigator.userAgent.includes("Firefox")&&(this.popoverEl.removeEventListener("toggle",this.handleNativePopoverToggle),this.popoverEl.addEventListener("toggle",this.handleNativePopoverToggle))}handleWindowResize(){this.isOpen&&setTimeout((()=>this.adjustPopoverPosition()),16)}handleWindowScroll(){if(this.isOpen){const e="anchorName"in document.documentElement.style,i=performance.now();if(i-this.lastScrollTime<(e?66:33))return;this.lastScrollTime=i,this.scrollRAF&&cancelAnimationFrame(this.scrollRAF),this.scrollRAF=requestAnimationFrame((()=>{this.isOpen&&this.popoverEl&&this.el.isConnected&&this.adjustPopoverPosition(),this.scrollRAF=null}))}}closeOtherPopovers(){document.querySelectorAll("pds-filter").forEach((e=>{var i;if(e===this.el)return;const t=null===(i=e.shadowRoot)||void 0===i?void 0:i.querySelector(".pds-filter__popover");if(t){let e=!1;try{e=t.matches(":popover-open")}catch(i){e="block"===t.style.display}if(e)try{t.hidePopover()}catch(e){t.style.display="none",t.classList.remove("is-open")}}}))}adjustPopoverPosition(){var e;if(!this.popoverEl||"clear"===this.variant)return;const i=null===(e=this.el.shadowRoot)||void 0===e?void 0:e.querySelector(".pds-filter__trigger");if(!i)return;const t=i.getBoundingClientRect(),r=window.innerWidth,o=window.innerHeight,n="anchorName"in document.documentElement.style,a=228,l=this.popoverEl.getBoundingClientRect().height||200,p=s(this.el),c=p?t.right-a-20<0:t.left+a+20>r,d=t.bottom+8+l+20>o;if(n)this.popoverEl.classList.remove("popover-flip-horizontal","popover-flip-vertical"),c&&this.popoverEl.classList.add("popover-flip-horizontal"),d&&this.popoverEl.classList.add("popover-flip-vertical");else{let e=p?t.right-a:t.left,i=t.bottom+8,r=p?"top right":"top left";if(c){const i=this.popoverEl.getBoundingClientRect().width||a;e=p?t.left:t.right-i,r=p?"top left":"top right"}d&&(i=t.top-l-8,r=r.replace("top","bottom")),this.popoverEl.style.cssText=`\n position: fixed;\n left: ${e}px;\n top: ${i}px;\n z-index: var(--pine-z-index-overlay);\n transform-origin: ${r};\n `}}async showFilter(){if("clear"!==this.variant){if(null!=this.popoverEl)try{this.popoverEl.showPopover()}catch(e){this.popoverEl.style.display="block",this.popoverEl.classList.add("is-open")}}else console.warn("Clear variant does not support showFilter method")}async hideFilter(){if("clear"!==this.variant){if(null!=this.popoverEl)try{this.popoverEl.hidePopover()}catch(e){this.popoverEl.style.display="none",this.popoverEl.classList.remove("is-open")}}else console.warn("Clear variant does not support hideFilter method")}handlePopoverToggle(e){const t=e.target;if((!i.prototype.showPopover||navigator.userAgent.includes("Firefox"))&&t&&t.id===this.componentId+"-popover"){let e=!1;try{e=t.matches(":popover-open")}catch(i){e="block"===t.style.display}this.isOpen=e,this.isOpen?(setTimeout((()=>this.adjustPopoverPosition()),0),this.pdsFilterOpen.emit({componentId:this.componentId,variant:this.variant,text:this.text})):this.pdsFilterClose.emit({componentId:this.componentId,variant:this.variant,text:this.text})}}handleDocumentClick(e){!this.el.contains(e.target)&&this.isOpen&&"clear"!==this.variant&&setTimeout((()=>{if(this.popoverEl&&this.isOpen){const e=i.prototype.showPopover&&!navigator.userAgent.includes("Firefox");let t=!1;if(e)try{t=!this.popoverEl.matches(":popover-open")}catch(e){t="block"!==this.popoverEl.style.display}else t=!0;t&&(this.isOpen=!1,e||(this.popoverEl.style.display="none",this.popoverEl.classList.remove("is-open")),this.pdsFilterClose.emit({componentId:this.componentId,variant:this.variant,text:this.text}))}}),0)}handleEscapeKey(e){"Escape"===e.key&&this.isOpen&&"clear"!==this.variant&&setTimeout((()=>{if(this.popoverEl&&this.isOpen){const e=i.prototype.showPopover&&!navigator.userAgent.includes("Firefox");let t=!1;if(e)try{t=!this.popoverEl.matches(":popover-open")}catch(e){t="block"!==this.popoverEl.style.display}else t=!0;t&&(this.isOpen=!1,e||(this.popoverEl.style.display="none",this.popoverEl.classList.remove("is-open")),this.pdsFilterClose.emit({componentId:this.componentId,variant:this.variant,text:this.text}))}}),0)}getIcon(){return"clear"===this.variant?a:this.icon}getTriggerClasses(){const e=["pds-filter__trigger"];return e.push("pds-filter__trigger--"+this.variant),this.isOpen&&"clear"!==this.variant&&e.push("pds-filter__trigger--open"),e.join(" ")}renderIcon(){const e=this.getIcon();return null==e||""===e?null:r("pds-icon",{icon:e,size:"var(--pine-font-size-100)","aria-hidden":"true",part:"icon"})}renderDropdownIcon(){return"selected"===this.variant?r("pds-icon",{icon:l,size:"var(--pine-dimension-200)","aria-hidden":"true",class:"pds-filter__dropdown-icon",part:"icon"}):null}render(){return r(o,{key:"9b2286e9a0d7f88b7f6bc90f8444185cfec832c8",id:this.componentId},r("button",{key:"968953600d615f2739757a91422dafdb817c9a6f",class:this.getTriggerClasses(),type:"button",popoverTarget:"clear"!==this.variant?this.componentId+"-popover":void 0,popoverTargetAction:"clear"!==this.variant?"toggle":void 0,onKeyDown:"clear"===this.variant?this.handleKeyDown:void 0,onClick:e=>this.handleClick(e),part:"button","aria-expanded":this.isOpen?"true":"false","aria-haspopup":"clear"!==this.variant?"true":void 0,"aria-controls":"clear"!==this.variant?this.componentId+"-popover":void 0},r("span",{key:"ee479f7e510ffcb54f7857cb7d1345f2a5c1d76a",class:"pds-filter__button-content",part:"button-content"},this.renderIcon(),this.text&&r("span",{key:"e98aa8b915a2460f3c7d49e20ec7d43853ee5f9f",class:"pds-filter__button-text",part:"button-text"},this.text),this.renderDropdownIcon())),"clear"!==this.variant&&r("div",{key:"3084babfba2d96880b2829a60d2ef00140a6813b",ref:e=>this.popoverEl=e,id:this.componentId+"-popover",class:"pds-filter__popover",popover:"auto",part:"popover"},r("slot",{key:"e901488be75a18bedc6b2c42be5c398fd2cf2a29"})))}get el(){return this}static get style(){return":host{--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);display:inline-block;position:relative}.pds-filter__trigger{-ms-flex-align:center;align-items:center;anchor-name:--filter-trigger;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-100);-webkit-box-shadow:var(--pine-box-shadow-050);box-shadow:var(--pine-box-shadow-050);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pine-color-text-tertiary);cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--pine-font-family-inter);font-size:var(--pine-font-size-100);font-weight:var(--pine-font-weight-400);gap:var(--pine-dimension-050);letter-spacing:var(--pine-letter-spacing-114);line-height:var(--pine-line-height-150);padding:var(--pine-dimension-025) var(--pine-dimension-125);position:relative;-webkit-transition:all var(--pine-motion-duration-base) ease;transition:all var(--pine-motion-duration-base) ease}.pds-filter__trigger pds-icon{block-size:var(--pine-font-size-100);color:var(--pine-color-text-secondary);-ms-flex-negative:0;flex-shrink:0;inline-size:var(--pine-font-size-100)}.pds-filter__trigger:hover,.pds-filter__trigger.pds-filter__trigger--open{background-color:var(--pine-color-background-subtle);border-color:var(--pine-color-border-hover);color:var(--pine-color-text-hover)}.pds-filter__trigger:hover pds-icon,.pds-filter__trigger.pds-filter__trigger--open pds-icon{color:var(--pine-color-text-secondary)}.pds-filter__trigger:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__trigger:disabled{cursor:not-allowed;opacity:0.5}.pds-filter__trigger--selected{background-color:var(--pine-color-purple-050);border-color:var(--pine-color-purple-500);color:var(--pine-color-purple-600)}.pds-filter__trigger--selected pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--selected:hover,.pds-filter__trigger--selected.pds-filter__trigger--open{background-color:var(--pine-color-purple-100);border-color:var(--pine-color-purple-500);color:var(--pine-color-purple-600)}.pds-filter__trigger--selected:hover pds-icon,.pds-filter__trigger--selected.pds-filter__trigger--open pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--selected:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__trigger--more{background-color:var(--pine-color-background-container-hover);border:var(--pine-border-width-thin) dashed var(--pine-color-border);color:var(--pine-color-text-tertiary)}.pds-filter__trigger--more pds-icon{color:var(--pine-color-text-secondary)}.pds-filter__trigger--more:hover,.pds-filter__trigger--more.pds-filter__trigger--open{background-color:var(--pine-color-background-subtle);border-color:var(--pine-color-border-hover);color:var(--pine-color-text-hover)}.pds-filter__trigger--more:hover pds-icon,.pds-filter__trigger--more.pds-filter__trigger--open pds-icon{color:var(--pine-color-text-secondary)}.pds-filter__trigger--more:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__trigger--clear{background:transparent;border:var(--pine-border-width-thin) solid transparent;border-radius:var(--pine-dimension-100);-webkit-box-shadow:none;box-shadow:none;color:var(--pine-color-purple-600)}.pds-filter__trigger--clear pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--clear:hover{background-color:var(--pine-color-purple-100);border-color:var(--pine-color-purple-100);color:var(--pine-color-purple-600)}.pds-filter__trigger--clear:hover pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--clear:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__button-content{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;gap:var(--pine-dimension-050);max-inline-size:148px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-filter__button-text{line-height:var(--pine-line-height-150);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-filter__dropdown-icon{block-size:var(--pine-dimension-200);-ms-flex-negative:0;flex-shrink:0;inline-size:var(--pine-dimension-200)}.pds-filter__popover{background-color:var(--pine-color-background-overlay);border:0;border-radius:var(--pine-dimension-100);-webkit-box-shadow:var(--pine-box-shadow-100);box-shadow:var(--pine-box-shadow-100);display:none;inline-size:228px;inset:unset;padding:var(--pine-dimension-100);z-index:var(--pine-z-index-overlay);}.pds-filter__popover:popover-open,.pds-filter__popover.is-open{display:block}.pds-filter__popover{}@supports (anchor-name: --test){.pds-filter__popover{inset-block-start:calc(anchor(--filter-trigger bottom) + var(--pine-dimension-100));inset-inline-start:anchor(--filter-trigger start);position:fixed;position-anchor:--filter-trigger;}.pds-filter__popover.popover-flip-horizontal{inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto}.pds-filter__popover.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}.pds-filter__popover.popover-flip-horizontal.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto;-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}.pds-filter__popover{}.pds-filter__popover.is-open.popover-flip-horizontal{inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto}.pds-filter__popover.is-open.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}.pds-filter__popover.is-open.popover-flip-horizontal.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto;-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}}"}},[257,"pds-filter",{componentId:[1,"component-id"],variant:[1],icon:[1],text:[1],isOpen:[32],showFilter:[64],hideFilter:[64]},[[9,"resize","handleWindowResize"],[9,"scroll","handleWindowScroll"],[4,"toggle","handlePopoverToggle"],[4,"click","handleDocumentClick"],[4,"keydown","handleEscapeKey"]]]),d=c,h=function(){"undefined"!=typeof customElements&&["pds-filter","pds-icon"].forEach((e=>{switch(e){case"pds-filter":customElements.get(n(e))||customElements.define(n(e),c);break;case"pds-icon":customElements.get(n(e))||p()}}))};export{d as PdsFilter,h as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as e,HTMLElement as s,h as t,Host as
|
|
1
|
+
import{proxyCustomElement as e,HTMLElement as s,h as t,Host as f,transformTag as i}from"@stencil/core/internal/client";const l=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}render(){return t(f,{key:"6f785fc222e3b5b7cf932f704b56aa7f1f52ead3",id:this.componentId},t("div",{key:"0ffd2894cdeb1e632228b4c3fa523069dcffa4b2",class:"pds-filters"},t("slot",{key:"a3f42dedcda1b0fec78a33793d085791d9b9fc5c"})))}static get style(){return":host{display:block}.pds-filters{-ms-flex-align:start;align-items:flex-start;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-100)}"}},[257,"pds-filters",{componentId:[1,"component-id"]}]),d=l,n=function(){"undefined"!=typeof customElements&&["pds-filters"].forEach((e=>{"pds-filters"===e&&(customElements.get(i(e))||customElements.define(i(e),l))}))};export{d as PdsFilters,n as defineCustomElement}
|
package/components/pds-icon2.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{Build as t,proxyCustomElement as i,HTMLElement as e,h as n,Host as s,transformTag as o}from"@stencil/core/internal/client";let r,l=!1;const c=(t,i)=>(t||!i||u(i)||(t=i),
|
|
1
|
+
import{Build as t,proxyCustomElement as i,HTMLElement as e,h as n,Host as s,transformTag as o}from"@stencil/core/internal/client";let r,l=!1;const c=(t,i)=>(t||!i||u(i)||(t=i),m(t)&&(t=f(t)),m(t)&&""!==t.trim()?""!=t.replace(/[a-z]|-|\d/gi,"")?null:t:null),a=t=>m(t)&&(t=t.trim(),u(t))?t:null,h=i=>{let e=a(i.src);return e||(e=c(i.name,i.icon),e?(n=e,(()=>{if("undefined"==typeof window)return new Map;if(!r){const t=window;t.PdsIcons=t.PdsIcons||{},r=t.PdsIcons.map=t.PdsIcons.map||new Map}return r})().get(n)||(i=>{var e;const n=null===(e=document.head.querySelector("meta[data-pine-asset-path]"))||void 0===e?void 0:e.dataset.pineAssetPath,s=window.__PINE_ASSET_PATH__,o=t.isTesting?"/dist/pds-icons":n||s||"https://cdn.jsdelivr.net/npm/@pine-ds/icons/dist/";o.startsWith("https://cdn.jsdelivr.net/npm/")&&!l&&(l=!0,console.warn("\n Fetching Pine assets from jsDelivr CDN.\n\n It's recommended that you bundle Pine Assets with your application and set the path accordingly.\n\nFor more information, read the documentation: \nhttps://pine-design-system.netlify.app/?path=/docs/guides-assets--docs\n "));let r=i;return i.startsWith("./")&&(r=i.substring(2)),o.endsWith("/")||(r="/"+r),o+r})(`svg/${n}.svg`)):i.icon&&(e=a(i.icon),e)?e:null);var n},d=t=>t&&""!==t.dir?"rtl"===t.dir.toLowerCase():"rtl"===(null===document||void 0===document?void 0:document.dir.toLowerCase()),u=t=>t.length>0&&/(\/|\.)/.test(t),m=t=>"string"==typeof t,f=t=>t.toLowerCase(),p=["align-horizontal-bottom","align-horizontal-center","align-horizontal-top","align-left","align-right","align-vertical-left","align-vertical-right","arrow-corner","arrow-left","arrow-right","calendar-schedule","caret-left","caret-right","cart","cart-add","comment","comment-no","conversation","copy","copy-07","delete-key","delete-x","downsell","drawer-collapse","drawer-expand","duplicate","feedback","file-lock","file-search","form-field","form-filled","left-small","launch","list-bullet","list-numbers","margin-left","margin-right","move-left","move-right","newsletter-2","one-off-session","quote","redo","reset-password","right-small","send-message","share","super-admin","tablet-landscape","undo","user-star","user-star-filled","users","users-filled","users-tone"],g=t=>{if(1===t.nodeType){if("script"===t.nodeName.toLowerCase())return!1;for(let i=0;i<t.attributes.length;i++){const e=t.attributes[i].name;if(m(e)&&0===e.toLowerCase().indexOf("on"))return!1}for(let i=0;i<t.childNodes.length;i++)if(!g(t.childNodes[i]))return!1}return!0},v=new Map,w=new Map;let b;const y=["aria-label","aria-labelledby"],x=i(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.didLoadIcon=!1,this.iconName=null,this.warnedUnnamedFocusable=!1,this.inheritedAttributes={},this.isFocusable=!1,this.isVisible=!1,this.size="regular"}iconSize(){const t={small:"12px",regular:"16px",medium:"20px",large:"24px"};return t[this.size]?t[this.size]:this.size}componentDidLoad(){this.setCSSVariables(),this.didLoadIcon||this.loadIcon(),setTimeout((()=>{this.svgContent||this.isVisible||(this.isVisible=!0,this.loadIcon())}),100),setTimeout((()=>{this.svgContent||this.isVisible||(this.isVisible=!0,this.loadIcon())}),500)}componentWillLoad(){this.inheritedAttributes=((t,i=[])=>{const e={};return i.forEach((i=>{t.hasAttribute(i)&&(null!==t.getAttribute(i)&&(e[i]=t.getAttribute(i)),t.removeAttribute(i))})),e})(this.el,y),this.isFocusable=this.el.hasAttribute("tabindex"),this.setCSSVariables()}setCSSVariables(){var t;this.el.style.setProperty("--dimension-icon-height",this.iconSize()),this.el.style.setProperty("--dimension-icon-width",this.iconSize()),this.el.style.setProperty("--color-icon-fill",null!==(t=(t=>{if(!m(t))return;const i=t.trim();return""!==i?i.startsWith("var(")?i:i.startsWith("--")?`var(${i})`:i:void 0})(this.color))&&void 0!==t?t:"currentColor")}connectedCallback(){this.observeNamingAttributes(),this.isVisible||this.svgContent||this.waitUntilVisible(this.el,"50px",(()=>{this.isVisible=!0,this.loadIcon()})),this.isElementInViewport(this.el)&&(this.isVisible=!0,this.loadIcon())}disconnectedCallback(){this.io&&(this.io.disconnect(),this.io=void 0),this.mo&&(this.mo.disconnect(),this.mo=void 0)}updateStyles(){this.setCSSVariables()}onIconPropertyChange(){this.loadIcon()}loadIcon(){if(this.didLoadIcon=!1,this.svgContent=void 0,t.isBrowser&&this.isVisible){const t=h(this);t&&(v.has(t)?this.svgContent=v.get(t):((t,i=!1)=>{let e=w.get(t);if(!e){if("undefined"==typeof fetch||"undefined"==typeof document)return v.set(t,""),Promise.resolve();if((t=>t.startsWith("data:image/svg+xml"))(t)&&(t=>-1!==t.indexOf(";utf8,"))(t)){b||(b=new DOMParser);try{const i=b.parseFromString(t,"text/html").querySelector("svg");v.set(t,i?i.outerHTML:"")}catch(i){v.set(t,"")}return Promise.resolve()}e=fetch(t).then((e=>{if(e.ok)return e.text().then((e=>{if(e&&!1!==i)try{e=(t=>{const i=document.createElement("div");i.innerHTML=t;for(let t=i.childNodes.length-1;t>=0;t--)"svg"!==i.childNodes[t].nodeName.toLowerCase()&&i.removeChild(i.childNodes[t]);const e=i.firstElementChild;if(e&&"svg"===e.nodeName.toLowerCase()){const t=e.getAttribute("class")||"";if(e.setAttribute("class",(t+" s-pds-icon").trim()),g(e))return i.innerHTML}return""})(e)}catch(t){e=""}v.set(t,e||"")}));throw new Error(`Failed to load SVG: ${e.status} ${e.statusText}`)})).catch((i=>{console.warn("Failed to load SVG:",t,i),v.set(t,"")})),w.set(t,e)}return e})(t).then((()=>{setTimeout((()=>{this.svgContent=v.get(t)}),0)})).catch((()=>{this.svgContent=""})),this.didLoadIcon=!0)}this.iconName=c(this.name,this.icon)}render(){const{flipRtl:i,iconName:e,inheritedAttributes:o}=this,r=!!e&&(t=>d(this.el)&&p.includes(t))(e)&&!1!==i,l=i||r,c=y.some((t=>void 0!==o[t])),a=!c&&!this.isFocusable;return t.isDev&&!c&&this.isFocusable&&!this.warnedUnnamedFocusable&&(this.warnedUnnamedFocusable=!0,console.warn("[pds-icon] A focusable icon needs an accessible name. Add an aria-label, or remove its tabindex.",this.el)),n(s,Object.assign({key:"6597475535756e7174072dc25c982137724d439d","aria-hidden":a?"true":void 0,alt:"",role:a?null:"img",class:Object.assign(Object.assign({},C(this.color)),{"flip-rtl":l,"icon-rtl":l&&d(this.el)})},o),n("div",t.isBrowser&&this.svgContent?{class:"icon-inner",innerHTML:this.svgContent}:{class:"icon-inner"}))}observeNamingAttributes(){t.isBrowser&&"undefined"!=typeof MutationObserver&&!this.mo&&(this.mo=new MutationObserver((()=>{const t=Object.assign({},this.inheritedAttributes);let i=!1;y.forEach((e=>{var n;const s=null!==(n=this.el.getAttribute(e))&&void 0!==n?n:void 0;t[e]!==s&&(void 0===s?delete t[e]:t[e]=s,i=!0)})),i&&(this.inheritedAttributes=t),this.isFocusable=this.el.hasAttribute("tabindex")})),this.mo.observe(this.el,{attributes:!0,attributeFilter:[...y,"tabindex"]}))}waitUntilVisible(i,e,n){if(t.isBrowser&&"undefined"!=typeof window&&window.IntersectionObserver){const t=this.io=new window.IntersectionObserver((i=>{i[0].isIntersecting&&(t.disconnect(),this.io=void 0,n())}),{rootMargin:e});t.observe(i),setTimeout((()=>{this.io&&!this.isVisible&&this.isElementInViewport(i)&&(this.io.disconnect(),this.io=void 0,n())}),1e3)}else n()}isElementInViewport(t){if(!t||!t.isConnected)return!1;const i=t.getBoundingClientRect(),e=window.innerHeight||document.documentElement.clientHeight,n=window.innerWidth||document.documentElement.clientWidth;return i.top>=0&&i.left>=0&&i.bottom<=e&&i.right<=n||i.top<e&&i.bottom>0&&i.left<n&&i.right>0}debugIconState(){var t;const i=h(this),e=this.el.getBoundingClientRect();console.log("PdsIcon Debug State:",{name:this.name,src:this.src,icon:this.icon,iconName:this.iconName,url:i,isVisible:this.isVisible,didLoadIcon:this.didLoadIcon,hasSvgContent:!!this.svgContent,svgContentLength:(null===(t=this.svgContent)||void 0===t?void 0:t.length)||0,isInCache:!!i&&v.has(i),cachedContent:i?v.get(i):null,element:this.el,isConnected:this.el.isConnected,isInViewport:this.isElementInViewport(this.el),hasIntersectionObserver:!!this.io,boundingClientRect:e,windowDimensions:{width:window.innerWidth||document.documentElement.clientWidth,height:window.innerHeight||document.documentElement.clientHeight}})}static get assetsDirs(){return["svg"]}get el(){return this}static get watchers(){return{size:[{updateStyles:0}],color:[{updateStyles:0}],name:[{onIconPropertyChange:0}],src:[{onIconPropertyChange:0}],icon:[{onIconPropertyChange:0}]}}static get style(){return":host{--dimension-icon-height:16px;--dimension-icon-width:16px;--color-icon-fill:currentColor;contain:strict;display:inline-block;fill:var(--color-icon-fill);-ms-flex-negative:0;flex-shrink:0;height:var(--dimension-icon-height);width:var(--dimension-icon-width)}:host .pdsicon{fill:var(--color-icon-fill)}.pds-icon-fill-none{fill:none}.icon-inner,.pds-icon,svg{display:block;height:100%;width:100%}:host(.flip-rtl):host-context([dir=rtl]) .icon-inner{-webkit-transform:scaleX(-1);transform:scaleX(-1)}:host(.flip-rtl:dir(rtl)) .icon-inner{-webkit-transform:scaleX(-1);transform:scaleX(-1)}:host(.flip-rtl:dir(ltr)) .icon-inner{-webkit-transform:scaleX(1);transform:scaleX(1)}"}},[1,"pds-icon",{color:[1],flipRtl:[4,"flip-rtl"],icon:[8],name:[513],size:[513],src:[1],inheritedAttributes:[32],isFocusable:[32],isVisible:[32],svgContent:[32]},void 0,{size:[{updateStyles:0}],color:[{updateStyles:0}],name:[{onIconPropertyChange:0}],src:[{onIconPropertyChange:0}],icon:[{onIconPropertyChange:0}]}]),C=t=>t?{"pds-color":!0,[`pds-color-${t}`]:!0}:null;function I(){"undefined"!=typeof customElements&&["pds-icon"].forEach((t=>{"pds-icon"===t&&(customElements.get(o(t))||customElements.define(o(t),x))}))}export{x as P,I as d}
|
package/components/pds-image.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as t,HTMLElement as s,h as e,Host as i,transformTag as
|
|
1
|
+
import{proxyCustomElement as t,HTMLElement as s,h as e,Host as i,transformTag as c}from"@stencil/core/internal/client";const d=t(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.alt="",this.loading="eager"}render(){return e(i,{key:"6d2d48c468c39f53d67e63999dd83f3ad61053b5",class:{"pds-image":!0},id:this.componentId},e("img",{key:"393cc584586e37e8d5b602fbdcda1783bf80cf9b",alt:this.alt,height:this.height,loading:this.loading,sizes:this.sizes,src:this.src,srcset:this.srcset,width:this.width}))}static get style(){return":host{--dimension-aspect-ratio:auto;display:inline-block}img{aspect-ratio:var(--dimension-aspect-ratio);display:block;height:auto;max-width:100%}"}},[1,"pds-image",{alt:[1],componentId:[1,"component-id"],height:[2],loading:[1],sizes:[1],src:[1],srcset:[1],width:[2]}]),n=d,o=function(){"undefined"!=typeof customElements&&["pds-image"].forEach((t=>{"pds-image"===t&&(customElements.get(c(t))||customElements.define(c(t),d))}))};export{n as PdsImage,o as defineCustomElement}
|
package/components/pds-input2.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as e,HTMLElement as r,createEvent as i,h as t,Host as s,transformTag as n}from"@stencil/core/internal/client";import{i as d,a as o,m as a}from"./form.js";import{i as p}from"./attributes.js";import{c as l,d as u,f as c}from"./utils.js";import{h}from"./index2.js";import{d as b}from"./pds-icon2.js";const v=e(class extends r{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.pdsBlur=i(this,"pdsBlur",7),this.pdsChange=i(this,"pdsChange",7),this.pdsFocus=i(this,"pdsFocus",7),this.pdsInput=i(this,"pdsInput",7),this.pdsKeyDown=i(this,"pdsKeyDown",7),this.inheritedAttributes={},this.isComposing=!1,this.hasLoaded=!1,this.hasPrefix=!1,this.hasSuffix=!1,this.hasPrepend=!1,this.hasAppend=!1,this.hasAction=!1,this.type="text",this.value="",this.hasFocus=!1,this.onInputEvent=e=>{const r=e.target;r&&(this.value=r.value||""),this.emitInputChange(e)},this.onChangeEvent=e=>{this.emitValueChange(e)},this.onBlurEvent=e=>{this.hasFocus=!1,this.focusedValue!==this.value&&this.emitValueChange(e),this.pdsBlur.emit(e)},this.onFocusEvent=e=>{this.hasFocus=!0,this.focusedValue=this.value,this.pdsFocus.emit(e)},this.onCompositionStart=()=>{this.isComposing=!0},this.onCompositionEnd=()=>{this.isComposing=!1},this.onKeyDownEvent=e=>{this.pdsKeyDown.emit(e)}}async setFocus(){this.nativeInput&&this.nativeInput.focus()}observeAddonResize(){var e;"undefined"!=typeof ResizeObserver&&(null===(e=this.resizeObserver)||void 0===e||e.disconnect(),this.resizeObserver=new ResizeObserver((()=>{this.updateAddonWidths()})),this.prefixEl&&this.resizeObserver.observe(this.prefixEl),this.suffixEl&&this.resizeObserver.observe(this.suffixEl))}updateAddonWidths(){requestAnimationFrame((()=>{this.prefixEl&&this.el.style.setProperty("--prefix-width",`${this.prefixEl.offsetWidth}px`),this.suffixEl&&this.el.style.setProperty("--suffix-width",`${this.suffixEl.offsetWidth}px`)}))}renderPrefix(){return null!==this.el.querySelector('[slot="prefix"]')?t("div",{class:"pds-input__prefix",part:"prefix",ref:e=>this.prefixEl=e},t("slot",{name:"prefix",onSlotchange:()=>this.updateAddonWidths()})):null}renderSuffix(){return null!==this.el.querySelector('[slot="suffix"]')?t("div",{class:"pds-input__suffix",part:"suffix",ref:e=>this.suffixEl=e},t("slot",{name:"suffix",onSlotchange:()=>this.updateAddonWidths()})):null}renderPrepend(){return null!==this.el.querySelector('[slot="prepend"]')?t("div",{class:"pds-input__prepend",part:"prepend"},t("slot",{name:"prepend"})):null}renderAppend(){return null!==this.el.querySelector('[slot="append"]')?t("div",{class:"pds-input__append",part:"append"},t("slot",{name:"append"})):null}renderAction(){return null!==this.el.querySelector('[slot="action"]')?t("div",{class:"pds-input__action",part:"action"},t("slot",{name:"action"})):null}componentWillLoad(){this.inheritedAttributes=Object.assign({},p(this.el)),this.hasPrefix=null!==this.el.querySelector('[slot="prefix"]'),this.hasSuffix=null!==this.el.querySelector('[slot="suffix"]'),this.hasPrepend=null!==this.el.querySelector('[slot="prepend"]'),this.hasAppend=null!==this.el.querySelector('[slot="append"]'),this.hasAction=null!==this.el.querySelector('[slot="action"]'),this.originalPdsInput=this.pdsInput}connectedCallback(){this.el.attachInternals&&!this.internals&&(this.internals=this.el.attachInternals()),this.hasLoaded&&!this.resizeObserver&&(this.updateAddonWidths(),this.observeAddonResize())}disconnectedCallback(){var e;l(this.pdsInput),null===(e=this.resizeObserver)||void 0===e||e.disconnect(),this.resizeObserver=void 0}componentDidLoad(){this.hasLoaded=!0,this.debounceChanged(),this.updateAddonWidths(),this.observeAddonResize(),this.updateFormValue()}debounceChanged(){const{pdsInput:e,debounce:r,originalPdsInput:i}=this;this.pdsInput=void 0===r?null!=i?i:e:u(e,r),c(e)}valueChanged(){const e=this.nativeInput,r=this.getValue();e&&e.value!==r&&!this.isComposing&&(e.value=r),this.updateFormValue()}getValue(){return"number"==typeof this.value?this.value.toString():(this.value||"").toString()}emitValueChange(e){const{value:r}=this,i=null==r?r:r.toString();this.focusedValue=i,this.pdsChange.emit({value:i,event:e})}emitInputChange(e){const{value:r}=this,i=null==r?r:r.toString();this.pdsInput.emit({value:i,event:e})}updateFormValue(){if(!d()&&this.internals&&this.internals.setFormValue){const e=this.getValue();this.internals.setFormValue(e||null),this.nativeInput&&this.internals&&this.internals.setValidity&&this.internals.setValidity(this.nativeInput.validity,this.nativeInput.validationMessage,this.nativeInput)}}formResetCallback(){this.value="",this.updateFormValue()}formDisabledCallback(e){this.disabled=e}formStateRestoreCallback(e){if("string"==typeof e)this.value=e;else if(e instanceof FormData&&this.name){const r=e.get(this.name);"string"==typeof r&&(this.value=r)}}render(){const{componentId:e,disabled:r,errorMessage:i,helperMessage:n,invalid:d=!1,label:p}=this,l=this.getValue(),u={"pds-input__field-wrapper":!0,"has-focus":this.hasFocus,"has-error":d||!!i,"is-disabled":r,"has-prefix":this.hasPrefix,"has-suffix":this.hasSuffix,"has-prepend":this.hasPrepend,"has-append":this.hasAppend};return t(s,{key:"75eb8bc6cda5e947f8677ebefe7995688f03f947","aria-disabled":this.disabled?"true":null,"aria-readonly":this.readonly?"true":null,"has-prefix":this.hasPrefix?"true":null,"has-suffix":this.hasSuffix?"true":null,"has-prepend":this.hasPrepend?"true":null,"has-append":this.hasAppend?"true":null,"has-action":this.hasAction&&!this.hideLabel?"true":null,"full-width":this.fullWidth?"true":null},t("div",{key:"93d7f90b9a64daccea1533abc08a8cb18825b828",class:"pds-input"},p&&t("div",{key:"948109b3bfa1a1b8171572da9160425e3e35a7a6",class:{"pds-input__label-wrapper":!0,"visually-hidden":this.hideLabel}},t("label",{key:"bb0e6c6febb97ad4aa3942ac5e67ac42dc1bde0a",htmlFor:e,class:"pds-input__label"},t("span",{key:"c6a122f829aa3b92ccb715c3f3975f6baadb3028"},p,this.required&&t("span",{key:"dce7d1a9c010a545992734bd238e9f6a4ca7b4ce",class:"pds-input__required-indicator"}," *"))),!this.hideLabel&&this.renderAction()),t("div",{key:"1b92ab5d649a4a9cf8112ea9b8a8a1095714f6d0",class:u},this.renderPrepend(),this.renderPrefix(),t("input",Object.assign({key:"bc3c4b907312149d375bb78f9912e4501da59348",ref:e=>this.nativeInput=e,class:"pds-input__field","aria-describedby":o(e,d,n,i),"aria-invalid":d?"true":void 0,autocomplete:this.autocomplete,disabled:r,id:e,max:this.max,maxlength:this.maxlength,min:this.min,minlength:this.minlength,name:this.name,pattern:this.pattern,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,step:this.step,type:this.type,value:l,onInput:this.onInputEvent,onChange:this.onChangeEvent,onBlur:this.onBlurEvent,onFocus:this.onFocusEvent,onKeyDown:this.onKeyDownEvent,onCompositionstart:this.onCompositionStart,onCompositionend:this.onCompositionEnd},this.inheritedAttributes)),this.renderSuffix(),this.renderAppend()),n&&t("p",{key:"f7bcbafc17a20310d602fce14a0adad522acbcb1",class:"pds-input__helper-message",id:a(e,"helper")},n),i&&t("p",{key:"bbbd6dc3203b89e5759587147de74d2ce3ce6177",class:"pds-input__error-message",id:a(e,"error")},t("pds-icon",{key:"68a6a92c82c1756ad99f431e0cb56756e3cdf75c","aria-hidden":"true",icon:h,size:"small"}),i)))}static get formAssociated(){return!0}get el(){return this}static get watchers(){return{debounce:[{debounceChanged:0}],value:[{valueChanged:0}]}}static get style(){return":host{--pine-input-color-background-danger:var(--pine-color-red-050)}:host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}:host{--pds-input-background:var(--pine-color-background-container);--pds-input-border-color:var(--pine-color-border);--pds-input-border-color-hover:var(--pine-color-border-hover);--pds-input-border-color-disabled:var(--pine-color-border-disabled);--pds-input-border-radius:var(--pine-dimension-125);--pds-input-border-width:var(--pine-border-width-thin);--pds-input-padding-x:var(--pine-dimension-150);--pds-input-padding-y:calc(var(--pine-dimension-xs) - var(--pine-border-width));--pds-input-font:var(--pine-typography-body);--pds-input-text-color:var(--pine-color-text-strong);--pds-input-placeholder-color:var(--pine-color-text-placeholder);--pds-input-icon-color:var(--pine-color-text-secondary);--pds-input-disabled-background:var(--pine-color-background-container-disabled);--pds-input-disabled-text-color:var(--pine-color-text-disabled);--pds-input-error-color:var(--pine-color-text-message-danger);--pds-input-error-background:var(--pine-input-color-background-danger);--pds-input-error-border:var(--pine-color-border-danger);--pds-input-error-border-hover:var(--pine-color-border-danger-hover);--pds-input-addon-background:var(--pine-color-background-subtle);--pds-input-addon-color:var(--pine-color-text-secondary);--pds-input-field-min-height:var(--pine-dimension-450);--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring-danger);display:inline}:host pds-select::part(select){background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}:host::part(prefix),:host::part(suffix){-ms-flex-align:center;align-items:center;color:var(--pine-color-text-label-readonly);display:-ms-flexbox;display:flex;height:100%;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);white-space:nowrap;z-index:calc(var(--pine-z-index-raised) - 1)}:host::part(prefix){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius);inset-inline-start:var(--pds-input-padding-x)}:host::part(suffix){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius);inset-inline-end:var(--pds-input-padding-x)}:host::part(prepend),:host::part(append){-ms-flex-align:center;align-items:center;background-color:var(--pds-input-addon-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);color:var(--pds-input-addon-color);display:-ms-flexbox;display:flex;overflow:visible}:host::part(prepend){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius)}:host::part(append){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius)}:host([has-prepend]) ::slotted(pds-button[slot=prepend]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-end:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pds-input-border-radius);--pds-button-border-radius-end-start:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-append]) ::slotted(pds-button[slot=append]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-start:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pds-input-border-radius);--pds-button-border-radius-end-end:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-prepend]) ::slotted(pds-select[slot=prepend]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-end:var(--pine-dimension-none);--pds-select-border-radius-end-start:var(--pds-input-border-radius);--pds-select-border-radius-start-end:var(--pine-dimension-none);--pds-select-border-radius-start-start:var(--pds-input-border-radius);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([has-append]) ::slotted(pds-select[slot=append]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-end:var(--pds-input-border-radius);--pds-select-border-radius-end-start:var(--pine-dimension-none);--pds-select-border-radius-start-end:var(--pds-input-border-radius);--pds-select-border-radius-start-start:var(--pine-dimension-none);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([aria-readonly=true]) input{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}:host([aria-disabled=true])::part(prepend),:host([aria-disabled=true])::part(append){background-color:var(--pds-input-disabled-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color-disabled)}:host([full-width=true]){width:100%}:host([invalid=true])::part(prepend),:host([invalid=true])::part(append){background-color:var(--pds-input-error-background);border:var(--pds-input-border-width) solid var(--pds-input-error-border)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true])){--pds-input-background:var(--pine-color-accent-disabled);--pds-input-border-color:var(--pine-color-accent);--pds-input-border-color-hover:var(--pine-color-accent-hover);--pds-input-text-color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true]))::part(prefix),:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true]))::part(suffix){color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true])) .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring)}.pds-input{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.pds-input__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label{color:var(--pine-color-text-strong);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label-wrapper .pds-input__label{-webkit-margin-after:0;margin-block-end:0}.pds-input__action{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}.pds-input__field-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;position:relative;width:100%}.pds-input__field-wrapper.has-prefix .pds-input__field{-webkit-padding-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));padding-inline-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em))}.pds-input__field-wrapper.has-suffix .pds-input__field{-webkit-padding-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));padding-inline-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em))}.pds-input__field-wrapper.has-prepend .pds-input__field{border-end-start-radius:var(--pine-dimension-none);border-start-start-radius:var(--pine-dimension-none)}.pds-input__field-wrapper.has-append .pds-input__field{border-end-end-radius:var(--pine-dimension-none);border-start-end-radius:var(--pine-dimension-none)}.pds-input__field{background:var(--pds-input-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);border-radius:var(--pds-input-border-radius);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pds-input-text-color);-ms-flex:1;flex:1;font:var(--pds-input-font);letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-input-field-min-height);min-width:var(--pine-dimension-none);padding:var(--pds-input-padding-y) var(--pds-input-padding-x);-webkit-transition:border-color var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease;width:100%}.pds-input__field:hover:not(:disabled){border-color:var(--pds-input-border-color-hover)}.pds-input__field:disabled{background:var(--pds-input-disabled-background);border-color:var(--pine-color-border-disabled);color:var(--pds-input-disabled-text-color);cursor:not-allowed}.pds-input__field:disabled::-webkit-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled:-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::placeholder{color:var(--pine-color-text-placeholder-disabled)}.has-error .pds-input__field:hover:not(:disabled){border-color:var(--pds-input-error-border-hover)}:host-context([data-theme=dark]) .has-error .pds-input__field:hover:not(:disabled){border-color:var(--pine-color-red-950)}.pds-input__field:focus-visible:not(.has-error){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width);position:relative;z-index:1}:host([has-prepend]) .pds-input__field:focus-visible:not(.has-error),:host([has-append]) .pds-input__field:focus-visible:not(.has-error),:host([has-prefix]) .pds-input__field:focus-visible:not(.has-error),:host([has-suffix]) .pds-input__field:focus-visible:not(.has-error){outline-offset:var(--pine-dimension-none)}.pds-input__field::-webkit-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-moz-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field:-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field:-moz-placeholder-shown{text-overflow:ellipsis}.pds-input__field:-ms-input-placeholder{text-overflow:ellipsis}.pds-input__field:placeholder-shown{text-overflow:ellipsis}.has-error .pds-input__field{background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}:host-context([data-theme=dark]) .has-error .pds-input__field{background-color:var(--pine-color-red-950)}.has-error .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring-danger);position:relative;z-index:1}.pds-input__error-message,.pds-input__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-after:var(--pine-dimension-none);margin-block-end:var(--pine-dimension-none);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-input__error-message{color:var(--pds-input-error-color);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-input__error-message pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-input__field::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;background-color:var(--pds-input-placeholder-color);cursor:pointer;height:var(--pine-dimension-sm);-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");-webkit-mask-size:contain;mask-size:contain;width:var(--pine-dimension-sm)}"}},[321,"pds-input",{autocomplete:[1],componentId:[1,"component-id"],debounce:[2],disabled:[4],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],invalid:[4],label:[1],hideLabel:[4,"hide-label"],max:[1],maxlength:[1],min:[1],minlength:[1],name:[1],pattern:[1],placeholder:[1],readonly:[4],required:[4],step:[1],type:[1],value:[1032],fullWidth:[4,"full-width"],highlight:[516],hasPrefix:[32],hasSuffix:[32],hasPrepend:[32],hasAppend:[32],hasAction:[32],hasFocus:[32],setFocus:[64]},void 0,{debounce:[{debounceChanged:0}],value:[{valueChanged:0}]}]);function f(){"undefined"!=typeof customElements&&["pds-input","pds-icon"].forEach((e=>{switch(e){case"pds-input":customElements.get(n(e))||customElements.define(n(e),v);break;case"pds-icon":customElements.get(n(e))||b()}}))}export{v as P,f as d}
|
|
1
|
+
import{proxyCustomElement as e,HTMLElement as r,createEvent as i,h as t,Host as s,transformTag as n}from"@stencil/core/internal/client";import{i as d,a as o,m as a}from"./form.js";import{i as p}from"./attributes.js";import{c as l,d as u,f as c}from"./utils.js";import{h}from"./index2.js";import{d as b}from"./pds-icon2.js";const v=e(class extends r{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.pdsBlur=i(this,"pdsBlur",7),this.pdsChange=i(this,"pdsChange",7),this.pdsFocus=i(this,"pdsFocus",7),this.pdsInput=i(this,"pdsInput",7),this.pdsKeyDown=i(this,"pdsKeyDown",7),this.inheritedAttributes={},this.isComposing=!1,this.hasLoaded=!1,this.hasPrefix=!1,this.hasSuffix=!1,this.hasPrepend=!1,this.hasAppend=!1,this.hasAction=!1,this.type="text",this.value="",this.hasFocus=!1,this.onInputEvent=e=>{const r=e.target;r&&(this.value=r.value||""),this.emitInputChange(e)},this.onChangeEvent=e=>{this.emitValueChange(e)},this.onBlurEvent=e=>{this.hasFocus=!1,this.focusedValue!==this.value&&this.emitValueChange(e),this.pdsBlur.emit(e)},this.onFocusEvent=e=>{this.hasFocus=!0,this.focusedValue=this.value,this.pdsFocus.emit(e)},this.onCompositionStart=()=>{this.isComposing=!0},this.onCompositionEnd=()=>{this.isComposing=!1},this.onKeyDownEvent=e=>{this.pdsKeyDown.emit(e)}}async setFocus(){this.nativeInput&&this.nativeInput.focus()}observeAddonResize(){var e;"undefined"!=typeof ResizeObserver&&(null===(e=this.resizeObserver)||void 0===e||e.disconnect(),this.resizeObserver=new ResizeObserver((()=>{this.updateAddonWidths()})),this.prefixEl&&this.resizeObserver.observe(this.prefixEl),this.suffixEl&&this.resizeObserver.observe(this.suffixEl))}updateAddonWidths(){requestAnimationFrame((()=>{this.prefixEl&&this.el.style.setProperty("--prefix-width",`${this.prefixEl.offsetWidth}px`),this.suffixEl&&this.el.style.setProperty("--suffix-width",`${this.suffixEl.offsetWidth}px`)}))}renderPrefix(){return null!==this.el.querySelector('[slot="prefix"]')?t("div",{class:"pds-input__prefix",part:"prefix",ref:e=>this.prefixEl=e},t("slot",{name:"prefix",onSlotchange:()=>this.updateAddonWidths()})):null}renderSuffix(){return null!==this.el.querySelector('[slot="suffix"]')?t("div",{class:"pds-input__suffix",part:"suffix",ref:e=>this.suffixEl=e},t("slot",{name:"suffix",onSlotchange:()=>this.updateAddonWidths()})):null}renderPrepend(){return null!==this.el.querySelector('[slot="prepend"]')?t("div",{class:"pds-input__prepend",part:"prepend"},t("slot",{name:"prepend"})):null}renderAppend(){return null!==this.el.querySelector('[slot="append"]')?t("div",{class:"pds-input__append",part:"append"},t("slot",{name:"append"})):null}renderAction(){return null!==this.el.querySelector('[slot="action"]')?t("div",{class:"pds-input__action",part:"action"},t("slot",{name:"action"})):null}componentWillLoad(){this.inheritedAttributes=Object.assign({},p(this.el)),this.hasPrefix=null!==this.el.querySelector('[slot="prefix"]'),this.hasSuffix=null!==this.el.querySelector('[slot="suffix"]'),this.hasPrepend=null!==this.el.querySelector('[slot="prepend"]'),this.hasAppend=null!==this.el.querySelector('[slot="append"]'),this.hasAction=null!==this.el.querySelector('[slot="action"]'),this.originalPdsInput=this.pdsInput}connectedCallback(){this.el.attachInternals&&!this.internals&&(this.internals=this.el.attachInternals()),this.hasLoaded&&!this.resizeObserver&&(this.updateAddonWidths(),this.observeAddonResize())}disconnectedCallback(){var e;l(this.pdsInput),null===(e=this.resizeObserver)||void 0===e||e.disconnect(),this.resizeObserver=void 0}componentDidLoad(){this.hasLoaded=!0,this.debounceChanged(),this.updateAddonWidths(),this.observeAddonResize(),this.updateFormValue()}debounceChanged(){const{pdsInput:e,debounce:r,originalPdsInput:i}=this;this.pdsInput=void 0===r?null!=i?i:e:u(e,r),c(e)}valueChanged(){const e=this.nativeInput,r=this.getValue();e&&e.value!==r&&!this.isComposing&&(e.value=r),this.updateFormValue()}getValue(){return"number"==typeof this.value?this.value.toString():(this.value||"").toString()}emitValueChange(e){const{value:r}=this,i=null==r?r:r.toString();this.focusedValue=i,this.pdsChange.emit({value:i,event:e})}emitInputChange(e){const{value:r}=this,i=null==r?r:r.toString();this.pdsInput.emit({value:i,event:e})}updateFormValue(){if(!d()&&this.internals&&this.internals.setFormValue){const e=this.getValue();this.internals.setFormValue(e||null),this.nativeInput&&this.internals&&this.internals.setValidity&&this.internals.setValidity(this.nativeInput.validity,this.nativeInput.validationMessage,this.nativeInput)}}formResetCallback(){this.value="",this.updateFormValue()}formDisabledCallback(e){this.disabled=e}formStateRestoreCallback(e){if("string"==typeof e)this.value=e;else if(e instanceof FormData&&this.name){const r=e.get(this.name);"string"==typeof r&&(this.value=r)}}render(){const{componentId:e,disabled:r,errorMessage:i,helperMessage:n,invalid:d=!1,label:p}=this,l=this.getValue(),u={"pds-input__field-wrapper":!0,"has-focus":this.hasFocus,"has-error":d||!!i,"is-disabled":r,"has-prefix":this.hasPrefix,"has-suffix":this.hasSuffix,"has-prepend":this.hasPrepend,"has-append":this.hasAppend};return t(s,{key:"1706e29a68d25a8bb83c36d6bddace04a448f6f5","aria-disabled":this.disabled?"true":null,"aria-readonly":this.readonly?"true":null,"has-prefix":this.hasPrefix?"true":null,"has-suffix":this.hasSuffix?"true":null,"has-prepend":this.hasPrepend?"true":null,"has-append":this.hasAppend?"true":null,"has-action":this.hasAction&&!this.hideLabel?"true":null,"full-width":this.fullWidth?"true":null},t("div",{key:"1488b6ea995c4ffc4068757f566494c0ac073950",class:"pds-input"},p&&t("div",{key:"e2fe4e461e626648ec51882e92e02fea179e3e13",class:{"pds-input__label-wrapper":!0,"visually-hidden":this.hideLabel}},t("label",{key:"c926a6fbb3130afdc6c86d509b92fb6650391c4b",htmlFor:e,class:"pds-input__label"},t("span",{key:"dbbaf9d0db49f949f69f1faf848e7c6193e32793"},p,this.required&&t("span",{key:"42e6325a0f5ee276ed92cf2eb71942c268c3d1aa",class:"pds-input__required-indicator"}," *"))),!this.hideLabel&&this.renderAction()),t("div",{key:"4715743733f2d7d3e4edf9ac4ab6d69ffde04d00",class:u},this.renderPrepend(),this.renderPrefix(),t("input",Object.assign({key:"438ac0fc6d497a8227c83e628d29d4633ffc208a",ref:e=>this.nativeInput=e,class:"pds-input__field","aria-describedby":o(e,d,n,i),"aria-invalid":d?"true":void 0,autocomplete:this.autocomplete,disabled:r,id:e,max:this.max,maxlength:this.maxlength,min:this.min,minlength:this.minlength,name:this.name,pattern:this.pattern,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,step:this.step,type:this.type,value:l,onInput:this.onInputEvent,onChange:this.onChangeEvent,onBlur:this.onBlurEvent,onFocus:this.onFocusEvent,onKeyDown:this.onKeyDownEvent,onCompositionstart:this.onCompositionStart,onCompositionend:this.onCompositionEnd},this.inheritedAttributes)),this.renderSuffix(),this.renderAppend()),n&&t("p",{key:"43b5c3a332072f19a38be316565602932c61504d",class:"pds-input__helper-message",id:a(e,"helper")},n),i&&t("p",{key:"54fd4fc2dcbc645377edbe4d04cfd82c7d1591e8",class:"pds-input__error-message",id:a(e,"error")},t("pds-icon",{key:"2bd509a575ec5c7a548955dd7f706d7c1d42557e","aria-hidden":"true",icon:h,size:"small"}),i)))}static get formAssociated(){return!0}get el(){return this}static get watchers(){return{debounce:[{debounceChanged:0}],value:[{valueChanged:0}]}}static get style(){return":host{--pine-input-color-background-danger:var(--pine-color-red-050)}:host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}:host{--pds-input-background:var(--pine-color-background-container);--pds-input-border-color:var(--pine-color-border);--pds-input-border-color-hover:var(--pine-color-border-hover);--pds-input-border-color-disabled:var(--pine-color-border-disabled);--pds-input-border-radius:var(--pine-dimension-125);--pds-input-border-width:var(--pine-border-width-thin);--pds-input-padding-x:var(--pine-dimension-150);--pds-input-padding-y:calc(var(--pine-dimension-xs) - var(--pine-border-width));--pds-input-font:var(--pine-typography-body);--pds-input-text-color:var(--pine-color-text-strong);--pds-input-placeholder-color:var(--pine-color-text-placeholder);--pds-input-icon-color:var(--pine-color-text-secondary);--pds-input-disabled-background:var(--pine-color-background-container-disabled);--pds-input-disabled-text-color:var(--pine-color-text-disabled);--pds-input-error-color:var(--pine-color-text-message-danger);--pds-input-error-background:var(--pine-input-color-background-danger);--pds-input-error-border:var(--pine-color-border-danger);--pds-input-error-border-hover:var(--pine-color-border-danger-hover);--pds-input-addon-background:var(--pine-color-background-subtle);--pds-input-addon-color:var(--pine-color-text-secondary);--pds-input-field-min-height:var(--pine-dimension-450);--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring-danger);display:inline}:host pds-select::part(select){background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}:host::part(prefix),:host::part(suffix){-ms-flex-align:center;align-items:center;color:var(--pine-color-text-label-readonly);display:-ms-flexbox;display:flex;height:100%;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);white-space:nowrap;z-index:calc(var(--pine-z-index-raised) - 1)}:host::part(prefix){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius);inset-inline-start:var(--pds-input-padding-x)}:host::part(suffix){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius);inset-inline-end:var(--pds-input-padding-x)}:host::part(prepend),:host::part(append){-ms-flex-align:center;align-items:center;background-color:var(--pds-input-addon-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);color:var(--pds-input-addon-color);display:-ms-flexbox;display:flex;overflow:visible}:host::part(prepend){border-end-start-radius:var(--pds-input-border-radius);-webkit-border-end:var(--pine-border-width-none);border-inline-end:var(--pine-border-width-none);border-start-start-radius:var(--pds-input-border-radius)}:host::part(append){border-end-end-radius:var(--pds-input-border-radius);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);border-start-end-radius:var(--pds-input-border-radius)}:host([has-prepend]) ::slotted(pds-button[slot=prepend]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-end:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pds-input-border-radius);--pds-button-border-radius-end-start:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-append]) ::slotted(pds-button[slot=append]){--pds-button-background:var(--pds-input-addon-background);--pds-button-border:var(--pine-border-width-none);--pds-button-border-radius:var(--pine-dimension-none);--pds-button-border-radius-end-start:var(--pine-dimension-none);--pds-button-border-radius-start-start:var(--pine-dimension-none);--pds-button-border-radius-start-end:var(--pds-input-border-radius);--pds-button-border-radius-end-end:var(--pds-input-border-radius);--pds-button-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)));--pds-button-box-shadow-focus:0 0 0 3px var(--pine-color-focus-ring);--pds-button-outline-focus:none}:host([has-prepend]) ::slotted(pds-select[slot=prepend]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-end:var(--pine-dimension-none);--pds-select-border-radius-end-start:var(--pds-input-border-radius);--pds-select-border-radius-start-end:var(--pine-dimension-none);--pds-select-border-radius-start-start:var(--pds-input-border-radius);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([has-append]) ::slotted(pds-select[slot=append]){--pds-select-background:var(--pds-input-addon-background);--pds-select-border:var(--pine-border-width-none);--pds-select-border-radius-end-end:var(--pds-input-border-radius);--pds-select-border-radius-end-start:var(--pine-dimension-none);--pds-select-border-radius-start-end:var(--pds-input-border-radius);--pds-select-border-radius-start-start:var(--pine-dimension-none);--pds-select-min-height:calc(var(--pine-dimension-450) - calc(2 * var(--pine-border-width)))}:host([aria-readonly=true]) input{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}:host([aria-disabled=true])::part(prepend),:host([aria-disabled=true])::part(append){background-color:var(--pds-input-disabled-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color-disabled)}:host([full-width=true]){width:100%}:host([invalid=true])::part(prepend),:host([invalid=true])::part(append){background-color:var(--pds-input-error-background);border:var(--pds-input-border-width) solid var(--pds-input-error-border)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true])){--pds-input-background:var(--pine-color-accent-disabled);--pds-input-border-color:var(--pine-color-accent);--pds-input-border-color-hover:var(--pine-color-accent-hover);--pds-input-text-color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true]))::part(prefix),:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true]))::part(suffix){color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([invalid]):not([aria-readonly=true])) .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring)}.pds-input{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.pds-input__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label{color:var(--pine-color-text-strong);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__label-wrapper .pds-input__label{-webkit-margin-after:0;margin-block-end:0}.pds-input__action{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}.pds-input__field-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;position:relative;width:100%}.pds-input__field-wrapper.has-prefix .pds-input__field{-webkit-padding-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em));padding-inline-start:calc(2 * var(--pds-input-padding-x) + var(--prefix-width, 1em))}.pds-input__field-wrapper.has-suffix .pds-input__field{-webkit-padding-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em));padding-inline-end:calc(2 * var(--pds-input-padding-x) + var(--suffix-width, 1em))}.pds-input__field-wrapper.has-prepend .pds-input__field{border-end-start-radius:var(--pine-dimension-none);border-start-start-radius:var(--pine-dimension-none)}.pds-input__field-wrapper.has-append .pds-input__field{border-end-end-radius:var(--pine-dimension-none);border-start-end-radius:var(--pine-dimension-none)}.pds-input__field{background:var(--pds-input-background);border:var(--pds-input-border-width) solid var(--pds-input-border-color);border-radius:var(--pds-input-border-radius);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pds-input-text-color);-ms-flex:1;flex:1;font:var(--pds-input-font);letter-spacing:var(--pine-letter-spacing);min-height:var(--pds-input-field-min-height);min-width:var(--pine-dimension-none);padding:var(--pds-input-padding-y) var(--pds-input-padding-x);-webkit-transition:border-color var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease;width:100%}.pds-input__field:hover:not(:disabled){border-color:var(--pds-input-border-color-hover)}.pds-input__field:disabled{background:var(--pds-input-disabled-background);border-color:var(--pine-color-border-disabled);color:var(--pds-input-disabled-text-color);cursor:not-allowed}.pds-input__field:disabled::-webkit-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled:-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::placeholder{color:var(--pine-color-text-placeholder-disabled)}.has-error .pds-input__field:hover:not(:disabled){border-color:var(--pds-input-error-border-hover)}:host-context([data-theme=dark]) .has-error .pds-input__field:hover:not(:disabled){border-color:var(--pine-color-red-950)}.pds-input__field:focus-visible:not(.has-error){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width);position:relative;z-index:1}:host([has-prepend]) .pds-input__field:focus-visible:not(.has-error),:host([has-append]) .pds-input__field:focus-visible:not(.has-error),:host([has-prefix]) .pds-input__field:focus-visible:not(.has-error),:host([has-suffix]) .pds-input__field:focus-visible:not(.has-error){outline-offset:var(--pine-dimension-none)}.pds-input__field::-webkit-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-moz-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field:-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::-ms-input-placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field::placeholder{color:var(--pds-input-placeholder-color)}.pds-input__field:-moz-placeholder-shown{text-overflow:ellipsis}.pds-input__field:-ms-input-placeholder{text-overflow:ellipsis}.pds-input__field:placeholder-shown{text-overflow:ellipsis}.has-error .pds-input__field{background-color:var(--pds-input-error-background);border-color:var(--pds-input-error-border)}:host-context([data-theme=dark]) .has-error .pds-input__field{background-color:var(--pine-color-red-950)}.has-error .pds-input__field:focus-visible{outline-color:var(--pine-color-focus-ring-danger);position:relative;z-index:1}.pds-input__error-message,.pds-input__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-after:var(--pine-dimension-none);margin-block-end:var(--pine-dimension-none);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-input__error-message{color:var(--pds-input-error-color);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-input__error-message pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-input__field::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;background-color:var(--pds-input-placeholder-color);cursor:pointer;height:var(--pine-dimension-sm);-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708'/%3E%3C/svg%3E\");-webkit-mask-size:contain;mask-size:contain;width:var(--pine-dimension-sm)}"}},[321,"pds-input",{autocomplete:[1],componentId:[1,"component-id"],debounce:[2],disabled:[4],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],invalid:[4],label:[1],hideLabel:[4,"hide-label"],max:[1],maxlength:[1],min:[1],minlength:[1],name:[1],pattern:[1],placeholder:[1],readonly:[4],required:[4],step:[1],type:[1],value:[1032],fullWidth:[4,"full-width"],highlight:[516],hasPrefix:[32],hasSuffix:[32],hasPrepend:[32],hasAppend:[32],hasAction:[32],hasFocus:[32],setFocus:[64]},void 0,{debounce:[{debounceChanged:0}],value:[{valueChanged:0}]}]);function f(){"undefined"!=typeof customElements&&["pds-input","pds-icon"].forEach((e=>{switch(e){case"pds-input":customElements.get(n(e))||customElements.define(n(e),v);break;case"pds-icon":customElements.get(n(e))||b()}}))}export{v as P,f as d}
|
package/components/pds-link2.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as o,HTMLElement as e,h as i,transformTag as t}from"@stencil/core/internal/client";import{s as r}from"./utils.js";import{l as n}from"./index2.js";import{d as s}from"./pds-icon2.js";const a=o(class extends e{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.active=!1,this.external=!1,this.variant="inline",this.fontSize="lg"}classNames(){const o=["pds-link"];return this.fontSize&&o.push("pds-link--"+this.fontSize),this.variant&&o.push("pds-link--"+this.variant),o.join(" ")}setLinkStyles(){if(this.color)return r(this.color,{secondary:"var(--pine-color-text-primary)",accent:"var(--pine-color-accent)",danger:"var(--pine-color-danger)"})}render(){const
|
|
1
|
+
import{proxyCustomElement as o,HTMLElement as e,h as i,transformTag as t}from"@stencil/core/internal/client";import{s as r}from"./utils.js";import{l as n}from"./index2.js";import{d as s}from"./pds-icon2.js";const a=o(class extends e{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.active=!1,this.external=!1,this.variant="inline",this.fontSize="lg"}classNames(){const o=["pds-link"];return this.fontSize&&o.push("pds-link--"+this.fontSize),this.variant&&o.push("pds-link--"+this.variant),o.join(" ")}setLinkStyles(){if(this.color)return r(this.color,{secondary:"var(--pine-color-text-primary)",accent:"var(--pine-color-accent)",danger:"var(--pine-color-danger)"})}render(){var o;const e=this.target||(this.external?"_blank":void 0),t=this.external,r="_blank"===e,s=r?"noopener noreferrer":void 0,a=null!==(o=this.externalLabel)&&void 0!==o?o:"(opens in a new tab)",d=r&&""!==a?a:void 0;return i("a",{key:"ae7928aa6dce42657545a1d17581818d3724746f",class:this.classNames(),download:this.download,href:this.href,id:this.componentId,part:"link","aria-current":this.active?"page":void 0,target:e,rel:s,style:this.setLinkStyles(),"data-turbo":this.turbo||void 0,"data-turbo-frame":this.turboFrame||void 0,"data-turbo-action":this.turboAction||void 0,"data-turbo-method":this.turboMethod||void 0,"data-turbo-confirm":this.turboConfirm||void 0,"data-turbo-stream":this.turboStream||void 0,"data-turbo-prefetch":this.turboPrefetch||void 0,"data-turbo-preload":this.turboPreload||void 0},i("slot",{key:"e61374c58fddec869f2f5dda54634a0b1ba9f345"},this.href),t&&i("pds-icon",{key:"161657146e5f3ce360480c573ea8f14c9012cb1f",icon:n,size:this.fontSize,"aria-label":d,"aria-hidden":void 0===d?"true":void 0}))}static get style(){return":host{display:inline}:host pds-icon{-webkit-margin-start:var(--pine-dimension-2xs);margin-inline-start:var(--pine-dimension-2xs)}.pds-link{-ms-flex-align:center;align-items:center;color:var(--color, var(--pds-context-link-color, var(--pine-color-text)));display:-ms-inline-flexbox;display:inline-flex;font-weight:var(--pine-font-weight-medium)}.pds-link:focus-visible{border-radius:var(--pine-dimension-2xs);isolation:isolate;outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width-thick)}.pds-link:hover{color:var(--color, var(--pds-context-link-color-hover, var(--pine-color-text-hover)));text-decoration:none}:host([color=secondary]) .pds-link{color:var(--pine-color-text-primary)}:host([color=secondary]) .pds-link:hover{color:var(--pine-color-text-inverse-secondary)}:host([color=accent]) .pds-link{color:var(--pine-color-accent)}:host([color=accent]) .pds-link:hover{color:var(--pine-color-accent-hover)}:host([color=danger]) .pds-link{color:var(--pine-color-danger)}:host([color=danger]) .pds-link:hover{color:var(--pine-color-danger-hover)}.pds-link--sm{font-size:var(--pine-font-size-body-xs)}.pds-link--sm pds-icon{height:var(--pine-dimension-xs);width:var(--pine-dimension-xs)}.pds-link--md{font-size:var(--pine-font-size-body-sm)}.pds-link--md pds-icon{height:var(--pine-dimension-xs);width:var(--pine-dimension-xs)}.pds-link--lg{font-size:var(--pine-font-size-body-md)}.pds-link--lg pds-icon{height:var(--pine-dimension-sm);width:var(--pine-dimension-sm)}.pds-link--plain{text-decoration:none}.pds-link--plain:hover{color:var(--color, var(--pds-context-link-color-hover, var(--pine-color-text-hover)));text-decoration:underline}:host([active]) .pds-link{color:var(--pds-context-link-color, var(--pine-color-text-strong));text-decoration:underline}:host([active]) .pds-link:hover{color:var(--pds-context-link-color-hover, var(--pine-color-text-strong));text-decoration:underline}"}},[257,"pds-link",{active:[516],color:[1],download:[1],componentId:[1,"component-id"],external:[4],externalLabel:[1,"external-label"],target:[1],variant:[1],fontSize:[1,"font-size"],href:[1],turbo:[1],turboFrame:[1,"turbo-frame"],turboAction:[1,"turbo-action"],turboMethod:[1,"turbo-method"],turboConfirm:[1,"turbo-confirm"],turboStream:[1,"turbo-stream"],turboPrefetch:[1,"turbo-prefetch"],turboPreload:[1,"turbo-preload"]}]);function d(){"undefined"!=typeof customElements&&["pds-link","pds-icon"].forEach((o=>{switch(o){case"pds-link":customElements.get(t(o))||customElements.define(t(o),a);break;case"pds-icon":customElements.get(t(o))||s()}}))}export{a as P,d}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as e,HTMLElement as i,h as t,Host as a,transformTag as n}from"@stencil/core/internal/client";import{H as r}from"./attributes.js";import{r as o}from"./reflected-attribute-default.js";const s=e(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.hostKeeper=new r,this.isLoading=!0,this.showLabel=!1,this.size="md",this.variant="spinner",this.getSvgStyle=()=>{if(void 0!==this.size)return{height:this.loaderSize(),width:this.loaderSize()}}}connectedCallback(){this.hostKeeper.connect(this.el)}disconnectedCallback(){this.hostKeeper.disconnect()}restoreSizeDefault(e){this.size=o(this.el,"size",e,"md")}loaderSize(){const e={xs:"24px",sm:"32px",md:"48px",lg:"64px",xl:"80px"};return e[this.size]?e[this.size]:this.size}render(){const e="pds-loader "+(this.isLoading?"":"pds-loader--hidden"),i={"aria-hidden":this.isLoading?null:"true","aria-busy":this.isLoading?"true":null,"aria-live":"polite"};return this.hostKeeper.record(e,{},i),t(a,Object.assign({key:"
|
|
1
|
+
import{proxyCustomElement as e,HTMLElement as i,h as t,Host as a,transformTag as n}from"@stencil/core/internal/client";import{H as r}from"./attributes.js";import{r as o}from"./reflected-attribute-default.js";const s=e(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.hostKeeper=new r,this.isLoading=!0,this.showLabel=!1,this.size="md",this.variant="spinner",this.getSvgStyle=()=>{if(void 0!==this.size)return{height:this.loaderSize(),width:this.loaderSize()}}}connectedCallback(){this.hostKeeper.connect(this.el)}disconnectedCallback(){this.hostKeeper.disconnect()}restoreSizeDefault(e){this.size=o(this.el,"size",e,"md")}loaderSize(){const e={xs:"24px",sm:"32px",md:"48px",lg:"64px",xl:"80px"};return e[this.size]?e[this.size]:this.size}render(){const e="pds-loader "+(this.isLoading?"":"pds-loader--hidden"),i={"aria-hidden":this.isLoading?null:"true","aria-busy":this.isLoading?"true":null,"aria-live":"polite"};return this.hostKeeper.record(e,{},i),t(a,Object.assign({key:"eaf8a64d5c2e37349ed2d2426a6c6bf1df68005f",class:e},i),"spinner"===this.variant&&t("div",{key:"216143117aabd29ca52c56cd7951a27f9742e466",class:"pds-loader--spinner"},t("svg",{key:"9c9db37e883fb3a4ba5e0c7c173a5d7a76cdadda",style:this.getSvgStyle(),viewBox:"0 0 200 200",fill:"none",part:"loader-svg"},t("defs",{key:"8f65f537290ea2dd96b66343324851d243fec3dd"},t("linearGradient",{key:"8b1a53bcc9401b98dafa805cae8e417af7646bfd",id:"spinner-secondHalf"},t("stop",{key:"f06605f7180e9c07d5eb4c9dbadcdb87cee0dd70",offset:"0%","stop-opacity":"0","stop-color":"currentColor"}),t("stop",{key:"0bf492e4d5578bd0d98a2f7570a1dd21ca2ecf3d",offset:"100%","stop-opacity":"0.5","stop-color":"currentColor"})),t("linearGradient",{key:"6c7038c158d786866a408063b07b236bf17cefc1",id:"spinner-firstHalf"},t("stop",{key:"916502c73bc4b78368bb210aed318537841917b9",offset:"0%","stop-opacity":"1","stop-color":"currentColor"}),t("stop",{key:"2d20708106bb3a685fbaf4bdcf099684a36359c0",offset:"100%","stop-opacity":"0.5","stop-color":"currentColor"}))),t("g",{key:"93165f80e7d5155b3dc8f2fc62e326bec7604c57",class:"pds-loader__spinner-path"},t("path",{key:"4b1e39a899aadf9d4b4cbf954c783c1103c43c24",stroke:"url(#spinner-secondHalf)",d:"M 4 100 A 96 96 0 0 1 196 100"}),t("path",{key:"0aa1683dc97e2a01cc076a52a4883388c1d09c6f",stroke:"url(#spinner-firstHalf)",d:"M 196 100 A 96 96 0 0 1 4 100"}),t("path",{key:"9839fb9e0b473814d3b10eb27f7be87990b6c088",stroke:"currentColor","stroke-linecap":"round",d:"M 4 100 A 96 96 0 0 1 4 98"})))),"typing"===this.variant&&t("div",{key:"d83e4625ea2d41a545a98e08edb3033b83e7eb5b",class:"pds-loader--typing"},t("span",{key:"2e793f3f5b17cb7709c8fc89e2054d7cd77fafd4"}),t("span",{key:"c266ad3b8edf6c1cc392c544027f7cfd543b711c"}),t("span",{key:"061f9e3030cce603e50e8d86d3aa5036800c1324"})),t("div",{key:"747c1c6c28136cfb9ba9dac0d4944bc6281af075",class:"pds-loader__label "+(this.showLabel?"":"pds-loader--hidden")},t("slot",{key:"5eb5a5710deafa10bd269429edff0ac677546cf5",name:"label"},"Loading...")))}get el(){return this}static get watchers(){return{size:[{restoreSizeDefault:0}]}}static get style(){return":host{--loader-color:var(--pine-color-primary);-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--pine-dimension-xs)}:host(.pds-loader--hidden),.pds-loader--hidden{border-width:0;clip:rect(0, 0, 0, 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-loader--spinner svg{--number-spinner-timing:2s;--number-spinner-path-timing:1.5s;-webkit-animation:rotate var(--number-spinner-timing) linear infinite;animation:rotate var(--number-spinner-timing) linear infinite;color:var(--loader-color)}.pds-loader__spinner-path{stroke-width:8px}@-webkit-keyframes rotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.pds-loader--typing{--number-typing-timing:1s;--opacity-typing-dot-default:0.4;--opacity-typing-dot-active:1;-ms-flex-align:center;align-items:center;background-color:var(--pine-color-background-muted);border-radius:var(--pine-dimension-sm);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);display:-ms-inline-flexbox;display:inline-flex;gap:var(--pine-dimension-2xs);margin-block:var(--pine-dimension-none);margin-inline:auto;padding-block:15px;padding-inline:20px;position:relative}.pds-loader--typing span{background-color:var(--pine-color-border-hover);block-size:6px;border-radius:var(--pine-border-radius-full);inline-size:6px;opacity:var(--opacity-typing-dot-default)}.pds-loader--typing span:nth-of-type(1){-webkit-animation:var(--number-typing-timing) typing infinite 0.3333s;animation:var(--number-typing-timing) typing infinite 0.3333s}.pds-loader--typing span:nth-of-type(2){-webkit-animation:var(--number-typing-timing) typing infinite 0.6666s;animation:var(--number-typing-timing) typing infinite 0.6666s}.pds-loader--typing span:nth-of-type(3){-webkit-animation:var(--number-typing-timing) typing infinite 0.9999s;animation:var(--number-typing-timing) typing infinite 0.9999s}@-webkit-keyframes typing{50%{opacity:var(--opacity-typing-dot-active);-webkit-transform:scale(1.25);transform:scale(1.25)}}@keyframes typing{50%{opacity:var(--opacity-typing-dot-active);-webkit-transform:scale(1.25);transform:scale(1.25)}}.pds-loader__label{--typography-label-default:var(--pine-font-weight-medium) var(--pine-font-size-body-md)/var(--pine-line-height-body) var(--pine-font-family-body);font:var(--typography-label-default)}"}},[257,"pds-loader",{isLoading:[4,"is-loading"],showLabel:[4,"show-label"],size:[1537],variant:[1]},void 0,{size:[{restoreSizeDefault:0}]}]);function d(){"undefined"!=typeof customElements&&["pds-loader"].forEach((e=>{"pds-loader"===e&&(customElements.get(n(e))||customElements.define(n(e),s))}))}export{s as P,d}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as t,HTMLElement as o,h as e,Host as s,transformTag as n}from"@stencil/core/internal/client";import{u as
|
|
1
|
+
import{proxyCustomElement as t,HTMLElement as o,h as e,Host as s,transformTag as n}from"@stencil/core/internal/client";import{u as i}from"./reconnected-content.js";const d=t(class extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this.border="none",this.contentMaxHeight="none",this.userSetBorder=!1,this.hasLoaded=!1,this.handleScroll=()=>{this.updateBorders()},this.handleResize=()=>{this.calculateMaxHeight(),setTimeout((()=>this.updateBorders()),50)}}componentDidRender(){i(this.el.querySelector(".pds-modal-content"),".pds-modal-content")}componentWillLoad(){const t=this.el.getAttribute("border");this.userSetBorder=null!==t||"none"!==this.border}componentDidLoad(){this.hasLoaded=!0,this.calculateMaxHeight(),this.userSetBorder||setTimeout((()=>this.updateBorders()),200)}connectedCallback(){window.addEventListener("resize",this.handleResize),this.el.addEventListener("scroll",this.handleScroll),this.hasLoaded&&this.calculateMaxHeight()}disconnectedCallback(){window.removeEventListener("resize",this.handleResize),this.el.removeEventListener("scroll",this.handleScroll),this.mutationObserver&&(this.mutationObserver.disconnect(),this.mutationObserver=void 0)}updateBorders(){if(this.userSetBorder)return;const t=this.el.closest("pds-modal");if(!t)return;if(!1===t.scrollable)return void(this.border="none");const o=this.el;if(!(o.scrollHeight>o.clientHeight))return void(this.border="none");const{scrollTop:e,scrollHeight:s,clientHeight:n}=o,i=e<=3,d=e+n>=s-3;this.border=i&&d?"none":i&&!d?"bottom":!i&&d?"top":"both"}calculateMaxHeight(){const t=this.el.closest("pds-modal");if(!t)return;const o=!1!==t.scrollable;setTimeout((()=>{if(!o){this.contentMaxHeight="none";const t=this.el.querySelector(".pds-modal-content");return void(t&&(t.style.maxHeight="none"))}const e=t.querySelector("pds-modal-header"),s=t.querySelector("pds-modal-footer"),n=e?e.offsetHeight:0,i=s?s.offsetHeight:0;if(n>0||i>0){const t=Math.round(.06*window.innerHeight);this.contentMaxHeight=`calc(100vh - ${n+i+48+t+50}px)`;const o=this.el.querySelector(".pds-modal-content");o&&(o.style.maxHeight=this.contentMaxHeight)}else this.contentMaxHeight="none";setTimeout((()=>this.updateBorders()),150)}),100),!this.mutationObserver&&t&&(this.mutationObserver=new MutationObserver((()=>{this.calculateMaxHeight()})),this.mutationObserver.observe(t,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["style","class"]}))}render(){const t="none"!==this.contentMaxHeight?{maxHeight:this.contentMaxHeight}:{};return e(s,{key:"b4200778f186c45a1917646ba2e0e4e623959951"},e("div",{key:"39eaaf228e5441f5c0fd628c47be079fb4e07e0f",class:{"pds-modal-content":!0,["pds-modal-content--border-"+this.border]:!0},style:t,tabindex:"-1"},e("slot",{key:"ac31a9b81941b8b3abbac3a67c25bacaa54e6840"})))}get el(){return this}static get style(){return"pds-modal-content{display:block;-ms-flex:1 1 auto;flex:1 1 auto;width:100%}pds-modal-content:has(.pds-modal-content.pds-modal-content--border-none){border:0}pds-modal-content:has(.pds-modal-content.pds-modal-content--border-both){-webkit-border-after:1px solid var(--pine-color-border-subtle);border-block-end:1px solid var(--pine-color-border-subtle);-webkit-border-before:1px solid var(--pine-color-border-subtle);border-block-start:1px solid var(--pine-color-border-subtle)}pds-modal-content:has(.pds-modal-content.pds-modal-content--border-top){-webkit-border-before:1px solid var(--pine-color-border-subtle);border-block-start:1px solid var(--pine-color-border-subtle)}pds-modal-content:has(.pds-modal-content.pds-modal-content--border-bottom){-webkit-border-after:1px solid var(--pine-color-border-subtle);border-block-end:1px solid var(--pine-color-border-subtle)}.pds-modal-content{display:block;-ms-flex:1 1 auto;flex:1 1 auto;min-height:0;width:100%}"}},[260,"pds-modal-content",{border:[1537],contentMaxHeight:[32]}]),r=d,l=function(){"undefined"!=typeof customElements&&["pds-modal-content"].forEach((t=>{"pds-modal-content"===t&&(customElements.get(n(t))||customElements.define(n(t),d))}))};export{r as PdsModalContent,l as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as e,HTMLElement as o,h as t,transformTag as s}from"@stencil/core/internal/client";import{u as
|
|
1
|
+
import{proxyCustomElement as e,HTMLElement as o,h as t,transformTag as s}from"@stencil/core/internal/client";import{u as d}from"./reconnected-content.js";const r=e(class extends o{constructor(e){super(),!1!==e&&this.__registerHost()}componentDidRender(){d(this.el.querySelector(".pds-modal__footer"),".pds-modal__footer")}render(){return t("footer",{key:"c0d50408471355d80759112e63f58c8a34fb7906",class:"pds-modal__footer"},t("slot",{key:"6566d446457be8b57e37bf1542a5863b0018d233"}))}get el(){return this}static get style(){return"pds-modal-footer{display:block;width:100%}.pds-modal__footer{width:100%}"}},[260,"pds-modal-footer"]),n=r,l=function(){"undefined"!=typeof customElements&&["pds-modal-footer"].forEach((e=>{"pds-modal-footer"===e&&(customElements.get(s(e))||customElements.define(s(e),r))}))};export{n as PdsModalFooter,l as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as e,HTMLElement as d,h as t,transformTag as s}from"@stencil/core/internal/client";import{u as
|
|
1
|
+
import{proxyCustomElement as e,HTMLElement as d,h as t,transformTag as s}from"@stencil/core/internal/client";import{u as r}from"./reconnected-content.js";const o=e(class extends d{constructor(e){super(),!1!==e&&this.__registerHost()}componentDidRender(){r(this.el.querySelector(".pds-modal__header"),".pds-modal__header")}render(){return t("header",{key:"eb295ff36fd23b7965296b6dfcfcf783a32079a0",class:"pds-modal__header"},t("slot",{key:"9c97566ff79f8d9b233d814395d5a7e893751a06"}))}get el(){return this}static get style(){return"pds-modal-header{display:block;width:100%}.pds-modal__header{width:100%}"}},[260,"pds-modal-header"]),a=o,n=function(){"undefined"!=typeof customElements&&["pds-modal-header"].forEach((e=>{"pds-modal-header"===e&&(customElements.get(s(e))||customElements.define(s(e),o))}))};export{a as PdsModalHeader,n as defineCustomElement}
|
package/components/pds-modal2.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as t,HTMLElement as i,createEvent as o,h as e,transformTag as s}from"@stencil/core/internal/client";import{c as n}from"./closest.js";import{u as a}from"./reconnected-content.js";const d=["sm","md","lg","fullscreen"],r=["a[href]","area[href]","button",'input:not([type="hidden"])',"select","textarea","iframe","summary",'[contenteditable]:not([contenteditable="false"])',"[tabindex]"].join(",");function l(t,i){for(const o of Array.from(t.children))h(o,i)}const c=t=>{var i;return t.tabIndex>=0||t.isContentEditable&&!t.hasAttribute("tabindex")&&!(null===(i=t.parentElement)||void 0===i?void 0:i.isContentEditable)};function h(t,o){var e,s,n,a;if(t.hasAttribute("inert"))return;if("slot"===t.localName){const i=t;if(0===(null!==(s=null===(e=i.assignedNodes)||void 0===e?void 0:e.call(i,{flatten:!0}))&&void 0!==s?s:[]).length)return l(t,o);for(const t of i.assignedElements({flatten:!0}))h(t,o);return}const d=!0===(null===(n=t.shadowRoot)||void 0===n?void 0:n.delegatesFocus);t instanceof i&&!d&&c(t)&&t.matches(r)&&!t.matches(":disabled")&&o.push(t),l(null!==(a=t.shadowRoot)&&void 0!==a?a:t,o)}const p=t=>t instanceof HTMLInputElement&&"radio"===t.type&&""!==t.name?t:null;function m(t){const i=[];return l(t,i),function(t){const i=[];for(const o of t){const t=p(o);if(null===t)continue;const e=i.find((([i])=>i.name===t.name&&i.form===t.form&&i.getRootNode()===t.getRootNode()));e?e.push(t):i.push([t])}const o=new Set(i.map((t=>{var i;return null!==(i=t.find((t=>t.checked)))&&void 0!==i?i:t[0]})));return t.filter((t=>null===p(t)||o.has(t)))}(i.filter((t=>{if("function"==typeof t.checkVisibility)return t.checkVisibility({checkVisibilityCSS:!0});const i=window.getComputedStyle(t);return"none"!==i.display&&"hidden"!==i.visibility})))}function u(t,i){for(let o=i;o;o=o instanceof ShadowRoot?o.host:o.parentNode)if(o===t)return!0;return!1}const f=new Map;let b=0;function v(t){return!!t.querySelector("[data-pds-popover-open]")||Array.from(t.querySelectorAll("*")).some((t=>!!t.shadowRoot&&v(t.shadowRoot)))}function g(){var t;let i=document.activeElement;for(;null===(t=null==i?void 0:i.shadowRoot)||void 0===t?void 0:t.activeElement;)i=i.shadowRoot.activeElement;return i}const k=t(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.pdsModalOpen=o(this,"pdsModalOpen",7),this.pdsModalClose=o(this,"pdsModalClose",7),this.focusableElements=[],this.backdropDismiss=!0,this.open=!1,this.size="md",this.scrollable=!0,this.disableTopLayer=!1,this.disableInitialFocus=!1,this.focusableElementsArray=[],this.handleCancel=t=>{if(t.preventDefault(),!this.open)return;const i=this.innermostOpenModal(),o=i&&u(this.el,i)?i:this.el;o.backdropDismiss&&o.hideModal()},this.handleBackdropClick=t=>{this.backdropDismiss&&this.open&&t.target===this.modalRef&&(t.stopPropagation(),this.innermostOpenModal()===this.el&&this.hideModal())},this.handleKeyDown=t=>{var i,o,e,s;if(this.open){if("Escape"===t.key){const n=t;if(!("__pdsActiveElementAtEscape"in n)){const o=document.activeElement;n.__pdsActiveElementAtEscape=o,n.__pdsDeepActiveElementAtEscape=g();const e=null!==(i=null==o?void 0:o.closest("dialog"))&&void 0!==i?i:null;n.__pdsTopLayerDialogAtEscape=e,n.__pdsTopLayerDialogWasModalAtEscape=!(!e||!e.matches(":modal")),n.__pdsEscapeHandledInside=t.defaultPrevented,n.__pdsInnermostModalAtEscape=this.innermostOpenModal()}if(n.__pdsEscapeHandledInside)return;const a=n.__pdsActiveElementAtEscape;if(this.disableTopLayer&&a&&a!==document.body&&!u(this.el,null!==(o=n.__pdsDeepActiveElementAtEscape)&&void 0!==o?o:a)&&this.isStackedAboveOverlay(a,null!==(e=n.__pdsTopLayerDialogAtEscape)&&void 0!==e?e:null,null!==(s=n.__pdsTopLayerDialogWasModalAtEscape)&&void 0!==s&&s))return;if(this.modalRef&&v(this.modalRef))return;return t.preventDefault(),void(this.backdropDismiss&&n.__pdsInnermostModalAtEscape===this.el&&this.hideModal())}if("Tab"===t.key){if(this.disableTopLayer)return;if(t.defaultPrevented)return;const i=g();if(!i||this.modalDialogAbove(i))return;if(this.updateFocusableElements(),0===this.focusableElements.length)return;const o=this.focusableElements[0],e=this.focusableElements[this.focusableElements.length-1],s=this.stopIndex(i),n=s===this.focusableElements.length-1;t.shiftKey&&0===s?(t.preventDefault(),this.focusElement(e)):!t.shiftKey&&n&&(t.preventDefault(),this.focusElement(o))}}}}componentWillLoad(){this.warnOnInvalidSize()}sizeChanged(){this.warnOnInvalidSize()}componentDidLoad(){this.modalRef=this.el.querySelector(".pds-modal__backdrop"),this.open&&this.showModal()}componentDidRender(){a(this.el.querySelector(".pds-modal"),"dialog.pds-modal__backdrop",".pds-modal")}connectedCallback(){document.addEventListener("keydown",this.handleKeyDown),this.open&&!f.has(this.el)&&f.set(this.el,++b)}disconnectedCallback(){document.removeEventListener("keydown",this.handleKeyDown),f.delete(this.el)}handleOpenChange(t){t?this.showModal():this.hideModal()}updateFocusableElements(){this.modalRef&&(this.focusableElements=m(this.modalRef))}setInitialFocus(){0!==this.focusableElements.length&&this.focusElement(this.focusableElements[0])}focusElement(t){null==t||t.focus()}async showModal(){var t;if(this.modalRef)try{this.modalRef.open||(this.previousActiveElement=document.activeElement),this.disableTopLayer?this.modalRef.show():this.modalRef.showModal(),this.open=!0,f.has(this.el)||f.set(this.el,++b);const o=null!==(t=f.get(this.el))&&void 0!==t?t:0;setTimeout((()=>{var t,e;if(this.updateFocusableElements(),Array.from(f).some((([t,i])=>i>o&&t!==this.el&&(u(this.el,t)||!t.disableTopLayer||this.disableTopLayer))))this.pdsModalOpen.emit();else{if(this.disableInitialFocus){const o=document.activeElement;null!==o&&o!==document.body&&!(null===(t=this.modalRef)||void 0===t?void 0:t.contains(o))||(this.previousActiveElement!==document.body&&"function"==typeof(null===(e=this.previousActiveElement)||void 0===e?void 0:e.focus)?this.previousActiveElement.focus():o instanceof i&&o.blur())}else this.setInitialFocus();this.pdsModalOpen.emit()}}),100)}catch(t){console.error("Failed to show modal:",t)}}async hideModal(){var t;if(this.modalRef)try{const i=document.activeElement,o=null!==i&&i!==document.body&&!this.modalRef.contains(i);if(this.modalRef.close(),this.open=!1,f.delete(this.el),!o){const i=this.previousActiveElement;i&&i!==document.body&&i.isConnected&&(null===(t=i.focus)||void 0===t||t.call(i));const o=g();i&&i!==document.body&&u(i,o)&&!u(this.el,o)||this.focusTopModal()}this.pdsModalClose.emit()}catch(t){console.error("Failed to hide modal:",t)}}focusTopModal(){var t;const i=this.innermostOpenModal(),o=null==i?void 0:i.querySelector(".pds-modal__backdrop");o&&(n("dialog:modal",o)||u(i,this.el))&&(null===(t=m(o).find((t=>!u(this.el,t))))||void 0===t||t.focus())}getBackdropZIndex(t){const i=t.querySelector(".pds-modal__backdrop"),o=i?parseInt(getComputedStyle(i).zIndex,10):-1;return Number.isNaN(o)?0:o}isStackedAboveOverlay(t,i,o){if(i&&i!==this.modalRef&&o&&!u(i,this.el))return!0;const e=this.getBackdropZIndex(this.el);let s=t;for(;s&&s!==document.body;){const t=getComputedStyle(s),i=parseInt(t.zIndex,10);if("static"!==t.position&&!isNaN(i)&&i>e)return!0;s=s.parentElement}return!1}innermostOpenModal(){const t=Array.from(f.keys()).filter((t=>t.isConnected)),i=t.filter((i=>!t.some((t=>t!==i&&u(i,t))))),o=[...i].sort(((t,i)=>function(t,i){for(let o=t;o;o=o.getRootNode().host)for(let t=i;t;t=t.getRootNode().host)if(o.getRootNode()===t.getRootNode())return!!(o.compareDocumentPosition(t)&Node.DOCUMENT_POSITION_FOLLOWING);return!1}(t,i)?-1:1)),e=t=>{var i;const e=t.querySelector(".pds-modal__backdrop"),s=e?n("dialog:modal",e):null,a=null==s?void 0:s.closest("pds-modal");return[s?1:0,s&&null!==(i=a&&f.get(a))&&void 0!==i?i:0,this.getBackdropZIndex(t),o.indexOf(t)]};let s=null,a=[-1,-1,-1,-1];for(const t of i){const i=e(t),o=i.findIndex(((t,i)=>t!==a[i]));o>=0&&i[o]>a[o]&&(s=t,a=i)}return s}modalDialogAbove(t){var o;for(let e=n("dialog[open]",t);e instanceof i;){if(e===this.modalRef)return!1;if(e.matches(":modal"))return!0;e=n("dialog[open]",null!==(o=e.parentElement)&&void 0!==o?o:e.getRootNode().host)}return!1}stopIndex(t){const i=this.focusableElements.indexOf(t);if(i>=0)return i;for(let i=this.focusableElements.length-1;i>=0;i--)if(u(this.focusableElements[i],t))return i;return-1}resolveSize(){var t;const i=(null!==(t=this.size)&&void 0!==t?t:"").trim()||"md";return d.includes(i)?[i]:/^[a-z0-9.%+\-*/(), ]+$/i.test(o=i)&&/\d/.test(o)&&("undefined"==typeof CSS||CSS.supports("max-width",o))?["custom",i]:[void 0];var o}warnOnInvalidSize(){void 0===this.resolveSize()[0]&&console.warn(`pds-modal: invalid size "${String(this.size).slice(0,50)}", using md`)}render(){const[t="md",i]=this.resolveSize();return e("dialog",{key:"0a3ea92246b5ae704bc7dcbadf4f4e0d5a54e9e6",class:{"pds-modal__backdrop":!0,open:this.open},"aria-modal":this.disableTopLayer?"false":"true","aria-labelledby":`${this.componentId}-heading`,onClick:this.handleBackdropClick,onCancel:this.handleCancel},e("div",{key:"a38029c2284ed345bec2ce7638fc3415818cd609",class:{"pds-modal":!0,[`pds-modal--${t}`]:!0,"pds-modal--scrollable":this.scrollable},style:void 0!==i?{"--pds-modal-max-width":i}:void 0,part:"modal"},e("slot",{key:"396da81af42685f5c083f853afa207a6844e444e"})))}get el(){return this}static get watchers(){return{size:[{sizeChanged:0}],open:[{handleOpenChange:0}]}}static get style(){return'.pds-modal__backdrop{-ms-flex-align:start;align-items:flex-start;background-color:rgba(0, 0, 0, 0.4);border:0;display:-ms-flexbox;display:flex;height:100%;inset:0;-ms-flex-pack:center;justify-content:center;margin:0;max-height:100%;max-width:100%;opacity:0;padding:0;position:fixed;-webkit-transition:opacity var(--pine-motion-duration-base) var(--pine-motion-easing-in), visibility var(--pine-motion-duration-base) var(--pine-motion-easing-in);transition:opacity var(--pine-motion-duration-base) var(--pine-motion-easing-in), visibility var(--pine-motion-duration-base) var(--pine-motion-easing-in);visibility:hidden;width:100%;z-index:var(--pine-z-index-modal)}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}}pds-modal .pds-modal__backdrop{z-index:var(--pine-z-index-priority)}.pds-modal__backdrop::-webkit-backdrop{background:transparent}.pds-modal__backdrop::-ms-backdrop{background:transparent}.pds-modal__backdrop::backdrop{background:transparent}.pds-modal__backdrop[aria-modal=false]{overflow:auto;-ms-scroll-chaining:none;overscroll-behavior:contain}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop[aria-modal=false]{-webkit-backdrop-filter:none;backdrop-filter:none}.pds-modal__backdrop[aria-modal=false]::before{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);content:"";inset:0;position:fixed;z-index:-1}}.pds-modal__backdrop.open{opacity:1;-webkit-transition-timing-function:var(--pine-motion-easing-out);transition-timing-function:var(--pine-motion-easing-out);visibility:visible}.pds-modal{background:var(--pine-color-background-overlay);border-radius:var(--pine-dimension-sm);-webkit-box-shadow:var(--pine-box-shadow-400);box-shadow:var(--pine-box-shadow-400);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:var(--pine-dimension-md);max-height:none;width:100%}.pds-modal.pds-modal--scrollable{max-height:calc(100vh - (5vh + 96px))}@supports (height: 100dvh){.pds-modal.pds-modal--scrollable{max-height:calc(100dvh - (5dvh + 96px))}}@media (min-width: 992px){.pds-modal{-webkit-margin-before:6vh;margin-block-start:6vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:6dvh;margin-block-start:6dvh}}}@media (min-width: 1200px){.pds-modal{-webkit-margin-before:8vh;margin-block-start:8vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:8dvh;margin-block-start:8dvh}}}.pds-modal--sm{max-width:520px}.pds-modal--md{max-width:700px}.pds-modal--lg{max-width:900px}.pds-modal--custom{max-width:var(--pds-modal-max-width, 700px)}.pds-modal--fullscreen{border-radius:0;height:100%;margin:0;max-height:100vh;max-width:100%}@supports (height: 100dvh){.pds-modal--fullscreen{max-height:100dvh}}.pds-modal--fullscreen.pds-modal--scrollable{max-height:100vh}@supports (height: 100dvh){.pds-modal--fullscreen.pds-modal--scrollable{max-height:100dvh}}.pds-modal--fullscreen .pds-modal-content{-ms-flex:1;flex:1}.pds-modal--scrollable pds-modal-content{-webkit-border-after:1px solid transparent;border-block-end:1px solid transparent;-webkit-border-before:1px solid transparent;border-block-start:1px solid transparent;overflow-y:auto}.pds-modal:not(.pds-modal--scrollable) pds-modal-content{overflow-y:visible}'}},[260,"pds-modal",{backdropDismiss:[4,"backdrop-dismiss"],componentId:[1,"component-id"],open:[1028],size:[1],scrollable:[4],disableTopLayer:[4,"disable-top-layer"],disableInitialFocus:[4,"disable-initial-focus"],focusableElementsArray:[32],showModal:[64],hideModal:[64]},void 0,{size:[{sizeChanged:0}],open:[{handleOpenChange:0}]}]);function x(){"undefined"!=typeof customElements&&["pds-modal"].forEach((t=>{"pds-modal"===t&&(customElements.get(s(t))||customElements.define(s(t),k))}))}export{k as P,x as d}
|
|
1
|
+
import{proxyCustomElement as t,HTMLElement as i,createEvent as o,h as s,transformTag as e}from"@stencil/core/internal/client";import{c as d}from"./closest.js";import{t as a}from"./tabbable.js";import{u as n}from"./reconnected-content.js";const l=["sm","md","lg","fullscreen"];function r(t,i){for(let o=i;o;o=o instanceof ShadowRoot?o.host:o.parentNode)if(o===t)return!0;return!1}const h=new Map;let p=0;function c(t){return!!t.querySelector("[data-pds-popover-open]")||Array.from(t.querySelectorAll("*")).some((t=>!!t.shadowRoot&&c(t.shadowRoot)))}function m(){var t;let i=document.activeElement;for(;null===(t=null==i?void 0:i.shadowRoot)||void 0===t?void 0:t.activeElement;)i=i.shadowRoot.activeElement;return i}const u=t(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.pdsModalOpen=o(this,"pdsModalOpen",7),this.pdsModalClose=o(this,"pdsModalClose",7),this.focusableElements=[],this.backdropDismiss=!0,this.open=!1,this.size="md",this.scrollable=!0,this.disableTopLayer=!1,this.disableInitialFocus=!1,this.focusableElementsArray=[],this.handleCancel=t=>{if(t.preventDefault(),!this.open)return;const i=this.innermostOpenModal(),o=i&&r(this.el,i)?i:this.el;o.backdropDismiss&&o.hideModal()},this.handleBackdropClick=t=>{this.backdropDismiss&&this.open&&t.target===this.modalRef&&(t.stopPropagation(),this.innermostOpenModal()===this.el&&this.hideModal())},this.handleKeyDown=t=>{var i,o,s,e;if(this.open){if("Escape"===t.key){const d=t;if(!("__pdsActiveElementAtEscape"in d)){const o=document.activeElement;d.__pdsActiveElementAtEscape=o,d.__pdsDeepActiveElementAtEscape=m();const s=null!==(i=null==o?void 0:o.closest("dialog"))&&void 0!==i?i:null;d.__pdsTopLayerDialogAtEscape=s,d.__pdsTopLayerDialogWasModalAtEscape=!(!s||!s.matches(":modal")),d.__pdsEscapeHandledInside=t.defaultPrevented,d.__pdsInnermostModalAtEscape=this.innermostOpenModal()}if(d.__pdsEscapeHandledInside)return;const a=d.__pdsActiveElementAtEscape;if(this.disableTopLayer&&a&&a!==document.body&&!r(this.el,null!==(o=d.__pdsDeepActiveElementAtEscape)&&void 0!==o?o:a)&&this.isStackedAboveOverlay(a,null!==(s=d.__pdsTopLayerDialogAtEscape)&&void 0!==s?s:null,null!==(e=d.__pdsTopLayerDialogWasModalAtEscape)&&void 0!==e&&e))return;if(this.modalRef&&c(this.modalRef))return;return t.preventDefault(),void(this.backdropDismiss&&d.__pdsInnermostModalAtEscape===this.el&&this.hideModal())}if("Tab"===t.key){if(this.disableTopLayer)return;if(t.defaultPrevented)return;const i=m();if(!i||this.modalDialogAbove(i))return;if(this.updateFocusableElements(),0===this.focusableElements.length)return;const o=this.focusableElements[0],s=this.focusableElements[this.focusableElements.length-1],e=this.stopIndex(i),d=e===this.focusableElements.length-1;t.shiftKey&&0===e?(t.preventDefault(),this.focusElement(s)):!t.shiftKey&&d&&(t.preventDefault(),this.focusElement(o))}}}}componentWillLoad(){this.warnOnInvalidSize()}sizeChanged(){this.warnOnInvalidSize()}componentDidLoad(){this.modalRef=this.el.querySelector(".pds-modal__backdrop"),this.open&&this.showModal()}componentDidRender(){n(this.el.querySelector(".pds-modal"),"dialog.pds-modal__backdrop",".pds-modal")}connectedCallback(){document.addEventListener("keydown",this.handleKeyDown),this.open&&!h.has(this.el)&&h.set(this.el,++p)}disconnectedCallback(){document.removeEventListener("keydown",this.handleKeyDown),h.delete(this.el)}handleOpenChange(t){t?this.showModal():this.hideModal()}updateFocusableElements(){this.modalRef&&(this.focusableElements=a(this.modalRef))}setInitialFocus(){0!==this.focusableElements.length&&this.focusElement(this.focusableElements[0])}focusElement(t){null==t||t.focus()}async showModal(){var t;if(this.modalRef)try{this.modalRef.open||(this.previousActiveElement=document.activeElement),this.disableTopLayer?this.modalRef.show():this.modalRef.showModal(),this.open=!0,h.has(this.el)||h.set(this.el,++p);const o=null!==(t=h.get(this.el))&&void 0!==t?t:0;setTimeout((()=>{var t,s;if(this.updateFocusableElements(),Array.from(h).some((([t,i])=>i>o&&t!==this.el&&(r(this.el,t)||!t.disableTopLayer||this.disableTopLayer))))this.pdsModalOpen.emit();else{if(this.disableInitialFocus){const o=document.activeElement;null!==o&&o!==document.body&&!(null===(t=this.modalRef)||void 0===t?void 0:t.contains(o))||(this.previousActiveElement!==document.body&&"function"==typeof(null===(s=this.previousActiveElement)||void 0===s?void 0:s.focus)?this.previousActiveElement.focus():o instanceof i&&o.blur())}else this.setInitialFocus();this.pdsModalOpen.emit()}}),100)}catch(t){console.error("Failed to show modal:",t)}}async hideModal(){var t;if(this.modalRef)try{const i=document.activeElement,o=null!==i&&i!==document.body&&!this.modalRef.contains(i);if(this.modalRef.close(),this.open=!1,h.delete(this.el),!o){const i=this.previousActiveElement;i&&i!==document.body&&i.isConnected&&(null===(t=i.focus)||void 0===t||t.call(i));const o=m();i&&i!==document.body&&r(i,o)&&!r(this.el,o)||this.focusTopModal()}this.pdsModalClose.emit()}catch(t){console.error("Failed to hide modal:",t)}}focusTopModal(){var t;const i=this.innermostOpenModal(),o=null==i?void 0:i.querySelector(".pds-modal__backdrop");o&&(d("dialog:modal",o)||r(i,this.el))&&(null===(t=a(o).find((t=>!r(this.el,t))))||void 0===t||t.focus())}getBackdropZIndex(t){const i=t.querySelector(".pds-modal__backdrop"),o=i?parseInt(getComputedStyle(i).zIndex,10):-1;return Number.isNaN(o)?0:o}isStackedAboveOverlay(t,i,o){if(i&&i!==this.modalRef&&o&&!r(i,this.el))return!0;const s=this.getBackdropZIndex(this.el);let e=t;for(;e&&e!==document.body;){const t=getComputedStyle(e),i=parseInt(t.zIndex,10);if("static"!==t.position&&!isNaN(i)&&i>s)return!0;e=e.parentElement}return!1}innermostOpenModal(){const t=Array.from(h.keys()).filter((t=>t.isConnected)),i=t.filter((i=>!t.some((t=>t!==i&&r(i,t))))),o=[...i].sort(((t,i)=>function(t,i){for(let o=t;o;o=o.getRootNode().host)for(let t=i;t;t=t.getRootNode().host)if(o.getRootNode()===t.getRootNode())return!!(o.compareDocumentPosition(t)&Node.DOCUMENT_POSITION_FOLLOWING);return!1}(t,i)?-1:1)),s=t=>{var i;const s=t.querySelector(".pds-modal__backdrop"),e=s?d("dialog:modal",s):null,a=null==e?void 0:e.closest("pds-modal");return[e?1:0,e&&null!==(i=a&&h.get(a))&&void 0!==i?i:0,this.getBackdropZIndex(t),o.indexOf(t)]};let e=null,a=[-1,-1,-1,-1];for(const t of i){const i=s(t),o=i.findIndex(((t,i)=>t!==a[i]));o>=0&&i[o]>a[o]&&(e=t,a=i)}return e}modalDialogAbove(t){var o;for(let s=d("dialog[open]",t);s instanceof i;){if(s===this.modalRef)return!1;if(s.matches(":modal"))return!0;s=d("dialog[open]",null!==(o=s.parentElement)&&void 0!==o?o:s.getRootNode().host)}return!1}stopIndex(t){const i=this.focusableElements.indexOf(t);if(i>=0)return i;for(let i=this.focusableElements.length-1;i>=0;i--)if(r(this.focusableElements[i],t))return i;return-1}resolveSize(){var t;const i=(null!==(t=this.size)&&void 0!==t?t:"").trim()||"md";return l.includes(i)?[i]:/^[a-z0-9.%+\-*/(), ]+$/i.test(o=i)&&/\d/.test(o)&&("undefined"==typeof CSS||CSS.supports("max-width",o))?["custom",i]:[void 0];var o}warnOnInvalidSize(){void 0===this.resolveSize()[0]&&console.warn(`pds-modal: invalid size "${String(this.size).slice(0,50)}", using md`)}render(){const[t="md",i]=this.resolveSize();return s("dialog",{key:"cd574868a46b69185e2058c60374dbec34677732",class:{"pds-modal__backdrop":!0,open:this.open},"aria-modal":this.disableTopLayer?"false":"true","aria-labelledby":`${this.componentId}-heading`,onClick:this.handleBackdropClick,onCancel:this.handleCancel},s("div",{key:"8c50fb4810b4bb07d62348fed44df30b14a52acd",class:{"pds-modal":!0,[`pds-modal--${t}`]:!0,"pds-modal--scrollable":this.scrollable},style:void 0!==i?{"--pds-modal-max-width":i}:void 0,part:"modal"},s("slot",{key:"25a71c95dfeff4648a28edef21bf510b1743ed7c"})))}get el(){return this}static get watchers(){return{size:[{sizeChanged:0}],open:[{handleOpenChange:0}]}}static get style(){return'.pds-modal__backdrop{-ms-flex-align:start;align-items:flex-start;background-color:rgba(0, 0, 0, 0.4);border:0;display:-ms-flexbox;display:flex;height:100%;inset:0;-ms-flex-pack:center;justify-content:center;margin:0;max-height:100%;max-width:100%;opacity:0;padding:0;position:fixed;-webkit-transition:opacity var(--pine-motion-duration-base) var(--pine-motion-easing-in), visibility var(--pine-motion-duration-base) var(--pine-motion-easing-in);transition:opacity var(--pine-motion-duration-base) var(--pine-motion-easing-in), visibility var(--pine-motion-duration-base) var(--pine-motion-easing-in);visibility:hidden;width:100%;z-index:var(--pine-z-index-modal)}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}}pds-modal pds-modal .pds-modal__backdrop{z-index:var(--pine-z-index-priority)}.pds-modal__backdrop::-webkit-backdrop{background:transparent}.pds-modal__backdrop::-ms-backdrop{background:transparent}.pds-modal__backdrop::backdrop{background:transparent}.pds-modal__backdrop[aria-modal=false]{overflow:auto;-ms-scroll-chaining:none;overscroll-behavior:contain}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-modal__backdrop[aria-modal=false]{-webkit-backdrop-filter:none;backdrop-filter:none}.pds-modal__backdrop[aria-modal=false]::before{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);content:"";inset:0;position:fixed;z-index:-1}}.pds-modal__backdrop.open{opacity:1;-webkit-transition-timing-function:var(--pine-motion-easing-out);transition-timing-function:var(--pine-motion-easing-out);visibility:visible}.pds-modal{background:var(--pine-color-background-overlay);border-radius:var(--pine-dimension-sm);-webkit-box-shadow:var(--pine-box-shadow-400);box-shadow:var(--pine-box-shadow-400);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:var(--pine-dimension-md);max-height:none;width:100%}.pds-modal.pds-modal--scrollable{max-height:calc(100vh - (5vh + 96px))}@supports (height: 100dvh){.pds-modal.pds-modal--scrollable{max-height:calc(100dvh - (5dvh + 96px))}}@media (min-width: 992px){.pds-modal{-webkit-margin-before:6vh;margin-block-start:6vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:6dvh;margin-block-start:6dvh}}}@media (min-width: 1200px){.pds-modal{-webkit-margin-before:8vh;margin-block-start:8vh}@supports (height: 100dvh){.pds-modal{-webkit-margin-before:8dvh;margin-block-start:8dvh}}}.pds-modal--sm{max-width:520px}.pds-modal--md{max-width:700px}.pds-modal--lg{max-width:900px}.pds-modal--custom{max-width:var(--pds-modal-max-width, 700px)}.pds-modal--fullscreen{border-radius:0;height:100%;margin:0;max-height:100vh;max-width:100%}@supports (height: 100dvh){.pds-modal--fullscreen{max-height:100dvh}}.pds-modal--fullscreen.pds-modal--scrollable{max-height:100vh}@supports (height: 100dvh){.pds-modal--fullscreen.pds-modal--scrollable{max-height:100dvh}}.pds-modal--fullscreen .pds-modal-content{-ms-flex:1;flex:1}.pds-modal--scrollable pds-modal-content{-webkit-border-after:1px solid transparent;border-block-end:1px solid transparent;-webkit-border-before:1px solid transparent;border-block-start:1px solid transparent;overflow-y:auto}.pds-modal:not(.pds-modal--scrollable) pds-modal-content{overflow-y:visible}'}},[260,"pds-modal",{backdropDismiss:[4,"backdrop-dismiss"],componentId:[1,"component-id"],open:[1028],size:[1],scrollable:[4],disableTopLayer:[4,"disable-top-layer"],disableInitialFocus:[4,"disable-initial-focus"],focusableElementsArray:[32],showModal:[64],hideModal:[64]},void 0,{size:[{sizeChanged:0}],open:[{handleOpenChange:0}]}]);function b(){"undefined"!=typeof customElements&&["pds-modal"].forEach((t=>{"pds-modal"===t&&(customElements.get(e(t))||customElements.define(e(t),u))}))}export{u as P,b as d}
|