@pine-ds/core 3.26.1 → 3.26.3
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/mock-pds-modal.js +1 -1
- package/components/mock-pds-modal.js.map +1 -1
- package/components/pds-button2.js +1 -1
- package/components/pds-button2.js.map +1 -1
- package/components/pds-checkbox2.js +1 -1
- package/components/pds-checkbox2.js.map +1 -1
- package/components/pds-combobox.js +3 -3
- package/components/pds-combobox.js.map +1 -1
- package/components/pds-filter.js +14 -10
- package/components/pds-filter.js.map +1 -1
- package/components/pds-input.js +5 -2
- package/components/pds-input.js.map +1 -1
- package/components/pds-modal.js +1 -1
- package/components/pds-modal.js.map +1 -1
- package/components/pds-select.js +1 -1
- package/components/pds-select.js.map +1 -1
- package/components/pds-switch.js +1 -1
- package/components/pds-switch.js.map +1 -1
- package/components/pds-table-cell2.js +5 -4
- package/components/pds-table-cell2.js.map +1 -1
- package/components/pds-table-head-cell2.js +5 -4
- package/components/pds-table-head-cell2.js.map +1 -1
- package/components/pds-table.js +12 -10
- package/components/pds-table.js.map +1 -1
- package/components/pds-tooltip.js +1 -1
- package/components/pds-tooltip.js.map +1 -1
- package/components/scroll.js +78 -0
- package/components/scroll.js.map +1 -0
- package/dist/cjs/{index-Dlc5O3n_.js → index-BYnQkA7p.js} +3 -3
- package/dist/cjs/index-BYnQkA7p.js.map +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/mock-pds-modal.cjs.entry.js +2 -2
- package/dist/cjs/mock-pds-modal.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-accordion.cjs.entry.js +1 -1
- package/dist/cjs/pds-alert.cjs.entry.js +1 -1
- package/dist/cjs/pds-avatar.cjs.entry.js +1 -1
- package/dist/cjs/pds-box.cjs.entry.js +1 -1
- package/dist/cjs/pds-button.cjs.entry.js +2 -2
- package/dist/cjs/pds-button.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-checkbox.cjs.entry.js +2 -2
- package/dist/cjs/pds-checkbox.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-chip.cjs.entry.js +1 -1
- package/dist/cjs/pds-combobox.cjs.entry.js +4 -4
- package/dist/cjs/pds-combobox.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-container.cjs.entry.js +1 -1
- package/dist/cjs/pds-copytext.cjs.entry.js +1 -1
- package/dist/cjs/pds-divider.cjs.entry.js +1 -1
- package/dist/cjs/pds-dropdown-menu-item.cjs.entry.js +1 -1
- package/dist/cjs/pds-dropdown-menu-separator.cjs.entry.js +1 -1
- package/dist/cjs/pds-dropdown-menu.cjs.entry.js +1 -1
- package/dist/cjs/pds-filter.cjs.entry.js +15 -11
- package/dist/cjs/pds-filter.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-filters.cjs.entry.js +1 -1
- package/dist/cjs/pds-icon.cjs.entry.js +1 -1
- package/dist/cjs/pds-image.cjs.entry.js +1 -1
- package/dist/cjs/pds-input.cjs.entry.js +6 -3
- package/dist/cjs/pds-input.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-link.cjs.entry.js +1 -1
- package/dist/cjs/pds-loader.cjs.entry.js +1 -1
- package/dist/cjs/pds-modal-content.cjs.entry.js +1 -1
- package/dist/cjs/pds-modal-footer.cjs.entry.js +1 -1
- package/dist/cjs/pds-modal-header.cjs.entry.js +1 -1
- package/dist/cjs/pds-modal.cjs.entry.js +2 -2
- package/dist/cjs/pds-modal.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-multiselect.cjs.entry.js +1 -1
- package/dist/cjs/pds-popover.cjs.entry.js +1 -1
- package/dist/cjs/pds-progress.cjs.entry.js +1 -1
- package/dist/cjs/pds-property.cjs.entry.js +1 -1
- package/dist/cjs/pds-radio-group.cjs.entry.js +1 -1
- package/dist/cjs/pds-radio.cjs.entry.js +1 -1
- package/dist/cjs/pds-row.cjs.entry.js +1 -1
- package/dist/cjs/pds-select.cjs.entry.js +2 -2
- package/dist/cjs/pds-select.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-sortable-item.cjs.entry.js +1 -1
- package/dist/cjs/pds-sortable.cjs.entry.js +1 -1
- package/dist/cjs/pds-switch.cjs.entry.js +2 -2
- package/dist/cjs/pds-switch.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-tab.cjs.entry.js +1 -1
- package/dist/cjs/pds-table-body.cjs.entry.js +1 -1
- package/dist/cjs/pds-table-cell.cjs.entry.js +6 -5
- package/dist/cjs/pds-table-cell.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-table-head-cell.cjs.entry.js +6 -5
- package/dist/cjs/pds-table-head-cell.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-table-head.cjs.entry.js +1 -1
- package/dist/cjs/pds-table-row.cjs.entry.js +1 -1
- package/dist/cjs/pds-table.cjs.entry.js +13 -11
- package/dist/cjs/pds-table.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-tabpanel.cjs.entry.js +1 -1
- package/dist/cjs/pds-tabs.cjs.entry.js +1 -1
- package/dist/cjs/pds-text.cjs.entry.js +1 -1
- package/dist/cjs/pds-textarea.cjs.entry.js +1 -1
- package/dist/cjs/pds-toast.cjs.entry.js +1 -1
- package/dist/cjs/pds-tooltip.cjs.entry.js +2 -2
- package/dist/cjs/pds-tooltip.entry.cjs.js.map +1 -1
- package/dist/cjs/pine-core.cjs.js +1 -1
- package/dist/cjs/scroll-2XcoE_6Q.js +82 -0
- package/dist/cjs/scroll-2XcoE_6Q.js.map +1 -0
- package/dist/collection/components/pds-button/pds-button.css +1 -1
- package/dist/collection/components/pds-checkbox/pds-checkbox.css +10 -6
- package/dist/collection/components/pds-combobox/pds-combobox.css +2 -2
- package/dist/collection/components/pds-combobox/pds-combobox.js +2 -2
- package/dist/collection/components/pds-combobox/pds-combobox.js.map +1 -1
- package/dist/collection/components/pds-filters/pds-filter/pds-filter.css +11 -9
- package/dist/collection/components/pds-filters/pds-filter/pds-filter.js +13 -9
- package/dist/collection/components/pds-filters/pds-filter/pds-filter.js.map +1 -1
- package/dist/collection/components/pds-input/pds-input.css +7 -3
- package/dist/collection/components/pds-input/pds-input.js +4 -1
- package/dist/collection/components/pds-input/pds-input.js.map +1 -1
- package/dist/collection/components/pds-modal/pds-modal.css +2 -1
- package/dist/collection/components/pds-select/pds-select.css +8 -5
- package/dist/collection/components/pds-switch/pds-switch.css +4 -4
- package/dist/collection/components/pds-table/pds-table-cell/pds-table-cell.css +6 -1
- package/dist/collection/components/pds-table/pds-table-cell/pds-table-cell.js +4 -3
- package/dist/collection/components/pds-table/pds-table-cell/pds-table-cell.js.map +1 -1
- package/dist/collection/components/pds-table/pds-table-head-cell/pds-table-head-cell.css +6 -1
- package/dist/collection/components/pds-table/pds-table-head-cell/pds-table-head-cell.js +4 -3
- package/dist/collection/components/pds-table/pds-table-head-cell/pds-table-head-cell.js.map +1 -1
- package/dist/collection/components/pds-table/pds-table.css +16 -6
- package/dist/collection/components/pds-table/pds-table.js +11 -9
- package/dist/collection/components/pds-table/pds-table.js.map +1 -1
- package/dist/collection/components/pds-tooltip/pds-tooltip.css +2 -1
- package/dist/collection/utils/scroll.js +78 -0
- package/dist/collection/utils/scroll.js.map +1 -0
- package/dist/collection/utils/test/axe.js +101 -0
- package/dist/collection/utils/test/axe.js.map +1 -0
- package/dist/docs.json +1 -1
- package/dist/esm/{index-CO9kz-Pi.js → index-QYCDCKN2.js} +3 -3
- package/dist/esm/index-QYCDCKN2.js.map +1 -0
- package/dist/esm/loader.js +2 -2
- package/dist/esm/mock-pds-modal.entry.js +2 -2
- package/dist/esm/mock-pds-modal.entry.js.map +1 -1
- package/dist/esm/pds-accordion.entry.js +1 -1
- package/dist/esm/pds-alert.entry.js +1 -1
- package/dist/esm/pds-avatar.entry.js +1 -1
- package/dist/esm/pds-box.entry.js +1 -1
- package/dist/esm/pds-button.entry.js +2 -2
- package/dist/esm/pds-button.entry.js.map +1 -1
- package/dist/esm/pds-checkbox.entry.js +2 -2
- package/dist/esm/pds-checkbox.entry.js.map +1 -1
- package/dist/esm/pds-chip.entry.js +1 -1
- package/dist/esm/pds-combobox.entry.js +4 -4
- package/dist/esm/pds-combobox.entry.js.map +1 -1
- package/dist/esm/pds-container.entry.js +1 -1
- package/dist/esm/pds-copytext.entry.js +1 -1
- package/dist/esm/pds-divider.entry.js +1 -1
- package/dist/esm/pds-dropdown-menu-item.entry.js +1 -1
- package/dist/esm/pds-dropdown-menu-separator.entry.js +1 -1
- package/dist/esm/pds-dropdown-menu.entry.js +1 -1
- package/dist/esm/pds-filter.entry.js +15 -11
- package/dist/esm/pds-filter.entry.js.map +1 -1
- package/dist/esm/pds-filters.entry.js +1 -1
- package/dist/esm/pds-icon.entry.js +1 -1
- package/dist/esm/pds-image.entry.js +1 -1
- package/dist/esm/pds-input.entry.js +6 -3
- package/dist/esm/pds-input.entry.js.map +1 -1
- package/dist/esm/pds-link.entry.js +1 -1
- package/dist/esm/pds-loader.entry.js +1 -1
- package/dist/esm/pds-modal-content.entry.js +1 -1
- package/dist/esm/pds-modal-footer.entry.js +1 -1
- package/dist/esm/pds-modal-header.entry.js +1 -1
- package/dist/esm/pds-modal.entry.js +2 -2
- package/dist/esm/pds-modal.entry.js.map +1 -1
- package/dist/esm/pds-multiselect.entry.js +1 -1
- package/dist/esm/pds-popover.entry.js +1 -1
- package/dist/esm/pds-progress.entry.js +1 -1
- package/dist/esm/pds-property.entry.js +1 -1
- package/dist/esm/pds-radio-group.entry.js +1 -1
- package/dist/esm/pds-radio.entry.js +1 -1
- package/dist/esm/pds-row.entry.js +1 -1
- package/dist/esm/pds-select.entry.js +2 -2
- package/dist/esm/pds-select.entry.js.map +1 -1
- package/dist/esm/pds-sortable-item.entry.js +1 -1
- package/dist/esm/pds-sortable.entry.js +1 -1
- package/dist/esm/pds-switch.entry.js +2 -2
- package/dist/esm/pds-switch.entry.js.map +1 -1
- package/dist/esm/pds-tab.entry.js +1 -1
- package/dist/esm/pds-table-body.entry.js +1 -1
- package/dist/esm/pds-table-cell.entry.js +6 -5
- package/dist/esm/pds-table-cell.entry.js.map +1 -1
- package/dist/esm/pds-table-head-cell.entry.js +6 -5
- package/dist/esm/pds-table-head-cell.entry.js.map +1 -1
- package/dist/esm/pds-table-head.entry.js +1 -1
- package/dist/esm/pds-table-row.entry.js +1 -1
- package/dist/esm/pds-table.entry.js +13 -11
- package/dist/esm/pds-table.entry.js.map +1 -1
- package/dist/esm/pds-tabpanel.entry.js +1 -1
- package/dist/esm/pds-tabs.entry.js +1 -1
- package/dist/esm/pds-text.entry.js +1 -1
- package/dist/esm/pds-textarea.entry.js +1 -1
- package/dist/esm/pds-toast.entry.js +1 -1
- package/dist/esm/pds-tooltip.entry.js +2 -2
- package/dist/esm/pds-tooltip.entry.js.map +1 -1
- package/dist/esm/pine-core.js +2 -2
- package/dist/esm/scroll-DtgUQhjl.js +78 -0
- package/dist/esm/scroll-DtgUQhjl.js.map +1 -0
- package/dist/esm-es5/{index-CO9kz-Pi.js → index-QYCDCKN2.js} +3 -3
- package/dist/esm-es5/index-QYCDCKN2.js.map +1 -0
- package/dist/esm-es5/loader.js +1 -1
- package/dist/esm-es5/mock-pds-modal.entry.js +1 -1
- package/dist/esm-es5/mock-pds-modal.entry.js.map +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-checkbox.entry.js.map +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-combobox.entry.js.map +1 -1
- package/dist/esm-es5/pds-container.entry.js +1 -1
- package/dist/esm-es5/pds-copytext.entry.js +1 -1
- package/dist/esm-es5/pds-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-filter.entry.js +1 -1
- package/dist/esm-es5/pds-filter.entry.js.map +1 -1
- package/dist/esm-es5/pds-filters.entry.js +1 -1
- package/dist/esm-es5/pds-icon.entry.js +1 -1
- package/dist/esm-es5/pds-image.entry.js +1 -1
- package/dist/esm-es5/pds-input.entry.js +1 -1
- package/dist/esm-es5/pds-input.entry.js.map +1 -1
- package/dist/esm-es5/pds-link.entry.js +1 -1
- package/dist/esm-es5/pds-loader.entry.js +1 -1
- package/dist/esm-es5/pds-modal-content.entry.js +1 -1
- package/dist/esm-es5/pds-modal-footer.entry.js +1 -1
- package/dist/esm-es5/pds-modal-header.entry.js +1 -1
- package/dist/esm-es5/pds-modal.entry.js +1 -1
- package/dist/esm-es5/pds-modal.entry.js.map +1 -1
- package/dist/esm-es5/pds-multiselect.entry.js +1 -1
- package/dist/esm-es5/pds-popover.entry.js +1 -1
- package/dist/esm-es5/pds-progress.entry.js +1 -1
- package/dist/esm-es5/pds-property.entry.js +1 -1
- package/dist/esm-es5/pds-radio-group.entry.js +1 -1
- package/dist/esm-es5/pds-radio.entry.js +1 -1
- package/dist/esm-es5/pds-row.entry.js +1 -1
- package/dist/esm-es5/pds-select.entry.js +1 -1
- package/dist/esm-es5/pds-select.entry.js.map +1 -1
- package/dist/esm-es5/pds-sortable-item.entry.js +1 -1
- package/dist/esm-es5/pds-sortable.entry.js +1 -1
- package/dist/esm-es5/pds-switch.entry.js +1 -1
- package/dist/esm-es5/pds-switch.entry.js.map +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-cell.entry.js.map +1 -1
- package/dist/esm-es5/pds-table-head-cell.entry.js +1 -1
- package/dist/esm-es5/pds-table-head-cell.entry.js.map +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-table.entry.js.map +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/pds-tooltip.entry.js.map +1 -1
- package/dist/esm-es5/pine-core.js +1 -1
- package/dist/esm-es5/scroll-DtgUQhjl.js +2 -0
- package/dist/esm-es5/scroll-DtgUQhjl.js.map +1 -0
- package/dist/pine-core/mock-pds-modal.entry.esm.js.map +1 -1
- package/dist/pine-core/p-043395a8.entry.js +2 -0
- package/dist/pine-core/{p-8d0c1f6d.entry.js.map → p-043395a8.entry.js.map} +1 -1
- package/dist/pine-core/{p-932f4860.entry.js → p-07a19657.entry.js} +2 -2
- package/dist/pine-core/p-08267d86.system.entry.js +2 -0
- package/dist/pine-core/{p-93b379c2.system.entry.js.map → p-08267d86.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-ed781905.system.entry.js → p-0bc89023.system.entry.js} +2 -2
- package/dist/pine-core/p-0ca1dada.entry.js +2 -0
- package/dist/pine-core/{p-b63c7247.entry.js.map → p-0ca1dada.entry.js.map} +1 -1
- package/dist/pine-core/{p-26aa3195.entry.js → p-0d3a6abc.entry.js} +2 -2
- package/dist/pine-core/p-0jF8lVUy.system.js.map +1 -0
- package/dist/pine-core/{p-e7e166f2.entry.js → p-1256b83e.entry.js} +2 -2
- package/dist/pine-core/p-1700705c.entry.js +2 -0
- package/dist/pine-core/{p-952b41e5.system.entry.js → p-1d7cbf49.system.entry.js} +2 -2
- package/dist/pine-core/p-1eJB2hvd.system.js.map +1 -0
- package/dist/pine-core/{p-DkENjswB.system.js.map → p-1hZDd74J.system.js.map} +1 -1
- package/dist/pine-core/{p-205d8c56.entry.js → p-21a858a0.entry.js} +2 -2
- package/dist/pine-core/{p-3c864e3d.entry.js → p-2335222d.entry.js} +2 -2
- package/dist/pine-core/p-24656fd4.entry.js +2 -0
- package/dist/pine-core/p-24656fd4.entry.js.map +1 -0
- package/dist/pine-core/p-2549e386.system.entry.js +2 -0
- package/dist/pine-core/{p-7bc34bce.system.entry.js.map → p-2549e386.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-24f9a03b.system.entry.js → p-2728bb30.system.entry.js} +2 -2
- package/dist/pine-core/p-2a4be282.entry.js +3 -0
- package/dist/pine-core/{p-127a84bf.entry.js.map → p-2a4be282.entry.js.map} +1 -1
- package/dist/pine-core/{p-9e073662.entry.js → p-2c88b85e.entry.js} +2 -2
- package/dist/pine-core/{p-bd277581.entry.js → p-2dcd369d.entry.js} +2 -2
- package/dist/pine-core/{p-9d7f17a4.system.entry.js → p-30302dbb.system.entry.js} +2 -2
- package/dist/pine-core/{p-5552ca6b.system.entry.js → p-33fd214a.system.entry.js} +2 -2
- package/dist/pine-core/{p-8b997cb3.entry.js → p-360130c2.entry.js} +2 -2
- package/dist/pine-core/{p-0f037132.system.entry.js → p-3824d80d.system.entry.js} +2 -2
- package/dist/pine-core/{p-94fde072.system.entry.js → p-3c89502e.system.entry.js} +2 -2
- package/dist/pine-core/{p-1fd52c1b.system.entry.js → p-3d0f3dcb.system.entry.js} +2 -2
- package/dist/pine-core/p-3eae6f9f.system.entry.js +2 -0
- package/dist/pine-core/{p-617dc902.system.entry.js.map → p-3eae6f9f.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-69221099.system.entry.js → p-3f4435b8.system.entry.js} +2 -2
- package/dist/pine-core/{p-13821696.entry.js → p-43565cf5.entry.js} +2 -2
- package/dist/pine-core/{p-d90f7fe4.entry.js → p-44318b5c.entry.js} +2 -2
- package/dist/pine-core/{p-e0862ab5.entry.js → p-4728c80a.entry.js} +2 -2
- package/dist/pine-core/{p-dd9888e9.entry.js → p-4a4048f3.entry.js} +2 -2
- package/dist/pine-core/p-4e79023c.system.entry.js +2 -0
- package/dist/pine-core/p-4e79023c.system.entry.js.map +1 -0
- package/dist/pine-core/{p-dc724dee.entry.js → p-4fc48330.entry.js} +2 -2
- package/dist/pine-core/{p-0561744f.entry.js → p-500ef8ee.entry.js} +2 -2
- package/dist/pine-core/{p-a76a454f.system.entry.js → p-528d50eb.system.entry.js} +2 -2
- package/dist/pine-core/p-56aedf71.entry.js +2 -0
- package/dist/pine-core/{p-61674647.entry.js.map → p-56aedf71.entry.js.map} +1 -1
- package/dist/pine-core/{p-128a483e.system.entry.js → p-58bd1590.system.entry.js} +2 -2
- package/dist/pine-core/p-5b521b20.entry.js +2 -0
- package/dist/pine-core/p-5c259f42.system.entry.js +4 -0
- package/dist/pine-core/{p-ea94b002.system.entry.js.map → p-5c259f42.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-519d44b8.entry.js → p-5f9a6f53.entry.js} +2 -2
- package/dist/pine-core/{p-7d9f7018.entry.js → p-61bcaaee.entry.js} +2 -2
- package/dist/pine-core/p-621405fc.entry.js +2 -0
- package/dist/pine-core/{p-4beb8ae5.entry.js.map → p-621405fc.entry.js.map} +1 -1
- package/dist/pine-core/p-65224129.system.entry.js +2 -0
- package/dist/pine-core/{p-c746c9ad.system.entry.js.map → p-65224129.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-0bf1fee1.entry.js → p-67a81e55.entry.js} +2 -2
- package/dist/pine-core/{p-c5dc1e2d.system.entry.js → p-6a20ba14.system.entry.js} +2 -2
- package/dist/pine-core/p-6af000e5.entry.js +2 -0
- package/dist/pine-core/{p-54e967ca.entry.js.map → p-6af000e5.entry.js.map} +1 -1
- package/dist/pine-core/{p-8731836c.entry.js → p-6c836757.entry.js} +2 -2
- package/dist/pine-core/p-6c9bb2a5.entry.js +2 -0
- package/dist/pine-core/{p-61c885c7.entry.js.map → p-6c9bb2a5.entry.js.map} +1 -1
- package/dist/pine-core/{p-42d83b1f.entry.js → p-6ca31ddd.entry.js} +2 -2
- package/dist/pine-core/p-6f4f62ff.system.entry.js +2 -0
- package/dist/pine-core/p-6f4f62ff.system.entry.js.map +1 -0
- package/dist/pine-core/{p-c299c019.system.entry.js → p-74486022.system.entry.js} +2 -2
- package/dist/pine-core/p-7456ae7a.system.entry.js +2 -0
- package/dist/pine-core/{p-00e487c4.system.entry.js.map → p-7456ae7a.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-6ff1d23e.entry.js → p-77807b63.entry.js} +2 -2
- package/dist/pine-core/p-78184199.entry.js +2 -0
- package/dist/pine-core/p-78184199.entry.js.map +1 -0
- package/dist/pine-core/{p-5df670e9.entry.js → p-7ba75e19.entry.js} +3 -3
- package/dist/pine-core/p-7u7MeeeZ.system.js.map +1 -0
- package/dist/pine-core/{p-fd6e7155.entry.js → p-847ca369.entry.js} +2 -2
- package/dist/pine-core/p-859aa3b0.entry.js +2 -0
- package/dist/pine-core/{p-ec974e1d.entry.js.map → p-859aa3b0.entry.js.map} +1 -1
- package/dist/pine-core/{p-2c48e33c.entry.js → p-8c8048df.entry.js} +2 -2
- package/dist/pine-core/{p-6acc2e5b.system.entry.js → p-8dea1946.system.entry.js} +2 -2
- package/dist/pine-core/{p-Cng7Mtub.system.js.map → p-8nqjUIna.system.js.map} +1 -1
- package/dist/pine-core/{p-0d4b2bbc.system.entry.js → p-9120a7fa.system.entry.js} +2 -2
- package/dist/pine-core/{p-35d9e3c8.system.entry.js → p-97d5a937.system.entry.js} +2 -2
- package/dist/pine-core/{p-4993f30e.system.entry.js → p-97e0b205.system.entry.js} +2 -2
- package/dist/pine-core/{p-a713fedd.system.entry.js → p-98332835.system.entry.js} +2 -2
- package/dist/pine-core/{p-939ae09f.entry.js → p-99739465.entry.js} +2 -2
- package/dist/pine-core/{p-Djhe2zUv.system.js → p-9X_erY0S.system.js} +2 -2
- package/dist/pine-core/{p-Djhe2zUv.system.js.map → p-9X_erY0S.system.js.map} +1 -1
- package/dist/pine-core/{p-3524e30c.system.entry.js → p-9a2dc18d.system.entry.js} +2 -2
- package/dist/pine-core/{p-06fbdc35.entry.js → p-9e62532d.entry.js} +2 -2
- package/dist/pine-core/{p-1768ad5e.entry.js → p-9e98793e.entry.js} +2 -2
- package/dist/pine-core/{p-BMWZMLrp.system.js.map → p-B5hxTy5U.system.js.map} +1 -1
- package/dist/pine-core/p-B8wXrRCn.system.js.map +1 -0
- package/dist/pine-core/p-BEk_6bpE.system.js.map +1 -0
- package/dist/pine-core/{p-CIRw0SFV.system.js.map → p-BHr70Hts.system.js.map} +1 -1
- package/dist/pine-core/{p-iOyU21aP.system.js.map → p-BILA6IDX.system.js.map} +1 -1
- package/dist/pine-core/{p-D504xCQQ.system.js.map → p-BR3EzrR2.system.js.map} +1 -1
- package/dist/pine-core/{p-VWcPIY1a.system.js.map → p-BWYstZfx.system.js.map} +1 -1
- package/dist/pine-core/{p-DWrLi0lj.system.js.map → p-B_ue56xA.system.js.map} +1 -1
- package/dist/pine-core/{p-xKyEDmi0.system.js.map → p-Bdrd1hDP.system.js.map} +1 -1
- package/dist/pine-core/{p-DUvF_h4G.system.js.map → p-BfwVCQ2C.system.js.map} +1 -1
- package/dist/pine-core/{p-BYHypIS4.system.js.map → p-BhXECqd_.system.js.map} +1 -1
- package/dist/pine-core/{p-CNgeZOJ8.system.js.map → p-Bq2VWG-F.system.js.map} +1 -1
- package/dist/pine-core/{p-B7_7oNQG.system.js.map → p-BtZYIh3H.system.js.map} +1 -1
- package/dist/pine-core/p-BzszOvm1.system.js.map +1 -0
- package/dist/pine-core/p-C0XRql_j.system.js.map +1 -0
- package/dist/pine-core/{p-M5aqIQje.system.js.map → p-C0r-Omcz.system.js.map} +1 -1
- package/dist/pine-core/p-C2Pw0xAP.system.js.map +1 -0
- package/dist/pine-core/p-C6LTEDPh.system.js.map +1 -0
- package/dist/pine-core/{p-BjaDq65J.system.js.map → p-C8wBjwhX.system.js.map} +1 -1
- package/dist/pine-core/{p-CeUxuw8r.system.js.map → p-CG-Uj3mN.system.js.map} +1 -1
- package/dist/pine-core/{p-D2CTdoEq.system.js.map → p-CIRsbQAW.system.js.map} +1 -1
- package/dist/pine-core/{p-B2EsHCoA.system.js.map → p-CKshb3YH.system.js.map} +1 -1
- package/dist/pine-core/{p-D4yK_qVB.system.js.map → p-CMbqUapr.system.js.map} +1 -1
- package/dist/pine-core/{p-BD9ysh2r.system.js.map → p-CQS3Y0nn.system.js.map} +1 -1
- package/dist/pine-core/p-CX0Csdth.system.js.map +1 -0
- package/dist/pine-core/{p-BwqSEhik.system.js.map → p-CZSA3A1S.system.js.map} +1 -1
- package/dist/pine-core/{p-BuXqrZlE.system.js.map → p-CbRVp4gv.system.js.map} +1 -1
- package/dist/pine-core/{p-C08fY97u.system.js.map → p-CfyFDUw5.system.js.map} +1 -1
- package/dist/pine-core/{p-BLil033h.system.js.map → p-CgPvrU-c.system.js.map} +1 -1
- package/dist/pine-core/{p-DFd5KJNr.system.js.map → p-CjuuQ5fk.system.js.map} +1 -1
- package/dist/pine-core/{p-Bm0i20zh.system.js.map → p-Ck9i0WVa.system.js.map} +1 -1
- package/dist/pine-core/{p-0mArGKTT.system.js.map → p-Cm5r7dPz.system.js.map} +1 -1
- package/dist/pine-core/{p-DxU4fApL.system.js.map → p-CtZbV7sl.system.js.map} +1 -1
- package/dist/pine-core/{p-DDgPxucg.system.js.map → p-CwlStDlm.system.js.map} +1 -1
- package/dist/pine-core/{p-B1bh2Wvv.system.js → p-CyJVqIlm.system.js} +3 -3
- package/dist/pine-core/p-CyJVqIlm.system.js.map +1 -0
- package/dist/pine-core/p-D2ZsBdFi.system.js.map +1 -0
- package/dist/pine-core/{p-1S7sNRrT.system.js.map → p-DSfc0hSW.system.js.map} +1 -1
- package/dist/pine-core/p-DUOWHRqL.system.js.map +1 -0
- package/dist/pine-core/{p-sB8ZB68H.system.js.map → p-DUaDwLU_.system.js.map} +1 -1
- package/dist/pine-core/p-DVra397g.system.js +2 -0
- package/dist/pine-core/p-DVra397g.system.js.map +1 -0
- package/dist/pine-core/p-D_X9pwRF.system.js.map +1 -0
- package/dist/pine-core/{p-CoxD4Fzc.system.js.map → p-Dn6xWpZX.system.js.map} +1 -1
- package/dist/pine-core/{p-4d6YziBa.system.js.map → p-Dt4eN_hu.system.js.map} +1 -1
- package/dist/pine-core/{p-MtzjfzAh.system.js.map → p-DtKEcQXo.system.js.map} +1 -1
- package/dist/pine-core/p-DtgUQhjl.js +2 -0
- package/dist/pine-core/p-DtgUQhjl.js.map +1 -0
- package/dist/pine-core/{p-IrhpBtZN.system.js.map → p-DuIwxDGo.system.js.map} +1 -1
- package/dist/pine-core/{p-5MZ-y5Ap.system.js.map → p-KgPSFwRc.system.js.map} +1 -1
- package/dist/pine-core/{p-CO9kz-Pi.js → p-QYCDCKN2.js} +3 -3
- package/dist/pine-core/{p-B1bh2Wvv.system.js.map → p-QYCDCKN2.js.map} +1 -1
- package/dist/pine-core/{p-05771ef2.system.entry.js → p-a6ab979f.system.entry.js} +2 -2
- package/dist/pine-core/p-a80f68ce.entry.js +2 -0
- package/dist/pine-core/p-a80f68ce.entry.js.map +1 -0
- package/dist/pine-core/{p-b272656d.system.entry.js → p-a81aa273.system.entry.js} +2 -2
- package/dist/pine-core/{p-63fd14b1.system.entry.js → p-a896db32.system.entry.js} +2 -2
- package/dist/pine-core/{p-779c4bd5.system.entry.js → p-ac2900e1.system.entry.js} +2 -2
- package/dist/pine-core/p-acf6592f.system.entry.js +2 -0
- package/dist/pine-core/p-acf6592f.system.entry.js.map +1 -0
- package/dist/pine-core/p-ad2bb5e4.entry.js +2 -0
- package/dist/pine-core/p-ad2bb5e4.entry.js.map +1 -0
- package/dist/pine-core/p-ae80a5cc.system.entry.js +2 -0
- package/dist/pine-core/{p-c7246fe4.system.entry.js.map → p-ae80a5cc.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-fbd8a4ac.entry.js → p-b294a16b.entry.js} +2 -2
- package/dist/pine-core/{p-bb4bb3a7.entry.js → p-b37b3ad2.entry.js} +2 -2
- package/dist/pine-core/{p-8b8d1b07.entry.js → p-b42320fe.entry.js} +2 -2
- package/dist/pine-core/p-b4c51353.system.entry.js +2 -0
- package/dist/pine-core/{p-cb733c9c.system.entry.js.map → p-b4c51353.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-253e2bfd.system.entry.js → p-b611b9ab.system.entry.js} +2 -2
- package/dist/pine-core/{p-4cf4558e.entry.js → p-b7342b09.entry.js} +2 -2
- package/dist/pine-core/p-c53bfe6e.entry.js +2 -0
- package/dist/pine-core/{p-be76de9e.entry.js.map → p-c53bfe6e.entry.js.map} +1 -1
- package/dist/pine-core/{p-90126a46.system.entry.js → p-c7259d80.system.entry.js} +3 -3
- package/dist/pine-core/p-cb9b6ccc.system.entry.js +2 -0
- package/dist/pine-core/p-cb9b6ccc.system.entry.js.map +1 -0
- package/dist/pine-core/{p-4710c59d.entry.js → p-cc7e0da3.entry.js} +2 -2
- package/dist/pine-core/p-cd6b266c.system.entry.js +2 -0
- package/dist/pine-core/{p-a12e38aa.system.entry.js.map → p-cd6b266c.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-bf1ab568.system.entry.js → p-ce4de7f0.system.entry.js} +2 -2
- package/dist/pine-core/{p-1c26a838.system.entry.js → p-cfebee75.system.entry.js} +2 -2
- package/dist/pine-core/{p-c424a27a.system.entry.js → p-d5ba377c.system.entry.js} +2 -2
- package/dist/pine-core/{p-f924994c.entry.js → p-d83e411d.entry.js} +2 -2
- package/dist/pine-core/{p-c7cab4ca.entry.js → p-d96c3850.entry.js} +2 -2
- package/dist/pine-core/{p-b117b00a.system.entry.js → p-e2c42a2e.system.entry.js} +2 -2
- package/dist/pine-core/{p-f4662c9d.system.entry.js → p-e4f66d23.system.entry.js} +2 -2
- package/dist/pine-core/{p-2c2d2080.system.entry.js → p-e626cbd5.system.entry.js} +2 -2
- package/dist/pine-core/{p-2c7f3d5e.system.entry.js → p-e65b1e5f.system.entry.js} +2 -2
- package/dist/pine-core/{p-cea4bfaa.system.entry.js → p-e9e4e7f9.system.entry.js} +2 -2
- package/dist/pine-core/{p-5eb9a3e2.entry.js → p-ec7f210f.entry.js} +2 -2
- package/dist/pine-core/{p-13a814c0.system.entry.js → p-ef155f8e.system.entry.js} +2 -2
- package/dist/pine-core/{p-2ca648d8.system.entry.js → p-f9a46770.system.entry.js} +2 -2
- package/dist/pine-core/{p-b8ca7bca.entry.js → p-fa68509f.entry.js} +2 -2
- package/dist/pine-core/{p-f30bde36.system.entry.js → p-fc2789df.system.entry.js} +2 -2
- package/dist/pine-core/{p-9e8b71ed.system.entry.js → p-fcea314c.system.entry.js} +2 -2
- package/dist/pine-core/{p-A6hgZgB9.system.js.map → p-lXz5a0gw.system.js.map} +1 -1
- package/dist/pine-core/{p-BtXGBfVh.system.js.map → p-yb-SBJqk.system.js.map} +1 -1
- package/dist/pine-core/pds-button.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-checkbox.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-combobox.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-filter.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-input.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-modal.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-select.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-switch.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-table-cell.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-table-head-cell.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-table.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-tooltip.entry.esm.js.map +1 -1
- package/dist/pine-core/pine-core.css +1 -1
- package/dist/pine-core/pine-core.esm.js +1 -1
- package/dist/pine-core/pine-core.js +1 -1
- package/dist/types/components/pds-table/pds-table.d.ts +1 -1
- package/dist/types/utils/scroll.d.ts +21 -0
- package/dist/types/utils/test/axe.d.ts +80 -0
- package/hydrate/index.js +121 -40
- package/hydrate/index.mjs +121 -40
- package/package.json +3 -2
- package/dist/cjs/index-Dlc5O3n_.js.map +0 -1
- package/dist/esm/index-CO9kz-Pi.js.map +0 -1
- package/dist/esm-es5/index-CO9kz-Pi.js.map +0 -1
- package/dist/pine-core/p--fC0IwVR.system.js.map +0 -1
- package/dist/pine-core/p-00e487c4.system.entry.js +0 -2
- package/dist/pine-core/p-0fefe6ef.entry.js +0 -2
- package/dist/pine-core/p-127a84bf.entry.js +0 -3
- package/dist/pine-core/p-31b51eae.entry.js +0 -2
- package/dist/pine-core/p-31b51eae.entry.js.map +0 -1
- package/dist/pine-core/p-4768b52b.system.entry.js +0 -2
- package/dist/pine-core/p-4768b52b.system.entry.js.map +0 -1
- package/dist/pine-core/p-4beb8ae5.entry.js +0 -2
- package/dist/pine-core/p-4d3122ff.system.entry.js +0 -2
- package/dist/pine-core/p-4d3122ff.system.entry.js.map +0 -1
- package/dist/pine-core/p-54e967ca.entry.js +0 -2
- package/dist/pine-core/p-61674647.entry.js +0 -2
- package/dist/pine-core/p-617dc902.system.entry.js +0 -2
- package/dist/pine-core/p-61c885c7.entry.js +0 -2
- package/dist/pine-core/p-673dd006.system.entry.js +0 -2
- package/dist/pine-core/p-673dd006.system.entry.js.map +0 -1
- package/dist/pine-core/p-7bc34bce.system.entry.js +0 -2
- package/dist/pine-core/p-88c2001b.entry.js +0 -2
- package/dist/pine-core/p-8a2433ba.entry.js +0 -2
- package/dist/pine-core/p-8a2433ba.entry.js.map +0 -1
- package/dist/pine-core/p-8d0c1f6d.entry.js +0 -2
- package/dist/pine-core/p-93b379c2.system.entry.js +0 -2
- package/dist/pine-core/p-AcWjVzMO.system.js.map +0 -1
- package/dist/pine-core/p-B8BcpYlQ.system.js.map +0 -1
- package/dist/pine-core/p-BFO0Qv1J.system.js.map +0 -1
- package/dist/pine-core/p-BHXH-Irt.system.js.map +0 -1
- package/dist/pine-core/p-BvEsTKJw.system.js.map +0 -1
- package/dist/pine-core/p-BvlpNhcl.system.js.map +0 -1
- package/dist/pine-core/p-C7zvuvWK.system.js.map +0 -1
- package/dist/pine-core/p-CHUAwdle.system.js.map +0 -1
- package/dist/pine-core/p-CO9kz-Pi.js.map +0 -1
- package/dist/pine-core/p-D0Q8TzYd.system.js.map +0 -1
- package/dist/pine-core/p-DMxjKSUq.system.js.map +0 -1
- package/dist/pine-core/p-NzmeWArw.system.js.map +0 -1
- package/dist/pine-core/p-UYm57tw3.system.js.map +0 -1
- package/dist/pine-core/p-a12e38aa.system.entry.js +0 -2
- package/dist/pine-core/p-b63c7247.entry.js +0 -2
- package/dist/pine-core/p-be76de9e.entry.js +0 -2
- package/dist/pine-core/p-c5f4d4c0.entry.js +0 -2
- package/dist/pine-core/p-c5f4d4c0.entry.js.map +0 -1
- package/dist/pine-core/p-c7246fe4.system.entry.js +0 -2
- package/dist/pine-core/p-c746c9ad.system.entry.js +0 -2
- package/dist/pine-core/p-cb733c9c.system.entry.js +0 -2
- package/dist/pine-core/p-da50a223.entry.js +0 -2
- package/dist/pine-core/p-da50a223.entry.js.map +0 -1
- package/dist/pine-core/p-ea94b002.system.entry.js +0 -4
- package/dist/pine-core/p-ebf96abc.system.entry.js +0 -2
- package/dist/pine-core/p-ebf96abc.system.entry.js.map +0 -1
- package/dist/pine-core/p-ec974e1d.entry.js +0 -2
- /package/dist/pine-core/{p-932f4860.entry.js.map → p-07a19657.entry.js.map} +0 -0
- /package/dist/pine-core/{p-ed781905.system.entry.js.map → p-0bc89023.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-26aa3195.entry.js.map → p-0d3a6abc.entry.js.map} +0 -0
- /package/dist/pine-core/{p-e7e166f2.entry.js.map → p-1256b83e.entry.js.map} +0 -0
- /package/dist/pine-core/{p-88c2001b.entry.js.map → p-1700705c.entry.js.map} +0 -0
- /package/dist/pine-core/{p-952b41e5.system.entry.js.map → p-1d7cbf49.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-205d8c56.entry.js.map → p-21a858a0.entry.js.map} +0 -0
- /package/dist/pine-core/{p-3c864e3d.entry.js.map → p-2335222d.entry.js.map} +0 -0
- /package/dist/pine-core/{p-24f9a03b.system.entry.js.map → p-2728bb30.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-9e073662.entry.js.map → p-2c88b85e.entry.js.map} +0 -0
- /package/dist/pine-core/{p-bd277581.entry.js.map → p-2dcd369d.entry.js.map} +0 -0
- /package/dist/pine-core/{p-9d7f17a4.system.entry.js.map → p-30302dbb.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-5552ca6b.system.entry.js.map → p-33fd214a.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-8b997cb3.entry.js.map → p-360130c2.entry.js.map} +0 -0
- /package/dist/pine-core/{p-0f037132.system.entry.js.map → p-3824d80d.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-94fde072.system.entry.js.map → p-3c89502e.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-1fd52c1b.system.entry.js.map → p-3d0f3dcb.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-69221099.system.entry.js.map → p-3f4435b8.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-13821696.entry.js.map → p-43565cf5.entry.js.map} +0 -0
- /package/dist/pine-core/{p-d90f7fe4.entry.js.map → p-44318b5c.entry.js.map} +0 -0
- /package/dist/pine-core/{p-e0862ab5.entry.js.map → p-4728c80a.entry.js.map} +0 -0
- /package/dist/pine-core/{p-dd9888e9.entry.js.map → p-4a4048f3.entry.js.map} +0 -0
- /package/dist/pine-core/{p-dc724dee.entry.js.map → p-4fc48330.entry.js.map} +0 -0
- /package/dist/pine-core/{p-0561744f.entry.js.map → p-500ef8ee.entry.js.map} +0 -0
- /package/dist/pine-core/{p-a76a454f.system.entry.js.map → p-528d50eb.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-128a483e.system.entry.js.map → p-58bd1590.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-0fefe6ef.entry.js.map → p-5b521b20.entry.js.map} +0 -0
- /package/dist/pine-core/{p-519d44b8.entry.js.map → p-5f9a6f53.entry.js.map} +0 -0
- /package/dist/pine-core/{p-7d9f7018.entry.js.map → p-61bcaaee.entry.js.map} +0 -0
- /package/dist/pine-core/{p-0bf1fee1.entry.js.map → p-67a81e55.entry.js.map} +0 -0
- /package/dist/pine-core/{p-c5dc1e2d.system.entry.js.map → p-6a20ba14.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-8731836c.entry.js.map → p-6c836757.entry.js.map} +0 -0
- /package/dist/pine-core/{p-42d83b1f.entry.js.map → p-6ca31ddd.entry.js.map} +0 -0
- /package/dist/pine-core/{p-c299c019.system.entry.js.map → p-74486022.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-6ff1d23e.entry.js.map → p-77807b63.entry.js.map} +0 -0
- /package/dist/pine-core/{p-5df670e9.entry.js.map → p-7ba75e19.entry.js.map} +0 -0
- /package/dist/pine-core/{p-fd6e7155.entry.js.map → p-847ca369.entry.js.map} +0 -0
- /package/dist/pine-core/{p-2c48e33c.entry.js.map → p-8c8048df.entry.js.map} +0 -0
- /package/dist/pine-core/{p-6acc2e5b.system.entry.js.map → p-8dea1946.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-0d4b2bbc.system.entry.js.map → p-9120a7fa.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-35d9e3c8.system.entry.js.map → p-97d5a937.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-4993f30e.system.entry.js.map → p-97e0b205.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-a713fedd.system.entry.js.map → p-98332835.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-939ae09f.entry.js.map → p-99739465.entry.js.map} +0 -0
- /package/dist/pine-core/{p-3524e30c.system.entry.js.map → p-9a2dc18d.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-06fbdc35.entry.js.map → p-9e62532d.entry.js.map} +0 -0
- /package/dist/pine-core/{p-1768ad5e.entry.js.map → p-9e98793e.entry.js.map} +0 -0
- /package/dist/pine-core/{p-05771ef2.system.entry.js.map → p-a6ab979f.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-b272656d.system.entry.js.map → p-a81aa273.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-63fd14b1.system.entry.js.map → p-a896db32.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-779c4bd5.system.entry.js.map → p-ac2900e1.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-fbd8a4ac.entry.js.map → p-b294a16b.entry.js.map} +0 -0
- /package/dist/pine-core/{p-bb4bb3a7.entry.js.map → p-b37b3ad2.entry.js.map} +0 -0
- /package/dist/pine-core/{p-8b8d1b07.entry.js.map → p-b42320fe.entry.js.map} +0 -0
- /package/dist/pine-core/{p-253e2bfd.system.entry.js.map → p-b611b9ab.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-4cf4558e.entry.js.map → p-b7342b09.entry.js.map} +0 -0
- /package/dist/pine-core/{p-90126a46.system.entry.js.map → p-c7259d80.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-4710c59d.entry.js.map → p-cc7e0da3.entry.js.map} +0 -0
- /package/dist/pine-core/{p-bf1ab568.system.entry.js.map → p-ce4de7f0.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-1c26a838.system.entry.js.map → p-cfebee75.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-c424a27a.system.entry.js.map → p-d5ba377c.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-f924994c.entry.js.map → p-d83e411d.entry.js.map} +0 -0
- /package/dist/pine-core/{p-c7cab4ca.entry.js.map → p-d96c3850.entry.js.map} +0 -0
- /package/dist/pine-core/{p-b117b00a.system.entry.js.map → p-e2c42a2e.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-f4662c9d.system.entry.js.map → p-e4f66d23.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-2c2d2080.system.entry.js.map → p-e626cbd5.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-2c7f3d5e.system.entry.js.map → p-e65b1e5f.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-cea4bfaa.system.entry.js.map → p-e9e4e7f9.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-5eb9a3e2.entry.js.map → p-ec7f210f.entry.js.map} +0 -0
- /package/dist/pine-core/{p-13a814c0.system.entry.js.map → p-ef155f8e.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-2ca648d8.system.entry.js.map → p-f9a46770.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-b8ca7bca.entry.js.map → p-fa68509f.entry.js.map} +0 -0
- /package/dist/pine-core/{p-f30bde36.system.entry.js.map → p-fc2789df.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-9e8b71ed.system.entry.js.map → p-fcea314c.system.entry.js.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-BMWZMLrp.system.js","sources":["src/components/pds-alert/pds-alert.tokens.scss?tag=pds-alert&encapsulation=shadow","src/components/pds-alert/pds-alert.scss?tag=pds-alert&encapsulation=shadow","src/components/pds-alert/pds-alert.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-alert/pds-alert.tokens.css';\n",":host {\n // Context link colors for slotted pds-link components (default variant)\n --pds-context-link-color: var(--pine-alert-color-link);\n --pds-context-link-color-hover: var(--pine-alert-color-link-hover);\n\n display: block;\n line-height: 1;\n width: 100%;\n}\n\n:host([variant=\"danger\"]) {\n --pds-context-link-color: var(--pine-alert-color-danger-link);\n --pds-context-link-color-hover: var(--pine-alert-color-danger-link-hover);\n}\n\n:host([variant=\"info\"]) {\n --pds-context-link-color: var(--pine-alert-color-info-link);\n --pds-context-link-color-hover: var(--pine-alert-color-info-link-hover);\n}\n\n:host([variant=\"success\"]) {\n --pds-context-link-color: var(--pine-alert-color-success-link);\n --pds-context-link-color-hover: var(--pine-alert-color-success-link-hover);\n}\n\n:host([variant=\"warning\"]) {\n --pds-context-link-color: var(--pine-alert-color-warning-link);\n --pds-context-link-color-hover: var(--pine-alert-color-warning-link-hover);\n}\n\n.pds-alert__container {\n --pds-alert-icon-size: var(--pine-dimension-sm);\n --pds-alert-border-dismiss-outline: 2px solid var(--pds-alert-color-dismiss);\n\n --pds-alert-background: var(--pine-alert-color-background);\n --pds-alert-border-color: var(--pine-alert-color-border);\n --pds-alert-color-icon: var(--pine-alert-color-icon);\n --pds-alert-color-text: var(--pine-alert-color-text);\n --pds-alert-color-dismiss: var(--pine-alert-color-dismiss);\n --pds-alert-background-dismiss-hover: var(--pine-alert-color-dismiss-hover);\n\n padding: var(--pine-dimension-250);\n}\n\n.pds-alert__container--danger {\n --pds-alert-background: var(--pine-alert-color-danger-background);\n --pds-alert-border-color: var(--pine-alert-color-danger-border);\n --pds-alert-color-icon: var(--pine-alert-color-danger-icon);\n --pds-alert-color-text: var(--pine-alert-color-danger-text);\n --pds-alert-color-dismiss: var(--pine-alert-color-danger-dismiss);\n --pds-alert-background-dismiss-hover: var(--pine-alert-color-danger-dismiss-hover);\n}\n\n.pds-alert__container--info {\n --pds-alert-background: var(--pine-alert-color-info-background);\n --pds-alert-border-color: var(--pine-alert-color-info-border);\n --pds-alert-color-icon: var(--pine-alert-color-info-icon);\n --pds-alert-color-text: var(--pine-alert-color-info-text);\n --pds-alert-color-dismiss: var(--pine-alert-color-info-dismiss);\n --pds-alert-background-dismiss-hover: var(--pine-alert-color-info-dismiss-hover);\n}\n\n.pds-alert__container--success {\n --pds-alert-background: var(--pine-alert-color-success-background);\n --pds-alert-border-color: var(--pine-alert-color-success-border);\n --pds-alert-color-icon: var(--pine-alert-color-success-icon);\n --pds-alert-color-text: var(--pine-alert-color-success-text);\n --pds-alert-color-dismiss: var(--pine-alert-color-success-dismiss);\n --pds-alert-background-dismiss-hover: var(--pine-alert-color-success-dismiss-hover);\n}\n\n.pds-alert__container--warning {\n --pds-alert-background: var(--pine-alert-color-warning-background);\n --pds-alert-border-color: var(--pine-alert-color-warning-border);\n --pds-alert-color-icon: var(--pine-alert-color-warning-icon);\n --pds-alert-color-text: var(--pine-alert-color-warning-text);\n --pds-alert-color-dismiss: var(--pine-alert-color-warning-dismiss);\n --pds-alert-background-dismiss-hover: var(--pine-alert-color-warning-dismiss-hover);\n}\n\n.pds-alert__icon {\n margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-alert__icon--small {\n margin-block-start: 0;\n}\n\n.pds-alert__content-wrapper {\n flex: 1;\n min-width: 0;\n overflow: hidden;\n width: 100%;\n}\n\n.pds-alert__dismiss {\n align-items: center;\n background: none;\n border: 0;\n border-radius: var(--pine-border-radius-full);\n cursor: pointer;\n display: flex;\n height: var(--pine-dimension-250);\n justify-content: center;\n padding: var(--pine-dimension-xs);\n width: var(--pine-dimension-250);\n}\n\n.pds-alert__dismiss:hover {\n background: var(--pds-alert-background-dismiss-hover);\n opacity: 0.8;\n}\n\n.pds-alert__dismiss:focus-visible {\n outline: var(--pds-alert-border-dismiss-outline);\n}\n\n.pds-alert__description--small {\n flex: 1 1 auto;\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.pds-alert__actions {\n margin-block-start: var(--pine-dimension-sm);\n}\n\n.pds-alert__actions--small {\n flex-shrink: 0;\n margin-inline-start: auto;\n white-space: nowrap;\n}\n","import { Component, Host, h, Prop, Event, EventEmitter, Element, State } from '@stencil/core';\n\n/**\n * @slot actions - Slot for alert actions.\n * @part dismiss\n */\n\n@Component({\n tag: 'pds-alert',\n styleUrls: ['pds-alert.tokens.scss', 'pds-alert.scss'],\n shadow: true,\n})\nexport class PdsAlert {\n\n @Element() el: HTMLPdsAlertElement;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Text displayed as the heading of the alert.\n */\n @Prop() heading: string;\n\n /**\n * If true, the alert is displayed in a smaller size and description text is truncated. Heading is not displayed.\n */\n @Prop() small = false;\n\n /**\n * If true, shows the dismiss button. If false, the dismiss button is hidden.\n * @defaultValue false\n */\n @Prop() dismissible = false;\n\n /**\n * If true, the leading icon is hidden.\n * @defaultValue false\n */\n @Prop() hideIcon = false;\n\n /**\n * Sets the style variant of the alert.\n * @defaultValue 'default'\n */\n @Prop() variant: 'default' | 'danger' | 'info' | 'success' | 'warning' = 'default';\n\n /**\n * Event emitted when the dismiss button is clicked.\n */\n @Event() pdsAlertDismissClick: EventEmitter<void>;\n\n @State() hasActionsContent = false;\n\n private handleCloseClick = () => {\n this.pdsAlertDismissClick.emit();\n };\n\n componentWillRender() {\n // Check if the actions slot has any content.\n // If not, hide the actions container to prevent empty space.\n const actionsSlot = this.el.querySelector('[slot=\"actions\"]');\n this.hasActionsContent = !!actionsSlot;\n }\n\n private renderActions(isSmall: boolean) {\n return (\n <pds-box class={isSmall ? \"pds-alert__actions--small\" : \"pds-alert__actions\"} gap=\"sm\" flex={isSmall ? \"none\" : undefined} align-items={isSmall ? undefined : \"center\"}>\n <slot name=\"actions\"></slot>\n </pds-box>\n );\n }\n\n private renderContent() {\n if (this.small) {\n return (\n <pds-box display=\"flex\" gap=\"md\" align-items=\"center\">\n <pds-text\n truncate={this.small}\n class=\"pds-alert__description--small\"\n color=\"var(--pds-alert-color-text)\"\n tag=\"p\"\n >\n <slot></slot>\n </pds-text>\n {this.hasActionsContent && this.renderActions(true)}\n </pds-box>\n );\n }\n\n return (\n <div>\n <pds-text class=\"pds-alert__description\" color=\"var(--pds-alert-color-text)\" tag=\"p\">\n <slot></slot>\n </pds-text>\n {this.hasActionsContent && this.renderActions(false)}\n </div>\n );\n }\n\n render() {\n const iconMap = {\n danger: 'warning-filled',\n default: 'info-circle-filled',\n info: 'info-circle-filled',\n success: 'check-circle-filled',\n warning: 'info-circle-filled',\n };\n\n // Get the icon name based on the current variant\n const iconName = iconMap[this.variant] || iconMap.default;\n\n return (\n <Host class=\"pds-alert\" id={this.componentId} variant={this.variant}>\n <pds-box\n class={`pds-alert__container pds-alert__container--${this.variant}`}\n background-color=\"var(--pds-alert-background)\"\n border-color=\"var(--pds-alert-border-color)\"\n border-radius=\"md\"\n border\n display=\"block\"\n >\n <pds-box gap=\"sm\" display=\"flex\" align-items={this.small ? \"center\" : undefined}>\n {!this.hideIcon && (\n <pds-icon\n class={`pds-alert__icon ${this.small ? 'pds-alert__icon--small' : ''}`}\n color=\"var(--pds-alert-color-icon)\"\n icon={iconName}\n size=\"var(--pds-alert-icon-size)\"\n />\n )}\n <pds-box class=\"pds-alert__content-wrapper\" direction=\"column\" gap=\"xs\" flex=\"grow\">\n {this.heading && !this.small && (\n <pds-text class=\"pds-alert__heading\" color=\"var(--pds-alert-color-text)\" size=\"h5\" tag=\"h3\" weight=\"medium\">\n {this.heading}\n </pds-text>\n )}\n\n {this.renderContent()}\n </pds-box>\n\n {this.dismissible && (\n <button class=\"pds-alert__dismiss\" type=\"button\" part=\"dismiss\" aria-label=\"Dismiss alert\" onClick={this.handleCloseClick}>\n <pds-icon icon=\"remove\" size=\"var(--pds-alert-icon-size)\" aria-hidden=\"true\" color=\"var(--pds-alert-color-dismiss)\" />\n </button>\n )}\n </pds-box>\n </pds-box>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"p-B5hxTy5U.system.js","sources":["src/components/pds-alert/pds-alert.tokens.scss?tag=pds-alert&encapsulation=shadow","src/components/pds-alert/pds-alert.scss?tag=pds-alert&encapsulation=shadow","src/components/pds-alert/pds-alert.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-alert/pds-alert.tokens.css';\n",":host {\n // Context link colors for slotted pds-link components (default variant)\n --pds-context-link-color: var(--pine-alert-color-link);\n --pds-context-link-color-hover: var(--pine-alert-color-link-hover);\n\n display: block;\n line-height: 1;\n width: 100%;\n}\n\n:host([variant=\"danger\"]) {\n --pds-context-link-color: var(--pine-alert-color-danger-link);\n --pds-context-link-color-hover: var(--pine-alert-color-danger-link-hover);\n}\n\n:host([variant=\"info\"]) {\n --pds-context-link-color: var(--pine-alert-color-info-link);\n --pds-context-link-color-hover: var(--pine-alert-color-info-link-hover);\n}\n\n:host([variant=\"success\"]) {\n --pds-context-link-color: var(--pine-alert-color-success-link);\n --pds-context-link-color-hover: var(--pine-alert-color-success-link-hover);\n}\n\n:host([variant=\"warning\"]) {\n --pds-context-link-color: var(--pine-alert-color-warning-link);\n --pds-context-link-color-hover: var(--pine-alert-color-warning-link-hover);\n}\n\n.pds-alert__container {\n --pds-alert-icon-size: var(--pine-dimension-sm);\n --pds-alert-border-dismiss-outline: 2px solid var(--pds-alert-color-dismiss);\n\n --pds-alert-background: var(--pine-alert-color-background);\n --pds-alert-border-color: var(--pine-alert-color-border);\n --pds-alert-color-icon: var(--pine-alert-color-icon);\n --pds-alert-color-text: var(--pine-alert-color-text);\n --pds-alert-color-dismiss: var(--pine-alert-color-dismiss);\n --pds-alert-background-dismiss-hover: var(--pine-alert-color-dismiss-hover);\n\n padding: var(--pine-dimension-250);\n}\n\n.pds-alert__container--danger {\n --pds-alert-background: var(--pine-alert-color-danger-background);\n --pds-alert-border-color: var(--pine-alert-color-danger-border);\n --pds-alert-color-icon: var(--pine-alert-color-danger-icon);\n --pds-alert-color-text: var(--pine-alert-color-danger-text);\n --pds-alert-color-dismiss: var(--pine-alert-color-danger-dismiss);\n --pds-alert-background-dismiss-hover: var(--pine-alert-color-danger-dismiss-hover);\n}\n\n.pds-alert__container--info {\n --pds-alert-background: var(--pine-alert-color-info-background);\n --pds-alert-border-color: var(--pine-alert-color-info-border);\n --pds-alert-color-icon: var(--pine-alert-color-info-icon);\n --pds-alert-color-text: var(--pine-alert-color-info-text);\n --pds-alert-color-dismiss: var(--pine-alert-color-info-dismiss);\n --pds-alert-background-dismiss-hover: var(--pine-alert-color-info-dismiss-hover);\n}\n\n.pds-alert__container--success {\n --pds-alert-background: var(--pine-alert-color-success-background);\n --pds-alert-border-color: var(--pine-alert-color-success-border);\n --pds-alert-color-icon: var(--pine-alert-color-success-icon);\n --pds-alert-color-text: var(--pine-alert-color-success-text);\n --pds-alert-color-dismiss: var(--pine-alert-color-success-dismiss);\n --pds-alert-background-dismiss-hover: var(--pine-alert-color-success-dismiss-hover);\n}\n\n.pds-alert__container--warning {\n --pds-alert-background: var(--pine-alert-color-warning-background);\n --pds-alert-border-color: var(--pine-alert-color-warning-border);\n --pds-alert-color-icon: var(--pine-alert-color-warning-icon);\n --pds-alert-color-text: var(--pine-alert-color-warning-text);\n --pds-alert-color-dismiss: var(--pine-alert-color-warning-dismiss);\n --pds-alert-background-dismiss-hover: var(--pine-alert-color-warning-dismiss-hover);\n}\n\n.pds-alert__icon {\n margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-alert__icon--small {\n margin-block-start: 0;\n}\n\n.pds-alert__content-wrapper {\n flex: 1;\n min-width: 0;\n overflow: hidden;\n width: 100%;\n}\n\n.pds-alert__dismiss {\n align-items: center;\n background: none;\n border: 0;\n border-radius: var(--pine-border-radius-full);\n cursor: pointer;\n display: flex;\n height: var(--pine-dimension-250);\n justify-content: center;\n padding: var(--pine-dimension-xs);\n width: var(--pine-dimension-250);\n}\n\n.pds-alert__dismiss:hover {\n background: var(--pds-alert-background-dismiss-hover);\n opacity: 0.8;\n}\n\n.pds-alert__dismiss:focus-visible {\n outline: var(--pds-alert-border-dismiss-outline);\n}\n\n.pds-alert__description--small {\n flex: 1 1 auto;\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.pds-alert__actions {\n margin-block-start: var(--pine-dimension-sm);\n}\n\n.pds-alert__actions--small {\n flex-shrink: 0;\n margin-inline-start: auto;\n white-space: nowrap;\n}\n","import { Component, Host, h, Prop, Event, EventEmitter, Element, State } from '@stencil/core';\n\n/**\n * @slot actions - Slot for alert actions.\n * @part dismiss\n */\n\n@Component({\n tag: 'pds-alert',\n styleUrls: ['pds-alert.tokens.scss', 'pds-alert.scss'],\n shadow: true,\n})\nexport class PdsAlert {\n\n @Element() el: HTMLPdsAlertElement;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Text displayed as the heading of the alert.\n */\n @Prop() heading: string;\n\n /**\n * If true, the alert is displayed in a smaller size and description text is truncated. Heading is not displayed.\n */\n @Prop() small = false;\n\n /**\n * If true, shows the dismiss button. If false, the dismiss button is hidden.\n * @defaultValue false\n */\n @Prop() dismissible = false;\n\n /**\n * If true, the leading icon is hidden.\n * @defaultValue false\n */\n @Prop() hideIcon = false;\n\n /**\n * Sets the style variant of the alert.\n * @defaultValue 'default'\n */\n @Prop() variant: 'default' | 'danger' | 'info' | 'success' | 'warning' = 'default';\n\n /**\n * Event emitted when the dismiss button is clicked.\n */\n @Event() pdsAlertDismissClick: EventEmitter<void>;\n\n @State() hasActionsContent = false;\n\n private handleCloseClick = () => {\n this.pdsAlertDismissClick.emit();\n };\n\n componentWillRender() {\n // Check if the actions slot has any content.\n // If not, hide the actions container to prevent empty space.\n const actionsSlot = this.el.querySelector('[slot=\"actions\"]');\n this.hasActionsContent = !!actionsSlot;\n }\n\n private renderActions(isSmall: boolean) {\n return (\n <pds-box class={isSmall ? \"pds-alert__actions--small\" : \"pds-alert__actions\"} gap=\"sm\" flex={isSmall ? \"none\" : undefined} align-items={isSmall ? undefined : \"center\"}>\n <slot name=\"actions\"></slot>\n </pds-box>\n );\n }\n\n private renderContent() {\n if (this.small) {\n return (\n <pds-box display=\"flex\" gap=\"md\" align-items=\"center\">\n <pds-text\n truncate={this.small}\n class=\"pds-alert__description--small\"\n color=\"var(--pds-alert-color-text)\"\n tag=\"p\"\n >\n <slot></slot>\n </pds-text>\n {this.hasActionsContent && this.renderActions(true)}\n </pds-box>\n );\n }\n\n return (\n <div>\n <pds-text class=\"pds-alert__description\" color=\"var(--pds-alert-color-text)\" tag=\"p\">\n <slot></slot>\n </pds-text>\n {this.hasActionsContent && this.renderActions(false)}\n </div>\n );\n }\n\n render() {\n const iconMap = {\n danger: 'warning-filled',\n default: 'info-circle-filled',\n info: 'info-circle-filled',\n success: 'check-circle-filled',\n warning: 'info-circle-filled',\n };\n\n // Get the icon name based on the current variant\n const iconName = iconMap[this.variant] || iconMap.default;\n\n return (\n <Host class=\"pds-alert\" id={this.componentId} variant={this.variant}>\n <pds-box\n class={`pds-alert__container pds-alert__container--${this.variant}`}\n background-color=\"var(--pds-alert-background)\"\n border-color=\"var(--pds-alert-border-color)\"\n border-radius=\"md\"\n border\n display=\"block\"\n >\n <pds-box gap=\"sm\" display=\"flex\" align-items={this.small ? \"center\" : undefined}>\n {!this.hideIcon && (\n <pds-icon\n class={`pds-alert__icon ${this.small ? 'pds-alert__icon--small' : ''}`}\n color=\"var(--pds-alert-color-icon)\"\n icon={iconName}\n size=\"var(--pds-alert-icon-size)\"\n />\n )}\n <pds-box class=\"pds-alert__content-wrapper\" direction=\"column\" gap=\"xs\" flex=\"grow\">\n {this.heading && !this.small && (\n <pds-text class=\"pds-alert__heading\" color=\"var(--pds-alert-color-text)\" size=\"h5\" tag=\"h3\" weight=\"medium\">\n {this.heading}\n </pds-text>\n )}\n\n {this.renderContent()}\n </pds-box>\n\n {this.dismissible && (\n <button class=\"pds-alert__dismiss\" type=\"button\" part=\"dismiss\" aria-label=\"Dismiss alert\" onClick={this.handleCloseClick}>\n <pds-icon icon=\"remove\" size=\"var(--pds-alert-icon-size)\" aria-hidden=\"true\" color=\"var(--pds-alert-color-dismiss)\" />\n </button>\n )}\n </pds-box>\n </pds-box>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"p-B8wXrRCn.system.js","sources":["src/global/styles/utils/label.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.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 align-items: center;\n display: flex;\n flex-flow: row wrap;\n}\n\n:host(.is-invalid) {\n input {\n border-color: var(--pine-color-border-danger);\n\n &:checked {\n background: var( --pine-color-danger);\n\n &:hover {\n background: var(--pine-color-danger-hover);\n border-color: var(--pine-color-border-danger-hover);\n }\n }\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n\n label,\n .pds-checkbox__message--error {\n color: var(--pine-color-text-message-danger);\n }\n}\n\n:host(.is-indeterminate) {\n input {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent);\n\n &:hover {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent-hover);\n }\n\n &::after {\n /* stylelint-disable-next-line pine-design-system/prefer-semantic-tokens */\n border: 1px solid var(--pine-color-white);\n border-block-end: var(--pine-border-width-none);\n border-block-start: var(--pine-border-width-none);\n border-inline-start: var(--pine-border-width-none);\n content: \"\";\n display: block;\n height: 7px;\n inset-block-start: 50%;\n inset-inline-start: 50%;\n position: absolute;\n transform: translate(-50%, -50%) rotate(90deg);\n width: 4px;\n }\n }\n}\n\ninput {\n appearance: none;\n background: var(--pine-color-background-container);\n border: var(--pine-border);\n border-radius: var(--pine-dimension-2xs);\n flex: none;\n height: var(--pine-dimension-sm);\n margin: 0;\n margin-block-start: var(--pine-dimension-025);\n position: relative;\n width: var(--pine-dimension-sm);\n\n &:hover {\n background: var(--pine-color-background-container-hover);\n border: var(--pine-border-hover);\n }\n\n &:checked {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent);\n\n &:hover {\n background: var(--pine-color-accent-hover);\n border-color: var(--pine-color-accent-hover);\n }\n\n &::after {\n /* stylelint-disable-next-line pine-design-system/prefer-semantic-tokens */\n border: 1px solid var(--pine-color-white);\n border-block-start: var(--pine-border-width-none);\n border-inline-start: var(--pine-border-width-none);\n content: \"\";\n display: block;\n height: 7px;\n inset-block-start: 50%;\n inset-inline-start: 50%;\n position: absolute;\n transform: translate(-50%, -60%) rotate(43deg);\n width: 4px;\n }\n }\n\n &:disabled {\n background: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n cursor: not-allowed;\n\n &:checked {\n background: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n\n &::after {\n border-color: var(--pine-color-border);\n }\n }\n\n + label {\n cursor: not-allowed;\n }\n\n ~ .pds-checkbox__message {\n color: var(--pine-color-text-disabled);\n }\n }\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n }\n}\n\n:host-context([dir='rtl']) {\n input:checked::after {\n transform: translate(-50%, -60%) rotate(-43deg);\n }\n}\n\nlabel {\n display: flex;\n gap: var(--pine-dimension-xs);\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.pds-checkbox__message {\n color: var(--pine-color-text-message);\n font: var(--pine-typography-body-sm-medium);\n margin-block-start: 6px;\n margin-inline-start: var(--pine-dimension-md);\n width: 100%;\n}\n\n.pds-checkbox__message--error {\n display: flex;\n gap: var(--pine-dimension-2xs);\n\n pds-icon {\n margin-block-start: var(--pine-dimension-025);\n }\n}\n","import { Component, Element, h, Prop, Host, Event, EventEmitter, Watch } from '@stencil/core';\nimport { assignDescription, isSpecTest, messageId, exposeTypeProperty } from '../../utils/form';\nimport { CheckboxChangeEventDetail } from './checkbox-interface';\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-checkbox',\n styleUrls: ['../../global/styles/utils/label.scss', 'pds-checkbox.scss'],\n shadow: true,\n formAssociated: true,\n})\nexport class PdsCheckbox {\n private inheritedAttributes: Attributes = {};\n private internals?: ElementInternals;\n private readonly _type = 'checkbox' as const;\n\n @Element() el: HTMLPdsCheckboxElement;\n\n /**\n * It determines whether or not the checkbox is checked.\n */\n @Prop({ mutable: true }) checked?: boolean = false;\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 * It determines whether or not the checkbox is disabled.\n */\n @Prop() disabled: boolean;\n\n /**\n * Displays message text describing an invalid state.\n */\n @Prop() errorMessage: string;\n\n /**\n * String used for helper message below checkbox.\n */\n @Prop() helperMessage: string;\n\n /**\n * If `true`, the checkbox will visually appear as indeterminate.\n * Only JavaScript can set the objects `indeterminate` property. See [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes).\n */\n @Prop({ mutable: true }) indeterminate: boolean;\n\n /**\n * It determines whether or not the checkbox is invalid.\n */\n @Prop() invalid: boolean;\n\n /**\n * String used for label text next to checkbox.\n */\n @Prop() label: string;\n\n /**\n * Visually hides the label text for instances where only the checkbox should be displayed. Label remains accessible to assistive technology such as screen readers.\n */\n @Prop() hideLabel: boolean;\n\n /**\n * String used for checkbox `name` attribute.\n */\n @Prop() name: string;\n\n /**\n * It determines whether or not the checkbox is required.\n */\n @Prop() required: boolean;\n\n /**\n * The value of the checkbox that is submitted with a form.\n */\n @Prop() value: string;\n\n\n /**\n * Event emitted that contains the `value` and `checked`.\n */\n @Event() pdsCheckboxChange: EventEmitter<CheckboxChangeEventDetail>;\n\n @Event() pdsCheckboxInput: EventEmitter<CheckboxChangeEventDetail>;\n\n @Watch('checked')\n updateIndeterminate() {\n this.indeterminate = undefined\n }\n\n private handleCheckboxChange = (e: Event) => {\n if (this.disabled) {\n return;\n }\n\n const target = e.target as HTMLInputElement;\n this.checked = target.checked;\n\n this.updateFormValue();\n\n this.pdsCheckboxChange.emit({\n checked: target.checked,\n value: this.value\n });\n }\n\n private handleInput = () => {\n this.pdsCheckboxInput.emit({\n checked: this.checked,\n value: this.value\n });\n }\n\n private classNames() {\n const classNames = [];\n\n if (this.invalid) { classNames.push('is-invalid'); }\n if (this.indeterminate) { classNames.push('is-indeterminate'); }\n if (this.disabled) { classNames.push('is-disabled'); }\n\n return classNames.join(' ');\n }\n\n connectedCallback() {\n // Initialize ElementInternals for form association (only once per element instance)\n if (this.el.attachInternals && !this.internals) {\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 (isSpecTest()) return;\n\n if (this.internals && this.internals.setFormValue) {\n // For checkboxes, 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 checkboxes, restore if the value exists in FormData\n const value = this.value || 'on';\n this.checked = state.get(this.name as string) === 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.classNames()}>\n <label htmlFor={this.componentId}>\n <input\n type=\"checkbox\"\n aria-describedby={assignDescription(this.componentId, this.invalid, this.errorMessage || this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n id={this.componentId}\n indeterminate={this.indeterminate}\n name={this.name}\n value={this.value}\n checked={this.checked}\n required={this.required}\n disabled={this.disabled}\n onChange={this.handleCheckboxChange}\n onInput={this.handleInput}\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-checkbox__message'}\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </div>\n }\n {this.errorMessage &&\n <div\n class={`pds-checkbox__message pds-checkbox__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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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"p-BEk_6bpE.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([aria-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 /* stylelint-disable-next-line pine-design-system/prefer-semantic-tokens */\n --color-text-default: var(--pine-color-white);\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 /* stylelint-disable-next-line pine-design-system/prefer-semantic-tokens */\n --color-text-default: var(--pine-color-white);\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-background-muted);\n --color-background-disabled: transparent;\n --color-border-default: transparent;\n --color-border-hover: var(--pine-color-background-muted);\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-background-container);\n --color-background-hover: var(--pine-color-background-subtle);\n /* stylelint-disable-next-line pine-design-system/prefer-semantic-tokens */\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 &:disabled {\n background-color: var(--pine-color-background-container);\n }\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: var(--pine-color-text);\n --button-loader-color: var(--pine-color-text);\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 &--empty {\n display: none;\n }\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, State } 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 * Prompts the user to save the linked URL instead of navigating to it.\n * It can be used without a value to download with the default filename,\n * or with a string value to suggest a specific filename for the download.\n * Only applies when href is set.\n */\n @Prop() download?: string;\n\n /**\n * Determines the button's disabled state.\n * @defaultValue false\n */\n @Prop({ reflect: true }) disabled: boolean = 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 @State() hasStartContent = false;\n @State() hasEndContent = false;\n\n @Event() pdsClick: EventEmitter<Event>;\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 // Skip if an earlier handler already canceled the event — matches the browser's\n // native implicit-submit behavior, which honors defaultPrevented.\n if (event.defaultPrevented) {\n return;\n }\n\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 handleStartSlotChange = (event: Event) => {\n this.hasStartContent = (event.target as HTMLSlotElement).assignedElements({ flatten: true }).length > 0;\n };\n\n private handleEndSlotChange = (event: Event) => {\n this.hasEndContent = (event.target as HTMLSlotElement).assignedElements({ flatten: true }).length > 0;\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 renderStartContent() {\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 }\n\n // Deprecated icon prop still takes precedence over start slot\n const hasIcon = this.icon && this.variant !== 'disclosure';\n 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 }\n\n // Always render the start slot so slotted content is projected reliably.\n // The --empty class hides the wrapper when no content is slotted (prevents empty gap space).\n const startClasses = `pds-button__icon${this.hasStartContent ? '' : ' pds-button__icon--empty'}${this.loading ? ' pds-button__icon--hidden' : ''}`;\n return <span class={startClasses}><slot name=\"start\" onSlotchange={this.handleStartSlotChange} /></span>;\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 }\n\n // Always render the end slot so slotted content is projected reliably.\n // The --empty class hides the wrapper when no content is slotted (prevents empty gap space).\n const endClasses = `pds-button__icon${this.hasEndContent ? '' : ' pds-button__icon--empty'}${this.loading ? ' pds-button__icon--hidden' : ''}`;\n return <span class={endClasses}><slot name=\"end\" onSlotchange={this.handleEndSlotChange} /></span>;\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 download: this.download,\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-CIRw0SFV.system.js","sources":["src/components/pds-dropdown-menu/pds-dropdown-menu.scss?tag=pds-dropdown-menu&encapsulation=shadow","src/components/pds-dropdown-menu/pds-dropdown-menu.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.is-hidden {\n display: none;\n}\n\n.pds-dropdown-menu--panel {\n background-color: var(--pine-color-background-container);\n border-radius: var(--pine-dimension-xs);\n left: var(--pine-dimension-none);\n min-width: 170px;\n padding: var(--pine-dimension-xs);\n position: fixed;\n z-index: var(--pine-z-index-overlay);\n\n :host-context([data-theme=\"dark\"]) & {\n border: var(--pine-border);\n }\n}\n\n// Styles for raw <a> and <button> elements slotted into the menu\n// These are allowed for edge cases requiring native browser/framework behavior\n// (e.g., Rails UJS, Turbo) that cannot work through Shadow DOM.\n//\n// Note: ::slotted() cannot be combined with pseudo-classes like :hover or :focus.\n// Raw elements will receive base styling here; hover/focus states must be handled\n// by the consuming application's CSS if needed.\n::slotted(a),\n::slotted(button) {\n align-items: center;\n appearance: none;\n background: transparent;\n border: 0;\n border-radius: var(--pine-dimension-xs) !important;\n box-sizing: border-box;\n color: var(--pine-color-text) !important;\n cursor: pointer;\n display: flex;\n flex-grow: 1;\n font: var(--pine-typography-body-medium) !important;\n gap: var(--pine-dimension-xs);\n margin: calc(var(--pine-border-width) + 2px) !important;\n padding: var(--pine-dimension-xs) !important;\n text-align: start;\n text-decoration: none !important;\n width: calc(100% - calc(var(--pine-border-width) + 2px) * 2);\n}\n\n// Destructive variant for raw elements\n::slotted(.destructive) {\n color: var(--pine-color-danger) !important;\n}\n\n// Disabled state for raw elements (using attribute selectors, not pseudo-classes)\n// ::slotted([disabled]) is an attribute-presence selector — it matches even when\n// disabled=\"false\" is set as a string (e.g. by React on custom elements). The\n// :not([disabled=\"false\"]) guard ensures only a truly-disabled attribute applies.\n::slotted([aria-disabled=\"true\"]),\n::slotted([disabled]:not([disabled=\"false\"])) {\n cursor: not-allowed;\n opacity: 0.5;\n pointer-events: none;\n}\n","import { Component, Element, Host, h, Prop, Listen, State } from '@stencil/core';\nimport type { BasePdsProps } from '@utils/interfaces';\nimport { PlacementType } from '@utils/types';\nimport { computePosition,\n flip,\n offset,\n shift,\n autoUpdate,\n} from '@floating-ui/dom';\n\n/**\n * Union type for focusable menu items (component or raw elements)\n */\ntype MenuItemElement = HTMLPdsDropdownMenuItemElement | HTMLAnchorElement | HTMLButtonElement;\n\n/**\n * @part menu-panel - Exposes the dropdown menu container for styling.\n */\n@Component({\n tag: 'pds-dropdown-menu',\n styleUrl: 'pds-dropdown-menu.scss',\n shadow: true,\n})\nexport class PdsDropdownMenu implements BasePdsProps {\n private slotEl: HTMLSlotElement;\n private triggerEl: HTMLElement;\n private panelEl: HTMLPdsBoxElement;\n private isOpen: boolean = false;\n private menuItems: MenuItemElement[] = [];\n private cleanupAutoUpdate: (() => void) | null = null;\n\n @Element() host: HTMLPdsDropdownMenuElement;\n\n @State() currentFocusIndex: number = -1;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * The placement of the dropdown panel relative to the trigger.\n */\n @Prop() placement: PlacementType = 'bottom-start';\n\n componentDidRender() {\n this.panelEl = this.host.shadowRoot?.querySelector('pds-box') as HTMLPdsBoxElement;\n }\n\n disconnectedCallback() {\n // Clean up auto-update when component is removed from DOM\n if (this.cleanupAutoUpdate) {\n this.cleanupAutoUpdate();\n this.cleanupAutoUpdate = null;\n }\n }\n\n private handleTriggerSlotChange = (event: Event) => {\n this.slotEl = event.target as HTMLSlotElement;\n\n // Get all elements assigned to this slot\n const assignedElements = this.slotEl.assignedElements();\n\n this.triggerEl = assignedElements[0] as HTMLElement;\n this.triggerEl.onclick = this.handleClick;\n\n // Add accessibility attributes to trigger\n this.triggerEl.setAttribute('aria-haspopup', 'menu');\n this.triggerEl.setAttribute('aria-expanded', 'false');\n }\n\n private handleSlotChange = (event: Event) => {\n this.slotEl = event.target as HTMLSlotElement;\n\n // Get all elements assigned to this slot\n const assignedElements = this.slotEl.assignedElements();\n\n // Allowed elements: pds-dropdown-menu-item, pds-dropdown-menu-separator, <a>, <button>\n // Raw <a> and <button> elements are allowed for edge cases requiring native browser/framework\n // behavior (e.g., Rails UJS, Turbo) that cannot work through Shadow DOM.\n const allowedTags = ['pds-dropdown-menu-item', 'pds-dropdown-menu-separator', 'a', 'button'];\n const invalidElements = assignedElements.filter(\n el => !allowedTags.includes(el.tagName.toLowerCase())\n );\n\n if (invalidElements.length > 0) {\n const invalidTags = invalidElements.map(el => el.tagName.toLowerCase()).join(', ');\n console.warn(\n `pds-dropdown-menu: Unexpected element(s) found: ${invalidTags}. ` +\n `Expected: ${allowedTags.join(', ')}`\n );\n }\n\n // Store all focusable items for keyboard navigation\n // This includes pds-dropdown-menu-item components and raw <a>/<button> elements\n this.menuItems = assignedElements.filter(el => {\n const tag = el.tagName.toLowerCase();\n return tag === 'pds-dropdown-menu-item' || tag === 'a' || tag === 'button';\n }) as MenuItemElement[];\n }\n\n // Toggle dropdown open/closed\n private toggleDropdown = () => {\n this.isOpen = !this.isOpen;\n\n if (this.isOpen) {\n this.openDropdown();\n } else {\n this.closeDropdown();\n }\n }\n\n // Open the dropdown and position it\n private openDropdown = () => {\n const updatePosition = () => {\n computePosition(this.triggerEl, this.panelEl as HTMLElement, {\n placement: this.placement,\n strategy: 'fixed',\n middleware: [offset(6), flip(), shift({padding: 5})],\n }).then(({ x, y }) => {\n Object.assign(this.panelEl.style, {\n left: `${x}px`,\n top: `${y}px`,\n });\n });\n };\n\n // Initial position\n updatePosition();\n\n // Set up auto-update for window resize and scroll\n this.cleanupAutoUpdate = autoUpdate(\n this.triggerEl,\n this.panelEl as HTMLElement,\n updatePosition\n );\n\n this.host.shadowRoot?.querySelector('pds-box').classList.remove('is-hidden');\n this.isOpen = true;\n\n // Update ARIA attributes\n this.triggerEl.setAttribute('aria-expanded', 'true');\n }\n\n // Close the dropdown\n private closeDropdown = () => {\n this.host.shadowRoot?.querySelector('pds-box').classList.add('is-hidden');\n this.isOpen = false;\n\n // Clean up auto-update\n if (this.cleanupAutoUpdate) {\n this.cleanupAutoUpdate();\n this.cleanupAutoUpdate = null;\n }\n\n // Update ARIA attributes\n this.triggerEl.setAttribute('aria-expanded', 'false');\n\n // Reset focus index\n this.currentFocusIndex = -1;\n\n // Return focus to trigger\n this.triggerEl.focus();\n }\n\n // Handle click on the trigger element\n private handleClick = () => {\n this.toggleDropdown();\n }\n\n // Check if a menu item is disabled (handles both component and raw elements)\n private isItemDisabled(item: MenuItemElement): boolean {\n const tagName = item.tagName.toLowerCase();\n\n if (tagName === 'pds-dropdown-menu-item') {\n return (item as HTMLPdsDropdownMenuItemElement).disabled;\n } else if (tagName === 'button') {\n return (item as HTMLButtonElement).disabled;\n } else if (tagName === 'a') {\n return item.getAttribute('aria-disabled') === 'true';\n }\n return false;\n }\n\n // Get the index of the currently focused menu item\n private getFocusedItemIndex(): number {\n const activeElement = document.activeElement as MenuItemElement | null;\n if (!activeElement) return -1;\n\n // For raw elements, check direct match\n // For pds-dropdown-menu-item, also check if the active element is inside the shadow root\n return this.menuItems.findIndex(item => {\n if (item === activeElement) return true;\n\n // Check if activeElement is inside the item's shadow root (for pds-dropdown-menu-item)\n if (item.tagName.toLowerCase() === 'pds-dropdown-menu-item') {\n const shadowRoot = (item as HTMLPdsDropdownMenuItemElement).shadowRoot;\n if (shadowRoot?.contains(activeElement)) return true;\n }\n\n return false;\n });\n }\n\n // Focus a specific menu item by index\n private focusItemByIndex(index: number): void {\n if (index >= 0 && index < this.menuItems.length) {\n this.currentFocusIndex = index;\n const item = this.menuItems[index];\n const tagName = item.tagName.toLowerCase();\n\n if (tagName === 'pds-dropdown-menu-item') {\n // For pds-dropdown-menu-item, focus the inner element\n const menuItem = item as HTMLPdsDropdownMenuItemElement;\n const innerButton = menuItem.shadowRoot?.querySelector('button');\n const innerLink = menuItem.shadowRoot?.querySelector('pds-link')?.shadowRoot?.querySelector('a')\n || menuItem.shadowRoot?.querySelector('a');\n\n if (innerButton) {\n innerButton.focus();\n } else if (innerLink) {\n innerLink.focus();\n } else {\n // Fallback to focusing the host\n menuItem.focus();\n }\n } else {\n // For raw <a> or <button> elements, focus directly\n (item as HTMLElement).focus();\n }\n }\n }\n\n // Focus the next menu item\n private focusNextItem(): void {\n let nextIndex = (this.currentFocusIndex + 1) % this.menuItems.length;\n\n // Skip disabled items\n let attempts = 0;\n const maxAttempts = this.menuItems.length;\n\n while (attempts < maxAttempts && this.isItemDisabled(this.menuItems[nextIndex])) {\n nextIndex = (nextIndex + 1) % this.menuItems.length;\n attempts++;\n }\n\n // Only focus if we found a non-disabled item\n if (attempts < maxAttempts) {\n this.focusItemByIndex(nextIndex);\n }\n }\n\n // Focus the previous menu item\n private focusPreviousItem(): void {\n let prevIndex = this.currentFocusIndex <= 0\n ? this.menuItems.length - 1\n : this.currentFocusIndex - 1;\n\n // Skip disabled items\n let attempts = 0;\n const maxAttempts = this.menuItems.length;\n\n while (attempts < maxAttempts && this.isItemDisabled(this.menuItems[prevIndex])) {\n prevIndex = prevIndex <= 0 ? this.menuItems.length - 1 : prevIndex - 1;\n attempts++;\n }\n\n // Only focus if we found a non-disabled item\n if (attempts < maxAttempts) {\n this.focusItemByIndex(prevIndex);\n }\n }\n\n // Handle keyboard events for the dropdown\n @Listen('keydown', { target: 'window' })\n handleKeyDown(event: KeyboardEvent) {\n if (!this.isOpen) return;\n\n switch (event.key) {\n case 'Escape':\n event.preventDefault();\n this.closeDropdown();\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n this.focusNextItem();\n break;\n\n case 'ArrowUp':\n event.preventDefault();\n this.focusPreviousItem();\n break;\n\n case 'Home':\n event.preventDefault();\n if (this.menuItems.length > 0) {\n // Find first non-disabled item\n let firstIndex = 0;\n while (firstIndex < this.menuItems.length && this.isItemDisabled(this.menuItems[firstIndex])) {\n firstIndex++;\n }\n if (firstIndex < this.menuItems.length) {\n this.focusItemByIndex(firstIndex);\n }\n }\n break;\n\n case 'End':\n event.preventDefault();\n if (this.menuItems.length > 0) {\n // Find last non-disabled item\n let lastIndex = this.menuItems.length - 1;\n while (lastIndex >= 0 && this.isItemDisabled(this.menuItems[lastIndex])) {\n lastIndex--;\n }\n if (lastIndex >= 0) {\n this.focusItemByIndex(lastIndex);\n }\n }\n break;\n\n case 'Tab':\n if (event.shiftKey) {\n // Let Shift+Tab navigate naturally from first item to trigger\n // For all other items, move to previous item\n const currentIndex = this.getFocusedItemIndex();\n\n if (currentIndex > 0) {\n // If not on first item, prevent default and go to previous item\n event.preventDefault();\n this.focusPreviousItem(); // Use our method that skips disabled items\n }\n // If on first item or no item, let natural tab order move back to trigger\n } else {\n // Forward Tab navigation\n const activeElement = document.activeElement;\n const isTriggerFocused = activeElement === this.triggerEl;\n const currentIndex = this.getFocusedItemIndex();\n\n if (isTriggerFocused && this.menuItems.length > 0) {\n // If trigger is focused, move to first non-disabled menu item\n event.preventDefault();\n\n // Find the first non-disabled item\n let firstFocusableIndex = 0;\n while (firstFocusableIndex < this.menuItems.length && this.isItemDisabled(this.menuItems[firstFocusableIndex])) {\n firstFocusableIndex++;\n }\n\n if (firstFocusableIndex < this.menuItems.length) {\n this.focusItemByIndex(firstFocusableIndex);\n }\n } else if (currentIndex === -1 && this.menuItems.length > 0) {\n // If no menu item is focused, focus the first non-disabled one\n event.preventDefault();\n\n // Find the first non-disabled item\n let firstFocusableIndex = 0;\n while (firstFocusableIndex < this.menuItems.length && this.isItemDisabled(this.menuItems[firstFocusableIndex])) {\n firstFocusableIndex++;\n }\n\n if (firstFocusableIndex < this.menuItems.length) {\n this.focusItemByIndex(firstFocusableIndex);\n }\n } else if (currentIndex !== -1) {\n // Use our method that skips disabled items\n event.preventDefault();\n this.focusNextItem();\n }\n }\n break;\n }\n }\n\n // Handle clicks outside the dropdown to close it\n @Listen('click', { target: 'window' })\n handleWindowClick(event: MouseEvent) {\n if (this.isOpen && !this.host.contains(event.target as Node) && event.target !== this.triggerEl) {\n this.closeDropdown();\n }\n }\n\n\n render() {\n return (\n <Host id={this.componentId}>\n <slot\n name=\"trigger\"\n onSlotchange={this.handleTriggerSlotChange}\n ></slot>\n <pds-box\n border-radius=\"sm\"\n display=\"flex\"\n direction=\"column\"\n class=\"pds-dropdown-menu--panel is-hidden\"\n shadow=\"100\"\n role=\"menu\"\n aria-orientation=\"vertical\"\n part=\"menu-panel\"\n >\n <slot onSlotchange={this.handleSlotChange}></slot>\n </pds-box>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;MAAA,MAAM,kBAAkB,GAAG,guCAAguC;;YCuB9uC,eAAe,gCAAA,MAAA;MAL5B,IAAA,WAAA,CAAA,OAAA,EAAA;;MASU,QAAA,IAAM,CAAA,MAAA,GAAY,KAAK;MACvB,QAAA,IAAS,CAAA,SAAA,GAAsB,EAAE;MACjC,QAAA,IAAiB,CAAA,iBAAA,GAAwB,IAAI;MAI5C,QAAA,IAAiB,CAAA,iBAAA,GAAW,EAAE;MAOvC;;MAEG;MACK,QAAA,IAAS,CAAA,SAAA,GAAkB,cAAc;MAczC,QAAA,IAAA,CAAA,uBAAuB,GAAG,CAAC,KAAY,KAAI;MACjD,YAAA,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,MAAyB;;kBAG7C,MAAM,gBAAgB,GAAG,IAAI,CAAC,MAAM,CAAC,gBAAgB,EAAE;MAEvD,YAAA,IAAI,CAAC,SAAS,GAAG,gBAAgB,CAAC,CAAC,CAAgB;kBACnD,IAAI,CAAC,SAAS,CAAC,OAAO,GAAG,IAAI,CAAC,WAAW;;kBAGzC,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC;kBACpD,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,eAAe,EAAE,OAAO,CAAC;MACvD,SAAC;MAEO,QAAA,IAAA,CAAA,gBAAgB,GAAG,CAAC,KAAY,KAAI;MAC1C,YAAA,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,MAAyB;;kBAG7C,MAAM,gBAAgB,GAAG,IAAI,CAAC,MAAM,CAAC,gBAAgB,EAAE;;;;kBAKvD,MAAM,WAAW,GAAG,CAAC,wBAAwB,EAAE,6BAA6B,EAAE,GAAG,EAAE,QAAQ,CAAC;kBAC5F,MAAM,eAAe,GAAG,gBAAgB,CAAC,MAAM,CAC7C,EAAE,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,EAAE,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC,CACtD;MAED,YAAA,IAAI,eAAe,CAAC,MAAM,GAAG,CAAC,EAAE;sBAC9B,MAAM,WAAW,GAAG,eAAe,CAAC,GAAG,CAAC,EAAE,IAAI,EAAE,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;MAClF,gBAAA,OAAO,CAAC,IAAI,CACV,CAAA,gDAAA,EAAmD,WAAW,CAAI,EAAA,CAAA;0BAClE,CAAa,UAAA,EAAA,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA,CAAE,CACtC;;;;kBAKH,IAAI,CAAC,SAAS,GAAG,gBAAgB,CAAC,MAAM,CAAC,EAAE,IAAG;sBAC5C,MAAM,GAAG,GAAG,EAAE,CAAC,OAAO,CAAC,WAAW,EAAE;sBACpC,OAAO,GAAG,KAAK,wBAAwB,IAAI,GAAG,KAAK,GAAG,IAAI,GAAG,KAAK,QAAQ;MAC5E,aAAC,CAAsB;MACzB,SAAC;;MAGO,QAAA,IAAc,CAAA,cAAA,GAAG,MAAK;MAC5B,YAAA,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM;MAE1B,YAAA,IAAI,IAAI,CAAC,MAAM,EAAE;sBACf,IAAI,CAAC,YAAY,EAAE;;uBACd;sBACL,IAAI,CAAC,aAAa,EAAE;;MAExB,SAAC;;MAGO,QAAA,IAAY,CAAA,YAAA,GAAG,MAAK;;kBAC1B,MAAM,cAAc,GAAG,MAAK;sBAC1B,eAAe,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,OAAsB,EAAE;0BAC3D,SAAS,EAAE,IAAI,CAAC,SAAS;MACzB,oBAAA,QAAQ,EAAE,OAAO;MACjB,oBAAA,UAAU,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE,KAAK,CAAC,EAAC,OAAO,EAAE,CAAC,EAAC,CAAC,CAAC;uBACrD,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAI;0BACnB,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE;8BAChC,IAAI,EAAE,CAAG,EAAA,CAAC,CAAI,EAAA,CAAA;8BACd,GAAG,EAAE,CAAG,EAAA,CAAC,CAAI,EAAA,CAAA;MACd,qBAAA,CAAC;MACJ,iBAAC,CAAC;MACJ,aAAC;;MAGD,YAAA,cAAc,EAAE;;MAGhB,YAAA,IAAI,CAAC,iBAAiB,GAAG,UAAU,CACjC,IAAI,CAAC,SAAS,EACd,IAAI,CAAC,OAAsB,EAC3B,cAAc,CACf;MAED,YAAA,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,CAAC,UAAU,0CAAE,aAAa,CAAC,SAAS,CAAA,CAAE,SAAS,CAAC,MAAM,CAAC,WAAW,CAAC;MAC5E,YAAA,IAAI,CAAC,MAAM,GAAG,IAAI;;kBAGlB,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC;MACtD,SAAC;;MAGO,QAAA,IAAa,CAAA,aAAA,GAAG,MAAK;;MAC3B,YAAA,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,CAAC,UAAU,0CAAE,aAAa,CAAC,SAAS,CAAA,CAAE,SAAS,CAAC,GAAG,CAAC,WAAW,CAAC;MACzE,YAAA,IAAI,CAAC,MAAM,GAAG,KAAK;;MAGnB,YAAA,IAAI,IAAI,CAAC,iBAAiB,EAAE;sBAC1B,IAAI,CAAC,iBAAiB,EAAE;MACxB,gBAAA,IAAI,CAAC,iBAAiB,GAAG,IAAI;;;kBAI/B,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,eAAe,EAAE,OAAO,CAAC;;MAGrD,YAAA,IAAI,CAAC,iBAAiB,GAAG,EAAE;;MAG3B,YAAA,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE;MACxB,SAAC;;MAGO,QAAA,IAAW,CAAA,WAAA,GAAG,MAAK;kBACzB,IAAI,CAAC,cAAc,EAAE;MACvB,SAAC;MA+OF;UA1WC,kBAAkB,GAAA;;MAChB,QAAA,IAAI,CAAC,OAAO,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,IAAI,CAAC,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,aAAa,CAAC,SAAS,CAAsB;;UAGpF,oBAAoB,GAAA;;MAElB,QAAA,IAAI,IAAI,CAAC,iBAAiB,EAAE;kBAC1B,IAAI,CAAC,iBAAiB,EAAE;MACxB,YAAA,IAAI,CAAC,iBAAiB,GAAG,IAAI;;;;MAsHzB,IAAA,cAAc,CAAC,IAAqB,EAAA;cAC1C,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE;MAE1C,QAAA,IAAI,OAAO,KAAK,wBAAwB,EAAE;kBACxC,OAAQ,IAAuC,CAAC,QAAQ;;MACnD,aAAA,IAAI,OAAO,KAAK,QAAQ,EAAE;kBAC/B,OAAQ,IAA0B,CAAC,QAAQ;;MACtC,aAAA,IAAI,OAAO,KAAK,GAAG,EAAE;kBAC1B,OAAO,IAAI,CAAC,YAAY,CAAC,eAAe,CAAC,KAAK,MAAM;;MAEtD,QAAA,OAAO,KAAK;;;UAIN,mBAAmB,GAAA;MACzB,QAAA,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAuC;MACtE,QAAA,IAAI,CAAC,aAAa;kBAAE,OAAO,EAAE;;;cAI7B,OAAO,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,IAAG;kBACrC,IAAI,IAAI,KAAK,aAAa;MAAE,gBAAA,OAAO,IAAI;;kBAGvC,IAAI,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,wBAAwB,EAAE;MAC3D,gBAAA,MAAM,UAAU,GAAI,IAAuC,CAAC,UAAU;sBACtE,IAAI,UAAU,aAAV,UAAU,KAAA,MAAA,GAAA,MAAA,GAAV,UAAU,CAAE,QAAQ,CAAC,aAAa,CAAC;MAAE,oBAAA,OAAO,IAAI;;MAGtD,YAAA,OAAO,KAAK;MACd,SAAC,CAAC;;;MAII,IAAA,gBAAgB,CAAC,KAAa,EAAA;;MACpC,QAAA,IAAI,KAAK,IAAI,CAAC,IAAI,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE;MAC/C,YAAA,IAAI,CAAC,iBAAiB,GAAG,KAAK;kBAC9B,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC;kBAClC,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE;MAE1C,YAAA,IAAI,OAAO,KAAK,wBAAwB,EAAE;;sBAExC,MAAM,QAAQ,GAAG,IAAsC;MACvD,gBAAA,MAAM,WAAW,GAAG,CAAA,EAAA,GAAA,QAAQ,CAAC,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,aAAa,CAAC,QAAQ,CAAC;MAChE,gBAAA,MAAM,SAAS,GAAG,CAAA,CAAA,EAAA,GAAA,MAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,aAAa,CAAC,UAAU,CAAC,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,UAAU,0CAAE,aAAa,CAAC,GAAG,CAAC;8BAC3F,CAAA,EAAA,GAAA,QAAQ,CAAC,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,aAAa,CAAC,GAAG,CAAC,CAAA;sBAE5C,IAAI,WAAW,EAAE;0BACf,WAAW,CAAC,KAAK,EAAE;;2BACd,IAAI,SAAS,EAAE;0BACpB,SAAS,CAAC,KAAK,EAAE;;2BACZ;;0BAEL,QAAQ,CAAC,KAAK,EAAE;;;uBAEb;;sBAEJ,IAAoB,CAAC,KAAK,EAAE;;;;;UAM3B,aAAa,GAAA;MACnB,QAAA,IAAI,SAAS,GAAG,CAAC,IAAI,CAAC,iBAAiB,GAAG,CAAC,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM;;cAGpE,IAAI,QAAQ,GAAG,CAAC;MAChB,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM;MAEzC,QAAA,OAAO,QAAQ,GAAG,WAAW,IAAI,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,EAAE;MAC/E,YAAA,SAAS,GAAG,CAAC,SAAS,GAAG,CAAC,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM;MACnD,YAAA,QAAQ,EAAE;;;MAIZ,QAAA,IAAI,QAAQ,GAAG,WAAW,EAAE;MAC1B,YAAA,IAAI,CAAC,gBAAgB,CAAC,SAAS,CAAC;;;;UAK5B,iBAAiB,GAAA;MACvB,QAAA,IAAI,SAAS,GAAG,IAAI,CAAC,iBAAiB,IAAI;MACxC,cAAE,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG;MAC1B,cAAE,IAAI,CAAC,iBAAiB,GAAG,CAAC;;cAG9B,IAAI,QAAQ,GAAG,CAAC;MAChB,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM;MAEzC,QAAA,OAAO,QAAQ,GAAG,WAAW,IAAI,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,EAAE;kBAC/E,SAAS,GAAG,SAAS,IAAI,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,GAAG,SAAS,GAAG,CAAC;MACtE,YAAA,QAAQ,EAAE;;;MAIZ,QAAA,IAAI,QAAQ,GAAG,WAAW,EAAE;MAC1B,YAAA,IAAI,CAAC,gBAAgB,CAAC,SAAS,CAAC;;;;MAMpC,IAAA,aAAa,CAAC,KAAoB,EAAA;cAChC,IAAI,CAAC,IAAI,CAAC,MAAM;kBAAE;MAElB,QAAA,QAAQ,KAAK,CAAC,GAAG;MACf,YAAA,KAAK,QAAQ;sBACX,KAAK,CAAC,cAAc,EAAE;sBACtB,IAAI,CAAC,aAAa,EAAE;sBACpB;MAEF,YAAA,KAAK,WAAW;sBACd,KAAK,CAAC,cAAc,EAAE;sBACtB,IAAI,CAAC,aAAa,EAAE;sBACpB;MAEF,YAAA,KAAK,SAAS;sBACZ,KAAK,CAAC,cAAc,EAAE;sBACtB,IAAI,CAAC,iBAAiB,EAAE;sBACxB;MAEF,YAAA,KAAK,MAAM;sBACT,KAAK,CAAC,cAAc,EAAE;sBACtB,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE;;0BAE7B,IAAI,UAAU,GAAG,CAAC;0BAClB,OAAO,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,IAAI,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,EAAE;MAC5F,wBAAA,UAAU,EAAE;;0BAEd,IAAI,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE;MACtC,wBAAA,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC;;;sBAGrC;MAEF,YAAA,KAAK,KAAK;sBACR,KAAK,CAAC,cAAc,EAAE;sBACtB,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE;;0BAE7B,IAAI,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC;MACzC,oBAAA,OAAO,SAAS,IAAI,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,EAAE;MACvE,wBAAA,SAAS,EAAE;;MAEb,oBAAA,IAAI,SAAS,IAAI,CAAC,EAAE;MAClB,wBAAA,IAAI,CAAC,gBAAgB,CAAC,SAAS,CAAC;;;sBAGpC;MAEF,YAAA,KAAK,KAAK;MACR,gBAAA,IAAI,KAAK,CAAC,QAAQ,EAAE;;;MAGlB,oBAAA,MAAM,YAAY,GAAG,IAAI,CAAC,mBAAmB,EAAE;MAE/C,oBAAA,IAAI,YAAY,GAAG,CAAC,EAAE;;8BAEpB,KAAK,CAAC,cAAc,EAAE;MACtB,wBAAA,IAAI,CAAC,iBAAiB,EAAE,CAAC;;;;2BAGtB;;MAEL,oBAAA,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa;MAC5C,oBAAA,MAAM,gBAAgB,GAAG,aAAa,KAAK,IAAI,CAAC,SAAS;MACzD,oBAAA,MAAM,YAAY,GAAG,IAAI,CAAC,mBAAmB,EAAE;0BAE/C,IAAI,gBAAgB,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE;;8BAEjD,KAAK,CAAC,cAAc,EAAE;;8BAGtB,IAAI,mBAAmB,GAAG,CAAC;8BAC3B,OAAO,mBAAmB,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,IAAI,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,SAAS,CAAC,mBAAmB,CAAC,CAAC,EAAE;MAC9G,4BAAA,mBAAmB,EAAE;;8BAGvB,IAAI,mBAAmB,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE;MAC/C,4BAAA,IAAI,CAAC,gBAAgB,CAAC,mBAAmB,CAAC;;;MAEvC,yBAAA,IAAI,YAAY,KAAK,EAAE,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE;;8BAE3D,KAAK,CAAC,cAAc,EAAE;;8BAGtB,IAAI,mBAAmB,GAAG,CAAC;8BAC3B,OAAO,mBAAmB,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,IAAI,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,SAAS,CAAC,mBAAmB,CAAC,CAAC,EAAE;MAC9G,4BAAA,mBAAmB,EAAE;;8BAGvB,IAAI,mBAAmB,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE;MAC/C,4BAAA,IAAI,CAAC,gBAAgB,CAAC,mBAAmB,CAAC;;;MAEvC,yBAAA,IAAI,YAAY,KAAK,EAAE,EAAE;;8BAE9B,KAAK,CAAC,cAAc,EAAE;8BACtB,IAAI,CAAC,aAAa,EAAE;;;sBAGxB;;;;MAMN,IAAA,iBAAiB,CAAC,KAAiB,EAAA;cACjC,IAAI,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC,IAAI,KAAK,CAAC,MAAM,KAAK,IAAI,CAAC,SAAS,EAAE;kBAC/F,IAAI,CAAC,aAAa,EAAE;;;UAKxB,MAAM,GAAA;cACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,EAAE,EAAE,IAAI,CAAC,WAAW,EAAA,EACxB,CACE,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,SAAS,EACd,YAAY,EAAE,IAAI,CAAC,uBAAuB,EACpC,CAAA,EACR,CACgB,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,eAAA,EAAA,IAAI,EAClB,OAAO,EAAC,MAAM,EACd,SAAS,EAAC,QAAQ,EAClB,KAAK,EAAC,oCAAoC,EAC1C,MAAM,EAAC,KAAK,EACZ,IAAI,EAAC,MAAM,EAAA,kBAAA,EACM,UAAU,EAC3B,IAAI,EAAC,YAAY,EAAA,EAEjB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,YAAY,EAAE,IAAI,CAAC,gBAAgB,EAAS,CAAA,CAC1C,CACL;;;;;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"p-BHr70Hts.system.js","sources":["src/components/pds-dropdown-menu/pds-dropdown-menu.scss?tag=pds-dropdown-menu&encapsulation=shadow","src/components/pds-dropdown-menu/pds-dropdown-menu.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.is-hidden {\n display: none;\n}\n\n.pds-dropdown-menu--panel {\n background-color: var(--pine-color-background-container);\n border-radius: var(--pine-dimension-xs);\n left: var(--pine-dimension-none);\n min-width: 170px;\n padding: var(--pine-dimension-xs);\n position: fixed;\n z-index: var(--pine-z-index-overlay);\n\n :host-context([data-theme=\"dark\"]) & {\n border: var(--pine-border);\n }\n}\n\n// Styles for raw <a> and <button> elements slotted into the menu\n// These are allowed for edge cases requiring native browser/framework behavior\n// (e.g., Rails UJS, Turbo) that cannot work through Shadow DOM.\n//\n// Note: ::slotted() cannot be combined with pseudo-classes like :hover or :focus.\n// Raw elements will receive base styling here; hover/focus states must be handled\n// by the consuming application's CSS if needed.\n::slotted(a),\n::slotted(button) {\n align-items: center;\n appearance: none;\n background: transparent;\n border: 0;\n border-radius: var(--pine-dimension-xs) !important;\n box-sizing: border-box;\n color: var(--pine-color-text) !important;\n cursor: pointer;\n display: flex;\n flex-grow: 1;\n font: var(--pine-typography-body-medium) !important;\n gap: var(--pine-dimension-xs);\n margin: calc(var(--pine-border-width) + 2px) !important;\n padding: var(--pine-dimension-xs) !important;\n text-align: start;\n text-decoration: none !important;\n width: calc(100% - calc(var(--pine-border-width) + 2px) * 2);\n}\n\n// Destructive variant for raw elements\n::slotted(.destructive) {\n color: var(--pine-color-danger) !important;\n}\n\n// Disabled state for raw elements (using attribute selectors, not pseudo-classes)\n// ::slotted([disabled]) is an attribute-presence selector — it matches even when\n// disabled=\"false\" is set as a string (e.g. by React on custom elements). The\n// :not([disabled=\"false\"]) guard ensures only a truly-disabled attribute applies.\n::slotted([aria-disabled=\"true\"]),\n::slotted([disabled]:not([disabled=\"false\"])) {\n cursor: not-allowed;\n opacity: 0.5;\n pointer-events: none;\n}\n","import { Component, Element, Host, h, Prop, Listen, State } from '@stencil/core';\nimport type { BasePdsProps } from '@utils/interfaces';\nimport { PlacementType } from '@utils/types';\nimport { computePosition,\n flip,\n offset,\n shift,\n autoUpdate,\n} from '@floating-ui/dom';\n\n/**\n * Union type for focusable menu items (component or raw elements)\n */\ntype MenuItemElement = HTMLPdsDropdownMenuItemElement | HTMLAnchorElement | HTMLButtonElement;\n\n/**\n * @part menu-panel - Exposes the dropdown menu container for styling.\n */\n@Component({\n tag: 'pds-dropdown-menu',\n styleUrl: 'pds-dropdown-menu.scss',\n shadow: true,\n})\nexport class PdsDropdownMenu implements BasePdsProps {\n private slotEl: HTMLSlotElement;\n private triggerEl: HTMLElement;\n private panelEl: HTMLPdsBoxElement;\n private isOpen: boolean = false;\n private menuItems: MenuItemElement[] = [];\n private cleanupAutoUpdate: (() => void) | null = null;\n\n @Element() host: HTMLPdsDropdownMenuElement;\n\n @State() currentFocusIndex: number = -1;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * The placement of the dropdown panel relative to the trigger.\n */\n @Prop() placement: PlacementType = 'bottom-start';\n\n componentDidRender() {\n this.panelEl = this.host.shadowRoot?.querySelector('pds-box') as HTMLPdsBoxElement;\n }\n\n disconnectedCallback() {\n // Clean up auto-update when component is removed from DOM\n if (this.cleanupAutoUpdate) {\n this.cleanupAutoUpdate();\n this.cleanupAutoUpdate = null;\n }\n }\n\n private handleTriggerSlotChange = (event: Event) => {\n this.slotEl = event.target as HTMLSlotElement;\n\n // Get all elements assigned to this slot\n const assignedElements = this.slotEl.assignedElements();\n\n this.triggerEl = assignedElements[0] as HTMLElement;\n this.triggerEl.onclick = this.handleClick;\n\n // Add accessibility attributes to trigger\n this.triggerEl.setAttribute('aria-haspopup', 'menu');\n this.triggerEl.setAttribute('aria-expanded', 'false');\n }\n\n private handleSlotChange = (event: Event) => {\n this.slotEl = event.target as HTMLSlotElement;\n\n // Get all elements assigned to this slot\n const assignedElements = this.slotEl.assignedElements();\n\n // Allowed elements: pds-dropdown-menu-item, pds-dropdown-menu-separator, <a>, <button>\n // Raw <a> and <button> elements are allowed for edge cases requiring native browser/framework\n // behavior (e.g., Rails UJS, Turbo) that cannot work through Shadow DOM.\n const allowedTags = ['pds-dropdown-menu-item', 'pds-dropdown-menu-separator', 'a', 'button'];\n const invalidElements = assignedElements.filter(\n el => !allowedTags.includes(el.tagName.toLowerCase())\n );\n\n if (invalidElements.length > 0) {\n const invalidTags = invalidElements.map(el => el.tagName.toLowerCase()).join(', ');\n console.warn(\n `pds-dropdown-menu: Unexpected element(s) found: ${invalidTags}. ` +\n `Expected: ${allowedTags.join(', ')}`\n );\n }\n\n // Store all focusable items for keyboard navigation\n // This includes pds-dropdown-menu-item components and raw <a>/<button> elements\n this.menuItems = assignedElements.filter(el => {\n const tag = el.tagName.toLowerCase();\n return tag === 'pds-dropdown-menu-item' || tag === 'a' || tag === 'button';\n }) as MenuItemElement[];\n }\n\n // Toggle dropdown open/closed\n private toggleDropdown = () => {\n this.isOpen = !this.isOpen;\n\n if (this.isOpen) {\n this.openDropdown();\n } else {\n this.closeDropdown();\n }\n }\n\n // Open the dropdown and position it\n private openDropdown = () => {\n const updatePosition = () => {\n computePosition(this.triggerEl, this.panelEl as HTMLElement, {\n placement: this.placement,\n strategy: 'fixed',\n middleware: [offset(6), flip(), shift({padding: 5})],\n }).then(({ x, y }) => {\n Object.assign(this.panelEl.style, {\n left: `${x}px`,\n top: `${y}px`,\n });\n });\n };\n\n // Initial position\n updatePosition();\n\n // Set up auto-update for window resize and scroll\n this.cleanupAutoUpdate = autoUpdate(\n this.triggerEl,\n this.panelEl as HTMLElement,\n updatePosition\n );\n\n this.host.shadowRoot?.querySelector('pds-box').classList.remove('is-hidden');\n this.isOpen = true;\n\n // Update ARIA attributes\n this.triggerEl.setAttribute('aria-expanded', 'true');\n }\n\n // Close the dropdown\n private closeDropdown = () => {\n this.host.shadowRoot?.querySelector('pds-box').classList.add('is-hidden');\n this.isOpen = false;\n\n // Clean up auto-update\n if (this.cleanupAutoUpdate) {\n this.cleanupAutoUpdate();\n this.cleanupAutoUpdate = null;\n }\n\n // Update ARIA attributes\n this.triggerEl.setAttribute('aria-expanded', 'false');\n\n // Reset focus index\n this.currentFocusIndex = -1;\n\n // Return focus to trigger\n this.triggerEl.focus();\n }\n\n // Handle click on the trigger element\n private handleClick = () => {\n this.toggleDropdown();\n }\n\n // Check if a menu item is disabled (handles both component and raw elements)\n private isItemDisabled(item: MenuItemElement): boolean {\n const tagName = item.tagName.toLowerCase();\n\n if (tagName === 'pds-dropdown-menu-item') {\n return (item as HTMLPdsDropdownMenuItemElement).disabled;\n } else if (tagName === 'button') {\n return (item as HTMLButtonElement).disabled;\n } else if (tagName === 'a') {\n return item.getAttribute('aria-disabled') === 'true';\n }\n return false;\n }\n\n // Get the index of the currently focused menu item\n private getFocusedItemIndex(): number {\n const activeElement = document.activeElement as MenuItemElement | null;\n if (!activeElement) return -1;\n\n // For raw elements, check direct match\n // For pds-dropdown-menu-item, also check if the active element is inside the shadow root\n return this.menuItems.findIndex(item => {\n if (item === activeElement) return true;\n\n // Check if activeElement is inside the item's shadow root (for pds-dropdown-menu-item)\n if (item.tagName.toLowerCase() === 'pds-dropdown-menu-item') {\n const shadowRoot = (item as HTMLPdsDropdownMenuItemElement).shadowRoot;\n if (shadowRoot?.contains(activeElement)) return true;\n }\n\n return false;\n });\n }\n\n // Focus a specific menu item by index\n private focusItemByIndex(index: number): void {\n if (index >= 0 && index < this.menuItems.length) {\n this.currentFocusIndex = index;\n const item = this.menuItems[index];\n const tagName = item.tagName.toLowerCase();\n\n if (tagName === 'pds-dropdown-menu-item') {\n // For pds-dropdown-menu-item, focus the inner element\n const menuItem = item as HTMLPdsDropdownMenuItemElement;\n const innerButton = menuItem.shadowRoot?.querySelector('button');\n const innerLink = menuItem.shadowRoot?.querySelector('pds-link')?.shadowRoot?.querySelector('a')\n || menuItem.shadowRoot?.querySelector('a');\n\n if (innerButton) {\n innerButton.focus();\n } else if (innerLink) {\n innerLink.focus();\n } else {\n // Fallback to focusing the host\n menuItem.focus();\n }\n } else {\n // For raw <a> or <button> elements, focus directly\n (item as HTMLElement).focus();\n }\n }\n }\n\n // Focus the next menu item\n private focusNextItem(): void {\n let nextIndex = (this.currentFocusIndex + 1) % this.menuItems.length;\n\n // Skip disabled items\n let attempts = 0;\n const maxAttempts = this.menuItems.length;\n\n while (attempts < maxAttempts && this.isItemDisabled(this.menuItems[nextIndex])) {\n nextIndex = (nextIndex + 1) % this.menuItems.length;\n attempts++;\n }\n\n // Only focus if we found a non-disabled item\n if (attempts < maxAttempts) {\n this.focusItemByIndex(nextIndex);\n }\n }\n\n // Focus the previous menu item\n private focusPreviousItem(): void {\n let prevIndex = this.currentFocusIndex <= 0\n ? this.menuItems.length - 1\n : this.currentFocusIndex - 1;\n\n // Skip disabled items\n let attempts = 0;\n const maxAttempts = this.menuItems.length;\n\n while (attempts < maxAttempts && this.isItemDisabled(this.menuItems[prevIndex])) {\n prevIndex = prevIndex <= 0 ? this.menuItems.length - 1 : prevIndex - 1;\n attempts++;\n }\n\n // Only focus if we found a non-disabled item\n if (attempts < maxAttempts) {\n this.focusItemByIndex(prevIndex);\n }\n }\n\n // Handle keyboard events for the dropdown\n @Listen('keydown', { target: 'window' })\n handleKeyDown(event: KeyboardEvent) {\n if (!this.isOpen) return;\n\n switch (event.key) {\n case 'Escape':\n event.preventDefault();\n this.closeDropdown();\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n this.focusNextItem();\n break;\n\n case 'ArrowUp':\n event.preventDefault();\n this.focusPreviousItem();\n break;\n\n case 'Home':\n event.preventDefault();\n if (this.menuItems.length > 0) {\n // Find first non-disabled item\n let firstIndex = 0;\n while (firstIndex < this.menuItems.length && this.isItemDisabled(this.menuItems[firstIndex])) {\n firstIndex++;\n }\n if (firstIndex < this.menuItems.length) {\n this.focusItemByIndex(firstIndex);\n }\n }\n break;\n\n case 'End':\n event.preventDefault();\n if (this.menuItems.length > 0) {\n // Find last non-disabled item\n let lastIndex = this.menuItems.length - 1;\n while (lastIndex >= 0 && this.isItemDisabled(this.menuItems[lastIndex])) {\n lastIndex--;\n }\n if (lastIndex >= 0) {\n this.focusItemByIndex(lastIndex);\n }\n }\n break;\n\n case 'Tab':\n if (event.shiftKey) {\n // Let Shift+Tab navigate naturally from first item to trigger\n // For all other items, move to previous item\n const currentIndex = this.getFocusedItemIndex();\n\n if (currentIndex > 0) {\n // If not on first item, prevent default and go to previous item\n event.preventDefault();\n this.focusPreviousItem(); // Use our method that skips disabled items\n }\n // If on first item or no item, let natural tab order move back to trigger\n } else {\n // Forward Tab navigation\n const activeElement = document.activeElement;\n const isTriggerFocused = activeElement === this.triggerEl;\n const currentIndex = this.getFocusedItemIndex();\n\n if (isTriggerFocused && this.menuItems.length > 0) {\n // If trigger is focused, move to first non-disabled menu item\n event.preventDefault();\n\n // Find the first non-disabled item\n let firstFocusableIndex = 0;\n while (firstFocusableIndex < this.menuItems.length && this.isItemDisabled(this.menuItems[firstFocusableIndex])) {\n firstFocusableIndex++;\n }\n\n if (firstFocusableIndex < this.menuItems.length) {\n this.focusItemByIndex(firstFocusableIndex);\n }\n } else if (currentIndex === -1 && this.menuItems.length > 0) {\n // If no menu item is focused, focus the first non-disabled one\n event.preventDefault();\n\n // Find the first non-disabled item\n let firstFocusableIndex = 0;\n while (firstFocusableIndex < this.menuItems.length && this.isItemDisabled(this.menuItems[firstFocusableIndex])) {\n firstFocusableIndex++;\n }\n\n if (firstFocusableIndex < this.menuItems.length) {\n this.focusItemByIndex(firstFocusableIndex);\n }\n } else if (currentIndex !== -1) {\n // Use our method that skips disabled items\n event.preventDefault();\n this.focusNextItem();\n }\n }\n break;\n }\n }\n\n // Handle clicks outside the dropdown to close it\n @Listen('click', { target: 'window' })\n handleWindowClick(event: MouseEvent) {\n if (this.isOpen && !this.host.contains(event.target as Node) && event.target !== this.triggerEl) {\n this.closeDropdown();\n }\n }\n\n\n render() {\n return (\n <Host id={this.componentId}>\n <slot\n name=\"trigger\"\n onSlotchange={this.handleTriggerSlotChange}\n ></slot>\n <pds-box\n border-radius=\"sm\"\n display=\"flex\"\n direction=\"column\"\n class=\"pds-dropdown-menu--panel is-hidden\"\n shadow=\"100\"\n role=\"menu\"\n aria-orientation=\"vertical\"\n part=\"menu-panel\"\n >\n <slot onSlotchange={this.handleSlotChange}></slot>\n </pds-box>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-
|
|
1
|
+
{"version":3,"file":"p-BILA6IDX.system.js","sources":["src/components/pds-property/pds-property.scss?tag=pds-property&encapsulation=shadow","src/components/pds-property/pds-property.tsx"],"sourcesContent":[":host {\n color: var(--pine-color-text-message);\n font: var(--pine-typography-body-medium);\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n/**\n * @slot (default) - The property text content.\n */\n\n@Component({\n tag: 'pds-property',\n styleUrls: ['pds-property.scss'],\n shadow: true,\n})\nexport class PdsProperty {\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * The name of the icon to display before the property text.\n */\n @Prop() icon: string = 'star';\n\n render() {\n return (\n <Host id={this.componentId}>\n <pds-box align-items=\"center\" gap=\"xs\">\n <pds-icon icon={this.icon} size=\"var(--pine-dimension-sm)\" aria-hidden=\"true\"></pds-icon>\n <slot />\n </pds-box>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;MAAA,MAAM,cAAc,GAAG,qFAAqF;;YCW/F,WAAW,2BAAA,MAAA;MALxB,IAAA,WAAA,CAAA,OAAA,EAAA;;MAWE;;MAEG;MACK,QAAA,IAAI,CAAA,IAAA,GAAW,MAAM;MAY9B;UAVC,MAAM,GAAA;MACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,EAAE,EAAE,IAAI,CAAC,WAAW,EAAA,EACxB,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,aAAA,EAAqB,QAAQ,EAAC,GAAG,EAAC,IAAI,EAAA,EACpC,CAAU,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAC,0BAA0B,EAAa,aAAA,EAAA,MAAM,EAAY,CAAA,EACzF,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACA,CACL;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-D504xCQQ.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/**\n * @part dismiss\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 part=\"dismiss\"\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":";;;;;;;;;;;;MAAA,MAAM,WAAW,GAAG,y4JAAy4J;;YCUh5J,QAAQ,wBAAA,MAAA;MALrB,IAAA,WAAA,CAAA,OAAA,EAAA;;;MAYE;;;;MAIG;MACK,QAAA,IAAW,CAAA,WAAA,GAAY,IAAI;MAEnC;;;;MAIG;MACK,QAAA,IAAQ,CAAA,QAAA,GAAW,IAAI;MAO/B;;;;;;MAMG;MACK,QAAA,IAAI,CAAA,IAAA,GAAqC,SAAS;MAE1D;;MAEG;MACM,QAAA,IAAS,CAAA,SAAA,GAAY,IAAI;MAElC;;MAEG;MACM,QAAA,IAAc,CAAA,cAAA,GAAY,KAAK;MAgHzC;UAnGC,gBAAgB,GAAA;MACd,QAAA,IAAI,IAAI,CAAC,QAAQ,GAAG,CAAC,EAAE;kBACrB,IAAI,CAAC,iBAAiB,EAAE;;;UAI5B,oBAAoB,GAAA;cAClB,IAAI,CAAC,OAAO,EAAE;;MAIhB,IAAA,oBAAoB,CAAC,WAAmB,EAAA;MACtC,QAAA,IAAI,IAAI,CAAC,YAAY,EAAE;MACrB,YAAA,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC;MACtC,YAAA,IAAI,CAAC,YAAY,GAAG,SAAS;;MAE/B,QAAA,IAAI,WAAW,GAAG,CAAC,EAAE;kBACnB,IAAI,CAAC,iBAAiB,EAAE;;;MAK5B,IAAA,MAAM,OAAO,GAAA;;MAEX,QAAA,IAAI,CAAC,cAAc,GAAG,IAAI;;MAG1B,QAAA,MAAM,IAAI,OAAO,CAAC,CAAC,OAAO,KAAK,UAAU,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,CAAC;MAEzD,QAAA,IAAI,CAAC,SAAS,GAAG,KAAK;cACtB,IAAI,CAAC,OAAO,EAAE;MACd,QAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAAE,WAAW,EAAE,IAAI,CAAC,WAAW,EAAE,CAAC;;;UAIxD,OAAO,GAAA;MACb,QAAA,IAAI,IAAI,CAAC,YAAY,EAAE;MACrB,YAAA,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC;MACtC,YAAA,IAAI,CAAC,YAAY,GAAG,SAAS;;;UAIzB,iBAAiB,GAAA;cACvB,IAAI,CAAC,YAAY,GAAG,MAAM,CAAC,UAAU,CAAC,MAAK;kBACzC,IAAI,CAAC,OAAO,EAAE;MAChB,SAAC,EAAE,IAAI,CAAC,QAAQ,CAAC;;UAGX,UAAU,GAAA;;MAEhB,QAAA,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,EAAE;MAC3B,YAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,mBAAmB,EAAA,EAC5B,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,2BAA2B,EAAC,OAAO,EAAC,aAAa,iBAAa,MAAM,EAAA,EAC7E,CAAA,CAAA,QAAA,EAAA,EAAQ,KAAK,EAAC,wBAAwB,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,IAAI,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAA,cAAA,EAAc,GAAG,EAAA,gBAAA,EAAgB,OAAO,EAAA,CAAG,CACtI,CACF;;;cAKV,OAAO,IAAI,CAAC,IAAI,IAAI,gBAAU,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAC,iBAAiB,GAAG;;UAG3E,MAAM,GAAA;MACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,MAAM,EAAE,CAAC,IAAI,CAAC,SAAS,EAAA,EAC3B,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;MACL,gBAAA,WAAW,EAAE,IAAI;sBACjB,CAAC,CAAA,WAAA,EAAc,IAAI,CAAC,IAAI,CAAA,CAAE,GAAG,IAAI,CAAC,IAAI,KAAK,SAAS;sBACpD,0BAA0B,EAAE,IAAI,CAAC;MAClC,aAAA,EACD,IAAI,EAAC,OAAO,EAAA,WAAA,EACF,QAAQ,EAAA,EAEjB,IAAI,CAAC,UAAU,EAAE,EAElB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,oBAAoB,EAAA,EAC9B,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACR,EAEN,IAAI,CAAC,WAAW,KACf,+DACE,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,SAAS,EACd,KAAK,EAAC,mBAAmB,EACzB,OAAO,EAAE,MAAK;sBACZ,IAAI,CAAC,OAAO,EAAE;mBACf,gBACU,iBAAiB,EAAA,EAE5B,CAAU,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAA,CAAG,CACnB,CACV,CACG,CACD;;;;;;;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"p-BR3EzrR2.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/**\n * @part dismiss\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 part=\"dismiss\"\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-VWcPIY1a.system.js","sources":["src/components/pds-text/pds-text.scss?tag=pds-text&encapsulation=shadow","src/components/pds-text/pds-text.tsx"],"sourcesContent":[":host {\n display: inline;\n}\n\n:host([decoration=\"underline-dotted\"]) > * {\n text-decoration-color: var(--pine-color-text-tertiary);\n text-decoration-line: underline;\n text-decoration-style: dotted;\n text-decoration-thickness: 12%;\n text-underline-offset: 0.3rem;\n text-underline-position: under;\n}\n\n:host([decoration=\"strikethrough\"])>* {\n text-decoration: line-through;\n}\n\n/* stylelint-disable */\nh1 {\n font: var(--pine-typography-heading-1);\n letter-spacing: var(--pine-letter-spacing-heading-1);\n}\n\nh2 {\n font: var(--pine-typography-heading-2);\n letter-spacing: var(--pine-letter-spacing-heading-2);\n}\n\nh3 {\n font: var(--pine-typography-heading-3);\n letter-spacing: var(--pine-letter-spacing-heading-3);\n}\n\nh4 {\n font: var(--pine-typography-heading-4);\n letter-spacing: var(--pine-letter-spacing-heading-4);\n}\n\nh5 {\n font: var(--pine-typography-heading-5);\n letter-spacing: var(--pine-letter-spacing-heading-5);\n}\n\nh6 {\n font: var(--pine-typography-heading-6);\n letter-spacing: var(--pine-letter-spacing-heading-6);\n}\n\ncode, em, p, pre, strong {\n font: var(--pine-typography-body);\n letter-spacing: var(--pine-letter-spacing);\n}\n/* stylelint-enable */\n\ncode, pre {\n font-family: monospace;\n letter-spacing: 0;\n line-height: 1;\n}\n\nem {\n font-style: normal;\n}\n\nstrong {\n font-weight: bolder;\n}\n\n:host([truncate]) > * {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n:host([italic]) > * {\n font-style: italic;\n}\n\n// Colors/Variants/Sentiment\n\n// Variable is set in TSX\n// If color prop value isn't valid, will default to body text color\n.pds-text {\n color: var(--color, var(--pine-color-text));\n margin: var(--pine-dimension-none);\n}\n\n// Font Sizes\n$type-sizes: (\n 2xl: var(--pine-font-size-body-2xl),\n xl: var(--pine-font-size-body-xl),\n lg: var(--pine-font-size-body-lg),\n md: var(--pine-font-size-body-md),\n sm: var(--pine-font-size-body-sm),\n xs: var(--pine-font-size-body-xs),\n 2xs: var(--pine-font-size-body-2xs),\n h1: var(--pine-font-size-heading-1),\n h2: var(--pine-font-size-heading-2),\n h3: var(--pine-font-size-heading-3),\n h4: var(--pine-font-size-heading-4),\n h5: var(--pine-font-size-heading-5),\n h6: var(--pine-font-size-heading-6),\n);\n\n@mixin generate-type-sizes($type-sizes) {\n @each $key, $value in $type-sizes {\n .pds-text--size-#{$key} {\n font-size: $value;\n }\n }\n}\n\n@include generate-type-sizes($type-sizes);\n\n// Font Weights\n$type-weights: (\n extra-light: var(--pine-font-weight-extra-light),\n light: var(--pine-font-weight-light),\n regular: var(--pine-font-weight-regular),\n medium: var(--pine-font-weight-medium),\n semibold: var(--pine-font-weight-semi-bold),\n bold: var(--pine-font-weight-bold),\n);\n\n@mixin generate-type-weights($type-weights) {\n @each $key, $value in $type-weights {\n .pds-text--weight-#{$key} {\n font-weight: $value;\n }\n }\n}\n\n@include generate-type-weights($type-weights);\n\n// Gutter Sizes\n$type-gutters: (\n 2xl: var(--pine-dimension-2xl),\n xl: var(--pine-dimension-xl),\n lg: var(--pine-dimension-lg),\n md: var(--pine-dimension-md),\n sm: var(--pine-dimension-sm),\n xs: var(--pine-dimension-xs),\n 2xs: var(--pine-dimension-2xs),\n);\n\n@mixin generate-type-gutters($type-gutters) {\n @each $key, $value in $type-gutters {\n .pds-text--gutter-#{$key} {\n margin-block-end: $value;\n }\n }\n}\n\n@include generate-type-gutters($type-gutters);\n\n// Text Alignment\n$type-alignments: (\n start: start,\n center: center,\n end: end,\n justify: justify,\n);\n\n@mixin generate-type-alignments($type-alignments) {\n @each $key, $value in $type-alignments {\n .pds-text--align-#{$key} {\n text-align: $value;\n }\n }\n}\n\n@include generate-type-alignments($type-alignments);\n","import { Component, h, Prop, Element, Watch } from '@stencil/core';\nimport { setColor } from '../../utils/utils';\nimport { setupTruncationTooltip } from '../../utils/truncation-tooltip';\n\n/**\n * @part content - The text content container\n */\n@Component({\n tag: 'pds-text',\n styleUrl: 'pds-text.scss',\n shadow: true,\n})\nexport class PdsText {\n @Element() el: HTMLPdsTextElement;\n private contentEl: HTMLElement;\n private truncationCleanup: (() => void) | null = null;\n /**\n * Sets the text alignment.\n */\n @Prop() align?: 'start' | 'center' | 'end' | 'justify';\n\n /**\n * Sets the text color.\n */\n @Prop() color?: string;\n\n /**\n * Sets the text decoration.\n */\n @Prop() decoration?: 'strikethrough' | 'underline-dotted';\n\n /**\n * Set the bottom margin for the text.\n */\n @Prop() gutter?: '2xl' | 'xl' | 'lg' | 'md' | 'sm' | 'xs' | '2xs';\n\n /**\n * If set or `true`, the text will be italic.\n */\n @Prop() italic?: boolean;\n\n /**\n * Sets the font size.\n */\n @Prop() size?:\n | '2xl'\n | 'xl'\n | 'lg'\n | 'md'\n | 'sm'\n | 'xs'\n | '2xs'\n | 'h1'\n | 'h2'\n | 'h3'\n | 'h4'\n | 'h5'\n | 'h6';\n\n /**\n * Sets the font weight.\n */\n @Prop() weight?:\n | 'extra-light'\n | 'light'\n | 'regular'\n | 'medium'\n | 'semibold'\n | 'bold';\n\n /**\n * Determines what semantic text tag to render.\n */\n @Prop() tag:\n | 'h1'\n | 'h2'\n | 'h3'\n | 'h4'\n | 'h5'\n | 'h6'\n | 'p'\n | 'span'\n | 'code'\n | 'pre'\n | 'strong'\n | 'em' = 'p';\n\n /**\n * If set or `true`, the text will be truncated. Must add a `width` to the element.\n * When text overflows, a tooltip showing the full text will appear on hover/focus.\n * Note: When truncate is enabled, the element automatically receives tabindex=\"0\" for keyboard accessibility.\n */\n @Prop({ reflect: true }) truncate?: boolean;\n\n @Watch('truncate')\n handleTruncateChange(newValue: boolean) {\n if (newValue) {\n this.initTruncationTooltip();\n } else {\n this.destroyTruncationTooltip();\n }\n }\n\n componentDidLoad() {\n if (this.truncate) {\n this.initTruncationTooltip();\n }\n }\n\n disconnectedCallback() {\n this.destroyTruncationTooltip();\n }\n\n private initTruncationTooltip() {\n // Clean up any existing tooltip before setting up a new one\n this.destroyTruncationTooltip();\n\n if (this.contentEl) {\n this.truncationCleanup = setupTruncationTooltip({\n hostEl: this.el,\n contentEl: this.contentEl,\n getTooltipText: () => this.el.textContent || '',\n });\n }\n }\n\n private destroyTruncationTooltip() {\n if (this.truncationCleanup) {\n this.truncationCleanup();\n this.truncationCleanup = null;\n }\n }\n\n render() {\n const Tag = this.tag;\n\n const typeClasses = `\n pds-text\n ${\n this.align !== undefined && this.align.trim() !== ''\n ? `pds-text--align-${this.align}`\n : ''\n }\n ${\n this.gutter !== undefined && this.gutter.trim() !== ''\n ? `pds-text--gutter-${this.gutter}`\n : ''\n }\n ${\n this.size !== undefined && this.size.trim() !== ''\n ? `pds-text--size-${this.size}`\n : ''\n }\n ${\n this.weight !== undefined && this.weight.trim() !== ''\n ? `pds-text--weight-${this.weight}`\n : ''\n }\n ${\n this.decoration !== undefined && this.decoration.trim() !== ''\n ? `pds-text--decoration-${this.decoration}`\n : ''\n }\n `;\n\n return (\n <Tag\n ref={(el) => (this.contentEl = el)}\n style={this.color && setColor(this.color)}\n class={typeClasses}\n part=\"content\"\n tabIndex={this.truncate ? 0 : undefined}\n >\n <slot />\n </Tag>\n );\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;MAAA,MAAM,UAAU,GAAG,6+GAA6+G;;YCYn/G,OAAO,uBAAA,MAAA;MALpB,IAAA,WAAA,CAAA,OAAA,EAAA;;MAQU,QAAA,IAAiB,CAAA,iBAAA,GAAwB,IAAI;MAuDrD;;MAEG;MACK,QAAA,IAAG,CAAA,GAAA,GAYA,GAAG;MA4Ff;MAlFC,IAAA,oBAAoB,CAAC,QAAiB,EAAA;cACpC,IAAI,QAAQ,EAAE;kBACZ,IAAI,CAAC,qBAAqB,EAAE;;mBACvB;kBACL,IAAI,CAAC,wBAAwB,EAAE;;;UAInC,gBAAgB,GAAA;MACd,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;kBACjB,IAAI,CAAC,qBAAqB,EAAE;;;UAIhC,oBAAoB,GAAA;cAClB,IAAI,CAAC,wBAAwB,EAAE;;UAGzB,qBAAqB,GAAA;;cAE3B,IAAI,CAAC,wBAAwB,EAAE;MAE/B,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;MAClB,YAAA,IAAI,CAAC,iBAAiB,GAAG,sBAAsB,CAAC;sBAC9C,MAAM,EAAE,IAAI,CAAC,EAAE;sBACf,SAAS,EAAE,IAAI,CAAC,SAAS;sBACzB,cAAc,EAAE,MAAM,IAAI,CAAC,EAAE,CAAC,WAAW,IAAI,EAAE;MAChD,aAAA,CAAC;;;UAIE,wBAAwB,GAAA;MAC9B,QAAA,IAAI,IAAI,CAAC,iBAAiB,EAAE;kBAC1B,IAAI,CAAC,iBAAiB,EAAE;MACxB,YAAA,IAAI,CAAC,iBAAiB,GAAG,IAAI;;;UAIjC,MAAM,GAAA;MACJ,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG;MAEpB,QAAA,MAAM,WAAW,GAAG;;AAGhB,MAAA,EAAA,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK;AAChD,cAAE,CAAA,gBAAA,EAAmB,IAAI,CAAC,KAAK,CAAE;AACjC,cAAE,EACN;AAEE,MAAA,EAAA,IAAI,CAAC,MAAM,KAAK,SAAS,IAAI,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK;AAClD,cAAE,CAAA,iBAAA,EAAoB,IAAI,CAAC,MAAM,CAAE;AACnC,cAAE,EACN;AAEE,MAAA,EAAA,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,KAAK;AAC9C,cAAE,CAAA,eAAA,EAAkB,IAAI,CAAC,IAAI,CAAE;AAC/B,cAAE,EACN;AAEE,MAAA,EAAA,IAAI,CAAC,MAAM,KAAK,SAAS,IAAI,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK;AAClD,cAAE,CAAA,iBAAA,EAAoB,IAAI,CAAC,MAAM,CAAE;AACnC,cAAE,EACN;AAEE,MAAA,EAAA,IAAI,CAAC,UAAU,KAAK,SAAS,IAAI,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,KAAK;AAC1D,cAAE,CAAA,qBAAA,EAAwB,IAAI,CAAC,UAAU,CAAE;AAC3C,cAAE,EACN;KACD;MAED,QAAA,QACE,CAAC,CAAA,GAAG,EACF,EAAA,GAAA,EAAA,0CAAA,EAAA,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC,EAClC,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,EACzC,KAAK,EAAE,WAAW,EAClB,IAAI,EAAC,SAAS,EACd,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,CAAC,GAAG,SAAS,EAAA,EAEvC,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACJ;;;;;;;;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"p-BWYstZfx.system.js","sources":["src/components/pds-text/pds-text.scss?tag=pds-text&encapsulation=shadow","src/components/pds-text/pds-text.tsx"],"sourcesContent":[":host {\n display: inline;\n}\n\n:host([decoration=\"underline-dotted\"]) > * {\n text-decoration-color: var(--pine-color-text-tertiary);\n text-decoration-line: underline;\n text-decoration-style: dotted;\n text-decoration-thickness: 12%;\n text-underline-offset: 0.3rem;\n text-underline-position: under;\n}\n\n:host([decoration=\"strikethrough\"])>* {\n text-decoration: line-through;\n}\n\n/* stylelint-disable */\nh1 {\n font: var(--pine-typography-heading-1);\n letter-spacing: var(--pine-letter-spacing-heading-1);\n}\n\nh2 {\n font: var(--pine-typography-heading-2);\n letter-spacing: var(--pine-letter-spacing-heading-2);\n}\n\nh3 {\n font: var(--pine-typography-heading-3);\n letter-spacing: var(--pine-letter-spacing-heading-3);\n}\n\nh4 {\n font: var(--pine-typography-heading-4);\n letter-spacing: var(--pine-letter-spacing-heading-4);\n}\n\nh5 {\n font: var(--pine-typography-heading-5);\n letter-spacing: var(--pine-letter-spacing-heading-5);\n}\n\nh6 {\n font: var(--pine-typography-heading-6);\n letter-spacing: var(--pine-letter-spacing-heading-6);\n}\n\ncode, em, p, pre, strong {\n font: var(--pine-typography-body);\n letter-spacing: var(--pine-letter-spacing);\n}\n/* stylelint-enable */\n\ncode, pre {\n font-family: monospace;\n letter-spacing: 0;\n line-height: 1;\n}\n\nem {\n font-style: normal;\n}\n\nstrong {\n font-weight: bolder;\n}\n\n:host([truncate]) > * {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n:host([italic]) > * {\n font-style: italic;\n}\n\n// Colors/Variants/Sentiment\n\n// Variable is set in TSX\n// If color prop value isn't valid, will default to body text color\n.pds-text {\n color: var(--color, var(--pine-color-text));\n margin: var(--pine-dimension-none);\n}\n\n// Font Sizes\n$type-sizes: (\n 2xl: var(--pine-font-size-body-2xl),\n xl: var(--pine-font-size-body-xl),\n lg: var(--pine-font-size-body-lg),\n md: var(--pine-font-size-body-md),\n sm: var(--pine-font-size-body-sm),\n xs: var(--pine-font-size-body-xs),\n 2xs: var(--pine-font-size-body-2xs),\n h1: var(--pine-font-size-heading-1),\n h2: var(--pine-font-size-heading-2),\n h3: var(--pine-font-size-heading-3),\n h4: var(--pine-font-size-heading-4),\n h5: var(--pine-font-size-heading-5),\n h6: var(--pine-font-size-heading-6),\n);\n\n@mixin generate-type-sizes($type-sizes) {\n @each $key, $value in $type-sizes {\n .pds-text--size-#{$key} {\n font-size: $value;\n }\n }\n}\n\n@include generate-type-sizes($type-sizes);\n\n// Font Weights\n$type-weights: (\n extra-light: var(--pine-font-weight-extra-light),\n light: var(--pine-font-weight-light),\n regular: var(--pine-font-weight-regular),\n medium: var(--pine-font-weight-medium),\n semibold: var(--pine-font-weight-semi-bold),\n bold: var(--pine-font-weight-bold),\n);\n\n@mixin generate-type-weights($type-weights) {\n @each $key, $value in $type-weights {\n .pds-text--weight-#{$key} {\n font-weight: $value;\n }\n }\n}\n\n@include generate-type-weights($type-weights);\n\n// Gutter Sizes\n$type-gutters: (\n 2xl: var(--pine-dimension-2xl),\n xl: var(--pine-dimension-xl),\n lg: var(--pine-dimension-lg),\n md: var(--pine-dimension-md),\n sm: var(--pine-dimension-sm),\n xs: var(--pine-dimension-xs),\n 2xs: var(--pine-dimension-2xs),\n);\n\n@mixin generate-type-gutters($type-gutters) {\n @each $key, $value in $type-gutters {\n .pds-text--gutter-#{$key} {\n margin-block-end: $value;\n }\n }\n}\n\n@include generate-type-gutters($type-gutters);\n\n// Text Alignment\n$type-alignments: (\n start: start,\n center: center,\n end: end,\n justify: justify,\n);\n\n@mixin generate-type-alignments($type-alignments) {\n @each $key, $value in $type-alignments {\n .pds-text--align-#{$key} {\n text-align: $value;\n }\n }\n}\n\n@include generate-type-alignments($type-alignments);\n","import { Component, h, Prop, Element, Watch } from '@stencil/core';\nimport { setColor } from '../../utils/utils';\nimport { setupTruncationTooltip } from '../../utils/truncation-tooltip';\n\n/**\n * @part content - The text content container\n */\n@Component({\n tag: 'pds-text',\n styleUrl: 'pds-text.scss',\n shadow: true,\n})\nexport class PdsText {\n @Element() el: HTMLPdsTextElement;\n private contentEl: HTMLElement;\n private truncationCleanup: (() => void) | null = null;\n /**\n * Sets the text alignment.\n */\n @Prop() align?: 'start' | 'center' | 'end' | 'justify';\n\n /**\n * Sets the text color.\n */\n @Prop() color?: string;\n\n /**\n * Sets the text decoration.\n */\n @Prop() decoration?: 'strikethrough' | 'underline-dotted';\n\n /**\n * Set the bottom margin for the text.\n */\n @Prop() gutter?: '2xl' | 'xl' | 'lg' | 'md' | 'sm' | 'xs' | '2xs';\n\n /**\n * If set or `true`, the text will be italic.\n */\n @Prop() italic?: boolean;\n\n /**\n * Sets the font size.\n */\n @Prop() size?:\n | '2xl'\n | 'xl'\n | 'lg'\n | 'md'\n | 'sm'\n | 'xs'\n | '2xs'\n | 'h1'\n | 'h2'\n | 'h3'\n | 'h4'\n | 'h5'\n | 'h6';\n\n /**\n * Sets the font weight.\n */\n @Prop() weight?:\n | 'extra-light'\n | 'light'\n | 'regular'\n | 'medium'\n | 'semibold'\n | 'bold';\n\n /**\n * Determines what semantic text tag to render.\n */\n @Prop() tag:\n | 'h1'\n | 'h2'\n | 'h3'\n | 'h4'\n | 'h5'\n | 'h6'\n | 'p'\n | 'span'\n | 'code'\n | 'pre'\n | 'strong'\n | 'em' = 'p';\n\n /**\n * If set or `true`, the text will be truncated. Must add a `width` to the element.\n * When text overflows, a tooltip showing the full text will appear on hover/focus.\n * Note: When truncate is enabled, the element automatically receives tabindex=\"0\" for keyboard accessibility.\n */\n @Prop({ reflect: true }) truncate?: boolean;\n\n @Watch('truncate')\n handleTruncateChange(newValue: boolean) {\n if (newValue) {\n this.initTruncationTooltip();\n } else {\n this.destroyTruncationTooltip();\n }\n }\n\n componentDidLoad() {\n if (this.truncate) {\n this.initTruncationTooltip();\n }\n }\n\n disconnectedCallback() {\n this.destroyTruncationTooltip();\n }\n\n private initTruncationTooltip() {\n // Clean up any existing tooltip before setting up a new one\n this.destroyTruncationTooltip();\n\n if (this.contentEl) {\n this.truncationCleanup = setupTruncationTooltip({\n hostEl: this.el,\n contentEl: this.contentEl,\n getTooltipText: () => this.el.textContent || '',\n });\n }\n }\n\n private destroyTruncationTooltip() {\n if (this.truncationCleanup) {\n this.truncationCleanup();\n this.truncationCleanup = null;\n }\n }\n\n render() {\n const Tag = this.tag;\n\n const typeClasses = `\n pds-text\n ${\n this.align !== undefined && this.align.trim() !== ''\n ? `pds-text--align-${this.align}`\n : ''\n }\n ${\n this.gutter !== undefined && this.gutter.trim() !== ''\n ? `pds-text--gutter-${this.gutter}`\n : ''\n }\n ${\n this.size !== undefined && this.size.trim() !== ''\n ? `pds-text--size-${this.size}`\n : ''\n }\n ${\n this.weight !== undefined && this.weight.trim() !== ''\n ? `pds-text--weight-${this.weight}`\n : ''\n }\n ${\n this.decoration !== undefined && this.decoration.trim() !== ''\n ? `pds-text--decoration-${this.decoration}`\n : ''\n }\n `;\n\n return (\n <Tag\n ref={(el) => (this.contentEl = el)}\n style={this.color && setColor(this.color)}\n class={typeClasses}\n part=\"content\"\n tabIndex={this.truncate ? 0 : undefined}\n >\n <slot />\n </Tag>\n );\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;MAAA,MAAM,UAAU,GAAG,6+GAA6+G;;YCYn/G,OAAO,uBAAA,MAAA;MALpB,IAAA,WAAA,CAAA,OAAA,EAAA;;MAQU,QAAA,IAAiB,CAAA,iBAAA,GAAwB,IAAI;MAuDrD;;MAEG;MACK,QAAA,IAAG,CAAA,GAAA,GAYA,GAAG;MA4Ff;MAlFC,IAAA,oBAAoB,CAAC,QAAiB,EAAA;cACpC,IAAI,QAAQ,EAAE;kBACZ,IAAI,CAAC,qBAAqB,EAAE;;mBACvB;kBACL,IAAI,CAAC,wBAAwB,EAAE;;;UAInC,gBAAgB,GAAA;MACd,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;kBACjB,IAAI,CAAC,qBAAqB,EAAE;;;UAIhC,oBAAoB,GAAA;cAClB,IAAI,CAAC,wBAAwB,EAAE;;UAGzB,qBAAqB,GAAA;;cAE3B,IAAI,CAAC,wBAAwB,EAAE;MAE/B,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;MAClB,YAAA,IAAI,CAAC,iBAAiB,GAAG,sBAAsB,CAAC;sBAC9C,MAAM,EAAE,IAAI,CAAC,EAAE;sBACf,SAAS,EAAE,IAAI,CAAC,SAAS;sBACzB,cAAc,EAAE,MAAM,IAAI,CAAC,EAAE,CAAC,WAAW,IAAI,EAAE;MAChD,aAAA,CAAC;;;UAIE,wBAAwB,GAAA;MAC9B,QAAA,IAAI,IAAI,CAAC,iBAAiB,EAAE;kBAC1B,IAAI,CAAC,iBAAiB,EAAE;MACxB,YAAA,IAAI,CAAC,iBAAiB,GAAG,IAAI;;;UAIjC,MAAM,GAAA;MACJ,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG;MAEpB,QAAA,MAAM,WAAW,GAAG;;AAGhB,MAAA,EAAA,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK;AAChD,cAAE,CAAA,gBAAA,EAAmB,IAAI,CAAC,KAAK,CAAE;AACjC,cAAE,EACN;AAEE,MAAA,EAAA,IAAI,CAAC,MAAM,KAAK,SAAS,IAAI,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK;AAClD,cAAE,CAAA,iBAAA,EAAoB,IAAI,CAAC,MAAM,CAAE;AACnC,cAAE,EACN;AAEE,MAAA,EAAA,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,KAAK;AAC9C,cAAE,CAAA,eAAA,EAAkB,IAAI,CAAC,IAAI,CAAE;AAC/B,cAAE,EACN;AAEE,MAAA,EAAA,IAAI,CAAC,MAAM,KAAK,SAAS,IAAI,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK;AAClD,cAAE,CAAA,iBAAA,EAAoB,IAAI,CAAC,MAAM,CAAE;AACnC,cAAE,EACN;AAEE,MAAA,EAAA,IAAI,CAAC,UAAU,KAAK,SAAS,IAAI,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,KAAK;AAC1D,cAAE,CAAA,qBAAA,EAAwB,IAAI,CAAC,UAAU,CAAE;AAC3C,cAAE,EACN;KACD;MAED,QAAA,QACE,CAAC,CAAA,GAAG,EACF,EAAA,GAAA,EAAA,0CAAA,EAAA,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC,EAClC,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,EACzC,KAAK,EAAE,WAAW,EAClB,IAAI,EAAC,SAAS,EACd,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,CAAC,GAAG,SAAS,EAAA,EAEvC,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACJ;;;;;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"p-DWrLi0lj.system.js","sources":["src/components/pds-modal/pds-modal-content/pds-modal-content.scss?tag=pds-modal-content","src/components/pds-modal/pds-modal-content/pds-modal-content.tsx"],"sourcesContent":["pds-modal-content {\n display: block;\n flex: 1 1 auto;\n width: 100%;\n\n &:has(.pds-modal-content.pds-modal-content--border-none) {\n border: 0;\n }\n\n &:has(.pds-modal-content.pds-modal-content--border-both) {\n border-block-end: 1px solid var(--pine-color-border-subtle);\n border-block-start: 1px solid var(--pine-color-border-subtle);\n }\n\n &:has(.pds-modal-content.pds-modal-content--border-top) {\n border-block-start: 1px solid var(--pine-color-border-subtle);\n }\n\n &:has(.pds-modal-content.pds-modal-content--border-bottom) {\n border-block-end: 1px solid var(--pine-color-border-subtle);\n }\n}\n\n.pds-modal-content {\n display: block;\n flex: 1 1 auto;\n // Max height is set via inline styles based on header and footer heights\n min-height: 0;\n width: 100%;\n\n}\n","import { Component, h, Host, Prop, Element, State } from '@stencil/core';\n\n@Component({\n tag: 'pds-modal-content',\n styleUrl: 'pds-modal-content.scss',\n})\nexport class PdsModalContent {\n\n @Element() el: HTMLPdsModalContentElement;\n\n /**\n * The border style for the content area. When not explicitly set, automatically determined based on scroll state.\n * @default 'none'\n */\n @Prop({ reflect: true, mutable: true }) border: 'none' | 'both' | 'top' | 'bottom' = 'none';\n\n @State() contentMaxHeight: string = 'none';\n\n /**\n * Tracks whether the border prop was explicitly set by the user\n */\n private userSetBorder = false;\n\n componentWillLoad() {\n // Check if border was explicitly set via attribute or property\n const borderAttr = this.el.getAttribute('border');\n const hasBorderAttribute = borderAttr !== null;\n\n // If border attribute exists or border prop is not the default, user set it\n this.userSetBorder = hasBorderAttribute || this.border !== 'none';\n }\n\n componentDidLoad() {\n this.calculateMaxHeight();\n\n // Set up resize listener\n window.addEventListener('resize', this.handleResize.bind(this));\n\n // Only set up scroll listener for border updates if borders are managed automatically\n if (!this.userSetBorder) {\n setTimeout(() => {\n // The scroll happens on the component element itself (this.el), not the inner div\n this.el.addEventListener('scroll', this.handleScroll.bind(this));\n // Initial border update after everything is set up\n setTimeout(() => this.updateBorders(), 100);\n }, 100);\n }\n }\n\n disconnectedCallback() {\n window.removeEventListener('resize', this.handleResize.bind(this));\n\n // Clean up scroll listener only if it was set up\n if (!this.userSetBorder) {\n this.el.removeEventListener('scroll', this.handleScroll.bind(this));\n }\n\n if (this.mutationObserver) {\n this.mutationObserver.disconnect();\n }\n }\n\n /**\n * Handle scroll events\n */\n private handleScroll() {\n this.updateBorders();\n }\n\n /**\n * Handle resize events\n */\n private handleResize() {\n this.calculateMaxHeight();\n // Update borders after resize as content scrollability might change\n setTimeout(() => this.updateBorders(), 50);\n }\n\n /**\n * Calculates the max-height based on header and footer heights\n */\n private mutationObserver: MutationObserver;\n\n /**\n * Updates border visibility based on scroll state (only if not user-defined)\n */\n private updateBorders() {\n // If user explicitly set a border value, don't override it\n if (this.userSetBorder) {\n return;\n }\n\n // Find the modal element (parent of this component)\n const modalElement = this.el.closest('pds-modal');\n if (!modalElement) return;\n\n // Only apply border logic if modal is scrollable\n const isModalScrollable = modalElement.scrollable !== false;\n if (!isModalScrollable) {\n this.border = 'none';\n return;\n }\n\n // The scrollable element is the component itself (this.el), not the inner div\n const scrollableElement = this.el;\n\n // Check if content is actually scrollable\n const isContentScrollable = scrollableElement.scrollHeight > scrollableElement.clientHeight;\n\n if (!isContentScrollable) {\n this.border = 'none';\n return;\n }\n\n // Determine border position based on scroll position\n const { scrollTop, scrollHeight, clientHeight } = scrollableElement;\n const scrollBottom = scrollTop + clientHeight;\n\n // More generous tolerance for scroll detection (3px instead of 1px)\n const tolerance = 3;\n const isAtTop = scrollTop <= tolerance;\n const isAtBottom = scrollBottom >= scrollHeight - tolerance;\n\n if (isAtTop && isAtBottom) {\n // Content fits exactly, no borders needed\n this.border = 'none';\n } else if (isAtTop && !isAtBottom) {\n // At top, show bottom border only\n this.border = 'bottom';\n } else if (!isAtTop && isAtBottom) {\n // At bottom, show top border only\n this.border = 'top';\n } else {\n // In middle, show both borders\n this.border = 'both';\n }\n }\n\n /**\n * Calculates the max-height based on header and footer heights\n */\n private calculateMaxHeight() {\n // Find the modal element (parent of this component)\n const modalElement = this.el.closest('pds-modal');\n if (!modalElement) return;\n\n // Check if the parent modal is scrollable\n const isScrollable = modalElement.scrollable !== false;\n\n setTimeout(() => {\n // If modal is not scrollable, don't apply max-height constraints\n if (!isScrollable) {\n this.contentMaxHeight = 'none';\n const contentElement = this.el.querySelector('.pds-modal-content') as HTMLElement;\n if (contentElement) {\n contentElement.style.maxHeight = 'none';\n }\n return;\n }\n\n // Find header and footer elements\n const headerElement = modalElement.querySelector('pds-modal-header');\n const footerElement = modalElement.querySelector('pds-modal-footer');\n\n // Get header and footer heights\n const headerHeight = headerElement ? headerElement.offsetHeight : 0;\n const footerHeight = footerElement ? footerElement.offsetHeight : 0;\n\n // Set the max-height as a calculation\n if (headerHeight > 0 || footerHeight > 0) {\n // Calculate the available height by subtracting:\n // 1. Header and footer heights\n // 2. Modal padding (48px)\n // 3. Additional space for modal positioning (6vh)\n // 4. Extra adjustment for perfect fit (50px)\n const viewportAdjustment = Math.round(window.innerHeight * 0.06); // 6vh approximation\n const totalReduction = headerHeight + footerHeight + 48 + viewportAdjustment + 50;\n\n // Set the content max height\n this.contentMaxHeight = `calc(100vh - ${totalReduction}px)`;\n\n // Apply the style directly to ensure it takes effect\n const contentElement = this.el.querySelector('.pds-modal-content') as HTMLElement;\n if (contentElement) {\n contentElement.style.maxHeight = this.contentMaxHeight;\n }\n } else {\n this.contentMaxHeight = 'none'; // Default fallback\n }\n\n // Update borders after height calculations with longer delay\n setTimeout(() => this.updateBorders(), 150);\n }, 100); // Delay to ensure DOM is fully rendered\n\n // Set up mutation observer if not already done\n if (!this.mutationObserver && modalElement) {\n this.mutationObserver = new MutationObserver(() => {\n this.calculateMaxHeight();\n });\n\n // Observe changes to the modal's children\n this.mutationObserver.observe(modalElement, {\n childList: true,\n subtree: true,\n attributes: true,\n attributeFilter: ['style', 'class']\n });\n }\n }\n render() {\n // Only apply max-height style if it's not 'none'\n const styleObj = this.contentMaxHeight !== 'none' ? { maxHeight: this.contentMaxHeight } : {};\n\n return (\n <Host>\n <div\n class={{\n 'pds-modal-content': true,\n [`pds-modal-content--border-${this.border}`]: true\n }}\n style={styleObj}\n tabindex=\"-1\"\n >\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"p-B_ue56xA.system.js","sources":["src/components/pds-modal/pds-modal-content/pds-modal-content.scss?tag=pds-modal-content","src/components/pds-modal/pds-modal-content/pds-modal-content.tsx"],"sourcesContent":["pds-modal-content {\n display: block;\n flex: 1 1 auto;\n width: 100%;\n\n &:has(.pds-modal-content.pds-modal-content--border-none) {\n border: 0;\n }\n\n &:has(.pds-modal-content.pds-modal-content--border-both) {\n border-block-end: 1px solid var(--pine-color-border-subtle);\n border-block-start: 1px solid var(--pine-color-border-subtle);\n }\n\n &:has(.pds-modal-content.pds-modal-content--border-top) {\n border-block-start: 1px solid var(--pine-color-border-subtle);\n }\n\n &:has(.pds-modal-content.pds-modal-content--border-bottom) {\n border-block-end: 1px solid var(--pine-color-border-subtle);\n }\n}\n\n.pds-modal-content {\n display: block;\n flex: 1 1 auto;\n // Max height is set via inline styles based on header and footer heights\n min-height: 0;\n width: 100%;\n\n}\n","import { Component, h, Host, Prop, Element, State } from '@stencil/core';\n\n@Component({\n tag: 'pds-modal-content',\n styleUrl: 'pds-modal-content.scss',\n})\nexport class PdsModalContent {\n\n @Element() el: HTMLPdsModalContentElement;\n\n /**\n * The border style for the content area. When not explicitly set, automatically determined based on scroll state.\n * @default 'none'\n */\n @Prop({ reflect: true, mutable: true }) border: 'none' | 'both' | 'top' | 'bottom' = 'none';\n\n @State() contentMaxHeight: string = 'none';\n\n /**\n * Tracks whether the border prop was explicitly set by the user\n */\n private userSetBorder = false;\n\n componentWillLoad() {\n // Check if border was explicitly set via attribute or property\n const borderAttr = this.el.getAttribute('border');\n const hasBorderAttribute = borderAttr !== null;\n\n // If border attribute exists or border prop is not the default, user set it\n this.userSetBorder = hasBorderAttribute || this.border !== 'none';\n }\n\n componentDidLoad() {\n this.calculateMaxHeight();\n\n // Set up resize listener\n window.addEventListener('resize', this.handleResize.bind(this));\n\n // Only set up scroll listener for border updates if borders are managed automatically\n if (!this.userSetBorder) {\n setTimeout(() => {\n // The scroll happens on the component element itself (this.el), not the inner div\n this.el.addEventListener('scroll', this.handleScroll.bind(this));\n // Initial border update after everything is set up\n setTimeout(() => this.updateBorders(), 100);\n }, 100);\n }\n }\n\n disconnectedCallback() {\n window.removeEventListener('resize', this.handleResize.bind(this));\n\n // Clean up scroll listener only if it was set up\n if (!this.userSetBorder) {\n this.el.removeEventListener('scroll', this.handleScroll.bind(this));\n }\n\n if (this.mutationObserver) {\n this.mutationObserver.disconnect();\n }\n }\n\n /**\n * Handle scroll events\n */\n private handleScroll() {\n this.updateBorders();\n }\n\n /**\n * Handle resize events\n */\n private handleResize() {\n this.calculateMaxHeight();\n // Update borders after resize as content scrollability might change\n setTimeout(() => this.updateBorders(), 50);\n }\n\n /**\n * Calculates the max-height based on header and footer heights\n */\n private mutationObserver: MutationObserver;\n\n /**\n * Updates border visibility based on scroll state (only if not user-defined)\n */\n private updateBorders() {\n // If user explicitly set a border value, don't override it\n if (this.userSetBorder) {\n return;\n }\n\n // Find the modal element (parent of this component)\n const modalElement = this.el.closest('pds-modal');\n if (!modalElement) return;\n\n // Only apply border logic if modal is scrollable\n const isModalScrollable = modalElement.scrollable !== false;\n if (!isModalScrollable) {\n this.border = 'none';\n return;\n }\n\n // The scrollable element is the component itself (this.el), not the inner div\n const scrollableElement = this.el;\n\n // Check if content is actually scrollable\n const isContentScrollable = scrollableElement.scrollHeight > scrollableElement.clientHeight;\n\n if (!isContentScrollable) {\n this.border = 'none';\n return;\n }\n\n // Determine border position based on scroll position\n const { scrollTop, scrollHeight, clientHeight } = scrollableElement;\n const scrollBottom = scrollTop + clientHeight;\n\n // More generous tolerance for scroll detection (3px instead of 1px)\n const tolerance = 3;\n const isAtTop = scrollTop <= tolerance;\n const isAtBottom = scrollBottom >= scrollHeight - tolerance;\n\n if (isAtTop && isAtBottom) {\n // Content fits exactly, no borders needed\n this.border = 'none';\n } else if (isAtTop && !isAtBottom) {\n // At top, show bottom border only\n this.border = 'bottom';\n } else if (!isAtTop && isAtBottom) {\n // At bottom, show top border only\n this.border = 'top';\n } else {\n // In middle, show both borders\n this.border = 'both';\n }\n }\n\n /**\n * Calculates the max-height based on header and footer heights\n */\n private calculateMaxHeight() {\n // Find the modal element (parent of this component)\n const modalElement = this.el.closest('pds-modal');\n if (!modalElement) return;\n\n // Check if the parent modal is scrollable\n const isScrollable = modalElement.scrollable !== false;\n\n setTimeout(() => {\n // If modal is not scrollable, don't apply max-height constraints\n if (!isScrollable) {\n this.contentMaxHeight = 'none';\n const contentElement = this.el.querySelector('.pds-modal-content') as HTMLElement;\n if (contentElement) {\n contentElement.style.maxHeight = 'none';\n }\n return;\n }\n\n // Find header and footer elements\n const headerElement = modalElement.querySelector('pds-modal-header');\n const footerElement = modalElement.querySelector('pds-modal-footer');\n\n // Get header and footer heights\n const headerHeight = headerElement ? headerElement.offsetHeight : 0;\n const footerHeight = footerElement ? footerElement.offsetHeight : 0;\n\n // Set the max-height as a calculation\n if (headerHeight > 0 || footerHeight > 0) {\n // Calculate the available height by subtracting:\n // 1. Header and footer heights\n // 2. Modal padding (48px)\n // 3. Additional space for modal positioning (6vh)\n // 4. Extra adjustment for perfect fit (50px)\n const viewportAdjustment = Math.round(window.innerHeight * 0.06); // 6vh approximation\n const totalReduction = headerHeight + footerHeight + 48 + viewportAdjustment + 50;\n\n // Set the content max height\n this.contentMaxHeight = `calc(100vh - ${totalReduction}px)`;\n\n // Apply the style directly to ensure it takes effect\n const contentElement = this.el.querySelector('.pds-modal-content') as HTMLElement;\n if (contentElement) {\n contentElement.style.maxHeight = this.contentMaxHeight;\n }\n } else {\n this.contentMaxHeight = 'none'; // Default fallback\n }\n\n // Update borders after height calculations with longer delay\n setTimeout(() => this.updateBorders(), 150);\n }, 100); // Delay to ensure DOM is fully rendered\n\n // Set up mutation observer if not already done\n if (!this.mutationObserver && modalElement) {\n this.mutationObserver = new MutationObserver(() => {\n this.calculateMaxHeight();\n });\n\n // Observe changes to the modal's children\n this.mutationObserver.observe(modalElement, {\n childList: true,\n subtree: true,\n attributes: true,\n attributeFilter: ['style', 'class']\n });\n }\n }\n render() {\n // Only apply max-height style if it's not 'none'\n const styleObj = this.contentMaxHeight !== 'none' ? { maxHeight: this.contentMaxHeight } : {};\n\n return (\n <Host>\n <div\n class={{\n 'pds-modal-content': true,\n [`pds-modal-content--border-${this.border}`]: true\n }}\n style={styleObj}\n tabindex=\"-1\"\n >\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|