@pine-ds/core 3.1.0 → 3.3.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/index.d.ts +20 -0
- package/components/index.js +10 -0
- package/components/index.js.map +1 -1
- package/components/index2.js +1 -1
- package/components/index2.js.map +1 -1
- package/components/mock-pds-modal.d.ts +11 -0
- package/components/mock-pds-modal.js +108 -0
- package/components/mock-pds-modal.js.map +1 -0
- package/components/pds-alert.d.ts +11 -0
- package/components/pds-alert.js +107 -0
- package/components/pds-alert.js.map +1 -0
- package/components/pds-avatar.js +1 -1
- package/components/pds-box.js +1 -110
- package/components/pds-box.js.map +1 -1
- package/components/pds-box2.js +115 -0
- package/components/pds-box2.js.map +1 -0
- package/components/pds-button2.js +1 -1
- package/components/pds-button2.js.map +1 -1
- package/components/pds-checkbox2.js +3 -3
- package/components/pds-chip.js +21 -6
- package/components/pds-chip.js.map +1 -1
- package/components/pds-copytext.js +1 -1
- package/components/pds-divider.js +1 -1
- package/components/pds-dropdown-menu-item.d.ts +11 -0
- package/components/pds-dropdown-menu-item.js +117 -0
- package/components/pds-dropdown-menu-item.js.map +1 -0
- package/components/pds-dropdown-menu-separator.d.ts +11 -0
- package/components/pds-dropdown-menu-separator.js +44 -0
- package/components/pds-dropdown-menu-separator.js.map +1 -0
- package/components/pds-dropdown-menu.d.ts +11 -0
- package/components/pds-dropdown-menu.js +1600 -0
- package/components/pds-dropdown-menu.js.map +1 -0
- package/components/pds-image.js +2 -2
- package/components/pds-input.js +98 -21
- package/components/pds-input.js.map +1 -1
- package/components/pds-link.js +1 -67
- package/components/pds-link.js.map +1 -1
- package/components/pds-link2.js +85 -0
- package/components/pds-link2.js.map +1 -0
- package/components/pds-loader2.js +1 -1
- package/components/pds-modal-content.d.ts +11 -0
- package/components/pds-modal-content.js +111 -0
- package/components/pds-modal-content.js.map +1 -0
- package/components/pds-modal-footer.d.ts +11 -0
- package/components/pds-modal-footer.js +35 -0
- package/components/pds-modal-footer.js.map +1 -0
- package/components/pds-modal-header.d.ts +11 -0
- package/components/pds-modal-header.js +35 -0
- package/components/pds-modal-header.js.map +1 -0
- package/components/pds-modal.d.ts +11 -0
- package/components/pds-modal.js +278 -0
- package/components/pds-modal.js.map +1 -0
- package/components/pds-popover.js +33 -1
- package/components/pds-popover.js.map +1 -1
- package/components/pds-progress.js +1 -1
- package/components/pds-radio.js +3 -3
- package/components/pds-row.js +1 -1
- package/components/pds-select.js +3 -3
- package/components/pds-select.js.map +1 -1
- package/components/pds-sortable-item.js +1 -1
- package/components/pds-sortable.js +1 -1
- package/components/pds-switch.js +3 -3
- package/components/pds-tab.js +3 -3
- package/components/pds-table-body.js +1 -1
- package/components/pds-table-cell2.js +2 -2
- package/components/pds-table-head-cell2.js +2 -2
- package/components/pds-table-head.js +1 -1
- package/components/pds-table-row.js +1 -1
- package/components/pds-table.js +1 -1
- package/components/pds-tabpanel.js +1 -1
- package/components/pds-tabs.js +1 -1
- package/components/pds-text.js +1 -53
- package/components/pds-text.js.map +1 -1
- package/components/pds-text2.js +58 -0
- package/components/pds-text2.js.map +1 -0
- package/components/pds-textarea.js +4 -4
- package/components/pds-toast.d.ts +11 -0
- package/components/pds-toast.js +137 -0
- package/components/pds-toast.js.map +1 -0
- package/components/pds-tooltip.js +299 -81
- package/components/pds-tooltip.js.map +1 -1
- package/components/utils.js +3 -2
- package/components/utils.js.map +1 -1
- package/dist/cjs/{index-CG2Rr2io.js → index-B0qLG6KJ.js} +3 -3
- package/dist/cjs/index-B0qLG6KJ.js.map +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/mock-pds-modal.cjs.entry.js +86 -0
- package/dist/cjs/mock-pds-modal.cjs.entry.js.map +1 -0
- package/dist/cjs/mock-pds-modal.entry.cjs.js.map +1 -0
- package/dist/cjs/pds-accordion.cjs.entry.js +1 -1
- package/dist/cjs/pds-alert.cjs.entry.js +66 -0
- package/dist/cjs/pds-alert.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-alert.entry.cjs.js.map +1 -0
- package/dist/cjs/pds-avatar.cjs.entry.js +2 -2
- package/dist/cjs/pds-box.cjs.entry.js +2 -2
- package/dist/cjs/pds-box.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-box.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-button.cjs.entry.js +3 -3
- package/dist/cjs/pds-button.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-button.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-checkbox.cjs.entry.js +4 -4
- package/dist/cjs/pds-chip.cjs.entry.js +21 -7
- package/dist/cjs/pds-chip.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-chip.entry.cjs.js.map +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 +82 -0
- package/dist/cjs/pds-dropdown-menu-item.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-dropdown-menu-item.entry.cjs.js.map +1 -0
- package/dist/cjs/pds-dropdown-menu-separator.cjs.entry.js +25 -0
- package/dist/cjs/pds-dropdown-menu-separator.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-dropdown-menu-separator.entry.cjs.js.map +1 -0
- package/dist/cjs/pds-dropdown-menu.cjs.entry.js +1574 -0
- package/dist/cjs/pds-dropdown-menu.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-dropdown-menu.entry.cjs.js.map +1 -0
- package/dist/cjs/pds-image.cjs.entry.js +2 -2
- package/dist/cjs/pds-input.cjs.entry.js +88 -21
- package/dist/cjs/pds-input.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-input.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-link.cjs.entry.js +16 -4
- package/dist/cjs/pds-link.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-link.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-loader.cjs.entry.js +1 -1
- package/dist/cjs/pds-modal-content.cjs.entry.js +93 -0
- package/dist/cjs/pds-modal-content.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-modal-content.entry.cjs.js.map +1 -0
- package/dist/cjs/pds-modal-footer.cjs.entry.js +20 -0
- package/dist/cjs/pds-modal-footer.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-modal-footer.entry.cjs.js.map +1 -0
- package/dist/cjs/pds-modal-header.cjs.entry.js +20 -0
- package/dist/cjs/pds-modal-header.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-modal-header.entry.cjs.js.map +1 -0
- package/dist/cjs/pds-modal.cjs.entry.js +253 -0
- package/dist/cjs/pds-modal.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-modal.entry.cjs.js.map +1 -0
- package/dist/cjs/pds-popover.cjs.entry.js +33 -1
- package/dist/cjs/pds-popover.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-popover.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-progress.cjs.entry.js +1 -1
- package/dist/cjs/pds-radio.cjs.entry.js +4 -4
- package/dist/cjs/pds-row.cjs.entry.js +1 -1
- package/dist/cjs/pds-select.cjs.entry.js +3 -4
- package/dist/cjs/pds-select.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-select.entry.cjs.js.map +1 -1
- 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 +4 -4
- package/dist/cjs/pds-tab.cjs.entry.js +3 -3
- package/dist/cjs/pds-table-body.cjs.entry.js +1 -1
- package/dist/cjs/pds-table-cell.cjs.entry.js +2 -2
- package/dist/cjs/pds-table-head-cell.cjs.entry.js +3 -3
- 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 +1 -1
- package/dist/cjs/pds-tabs.cjs.entry.js +1 -1
- package/dist/cjs/pds-text.cjs.entry.js +2 -2
- package/dist/cjs/pds-text.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-text.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-textarea.cjs.entry.js +6 -6
- package/dist/cjs/pds-toast.cjs.entry.js +104 -0
- package/dist/cjs/pds-toast.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-toast.entry.cjs.js.map +1 -0
- package/dist/cjs/pds-tooltip.cjs.entry.js +297 -79
- package/dist/cjs/pds-tooltip.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-tooltip.entry.cjs.js.map +1 -1
- package/dist/cjs/pine-core.cjs.js +1 -1
- package/dist/cjs/{utils-CQKIgzWg.js → utils-jWx-Mf12.js} +5 -4
- package/dist/cjs/utils-jWx-Mf12.js.map +1 -0
- package/dist/collection/collection-manifest.json +10 -0
- package/dist/collection/components/pds-alert/pds-alert.css +108 -0
- package/dist/collection/components/pds-alert/pds-alert.js +198 -0
- package/dist/collection/components/pds-alert/pds-alert.js.map +1 -0
- package/dist/collection/components/pds-alert/pds-alert.tokens.css +32 -0
- package/dist/collection/components/pds-alert/stories/pds-alert.stories.js +97 -0
- package/dist/collection/components/pds-avatar/pds-avatar.js +1 -1
- package/dist/collection/components/pds-box/pds-box.js +8 -8
- package/dist/collection/components/pds-box/pds-box.js.map +1 -1
- package/dist/collection/components/pds-button/pds-button.css +17 -5
- package/dist/collection/components/pds-checkbox/pds-checkbox.js +3 -3
- package/dist/collection/components/pds-chip/pds-chip.css +48 -11
- package/dist/collection/components/pds-chip/pds-chip.js +42 -9
- package/dist/collection/components/pds-chip/pds-chip.js.map +1 -1
- package/dist/collection/components/pds-chip/stories/pds-chip.stories.js +18 -1
- package/dist/collection/components/pds-copytext/pds-copytext.js +1 -1
- package/dist/collection/components/pds-divider/pds-divider.js +1 -1
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu-item/pds-dropdown-menu-item.css +68 -0
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu-item/pds-dropdown-menu-item.js +219 -0
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu-item/pds-dropdown-menu-item.js.map +1 -0
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu-separator/pds-dropdown-menu-separator.css +4 -0
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu-separator/pds-dropdown-menu-separator.js +72 -0
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu-separator/pds-dropdown-menu-separator.js.map +1 -0
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu.css +16 -0
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu.js +328 -0
- package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu.js.map +1 -0
- package/dist/collection/components/pds-dropdown-menu/stories/pds-dropdown-menu.stories.js +44 -0
- package/dist/collection/components/pds-image/pds-image.js +2 -2
- package/dist/collection/components/pds-input/pds-input.css +167 -43
- package/dist/collection/components/pds-input/pds-input.js +212 -21
- package/dist/collection/components/pds-input/pds-input.js.map +1 -1
- package/dist/collection/components/pds-input/stories/pds-input.stories.js +84 -0
- package/dist/collection/components/pds-link/pds-link.css +20 -1
- package/dist/collection/components/pds-link/pds-link.js +33 -2
- package/dist/collection/components/pds-link/pds-link.js.map +1 -1
- package/dist/collection/components/pds-link/stories/pds-link.stories.js +15 -2
- package/dist/collection/components/pds-loader/pds-loader.js +1 -1
- package/dist/collection/components/pds-modal/pds-modal-content/pds-modal-content.css +27 -0
- package/dist/collection/components/pds-modal/pds-modal-content/pds-modal-content.js +125 -0
- package/dist/collection/components/pds-modal/pds-modal-content/pds-modal-content.js.map +1 -0
- package/dist/collection/components/pds-modal/pds-modal-footer/pds-modal-footer.css +8 -0
- package/dist/collection/components/pds-modal/pds-modal-footer/pds-modal-footer.js +18 -0
- package/dist/collection/components/pds-modal/pds-modal-footer/pds-modal-footer.js.map +1 -0
- package/dist/collection/components/pds-modal/pds-modal-header/pds-modal-header.css +8 -0
- package/dist/collection/components/pds-modal/pds-modal-header/pds-modal-header.js +18 -0
- package/dist/collection/components/pds-modal/pds-modal-header/pds-modal-header.js.map +1 -0
- package/dist/collection/components/pds-modal/pds-modal.css +79 -0
- package/dist/collection/components/pds-modal/pds-modal.js +426 -0
- package/dist/collection/components/pds-modal/pds-modal.js.map +1 -0
- package/dist/collection/components/pds-modal/stories/pds-modal.stories.js +415 -0
- package/dist/collection/components/pds-modal/test/mock-pds-modal.js +256 -0
- package/dist/collection/components/pds-modal/test/mock-pds-modal.js.map +1 -0
- package/dist/collection/components/pds-popover/pds-popover.js +33 -1
- package/dist/collection/components/pds-popover/pds-popover.js.map +1 -1
- package/dist/collection/components/pds-progress/pds-progress.js +1 -1
- package/dist/collection/components/pds-radio/pds-radio.js +3 -3
- package/dist/collection/components/pds-row/pds-row.js +1 -1
- package/dist/collection/components/pds-select/pds-select.css +34 -4
- package/dist/collection/components/pds-select/pds-select.js +20 -2
- package/dist/collection/components/pds-select/pds-select.js.map +1 -1
- package/dist/collection/components/pds-select/stories/pds-select.stories.js +2 -0
- package/dist/collection/components/pds-sortable/pds-sortable-item/pds-sortable-item.js +1 -1
- package/dist/collection/components/pds-sortable/pds-sortable.js +1 -1
- package/dist/collection/components/pds-switch/pds-switch.js +3 -3
- package/dist/collection/components/pds-table/pds-table-body/pds-table-body.js +1 -1
- package/dist/collection/components/pds-table/pds-table-cell/pds-table-cell.js +2 -2
- package/dist/collection/components/pds-table/pds-table-head/pds-table-head.js +1 -1
- package/dist/collection/components/pds-table/pds-table-head-cell/pds-table-head-cell.js +2 -2
- package/dist/collection/components/pds-table/pds-table-row/pds-table-row.js +1 -1
- package/dist/collection/components/pds-table/pds-table.js +1 -1
- package/dist/collection/components/pds-tabs/pds-tab/pds-tab.js +3 -3
- package/dist/collection/components/pds-tabs/pds-tabpanel/pds-tabpanel.js +1 -1
- package/dist/collection/components/pds-tabs/pds-tabs.js +1 -1
- package/dist/collection/components/pds-text/pds-text.js +2 -2
- package/dist/collection/components/pds-text/pds-text.js.map +1 -1
- package/dist/collection/components/pds-textarea/pds-textarea.js +4 -4
- package/dist/collection/components/pds-toast/pds-toast.css +153 -0
- package/dist/collection/components/pds-toast/pds-toast.js +263 -0
- package/dist/collection/components/pds-toast/pds-toast.js.map +1 -0
- package/dist/collection/components/pds-toast/stories/pds-toast.stories.js +103 -0
- package/dist/collection/components/pds-tooltip/pds-tooltip.css +2 -12
- package/dist/collection/components/pds-tooltip/pds-tooltip.js +227 -26
- package/dist/collection/components/pds-tooltip/pds-tooltip.js.map +1 -1
- package/dist/collection/components/pds-tooltip/stories/pds-tooltip.stories.js +7 -3
- package/dist/collection/utils/interfaces.js +2 -0
- package/dist/collection/utils/interfaces.js.map +1 -0
- package/dist/collection/utils/overlay.js +66 -49
- package/dist/collection/utils/overlay.js.map +1 -1
- package/dist/collection/utils/utils.js +3 -2
- package/dist/collection/utils/utils.js.map +1 -1
- package/dist/docs.json +1816 -200
- package/dist/esm/{index-_4gljHh-.js → index-DpOSrebJ.js} +3 -3
- package/dist/esm/index-DpOSrebJ.js.map +1 -0
- package/dist/esm/loader.js +1 -1
- package/dist/esm/mock-pds-modal.entry.js +84 -0
- package/dist/esm/mock-pds-modal.entry.js.map +1 -0
- package/dist/esm/pds-accordion.entry.js +1 -1
- package/dist/esm/pds-alert.entry.js +64 -0
- package/dist/esm/pds-alert.entry.js.map +1 -0
- package/dist/esm/pds-avatar.entry.js +2 -2
- package/dist/esm/pds-box.entry.js +2 -2
- package/dist/esm/pds-box.entry.js.map +1 -1
- package/dist/esm/pds-button.entry.js +3 -3
- package/dist/esm/pds-button.entry.js.map +1 -1
- package/dist/esm/pds-checkbox.entry.js +4 -4
- package/dist/esm/pds-chip.entry.js +21 -7
- package/dist/esm/pds-chip.entry.js.map +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 +80 -0
- package/dist/esm/pds-dropdown-menu-item.entry.js.map +1 -0
- package/dist/esm/pds-dropdown-menu-separator.entry.js +23 -0
- package/dist/esm/pds-dropdown-menu-separator.entry.js.map +1 -0
- package/dist/esm/pds-dropdown-menu.entry.js +1572 -0
- package/dist/esm/pds-dropdown-menu.entry.js.map +1 -0
- package/dist/esm/pds-image.entry.js +2 -2
- package/dist/esm/pds-input.entry.js +88 -21
- package/dist/esm/pds-input.entry.js.map +1 -1
- package/dist/esm/pds-link.entry.js +16 -4
- package/dist/esm/pds-link.entry.js.map +1 -1
- package/dist/esm/pds-loader.entry.js +1 -1
- package/dist/esm/pds-modal-content.entry.js +91 -0
- package/dist/esm/pds-modal-content.entry.js.map +1 -0
- package/dist/esm/pds-modal-footer.entry.js +18 -0
- package/dist/esm/pds-modal-footer.entry.js.map +1 -0
- package/dist/esm/pds-modal-header.entry.js +18 -0
- package/dist/esm/pds-modal-header.entry.js.map +1 -0
- package/dist/esm/pds-modal.entry.js +251 -0
- package/dist/esm/pds-modal.entry.js.map +1 -0
- package/dist/esm/pds-popover.entry.js +33 -1
- package/dist/esm/pds-popover.entry.js.map +1 -1
- package/dist/esm/pds-progress.entry.js +1 -1
- package/dist/esm/pds-radio.entry.js +4 -4
- package/dist/esm/pds-row.entry.js +1 -1
- package/dist/esm/pds-select.entry.js +3 -4
- package/dist/esm/pds-select.entry.js.map +1 -1
- 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 +4 -4
- package/dist/esm/pds-tab.entry.js +3 -3
- package/dist/esm/pds-table-body.entry.js +1 -1
- package/dist/esm/pds-table-cell.entry.js +2 -2
- package/dist/esm/pds-table-head-cell.entry.js +3 -3
- 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 +1 -1
- package/dist/esm/pds-tabs.entry.js +1 -1
- package/dist/esm/pds-text.entry.js +2 -2
- package/dist/esm/pds-text.entry.js.map +1 -1
- package/dist/esm/pds-textarea.entry.js +6 -6
- package/dist/esm/pds-toast.entry.js +102 -0
- package/dist/esm/pds-toast.entry.js.map +1 -0
- package/dist/esm/pds-tooltip.entry.js +297 -79
- package/dist/esm/pds-tooltip.entry.js.map +1 -1
- package/dist/esm/pine-core.js +1 -1
- package/dist/esm/{utils-Dw9B1JDC.js → utils-DkabwBZT.js} +5 -4
- package/dist/esm/utils-DkabwBZT.js.map +1 -0
- package/dist/esm-es5/{index-_4gljHh-.js → index-DpOSrebJ.js} +1 -1
- package/dist/esm-es5/index-DpOSrebJ.js.map +1 -0
- package/dist/esm-es5/loader.js +1 -1
- package/dist/esm-es5/mock-pds-modal.entry.js +2 -0
- package/dist/esm-es5/mock-pds-modal.entry.js.map +1 -0
- package/dist/esm-es5/pds-accordion.entry.js +1 -1
- package/dist/esm-es5/pds-alert.entry.js +2 -0
- package/dist/esm-es5/pds-alert.entry.js.map +1 -0
- 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-box.entry.js.map +1 -1
- package/dist/esm-es5/pds-button.entry.js +1 -1
- package/dist/esm-es5/pds-button.entry.js.map +1 -1
- package/dist/esm-es5/pds-checkbox.entry.js +1 -1
- package/dist/esm-es5/pds-chip.entry.js +1 -1
- package/dist/esm-es5/pds-chip.entry.js.map +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 +2 -0
- package/dist/esm-es5/pds-dropdown-menu-item.entry.js.map +1 -0
- package/dist/esm-es5/pds-dropdown-menu-separator.entry.js +2 -0
- package/dist/esm-es5/pds-dropdown-menu-separator.entry.js.map +1 -0
- package/dist/esm-es5/pds-dropdown-menu.entry.js +2 -0
- package/dist/esm-es5/pds-dropdown-menu.entry.js.map +1 -0
- package/dist/esm-es5/pds-image.entry.js +1 -1
- package/dist/esm-es5/pds-input.entry.js +1 -1
- package/dist/esm-es5/pds-input.entry.js.map +1 -1
- package/dist/esm-es5/pds-link.entry.js +1 -1
- package/dist/esm-es5/pds-link.entry.js.map +1 -1
- package/dist/esm-es5/pds-loader.entry.js +1 -1
- package/dist/esm-es5/pds-modal-content.entry.js +2 -0
- package/dist/esm-es5/pds-modal-content.entry.js.map +1 -0
- package/dist/esm-es5/pds-modal-footer.entry.js +2 -0
- package/dist/esm-es5/pds-modal-footer.entry.js.map +1 -0
- package/dist/esm-es5/pds-modal-header.entry.js +2 -0
- package/dist/esm-es5/pds-modal-header.entry.js.map +1 -0
- package/dist/esm-es5/pds-modal.entry.js +2 -0
- package/dist/esm-es5/pds-modal.entry.js.map +1 -0
- package/dist/esm-es5/pds-popover.entry.js +1 -1
- package/dist/esm-es5/pds-popover.entry.js.map +1 -1
- package/dist/esm-es5/pds-progress.entry.js +1 -1
- package/dist/esm-es5/pds-radio.entry.js +1 -1
- package/dist/esm-es5/pds-row.entry.js +1 -1
- package/dist/esm-es5/pds-select.entry.js +1 -1
- package/dist/esm-es5/pds-select.entry.js.map +1 -1
- package/dist/esm-es5/pds-sortable-item.entry.js +1 -1
- package/dist/esm-es5/pds-sortable.entry.js +1 -1
- package/dist/esm-es5/pds-switch.entry.js +1 -1
- package/dist/esm-es5/pds-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-text.entry.js.map +1 -1
- package/dist/esm-es5/pds-textarea.entry.js +1 -1
- package/dist/esm-es5/pds-toast.entry.js +2 -0
- package/dist/esm-es5/pds-toast.entry.js.map +1 -0
- package/dist/esm-es5/pds-tooltip.entry.js +1 -1
- package/dist/esm-es5/pds-tooltip.entry.js.map +1 -1
- package/dist/esm-es5/pine-core.js +1 -1
- package/dist/esm-es5/utils-DkabwBZT.js +2 -0
- package/dist/esm-es5/utils-DkabwBZT.js.map +1 -0
- package/dist/pine-core/mock-pds-modal.entry.esm.js.map +1 -0
- package/dist/pine-core/{p-BjCOR1Nn.system.js.map → p--YvWqEjm.system.js.map} +1 -1
- package/dist/pine-core/p-00599bd8.entry.js +2 -0
- package/dist/pine-core/p-00599bd8.entry.js.map +1 -0
- package/dist/pine-core/{p-a14c8ab4.system.entry.js → p-03d8cb4c.system.entry.js} +2 -2
- package/dist/pine-core/{p-f94703c9.entry.js → p-04195bdb.entry.js} +2 -2
- package/dist/pine-core/p-065208a1.system.entry.js +2 -0
- package/dist/pine-core/p-065208a1.system.entry.js.map +1 -0
- package/dist/pine-core/p-07f45626.entry.js +2 -0
- package/dist/pine-core/p-07f45626.entry.js.map +1 -0
- package/dist/pine-core/{p-0486ad57.entry.js → p-0a11384e.entry.js} +2 -2
- package/dist/pine-core/p-0a87e2fc.system.entry.js +2 -0
- package/dist/pine-core/p-0a87e2fc.system.entry.js.map +1 -0
- package/dist/pine-core/p-0c30661b.system.entry.js +2 -0
- package/dist/pine-core/p-0c30661b.system.entry.js.map +1 -0
- package/dist/pine-core/{p-82e05dcf.entry.js → p-10e2feff.entry.js} +2 -2
- package/dist/pine-core/{p-d2110923.system.entry.js → p-111e7da2.system.entry.js} +2 -2
- package/dist/pine-core/{p-1178485a.system.entry.js → p-13481ef5.system.entry.js} +2 -2
- package/dist/pine-core/{p-1178485a.system.entry.js.map → p-13481ef5.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-68de979e.entry.js → p-19c01019.entry.js} +2 -2
- package/dist/pine-core/p-1d395d27.entry.js +2 -0
- package/dist/pine-core/p-1d395d27.entry.js.map +1 -0
- package/dist/pine-core/{p-4ff0838c.entry.js → p-2007a0b5.entry.js} +2 -2
- package/dist/pine-core/{p-fed4c0c0.system.entry.js → p-27c0ffda.system.entry.js} +2 -2
- package/dist/pine-core/p-35917a1a.entry.js +2 -0
- package/dist/pine-core/p-39a31730.system.entry.js +2 -0
- package/dist/pine-core/p-39a31730.system.entry.js.map +1 -0
- package/dist/pine-core/p-3D0orTx_.system.js.map +1 -0
- package/dist/pine-core/p-3ea415b0.entry.js +2 -0
- package/dist/pine-core/p-3ea415b0.entry.js.map +1 -0
- package/dist/pine-core/p-44f10d3c.entry.js +2 -0
- package/dist/pine-core/p-44f10d3c.entry.js.map +1 -0
- package/dist/pine-core/p-47a7a65b.entry.js +2 -0
- package/dist/pine-core/p-47a7a65b.entry.js.map +1 -0
- package/dist/pine-core/{p-ca09f86a.system.entry.js → p-4b2aab79.system.entry.js} +2 -2
- package/dist/pine-core/p-513c16c7.entry.js +2 -0
- package/dist/pine-core/p-513c16c7.entry.js.map +1 -0
- package/dist/pine-core/{p-950427b2.entry.js → p-51cc93b3.entry.js} +2 -2
- package/dist/pine-core/p-5367f477.system.entry.js +2 -0
- package/dist/pine-core/{p-ceb48b05.system.entry.js → p-593df966.system.entry.js} +2 -2
- package/dist/pine-core/p-5a437fcd.system.entry.js +2 -0
- package/dist/pine-core/p-5a437fcd.system.entry.js.map +1 -0
- package/dist/pine-core/p-5c4aceb7.entry.js +2 -0
- package/dist/pine-core/p-5c4aceb7.entry.js.map +1 -0
- package/dist/pine-core/{p-598ade79.entry.js → p-5e1e7762.entry.js} +2 -2
- package/dist/pine-core/{p-9cdd57de.entry.js → p-60fbeb1c.entry.js} +2 -2
- package/dist/pine-core/p-624db3d6.system.entry.js +2 -0
- package/dist/pine-core/p-624db3d6.system.entry.js.map +1 -0
- package/dist/pine-core/p-65a875f6.entry.js +2 -0
- package/dist/pine-core/p-65a875f6.entry.js.map +1 -0
- package/dist/pine-core/{p-c0f0b368.system.entry.js → p-6a7936e7.system.entry.js} +2 -2
- package/dist/pine-core/{p-a97952fc.system.entry.js → p-73412ca9.system.entry.js} +2 -2
- package/dist/pine-core/{p-a97952fc.system.entry.js.map → p-73412ca9.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-b390c427.entry.js → p-76e35041.entry.js} +2 -2
- package/dist/pine-core/{p-12bee2e5.entry.js → p-76f7cf21.entry.js} +2 -2
- package/dist/pine-core/{p-103b62a1.system.entry.js → p-78327c08.system.entry.js} +2 -2
- package/dist/pine-core/{p-792355e6.entry.js → p-78f29270.entry.js} +2 -2
- package/dist/pine-core/p-79cb7835.system.entry.js +2 -0
- package/dist/pine-core/p-79cb7835.system.entry.js.map +1 -0
- package/dist/pine-core/{p-fd9aa739.system.entry.js → p-7bb3a5d4.system.entry.js} +2 -2
- package/dist/pine-core/{p-e88d58f4.entry.js → p-80f36506.entry.js} +2 -2
- package/dist/pine-core/{p-eda0dc79.entry.js → p-8180b641.entry.js} +2 -2
- package/dist/pine-core/{p-85073252.system.entry.js → p-833b2170.system.entry.js} +2 -2
- package/dist/pine-core/p-86329612.entry.js +2 -0
- package/dist/pine-core/p-86329612.entry.js.map +1 -0
- package/dist/pine-core/p-8b6b0db7.entry.js +2 -0
- package/dist/pine-core/p-8b6b0db7.entry.js.map +1 -0
- package/dist/pine-core/p-8f06b020.entry.js +2 -0
- package/dist/pine-core/p-8f06b020.entry.js.map +1 -0
- package/dist/pine-core/p-942fa145.system.entry.js +2 -0
- package/dist/pine-core/p-942fa145.system.entry.js.map +1 -0
- package/dist/pine-core/{p-1d92261f.system.entry.js → p-959c8247.system.entry.js} +2 -2
- package/dist/pine-core/{p-5763df39.system.entry.js → p-96e9774e.system.entry.js} +2 -2
- package/dist/pine-core/{p-e281ac09.entry.js → p-99b5e1a5.entry.js} +2 -2
- package/dist/pine-core/p-9c01e81b.system.entry.js +2 -0
- package/dist/pine-core/p-9c01e81b.system.entry.js.map +1 -0
- package/dist/pine-core/p-9db1f179.entry.js +2 -0
- package/dist/pine-core/p-9db1f179.entry.js.map +1 -0
- package/dist/pine-core/p-A4_UN20E.system.js.map +1 -0
- package/dist/pine-core/p-B2gfQpwn.system.js.map +1 -0
- package/dist/pine-core/{p-CDhmuxC9.system.js.map → p-B5JFBYFw.system.js.map} +1 -1
- package/dist/pine-core/p-B5LBNcOw.system.js.map +1 -0
- package/dist/pine-core/{p-BJyPFOn0.system.js.map → p-BE1qV1Jc.system.js.map} +1 -1
- package/dist/pine-core/p-BEYGfY83.system.js.map +1 -0
- package/dist/pine-core/{p-B46WXJMn.system.js.map → p-BHZ6CSg4.system.js.map} +1 -1
- package/dist/pine-core/p-BHp2IZGP.system.js.map +1 -0
- package/dist/pine-core/{p-BSINexOf.system.js.map → p-BISuGf0f.system.js.map} +1 -1
- package/dist/pine-core/p-BPQAcMLl.system.js.map +1 -0
- package/dist/pine-core/{p-9niWVsdd.system.js.map → p-BaAcO8Mz.system.js.map} +1 -1
- package/dist/pine-core/p-BcuE4ZrB.system.js.map +1 -0
- package/dist/pine-core/{p-C94EgDFz.system.js → p-BhPuKJbQ.system.js} +2 -2
- package/dist/pine-core/p-BhPuKJbQ.system.js.map +1 -0
- package/dist/pine-core/p-BsL2GDnH.system.js +1 -1
- package/dist/pine-core/{p-DEsea81X.system.js.map → p-BwHnCFqU.system.js.map} +1 -1
- package/dist/pine-core/{p-DVVPJPOu.system.js.map → p-BxBtA60x.system.js.map} +1 -1
- package/dist/pine-core/{p-kMnJefdU.system.js.map → p-C0oRS1F9.system.js.map} +1 -1
- package/dist/pine-core/{p-eKz-xVcI.system.js.map → p-C2d75seA.system.js.map} +1 -1
- package/dist/pine-core/{p-BgcVBzVE.system.js.map → p-CGABEyvz.system.js.map} +1 -1
- package/dist/pine-core/{p-DkJgkLjR.system.js.map → p-CIc_XeAg.system.js.map} +1 -1
- package/dist/pine-core/p-CNYB6FL-.system.js.map +1 -0
- package/dist/pine-core/{p-BW-n3jjz.system.js.map → p-CNkajx9x.system.js.map} +1 -1
- package/dist/pine-core/{p-Dz6toWDZ.system.js.map → p-CS2nVL5p.system.js.map} +1 -1
- package/dist/pine-core/{p-BFPxUBwH.system.js.map → p-CTPMEWZT.system.js.map} +1 -1
- package/dist/pine-core/{p-Cg0JSYH5.system.js.map → p-CTWkFhWu.system.js.map} +1 -1
- package/dist/pine-core/{p-BoNavS-S.system.js.map → p-CcsZC7UR.system.js.map} +1 -1
- package/dist/pine-core/{p-D8WAvG2e.system.js.map → p-CdzfTGbZ.system.js.map} +1 -1
- package/dist/pine-core/p-CkoeYrxa.system.js.map +1 -0
- package/dist/pine-core/p-ClVQjta4.system.js.map +1 -0
- package/dist/pine-core/{p-C0cdB2AV.system.js.map → p-D2UtaGL2.system.js.map} +1 -1
- package/dist/pine-core/{p-YuC61pNM.system.js.map → p-DGyATOIf.system.js.map} +1 -1
- package/dist/pine-core/p-DMeT5CsE.system.js.map +1 -0
- package/dist/pine-core/p-DVhX1_nD.system.js.map +1 -0
- package/dist/pine-core/p-DeW-6a7f.system.js.map +1 -0
- package/dist/pine-core/{p-Cj21y714.system.js.map → p-DgTp_KeO.system.js.map} +1 -1
- package/dist/pine-core/p-DjXmy34u.system.js.map +1 -0
- package/dist/pine-core/p-DkabwBZT.js +2 -0
- package/dist/pine-core/p-DkabwBZT.js.map +1 -0
- package/dist/pine-core/{p-_4gljHh-.js → p-DpOSrebJ.js} +1 -1
- package/dist/pine-core/p-DpOSrebJ.js.map +1 -0
- package/dist/pine-core/{p-B4W0_y2p.system.js → p-DyDReOdO.system.js} +1 -1
- package/dist/pine-core/p-DyDReOdO.system.js.map +1 -0
- package/dist/pine-core/{p-IK9NvSRG.system.js.map → p-EqAbQY8l.system.js.map} +1 -1
- package/dist/pine-core/p-Ke8SGZqs.system.js.map +1 -0
- package/dist/pine-core/{p-CmTz2SvK.system.js.map → p-Mqxw-gWj.system.js.map} +1 -1
- package/dist/pine-core/{p-BVNW4NmT.system.js.map → p-PPIMiuZX.system.js.map} +1 -1
- package/dist/pine-core/p-PkSWq78_.system.js.map +1 -0
- package/dist/pine-core/{p-w3zTyPF1.system.js.map → p-UhZHDNH2.system.js.map} +1 -1
- package/dist/pine-core/p-a52b1413.entry.js +2 -0
- package/dist/pine-core/p-a52b1413.entry.js.map +1 -0
- package/dist/pine-core/{p-7b6b354a.system.entry.js → p-a556a328.system.entry.js} +2 -2
- package/dist/pine-core/{p-c7d4f436.system.entry.js → p-a98cda38.system.entry.js} +2 -2
- package/dist/pine-core/{p-c838b6ef.system.entry.js → p-ab7e4700.system.entry.js} +2 -2
- package/dist/pine-core/{p-6147b1ea.system.entry.js → p-aeaae417.system.entry.js} +2 -2
- package/dist/pine-core/{p-b902f535.entry.js → p-b2820acd.entry.js} +2 -2
- package/dist/pine-core/{p-f439922f.entry.js → p-bf699bad.entry.js} +2 -2
- package/dist/pine-core/{p-f439922f.entry.js.map → p-bf699bad.entry.js.map} +1 -1
- package/dist/pine-core/p-c1909a5d.system.entry.js +2 -0
- package/dist/pine-core/{p-9d0c1b2e.system.entry.js.map → p-c1909a5d.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-e045e337.system.entry.js → p-c551191a.system.entry.js} +2 -2
- package/dist/pine-core/p-c5e1ed09.system.entry.js +2 -0
- package/dist/pine-core/p-c5e1ed09.system.entry.js.map +1 -0
- package/dist/pine-core/{p-596e0292.system.entry.js → p-cc21ddcc.system.entry.js} +2 -2
- package/dist/pine-core/p-d0adaca0.system.entry.js +2 -0
- package/dist/pine-core/p-d0adaca0.system.entry.js.map +1 -0
- package/dist/pine-core/{p-6ad460a7.entry.js → p-d28768d1.entry.js} +2 -2
- package/dist/pine-core/{p-5c396e75.entry.js → p-d35b3494.entry.js} +2 -2
- package/dist/pine-core/{p-98181fa8.system.entry.js → p-d553e05c.system.entry.js} +2 -2
- package/dist/pine-core/{p-a952d40c.system.entry.js → p-d6d453d8.system.entry.js} +2 -2
- package/dist/pine-core/p-dcda4ff5.system.entry.js +2 -0
- package/dist/pine-core/p-dcda4ff5.system.entry.js.map +1 -0
- package/dist/pine-core/p-ddcc4932.entry.js +2 -0
- package/dist/pine-core/{p-ed8c3064.system.entry.js → p-de550d9e.system.entry.js} +2 -2
- package/dist/pine-core/p-dfd5a5b6.system.entry.js +2 -0
- package/dist/pine-core/p-dfd5a5b6.system.entry.js.map +1 -0
- package/dist/pine-core/p-e562ad73.system.entry.js +2 -0
- package/dist/pine-core/p-e562ad73.system.entry.js.map +1 -0
- package/dist/pine-core/p-e9f004c5.entry.js +2 -0
- package/dist/pine-core/p-e9f004c5.entry.js.map +1 -0
- package/dist/pine-core/p-ef9ed75a.system.entry.js +2 -0
- package/dist/pine-core/p-ef9ed75a.system.entry.js.map +1 -0
- package/dist/pine-core/{p-4b59cae8.entry.js → p-f256dd8a.entry.js} +2 -2
- package/dist/pine-core/{p-4b59cae8.entry.js.map → p-f256dd8a.entry.js.map} +1 -1
- package/dist/pine-core/{p-b68cb43d.system.entry.js → p-f46c4618.system.entry.js} +2 -2
- package/dist/pine-core/p-f4fff209.system.entry.js +2 -0
- package/dist/pine-core/p-f4fff209.system.entry.js.map +1 -0
- package/dist/pine-core/{p-3ce8eb9f.entry.js → p-f6b226df.entry.js} +2 -2
- package/dist/pine-core/{p-6a716bff.entry.js → p-f99c59a8.entry.js} +2 -2
- package/dist/pine-core/{p-1b81a8ec.entry.js → p-fb1eb0c4.entry.js} +2 -2
- package/dist/pine-core/{p-8305cd4d.entry.js → p-fb2fb435.entry.js} +2 -2
- package/dist/pine-core/p-fd1ef1e1.entry.js +2 -0
- package/dist/pine-core/p-fd1ef1e1.entry.js.map +1 -0
- package/dist/pine-core/p-fdf3a5ff.entry.js +2 -0
- package/dist/pine-core/{p-d5838288.entry.js.map → p-fdf3a5ff.entry.js.map} +1 -1
- package/dist/pine-core/p-fed5f55e.system.entry.js +2 -0
- package/dist/pine-core/pds-alert.entry.esm.js.map +1 -0
- package/dist/pine-core/pds-box.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-button.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-chip.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-dropdown-menu-item.entry.esm.js.map +1 -0
- package/dist/pine-core/pds-dropdown-menu-separator.entry.esm.js.map +1 -0
- package/dist/pine-core/pds-dropdown-menu.entry.esm.js.map +1 -0
- package/dist/pine-core/pds-input.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-link.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-modal-content.entry.esm.js.map +1 -0
- package/dist/pine-core/pds-modal-footer.entry.esm.js.map +1 -0
- package/dist/pine-core/pds-modal-header.entry.esm.js.map +1 -0
- package/dist/pine-core/pds-modal.entry.esm.js.map +1 -0
- package/dist/pine-core/pds-popover.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-select.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-text.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-toast.entry.esm.js.map +1 -0
- package/dist/pine-core/pds-tooltip.entry.esm.js.map +1 -1
- package/dist/pine-core/pine-core.esm.js +1 -1
- package/dist/types/components/pds-alert/pds-alert.d.ts +39 -0
- package/dist/types/components/pds-box/pds-box.d.ts +6 -6
- package/dist/types/components/pds-chip/pds-chip.d.ts +9 -1
- package/dist/types/components/pds-dropdown-menu/pds-dropdown-menu-item/pds-dropdown-menu-item.d.ts +43 -0
- package/dist/types/components/pds-dropdown-menu/pds-dropdown-menu-separator/pds-dropdown-menu-separator.d.ts +13 -0
- package/dist/types/components/pds-dropdown-menu/pds-dropdown-menu.d.ts +33 -0
- package/dist/types/components/pds-input/pds-input.d.ts +57 -9
- package/dist/types/components/pds-link/pds-link.d.ts +5 -0
- package/dist/types/components/pds-modal/pds-modal-content/pds-modal-content.d.ts +25 -0
- package/dist/types/components/pds-modal/pds-modal-footer/pds-modal-footer.d.ts +3 -0
- package/dist/types/components/pds-modal/pds-modal-header/pds-modal-header.d.ts +3 -0
- package/dist/types/components/pds-modal/pds-modal.d.ts +72 -0
- package/dist/types/components/pds-modal/test/mock-pds-modal.d.ts +63 -0
- package/dist/types/components/pds-select/pds-select.d.ts +4 -0
- package/dist/types/components/pds-toast/pds-toast.d.ts +57 -0
- package/dist/types/components/pds-tooltip/pds-tooltip.d.ts +31 -3
- package/dist/types/components.d.ts +609 -20
- package/dist/types/utils/interfaces.d.ts +6 -0
- package/dist/types/utils/overlay.d.ts +3 -3
- package/dist/types/utils/utils.d.ts +1 -1
- package/hydrate/index.js +3030 -280
- package/hydrate/index.mjs +3030 -280
- package/package.json +6 -2
- package/dist/cjs/index-CG2Rr2io.js.map +0 -1
- package/dist/cjs/utils-CQKIgzWg.js.map +0 -1
- package/dist/esm/index-_4gljHh-.js.map +0 -1
- package/dist/esm/utils-Dw9B1JDC.js.map +0 -1
- package/dist/esm-es5/index-_4gljHh-.js.map +0 -1
- package/dist/esm-es5/utils-Dw9B1JDC.js +0 -2
- package/dist/esm-es5/utils-Dw9B1JDC.js.map +0 -1
- package/dist/pine-core/p-13b9ed06.system.entry.js +0 -2
- package/dist/pine-core/p-1d690915.entry.js +0 -2
- package/dist/pine-core/p-294f9b1f.entry.js +0 -2
- package/dist/pine-core/p-38246e2f.entry.js +0 -2
- package/dist/pine-core/p-38246e2f.entry.js.map +0 -1
- package/dist/pine-core/p-38d2498e.system.entry.js +0 -2
- package/dist/pine-core/p-38d2498e.system.entry.js.map +0 -1
- package/dist/pine-core/p-433c6687.system.entry.js +0 -2
- package/dist/pine-core/p-433c6687.system.entry.js.map +0 -1
- package/dist/pine-core/p-4ccd2d5e.entry.js +0 -2
- package/dist/pine-core/p-4ccd2d5e.entry.js.map +0 -1
- package/dist/pine-core/p-4e7ca704.entry.js +0 -2
- package/dist/pine-core/p-4e7ca704.entry.js.map +0 -1
- package/dist/pine-core/p-6260135d.system.entry.js +0 -2
- package/dist/pine-core/p-6260135d.system.entry.js.map +0 -1
- package/dist/pine-core/p-82151ac5.entry.js +0 -2
- package/dist/pine-core/p-82151ac5.entry.js.map +0 -1
- package/dist/pine-core/p-8337c77c.entry.js +0 -2
- package/dist/pine-core/p-8337c77c.entry.js.map +0 -1
- package/dist/pine-core/p-953f619f.system.entry.js +0 -2
- package/dist/pine-core/p-9d0c1b2e.system.entry.js +0 -2
- package/dist/pine-core/p-B4W0_y2p.system.js.map +0 -1
- package/dist/pine-core/p-Bu94kuQa.system.js.map +0 -1
- package/dist/pine-core/p-C94EgDFz.system.js.map +0 -1
- package/dist/pine-core/p-CdkqpuKd.system.js.map +0 -1
- package/dist/pine-core/p-CnoLHUtr.system.js.map +0 -1
- package/dist/pine-core/p-Cz3zRtiB.system.js.map +0 -1
- package/dist/pine-core/p-DFmUOrRG.system.js.map +0 -1
- package/dist/pine-core/p-DhwO1z4v.system.js.map +0 -1
- package/dist/pine-core/p-Dv_jWtcr.system.js.map +0 -1
- package/dist/pine-core/p-Dw9B1JDC.js +0 -2
- package/dist/pine-core/p-Dw9B1JDC.js.map +0 -1
- package/dist/pine-core/p-_4gljHh-.js.map +0 -1
- package/dist/pine-core/p-d3ab594c.system.entry.js +0 -2
- package/dist/pine-core/p-d3ab594c.system.entry.js.map +0 -1
- package/dist/pine-core/p-d5838288.entry.js +0 -2
- package/dist/pine-core/p-d78bec50.system.entry.js +0 -2
- package/dist/pine-core/p-d78bec50.system.entry.js.map +0 -1
- package/dist/pine-core/p-d8e02aa9.system.entry.js +0 -2
- package/dist/pine-core/p-d8e02aa9.system.entry.js.map +0 -1
- package/dist/pine-core/p-f4898d4f.entry.js +0 -2
- package/dist/pine-core/p-f4898d4f.entry.js.map +0 -1
- /package/dist/pine-core/{p-a14c8ab4.system.entry.js.map → p-03d8cb4c.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-f94703c9.entry.js.map → p-04195bdb.entry.js.map} +0 -0
- /package/dist/pine-core/{p-0486ad57.entry.js.map → p-0a11384e.entry.js.map} +0 -0
- /package/dist/pine-core/{p-82e05dcf.entry.js.map → p-10e2feff.entry.js.map} +0 -0
- /package/dist/pine-core/{p-d2110923.system.entry.js.map → p-111e7da2.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-68de979e.entry.js.map → p-19c01019.entry.js.map} +0 -0
- /package/dist/pine-core/{p-4ff0838c.entry.js.map → p-2007a0b5.entry.js.map} +0 -0
- /package/dist/pine-core/{p-fed4c0c0.system.entry.js.map → p-27c0ffda.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-294f9b1f.entry.js.map → p-35917a1a.entry.js.map} +0 -0
- /package/dist/pine-core/{p-ca09f86a.system.entry.js.map → p-4b2aab79.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-950427b2.entry.js.map → p-51cc93b3.entry.js.map} +0 -0
- /package/dist/pine-core/{p-953f619f.system.entry.js.map → p-5367f477.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-ceb48b05.system.entry.js.map → p-593df966.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-598ade79.entry.js.map → p-5e1e7762.entry.js.map} +0 -0
- /package/dist/pine-core/{p-9cdd57de.entry.js.map → p-60fbeb1c.entry.js.map} +0 -0
- /package/dist/pine-core/{p-c0f0b368.system.entry.js.map → p-6a7936e7.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-b390c427.entry.js.map → p-76e35041.entry.js.map} +0 -0
- /package/dist/pine-core/{p-12bee2e5.entry.js.map → p-76f7cf21.entry.js.map} +0 -0
- /package/dist/pine-core/{p-103b62a1.system.entry.js.map → p-78327c08.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-792355e6.entry.js.map → p-78f29270.entry.js.map} +0 -0
- /package/dist/pine-core/{p-fd9aa739.system.entry.js.map → p-7bb3a5d4.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-e88d58f4.entry.js.map → p-80f36506.entry.js.map} +0 -0
- /package/dist/pine-core/{p-eda0dc79.entry.js.map → p-8180b641.entry.js.map} +0 -0
- /package/dist/pine-core/{p-85073252.system.entry.js.map → p-833b2170.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-1d92261f.system.entry.js.map → p-959c8247.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-5763df39.system.entry.js.map → p-96e9774e.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-e281ac09.entry.js.map → p-99b5e1a5.entry.js.map} +0 -0
- /package/dist/pine-core/{p-7b6b354a.system.entry.js.map → p-a556a328.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-c7d4f436.system.entry.js.map → p-a98cda38.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-c838b6ef.system.entry.js.map → p-ab7e4700.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-6147b1ea.system.entry.js.map → p-aeaae417.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-b902f535.entry.js.map → p-b2820acd.entry.js.map} +0 -0
- /package/dist/pine-core/{p-e045e337.system.entry.js.map → p-c551191a.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-596e0292.system.entry.js.map → p-cc21ddcc.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-6ad460a7.entry.js.map → p-d28768d1.entry.js.map} +0 -0
- /package/dist/pine-core/{p-5c396e75.entry.js.map → p-d35b3494.entry.js.map} +0 -0
- /package/dist/pine-core/{p-98181fa8.system.entry.js.map → p-d553e05c.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-a952d40c.system.entry.js.map → p-d6d453d8.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-1d690915.entry.js.map → p-ddcc4932.entry.js.map} +0 -0
- /package/dist/pine-core/{p-ed8c3064.system.entry.js.map → p-de550d9e.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-b68cb43d.system.entry.js.map → p-f46c4618.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-3ce8eb9f.entry.js.map → p-f6b226df.entry.js.map} +0 -0
- /package/dist/pine-core/{p-6a716bff.entry.js.map → p-f99c59a8.entry.js.map} +0 -0
- /package/dist/pine-core/{p-1b81a8ec.entry.js.map → p-fb1eb0c4.entry.js.map} +0 -0
- /package/dist/pine-core/{p-8305cd4d.entry.js.map → p-fb2fb435.entry.js.map} +0 -0
- /package/dist/pine-core/{p-13b9ed06.system.entry.js.map → p-fed5f55e.system.entry.js.map} +0 -0
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{__spreadArray}from"tslib";var hasShadowDom=function(r){return!!r.shadowRoot&&!!r.attachShadow};var debounceEvent=function(r,e){var o=r._original||r;return{_original:r,emit:debounce(o.emit.bind(o),e)}};var debounce=function(r,e){if(e===void 0){e=0}var o;return function(){var a=[];for(var n=0;n<arguments.length;n++){a[n]=arguments[n]}clearTimeout(o);o=setTimeout.apply(void 0,__spreadArray([r,e],a,false))}};var setColor=function(r){var e;if(!r)return;var o={primary:"var(--pine-color-text-primary)",secondary:"var(--pine-color-text-secondary)",neutral:"var(--pine-color-text-neutral)",accent:"var(--pine-color-text-accent)",danger:"var(--pine-color-text-danger)",info:"var(--pine-color-text-info)",success:"var(--pine-color-text-success)",warning:"var(--pine-color-text-warning)"};return{"--color":(e=o[r])!==null&&e!==void 0?e:r.startsWith("--")?"var(".concat(r,")"):r}};export{debounceEvent as d,hasShadowDom as h,setColor as s};
|
|
2
|
-
//# sourceMappingURL=utils-Dw9B1JDC.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"utils-Dw9B1JDC.js","sources":["src/utils/utils.ts"],"sourcesContent":["import type { EventEmitter } from \"@stencil/core\";\n\nexport const hasShadowDom = (el: HTMLElement) => {\n return !!el.shadowRoot && !!(el as any).attachShadow\n}\n\nexport const debounceEvent = (event: EventEmitter, wait: number): EventEmitter => {\n const original = (event as any)._original || event;\n return {\n _original: event,\n emit: debounce(original.emit.bind(original), wait),\n } as EventEmitter;\n};\n\nexport const debounce = (func: (...args: any[]) => void, wait = 0) => {\n let timer: any;\n return (...args: any[]): any => {\n clearTimeout(timer);\n timer = setTimeout(func, wait, ...args);\n };\n};\n\nexport const setColor = (color: string) => {\n if (!color) return;\n\n const colors: Record<string, string> = {\n primary: 'var(--pine-color-text-primary)',\n secondary: 'var(--pine-color-text-secondary)',\n neutral: 'var(--pine-color-text-neutral)',\n accent: 'var(--pine-color-text-accent)',\n danger: 'var(--pine-color-text-danger)',\n info: 'var(--pine-color-text-info)',\n success: 'var(--pine-color-text-success)',\n warning: 'var(--pine-color-text-warning)',\n };\n\n return {\n '--color': colors[color] ?? (color.startsWith('--') ? `var(${color})` : color)\n };\n}\n"],"names":[],"mappings":"AAEa,MAAA,YAAY,GAAG,CAAC,EAAe,KAAI;IAC9C,OAAO,CAAC,CAAC,EAAE,CAAC,UAAU,IAAI,CAAC,CAAE,EAAU,CAAC,YAAY;AACtD;MAEa,aAAa,GAAG,CAAC,KAAmB,EAAE,IAAY,KAAkB;AAC/E,IAAA,MAAM,QAAQ,GAAI,KAAa,CAAC,SAAS,IAAI,KAAK;IAClD,OAAO;AACL,QAAA,SAAS,EAAE,KAAK;AAChB,QAAA,IAAI,EAAE,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC;KACnC;AACnB;AAEO,MAAM,QAAQ,GAAG,CAAC,IAA8B,EAAE,IAAI,GAAG,CAAC,KAAI;AACnE,IAAA,IAAI,KAAU;AACd,IAAA,OAAO,CAAC,GAAG,IAAW,KAAS;QAC7B,YAAY,CAAC,KAAK,CAAC;QACnB,KAAK,GAAG,UAAU,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;AACzC,KAAC;AACH,CAAC;AAEY,MAAA,QAAQ,GAAG,CAAC,KAAa,KAAI;;AACxC,IAAA,IAAI,CAAC,KAAK;QAAE;AAEZ,IAAA,MAAM,MAAM,GAA2B;AACrC,QAAA,OAAO,EAAE,gCAAgC;AACzC,QAAA,SAAS,EAAE,kCAAkC;AAC7C,QAAA,OAAO,EAAE,gCAAgC;AACzC,QAAA,MAAM,EAAE,+BAA+B;AACvC,QAAA,MAAM,EAAE,+BAA+B;AACvC,QAAA,IAAI,EAAE,6BAA6B;AACnC,QAAA,OAAO,EAAE,gCAAgC;AACzC,QAAA,OAAO,EAAE,gCAAgC;KAC1C;IAED,OAAO;QACL,SAAS,EAAE,CAAA,EAAA,GAAA,MAAM,CAAC,KAAK,CAAC,MAAI,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,IAAC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,CAAO,IAAA,EAAA,KAAK,GAAG,GAAG,KAAK;KAC9E;AACH;;;;"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
System.register(["./p-C_8VmA8d.system.js"],(function(e){"use strict";var t,a,n,i;return{setters:[function(e){t=e.r;a=e.h;n=e.H;i=e.g}],execute:function(){var s=":host{display:block}.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}";var l=e("pds_tabpanel",function(){function e(e){t(this,e);this.selected=false}e.prototype.render=function(){return a(n,{key:"aef4969e26b1f6e98eebdba3bcfe7bebe2d75e52",slot:"tabpanels"},a("div",{key:"e90ebc7253b40a7c9d5e120584e8887855d3730c",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:"79d03b545cf3fc73c54d660eb46661d5d1adbe64"})))};Object.defineProperty(e.prototype,"el",{get:function(){return i(this)},enumerable:false,configurable:true});return e}());l.style=s}}}));
|
|
2
|
-
//# sourceMappingURL=p-13b9ed06.system.entry.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,h as a,H as s,g as t}from"./p-Uh5ntVcq.js";const i=":host{display:block}.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}";const n=class{constructor(a){e(this,a);this.selected=false}render(){return a(s,{key:"aef4969e26b1f6e98eebdba3bcfe7bebe2d75e52",slot:"tabpanels"},a("div",{key:"e90ebc7253b40a7c9d5e120584e8887855d3730c",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:"79d03b545cf3fc73c54d660eb46661d5d1adbe64"})))}get el(){return t(this)}};n.style=i;export{n as pds_tabpanel};
|
|
2
|
-
//# sourceMappingURL=p-1d690915.entry.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r,h as e,H as o}from"./p-Uh5ntVcq.js";const c=":host{border-color:inherit;display:table-row-group;vertical-align:middle}";const t=class{constructor(e){r(this,e)}render(){return e(o,{key:"c01028ed3108a0404ef3da77f1cf7a3b97a40b52",role:"rowgroup"},e("slot",{key:"f8491f02e732d28b01bc9cf2436c6edca3cbfc0e"}))}};t.style=c;export{t as pds_table_body};
|
|
2
|
-
//# sourceMappingURL=p-294f9b1f.entry.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as o,c as r,h as t,H as e,g as n}from"./p-Uh5ntVcq.js";import{h as i}from"./p-Dw9B1JDC.js";import{b as a}from"./p-_4gljHh-.js";const l=":host{--button-dimension:40px;--color-border-default:transparent;--color-border-disabled:transparent;--color-border-focus:transparent;--color-border-hover:transparent;--button-loader-color:var(--color-text-default);display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle}:host([full-width=true]){display:-ms-flexbox;display:flex;width:100%}:host([full-width=true]) button{-ms-flex-pack:center;justify-content:center;width:100%}:host([full-width=true]) .pds-button__content{-ms-flex-pack:center;justify-content:center;text-align:center}:host([loading=true]){cursor:wait;pointer-events:none}:host([disabled=true]){pointer-events:none}.pds-button{--pds-loader-color:var(--color-text-default);-ms-flex-align:center;align-items:center;background-color:var(--color-background-default);border:var(--pine-border);border-color:var(--color-border-default);border-radius:var(--pine-border-radius-full);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--color-text-default);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-brand-label);letter-spacing:var(--pine-letter-spacing);min-height:var(--button-dimension);padding:var(--pine-dimension-xs) var(--pine-dimension-sm);text-decoration:none}.pds-button pds-icon{color:currentColor;fill:currentColor}.pds-button:hover{background-color:var(--color-background-hover);border-color:var(--color-border-hover)}.pds-button:focus-visible{border-color:var(--color-border-focus);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-button:disabled{background-color:var(--color-background-disabled);border-color:var(--color-border-disabled);color:var(--color-text-disabled);pointer-events:none}.pds-button--primary{--color-background-default:var(--pine-color-primary);--color-background-hover:var(--pine-color-primary-hover);--color-background-disabled:var(--pine-color-primary-disabled);--color-border-default:var(--pine-color-primary);--color-border-hover:var(--pine-color-primary-hover);--color-text-default:var(--pine-color-text-primary);--color-text-disabled:var(--pine-color-text-primary-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-primary)}.pds-button--accent{--color-background-default:var(--pine-color-accent);--color-background-hover:var(--pine-color-accent-hover);--color-background-disabled:var(--pine-color-accent-disabled);--color-border-default:var(--pine-color-accent);--color-border-hover:var(--pine-color-accent-hover);--color-text-default:var(--pine-color-text-primary);--color-text-disabled:var(--pine-color-text-accent-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-primary)}.pds-button--destructive{--color-background-default:var(--pine-color-danger);--color-background-hover:var(--pine-color-danger-hover);--color-background-disabled:var(--pine-color-danger-disabled);--color-border-default:var(--pine-color-danger);--color-border-hover:var(--pine-color-danger-hover);--color-text-default:var(--pine-color-text-primary);--color-text-disabled:var(--pine-color-text-danger-disabled);--color-outline:var(--pine-color-focus-ring-danger);--button-loader-color:var(--pine-color-text-primary)}.pds-button--destructive:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-button--secondary,.pds-button--disclosure{--color-background-default:var(--pine-color-secondary);--color-background-hover:var(--pine-color-secondary-hover);--color-background-disabled:var(--pine-color-secondary-disabled);--color-border-disabled:var(--pine-color-border-disabled);--color-border-focus:var(--pine-color-border);--color-border-hover:var(--pine-color-border-hover);--color-border-default:var(--pine-color-border);--color-text-default:var(--pine-color-text-secondary);--color-text-disabled:var(--pine-color-text-secondary-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-secondary)}.pds-button--secondary:hover,.pds-button--disclosure:hover{background-color:var(--pine-color-secondary-hover)}.pds-button--unstyled{--color-background-default:transparent;--color-background-hover:transparent;--color-background-disabled:transparent;--color-text-default:inherit;--button-loader-color:inherit;border-width:var(--pine-dimension-none);margin:var(--pine-dimension-none);min-height:auto;padding:var(--pine-dimension-none);width:inherit}.pds-button__content{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;gap:var(--pine-dimension-xs);position:relative;width:100%}.pds-button__icon{display:-ms-inline-flexbox;display:inline-flex}.pds-button__text{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex}.pds-button__icon--hidden,.pds-button__text--hidden{opacity:0}.pds-button__loader{height:var(--pine-dimension-250);left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:var(--pine-dimension-250)}.pds-button--loading{cursor:wait;pointer-events:none}.pds-button--loading .pds-button__loader pds-loader{--loader-color:var(--button-loader-color)}.pds-button--icon-only{-ms-flex-align:center;align-items:center;border-radius:var(--pine-border-radius-full);height:var(--button-dimension);-ms-flex-pack:center;justify-content:center;min-height:var(--button-dimension);min-width:var(--button-dimension);padding:var(--pine-dimension-xs);width:var(--button-dimension)}.pds-button--icon-only .pds-button__content{height:100%;-ms-flex-pack:center;justify-content:center;width:100%}.pds-button--icon-only .pds-button__text--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}";const s=class{constructor(t){o(this,t);this.pdsClick=r(this,"pdsClick");this.disabled=false;this.fullWidth=false;this.icon=null;this.iconOnly=false;this.loading=false;this.type="button";this.variant="primary";this.handleClick=o=>{if(this.loading){o.preventDefault();return}if(!this.href&&this.type!="button"){if(i(this.el)){const r=this.el.closest("form");if(r){o.preventDefault();const t=document.createElement("button");t.type=this.type;t.style.display="none";r.appendChild(t);t.click();t.remove()}}}this.pdsClick.emit(o)}}classNames(){const o=["pds-button"];if(this.variant){o.push("pds-button--"+this.variant)}if(this.iconOnly){o.push("pds-button--icon-only")}if(this.loading){o.push("pds-button--loading")}return o.join(" ")}hasSlotContent(o){const r=this.el.querySelectorAll(`[slot="${o}"]`);return r.length>0}renderStartContent(){const o=this.icon&&this.variant!=="disclosure";const r=this.hasSlotContent("start");if(Boolean(o)){return t("pds-icon",{class:this.loading?"pds-button__icon--hidden":"",name:this.icon,part:"icon","aria-hidden":"true"})}else if(Boolean(r)){return t("span",{class:`pds-button__icon ${this.loading?"pds-button__icon--hidden":""}`},t("slot",{name:"start"}))}return null}renderEndContent(){if(this.iconOnly){return null}if(this.variant==="disclosure"){return t("pds-icon",{class:this.loading?"pds-button__icon--hidden":"",icon:a,part:"caret","aria-hidden":"true"})}else if(this.hasSlotContent("end")){return t("span",{class:`pds-button__icon ${this.loading?"pds-button__icon--hidden":""}`},t("slot",{name:"end"}))}return null}render(){const o={class:this.classNames(),part:"button"};const r=()=>{if(this.href){return Object.assign(Object.assign({},o),{href:this.disabled?null:this.href,target:this.target})}return Object.assign(Object.assign({},o),{"aria-busy":this.loading?"true":null,"aria-live":this.loading?"polite":null,disabled:this.disabled,name:this.name,type:this.type,value:this.value})};const n=this.href?"a":"button";const i=this.loading||this.iconOnly;const a=t("div",{class:"pds-button__content",part:"button-content"},this.renderStartContent(),t("span",{class:`pds-button__text ${i?"pds-button__text--hidden":""}`,part:"button-text"},t("slot",null)),this.loading&&t("span",{class:"pds-button__loader"},t("pds-loader",{"is-loading":true,size:"var(--pine-font-size-body-2xl)",variant:"spinner"},"Loading...")),this.renderEndContent());return t(e,{"aria-disabled":this.disabled?"true":null,id:this.componentId,onClick:this.handleClick,variant:this.variant},t(n,Object.assign({},r()),a))}get el(){return n(this)}};s.style=l;export{s as pds_button};
|
|
2
|
-
//# sourceMappingURL=p-38246e2f.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["pdsButtonCss","PdsButton","constructor","hostRef","this","disabled","fullWidth","icon","iconOnly","loading","type","variant","handleClick","ev","preventDefault","href","hasShadowDom","el","form","closest","fakeButton","document","createElement","style","display","appendChild","click","remove","pdsClick","emit","classNames","push","join","hasSlotContent","slotName","elements","querySelectorAll","length","renderStartContent","hasIcon","hasStartSlot","Boolean","h","class","name","part","renderEndContent","caretDown","render","commonProps","attributes","Object","assign","target","value","ContentElement","hideText","content","size","Host","id","componentId","onClick"],"sources":["src/components/pds-button/pds-button.scss?tag=pds-button&encapsulation=shadow","src/components/pds-button/pds-button.tsx"],"sourcesContent":[":host {\n --button-dimension: 40px;\n --color-border-default: transparent;\n --color-border-disabled: transparent;\n --color-border-focus: transparent;\n --color-border-hover: transparent;\n --button-loader-color: var(--color-text-default);\n\n display: inline-flex;\n vertical-align: middle;\n}\n\n:host([full-width=\"true\"]) {\n display: flex;\n width: 100%;\n\n button {\n justify-content: center;\n width: 100%;\n }\n\n .pds-button__content {\n justify-content: center;\n text-align: center;\n }\n}\n\n:host([loading=\"true\"]) {\n cursor: wait;\n pointer-events: none;\n}\n\n:host([disabled=\"true\"]) {\n pointer-events: none;\n}\n\n.pds-button {\n --pds-loader-color: var(--color-text-default);\n align-items: center;\n background-color: var(--color-background-default);\n border: var(--pine-border);\n border-color: var(--color-border-default);\n border-radius: var(--pine-border-radius-full);\n box-sizing: border-box;\n color: var(--color-text-default); // Set in the variant classes below\n cursor: pointer;\n display: flex;\n font: var(--pine-typography-body-brand-label);\n letter-spacing: var(--pine-letter-spacing);\n min-height: var(--button-dimension);\n padding: var(--pine-dimension-xs) var(--pine-dimension-sm);\n text-decoration: none;\n\n pds-icon {\n color: currentColor;\n fill: currentColor;\n }\n\n &:hover {\n background-color: var(--color-background-hover);\n border-color: var(--color-border-hover);\n }\n\n &:focus-visible {\n border-color: var(--color-border-focus);\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n }\n\n &:disabled {\n background-color: var(--color-background-disabled);\n border-color: var(--color-border-disabled);\n color: var(--color-text-disabled);\n pointer-events: none;\n }\n}\n\n.pds-button--primary {\n --color-background-default: var(--pine-color-primary);\n --color-background-hover: var(--pine-color-primary-hover);\n --color-background-disabled: var(--pine-color-primary-disabled);\n --color-border-default: var(--pine-color-primary);\n --color-border-hover: var(--pine-color-primary-hover);\n --color-text-default: var(--pine-color-text-primary);\n --color-text-disabled: var(--pine-color-text-primary-disabled);\n --color-outline: var(--pine-color-focus-ring);\n --button-loader-color: var(--pine-color-text-primary);\n}\n\n.pds-button--accent {\n --color-background-default: var(--pine-color-accent);\n --color-background-hover: var(--pine-color-accent-hover);\n --color-background-disabled: var(--pine-color-accent-disabled);\n --color-border-default: var(--pine-color-accent);\n --color-border-hover: var(--pine-color-accent-hover);\n --color-text-default: var(--pine-color-text-primary);\n --color-text-disabled: var(--pine-color-text-accent-disabled);\n --color-outline: var(--pine-color-focus-ring);\n --button-loader-color: var(--pine-color-text-primary);\n}\n\n.pds-button--destructive {\n --color-background-default: var(--pine-color-danger);\n --color-background-hover: var(--pine-color-danger-hover);\n --color-background-disabled: var(--pine-color-danger-disabled);\n --color-border-default: var(--pine-color-danger);\n --color-border-hover: var(--pine-color-danger-hover);\n --color-text-default: var(--pine-color-text-primary);\n --color-text-disabled: var(--pine-color-text-danger-disabled);\n --color-outline: var(--pine-color-focus-ring-danger);\n --button-loader-color: var(--pine-color-text-primary);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n}\n\n.pds-button--secondary,\n.pds-button--disclosure {\n --color-background-default: var(--pine-color-secondary);\n --color-background-hover: var(--pine-color-secondary-hover);\n --color-background-disabled: var(--pine-color-secondary-disabled);\n --color-border-disabled: var(--pine-color-border-disabled);\n --color-border-focus: var(--pine-color-border);\n --color-border-hover: var(--pine-color-border-hover);\n --color-border-default: var(--pine-color-border);\n --color-text-default: var(--pine-color-text-secondary);\n --color-text-disabled: var(--pine-color-text-secondary-disabled);\n --color-outline: var(--pine-color-focus-ring);\n --button-loader-color: var(--pine-color-text-secondary);\n\n &:hover {\n background-color: var(--pine-color-secondary-hover);\n }\n}\n\n.pds-button--unstyled {\n --color-background-default: transparent;\n --color-background-hover: transparent;\n --color-background-disabled: transparent;\n --color-text-default: inherit;\n --button-loader-color: inherit;\n border-width: var(--pine-dimension-none);\n margin: var(--pine-dimension-none);\n min-height: auto;\n padding: var(--pine-dimension-none);\n width: inherit;\n}\n\n.pds-button__content {\n align-items: center;\n display: inline-flex;\n gap: var(--pine-dimension-xs);\n position: relative;\n width: 100%;\n}\n\n.pds-button__icon {\n display: inline-flex;\n}\n\n.pds-button__text {\n align-items: center;\n display: inline-flex;\n}\n\n.pds-button__icon--hidden,\n.pds-button__text--hidden {\n opacity: 0;\n}\n\n.pds-button__loader {\n height: var(--pine-dimension-250);\n left: 50%;\n position: absolute;\n top: 50%;\n transform: translate(-50%, -50%);\n width: var(--pine-dimension-250);\n}\n\n.pds-button--loading {\n cursor: wait;\n pointer-events: none;\n\n .pds-button__loader {\n pds-loader {\n --loader-color: var(--button-loader-color);\n }\n }\n}\n\n.pds-button--icon-only {\n align-items: center;\n border-radius: var(--pine-border-radius-full);\n height: var(--button-dimension);\n justify-content: center;\n min-height: var(--button-dimension);\n min-width: var(--button-dimension);\n padding: var(--pine-dimension-xs);\n width: var(--button-dimension);\n\n .pds-button__content {\n height: 100%;\n justify-content: center;\n width: 100%;\n }\n\n .pds-button__text--hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n }\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { hasShadowDom } from '../../utils/utils';\n\nimport { caretDown } from '@pine-ds/icons/icons';\n\n/**\n * @part button - Exposes the button element for styling.\n * @part button-content - Exposes the button content for styling.\n * @part button-text - Exposes the button text for styling.\n * @part caret - Exposes the caret icon component for styling. Appears only on the disclosure variant.\n * @part icon - Exposes the icon component for styling.\n * @slot (default) - Button text.\n * @slot start - Content to display before the button text.\n * @slot end - Content to display after the button text.\n*/\n\n@Component({\n tag: 'pds-button',\n styleUrls: ['pds-button.scss'],\n shadow: true,\n})\nexport class PdsButton {\n @Element() el: HTMLPdsButtonElement;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Determines the button's disabled state.\n * @defaultValue false\n */\n @Prop() disabled? = false;\n\n /**\n * Determines if the button should take up the full width of its container.\n * @defaultValue false\n */\n @Prop() fullWidth? = false;\n\n /**\n * If provided, renders the component as an anchor (`<a>`) element instead of a button.\n * When using href, button-specific props (type, name, value, loading) will be ignored.\n */\n @Prop() href?: string;\n\n /**\n * Displays a leading icon in the button. DEPRECATED.\n * @defaultValue null\n * @deprecated Use `start` slot instead.\n */\n @Prop() icon?: string = null;\n\n /**\n * When true, displays only the icon and visually hides the text (keeping it accessible).\n */\n @Prop() iconOnly? = false;\n\n /**\n * Determines if the button is in a loading state.\n * When true, displays a loader and hides the button text.\n * @defaultValue false\n */\n @Prop() loading? = false;\n\n /**\n * Provides the button with a submittable name.\n */\n @Prop() name?: string;\n\n /**\n * Specifies where to open the linked document when href is provided.\n * Only applies when href is set.\n */\n @Prop() target?: '_blank' | '_self' | '_parent' | '_top';\n\n /**\n * Provides button with a type.\n * @defaultValue button\n */\n @Prop() type?: 'button' | 'reset' | 'submit' = 'button';\n\n /**\n * Provides button with a submittable value\n */\n @Prop() value?: string;\n\n /**\n * Sets the style variant of the button.\n * @defaultValue primary\n */\n @Prop() variant: 'primary' | 'secondary' | 'accent' | 'disclosure' | 'destructive' | 'unstyled' = 'primary';\n\n @Event() pdsClick: EventEmitter;\n\n private handleClick = (ev: Event) => {\n if (this.loading) {\n ev.preventDefault();\n return;\n }\n\n if (!this.href && this.type != 'button') {\n // If button clicked IS NOT associated with a form\n if (hasShadowDom(this.el)) {\n const form = this.el.closest('form');\n if (form) {\n ev.preventDefault();\n\n const fakeButton = document.createElement('button');\n fakeButton.type = this.type;\n fakeButton.style.display = 'none';\n form.appendChild(fakeButton);\n fakeButton.click();\n fakeButton.remove();\n }\n }\n }\n this.pdsClick.emit(ev);\n };\n\n private classNames() {\n const classNames = ['pds-button'];\n\n if (this.variant) {\n classNames.push('pds-button--' + this.variant);\n }\n\n if (this.iconOnly) {\n classNames.push('pds-button--icon-only');\n }\n\n if (this.loading) {\n classNames.push('pds-button--loading');\n }\n\n return classNames.join(' ');\n }\n\n private hasSlotContent(slotName: string): boolean {\n const elements = this.el.querySelectorAll(`[slot=\"${slotName}\"]`);\n return elements.length > 0;\n }\n\n private renderStartContent() {\n const hasIcon = this.icon && this.variant !== 'disclosure';\n const hasStartSlot = this.hasSlotContent('start');\n\n if (Boolean(hasIcon)) {\n return (\n <pds-icon class={this.loading ? 'pds-button__icon--hidden' : ''} name={this.icon} part=\"icon\" aria-hidden=\"true\"></pds-icon>\n );\n } else if (Boolean(hasStartSlot)) {\n return <span class={`pds-button__icon ${this.loading ? 'pds-button__icon--hidden' : ''}`}><slot name=\"start\" /></span>;\n }\n\n return null;\n }\n\n private renderEndContent() {\n if (this.iconOnly) {\n return null;\n }\n\n if (this.variant === 'disclosure') {\n return (\n <pds-icon class={this.loading ? 'pds-button__icon--hidden' : ''} icon={caretDown} part=\"caret\" aria-hidden=\"true\"></pds-icon>\n );\n } else if (this.hasSlotContent('end')) {\n return <span class={`pds-button__icon ${this.loading ? 'pds-button__icon--hidden' : ''}`}><slot name=\"end\" /></span>;\n }\n\n return null;\n }\n\n render() {\n // Common props for both button and anchor elements\n const commonProps = {\n class: this.classNames(),\n part: 'button',\n };\n\n const attributes = () => {\n if (this.href) {\n return {\n // Anchor element props\n ...commonProps,\n href: this.disabled ? null : this.href,\n target: this.target,\n };\n }\n\n return {\n // Button element props\n ...commonProps,\n 'aria-busy': this.loading ? 'true' : null,\n 'aria-live': this.loading ? 'polite' : null,\n 'disabled': this.disabled,\n 'name': this.name,\n 'type': this.type,\n 'value': this.value,\n };\n };\n\n const ContentElement = this.href ? 'a' : 'button';\n\n // Hide text when loading or iconOnly is true\n const hideText = this.loading || this.iconOnly;\n\n const content = (\n <div class=\"pds-button__content\" part=\"button-content\">\n {this.renderStartContent()}\n\n <span class={`pds-button__text ${hideText ? 'pds-button__text--hidden' : ''}`} part=\"button-text\">\n <slot />\n </span>\n\n {this.loading && (\n <span class=\"pds-button__loader\">\n <pds-loader is-loading={true} size=\"var(--pine-font-size-body-2xl)\" variant=\"spinner\">\n Loading...\n </pds-loader>\n </span>\n )}\n\n {this.renderEndContent()}\n </div>\n );\n\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n id={this.componentId}\n onClick={this.handleClick}\n variant={this.variant}\n >\n <ContentElement {...attributes()}>\n {content}\n </ContentElement>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var __awaiter=this&&this.__awaiter||function(e,i,t,r){function n(e){return e instanceof t?e:new t((function(i){i(e)}))}return new(t||(t=Promise))((function(t,o){function a(e){try{l(r.next(e))}catch(e){o(e)}}function s(e){try{l(r["throw"](e))}catch(e){o(e)}}function l(e){e.done?t(e.value):n(e.value).then(a,s)}l((r=r.apply(e,i||[])).next())}))};var __generator=this&&this.__generator||function(e,i){var t={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},r,n,o,a;return a={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function s(e){return function(i){return l([e,i])}}function l(s){if(r)throw new TypeError("Generator is already executing.");while(a&&(a=0,s[0]&&(t=0)),t)try{if(r=1,n&&(o=s[0]&2?n["return"]:s[0]?n["throw"]||((o=n["return"])&&o.call(n),0):n.next)&&!(o=o.call(n,s[1])).done)return o;if(n=0,o)s=[s[0]&2,o.value];switch(s[0]){case 0:case 1:o=s;break;case 4:t.label++;return{value:s[1],done:false};case 5:t.label++;n=s[1];s=[0];continue;case 7:s=t.ops.pop();t.trys.pop();continue;default:if(!(o=t.trys,o=o.length>0&&o[o.length-1])&&(s[0]===6||s[0]===2)){t=0;continue}if(s[0]===3&&(!o||s[1]>o[0]&&s[1]<o[3])){t.label=s[1];break}if(s[0]===6&&t.label<o[1]){t.label=o[1];o=s;break}if(o&&t.label<o[2]){t.label=o[2];t.ops.push(s);break}if(o[2])t.ops.pop();t.trys.pop();continue}s=i.call(e,t)}catch(e){s=[6,e];n=0}finally{r=o=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};System.register(["./p-C_8VmA8d.system.js","./p-BG7_qxVr.system.js","./p-B4W0_y2p.system.js","./p-C94EgDFz.system.js","./p-BhQhw0S3.system.js"],(function(e){"use strict";var i,t,r,n,o,a,s,l,d,c;return{setters:[function(e){i=e.r;t=e.c;r=e.h;n=e.H;o=e.g},function(e){a=e.a;s=e.m},function(e){l=e.f},function(e){d=e.d},function(e){c=e.i}],execute:function(){var u=":host{--pine-input-color-background-danger:var(--pine-color-red-050)}";var p=":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)}";var h=":host{display:inline}:host([aria-readonly=true]) input{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}.pds-input{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.pds-input__label{-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__field{background:var(--pine-color-background-container);border:1px solid var(--pine-color-border);border-radius:var(--pine-dimension-125);color:var(--pine-color-text-active);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);padding:var(--pine-dimension-xs) var(--pine-dimension-sm);}.pds-input__field:hover:not(:disabled,.is-invalid){border:var(--pine-border-hover)}.pds-input__field:disabled{background-color:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed;}.pds-input__field:disabled::-webkit-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled:-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:hover{border-color:var(--pine-color-border-hover)}.pds-input__field:focus-visible{border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-input__field::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-input__field::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-input__field::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-input__field:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-input__field.is-invalid{background-color:var(--pine-input-color-background-danger);border-color:var(--pine-color-border-danger)}.pds-input__field.is-invalid:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-input__error-message,.pds-input__helper-message{font:var(--pine-typography-body-sm-medium);-webkit-margin-after:0;margin-block-end:0;-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-input__error-message{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}";var f=e("pds_input",function(){function e(e){var r=this;i(this,e);this.pdsBlur=t(this,"pdsBlur");this.pdsChange=t(this,"pdsChange");this.pdsFocus=t(this,"pdsFocus");this.pdsInput=t(this,"pdsInput");this.inheritedAttributes={};this.isComposing=false;this.type="text";this.value="";this.hasFocus=false;this.onInputEvent=function(e){var i=e.target;if(i){r.value=i.value||""}r.emitInputChange(e)};this.onChangeEvent=function(e){r.emitValueChange(e)};this.onBlurEvent=function(e){r.hasFocus=false;if(r.focusedValue!==r.value){r.emitValueChange(e)}r.pdsBlur.emit(e)};this.onFocusEvent=function(e){r.hasFocus=true;r.focusedValue=r.value;r.pdsFocus.emit(e)};this.onCompositionStart=function(){r.isComposing=true};this.onCompositionEnd=function(){r.isComposing=false}}e.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){if(this.nativeInput){this.nativeInput.focus()}return[2]}))}))};e.prototype.debounceChanged=function(){var e=this,i=e.pdsInput,t=e.debounce,r=e.originalPdsInput;this.pdsInput=t===undefined?r!==null&&r!==void 0?r:i:d(i,t)};e.prototype.valueChanged=function(){var e=this.nativeInput;var i=this.getValue();if(e&&e.value!==i&&!this.isComposing){e.value=i}};e.prototype.getValue=function(){return typeof this.value==="number"?this.value.toString():(this.value||"").toString()};e.prototype.emitValueChange=function(e){var i=this.value;var t=i==null?i:i.toString();this.focusedValue=t;this.pdsChange.emit({value:t,event:e})};e.prototype.emitInputChange=function(e){var i=this.value;var t=i==null?i:i.toString();this.pdsInput.emit({value:t,event:e})};e.prototype.componentWillLoad=function(){this.inheritedAttributes=Object.assign({},c(this.el))};e.prototype.componentDidLoad=function(){this.debounceChanged()};e.prototype.inputClassNames=function(){var e=["pds-input__field"];if(this.invalid&&this.invalid===true){e.push("is-invalid")}return e.join(" ")};e.prototype.render=function(){var e=this;return r(n,{key:"6e4e04c4db43e707c0681e878c1b1f73deee86ae","aria-disabled":this.disabled?"true":null,"aria-readonly":this.readonly?"true":null},r("div",{key:"6610ccb16fb657e6d97aca89b21ff2e2bc0e3fe1",class:"pds-input"},this.label&&r("label",{key:"d85cdc84dcd35abcd592e6374e1e3d080f97ab8c",class:"pds-input__label",htmlFor:this.componentId},this.label),r("input",Object.assign({key:"de33a9a5ca6901c9c745fcef9475557cfec1cf91",class:this.inputClassNames(),ref:function(i){return e.nativeInput=i},"aria-describedby":a(this.componentId,this.invalid,this.helperMessage),"aria-invalid":this.invalid?"true":undefined,autocomplete:this.autocomplete,disabled:this.disabled,id:this.componentId,name:this.name,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,type:this.type,value:this.value,onInput:this.onInputEvent,onChange:this.onChangeEvent,onBlur:this.onBlurEvent,onFocus:this.onFocusEvent,onCompositionstart:this.onCompositionStart,onCompositionend:this.onCompositionEnd},this.inheritedAttributes)),this.helperMessage&&r("p",{key:"0721204043319effd9ce7ee3fd42a81570ffbdcc",class:"pds-input__helper-message",id:s(this.componentId,"helper")},this.helperMessage),this.errorMessage&&r("p",{key:"68e71598657e55cb3ca4ad25a23b673bafe1eefb",class:"pds-input__error-message",id:s(this.componentId,"error"),"aria-live":"assertive"},r("pds-icon",{key:"9d3969d79ecd3ab4bd2a83ff775409b00f8eb3c9",icon:l,size:"small"}),this.errorMessage)))};Object.defineProperty(e.prototype,"el",{get:function(){return o(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{debounce:["debounceChanged"],value:["valueChanged"]}},enumerable:false,configurable:true});return e}());f.style=u+(p+h)}}}));
|
|
2
|
-
//# sourceMappingURL=p-38d2498e.system.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["pdsInputTokensCss","labelCss","pdsInputCss","PdsInput","exports","class_1","hostRef","_this","this","inheritedAttributes","isComposing","type","value","hasFocus","onInputEvent","ev","input","target","emitInputChange","onChangeEvent","emitValueChange","onBlurEvent","focusedValue","pdsBlur","emit","onFocusEvent","pdsFocus","onCompositionStart","onCompositionEnd","prototype","setFocus","nativeInput","focus","debounceChanged","_a","pdsInput","debounce","originalPdsInput","undefined","debounceEvent","valueChanged","getValue","toString","event","newValue","pdsChange","componentWillLoad","Object","assign","inheritAriaAttributes","el","componentDidLoad","inputClassNames","classNames","invalid","push","join","render","h","Host","key","disabled","readonly","class","label","htmlFor","componentId","ref","assignDescription","helperMessage","autocomplete","id","name","placeholder","readOnly","required","onInput","onChange","onBlur","onFocus","onCompositionstart","onCompositionend","messageId","errorMessage","icon","danger","size"],"sources":["src/components/pds-input/pds-input.tokens.scss?tag=pds-input&encapsulation=shadow","src/global/styles/utils/label.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-input/pds-input.tokens'\n",":host {\n display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n label {\n color: var(--pine-color-text-label-readonly);\n }\n}\n\nlabel {\n color: var(--pine-color-text-label);\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n display: inline;\n}\n\n:host([aria-readonly=\"true\"]) {\n input {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-readonly);\n }\n}\n\n.pds-input {\n display: flex;\n flex-direction: column;\n}\n\n.pds-input__label {\n margin-block-end: var(--pine-dimension-2xs)\n}\n\n.pds-input__field {\n background: var(--pine-color-background-container);\n border: 1px solid var(--pine-color-border);\n border-radius: var(--pine-dimension-125);\n color: var(--pine-color-text-active);\n font: var(--pine-typography-body);\n letter-spacing: var(--pine-letter-spacing);\n padding: var(--pine-dimension-xs) var(--pine-dimension-sm);\n\n &:hover:not(:disabled, .is-invalid) {\n border: var(--pine-border-hover);\n }\n\n &:disabled {\n background-color: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n color: var(--pine-color-text-disabled);\n cursor: not-allowed;\n\n /* stylelint-disable */\n &::-webkit-input-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &:-ms-input-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n /* stylelint-enable */\n }\n\n &:hover {\n border-color: var(--pine-color-border-hover);\n }\n\n &:focus-visible {\n border-color: var(--pine-color-border-active);\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n }\n\n /* stylelint-disable */\n &::-webkit-input-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &:-ms-input-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n /* stylelint-enable */\n\n &.is-invalid {\n background-color: var(--pine-input-color-background-danger);\n border-color: var(--pine-color-border-danger);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n}\n\n.pds-input__error-message,\n.pds-input__helper-message {\n font: var(--pine-typography-body-sm-medium);\n margin-block-end: 0;\n margin-block-start: var(--pine-dimension-2xs)\n}\n\n.pds-input__error-message {\n align-items: center;\n color: var(--pine-color-text-message-danger);\n display: flex;\n gap: var(--pine-dimension-2xs);\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { danger } from '@pine-ds/icons/icons';\n\nimport { debounceEvent } from '@utils/utils';\nimport { inheritAriaAttributes } from '@utils/attributes';\n\nimport type { Attributes } from '@utils/attributes';\nimport type { InputChangeEventDetail, InputInputEventDetail } from './input-interface';\n\n@Component({\n tag: 'pds-input',\n styleUrls: ['pds-input.tokens.scss', '../../global/styles/utils/label.scss', 'pds-input.scss'],\n shadow: true,\n})\nexport class PdsInput {\n private nativeInput?: HTMLInputElement;\n private inheritedAttributes: Attributes = {};\n private isComposing = false;\n /**\n * The value of the input when the input is focused.\n */\n private focusedValue?: string | number | null;\n\n private originalPdsInput?: EventEmitter<InputInputEventDetail>;\n\n @Element() el!: HTMLPdsInputElement;\n\n /**\n * Emitted when the input loses focus.\n */\n @Event() pdsBlur!: EventEmitter<FocusEvent>;\n\n /**\n *\n * Emitted when the value has changed.\n *\n * This event will not emit when programmatically setting the `value` property.\n */\n @Event() pdsChange!: EventEmitter<InputChangeEventDetail>;\n\n /**\n * Emitted when the input has focus.\n */\n @Event() pdsFocus!: EventEmitter<FocusEvent>;\n\n /**\n * Emitted when a keyboard input occurs.\n */\n @Event() pdsInput: EventEmitter<InputInputEventDetail>;\n\n /**\n * Sets focus on the native `input` in the `pds-input`. Use this method instead of the global\n * `input.focus()`.\n */\n @Method()\n async setFocus() {\n if ( this.nativeInput ) {\n this.nativeInput.focus();\n }\n }\n\n /**\n * Specifies if and how the browser provides `autocomplete` assistance for the field.\n */\n @Prop() autocomplete: string;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * Sets the number of milliseconds to wait before updating the value.\n */\n @Prop() debounce?: number;\n\n /**\n * Determines whether or not the input field is disabled.\n */\n @Prop() disabled?: boolean;\n\n /**\n * Specifies the error message and provides an error-themed treatment to the field.\n */\n @Prop() errorMessage?: string;\n\n /**\n * Displays a message or hint below the input field.\n */\n @Prop() helperMessage?: string;\n\n /**\n * Determines whether or not the input field is invalid or throws an error.\n */\n @Prop() invalid?: boolean;\n\n /**\n * Text to be displayed as the input label.\n */\n @Prop() label?: string;\n\n /**\n * Specifies the name. Submitted with the form name/value pair.\n */\n @Prop() name?: string;\n\n /**\n * Specifies a short hint that describes the expected value of the input field.\n */\n @Prop() placeholder?: string;\n\n /**\n * Determines whether or not the input field is readonly.\n */\n @Prop() readonly?: boolean;\n\n /**\n * Determines whether or not the input field is required.\n */\n @Prop() required?: boolean;\n\n /**\n * Determines the type of control that will be displayed\n * `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`, `'url'`\n * @defaultValue \"text\"\n */\n @Prop() type = 'text';\n\n /**\n * The value of the input.\n */\n @Prop({mutable: true}) value?: string | number | null = '';\n\n /**\n * Determines if the input has focus.\n */\n @State() hasFocus = false;\n\n\n @Watch('debounce')\n protected debounceChanged() {\n const { pdsInput, debounce, originalPdsInput } = this;\n\n /**\n * If debounce is undefined, we have to manually revert the pdsInput emitter in case\n * debounce used to be set to a number. Otherwise, the event would stay debounced.\n */\n this.pdsInput = debounce === undefined ? originalPdsInput ?? pdsInput : debounceEvent(pdsInput, debounce);\n }\n\n @Watch('value')\n protected valueChanged() {\n const nativeInput = this.nativeInput;\n const value = this.getValue();\n\n if (nativeInput && nativeInput.value !== value && !this.isComposing) {\n nativeInput.value = value;\n }\n }\n\n private getValue(): string {\n return typeof this.value === 'number' ? this.value.toString() : (this.value || '').toString();\n }\n\n private onInputEvent = (ev: Event) => {\n const input = ev.target as HTMLInputElement | null;\n if (input) {\n this.value = input.value || '';\n }\n this.emitInputChange(ev);\n };\n\n private onChangeEvent = (ev: Event) => {\n this.emitValueChange(ev);\n };\n\n private onBlurEvent = (ev: FocusEvent) => {\n this.hasFocus = false;\n\n if (this.focusedValue !== this.value) {\n /**\n * Emits the `pdsChange` event when the input value\n * is different than the value when the input was focused.\n */\n this.emitValueChange(ev);\n }\n\n this.pdsBlur.emit(ev);\n };\n\n private onFocusEvent = (ev: FocusEvent) => {\n this.hasFocus = true;\n this.focusedValue = this.value;\n\n this.pdsFocus.emit(ev);\n };\n\n private onCompositionStart = () => {\n this.isComposing = true;\n }\n\n private onCompositionEnd = () => {\n this.isComposing = false;\n }\n\n /**\n * Emits a pdsChange event\n */\n private emitValueChange(event?: Event) {\n const { value } = this;\n const newValue = value == null ? value : value.toString();\n\n this.focusedValue = newValue;\n this.pdsChange.emit({ value: newValue, event });\n }\n\n /**\n *\n * Emits a `pdsInput` event\n */\n private emitInputChange(event?: Event) {\n const { value } = this;\n\n // Checks for both null and undefined values\n const newValue = value == null ? value : value.toString();\n\n this.pdsInput.emit({ value: newValue, event });\n }\n\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n }\n }\n\n componentDidLoad() {\n this.debounceChanged();\n }\n\n private inputClassNames() {\n const classNames = ['pds-input__field'];\n\n if (this.invalid && this.invalid === true) {\n classNames.push('is-invalid');\n }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n aria-readonly={this.readonly ? 'true' : null}\n >\n <div class=\"pds-input\">\n {this.label &&\n <label class=\"pds-input__label\" htmlFor={this.componentId}>{this.label}</label>\n }\n <input\n class={this.inputClassNames()}\n ref={(input) => this.nativeInput = input}\n aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n autocomplete={this.autocomplete}\n disabled={this.disabled}\n id={this.componentId}\n name={this.name}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n type={this.type}\n value={this.value}\n onInput={this.onInputEvent}\n onChange={this.onChangeEvent}\n onBlur={this.onBlurEvent}\n onFocus={this.onFocusEvent}\n onCompositionstart={this.onCompositionStart}\n onCompositionend={this.onCompositionEnd}\n {...this.inheritedAttributes}\n />\n {this.helperMessage &&\n <p\n class=\"pds-input__helper-message\"\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </p>\n }\n {this.errorMessage &&\n <p\n class=\"pds-input__error-message\"\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </p>\n }\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var __awaiter=this&&this.__awaiter||function(t,o,r,i){function e(t){return t instanceof r?t:new r((function(o){o(t)}))}return new(r||(r=Promise))((function(r,a){function n(t){try{s(i.next(t))}catch(t){a(t)}}function l(t){try{s(i["throw"](t))}catch(t){a(t)}}function s(t){t.done?r(t.value):e(t.value).then(n,l)}s((i=i.apply(t,o||[])).next())}))};var __generator=this&&this.__generator||function(t,o){var r={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},i,e,a,n;return n={next:l(0),throw:l(1),return:l(2)},typeof Symbol==="function"&&(n[Symbol.iterator]=function(){return this}),n;function l(t){return function(o){return s([t,o])}}function s(l){if(i)throw new TypeError("Generator is already executing.");while(n&&(n=0,l[0]&&(r=0)),r)try{if(i=1,e&&(a=l[0]&2?e["return"]:l[0]?e["throw"]||((a=e["return"])&&a.call(e),0):e.next)&&!(a=a.call(e,l[1])).done)return a;if(e=0,a)l=[l[0]&2,a.value];switch(l[0]){case 0:case 1:a=l;break;case 4:r.label++;return{value:l[1],done:false};case 5:r.label++;e=l[1];l=[0];continue;case 7:l=r.ops.pop();r.trys.pop();continue;default:if(!(a=r.trys,a=a.length>0&&a[a.length-1])&&(l[0]===6||l[0]===2)){r=0;continue}if(l[0]===3&&(!a||l[1]>a[0]&&l[1]<a[3])){r.label=l[1];break}if(l[0]===6&&r.label<a[1]){r.label=a[1];a=l;break}if(a&&r.label<a[2]){r.label=a[2];r.ops.push(l);break}if(a[2])r.ops.pop();r.trys.pop();continue}l=o.call(t,r)}catch(t){l=[6,t];e=0}finally{i=a=0}if(l[0]&5)throw l[1];return{value:l[0]?l[1]:void 0,done:true}}};System.register(["./p-C_8VmA8d.system.js"],(function(t){"use strict";var o,r,i,e;return{setters:[function(t){o=t.r;r=t.h;i=t.H;e=t.g}],execute:function(){var a=function(t){var o=t.elem,r=t.elemPlacement,i=t.overlay,e=t.offset,a=e===void 0?8:e;if(o==undefined)return;var n=o.getBoundingClientRect();var l=i.getBoundingClientRect();if(!r||r=="")return;switch(true){case r.includes("right"):i.style.top="50%";i.style.left="calc(".concat(n.width,"px + ").concat(a,"px)");i.style.transform="translateY(-50%)";if(r.includes("start")){i.style.top="0";i.style.transform="translateY(0)"}if(r.includes("end")){i.style.bottom="0";i.style.top="initial";i.style.transform="translateY(0)"}break;case r.includes("left"):i.style.top="50%";i.style.right="calc(".concat(n.width,"px + ").concat(a,"px)");i.style.transform="translateY(-50%)";if(r.includes("start")){i.style.top="0";i.style.transform="translateY(0)"}if(r.includes("end")){i.style.bottom="0";i.style.top="initial";i.style.transform="translateY(0)"}break;case r.includes("bottom"):i.style.top="calc(".concat(n.height,"px + ").concat(a,"px)");i.style.left="50%";i.style.transform="translateX(-50%)";if(r.includes("start")){i.style.left="0";i.style.transform="translateX(0)"}if(r.includes("end")){i.style.left="initial";i.style.right="0";i.style.transform="translateX(0)"}break;case r.includes("top"):i.style.top="calc((".concat(l.height,"px + ").concat(a,"px) * -1)");i.style.left="50%";i.style.transform="translateX(-50%)";if(r.includes("start")){i.style.left="0";i.style.transform="translateX(0)"}if(r.includes("end")){i.style.left="initial";i.style.right="0";i.style.transform="translateX(0)"}break}};var n=':host{--tooltip-border-width-arrow-down:var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;--tooltip-border-width-arrow-left:var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;--tooltip-border-width-arrow-right:var(--tooltip-sizing-arrow) 0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);--tooltip-border-width-arrow-up:0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);--tooltip-sizing-arrow:6px;--tooltip-sizing-arrow-offset:14px;--tooltip-dimension-max-width:320px;display:inline-block;position:relative}:host ::slotted(*){display:-ms-flexbox;display:flex}:host ::slotted([slot=content]){display:block;max-width:var(--tooltip-dimension-max-width);white-space:normal}.pds-tooltip__content{background-color:var(--pine-color-primary);border-radius:calc(var(--pine-dimension-xs) * 1.25);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);color:var(--pine-color-text-primary);max-width:var(--tooltip-dimension-max-width);opacity:0;padding:var(--pine-dimension-xs) calc(var(--pine-dimension-md) / 2);position:absolute;visibility:hidden;width:-webkit-max-content;width:-moz-max-content;width:max-content}.pds-tooltip--is-open .pds-tooltip__content{opacity:1;visibility:visible;z-index:1}:host(.pds-tooltip--has-html-content) .pds-tooltip__content{width:auto}.pds-tooltip__content::after{border-color:transparent;border-right-color:transparent;border-style:solid;border-width:var(--tooltip-border-width-arrow-left);content:"";height:0;position:absolute;width:0}.pds-tooltip--right .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);left:calc(var(--tooltip-sizing-arrow) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--right-end .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);bottom:var(--tooltip-sizing-arrow-offset);left:calc(var(--tooltip-sizing-arrow) * -1);top:initial}.pds-tooltip--right-start .pds-tooltip__content::after{border-inline-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-left);left:calc(var(--tooltip-sizing-arrow) * -1);top:var(--tooltip-sizing-arrow-offset)}.pds-tooltip--top .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:50%;top:initial;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.pds-tooltip--top-start .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:var(--tooltip-sizing-arrow-offset);top:initial}.pds-tooltip--top-end .pds-tooltip__content::after{border-block-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-down);bottom:calc(var(--tooltip-sizing-arrow) * -1);left:initial;right:var(--tooltip-sizing-arrow-offset);top:initial}.pds-tooltip--left .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--left-end .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);bottom:var(--tooltip-sizing-arrow-offset);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:initial}.pds-tooltip--left-start .pds-tooltip__content::after{border-inline-start-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-right);left:initial;right:calc(var(--tooltip-sizing-arrow) * -1);top:var(--tooltip-sizing-arrow-offset)}.pds-tooltip--bottom .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:50%;top:calc(var(--tooltip-sizing-arrow) * -1);-webkit-transform:translateX(-50%);transform:translateX(-50%)}.pds-tooltip--bottom-end .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:initial;right:var(--tooltip-sizing-arrow-offset);top:calc(var(--tooltip-sizing-arrow) * -1)}.pds-tooltip--bottom-start .pds-tooltip__content::after{border-block-end-color:var(--pine-color-primary);border-width:var(--tooltip-border-width-arrow-up);left:var(--tooltip-sizing-arrow-offset);top:calc(var(--tooltip-sizing-arrow) * -1)}.pds-tooltip--no-arrow .pds-tooltip__content::after{border-width:0}';var l=t("pds_tooltip",function(){function t(t){var r=this;o(this,t);this.isOpen=false;this.hasArrow=true;this.htmlContent=false;this.placement="right";this.maxWidth="352px";this.opened=false;this.handleHide=function(){r.hideTooltip()};this.handleShow=function(){r.showTooltip()};this.handlePageShow=function(){r.opened=false}}t.prototype.handleOpenToggle=function(){if(this.opened){this.handleShow()}else{this.handleHide()}};t.prototype.componentWillLoad=function(){if(this.opened){this.showTooltip()}this.el.addEventListener("blur",this.handleHide,true);this.el.addEventListener("focus",this.handleShow,true)};t.prototype.componentDidLoad=function(){var t=this;window.addEventListener("pageshow",this.handlePageShow);return function(){window.removeEventListener("pageshow",t.handlePageShow)}};t.prototype.componentDidUpdate=function(){if(this.opened){this.showTooltip()}};t.prototype.componentDidRender=function(){a({elem:this.el,elemPlacement:this.placement,overlay:this.contentEl})};t.prototype.showTooltip=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.opened=true;return[2]}))}))};t.prototype.hideTooltip=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.opened=false;return[2]}))}))};t.prototype.render=function(){var t=this;return r(i,{key:"2732f2c81bc66814945206ddde15367e64a89ec2",onMouseEnter:this.handleShow,onMouseLeave:this.handleHide,onFocusin:this.handleShow,onFocusout:this.handleHide},r("div",{key:"58705f1fbb1d88b91337100ba32de07f7838be52",class:"\n pds-tooltip\n pds-tooltip--".concat(this.placement,"\n ").concat(this.htmlContent?"pds-tooltip--has-html-content":"","\n ").concat(this.opened?"pds-tooltip--is-open":"","\n ").concat(this.hasArrow?"":"pds-tooltip--no-arrow","\n ")},r("span",{key:"33e96cb4f46ebc418f79971047a37fc5c3498e0d","aria-describedby":this.componentId,class:"pds-tooltip__trigger"},r("slot",{key:"cca7b5d50e2cbc0f839a46caa5a5dc8a79f1cb15"})),r("div",{key:"22c666894f7835629e00e9c2c3964bcaf63000ae",class:"pds-tooltip__content","aria-hidden":this.opened?"false":"true","aria-live":this.opened?"polite":"off",id:this.componentId,ref:function(o){return t.contentEl=o},role:"tooltip",style:{maxWidth:this.maxWidth}},r("slot",{key:"83a805d9eef71ac261a03d56853ccc8ac7bfe818",name:"content"}),this.content)))};Object.defineProperty(t.prototype,"el",{get:function(){return e(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{opened:["handleOpenToggle"]}},enumerable:false,configurable:true});return t}());l.style=n}}}));
|
|
2
|
-
//# sourceMappingURL=p-433c6687.system.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["positionTooltip","_a","elem","elemPlacement","overlay","_b","offset","undefined","rect","getBoundingClientRect","contentRect","includes","style","top","left","concat","width","transform","bottom","right","height","pdsTooltipCss","PdsTooltip","exports","class_1","hostRef","_this","this","isOpen","hasArrow","htmlContent","placement","maxWidth","opened","handleHide","hideTooltip","handleShow","showTooltip","handlePageShow","prototype","handleOpenToggle","componentWillLoad","el","addEventListener","componentDidLoad","window","removeEventListener","componentDidUpdate","componentDidRender","contentEl","render","h","Host","key","onMouseEnter","onMouseLeave","onFocusin","onFocusout","class","componentId","id","ref","role","name","content"],"sources":["src/utils/overlay.ts","src/components/pds-tooltip/pds-tooltip.scss?tag=pds-tooltip&encapsulation=shadow","src/components/pds-tooltip/pds-tooltip.tsx"],"sourcesContent":["interface OverlayArgs {\n elem: HTMLElement;\n elemPlacement: string;\n overlay: HTMLElement;\n offset?: number;\n}\n\nexport const positionTooltip = ({elem, elemPlacement, overlay, offset = 8}: OverlayArgs) => {\n if (elem == undefined) return;\n\n const rect = elem.getBoundingClientRect();\n const contentRect = overlay.getBoundingClientRect();\n\n // Exit the function if the placement is not set\n if (!elemPlacement || elemPlacement == \"\") return;\n\n switch (true) {\n case elemPlacement.includes(\"right\"):\n overlay.style.top = '50%';\n overlay.style.left = `calc(${rect.width}px + ${offset}px)`;\n overlay.style.transform = 'translateY(-50%)';\n\n if (elemPlacement.includes(\"start\")) {\n overlay.style.top = '0';\n overlay.style.transform = 'translateY(0)';\n }\n\n if (elemPlacement.includes(\"end\")) {\n overlay.style.bottom = '0';\n overlay.style.top = 'initial';\n overlay.style.transform = 'translateY(0)';\n }\n\n break;\n\n case elemPlacement.includes(\"left\"):\n overlay.style.top = '50%';\n overlay.style.right = `calc(${rect.width}px + ${offset}px)`;\n overlay.style.transform = 'translateY(-50%)';\n\n if (elemPlacement.includes(\"start\")) {\n overlay.style.top = '0';\n overlay.style.transform = 'translateY(0)';\n }\n\n if (elemPlacement.includes(\"end\")) {\n overlay.style.bottom = '0';\n overlay.style.top = 'initial';\n overlay.style.transform = 'translateY(0)';\n }\n\n break;\n\n case elemPlacement.includes(\"bottom\"):\n overlay.style.top = `calc(${rect.height}px + ${offset}px)`;\n overlay.style.left = '50%';\n overlay.style.transform = 'translateX(-50%)';\n\n if (elemPlacement.includes(\"start\")) {\n overlay.style.left = '0';\n overlay.style.transform = 'translateX(0)';\n }\n\n if (elemPlacement.includes(\"end\")) {\n overlay.style.left = 'initial';\n overlay.style.right = '0';\n overlay.style.transform = 'translateX(0)';\n }\n\n break;\n\n case elemPlacement.includes(\"top\"):\n overlay.style.top = `calc((${contentRect.height}px + ${offset}px) * -1)`;\n overlay.style.left = '50%';\n overlay.style.transform = 'translateX(-50%)';\n\n if (elemPlacement.includes(\"start\")) {\n overlay.style.left = '0';\n overlay.style.transform = 'translateX(0)';\n }\n if (elemPlacement.includes(\"end\")) {\n overlay.style.left = 'initial';\n overlay.style.right = '0';\n overlay.style.transform = 'translateX(0)';\n }\n\n break;\n }\n}\n",":host {\n\n --tooltip-border-width-arrow-down: var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;\n --tooltip-border-width-arrow-left: var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow) 0;\n --tooltip-border-width-arrow-right: var(--tooltip-sizing-arrow) 0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);\n --tooltip-border-width-arrow-up: 0 var(--tooltip-sizing-arrow) var(--tooltip-sizing-arrow);\n\n --tooltip-sizing-arrow: 6px;\n --tooltip-sizing-arrow-offset: 14px;\n --tooltip-dimension-max-width: 320px;\n\n display: inline-block;\n position: relative;\n\n ::slotted(*) {\n display: flex;\n }\n\n ::slotted([slot=\"content\"]) {\n display: block;\n max-width: var(--tooltip-dimension-max-width);\n white-space: normal;\n }\n}\n\n.pds-tooltip__content {\n background-color: var(--pine-color-primary);\n border-radius: calc(var(--pine-dimension-xs) * 1.25);\n box-shadow: var(--pine-box-shadow);\n color: var(--pine-color-text-primary);\n // TODO: need to use block / none but the tooltip content width and height are needed for calculations\n max-width: var(--tooltip-dimension-max-width);\n opacity: 0;\n padding: var(--pine-dimension-xs) calc(var(--pine-dimension-md) / 2);\n position: absolute;\n visibility: hidden;\n width: max-content;\n\n .pds-tooltip--is-open & {\n // TODO: need to use block / none but the tooltip content width and height are needed for calculations\n opacity: 1;\n visibility: visible;\n z-index: 1;\n }\n\n :host(.pds-tooltip--has-html-content) & {\n width: auto;\n }\n\n &::after {\n border-color: transparent;\n border-right-color: transparent;\n border-style: solid;\n border-width: var(--tooltip-border-width-arrow-left);\n content: '';\n height: 0;\n position: absolute;\n width: 0;\n\n .pds-tooltip--right & {\n border-inline-end-color: var(--pine-color-primary);\n border-width: var(--tooltip-border-width-arrow-left);\n left: calc(var(--tooltip-sizing-arrow) * -1);\n top: 50%;\n transform: translateY(-50%);\n }\n\n .pds-tooltip--right-end & {\n border-inline-end-color: var(--pine-color-primary);\n border-width: var(--tooltip-border-width-arrow-left);\n bottom: var(--tooltip-sizing-arrow-offset);\n left: calc(var(--tooltip-sizing-arrow) * -1);\n top: initial;\n }\n\n .pds-tooltip--right-start & {\n border-inline-end-color: var(--pine-color-primary);\n border-width: var(--tooltip-border-width-arrow-left);\n left: calc(var(--tooltip-sizing-arrow) * -1);\n top: var(--tooltip-sizing-arrow-offset);\n }\n\n .pds-tooltip--top & {\n border-block-start-color: var(--pine-color-primary);\n border-width: var(--tooltip-border-width-arrow-down);\n bottom: calc(var(--tooltip-sizing-arrow) * -1);\n left: 50%;\n top: initial;\n transform: translateX(-50%);\n }\n\n .pds-tooltip--top-start & {\n border-block-start-color: var(--pine-color-primary);\n border-width: var(--tooltip-border-width-arrow-down);\n bottom: calc(var(--tooltip-sizing-arrow) * -1);\n left: var(--tooltip-sizing-arrow-offset);\n top: initial;\n }\n\n .pds-tooltip--top-end & {\n border-block-start-color: var(--pine-color-primary);\n border-width: var(--tooltip-border-width-arrow-down);\n bottom: calc(var(--tooltip-sizing-arrow) * -1);\n left: initial;\n right: var(--tooltip-sizing-arrow-offset);\n top: initial;\n }\n\n .pds-tooltip--left & {\n border-inline-start-color: var(--pine-color-primary);\n border-width: var(--tooltip-border-width-arrow-right);\n left: initial;\n right: calc(var(--tooltip-sizing-arrow) * -1);\n top: 50%;\n transform: translateY(-50%);\n }\n\n .pds-tooltip--left-end & {\n border-inline-start-color: var(--pine-color-primary);\n border-width: var(--tooltip-border-width-arrow-right);\n bottom: var(--tooltip-sizing-arrow-offset);\n left: initial;\n right: calc(var(--tooltip-sizing-arrow) * -1);\n top: initial;\n }\n\n .pds-tooltip--left-start & {\n border-inline-start-color: var(--pine-color-primary);\n border-width: var(--tooltip-border-width-arrow-right);\n left: initial;\n right: calc(var(--tooltip-sizing-arrow) * -1);\n top: var(--tooltip-sizing-arrow-offset);\n }\n\n .pds-tooltip--bottom & {\n border-block-end-color: var(--pine-color-primary);\n border-width: var(--tooltip-border-width-arrow-up);\n left: 50%;\n top: calc(var(--tooltip-sizing-arrow) * -1);\n transform: translateX(-50%);\n }\n\n .pds-tooltip--bottom-end & {\n border-block-end-color: var(--pine-color-primary);\n border-width: var(--tooltip-border-width-arrow-up);\n left: initial;\n right: var(--tooltip-sizing-arrow-offset);\n top: calc(var(--tooltip-sizing-arrow) * -1);\n }\n\n .pds-tooltip--bottom-start & {\n border-block-end-color: var(--pine-color-primary);\n border-width: var(--tooltip-border-width-arrow-up);\n left: var(--tooltip-sizing-arrow-offset);\n top: calc(var(--tooltip-sizing-arrow) * -1);\n }\n\n .pds-tooltip--no-arrow & {\n border-width: 0;\n }\n }\n}\n","import { Component, Element, Host, Prop, State, h, Method, Watch } from '@stencil/core';\nimport {\n positionTooltip\n} from '../../utils/overlay';\n\n/**\n * @slot (default) - The tooltip's target element\n * @slot content - HTML content for the tooltip\n */\n\n@Component({\n tag: 'pds-tooltip',\n styleUrls: ['pds-tooltip.scss'],\n shadow: true,\n})\nexport class PdsTooltip {\n private contentEl: HTMLElement | null;\n\n /**\n * Reference to the Host element\n */\n @Element() el: HTMLPdsTooltipElement;\n\n /**\n * Determines when the tooltip is open\n * @defaultValue false\n */\n @State() isOpen = false;\n\n /**\n * Content for the tooltip. If HTML is required, use the content slot\n */\n @Prop() content: string;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Determines whether or not the tooltip has an arrow\n * @defaultValue true\n */\n @Prop() hasArrow? = true;\n\n /**\n * Enable this option when using the content slot\n * @defaultValue false\n */\n @Prop() htmlContent = false;\n\n /**\n * Determines the preferred position of the tooltip\n * @defaultValue \"right\"\n */\n @Prop({ reflect: true }) placement:\n 'top'\n | 'top-start'\n | 'top-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'left'\n | 'left-start'\n | 'left-end' = 'right';\n\n /**\n * Sets the maximum width of the tooltip content\n * @defaultValue \"352px\"\n */\n @Prop() maxWidth: string = '352px';\n\n /**\n * Determines whether or not the tooltip is visible\n * @defaultValue false\n */\n @Prop({mutable: true, reflect: true}) opened = false;\n\n @Watch('opened')\n handleOpenToggle() {\n if (this.opened) {\n this.handleShow();\n } else {\n this.handleHide();\n }\n }\n\n componentWillLoad() {\n if (this.opened) {\n this.showTooltip();\n }\n\n this.el.addEventListener('blur', this.handleHide, true);\n this.el.addEventListener('focus', this.handleShow, true);\n }\n\n componentDidLoad() {\n // fix for Safari iOS back button issue\n window.addEventListener('pageshow', this.handlePageShow);\n\n return () => {\n window.removeEventListener('pageshow', this.handlePageShow);\n };\n }\n\n componentDidUpdate() {\n if (this.opened) {\n this.showTooltip();\n }\n }\n\n componentDidRender() {\n positionTooltip({elem: this.el, elemPlacement: this.placement, overlay: this.contentEl});\n }\n\n /**\n * Shows the tooltip by enabling the opened property\n */\n @Method()\n async showTooltip() {\n this.opened = true;\n }\n\n /**\n * Hides the tooltip by disabling the opened property\n */\n @Method()\n async hideTooltip() {\n this.opened = false;\n }\n\n private handleHide = () => {\n this.hideTooltip();\n };\n\n private handleShow = () => {\n this.showTooltip();\n };\n\n private handlePageShow = () => {\n this.opened = false;\n };\n\n render() {\n return (\n <Host\n onMouseEnter={this.handleShow}\n onMouseLeave={this.handleHide}\n onFocusin={this.handleShow}\n onFocusout={this.handleHide}\n >\n <div\n class={`\n pds-tooltip\n pds-tooltip--${this.placement}\n ${this.htmlContent ? 'pds-tooltip--has-html-content' : ''}\n ${this.opened ? 'pds-tooltip--is-open' : ''}\n ${this.hasArrow ? '' : 'pds-tooltip--no-arrow'}\n `}\n >\n <span\n aria-describedby={this.componentId}\n class=\"pds-tooltip__trigger\"\n >\n <slot />\n </span>\n\n <div class=\"pds-tooltip__content\"\n aria-hidden={this.opened ? 'false' : 'true'}\n aria-live={this.opened ? 'polite' : 'off'}\n id={this.componentId}\n ref={(el) => (this.contentEl = el)}\n role=\"tooltip\"\n style={{ maxWidth: this.maxWidth }}\n >\n <slot\n name=\"content\"\n ></slot>\n {this.content}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"wmDAOO,IAAMA,EAAkB,SAACC,G,IAACC,EAAID,EAAAC,KAAEC,EAAaF,EAAAE,cAAEC,EAAOH,EAAAG,QAAEC,EAAAJ,EAAAK,SAAMD,SAAA,EAAG,EAACA,EACvE,GAAIH,GAAQK,UAAW,OAEvB,IAAMC,EAAON,EAAKO,wBAClB,IAAMC,EAAcN,EAAQK,wBAG5B,IAAKN,GAAiBA,GAAiB,GAAI,OAE3C,OAAQ,MACN,KAAKA,EAAcQ,SAAS,SAC1BP,EAAQQ,MAAMC,IAAM,MACpBT,EAAQQ,MAAME,KAAO,QAAAC,OAAQP,EAAKQ,MAAK,SAAAD,OAAQT,EAAM,OACrDF,EAAQQ,MAAMK,UAAY,mBAE1B,GAAId,EAAcQ,SAAS,SAAU,CACnCP,EAAQQ,MAAMC,IAAM,IACpBT,EAAQQ,MAAMK,UAAY,e,CAG5B,GAAId,EAAcQ,SAAS,OAAQ,CACjCP,EAAQQ,MAAMM,OAAS,IACvBd,EAAQQ,MAAMC,IAAM,UACpBT,EAAQQ,MAAMK,UAAY,e,CAG5B,MAEF,KAAKd,EAAcQ,SAAS,QAC1BP,EAAQQ,MAAMC,IAAM,MACpBT,EAAQQ,MAAMO,MAAQ,QAAAJ,OAAQP,EAAKQ,MAAK,SAAAD,OAAQT,EAAM,OACtDF,EAAQQ,MAAMK,UAAY,mBAE1B,GAAId,EAAcQ,SAAS,SAAU,CACnCP,EAAQQ,MAAMC,IAAM,IACpBT,EAAQQ,MAAMK,UAAY,e,CAG5B,GAAId,EAAcQ,SAAS,OAAQ,CACjCP,EAAQQ,MAAMM,OAAS,IACvBd,EAAQQ,MAAMC,IAAM,UACpBT,EAAQQ,MAAMK,UAAY,e,CAG5B,MAEF,KAAKd,EAAcQ,SAAS,UAC1BP,EAAQQ,MAAMC,IAAM,QAAAE,OAAQP,EAAKY,OAAM,SAAAL,OAAQT,EAAM,OACrDF,EAAQQ,MAAME,KAAO,MACrBV,EAAQQ,MAAMK,UAAY,mBAE1B,GAAId,EAAcQ,SAAS,SAAU,CACnCP,EAAQQ,MAAME,KAAO,IACrBV,EAAQQ,MAAMK,UAAY,e,CAG5B,GAAId,EAAcQ,SAAS,OAAQ,CACjCP,EAAQQ,MAAME,KAAO,UACrBV,EAAQQ,MAAMO,MAAQ,IACtBf,EAAQQ,MAAMK,UAAY,e,CAG5B,MAEF,KAAKd,EAAcQ,SAAS,OAC1BP,EAAQQ,MAAMC,IAAM,SAAAE,OAASL,EAAYU,OAAM,SAAAL,OAAQT,EAAM,aAC7DF,EAAQQ,MAAME,KAAO,MACrBV,EAAQQ,MAAMK,UAAY,mBAE1B,GAAId,EAAcQ,SAAS,SAAU,CACnCP,EAAQQ,MAAME,KAAO,IACrBV,EAAQQ,MAAMK,UAAY,e,CAE5B,GAAId,EAAcQ,SAAS,OAAQ,CACjCP,EAAQQ,MAAME,KAAO,UACrBV,EAAQQ,MAAMO,MAAQ,IACtBf,EAAQQ,MAAMK,UAAY,e,CAG5B,MAEN,ECxFA,IAAMI,EAAgB,onJ,ICeTC,EAAUC,EAAA,yBALvB,SAAAC,EAAAC,GAAA,IAAAC,EAAAC,K,UAiBWA,KAAMC,OAAG,MAgBVD,KAAQE,SAAI,KAMZF,KAAWG,YAAG,MAMGH,KAASI,UAYjB,QAMTJ,KAAQK,SAAW,QAMWL,KAAMM,OAAG,MAuDvCN,KAAUO,WAAG,WACnBR,EAAKS,aACP,EAEQR,KAAUS,WAAG,WACnBV,EAAKW,aACP,EAEQV,KAAcW,eAAG,WACvBZ,EAAKO,OAAS,KAChB,CA2CD,CAzGCT,EAAAe,UAAAC,iBAAA,WACE,GAAIb,KAAKM,OAAQ,CACfN,KAAKS,Y,KACA,CACLT,KAAKO,Y,GAITV,EAAAe,UAAAE,kBAAA,WACE,GAAId,KAAKM,OAAQ,CACfN,KAAKU,a,CAGPV,KAAKe,GAAGC,iBAAiB,OAAQhB,KAAKO,WAAY,MAClDP,KAAKe,GAAGC,iBAAiB,QAAShB,KAAKS,WAAY,K,EAGrDZ,EAAAe,UAAAK,iBAAA,eAAAlB,EAAAC,KAEEkB,OAAOF,iBAAiB,WAAYhB,KAAKW,gBAEzC,OAAO,WACLO,OAAOC,oBAAoB,WAAYpB,EAAKY,eAC9C,C,EAGFd,EAAAe,UAAAQ,mBAAA,WACE,GAAIpB,KAAKM,OAAQ,CACfN,KAAKU,a,GAITb,EAAAe,UAAAS,mBAAA,WACEhD,EAAgB,CAACE,KAAMyB,KAAKe,GAAIvC,cAAewB,KAAKI,UAAW3B,QAASuB,KAAKsB,W,EAOzEzB,EAAAe,UAAAF,YAAN,W,qFACEV,KAAKM,OAAS,K,iBAOVT,EAAAe,UAAAJ,YAAN,W,qFACER,KAAKM,OAAS,M,iBAehBT,EAAAe,UAAAW,OAAA,eAAAxB,EAAAC,KACE,OACEwB,EAACC,EACC,CAAAC,IAAA,2CAAAC,aAAc3B,KAAKS,WACnBmB,aAAc5B,KAAKO,WACnBsB,UAAW7B,KAAKS,WAChBqB,WAAY9B,KAAKO,YAEjBiB,EAAA,OAAAE,IAAA,2CACEK,MAAO,uDAAA3C,OAEUY,KAAKI,UAAS,kBAAAhB,OAC3BY,KAAKG,YAAc,gCAAkC,GAAE,kBAAAf,OACvDY,KAAKM,OAAS,uBAAyB,GAAE,kBAAAlB,OACzCY,KAAKE,SAAW,GAAK,wBAAuB,iBAGhDsB,EAAA,QAAAE,IAAA,8DACoB1B,KAAKgC,YACvBD,MAAM,wBAENP,EAAA,QAAAE,IAAA,8CAGFF,EAAA,OAAAE,IAAA,2CAAKK,MAAM,uBAAsB,cAClB/B,KAAKM,OAAS,QAAU,OAAM,YAChCN,KAAKM,OAAS,SAAW,MACpC2B,GAAIjC,KAAKgC,YACTE,IAAK,SAACnB,GAAE,OAAMhB,EAAKuB,UAAYP,CAAvB,EACRoB,KAAK,UACLlD,MAAO,CAAEoB,SAAUL,KAAKK,WAExBmB,EACE,QAAAE,IAAA,2CAAAU,KAAK,YAENpC,KAAKqC,U,oPAtKK,I","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,c as i,h as s,H as t,g as o}from"./p-Uh5ntVcq.js";import{a as r,m as a}from"./p-DTL_39D_.js";import{f as l}from"./p-_4gljHh-.js";import{d as n}from"./p-Dw9B1JDC.js";import{i as d}from"./p-C0M1gTKv.js";const p=":host{--pine-input-color-background-danger:var(--pine-color-red-050)}";const c=":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)}";const h=":host{display:inline}:host([aria-readonly=true]) input{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}.pds-input{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.pds-input__label{-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-input__field{background:var(--pine-color-background-container);border:1px solid var(--pine-color-border);border-radius:var(--pine-dimension-125);color:var(--pine-color-text-active);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);padding:var(--pine-dimension-xs) var(--pine-dimension-sm);}.pds-input__field:hover:not(:disabled,.is-invalid){border:var(--pine-border-hover)}.pds-input__field:disabled{background-color:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed;}.pds-input__field:disabled::-webkit-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:disabled:-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}.pds-input__field:hover{border-color:var(--pine-color-border-hover)}.pds-input__field:focus-visible{border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-input__field::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-input__field::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-input__field::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-input__field:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-input__field.is-invalid{background-color:var(--pine-input-color-background-danger);border-color:var(--pine-color-border-danger)}.pds-input__field.is-invalid:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-input__error-message,.pds-input__helper-message{font:var(--pine-typography-body-sm-medium);-webkit-margin-after:0;margin-block-end:0;-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-input__error-message{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}";const u=class{constructor(s){e(this,s);this.pdsBlur=i(this,"pdsBlur");this.pdsChange=i(this,"pdsChange");this.pdsFocus=i(this,"pdsFocus");this.pdsInput=i(this,"pdsInput");this.inheritedAttributes={};this.isComposing=false;this.type="text";this.value="";this.hasFocus=false;this.onInputEvent=e=>{const i=e.target;if(i){this.value=i.value||""}this.emitInputChange(e)};this.onChangeEvent=e=>{this.emitValueChange(e)};this.onBlurEvent=e=>{this.hasFocus=false;if(this.focusedValue!==this.value){this.emitValueChange(e)}this.pdsBlur.emit(e)};this.onFocusEvent=e=>{this.hasFocus=true;this.focusedValue=this.value;this.pdsFocus.emit(e)};this.onCompositionStart=()=>{this.isComposing=true};this.onCompositionEnd=()=>{this.isComposing=false}}async setFocus(){if(this.nativeInput){this.nativeInput.focus()}}debounceChanged(){const{pdsInput:e,debounce:i,originalPdsInput:s}=this;this.pdsInput=i===undefined?s!==null&&s!==void 0?s:e:n(e,i)}valueChanged(){const e=this.nativeInput;const i=this.getValue();if(e&&e.value!==i&&!this.isComposing){e.value=i}}getValue(){return typeof this.value==="number"?this.value.toString():(this.value||"").toString()}emitValueChange(e){const{value:i}=this;const s=i==null?i:i.toString();this.focusedValue=s;this.pdsChange.emit({value:s,event:e})}emitInputChange(e){const{value:i}=this;const s=i==null?i:i.toString();this.pdsInput.emit({value:s,event:e})}componentWillLoad(){this.inheritedAttributes=Object.assign({},d(this.el))}componentDidLoad(){this.debounceChanged()}inputClassNames(){const e=["pds-input__field"];if(this.invalid&&this.invalid===true){e.push("is-invalid")}return e.join(" ")}render(){return s(t,{key:"6e4e04c4db43e707c0681e878c1b1f73deee86ae","aria-disabled":this.disabled?"true":null,"aria-readonly":this.readonly?"true":null},s("div",{key:"6610ccb16fb657e6d97aca89b21ff2e2bc0e3fe1",class:"pds-input"},this.label&&s("label",{key:"d85cdc84dcd35abcd592e6374e1e3d080f97ab8c",class:"pds-input__label",htmlFor:this.componentId},this.label),s("input",Object.assign({key:"de33a9a5ca6901c9c745fcef9475557cfec1cf91",class:this.inputClassNames(),ref:e=>this.nativeInput=e,"aria-describedby":r(this.componentId,this.invalid,this.helperMessage),"aria-invalid":this.invalid?"true":undefined,autocomplete:this.autocomplete,disabled:this.disabled,id:this.componentId,name:this.name,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,type:this.type,value:this.value,onInput:this.onInputEvent,onChange:this.onChangeEvent,onBlur:this.onBlurEvent,onFocus:this.onFocusEvent,onCompositionstart:this.onCompositionStart,onCompositionend:this.onCompositionEnd},this.inheritedAttributes)),this.helperMessage&&s("p",{key:"0721204043319effd9ce7ee3fd42a81570ffbdcc",class:"pds-input__helper-message",id:a(this.componentId,"helper")},this.helperMessage),this.errorMessage&&s("p",{key:"68e71598657e55cb3ca4ad25a23b673bafe1eefb",class:"pds-input__error-message",id:a(this.componentId,"error"),"aria-live":"assertive"},s("pds-icon",{key:"9d3969d79ecd3ab4bd2a83ff775409b00f8eb3c9",icon:l,size:"small"}),this.errorMessage)))}get el(){return o(this)}static get watchers(){return{debounce:["debounceChanged"],value:["valueChanged"]}}};u.style=p+(c+h);export{u as pds_input};
|
|
2
|
-
//# sourceMappingURL=p-4ccd2d5e.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["pdsInputTokensCss","labelCss","pdsInputCss","PdsInput","constructor","hostRef","this","inheritedAttributes","isComposing","type","value","hasFocus","onInputEvent","ev","input","target","emitInputChange","onChangeEvent","emitValueChange","onBlurEvent","focusedValue","pdsBlur","emit","onFocusEvent","pdsFocus","onCompositionStart","onCompositionEnd","setFocus","nativeInput","focus","debounceChanged","pdsInput","debounce","originalPdsInput","undefined","debounceEvent","valueChanged","getValue","toString","event","newValue","pdsChange","componentWillLoad","Object","assign","inheritAriaAttributes","el","componentDidLoad","inputClassNames","classNames","invalid","push","join","render","h","Host","key","disabled","readonly","class","label","htmlFor","componentId","ref","assignDescription","helperMessage","autocomplete","id","name","placeholder","readOnly","required","onInput","onChange","onBlur","onFocus","onCompositionstart","onCompositionend","messageId","errorMessage","icon","danger","size"],"sources":["src/components/pds-input/pds-input.tokens.scss?tag=pds-input&encapsulation=shadow","src/global/styles/utils/label.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-input/pds-input.tokens'\n",":host {\n display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n label {\n color: var(--pine-color-text-label-readonly);\n }\n}\n\nlabel {\n color: var(--pine-color-text-label);\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n display: inline;\n}\n\n:host([aria-readonly=\"true\"]) {\n input {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-readonly);\n }\n}\n\n.pds-input {\n display: flex;\n flex-direction: column;\n}\n\n.pds-input__label {\n margin-block-end: var(--pine-dimension-2xs)\n}\n\n.pds-input__field {\n background: var(--pine-color-background-container);\n border: 1px solid var(--pine-color-border);\n border-radius: var(--pine-dimension-125);\n color: var(--pine-color-text-active);\n font: var(--pine-typography-body);\n letter-spacing: var(--pine-letter-spacing);\n padding: var(--pine-dimension-xs) var(--pine-dimension-sm);\n\n &:hover:not(:disabled, .is-invalid) {\n border: var(--pine-border-hover);\n }\n\n &:disabled {\n background-color: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n color: var(--pine-color-text-disabled);\n cursor: not-allowed;\n\n /* stylelint-disable */\n &::-webkit-input-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &:-ms-input-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n /* stylelint-enable */\n }\n\n &:hover {\n border-color: var(--pine-color-border-hover);\n }\n\n &:focus-visible {\n border-color: var(--pine-color-border-active);\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n }\n\n /* stylelint-disable */\n &::-webkit-input-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &:-ms-input-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n /* stylelint-enable */\n\n &.is-invalid {\n background-color: var(--pine-input-color-background-danger);\n border-color: var(--pine-color-border-danger);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n}\n\n.pds-input__error-message,\n.pds-input__helper-message {\n font: var(--pine-typography-body-sm-medium);\n margin-block-end: 0;\n margin-block-start: var(--pine-dimension-2xs)\n}\n\n.pds-input__error-message {\n align-items: center;\n color: var(--pine-color-text-message-danger);\n display: flex;\n gap: var(--pine-dimension-2xs);\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { danger } from '@pine-ds/icons/icons';\n\nimport { debounceEvent } from '@utils/utils';\nimport { inheritAriaAttributes } from '@utils/attributes';\n\nimport type { Attributes } from '@utils/attributes';\nimport type { InputChangeEventDetail, InputInputEventDetail } from './input-interface';\n\n@Component({\n tag: 'pds-input',\n styleUrls: ['pds-input.tokens.scss', '../../global/styles/utils/label.scss', 'pds-input.scss'],\n shadow: true,\n})\nexport class PdsInput {\n private nativeInput?: HTMLInputElement;\n private inheritedAttributes: Attributes = {};\n private isComposing = false;\n /**\n * The value of the input when the input is focused.\n */\n private focusedValue?: string | number | null;\n\n private originalPdsInput?: EventEmitter<InputInputEventDetail>;\n\n @Element() el!: HTMLPdsInputElement;\n\n /**\n * Emitted when the input loses focus.\n */\n @Event() pdsBlur!: EventEmitter<FocusEvent>;\n\n /**\n *\n * Emitted when the value has changed.\n *\n * This event will not emit when programmatically setting the `value` property.\n */\n @Event() pdsChange!: EventEmitter<InputChangeEventDetail>;\n\n /**\n * Emitted when the input has focus.\n */\n @Event() pdsFocus!: EventEmitter<FocusEvent>;\n\n /**\n * Emitted when a keyboard input occurs.\n */\n @Event() pdsInput: EventEmitter<InputInputEventDetail>;\n\n /**\n * Sets focus on the native `input` in the `pds-input`. Use this method instead of the global\n * `input.focus()`.\n */\n @Method()\n async setFocus() {\n if ( this.nativeInput ) {\n this.nativeInput.focus();\n }\n }\n\n /**\n * Specifies if and how the browser provides `autocomplete` assistance for the field.\n */\n @Prop() autocomplete: string;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * Sets the number of milliseconds to wait before updating the value.\n */\n @Prop() debounce?: number;\n\n /**\n * Determines whether or not the input field is disabled.\n */\n @Prop() disabled?: boolean;\n\n /**\n * Specifies the error message and provides an error-themed treatment to the field.\n */\n @Prop() errorMessage?: string;\n\n /**\n * Displays a message or hint below the input field.\n */\n @Prop() helperMessage?: string;\n\n /**\n * Determines whether or not the input field is invalid or throws an error.\n */\n @Prop() invalid?: boolean;\n\n /**\n * Text to be displayed as the input label.\n */\n @Prop() label?: string;\n\n /**\n * Specifies the name. Submitted with the form name/value pair.\n */\n @Prop() name?: string;\n\n /**\n * Specifies a short hint that describes the expected value of the input field.\n */\n @Prop() placeholder?: string;\n\n /**\n * Determines whether or not the input field is readonly.\n */\n @Prop() readonly?: boolean;\n\n /**\n * Determines whether or not the input field is required.\n */\n @Prop() required?: boolean;\n\n /**\n * Determines the type of control that will be displayed\n * `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`, `'url'`\n * @defaultValue \"text\"\n */\n @Prop() type = 'text';\n\n /**\n * The value of the input.\n */\n @Prop({mutable: true}) value?: string | number | null = '';\n\n /**\n * Determines if the input has focus.\n */\n @State() hasFocus = false;\n\n\n @Watch('debounce')\n protected debounceChanged() {\n const { pdsInput, debounce, originalPdsInput } = this;\n\n /**\n * If debounce is undefined, we have to manually revert the pdsInput emitter in case\n * debounce used to be set to a number. Otherwise, the event would stay debounced.\n */\n this.pdsInput = debounce === undefined ? originalPdsInput ?? pdsInput : debounceEvent(pdsInput, debounce);\n }\n\n @Watch('value')\n protected valueChanged() {\n const nativeInput = this.nativeInput;\n const value = this.getValue();\n\n if (nativeInput && nativeInput.value !== value && !this.isComposing) {\n nativeInput.value = value;\n }\n }\n\n private getValue(): string {\n return typeof this.value === 'number' ? this.value.toString() : (this.value || '').toString();\n }\n\n private onInputEvent = (ev: Event) => {\n const input = ev.target as HTMLInputElement | null;\n if (input) {\n this.value = input.value || '';\n }\n this.emitInputChange(ev);\n };\n\n private onChangeEvent = (ev: Event) => {\n this.emitValueChange(ev);\n };\n\n private onBlurEvent = (ev: FocusEvent) => {\n this.hasFocus = false;\n\n if (this.focusedValue !== this.value) {\n /**\n * Emits the `pdsChange` event when the input value\n * is different than the value when the input was focused.\n */\n this.emitValueChange(ev);\n }\n\n this.pdsBlur.emit(ev);\n };\n\n private onFocusEvent = (ev: FocusEvent) => {\n this.hasFocus = true;\n this.focusedValue = this.value;\n\n this.pdsFocus.emit(ev);\n };\n\n private onCompositionStart = () => {\n this.isComposing = true;\n }\n\n private onCompositionEnd = () => {\n this.isComposing = false;\n }\n\n /**\n * Emits a pdsChange event\n */\n private emitValueChange(event?: Event) {\n const { value } = this;\n const newValue = value == null ? value : value.toString();\n\n this.focusedValue = newValue;\n this.pdsChange.emit({ value: newValue, event });\n }\n\n /**\n *\n * Emits a `pdsInput` event\n */\n private emitInputChange(event?: Event) {\n const { value } = this;\n\n // Checks for both null and undefined values\n const newValue = value == null ? value : value.toString();\n\n this.pdsInput.emit({ value: newValue, event });\n }\n\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n }\n }\n\n componentDidLoad() {\n this.debounceChanged();\n }\n\n private inputClassNames() {\n const classNames = ['pds-input__field'];\n\n if (this.invalid && this.invalid === true) {\n classNames.push('is-invalid');\n }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n aria-readonly={this.readonly ? 'true' : null}\n >\n <div class=\"pds-input\">\n {this.label &&\n <label class=\"pds-input__label\" htmlFor={this.componentId}>{this.label}</label>\n }\n <input\n class={this.inputClassNames()}\n ref={(input) => this.nativeInput = input}\n aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n autocomplete={this.autocomplete}\n disabled={this.disabled}\n id={this.componentId}\n name={this.name}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n type={this.type}\n value={this.value}\n onInput={this.onInputEvent}\n onChange={this.onChangeEvent}\n onBlur={this.onBlurEvent}\n onFocus={this.onFocusEvent}\n onCompositionstart={this.onCompositionStart}\n onCompositionend={this.onCompositionEnd}\n {...this.inheritedAttributes}\n />\n {this.helperMessage &&\n <p\n class=\"pds-input__helper-message\"\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </p>\n }\n {this.errorMessage &&\n <p\n class=\"pds-input__error-message\"\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </p>\n }\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,c as s,h as i,H as r}from"./p-Uh5ntVcq.js";import{m as t}from"./p-DTL_39D_.js";import{f as a,g as n}from"./p-_4gljHh-.js";const o=":host{--pine-select-color-background-danger:var(--pine-color-red-050)}";const l=":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)}";const d=':host .hidden,:host :host([hidden]){display:none}.pds-select{display:grid;-ms-flex-direction:column;flex-direction:column;grid-template-areas:"label label" "field field" "message message";grid-template-columns:1fr minmax(2rem, -webkit-min-content);grid-template-columns:1fr minmax(2rem, min-content);grid-template-rows:-webkit-min-content -webkit-min-content -webkit-min-content;grid-template-rows:min-content min-content min-content;position:relative;width:100%}label{grid-area:label;-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-125);font:var(--pine-typography-body);grid-area:field;letter-spacing:var(--pine-letter-spacing);padding:var(--pine-dimension-xs) var(--pine-dimension-150);-webkit-padding-end:var(--pine-dimension-450);padding-inline-end:var(--pine-dimension-450);position:relative}select:hover{border-color:var(--pine-color-border-hover);cursor:pointer}select:focus-visible{border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}select:disabled{background-color:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}select:has(~.pds-select__message .pds-select__error-message){background-color:var(--pine-select-color-background-danger);border-color:var(--pine-color-border-danger)}select:has(~.pds-select__message .pds-select__error-message):focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host(.is-invalid) select{background-color:var(--pine-select-color-background-danger);border-color:var(--pine-color-border-danger)}:host(.is-invalid) select:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-select__error-message,.pds-select__helper-message{font:var(--pine-typography-body-sm-medium);-webkit-margin-after:0;margin-block-end:0;-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-select__error-message{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-select__message{grid-area:message}.pds-select__select-icon{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;grid-column:-1/-2;grid-row:2/3;height:2.5rem;pointer-events:none;position:relative;z-index:1}';const c=class{constructor(i){e(this,i);this.pdsSelectChange=s(this,"pdsSelectChange");this.disabled=false;this.multiple=false;this.required=false;this.onSelectUpdate=e=>{const s=e.target;const i=Array.from(s.options).filter((e=>e.selected)).map((e=>e.value));if(i.length===1&&!this.multiple){this.value=i[0]}else{this.value=i}this.pdsSelectChange.emit(e)};this.handleSlotChange=()=>{const e=this.slotContainer.querySelector("slot");this.selectEl.innerHTML="";const s=e.assignedElements({flatten:true});s.forEach((e=>{if(["OPTION","OPTGROUP"].includes(e.tagName)){const s=e.cloneNode(true);if(s.tagName==="OPTION"&&s.value===this.value){s.selected=true}this.selectEl.appendChild(s)}}));this.updateSelectedOption()}}valueChanged(){this.updateSelectedOption()}componentWillLoad(){this.updateSelectedOption()}updateSelectedOption(){if(this.selectEl){const e=this.selectEl.options;Array.from(e).map((e=>{if(Array.isArray(this.value)){e.selected=this.value.includes(e.value)}else{e.selected=this.value===e.value}}))}}getHelperMessage(){return this.helperMessage&&i("p",{class:"pds-select__helper-message",id:t(this.componentId,"helper")},this.helperMessage)}getErrorMessage(){return this.errorMessage&&i("p",{class:"pds-select__error-message",id:t(this.componentId,"error"),"aria-live":"assertive"},i("pds-icon",{icon:a,size:"small"}),this.errorMessage)}renderMessages(){if(!this.helperMessage&&!this.errorMessage)return null;return i("div",{class:"pds-select__message"},this.getHelperMessage(),this.getErrorMessage())}classNames(){const e=[];if(this.invalid){e.push("is-invalid")}if(this.disabled){e.push("is-disabled")}return e.join(" ")}render(){return i(r,{key:"6eea9a5492e4b7e415922bce0aa8f2295792a9e4","aria-disabled":this.disabled?"true":null,class:this.classNames()},i("div",{key:"3180e1eff494f846f395d9db6730926d86d1e54a",class:"pds-select"},this.label&&i("label",{key:"90dc521ef10b81a9f58a0f0a2cfa4bc685312119",htmlFor:this.componentId},this.label),i("select",{key:"d6576d25601de6c41893568927b64e530bf9f266",autocomplete:this.autocomplete||undefined,class:"pds-select__field",disabled:this.disabled,id:this.componentId,multiple:this.multiple,name:this.name,onChange:this.onSelectUpdate,required:this.required,ref:e=>this.selectEl=e}),i("div",{key:"87c53bb7bf315e170f60e5b58afcbf623d1aa65c","aria-hidden":"true",class:"hidden",ref:e=>this.slotContainer=e},i("slot",{key:"8cafbc8cc8e23de0ab69b9d6b7d23c896df530b6",onSlotchange:this.handleSlotChange})),this.renderMessages(),!this.multiple&&i("pds-icon",{key:"48758d321edbd38ff6bd31ddd1902627202e196e",class:"pds-select__select-icon",icon:n})))}static get watchers(){return{value:["valueChanged"]}}};c.style=o+(l+d);export{c as pds_select};
|
|
2
|
-
//# sourceMappingURL=p-4e7ca704.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["pdsSelectTokensCss","labelCss","pdsSelectCss","PdsSelect","constructor","hostRef","this","disabled","multiple","required","onSelectUpdate","e","target","values","Array","from","options","filter","option","map","length","value","pdsSelectChange","emit","handleSlotChange","slot","slotContainer","querySelector","selectEl","innerHTML","assignedElements","flatten","forEach","item","includes","tagName","clonedItem","cloneNode","selected","appendChild","updateSelectedOption","valueChanged","componentWillLoad","isArray","getHelperMessage","helperMessage","h","class","id","messageId","componentId","getErrorMessage","errorMessage","icon","danger","size","renderMessages","classNames","invalid","push","join","render","Host","key","label","htmlFor","autocomplete","undefined","name","onChange","ref","el","onSlotchange","enlarge"],"sources":["src/components/pds-select/pds-select.tokens.scss?tag=pds-select&encapsulation=shadow","src/global/styles/utils/label.scss?tag=pds-select&encapsulation=shadow","src/components/pds-select/pds-select.scss?tag=pds-select&encapsulation=shadow","src/components/pds-select/pds-select.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-select/pds-select.tokens'\n",":host {\n display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n label {\n color: var(--pine-color-text-label-readonly);\n }\n}\n\nlabel {\n color: var(--pine-color-text-label);\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n .hidden,\n :host([hidden]) {\n display: none;\n }\n}\n\n.pds-select {\n display: grid;\n flex-direction: column;\n grid-template-areas:\n 'label label'\n 'field field'\n 'message message';\n grid-template-columns: 1fr minmax(2rem, min-content);\n grid-template-rows: min-content min-content min-content;\n position: relative;\n width: 100%;\n}\n\nlabel {\n grid-area: label;\n margin-block-end: var(--pine-dimension-2xs);\n}\n\nselect {\n appearance: none;\n background: var(--pine-color-background-container);\n border: var(--pine-border);\n border-radius: var(--pine-dimension-125);\n font: var(--pine-typography-body);\n grid-area: field;\n letter-spacing: var(--pine-letter-spacing);\n padding: var(--pine-dimension-xs) var(--pine-dimension-150);\n padding-inline-end: var(--pine-dimension-450);\n position: relative;\n\n &:hover {\n border-color: var(--pine-color-border-hover);\n cursor: pointer;\n }\n\n &:focus-visible {\n border-color: var(--pine-color-border-active);\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n }\n\n &:disabled {\n background-color: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n color: var(--pine-color-text-disabled);\n cursor: not-allowed;\n }\n\n &:has(~ .pds-select__message .pds-select__error-message) {\n background-color: var(--pine-select-color-background-danger);\n border-color: var(--pine-color-border-danger);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n}\n\n:host(.is-invalid) {\n select {\n background-color: var(--pine-select-color-background-danger);\n border-color: var(--pine-color-border-danger);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n}\n\n.pds-select__error-message,\n.pds-select__helper-message {\n font: var(--pine-typography-body-sm-medium);\n margin-block-end: 0;\n margin-block-start: var(--pine-dimension-2xs);\n}\n\n.pds-select__error-message {\n align-items: center;\n color: var(--pine-color-text-message-danger);\n display: flex;\n gap: var(--pine-dimension-2xs);\n}\n\n.pds-select__message {\n grid-area: message;\n}\n\n.pds-select__select-icon {\n align-items: center;\n display: flex;\n grid-column: -1 / -2;\n grid-row: 2 / 3;\n height: 2.5rem;\n pointer-events: none;\n position: relative;\n z-index: 1;\n}\n","import { Component, Event, EventEmitter, Host, h, Prop, Watch } from '@stencil/core';\nimport { messageId } from '../../utils/form';\nimport { danger, enlarge } from '@pine-ds/icons/icons';\n\n@Component({\n tag: 'pds-select',\n styleUrls: ['pds-select.tokens.scss', '../../global/styles/utils/label.scss', 'pds-select.scss'],\n shadow: true,\n})\nexport class PdsSelect {\n\n private selectEl!: HTMLSelectElement;\n private slotContainer!: HTMLDivElement;\n\n /**\n * Specifies if and how the browser provides `autocomplete` assistance for the field.\n */\n @Prop() autocomplete: string;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * Indicates whether or not the select field is disabled.\n * @defaultValue false\n */\n @Prop() disabled = false\n\n /**\n * Displays error message text describing an invalid state.\n */\n @Prop() errorMessage: string;\n\n /**\n * Displays helper message text below select.\n */\n @Prop() helperMessage: string;\n\n /**\n * Determines whether or not the select is invalid.\n */\n @Prop() invalid?: boolean;\n\n /**\n * Text to be displayed as the select label.\n */\n @Prop() label?: string;\n\n /**\n * Indicates whether multiple options can be selected.\n * @defaultValue false\n */\n @Prop() multiple = false;\n\n /**\n * Specifies the name. Submitted with the form name/value pair.\n */\n @Prop() name!: string;\n\n /**\n * Indicates whether or not the select field is required.\n * @defaultValue false\n */\n @Prop() required = false;\n\n /**\n * The value(s) of the selected option(s).\n *\n */\n @Prop({ mutable: true }) value?: string | string[];\n\n /**\n * Emitted when a keyboard input occurs.\n */\n @Event() pdsSelectChange: EventEmitter<InputEvent>;\n\n @Watch('value')\n /**\n * Handles the change in the value of the select component.\n * This method is called whenever the value of the select component changes.\n * It updates the selected option accordingly.\n */\n valueChanged() {\n this.updateSelectedOption();\n }\n\n componentWillLoad() {\n this.updateSelectedOption();\n }\n\n /**\n * Updates the selected option in the select element based on the current value.\n *\n * This method iterates through all the options of the select element and sets the\n * 'selected' attribute on the option that matches the current value. If an option\n * does not match the current value, the 'selected' attribute is removed.\n *\n * @private\n * @returns {void}\n */\n private updateSelectedOption() {\n if (this.selectEl) {\n const options = this.selectEl.options;\n\n // Update the selected attribute for all options.\n Array.from(options).map((option: HTMLOptionElement) => {\n if (Array.isArray(this.value)) {\n option.selected = this.value.includes(option.value);\n } else {\n option.selected = this.value === option.value;\n }\n });\n };\n }\n\n /**\n * Emits an event on input change.\n */\n private onSelectUpdate = (e: Event) => {\n const target = e.target as HTMLSelectElement\n\n const values = Array.from(target.options)\n .filter((option) => ( option.selected))\n .map((option) => ( option.value));\n\n if (values.length === 1 && !this.multiple) {\n this.value = values[0];\n } else {\n this.value = values;\n }\n\n this.pdsSelectChange.emit(e as InputEvent);\n };\n\n /**\n * Handles the change event for the slot element.\n * This method is triggered when the slot content changes.\n * It updates the inner HTML of the select element by cloning and appending\n * the assigned <option> elements from the slot.\n */\n private handleSlotChange = () => {\n const slot = this.slotContainer.querySelector('slot') as HTMLSlotElement;\n\n this.selectEl.innerHTML = '';\n const assignedElements = slot.assignedElements({ flatten: true }) as (HTMLOptionElement | HTMLOptGroupElement)[];\n\n assignedElements.forEach((item) => {\n if ( ['OPTION', 'OPTGROUP'].includes(item.tagName)) {\n const clonedItem = item.cloneNode(true) as HTMLOptionElement | HTMLOptGroupElement;\n if (clonedItem.tagName === 'OPTION' && (clonedItem as HTMLOptionElement).value === this.value) {\n (clonedItem as HTMLOptionElement).selected = true;\n }\n this.selectEl.appendChild(clonedItem);\n }\n });\n\n this.updateSelectedOption();\n };\n\n private getHelperMessage() {\n return this.helperMessage && (\n <p class=\"pds-select__helper-message\" id={messageId(this.componentId, 'helper')}>\n {this.helperMessage}\n </p>\n );\n }\n\n private getErrorMessage() {\n return this.errorMessage && (\n <p class=\"pds-select__error-message\" id={messageId(this.componentId, 'error')} aria-live=\"assertive\">\n <pds-icon icon={danger} size=\"small\"></pds-icon>\n {this.errorMessage}\n </p>\n );\n }\n\n private renderMessages() {\n if (!this.helperMessage && !this.errorMessage) return null;\n\n return (\n <div class=\"pds-select__message\">\n {this.getHelperMessage()}\n {this.getErrorMessage()}\n </div>\n );\n }\n\n private classNames() {\n const classNames = [];\n\n if (this.invalid) { classNames.push('is-invalid'); }\n if (this.disabled) { classNames.push('is-disabled'); }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host aria-disabled={this.disabled ? 'true' : null} class={this.classNames()}>\n <div class=\"pds-select\">\n {this.label &&\n <label htmlFor={this.componentId}>{this.label}</label>\n }\n <select\n autocomplete={this.autocomplete || undefined}\n class=\"pds-select__field\"\n disabled={this.disabled}\n id={this.componentId}\n multiple={this.multiple}\n name={this.name}\n onChange={this.onSelectUpdate}\n required={this.required}\n ref={(el) => (this.selectEl = el as HTMLSelectElement)}\n ></select>\n <div aria-hidden=\"true\" class=\"hidden\" ref={(el) => (this.slotContainer = el)}>\n <slot onSlotchange={this.handleSlotChange}></slot>\n </div>\n {this.renderMessages()}\n {!this.multiple && <pds-icon class=\"pds-select__select-icon\" icon={enlarge} />}\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
System.register(["./p-C_8VmA8d.system.js","./p-B4W0_y2p.system.js"],(function(i){"use strict";var e,n,o,r,p,c;return{setters:[function(i){e=i.r;n=i.c;o=i.h;r=i.H},function(i){p=i.d;c=i.r}],execute:function(){var s=":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-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-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-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-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-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)}";var a=":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-2xs);padding-inline:var(--pine-dimension-150)}: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-color-text-accent);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-color-text-danger);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-color-text-info);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-color-text-neutral);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-color-text-success);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-color-text-warning);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-after:var(--pine-dimension-025);margin-block-end:var(--pine-dimension-025);-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-chip__button{font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}:host(.pds-chip--dropdown){padding:var(--pine-dimension-none)}:host(.pds-chip--dropdown) .pds-chip__dot{-webkit-margin-after:calc(var(--pine-dimension-025) / 4);margin-block-end:calc(var(--pine-dimension-025) / 4);-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.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-2xs) var(--pine-dimension-150)}.pds-chip__button:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-chip__button pds-icon{-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);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--large){padding-block:var(--pine-dimension-2xs);padding-inline:var(--pine-dimension-150)}:host(.pds-chip--large) .pds-chip__label,:host(.pds-chip--large) .pds-chip__button{font:var(--pine-typography-heading-6);letter-spacing:var(--pine-letter-spacing-heading-6)}:host(.pds-chip--large):has(.pds-chip__button){padding:var(--pine-dimension-none)}";var d=i("pds_chip",function(){function i(i){var o=this;e(this,i);this.pdsTagCloseClick=n(this,"pdsTagCloseClick");this.dot=false;this.large=false;this.sentiment="neutral";this.variant="text";this.handleCloseClick=function(){o.pdsTagCloseClick.emit()}}i.prototype.classNames=function(){var i=["pds-chip"];if(this.large){i.push("pds-chip--large")}if(this.variant){i.push("pds-chip--"+this.variant)}if(this.sentiment){i.push("pds-chip--"+this.sentiment)}return i.join(" ")};i.prototype.setChipContent=function(){var i=this.variant==="dropdown";var e=i?o("button",{class:"pds-chip__button",type:"button"},this.dot&&o("i",{class:"pds-chip__dot","aria-hidden":"true"}),o("slot",null),o("pds-icon",{icon:p,size:"12px","aria-hidden":"true"})):o("span",{class:"pds-chip__label"},this.dot&&o("i",{class:"pds-chip__dot","aria-hidden":"true"}),o("slot",null));return e};i.prototype.render=function(){return o(r,{key:"965c426e2acb5bbd9d9dfb8a6b985127c5d8f7ca",class:this.classNames(),id:this.componentId},this.setChipContent(),this.variant==="tag"&&o("button",{key:"8520d64334e93add5b44c4524f0629e8e4bbdf86",class:"pds-chip__close",type:"button",onClick:this.handleCloseClick,"aria-label":"Remove"},o("pds-icon",{key:"6cf276e3efd146ed63201b5854ffb3e2037fad9c",icon:c,size:"12px"})))};return i}());d.style=s+a}}}));
|
|
2
|
-
//# sourceMappingURL=p-6260135d.system.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["pdsChipTokensCss","pdsChipCss","PdsChip","exports","class_1","hostRef","_this","this","dot","large","sentiment","variant","handleCloseClick","pdsTagCloseClick","emit","prototype","classNames","push","join","setChipContent","isDropdown","chipContent","h","class","type","icon","downSmall","size","render","Host","key","id","componentId","onClick","remove"],"sources":["src/components/pds-chip/pds-chip.tokens.scss?tag=pds-chip&encapsulation=shadow","src/components/pds-chip/pds-chip.scss?tag=pds-chip&encapsulation=shadow","src/components/pds-chip/pds-chip.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-chip/pds-chip.tokens'\n",":host {\n --sizing-close: var(--pine-dimension-125);\n\n align-items: center;\n border-radius: var(--pine-dimension-sm);\n display: inline-flex;\n padding-block: var(--pine-dimension-2xs);\n padding-inline: var(--pine-dimension-150);\n}\n\n$pds-chip-sentiment: (\n accent: var(--pine-chip-color-accent),\n danger: var(--pine-chip-color-danger),\n info: var(--pine-chip-color-info),\n neutral: var(--pine-chip-color-neutral),\n success: var(--pine-chip-color-success),\n warning: var(--pine-chip-color-warning),\n);\n\n$pds-chip-sentiment-text: (\n accent: var(--pine-color-text-accent),\n danger: var(--pine-color-text-danger),\n info: var(--pine-color-text-info),\n neutral: var(--pine-color-text-neutral),\n success: var(--pine-color-text-success),\n warning: var(--pine-color-text-warning),\n);\n\n$pds-chip-sentiment-dots: (\n accent: var(--pine-chip-color-accent-dot),\n danger: var(--pine-chip-color-danger-dot),\n info: var(--pine-chip-color-info-dot),\n neutral: var(--pine-chip-color-neutral-dot),\n success: var(--pine-chip-color-success-dot),\n warning: var(--pine-chip-color-warning-dot),\n);\n\n$pds-chip-sentiment-hover: (\n accent: var(--pine-chip-color-accent-hover),\n danger: var(--pine-chip-color-danger-hover),\n info: var(--pine-chip-color-info-hover),\n neutral: var(--pine-chip-color-neutral-hover),\n success: var(--pine-chip-color-success-hover),\n warning: var(--pine-chip-color-warning-hover),\n);\n\n@each $sentiment, $value in $pds-chip-sentiment {\n :host(.pds-chip--#{$sentiment}) {\n background: $value;\n border: var(--pine-border-width) solid var(--pine-chip-color-#{$sentiment}-hover);\n\n // dot colors\n .pds-chip__dot {\n /* stylelint-disable-next-line */\n background: map-get($pds-chip-sentiment-dots, $sentiment);\n }\n\n .pds-chip__label, .pds-chip__button, .pds-chip__close {\n /* stylelint-disable-next-line */\n color: map-get($pds-chip-sentiment-text, $sentiment);\n font-weight: var(--pine-font-weight-medium);\n }\n\n // tag close hover colors\n .pds-chip__close:hover {\n /* stylelint-disable-next-line */\n background: map-get($pds-chip-sentiment-hover, $sentiment);\n }\n }\n // dropdown hover colors\n :host(.pds-chip--#{$sentiment}.pds-chip--dropdown:hover) {\n /* stylelint-disable-next-line */\n background: map-get($pds-chip-sentiment-hover, $sentiment);\n }\n}\n\n.pds-chip__dot {\n border: var(--pine-border-width) solid transparent;\n border-radius: var(--pine-border-radius-full);\n display: inline-block;\n height: var(--pine-dimension-2xs);\n margin-block-end: var(--pine-dimension-025);\n margin-inline-end: var(--pine-dimension-2xs);\n width: var(--pine-dimension-2xs);\n}\n\n.pds-chip__label {\n align-items: center;\n display: flex;\n}\n\n.pds-chip__label, .pds-chip__button {\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n\n// dropdown\n\n:host(.pds-chip--dropdown) {\n padding: var(--pine-dimension-none);\n\n .pds-chip__dot {\n margin-block-end: calc(var(--pine-dimension-025) / 4);\n margin-block-start: var(--pine-dimension-025);\n }\n}\n\n.pds-chip__button {\n align-items: center;\n appearance: none;\n background: transparent;\n border: var(--pine-dimension-none);\n border-radius: var(--pine-dimension-sm);\n cursor: pointer;\n display: flex;\n padding: var(--pine-dimension-2xs) var(--pine-dimension-150);\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n }\n\n pds-icon {\n margin-inline-end: calc(var(--pine-dimension-025) * -1);\n margin-inline-start: var(--pine-dimension-2xs);\n }\n}\n\n.pds-chip__close {\n appearance: none;\n background: transparent;\n border: 0;\n border-radius: var(--pine-border-radius-full);\n height: var(--sizing-close);\n margin-inline-end: calc(var(--pine-dimension-xs) * -1);\n margin-inline-start: var(--pine-dimension-2xs);\n padding: var(--sizing-close);\n position: relative;\n width: var(--sizing-close);\n\n pds-icon {\n left: 50%;\n position: absolute;\n top: 50%;\n transform: translate(-50%, -50%);\n }\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n }\n}\n\n// large\n\n:host(.pds-chip--large) {\n padding-block: var(--pine-dimension-2xs);\n padding-inline: var(--pine-dimension-150);\n\n .pds-chip__label, .pds-chip__button {\n font: var(--pine-typography-heading-6);\n letter-spacing: var(--pine-letter-spacing-heading-6);\n }\n}\n\n:host(.pds-chip--large):has(.pds-chip__button) {\n padding: var(--pine-dimension-none);\n}\n","import { downSmall, remove } from '@pine-ds/icons/icons';\nimport { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n/**\n * @slot (default) - The chip's label text.\n */\n\n@Component({\n tag: 'pds-chip',\n styleUrls: ['pds-chip.tokens.scss', 'pds-chip.scss'],\n shadow: true,\n})\nexport class PdsChip {\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Determines whether a dot should be displayed on the chip.\n * @defaultValue false\n */\n @Prop() dot = false;\n\n\n /**\n * Determines whether the chip should be displayed in a larger size.\n * @defaultValue false\n */\n @Prop() large = false;\n\n /**\n * Defines the color scheme of the chip.\n * @defaultValue 'neutral'\n */\n @Prop() sentiment: 'accent' | 'danger' | 'info' | 'neutral' | 'success' | 'warning' = 'neutral';\n\n /**\n * Sets the style variant of the chip.\n * @defaultValue 'text'\n */\n @Prop() variant: 'text' | 'tag' | 'dropdown' = 'text';\n\n /**\n * Event emitted when the close button is clicked on a tag variant chip.\n */\n @Event() pdsTagCloseClick: EventEmitter;\n\n private handleCloseClick = () => {\n this.pdsTagCloseClick.emit();\n };\n\n private classNames() {\n const classNames = ['pds-chip'];\n\n if (this.large) {\n classNames.push('pds-chip--large');\n }\n if (this.variant) {\n classNames.push('pds-chip--' + this.variant);\n }\n if (this.sentiment) {\n classNames.push('pds-chip--' + this.sentiment);\n }\n\n return classNames.join(' ');\n }\n\n private setChipContent() {\n const isDropdown = this.variant === 'dropdown';\n const chipContent = isDropdown ? (\n <button class=\"pds-chip__button\" type=\"button\">\n {this.dot && <i class=\"pds-chip__dot\" aria-hidden=\"true\"></i>}\n <slot></slot>\n <pds-icon icon={downSmall} size=\"12px\" aria-hidden=\"true\"></pds-icon>\n </button>\n ) : (\n <span class=\"pds-chip__label\">\n {this.dot && <i class=\"pds-chip__dot\" aria-hidden=\"true\"></i>}\n <slot></slot>\n </span>\n );\n\n return chipContent;\n }\n\n render() {\n return (\n <Host class={this.classNames()} id={this.componentId}>\n {this.setChipContent()}\n {this.variant === 'tag' && (\n <button class=\"pds-chip__close\" type=\"button\" onClick={this.handleCloseClick} aria-label=\"Remove\">\n <pds-icon icon={remove} size=\"12px\"></pds-icon>\n </button>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"gNAAA,IAAMA,EAAmB,4/BCAzB,IAAMC,EAAa,86M,ICYNC,EAAOC,EAAA,sBALpB,SAAAC,EAAAC,GAAA,IAAAC,EAAAC,K,2DAeUA,KAAGC,IAAG,MAOND,KAAKE,MAAG,MAMRF,KAASG,UAAqE,UAM9EH,KAAOI,QAAgC,OAOvCJ,KAAgBK,iBAAG,WACzBN,EAAKO,iBAAiBC,MACxB,CAgDD,CA9CSV,EAAAW,UAAAC,WAAA,WACN,IAAMA,EAAa,CAAC,YAEpB,GAAIT,KAAKE,MAAO,CACdO,EAAWC,KAAK,kB,CAElB,GAAIV,KAAKI,QAAS,CAChBK,EAAWC,KAAK,aAAeV,KAAKI,Q,CAEtC,GAAIJ,KAAKG,UAAW,CAClBM,EAAWC,KAAK,aAAeV,KAAKG,U,CAGtC,OAAOM,EAAWE,KAAK,I,EAGjBd,EAAAW,UAAAI,eAAA,WACN,IAAMC,EAAab,KAAKI,UAAY,WACpC,IAAMU,EAAcD,EAClBE,EAAQ,UAAAC,MAAM,mBAAmBC,KAAK,UACnCjB,KAAKC,KAAOc,EAAA,KAAGC,MAAM,gBAA4B,uBAClDD,EAAa,aACbA,EAAA,YAAUG,KAAMC,EAAWC,KAAK,OAAmB,wBAGrDL,EAAM,QAAAC,MAAM,mBACThB,KAAKC,KAAOc,EAAA,KAAGC,MAAM,gBAA4B,uBAClDD,EAAa,cAIjB,OAAOD,C,EAGTjB,EAAAW,UAAAa,OAAA,WACE,OACEN,EAACO,EAAI,CAAAC,IAAA,2CAACP,MAAOhB,KAAKS,aAAce,GAAIxB,KAAKyB,aACtCzB,KAAKY,iBACLZ,KAAKI,UAAY,OAChBW,EAAA,UAAAQ,IAAA,2CAAQP,MAAM,kBAAkBC,KAAK,SAASS,QAAS1B,KAAKK,iBAAgB,aAAa,UACvFU,EAAA,YAAAQ,IAAA,2CAAUL,KAAMS,EAAQP,KAAK,U,WAhFrB,I","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as i,h as n}from"./p-Uh5ntVcq.js";import{l as s}from"./p-_4gljHh-.js";const e=":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(--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{text-decoration:none}.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(--pine-color-text-hover);text-decoration:underline}";const t=class{constructor(n){i(this,n);this.external=false;this.variant="inline";this.fontSize="lg"}classNames(){const i=["pds-link"];if(this.fontSize){i.push("pds-link--"+this.fontSize)}if(this.variant){i.push("pds-link--"+this.variant)}return i.join(" ")}render(){return n("a",{key:"7ac75452091305e238c20ef1fc2055fe2f34fb04",class:this.classNames(),href:this.href,id:this.componentId,target:this.external?"_blank":undefined,part:"link"},n("slot",{key:"8f21b34931f85867b91e7c6c3fcc1952b9c430cd"},this.href),this.external&&n("pds-icon",{key:"60f1d607df5bf4cac7a9786f1560702719e73ff5",icon:s,size:this.fontSize}))}};t.style=e;export{t as pds_link};
|
|
2
|
-
//# sourceMappingURL=p-82151ac5.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["pdsLinkCss","PdsLink","constructor","hostRef","this","external","variant","fontSize","classNames","push","join","render","h","key","class","href","id","componentId","target","undefined","part","icon","launch","size"],"sources":["src/components/pds-link/pds-link.scss?tag=pds-link&encapsulation=shadow","src/components/pds-link/pds-link.tsx"],"sourcesContent":[":host {\n display: inline;\n\n pds-icon {\n margin-inline-start: var(--pine-dimension-2xs);\n }\n}\n\n.pds-link {\n align-items: center;\n color: var(--pine-color-text);\n display: inline-flex;\n font-weight: var(--pine-font-weight-medium);\n\n &:focus-visible {\n border-radius: var(--pine-dimension-2xs);\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width-thick);\n position: relative;\n }\n\n &:hover {\n text-decoration: none;\n }\n}\n\n// We have a small consensus stating that\n// fonts will be REMs, box-model will be\n// discussed later px or (r)em's\n.pds-link--sm {\n font-size: var(--pine-font-size-body-xs);\n\n pds-icon {\n height: var(--pine-dimension-xs);\n width: var(--pine-dimension-xs);\n }\n}\n\n.pds-link--md {\n font-size: var(--pine-font-size-body-sm);\n\n pds-icon {\n height: var(--pine-dimension-xs);\n width: var(--pine-dimension-xs);\n }\n}\n\n.pds-link--lg {\n font-size: var(--pine-font-size-body-md);\n\n pds-icon {\n height: var(--pine-dimension-sm);\n width: var(--pine-dimension-sm);\n }\n}\n\n.pds-link--plain {\n text-decoration: none;\n\n &:hover {\n color: var(--pine-color-text-hover);\n text-decoration: underline;\n }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\nimport { launch } from '@pine-ds/icons/icons';\n\n/**\n * @part link - Link element styles.\n * @slot (default) - Text content placed between the opening and closing tags. If no text is provided, the **href** will be used as a fallback.\n */\n@Component({\n tag: 'pds-link',\n styleUrls: ['pds-link.scss'],\n shadow: true,\n})\nexport class PdsLink {\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Determines whether the link should open in a new tab.\n * @defaultValue false\n */\n @Prop() external = false;\n\n /**\n * Sets the link variant styles.\n * @defaultValue inline\n */\n @Prop() variant: 'inline' | 'plain' = 'inline';\n\n /**\n * The font size of the link's text.\n * @defaultValue lg\n */\n @Prop() fontSize: 'sm' | 'md' | 'lg' = 'lg';\n\n /**\n * The hyperlink's destination URL. If no text is provided in the custom slot, the href will be used.\n */\n @Prop() href!: string;\n\n private classNames() {\n const classNames = ['pds-link'];\n\n if (this.fontSize) {\n classNames.push('pds-link--' + this.fontSize);\n }\n\n if (this.variant) {\n classNames.push('pds-link--' + this.variant);\n }\n\n return classNames.join(' ');\n }\n\n render() {\n\n return (\n <a\n class={this.classNames()}\n href={this.href}\n id={this.componentId}\n target={this.external ? '_blank' : undefined}\n part=\"link\"\n >\n <slot>{this.href}</slot>\n {this.external &&\n <pds-icon icon={launch} size={this.fontSize}></pds-icon>\n }\n </a>\n );\n }\n}\n"],"mappings":"+EAAA,MAAMA,EAAa,mhC,MCaNC,EAAO,MALpB,WAAAC,CAAAC,G,UAeUC,KAAQC,SAAG,MAMXD,KAAOE,QAAuB,SAM9BF,KAAQG,SAAuB,IAsCxC,CA/BS,UAAAC,GACN,MAAMA,EAAa,CAAC,YAEpB,GAAIJ,KAAKG,SAAU,CACjBC,EAAWC,KAAK,aAAeL,KAAKG,S,CAGtC,GAAIH,KAAKE,QAAS,CAChBE,EAAWC,KAAK,aAAeL,KAAKE,Q,CAGtC,OAAOE,EAAWE,KAAK,I,CAGzB,MAAAC,GAEE,OACEC,EACE,KAAAC,IAAA,2CAAAC,MAAOV,KAAKI,aACZO,KAAMX,KAAKW,KACXC,GAAIZ,KAAKa,YACTC,OAAQd,KAAKC,SAAW,SAAWc,UACnCC,KAAK,QAELR,EAAO,QAAAC,IAAA,4CAAAT,KAAKW,MACXX,KAAKC,UACJO,EAAA,YAAAC,IAAA,2CAAUQ,KAAMC,EAAQC,KAAMnB,KAAKG,W","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as i,c as o,h as e,H as n}from"./p-Uh5ntVcq.js";import{d as p,r}from"./p-_4gljHh-.js";const c=":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-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-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-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-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-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)}";const s=":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-2xs);padding-inline:var(--pine-dimension-150)}: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-color-text-accent);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-color-text-danger);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-color-text-info);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-color-text-neutral);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-color-text-success);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-color-text-warning);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-after:var(--pine-dimension-025);margin-block-end:var(--pine-dimension-025);-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-chip__button{font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}:host(.pds-chip--dropdown){padding:var(--pine-dimension-none)}:host(.pds-chip--dropdown) .pds-chip__dot{-webkit-margin-after:calc(var(--pine-dimension-025) / 4);margin-block-end:calc(var(--pine-dimension-025) / 4);-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.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-2xs) var(--pine-dimension-150)}.pds-chip__button:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-chip__button pds-icon{-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);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--large){padding-block:var(--pine-dimension-2xs);padding-inline:var(--pine-dimension-150)}:host(.pds-chip--large) .pds-chip__label,:host(.pds-chip--large) .pds-chip__button{font:var(--pine-typography-heading-6);letter-spacing:var(--pine-letter-spacing-heading-6)}:host(.pds-chip--large):has(.pds-chip__button){padding:var(--pine-dimension-none)}";const a=class{constructor(e){i(this,e);this.pdsTagCloseClick=o(this,"pdsTagCloseClick");this.dot=false;this.large=false;this.sentiment="neutral";this.variant="text";this.handleCloseClick=()=>{this.pdsTagCloseClick.emit()}}classNames(){const i=["pds-chip"];if(this.large){i.push("pds-chip--large")}if(this.variant){i.push("pds-chip--"+this.variant)}if(this.sentiment){i.push("pds-chip--"+this.sentiment)}return i.join(" ")}setChipContent(){const i=this.variant==="dropdown";const o=i?e("button",{class:"pds-chip__button",type:"button"},this.dot&&e("i",{class:"pds-chip__dot","aria-hidden":"true"}),e("slot",null),e("pds-icon",{icon:p,size:"12px","aria-hidden":"true"})):e("span",{class:"pds-chip__label"},this.dot&&e("i",{class:"pds-chip__dot","aria-hidden":"true"}),e("slot",null));return o}render(){return e(n,{key:"965c426e2acb5bbd9d9dfb8a6b985127c5d8f7ca",class:this.classNames(),id:this.componentId},this.setChipContent(),this.variant==="tag"&&e("button",{key:"8520d64334e93add5b44c4524f0629e8e4bbdf86",class:"pds-chip__close",type:"button",onClick:this.handleCloseClick,"aria-label":"Remove"},e("pds-icon",{key:"6cf276e3efd146ed63201b5854ffb3e2037fad9c",icon:r,size:"12px"})))}};a.style=c+s;export{a as pds_chip};
|
|
2
|
-
//# sourceMappingURL=p-8337c77c.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["pdsChipTokensCss","pdsChipCss","PdsChip","constructor","hostRef","this","dot","large","sentiment","variant","handleCloseClick","pdsTagCloseClick","emit","classNames","push","join","setChipContent","isDropdown","chipContent","h","class","type","icon","downSmall","size","render","Host","key","id","componentId","onClick","remove"],"sources":["src/components/pds-chip/pds-chip.tokens.scss?tag=pds-chip&encapsulation=shadow","src/components/pds-chip/pds-chip.scss?tag=pds-chip&encapsulation=shadow","src/components/pds-chip/pds-chip.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-chip/pds-chip.tokens'\n",":host {\n --sizing-close: var(--pine-dimension-125);\n\n align-items: center;\n border-radius: var(--pine-dimension-sm);\n display: inline-flex;\n padding-block: var(--pine-dimension-2xs);\n padding-inline: var(--pine-dimension-150);\n}\n\n$pds-chip-sentiment: (\n accent: var(--pine-chip-color-accent),\n danger: var(--pine-chip-color-danger),\n info: var(--pine-chip-color-info),\n neutral: var(--pine-chip-color-neutral),\n success: var(--pine-chip-color-success),\n warning: var(--pine-chip-color-warning),\n);\n\n$pds-chip-sentiment-text: (\n accent: var(--pine-color-text-accent),\n danger: var(--pine-color-text-danger),\n info: var(--pine-color-text-info),\n neutral: var(--pine-color-text-neutral),\n success: var(--pine-color-text-success),\n warning: var(--pine-color-text-warning),\n);\n\n$pds-chip-sentiment-dots: (\n accent: var(--pine-chip-color-accent-dot),\n danger: var(--pine-chip-color-danger-dot),\n info: var(--pine-chip-color-info-dot),\n neutral: var(--pine-chip-color-neutral-dot),\n success: var(--pine-chip-color-success-dot),\n warning: var(--pine-chip-color-warning-dot),\n);\n\n$pds-chip-sentiment-hover: (\n accent: var(--pine-chip-color-accent-hover),\n danger: var(--pine-chip-color-danger-hover),\n info: var(--pine-chip-color-info-hover),\n neutral: var(--pine-chip-color-neutral-hover),\n success: var(--pine-chip-color-success-hover),\n warning: var(--pine-chip-color-warning-hover),\n);\n\n@each $sentiment, $value in $pds-chip-sentiment {\n :host(.pds-chip--#{$sentiment}) {\n background: $value;\n border: var(--pine-border-width) solid var(--pine-chip-color-#{$sentiment}-hover);\n\n // dot colors\n .pds-chip__dot {\n /* stylelint-disable-next-line */\n background: map-get($pds-chip-sentiment-dots, $sentiment);\n }\n\n .pds-chip__label, .pds-chip__button, .pds-chip__close {\n /* stylelint-disable-next-line */\n color: map-get($pds-chip-sentiment-text, $sentiment);\n font-weight: var(--pine-font-weight-medium);\n }\n\n // tag close hover colors\n .pds-chip__close:hover {\n /* stylelint-disable-next-line */\n background: map-get($pds-chip-sentiment-hover, $sentiment);\n }\n }\n // dropdown hover colors\n :host(.pds-chip--#{$sentiment}.pds-chip--dropdown:hover) {\n /* stylelint-disable-next-line */\n background: map-get($pds-chip-sentiment-hover, $sentiment);\n }\n}\n\n.pds-chip__dot {\n border: var(--pine-border-width) solid transparent;\n border-radius: var(--pine-border-radius-full);\n display: inline-block;\n height: var(--pine-dimension-2xs);\n margin-block-end: var(--pine-dimension-025);\n margin-inline-end: var(--pine-dimension-2xs);\n width: var(--pine-dimension-2xs);\n}\n\n.pds-chip__label {\n align-items: center;\n display: flex;\n}\n\n.pds-chip__label, .pds-chip__button {\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n\n// dropdown\n\n:host(.pds-chip--dropdown) {\n padding: var(--pine-dimension-none);\n\n .pds-chip__dot {\n margin-block-end: calc(var(--pine-dimension-025) / 4);\n margin-block-start: var(--pine-dimension-025);\n }\n}\n\n.pds-chip__button {\n align-items: center;\n appearance: none;\n background: transparent;\n border: var(--pine-dimension-none);\n border-radius: var(--pine-dimension-sm);\n cursor: pointer;\n display: flex;\n padding: var(--pine-dimension-2xs) var(--pine-dimension-150);\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n }\n\n pds-icon {\n margin-inline-end: calc(var(--pine-dimension-025) * -1);\n margin-inline-start: var(--pine-dimension-2xs);\n }\n}\n\n.pds-chip__close {\n appearance: none;\n background: transparent;\n border: 0;\n border-radius: var(--pine-border-radius-full);\n height: var(--sizing-close);\n margin-inline-end: calc(var(--pine-dimension-xs) * -1);\n margin-inline-start: var(--pine-dimension-2xs);\n padding: var(--sizing-close);\n position: relative;\n width: var(--sizing-close);\n\n pds-icon {\n left: 50%;\n position: absolute;\n top: 50%;\n transform: translate(-50%, -50%);\n }\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n }\n}\n\n// large\n\n:host(.pds-chip--large) {\n padding-block: var(--pine-dimension-2xs);\n padding-inline: var(--pine-dimension-150);\n\n .pds-chip__label, .pds-chip__button {\n font: var(--pine-typography-heading-6);\n letter-spacing: var(--pine-letter-spacing-heading-6);\n }\n}\n\n:host(.pds-chip--large):has(.pds-chip__button) {\n padding: var(--pine-dimension-none);\n}\n","import { downSmall, remove } from '@pine-ds/icons/icons';\nimport { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n/**\n * @slot (default) - The chip's label text.\n */\n\n@Component({\n tag: 'pds-chip',\n styleUrls: ['pds-chip.tokens.scss', 'pds-chip.scss'],\n shadow: true,\n})\nexport class PdsChip {\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Determines whether a dot should be displayed on the chip.\n * @defaultValue false\n */\n @Prop() dot = false;\n\n\n /**\n * Determines whether the chip should be displayed in a larger size.\n * @defaultValue false\n */\n @Prop() large = false;\n\n /**\n * Defines the color scheme of the chip.\n * @defaultValue 'neutral'\n */\n @Prop() sentiment: 'accent' | 'danger' | 'info' | 'neutral' | 'success' | 'warning' = 'neutral';\n\n /**\n * Sets the style variant of the chip.\n * @defaultValue 'text'\n */\n @Prop() variant: 'text' | 'tag' | 'dropdown' = 'text';\n\n /**\n * Event emitted when the close button is clicked on a tag variant chip.\n */\n @Event() pdsTagCloseClick: EventEmitter;\n\n private handleCloseClick = () => {\n this.pdsTagCloseClick.emit();\n };\n\n private classNames() {\n const classNames = ['pds-chip'];\n\n if (this.large) {\n classNames.push('pds-chip--large');\n }\n if (this.variant) {\n classNames.push('pds-chip--' + this.variant);\n }\n if (this.sentiment) {\n classNames.push('pds-chip--' + this.sentiment);\n }\n\n return classNames.join(' ');\n }\n\n private setChipContent() {\n const isDropdown = this.variant === 'dropdown';\n const chipContent = isDropdown ? (\n <button class=\"pds-chip__button\" type=\"button\">\n {this.dot && <i class=\"pds-chip__dot\" aria-hidden=\"true\"></i>}\n <slot></slot>\n <pds-icon icon={downSmall} size=\"12px\" aria-hidden=\"true\"></pds-icon>\n </button>\n ) : (\n <span class=\"pds-chip__label\">\n {this.dot && <i class=\"pds-chip__dot\" aria-hidden=\"true\"></i>}\n <slot></slot>\n </span>\n );\n\n return chipContent;\n }\n\n render() {\n return (\n <Host class={this.classNames()} id={this.componentId}>\n {this.setChipContent()}\n {this.variant === 'tag' && (\n <button class=\"pds-chip__close\" type=\"button\" onClick={this.handleCloseClick} aria-label=\"Remove\">\n <pds-icon icon={remove} size=\"12px\"></pds-icon>\n </button>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"+FAAA,MAAMA,EAAmB,4/BCAzB,MAAMC,EAAa,86M,MCYNC,EAAO,MALpB,WAAAC,CAAAC,G,2DAeUC,KAAGC,IAAG,MAOND,KAAKE,MAAG,MAMRF,KAASG,UAAqE,UAM9EH,KAAOI,QAAgC,OAOvCJ,KAAgBK,iBAAG,KACzBL,KAAKM,iBAAiBC,MAAM,CAiD/B,CA9CS,UAAAC,GACN,MAAMA,EAAa,CAAC,YAEpB,GAAIR,KAAKE,MAAO,CACdM,EAAWC,KAAK,kB,CAElB,GAAIT,KAAKI,QAAS,CAChBI,EAAWC,KAAK,aAAeT,KAAKI,Q,CAEtC,GAAIJ,KAAKG,UAAW,CAClBK,EAAWC,KAAK,aAAeT,KAAKG,U,CAGtC,OAAOK,EAAWE,KAAK,I,CAGjB,cAAAC,GACN,MAAMC,EAAaZ,KAAKI,UAAY,WACpC,MAAMS,EAAcD,EAClBE,EAAQ,UAAAC,MAAM,mBAAmBC,KAAK,UACnChB,KAAKC,KAAOa,EAAA,KAAGC,MAAM,gBAA4B,uBAClDD,EAAa,aACbA,EAAA,YAAUG,KAAMC,EAAWC,KAAK,OAAmB,wBAGrDL,EAAM,QAAAC,MAAM,mBACTf,KAAKC,KAAOa,EAAA,KAAGC,MAAM,gBAA4B,uBAClDD,EAAa,cAIjB,OAAOD,C,CAGT,MAAAO,GACE,OACEN,EAACO,EAAI,CAAAC,IAAA,2CAACP,MAAOf,KAAKQ,aAAce,GAAIvB,KAAKwB,aACtCxB,KAAKW,iBACLX,KAAKI,UAAY,OAChBU,EAAA,UAAAQ,IAAA,2CAAQP,MAAM,kBAAkBC,KAAK,SAASS,QAASzB,KAAKK,iBAAgB,aAAa,UACvFS,EAAA,YAAAQ,IAAA,2CAAUL,KAAMS,EAAQP,KAAK,U","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
System.register(["./p-C_8VmA8d.system.js"],(function(e){"use strict";var t,r,c;return{setters:[function(e){t=e.r;r=e.h;c=e.H}],execute:function(){var n=":host{border-color:inherit;display:table-row-group;vertical-align:middle}";var o=e("pds_table_body",function(){function e(e){t(this,e)}e.prototype.render=function(){return r(c,{key:"c01028ed3108a0404ef3da77f1cf7a3b97a40b52",role:"rowgroup"},r("slot",{key:"f8491f02e732d28b01bc9cf2436c6edca3cbfc0e"}))};return e}());o.style=n}}}));
|
|
2
|
-
//# sourceMappingURL=p-953f619f.system.entry.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
System.register(["./p-C_8VmA8d.system.js"],(function(e){"use strict";var i,o,r,t;return{setters:[function(e){i=e.r;o=e.h;r=e.H;t=e.g}],execute:function(){var n=":host{--sizing-max-width-default:352px;display:inline-block}:host [popover]{background-color:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-125);-webkit-box-shadow:var(--pine-box-shadow-200);box-shadow:var(--pine-box-shadow-200);margin:var(--pine-dimension-none);max-width:var(--sizing-max-width-default);padding:var(--pine-dimension-md);position:fixed}:host button{-ms-flex-align:center;align-items:center;background-color:var(--pine-color-secondary);border:var(--pine-border);border-radius:var(--pine-border-radius-full);color:var(--pine-color-text-secondary);display:-ms-flexbox;display:flex;font:var(--pine-typography-body-medium);font-family:var(--pine-font-family-heading);letter-spacing:var(--pine-letter-spacing);min-height:40px;padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}:host button:focus-visible{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}:host button:hover{background-color:var(--pine-color-secondary-hover)}";var a=e("pds_popover",function(){function e(e){i(this,e);this.active=false;this.popoverTargetAction="show";this.popoverType="auto";this.maxWidth=352;this.placement="right"}e.prototype.componentWillRender=function(){this.handlePopoverPositioning()};e.prototype.handleClick=function(){this.active=!this.active};e.prototype.handleScroll=function(){if(this.active){this.handlePopoverPositioning()}};e.prototype.handlePopoverPositioning=function(){var e=this.el.shadowRoot.querySelector(".pds-popover__trigger");var i=this.el.shadowRoot.querySelector("div[popover]");if(!e||!i)return;var o=e.getBoundingClientRect();var r=i.getBoundingClientRect();var t=0;var n=0;var a=8;switch(this.placement){case"top":t=o.top-r.height-a;n=o.left;break;case"right":t=o.top;n=o.right+a;break;case"bottom":t=o.bottom+a;n=o.left;break;case"left":t=o.top;n=o.left-r.width-a;break}i.style.top="".concat(t,"px");i.style.left="".concat(n,"px")};e.prototype.render=function(){return o(r,{key:"3bed0c38e97500efb2bffcef8321a6b38215c434"},o("button",{key:"0db59e1815568cb980ce0bbe5ef3502177015a1d",class:"pds-popover__trigger",popoverTarget:this.componentId,popoverTargetAction:this.popoverTargetAction,onClick:this.handleClick},this.text),o("div",{key:"d8c70cd36614cb3fc83669a843b00af0d18b03d4",class:"pds-popover ".concat(this.active?"pds-popover--active":""),id:this.componentId,popover:this.popoverType,style:{maxWidth:"".concat(this.maxWidth,"px")}},o("slot",{key:"e7408b199525e88c0e975f9cc3e96200f82ea23e"})))};Object.defineProperty(e.prototype,"el",{get:function(){return t(this)},enumerable:false,configurable:true});return e}());a.style=n}}}));
|
|
2
|
-
//# sourceMappingURL=p-9d0c1b2e.system.entry.js.map
|