@pine-ds/core 3.27.0 → 3.29.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/i18n-format.js +1 -0
- package/components/pds-alert.js +1 -1
- package/components/pds-avatar.js +1 -1
- package/components/pds-chip2.js +1 -1
- package/components/pds-link2.js +1 -1
- package/components/pds-multiselect.js +1 -1
- package/components/pds-tab.js +1 -1
- package/components/pds-tabpanel.js +1 -1
- package/components/pds-tabs.js +1 -1
- package/components/pds-text2.js +1 -1
- package/components/pds-textarea.js +1 -1
- package/components/pds-toast.js +1 -1
- package/components/pds-tooltip.js +1 -1
- package/dist/cjs/i18n-format-CrpIhahc.js +64 -0
- package/dist/cjs/{index-DBhfI2Jq.js → index-BdFrBXCD.js} +5 -1
- package/dist/cjs/{index-DGBoDsAL.js → index-CKNNY-lQ.js} +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/mock-pds-modal.cjs.entry.js +1 -1
- package/dist/cjs/pds-accordion.cjs.entry.js +2 -2
- package/dist/cjs/pds-alert.cjs.entry.js +8 -2
- package/dist/cjs/pds-avatar.cjs.entry.js +45 -8
- package/dist/cjs/pds-box.cjs.entry.js +1 -1
- package/dist/cjs/pds-button.cjs.entry.js +2 -2
- package/dist/cjs/pds-checkbox.cjs.entry.js +2 -2
- package/dist/cjs/pds-chip.cjs.entry.js +10 -5
- package/dist/cjs/pds-combobox.cjs.entry.js +1 -1
- package/dist/cjs/pds-container.cjs.entry.js +1 -1
- package/dist/cjs/pds-copytext.cjs.entry.js +2 -2
- 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 +2 -2
- 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 +2 -2
- package/dist/cjs/pds-link.cjs.entry.js +12 -5
- 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 +1 -1
- package/dist/cjs/pds-multiselect.cjs.entry.js +93 -14
- 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 +2 -2
- package/dist/cjs/pds-radio.cjs.entry.js +2 -2
- package/dist/cjs/pds-row.cjs.entry.js +1 -1
- package/dist/cjs/pds-select.cjs.entry.js +2 -2
- package/dist/cjs/pds-sortable-item.cjs.entry.js +2 -2
- package/dist/cjs/pds-sortable.cjs.entry.js +1 -1
- package/dist/cjs/pds-switch.cjs.entry.js +2 -2
- package/dist/cjs/pds-tab.cjs.entry.js +41 -6
- package/dist/cjs/pds-table-body.cjs.entry.js +1 -1
- package/dist/cjs/pds-table-cell.cjs.entry.js +1 -1
- package/dist/cjs/pds-table-head-cell.cjs.entry.js +2 -2
- 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 +1 -1
- package/dist/cjs/pds-tabpanel.cjs.entry.js +8 -3
- package/dist/cjs/pds-tabs.cjs.entry.js +74 -3
- package/dist/cjs/pds-text.cjs.entry.js +2 -2
- package/dist/cjs/pds-textarea.cjs.entry.js +14 -7
- package/dist/cjs/pds-toast.cjs.entry.js +10 -4
- package/dist/cjs/pds-tooltip.cjs.entry.js +3 -3
- package/dist/cjs/pine-core.cjs.js +2 -2
- package/dist/collection/components/pds-alert/pds-alert.js +30 -1
- package/dist/collection/components/pds-avatar/pds-avatar.css +29 -0
- package/dist/collection/components/pds-avatar/pds-avatar.js +133 -5
- package/dist/collection/components/pds-avatar/stories/pds-avatar.stories.js +23 -0
- package/dist/collection/components/pds-button/pds-button.js +1 -1
- package/dist/collection/components/pds-button/stories/pds-button.stories.js +25 -0
- package/dist/collection/components/pds-chip/pds-chip.js +31 -3
- package/dist/collection/components/pds-link/pds-link.css +10 -0
- package/dist/collection/components/pds-link/pds-link.js +32 -2
- package/dist/collection/components/pds-link/stories/pds-link.stories.js +14 -0
- package/dist/collection/components/pds-multiselect/pds-multiselect.js +358 -17
- package/dist/collection/components/pds-tabs/pds-tab/pds-tab.css +4 -4
- package/dist/collection/components/pds-tabs/pds-tab/pds-tab.js +161 -5
- package/dist/collection/components/pds-tabs/pds-tabpanel/pds-tabpanel.css +9 -0
- package/dist/collection/components/pds-tabs/pds-tabpanel/pds-tabpanel.js +29 -1
- package/dist/collection/components/pds-tabs/pds-tabs.css +14 -0
- package/dist/collection/components/pds-tabs/pds-tabs.js +146 -4
- package/dist/collection/components/pds-tabs/stories/pds-tabs.stories.js +43 -0
- package/dist/collection/components/pds-text/pds-text.js +1 -1
- package/dist/collection/components/pds-textarea/pds-textarea.js +35 -5
- package/dist/collection/components/pds-toast/pds-toast.js +32 -3
- package/dist/collection/components/pds-tooltip/pds-tooltip.js +2 -2
- package/dist/collection/i18n/i18n-format.js +59 -0
- package/dist/collection/i18n/index.js +1 -0
- package/dist/docs.json +866 -13
- package/dist/esm/i18n-format-BKsJZTyn.js +61 -0
- package/dist/esm/{index-D4ys0pep.js → index-BjlFq0VD.js} +1 -1
- package/dist/esm/{index-CaRgVPt7.js → index-NNDTPCWx.js} +5 -2
- package/dist/esm/loader.js +3 -3
- package/dist/esm/mock-pds-modal.entry.js +1 -1
- package/dist/esm/pds-accordion.entry.js +2 -2
- package/dist/esm/pds-alert.entry.js +8 -2
- package/dist/esm/pds-avatar.entry.js +45 -8
- package/dist/esm/pds-box.entry.js +1 -1
- package/dist/esm/pds-button.entry.js +2 -2
- package/dist/esm/pds-checkbox.entry.js +2 -2
- package/dist/esm/pds-chip.entry.js +10 -5
- package/dist/esm/pds-combobox.entry.js +1 -1
- package/dist/esm/pds-container.entry.js +1 -1
- package/dist/esm/pds-copytext.entry.js +2 -2
- 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 +2 -2
- 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 +2 -2
- package/dist/esm/pds-link.entry.js +12 -5
- 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 +1 -1
- package/dist/esm/pds-multiselect.entry.js +93 -14
- 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 +2 -2
- package/dist/esm/pds-radio.entry.js +2 -2
- package/dist/esm/pds-row.entry.js +1 -1
- package/dist/esm/pds-select.entry.js +2 -2
- package/dist/esm/pds-sortable-item.entry.js +2 -2
- package/dist/esm/pds-sortable.entry.js +1 -1
- package/dist/esm/pds-switch.entry.js +2 -2
- package/dist/esm/pds-tab.entry.js +41 -6
- package/dist/esm/pds-table-body.entry.js +1 -1
- package/dist/esm/pds-table-cell.entry.js +1 -1
- package/dist/esm/pds-table-head-cell.entry.js +2 -2
- 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 +1 -1
- package/dist/esm/pds-tabpanel.entry.js +8 -3
- package/dist/esm/pds-tabs.entry.js +74 -3
- package/dist/esm/pds-text.entry.js +2 -2
- package/dist/esm/pds-textarea.entry.js +14 -7
- package/dist/esm/pds-toast.entry.js +10 -4
- package/dist/esm/pds-tooltip.entry.js +3 -3
- package/dist/esm/pine-core.js +3 -3
- package/dist/esm-es5/i18n-format-BKsJZTyn.js +1 -0
- package/dist/esm-es5/{index-CaRgVPt7.js → index-NNDTPCWx.js} +2 -2
- package/dist/esm-es5/loader.js +1 -1
- package/dist/esm-es5/mock-pds-modal.entry.js +1 -1
- package/dist/esm-es5/pds-accordion.entry.js +1 -1
- package/dist/esm-es5/pds-alert.entry.js +1 -1
- package/dist/esm-es5/pds-avatar.entry.js +1 -1
- package/dist/esm-es5/pds-box.entry.js +1 -1
- package/dist/esm-es5/pds-button.entry.js +1 -1
- package/dist/esm-es5/pds-checkbox.entry.js +1 -1
- package/dist/esm-es5/pds-chip.entry.js +1 -1
- package/dist/esm-es5/pds-combobox.entry.js +2 -2
- package/dist/esm-es5/pds-container.entry.js +1 -1
- package/dist/esm-es5/pds-copytext.entry.js +1 -1
- package/dist/esm-es5/pds-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-filters.entry.js +1 -1
- package/dist/esm-es5/pds-icon.entry.js +1 -1
- package/dist/esm-es5/pds-image.entry.js +1 -1
- package/dist/esm-es5/pds-input.entry.js +1 -1
- package/dist/esm-es5/pds-link.entry.js +1 -1
- package/dist/esm-es5/pds-loader.entry.js +1 -1
- package/dist/esm-es5/pds-modal-content.entry.js +1 -1
- package/dist/esm-es5/pds-modal-footer.entry.js +1 -1
- package/dist/esm-es5/pds-modal-header.entry.js +1 -1
- package/dist/esm-es5/pds-modal.entry.js +1 -1
- package/dist/esm-es5/pds-multiselect.entry.js +1 -1
- package/dist/esm-es5/pds-popover.entry.js +1 -1
- package/dist/esm-es5/pds-progress.entry.js +1 -1
- package/dist/esm-es5/pds-property.entry.js +1 -1
- package/dist/esm-es5/pds-radio-group.entry.js +1 -1
- package/dist/esm-es5/pds-radio.entry.js +1 -1
- package/dist/esm-es5/pds-row.entry.js +1 -1
- package/dist/esm-es5/pds-select.entry.js +1 -1
- package/dist/esm-es5/pds-sortable-item.entry.js +1 -1
- package/dist/esm-es5/pds-sortable.entry.js +1 -1
- package/dist/esm-es5/pds-switch.entry.js +1 -1
- package/dist/esm-es5/pds-tab.entry.js +1 -1
- package/dist/esm-es5/pds-table-body.entry.js +1 -1
- package/dist/esm-es5/pds-table-cell.entry.js +1 -1
- package/dist/esm-es5/pds-table-head-cell.entry.js +1 -1
- package/dist/esm-es5/pds-table-head.entry.js +1 -1
- package/dist/esm-es5/pds-table-row.entry.js +1 -1
- package/dist/esm-es5/pds-table.entry.js +1 -1
- package/dist/esm-es5/pds-tabpanel.entry.js +1 -1
- package/dist/esm-es5/pds-tabs.entry.js +1 -1
- package/dist/esm-es5/pds-text.entry.js +1 -1
- package/dist/esm-es5/pds-textarea.entry.js +1 -1
- package/dist/esm-es5/pds-toast.entry.js +1 -1
- package/dist/esm-es5/pds-tooltip.entry.js +1 -1
- package/dist/esm-es5/pine-core.js +1 -1
- package/dist/pine-core/p-02805a93.system.entry.js +1 -0
- package/dist/pine-core/{p-e70c9002.entry.js → p-02977c6f.entry.js} +1 -1
- package/dist/pine-core/{p-4e49712d.entry.js → p-054f7011.entry.js} +1 -1
- package/dist/pine-core/{p-571d6bef.system.entry.js → p-076aaa00.system.entry.js} +1 -1
- package/dist/pine-core/{p-3fa80c5a.system.entry.js → p-092a72d2.system.entry.js} +1 -1
- package/dist/pine-core/p-0a09ccbe.entry.js +1 -0
- package/dist/pine-core/p-0a4f2d5f.system.entry.js +1 -0
- package/dist/pine-core/{p-f2cf8e76.entry.js → p-0d6daa35.entry.js} +1 -1
- package/dist/pine-core/p-12154189.system.entry.js +1 -0
- package/dist/pine-core/{p-44f58d33.system.entry.js → p-1deded6e.system.entry.js} +1 -1
- package/dist/pine-core/{p-fa81009f.system.entry.js → p-1f20608e.system.entry.js} +1 -1
- package/dist/pine-core/{p-27ac77c3.entry.js → p-1fb985bb.entry.js} +1 -1
- package/dist/pine-core/{p-855dfc31.system.entry.js → p-20e0d06c.system.entry.js} +1 -1
- package/dist/pine-core/p-24fcf841.system.entry.js +1 -0
- package/dist/pine-core/{p-c273210a.entry.js → p-292cf8f9.entry.js} +1 -1
- package/dist/pine-core/{p-db1572a3.entry.js → p-2a74b396.entry.js} +1 -1
- package/dist/pine-core/p-2d1cc047.entry.js +1 -0
- package/dist/pine-core/{p-002c420f.system.entry.js → p-2ec460e1.system.entry.js} +1 -1
- package/dist/pine-core/{p-e0cfb931.system.entry.js → p-2fc127b4.system.entry.js} +1 -1
- package/dist/pine-core/{p-d09ae46d.system.entry.js → p-3170d53b.system.entry.js} +1 -1
- package/dist/pine-core/{p-0451fdf7.entry.js → p-39ad92fc.entry.js} +1 -1
- package/dist/pine-core/{p-974bf0c5.entry.js → p-39c6e6c9.entry.js} +1 -1
- package/dist/pine-core/{p-d5c1f85e.system.entry.js → p-3c6300a8.system.entry.js} +1 -1
- package/dist/pine-core/{p-b0b6acdb.system.entry.js → p-3e3b3bf6.system.entry.js} +1 -1
- package/dist/pine-core/{p-52f7115b.entry.js → p-43a1d9d7.entry.js} +1 -1
- package/dist/pine-core/{p-13ec2343.entry.js → p-43ef94bc.entry.js} +1 -1
- package/dist/pine-core/{p-618ba6d5.system.entry.js → p-464ec4eb.system.entry.js} +1 -1
- package/dist/pine-core/{p-ee6f914c.entry.js → p-47708864.entry.js} +1 -1
- package/dist/pine-core/{p-ccb889d8.system.entry.js → p-507e831f.system.entry.js} +1 -1
- package/dist/pine-core/p-5c229a7f.entry.js +1 -0
- package/dist/pine-core/{p-5c6c2f79.system.entry.js → p-5c7a72aa.system.entry.js} +1 -1
- package/dist/pine-core/{p-71ca8845.system.entry.js → p-5e6e8d4e.system.entry.js} +1 -1
- package/dist/pine-core/{p-3ad9bcef.system.entry.js → p-5f4d2c5c.system.entry.js} +1 -1
- package/dist/pine-core/{p-6a2373d0.system.entry.js → p-606418b7.system.entry.js} +1 -1
- package/dist/pine-core/{p-22bfa998.entry.js → p-6254d112.entry.js} +1 -1
- package/dist/pine-core/{p-5a2df1e2.entry.js → p-62f75f84.entry.js} +1 -1
- package/dist/pine-core/{p-835d9f18.system.entry.js → p-69e47ffc.system.entry.js} +1 -1
- package/dist/pine-core/p-6f82e8dc.system.entry.js +1 -0
- package/dist/pine-core/{p-b1b317a5.entry.js → p-6fb68ad1.entry.js} +1 -1
- package/dist/pine-core/{p-1e3beca4.system.entry.js → p-7153efaf.system.entry.js} +1 -1
- package/dist/pine-core/{p-a982ac91.system.entry.js → p-72a1b563.system.entry.js} +1 -1
- package/dist/pine-core/{p-7aca41d9.system.entry.js → p-7803c5b6.system.entry.js} +1 -1
- package/dist/pine-core/{p-74e06c8d.system.entry.js → p-78cd9f97.system.entry.js} +1 -1
- package/dist/pine-core/{p-edf4e4eb.system.entry.js → p-79598750.system.entry.js} +1 -1
- package/dist/pine-core/p-7a7954b2.system.entry.js +1 -0
- package/dist/pine-core/{p-3ba36512.system.entry.js → p-7b85115b.system.entry.js} +1 -1
- package/dist/pine-core/{p-83eb33d4.entry.js → p-7bac161d.entry.js} +1 -1
- package/dist/pine-core/{p-bdf18687.entry.js → p-7d15b65e.entry.js} +1 -1
- package/dist/pine-core/p-7e065b59.entry.js +1 -0
- package/dist/pine-core/p-82af7d58.system.entry.js +1 -0
- package/dist/pine-core/{p-73b81009.entry.js → p-83e8f145.entry.js} +1 -1
- package/dist/pine-core/{p-cce6dcf0.system.entry.js → p-85f7428b.system.entry.js} +1 -1
- package/dist/pine-core/{p-ae840ec4.entry.js → p-87ba6d2b.entry.js} +1 -1
- package/dist/pine-core/p-8c0040c4.entry.js +1 -0
- package/dist/pine-core/{p-a659cce1.entry.js → p-8c85f53a.entry.js} +1 -1
- package/dist/pine-core/{p-20f39b93.system.entry.js → p-8d6fd5a7.system.entry.js} +1 -1
- package/dist/pine-core/{p-7247fb4f.entry.js → p-902b5790.entry.js} +1 -1
- package/dist/pine-core/{p-3f19666c.entry.js → p-92f648ba.entry.js} +1 -1
- package/dist/pine-core/{p-e620e492.system.entry.js → p-9374cf48.system.entry.js} +1 -1
- package/dist/pine-core/p-978b848b.system.entry.js +1 -0
- package/dist/pine-core/{p-babd0607.system.entry.js → p-9aaee1e9.system.entry.js} +1 -1
- package/dist/pine-core/p-9ba86e34.entry.js +1 -0
- package/dist/pine-core/{p-4abec102.system.entry.js → p-9f041a63.system.entry.js} +2 -2
- package/dist/pine-core/p-B1rytYxP.system.js +1 -0
- package/dist/pine-core/p-BKsJZTyn.js +1 -0
- package/dist/pine-core/p-Cr7-rJtJ.system.js +1 -0
- package/dist/pine-core/{p-CdwliqhD.system.js → p-DVZjHa4_.system.js} +2 -2
- package/dist/pine-core/p-NNDTPCWx.js +2 -0
- package/dist/pine-core/{p-ba88ff60.system.entry.js → p-a03c12a4.system.entry.js} +1 -1
- package/dist/pine-core/p-a9ef5295.entry.js +1 -0
- package/dist/pine-core/{p-334b7c30.entry.js → p-ac2775b5.entry.js} +1 -1
- package/dist/pine-core/{p-a1750a54.entry.js → p-b0058cb0.entry.js} +1 -1
- package/dist/pine-core/p-b0674b8d.entry.js +1 -0
- package/dist/pine-core/{p-1e1804ed.system.entry.js → p-b5c760c8.system.entry.js} +1 -1
- package/dist/pine-core/{p-3a1b7302.system.entry.js → p-b6812452.system.entry.js} +1 -1
- package/dist/pine-core/{p-2b0cb8c4.system.entry.js → p-b89583e7.system.entry.js} +1 -1
- package/dist/pine-core/{p-5584a56b.entry.js → p-b9380ce8.entry.js} +1 -1
- package/dist/pine-core/{p-568bb210.system.entry.js → p-ba54470a.system.entry.js} +1 -1
- package/dist/pine-core/{p-7a4da839.entry.js → p-bf759fc0.entry.js} +1 -1
- package/dist/pine-core/{p-791d357a.entry.js → p-c1932447.entry.js} +1 -1
- package/dist/pine-core/{p-cce83ef0.entry.js → p-c2688710.entry.js} +1 -1
- package/dist/pine-core/{p-46de2438.entry.js → p-c35fe2e2.entry.js} +1 -1
- package/dist/pine-core/{p-ef71710b.system.entry.js → p-c3748812.system.entry.js} +2 -2
- package/dist/pine-core/{p-59a5dd77.system.entry.js → p-c52ad43b.system.entry.js} +1 -1
- package/dist/pine-core/{p-3876b9be.entry.js → p-ce715993.entry.js} +1 -1
- package/dist/pine-core/{p-587a15ee.system.entry.js → p-cf389430.system.entry.js} +1 -1
- package/dist/pine-core/{p-7874fe2b.entry.js → p-d037308b.entry.js} +1 -1
- package/dist/pine-core/{p-52e9ec4f.entry.js → p-d281464e.entry.js} +1 -1
- package/dist/pine-core/{p-04f8b32a.entry.js → p-d70201bb.entry.js} +1 -1
- package/dist/pine-core/{p-9865431f.system.entry.js → p-d9cb26fe.system.entry.js} +1 -1
- package/dist/pine-core/{p-44388b8f.system.entry.js → p-dc460e2d.system.entry.js} +1 -1
- package/dist/pine-core/p-dc48f603.entry.js +1 -0
- package/dist/pine-core/{p-01dba061.entry.js → p-dcc4ee5e.entry.js} +1 -1
- package/dist/pine-core/{p-f366f064.entry.js → p-def5d3d3.entry.js} +1 -1
- package/dist/pine-core/p-e0fb06ea.system.entry.js +1 -0
- package/dist/pine-core/p-e4b69d10.entry.js +1 -0
- package/dist/pine-core/{p-ae2b466a.system.entry.js → p-e81b4d04.system.entry.js} +1 -1
- package/dist/pine-core/{p-c3a99f39.entry.js → p-eb42ca18.entry.js} +1 -1
- package/dist/pine-core/{p-59c60e5b.entry.js → p-ebe218f8.entry.js} +1 -1
- package/dist/pine-core/{p-889fce8a.entry.js → p-ec2c0e57.entry.js} +2 -2
- package/dist/pine-core/{p-fb68e503.system.entry.js → p-eed4b552.system.entry.js} +1 -1
- package/dist/pine-core/p-f6d1469d.entry.js +1 -0
- package/dist/pine-core/{p-65fb166c.system.entry.js → p-fb10caff.system.entry.js} +1 -1
- package/dist/pine-core/{p-0bf56f61.entry.js → p-ff1e9a32.entry.js} +1 -1
- package/dist/pine-core/p-ff3399ed.entry.js +1 -0
- 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-alert/pds-alert.d.ts +6 -0
- package/dist/types/components/pds-avatar/pds-avatar.d.ts +30 -0
- package/dist/types/components/pds-button/pds-button.d.ts +1 -1
- package/dist/types/components/pds-chip/pds-chip.d.ts +5 -0
- package/dist/types/components/pds-link/pds-link.d.ts +7 -0
- package/dist/types/components/pds-multiselect/pds-multiselect.d.ts +67 -4
- package/dist/types/components/pds-tabs/pds-tab/pds-tab.d.ts +42 -0
- package/dist/types/components/pds-tabs/pds-tabpanel/pds-tabpanel.d.ts +5 -0
- package/dist/types/components/pds-tabs/pds-tabs.d.ts +25 -2
- package/dist/types/components/pds-textarea/pds-textarea.d.ts +6 -0
- package/dist/types/components/pds-toast/pds-toast.d.ts +6 -0
- package/dist/types/components.d.ts +321 -14
- package/dist/types/i18n/i18n-format.d.ts +38 -0
- package/dist/types/i18n/index.d.ts +2 -0
- package/hydrate/index.js +402 -53
- package/hydrate/index.mjs +402 -53
- package/package.json +3 -2
- package/dist/pine-core/p-003f91b1.system.entry.js +0 -1
- package/dist/pine-core/p-006398c3.system.entry.js +0 -1
- package/dist/pine-core/p-190ba1df.entry.js +0 -1
- package/dist/pine-core/p-638e9cb3.entry.js +0 -1
- package/dist/pine-core/p-63e0d4a5.system.entry.js +0 -1
- package/dist/pine-core/p-68121613.system.entry.js +0 -1
- package/dist/pine-core/p-6c5aacad.entry.js +0 -1
- package/dist/pine-core/p-73dd2a2b.entry.js +0 -1
- package/dist/pine-core/p-7520a715.system.entry.js +0 -1
- package/dist/pine-core/p-7766e970.entry.js +0 -1
- package/dist/pine-core/p-7b71f1bf.system.entry.js +0 -1
- package/dist/pine-core/p-7b954dbf.entry.js +0 -1
- package/dist/pine-core/p-8065c732.entry.js +0 -1
- package/dist/pine-core/p-829c52dc.entry.js +0 -1
- package/dist/pine-core/p-C61CFP22.system.js +0 -1
- package/dist/pine-core/p-CaRgVPt7.js +0 -2
- package/dist/pine-core/p-a739bdfa.entry.js +0 -1
- package/dist/pine-core/p-ab957ace.system.entry.js +0 -1
- package/dist/pine-core/p-b88be8be.entry.js +0 -1
- package/dist/pine-core/p-e291db30.entry.js +0 -1
- package/dist/pine-core/p-e77c5c08.system.entry.js +0 -1
- package/dist/pine-core/p-f2315f2a.entry.js +0 -1
- package/dist/pine-core/p-f928817f.system.entry.js +0 -1
- /package/dist/esm-es5/{index-D4ys0pep.js → index-BjlFq0VD.js} +0 -0
- /package/dist/pine-core/{p-D4ys0pep.js → p-BjlFq0VD.js} +0 -0
- /package/dist/pine-core/{p-C62JIZmE.system.js → p-WYNNo1N0.system.js} +0 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
function n(n,t){return t?n.replace(/\{(\w+)\}/g,((n,e)=>e in t?String(t[e]):`{${e}}`)):n}function t(t,e,o,u){let c="other";try{c=new Intl.PluralRules(function(n){var t;const e=n&&"function"==typeof n.closest?null===(t=n.closest("[lang]"))||void 0===t?void 0:t.getAttribute("lang"):null,o="undefined"!=typeof document?document.documentElement.lang:"";return e||o||"en"}(t)).select(e)}catch(n){}return n(o[c]||o.other||o.one||"{count}",Object.assign({count:e},u))}export{n as f,t as p}
|
package/components/pds-alert.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as r,HTMLElement as e,createEvent as o,h as l,Host as i,transformTag as n}from"@stencil/core/internal/client";import{d as a}from"./pds-box2.js";import{d as s}from"./pds-icon2.js";import{d as c}from"./pds-text2.js";const t=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.__attachShadow(),this.pdsAlertDismissClick=o(this,"pdsAlertDismissClick",7),this.small=!1,this.dismissible=!1,this.hideIcon=!1,this.variant="default",this.hasActionsContent=!1,this.handleCloseClick=()=>{this.pdsAlertDismissClick.emit()}}componentWillRender(){const r=this.el.querySelector('[slot="actions"]');this.hasActionsContent=!!r}renderActions(r){return l("pds-box",{class:r?"pds-alert__actions--small":"pds-alert__actions",gap:"sm",flex:r?"none":void 0,"align-items":r?void 0:"center"},l("slot",{name:"actions"}))}renderContent(){return this.small?l("pds-box",{display:"flex",gap:"md","align-items":"center"},l("pds-text",{truncate:this.small,class:"pds-alert__description--small",color:"var(--pds-alert-color-text)",tag:"p"},l("slot",null)),this.hasActionsContent&&this.renderActions(!0)):l("div",null,l("pds-text",{class:"pds-alert__description",color:"var(--pds-alert-color-text)",tag:"p"},l("slot",null)),this.hasActionsContent&&this.renderActions(!1))}render(){const r={danger:"warning-filled",default:"info-circle-filled",info:"info-circle-filled",success:"check-circle-filled",warning:"info-circle-filled"};return l(i,{key:"fb36c6626a4b775971032936f3cc876d2471fc71",class:"pds-alert",id:this.componentId,variant:this.variant},l("pds-box",{key:"5f80f68bfce168e11b9e83760b4a8d08b4a73b6b",class:"pds-alert__container pds-alert__container--"+this.variant,"background-color":"var(--pds-alert-background)","border-color":"var(--pds-alert-border-color)","border-radius":"md",border:!0,display:"block"},l("pds-box",{key:"905b10e7132f0af4a37c4302f3a36fa48a6bcd68",gap:"sm",display:"flex","align-items":this.small?"center":void 0},!this.hideIcon&&l("pds-icon",{key:"278a614c942b76d923624c8df102e0138f39b142",class:"pds-alert__icon "+(this.small?"pds-alert__icon--small":""),color:"var(--pds-alert-color-icon)",icon:r[this.variant]||r.default,size:"var(--pds-alert-icon-size)"}),l("pds-box",{key:"48b11184d688ebe68248b0d9198d491d42bb51c4",class:"pds-alert__content-wrapper",direction:"column",gap:"xs",flex:"grow"},this.heading&&!this.small&&l("pds-text",{key:"53930d08b766a91f8db5ef349d5bb7ac70e0a5cd",class:"pds-alert__heading",color:"var(--pds-alert-color-text)",size:"h5",tag:"h3",weight:"medium"},this.heading),this.renderContent()),this.dismissible&&l("button",{key:"95f4cd20c9e0fa9e652ebe7c9015aa73dad233d0",class:"pds-alert__dismiss",type:"button",part:"dismiss","aria-label":"Dismiss alert",onClick:this.handleCloseClick},l("pds-icon",{key:"3a8e7d24d602839c7250033f06899c1dc46467ce",icon:"remove",size:"var(--pds-alert-icon-size)","aria-hidden":"true",color:"var(--pds-alert-color-dismiss)"})))))}get el(){return this}static get style(){return":host{--pine-alert-color-background:var(--pine-color-grey-150);--pine-alert-color-border:var(--pine-color-grey-300);--pine-alert-color-dismiss:var(--pine-color-grey-900);--pine-alert-color-dismiss-hover:var(--pine-color-grey-300);--pine-alert-color-icon:var(--pine-color-grey-700);--pine-alert-color-link:var(--pine-color-grey-900);--pine-alert-color-link-hover:var(--pine-color-grey-950);--pine-alert-color-text:var(--pine-color-grey-950);--pine-alert-color-danger-background:var(--pine-color-red-150);--pine-alert-color-danger-border:var(--pine-color-red-300);--pine-alert-color-danger-dismiss:var(--pine-color-red-900);--pine-alert-color-danger-dismiss-hover:var(--pine-color-red-300);--pine-alert-color-danger-icon:var(--pine-color-red-700);--pine-alert-color-danger-link:var(--pine-color-red-900);--pine-alert-color-danger-link-hover:var(--pine-color-red-950);--pine-alert-color-danger-text:var(--pine-color-red-950);--pine-alert-color-info-background:var(--pine-color-blue-150);--pine-alert-color-info-border:var(--pine-color-blue-300);--pine-alert-color-info-dismiss:var(--pine-color-blue-900);--pine-alert-color-info-dismiss-hover:var(--pine-color-blue-300);--pine-alert-color-info-icon:var(--pine-color-blue-700);--pine-alert-color-info-link:var(--pine-color-blue-900);--pine-alert-color-info-link-hover:var(--pine-color-blue-950);--pine-alert-color-info-text:var(--pine-color-blue-950);--pine-alert-color-success-background:var(--pine-color-green-150);--pine-alert-color-success-border:var(--pine-color-green-300);--pine-alert-color-success-dismiss:var(--pine-color-green-900);--pine-alert-color-success-dismiss-hover:var(--pine-color-green-300);--pine-alert-color-success-icon:var(--pine-color-green-700);--pine-alert-color-success-link:var(--pine-color-green-900);--pine-alert-color-success-link-hover:var(--pine-color-green-950);--pine-alert-color-success-text:var(--pine-color-green-950);--pine-alert-color-warning-background:var(--pine-color-yellow-150);--pine-alert-color-warning-border:var(--pine-color-yellow-300);--pine-alert-color-warning-dismiss:var(--pine-color-yellow-900);--pine-alert-color-warning-dismiss-hover:var(--pine-color-yellow-300);--pine-alert-color-warning-icon:var(--pine-color-yellow-700);--pine-alert-color-warning-link:var(--pine-color-yellow-900);--pine-alert-color-warning-link-hover:var(--pine-color-yellow-950);--pine-alert-color-warning-text:var(--pine-color-yellow-950)}:host-context([data-theme=dark]){--pine-alert-color-background:var(--pine-color-grey-800);--pine-alert-color-border:var(--pine-color-grey-600);--pine-alert-color-dismiss:var(--pine-color-grey-200);--pine-alert-color-dismiss-hover:var(--pine-color-grey-700);--pine-alert-color-icon:var(--pine-color-grey-300);--pine-alert-color-link:var(--pine-color-grey-300);--pine-alert-color-link-hover:var(--pine-color-grey-050);--pine-alert-color-text:var(--pine-color-grey-100);--pine-alert-color-danger-background:var(--pine-color-red-900);--pine-alert-color-danger-border:var(--pine-color-red-800);--pine-alert-color-danger-dismiss:var(--pine-color-red-200);--pine-alert-color-danger-dismiss-hover:var(--pine-color-red-800);--pine-alert-color-danger-icon:var(--pine-color-red-400);--pine-alert-color-danger-link:var(--pine-color-red-300);--pine-alert-color-danger-link-hover:var(--pine-color-red-200);--pine-alert-color-danger-text:var(--pine-color-red-100);--pine-alert-color-info-background:var(--pine-color-blue-900);--pine-alert-color-info-border:var(--pine-color-blue-800);--pine-alert-color-info-dismiss:var(--pine-color-blue-200);--pine-alert-color-info-dismiss-hover:var(--pine-color-blue-800);--pine-alert-color-info-icon:var(--pine-color-blue-400);--pine-alert-color-info-link:var(--pine-color-blue-300);--pine-alert-color-info-link-hover:var(--pine-color-blue-200);--pine-alert-color-info-text:var(--pine-color-blue-100);--pine-alert-color-success-background:var(--pine-color-green-900);--pine-alert-color-success-border:var(--pine-color-green-800);--pine-alert-color-success-dismiss:var(--pine-color-green-200);--pine-alert-color-success-dismiss-hover:var(--pine-color-green-800);--pine-alert-color-success-icon:var(--pine-color-green-400);--pine-alert-color-success-link:var(--pine-color-green-300);--pine-alert-color-success-link-hover:var(--pine-color-green-200);--pine-alert-color-success-text:var(--pine-color-green-100);--pine-alert-color-warning-background:var(--pine-color-yellow-900);--pine-alert-color-warning-border:var(--pine-color-yellow-800);--pine-alert-color-warning-dismiss:var(--pine-color-yellow-200);--pine-alert-color-warning-dismiss-hover:var(--pine-color-yellow-800);--pine-alert-color-warning-icon:var(--pine-color-yellow-400);--pine-alert-color-warning-link:var(--pine-color-yellow-300);--pine-alert-color-warning-link-hover:var(--pine-color-yellow-200);--pine-alert-color-warning-text:var(--pine-color-yellow-100)}:host{--pds-context-link-color:var(--pine-alert-color-link);--pds-context-link-color-hover:var(--pine-alert-color-link-hover);display:block;line-height:1;width:100%}:host([variant=danger]){--pds-context-link-color:var(--pine-alert-color-danger-link);--pds-context-link-color-hover:var(--pine-alert-color-danger-link-hover)}:host([variant=info]){--pds-context-link-color:var(--pine-alert-color-info-link);--pds-context-link-color-hover:var(--pine-alert-color-info-link-hover)}:host([variant=success]){--pds-context-link-color:var(--pine-alert-color-success-link);--pds-context-link-color-hover:var(--pine-alert-color-success-link-hover)}:host([variant=warning]){--pds-context-link-color:var(--pine-alert-color-warning-link);--pds-context-link-color-hover:var(--pine-alert-color-warning-link-hover)}.pds-alert__container{--pds-alert-icon-size:var(--pine-dimension-sm);--pds-alert-border-dismiss-outline:2px solid var(--pds-alert-color-dismiss);--pds-alert-background:var(--pine-alert-color-background);--pds-alert-border-color:var(--pine-alert-color-border);--pds-alert-color-icon:var(--pine-alert-color-icon);--pds-alert-color-text:var(--pine-alert-color-text);--pds-alert-color-dismiss:var(--pine-alert-color-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-dismiss-hover);padding:var(--pine-dimension-250)}.pds-alert__container--danger{--pds-alert-background:var(--pine-alert-color-danger-background);--pds-alert-border-color:var(--pine-alert-color-danger-border);--pds-alert-color-icon:var(--pine-alert-color-danger-icon);--pds-alert-color-text:var(--pine-alert-color-danger-text);--pds-alert-color-dismiss:var(--pine-alert-color-danger-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-danger-dismiss-hover)}.pds-alert__container--info{--pds-alert-background:var(--pine-alert-color-info-background);--pds-alert-border-color:var(--pine-alert-color-info-border);--pds-alert-color-icon:var(--pine-alert-color-info-icon);--pds-alert-color-text:var(--pine-alert-color-info-text);--pds-alert-color-dismiss:var(--pine-alert-color-info-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-info-dismiss-hover)}.pds-alert__container--success{--pds-alert-background:var(--pine-alert-color-success-background);--pds-alert-border-color:var(--pine-alert-color-success-border);--pds-alert-color-icon:var(--pine-alert-color-success-icon);--pds-alert-color-text:var(--pine-alert-color-success-text);--pds-alert-color-dismiss:var(--pine-alert-color-success-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-success-dismiss-hover)}.pds-alert__container--warning{--pds-alert-background:var(--pine-alert-color-warning-background);--pds-alert-border-color:var(--pine-alert-color-warning-border);--pds-alert-color-icon:var(--pine-alert-color-warning-icon);--pds-alert-color-text:var(--pine-alert-color-warning-text);--pds-alert-color-dismiss:var(--pine-alert-color-warning-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-warning-dismiss-hover)}.pds-alert__icon{-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-alert__icon--small{-webkit-margin-before:0;margin-block-start:0}.pds-alert__content-wrapper{-ms-flex:1;flex:1;min-width:0;overflow:hidden;width:100%}.pds-alert__dismiss{-ms-flex-align:center;align-items:center;background:none;border:0;border-radius:var(--pine-border-radius-full);cursor:pointer;display:-ms-flexbox;display:flex;height:var(--pine-dimension-250);-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-xs);width:var(--pine-dimension-250)}.pds-alert__dismiss:hover{background:var(--pds-alert-background-dismiss-hover);opacity:0.8}.pds-alert__dismiss:focus-visible{outline:var(--pds-alert-border-dismiss-outline)}.pds-alert__description--small{-ms-flex:1 1 auto;flex:1 1 auto;max-width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-alert__actions{-webkit-margin-before:var(--pine-dimension-sm);margin-block-start:var(--pine-dimension-sm)}.pds-alert__actions--small{-ms-flex-negative:0;flex-shrink:0;-webkit-margin-start:auto;margin-inline-start:auto;white-space:nowrap}"}},[257,"pds-alert",{componentId:[1,"component-id"],heading:[1],small:[4],dismissible:[4],hideIcon:[4,"hide-icon"],variant:[1],hasActionsContent:[32]}]),p=t,d=function(){"undefined"!=typeof customElements&&["pds-alert","pds-box","pds-icon","pds-text"].forEach((r=>{switch(r){case"pds-alert":customElements.get(n(r))||customElements.define(n(r),t);break;case"pds-box":customElements.get(n(r))||a();break;case"pds-icon":customElements.get(n(r))||s();break;case"pds-text":customElements.get(n(r))||c()}}))};export{p as PdsAlert,d as defineCustomElement}
|
|
1
|
+
import{proxyCustomElement as r,HTMLElement as e,createEvent as o,h as i,Host as l,transformTag as n}from"@stencil/core/internal/client";import{d as a}from"./pds-box2.js";import{d as s}from"./pds-icon2.js";import{d as c}from"./pds-text2.js";const t=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.__attachShadow(),this.pdsAlertDismissClick=o(this,"pdsAlertDismissClick",7),this.small=!1,this.dismissible=!1,this.hideIcon=!1,this.variant="default",this.dismissLabel="Dismiss alert",this.hasActionsContent=!1,this.handleCloseClick=()=>{this.pdsAlertDismissClick.emit()}}componentWillRender(){const r=this.el.querySelector('[slot="actions"]');this.hasActionsContent=!!r}renderActions(r){return i("pds-box",{class:r?"pds-alert__actions--small":"pds-alert__actions",gap:"sm",flex:r?"none":void 0,"align-items":r?void 0:"center"},i("slot",{name:"actions"}))}renderContent(){return this.small?i("pds-box",{display:"flex",gap:"md","align-items":"center"},i("pds-text",{truncate:this.small,class:"pds-alert__description--small",color:"var(--pds-alert-color-text)",tag:"p"},i("slot",null)),this.hasActionsContent&&this.renderActions(!0)):i("div",null,i("pds-text",{class:"pds-alert__description",color:"var(--pds-alert-color-text)",tag:"p"},i("slot",null)),this.hasActionsContent&&this.renderActions(!1))}render(){const r={danger:"warning-filled",default:"info-circle-filled",info:"info-circle-filled",success:"check-circle-filled",warning:"info-circle-filled"};return i(l,{key:"b143df0c24c077e412894f5f77f1bd7c0ced1c92",class:"pds-alert",id:this.componentId,variant:this.variant},i("pds-box",{key:"928e3852507a1776069ee80906443ef650607ce7",class:"pds-alert__container pds-alert__container--"+this.variant,"background-color":"var(--pds-alert-background)","border-color":"var(--pds-alert-border-color)","border-radius":"md",border:!0,display:"block"},i("pds-box",{key:"778046ab1c651a57e910e45fe00944a74a3c32f7",gap:"sm",display:"flex","align-items":this.small?"center":void 0},!this.hideIcon&&i("pds-icon",{key:"0199ef3e12a8dc9da20006fc8c4e133f83f4caf4",class:"pds-alert__icon "+(this.small?"pds-alert__icon--small":""),color:"var(--pds-alert-color-icon)",icon:r[this.variant]||r.default,size:"var(--pds-alert-icon-size)"}),i("pds-box",{key:"b7b973c0c6154d72f90a585a116ea76ac48cc6e4",class:"pds-alert__content-wrapper",direction:"column",gap:"xs",flex:"grow"},this.heading&&!this.small&&i("pds-text",{key:"c969f9a7eabdc31bc2faca247033e89cc15caea0",class:"pds-alert__heading",color:"var(--pds-alert-color-text)",size:"h5",tag:"h3",weight:"medium"},this.heading),this.renderContent()),this.dismissible&&i("button",{key:"168c21de5a0112a65b73a854add4393fea9ede6f",class:"pds-alert__dismiss",type:"button",part:"dismiss","aria-label":this.dismissLabel,onClick:this.handleCloseClick},i("pds-icon",{key:"f8e9311a4934c1b8458879cd6244a99e3a730be2",icon:"remove",size:"var(--pds-alert-icon-size)","aria-hidden":"true",color:"var(--pds-alert-color-dismiss)"})))))}get el(){return this}static get style(){return":host{--pine-alert-color-background:var(--pine-color-grey-150);--pine-alert-color-border:var(--pine-color-grey-300);--pine-alert-color-dismiss:var(--pine-color-grey-900);--pine-alert-color-dismiss-hover:var(--pine-color-grey-300);--pine-alert-color-icon:var(--pine-color-grey-700);--pine-alert-color-link:var(--pine-color-grey-900);--pine-alert-color-link-hover:var(--pine-color-grey-950);--pine-alert-color-text:var(--pine-color-grey-950);--pine-alert-color-danger-background:var(--pine-color-red-150);--pine-alert-color-danger-border:var(--pine-color-red-300);--pine-alert-color-danger-dismiss:var(--pine-color-red-900);--pine-alert-color-danger-dismiss-hover:var(--pine-color-red-300);--pine-alert-color-danger-icon:var(--pine-color-red-700);--pine-alert-color-danger-link:var(--pine-color-red-900);--pine-alert-color-danger-link-hover:var(--pine-color-red-950);--pine-alert-color-danger-text:var(--pine-color-red-950);--pine-alert-color-info-background:var(--pine-color-blue-150);--pine-alert-color-info-border:var(--pine-color-blue-300);--pine-alert-color-info-dismiss:var(--pine-color-blue-900);--pine-alert-color-info-dismiss-hover:var(--pine-color-blue-300);--pine-alert-color-info-icon:var(--pine-color-blue-700);--pine-alert-color-info-link:var(--pine-color-blue-900);--pine-alert-color-info-link-hover:var(--pine-color-blue-950);--pine-alert-color-info-text:var(--pine-color-blue-950);--pine-alert-color-success-background:var(--pine-color-green-150);--pine-alert-color-success-border:var(--pine-color-green-300);--pine-alert-color-success-dismiss:var(--pine-color-green-900);--pine-alert-color-success-dismiss-hover:var(--pine-color-green-300);--pine-alert-color-success-icon:var(--pine-color-green-700);--pine-alert-color-success-link:var(--pine-color-green-900);--pine-alert-color-success-link-hover:var(--pine-color-green-950);--pine-alert-color-success-text:var(--pine-color-green-950);--pine-alert-color-warning-background:var(--pine-color-yellow-150);--pine-alert-color-warning-border:var(--pine-color-yellow-300);--pine-alert-color-warning-dismiss:var(--pine-color-yellow-900);--pine-alert-color-warning-dismiss-hover:var(--pine-color-yellow-300);--pine-alert-color-warning-icon:var(--pine-color-yellow-700);--pine-alert-color-warning-link:var(--pine-color-yellow-900);--pine-alert-color-warning-link-hover:var(--pine-color-yellow-950);--pine-alert-color-warning-text:var(--pine-color-yellow-950)}:host-context([data-theme=dark]){--pine-alert-color-background:var(--pine-color-grey-800);--pine-alert-color-border:var(--pine-color-grey-600);--pine-alert-color-dismiss:var(--pine-color-grey-200);--pine-alert-color-dismiss-hover:var(--pine-color-grey-700);--pine-alert-color-icon:var(--pine-color-grey-300);--pine-alert-color-link:var(--pine-color-grey-300);--pine-alert-color-link-hover:var(--pine-color-grey-050);--pine-alert-color-text:var(--pine-color-grey-100);--pine-alert-color-danger-background:var(--pine-color-red-900);--pine-alert-color-danger-border:var(--pine-color-red-800);--pine-alert-color-danger-dismiss:var(--pine-color-red-200);--pine-alert-color-danger-dismiss-hover:var(--pine-color-red-800);--pine-alert-color-danger-icon:var(--pine-color-red-400);--pine-alert-color-danger-link:var(--pine-color-red-300);--pine-alert-color-danger-link-hover:var(--pine-color-red-200);--pine-alert-color-danger-text:var(--pine-color-red-100);--pine-alert-color-info-background:var(--pine-color-blue-900);--pine-alert-color-info-border:var(--pine-color-blue-800);--pine-alert-color-info-dismiss:var(--pine-color-blue-200);--pine-alert-color-info-dismiss-hover:var(--pine-color-blue-800);--pine-alert-color-info-icon:var(--pine-color-blue-400);--pine-alert-color-info-link:var(--pine-color-blue-300);--pine-alert-color-info-link-hover:var(--pine-color-blue-200);--pine-alert-color-info-text:var(--pine-color-blue-100);--pine-alert-color-success-background:var(--pine-color-green-900);--pine-alert-color-success-border:var(--pine-color-green-800);--pine-alert-color-success-dismiss:var(--pine-color-green-200);--pine-alert-color-success-dismiss-hover:var(--pine-color-green-800);--pine-alert-color-success-icon:var(--pine-color-green-400);--pine-alert-color-success-link:var(--pine-color-green-300);--pine-alert-color-success-link-hover:var(--pine-color-green-200);--pine-alert-color-success-text:var(--pine-color-green-100);--pine-alert-color-warning-background:var(--pine-color-yellow-900);--pine-alert-color-warning-border:var(--pine-color-yellow-800);--pine-alert-color-warning-dismiss:var(--pine-color-yellow-200);--pine-alert-color-warning-dismiss-hover:var(--pine-color-yellow-800);--pine-alert-color-warning-icon:var(--pine-color-yellow-400);--pine-alert-color-warning-link:var(--pine-color-yellow-300);--pine-alert-color-warning-link-hover:var(--pine-color-yellow-200);--pine-alert-color-warning-text:var(--pine-color-yellow-100)}:host{--pds-context-link-color:var(--pine-alert-color-link);--pds-context-link-color-hover:var(--pine-alert-color-link-hover);display:block;line-height:1;width:100%}:host([variant=danger]){--pds-context-link-color:var(--pine-alert-color-danger-link);--pds-context-link-color-hover:var(--pine-alert-color-danger-link-hover)}:host([variant=info]){--pds-context-link-color:var(--pine-alert-color-info-link);--pds-context-link-color-hover:var(--pine-alert-color-info-link-hover)}:host([variant=success]){--pds-context-link-color:var(--pine-alert-color-success-link);--pds-context-link-color-hover:var(--pine-alert-color-success-link-hover)}:host([variant=warning]){--pds-context-link-color:var(--pine-alert-color-warning-link);--pds-context-link-color-hover:var(--pine-alert-color-warning-link-hover)}.pds-alert__container{--pds-alert-icon-size:var(--pine-dimension-sm);--pds-alert-border-dismiss-outline:2px solid var(--pds-alert-color-dismiss);--pds-alert-background:var(--pine-alert-color-background);--pds-alert-border-color:var(--pine-alert-color-border);--pds-alert-color-icon:var(--pine-alert-color-icon);--pds-alert-color-text:var(--pine-alert-color-text);--pds-alert-color-dismiss:var(--pine-alert-color-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-dismiss-hover);padding:var(--pine-dimension-250)}.pds-alert__container--danger{--pds-alert-background:var(--pine-alert-color-danger-background);--pds-alert-border-color:var(--pine-alert-color-danger-border);--pds-alert-color-icon:var(--pine-alert-color-danger-icon);--pds-alert-color-text:var(--pine-alert-color-danger-text);--pds-alert-color-dismiss:var(--pine-alert-color-danger-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-danger-dismiss-hover)}.pds-alert__container--info{--pds-alert-background:var(--pine-alert-color-info-background);--pds-alert-border-color:var(--pine-alert-color-info-border);--pds-alert-color-icon:var(--pine-alert-color-info-icon);--pds-alert-color-text:var(--pine-alert-color-info-text);--pds-alert-color-dismiss:var(--pine-alert-color-info-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-info-dismiss-hover)}.pds-alert__container--success{--pds-alert-background:var(--pine-alert-color-success-background);--pds-alert-border-color:var(--pine-alert-color-success-border);--pds-alert-color-icon:var(--pine-alert-color-success-icon);--pds-alert-color-text:var(--pine-alert-color-success-text);--pds-alert-color-dismiss:var(--pine-alert-color-success-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-success-dismiss-hover)}.pds-alert__container--warning{--pds-alert-background:var(--pine-alert-color-warning-background);--pds-alert-border-color:var(--pine-alert-color-warning-border);--pds-alert-color-icon:var(--pine-alert-color-warning-icon);--pds-alert-color-text:var(--pine-alert-color-warning-text);--pds-alert-color-dismiss:var(--pine-alert-color-warning-dismiss);--pds-alert-background-dismiss-hover:var(--pine-alert-color-warning-dismiss-hover)}.pds-alert__icon{-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-alert__icon--small{-webkit-margin-before:0;margin-block-start:0}.pds-alert__content-wrapper{-ms-flex:1;flex:1;min-width:0;overflow:hidden;width:100%}.pds-alert__dismiss{-ms-flex-align:center;align-items:center;background:none;border:0;border-radius:var(--pine-border-radius-full);cursor:pointer;display:-ms-flexbox;display:flex;height:var(--pine-dimension-250);-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-xs);width:var(--pine-dimension-250)}.pds-alert__dismiss:hover{background:var(--pds-alert-background-dismiss-hover);opacity:0.8}.pds-alert__dismiss:focus-visible{outline:var(--pds-alert-border-dismiss-outline)}.pds-alert__description--small{-ms-flex:1 1 auto;flex:1 1 auto;max-width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-alert__actions{-webkit-margin-before:var(--pine-dimension-sm);margin-block-start:var(--pine-dimension-sm)}.pds-alert__actions--small{-ms-flex-negative:0;flex-shrink:0;-webkit-margin-start:auto;margin-inline-start:auto;white-space:nowrap}"}},[257,"pds-alert",{componentId:[1,"component-id"],heading:[1],small:[4],dismissible:[4],hideIcon:[4,"hide-icon"],variant:[1],dismissLabel:[1,"dismiss-label"],hasActionsContent:[32]}]),p=t,d=function(){"undefined"!=typeof customElements&&["pds-alert","pds-box","pds-icon","pds-text"].forEach((r=>{switch(r){case"pds-alert":customElements.get(n(r))||customElements.define(n(r),t);break;case"pds-box":customElements.get(n(r))||a();break;case"pds-icon":customElements.get(n(r))||s();break;case"pds-text":customElements.get(n(r))||c()}}))};export{p as PdsAlert,d as defineCustomElement}
|
package/components/pds-avatar.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as
|
|
1
|
+
import{proxyCustomElement as a,HTMLElement as i,h as t,Host as s,transformTag as r}from"@stencil/core/internal/client";import{b as e,e as n}from"./index2.js";import{d as o}from"./pds-icon2.js";const d=a(class extends i{constructor(a){super(),!1!==a&&this.__registerHost(),this.__attachShadow(),this.alt=null,this.badge=!1,this.dropdown=!1,this.image=null,this.initials=null,this.size="lg",this.status=null,this.statusRing=!1,this.variant="customer",this.triggerLabel="Avatar dropdown trigger",this.renderAssetWrapper=()=>{const a={height:this.avatarSize(),width:this.avatarSize()};return t("div",{style:a,part:"asset-wrapper"},this.renderIconOrImage(),this.renderBadge(),this.renderStatus())},this.renderAvatar=()=>this.dropdown?t("button",{class:"pds-avatar__button",type:"button",part:"button","aria-label":this.triggerLabel},this.renderAssetWrapper()):this.renderAssetWrapper(),this.renderBadge=()=>this.badge&&!this.status&&t("pds-icon",{color:"var(--pine-color-purple-600)",class:"pds-avatar__badge",icon:e,size:"33.53%"}),this.renderStatus=()=>{var a;return this.status?t("span",this.dropdown?{class:"pds-avatar__status",part:"status","aria-hidden":"true"}:{class:"pds-avatar__status",part:"status",role:"img","aria-label":null!==(a=this.statusLabel)&&void 0!==a?a:this.status+" status"}):null},this.renderIconOrImage=()=>this.image?t("img",{alt:this.alt,src:this.image}):this.initials?t("svg",{class:"pds-avatar__initials",viewBox:"0 0 32 32"},t("text",{x:"16",y:"20"},this.initials)):t("pds-icon",{color:"var(--pine-color-brand)",icon:n,size:"33.53%"}),this.classNames=()=>({"pds-avatar":!0,"pds-avatar--has-image":""!==this.image&&null!==this.image,"pds-avatar--has-initials":""!==this.initials&&null!==this.initials,["pds-avatar--"+this.variant]:"admin"===this.variant,"pds-avatar--status-ring":!!this.status&&this.statusRing})}avatarSize(){const a={xs:"24px",sm:"32px",md:"40px",lg:"56px",xl:"64px"};return a[this.size]?a[this.size]:this.size}render(){return t(s,{key:"594604d25190002ec166626b4a4a1a9a6be875d8",id:this.componentId,class:Object.assign({},this.classNames())},this.renderAvatar())}static get style(){return":host{display:inline-block}div{--color-background-container:var(--pine-color-background-container-hover);-ms-flex-align:center;align-items:center;background-color:var(--color-background-container);border-radius:var(--border-radius-admin-round, var(--pine-border-radius-full));display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;position:relative}:host(.pds-avatar--admin) div{--border-radius-admin-round:var(--pine-dimension-150);border-radius:var(--border-radius-admin-round)}:host(.pds-avatar--has-image) div{background:transparent}@supports selector(:has){div:has(img){background-color:transparent}}.pds-avatar__button{-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:var(--pine-dimension-none);border-radius:var(--pine-border-radius-full);cursor:pointer;display:-ms-flexbox;display:flex;padding:var(--pine-dimension-none)}.pds-avatar__button:focus-visible{outline:var(--pine-outline-focus)}.pds-avatar__badge{background-color:transparent;border:var(--pine-dimension-none);border-color:transparent;border-radius:var(--pine-border-radius-round);inset-block-end:var(--pine-dimension-none);inset-inline-end:var(--pine-dimension-none);position:absolute}:host([status=online]){--pds-avatar-status-color:var(--pine-color-green-500)}:host([status=away]){--pds-avatar-status-color:var(--pine-color-yellow-500)}:host([status=offline]){--pds-avatar-status-color:var(--pine-color-background-inset-emphasized)}.pds-avatar__status{background-color:var(--pds-avatar-status-color, var(--pine-color-background-inset-emphasized));block-size:28%;border-radius:var(--pine-border-radius-full);-webkit-box-shadow:0 0 0 var(--pine-border-width-thick) var(--pine-color-background-container);box-shadow:0 0 0 var(--pine-border-width-thick) var(--pine-color-background-container);inline-size:28%;inset-block-end:var(--pine-dimension-none);inset-inline-end:var(--pine-dimension-none);min-block-size:var(--pine-dimension-100);min-inline-size:var(--pine-dimension-100);position:absolute}:host(.pds-avatar--status-ring) div{-webkit-box-shadow:0 0 0 var(--pine-border-width-thick) var(--pds-avatar-status-color, var(--pine-color-background-inset-emphasized));box-shadow:0 0 0 var(--pine-border-width-thick) var(--pds-avatar-status-color, var(--pine-color-background-inset-emphasized))}img{border-radius:var(--border-radius-admin-round, var(--pine-border-radius-full));height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.pds-avatar__initials{color:var(--pine-color-brand);fill:var(--pine-color-brand);font-size:var(--pine-font-size-085);font-weight:var(--pine-font-weight-semi-bold);height:100%;text-align:center;width:100%}.pds-avatar__initials text{text-anchor:middle}"}},[1,"pds-avatar",{alt:[1],badge:[4],componentId:[1,"component-id"],dropdown:[4],image:[1],initials:[1],size:[513],status:[513],statusLabel:[1,"status-label"],statusRing:[4,"status-ring"],variant:[513],triggerLabel:[1,"trigger-label"]}]),l=d,p=function(){"undefined"!=typeof customElements&&["pds-avatar","pds-icon"].forEach((a=>{switch(a){case"pds-avatar":customElements.get(r(a))||customElements.define(r(a),d);break;case"pds-icon":customElements.get(r(a))||o()}}))};export{l as PdsAvatar,p as defineCustomElement}
|
package/components/pds-chip2.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as i,HTMLElement as e,createEvent as o,h as n,Host as r,transformTag as p}from"@stencil/core/internal/client";import{d as c,r as s}from"./index2.js";import{d as t}from"./pds-icon2.js";const d=i(class extends e{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.pdsTagCloseClick=o(this,"pdsTagCloseClick",7),this.dot=!1,this.large=!1,this.sentiment="neutral",this.variant="text",this.handleCloseClick=()=>{this.pdsTagCloseClick.emit()}}get effectiveSize(){return null!=this.size?this.size:this.large?"lg":"md"}classNames(){const i=["pds-chip"],e=this.effectiveSize;e&&"md"!==e&&i.push("pds-chip--"+e);const o="brand"===this.sentiment?"text":this.variant;return o&&i.push("pds-chip--"+o),this.sentiment&&i.push("pds-chip--"+this.sentiment),i.join(" ")}get effectiveVariant(){return"brand"===this.sentiment?"text":this.variant}get iconSize(){switch(this.effectiveSize){case"sm":return"10px";case"lg":return"14px";default:return"12px"}}setChipContent(){const i="brand"!==this.sentiment&&this.dot;return"dropdown"===this.effectiveVariant?n("button",{class:"pds-chip__button",type:"button",part:"button"},this.icon&&n("pds-icon",{icon:this.icon,size:this.iconSize,"aria-hidden":"true"}),i&&n("i",{class:"pds-chip__dot","aria-hidden":"true"}),n("slot",null),n("pds-icon",{icon:c,size:this.iconSize,"aria-hidden":"true"})):n("span",{class:"pds-chip__label"},this.icon&&n("pds-icon",{icon:this.icon,size:this.iconSize,"aria-hidden":"true"}),i&&n("i",{class:"pds-chip__dot","aria-hidden":"true"}),n("slot",null))}renderCloseButton(){return n(this.removeUrl?"a":"button",Object.assign({},(()=>{if(this.removeUrl){const i={class:"pds-chip__close",href:this.removeUrl,"aria-label":"Remove"};this.removeTarget&&(i.target=this.removeTarget),this.removeHttpMethod&&(i["data-method"]=this.removeHttpMethod,i["data-turbo-method"]=this.removeHttpMethod);const e=[];return"_blank"===this.removeTarget&&e.push("noopener","noreferrer"),this.removeHttpMethod&&"get"!==this.removeHttpMethod&&e.push("nofollow"),e.length>0&&(i.rel=e.join(" ")),i}return{class:"pds-chip__close",type:"button","aria-label":"Remove"}})(),{onClick:this.handleCloseClick}),n("pds-icon",{icon:s,size:this.iconSize}))}render(){return n(r,{key:"1d75f8ea7583f53191467b568352664ea0313c79",class:this.classNames(),id:this.componentId},this.setChipContent(),"tag"===this.effectiveVariant&&this.renderCloseButton())}static get style(){return":host{--pine-chip-color-accent:var(--pine-color-purple-100);--pine-chip-color-accent-hover:var(--pine-color-purple-300);--pine-chip-color-accent-dot:var(--pine-color-purple-600);--pine-chip-color-accent-text:var(--pine-color-purple-950);--pine-chip-color-danger:var(--pine-color-red-100);--pine-chip-color-danger-hover:var(--pine-color-red-300);--pine-chip-color-danger-dot:var(--pine-color-red-600);--pine-chip-color-danger-text:var(--pine-color-red-950);--pine-chip-color-info:var(--pine-color-blue-100);--pine-chip-color-info-hover:var(--pine-color-blue-300);--pine-chip-color-info-dot:var(--pine-color-blue-600);--pine-chip-color-info-text:var(--pine-color-blue-950);--pine-chip-color-neutral:var(--pine-color-grey-100);--pine-chip-color-neutral-hover:var(--pine-color-grey-300);--pine-chip-color-neutral-dot:var(--pine-color-grey-600);--pine-chip-color-neutral-text:var(--pine-color-grey-950);--pine-chip-color-success:var(--pine-color-green-100);--pine-chip-color-success-hover:var(--pine-color-green-300);--pine-chip-color-success-dot:var(--pine-color-green-600);--pine-chip-color-success-text:var(--pine-color-green-950);--pine-chip-color-warning:var(--pine-color-yellow-100);--pine-chip-color-warning-hover:var(--pine-color-yellow-300);--pine-chip-color-warning-dot:var(--pine-color-yellow-600);--pine-chip-color-warning-text:var(--pine-color-yellow-950)}:host-context([data-theme=dark]){--pine-chip-color-accent:var(--pine-color-purple-900);--pine-chip-color-accent-hover:var(--pine-color-purple-800);--pine-chip-color-accent-dot:var(--pine-color-purple-400);--pine-chip-color-accent-text:var(--pine-color-purple-100);--pine-chip-color-danger:var(--pine-color-red-900);--pine-chip-color-danger-hover:var(--pine-color-red-800);--pine-chip-color-danger-dot:var(--pine-color-red-400);--pine-chip-color-danger-text:var(--pine-color-red-100);--pine-chip-color-info:var(--pine-color-blue-900);--pine-chip-color-info-hover:var(--pine-color-blue-800);--pine-chip-color-info-dot:var(--pine-color-blue-400);--pine-chip-color-info-text:var(--pine-color-blue-100);--pine-chip-color-neutral:var(--pine-color-grey-800);--pine-chip-color-neutral-hover:var(--pine-color-grey-600);--pine-chip-color-neutral-dot:var(--pine-color-grey-300);--pine-chip-color-neutral-text:var(--pine-color-grey-100);--pine-chip-color-success:var(--pine-color-green-900);--pine-chip-color-success-hover:var(--pine-color-green-800);--pine-chip-color-success-dot:var(--pine-color-green-400);--pine-chip-color-success-text:var(--pine-color-green-100);--pine-chip-color-warning:var(--pine-color-yellow-900);--pine-chip-color-warning-hover:var(--pine-color-yellow-800);--pine-chip-color-warning-dot:var(--pine-color-yellow-400);--pine-chip-color-warning-text:var(--pine-color-yellow-100)}:host{--sizing-close:var(--pine-dimension-125);-ms-flex-align:center;align-items:center;border-radius:var(--pine-dimension-sm);display:-ms-inline-flexbox;display:inline-flex;padding-block:var(--pine-dimension-025);padding-inline:var(--pine-dimension-100)}:host(.pds-chip--accent){background:var(--pine-chip-color-accent);border:var(--pine-border-width) solid var(--pine-chip-color-accent-hover)}:host(.pds-chip--accent) .pds-chip__dot{background:var(--pine-chip-color-accent-dot)}:host(.pds-chip--accent) .pds-chip__label,:host(.pds-chip--accent) .pds-chip__button,:host(.pds-chip--accent) .pds-chip__close{color:var(--pine-chip-color-accent-text);font-weight:var(--pine-font-weight-medium)}:host(.pds-chip--accent) .pds-chip__close:hover{background:var(--pine-chip-color-accent-hover)}:host(.pds-chip--accent.pds-chip--dropdown:hover){background:var(--pine-chip-color-accent-hover)}:host(.pds-chip--danger){background:var(--pine-chip-color-danger);border:var(--pine-border-width) solid var(--pine-chip-color-danger-hover)}:host(.pds-chip--danger) .pds-chip__dot{background:var(--pine-chip-color-danger-dot)}:host(.pds-chip--danger) .pds-chip__label,:host(.pds-chip--danger) .pds-chip__button,:host(.pds-chip--danger) .pds-chip__close{color:var(--pine-chip-color-danger-text);font-weight:var(--pine-font-weight-medium)}:host(.pds-chip--danger) .pds-chip__close:hover{background:var(--pine-chip-color-danger-hover)}:host(.pds-chip--danger.pds-chip--dropdown:hover){background:var(--pine-chip-color-danger-hover)}:host(.pds-chip--info){background:var(--pine-chip-color-info);border:var(--pine-border-width) solid var(--pine-chip-color-info-hover)}:host(.pds-chip--info) .pds-chip__dot{background:var(--pine-chip-color-info-dot)}:host(.pds-chip--info) .pds-chip__label,:host(.pds-chip--info) .pds-chip__button,:host(.pds-chip--info) .pds-chip__close{color:var(--pine-chip-color-info-text);font-weight:var(--pine-font-weight-medium)}:host(.pds-chip--info) .pds-chip__close:hover{background:var(--pine-chip-color-info-hover)}:host(.pds-chip--info.pds-chip--dropdown:hover){background:var(--pine-chip-color-info-hover)}:host(.pds-chip--neutral){background:var(--pine-chip-color-neutral);border:var(--pine-border-width) solid var(--pine-chip-color-neutral-hover)}:host(.pds-chip--neutral) .pds-chip__dot{background:var(--pine-chip-color-neutral-dot)}:host(.pds-chip--neutral) .pds-chip__label,:host(.pds-chip--neutral) .pds-chip__button,:host(.pds-chip--neutral) .pds-chip__close{color:var(--pine-chip-color-neutral-text);font-weight:var(--pine-font-weight-medium)}:host(.pds-chip--neutral) .pds-chip__close:hover{background:var(--pine-chip-color-neutral-hover)}:host(.pds-chip--neutral.pds-chip--dropdown:hover){background:var(--pine-chip-color-neutral-hover)}:host(.pds-chip--success){background:var(--pine-chip-color-success);border:var(--pine-border-width) solid var(--pine-chip-color-success-hover)}:host(.pds-chip--success) .pds-chip__dot{background:var(--pine-chip-color-success-dot)}:host(.pds-chip--success) .pds-chip__label,:host(.pds-chip--success) .pds-chip__button,:host(.pds-chip--success) .pds-chip__close{color:var(--pine-chip-color-success-text);font-weight:var(--pine-font-weight-medium)}:host(.pds-chip--success) .pds-chip__close:hover{background:var(--pine-chip-color-success-hover)}:host(.pds-chip--success.pds-chip--dropdown:hover){background:var(--pine-chip-color-success-hover)}:host(.pds-chip--warning){background:var(--pine-chip-color-warning);border:var(--pine-border-width) solid var(--pine-chip-color-warning-hover)}:host(.pds-chip--warning) .pds-chip__dot{background:var(--pine-chip-color-warning-dot)}:host(.pds-chip--warning) .pds-chip__label,:host(.pds-chip--warning) .pds-chip__button,:host(.pds-chip--warning) .pds-chip__close{color:var(--pine-chip-color-warning-text);font-weight:var(--pine-font-weight-medium)}:host(.pds-chip--warning) .pds-chip__close:hover{background:var(--pine-chip-color-warning-hover)}:host(.pds-chip--warning.pds-chip--dropdown:hover){background:var(--pine-chip-color-warning-hover)}.pds-chip__dot{border:var(--pine-border-width) solid transparent;border-radius:var(--pine-border-radius-full);display:inline-block;height:var(--pine-dimension-2xs);-webkit-margin-end:var(--pine-dimension-2xs);margin-inline-end:var(--pine-dimension-2xs);width:var(--pine-dimension-2xs)}.pds-chip__label{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex}.pds-chip__label pds-icon{-webkit-margin-end:var(--pine-dimension-2xs);margin-inline-end:var(--pine-dimension-2xs)}.pds-chip__label,.pds-chip__button{font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}:host(.pds-chip--dropdown){padding:var(--pine-dimension-none)}.pds-chip__button{-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:var(--pine-dimension-none);border-radius:var(--pine-dimension-sm);cursor:pointer;display:-ms-flexbox;display:flex;padding:var(--pine-dimension-025) var(--pine-dimension-100)}.pds-chip__button:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-chip__button pds-icon:first-child{-webkit-margin-end:var(--pine-dimension-2xs);margin-inline-end:var(--pine-dimension-2xs)}.pds-chip__button pds-icon:last-child{-webkit-margin-end:calc(var(--pine-dimension-025) * -1);margin-inline-end:calc(var(--pine-dimension-025) * -1);-webkit-margin-start:var(--pine-dimension-2xs);margin-inline-start:var(--pine-dimension-2xs)}.pds-chip__close{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;border-radius:var(--pine-border-radius-full);-webkit-box-sizing:border-box;box-sizing:border-box;height:var(--sizing-close);-webkit-margin-end:calc(var(--pine-dimension-xs) * -1);margin-inline-end:calc(var(--pine-dimension-xs) * -1);-webkit-margin-start:var(--pine-dimension-2xs);margin-inline-start:var(--pine-dimension-2xs);padding:var(--sizing-close);position:relative;width:var(--sizing-close)}.pds-chip__close pds-icon{left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}.pds-chip__close:focus-visible{outline:var(--pine-outline-focus)}:host(.pds-chip--sm){--sizing-close:var(--pine-dimension-100);padding-block:var(--pine-dimension-025);padding-inline:var(--pine-dimension-100)}:host(.pds-chip--sm) .pds-chip__label,:host(.pds-chip--sm) .pds-chip__button{font:var(--pine-typography-body-sm-medium);letter-spacing:var(--pine-letter-spacing)}:host(.pds-chip--sm.pds-chip--dropdown){padding:var(--pine-dimension-none)}:host(.pds-chip--sm.pds-chip--dropdown) .pds-chip__button{padding:var(--pine-dimension-025) var(--pine-dimension-100)}:host(.pds-chip--sm.pds-chip--brand) .pds-chip__label{padding:var(--pine-dimension-025) var(--pine-dimension-100)}:host(.pds-chip--lg){padding-block:var(--pine-dimension-025);padding-inline:var(--pine-dimension-150)}:host(.pds-chip--lg) .pds-chip__label,:host(.pds-chip--lg) .pds-chip__button{font-family:var(--pine-font-family-heading);font-size:var(--pine-font-size-heading-6);font-weight:var(--pine-font-weight-medium);letter-spacing:var(--pine-letter-spacing-heading-6)}:host(.pds-chip--lg.pds-chip--dropdown){padding:var(--pine-dimension-none)}:host(.pds-chip--lg.pds-chip--dropdown) .pds-chip__button{padding:var(--pine-dimension-025) var(--pine-dimension-150)}:host(.pds-chip--brand){background:-webkit-gradient(linear, left top, right top, from(#FF3E14), to(#6B62F2));background:linear-gradient(90deg, #FF3E14 0%, #6B62F2 100%);border:0;padding:1px;position:relative}:host(.pds-chip--brand) .pds-chip__label{background:rgba(255, 255, 255, 0.9);border-radius:calc(var(--pine-dimension-sm) - 1px);color:var(--pine-color-grey-900);font-weight:var(--pine-font-weight-medium);padding:var(--pine-dimension-025) var(--pine-dimension-100);position:relative;z-index:var(--pine-z-index-raised)}:host(.pds-chip--brand) .pds-chip__label pds-icon{-webkit-margin-end:var(--pine-dimension-2xs);margin-inline-end:var(--pine-dimension-2xs)}:host(.pds-chip--brand) .pds-chip__button,:host(.pds-chip--brand) .pds-chip__close{color:var(--pine-color-grey-900);font-weight:var(--pine-font-weight-medium);position:relative;z-index:var(--pine-z-index-raised)}:host(.pds-chip--brand) .pds-chip__button pds-icon:first-child{-webkit-margin-end:var(--pine-dimension-2xs);margin-inline-end:var(--pine-dimension-2xs)}:host(.pds-chip--brand) .pds-chip__close:hover{background:rgba(255, 255, 255, 0.8)}"}},[257,"pds-chip",{componentId:[1,"component-id"],dot:[4],icon:[1],large:[4],size:[1],sentiment:[1],variant:[1],removeUrl:[1,"remove-url"],removeHttpMethod:[1,"remove-http-method"],removeTarget:[1,"remove-target"]}]);function a(){"undefined"!=typeof customElements&&["pds-chip","pds-icon"].forEach((i=>{switch(i){case"pds-chip":customElements.get(p(i))||customElements.define(p(i),d);break;case"pds-icon":customElements.get(p(i))||t()}}))}export{d as P,a as d}
|
|
1
|
+
import{proxyCustomElement as i,HTMLElement as e,createEvent as o,h as n,Host as r,transformTag as p}from"@stencil/core/internal/client";import{d as c,r as s}from"./index2.js";import{d as t}from"./pds-icon2.js";const a=i(class extends e{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.pdsTagCloseClick=o(this,"pdsTagCloseClick",7),this.dot=!1,this.large=!1,this.sentiment="neutral",this.variant="text",this.dismissLabel="Remove",this.handleCloseClick=()=>{this.pdsTagCloseClick.emit()}}get effectiveSize(){return null!=this.size?this.size:this.large?"lg":"md"}classNames(){const i=["pds-chip"],e=this.effectiveSize;e&&"md"!==e&&i.push("pds-chip--"+e);const o="brand"===this.sentiment?"text":this.variant;return o&&i.push("pds-chip--"+o),this.sentiment&&i.push("pds-chip--"+this.sentiment),i.join(" ")}get effectiveVariant(){return"brand"===this.sentiment?"text":this.variant}get iconSize(){switch(this.effectiveSize){case"sm":return"10px";case"lg":return"14px";default:return"12px"}}setChipContent(){const i="brand"!==this.sentiment&&this.dot;return"dropdown"===this.effectiveVariant?n("button",{class:"pds-chip__button",type:"button",part:"button"},this.icon&&n("pds-icon",{icon:this.icon,size:this.iconSize,"aria-hidden":"true"}),i&&n("i",{class:"pds-chip__dot","aria-hidden":"true"}),n("slot",null),n("pds-icon",{icon:c,size:this.iconSize,"aria-hidden":"true"})):n("span",{class:"pds-chip__label"},this.icon&&n("pds-icon",{icon:this.icon,size:this.iconSize,"aria-hidden":"true"}),i&&n("i",{class:"pds-chip__dot","aria-hidden":"true"}),n("slot",null))}renderCloseButton(){return n(this.removeUrl?"a":"button",Object.assign({},(()=>{if(this.removeUrl){const i={class:"pds-chip__close",href:this.removeUrl,"aria-label":this.dismissLabel};this.removeTarget&&(i.target=this.removeTarget),this.removeHttpMethod&&(i["data-method"]=this.removeHttpMethod,i["data-turbo-method"]=this.removeHttpMethod);const e=[];return"_blank"===this.removeTarget&&e.push("noopener","noreferrer"),this.removeHttpMethod&&"get"!==this.removeHttpMethod&&e.push("nofollow"),e.length>0&&(i.rel=e.join(" ")),i}return{class:"pds-chip__close",type:"button","aria-label":this.dismissLabel}})(),{onClick:this.handleCloseClick}),n("pds-icon",{icon:s,size:this.iconSize}))}render(){return n(r,{key:"ff02e96839049b313681389308faba50c5989842",class:this.classNames(),id:this.componentId},this.setChipContent(),"tag"===this.effectiveVariant&&this.renderCloseButton())}static get style(){return":host{--pine-chip-color-accent:var(--pine-color-purple-100);--pine-chip-color-accent-hover:var(--pine-color-purple-300);--pine-chip-color-accent-dot:var(--pine-color-purple-600);--pine-chip-color-accent-text:var(--pine-color-purple-950);--pine-chip-color-danger:var(--pine-color-red-100);--pine-chip-color-danger-hover:var(--pine-color-red-300);--pine-chip-color-danger-dot:var(--pine-color-red-600);--pine-chip-color-danger-text:var(--pine-color-red-950);--pine-chip-color-info:var(--pine-color-blue-100);--pine-chip-color-info-hover:var(--pine-color-blue-300);--pine-chip-color-info-dot:var(--pine-color-blue-600);--pine-chip-color-info-text:var(--pine-color-blue-950);--pine-chip-color-neutral:var(--pine-color-grey-100);--pine-chip-color-neutral-hover:var(--pine-color-grey-300);--pine-chip-color-neutral-dot:var(--pine-color-grey-600);--pine-chip-color-neutral-text:var(--pine-color-grey-950);--pine-chip-color-success:var(--pine-color-green-100);--pine-chip-color-success-hover:var(--pine-color-green-300);--pine-chip-color-success-dot:var(--pine-color-green-600);--pine-chip-color-success-text:var(--pine-color-green-950);--pine-chip-color-warning:var(--pine-color-yellow-100);--pine-chip-color-warning-hover:var(--pine-color-yellow-300);--pine-chip-color-warning-dot:var(--pine-color-yellow-600);--pine-chip-color-warning-text:var(--pine-color-yellow-950)}:host-context([data-theme=dark]){--pine-chip-color-accent:var(--pine-color-purple-900);--pine-chip-color-accent-hover:var(--pine-color-purple-800);--pine-chip-color-accent-dot:var(--pine-color-purple-400);--pine-chip-color-accent-text:var(--pine-color-purple-100);--pine-chip-color-danger:var(--pine-color-red-900);--pine-chip-color-danger-hover:var(--pine-color-red-800);--pine-chip-color-danger-dot:var(--pine-color-red-400);--pine-chip-color-danger-text:var(--pine-color-red-100);--pine-chip-color-info:var(--pine-color-blue-900);--pine-chip-color-info-hover:var(--pine-color-blue-800);--pine-chip-color-info-dot:var(--pine-color-blue-400);--pine-chip-color-info-text:var(--pine-color-blue-100);--pine-chip-color-neutral:var(--pine-color-grey-800);--pine-chip-color-neutral-hover:var(--pine-color-grey-600);--pine-chip-color-neutral-dot:var(--pine-color-grey-300);--pine-chip-color-neutral-text:var(--pine-color-grey-100);--pine-chip-color-success:var(--pine-color-green-900);--pine-chip-color-success-hover:var(--pine-color-green-800);--pine-chip-color-success-dot:var(--pine-color-green-400);--pine-chip-color-success-text:var(--pine-color-green-100);--pine-chip-color-warning:var(--pine-color-yellow-900);--pine-chip-color-warning-hover:var(--pine-color-yellow-800);--pine-chip-color-warning-dot:var(--pine-color-yellow-400);--pine-chip-color-warning-text:var(--pine-color-yellow-100)}:host{--sizing-close:var(--pine-dimension-125);-ms-flex-align:center;align-items:center;border-radius:var(--pine-dimension-sm);display:-ms-inline-flexbox;display:inline-flex;padding-block:var(--pine-dimension-025);padding-inline:var(--pine-dimension-100)}:host(.pds-chip--accent){background:var(--pine-chip-color-accent);border:var(--pine-border-width) solid var(--pine-chip-color-accent-hover)}:host(.pds-chip--accent) .pds-chip__dot{background:var(--pine-chip-color-accent-dot)}:host(.pds-chip--accent) .pds-chip__label,:host(.pds-chip--accent) .pds-chip__button,:host(.pds-chip--accent) .pds-chip__close{color:var(--pine-chip-color-accent-text);font-weight:var(--pine-font-weight-medium)}:host(.pds-chip--accent) .pds-chip__close:hover{background:var(--pine-chip-color-accent-hover)}:host(.pds-chip--accent.pds-chip--dropdown:hover){background:var(--pine-chip-color-accent-hover)}:host(.pds-chip--danger){background:var(--pine-chip-color-danger);border:var(--pine-border-width) solid var(--pine-chip-color-danger-hover)}:host(.pds-chip--danger) .pds-chip__dot{background:var(--pine-chip-color-danger-dot)}:host(.pds-chip--danger) .pds-chip__label,:host(.pds-chip--danger) .pds-chip__button,:host(.pds-chip--danger) .pds-chip__close{color:var(--pine-chip-color-danger-text);font-weight:var(--pine-font-weight-medium)}:host(.pds-chip--danger) .pds-chip__close:hover{background:var(--pine-chip-color-danger-hover)}:host(.pds-chip--danger.pds-chip--dropdown:hover){background:var(--pine-chip-color-danger-hover)}:host(.pds-chip--info){background:var(--pine-chip-color-info);border:var(--pine-border-width) solid var(--pine-chip-color-info-hover)}:host(.pds-chip--info) .pds-chip__dot{background:var(--pine-chip-color-info-dot)}:host(.pds-chip--info) .pds-chip__label,:host(.pds-chip--info) .pds-chip__button,:host(.pds-chip--info) .pds-chip__close{color:var(--pine-chip-color-info-text);font-weight:var(--pine-font-weight-medium)}:host(.pds-chip--info) .pds-chip__close:hover{background:var(--pine-chip-color-info-hover)}:host(.pds-chip--info.pds-chip--dropdown:hover){background:var(--pine-chip-color-info-hover)}:host(.pds-chip--neutral){background:var(--pine-chip-color-neutral);border:var(--pine-border-width) solid var(--pine-chip-color-neutral-hover)}:host(.pds-chip--neutral) .pds-chip__dot{background:var(--pine-chip-color-neutral-dot)}:host(.pds-chip--neutral) .pds-chip__label,:host(.pds-chip--neutral) .pds-chip__button,:host(.pds-chip--neutral) .pds-chip__close{color:var(--pine-chip-color-neutral-text);font-weight:var(--pine-font-weight-medium)}:host(.pds-chip--neutral) .pds-chip__close:hover{background:var(--pine-chip-color-neutral-hover)}:host(.pds-chip--neutral.pds-chip--dropdown:hover){background:var(--pine-chip-color-neutral-hover)}:host(.pds-chip--success){background:var(--pine-chip-color-success);border:var(--pine-border-width) solid var(--pine-chip-color-success-hover)}:host(.pds-chip--success) .pds-chip__dot{background:var(--pine-chip-color-success-dot)}:host(.pds-chip--success) .pds-chip__label,:host(.pds-chip--success) .pds-chip__button,:host(.pds-chip--success) .pds-chip__close{color:var(--pine-chip-color-success-text);font-weight:var(--pine-font-weight-medium)}:host(.pds-chip--success) .pds-chip__close:hover{background:var(--pine-chip-color-success-hover)}:host(.pds-chip--success.pds-chip--dropdown:hover){background:var(--pine-chip-color-success-hover)}:host(.pds-chip--warning){background:var(--pine-chip-color-warning);border:var(--pine-border-width) solid var(--pine-chip-color-warning-hover)}:host(.pds-chip--warning) .pds-chip__dot{background:var(--pine-chip-color-warning-dot)}:host(.pds-chip--warning) .pds-chip__label,:host(.pds-chip--warning) .pds-chip__button,:host(.pds-chip--warning) .pds-chip__close{color:var(--pine-chip-color-warning-text);font-weight:var(--pine-font-weight-medium)}:host(.pds-chip--warning) .pds-chip__close:hover{background:var(--pine-chip-color-warning-hover)}:host(.pds-chip--warning.pds-chip--dropdown:hover){background:var(--pine-chip-color-warning-hover)}.pds-chip__dot{border:var(--pine-border-width) solid transparent;border-radius:var(--pine-border-radius-full);display:inline-block;height:var(--pine-dimension-2xs);-webkit-margin-end:var(--pine-dimension-2xs);margin-inline-end:var(--pine-dimension-2xs);width:var(--pine-dimension-2xs)}.pds-chip__label{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex}.pds-chip__label pds-icon{-webkit-margin-end:var(--pine-dimension-2xs);margin-inline-end:var(--pine-dimension-2xs)}.pds-chip__label,.pds-chip__button{font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}:host(.pds-chip--dropdown){padding:var(--pine-dimension-none)}.pds-chip__button{-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:var(--pine-dimension-none);border-radius:var(--pine-dimension-sm);cursor:pointer;display:-ms-flexbox;display:flex;padding:var(--pine-dimension-025) var(--pine-dimension-100)}.pds-chip__button:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-chip__button pds-icon:first-child{-webkit-margin-end:var(--pine-dimension-2xs);margin-inline-end:var(--pine-dimension-2xs)}.pds-chip__button pds-icon:last-child{-webkit-margin-end:calc(var(--pine-dimension-025) * -1);margin-inline-end:calc(var(--pine-dimension-025) * -1);-webkit-margin-start:var(--pine-dimension-2xs);margin-inline-start:var(--pine-dimension-2xs)}.pds-chip__close{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;border-radius:var(--pine-border-radius-full);-webkit-box-sizing:border-box;box-sizing:border-box;height:var(--sizing-close);-webkit-margin-end:calc(var(--pine-dimension-xs) * -1);margin-inline-end:calc(var(--pine-dimension-xs) * -1);-webkit-margin-start:var(--pine-dimension-2xs);margin-inline-start:var(--pine-dimension-2xs);padding:var(--sizing-close);position:relative;width:var(--sizing-close)}.pds-chip__close pds-icon{left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}.pds-chip__close:focus-visible{outline:var(--pine-outline-focus)}:host(.pds-chip--sm){--sizing-close:var(--pine-dimension-100);padding-block:var(--pine-dimension-025);padding-inline:var(--pine-dimension-100)}:host(.pds-chip--sm) .pds-chip__label,:host(.pds-chip--sm) .pds-chip__button{font:var(--pine-typography-body-sm-medium);letter-spacing:var(--pine-letter-spacing)}:host(.pds-chip--sm.pds-chip--dropdown){padding:var(--pine-dimension-none)}:host(.pds-chip--sm.pds-chip--dropdown) .pds-chip__button{padding:var(--pine-dimension-025) var(--pine-dimension-100)}:host(.pds-chip--sm.pds-chip--brand) .pds-chip__label{padding:var(--pine-dimension-025) var(--pine-dimension-100)}:host(.pds-chip--lg){padding-block:var(--pine-dimension-025);padding-inline:var(--pine-dimension-150)}:host(.pds-chip--lg) .pds-chip__label,:host(.pds-chip--lg) .pds-chip__button{font-family:var(--pine-font-family-heading);font-size:var(--pine-font-size-heading-6);font-weight:var(--pine-font-weight-medium);letter-spacing:var(--pine-letter-spacing-heading-6)}:host(.pds-chip--lg.pds-chip--dropdown){padding:var(--pine-dimension-none)}:host(.pds-chip--lg.pds-chip--dropdown) .pds-chip__button{padding:var(--pine-dimension-025) var(--pine-dimension-150)}:host(.pds-chip--brand){background:-webkit-gradient(linear, left top, right top, from(#FF3E14), to(#6B62F2));background:linear-gradient(90deg, #FF3E14 0%, #6B62F2 100%);border:0;padding:1px;position:relative}:host(.pds-chip--brand) .pds-chip__label{background:rgba(255, 255, 255, 0.9);border-radius:calc(var(--pine-dimension-sm) - 1px);color:var(--pine-color-grey-900);font-weight:var(--pine-font-weight-medium);padding:var(--pine-dimension-025) var(--pine-dimension-100);position:relative;z-index:var(--pine-z-index-raised)}:host(.pds-chip--brand) .pds-chip__label pds-icon{-webkit-margin-end:var(--pine-dimension-2xs);margin-inline-end:var(--pine-dimension-2xs)}:host(.pds-chip--brand) .pds-chip__button,:host(.pds-chip--brand) .pds-chip__close{color:var(--pine-color-grey-900);font-weight:var(--pine-font-weight-medium);position:relative;z-index:var(--pine-z-index-raised)}:host(.pds-chip--brand) .pds-chip__button pds-icon:first-child{-webkit-margin-end:var(--pine-dimension-2xs);margin-inline-end:var(--pine-dimension-2xs)}:host(.pds-chip--brand) .pds-chip__close:hover{background:rgba(255, 255, 255, 0.8)}"}},[257,"pds-chip",{componentId:[1,"component-id"],dot:[4],icon:[1],large:[4],size:[1],sentiment:[1],variant:[1],removeUrl:[1,"remove-url"],removeHttpMethod:[1,"remove-http-method"],removeTarget:[1,"remove-target"],dismissLabel:[1,"dismiss-label"]}]);function d(){"undefined"!=typeof customElements&&["pds-chip","pds-icon"].forEach((i=>{switch(i){case"pds-chip":customElements.get(p(i))||customElements.define(p(i),a);break;case"pds-icon":customElements.get(p(i))||t()}}))}export{a as P,d}
|
package/components/pds-link2.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as o,HTMLElement as
|
|
1
|
+
import{proxyCustomElement as o,HTMLElement as i,h as t,transformTag as e}from"@stencil/core/internal/client";import{s as r}from"./utils.js";import{l as n}from"./index2.js";import{d as s}from"./pds-icon2.js";const a=o(class extends i{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.active=!1,this.external=!1,this.variant="inline",this.fontSize="lg"}classNames(){const o=["pds-link"];return this.fontSize&&o.push("pds-link--"+this.fontSize),this.variant&&o.push("pds-link--"+this.variant),o.join(" ")}setLinkStyles(){if(this.color)return r(this.color,{secondary:"var(--pine-color-text-primary)",accent:"var(--pine-color-accent)",danger:"var(--pine-color-danger)"})}render(){const o=this.target||(this.external?"_blank":void 0),i=this.external,e="_blank"===o?"noopener noreferrer":void 0;return t("a",{key:"5d0c5a0a5b8b80a8cdff802a3d78dad85a9ccdc4",class:this.classNames(),download:this.download,href:this.href,id:this.componentId,part:"link","aria-current":this.active?"page":void 0,target:o,rel:e,style:this.setLinkStyles(),"data-turbo":this.turbo||void 0,"data-turbo-frame":this.turboFrame||void 0,"data-turbo-action":this.turboAction||void 0,"data-turbo-method":this.turboMethod||void 0,"data-turbo-confirm":this.turboConfirm||void 0,"data-turbo-stream":this.turboStream||void 0,"data-turbo-prefetch":this.turboPrefetch||void 0,"data-turbo-preload":this.turboPreload||void 0},t("slot",{key:"06b7be14d867eae1b7acba8570f1e94bdf840fbb"},this.href),i&&t("pds-icon",{key:"678414f7d20fd20b6931cc401163180c3ad0094c",icon:n,size:this.fontSize}))}static get style(){return":host{display:inline}:host pds-icon{-webkit-margin-start:var(--pine-dimension-2xs);margin-inline-start:var(--pine-dimension-2xs)}.pds-link{-ms-flex-align:center;align-items:center;color:var(--color, var(--pds-context-link-color, var(--pine-color-text)));display:-ms-inline-flexbox;display:inline-flex;font-weight:var(--pine-font-weight-medium)}.pds-link:focus-visible{border-radius:var(--pine-dimension-2xs);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width-thick);position:relative}.pds-link:hover{color:var(--color, var(--pds-context-link-color-hover, var(--pine-color-text-hover)));text-decoration:none}:host([color=secondary]) .pds-link{color:var(--pine-color-text-primary)}:host([color=secondary]) .pds-link:hover{color:var(--pine-color-text-inverse-secondary)}:host([color=accent]) .pds-link{color:var(--pine-color-accent)}:host([color=accent]) .pds-link:hover{color:var(--pine-color-accent-hover)}:host([color=danger]) .pds-link{color:var(--pine-color-danger)}:host([color=danger]) .pds-link:hover{color:var(--pine-color-danger-hover)}.pds-link--sm{font-size:var(--pine-font-size-body-xs)}.pds-link--sm pds-icon{height:var(--pine-dimension-xs);width:var(--pine-dimension-xs)}.pds-link--md{font-size:var(--pine-font-size-body-sm)}.pds-link--md pds-icon{height:var(--pine-dimension-xs);width:var(--pine-dimension-xs)}.pds-link--lg{font-size:var(--pine-font-size-body-md)}.pds-link--lg pds-icon{height:var(--pine-dimension-sm);width:var(--pine-dimension-sm)}.pds-link--plain{text-decoration:none}.pds-link--plain:hover{color:var(--color, var(--pds-context-link-color-hover, var(--pine-color-text-hover)));text-decoration:underline}:host([active]) .pds-link{color:var(--pds-context-link-color, var(--pine-color-text-strong));text-decoration:underline}:host([active]) .pds-link:hover{color:var(--pds-context-link-color-hover, var(--pine-color-text-strong));text-decoration:underline}"}},[257,"pds-link",{active:[516],color:[1],download:[1],componentId:[1,"component-id"],external:[4],target:[1],variant:[1],fontSize:[1,"font-size"],href:[1],turbo:[1],turboFrame:[1,"turbo-frame"],turboAction:[1,"turbo-action"],turboMethod:[1,"turbo-method"],turboConfirm:[1,"turbo-confirm"],turboStream:[1,"turbo-stream"],turboPrefetch:[1,"turbo-prefetch"],turboPreload:[1,"turbo-preload"]}]);function d(){"undefined"!=typeof customElements&&["pds-link","pds-icon"].forEach((o=>{switch(o){case"pds-link":customElements.get(e(o))||customElements.define(e(o),a);break;case"pds-icon":customElements.get(e(o))||s()}}))}export{a as P,d}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as e,HTMLElement as i,createEvent as t,h as s,Host as o,transformTag as n}from"@stencil/core/internal/client";import{a as l,c as r,o as a,f as d,s as p,b as c}from"./floating-ui.dom.js";import{d as h}from"./utils.js";import{i as m,a as u,m as b}from"./form.js";import{g,h as v}from"./index2.js";import{d as _}from"./pds-box2.js";import{d as x}from"./pds-checkbox2.js";import{d as f}from"./pds-chip2.js";import{d as w}from"./pds-icon2.js";import{d as y}from"./pds-loader2.js";import{d as k}from"./pds-text2.js";const O=e(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.pdsMultiselectChange=t(this,"pdsMultiselectChange",7),this.pdsMultiselectSearch=t(this,"pdsMultiselectSearch",7),this.pdsMultiselectLoadOptions=t(this,"pdsMultiselectLoadOptions",7),this.pdsMultiselectCreate=t(this,"pdsMultiselectCreate",7),this.pdsMultiselectDismiss=t(this,"pdsMultiselectDismiss",7),this.placeholder="Select...",this.searchPlaceholder="Find...",this.closePanelOnSelect=!1,this.value=[],this.disabled=!1,this.asyncMethod="GET",this.debounce=300,this.fetchTimeout=3e4,this.maxHeight="300px",this.triggerWidth="100%",this.minWidth="250px",this.hideLabel=!1,this.hideSelectedItems=!1,this.selectedDisplay="count",this.pillPosition="inline",this.maxInlinePills=3,this.required=!1,this.loading=!1,this.csrfHeaderName="X-CSRF-Token",this.isOpen=!1,this.searchQuery="",this.highlightedIndex=-1,this.internalOptions=[],this.selectedItems=[],this.currentPage=1,this.hasMore=!1,this.creating=!1,this.removalAnnouncement="",this.isOpening=!1,this.isClosingViaSelection=!1,this.initialAsyncFetchTriggered=!1,this.pendingUnresolvedFetch=!1,this.handleTriggerClick=e=>{if(!this.disabled){if(e&&"pill"===this.selectedDisplay&&"inline"===this.pillPosition&&e.composedPath().some((e=>{var i;return"pds-chip"===(null===(i=e.tagName)||void 0===i?void 0:i.toLowerCase())})))return;this.isOpen?this.closeDropdown():this.openDropdown()}},this.handleTriggerKeyDown=e=>{if(e.target===this.triggerEl)switch(e.key){case"ArrowDown":case"ArrowUp":case"Enter":case" ":e.preventDefault(),this.isOpen||this.openDropdown()}},this.handleSearchInputChange=e=>{this.searchQuery=e.target.value,this.highlightedIndex=-1,this.pdsMultiselectSearch.emit({query:this.searchQuery}),this.asyncUrl&&this.debouncedFetchAsyncOptions(this.searchQuery,1)},this.handleSearchInputKeyDown=e=>{var i,t,s;const o=this.getFilteredOptions();switch(e.key){case"ArrowDown":{e.preventDefault();let t=this.highlightedIndex+1;for(;t<o.length&&(null===(i=o[t])||void 0===i?void 0:i.disabled);)t++;t<o.length&&(this.highlightedIndex=t,this.scrollOptionIntoView());break}case"ArrowUp":{e.preventDefault();let i=Math.max(this.highlightedIndex-1,0);for(;i>0&&(null===(t=o[i])||void 0===t?void 0:t.disabled);)i--;(null===(s=o[i])||void 0===s?void 0:s.disabled)||(this.highlightedIndex=i,this.scrollOptionIntoView());break}case"Enter":if(e.preventDefault(),this.highlightedIndex>=0){const e=o[this.highlightedIndex];e&&this.selectOption(e)}break;case"Tab":this.closeDropdown()}},this.handleContainerFocusOut=()=>{setTimeout((()=>{var e;if(!this.isOpen||this.isOpening||this.isClosingViaSelection)return;const i=document.activeElement;(null===(e=this.el.shadowRoot)||void 0===e?void 0:e.contains(i))||i===this.el||(this.pdsMultiselectDismiss.emit(),this.closeDropdown())}),0)},this.handleOptionMouseDown=e=>i=>{i.preventDefault(),this.toggleOption(e)},this.handleOptionMouseEnter=(e,i)=>()=>{i.disabled||(this.highlightedIndex=e)},this.handleScroll=e=>{if(!this.asyncUrl||!this.hasMore||this.loading)return;const i=e.target;i.scrollHeight-i.scrollTop-i.clientHeight<50&&(this.pdsMultiselectLoadOptions.emit({query:this.searchQuery,page:this.currentPage+1}),this.debouncedFetchAsyncOptions(this.searchQuery,this.currentPage+1))},this.handlePillRemove=e=>()=>{var i,t;if(this.disabled)return;const s=e.id+"";this.value=this.value.filter((e=>e!==s)),this.syncSelectedItems(),this.pdsMultiselectChange.emit({values:this.value,items:this.selectedItems}),this.removalAnnouncement="",queueMicrotask((()=>{this.removalAnnouncement=e.text+" removed"})),this.isClosingViaSelection=!0,this.isOpen?null===(i=this.searchInputEl)||void 0===i||i.focus():null===(t=this.triggerEl)||void 0===t||t.focus(),setTimeout((()=>{this.isClosingViaSelection=!1}),0)}}connectedCallback(){this.el.attachInternals&&!this.internals&&(this.internals=this.el.attachInternals())}componentWillLoad(){this.originalSearchEmitter=this.pdsMultiselectSearch,this.syncSelectedItems()}componentDidLoad(){this.setupDebounce(),this.setupMutationObserver(),this.setupSlotChangeListener(),this.updateFormValue(),requestAnimationFrame((()=>{this.updateOptionsFromSlot(),this.syncSelectedItems()})),this.asyncUrl&&this.ensureValueArray().length>0&&(this.initialAsyncFetchTriggered=!0,this.fetchOptions("",1))}setupSlotChangeListener(){var e;const i=null===(e=this.el.shadowRoot)||void 0===e?void 0:e.querySelector("slot:not([name])");i&&(i.addEventListener("slotchange",(()=>{this.updateOptionsFromSlot(),this.syncSelectedItems()})),this.updateOptionsFromSlot())}disconnectedCallback(){var e,i;null===(e=this.observer)||void 0===e||e.disconnect(),null===(i=this.cleanupAutoUpdate)||void 0===i||i.call(this),this.clearAsyncFetchState()}setupDebounce(){const{pdsMultiselectSearch:e,debounce:i,originalSearchEmitter:t}=this;this.pdsMultiselectSearch=void 0===i?null!=t?t:e:h(e,i)}valueChanged(e){if("string"==typeof e)try{const i=JSON.parse(e);if(Array.isArray(i))return void(this.value=i)}catch(i){return void(this.value=e?[e]:[])}if(this.syncSelectedItems(),this.updateFormValue(),this.asyncUrl){const e=this.ensureValueArray();e.length>0&&this.selectedItems.length<e.length&&(this.loading?this.pendingUnresolvedFetch=!0:this.fetchOptions("",1))}}optionsChanged(){this.options&&(this.internalOptions=[...this.options])}internalOptionsChanged(){this.syncSelectedItems()}async setFocus(){var e;null===(e=this.triggerEl)||void 0===e||e.focus()}async clear(){const e=this.value.length>0||""!==this.searchQuery;this.value=[],this.searchQuery="",this.syncSelectedItems(),this.updateFormValue(),e&&this.pdsMultiselectChange.emit({values:[],items:[]})}handleWindowKeyDown(e){var i;this.isOpen&&"Escape"===e.key&&(e.preventDefault(),this.pdsMultiselectDismiss.emit(),this.closeDropdown(),null===(i=this.triggerEl)||void 0===i||i.focus())}setupMutationObserver(){this.observer=new MutationObserver((()=>{this.updateOptionsFromSlot()})),this.observer.observe(this.el,{childList:!0,subtree:!0})}updateOptionsFromSlot(){var e;const i=null===(e=this.el.shadowRoot)||void 0===e?void 0:e.querySelector("slot:not([name])");if(!i)return;const t=[];i.assignedElements({flatten:!0}).forEach((e=>{var i;if("OPTGROUP"===e.tagName){const i=e.label,s=e.disabled;e.querySelectorAll("option").forEach((e=>{var o;const n={id:e.value,text:(null===(o=e.textContent)||void 0===o?void 0:o.trim())||e.value,disabled:e.disabled||s||void 0};i&&(n.group=i),t.push(n)}))}else if("OPTION"===e.tagName){const s=e;t.push({id:s.value,text:(null===(i=s.textContent)||void 0===i?void 0:i.trim())||s.value,disabled:s.disabled||void 0})}})),t.length>0&&!this.asyncUrl&&!this.options&&(this.internalOptions=t)}clearAsyncFetchState(){var e;void 0!==this.fetchDebounceTimer&&(window.clearTimeout(this.fetchDebounceTimer),this.fetchDebounceTimer=void 0),void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),null===(e=this.abortController)||void 0===e||e.abort(),this.abortController=void 0}debouncedFetchAsyncOptions(e,i=1){var t;if(!this.asyncUrl)return;void 0!==this.fetchDebounceTimer&&window.clearTimeout(this.fetchDebounceTimer);const s=Math.max(0,null!==(t=this.debounce)&&void 0!==t?t:0);this.fetchDebounceTimer=window.setTimeout((()=>{this.fetchDebounceTimer=void 0,this.fetchOptions(e,i)}),s)}syncSelectedItems(){const e=this.ensureValueArray(),i=this.getAllOptions(),t=[],s=new Map(this.selectedItems.map((e=>[e.id+"",e])));e.forEach((e=>{const o=i.find((i=>i.id+""==e+""));o?t.push(o):s.has(e+"")&&t.push(s.get(e+""))})),this.selectedItems=t}ensureValueArray(){if("string"==typeof this.value)try{const e=JSON.parse(this.value);if(Array.isArray(e))return this.value=e,e}catch(e){const i=this.value;return this.value=i?[i]:[],this.value}return Array.isArray(this.value)?this.value:[]}getAllOptions(){return this.options||this.internalOptions}getFilteredOptions(){const e=this.getAllOptions(),i=this.searchQuery.toLowerCase(),t=e.filter((e=>!i||e.text.toLowerCase().includes(i)));return this.createUrl&&this.searchQuery.trim()&&0===t.length?[{id:"__create__",text:this.searchQuery.trim(),isCreateOption:!0}]:t}updateFormValue(){var e;if(!m()&&(null===(e=this.internals)||void 0===e?void 0:e.setFormValue)){const e=this.ensureValueArray(),i=new FormData;e.forEach((e=>{this.name&&i.append(this.name,e)})),this.internals.setFormValue(i),this.required&&0===e.length?this.internals.setValidity({valueMissing:!0},"Please select at least one option.",this.triggerEl):this.internals.setValidity({})}}getCsrfToken(){if(this.csrfToken)return this.csrfToken;const e=document.querySelector('meta[name="csrf-token"]');return(null==e?void 0:e.content)||null}async fetchOptions(e,i=1){var t;if(this.asyncUrl){null===(t=this.abortController)||void 0===t||t.abort(),void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),this.abortController=new AbortController,this.loading=!0,this.fetchTimeoutTimer=window.setTimeout((()=>{var e;null===(e=this.abortController)||void 0===e||e.abort(),this.fetchTimeoutTimer=void 0}),this.fetchTimeout);try{let t;try{t=new URL(this.asyncUrl,window.location.origin)}catch(e){throw new TypeError("Invalid asyncUrl: "+this.asyncUrl)}"GET"===this.asyncMethod&&(t.searchParams.set("search",e),t.searchParams.set("page",i+""));const s=this.getCsrfToken(),o={"Content-Type":"application/json",Accept:"application/json"};s&&(o[this.csrfHeaderName||"X-CSRF-Token"]=s);const n=await fetch(""+t,Object.assign({method:this.asyncMethod,signal:this.abortController.signal,headers:o},"POST"===this.asyncMethod&&{body:JSON.stringify({search:e,page:i})}));if(void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),!n.ok)throw Error("Failed to fetch options");const l=await n.json(),r=l.results.map((e=>this.formatResult?this.formatResult(e):"object"==typeof e&&null!==e?Object.assign({id:e.id,text:e.text},e):{id:e+"",text:e+""}));this.internalOptions=1===i?r:[...this.internalOptions,...r],this.hasMore=!!l.totalCount&&this.internalOptions.length<l.totalCount,this.currentPage=i}catch(e){void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),"AbortError"!==e.name&&console.error("PdsMultiselect: Failed to fetch options",e)}finally{if(this.loading=!1,this.pendingUnresolvedFetch){this.pendingUnresolvedFetch=!1;const e=this.ensureValueArray();e.length>0&&this.selectedItems.length<e.length&&this.fetchOptions("",1)}}}}async createOption(e){if(this.createUrl&&e.trim()&&!this.creating){this.creating=!0;try{const i=new URL(this.createUrl,window.location.origin),t=this.getCsrfToken(),s={"Content-Type":"application/json",Accept:"application/json"};t&&(s[this.csrfHeaderName||"X-CSRF-Token"]=t);const o=await fetch(""+i,{method:"POST",headers:s,body:JSON.stringify({text:e.trim()})});if(!o.ok)throw Error("Failed to create option");const n=await o.json(),l=Object.assign({id:n.id,text:n.text},n);this.internalOptions=[...this.internalOptions,l],this.value=[...this.value,l.id+""],this.syncSelectedItems(),this.pdsMultiselectCreate.emit({query:e.trim(),newOption:l}),this.pdsMultiselectChange.emit({values:this.value,items:this.selectedItems}),this.searchQuery="",this.highlightedIndex=-1,requestAnimationFrame((()=>{var e;null===(e=this.searchInputEl)||void 0===e||e.focus()}))}catch(e){console.error("PdsMultiselect: Failed to create option",e)}finally{this.creating=!1}}}openDropdown(){this.disabled||(this.isOpening=!0,this.isOpen=!0,this.highlightedIndex=-1,this.asyncUrl&&0===this.internalOptions.length&&!this.initialAsyncFetchTriggered&&this.debouncedFetchAsyncOptions(this.searchQuery,1),this.initialAsyncFetchTriggered=!1,requestAnimationFrame((()=>{var e;this.positionDropdown(),null===(e=this.searchInputEl)||void 0===e||e.focus(),setTimeout((()=>{this.isOpening=!1}),50)})))}closeDropdown(){this.isOpen=!1,this.highlightedIndex=-1,this.searchQuery="",this.isClosingViaSelection&&setTimeout((()=>{this.isClosingViaSelection=!1}),0),this.cleanupAutoUpdate&&(this.cleanupAutoUpdate(),this.cleanupAutoUpdate=void 0)}positionDropdown(){if(!this.containerEl||!this.panelEl)return;const e=this.pillInlineTriggerEl||this.triggerEl||this.containerEl,{minWidth:i,panelWidth:t}=this,s=()=>{r(e,this.panelEl,{placement:"bottom-start",strategy:"absolute",middleware:[a(12),d(),p({padding:8}),c({apply:({rects:e,elements:s})=>{Object.assign(s.floating.style,{width:null!=t?t:e.reference.width+"px",minWidth:i})}})]}).then((({x:e,y:i})=>{this.panelEl&&(this.panelEl.style.left=e+"px",this.panelEl.style.top=i+"px")}))};s();const o=l(e,this.panelEl,s);this.cleanupAutoUpdate=()=>{o(),this.clearAsyncFetchState()}}scrollOptionIntoView(){requestAnimationFrame((()=>{var e;const i=null===(e=this.listboxEl)||void 0===e?void 0:e.querySelector(`[data-index="${this.highlightedIndex}"]`);null==i||i.scrollIntoView({block:"nearest",behavior:"smooth"})}))}toggleOption(e){var i,t;if(e.disabled)return;if(e.isCreateOption)return void(this.creating||this.createOption(this.searchQuery));const s=e.id+"";if(this.value.includes(s))this.value=this.value.filter((e=>e!==s));else{if(this.maxSelections&&this.value.length>=this.maxSelections)return;this.value=[...this.value,s]}this.syncSelectedItems(),this.pdsMultiselectChange.emit({values:this.value,items:this.selectedItems}),this.closePanelOnSelect?(this.isClosingViaSelection=!0,this.closeDropdown(),null===(i=this.triggerEl)||void 0===i||i.focus()):null===(t=this.searchInputEl)||void 0===t||t.focus()}selectOption(e){this.toggleOption(e)}getGroupedRenderItems(e){const i=[];let t=null;return e.forEach(((e,s)=>{const o=e.group;void 0!==o?(t&&t.group===o||(t={type:"group",group:o,options:[]},i.push(t)),t.options.push({option:e,index:s})):(t=null,i.push({type:"option",option:e,index:s}))})),i}renderOption(e,i,t){const o=t.includes(e.id+""),n=e.isCreateOption,l=e.disabled,r=n&&this.creating;return s("li",{key:e.id+"",id:`${this.componentId}-option-${i}`,class:{"pds-multiselect__option":!0,"pds-multiselect__option--highlighted":i===this.highlightedIndex&&!n,"pds-multiselect__option--selected":o,"pds-multiselect__option--create":n,"pds-multiselect__option--disabled":l||r},role:"option","aria-selected":o?"true":"false","aria-disabled":l||r?"true":void 0,"aria-label":n?"Create new tag: "+e.text:void 0,"data-index":i,onMouseDown:this.handleOptionMouseDown(e),onMouseEnter:this.handleOptionMouseEnter(i,e)},n?s("pds-box",{class:"pds-multiselect__create-option","align-items":"center",gap:"xs"},s("pds-icon",{name:"add",size:"small"}),s("pds-text",null,'Add "',e.text,'"')):s("pds-checkbox",{componentId:`${this.componentId}-checkbox-${i}`,checked:o,label:e.text,disabled:l,style:{pointerEvents:"none"}}))}renderSelectedItemsList(){return this.hideSelectedItems||0===this.selectedItems.length?null:s("div",{class:"pds-multiselect__selected-section"},s("ul",{class:"pds-multiselect__selected-list",role:"list"},this.selectedItems.map((e=>s("li",{key:e.id+"",class:"pds-multiselect__selected-item"},e.text)))))}renderDropdown(){if(!this.isOpen)return null;const e=this.getFilteredOptions(),i=this.ensureValueArray(),t=!!this.el.querySelector('[slot="empty"]'),o=!!this.el.querySelector('[slot="loading"]');return s("div",{class:"pds-multiselect__panel",ref:e=>this.panelEl=e,style:{minWidth:this.minWidth}},s("div",{class:"pds-multiselect__search"},s("pds-icon",{name:"search",size:"small"}),s("input",{ref:e=>this.searchInputEl=e,type:"text",class:"pds-multiselect__search-input",placeholder:this.searchPlaceholder,value:this.searchQuery,"aria-label":"Search options","aria-controls":this.componentId+"-listbox","aria-activedescendant":this.highlightedIndex>=0?`${this.componentId}-option-${this.highlightedIndex}`:void 0,role:"combobox","aria-haspopup":"listbox","aria-expanded":"true","aria-autocomplete":"list",autocomplete:"off",onInput:this.handleSearchInputChange,onKeyDown:this.handleSearchInputKeyDown})),this.renderSelectedItemsList(),s("ul",{class:"pds-multiselect__listbox",role:"listbox","aria-multiselectable":"true","aria-label":this.label||"Options",id:this.componentId+"-listbox",ref:e=>this.listboxEl=e,style:{maxHeight:this.maxHeight},onScroll:this.handleScroll},this.loading&&s("li",{class:"pds-multiselect__loading",role:"presentation"},o?s("slot",{name:"loading"}):s("pds-loader",{size:"small"})),!this.loading&&0===e.length&&s("li",{class:"pds-multiselect__empty",role:"presentation"},t?s("slot",{name:"empty"}):s("span",null,"No options found")),this.getGroupedRenderItems(e).map(((e,t)=>"group"===e.type?s("li",{key:"group-"+t,role:"group","aria-label":e.group,class:"pds-multiselect__group"},s("span",{class:"pds-multiselect__group-header","aria-hidden":"true"},e.group),s("ul",{class:"pds-multiselect__group-list",role:"presentation"},e.options.map((({option:e,index:t})=>this.renderOption(e,t,i))))):this.renderOption(e.option,e.index,i))),this.hasMore&&!this.loading&&s("li",{class:"pds-multiselect__load-more",role:"presentation"},s("pds-loader",{size:"small"}))))}renderInlinePills(){if(!(this.selectedItems.length>0))return s("span",{class:"pds-multiselect__trigger-text pds-multiselect__trigger-text--placeholder"},this.placeholder||"Select...");const e=this.disabled?"text":"tag",i=this.selectedItems.slice(0,Math.max(1,this.maxInlinePills)),t=this.selectedItems.length-i.length;return s("div",{class:"pds-multiselect__pill-list pds-multiselect__pill-list--inline","aria-label":"Selected items"},i.map((i=>s("pds-chip",{key:i.id+"","component-id":`${this.componentId}-pill-${i.id}`,variant:e,size:"sm",sentiment:"neutral",onPdsTagCloseClick:this.handlePillRemove(i)},i.text))),t>0&&s("span",{class:"pds-multiselect__pill-overflow"},"+",t))}renderBelowPills(){if(0===this.selectedItems.length)return null;const e=this.disabled?"text":"tag";return s("div",{class:"pds-multiselect__pill-list pds-multiselect__pill-list--below","aria-label":"Selected items"},this.selectedItems.map((i=>s("pds-chip",{key:i.id+"","component-id":`${this.componentId}-pill-${i.id}`,variant:e,size:"md",sentiment:"neutral",onPdsTagCloseClick:this.handlePillRemove(i)},i.text))))}getTriggerText(){const e=this.selectedItems.length;return 0===e||"pill"===this.selectedDisplay&&"below"===this.pillPosition?this.placeholder||"Select...":`${e} item${1===e?"":"s"}`}render(){const e=this.selectedItems.length>0;return s(o,{key:"086b6d2d199b35110e64ba1da3c12f1a81360581","aria-disabled":this.disabled?"true":null},s("div",{key:"c2faf217a97de056a9111a78e7077025e4ab5ee1",class:"pds-multiselect",onFocusout:this.handleContainerFocusOut},this.label&&s("label",{key:"0aff86a3a0054aef256bac5c0204dd914a9bd3ae",id:this.componentId+"-label",htmlFor:this.componentId,class:{"pds-multiselect__label":!0,"visually-hidden":this.hideLabel}},this.label),s("div",{key:"3b92119871dc32bb3c9a559be816bdece2fc30a6",class:"pds-multiselect__wrapper",ref:e=>this.containerEl=e,style:{width:this.triggerWidth}},"pill"===this.selectedDisplay&&"inline"===this.pillPosition?s("div",{ref:e=>this.pillInlineTriggerEl=e||void 0,part:"trigger",class:{"pds-multiselect__trigger":!0,"pds-multiselect__trigger--open":this.isOpen,"pds-multiselect__trigger--disabled":this.disabled,"pds-multiselect__trigger--invalid":this.invalid||!!this.errorMessage,"pds-multiselect__trigger--has-value":e,"pds-multiselect__trigger--pill-inline":!0},onClick:this.handleTriggerClick},this.renderInlinePills(),s("button",{ref:e=>this.triggerEl=e,type:"button",id:this.componentId,part:"pill-toggle",class:"pds-multiselect__pill-toggle",disabled:this.disabled,"aria-expanded":this.isOpen?"true":"false","aria-haspopup":"listbox","aria-labelledby":this.label?this.componentId+"-label":void 0,"aria-required":this.required?"true":void 0,"aria-describedby":u(this.componentId,this.invalid||!!this.errorMessage,this.errorMessage||this.helperMessage),"aria-invalid":this.invalid||this.errorMessage?"true":void 0,onKeyDown:this.handleTriggerKeyDown},s("pds-icon",{class:"pds-multiselect__icon",icon:g}))):s("button",{ref:e=>this.triggerEl=e,type:"button",part:"trigger",class:{"pds-multiselect__trigger":!0,"pds-multiselect__trigger--open":this.isOpen,"pds-multiselect__trigger--disabled":this.disabled,"pds-multiselect__trigger--invalid":this.invalid||!!this.errorMessage,"pds-multiselect__trigger--has-value":e},id:this.componentId,disabled:this.disabled,"aria-required":this.required?"true":void 0,"aria-expanded":this.isOpen?"true":"false","aria-haspopup":"listbox","aria-describedby":u(this.componentId,this.invalid||!!this.errorMessage,this.errorMessage||this.helperMessage),"aria-invalid":this.invalid||this.errorMessage?"true":void 0,onClick:this.handleTriggerClick,onKeyDown:this.handleTriggerKeyDown},s("span",{class:{"pds-multiselect__trigger-text":!0,"pds-multiselect__trigger-text--placeholder":!e||"pill"===this.selectedDisplay&&"below"===this.pillPosition}},this.getTriggerText()),s("pds-icon",{class:"pds-multiselect__icon",icon:g})),this.renderDropdown()),"pill"===this.selectedDisplay&&"below"===this.pillPosition&&this.renderBelowPills(),s("span",{key:"07d6a6bf9ccc2fe8bfcf9502a1cd4b7abf5c5e6f",class:"visually-hidden","aria-live":"polite","aria-atomic":"true"},this.removalAnnouncement),this.helperMessage&&!(this.errorMessage&&this.errorMessage.length>0)&&s("p",{key:"a94bb6f31805d31ec3cd5b5f2ca8b1984f4d41d1",class:"pds-multiselect__helper",id:b(this.componentId,"helper")},this.helperMessage),this.errorMessage&&s("p",{key:"15afc6b9313e1fe22bd56b00eee1ebcf9e085c2e",class:"pds-multiselect__error",id:b(this.componentId,"error")},s("pds-icon",{key:"452814577b14ca8f891b101903bd1a7a7e5d8bb1",icon:v,size:"small"}),this.errorMessage),s("div",{key:"d8ce787886e666303759cd2654c78b44269a40ff",style:{display:"none"}},s("slot",{key:"8295376fb03b23d44c5baeca9bc967514e433e0f"}))))}static get formAssociated(){return!0}get el(){return this}static get watchers(){return{debounce:[{setupDebounce:0}],value:[{valueChanged:0}],options:[{optionsChanged:0}],internalOptions:[{internalOptionsChanged:0}]}}static get style(){return":host{display:block}:host([aria-disabled=true]) .pds-multiselect__trigger{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}:host([aria-disabled=true]) .pds-multiselect__icon{color:var(--pine-color-text-disabled)}.pds-multiselect{position:relative}.pds-multiselect__label{color:var(--pine-color-text-label);display:block;font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-multiselect__wrapper{position:relative}.pds-multiselect__trigger{-ms-flex-align:center;align-items:center;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-125);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-medium);gap:var(--pine-dimension-xs);-ms-flex-pack:justify;justify-content:space-between;letter-spacing:var(--pine-letter-spacing);min-height:var(--pine-dimension-450);padding:var(--pine-dimension-xs) var(--pine-dimension-sm);position:relative;text-align:start;-webkit-transition:border-color var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, box-shadow var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;width:100%}.pds-multiselect__trigger:hover:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-hover)}.pds-multiselect__trigger:focus:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-multiselect__trigger.pds-multiselect__trigger--open{border-color:var(--pine-color-border-active)}.pds-multiselect__trigger.pds-multiselect__trigger--invalid{background-color:var(--pine-color-red-050);border-color:var(--pine-color-border-danger)}.pds-multiselect__trigger.pds-multiselect__trigger--invalid:focus{outline-color:var(--pine-color-focus-ring-danger)}.pds-multiselect__trigger.pds-multiselect__trigger--disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}.pds-multiselect__trigger-text{color:var(--pine-color-text-strong);-ms-flex:1;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-multiselect__trigger-text.pds-multiselect__trigger-text--placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__trigger--disabled .pds-multiselect__trigger-text{color:var(--pine-color-text-disabled)}.pds-multiselect__icon{color:var(--pine-color-icon);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__pill-list{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-2xs)}.pds-multiselect__pill-list--inline{-ms-flex:1;flex:1;min-width:0}.pds-multiselect__pill-list--below{-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-multiselect__pill-overflow{color:var(--pine-color-text-muted);font:var(--pine-typography-body-sm-medium);white-space:nowrap}.pds-multiselect__trigger--pill-inline{-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-2xs);min-height:var(--pine-dimension-450);padding:var(--pine-dimension-2xs) var(--pine-dimension-sm)}.pds-multiselect__trigger--pill-inline.pds-multiselect__trigger--open{border-color:var(--pine-color-border-active)}.pds-multiselect__trigger--pill-inline:focus-within:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-multiselect__trigger--pill-inline.pds-multiselect__trigger--invalid:focus-within{outline-color:var(--pine-color-focus-ring-danger)}.pds-multiselect__pill-toggle{-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border-width:0;cursor:pointer;display:-ms-flexbox;display:flex;padding:0}.pds-multiselect__pill-toggle:focus{outline:3px solid transparent}.pds-multiselect__trigger--disabled .pds-multiselect__pill-toggle{cursor:not-allowed;pointer-events:none}.pds-multiselect__panel{background:var(--pine-color-background-overlay);border-radius:var(--pine-dimension-125);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;position:absolute;z-index:var(--pine-z-index-raised)}.pds-multiselect__search{-ms-flex-align:center;align-items:center;-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-subtle);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-multiselect__search pds-icon{color:var(--pine-color-text-muted);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__search-input{background:transparent;border:var(--pine-dimension-none);color:var(--pine-color-text-strong);-ms-flex:1;flex:1;font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);min-width:var(--pine-dimension-none);outline:none}.pds-multiselect__search-input::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__selected-section{-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-subtle);padding:var(--pine-dimension-xs)}.pds-multiselect__selected-list{list-style:none;margin:var(--pine-dimension-none);padding:var(--pine-dimension-none)}.pds-multiselect__selected-item{color:var(--pine-color-text-strong);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);overflow:hidden;padding:var(--pine-dimension-2xs) var(--pine-dimension-xs);text-overflow:ellipsis;white-space:nowrap}.pds-multiselect__listbox{background:transparent;border:var(--pine-dimension-none);-webkit-box-sizing:border-box;box-sizing:border-box;list-style:none;margin:var(--pine-dimension-none);overflow-y:auto;padding:var(--pine-dimension-xs)}.pds-multiselect__group-header{color:var(--pine-color-text-muted);display:block;font:var(--pine-typography-body-sm-medium);letter-spacing:var(--pine-letter-spacing);padding:var(--pine-dimension-sm) var(--pine-dimension-xs) var(--pine-dimension-2xs);text-transform:uppercase}.pds-multiselect__listbox>li:first-child>.pds-multiselect__group-header{-webkit-padding-before:var(--pine-dimension-xs);padding-block-start:var(--pine-dimension-xs)}.pds-multiselect__group-list{list-style:none;margin:var(--pine-dimension-none);padding:var(--pine-dimension-none)}.pds-multiselect__option{-ms-flex-align:center;align-items:center;background:transparent;border-radius:var(--pine-dimension-xs);cursor:pointer;display:-ms-flexbox;display:flex;padding:var(--pine-dimension-2xs) var(--pine-dimension-xs);-webkit-transition:background 0.15s;transition:background 0.15s}.pds-multiselect__option pds-checkbox{pointer-events:none;width:100%}.pds-multiselect__option:hover:not(.pds-multiselect__option--disabled),.pds-multiselect__option.pds-multiselect__option--highlighted:not(.pds-multiselect__option--disabled){background:var(--pine-color-background-muted)}.pds-multiselect__option.pds-multiselect__option--disabled{cursor:not-allowed;opacity:0.5}.pds-multiselect__option:focus-visible{outline:var(--pine-dimension-none)}.pds-multiselect__create-option{color:var(--pine-color-text-strong);width:100%}.pds-multiselect__create-option pds-icon{color:var(--pine-color-text-muted);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__empty,.pds-multiselect__loading{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-muted);display:-ms-flexbox;display:flex;font:var(--pine-typography-body);-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-sm)}.pds-multiselect__load-more{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-xs)}.pds-multiselect__helper{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs);-webkit-margin-start:var(--pine-dimension-none);margin-inline-start:var(--pine-dimension-none)}.pds-multiselect__error{-ms-flex-align:start;align-items:flex-start;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;font:var(--pine-typography-body-sm);gap:var(--pine-dimension-2xs);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs);-webkit-margin-start:var(--pine-dimension-none);margin-inline-start:var(--pine-dimension-none)}.pds-multiselect__error pds-icon{-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none);-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.visually-hidden{border:var(--pine-dimension-none);clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:var(--pine-dimension-none);position:absolute;white-space:nowrap;width:1px}"}},[321,"pds-multiselect",{componentId:[1,"component-id"],label:[1],placeholder:[1],searchPlaceholder:[1,"search-placeholder"],closePanelOnSelect:[4,"close-panel-on-select"],name:[1],value:[1040],disabled:[4],asyncUrl:[1,"async-url"],asyncMethod:[1,"async-method"],debounce:[2],fetchTimeout:[2,"fetch-timeout"],maxSelections:[2,"max-selections"],maxHeight:[1,"max-height"],triggerWidth:[1,"trigger-width"],minWidth:[1,"min-width"],panelWidth:[1,"panel-width"],hideLabel:[4,"hide-label"],hideSelectedItems:[4,"hide-selected-items"],selectedDisplay:[1,"selected-display"],pillPosition:[1,"pill-position"],maxInlinePills:[2,"max-inline-pills"],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],invalid:[4],required:[4],loading:[1028],options:[16],formatResult:[16],createUrl:[1,"create-url"],csrfToken:[1,"csrf-token"],csrfHeaderName:[1,"csrf-header-name"],isOpen:[32],searchQuery:[32],highlightedIndex:[32],internalOptions:[32],selectedItems:[32],currentPage:[32],hasMore:[32],creating:[32],removalAnnouncement:[32],setFocus:[64],clear:[64]},[[8,"keydown","handleWindowKeyDown"]],{debounce:[{setupDebounce:0}],value:[{valueChanged:0}],options:[{optionsChanged:0}],internalOptions:[{internalOptionsChanged:0}]}]),C=O,S=function(){"undefined"!=typeof customElements&&["pds-multiselect","pds-box","pds-checkbox","pds-chip","pds-icon","pds-loader","pds-text"].forEach((e=>{switch(e){case"pds-multiselect":customElements.get(n(e))||customElements.define(n(e),O);break;case"pds-box":customElements.get(n(e))||_();break;case"pds-checkbox":customElements.get(n(e))||x();break;case"pds-chip":customElements.get(n(e))||f();break;case"pds-icon":customElements.get(n(e))||w();break;case"pds-loader":customElements.get(n(e))||y();break;case"pds-text":customElements.get(n(e))||k()}}))};export{C as PdsMultiselect,S as defineCustomElement}
|
|
1
|
+
import{proxyCustomElement as e,HTMLElement as i,createEvent as t,h as s,Host as o,transformTag as n}from"@stencil/core/internal/client";import{a as l,c as r,o as a,f as d,s as c,b as p}from"./floating-ui.dom.js";import{d as h}from"./utils.js";import{i as m,a as u,m as b}from"./form.js";import{g as v,h as g}from"./index2.js";import{f as _,p as x}from"./i18n-format.js";import{d as f}from"./pds-box2.js";import{d as y}from"./pds-checkbox2.js";import{d as w}from"./pds-chip2.js";import{d as k}from"./pds-icon2.js";import{d as O}from"./pds-loader2.js";import{d as C}from"./pds-text2.js";const j=e(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.pdsMultiselectChange=t(this,"pdsMultiselectChange",7),this.pdsMultiselectSearch=t(this,"pdsMultiselectSearch",7),this.pdsMultiselectLoadOptions=t(this,"pdsMultiselectLoadOptions",7),this.pdsMultiselectCreate=t(this,"pdsMultiselectCreate",7),this.pdsMultiselectDismiss=t(this,"pdsMultiselectDismiss",7),this.placeholder="Select...",this.searchPlaceholder="Find...",this.searchOptionsLabel="Search options",this.selectedItemsLabel="Selected items",this.optionsLabel="Options",this.noOptionsFoundLabel="No options found",this.createOptionLabel='Add "{text}"',this.createOptionAriaLabel="Create new tag: {text}",this.itemRemovedLabel="{item} removed",this.pillRemoveLabel="Remove",this.selectedCountLabelOne="{count} item",this.selectedCountLabelOther="{count} items",this.closePanelOnSelect=!1,this.value=[],this.disabled=!1,this.asyncMethod="GET",this.debounce=300,this.fetchTimeout=3e4,this.maxHeight="300px",this.triggerWidth="100%",this.minWidth="250px",this.hideLabel=!1,this.hideSelectedItems=!1,this.selectedDisplay="count",this.pillPosition="inline",this.maxInlinePills=3,this.required=!1,this.loading=!1,this.csrfHeaderName="X-CSRF-Token",this.isOpen=!1,this.searchQuery="",this.highlightedIndex=-1,this.internalOptions=[],this.selectedItems=[],this.currentPage=1,this.hasMore=!1,this.creating=!1,this.removalAnnouncement="",this.isOpening=!1,this.isClosingViaSelection=!1,this.initialAsyncFetchTriggered=!1,this.pendingUnresolvedFetch=!1,this.handleTriggerClick=e=>{if(!this.disabled){if(e&&"pill"===this.selectedDisplay&&"inline"===this.pillPosition&&e.composedPath().some((e=>{var i;return"pds-chip"===(null===(i=e.tagName)||void 0===i?void 0:i.toLowerCase())})))return;this.isOpen?this.closeDropdown():this.openDropdown()}},this.handleTriggerKeyDown=e=>{if(e.target===this.triggerEl)switch(e.key){case"ArrowDown":case"ArrowUp":case"Enter":case" ":e.preventDefault(),this.isOpen||this.openDropdown()}},this.handleSearchInputChange=e=>{this.searchQuery=e.target.value,this.highlightedIndex=-1,this.pdsMultiselectSearch.emit({query:this.searchQuery}),this.asyncUrl&&this.debouncedFetchAsyncOptions(this.searchQuery,1)},this.handleSearchInputKeyDown=e=>{var i,t,s;const o=this.getFilteredOptions();switch(e.key){case"ArrowDown":{e.preventDefault();let t=this.highlightedIndex+1;for(;t<o.length&&(null===(i=o[t])||void 0===i?void 0:i.disabled);)t++;t<o.length&&(this.highlightedIndex=t,this.scrollOptionIntoView());break}case"ArrowUp":{e.preventDefault();let i=Math.max(this.highlightedIndex-1,0);for(;i>0&&(null===(t=o[i])||void 0===t?void 0:t.disabled);)i--;(null===(s=o[i])||void 0===s?void 0:s.disabled)||(this.highlightedIndex=i,this.scrollOptionIntoView());break}case"Enter":if(e.preventDefault(),this.highlightedIndex>=0){const e=o[this.highlightedIndex];e&&this.selectOption(e)}break;case"Tab":this.closeDropdown()}},this.handleContainerFocusOut=()=>{setTimeout((()=>{var e;if(!this.isOpen||this.isOpening||this.isClosingViaSelection)return;const i=document.activeElement;(null===(e=this.el.shadowRoot)||void 0===e?void 0:e.contains(i))||i===this.el||(this.pdsMultiselectDismiss.emit(),this.closeDropdown())}),0)},this.handleOptionMouseDown=e=>i=>{i.preventDefault(),this.toggleOption(e)},this.handleOptionMouseEnter=(e,i)=>()=>{i.disabled||(this.highlightedIndex=e)},this.handleScroll=e=>{if(!this.asyncUrl||!this.hasMore||this.loading)return;const i=e.target;i.scrollHeight-i.scrollTop-i.clientHeight<50&&(this.pdsMultiselectLoadOptions.emit({query:this.searchQuery,page:this.currentPage+1}),this.debouncedFetchAsyncOptions(this.searchQuery,this.currentPage+1))},this.handlePillRemove=e=>()=>{var i,t;if(this.disabled)return;const s=e.id+"";this.value=this.value.filter((e=>e!==s)),this.syncSelectedItems(),this.pdsMultiselectChange.emit({values:this.value,items:this.selectedItems}),this.removalAnnouncement="",queueMicrotask((()=>{this.removalAnnouncement=_(this.itemRemovedLabel,{item:e.text})})),this.isClosingViaSelection=!0,this.isOpen?null===(i=this.searchInputEl)||void 0===i||i.focus():null===(t=this.triggerEl)||void 0===t||t.focus(),setTimeout((()=>{this.isClosingViaSelection=!1}),0)}}connectedCallback(){this.el.attachInternals&&!this.internals&&(this.internals=this.el.attachInternals())}componentWillLoad(){this.originalSearchEmitter=this.pdsMultiselectSearch,this.syncSelectedItems()}componentDidLoad(){this.setupDebounce(),this.setupMutationObserver(),this.setupSlotChangeListener(),this.updateFormValue(),requestAnimationFrame((()=>{this.updateOptionsFromSlot(),this.syncSelectedItems()})),this.asyncUrl&&this.ensureValueArray().length>0&&(this.initialAsyncFetchTriggered=!0,this.fetchOptions("",1))}setupSlotChangeListener(){var e;const i=null===(e=this.el.shadowRoot)||void 0===e?void 0:e.querySelector("slot:not([name])");i&&(i.addEventListener("slotchange",(()=>{this.updateOptionsFromSlot(),this.syncSelectedItems()})),this.updateOptionsFromSlot())}disconnectedCallback(){var e,i;null===(e=this.observer)||void 0===e||e.disconnect(),null===(i=this.cleanupAutoUpdate)||void 0===i||i.call(this),this.clearAsyncFetchState()}setupDebounce(){const{pdsMultiselectSearch:e,debounce:i,originalSearchEmitter:t}=this;this.pdsMultiselectSearch=void 0===i?null!=t?t:e:h(e,i)}valueChanged(e){if("string"==typeof e)try{const i=JSON.parse(e);if(Array.isArray(i))return void(this.value=i)}catch(i){return void(this.value=e?[e]:[])}if(this.syncSelectedItems(),this.updateFormValue(),this.asyncUrl){const e=this.ensureValueArray();e.length>0&&this.selectedItems.length<e.length&&(this.loading?this.pendingUnresolvedFetch=!0:this.fetchOptions("",1))}}optionsChanged(){this.options&&(this.internalOptions=[...this.options])}internalOptionsChanged(){this.syncSelectedItems()}async setFocus(){var e;null===(e=this.triggerEl)||void 0===e||e.focus()}async clear(){const e=this.value.length>0||""!==this.searchQuery;this.value=[],this.searchQuery="",this.syncSelectedItems(),this.updateFormValue(),e&&this.pdsMultiselectChange.emit({values:[],items:[]})}handleWindowKeyDown(e){var i;this.isOpen&&"Escape"===e.key&&(e.preventDefault(),this.pdsMultiselectDismiss.emit(),this.closeDropdown(),null===(i=this.triggerEl)||void 0===i||i.focus())}setupMutationObserver(){this.observer=new MutationObserver((()=>{this.updateOptionsFromSlot()})),this.observer.observe(this.el,{childList:!0,subtree:!0})}updateOptionsFromSlot(){var e;const i=null===(e=this.el.shadowRoot)||void 0===e?void 0:e.querySelector("slot:not([name])");if(!i)return;const t=[];i.assignedElements({flatten:!0}).forEach((e=>{var i;if("OPTGROUP"===e.tagName){const i=e.label,s=e.disabled;e.querySelectorAll("option").forEach((e=>{var o;const n={id:e.value,text:(null===(o=e.textContent)||void 0===o?void 0:o.trim())||e.value,disabled:e.disabled||s||void 0};i&&(n.group=i),t.push(n)}))}else if("OPTION"===e.tagName){const s=e;t.push({id:s.value,text:(null===(i=s.textContent)||void 0===i?void 0:i.trim())||s.value,disabled:s.disabled||void 0})}})),t.length>0&&!this.asyncUrl&&!this.options&&(this.internalOptions=t)}clearAsyncFetchState(){var e;void 0!==this.fetchDebounceTimer&&(window.clearTimeout(this.fetchDebounceTimer),this.fetchDebounceTimer=void 0),void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),null===(e=this.abortController)||void 0===e||e.abort(),this.abortController=void 0}debouncedFetchAsyncOptions(e,i=1){var t;if(!this.asyncUrl)return;void 0!==this.fetchDebounceTimer&&window.clearTimeout(this.fetchDebounceTimer);const s=Math.max(0,null!==(t=this.debounce)&&void 0!==t?t:0);this.fetchDebounceTimer=window.setTimeout((()=>{this.fetchDebounceTimer=void 0,this.fetchOptions(e,i)}),s)}syncSelectedItems(){const e=this.ensureValueArray(),i=this.getAllOptions(),t=[],s=new Map(this.selectedItems.map((e=>[e.id+"",e])));e.forEach((e=>{const o=i.find((i=>i.id+""==e+""));o?t.push(o):s.has(e+"")&&t.push(s.get(e+""))})),this.selectedItems=t}ensureValueArray(){if("string"==typeof this.value)try{const e=JSON.parse(this.value);if(Array.isArray(e))return this.value=e,e}catch(e){const i=this.value;return this.value=i?[i]:[],this.value}return Array.isArray(this.value)?this.value:[]}getAllOptions(){return this.options||this.internalOptions}getFilteredOptions(){const e=this.getAllOptions(),i=this.searchQuery.toLowerCase(),t=e.filter((e=>!i||e.text.toLowerCase().includes(i)));return this.createUrl&&this.searchQuery.trim()&&0===t.length?[{id:"__create__",text:this.searchQuery.trim(),isCreateOption:!0}]:t}updateFormValue(){var e;if(!m()&&(null===(e=this.internals)||void 0===e?void 0:e.setFormValue)){const e=this.ensureValueArray(),i=new FormData;e.forEach((e=>{this.name&&i.append(this.name,e)})),this.internals.setFormValue(i),this.required&&0===e.length?this.internals.setValidity({valueMissing:!0},"Please select at least one option.",this.triggerEl):this.internals.setValidity({})}}getCsrfToken(){if(this.csrfToken)return this.csrfToken;const e=document.querySelector('meta[name="csrf-token"]');return(null==e?void 0:e.content)||null}async fetchOptions(e,i=1){var t;if(this.asyncUrl){null===(t=this.abortController)||void 0===t||t.abort(),void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),this.abortController=new AbortController,this.loading=!0,this.fetchTimeoutTimer=window.setTimeout((()=>{var e;null===(e=this.abortController)||void 0===e||e.abort(),this.fetchTimeoutTimer=void 0}),this.fetchTimeout);try{let t;try{t=new URL(this.asyncUrl,window.location.origin)}catch(e){throw new TypeError("Invalid asyncUrl: "+this.asyncUrl)}"GET"===this.asyncMethod&&(t.searchParams.set("search",e),t.searchParams.set("page",i+""));const s=this.getCsrfToken(),o={"Content-Type":"application/json",Accept:"application/json"};s&&(o[this.csrfHeaderName||"X-CSRF-Token"]=s);const n=await fetch(""+t,Object.assign({method:this.asyncMethod,signal:this.abortController.signal,headers:o},"POST"===this.asyncMethod&&{body:JSON.stringify({search:e,page:i})}));if(void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),!n.ok)throw Error("Failed to fetch options");const l=await n.json(),r=l.results.map((e=>this.formatResult?this.formatResult(e):"object"==typeof e&&null!==e?Object.assign({id:e.id,text:e.text},e):{id:e+"",text:e+""}));this.internalOptions=1===i?r:[...this.internalOptions,...r],this.hasMore=!!l.totalCount&&this.internalOptions.length<l.totalCount,this.currentPage=i}catch(e){void 0!==this.fetchTimeoutTimer&&(window.clearTimeout(this.fetchTimeoutTimer),this.fetchTimeoutTimer=void 0),"AbortError"!==e.name&&console.error("PdsMultiselect: Failed to fetch options",e)}finally{if(this.loading=!1,this.pendingUnresolvedFetch){this.pendingUnresolvedFetch=!1;const e=this.ensureValueArray();e.length>0&&this.selectedItems.length<e.length&&this.fetchOptions("",1)}}}}async createOption(e){if(this.createUrl&&e.trim()&&!this.creating){this.creating=!0;try{const i=new URL(this.createUrl,window.location.origin),t=this.getCsrfToken(),s={"Content-Type":"application/json",Accept:"application/json"};t&&(s[this.csrfHeaderName||"X-CSRF-Token"]=t);const o=await fetch(""+i,{method:"POST",headers:s,body:JSON.stringify({text:e.trim()})});if(!o.ok)throw Error("Failed to create option");const n=await o.json(),l=Object.assign({id:n.id,text:n.text},n);this.internalOptions=[...this.internalOptions,l],this.value=[...this.value,l.id+""],this.syncSelectedItems(),this.pdsMultiselectCreate.emit({query:e.trim(),newOption:l}),this.pdsMultiselectChange.emit({values:this.value,items:this.selectedItems}),this.searchQuery="",this.highlightedIndex=-1,requestAnimationFrame((()=>{var e;null===(e=this.searchInputEl)||void 0===e||e.focus()}))}catch(e){console.error("PdsMultiselect: Failed to create option",e)}finally{this.creating=!1}}}openDropdown(){this.disabled||(this.isOpening=!0,this.isOpen=!0,this.highlightedIndex=-1,this.asyncUrl&&0===this.internalOptions.length&&!this.initialAsyncFetchTriggered&&this.debouncedFetchAsyncOptions(this.searchQuery,1),this.initialAsyncFetchTriggered=!1,requestAnimationFrame((()=>{var e;this.positionDropdown(),null===(e=this.searchInputEl)||void 0===e||e.focus(),setTimeout((()=>{this.isOpening=!1}),50)})))}closeDropdown(){this.isOpen=!1,this.highlightedIndex=-1,this.searchQuery="",this.isClosingViaSelection&&setTimeout((()=>{this.isClosingViaSelection=!1}),0),this.cleanupAutoUpdate&&(this.cleanupAutoUpdate(),this.cleanupAutoUpdate=void 0)}positionDropdown(){if(!this.containerEl||!this.panelEl)return;const e=this.pillInlineTriggerEl||this.triggerEl||this.containerEl,{minWidth:i,panelWidth:t}=this,s=()=>{r(e,this.panelEl,{placement:"bottom-start",strategy:"absolute",middleware:[a(12),d(),c({padding:8}),p({apply:({rects:e,elements:s})=>{Object.assign(s.floating.style,{width:null!=t?t:e.reference.width+"px",minWidth:i})}})]}).then((({x:e,y:i})=>{this.panelEl&&(this.panelEl.style.left=e+"px",this.panelEl.style.top=i+"px")}))};s();const o=l(e,this.panelEl,s);this.cleanupAutoUpdate=()=>{o(),this.clearAsyncFetchState()}}scrollOptionIntoView(){requestAnimationFrame((()=>{var e;const i=null===(e=this.listboxEl)||void 0===e?void 0:e.querySelector(`[data-index="${this.highlightedIndex}"]`);null==i||i.scrollIntoView({block:"nearest",behavior:"smooth"})}))}toggleOption(e){var i,t;if(e.disabled)return;if(e.isCreateOption)return void(this.creating||this.createOption(this.searchQuery));const s=e.id+"";if(this.value.includes(s))this.value=this.value.filter((e=>e!==s));else{if(this.maxSelections&&this.value.length>=this.maxSelections)return;this.value=[...this.value,s]}this.syncSelectedItems(),this.pdsMultiselectChange.emit({values:this.value,items:this.selectedItems}),this.closePanelOnSelect?(this.isClosingViaSelection=!0,this.closeDropdown(),null===(i=this.triggerEl)||void 0===i||i.focus()):null===(t=this.searchInputEl)||void 0===t||t.focus()}selectOption(e){this.toggleOption(e)}getGroupedRenderItems(e){const i=[];let t=null;return e.forEach(((e,s)=>{const o=e.group;void 0!==o?(t&&t.group===o||(t={type:"group",group:o,options:[]},i.push(t)),t.options.push({option:e,index:s})):(t=null,i.push({type:"option",option:e,index:s}))})),i}renderOption(e,i,t){const o=t.includes(e.id+""),n=e.isCreateOption,l=e.disabled,r=n&&this.creating;return s("li",{key:e.id+"",id:`${this.componentId}-option-${i}`,class:{"pds-multiselect__option":!0,"pds-multiselect__option--highlighted":i===this.highlightedIndex&&!n,"pds-multiselect__option--selected":o,"pds-multiselect__option--create":n,"pds-multiselect__option--disabled":l||r},role:"option","aria-selected":o?"true":"false","aria-disabled":l||r?"true":void 0,"aria-label":n?_(this.createOptionAriaLabel,{text:e.text}):void 0,"data-index":i,onMouseDown:this.handleOptionMouseDown(e),onMouseEnter:this.handleOptionMouseEnter(i,e)},n?s("pds-box",{class:"pds-multiselect__create-option","align-items":"center",gap:"xs"},s("pds-icon",{name:"add",size:"small"}),s("pds-text",null,_(this.createOptionLabel,{text:e.text}))):s("pds-checkbox",{componentId:`${this.componentId}-checkbox-${i}`,checked:o,label:e.text,disabled:l,style:{pointerEvents:"none"}}))}renderSelectedItemsList(){return this.hideSelectedItems||0===this.selectedItems.length?null:s("div",{class:"pds-multiselect__selected-section"},s("ul",{class:"pds-multiselect__selected-list",role:"list"},this.selectedItems.map((e=>s("li",{key:e.id+"",class:"pds-multiselect__selected-item"},e.text)))))}renderDropdown(){if(!this.isOpen)return null;const e=this.getFilteredOptions(),i=this.ensureValueArray(),t=!!this.el.querySelector('[slot="empty"]'),o=!!this.el.querySelector('[slot="loading"]');return s("div",{class:"pds-multiselect__panel",ref:e=>this.panelEl=e,style:{minWidth:this.minWidth}},s("div",{class:"pds-multiselect__search"},s("pds-icon",{name:"search",size:"small"}),s("input",{ref:e=>this.searchInputEl=e,type:"text",class:"pds-multiselect__search-input",placeholder:this.searchPlaceholder,value:this.searchQuery,"aria-label":this.searchOptionsLabel,"aria-controls":this.componentId+"-listbox","aria-activedescendant":this.highlightedIndex>=0?`${this.componentId}-option-${this.highlightedIndex}`:void 0,role:"combobox","aria-haspopup":"listbox","aria-expanded":"true","aria-autocomplete":"list",autocomplete:"off",onInput:this.handleSearchInputChange,onKeyDown:this.handleSearchInputKeyDown})),this.renderSelectedItemsList(),s("ul",{class:"pds-multiselect__listbox",role:"listbox","aria-multiselectable":"true","aria-label":this.label||this.optionsLabel,id:this.componentId+"-listbox",ref:e=>this.listboxEl=e,style:{maxHeight:this.maxHeight},onScroll:this.handleScroll},this.loading&&s("li",{class:"pds-multiselect__loading",role:"presentation"},o?s("slot",{name:"loading"}):s("pds-loader",{size:"small"})),!this.loading&&0===e.length&&s("li",{class:"pds-multiselect__empty",role:"presentation"},t?s("slot",{name:"empty"}):s("span",null,this.noOptionsFoundLabel)),this.getGroupedRenderItems(e).map(((e,t)=>"group"===e.type?s("li",{key:"group-"+t,role:"group","aria-label":e.group,class:"pds-multiselect__group"},s("span",{class:"pds-multiselect__group-header","aria-hidden":"true"},e.group),s("ul",{class:"pds-multiselect__group-list",role:"presentation"},e.options.map((({option:e,index:t})=>this.renderOption(e,t,i))))):this.renderOption(e.option,e.index,i))),this.hasMore&&!this.loading&&s("li",{class:"pds-multiselect__load-more",role:"presentation"},s("pds-loader",{size:"small"}))))}renderInlinePills(){if(!(this.selectedItems.length>0))return s("span",{class:"pds-multiselect__trigger-text pds-multiselect__trigger-text--placeholder"},this.placeholder||"Select...");const e=this.disabled?"text":"tag",i=this.selectedItems.slice(0,Math.max(1,this.maxInlinePills)),t=this.selectedItems.length-i.length;return s("div",{class:"pds-multiselect__pill-list pds-multiselect__pill-list--inline","aria-label":this.selectedItemsLabel},i.map((i=>s("pds-chip",{key:i.id+"","component-id":`${this.componentId}-pill-${i.id}`,variant:e,size:"sm",sentiment:"neutral","dismiss-label":this.pillRemoveLabel,onPdsTagCloseClick:this.handlePillRemove(i)},i.text))),t>0&&s("span",{class:"pds-multiselect__pill-overflow"},"+",t))}renderBelowPills(){if(0===this.selectedItems.length)return null;const e=this.disabled?"text":"tag";return s("div",{class:"pds-multiselect__pill-list pds-multiselect__pill-list--below","aria-label":this.selectedItemsLabel},this.selectedItems.map((i=>s("pds-chip",{key:i.id+"","component-id":`${this.componentId}-pill-${i.id}`,variant:e,size:"md",sentiment:"neutral","dismiss-label":this.pillRemoveLabel,onPdsTagCloseClick:this.handlePillRemove(i)},i.text))))}getTriggerText(){const e=this.selectedItems.length;return 0===e||"pill"===this.selectedDisplay&&"below"===this.pillPosition?this.placeholder||"Select...":x(this.el,e,this.resolveCountForms())}resolveCountForms(){const e={one:this.selectedCountLabelOne,other:this.selectedCountLabelOther},i=this.selectedCountLabels;if(!i)return e;if("string"==typeof i)try{const t=JSON.parse(i);return t&&"object"==typeof t?Object.assign(Object.assign({},e),t):e}catch(i){return e}return Object.assign(Object.assign({},e),i)}render(){const e=this.selectedItems.length>0;return s(o,{key:"4a54a778522d0a1d2f45c32928e7a663f19c0189","aria-disabled":this.disabled?"true":null},s("div",{key:"3593eb4fa1a0ae575b1c0ed03f0763dcea04c9e6",class:"pds-multiselect",onFocusout:this.handleContainerFocusOut},this.label&&s("label",{key:"f91a680ae3c3021bac6bd99368d3ef6ad6438898",id:this.componentId+"-label",htmlFor:this.componentId,class:{"pds-multiselect__label":!0,"visually-hidden":this.hideLabel}},this.label),s("div",{key:"de2899f19057b8cd19cf3467251d03c1b43b73f5",class:"pds-multiselect__wrapper",ref:e=>this.containerEl=e,style:{width:this.triggerWidth}},"pill"===this.selectedDisplay&&"inline"===this.pillPosition?s("div",{ref:e=>this.pillInlineTriggerEl=e||void 0,part:"trigger",class:{"pds-multiselect__trigger":!0,"pds-multiselect__trigger--open":this.isOpen,"pds-multiselect__trigger--disabled":this.disabled,"pds-multiselect__trigger--invalid":this.invalid||!!this.errorMessage,"pds-multiselect__trigger--has-value":e,"pds-multiselect__trigger--pill-inline":!0},onClick:this.handleTriggerClick},this.renderInlinePills(),s("button",{ref:e=>this.triggerEl=e,type:"button",id:this.componentId,part:"pill-toggle",class:"pds-multiselect__pill-toggle",disabled:this.disabled,"aria-expanded":this.isOpen?"true":"false","aria-haspopup":"listbox","aria-labelledby":this.label?this.componentId+"-label":void 0,"aria-required":this.required?"true":void 0,"aria-describedby":u(this.componentId,this.invalid||!!this.errorMessage,this.errorMessage||this.helperMessage),"aria-invalid":this.invalid||this.errorMessage?"true":void 0,onKeyDown:this.handleTriggerKeyDown},s("pds-icon",{class:"pds-multiselect__icon",icon:v}))):s("button",{ref:e=>this.triggerEl=e,type:"button",part:"trigger",class:{"pds-multiselect__trigger":!0,"pds-multiselect__trigger--open":this.isOpen,"pds-multiselect__trigger--disabled":this.disabled,"pds-multiselect__trigger--invalid":this.invalid||!!this.errorMessage,"pds-multiselect__trigger--has-value":e},id:this.componentId,disabled:this.disabled,"aria-required":this.required?"true":void 0,"aria-expanded":this.isOpen?"true":"false","aria-haspopup":"listbox","aria-describedby":u(this.componentId,this.invalid||!!this.errorMessage,this.errorMessage||this.helperMessage),"aria-invalid":this.invalid||this.errorMessage?"true":void 0,onClick:this.handleTriggerClick,onKeyDown:this.handleTriggerKeyDown},s("span",{class:{"pds-multiselect__trigger-text":!0,"pds-multiselect__trigger-text--placeholder":!e||"pill"===this.selectedDisplay&&"below"===this.pillPosition}},this.getTriggerText()),s("pds-icon",{class:"pds-multiselect__icon",icon:v})),this.renderDropdown()),"pill"===this.selectedDisplay&&"below"===this.pillPosition&&this.renderBelowPills(),s("span",{key:"973443f9eb29dcf7fb1bde3f9101ac02967a8fd9",class:"visually-hidden","aria-live":"polite","aria-atomic":"true"},this.removalAnnouncement),this.helperMessage&&!(this.errorMessage&&this.errorMessage.length>0)&&s("p",{key:"568aab2b278abb7f4426d84ee926b4883375fb11",class:"pds-multiselect__helper",id:b(this.componentId,"helper")},this.helperMessage),this.errorMessage&&s("p",{key:"daddf192efd47df8c15267b9896913b926e02544",class:"pds-multiselect__error",id:b(this.componentId,"error")},s("pds-icon",{key:"d0c72ab75a8e02e61c09e980ae817790804a776a",icon:g,size:"small"}),this.errorMessage),s("div",{key:"0453db2fca10b3573b1dd244875f90c856c8887b",style:{display:"none"}},s("slot",{key:"a612741afc9545e5e50c47d27c3c27c1d7cade3c"}))))}static get formAssociated(){return!0}get el(){return this}static get watchers(){return{debounce:[{setupDebounce:0}],value:[{valueChanged:0}],options:[{optionsChanged:0}],internalOptions:[{internalOptionsChanged:0}]}}static get style(){return":host{display:block}:host([aria-disabled=true]) .pds-multiselect__trigger{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}:host([aria-disabled=true]) .pds-multiselect__icon{color:var(--pine-color-text-disabled)}.pds-multiselect{position:relative}.pds-multiselect__label{color:var(--pine-color-text-label);display:block;font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-multiselect__wrapper{position:relative}.pds-multiselect__trigger{-ms-flex-align:center;align-items:center;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-125);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-medium);gap:var(--pine-dimension-xs);-ms-flex-pack:justify;justify-content:space-between;letter-spacing:var(--pine-letter-spacing);min-height:var(--pine-dimension-450);padding:var(--pine-dimension-xs) var(--pine-dimension-sm);position:relative;text-align:start;-webkit-transition:border-color var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, box-shadow var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;width:100%}.pds-multiselect__trigger:hover:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-hover)}.pds-multiselect__trigger:focus:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-multiselect__trigger.pds-multiselect__trigger--open{border-color:var(--pine-color-border-active)}.pds-multiselect__trigger.pds-multiselect__trigger--invalid{background-color:var(--pine-color-red-050);border-color:var(--pine-color-border-danger)}.pds-multiselect__trigger.pds-multiselect__trigger--invalid:focus{outline-color:var(--pine-color-focus-ring-danger)}.pds-multiselect__trigger.pds-multiselect__trigger--disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}.pds-multiselect__trigger-text{color:var(--pine-color-text-strong);-ms-flex:1;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-multiselect__trigger-text.pds-multiselect__trigger-text--placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__trigger--disabled .pds-multiselect__trigger-text{color:var(--pine-color-text-disabled)}.pds-multiselect__icon{color:var(--pine-color-icon);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__pill-list{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-2xs)}.pds-multiselect__pill-list--inline{-ms-flex:1;flex:1;min-width:0}.pds-multiselect__pill-list--below{-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-multiselect__pill-overflow{color:var(--pine-color-text-muted);font:var(--pine-typography-body-sm-medium);white-space:nowrap}.pds-multiselect__trigger--pill-inline{-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-2xs);min-height:var(--pine-dimension-450);padding:var(--pine-dimension-2xs) var(--pine-dimension-sm)}.pds-multiselect__trigger--pill-inline.pds-multiselect__trigger--open{border-color:var(--pine-color-border-active)}.pds-multiselect__trigger--pill-inline:focus-within:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-multiselect__trigger--pill-inline.pds-multiselect__trigger--invalid:focus-within{outline-color:var(--pine-color-focus-ring-danger)}.pds-multiselect__pill-toggle{-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border-width:0;cursor:pointer;display:-ms-flexbox;display:flex;padding:0}.pds-multiselect__pill-toggle:focus{outline:3px solid transparent}.pds-multiselect__trigger--disabled .pds-multiselect__pill-toggle{cursor:not-allowed;pointer-events:none}.pds-multiselect__panel{background:var(--pine-color-background-overlay);border-radius:var(--pine-dimension-125);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;position:absolute;z-index:var(--pine-z-index-raised)}.pds-multiselect__search{-ms-flex-align:center;align-items:center;-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-subtle);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-multiselect__search pds-icon{color:var(--pine-color-text-muted);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__search-input{background:transparent;border:var(--pine-dimension-none);color:var(--pine-color-text-strong);-ms-flex:1;flex:1;font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);min-width:var(--pine-dimension-none);outline:none}.pds-multiselect__search-input::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__selected-section{-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-subtle);padding:var(--pine-dimension-xs)}.pds-multiselect__selected-list{list-style:none;margin:var(--pine-dimension-none);padding:var(--pine-dimension-none)}.pds-multiselect__selected-item{color:var(--pine-color-text-strong);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);overflow:hidden;padding:var(--pine-dimension-2xs) var(--pine-dimension-xs);text-overflow:ellipsis;white-space:nowrap}.pds-multiselect__listbox{background:transparent;border:var(--pine-dimension-none);-webkit-box-sizing:border-box;box-sizing:border-box;list-style:none;margin:var(--pine-dimension-none);overflow-y:auto;padding:var(--pine-dimension-xs)}.pds-multiselect__group-header{color:var(--pine-color-text-muted);display:block;font:var(--pine-typography-body-sm-medium);letter-spacing:var(--pine-letter-spacing);padding:var(--pine-dimension-sm) var(--pine-dimension-xs) var(--pine-dimension-2xs);text-transform:uppercase}.pds-multiselect__listbox>li:first-child>.pds-multiselect__group-header{-webkit-padding-before:var(--pine-dimension-xs);padding-block-start:var(--pine-dimension-xs)}.pds-multiselect__group-list{list-style:none;margin:var(--pine-dimension-none);padding:var(--pine-dimension-none)}.pds-multiselect__option{-ms-flex-align:center;align-items:center;background:transparent;border-radius:var(--pine-dimension-xs);cursor:pointer;display:-ms-flexbox;display:flex;padding:var(--pine-dimension-2xs) var(--pine-dimension-xs);-webkit-transition:background 0.15s;transition:background 0.15s}.pds-multiselect__option pds-checkbox{pointer-events:none;width:100%}.pds-multiselect__option:hover:not(.pds-multiselect__option--disabled),.pds-multiselect__option.pds-multiselect__option--highlighted:not(.pds-multiselect__option--disabled){background:var(--pine-color-background-muted)}.pds-multiselect__option.pds-multiselect__option--disabled{cursor:not-allowed;opacity:0.5}.pds-multiselect__option:focus-visible{outline:var(--pine-dimension-none)}.pds-multiselect__create-option{color:var(--pine-color-text-strong);width:100%}.pds-multiselect__create-option pds-icon{color:var(--pine-color-text-muted);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__empty,.pds-multiselect__loading{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-muted);display:-ms-flexbox;display:flex;font:var(--pine-typography-body);-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-sm)}.pds-multiselect__load-more{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-xs)}.pds-multiselect__helper{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs);-webkit-margin-start:var(--pine-dimension-none);margin-inline-start:var(--pine-dimension-none)}.pds-multiselect__error{-ms-flex-align:start;align-items:flex-start;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;font:var(--pine-typography-body-sm);gap:var(--pine-dimension-2xs);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs);-webkit-margin-start:var(--pine-dimension-none);margin-inline-start:var(--pine-dimension-none)}.pds-multiselect__error pds-icon{-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none);-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.visually-hidden{border:var(--pine-dimension-none);clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:var(--pine-dimension-none);position:absolute;white-space:nowrap;width:1px}"}},[321,"pds-multiselect",{componentId:[1,"component-id"],label:[1],placeholder:[1],searchPlaceholder:[1,"search-placeholder"],searchOptionsLabel:[1,"search-options-label"],selectedItemsLabel:[1,"selected-items-label"],optionsLabel:[1,"options-label"],noOptionsFoundLabel:[1,"no-options-found-label"],createOptionLabel:[1,"create-option-label"],createOptionAriaLabel:[1,"create-option-aria-label"],itemRemovedLabel:[1,"item-removed-label"],pillRemoveLabel:[1,"pill-remove-label"],selectedCountLabelOne:[1,"selected-count-label-one"],selectedCountLabelOther:[1,"selected-count-label-other"],selectedCountLabels:[1,"selected-count-labels"],closePanelOnSelect:[4,"close-panel-on-select"],name:[1],value:[1040],disabled:[4],asyncUrl:[1,"async-url"],asyncMethod:[1,"async-method"],debounce:[2],fetchTimeout:[2,"fetch-timeout"],maxSelections:[2,"max-selections"],maxHeight:[1,"max-height"],triggerWidth:[1,"trigger-width"],minWidth:[1,"min-width"],panelWidth:[1,"panel-width"],hideLabel:[4,"hide-label"],hideSelectedItems:[4,"hide-selected-items"],selectedDisplay:[1,"selected-display"],pillPosition:[1,"pill-position"],maxInlinePills:[2,"max-inline-pills"],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],invalid:[4],required:[4],loading:[1028],options:[16],formatResult:[16],createUrl:[1,"create-url"],csrfToken:[1,"csrf-token"],csrfHeaderName:[1,"csrf-header-name"],isOpen:[32],searchQuery:[32],highlightedIndex:[32],internalOptions:[32],selectedItems:[32],currentPage:[32],hasMore:[32],creating:[32],removalAnnouncement:[32],setFocus:[64],clear:[64]},[[8,"keydown","handleWindowKeyDown"]],{debounce:[{setupDebounce:0}],value:[{valueChanged:0}],options:[{optionsChanged:0}],internalOptions:[{internalOptionsChanged:0}]}]),S=j,F=function(){"undefined"!=typeof customElements&&["pds-multiselect","pds-box","pds-checkbox","pds-chip","pds-icon","pds-loader","pds-text"].forEach((e=>{switch(e){case"pds-multiselect":customElements.get(n(e))||customElements.define(n(e),j);break;case"pds-box":customElements.get(n(e))||f();break;case"pds-checkbox":customElements.get(n(e))||y();break;case"pds-chip":customElements.get(n(e))||w();break;case"pds-icon":customElements.get(n(e))||k();break;case"pds-loader":customElements.get(n(e))||O();break;case"pds-text":customElements.get(n(e))||C()}}))};export{S as PdsMultiselect,F as defineCustomElement}
|
package/components/pds-tab.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as
|
|
1
|
+
import{proxyCustomElement as t,HTMLElement as e,createEvent as a,h as i,Fragment as s,Host as o,transformTag as d}from"@stencil/core/internal/client";const r=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.pdsTabClick=a(this,"pdsTabClick",7),this.disabled=!1,this.active=!1,this.selected=!1}onTabClick(t,e){this.disabled||this.pdsTabClick.emit([t,e])}get hasHref(){return null!=this.href&&""!==this.href}get isNav(){var t;return null!==(t=this.navMode)&&void 0!==t?t:this.hasHref}get isActive(){return this.isNav?this.active:this.selected}classNames(){return["pds-tab",this.isActive&&"is-active",this.disabled&&"is-disabled"].filter(Boolean).join(" ")}render(){const t=i("span",{class:"pds-tab-edge",role:"presentation"}),e=i("span",{class:"pds-tab-edge pds-tab-edge--end",role:"presentation"}),a=i(s,null,"availability"===this.variant&&t,"availability"===this.variant&&e,i("div",{class:"pds-tab__content"},i("slot",null)));return i(o,{variant:this.variant,slot:"tabs",index:this.index},this.isNav?i("a",{href:this.disabled||!this.hasHref?void 0:this.href,role:this.disabled||!this.hasHref?"link":void 0,id:this.parentComponentId+"__"+this.name,class:this.classNames(),target:this.target,rel:"_blank"===this.target?"noopener noreferrer":void 0,"aria-current":this.isActive?"page":void 0,"aria-disabled":this.disabled?"true":null,"data-turbo-frame":this.turboFrame||void 0,"data-turbo-action":this.turboAction||void 0},a):i("button",{role:"tab",id:this.parentComponentId+"__"+this.name,"aria-controls":this.parentComponentId+"__"+this.name+"-panel",tabindex:this.disabled?"-1":this.selected?"0":"-1","aria-selected":this.selected?"true":"false","aria-disabled":this.disabled?"true":null,disabled:this.disabled,class:this.classNames(),onClick:this.onTabClick.bind(this,this.index,this.parentComponentId)},a))}get el(){return this}static get style(){return'pds-tab{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;position:relative}.pds-tabs--pill pds-tab{-ms-flex:1;flex:1}.pds-tab{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:var(--pine-border-width-none);-webkit-box-shadow:none;box-shadow:none;color:inherit;cursor:pointer;font-family:inherit;padding:var(--pine-dimension-none);-ms-flex-align:center;align-items:center;color:var(--pine-color-text-secondary);display:-ms-inline-flexbox;display:inline-flex;position:relative;text-decoration:none;white-space:nowrap}.pds-tab.is-active,.pds-tab[aria-selected=true]{color:var(--pine-color-text)}.pds-tab.is-active .pds-tab__content::after,.pds-tab[aria-selected=true] .pds-tab__content::after{opacity:1}.pds-tab:hover:not(:disabled,.is-disabled){color:var(--pine-color-text)}.pds-tab:focus{outline:none}.pds-tab:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-tab:disabled,.pds-tab.is-disabled{color:var(--pine-color-text-disabled);cursor:not-allowed}.pds-tab .pds-tab__content{font-family:var(--pine-font-family-body);font-size:var(--pine-font-size);font-weight:var(--pine-font-weight-medium);letter-spacing:var(--pine-letter-spacing);line-height:var(--pine-line-height-body);-webkit-padding-after:11px;padding-block-end:11px;position:relative}.pds-tab .pds-tab__content::after{background-color:var(--pine-color-brand);content:"";height:3px;inset-block-end:var(--pine-dimension-none);inset-inline-end:var(--pine-dimension-none);inset-inline-start:var(--pine-dimension-none);opacity:0;position:absolute}.pds-tab .pds-tab-edge{display:none}.pds-tabs--availability{--color-background-tab:transparent}.pds-tabs--availability .pds-tab{background-color:var(--color-background-tab);border-radius:calc(var(--pine-dimension-xs) * 1.25) calc(var(--pine-dimension-xs) * 1.25) var(--pine-dimension-none) var(--pine-dimension-none);color:var(--pine-color-text-secondary);padding:8px 16px 13px}.pds-tabs--availability .pds-tab.is-active,.pds-tabs--availability .pds-tab[aria-selected=true]{--color-background-tab:var(--pine-color-secondary);color:var(--pine-color-text)}.pds-tabs--availability .pds-tab.is-active .pds-tab__content::after,.pds-tabs--availability .pds-tab[aria-selected=true] .pds-tab__content::after{opacity:1}.pds-tabs--availability .pds-tab.is-active .pds-tab-edge,.pds-tabs--availability .pds-tab[aria-selected=true] .pds-tab-edge{z-index:var(--pine-z-index-raised)}.pds-tabs--availability .pds-tab:hover:not(.is-active,[aria-selected=true],:disabled,.is-disabled){--color-background-tab:var(--pine-color-secondary-hover);color:var(--pine-color-text)}.pds-tabs--availability .pds-tab:focus-visible{color:var(--pine-color-text-secondary)}.pds-tabs--availability .pds-tab:disabled,.pds-tabs--availability .pds-tab.is-disabled{--color-background-tab:transparent;color:var(--pine-color-text-disabled)}.pds-tabs--availability .pds-tab__content{-webkit-padding-after:7px;padding-block-end:7px}.pds-tabs--availability .pds-tab-edge{bottom:0;display:block;height:8px;inset-inline-end:100%;overflow:hidden;position:absolute;width:8px}.pds-tabs--availability .pds-tab-edge::before{border-radius:50%;bottom:0;-webkit-box-shadow:4px 4px 0 0 var(--color-background-tab);box-shadow:4px 4px 0 0 var(--color-background-tab);content:"";display:block;height:200%;inset-inline-end:0;position:absolute;width:200%}.pds-tabs--availability .pds-tab-edge--end{inset-inline-end:unset;inset-inline-start:100%}.pds-tabs--availability .pds-tab-edge--end::before{-webkit-box-shadow:-4px 4px 0 0 var(--color-background-tab);box-shadow:-4px 4px 0 0 var(--color-background-tab);inset-inline-end:unset;inset-inline-start:0}.pds-tabs--filter .pds-tab{background-color:var(--pine-color-background-muted);border-radius:50px;color:var(--pine-color-text);padding:6px 15px}.pds-tabs--filter .pds-tab.is-active,.pds-tabs--filter .pds-tab[aria-selected=true]{background-color:var(--pine-color-primary);color:var(--pine-color-text-primary)}.pds-tabs--filter .pds-tab.is-active:hover:not(:disabled,.is-disabled),.pds-tabs--filter .pds-tab[aria-selected=true]:hover:not(:disabled,.is-disabled){background-color:var(--pine-color-primary-hover)}.pds-tabs--filter .pds-tab:hover:not(.is-active,[aria-selected=true],:disabled,.is-disabled){background-color:var(--pine-color-border-disabled)}.pds-tabs--filter .pds-tab:disabled,.pds-tabs--filter .pds-tab.is-disabled{background-color:transparent;color:var(--pine-color-text-disabled)}.pds-tabs--filter .pds-tab:disabled.is-active,.pds-tabs--filter .pds-tab:disabled[aria-selected=true],.pds-tabs--filter .pds-tab.is-disabled.is-active,.pds-tabs--filter .pds-tab.is-disabled[aria-selected=true]{background-color:var(--pine-color-primary-disabled)}.pds-tabs--filter .pds-tab__content{-webkit-padding-after:var(--pine-dimension-none);padding-block-end:var(--pine-dimension-none)}.pds-tabs--filter .pds-tab__content::after{content:unset}.pds-tabs--pill{--color-background-tab:transparent}.pds-tabs--pill .pds-tab{background-color:var(--color-background-tab);border:var(--pine-border-width-thin) solid transparent;border-radius:var(--pine-dimension-xs);color:var(--pine-color-text-muted);-ms-flex:1;flex:1;height:34px;-ms-flex-pack:center;justify-content:center}.pds-tabs--pill .pds-tab .pds-tab__content{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-webkit-padding-after:0;padding-block-end:0}.pds-tabs--pill .pds-tab.is-active,.pds-tabs--pill .pds-tab[aria-selected=true]{--color-background-tab:var(--pine-color-background-container);border-color:var(--pine-color-border);-webkit-box-shadow:var(--pine-box-shadow-100);box-shadow:var(--pine-box-shadow-100);color:var(--pine-color-text-active)}.pds-tabs--pill .pds-tab.is-active:focus-visible,.pds-tabs--pill .pds-tab[aria-selected=true]:focus-visible{border-color:var(--color-border-focus);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-tabs--pill .pds-tab.is-active,.pds-tabs--pill .pds-tab[aria-selected=true]{}.pds-tabs--pill .pds-tab.is-active .pds-tab__content::after,.pds-tabs--pill .pds-tab[aria-selected=true] .pds-tab__content::after{opacity:0}.pds-tabs--pill .pds-tab.is-active,.pds-tabs--pill .pds-tab[aria-selected=true]{}.pds-tabs--pill .pds-tab:disabled,.pds-tabs--pill .pds-tab.is-disabled{color:var(--pine-color-text-disabled)}'}},[260,"pds-tab",{disabled:[4],href:[1],active:[4],target:[1],turboFrame:[1,"turbo-frame"],turboAction:[1,"turbo-action"],name:[1],parentComponentId:[1,"parent-component-id"],variant:[1],index:[2],selected:[4],navMode:[4,"nav-mode"]}]),n=r,l=function(){"undefined"!=typeof customElements&&["pds-tab"].forEach((t=>{"pds-tab"===t&&(customElements.get(d(t))||customElements.define(d(t),r))}))};export{n as PdsTab,l as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as e,HTMLElement as t,h as a,Host as
|
|
1
|
+
import{proxyCustomElement as e,HTMLElement as t,h as a,Host as s,transformTag as n}from"@stencil/core/internal/client";const i=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.selected=!1,this.stretch=!1}render(){return a(s,{key:"88dfc12ce8b2413824e6d3425aa38674fa14c764",slot:"tabpanels",class:this.stretch&&this.selected?"pds-tabpanel--stretch-active":void 0},a("div",{key:"bcfe8be6480dc253b10d63d6e37caacec4a8fe7f",role:"tabpanel",id:this.parentComponentId+"__"+this.name+"-panel",tabindex:"0","aria-labelledby":this.parentComponentId+"__"+this.name,class:this.selected?"pds-tabpanel is-active":"pds-tabpanel"},a("slot",{key:"96ee87a0917e5f538a5c053045a5d6821684cf3a"})))}get el(){return this}static get style(){return":host{display:block}:host(.pds-tabpanel--stretch-active){-ms-flex:1 1 auto;flex:1 1 auto;min-block-size:0}:host(.pds-tabpanel--stretch-active) .pds-tabpanel.is-active{block-size:100%}.pds-tabpanel{display:none;margin-top:var(--tabs-dimension-panel-margin-top);padding:var(--tabs-dimension-panel-padding)}.pds-tabpanel:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-tabpanel.is-active{display:block}"}},[260,"pds-tabpanel",{name:[1],parentComponentId:[1,"parent-component-id"],variant:[1],selected:[1028],stretch:[4]}]),l=i,p=function(){"undefined"!=typeof customElements&&["pds-tabpanel"].forEach((e=>{"pds-tabpanel"===e&&(customElements.get(n(e))||customElements.define(n(e),i))}))};export{l as PdsTabpanel,p as defineCustomElement}
|
package/components/pds-tabs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as s,HTMLElement as t,h as
|
|
1
|
+
import{proxyCustomElement as s,HTMLElement as t,h as i,Host as e,transformTag as a}from"@stencil/core/internal/client";const n=s(class extends t{constructor(s){super(),!1!==s&&this.__registerHost(),this.__attachShadow(),this.divider=!1,this.stretch=!1,this.nav=!1}tabClickHandler(s){this.componentId===s.detail[1]&&(this.activeTabIndex=s.detail[0],this.activeTabName=this.tabs[this.activeTabIndex].name)}handleKeyDown(s){if(this.isNav)return;const t=s.target.closest("pds-tab"),i=t&&t.closest("pds-tabs")===this.el;["ArrowLeft","ArrowRight","Home","End"].includes(s.key)&&i&&(s.preventDefault(),this.moveActiveTab(s.key))}get isNav(){return!!this.nav}warnOnNavConfig(){var s;if(!(null===(s=this.tabs)||void 0===s?void 0:s.length))return;const t=this.tabs.filter((s=>{const t=s.getAttribute("href");return null!=t&&""!==t})).length;this.nav&&t<this.tabs.length?console.warn("pds-tabs: `nav` is set, so every pds-tab needs an `href`."):!this.nav&&t>0&&console.warn("pds-tabs: a pds-tab has an `href` but `nav` is not set — add `nav` to pds-tabs for navigation mode; the href is ignored in panel mode.")}moveActiveTab(s){const t=this.tabs.length-1;let i=null;switch(s){case"ArrowLeft":i=0===this.activeTabIndex?t:this.activeTabIndex+-1;break;case"ArrowRight":i=this.activeTabIndex===t?0:this.activeTabIndex+1;break;case"Home":i=0;break;case"End":i=t}this.tabs[i].children[0].focus(),this.activeTabName=this.tabs[i].name,this.activeTabIndex=i}findAllChildren(){const s=Array.from(this.el.querySelectorAll("pds-tab")),t=Array.from(this.el.querySelectorAll("pds-tabpanel"));this.tabs=s.filter((s=>s.closest("pds-tabs")===this.el)),this.tabPanels=t.filter((s=>s.closest("pds-tabs")===this.el))}propGeneration(s,t=0){s.parentComponentId=""+this.componentId,s.variant=""+this.variant,s.selected=this.activeTabName===s.name,s.index=t}passPropsToChildren(){var s;if(!this.nav&&null==this.activeTabName&&this.tabs.length){const t=null!==(s=this.tabs.find((s=>!s.disabled)))&&void 0!==s?s:this.tabs[0];this.activeTabName=t.name}this.tabs.forEach(((s,t)=>{this.activeTabName===s.name&&(this.activeTabIndex=t),this.propGeneration(s,t),s.navMode=this.nav})),this.tabPanels.forEach((s=>{this.propGeneration(s),s.stretch=this.stretch}))}classNames(){let s="pds-tabs";return this.variant&&"primary"!=this.variant&&(s+=" pds-tabs--"+this.variant),this.divider&&(s+=" pds-tabs--divider"),this.stretch&&(s+=" pds-tabs--stretch"),s}componentWillLoad(){this.findAllChildren(),this.warnOnNavConfig()}componentWillRender(){this.passPropsToChildren()}render(){const s=this.isNav?i("nav",{class:"pds-tabs__tablist","aria-label":this.tablistLabel||void 0,part:"tab-list"},i("slot",{name:"tabs"})):i("div",{class:"pds-tabs__tablist",role:"tablist","aria-label":this.tablistLabel,part:"tab-list"},i("slot",{name:"tabs"}));return i(e,{key:"97bb6d788bd7bdf393b46eaecea612d9b0c9dee4","active-tab-name":this.activeTabName,class:this.classNames(),id:this.componentId},s,i("slot",{key:"252855bfa496bc3e04fbe6dc0bcb7597c7360407",name:"tabpanels"}))}get el(){return this}static get style(){return":host{--tabs-dimension-panel-margin-top:var(--pine-dimension-none);--tabs-dimension-panel-padding:0;display:block}.pds-tabs__tablist{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-md)}:host(.pds-tabs--divider) .pds-tabs__tablist{-webkit-border-after:var(--pine-border-width-thin) solid var(--pine-color-border-subtle);border-block-end:var(--pine-border-width-thin) solid var(--pine-color-border-subtle)}:host(.pds-tabs--stretch){block-size:100%;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host(.pds-tabs--stretch) .pds-tabs__tablist{-ms-flex:0 0 auto;flex:0 0 auto}:host(.pds-tabs--availability) .pds-tabs__tablist{gap:var(--pine-dimension-xs)}:host(.pds-tabs--filter) .pds-tabs__tablist{gap:var(--pine-dimension-sm)}:host(.pds-tabs--pill) .pds-tabs__tablist{background-color:var(--pine-color-background-app);border:var(--pine-border-width-thin) solid var(--pine-color-border-subtle);border-radius:var(--pine-dimension-100);display:-ms-inline-flexbox;display:inline-flex;display:-ms-flexbox;display:flex;gap:0;height:var(--pine-dimension-450)}"}},[257,"pds-tabs",{tablistLabel:[1,"tablist-label"],componentId:[1,"component-id"],variant:[1],divider:[4],stretch:[4],nav:[4],activeTabName:[1025,"active-tab-name"],activeTabIndex:[1026,"active-tab-index"]},[[16,"pdsTabClick","tabClickHandler"],[0,"keydown","handleKeyDown"]]]),r=n,d=function(){"undefined"!=typeof customElements&&["pds-tabs"].forEach((s=>{"pds-tabs"===s&&(customElements.get(a(s))||customElements.define(a(s),n))}))};export{r as PdsTabs,d as defineCustomElement}
|
package/components/pds-text2.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as t,HTMLElement as e,h as i,transformTag as n}from"@stencil/core/internal/client";import{s}from"./utils.js";import{s as o}from"./truncation-tooltip.js";const a=["2xl","xl","lg","md","sm","xs","2xs","h1","h2","h3","h4","h5","h6"],r=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.truncationCleanup=null,this.tag="p"}handleTruncateChange(t){t?this.initTruncationTooltip():this.destroyTruncationTooltip()}validateSize(t){if(void 0!==t&&""!==t&&!a.includes(t)){const e=t.length>80?`${t.slice(0,80)}…`:t;console.warn(`pds-text: invalid size "${e}". Valid values are: ${a.join(", ")}.`)}}componentWillLoad(){this.validateSize(this.size)}componentDidLoad(){this.truncate&&this.initTruncationTooltip()}disconnectedCallback(){this.destroyTruncationTooltip()}initTruncationTooltip(){this.destroyTruncationTooltip(),this.contentEl&&(this.truncationCleanup=o({hostEl:this.el,contentEl:this.contentEl,getTooltipText:()=>this.el.textContent||""}))}destroyTruncationTooltip(){this.truncationCleanup&&(this.truncationCleanup(),this.truncationCleanup=null)}render(){const t=this.tag,e=`\n pds-text\n ${void 0!==this.align&&""!==this.align.trim()?`pds-text--align-${this.align}`:""}\n ${void 0!==this.gutter&&""!==this.gutter.trim()?`pds-text--gutter-${this.gutter}`:""}\n ${void 0!==this.size&&""!==this.size.trim()?`pds-text--size-${this.size}`:""}\n ${void 0!==this.weight&&""!==this.weight.trim()?`pds-text--weight-${this.weight}`:""}\n ${void 0!==this.decoration&&""!==this.decoration.trim()?`pds-text--decoration-${this.decoration}`:""}\n `;return i(t,{key:"
|
|
1
|
+
import{proxyCustomElement as t,HTMLElement as e,h as i,transformTag as n}from"@stencil/core/internal/client";import{s}from"./utils.js";import{s as o}from"./truncation-tooltip.js";const a=["2xl","xl","lg","md","sm","xs","2xs","h1","h2","h3","h4","h5","h6"],r=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.truncationCleanup=null,this.tag="p"}handleTruncateChange(t){t?this.initTruncationTooltip():this.destroyTruncationTooltip()}validateSize(t){if(void 0!==t&&""!==t&&!a.includes(t)){const e=t.length>80?`${t.slice(0,80)}…`:t;console.warn(`pds-text: invalid size "${e}". Valid values are: ${a.join(", ")}.`)}}componentWillLoad(){this.validateSize(this.size)}componentDidLoad(){this.truncate&&this.initTruncationTooltip()}disconnectedCallback(){this.destroyTruncationTooltip()}initTruncationTooltip(){this.destroyTruncationTooltip(),this.contentEl&&(this.truncationCleanup=o({hostEl:this.el,contentEl:this.contentEl,getTooltipText:()=>this.el.textContent||""}))}destroyTruncationTooltip(){this.truncationCleanup&&(this.truncationCleanup(),this.truncationCleanup=null)}render(){const t=this.tag,e=`\n pds-text\n ${void 0!==this.align&&""!==this.align.trim()?`pds-text--align-${this.align}`:""}\n ${void 0!==this.gutter&&""!==this.gutter.trim()?`pds-text--gutter-${this.gutter}`:""}\n ${void 0!==this.size&&""!==this.size.trim()?`pds-text--size-${this.size}`:""}\n ${void 0!==this.weight&&""!==this.weight.trim()?`pds-text--weight-${this.weight}`:""}\n ${void 0!==this.decoration&&""!==this.decoration.trim()?`pds-text--decoration-${this.decoration}`:""}\n `;return i(t,{key:"9ae3d5a57202ca1308c69b76645168fc8e18953b",ref:t=>this.contentEl=t,style:this.color&&s(this.color),class:e,part:"content",tabIndex:this.truncate?0:void 0},i("slot",{key:"e6c95b8240690a9c83927e206096bbd7615dd4d2"}))}get el(){return this}static get watchers(){return{truncate:[{handleTruncateChange:0}],size:[{validateSize:0}]}}static get style(){return":host{display:inline}:host([decoration=underline-dotted])>*{-webkit-text-decoration-color:var(--pine-color-text-tertiary);text-decoration-color:var(--pine-color-text-tertiary);-webkit-text-decoration-line:underline;text-decoration-line:underline;-webkit-text-decoration-style:dotted;text-decoration-style:dotted;text-decoration-thickness:12%;text-underline-offset:0.3rem;text-underline-position:under}:host([decoration=strikethrough])>*{text-decoration:line-through}h1{font:var(--pine-typography-heading-1);letter-spacing:var(--pine-letter-spacing-heading-1)}h2{font:var(--pine-typography-heading-2);letter-spacing:var(--pine-letter-spacing-heading-2)}h3{font:var(--pine-typography-heading-3);letter-spacing:var(--pine-letter-spacing-heading-3)}h4{font:var(--pine-typography-heading-4);letter-spacing:var(--pine-letter-spacing-heading-4)}h5{font:var(--pine-typography-heading-5);letter-spacing:var(--pine-letter-spacing-heading-5)}h6{font:var(--pine-typography-heading-6);letter-spacing:var(--pine-letter-spacing-heading-6)}code,em,p,pre,strong{font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing)}code,pre{font-family:monospace;letter-spacing:0;line-height:1}em{font-style:normal}strong{font-weight:bolder}:host([truncate])>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host([italic])>*{font-style:italic}.pds-text{color:var(--color, var(--pine-color-text));margin:var(--pine-dimension-none)}.pds-text--size-2xl{font-size:var(--pine-font-size-body-2xl)}.pds-text--size-xl{font-size:var(--pine-font-size-body-xl)}.pds-text--size-lg{font-size:var(--pine-font-size-body-lg)}.pds-text--size-md{font-size:var(--pine-font-size-body-md)}.pds-text--size-sm{font-size:var(--pine-font-size-body-sm)}.pds-text--size-xs{font-size:var(--pine-font-size-body-xs)}.pds-text--size-2xs{font-size:var(--pine-font-size-body-2xs)}.pds-text--size-h1{font-size:var(--pine-font-size-heading-1)}.pds-text--size-h2{font-size:var(--pine-font-size-heading-2)}.pds-text--size-h3{font-size:var(--pine-font-size-heading-3)}.pds-text--size-h4{font-size:var(--pine-font-size-heading-4)}.pds-text--size-h5{font-size:var(--pine-font-size-heading-5)}.pds-text--size-h6{font-size:var(--pine-font-size-heading-6)}.pds-text--weight-extra-light{font-weight:var(--pine-font-weight-extra-light)}.pds-text--weight-light{font-weight:var(--pine-font-weight-light)}.pds-text--weight-regular{font-weight:var(--pine-font-weight-regular)}.pds-text--weight-medium{font-weight:var(--pine-font-weight-medium)}.pds-text--weight-semibold{font-weight:var(--pine-font-weight-semi-bold)}.pds-text--weight-bold{font-weight:var(--pine-font-weight-bold)}.pds-text--gutter-2xl{-webkit-margin-after:var(--pine-dimension-2xl);margin-block-end:var(--pine-dimension-2xl)}.pds-text--gutter-xl{-webkit-margin-after:var(--pine-dimension-xl);margin-block-end:var(--pine-dimension-xl)}.pds-text--gutter-lg{-webkit-margin-after:var(--pine-dimension-lg);margin-block-end:var(--pine-dimension-lg)}.pds-text--gutter-md{-webkit-margin-after:var(--pine-dimension-md);margin-block-end:var(--pine-dimension-md)}.pds-text--gutter-sm{-webkit-margin-after:var(--pine-dimension-sm);margin-block-end:var(--pine-dimension-sm)}.pds-text--gutter-xs{-webkit-margin-after:var(--pine-dimension-xs);margin-block-end:var(--pine-dimension-xs)}.pds-text--gutter-2xs{-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-text--align-start{text-align:start}.pds-text--align-center{text-align:center}.pds-text--align-end{text-align:end}.pds-text--align-justify{text-align:justify}"}},[257,"pds-text",{align:[1],color:[1],decoration:[1],gutter:[1],italic:[4],size:[1],weight:[1],tag:[1],truncate:[516]},void 0,{truncate:[{handleTruncateChange:0}],size:[{validateSize:0}]}]);function d(){"undefined"!=typeof customElements&&["pds-text"].forEach((t=>{"pds-text"===t&&(customElements.get(n(t))||customElements.define(n(t),r))}))}export{r as P,d}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as e,HTMLElement as t,createEvent as i,h as a,Host as s,transformTag as r}from"@stencil/core/internal/client";import{i as o,b as n,e as l,a as d,m as c}from"./form.js";import{d as h}from"./utils.js";import{i as p,a as u}from"./attributes.js";import{h as b}from"./index2.js";import{d as m}from"./pds-icon2.js";const x=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.pdsBlur=i(this,"pdsBlur",7),this.pdsFocus=i(this,"pdsFocus",7),this.pdsInput=i(this,"pdsInput",7),this.pdsTextareaChange=i(this,"pdsTextareaChange",7),this.pdsKeyDown=i(this,"pdsKeyDown",7),this.inheritedAttributes={},this._type="textarea",this.disabled=!1,this.invalid=!1,this.name=this.componentId,this.readonly=!1,this.required=!1,this.value="",this.hasFocus=!1,this.hasAction=!1,this.onBlur=e=>{this.hasFocus=!1,this.focusedValue!==this.value&&this.emitValueChange(e),this.pdsBlur.emit(e)},this.onFocus=e=>{this.hasFocus=!0,this.focusedValue=this.value,this.pdsFocus.emit(e)},this.onInput=e=>{const t=e.target;t&&(this.maxLength&&t.value.length>this.maxLength&&(t.value=t.value.substring(0,this.maxLength)),this.value=t.value||""),this.emitInputChange(e),this.maxLength&&"undefined"!=typeof ResizeObserver&&requestAnimationFrame((()=>{this.updateCharacterCounterPosition()}))},this.onTextareaChange=e=>{this.emitValueChange(e)},this.onKeyDown=e=>{this.pdsKeyDown.emit(e)}}async setFocus(){this.nativeTextarea&&this.nativeTextarea.focus()}debounceChanged(){const{pdsInput:e,debounce:t,originalPdsInput:i}=this;this.pdsInput=void 0===t?null!=i?i:e:h(e,t)}valueChanged(){const e=this.nativeTextarea,t=this.getValue();e&&e.value!==t&&(e.value=t),this.updateFormValue(),this.maxLength&&"undefined"!=typeof ResizeObserver&&this.updateCharacterCounterPosition()}maxLengthChanged(){if(this.resizeObserver&&this.resizeObserver.disconnect(),this.maxLength&&this.nativeTextarea&&this.setupResizeObserver(),!o()&&this.internals&&this.internals.setValidity&&this.nativeTextarea){const e=this.nativeTextarea.value.length>(this.maxLength||0);this.internals.setValidity({tooLong:e},e?"Value exceeds maxLength":"",this.nativeTextarea)}}emitInputChange(e){const{value:t}=this;this.pdsInput.emit({value:t,event:e})}emitValueChange(e){const t=e.target;n(t,this);const{value:i}=t,a=null==i?i:""+i;this.focusedValue=a,this.pdsTextareaChange.emit({value:a,event:e})}getValue(){return this.value||""}textareaClassNames(){const e=["pds-textarea__field"];return this.invalid&&!0===this.invalid&&e.push("is-invalid"),e.join(" ")}connectedCallback(){this.debounceChanged(),this.el.attachInternals&&!this.internals&&(this.internals=this.el.attachInternals())}disconnectedCallback(){this.resizeObserver&&this.resizeObserver.disconnect()}componentWillLoad(){this.inheritedAttributes=Object.assign(Object.assign({},p(this.el)),u(this.el)),this.hasAction=null!==this.el.querySelector('[slot="action"]')}componentDidLoad(){this.originalPdsInput=this.pdsInput,this.updateFormValue(),this.setupResizeObserver(),l(this.el,(()=>this._type))}setupResizeObserver(){this.maxLength&&this.nativeTextarea&&"undefined"!=typeof ResizeObserver&&(this.resizeObserver=new ResizeObserver((()=>{requestAnimationFrame((()=>{this.updateCharacterCounterPosition()}))})),this.resizeObserver.observe(this.nativeTextarea),requestAnimationFrame((()=>{this.updateCharacterCounterPosition()})))}updateCharacterCounterPosition(){if(!this.characterCounter||!this.nativeTextarea)return;if("undefined"==typeof ResizeObserver)return;if(0===this.characterCounter.offsetWidth||0===this.characterCounter.offsetHeight)return;const e=this.nativeTextarea.offsetWidth,t=this.nativeTextarea.offsetHeight,i=this.characterCounter.offsetWidth,a=this.characterCounter.offsetHeight,s=t-a-8,r=Math.max(8,Math.min(e-i-8,e-i-8)),o=Math.max(8,Math.min(s,t-a-8));this.characterCounter.style.position="absolute",this.characterCounter.style.left=r+"px",this.characterCounter.style.top=o+"px",this.characterCounter.style.right="auto",this.characterCounter.style.bottom="auto"}renderCharacterCounter(){if(!this.maxLength)return null;const e=this.getValue().length;return a("div",{class:"pds-textarea__character-counter",ref:e=>this.characterCounter=e,role:"status","aria-live":"polite","aria-label":`${e} of ${this.maxLength} characters`},e," / ",this.maxLength)}renderAction(){return null!==this.el.querySelector('[slot="action"]')?a("div",{class:"pds-textarea__action",part:"action"},a("slot",{name:"action"})):null}updateFormValue(){if(!o()&&this.internals&&this.internals.setFormValue){const e=this.getValue();this.internals.setFormValue(e||null),this.nativeTextarea&&this.internals&&this.internals.setValidity&&this.internals.setValidity(this.nativeTextarea.validity,this.nativeTextarea.validationMessage,this.nativeTextarea)}}formResetCallback(){this.value="",this.updateFormValue()}formDisabledCallback(e){this.disabled=e}formStateRestoreCallback(e){if("string"==typeof e)this.value=e;else if(e instanceof FormData&&this.name){const t=e.get(this.name);"string"==typeof t&&(this.value=t)}}render(){const e=this.getValue();return a(s,{key:"09726ef6454fe84a5c8d0ea25c6e8a7a6da128f9","aria-disabled":this.disabled?"true":null,"aria-readonly":this.readonly?"true":null,"has-action":this.hasAction&&!this.hideLabel?"true":null},a("div",{key:"6244104f11d26b25a908fbaf13a815988a3c33d9",class:"pds-textarea"},this.label&&a("div",{key:"5dd7f6caedd7ebf5ecaacf8d111ec5e2426e84ae",class:"pds-textarea__label-wrapper"},a("label",{key:"d19f62cd28612423abf0d5696ff1cd88f39d32fe",htmlFor:this.componentId},a("span",{key:"37f4e9e34ae3205bafa5f1bc8574a98d3a90060d",class:this.hideLabel?"visually-hidden":""},this.label)),!this.hideLabel&&this.renderAction()),a("div",{key:"4c3c8fadc5596630485ee1775f5d87d77c11d95b",class:"pds-textarea__field-wrapper"},a("textarea",Object.assign({key:"a60be5f3d362cb9bcd2ecf5af16ffc467fc8322a",ref:e=>this.nativeTextarea=e,"aria-describedby":d(this.componentId,this.invalid,this.helperMessage),"aria-invalid":this.invalid?"true":void 0,autocomplete:this.autocomplete,class:this.textareaClassNames(),disabled:this.disabled,id:this.componentId,maxlength:this.maxLength,name:this.name,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,rows:this.rows,onBlur:this.onBlur,onChange:this.onTextareaChange,onFocus:this.onFocus,onInput:this.onInput,onKeyDown:this.onKeyDown},this.inheritedAttributes),e),this.renderCharacterCounter()),this.helperMessage&&a("p",{key:"ae03337ef85ac2a3995e967fe671e0ad2c352710",class:"pds-textarea__helper-message",id:c(this.componentId,"helper")},this.helperMessage),this.invalid&&a("p",{key:"a2bda9a477e7d2b81862833da43158a626d8cc6f","aria-live":"assertive",class:"pds-textarea__error-message",id:c(this.componentId,"error")},a("pds-icon",{key:"5ac785e8012aeb49dd0b1c5823233671531b0a7a",icon:b,size:"small"}),this.errorMessage)))}static get formAssociated(){return!0}get el(){return this}static get watchers(){return{debounce:[{debounceChanged:0}],value:[{valueChanged:0}],maxLength:[{maxLengthChanged:0}]}}static get style(){return":host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}:host{--pine-input-color-background-danger:var(--pine-color-red-050)}:host{display:inline-block;width:100%}:host([aria-readonly=true]) textarea{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([aria-readonly=true])) .pds-textarea__field:not(.is-invalid){background-color:var(--pine-color-accent-disabled);border-color:var(--pine-color-accent);color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([aria-readonly=true])) .pds-textarea__field:not(.is-invalid):hover{border-color:var(--pine-color-accent-hover)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([aria-readonly=true])) .pds-textarea__field:not(.is-invalid):focus-visible{outline-color:var(--pine-color-focus-ring)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([aria-readonly=true])) .pds-textarea__field:not(.is-invalid)~.pds-textarea__character-counter{background:color-mix(in srgb, var(--pine-color-accent-disabled) 80%, transparent);color:var(--pine-color-text-accent)}.pds-textarea{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.pds-textarea__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}.pds-textarea__action{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}label{display:block;-webkit-margin-after:var(--pine-dimension-xs);margin-block-end:var(--pine-dimension-xs)}.pds-textarea__label-wrapper label{-webkit-margin-after:0;margin-block-end:0}.pds-textarea__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-textarea__error-message{color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;font:var(--pine-typography-body-sm-medium);gap:var(--pine-dimension-2xs);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-textarea__error-message pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.pds-textarea__field-wrapper{display:inline-block;position:relative;width:100%}.pds-textarea__field{background-color:var(--pine-color-background-container);border:var(--pine-border);border-radius:calc(var(--pine-dimension-xs) * 1.25);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pine-color-text);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);min-height:calc(var(--pine-dimension-xl) * 2);min-width:calc(var(--pine-dimension-xl) * 2);padding:var(--pine-dimension-xs) var(--pine-dimension-sm);resize:both;width:100%}:host([max-length]) .pds-textarea__field{padding-bottom:calc(var(--pine-dimension-xs) + var(--pine-dimension-md))}.pds-textarea__field:hover:not(:disabled,.is-invalid){border:var(--pine-border-hover)}.pds-textarea__field:disabled{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}.pds-textarea__field:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-textarea__field::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field.is-invalid{background-color:var(--pine-input-color-background-danger);border-color:var(--pine-color-border-danger)}:host-context([data-theme=dark]) .pds-textarea__field.is-invalid{background-color:var(--pine-color-red-950)}.pds-textarea__field.is-invalid:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-textarea__character-counter{background:color-mix(in srgb, var(--pine-color-background-container) 80%, transparent);border-radius:calc(var(--pine-dimension-2xs) * 0.5);color:var(--pine-color-text-muted);font:var(--pine-typography-body-sm-medium);padding:calc(var(--pine-dimension-2xs) * 0.5) var(--pine-dimension-2xs);pointer-events:none;position:absolute;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap;z-index:var(--pine-z-index)}:host([aria-disabled=true]) .pds-textarea__character-counter{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-disabled)}:host([aria-readonly=true]) .pds-textarea__character-counter{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}.pds-textarea__field.is-invalid~.pds-textarea__character-counter{background-color:var(--pine-input-color-background-danger)}:host-context([data-theme=dark]) .pds-textarea__field.is-invalid~.pds-textarea__character-counter{background-color:var(--pine-color-red-950)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}"}},[321,"pds-textarea",{autocomplete:[1],componentId:[1,"component-id"],disabled:[4],debounce:[2],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],invalid:[1028],label:[1],hideLabel:[4,"hide-label"],name:[1],placeholder:[1],readonly:[4],required:[4],rows:[2],maxLength:[514,"max-length"],highlight:[516],value:[1025],hasFocus:[32],hasAction:[32],setFocus:[64]},void 0,{debounce:[{debounceChanged:0}],value:[{valueChanged:0}],maxLength:[{maxLengthChanged:0}]}]),v=x,g=function(){"undefined"!=typeof customElements&&["pds-textarea","pds-icon"].forEach((e=>{switch(e){case"pds-textarea":customElements.get(r(e))||customElements.define(r(e),x);break;case"pds-icon":customElements.get(r(e))||m()}}))};export{v as PdsTextarea,g as defineCustomElement}
|
|
1
|
+
import{proxyCustomElement as e,HTMLElement as t,createEvent as i,h as a,Host as r,transformTag as s}from"@stencil/core/internal/client";import{i as o,b as n,e as l,a as d,m as c}from"./form.js";import{d as h}from"./utils.js";import{i as p,a as b}from"./attributes.js";import{h as u}from"./index2.js";import{f as m}from"./i18n-format.js";import{d as x}from"./pds-icon2.js";const v=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.pdsBlur=i(this,"pdsBlur",7),this.pdsFocus=i(this,"pdsFocus",7),this.pdsInput=i(this,"pdsInput",7),this.pdsTextareaChange=i(this,"pdsTextareaChange",7),this.pdsKeyDown=i(this,"pdsKeyDown",7),this.inheritedAttributes={},this._type="textarea",this.disabled=!1,this.invalid=!1,this.name=this.componentId,this.readonly=!1,this.required=!1,this.value="",this.hasFocus=!1,this.hasAction=!1,this.characterCountLabel="{current} of {max} characters",this.onBlur=e=>{this.hasFocus=!1,this.focusedValue!==this.value&&this.emitValueChange(e),this.pdsBlur.emit(e)},this.onFocus=e=>{this.hasFocus=!0,this.focusedValue=this.value,this.pdsFocus.emit(e)},this.onInput=e=>{const t=e.target;t&&(this.maxLength&&t.value.length>this.maxLength&&(t.value=t.value.substring(0,this.maxLength)),this.value=t.value||""),this.emitInputChange(e),this.maxLength&&"undefined"!=typeof ResizeObserver&&requestAnimationFrame((()=>{this.updateCharacterCounterPosition()}))},this.onTextareaChange=e=>{this.emitValueChange(e)},this.onKeyDown=e=>{this.pdsKeyDown.emit(e)}}async setFocus(){this.nativeTextarea&&this.nativeTextarea.focus()}debounceChanged(){const{pdsInput:e,debounce:t,originalPdsInput:i}=this;this.pdsInput=void 0===t?null!=i?i:e:h(e,t)}valueChanged(){const e=this.nativeTextarea,t=this.getValue();e&&e.value!==t&&(e.value=t),this.updateFormValue(),this.maxLength&&"undefined"!=typeof ResizeObserver&&this.updateCharacterCounterPosition()}maxLengthChanged(){if(this.resizeObserver&&this.resizeObserver.disconnect(),this.maxLength&&this.nativeTextarea&&this.setupResizeObserver(),!o()&&this.internals&&this.internals.setValidity&&this.nativeTextarea){const e=this.nativeTextarea.value.length>(this.maxLength||0);this.internals.setValidity({tooLong:e},e?"Value exceeds maxLength":"",this.nativeTextarea)}}emitInputChange(e){const{value:t}=this;this.pdsInput.emit({value:t,event:e})}emitValueChange(e){const t=e.target;n(t,this);const{value:i}=t,a=null==i?i:""+i;this.focusedValue=a,this.pdsTextareaChange.emit({value:a,event:e})}getValue(){return this.value||""}textareaClassNames(){const e=["pds-textarea__field"];return this.invalid&&!0===this.invalid&&e.push("is-invalid"),e.join(" ")}connectedCallback(){this.debounceChanged(),this.el.attachInternals&&!this.internals&&(this.internals=this.el.attachInternals())}disconnectedCallback(){this.resizeObserver&&this.resizeObserver.disconnect()}componentWillLoad(){this.inheritedAttributes=Object.assign(Object.assign({},p(this.el)),b(this.el)),this.hasAction=null!==this.el.querySelector('[slot="action"]')}componentDidLoad(){this.originalPdsInput=this.pdsInput,this.updateFormValue(),this.setupResizeObserver(),l(this.el,(()=>this._type))}setupResizeObserver(){this.maxLength&&this.nativeTextarea&&"undefined"!=typeof ResizeObserver&&(this.resizeObserver=new ResizeObserver((()=>{requestAnimationFrame((()=>{this.updateCharacterCounterPosition()}))})),this.resizeObserver.observe(this.nativeTextarea),requestAnimationFrame((()=>{this.updateCharacterCounterPosition()})))}updateCharacterCounterPosition(){if(!this.characterCounter||!this.nativeTextarea)return;if("undefined"==typeof ResizeObserver)return;if(0===this.characterCounter.offsetWidth||0===this.characterCounter.offsetHeight)return;const e=this.nativeTextarea.offsetWidth,t=this.nativeTextarea.offsetHeight,i=this.characterCounter.offsetWidth,a=this.characterCounter.offsetHeight,r=t-a-8,s=Math.max(8,Math.min(e-i-8,e-i-8)),o=Math.max(8,Math.min(r,t-a-8));this.characterCounter.style.position="absolute",this.characterCounter.style.left=s+"px",this.characterCounter.style.top=o+"px",this.characterCounter.style.right="auto",this.characterCounter.style.bottom="auto"}renderCharacterCounter(){if(!this.maxLength)return null;const e=this.getValue().length;return a("div",{class:"pds-textarea__character-counter",ref:e=>this.characterCounter=e,role:"status","aria-live":"polite","aria-label":m(this.characterCountLabel,{current:e,max:this.maxLength})},e," / ",this.maxLength)}renderAction(){return null!==this.el.querySelector('[slot="action"]')?a("div",{class:"pds-textarea__action",part:"action"},a("slot",{name:"action"})):null}updateFormValue(){if(!o()&&this.internals&&this.internals.setFormValue){const e=this.getValue();this.internals.setFormValue(e||null),this.nativeTextarea&&this.internals&&this.internals.setValidity&&this.internals.setValidity(this.nativeTextarea.validity,this.nativeTextarea.validationMessage,this.nativeTextarea)}}formResetCallback(){this.value="",this.updateFormValue()}formDisabledCallback(e){this.disabled=e}formStateRestoreCallback(e){if("string"==typeof e)this.value=e;else if(e instanceof FormData&&this.name){const t=e.get(this.name);"string"==typeof t&&(this.value=t)}}render(){const e=this.getValue();return a(r,{key:"d13869d989752c76c80a46ebb0291df2c0546cc2","aria-disabled":this.disabled?"true":null,"aria-readonly":this.readonly?"true":null,"has-action":this.hasAction&&!this.hideLabel?"true":null},a("div",{key:"19454f642896485dc22bc5dac8b6ed3b4ae5627a",class:"pds-textarea"},this.label&&a("div",{key:"def9e117ba3667a542e8cec32c2eabfa701c3305",class:"pds-textarea__label-wrapper"},a("label",{key:"893a1db325ece460c627e72b765289098823e49e",htmlFor:this.componentId},a("span",{key:"d047f17441aa81800057d7403af15f6e38c53f6c",class:this.hideLabel?"visually-hidden":""},this.label)),!this.hideLabel&&this.renderAction()),a("div",{key:"7d0f2fab56fee9b9d9e0facabc7e607cb6bee23b",class:"pds-textarea__field-wrapper"},a("textarea",Object.assign({key:"a3ecb78c5b8f42f8350abe623bacb55be6c4a0c0",ref:e=>this.nativeTextarea=e,"aria-describedby":d(this.componentId,this.invalid,this.helperMessage),"aria-invalid":this.invalid?"true":void 0,autocomplete:this.autocomplete,class:this.textareaClassNames(),disabled:this.disabled,id:this.componentId,maxlength:this.maxLength,name:this.name,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,rows:this.rows,onBlur:this.onBlur,onChange:this.onTextareaChange,onFocus:this.onFocus,onInput:this.onInput,onKeyDown:this.onKeyDown},this.inheritedAttributes),e),this.renderCharacterCounter()),this.helperMessage&&a("p",{key:"b5229a6ef0b2c4ee5dcb820ce2b9bbf6334adef8",class:"pds-textarea__helper-message",id:c(this.componentId,"helper")},this.helperMessage),this.invalid&&a("p",{key:"8e6dfa97496d553b8e1e2a50c1221fad3ddb539a","aria-live":"assertive",class:"pds-textarea__error-message",id:c(this.componentId,"error")},a("pds-icon",{key:"f3ed2677239e6d135480cf55d1d908936d746322",icon:u,size:"small"}),this.errorMessage)))}static get formAssociated(){return!0}get el(){return this}static get watchers(){return{debounce:[{debounceChanged:0}],value:[{valueChanged:0}],maxLength:[{maxLengthChanged:0}]}}static get style(){return":host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}:host{--pine-input-color-background-danger:var(--pine-color-red-050)}:host{display:inline-block;width:100%}:host([aria-readonly=true]) textarea{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([aria-readonly=true])) .pds-textarea__field:not(.is-invalid){background-color:var(--pine-color-accent-disabled);border-color:var(--pine-color-accent);color:var(--pine-color-text-accent)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([aria-readonly=true])) .pds-textarea__field:not(.is-invalid):hover{border-color:var(--pine-color-accent-hover)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([aria-readonly=true])) .pds-textarea__field:not(.is-invalid):focus-visible{outline-color:var(--pine-color-focus-ring)}:host([highlight]:not([disabled]):not([aria-disabled=true]):not([aria-readonly=true])) .pds-textarea__field:not(.is-invalid)~.pds-textarea__character-counter{background:color-mix(in srgb, var(--pine-color-accent-disabled) 80%, transparent);color:var(--pine-color-text-accent)}.pds-textarea{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.pds-textarea__label-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}.pds-textarea__action{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}label{display:block;-webkit-margin-after:var(--pine-dimension-xs);margin-block-end:var(--pine-dimension-xs)}.pds-textarea__label-wrapper label{-webkit-margin-after:0;margin-block-end:0}.pds-textarea__helper-message{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-textarea__error-message{color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;font:var(--pine-typography-body-sm-medium);gap:var(--pine-dimension-2xs);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-textarea__error-message pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.pds-textarea__field-wrapper{display:inline-block;position:relative;width:100%}.pds-textarea__field{background-color:var(--pine-color-background-container);border:var(--pine-border);border-radius:calc(var(--pine-dimension-xs) * 1.25);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pine-color-text);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);min-height:calc(var(--pine-dimension-xl) * 2);min-width:calc(var(--pine-dimension-xl) * 2);padding:var(--pine-dimension-xs) var(--pine-dimension-sm);resize:both;width:100%}:host([max-length]) .pds-textarea__field{padding-bottom:calc(var(--pine-dimension-xs) + var(--pine-dimension-md))}.pds-textarea__field:hover:not(:disabled,.is-invalid){border:var(--pine-border-hover)}.pds-textarea__field:disabled{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}.pds-textarea__field:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-textarea__field::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field.is-invalid{background-color:var(--pine-input-color-background-danger);border-color:var(--pine-color-border-danger)}:host-context([data-theme=dark]) .pds-textarea__field.is-invalid{background-color:var(--pine-color-red-950)}.pds-textarea__field.is-invalid:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-textarea__character-counter{background:color-mix(in srgb, var(--pine-color-background-container) 80%, transparent);border-radius:calc(var(--pine-dimension-2xs) * 0.5);color:var(--pine-color-text-muted);font:var(--pine-typography-body-sm-medium);padding:calc(var(--pine-dimension-2xs) * 0.5) var(--pine-dimension-2xs);pointer-events:none;position:absolute;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap;z-index:var(--pine-z-index)}:host([aria-disabled=true]) .pds-textarea__character-counter{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-disabled)}:host([aria-readonly=true]) .pds-textarea__character-counter{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}.pds-textarea__field.is-invalid~.pds-textarea__character-counter{background-color:var(--pine-input-color-background-danger)}:host-context([data-theme=dark]) .pds-textarea__field.is-invalid~.pds-textarea__character-counter{background-color:var(--pine-color-red-950)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}"}},[321,"pds-textarea",{autocomplete:[1],componentId:[1,"component-id"],disabled:[4],debounce:[2],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],invalid:[1028],label:[1],hideLabel:[4,"hide-label"],name:[1],placeholder:[1],readonly:[4],required:[4],rows:[2],maxLength:[514,"max-length"],highlight:[516],value:[1025],characterCountLabel:[1,"character-count-label"],hasFocus:[32],hasAction:[32],setFocus:[64]},void 0,{debounce:[{debounceChanged:0}],value:[{valueChanged:0}],maxLength:[{maxLengthChanged:0}]}]),g=v,f=function(){"undefined"!=typeof customElements&&["pds-textarea","pds-icon"].forEach((e=>{switch(e){case"pds-textarea":customElements.get(s(e))||customElements.define(s(e),v);break;case"pds-icon":customElements.get(s(e))||x()}}))};export{g as PdsTextarea,f as defineCustomElement}
|