@pine-ds/core 0.1.4 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/index.js +2 -0
- package/components/index.js.map +1 -0
- package/components/index2.js +10 -0
- package/components/index2.js.map +1 -0
- package/components/pds-accordion.js +4 -1
- package/components/pds-accordion.js.map +1 -0
- package/components/pds-avatar.js +12 -6
- package/components/pds-avatar.js.map +1 -0
- package/components/pds-box.js +2 -0
- package/components/pds-box.js.map +1 -0
- package/components/pds-button.js +2 -0
- package/components/pds-button.js.map +1 -0
- package/components/pds-button2.js +2 -0
- package/components/pds-button2.js.map +1 -0
- package/components/pds-checkbox.js +2 -0
- package/components/pds-checkbox.js.map +1 -0
- package/components/pds-checkbox2.js +2 -0
- package/components/pds-checkbox2.js.map +1 -0
- package/components/pds-chip.js +2 -0
- package/components/pds-chip.js.map +1 -0
- package/components/pds-copytext.js +2 -0
- package/components/pds-copytext.js.map +1 -0
- package/components/pds-divider.js +2 -0
- package/components/pds-divider.js.map +1 -0
- package/components/pds-icon.js +2 -0
- package/components/pds-icon.js.map +1 -0
- package/components/pds-icon2.js +38 -1
- package/components/pds-icon2.js.map +1 -0
- package/components/pds-image.js +2 -0
- package/components/pds-image.js.map +1 -0
- package/components/pds-input.js +2 -0
- package/components/pds-input.js.map +1 -0
- package/components/pds-label.js +2 -0
- package/components/pds-label.js.map +1 -0
- package/components/pds-link.js +3 -3
- package/components/pds-link.js.map +1 -0
- package/components/pds-progress.js +2 -0
- package/components/pds-progress.js.map +1 -0
- package/components/pds-radio.js +2 -0
- package/components/pds-radio.js.map +1 -0
- package/components/pds-row.js +2 -0
- package/components/pds-row.js.map +1 -0
- package/components/pds-sortable-item.js +2 -0
- package/components/pds-sortable-item.js.map +1 -0
- package/components/pds-sortable.js +2 -0
- package/components/pds-sortable.js.map +1 -0
- package/components/pds-switch.js +2 -0
- package/components/pds-switch.js.map +1 -0
- package/components/pds-tab.js +2 -0
- package/components/pds-tab.js.map +1 -0
- package/components/pds-table-body.js +2 -0
- package/components/pds-table-body.js.map +1 -0
- package/components/pds-table-cell.js +2 -0
- package/components/pds-table-cell.js.map +1 -0
- package/components/pds-table-cell2.js +2 -0
- package/components/pds-table-cell2.js.map +1 -0
- package/components/pds-table-head-cell.js +2 -0
- package/components/pds-table-head-cell.js.map +1 -0
- package/components/pds-table-head-cell2.js +2 -0
- package/components/pds-table-head-cell2.js.map +1 -0
- package/components/pds-table-head.js +2 -0
- package/components/pds-table-head.js.map +1 -0
- package/components/pds-table-row.js +2 -0
- package/components/pds-table-row.js.map +1 -0
- package/components/pds-table.js +2 -0
- package/components/pds-table.js.map +1 -0
- package/components/pds-tabpanel.js +2 -0
- package/components/pds-tabpanel.js.map +1 -0
- package/components/pds-tabs.js +2 -0
- package/components/pds-tabs.js.map +1 -0
- package/components/pds-textarea.js +2 -0
- package/components/pds-textarea.js.map +1 -0
- package/components/pds-tooltip.js +2 -0
- package/components/pds-tooltip.js.map +1 -0
- package/dist/cjs/app-globals-3a1e7e63.js +7 -0
- package/dist/cjs/app-globals-3a1e7e63.js.map +1 -0
- package/dist/cjs/index-3aab9699.js +16 -0
- package/dist/cjs/index-3aab9699.js.map +1 -0
- package/dist/cjs/{index-af2145ac.js → index-4cd639bf.js} +36 -27
- package/dist/cjs/index-4cd639bf.js.map +1 -0
- package/dist/cjs/index.cjs.js +2 -0
- package/dist/cjs/index.cjs.js.map +1 -0
- package/dist/cjs/loader.cjs.js +6 -2
- package/dist/cjs/loader.cjs.js.map +1 -0
- package/dist/cjs/pds-accordion.cjs.entry.js +5 -2
- package/dist/cjs/pds-accordion.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-avatar.cjs.entry.js +13 -7
- package/dist/cjs/pds-avatar.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-box.cjs.entry.js +3 -1
- package/dist/cjs/pds-box.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-button.cjs.entry.js +3 -1
- package/dist/cjs/pds-button.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-checkbox_2.cjs.entry.js +4 -2
- package/dist/cjs/pds-checkbox_2.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-chip.cjs.entry.js +3 -1
- package/dist/cjs/pds-chip.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-copytext.cjs.entry.js +3 -1
- package/dist/cjs/pds-copytext.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-divider.cjs.entry.js +3 -1
- package/dist/cjs/pds-divider.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-icon.cjs.entry.js +39 -2
- package/dist/cjs/pds-icon.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-image.cjs.entry.js +3 -1
- package/dist/cjs/pds-image.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-input.cjs.entry.js +4 -2
- package/dist/cjs/pds-input.cjs.entry.js.map +1 -0
- package/dist/cjs/{pds-label-81c1073a.js → pds-label-c988430d.js} +3 -1
- package/dist/cjs/pds-label-c988430d.js.map +1 -0
- package/dist/cjs/pds-link.cjs.entry.js +5 -5
- package/dist/cjs/pds-link.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-progress.cjs.entry.js +3 -1
- package/dist/cjs/pds-progress.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-radio.cjs.entry.js +4 -2
- package/dist/cjs/pds-radio.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-row.cjs.entry.js +3 -1
- package/dist/cjs/pds-row.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-sortable-item.cjs.entry.js +3 -1
- package/dist/cjs/pds-sortable-item.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-sortable.cjs.entry.js +3 -1
- package/dist/cjs/pds-sortable.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-switch.cjs.entry.js +4 -2
- package/dist/cjs/pds-switch.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-tab.cjs.entry.js +3 -1
- package/dist/cjs/pds-tab.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-table-body.cjs.entry.js +3 -1
- package/dist/cjs/pds-table-body.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-table-head-cell.cjs.entry.js +3 -1
- package/dist/cjs/pds-table-head-cell.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-table-head.cjs.entry.js +3 -1
- package/dist/cjs/pds-table-head.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-table-row.cjs.entry.js +3 -1
- package/dist/cjs/pds-table-row.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-table.cjs.entry.js +3 -1
- package/dist/cjs/pds-table.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-tabpanel.cjs.entry.js +3 -1
- package/dist/cjs/pds-tabpanel.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-tabs.cjs.entry.js +3 -1
- package/dist/cjs/pds-tabs.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-textarea.cjs.entry.js +4 -2
- package/dist/cjs/pds-textarea.cjs.entry.js.map +1 -0
- package/dist/cjs/pds-tooltip.cjs.entry.js +3 -1
- package/dist/cjs/pds-tooltip.cjs.entry.js.map +1 -0
- package/dist/cjs/pine-core.cjs.js +7 -3
- package/dist/cjs/pine-core.cjs.js.map +1 -0
- package/dist/collection/collection-manifest.json +1 -1
- package/dist/collection/components/_internal/pds-label/pds-label.js +1 -0
- package/dist/collection/components/_internal/pds-label/pds-label.js.map +1 -0
- package/dist/collection/components/pds-accordion/pds-accordion.js +3 -1
- package/dist/collection/components/pds-accordion/pds-accordion.js.map +1 -0
- package/dist/collection/components/pds-avatar/pds-avatar.js +14 -6
- package/dist/collection/components/pds-avatar/pds-avatar.js.map +1 -0
- package/dist/collection/components/pds-box/pds-box.js +1 -0
- package/dist/collection/components/pds-box/pds-box.js.map +1 -0
- package/dist/collection/components/pds-button/pds-button.js +1 -0
- package/dist/collection/components/pds-button/pds-button.js.map +1 -0
- package/dist/collection/components/pds-checkbox/checkbox-interface.js +1 -0
- package/dist/collection/components/pds-checkbox/checkbox-interface.js.map +1 -0
- package/dist/collection/components/pds-checkbox/pds-checkbox.js +1 -0
- package/dist/collection/components/pds-checkbox/pds-checkbox.js.map +1 -0
- package/dist/collection/components/pds-chip/pds-chip.js +1 -0
- package/dist/collection/components/pds-chip/pds-chip.js.map +1 -0
- package/dist/collection/components/pds-copytext/pds-copytext.js +1 -0
- package/dist/collection/components/pds-copytext/pds-copytext.js.map +1 -0
- package/dist/collection/components/pds-divider/pds-divider.js +1 -0
- package/dist/collection/components/pds-divider/pds-divider.js.map +1 -0
- package/dist/collection/components/pds-image/pds-image.js +1 -0
- package/dist/collection/components/pds-image/pds-image.js.map +1 -0
- package/dist/collection/components/pds-input/pds-input.js +1 -0
- package/dist/collection/components/pds-input/pds-input.js.map +1 -0
- package/dist/collection/components/pds-link/pds-link.js +1 -0
- package/dist/collection/components/pds-link/pds-link.js.map +1 -0
- package/dist/collection/components/pds-progress/pds-progress.js +1 -0
- package/dist/collection/components/pds-progress/pds-progress.js.map +1 -0
- package/dist/collection/components/pds-radio/pds-radio.js +1 -0
- package/dist/collection/components/pds-radio/pds-radio.js.map +1 -0
- package/dist/collection/components/pds-row/pds-row.js +1 -0
- package/dist/collection/components/pds-row/pds-row.js.map +1 -0
- package/dist/collection/components/pds-sortable/pds-sortable-item/pds-sortable-item.js +1 -0
- package/dist/collection/components/pds-sortable/pds-sortable-item/pds-sortable-item.js.map +1 -0
- package/dist/collection/components/pds-sortable/pds-sortable.js +1 -0
- package/dist/collection/components/pds-sortable/pds-sortable.js.map +1 -0
- package/dist/collection/components/pds-switch/pds-switch.js +1 -0
- package/dist/collection/components/pds-switch/pds-switch.js.map +1 -0
- package/dist/collection/components/pds-table/pds-table-body/pds-table-body.js +1 -0
- package/dist/collection/components/pds-table/pds-table-body/pds-table-body.js.map +1 -0
- package/dist/collection/components/pds-table/pds-table-cell/pds-table-cell.js +1 -0
- package/dist/collection/components/pds-table/pds-table-cell/pds-table-cell.js.map +1 -0
- package/dist/collection/components/pds-table/pds-table-head/pds-table-head.js +1 -0
- package/dist/collection/components/pds-table/pds-table-head/pds-table-head.js.map +1 -0
- package/dist/collection/components/pds-table/pds-table-head-cell/pds-table-head-cell.js +1 -0
- package/dist/collection/components/pds-table/pds-table-head-cell/pds-table-head-cell.js.map +1 -0
- package/dist/collection/components/pds-table/pds-table-row/pds-table-row.js +1 -0
- package/dist/collection/components/pds-table/pds-table-row/pds-table-row.js.map +1 -0
- package/dist/collection/components/pds-table/pds-table.js +1 -0
- package/dist/collection/components/pds-table/pds-table.js.map +1 -0
- package/dist/collection/components/pds-tabs/pds-tab/pds-tab.js +1 -0
- package/dist/collection/components/pds-tabs/pds-tab/pds-tab.js.map +1 -0
- package/dist/collection/components/pds-tabs/pds-tabpanel/pds-tabpanel.js +1 -0
- package/dist/collection/components/pds-tabs/pds-tabpanel/pds-tabpanel.js.map +1 -0
- package/dist/collection/components/pds-tabs/pds-tabs.js +1 -0
- package/dist/collection/components/pds-tabs/pds-tabs.js.map +1 -0
- package/dist/collection/components/pds-textarea/pds-textarea.js +1 -0
- package/dist/collection/components/pds-textarea/pds-textarea.js.map +1 -0
- package/dist/collection/components/pds-textarea/textarea-interface.js +1 -0
- package/dist/collection/components/pds-textarea/textarea-interface.js.map +1 -0
- package/dist/collection/components/pds-tooltip/pds-tooltip.js +1 -0
- package/dist/collection/components/pds-tooltip/pds-tooltip.js.map +1 -0
- package/dist/collection/global/pine-ui-global.js +1 -0
- package/dist/collection/global/pine-ui-global.js.map +1 -0
- package/dist/collection/index.js +1 -0
- package/dist/collection/index.js.map +1 -0
- package/dist/collection/stories/_helpers/index.js +1 -0
- package/dist/collection/stories/_helpers/index.js.map +1 -0
- package/dist/collection/utils/form.js +1 -0
- package/dist/collection/utils/form.js.map +1 -0
- package/dist/collection/utils/overlay.js +1 -0
- package/dist/collection/utils/overlay.js.map +1 -0
- package/dist/collection/utils/types.js +1 -0
- package/dist/collection/utils/types.js.map +1 -0
- package/dist/collection/utils/utils.js +1 -0
- package/dist/collection/utils/utils.js.map +1 -0
- package/dist/docs.json +18 -4
- package/dist/esm/app-globals-0f993ce5.js +5 -0
- package/dist/esm/app-globals-0f993ce5.js.map +1 -0
- package/dist/esm/{index-9312507f.js → index-09d6e504.js} +37 -27
- package/dist/esm/index-09d6e504.js.map +1 -0
- package/dist/esm/index-acbaa5e7.js +10 -0
- package/dist/esm/index-acbaa5e7.js.map +1 -0
- package/dist/esm/index.js +2 -0
- package/dist/esm/index.js.map +1 -0
- package/dist/esm/loader.js +7 -3
- package/dist/esm/loader.js.map +1 -0
- package/dist/esm/pds-accordion.entry.js +5 -2
- package/dist/esm/pds-accordion.entry.js.map +1 -0
- package/dist/esm/pds-avatar.entry.js +13 -7
- package/dist/esm/pds-avatar.entry.js.map +1 -0
- package/dist/esm/pds-box.entry.js +3 -1
- package/dist/esm/pds-box.entry.js.map +1 -0
- package/dist/esm/pds-button.entry.js +3 -1
- package/dist/esm/pds-button.entry.js.map +1 -0
- package/dist/esm/pds-checkbox_2.entry.js +4 -2
- package/dist/esm/pds-checkbox_2.entry.js.map +1 -0
- package/dist/esm/pds-chip.entry.js +3 -1
- package/dist/esm/pds-chip.entry.js.map +1 -0
- package/dist/esm/pds-copytext.entry.js +3 -1
- package/dist/esm/pds-copytext.entry.js.map +1 -0
- package/dist/esm/pds-divider.entry.js +3 -1
- package/dist/esm/pds-divider.entry.js.map +1 -0
- package/dist/esm/pds-icon.entry.js +38 -1
- package/dist/esm/pds-icon.entry.js.map +1 -0
- package/dist/esm/pds-image.entry.js +3 -1
- package/dist/esm/pds-image.entry.js.map +1 -0
- package/dist/esm/pds-input.entry.js +4 -2
- package/dist/esm/pds-input.entry.js.map +1 -0
- package/dist/esm/{pds-label-d33eab3b.js → pds-label-ea621e18.js} +3 -1
- package/dist/esm/pds-label-ea621e18.js.map +1 -0
- package/dist/esm/pds-link.entry.js +4 -4
- package/dist/esm/pds-link.entry.js.map +1 -0
- package/dist/esm/pds-progress.entry.js +3 -1
- package/dist/esm/pds-progress.entry.js.map +1 -0
- package/dist/esm/pds-radio.entry.js +4 -2
- package/dist/esm/pds-radio.entry.js.map +1 -0
- package/dist/esm/pds-row.entry.js +3 -1
- package/dist/esm/pds-row.entry.js.map +1 -0
- package/dist/esm/pds-sortable-item.entry.js +3 -1
- package/dist/esm/pds-sortable-item.entry.js.map +1 -0
- package/dist/esm/pds-sortable.entry.js +3 -1
- package/dist/esm/pds-sortable.entry.js.map +1 -0
- package/dist/esm/pds-switch.entry.js +4 -2
- package/dist/esm/pds-switch.entry.js.map +1 -0
- package/dist/esm/pds-tab.entry.js +3 -1
- package/dist/esm/pds-tab.entry.js.map +1 -0
- package/dist/esm/pds-table-body.entry.js +3 -1
- package/dist/esm/pds-table-body.entry.js.map +1 -0
- package/dist/esm/pds-table-head-cell.entry.js +3 -1
- package/dist/esm/pds-table-head-cell.entry.js.map +1 -0
- package/dist/esm/pds-table-head.entry.js +3 -1
- package/dist/esm/pds-table-head.entry.js.map +1 -0
- package/dist/esm/pds-table-row.entry.js +3 -1
- package/dist/esm/pds-table-row.entry.js.map +1 -0
- package/dist/esm/pds-table.entry.js +3 -1
- package/dist/esm/pds-table.entry.js.map +1 -0
- package/dist/esm/pds-tabpanel.entry.js +3 -1
- package/dist/esm/pds-tabpanel.entry.js.map +1 -0
- package/dist/esm/pds-tabs.entry.js +3 -1
- package/dist/esm/pds-tabs.entry.js.map +1 -0
- package/dist/esm/pds-textarea.entry.js +4 -2
- package/dist/esm/pds-textarea.entry.js.map +1 -0
- package/dist/esm/pds-tooltip.entry.js +3 -1
- package/dist/esm/pds-tooltip.entry.js.map +1 -0
- package/dist/esm/pine-core.js +8 -4
- package/dist/esm/pine-core.js.map +1 -0
- package/dist/esm-es5/app-globals-0f993ce5.js +2 -0
- package/dist/esm-es5/app-globals-0f993ce5.js.map +1 -0
- package/dist/esm-es5/index-09d6e504.js +3 -0
- package/dist/esm-es5/index-09d6e504.js.map +1 -0
- package/dist/esm-es5/index-acbaa5e7.js +2 -0
- package/dist/esm-es5/index-acbaa5e7.js.map +1 -0
- package/dist/esm-es5/index.js +2 -0
- package/dist/esm-es5/index.js.map +1 -0
- package/dist/esm-es5/loader.js +2 -1
- package/dist/esm-es5/loader.js.map +1 -0
- package/dist/esm-es5/pds-accordion.entry.js +2 -1
- package/dist/esm-es5/pds-accordion.entry.js.map +1 -0
- package/dist/esm-es5/pds-avatar.entry.js +2 -1
- package/dist/esm-es5/pds-avatar.entry.js.map +1 -0
- package/dist/esm-es5/pds-box.entry.js +2 -1
- package/dist/esm-es5/pds-box.entry.js.map +1 -0
- package/dist/esm-es5/pds-button.entry.js +2 -1
- package/dist/esm-es5/pds-button.entry.js.map +1 -0
- package/dist/esm-es5/pds-checkbox_2.entry.js +2 -1
- package/dist/esm-es5/pds-checkbox_2.entry.js.map +1 -0
- package/dist/esm-es5/pds-chip.entry.js +2 -1
- package/dist/esm-es5/pds-chip.entry.js.map +1 -0
- package/dist/esm-es5/pds-copytext.entry.js +2 -1
- package/dist/esm-es5/pds-copytext.entry.js.map +1 -0
- package/dist/esm-es5/pds-divider.entry.js +2 -1
- package/dist/esm-es5/pds-divider.entry.js.map +1 -0
- package/dist/esm-es5/pds-icon.entry.js +2 -1
- package/dist/esm-es5/pds-icon.entry.js.map +1 -0
- package/dist/esm-es5/pds-image.entry.js +2 -1
- package/dist/esm-es5/pds-image.entry.js.map +1 -0
- package/dist/esm-es5/pds-input.entry.js +2 -1
- package/dist/esm-es5/pds-input.entry.js.map +1 -0
- package/dist/esm-es5/{pds-label-d33eab3b.js → pds-label-ea621e18.js} +2 -1
- package/dist/esm-es5/pds-label-ea621e18.js.map +1 -0
- package/dist/esm-es5/pds-link.entry.js +2 -1
- package/dist/esm-es5/pds-link.entry.js.map +1 -0
- package/dist/esm-es5/pds-progress.entry.js +2 -1
- package/dist/esm-es5/pds-progress.entry.js.map +1 -0
- package/dist/esm-es5/pds-radio.entry.js +2 -1
- package/dist/esm-es5/pds-radio.entry.js.map +1 -0
- package/dist/esm-es5/pds-row.entry.js +2 -1
- package/dist/esm-es5/pds-row.entry.js.map +1 -0
- package/dist/esm-es5/pds-sortable-item.entry.js +2 -1
- package/dist/esm-es5/pds-sortable-item.entry.js.map +1 -0
- package/dist/esm-es5/pds-sortable.entry.js +3 -2
- package/dist/esm-es5/pds-sortable.entry.js.map +1 -0
- package/dist/esm-es5/pds-switch.entry.js +2 -1
- package/dist/esm-es5/pds-switch.entry.js.map +1 -0
- package/dist/esm-es5/pds-tab.entry.js +2 -1
- package/dist/esm-es5/pds-tab.entry.js.map +1 -0
- package/dist/esm-es5/pds-table-body.entry.js +2 -1
- package/dist/esm-es5/pds-table-body.entry.js.map +1 -0
- package/dist/esm-es5/pds-table-head-cell.entry.js +2 -1
- package/dist/esm-es5/pds-table-head-cell.entry.js.map +1 -0
- package/dist/esm-es5/pds-table-head.entry.js +2 -1
- package/dist/esm-es5/pds-table-head.entry.js.map +1 -0
- package/dist/esm-es5/pds-table-row.entry.js +2 -1
- package/dist/esm-es5/pds-table-row.entry.js.map +1 -0
- package/dist/esm-es5/pds-table.entry.js +2 -1
- package/dist/esm-es5/pds-table.entry.js.map +1 -0
- package/dist/esm-es5/pds-tabpanel.entry.js +2 -1
- package/dist/esm-es5/pds-tabpanel.entry.js.map +1 -0
- package/dist/esm-es5/pds-tabs.entry.js +2 -1
- package/dist/esm-es5/pds-tabs.entry.js.map +1 -0
- package/dist/esm-es5/pds-textarea.entry.js +2 -1
- package/dist/esm-es5/pds-textarea.entry.js.map +1 -0
- package/dist/esm-es5/pds-tooltip.entry.js +2 -1
- package/dist/esm-es5/pds-tooltip.entry.js.map +1 -0
- package/dist/esm-es5/pine-core.js +2 -1
- package/dist/esm-es5/pine-core.js.map +1 -0
- package/dist/pine-core/index.esm.js +2 -0
- package/dist/pine-core/index.esm.js.map +1 -0
- package/dist/pine-core/{p-6d1f5eb6.system.entry.js → p-0a62887c.system.entry.js} +2 -1
- package/dist/pine-core/p-0a62887c.system.entry.js.map +1 -0
- package/dist/pine-core/p-0b0d7886.system.js +2 -0
- package/dist/pine-core/p-0b0d7886.system.js.map +1 -0
- package/dist/pine-core/{p-bd051dc8.system.entry.js → p-0bcc6945.system.entry.js} +2 -1
- package/dist/pine-core/p-0bcc6945.system.entry.js.map +1 -0
- package/dist/pine-core/{p-c39a7480.system.entry.js → p-11b9aebc.system.entry.js} +2 -1
- package/dist/pine-core/p-11b9aebc.system.entry.js.map +1 -0
- package/dist/pine-core/p-136ac055.system.js +2 -0
- package/dist/pine-core/p-136ac055.system.js.map +1 -0
- package/dist/pine-core/p-151aafa9.entry.js +2 -0
- package/dist/pine-core/p-151aafa9.entry.js.map +1 -0
- package/dist/pine-core/p-17ba6ff2.js +2 -0
- package/dist/pine-core/p-17ba6ff2.js.map +1 -0
- package/dist/pine-core/{p-8bba9f6b.system.entry.js → p-1e8a1f31.system.entry.js} +2 -1
- package/dist/pine-core/p-1e8a1f31.system.entry.js.map +1 -0
- package/dist/pine-core/{p-b3abea50.system.entry.js → p-20e8c2e6.system.entry.js} +2 -1
- package/dist/pine-core/p-20e8c2e6.system.entry.js.map +1 -0
- package/dist/pine-core/p-24f4102e.system.entry.js +2 -0
- package/dist/pine-core/p-24f4102e.system.entry.js.map +1 -0
- package/dist/pine-core/{p-98cc1e47.system.entry.js → p-25cf60f1.system.entry.js} +2 -1
- package/dist/pine-core/p-25cf60f1.system.entry.js.map +1 -0
- package/dist/pine-core/p-280eca34.system.entry.js +2 -0
- package/dist/pine-core/p-280eca34.system.entry.js.map +1 -0
- package/dist/pine-core/{p-50e04f66.system.entry.js → p-2dd4eacc.system.entry.js} +2 -1
- package/dist/pine-core/p-2dd4eacc.system.entry.js.map +1 -0
- package/dist/pine-core/p-2e531f68.entry.js +2 -0
- package/dist/pine-core/p-2e531f68.entry.js.map +1 -0
- package/dist/pine-core/{p-5812cf50.system.entry.js → p-315a1809.system.entry.js} +2 -1
- package/dist/pine-core/p-315a1809.system.entry.js.map +1 -0
- package/dist/pine-core/{p-363392ea.system.entry.js → p-341eb1ee.system.entry.js} +2 -1
- package/dist/pine-core/p-341eb1ee.system.entry.js.map +1 -0
- package/dist/pine-core/p-3b3f8185.entry.js +2 -0
- package/dist/pine-core/p-3b3f8185.entry.js.map +1 -0
- package/dist/pine-core/{p-ceb83df8.system.entry.js → p-41ca8678.system.entry.js} +2 -1
- package/dist/pine-core/p-41ca8678.system.entry.js.map +1 -0
- package/dist/pine-core/p-45160e15.entry.js +2 -0
- package/dist/pine-core/p-45160e15.entry.js.map +1 -0
- package/dist/pine-core/p-485d225c.entry.js +2 -0
- package/dist/pine-core/p-485d225c.entry.js.map +1 -0
- package/dist/pine-core/{p-207a1db7.system.entry.js → p-48669610.system.entry.js} +2 -1
- package/dist/pine-core/p-48669610.system.entry.js.map +1 -0
- package/dist/pine-core/{p-df4a1834.system.entry.js → p-4b3e96c0.system.entry.js} +2 -1
- package/dist/pine-core/p-4b3e96c0.system.entry.js.map +1 -0
- package/dist/pine-core/p-4b7083de.entry.js +2 -0
- package/dist/pine-core/p-4b7083de.entry.js.map +1 -0
- package/dist/pine-core/{p-0cdd6574.system.js → p-4da2e899.system.js} +2 -1
- package/dist/pine-core/p-4da2e899.system.js.map +1 -0
- package/dist/pine-core/p-50ea2036.system.js +2 -1
- package/dist/pine-core/p-50ea2036.system.js.map +1 -0
- package/dist/pine-core/p-56ba5cbf.system.js +2 -0
- package/dist/pine-core/p-56ba5cbf.system.js.map +1 -0
- package/dist/pine-core/p-57a0a6c5.entry.js +2 -0
- package/dist/pine-core/p-57a0a6c5.entry.js.map +1 -0
- package/dist/pine-core/p-671527a0.entry.js +2 -0
- package/dist/pine-core/p-671527a0.entry.js.map +1 -0
- package/dist/pine-core/p-7248b927.entry.js +2 -0
- package/dist/pine-core/p-7248b927.entry.js.map +1 -0
- package/dist/pine-core/p-7275ec39.entry.js +2 -0
- package/dist/pine-core/p-7275ec39.entry.js.map +1 -0
- package/dist/pine-core/p-76dd047d.entry.js +8 -0
- package/dist/pine-core/p-76dd047d.entry.js.map +1 -0
- package/dist/pine-core/{p-3aafe83d.system.entry.js → p-770e1547.system.entry.js} +2 -1
- package/dist/pine-core/p-770e1547.system.entry.js.map +1 -0
- package/dist/pine-core/{p-cd1bb310.system.entry.js → p-7c8acdb3.system.entry.js} +2 -1
- package/dist/pine-core/p-7c8acdb3.system.entry.js.map +1 -0
- package/dist/pine-core/p-7cd9020d.entry.js +2 -0
- package/dist/pine-core/p-7cd9020d.entry.js.map +1 -0
- package/dist/pine-core/{p-03ff01dc.entry.js → p-87b363c8.entry.js} +2 -1
- package/dist/pine-core/p-87b363c8.entry.js.map +1 -0
- package/dist/pine-core/p-87cc56ab.entry.js +2 -0
- package/dist/pine-core/p-87cc56ab.entry.js.map +1 -0
- package/dist/pine-core/p-8cc2e2f8.entry.js +2 -0
- package/dist/pine-core/p-8cc2e2f8.entry.js.map +1 -0
- package/dist/pine-core/p-95958653.entry.js +2 -0
- package/dist/pine-core/p-95958653.entry.js.map +1 -0
- package/dist/pine-core/{p-98740980.system.entry.js → p-9fd21396.system.entry.js} +2 -1
- package/dist/pine-core/p-9fd21396.system.entry.js.map +1 -0
- package/dist/pine-core/{p-0c443b29.system.entry.js → p-a219ad37.system.entry.js} +2 -1
- package/dist/pine-core/p-a219ad37.system.entry.js.map +1 -0
- package/dist/pine-core/p-a49d36be.entry.js +2 -0
- package/dist/pine-core/p-a49d36be.entry.js.map +1 -0
- package/dist/pine-core/p-aa285167.entry.js +2 -0
- package/dist/pine-core/p-aa285167.entry.js.map +1 -0
- package/dist/pine-core/p-b4226e23.system.entry.js +2 -0
- package/dist/pine-core/p-b4226e23.system.entry.js.map +1 -0
- package/dist/pine-core/p-b5b5ce83.js +3 -0
- package/dist/pine-core/p-b5b5ce83.js.map +1 -0
- package/dist/pine-core/{p-aa9f7889.system.entry.js → p-bb0f674a.system.entry.js} +2 -1
- package/dist/pine-core/p-bb0f674a.system.entry.js.map +1 -0
- package/dist/pine-core/{p-fe9b0b4b.system.entry.js → p-be64d326.system.entry.js} +2 -1
- package/dist/pine-core/p-be64d326.system.entry.js.map +1 -0
- package/dist/pine-core/p-c15b86e9.js +2 -0
- package/dist/pine-core/p-c15b86e9.js.map +1 -0
- package/dist/pine-core/p-c1c8ded7.entry.js +2 -0
- package/dist/pine-core/p-c1c8ded7.entry.js.map +1 -0
- package/dist/pine-core/p-c29d23a4.entry.js +2 -0
- package/dist/pine-core/p-c29d23a4.entry.js.map +1 -0
- package/dist/pine-core/p-c563d4e7.system.js +3 -0
- package/dist/pine-core/p-c563d4e7.system.js.map +1 -0
- package/dist/pine-core/{p-bf49c9da.system.entry.js → p-c5ada91d.system.entry.js} +2 -1
- package/dist/pine-core/p-c5ada91d.system.entry.js.map +1 -0
- package/dist/pine-core/p-c68421c3.entry.js +2 -0
- package/dist/pine-core/p-c68421c3.entry.js.map +1 -0
- package/dist/pine-core/p-c834304b.entry.js +2 -0
- package/dist/pine-core/p-c834304b.entry.js.map +1 -0
- package/dist/pine-core/{p-18d461ea.system.entry.js → p-c88139ec.system.entry.js} +2 -1
- package/dist/pine-core/p-c88139ec.system.entry.js.map +1 -0
- package/dist/pine-core/p-cbecf6ee.entry.js +2 -0
- package/dist/pine-core/p-cbecf6ee.entry.js.map +1 -0
- package/dist/pine-core/p-cfa7ba93.entry.js +2 -0
- package/dist/pine-core/p-cfa7ba93.entry.js.map +1 -0
- package/dist/pine-core/{p-46a4a8f0.system.entry.js → p-daba2a44.system.entry.js} +2 -1
- package/dist/pine-core/p-daba2a44.system.entry.js.map +1 -0
- package/dist/pine-core/p-e1255160.js +2 -0
- package/dist/pine-core/p-e1255160.js.map +1 -0
- package/dist/pine-core/p-e411498b.entry.js +2 -0
- package/dist/pine-core/p-e411498b.entry.js.map +1 -0
- package/dist/pine-core/{p-282475be.system.entry.js → p-e8b02bb3.system.entry.js} +2 -1
- package/dist/pine-core/p-e8b02bb3.system.entry.js.map +1 -0
- package/dist/pine-core/{p-6569a81a.system.entry.js → p-ea131385.system.entry.js} +3 -2
- package/dist/pine-core/p-ea131385.system.entry.js.map +1 -0
- package/dist/pine-core/p-eeaa22fa.entry.js +2 -0
- package/dist/pine-core/p-eeaa22fa.entry.js.map +1 -0
- package/dist/pine-core/p-f32db55d.system.entry.js +2 -0
- package/dist/pine-core/p-f32db55d.system.entry.js.map +1 -0
- package/dist/pine-core/p-f544d96d.entry.js +2 -0
- package/dist/pine-core/p-f544d96d.entry.js.map +1 -0
- package/dist/pine-core/p-fe4fb39f.entry.js +2 -0
- package/dist/pine-core/p-fe4fb39f.entry.js.map +1 -0
- package/dist/pine-core/{p-2306d119.system.entry.js → p-fe79bcc0.system.entry.js} +2 -1
- package/dist/pine-core/p-fe79bcc0.system.entry.js.map +1 -0
- package/dist/pine-core/pine-core.esm.js +2 -1
- package/dist/pine-core/pine-core.esm.js.map +1 -0
- package/dist/pine-core/pine-core.js +1 -1
- package/dist/pine-core/svg/advanced.svg +1 -0
- package/dist/pine-core/svg/assessment.svg +1 -1
- package/dist/pine-core/svg/caret-up.svg +1 -1
- package/dist/pine-core/svg/cursor-pointer.svg +1 -0
- package/dist/pine-core/svg/cursor.svg +1 -0
- package/dist/pine-core/svg/custom-field.svg +1 -1
- package/dist/pine-core/svg/download.svg +1 -1
- package/dist/pine-core/svg/drawer-collapse.svg +1 -0
- package/dist/pine-core/svg/drawer-expand.svg +1 -0
- package/dist/pine-core/svg/duplicate.svg +1 -1
- package/dist/pine-core/svg/form.svg +1 -1
- package/dist/pine-core/svg/launch.svg +1 -1
- package/dist/pine-core/svg/left-small.svg +1 -1
- package/dist/pine-core/svg/logo-klarna.svg +1 -0
- package/dist/pine-core/svg/mail-open.svg +1 -0
- package/dist/pine-core/svg/microphone-off.svg +1 -1
- package/dist/pine-core/svg/move-left.svg +1 -1
- package/dist/pine-core/svg/newsletter-2.svg +1 -0
- package/dist/pine-core/svg/pause-circle.svg +1 -1
- package/dist/pine-core/svg/phone-toolbar-filled.svg +1 -0
- package/dist/pine-core/svg/play.svg +1 -1
- package/dist/pine-core/svg/plug.svg +1 -1
- package/dist/pine-core/svg/preview-off.svg +1 -1
- package/dist/pine-core/svg/preview-on.svg +1 -1
- package/dist/pine-core/svg/refresh.svg +1 -1
- package/dist/pine-core/svg/remove.svg +1 -1
- package/dist/pine-core/svg/subscriptions.svg +1 -1
- package/dist/pine-core/svg/sync.svg +1 -1
- package/dist/pine-core/svg/tablet-landscape.svg +1 -1
- package/dist/pine-core/svg/wrench.svg +1 -1
- package/dist/types/components/pds-avatar/pds-avatar.d.ts +4 -0
- package/hydrate/index.d.ts +1 -1
- package/hydrate/index.js +200 -55
- package/package.json +3 -3
- package/dist/esm-es5/index-9312507f.js +0 -2
- package/dist/pine-core/p-0375bc6f.entry.js +0 -1
- package/dist/pine-core/p-120f73f1.entry.js +0 -1
- package/dist/pine-core/p-252df6c4.entry.js +0 -1
- package/dist/pine-core/p-3311eba2.entry.js +0 -1
- package/dist/pine-core/p-3bf307ef.system.js +0 -1
- package/dist/pine-core/p-3cfc640c.entry.js +0 -1
- package/dist/pine-core/p-539ecb64.system.entry.js +0 -1
- package/dist/pine-core/p-53b584c2.entry.js +0 -1
- package/dist/pine-core/p-56245d76.entry.js +0 -1
- package/dist/pine-core/p-57935c61.entry.js +0 -1
- package/dist/pine-core/p-608e5e25.entry.js +0 -1
- package/dist/pine-core/p-64d32a1e.entry.js +0 -1
- package/dist/pine-core/p-685cd653.entry.js +0 -1
- package/dist/pine-core/p-6c1ea462.entry.js +0 -1
- package/dist/pine-core/p-6d7fcc50.entry.js +0 -1
- package/dist/pine-core/p-7437c53e.entry.js +0 -1
- package/dist/pine-core/p-822517e7.entry.js +0 -1
- package/dist/pine-core/p-8248c25e.system.js +0 -2
- package/dist/pine-core/p-8d320cf0.system.entry.js +0 -1
- package/dist/pine-core/p-9c4510a6.entry.js +0 -1
- package/dist/pine-core/p-9f10f204.entry.js +0 -7
- package/dist/pine-core/p-a0b88908.entry.js +0 -1
- package/dist/pine-core/p-a4d4fbbb.js +0 -1
- package/dist/pine-core/p-a939ca49.entry.js +0 -1
- package/dist/pine-core/p-a954bb71.js +0 -2
- package/dist/pine-core/p-b5e51060.entry.js +0 -1
- package/dist/pine-core/p-bad719c5.entry.js +0 -1
- package/dist/pine-core/p-bfcd70aa.entry.js +0 -1
- package/dist/pine-core/p-c7553aef.system.entry.js +0 -1
- package/dist/pine-core/p-ca96db90.entry.js +0 -1
- package/dist/pine-core/p-d5ec4117.system.entry.js +0 -1
- package/dist/pine-core/p-d7713117.entry.js +0 -1
- package/dist/pine-core/p-dfdd694f.entry.js +0 -1
- package/dist/pine-core/p-e1648d36.entry.js +0 -1
- package/dist/pine-core/p-fee872ab.entry.js +0 -1
|
@@ -1 +1,2 @@
|
|
|
1
|
-
System.register(["./p-
|
|
1
|
+
System.register(["./p-c563d4e7.system.js"],(function(n){"use strict";var i,a,r,e;return{setters:[function(n){i=n.r;a=n.c;r=n.h;e=n.H}],execute:function(){var o=":host{--background-danger:var(--pine-color-red-100);--background-danger-dot:var(--pine-color-red-300);--background-danger-interactive:var(--pine-color-red-200);--background-neutral:var(--pine-color-neutral-grey-300);--background-neutral-dot:var(--pine-color-neutral-charcoal-100);--background-neutral-interactive:var(--pine-color-neutral-grey-400);--background-info:var(--pine-color-primary-100);--background-info-dot:var(--pine-color-primary-300);--background-info-interactive:var(--pine-color-primary-200);--background-accent:var(--pine-color-purple-100);--background-accent-dot:var(--pine-color-purple-300);--background-accent-interactive:var(--pine-color-purple-200);--background-success:var(--pine-color-green-100);--background-success-dot:var(--pine-color-green-300);--background-success-interactive:var(--pine-color-green-200);--background-warning:var(--pine-color-yellow-100);--background-warning-dot:var(--pine-color-yellow-300);--background-warning-interactive:var(--pine-color-yellow-200);--box-shadow-focus:0 0 0 4px var(--pine-color-primary-200);--border-radius:var(--pine-border-radius-lg);--font-size:var(--pine-font-size-body-sm);--font-size-lg:var(--pine-font-size-body);--font-weight:var(--pine-font-weight-medium);--line-height:var(--pine-line-height-sm);--padding-block-sm:calc(var(--pine-spacing-xxs) / 2);--padding-block:var(--pine-spacing-xxs);--padding-block-lg:6px;--padding-inline-sm:calc(var(--pine-spacing-xxs) / 2);--padding-inline:10px;--padding-inline-lg:calc(var(--pine-spacing-md) / 2);--padding-inline-xl:14px;--margin-block-xs:calc(var(--pine-spacing-xxs) / 2);--margin-inline-sm:calc(var(--pine-spacing-xs) / 2);--margin-inline-xs:calc(var(--pine-spacing-xxs) / 2);--margin-inline:4px;--margin-inline-lg:var(--pine-spacing-xs);--margin-inline-xl:calc(var(--pine-spacing-md) / 2);--dot-size:4px;--close-size:10px;--close-size-lg:24px;-ms-flex-align:center;align-items:center;border-radius:var(--border-radius);display:-ms-inline-flexbox;display:inline-flex;font-size:var(--font-size);font-weight:var(--font-weight);line-height:var(--line-height);padding-block:var(--padding-block-sm);padding-inline:var(--padding-inline)}:host(.pds-chip--accent){background:var(--background-accent)}:host(.pds-chip--accent) .pds-chip__dot{background:var(--background-accent-dot)}:host(.pds-chip--accent) .pds-chip__close:hover{background:var(--background-accent-interactive)}:host(.pds-chip--accent.pds-chip--dropdown:hover){background:var(--background-accent-interactive)}:host(.pds-chip--danger){background:var(--background-danger)}:host(.pds-chip--danger) .pds-chip__dot{background:var(--background-danger-dot)}:host(.pds-chip--danger) .pds-chip__close:hover{background:var(--background-danger-interactive)}:host(.pds-chip--danger.pds-chip--dropdown:hover){background:var(--background-danger-interactive)}:host(.pds-chip--info){background:var(--background-info)}:host(.pds-chip--info) .pds-chip__dot{background:var(--background-info-dot)}:host(.pds-chip--info) .pds-chip__close:hover{background:var(--background-info-interactive)}:host(.pds-chip--info.pds-chip--dropdown:hover){background:var(--background-info-interactive)}:host(.pds-chip--neutral){background:var(--background-neutral)}:host(.pds-chip--neutral) .pds-chip__dot{background:var(--background-neutral-dot)}:host(.pds-chip--neutral) .pds-chip__close:hover{background:var(--background-neutral-interactive)}:host(.pds-chip--neutral.pds-chip--dropdown:hover){background:var(--background-neutral-interactive)}:host(.pds-chip--success){background:var(--background-success)}:host(.pds-chip--success) .pds-chip__dot{background:var(--background-success-dot)}:host(.pds-chip--success) .pds-chip__close:hover{background:var(--background-success-interactive)}:host(.pds-chip--success.pds-chip--dropdown:hover){background:var(--background-success-interactive)}:host(.pds-chip--warning){background:var(--background-warning)}:host(.pds-chip--warning) .pds-chip__dot{background:var(--background-warning-dot)}:host(.pds-chip--warning) .pds-chip__close:hover{background:var(--background-warning-interactive)}:host(.pds-chip--warning.pds-chip--dropdown:hover){background:var(--background-warning-interactive)}.pds-chip__dot{border:1px solid transparent;border-radius:50%;display:inline-block;height:var(--dot-size);-webkit-margin-after:var(--margin-block-xs);margin-block-end:var(--margin-block-xs);-webkit-margin-end:var(--margin-inline-sm);margin-inline-end:var(--margin-inline-sm);width:var(--dot-size)}:host(.pds-chip--dropdown){padding:0}:host(.pds-chip--dropdown) .pds-chip__dot{-webkit-margin-after:1px;margin-block-end:1px;-webkit-margin-before:var(--margin-block-xs);margin-block-start:var(--margin-block-xs)}.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-family:inherit;font-size:var(--font-size);font-weight:var(--font-weight);line-height:var(--line-height);padding-block:var(--padding-block-sm);padding-inline:var(--padding-inline)}.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(--margin-inline-xs) * -1);margin-inline-end:calc(var(--margin-inline-xs) * -1);-webkit-margin-start:var(--margin-inline);margin-inline-start:var(--margin-inline)}:host(.pds-chip--tag){padding-block:var(--padding-block-sm)}.pds-chip__close{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;border-radius:50%;height:var(--close-size);-webkit-margin-end:calc(var(--margin-inline-lg) * -1);margin-inline-end:calc(var(--margin-inline-lg) * -1);-webkit-margin-start:var(--margin-inline);margin-inline-start:var(--margin-inline);padding:var(--close-size);position:relative;width:var(--close-size)}.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(--padding-block-lg);padding-inline:var(--padding-inline-xl)}:host(.pds-chip--large):host(.pds-chip--dropdown){padding-block:var(--padding-block);padding-inline:var(--padding-inline-sm)}: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(--padding-inline-lg)}:host(.pds-chip--large) .pds-chip__close{height:var(--close-size-lg);-webkit-margin-end:calc(var(--margin-inline-xl) * -1);margin-inline-end:calc(var(--margin-inline-xl) * -1);width:var(--close-size-lg)}:host(.pds-chip--large):host(.pds-chip--tag){padding-block:var(--padding-block)}";var c=o;var d=n("pds_chip",function(){function n(n){var r=this;i(this,n);this.pdsTagCloseClick=a(this,"pdsTagCloseClick",7);this.handleCloseClick=function(){r.pdsTagCloseClick.emit()};this.componentId=undefined;this.sentiment="neutral";this.dot=false;this.label=undefined;this.large=false;this.variant="text"}n.prototype.classNames=function(){var n=["pds-chip"];if(this.large){n.push("pds-chip--large")}if(this.variant){n.push("pds-chip--"+this.variant)}if(this.sentiment){n.push("pds-chip--"+this.sentiment)}return n.join(" ")};n.prototype.setChipContent=function(){var n=this.variant==="dropdown";var i=n?r("button",{class:"pds-chip__button",type:"button"},this.dot&&r("i",{class:"pds-chip__dot","aria-hidden":"true"}),this.label,r("pds-icon",{name:"down-small",size:"12px","aria-hidden":"true"})):r("span",{class:"pds-chip__label"},this.dot&&r("i",{class:"pds-chip__dot","aria-hidden":"true"}),this.label);return i};n.prototype.render=function(){return r(e,{key:"224fcbae613eb1a7a8ab5661582e06612aa3c491",class:this.classNames(),id:this.componentId},this.setChipContent(),this.variant==="tag"&&r("button",{class:"pds-chip__close",type:"button",onClick:this.handleCloseClick,"aria-label":"Remove"},r("pds-icon",{name:"remove",size:"12px"})))};return n}());d.style=c}}}));
|
|
2
|
+
//# sourceMappingURL=p-1e8a1f31.system.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["pdsChipCss","PdsChipStyle0","PdsChip","exports","this","handleCloseClick","_this","pdsTagCloseClick","emit","class_1","prototype","classNames","large","push","variant","sentiment","join","setChipContent","isDropdown","chipContent","h","class","type","dot","label","name","size","render","Host","key","id","componentId","onClick"],"sources":["src/components/pds-chip/pds-chip.scss?tag=pds-chip&encapsulation=shadow","src/components/pds-chip/pds-chip.tsx"],"sourcesContent":[":host {\n --background-danger: var(--pine-color-red-100);\n --background-danger-dot: var(--pine-color-red-300);\n --background-danger-interactive: var(--pine-color-red-200);\n --background-neutral: var(--pine-color-neutral-grey-300);\n --background-neutral-dot: var(--pine-color-neutral-charcoal-100);\n --background-neutral-interactive: var(--pine-color-neutral-grey-400);\n --background-info: var(--pine-color-primary-100);\n --background-info-dot: var(--pine-color-primary-300);\n --background-info-interactive: var(--pine-color-primary-200);\n --background-accent: var(--pine-color-purple-100);\n --background-accent-dot: var(--pine-color-purple-300);\n --background-accent-interactive: var(--pine-color-purple-200);\n --background-success: var(--pine-color-green-100);\n --background-success-dot: var(--pine-color-green-300);\n --background-success-interactive: var(--pine-color-green-200);\n --background-warning: var(--pine-color-yellow-100);\n --background-warning-dot: var(--pine-color-yellow-300);\n --background-warning-interactive: var(--pine-color-yellow-200);\n --box-shadow-focus: 0 0 0 4px var(--pine-color-primary-200);\n\n --border-radius: var(--pine-border-radius-lg);\n --font-size: var(--pine-font-size-body-sm);\n --font-size-lg: var(--pine-font-size-body);\n --font-weight: var(--pine-font-weight-medium);\n --line-height: var(--pine-line-height-sm);\n --padding-block-sm: calc(var(--pine-spacing-xxs) / 2);\n --padding-block: var(--pine-spacing-xxs);\n --padding-block-lg: 6px;\n --padding-inline-sm: calc(var(--pine-spacing-xxs) / 2);\n --padding-inline: 10px;\n --padding-inline-lg: calc(var(--pine-spacing-md) / 2);\n --padding-inline-xl: 14px;\n --margin-block-xs: calc(var(--pine-spacing-xxs) / 2);\n --margin-inline-sm: calc(var(--pine-spacing-xs) / 2);\n --margin-inline-xs: calc(var(--pine-spacing-xxs) / 2);\n --margin-inline: 4px;\n --margin-inline-lg: var(--pine-spacing-xs);\n --margin-inline-xl: calc(var(--pine-spacing-md) / 2);\n\n --dot-size: 4px;\n --close-size: 10px;\n --close-size-lg: 24px;\n\n align-items: center;\n border-radius: var(--border-radius);\n display: inline-flex;\n font-size: var(--font-size);\n font-weight: var(--font-weight);\n line-height: var(--line-height);\n padding-block: var(--padding-block-sm);\n padding-inline: var(--padding-inline);\n}\n\n$pds-chip-sentiment: (\n accent: var(--background-accent),\n danger: var(--background-danger),\n info: var(--background-info),\n neutral: var(--background-neutral),\n success: var(--background-success),\n warning: var(--background-warning),\n);\n\n$pds-chip-sentiment-dots: (\n accent: var(--background-accent-dot),\n danger: var(--background-danger-dot),\n info: var(--background-info-dot),\n neutral: var(--background-neutral-dot),\n success: var(--background-success-dot),\n warning: var(--background-warning-dot),\n);\n\n$pds-chip-sentiment-interactive: (\n accent: var(--background-accent-interactive),\n danger: var(--background-danger-interactive),\n info: var(--background-info-interactive),\n neutral: var(--background-neutral-interactive),\n success: var(--background-success-interactive),\n warning: var(--background-warning-interactive),\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 // tag close hover colors\n .pds-chip__close:hover {\n /* stylelint-disable-next-line */\n background: map-get($pds-chip-sentiment-interactive, $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-interactive, $sentiment);\n }\n}\n\n.pds-chip__dot {\n border: 1px solid transparent;\n border-radius: 50%;\n display: inline-block;\n height: var(--dot-size);\n margin-block-end: var(--margin-block-xs);\n margin-inline-end: var(--margin-inline-sm);\n width: var(--dot-size);\n}\n\n// dropdown\n\n:host(.pds-chip--dropdown) {\n padding: 0;\n\n .pds-chip__dot {\n margin-block-end: 1px;\n margin-block-start: var(--margin-block-xs);\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-family: inherit;\n font-size: var(--font-size);\n font-weight: var(--font-weight);\n line-height: var(--line-height);\n padding-block: var(--padding-block-sm);\n padding-inline: var(--padding-inline);\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(--margin-inline-xs) * -1);\n margin-inline-start: var(--margin-inline);\n }\n}\n\n// tag\n\n:host(.pds-chip--tag) {\n padding-block: var(--padding-block-sm);\n}\n\n.pds-chip__close {\n appearance: none;\n background: transparent;\n border: 0;\n border-radius: 50%;\n height: var(--close-size);\n margin-inline-end: calc(var(--margin-inline-lg) * -1);\n margin-inline-start: var(--margin-inline);\n padding: var(--close-size);\n position: relative;\n width: var(--close-size);\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(--padding-block-lg);\n padding-inline: var(--padding-inline-xl);\n\n &:host(.pds-chip--dropdown) {\n padding-block: var(--padding-block);\n padding-inline: var(--padding-inline-sm);\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(--padding-inline-lg)\n }\n\n .pds-chip__close {\n height: var(--close-size-lg);\n margin-inline-end: calc(var(--margin-inline-xl) * -1);\n width: var(--close-size-lg);\n }\n\n &:host(.pds-chip--tag) {\n padding-block: var(--padding-block);\n }\n}\n","import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'pds-chip',\n styleUrl: '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 name=\"down-small\" 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 name=\"remove\" size=\"12px\"></pds-icon>\n </button>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"0JAAA,IAAMA,EAAa,mwNACnB,IAAAC,EAAeD,E,ICMFE,EAAOC,EAAA,sB,sFAwCVC,KAAAC,iBAAmB,WACzBC,EAAKC,iBAAiBC,M,4CA/B8D,U,SAMxE,M,gCAWE,M,aAM+B,M,CAWvCC,EAAAC,UAAAC,WAAA,WACN,IAAMA,EAAa,CAAC,YAEpB,GAAIP,KAAKQ,MAAO,CACdD,EAAWE,KAAK,kB,CAElB,GAAIT,KAAKU,QAAS,CAChBH,EAAWE,KAAK,aAAeT,KAAKU,Q,CAEtC,GAAIV,KAAKW,UAAW,CAClBJ,EAAWE,KAAK,aAAeT,KAAKW,U,CAGtC,OAAOJ,EAAWK,KAAK,K,EAGjBP,EAAAC,UAAAO,eAAA,WACN,IAAMC,EAAad,KAAKU,UAAY,WACpC,IAAMK,EAAcD,EAClBE,EAAA,UAAQC,MAAM,mBAAmBC,KAAK,UACnClB,KAAKmB,KAAOH,EAAA,KAAGC,MAAM,gBAAe,cAAa,SACjDjB,KAAKoB,MACNJ,EAAA,YAAUK,KAAK,aAAaC,KAAK,OAAM,cAAa,UAGtDN,EAAA,QAAMC,MAAM,mBACTjB,KAAKmB,KAAOH,EAAA,KAAGC,MAAM,gBAAe,cAAa,SACjDjB,KAAKoB,OAIV,OAAOL,C,EAGTV,EAAAC,UAAAiB,OAAA,WACE,OACEP,EAACQ,EAAI,CAAAC,IAAA,2CAACR,MAAOjB,KAAKO,aAAcmB,GAAI1B,KAAK2B,aACtC3B,KAAKa,iBACLb,KAAKU,UAAY,OAChBM,EAAA,UAAQC,MAAM,kBAAkBC,KAAK,SAASU,QAAS5B,KAAKC,iBAAgB,aAAa,UACvFe,EAAA,YAAUK,KAAK,SAASC,KAAK,U,WApFrB,I"}
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
System.register(["./p-
|
|
1
|
+
System.register(["./p-c563d4e7.system.js","./p-4da2e899.system.js"],(function(r){"use strict";var o,i,e,a,d,s,c;return{setters:[function(r){o=r.r;i=r.c;e=r.h;a=r.H},function(r){d=r.m;s=r.P;c=r.a}],execute:function(){var n='.sc-pds-radio-h{--background-color:var(--pine-color-base-white);--background-color-hover:var(--pine-color-neutral-grey-100);--background-color-disabled:var(--pine-color-neutral-grey-200);--border:var(--pine-border-interactive);--border-color-hover:var(--pine-border-interactive-hover-color);--border-color-disabled:var(--pine-color-neutral-grey-300);--border-radius:50%;--color:var(--pine-color-neutral-charcoal-200);--color-checked:var(--pine-color-neutral-charcoal-500);--color-disabled:var(--pine-color-neutral-grey-500);--color-focus:var(--pine-color-primary-200);--color-invalid:var(--pine-color-red-300);--color-invalid-focus:var(--pine-color-red-200);--font-size:var(--pine-font-size-body-sm);--input-size:16px;--check-size:6px;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap}.is-invalid.sc-pds-radio-h input.sc-pds-radio{border-color:var(--color-invalid)}.is-invalid.sc-pds-radio-h input.sc-pds-radio:checked{background:var(--color-invalid)}.is-invalid.sc-pds-radio-h input.sc-pds-radio:focus-visible{-webkit-box-shadow:0 0 0 4px var(--color-invalid-focus);box-shadow:0 0 0 4px var(--color-invalid-focus);outline:none}.is-invalid.sc-pds-radio-h label.sc-pds-radio,.is-invalid.sc-pds-radio-h .pds-radio__message--error.sc-pds-radio{color:var(--color-invalid)}input.sc-pds-radio{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:var(--border);border-radius:var(--border-radius);height:var(--input-size);margin:0;position:relative;width:var(--input-size)}input.sc-pds-radio:hover{background:var(--background-color-hover);border-color:var(--border-color-hover)}input.sc-pds-radio:checked{background:var(--color-checked);border-color:var(--color-checked)}input.sc-pds-radio:checked::after{background:var(--background-color);border-radius:50%;content:"";display:block;height:var(--check-size);left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:var(--check-size)}input.sc-pds-radio:disabled{background:var(--background-color-disabled);border-color:var(--border-color-disabled);cursor:not-allowed}input.sc-pds-radio:disabled:checked{background:var(--color-disabled);border-color:var(--border-color-disabled)}input.sc-pds-radio:disabled:checked::after{border-color:var(--border-color-disabled)}input.sc-pds-radio:disabled+label.sc-pds-radio{color:var(--border-color-hover);cursor:not-allowed}input.sc-pds-radio:disabled~.pds-radio__message.sc-pds-radio{color:var(--color-disabled)}input.sc-pds-radio:focus-visible{-webkit-box-shadow:0 0 0 4px var(--color-focus);box-shadow:0 0 0 4px var(--color-focus);outline:none}label.sc-pds-radio{-webkit-margin-start:10px;margin-inline-start:10px}.pds-radio__message.sc-pds-radio{color:var(--color);font-size:var(--font-size);-webkit-margin-before:var(--check-size);margin-block-start:var(--check-size);-webkit-margin-start:26px;margin-inline-start:26px;width:100%}';var t=n;var l=r("pds_radio",function(){function r(r){var e=this;o(this,r);this.pdsRadioChange=i(this,"pdsRadioChange",7);this.handleRadioChange=function(r){if(e.disabled){return}var o=r.target;var i=o.checked;e.pdsRadioChange.emit(i)};this.checked=false;this.disabled=false;this.errorMessage=undefined;this.invalid=false;this.componentId=undefined;this.label=undefined;this.helperMessage=undefined;this.name=undefined;this.required=false;this.value=undefined}r.prototype.classNames=function(){var r=[];if(this.invalid){r.push("is-invalid")}if(this.disabled){r.push("is-disabled")}return r.join(" ")};r.prototype.render=function(){return e(a,{key:"1427cdb78f9e67d64f1d41fbbcd69f142568be54",class:this.classNames()},e("input",{key:"e657db2c4d043871913ba314adb0b1666001dc8e","aria-describedby":c(this.componentId,this.invalid,this.helperMessage),"aria-invalid":this.invalid?"true":undefined,type:"radio",id:this.componentId,name:this.name,value:this.value,checked:this.checked,required:this.required,disabled:this.disabled,onChange:this.handleRadioChange}),e(s,{key:"c7a15d4d55f7a82f21754d5a5c711ae2b60b5cdc",htmlFor:this.componentId,text:this.label}),this.helperMessage&&e("div",{class:"pds-radio__message",id:d(this.componentId,"helper")},this.helperMessage),this.errorMessage&&e("div",{class:"pds-radio__message pds-radio__message--error",id:d(this.componentId,"error"),"aria-live":"assertive"},this.errorMessage))};return r}());l.style=t}}}));
|
|
2
|
+
//# sourceMappingURL=p-20e8c2e6.system.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["pdsRadioCss","PdsRadioStyle0","PdsRadio","exports","this","handleRadioChange","e","_this","disabled","target","isChecked","checked","pdsRadioChange","emit","class_1","prototype","classNames","invalid","push","join","render","h","Host","key","class","assignDescription","componentId","helperMessage","undefined","type","id","name","value","required","onChange","PdsLabel","htmlFor","text","label","messageId","errorMessage"],"sources":["src/components/pds-radio/pds-radio.scss?tag=pds-radio&encapsulation=scoped","src/components/pds-radio/pds-radio.tsx"],"sourcesContent":[":host {\n --background-color: var(--pine-color-base-white);\n --background-color-hover: var(--pine-color-neutral-grey-100);\n --background-color-disabled: var(--pine-color-neutral-grey-200);\n --border: var(--pine-border-interactive);\n --border-color-hover: var(--pine-border-interactive-hover-color);\n --border-color-disabled: var(--pine-color-neutral-grey-300);\n --border-radius: 50%;\n --color: var(--pine-color-neutral-charcoal-200);\n --color-checked: var(--pine-color-neutral-charcoal-500);\n --color-disabled: var(--pine-color-neutral-grey-500);\n --color-focus: var(--pine-color-primary-200);\n --color-invalid: var(--pine-color-red-300);\n --color-invalid-focus: var(--pine-color-red-200);\n --font-size: var(--pine-font-size-body-sm);\n --input-size: 16px;\n --check-size: 6px;\n\n align-items: center;\n display: flex;\n flex-flow: row wrap;\n}\n\n:host(.is-invalid) {\n input {\n border-color: var(--color-invalid);\n\n &:checked {\n background: var(--color-invalid);\n }\n\n &:focus-visible {\n box-shadow: 0 0 0 4px var(--color-invalid-focus);\n outline: none;\n }\n }\n\n label,\n .pds-radio__message--error {\n color: var(--color-invalid);\n }\n}\n\ninput {\n appearance: none;\n border: var(--border);\n border-radius: var(--border-radius);\n height: var(--input-size);\n margin: 0;\n position: relative;\n width: var(--input-size);\n\n &:hover {\n background: var(--background-color-hover);\n border-color: var(--border-color-hover);\n }\n\n &:checked {\n background: var(--color-checked);\n border-color: var(--color-checked);\n\n &::after {\n background: var(--background-color);\n border-radius: 50%;\n content: \"\";\n display: block;\n height: var(--check-size);\n left: 50%;\n position: absolute;\n top: 50%;\n transform: translate(-50%, -50%);\n width: var(--check-size);\n }\n }\n\n &:disabled {\n background: var(--background-color-disabled);\n border-color: var(--border-color-disabled);\n cursor: not-allowed;\n\n &:checked {\n background: var(--color-disabled);\n border-color: var(--border-color-disabled);\n\n &::after {\n border-color: var(--border-color-disabled);\n }\n }\n\n + label {\n color: var(--border-color-hover);\n cursor: not-allowed;\n }\n\n ~ .pds-radio__message {\n color: var(--color-disabled);\n }\n }\n\n &:focus-visible {\n box-shadow: 0 0 0 4px var(--color-focus);\n outline: none;\n }\n\n}\n\nlabel {\n margin-inline-start: 10px;\n}\n\n.pds-radio__message {\n color: var(--color);\n font-size: var(--font-size);\n margin-block-start: var(--check-size);\n margin-inline-start: 26px;\n width: 100%;\n}\n","import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { PdsLabel } from '../_internal/pds-label/pds-label';\n\n@Component({\n tag: 'pds-radio',\n styleUrl: 'pds-radio.scss',\n scoped: true,\n})\nexport class PdsRadio {\n /**\n * Determines whether or not the radio is checked.\n * @defaultValue false\n */\n @Prop() checked = false;\n\n /**\n * Determines whether or not the radio is disabled.\n * @defaultValue false\n */\n @Prop() disabled = false;\n\n /**\n * Displays message text describing an invalid state.\n */\n @Prop() errorMessage: string;\n\n /**\n * Determines whether or not the radio is invalid.\n * @defaultValue false\n */\n @Prop() invalid = false;\n\n /**\n * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * String used for label text next to radio.\n */\n @Prop() label: string;\n\n /**\n * String used for helper message below radio.\n */\n @Prop() helperMessage: string;\n\n /**\n * String used for radio `name` attribute.\n */\n @Prop() name: string;\n\n /**\n * Determines whether or not the radio is required.\n * @defaultValue false\n */\n @Prop() required = false;\n\n /**\n * The value of the radio that is submitted with a form.\n */\n @Prop() value: string;\n\n /**\n * Emits a boolean indicating whether the checkbox is currently checked or unchecked.\n */\n @Event() pdsRadioChange: EventEmitter<boolean>;\n\n private handleRadioChange = (e: Event) => {\n if (this.disabled) {\n return;\n }\n\n const target = e.target as HTMLInputElement;\n const isChecked = target.checked;\n\n this.pdsRadioChange.emit(isChecked);\n }\n\n private classNames() {\n const classNames = [];\n\n if (this.invalid) {\n classNames.push('is-invalid');\n }\n if (this.disabled) {\n classNames.push('is-disabled');\n }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host class={this.classNames()}>\n <input\n aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n type=\"radio\"\n id={this.componentId}\n name={this.name}\n value={this.value}\n checked={this.checked}\n required={this.required}\n disabled={this.disabled}\n onChange={this.handleRadioChange}\n />\n <PdsLabel htmlFor={this.componentId} text={this.label} />\n {this.helperMessage &&\n <div\n class={'pds-radio__message'}\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </div>\n }\n {this.errorMessage &&\n <div\n class={`pds-radio__message pds-radio__message--error`}\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n {this.errorMessage}\n </div>\n }\n </Host>\n );\n }\n}\n"],"mappings":"wNAAA,IAAMA,EAAc,y4FACpB,IAAAC,EAAeD,E,ICQFE,EAAQC,EAAA,uB,kFA4DXC,KAAAC,kBAAoB,SAACC,GAC3B,GAAIC,EAAKC,SAAU,CACjB,M,CAGF,IAAMC,EAASH,EAAEG,OACjB,IAAMC,EAAYD,EAAOE,QAEzBJ,EAAKK,eAAeC,KAAKH,E,eA/DT,M,cAMC,M,yCAWD,M,+GA0BC,M,qBAuBXI,EAAAC,UAAAC,WAAA,WACN,IAAMA,EAAa,GAEnB,GAAIZ,KAAKa,QAAS,CAChBD,EAAWE,KAAK,a,CAElB,GAAId,KAAKI,SAAU,CACjBQ,EAAWE,KAAK,c,CAGlB,OAAOF,EAAWG,KAAK,K,EAGzBL,EAAAC,UAAAK,OAAA,WACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAOpB,KAAKY,cAChBK,EAAA,SAAAE,IAAA,8DACoBE,EAAkBrB,KAAKsB,YAAatB,KAAKa,QAASb,KAAKuB,eAAc,eACzEvB,KAAKa,QAAU,OAASW,UACtCC,KAAK,QACLC,GAAI1B,KAAKsB,YACTK,KAAM3B,KAAK2B,KACXC,MAAO5B,KAAK4B,MACZrB,QAASP,KAAKO,QACdsB,SAAU7B,KAAK6B,SACfzB,SAAUJ,KAAKI,SACf0B,SAAU9B,KAAKC,oBAEjBgB,EAACc,EAAQ,CAAAZ,IAAA,2CAACa,QAAShC,KAAKsB,YAAaW,KAAMjC,KAAKkC,QAC/ClC,KAAKuB,eACJN,EAAA,OACEG,MAAO,qBACPM,GAAIS,EAAUnC,KAAKsB,YAAa,WAE/BtB,KAAKuB,eAGTvB,KAAKoC,cACJnB,EAAA,OACEG,MAAO,+CACPM,GAAIS,EAAUnC,KAAKsB,YAAa,SAAQ,YAC9B,aAETtB,KAAKoC,c,WAlHG,I"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
System.register(["./p-c563d4e7.system.js","./p-136ac055.system.js"],(function(i){"use strict";var n,e,s;return{setters:[function(i){n=i.r;e=i.h},function(i){s=i.l}],execute:function(){var t=":host{--border-radius:var(--pine-border-radius-sm);--color:var(--pine-color-neutral-charcoal-400);--font-size:var(--pine-font-size-body);--font-size-sm:var(--pine-font-size-body-sm);--font-size-xs:var(--pine-font-size-body-xs);--font-weight:var(--pine-font-weight-medium);--margin-inline-start:var(--pine-spacing-xxs);--outline:4px solid var(--pine-color-primary-200);--svg-lg:15px;--svg-md:13px;--svg-sm:11px;display:inline}:host pds-icon{-webkit-margin-start:var(--margin-inline-start);margin-inline-start:var(--margin-inline-start)}.pds-link{-ms-flex-align:center;align-items:center;color:var(--color);display:-ms-inline-flexbox;display:inline-flex;font-weight:inherit}.pds-link:focus{border-radius:var(--border-radius);outline:var(--outline)}.pds-link--sm{font-size:var(--font-size-xs)}.pds-link--sm pds-icon{height:var(--svg-sm);width:var(--svg-sm)}.pds-link--md{font-size:var(--font-size-sm)}.pds-link--md pds-icon{height:var(--svg-md);width:var(--svg-md)}.pds-link--lg{font-size:var(--font-size)}.pds-link--lg pds-icon{height:var(--svg-lg);width:var(--svg-lg)}.pds-link--plain{font-weight:var(--font-weight);text-decoration:none}.pds-link--plain:hover{text-decoration:underline}.pds-link--default{text-decoration:underline}.pds-link--default:hover{text-decoration:none}";var r=t;var a=i("pds_link",function(){function i(i){n(this,i);this.componentId=undefined;this.external=false;this.variant="inline";this.fontSize="lg";this.href=undefined}i.prototype.classNames=function(){var i=["pds-link"];if(this.fontSize){i.push("pds-link--"+this.fontSize)}if(this.variant){i.push("pds-link--"+this.variant)}return i.join(" ")};i.prototype.render=function(){return e("a",{key:"72e9712a881a175bab71e2d9beb2d0307582bde3",class:this.classNames(),href:this.href,id:this.componentId,target:this.external?"_blank":undefined,part:"link"},e("slot",{key:"13f8e29adcfc55e7aeb62bd5e67105ce4d21eca7"},this.href),this.external&&e("pds-icon",{icon:s,size:this.fontSize}))};return i}());a.style=r}}}));
|
|
2
|
+
//# sourceMappingURL=p-24f4102e.system.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["pdsLinkCss","PdsLinkStyle0","PdsLink","exports","class_1","prototype","classNames","this","fontSize","push","variant","join","render","h","key","class","href","id","componentId","target","external","undefined","part","icon","launch","size"],"sources":["src/components/pds-link/pds-link.scss?tag=pds-link&encapsulation=shadow","src/components/pds-link/pds-link.tsx"],"sourcesContent":[":host {\n\n --border-radius: var(--pine-border-radius-sm);\n --color: var(--pine-color-neutral-charcoal-400);\n --font-size: var(--pine-font-size-body);\n --font-size-sm: var(--pine-font-size-body-sm);\n --font-size-xs: var(--pine-font-size-body-xs);\n --font-weight: var(--pine-font-weight-medium);\n --margin-inline-start: var(--pine-spacing-xxs);\n --outline: 4px solid var(--pine-color-primary-200);\n --svg-lg: 15px;\n --svg-md: 13px;\n --svg-sm: 11px;\n\n display: inline;\n\n pds-icon {\n margin-inline-start: var(--margin-inline-start);\n }\n}\n\n.pds-link {\n align-items: center;\n color: var(--color);\n display: inline-flex;\n font-weight: inherit;\n\n &:focus {\n border-radius: var(--border-radius);\n outline: var(--outline);\n }\n}\n\n// We have a small consensus stating that\n// fonts will be REMs, box-model will be\n// discussed later px or (r)em's\n.pds-link--sm {\n font-size: var(--font-size-xs);\n\n pds-icon {\n height: var(--svg-sm);\n width: var(--svg-sm);\n }\n}\n\n.pds-link--md {\n font-size: var(--font-size-sm);\n\n pds-icon {\n height: var(--svg-md);\n width: var(--svg-md);\n }\n}\n\n.pds-link--lg {\n font-size: var(--font-size);\n\n pds-icon {\n height: var(--svg-lg);\n width: var(--svg-lg);\n }\n}\n\n.pds-link--plain {\n font-weight: var(--font-weight);\n text-decoration: none;\n\n &:hover {\n text-decoration: underline;\n }\n}\n\n// Default = inline link\n.pds-link--default {\n text-decoration: underline;\n\n &:hover {\n text-decoration: none;\n }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\nimport { launch } from '@pine-ds/icons/icons';\n\n/**\n * @part link - The main link element that represents the link component.\n * @slot - Content is placed between the opening closing tags.\n */\n@Component({\n tag: 'pds-link',\n styleUrl: 'pds-link.scss',\n shadow: true,\n})\nexport class PdsLink {\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * When enabled, opens link in a new tab.\n * @defaultValue false\n */\n @Prop() external = false;\n\n /**\n *\n * Modifies the look of the link\n */\n @Prop() variant: 'inline' | 'plain' = 'inline';\n\n /**\n *\n * The Font size follows t-shirt model\n * sm: 12px\n * md: 14px\n * lg: 16px\n * @defaultValue lg\n */\n @Prop() fontSize: 'sm' | 'md' | 'lg' = 'lg';\n\n /**\n * The URL that the hyperlink points to.\n */\n @Prop() href!: string;\n\n private classNames() {\n const classNames = ['pds-link'];\n\n if (this.fontSize) {\n classNames.push('pds-link--' + this.fontSize);\n }\n\n if (this.variant) {\n classNames.push('pds-link--' + this.variant);\n }\n\n return classNames.join(' ');\n }\n\n render() {\n\n return (\n <a\n class={this.classNames()}\n href={this.href}\n id={this.componentId}\n target={this.external ? '_blank' : undefined}\n part=\"link\"\n >\n <slot>{this.href}</slot>\n {this.external &&\n <pds-icon icon={launch} size={this.fontSize}></pds-icon>\n }\n </a>\n );\n }\n}\n"],"mappings":"wLAAA,IAAMA,EAAa,+vCACnB,IAAAC,EAAeD,E,ICYFE,EAAOC,EAAA,sB,iEAUC,M,aAMmB,S,cAUC,K,oBAO/BC,EAAAC,UAAAC,WAAA,WACN,IAAMA,EAAa,CAAC,YAEpB,GAAIC,KAAKC,SAAU,CACjBF,EAAWG,KAAK,aAAeF,KAAKC,S,CAGtC,GAAID,KAAKG,QAAS,CAChBJ,EAAWG,KAAK,aAAeF,KAAKG,Q,CAGtC,OAAOJ,EAAWK,KAAK,I,EAGzBP,EAAAC,UAAAO,OAAA,WAEE,OACEC,EAAA,KAAAC,IAAA,2CACEC,MAAOR,KAAKD,aACZU,KAAMT,KAAKS,KACXC,GAAIV,KAAKW,YACTC,OAAQZ,KAAKa,SAAW,SAAWC,UACnCC,KAAK,QAELT,EAAA,QAAAC,IAAA,4CAAOP,KAAKS,MACXT,KAAKa,UACJP,EAAA,YAAUU,KAAMC,EAAQC,KAAMlB,KAAKC,W,WA3DzB,I"}
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
System.register(["./p-
|
|
1
|
+
System.register(["./p-c563d4e7.system.js","./p-4da2e899.system.js"],(function(r){"use strict";var e,i,t,o,a,s,n,l;return{setters:[function(r){e=r.r;i=r.c;t=r.h;o=r.H;a=r.g},function(r){s=r.m;n=r.P;l=r.a}],execute:function(){var c=':host{--background-color:var(--pine-color-neutral-grey-400);--background-color-checked:var(--pine-color-neutral-charcoal-400);--background-color-checked-hover:var(--pine-color-neutral-charcoal-400);--background-color-disabled:var(--pine-color-neutral-grey-300);--background-color-hover:var(--pine-color-neutral-grey-500);--input-border-radius:var(--pine-border-radius-lg);--input-height:20px;--input-width:36px;--input-toggle-box-shadow:0 2px 4px 0 rgba(0, 0, 0, 0.12), 0 0 2px 0 rgba(0, 0, 0, 0.08);--input-toggle-color:var(--pine-color-base-white);--input-toggle-offset:2px;--input-toggle-size:calc(var(--input-height) - (var(--input-toggle-offset) * 2));--label-gap-size:12px;--label-line-height:var(--pine-line-height-md);--message-spacing-block:var(--pine-spacing-xxs);--message-spacing-inline:calc(var(--input-width) + var(--label-gap-size));--message-text-color:var(--pine-color-neutral-charcoal-200);--outline-color-focus:var(--pine-color-primary-200);--outline-color-focus-error:var(--pine-color-red-200);--text-color-default:var(--pine-color-neutral-charcoal-400);--text-color-disabled:var(--pine-color-neutral-grey-500);--text-color-error:var(--pine-color-red-300);--transition-timing:0.15s ease-out;-ms-flex-align:start;align-items:flex-start;color:var(--text-color-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(--text-color-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(--text-color-error)}:host(.pds-switch--error) input:focus-visible:not(:disabled):not(:checked){-webkit-box-shadow:0 0 0 4px var(--outline-color-focus-error);box-shadow:0 0 0 4px var(--outline-color-focus-error)}input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--background-color);border:0;border-radius:var(--input-border-radius);cursor:pointer;display:inline-block;height:var(--input-height);margin:0;padding:0;position:relative;-webkit-transform:translateY(2px);transform:translateY(2px);-webkit-transition:var(--transition-timing);transition:var(--transition-timing);-webkit-transition-property:background, border, color;transition-property:background, border, color;width:var(--input-width)}input::after{background:var(--input-toggle-color);border-radius:50%;-webkit-box-shadow:var(--input-toggle-box-shadow);box-shadow:var(--input-toggle-box-shadow);content:"";display:block;height:var(--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(--transition-timing);transition:-webkit-transform var(--transition-timing);transition:transform var(--transition-timing);transition:transform var(--transition-timing), -webkit-transform var(--transition-timing);width:var(--input-toggle-size)}label{cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-positive:1;flex-grow:1;line-height:var(--label-line-height);-webkit-margin-start:var(--label-gap-size);margin-inline-start:var(--label-gap-size)}.pds-switch--error label{color:inherit}.pds-switch__message{color:var(--message-text-color);-ms-flex:1 0 100%;flex:1 0 100%;font-size:var(--pine-font-size-body-sm);line-height:var(--pine-line-height-sm);-webkit-margin-start:var(--message-spacing-inline);margin-inline-start:var(--message-spacing-inline)}.pds-switch__message+.pds-switch__message{-webkit-margin-before:var(--message-spacing-block);margin-block-start:var(--message-spacing-block)}.pds-switch__message--error{color:inherit}input:disabled{background-color:var(--background-color-disabled);cursor:not-allowed}input:disabled~label{color:var(--text-color-disabled);cursor:initial}input:disabled .pds-switch__message{color:initial}input:hover:not(:disabled){background-color:var(--background-color-hover)}input:focus-visible:not(:disabled){-webkit-box-shadow:0 0 0 4px var(--outline-color-focus);box-shadow:0 0 0 4px var(--outline-color-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(--background-color-checked)}input:checked:not(:disabled):hover{border-color:currentColor;color:var(--background-color-checked-hover)}';var d=c;var h=r("pds_switch",function(){function r(r){var t=this;e(this,r);this.pdsSwitchChange=i(this,"pdsSwitchChange",7);this.onSwitchUpdate=function(r){if(t.disabled)return;t.pdsSwitchChange.emit(r)};this.switchClassNames=function(){var r="pds-switch";if(t.invalid===true){r+=" pds-switch--error"}if(t.helperMessage!==undefined){r+=" pds-switch--message"}return r};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.type="checkbox";this.value=undefined}r.prototype.render=function(){return t(o,{key:"cdb6f34b8eb4a40fa9477b820461276ea07b9346",class:this.switchClassNames(),"aria-disabled":this.disabled?"true":null},t("input",{key:"cdb0f78abe53f7c84da5aa75e878d40180821e44","aria-describedby":l(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:this.type,value:this.value}),t(n,{key:"37d5f8106e84f5820f0e27b1a2d656a6090293a3",classNames:"pds-switch__label",htmlFor:this.componentId,text:this.label}),this.helperMessage&&t("div",{class:"pds-switch__message",id:s(this.componentId,"helper")},this.helperMessage),this.errorMessage&&t("div",{class:"pds-switch__message pds-switch__message--error",id:s(this.componentId,"error"),"aria-live":"assertive"},this.errorMessage))};Object.defineProperty(r.prototype,"el",{get:function(){return a(this)},enumerable:false,configurable:true});return r}());h.style=d}}}));
|
|
2
|
+
//# sourceMappingURL=p-25cf60f1.system.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["pdsSwitchCss","PdsSwitchStyle0","PdsSwitch","exports","this","onSwitchUpdate","e","_this","disabled","pdsSwitchChange","emit","switchClassNames","switchClasses","invalid","helperMessage","undefined","class_1","prototype","render","h","Host","key","class","assignDescription","componentId","checked","id","name","onChange","required","type","value","PdsLabel","classNames","htmlFor","text","label","messageId","errorMessage"],"sources":["src/components/pds-switch/pds-switch.scss?tag=pds-switch&encapsulation=shadow","src/components/pds-switch/pds-switch.tsx"],"sourcesContent":[":host {\n --background-color: var(--pine-color-neutral-grey-400);\n --background-color-checked: var(--pine-color-neutral-charcoal-400);\n --background-color-checked-hover: var(--pine-color-neutral-charcoal-400);\n --background-color-disabled: var(--pine-color-neutral-grey-300);\n --background-color-hover: var(--pine-color-neutral-grey-500);\n\n --input-border-radius: var(--pine-border-radius-lg);\n --input-height: 20px;\n --input-width: 36px;\n --input-toggle-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), 0 0 2px 0 rgba(0, 0, 0, 0.08);\n --input-toggle-color: var(--pine-color-base-white);\n --input-toggle-offset: 2px;\n --input-toggle-size: calc(var(--input-height) - (var(--input-toggle-offset) * 2));\n\n --label-gap-size: 12px;\n --label-line-height: var(--pine-line-height-md);\n\n --message-spacing-block: var(--pine-spacing-xxs);\n --message-spacing-inline: calc(var(--input-width) + var(--label-gap-size));\n --message-text-color: var(--pine-color-neutral-charcoal-200);\n\n --outline-color-focus: var(--pine-color-primary-200);\n --outline-color-focus-error: var(--pine-color-red-200);\n\n --text-color-default: var(--pine-color-neutral-charcoal-400);\n --text-color-disabled: var(--pine-color-neutral-grey-500);\n --text-color-error: var(--pine-color-red-300);\n --transition-timing: 0.15s ease-out;\n\n\n align-items: flex-start;\n color: var(--text-color-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(--text-color-error);\n\n input,\n input:checked,\n input:hover:not(:disabled):not(:checked) {\n background-color: var(--text-color-error);\n }\n\n input:focus-visible:not(:disabled):not(:checked) {\n box-shadow: 0 0 0 4px var(--outline-color-focus-error);\n }\n}\n\n// switch container\ninput {\n appearance: none;\n background: var(--background-color);\n border: 0;\n border-radius: var(--input-border-radius);\n cursor: pointer;\n display: inline-block;\n height: var(--input-height);\n margin: 0;\n padding: 0;\n position: relative;\n transform: translateY(2px);\n transition: var(--transition-timing);\n transition-property: background, border, color;\n width: var(--input-width);\n\n // switch toggle\n &::after {\n background: var(--input-toggle-color);\n border-radius: 50%;\n box-shadow: var(--input-toggle-box-shadow);\n content: \"\";\n display: block;\n height: var(--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(--transition-timing);\n width: var(--input-toggle-size);\n }\n}\n\nlabel {\n cursor: pointer;\n display: inline-flex;\n flex-grow: 1;\n line-height: var(--label-line-height);\n margin-inline-start: var(--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(--message-text-color);\n flex: 1 0 100%;\n font-size: var(--pine-font-size-body-sm);\n line-height: var(--pine-line-height-sm);\n margin-inline-start: var(--message-spacing-inline);\n\n + .pds-switch__message {\n margin-block-start: var(--message-spacing-block);\n }\n}\n\n.pds-switch__message--error {\n color: inherit;\n}\n\n// Disabled state\ninput:disabled {\n background-color: var(--background-color-disabled);\n cursor: not-allowed;\n\n ~ label {\n color: var(--text-color-disabled);\n cursor: initial;\n }\n\n .pds-switch__message {\n color: initial;\n }\n}\n\n// Hover state\ninput:hover:not(:disabled) {\n background-color: var(--background-color-hover);\n}\n\n // Focus state\ninput:focus-visible:not(:disabled) {\n box-shadow: 0 0 0 4px var(--outline-color-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(--background-color-checked);\n\n &:hover {\n border-color: currentColor;\n color: var(--background-color-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';\n\n@Component({\n tag: 'pds-switch',\n styleUrl: '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() 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 * Specifies the underlying input element type\n * @defaultValue 'checkbox'\n */\n @Prop() type: 'checkbox' | 'radio' = 'checkbox';\n\n /**\n * Provides input with a string submitted in form data, and can be used to distinguish radio inputs\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 this.pdsSwitchChange.emit(e as InputEvent);\n };\n\n /**\n * Generate switch classes\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={this.type}\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 {this.errorMessage}\n </div>\n }\n </Host>\n );\n }\n}\n"],"mappings":"gOAAA,IAAMA,EAAe,65IACrB,IAAAC,EAAeD,E,ICQFE,EAASC,EAAA,wB,oFAgEZC,KAAAC,eAAiB,SAACC,GACxB,GAAIC,EAAKC,SAAU,OACnBD,EAAKE,gBAAgBC,KAAKJ,E,EAMpBF,KAAAO,iBAAmB,WACzB,IAAIC,EAAgB,aAEpB,GAAIL,EAAKM,UAAY,KAAM,CACzBD,GAAiB,oB,CAEnB,GAAIL,EAAKO,gBAAkBC,UAAW,CACpCH,GAAiB,sB,CAEnB,OAAOA,C,0CAtES,M,cAKE,M,sEAeD,M,uDAeC,M,UAMiB,W,qBAgCrCI,EAAAC,UAAAC,OAAA,WACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAOlB,KAAKO,mBAAkB,gBAAiBP,KAAKI,SAAW,OAAS,MAC5EW,EAAA,SAAAE,IAAA,8DACoBE,EAAkBnB,KAAKoB,YAAapB,KAAKS,QAAST,KAAKU,eAAc,eACzEV,KAAKS,QAAU,OAASE,UACtCU,QAASrB,KAAKqB,QACdH,MAAM,oBACNd,SAAUJ,KAAKI,SACfkB,GAAItB,KAAKoB,YACTG,KAAMvB,KAAKuB,KAAOvB,KAAKuB,KAAOvB,KAAKoB,YACnCI,SAAUxB,KAAKC,eACfwB,SAAUzB,KAAKyB,SACfC,KAAM1B,KAAK0B,KACXC,MAAO3B,KAAK2B,QAEdZ,EAACa,EAAQ,CAAAX,IAAA,2CAACY,WAAW,oBAAoBC,QAAS9B,KAAKoB,YAAaW,KAAM/B,KAAKgC,QAC9EhC,KAAKU,eACJK,EAAA,OACEG,MAAO,sBACPI,GAAIW,EAAUjC,KAAKoB,YAAa,WAE/BpB,KAAKU,eAGTV,KAAKkC,cACJnB,EAAA,OACEG,MAAO,iDACPI,GAAIW,EAAUjC,KAAKoB,YAAa,SAAQ,YAC9B,aAETpB,KAAKkC,c,uHAnHI,I"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
System.register(["./p-c563d4e7.system.js","./p-136ac055.system.js"],(function(a){"use strict";var n,e,i,r,o;return{setters:[function(a){n=a.r;e=a.h;i=a.H},function(a){r=a.u;o=a.d}],execute:function(){var t=":host{display:block}details{--border-radius:var(--pine-spacing-xs);--box-shadow-focus:0 0 0 4px var(--pine-color-primary-200);--color-content-background:var(--pine-base-color-white);--color-background-hover:var(--pine-color-neutral-grey-300);--color-font:var(--pine-color-neutral-charcoal-200);--color-font-active:var(--pine-color-neutral-charcoal-500);--color-font-hover:var(--pine-color-neutral-charcoal-300);--font-weight:var(--pine-font-weight-semibold);--spacing-details-padding-inline:12px;--spacing-summary-padding-block:var(--pine-spacing-xxs);--spacing-summary-padding-inline-start:var(--pine-spacing-xs);--spacing-summary-padding-inline-end:var(--pine-spacing-xxs);border-radius:var(--border-radius);padding-inline:var(--spacing-details-padding-inline)}details[open]{background-color:var(--color-content-background)}details[open] summary{color:var(--color-font-active);font-weight:var(--font-weight)}summary{border-radius:var(--border-radius);color:var(--color-font);font-weight:var(--font-weight);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-font-hover);cursor:pointer}summary:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}summary pds-icon{-webkit-margin-start:auto;margin-inline-start:auto}";var s=t;var d=a("pds_accordion",function(){function a(a){var e=this;n(this,a);this.handleToggle=function(){e.isOpen=e.detailsEl.open};this.getOpenAttribute=function(){if(e.isOpen!==false){return{open:true}}return""};this.componentId=undefined;this.isOpen=false}a.prototype.handleOpenState=function(a){this.isOpen=a};a.prototype.componentDidLoad=function(){this.detailsEl.addEventListener("toggle",this.handleToggle)};a.prototype.render=function(){var a=this;return e(i,{key:"e996195d96f69a054a9ea665990532d711a82b63",class:"pds-accordion",id:this.componentId},e("details",Object.assign({key:"b4fe417ed95131dda058c574d597f0a3eb23c450"},this.getOpenAttribute(),{ref:function(n){return a.detailsEl=n}}),e("summary",{key:"778a0c82d3d2d905f918790471d835cd930fe45c"},e("slot",{key:"ff07c719be212738add3b0a5f5dd0cf7d6e82171",name:"label"},"Details"),e("pds-icon",{key:"1dc003b9f15ac06928db012311dddae6c55f2e96",icon:this.isOpen?r:o})),e("div",{key:"430756d63e0eb92ab5858e8cf5e8b45a1d39a637",class:"pds-accordion__body"},e("slot",{key:"df808630195d17c6093d6dcb6a92d248f236f6a0"}))))};Object.defineProperty(a,"watchers",{get:function(){return{isOpen:["handleOpenState"]}},enumerable:false,configurable:true});return a}());d.style=s}}}));
|
|
2
|
+
//# sourceMappingURL=p-280eca34.system.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["pdsAccordionCss","PdsAccordionStyle0","PdsAccordion","exports","this","handleToggle","_this","isOpen","detailsEl","open","getOpenAttribute","class_1","prototype","handleOpenState","newValue","componentDidLoad","addEventListener","render","h","Host","key","class","id","componentId","Object","assign","ref","el","name","icon","upSmall","downSmall"],"sources":["src/components/pds-accordion/pds-accordion.scss?tag=pds-accordion&encapsulation=shadow","src/components/pds-accordion/pds-accordion.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\ndetails {\n --border-radius: var(--pine-spacing-xs);\n --box-shadow-focus: 0 0 0 4px var(--pine-color-primary-200);\n --color-content-background: var(--pine-base-color-white);\n --color-background-hover: var(--pine-color-neutral-grey-300);\n --color-font: var(--pine-color-neutral-charcoal-200);\n --color-font-active: var(--pine-color-neutral-charcoal-500);\n --color-font-hover: var(--pine-color-neutral-charcoal-300);\n --font-weight: var(--pine-font-weight-semibold);\n --spacing-details-padding-inline: 12px;\n --spacing-summary-padding-block: var(--pine-spacing-xxs);\n --spacing-summary-padding-inline-start: var(--pine-spacing-xs);\n --spacing-summary-padding-inline-end: var(--pine-spacing-xxs);\n\n border-radius: var(--border-radius);\n padding-inline: var(--spacing-details-padding-inline)\n}\n\n/* stylelint-disable-next-line */\ndetails[open] {\n background-color: var(--color-content-background);\n\n summary {\n color: var(--color-font-active);\n font-weight: var(--font-weight);\n }\n}\n\nsummary {\n border-radius: var(--border-radius);\n color: var(--color-font);\n font-weight: var(--font-weight);\n padding-block: var(--spacing-summary-padding-block);\n padding-inline-end: var(--spacing-summary-padding-inline-end);\n padding-inline-start: var(--spacing-summary-padding-inline-start);\n\n // Removes marker on Firefox/Chrome\n /* stylelint-disable-next-line */\n align-items: center;\n display: flex;\n\n // Removes marker on Safari\n &::-webkit-details-marker {\n display: none;\n }\n\n &:hover {\n background: var(--color-background-hover);\n color: var(--color-font-hover);\n cursor: pointer;\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 pds-icon {\n margin-inline-start: auto;\n }\n}\n","import { Component, h, Host, Prop, Watch } from '@stencil/core';\nimport { downSmall, upSmall } from '@pine-ds/icons/icons';\n\n/**\n * @slot (default) - Accordion body content.\n * @slot label - Accordion trigger button content.\n */\n@Component({\n tag: 'pds-accordion',\n styleUrl: 'pds-accordion.scss',\n shadow: true,\n})\nexport class PdsAccordion {\n private detailsEl: HTMLDetailsElement;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n * @defaultValue null\n */\n @Prop() componentId: string;\n\n /**\n * Can be used to manually set the open state of the accordion.\n * @defaultValue false\n */\n @Prop({ \n attribute: 'open',\n mutable: true,\n reflect: true \n }) isOpen: boolean = false;\n\n @Watch('isOpen')\n handleOpenState(newValue: boolean) {\n this.isOpen = newValue;\n }\n\n private handleToggle = () => {\n this.isOpen = this.detailsEl.open;\n }\n\n private getOpenAttribute = () => {\n if (this.isOpen !== false) {\n return { open: true };\n }\n return '';\n }\n\n componentDidLoad() {\n this.detailsEl.addEventListener('toggle', this.handleToggle);\n }\n\n render() {\n return (\n <Host class=\"pds-accordion\" id={this.componentId}>\n <details {...this.getOpenAttribute()} ref={(el) => this.detailsEl = el as HTMLDetailsElement}>\n <summary>\n <slot name=\"label\">Details</slot>\n <pds-icon icon={this.isOpen ? upSmall : downSmall } />\n </summary>\n <div class=\"pds-accordion__body\">\n <slot />\n </div>\n </details>\n </Host>\n );\n }\n}\n"],"mappings":"wMAAA,IAAMA,EAAkB,orDACxB,IAAAC,EAAeD,E,ICWFE,EAAYC,EAAA,2B,mCAwBfC,KAAAC,aAAe,WACrBC,EAAKC,OAASD,EAAKE,UAAUC,I,EAGvBL,KAAAM,iBAAmB,WACzB,GAAIJ,EAAKC,SAAW,MAAO,CACzB,MAAO,CAAEE,KAAM,K,CAEjB,MAAO,E,yCAfY,K,CAGrBE,EAAAC,UAAAC,gBAAA,SAAgBC,GACdV,KAAKG,OAASO,C,EAchBH,EAAAC,UAAAG,iBAAA,WACEX,KAAKI,UAAUQ,iBAAiB,SAAUZ,KAAKC,a,EAGjDM,EAAAC,UAAAK,OAAA,eAAAX,EAAAF,KACE,OACEc,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAM,gBAAgBC,GAAIlB,KAAKmB,aACnCL,EAAA,UAAAM,OAAAC,OAAA,CAAAL,IAAA,4CAAahB,KAAKM,mBAAkB,CAAEgB,IAAK,SAACC,GAAO,OAAArB,EAAKE,UAAYmB,CAAjB,IACjDT,EAAA,WAAAE,IAAA,4CACEF,EAAA,QAAAE,IAAA,2CAAMQ,KAAK,SAAO,WAClBV,EAAA,YAAAE,IAAA,2CAAUS,KAAMzB,KAAKG,OAASuB,EAAUC,KAE1Cb,EAAA,OAAAE,IAAA,2CAAKC,MAAM,uBACTH,EAAA,QAAAE,IAAA,+C,uIAhDa,I"}
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
System.register(["./p-
|
|
1
|
+
System.register(["./p-c563d4e7.system.js"],(function(e){"use strict";var a,t,n,i;return{setters:[function(e){a=e.r;t=e.h;n=e.H;i=e.g}],execute:function(){var s=":host{display:block}.pds-tabpanel{display:none;margin-top:var(--panel-margin-top);padding:var(--panel-padding)}.pds-tabpanel.is-active{display:block}";var d=s;var l=e("pds_tabpanel",function(){function e(e){a(this,e);this.name=undefined;this.parentComponentId=undefined;this.variant=undefined;this.selected=false}e.prototype.render=function(){return t(n,{key:"e38cf8aa09d76ce8e971d4e64f635fd2ac237aad",slot:"tabpanels"},t("div",{key:"316151ef0e305ecba207d2ea6d171fcb0c28b539",role:"tabpanel",id:this.parentComponentId+"__"+this.name+"-panel",tabindex:"0","aria-labelledby":this.parentComponentId+"__"+this.name,class:this.selected?"pds-tabpanel is-active":"pds-tabpanel"},t("slot",{key:"4214b2d070c6964f7d3ae41b1ed3d6713aaddf11"})))};Object.defineProperty(e.prototype,"el",{get:function(){return i(this)},enumerable:false,configurable:true});return e}());l.style=d}}}));
|
|
2
|
+
//# sourceMappingURL=p-2dd4eacc.system.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["pdsTabpanelCss","PdsTabpanelStyle0","PdsTabpanel","exports","class_1","prototype","render","h","Host","key","slot","role","id","this","parentComponentId","name","tabindex","class","selected"],"sources":["src/components/pds-tabs/pds-tabpanel/pds-tabpanel.scss?tag=pds-tabpanel","src/components/pds-tabs/pds-tabpanel/pds-tabpanel.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.pds-tabpanel {\n display: none;\n margin-top: var(--panel-margin-top);\n padding: var(--panel-padding);\n\n &.is-active {\n display: block;\n }\n}\n","import { Component, Element, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pds-tabpanel',\n styleUrl: 'pds-tabpanel.scss',\n shadow: false,\n})\nexport class PdsTabpanel {\n @Element() el: HTMLPdsTabpanelElement;\n\n /**\n * Sets the related tab name, this name must match a `pds-tab`'s tab name property\n */\n @Prop() name!: string;\n\n /**\n * Keeps track of the parentComponentId unique id, this property is passed by parent component\n */\n /** @internal */\n @Prop() parentComponentId: string;\n\n /**\n * Keeps track of if the expected tab variant, this property is passed by parent component\n */\n /** @internal */\n @Prop() variant: string;\n\n /**\n * Keeps track of the tabpanel selected state, this property is passed by parent component\n */\n /** @internal */\n @Prop({mutable: true}) selected = false; // eslint-disable-line @stencil-community/strict-mutable\n\n render() {\n return (\n <Host slot=\"tabpanels\">\n <div\n role=\"tabpanel\"\n id={this.parentComponentId + \"__\" + this.name + '-panel'}\n tabindex=\"0\"\n aria-labelledby={this.parentComponentId + \"__\" + this.name}\n class={this.selected ? \"pds-tabpanel is-active\" : \"pds-tabpanel\"}\n >\n <slot />\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"0JAAA,IAAMA,EAAiB,wJACvB,IAAAC,EAAeD,E,ICMFE,EAAWC,EAAA,0B,kHAwBY,K,CAElCC,EAAAC,UAAAC,OAAA,WACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,KAAK,aACTH,EAAA,OAAAE,IAAA,2CACEE,KAAK,WACLC,GAAIC,KAAKC,kBAAoB,KAAOD,KAAKE,KAAO,SAChDC,SAAS,IAAG,kBACKH,KAAKC,kBAAoB,KAAOD,KAAKE,KACtDE,MAAOJ,KAAKK,SAAW,yBAA2B,gBAElDX,EAAA,QAAAE,IAAA,8C,uHApCc,I"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as e,h as r,H as a}from"./p-b5b5ce83.js";const s=".pds-sortable-item.sc-pds-sortable-item-h{--background-color-interactive:var(--pine-color-neutral-grey-200);--background-color:var(--pine-color-base-white);--border-radius:var(--pine-border-radius-md);--border:var(--pine-border-default);--box-shadow:var(--pine-box-shadow-lg);--color-interactive-handle:var(--pine-color-primary-300);--margin-inline-end:var(--pine-spacing-md);--padding-block-xs:var(--pine-spacing-xs);--padding-inline:var(--pine-spacing-md);--padding-inline-start:var(--pine-spacing-md);-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;padding-block:var(--padding-block-xs);padding-inline:var(--padding-inline)}.pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__actions.sc-pds-sortable-item{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-padding-start:var(--padding-inline-start);padding-inline-start:var(--padding-inline-start)}.pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__handle.sc-pds-sortable-item{line-height:1;-webkit-margin-end:var(--margin-inline-end);margin-inline-end:var(--margin-inline-end)}.pds-sortable--bordered .pds-sortable-item.sc-pds-sortable-item-h:first-child{border-start-end-radius:var(--border-radius);border-start-start-radius:var(--border-radius)}.pds-sortable--bordered .pds-sortable-item.sc-pds-sortable-item-h:last-child{border-end-end-radius:var(--border-radius);border-end-start-radius:var(--border-radius)}.pds-sortable--divided .pds-sortable-item.sc-pds-sortable-item-h{-webkit-border-after:var(--border);border-block-end:var(--border)}.pds-sortable--divided .pds-sortable-item.sc-pds-sortable-item-h:last-child{-webkit-border-after:0;border-block-end:0}.pds-sortable--handle-type-row .pds-sortable-item.sc-pds-sortable-item-h{cursor:-webkit-grab;cursor:grab}.pds-sortable--handle-type-handle .pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__handle.sc-pds-sortable-item{cursor:-webkit-grab;cursor:grab}.pds-sortable-item.sc-pds-sortable-item-h:hover{background-color:var(--background-color-interactive)}.pds-sortable-item.sc-pds-sortable-item-h:hover pds-icon.sc-pds-sortable-item{color:var(--color-interactive-handle)}.pds-sortable-item--drag.sc-pds-sortable-item-h{background-color:var(--background-color);border-radius:0;-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);opacity:1}.pds-sortable-item--ghost.sc-pds-sortable-item-h{background-color:var(--background-color-interactive);border-radius:0}";const d=s;const t=class{constructor(r){e(this,r);this.enableActions=false;this.componentId=undefined;this.handle=false}render(){return r(a,{key:"0af9e3cba44c18a8ded0ed71337076ebf761a437",class:"pds-sortable-item",id:this.componentId},this.handle&&r("div",{class:"pds-sortable-item__handle"},r("pds-icon",{name:"handle"})),r("slot",{key:"44365ade9216eacdf72723d4bbf18bac5e6ba734"}),this.enableActions&&r("div",{class:"pds-sortable-item__actions"},r("slot",{name:"sortable-item-actions"})))}};t.style=d;export{t as pds_sortable_item};
|
|
2
|
+
//# sourceMappingURL=p-2e531f68.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["pdsSortableItemCss","PdsSortableItemStyle0","PdsSortableItem","render","h","Host","key","class","id","this","componentId","handle","name","enableActions"],"sources":["src/components/pds-sortable/pds-sortable-item/pds-sortable-item.scss?tag=pds-sortable-item&encapsulation=scoped","src/components/pds-sortable/pds-sortable-item/pds-sortable-item.tsx"],"sourcesContent":[":host(.pds-sortable-item) {\n --background-color-interactive: var(--pine-color-neutral-grey-200);\n --background-color: var(--pine-color-base-white);\n --border-radius: var(--pine-border-radius-md);\n --border: var(--pine-border-default);\n --box-shadow: var(--pine-box-shadow-lg);\n --color-interactive-handle: var(--pine-color-primary-300);\n --margin-inline-end: var(--pine-spacing-md);\n --padding-block-xs: var(--pine-spacing-xs);\n --padding-inline: var(--pine-spacing-md);\n --padding-inline-start: var(--pine-spacing-md);\n\n align-items: center;\n display: flex;\n padding-block: var(--padding-block-xs);\n padding-inline: var(--padding-inline);\n\n .pds-sortable-item__actions {\n margin-inline-start: auto;\n padding-inline-start: var(--padding-inline-start);\n }\n\n .pds-sortable-item__handle {\n line-height: 1;\n margin-inline-end: var(--margin-inline-end);\n }\n\n // styles when sortable is bordered\n .pds-sortable--bordered & {\n &:first-child {\n border-start-end-radius: var(--border-radius);\n border-start-start-radius: var(--border-radius);\n }\n\n &:last-child {\n border-end-end-radius: var(--border-radius);\n border-end-start-radius: var(--border-radius);\n }\n }\n\n // styles when sortable is divided\n .pds-sortable--divided & {\n border-block-end: var(--border);\n\n &:last-child {\n border-block-end: 0;\n }\n }\n\n // cursor styles based on handle-type\n .pds-sortable--handle-type-row & {\n cursor: grab;\n }\n\n .pds-sortable--handle-type-handle & {\n .pds-sortable-item__handle {\n cursor: grab;\n }\n }\n}\n\n:host(.pds-sortable-item):hover {\n background-color: var(--background-color-interactive);\n\n pds-icon {\n color: var(--color-interactive-handle)\n }\n}\n\n:host(.pds-sortable-item--drag) {\n background-color: var(--background-color);\n border-radius: 0;\n box-shadow: var(--box-shadow);\n opacity: 1;\n}\n\n:host(.pds-sortable-item--ghost) {\n background-color: var(--background-color-interactive);\n border-radius: 0;\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n/**\n * @slot sortable-item-actions - Content is placed within the `pds-sortable-item__actions` element as children. This slot is only rendered if `actions` is set to `true`.\n */\n@Component({\n tag: 'pds-sortable-item',\n styleUrl: 'pds-sortable-item.scss',\n scoped: true,\n})\nexport class PdsSortableItem {\n /**\n * Determines whether `sortable-item-actions` slot should be enabled.\n * @defaultValue false\n */\n @Prop() enableActions = false;\n\n /**\n * A unique identifier used for the sortable item `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Determines whether `sortable-item` should have a handle.\n * @defaultValue false\n */\n @Prop() handle = false;\n\n render() {\n return (\n <Host class=\"pds-sortable-item\" id={this.componentId}>\n {this.handle && (\n <div class=\"pds-sortable-item__handle\">\n <pds-icon name=\"handle\"></pds-icon>\n </div>\n )}\n <slot></slot>\n {this.enableActions && (\n <div class=\"pds-sortable-item__actions\">\n <slot name=\"sortable-item-actions\" />\n </div>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"kDAAA,MAAMA,EAAqB,i5EAC3B,MAAAC,EAAeD,E,MCSFE,EAAe,M,4CAKF,M,uCAWP,K,CAEjB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAM,oBAAoBC,GAAIC,KAAKC,aACtCD,KAAKE,QACJP,EAAA,OAAKG,MAAM,6BACTH,EAAA,YAAUQ,KAAK,YAGnBR,EAAA,QAAAE,IAAA,6CACCG,KAAKI,eACJT,EAAA,OAAKG,MAAM,8BACTH,EAAA,QAAMQ,KAAK,2B"}
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
var __awaiter=this&&this.__awaiter||function(t,r,o,i){function e(t){return t instanceof o?t:new o((function(r){r(t)}))}return new(o||(o=Promise))((function(o,a){function n(t){try{l(i.next(t))}catch(t){a(t)}}function s(t){try{l(i["throw"](t))}catch(t){a(t)}}function l(t){t.done?o(t.value):e(t.value).then(n,s)}l((i=i.apply(t,r||[])).next())}))};var __generator=this&&this.__generator||function(t,r){var o={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},i,e,a,n;return n={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(n[Symbol.iterator]=function(){return this}),n;function s(t){return function(r){return l([t,r])}}function l(s){if(i)throw new TypeError("Generator is already executing.");while(n&&(n=0,s[0]&&(o=0)),o)try{if(i=1,e&&(a=s[0]&2?e["return"]:s[0]?e["throw"]||((a=e["return"])&&a.call(e),0):e.next)&&!(a=a.call(e,s[1])).done)return a;if(e=0,a)s=[s[0]&2,a.value];switch(s[0]){case 0:case 1:a=s;break;case 4:o.label++;return{value:s[1],done:false};case 5:o.label++;e=s[1];s=[0];continue;case 7:s=o.ops.pop();o.trys.pop();continue;default:if(!(a=o.trys,a=a.length>0&&a[a.length-1])&&(s[0]===6||s[0]===2)){o=0;continue}if(s[0]===3&&(!a||s[1]>a[0]&&s[1]<a[3])){o.label=s[1];break}if(s[0]===6&&o.label<a[1]){o.label=a[1];a=s;break}if(a&&o.label<a[2]){o.label=a[2];o.ops.push(s);break}if(a[2])o.ops.pop();o.trys.pop();continue}s=r.call(t,o)}catch(t){s=[6,t];e=0}finally{i=a=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};System.register(["./p-8248c25e.system.js"],(function(t){"use strict";var r,o,i,e,a;return{setters:[function(t){r=t.r;o=t.c;i=t.h;e=t.H;a=t.g}],execute:function(){var n=function(t){var r=t.elem,o=t.elemPlacement,i=t.overlay,e=t.offset,a=e===void 0?8:e;if(r==undefined)return;var n=r.getBoundingClientRect();var s=i.getBoundingClientRect();if(!o||o=="")return;switch(true){case o.includes("right"):i.style.top="50%";i.style.left="calc(".concat(n.width,"px + ").concat(a,"px)");i.style.transform="translateY(-50%)";if(o.includes("start")){i.style.top="0";i.style.transform="translateY(0)"}if(o.includes("end")){i.style.bottom="0";i.style.top="initial";i.style.transform="translateY(0)"}break;case o.includes("left"):i.style.top="50%";i.style.right="calc(".concat(n.width,"px + ").concat(a,"px)");i.style.transform="translateY(-50%)";if(o.includes("start")){i.style.top="0";i.style.transform="translateY(0)"}if(o.includes("end")){i.style.bottom="0";i.style.top="initial";i.style.transform="translateY(0)"}break;case o.includes("bottom"):i.style.top="calc(".concat(n.height,"px + ").concat(a,"px)");i.style.left="50%";i.style.transform="translateX(-50%)";if(o.includes("start")){i.style.left="0";i.style.transform="translateX(0)"}if(o.includes("end")){i.style.left="initial";i.style.right="0";i.style.transform="translateX(0)"}break;case o.includes("top"):i.style.top="calc((".concat(s.height,"px + ").concat(a,"px) * -1)");i.style.left="50%";i.style.transform="translateX(-50%)";if(o.includes("start")){i.style.left="0";i.style.transform="translateX(0)"}if(o.includes("end")){i.style.left="initial";i.style.right="0";i.style.transform="translateX(0)"}break}};var s=':host{--background-color:var(--pine-color-neutral-charcoal-400);--box-shadow:var(--pine-box-shadow-md);--color:var(--pine-color-base-white);--width:320px;--arrow-size:6px;--arrow-offset:14px;--overlay-border-radius:var(--pine-border-radius-md);--overlay-font-size:var(--pine-font-size-body-sm);--overlay-line-height:var(--pine-line-height-sm);--overlay-padding:var(--pine-spacing-xs) calc(var(--pine-spacing-md) / 2);--arrow-pointing-down:var(--arrow-size) var(--arrow-size) 0;--arrow-pointing-to-the-right:var(--arrow-size) 0 var(--arrow-size) var(--arrow-size);--arrow-pointing-to-the-left:var(--arrow-size) var(--arrow-size) var(--arrow-size) 0;--arrow-pointing-up:0 var(--arrow-size) var(--arrow-size);display:inline-block;position:relative}:host ::slotted([slot=content]){white-space:normal;width:var(--width)}.pds-tooltip__content{background-color:var(--background-color);border-radius:var(--overlay-border-radius);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);color:var(--color);font-size:var(--overlay-font-size);line-height:var(--overlay-line-height);opacity:0;padding:var(--overlay-padding);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(--arrow-pointing-to-the-left);content:"";height:0;position:absolute;width:0}.pds-tooltip--right .pds-tooltip__content::after{border-inline-end-color:var(--background-color);border-width:var(--arrow-pointing-to-the-left);left:calc(var(--arrow-size) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--right-end .pds-tooltip__content::after{border-inline-end-color:var(--background-color);border-width:var(--arrow-pointing-to-the-left);bottom:var(--arrow-offset);left:calc(var(--arrow-size) * -1);top:initial}.pds-tooltip--right-start .pds-tooltip__content::after{border-inline-end-color:var(--background-color);border-width:var(--arrow-pointing-to-the-left);left:calc(var(--arrow-size) * -1);top:var(--arrow-offset)}.pds-tooltip--top .pds-tooltip__content::after{border-block-start-color:var(--background-color);border-width:var(--arrow-pointing-down);bottom:calc(var(--arrow-size) * -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(--background-color);border-width:var(--arrow-pointing-down);bottom:calc(var(--arrow-size) * -1);left:var(--arrow-offset);top:initial}.pds-tooltip--top-end .pds-tooltip__content::after{border-block-start-color:var(--background-color);border-width:var(--arrow-pointing-down);bottom:calc(var(--arrow-size) * -1);left:initial;right:var(--arrow-offset);top:initial}.pds-tooltip--left .pds-tooltip__content::after{border-inline-start-color:var(--background-color);border-width:var(--arrow-pointing-to-the-right);left:initial;right:calc(var(--arrow-size) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--left-end .pds-tooltip__content::after{border-inline-start-color:var(--background-color);border-width:var(--arrow-pointing-to-the-right);bottom:var(--arrow-offset);left:initial;right:calc(var(--arrow-size) * -1);top:initial}.pds-tooltip--left-start .pds-tooltip__content::after{border-inline-start-color:var(--background-color);border-width:var(--arrow-pointing-to-the-right);left:initial;right:calc(var(--arrow-size) * -1);top:var(--arrow-offset)}.pds-tooltip--bottom .pds-tooltip__content::after{border-block-end-color:var(--background-color);border-width:var(--arrow-pointing-up);left:50%;top:calc(var(--arrow-size) * -1);-webkit-transform:translateX(-50%);transform:translateX(-50%)}.pds-tooltip--bottom-end .pds-tooltip__content::after{border-block-end-color:var(--background-color);border-width:var(--arrow-pointing-up);left:initial;right:var(--arrow-offset);top:calc(var(--arrow-size) * -1)}.pds-tooltip--bottom-start .pds-tooltip__content::after{border-block-end-color:var(--background-color);border-width:var(--arrow-pointing-up);left:var(--arrow-offset);top:calc(var(--arrow-size) * -1)}.pds-tooltip--no-arrow .pds-tooltip__content::after{border-width:0}';var l=s;var c=t("pds_tooltip",function(){function t(t){var i=this;r(this,t);this.pdsTooltipHide=o(this,"pdsTooltipHide",7);this.pdsTooltipShow=o(this,"pdsTooltipShow",7);this.handleHide=function(){i.hideTooltip();i.pdsTooltipHide.emit()};this.handleShow=function(){i.showTooltip();i.pdsTooltipShow.emit()};this.isOpen=false;this.content=undefined;this.componentId=undefined;this.hasArrow=true;this.htmlContent=false;this.placement="right";this.opened=false}t.prototype.handleOpenToggle=function(){if(this.opened){this.handleShow()}else{this.handleHide()}};t.prototype.componentWillLoad=function(){if(this.opened){this.showTooltip()}this.el.addEventListener("blur",this.handleHide,true);this.el.addEventListener("focus",this.handleShow,true)};t.prototype.componentDidUpdate=function(){if(this.opened){this.showTooltip()}};t.prototype.componentDidRender=function(){n({elem:this.el,elemPlacement:this.placement,overlay:this.contentEl})};t.prototype.showTooltip=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.opened=true;return[2]}))}))};t.prototype.hideTooltip=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.opened=false;return[2]}))}))};t.prototype.render=function(){var t=this;return i(e,{key:"b4b6ca5fbf3a5b99b4fe74d4b874c81f51d46e8d",onMouseEnter:this.handleShow,onMouseLeave:this.handleHide,onFocusin:this.handleShow,onFocusout:this.handleHide},i("div",{key:"234af23d5c082cbaf02c3f4026d094e19514520e",class:"\n pds-tooltip\n pds-tooltip--".concat(this.placement,"\n ").concat(this.htmlContent?"pds-tooltip--has-html-content":"","\n ").concat(this.opened?"pds-tooltip--is-open":"","\n ").concat(this.hasArrow?"":"pds-tooltip--no-arrow","\n ")},i("span",{key:"8636e6ec54ca42b7a96683b2a97f26ee4994ce75","aria-describedby":this.componentId,class:"pds-tooltip__trigger"},i("slot",{key:"915856a37e16dd9a5d19afec7111d90f3a1e1d0d"})),i("div",{key:"0e50c1c3559cfc529da2fc67a8b248e63ad8f75b",class:"pds-tooltip__content","aria-hidden":this.opened?"false":"true","aria-live":this.opened?"polite":"off",id:this.componentId,ref:function(r){return t.contentEl=r},role:"tooltip"},i("slot",{key:"dafafd2a343b10ed140eb5bd325d3b17a3dc062a",name:"content"}),this.content)))};Object.defineProperty(t.prototype,"el",{get:function(){return a(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{opened:["handleOpenToggle"]}},enumerable:false,configurable:true});return t}());c.style=l}}}));
|
|
1
|
+
var __awaiter=this&&this.__awaiter||function(t,r,o,i){function e(t){return t instanceof o?t:new o((function(r){r(t)}))}return new(o||(o=Promise))((function(o,a){function n(t){try{l(i.next(t))}catch(t){a(t)}}function s(t){try{l(i["throw"](t))}catch(t){a(t)}}function l(t){t.done?o(t.value):e(t.value).then(n,s)}l((i=i.apply(t,r||[])).next())}))};var __generator=this&&this.__generator||function(t,r){var o={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},i,e,a,n;return n={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(n[Symbol.iterator]=function(){return this}),n;function s(t){return function(r){return l([t,r])}}function l(s){if(i)throw new TypeError("Generator is already executing.");while(n&&(n=0,s[0]&&(o=0)),o)try{if(i=1,e&&(a=s[0]&2?e["return"]:s[0]?e["throw"]||((a=e["return"])&&a.call(e),0):e.next)&&!(a=a.call(e,s[1])).done)return a;if(e=0,a)s=[s[0]&2,a.value];switch(s[0]){case 0:case 1:a=s;break;case 4:o.label++;return{value:s[1],done:false};case 5:o.label++;e=s[1];s=[0];continue;case 7:s=o.ops.pop();o.trys.pop();continue;default:if(!(a=o.trys,a=a.length>0&&a[a.length-1])&&(s[0]===6||s[0]===2)){o=0;continue}if(s[0]===3&&(!a||s[1]>a[0]&&s[1]<a[3])){o.label=s[1];break}if(s[0]===6&&o.label<a[1]){o.label=a[1];a=s;break}if(a&&o.label<a[2]){o.label=a[2];o.ops.push(s);break}if(a[2])o.ops.pop();o.trys.pop();continue}s=r.call(t,o)}catch(t){s=[6,t];e=0}finally{i=a=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};System.register(["./p-c563d4e7.system.js"],(function(t){"use strict";var r,o,i,e,a;return{setters:[function(t){r=t.r;o=t.c;i=t.h;e=t.H;a=t.g}],execute:function(){var n=function(t){var r=t.elem,o=t.elemPlacement,i=t.overlay,e=t.offset,a=e===void 0?8:e;if(r==undefined)return;var n=r.getBoundingClientRect();var s=i.getBoundingClientRect();if(!o||o=="")return;switch(true){case o.includes("right"):i.style.top="50%";i.style.left="calc(".concat(n.width,"px + ").concat(a,"px)");i.style.transform="translateY(-50%)";if(o.includes("start")){i.style.top="0";i.style.transform="translateY(0)"}if(o.includes("end")){i.style.bottom="0";i.style.top="initial";i.style.transform="translateY(0)"}break;case o.includes("left"):i.style.top="50%";i.style.right="calc(".concat(n.width,"px + ").concat(a,"px)");i.style.transform="translateY(-50%)";if(o.includes("start")){i.style.top="0";i.style.transform="translateY(0)"}if(o.includes("end")){i.style.bottom="0";i.style.top="initial";i.style.transform="translateY(0)"}break;case o.includes("bottom"):i.style.top="calc(".concat(n.height,"px + ").concat(a,"px)");i.style.left="50%";i.style.transform="translateX(-50%)";if(o.includes("start")){i.style.left="0";i.style.transform="translateX(0)"}if(o.includes("end")){i.style.left="initial";i.style.right="0";i.style.transform="translateX(0)"}break;case o.includes("top"):i.style.top="calc((".concat(s.height,"px + ").concat(a,"px) * -1)");i.style.left="50%";i.style.transform="translateX(-50%)";if(o.includes("start")){i.style.left="0";i.style.transform="translateX(0)"}if(o.includes("end")){i.style.left="initial";i.style.right="0";i.style.transform="translateX(0)"}break}};var s=':host{--background-color:var(--pine-color-neutral-charcoal-400);--box-shadow:var(--pine-box-shadow-md);--color:var(--pine-color-base-white);--width:320px;--arrow-size:6px;--arrow-offset:14px;--overlay-border-radius:var(--pine-border-radius-md);--overlay-font-size:var(--pine-font-size-body-sm);--overlay-line-height:var(--pine-line-height-sm);--overlay-padding:var(--pine-spacing-xs) calc(var(--pine-spacing-md) / 2);--arrow-pointing-down:var(--arrow-size) var(--arrow-size) 0;--arrow-pointing-to-the-right:var(--arrow-size) 0 var(--arrow-size) var(--arrow-size);--arrow-pointing-to-the-left:var(--arrow-size) var(--arrow-size) var(--arrow-size) 0;--arrow-pointing-up:0 var(--arrow-size) var(--arrow-size);display:inline-block;position:relative}:host ::slotted([slot=content]){white-space:normal;width:var(--width)}.pds-tooltip__content{background-color:var(--background-color);border-radius:var(--overlay-border-radius);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);color:var(--color);font-size:var(--overlay-font-size);line-height:var(--overlay-line-height);opacity:0;padding:var(--overlay-padding);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(--arrow-pointing-to-the-left);content:"";height:0;position:absolute;width:0}.pds-tooltip--right .pds-tooltip__content::after{border-inline-end-color:var(--background-color);border-width:var(--arrow-pointing-to-the-left);left:calc(var(--arrow-size) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--right-end .pds-tooltip__content::after{border-inline-end-color:var(--background-color);border-width:var(--arrow-pointing-to-the-left);bottom:var(--arrow-offset);left:calc(var(--arrow-size) * -1);top:initial}.pds-tooltip--right-start .pds-tooltip__content::after{border-inline-end-color:var(--background-color);border-width:var(--arrow-pointing-to-the-left);left:calc(var(--arrow-size) * -1);top:var(--arrow-offset)}.pds-tooltip--top .pds-tooltip__content::after{border-block-start-color:var(--background-color);border-width:var(--arrow-pointing-down);bottom:calc(var(--arrow-size) * -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(--background-color);border-width:var(--arrow-pointing-down);bottom:calc(var(--arrow-size) * -1);left:var(--arrow-offset);top:initial}.pds-tooltip--top-end .pds-tooltip__content::after{border-block-start-color:var(--background-color);border-width:var(--arrow-pointing-down);bottom:calc(var(--arrow-size) * -1);left:initial;right:var(--arrow-offset);top:initial}.pds-tooltip--left .pds-tooltip__content::after{border-inline-start-color:var(--background-color);border-width:var(--arrow-pointing-to-the-right);left:initial;right:calc(var(--arrow-size) * -1);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.pds-tooltip--left-end .pds-tooltip__content::after{border-inline-start-color:var(--background-color);border-width:var(--arrow-pointing-to-the-right);bottom:var(--arrow-offset);left:initial;right:calc(var(--arrow-size) * -1);top:initial}.pds-tooltip--left-start .pds-tooltip__content::after{border-inline-start-color:var(--background-color);border-width:var(--arrow-pointing-to-the-right);left:initial;right:calc(var(--arrow-size) * -1);top:var(--arrow-offset)}.pds-tooltip--bottom .pds-tooltip__content::after{border-block-end-color:var(--background-color);border-width:var(--arrow-pointing-up);left:50%;top:calc(var(--arrow-size) * -1);-webkit-transform:translateX(-50%);transform:translateX(-50%)}.pds-tooltip--bottom-end .pds-tooltip__content::after{border-block-end-color:var(--background-color);border-width:var(--arrow-pointing-up);left:initial;right:var(--arrow-offset);top:calc(var(--arrow-size) * -1)}.pds-tooltip--bottom-start .pds-tooltip__content::after{border-block-end-color:var(--background-color);border-width:var(--arrow-pointing-up);left:var(--arrow-offset);top:calc(var(--arrow-size) * -1)}.pds-tooltip--no-arrow .pds-tooltip__content::after{border-width:0}';var l=s;var c=t("pds_tooltip",function(){function t(t){var i=this;r(this,t);this.pdsTooltipHide=o(this,"pdsTooltipHide",7);this.pdsTooltipShow=o(this,"pdsTooltipShow",7);this.handleHide=function(){i.hideTooltip();i.pdsTooltipHide.emit()};this.handleShow=function(){i.showTooltip();i.pdsTooltipShow.emit()};this.isOpen=false;this.content=undefined;this.componentId=undefined;this.hasArrow=true;this.htmlContent=false;this.placement="right";this.opened=false}t.prototype.handleOpenToggle=function(){if(this.opened){this.handleShow()}else{this.handleHide()}};t.prototype.componentWillLoad=function(){if(this.opened){this.showTooltip()}this.el.addEventListener("blur",this.handleHide,true);this.el.addEventListener("focus",this.handleShow,true)};t.prototype.componentDidUpdate=function(){if(this.opened){this.showTooltip()}};t.prototype.componentDidRender=function(){n({elem:this.el,elemPlacement:this.placement,overlay:this.contentEl})};t.prototype.showTooltip=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.opened=true;return[2]}))}))};t.prototype.hideTooltip=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.opened=false;return[2]}))}))};t.prototype.render=function(){var t=this;return i(e,{key:"b4b6ca5fbf3a5b99b4fe74d4b874c81f51d46e8d",onMouseEnter:this.handleShow,onMouseLeave:this.handleHide,onFocusin:this.handleShow,onFocusout:this.handleHide},i("div",{key:"234af23d5c082cbaf02c3f4026d094e19514520e",class:"\n pds-tooltip\n pds-tooltip--".concat(this.placement,"\n ").concat(this.htmlContent?"pds-tooltip--has-html-content":"","\n ").concat(this.opened?"pds-tooltip--is-open":"","\n ").concat(this.hasArrow?"":"pds-tooltip--no-arrow","\n ")},i("span",{key:"8636e6ec54ca42b7a96683b2a97f26ee4994ce75","aria-describedby":this.componentId,class:"pds-tooltip__trigger"},i("slot",{key:"915856a37e16dd9a5d19afec7111d90f3a1e1d0d"})),i("div",{key:"0e50c1c3559cfc529da2fc67a8b248e63ad8f75b",class:"pds-tooltip__content","aria-hidden":this.opened?"false":"true","aria-live":this.opened?"polite":"off",id:this.componentId,ref:function(r){return t.contentEl=r},role:"tooltip"},i("slot",{key:"dafafd2a343b10ed140eb5bd325d3b17a3dc062a",name:"content"}),this.content)))};Object.defineProperty(t.prototype,"el",{get:function(){return a(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{opened:["handleOpenToggle"]}},enumerable:false,configurable:true});return t}());c.style=l}}}));
|
|
2
|
+
//# sourceMappingURL=p-315a1809.system.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["positionTooltip","_a","elem","elemPlacement","overlay","_b","offset","undefined","rect","getBoundingClientRect","contentRect","includes","style","top","left","concat","width","transform","bottom","right","height","pdsTooltipCss","PdsTooltipStyle0","PdsTooltip","exports","this","handleHide","_this","hideTooltip","pdsTooltipHide","emit","handleShow","showTooltip","pdsTooltipShow","class_1","prototype","handleOpenToggle","opened","componentWillLoad","el","addEventListener","componentDidUpdate","componentDidRender","placement","contentEl","render","h","Host","key","onMouseEnter","onMouseLeave","onFocusin","onFocusout","class","htmlContent","hasArrow","componentId","id","ref","role","name","content"],"sources":["src/utils/overlay.ts","src/components/pds-tooltip/pds-tooltip.scss?tag=pds-tooltip&encapsulation=shadow","src/components/pds-tooltip/pds-tooltip.tsx"],"sourcesContent":["interface OverlayArgs {\n elem: HTMLElement;\n elemPlacement: string;\n overlay: HTMLElement;\n offset?: number;\n}\n\nexport const positionTooltip = ({elem, elemPlacement, overlay, offset = 8}: OverlayArgs) => {\n if (elem == undefined) return;\n\n const rect = elem.getBoundingClientRect();\n const contentRect = overlay.getBoundingClientRect();\n\n // Exit the function if the placement is not set\n if (!elemPlacement || elemPlacement == \"\") return;\n\n switch (true) {\n case elemPlacement.includes(\"right\"):\n overlay.style.top = '50%';\n overlay.style.left = `calc(${rect.width}px + ${offset}px)`;\n overlay.style.transform = 'translateY(-50%)';\n\n if (elemPlacement.includes(\"start\")) {\n overlay.style.top = '0';\n overlay.style.transform = 'translateY(0)';\n }\n\n if (elemPlacement.includes(\"end\")) {\n overlay.style.bottom = '0';\n overlay.style.top = 'initial';\n overlay.style.transform = 'translateY(0)';\n }\n\n break;\n\n case elemPlacement.includes(\"left\"):\n overlay.style.top = '50%';\n overlay.style.right = `calc(${rect.width}px + ${offset}px)`;\n overlay.style.transform = 'translateY(-50%)';\n\n if (elemPlacement.includes(\"start\")) {\n overlay.style.top = '0';\n overlay.style.transform = 'translateY(0)';\n }\n\n if (elemPlacement.includes(\"end\")) {\n overlay.style.bottom = '0';\n overlay.style.top = 'initial';\n overlay.style.transform = 'translateY(0)';\n }\n\n break;\n\n case elemPlacement.includes(\"bottom\"):\n overlay.style.top = `calc(${rect.height}px + ${offset}px)`;\n overlay.style.left = '50%';\n overlay.style.transform = 'translateX(-50%)';\n\n if (elemPlacement.includes(\"start\")) {\n overlay.style.left = '0';\n overlay.style.transform = 'translateX(0)';\n }\n\n if (elemPlacement.includes(\"end\")) {\n overlay.style.left = 'initial';\n overlay.style.right = '0';\n overlay.style.transform = 'translateX(0)';\n }\n\n break;\n\n case elemPlacement.includes(\"top\"):\n overlay.style.top = `calc((${contentRect.height}px + ${offset}px) * -1)`;\n overlay.style.left = '50%';\n overlay.style.transform = 'translateX(-50%)';\n\n if (elemPlacement.includes(\"start\")) {\n overlay.style.left = '0';\n overlay.style.transform = 'translateX(0)';\n }\n if (elemPlacement.includes(\"end\")) {\n overlay.style.left = 'initial';\n overlay.style.right = '0';\n overlay.style.transform = 'translateX(0)';\n }\n\n break;\n }\n}\n",":host {\n --background-color: var(--pine-color-neutral-charcoal-400);\n --box-shadow: var(--pine-box-shadow-md);\n --color: var(--pine-color-base-white);\n --width: 320px;\n --arrow-size: 6px;\n --arrow-offset: 14px;\n\n --overlay-border-radius: var(--pine-border-radius-md);\n --overlay-font-size: var(--pine-font-size-body-sm);\n --overlay-line-height: var(--pine-line-height-sm);\n --overlay-padding: var(--pine-spacing-xs) calc(var(--pine-spacing-md) / 2);\n\n --arrow-pointing-down: var(--arrow-size) var(--arrow-size) 0;\n --arrow-pointing-to-the-right: var(--arrow-size) 0 var(--arrow-size) var(--arrow-size);\n --arrow-pointing-to-the-left: var(--arrow-size) var(--arrow-size) var(--arrow-size) 0;\n --arrow-pointing-up: 0 var(--arrow-size) var(--arrow-size);\n\n display: inline-block;\n position: relative;\n\n ::slotted([slot=\"content\"]) {\n white-space: normal;\n width: var(--width);\n }\n}\n\n.pds-tooltip__content {\n background-color: var(--background-color);\n border-radius: var(--overlay-border-radius);\n box-shadow: var(--box-shadow);\n color: var(--color);\n font-size: var(--overlay-font-size);\n line-height: var(--overlay-line-height);\n // TODO: need to use block / none but the tooltip content width and height are needed for calculations\n opacity: 0;\n padding: var(--overlay-padding);\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(--arrow-pointing-to-the-left);\n content: '';\n height: 0;\n position: absolute;\n width: 0;\n\n .pds-tooltip--right & {\n border-inline-end-color: var(--background-color);\n border-width: var(--arrow-pointing-to-the-left);\n left: calc(var(--arrow-size) * -1);\n top: 50%;\n transform: translateY(-50%);\n }\n\n .pds-tooltip--right-end & {\n border-inline-end-color: var(--background-color);\n border-width: var(--arrow-pointing-to-the-left);\n bottom: var(--arrow-offset);\n left: calc(var(--arrow-size) * -1);\n top: initial;\n }\n\n .pds-tooltip--right-start & {\n border-inline-end-color: var(--background-color);\n border-width: var(--arrow-pointing-to-the-left);\n left: calc(var(--arrow-size) * -1);\n top: var(--arrow-offset);\n }\n\n .pds-tooltip--top & {\n border-block-start-color: var(--background-color);\n border-width: var(--arrow-pointing-down);\n bottom: calc(var(--arrow-size) * -1);\n left: 50%;\n top: initial;\n transform: translateX(-50%);\n }\n\n .pds-tooltip--top-start & {\n border-block-start-color: var(--background-color);\n border-width: var(--arrow-pointing-down);\n bottom: calc(var(--arrow-size) * -1);\n left: var(--arrow-offset);\n top: initial;\n }\n\n .pds-tooltip--top-end & {\n border-block-start-color: var(--background-color);\n border-width: var(--arrow-pointing-down);\n bottom: calc(var(--arrow-size) * -1);\n left: initial;\n right: var(--arrow-offset);\n top: initial;\n }\n\n .pds-tooltip--left & {\n border-inline-start-color: var(--background-color);\n border-width: var(--arrow-pointing-to-the-right);\n left: initial;\n right: calc(var(--arrow-size) * -1);\n top: 50%;\n transform: translateY(-50%);\n }\n\n .pds-tooltip--left-end & {\n border-inline-start-color: var(--background-color);\n border-width: var(--arrow-pointing-to-the-right);\n bottom: var(--arrow-offset);\n left: initial;\n right: calc(var(--arrow-size) * -1);\n top: initial;\n }\n\n .pds-tooltip--left-start & {\n border-inline-start-color: var(--background-color);\n border-width: var(--arrow-pointing-to-the-right);\n left: initial;\n right: calc(var(--arrow-size) * -1);\n top: var(--arrow-offset);\n }\n\n .pds-tooltip--bottom & {\n border-block-end-color: var(--background-color);\n border-width: var(--arrow-pointing-up);\n left: 50%;\n top: calc(var(--arrow-size) * -1);\n transform: translateX(-50%);\n }\n\n .pds-tooltip--bottom-end & {\n border-block-end-color: var(--background-color);\n border-width: var(--arrow-pointing-up);\n left: initial;\n right: var(--arrow-offset);\n top: calc(var(--arrow-size) * -1);\n }\n\n .pds-tooltip--bottom-start & {\n border-block-end-color: var(--background-color);\n border-width: var(--arrow-pointing-up);\n left: var(--arrow-offset);\n top: calc(var(--arrow-size) * -1);\n }\n\n .pds-tooltip--no-arrow & {\n border-width: 0;\n }\n }\n}\n","import { Component, Element, Event, Host, Prop, State, h, EventEmitter, 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 styleUrl: '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 * 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 /**\n * Emitted after a tooltip is closed\n */\n @Event() pdsTooltipHide: EventEmitter;\n\n /**\n * Emitted after a tooltip is shown\n */\n @Event() pdsTooltipShow: EventEmitter;\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 this.pdsTooltipHide.emit();\n };\n\n private handleShow = () => {\n this.showTooltip();\n this.pdsTooltipShow.emit();\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 >\n <slot\n name=\"content\"\n ></slot>\n {this.content}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"gnDAOO,IAAMA,EAAkB,SAACC,G,IAACC,EAAID,EAAAC,KAAEC,EAAaF,EAAAE,cAAEC,EAAOH,EAAAG,QAAEC,EAAAJ,EAAAK,SAAMD,SAAA,EAAG,EAACA,EACvE,GAAIH,GAAQK,UAAW,OAEvB,IAAMC,EAAON,EAAKO,wBAClB,IAAMC,EAAcN,EAAQK,wBAG5B,IAAKN,GAAiBA,GAAiB,GAAI,OAE3C,OAAQ,MACN,KAAKA,EAAcQ,SAAS,SAC1BP,EAAQQ,MAAMC,IAAM,MACpBT,EAAQQ,MAAME,KAAO,QAAAC,OAAQP,EAAKQ,MAAK,SAAAD,OAAQT,EAAM,OACrDF,EAAQQ,MAAMK,UAAY,mBAE1B,GAAId,EAAcQ,SAAS,SAAU,CACnCP,EAAQQ,MAAMC,IAAM,IACpBT,EAAQQ,MAAMK,UAAY,e,CAG5B,GAAId,EAAcQ,SAAS,OAAQ,CACjCP,EAAQQ,MAAMM,OAAS,IACvBd,EAAQQ,MAAMC,IAAM,UACpBT,EAAQQ,MAAMK,UAAY,e,CAG5B,MAEF,KAAKd,EAAcQ,SAAS,QAC1BP,EAAQQ,MAAMC,IAAM,MACpBT,EAAQQ,MAAMO,MAAQ,QAAAJ,OAAQP,EAAKQ,MAAK,SAAAD,OAAQT,EAAM,OACtDF,EAAQQ,MAAMK,UAAY,mBAE1B,GAAId,EAAcQ,SAAS,SAAU,CACnCP,EAAQQ,MAAMC,IAAM,IACpBT,EAAQQ,MAAMK,UAAY,e,CAG5B,GAAId,EAAcQ,SAAS,OAAQ,CACjCP,EAAQQ,MAAMM,OAAS,IACvBd,EAAQQ,MAAMC,IAAM,UACpBT,EAAQQ,MAAMK,UAAY,e,CAG5B,MAEF,KAAKd,EAAcQ,SAAS,UAC1BP,EAAQQ,MAAMC,IAAM,QAAAE,OAAQP,EAAKY,OAAM,SAAAL,OAAQT,EAAM,OACrDF,EAAQQ,MAAME,KAAO,MACrBV,EAAQQ,MAAMK,UAAY,mBAE1B,GAAId,EAAcQ,SAAS,SAAU,CACnCP,EAAQQ,MAAME,KAAO,IACrBV,EAAQQ,MAAMK,UAAY,e,CAG5B,GAAId,EAAcQ,SAAS,OAAQ,CACjCP,EAAQQ,MAAME,KAAO,UACrBV,EAAQQ,MAAMO,MAAQ,IACtBf,EAAQQ,MAAMK,UAAY,e,CAG5B,MAEF,KAAKd,EAAcQ,SAAS,OAC1BP,EAAQQ,MAAMC,IAAM,SAAAE,OAASL,EAAYU,OAAM,SAAAL,OAAQT,EAAM,aAC7DF,EAAQQ,MAAME,KAAO,MACrBV,EAAQQ,MAAMK,UAAY,mBAE1B,GAAId,EAAcQ,SAAS,SAAU,CACnCP,EAAQQ,MAAME,KAAO,IACrBV,EAAQQ,MAAMK,UAAY,e,CAE5B,GAAId,EAAcQ,SAAS,OAAQ,CACjCP,EAAQQ,MAAME,KAAO,UACrBV,EAAQQ,MAAMO,MAAQ,IACtBf,EAAQQ,MAAMK,UAAY,e,CAG5B,MAEN,ECxFA,IAAMI,EAAgB,yyIACtB,IAAAC,EAAeD,E,ICcFE,EAAUC,EAAA,yB,iIAkHbC,KAAAC,WAAa,WACnBC,EAAKC,cACLD,EAAKE,eAAeC,M,EAGdL,KAAAM,WAAa,WACnBJ,EAAKK,cACLL,EAAKM,eAAeH,M,cA7GJ,M,gEAgBE,K,iBAME,M,eAkBL,Q,YAM8B,K,CAG/CI,EAAAC,UAAAC,iBAAA,WACE,GAAIX,KAAKY,OAAQ,CACfZ,KAAKM,Y,KACA,CACLN,KAAKC,Y,GAcTQ,EAAAC,UAAAG,kBAAA,WACE,GAAIb,KAAKY,OAAQ,CACfZ,KAAKO,a,CAGPP,KAAKc,GAAGC,iBAAiB,OAAQf,KAAKC,WAAY,MAClDD,KAAKc,GAAGC,iBAAiB,QAASf,KAAKM,WAAY,K,EAGrDG,EAAAC,UAAAM,mBAAA,WACE,GAAIhB,KAAKY,OAAQ,CACfZ,KAAKO,a,GAITE,EAAAC,UAAAO,mBAAA,WACE1C,EAAgB,CAACE,KAAMuB,KAAKc,GAAIpC,cAAesB,KAAKkB,UAAWvC,QAASqB,KAAKmB,W,EAOzEV,EAAAC,UAAAH,YAAN,W,qFACEP,KAAKY,OAAS,K,iBAOVH,EAAAC,UAAAP,YAAN,W,qFACEH,KAAKY,OAAS,M,iBAahBH,EAAAC,UAAAU,OAAA,eAAAlB,EAAAF,KACE,OACEqB,EAACC,EAAI,CAAAC,IAAA,2CACHC,aAAcxB,KAAKM,WACnBmB,aAAczB,KAAKC,WACnByB,UAAW1B,KAAKM,WAChBqB,WAAY3B,KAAKC,YAEjBoB,EAAA,OAAAE,IAAA,2CACEK,MAAO,uDAAAtC,OAEUU,KAAKkB,UAAS,kBAAA5B,OAC3BU,KAAK6B,YAAc,gCAAkC,GAAE,kBAAAvC,OACvDU,KAAKY,OAAS,uBAAyB,GAAE,kBAAAtB,OACzCU,KAAK8B,SAAW,GAAK,wBAAuB,iBAGhDT,EAAA,QAAAE,IAAA,8DACoBvB,KAAK+B,YACvBH,MAAM,wBAENP,EAAA,QAAAE,IAAA,8CAGFF,EAAA,OAAAE,IAAA,2CAAKK,MAAM,uBAAsB,cAClB5B,KAAKY,OAAS,QAAU,OAAM,YAChCZ,KAAKY,OAAS,SAAW,MACpCoB,GAAIhC,KAAK+B,YACTE,IAAK,SAACnB,GAAE,OAAMZ,EAAKiB,UAAYL,CAAvB,EACRoB,KAAK,WAELb,EAAA,QAAAE,IAAA,2CACEY,KAAK,YAENnC,KAAKoC,U,oPA9JK,I"}
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
System.register(["./p-
|
|
1
|
+
System.register(["./p-c563d4e7.system.js"],(function(d){"use strict";var i,s,e;return{setters:[function(d){i=d.r;s=d.h;e=d.H}],execute:function(){var f=":host{--background-color:var(--pine-color-neutral-grey-400);--offset-xxs:var(--pine-spacing-xxs);--offset-xs:var(--pine-spacing-xs);--offset-sm:var(--pine-spacing-sm);--offset-md:var(--pine-spacing-md);--offset-lg:var(--pine-spacing-lg);--offset-xxl:var(--pine-spacing-2xl)}.pds-divider{background:var(--background-color);border:0;display:-ms-flexbox;display:flex;height:1px;margin:0;width:100%}.pds-divider--vertical{height:100%;width:1px}.pds-divider--offset-xxs{margin:0 calc(var(--offset-xxs) * -1);padding:0 var(--offset-xxs)}.pds-divider--offset-xxs.pds-divider--vertical{margin:calc(var(--offset-xxs) * -1) 0;padding:var(--offset-xxs) 0}.pds-divider--offset-xs{margin:0 calc(var(--offset-xs) * -1);padding:0 var(--offset-xs)}.pds-divider--offset-xs.pds-divider--vertical{margin:calc(var(--offset-xs) * -1) 0;padding:var(--offset-xs) 0}.pds-divider--offset-sm{margin:0 calc(var(--offset-sm) * -1);padding:0 var(--offset-sm)}.pds-divider--offset-sm.pds-divider--vertical{margin:calc(var(--offset-sm) * -1) 0;padding:var(--offset-sm) 0}.pds-divider--offset-md{margin:0 calc(var(--offset-md) * -1);padding:0 var(--offset-md)}.pds-divider--offset-md.pds-divider--vertical{margin:calc(var(--offset-md) * -1) 0;padding:var(--offset-md) 0}.pds-divider--offset-lg{margin:0 calc(var(--offset-lg) * -1);padding:0 var(--offset-lg)}.pds-divider--offset-lg.pds-divider--vertical{margin:calc(var(--offset-lg) * -1) 0;padding:var(--offset-lg) 0}.pds-divider--offset-xl{margin:0 calc(var(--offset-xl) * -1);padding:0 var(--offset-xl)}.pds-divider--offset-xl.pds-divider--vertical{margin:calc(var(--offset-xl) * -1) 0;padding:var(--offset-xl) 0}.pds-divider--offset-xxl{margin:0 calc(var(--offset-xxl) * -1);padding:0 var(--offset-xxl)}.pds-divider--offset-xxl.pds-divider--vertical{margin:calc(var(--offset-xxl) * -1) 0;padding:var(--offset-xxl) 0}@media (max-width: 767px){.pds-divider--vertical{display:none}}";var r=f;var a=d("pds_divider",function(){function d(d){i(this,d);this.componentId=undefined;this.offset=undefined;this.vertical=false}d.prototype.classNames=function(){var d=["pds-divider"];if(this.vertical){d.push("pds-divider--vertical")}if(this.offset){var i="pds-divider--offset-"+this.offset;d.push(i)}return d.join(" ")};d.prototype.render=function(){return s(e,{key:"d5d42d70c2417e0fc801f87f8460557bb1756443",id:this.componentId},s("hr",{key:"49554a46b6949d09adc4794b22441a1f76eb1d13",class:this.classNames()}))};return d}());a.style=r}}}));
|
|
2
|
+
//# sourceMappingURL=p-341eb1ee.system.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["pdsDividerCss","PdsDividerStyle0","PdsDivider","exports","class_1","prototype","classNames","this","vertical","push","offset","offsetClassName","join","render","h","Host","key","id","componentId","class"],"sources":["src/components/pds-divider/pds-divider.scss?tag=pds-divider&encapsulation=shadow","src/components/pds-divider/pds-divider.tsx"],"sourcesContent":[":host {\n --background-color: var(--pine-color-neutral-grey-400);\n --offset-xxs: var(--pine-spacing-xxs);\n --offset-xs: var(--pine-spacing-xs);\n --offset-sm: var(--pine-spacing-sm);\n --offset-md: var(--pine-spacing-md);\n --offset-lg: var(--pine-spacing-lg);\n --offset-xxl: var(--pine-spacing-2xl);\n}\n\n$pds-divider-offsets: (\n xxs: var(--offset-xxs),\n xs: var(--offset-xs),\n sm: var(--offset-sm),\n md: var(--offset-md),\n lg: var(--offset-lg),\n xl: var(--offset-xl),\n xxl: var(--offset-xxl),\n);\n\n.pds-divider {\n background: var(--background-color);\n border: 0;\n display: flex;\n height: 1px;\n margin: 0;\n width: 100%;\n}\n\n.pds-divider--vertical {\n height: 100%;\n width: 1px;\n}\n\n@each $offset, $value in $pds-divider-offsets {\n .pds-divider--offset-#{$offset} {\n margin: 0 calc($value * -1);\n padding: 0 $value;\n\n &.pds-divider--vertical {\n margin: calc($value * -1) 0;\n padding: $value 0;\n }\n }\n}\n\n@media (max-width: 767px) {\n .pds-divider--vertical {\n display: none;\n }\n}\n","import { Component, Prop, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'pds-divider',\n styleUrl: 'pds-divider.scss',\n shadow: true,\n})\nexport class PdsDivider {\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Adds offset margin/padding to expand the width (horizontal) or the height (vertical) of divider.\n */\n @Prop() offset: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';\n\n /**\n * Sets divider to display vertically\n * @defaultValue false\n */\n @Prop() vertical = false;\n\n private classNames() {\n const classNames = ['pds-divider'];\n\n if (this.vertical) {\n classNames.push('pds-divider--vertical');\n }\n\n if (this.offset) {\n const offsetClassName = 'pds-divider--offset-' + this.offset;\n classNames.push(offsetClassName);\n }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host id={this.componentId}>\n <hr class={this.classNames()} />\n </Host>\n );\n }\n}\n"],"mappings":"kJAAA,IAAMA,EAAgB,g3DACtB,IAAAC,EAAeD,E,ICMFE,EAAUC,EAAA,yB,uFAeF,K,CAEXC,EAAAC,UAAAC,WAAA,WACN,IAAMA,EAAa,CAAC,eAEpB,GAAIC,KAAKC,SAAU,CACjBF,EAAWG,KAAK,wB,CAGlB,GAAIF,KAAKG,OAAQ,CACf,IAAMC,EAAkB,uBAAyBJ,KAAKG,OACtDJ,EAAWG,KAAKE,E,CAGlB,OAAOL,EAAWM,KAAK,I,EAGzBR,EAAAC,UAAAQ,OAAA,WACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,GAAIV,KAAKW,aACbJ,EAAA,MAAAE,IAAA,2CAAIG,MAAOZ,KAAKD,e,WAnCD,I"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as d,h as s,H as i}from"./p-b5b5ce83.js";const e=":host{--background-color:var(--pine-color-neutral-grey-400);--offset-xxs:var(--pine-spacing-xxs);--offset-xs:var(--pine-spacing-xs);--offset-sm:var(--pine-spacing-sm);--offset-md:var(--pine-spacing-md);--offset-lg:var(--pine-spacing-lg);--offset-xxl:var(--pine-spacing-2xl)}.pds-divider{background:var(--background-color);border:0;display:-ms-flexbox;display:flex;height:1px;margin:0;width:100%}.pds-divider--vertical{height:100%;width:1px}.pds-divider--offset-xxs{margin:0 calc(var(--offset-xxs) * -1);padding:0 var(--offset-xxs)}.pds-divider--offset-xxs.pds-divider--vertical{margin:calc(var(--offset-xxs) * -1) 0;padding:var(--offset-xxs) 0}.pds-divider--offset-xs{margin:0 calc(var(--offset-xs) * -1);padding:0 var(--offset-xs)}.pds-divider--offset-xs.pds-divider--vertical{margin:calc(var(--offset-xs) * -1) 0;padding:var(--offset-xs) 0}.pds-divider--offset-sm{margin:0 calc(var(--offset-sm) * -1);padding:0 var(--offset-sm)}.pds-divider--offset-sm.pds-divider--vertical{margin:calc(var(--offset-sm) * -1) 0;padding:var(--offset-sm) 0}.pds-divider--offset-md{margin:0 calc(var(--offset-md) * -1);padding:0 var(--offset-md)}.pds-divider--offset-md.pds-divider--vertical{margin:calc(var(--offset-md) * -1) 0;padding:var(--offset-md) 0}.pds-divider--offset-lg{margin:0 calc(var(--offset-lg) * -1);padding:0 var(--offset-lg)}.pds-divider--offset-lg.pds-divider--vertical{margin:calc(var(--offset-lg) * -1) 0;padding:var(--offset-lg) 0}.pds-divider--offset-xl{margin:0 calc(var(--offset-xl) * -1);padding:0 var(--offset-xl)}.pds-divider--offset-xl.pds-divider--vertical{margin:calc(var(--offset-xl) * -1) 0;padding:var(--offset-xl) 0}.pds-divider--offset-xxl{margin:0 calc(var(--offset-xxl) * -1);padding:0 var(--offset-xxl)}.pds-divider--offset-xxl.pds-divider--vertical{margin:calc(var(--offset-xxl) * -1) 0;padding:var(--offset-xxl) 0}@media (max-width: 767px){.pds-divider--vertical{display:none}}";const a=e;const r=class{constructor(s){d(this,s);this.componentId=undefined;this.offset=undefined;this.vertical=false}classNames(){const d=["pds-divider"];if(this.vertical){d.push("pds-divider--vertical")}if(this.offset){const s="pds-divider--offset-"+this.offset;d.push(s)}return d.join(" ")}render(){return s(i,{key:"d5d42d70c2417e0fc801f87f8460557bb1756443",id:this.componentId},s("hr",{key:"49554a46b6949d09adc4794b22441a1f76eb1d13",class:this.classNames()}))}};r.style=a;export{r as pds_divider};
|
|
2
|
+
//# sourceMappingURL=p-3b3f8185.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["pdsDividerCss","PdsDividerStyle0","PdsDivider","classNames","this","vertical","push","offset","offsetClassName","join","render","h","Host","key","id","componentId","class"],"sources":["src/components/pds-divider/pds-divider.scss?tag=pds-divider&encapsulation=shadow","src/components/pds-divider/pds-divider.tsx"],"sourcesContent":[":host {\n --background-color: var(--pine-color-neutral-grey-400);\n --offset-xxs: var(--pine-spacing-xxs);\n --offset-xs: var(--pine-spacing-xs);\n --offset-sm: var(--pine-spacing-sm);\n --offset-md: var(--pine-spacing-md);\n --offset-lg: var(--pine-spacing-lg);\n --offset-xxl: var(--pine-spacing-2xl);\n}\n\n$pds-divider-offsets: (\n xxs: var(--offset-xxs),\n xs: var(--offset-xs),\n sm: var(--offset-sm),\n md: var(--offset-md),\n lg: var(--offset-lg),\n xl: var(--offset-xl),\n xxl: var(--offset-xxl),\n);\n\n.pds-divider {\n background: var(--background-color);\n border: 0;\n display: flex;\n height: 1px;\n margin: 0;\n width: 100%;\n}\n\n.pds-divider--vertical {\n height: 100%;\n width: 1px;\n}\n\n@each $offset, $value in $pds-divider-offsets {\n .pds-divider--offset-#{$offset} {\n margin: 0 calc($value * -1);\n padding: 0 $value;\n\n &.pds-divider--vertical {\n margin: calc($value * -1) 0;\n padding: $value 0;\n }\n }\n}\n\n@media (max-width: 767px) {\n .pds-divider--vertical {\n display: none;\n }\n}\n","import { Component, Prop, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'pds-divider',\n styleUrl: 'pds-divider.scss',\n shadow: true,\n})\nexport class PdsDivider {\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Adds offset margin/padding to expand the width (horizontal) or the height (vertical) of divider.\n */\n @Prop() offset: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';\n\n /**\n * Sets divider to display vertically\n * @defaultValue false\n */\n @Prop() vertical = false;\n\n private classNames() {\n const classNames = ['pds-divider'];\n\n if (this.vertical) {\n classNames.push('pds-divider--vertical');\n }\n\n if (this.offset) {\n const offsetClassName = 'pds-divider--offset-' + this.offset;\n classNames.push(offsetClassName);\n }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host id={this.componentId}>\n <hr class={this.classNames()} />\n </Host>\n );\n }\n}\n"],"mappings":"kDAAA,MAAMA,EAAgB,g3DACtB,MAAAC,EAAeD,E,MCMFE,EAAU,M,wFAeF,K,CAEX,UAAAC,GACN,MAAMA,EAAa,CAAC,eAEpB,GAAIC,KAAKC,SAAU,CACjBF,EAAWG,KAAK,wB,CAGlB,GAAIF,KAAKG,OAAQ,CACf,MAAMC,EAAkB,uBAAyBJ,KAAKG,OACtDJ,EAAWG,KAAKE,E,CAGlB,OAAOL,EAAWM,KAAK,I,CAGzB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,GAAIV,KAAKW,aACbJ,EAAA,MAAAE,IAAA,2CAAIG,MAAOZ,KAAKD,e"}
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
System.register(["./p-
|
|
1
|
+
System.register(["./p-c563d4e7.system.js","./p-4da2e899.system.js"],(function(e){"use strict";var i,r,o,a,t,s,n,d;return{setters:[function(e){i=e.r;r=e.c;o=e.h;a=e.H;t=e.g},function(e){s=e.m;n=e.P;d=e.a}],execute:function(){var c=':host{--background-color:var(--pine-color-base-white);--background-color-disabled:var(--pine-color-neutral-grey-200);--background-color-hover:var(--pine-color-neutral-grey-100);--border:var(--pine-border-interactive);--border-color-disabled:var(--pine-color-neutral-charcoal-100);--border-color-hover:var(--pine-border-interactive-hover-color);--border-color-icon:var(--pine-color-base-white);--border-radius:var(--pine-border-radius-xs);--color-checked:var(--pine-color-neutral-charcoal-500);--color-disabled:var(--pine-color-neutral-grey-300);--color-focus:var(--pine-color-primary-200);--color-invalid-focus:var(--pine-color-red-200);--color-invalid:var(--pine-color-red-300);--message-color-disabled:var(--pine-color-neutral-grey-500);--message-color:var(--pine-color-neutral-charcoal-200);--input-size:16px;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap}:host(.is-invalid) input{border-color:var(--color-invalid)}:host(.is-invalid) input:checked{background:var(--color-invalid)}:host(.is-invalid) input:focus-visible{-webkit-box-shadow:0 0 0 4px var(--color-invalid-focus);box-shadow:0 0 0 4px var(--color-invalid-focus);outline:none}:host(.is-invalid) label,:host(.is-invalid) .pds-checkbox__message--error{color:var(--color-invalid)}:host(.is-indeterminate) input:checked::after{border-bottom:0;-webkit-transform:rotate(87deg) translate3d(-114%, 25%, 0);transform:rotate(87deg) translate3d(-114%, 25%, 0)}input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--background-color);border:var(--border);border-radius:var(--border-radius);height:var(--input-size);margin:0;position:relative;width:var(--input-size)}input:hover{background:var(--background-color-hover);border-color:var(--border-color-hover)}input:checked{background:var(--color-checked);border-color:var(--color-checked)}input:checked::after{border:1px solid var(--border-color-icon);border-left:0;border-top:0;content:"";display:block;height:7px;left:50%;position:absolute;top:50%;-webkit-transform:rotate(43deg) translate3d(-110%, -30%, 0);transform:rotate(43deg) translate3d(-110%, -30%, 0);width:4px}input:disabled{background:var(--background-color-disabled);border-color:var(--color-disabled);cursor:not-allowed}input:disabled:checked{background:var(--color-disabled);border-color:var(--color-disabled)}input:disabled:checked::after{border-color:var(--border-color-disabled)}input:disabled+label{color:var(--border-color-hover);cursor:not-allowed}input:disabled~.pds-checkbox__message{color:var(--message-color-disabled)}input:focus-visible{-webkit-box-shadow:0 0 0 4px var(--color-focus);box-shadow:0 0 0 4px var(--color-focus);outline:none}label{-webkit-margin-start:10px;margin-inline-start:10px}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-checkbox__message{color:var(--message-color);font-size:14px;-webkit-margin-before:6px;margin-block-start:6px;-webkit-margin-start:26px;margin-inline-start:26px;width:100%}';var l=c;var h=e("pds_checkbox",function(){function e(e){var o=this;i(this,e);this.pdsCheckboxChange=r(this,"pdsCheckboxChange",7);this.handleCheckboxChange=function(e){if(o.disabled){return}var i=e.target;o.checked=i.checked;o.pdsCheckboxChange.emit({checked:i.checked,value:o.value})};this.checked=undefined;this.componentId=undefined;this.disabled=undefined;this.errorMessage=undefined;this.helperMessage=undefined;this.indeterminate=undefined;this.invalid=undefined;this.label=undefined;this.labelHidden=undefined;this.name=undefined;this.required=undefined;this.value=undefined}e.prototype.classNames=function(){var e=[];if(this.invalid){e.push("is-invalid")}if(this.indeterminate){e.push("is-indeterminate")}if(this.disabled){e.push("is-disabled")}return e.join(" ")};e.prototype.render=function(){return o(a,{key:"df4d541eb43253bac6d9f0396d5af5c0a0181db0",class:this.classNames()},o("input",{key:"59f4ff764cdf4fac9ff38a734b91cf31219f2a59","aria-describedby":d(this.componentId,this.invalid,this.helperMessage),"aria-invalid":this.invalid?"true":undefined,type:"checkbox",id:this.componentId,name:this.name,value:this.value,checked:this.checked,required:this.required,disabled:this.disabled,onChange:this.handleCheckboxChange}),o(n,{key:"99da91ab0d67c72f29092a623164b0822ff56a66",htmlFor:this.componentId,text:this.label,classNames:this.labelHidden?"visually-hidden":""}),this.helperMessage&&o("div",{class:"pds-checkbox__message",id:s(this.componentId,"helper")},this.helperMessage),this.errorMessage&&o("div",{class:"pds-checkbox__message pds-checkbox__message--error",id:s(this.componentId,"error"),"aria-live":"assertive"},this.errorMessage))};return e}());h.style=l;var b=":host{--background-fixed:var(--pine-color-base-white);--box-shadow:3px 3px 6px -2px rgba(0, 0, 0, 0.2);--color:var(--pine-color-neutral-charcoal-200);--fixed-column-index:0;--font-size:var(--pine-font-size-body-sm);--line-height:var(--pine-line-height-sm);--padding:calc(var(--pine-spacing-md) / 2);--padding-compact:var(--pine-spacing-xxs);--fixed-cell-position:0;--max-width-truncated:100px;color:var(--color);display:table-cell;font-size:var(--font-size);line-height:var(--line-height);padding:var(--padding);vertical-align:inherit}:host(.is-compact){padding-block:var(--padding-compact)}:host(.is-fixed){background:var(--background-fixed);left:var(--fixed-cell-position);position:-webkit-sticky;position:sticky;z-index:1}:host(.has-scrolled.is-fixed){-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow)}:host(.is-truncated){max-width:var(--max-width-truncated);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(.has-checkbox){vertical-align:middle;width:16px}";var p=b;var u=e("pds_table_cell",function(){function e(e){var r=this;i(this,e);this.handleScroll=function(){if(r.tableRef.scrollLeft>0){r.tableScrolling=true}else{r.tableScrolling=false}};this.truncate=undefined;this.tableScrolling=false}e.prototype.componentWillRender=function(){this.tableRef=this.hostElement.closest("pds-table")};e.prototype.componentDidLoad=function(){if(this.tableRef&&this.tableRef.responsive&&this.tableRef.fixedColumn){this.tableRef.addEventListener("scroll",this.handleScroll)}};e.prototype.classNames=function(){var e=[];if(this.tableRef&&this.tableRef.compact){e.push("is-compact")}if(this.truncate){e.push("is-truncated")}if(this.tableRef&&this.tableRef.fixedColumn&&this.tableScrolling){e.push("has-scrolled")}return e.join(" ")};e.prototype.render=function(){return o(a,{key:"71ff527047eaafcf9b9c57a6aa96634e4a887f0b",class:this.classNames(),role:"gridcell",style:this.tableRef&&this.tableRef.fixedColumn&&this.tableRef.selectable?{"--fixed-cell-position":"40px"}:{}},o("slot",{key:"b62c595da7fbf8795e90c67c3d50b9f5e7449067"}))};Object.defineProperty(e.prototype,"hostElement",{get:function(){return t(this)},enumerable:false,configurable:true});return e}());u.style=p}}}));
|
|
2
|
+
//# sourceMappingURL=p-41ca8678.system.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["pdsCheckboxCss","PdsCheckboxStyle0","PdsCheckbox","exports","this","handleCheckboxChange","e","_this","disabled","target","checked","pdsCheckboxChange","emit","value","class_1","prototype","classNames","invalid","push","indeterminate","join","render","h","Host","key","class","assignDescription","componentId","helperMessage","undefined","type","id","name","required","onChange","PdsLabel","htmlFor","text","label","labelHidden","messageId","errorMessage","pdsTableCellCss","PdsTableCellStyle0","PdsTableCell","handleScroll","tableRef","scrollLeft","tableScrolling","class_2","componentWillRender","hostElement","closest","componentDidLoad","responsive","fixedColumn","addEventListener","compact","truncate","role","style","selectable"],"sources":["src/components/pds-checkbox/pds-checkbox.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.tsx","src/components/pds-table/pds-table-cell/pds-table-cell.scss?tag=pds-table-cell&encapsulation=shadow","src/components/pds-table/pds-table-cell/pds-table-cell.tsx"],"sourcesContent":[":host {\n --background-color: var(--pine-color-base-white);\n --background-color-disabled: var(--pine-color-neutral-grey-200);\n --background-color-hover: var(--pine-color-neutral-grey-100);\n --border: var(--pine-border-interactive);\n --border-color-disabled: var(--pine-color-neutral-charcoal-100);\n --border-color-hover: var(--pine-border-interactive-hover-color);\n --border-color-icon: var(--pine-color-base-white);\n --border-radius: var(--pine-border-radius-xs);\n --color-checked: var(--pine-color-neutral-charcoal-500);\n --color-disabled: var(--pine-color-neutral-grey-300);\n --color-focus: var(--pine-color-primary-200);\n --color-invalid-focus: var(--pine-color-red-200);\n --color-invalid: var(--pine-color-red-300);\n --message-color-disabled: var(--pine-color-neutral-grey-500);\n --message-color: var(--pine-color-neutral-charcoal-200);\n --input-size: 16px;\n\n align-items: center;\n display: flex;\n flex-flow: row wrap;\n}\n\n:host(.is-invalid) {\n input {\n border-color: var(--color-invalid);\n\n &:checked {\n background: var(--color-invalid);\n }\n\n &:focus-visible {\n box-shadow: 0 0 0 4px var(--color-invalid-focus);\n outline: none;\n }\n }\n\n label,\n .pds-checkbox__message--error {\n color: var(--color-invalid);\n }\n}\n\n:host(.is-indeterminate) {\n input:checked {\n &::after {\n border-bottom: 0;\n transform: rotate(87deg) translate3d(-114%, 25%, 0);\n }\n }\n}\n\ninput {\n appearance: none;\n background-color: var(--background-color);\n border: var(--border);\n border-radius: var(--border-radius);\n height: var(--input-size);\n margin: 0;\n position: relative;\n width: var(--input-size);\n\n &:hover {\n background: var(--background-color-hover);\n border-color: var(--border-color-hover);\n }\n\n &:checked {\n background: var(--color-checked);\n border-color: var(--color-checked);\n\n &::after {\n border: 1px solid var(--border-color-icon);\n border-left: 0;\n border-top: 0;\n content: \"\";\n display: block;\n height: 7px;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: rotate(43deg) translate3d(-110%, -30%, 0);\n width: 4px;\n }\n }\n\n &:disabled {\n background: var(--background-color-disabled);\n border-color: var(--color-disabled);\n cursor: not-allowed;\n\n &:checked {\n background: var(--color-disabled);\n border-color: var(--color-disabled);\n\n &::after {\n border-color: var(--border-color-disabled);\n }\n }\n\n + label {\n color: var(--border-color-hover);\n cursor: not-allowed;\n }\n\n ~ .pds-checkbox__message {\n color: var(--message-color-disabled);\n }\n }\n\n &:focus-visible {\n box-shadow: 0 0 0 4px var(--color-focus);\n outline: none;\n }\n}\n\nlabel {\n margin-inline-start: 10px;\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n.pds-checkbox__message {\n color: var(--message-color);\n font-size: 14px;\n margin-block-start: 6px;\n margin-inline-start: 26px;\n width: 100%;\n}\n","import { Component, h, Prop, Host, Event, EventEmitter } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { PdsLabel } from '../_internal/pds-label/pds-label';\nimport { CheckboxChangeEventDetail } from './checkbox-interface';\n\n@Component({\n tag: 'pds-checkbox',\n styleUrl: 'pds-checkbox.scss',\n shadow: true,\n})\nexport class PdsCheckbox {\n /**\n * It determines whether or not the checkbox is checked.\n */\n @Prop() checked: boolean;\n\n /**\n * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * It determines whether or not the checkbox is disabled.\n */\n @Prop() disabled: boolean;\n\n /**\n * Displays message text describing an invalid state.\n */\n @Prop() errorMessage: string;\n\n /**\n * String used for helper message below checkbox.\n */\n @Prop() helperMessage: string;\n\n /**\n * If `true`, the checkbox will visually appear as indeterminate.\n * Only JavaScript can set the objects `indeterminate` property. See [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes).\n */\n @Prop() indeterminate: boolean;\n\n /**\n * It determines whether or not the checkbox is invalid.\n */\n @Prop() invalid: boolean;\n\n /**\n * String used for label text next to checkbox.\n */\n @Prop() label: string;\n\n /**\n * Visually hides the label text for instances where only the checkbox should be displayed. Label remains accessible to assistive technology such as screen readers.\n */\n @Prop() labelHidden: boolean;\n\n /**\n * String used for checkbox `name` attribute.\n */\n @Prop() name: string;\n\n /**\n * It determines whether or not the checkbox is required.\n */\n @Prop() required: boolean;\n\n /**\n * The value of the checkbox that is submitted with a form.\n */\n @Prop() value: string;\n\n /**\n * Event emitted that contains the `value` and `checked`.\n */\n @Event() pdsCheckboxChange: EventEmitter<CheckboxChangeEventDetail>;\n\n private handleCheckboxChange = (e: Event) => {\n if (this.disabled) {\n return;\n }\n\n const target = e.target as HTMLInputElement;\n this.checked = target.checked;\n\n this.pdsCheckboxChange.emit({\n checked: target.checked,\n value: this.value\n });\n }\n\n private classNames() {\n const classNames = [];\n\n if (this.invalid) { classNames.push('is-invalid'); }\n if (this.indeterminate) { classNames.push('is-indeterminate'); }\n if (this.disabled) { classNames.push('is-disabled'); }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host class={this.classNames()}>\n <input\n aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n type=\"checkbox\"\n id={this.componentId}\n name={this.name}\n value={this.value}\n checked={this.checked}\n required={this.required}\n disabled={this.disabled}\n onChange={this.handleCheckboxChange}\n />\n <PdsLabel htmlFor={this.componentId} text={this.label} classNames={this.labelHidden ? 'visually-hidden' : ''} />\n {this.helperMessage &&\n <div\n class={'pds-checkbox__message'}\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </div>\n }\n {this.errorMessage &&\n <div\n class={`pds-checkbox__message pds-checkbox__message--error`}\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n {this.errorMessage}\n </div>\n }\n </Host>\n );\n }\n}\n",":host {\n --background-fixed: var(--pine-color-base-white);\n --box-shadow: 3px 3px 6px -2px rgba(0, 0, 0, 0.2);\n --color: var(--pine-color-neutral-charcoal-200);\n --fixed-column-index: 0;\n --font-size: var(--pine-font-size-body-sm);\n --line-height: var(--pine-line-height-sm);\n --padding: calc(var(--pine-spacing-md) / 2);\n --padding-compact: var(--pine-spacing-xxs);\n --fixed-cell-position: 0;\n --max-width-truncated: 100px;\n\n color: var(--color);\n display: table-cell;\n font-size: var(--font-size);\n line-height: var(--line-height);\n padding: var(--padding);\n vertical-align: inherit;\n}\n\n:host(.is-compact) {\n padding-block: var(--padding-compact);\n}\n\n:host(.is-fixed) {\n background: var(--background-fixed);\n left: var(--fixed-cell-position);\n position: sticky;\n z-index: 1;\n}\n\n// box shadow when table has scrolled and cell is fixed\n:host(.has-scrolled.is-fixed) {\n box-shadow: var(--box-shadow);\n}\n\n:host(.is-truncated) {\n max-width: var(--max-width-truncated);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n:host(.has-checkbox) {\n vertical-align: middle;\n width: 16px;\n}\n","import { Component, Element, Host, Prop, State, h } from '@stencil/core';\n\n@Component({\n tag: 'pds-table-cell',\n styleUrl: 'pds-table-cell.scss',\n shadow: true,\n})\nexport class PdsTableCell {\n @Element() hostElement: HTMLPdsTableCellElement;\n tableRef: HTMLPdsTableElement;\n\n componentWillRender() {\n this.tableRef = this.hostElement.closest('pds-table') as HTMLPdsTableElement;\n }\n\n componentDidLoad() {\n if (this.tableRef && this.tableRef.responsive && this.tableRef.fixedColumn) {\n this.tableRef.addEventListener('scroll', this.handleScroll);\n }\n }\n\n /**\n * Truncates content to a max width of 100px and adds an ellipsis.\n */\n @Prop() truncate: boolean;\n\n @State() private tableScrolling: boolean = false;\n\n private classNames() {\n const classNames = [];\n\n if (this.tableRef && this.tableRef.compact) {\n classNames.push('is-compact');\n }\n\n if (this.truncate) {\n classNames.push('is-truncated');\n }\n\n if (this.tableRef && this.tableRef.fixedColumn && this.tableScrolling) {\n classNames.push('has-scrolled');\n }\n\n return classNames.join(' ');\n }\n\n private handleScroll = () => {\n if (this.tableRef.scrollLeft > 0) {\n this.tableScrolling = true;\n } else {\n this.tableScrolling = false;\n }\n };\n\n render() {\n return (\n <Host\n class={this.classNames()}\n role=\"gridcell\"\n style={\n this.tableRef &&\n this.tableRef.fixedColumn &&\n this.tableRef.selectable\n ? { '--fixed-cell-position': '40px' }\n : {}\n }\n >\n <slot></slot>\n </Host>\n );\n }\n}\n"],"mappings":"gOAAA,IAAMA,EAAiB,kmGACvB,IAAAC,EAAeD,E,ICSFE,EAAWC,EAAA,0B,wFAmEdC,KAAAC,qBAAuB,SAACC,GAC9B,GAAIC,EAAKC,SAAU,CACjB,M,CAGF,IAAMC,EAASH,EAAEG,OACjBF,EAAKG,QAAUD,EAAOC,QAEtBH,EAAKI,kBAAkBC,KAAK,CAC1BF,QAASD,EAAOC,QAChBG,MAAON,EAAKM,O,0SAIRC,EAAAC,UAAAC,WAAA,WACN,IAAMA,EAAa,GAEnB,GAAIZ,KAAKa,QAAS,CAAED,EAAWE,KAAK,a,CACpC,GAAId,KAAKe,cAAe,CAAEH,EAAWE,KAAK,mB,CAC1C,GAAId,KAAKI,SAAU,CAAEQ,EAAWE,KAAK,c,CAErC,OAAOF,EAAWI,KAAK,K,EAGzBN,EAAAC,UAAAM,OAAA,WACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAOrB,KAAKY,cAChBM,EAAA,SAAAE,IAAA,8DACoBE,EAAkBtB,KAAKuB,YAAavB,KAAKa,QAASb,KAAKwB,eAAc,eACzExB,KAAKa,QAAU,OAASY,UACtCC,KAAK,WACLC,GAAI3B,KAAKuB,YACTK,KAAM5B,KAAK4B,KACXnB,MAAOT,KAAKS,MACZH,QAASN,KAAKM,QACduB,SAAU7B,KAAK6B,SACfzB,SAAUJ,KAAKI,SACf0B,SAAU9B,KAAKC,uBAEjBiB,EAACa,EAAQ,CAAAX,IAAA,2CAACY,QAAShC,KAAKuB,YAAaU,KAAMjC,KAAKkC,MAAOtB,WAAYZ,KAAKmC,YAAc,kBAAoB,KACzGnC,KAAKwB,eACJN,EAAA,OACEG,MAAO,wBACPM,GAAIS,EAAUpC,KAAKuB,YAAa,WAE/BvB,KAAKwB,eAGTxB,KAAKqC,cACJnB,EAAA,OACEG,MAAO,qDACPM,GAAIS,EAAUpC,KAAKuB,YAAa,SAAQ,YAC9B,aAETvB,KAAKqC,c,WAzHM,I,UCVxB,IAAMC,EAAkB,k+BACxB,IAAAC,EAAeD,E,ICMFE,EAAYzC,EAAA,4B,mCAuCfC,KAAAyC,aAAe,WACrB,GAAItC,EAAKuC,SAASC,WAAa,EAAG,CAChCxC,EAAKyC,eAAiB,I,KACjB,CACLzC,EAAKyC,eAAiB,K,+CAxBiB,K,CAf3CC,EAAAlC,UAAAmC,oBAAA,WACE9C,KAAK0C,SAAW1C,KAAK+C,YAAYC,QAAQ,Y,EAG3CH,EAAAlC,UAAAsC,iBAAA,WACE,GAAIjD,KAAK0C,UAAY1C,KAAK0C,SAASQ,YAAclD,KAAK0C,SAASS,YAAa,CAC1EnD,KAAK0C,SAASU,iBAAiB,SAAUpD,KAAKyC,a,GAW1CI,EAAAlC,UAAAC,WAAA,WACN,IAAMA,EAAa,GAEnB,GAAIZ,KAAK0C,UAAY1C,KAAK0C,SAASW,QAAS,CAC1CzC,EAAWE,KAAK,a,CAGlB,GAAId,KAAKsD,SAAU,CACjB1C,EAAWE,KAAK,e,CAGlB,GAAId,KAAK0C,UAAY1C,KAAK0C,SAASS,aAAenD,KAAK4C,eAAgB,CACrEhC,EAAWE,KAAK,e,CAGlB,OAAOF,EAAWI,KAAK,I,EAWzB6B,EAAAlC,UAAAM,OAAA,WACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAOrB,KAAKY,aACZ2C,KAAK,WACLC,MACExD,KAAK0C,UACL1C,KAAK0C,SAASS,aACdnD,KAAK0C,SAASe,WACV,CAAE,wBAAyB,QAC3B,IAGNvC,EAAA,QAAAE,IAAA,6C,gIA5DiB,I"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as e,h as a,H as n}from"./p-b5b5ce83.js";const i=":host{--pine-gap-y:10px;display:block;-webkit-margin-after:calc(var(--pine-gap-y) * -1);margin-block-end:calc(var(--pine-gap-y) * -1);-webkit-margin-before:calc(var(--pine-gap-y) * -1);margin-block-start:calc(var(--pine-gap-y) * -1);-webkit-margin-end:calc(var(--pine-gap-x) * -0.5);margin-inline-end:calc(var(--pine-gap-x) * -0.5);-webkit-margin-start:calc(var(--pine-gap-x) * -0.5);margin-inline-start:calc(var(--pine-gap-x) * -0.5)}.pds-row{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-margin-after:calc(var(--pine-gap-y) * -1);margin-block-end:calc(var(--pine-gap-y) * -1);-webkit-margin-before:calc(var(--pine-gap-y) * -1);margin-block-start:calc(var(--pine-gap-y) * -1);-webkit-margin-end:calc(var(--pine-gap-x) * -1);margin-inline-end:calc(var(--pine-gap-x) * -1);-webkit-margin-start:calc(var(--pine-gap-x) * -1);margin-inline-start:calc(var(--pine-gap-x) * -1)}.pds-row>*{-webkit-padding-after:calc(var(--pine-gap-y));padding-block-end:calc(var(--pine-gap-y));-webkit-padding-before:calc(var(--pine-gap-y));padding-block-start:calc(var(--pine-gap-y));-webkit-padding-end:calc(var(--pine-gap-x));padding-inline-end:calc(var(--pine-gap-x));-webkit-padding-start:calc(var(--pine-gap-x));padding-inline-start:calc(var(--pine-gap-x))}.pds-row--no-wrap{-ms-flex-wrap:nowrap;flex-wrap:nowrap}.pds-row--border{border:var(--pine-border-default)}.pds-justify-content-start{-ms-flex-pack:start;justify-content:start}.pds-justify-content-center{-ms-flex-pack:center;justify-content:center}.pds-justify-content-end{-ms-flex-pack:end;justify-content:end}.pds-justify-content-space-between{-ms-flex-pack:justify;justify-content:space-between}.pds-justify-content-space-around{-ms-flex-pack:distribute;justify-content:space-around}.pds-justify-content-space-evenly{-ms-flex-pack:space-evenly;justify-content:space-evenly}.pds-align-items-start{-ms-flex-align:start;align-items:start}.pds-align-items-center{-ms-flex-align:center;align-items:center}.pds-align-items-end{-ms-flex-align:end;align-items:end}.pds-align-items-stretch{-ms-flex-align:stretch;align-items:stretch}.pds-align-items-baseline{-ms-flex-align:baseline;align-items:baseline}";const t=i;const s=class{constructor(a){e(this,a);this.colGapMap={none:"0",xxs:".25rem",xs:".5rem",sm:"1rem",md:"1.5rem",lg:"2.25rem",xl:"3rem",xxl:"4rem"};this.alignItems=undefined;this.border=false;this.colGap=undefined;this.componentId=undefined;this.justifyContent=undefined;this.minHeight=undefined;this.noWrap=false}render(){const e=`\n ${this.alignItems!==undefined&&this.alignItems.trim()!==""?`pds-align-items-${this.alignItems}`:""}\n ${this.border?"pds-row--border":""}\n ${this.justifyContent!==undefined&&this.justifyContent.trim()!==""?`pds-justify-content-${this.justifyContent}`:""}\n ${this.noWrap?"pds-row--no-wrap":""}\n `;const i=Object.assign(Object.assign({},this.colGap&&{"--pine-gap-x":this.colGap!==undefined&&this.colGap.trim()!==""?this.colGapMap[this.colGap]:"","--pine-gap-y":this.colGap!==undefined&&this.colGap.trim()!==""?this.colGapMap[this.colGap]:""}),this.minHeight&&{"min-height":this.minHeight});return a(n,{key:"a0661e2e13c93d93f8fd8a2f692adce3eac2b9f7",class:`pds-row ${e}`,style:i})}};s.style=t;export{s as pds_row};
|
|
2
|
+
//# sourceMappingURL=p-45160e15.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["pdsRowCss","PdsRowStyle0","PdsRow","this","colGapMap","none","xxs","xs","sm","md","lg","xl","xxl","render","rowClasses","alignItems","undefined","trim","border","justifyContent","noWrap","rowInlineStyles","Object","assign","colGap","minHeight","h","Host","key","class","style"],"sources":["src/components/pds-row/pds-row.scss?tag=pds-row","src/components/pds-row/pds-row.tsx"],"sourcesContent":[":host {\n --pine-gap-y: 10px;\n \n display: block;\n margin-block-end: calc(var(--pine-gap-y) * -1);\n margin-block-start: calc(var(--pine-gap-y) * -1);\n margin-inline-end: calc(var(--pine-gap-x) * -0.5);\n margin-inline-start: calc(var(--pine-gap-x) * -0.5);\n}\n\n.pds-row {\n display: flex;\n flex-grow: 1;\n flex-wrap: wrap;\n margin-block-end: calc(var(--pine-gap-y) * -1);\n margin-block-start: calc(var(--pine-gap-y) * -1);\n margin-inline-end: calc(var(--pine-gap-x) * -1);\n margin-inline-start: calc(var(--pine-gap-x) * -1);\n \n > * {\n padding-block-end: calc(var(--pine-gap-y));\n padding-block-start: calc(var(--pine-gap-y));\n padding-inline-end: calc(var(--pine-gap-x));\n padding-inline-start: calc(var(--pine-gap-x));\n }\n}\n\n.pds-row--no-wrap {\n flex-wrap: nowrap;\n}\n\n.pds-row--border {\n border: var(--pine-border-default);\n}\n\n// Justify Content helpers\n.pds-justify-content-start {\n justify-content: start;\n}\n\n.pds-justify-content-center {\n justify-content: center;\n}\n\n.pds-justify-content-end {\n justify-content: end;\n}\n\n.pds-justify-content-space-between {\n justify-content: space-between;\n}\n\n.pds-justify-content-space-around {\n justify-content: space-around;\n}\n\n.pds-justify-content-space-evenly {\n justify-content: space-evenly;\n}\n\n// Align Items helpers\n.pds-align-items-start {\n align-items: start;\n}\n\n.pds-align-items-center {\n align-items: center;\n}\n\n.pds-align-items-end {\n align-items: end;\n}\n\n.pds-align-items-stretch {\n align-items: stretch;\n}\n\n.pds-align-items-baseline {\n align-items: baseline;\n}\n","import { Component, Prop, h, Host} from '@stencil/core';\n\nimport { BoxTShirtSizeType } from '../../utils/types';\n\n@Component({\n tag: 'pds-row',\n styleUrl: 'pds-row.scss',\n})\nexport class PdsRow {\n /**\n * Defines the vertical alignment of the row items.\n * @defaultValue start\n */\n @Prop() alignItems?: `start` | `center` | `end` | `baseline` | `stretch`;\n\n /**\n * If `true`, the row will have a border.\n */\n @Prop() border? = false;\n\n /**\n * Defines the spacing between the row items.\n */\n @Prop() colGap?: BoxTShirtSizeType | null;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Defines the horizontal alignment of the row items.\n * @defaultValue start\n */\n @Prop() justifyContent?: `start` | `center` | `end` | `space-between` | `space-around`;\n\n /**\n * The minimum height of the row. Used in conjunction with alignment props\n */\n @Prop() minHeight?: string;\n\n /**\n * If `true`, the row items will not wrap to the next line if horizontal space is not available.\n */\n @Prop() noWrap? = false;\n\n private colGapMap: { [key in BoxTShirtSizeType]: string } = {\n none: '0',\n xxs: '.25rem',\n xs: '.5rem',\n sm: '1rem',\n md: '1.5rem',\n lg: '2.25rem',\n xl: '3rem',\n xxl: '4rem',\n };\n\n render() {\n const rowClasses = `\n ${this.alignItems !== undefined && this.alignItems.trim() !== '' ? `pds-align-items-${this.alignItems}` : ''}\n ${this.border ? 'pds-row--border' : ''}\n ${this.justifyContent !== undefined && this.justifyContent.trim() !== '' ? `pds-justify-content-${this.justifyContent}` : ''}\n ${this.noWrap ? 'pds-row--no-wrap' : ''}\n `;\n\n const rowInlineStyles = {\n ...(this.colGap && {\n '--pine-gap-x':this.colGap !== undefined && this.colGap.trim() !== '' ? this.colGapMap[this.colGap] : '',\n '--pine-gap-y':this.colGap !== undefined && this.colGap.trim() !== '' ? this.colGapMap[this.colGap] : '',\n }),\n ...(this.minHeight && {\n 'min-height': this.minHeight,\n }),\n };\n\n return (\n <Host class={`pds-row ${rowClasses}`} style={rowInlineStyles}>\n </Host>\n );\n }\n}\n"],"mappings":"kDAAA,MAAMA,EAAY,ypEAClB,MAAAC,EAAeD,E,MCOFE,EAAM,M,yBAsCTC,KAAAC,UAAoD,CAC1DC,KAAM,IACNC,IAAK,SACLC,GAAI,QACJC,GAAI,OACJC,GAAI,SACJC,GAAI,UACJC,GAAI,OACJC,IAAK,Q,sCApCW,M,oHA0BA,K,CAalB,MAAAC,GACE,MAAMC,EAAa,SACjBX,KAAKY,aAAeC,WAAab,KAAKY,WAAWE,SAAW,GAAK,mBAAmBd,KAAKY,aAAe,WACxGZ,KAAKe,OAAS,kBAAoB,WAClCf,KAAKgB,iBAAmBH,WAAab,KAAKgB,eAAeF,SAAW,GAAK,uBAAuBd,KAAKgB,iBAAmB,WACxHhB,KAAKiB,OAAS,mBAAqB,SAGvC,MAAMC,EAAeC,OAAAC,OAAAD,OAAAC,OAAA,GACfpB,KAAKqB,QAAU,CACjB,eAAerB,KAAKqB,SAAWR,WAAcb,KAAKqB,OAAOP,SAAW,GAAKd,KAAKC,UAAUD,KAAKqB,QAAU,GACvG,eAAerB,KAAKqB,SAAWR,WAAcb,KAAKqB,OAAOP,SAAW,GAAKd,KAAKC,UAAUD,KAAKqB,QAAU,KAEnGrB,KAAKsB,WAAa,CACpB,aAActB,KAAKsB,YAIvB,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAO,WAAWf,IAAcgB,MAAOT,G"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as e,c as i,h as r,H as a}from"./p-b5b5ce83.js";import{P as o,a as n,m as l}from"./p-17ba6ff2.js";const s=":host{--background:var(--pine-color-base-white);--background-disabled:var(--pine-color-neutral-grey-100);--color:var(--pine-color-neutral-charcoal-500);--color-error:var(--pine-color-red-300);--color-placeholder:var(--pine-color-neutral-charcoal-200);--color-disabled:var(--pine-color-neutral-grey-500);--border-color-default:var(--pine-color-neutral-grey-400);--border-color-hover:var(--pine-color-neutral-grey-500);--focus-box-shadow:0 0 0 4px var(--pine-color-primary-200);--label-font-size:var(--pine-font-size-body);--label-font-weight:var(--pine-font-weight-medium);--label-line-height:var(--pine-line-height-md);--label-margin-block-end:var(--pine-spacing-xs);--field-font-size:var(--pine-font-size-body);--field-font-weight:var(--pine-font-weight-regular);--field-line-height:var(--pine-line-height-md);--field-padding-block:var(--pine-spacing-xs);--field-padding-inline:var(--pine-spacing-sm);--helper-message-font-size:var(--pine-font-size-body);--helper-message-font-weight:var(--pine-font-weight-regular);--helper-message-line-height:var(--pine-line-height-sm);--helper-message-margin-top:var(--pine-spacing-xs);display:inline}.pds-input{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}label{font-size:var(--label-font-size);font-weight:var(--label-font-weight);line-height:var(--label-line-height);-webkit-margin-after:var(--label-margin-block-end);margin-block-end:var(--label-margin-block-end)}input{border:1px solid var(--border-color-default);border-radius:10px;font-size:var(--field-font-size);font-weight:var(--field-font-weight);line-height:var(--field-line-height);padding:var(--field-padding-block) var(--field-padding-inline);}input:disabled{background-color:var(--background-disabled);color:var(--color-disabled);cursor:not-allowed}input:hover{border-color:var(--border-color-hover)}input:focus{-webkit-box-shadow:var(--focus-box-shadow);box-shadow:var(--focus-box-shadow);outline:none}input::-webkit-input-placeholder{color:var(--color-placeholder)}input::-moz-placeholder{color:var(--color-placeholder)}input::-moz-placeholder{color:var(--color-placeholder)}input:-ms-input-placeholder{color:var(--color-placeholder)}input:has(~.pds-input__error-message){border-color:var(--color-error)}.pds-input__error-message,.pds-input__helper-message{font-size:var(--helper-message-font-size);font-weight:var(--helper-message-font-weight);line-height:var(--helper-message-line-height);-webkit-margin-after:0;margin-block-end:0;-webkit-margin-before:var(--helper-message-margin-top);margin-block-start:var(--helper-message-margin-top)}.pds-input__error-message{color:var(--color-error)}";const t=s;const d=class{constructor(r){e(this,r);this.pdsInput=i(this,"pdsInput",7);this.onInputEvent=e=>{const i=e.target;if(i){this.value=i.value||""}this.pdsInput.emit(e)};this.componentId=undefined;this.disabled=undefined;this.errorMessage=undefined;this.helperMessage=undefined;this.invalid=undefined;this.label=undefined;this.name=undefined;this.placeholder=undefined;this.readonly=undefined;this.required=undefined;this.type="text";this.value=undefined}render(){return r(a,{key:"bb6e9f4cb7515c3b8fbbc583ba1c9ade05d8ae90","aria-disabled":this.disabled?"true":null},r("div",{key:"960462be7a176c6b62412ce4b44af79f9b137a0c",class:"pds-input"},r(o,{key:"beb8f1c8e8a1b4b692d2838abc99e427cc13c392",htmlFor:this.componentId,text:this.label}),r("input",{key:"c69ceb5d687fb37b843e71e8aa9bad8b9f7bcaa8",class:"pds-input__field","aria-describedby":n(this.componentId,this.invalid,this.helperMessage),"aria-invalid":this.invalid?"true":undefined,disabled:this.disabled,id:this.componentId,name:this.name,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,type:this.type,value:this.value,onInput:this.onInputEvent}),this.helperMessage&&r("p",{class:"pds-input__helper-message",id:l(this.componentId,"helper")},this.helperMessage),this.errorMessage&&r("p",{class:"pds-input__error-message",id:l(this.componentId,"error"),"aria-live":"assertive"},this.errorMessage)))}};d.style=t;export{d as pds_input};
|
|
2
|
+
//# sourceMappingURL=p-485d225c.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["pdsInputCss","PdsInputStyle0","PdsInput","this","onInputEvent","ev","input","target","value","pdsInput","emit","render","h","Host","key","disabled","class","PdsLabel","htmlFor","componentId","text","label","assignDescription","invalid","helperMessage","undefined","id","name","placeholder","readOnly","readonly","required","type","onInput","messageId","errorMessage"],"sources":["src/components/pds-input/pds-input.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.tsx"],"sourcesContent":[":host {\n --background: var(--pine-color-base-white);\n --background-disabled: var(--pine-color-neutral-grey-100);\n\n --color: var(--pine-color-neutral-charcoal-500);\n --color-error: var(--pine-color-red-300);\n --color-placeholder: var(--pine-color-neutral-charcoal-200);\n --color-disabled: var(--pine-color-neutral-grey-500);\n\n --border-color-default: var(--pine-color-neutral-grey-400);\n --border-color-hover: var(--pine-color-neutral-grey-500);\n\n --focus-box-shadow: 0 0 0 4px var(--pine-color-primary-200);\n\n --label-font-size: var(--pine-font-size-body);\n --label-font-weight: var(--pine-font-weight-medium);\n --label-line-height: var(--pine-line-height-md);\n --label-margin-block-end: var(--pine-spacing-xs);\n\n --field-font-size: var(--pine-font-size-body);\n --field-font-weight: var(--pine-font-weight-regular);\n --field-line-height: var(--pine-line-height-md);\n --field-padding-block: var(--pine-spacing-xs);\n --field-padding-inline: var(--pine-spacing-sm);\n\n --helper-message-font-size: var(--pine-font-size-body);\n --helper-message-font-weight: var(--pine-font-weight-regular);\n --helper-message-line-height: var(--pine-line-height-sm);\n --helper-message-margin-top: var(--pine-spacing-xs);\n\n display: inline;\n}\n\n.pds-input {\n display: flex;\n flex-direction: column;\n}\n\nlabel {\n font-size: var(--label-font-size);\n font-weight: var(--label-font-weight);\n line-height: var(--label-line-height);\n margin-block-end: var(--label-margin-block-end);\n}\n\ninput {\n border: 1px solid var(--border-color-default);\n border-radius: 10px;\n font-size: var(--field-font-size);\n font-weight: var(--field-font-weight);\n line-height: var(--field-line-height);\n padding: var(--field-padding-block) var(--field-padding-inline);\n\n &:disabled {\n background-color: var(--background-disabled);\n color: var(--color-disabled);\n cursor: not-allowed;\n }\n\n &:hover {\n border-color: var(--border-color-hover);\n }\n\n &:focus {\n box-shadow: var(--focus-box-shadow);\n outline: none;\n }\n\n /* stylelint-disable */\n &::-webkit-input-placeholder {\n color: var(--color-placeholder);\n }\n\n &::-moz-placeholder {\n color: var(--color-placeholder);\n }\n\n &::-moz-placeholder {\n color: var(--color-placeholder);\n }\n\n &:-ms-input-placeholder {\n color: var(--color-placeholder);\n }\n\n &:has(~.pds-input__error-message) {\n border-color: var(--color-error);\n }\n /* stylelint-enable */\n}\n\n.pds-input__error-message,\n.pds-input__helper-message {\n font-size: var(--helper-message-font-size);\n font-weight: var(--helper-message-font-weight);\n line-height: var(--helper-message-line-height);\n margin-block-end: 0;\n margin-block-start: var(--helper-message-margin-top);\n}\n\n.pds-input__error-message {\n color: var(--color-error);\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { PdsLabel } from '../_internal/pds-label/pds-label';\n\n@Component({\n tag: 'pds-input',\n styleUrl: 'pds-input.scss',\n shadow: true,\n})\nexport class PdsInput {\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 input field is disabled.\n */\n @Prop() disabled?: boolean;\n\n /**\n * Specifies the error message and provides an error-themed treatment to the field.\n */\n @Prop() errorMessage?: string;\n\n /**\n * Displays a message or hint below the input field.\n */\n @Prop() helperMessage?: string;\n\n /**\n * Indicates whether or not the input field is invalid or throws an error.\n */\n @Prop() invalid?: boolean;\n\n /**\n * Text to be displayed as the input label.\n */\n @Prop() label?: string;\n\n /**\n * Specifies the name. Submitted with the form name/value pair.\n */\n @Prop() name?: string;\n\n /**\n * Specifies a short hint that describes the expected value of the input field.\n */\n @Prop() placeholder?: string;\n\n /**\n * Indicates whether or not the input field is readonly.\n */\n @Prop() readonly?: boolean;\n\n /**\n * Indicates whether or not the input field is required.\n */\n @Prop() required?: boolean;\n\n /**\n * Determines the type of control that will be displayed\n `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`\n * @defaultValue \"text\"\n */\n @Prop() type = 'text';\n\n /**\n * The value of the input.\n */\n @Prop({mutable: true}) value?: string;\n\n /**\n * Emitted when a keyboard input occurred.\n */\n @Event() pdsInput: EventEmitter<InputEvent>;\n\n private onInputEvent = (ev: Event) => {\n const input = ev.target as HTMLInputElement | null;\n if (input) {\n this.value = input.value || '';\n }\n this.pdsInput.emit(ev as InputEvent);\n };\n\n render() {\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n >\n <div class=\"pds-input\">\n <PdsLabel htmlFor={this.componentId} text={this.label} />\n <input class=\"pds-input__field\"\n aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n disabled={this.disabled}\n id={this.componentId}\n name={this.name}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n type={this.type}\n value={this.value}\n onInput={this.onInputEvent}\n />\n {this.helperMessage &&\n <p\n class=\"pds-input__helper-message\"\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </p>\n }\n {this.errorMessage &&\n <p\n class=\"pds-input__error-message\"\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n {this.errorMessage}\n </p>\n }\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"2GAAA,MAAMA,EAAc,4kFACpB,MAAAC,EAAeD,E,MCQFE,EAAQ,M,4DAoEXC,KAAAC,aAAgBC,IACtB,MAAMC,EAAQD,EAAGE,OACjB,GAAID,EAAO,CACTH,KAAKK,MAAQF,EAAME,OAAS,E,CAE9BL,KAAKM,SAASC,KAAKL,EAAiB,E,iQAjBvB,O,qBAoBf,MAAAM,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2DACYX,KAAKY,SAAW,OAAS,MAExCH,EAAA,OAAAE,IAAA,2CAAKE,MAAM,aACTJ,EAACK,EAAQ,CAAAH,IAAA,2CAACI,QAASf,KAAKgB,YAAaC,KAAMjB,KAAKkB,QAChDT,EAAA,SAAAE,IAAA,2CAAOE,MAAM,mBAAkB,mBACXM,EAAkBnB,KAAKgB,YAAahB,KAAKoB,QAASpB,KAAKqB,eAAc,eACzErB,KAAKoB,QAAU,OAASE,UACtCV,SAAUZ,KAAKY,SACfW,GAAIvB,KAAKgB,YACTQ,KAAMxB,KAAKwB,KACXC,YAAazB,KAAKyB,YAClBC,SAAU1B,KAAK2B,SACfC,SAAU5B,KAAK4B,SACfC,KAAM7B,KAAK6B,KACXxB,MAAOL,KAAKK,MACZyB,QAAS9B,KAAKC,eAEfD,KAAKqB,eACJZ,EAAA,KACEI,MAAM,4BACNU,GAAIQ,EAAU/B,KAAKgB,YAAa,WAE/BhB,KAAKqB,eAGTrB,KAAKgC,cACJvB,EAAA,KACEI,MAAM,2BACNU,GAAIQ,EAAU/B,KAAKgB,YAAa,SAAQ,YAC9B,aAEThB,KAAKgC,e"}
|