@pine-ds/core 0.2.4 → 1.0.1
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/dist/cjs/{index-49f8049e.js → index-f034f06e.js} +3 -1
- package/dist/cjs/index-f034f06e.js.map +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/pds-accordion.cjs.entry.js +2 -2
- package/dist/cjs/pds-accordion.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-avatar.cjs.entry.js +2 -2
- package/dist/cjs/pds-avatar.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-box.cjs.entry.js +3 -3
- package/dist/cjs/pds-box.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-button.cjs.entry.js +2 -2
- package/dist/cjs/pds-button.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-checkbox_2.cjs.entry.js +2 -2
- package/dist/cjs/pds-checkbox_2.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-chip.cjs.entry.js +2 -2
- package/dist/cjs/pds-chip.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-copytext.cjs.entry.js +4 -18
- package/dist/cjs/pds-copytext.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-divider.cjs.entry.js +1 -1
- package/dist/cjs/pds-divider.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-image.cjs.entry.js +1 -1
- package/dist/cjs/pds-image.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-input.cjs.entry.js +1 -1
- package/dist/cjs/pds-input.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-link.cjs.entry.js +2 -2
- package/dist/cjs/pds-link.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-progress.cjs.entry.js +2 -2
- package/dist/cjs/pds-progress.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-radio.cjs.entry.js +1 -1
- package/dist/cjs/pds-radio.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-sortable-item.cjs.entry.js +13 -3
- package/dist/cjs/pds-sortable-item.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-sortable.cjs.entry.js +3 -3
- package/dist/cjs/pds-sortable.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-switch.cjs.entry.js +1 -1
- package/dist/cjs/pds-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-tab.cjs.entry.js +1 -1
- package/dist/cjs/pds-tab.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-table-head-cell.cjs.entry.js +2 -2
- package/dist/cjs/pds-table-head-cell.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-table-head.cjs.entry.js +1 -1
- package/dist/cjs/pds-table-head.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-table-row.cjs.entry.js +1 -1
- package/dist/cjs/pds-table-row.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-table.cjs.entry.js +1 -1
- package/dist/cjs/pds-table.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-tabpanel.cjs.entry.js +1 -1
- package/dist/cjs/pds-tabpanel.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-tabs.cjs.entry.js +1 -1
- package/dist/cjs/pds-tabs.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-textarea.cjs.entry.js +1 -1
- package/dist/cjs/pds-textarea.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-tooltip.cjs.entry.js +1 -1
- package/dist/cjs/pds-tooltip.cjs.entry.js.map +1 -1
- package/dist/cjs/pine-core.cjs.js +1 -1
- package/dist/collection/components/pds-accordion/pds-accordion.css +25 -39
- package/dist/collection/components/pds-avatar/pds-avatar.css +22 -19
- package/dist/collection/components/pds-box/pds-box.css +30 -30
- package/dist/collection/components/pds-box/pds-box.js +2 -2
- package/dist/collection/components/pds-box/pds-box.js.map +1 -1
- package/dist/collection/components/pds-button/pds-button.css +88 -81
- package/dist/collection/components/pds-button/stories/pds-button.stories.js +1 -0
- package/dist/collection/components/pds-checkbox/pds-checkbox.css +26 -28
- package/dist/collection/components/pds-chip/pds-chip.css +88 -94
- package/dist/collection/components/pds-copytext/pds-copytext.css +38 -33
- package/dist/collection/components/pds-copytext/pds-copytext.js +2 -16
- package/dist/collection/components/pds-copytext/pds-copytext.js.map +1 -1
- package/dist/collection/components/pds-divider/pds-divider.css +36 -36
- package/dist/collection/components/pds-image/pds-image.css +2 -2
- package/dist/collection/components/pds-input/pds-input.css +45 -46
- package/dist/collection/components/pds-link/pds-link.css +19 -19
- package/dist/collection/components/pds-progress/pds-progress.css +20 -18
- package/dist/collection/components/pds-progress/pds-progress.js +2 -2
- package/dist/collection/components/pds-progress/pds-progress.js.map +1 -1
- package/dist/collection/components/pds-radio/pds-radio.css +28 -27
- package/dist/collection/components/pds-sortable/pds-sortable-item/pds-sortable-item.css +17 -17
- package/dist/collection/components/pds-sortable/pds-sortable-item/pds-sortable-item.js +15 -5
- package/dist/collection/components/pds-sortable/pds-sortable-item/pds-sortable-item.js.map +1 -1
- package/dist/collection/components/pds-sortable/pds-sortable-item/stories/pds-sortable-item.stories.js +2 -2
- package/dist/collection/components/pds-sortable/pds-sortable.css +3 -3
- package/dist/collection/components/pds-sortable/pds-sortable.js +2 -2
- package/dist/collection/components/pds-sortable/pds-sortable.js.map +1 -1
- package/dist/collection/components/pds-sortable/sortable-interface.js +2 -0
- package/dist/collection/components/pds-sortable/sortable-interface.js.map +1 -0
- package/dist/collection/components/pds-sortable/stories/pds-sortable.stories.js +6 -6
- package/dist/collection/components/pds-switch/pds-switch.css +48 -48
- package/dist/collection/components/pds-table/pds-table-cell/pds-table-cell.css +19 -19
- package/dist/collection/components/pds-table/pds-table-head/pds-table-head.css +4 -4
- package/dist/collection/components/pds-table/pds-table-head-cell/pds-table-head-cell.css +25 -25
- package/dist/collection/components/pds-table/pds-table-row/pds-table-row.css +4 -4
- package/dist/collection/components/pds-table/pds-table.css +3 -3
- package/dist/collection/components/pds-tabs/pds-tab/pds-tab.css +48 -43
- package/dist/collection/components/pds-tabs/pds-tabpanel/pds-tabpanel.css +2 -2
- package/dist/collection/components/pds-tabs/pds-tabs.css +11 -11
- package/dist/collection/components/pds-textarea/pds-textarea.css +46 -47
- package/dist/collection/components/pds-tooltip/pds-tooltip.css +67 -67
- package/dist/docs.json +7 -7
- package/{components/index2.js → dist/esm/index-c6934caf.js} +3 -2
- package/dist/esm/index-c6934caf.js.map +1 -0
- package/dist/esm/loader.js +1 -1
- package/dist/esm/pds-accordion.entry.js +2 -2
- package/dist/esm/pds-accordion.entry.js.map +1 -1
- package/dist/esm/pds-avatar.entry.js +2 -2
- package/dist/esm/pds-avatar.entry.js.map +1 -1
- package/dist/esm/pds-box.entry.js +3 -3
- package/dist/esm/pds-box.entry.js.map +1 -1
- package/dist/esm/pds-button.entry.js +2 -2
- package/dist/esm/pds-button.entry.js.map +1 -1
- package/dist/esm/pds-checkbox_2.entry.js +2 -2
- package/dist/esm/pds-checkbox_2.entry.js.map +1 -1
- package/dist/esm/pds-chip.entry.js +2 -2
- package/dist/esm/pds-chip.entry.js.map +1 -1
- package/dist/esm/pds-copytext.entry.js +4 -18
- package/dist/esm/pds-copytext.entry.js.map +1 -1
- package/dist/esm/pds-divider.entry.js +1 -1
- package/dist/esm/pds-divider.entry.js.map +1 -1
- package/dist/esm/pds-image.entry.js +1 -1
- package/dist/esm/pds-image.entry.js.map +1 -1
- package/dist/esm/pds-input.entry.js +1 -1
- package/dist/esm/pds-input.entry.js.map +1 -1
- package/dist/esm/pds-link.entry.js +2 -2
- package/dist/esm/pds-link.entry.js.map +1 -1
- package/dist/esm/pds-progress.entry.js +2 -2
- package/dist/esm/pds-progress.entry.js.map +1 -1
- package/dist/esm/pds-radio.entry.js +1 -1
- package/dist/esm/pds-radio.entry.js.map +1 -1
- package/dist/esm/pds-sortable-item.entry.js +14 -4
- package/dist/esm/pds-sortable-item.entry.js.map +1 -1
- package/dist/esm/pds-sortable.entry.js +3 -3
- package/dist/esm/pds-sortable.entry.js.map +1 -1
- package/dist/esm/pds-switch.entry.js +1 -1
- package/dist/esm/pds-switch.entry.js.map +1 -1
- package/dist/esm/pds-tab.entry.js +1 -1
- package/dist/esm/pds-tab.entry.js.map +1 -1
- package/dist/esm/pds-table-head-cell.entry.js +2 -2
- package/dist/esm/pds-table-head-cell.entry.js.map +1 -1
- package/dist/esm/pds-table-head.entry.js +1 -1
- package/dist/esm/pds-table-head.entry.js.map +1 -1
- package/dist/esm/pds-table-row.entry.js +1 -1
- package/dist/esm/pds-table-row.entry.js.map +1 -1
- package/dist/esm/pds-table.entry.js +1 -1
- package/dist/esm/pds-table.entry.js.map +1 -1
- package/dist/esm/pds-tabpanel.entry.js +1 -1
- package/dist/esm/pds-tabpanel.entry.js.map +1 -1
- package/dist/esm/pds-tabs.entry.js +1 -1
- package/dist/esm/pds-tabs.entry.js.map +1 -1
- package/dist/esm/pds-textarea.entry.js +1 -1
- package/dist/esm/pds-textarea.entry.js.map +1 -1
- package/dist/esm/pds-tooltip.entry.js +1 -1
- package/dist/esm/pds-tooltip.entry.js.map +1 -1
- package/dist/esm/pine-core.js +1 -1
- package/dist/esm-es5/index-c6934caf.js +2 -0
- package/dist/esm-es5/index-c6934caf.js.map +1 -0
- package/dist/esm-es5/loader.js +1 -1
- package/dist/esm-es5/loader.js.map +1 -1
- package/dist/esm-es5/pds-accordion.entry.js +1 -1
- package/dist/esm-es5/pds-accordion.entry.js.map +1 -1
- package/dist/esm-es5/pds-avatar.entry.js +1 -1
- package/dist/esm-es5/pds-avatar.entry.js.map +1 -1
- package/dist/esm-es5/pds-box.entry.js +1 -1
- package/dist/esm-es5/pds-box.entry.js.map +1 -1
- package/dist/esm-es5/pds-button.entry.js +1 -1
- package/dist/esm-es5/pds-button.entry.js.map +1 -1
- package/dist/esm-es5/pds-checkbox_2.entry.js +1 -1
- package/dist/esm-es5/pds-checkbox_2.entry.js.map +1 -1
- package/dist/esm-es5/pds-chip.entry.js +1 -1
- package/dist/esm-es5/pds-chip.entry.js.map +1 -1
- package/dist/esm-es5/pds-copytext.entry.js +1 -1
- package/dist/esm-es5/pds-copytext.entry.js.map +1 -1
- package/dist/esm-es5/pds-divider.entry.js +1 -1
- package/dist/esm-es5/pds-divider.entry.js.map +1 -1
- package/dist/esm-es5/pds-image.entry.js +1 -1
- package/dist/esm-es5/pds-image.entry.js.map +1 -1
- package/dist/esm-es5/pds-input.entry.js +1 -1
- package/dist/esm-es5/pds-input.entry.js.map +1 -1
- package/dist/esm-es5/pds-link.entry.js +1 -1
- package/dist/esm-es5/pds-link.entry.js.map +1 -1
- package/dist/esm-es5/pds-progress.entry.js +1 -1
- package/dist/esm-es5/pds-progress.entry.js.map +1 -1
- package/dist/esm-es5/pds-radio.entry.js +1 -1
- package/dist/esm-es5/pds-radio.entry.js.map +1 -1
- package/dist/esm-es5/pds-sortable-item.entry.js +1 -1
- package/dist/esm-es5/pds-sortable-item.entry.js.map +1 -1
- package/dist/esm-es5/pds-sortable.entry.js +1 -1
- package/dist/esm-es5/pds-sortable.entry.js.map +1 -1
- package/dist/esm-es5/pds-switch.entry.js +1 -1
- package/dist/esm-es5/pds-switch.entry.js.map +1 -1
- package/dist/esm-es5/pds-tab.entry.js +1 -1
- package/dist/esm-es5/pds-tab.entry.js.map +1 -1
- package/dist/esm-es5/pds-table-head-cell.entry.js +1 -1
- package/dist/esm-es5/pds-table-head-cell.entry.js.map +1 -1
- package/dist/esm-es5/pds-table-head.entry.js +1 -1
- package/dist/esm-es5/pds-table-head.entry.js.map +1 -1
- package/dist/esm-es5/pds-table-row.entry.js +1 -1
- package/dist/esm-es5/pds-table-row.entry.js.map +1 -1
- package/dist/esm-es5/pds-table.entry.js +1 -1
- package/dist/esm-es5/pds-table.entry.js.map +1 -1
- package/dist/esm-es5/pds-tabpanel.entry.js +1 -1
- package/dist/esm-es5/pds-tabpanel.entry.js.map +1 -1
- package/dist/esm-es5/pds-tabs.entry.js +1 -1
- package/dist/esm-es5/pds-tabs.entry.js.map +1 -1
- package/dist/esm-es5/pds-textarea.entry.js +1 -1
- package/dist/esm-es5/pds-textarea.entry.js.map +1 -1
- package/dist/esm-es5/pds-tooltip.entry.js +1 -1
- package/dist/esm-es5/pds-tooltip.entry.js.map +1 -1
- package/dist/esm-es5/pine-core.js +1 -1
- package/dist/esm-es5/pine-core.js.map +1 -1
- package/dist/pine-core/p-0a1e2528.system.entry.js +2 -0
- package/dist/pine-core/p-0a1e2528.system.entry.js.map +1 -0
- package/dist/pine-core/p-0a636312.system.entry.js +2 -0
- package/dist/pine-core/p-0a636312.system.entry.js.map +1 -0
- package/dist/pine-core/p-0eb4e674.entry.js +2 -0
- package/dist/pine-core/p-0eb4e674.entry.js.map +1 -0
- package/dist/pine-core/p-16e9d55b.entry.js +2 -0
- package/dist/pine-core/p-16e9d55b.entry.js.map +1 -0
- package/dist/pine-core/p-173f8d39.entry.js +2 -0
- package/dist/pine-core/p-173f8d39.entry.js.map +1 -0
- package/dist/pine-core/p-209bc3fd.entry.js +2 -0
- package/dist/pine-core/p-209bc3fd.entry.js.map +1 -0
- package/dist/pine-core/p-2e19ec3d.system.entry.js +2 -0
- package/dist/pine-core/p-2e19ec3d.system.entry.js.map +1 -0
- package/dist/pine-core/p-2eacced7.system.entry.js +2 -0
- package/dist/pine-core/p-2eacced7.system.entry.js.map +1 -0
- package/dist/pine-core/p-2fe87b9d.entry.js +2 -0
- package/dist/pine-core/p-2fe87b9d.entry.js.map +1 -0
- package/dist/pine-core/p-327e1afa.system.entry.js +2 -0
- package/dist/pine-core/p-327e1afa.system.entry.js.map +1 -0
- package/dist/pine-core/p-380e465b.entry.js +2 -0
- package/dist/pine-core/p-380e465b.entry.js.map +1 -0
- package/dist/pine-core/p-403a20e8.js +2 -0
- package/dist/pine-core/p-403a20e8.js.map +1 -0
- package/dist/pine-core/p-43783da1.system.entry.js +2 -0
- package/dist/pine-core/p-43783da1.system.entry.js.map +1 -0
- package/dist/pine-core/p-478689a0.system.entry.js +2 -0
- package/dist/pine-core/p-478689a0.system.entry.js.map +1 -0
- package/dist/pine-core/p-4f7ee11c.entry.js +2 -0
- package/dist/pine-core/p-4f7ee11c.entry.js.map +1 -0
- package/dist/pine-core/{p-6f2f7e92.entry.js → p-5073b1c0.entry.js} +2 -2
- package/dist/pine-core/{p-6f2f7e92.entry.js.map → p-5073b1c0.entry.js.map} +1 -1
- package/dist/pine-core/p-51f81513.entry.js +2 -0
- package/dist/pine-core/p-51f81513.entry.js.map +1 -0
- package/dist/pine-core/p-5df59e63.system.entry.js +2 -0
- package/dist/pine-core/p-5df59e63.system.entry.js.map +1 -0
- package/dist/pine-core/p-5f2b3f57.entry.js +2 -0
- package/dist/pine-core/p-5f2b3f57.entry.js.map +1 -0
- package/dist/pine-core/p-61ab207f.entry.js +2 -0
- package/dist/pine-core/p-61ab207f.entry.js.map +1 -0
- package/dist/pine-core/p-6370aa12.system.entry.js +2 -0
- package/dist/pine-core/p-6370aa12.system.entry.js.map +1 -0
- package/dist/pine-core/p-674edd62.system.js +2 -0
- package/dist/pine-core/p-674edd62.system.js.map +1 -0
- package/dist/pine-core/p-6aa28287.system.entry.js +2 -0
- package/dist/pine-core/p-6aa28287.system.entry.js.map +1 -0
- package/dist/pine-core/p-6e315022.entry.js +2 -0
- package/dist/pine-core/p-6e315022.entry.js.map +1 -0
- package/dist/pine-core/p-70481699.entry.js +2 -0
- package/dist/pine-core/p-70481699.entry.js.map +1 -0
- package/dist/pine-core/p-7546babc.entry.js +2 -0
- package/dist/pine-core/p-7546babc.entry.js.map +1 -0
- package/dist/pine-core/p-75951ef3.system.entry.js +2 -0
- package/dist/pine-core/p-75951ef3.system.entry.js.map +1 -0
- package/dist/pine-core/p-75c441ef.system.entry.js +2 -0
- package/dist/pine-core/p-75c441ef.system.entry.js.map +1 -0
- package/dist/pine-core/p-7611d073.system.js +1 -1
- package/dist/pine-core/p-7611d073.system.js.map +1 -1
- package/dist/pine-core/p-7f917c20.entry.js +2 -0
- package/dist/pine-core/p-7f917c20.entry.js.map +1 -0
- package/dist/pine-core/p-809648ee.entry.js +2 -0
- package/dist/pine-core/p-809648ee.entry.js.map +1 -0
- package/dist/pine-core/p-87c2ac18.entry.js +2 -0
- package/dist/pine-core/p-87c2ac18.entry.js.map +1 -0
- package/dist/pine-core/p-8c5e76d4.system.entry.js +2 -0
- package/dist/pine-core/p-8c5e76d4.system.entry.js.map +1 -0
- package/dist/pine-core/p-9a129745.entry.js +2 -0
- package/dist/pine-core/p-9a129745.entry.js.map +1 -0
- package/dist/pine-core/{p-29f5dffb.system.entry.js → p-9e33f4fb.system.entry.js} +2 -2
- package/dist/pine-core/{p-29f5dffb.system.entry.js.map → p-9e33f4fb.system.entry.js.map} +1 -1
- package/dist/pine-core/p-9f8a1aa6.entry.js +2 -0
- package/dist/pine-core/p-9f8a1aa6.entry.js.map +1 -0
- package/dist/pine-core/p-ad891586.system.entry.js +2 -0
- package/dist/pine-core/p-ad891586.system.entry.js.map +1 -0
- package/dist/pine-core/p-b103a7a9.entry.js +2 -0
- package/dist/pine-core/p-b103a7a9.entry.js.map +1 -0
- package/dist/pine-core/p-bbaaa246.system.entry.js +2 -0
- package/dist/pine-core/p-bbaaa246.system.entry.js.map +1 -0
- package/dist/pine-core/p-bc1cb8e2.entry.js +2 -0
- package/dist/pine-core/{p-de8abfde.system.entry.js.map → p-bc1cb8e2.entry.js.map} +1 -1
- package/dist/pine-core/p-bc4bbda0.entry.js +2 -0
- package/dist/pine-core/p-bc4bbda0.entry.js.map +1 -0
- package/dist/pine-core/p-bd5135c3.entry.js +2 -0
- package/dist/pine-core/p-bd5135c3.entry.js.map +1 -0
- package/dist/pine-core/p-c3de3fb3.system.entry.js +2 -0
- package/dist/pine-core/p-c3de3fb3.system.entry.js.map +1 -0
- package/dist/pine-core/p-c721d912.system.entry.js +2 -0
- package/dist/pine-core/p-c721d912.system.entry.js.map +1 -0
- package/dist/pine-core/p-cfb22651.system.entry.js +2 -0
- package/dist/pine-core/p-cfb22651.system.entry.js.map +1 -0
- package/dist/pine-core/p-d0828f12.entry.js +2 -0
- package/dist/pine-core/p-d0828f12.entry.js.map +1 -0
- package/dist/pine-core/p-dacd68cf.system.entry.js +2 -0
- package/dist/pine-core/p-dacd68cf.system.entry.js.map +1 -0
- package/dist/pine-core/p-de79befb.system.entry.js +2 -0
- package/dist/pine-core/p-de79befb.system.entry.js.map +1 -0
- package/dist/pine-core/p-e3455d30.system.entry.js +2 -0
- package/dist/pine-core/p-e3455d30.system.entry.js.map +1 -0
- package/dist/pine-core/p-ec56491f.system.entry.js +2 -0
- package/dist/pine-core/p-ec56491f.system.entry.js.map +1 -0
- package/dist/pine-core/p-ecbf0b15.system.entry.js +2 -0
- package/dist/pine-core/p-ecbf0b15.system.entry.js.map +1 -0
- package/dist/pine-core/p-f12c58dc.system.entry.js +2 -0
- package/dist/pine-core/p-f12c58dc.system.entry.js.map +1 -0
- package/dist/pine-core/p-ff9044ed.entry.js +2 -0
- package/dist/pine-core/p-ff9044ed.entry.js.map +1 -0
- package/dist/pine-core/pine-core.css +1 -1
- package/dist/pine-core/pine-core.esm.js +1 -1
- package/dist/pine-core/pine-core.esm.js.map +1 -1
- package/dist/types/components/pds-progress/pds-progress.d.ts +1 -1
- package/dist/types/components/pds-sortable/pds-sortable-item/pds-sortable-item.d.ts +4 -1
- package/dist/types/components/pds-sortable/sortable-interface.d.ts +7 -0
- package/dist/types/components.d.ts +4 -4
- package/package.json +2 -2
- package/components/custom-elements.d.ts +0 -2
- package/components/index.d.ts +0 -92
- package/components/index.js +0 -32
- package/components/index.js.map +0 -1
- package/components/index2.js.map +0 -1
- package/components/package.json +0 -9
- package/components/pds-accordion.d.ts +0 -11
- package/components/pds-accordion.js +0 -74
- package/components/pds-accordion.js.map +0 -1
- package/components/pds-avatar.d.ts +0 -11
- package/components/pds-avatar.js +0 -103
- package/components/pds-avatar.js.map +0 -1
- package/components/pds-box.d.ts +0 -11
- package/components/pds-box.js +0 -124
- package/components/pds-box.js.map +0 -1
- package/components/pds-button.d.ts +0 -11
- package/components/pds-button.js +0 -8
- package/components/pds-button.js.map +0 -1
- package/components/pds-button2.js +0 -84
- package/components/pds-button2.js.map +0 -1
- package/components/pds-checkbox.d.ts +0 -11
- package/components/pds-checkbox.js +0 -8
- package/components/pds-checkbox.js.map +0 -1
- package/components/pds-checkbox2.js +0 -86
- package/components/pds-checkbox2.js.map +0 -1
- package/components/pds-chip.d.ts +0 -11
- package/components/pds-chip.js +0 -78
- package/components/pds-chip.js.map +0 -1
- package/components/pds-copytext.d.ts +0 -11
- package/components/pds-copytext.js +0 -102
- package/components/pds-copytext.js.map +0 -1
- package/components/pds-divider.d.ts +0 -11
- package/components/pds-divider.js +0 -54
- package/components/pds-divider.js.map +0 -1
- package/components/pds-icon.js +0 -8
- package/components/pds-icon.js.map +0 -1
- package/components/pds-icon2.js +0 -359
- package/components/pds-icon2.js.map +0 -1
- package/components/pds-image.d.ts +0 -11
- package/components/pds-image.js +0 -55
- package/components/pds-image.js.map +0 -1
- package/components/pds-input.d.ts +0 -11
- package/components/pds-input.js +0 -72
- package/components/pds-input.js.map +0 -1
- package/components/pds-label.js +0 -39
- package/components/pds-label.js.map +0 -1
- package/components/pds-link.d.ts +0 -11
- package/components/pds-link.js +0 -65
- package/components/pds-link.js.map +0 -1
- package/components/pds-progress.d.ts +0 -11
- package/components/pds-progress.js +0 -49
- package/components/pds-progress.js.map +0 -1
- package/components/pds-radio.d.ts +0 -11
- package/components/pds-radio.js +0 -78
- package/components/pds-radio.js.map +0 -1
- package/components/pds-row.d.ts +0 -11
- package/components/pds-row.js +0 -72
- package/components/pds-row.js.map +0 -1
- package/components/pds-sortable-item.d.ts +0 -11
- package/components/pds-sortable-item.js +0 -48
- package/components/pds-sortable-item.js.map +0 -1
- package/components/pds-sortable.d.ts +0 -11
- package/components/pds-sortable.js +0 -2722
- package/components/pds-sortable.js.map +0 -1
- package/components/pds-switch.d.ts +0 -11
- package/components/pds-switch.js +0 -82
- package/components/pds-switch.js.map +0 -1
- package/components/pds-tab.d.ts +0 -11
- package/components/pds-tab.js +0 -53
- package/components/pds-tab.js.map +0 -1
- package/components/pds-table-body.d.ts +0 -11
- package/components/pds-table-body.js +0 -36
- package/components/pds-table-body.js.map +0 -1
- package/components/pds-table-cell.d.ts +0 -11
- package/components/pds-table-cell.js +0 -8
- package/components/pds-table-cell.js.map +0 -1
- package/components/pds-table-cell2.js +0 -72
- package/components/pds-table-cell2.js.map +0 -1
- package/components/pds-table-head-cell.d.ts +0 -11
- package/components/pds-table-head-cell.js +0 -8
- package/components/pds-table-head-cell.js.map +0 -1
- package/components/pds-table-head-cell2.js +0 -96
- package/components/pds-table-head-cell2.js.map +0 -1
- package/components/pds-table-head.d.ts +0 -11
- package/components/pds-table-head.js +0 -56
- package/components/pds-table-head.js.map +0 -1
- package/components/pds-table-row.d.ts +0 -11
- package/components/pds-table-row.js +0 -78
- package/components/pds-table-row.js.map +0 -1
- package/components/pds-table.d.ts +0 -11
- package/components/pds-table.js +0 -100
- package/components/pds-table.js.map +0 -1
- package/components/pds-tabpanel.d.ts +0 -11
- package/components/pds-tabpanel.js +0 -45
- package/components/pds-tabpanel.js.map +0 -1
- package/components/pds-tabs.d.ts +0 -11
- package/components/pds-tabs.js +0 -119
- package/components/pds-tabs.js.map +0 -1
- package/components/pds-textarea.d.ts +0 -11
- package/components/pds-textarea.js +0 -82
- package/components/pds-textarea.js.map +0 -1
- package/components/pds-tooltip.d.ts +0 -11
- package/components/pds-tooltip.js +0 -178
- package/components/pds-tooltip.js.map +0 -1
- package/dist/cjs/index-49f8049e.js.map +0 -1
- package/dist/esm/index-64c90183.js +0 -13
- package/dist/esm/index-64c90183.js.map +0 -1
- package/dist/esm-es5/index-64c90183.js +0 -2
- package/dist/esm-es5/index-64c90183.js.map +0 -1
- package/dist/pine-core/p-0afcc785.system.entry.js +0 -2
- package/dist/pine-core/p-0afcc785.system.entry.js.map +0 -1
- package/dist/pine-core/p-1400b1f0.system.entry.js +0 -2
- package/dist/pine-core/p-1400b1f0.system.entry.js.map +0 -1
- package/dist/pine-core/p-18abb120.entry.js +0 -2
- package/dist/pine-core/p-18abb120.entry.js.map +0 -1
- package/dist/pine-core/p-19f02715.system.entry.js +0 -2
- package/dist/pine-core/p-19f02715.system.entry.js.map +0 -1
- package/dist/pine-core/p-1b7c9a32.entry.js +0 -2
- package/dist/pine-core/p-1b7c9a32.entry.js.map +0 -1
- package/dist/pine-core/p-1e334408.system.entry.js +0 -2
- package/dist/pine-core/p-1e334408.system.entry.js.map +0 -1
- package/dist/pine-core/p-2052f3aa.system.entry.js +0 -2
- package/dist/pine-core/p-2052f3aa.system.entry.js.map +0 -1
- package/dist/pine-core/p-237f0b79.entry.js +0 -2
- package/dist/pine-core/p-237f0b79.entry.js.map +0 -1
- package/dist/pine-core/p-25284941.system.entry.js +0 -2
- package/dist/pine-core/p-25284941.system.entry.js.map +0 -1
- package/dist/pine-core/p-26477108.entry.js +0 -2
- package/dist/pine-core/p-26477108.entry.js.map +0 -1
- package/dist/pine-core/p-2a609e04.entry.js +0 -2
- package/dist/pine-core/p-2a609e04.entry.js.map +0 -1
- package/dist/pine-core/p-2c89ac70.system.entry.js +0 -2
- package/dist/pine-core/p-2c89ac70.system.entry.js.map +0 -1
- package/dist/pine-core/p-2fbe7bd7.system.entry.js +0 -2
- package/dist/pine-core/p-2fbe7bd7.system.entry.js.map +0 -1
- package/dist/pine-core/p-35a4815c.system.entry.js +0 -2
- package/dist/pine-core/p-35a4815c.system.entry.js.map +0 -1
- package/dist/pine-core/p-35d540e7.entry.js +0 -2
- package/dist/pine-core/p-35d540e7.entry.js.map +0 -1
- package/dist/pine-core/p-52c4ebbb.system.js +0 -2
- package/dist/pine-core/p-52c4ebbb.system.js.map +0 -1
- package/dist/pine-core/p-57e352da.entry.js +0 -2
- package/dist/pine-core/p-57e352da.entry.js.map +0 -1
- package/dist/pine-core/p-5966e442.entry.js +0 -2
- package/dist/pine-core/p-5966e442.entry.js.map +0 -1
- package/dist/pine-core/p-61ba006d.entry.js +0 -2
- package/dist/pine-core/p-61ba006d.entry.js.map +0 -1
- package/dist/pine-core/p-6a8d8d12.entry.js +0 -2
- package/dist/pine-core/p-6a8d8d12.entry.js.map +0 -1
- package/dist/pine-core/p-6b742f8e.system.entry.js +0 -2
- package/dist/pine-core/p-6b742f8e.system.entry.js.map +0 -1
- package/dist/pine-core/p-70860aa6.entry.js +0 -2
- package/dist/pine-core/p-70860aa6.entry.js.map +0 -1
- package/dist/pine-core/p-7293fa0b.system.entry.js +0 -2
- package/dist/pine-core/p-7293fa0b.system.entry.js.map +0 -1
- package/dist/pine-core/p-72fd05db.system.entry.js +0 -2
- package/dist/pine-core/p-72fd05db.system.entry.js.map +0 -1
- package/dist/pine-core/p-7543ee35.system.entry.js +0 -2
- package/dist/pine-core/p-7543ee35.system.entry.js.map +0 -1
- package/dist/pine-core/p-794322e8.system.entry.js +0 -2
- package/dist/pine-core/p-794322e8.system.entry.js.map +0 -1
- package/dist/pine-core/p-7fc3e294.entry.js +0 -2
- package/dist/pine-core/p-7fc3e294.entry.js.map +0 -1
- package/dist/pine-core/p-8196f142.entry.js +0 -2
- package/dist/pine-core/p-8196f142.entry.js.map +0 -1
- package/dist/pine-core/p-88a72515.js +0 -2
- package/dist/pine-core/p-88a72515.js.map +0 -1
- package/dist/pine-core/p-8b45381c.entry.js +0 -2
- package/dist/pine-core/p-8b45381c.entry.js.map +0 -1
- package/dist/pine-core/p-93859623.entry.js +0 -2
- package/dist/pine-core/p-93859623.entry.js.map +0 -1
- package/dist/pine-core/p-94688fce.system.entry.js +0 -2
- package/dist/pine-core/p-94688fce.system.entry.js.map +0 -1
- package/dist/pine-core/p-95bb614b.system.entry.js +0 -2
- package/dist/pine-core/p-95bb614b.system.entry.js.map +0 -1
- package/dist/pine-core/p-a0733832.entry.js +0 -2
- package/dist/pine-core/p-a0733832.entry.js.map +0 -1
- package/dist/pine-core/p-a6cc48e5.system.entry.js +0 -2
- package/dist/pine-core/p-a6cc48e5.system.entry.js.map +0 -1
- package/dist/pine-core/p-a913d9f3.entry.js +0 -2
- package/dist/pine-core/p-a913d9f3.entry.js.map +0 -1
- package/dist/pine-core/p-afef45f9.system.entry.js +0 -2
- package/dist/pine-core/p-afef45f9.system.entry.js.map +0 -1
- package/dist/pine-core/p-b5582d9f.entry.js +0 -2
- package/dist/pine-core/p-b5582d9f.entry.js.map +0 -1
- package/dist/pine-core/p-c3440b2d.entry.js +0 -2
- package/dist/pine-core/p-c3440b2d.entry.js.map +0 -1
- package/dist/pine-core/p-c3a29f5e.system.entry.js +0 -2
- package/dist/pine-core/p-c3a29f5e.system.entry.js.map +0 -1
- package/dist/pine-core/p-d074b0db.system.entry.js +0 -2
- package/dist/pine-core/p-d074b0db.system.entry.js.map +0 -1
- package/dist/pine-core/p-d479e9d1.entry.js +0 -2
- package/dist/pine-core/p-d479e9d1.entry.js.map +0 -1
- package/dist/pine-core/p-d53f0284.system.entry.js +0 -2
- package/dist/pine-core/p-d53f0284.system.entry.js.map +0 -1
- package/dist/pine-core/p-d54e620f.system.entry.js +0 -2
- package/dist/pine-core/p-d54e620f.system.entry.js.map +0 -1
- package/dist/pine-core/p-d5628be9.entry.js +0 -2
- package/dist/pine-core/p-d5628be9.entry.js.map +0 -1
- package/dist/pine-core/p-de8abfde.system.entry.js +0 -2
- package/dist/pine-core/p-df08eb9e.entry.js +0 -2
- package/dist/pine-core/p-df08eb9e.entry.js.map +0 -1
- package/dist/pine-core/p-e200c428.entry.js +0 -2
- package/dist/pine-core/p-e200c428.entry.js.map +0 -1
- package/dist/pine-core/p-ea2edef4.entry.js +0 -2
- package/dist/pine-core/p-ea2edef4.entry.js.map +0 -1
- package/dist/pine-core/p-f8c53e6f.system.entry.js +0 -2
- package/dist/pine-core/p-f8c53e6f.system.entry.js.map +0 -1
- package/hydrate/index.d.ts +0 -218
- package/hydrate/index.js +0 -13124
- package/hydrate/package.json +0 -6
package/components/pds-switch.js
DELETED
|
@@ -1,82 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
|
|
2
|
-
import { a as assignDescription, P as PdsLabel, m as messageId } from './pds-label.js';
|
|
3
|
-
|
|
4
|
-
const pdsSwitchCss = ":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);--box-shadow-focus:0 0 0 2px var(--outline-color-focus);--box-shadow-focus-error:0 0 0 2px var(--outline-color-focus-error);--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:var(--box-shadow-focus-error);box-shadow:var(--box-shadow-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:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}input:checked::after{-webkit-transform:translate3d(0, -50%, 0);transform:translate3d(0, -50%, 0)}input:checked:not(:disabled){background-color:currentColor;color:var(--background-color-checked)}input:checked:not(:disabled):hover{border-color:currentColor;color:var(--background-color-checked-hover)}";
|
|
5
|
-
const PdsSwitchStyle0 = pdsSwitchCss;
|
|
6
|
-
|
|
7
|
-
const PdsSwitch$1 = /*@__PURE__*/ proxyCustomElement(class PdsSwitch extends HTMLElement {
|
|
8
|
-
constructor() {
|
|
9
|
-
super();
|
|
10
|
-
this.__registerHost();
|
|
11
|
-
this.__attachShadow();
|
|
12
|
-
this.pdsSwitchChange = createEvent(this, "pdsSwitchChange", 7);
|
|
13
|
-
this.onSwitchUpdate = (e) => {
|
|
14
|
-
if (this.disabled)
|
|
15
|
-
return;
|
|
16
|
-
this.pdsSwitchChange.emit(e);
|
|
17
|
-
};
|
|
18
|
-
/**
|
|
19
|
-
* Generate switch classes
|
|
20
|
-
*/
|
|
21
|
-
this.switchClassNames = () => {
|
|
22
|
-
let switchClasses = `pds-switch`;
|
|
23
|
-
if (this.invalid === true) {
|
|
24
|
-
switchClasses += " pds-switch--error";
|
|
25
|
-
}
|
|
26
|
-
if (this.helperMessage !== undefined) {
|
|
27
|
-
switchClasses += " pds-switch--message";
|
|
28
|
-
}
|
|
29
|
-
return switchClasses;
|
|
30
|
-
};
|
|
31
|
-
this.componentId = undefined;
|
|
32
|
-
this.checked = false;
|
|
33
|
-
this.disabled = false;
|
|
34
|
-
this.errorMessage = undefined;
|
|
35
|
-
this.helperMessage = undefined;
|
|
36
|
-
this.invalid = false;
|
|
37
|
-
this.label = undefined;
|
|
38
|
-
this.name = undefined;
|
|
39
|
-
this.required = false;
|
|
40
|
-
this.type = 'checkbox';
|
|
41
|
-
this.value = undefined;
|
|
42
|
-
}
|
|
43
|
-
render() {
|
|
44
|
-
return (h(Host, { key: 'f00007b5d1bde6895cb7f410b82e5c3669d75327', class: this.switchClassNames(), "aria-disabled": this.disabled ? 'true' : null }, h("input", { key: 'c6c0ae9576a198c9f0038ebd22b78df0c5a41794', "aria-describedby": assignDescription(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 }), h(PdsLabel, { key: 'd6c3b0c584d2c4fd6cc99507794a3e961fbf99a5', classNames: "pds-switch__label", htmlFor: this.componentId, text: this.label }), this.helperMessage &&
|
|
45
|
-
h("div", { key: '4f9f581e9a01e67d076bafaf1d28fe52b87081fc', class: `pds-switch__message`, id: messageId(this.componentId, 'helper') }, this.helperMessage), this.errorMessage &&
|
|
46
|
-
h("div", { key: 'aeca71b92664b2e7ef4c7fb0d103996a05c5318f', class: `pds-switch__message pds-switch__message--error`, id: messageId(this.componentId, 'error'), "aria-live": "assertive" }, this.errorMessage)));
|
|
47
|
-
}
|
|
48
|
-
get el() { return this; }
|
|
49
|
-
static get style() { return PdsSwitchStyle0; }
|
|
50
|
-
}, [1, "pds-switch", {
|
|
51
|
-
"componentId": [1, "component-id"],
|
|
52
|
-
"checked": [4],
|
|
53
|
-
"disabled": [4],
|
|
54
|
-
"errorMessage": [1, "error-message"],
|
|
55
|
-
"helperMessage": [1, "helper-message"],
|
|
56
|
-
"invalid": [4],
|
|
57
|
-
"label": [1],
|
|
58
|
-
"name": [1],
|
|
59
|
-
"required": [4],
|
|
60
|
-
"type": [1],
|
|
61
|
-
"value": [1]
|
|
62
|
-
}]);
|
|
63
|
-
function defineCustomElement$1() {
|
|
64
|
-
if (typeof customElements === "undefined") {
|
|
65
|
-
return;
|
|
66
|
-
}
|
|
67
|
-
const components = ["pds-switch"];
|
|
68
|
-
components.forEach(tagName => { switch (tagName) {
|
|
69
|
-
case "pds-switch":
|
|
70
|
-
if (!customElements.get(tagName)) {
|
|
71
|
-
customElements.define(tagName, PdsSwitch$1);
|
|
72
|
-
}
|
|
73
|
-
break;
|
|
74
|
-
} });
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
const PdsSwitch = PdsSwitch$1;
|
|
78
|
-
const defineCustomElement = defineCustomElement$1;
|
|
79
|
-
|
|
80
|
-
export { PdsSwitch, defineCustomElement };
|
|
81
|
-
|
|
82
|
-
//# sourceMappingURL=pds-switch.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"pds-switch.js","mappings":";;;AAAA,MAAM,YAAY,GAAG,s+IAAs+I,CAAC;AAC5/I,wBAAe,YAAY;;MCQdA,WAAS;;;;;;QAgEZ,mBAAc,GAAG,CAAC,CAAQ;YAChC,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;YAC1B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,CAAe,CAAC,CAAC;SAC5C,CAAC;;;;QAKM,qBAAgB,GAAG;YACzB,IAAI,aAAa,GAAG,YAAY,CAAC;YAEjC,IAAI,IAAI,CAAC,OAAO,KAAK,IAAI,EAAE;gBACzB,aAAa,IAAI,oBAAoB,CAAC;aACvC;YACD,IAAI,IAAI,CAAC,aAAa,KAAK,SAAS,EAAE;gBACpC,aAAa,IAAI,sBAAsB,CAAC;aACzC;YACD,OAAO,aAAa,CAAC;SACtB,CAAC;;uBAvEgB,KAAK;wBAKH,KAAK;;;uBAeN,KAAK;;;wBAeJ,KAAK;oBAMY,UAAU;;;IAgC/C,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE,mBAAiB,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,IAAI,IAChF,kFACoB,iBAAiB,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,kBACzE,IAAI,CAAC,OAAO,GAAG,MAAM,GAAG,SAAS,EAC/C,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAC,mBAAmB,EACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,EAAE,EAAE,IAAI,CAAC,WAAW,EACpB,IAAI,EAAE,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,WAAW,EAC9C,QAAQ,EAAE,IAAI,CAAC,cAAc,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,GACjB,EACF,EAAC,QAAQ,qDAAC,UAAU,EAAC,mBAAmB,EAAC,OAAO,EAAE,IAAI,CAAC,WAAW,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,GAAI,EACvF,IAAI,CAAC,aAAa;YACjB,4DACE,KAAK,EAAE,qBAAqB,EAC5B,EAAE,EAAE,SAAS,CAAC,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,IAExC,IAAI,CAAC,aAAa,CACf,EAEP,IAAI,CAAC,YAAY;YAChB,4DACE,KAAK,EAAE,gDAAgD,EACvD,EAAE,EAAE,SAAS,CAAC,IAAI,CAAC,WAAW,EAAE,OAAO,CAAC,eAC9B,WAAW,IAEpB,IAAI,CAAC,YAAY,CACd,CAEH,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["PdsSwitch"],"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 --box-shadow-focus: 0 0 0 2px var(--outline-color-focus);\n --box-shadow-focus-error: 0 0 0 2px var(--outline-color-focus-error);\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: var(--box-shadow-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: var(--box-shadow-focus);\n outline: none;\n}\n\n// 'Checked' state\n// switch toggle\ninput:checked::after {\n transform: translate3d(0, -50%, 0);\n}\n\n// switch container\ninput:checked:not(:disabled) {\n background-color: currentColor;\n color: var(--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"],"version":3}
|
package/components/pds-tab.d.ts
DELETED
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type { Components, JSX } from "../dist/types/components";
|
|
2
|
-
|
|
3
|
-
interface PdsTab extends Components.PdsTab, HTMLElement {}
|
|
4
|
-
export const PdsTab: {
|
|
5
|
-
prototype: PdsTab;
|
|
6
|
-
new (): PdsTab;
|
|
7
|
-
};
|
|
8
|
-
/**
|
|
9
|
-
* Used to define this component and all nested components recursively.
|
|
10
|
-
*/
|
|
11
|
-
export const defineCustomElement: () => void;
|
package/components/pds-tab.js
DELETED
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
|
|
2
|
-
|
|
3
|
-
const pdsTabCss = "pds-tab{--background-color-tab:var(--pine-color-neutral-grey-300);--background-color-tab-active:var(--pine-color-neutral-charcoal-400);--background-color-tab-hover:var(--pine-color-neutral-grey-400);--border-radius:var(--pine-border-radius-md);--box-shadow-focus:0 0 0 2px var(--pine-color-primary-200);--color:var(--pine-color-neutral-charcoal-200);--color-active:var(--pine-color-neutral-charcoal-400);--color-focus:var(--pine-color-neutral-charcoal-300);--color-white:var(--pine-color-base-white);--font-size-body: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);--line-height-md:var(--pine-line-height-md);--line-height-sm:var(--pine-line-height-sm);--line-height-xs:var(--pine-line-height-xs);--outline:4px solid var(--pine-color-primary-200);display:inline-block;position:relative}.pds-tab{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:0;-webkit-box-shadow:none;box-shadow:none;color:inherit;cursor:pointer;font-family:inherit;padding:0;-ms-flex-align:center;align-items:center;color:var(--color);display:-ms-inline-flexbox;display:inline-flex;position:relative;text-decoration:none;white-space:nowrap}.pds-tab.is-active,.pds-tab[aria-selected=true]{color:var(--color-active)}.pds-tab.is-active .pds-tab__content::after,.pds-tab[aria-selected=true] .pds-tab__content::after{opacity:1}.pds-tab:hover{color:var(--color-active)}.pds-tab:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-tab .pds-tab__content{font-family:inherit;font-size:var(--font-size-body);font-weight:var(--font-weight);line-height:var(--line-height-md);-webkit-padding-after:11px;padding-block-end:11px;position:relative}.pds-tab .pds-tab__content::after{background-color:currentColor;bottom:0;content:\"\";height:3px;left:0;opacity:0;position:absolute;right:0}.pds-tab .pds-tab-edge{display:none}.pds-tabs--availability{--tab-background-color:transparent}.pds-tabs--availability .pds-tab{background-color:var(--tab-background-color);border-radius:8px 8px 0 0;padding:8px 16px 13px}.pds-tabs--availability .pds-tab.is-active,.pds-tabs--availability .pds-tab[aria-selected=true]{--tab-background-color:var(--color-white)}.pds-tabs--availability .pds-tab.is-active .pds-tab__content::after,.pds-tabs--availability .pds-tab[aria-selected=true] .pds-tab__content::after{opacity:1}.pds-tabs--availability .pds-tab.is-active .pds-tab-edge,.pds-tabs--availability .pds-tab[aria-selected=true] .pds-tab-edge{z-index:1}.pds-tabs--availability .pds-tab:hover:not(.is-active,[aria-selected=true]){--tab-background-color:var(--background-color-tab)}.pds-tabs--availability .pds-tab:focus-visible{color:var(--color)}.pds-tabs--availability .pds-tab__content{font-size:var(--font-size-xs);line-height:var(--line-height-xs);padding-bottom:7px}.pds-tabs--availability .pds-tab-edge{bottom:0;display:block;height:8px;inset-inline-end:100%;overflow:hidden;position:absolute;width:8px}.pds-tabs--availability .pds-tab-edge::before{border-radius:50%;bottom:0;-webkit-box-shadow:4px 4px 0 0 var(--tab-background-color);box-shadow:4px 4px 0 0 var(--tab-background-color);content:\"\";display:block;height:200%;inset-inline-end:0;position:absolute;width:200%}.pds-tabs--availability .pds-tab-edge--end{inset-inline-end:unset;inset-inline-start:100%}.pds-tabs--availability .pds-tab-edge--end::before{-webkit-box-shadow:-4px 4px 0 0 var(--tab-background-color);box-shadow:-4px 4px 0 0 var(--tab-background-color);inset-inline-end:unset;inset-inline-start:0}.pds-tabs--filter{--tab-background-color:var(--background-color-tab)}.pds-tabs--filter .pds-tab{background-color:var(--tab-background-color);border-radius:50px;color:var(--color-active);padding:6px 15px}.pds-tabs--filter .pds-tab.is-active,.pds-tabs--filter .pds-tab[aria-selected=true]{--tab-background-color:var(--background-color-tab-active);color:var(--color-white)}.pds-tabs--filter .pds-tab:hover:not(.is-active,[aria-selected=true]){--tab-background-color:var(--background-color-tab-hover)}.pds-tabs--filter .pds-tab__content{font-size:var(--font-size-sm);line-height:var(--line-height-sm);-webkit-padding-after:0;padding-block-end:0}.pds-tabs--filter .pds-tab__content::after{content:unset}";
|
|
4
|
-
const PdsTabStyle0 = pdsTabCss;
|
|
5
|
-
|
|
6
|
-
const PdsTab$1 = /*@__PURE__*/ proxyCustomElement(class PdsTab extends HTMLElement {
|
|
7
|
-
constructor() {
|
|
8
|
-
super();
|
|
9
|
-
this.__registerHost();
|
|
10
|
-
this.pdsTabClick = createEvent(this, "pdsTabClick", 7);
|
|
11
|
-
this.name = undefined;
|
|
12
|
-
this.parentComponentId = undefined;
|
|
13
|
-
this.variant = undefined;
|
|
14
|
-
this.index = undefined;
|
|
15
|
-
this.selected = false;
|
|
16
|
-
}
|
|
17
|
-
onTabClick(index, parentComponentId) {
|
|
18
|
-
this.pdsTabClick.emit([index, parentComponentId]);
|
|
19
|
-
}
|
|
20
|
-
render() {
|
|
21
|
-
const availabilityTabEdgeInlineStart = (h("span", { key: 'c315c8920c12da7d1913db7e53dc075dc9734280', class: "pds-tab-edge", role: "presentation" }));
|
|
22
|
-
const availabilityTabEdgeInlineEnd = (h("span", { key: '37dfaa651e87a0291d28c50fbdda9c1cfa70f41b', class: "pds-tab-edge pds-tab-edge--end", role: "presentation" }));
|
|
23
|
-
return (h(Host, { key: '0aa73a4a6b1ff12fff6f212135f8f33c14e6ff5f', variant: this.variant, slot: "tabs", index: this.index }, h("button", { key: '72443536e14ddad4ac8e19c025165884de81697f', role: "tab", id: this.parentComponentId + "__" + this.name, "aria-controls": this.parentComponentId + "__" + this.name + "-panel", tabindex: this.selected ? "0" : "-1", "aria-selected": this.selected ? "true" : "false", class: this.selected ? "pds-tab is-active" : "pds-tab", onClick: this.onTabClick.bind(this, this.index, this.parentComponentId) }, this.variant === "availability" && availabilityTabEdgeInlineStart, this.variant === "availability" && availabilityTabEdgeInlineEnd, h("div", { key: '547a022cb0354b176a11e681e9103bb4486ab1ef', class: "pds-tab__content" }, h("slot", { key: 'db859b0d21de4e57a75e588d069a9b1b86d271c4' })))));
|
|
24
|
-
}
|
|
25
|
-
get el() { return this; }
|
|
26
|
-
static get style() { return PdsTabStyle0; }
|
|
27
|
-
}, [4, "pds-tab", {
|
|
28
|
-
"name": [1],
|
|
29
|
-
"parentComponentId": [1, "parent-component-id"],
|
|
30
|
-
"variant": [1],
|
|
31
|
-
"index": [2],
|
|
32
|
-
"selected": [4]
|
|
33
|
-
}]);
|
|
34
|
-
function defineCustomElement$1() {
|
|
35
|
-
if (typeof customElements === "undefined") {
|
|
36
|
-
return;
|
|
37
|
-
}
|
|
38
|
-
const components = ["pds-tab"];
|
|
39
|
-
components.forEach(tagName => { switch (tagName) {
|
|
40
|
-
case "pds-tab":
|
|
41
|
-
if (!customElements.get(tagName)) {
|
|
42
|
-
customElements.define(tagName, PdsTab$1);
|
|
43
|
-
}
|
|
44
|
-
break;
|
|
45
|
-
} });
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
const PdsTab = PdsTab$1;
|
|
49
|
-
const defineCustomElement = defineCustomElement$1;
|
|
50
|
-
|
|
51
|
-
export { PdsTab, defineCustomElement };
|
|
52
|
-
|
|
53
|
-
//# sourceMappingURL=pds-tab.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"pds-tab.js","mappings":";;AAAA,MAAM,SAAS,GAAG,6uIAA6uI,CAAC;AAChwI,qBAAe,SAAS;;MCMXA,QAAM;;;;;;;;;wBA8BE,KAAK;;IAOhB,UAAU,CAAC,KAAK,EAAE,iBAAiB;QACzC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC;KACnD;IAED,MAAM;QACJ,MAAM,8BAA8B,IAClC,6DAAM,KAAK,EAAC,cAAc,EAAC,IAAI,EAAC,cAAc,GAAQ,CACvD,CAAA;QAED,MAAM,4BAA4B,IAChC,6DAAM,KAAK,EAAC,gCAAgC,EAAC,IAAI,EAAC,cAAc,GAAQ,CACzE,CAAA;QAED,QACE,EAAC,IAAI,qDAAC,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,IACxD,+DACE,IAAI,EAAC,KAAK,EACV,EAAE,EAAE,IAAI,CAAC,iBAAiB,GAAG,IAAI,GAAG,IAAI,CAAC,IAAI,mBAC9B,IAAI,CAAC,iBAAiB,GAAG,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,QAAQ,EACnE,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,GAAG,GAAG,IAAI,mBACrB,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,OAAO,EAC/C,KAAK,EAAE,IAAI,CAAC,QAAQ,GAAG,mBAAmB,GAAG,SAAS,EACtD,OAAO,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAEtE,IAAI,CAAC,OAAO,KAAK,cAAc,IAAI,8BAA8B,EACjE,IAAI,CAAC,OAAO,KAAK,cAAc,IAAI,4BAA4B,EAChE,4DAAK,KAAK,EAAC,kBAAkB,IAAC,8DAAO,CAAM,CACpC,CACJ,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["PdsTab"],"sources":["src/components/pds-tabs/pds-tab/pds-tab.scss?tag=pds-tab","src/components/pds-tabs/pds-tab/pds-tab.tsx"],"sourcesContent":["pds-tab {\n --background-color-tab: var(--pine-color-neutral-grey-300);\n --background-color-tab-active: var(--pine-color-neutral-charcoal-400);\n --background-color-tab-hover: var(--pine-color-neutral-grey-400);\n --border-radius: var(--pine-border-radius-md);\n --box-shadow-focus: 0 0 0 2px var(--pine-color-primary-200);\n\n --color: var(--pine-color-neutral-charcoal-200);\n --color-active: var(--pine-color-neutral-charcoal-400);\n --color-focus: var(--pine-color-neutral-charcoal-300);\n --color-white: var(--pine-color-base-white);\n\n --font-size-body: 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 --line-height-md: var(--pine-line-height-md);\n --line-height-sm: var(--pine-line-height-sm);\n --line-height-xs: var(--pine-line-height-xs);\n\n --outline: 4px solid var(--pine-color-primary-200);\n\n display: inline-block;\n position: relative;\n}\n\n///\n/// Resets base button styles\n///\n@mixin pds-button-style-reset {\n appearance: none;\n background-color: transparent;\n border: 0;\n box-shadow: none;\n color: inherit;\n cursor: pointer;\n font-family: inherit;\n padding: 0;\n}\n\n.pds-tab {\n @include pds-button-style-reset();\n\n align-items: center;\n color: var(--color);\n display: inline-flex;\n position: relative;\n text-decoration: none;\n white-space: nowrap;\n\n &.is-active,\n &[aria-selected='true'] {\n color: var(--color-active);\n\n .pds-tab__content::after {\n opacity: 1;\n }\n }\n\n &:hover {\n color: var(--color-active);\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-tab__content {\n font-family: inherit;\n font-size: var(--font-size-body);\n font-weight: var(--font-weight);\n line-height: var(--line-height-md);\n padding-block-end: 11px;\n position: relative;\n\n &::after {\n background-color: currentColor;\n bottom: 0;\n content: '';\n height: 3px;\n left: 0;\n opacity: 0;\n position: absolute;\n right: 0;\n }\n }\n\n .pds-tab-edge {\n display: none;\n }\n}\n\n.pds-tabs--availability {\n --tab-background-color: transparent;\n\n .pds-tab {\n background-color: var(--tab-background-color);\n border-radius: 8px 8px 0 0;\n padding: 8px 16px 13px;\n\n &.is-active,\n &[aria-selected='true'] {\n --tab-background-color: var(--color-white);\n\n .pds-tab__content::after {\n opacity: 1;\n }\n\n .pds-tab-edge {\n z-index: 1;\n }\n }\n\n &:hover:not(.is-active, [aria-selected='true']) {\n --tab-background-color: var(--background-color-tab);\n }\n\n &:focus-visible {\n color: var(--color);\n }\n }\n\n .pds-tab__content {\n font-size: var(--font-size-xs);\n line-height: var(--line-height-xs);\n padding-bottom: 7px;\n }\n\n .pds-tab-edge {\n bottom: 0;\n display: block;\n height: 8px;\n inset-inline-end: 100%;\n overflow: hidden;\n position: absolute;\n width: 8px;\n\n &::before {\n border-radius: 50%;\n bottom: 0;\n box-shadow: 4px 4px 0 0 var(--tab-background-color);\n content: '';\n display: block;\n height: 200%;\n inset-inline-end: 0;\n position: absolute;\n width: 200%;\n }\n }\n\n .pds-tab-edge--end {\n inset-inline-end: unset;\n inset-inline-start: 100%;\n\n &::before {\n box-shadow: -4px 4px 0 0 var(--tab-background-color);\n inset-inline-end: unset;\n inset-inline-start: 0;\n }\n }\n}\n\n.pds-tabs--filter {\n --tab-background-color: var(--background-color-tab);\n\n .pds-tab {\n background-color: var(--tab-background-color);\n border-radius: 50px;\n color: var(--color-active);\n padding: 6px 15px;\n\n &.is-active,\n &[aria-selected='true'] {\n --tab-background-color: var(--background-color-tab-active);\n color: var(--color-white)\n }\n\n &:hover:not(.is-active, [aria-selected='true']) {\n --tab-background-color: var(--background-color-tab-hover);\n }\n }\n\n .pds-tab__content {\n font-size: var(--font-size-sm);\n line-height: var(--line-height-sm);\n padding-block-end: 0;\n\n &::after {\n content: unset;\n }\n }\n}\n","import { Component, Element, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'pds-tab',\n styleUrl: 'pds-tab.scss',\n shadow: false,\n})\nexport class PdsTab {\n @Element() el: HTMLPdsTabElement;\n\n /**\n * Sets the related tab name, this name must match a `pds-tabpanel`'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 if the tab index number, this property is passed by parent component\n */\n /** @internal */\n @Prop() index: number;\n\n /**\n * Keeps track of the tabpanel selected state, this property is passed by parent component\n */\n /** @internal */\n @Prop() selected = false;\n\n /**\n * Emits an event upon tab click for `pds-tab` and `pds-tabpanel` to listen for\n */\n /** @internal */\n @Event() pdsTabClick: EventEmitter<object>;\n private onTabClick(index, parentComponentId) {\n this.pdsTabClick.emit([index, parentComponentId]);\n }\n\n render() {\n const availabilityTabEdgeInlineStart = (\n <span class=\"pds-tab-edge\" role=\"presentation\"></span>\n )\n\n const availabilityTabEdgeInlineEnd = (\n <span class=\"pds-tab-edge pds-tab-edge--end\" role=\"presentation\"></span>\n )\n\n return (\n <Host variant={this.variant} slot=\"tabs\" index={this.index}>\n <button\n role=\"tab\"\n id={this.parentComponentId + \"__\" + this.name}\n aria-controls={this.parentComponentId + \"__\" + this.name + \"-panel\"}\n tabindex={this.selected ? \"0\" : \"-1\"}\n aria-selected={this.selected ? \"true\" : \"false\"}\n class={this.selected ? \"pds-tab is-active\" : \"pds-tab\"}\n onClick={this.onTabClick.bind(this, this.index, this.parentComponentId)}\n >\n {this.variant === \"availability\" && availabilityTabEdgeInlineStart}\n {this.variant === \"availability\" && availabilityTabEdgeInlineEnd}\n <div class=\"pds-tab__content\"><slot/></div>\n </button>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type { Components, JSX } from "../dist/types/components";
|
|
2
|
-
|
|
3
|
-
interface PdsTableBody extends Components.PdsTableBody, HTMLElement {}
|
|
4
|
-
export const PdsTableBody: {
|
|
5
|
-
prototype: PdsTableBody;
|
|
6
|
-
new (): PdsTableBody;
|
|
7
|
-
};
|
|
8
|
-
/**
|
|
9
|
-
* Used to define this component and all nested components recursively.
|
|
10
|
-
*/
|
|
11
|
-
export const defineCustomElement: () => void;
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
|
-
|
|
3
|
-
const pdsTableBodyCss = ":host{border-color:inherit;display:table-row-group;vertical-align:middle}";
|
|
4
|
-
const PdsTableBodyStyle0 = pdsTableBodyCss;
|
|
5
|
-
|
|
6
|
-
const PdsTableBody$1 = /*@__PURE__*/ proxyCustomElement(class PdsTableBody extends HTMLElement {
|
|
7
|
-
constructor() {
|
|
8
|
-
super();
|
|
9
|
-
this.__registerHost();
|
|
10
|
-
this.__attachShadow();
|
|
11
|
-
}
|
|
12
|
-
render() {
|
|
13
|
-
return (h(Host, { key: '6d312a1c25591258df1f47699b2b7a3b74d85fe3', role: "rowgroup" }, h("slot", { key: '423f7e680e9eff6daf2d4a08544b619f2c420beb' })));
|
|
14
|
-
}
|
|
15
|
-
static get style() { return PdsTableBodyStyle0; }
|
|
16
|
-
}, [1, "pds-table-body"]);
|
|
17
|
-
function defineCustomElement$1() {
|
|
18
|
-
if (typeof customElements === "undefined") {
|
|
19
|
-
return;
|
|
20
|
-
}
|
|
21
|
-
const components = ["pds-table-body"];
|
|
22
|
-
components.forEach(tagName => { switch (tagName) {
|
|
23
|
-
case "pds-table-body":
|
|
24
|
-
if (!customElements.get(tagName)) {
|
|
25
|
-
customElements.define(tagName, PdsTableBody$1);
|
|
26
|
-
}
|
|
27
|
-
break;
|
|
28
|
-
} });
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
const PdsTableBody = PdsTableBody$1;
|
|
32
|
-
const defineCustomElement = defineCustomElement$1;
|
|
33
|
-
|
|
34
|
-
export { PdsTableBody, defineCustomElement };
|
|
35
|
-
|
|
36
|
-
//# sourceMappingURL=pds-table-body.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"pds-table-body.js","mappings":";;AAAA,MAAM,eAAe,GAAG,2EAA2E,CAAC;AACpG,2BAAe,eAAe;;MCMjBA,cAAY;;;;;;IAEvB,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,IAAI,EAAC,UAAU,IACnB,8DAAa,CACR,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;","names":["PdsTableBody"],"sources":["src/components/pds-table/pds-table-body/pds-table-body.scss?tag=pds-table-body&encapsulation=shadow","src/components/pds-table/pds-table-body/pds-table-body.tsx"],"sourcesContent":[":host {\n border-color: inherit;\n display: table-row-group;\n vertical-align: middle;\n}\n","import { Component, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'pds-table-body',\n styleUrl: 'pds-table-body.scss',\n shadow: true,\n})\nexport class PdsTableBody {\n\n render() {\n return (\n <Host role=\"rowgroup\">\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type { Components, JSX } from "../dist/types/components";
|
|
2
|
-
|
|
3
|
-
interface PdsTableCell extends Components.PdsTableCell, HTMLElement {}
|
|
4
|
-
export const PdsTableCell: {
|
|
5
|
-
prototype: PdsTableCell;
|
|
6
|
-
new (): PdsTableCell;
|
|
7
|
-
};
|
|
8
|
-
/**
|
|
9
|
-
* Used to define this component and all nested components recursively.
|
|
10
|
-
*/
|
|
11
|
-
export const defineCustomElement: () => void;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { P as PdsTableCell$1, d as defineCustomElement$1 } from './pds-table-cell2.js';
|
|
2
|
-
|
|
3
|
-
const PdsTableCell = PdsTableCell$1;
|
|
4
|
-
const defineCustomElement = defineCustomElement$1;
|
|
5
|
-
|
|
6
|
-
export { PdsTableCell, defineCustomElement };
|
|
7
|
-
|
|
8
|
-
//# sourceMappingURL=pds-table-cell.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"pds-table-cell.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
|
|
@@ -1,72 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
|
-
|
|
3
|
-
const pdsTableCellCss = ":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}";
|
|
4
|
-
const PdsTableCellStyle0 = pdsTableCellCss;
|
|
5
|
-
|
|
6
|
-
const PdsTableCell = /*@__PURE__*/ proxyCustomElement(class PdsTableCell extends HTMLElement {
|
|
7
|
-
constructor() {
|
|
8
|
-
super();
|
|
9
|
-
this.__registerHost();
|
|
10
|
-
this.__attachShadow();
|
|
11
|
-
this.handleScroll = () => {
|
|
12
|
-
if (this.tableRef.scrollLeft > 0) {
|
|
13
|
-
this.tableScrolling = true;
|
|
14
|
-
}
|
|
15
|
-
else {
|
|
16
|
-
this.tableScrolling = false;
|
|
17
|
-
}
|
|
18
|
-
};
|
|
19
|
-
this.truncate = undefined;
|
|
20
|
-
this.tableScrolling = false;
|
|
21
|
-
}
|
|
22
|
-
componentWillRender() {
|
|
23
|
-
this.tableRef = this.hostElement.closest('pds-table');
|
|
24
|
-
}
|
|
25
|
-
componentDidLoad() {
|
|
26
|
-
if (this.tableRef && this.tableRef.responsive && this.tableRef.fixedColumn) {
|
|
27
|
-
this.tableRef.addEventListener('scroll', this.handleScroll);
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
classNames() {
|
|
31
|
-
const classNames = [];
|
|
32
|
-
if (this.tableRef && this.tableRef.compact) {
|
|
33
|
-
classNames.push('is-compact');
|
|
34
|
-
}
|
|
35
|
-
if (this.truncate) {
|
|
36
|
-
classNames.push('is-truncated');
|
|
37
|
-
}
|
|
38
|
-
if (this.tableRef && this.tableRef.fixedColumn && this.tableScrolling) {
|
|
39
|
-
classNames.push('has-scrolled');
|
|
40
|
-
}
|
|
41
|
-
return classNames.join(' ');
|
|
42
|
-
}
|
|
43
|
-
render() {
|
|
44
|
-
return (h(Host, { key: '7c7f228b3911eec633c6ffd817f22fbc6666be8a', class: this.classNames(), role: "gridcell", style: this.tableRef &&
|
|
45
|
-
this.tableRef.fixedColumn &&
|
|
46
|
-
this.tableRef.selectable
|
|
47
|
-
? { '--fixed-cell-position': '40px' }
|
|
48
|
-
: {} }, h("slot", { key: '37c43f300478beffc41d2450bbb5a6e13099f58e' })));
|
|
49
|
-
}
|
|
50
|
-
get hostElement() { return this; }
|
|
51
|
-
static get style() { return PdsTableCellStyle0; }
|
|
52
|
-
}, [1, "pds-table-cell", {
|
|
53
|
-
"truncate": [4],
|
|
54
|
-
"tableScrolling": [32]
|
|
55
|
-
}]);
|
|
56
|
-
function defineCustomElement() {
|
|
57
|
-
if (typeof customElements === "undefined") {
|
|
58
|
-
return;
|
|
59
|
-
}
|
|
60
|
-
const components = ["pds-table-cell"];
|
|
61
|
-
components.forEach(tagName => { switch (tagName) {
|
|
62
|
-
case "pds-table-cell":
|
|
63
|
-
if (!customElements.get(tagName)) {
|
|
64
|
-
customElements.define(tagName, PdsTableCell);
|
|
65
|
-
}
|
|
66
|
-
break;
|
|
67
|
-
} });
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
export { PdsTableCell as P, defineCustomElement as d };
|
|
71
|
-
|
|
72
|
-
//# sourceMappingURL=pds-table-cell2.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"pds-table-cell2.js","mappings":";;AAAA,MAAM,eAAe,GAAG,i+BAAi+B,CAAC;AAC1/B,2BAAe,eAAe;;MCMjB,YAAY;;;;;QAuCf,iBAAY,GAAG;YACrB,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,GAAG,CAAC,EAAE;gBAChC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;aAC5B;iBAAM;gBACL,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;aAC7B;SACF,CAAC;;8BA1ByC,KAAK;;IAfhD,mBAAmB;QACjB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,WAAW,CAAwB,CAAC;KAC9E;IAED,gBAAgB;QACd,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,IAAI,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE;YAC1E,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;SAC7D;KACF;IASO,UAAU;QAChB,MAAM,UAAU,GAAG,EAAE,CAAC;QAEtB,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE;YAC1C,UAAU,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;SAC/B;QAED,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,UAAU,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;SACjC;QAED,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,WAAW,IAAI,IAAI,CAAC,cAAc,EAAE;YACrE,UAAU,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;SACjC;QAED,OAAO,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;KAC7B;IAUD,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EACxB,IAAI,EAAC,UAAU,EACf,KAAK,EACH,IAAI,CAAC,QAAQ;gBACb,IAAI,CAAC,QAAQ,CAAC,WAAW;gBACzB,IAAI,CAAC,QAAQ,CAAC,UAAU;kBACpB,EAAE,uBAAuB,EAAE,MAAM,EAAE;kBACnC,EAAE,IAGR,8DAAa,CACR,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["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-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"],"version":3}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type { Components, JSX } from "../dist/types/components";
|
|
2
|
-
|
|
3
|
-
interface PdsTableHeadCell extends Components.PdsTableHeadCell, HTMLElement {}
|
|
4
|
-
export const PdsTableHeadCell: {
|
|
5
|
-
prototype: PdsTableHeadCell;
|
|
6
|
-
new (): PdsTableHeadCell;
|
|
7
|
-
};
|
|
8
|
-
/**
|
|
9
|
-
* Used to define this component and all nested components recursively.
|
|
10
|
-
*/
|
|
11
|
-
export const defineCustomElement: () => void;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { P as PdsTableHeadCell$1, d as defineCustomElement$1 } from './pds-table-head-cell2.js';
|
|
2
|
-
|
|
3
|
-
const PdsTableHeadCell = PdsTableHeadCell$1;
|
|
4
|
-
const defineCustomElement = defineCustomElement$1;
|
|
5
|
-
|
|
6
|
-
export { PdsTableHeadCell, defineCustomElement };
|
|
7
|
-
|
|
8
|
-
//# sourceMappingURL=pds-table-head-cell.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"pds-table-head-cell.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
|
|
@@ -1,96 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
|
|
2
|
-
import { e as upSmall, d as downSmall } from './index2.js';
|
|
3
|
-
import { d as defineCustomElement$1 } from './pds-icon2.js';
|
|
4
|
-
|
|
5
|
-
const pdsTableHeadCellCss = ":host{--background-fixed:var(--pine-color-base-white);--border:var(--pine-border-default);--box-shadow:3px 3px 6px -2px rgba(0, 0, 0, 0.1);--color-sorting:var(--pine-color-neutral-charcoal-500);--color:var(--pine-color-neutral-charcoal-200);--fixed-cell-position:0;--font-size:var(--pine-font-size-body-sm);--font-weight:var(--pine-font-weight-medium);--line-height:var(--pine-line-height-sm);--margin-arrow:var(--pine-spacing-xxs);--padding-arrow:calc(var(--pine-spacing-xxs) / 2);--padding-compact:var(--pine-spacing-xxs);--padding:calc(var(--pine-spacing-md) / 2);-webkit-border-after:var(--border);border-block-end:var(--border);color:var(--color);display:table-cell;font-size:var(--font-size);font-style:normal;font-weight:var(--font-weight);line-height:var(--line-height);padding:var(--padding);text-align:start;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-sortable){cursor:pointer}:host(.is-sortable) pds-icon{-webkit-margin-start:var(--margin-arrow);margin-inline-start:var(--margin-arrow);-webkit-padding-before:var(--padding-arrow);padding-block-start:var(--padding-arrow);position:absolute}:host(.is-sortable:hover),:host(.is-active){color:var(--color-sorting)}";
|
|
6
|
-
const PdsTableHeadCellStyle0 = pdsTableHeadCellCss;
|
|
7
|
-
|
|
8
|
-
const PdsTableHeadCell = /*@__PURE__*/ proxyCustomElement(class PdsTableHeadCell extends HTMLElement {
|
|
9
|
-
constructor() {
|
|
10
|
-
super();
|
|
11
|
-
this.__registerHost();
|
|
12
|
-
this.__attachShadow();
|
|
13
|
-
this.pdsTableSort = createEvent(this, "pdsTableSort", 7);
|
|
14
|
-
this.handleScroll = () => {
|
|
15
|
-
if (this.tableRef.scrollLeft > 0) {
|
|
16
|
-
this.tableScrolling = true;
|
|
17
|
-
}
|
|
18
|
-
else {
|
|
19
|
-
this.tableScrolling = false;
|
|
20
|
-
}
|
|
21
|
-
};
|
|
22
|
-
this.toggleSort = () => {
|
|
23
|
-
if (this.sortable) {
|
|
24
|
-
const column = this.hostElement.innerText.trim();
|
|
25
|
-
this.sortingDirection = this.sortingDirection === 'asc' ? 'desc' : 'asc';
|
|
26
|
-
this.tableRef.querySelectorAll('pds-table-head-cell').forEach((headCell) => {
|
|
27
|
-
headCell.classList.remove('is-active');
|
|
28
|
-
});
|
|
29
|
-
this.hostElement.classList.toggle('is-active');
|
|
30
|
-
this.pdsTableSort.emit({ column, direction: this.sortingDirection });
|
|
31
|
-
}
|
|
32
|
-
};
|
|
33
|
-
this.sortable = undefined;
|
|
34
|
-
this.sortingDirection = 'asc';
|
|
35
|
-
this.tableScrolling = false;
|
|
36
|
-
}
|
|
37
|
-
componentWillRender() {
|
|
38
|
-
this.tableRef = this.hostElement.closest('pds-table');
|
|
39
|
-
}
|
|
40
|
-
componentDidLoad() {
|
|
41
|
-
if (this.tableRef && this.tableRef.responsive && this.tableRef.fixedColumn) {
|
|
42
|
-
this.tableRef.addEventListener('scroll', this.handleScroll);
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
classNames() {
|
|
46
|
-
const classNames = [];
|
|
47
|
-
if (this.tableRef && this.tableRef.compact) {
|
|
48
|
-
classNames.push('is-compact');
|
|
49
|
-
}
|
|
50
|
-
if (this.sortable) {
|
|
51
|
-
classNames.push('is-sortable');
|
|
52
|
-
}
|
|
53
|
-
if (this.sortable && this.sortingDirection !== null) {
|
|
54
|
-
classNames.push('sort-' + this.sortingDirection);
|
|
55
|
-
}
|
|
56
|
-
if (this.tableRef && this.tableRef.fixedColumn && this.tableScrolling) {
|
|
57
|
-
classNames.push('has-scrolled');
|
|
58
|
-
}
|
|
59
|
-
return classNames.join(' ');
|
|
60
|
-
}
|
|
61
|
-
render() {
|
|
62
|
-
return (h(Host, { key: 'b8b24eb690d19c1d6476fd44c69a3231b540d476', class: this.classNames(), role: "columnheader", onClick: this.toggleSort, style: this.tableRef &&
|
|
63
|
-
this.tableRef.fixedColumn &&
|
|
64
|
-
this.tableRef.selectable
|
|
65
|
-
? { '--fixed-cell-position': '40px' }
|
|
66
|
-
: {} }, h("slot", { key: '831ea922b3fb2166852208f2a9520414c93f6954' }), this.sortable && (h("pds-icon", { key: '0afb8d56992327112c64e79d6bfc7c1d192d9732', icon: this.sortingDirection === 'asc' ? upSmall : downSmall }))));
|
|
67
|
-
}
|
|
68
|
-
get hostElement() { return this; }
|
|
69
|
-
static get style() { return PdsTableHeadCellStyle0; }
|
|
70
|
-
}, [1, "pds-table-head-cell", {
|
|
71
|
-
"sortable": [4],
|
|
72
|
-
"sortingDirection": [32],
|
|
73
|
-
"tableScrolling": [32]
|
|
74
|
-
}]);
|
|
75
|
-
function defineCustomElement() {
|
|
76
|
-
if (typeof customElements === "undefined") {
|
|
77
|
-
return;
|
|
78
|
-
}
|
|
79
|
-
const components = ["pds-table-head-cell", "pds-icon"];
|
|
80
|
-
components.forEach(tagName => { switch (tagName) {
|
|
81
|
-
case "pds-table-head-cell":
|
|
82
|
-
if (!customElements.get(tagName)) {
|
|
83
|
-
customElements.define(tagName, PdsTableHeadCell);
|
|
84
|
-
}
|
|
85
|
-
break;
|
|
86
|
-
case "pds-icon":
|
|
87
|
-
if (!customElements.get(tagName)) {
|
|
88
|
-
defineCustomElement$1();
|
|
89
|
-
}
|
|
90
|
-
break;
|
|
91
|
-
} });
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
export { PdsTableHeadCell as P, defineCustomElement as d };
|
|
95
|
-
|
|
96
|
-
//# sourceMappingURL=pds-table-head-cell2.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"pds-table-head-cell2.js","mappings":";;;;AAAA,MAAM,mBAAmB,GAAG,w6CAAw6C,CAAC;AACr8C,+BAAe,mBAAmB;;MCQrB,gBAAgB;;;;;;QA2BnB,iBAAY,GAAG;YACrB,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,GAAG,CAAC,EAAE;gBAChC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;aAC5B;iBAAM;gBACL,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;aAC7B;SACF,CAAC;QAEM,eAAU,GAAG;YACnB,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACjB,MAAM,MAAM,GAAG,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;gBACjD,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,gBAAgB,KAAK,KAAK,GAAG,MAAM,GAAG,KAAK,CAAC;gBAEzE,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,qBAAqB,CAAC,CAAC,OAAO,CAAC,CAAC,QAAQ;oBACrE,QAAQ,CAAC,SAAS,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;iBACxC,CAAC,CAAC;gBAEH,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;gBAC/C,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC;aACtE;SACF,CAAA;;gCAjCmD,KAAK;8BACd,KAAK;;IAEhD,mBAAmB;QACjB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,WAAW,CAAwB,CAAC;KAC9E;IAED,gBAAgB;QACd,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,IAAI,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE;YAC1E,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;SAC7D;KACF;IAwBO,UAAU;QAChB,MAAM,UAAU,GAAG,EAAE,CAAC;QAEtB,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE;YAC1C,UAAU,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;SAC/B;QAED,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,UAAU,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;SAChC;QAED,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,gBAAgB,KAAK,IAAI,EAAE;YACnD,UAAU,CAAC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,gBAAgB,CAAC,CAAC;SAClD;QAED,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,WAAW,IAAI,IAAI,CAAC,cAAc,EAAE;YACrE,UAAU,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;SACjC;QAED,OAAO,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC9B;IAED,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EACxB,IAAI,EAAC,cAAc,EACnB,OAAO,EAAE,IAAI,CAAC,UAAU,EACxB,KAAK,EACH,IAAI,CAAC,QAAQ;gBACb,IAAI,CAAC,QAAQ,CAAC,WAAW;gBACzB,IAAI,CAAC,QAAQ,CAAC,UAAU;kBACpB,EAAE,uBAAuB,EAAE,MAAM,EAAE;kBACnC,EAAE,IAGR,8DAAa,EACZ,IAAI,CAAC,QAAQ,KACZ,iEAAU,IAAI,EAAE,IAAI,CAAC,gBAAgB,KAAK,KAAK,GAAG,OAAO,GAAG,SAAS,GAAI,CAC1E,CACI,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/pds-table/pds-table-head-cell/pds-table-head-cell.scss?tag=pds-table-head-cell&encapsulation=shadow","src/components/pds-table/pds-table-head-cell/pds-table-head-cell.tsx"],"sourcesContent":[":host {\n --background-fixed: var(--pine-color-base-white);\n --border: var(--pine-border-default);\n --box-shadow: 3px 3px 6px -2px rgba(0, 0, 0, 0.1);\n --color-sorting: var(--pine-color-neutral-charcoal-500);\n --color: var(--pine-color-neutral-charcoal-200);\n --fixed-cell-position: 0;\n --font-size: var(--pine-font-size-body-sm);\n --font-weight: var(--pine-font-weight-medium);\n --line-height: var(--pine-line-height-sm);\n --margin-arrow: var(--pine-spacing-xxs);\n --padding-arrow: calc(var(--pine-spacing-xxs) / 2);\n --padding-compact: var(--pine-spacing-xxs);\n --padding: calc(var(--pine-spacing-md) / 2);\n\n border-block-end: var(--border);\n color: var(--color);\n display: table-cell;\n font-size: var(--font-size);\n font-style: normal;\n font-weight: var(--font-weight);\n line-height: var(--line-height);\n padding: var(--padding);\n text-align: start;\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-sortable) {\n cursor: pointer;\n\n pds-icon {\n margin-inline-start: var(--margin-arrow);\n padding-block-start: var(--padding-arrow);\n position: absolute;\n }\n}\n\n:host(.is-sortable:hover),\n:host(.is-active) {\n color: var(--color-sorting);\n}\n","import { Component, Element, Host, Prop, h, Event, EventEmitter, State } from '@stencil/core';\n\nimport { downSmall, upSmall } from '@pine-ds/icons/icons';\n\n@Component({\n tag: 'pds-table-head-cell',\n styleUrl: 'pds-table-head-cell.scss',\n shadow: true,\n})\nexport class PdsTableHeadCell {\n @Element() hostElement: HTMLPdsTableHeadCellElement;\n tableRef: HTMLPdsTableElement;\n\n /**\n * Determines whether the table column is sortable when set to `true`.\n */\n @Prop() sortable: boolean;\n\n /**\n * Event emitted to signal that a table column header has been sorted, providing information about the sorted column's name and sorting direction.\n */\n @Event() pdsTableSort: EventEmitter<{ column: string; direction: string }>;\n\n @State() private sortingDirection: 'asc' | 'desc' = 'asc';\n @State() private tableScrolling: boolean = false;\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 private handleScroll = () => {\n if (this.tableRef.scrollLeft > 0) {\n this.tableScrolling = true;\n } else {\n this.tableScrolling = false;\n }\n };\n\n private toggleSort = () => {\n if (this.sortable) {\n const column = this.hostElement.innerText.trim();\n this.sortingDirection = this.sortingDirection === 'asc' ? 'desc' : 'asc';\n\n this.tableRef.querySelectorAll('pds-table-head-cell').forEach((headCell) => {\n headCell.classList.remove('is-active');\n });\n\n this.hostElement.classList.toggle('is-active');\n this.pdsTableSort.emit({ column, direction: this.sortingDirection });\n }\n }\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.sortable) {\n classNames.push('is-sortable');\n }\n\n if (this.sortable && this.sortingDirection !== null) {\n classNames.push('sort-' + this.sortingDirection);\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 render() {\n return (\n <Host\n class={this.classNames()}\n role=\"columnheader\"\n onClick={this.toggleSort}\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 {this.sortable && (\n <pds-icon icon={this.sortingDirection === 'asc' ? upSmall : downSmall} />\n )}\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type { Components, JSX } from "../dist/types/components";
|
|
2
|
-
|
|
3
|
-
interface PdsTableHead extends Components.PdsTableHead, HTMLElement {}
|
|
4
|
-
export const PdsTableHead: {
|
|
5
|
-
prototype: PdsTableHead;
|
|
6
|
-
new (): PdsTableHead;
|
|
7
|
-
};
|
|
8
|
-
/**
|
|
9
|
-
* Used to define this component and all nested components recursively.
|
|
10
|
-
*/
|
|
11
|
-
export const defineCustomElement: () => void;
|
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
|
-
import { d as defineCustomElement$3 } from './pds-icon2.js';
|
|
3
|
-
import { d as defineCustomElement$2 } from './pds-table-head-cell2.js';
|
|
4
|
-
|
|
5
|
-
const pdsTableHeadCss = ":host{--background-fixed:var(--pine-color-base-white);--border:var(--pine-border-default);border-color:inherit;-webkit-box-sizing:border-box;box-sizing:border-box;display:table-header-group;vertical-align:middle}:host::part(checkbox-cell){background-color:var(--background-fixed);left:0;position:-webkit-sticky;position:sticky;z-index:1}:host pds-table-checkbox-cell{-webkit-border-after:var(--border);border-block-end:var(--border)}";
|
|
6
|
-
const PdsTableHeadStyle0 = pdsTableHeadCss;
|
|
7
|
-
|
|
8
|
-
const PdsTableHead$1 = /*@__PURE__*/ proxyCustomElement(class PdsTableHead extends HTMLElement {
|
|
9
|
-
constructor() {
|
|
10
|
-
super();
|
|
11
|
-
this.__registerHost();
|
|
12
|
-
this.__attachShadow();
|
|
13
|
-
}
|
|
14
|
-
componentWillRender() {
|
|
15
|
-
this.tableRef = this.hostElement.closest('pds-table');
|
|
16
|
-
if (this.tableRef && this.tableRef.fixedColumn) {
|
|
17
|
-
const tableCell = this.hostElement.querySelector('pds-table-head-cell:first-child');
|
|
18
|
-
tableCell === null || tableCell === void 0 ? void 0 : tableCell.classList.add("is-fixed");
|
|
19
|
-
}
|
|
20
|
-
}
|
|
21
|
-
render() {
|
|
22
|
-
return (h(Host, { key: 'e92e19de602fa327f57b5577e346c6ac3c61a807', role: "row" }, this.tableRef && this.tableRef.selectable && (h("pds-table-head-cell", { key: '883511ea021dc59f29a5a354e6bbce7ad1eded86', part: this.tableRef.fixedColumn ? 'checkbox-cell' : '' })), h("slot", { key: 'bc39f9ea30696ee18dd4fafa744225e3e4b3fb9b' })));
|
|
23
|
-
}
|
|
24
|
-
get hostElement() { return this; }
|
|
25
|
-
static get style() { return PdsTableHeadStyle0; }
|
|
26
|
-
}, [1, "pds-table-head"]);
|
|
27
|
-
function defineCustomElement$1() {
|
|
28
|
-
if (typeof customElements === "undefined") {
|
|
29
|
-
return;
|
|
30
|
-
}
|
|
31
|
-
const components = ["pds-table-head", "pds-icon", "pds-table-head-cell"];
|
|
32
|
-
components.forEach(tagName => { switch (tagName) {
|
|
33
|
-
case "pds-table-head":
|
|
34
|
-
if (!customElements.get(tagName)) {
|
|
35
|
-
customElements.define(tagName, PdsTableHead$1);
|
|
36
|
-
}
|
|
37
|
-
break;
|
|
38
|
-
case "pds-icon":
|
|
39
|
-
if (!customElements.get(tagName)) {
|
|
40
|
-
defineCustomElement$3();
|
|
41
|
-
}
|
|
42
|
-
break;
|
|
43
|
-
case "pds-table-head-cell":
|
|
44
|
-
if (!customElements.get(tagName)) {
|
|
45
|
-
defineCustomElement$2();
|
|
46
|
-
}
|
|
47
|
-
break;
|
|
48
|
-
} });
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
const PdsTableHead = PdsTableHead$1;
|
|
52
|
-
const defineCustomElement = defineCustomElement$1;
|
|
53
|
-
|
|
54
|
-
export { PdsTableHead, defineCustomElement };
|
|
55
|
-
|
|
56
|
-
//# sourceMappingURL=pds-table-head.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"pds-table-head.js","mappings":";;;;AAAA,MAAM,eAAe,GAAG,mbAAmb,CAAC;AAC5c,2BAAe,eAAe;;MCMjBA,cAAY;;;;;;IAIvB,mBAAmB;QACjB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,WAAW,CAAwB,CAAC;QAE7E,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE;YAC9C,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,iCAAiC,CAAC,CAAC;YACpF,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;SACtC;KACF;IACD,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,IAAI,EAAC,KAAK,IACb,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,KACxC,4EAAqB,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,WAAW,GAAG,eAAe,GAAG,EAAE,GAAwB,CACpG,EACD,8DAAa,CACR,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["PdsTableHead"],"sources":["src/components/pds-table/pds-table-head/pds-table-head.scss?tag=pds-table-head&encapsulation=shadow","src/components/pds-table/pds-table-head/pds-table-head.tsx"],"sourcesContent":[":host {\n --background-fixed: var(--pine-color-base-white);\n --border: var(--pine-border-default);\n\n border-color: inherit;\n box-sizing: border-box;\n display: table-header-group;\n vertical-align: middle;\n\n // used for pds-checkbox-cell\n // because it is in the ShadowDom\n &::part(checkbox-cell) {\n background-color: var(--background-fixed);\n left: 0;\n position: sticky;\n z-index: 1;\n }\n}\n\n:host pds-table-checkbox-cell {\n border-block-end: var(--border);\n}\n","import { Component, Element, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'pds-table-head',\n styleUrl: 'pds-table-head.scss',\n shadow: true,\n})\nexport class PdsTableHead {\n @Element() hostElement: HTMLPdsTableHeadElement;\n tableRef: HTMLPdsTableElement\n\n componentWillRender() {\n this.tableRef = this.hostElement.closest('pds-table') as HTMLPdsTableElement;\n\n if (this.tableRef && this.tableRef.fixedColumn) {\n const tableCell = this.hostElement.querySelector('pds-table-head-cell:first-child');\n tableCell?.classList.add(\"is-fixed\");\n }\n }\n render() {\n return (\n <Host role=\"row\">\n {this.tableRef && this.tableRef.selectable && (\n <pds-table-head-cell part={this.tableRef.fixedColumn ? 'checkbox-cell' : ''}></pds-table-head-cell>\n )}\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type { Components, JSX } from "../dist/types/components";
|
|
2
|
-
|
|
3
|
-
interface PdsTableRow extends Components.PdsTableRow, HTMLElement {}
|
|
4
|
-
export const PdsTableRow: {
|
|
5
|
-
prototype: PdsTableRow;
|
|
6
|
-
new (): PdsTableRow;
|
|
7
|
-
};
|
|
8
|
-
/**
|
|
9
|
-
* Used to define this component and all nested components recursively.
|
|
10
|
-
*/
|
|
11
|
-
export const defineCustomElement: () => void;
|