@pine-ds/core 3.9.0 → 3.11.0
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.map +1 -1
- package/components/form.js.map +1 -1
- package/components/index.js +1 -1
- package/components/index2.js +1 -1
- package/components/index2.js.map +1 -1
- package/components/mock-pds-modal.js +5 -3
- package/components/mock-pds-modal.js.map +1 -1
- package/components/pds-accordion.js +5 -3
- package/components/pds-accordion.js.map +1 -1
- package/components/pds-alert.js +5 -3
- package/components/pds-alert.js.map +1 -1
- package/components/pds-avatar.js +5 -3
- package/components/pds-avatar.js.map +1 -1
- package/components/pds-box2.js +5 -3
- package/components/pds-box2.js.map +1 -1
- package/components/pds-button2.js +15 -4
- package/components/pds-button2.js.map +1 -1
- package/components/pds-checkbox2.js +5 -3
- package/components/pds-checkbox2.js.map +1 -1
- package/components/pds-chip2.js +5 -3
- package/components/pds-chip2.js.map +1 -1
- package/components/pds-combobox.js +5 -3
- package/components/pds-combobox.js.map +1 -1
- package/components/pds-copytext.js +5 -3
- package/components/pds-copytext.js.map +1 -1
- package/components/pds-divider.js +5 -3
- package/components/pds-divider.js.map +1 -1
- package/components/pds-dropdown-menu-item.js +5 -3
- package/components/pds-dropdown-menu-item.js.map +1 -1
- package/components/pds-dropdown-menu-separator.js +5 -3
- package/components/pds-dropdown-menu-separator.js.map +1 -1
- package/components/pds-dropdown-menu.js +6 -4
- package/components/pds-dropdown-menu.js.map +1 -1
- package/components/pds-filter.js +5 -3
- package/components/pds-filter.js.map +1 -1
- package/components/pds-filters.js +5 -3
- package/components/pds-filters.js.map +1 -1
- package/components/pds-icon2.js +5 -3
- package/components/pds-icon2.js.map +1 -1
- package/components/pds-image.js +5 -3
- package/components/pds-image.js.map +1 -1
- package/components/pds-input.js +5 -3
- package/components/pds-input.js.map +1 -1
- package/components/pds-link2.js +5 -3
- package/components/pds-link2.js.map +1 -1
- package/components/pds-loader2.js +5 -3
- package/components/pds-loader2.js.map +1 -1
- package/components/pds-modal-content.js +7 -5
- package/components/pds-modal-content.js.map +1 -1
- package/components/pds-modal-footer.js +5 -3
- package/components/pds-modal-footer.js.map +1 -1
- package/components/pds-modal-header.js +5 -3
- package/components/pds-modal-header.js.map +1 -1
- package/components/pds-modal.js +5 -3
- package/components/pds-modal.js.map +1 -1
- package/components/pds-popover.js +437 -90
- package/components/pds-popover.js.map +1 -1
- package/components/pds-progress.js +6 -4
- package/components/pds-progress.js.map +1 -1
- package/components/pds-property.js +6 -4
- package/components/pds-property.js.map +1 -1
- package/components/pds-radio.js +8 -6
- package/components/pds-radio.js.map +1 -1
- package/components/pds-row.js +6 -4
- package/components/pds-row.js.map +1 -1
- package/components/pds-select.js +6 -4
- package/components/pds-select.js.map +1 -1
- package/components/pds-sortable-item.js +6 -4
- package/components/pds-sortable-item.js.map +1 -1
- package/components/pds-sortable.js +6 -4
- package/components/pds-sortable.js.map +1 -1
- package/components/pds-switch.js +8 -6
- package/components/pds-switch.js.map +1 -1
- package/components/pds-tab.js +8 -6
- package/components/pds-tab.js.map +1 -1
- package/components/pds-table-body.js +6 -4
- package/components/pds-table-body.js.map +1 -1
- package/components/pds-table-cell2.js +7 -5
- package/components/pds-table-cell2.js.map +1 -1
- package/components/pds-table-head-cell2.js +7 -5
- package/components/pds-table-head-cell2.js.map +1 -1
- package/components/pds-table-head.js +6 -4
- package/components/pds-table-head.js.map +1 -1
- package/components/pds-table-row.js +6 -4
- package/components/pds-table-row.js.map +1 -1
- package/components/pds-table.js +5 -3
- package/components/pds-table.js.map +1 -1
- package/components/pds-tabpanel.js +6 -4
- package/components/pds-tabpanel.js.map +1 -1
- package/components/pds-tabs.js +6 -4
- package/components/pds-tabs.js.map +1 -1
- package/components/pds-text2.js +6 -4
- package/components/pds-text2.js.map +1 -1
- package/components/pds-textarea.js +9 -7
- package/components/pds-textarea.js.map +1 -1
- package/components/pds-toast.js +8 -6
- package/components/pds-toast.js.map +1 -1
- package/components/pds-tooltip.js +7 -5
- package/components/pds-tooltip.js.map +1 -1
- package/components/utils.js.map +1 -1
- package/dist/cjs/attributes-oNMnBEnP.js.map +1 -1
- package/dist/cjs/form-hmpgbT1I.js.map +1 -1
- package/dist/cjs/{index-DDTyvZD7.js → index-2Lf0E1JO.js} +505 -182
- package/dist/cjs/index-2Lf0E1JO.js.map +1 -0
- package/dist/cjs/{index-DtnvzYhe.js → index-BIrlTMGo.js} +3 -3
- package/dist/cjs/index-BIrlTMGo.js.map +1 -0
- package/dist/cjs/index.cjs.js +0 -4
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/loader.cjs.js +3 -6
- package/dist/cjs/loader.cjs.js.map +1 -1
- package/dist/cjs/mock-pds-modal.cjs.entry.js +1 -3
- package/dist/cjs/pds-accordion.cjs.entry.js +2 -4
- package/dist/cjs/pds-alert.cjs.entry.js +1 -3
- package/dist/cjs/pds-avatar.cjs.entry.js +2 -4
- package/dist/cjs/pds-box.cjs.entry.js +1 -3
- package/dist/cjs/pds-button.cjs.entry.js +11 -5
- package/dist/cjs/pds-button.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-checkbox.cjs.entry.js +2 -4
- package/dist/cjs/pds-chip.cjs.entry.js +2 -4
- package/dist/cjs/pds-combobox.cjs.entry.js +1 -3
- package/dist/cjs/pds-copytext.cjs.entry.js +2 -4
- package/dist/cjs/pds-divider.cjs.entry.js +1 -3
- package/dist/cjs/pds-dropdown-menu-item.cjs.entry.js +1 -3
- package/dist/cjs/pds-dropdown-menu-separator.cjs.entry.js +1 -3
- package/dist/cjs/pds-dropdown-menu.cjs.entry.js +2 -4
- package/dist/cjs/pds-dropdown-menu.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-filter.cjs.entry.js +2 -4
- package/dist/cjs/pds-filters.cjs.entry.js +1 -3
- package/dist/cjs/pds-icon.cjs.entry.js +1 -3
- package/dist/cjs/pds-icon.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-image.cjs.entry.js +1 -3
- package/dist/cjs/pds-input.cjs.entry.js +2 -4
- package/dist/cjs/pds-link.cjs.entry.js +2 -4
- package/dist/cjs/pds-loader.cjs.entry.js +1 -3
- package/dist/cjs/pds-modal-content.cjs.entry.js +3 -5
- package/dist/cjs/pds-modal-content.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-modal-footer.cjs.entry.js +1 -3
- package/dist/cjs/pds-modal-header.cjs.entry.js +1 -3
- package/dist/cjs/pds-modal.cjs.entry.js +1 -3
- package/dist/cjs/pds-popover.cjs.entry.js +432 -88
- package/dist/cjs/pds-popover.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-progress.cjs.entry.js +2 -4
- package/dist/cjs/pds-property.cjs.entry.js +2 -4
- package/dist/cjs/pds-radio.cjs.entry.js +5 -7
- package/dist/cjs/pds-row.cjs.entry.js +2 -4
- package/dist/cjs/pds-select.cjs.entry.js +3 -5
- package/dist/cjs/pds-sortable-item.cjs.entry.js +3 -5
- package/dist/cjs/pds-sortable.cjs.entry.js +2 -4
- package/dist/cjs/pds-sortable.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-switch.cjs.entry.js +5 -7
- package/dist/cjs/pds-tab.cjs.entry.js +4 -6
- package/dist/cjs/pds-table-body.cjs.entry.js +2 -4
- package/dist/cjs/pds-table-cell.cjs.entry.js +3 -5
- package/dist/cjs/pds-table-head-cell.cjs.entry.js +4 -6
- package/dist/cjs/pds-table-head.cjs.entry.js +2 -4
- package/dist/cjs/pds-table-row.cjs.entry.js +2 -4
- package/dist/cjs/pds-table.cjs.entry.js +1 -3
- package/dist/cjs/pds-tabpanel.cjs.entry.js +2 -4
- package/dist/cjs/pds-tabs.cjs.entry.js +2 -4
- package/dist/cjs/pds-text.cjs.entry.js +2 -4
- package/dist/cjs/pds-textarea.cjs.entry.js +6 -8
- package/dist/cjs/pds-toast.cjs.entry.js +4 -6
- package/dist/cjs/pds-tooltip.cjs.entry.js +3 -5
- package/dist/cjs/pine-core.cjs.js +4 -7
- package/dist/cjs/pine-core.cjs.js.map +1 -1
- package/dist/cjs/utils-7jx8T2mW.js.map +1 -1
- package/dist/collection/collection-manifest.json +2 -2
- package/dist/collection/components/pds-accordion/pds-accordion.js +3 -3
- package/dist/collection/components/pds-alert/pds-alert.js +7 -7
- package/dist/collection/components/pds-avatar/pds-avatar.js +8 -8
- package/dist/collection/components/pds-box/pds-box.js +235 -235
- package/dist/collection/components/pds-button/pds-button.css +38 -0
- package/dist/collection/components/pds-button/pds-button.js +50 -19
- package/dist/collection/components/pds-button/pds-button.js.map +1 -1
- package/dist/collection/components/pds-button/stories/pds-button.stories.js +109 -55
- package/dist/collection/components/pds-checkbox/pds-checkbox.js +23 -23
- package/dist/collection/components/pds-chip/pds-chip.js +8 -8
- package/dist/collection/components/pds-combobox/pds-combobox.js +26 -26
- package/dist/collection/components/pds-copytext/pds-copytext.js +7 -7
- package/dist/collection/components/pds-divider/pds-divider.js +5 -5
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu-item/pds-dropdown-menu-item.js +6 -6
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu-separator/pds-dropdown-menu-separator.js +3 -3
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu.js +4 -4
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu.js.map +1 -1
- package/dist/collection/components/pds-filters/pds-filter/pds-filter.js +7 -7
- package/dist/collection/components/pds-filters/pds-filters.js +2 -2
- package/dist/collection/components/pds-image/pds-image.js +14 -14
- package/dist/collection/components/pds-input/pds-input.js +44 -44
- package/dist/collection/components/pds-link/pds-link.js +9 -9
- package/dist/collection/components/pds-loader/pds-loader.js +4 -4
- package/dist/collection/components/pds-modal/pds-modal-content/pds-modal-content.js +3 -3
- package/dist/collection/components/pds-modal/pds-modal-content/pds-modal-content.js.map +1 -1
- package/dist/collection/components/pds-modal/pds-modal.js +6 -6
- package/dist/collection/components/pds-modal/test/mock-pds-modal.js +6 -6
- package/dist/collection/components/pds-popover/pds-popover.css +4 -31
- package/dist/collection/components/pds-popover/pds-popover.js +440 -130
- package/dist/collection/components/pds-popover/pds-popover.js.map +1 -1
- package/dist/collection/components/pds-popover/popover-interface.js.map +1 -1
- package/dist/collection/components/pds-popover/stories/pds-popover.stories.js +66 -18
- package/dist/collection/components/pds-progress/pds-progress.js +10 -10
- package/dist/collection/components/pds-property/pds-property.js +4 -4
- package/dist/collection/components/pds-radio/pds-radio.js +22 -22
- package/dist/collection/components/pds-row/pds-row.js +17 -17
- package/dist/collection/components/pds-select/pds-select.js +24 -24
- package/dist/collection/components/pds-sortable/pds-sortable-item/pds-sortable-item.js +5 -5
- package/dist/collection/components/pds-sortable/pds-sortable.js +6 -6
- package/dist/collection/components/pds-sortable/pds-sortable.js.map +1 -1
- package/dist/collection/components/pds-switch/pds-switch.js +21 -21
- 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 +6 -6
- package/dist/collection/components/pds-table/pds-table-head/pds-table-head.js +5 -5
- package/dist/collection/components/pds-table/pds-table-head-cell/pds-table-head-cell.js +6 -6
- package/dist/collection/components/pds-table/pds-table-row/pds-table-row.js +5 -5
- package/dist/collection/components/pds-table/pds-table.js +10 -10
- package/dist/collection/components/pds-tabs/pds-tab/pds-tab.js +12 -12
- package/dist/collection/components/pds-tabs/pds-tabpanel/pds-tabpanel.js +8 -8
- package/dist/collection/components/pds-tabs/pds-tabs.js +11 -11
- package/dist/collection/components/pds-text/pds-text.js +18 -18
- package/dist/collection/components/pds-textarea/pds-textarea.js +32 -32
- package/dist/collection/components/pds-toast/pds-toast.js +10 -10
- package/dist/collection/components/pds-tooltip/pds-tooltip.js +11 -11
- package/dist/collection/utils/attributes.js.map +1 -1
- package/dist/collection/utils/form.js.map +1 -1
- package/dist/collection/utils/utils.js.map +1 -1
- package/dist/docs.json +242 -79
- package/dist/esm/attributes-C0M1gTKv.js.map +1 -1
- package/dist/esm/form-DwjNklzi.js.map +1 -1
- package/dist/esm/{index-Bf1dou5H.js → index-Bh07GI-d.js} +505 -183
- package/dist/esm/index-Bh07GI-d.js.map +1 -0
- package/dist/esm/{index-D4zJBIgl.js → index-CvGEHHLR.js} +3 -3
- package/dist/esm/index-CvGEHHLR.js.map +1 -0
- package/dist/esm/index.js +1 -3
- package/dist/esm/loader.js +3 -6
- package/dist/esm/loader.js.map +1 -1
- package/dist/esm/mock-pds-modal.entry.js +1 -3
- package/dist/esm/pds-accordion.entry.js +2 -4
- package/dist/esm/pds-alert.entry.js +1 -3
- package/dist/esm/pds-avatar.entry.js +2 -4
- package/dist/esm/pds-box.entry.js +1 -3
- package/dist/esm/pds-button.entry.js +11 -5
- package/dist/esm/pds-button.entry.js.map +1 -1
- package/dist/esm/pds-checkbox.entry.js +2 -4
- package/dist/esm/pds-chip.entry.js +2 -4
- package/dist/esm/pds-combobox.entry.js +1 -3
- package/dist/esm/pds-copytext.entry.js +2 -4
- package/dist/esm/pds-divider.entry.js +1 -3
- package/dist/esm/pds-dropdown-menu-item.entry.js +1 -3
- package/dist/esm/pds-dropdown-menu-separator.entry.js +1 -3
- package/dist/esm/pds-dropdown-menu.entry.js +2 -4
- package/dist/esm/pds-dropdown-menu.entry.js.map +1 -1
- package/dist/esm/pds-filter.entry.js +2 -4
- package/dist/esm/pds-filters.entry.js +1 -3
- package/dist/esm/pds-icon.entry.js +1 -3
- package/dist/esm/pds-icon.entry.js.map +1 -1
- package/dist/esm/pds-image.entry.js +1 -3
- package/dist/esm/pds-input.entry.js +2 -4
- package/dist/esm/pds-link.entry.js +2 -4
- package/dist/esm/pds-loader.entry.js +1 -3
- package/dist/esm/pds-modal-content.entry.js +3 -5
- package/dist/esm/pds-modal-content.entry.js.map +1 -1
- package/dist/esm/pds-modal-footer.entry.js +1 -3
- package/dist/esm/pds-modal-header.entry.js +1 -3
- package/dist/esm/pds-modal.entry.js +1 -3
- package/dist/esm/pds-popover.entry.js +432 -88
- package/dist/esm/pds-popover.entry.js.map +1 -1
- package/dist/esm/pds-progress.entry.js +2 -4
- package/dist/esm/pds-property.entry.js +2 -4
- package/dist/esm/pds-radio.entry.js +5 -7
- package/dist/esm/pds-row.entry.js +2 -4
- package/dist/esm/pds-select.entry.js +3 -5
- package/dist/esm/pds-sortable-item.entry.js +3 -5
- package/dist/esm/pds-sortable.entry.js +2 -4
- package/dist/esm/pds-sortable.entry.js.map +1 -1
- package/dist/esm/pds-switch.entry.js +5 -7
- package/dist/esm/pds-tab.entry.js +4 -6
- package/dist/esm/pds-table-body.entry.js +2 -4
- package/dist/esm/pds-table-cell.entry.js +3 -5
- package/dist/esm/pds-table-head-cell.entry.js +4 -6
- package/dist/esm/pds-table-head.entry.js +2 -4
- package/dist/esm/pds-table-row.entry.js +2 -4
- package/dist/esm/pds-table.entry.js +1 -3
- package/dist/esm/pds-tabpanel.entry.js +2 -4
- package/dist/esm/pds-tabs.entry.js +2 -4
- package/dist/esm/pds-text.entry.js +2 -4
- package/dist/esm/pds-textarea.entry.js +6 -8
- package/dist/esm/pds-toast.entry.js +4 -6
- package/dist/esm/pds-tooltip.entry.js +3 -5
- package/dist/esm/pine-core.js +4 -7
- package/dist/esm/pine-core.js.map +1 -1
- package/dist/esm/utils-tJa4KYNO.js.map +1 -1
- package/dist/esm-es5/attributes-C0M1gTKv.js.map +1 -1
- package/dist/esm-es5/form-DwjNklzi.js.map +1 -1
- package/dist/esm-es5/index-Bh07GI-d.js +3 -0
- package/dist/esm-es5/index-Bh07GI-d.js.map +1 -0
- package/dist/esm-es5/{index-D4zJBIgl.js → index-CvGEHHLR.js} +1 -1
- package/dist/esm-es5/index-CvGEHHLR.js.map +1 -0
- package/dist/esm-es5/index.js +1 -1
- package/dist/esm-es5/loader.js +1 -1
- package/dist/esm-es5/loader.js.map +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-button.entry.js.map +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-copytext.entry.js +1 -1
- package/dist/esm-es5/pds-divider.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-dropdown-menu.entry.js.map +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-icon.entry.js.map +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-content.entry.js.map +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-popover.entry.js +1 -1
- package/dist/esm-es5/pds-popover.entry.js.map +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.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-sortable.entry.js.map +1 -1
- 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/pine-core.js.map +1 -1
- package/dist/esm-es5/utils-tJa4KYNO.js.map +1 -1
- package/dist/pine-core/index.esm.js +1 -1
- package/dist/pine-core/loader.esm.js.map +1 -1
- package/dist/pine-core/{p-9766923f.entry.js → p-01c4eac9.entry.js} +2 -2
- package/dist/pine-core/p-01c4eac9.entry.js.map +1 -0
- package/dist/pine-core/{p-4ef17b95.system.entry.js → p-052eedc2.system.entry.js} +2 -2
- package/dist/pine-core/p-052eedc2.system.entry.js.map +1 -0
- package/dist/pine-core/p-06f164fe.system.entry.js +2 -0
- package/dist/pine-core/p-06f164fe.system.entry.js.map +1 -0
- package/dist/pine-core/{p-c2599425.entry.js → p-0837abe8.entry.js} +2 -2
- package/dist/pine-core/p-0837abe8.entry.js.map +1 -0
- package/dist/pine-core/p-09cab3b5.system.entry.js +2 -0
- package/dist/pine-core/p-09cab3b5.system.entry.js.map +1 -0
- package/dist/pine-core/p-105951b7.system.entry.js +2 -0
- package/dist/pine-core/p-105951b7.system.entry.js.map +1 -0
- package/dist/pine-core/{p-307f415a.system.entry.js → p-168b5a5b.system.entry.js} +2 -2
- package/dist/pine-core/p-168b5a5b.system.entry.js.map +1 -0
- package/dist/pine-core/{p-04ad9d2c.system.entry.js → p-198fce07.system.entry.js} +2 -2
- package/dist/pine-core/p-198fce07.system.entry.js.map +1 -0
- package/dist/pine-core/{p-88773b86.entry.js → p-19e6bce5.entry.js} +2 -2
- package/dist/pine-core/p-19e6bce5.entry.js.map +1 -0
- package/dist/pine-core/{p-DW3lkDNz.system.js.map → p-1W8OgEyK.system.js.map} +1 -1
- package/dist/pine-core/{p-ee583234.system.entry.js → p-1ab0a7b1.system.entry.js} +2 -2
- package/dist/pine-core/p-1ab0a7b1.system.entry.js.map +1 -0
- package/dist/pine-core/{p-da1fb45d.system.entry.js → p-1ac7cb0f.system.entry.js} +2 -2
- package/dist/pine-core/p-1ac7cb0f.system.entry.js.map +1 -0
- package/dist/pine-core/{p-1039e8e9.entry.js → p-1b299f58.entry.js} +2 -2
- package/dist/pine-core/p-1b299f58.entry.js.map +1 -0
- package/dist/pine-core/{p-f61ee383.system.entry.js → p-1bf75b30.system.entry.js} +2 -2
- package/dist/pine-core/p-1bf75b30.system.entry.js.map +1 -0
- package/dist/pine-core/{p-dace69e7.system.entry.js → p-1c03ac40.system.entry.js} +2 -2
- package/dist/pine-core/p-1c03ac40.system.entry.js.map +1 -0
- package/dist/pine-core/p-1d3c4f2d.entry.js +2 -0
- package/dist/pine-core/p-1d3c4f2d.entry.js.map +1 -0
- package/dist/pine-core/{p-8ff41ba8.entry.js → p-1d83f560.entry.js} +2 -2
- package/dist/pine-core/p-1d83f560.entry.js.map +1 -0
- package/dist/pine-core/{p-90e83476.system.entry.js → p-1f28575b.system.entry.js} +2 -2
- package/dist/pine-core/p-1f28575b.system.entry.js.map +1 -0
- package/dist/pine-core/{p-e18c3044.entry.js → p-1fbe221a.entry.js} +2 -2
- package/dist/pine-core/p-1fbe221a.entry.js.map +1 -0
- package/dist/pine-core/{p-e692908e.entry.js → p-239cbdb2.entry.js} +2 -2
- package/dist/pine-core/p-239cbdb2.entry.js.map +1 -0
- package/dist/pine-core/{p-a9cfaa1f.entry.js → p-2551ed1a.entry.js} +2 -2
- package/dist/pine-core/p-2551ed1a.entry.js.map +1 -0
- package/dist/pine-core/p-285bc185.entry.js +2 -0
- package/dist/pine-core/p-285bc185.entry.js.map +1 -0
- package/dist/pine-core/{p-ozqEY4Zc.system.js.map → p-2NVJY0Vc.system.js.map} +1 -1
- package/dist/pine-core/{p-f25274c9.entry.js → p-2c3ede8e.entry.js} +2 -2
- package/dist/pine-core/p-2c3ede8e.entry.js.map +1 -0
- package/dist/pine-core/p-2f5d1411.entry.js +2 -0
- package/dist/pine-core/p-2f5d1411.entry.js.map +1 -0
- package/dist/pine-core/p-37795a28.system.entry.js +2 -0
- package/dist/pine-core/p-37795a28.system.entry.js.map +1 -0
- package/dist/pine-core/{p-c55fc47e.entry.js → p-3900b6f6.entry.js} +2 -2
- package/dist/pine-core/p-3900b6f6.entry.js.map +1 -0
- package/dist/pine-core/p-43b758af.entry.js +2 -0
- package/dist/pine-core/p-43b758af.entry.js.map +1 -0
- package/dist/pine-core/{p-378df5eb.system.entry.js → p-4792d0c8.system.entry.js} +2 -2
- package/dist/pine-core/p-4792d0c8.system.entry.js.map +1 -0
- package/dist/pine-core/{p-3cc92094.system.entry.js → p-49c5234f.system.entry.js} +2 -2
- package/dist/pine-core/p-49c5234f.system.entry.js.map +1 -0
- package/dist/pine-core/p-4HGk7WFM.system.js.map +1 -0
- package/dist/pine-core/p-4ea1a4fb.entry.js +2 -0
- package/dist/pine-core/p-4ea1a4fb.entry.js.map +1 -0
- package/dist/pine-core/{p-0486ecc6.system.entry.js → p-4fe28624.system.entry.js} +2 -2
- package/dist/pine-core/p-4fe28624.system.entry.js.map +1 -0
- package/dist/pine-core/{p-c44d3551.entry.js → p-51e0ea73.entry.js} +2 -2
- package/dist/pine-core/p-51e0ea73.entry.js.map +1 -0
- package/dist/pine-core/{p-b9e12535.system.entry.js → p-53645ec6.system.entry.js} +2 -2
- package/dist/pine-core/p-53645ec6.system.entry.js.map +1 -0
- package/dist/pine-core/{p-b9aafec7.system.entry.js → p-54e04c59.system.entry.js} +2 -2
- package/dist/pine-core/p-54e04c59.system.entry.js.map +1 -0
- package/dist/pine-core/p-5565ee41.system.entry.js +2 -0
- package/dist/pine-core/p-5565ee41.system.entry.js.map +1 -0
- package/dist/pine-core/{p-972a511a.entry.js → p-55d120d1.entry.js} +2 -2
- package/dist/pine-core/p-55d120d1.entry.js.map +1 -0
- package/dist/pine-core/p-5a332f9e.system.entry.js +2 -0
- package/dist/pine-core/p-5a332f9e.system.entry.js.map +1 -0
- package/dist/pine-core/{p-4802f8de.system.entry.js → p-5a94e426.system.entry.js} +2 -2
- package/dist/pine-core/p-5a94e426.system.entry.js.map +1 -0
- package/dist/pine-core/{p-bc637bed.system.entry.js → p-5d379706.system.entry.js} +2 -2
- package/dist/pine-core/p-5d379706.system.entry.js.map +1 -0
- package/dist/pine-core/p-5e1804a3.system.entry.js +2 -0
- package/dist/pine-core/p-5e1804a3.system.entry.js.map +1 -0
- package/dist/pine-core/{p-b23dd01c.entry.js → p-6046e0b1.entry.js} +2 -2
- package/dist/pine-core/p-6046e0b1.entry.js.map +1 -0
- package/dist/pine-core/{p-e702a8dc.system.entry.js → p-619a6667.system.entry.js} +2 -2
- package/dist/pine-core/p-619a6667.system.entry.js.map +1 -0
- package/dist/pine-core/{p-544fea4c.system.entry.js → p-6448829b.system.entry.js} +3 -3
- package/dist/pine-core/p-6448829b.system.entry.js.map +1 -0
- package/dist/pine-core/{p-c3f84df8.system.entry.js → p-6d9ca1ff.system.entry.js} +2 -2
- package/dist/pine-core/p-6d9ca1ff.system.entry.js.map +1 -0
- package/dist/pine-core/{p-6381a811.system.entry.js → p-6e4be339.system.entry.js} +3 -3
- package/dist/pine-core/p-6e4be339.system.entry.js.map +1 -0
- package/dist/pine-core/{p-85c41629.entry.js → p-6f5dfd01.entry.js} +2 -2
- package/dist/pine-core/p-6f5dfd01.entry.js.map +1 -0
- package/dist/pine-core/p-730ea265.entry.js +2 -0
- package/dist/pine-core/p-730ea265.entry.js.map +1 -0
- package/dist/pine-core/{p-100de2b7.entry.js → p-73a6c002.entry.js} +2 -2
- package/dist/pine-core/p-73a6c002.entry.js.map +1 -0
- package/dist/pine-core/{p-9fbb9f0e.system.entry.js → p-7a12238d.system.entry.js} +2 -2
- package/dist/pine-core/p-7a12238d.system.entry.js.map +1 -0
- package/dist/pine-core/{p-f5d78141.entry.js → p-7a63e1ec.entry.js} +2 -2
- package/dist/pine-core/p-7a63e1ec.entry.js.map +1 -0
- package/dist/pine-core/p-7bbe537d.system.entry.js +2 -0
- package/dist/pine-core/p-7bbe537d.system.entry.js.map +1 -0
- package/dist/pine-core/{p-96a60a99.entry.js → p-7c2381c5.entry.js} +2 -2
- package/dist/pine-core/p-7c2381c5.entry.js.map +1 -0
- package/dist/pine-core/p-7c69ca77.entry.js +2 -0
- package/dist/pine-core/p-7c69ca77.entry.js.map +1 -0
- package/dist/pine-core/p-7ccd095b.entry.js +2 -0
- package/dist/pine-core/p-7ccd095b.entry.js.map +1 -0
- package/dist/pine-core/{p-6d48604a.system.entry.js → p-818dd3d8.system.entry.js} +2 -2
- package/dist/pine-core/p-818dd3d8.system.entry.js.map +1 -0
- package/dist/pine-core/{p-f8e1545e.entry.js → p-841a6445.entry.js} +2 -2
- package/dist/pine-core/p-841a6445.entry.js.map +1 -0
- package/dist/pine-core/{p-5ac7af9e.entry.js → p-996072ce.entry.js} +2 -2
- package/dist/pine-core/p-996072ce.entry.js.map +1 -0
- package/dist/pine-core/{p-5b1d6cd2.entry.js → p-9f7318d7.entry.js} +2 -2
- package/dist/pine-core/p-9f7318d7.entry.js.map +1 -0
- package/dist/pine-core/{p-BG99uNIQ.system.js → p-B7x-ddku.system.js} +1 -1
- package/dist/pine-core/p-B7x-ddku.system.js.map +1 -0
- package/dist/pine-core/{p-CTkQ9Pq-.system.js.map → p-B8ftT2uA.system.js.map} +1 -1
- package/dist/pine-core/{p-Cl47ROcT.system.js.map → p-B9oQYxlC.system.js.map} +1 -1
- package/dist/pine-core/{p-DmdrRtWG.system.js.map → p-BCCWozKV.system.js.map} +1 -1
- package/dist/pine-core/{p-BbhWs2I3.system.js.map → p-BCGaZxvq.system.js.map} +1 -1
- package/dist/pine-core/{p-Cid662up.system.js.map → p-BF6EelyL.system.js.map} +1 -1
- package/dist/pine-core/p-BG6uGRQj.system.js.map +1 -1
- package/dist/pine-core/p-BHavepTY.system.js.map +1 -1
- package/dist/pine-core/{p-BJ3oNLWN.system.js.map → p-BLpHPllL.system.js.map} +1 -1
- package/dist/pine-core/{p-Dw7zXw_6.system.js.map → p-BMv60T1z.system.js.map} +1 -1
- package/dist/pine-core/p-BOmQOnQe.system.js +1 -1
- package/dist/pine-core/{p-k9JOparb.system.js.map → p-BeaxER_z.system.js.map} +1 -1
- package/dist/pine-core/p-Bh07GI-d.js +3 -0
- package/dist/pine-core/p-Bh07GI-d.js.map +1 -0
- package/dist/pine-core/p-BhQhw0S3.system.js.map +1 -1
- package/dist/pine-core/{p-4xv5UVkx.system.js.map → p-Bhj5-yqf.system.js.map} +1 -1
- package/dist/pine-core/{p-C2W-sHx5.system.js.map → p-BhoJR5O9.system.js.map} +1 -1
- package/dist/pine-core/{p-CQwYeJqz.system.js.map → p-Bj1vPZM7.system.js.map} +1 -1
- package/dist/pine-core/{p-BRIdBthP.system.js.map → p-BnrgLbVq.system.js.map} +1 -1
- package/dist/pine-core/{p-B8JDvOCM.system.js.map → p-Btz7Q5Hx.system.js.map} +1 -1
- package/dist/pine-core/{p-BDK6YCRb.system.js.map → p-BvtgWXBT.system.js.map} +1 -1
- package/dist/pine-core/{p-qQVNUF7F.system.js.map → p-BynWb21G.system.js.map} +1 -1
- package/dist/pine-core/p-C0M1gTKv.js.map +1 -1
- package/dist/pine-core/{p-CG2PKUWT.system.js.map → p-C2AG52JP.system.js.map} +1 -1
- package/dist/pine-core/{p-kcOuXqWo.system.js.map → p-C4UrydrO.system.js.map} +1 -1
- package/dist/pine-core/{p-Bkfqi7zE.system.js.map → p-C6_QgODF.system.js.map} +1 -1
- package/dist/pine-core/{p-K3LH4gRE.system.js.map → p-CIoeutZO.system.js.map} +1 -1
- package/dist/pine-core/{p-DiWDsjtE.system.js.map → p-CNOoGfj8.system.js.map} +1 -1
- package/dist/pine-core/{p-ByzULH8m.system.js.map → p-CSVIgMVz.system.js.map} +1 -1
- package/dist/pine-core/{p-CCQd5PVN.system.js.map → p-CVjjaBaW.system.js.map} +1 -1
- package/dist/pine-core/{p-CSa_b_JX.system.js.map → p-CVoRTJJv.system.js.map} +1 -1
- package/dist/pine-core/p-CZsWy9_t.system.js +3 -0
- package/dist/pine-core/p-CZsWy9_t.system.js.map +1 -0
- package/dist/pine-core/{p-BEgEi4w5.system.js.map → p-CbrMVAcu.system.js.map} +1 -1
- package/dist/pine-core/{p-ch9PI3Vl.system.js.map → p-ChQGk39M.system.js.map} +1 -1
- package/dist/pine-core/{p-M-zMP2QX.system.js.map → p-CoBzoZzZ.system.js.map} +1 -1
- package/dist/pine-core/{p-CEUtKiTx.system.js.map → p-CpcN1meO.system.js.map} +1 -1
- package/dist/pine-core/{p-DJ7iTbji.system.js.map → p-CqtdHqyo.system.js.map} +1 -1
- package/dist/pine-core/{p-DExobiBX.system.js.map → p-CrpTd0PB.system.js.map} +1 -1
- package/dist/pine-core/{p-rnM09DN4.system.js.map → p-CtiVxXhr.system.js.map} +1 -1
- package/dist/pine-core/p-CuF_eckL.system.js.map +1 -0
- package/dist/pine-core/p-Cua7cmvq.system.js +2 -0
- package/dist/pine-core/{p-BPjnTOEL.system.js.map → p-Cua7cmvq.system.js.map} +1 -1
- package/dist/pine-core/{p-D4zJBIgl.js → p-CvGEHHLR.js} +1 -1
- package/dist/pine-core/p-CvGEHHLR.js.map +1 -0
- package/dist/pine-core/{p-CfyzuJNE.system.js.map → p-D-CArvsF.system.js.map} +1 -1
- package/dist/pine-core/{p-CdcQ02yR.system.js.map → p-D5MCs-6L.system.js.map} +1 -1
- package/dist/pine-core/{p-BLC5kuro.system.js.map → p-DCLLstWD.system.js.map} +1 -1
- package/dist/pine-core/p-DCiTnlD3.system.js.map +1 -0
- package/dist/pine-core/{p-BILpjGVZ.system.js.map → p-DPmRw4fA.system.js.map} +1 -1
- package/dist/pine-core/{p-D52TGCLt.system.js.map → p-DTMMULoz.system.js.map} +1 -1
- package/dist/pine-core/{p-B-Doh1Wu.system.js.map → p-DvfECQRp.system.js.map} +1 -1
- package/dist/pine-core/p-DwjNklzi.js.map +1 -1
- package/dist/pine-core/{p-DhDw2HLE.system.js.map → p-O9Boj8Mc.system.js.map} +1 -1
- package/dist/pine-core/p-YWpyar7R.system.js +2 -0
- package/dist/pine-core/p-YWpyar7R.system.js.map +1 -0
- package/dist/pine-core/{p-ae2d59cd.entry.js → p-a1ddcc69.entry.js} +2 -2
- package/dist/pine-core/p-a1ddcc69.entry.js.map +1 -0
- package/dist/pine-core/p-a2c309fa.system.entry.js +2 -0
- package/dist/pine-core/p-a2c309fa.system.entry.js.map +1 -0
- package/dist/pine-core/p-a3503596.entry.js +2 -0
- package/dist/pine-core/p-a3503596.entry.js.map +1 -0
- package/dist/pine-core/{p-96c27dba.entry.js → p-a494b7d1.entry.js} +2 -2
- package/dist/pine-core/p-a494b7d1.entry.js.map +1 -0
- package/dist/pine-core/{p-7af21e83.system.entry.js → p-ab34c977.system.entry.js} +2 -2
- package/dist/pine-core/p-ab34c977.system.entry.js.map +1 -0
- package/dist/pine-core/{p-86263a62.entry.js → p-ac5eb57e.entry.js} +2 -2
- package/dist/pine-core/p-ac5eb57e.entry.js.map +1 -0
- package/dist/pine-core/{p-db12273e.system.entry.js → p-b07bb58f.system.entry.js} +2 -2
- package/dist/pine-core/p-b07bb58f.system.entry.js.map +1 -0
- package/dist/pine-core/p-b0948892.system.entry.js +2 -0
- package/dist/pine-core/p-b0948892.system.entry.js.map +1 -0
- package/dist/pine-core/{p-9ac84e63.entry.js → p-b151a37d.entry.js} +3 -3
- package/dist/pine-core/p-b151a37d.entry.js.map +1 -0
- package/dist/pine-core/{p-18179981.system.entry.js → p-ba1a4643.system.entry.js} +2 -2
- package/dist/pine-core/p-ba1a4643.system.entry.js.map +1 -0
- package/dist/pine-core/p-ba609b1e.entry.js +2 -0
- package/dist/pine-core/p-ba609b1e.entry.js.map +1 -0
- package/dist/pine-core/{p-cffc98ae.entry.js → p-bd11961c.entry.js} +3 -3
- package/dist/pine-core/p-bd11961c.entry.js.map +1 -0
- package/dist/pine-core/{p-2b102034.system.entry.js → p-c28c54c2.system.entry.js} +2 -2
- package/dist/pine-core/p-c28c54c2.system.entry.js.map +1 -0
- package/dist/pine-core/{p-25cb810d.entry.js → p-c7175497.entry.js} +2 -2
- package/dist/pine-core/p-c7175497.entry.js.map +1 -0
- package/dist/pine-core/{p-9b335a9f.entry.js → p-d0efe5e1.entry.js} +2 -2
- package/dist/pine-core/p-d0efe5e1.entry.js.map +1 -0
- package/dist/pine-core/{p-07e129db.entry.js → p-d6cff25a.entry.js} +2 -2
- package/dist/pine-core/p-d6cff25a.entry.js.map +1 -0
- package/dist/pine-core/{p-Dq7Wu9rr.system.js.map → p-dWrReyPk.system.js.map} +1 -1
- package/dist/pine-core/{p-725c350c.entry.js → p-da23f4cf.entry.js} +2 -2
- package/dist/pine-core/p-da23f4cf.entry.js.map +1 -0
- package/dist/pine-core/{p-f911dde3.system.entry.js → p-db3b827e.system.entry.js} +2 -2
- package/dist/pine-core/p-db3b827e.system.entry.js.map +1 -0
- package/dist/pine-core/{p-1009009c.entry.js → p-de4ebf0b.entry.js} +2 -2
- package/dist/pine-core/p-de4ebf0b.entry.js.map +1 -0
- package/dist/pine-core/{p-97299c83.system.entry.js → p-e22c4870.system.entry.js} +2 -2
- package/dist/pine-core/p-e22c4870.system.entry.js.map +1 -0
- package/dist/pine-core/{p-6c36cab6.entry.js → p-e25d2c53.entry.js} +2 -2
- package/dist/pine-core/p-e25d2c53.entry.js.map +1 -0
- package/dist/pine-core/{p-2fd7f74e.entry.js → p-e47fbd71.entry.js} +2 -2
- package/dist/pine-core/p-e47fbd71.entry.js.map +1 -0
- package/dist/pine-core/{p-f0e44449.system.entry.js → p-e715d22e.system.entry.js} +2 -2
- package/dist/pine-core/p-e715d22e.system.entry.js.map +1 -0
- package/dist/pine-core/p-e948a514.system.entry.js +2 -0
- package/dist/pine-core/p-e948a514.system.entry.js.map +1 -0
- package/dist/pine-core/p-eb3fe298.system.entry.js +2 -0
- package/dist/pine-core/p-eb3fe298.system.entry.js.map +1 -0
- package/dist/pine-core/{p-9c1bfa68.entry.js → p-ed214033.entry.js} +2 -2
- package/dist/pine-core/p-ed214033.entry.js.map +1 -0
- package/dist/pine-core/p-ee6c07d6.system.entry.js +2 -0
- package/dist/pine-core/p-ee6c07d6.system.entry.js.map +1 -0
- package/dist/pine-core/p-f2344cb2.system.entry.js +2 -0
- package/dist/pine-core/p-f2344cb2.system.entry.js.map +1 -0
- package/dist/pine-core/{p-d61f3ab0.system.entry.js → p-f38e87ad.system.entry.js} +2 -2
- package/dist/pine-core/p-f38e87ad.system.entry.js.map +1 -0
- package/dist/pine-core/{p-00f6f3af.system.entry.js → p-f70327de.system.entry.js} +2 -2
- package/dist/pine-core/p-f70327de.system.entry.js.map +1 -0
- package/dist/pine-core/{p-2c407961.entry.js → p-f72243c4.entry.js} +2 -2
- package/dist/pine-core/p-f72243c4.entry.js.map +1 -0
- package/dist/pine-core/p-f74bcc1d.entry.js +2 -0
- package/dist/pine-core/p-f74bcc1d.entry.js.map +1 -0
- package/dist/pine-core/{p-1a7cd7a6.entry.js → p-fb877b9d.entry.js} +2 -2
- package/dist/pine-core/p-fb877b9d.entry.js.map +1 -0
- package/dist/pine-core/{p-1c32ffb3.entry.js → p-fbf10641.entry.js} +2 -2
- package/dist/pine-core/p-fbf10641.entry.js.map +1 -0
- package/dist/pine-core/{p-538b3902.system.entry.js → p-fcde1f61.system.entry.js} +2 -2
- package/dist/pine-core/p-fcde1f61.system.entry.js.map +1 -0
- package/dist/pine-core/p-fdf7a1db.system.entry.js +2 -0
- package/dist/pine-core/p-fdf7a1db.system.entry.js.map +1 -0
- package/dist/pine-core/p-fe23aa6f.system.entry.js +2 -0
- package/dist/pine-core/p-fe23aa6f.system.entry.js.map +1 -0
- package/dist/pine-core/{p-DmWU0f_O.system.js.map → p-oqHEiE2W.system.js.map} +1 -1
- package/dist/pine-core/p-pKEraGuG.system.js.map +1 -0
- package/dist/pine-core/{p-CyFXZIZs.system.js.map → p-pStt9pIi.system.js.map} +1 -1
- package/dist/pine-core/p-tJa4KYNO.js.map +1 -1
- package/dist/pine-core/{p-CypP0PZf.system.js.map → p-y8wq27x0.system.js.map} +1 -1
- package/dist/pine-core/{p-hop4Cgg5.system.js.map → p-zZn2-0Xb.system.js.map} +1 -1
- package/dist/pine-core/pds-button.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-dropdown-menu.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-icon.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-modal-content.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-popover.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-sortable.entry.esm.js.map +1 -1
- package/dist/pine-core/pine-core.esm.js +1 -1
- package/dist/pine-core/pine-core.esm.js.map +1 -1
- package/dist/pine-core/pine-core.js +1 -1
- package/dist/types/components/pds-button/pds-button.d.ts +6 -1
- package/dist/types/components/pds-modal/pds-modal-content/pds-modal-content.d.ts +0 -5
- package/dist/types/components/pds-popover/pds-popover.d.ts +113 -10
- package/dist/types/components/pds-popover/popover-interface.d.ts +0 -4
- package/dist/types/components.d.ts +76 -10
- package/dist/types/stencil-public-runtime.d.ts +83 -8
- package/dist/types/utils/attributes.d.ts +2 -2
- package/dist/types/utils/form.d.ts +1 -1
- package/dist/types/utils/utils.d.ts +1 -1
- package/hydrate/index.d.ts +40 -24
- package/hydrate/index.js +1619 -451
- package/hydrate/index.mjs +1618 -452
- package/package.json +12 -12
- package/dist/cjs/app-globals-V2Kpy_OQ.js +0 -8
- package/dist/cjs/app-globals-V2Kpy_OQ.js.map +0 -1
- package/dist/cjs/index-DDTyvZD7.js.map +0 -1
- package/dist/cjs/index-DtnvzYhe.js.map +0 -1
- package/dist/cjs/mock-pds-modal.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-accordion.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-alert.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-avatar.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-box.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-button.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-checkbox.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-chip.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-combobox.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-copytext.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-divider.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-dropdown-menu-item.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-dropdown-menu-separator.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-dropdown-menu.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-filter.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-filters.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-icon.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-image.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-input.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-link.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-loader.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-modal-content.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-modal-footer.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-modal-header.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-modal.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-popover.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-progress.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-property.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-radio.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-row.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-select.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-sortable-item.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-sortable.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-switch.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-tab.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-table-body.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-table-cell.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-table-head-cell.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-table-head.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-table-row.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-table.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-tabpanel.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-tabs.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-text.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-textarea.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-toast.cjs.entry.js.map +0 -1
- package/dist/cjs/pds-tooltip.cjs.entry.js.map +0 -1
- package/dist/esm/app-globals-DQuL1Twl.js +0 -6
- package/dist/esm/app-globals-DQuL1Twl.js.map +0 -1
- package/dist/esm/index-Bf1dou5H.js.map +0 -1
- package/dist/esm/index-D4zJBIgl.js.map +0 -1
- package/dist/esm-es5/app-globals-DQuL1Twl.js +0 -2
- package/dist/esm-es5/app-globals-DQuL1Twl.js.map +0 -1
- package/dist/esm-es5/index-Bf1dou5H.js +0 -3
- package/dist/esm-es5/index-Bf1dou5H.js.map +0 -1
- package/dist/esm-es5/index-D4zJBIgl.js.map +0 -1
- package/dist/pine-core/p-00f6f3af.system.entry.js.map +0 -1
- package/dist/pine-core/p-0486ecc6.system.entry.js.map +0 -1
- package/dist/pine-core/p-04ad9d2c.system.entry.js.map +0 -1
- package/dist/pine-core/p-07e129db.entry.js.map +0 -1
- package/dist/pine-core/p-0b593535.system.entry.js +0 -2
- package/dist/pine-core/p-0b593535.system.entry.js.map +0 -1
- package/dist/pine-core/p-1009009c.entry.js.map +0 -1
- package/dist/pine-core/p-100de2b7.entry.js.map +0 -1
- package/dist/pine-core/p-1039e8e9.entry.js.map +0 -1
- package/dist/pine-core/p-18179981.system.entry.js.map +0 -1
- package/dist/pine-core/p-1a7cd7a6.entry.js.map +0 -1
- package/dist/pine-core/p-1c32ffb3.entry.js.map +0 -1
- package/dist/pine-core/p-1d127ddc.system.entry.js +0 -2
- package/dist/pine-core/p-1d127ddc.system.entry.js.map +0 -1
- package/dist/pine-core/p-25cb810d.entry.js.map +0 -1
- package/dist/pine-core/p-2b102034.system.entry.js.map +0 -1
- package/dist/pine-core/p-2b12bc55.system.entry.js +0 -2
- package/dist/pine-core/p-2b12bc55.system.entry.js.map +0 -1
- package/dist/pine-core/p-2c407961.entry.js.map +0 -1
- package/dist/pine-core/p-2efc646c.system.entry.js +0 -2
- package/dist/pine-core/p-2efc646c.system.entry.js.map +0 -1
- package/dist/pine-core/p-2fd7f74e.entry.js.map +0 -1
- package/dist/pine-core/p-302849cf.system.entry.js +0 -2
- package/dist/pine-core/p-302849cf.system.entry.js.map +0 -1
- package/dist/pine-core/p-307f415a.system.entry.js.map +0 -1
- package/dist/pine-core/p-332338ee.entry.js +0 -2
- package/dist/pine-core/p-332338ee.entry.js.map +0 -1
- package/dist/pine-core/p-378df5eb.system.entry.js.map +0 -1
- package/dist/pine-core/p-3cc92094.system.entry.js.map +0 -1
- package/dist/pine-core/p-41abb654.entry.js +0 -2
- package/dist/pine-core/p-41abb654.entry.js.map +0 -1
- package/dist/pine-core/p-45d574f1.system.entry.js +0 -2
- package/dist/pine-core/p-45d574f1.system.entry.js.map +0 -1
- package/dist/pine-core/p-4802f8de.system.entry.js.map +0 -1
- package/dist/pine-core/p-4c6ec7c4.entry.js +0 -2
- package/dist/pine-core/p-4c6ec7c4.entry.js.map +0 -1
- package/dist/pine-core/p-4ef17b95.system.entry.js.map +0 -1
- package/dist/pine-core/p-538b3902.system.entry.js.map +0 -1
- package/dist/pine-core/p-544fea4c.system.entry.js.map +0 -1
- package/dist/pine-core/p-5ac7af9e.entry.js.map +0 -1
- package/dist/pine-core/p-5b1d6cd2.entry.js.map +0 -1
- package/dist/pine-core/p-6381a811.system.entry.js.map +0 -1
- package/dist/pine-core/p-6c36cab6.entry.js.map +0 -1
- package/dist/pine-core/p-6d48604a.system.entry.js.map +0 -1
- package/dist/pine-core/p-725c350c.entry.js.map +0 -1
- package/dist/pine-core/p-7792f47d.system.entry.js +0 -2
- package/dist/pine-core/p-7792f47d.system.entry.js.map +0 -1
- package/dist/pine-core/p-7af21e83.system.entry.js.map +0 -1
- package/dist/pine-core/p-81972d0f.entry.js +0 -2
- package/dist/pine-core/p-81972d0f.entry.js.map +0 -1
- package/dist/pine-core/p-81bc089e.entry.js +0 -2
- package/dist/pine-core/p-81bc089e.entry.js.map +0 -1
- package/dist/pine-core/p-85c41629.entry.js.map +0 -1
- package/dist/pine-core/p-86263a62.entry.js.map +0 -1
- package/dist/pine-core/p-87ed43d5.entry.js +0 -2
- package/dist/pine-core/p-87ed43d5.entry.js.map +0 -1
- package/dist/pine-core/p-88773b86.entry.js.map +0 -1
- package/dist/pine-core/p-8b3f4c31.entry.js +0 -2
- package/dist/pine-core/p-8b3f4c31.entry.js.map +0 -1
- package/dist/pine-core/p-8ff41ba8.entry.js.map +0 -1
- package/dist/pine-core/p-90e83476.system.entry.js.map +0 -1
- package/dist/pine-core/p-96a60a99.entry.js.map +0 -1
- package/dist/pine-core/p-96c27dba.entry.js.map +0 -1
- package/dist/pine-core/p-97299c83.system.entry.js.map +0 -1
- package/dist/pine-core/p-972a511a.entry.js.map +0 -1
- package/dist/pine-core/p-9766923f.entry.js.map +0 -1
- package/dist/pine-core/p-9ac84e63.entry.js.map +0 -1
- package/dist/pine-core/p-9b335a9f.entry.js.map +0 -1
- package/dist/pine-core/p-9c1bfa68.entry.js.map +0 -1
- package/dist/pine-core/p-9c579956.system.entry.js +0 -2
- package/dist/pine-core/p-9c579956.system.entry.js.map +0 -1
- package/dist/pine-core/p-9fbb9f0e.system.entry.js.map +0 -1
- package/dist/pine-core/p-BG99uNIQ.system.js.map +0 -1
- package/dist/pine-core/p-BPjnTOEL.system.js +0 -2
- package/dist/pine-core/p-BbPAtVJG.system.js +0 -2
- package/dist/pine-core/p-BbPAtVJG.system.js.map +0 -1
- package/dist/pine-core/p-Bf1dou5H.js +0 -3
- package/dist/pine-core/p-Bf1dou5H.js.map +0 -1
- package/dist/pine-core/p-CIBXMJd-.system.js.map +0 -1
- package/dist/pine-core/p-Cqzmj3D8.system.js.map +0 -1
- package/dist/pine-core/p-CwNRZQss.system.js.map +0 -1
- package/dist/pine-core/p-Cxvdulqq.system.js +0 -3
- package/dist/pine-core/p-Cxvdulqq.system.js.map +0 -1
- package/dist/pine-core/p-D4zJBIgl.js.map +0 -1
- package/dist/pine-core/p-DCjZr2HA.system.js.map +0 -1
- package/dist/pine-core/p-DQuL1Twl.js +0 -2
- package/dist/pine-core/p-DQuL1Twl.js.map +0 -1
- package/dist/pine-core/p-WWWd_vEd.system.js +0 -2
- package/dist/pine-core/p-WWWd_vEd.system.js.map +0 -1
- package/dist/pine-core/p-a707a7da.system.entry.js +0 -2
- package/dist/pine-core/p-a707a7da.system.entry.js.map +0 -1
- package/dist/pine-core/p-a9cfaa1f.entry.js.map +0 -1
- package/dist/pine-core/p-ae2d59cd.entry.js.map +0 -1
- package/dist/pine-core/p-b23dd01c.entry.js.map +0 -1
- package/dist/pine-core/p-b669e1d9.entry.js +0 -2
- package/dist/pine-core/p-b669e1d9.entry.js.map +0 -1
- package/dist/pine-core/p-b9aafec7.system.entry.js.map +0 -1
- package/dist/pine-core/p-b9e12535.system.entry.js.map +0 -1
- package/dist/pine-core/p-bc2530d7.entry.js +0 -2
- package/dist/pine-core/p-bc2530d7.entry.js.map +0 -1
- package/dist/pine-core/p-bc637bed.system.entry.js.map +0 -1
- package/dist/pine-core/p-c2599425.entry.js.map +0 -1
- package/dist/pine-core/p-c3f84df8.system.entry.js.map +0 -1
- package/dist/pine-core/p-c44d3551.entry.js.map +0 -1
- package/dist/pine-core/p-c55fc47e.entry.js.map +0 -1
- package/dist/pine-core/p-cffc98ae.entry.js.map +0 -1
- package/dist/pine-core/p-d2b15290.system.entry.js +0 -2
- package/dist/pine-core/p-d2b15290.system.entry.js.map +0 -1
- package/dist/pine-core/p-d61f3ab0.system.entry.js.map +0 -1
- package/dist/pine-core/p-da1fb45d.system.entry.js.map +0 -1
- package/dist/pine-core/p-dace69e7.system.entry.js.map +0 -1
- package/dist/pine-core/p-db12273e.system.entry.js.map +0 -1
- package/dist/pine-core/p-e18c3044.entry.js.map +0 -1
- package/dist/pine-core/p-e6085566.system.entry.js +0 -2
- package/dist/pine-core/p-e6085566.system.entry.js.map +0 -1
- package/dist/pine-core/p-e683e197.system.entry.js +0 -2
- package/dist/pine-core/p-e683e197.system.entry.js.map +0 -1
- package/dist/pine-core/p-e692908e.entry.js.map +0 -1
- package/dist/pine-core/p-e6b051e8.system.entry.js +0 -2
- package/dist/pine-core/p-e6b051e8.system.entry.js.map +0 -1
- package/dist/pine-core/p-e702a8dc.system.entry.js.map +0 -1
- package/dist/pine-core/p-ed724664.system.entry.js +0 -2
- package/dist/pine-core/p-ed724664.system.entry.js.map +0 -1
- package/dist/pine-core/p-ed7bea99.system.entry.js +0 -2
- package/dist/pine-core/p-ed7bea99.system.entry.js.map +0 -1
- package/dist/pine-core/p-ee583234.system.entry.js.map +0 -1
- package/dist/pine-core/p-f0e44449.system.entry.js.map +0 -1
- package/dist/pine-core/p-f15cd180.entry.js +0 -2
- package/dist/pine-core/p-f15cd180.entry.js.map +0 -1
- package/dist/pine-core/p-f25274c9.entry.js.map +0 -1
- package/dist/pine-core/p-f5d78141.entry.js.map +0 -1
- package/dist/pine-core/p-f61ee383.system.entry.js.map +0 -1
- package/dist/pine-core/p-f8e1545e.entry.js.map +0 -1
- package/dist/pine-core/p-f911dde3.system.entry.js.map +0 -1
- package/dist/pine-core/p-fc2f3466.system.entry.js +0 -2
- package/dist/pine-core/p-fc2f3466.system.entry.js.map +0 -1
- package/dist/pine-core/p-fe60ee09.entry.js +0 -2
- package/dist/pine-core/p-fe60ee09.entry.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-CfyzuJNE.system.js","sources":["src/global/styles/utils/label.scss?tag=pds-switch&encapsulation=shadow","src/components/pds-switch/pds-switch.scss?tag=pds-switch&encapsulation=shadow","src/components/pds-switch/pds-switch.tsx"],"sourcesContent":[":host {\n display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n label {\n color: var(--pine-color-text-label-readonly);\n }\n}\n\nlabel {\n color: var(--pine-color-text-label);\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n// Need discussions\n --sizing-input-toggle-size: calc(var(--pine-dimension-250) - (var(--pine-dimension-025) * 2));\n --pine-dimension-025: 2px;\n --spacing-message-inline: calc(var(--pine-dimension-450) + var(--pine-dimension-150));\n --number-transition-timing: 0.15s ease-out;\n\n align-items: flex-start;\n color: var(--pine-color-text);\n display: inline-flex;\n flex-flow: row wrap;\n position: relative;\n}\n\n:host(.pds-switch--error) {\n color: var(--pine-color-text-message-danger);\n\n input,\n input:checked,\n input:hover:not(:disabled):not(:checked) {\n background-color: var(--pine-color-danger);\n }\n\n input:focus-visible:not(:disabled):not(:checked) {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n\n label {\n color: var(--color-text-error);\n }\n}\n\n// switch container\ninput {\n appearance: none;\n background: var(--pine-color-neutral);\n border: 0;\n border-radius: var(--pine-dimension-sm);\n cursor: pointer;\n display: inline-block;\n flex-shrink: 0;\n height: var(--pine-dimension-250);\n margin: 0;\n padding: 0;\n position: relative;\n transition: var(--number-transition-timing);\n transition-property: background, border, color;\n width: var(--pine-dimension-450);\n\n // switch toggle\n &::after {\n background: var(--pine-color-secondary);\n border-radius: var(--pine-border-radius-full);\n box-shadow: var(--pine-box-shadow);\n content: \"\";\n display: block;\n height: var(--sizing-input-toggle-size);\n inset-block-start: 50%;\n inset-inline-start: 50%;\n position: absolute;\n transform: translate3d(-100%, -50%, 0);\n transition: transform var(--number-transition-timing);\n width: var(--sizing-input-toggle-size);\n }\n}\n\nlabel {\n display: flex;\n gap: var(--pine-dimension-150);\n\n .pds-switch--error & {\n color: inherit;\n }\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n// Help and error messages\n.pds-switch__message {\n color: var(--pine-color-text-message);\n font: var(--pine-typography-body-sm-medium);\n margin-block-start: var(--pine-dimension-xs);\n margin-inline-start: var(--spacing-message-inline);\n width: 100%;\n\n + .pds-switch__message {\n margin-block-start: var(--spacing-message-inline);\n }\n}\n\n.pds-switch__message--error {\n color: inherit;\n display: flex;\n gap: var(--pine-dimension-2xs);\n\n pds-icon {\n margin-block-start: var(--pine-dimension-025);\n }\n}\n\n// Disabled state\ninput:disabled {\n background-color: var(--pine-color-neutral-disabled);\n cursor: not-allowed;\n\n ~ label {\n cursor: initial;\n }\n\n &:hover::after {\n background-color: var(--pine-color-background-container-disabled);\n }\n\n .pds-switch__message {\n color: initial;\n }\n}\n\n// Hover state\ninput:hover:not(:disabled) {\n background-color: var(--pine-color-neutral-hover);\n}\n\n // Focus state\ninput:focus-visible:not(:disabled) {\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n}\n\n// 'Checked' state\n// switch toggle\ninput:checked::after {\n transform: translate3d(0, -50%, 0);\n}\n\n// switch container\ninput:checked:not(:disabled) {\n background-color: currentColor;\n color: var(--pine-color-accent);\n\n &:hover {\n border-color: currentColor;\n color: var(--pine-color-accent-hover);\n }\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop, Watch } from '@stencil/core';\nimport { assignDescription, messageId, exposeTypeProperty } from '../../utils/form';\nimport { danger } from '@pine-ds/icons/icons';\n\nimport { inheritAriaAttributes } from '@utils/attributes';\nimport type { Attributes } from '@utils/attributes';\n\n@Component({\n tag: 'pds-switch',\n styleUrls: ['../../global/styles/utils/label.scss', 'pds-switch.scss'],\n shadow: true,\n formAssociated: true,\n})\nexport class PdsSwitch {\n private inheritedAttributes: Attributes = {};\n private internals?: ElementInternals;\n private readonly _type = 'checkbox' as const;\n\n @Element() el: HTMLPdsSwitchElement;\n\n /**\n * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * Determines the input 'checked' state.\n */\n @Prop({ mutable: true }) checked = false;\n\n /**\n * Determines the input 'disabled' state, preventing user interaction.\n */\n @Prop() disabled? = false;\n\n /**\n * Displays message text describing an invalid state.\n */\n @Prop() errorMessage?: string;\n\n /**\n * Visually hides the label text for instances where only the switch should be displayed. Label remains accessible to assistive technology such as screen readers.\n */\n @Prop() hideLabel: boolean;\n\n /**\n * Displays help text for additional description of an input.\n */\n @Prop() helperMessage: string;\n\n /**\n * Determines the input 'invalid' state, signifying an error is present.\n */\n @Prop() invalid? = false;\n\n /**\n * Displays text to describe the input.\n */\n @Prop() label!: string;\n\n /**\n * Identifies form data and unifies a group of radio inputs for toggling a single property/value.\n */\n @Prop() name: string;\n\n /**\n * Determines the 'required' state of the input.\n */\n @Prop() required? = false;\n\n /**\n * Provides input with a string submitted in form data.\n */\n @Prop() value: string;\n\n\n /**\n * Emits an event on input change.\n */\n @Event() pdsSwitchChange: EventEmitter<InputEvent>;\n\n private onSwitchUpdate = (e: Event) => {\n if (this.disabled) return;\n\n const input = e.target as HTMLInputElement;\n this.checked = input.checked;\n\n this.updateFormValue();\n\n this.pdsSwitchChange.emit(e as InputEvent);\n };\n\n private switchClassNames = () => {\n let switchClasses = `pds-switch`;\n\n if (this.invalid === true) {\n switchClasses += \" pds-switch--error\";\n }\n if (this.helperMessage !== undefined) {\n switchClasses += \" pds-switch--message\";\n }\n return switchClasses;\n };\n\n connectedCallback() {\n if (this.el.attachInternals) {\n this.internals = this.el.attachInternals();\n }\n\n // Expose type property on the element instance to match native form element behavior\n exposeTypeProperty(this.el, () => this._type);\n }\n\n componentDidLoad() {\n this.updateFormValue();\n }\n\n @Watch('checked')\n checkedChanged() {\n this.updateFormValue();\n }\n\n private updateFormValue() {\n if (typeof jest !== 'undefined' || typeof process !== 'undefined' && process.env?.NODE_ENV === 'test') {\n return;\n }\n\n if (this.internals && this.internals.setFormValue) {\n // For switches, only send the value when checked, otherwise send null\n const formValue = this.checked ? (this.value || 'on') : null;\n this.internals.setFormValue(formValue);\n }\n\n if (this.internals && this.internals.setValidity) {\n this.internals.setValidity({});\n }\n }\n\n formStateRestoreCallback(state: string | FormData | null) {\n if (state instanceof FormData) {\n // For switches, restore if the value exists in FormData\n const value = this.value || 'on';\n this.checked = state.get(this.name || this.componentId) === value;\n } else if (typeof state === 'string') {\n // Restore from string state\n this.checked = state === (this.value || 'on');\n }\n }\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n }\n }\n\n render() {\n return (\n <Host class={this.switchClassNames()} aria-disabled={this.disabled ? 'true' : null}>\n <label htmlFor={this.componentId}>\n <input\n aria-describedby={assignDescription(this.componentId, this.invalid, this.errorMessage || this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n checked={this.checked}\n class=\"pds-switch__input\"\n disabled={this.disabled}\n id={this.componentId}\n name={this.name ? this.name : this.componentId}\n onChange={this.onSwitchUpdate}\n required={this.required}\n type=\"checkbox\"\n value={this.value}\n {...this.inheritedAttributes}\n />\n <span class={this.hideLabel ? 'visually-hidden' : ''}>\n {this.label}\n </span>\n </label>\n {this.helperMessage &&\n <div\n class={`pds-switch__message`}\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </div>\n }\n {this.errorMessage &&\n <div\n class={`pds-switch__message pds-switch__message--error`}\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </div>\n }\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"p-D-CArvsF.system.js","sources":["src/global/styles/utils/label.scss?tag=pds-switch&encapsulation=shadow","src/components/pds-switch/pds-switch.scss?tag=pds-switch&encapsulation=shadow","src/components/pds-switch/pds-switch.tsx"],"sourcesContent":[":host {\n display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n label {\n color: var(--pine-color-text-label-readonly);\n }\n}\n\nlabel {\n color: var(--pine-color-text-label);\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n// Need discussions\n --sizing-input-toggle-size: calc(var(--pine-dimension-250) - (var(--pine-dimension-025) * 2));\n --pine-dimension-025: 2px;\n --spacing-message-inline: calc(var(--pine-dimension-450) + var(--pine-dimension-150));\n --number-transition-timing: 0.15s ease-out;\n\n align-items: flex-start;\n color: var(--pine-color-text);\n display: inline-flex;\n flex-flow: row wrap;\n position: relative;\n}\n\n:host(.pds-switch--error) {\n color: var(--pine-color-text-message-danger);\n\n input,\n input:checked,\n input:hover:not(:disabled):not(:checked) {\n background-color: var(--pine-color-danger);\n }\n\n input:focus-visible:not(:disabled):not(:checked) {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n\n label {\n color: var(--color-text-error);\n }\n}\n\n// switch container\ninput {\n appearance: none;\n background: var(--pine-color-neutral);\n border: 0;\n border-radius: var(--pine-dimension-sm);\n cursor: pointer;\n display: inline-block;\n flex-shrink: 0;\n height: var(--pine-dimension-250);\n margin: 0;\n padding: 0;\n position: relative;\n transition: var(--number-transition-timing);\n transition-property: background, border, color;\n width: var(--pine-dimension-450);\n\n // switch toggle\n &::after {\n background: var(--pine-color-secondary);\n border-radius: var(--pine-border-radius-full);\n box-shadow: var(--pine-box-shadow);\n content: \"\";\n display: block;\n height: var(--sizing-input-toggle-size);\n inset-block-start: 50%;\n inset-inline-start: 50%;\n position: absolute;\n transform: translate3d(-100%, -50%, 0);\n transition: transform var(--number-transition-timing);\n width: var(--sizing-input-toggle-size);\n }\n}\n\nlabel {\n display: flex;\n gap: var(--pine-dimension-150);\n\n .pds-switch--error & {\n color: inherit;\n }\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n// Help and error messages\n.pds-switch__message {\n color: var(--pine-color-text-message);\n font: var(--pine-typography-body-sm-medium);\n margin-block-start: var(--pine-dimension-xs);\n margin-inline-start: var(--spacing-message-inline);\n width: 100%;\n\n + .pds-switch__message {\n margin-block-start: var(--spacing-message-inline);\n }\n}\n\n.pds-switch__message--error {\n color: inherit;\n display: flex;\n gap: var(--pine-dimension-2xs);\n\n pds-icon {\n margin-block-start: var(--pine-dimension-025);\n }\n}\n\n// Disabled state\ninput:disabled {\n background-color: var(--pine-color-neutral-disabled);\n cursor: not-allowed;\n\n ~ label {\n cursor: initial;\n }\n\n &:hover::after {\n background-color: var(--pine-color-background-container-disabled);\n }\n\n .pds-switch__message {\n color: initial;\n }\n}\n\n// Hover state\ninput:hover:not(:disabled) {\n background-color: var(--pine-color-neutral-hover);\n}\n\n // Focus state\ninput:focus-visible:not(:disabled) {\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n}\n\n// 'Checked' state\n// switch toggle\ninput:checked::after {\n transform: translate3d(0, -50%, 0);\n}\n\n// switch container\ninput:checked:not(:disabled) {\n background-color: currentColor;\n color: var(--pine-color-accent);\n\n &:hover {\n border-color: currentColor;\n color: var(--pine-color-accent-hover);\n }\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop, Watch } from '@stencil/core';\nimport { assignDescription, messageId, exposeTypeProperty } from '../../utils/form';\nimport { danger } from '@pine-ds/icons/icons';\n\nimport { inheritAriaAttributes } from '@utils/attributes';\nimport type { Attributes } from '@utils/attributes';\n\n@Component({\n tag: 'pds-switch',\n styleUrls: ['../../global/styles/utils/label.scss', 'pds-switch.scss'],\n shadow: true,\n formAssociated: true,\n})\nexport class PdsSwitch {\n private inheritedAttributes: Attributes = {};\n private internals?: ElementInternals;\n private readonly _type = 'checkbox' as const;\n\n @Element() el: HTMLPdsSwitchElement;\n\n /**\n * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * Determines the input 'checked' state.\n */\n @Prop({ mutable: true }) checked = false;\n\n /**\n * Determines the input 'disabled' state, preventing user interaction.\n */\n @Prop() disabled? = false;\n\n /**\n * Displays message text describing an invalid state.\n */\n @Prop() errorMessage?: string;\n\n /**\n * Visually hides the label text for instances where only the switch should be displayed. Label remains accessible to assistive technology such as screen readers.\n */\n @Prop() hideLabel: boolean;\n\n /**\n * Displays help text for additional description of an input.\n */\n @Prop() helperMessage: string;\n\n /**\n * Determines the input 'invalid' state, signifying an error is present.\n */\n @Prop() invalid? = false;\n\n /**\n * Displays text to describe the input.\n */\n @Prop() label!: string;\n\n /**\n * Identifies form data and unifies a group of radio inputs for toggling a single property/value.\n */\n @Prop() name: string;\n\n /**\n * Determines the 'required' state of the input.\n */\n @Prop() required? = false;\n\n /**\n * Provides input with a string submitted in form data.\n */\n @Prop() value: string;\n\n\n /**\n * Emits an event on input change.\n */\n @Event() pdsSwitchChange: EventEmitter<InputEvent>;\n\n private onSwitchUpdate = (e: Event) => {\n if (this.disabled) return;\n\n const input = e.target as HTMLInputElement;\n this.checked = input.checked;\n\n this.updateFormValue();\n\n this.pdsSwitchChange.emit(e as InputEvent);\n };\n\n private switchClassNames = () => {\n let switchClasses = `pds-switch`;\n\n if (this.invalid === true) {\n switchClasses += \" pds-switch--error\";\n }\n if (this.helperMessage !== undefined) {\n switchClasses += \" pds-switch--message\";\n }\n return switchClasses;\n };\n\n connectedCallback() {\n if (this.el.attachInternals) {\n this.internals = this.el.attachInternals();\n }\n\n // Expose type property on the element instance to match native form element behavior\n exposeTypeProperty(this.el, () => this._type);\n }\n\n componentDidLoad() {\n this.updateFormValue();\n }\n\n @Watch('checked')\n checkedChanged() {\n this.updateFormValue();\n }\n\n private updateFormValue() {\n if (typeof jest !== 'undefined' || typeof process !== 'undefined' && process.env?.NODE_ENV === 'test') {\n return;\n }\n\n if (this.internals && this.internals.setFormValue) {\n // For switches, only send the value when checked, otherwise send null\n const formValue = this.checked ? (this.value || 'on') : null;\n this.internals.setFormValue(formValue);\n }\n\n if (this.internals && this.internals.setValidity) {\n this.internals.setValidity({});\n }\n }\n\n formStateRestoreCallback(state: string | FormData | null) {\n if (state instanceof FormData) {\n // For switches, restore if the value exists in FormData\n const value = this.value || 'on';\n this.checked = state.get(this.name || this.componentId) === value;\n } else if (typeof state === 'string') {\n // Restore from string state\n this.checked = state === (this.value || 'on');\n }\n }\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n }\n }\n\n render() {\n return (\n <Host class={this.switchClassNames()} aria-disabled={this.disabled ? 'true' : null}>\n <label htmlFor={this.componentId}>\n <input\n aria-describedby={assignDescription(this.componentId, this.invalid, this.errorMessage || this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n checked={this.checked}\n class=\"pds-switch__input\"\n disabled={this.disabled}\n id={this.componentId}\n name={this.name ? this.name : this.componentId}\n onChange={this.onSwitchUpdate}\n required={this.required}\n type=\"checkbox\"\n value={this.value}\n {...this.inheritedAttributes}\n />\n <span class={this.hideLabel ? 'visually-hidden' : ''}>\n {this.label}\n </span>\n </label>\n {this.helperMessage &&\n <div\n class={`pds-switch__message`}\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </div>\n }\n {this.errorMessage &&\n <div\n class={`pds-switch__message pds-switch__message--error`}\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </div>\n }\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-CdcQ02yR.system.js","sources":["src/components/pds-toast/pds-toast.scss?tag=pds-toast&encapsulation=shadow","src/components/pds-toast/pds-toast.tsx"],"sourcesContent":[":host {\n --animation-duration: 0.3s;\n --animation-timing: cubic-bezier(0.4, 0, 0.2, 1);\n --padding-inline: var(--pine-dimension-md);\n --padding-inline-desktop: var(--pine-dimension-2xl);\n --sizing-height-default: 68px;\n --sizing-min-width: calc(var(--sizing-total-width) - (var(--padding-inline) * 2));\n --sizing-min-width-desktop: calc(var(--sizing-total-width) - (var(--padding-inline-desktop) * 2));\n --sizing-total-width: 350px;\n\n box-sizing: border-box;\n display: block;\n font: var(--pine-typography-body-medium);\n}\n\n.pds-toast {\n align-items: center;\n animation: pds-toast-animate-in var(--animation-duration) var(--animation-timing);\n background-color: var(--pine-color-primary);\n border-radius: var(--pine-dimension-xs);\n box-shadow: var(--pine-box-shadow);\n color: var(--pine-color-text-primary);\n display: flex;\n height: var(--sizing-height-default);\n justify-content: flex-start;\n margin-block-end: var(--pine-dimension-2xs);\n max-width: 90vw;\n min-width: var(--sizing-min-width);\n padding: 0 var(--padding-inline);\n position: relative;\n width: fit-content;\n\n @media screen and (max-width: 767px) {\n height: 36px;\n max-width: calc(100vw - (var(--pine-dimension-2xs) * 2));\n min-width: auto;\n padding-inline: var(--pine-dimension-2xs);\n }\n\n &--danger {\n background-color: var(--pine-color-danger);\n }\n\n &--loading {\n .pds-toast__loader {\n align-items: center;\n display: flex;\n justify-content: center;\n margin-inline-end: var(--pine-dimension-sm);\n position: relative;\n\n &-spinner {\n animation: pds-toast-rotate 2s linear infinite;\n height: 20px;\n width: 20px;\n }\n\n &-path {\n animation: pds-toast-dash 1.5s ease-in-out infinite;\n stroke-dasharray: 1, 200;\n stroke-dashoffset: 0;\n stroke-linecap: round;\n }\n }\n }\n}\n\n.pds-toast__icon {\n color: var(--pine-color-text-primary);\n display: inline-flex;\n margin-inline-end: var(--pine-dimension-sm);\n}\n\n.pds-toast__message {\n font: var(--pine-typography-body-sm-medium);\n margin-inline-end: auto;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n\n // Style all slotted links\n ::slotted(a) {\n color: var(--pine-color-text-primary);\n margin-inline-start: var(--pine-dimension-xs);\n opacity: 0.7;\n text-decoration: underline;\n\n &:hover,\n &:focus-visible {\n opacity: 1;\n }\n\n &:focus-visible {\n outline: 2px solid var(--pine-color-text-primary);\n outline-offset: 2px;\n }\n }\n}\n\n.pds-toast__button {\n align-items: center;\n background: none;\n border: 0;\n border-radius: var(--pine-border-radius-full);\n color: inherit;\n cursor: pointer;\n display: inline-flex;\n margin-inline-start: var(--pine-dimension-md);\n opacity: 0.7;\n padding: 0;\n white-space: nowrap;\n\n &:hover,\n &:focus {\n opacity: 1;\n }\n\n &:focus {\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-dimension-2xs);\n }\n}\n\n// Animation keyframes\n@keyframes pds-toast-animate-in {\n from {\n opacity: 0;\n transform: translateY(100%);\n }\n\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes pds-toast-animate-out {\n from {\n opacity: 1;\n transform: translateY(0);\n }\n\n to {\n opacity: 0;\n transform: translateY(100%);\n }\n}\n\n// Loading animation keyframes\n@keyframes pds-toast-rotate {\n to {\n transform: rotate(360deg);\n }\n}\n\n@keyframes pds-toast-dash {\n 0% {\n stroke-dasharray: 1, 200;\n stroke-dashoffset: 0;\n }\n\n 50% {\n stroke-dasharray: 89, 200;\n stroke-dashoffset: -35;\n }\n\n 100% {\n stroke-dasharray: 89, 200;\n stroke-dashoffset: -124;\n }\n}\n\n// Animation for dismissing\n:host([hidden]) .pds-toast,\n.pds-toast--animating-out {\n animation: pds-toast-animate-out var(--animation-duration) var(--animation-timing) forwards;\n pointer-events: none; /* Prevent interaction during animation */\n}\n","import { Component, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\n\n@Component({\n tag: 'pds-toast',\n styleUrl: 'pds-toast.scss',\n shadow: true,\n})\nexport class PdsToast {\n // Props\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * Whether the toast can be dismissed manually via the close button.\n * Note: This only controls manual dismissal. Auto-dismissal via duration still applies.\n * @default true\n */\n @Prop() dismissible: boolean = true;\n\n /**\n * The duration in milliseconds to show the toast before auto-dismissing.\n * Set to 0 to disable auto-dismiss.\n * @default 4500\n */\n @Prop() duration: number = 4500;\n\n /**\n * The name of the icon to display in the toast.\n */\n @Prop() icon?: string;\n\n /**\n * The type of toast to display.\n * - default: Grey background (default)\n * - danger: Red background\n * - loading: With spinner animation\n * @default 'default'\n */\n @Prop() type: 'default' | 'danger' | 'loading' = 'default';\n\n /**\n * Whether the toast is currently visible.\n */\n @State() isVisible: boolean = true;\n\n /**\n * Whether the toast is animating out.\n */\n @State() isAnimatingOut: boolean = false;\n\n // Private properties\n /**\n * Timer for auto-dismissal\n */\n private dismissTimer?: number;\n\n /**\n * Event emitted when the toast is dismissed, either manually or automatically.\n */\n @Event() pdsToastDismissed: EventEmitter<{ componentId?: string }>;\n\n componentDidLoad() {\n if (this.duration > 0) {\n this.startDismissTimer();\n }\n }\n\n disconnectedCallback() {\n this.cleanup();\n }\n\n @Watch('duration')\n handleDurationChange(newDuration: number) {\n if (this.dismissTimer) {\n window.clearTimeout(this.dismissTimer);\n this.dismissTimer = undefined;\n }\n if (newDuration > 0) {\n this.startDismissTimer();\n }\n }\n\n @Method()\n async dismiss(): Promise<void> {\n // Start the animation out\n this.isAnimatingOut = true;\n\n // Wait for animation to complete before hiding and cleanup\n await new Promise((resolve) => setTimeout(resolve, 300)); // Match --animation-duration\n\n this.isVisible = false;\n this.cleanup();\n this.pdsToastDismissed.emit({ componentId: this.componentId });\n }\n\n // Private methods\n private cleanup(): void {\n if (this.dismissTimer) {\n window.clearTimeout(this.dismissTimer);\n this.dismissTimer = undefined;\n }\n }\n\n private startDismissTimer(): void {\n this.dismissTimer = window.setTimeout(() => {\n this.dismiss();\n }, this.duration);\n }\n\n private renderIcon() {\n // Loading type takes priority\n if (this.type === 'loading') {\n return (\n <div class=\"pds-toast__loader\">\n <svg class=\"pds-toast__loader-spinner\" viewBox=\"25 25 50 50\" aria-hidden=\"true\">\n <circle class=\"pds-toast__loader-path\" cx=\"50\" cy=\"50\" r=\"20\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"4\" stroke-linecap=\"round\" />\n </svg>\n </div>\n );\n }\n\n // Return icon if provided, otherwise undefined (which renders as nothing)\n return this.icon && <pds-icon name={this.icon} class=\"pds-toast__icon\" />;\n }\n\n render() {\n return (\n <Host hidden={!this.isVisible}>\n <div\n class={{\n 'pds-toast': true,\n [`pds-toast--${this.type}`]: this.type !== 'default',\n 'pds-toast--animating-out': this.isAnimatingOut\n }}\n role=\"alert\"\n aria-live=\"polite\"\n >\n {this.renderIcon()}\n\n <span class=\"pds-toast__message\">\n <slot></slot>\n </span>\n\n {this.dismissible && (\n <button\n type=\"button\"\n class=\"pds-toast__button\"\n onClick={() => {\n this.dismiss();\n }}\n aria-label=\"Dismiss message\"\n >\n <pds-icon name=\"remove\" />\n </button>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"p-D5MCs-6L.system.js","sources":["src/components/pds-toast/pds-toast.scss?tag=pds-toast&encapsulation=shadow","src/components/pds-toast/pds-toast.tsx"],"sourcesContent":[":host {\n --animation-duration: 0.3s;\n --animation-timing: cubic-bezier(0.4, 0, 0.2, 1);\n --padding-inline: var(--pine-dimension-md);\n --padding-inline-desktop: var(--pine-dimension-2xl);\n --sizing-height-default: 68px;\n --sizing-min-width: calc(var(--sizing-total-width) - (var(--padding-inline) * 2));\n --sizing-min-width-desktop: calc(var(--sizing-total-width) - (var(--padding-inline-desktop) * 2));\n --sizing-total-width: 350px;\n\n box-sizing: border-box;\n display: block;\n font: var(--pine-typography-body-medium);\n}\n\n.pds-toast {\n align-items: center;\n animation: pds-toast-animate-in var(--animation-duration) var(--animation-timing);\n background-color: var(--pine-color-primary);\n border-radius: var(--pine-dimension-xs);\n box-shadow: var(--pine-box-shadow);\n color: var(--pine-color-text-primary);\n display: flex;\n height: var(--sizing-height-default);\n justify-content: flex-start;\n margin-block-end: var(--pine-dimension-2xs);\n max-width: 90vw;\n min-width: var(--sizing-min-width);\n padding: 0 var(--padding-inline);\n position: relative;\n width: fit-content;\n\n @media screen and (max-width: 767px) {\n height: 36px;\n max-width: calc(100vw - (var(--pine-dimension-2xs) * 2));\n min-width: auto;\n padding-inline: var(--pine-dimension-2xs);\n }\n\n &--danger {\n background-color: var(--pine-color-danger);\n }\n\n &--loading {\n .pds-toast__loader {\n align-items: center;\n display: flex;\n justify-content: center;\n margin-inline-end: var(--pine-dimension-sm);\n position: relative;\n\n &-spinner {\n animation: pds-toast-rotate 2s linear infinite;\n height: 20px;\n width: 20px;\n }\n\n &-path {\n animation: pds-toast-dash 1.5s ease-in-out infinite;\n stroke-dasharray: 1, 200;\n stroke-dashoffset: 0;\n stroke-linecap: round;\n }\n }\n }\n}\n\n.pds-toast__icon {\n color: var(--pine-color-text-primary);\n display: inline-flex;\n margin-inline-end: var(--pine-dimension-sm);\n}\n\n.pds-toast__message {\n font: var(--pine-typography-body-sm-medium);\n margin-inline-end: auto;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n\n // Style all slotted links\n ::slotted(a) {\n color: var(--pine-color-text-primary);\n margin-inline-start: var(--pine-dimension-xs);\n opacity: 0.7;\n text-decoration: underline;\n\n &:hover,\n &:focus-visible {\n opacity: 1;\n }\n\n &:focus-visible {\n outline: 2px solid var(--pine-color-text-primary);\n outline-offset: 2px;\n }\n }\n}\n\n.pds-toast__button {\n align-items: center;\n background: none;\n border: 0;\n border-radius: var(--pine-border-radius-full);\n color: inherit;\n cursor: pointer;\n display: inline-flex;\n margin-inline-start: var(--pine-dimension-md);\n opacity: 0.7;\n padding: 0;\n white-space: nowrap;\n\n &:hover,\n &:focus {\n opacity: 1;\n }\n\n &:focus {\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-dimension-2xs);\n }\n}\n\n// Animation keyframes\n@keyframes pds-toast-animate-in {\n from {\n opacity: 0;\n transform: translateY(100%);\n }\n\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes pds-toast-animate-out {\n from {\n opacity: 1;\n transform: translateY(0);\n }\n\n to {\n opacity: 0;\n transform: translateY(100%);\n }\n}\n\n// Loading animation keyframes\n@keyframes pds-toast-rotate {\n to {\n transform: rotate(360deg);\n }\n}\n\n@keyframes pds-toast-dash {\n 0% {\n stroke-dasharray: 1, 200;\n stroke-dashoffset: 0;\n }\n\n 50% {\n stroke-dasharray: 89, 200;\n stroke-dashoffset: -35;\n }\n\n 100% {\n stroke-dasharray: 89, 200;\n stroke-dashoffset: -124;\n }\n}\n\n// Animation for dismissing\n:host([hidden]) .pds-toast,\n.pds-toast--animating-out {\n animation: pds-toast-animate-out var(--animation-duration) var(--animation-timing) forwards;\n pointer-events: none; /* Prevent interaction during animation */\n}\n","import { Component, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\n\n@Component({\n tag: 'pds-toast',\n styleUrl: 'pds-toast.scss',\n shadow: true,\n})\nexport class PdsToast {\n // Props\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * Whether the toast can be dismissed manually via the close button.\n * Note: This only controls manual dismissal. Auto-dismissal via duration still applies.\n * @default true\n */\n @Prop() dismissible: boolean = true;\n\n /**\n * The duration in milliseconds to show the toast before auto-dismissing.\n * Set to 0 to disable auto-dismiss.\n * @default 4500\n */\n @Prop() duration: number = 4500;\n\n /**\n * The name of the icon to display in the toast.\n */\n @Prop() icon?: string;\n\n /**\n * The type of toast to display.\n * - default: Grey background (default)\n * - danger: Red background\n * - loading: With spinner animation\n * @default 'default'\n */\n @Prop() type: 'default' | 'danger' | 'loading' = 'default';\n\n /**\n * Whether the toast is currently visible.\n */\n @State() isVisible: boolean = true;\n\n /**\n * Whether the toast is animating out.\n */\n @State() isAnimatingOut: boolean = false;\n\n // Private properties\n /**\n * Timer for auto-dismissal\n */\n private dismissTimer?: number;\n\n /**\n * Event emitted when the toast is dismissed, either manually or automatically.\n */\n @Event() pdsToastDismissed: EventEmitter<{ componentId?: string }>;\n\n componentDidLoad() {\n if (this.duration > 0) {\n this.startDismissTimer();\n }\n }\n\n disconnectedCallback() {\n this.cleanup();\n }\n\n @Watch('duration')\n handleDurationChange(newDuration: number) {\n if (this.dismissTimer) {\n window.clearTimeout(this.dismissTimer);\n this.dismissTimer = undefined;\n }\n if (newDuration > 0) {\n this.startDismissTimer();\n }\n }\n\n @Method()\n async dismiss(): Promise<void> {\n // Start the animation out\n this.isAnimatingOut = true;\n\n // Wait for animation to complete before hiding and cleanup\n await new Promise((resolve) => setTimeout(resolve, 300)); // Match --animation-duration\n\n this.isVisible = false;\n this.cleanup();\n this.pdsToastDismissed.emit({ componentId: this.componentId });\n }\n\n // Private methods\n private cleanup(): void {\n if (this.dismissTimer) {\n window.clearTimeout(this.dismissTimer);\n this.dismissTimer = undefined;\n }\n }\n\n private startDismissTimer(): void {\n this.dismissTimer = window.setTimeout(() => {\n this.dismiss();\n }, this.duration);\n }\n\n private renderIcon() {\n // Loading type takes priority\n if (this.type === 'loading') {\n return (\n <div class=\"pds-toast__loader\">\n <svg class=\"pds-toast__loader-spinner\" viewBox=\"25 25 50 50\" aria-hidden=\"true\">\n <circle class=\"pds-toast__loader-path\" cx=\"50\" cy=\"50\" r=\"20\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"4\" stroke-linecap=\"round\" />\n </svg>\n </div>\n );\n }\n\n // Return icon if provided, otherwise undefined (which renders as nothing)\n return this.icon && <pds-icon name={this.icon} class=\"pds-toast__icon\" />;\n }\n\n render() {\n return (\n <Host hidden={!this.isVisible}>\n <div\n class={{\n 'pds-toast': true,\n [`pds-toast--${this.type}`]: this.type !== 'default',\n 'pds-toast--animating-out': this.isAnimatingOut\n }}\n role=\"alert\"\n aria-live=\"polite\"\n >\n {this.renderIcon()}\n\n <span class=\"pds-toast__message\">\n <slot></slot>\n </span>\n\n {this.dismissible && (\n <button\n type=\"button\"\n class=\"pds-toast__button\"\n onClick={() => {\n this.dismiss();\n }}\n aria-label=\"Dismiss message\"\n >\n <pds-icon name=\"remove\" />\n </button>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-BLC5kuro.system.js","sources":["src/components/pds-modal/pds-modal.scss?tag=pds-modal","src/components/pds-modal/pds-modal.tsx"],"sourcesContent":[".pds-modal__backdrop {\n align-items: flex-start;\n background-color: rgba(0, 0, 0, 0.4);\n border: 0;\n display: flex;\n height: 100%;\n inset: 0;\n justify-content: center;\n margin: 0;\n max-height: 100%;\n max-width: 100%;\n opacity: 0;\n padding: 0;\n position: fixed;\n transition: opacity 0.2s ease, visibility 0.2s ease;\n visibility: hidden;\n width: 100%;\n z-index: var(--pine-z-index-modal);\n\n @supports (backdrop-filter: blur(3px)) {\n backdrop-filter: blur(3px);\n }\n\n // Increase z-index for nested modals\n pds-modal & {\n z-index: var(--pine-z-index-priority);\n }\n\n &::backdrop {\n background: transparent;\n }\n\n &.open {\n opacity: 1;\n visibility: visible;\n }\n}\n\n.pds-modal {\n background: var(--pine-color-background-container);\n border-radius: var(--pine-dimension-sm);\n box-shadow: var(--pine-box-shadow-400);\n display: flex;\n flex-direction: column;\n margin: var(--pine-dimension-md);\n max-height: none;\n width: 100%;\n\n &.pds-modal--scrollable {\n max-height: calc(100vh - (calc(5vh + 96px)));\n\n @supports (height: 100dvh) {\n max-height: calc(100dvh - (calc(5dvh + 96px)));\n }\n }\n\n @media (min-width: 992px) {\n margin-block-start: 6vh;\n\n @supports (height: 100dvh) {\n margin-block-start: 6dvh;\n }\n }\n\n @media (min-width: 1200px) {\n margin-block-start: 8vh;\n\n @supports (height: 100dvh) {\n margin-block-start: 8dvh;\n }\n }\n}\n\n.pds-modal--sm {\n max-width: 520px;\n}\n\n.pds-modal--md {\n max-width: 700px;\n}\n\n.pds-modal--lg {\n max-width: 900px;\n}\n\n.pds-modal--fullscreen {\n border-radius: 0;\n height: 100%;\n margin: 0;\n max-height: 100vh;\n max-width: 100%;\n\n @supports (height: 100dvh) {\n max-height: 100dvh;\n }\n\n &.pds-modal--scrollable {\n max-height: 100vh;\n\n @supports (height: 100dvh) {\n max-height: 100dvh;\n }\n }\n}\n\n.pds-modal-content {\n .pds-modal--fullscreen & {\n flex: 1;\n }\n}\n\n// Scrollable modal styles (default behavior)\n.pds-modal--scrollable {\n pds-modal-content {\n border-block-end: 1px solid transparent;\n border-block-start: 1px solid transparent;\n overflow-y: auto;\n }\n}\n\n// Non-scrollable modal styles\n.pds-modal:not(.pds-modal--scrollable) {\n pds-modal-content {\n overflow-y: visible;\n }\n}\n\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\n\n@Component({\n tag: 'pds-modal',\n styleUrl: 'pds-modal.scss',\n shadow: false\n})\nexport class PdsModal {\n private modalRef: HTMLDialogElement;\n private previousActiveElement: HTMLElement;\n private focusableElements: HTMLElement[] = [];\n\n @Element() el: HTMLPdsModalElement;\n\n /**\n * Whether the modal can be dismissed by clicking the backdrop\n * @default true\n */\n @Prop() backdropDismiss = true;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Whether the modal is open\n * @default false\n */\n @Prop({ mutable: true }) open = false;\n\n /**\n * The size of the modal\n * @default 'md'\n */\n @Prop() size: 'sm' | 'md' | 'lg' | 'fullscreen' = 'md';\n\n /**\n * Whether the modal content should be scrollable\n * @default true\n */\n @Prop() scrollable = true;\n\n /**\n * Emitted when the modal is opened\n */\n @Event() pdsModalOpen: EventEmitter<void>;\n\n /**\n * Emitted when the modal is closed\n */\n @Event() pdsModalClose: EventEmitter<void>;\n\n /**\n * Stores the list of focusable elements in the modal\n */\n @State() focusableElementsArray: HTMLElement[] = [];\n\n componentDidLoad() {\n this.modalRef = this.el.querySelector('.pds-modal__backdrop') as HTMLDialogElement;\n // Add keyboard event listener\n document.addEventListener('keydown', this.handleKeyDown);\n }\n\n disconnectedCallback() {\n // Clean up event listener\n document.removeEventListener('keydown', this.handleKeyDown);\n }\n\n @Watch('open')\n handleOpenChange(newValue: boolean) {\n if (newValue) {\n this.showModal();\n } else {\n this.hideModal();\n }\n }\n\n /**\n * Updates the list of focusable elements in the modal\n */\n private updateFocusableElements() {\n if (!this.modalRef) return;\n\n // Get all focusable elements within the modal\n const selector = [\n 'a[href]',\n 'button:not([disabled])',\n 'input:not([disabled])',\n 'select:not([disabled])',\n 'textarea:not([disabled])',\n '[tabindex]:not([tabindex=\"-1\"])',\n 'pds-button:not([disabled])',\n 'pds-link:not([disabled])',\n 'pds-input:not([disabled])',\n 'pds-checkbox:not([disabled])',\n 'pds-radio:not([disabled])',\n 'pds-switch:not([disabled])',\n 'pds-select:not([disabled])',\n ].join(',');\n\n this.focusableElements = Array.from(\n this.modalRef.querySelectorAll(selector)\n ) as HTMLElement[];\n\n // Filter out elements with display: none or visibility: hidden\n this.focusableElements = this.focusableElements.filter(el => {\n const style = window.getComputedStyle(el);\n return style.display !== 'none' && style.visibility !== 'hidden';\n });\n }\n\n /**\n * Sets focus to the first focusable element in the modal\n */\n private setInitialFocus() {\n if (this.focusableElements.length === 0) return;\n\n // Focus the first focusable element\n const firstElement = this.focusableElements[0];\n\n // For web components, we need to ensure they're properly focused\n this.focusElement(firstElement);\n }\n\n /**\n * Helper method to focus an element, with special handling for web components\n */\n private focusElement(element: HTMLElement) {\n if (!element) return;\n\n try {\n // Try standard focus first\n element.focus();\n\n // Check if focus worked\n setTimeout(() => {\n if (document.activeElement !== element) {\n // For web components, try to find a focusable element inside\n if (element.shadowRoot) {\n const focusableInShadow = element.shadowRoot.querySelector(\n 'button, [tabindex], input, a[href]'\n ) as HTMLElement;\n\n if (focusableInShadow) {\n focusableInShadow.focus();\n }\n }\n }\n }, 0);\n } catch (error) {\n console.error('Error focusing element:', error);\n }\n }\n\n /**\n * Opens the modal\n */\n @Method()\n async showModal() {\n if (this.modalRef) {\n try {\n // Store the currently focused element to restore focus when modal closes\n this.previousActiveElement = document.activeElement as HTMLElement;\n\n // Use native dialog showModal method which makes the rest of the page inert\n this.modalRef.showModal();\n this.open = true;\n\n // Update focusable elements and set initial focus\n // Using a longer timeout to ensure all components are fully rendered\n setTimeout(() => {\n this.updateFocusableElements();\n this.setInitialFocus();\n this.pdsModalOpen.emit();\n }, 100);\n } catch (error) {\n console.error('Failed to show modal:', error);\n }\n }\n }\n\n /**\n * Closes the modal\n */\n @Method()\n async hideModal() {\n if (this.modalRef) {\n try {\n this.modalRef.close();\n this.open = false;\n\n // Restore focus to the element that was focused before the modal was opened\n if (this.previousActiveElement && typeof this.previousActiveElement.focus === 'function') {\n this.previousActiveElement.focus();\n }\n\n this.pdsModalClose.emit();\n } catch (error) {\n console.error('Failed to hide modal:', error);\n }\n }\n }\n\n private handleBackdropClick = (e: MouseEvent) => {\n if (!this.backdropDismiss || !this.open) return;\n\n if ((e.target as HTMLElement).classList.contains('pds-modal__backdrop')) {\n e.stopPropagation();\n\n // Only close if this is the innermost modal\n if (this.isInnermostModal()) {\n this.hideModal();\n }\n }\n };\n\n /**\n * Gets the z-index of a modal's backdrop element\n */\n private getBackdropZIndex(modal: Element): number {\n const backdrop = modal.querySelector('.pds-modal__backdrop');\n return backdrop ? parseInt(getComputedStyle(backdrop).zIndex, 10) : -1;\n }\n\n /**\n * Checks if this modal is the innermost (highest z-index) modal\n */\n private isInnermostModal(): boolean {\n // Find all open modals\n const openModals = Array.from(document.querySelectorAll('pds-modal')).filter(\n modal => modal.open\n );\n\n if (openModals.length === 0) return false;\n\n // Get this modal's backdrop element\n const thisBackdrop = this.el.querySelector('.pds-modal__backdrop');\n if (!thisBackdrop) return false;\n\n // Get computed z-index of all open modal backdrops\n const modalZIndexes = openModals.map(modal => this.getBackdropZIndex(modal));\n\n // Get the highest z-index\n const maxZIndex = Math.max(...modalZIndexes);\n\n // Check if this modal's backdrop has the highest z-index\n const thisZIndex = this.getBackdropZIndex(this.el);\n return thisZIndex === maxZIndex;\n }\n\n private handleKeyDown = (e: KeyboardEvent) => {\n // If the modal is not open, don't handle any keyboard events\n if (!this.open) return;\n\n // Handle Escape key to close the modal\n if (e.key === 'Escape') {\n // Only close if this is the innermost modal\n if (this.isInnermostModal()) {\n e.preventDefault();\n this.hideModal();\n }\n return;\n }\n\n // Handle Tab key for focus trapping\n if (e.key === 'Tab') {\n // If there are no focusable elements, do nothing\n if (this.focusableElements.length === 0) return;\n\n // Get the first and last focusable elements\n const firstFocusableElement = this.focusableElements[0];\n const lastFocusableElement = this.focusableElements[this.focusableElements.length - 1];\n\n // Get the current active element\n const activeElement = document.activeElement;\n\n // Check if we need to wrap focus\n const isFirstElement = activeElement === firstFocusableElement ||\n firstFocusableElement.contains(activeElement as Node);\n\n const isLastElement = activeElement === lastFocusableElement ||\n lastFocusableElement.contains(activeElement as Node);\n\n // If shift + tab is pressed and focus is on the first element, move to the last element\n if (e.shiftKey && isFirstElement) {\n e.preventDefault();\n this.focusElement(lastFocusableElement);\n }\n // If tab is pressed and focus is on the last element, move to the first element\n else if (!e.shiftKey && isLastElement) {\n e.preventDefault();\n this.focusElement(firstFocusableElement);\n }\n }\n };\n\n render() {\n return (\n <dialog\n class={{\n 'pds-modal__backdrop': true,\n 'open': this.open\n }}\n aria-modal=\"true\"\n aria-labelledby={`${this.componentId}-heading`}\n onClick={this.handleBackdropClick}\n >\n <div\n class={{\n 'pds-modal': true,\n [`pds-modal--${this.size}`]: true,\n 'pds-modal--scrollable': this.scrollable\n }}\n >\n <slot></slot>\n </div>\n </dialog>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"p-DCLLstWD.system.js","sources":["src/components/pds-modal/pds-modal.scss?tag=pds-modal","src/components/pds-modal/pds-modal.tsx"],"sourcesContent":[".pds-modal__backdrop {\n align-items: flex-start;\n background-color: rgba(0, 0, 0, 0.4);\n border: 0;\n display: flex;\n height: 100%;\n inset: 0;\n justify-content: center;\n margin: 0;\n max-height: 100%;\n max-width: 100%;\n opacity: 0;\n padding: 0;\n position: fixed;\n transition: opacity 0.2s ease, visibility 0.2s ease;\n visibility: hidden;\n width: 100%;\n z-index: var(--pine-z-index-modal);\n\n @supports (backdrop-filter: blur(3px)) {\n backdrop-filter: blur(3px);\n }\n\n // Increase z-index for nested modals\n pds-modal & {\n z-index: var(--pine-z-index-priority);\n }\n\n &::backdrop {\n background: transparent;\n }\n\n &.open {\n opacity: 1;\n visibility: visible;\n }\n}\n\n.pds-modal {\n background: var(--pine-color-background-container);\n border-radius: var(--pine-dimension-sm);\n box-shadow: var(--pine-box-shadow-400);\n display: flex;\n flex-direction: column;\n margin: var(--pine-dimension-md);\n max-height: none;\n width: 100%;\n\n &.pds-modal--scrollable {\n max-height: calc(100vh - (calc(5vh + 96px)));\n\n @supports (height: 100dvh) {\n max-height: calc(100dvh - (calc(5dvh + 96px)));\n }\n }\n\n @media (min-width: 992px) {\n margin-block-start: 6vh;\n\n @supports (height: 100dvh) {\n margin-block-start: 6dvh;\n }\n }\n\n @media (min-width: 1200px) {\n margin-block-start: 8vh;\n\n @supports (height: 100dvh) {\n margin-block-start: 8dvh;\n }\n }\n}\n\n.pds-modal--sm {\n max-width: 520px;\n}\n\n.pds-modal--md {\n max-width: 700px;\n}\n\n.pds-modal--lg {\n max-width: 900px;\n}\n\n.pds-modal--fullscreen {\n border-radius: 0;\n height: 100%;\n margin: 0;\n max-height: 100vh;\n max-width: 100%;\n\n @supports (height: 100dvh) {\n max-height: 100dvh;\n }\n\n &.pds-modal--scrollable {\n max-height: 100vh;\n\n @supports (height: 100dvh) {\n max-height: 100dvh;\n }\n }\n}\n\n.pds-modal-content {\n .pds-modal--fullscreen & {\n flex: 1;\n }\n}\n\n// Scrollable modal styles (default behavior)\n.pds-modal--scrollable {\n pds-modal-content {\n border-block-end: 1px solid transparent;\n border-block-start: 1px solid transparent;\n overflow-y: auto;\n }\n}\n\n// Non-scrollable modal styles\n.pds-modal:not(.pds-modal--scrollable) {\n pds-modal-content {\n overflow-y: visible;\n }\n}\n\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\n\n@Component({\n tag: 'pds-modal',\n styleUrl: 'pds-modal.scss',\n shadow: false\n})\nexport class PdsModal {\n private modalRef: HTMLDialogElement;\n private previousActiveElement: HTMLElement;\n private focusableElements: HTMLElement[] = [];\n\n @Element() el: HTMLPdsModalElement;\n\n /**\n * Whether the modal can be dismissed by clicking the backdrop\n * @default true\n */\n @Prop() backdropDismiss = true;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Whether the modal is open\n * @default false\n */\n @Prop({ mutable: true }) open = false;\n\n /**\n * The size of the modal\n * @default 'md'\n */\n @Prop() size: 'sm' | 'md' | 'lg' | 'fullscreen' = 'md';\n\n /**\n * Whether the modal content should be scrollable\n * @default true\n */\n @Prop() scrollable = true;\n\n /**\n * Emitted when the modal is opened\n */\n @Event() pdsModalOpen: EventEmitter<void>;\n\n /**\n * Emitted when the modal is closed\n */\n @Event() pdsModalClose: EventEmitter<void>;\n\n /**\n * Stores the list of focusable elements in the modal\n */\n @State() focusableElementsArray: HTMLElement[] = [];\n\n componentDidLoad() {\n this.modalRef = this.el.querySelector('.pds-modal__backdrop') as HTMLDialogElement;\n // Add keyboard event listener\n document.addEventListener('keydown', this.handleKeyDown);\n }\n\n disconnectedCallback() {\n // Clean up event listener\n document.removeEventListener('keydown', this.handleKeyDown);\n }\n\n @Watch('open')\n handleOpenChange(newValue: boolean) {\n if (newValue) {\n this.showModal();\n } else {\n this.hideModal();\n }\n }\n\n /**\n * Updates the list of focusable elements in the modal\n */\n private updateFocusableElements() {\n if (!this.modalRef) return;\n\n // Get all focusable elements within the modal\n const selector = [\n 'a[href]',\n 'button:not([disabled])',\n 'input:not([disabled])',\n 'select:not([disabled])',\n 'textarea:not([disabled])',\n '[tabindex]:not([tabindex=\"-1\"])',\n 'pds-button:not([disabled])',\n 'pds-link:not([disabled])',\n 'pds-input:not([disabled])',\n 'pds-checkbox:not([disabled])',\n 'pds-radio:not([disabled])',\n 'pds-switch:not([disabled])',\n 'pds-select:not([disabled])',\n ].join(',');\n\n this.focusableElements = Array.from(\n this.modalRef.querySelectorAll(selector)\n ) as HTMLElement[];\n\n // Filter out elements with display: none or visibility: hidden\n this.focusableElements = this.focusableElements.filter(el => {\n const style = window.getComputedStyle(el);\n return style.display !== 'none' && style.visibility !== 'hidden';\n });\n }\n\n /**\n * Sets focus to the first focusable element in the modal\n */\n private setInitialFocus() {\n if (this.focusableElements.length === 0) return;\n\n // Focus the first focusable element\n const firstElement = this.focusableElements[0];\n\n // For web components, we need to ensure they're properly focused\n this.focusElement(firstElement);\n }\n\n /**\n * Helper method to focus an element, with special handling for web components\n */\n private focusElement(element: HTMLElement) {\n if (!element) return;\n\n try {\n // Try standard focus first\n element.focus();\n\n // Check if focus worked\n setTimeout(() => {\n if (document.activeElement !== element) {\n // For web components, try to find a focusable element inside\n if (element.shadowRoot) {\n const focusableInShadow = element.shadowRoot.querySelector(\n 'button, [tabindex], input, a[href]'\n ) as HTMLElement;\n\n if (focusableInShadow) {\n focusableInShadow.focus();\n }\n }\n }\n }, 0);\n } catch (error) {\n console.error('Error focusing element:', error);\n }\n }\n\n /**\n * Opens the modal\n */\n @Method()\n async showModal() {\n if (this.modalRef) {\n try {\n // Store the currently focused element to restore focus when modal closes\n this.previousActiveElement = document.activeElement as HTMLElement;\n\n // Use native dialog showModal method which makes the rest of the page inert\n this.modalRef.showModal();\n this.open = true;\n\n // Update focusable elements and set initial focus\n // Using a longer timeout to ensure all components are fully rendered\n setTimeout(() => {\n this.updateFocusableElements();\n this.setInitialFocus();\n this.pdsModalOpen.emit();\n }, 100);\n } catch (error) {\n console.error('Failed to show modal:', error);\n }\n }\n }\n\n /**\n * Closes the modal\n */\n @Method()\n async hideModal() {\n if (this.modalRef) {\n try {\n this.modalRef.close();\n this.open = false;\n\n // Restore focus to the element that was focused before the modal was opened\n if (this.previousActiveElement && typeof this.previousActiveElement.focus === 'function') {\n this.previousActiveElement.focus();\n }\n\n this.pdsModalClose.emit();\n } catch (error) {\n console.error('Failed to hide modal:', error);\n }\n }\n }\n\n private handleBackdropClick = (e: MouseEvent) => {\n if (!this.backdropDismiss || !this.open) return;\n\n if ((e.target as HTMLElement).classList.contains('pds-modal__backdrop')) {\n e.stopPropagation();\n\n // Only close if this is the innermost modal\n if (this.isInnermostModal()) {\n this.hideModal();\n }\n }\n };\n\n /**\n * Gets the z-index of a modal's backdrop element\n */\n private getBackdropZIndex(modal: Element): number {\n const backdrop = modal.querySelector('.pds-modal__backdrop');\n return backdrop ? parseInt(getComputedStyle(backdrop).zIndex, 10) : -1;\n }\n\n /**\n * Checks if this modal is the innermost (highest z-index) modal\n */\n private isInnermostModal(): boolean {\n // Find all open modals\n const openModals = Array.from(document.querySelectorAll('pds-modal')).filter(\n modal => modal.open\n );\n\n if (openModals.length === 0) return false;\n\n // Get this modal's backdrop element\n const thisBackdrop = this.el.querySelector('.pds-modal__backdrop');\n if (!thisBackdrop) return false;\n\n // Get computed z-index of all open modal backdrops\n const modalZIndexes = openModals.map(modal => this.getBackdropZIndex(modal));\n\n // Get the highest z-index\n const maxZIndex = Math.max(...modalZIndexes);\n\n // Check if this modal's backdrop has the highest z-index\n const thisZIndex = this.getBackdropZIndex(this.el);\n return thisZIndex === maxZIndex;\n }\n\n private handleKeyDown = (e: KeyboardEvent) => {\n // If the modal is not open, don't handle any keyboard events\n if (!this.open) return;\n\n // Handle Escape key to close the modal\n if (e.key === 'Escape') {\n // Only close if this is the innermost modal\n if (this.isInnermostModal()) {\n e.preventDefault();\n this.hideModal();\n }\n return;\n }\n\n // Handle Tab key for focus trapping\n if (e.key === 'Tab') {\n // If there are no focusable elements, do nothing\n if (this.focusableElements.length === 0) return;\n\n // Get the first and last focusable elements\n const firstFocusableElement = this.focusableElements[0];\n const lastFocusableElement = this.focusableElements[this.focusableElements.length - 1];\n\n // Get the current active element\n const activeElement = document.activeElement;\n\n // Check if we need to wrap focus\n const isFirstElement = activeElement === firstFocusableElement ||\n firstFocusableElement.contains(activeElement as Node);\n\n const isLastElement = activeElement === lastFocusableElement ||\n lastFocusableElement.contains(activeElement as Node);\n\n // If shift + tab is pressed and focus is on the first element, move to the last element\n if (e.shiftKey && isFirstElement) {\n e.preventDefault();\n this.focusElement(lastFocusableElement);\n }\n // If tab is pressed and focus is on the last element, move to the first element\n else if (!e.shiftKey && isLastElement) {\n e.preventDefault();\n this.focusElement(firstFocusableElement);\n }\n }\n };\n\n render() {\n return (\n <dialog\n class={{\n 'pds-modal__backdrop': true,\n 'open': this.open\n }}\n aria-modal=\"true\"\n aria-labelledby={`${this.componentId}-heading`}\n onClick={this.handleBackdropClick}\n >\n <div\n class={{\n 'pds-modal': true,\n [`pds-modal--${this.size}`]: true,\n 'pds-modal--scrollable': this.scrollable\n }}\n >\n <slot></slot>\n </div>\n </dialog>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"p-DCiTnlD3.system.js","sources":["src/components/pds-button/pds-button.scss?tag=pds-button&encapsulation=shadow","src/components/pds-button/pds-button.tsx"],"sourcesContent":[":host {\n --pds-button-background: var(--color-background-default);\n --pds-button-border: var(--pine-border);\n --pds-button-border-radius: var(--pine-border-radius-full);\n --pds-button-border-radius-start-end: var(--pine-border-radius-full);\n --pds-button-border-radius-start-start: var(--pine-border-radius-full);\n --pds-button-border-radius-end-end: var(--pine-border-radius-full);\n --pds-button-border-radius-end-start: var(--pine-border-radius-full);\n --pds-button-min-height: var(--pine-dimension-450);\n --pds-button-outline-offset: var(--pine-border-width);\n --color-border-default: transparent;\n --color-border-disabled: transparent;\n --color-border-focus: transparent;\n --color-border-hover: transparent;\n --button-loader-color: var(--color-text-default);\n\n display: inline-flex;\n vertical-align: middle;\n}\n\n:host([full-width=\"true\"]) {\n display: flex;\n width: 100%;\n\n a,\n button {\n justify-content: center;\n width: 100%;\n }\n\n .pds-button__content {\n justify-content: center;\n text-align: center;\n }\n}\n\n:host([loading=\"true\"]) {\n cursor: wait;\n pointer-events: none;\n}\n\n:host([disabled=\"true\"]) {\n pointer-events: none;\n}\n\n.pds-button {\n --pds-loader-color: var(--color-text-default);\n align-items: center;\n background-color: var(--pds-button-background, var(--color-background-default));\n border: var(--pds-button-border);\n border-color: var(--color-border-default);\n border-radius: var(--pds-button-border-radius);\n /* stylelint-disable-next-line order/properties-alphabetical-order */\n border-end-end-radius: var(--pds-button-border-radius-end-end, var(--pds-button-border-radius));\n border-end-start-radius: var(--pds-button-border-radius-end-start, var(--pds-button-border-radius));\n border-start-end-radius: var(--pds-button-border-radius-start-end, var(--pds-button-border-radius));\n border-start-start-radius: var(--pds-button-border-radius-start-start, var(--pds-button-border-radius));\n box-sizing: border-box;\n color: var(--color-text-default);\n cursor: pointer;\n display: flex;\n font: var(--pine-typography-body-brand-label);\n letter-spacing: var(--pine-letter-spacing);\n min-height: var(--pds-button-min-height);\n padding: calc(var(--pine-dimension-xs) - var(--pine-border-width)) var(--pine-dimension-sm);\n position: relative;\n text-decoration: none;\n\n pds-icon {\n color: currentColor;\n fill: currentColor;\n }\n\n &:hover {\n background-color: var(--color-background-hover);\n border-color: var(--color-border-hover);\n }\n\n &:focus-visible {\n border-color: var(--color-border-focus);\n box-shadow: var(--pds-button-box-shadow-focus, none);\n outline: var(--pds-button-outline-focus, var(--pine-outline-focus));\n outline-offset: var(--pds-button-outline-offset);\n }\n\n &:disabled {\n background-color: var(--color-background-disabled);\n border-color: var(--color-border-disabled);\n color: var(--color-text-disabled);\n pointer-events: none;\n }\n}\n\n.pds-button--primary {\n --color-background-default: var(--pine-color-primary);\n --color-background-hover: var(--pine-color-primary-hover);\n --color-background-disabled: var(--pine-color-primary-disabled);\n --color-border-default: var(--pine-color-primary);\n --color-border-hover: var(--pine-color-primary-hover);\n --color-text-default: var(--pine-color-text-primary);\n --color-text-disabled: var(--pine-color-text-primary-disabled);\n --color-outline: var(--pine-color-focus-ring);\n --button-loader-color: var(--pine-color-text-primary);\n}\n\n.pds-button--accent {\n --color-background-default: var(--pine-color-accent);\n --color-background-hover: var(--pine-color-accent-hover);\n --color-background-disabled: var(--pine-color-accent-disabled);\n --color-border-default: var(--pine-color-accent);\n --color-border-hover: var(--pine-color-accent-hover);\n --color-text-default: var(--pine-color-text-primary);\n --color-text-disabled: var(--pine-color-text-accent-disabled);\n --color-outline: var(--pine-color-focus-ring);\n --button-loader-color: var(--pine-color-text-primary);\n}\n\n.pds-button--destructive {\n --color-background-default: var(--pine-color-danger);\n --color-background-hover: var(--pine-color-danger-hover);\n --color-background-disabled: var(--pine-color-danger-disabled);\n --color-border-default: var(--pine-color-danger);\n --color-border-hover: var(--pine-color-danger-hover);\n --color-text-default: var(--pine-color-text-primary);\n --color-text-disabled: var(--pine-color-text-danger-disabled);\n --color-outline: var(--pine-color-focus-ring-danger);\n --button-loader-color: var(--pine-color-text-primary);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n}\n\n.pds-button--secondary,\n.pds-button--disclosure {\n --color-background-default: var(--pine-color-secondary);\n --color-background-hover: var(--pine-color-secondary-hover);\n --color-background-disabled: var(--pine-color-secondary-disabled);\n --color-border-disabled: var(--pine-color-border-disabled);\n --color-border-focus: var(--pine-color-border);\n --color-border-hover: var(--pine-color-border-hover);\n --color-border-default: var(--pine-color-border);\n --color-text-default: var(--pine-color-text-secondary);\n --color-text-disabled: var(--pine-color-text-secondary-disabled);\n --color-outline: var(--pine-color-focus-ring);\n --button-loader-color: var(--pine-color-text-secondary);\n\n &:hover {\n background-color: var(--pine-color-secondary-hover);\n }\n}\n\n.pds-button--tertiary {\n --color-background-default: transparent;\n --color-background-hover: var(--pine-color-grey-100);\n --color-background-disabled: transparent;\n --color-border-default: transparent;\n --color-border-hover: var(--pine-color-grey-100);\n --color-border-disabled: transparent;\n --color-text-default: var(--pine-color-text-secondary);\n --color-text-disabled: var(--pine-color-text-secondary-disabled);\n --color-outline: var(--pine-color-focus-ring);\n --button-loader-color: var(--pine-color-text-secondary);\n}\n\n.pds-button--filter {\n --color-background-default: var(--pine-color-white);\n --color-background-hover: var(--pine-color-grey-100);\n --color-background-disabled: var(--pine-color-white);\n --color-border-default: transparent;\n --color-border-hover: transparent;\n --color-border-focus: transparent;\n --color-text-default: var(--pine-color-text-secondary);\n --color-text-hover: var(--pine-color-text-hover);\n --color-text-disabled: var(--pine-color-text-disabled);\n --color-outline: var(--pine-color-focus-ring);\n --button-loader-color: var(--pine-color-text-secondary);\n --pds-button-border-radius: var(--pine-dimension-125);\n --pds-button-border-radius-start-end: var(--pine-dimension-125);\n --pds-button-border-radius-start-start: var(--pine-dimension-125);\n --pds-button-border-radius-end-end: var(--pine-dimension-125);\n --pds-button-border-radius-end-start: var(--pine-dimension-125);\n padding: var(--pine-dimension-xs) var(--pine-dimension-sm);\n\n &:hover {\n color: var(--color-text-hover);\n }\n}\n\n.pds-button--unstyled {\n --color-background-default: transparent;\n --color-background-hover: transparent;\n --color-background-disabled: transparent;\n --color-text-default: inherit;\n --button-loader-color: inherit;\n border-width: var(--pine-dimension-none);\n margin: var(--pine-dimension-none);\n min-height: auto;\n padding: var(--pine-dimension-none);\n width: inherit;\n}\n\n.pds-button__content {\n align-items: center;\n display: inline-flex;\n gap: var(--pine-dimension-xs);\n position: relative;\n width: 100%;\n}\n\n.pds-button__icon {\n display: inline-flex;\n}\n\n.pds-button__text {\n align-items: center;\n display: inline-flex;\n white-space: nowrap;\n}\n\n.pds-button__icon--hidden,\n.pds-button__text--hidden {\n opacity: 0;\n}\n\n.pds-button__loader {\n height: var(--pine-dimension-250);\n left: 50%;\n position: absolute;\n top: 50%;\n transform: translate(-50%, -50%);\n width: var(--pine-dimension-250);\n}\n\n.pds-button--loading {\n cursor: wait;\n pointer-events: none;\n\n .pds-button__loader {\n pds-loader {\n --loader-color: var(--button-loader-color);\n }\n }\n}\n\n.pds-button--small {\n min-height: var(--pine-dimension-400);\n padding: calc(var(--pine-dimension-2xs) - var(--pine-border-width)) var(--pine-dimension-sm);\n}\n\n.pds-button--micro {\n font-size: var(--pine-font-size-085);\n min-height: var(--pine-dimension-300);\n padding: var(--pine-dimension-025) var(--pine-dimension-xs);\n}\n\n\n.pds-button--icon-only {\n align-items: center;\n border-radius: var(--pine-border-radius-full);\n height: var(--button-dimension);\n justify-content: center;\n min-height: var(--button-dimension);\n min-width: var(--button-dimension);\n padding: var(--pine-dimension-xs);\n width: var(--button-dimension);\n\n .pds-button__content {\n height: 100%;\n justify-content: center;\n width: 100%;\n }\n\n .pds-button__text--hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n }\n\n &.pds-button--small {\n height: var(--pine-dimension-400);\n min-height: var(--pine-dimension-400);\n min-width: var(--pine-dimension-400);\n padding: var(--pine-dimension-2xs);\n width: var(--pine-dimension-400);\n }\n\n &.pds-button--micro {\n height: var(--pine-dimension-300);\n min-height: var(--pine-dimension-300);\n min-width: var(--pine-dimension-300);\n padding: var(--pine-dimension-3xs);\n width: var(--pine-dimension-300);\n }\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Listen, Prop } from '@stencil/core';\nimport { hasShadowDom } from '../../utils/utils';\n\nimport { caretDown, addCircle } from '@pine-ds/icons/icons';\n\n/**\n * @part button - Exposes the button element for styling.\n * @part button-content - Exposes the button content for styling.\n * @part button-text - Exposes the button text for styling.\n * @part caret - Exposes the caret icon component for styling. Appears only on the disclosure variant.\n * @part icon - Exposes the icon component for styling.\n * @part loader-svg - Exposes the loader SVG element for color customization. Appears only when loading.\n * @slot (default) - Button text.\n * @slot start - Content to display before the button text.\n * @slot end - Content to display after the button text.\n*/\n\n@Component({\n tag: 'pds-button',\n styleUrls: ['pds-button.scss'],\n shadow: true,\n})\nexport class PdsButton {\n @Element() el: HTMLPdsButtonElement;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Determines the button's disabled state.\n * @defaultValue false\n */\n @Prop() disabled? = false;\n\n /**\n * Determines if the button should take up the full width of its container.\n * @defaultValue false\n */\n @Prop() fullWidth? = false;\n\n /**\n * If provided, renders the component as an anchor (`<a>`) element instead of a button.\n * When using href, button-specific props (type, name, value, loading) will be ignored.\n */\n @Prop() href?: string;\n\n /**\n * Displays a leading icon in the button. DEPRECATED.\n * @defaultValue null\n * @deprecated Use `start` slot instead.\n */\n @Prop() icon?: string = null;\n\n /**\n * When true, displays only the icon and visually hides the text (keeping it accessible).\n */\n @Prop() iconOnly? = false;\n\n /**\n * Determines if the button is in a loading state.\n * When true, displays a loader and hides the button text.\n * @defaultValue false\n */\n @Prop() loading? = false;\n\n /**\n * Provides the button with a submittable name.\n */\n @Prop() name?: string;\n\n /**\n * Specifies where to open the linked document when href is provided.\n * Only applies when href is set.\n */\n @Prop() target?: '_blank' | '_self' | '_parent' | '_top';\n\n /**\n * Provides button with a type.\n * @defaultValue button\n */\n @Prop() type?: 'button' | 'reset' | 'submit' = 'button';\n\n /**\n * Provides button with a submittable value\n */\n @Prop() value?: string;\n\n /**\n * Sets the size of the button.\n * @defaultValue default\n */\n @Prop() size?: 'default' | 'small' | 'micro' = 'default';\n\n /**\n * Sets the style variant of the button.\n * @defaultValue primary\n */\n @Prop() variant: 'primary' | 'secondary' | 'tertiary' | 'accent' | 'disclosure' | 'destructive' | 'unstyled' | 'filter' = 'primary';\n\n @Event() pdsClick: EventEmitter;\n\n /**\n * Listen for Enter key presses on form inputs to trigger submit\n */\n @Listen('keydown', { target: 'body' })\n\n handleFormKeyDown(event: KeyboardEvent) {\n // Only handle Enter key for submit buttons that are not disabled\n if (event.key !== 'Enter' || this.type !== 'submit' || this.href || this.disabled) {\n return;\n }\n\n const target = event.target as Element;\n\n // Ensure event.target is an Element with matches method before proceeding\n if (!target || typeof target.matches !== 'function') {\n return;\n }\n const form = this.el.closest('form');\n\n // Check if the Enter key was pressed in a form input within the same form\n if (!form || !target || !form.contains(target)) {\n return;\n }\n\n // Check if target is a form input element (exclude reset buttons)\n const isFormInput = target.matches('input:not([type=\"submit\"]):not([type=\"button\"]):not([type=\"reset\"])') ||\n target.matches('pds-input') ||\n target.matches('pds-select') ||\n target.matches('pds-switch') ||\n target.matches('pds-checkbox') ||\n target.matches('pds-radio');\n\n if (isFormInput) {\n // Find all submit buttons in the form and check their actual properties\n const allSubmitButtons = Array.from(form.querySelectorAll('pds-button, button[type=\"submit\"], input[type=\"submit\"]'));\n const enabledSubmitButtons = allSubmitButtons.filter(button => {\n if (button.tagName.toLowerCase() === 'pds-button') {\n const pdsButton = button as HTMLPdsButtonElement;\n return pdsButton.type === 'submit' && !pdsButton.disabled;\n } else {\n return !button.hasAttribute('disabled');\n }\n });\n\n // Only synthesize click if this button is strictly the first enabled submit button\n if (enabledSubmitButtons.length > 0 && enabledSubmitButtons[0] === this.el) {\n event.preventDefault();\n this.el.click();\n }\n }\n }\n\n\n private handleClick = (ev: Event) => {\n if (this.loading) {\n ev.preventDefault();\n return;\n }\n\n // Prevent form submission for disabled buttons\n if (this.disabled) {\n ev.preventDefault();\n return;\n }\n\n if (!this.href && this.type != 'button') {\n // Handle form submission for Shadow DOM buttons\n if (hasShadowDom(this.el)) {\n const form = this.el.closest('form');\n if (form) {\n ev.preventDefault();\n\n const fakeButton = document.createElement('button');\n fakeButton.type = this.type;\n fakeButton.style.display = 'none';\n form.appendChild(fakeButton);\n fakeButton.click();\n fakeButton.remove();\n }\n }\n }\n this.pdsClick.emit(ev);\n };\n\n private classNames() {\n const classNames = ['pds-button'];\n\n if (this.variant) {\n classNames.push('pds-button--' + this.variant);\n }\n\n if (this.size && this.size !== 'default') {\n classNames.push('pds-button--' + this.size);\n }\n\n if (this.iconOnly) {\n classNames.push('pds-button--icon-only');\n }\n\n if (this.loading) {\n classNames.push('pds-button--loading');\n }\n\n return classNames.join(' ');\n }\n\n private hasSlotContent(slotName: string): boolean {\n const elements = this.el.querySelectorAll(`[slot=\"${slotName}\"]`);\n return elements.length > 0;\n }\n\n private renderStartContent() {\n const hasIcon = this.icon && this.variant !== 'disclosure' && this.variant !== 'filter';\n const hasStartSlot = this.hasSlotContent('start');\n\n if (this.variant === 'filter') {\n return (\n <pds-icon class={this.loading ? 'pds-button__icon--hidden' : ''} icon={addCircle} part=\"icon\" aria-hidden=\"true\"></pds-icon>\n );\n } else if (Boolean(hasIcon)) {\n return (\n <pds-icon class={this.loading ? 'pds-button__icon--hidden' : ''} name={this.icon} part=\"icon\" aria-hidden=\"true\"></pds-icon>\n );\n } else if (Boolean(hasStartSlot)) {\n return <span class={`pds-button__icon ${this.loading ? 'pds-button__icon--hidden' : ''}`}><slot name=\"start\" /></span>;\n }\n\n return null;\n }\n\n private renderEndContent() {\n if (this.iconOnly) {\n return null;\n }\n\n if (this.variant === 'disclosure') {\n return (\n <pds-icon class={this.loading ? 'pds-button__icon--hidden' : ''} icon={caretDown} part=\"caret\" aria-hidden=\"true\"></pds-icon>\n );\n } else if (this.hasSlotContent('end')) {\n return <span class={`pds-button__icon ${this.loading ? 'pds-button__icon--hidden' : ''}`}><slot name=\"end\" /></span>;\n }\n\n return null;\n }\n\n render() {\n // Common props for both button and anchor elements\n const commonProps = {\n class: this.classNames(),\n part: 'button',\n };\n\n const attributes = () => {\n if (this.href) {\n return {\n // Anchor element props\n ...commonProps,\n href: this.disabled ? null : this.href,\n target: this.target,\n };\n }\n\n return {\n // Button element props\n ...commonProps,\n 'aria-busy': this.loading ? 'true' : null,\n 'aria-live': this.loading ? 'polite' : null,\n 'disabled': this.disabled,\n 'name': this.name,\n 'type': this.type,\n 'value': this.value,\n };\n };\n\n const ContentElement = this.href ? 'a' : 'button';\n\n // Hide text when loading or iconOnly is true\n const hideText = this.loading || this.iconOnly;\n\n const content = (\n <div class=\"pds-button__content\" part=\"button-content\">\n {this.renderStartContent()}\n\n <span class={`pds-button__text ${hideText ? 'pds-button__text--hidden' : ''}`} part=\"button-text\">\n <slot />\n </span>\n\n {this.loading && (\n <span class=\"pds-button__loader\">\n <pds-loader is-loading={true} size=\"var(--pine-font-size-body-2xl)\" variant=\"spinner\" exportparts=\"loader-svg\">\n Loading...\n </pds-loader>\n </span>\n )}\n\n {this.renderEndContent()}\n </div>\n );\n\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n id={this.componentId}\n onClick={this.handleClick}\n variant={this.variant}\n >\n <ContentElement {...attributes()}>\n {content}\n </ContentElement>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-
|
|
1
|
+
{"version":3,"file":"p-DPmRw4fA.system.js","sources":["src/components/pds-accordion/pds-accordion.scss?tag=pds-accordion&encapsulation=shadow","src/components/pds-accordion/pds-accordion.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\ndetails {\n --number-animation-transform-timing: 200ms;\n\n border-radius: var(--pine-dimension-xs);\n\n pds-icon {\n transform: scaleY(1);\n }\n}\n\n/* stylelint-disable-next-line */\ndetails[open] {\n background-color: var(--pine-color-background-container);\n\n summary {\n color: var(--pine-color-text-active);\n font-weight: var(--pine-font-weight-semi-bold);\n\n pds-icon {\n transform: scaleY(-1);\n }\n }\n}\n\nsummary {\n background-color: var(--pine-color-background-container);\n border-radius: var(--pine-dimension-xs);\n color: var(--pine-color-text-readonly);\n font-family: var(--pine-font-family-body);\n font-size: var(--pine-font-size-body-md);\n font-weight: var(--pine-font-weight-medium);\n letter-spacing: var(--pine-letter-spacing);\n line-height: var(--pine-line-height-body);\n padding-block: calc(var(--pine-dimension-2xs) * 1.5);\n padding-inline-end: var(--pine-dimension-2xs);\n padding-inline-start: var(--pine-dimension-xs);\n\n // Removes marker on Firefox/Chrome\n /* stylelint-disable-next-line */\n align-items: center;\n display: flex;\n\n // Removes marker on Safari\n &::-webkit-details-marker {\n display: none;\n }\n\n &:hover {\n background: var(--pine-color-background-container-hover);\n color: var(--pine-color-text);\n cursor: pointer;\n }\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n position: relative;\n }\n\n pds-icon {\n margin-inline-start: auto;\n }\n}\n\n.pds-accordion__body {\n padding-block-end: calc(var(--pine-dimension-sm) + 2);\n padding-inline: calc(var(--pine-dimension-2xs) * 1.5);\n}\n","import { Component, h, Host, Prop, Watch } from '@stencil/core';\nimport { downSmall } from '@pine-ds/icons/icons';\n\n/**\n * @part accordion-body - Accordion body styles.\n * @part accordion-button - Accordion button/trigger styles.\n * @part accordion-icon - Accordion icon styles.\n * @slot (default) - Accordion body content.\n * @slot label - Accordion trigger button content.\n */\n@Component({\n tag: 'pds-accordion',\n styleUrls: ['pds-accordion.scss'],\n shadow: true,\n})\nexport class PdsAccordion {\n private detailsEl: HTMLDetailsElement;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n * @defaultValue null\n */\n @Prop() componentId: string;\n\n /**\n * Can be used to manually set the open state of the accordion.\n * @defaultValue false\n */\n @Prop({\n attribute: 'open',\n mutable: true,\n reflect: true,\n }) isOpen: boolean = false;\n\n @Watch('isOpen')\n handleOpenState(newValue: boolean) {\n this.isOpen = newValue;\n }\n\n private handleToggle = () => {\n this.isOpen = this.detailsEl.open;\n };\n\n private getOpenAttribute = () => {\n if (this.isOpen !== false) {\n return { open: true };\n }\n return '';\n };\n\n componentDidLoad() {\n this.detailsEl.addEventListener('toggle', this.handleToggle);\n }\n\n render() {\n return (\n <Host class=\"pds-accordion\" id={this.componentId}>\n <details {...this.getOpenAttribute()} ref={(el) => (this.detailsEl = el as HTMLDetailsElement)}>\n <summary part=\"accordion-button\">\n <slot name=\"label\">Details</slot>\n <pds-icon icon={downSmall} part=\"accordion-icon\" />\n </summary>\n <div part=\"accordion-body\" class=\"pds-accordion__body\">\n <slot />\n </div>\n </details>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;MAAA,MAAM,eAAe,GAAG,siDAAsiD;;YCejjD,YAAY,4BAAA,MAAA;MALzB,IAAA,WAAA,CAAA,OAAA,EAAA;;MAcE;;;MAGG;MAKA,QAAA,IAAM,CAAA,MAAA,GAAY,KAAK;MAOlB,QAAA,IAAY,CAAA,YAAA,GAAG,MAAK;kBAC1B,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI;MACnC,SAAC;MAEO,QAAA,IAAgB,CAAA,gBAAA,GAAG,MAAK;MAC9B,YAAA,IAAI,IAAI,CAAC,MAAM,KAAK,KAAK,EAAE;MACzB,gBAAA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE;;MAEvB,YAAA,OAAO,EAAE;MACX,SAAC;MAqBF;MAlCC,IAAA,eAAe,CAAC,QAAiB,EAAA;MAC/B,QAAA,IAAI,CAAC,MAAM,GAAG,QAAQ;;UAcxB,gBAAgB,GAAA;cACd,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC;;UAG9D,MAAM,GAAA;MACJ,QAAA,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,KAAK,EAAC,eAAe,EAAC,EAAE,EAAE,IAAI,CAAC,WAAW,EAAA,EAC9C,CAAA,CAAA,SAAA,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAa,IAAI,CAAC,gBAAgB,EAAE,EAAE,EAAA,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,SAAS,GAAG,EAAwB,CAAC,EAAA,CAAA,EAC5F,CAAS,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,kBAAkB,EAAA,EAC9B,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,OAAO,EAAe,EAAA,SAAA,CAAA,EACjC,CAAU,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,SAAS,EAAE,IAAI,EAAC,gBAAgB,GAAG,CAC3C,EACV,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,IAAI,EAAC,gBAAgB,EAAC,KAAK,EAAC,qBAAqB,EAAA,EACpD,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAQ,CACJ,CACE,CACL;;;;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-
|
|
1
|
+
{"version":3,"file":"p-DTMMULoz.system.js","sources":["src/components/pds-loader/pds-loader.scss?tag=pds-loader&encapsulation=shadow","src/components/pds-loader/pds-loader.tsx"],"sourcesContent":[":host {\n --loader-color: var(--pine-color-brand);\n align-items: center;\n display: flex;\n flex-direction: column;\n gap: var(--pine-dimension-xs);\n}\n\n\n:host(.pds-loader--hidden),\n.pds-loader--hidden {\n border-width: 0;\n clip: rect(0, 0, 0, 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n// Default Loader\n.pds-loader--spinner svg {\n --number-spinner-timing: 2s;\n --number-spinner-path-timing: 1.5s;\n\n animation: rotate var(--number-spinner-timing) linear infinite;\n color: var(--loader-color);\n}\n\n.pds-loader__spinner-path {\n stroke-width: 8px;\n}\n\n@keyframes rotate {\n 100% {\n transform: rotate(360deg);\n }\n}\n\n// Typing Loader\n.pds-loader--typing {\n --number-typing-timing: 1s;\n\n --opacity-typing-dot-default: 0.4;\n --opacity-typing-dot-active: 1;\n\n align-items: center;\n background-color: var(--pine-color-background-container-disabled);\n border-radius: var(--pine-dimension-sm);\n box-shadow: var(--pine-box-shadow);\n display: inline-flex;\n gap: var(--pine-dimension-2xs);\n margin-block: var(--pine-dimension-none);\n margin-inline: auto;\n padding-block: 15px;\n padding-inline: 20px;\n position: relative;\n\n span {\n background-color: var(--pine-color-border-hover);\n block-size: 6px;\n border-radius: var(--pine-border-radius-full);\n inline-size: 6px;\n opacity: var(--opacity-typing-dot-default);\n\n @for $i from 1 through 3 {\n &:nth-of-type(#{$i}) {\n animation: var(--number-typing-timing) typing infinite ($i * 0.3333s);\n }\n }\n }\n}\n\n@keyframes typing {\n 50% {\n opacity: var(--opacity-typing-dot-active);\n transform: scale(1.25);\n }\n}\n\n.pds-loader__label {\n --typography-label-default: var(--pine-font-weight-medium) var(--pine-font-size-body-md)/var(--pine-line-height-body) var(--pine-font-family-body);\n\n font: var(--typography-label-default);\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n/**\n * @part loader-svg - Exposes the spinner SVG element for color customization.\n * @slot label - Default slot for Loader label text.\n */\n\n@Component({\n tag: 'pds-loader',\n styleUrls: ['pds-loader.scss'],\n shadow: true,\n})\nexport class PdsLoader {\n /**\n * If false, the loader will be hidden.\n */\n @Prop() isLoading: boolean = true;\n\n /**\n * Determines whether the loader should display a label.\n */\n @Prop() showLabel?: boolean = false;\n\n /**\n * Sets the size of the spinner loader. Value can be preset or custom.\n */\n @Prop({ reflect: true }) size?:\n | 'xs' // 24px\n | 'sm' // 32px\n | 'md' // 48px\n | 'lg' // 64px\n | 'xl' // 80px\n | string = 'md';\n\n /**\n * Determines the type of loader.\n */\n @Prop() variant: 'spinner' | 'typing' = 'spinner';\n\n private loaderSize() {\n const sizes: { [key: string]: string } = {\n xs: '24px',\n sm: '32px',\n md: '48px',\n lg: '64px',\n xl: '80px',\n };\n\n if (sizes[this.size]) {\n return sizes[this.size];\n } else {\n return this.size;\n }\n }\n\n private style = () => {\n if (this.size !== undefined) {\n return {\n height: this.loaderSize(),\n width: this.loaderSize(),\n };\n }\n };\n\n render() {\n return (\n <Host class={`pds-loader ${this.isLoading ? '' : 'pds-loader--hidden'}`} aria-hidden={!this.isLoading} aria-busy={this.isLoading} aria-live=\"polite\">\n {this.variant === 'spinner' && (\n <div class=\"pds-loader--spinner\">\n <svg style={this.style()} viewBox=\"0 0 200 200\" fill=\"none\" part=\"loader-svg\">\n <defs>\n <linearGradient id=\"spinner-secondHalf\">\n <stop offset=\"0%\" stop-opacity=\"0\" stop-color=\"currentColor\" />\n <stop offset=\"100%\" stop-opacity=\"0.5\" stop-color=\"currentColor\" />\n </linearGradient>\n <linearGradient id=\"spinner-firstHalf\">\n <stop offset=\"0%\" stop-opacity=\"1\" stop-color=\"currentColor\" />\n <stop offset=\"100%\" stop-opacity=\"0.5\" stop-color=\"currentColor\" />\n </linearGradient>\n </defs>\n\n <g class=\"pds-loader__spinner-path\">\n <path stroke=\"url(#spinner-secondHalf)\" d=\"M 4 100 A 96 96 0 0 1 196 100\" />\n <path stroke=\"url(#spinner-firstHalf)\" d=\"M 196 100 A 96 96 0 0 1 4 100\" />\n\n <path stroke=\"currentColor\" stroke-linecap=\"round\" d=\"M 4 100 A 96 96 0 0 1 4 98\" />\n </g>\n </svg>\n </div>\n )}\n\n {this.variant === 'typing' && (\n <div class=\"pds-loader--typing\">\n <span></span>\n <span></span>\n <span></span>\n </div>\n )}\n\n <div class={`pds-loader__label ${this.showLabel ? '' : 'pds-loader--hidden'}`}>\n <slot name=\"label\">Loading...</slot>\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-
|
|
1
|
+
{"version":3,"file":"p-DvfECQRp.system.js","sources":["src/components/pds-avatar/pds-avatar.scss?tag=pds-avatar&encapsulation=shadow","src/components/pds-avatar/pds-avatar.tsx"],"sourcesContent":[":host {\n display: inline-block;\n}\n\ndiv {\n // These custom props are not reachable\n --color-background-container: var(--pine-color-mercury-050);\n\n align-items: center;\n background-color: var(--color-background-container);\n border-radius: var(--border-radius-admin-round, var(--pine-border-radius-full));\n display: inline-flex;\n justify-content: center;\n position: relative;\n\n :host(.pds-avatar--admin) & {\n --border-radius-admin-round: var(--pine-dimension-150);\n border-radius: var(--border-radius-admin-round);\n }\n\n // Remove when FF has support for :has\n :host(.pds-avatar--has-image) & {\n background: transparent\n }\n\n @supports selector(:has) {\n &:has(img) {\n background-color: transparent\n }\n }\n}\n\n.pds-avatar__button {\n align-items: center;\n appearance: none;\n background: transparent;\n border: var(--pine-dimension-none);\n border-radius: var(--pine-border-radius-full);\n cursor: pointer;\n display: flex;\n padding: var(--pine-dimension-none);\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n }\n}\n\n.pds-avatar__badge {\n background-color: var(--pine-color-background-container);\n border: var(--pine-border);\n border-color: var(--pine-color-secondary);\n border-radius: var(--pine-border-radius-round);\n inset-block-end: var(--pine-dimension-none);\n inset-inline-end: var(--pine-dimension-none);\n position: absolute;\n}\n\nimg {\n border-radius: var(--border-radius-admin-round, var(--pine-border-radius-full));\n height: 100%;\n object-fit: cover;\n width: 100%;\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport { checkCircleFilled, userFilled } from '@pine-ds/icons/icons';\n\n/**\n * @part image - The main image element that represents the avatar component.\n*/\n@Component({\n tag: 'pds-avatar',\n styleUrls: ['pds-avatar.scss'],\n shadow: true,\n})\nexport class PdsAvatar {\n\n /**\n * The alt for a custom user image.\n * @defaultValue null\n */\n @Prop() alt?: string | null = null;\n\n /**\n * Determines whether the badge is visible or not.\n * @defaultValue false\n */\n @Prop() badge? = false;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Determines whether the avatar functions as a dropdown trigger.\n * @defaultValue false\n */\n @Prop() dropdown? = false;\n\n /**\n * The src for a custom user image.\n * @defaultValue null\n */\n @Prop() image?: string | null = null;\n\n /**\n * Size of the avatar. Value can be preset or custom.\n * @defaultValue lg\n */\n @Prop({ reflect: true }) size?:\n | 'xl' // 64px\n | 'lg' // 56px\n | 'md' // 40px\n | 'sm' // 32px\n | 'xs' // 24px\n | string = 'lg';\n\n /**\n * Determines the variant of avatar. Changes appearance accordingly.\n * @defaultValue customer\n */\n @Prop({ reflect: true }) variant?: 'customer' | 'admin' = 'customer';\n\n private avatarSize() {\n const sizes: { [key: string]: any } = {\n xs: '24px',\n sm: '32px',\n md: '40px',\n lg: '56px',\n xl: '64px',\n }\n\n if (sizes[this.size]) {\n return sizes[this.size];\n } else {\n return this.size\n }\n }\n\n private renderAssetWrapper = () => {\n const style = {\n height: this.avatarSize(),\n width: this.avatarSize()\n };\n\n return (\n <div style={style} part=\"asset-wrapper\">\n {this.renderIconOrImage()}\n {this.renderBadge()}\n </div>\n )\n };\n\n private renderAvatar = () => {\n return (\n this.dropdown\n ?\n <button class=\"pds-avatar__button\" type=\"button\" aria-label=\"Avatar dropdown trigger\">\n {this.renderAssetWrapper()}\n </button>\n :\n this.renderAssetWrapper()\n )\n };\n\n private renderBadge = () => (\n this.badge\n // Percentage is average size of icon in relation to total avatar size\n // of all preset sizes found in Figma.\n // Used to allow icons to scale to container size\n && <pds-icon color=\"var(--pine-color-purple-600)\" class=\"pds-avatar__badge\" icon={checkCircleFilled} size=\"33.53%\"></pds-icon>\n );\n\n private renderIconOrImage = () => (\n this.image\n ? <img alt={this.alt} src={this.image} />\n // Percentage is average size of icon in relation to total avatar size\n // of all preset sizes found in Figma.\n // Used to allow icons to scale to container size\n : <pds-icon color=\"var(--pine-color-mercury-500)\" icon={userFilled} size=\"33.53%\"></pds-icon>\n );\n\n private classNames = () => (\n {\n 'pds-avatar': true,\n [`pds-avatar--has-image`]: this.image !== '' && this.image !== null, // Remove when FF supports :has selector\n [`pds-avatar--${this.variant}`]: this.variant === 'admin'\n }\n );\n\n render() {\n\n return (\n <Host\n id={this.componentId}\n class={{...this.classNames()}}\n >\n {this.renderAvatar()}\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-DwjNklzi.js","sources":["src/utils/form.ts"],"sourcesContent":["/**\n * Create id for messaging\n */\nexport const messageId = (id: string, messageType: string) => {\n return `${id}__${messageType}-message`;\n};\n\n/**\n * Assign aria-description id to relate messages with form element\n */\nexport const assignDescription = (id: string, invalid: boolean, helperMessage: string) => {\n if (!helperMessage) return\n\n let relatedId = messageId(id, 'helper')\n\n if (invalid) relatedId = messageId(id, 'error');\n\n return relatedId;\n};\n\n/**\n * Updates the `invalid` prop of a form element based on it's values validity\n */\nexport const isRequired = (target, component) => {\n if ( !target || !component ) return;\n if (component.required === true) {\n (target.checkValidity() === false) ? component.invalid = true : component.invalid = false;\n }\n}\n\n/**\n * Exposes a readonly type property on a custom form element to match native form element behavior.\n * This makes the type property enumerable and accessible via element.type, matching native HTML elements.\n * The property is non-configurable, preventing it from being redefined or deleted at runtime.\n
|
|
1
|
+
{"version":3,"file":"p-DwjNklzi.js","sources":["src/utils/form.ts"],"sourcesContent":["/**\n * Create id for messaging\n */\nexport const messageId = (id: string, messageType: string) => {\n return `${id}__${messageType}-message`;\n};\n\n/**\n * Assign aria-description id to relate messages with form element\n */\nexport const assignDescription = (id: string, invalid: boolean, helperMessage: string) => {\n if (!helperMessage) return\n\n let relatedId = messageId(id, 'helper')\n\n if (invalid) relatedId = messageId(id, 'error');\n\n return relatedId;\n};\n\n/**\n * Updates the `invalid` prop of a form element based on it's values validity\n */\nexport const isRequired = (target, component) => {\n if ( !target || !component ) return;\n if (component.required === true) {\n (target.checkValidity() === false) ? component.invalid = true : component.invalid = false;\n }\n}\n\n/**\n * Exposes a readonly type property on a custom form element to match native form element behavior.\n * This makes the type property enumerable and accessible via element.type, matching native HTML elements.\n * The property is non-configurable, preventing it from being redefined or deleted at runtime.\n *\n * @param element - The custom element to add the type property to\n * @param type - The type value (string literal) or a getter function that returns the type\n */\nexport function exposeTypeProperty(element: Element, type: string | (() => string)) {\n Object.defineProperty(element, 'type', {\n get: typeof type === 'function' ? type : () => type,\n enumerable: true,\n configurable: false\n });\n}\n"],"names":[],"mappings":"AAAA;;AAEG;MACU,SAAS,GAAG,CAAC,EAAU,EAAE,WAAmB,KAAI;AAC3D,IAAA,OAAO,CAAG,EAAA,EAAE,CAAK,EAAA,EAAA,WAAW,UAAU;AACxC;AAEA;;AAEG;AACU,MAAA,iBAAiB,GAAG,CAAC,EAAU,EAAE,OAAgB,EAAE,aAAqB,KAAI;AACvF,IAAA,IAAI,CAAC,aAAa;QAAE;IAEpB,IAAI,SAAS,GAAG,SAAS,CAAC,EAAE,EAAE,QAAQ,CAAC;AAEvC,IAAA,IAAI,OAAO;AAAE,QAAA,SAAS,GAAG,SAAS,CAAC,EAAE,EAAE,OAAO,CAAC;AAE/C,IAAA,OAAO,SAAS;AAClB;AAEA;;AAEG;MACU,UAAU,GAAG,CAAC,MAAM,EAAE,SAAS,KAAI;AAC9C,IAAA,IAAK,CAAC,MAAM,IAAI,CAAC,SAAS;QAAG;AAC7B,IAAA,IAAI,SAAS,CAAC,QAAQ,KAAK,IAAI,EAAE;QAC/B,CAAC,MAAM,CAAC,aAAa,EAAE,KAAK,KAAK,IAAI,SAAS,CAAC,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC,OAAO,GAAG,KAAK;;AAE7F;AAEA;;;;;;;AAOG;AACa,SAAA,kBAAkB,CAAC,OAAgB,EAAE,IAA6B,EAAA;AAChF,IAAA,MAAM,CAAC,cAAc,CAAC,OAAO,EAAE,MAAM,EAAE;AACrC,QAAA,GAAG,EAAE,OAAO,IAAI,KAAK,UAAU,GAAG,IAAI,GAAG,MAAM,IAAI;AACnD,QAAA,UAAU,EAAE,IAAI;AAChB,QAAA,YAAY,EAAE;AACf,KAAA,CAAC;AACJ;;;;"}
|