@pine-ds/core 2.1.0 → 2.1.2
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 +6 -0
- package/components/index.js +3 -0
- package/components/index.js.map +1 -1
- package/components/index2.js +3 -2
- package/components/index2.js.map +1 -1
- package/components/pds-button2.js +5 -3
- package/components/pds-button2.js.map +1 -1
- package/components/pds-checkbox2.js +12 -5
- package/components/pds-checkbox2.js.map +1 -1
- package/components/pds-chip.js +4 -4
- package/components/pds-chip.js.map +1 -1
- package/components/pds-copytext.js +1 -1
- package/components/pds-copytext.js.map +1 -1
- package/components/pds-divider.js +1 -1
- package/components/pds-divider.js.map +1 -1
- package/components/pds-image.js +2 -2
- package/components/pds-image.js.map +1 -1
- package/components/pds-input.js +14 -5
- package/components/pds-input.js.map +1 -1
- package/components/pds-link.js +2 -2
- package/components/pds-link.js.map +1 -1
- package/components/pds-loader.js +1 -1
- package/components/pds-popover.d.ts +11 -0
- package/components/pds-popover.js +94 -0
- package/components/pds-popover.js.map +1 -0
- package/components/pds-progress.js +1 -1
- package/components/pds-radio.js +16 -9
- package/components/pds-radio.js.map +1 -1
- package/components/pds-row.js +1 -1
- package/components/pds-select.d.ts +11 -0
- package/components/pds-select.js +165 -0
- package/components/pds-select.js.map +1 -0
- package/components/pds-sortable-item.js +1 -1
- package/components/pds-sortable.js +1 -1
- package/components/pds-switch.js +15 -11
- package/components/pds-switch.js.map +1 -1
- 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 +3 -3
- package/components/pds-table-head.js +1 -1
- package/components/pds-table-row.js +9 -3
- package/components/pds-table-row.js.map +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.d.ts +11 -0
- package/components/pds-text.js +58 -0
- package/components/pds-text.js.map +1 -0
- package/components/pds-textarea.js +16 -7
- package/components/pds-textarea.js.map +1 -1
- package/components/pds-tooltip.js +6 -8
- package/components/pds-tooltip.js.map +1 -1
- package/dist/cjs/{index-2240f8f4.js → index-0079013c.js} +4 -2
- package/dist/cjs/index-0079013c.js.map +1 -0
- package/dist/cjs/{index-d424fb6f.js → index-b7d9268e.js} +14 -7
- package/dist/cjs/index-b7d9268e.js.map +1 -0
- package/dist/cjs/index.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/pds-accordion.cjs.entry.js +2 -2
- package/dist/cjs/pds-avatar.cjs.entry.js +2 -2
- package/dist/cjs/pds-box.cjs.entry.js +1 -1
- package/dist/cjs/pds-button.cjs.entry.js +5 -3
- package/dist/cjs/pds-button.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-checkbox.cjs.entry.js +7 -6
- package/dist/cjs/pds-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-chip.cjs.entry.js +5 -5
- package/dist/cjs/pds-chip.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-copytext.cjs.entry.js +3 -3
- package/dist/cjs/pds-copytext.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-divider.cjs.entry.js +2 -2
- package/dist/cjs/pds-divider.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-icon.cjs.entry.js +1 -1
- package/dist/cjs/pds-image.cjs.entry.js +3 -3
- package/dist/cjs/pds-image.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-input.cjs.entry.js +8 -6
- package/dist/cjs/pds-input.cjs.entry.js.map +1 -1
- package/dist/cjs/{pds-label-397cc854.js → pds-label-05f073ea.js} +2 -2
- package/dist/cjs/{pds-label-397cc854.js.map → pds-label-05f073ea.js.map} +1 -1
- package/dist/cjs/pds-link.cjs.entry.js +4 -4
- package/dist/cjs/pds-link.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-loader.cjs.entry.js +2 -2
- package/dist/cjs/pds-popover.cjs.entry.js +72 -0
- package/dist/cjs/pds-popover.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-progress.cjs.entry.js +2 -2
- package/dist/cjs/pds-radio.cjs.entry.js +9 -8
- package/dist/cjs/pds-radio.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-row.cjs.entry.js +2 -2
- package/dist/cjs/pds-select.cjs.entry.js +131 -0
- package/dist/cjs/pds-select.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-sortable-item.cjs.entry.js +3 -3
- package/dist/cjs/pds-sortable.cjs.entry.js +2 -2
- package/dist/cjs/pds-switch.cjs.entry.js +9 -10
- package/dist/cjs/pds-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-tab.cjs.entry.js +4 -4
- package/dist/cjs/pds-table-body.cjs.entry.js +2 -2
- package/dist/cjs/pds-table-cell.cjs.entry.js +3 -3
- package/dist/cjs/pds-table-head-cell.cjs.entry.js +4 -4
- package/dist/cjs/pds-table-head.cjs.entry.js +2 -2
- package/dist/cjs/pds-table-row.cjs.entry.js +2 -2
- package/dist/cjs/pds-table.cjs.entry.js +2 -2
- package/dist/cjs/pds-tabpanel.cjs.entry.js +2 -2
- package/dist/cjs/pds-tabs.cjs.entry.js +2 -2
- package/dist/cjs/pds-text.cjs.entry.js +37 -0
- package/dist/cjs/pds-text.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-textarea.cjs.entry.js +10 -8
- package/dist/cjs/pds-textarea.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-tooltip.cjs.entry.js +5 -8
- package/dist/cjs/pds-tooltip.cjs.entry.js.map +1 -1
- package/dist/cjs/pine-core.cjs.js +3 -3
- package/dist/cjs/pine-core.cjs.js.map +1 -1
- package/dist/collection/collection-manifest.json +4 -1
- package/dist/collection/components/pds-button/pds-button.js +20 -1
- package/dist/collection/components/pds-button/pds-button.js.map +1 -1
- package/dist/collection/components/pds-button/stories/pds-button.stories.js +8 -1
- package/dist/collection/components/pds-checkbox/pds-checkbox.css +9 -1
- package/dist/collection/components/pds-checkbox/pds-checkbox.js +4 -3
- package/dist/collection/components/pds-checkbox/pds-checkbox.js.map +1 -1
- package/dist/collection/components/pds-chip/pds-chip.js +26 -26
- package/dist/collection/components/pds-chip/pds-chip.js.map +1 -1
- package/dist/collection/components/pds-copytext/pds-copytext.js +4 -4
- package/dist/collection/components/pds-copytext/pds-copytext.js.map +1 -1
- package/dist/collection/components/pds-divider/pds-divider.js +2 -2
- package/dist/collection/components/pds-divider/pds-divider.js.map +1 -1
- package/dist/collection/components/pds-icon/stories/pds-icon.stories.js +1 -1
- package/dist/collection/components/pds-image/pds-image.js +13 -7
- package/dist/collection/components/pds-image/pds-image.js.map +1 -1
- package/dist/collection/components/pds-input/pds-input.css +6 -1
- package/dist/collection/components/pds-input/pds-input.js +22 -3
- package/dist/collection/components/pds-input/pds-input.js.map +1 -1
- package/dist/collection/components/pds-input/stories/pds-input.stories.js +10 -0
- package/dist/collection/components/pds-link/pds-link.js +12 -9
- package/dist/collection/components/pds-link/pds-link.js.map +1 -1
- package/dist/collection/components/pds-loader/pds-loader.js +1 -1
- package/dist/collection/components/pds-popover/pds-popover.css +51 -0
- package/dist/collection/components/pds-popover/pds-popover.js +216 -0
- package/dist/collection/components/pds-popover/pds-popover.js.map +1 -0
- package/dist/collection/components/pds-popover/stories/pds-popover.stories.js +45 -0
- package/dist/collection/components/pds-progress/pds-progress.js +1 -1
- package/dist/collection/components/pds-radio/pds-radio.css +9 -1
- package/dist/collection/components/pds-radio/pds-radio.js +41 -40
- package/dist/collection/components/pds-radio/pds-radio.js.map +1 -1
- package/dist/collection/components/pds-row/pds-row.js +1 -1
- package/dist/collection/components/pds-select/pds-select.css +126 -0
- package/dist/collection/components/pds-select/pds-select.js +360 -0
- package/dist/collection/components/pds-select/pds-select.js.map +1 -0
- package/dist/collection/components/pds-select/stories/pds-select.stories.js +153 -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.css +10 -6
- package/dist/collection/components/pds-switch/pds-switch.js +17 -39
- package/dist/collection/components/pds-switch/pds-switch.js.map +1 -1
- package/dist/collection/components/pds-switch/stories/pds-switch.stories.js +2 -15
- 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-tab/stories/pds-tab.stories.js +19 -0
- package/dist/collection/components/pds-tabs/pds-tabpanel/pds-tabpanel.js +1 -1
- package/dist/collection/components/pds-tabs/pds-tabpanel/stories/pds-tabpanel.stories.js +19 -0
- package/dist/collection/components/pds-tabs/pds-tabs.js +1 -1
- package/dist/collection/components/pds-tabs/stories/pds-tabs.stories.js +18 -18
- package/dist/collection/components/pds-text/pds-text.css +218 -0
- package/dist/collection/components/pds-text/pds-text.js +143 -0
- package/dist/collection/components/pds-text/pds-text.js.map +1 -0
- package/dist/collection/components/pds-text/stories/pds-text.stories.js +111 -0
- package/dist/collection/components/pds-textarea/pds-textarea.css +4 -0
- package/dist/collection/components/pds-textarea/pds-textarea.js +24 -5
- package/dist/collection/components/pds-textarea/pds-textarea.js.map +1 -1
- package/dist/collection/components/pds-textarea/stories/pds-textarea.stories.js +22 -11
- package/dist/collection/components/pds-tooltip/pds-tooltip.css +2 -1
- package/dist/collection/components/pds-tooltip/pds-tooltip.js +24 -37
- package/dist/collection/components/pds-tooltip/pds-tooltip.js.map +1 -1
- package/dist/collection/components/pds-tooltip/stories/pds-tooltip.stories.js +15 -15
- package/dist/collection/utils/types.js.map +1 -1
- package/dist/docs.json +1184 -265
- package/dist/esm/{index-786a51ce.js → index-3ca52e8f.js} +4 -3
- package/dist/esm/index-3ca52e8f.js.map +1 -0
- package/dist/esm/{index-94bbabb0.js → index-b1696fed.js} +14 -7
- package/dist/esm/index-b1696fed.js.map +1 -0
- package/dist/esm/index.js +1 -1
- package/dist/esm/loader.js +3 -3
- package/dist/esm/pds-accordion.entry.js +2 -2
- package/dist/esm/pds-avatar.entry.js +2 -2
- package/dist/esm/pds-box.entry.js +1 -1
- package/dist/esm/pds-button.entry.js +5 -3
- package/dist/esm/pds-button.entry.js.map +1 -1
- package/dist/esm/pds-checkbox.entry.js +7 -6
- package/dist/esm/pds-checkbox.entry.js.map +1 -1
- package/dist/esm/pds-chip.entry.js +5 -5
- package/dist/esm/pds-chip.entry.js.map +1 -1
- package/dist/esm/pds-copytext.entry.js +3 -3
- package/dist/esm/pds-copytext.entry.js.map +1 -1
- package/dist/esm/pds-divider.entry.js +2 -2
- package/dist/esm/pds-divider.entry.js.map +1 -1
- package/dist/esm/pds-icon.entry.js +1 -1
- package/dist/esm/pds-image.entry.js +3 -3
- package/dist/esm/pds-image.entry.js.map +1 -1
- package/dist/esm/pds-input.entry.js +8 -6
- package/dist/esm/pds-input.entry.js.map +1 -1
- package/dist/esm/{pds-label-d28da6eb.js → pds-label-62469596.js} +2 -2
- package/dist/esm/{pds-label-d28da6eb.js.map → pds-label-62469596.js.map} +1 -1
- package/dist/esm/pds-link.entry.js +4 -4
- package/dist/esm/pds-link.entry.js.map +1 -1
- package/dist/esm/pds-loader.entry.js +2 -2
- package/dist/esm/pds-popover.entry.js +68 -0
- package/dist/esm/pds-popover.entry.js.map +1 -0
- package/dist/esm/pds-progress.entry.js +2 -2
- package/dist/esm/pds-radio.entry.js +9 -8
- package/dist/esm/pds-radio.entry.js.map +1 -1
- package/dist/esm/pds-row.entry.js +2 -2
- package/dist/esm/pds-select.entry.js +127 -0
- package/dist/esm/pds-select.entry.js.map +1 -0
- package/dist/esm/pds-sortable-item.entry.js +3 -3
- package/dist/esm/pds-sortable.entry.js +2 -2
- package/dist/esm/pds-switch.entry.js +9 -10
- package/dist/esm/pds-switch.entry.js.map +1 -1
- package/dist/esm/pds-tab.entry.js +4 -4
- package/dist/esm/pds-table-body.entry.js +2 -2
- package/dist/esm/pds-table-cell.entry.js +3 -3
- package/dist/esm/pds-table-head-cell.entry.js +4 -4
- package/dist/esm/pds-table-head.entry.js +2 -2
- package/dist/esm/pds-table-row.entry.js +2 -2
- package/dist/esm/pds-table.entry.js +2 -2
- package/dist/esm/pds-tabpanel.entry.js +2 -2
- package/dist/esm/pds-tabs.entry.js +2 -2
- package/dist/esm/pds-text.entry.js +33 -0
- package/dist/esm/pds-text.entry.js.map +1 -0
- package/dist/esm/pds-textarea.entry.js +10 -8
- package/dist/esm/pds-textarea.entry.js.map +1 -1
- package/dist/esm/pds-tooltip.entry.js +5 -8
- package/dist/esm/pds-tooltip.entry.js.map +1 -1
- package/dist/esm/pine-core.js +4 -4
- package/dist/esm/pine-core.js.map +1 -1
- package/dist/esm-es5/index-3ca52e8f.js +2 -0
- package/dist/esm-es5/index-3ca52e8f.js.map +1 -0
- package/dist/esm-es5/index-b1696fed.js +3 -0
- package/dist/esm-es5/index-b1696fed.js.map +1 -0
- package/dist/esm-es5/index.js +1 -1
- package/dist/esm-es5/loader.js +1 -1
- package/dist/esm-es5/loader.js.map +1 -1
- package/dist/esm-es5/pds-accordion.entry.js +1 -1
- package/dist/esm-es5/pds-avatar.entry.js +1 -1
- package/dist/esm-es5/pds-box.entry.js +1 -1
- package/dist/esm-es5/pds-button.entry.js +1 -1
- package/dist/esm-es5/pds-button.entry.js.map +1 -1
- package/dist/esm-es5/pds-checkbox.entry.js +1 -1
- package/dist/esm-es5/pds-checkbox.entry.js.map +1 -1
- package/dist/esm-es5/pds-chip.entry.js +1 -1
- package/dist/esm-es5/pds-chip.entry.js.map +1 -1
- package/dist/esm-es5/pds-copytext.entry.js +1 -1
- package/dist/esm-es5/pds-copytext.entry.js.map +1 -1
- package/dist/esm-es5/pds-divider.entry.js +1 -1
- package/dist/esm-es5/pds-divider.entry.js.map +1 -1
- package/dist/esm-es5/pds-icon.entry.js +1 -1
- package/dist/esm-es5/pds-image.entry.js +1 -1
- package/dist/esm-es5/pds-image.entry.js.map +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-label-d28da6eb.js → pds-label-62469596.js} +2 -2
- 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-popover.entry.js +2 -0
- package/dist/esm-es5/pds-popover.entry.js.map +1 -0
- 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-radio.entry.js.map +1 -1
- package/dist/esm-es5/pds-row.entry.js +1 -1
- package/dist/esm-es5/pds-select.entry.js +2 -0
- package/dist/esm-es5/pds-select.entry.js.map +1 -0
- package/dist/esm-es5/pds-sortable-item.entry.js +1 -1
- package/dist/esm-es5/pds-sortable.entry.js +2 -2
- package/dist/esm-es5/pds-switch.entry.js +1 -1
- package/dist/esm-es5/pds-switch.entry.js.map +1 -1
- package/dist/esm-es5/pds-tab.entry.js +1 -1
- package/dist/esm-es5/pds-table-body.entry.js +1 -1
- package/dist/esm-es5/pds-table-cell.entry.js +1 -1
- package/dist/esm-es5/pds-table-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 +2 -0
- package/dist/esm-es5/pds-text.entry.js.map +1 -0
- package/dist/esm-es5/pds-textarea.entry.js +1 -1
- package/dist/esm-es5/pds-textarea.entry.js.map +1 -1
- package/dist/esm-es5/pds-tooltip.entry.js +1 -1
- package/dist/esm-es5/pds-tooltip.entry.js.map +1 -1
- package/dist/esm-es5/pine-core.js +1 -1
- package/dist/esm-es5/pine-core.js.map +1 -1
- package/dist/pine-core/index.esm.js +1 -1
- package/dist/pine-core/{p-284433e0.entry.js → p-00cccccb.entry.js} +2 -2
- package/dist/pine-core/p-06513fe5.entry.js +2 -0
- package/dist/pine-core/p-06513fe5.entry.js.map +1 -0
- package/dist/pine-core/p-06593922.system.entry.js +2 -0
- package/dist/pine-core/p-06593922.system.entry.js.map +1 -0
- package/dist/pine-core/{p-a8cb75f0.system.entry.js → p-08c4f190.system.entry.js} +2 -2
- package/dist/pine-core/{p-bd5de072.system.entry.js → p-09d83447.system.entry.js} +2 -2
- package/dist/pine-core/{p-bd5de072.system.entry.js.map → p-09d83447.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-abe6c2d6.entry.js → p-0ac04129.entry.js} +2 -2
- package/dist/pine-core/{p-abe6c2d6.entry.js.map → p-0ac04129.entry.js.map} +1 -1
- package/dist/pine-core/{p-cd033c2a.entry.js → p-0ff89cf4.entry.js} +2 -2
- package/dist/pine-core/{p-cd033c2a.entry.js.map → p-0ff89cf4.entry.js.map} +1 -1
- package/dist/pine-core/p-1010d12b.system.entry.js +2 -0
- package/dist/pine-core/p-1010d12b.system.entry.js.map +1 -0
- package/dist/pine-core/p-110b2e03.entry.js +2 -0
- package/dist/pine-core/p-110b2e03.entry.js.map +1 -0
- package/dist/pine-core/{p-d8eeadd1.system.entry.js → p-172464c1.system.entry.js} +2 -2
- package/dist/pine-core/{p-64c07f01.system.entry.js → p-1a1a76ea.system.entry.js} +2 -2
- package/dist/pine-core/{p-e847089d.system.entry.js → p-1df1990d.system.entry.js} +2 -2
- package/dist/pine-core/p-1e80f274.entry.js +2 -0
- package/dist/pine-core/p-1e80f274.entry.js.map +1 -0
- package/dist/pine-core/{p-3558923a.entry.js → p-239891e6.entry.js} +2 -2
- package/dist/pine-core/p-34f84589.entry.js +2 -0
- package/dist/pine-core/p-34f84589.entry.js.map +1 -0
- package/dist/pine-core/{p-1692ed0c.entry.js → p-3acb18ad.entry.js} +2 -2
- package/dist/pine-core/{p-57d81378.entry.js → p-3e4225fc.entry.js} +2 -2
- package/dist/pine-core/{p-7fb3c253.entry.js → p-3ff2642d.entry.js} +2 -2
- package/dist/pine-core/{p-7fb3c253.entry.js.map → p-3ff2642d.entry.js.map} +1 -1
- package/dist/pine-core/{p-d9611049.system.entry.js → p-4043cf6e.system.entry.js} +2 -2
- package/dist/pine-core/{p-d9611049.system.entry.js.map → p-4043cf6e.system.entry.js.map} +1 -1
- package/dist/pine-core/p-45cf2585.system.js +3 -0
- package/dist/pine-core/p-45cf2585.system.js.map +1 -0
- package/dist/pine-core/{p-03ecf146.entry.js → p-4d22b02c.entry.js} +2 -2
- package/dist/pine-core/p-4f9b1945.entry.js +2 -0
- package/dist/pine-core/p-4f9b1945.entry.js.map +1 -0
- package/dist/pine-core/{p-961f79c5.system.entry.js → p-50918693.system.entry.js} +2 -2
- package/dist/pine-core/p-59214c8b.system.entry.js +2 -0
- package/dist/pine-core/p-59214c8b.system.entry.js.map +1 -0
- package/dist/pine-core/{p-a17dea5e.system.entry.js → p-59327483.system.entry.js} +2 -2
- package/dist/pine-core/p-59a43f75.system.entry.js +2 -0
- package/dist/pine-core/p-59a43f75.system.entry.js.map +1 -0
- package/dist/pine-core/{p-d461bee4.entry.js → p-59fcea0f.entry.js} +2 -2
- package/dist/pine-core/p-5c04aee0.system.js +2 -0
- package/dist/pine-core/p-5c04aee0.system.js.map +1 -0
- package/dist/pine-core/{p-85507ca5.system.entry.js → p-5c942465.system.entry.js} +2 -2
- package/dist/pine-core/{p-835c73f4.entry.js → p-624de926.entry.js} +2 -2
- package/dist/pine-core/p-65229490.entry.js +2 -0
- package/dist/pine-core/{p-ffa8e658.entry.js → p-6e079be2.entry.js} +2 -2
- package/dist/pine-core/p-6f8f471b.system.entry.js +2 -0
- package/dist/pine-core/p-6f8f471b.system.entry.js.map +1 -0
- package/dist/pine-core/{p-58a25131.entry.js → p-760e1c32.entry.js} +2 -2
- package/dist/pine-core/{p-58a25131.entry.js.map → p-760e1c32.entry.js.map} +1 -1
- package/dist/pine-core/{p-979ab4e2.system.entry.js → p-81bdf676.system.entry.js} +2 -2
- package/dist/pine-core/{p-8963f07a.entry.js → p-84a4930d.entry.js} +2 -2
- package/dist/pine-core/p-87fe352f.js +3 -0
- package/dist/pine-core/p-87fe352f.js.map +1 -0
- package/dist/pine-core/{p-6e15f0e1.entry.js → p-88410213.entry.js} +2 -2
- package/dist/pine-core/p-88702fa2.entry.js +2 -0
- package/dist/pine-core/p-88702fa2.entry.js.map +1 -0
- package/dist/pine-core/{p-d41fbbf0.system.entry.js → p-88edcb41.system.entry.js} +2 -2
- package/dist/pine-core/{p-469a84a3.system.entry.js → p-8ae84655.system.entry.js} +2 -2
- package/dist/pine-core/{p-469a84a3.system.entry.js.map → p-8ae84655.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-90707120.entry.js → p-9487df53.entry.js} +2 -2
- package/dist/pine-core/{p-c5afbc57.entry.js → p-953e6fde.entry.js} +2 -2
- package/dist/pine-core/{p-c5afbc57.entry.js.map → p-953e6fde.entry.js.map} +1 -1
- package/dist/pine-core/p-9db668f2.system.entry.js +2 -0
- package/dist/pine-core/p-9db668f2.system.entry.js.map +1 -0
- package/dist/pine-core/p-a2726d3b.system.entry.js +2 -0
- package/dist/pine-core/p-a2726d3b.system.entry.js.map +1 -0
- package/dist/pine-core/{p-95c2a6bf.entry.js → p-a51098dd.entry.js} +2 -2
- package/dist/pine-core/p-a9038f7f.js +2 -0
- package/dist/pine-core/{p-a98f5e91.system.entry.js → p-a9e02a6f.system.entry.js} +2 -2
- package/dist/pine-core/{p-a09284c5.entry.js → p-b7890a73.system.entry.js} +2 -2
- package/dist/pine-core/p-b7890a73.system.entry.js.map +1 -0
- package/dist/pine-core/{p-ca1fa95e.system.entry.js → p-b7edbe43.system.entry.js} +2 -2
- package/dist/pine-core/{p-366c4924.system.entry.js → p-b95522e6.system.entry.js} +2 -2
- package/dist/pine-core/{p-fe793116.entry.js → p-bbd19258.entry.js} +2 -2
- package/dist/pine-core/{p-d2c98df0.system.entry.js → p-c4aec6ce.system.entry.js} +2 -2
- package/dist/pine-core/{p-d2c98df0.system.entry.js.map → p-c4aec6ce.system.entry.js.map} +1 -1
- package/dist/pine-core/p-cbf2acbd.system.entry.js +2 -0
- package/dist/pine-core/p-cbf2acbd.system.entry.js.map +1 -0
- package/dist/pine-core/{p-852dce9d.system.entry.js → p-ce91ca6a.system.entry.js} +2 -2
- package/dist/pine-core/{p-852dce9d.system.entry.js.map → p-ce91ca6a.system.entry.js.map} +1 -1
- package/dist/pine-core/{p-f79b96ee.entry.js → p-ceb66096.entry.js} +3 -3
- package/dist/pine-core/{p-8930c3b7.system.entry.js → p-d3365f49.system.entry.js} +3 -3
- package/dist/pine-core/p-d37d900e.entry.js +2 -0
- package/dist/pine-core/p-d37d900e.entry.js.map +1 -0
- package/dist/pine-core/p-d5c90be4.entry.js +2 -0
- package/dist/pine-core/p-d5c90be4.entry.js.map +1 -0
- package/dist/pine-core/{p-7c4f8c64.entry.js → p-d6d8a21a.entry.js} +2 -2
- package/dist/pine-core/p-db622f8f.system.js +2 -0
- package/dist/pine-core/p-dc4a6d88.js +2 -0
- package/dist/pine-core/p-dc4a6d88.js.map +1 -0
- package/dist/pine-core/{p-bd593d1c.entry.js → p-e2a673e8.entry.js} +2 -2
- package/dist/pine-core/{p-d6873321.system.js → p-e3fab4be.system.js} +2 -2
- package/dist/pine-core/{p-1dccfe1b.system.entry.js → p-e64594ae.system.entry.js} +2 -2
- package/dist/pine-core/p-e90b2c75.system.js +2 -0
- package/dist/pine-core/p-e90b2c75.system.js.map +1 -0
- package/dist/pine-core/p-e936e948.entry.js +2 -0
- package/dist/pine-core/p-e936e948.entry.js.map +1 -0
- package/dist/pine-core/{p-9b0e5234.entry.js → p-ebdaf3ad.entry.js} +2 -2
- package/dist/pine-core/{p-4b856a95.system.entry.js → p-ece8530d.system.entry.js} +2 -2
- package/dist/pine-core/{p-0c2553c6.system.entry.js → p-ee21fa25.system.entry.js} +2 -2
- package/dist/pine-core/p-efbe2dc5.system.entry.js +2 -0
- package/dist/pine-core/p-efbe2dc5.system.entry.js.map +1 -0
- package/dist/pine-core/{p-4b06aed0.system.entry.js → p-f16ef73c.system.entry.js} +2 -2
- package/dist/pine-core/{p-2a4952ea.system.entry.js → p-f9719887.system.entry.js} +2 -2
- package/dist/pine-core/p-ff20b191.entry.js +2 -0
- package/dist/pine-core/p-ff20b191.entry.js.map +1 -0
- package/dist/pine-core/pine-core.css +1 -1
- package/dist/pine-core/pine-core.esm.js +1 -1
- package/dist/pine-core/pine-core.esm.js.map +1 -1
- package/dist/pine-core/pine-core.js +1 -1
- package/dist/pine-core/svg/bookmark.svg +1 -0
- package/dist/pine-core/svg/expand.svg +1 -1
- package/dist/pine-core/svg/file-add.svg +1 -1
- package/dist/pine-core/svg/layout-grid-02.svg +1 -0
- package/dist/pine-core/svg/user-star-filled.svg +1 -1
- package/dist/pine-core/svg/user-star.svg +1 -1
- package/dist/types/components/pds-button/pds-button.d.ts +2 -0
- package/dist/types/components/pds-chip/pds-chip.d.ts +8 -8
- package/dist/types/components/pds-copytext/pds-copytext.d.ts +3 -3
- package/dist/types/components/pds-divider/pds-divider.d.ts +1 -1
- package/dist/types/components/pds-image/pds-image.d.ts +7 -3
- package/dist/types/components/pds-input/pds-input.d.ts +4 -0
- package/dist/types/components/pds-link/pds-link.d.ts +7 -11
- package/dist/types/components/pds-popover/pds-popover.d.ts +45 -0
- package/dist/types/components/pds-radio/pds-radio.d.ts +11 -11
- package/dist/types/components/pds-select/pds-select.d.ts +91 -0
- package/dist/types/components/pds-switch/pds-switch.d.ts +11 -19
- package/dist/types/components/pds-text/pds-text.d.ts +27 -0
- package/dist/types/components/pds-textarea/pds-textarea.d.ts +4 -0
- package/dist/types/components/pds-tooltip/pds-tooltip.d.ts +5 -9
- package/dist/types/components.d.ts +419 -81
- package/dist/types/stencil-public-runtime.d.ts +2 -0
- package/dist/types/utils/types.d.ts +1 -1
- package/hydrate/index.js +350 -79
- package/hydrate/index.mjs +350 -79
- package/package.json +13 -10
- package/dist/cjs/index-2240f8f4.js.map +0 -1
- package/dist/cjs/index-d424fb6f.js.map +0 -1
- package/dist/esm/index-786a51ce.js.map +0 -1
- package/dist/esm/index-94bbabb0.js.map +0 -1
- package/dist/esm-es5/index-786a51ce.js +0 -2
- package/dist/esm-es5/index-786a51ce.js.map +0 -1
- package/dist/esm-es5/index-94bbabb0.js +0 -3
- package/dist/esm-es5/index-94bbabb0.js.map +0 -1
- package/dist/pine-core/p-0069affa.entry.js +0 -2
- package/dist/pine-core/p-0069affa.entry.js.map +0 -1
- package/dist/pine-core/p-14d3cdaf.system.js +0 -2
- package/dist/pine-core/p-14d3cdaf.system.js.map +0 -1
- package/dist/pine-core/p-244e264d.system.js +0 -2
- package/dist/pine-core/p-244e264d.system.js.map +0 -1
- package/dist/pine-core/p-2665d555.js +0 -2
- package/dist/pine-core/p-2665d555.js.map +0 -1
- package/dist/pine-core/p-37458cc7.entry.js +0 -2
- package/dist/pine-core/p-37458cc7.entry.js.map +0 -1
- package/dist/pine-core/p-3886e15a.entry.js +0 -2
- package/dist/pine-core/p-3886e15a.entry.js.map +0 -1
- package/dist/pine-core/p-496454a3.system.js +0 -2
- package/dist/pine-core/p-4fcf94ee.system.entry.js +0 -2
- package/dist/pine-core/p-4fcf94ee.system.entry.js.map +0 -1
- package/dist/pine-core/p-59cc888d.entry.js +0 -2
- package/dist/pine-core/p-72ee760e.entry.js +0 -2
- package/dist/pine-core/p-72ee760e.entry.js.map +0 -1
- package/dist/pine-core/p-77c5fe7b.entry.js +0 -2
- package/dist/pine-core/p-77c5fe7b.entry.js.map +0 -1
- package/dist/pine-core/p-7841bd18.js +0 -3
- package/dist/pine-core/p-7841bd18.js.map +0 -1
- package/dist/pine-core/p-7c79ff32.system.entry.js +0 -2
- package/dist/pine-core/p-7c79ff32.system.entry.js.map +0 -1
- package/dist/pine-core/p-91cba446.system.entry.js +0 -2
- package/dist/pine-core/p-91cba446.system.entry.js.map +0 -1
- package/dist/pine-core/p-a09284c5.entry.js.map +0 -1
- package/dist/pine-core/p-b54e35d2.system.entry.js +0 -2
- package/dist/pine-core/p-b54e35d2.system.entry.js.map +0 -1
- package/dist/pine-core/p-bb88538f.system.entry.js +0 -2
- package/dist/pine-core/p-bb88538f.system.entry.js.map +0 -1
- package/dist/pine-core/p-bc1ecf2f.js +0 -2
- package/dist/pine-core/p-c6bee7a0.system.js +0 -3
- package/dist/pine-core/p-c6bee7a0.system.js.map +0 -1
- package/dist/pine-core/p-d3eeb6f0.system.entry.js +0 -2
- package/dist/pine-core/p-d3eeb6f0.system.entry.js.map +0 -1
- package/dist/pine-core/p-dbc5775f.entry.js +0 -2
- package/dist/pine-core/p-dbc5775f.entry.js.map +0 -1
- package/dist/pine-core/p-ea27b026.system.entry.js +0 -2
- package/dist/pine-core/p-ea27b026.system.entry.js.map +0 -1
- /package/dist/esm-es5/{pds-label-d28da6eb.js.map → pds-label-62469596.js.map} +0 -0
- /package/dist/pine-core/{p-284433e0.entry.js.map → p-00cccccb.entry.js.map} +0 -0
- /package/dist/pine-core/{p-a8cb75f0.system.entry.js.map → p-08c4f190.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-d8eeadd1.system.entry.js.map → p-172464c1.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-64c07f01.system.entry.js.map → p-1a1a76ea.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-e847089d.system.entry.js.map → p-1df1990d.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-3558923a.entry.js.map → p-239891e6.entry.js.map} +0 -0
- /package/dist/pine-core/{p-1692ed0c.entry.js.map → p-3acb18ad.entry.js.map} +0 -0
- /package/dist/pine-core/{p-57d81378.entry.js.map → p-3e4225fc.entry.js.map} +0 -0
- /package/dist/pine-core/{p-03ecf146.entry.js.map → p-4d22b02c.entry.js.map} +0 -0
- /package/dist/pine-core/{p-961f79c5.system.entry.js.map → p-50918693.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-a17dea5e.system.entry.js.map → p-59327483.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-d461bee4.entry.js.map → p-59fcea0f.entry.js.map} +0 -0
- /package/dist/pine-core/{p-85507ca5.system.entry.js.map → p-5c942465.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-835c73f4.entry.js.map → p-624de926.entry.js.map} +0 -0
- /package/dist/pine-core/{p-59cc888d.entry.js.map → p-65229490.entry.js.map} +0 -0
- /package/dist/pine-core/{p-ffa8e658.entry.js.map → p-6e079be2.entry.js.map} +0 -0
- /package/dist/pine-core/{p-979ab4e2.system.entry.js.map → p-81bdf676.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-8963f07a.entry.js.map → p-84a4930d.entry.js.map} +0 -0
- /package/dist/pine-core/{p-6e15f0e1.entry.js.map → p-88410213.entry.js.map} +0 -0
- /package/dist/pine-core/{p-d41fbbf0.system.entry.js.map → p-88edcb41.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-90707120.entry.js.map → p-9487df53.entry.js.map} +0 -0
- /package/dist/pine-core/{p-95c2a6bf.entry.js.map → p-a51098dd.entry.js.map} +0 -0
- /package/dist/pine-core/{p-bc1ecf2f.js.map → p-a9038f7f.js.map} +0 -0
- /package/dist/pine-core/{p-a98f5e91.system.entry.js.map → p-a9e02a6f.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-ca1fa95e.system.entry.js.map → p-b7edbe43.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-366c4924.system.entry.js.map → p-b95522e6.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-fe793116.entry.js.map → p-bbd19258.entry.js.map} +0 -0
- /package/dist/pine-core/{p-f79b96ee.entry.js.map → p-ceb66096.entry.js.map} +0 -0
- /package/dist/pine-core/{p-8930c3b7.system.entry.js.map → p-d3365f49.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-7c4f8c64.entry.js.map → p-d6d8a21a.entry.js.map} +0 -0
- /package/dist/pine-core/{p-496454a3.system.js.map → p-db622f8f.system.js.map} +0 -0
- /package/dist/pine-core/{p-bd593d1c.entry.js.map → p-e2a673e8.entry.js.map} +0 -0
- /package/dist/pine-core/{p-d6873321.system.js.map → p-e3fab4be.system.js.map} +0 -0
- /package/dist/pine-core/{p-1dccfe1b.system.entry.js.map → p-e64594ae.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-9b0e5234.entry.js.map → p-ebdaf3ad.entry.js.map} +0 -0
- /package/dist/pine-core/{p-4b856a95.system.entry.js.map → p-ece8530d.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-0c2553c6.system.entry.js.map → p-ee21fa25.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-4b06aed0.system.entry.js.map → p-f16ef73c.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-2a4952ea.system.entry.js.map → p-f9719887.system.entry.js.map} +0 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["baseCss","PdsTextareaStyle0","pdsTextareaCss","PdsTextareaStyle1","PdsTextarea","exports","this","onTextareaChange","ev","textarea","target","isRequired","_this","value","pdsTextareaChange","emit","event","componentId","class_1","prototype","textareaClassNames","classNames","invalid","push","join","render","h","Host","key","disabled","class","label","PdsLabel","htmlFor","text","assignDescription","helperMessage","undefined","autocomplete","id","name","placeholder","readOnly","readonly","required","rows","onChange","messageId","icon","danger","size","errorMessage"],"sources":["src/global/styles/base.scss?tag=pds-textarea&encapsulation=shadow","src/components/pds-textarea/pds-textarea.scss?tag=pds-textarea&encapsulation=shadow","src/components/pds-textarea/pds-textarea.tsx"],"sourcesContent":["// TODO: replace core tokens with semantic\n// Heading color + outline\n\n/*\n Josh's Custom CSS Reset\n https://www.joshwcomeau.com/css/custom-css-reset/\n*/\n:where(*:not(slot), *:not(slot)::before, *:not(slot)::after) {\n box-sizing: border-box;\n}\n\n:where(*:not(slot)) {\n margin: 0;\n}\n\n:where(img, picture, video, canvas, svg) {\n display: block;\n max-width: 100%;\n}\n\n:where(input, button, textarea, select) {\n font: inherit;\n}\n\n:where(p, h1, h2, h3, h4, h5, h6) {\n overflow-wrap: break-word;\n}\n\n/*\n Additional Reset Styles\n*/\n:where(a:not([href]):not([class])) {\n color: currentColor;\n text-decoration: none;\n}\n\n:where(a:not([href]):not([class]):hover) {\n color: currentColor;\n text-decoration: none;\n}\n\n:where(ul[role='list'], ol[role='list']) {\n list-style: none;\n}\n\n:where(table) {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\n/*\n Mercury Base Styles\n*/\n// Typography\n:where(*:not(slot)) {\n font: var(--pine-typography-body-md-default);\n letter-spacing: var(--pine-letter-spacing-body-md);\n}\n\n:where(h1, h2, h3, h4, h5, h6) {\n font-family: var(--pine-font-family-heading);\n color: var(--pine-color-grey-950);\n}\n\n:where(h1) {\n font: var(--pine-typography-heading-h1);\n letter-spacing: var(--pine-letter-spacing-heading-h1);\n}\n\n:where(h2) {\n font: var(--pine-typography-heading-h2);\n letter-spacing: var(--pine-letter-spacing-heading-h2);\n}\n\n:where(h3) {\n font: var(--pine-typography-heading-h3);\n letter-spacing: var(--pine-letter-spacing-heading-h3);\n}\n\n:where(h4) {\n font: var(--pine-typography-heading-h4);\n letter-spacing: var(--pine-letter-spacing-heading-h4);\n}\n\n:where(h5) {\n font: var(--pine-typography-heading-h5);\n letter-spacing: var(--pine-letter-spacing-heading-h5);\n}\n\n:where(h6) {\n font: var(--pine-typography-heading-h6);\n letter-spacing: var(--pine-letter-spacing-heading-h6);\n}\n\n:where(div, label, p, span) {\n color: var(--pine-color-text-default);\n}\n\n:where(code, kbd, pre, samp) {\n font-family: monospace;\n}\n\n// Accessibility\n:where([role=\"button\"]) {\n cursor: pointer;\n}\n\n:where(:focus) {\n outline: 0;\n}\n\n:where(:focus-visible) {\n outline: var(--pine-border-width-thick) solid var(--pine-color-purple-500);\n}\n\n// Misc.\n:where([hidden]) {\n display: none !important;\n}\n",":host {\n --border-interactive-default: var(--pine-border-interactive-default);\n --border-interactive-hover: var(--pine-border-interactive-hover);\n\n --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--color-focus-visible-outline);\n --box-shadow-focus-error: 0 0 0 1px #ffffff, 0 0 0 3px var(--color-focus-visible-outline-error);\n\n --color-background-default: var(--pine-color-white);\n --color-background-disabled: var(--pine-color-grey-100);\n --color-background-hover: var(--pine-color-grey-050);\n --color-background-error-default: var(--pine-color-red-050);\n --color-border-error-default: var(--pine-color-red-600);\n --color-border-focus-visible: var(--pine-color-grey-400);\n --color-border-hover: var(--pine-color-grey-400);\n --color-focus-visible-outline: var(--pine-color-purple-300);\n --color-focus-visible-outline-error: var(--pine-color-red-300);\n --color-text-disabled-default: var(--pine-color-grey-400);\n --color-text-message-error-default: var(--pine-color-red-600);\n --color-text-placeholder-default: var(--pine-color-grey-600);\n --color-text-placeholder-disabled: var(--pine-color-grey-400);\n\n --font-weight-label-default: var(--pine-font-weight-body-medium);\n\n --spacing-margin-block-end-label: var(--pine-spacing-100);\n --spacing-margin-block-start-helper-message: var(--pine-spacing-100);\n --spacing-padding-block-field: var(--pine-spacing-100);\n --spacing-padding-inline-field: var(--pine-spacing-200);\n --spacing-icon-error-message: var(--pine-spacing-050);\n\n --typography-message-default: var(--pine-typography-body-sm-default);\n\n display: inline;\n}\n\n.pds-textarea {\n display: flex;\n flex-direction: column;\n}\n\nlabel {\n display: block;\n font-weight: var(--font-weight-label-default);\n margin-block-end: var(--spacing-margin-block-end-label);\n}\n\n.pds-textarea__field {\n background-color: var(--color-background-default);\n border: var(--border-interactive-default);\n border-radius: var(--pine-border-radius-100);\n padding: var(--spacing-padding-block-field) var(--spacing-padding-inline-field);\n\n &:hover:not(:disabled, .is-invalid) {\n border: var(--border-interactive-hover);\n }\n\n &:disabled {\n background-color: var(--color-background-disabled);\n color: var(--color-text-disabled-default);\n cursor: not-allowed;\n }\n\n &:focus-visible {\n // outline: var(--pine-border-focus); Border radius for outline does not work in Safari\n box-shadow: var(--box-shadow-focus); // Remove when outline radius is supported in Safari\n outline: none;\n }\n\n &::placeholder {\n color: var(--color-text-placeholder-default);\n }\n\n &.is-invalid {\n border-color: var(--color-border-error-default);\n\n &:focus-visible {\n box-shadow: var(--box-shadow-focus-error);\n }\n }\n}\n\n.pds-textarea__error-message,\n.pds-textarea__helper-message {\n font: var(--typography-message-default);\n margin-block-start: var(--spacing-margin-block-start-helper-message);\n}\n\n.pds-textarea__error-message {\n align-items: center;\n color: var(--color-text-message-error-default);\n display: flex;\n gap: var(--spacing-icon-error-message);\n}\n","import { Component, Element, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\nimport { assignDescription, isRequired, messageId } from '../../utils/form';\nimport { TextareaChangeEventDetail } from './textarea-interface';\nimport { PdsLabel } from '../_internal/pds-label/pds-label';\nimport { danger } from '@pine-ds/icons/icons';\n\n@Component({\n tag: 'pds-textarea',\n styleUrls: ['../../global/styles/base.scss', 'pds-textarea.scss'],\n shadow: true,\n})\nexport class PdsTextarea {\n @Element() el: HTMLPdsTextareaElement;\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 textarea is disabled\n * @defaultValue false\n */\n @Prop() disabled = false;\n\n /**\n * Specifies the error text and provides an error-themed treatment to the field\n */\n @Prop() errorMessage?: string;\n\n /**\n * Displays a hint or description of the textarea\n */\n @Prop() helperMessage?: string;\n\n /**\n * Indicates whether or not the textarea is invalid or throws an error\n * @defaultValue false\n */\n @Prop({mutable: true}) invalid = false; // eslint-disable-line @stencil-community/strict-mutable\n\n /**\n * Text to be displayed as the textarea label\n */\n @Prop() label?: string;\n\n /**\n * Specifies the name, submitted with the form name/value pair. This value will mirror the componentId\n */\n @Prop() name: string = this.componentId;\n\n /**\n * Specifies a short hint that describes the expected value of the textarea\n */\n @Prop() placeholder?: string;\n\n /**\n * Indicates whether or not the textarea is readonly\n * @defaultValue false\n */\n @Prop() readonly = false;\n\n /**\n * Indicates whether or not the textarea is required\n * @defaultValue false\n */\n @Prop() required = false;\n\n /**\n * Sets number of rows of text visible without needing to scroll in the textarea\n */\n @Prop() rows?: number;\n\n /**\n * The value of the textarea\n */\n @Prop({mutable: true}) value?: string;\n\n /**\n * Event emitted whenever the value of the textarea changes\n */\n @Event() pdsTextareaChange: EventEmitter<TextareaChangeEventDetail>;\n\n private onTextareaChange = (ev: Event) => {\n const textarea = ev.target as HTMLTextAreaElement;\n isRequired(textarea, this);\n\n if (textarea) {\n this.value = textarea.value;\n }\n\n this.pdsTextareaChange.emit({value: this.value, event: ev});\n };\n\n private textareaClassNames() {\n const classNames = ['pds-textarea__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 >\n <div class=\"pds-textarea\">\n {this.label &&\n <PdsLabel htmlFor={this.componentId} text={this.label} />\n }\n <textarea\n aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n autocomplete={this.autocomplete}\n class={this.textareaClassNames()}\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 rows={this.rows}\n onChange={this.onTextareaChange}\n >{this.value}</textarea>\n {this.helperMessage &&\n <p\n class=\"pds-textarea__helper-message\"\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </p>\n }\n {this.invalid &&\n <p\n aria-live=\"assertive\"\n class=\"pds-textarea__error-message\"\n id={messageId(this.componentId, 'error')}\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </p>\n }\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"sRAAA,IAAMA,EAAU,yrDAChB,IAAAC,EAAeD,ECDf,IAAME,EAAiB,+1GACvB,IAAAC,EAAeD,E,ICUFE,EAAWC,EAAA,0B,wFA6EdC,KAAAC,iBAAmB,SAACC,GAC1B,IAAMC,EAAWD,EAAGE,OACpBC,EAAWF,EAAUG,GAErB,GAAIH,EAAU,CACZG,EAAKC,MAAQJ,EAASI,K,CAGxBD,EAAKE,kBAAkBC,KAAK,CAACF,MAAOD,EAAKC,MAAOG,MAAOR,G,uEApEtC,M,sEAgBc,M,+BAUVF,KAAKW,Y,yCAWT,M,cAMA,M,yCA4BXC,EAAAC,UAAAC,mBAAA,WACN,IAAMC,EAAa,CAAC,uBAEpB,GAAIf,KAAKgB,SAAWhB,KAAKgB,UAAY,KAAM,CACzCD,EAAWE,KAAK,a,CAGlB,OAAOF,EAAWG,KAAK,K,EAGzBN,EAAAC,UAAAM,OAAA,WACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2DACYtB,KAAKuB,SAAW,OAAS,MAExCH,EAAA,OAAAE,IAAA,2CAAKE,MAAM,gBACRxB,KAAKyB,OACJL,EAACM,EAAQ,CAAAJ,IAAA,2CAACK,QAAS3B,KAAKW,YAAaiB,KAAM5B,KAAKyB,QAElDL,EAAA,YAAAE,IAAA,8DACoBO,EAAkB7B,KAAKW,YAAaX,KAAKgB,QAAShB,KAAK8B,eAAc,eACzE9B,KAAKgB,QAAU,OAASe,UACtCC,aAAchC,KAAKgC,aACnBR,MAAOxB,KAAKc,qBACZS,SAAUvB,KAAKuB,SACfU,GAAIjC,KAAKW,YACTuB,KAAMlC,KAAKkC,KACXC,YAAanC,KAAKmC,YAClBC,SAAUpC,KAAKqC,SACfC,SAAUtC,KAAKsC,SACfC,KAAMvC,KAAKuC,KACXC,SAAUxC,KAAKC,kBACfD,KAAKO,OACNP,KAAK8B,eACJV,EAAA,KAAAE,IAAA,2CACEE,MAAM,+BACNS,GAAIQ,EAAUzC,KAAKW,YAAa,WAE/BX,KAAK8B,eAGT9B,KAAKgB,SACJI,EAAA,KAAAE,IAAA,uDACY,YACVE,MAAM,8BACNS,GAAIQ,EAAUzC,KAAKW,YAAa,UAEhCS,EAAA,YAAAE,IAAA,2CAAUoB,KAAMC,EAAQC,KAAK,UAC5B5C,KAAK6C,e,uHAxII,I","ignoreList":[]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,h as e}from"./p-87fe352f.js";const i=':host{display:inline}h1{font-family:"GreetStandard";font-size:28px;font-weight:600;letter-spacing:0.26px;line-height:1.25}h2{font-family:"GreetStandard";font-size:26px;font-weight:600;letter-spacing:0.24px;line-height:1.25}h3{font-family:"GreetStandard";font-size:22px;font-weight:600;letter-spacing:0.22px;line-height:1.25}h4{font-family:"GreetStandard";font-size:20px;font-weight:600;letter-spacing:0.2px;line-height:1.25}h5{font-family:"GreetStandard";font-size:18px;font-weight:500;letter-spacing:0.18px;line-height:1.25}h6{font-family:"GreetStandard";font-size:16px;font-weight:500;letter-spacing:0.16px;line-height:1.25}code,em,p,pre,strong{font-family:"Inter";font-size:14px;font-weight:400;letter-spacing:-0.16px;line-height:1.425}code,pre{font-family:monospace;letter-spacing:0;line-height:1}em{font-style:normal}strong{font-weight:bolder}h1,h2,h3,h4,h5,h6,p,code,pre,em,strong{color:var(--pine-color-text-default);margin:0}:host([truncate])>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host([italic])>*{font-style:italic}.pds-text--color-primary{color:var(--pine-color-white)}.pds-text--color-secondary{color:var(--pine-color-grey-800)}.pds-text--color-neutral{color:var(--pine-color-grey-900)}.pds-text--color-accent{color:var(--pine-color-purple-900)}.pds-text--color-danger{color:var(--pine-color-red-900)}.pds-text--color-info{color:var(--pine-color-blue-900)}.pds-text--color-success{color:var(--pine-color-green-900)}.pds-text--color-warning{color:var(--pine-color-yellow-900)}.pds-text--size-2xl{font-size:20px}.pds-text--size-xl{font-size:18px}.pds-text--size-lg{font-size:16px}.pds-text--size-md{font-size:14px}.pds-text--size-sm{font-size:12px}.pds-text--size-xs{font-size:10px}.pds-text--size-2xs{font-size:8px}.pds-text--weight-extra-light{font-weight:200}.pds-text--weight-light{font-weight:300}.pds-text--weight-regular{font-weight:400}.pds-text--weight-medium{font-weight:500}.pds-text--weight-semibold{font-weight:600}.pds-text--weight-bold{font-weight:700}.pds-text--gutter-2xl{-webkit-margin-after:48px;margin-block-end:48px}.pds-text--gutter-xl{-webkit-margin-after:40px;margin-block-end:40px}.pds-text--gutter-lg{-webkit-margin-after:32px;margin-block-end:32px}.pds-text--gutter-md{-webkit-margin-after:24px;margin-block-end:24px}.pds-text--gutter-sm{-webkit-margin-after:16px;margin-block-end:16px}.pds-text--gutter-xs{-webkit-margin-after:8px;margin-block-end:8px}.pds-text--gutter-2xs{-webkit-margin-after:4px;margin-block-end:4px}.pds-text--align-start{text-align:start}.pds-text--align-center{text-align:center}.pds-text--align-end{text-align:end}.pds-text--align-justify{text-align:justify}';const n=i;const s=class{constructor(e){t(this,e);this.align=undefined;this.color=undefined;this.gutter=undefined;this.size=undefined;this.weight=undefined;this.tag="p"}render(){const t=this.tag;const i=`\n pds-text\n ${this.align!==undefined&&this.align.trim()!==""?`pds-text--align-${this.align}`:""}\n ${this.color!==undefined&&this.color.trim()!==""?`pds-text--color-${this.color}`:""}\n ${this.gutter!==undefined&&this.gutter.trim()!==""?`pds-text--gutter-${this.gutter}`:""}\n ${this.size!==undefined&&this.size.trim()!==""?`pds-text--size-${this.size}`:""}\n ${this.weight!==undefined&&this.weight.trim()!==""?`pds-text--weight-${this.weight}`:""}\n `;return e(t,{key:"3ccf61734e14ed7ea5013bce54717d2846b64f07",class:i},e("slot",{key:"7368685e2042d306006bf8fc83b80ec246ca252d"}))}};s.style=n;export{s as pds_text};
|
|
2
|
+
//# sourceMappingURL=p-110b2e03.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["pdsTextCss","PdsTextStyle0","PdsText","render","Tag","this","tag","typeClasses","align","undefined","trim","color","gutter","size","weight","h","key","class"],"sources":["src/components/pds-text/pds-text.scss?tag=pds-text&encapsulation=shadow","src/components/pds-text/pds-text.tsx"],"sourcesContent":[":host {\n display: inline;\n}\n\n// TODO: Update all values to match new semantic tokens, if applicable\n\n/* stylelint-disable */\nh1 {\n font-family: \"GreetStandard\";\n font-size: 28px;\n font-weight: 600;\n letter-spacing: 0.26px;\n line-height: 1.25;\n}\n\nh2 {\n font-family: \"GreetStandard\";\n font-size: 26px;\n font-weight: 600;\n letter-spacing: 0.24px;\n line-height: 1.25;\n}\n\nh3 {\n font-family: \"GreetStandard\";\n font-size: 22px;\n font-weight: 600;\n letter-spacing: 0.22px;\n line-height: 1.25;\n}\n\nh4 {\n font-family: \"GreetStandard\";\n font-size: 20px;\n font-weight: 600;\n letter-spacing: 0.20px;\n line-height: 1.25;\n}\n\nh5 {\n font-family: \"GreetStandard\";\n font-size: 18px;\n font-weight: 500;\n letter-spacing: 0.18px;\n line-height: 1.25;\n}\n\nh6 {\n font-family: \"GreetStandard\";\n font-size: 16px;\n font-weight: 500;\n letter-spacing: 0.16px;\n line-height: 1.25;\n}\n\ncode, em, p, pre, strong {\n font-family: \"Inter\";\n font-size: 14px;\n font-weight: 400;\n letter-spacing: -0.16px;\n line-height: 1.425;\n}\n/* stylelint-enable */\n\ncode, pre {\n font-family: monospace;\n letter-spacing: 0;\n line-height: 1;\n}\n\nem {\n font-style: normal;\n}\n\nstrong {\n font-weight: bolder;\n}\n\nh1, h2, h3, h4, h5, h6, p, code, pre, em, strong {\n color: var(--pine-color-text-default);\n margin: 0;\n}\n\n:host([truncate]) > * {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n:host([italic]) > * {\n font-style: italic\n}\n\n\n// Colors/Variants/Sentiment\n$type-colors: (\n primary: var(--pine-color-white),\n secondary: var(--pine-color-grey-800),\n neutral: var(--pine-color-grey-900),\n accent: var(--pine-color-purple-900),\n danger: var(--pine-color-red-900),\n info: var(--pine-color-blue-900),\n success: var(--pine-color-green-900),\n warning: var(--pine-color-yellow-900),\n);\n\n@mixin generate-type-colors($type-colors) {\n @each $key, $value in $type-colors {\n .pds-text--color-#{$key} {\n color: $value;\n }\n }\n}\n\n@include generate-type-colors($type-colors);\n\n// Font Sizes\n$type-sizes: (\n 2xl: 20px,\n xl: 18px,\n lg: 16px,\n md: 14px,\n sm: 12px,\n xs: 10px,\n 2xs: 8px,\n);\n\n@mixin generate-type-sizes($type-sizes) {\n @each $key, $value in $type-sizes {\n .pds-text--size-#{$key} {\n font-size: $value;\n }\n }\n}\n\n@include generate-type-sizes($type-sizes);\n\n// Font Weights\n$type-weights: (\n extra-light: 200,\n light: 300,\n regular: 400,\n medium: 500,\n semibold: 600,\n bold: 700,\n);\n\n@mixin generate-type-weights($type-weights) {\n @each $key, $value in $type-weights {\n .pds-text--weight-#{$key} {\n font-weight: $value;\n }\n }\n}\n\n@include generate-type-weights($type-weights);\n\n// Gutter Sizes\n$type-gutters: (\n 2xl: 48px,\n xl: 40px,\n lg: 32px,\n md: 24px,\n sm: 16px,\n xs: 8px,\n 2xs: 4px,\n);\n\n@mixin generate-type-gutters($type-gutters) {\n @each $key, $value in $type-gutters {\n .pds-text--gutter-#{$key} {\n margin-block-end: $value;\n }\n }\n}\n\n@include generate-type-gutters($type-gutters);\n\n// Text Alignment\n$type-alignments: (\n start: start,\n center: center,\n end: end,\n justify: justify,\n);\n\n@mixin generate-type-alignments($type-alignments) {\n @each $key, $value in $type-alignments {\n .pds-text--align-#{$key} {\n text-align: $value;\n }\n }\n}\n\n@include generate-type-alignments($type-alignments);\n","import { Component, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pds-text',\n styleUrl: 'pds-text.scss',\n shadow: true,\n})\nexport class PdsText {\n\n /**\n * Sets the text alignment.\n */\n @Prop() align?: 'start' | 'center' | 'end' | 'justify';\n\n /**\n * Sets the text color.\n */\n @Prop() color?:\n | 'primary'\n | 'secondary'\n | 'neutral'\n | 'accent'\n | 'danger'\n | 'info'\n | 'success'\n | 'warning';\n\n /**\n * Set the bottom margin for the text.\n */\n @Prop() gutter?:\n | '2xl'\n | 'xl'\n | 'lg'\n | 'md'\n | 'sm'\n | 'xs'\n | '2xs';\n\n /**\n * Sets the font size.\n */\n @Prop() size?:\n | '2xl'\n | 'xl'\n | 'lg'\n | 'md'\n | 'sm'\n | 'xs'\n | '2xs';\n\n /**\n * Sets the font weight.\n */\n @Prop() weight?:\n | 'extra-light'\n | 'light'\n | 'regular'\n | 'medium'\n | 'semibold'\n | 'bold';\n\n /**\n * Determines what semantic text tag to render.\n */\n @Prop() tag:\n | 'h1'\n | 'h2'\n | 'h3'\n | 'h4'\n | 'h5'\n | 'h6'\n | 'p'\n | 'code'\n | 'pre'\n | 'strong'\n | 'em' = \"p\";\n\n render() {\n const Tag = this.tag;\n\n const typeClasses = `\n pds-text\n ${this.align !== undefined && this.align.trim() !== '' ? `pds-text--align-${this.align}` : ''}\n ${this.color !== undefined && this.color.trim() !== '' ? `pds-text--color-${this.color}` : ''}\n ${this.gutter !== undefined && this.gutter.trim() !== '' ? `pds-text--gutter-${this.gutter}` : ''}\n ${this.size !== undefined && this.size.trim() !== '' ? `pds-text--size-${this.size}` : ''}\n ${this.weight !== undefined && this.weight.trim() !== '' ? `pds-text--weight-${this.weight}` : ''}\n `;\n\n return (\n <Tag class={typeClasses}>\n <slot />\n </Tag>\n );\n }\n}\n"],"mappings":"2CAAA,MAAMA,EAAa,qlFACnB,MAAAC,EAAeD,E,MCMFE,EAAO,M,4IAqET,G,CAET,MAAAC,GACE,MAAMC,EAAMC,KAAKC,IAEjB,MAAMC,EAAc,2BAEhBF,KAAKG,QAAUC,WAAaJ,KAAKG,MAAME,SAAW,GAAK,mBAAmBL,KAAKG,QAAU,aACzFH,KAAKM,QAAUF,WAAaJ,KAAKM,MAAMD,SAAW,GAAK,mBAAmBL,KAAKM,QAAU,aACzFN,KAAKO,SAAWH,WAAaJ,KAAKO,OAAOF,SAAW,GAAK,oBAAoBL,KAAKO,SAAW,aAC7FP,KAAKQ,OAASJ,WAAaJ,KAAKQ,KAAKH,SAAW,GAAK,kBAAkBL,KAAKQ,OAAS,aACrFR,KAAKS,SAAWL,WAAaJ,KAAKS,OAAOJ,SAAW,GAAK,oBAAoBL,KAAKS,SAAW,WAGjG,OACEC,EAACX,EAAG,CAAAY,IAAA,2CAACC,MAAOV,GACVQ,EAAA,QAAAC,IAAA,6C","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
System.register(["./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
System.register(["./p-45cf2585.system.js","./p-224a435b.system.js"],(function(e){"use strict";var t,r,o,i,n,a;return{setters:[function(e){t=e.r;r=e.c;o=e.h;i=e.H;n=e.g},function(e){a=e.c}],execute:function(){var h=":where(*:not(slot),*:not(slot)::before,*:not(slot)::after){-webkit-box-sizing:border-box;box-sizing:border-box}:where(*:not(slot)){margin:0}:where(img,picture,video,canvas,svg){display:block;max-width:100%}:where(input,button,textarea,select){font:inherit}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(a:not([href]):not([class])){color:currentColor;text-decoration:none}:where(a:not([href]):not([class]):hover){color:currentColor;text-decoration:none}:where(ul[role=list],ol[role=list]){list-style:none}:where(table){border-collapse:collapse;border-spacing:0}:where(*:not(slot)){font:var(--pine-typography-body-md-default);letter-spacing:var(--pine-letter-spacing-body-md)}:where(h1,h2,h3,h4,h5,h6){font-family:var(--pine-font-family-heading);color:var(--pine-color-grey-950)}:where(h1){font:var(--pine-typography-heading-h1);letter-spacing:var(--pine-letter-spacing-heading-h1)}:where(h2){font:var(--pine-typography-heading-h2);letter-spacing:var(--pine-letter-spacing-heading-h2)}:where(h3){font:var(--pine-typography-heading-h3);letter-spacing:var(--pine-letter-spacing-heading-h3)}:where(h4){font:var(--pine-typography-heading-h4);letter-spacing:var(--pine-letter-spacing-heading-h4)}:where(h5){font:var(--pine-typography-heading-h5);letter-spacing:var(--pine-letter-spacing-heading-h5)}:where(h6){font:var(--pine-typography-heading-h6);letter-spacing:var(--pine-letter-spacing-heading-h6)}:where(div,label,p,span){color:var(--pine-color-text-default)}:where(code,kbd,pre,samp){font-family:monospace}:where([role=button]){cursor:pointer}:where(:focus){outline:0}:where(:focus-visible){outline:var(--pine-border-width-thick) solid var(--pine-color-purple-500)}:where([hidden]){display:none !important}";var s=h;var l=":host{--color-background-fixed:var(--pine-color-white);--color-background-interactive:var(--pine-color-grey-200);border-color:inherit;display:table-row;vertical-align:inherit}:host::part(checkbox-cell){background-color:var(--color-background-fixed);left:0;position:-webkit-sticky;position:sticky;z-index:1}:host(:hover),:host(:hover)::part(checkbox-cell),:host(:hover) ::slotted(pds-table-cell),:host(.is-selected),:host(.is-selected)::part(checkbox-cell),:host(.is-selected) ::slotted(pds-table-cell){background:var(--color-background-interactive)}";var c=l;var d=e("pds_table_row",function(){function e(e){var o=this;t(this,e);this.pdsTableRowSelected=r(this,"pdsTableRowSelected",7);this.handleClick=function(){o.isSelected=!o.isSelected;o.handleSelect(o.isSelected)};this.handleSelect=function(e){o.indeterminate=false;if(!a("pds-table-head",o.hostElement)){var t=Array.from(o.hostElement.parentNode.children).indexOf(o.hostElement);o.pdsTableRowSelected.emit({rowIndex:t,isSelected:e})}};this.generateUniqueId=function(){var e=Math.random().toString(36).substring(2,8);var t=(new Date).toISOString().replace(/[:.]/g,"-");var r="".concat(e,"-").concat(t);return r};this.indeterminate=undefined;this.isSelected=undefined}e.prototype.classNames=function(){var e=[];if(this.isSelected){e.push("is-selected")}return e.join(" ")};e.prototype.componentWillRender=function(){this.tableRef=this.hostElement.closest("pds-table");if(this.tableRef&&this.tableRef.fixedColumn){var e=this.hostElement.querySelector("pds-table-cell");e===null||e===void 0?void 0:e.classList.add("is-fixed")}};e.prototype.componentWillLoad=function(){if(this.isSelected){this.handleSelect(this.isSelected)}};e.prototype.render=function(){return o(i,{key:"510501e1d6c567394bfaba09ac44bb9455a169a1",class:this.classNames(),role:"row"},this.tableRef&&this.tableRef.selectable&&o("pds-table-cell",{key:"14105fd6283f92b9158138bc2da1623b24b7796f",part:this.tableRef.fixedColumn?"checkbox-cell":"",class:this.tableRef.selectable?"has-checkbox":""},o("pds-checkbox",{key:"a70e4fb1a7a08d4126a63328fd75970b4a637f76",componentId:this.generateUniqueId(),onClick:this.handleClick,indeterminate:this.indeterminate,label:"Select Row",labelHidden:true,checked:this.isSelected})),o("slot",{key:"5deb2da8405d0792a43531695ece38afe8fda9b4"}))};Object.defineProperty(e.prototype,"hostElement",{get:function(){return n(this)},enumerable:false,configurable:true});return e}());d.style=s+c}}}));
|
|
2
|
+
//# sourceMappingURL=p-172464c1.system.entry.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
System.register(["./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
System.register(["./p-45cf2585.system.js"],(function(n){"use strict";var i,t,e,r;return{setters:[function(n){i=n.r;t=n.h;e=n.H;r=n.g}],execute:function(){var s=false;var o=function(n){var i;var t=(i=document.head.querySelector("meta[data-pine-asset-path]"))===null||i===void 0?void 0:i.dataset.pineAssetPath;var e=window.__PINE_ASSET_PATH__;var r="https://cdn.jsdelivr.net/npm/@pine-ds/icons/dist/pds-icons/";var o=t||e||r||"/";if(o.startsWith("https://cdn.jsdelivr.net/npm/")&&!s){s=true;console.warn("\n Fetching Pine asssets from jsDelivr CDN.\n\n It's recommended that you bundle Pine Assets with your application and setting the path accordingly.\n\nFor more information you read the documentation: \nhttps://pine-design-system.netlify.app/?path=/docs/resources-assets--docs\n ")}var a=n;if(n.startsWith("./")){a=n.substring(2)}if(!o.endsWith("/")){a="/"+a}return o+a};var a;var u=function(){if(typeof window==="undefined"){return new Map}else{if(!a){var n=window;n.PdsIcons=n.PdsIcons||{};a=n.PdsIcons.map=n.PdsIcons.map||new Map}return a}};var f=function(n,i){if(!n&&i&&!h(i)){n=i}if(v(n)){n=p(n)}if(!v(n)||n.trim()===""){return null}var t=n.replace(/[a-z]|-|\d/gi,"");if(t!=""){return null}return n};var c=function(n){var i=u().get(n);if(i){return i}return o("svg/".concat(n,".svg"))};var l=function(n){if(v(n)){n=n.trim();if(h(n)){return n}}return null};var d=function(n){var i=l(n.src);if(i){return i}i=f(n.name,n.icon);if(i){return c(i)}if(n.icon){i=l(n.icon);if(i){return i}}return null};var h=function(n){return n.length>0&&/(\/|\.)/.test(n)};var v=function(n){return typeof n==="string"};var p=function(n){return n.toLowerCase()};var m=function(n,i){if(i===void 0){i=[]}var t={};i.forEach((function(i){if(n.hasAttribute(i)){var e=n.getAttribute(i);if(e!==null){t[i]=n.getAttribute(i)}n.removeAttribute(i)}}));return t};var g=function(n){var i=document.createElement("div");i.innerHTML=n;for(var t=i.childNodes.length-1;t>=0;t--){if(i.childNodes[t].nodeName.toLowerCase()!=="svg"){i.removeChild(i.childNodes[t])}}var e=i.firstElementChild;if(e&&e.nodeName.toLowerCase()==="svg"){var r=e.getAttribute("class")||"";e.setAttribute("class",(r+" s-pds-icon").trim());if(w(e)){return i.innerHTML}}return""};var w=function(n){if(n.nodeType===1){if(n.nodeName.toLowerCase()==="script"){return false}for(var i=0;i<n.attributes.length;i++){var t=n.attributes[i].name;if(v(t)&&t.toLowerCase().indexOf("on")===0){return false}}for(var i=0;i<n.childNodes.length;i++){if(!w(n.childNodes[i])){return false}}}return true};var b=function(n){return n.startsWith("data:image/svg+xml")};var y=function(n){return n.indexOf(";utf8,")!==-1};var x=new Map;var j=new Map;var M;var O=function(n,i){if(i===void 0){i=false}var t=j.get(n);if(!t){if(typeof fetch!="undefined"&&typeof document!=="undefined"){if(b(n)&&y(n)){if(!M){M=new DOMParser}var e=M.parseFromString(n,"text/html");var r=e.querySelector("svg");if(r){x.set(n,r.outerHTML)}return Promise.resolve()}else{t=fetch(n).then((function(t){if(t.ok){return t.text().then((function(t){if(t&&i!==false){t=g(t)}x.set(n,t||"")}))}x.set(n,"")}));j.set(n,t)}}else{x.set(n,"");return Promise.resolve()}}return t};var P=":host{--dimension-icon-height:16px;--dimension-icon-width:16px;--color-icon-fill:currentColor;contain:strict;display:inline-block;fill:var(--color-icon-fill);height:var(--dimension-icon-height);width:var(--dimension-icon-width)}:host .pdsicon{fill:var(--color-icon-fill)}.pds-icon-fill-none{fill:none}.icon-inner,.pds-icon,svg{display:block;height:100%;width:100%}";var D=P;var I=n("pds_icon",function(){function n(n){var t=this;i(this,n);this.inheritedAttributes={};this.hasAriaHidden=function(){var n=t.el;return n.hasAttribute("aria-hidden")&&n.getAttribute("aria-hidden")==="true"};this.ariaLabel=undefined;this.isVisible=false;this.svgContent=undefined;this.color=undefined;this.icon=undefined;this.name=undefined;this.size="regular";this.src=undefined}n.prototype.iconSize=function(){var n={small:"12px",regular:"16px",medium:"20px",large:"24px"};if(n[this.size]){return n[this.size]}else{return this.size}};n.prototype.componentDidLoad=function(){this.setCSSVariables()};n.prototype.componentWillLoad=function(){this.inheritedAttributes=m(this.el,["aria-label"]);this.setCSSVariables()};n.prototype.setCSSVariables=function(){this.el.style.setProperty("--dimension-icon-height",this.iconSize());this.el.style.setProperty("--dimension-icon-width",this.iconSize());this.el.style.setProperty("--color-icon-fill",typeof this.color!=="undefined"?this.color:"currentColor")};n.prototype.connectedCallback=function(){var n=this;this.waitUntilVisible(this.el,"50px",(function(){n.isVisible=true;n.loadIcon()}))};n.prototype.disconnectedCallback=function(){if(this.io){this.io.disconnect();this.io=undefined}};n.prototype.updateStyles=function(){this.setCSSVariables()};n.prototype.loadIcon=function(){var n=this;if(this.isVisible){var i=d(this);if(i){if(x.has(i)){this.svgContent=x.get(i)}else{O(i).then((function(){return n.svgContent=x.get(i)}))}}}var t=f(this.name,this.icon);if(t){this.ariaLabel=t.replace(/\-/g," ")}};n.prototype.render=function(){var n=this,i=n.ariaLabel,r=n.inheritedAttributes;return t(e,Object.assign({key:"4bbc232e2530d43e8b5afefb754486d94ea6538b","aria-label":i!==undefined&&!this.hasAriaHidden()?i:null,alt:"",role:"img",class:Object.assign({},k(this.color))},r),this.svgContent?t("div",{class:"icon-inner",innerHTML:this.svgContent}):t("div",{class:"icon-inner"}))};n.prototype.waitUntilVisible=function(n,i,t){var e=this;if(typeof window!=="undefined"&&window.IntersectionObserver){var r=this.io=new window.IntersectionObserver((function(n){if(n[0].isIntersecting){r.disconnect();e.io=undefined;t()}}),{rootMargin:i});r.observe(n)}else{t()}};Object.defineProperty(n,"assetsDirs",{get:function(){return["svg"]},enumerable:false,configurable:true});Object.defineProperty(n.prototype,"el",{get:function(){return r(this)},enumerable:false,configurable:true});Object.defineProperty(n,"watchers",{get:function(){return{size:["updateStyles"],color:["updateStyles"],name:["loadIcon"],src:["loadIcon"],icon:["loadIcon"]}},enumerable:false,configurable:true});return n}());var k=function(n){var i;return n?(i={"pds-color":true},i["pds-color-".concat(n)]=true,i):null};I.style=D}}}));
|
|
2
|
+
//# sourceMappingURL=p-1a1a76ea.system.entry.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
System.register(["./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
System.register(["./p-45cf2585.system.js"],(function(e){"use strict";var t,a,i,n;return{setters:[function(e){t=e.r;a=e.h;i=e.H;n=e.g}],execute:function(){var r=":where(*:not(slot),*:not(slot)::before,*:not(slot)::after){-webkit-box-sizing:border-box;box-sizing:border-box}:where(*:not(slot)){margin:0}:where(img,picture,video,canvas,svg){display:block;max-width:100%}:where(input,button,textarea,select){font:inherit}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(a:not([href]):not([class])){color:currentColor;text-decoration:none}:where(a:not([href]):not([class]):hover){color:currentColor;text-decoration:none}:where(ul[role=list],ol[role=list]){list-style:none}:where(table){border-collapse:collapse;border-spacing:0}:where(*:not(slot)){font:var(--pine-typography-body-md-default);letter-spacing:var(--pine-letter-spacing-body-md)}:where(h1,h2,h3,h4,h5,h6){font-family:var(--pine-font-family-heading);color:var(--pine-color-grey-950)}:where(h1){font:var(--pine-typography-heading-h1);letter-spacing:var(--pine-letter-spacing-heading-h1)}:where(h2){font:var(--pine-typography-heading-h2);letter-spacing:var(--pine-letter-spacing-heading-h2)}:where(h3){font:var(--pine-typography-heading-h3);letter-spacing:var(--pine-letter-spacing-heading-h3)}:where(h4){font:var(--pine-typography-heading-h4);letter-spacing:var(--pine-letter-spacing-heading-h4)}:where(h5){font:var(--pine-typography-heading-h5);letter-spacing:var(--pine-letter-spacing-heading-h5)}:where(h6){font:var(--pine-typography-heading-h6);letter-spacing:var(--pine-letter-spacing-heading-h6)}:where(div,label,p,span){color:var(--pine-color-text-default)}:where(code,kbd,pre,samp){font-family:monospace}:where([role=button]){cursor:pointer}:where(:focus){outline:0}:where(:focus-visible){outline:var(--pine-border-width-thick) solid var(--pine-color-purple-500)}:where([hidden]){display:none !important}";var s=r;var o=":host{--spacing-panel-margin-top:0;--spacing-panel-padding:0;--outline:2px solid var(--pine-color-blue-200);--spacing-gap-availability:var(--pine-spacing-100);--spacing-gap-default:var(--pine-spacing-300);--spacing-gap-filter:var(--pine-spacing-200);display:block}.pds-tabs__tablist{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--spacing-gap-default)}:host(.pds-tabs--availability) .pds-tabs__tablist{gap:var(--spacing-gap-availability)}:host(.pds-tabs--filter) .pds-tabs__tablist{gap:var(--spacing-gap-filter)}";var h=o;var p=e("pds_tabs",function(){function e(e){t(this,e);this.tablistLabel=undefined;this.componentId=undefined;this.variant=undefined;this.activeTabName=undefined;this.activeTabIndex=undefined}e.prototype.tabClickHandler=function(e){if(this.componentId===e.detail[1]){this.activeTabIndex=e.detail[0];this.activeTabName=this.tabs[this.activeTabIndex].name}};e.prototype.handleKeyDown=function(e){var t=["ArrowLeft","ArrowRight","Home","End"];if(t.includes(e.key)){e.preventDefault();this.moveActiveTab(e.key)}};e.prototype.moveActiveTab=function(e){var t=0;var a=this.tabs.length-1;var i=null;switch(e){case"ArrowLeft":i=this.activeTabIndex===t?a:this.activeTabIndex+-1;break;case"ArrowRight":i=this.activeTabIndex===a?t:this.activeTabIndex+1;break;case"Home":i=t;break;case"End":i=a;break}this.tabs[i].children[0].focus();this.activeTabName=this.tabs[i].name;this.activeTabIndex=i};e.prototype.findAllChildren=function(){this.tabs=this.el.querySelectorAll("pds-tab");this.tabPanels=this.el.querySelectorAll("pds-tabpanel")};e.prototype.propGeneration=function(e,t){if(t===void 0){t=0}e.parentComponentId=this.componentId.toString();e.variant=this.variant.toString();e.selected=this.activeTabName===e.name?true:false;e["index"]=t};e.prototype.passPropsToChildren=function(){var e=this;this.tabs.forEach((function(t,a){if(e.activeTabName===t.name)e.activeTabIndex=a;e.propGeneration(t,a)}));this.tabPanels.forEach((function(t){e.propGeneration(t)}))};e.prototype.classNames=function(){var e="pds-tabs";if(this.variant&&this.variant!="primary"){var t="pds-tabs--".concat(this.variant);e+=" "+t}return e};e.prototype.componentWillLoad=function(){this.findAllChildren()};e.prototype.componentWillRender=function(){this.passPropsToChildren()};e.prototype.render=function(){return a(i,{key:"8b7537e2fc9007aaca3c1a6baff0a1c3d6b2cb07","active-tab-name":this.activeTabName,class:this.classNames(),id:this.componentId},a("div",{key:"7afa678022c1170d3912137897a5ece92e7b4394",class:"pds-tabs__tablist",role:"tablist","aria-label":this.tablistLabel},a("slot",{key:"e2026e752548b4cdf8f768137e4bb567550ef3cd",name:"tabs"})),a("slot",{key:"c3a3fbbfab88494b45e5d1cc6563877df2017f9f",name:"tabpanels"}))};Object.defineProperty(e.prototype,"el",{get:function(){return n(this)},enumerable:false,configurable:true});return e}());p.style=s+h}}}));
|
|
2
|
+
//# sourceMappingURL=p-1df1990d.system.entry.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,h as r,H as o,g as e}from"./p-87fe352f.js";const a=({elem:t,elemPlacement:r,overlay:o,offset:e=8})=>{if(t==undefined)return;const a=t.getBoundingClientRect();const i=o.getBoundingClientRect();if(!r||r=="")return;switch(true){case r.includes("right"):o.style.top="50%";o.style.left=`calc(${a.width}px + ${e}px)`;o.style.transform="translateY(-50%)";if(r.includes("start")){o.style.top="0";o.style.transform="translateY(0)"}if(r.includes("end")){o.style.bottom="0";o.style.top="initial";o.style.transform="translateY(0)"}break;case r.includes("left"):o.style.top="50%";o.style.right=`calc(${a.width}px + ${e}px)`;o.style.transform="translateY(-50%)";if(r.includes("start")){o.style.top="0";o.style.transform="translateY(0)"}if(r.includes("end")){o.style.bottom="0";o.style.top="initial";o.style.transform="translateY(0)"}break;case r.includes("bottom"):o.style.top=`calc(${a.height}px + ${e}px)`;o.style.left="50%";o.style.transform="translateX(-50%)";if(r.includes("start")){o.style.left="0";o.style.transform="translateX(0)"}if(r.includes("end")){o.style.left="initial";o.style.right="0";o.style.transform="translateX(0)"}break;case r.includes("top"):o.style.top=`calc((${i.height}px + ${e}px) * -1)`;o.style.left="50%";o.style.transform="translateX(-50%)";if(r.includes("start")){o.style.left="0";o.style.transform="translateX(0)"}if(r.includes("end")){o.style.left="initial";o.style.right="0";o.style.transform="translateX(0)"}break}};const i=":where(*:not(slot),*:not(slot)::before,*:not(slot)::after){-webkit-box-sizing:border-box;box-sizing:border-box}:where(*:not(slot)){margin:0}:where(img,picture,video,canvas,svg){display:block;max-width:100%}:where(input,button,textarea,select){font:inherit}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(a:not([href]):not([class])){color:currentColor;text-decoration:none}:where(a:not([href]):not([class]):hover){color:currentColor;text-decoration:none}:where(ul[role=list],ol[role=list]){list-style:none}:where(table){border-collapse:collapse;border-spacing:0}:where(*:not(slot)){font:var(--pine-typography-body-md-default);letter-spacing:var(--pine-letter-spacing-body-md)}:where(h1,h2,h3,h4,h5,h6){font-family:var(--pine-font-family-heading);color:var(--pine-color-grey-950)}:where(h1){font:var(--pine-typography-heading-h1);letter-spacing:var(--pine-letter-spacing-heading-h1)}:where(h2){font:var(--pine-typography-heading-h2);letter-spacing:var(--pine-letter-spacing-heading-h2)}:where(h3){font:var(--pine-typography-heading-h3);letter-spacing:var(--pine-letter-spacing-heading-h3)}:where(h4){font:var(--pine-typography-heading-h4);letter-spacing:var(--pine-letter-spacing-heading-h4)}:where(h5){font:var(--pine-typography-heading-h5);letter-spacing:var(--pine-letter-spacing-heading-h5)}:where(h6){font:var(--pine-typography-heading-h6);letter-spacing:var(--pine-letter-spacing-heading-h6)}:where(div,label,p,span){color:var(--pine-color-text-default)}:where(code,kbd,pre,samp){font-family:monospace}:where([role=button]){cursor:pointer}:where(:focus){outline:0}:where(:focus-visible){outline:var(--pine-border-width-thick) solid var(--pine-color-purple-500)}:where([hidden]){display:none !important}";const n=i;const l=':host{--border-radius-overlay:var(--pine-border-radius-125);--border-width-arrow-down:var(--sizing-arrow-default) var(--sizing-arrow-default) 0;--border-width-arrow-left:var(--sizing-arrow-default) var(--sizing-arrow-default) var(--sizing-arrow-default) 0;--border-width-arrow-right:var(--sizing-arrow-default) 0 var(--sizing-arrow-default) var(--sizing-arrow-default);--border-width-arrow-up:0 var(--sizing-arrow-default) var(--sizing-arrow-default);--box-shadow-default:var(--pine-box-shadow-200);--color-background-default:var(--pine-color-grey-950);--color-text-default:var(--pine-color-white);--sizing-arrow-default:6px;--sizing-arrow-offset:14px;--sizing-width-default:320px;--spacing-padding-overlay:var(--pine-spacing-100) calc(var(--pine-spacing-300) / 2);display:inline-block;position:relative}:host ::slotted(*){display:-ms-flexbox;display:flex}:host ::slotted([slot=content]){display:block;max-width:var(--sizing-width-default);white-space:normal}.pds-tooltip__content{background-color:var(--color-background-default);border-radius:var(--border-radius-overlay);-webkit-box-shadow:var(--box-shadow-default);box-shadow:var(--box-shadow-default);color:var(--color-text-default);max-width:var(--sizing-width-default);opacity:0;padding:var(--spacing-padding-overlay);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(--border-width-arrow-left);content:"";height:0;position:absolute;width:0}.pds-tooltip--right .pds-tooltip__content::after{border-inline-end-color:var(--color-background-default);border-width:var(--border-width-arrow-left);left:calc(var(--sizing-arrow-default) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--right-end .pds-tooltip__content::after{border-inline-end-color:var(--color-background-default);border-width:var(--border-width-arrow-left);bottom:var(--sizing-arrow-offset);left:calc(var(--sizing-arrow-default) * -1);top:initial}.pds-tooltip--right-start .pds-tooltip__content::after{border-inline-end-color:var(--color-background-default);border-width:var(--border-width-arrow-left);left:calc(var(--sizing-arrow-default) * -1);top:var(--sizing-arrow-offset)}.pds-tooltip--top .pds-tooltip__content::after{border-block-start-color:var(--color-background-default);border-width:var(--border-width-arrow-down);bottom:calc(var(--sizing-arrow-default) * -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(--color-background-default);border-width:var(--border-width-arrow-down);bottom:calc(var(--sizing-arrow-default) * -1);left:var(--sizing-arrow-offset);top:initial}.pds-tooltip--top-end .pds-tooltip__content::after{border-block-start-color:var(--color-background-default);border-width:var(--border-width-arrow-down);bottom:calc(var(--sizing-arrow-default) * -1);left:initial;right:var(--sizing-arrow-offset);top:initial}.pds-tooltip--left .pds-tooltip__content::after{border-inline-start-color:var(--color-background-default);border-width:var(--border-width-arrow-right);left:initial;right:calc(var(--sizing-arrow-default) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--left-end .pds-tooltip__content::after{border-inline-start-color:var(--color-background-default);border-width:var(--border-width-arrow-right);bottom:var(--sizing-arrow-offset);left:initial;right:calc(var(--sizing-arrow-default) * -1);top:initial}.pds-tooltip--left-start .pds-tooltip__content::after{border-inline-start-color:var(--color-background-default);border-width:var(--border-width-arrow-right);left:initial;right:calc(var(--sizing-arrow-default) * -1);top:var(--sizing-arrow-offset)}.pds-tooltip--bottom .pds-tooltip__content::after{border-block-end-color:var(--color-background-default);border-width:var(--border-width-arrow-up);left:50%;top:calc(var(--sizing-arrow-default) * -1);-webkit-transform:translateX(-50%);transform:translateX(-50%)}.pds-tooltip--bottom-end .pds-tooltip__content::after{border-block-end-color:var(--color-background-default);border-width:var(--border-width-arrow-up);left:initial;right:var(--sizing-arrow-offset);top:calc(var(--sizing-arrow-default) * -1)}.pds-tooltip--bottom-start .pds-tooltip__content::after{border-block-end-color:var(--color-background-default);border-width:var(--border-width-arrow-up);left:var(--sizing-arrow-offset);top:calc(var(--sizing-arrow-default) * -1)}.pds-tooltip--no-arrow .pds-tooltip__content::after{border-width:0}';const d=l;const s=class{constructor(r){t(this,r);this.handleHide=()=>{this.hideTooltip()};this.handleShow=()=>{this.showTooltip()};this.isOpen=false;this.content=undefined;this.componentId=undefined;this.hasArrow=true;this.htmlContent=false;this.placement="right";this.maxWidth="352px";this.opened=false}handleOpenToggle(){if(this.opened){this.handleShow()}else{this.handleHide()}}componentWillLoad(){if(this.opened){this.showTooltip()}this.el.addEventListener("blur",this.handleHide,true);this.el.addEventListener("focus",this.handleShow,true)}componentDidUpdate(){if(this.opened){this.showTooltip()}}componentDidRender(){a({elem:this.el,elemPlacement:this.placement,overlay:this.contentEl})}async showTooltip(){this.opened=true}async hideTooltip(){this.opened=false}render(){return r(o,{key:"f4a8cd19668e7cc20a70ae13a0f6dcf0f809df65",onMouseEnter:this.handleShow,onMouseLeave:this.handleHide,onFocusin:this.handleShow,onFocusout:this.handleHide},r("div",{key:"b83498c6ea8e404b2abc25cc75daa95807649dba",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 `},r("span",{key:"47ace7d3f543f0d86987389c76b25da0ad6be9b7","aria-describedby":this.componentId,class:"pds-tooltip__trigger"},r("slot",{key:"45bae92d87b8a67c00608c18f76aa9333d8d82a7"})),r("div",{key:"a745ce513f1563cb8ea5a86bf27ee31f3e0d4392",class:"pds-tooltip__content","aria-hidden":this.opened?"false":"true","aria-live":this.opened?"polite":"off",id:this.componentId,ref:t=>this.contentEl=t,role:"tooltip",style:{maxWidth:this.maxWidth}},r("slot",{key:"8c46fe5951624e2de4128bd0f819e1e55155a7b5",name:"content"}),this.content)))}get el(){return e(this)}static get watchers(){return{opened:["handleOpenToggle"]}}};s.style=n+d;export{s as pds_tooltip};
|
|
2
|
+
//# sourceMappingURL=p-1e80f274.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["positionTooltip","elem","elemPlacement","overlay","offset","undefined","rect","getBoundingClientRect","contentRect","includes","style","top","left","width","transform","bottom","right","height","baseCss","PdsTooltipStyle0","pdsTooltipCss","PdsTooltipStyle1","PdsTooltip","this","handleHide","hideTooltip","handleShow","showTooltip","handleOpenToggle","opened","componentWillLoad","el","addEventListener","componentDidUpdate","componentDidRender","placement","contentEl","render","h","Host","key","onMouseEnter","onMouseLeave","onFocusin","onFocusout","class","htmlContent","hasArrow","componentId","id","ref","role","maxWidth","name","content"],"sources":["src/utils/overlay.ts","src/global/styles/base.scss?tag=pds-tooltip&encapsulation=shadow","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","// TODO: replace core tokens with semantic\n// Heading color + outline\n\n/*\n Josh's Custom CSS Reset\n https://www.joshwcomeau.com/css/custom-css-reset/\n*/\n:where(*:not(slot), *:not(slot)::before, *:not(slot)::after) {\n box-sizing: border-box;\n}\n\n:where(*:not(slot)) {\n margin: 0;\n}\n\n:where(img, picture, video, canvas, svg) {\n display: block;\n max-width: 100%;\n}\n\n:where(input, button, textarea, select) {\n font: inherit;\n}\n\n:where(p, h1, h2, h3, h4, h5, h6) {\n overflow-wrap: break-word;\n}\n\n/*\n Additional Reset Styles\n*/\n:where(a:not([href]):not([class])) {\n color: currentColor;\n text-decoration: none;\n}\n\n:where(a:not([href]):not([class]):hover) {\n color: currentColor;\n text-decoration: none;\n}\n\n:where(ul[role='list'], ol[role='list']) {\n list-style: none;\n}\n\n:where(table) {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\n/*\n Mercury Base Styles\n*/\n// Typography\n:where(*:not(slot)) {\n font: var(--pine-typography-body-md-default);\n letter-spacing: var(--pine-letter-spacing-body-md);\n}\n\n:where(h1, h2, h3, h4, h5, h6) {\n font-family: var(--pine-font-family-heading);\n color: var(--pine-color-grey-950);\n}\n\n:where(h1) {\n font: var(--pine-typography-heading-h1);\n letter-spacing: var(--pine-letter-spacing-heading-h1);\n}\n\n:where(h2) {\n font: var(--pine-typography-heading-h2);\n letter-spacing: var(--pine-letter-spacing-heading-h2);\n}\n\n:where(h3) {\n font: var(--pine-typography-heading-h3);\n letter-spacing: var(--pine-letter-spacing-heading-h3);\n}\n\n:where(h4) {\n font: var(--pine-typography-heading-h4);\n letter-spacing: var(--pine-letter-spacing-heading-h4);\n}\n\n:where(h5) {\n font: var(--pine-typography-heading-h5);\n letter-spacing: var(--pine-letter-spacing-heading-h5);\n}\n\n:where(h6) {\n font: var(--pine-typography-heading-h6);\n letter-spacing: var(--pine-letter-spacing-heading-h6);\n}\n\n:where(div, label, p, span) {\n color: var(--pine-color-text-default);\n}\n\n:where(code, kbd, pre, samp) {\n font-family: monospace;\n}\n\n// Accessibility\n:where([role=\"button\"]) {\n cursor: pointer;\n}\n\n:where(:focus) {\n outline: 0;\n}\n\n:where(:focus-visible) {\n outline: var(--pine-border-width-thick) solid var(--pine-color-purple-500);\n}\n\n// Misc.\n:where([hidden]) {\n display: none !important;\n}\n",":host {\n --border-radius-overlay: var(--pine-border-radius-125);\n\n --border-width-arrow-down: var(--sizing-arrow-default) var(--sizing-arrow-default) 0;\n --border-width-arrow-left: var(--sizing-arrow-default) var(--sizing-arrow-default) var(--sizing-arrow-default) 0;\n --border-width-arrow-right: var(--sizing-arrow-default) 0 var(--sizing-arrow-default) var(--sizing-arrow-default);\n --border-width-arrow-up: 0 var(--sizing-arrow-default) var(--sizing-arrow-default);\n\n --box-shadow-default: var(--pine-box-shadow-200);\n\n --color-background-default: var(--pine-color-grey-950);\n --color-text-default: var(--pine-color-white);\n\n --sizing-arrow-default: 6px;\n --sizing-arrow-offset: 14px;\n --sizing-width-default: 320px;\n\n --spacing-padding-overlay: var(--pine-spacing-100) calc(var(--pine-spacing-300) / 2);\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(--sizing-width-default);\n white-space: normal;\n }\n}\n\n.pds-tooltip__content {\n background-color: var(--color-background-default);\n border-radius: var(--border-radius-overlay);\n box-shadow: var(--box-shadow-default);\n color: var(--color-text-default);\n // TODO: need to use block / none but the tooltip content width and height are needed for calculations\n max-width: var(--sizing-width-default);\n opacity: 0;\n padding: var(--spacing-padding-overlay);\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(--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(--color-background-default);\n border-width: var(--border-width-arrow-left);\n left: calc(var(--sizing-arrow-default) * -1);\n top: 50%;\n transform: translateY(-50%);\n }\n\n .pds-tooltip--right-end & {\n border-inline-end-color: var(--color-background-default);\n border-width: var(--border-width-arrow-left);\n bottom: var(--sizing-arrow-offset);\n left: calc(var(--sizing-arrow-default) * -1);\n top: initial;\n }\n\n .pds-tooltip--right-start & {\n border-inline-end-color: var(--color-background-default);\n border-width: var(--border-width-arrow-left);\n left: calc(var(--sizing-arrow-default) * -1);\n top: var(--sizing-arrow-offset);\n }\n\n .pds-tooltip--top & {\n border-block-start-color: var(--color-background-default);\n border-width: var(--border-width-arrow-down);\n bottom: calc(var(--sizing-arrow-default) * -1);\n left: 50%;\n top: initial;\n transform: translateX(-50%);\n }\n\n .pds-tooltip--top-start & {\n border-block-start-color: var(--color-background-default);\n border-width: var(--border-width-arrow-down);\n bottom: calc(var(--sizing-arrow-default) * -1);\n left: var(--sizing-arrow-offset);\n top: initial;\n }\n\n .pds-tooltip--top-end & {\n border-block-start-color: var(--color-background-default);\n border-width: var(--border-width-arrow-down);\n bottom: calc(var(--sizing-arrow-default) * -1);\n left: initial;\n right: var(--sizing-arrow-offset);\n top: initial;\n }\n\n .pds-tooltip--left & {\n border-inline-start-color: var(--color-background-default);\n border-width: var(--border-width-arrow-right);\n left: initial;\n right: calc(var(--sizing-arrow-default) * -1);\n top: 50%;\n transform: translateY(-50%);\n }\n\n .pds-tooltip--left-end & {\n border-inline-start-color: var(--color-background-default);\n border-width: var(--border-width-arrow-right);\n bottom: var(--sizing-arrow-offset);\n left: initial;\n right: calc(var(--sizing-arrow-default) * -1);\n top: initial;\n }\n\n .pds-tooltip--left-start & {\n border-inline-start-color: var(--color-background-default);\n border-width: var(--border-width-arrow-right);\n left: initial;\n right: calc(var(--sizing-arrow-default) * -1);\n top: var(--sizing-arrow-offset);\n }\n\n .pds-tooltip--bottom & {\n border-block-end-color: var(--color-background-default);\n border-width: var(--border-width-arrow-up);\n left: 50%;\n top: calc(var(--sizing-arrow-default) * -1);\n transform: translateX(-50%);\n }\n\n .pds-tooltip--bottom-end & {\n border-block-end-color: var(--color-background-default);\n border-width: var(--border-width-arrow-up);\n left: initial;\n right: var(--sizing-arrow-offset);\n top: calc(var(--sizing-arrow-default) * -1);\n }\n\n .pds-tooltip--bottom-start & {\n border-block-end-color: var(--color-background-default);\n border-width: var(--border-width-arrow-up);\n left: var(--sizing-arrow-offset);\n top: calc(var(--sizing-arrow-default) * -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: ['../../global/styles/base.scss', '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 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 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":"yDAOO,MAAMA,EAAkB,EAAEC,OAAMC,gBAAeC,UAASC,SAAS,MACtE,GAAIH,GAAQI,UAAW,OAEvB,MAAMC,EAAOL,EAAKM,wBAClB,MAAMC,EAAcL,EAAQI,wBAG5B,IAAKL,GAAiBA,GAAiB,GAAI,OAE3C,OAAQ,MACN,KAAKA,EAAcO,SAAS,SAC1BN,EAAQO,MAAMC,IAAM,MACpBR,EAAQO,MAAME,KAAO,QAAQN,EAAKO,aAAaT,OAC/CD,EAAQO,MAAMI,UAAY,mBAE1B,GAAIZ,EAAcO,SAAS,SAAU,CACnCN,EAAQO,MAAMC,IAAM,IACpBR,EAAQO,MAAMI,UAAY,e,CAG5B,GAAIZ,EAAcO,SAAS,OAAQ,CACjCN,EAAQO,MAAMK,OAAS,IACvBZ,EAAQO,MAAMC,IAAM,UACpBR,EAAQO,MAAMI,UAAY,e,CAG5B,MAEF,KAAKZ,EAAcO,SAAS,QAC1BN,EAAQO,MAAMC,IAAM,MACpBR,EAAQO,MAAMM,MAAQ,QAAQV,EAAKO,aAAaT,OAChDD,EAAQO,MAAMI,UAAY,mBAE1B,GAAIZ,EAAcO,SAAS,SAAU,CACnCN,EAAQO,MAAMC,IAAM,IACpBR,EAAQO,MAAMI,UAAY,e,CAG5B,GAAIZ,EAAcO,SAAS,OAAQ,CACjCN,EAAQO,MAAMK,OAAS,IACvBZ,EAAQO,MAAMC,IAAM,UACpBR,EAAQO,MAAMI,UAAY,e,CAG5B,MAEF,KAAKZ,EAAcO,SAAS,UAC1BN,EAAQO,MAAMC,IAAM,QAAQL,EAAKW,cAAcb,OAC/CD,EAAQO,MAAME,KAAO,MACrBT,EAAQO,MAAMI,UAAY,mBAE1B,GAAIZ,EAAcO,SAAS,SAAU,CACnCN,EAAQO,MAAME,KAAO,IACrBT,EAAQO,MAAMI,UAAY,e,CAG5B,GAAIZ,EAAcO,SAAS,OAAQ,CACjCN,EAAQO,MAAME,KAAO,UACrBT,EAAQO,MAAMM,MAAQ,IACtBb,EAAQO,MAAMI,UAAY,e,CAG5B,MAEF,KAAKZ,EAAcO,SAAS,OAC1BN,EAAQO,MAAMC,IAAM,SAASH,EAAYS,cAAcb,aACvDD,EAAQO,MAAME,KAAO,MACrBT,EAAQO,MAAMI,UAAY,mBAE1B,GAAIZ,EAAcO,SAAS,SAAU,CACnCN,EAAQO,MAAME,KAAO,IACrBT,EAAQO,MAAMI,UAAY,e,CAE5B,GAAIZ,EAAcO,SAAS,OAAQ,CACjCN,EAAQO,MAAME,KAAO,UACrBT,EAAQO,MAAMM,MAAQ,IACtBb,EAAQO,MAAMI,UAAY,e,CAG5B,M,ECtFN,MAAMI,EAAU,yrDAChB,MAAAC,EAAeD,ECDf,MAAME,EAAgB,qtJACtB,MAAAC,EAAeD,E,MCcFE,EAAU,M,yBA8GbC,KAAAC,WAAa,KACnBD,KAAKE,aAAa,EAGZF,KAAAG,WAAa,KACnBH,KAAKI,aAAa,E,YAvGF,M,gEAgBE,K,iBAME,M,eAkBL,Q,cAMU,Q,YAMoB,K,CAG/C,gBAAAC,GACE,GAAIL,KAAKM,OAAQ,CACfN,KAAKG,Y,KACA,CACLH,KAAKC,Y,EAIT,iBAAAM,GACE,GAAIP,KAAKM,OAAQ,CACfN,KAAKI,a,CAGPJ,KAAKQ,GAAGC,iBAAiB,OAAQT,KAAKC,WAAY,MAClDD,KAAKQ,GAAGC,iBAAiB,QAAST,KAAKG,WAAY,K,CAGrD,kBAAAO,GACE,GAAIV,KAAKM,OAAQ,CACfN,KAAKI,a,EAIT,kBAAAO,GACElC,EAAgB,CAACC,KAAMsB,KAAKQ,GAAI7B,cAAeqB,KAAKY,UAAWhC,QAASoB,KAAKa,W,CAO/E,iBAAMT,GACJJ,KAAKM,OAAS,I,CAOhB,iBAAMJ,GACJF,KAAKM,OAAS,K,CAWhB,MAAAQ,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,aAAclB,KAAKG,WACnBgB,aAAcnB,KAAKC,WACnBmB,UAAWpB,KAAKG,WAChBkB,WAAYrB,KAAKC,YAEjBc,EAAA,OAAAE,IAAA,2CACEK,MAAO,uDAEUtB,KAAKY,0BAClBZ,KAAKuB,YAAc,gCAAkC,mBACrDvB,KAAKM,OAAS,uBAAyB,mBACvCN,KAAKwB,SAAW,GAAK,uCAGzBT,EAAA,QAAAE,IAAA,8DACoBjB,KAAKyB,YACvBH,MAAM,wBAENP,EAAA,QAAAE,IAAA,8CAGFF,EAAA,OAAAE,IAAA,2CAAKK,MAAM,uBAAsB,cAClBtB,KAAKM,OAAS,QAAU,OAAM,YAChCN,KAAKM,OAAS,SAAW,MACpCoB,GAAI1B,KAAKyB,YACTE,IAAMnB,GAAQR,KAAKa,UAAYL,EAC/BoB,KAAK,UACLzC,MAAO,CAAE0C,SAAU7B,KAAK6B,WAExBd,EAAA,QAAAE,IAAA,2CACEa,KAAK,YAEN9B,KAAK+B,U","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as e,h as a,H as r}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as e,h as a,H as r}from"./p-87fe352f.js";import{d as n}from"./p-dc4a6d88.js";const i=":where(*:not(slot),*:not(slot)::before,*:not(slot)::after){-webkit-box-sizing:border-box;box-sizing:border-box}:where(*:not(slot)){margin:0}:where(img,picture,video,canvas,svg){display:block;max-width:100%}:where(input,button,textarea,select){font:inherit}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(a:not([href]):not([class])){color:currentColor;text-decoration:none}:where(a:not([href]):not([class]):hover){color:currentColor;text-decoration:none}:where(ul[role=list],ol[role=list]){list-style:none}:where(table){border-collapse:collapse;border-spacing:0}:where(*:not(slot)){font:var(--pine-typography-body-md-default);letter-spacing:var(--pine-letter-spacing-body-md)}:where(h1,h2,h3,h4,h5,h6){font-family:var(--pine-font-family-heading);color:var(--pine-color-grey-950)}:where(h1){font:var(--pine-typography-heading-h1);letter-spacing:var(--pine-letter-spacing-heading-h1)}:where(h2){font:var(--pine-typography-heading-h2);letter-spacing:var(--pine-letter-spacing-heading-h2)}:where(h3){font:var(--pine-typography-heading-h3);letter-spacing:var(--pine-letter-spacing-heading-h3)}:where(h4){font:var(--pine-typography-heading-h4);letter-spacing:var(--pine-letter-spacing-heading-h4)}:where(h5){font:var(--pine-typography-heading-h5);letter-spacing:var(--pine-letter-spacing-heading-h5)}:where(h6){font:var(--pine-typography-heading-h6);letter-spacing:var(--pine-letter-spacing-heading-h6)}:where(div,label,p,span){color:var(--pine-color-text-default)}:where(code,kbd,pre,samp){font-family:monospace}:where([role=button]){cursor:pointer}:where(:focus){outline:0}:where(:focus-visible){outline:var(--pine-border-width-thick) solid var(--pine-color-purple-500)}:where([hidden]){display:none !important}";const o=i;const t=":host{display:block}details{--border-radius-default:var(--pine-border-radius-default);--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-purple-300);--color-background-default:var(--pine-color-white);--color-background-hover:var(--pine-color-grey-150);--color-text-default:var(--pine-color-text-interactive-default);--color-text-active:var(--pine-color-grey-950);--color-text-hover:var(--pine-color-grey-800);--font-weight-active:var(--pine-font-weight-semi-bold);--number-animation-transform-timing:200ms;--spacing-details-padding-inline:var(--pine-spacing-150);--spacing-details-padding-block-end:calc(var(--pine-spacing-200) + 2);--spacing-summary-padding-block:calc(var(--pine-spacing-150) / 2);--spacing-summary-padding-inline-start:var(--pine-spacing-100);--spacing-summary-padding-inline-end:var(--pine-spacing-050);--typography-default:var(--pine-typography-body-md-medium);border-radius:var(--border-radius-default)}details pds-icon{-webkit-transform:scaleY(1);transform:scaleY(1)}details[open]{background-color:var(--color-background-default)}details[open] summary{color:var(--color-text-active);font-weight:var(--font-weight-active)}details[open] summary pds-icon{-webkit-transform:scaleY(-1);transform:scaleY(-1)}summary{background-color:var(--color-background-default);border-radius:var(--border-radius-default);color:var(--color-text-default);font:var(--typography-default);padding-block:var(--spacing-summary-padding-block);-webkit-padding-end:var(--spacing-summary-padding-inline-end);padding-inline-end:var(--spacing-summary-padding-inline-end);-webkit-padding-start:var(--spacing-summary-padding-inline-start);padding-inline-start:var(--spacing-summary-padding-inline-start);-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex}summary::-webkit-details-marker{display:none}summary:hover{background:var(--color-background-hover);color:var(--color-text-hover);cursor:pointer}summary:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none;position:relative}summary pds-icon{-webkit-margin-start:auto;margin-inline-start:auto}.pds-accordion__body{-webkit-padding-after:var(--spacing-details-padding-block-end);padding-block-end:var(--spacing-details-padding-block-end);padding-inline:var(--spacing-details-padding-inline)}";const d=t;const s=class{constructor(a){e(this,a);this.handleToggle=()=>{this.isOpen=this.detailsEl.open};this.getOpenAttribute=()=>{if(this.isOpen!==false){return{open:true}}return""};this.componentId=undefined;this.isOpen=false}handleOpenState(e){this.isOpen=e}componentDidLoad(){this.detailsEl.addEventListener("toggle",this.handleToggle)}render(){return a(r,{key:"9a8c2f915879f63d8a7255cf0f58b55f4b590eed",class:"pds-accordion",id:this.componentId},a("details",Object.assign({key:"f5428c5e340c55750fb94d85dfd7cdbb853c32de"},this.getOpenAttribute(),{ref:e=>this.detailsEl=e}),a("summary",{key:"9255f9c850016e964d468ed35578c01159b7f234",part:"accordion-button"},a("slot",{key:"2b1dba36c97ed9c46b1efe7aac44cae4203e7a50",name:"label"},"Details"),a("pds-icon",{key:"9185cfd595c09a15c57fe1e1d89a2895c461aa46",icon:n})),a("div",{key:"41d030c5ffc2cee2099f141e80695c1f4e6ddcb0",part:"accordion-body",class:"pds-accordion__body"},a("slot",{key:"b10afd83e6bec657dfa88cdf4a73f32f12d46935"}))))}static get watchers(){return{isOpen:["handleOpenState"]}}};s.style=o+d;export{s as pds_accordion};
|
|
2
|
+
//# sourceMappingURL=p-239891e6.entry.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as e,c as r,h as i,H as o,g as t}from"./p-87fe352f.js";import{m as a,P as n,a as s}from"./p-a9038f7f.js";import{b as l}from"./p-dc4a6d88.js";const c=":where(*:not(slot),*:not(slot)::before,*:not(slot)::after){-webkit-box-sizing:border-box;box-sizing:border-box}:where(*:not(slot)){margin:0}:where(img,picture,video,canvas,svg){display:block;max-width:100%}:where(input,button,textarea,select){font:inherit}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(a:not([href]):not([class])){color:currentColor;text-decoration:none}:where(a:not([href]):not([class]):hover){color:currentColor;text-decoration:none}:where(ul[role=list],ol[role=list]){list-style:none}:where(table){border-collapse:collapse;border-spacing:0}:where(*:not(slot)){font:var(--pine-typography-body-md-default);letter-spacing:var(--pine-letter-spacing-body-md)}:where(h1,h2,h3,h4,h5,h6){font-family:var(--pine-font-family-heading);color:var(--pine-color-grey-950)}:where(h1){font:var(--pine-typography-heading-h1);letter-spacing:var(--pine-letter-spacing-heading-h1)}:where(h2){font:var(--pine-typography-heading-h2);letter-spacing:var(--pine-letter-spacing-heading-h2)}:where(h3){font:var(--pine-typography-heading-h3);letter-spacing:var(--pine-letter-spacing-heading-h3)}:where(h4){font:var(--pine-typography-heading-h4);letter-spacing:var(--pine-letter-spacing-heading-h4)}:where(h5){font:var(--pine-typography-heading-h5);letter-spacing:var(--pine-letter-spacing-heading-h5)}:where(h6){font:var(--pine-typography-heading-h6);letter-spacing:var(--pine-letter-spacing-heading-h6)}:where(div,label,p,span){color:var(--pine-color-text-default)}:where(code,kbd,pre,samp){font-family:monospace}:where([role=button]){cursor:pointer}:where(:focus){outline:0}:where(:focus-visible){outline:var(--pine-border-width-thick) solid var(--pine-color-purple-500)}:where([hidden]){display:none !important}";const d=c;const p=':host{--border-radius-input:var(--pine-border-radius-200);--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--color-outline-focus);--box-shadow-focus-error:0 0 0 1px #ffffff, 0 0 0 3px var(--color-outline-focus-error);--box-shadow-input-toggle:0 2px 4px 0 rgba(0, 0, 0, 0.12), 0 0 2px 0 rgba(0, 0, 0, 0.08);--color-background-checked:var(--pine-color-purple-500);--color-background-checked-hover:var(--pine-color-purple-600);--color-background-error:var(--pine-color-red-500);--color-background-input-disabled:var(--pine-color-grey-200);--color-background-input-default:var(--pine-color-grey-300);--color-background-input-hover:var(--pine-color-grey-400);--color-input-toggle-default:var(--pine-color-white);--color-input-toggle-disabled:var(--pine-color-grey-100);--color-message-text:var(--pine-color-grey-700);--color-outline-focus:var(--pine-color-purple-300);--color-outline-focus-error:var(--pine-color-red-200);--color-text-default:var(--pine-color-grey-900);--color-text-disabled:var(--pine-color-grey-500);--color-text-error:var(--pine-color-red-500);--font-weight-label-default:var(--pine-font-weight-body-medium);--dimension-input-height:20px;--dimension-input-width:36px;--sizing-input-toggle-size:calc(var(--dimension-input-height) - (var(--spacing-input-toggle-offset) * 2));--spacing-label-gap-size:var(--pine-spacing-150);--spacing-input-toggle-offset:calc(var(--pine-spacing-050) / 2);--spacing-message-block:calc(var(--pine-spacing-150) / 2);--spacing-message-inline:calc(var(--dimension-input-width) + var(--spacing-label-gap-size));--number-transition-timing:0.15s ease-out;-ms-flex-align:start;align-items:flex-start;color:var(--color-text-default);display:-ms-inline-flexbox;display:inline-flex;-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-margin-after:var(--pine-spacing-md);margin-block-end:var(--pine-spacing-md);position:relative}:host(.pds-switch--error){color:var(--color-text-error)}:host(.pds-switch--error) input,:host(.pds-switch--error) input:checked,:host(.pds-switch--error) input:hover:not(:disabled):not(:checked){background-color:var(--color-background-error)}:host(.pds-switch--error) input:focus-visible:not(:disabled):not(:checked){-webkit-box-shadow:var(--box-shadow-focus-error);box-shadow:var(--box-shadow-focus-error)}:host(.pds-switch--error) label{color:var(--color-text-error)}input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--color-background-input-default);border:0;border-radius:var(--border-radius-input);cursor:pointer;display:inline-block;height:var(--dimension-input-height);margin:0;padding:0;position:relative;-webkit-transition:var(--number-transition-timing);transition:var(--number-transition-timing);-webkit-transition-property:background, border, color;transition-property:background, border, color;width:var(--dimension-input-width)}input::after{background:var(--color-input-toggle-default);border-radius:50%;-webkit-box-shadow:var(--box-shadow-input-toggle);box-shadow:var(--box-shadow-input-toggle);content:"";display:block;height:var(--sizing-input-toggle-size);inset-block-start:50%;inset-inline-start:50%;position:absolute;-webkit-transform:translate3d(-100%, -50%, 0);transform:translate3d(-100%, -50%, 0);-webkit-transition:-webkit-transform var(--number-transition-timing);transition:-webkit-transform var(--number-transition-timing);transition:transform var(--number-transition-timing);transition:transform var(--number-transition-timing), -webkit-transform var(--number-transition-timing);width:var(--sizing-input-toggle-size)}label{cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-positive:1;flex-grow:1;font-weight:var(--font-weight-label-default);-webkit-margin-start:var(--spacing-label-gap-size);margin-inline-start:var(--spacing-label-gap-size)}.pds-switch--error label{color:inherit}.pds-switch__message{color:var(--color-message-text);-ms-flex:1 0 100%;flex:1 0 100%;font-size:var(--pine-font-size-body-md);-webkit-margin-before:var(--spacing-message-block);margin-block-start:var(--spacing-message-block);-webkit-margin-start:var(--spacing-message-inline);margin-inline-start:var(--spacing-message-inline)}.pds-switch__message--error{-ms-flex-align:center;align-items:center;color:inherit;display:-ms-flexbox;display:flex;font-size:var(--pine-font-size-085);gap:var(--pine-spacing-050)}input:disabled{background-color:var(--color-background-input-disabled);cursor:not-allowed}input:disabled~label{color:var(--color-text-disabled);cursor:initial}input:disabled:hover::after{background-color:var(--color-input-toggle-disabled)}input:disabled .pds-switch__message{color:initial}input:hover:not(:disabled){background-color:var(--color-background-input-hover)}input:focus-visible:not(:disabled){-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}input:checked::after{-webkit-transform:translate3d(0, -50%, 0);transform:translate3d(0, -50%, 0)}input:checked:not(:disabled){background-color:currentColor;color:var(--color-background-checked)}input:checked:not(:disabled):hover{border-color:currentColor;color:var(--color-background-checked-hover)}';const h=p;const g=class{constructor(i){e(this,i);this.pdsSwitchChange=r(this,"pdsSwitchChange",7);this.onSwitchUpdate=e=>{if(this.disabled)return;const r=e.target;this.checked=r.checked;this.pdsSwitchChange.emit(e)};this.switchClassNames=()=>{let e=`pds-switch`;if(this.invalid===true){e+=" pds-switch--error"}if(this.helperMessage!==undefined){e+=" pds-switch--message"}return e};this.componentId=undefined;this.checked=false;this.disabled=false;this.errorMessage=undefined;this.helperMessage=undefined;this.invalid=false;this.label=undefined;this.name=undefined;this.required=false;this.value=undefined}render(){return i(o,{key:"752bc5c5fd8d2cac945d6029656954d3f375ec71",class:this.switchClassNames(),"aria-disabled":this.disabled?"true":null},i("input",{key:"04472c44cf63aa671326c774c9fbf6890db69ddb","aria-describedby":s(this.componentId,this.invalid,this.helperMessage),"aria-invalid":this.invalid?"true":undefined,checked:this.checked,class:"pds-switch__input",disabled:this.disabled,id:this.componentId,name:this.name?this.name:this.componentId,onChange:this.onSwitchUpdate,required:this.required,type:"checkbox",value:this.value}),i(n,{key:"8895f0bd3a5eb345a91a9379ecb30cf47637ffe4",classNames:"pds-switch__label",htmlFor:this.componentId,text:this.label}),this.helperMessage&&i("div",{key:"bf29e672c126446faeca4bce2946294e816718f4",class:`pds-switch__message`,id:a(this.componentId,"helper")},this.helperMessage),this.errorMessage&&i("div",{key:"7428daf37dd2c60e6c0416a72a4f56cbb956dd9a",class:`pds-switch__message pds-switch__message--error`,id:a(this.componentId,"error"),"aria-live":"assertive"},i("pds-icon",{key:"9efde77b0156883dd9514c9b2fc6f1234d04a645",icon:l,size:"small"}),this.errorMessage))}get el(){return t(this)}};g.style=d+h;export{g as pds_switch};
|
|
2
|
+
//# sourceMappingURL=p-34f84589.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["baseCss","PdsSwitchStyle0","pdsSwitchCss","PdsSwitchStyle1","PdsSwitch","this","onSwitchUpdate","e","disabled","input","target","checked","pdsSwitchChange","emit","switchClassNames","switchClasses","invalid","helperMessage","undefined","render","h","Host","key","class","assignDescription","componentId","id","name","onChange","required","type","value","PdsLabel","classNames","htmlFor","text","label","messageId","errorMessage","icon","danger","size"],"sources":["src/global/styles/base.scss?tag=pds-switch&encapsulation=shadow","src/components/pds-switch/pds-switch.scss?tag=pds-switch&encapsulation=shadow","src/components/pds-switch/pds-switch.tsx"],"sourcesContent":["// TODO: replace core tokens with semantic\n// Heading color + outline\n\n/*\n Josh's Custom CSS Reset\n https://www.joshwcomeau.com/css/custom-css-reset/\n*/\n:where(*:not(slot), *:not(slot)::before, *:not(slot)::after) {\n box-sizing: border-box;\n}\n\n:where(*:not(slot)) {\n margin: 0;\n}\n\n:where(img, picture, video, canvas, svg) {\n display: block;\n max-width: 100%;\n}\n\n:where(input, button, textarea, select) {\n font: inherit;\n}\n\n:where(p, h1, h2, h3, h4, h5, h6) {\n overflow-wrap: break-word;\n}\n\n/*\n Additional Reset Styles\n*/\n:where(a:not([href]):not([class])) {\n color: currentColor;\n text-decoration: none;\n}\n\n:where(a:not([href]):not([class]):hover) {\n color: currentColor;\n text-decoration: none;\n}\n\n:where(ul[role='list'], ol[role='list']) {\n list-style: none;\n}\n\n:where(table) {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\n/*\n Mercury Base Styles\n*/\n// Typography\n:where(*:not(slot)) {\n font: var(--pine-typography-body-md-default);\n letter-spacing: var(--pine-letter-spacing-body-md);\n}\n\n:where(h1, h2, h3, h4, h5, h6) {\n font-family: var(--pine-font-family-heading);\n color: var(--pine-color-grey-950);\n}\n\n:where(h1) {\n font: var(--pine-typography-heading-h1);\n letter-spacing: var(--pine-letter-spacing-heading-h1);\n}\n\n:where(h2) {\n font: var(--pine-typography-heading-h2);\n letter-spacing: var(--pine-letter-spacing-heading-h2);\n}\n\n:where(h3) {\n font: var(--pine-typography-heading-h3);\n letter-spacing: var(--pine-letter-spacing-heading-h3);\n}\n\n:where(h4) {\n font: var(--pine-typography-heading-h4);\n letter-spacing: var(--pine-letter-spacing-heading-h4);\n}\n\n:where(h5) {\n font: var(--pine-typography-heading-h5);\n letter-spacing: var(--pine-letter-spacing-heading-h5);\n}\n\n:where(h6) {\n font: var(--pine-typography-heading-h6);\n letter-spacing: var(--pine-letter-spacing-heading-h6);\n}\n\n:where(div, label, p, span) {\n color: var(--pine-color-text-default);\n}\n\n:where(code, kbd, pre, samp) {\n font-family: monospace;\n}\n\n// Accessibility\n:where([role=\"button\"]) {\n cursor: pointer;\n}\n\n:where(:focus) {\n outline: 0;\n}\n\n:where(:focus-visible) {\n outline: var(--pine-border-width-thick) solid var(--pine-color-purple-500);\n}\n\n// Misc.\n:where([hidden]) {\n display: none !important;\n}\n",":host {\n --border-radius-input: var(--pine-border-radius-200);\n\n --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--color-outline-focus);\n --box-shadow-focus-error: 0 0 0 1px #ffffff, 0 0 0 3px var(--color-outline-focus-error);\n --box-shadow-input-toggle: 0 2px 4px 0 rgba(0, 0, 0, 0.12), 0 0 2px 0 rgba(0, 0, 0, 0.08);\n\n --color-background-checked: var(--pine-color-purple-500);\n --color-background-checked-hover: var(--pine-color-purple-600);\n --color-background-error: var(--pine-color-red-500);\n --color-background-input-disabled: var(--pine-color-grey-200);\n --color-background-input-default: var(--pine-color-grey-300);\n --color-background-input-hover: var(--pine-color-grey-400);\n --color-input-toggle-default: var(--pine-color-white);\n --color-input-toggle-disabled: var(--pine-color-grey-100);\n --color-message-text: var(--pine-color-grey-700);\n --color-outline-focus: var(--pine-color-purple-300);\n --color-outline-focus-error: var(--pine-color-red-200);\n --color-text-default: var(--pine-color-grey-900);\n --color-text-disabled: var(--pine-color-grey-500);\n --color-text-error: var(--pine-color-red-500);\n\n --font-weight-label-default: var(--pine-font-weight-body-medium);\n\n --dimension-input-height: 20px;\n --dimension-input-width: 36px;\n\n --sizing-input-toggle-size: calc(var(--dimension-input-height) - (var(--spacing-input-toggle-offset) * 2));\n\n --spacing-label-gap-size: var(--pine-spacing-150);\n --spacing-input-toggle-offset: calc(var(--pine-spacing-050) / 2);\n --spacing-message-block: calc(var(--pine-spacing-150) / 2);\n --spacing-message-inline: calc(var(--dimension-input-width) + var(--spacing-label-gap-size));\n\n --number-transition-timing: 0.15s ease-out;\n\n\n align-items: flex-start;\n color: var(--color-text-default);\n display: inline-flex;\n flex-flow: row wrap;\n margin-block-end: var(--pine-spacing-md);\n position: relative;\n}\n\n:host(.pds-switch--error) {\n color: var(--color-text-error);\n\n input,\n input:checked,\n input:hover:not(:disabled):not(:checked) {\n background-color: var(--color-background-error);\n }\n\n input:focus-visible:not(:disabled):not(:checked) {\n box-shadow: var(--box-shadow-focus-error);\n }\n\n label {\n color: var(--color-text-error);\n }\n}\n\n// switch container\ninput {\n appearance: none;\n background: var(--color-background-input-default);\n border: 0;\n border-radius: var(--border-radius-input);\n cursor: pointer;\n display: inline-block;\n height: var(--dimension-input-height);\n margin: 0;\n padding: 0;\n position: relative;\n transition: var(--number-transition-timing);\n transition-property: background, border, color;\n width: var(--dimension-input-width);\n\n // switch toggle\n &::after {\n background: var(--color-input-toggle-default);\n border-radius: 50%;\n box-shadow: var(--box-shadow-input-toggle);\n content: \"\";\n display: block;\n height: var(--sizing-input-toggle-size);\n inset-block-start: 50%;\n inset-inline-start: 50%;\n position: absolute;\n transform: translate3d(-100%, -50%, 0);\n transition: transform var(--number-transition-timing);\n width: var(--sizing-input-toggle-size);\n }\n}\n\nlabel {\n cursor: pointer;\n display: inline-flex;\n flex-grow: 1;\n font-weight: var(--font-weight-label-default);\n margin-inline-start: var(--spacing-label-gap-size);\n\n .pds-switch--error & {\n color: inherit;\n }\n}\n\n// Help and error messages\n.pds-switch__message {\n color: var(--color-message-text);\n flex: 1 0 100%;\n font-size: var(--pine-font-size-body-md);\n margin-block-start: var(--spacing-message-block);\n margin-inline-start: var(--spacing-message-inline);\n}\n\n.pds-switch__message--error {\n align-items: center;\n color: inherit;\n display: flex;\n font-size: var(--pine-font-size-085);\n gap: var(--pine-spacing-050);\n}\n\n// Disabled state\ninput:disabled {\n background-color: var(--color-background-input-disabled);\n cursor: not-allowed;\n\n ~ label {\n color: var(--color-text-disabled);\n cursor: initial;\n }\n\n &:hover::after {\n background-color: var(--color-input-toggle-disabled);\n }\n\n .pds-switch__message {\n color: initial;\n }\n}\n\n// Hover state\ninput:hover:not(:disabled) {\n background-color: var(--color-background-input-hover);\n}\n\n // Focus state\ninput:focus-visible:not(:disabled) {\n box-shadow: var(--box-shadow-focus);\n outline: none;\n}\n\n// 'Checked' state\n// switch toggle\ninput:checked::after {\n transform: translate3d(0, -50%, 0);\n}\n\n// switch container\ninput:checked:not(:disabled) {\n background-color: currentColor;\n color: var(--color-background-checked);\n\n &:hover {\n border-color: currentColor;\n color: var(--color-background-checked-hover);\n }\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { PdsLabel } from '../_internal/pds-label/pds-label';\nimport { danger } from '@pine-ds/icons/icons';\n\n@Component({\n tag: 'pds-switch',\n styleUrls: ['../../global/styles/base.scss', 'pds-switch.scss'],\n shadow: true,\n})\nexport class PdsSwitch {\n @Element() el: HTMLPdsSwitchElement;\n\n /**\n * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * Determines the input 'checked' state.\n */\n @Prop({ mutable: true }) checked = false;\n\n /**\n * Determines the input 'disabled' state, preventing user interaction.\n */\n @Prop() disabled? = false;\n\n /**\n * Displays message text describing an invalid state.\n */\n @Prop() errorMessage?: string;\n\n /**\n * Displays help text for additional description of an input.\n */\n @Prop() helperMessage: string;\n\n /**\n * Determines the input 'invalid' state, signifying an error is present.\n */\n @Prop() invalid? = false;\n\n /**\n * Displays text to describe the input.\n */\n @Prop() label!: string;\n\n /**\n * Identifies form data and unifies a group of radio inputs for toggling a single property/value.\n */\n @Prop() name: string;\n\n /**\n * Determines the 'required' state of the input.\n */\n @Prop() required? = false;\n\n /**\n * Provides input with a string submitted in form data.\n */\n @Prop() value: string;\n\n /**\n * Emits an event on input change.\n */\n @Event() pdsSwitchChange: EventEmitter<InputEvent>;\n\n private onSwitchUpdate = (e: Event) => {\n if (this.disabled) return;\n\n const input = e.target as HTMLInputElement;\n this.checked = input.checked;\n this.pdsSwitchChange.emit(e as InputEvent);\n };\n\n private switchClassNames = () => {\n let switchClasses = `pds-switch`;\n\n if (this.invalid === true) {\n switchClasses += \" pds-switch--error\";\n }\n if (this.helperMessage !== undefined) {\n switchClasses += \" pds-switch--message\";\n }\n return switchClasses;\n };\n\n render() {\n return (\n <Host class={this.switchClassNames()} aria-disabled={this.disabled ? 'true' : null}>\n <input\n aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n checked={this.checked}\n class=\"pds-switch__input\"\n disabled={this.disabled}\n id={this.componentId}\n name={this.name ? this.name : this.componentId}\n onChange={this.onSwitchUpdate}\n required={this.required}\n type=\"checkbox\"\n value={this.value}\n />\n <PdsLabel classNames=\"pds-switch__label\" htmlFor={this.componentId} text={this.label} />\n {this.helperMessage &&\n <div\n class={`pds-switch__message`}\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </div>\n }\n {this.errorMessage &&\n <div\n class={`pds-switch__message pds-switch__message--error`}\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </div>\n }\n </Host>\n );\n }\n}\n"],"mappings":"sJAAA,MAAMA,EAAU,yrDAChB,MAAAC,EAAeD,ECDf,MAAME,EAAe,wgKACrB,MAAAC,EAAeD,E,MCSFE,EAAS,M,0EA0DZC,KAAAC,eAAkBC,IACxB,GAAIF,KAAKG,SAAU,OAEnB,MAAMC,EAAQF,EAAEG,OAChBL,KAAKM,QAAUF,EAAME,QACrBN,KAAKO,gBAAgBC,KAAKN,EAAgB,EAGpCF,KAAAS,iBAAmB,KACzB,IAAIC,EAAgB,aAEpB,GAAIV,KAAKW,UAAY,KAAM,CACzBD,GAAiB,oB,CAEnB,GAAIV,KAAKY,gBAAkBC,UAAW,CACpCH,GAAiB,sB,CAEnB,OAAOA,CAAa,E,wCAhEa,M,cAKf,M,sEAeD,M,uDAeC,M,qBAgCpB,MAAAI,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAOlB,KAAKS,mBAAkB,gBAAiBT,KAAKG,SAAW,OAAS,MAC5EY,EAAA,SAAAE,IAAA,8DACoBE,EAAkBnB,KAAKoB,YAAapB,KAAKW,QAASX,KAAKY,eAAc,eACzEZ,KAAKW,QAAU,OAASE,UACtCP,QAASN,KAAKM,QACdY,MAAM,oBACNf,SAAUH,KAAKG,SACfkB,GAAIrB,KAAKoB,YACTE,KAAMtB,KAAKsB,KAAOtB,KAAKsB,KAAOtB,KAAKoB,YACnCG,SAAUvB,KAAKC,eACfuB,SAAUxB,KAAKwB,SACfC,KAAK,WACLC,MAAO1B,KAAK0B,QAEdX,EAACY,EAAQ,CAAAV,IAAA,2CAACW,WAAW,oBAAoBC,QAAS7B,KAAKoB,YAAaU,KAAM9B,KAAK+B,QAC9E/B,KAAKY,eACJG,EAAA,OAAAE,IAAA,2CACEC,MAAO,sBACPG,GAAIW,EAAUhC,KAAKoB,YAAa,WAE/BpB,KAAKY,eAGTZ,KAAKiC,cACJlB,EAAA,OAAAE,IAAA,2CACEC,MAAO,iDACPG,GAAIW,EAAUhC,KAAKoB,YAAa,SAAQ,YAC9B,aAEVL,EAAA,YAAAE,IAAA,2CAAUiB,KAAMC,EAAQC,KAAK,UAC5BpC,KAAKiC,c","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as a,c as t,h as e,H as o,g as i}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as a,c as t,h as e,H as o,g as i}from"./p-87fe352f.js";const r='pds-tab{--border-none:var(--pine-border-width-none);--border-radius-availability:var(--pine-border-radius-100);--border-radius-default:var(--pine-border-radius-125);--border-radius-none:var(--pine-border-radius-0);--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-purple-300);--color-background-active:var(--pine-color-grey-900);--color-background-availability:var(--pine-color-white);--color-background-default:var(--pine-color-grey-300);--color-background-hover:var(--pine-color-grey-100);--color-indicator-active:var(--pine-color-mercury-500);--color-text-active:var(--pine-color-grey-900);--color-text-active-inverse:var(--pine-color-white);--color-text-default:var(--pine-color-grey-700);--color-text-focus:var(--pine-color-grey-800);--letter-spacing-default:var(--pine-letter-spacing-body-md);--outline:4px solid var(--pine-color-blue-200);--spacing-padding-none:var(--pine-spacing-0);--typography-default:var(--pine-typography-body-md-medium);display:inline-block;position:relative}.pds-tab{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:var(--border-none);-webkit-box-shadow:none;box-shadow:none;color:inherit;cursor:pointer;font-family:inherit;padding:var(--spacing-padding-none);-ms-flex-align:center;align-items:center;color:var(--color-text-default);display:-ms-inline-flexbox;display:inline-flex;position:relative;text-decoration:none;white-space:nowrap}.pds-tab.is-active,.pds-tab[aria-selected=true]{color:var(--color-text-active)}.pds-tab.is-active .pds-tab__content::after,.pds-tab[aria-selected=true] .pds-tab__content::after{opacity:1}.pds-tab:hover{color:var(--color-text-active)}.pds-tab:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-tab .pds-tab__content{font:var(--typography-default);letter-spacing:var(--letter-spacing-default);-webkit-padding-after:11px;padding-block-end:11px;position:relative}.pds-tab .pds-tab__content::after{background-color:var(--color-indicator-active);bottom:0;content:"";height:3px;left:0;opacity:0;position:absolute;right:0}.pds-tab .pds-tab-edge{display:none}.pds-tabs--availability{--color-background-tab:transparent}.pds-tabs--availability .pds-tab{background-color:var(--color-background-tab);border-radius:var(--border-radius-availability) var(--border-radius-availability) var(--border-radius-none) var(--border-radius-none);padding:8px 16px 13px}.pds-tabs--availability .pds-tab.is-active,.pds-tabs--availability .pds-tab[aria-selected=true]{--color-background-tab:var(--color-background-availability)}.pds-tabs--availability .pds-tab.is-active .pds-tab__content::after,.pds-tabs--availability .pds-tab[aria-selected=true] .pds-tab__content::after{opacity:1}.pds-tabs--availability .pds-tab.is-active .pds-tab-edge,.pds-tabs--availability .pds-tab[aria-selected=true] .pds-tab-edge{z-index:1}.pds-tabs--availability .pds-tab:hover:not(.is-active,[aria-selected=true]){--color-background-tab:var(--color-background-default)}.pds-tabs--availability .pds-tab:focus-visible{color:var(--color-text-default)}.pds-tabs--availability .pds-tab__content{padding-bottom:7px}.pds-tabs--availability .pds-tab-edge{bottom:0;display:block;height:8px;inset-inline-end:100%;overflow:hidden;position:absolute;width:8px}.pds-tabs--availability .pds-tab-edge::before{border-radius:50%;bottom:0;-webkit-box-shadow:4px 4px 0 0 var(--color-background-tab);box-shadow:4px 4px 0 0 var(--color-background-tab);content:"";display:block;height:200%;inset-inline-end:0;position:absolute;width:200%}.pds-tabs--availability .pds-tab-edge--end{inset-inline-end:unset;inset-inline-start:100%}.pds-tabs--availability .pds-tab-edge--end::before{-webkit-box-shadow:-4px 4px 0 0 var(--color-background-tab);box-shadow:-4px 4px 0 0 var(--color-background-tab);inset-inline-end:unset;inset-inline-start:0}.pds-tabs--filter{--color-background-tab:var(--color-background-active)}.pds-tabs--filter .pds-tab{background-color:var(--color-background-tab);border-radius:50px;color:var(--color-text-active);padding:6px 15px}.pds-tabs--filter .pds-tab.is-active,.pds-tabs--filter .pds-tab[aria-selected=true]{--color-background-tab:var(--color-background-active);color:var(--color-text-active-inverse)}.pds-tabs--filter .pds-tab:hover:not(.is-active,[aria-selected=true]){--color-background-tab:var(--color-background-hover)}.pds-tabs--filter .pds-tab__content{-webkit-padding-after:0;padding-block-end:0}.pds-tabs--filter .pds-tab__content::after{content:unset}';const d=r;const s=class{constructor(e){a(this,e);this.pdsTabClick=t(this,"pdsTabClick",7);this.name=undefined;this.parentComponentId=undefined;this.variant=undefined;this.index=undefined;this.selected=false}onTabClick(a,t){this.pdsTabClick.emit([a,t])}render(){const a=e("span",{key:"d98a922aaa1b9a6023830badc391c3d1d615ec6a",class:"pds-tab-edge",role:"presentation"});const t=e("span",{key:"390da28bb3fd9ab1fa2fddda45569e92d4547fa3",class:"pds-tab-edge pds-tab-edge--end",role:"presentation"});return e(o,{key:"5996673486d4bd95f98a691b155529a60655e92f",variant:this.variant,slot:"tabs",index:this.index},e("button",{key:"6eded79f9d5aa9093080933aa9aaa2ad88440759",role:"tab",id:this.parentComponentId+"__"+this.name,"aria-controls":this.parentComponentId+"__"+this.name+"-panel",tabindex:this.selected?"0":"-1","aria-selected":this.selected?"true":"false",class:this.selected?"pds-tab is-active":"pds-tab",onClick:this.onTabClick.bind(this,this.index,this.parentComponentId)},this.variant==="availability"&&a,this.variant==="availability"&&t,e("div",{key:"9f8927d976b6964c22414e9fbb8680b9132370fa",class:"pds-tab__content"},e("slot",{key:"691c6cf5e42bc42c6492276fd5905733c424921c"}))))}get el(){return i(this)}};s.style=d;export{s as pds_tab};
|
|
2
|
+
//# sourceMappingURL=p-3acb18ad.entry.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r,h as e,H as a}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r,h as e,H as a}from"./p-87fe352f.js";import{c as o,u as i}from"./p-dc4a6d88.js";const t=":where(*:not(slot),*:not(slot)::before,*:not(slot)::after){-webkit-box-sizing:border-box;box-sizing:border-box}:where(*:not(slot)){margin:0}:where(img,picture,video,canvas,svg){display:block;max-width:100%}:where(input,button,textarea,select){font:inherit}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(a:not([href]):not([class])){color:currentColor;text-decoration:none}:where(a:not([href]):not([class]):hover){color:currentColor;text-decoration:none}:where(ul[role=list],ol[role=list]){list-style:none}:where(table){border-collapse:collapse;border-spacing:0}:where(*:not(slot)){font:var(--pine-typography-body-md-default);letter-spacing:var(--pine-letter-spacing-body-md)}:where(h1,h2,h3,h4,h5,h6){font-family:var(--pine-font-family-heading);color:var(--pine-color-grey-950)}:where(h1){font:var(--pine-typography-heading-h1);letter-spacing:var(--pine-letter-spacing-heading-h1)}:where(h2){font:var(--pine-typography-heading-h2);letter-spacing:var(--pine-letter-spacing-heading-h2)}:where(h3){font:var(--pine-typography-heading-h3);letter-spacing:var(--pine-letter-spacing-heading-h3)}:where(h4){font:var(--pine-typography-heading-h4);letter-spacing:var(--pine-letter-spacing-heading-h4)}:where(h5){font:var(--pine-typography-heading-h5);letter-spacing:var(--pine-letter-spacing-heading-h5)}:where(h6){font:var(--pine-typography-heading-h6);letter-spacing:var(--pine-letter-spacing-heading-h6)}:where(div,label,p,span){color:var(--pine-color-text-default)}:where(code,kbd,pre,samp){font-family:monospace}:where([role=button]){cursor:pointer}:where(:focus){outline:0}:where(:focus-visible){outline:var(--pine-border-width-thick) solid var(--pine-color-purple-500)}:where([hidden]){display:none !important}";const n=t;const s=":host{display:inline-block}div{--color-background-container:var(--pine-color-mercury-050);--color-background-badge:var(--pine-color-white);--color-border-badge:var(--pine-color-white);--border-default:var(--pine-border-width-thin) solid var(--pine-color-grey-300);--border-radius-round:var(--pine-border-radius-round);--border-radius-none:var(--pine-border-radius-0);--spacing-none:var(--pine-spacing-0);-ms-flex-align:center;align-items:center;background-color:var(--color-background-container);border-radius:var(--border-radius-admin-round, var(--border-radius-round));display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;position:relative}:host(.pds-avatar--admin) div{--border-radius-admin-round:var(--pine-spacing-150);border-radius:var(--border-radius-admin-round)}:host(.pds-avatar--has-image) div{background:transparent}@supports selector(:has){div:has(img){background-color:transparent}}.pds-avatar__button{--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-purple-300);--border-radius-round:var(--pine-border-radius-round);-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:var(--border-radius-none);border-radius:var(--border-radius-round);cursor:pointer;display:-ms-flexbox;display:flex;padding:var(--spacing-none)}.pds-avatar__button:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-avatar__badge{background-color:var(--color-background-badge);border:var(--border-default);border-color:var(--color-border-badge);border-radius:var(--border-radius-round);bottom:var(--spacing-none);position:absolute;right:var(--spacing-none)}img{border-radius:var(--border-radius-admin-round, var(--border-radius-round));height:100%;-o-object-fit:cover;object-fit:cover;width:100%}";const d=s;const p=class{constructor(a){r(this,a);this.renderAssetWrapper=()=>{const r={height:this.avatarSize(),width:this.avatarSize()};return e("div",{style:r,part:"asset-wrapper"},this.renderIconOrImage(),this.renderBadge())};this.renderAvatar=()=>this.dropdown?e("button",{class:"pds-avatar__button",type:"button","aria-label":"Avatar dropdown trigger"},this.renderAssetWrapper()):this.renderAssetWrapper();this.renderBadge=()=>this.badge&&e("pds-icon",{color:"var(--pine-color-purple-600)",class:"pds-avatar__badge",icon:o,size:"33.53%"});this.renderIconOrImage=()=>this.image?e("img",{alt:this.alt,src:this.image}):e("pds-icon",{color:"var(--pine-color-mercury-500)",icon:i,size:"33.53%"});this.classNames=()=>({"pds-avatar":true,[`pds-avatar--has-image`]:this.image!==""&&this.image!==null,[`pds-avatar--${this.variant}`]:this.variant==="admin"});this.alt=null;this.badge=false;this.componentId=undefined;this.dropdown=false;this.image=null;this.size="lg";this.variant="customer"}avatarSize(){const r={xs:"24px",sm:"32px",md:"40px",lg:"56px",xl:"64px"};if(r[this.size]){return r[this.size]}else{return this.size}}render(){return e(a,{key:"0b753aa7cb61c88a3808684a67eb1ee84898822c",id:this.componentId,class:Object.assign({},this.classNames())},this.renderAvatar())}};p.style=n+d;export{p as pds_avatar};
|
|
2
|
+
//# sourceMappingURL=p-3e4225fc.entry.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as o,c as r,h as a,H as n}from"./p-7841bd18.js";import{d as e,r as c}from"./p-2665d555.js";const i=":where(*:not(slot),*:not(slot)::before,*:not(slot)::after){-webkit-box-sizing:border-box;box-sizing:border-box}:where(*:not(slot)){margin:0}:where(img,picture,video,canvas,svg){display:block;max-width:100%}:where(input,button,textarea,select){font:inherit}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(a:not([href]):not([class])){color:currentColor;text-decoration:none}:where(a:not([href]):not([class]):hover){color:currentColor;text-decoration:none}:where(ul[role=list],ol[role=list]){list-style:none}:where(table){border-collapse:collapse;border-spacing:0}:where(*:not(slot)){font:var(--pine-typography-body-md-default);letter-spacing:var(--pine-letter-spacing-body-md)}:where(h1,h2,h3,h4,h5,h6){font-family:var(--pine-font-family-heading);color:var(--pine-color-grey-950)}:where(h1){font:var(--pine-typography-heading-h1);letter-spacing:var(--pine-letter-spacing-heading-h1)}:where(h2){font:var(--pine-typography-heading-h2);letter-spacing:var(--pine-letter-spacing-heading-h2)}:where(h3){font:var(--pine-typography-heading-h3);letter-spacing:var(--pine-letter-spacing-heading-h3)}:where(h4){font:var(--pine-typography-heading-h4);letter-spacing:var(--pine-letter-spacing-heading-h4)}:where(h5){font:var(--pine-typography-heading-h5);letter-spacing:var(--pine-letter-spacing-heading-h5)}:where(h6){font:var(--pine-typography-heading-h6);letter-spacing:var(--pine-letter-spacing-heading-h6)}:where(div,label,p,span){color:var(--pine-color-text-default)}:where(code,kbd,pre,samp){font-family:monospace}:where([role=button]){cursor:pointer}:where(:focus){outline:0}:where(:focus-visible){outline:var(--pine-border-width-thick) solid var(--pine-color-purple-500)}:where([hidden]){display:none !important}";const s=i;const p=":host{--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-purple-300);--border-radius:var(--pine-border-radius-200);--color-background-accent:var(--pine-color-purple-100);--color-background-accent-dot:var(--pine-color-purple-600);--color-background-accent-hover:var(--pine-color-purple-200);--color-background-danger:var(--pine-color-red-100);--color-background-danger-dot:var(--pine-color-red-600);--color-background-danger-hover:var(--pine-color-red-200);--color-background-info:var(--pine-color-blue-100);--color-background-info-dot:var(--pine-color-blue-600);--color-background-info-hover:var(--pine-color-blue-200);--color-background-neutral:var(--pine-color-grey-100);--color-background-neutral-dot:var(--pine-color-grey-600);--color-background-neutral-hover:var(--pine-color-grey-400);--color-background-success:var(--pine-color-green-100);--color-background-success-dot:var(--pine-color-green-600);--color-background-success-hover:var(--pine-color-green-200);--color-background-warning:var(--pine-color-yellow-100);--color-background-warning-dot:var(--pine-color-yellow-600);--color-background-warning-hover:var(--pine-color-yellow-200);--color-text-accent:var(--pine-color-purple-950);--color-text-danger:var(--pine-color-red-950);--color-text-info:var(--pine-color-blue-950);--color-text-neutral:var(--pine-color-grey-950);--color-text-success:var(--pine-color-green-950);--color-text-warning:var(--pine-color-yellow-950);--font-size-sm:var(--pine-font-size-body-md);--font-size-lg:var(--pine-font-size-heading-h6);--font-weight:var(--pine-font-weight-medium);--spacing-xxs:calc(var(--pine-spacing-050) / 2);--spacing-xs:var(--pine-spacing-050);--spacing-sm:calc(var(--pine-spacing-150) / 2);--spacing-md:var(--pine-spacing-100);--spacing-lg:calc(var(--pine-spacing-250) / 2);--spacing-xl:var(--pine-spacing-150);--spacing-xxl:calc(var(--pine-spacing-350) / 2);--sizing-close:10px;--sizing-close-lg:24px;--sizing-dot:4px;-ms-flex-align:center;align-items:center;border-radius:var(--border-radius);display:-ms-inline-flexbox;display:inline-flex;padding-block:var(--spacing-xs);padding-inline:var(--spacing-lg)}:host(.pds-chip--accent){background:var(--color-background-accent)}:host(.pds-chip--accent) .pds-chip__dot{background:var(--color-background-accent-dot)}:host(.pds-chip--accent) .pds-chip__label,:host(.pds-chip--accent) .pds-chip__button{color:var(--color-text-accent)}:host(.pds-chip--accent) .pds-chip__close:hover{background:var(--color-background-accent-hover)}:host(.pds-chip--accent.pds-chip--dropdown:hover){background:var(--color-background-accent-hover)}:host(.pds-chip--danger){background:var(--color-background-danger)}:host(.pds-chip--danger) .pds-chip__dot{background:var(--color-background-danger-dot)}:host(.pds-chip--danger) .pds-chip__label,:host(.pds-chip--danger) .pds-chip__button{color:var(--color-text-danger)}:host(.pds-chip--danger) .pds-chip__close:hover{background:var(--color-background-danger-hover)}:host(.pds-chip--danger.pds-chip--dropdown:hover){background:var(--color-background-danger-hover)}:host(.pds-chip--info){background:var(--color-background-info)}:host(.pds-chip--info) .pds-chip__dot{background:var(--color-background-info-dot)}:host(.pds-chip--info) .pds-chip__label,:host(.pds-chip--info) .pds-chip__button{color:var(--color-text-info)}:host(.pds-chip--info) .pds-chip__close:hover{background:var(--color-background-info-hover)}:host(.pds-chip--info.pds-chip--dropdown:hover){background:var(--color-background-info-hover)}:host(.pds-chip--neutral){background:var(--color-background-neutral)}:host(.pds-chip--neutral) .pds-chip__dot{background:var(--color-background-neutral-dot)}:host(.pds-chip--neutral) .pds-chip__label,:host(.pds-chip--neutral) .pds-chip__button{color:var(--color-text-neutral)}:host(.pds-chip--neutral) .pds-chip__close:hover{background:var(--color-background-neutral-hover)}:host(.pds-chip--neutral.pds-chip--dropdown:hover){background:var(--color-background-neutral-hover)}:host(.pds-chip--success){background:var(--color-background-success)}:host(.pds-chip--success) .pds-chip__dot{background:var(--color-background-success-dot)}:host(.pds-chip--success) .pds-chip__label,:host(.pds-chip--success) .pds-chip__button{color:var(--color-text-success)}:host(.pds-chip--success) .pds-chip__close:hover{background:var(--color-background-success-hover)}:host(.pds-chip--success.pds-chip--dropdown:hover){background:var(--color-background-success-hover)}:host(.pds-chip--warning){background:var(--color-background-warning)}:host(.pds-chip--warning) .pds-chip__dot{background:var(--color-background-warning-dot)}:host(.pds-chip--warning) .pds-chip__label,:host(.pds-chip--warning) .pds-chip__button{color:var(--color-text-warning)}:host(.pds-chip--warning) .pds-chip__close:hover{background:var(--color-background-warning-hover)}:host(.pds-chip--warning.pds-chip--dropdown:hover){background:var(--color-background-warning-hover)}.pds-chip__dot{border:1px solid transparent;border-radius:50%;display:inline-block;height:var(--sizing-dot);-webkit-margin-after:var(--spacing-xxs);margin-block-end:var(--spacing-xxs);-webkit-margin-end:var(--spacing-xs);margin-inline-end:var(--spacing-xs);width:var(--sizing-dot)}.pds-chip__label{font-size:var(--font-size-sm);font-weight:var(--font-weight)}:host(.pds-chip--dropdown){padding:0}:host(.pds-chip--dropdown) .pds-chip__dot{-webkit-margin-after:calc(var(--spacing-xxs) / 4);margin-block-end:calc(var(--spacing-xxs) / 4);-webkit-margin-before:var(--spacing-xxs);margin-block-start:var(--spacing-xxs)}.pds-chip__button{-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;border-radius:var(--border-radius);display:-ms-flexbox;display:flex;font-weight:var(--font-weight);padding-block:var(--spacing-xs);padding-inline:var(--spacing-lg)}.pds-chip__button:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-chip__button pds-icon{-webkit-margin-end:calc(var(--spacing-xxs) * -1);margin-inline-end:calc(var(--spacing-xxs) * -1);-webkit-margin-start:var(--spacing-xs);margin-inline-start:var(--spacing-xs)}:host(.pds-chip--tag){padding-block:var(--spacing-xxs)}.pds-chip__close{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;border-radius:50%;height:var(--sizing-close);-webkit-margin-end:calc(var(--spacing-md) * -1);margin-inline-end:calc(var(--spacing-md) * -1);-webkit-margin-start:var(--spacing-xs);margin-inline-start:var(--spacing-xs);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{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}:host(.pds-chip--large){font-size:var(--font-size-lg);padding-block:var(--spacing-sm);padding-inline:var(--spacing-xxl)}:host(.pds-chip--large):host(.pds-chip--dropdown){padding-block:var(--spacing-xs);padding-inline:var(--spacing-xxs)}:host(.pds-chip--large):host(.pds-chip--dropdown) .pds-chip__dot{-webkit-margin-after:0;margin-block-end:0}:host(.pds-chip--large) .pds-chip__button{font-size:var(--font-size-lg);padding-inline:var(--spacing-xl)}:host(.pds-chip--large) .pds-chip__close{height:var(--sizing-close-lg);-webkit-margin-end:calc(var(--spacing-xl) * -1);margin-inline-end:calc(var(--spacing-xl) * -1);width:var(--sizing-close-lg)}:host(.pds-chip--large):host(.pds-chip--tag){padding-block:var(--spacing-xs)}";const t=p;const d=class{constructor(a){o(this,a);this.pdsTagCloseClick=r(this,"pdsTagCloseClick",7);this.handleCloseClick=()=>{this.pdsTagCloseClick.emit()};this.componentId=undefined;this.sentiment="neutral";this.dot=false;this.label=undefined;this.large=false;this.variant="text"}classNames(){const o=["pds-chip"];if(this.large){o.push("pds-chip--large")}if(this.variant){o.push("pds-chip--"+this.variant)}if(this.sentiment){o.push("pds-chip--"+this.sentiment)}return o.join(" ")}setChipContent(){const o=this.variant==="dropdown";const r=o?a("button",{class:"pds-chip__button",type:"button"},this.dot&&a("i",{class:"pds-chip__dot","aria-hidden":"true"}),this.label,a("pds-icon",{icon:e,size:"12px","aria-hidden":"true"})):a("span",{class:"pds-chip__label"},this.dot&&a("i",{class:"pds-chip__dot","aria-hidden":"true"}),this.label);return r}render(){return a(n,{key:"b49508fac6a1006cb9a52010644307e4528b1920",class:this.classNames(),id:this.componentId},this.setChipContent(),this.variant==="tag"&&a("button",{key:"7156f121be5ac59ce77aba3b2e7bf3aa8c4d9d37",class:"pds-chip__close",type:"button",onClick:this.handleCloseClick,"aria-label":"Remove"},a("pds-icon",{key:"47663af897eab3f9e0288b0f92cb57ea42cdb77a",icon:c,size:"12px"})))}};d.style=s+t;export{d as pds_chip};
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as o,c as r,h as n,H as a}from"./p-87fe352f.js";import{d as e,r as c}from"./p-dc4a6d88.js";const i=":where(*:not(slot),*:not(slot)::before,*:not(slot)::after){-webkit-box-sizing:border-box;box-sizing:border-box}:where(*:not(slot)){margin:0}:where(img,picture,video,canvas,svg){display:block;max-width:100%}:where(input,button,textarea,select){font:inherit}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(a:not([href]):not([class])){color:currentColor;text-decoration:none}:where(a:not([href]):not([class]):hover){color:currentColor;text-decoration:none}:where(ul[role=list],ol[role=list]){list-style:none}:where(table){border-collapse:collapse;border-spacing:0}:where(*:not(slot)){font:var(--pine-typography-body-md-default);letter-spacing:var(--pine-letter-spacing-body-md)}:where(h1,h2,h3,h4,h5,h6){font-family:var(--pine-font-family-heading);color:var(--pine-color-grey-950)}:where(h1){font:var(--pine-typography-heading-h1);letter-spacing:var(--pine-letter-spacing-heading-h1)}:where(h2){font:var(--pine-typography-heading-h2);letter-spacing:var(--pine-letter-spacing-heading-h2)}:where(h3){font:var(--pine-typography-heading-h3);letter-spacing:var(--pine-letter-spacing-heading-h3)}:where(h4){font:var(--pine-typography-heading-h4);letter-spacing:var(--pine-letter-spacing-heading-h4)}:where(h5){font:var(--pine-typography-heading-h5);letter-spacing:var(--pine-letter-spacing-heading-h5)}:where(h6){font:var(--pine-typography-heading-h6);letter-spacing:var(--pine-letter-spacing-heading-h6)}:where(div,label,p,span){color:var(--pine-color-text-default)}:where(code,kbd,pre,samp){font-family:monospace}:where([role=button]){cursor:pointer}:where(:focus){outline:0}:where(:focus-visible){outline:var(--pine-border-width-thick) solid var(--pine-color-purple-500)}:where([hidden]){display:none !important}";const s=i;const p=":host{--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-purple-300);--border-radius:var(--pine-border-radius-200);--color-background-accent:var(--pine-color-purple-100);--color-background-accent-dot:var(--pine-color-purple-600);--color-background-accent-hover:var(--pine-color-purple-200);--color-background-danger:var(--pine-color-red-100);--color-background-danger-dot:var(--pine-color-red-600);--color-background-danger-hover:var(--pine-color-red-200);--color-background-info:var(--pine-color-blue-100);--color-background-info-dot:var(--pine-color-blue-600);--color-background-info-hover:var(--pine-color-blue-200);--color-background-neutral:var(--pine-color-grey-100);--color-background-neutral-dot:var(--pine-color-grey-600);--color-background-neutral-hover:var(--pine-color-grey-400);--color-background-success:var(--pine-color-green-100);--color-background-success-dot:var(--pine-color-green-600);--color-background-success-hover:var(--pine-color-green-200);--color-background-warning:var(--pine-color-yellow-100);--color-background-warning-dot:var(--pine-color-yellow-600);--color-background-warning-hover:var(--pine-color-yellow-200);--color-text-accent:var(--pine-color-purple-950);--color-text-danger:var(--pine-color-red-950);--color-text-info:var(--pine-color-blue-950);--color-text-neutral:var(--pine-color-grey-950);--color-text-success:var(--pine-color-green-950);--color-text-warning:var(--pine-color-yellow-950);--font-size-sm:var(--pine-font-size-body-md);--font-size-lg:var(--pine-font-size-heading-h6);--font-weight:var(--pine-font-weight-medium);--spacing-xxs:calc(var(--pine-spacing-050) / 2);--spacing-xs:var(--pine-spacing-050);--spacing-sm:calc(var(--pine-spacing-150) / 2);--spacing-md:var(--pine-spacing-100);--spacing-lg:calc(var(--pine-spacing-250) / 2);--spacing-xl:var(--pine-spacing-150);--spacing-xxl:calc(var(--pine-spacing-350) / 2);--sizing-close:10px;--sizing-close-lg:24px;--sizing-dot:4px;-ms-flex-align:center;align-items:center;border-radius:var(--border-radius);display:-ms-inline-flexbox;display:inline-flex;padding-block:var(--spacing-xs);padding-inline:var(--spacing-lg)}:host(.pds-chip--accent){background:var(--color-background-accent)}:host(.pds-chip--accent) .pds-chip__dot{background:var(--color-background-accent-dot)}:host(.pds-chip--accent) .pds-chip__label,:host(.pds-chip--accent) .pds-chip__button{color:var(--color-text-accent)}:host(.pds-chip--accent) .pds-chip__close:hover{background:var(--color-background-accent-hover)}:host(.pds-chip--accent.pds-chip--dropdown:hover){background:var(--color-background-accent-hover)}:host(.pds-chip--danger){background:var(--color-background-danger)}:host(.pds-chip--danger) .pds-chip__dot{background:var(--color-background-danger-dot)}:host(.pds-chip--danger) .pds-chip__label,:host(.pds-chip--danger) .pds-chip__button{color:var(--color-text-danger)}:host(.pds-chip--danger) .pds-chip__close:hover{background:var(--color-background-danger-hover)}:host(.pds-chip--danger.pds-chip--dropdown:hover){background:var(--color-background-danger-hover)}:host(.pds-chip--info){background:var(--color-background-info)}:host(.pds-chip--info) .pds-chip__dot{background:var(--color-background-info-dot)}:host(.pds-chip--info) .pds-chip__label,:host(.pds-chip--info) .pds-chip__button{color:var(--color-text-info)}:host(.pds-chip--info) .pds-chip__close:hover{background:var(--color-background-info-hover)}:host(.pds-chip--info.pds-chip--dropdown:hover){background:var(--color-background-info-hover)}:host(.pds-chip--neutral){background:var(--color-background-neutral)}:host(.pds-chip--neutral) .pds-chip__dot{background:var(--color-background-neutral-dot)}:host(.pds-chip--neutral) .pds-chip__label,:host(.pds-chip--neutral) .pds-chip__button{color:var(--color-text-neutral)}:host(.pds-chip--neutral) .pds-chip__close:hover{background:var(--color-background-neutral-hover)}:host(.pds-chip--neutral.pds-chip--dropdown:hover){background:var(--color-background-neutral-hover)}:host(.pds-chip--success){background:var(--color-background-success)}:host(.pds-chip--success) .pds-chip__dot{background:var(--color-background-success-dot)}:host(.pds-chip--success) .pds-chip__label,:host(.pds-chip--success) .pds-chip__button{color:var(--color-text-success)}:host(.pds-chip--success) .pds-chip__close:hover{background:var(--color-background-success-hover)}:host(.pds-chip--success.pds-chip--dropdown:hover){background:var(--color-background-success-hover)}:host(.pds-chip--warning){background:var(--color-background-warning)}:host(.pds-chip--warning) .pds-chip__dot{background:var(--color-background-warning-dot)}:host(.pds-chip--warning) .pds-chip__label,:host(.pds-chip--warning) .pds-chip__button{color:var(--color-text-warning)}:host(.pds-chip--warning) .pds-chip__close:hover{background:var(--color-background-warning-hover)}:host(.pds-chip--warning.pds-chip--dropdown:hover){background:var(--color-background-warning-hover)}.pds-chip__dot{border:1px solid transparent;border-radius:50%;display:inline-block;height:var(--sizing-dot);-webkit-margin-after:var(--spacing-xxs);margin-block-end:var(--spacing-xxs);-webkit-margin-end:var(--spacing-xs);margin-inline-end:var(--spacing-xs);width:var(--sizing-dot)}.pds-chip__label{font-size:var(--font-size-sm);font-weight:var(--font-weight)}:host(.pds-chip--dropdown){padding:0}:host(.pds-chip--dropdown) .pds-chip__dot{-webkit-margin-after:calc(var(--spacing-xxs) / 4);margin-block-end:calc(var(--spacing-xxs) / 4);-webkit-margin-before:var(--spacing-xxs);margin-block-start:var(--spacing-xxs)}.pds-chip__button{-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;border-radius:var(--border-radius);display:-ms-flexbox;display:flex;font-weight:var(--font-weight);padding-block:var(--spacing-xs);padding-inline:var(--spacing-lg)}.pds-chip__button:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-chip__button pds-icon{-webkit-margin-end:calc(var(--spacing-xxs) * -1);margin-inline-end:calc(var(--spacing-xxs) * -1);-webkit-margin-start:var(--spacing-xs);margin-inline-start:var(--spacing-xs)}:host(.pds-chip--tag){padding-block:var(--spacing-xxs)}.pds-chip__close{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;border-radius:50%;height:var(--sizing-close);-webkit-margin-end:calc(var(--spacing-md) * -1);margin-inline-end:calc(var(--spacing-md) * -1);-webkit-margin-start:var(--spacing-xs);margin-inline-start:var(--spacing-xs);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{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}:host(.pds-chip--large){font-size:var(--font-size-lg);padding-block:var(--spacing-sm);padding-inline:var(--spacing-xxl)}:host(.pds-chip--large):host(.pds-chip--dropdown){padding-block:var(--spacing-xs);padding-inline:var(--spacing-xxs)}:host(.pds-chip--large):host(.pds-chip--dropdown) .pds-chip__dot{-webkit-margin-after:0;margin-block-end:0}:host(.pds-chip--large) .pds-chip__button{font-size:var(--font-size-lg);padding-inline:var(--spacing-xl)}:host(.pds-chip--large) .pds-chip__close{height:var(--sizing-close-lg);-webkit-margin-end:calc(var(--spacing-xl) * -1);margin-inline-end:calc(var(--spacing-xl) * -1);width:var(--sizing-close-lg)}:host(.pds-chip--large):host(.pds-chip--tag){padding-block:var(--spacing-xs)}";const t=p;const d=class{constructor(n){o(this,n);this.pdsTagCloseClick=r(this,"pdsTagCloseClick",7);this.handleCloseClick=()=>{this.pdsTagCloseClick.emit()};this.componentId=undefined;this.dot=false;this.label=undefined;this.large=false;this.sentiment="neutral";this.variant="text"}classNames(){const o=["pds-chip"];if(this.large){o.push("pds-chip--large")}if(this.variant){o.push("pds-chip--"+this.variant)}if(this.sentiment){o.push("pds-chip--"+this.sentiment)}return o.join(" ")}setChipContent(){const o=this.variant==="dropdown";const r=o?n("button",{class:"pds-chip__button",type:"button"},this.dot&&n("i",{class:"pds-chip__dot","aria-hidden":"true"}),this.label,n("pds-icon",{icon:e,size:"12px","aria-hidden":"true"})):n("span",{class:"pds-chip__label"},this.dot&&n("i",{class:"pds-chip__dot","aria-hidden":"true"}),this.label);return r}render(){return n(a,{key:"fac4e9beb31ba05d0c959fb53a9cd62caeacb219",class:this.classNames(),id:this.componentId},this.setChipContent(),this.variant==="tag"&&n("button",{key:"5f57c1cc76f6cffdebe6244f499b427e5f4c04e8",class:"pds-chip__close",type:"button",onClick:this.handleCloseClick,"aria-label":"Remove"},n("pds-icon",{key:"f4311271f68d700568dc51af9c1512fdfc7c262d",icon:c,size:"12px"})))}};d.style=s+t;export{d as pds_chip};
|
|
2
|
+
//# sourceMappingURL=p-3ff2642d.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["baseCss","PdsChipStyle0","pdsChipCss","PdsChipStyle1","PdsChip","this","handleCloseClick","pdsTagCloseClick","emit","classNames","large","push","variant","sentiment","join","setChipContent","isDropdown","chipContent","h","class","type","dot","label","icon","downSmall","size","render","Host","key","id","componentId","onClick","remove"],"sources":["src/global/styles/base.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":["// TODO: replace core tokens with semantic\n// Heading color + outline\n\n/*\n Josh's Custom CSS Reset\n https://www.joshwcomeau.com/css/custom-css-reset/\n*/\n:where(*:not(slot), *:not(slot)::before, *:not(slot)::after) {\n box-sizing: border-box;\n}\n\n:where(*:not(slot)) {\n margin: 0;\n}\n\n:where(img, picture, video, canvas, svg) {\n display: block;\n max-width: 100%;\n}\n\n:where(input, button, textarea, select) {\n font: inherit;\n}\n\n:where(p, h1, h2, h3, h4, h5, h6) {\n overflow-wrap: break-word;\n}\n\n/*\n Additional Reset Styles\n*/\n:where(a:not([href]):not([class])) {\n color: currentColor;\n text-decoration: none;\n}\n\n:where(a:not([href]):not([class]):hover) {\n color: currentColor;\n text-decoration: none;\n}\n\n:where(ul[role='list'], ol[role='list']) {\n list-style: none;\n}\n\n:where(table) {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\n/*\n Mercury Base Styles\n*/\n// Typography\n:where(*:not(slot)) {\n font: var(--pine-typography-body-md-default);\n letter-spacing: var(--pine-letter-spacing-body-md);\n}\n\n:where(h1, h2, h3, h4, h5, h6) {\n font-family: var(--pine-font-family-heading);\n color: var(--pine-color-grey-950);\n}\n\n:where(h1) {\n font: var(--pine-typography-heading-h1);\n letter-spacing: var(--pine-letter-spacing-heading-h1);\n}\n\n:where(h2) {\n font: var(--pine-typography-heading-h2);\n letter-spacing: var(--pine-letter-spacing-heading-h2);\n}\n\n:where(h3) {\n font: var(--pine-typography-heading-h3);\n letter-spacing: var(--pine-letter-spacing-heading-h3);\n}\n\n:where(h4) {\n font: var(--pine-typography-heading-h4);\n letter-spacing: var(--pine-letter-spacing-heading-h4);\n}\n\n:where(h5) {\n font: var(--pine-typography-heading-h5);\n letter-spacing: var(--pine-letter-spacing-heading-h5);\n}\n\n:where(h6) {\n font: var(--pine-typography-heading-h6);\n letter-spacing: var(--pine-letter-spacing-heading-h6);\n}\n\n:where(div, label, p, span) {\n color: var(--pine-color-text-default);\n}\n\n:where(code, kbd, pre, samp) {\n font-family: monospace;\n}\n\n// Accessibility\n:where([role=\"button\"]) {\n cursor: pointer;\n}\n\n:where(:focus) {\n outline: 0;\n}\n\n:where(:focus-visible) {\n outline: var(--pine-border-width-thick) solid var(--pine-color-purple-500);\n}\n\n// Misc.\n:where([hidden]) {\n display: none !important;\n}\n",":host {\n --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-purple-300);\n --border-radius: var(--pine-border-radius-200);\n\n --color-background-accent: var(--pine-color-purple-100);\n --color-background-accent-dot: var(--pine-color-purple-600);\n --color-background-accent-hover: var(--pine-color-purple-200);\n --color-background-danger: var(--pine-color-red-100);\n --color-background-danger-dot: var(--pine-color-red-600);\n --color-background-danger-hover: var(--pine-color-red-200);\n --color-background-info: var(--pine-color-blue-100);\n --color-background-info-dot: var(--pine-color-blue-600);\n --color-background-info-hover: var(--pine-color-blue-200);\n --color-background-neutral: var(--pine-color-grey-100);\n --color-background-neutral-dot: var(--pine-color-grey-600);\n --color-background-neutral-hover: var(--pine-color-grey-400);\n --color-background-success: var(--pine-color-green-100);\n --color-background-success-dot: var(--pine-color-green-600);\n --color-background-success-hover: var(--pine-color-green-200);\n --color-background-warning: var(--pine-color-yellow-100);\n --color-background-warning-dot: var(--pine-color-yellow-600);\n --color-background-warning-hover: var(--pine-color-yellow-200);\n --color-text-accent: var(--pine-color-purple-950);\n --color-text-danger: var(--pine-color-red-950);\n --color-text-info: var(--pine-color-blue-950);\n --color-text-neutral: var(--pine-color-grey-950);\n --color-text-success: var(--pine-color-green-950);\n --color-text-warning: var(--pine-color-yellow-950);\n\n --font-size-sm: var(--pine-font-size-body-md);\n --font-size-lg: var(--pine-font-size-heading-h6);\n --font-weight: var(--pine-font-weight-medium);\n\n --spacing-xxs: calc(var(--pine-spacing-050) / 2);\n --spacing-xs: var(--pine-spacing-050);\n --spacing-sm: calc(var(--pine-spacing-150) / 2);\n --spacing-md: var(--pine-spacing-100);\n --spacing-lg: calc(var(--pine-spacing-250) / 2);\n --spacing-xl: var(--pine-spacing-150);\n --spacing-xxl: calc(var(--pine-spacing-350) / 2);\n\n --sizing-close: 10px;\n --sizing-close-lg: 24px;\n --sizing-dot: 4px;\n\n align-items: center;\n border-radius: var(--border-radius);\n display: inline-flex;\n padding-block: var(--spacing-xs);\n padding-inline: var(--spacing-lg);\n}\n\n$pds-chip-sentiment: (\n accent: var(--color-background-accent),\n danger: var(--color-background-danger),\n info: var(--color-background-info),\n neutral: var(--color-background-neutral),\n success: var(--color-background-success),\n warning: var(--color-background-warning),\n);\n\n$pds-chip-sentiment-text: (\n accent: var(--color-text-accent),\n danger: var(--color-text-danger),\n info: var(--color-text-info),\n neutral: var(--color-text-neutral),\n success: var(--color-text-success),\n warning: var(--color-text-warning),\n);\n\n$pds-chip-sentiment-dots: (\n accent: var(--color-background-accent-dot),\n danger: var(--color-background-danger-dot),\n info: var(--color-background-info-dot),\n neutral: var(--color-background-neutral-dot),\n success: var(--color-background-success-dot),\n warning: var(--color-background-warning-dot),\n);\n\n$pds-chip-sentiment-hover: (\n accent: var(--color-background-accent-hover),\n danger: var(--color-background-danger-hover),\n info: var(--color-background-info-hover),\n neutral: var(--color-background-neutral-hover),\n success: var(--color-background-success-hover),\n warning: var(--color-background-warning-hover),\n);\n\n@each $sentiment, $value in $pds-chip-sentiment {\n :host(.pds-chip--#{$sentiment}) {\n background: $value;\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 {\n /* stylelint-disable-next-line */\n color: map-get($pds-chip-sentiment-text, $sentiment);\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: 1px solid transparent;\n border-radius: 50%;\n display: inline-block;\n height: var(--sizing-dot);\n margin-block-end: var(--spacing-xxs);\n margin-inline-end: var(--spacing-xs);\n width: var(--sizing-dot);\n}\n\n.pds-chip__label {\n font-size: var(--font-size-sm);\n font-weight: var(--font-weight);\n}\n\n// dropdown\n\n:host(.pds-chip--dropdown) {\n padding: 0;\n\n .pds-chip__dot {\n margin-block-end: calc(var(--spacing-xxs) / 4);\n margin-block-start: var(--spacing-xxs);\n }\n}\n\n.pds-chip__button {\n align-items: center;\n appearance: none;\n background: transparent;\n border: 0;\n border-radius: var(--border-radius);\n display: flex;\n font-weight: var(--font-weight);\n padding-block: var(--spacing-xs);\n padding-inline: var(--spacing-lg);\n\n &:focus-visible {\n box-shadow: var(--box-shadow-focus);\n outline: none;\n }\n\n pds-icon {\n margin-inline-end: calc(var(--spacing-xxs) * -1);\n margin-inline-start: var(--spacing-xs);\n }\n}\n\n// tag\n\n:host(.pds-chip--tag) {\n padding-block: var(--spacing-xxs);\n}\n\n.pds-chip__close {\n appearance: none;\n background: transparent;\n border: 0;\n border-radius: 50%;\n height: var(--sizing-close);\n margin-inline-end: calc(var(--spacing-md) * -1);\n margin-inline-start: var(--spacing-xs);\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 box-shadow: var(--box-shadow-focus);\n outline: none;\n }\n}\n\n// large\n\n:host(.pds-chip--large) {\n font-size: var(--font-size-lg);\n padding-block: var(--spacing-sm);\n padding-inline: var(--spacing-xxl);\n\n &:host(.pds-chip--dropdown) {\n padding-block: var(--spacing-xs);\n padding-inline: var(--spacing-xxs);\n\n .pds-chip__dot {\n margin-block-end: 0;\n }\n }\n\n .pds-chip__button {\n font-size: var(--font-size-lg);\n padding-inline: var(--spacing-xl)\n }\n\n .pds-chip__close {\n height: var(--sizing-close-lg);\n margin-inline-end: calc(var(--spacing-xl) * -1);\n width: var(--sizing-close-lg);\n }\n\n &:host(.pds-chip--tag) {\n padding-block: var(--spacing-xs);\n }\n}\n","import { downSmall, remove } from '@pine-ds/icons/icons';\nimport { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'pds-chip',\n styleUrls: ['../../global/styles/base.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 * Sets the color scheme of the chip.\n * @defaultValue 'neutral'\n */\n @Prop() sentiment: 'accent' | 'danger' | 'info' | 'neutral' | 'success' | 'warning' = 'neutral';\n\n /**\n * Determines whether a dot should be displayed on the chip.\n * @defaultValue false\n */\n @Prop() dot = false;\n\n /**\n * Sets the text label content of the chip.\n */\n @Prop() label: string;\n\n /**\n * Determines whether the chip should be rendered in a larger size.\n * @defaultValue false\n */\n @Prop() large = false;\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 when close button is clicked on tag variant.\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 {this.label}\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 {this.label}\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":"oGAAA,MAAMA,EAAU,yrDAChB,MAAAC,EAAeD,ECDf,MAAME,EAAa,s7OACnB,MAAAC,EAAeD,E,MCOFE,EAAO,M,4EAwCVC,KAAAC,iBAAmB,KACzBD,KAAKE,iBAAiBC,MAAM,E,0CA/BwD,U,SAMxE,M,gCAWE,M,aAM+B,M,CAWvC,UAAAC,GACN,MAAMA,EAAa,CAAC,YAEpB,GAAIJ,KAAKK,MAAO,CACdD,EAAWE,KAAK,kB,CAElB,GAAIN,KAAKO,QAAS,CAChBH,EAAWE,KAAK,aAAeN,KAAKO,Q,CAEtC,GAAIP,KAAKQ,UAAW,CAClBJ,EAAWE,KAAK,aAAeN,KAAKQ,U,CAGtC,OAAOJ,EAAWK,KAAK,K,CAGjB,cAAAC,GACN,MAAMC,EAAaX,KAAKO,UAAY,WACpC,MAAMK,EAAcD,EAClBE,EAAA,UAAQC,MAAM,mBAAmBC,KAAK,UACnCf,KAAKgB,KAAOH,EAAA,KAAGC,MAAM,gBAAe,cAAa,SACjDd,KAAKiB,MACNJ,EAAA,YAAUK,KAAMC,EAAWC,KAAK,OAAM,cAAa,UAGrDP,EAAA,QAAMC,MAAM,mBACTd,KAAKgB,KAAOH,EAAA,KAAGC,MAAM,gBAAe,cAAa,SACjDd,KAAKiB,OAIV,OAAOL,C,CAGT,MAAAS,GACE,OACER,EAACS,EAAI,CAAAC,IAAA,2CAACT,MAAOd,KAAKI,aAAcoB,GAAIxB,KAAKyB,aACtCzB,KAAKU,iBACLV,KAAKO,UAAY,OAChBM,EAAA,UAAAU,IAAA,2CAAQT,MAAM,kBAAkBC,KAAK,SAASW,QAAS1B,KAAKC,iBAAgB,aAAa,UACvFY,EAAA,YAAAU,IAAA,2CAAUL,KAAMS,EAAQP,KAAK,U","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["baseCss","PdsChipStyle0","pdsChipCss","PdsChipStyle1","PdsChip","this","handleCloseClick","pdsTagCloseClick","emit","classNames","large","push","variant","sentiment","join","setChipContent","isDropdown","chipContent","h","class","type","dot","label","icon","downSmall","size","render","Host","key","id","componentId","onClick","remove"],"sources":["src/global/styles/base.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":["// TODO: replace core tokens with semantic\n// Heading color + outline\n\n/*\n Josh's Custom CSS Reset\n https://www.joshwcomeau.com/css/custom-css-reset/\n*/\n:where(*:not(slot), *:not(slot)::before, *:not(slot)::after) {\n box-sizing: border-box;\n}\n\n:where(*:not(slot)) {\n margin: 0;\n}\n\n:where(img, picture, video, canvas, svg) {\n display: block;\n max-width: 100%;\n}\n\n:where(input, button, textarea, select) {\n font: inherit;\n}\n\n:where(p, h1, h2, h3, h4, h5, h6) {\n overflow-wrap: break-word;\n}\n\n/*\n Additional Reset Styles\n*/\n:where(a:not([href]):not([class])) {\n color: currentColor;\n text-decoration: none;\n}\n\n:where(a:not([href]):not([class]):hover) {\n color: currentColor;\n text-decoration: none;\n}\n\n:where(ul[role='list'], ol[role='list']) {\n list-style: none;\n}\n\n:where(table) {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\n/*\n Mercury Base Styles\n*/\n// Typography\n:where(*:not(slot)) {\n font: var(--pine-typography-body-md-default);\n letter-spacing: var(--pine-letter-spacing-body-md);\n}\n\n:where(h1, h2, h3, h4, h5, h6) {\n font-family: var(--pine-font-family-heading);\n color: var(--pine-color-grey-950);\n}\n\n:where(h1) {\n font: var(--pine-typography-heading-h1);\n letter-spacing: var(--pine-letter-spacing-heading-h1);\n}\n\n:where(h2) {\n font: var(--pine-typography-heading-h2);\n letter-spacing: var(--pine-letter-spacing-heading-h2);\n}\n\n:where(h3) {\n font: var(--pine-typography-heading-h3);\n letter-spacing: var(--pine-letter-spacing-heading-h3);\n}\n\n:where(h4) {\n font: var(--pine-typography-heading-h4);\n letter-spacing: var(--pine-letter-spacing-heading-h4);\n}\n\n:where(h5) {\n font: var(--pine-typography-heading-h5);\n letter-spacing: var(--pine-letter-spacing-heading-h5);\n}\n\n:where(h6) {\n font: var(--pine-typography-heading-h6);\n letter-spacing: var(--pine-letter-spacing-heading-h6);\n}\n\n:where(div, label, p, span) {\n color: var(--pine-color-text-default);\n}\n\n:where(code, kbd, pre, samp) {\n font-family: monospace;\n}\n\n// Accessibility\n:where([role=\"button\"]) {\n cursor: pointer;\n}\n\n:where(:focus) {\n outline: 0;\n}\n\n:where(:focus-visible) {\n outline: var(--pine-border-width-thick) solid var(--pine-color-purple-500);\n}\n\n// Misc.\n:where([hidden]) {\n display: none !important;\n}\n",":host {\n --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-purple-300);\n --border-radius: var(--pine-border-radius-200);\n\n --color-background-accent: var(--pine-color-purple-100);\n --color-background-accent-dot: var(--pine-color-purple-600);\n --color-background-accent-hover: var(--pine-color-purple-200);\n --color-background-danger: var(--pine-color-red-100);\n --color-background-danger-dot: var(--pine-color-red-600);\n --color-background-danger-hover: var(--pine-color-red-200);\n --color-background-info: var(--pine-color-blue-100);\n --color-background-info-dot: var(--pine-color-blue-600);\n --color-background-info-hover: var(--pine-color-blue-200);\n --color-background-neutral: var(--pine-color-grey-100);\n --color-background-neutral-dot: var(--pine-color-grey-600);\n --color-background-neutral-hover: var(--pine-color-grey-400);\n --color-background-success: var(--pine-color-green-100);\n --color-background-success-dot: var(--pine-color-green-600);\n --color-background-success-hover: var(--pine-color-green-200);\n --color-background-warning: var(--pine-color-yellow-100);\n --color-background-warning-dot: var(--pine-color-yellow-600);\n --color-background-warning-hover: var(--pine-color-yellow-200);\n --color-text-accent: var(--pine-color-purple-950);\n --color-text-danger: var(--pine-color-red-950);\n --color-text-info: var(--pine-color-blue-950);\n --color-text-neutral: var(--pine-color-grey-950);\n --color-text-success: var(--pine-color-green-950);\n --color-text-warning: var(--pine-color-yellow-950);\n\n --font-size-sm: var(--pine-font-size-body-md);\n --font-size-lg: var(--pine-font-size-heading-h6);\n --font-weight: var(--pine-font-weight-medium);\n\n --spacing-xxs: calc(var(--pine-spacing-050) / 2);\n --spacing-xs: var(--pine-spacing-050);\n --spacing-sm: calc(var(--pine-spacing-150) / 2);\n --spacing-md: var(--pine-spacing-100);\n --spacing-lg: calc(var(--pine-spacing-250) / 2);\n --spacing-xl: var(--pine-spacing-150);\n --spacing-xxl: calc(var(--pine-spacing-350) / 2);\n\n --sizing-close: 10px;\n --sizing-close-lg: 24px;\n --sizing-dot: 4px;\n\n align-items: center;\n border-radius: var(--border-radius);\n display: inline-flex;\n padding-block: var(--spacing-xs);\n padding-inline: var(--spacing-lg);\n}\n\n$pds-chip-sentiment: (\n accent: var(--color-background-accent),\n danger: var(--color-background-danger),\n info: var(--color-background-info),\n neutral: var(--color-background-neutral),\n success: var(--color-background-success),\n warning: var(--color-background-warning),\n);\n\n$pds-chip-sentiment-text: (\n accent: var(--color-text-accent),\n danger: var(--color-text-danger),\n info: var(--color-text-info),\n neutral: var(--color-text-neutral),\n success: var(--color-text-success),\n warning: var(--color-text-warning),\n);\n\n$pds-chip-sentiment-dots: (\n accent: var(--color-background-accent-dot),\n danger: var(--color-background-danger-dot),\n info: var(--color-background-info-dot),\n neutral: var(--color-background-neutral-dot),\n success: var(--color-background-success-dot),\n warning: var(--color-background-warning-dot),\n);\n\n$pds-chip-sentiment-hover: (\n accent: var(--color-background-accent-hover),\n danger: var(--color-background-danger-hover),\n info: var(--color-background-info-hover),\n neutral: var(--color-background-neutral-hover),\n success: var(--color-background-success-hover),\n warning: var(--color-background-warning-hover),\n);\n\n@each $sentiment, $value in $pds-chip-sentiment {\n :host(.pds-chip--#{$sentiment}) {\n background: $value;\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 {\n /* stylelint-disable-next-line */\n color: map-get($pds-chip-sentiment-text, $sentiment);\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: 1px solid transparent;\n border-radius: 50%;\n display: inline-block;\n height: var(--sizing-dot);\n margin-block-end: var(--spacing-xxs);\n margin-inline-end: var(--spacing-xs);\n width: var(--sizing-dot);\n}\n\n.pds-chip__label {\n font-size: var(--font-size-sm);\n font-weight: var(--font-weight);\n}\n\n// dropdown\n\n:host(.pds-chip--dropdown) {\n padding: 0;\n\n .pds-chip__dot {\n margin-block-end: calc(var(--spacing-xxs) / 4);\n margin-block-start: var(--spacing-xxs);\n }\n}\n\n.pds-chip__button {\n align-items: center;\n appearance: none;\n background: transparent;\n border: 0;\n border-radius: var(--border-radius);\n display: flex;\n font-weight: var(--font-weight);\n padding-block: var(--spacing-xs);\n padding-inline: var(--spacing-lg);\n\n &:focus-visible {\n box-shadow: var(--box-shadow-focus);\n outline: none;\n }\n\n pds-icon {\n margin-inline-end: calc(var(--spacing-xxs) * -1);\n margin-inline-start: var(--spacing-xs);\n }\n}\n\n// tag\n\n:host(.pds-chip--tag) {\n padding-block: var(--spacing-xxs);\n}\n\n.pds-chip__close {\n appearance: none;\n background: transparent;\n border: 0;\n border-radius: 50%;\n height: var(--sizing-close);\n margin-inline-end: calc(var(--spacing-md) * -1);\n margin-inline-start: var(--spacing-xs);\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 box-shadow: var(--box-shadow-focus);\n outline: none;\n }\n}\n\n// large\n\n:host(.pds-chip--large) {\n font-size: var(--font-size-lg);\n padding-block: var(--spacing-sm);\n padding-inline: var(--spacing-xxl);\n\n &:host(.pds-chip--dropdown) {\n padding-block: var(--spacing-xs);\n padding-inline: var(--spacing-xxs);\n\n .pds-chip__dot {\n margin-block-end: 0;\n }\n }\n\n .pds-chip__button {\n font-size: var(--font-size-lg);\n padding-inline: var(--spacing-xl)\n }\n\n .pds-chip__close {\n height: var(--sizing-close-lg);\n margin-inline-end: calc(var(--spacing-xl) * -1);\n width: var(--sizing-close-lg);\n }\n\n &:host(.pds-chip--tag) {\n padding-block: var(--spacing-xs);\n }\n}\n","import { downSmall, remove } from '@pine-ds/icons/icons';\nimport { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'pds-chip',\n styleUrls: ['../../global/styles/base.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 * Sets the text label content of the chip.\n */\n @Prop() label: string;\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 {this.label}\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 {this.label}\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":"oGAAA,MAAMA,EAAU,yrDAChB,MAAAC,EAAeD,ECDf,MAAME,EAAa,s7OACnB,MAAAC,EAAeD,E,MCOFE,EAAO,M,4EAwCVC,KAAAC,iBAAmB,KACzBD,KAAKE,iBAAiBC,MAAM,E,oCA/BhB,M,gCAWE,M,eAMsE,U,aAMvC,M,CAWvC,UAAAC,GACN,MAAMA,EAAa,CAAC,YAEpB,GAAIJ,KAAKK,MAAO,CACdD,EAAWE,KAAK,kB,CAElB,GAAIN,KAAKO,QAAS,CAChBH,EAAWE,KAAK,aAAeN,KAAKO,Q,CAEtC,GAAIP,KAAKQ,UAAW,CAClBJ,EAAWE,KAAK,aAAeN,KAAKQ,U,CAGtC,OAAOJ,EAAWK,KAAK,I,CAGjB,cAAAC,GACN,MAAMC,EAAaX,KAAKO,UAAY,WACpC,MAAMK,EAAcD,EAClBE,EAAA,UAAQC,MAAM,mBAAmBC,KAAK,UACnCf,KAAKgB,KAAOH,EAAA,KAAGC,MAAM,gBAAe,cAAa,SACjDd,KAAKiB,MACNJ,EAAA,YAAUK,KAAMC,EAAWC,KAAK,OAAM,cAAa,UAGrDP,EAAA,QAAMC,MAAM,mBACTd,KAAKgB,KAAOH,EAAA,KAAGC,MAAM,gBAAe,cAAa,SACjDd,KAAKiB,OAIV,OAAOL,C,CAGT,MAAAS,GACE,OACER,EAACS,EAAI,CAAAC,IAAA,2CAACT,MAAOd,KAAKI,aAAcoB,GAAIxB,KAAKyB,aACtCzB,KAAKU,iBACLV,KAAKO,UAAY,OAChBM,EAAA,UAAAU,IAAA,2CAAQT,MAAM,kBAAkBC,KAAK,SAASW,QAAS1B,KAAKC,iBAAgB,aAAa,UACvFY,EAAA,YAAAU,IAAA,2CAAUL,KAAMS,EAAQP,KAAK,U","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var __awaiter=this&&this.__awaiter||function(e,t,n,r){function i(e){return e instanceof n?e:new n((function(t){t(e)}))}return new(n||(n=Promise))((function(n,o){function a(e){try{p(r.next(e))}catch(e){o(e)}}function d(e){try{p(r["throw"](e))}catch(e){o(e)}}function p(e){e.done?n(e.value):i(e.value).then(a,d)}p((r=r.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var n={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},r,i,o,a;return a={next:d(0),throw:d(1),return:d(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function d(e){return function(t){return p([e,t])}}function p(d){if(r)throw new TypeError("Generator is already executing.");while(a&&(a=0,d[0]&&(n=0)),n)try{if(r=1,i&&(o=d[0]&2?i["return"]:d[0]?i["throw"]||((o=i["return"])&&o.call(i),0):i.next)&&!(o=o.call(i,d[1])).done)return o;if(i=0,o)d=[d[0]&2,o.value];switch(d[0]){case 0:case 1:o=d;break;case 4:n.label++;return{value:d[1],done:false};case 5:n.label++;i=d[1];d=[0];continue;case 7:d=n.ops.pop();n.trys.pop();continue;default:if(!(o=n.trys,o=o.length>0&&o[o.length-1])&&(d[0]===6||d[0]===2)){n=0;continue}if(d[0]===3&&(!o||d[1]>o[0]&&d[1]<o[3])){n.label=d[1];break}if(d[0]===6&&n.label<o[1]){n.label=o[1];o=d;break}if(o&&n.label<o[2]){n.label=o[2];n.ops.push(d);break}if(o[2])n.ops.pop();n.trys.pop();continue}d=t.call(e,n)}catch(e){d=[6,e];i=0}finally{r=o=0}if(d[0]&5)throw d[1];return{value:d[0]?d[1]:void 0,done:true}}};System.register(["./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
var __awaiter=this&&this.__awaiter||function(e,t,n,r){function i(e){return e instanceof n?e:new n((function(t){t(e)}))}return new(n||(n=Promise))((function(n,o){function a(e){try{p(r.next(e))}catch(e){o(e)}}function d(e){try{p(r["throw"](e))}catch(e){o(e)}}function p(e){e.done?n(e.value):i(e.value).then(a,d)}p((r=r.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var n={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},r,i,o,a;return a={next:d(0),throw:d(1),return:d(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function d(e){return function(t){return p([e,t])}}function p(d){if(r)throw new TypeError("Generator is already executing.");while(a&&(a=0,d[0]&&(n=0)),n)try{if(r=1,i&&(o=d[0]&2?i["return"]:d[0]?i["throw"]||((o=i["return"])&&o.call(i),0):i.next)&&!(o=o.call(i,d[1])).done)return o;if(i=0,o)d=[d[0]&2,o.value];switch(d[0]){case 0:case 1:o=d;break;case 4:n.label++;return{value:d[1],done:false};case 5:n.label++;i=d[1];d=[0];continue;case 7:d=n.ops.pop();n.trys.pop();continue;default:if(!(o=n.trys,o=o.length>0&&o[o.length-1])&&(d[0]===6||d[0]===2)){n=0;continue}if(d[0]===3&&(!o||d[1]>o[0]&&d[1]<o[3])){n.label=d[1];break}if(d[0]===6&&n.label<o[1]){n.label=o[1];o=d;break}if(o&&n.label<o[2]){n.label=o[2];n.ops.push(d);break}if(o[2])n.ops.pop();n.trys.pop();continue}d=t.call(e,n)}catch(e){d=[6,e];i=0}finally{r=o=0}if(d[0]&5)throw d[1];return{value:d[0]?d[1]:void 0,done:true}}};System.register(["./p-45cf2585.system.js","./p-e90b2c75.system.js"],(function(e){"use strict";var t,n,r,i,o;return{setters:[function(e){t=e.r;n=e.c;r=e.h;i=e.H},function(e){o=e.a}],execute:function(){var a=":where(*:not(slot),*:not(slot)::before,*:not(slot)::after){-webkit-box-sizing:border-box;box-sizing:border-box}:where(*:not(slot)){margin:0}:where(img,picture,video,canvas,svg){display:block;max-width:100%}:where(input,button,textarea,select){font:inherit}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(a:not([href]):not([class])){color:currentColor;text-decoration:none}:where(a:not([href]):not([class]):hover){color:currentColor;text-decoration:none}:where(ul[role=list],ol[role=list]){list-style:none}:where(table){border-collapse:collapse;border-spacing:0}:where(*:not(slot)){font:var(--pine-typography-body-md-default);letter-spacing:var(--pine-letter-spacing-body-md)}:where(h1,h2,h3,h4,h5,h6){font-family:var(--pine-font-family-heading);color:var(--pine-color-grey-950)}:where(h1){font:var(--pine-typography-heading-h1);letter-spacing:var(--pine-letter-spacing-heading-h1)}:where(h2){font:var(--pine-typography-heading-h2);letter-spacing:var(--pine-letter-spacing-heading-h2)}:where(h3){font:var(--pine-typography-heading-h3);letter-spacing:var(--pine-letter-spacing-heading-h3)}:where(h4){font:var(--pine-typography-heading-h4);letter-spacing:var(--pine-letter-spacing-heading-h4)}:where(h5){font:var(--pine-typography-heading-h5);letter-spacing:var(--pine-letter-spacing-heading-h5)}:where(h6){font:var(--pine-typography-heading-h6);letter-spacing:var(--pine-letter-spacing-heading-h6)}:where(div,label,p,span){color:var(--pine-color-text-default)}:where(code,kbd,pre,samp){font-family:monospace}:where([role=button]){cursor:pointer}:where(:focus){outline:0}:where(:focus-visible){outline:var(--pine-border-width-thick) solid var(--pine-color-purple-500)}:where([hidden]){display:none !important}";var d=a;var p=":host(.pds-copytext){--border-interactive-default:var(--pine-border-width-thin) solid var(--pine-color-grey-300);--border-interactive-hover:var(--pine-border-width-thin) solid var(--pine-color-grey-400);--border-radius-default:var(--pine-border-radius-circle);--border-width-default:var(--pine-border-width-none);--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-purple-300);--color-background-default:var(--pine-color-white);--color-border-interactive-hover:var(--pine-color-grey-400);--color-text-hover:var(--pine-color-grey-900);--copytext-color-background-hover:var(--pine-color-grey-200);--font-size-default:var(--pine-font-size-100);--font-weight-default:var(--pine-font-weight-body-medium);--spacing-bordered-margin-inline-end:var(--pine-spacing-200);--spacing-bordered-padding-block:var(--pine-spacing-100);--spacing-bordered-padding-inline:var(--pine-spacing-200);--spacing-margin-inline-end:var(--pine-spacing-100);--spacing-padding-block:var(--pine-spacing-050);--spacing-padding-inline:var(--pine-spacing-100);--spacing-padding-none:var(--pine-spacing-0);--typography-default:var(--pine-font-weight-body-medium) var(--pine-font-size-body-md)/var(--pine-line-height-body) var(--pine-font-family-heading)}:host(.pds-copytext) pds-button{-ms-flex-align:center;align-items:center;background:var(--color-background-default);border:var(--border-width-default);border-radius:var(--border-radius-default);display:-ms-inline-flexbox;display:inline-flex;font:var(--typography-default);max-width:100%;padding:var(--spacing-padding-block) var(--spacing-padding-inline)}:host(.pds-copytext) pds-button::part(button){-webkit-padding-end:calc(var(--spacing-padding-inline) / 2);padding-inline-end:calc(var(--spacing-padding-inline) / 2)}:host(.pds-copytext) pds-button::part(button):hover{background-color:var(--copytext-color-background-hover);color:var(--color-text-hover)}:host(.pds-copytext) pds-button span{font-weight:var(--font-weight-default);-webkit-margin-end:var(--spacing-margin-inline-end);margin-inline-end:var(--spacing-margin-inline-end);white-space:nowrap}:host(.pds-copytext) pds-button :nth-child(2){-ms-flex-negative:0;flex-shrink:0}:host(.pds-copytext):host(.pds-copytext--bordered){border:var(--border-width-default);padding:var(--spacing-padding-none)}:host(.pds-copytext):host(.pds-copytext--bordered) pds-button{padding:var(--spacing-padding-none)}:host(.pds-copytext):host(.pds-copytext--bordered) pds-button:hover{background:none}:host(.pds-copytext):host(.pds-copytext--bordered) span{border:var(--border-interactive-default);border-radius:var(--border-radius-default);-webkit-margin-end:var(--spacing-bordered-margin-inline-end);margin-inline-end:var(--spacing-bordered-margin-inline-end);padding-block:var(--spacing-bordered-padding-block);padding-inline:var(--spacing-bordered-padding-inline)}:host(.pds-copytext):host(.pds-copytext--bordered) :hover span{border:var(--border-interactive-hover)}:host(.pds-copytext):host(.pds-copytext--full-width){display:-ms-flexbox;display:flex;width:100%}:host(.pds-copytext):host(.pds-copytext--full-width) pds-button{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;width:100%}:host(.pds-copytext):host(.pds-copytext--full-width) pds-button span{text-align:left;width:100%}:host(.pds-copytext):host(.pds-copytext--truncated) pds-button{display:-ms-flexbox;display:flex;width:100%}:host(.pds-copytext):host(.pds-copytext--truncated) pds-button span{overflow:hidden;text-align:left;text-overflow:ellipsis;width:100%}";var s=p;var c=e("pds_copytext",function(){function e(e){var r=this;t(this,e);this.pdsCopyTextClick=n(this,"pdsCopyTextClick",7);this.copyToClipboard=function(e){return __awaiter(r,void 0,void 0,(function(){var t;return __generator(this,(function(n){switch(n.label){case 0:n.trys.push([0,3,,4]);if(!(typeof navigator.clipboard!=="undefined"))return[3,2];return[4,navigator.clipboard.writeText(e)];case 1:n.sent();this.pdsCopyTextClick.emit("Copied to clipboard");n.label=2;case 2:return[3,4];case 3:t=n.sent();this.pdsCopyTextClick.emit("Error writing text to clipboard: ".concat(t));return[3,4];case 4:return[2]}}))}))};this.handleClick=function(){r.copyToClipboard(r.value)};this.border=true;this.componentId=undefined;this.fullWidth=false;this.truncate=false;this.value=undefined}e.prototype.classNames=function(){var e=["pds-copytext"];if(this.border){e.push("pds-copytext--bordered")}if(this.fullWidth){e.push("pds-copytext--full-width")}if(this.truncate){e.push("pds-copytext--truncated")}return e.join(" ")};e.prototype.render=function(){return r(i,{key:"43aceb92fe0cc910613115bc882b04108efeffba",class:this.classNames(),id:this.componentId},r("pds-button",{key:"f152bc288e64192a80ed8f4f48d90e3edb7558cc",type:"button",variant:"unstyled",onClick:this.handleClick},r("span",{key:"ed9486b47835e21601047d2a915a412e664c6b4b"},this.value),r("pds-icon",{key:"bfbf6d92775171c36f768d654c5866f2f4ce8479",icon:o,size:"16px"})))};return e}());c.style=d+s}}}));
|
|
2
|
+
//# sourceMappingURL=p-4043cf6e.system.entry.js.map
|