@pine-ds/core 2.16.2 → 2.16.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/index2.js +2 -2
- package/components/index2.js.map +1 -1
- package/components/pds-box.js +1 -1
- package/components/pds-box.js.map +1 -1
- package/components/pds-button2.js +25 -5
- package/components/pds-button2.js.map +1 -1
- package/components/pds-checkbox2.js +3 -3
- package/components/pds-chip.js +1 -1
- package/components/pds-copytext.js +11 -5
- package/components/pds-copytext.js.map +1 -1
- package/components/pds-divider.js +1 -1
- package/components/pds-image.js +2 -2
- package/components/pds-input.js +11 -4
- package/components/pds-input.js.map +1 -1
- package/components/pds-link.js +2 -2
- package/components/pds-loader.js +1 -61
- package/components/pds-loader.js.map +1 -1
- package/components/pds-loader2.js +65 -0
- package/components/pds-loader2.js.map +1 -0
- package/components/pds-popover.js +1 -1
- package/components/pds-progress.js +1 -1
- package/components/pds-radio.js +3 -3
- package/components/pds-row.js +1 -1
- package/components/pds-select.js +1 -1
- package/components/pds-sortable-item.js +1 -1
- package/components/pds-sortable.js +1 -1
- package/components/pds-switch.js +3 -3
- package/components/pds-tab.js +3 -3
- package/components/pds-table-body.js +1 -1
- package/components/pds-table-cell2.js +2 -2
- package/components/pds-table-head-cell2.js +2 -2
- package/components/pds-table-head.js +1 -1
- package/components/pds-table-row.js +1 -1
- package/components/pds-table.js +1 -1
- package/components/pds-tabpanel.js +1 -1
- package/components/pds-tabs.js +1 -1
- package/components/pds-text.js +1 -1
- package/components/pds-textarea.js +4 -4
- package/components/pds-tooltip.js +2 -2
- package/dist/cjs/{index-034a8bb0.js → index-59b0d7e2.js} +3 -3
- package/dist/cjs/index-59b0d7e2.js.map +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/pds-accordion.cjs.entry.js +1 -1
- package/dist/cjs/pds-avatar.cjs.entry.js +1 -1
- package/dist/cjs/pds-box.cjs.entry.js +1 -1
- package/dist/cjs/pds-box.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-button.cjs.entry.js +16 -4
- package/dist/cjs/pds-button.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-checkbox.cjs.entry.js +4 -4
- package/dist/cjs/pds-chip.cjs.entry.js +2 -2
- package/dist/cjs/pds-copytext.cjs.entry.js +2 -2
- package/dist/cjs/pds-divider.cjs.entry.js +1 -1
- package/dist/cjs/pds-image.cjs.entry.js +2 -2
- package/dist/cjs/pds-input.cjs.entry.js +12 -5
- package/dist/cjs/pds-input.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-link.cjs.entry.js +3 -3
- package/dist/cjs/pds-loader.cjs.entry.js +2 -2
- package/dist/cjs/pds-loader.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-popover.cjs.entry.js +1 -1
- package/dist/cjs/pds-progress.cjs.entry.js +1 -1
- package/dist/cjs/pds-radio.cjs.entry.js +4 -4
- package/dist/cjs/pds-row.cjs.entry.js +1 -1
- package/dist/cjs/pds-select.cjs.entry.js +2 -2
- package/dist/cjs/pds-sortable-item.cjs.entry.js +2 -2
- package/dist/cjs/pds-sortable.cjs.entry.js +1 -1
- package/dist/cjs/pds-switch.cjs.entry.js +4 -4
- package/dist/cjs/pds-tab.cjs.entry.js +3 -3
- package/dist/cjs/pds-table-body.cjs.entry.js +1 -1
- package/dist/cjs/pds-table-cell.cjs.entry.js +2 -2
- package/dist/cjs/pds-table-head-cell.cjs.entry.js +3 -3
- package/dist/cjs/pds-table-head.cjs.entry.js +1 -1
- package/dist/cjs/pds-table-row.cjs.entry.js +1 -1
- package/dist/cjs/pds-table.cjs.entry.js +1 -1
- package/dist/cjs/pds-tabpanel.cjs.entry.js +1 -1
- package/dist/cjs/pds-tabs.cjs.entry.js +1 -1
- package/dist/cjs/pds-text.cjs.entry.js +1 -1
- package/dist/cjs/pds-textarea.cjs.entry.js +5 -5
- package/dist/cjs/pds-tooltip.cjs.entry.js +2 -2
- package/dist/cjs/pine-core.cjs.js +1 -1
- package/dist/collection/components/pds-box/pds-box.css +3 -3
- package/dist/collection/components/pds-button/pds-button.css +52 -3
- package/dist/collection/components/pds-button/pds-button.js +56 -2
- package/dist/collection/components/pds-button/pds-button.js.map +1 -1
- package/dist/collection/components/pds-button/stories/pds-button.stories.js +32 -0
- package/dist/collection/components/pds-checkbox/pds-checkbox.js +3 -3
- package/dist/collection/components/pds-chip/pds-chip.js +1 -1
- package/dist/collection/components/pds-copytext/pds-copytext.js +1 -1
- package/dist/collection/components/pds-divider/pds-divider.js +1 -1
- package/dist/collection/components/pds-image/pds-image.js +2 -2
- package/dist/collection/components/pds-input/pds-input.css +17 -19
- package/dist/collection/components/pds-input/pds-input.js +11 -4
- package/dist/collection/components/pds-input/pds-input.js.map +1 -1
- package/dist/collection/components/pds-link/pds-link.js +2 -2
- package/dist/collection/components/pds-loader/pds-loader.css +2 -2
- package/dist/collection/components/pds-loader/pds-loader.js +1 -1
- package/dist/collection/components/pds-popover/pds-popover.js +1 -1
- package/dist/collection/components/pds-progress/pds-progress.js +1 -1
- package/dist/collection/components/pds-radio/pds-radio.js +3 -3
- package/dist/collection/components/pds-row/pds-row.js +1 -1
- package/dist/collection/components/pds-select/pds-select.js +1 -1
- package/dist/collection/components/pds-sortable/pds-sortable-item/pds-sortable-item.js +1 -1
- package/dist/collection/components/pds-sortable/pds-sortable.js +1 -1
- package/dist/collection/components/pds-switch/pds-switch.js +3 -3
- package/dist/collection/components/pds-table/pds-table-body/pds-table-body.js +1 -1
- package/dist/collection/components/pds-table/pds-table-cell/pds-table-cell.js +2 -2
- package/dist/collection/components/pds-table/pds-table-head/pds-table-head.js +1 -1
- package/dist/collection/components/pds-table/pds-table-head-cell/pds-table-head-cell.js +2 -2
- package/dist/collection/components/pds-table/pds-table-row/pds-table-row.js +1 -1
- package/dist/collection/components/pds-table/pds-table.js +1 -1
- package/dist/collection/components/pds-tabs/pds-tab/pds-tab.js +3 -3
- package/dist/collection/components/pds-tabs/pds-tabpanel/pds-tabpanel.js +1 -1
- package/dist/collection/components/pds-tabs/pds-tabs.js +1 -1
- package/dist/collection/components/pds-text/pds-text.js +1 -1
- package/dist/collection/components/pds-textarea/pds-textarea.js +4 -4
- package/dist/collection/components/pds-tooltip/pds-tooltip.js +2 -2
- package/dist/docs.json +70 -7
- package/dist/esm/{index-d320cfa9.js → index-7f8e0fa6.js} +3 -3
- package/dist/esm/index-7f8e0fa6.js.map +1 -0
- package/dist/esm/loader.js +1 -1
- package/dist/esm/pds-accordion.entry.js +1 -1
- package/dist/esm/pds-avatar.entry.js +1 -1
- package/dist/esm/pds-box.entry.js +1 -1
- package/dist/esm/pds-box.entry.js.map +1 -1
- package/dist/esm/pds-button.entry.js +16 -4
- package/dist/esm/pds-button.entry.js.map +1 -1
- package/dist/esm/pds-checkbox.entry.js +4 -4
- package/dist/esm/pds-chip.entry.js +2 -2
- package/dist/esm/pds-copytext.entry.js +2 -2
- package/dist/esm/pds-divider.entry.js +1 -1
- package/dist/esm/pds-image.entry.js +2 -2
- package/dist/esm/pds-input.entry.js +12 -5
- package/dist/esm/pds-input.entry.js.map +1 -1
- package/dist/esm/pds-link.entry.js +3 -3
- package/dist/esm/pds-loader.entry.js +2 -2
- package/dist/esm/pds-loader.entry.js.map +1 -1
- package/dist/esm/pds-popover.entry.js +1 -1
- package/dist/esm/pds-progress.entry.js +1 -1
- package/dist/esm/pds-radio.entry.js +4 -4
- package/dist/esm/pds-row.entry.js +1 -1
- package/dist/esm/pds-select.entry.js +2 -2
- package/dist/esm/pds-sortable-item.entry.js +2 -2
- package/dist/esm/pds-sortable.entry.js +1 -1
- package/dist/esm/pds-switch.entry.js +4 -4
- package/dist/esm/pds-tab.entry.js +3 -3
- package/dist/esm/pds-table-body.entry.js +1 -1
- package/dist/esm/pds-table-cell.entry.js +2 -2
- package/dist/esm/pds-table-head-cell.entry.js +3 -3
- package/dist/esm/pds-table-head.entry.js +1 -1
- package/dist/esm/pds-table-row.entry.js +1 -1
- package/dist/esm/pds-table.entry.js +1 -1
- package/dist/esm/pds-tabpanel.entry.js +1 -1
- package/dist/esm/pds-tabs.entry.js +1 -1
- package/dist/esm/pds-text.entry.js +1 -1
- package/dist/esm/pds-textarea.entry.js +5 -5
- package/dist/esm/pds-tooltip.entry.js +2 -2
- package/dist/esm/pine-core.js +1 -1
- package/dist/esm-es5/{index-d320cfa9.js → index-7f8e0fa6.js} +2 -2
- package/dist/esm-es5/index-7f8e0fa6.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-avatar.entry.js +1 -1
- package/dist/esm-es5/pds-box.entry.js +1 -1
- package/dist/esm-es5/pds-box.entry.js.map +1 -1
- package/dist/esm-es5/pds-button.entry.js +1 -1
- package/dist/esm-es5/pds-button.entry.js.map +1 -1
- package/dist/esm-es5/pds-checkbox.entry.js +1 -1
- package/dist/esm-es5/pds-chip.entry.js +1 -1
- package/dist/esm-es5/pds-copytext.entry.js +1 -1
- package/dist/esm-es5/pds-divider.entry.js +1 -1
- package/dist/esm-es5/pds-image.entry.js +1 -1
- package/dist/esm-es5/pds-input.entry.js +1 -1
- package/dist/esm-es5/pds-input.entry.js.map +1 -1
- package/dist/esm-es5/pds-link.entry.js +1 -1
- package/dist/esm-es5/pds-loader.entry.js +1 -1
- package/dist/esm-es5/pds-loader.entry.js.map +1 -1
- package/dist/esm-es5/pds-popover.entry.js +1 -1
- package/dist/esm-es5/pds-progress.entry.js +1 -1
- package/dist/esm-es5/pds-radio.entry.js +1 -1
- package/dist/esm-es5/pds-row.entry.js +1 -1
- package/dist/esm-es5/pds-select.entry.js +1 -1
- package/dist/esm-es5/pds-sortable-item.entry.js +1 -1
- package/dist/esm-es5/pds-sortable.entry.js +1 -1
- package/dist/esm-es5/pds-switch.entry.js +1 -1
- package/dist/esm-es5/pds-tab.entry.js +1 -1
- package/dist/esm-es5/pds-table-body.entry.js +1 -1
- package/dist/esm-es5/pds-table-cell.entry.js +1 -1
- package/dist/esm-es5/pds-table-head-cell.entry.js +1 -1
- package/dist/esm-es5/pds-table-head.entry.js +1 -1
- package/dist/esm-es5/pds-table-row.entry.js +1 -1
- package/dist/esm-es5/pds-table.entry.js +1 -1
- package/dist/esm-es5/pds-tabpanel.entry.js +1 -1
- package/dist/esm-es5/pds-tabs.entry.js +1 -1
- package/dist/esm-es5/pds-text.entry.js +1 -1
- package/dist/esm-es5/pds-textarea.entry.js +1 -1
- package/dist/esm-es5/pds-tooltip.entry.js +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-aa134d2a.system.entry.js → p-01fd3a62.system.entry.js} +2 -2
- package/dist/pine-core/p-028fcdbc.entry.js +2 -0
- package/dist/pine-core/{p-7257c948.entry.js.map → p-028fcdbc.entry.js.map} +1 -1
- package/dist/pine-core/{p-8b2db323.system.entry.js → p-10caa9e9.system.entry.js} +2 -2
- package/dist/pine-core/{p-f81066da.entry.js → p-11b3830e.entry.js} +2 -2
- package/dist/pine-core/{p-f900a8ee.entry.js → p-129ea618.entry.js} +2 -2
- package/dist/pine-core/{p-5e50a381.entry.js → p-138ef0d8.entry.js} +2 -2
- package/dist/pine-core/{p-954098a2.entry.js → p-14c58ba3.entry.js} +2 -2
- package/dist/pine-core/{p-d8260ebf.system.entry.js → p-2aa49969.system.entry.js} +2 -2
- package/dist/pine-core/{p-f19e5736.system.entry.js → p-2d0b1310.system.entry.js} +2 -2
- package/dist/pine-core/{p-e890c1bb.system.entry.js → p-2f80836e.system.entry.js} +2 -2
- package/dist/pine-core/p-325e7255.system.entry.js +2 -0
- package/dist/pine-core/p-325e7255.system.entry.js.map +1 -0
- package/dist/pine-core/{p-8420594c.system.entry.js → p-3b529bb7.system.entry.js} +2 -2
- package/dist/pine-core/{p-d6a5ec65.system.entry.js → p-3c0abfe5.system.entry.js} +2 -2
- package/dist/pine-core/{p-e39bd4b2.system.entry.js → p-3de0ec6c.system.entry.js} +2 -2
- package/dist/pine-core/{p-df73ebae.entry.js → p-3f256ba6.entry.js} +2 -2
- package/dist/pine-core/{p-568ef920.entry.js → p-3fa11581.entry.js} +2 -2
- package/dist/pine-core/{p-f085efeb.entry.js → p-511f7b8e.entry.js} +2 -2
- package/dist/pine-core/{p-92bcb091.entry.js → p-518f8204.entry.js} +2 -2
- package/dist/pine-core/{p-03440844.entry.js → p-520cb092.entry.js} +2 -2
- package/dist/pine-core/p-546c2b18.entry.js +2 -0
- package/dist/pine-core/{p-d0b371ee.system.entry.js → p-55b10add.system.entry.js} +2 -2
- package/dist/pine-core/{p-1e9d6f92.system.entry.js → p-55cbb360.system.entry.js} +2 -2
- package/dist/pine-core/p-5c04aee0.system.js +1 -1
- package/dist/pine-core/p-5c04aee0.system.js.map +1 -1
- package/dist/pine-core/{p-b7e91522.entry.js → p-5d0c0241.entry.js} +2 -2
- package/dist/pine-core/p-5dd93828.system.entry.js +2 -0
- package/dist/pine-core/{p-798cde42.system.entry.js → p-61ddfc76.system.entry.js} +2 -2
- package/dist/pine-core/{p-4f2e4e6f.system.entry.js → p-6500852d.system.entry.js} +2 -2
- package/dist/pine-core/{p-80c582b7.system.entry.js → p-6bba1784.system.entry.js} +2 -2
- package/dist/pine-core/p-6c42ed23.entry.js +2 -0
- package/dist/pine-core/p-6c42ed23.entry.js.map +1 -0
- package/dist/pine-core/{p-d561168e.js → p-6e1737e0.js} +2 -2
- package/dist/pine-core/p-6e1737e0.js.map +1 -0
- package/dist/pine-core/{p-07a7c5bb.entry.js → p-71ba893c.entry.js} +2 -2
- package/dist/pine-core/{p-1edca70e.entry.js → p-7369f396.entry.js} +2 -2
- package/dist/pine-core/p-77d8e9fc.entry.js +2 -0
- package/dist/pine-core/{p-e356293a.entry.js.map → p-77d8e9fc.entry.js.map} +1 -1
- package/dist/pine-core/{p-74ad0244.entry.js → p-7a7cd1eb.entry.js} +2 -2
- package/dist/pine-core/p-7cdcf66c.entry.js +2 -0
- package/dist/pine-core/{p-5e1b7996.entry.js.map → p-7cdcf66c.entry.js.map} +1 -1
- package/dist/pine-core/{p-f34096db.system.entry.js → p-8220fa98.system.entry.js} +2 -2
- package/dist/pine-core/{p-5480346a.system.js → p-840c252f.system.js} +2 -2
- package/dist/pine-core/p-840c252f.system.js.map +1 -0
- package/dist/pine-core/{p-c68362cc.entry.js → p-841eae86.entry.js} +2 -2
- package/dist/pine-core/{p-19be5a8e.system.entry.js → p-8afa0198.system.entry.js} +2 -2
- package/dist/pine-core/{p-da961d2b.entry.js → p-9b2cacf1.entry.js} +2 -2
- package/dist/pine-core/{p-2d52d5f7.entry.js → p-9e9f1428.entry.js} +2 -2
- package/dist/pine-core/p-a020513a.system.entry.js +2 -0
- package/dist/pine-core/p-a020513a.system.entry.js.map +1 -0
- package/dist/pine-core/{p-71dc77f3.entry.js → p-a542bd00.entry.js} +2 -2
- package/dist/pine-core/{p-d9390457.entry.js → p-a5ab26b7.entry.js} +2 -2
- package/dist/pine-core/p-a5ab26b7.entry.js.map +1 -0
- package/dist/pine-core/p-a5c127c1.system.entry.js +2 -0
- package/dist/pine-core/p-a5c127c1.system.entry.js.map +1 -0
- package/dist/pine-core/{p-372a04fa.system.entry.js → p-aab44395.system.entry.js} +2 -2
- package/dist/pine-core/{p-a2465224.entry.js → p-b0cf37c0.entry.js} +2 -2
- package/dist/pine-core/{p-f0c28381.entry.js → p-b164dfe7.entry.js} +2 -2
- package/dist/pine-core/{p-ade60629.system.entry.js → p-b1aa0e9d.system.entry.js} +2 -2
- package/dist/pine-core/p-b1aa0e9d.system.entry.js.map +1 -0
- package/dist/pine-core/{p-ed990ad0.system.entry.js → p-b492ea28.system.entry.js} +2 -2
- package/dist/pine-core/p-bf55e42e.system.entry.js +2 -0
- package/dist/pine-core/{p-f182a1f2.system.entry.js → p-c564c31b.system.entry.js} +2 -2
- package/dist/pine-core/{p-1da5aaf3.entry.js → p-ce0efc2d.entry.js} +2 -2
- package/dist/pine-core/{p-1fd67cb4.system.entry.js → p-d266843a.system.entry.js} +2 -2
- package/dist/pine-core/{p-f90088df.entry.js → p-d34b9adb.entry.js} +2 -2
- package/dist/pine-core/{p-987a101b.system.entry.js → p-d410221a.system.entry.js} +2 -2
- package/dist/pine-core/{p-4c252abb.system.entry.js → p-d61972a6.system.entry.js} +2 -2
- package/dist/pine-core/{p-95e4a6ff.system.entry.js → p-d6f5b0a5.system.entry.js} +2 -2
- package/dist/pine-core/{p-cae3e411.entry.js → p-dbd37883.entry.js} +2 -2
- package/dist/pine-core/{p-29bb6589.entry.js → p-e19d9edd.entry.js} +2 -2
- package/dist/pine-core/{p-adf21b0c.entry.js → p-ec1f256a.entry.js} +2 -2
- package/dist/pine-core/p-ee3cc6ce.entry.js +2 -0
- package/dist/pine-core/p-ee3cc6ce.entry.js.map +1 -0
- package/dist/pine-core/p-f099836d.entry.js +2 -0
- package/dist/pine-core/p-f099836d.entry.js.map +1 -0
- package/dist/pine-core/{p-853af623.system.entry.js → p-f8e61c4c.system.entry.js} +2 -2
- package/dist/pine-core/{p-397ce1a8.system.entry.js → p-fad3645f.system.entry.js} +2 -2
- package/dist/pine-core/{p-8c07ed73.system.entry.js → p-fce8b94f.system.entry.js} +2 -2
- package/dist/pine-core/{p-285cd9d1.system.entry.js → p-fd3e2c23.system.entry.js} +2 -2
- package/dist/pine-core/pine-core.esm.js +1 -1
- package/dist/pine-core/pine-core.esm.js.map +1 -1
- package/dist/pine-core/svg/align-horizontal-bottom.svg +1 -0
- package/dist/pine-core/svg/align-horizontal-center.svg +1 -0
- package/dist/pine-core/svg/align-horizontal-top.svg +1 -0
- package/dist/pine-core/svg/align-vertical-center.svg +1 -0
- package/dist/pine-core/svg/align-vertical-left.svg +1 -0
- package/dist/pine-core/svg/align-vertical-right.svg +1 -0
- package/dist/pine-core/svg/feedback.svg +1 -1
- package/dist/pine-core/svg/form.svg +1 -1
- package/dist/pine-core/svg/grant-offer.svg +1 -1
- package/dist/pine-core/svg/headphones.svg +1 -0
- package/dist/pine-core/svg/kajabi-filled.svg +1 -1
- package/dist/pine-core/svg/kajabi.svg +1 -1
- package/dist/pine-core/svg/layout-top.svg +1 -0
- package/dist/pine-core/svg/mail-open.svg +1 -1
- package/dist/pine-core/svg/mail.svg +1 -1
- package/dist/pine-core/svg/merge.svg +1 -1
- package/dist/pine-core/svg/newsletter-2.svg +1 -1
- package/dist/pine-core/svg/pie-chart-filled.svg +1 -0
- package/dist/pine-core/svg/present.svg +1 -1
- package/dist/pine-core/svg/restore.svg +1 -1
- package/dist/pine-core/svg/star-03.svg +1 -0
- package/dist/pine-core/svg/star-filled.svg +1 -0
- package/dist/pine-core/svg/star.svg +1 -1
- package/dist/pine-core/svg/sync.svg +1 -1
- package/dist/pine-core/svg/trophy.svg +1 -1
- package/dist/pine-core/svg/type.svg +1 -0
- package/dist/pine-core/svg/user-filled.svg +1 -1
- package/dist/types/components/pds-button/pds-button.d.ts +11 -0
- package/dist/types/components/pds-input/pds-input.d.ts +2 -1
- package/dist/types/components.d.ts +22 -2
- package/hydrate/index.js +75 -54
- package/hydrate/index.mjs +75 -54
- package/package.json +2 -2
- package/dist/cjs/index-034a8bb0.js.map +0 -1
- package/dist/esm/index-d320cfa9.js.map +0 -1
- package/dist/esm-es5/index-d320cfa9.js.map +0 -1
- package/dist/pine-core/p-27e12bd2.system.entry.js +0 -2
- package/dist/pine-core/p-27e12bd2.system.entry.js.map +0 -1
- package/dist/pine-core/p-30cd9f18.entry.js +0 -2
- package/dist/pine-core/p-3fbb568f.entry.js +0 -2
- package/dist/pine-core/p-3fbb568f.entry.js.map +0 -1
- package/dist/pine-core/p-4d1fbb88.system.entry.js +0 -2
- package/dist/pine-core/p-5480346a.system.js.map +0 -1
- package/dist/pine-core/p-5e1b7996.entry.js +0 -2
- package/dist/pine-core/p-60c2039e.system.entry.js +0 -2
- package/dist/pine-core/p-7257c948.entry.js +0 -2
- package/dist/pine-core/p-7baec1ed.entry.js +0 -2
- package/dist/pine-core/p-7baec1ed.entry.js.map +0 -1
- package/dist/pine-core/p-8c0a648d.system.entry.js +0 -2
- package/dist/pine-core/p-8c0a648d.system.entry.js.map +0 -1
- package/dist/pine-core/p-a22fd94e.entry.js +0 -2
- package/dist/pine-core/p-a22fd94e.entry.js.map +0 -1
- package/dist/pine-core/p-ade60629.system.entry.js.map +0 -1
- package/dist/pine-core/p-d561168e.js.map +0 -1
- package/dist/pine-core/p-d9390457.entry.js.map +0 -1
- package/dist/pine-core/p-e356293a.entry.js +0 -2
- package/dist/pine-core/p-e60348bc.system.entry.js +0 -2
- package/dist/pine-core/p-e60348bc.system.entry.js.map +0 -1
- /package/dist/pine-core/{p-aa134d2a.system.entry.js.map → p-01fd3a62.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-8b2db323.system.entry.js.map → p-10caa9e9.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-f81066da.entry.js.map → p-11b3830e.entry.js.map} +0 -0
- /package/dist/pine-core/{p-f900a8ee.entry.js.map → p-129ea618.entry.js.map} +0 -0
- /package/dist/pine-core/{p-5e50a381.entry.js.map → p-138ef0d8.entry.js.map} +0 -0
- /package/dist/pine-core/{p-954098a2.entry.js.map → p-14c58ba3.entry.js.map} +0 -0
- /package/dist/pine-core/{p-d8260ebf.system.entry.js.map → p-2aa49969.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-f19e5736.system.entry.js.map → p-2d0b1310.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-e890c1bb.system.entry.js.map → p-2f80836e.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-8420594c.system.entry.js.map → p-3b529bb7.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-d6a5ec65.system.entry.js.map → p-3c0abfe5.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-e39bd4b2.system.entry.js.map → p-3de0ec6c.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-df73ebae.entry.js.map → p-3f256ba6.entry.js.map} +0 -0
- /package/dist/pine-core/{p-568ef920.entry.js.map → p-3fa11581.entry.js.map} +0 -0
- /package/dist/pine-core/{p-f085efeb.entry.js.map → p-511f7b8e.entry.js.map} +0 -0
- /package/dist/pine-core/{p-92bcb091.entry.js.map → p-518f8204.entry.js.map} +0 -0
- /package/dist/pine-core/{p-03440844.entry.js.map → p-520cb092.entry.js.map} +0 -0
- /package/dist/pine-core/{p-30cd9f18.entry.js.map → p-546c2b18.entry.js.map} +0 -0
- /package/dist/pine-core/{p-d0b371ee.system.entry.js.map → p-55b10add.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-1e9d6f92.system.entry.js.map → p-55cbb360.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-b7e91522.entry.js.map → p-5d0c0241.entry.js.map} +0 -0
- /package/dist/pine-core/{p-4d1fbb88.system.entry.js.map → p-5dd93828.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-798cde42.system.entry.js.map → p-61ddfc76.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-4f2e4e6f.system.entry.js.map → p-6500852d.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-80c582b7.system.entry.js.map → p-6bba1784.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-07a7c5bb.entry.js.map → p-71ba893c.entry.js.map} +0 -0
- /package/dist/pine-core/{p-1edca70e.entry.js.map → p-7369f396.entry.js.map} +0 -0
- /package/dist/pine-core/{p-74ad0244.entry.js.map → p-7a7cd1eb.entry.js.map} +0 -0
- /package/dist/pine-core/{p-f34096db.system.entry.js.map → p-8220fa98.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-c68362cc.entry.js.map → p-841eae86.entry.js.map} +0 -0
- /package/dist/pine-core/{p-19be5a8e.system.entry.js.map → p-8afa0198.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-da961d2b.entry.js.map → p-9b2cacf1.entry.js.map} +0 -0
- /package/dist/pine-core/{p-2d52d5f7.entry.js.map → p-9e9f1428.entry.js.map} +0 -0
- /package/dist/pine-core/{p-71dc77f3.entry.js.map → p-a542bd00.entry.js.map} +0 -0
- /package/dist/pine-core/{p-372a04fa.system.entry.js.map → p-aab44395.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-a2465224.entry.js.map → p-b0cf37c0.entry.js.map} +0 -0
- /package/dist/pine-core/{p-f0c28381.entry.js.map → p-b164dfe7.entry.js.map} +0 -0
- /package/dist/pine-core/{p-ed990ad0.system.entry.js.map → p-b492ea28.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-60c2039e.system.entry.js.map → p-bf55e42e.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-f182a1f2.system.entry.js.map → p-c564c31b.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-1da5aaf3.entry.js.map → p-ce0efc2d.entry.js.map} +0 -0
- /package/dist/pine-core/{p-1fd67cb4.system.entry.js.map → p-d266843a.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-f90088df.entry.js.map → p-d34b9adb.entry.js.map} +0 -0
- /package/dist/pine-core/{p-987a101b.system.entry.js.map → p-d410221a.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-4c252abb.system.entry.js.map → p-d61972a6.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-95e4a6ff.system.entry.js.map → p-d6f5b0a5.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-cae3e411.entry.js.map → p-dbd37883.entry.js.map} +0 -0
- /package/dist/pine-core/{p-29bb6589.entry.js.map → p-e19d9edd.entry.js.map} +0 -0
- /package/dist/pine-core/{p-adf21b0c.entry.js.map → p-ec1f256a.entry.js.map} +0 -0
- /package/dist/pine-core/{p-853af623.system.entry.js.map → p-f8e61c4c.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-397ce1a8.system.entry.js.map → p-fad3645f.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-8c07ed73.system.entry.js.map → p-fce8b94f.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-285cd9d1.system.entry.js.map → p-fd3e2c23.system.entry.js.map} +0 -0
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,h as r,H as o}from"./p-87fe352f.js";const a=":host{border-color:inherit;display:table-row-group;vertical-align:middle}";const s=a;const t=class{constructor(r){e(this,r)}render(){return r(o,{key:"60a95951b44201ddb343ad09de86e456e0699660",role:"rowgroup"},r("slot",{key:"76859c304c640fb6aa2ea1239e500fe94da7402f"}))}};t.style=s;export{t as pds_table_body};
|
|
2
|
-
//# sourceMappingURL=p-5e1b7996.entry.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
System.register(["./p-45cf2585.system.js"],(function(e){"use strict";var t,r,n;return{setters:[function(e){t=e.r;r=e.h;n=e.H}],execute:function(){var o=":host{border-color:inherit;display:table-row-group;vertical-align:middle}";var a=o;var i=e("pds_table_body",function(){function e(e){t(this,e)}e.prototype.render=function(){return r(n,{key:"60a95951b44201ddb343ad09de86e456e0699660",role:"rowgroup"},r("slot",{key:"76859c304c640fb6aa2ea1239e500fe94da7402f"}))};return e}());i.style=a}}}));
|
|
2
|
-
//# sourceMappingURL=p-60c2039e.system.entry.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,c as i,h as s,H as a,g as t}from"./p-87fe352f.js";import{i as r,a as o,m as d}from"./p-47291f05.js";import{d as n}from"./p-46fb585d.js";import{i as l,a as c}from"./p-7905b8b8.js";import{b as h}from"./p-d561168e.js";const p=":host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}";const b=p;const f=":host{--pine-input-color-background-danger:var(--pine-color-red-050)}";const u=f;const x=":host{--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);display:inline}:host([aria-readonly=true]) textarea{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}.pds-textarea{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}label{display:block;-webkit-margin-after:var(--pine-dimension-xs);margin-block-end:var(--pine-dimension-xs)}.pds-textarea__field{background-color:var(--pine-color-background-container);border:var(--pine-border);border-radius:calc(var(--pine-dimension-xs) * 1.25);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-textarea__field:hover:not(:disabled,.is-invalid){border:var(--pine-border-hover)}.pds-textarea__field:disabled{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}.pds-textarea__field:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-textarea__field::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field.is-invalid{background-color:var(--pine-input-color-background-danger);border-color:var(--pine-color-border-danger)}.pds-textarea__field.is-invalid:focus-visible{-webkit-box-shadow:var(--box-shadow-focus-error);box-shadow:var(--box-shadow-focus-error)}.pds-textarea__error-message,.pds-textarea__helper-message{font:var(--pine-typography-body-sm-medium);-webkit-margin-before:var(--pine-dimension-xs);margin-block-start:var(--pine-dimension-xs)}.pds-textarea__error-message{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}";const v=x;const m=class{constructor(s){e(this,s);this.pdsBlur=i(this,"pdsBlur",7);this.pdsFocus=i(this,"pdsFocus",7);this.pdsInput=i(this,"pdsInput",7);this.pdsTextareaChange=i(this,"pdsTextareaChange",7);this.inheritedAttributes={};this.onBlur=e=>{this.hasFocus=false;if(this.focusedValue!==this.value){this.emitValueChange(e)}this.pdsBlur.emit(e)};this.onFocus=e=>{this.hasFocus=true;this.focusedValue=this.value;this.pdsFocus.emit(e)};this.onInput=e=>{const i=e.target;if(i){this.value=i.value||""}this.emitInputChange(e)};this.onTextareaChange=e=>{this.emitValueChange(e)};this.autocomplete=undefined;this.componentId=undefined;this.disabled=false;this.debounce=undefined;this.errorMessage=undefined;this.helperMessage=undefined;this.invalid=false;this.label=undefined;this.name=this.componentId;this.placeholder=undefined;this.readonly=false;this.required=false;this.rows=undefined;this.value="";this.hasFocus=false}async setFocus(){if(this.nativeTextarea){this.nativeTextarea.focus()}}debounceChanged(){const{pdsInput:e,debounce:i,originalPdsInput:s}=this;this.pdsInput=i===undefined?s!==null&&s!==void 0?s:e:n(e,i)}valueChanged(){const e=this.nativeTextarea;const i=this.getValue();if(e&&e.value!==i){e.value=i}}emitInputChange(e){const{value:i}=this;this.pdsInput.emit({value:i,event:e})}emitValueChange(e){const i=e.target;r(i,this);const{value:s}=i;const a=s==null?s:s.toString();this.focusedValue=a;this.pdsTextareaChange.emit({value:a,event:e})}getValue(){return this.value||""}textareaClassNames(){const e=["pds-textarea__field"];if(this.invalid&&this.invalid===true){e.push("is-invalid")}return e.join(" ")}connectedCallback(){this.debounceChanged()}componentWillLoad(){this.inheritedAttributes=Object.assign(Object.assign({},l(this.el)),c(this.el))}componentDidLoad(){this.originalPdsInput=this.pdsInput}render(){const e=this.getValue();return s(a,{key:"aa960b2a67c927c296040e835fadcd8f8bcbbc18","aria-disabled":this.disabled?"true":null,"aria-readonly":this.readonly?"true":null},s("div",{key:"b95804e8ddbd92f4d7177c90d342d0ff2022ad44",class:"pds-textarea"},this.label&&s("label",{key:"ef508b6af03cf871b419b2dd4d79ded182b59da5",htmlFor:this.componentId},this.label),s("textarea",Object.assign({key:"2d2f195e8a715332eab0bba4f869db67b0f249c9",ref:e=>this.nativeTextarea=e,"aria-describedby":o(this.componentId,this.invalid,this.helperMessage),"aria-invalid":this.invalid?"true":undefined,autocomplete:this.autocomplete,class:this.textareaClassNames(),disabled:this.disabled,id:this.componentId,name:this.name,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,rows:this.rows,onBlur:this.onBlur,onChange:this.onTextareaChange,onFocus:this.onFocus,onInput:this.onInput},this.inheritedAttributes),e),this.helperMessage&&s("p",{key:"84ad453017c378553eeda5198267564661b9bc8f",class:"pds-textarea__helper-message",id:d(this.componentId,"helper")},this.helperMessage),this.invalid&&s("p",{key:"d1fbcbe5af314a25bdec647d560f9e964a9c8b90","aria-live":"assertive",class:"pds-textarea__error-message",id:d(this.componentId,"error")},s("pds-icon",{key:"525edfdafeabd31a41e62c0c0e454752123c7c8a",icon:h,size:"small"}),this.errorMessage)))}get el(){return t(this)}static get watchers(){return{debounce:["debounceChanged"],value:["valueChanged"]}}};m.style=b+(u+v);export{m as pds_textarea};
|
|
2
|
-
//# sourceMappingURL=p-7257c948.entry.js.map
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as o,c as r,h as e,H as n,g as a}from"./p-87fe352f.js";import{h as i}from"./p-46fb585d.js";import{f as d}from"./p-d561168e.js";const t=":host{--color-border-default:transparent;--color-border-disabled:transparent;--color-border-focus:transparent;--color-border-hover:transparent;display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle}.pds-button{-ms-flex-align:center;align-items:center;background-color:var(--color-background-default);border:var(--pine-border);border-color:var(--color-border-default);border-radius:var(--pine-border-radius-full);color:var(--color-text-default);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-brand-label);letter-spacing:var(--pine-letter-spacing);min-height:40px;padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-button pds-icon{color:currentColor;fill:currentColor;-webkit-margin-end:var(--pine-dimension-xs);margin-inline-end:var(--pine-dimension-xs)}.pds-button:hover{background-color:var(--color-background-hover);border-color:var(--color-border-hover)}.pds-button:focus-visible{--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);border-color:var(--color-border-focus);-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-button:disabled{background-color:var(--color-background-disabled);border-color:var(--color-border-disabled);color:var(--color-text-disabled);pointer-events:none}.pds-button--primary{--color-background-default:var(--pine-color-primary);--color-background-hover:var(--pine-color-primary-hover);--color-background-disabled:var(--pine-color-primary-disabled);--color-border-default:var(--pine-color-primary);--color-border-hover:var(--pine-color-primary-hover);--color-text-default:var(--pine-color-text-primary);--color-text-disabled:var(--pine-color-text-primary-disabled);--color-outline:var(--pine-color-focus-ring)}.pds-button--accent{--color-background-default:var(--pine-color-accent);--color-background-hover:var(--pine-color-accent-hover);--color-background-disabled:var(--pine-color-accent-disabled);--color-border-default:var(--pine-color-accent);--color-border-hover:var(--pine-color-accent-hover);--color-text-default:var(--pine-color-text-primary);--color-text-disabled:var(--pine-color-text-accent-disabled);--color-outline:var(--pine-color-focus-ring)}.pds-button--destructive{--color-background-default:var(--pine-color-danger);--color-background-hover:var(--pine-color-danger-hover);--color-background-disabled:var(--pine-color-danger-disabled);--color-border-default:var(--pine-color-danger);--color-border-hover:var(--pine-color-danger-hover);--color-text-default:var(--pine-color-text-primary);--color-text-disabled:var(--pine-color-text-danger-disabled);--color-outline:var(--pine-color-focus-ring-danger)}.pds-button--destructive:focus-visible{--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-danger);-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-button--secondary,.pds-button--disclosure{--color-background-default:transparent;--color-background-hover:transparent;--color-background-disabled:transparent;--color-border-disabled:var(--pine-color-border-disabled);--color-border-focus:var(--pine-color-border);--color-border-hover:var(--pine-color-border-hover);--color-border-default:var(--pine-color-border);--color-text-default:var(--pine-color-text-secondary);--color-text-disabled:var(--pine-color-text-secondary-disabled);--color-outline:var(--pine-color-focus-ring)}.pds-button--secondary:hover,.pds-button--disclosure:hover{background-color:var(--pine-color-secondary-hover)}.pds-button--disclosure pds-icon{-webkit-margin-end:var(--pine-dimension-none);margin-inline-end:var(--pine-dimension-none);-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}.pds-button--unstyled{--color-background-default:transparent;--color-background-hover:transparent;--color-background-disabled:transparent;--color-text-default:inherit;border-width:var(--pine-dimension-none);margin:var(--pine-dimension-none);min-height:auto;padding:var(--pine-dimension-none);width:inherit}";const c=t;const s=class{constructor(e){o(this,e);this.pdsClick=r(this,"pdsClick",7);this.handleClick=o=>{if(this.type!="button"){if(i(this.el)){const r=this.el.closest("form");if(r){o.preventDefault();const e=document.createElement("button");e.type=this.type;e.style.display="none";r.appendChild(e);e.click();e.remove()}}}this.pdsClick.emit(o)};this.componentId=undefined;this.disabled=false;this.icon=null;this.name=undefined;this.value=undefined;this.type="button";this.variant="primary"}classNames(){const o=["pds-button"];if(this.variant){o.push("pds-button--"+this.variant)}return o.join(" ")}render(){return e(n,{key:"09f73346a0de854613bb43e81a9099c2e3783ec0","aria-disabled":this.disabled?"true":null,id:this.componentId,onClick:this.handleClick,variant:this.variant},e("button",{key:"e02d07f103692dfdf0f40c4ef0659674d92b701a",class:this.classNames(),disabled:this.disabled,name:this.name,part:"button",type:this.type,value:this.value},this.icon&&this.variant!=="disclosure"&&e("pds-icon",{key:"642e6890c4d6cdbbe129af1ef3532fcd5c4a7925",name:this.icon,part:"icon"}),e("slot",{key:"58e95d868055a2723657a757a3c49cbb7989d912"}),this.variant==="disclosure"&&e("pds-icon",{key:"81d4456cb62d77056f93e60091215347ac743134",icon:d,part:"caret"})))}get el(){return a(this)}};s.style=c;export{s as pds_button};
|
|
2
|
-
//# sourceMappingURL=p-7baec1ed.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["pdsButtonCss","PdsButtonStyle0","PdsButton","this","handleClick","ev","type","hasShadowDom","el","form","closest","preventDefault","fakeButton","document","createElement","style","display","appendChild","click","remove","pdsClick","emit","classNames","variant","push","join","render","h","Host","key","disabled","id","componentId","onClick","class","name","part","value","icon","caretDown"],"sources":["src/components/pds-button/pds-button.scss?tag=pds-button&encapsulation=shadow","src/components/pds-button/pds-button.tsx"],"sourcesContent":[":host {\n --color-border-default: transparent;\n --color-border-disabled: transparent;\n --color-border-focus: transparent;\n --color-border-hover: transparent;\n\n display: inline-flex;\n vertical-align: middle;\n}\n\n.pds-button {\n align-items: center;\n background-color: var(--color-background-default);\n border: var(--pine-border);\n border-color: var(--color-border-default);\n border-radius: var(--pine-border-radius-full);\n color: var(--color-text-default); // Set in the variant classes below\n cursor: pointer;\n display: flex;\n font: var(--pine-typography-body-brand-label);\n letter-spacing: var(--pine-letter-spacing);\n min-height: 40px;\n padding: var(--pine-dimension-xs) var(--pine-dimension-sm);\n\n pds-icon {\n color: currentColor;\n fill: currentColor;\n margin-inline-end: var(--pine-dimension-xs);\n }\n\n &:hover {\n background-color: var(--color-background-hover);\n border-color: var(--color-border-hover);\n }\n\n &:focus-visible {\n --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n border-color: var(--color-border-focus);\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 &:disabled {\n background-color: var(--color-background-disabled);\n border-color: var(--color-border-disabled);\n color: var(--color-text-disabled);\n pointer-events: none;\n }\n}\n\n.pds-button--primary {\n --color-background-default: var(--pine-color-primary);\n --color-background-hover: var(--pine-color-primary-hover);\n --color-background-disabled: var(--pine-color-primary-disabled);\n --color-border-default: var(--pine-color-primary);\n --color-border-hover: var(--pine-color-primary-hover);\n --color-text-default: var(--pine-color-text-primary);\n --color-text-disabled: var(--pine-color-text-primary-disabled);\n --color-outline: var(--pine-color-focus-ring);\n}\n\n.pds-button--accent {\n --color-background-default: var(--pine-color-accent);\n --color-background-hover: var(--pine-color-accent-hover);\n --color-background-disabled: var(--pine-color-accent-disabled);\n --color-border-default: var(--pine-color-accent);\n --color-border-hover: var(--pine-color-accent-hover);\n --color-text-default: var(--pine-color-text-primary);\n --color-text-disabled: var(--pine-color-text-accent-disabled);\n --color-outline: var(--pine-color-focus-ring);\n}\n\n.pds-button--destructive {\n --color-background-default: var(--pine-color-danger);\n --color-background-hover: var(--pine-color-danger-hover);\n --color-background-disabled: var(--pine-color-danger-disabled);\n --color-border-default: var(--pine-color-danger);\n --color-border-hover: var(--pine-color-danger-hover);\n --color-text-default: var(--pine-color-text-primary);\n --color-text-disabled: var(--pine-color-text-danger-disabled);\n --color-outline: var(--pine-color-focus-ring-danger);\n\n &:focus-visible {\n --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-danger);\n box-shadow: var(--box-shadow-focus); // Remove when outline radius is supported in Safari\n outline: none;\n }\n}\n\n.pds-button--secondary,\n.pds-button--disclosure {\n --color-background-default: transparent;\n --color-background-hover: transparent;\n --color-background-disabled: transparent;\n --color-border-disabled: var(--pine-color-border-disabled);\n --color-border-focus: var(--pine-color-border);\n --color-border-hover: var(--pine-color-border-hover);\n --color-border-default: var(--pine-color-border);\n --color-text-default: var(--pine-color-text-secondary);\n --color-text-disabled: var(--pine-color-text-secondary-disabled);\n --color-outline: var(--pine-color-focus-ring);\n\n &:hover {\n background-color: var(--pine-color-secondary-hover);\n }\n}\n\n.pds-button--disclosure {\n pds-icon {\n margin-inline-end: var(--pine-dimension-none);\n margin-inline-start: var(--pine-dimension-xs);\n }\n}\n\n.pds-button--unstyled {\n --color-background-default: transparent;\n --color-background-hover: transparent;\n --color-background-disabled: transparent;\n --color-text-default: inherit;\n border-width: var(--pine-dimension-none);\n margin: var(--pine-dimension-none);\n min-height: auto;\n padding: var(--pine-dimension-none);\n width: inherit;\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { hasShadowDom } from '../../utils/utils';\n\nimport { caretDown } from '@pine-ds/icons/icons';\n\n/**\n * @part button - Exposes the button element for styling.\n * @part caret - Exposes the caret icon component for styling. Appears only on the disclosure variant.\n * @part icon - Exposes the icon component for styling.\n*/\n\n@Component({\n tag: 'pds-button',\n styleUrls: ['pds-button.scss'],\n shadow: true,\n})\nexport class PdsButton {\n @Element() el: HTMLPdsButtonElement;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Determines the button's disabled state.\n * @defaultValue false\n */\n @Prop() disabled? = false;\n\n /**\n * Displays an icon before the text when\n * the icon string matches an icon name.\n * @defaultValue null\n */\n @Prop() icon?: string = null;\n\n /**\n * Provides the button with a submittable name.\n */\n @Prop() name?: string;\n\n /**\n * Provides button with a submittable value\n */\n @Prop() value?: string;\n\n /**\n * Provides button with a type.\n * @defaultValue button\n */\n @Prop() type?: 'button' | 'reset' | 'submit' = 'button';\n\n /**\n * Sets the style variant of the button.\n * @defaultValue primary\n */\n @Prop() variant: 'primary' | 'secondary' | 'accent' | 'disclosure' | 'destructive' | 'unstyled' = 'primary';\n\n @Event() pdsClick: EventEmitter;\n\n private handleClick = (ev: Event) => {\n if (this.type != 'button') {\n // If button clicked IS NOT associated with a form\n if (hasShadowDom(this.el)) {\n const form = this.el.closest('form')\n if (form) {\n ev.preventDefault()\n\n const fakeButton = document.createElement('button')\n fakeButton.type = this.type\n fakeButton.style.display = 'none'\n form.appendChild(fakeButton)\n fakeButton.click()\n fakeButton.remove()\n }\n }\n }\n this.pdsClick.emit(ev);\n }\n\n private classNames() {\n const classNames = ['pds-button'];\n\n if (this.variant) {\n classNames.push('pds-button--' + this.variant);\n }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n id={this.componentId}\n onClick={this.handleClick}\n variant={this.variant}\n >\n <button\n class={this.classNames()}\n disabled={this.disabled}\n name={this.name}\n part=\"button\"\n type={this.type}\n value={this.value}\n >\n {this.icon && this.variant !== 'disclosure' && <pds-icon name={this.icon} part=\"icon\"></pds-icon>}\n <slot />\n {this.variant === 'disclosure' && <pds-icon icon={caretDown} part=\"caret\"></pds-icon>}\n </button>\n </Host>\n );\n }\n}\n"],"mappings":"wIAAA,MAAMA,EAAe,68HACrB,MAAAC,EAAeD,E,MCeFE,EAAS,M,4DA6CZC,KAAAC,YAAeC,IACrB,GAAIF,KAAKG,MAAQ,SAAU,CAEzB,GAAIC,EAAaJ,KAAKK,IAAK,CACzB,MAAMC,EAAON,KAAKK,GAAGE,QAAQ,QAC7B,GAAID,EAAM,CACRJ,EAAGM,iBAEH,MAAMC,EAAaC,SAASC,cAAc,UAC1CF,EAAWN,KAAOH,KAAKG,KACvBM,EAAWG,MAAMC,QAAU,OAC3BP,EAAKQ,YAAYL,GACjBA,EAAWM,QACXN,EAAWO,Q,GAIjBhB,KAAKiB,SAASC,KAAKhB,EAAG,E,yCAlDJ,M,UAOI,K,mDAgBuB,S,aAMmD,S,CAwB1F,UAAAiB,GACN,MAAMA,EAAa,CAAC,cAEpB,GAAInB,KAAKoB,QAAS,CAChBD,EAAWE,KAAK,eAAiBrB,KAAKoB,Q,CAGxC,OAAOD,EAAWG,KAAK,K,CAGzB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2DACY1B,KAAK2B,SAAW,OAAS,KACxCC,GAAI5B,KAAK6B,YACTC,QAAS9B,KAAKC,YACdmB,QAASpB,KAAKoB,SAEdI,EAAA,UAAAE,IAAA,2CACEK,MAAO/B,KAAKmB,aACZQ,SAAU3B,KAAK2B,SACfK,KAAMhC,KAAKgC,KACXC,KAAK,SACL9B,KAAMH,KAAKG,KACX+B,MAAOlC,KAAKkC,OAEXlC,KAAKmC,MAAQnC,KAAKoB,UAAY,cAAgBI,EAAA,YAAAE,IAAA,2CAAUM,KAAMhC,KAAKmC,KAAMF,KAAK,SAC/ET,EAAA,QAAAE,IAAA,6CACC1B,KAAKoB,UAAY,cAAgBI,EAAA,YAAAE,IAAA,2CAAUS,KAAMC,EAAWH,KAAK,W","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
var __awaiter=this&&this.__awaiter||function(e,i,n,r){function t(e){return e instanceof n?e:new n((function(i){i(e)}))}return new(n||(n=Promise))((function(n,o){function a(e){try{l(r.next(e))}catch(e){o(e)}}function s(e){try{l(r["throw"](e))}catch(e){o(e)}}function l(e){e.done?n(e.value):t(e.value).then(a,s)}l((r=r.apply(e,i||[])).next())}))};var __generator=this&&this.__generator||function(e,i){var n={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},r,t,o,a;return a={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function s(e){return function(i){return l([e,i])}}function l(s){if(r)throw new TypeError("Generator is already executing.");while(a&&(a=0,s[0]&&(n=0)),n)try{if(r=1,t&&(o=s[0]&2?t["return"]:s[0]?t["throw"]||((o=t["return"])&&o.call(t),0):t.next)&&!(o=o.call(t,s[1])).done)return o;if(t=0,o)s=[s[0]&2,o.value];switch(s[0]){case 0:case 1:o=s;break;case 4:n.label++;return{value:s[1],done:false};case 5:n.label++;t=s[1];s=[0];continue;case 7:s=n.ops.pop();n.trys.pop();continue;default:if(!(o=n.trys,o=o.length>0&&o[o.length-1])&&(s[0]===6||s[0]===2)){n=0;continue}if(s[0]===3&&(!o||s[1]>o[0]&&s[1]<o[3])){n.label=s[1];break}if(s[0]===6&&n.label<o[1]){n.label=o[1];o=s;break}if(o&&n.label<o[2]){n.label=o[2];n.ops.push(s);break}if(o[2])n.ops.pop();n.trys.pop();continue}s=i.call(e,n)}catch(e){s=[6,e];t=0}finally{r=o=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};System.register(["./p-45cf2585.system.js","./p-521ac753.system.js","./p-5480346a.system.js","./p-017e1978.system.js","./p-a7d75615.system.js"],(function(e){"use strict";var i,n,r,t,o,a,s,l,c,d;return{setters:[function(e){i=e.r;n=e.c;r=e.h;t=e.H;o=e.g},function(e){a=e.a;s=e.m},function(e){l=e.b},function(e){c=e.d},function(e){d=e.i}],execute:function(){var u=":host{--pine-input-color-background-danger:var(--pine-color-red-050)}";var p=u;var h=":host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}";var f=h;var b=":host{--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);display:inline}:host([aria-readonly=true]) input{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}.pds-input{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}label{-webkit-margin-after:var(--pine-dimension-xs);margin-block-end:var(--pine-dimension-xs)}input{border:1px solid var(--pine-color-border);border-radius:10px;color:var(--pine-color-text-active);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);padding:var(--pine-dimension-xs) var(--pine-dimension-sm);}input:disabled{background-color:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed;}input:disabled::-webkit-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}input:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}input:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}input:disabled:-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}input:hover{border-color:var(--pine-color-border-hover)}input:focus-visible{border-color:var(--pine-color-border-active);-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}input::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}input::-moz-placeholder{color:var(--pine-color-text-placeholder)}input::-moz-placeholder{color:var(--pine-color-text-placeholder)}input:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}input:has(~.pds-input__error-message){background-color:var(--pine-input-color-background-danger);border-color:var(--pine-color-border-danger)}input:has(~.pds-input__error-message):focus-visible{-webkit-box-shadow:var(--box-shadow-focus-error);box-shadow:var(--box-shadow-focus-error);outline:none}.pds-input__error-message,.pds-input__helper-message{font:var(--pine-typography-body-sm-medium);-webkit-margin-after:0;margin-block-end:0;-webkit-margin-before:var(--pine-dimension-xs);margin-block-start:var(--pine-dimension-xs)}.pds-input__error-message{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}";var v=b;var m=e("pds_input",function(){function e(e){var r=this;i(this,e);this.pdsBlur=n(this,"pdsBlur",7);this.pdsChange=n(this,"pdsChange",7);this.pdsFocus=n(this,"pdsFocus",7);this.pdsInput=n(this,"pdsInput",7);this.inheritedAttributes={};this.isComposing=false;this.onInputEvent=function(e){var i=e.target;if(i){r.value=i.value||""}r.emitInputChange(e)};this.onChangeEvent=function(e){r.emitValueChange(e)};this.onBlurEvent=function(e){r.hasFocus=false;if(r.focusedValue!==r.value){r.emitValueChange(e)}r.pdsBlur.emit(e)};this.onFocusEvent=function(e){r.hasFocus=true;r.focusedValue=r.value;r.pdsFocus.emit(e)};this.onCompositionStart=function(){r.isComposing=true};this.onCompositionEnd=function(){r.isComposing=false};this.autocomplete=undefined;this.componentId=undefined;this.debounce=undefined;this.disabled=undefined;this.errorMessage=undefined;this.helperMessage=undefined;this.invalid=undefined;this.label=undefined;this.name=undefined;this.placeholder=undefined;this.readonly=undefined;this.required=undefined;this.type="text";this.value="";this.hasFocus=false}e.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){if(this.nativeInput){this.nativeInput.focus()}return[2]}))}))};e.prototype.debounceChanged=function(){var e=this,i=e.pdsInput,n=e.debounce,r=e.originalPdsInput;this.pdsInput=n===undefined?r!==null&&r!==void 0?r:i:c(i,n)};e.prototype.valueChanged=function(){var e=this.nativeInput;var i=this.getValue();if(e&&e.value!==i&&!this.isComposing){e.value=i}};e.prototype.getValue=function(){return typeof this.value==="number"?this.value.toString():(this.value||"").toString()};e.prototype.emitValueChange=function(e){var i=this.value;var n=i==null?i:i.toString();this.focusedValue=n;this.pdsChange.emit({value:n,event:e})};e.prototype.emitInputChange=function(e){var i=this.value;var n=i==null?i:i.toString();this.pdsInput.emit({value:n,event:e})};e.prototype.componentWillLoad=function(){this.inheritedAttributes=Object.assign({},d(this.el))};e.prototype.componentDidLoad=function(){this.debounceChanged()};e.prototype.render=function(){var e=this;return r(t,{key:"4247c9ed871a2f5e39fea4c222367341eda18e32","aria-disabled":this.disabled?"true":null,"aria-readonly":this.readonly?"true":null},r("div",{key:"b49fb30682b34b2c20ed6b0959d66e18050088d0",class:"pds-input"},r("label",{key:"ac028db52deca16edd0663ccccdc01d3651a299a",htmlFor:this.componentId},this.label),r("input",Object.assign({key:"cf478f28743397013c0964aa3f6232de2a319f7a",class:"pds-input__field",ref:function(i){return e.nativeInput=i},"aria-describedby":a(this.componentId,this.invalid,this.helperMessage),"aria-invalid":this.invalid?"true":undefined,autocomplete:this.autocomplete,disabled:this.disabled,id:this.componentId,name:this.name,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,type:this.type,value:this.value,onInput:this.onInputEvent,onChange:this.onChangeEvent,onBlur:this.onBlurEvent,onFocus:this.onFocusEvent,onCompositionstart:this.onCompositionStart,onCompositionend:this.onCompositionEnd},this.inheritedAttributes)),this.helperMessage&&r("p",{key:"78180c0527fc6ef81d9e915898333a9e09e892e4",class:"pds-input__helper-message",id:s(this.componentId,"helper")},this.helperMessage),this.errorMessage&&r("p",{key:"9512deaecd57644da843557cd07ac8880cde424f",class:"pds-input__error-message",id:s(this.componentId,"error"),"aria-live":"assertive"},r("pds-icon",{key:"38c36403181b41c06f16e737f088e58199f07618",icon:l,size:"small"}),this.errorMessage)))};Object.defineProperty(e.prototype,"el",{get:function(){return o(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{debounce:["debounceChanged"],value:["valueChanged"]}},enumerable:false,configurable:true});return e}());m.style=p+(f+v)}}}));
|
|
2
|
-
//# sourceMappingURL=p-8c0a648d.system.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["pdsInputTokensCss","PdsInputStyle0","labelCss","PdsInputStyle1","pdsInputCss","PdsInputStyle2","PdsInput","exports","this","inheritedAttributes","isComposing","onInputEvent","ev","input","target","_this","value","emitInputChange","onChangeEvent","emitValueChange","onBlurEvent","hasFocus","focusedValue","pdsBlur","emit","onFocusEvent","pdsFocus","onCompositionStart","onCompositionEnd","class_1","prototype","setFocus","nativeInput","focus","debounceChanged","_a","pdsInput","debounce","originalPdsInput","undefined","debounceEvent","valueChanged","getValue","toString","event","newValue","pdsChange","componentWillLoad","Object","assign","inheritAriaAttributes","el","componentDidLoad","render","h","Host","key","disabled","readonly","class","htmlFor","componentId","label","ref","assignDescription","invalid","helperMessage","autocomplete","id","name","placeholder","readOnly","required","type","onInput","onChange","onBlur","onFocus","onCompositionstart","onCompositionend","messageId","errorMessage","icon","danger","size"],"sources":["src/components/pds-input/pds-input.tokens.scss?tag=pds-input&encapsulation=shadow","src/global/styles/utils/label.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.tsx"],"sourcesContent":["/**\n * Do not edit directly, this file was auto-generated.\n */\n\n:host {\n --pine-input-color-background-danger: var(--pine-color-red-050);\n}\n",":host {\n display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n label {\n color: var(--pine-color-text-label-readonly);\n }\n}\n\nlabel {\n color: var(--pine-color-text-label);\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n --box-shadow-focus-error: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);\n\n display: inline;\n}\n\n:host([aria-readonly=\"true\"]) {\n input {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-readonly);\n }\n}\n\n.pds-input {\n display: flex;\n flex-direction: column;\n}\n\nlabel {\n margin-block-end: var(--pine-dimension-xs);\n}\n\ninput {\n border: 1px solid var(--pine-color-border);\n border-radius: 10px;\n color: var(--pine-color-text-active);\n font: var(--pine-typography-body);\n letter-spacing: var(--pine-letter-spacing);\n padding: var(--pine-dimension-xs) var(--pine-dimension-sm);\n\n &:disabled {\n background-color: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n color: var(--pine-color-text-disabled);\n cursor: not-allowed;\n\n /* stylelint-disable */\n &::-webkit-input-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &:-ms-input-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n /* stylelint-enable */\n }\n\n &:hover {\n border-color: var(--pine-color-border-hover);\n }\n\n &:focus-visible {\n border-color: var(--pine-color-border-active);\n box-shadow: var(--box-shadow-focus);\n outline: none;\n }\n\n /* stylelint-disable */\n &::-webkit-input-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &:-ms-input-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &:has(~.pds-input__error-message) {\n\n background-color: var(--pine-input-color-background-danger);\n border-color: var(--pine-color-border-danger);\n\n &:focus-visible {\n box-shadow: var(--box-shadow-focus-error);\n outline: none;\n }\n }\n /* stylelint-enable */\n}\n\n.pds-input__error-message,\n.pds-input__helper-message {\n font: var(--pine-typography-body-sm-medium);\n margin-block-end: 0;\n margin-block-start: var(--pine-dimension-xs);\n}\n\n.pds-input__error-message {\n align-items: center;\n color: var(--pine-color-text-message-danger);\n display: flex;\n gap: var(--pine-dimension-2xs);\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { danger } from '@pine-ds/icons/icons';\n\nimport { debounceEvent } from '@utils/utils';\nimport { inheritAriaAttributes } from '@utils/attributes';\n\nimport type { Attributes } from '@utils/attributes';\nimport type { InputChangeEventDetail, InputInputEventDetail } from './input-interface';\n\n@Component({\n tag: 'pds-input',\n styleUrls: ['pds-input.tokens.scss', '../../global/styles/utils/label.scss', 'pds-input.scss'],\n shadow: true,\n})\nexport class PdsInput {\n private nativeInput?: HTMLInputElement;\n private inheritedAttributes: Attributes = {};\n private isComposing = false;\n /**\n * The value of the input when the input is focused.\n */\n private focusedValue?: string | number | null;\n\n private originalPdsInput?: EventEmitter<InputInputEventDetail>;\n\n @Element() el!: HTMLPdsInputElement;\n\n /**\n * Emitted when the input loses focus.\n */\n @Event() pdsBlur!: EventEmitter<FocusEvent>;\n\n /**\n *\n * Emitted when the value has changed.\n *\n * This event will not emit when programmatically setting the `value` property.\n */\n @Event() pdsChange!: EventEmitter<InputChangeEventDetail>;\n\n /**\n * Emitted when the input has focus.\n */\n @Event() pdsFocus!: EventEmitter<FocusEvent>;\n\n /**\n * Emitted when a keyboard input occurs.\n */\n @Event() pdsInput: EventEmitter<InputInputEventDetail>;\n\n /**\n * Sets focus on the native `input` in the `pds-input`. Use this method instead of the global\n * `input.focus()`.\n */\n @Method()\n async setFocus() {\n if ( this.nativeInput ) {\n this.nativeInput.focus();\n }\n }\n\n /**\n * Specifies if and how the browser provides `autocomplete` assistance for the field.\n */\n @Prop() autocomplete: string;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * Sets the number of milliseconds to wait before updating the value.\n */\n @Prop() debounce?: number;\n\n /**\n * Determines whether or not the input field is disabled.\n */\n @Prop() disabled?: boolean;\n\n /**\n * Specifies the error message and provides an error-themed treatment to the field.\n */\n @Prop() errorMessage?: string;\n\n /**\n * Displays a message or hint below the input field.\n */\n @Prop() helperMessage?: string;\n\n /**\n * Determines whether or not the input field is invalid or throws an error.\n */\n @Prop() invalid?: boolean;\n\n /**\n * Text to be displayed as the input label.\n */\n @Prop() label?: string;\n\n /**\n * Specifies the name. Submitted with the form name/value pair.\n */\n @Prop() name?: string;\n\n /**\n * Specifies a short hint that describes the expected value of the input field.\n */\n @Prop() placeholder?: string;\n\n /**\n * Determines whether or not the input field is readonly.\n */\n @Prop() readonly?: boolean;\n\n /**\n * Determines whether or not the input field is required.\n */\n @Prop() required?: boolean;\n\n /**\n * Determines the type of control that will be displayed\n * `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`\n * @defaultValue \"text\"\n */\n @Prop() type = 'text';\n\n /**\n * The value of the input.\n */\n @Prop({mutable: true}) value?: string | number | null = '';\n\n /**\n * Determines if the input has focus.\n */\n @State() hasFocus = false;\n\n\n @Watch('debounce')\n protected debounceChanged() {\n const { pdsInput, debounce, originalPdsInput } = this;\n\n /**\n * If debounce is undefined, we have to manually revert the pdsInput emitter in case\n * debounce used to be set to a number. Otherwise, the event would stay debounced.\n */\n this.pdsInput = debounce === undefined ? originalPdsInput ?? pdsInput : debounceEvent(pdsInput, debounce);\n }\n\n @Watch('value')\n protected valueChanged() {\n const nativeInput = this.nativeInput;\n const value = this.getValue();\n\n if (nativeInput && nativeInput.value !== value && !this.isComposing) {\n nativeInput.value = value;\n }\n }\n\n private getValue(): string {\n return typeof this.value === 'number' ? this.value.toString() : (this.value || '').toString();\n }\n\n private onInputEvent = (ev: Event) => {\n const input = ev.target as HTMLInputElement | null;\n if (input) {\n this.value = input.value || '';\n }\n this.emitInputChange(ev);\n };\n\n private onChangeEvent = (ev: Event) => {\n this.emitValueChange(ev);\n };\n\n private onBlurEvent = (ev: FocusEvent) => {\n this.hasFocus = false;\n\n if (this.focusedValue !== this.value) {\n /**\n * Emits the `pdsChange` event when the input value\n * is different than the value when the input was focused.\n */\n this.emitValueChange(ev);\n }\n\n this.pdsBlur.emit(ev);\n };\n\n private onFocusEvent = (ev: FocusEvent) => {\n this.hasFocus = true;\n this.focusedValue = this.value;\n\n this.pdsFocus.emit(ev);\n };\n\n private onCompositionStart = () => {\n this.isComposing = true;\n }\n\n private onCompositionEnd = () => {\n this.isComposing = false;\n }\n\n /**\n * Emits a pdsChange event\n */\n private emitValueChange(event?: Event) {\n const { value } = this;\n const newValue = value == null ? value : value.toString();\n\n this.focusedValue = newValue;\n this.pdsChange.emit({ value: newValue, event });\n }\n\n /**\n *\n * Emits a `pdsInput` event\n */\n private emitInputChange(event?: Event) {\n const { value } = this;\n\n // Checks for both null and undefined values\n const newValue = value == null ? value : value.toString();\n\n this.pdsInput.emit({ value: newValue, event });\n }\n\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n }\n }\n\n componentDidLoad() {\n this.debounceChanged();\n }\n\n render() {\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n aria-readonly={this.readonly ? 'true' : null}\n >\n <div class=\"pds-input\">\n <label htmlFor={this.componentId}>{this.label}</label>\n <input class=\"pds-input__field\"\n ref={(input) => this.nativeInput = input}\n aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n autocomplete={this.autocomplete}\n disabled={this.disabled}\n id={this.componentId}\n name={this.name}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n type={this.type}\n value={this.value}\n onInput={this.onInputEvent}\n onChange={this.onChangeEvent}\n onBlur={this.onBlurEvent}\n onFocus={this.onFocusEvent}\n onCompositionstart={this.onCompositionStart}\n onCompositionend={this.onCompositionEnd}\n {...this.inheritedAttributes}\n />\n {this.helperMessage &&\n <p\n class=\"pds-input__helper-message\"\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </p>\n }\n {this.errorMessage &&\n <p\n class=\"pds-input__error-message\"\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </p>\n }\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,c as i,h as o,H as s,g as t}from"./p-87fe352f.js";import{a as r,m as n}from"./p-47291f05.js";import{b as a}from"./p-d561168e.js";import{d}from"./p-46fb585d.js";import{i as l}from"./p-7905b8b8.js";const c=":host{--pine-input-color-background-danger:var(--pine-color-red-050)}";const p=c;const h=":host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}";const u=h;const b=":host{--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);display:inline}:host([aria-readonly=true]) input{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}.pds-input{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}label{-webkit-margin-after:var(--pine-dimension-xs);margin-block-end:var(--pine-dimension-xs)}input{border:1px solid var(--pine-color-border);border-radius:10px;color:var(--pine-color-text-active);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);padding:var(--pine-dimension-xs) var(--pine-dimension-sm);}input:disabled{background-color:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed;}input:disabled::-webkit-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}input:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}input:disabled::-moz-placeholder{color:var(--pine-color-text-placeholder-disabled)}input:disabled:-ms-input-placeholder{color:var(--pine-color-text-placeholder-disabled)}input:hover{border-color:var(--pine-color-border-hover)}input:focus-visible{border-color:var(--pine-color-border-active);-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}input::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}input::-moz-placeholder{color:var(--pine-color-text-placeholder)}input::-moz-placeholder{color:var(--pine-color-text-placeholder)}input:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}input:has(~.pds-input__error-message){background-color:var(--pine-input-color-background-danger);border-color:var(--pine-color-border-danger)}input:has(~.pds-input__error-message):focus-visible{-webkit-box-shadow:var(--box-shadow-focus-error);box-shadow:var(--box-shadow-focus-error);outline:none}.pds-input__error-message,.pds-input__helper-message{font:var(--pine-typography-body-sm-medium);-webkit-margin-after:0;margin-block-end:0;-webkit-margin-before:var(--pine-dimension-xs);margin-block-start:var(--pine-dimension-xs)}.pds-input__error-message{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}";const f=b;const v=class{constructor(o){e(this,o);this.pdsBlur=i(this,"pdsBlur",7);this.pdsChange=i(this,"pdsChange",7);this.pdsFocus=i(this,"pdsFocus",7);this.pdsInput=i(this,"pdsInput",7);this.inheritedAttributes={};this.isComposing=false;this.onInputEvent=e=>{const i=e.target;if(i){this.value=i.value||""}this.emitInputChange(e)};this.onChangeEvent=e=>{this.emitValueChange(e)};this.onBlurEvent=e=>{this.hasFocus=false;if(this.focusedValue!==this.value){this.emitValueChange(e)}this.pdsBlur.emit(e)};this.onFocusEvent=e=>{this.hasFocus=true;this.focusedValue=this.value;this.pdsFocus.emit(e)};this.onCompositionStart=()=>{this.isComposing=true};this.onCompositionEnd=()=>{this.isComposing=false};this.autocomplete=undefined;this.componentId=undefined;this.debounce=undefined;this.disabled=undefined;this.errorMessage=undefined;this.helperMessage=undefined;this.invalid=undefined;this.label=undefined;this.name=undefined;this.placeholder=undefined;this.readonly=undefined;this.required=undefined;this.type="text";this.value="";this.hasFocus=false}async setFocus(){if(this.nativeInput){this.nativeInput.focus()}}debounceChanged(){const{pdsInput:e,debounce:i,originalPdsInput:o}=this;this.pdsInput=i===undefined?o!==null&&o!==void 0?o:e:d(e,i)}valueChanged(){const e=this.nativeInput;const i=this.getValue();if(e&&e.value!==i&&!this.isComposing){e.value=i}}getValue(){return typeof this.value==="number"?this.value.toString():(this.value||"").toString()}emitValueChange(e){const{value:i}=this;const o=i==null?i:i.toString();this.focusedValue=o;this.pdsChange.emit({value:o,event:e})}emitInputChange(e){const{value:i}=this;const o=i==null?i:i.toString();this.pdsInput.emit({value:o,event:e})}componentWillLoad(){this.inheritedAttributes=Object.assign({},l(this.el))}componentDidLoad(){this.debounceChanged()}render(){return o(s,{key:"4247c9ed871a2f5e39fea4c222367341eda18e32","aria-disabled":this.disabled?"true":null,"aria-readonly":this.readonly?"true":null},o("div",{key:"b49fb30682b34b2c20ed6b0959d66e18050088d0",class:"pds-input"},o("label",{key:"ac028db52deca16edd0663ccccdc01d3651a299a",htmlFor:this.componentId},this.label),o("input",Object.assign({key:"cf478f28743397013c0964aa3f6232de2a319f7a",class:"pds-input__field",ref:e=>this.nativeInput=e,"aria-describedby":r(this.componentId,this.invalid,this.helperMessage),"aria-invalid":this.invalid?"true":undefined,autocomplete:this.autocomplete,disabled:this.disabled,id:this.componentId,name:this.name,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,type:this.type,value:this.value,onInput:this.onInputEvent,onChange:this.onChangeEvent,onBlur:this.onBlurEvent,onFocus:this.onFocusEvent,onCompositionstart:this.onCompositionStart,onCompositionend:this.onCompositionEnd},this.inheritedAttributes)),this.helperMessage&&o("p",{key:"78180c0527fc6ef81d9e915898333a9e09e892e4",class:"pds-input__helper-message",id:n(this.componentId,"helper")},this.helperMessage),this.errorMessage&&o("p",{key:"9512deaecd57644da843557cd07ac8880cde424f",class:"pds-input__error-message",id:n(this.componentId,"error"),"aria-live":"assertive"},o("pds-icon",{key:"38c36403181b41c06f16e737f088e58199f07618",icon:a,size:"small"}),this.errorMessage)))}get el(){return t(this)}static get watchers(){return{debounce:["debounceChanged"],value:["valueChanged"]}}};v.style=p+(u+f);export{v as pds_input};
|
|
2
|
-
//# sourceMappingURL=p-a22fd94e.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["pdsInputTokensCss","PdsInputStyle0","labelCss","PdsInputStyle1","pdsInputCss","PdsInputStyle2","PdsInput","this","inheritedAttributes","isComposing","onInputEvent","ev","input","target","value","emitInputChange","onChangeEvent","emitValueChange","onBlurEvent","hasFocus","focusedValue","pdsBlur","emit","onFocusEvent","pdsFocus","onCompositionStart","onCompositionEnd","setFocus","nativeInput","focus","debounceChanged","pdsInput","debounce","originalPdsInput","undefined","debounceEvent","valueChanged","getValue","toString","event","newValue","pdsChange","componentWillLoad","Object","assign","inheritAriaAttributes","el","componentDidLoad","render","h","Host","key","disabled","readonly","class","htmlFor","componentId","label","ref","assignDescription","invalid","helperMessage","autocomplete","id","name","placeholder","readOnly","required","type","onInput","onChange","onBlur","onFocus","onCompositionstart","onCompositionend","messageId","errorMessage","icon","danger","size"],"sources":["src/components/pds-input/pds-input.tokens.scss?tag=pds-input&encapsulation=shadow","src/global/styles/utils/label.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.tsx"],"sourcesContent":["/**\n * Do not edit directly, this file was auto-generated.\n */\n\n:host {\n --pine-input-color-background-danger: var(--pine-color-red-050);\n}\n",":host {\n display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n label {\n color: var(--pine-color-text-label-readonly);\n }\n}\n\nlabel {\n color: var(--pine-color-text-label);\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n --box-shadow-focus-error: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);\n\n display: inline;\n}\n\n:host([aria-readonly=\"true\"]) {\n input {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-readonly);\n }\n}\n\n.pds-input {\n display: flex;\n flex-direction: column;\n}\n\nlabel {\n margin-block-end: var(--pine-dimension-xs);\n}\n\ninput {\n border: 1px solid var(--pine-color-border);\n border-radius: 10px;\n color: var(--pine-color-text-active);\n font: var(--pine-typography-body);\n letter-spacing: var(--pine-letter-spacing);\n padding: var(--pine-dimension-xs) var(--pine-dimension-sm);\n\n &:disabled {\n background-color: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n color: var(--pine-color-text-disabled);\n cursor: not-allowed;\n\n /* stylelint-disable */\n &::-webkit-input-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &:-ms-input-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n /* stylelint-enable */\n }\n\n &:hover {\n border-color: var(--pine-color-border-hover);\n }\n\n &:focus-visible {\n border-color: var(--pine-color-border-active);\n box-shadow: var(--box-shadow-focus);\n outline: none;\n }\n\n /* stylelint-disable */\n &::-webkit-input-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &:-ms-input-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &:has(~.pds-input__error-message) {\n\n background-color: var(--pine-input-color-background-danger);\n border-color: var(--pine-color-border-danger);\n\n &:focus-visible {\n box-shadow: var(--box-shadow-focus-error);\n outline: none;\n }\n }\n /* stylelint-enable */\n}\n\n.pds-input__error-message,\n.pds-input__helper-message {\n font: var(--pine-typography-body-sm-medium);\n margin-block-end: 0;\n margin-block-start: var(--pine-dimension-xs);\n}\n\n.pds-input__error-message {\n align-items: center;\n color: var(--pine-color-text-message-danger);\n display: flex;\n gap: var(--pine-dimension-2xs);\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { danger } from '@pine-ds/icons/icons';\n\nimport { debounceEvent } from '@utils/utils';\nimport { inheritAriaAttributes } from '@utils/attributes';\n\nimport type { Attributes } from '@utils/attributes';\nimport type { InputChangeEventDetail, InputInputEventDetail } from './input-interface';\n\n@Component({\n tag: 'pds-input',\n styleUrls: ['pds-input.tokens.scss', '../../global/styles/utils/label.scss', 'pds-input.scss'],\n shadow: true,\n})\nexport class PdsInput {\n private nativeInput?: HTMLInputElement;\n private inheritedAttributes: Attributes = {};\n private isComposing = false;\n /**\n * The value of the input when the input is focused.\n */\n private focusedValue?: string | number | null;\n\n private originalPdsInput?: EventEmitter<InputInputEventDetail>;\n\n @Element() el!: HTMLPdsInputElement;\n\n /**\n * Emitted when the input loses focus.\n */\n @Event() pdsBlur!: EventEmitter<FocusEvent>;\n\n /**\n *\n * Emitted when the value has changed.\n *\n * This event will not emit when programmatically setting the `value` property.\n */\n @Event() pdsChange!: EventEmitter<InputChangeEventDetail>;\n\n /**\n * Emitted when the input has focus.\n */\n @Event() pdsFocus!: EventEmitter<FocusEvent>;\n\n /**\n * Emitted when a keyboard input occurs.\n */\n @Event() pdsInput: EventEmitter<InputInputEventDetail>;\n\n /**\n * Sets focus on the native `input` in the `pds-input`. Use this method instead of the global\n * `input.focus()`.\n */\n @Method()\n async setFocus() {\n if ( this.nativeInput ) {\n this.nativeInput.focus();\n }\n }\n\n /**\n * Specifies if and how the browser provides `autocomplete` assistance for the field.\n */\n @Prop() autocomplete: string;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * Sets the number of milliseconds to wait before updating the value.\n */\n @Prop() debounce?: number;\n\n /**\n * Determines whether or not the input field is disabled.\n */\n @Prop() disabled?: boolean;\n\n /**\n * Specifies the error message and provides an error-themed treatment to the field.\n */\n @Prop() errorMessage?: string;\n\n /**\n * Displays a message or hint below the input field.\n */\n @Prop() helperMessage?: string;\n\n /**\n * Determines whether or not the input field is invalid or throws an error.\n */\n @Prop() invalid?: boolean;\n\n /**\n * Text to be displayed as the input label.\n */\n @Prop() label?: string;\n\n /**\n * Specifies the name. Submitted with the form name/value pair.\n */\n @Prop() name?: string;\n\n /**\n * Specifies a short hint that describes the expected value of the input field.\n */\n @Prop() placeholder?: string;\n\n /**\n * Determines whether or not the input field is readonly.\n */\n @Prop() readonly?: boolean;\n\n /**\n * Determines whether or not the input field is required.\n */\n @Prop() required?: boolean;\n\n /**\n * Determines the type of control that will be displayed\n * `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`\n * @defaultValue \"text\"\n */\n @Prop() type = 'text';\n\n /**\n * The value of the input.\n */\n @Prop({mutable: true}) value?: string | number | null = '';\n\n /**\n * Determines if the input has focus.\n */\n @State() hasFocus = false;\n\n\n @Watch('debounce')\n protected debounceChanged() {\n const { pdsInput, debounce, originalPdsInput } = this;\n\n /**\n * If debounce is undefined, we have to manually revert the pdsInput emitter in case\n * debounce used to be set to a number. Otherwise, the event would stay debounced.\n */\n this.pdsInput = debounce === undefined ? originalPdsInput ?? pdsInput : debounceEvent(pdsInput, debounce);\n }\n\n @Watch('value')\n protected valueChanged() {\n const nativeInput = this.nativeInput;\n const value = this.getValue();\n\n if (nativeInput && nativeInput.value !== value && !this.isComposing) {\n nativeInput.value = value;\n }\n }\n\n private getValue(): string {\n return typeof this.value === 'number' ? this.value.toString() : (this.value || '').toString();\n }\n\n private onInputEvent = (ev: Event) => {\n const input = ev.target as HTMLInputElement | null;\n if (input) {\n this.value = input.value || '';\n }\n this.emitInputChange(ev);\n };\n\n private onChangeEvent = (ev: Event) => {\n this.emitValueChange(ev);\n };\n\n private onBlurEvent = (ev: FocusEvent) => {\n this.hasFocus = false;\n\n if (this.focusedValue !== this.value) {\n /**\n * Emits the `pdsChange` event when the input value\n * is different than the value when the input was focused.\n */\n this.emitValueChange(ev);\n }\n\n this.pdsBlur.emit(ev);\n };\n\n private onFocusEvent = (ev: FocusEvent) => {\n this.hasFocus = true;\n this.focusedValue = this.value;\n\n this.pdsFocus.emit(ev);\n };\n\n private onCompositionStart = () => {\n this.isComposing = true;\n }\n\n private onCompositionEnd = () => {\n this.isComposing = false;\n }\n\n /**\n * Emits a pdsChange event\n */\n private emitValueChange(event?: Event) {\n const { value } = this;\n const newValue = value == null ? value : value.toString();\n\n this.focusedValue = newValue;\n this.pdsChange.emit({ value: newValue, event });\n }\n\n /**\n *\n * Emits a `pdsInput` event\n */\n private emitInputChange(event?: Event) {\n const { value } = this;\n\n // Checks for both null and undefined values\n const newValue = value == null ? value : value.toString();\n\n this.pdsInput.emit({ value: newValue, event });\n }\n\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n }\n }\n\n componentDidLoad() {\n this.debounceChanged();\n }\n\n render() {\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n aria-readonly={this.readonly ? 'true' : null}\n >\n <div class=\"pds-input\">\n <label htmlFor={this.componentId}>{this.label}</label>\n <input class=\"pds-input__field\"\n ref={(input) => this.nativeInput = input}\n aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n autocomplete={this.autocomplete}\n disabled={this.disabled}\n id={this.componentId}\n name={this.name}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n type={this.type}\n value={this.value}\n onInput={this.onInputEvent}\n onChange={this.onChangeEvent}\n onBlur={this.onBlurEvent}\n onFocus={this.onFocusEvent}\n onCompositionstart={this.onCompositionStart}\n onCompositionend={this.onCompositionEnd}\n {...this.inheritedAttributes}\n />\n {this.helperMessage &&\n <p\n class=\"pds-input__helper-message\"\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </p>\n }\n {this.errorMessage &&\n <p\n class=\"pds-input__error-message\"\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </p>\n }\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["pdsBoxCss","PdsBoxStyle0","PdsBox","exports","class_1","prototype","render","boxClasses","concat","this","alignItems","undefined","trim","auto","border","borderRadius","direction","display","fit","gap","flex","justifyContent","offset","offsetXs","offsetSm","offsetMd","offsetLg","offsetXl","padding","shadow","size","sizeXs","sizeSm","sizeMd","sizeLg","sizeXl","boxInlineStyles","Object","assign","backgroundColor","borderColor","minHeight","minWidth","h","Host","key","class","style"],"sources":["src/components/pds-box/pds-box.scss?tag=pds-box","src/components/pds-box/pds-box.tsx"],"sourcesContent":["@import './pds-box.mixins';\n\npds-box {\n --border-width-default: var(--pine-border-width-thin);\n --color-background-box: inherit;\n --color-border-box: inherit;\n\n display: block;\n}\n\n[class*='pds-box'] {\n background-color: var(--color-background-box);\n box-sizing: border-box;\n display: inline-flex;\n min-width: var(--pine-dimension-none);\n\n // The immediate child of the row will fit the width of the row\n .pds-row > & {\n position: relative;\n width: 100%;\n\n &.pds-box--auto {\n width: auto;\n }\n }\n}\n\n// Spacing mixin\n$pine-spacing-tokens: (\n xxs: 4px,\n xs: 8px,\n sm: 16px,\n md: 24px,\n lg: 36px,\n xl: 48px,\n xxl: 64px,\n);\n\n// Generate spacing classes\n@include generate-spacing-classes(false, $pine-spacing-tokens);\n@include generate-spacing-classes('top', $pine-spacing-tokens);\n@include generate-spacing-classes('right', $pine-spacing-tokens);\n@include generate-spacing-classes('left', $pine-spacing-tokens);\n@include generate-spacing-classes('bottom', $pine-spacing-tokens);\n\n// Base offset classes\n@include generate-column-offsets(false, 12);\n\n// Responsive offset classes\n@media (max-width: 575px) {\n @include generate-column-offsets('xs', 12);\n}\n\n@media (min-width: 576px) {\n @include generate-column-offsets('sm', 12);\n}\n\n@media (min-width: 768px) {\n @include generate-column-offsets('md', 12);\n}\n\n@media (min-width: 992px) {\n @include generate-column-offsets('lg', 12);\n}\n\n@media (min-width: 1200px) {\n @include generate-column-offsets('xl', 12);\n}\n\n\n// Base column width classes\n@include generate-columns(false, 12);\n\n// Responsive column width classes\n@media (max-width: 575px) {\n @include generate-columns('xs', 12);\n}\n\n@media (min-width: 576px) {\n @include generate-columns('sm', 12);\n}\n\n@media (min-width: 768px) {\n @include generate-columns('md', 12);\n}\n\n@media (min-width: 992px) {\n @include generate-columns('lg', 12);\n}\n\n@media (min-width: 1200px) {\n @include generate-columns('xl', 12);\n}\n\n.pds-box {\n flex-basis: 0;\n flex-grow: 1;\n}\n\n.pds-box--auto {\n flex: 0 0 var(--pine-dimension-none, fit-content);\n min-width: auto;\n width: auto;\n}\n\n.pds-box--fit {\n max-width: 100%;\n min-width: 100%;\n width: 100%;\n}\n\n.pds-box--border {\n border-color: var(--color-border-box, var(--pine-color-grey-300));\n border-style: solid;\n border-width: var(--border-width-default);\n}\n\n// Display helpers\n.pds-box--display-flex {\n display: flex;\n}\n\n.pds-box--display-inline-flex {\n display: inline-flex;\n}\n\n.pds-box--display-block {\n display: block;\n}\n\n.pds-box--display-inline-block {\n display: inline-block;\n}\n\n// Flex helpers\n.pds-box--flex-none {\n flex: 0 0 auto;\n}\n\n.pds-box--flex-grow {\n flex: 1 1 auto\n}\n\n.pds-box--flex-shrink {\n flex: 0 0 auto;\n}\n\n// Border radius helpers\n.pds-border-radius-none {\n border-radius: 0;\n}\n\n.pds-border-radius-xs {\n border-radius: var(--pine-dimension-050);\n}\n\n.pds-border-radius-sm {\n border-radius: var(--pine-dimension-075);\n}\n\n.pds-border-radius-md {\n border-radius: var(--pine-dimension-100);\n}\n\n.pds-border-radius-lg {\n border-radius: var(--pine-dimension-200);\n}\n\n.pds-border-radius-circle {\n border-radius: 50%;\n}\n\n// Box shadow helpers\n.pds-shadow-050 {\n box-shadow: var(--pine-box-shadow-050);\n}\n\n.pds-shadow-100 {\n box-shadow: var(--pine-box-shadow-100);\n}\n\n.pds-shadow-150 {\n box-shadow: var(--pine-box-shadow-150);\n}\n\n.pds-shadow-200 {\n box-shadow: var(--pine-box-shadow-200);\n}\n\n.pds-shadow-300 {\n box-shadow: var(--pine-box-shadow-300);\n}\n\n.pds-shadow-400 {\n box-shadow: var(--pine-box-shadow-400);\n}\n\n.pds-shadow-500 {\n box-shadow: var(--pine-box-shadow-500);\n}\n\n\n.pds-shadow-xs {\n box-shadow: var(--pine-box-shadow-050);\n}\n\n.pds-shadow-sm {\n box-shadow: var(--pine-box-shadow-100);\n}\n\n.pds-shadow-md {\n box-shadow: var(--pine-box-shadow-150);\n}\n\n.pds-shadow-lg {\n box-shadow: var(--pine-box-shadow-200);\n}\n\n// Gap helpers\n.pds-box-gap-none {\n gap: 0;\n}\n\n.pds-box-gap-xxs {\n gap: var(--pine-dimension-2xs);\n}\n\n.pds-box-gap-xs {\n gap: var(--pine-dimension-xs);\n}\n\n.pds-box-gap-sm {\n gap: var(--pine-dimension-sm);\n}\n\n.pds-box-gap-md {\n gap: var(--pine-dimension-md);\n}\n\n.pds-box-gap-lg {\n gap: var(--pine-dimension-lg);\n}\n\n.pds-box-gap-xl {\n gap: var(--pine-dimension-xl);\n}\n\n.pds-box-gap-xxl {\n gap: var(--pine-dimension-xxl);\n}\n\n// Spacing helpers\n.pds-padding-none {\n padding: 0;\n}\n\n.pds-padding-xxs {\n padding: var(--pine-dimension-2xs);\n}\n\n.pds-padding-xs {\n padding: var(--pine-dimension-2xs);\n}\n\n.pds-padding-sm {\n padding: var(--pine-dimension-sm);\n}\n\n.pds-padding-md {\n padding: var(--pine-dimension-md);\n}\n\n.pds-padding-lg {\n padding: var(--pine-dimension-lg);\n}\n\n.pds-padding-xl {\n padding: var(--pine-dimension-xl);\n}\n\n.pds-padding-xxl {\n padding: var(--pine-dimension-xxl);\n}\n\n// Display helpers\n.pds-box-display-flex {\n display: flex;\n}\n\n.pds-box-display-inline-flex {\n display: inline-flex;\n}\n\n// Flex Direction helpers\n.pds-box-direction-row {\n flex-direction: row;\n}\n\n.pds-box-direction-column {\n flex-direction: column;\n}\n\n// Justify Content helpers\n.pds-justify-content-start {\n justify-content: start;\n}\n\n.pds-justify-content-center {\n justify-content: center;\n}\n\n.pds-justify-content-end {\n justify-content: end;\n}\n\n.pds-justify-content-space-between {\n justify-content: space-between;\n}\n\n.pds-justify-content-space-around {\n justify-content: space-around;\n}\n\n.pds-justify-content-space-evenly {\n justify-content: space-evenly;\n}\n\n// Align Items helpers\n.pds-align-items-start {\n align-items: start;\n}\n\n.pds-align-items-center {\n align-items: center;\n}\n\n.pds-align-items-end {\n align-items: end;\n}\n\n.pds-align-items-stretch {\n align-items: stretch;\n}\n\n.pds-align-items-baseline {\n align-items: baseline;\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\nimport { BoxColumnType, BoxTShirtSizeType, BoxShadowSizeType } from '../../utils/types';\n\n@Component({\n tag: 'pds-box',\n styleUrl: 'pds-box.scss',\n})\nexport class PdsBox {\n /**\n * Defines the vertical alignment of the box items.\n * @defaultValue start\n */\n @Prop() alignItems?: `start` | `center` | `end` | `baseline` | `stretch`;\n\n /**\n * If `true`, the box will be sized to fit its contents.\n */\n @Prop() auto?: boolean;\n\n /**\n * Defines the background-color of the box.\n */\n @Prop() backgroundColor?: string;\n\n /**\n * If `true`, the box will have a border.\n */\n @Prop() border? = false;\n\n /**\n * Defines the border color of the box.\n */\n @Prop() borderColor?: string;\n\n /**\n * Defines how rounded the box corners are.\n * @defaultValue none\n */\n @Prop() borderRadius?: `none` | `xs`| `sm` | `md` | `lg` | `circle`;\n\n /**\n * Defines the orientation of the box items.\n * @defaultValue row\n */\n @Prop() direction?: `row` | `column`;\n\n /**\n * Defines the display style of the box.\n * @defaultValue flex\n */\n @Prop() display?: `flex` | `inline-flex` | `block` | `inline-block`;\n\n /**\n * If `true`, sets the box `max-width` to `100%`.\n */\n @Prop() fit?: boolean;\n\n /**\n * Defines the spacing between the box items.\n * @defaultValue none\n */\n @Prop() gap?: BoxTShirtSizeType;\n\n /**\n * Defines how a box will grow or shrink to fit the space available in its container.\n * @defaultValue none\n */\n @Prop() flex?: `none` | `grow` | `shrink`;\n\n /**\n * Defines the horizontal alignment of the box items.\n * @defaultValue start\n */\n @Prop() justifyContent?: `start` | `center` | `end` | `space-between` | `space-around`;\n\n /**\n * The minimum height of the row. Used in conjunction with alignment props\n */\n @Prop() minHeight?: string;\n\n /**\n * The minimum width of the row. Used in conjunction with alignment props\n */\n @Prop() minWidth?: string;\n\n /**\n * Move columns to the end direction of the row for all screen sizes. Increases the starting margin of a column by specified number of columns.\n */\n @Prop() offset?: BoxColumnType;\n\n /**\n * Move columns to the end direction of the row for `XS` screen sizes. Increases the starting margin of a column by specified number of columns.\n */\n @Prop() offsetXs?: BoxColumnType;\n\n /**\n * Move columns to the end direction of the row for `SM` screen sizes. Increases the starting margin of a column by specified number of columns.\n */\n @Prop() offsetSm?: BoxColumnType;\n\n /**\n * Move columns to the end direction of the row for `MD` screen sizes. Increases the starting margin of a column by specified number of columns.\n */\n @Prop() offsetMd?: BoxColumnType;\n\n /**\n * Move columns to the end direction of the row for `LG` screen sizes. Increases the starting margin of a column by specified number of columns.\n */\n @Prop() offsetLg?: BoxColumnType;\n\n /**\n * Move columns to the end direction of the row for `XL` screen sizes. Increases the starting margin of a column by specified number of columns.\n */\n @Prop() offsetXl?: BoxColumnType;\n\n /**\n * Defines the spacing between the box items.\n * @defaultValue none\n */\n @Prop() padding?: BoxTShirtSizeType;\n\n /**\n * Defines the box shadow.\n * @defaultValue none\n */\n @Prop() shadow?: BoxShadowSizeType;\n\n /**\n * Size of the column for all screen sizes that are not explicitly set.\n */\n @Prop() size?: BoxColumnType;\n\n /**\n * At screen sizes less than the `XS` breakpoint, this will take the number of columns specified.\n */\n @Prop() sizeXs?: BoxColumnType;\n\n /**\n * At screen sizes greater than the `SM` breakpoint, this will take the number of columns specified.\n */\n @Prop() sizeSm?: BoxColumnType;\n\n /**\n * At screen sizes greater than the `MD` breakpoint, this will take the number of columns specified.\n */\n @Prop() sizeMd?: BoxColumnType;\n\n /**\n * At screen sizes greater than the `LG` breakpoint, this will take the number of columns specified.\n */\n @Prop() sizeLg?: BoxColumnType;\n\n /**\n * At screen sizes greater than the `XL` breakpoint, this will take the number of columns specified.\n */\n @Prop() sizeXl?: BoxColumnType;\n\n render() {\n const boxClasses = `\n ${this.alignItems !== undefined && this.alignItems.trim() !== '' ? `pds-align-items-${this.alignItems}` : ''}\n ${this.auto ? 'pds-box--auto' : ''}\n ${this.border ? 'pds-box--border' : ''}\n ${this.borderRadius !== undefined && this.borderRadius.trim() !== '' ? `pds-border-radius-${this.borderRadius}` : ''}\n ${this.direction !== undefined && this.direction.trim() !== '' ? `pds-box-direction-${this.direction}` : ''}\n ${this.display !== undefined && this.display.trim() !== '' ? `pds-box--display-${this.display}` : ''}\n ${this.fit ? 'pds-box--fit' : ''}\n ${this.gap !== undefined && this.gap.trim() !== '' ? `pds-box-gap-${this.gap}` : ''}\n ${this.flex !== undefined && this.flex.trim() !== '' ? `pds-box--flex-${this.flex}` : ''}\n ${this.justifyContent !== undefined && this.justifyContent.trim() !== '' ? `pds-justify-content-${this.justifyContent}` : ''}\n ${this.offset !== undefined && this.offset.trim() !== '' ? `pds-box-offset-${this.offset}` : ''}\n ${this.offsetXs !== undefined && this.offsetXs.trim() !== '' ? `pds-box-offset-xs-${this.offsetXs}` : ''}\n ${this.offsetSm !== undefined && this.offsetSm.trim() !== '' ? `pds-box-offset-sm-${this.offsetSm}` : ''}\n ${this.offsetMd !== undefined && this.offsetMd.trim() !== '' ? `pds-box-offset-md-${this.offsetMd}` : ''}\n ${this.offsetLg !== undefined && this.offsetLg.trim() !== '' ? `pds-box-offset-lg-${this.offsetLg}` : ''}\n ${this.offsetXl !== undefined && this.offsetXl.trim() !== '' ? `pds-box-offset-xl-${this.offsetXl}` : ''}\n ${this.padding !== undefined && this.padding.trim() !== '' ? `pds-padding-${this.padding}` : ''}\n ${this.shadow !== undefined && this.shadow.trim() !== '' ? `pds-shadow-${this.shadow}` : ''}\n ${this.size !== undefined && this.size.trim() !== '' ? `pds-box pds-box-${this.size}` : ''}\n ${this.sizeXs !== undefined && this.sizeXs.trim() !== '' ? `pds-box-xs-${this.sizeXs}` : ''}\n ${this.sizeSm !== undefined && this.sizeSm.trim() !== '' ? `pds-box-sm-${this.sizeSm}` : ''}\n ${this.sizeMd !== undefined && this.sizeMd.trim() !== '' ? `pds-box-md-${this.sizeMd}` : ''}\n ${this.sizeLg !== undefined && this.sizeLg.trim() !== '' ? `pds-box-lg-${this.sizeLg}` : ''}\n ${this.sizeXl !== undefined && this.sizeXl.trim() !== '' ? `pds-box-xl-${this.sizeXl}` : ''}\n ${this.size == undefined &&\n this.sizeSm == undefined &&\n this.sizeMd == undefined &&\n this.sizeLg == undefined &&\n this.sizeXl == undefined ? 'pds-box' : ''}\n `;\n\n const boxInlineStyles = {\n ...(this.backgroundColor && { '--color-background-box': this.backgroundColor }),\n ...(this.borderColor && { '--color-border-box': this.borderColor }),\n ...(this.minHeight && { '--sizing-min-height-box': this.minHeight }),\n ...(this.minWidth && { '--sizing-min-height-box': this.minWidth }),\n };\n\n return (\n <Host class={boxClasses} style={boxInlineStyles}>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|