@pine-ds/core 3.0.3 → 3.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/index2.js +1 -1
- package/components/index2.js.map +1 -1
- package/components/pds-button2.js +31 -5
- package/components/pds-button2.js.map +1 -1
- package/components/pds-checkbox2.js +9 -3
- package/components/pds-checkbox2.js.map +1 -1
- package/components/pds-copytext.js +1 -1
- package/components/pds-copytext.js.map +1 -1
- package/components/pds-icon2.js +103 -7
- package/components/pds-icon2.js.map +1 -1
- package/components/pds-link.js +1 -1
- package/components/pds-link.js.map +1 -1
- package/components/pds-switch.js +8 -3
- package/components/pds-switch.js.map +1 -1
- package/dist/cjs/{index-Br1YlNK2.js → index-CG2Rr2io.js} +3 -3
- package/dist/cjs/index-CG2Rr2io.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-button.cjs.entry.js +32 -6
- package/dist/cjs/pds-button.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-button.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-checkbox.cjs.entry.js +10 -4
- package/dist/cjs/pds-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-checkbox.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-chip.cjs.entry.js +1 -1
- package/dist/cjs/pds-copytext.cjs.entry.js +2 -2
- package/dist/cjs/pds-copytext.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-copytext.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-icon.cjs.entry.js +102 -7
- package/dist/cjs/pds-icon.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-icon.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-input.cjs.entry.js +1 -1
- package/dist/cjs/pds-link.cjs.entry.js +2 -2
- package/dist/cjs/pds-link.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-link.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-radio.cjs.entry.js +1 -1
- package/dist/cjs/pds-select.cjs.entry.js +1 -1
- package/dist/cjs/pds-sortable-item.cjs.entry.js +1 -1
- package/dist/cjs/pds-switch.cjs.entry.js +9 -4
- package/dist/cjs/pds-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-switch.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-table-head-cell.cjs.entry.js +1 -1
- package/dist/cjs/pds-textarea.cjs.entry.js +1 -1
- package/dist/cjs/pine-core.cjs.js +1 -1
- package/dist/collection/components/pds-button/pds-button.css +7 -11
- package/dist/collection/components/pds-button/pds-button.js +37 -5
- package/dist/collection/components/pds-button/pds-button.js.map +1 -1
- package/dist/collection/components/pds-button/stories/pds-button.stories.js +46 -11
- package/dist/collection/components/pds-checkbox/pds-checkbox.js +9 -3
- package/dist/collection/components/pds-checkbox/pds-checkbox.js.map +1 -1
- package/dist/collection/components/pds-copytext/pds-copytext.css +1 -1
- package/dist/collection/components/pds-icon/stories/pds-icon.stories.js +1 -1
- package/dist/collection/components/pds-link/pds-link.css +3 -8
- package/dist/collection/components/pds-popover/stories/pds-popover.stories.js +4 -5
- package/dist/collection/components/pds-switch/pds-switch.js +8 -3
- package/dist/collection/components/pds-switch/pds-switch.js.map +1 -1
- package/dist/docs.json +33 -3
- package/dist/esm/{index-mVZRKoXd.js → index-_4gljHh-.js} +3 -3
- package/dist/esm/index-_4gljHh-.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-button.entry.js +32 -6
- package/dist/esm/pds-button.entry.js.map +1 -1
- package/dist/esm/pds-checkbox.entry.js +11 -5
- package/dist/esm/pds-checkbox.entry.js.map +1 -1
- package/dist/esm/pds-chip.entry.js +1 -1
- package/dist/esm/pds-copytext.entry.js +2 -2
- package/dist/esm/pds-copytext.entry.js.map +1 -1
- package/dist/esm/pds-icon.entry.js +102 -7
- package/dist/esm/pds-icon.entry.js.map +1 -1
- package/dist/esm/pds-input.entry.js +1 -1
- package/dist/esm/pds-link.entry.js +2 -2
- package/dist/esm/pds-link.entry.js.map +1 -1
- package/dist/esm/pds-radio.entry.js +1 -1
- package/dist/esm/pds-select.entry.js +1 -1
- package/dist/esm/pds-sortable-item.entry.js +1 -1
- package/dist/esm/pds-switch.entry.js +9 -4
- package/dist/esm/pds-switch.entry.js.map +1 -1
- package/dist/esm/pds-table-head-cell.entry.js +1 -1
- package/dist/esm/pds-textarea.entry.js +1 -1
- package/dist/esm/pine-core.js +1 -1
- package/dist/esm-es5/{index-mVZRKoXd.js → index-_4gljHh-.js} +1 -1
- package/dist/esm-es5/index-_4gljHh-.js.map +1 -0
- package/dist/esm-es5/loader.js +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-button.entry.js +1 -1
- package/dist/esm-es5/pds-button.entry.js.map +1 -1
- package/dist/esm-es5/pds-checkbox.entry.js +1 -1
- package/dist/esm-es5/pds-checkbox.entry.js.map +1 -1
- package/dist/esm-es5/pds-chip.entry.js +1 -1
- package/dist/esm-es5/pds-copytext.entry.js +1 -1
- package/dist/esm-es5/pds-copytext.entry.js.map +1 -1
- package/dist/esm-es5/pds-icon.entry.js +1 -1
- package/dist/esm-es5/pds-icon.entry.js.map +1 -1
- package/dist/esm-es5/pds-input.entry.js +1 -1
- package/dist/esm-es5/pds-link.entry.js +1 -1
- package/dist/esm-es5/pds-link.entry.js.map +1 -1
- package/dist/esm-es5/pds-radio.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-switch.entry.js +1 -1
- package/dist/esm-es5/pds-switch.entry.js.map +1 -1
- package/dist/esm-es5/pds-table-head-cell.entry.js +1 -1
- package/dist/esm-es5/pds-textarea.entry.js +1 -1
- package/dist/esm-es5/pine-core.js +1 -1
- package/dist/pine-core/p-103b62a1.system.entry.js +2 -0
- package/dist/pine-core/p-103b62a1.system.entry.js.map +1 -0
- package/dist/pine-core/{p-5db706e1.entry.js → p-1b81a8ec.entry.js} +2 -2
- package/dist/pine-core/p-38246e2f.entry.js +2 -0
- package/dist/pine-core/p-38246e2f.entry.js.map +1 -0
- package/dist/pine-core/{p-ad69e5f9.system.entry.js → p-38d2498e.system.entry.js} +2 -2
- package/dist/pine-core/p-3ce8eb9f.entry.js +2 -0
- package/dist/pine-core/p-3ce8eb9f.entry.js.map +1 -0
- package/dist/pine-core/p-3e91dccd.entry.js +2 -0
- package/dist/pine-core/p-3e91dccd.entry.js.map +1 -0
- package/dist/pine-core/{p-9e9d3a2b.entry.js → p-4ccd2d5e.entry.js} +2 -2
- package/dist/pine-core/{p-dae339c3.entry.js → p-4e7ca704.entry.js} +2 -2
- package/dist/pine-core/{p-b9f99fc9.entry.js → p-4ff0838c.entry.js} +2 -2
- package/dist/pine-core/p-5763df39.system.entry.js +2 -0
- package/dist/pine-core/p-5763df39.system.entry.js.map +1 -0
- package/dist/pine-core/{p-820faa91.system.entry.js → p-596e0292.system.entry.js} +2 -2
- package/dist/pine-core/p-5acda4ac.system.entry.js +2 -0
- package/dist/pine-core/p-5acda4ac.system.entry.js.map +1 -0
- package/dist/pine-core/{p-040f3c92.system.entry.js → p-6260135d.system.entry.js} +2 -2
- package/dist/pine-core/{p-14ca569b.entry.js → p-6a716bff.entry.js} +2 -2
- package/dist/pine-core/{p-a5587332.entry.js → p-6ad460a7.entry.js} +2 -2
- package/dist/pine-core/p-6ad460a7.entry.js.map +1 -0
- package/dist/pine-core/p-82151ac5.entry.js +2 -0
- package/dist/pine-core/p-82151ac5.entry.js.map +1 -0
- package/dist/pine-core/{p-b2bbc362.entry.js → p-82e05dcf.entry.js} +2 -2
- package/dist/pine-core/{p-91dadcbe.entry.js → p-8337c77c.entry.js} +2 -2
- package/dist/pine-core/{p-qXPbJ8Ls.system.js.map → p-9niWVsdd.system.js.map} +1 -1
- package/dist/pine-core/{p-Bd19LaTb.system.js → p-B4W0_y2p.system.js} +1 -1
- package/dist/pine-core/p-B4W0_y2p.system.js.map +1 -0
- package/dist/pine-core/p-BJyPFOn0.system.js.map +1 -0
- package/dist/pine-core/p-BsL2GDnH.system.js +1 -1
- package/dist/pine-core/{p-DhYEBuMP.system.js.map → p-Bu94kuQa.system.js.map} +1 -1
- package/dist/pine-core/p-C3ud771n.system.js.map +1 -0
- package/dist/pine-core/{p-C0hVtnK2.system.js.map → p-Cg0JSYH5.system.js.map} +1 -1
- package/dist/pine-core/p-CnoLHUtr.system.js.map +1 -0
- package/dist/pine-core/{p-Dlv6r83m.system.js.map → p-Cz3zRtiB.system.js.map} +1 -1
- package/dist/pine-core/{p-BUZBNCHp.system.js.map → p-D8WAvG2e.system.js.map} +1 -1
- package/dist/pine-core/{p-DY5LpFEG.system.js.map → p-DEsea81X.system.js.map} +1 -1
- package/dist/pine-core/{p-CFcYB49C.system.js.map → p-DFmUOrRG.system.js.map} +1 -1
- package/dist/pine-core/p-DkJgkLjR.system.js.map +1 -0
- package/dist/pine-core/p-Dv_jWtcr.system.js.map +1 -0
- package/dist/pine-core/{p-BYgoXBct.system.js.map → p-Dz6toWDZ.system.js.map} +1 -1
- package/dist/pine-core/p-IK9NvSRG.system.js.map +1 -0
- package/dist/pine-core/{p-CLIVqKy5.system.js.map → p-YuC61pNM.system.js.map} +1 -1
- package/dist/pine-core/{p-mVZRKoXd.js → p-_4gljHh-.js} +1 -1
- package/dist/pine-core/p-_4gljHh-.js.map +1 -0
- package/dist/pine-core/{p-2ab26d3d.system.entry.js → p-a952d40c.system.entry.js} +2 -2
- package/dist/pine-core/p-b390c427.entry.js +2 -0
- package/dist/pine-core/p-b390c427.entry.js.map +1 -0
- package/dist/pine-core/{p-d0780ca1.system.entry.js → p-c7d4f436.system.entry.js} +2 -2
- package/dist/pine-core/{p-3fdbda99.system.entry.js → p-c838b6ef.system.entry.js} +2 -2
- package/dist/pine-core/{p-42f1190a.system.entry.js → p-ca09f86a.system.entry.js} +2 -2
- package/dist/pine-core/{p-1995a0f8.system.entry.js → p-ceb48b05.system.entry.js} +2 -2
- package/dist/pine-core/p-d3ab594c.system.entry.js +2 -0
- package/dist/pine-core/p-d3ab594c.system.entry.js.map +1 -0
- package/dist/pine-core/p-d78bec50.system.entry.js +2 -0
- package/dist/pine-core/p-d78bec50.system.entry.js.map +1 -0
- package/dist/pine-core/{p-e4ea5041.system.entry.js → p-d8e02aa9.system.entry.js} +2 -2
- package/dist/pine-core/{p-abcce8af.entry.js → p-e88d58f4.entry.js} +2 -2
- package/dist/pine-core/{p-bedddd53.entry.js → p-f94703c9.entry.js} +2 -2
- package/dist/pine-core/{p-6c21bcb0.system.entry.js → p-fd9aa739.system.entry.js} +2 -2
- package/dist/pine-core/p-fd9aa739.system.entry.js.map +1 -0
- package/dist/pine-core/pds-button.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-checkbox.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-copytext.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-icon.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-link.entry.esm.js.map +1 -1
- package/dist/pine-core/pds-switch.entry.esm.js.map +1 -1
- package/dist/pine-core/pine-core.esm.js +1 -1
- package/dist/types/components/pds-button/pds-button.d.ts +8 -1
- package/dist/types/components/pds-checkbox/pds-checkbox.d.ts +3 -0
- package/dist/types/components/pds-switch/pds-switch.d.ts +2 -0
- package/dist/types/components.d.ts +4 -2
- package/hydrate/index.js +238 -105
- package/hydrate/index.mjs +238 -105
- package/package.json +2 -2
- package/dist/cjs/index-Br1YlNK2.js.map +0 -1
- package/dist/esm/index-mVZRKoXd.js.map +0 -1
- package/dist/esm-es5/index-mVZRKoXd.js.map +0 -1
- package/dist/pine-core/p-012c4d8b.entry.js +0 -2
- package/dist/pine-core/p-012c4d8b.entry.js.map +0 -1
- package/dist/pine-core/p-3be0323a.system.entry.js +0 -2
- package/dist/pine-core/p-3be0323a.system.entry.js.map +0 -1
- package/dist/pine-core/p-545ccff7.system.entry.js +0 -2
- package/dist/pine-core/p-545ccff7.system.entry.js.map +0 -1
- package/dist/pine-core/p-5c9e1a3d.system.entry.js +0 -2
- package/dist/pine-core/p-5c9e1a3d.system.entry.js.map +0 -1
- package/dist/pine-core/p-6c21bcb0.system.entry.js.map +0 -1
- package/dist/pine-core/p-722989ee.entry.js +0 -2
- package/dist/pine-core/p-722989ee.entry.js.map +0 -1
- package/dist/pine-core/p-768e754e.system.entry.js +0 -2
- package/dist/pine-core/p-768e754e.system.entry.js.map +0 -1
- package/dist/pine-core/p-BBpt-9kK.system.js.map +0 -1
- package/dist/pine-core/p-BUD-iaLL.system.js.map +0 -1
- package/dist/pine-core/p-Bd19LaTb.system.js.map +0 -1
- package/dist/pine-core/p-CIzJqNxZ.system.js.map +0 -1
- package/dist/pine-core/p-CbNKHcsJ.system.js.map +0 -1
- package/dist/pine-core/p-Chrs_Qxi.system.js.map +0 -1
- package/dist/pine-core/p-a5587332.entry.js.map +0 -1
- package/dist/pine-core/p-aa955b03.entry.js +0 -2
- package/dist/pine-core/p-aa955b03.entry.js.map +0 -1
- package/dist/pine-core/p-amsdFwC6.system.js.map +0 -1
- package/dist/pine-core/p-b41dee6f.system.entry.js +0 -2
- package/dist/pine-core/p-b41dee6f.system.entry.js.map +0 -1
- package/dist/pine-core/p-e7bf0be9.entry.js +0 -2
- package/dist/pine-core/p-e7bf0be9.entry.js.map +0 -1
- package/dist/pine-core/p-f1156360.entry.js +0 -2
- package/dist/pine-core/p-f1156360.entry.js.map +0 -1
- package/dist/pine-core/p-mVZRKoXd.js.map +0 -1
- /package/dist/pine-core/{p-5db706e1.entry.js.map → p-1b81a8ec.entry.js.map} +0 -0
- /package/dist/pine-core/{p-ad69e5f9.system.entry.js.map → p-38d2498e.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-9e9d3a2b.entry.js.map → p-4ccd2d5e.entry.js.map} +0 -0
- /package/dist/pine-core/{p-dae339c3.entry.js.map → p-4e7ca704.entry.js.map} +0 -0
- /package/dist/pine-core/{p-b9f99fc9.entry.js.map → p-4ff0838c.entry.js.map} +0 -0
- /package/dist/pine-core/{p-820faa91.system.entry.js.map → p-596e0292.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-040f3c92.system.entry.js.map → p-6260135d.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-14ca569b.entry.js.map → p-6a716bff.entry.js.map} +0 -0
- /package/dist/pine-core/{p-b2bbc362.entry.js.map → p-82e05dcf.entry.js.map} +0 -0
- /package/dist/pine-core/{p-91dadcbe.entry.js.map → p-8337c77c.entry.js.map} +0 -0
- /package/dist/pine-core/{p-2ab26d3d.system.entry.js.map → p-a952d40c.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-d0780ca1.system.entry.js.map → p-c7d4f436.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-3fdbda99.system.entry.js.map → p-c838b6ef.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-42f1190a.system.entry.js.map → p-ca09f86a.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-1995a0f8.system.entry.js.map → p-ceb48b05.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-e4ea5041.system.entry.js.map → p-d8e02aa9.system.entry.js.map} +0 -0
- /package/dist/pine-core/{p-abcce8af.entry.js.map → p-e88d58f4.entry.js.map} +0 -0
- /package/dist/pine-core/{p-bedddd53.entry.js.map → p-f94703c9.entry.js.map} +0 -0
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"p-CIzJqNxZ.system.js","sources":["src/global/styles/utils/label.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.tsx"],"sourcesContent":[":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 align-items: center;\n display: flex;\n flex-flow: row wrap;\n}\n\n:host(.is-invalid) {\n input {\n border-color: var(--pine-color-border-danger);\n\n &:checked {\n background: var( --pine-color-danger);\n\n &:hover {\n background: var(--pine-color-danger-hover);\n border-color: var(--pine-color-border-danger-hover);\n }\n }\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n\n label,\n .pds-checkbox__message--error {\n color: var(--pine-color-text-message-danger);\n }\n}\n\n:host(.is-indeterminate) {\n input {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent);\n\n &:hover {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent-hover);\n }\n\n &::after {\n border: 1px solid var(--pine-color-secondary);\n border-block-end: var(--pine-border-width-none);\n border-block-start: var(--pine-border-width-none);\n border-inline-start: var(--pine-border-width-none);\n content: \"\";\n display: block;\n height: 7px;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: rotate(90deg) translate3d(-103%, 32%, 0);\n width: 4px;\n }\n }\n}\n\ninput {\n appearance: none;\n background: var(--pine-color-background-container);\n border: var(--pine-border);\n border-radius: var(--pine-dimension-2xs);\n flex: none;\n height: var(--pine-dimension-sm);\n margin: 0;\n margin-block-start: var(--pine-dimension-025);\n position: relative;\n width: var(--pine-dimension-sm);\n\n &:hover {\n background: var(--pine-color-background-container-hover);\n border: var(--pine-border-hover);\n }\n\n &:checked {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent);\n\n &:hover {\n background: var(--pine-color-accent-hover);\n border-color: var(--pine-color-accent-hover);\n }\n\n &::after {\n border: 1px solid var(--pine-color-secondary);\n border-block-start: var(--pine-border-width-none);\n border-inline-start: var(--pine-border-width-none);\n content: \"\";\n display: block;\n height: 7px;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: rotate(43deg) translate3d(-110%, -30%, 0);\n width: 4px;\n }\n }\n\n &:disabled {\n background: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n cursor: not-allowed;\n\n &:checked {\n background: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n\n &::after {\n border-color: var(--pine-color-grey-300);\n }\n }\n\n + label {\n cursor: not-allowed;\n }\n\n ~ .pds-checkbox__message {\n color: var(--pine-color-text-disabled);\n }\n }\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n }\n}\n\nlabel {\n display: flex;\n gap: var(--pine-dimension-xs);\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n.pds-checkbox__message {\n color: var(--pine-color-text-message);\n margin-block-start: 6px;\n margin-inline-start: var(--pine-dimension-md);\n width: 100%;\n}\n\n.pds-checkbox__message--error {\n display: flex;\n font-size: var(--pine-font-size-085);\n gap: var(--pine-dimension-050);\n\n pds-icon {\n margin-block-start: var(--pine-dimension-025);\n }\n}\n","import { Component, h, Prop, Host, Event, EventEmitter, Watch } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { CheckboxChangeEventDetail } from './checkbox-interface';\nimport { danger } from '@pine-ds/icons/icons';\n\n@Component({\n tag: 'pds-checkbox',\n styleUrls: ['../../global/styles/utils/label.scss', 'pds-checkbox.scss'],\n shadow: true,\n})\nexport class PdsCheckbox {\n /**\n * It determines whether or not the checkbox is checked.\n */\n @Prop({ mutable: true }) checked?: boolean = false;\n\n /**\n * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * It determines whether or not the checkbox is disabled.\n */\n @Prop() disabled: boolean;\n\n /**\n * Displays message text describing an invalid state.\n */\n @Prop() errorMessage: string;\n\n /**\n * String used for helper message below checkbox.\n */\n @Prop() helperMessage: string;\n\n /**\n * If `true`, the checkbox will visually appear as indeterminate.\n * Only JavaScript can set the objects `indeterminate` property. See [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes).\n */\n @Prop({ mutable: true }) indeterminate: boolean;\n\n /**\n * It determines whether or not the checkbox is invalid.\n */\n @Prop() invalid: boolean;\n\n /**\n * String used for label text next to checkbox.\n */\n @Prop() label: string;\n\n /**\n * Visually hides the label text for instances where only the checkbox should be displayed. Label remains accessible to assistive technology such as screen readers.\n */\n @Prop() hideLabel: boolean;\n\n /**\n * String used for checkbox `name` attribute.\n */\n @Prop() name: string;\n\n /**\n * It determines whether or not the checkbox is required.\n */\n @Prop() required: boolean;\n\n /**\n * The value of the checkbox that is submitted with a form.\n */\n @Prop() value: string;\n\n /**\n * Event emitted that contains the `value` and `checked`.\n */\n @Event() pdsCheckboxChange: EventEmitter<CheckboxChangeEventDetail>;\n\n @Event() pdsCheckboxInput: EventEmitter<CheckboxChangeEventDetail>;\n\n @Watch('checked')\n updateIndeterminate() {\n this.indeterminate = undefined\n }\n\n private handleCheckboxChange = (e: Event) => {\n if (this.disabled) {\n return;\n }\n\n const target = e.target as HTMLInputElement;\n this.checked = target.checked;\n\n this.pdsCheckboxChange.emit({\n checked: target.checked,\n value: this.value\n });\n }\n\n private handleInput = () => {\n this.pdsCheckboxInput.emit({\n checked: this.checked,\n value: this.value\n });\n }\n\n private classNames() {\n const classNames = [];\n\n if (this.invalid) { classNames.push('is-invalid'); }\n if (this.indeterminate) { classNames.push('is-indeterminate'); }\n if (this.disabled) { classNames.push('is-disabled'); }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host class={this.classNames()}>\n <label htmlFor={this.componentId}>\n <input\n type=\"checkbox\"\n aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n id={this.componentId}\n indeterminate={this.indeterminate}\n name={this.name}\n value={this.value}\n checked={this.checked}\n required={this.required}\n disabled={this.disabled}\n onChange={this.handleCheckboxChange}\n onInput={this.handleInput}\n />\n <span class={this.hideLabel ? 'visually-hidden' : ''}>\n {this.label}\n </span>\n </label>\n {this.helperMessage &&\n <div\n class={'pds-checkbox__message'}\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </div>\n }\n {this.errorMessage &&\n <div\n class={`pds-checkbox__message pds-checkbox__message--error`}\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </div>\n }\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"p-CbNKHcsJ.system.js","sources":["src/components/pds-button/pds-button.scss?tag=pds-button&encapsulation=shadow","src/components/pds-button/pds-button.tsx"],"sourcesContent":[":host {\n --button-dimension: 40px;\n --color-border-default: transparent;\n --color-border-disabled: transparent;\n --color-border-focus: transparent;\n --color-border-hover: transparent;\n --button-loader-color: var(--color-text-default);\n\n display: inline-flex;\n vertical-align: middle;\n}\n\n:host([full-width=\"true\"]) {\n display: flex;\n width: 100%;\n\n button {\n justify-content: center;\n width: 100%;\n }\n\n .pds-button__content {\n justify-content: center;\n text-align: center;\n }\n}\n\n:host([loading=\"true\"]) {\n cursor: wait;\n pointer-events: none;\n}\n\n:host([disabled=\"true\"]) {\n pointer-events: none;\n}\n\n.pds-button {\n --pds-loader-color: var(--color-text-default);\n align-items: center;\n background-color: var(--color-background-default);\n border: var(--pine-border);\n border-color: var(--color-border-default);\n border-radius: var(--pine-border-radius-full);\n box-sizing: border-box;\n color: var(--color-text-default); // Set in the variant classes below\n cursor: pointer;\n display: flex;\n font: var(--pine-typography-body-brand-label);\n letter-spacing: var(--pine-letter-spacing);\n min-height: var(--button-dimension);\n padding: var(--pine-dimension-xs) var(--pine-dimension-sm);\n text-decoration: none;\n\n pds-icon {\n color: currentColor;\n fill: currentColor;\n 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 border-color: var(--color-border-focus);\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n }\n\n &:disabled {\n background-color: var(--color-background-disabled);\n border-color: var(--color-border-disabled);\n color: var(--color-text-disabled);\n pointer-events: none;\n }\n}\n\n.pds-button--primary {\n --color-background-default: var(--pine-color-primary);\n --color-background-hover: var(--pine-color-primary-hover);\n --color-background-disabled: var(--pine-color-primary-disabled);\n --color-border-default: var(--pine-color-primary);\n --color-border-hover: var(--pine-color-primary-hover);\n --color-text-default: var(--pine-color-text-primary);\n --color-text-disabled: var(--pine-color-text-primary-disabled);\n --color-outline: var(--pine-color-focus-ring);\n --button-loader-color: var(--pine-color-text-primary);\n}\n\n.pds-button--accent {\n --color-background-default: var(--pine-color-accent);\n --color-background-hover: var(--pine-color-accent-hover);\n --color-background-disabled: var(--pine-color-accent-disabled);\n --color-border-default: var(--pine-color-accent);\n --color-border-hover: var(--pine-color-accent-hover);\n --color-text-default: var(--pine-color-text-primary);\n --color-text-disabled: var(--pine-color-text-accent-disabled);\n --color-outline: var(--pine-color-focus-ring);\n --button-loader-color: var(--pine-color-text-primary);\n}\n\n.pds-button--destructive {\n --color-background-default: var(--pine-color-danger);\n --color-background-hover: var(--pine-color-danger-hover);\n --color-background-disabled: var(--pine-color-danger-disabled);\n --color-border-default: var(--pine-color-danger);\n --color-border-hover: var(--pine-color-danger-hover);\n --color-text-default: var(--pine-color-text-primary);\n --color-text-disabled: var(--pine-color-text-danger-disabled);\n --color-outline: var(--pine-color-focus-ring-danger);\n --button-loader-color: var(--pine-color-text-primary);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n}\n\n.pds-button--secondary,\n.pds-button--disclosure {\n --color-background-default: var(--pine-color-secondary);\n --color-background-hover: var(--pine-color-secondary-hover);\n --color-background-disabled: var(--pine-color-secondary-disabled);\n --color-border-disabled: var(--pine-color-border-disabled);\n --color-border-focus: var(--pine-color-border);\n --color-border-hover: var(--pine-color-border-hover);\n --color-border-default: var(--pine-color-border);\n --color-text-default: var(--pine-color-text-secondary);\n --color-text-disabled: var(--pine-color-text-secondary-disabled);\n --color-outline: var(--pine-color-focus-ring);\n --button-loader-color: var(--pine-color-text-secondary);\n\n &:hover {\n background-color: var(--pine-color-secondary-hover);\n }\n}\n\n.pds-button--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 --button-loader-color: inherit;\n border-width: var(--pine-dimension-none);\n margin: var(--pine-dimension-none);\n min-height: auto;\n padding: var(--pine-dimension-none);\n width: inherit;\n}\n\n.pds-button__content {\n align-items: center;\n display: inline-flex;\n position: relative;\n width: 100%;\n}\n\n.pds-button__text {\n align-items: center;\n display: inline-flex;\n}\n\n.pds-button__text--hidden,\n.pds-button__icon--hidden {\n opacity: 0;\n}\n\n.pds-button__loader {\n height: var(--pine-dimension-250);\n left: 50%;\n position: absolute;\n top: 50%;\n transform: translate(-50%, -50%);\n width: var(--pine-dimension-250);\n}\n\n.pds-button--loading {\n cursor: wait;\n pointer-events: none;\n\n .pds-button__loader {\n pds-loader {\n --loader-color: var(--button-loader-color);\n }\n }\n}\n\n.pds-button--icon-only {\n align-items: center;\n border-radius: var(--pine-border-radius-full);\n height: var(--button-dimension);\n justify-content: center;\n min-height: var(--button-dimension);\n min-width: var(--button-dimension);\n padding: var(--pine-dimension-xs);\n width: var(--button-dimension);\n\n .pds-button__content {\n height: 100%;\n justify-content: center;\n width: 100%;\n }\n\n pds-icon {\n margin: 0;\n }\n\n .pds-button__text--hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n }\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { hasShadowDom } from '../../utils/utils';\n\nimport { caretDown } from '@pine-ds/icons/icons';\n\n/**\n * @part button - Exposes the button element for styling.\n * @part button-content - Exposes the button content for styling.\n * @part button-text - Exposes the button text for styling.\n * @part caret - Exposes the caret icon component for styling. Appears only on the disclosure variant.\n * @part icon - Exposes the icon component for styling.\n*/\n\n@Component({\n tag: 'pds-button',\n styleUrls: ['pds-button.scss'],\n shadow: true,\n})\nexport class PdsButton {\n @Element() el: HTMLPdsButtonElement;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Determines the button's disabled state.\n * @defaultValue false\n */\n @Prop() disabled? = false;\n\n /**\n * Determines if the button should take up the full width of its container.\n * @defaultValue false\n */\n @Prop() fullWidth? = false;\n\n /**\n * If provided, renders the component as an anchor (`<a>`) element instead of a button.\n * When using href, button-specific props (type, name, value, loading) will be ignored.\n */\n @Prop() href?: string;\n\n /**\n * Displays an icon in the button.\n * @defaultValue null\n */\n @Prop() icon?: string = null;\n\n /**\n * When true, displays only the icon and visually hides the text (keeping it accessible).\n */\n @Prop() iconOnly? = false;\n\n /**\n * Determines if the button is in a loading state.\n * When true, displays a loader and hides the button text.\n * @defaultValue false\n */\n @Prop() loading? = false;\n\n /**\n * Provides the button with a submittable name.\n */\n @Prop() name?: string;\n\n /**\n * Specifies where to open the linked document when href is provided.\n * Only applies when href is set.\n */\n @Prop() target?: '_blank' | '_self' | '_parent' | '_top';\n\n /**\n * Provides button with a type.\n * @defaultValue button\n */\n @Prop() type?: 'button' | 'reset' | 'submit' = 'button';\n\n /**\n * Provides button with a submittable value\n */\n @Prop() value?: string;\n\n /**\n * Sets the style variant of the button.\n * @defaultValue primary\n */\n @Prop() variant: 'primary' | 'secondary' | 'accent' | 'disclosure' | 'destructive' | 'unstyled' = 'primary';\n\n @Event() pdsClick: EventEmitter;\n\n private handleClick = (ev: Event) => {\n if (this.loading) {\n ev.preventDefault();\n return;\n }\n\n if (!this.href && this.type != 'button') {\n // If button clicked IS NOT associated with a form\n if (hasShadowDom(this.el)) {\n const form = this.el.closest('form');\n if (form) {\n ev.preventDefault();\n\n const fakeButton = document.createElement('button');\n fakeButton.type = this.type;\n fakeButton.style.display = 'none';\n form.appendChild(fakeButton);\n fakeButton.click();\n fakeButton.remove();\n }\n }\n }\n this.pdsClick.emit(ev);\n };\n\n private classNames() {\n const classNames = ['pds-button'];\n\n if (this.variant) {\n classNames.push('pds-button--' + this.variant);\n }\n\n if (this.iconOnly) {\n classNames.push('pds-button--icon-only');\n }\n\n if (this.loading) {\n classNames.push('pds-button--loading');\n }\n\n return classNames.join(' ');\n }\n\n render() {\n // Common props for both button and anchor elements\n const commonProps = {\n class: this.classNames(),\n part: 'button',\n };\n\n const attributes = () => {\n if (this.href) {\n return {\n // Anchor element props\n ...commonProps,\n href: this.disabled ? null : this.href,\n target: this.target,\n };\n }\n\n return {\n // Button element props\n ...commonProps,\n 'aria-busy': this.loading ? 'true' : null,\n 'aria-live': this.loading ? 'polite' : null,\n 'disabled': this.disabled,\n 'name': this.name,\n 'type': this.type,\n 'value': this.value,\n };\n };\n\n const ContentElement = this.href ? 'a' : 'button';\n\n // Hide text when loading or iconOnly is true\n const hideText = this.loading || this.iconOnly;\n\n const content = (\n <div class=\"pds-button__content\" part=\"button-content\">\n {this.icon && this.variant !== 'disclosure' &&\n <pds-icon class={this.loading ? 'pds-button__icon--hidden' : ''} name={this.icon} part=\"icon\" aria-hidden=\"true\"></pds-icon>\n }\n\n <span class={`pds-button__text ${hideText ? 'pds-button__text--hidden' : ''}`} part=\"button-text\">\n <slot />\n </span>\n\n {this.loading && (\n <span class=\"pds-button__loader\">\n <pds-loader is-loading={true} size=\"var(--pine-font-size-body-2xl)\" variant=\"spinner\">\n Loading...\n </pds-loader>\n </span>\n )}\n\n {this.variant === 'disclosure' &&\n <pds-icon class={this.loading ? 'pds-button__icon--hidden' : ''} icon={caretDown} part=\"caret\" aria-hidden=\"true\"></pds-icon>\n }\n </div>\n );\n\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n id={this.componentId}\n onClick={this.handleClick}\n variant={this.variant}\n >\n <ContentElement {...attributes()}>\n {content}\n </ContentElement>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"p-Chrs_Qxi.system.js","sources":["src/components/pds-copytext/pds-copytext.scss?tag=pds-copytext&encapsulation=shadow","src/components/pds-copytext/pds-copytext.tsx"],"sourcesContent":[":host(.pds-copytext) {\n // Update custom prop usage in Button before changing\n --copytext-color-background-hover: var(--pine-color-grey-200);\n\n\n pds-button {\n align-items: center;\n background: var(--pine-color-secondary);\n border-radius: var(--pine-border-radius-full);\n border-width: var(--pine-dimension-none);\n display: inline-flex;\n font-family: var(--pine-font-family-heading);\n font-size: var(--pine-font-size-body-md);\n font-weight: var(--pine-font-weight-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n line-height: var(--pine-line-height-body);\n max-width: 100%;\n padding: var(--pine-dimension-2xs) var(--pine-dimension-xs);\n\n &::part(button) {\n padding-inline-end: calc(var(--pine-dimension-xs) / 2);\n }\n\n &::part(button):hover {\n // Update custom prop usage in Button before changing\n background-color: var(--copytext-color-background-hover);\n color: var(--pine-color-text-secondary-hover);\n }\n\n span {\n font-weight: var(--pine-font-weight-medium);\n margin-inline-end: var(--pine-dimension-xs);\n white-space: nowrap;\n }\n\n :nth-child(2) {\n flex-shrink: 0;\n }\n }\n\n // bordered\n\n &:host(.pds-copytext--bordered) {\n border-width: var(--pine-dimension-none);\n padding: var(--pine-dimension-none);\n\n pds-button {\n padding: var(--pine-dimension-none);\n\n }\n\n &::part(button):hover {\n background-color: transparent;\n }\n\n span {\n border: var(--pine-border);\n border-radius: var(--pine-border-radius-full);\n margin-inline-end: var(--pine-dimension-sm);\n padding-block: var(--pine-dimension-xs);\n padding-inline: var(--pine-dimension-sm);\n }\n\n :hover {\n span {\n border: var(--pine-border-hover);\n }\n }\n }\n\n // full width and truncated\n &:host(.pds-copytext--full-width),\n &:host(.pds-copytext--truncated) {\n pds-button {\n display: inline-flex;\n min-width: auto;\n width: 100%;\n\n &::part(button-content),\n &::part(button-text) {\n flex-shrink: 1;\n width: 100%;\n }\n\n span {\n text-align: left;\n width: 100%;\n }\n }\n }\n\n // full width\n &:host(.pds-copytext--full-width) {\n pds-button {\n justify-content: space-between;\n }\n }\n\n // truncated\n &:host(.pds-copytext--truncated) {\n pds-button span {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n}\n","import { Component, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\n\nimport { copy as copyIcon } from '@pine-ds/icons/icons';\n\n@Component({\n tag: 'pds-copytext',\n styleUrls: ['pds-copytext.scss'],\n shadow: true,\n})\nexport class PdsCopytext {\n /**\n * Determines whether `copytext` should have a visible border.\n * @defaultValue true\n */\n @Prop({ reflect: true }) border = true;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Determines whether `copytext` should expand to the full width of its container.\n * @defaultValue false\n */\n @Prop() fullWidth = false;\n\n /**\n * Determines whether the `value` should truncate and display with an ellipsis.\n * @defaultValue false\n */\n @Prop() truncate = false;\n\n /**\n * The string displayed that is also copied to the clipboard upon interaction.\n */\n @Prop() value!: string;\n\n /**\n * Event fired when copyText button is clicked.\n */\n @Event() pdsCopyTextClick: EventEmitter;\n\n private copyToClipboard = async (value: string) => {\n try {\n if (typeof navigator.clipboard !== 'undefined') {\n await navigator.clipboard.writeText(value);\n this.pdsCopyTextClick.emit('Copied to clipboard');\n }\n } catch (err) {\n this.pdsCopyTextClick.emit(`Error writing text to clipboard: ${err}`);\n }\n };\n\n private handleClick = () => {\n this.copyToClipboard(this.value);\n };\n\n private classNames() {\n const classNames = ['pds-copytext'];\n\n if (this.border) {\n classNames.push('pds-copytext--bordered');\n }\n\n if (this.fullWidth) {\n classNames.push('pds-copytext--full-width');\n }\n\n if (this.truncate) {\n classNames.push('pds-copytext--truncated');\n }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host class={this.classNames()} id={this.componentId}>\n <pds-button type=\"button\" variant=\"unstyled\" onClick={this.handleClick}>\n <span>{this.value}</span>\n <pds-icon icon={copyIcon} size=\"16px\"></pds-icon>\n </pds-button>\n </Host>\n );\n }\n}\n"],"names":["copyIcon"],"mappings":";;;;;;;;;;;;;;MAAA,MAAM,cAAc,GAAG,szFAAszF;;YCSh0F,WAAW,2BAAA,MAAA;MALxB,IAAA,WAAA,CAAA,OAAA,EAAA;;;MAME;;;MAGG;MACsB,QAAA,IAAM,CAAA,MAAA,GAAG,IAAI;MAOtC;;;MAGG;MACK,QAAA,IAAS,CAAA,SAAA,GAAG,KAAK;MAEzB;;;MAGG;MACK,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;MAYhB,QAAA,IAAA,CAAA,eAAe,GAAG,OAAO,KAAa,KAAI;MAChD,YAAA,IAAI;MACF,gBAAA,IAAI,OAAO,SAAS,CAAC,SAAS,KAAK,WAAW,EAAE;0BAC9C,MAAM,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,KAAK,CAAC;MAC1C,oBAAA,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,qBAAqB,CAAC;;;kBAEnD,OAAO,GAAG,EAAE;sBACZ,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAoC,iCAAA,EAAA,GAAG,CAAE,CAAA,CAAC;;MAEzE,SAAC;MAEO,QAAA,IAAW,CAAA,WAAA,GAAG,MAAK;MACzB,YAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC;MAClC,SAAC;MA8BF;UA5BS,UAAU,GAAA;MAChB,QAAA,MAAM,UAAU,GAAG,CAAC,cAAc,CAAC;MAEnC,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE;MACf,YAAA,UAAU,CAAC,IAAI,CAAC,wBAAwB,CAAC;;MAG3C,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;MAClB,YAAA,UAAU,CAAC,IAAI,CAAC,0BAA0B,CAAC;;MAG7C,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;MACjB,YAAA,UAAU,CAAC,IAAI,CAAC,yBAAyB,CAAC;;MAG5C,QAAA,OAAO,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;;UAG9B,MAAM,GAAA;MACJ,QAAA,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,IAAI,CAAC,WAAW,EAAA,EAClD,CAAA,CAAA,YAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAY,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAC,UAAU,EAAC,OAAO,EAAE,IAAI,CAAC,WAAW,EAAA,EACpE,CAAO,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAA,IAAI,CAAC,KAAK,CAAQ,EACzB,CAAU,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAEA,IAAQ,EAAE,IAAI,EAAC,MAAM,EAAY,CAAA,CACtC,CACR;;;;;;;;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["pdsCopytextCss","PdsCopytext","constructor","hostRef","this","border","fullWidth","truncate","copyToClipboard","async","value","navigator","clipboard","writeText","pdsCopyTextClick","emit","err","handleClick","classNames","push","join","render","h","Host","key","class","id","componentId","type","variant","onClick","icon","copyIcon","size"],"sources":["src/components/pds-copytext/pds-copytext.scss?tag=pds-copytext&encapsulation=shadow","src/components/pds-copytext/pds-copytext.tsx"],"sourcesContent":[":host(.pds-copytext) {\n // Update custom prop usage in Button before changing\n --copytext-color-background-hover: var(--pine-color-grey-200);\n\n\n pds-button {\n align-items: center;\n background: var(--pine-color-secondary);\n border-radius: var(--pine-border-radius-full);\n border-width: var(--pine-dimension-none);\n display: inline-flex;\n font-family: var(--pine-font-family-heading);\n font-size: var(--pine-font-size-body-md);\n font-weight: var(--pine-font-weight-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n line-height: var(--pine-line-height-body);\n max-width: 100%;\n padding: var(--pine-dimension-2xs) var(--pine-dimension-xs);\n\n &::part(button) {\n padding-inline-end: calc(var(--pine-dimension-xs) / 2);\n }\n\n &::part(button):hover {\n // Update custom prop usage in Button before changing\n background-color: var(--copytext-color-background-hover);\n color: var(--pine-color-text-secondary-hover);\n }\n\n span {\n font-weight: var(--pine-font-weight-medium);\n margin-inline-end: var(--pine-dimension-xs);\n white-space: nowrap;\n }\n\n :nth-child(2) {\n flex-shrink: 0;\n }\n }\n\n // bordered\n\n &:host(.pds-copytext--bordered) {\n border-width: var(--pine-dimension-none);\n padding: var(--pine-dimension-none);\n\n pds-button {\n padding: var(--pine-dimension-none);\n\n }\n\n &::part(button):hover {\n background-color: transparent;\n }\n\n span {\n border: var(--pine-border);\n border-radius: var(--pine-border-radius-full);\n margin-inline-end: var(--pine-dimension-sm);\n padding-block: var(--pine-dimension-xs);\n padding-inline: var(--pine-dimension-sm);\n }\n\n :hover {\n span {\n border: var(--pine-border-hover);\n }\n }\n }\n\n // full width and truncated\n &:host(.pds-copytext--full-width),\n &:host(.pds-copytext--truncated) {\n pds-button {\n display: inline-flex;\n min-width: auto;\n width: 100%;\n\n &::part(button-content),\n &::part(button-text) {\n flex-shrink: 1;\n width: 100%;\n }\n\n span {\n text-align: left;\n width: 100%;\n }\n }\n }\n\n // full width\n &:host(.pds-copytext--full-width) {\n pds-button {\n justify-content: space-between;\n }\n }\n\n // truncated\n &:host(.pds-copytext--truncated) {\n pds-button span {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n}\n","import { Component, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\n\nimport { copy as copyIcon } from '@pine-ds/icons/icons';\n\n@Component({\n tag: 'pds-copytext',\n styleUrls: ['pds-copytext.scss'],\n shadow: true,\n})\nexport class PdsCopytext {\n /**\n * Determines whether `copytext` should have a visible border.\n * @defaultValue true\n */\n @Prop({ reflect: true }) border = true;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Determines whether `copytext` should expand to the full width of its container.\n * @defaultValue false\n */\n @Prop() fullWidth = false;\n\n /**\n * Determines whether the `value` should truncate and display with an ellipsis.\n * @defaultValue false\n */\n @Prop() truncate = false;\n\n /**\n * The string displayed that is also copied to the clipboard upon interaction.\n */\n @Prop() value!: string;\n\n /**\n * Event fired when copyText button is clicked.\n */\n @Event() pdsCopyTextClick: EventEmitter;\n\n private copyToClipboard = async (value: string) => {\n try {\n if (typeof navigator.clipboard !== 'undefined') {\n await navigator.clipboard.writeText(value);\n this.pdsCopyTextClick.emit('Copied to clipboard');\n }\n } catch (err) {\n this.pdsCopyTextClick.emit(`Error writing text to clipboard: ${err}`);\n }\n };\n\n private handleClick = () => {\n this.copyToClipboard(this.value);\n };\n\n private classNames() {\n const classNames = ['pds-copytext'];\n\n if (this.border) {\n classNames.push('pds-copytext--bordered');\n }\n\n if (this.fullWidth) {\n classNames.push('pds-copytext--full-width');\n }\n\n if (this.truncate) {\n classNames.push('pds-copytext--truncated');\n }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host class={this.classNames()} id={this.componentId}>\n <pds-button type=\"button\" variant=\"unstyled\" onClick={this.handleClick}>\n <span>{this.value}</span>\n <pds-icon icon={copyIcon} size=\"16px\"></pds-icon>\n </pds-button>\n </Host>\n );\n }\n}\n"],"mappings":"6FAAA,MAAMA,EAAiB,uzF,MCSVC,EAAW,MALxB,WAAAC,CAAAC,G,2DAU2BC,KAAMC,OAAG,KAW1BD,KAASE,UAAG,MAMZF,KAAQG,SAAG,MAYXH,KAAAI,gBAAkBC,MAAOC,IAC/B,IACE,UAAWC,UAAUC,YAAc,YAAa,OACxCD,UAAUC,UAAUC,UAAUH,GACpCN,KAAKU,iBAAiBC,KAAK,sB,EAE7B,MAAOC,GACPZ,KAAKU,iBAAiBC,KAAK,oCAAoCC,I,GAI3DZ,KAAWa,YAAG,KACpBb,KAAKI,gBAAgBJ,KAAKM,MAAM,CA+BnC,CA5BS,UAAAQ,GACN,MAAMA,EAAa,CAAC,gBAEpB,GAAId,KAAKC,OAAQ,CACfa,EAAWC,KAAK,yB,CAGlB,GAAIf,KAAKE,UAAW,CAClBY,EAAWC,KAAK,2B,CAGlB,GAAIf,KAAKG,SAAU,CACjBW,EAAWC,KAAK,0B,CAGlB,OAAOD,EAAWE,KAAK,K,CAGzB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAOrB,KAAKc,aAAcQ,GAAItB,KAAKuB,aACvCL,EAAA,cAAAE,IAAA,2CAAYI,KAAK,SAASC,QAAQ,WAAWC,QAAS1B,KAAKa,aACzDK,EAAO,QAAAE,IAAA,4CAAApB,KAAKM,OACZY,EAAU,YAAAE,IAAA,2CAAAO,KAAMC,EAAUC,KAAK,U","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,h as n,H as i,g as e}from"./p-Uh5ntVcq.js";let s=false;const o=t=>{var n;const i=(n=document.head.querySelector("meta[data-pine-asset-path]"))===null||n===void 0?void 0:n.dataset.pineAssetPath;const e=window.__PINE_ASSET_PATH__;const o="https://cdn.jsdelivr.net/npm/@pine-ds/icons/dist/";const r=i||e||o;if(r.startsWith("https://cdn.jsdelivr.net/npm/")&&!s){s=true;console.warn(`\n Fetching Pine assets from jsDelivr CDN.\n\n It's recommended that you bundle Pine Assets with your application and set the path accordingly.\n\nFor more information, read the documentation: \nhttps://pine-design-system.netlify.app/?path=/docs/resources-assets--docs\n `)}let c=t;if(t.startsWith("./")){c=t.substring(2)}if(!r.endsWith("/")){c="/"+c}return r+c};let r;const c=()=>{if(typeof window==="undefined"){return new Map}else{if(!r){const t=window;t.PdsIcons=t.PdsIcons||{};r=t.PdsIcons.map=t.PdsIcons.map||new Map}return r}};const l=(t,n)=>{if(!t&&n&&!h(n)){t=n}if(u(t)){t=p(t)}if(!u(t)||t.trim()===""){return null}const i=t.replace(/[a-z]|-|\d/gi,"");if(i!=""){return null}return t};const a=t=>{const n=c().get(t);if(n){return n}return o(`svg/${t}.svg`)};const d=t=>{if(u(t)){t=t.trim();if(h(t)){return t}}return null};const f=t=>{let n=d(t.src);if(n){return n}n=l(t.name,t.icon);if(n){return a(n)}if(t.icon){n=d(t.icon);if(n){return n}}return null};const h=t=>t.length>0&&/(\/|\.)/.test(t);const u=t=>typeof t==="string";const p=t=>t.toLowerCase();const m=(t,n=[])=>{const i={};n.forEach((n=>{if(t.hasAttribute(n)){const e=t.getAttribute(n);if(e!==null){i[n]=t.getAttribute(n)}t.removeAttribute(n)}}));return i};const g=t=>{const n=document.createElement("div");n.innerHTML=t;for(let t=n.childNodes.length-1;t>=0;t--){if(n.childNodes[t].nodeName.toLowerCase()!=="svg"){n.removeChild(n.childNodes[t])}}const i=n.firstElementChild;if(i&&i.nodeName.toLowerCase()==="svg"){const t=i.getAttribute("class")||"";i.setAttribute("class",(t+" s-pds-icon").trim());if(w(i)){return n.innerHTML}}return""};const w=t=>{if(t.nodeType===1){if(t.nodeName.toLowerCase()==="script"){return false}for(let n=0;n<t.attributes.length;n++){const i=t.attributes[n].name;if(u(i)&&i.toLowerCase().indexOf("on")===0){return false}}for(let n=0;n<t.childNodes.length;n++){if(!w(t.childNodes[n])){return false}}}return true};const v=t=>t.startsWith("data:image/svg+xml");const b=t=>t.indexOf(";utf8,")!==-1;const y=new Map;const x=new Map;let M;const j=(t,n=false)=>{let i=x.get(t);if(!i){if(typeof fetch!="undefined"&&typeof document!=="undefined"){if(v(t)&&b(t)){if(!M){M=new DOMParser}const n=M.parseFromString(t,"text/html");const i=n.querySelector("svg");if(i){y.set(t,i.outerHTML)}return Promise.resolve()}else{i=fetch(t).then((i=>{if(i.ok){return i.text().then((i=>{if(i&&n!==false){i=g(i)}y.set(t,i||"")}))}y.set(t,"")}));x.set(t,i)}}else{y.set(t,"");return Promise.resolve()}}return i};const k=":host{--dimension-icon-height:16px;--dimension-icon-width:16px;--color-icon-fill:currentColor;contain:strict;display:inline-block;fill:var(--color-icon-fill);-ms-flex-negative:0;flex-shrink:0;height:var(--dimension-icon-height);width:var(--dimension-icon-width)}:host .pdsicon{fill:var(--color-icon-fill)}.pds-icon-fill-none{fill:none}.icon-inner,.pds-icon,svg{display:block;height:100%;width:100%}";const C=class{constructor(n){t(this,n);this.inheritedAttributes={};this.isVisible=false;this.size="regular";this.hasAriaHidden=()=>{const{el:t}=this;return t.hasAttribute("aria-hidden")&&t.getAttribute("aria-hidden")==="true"}}iconSize(){const t={small:"12px",regular:"16px",medium:"20px",large:"24px"};if(t[this.size]){return t[this.size]}else{return this.size}}componentDidLoad(){this.setCSSVariables()}componentWillLoad(){this.inheritedAttributes=m(this.el,["aria-label"]);this.setCSSVariables()}setCSSVariables(){this.el.style.setProperty(`--dimension-icon-height`,this.iconSize());this.el.style.setProperty(`--dimension-icon-width`,this.iconSize());this.el.style.setProperty(`--color-icon-fill`,typeof this.color!=="undefined"?this.color:"currentColor")}connectedCallback(){this.waitUntilVisible(this.el,"50px",(()=>{this.isVisible=true;this.loadIcon()}))}disconnectedCallback(){if(this.io){this.io.disconnect();this.io=undefined}}updateStyles(){this.setCSSVariables()}loadIcon(){if(this.isVisible){const t=f(this);if(t){if(y.has(t)){this.svgContent=y.get(t)}else{j(t).then((()=>this.svgContent=y.get(t)))}}}const t=l(this.name,this.icon);if(t){this.ariaLabel=t.replace(/\-/g," ")}}render(){const{ariaLabel:t,inheritedAttributes:e}=this;return n(i,Object.assign({key:"4bbc232e2530d43e8b5afefb754486d94ea6538b","aria-label":t!==undefined&&!this.hasAriaHidden()?t:null,alt:"",role:"img",class:Object.assign({},S(this.color))},e),this.svgContent?n("div",{class:"icon-inner",innerHTML:this.svgContent}):n("div",{class:"icon-inner"}))}waitUntilVisible(t,n,i){if(typeof window!=="undefined"&&window.IntersectionObserver){const e=this.io=new window.IntersectionObserver((t=>{if(t[0].isIntersecting){e.disconnect();this.io=undefined;i()}}),{rootMargin:n});e.observe(t)}else{i()}}static get assetsDirs(){return["svg"]}get el(){return e(this)}static get watchers(){return{size:["updateStyles"],color:["updateStyles"],name:["loadIcon"],src:["loadIcon"],icon:["loadIcon"]}}};const S=t=>t?{"pds-color":true,[`pds-color-${t}`]:true}:null;C.style=k;export{C as pds_icon};
|
|
2
|
-
//# sourceMappingURL=p-aa955b03.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["missingAssetPathWarning","getAssetPath","path","_a","metaPineAssetPath","document","head","querySelector","dataset","pineAssetPath","windowAssetPath","window","__PINE_ASSET_PATH__","cdnAssetPath","assetBasePath","startsWith","console","warn","assetPath","substring","endsWith","CACHED_MAP","getIconMap","Map","win","PdsIcons","map","getName","iconName","icon","isSrc","isStr","toLower","trim","invalidChars","replace","getNamedUrl","url","get","getSrc","src","getUrl","pdsIcon","name","str","length","test","val","toLowerCase","inheritAttributes","el","attributes","attributeObject","forEach","attr","hasAttribute","value","getAttribute","removeAttribute","validateContent","svgContent","div","createElement","innerHTML","i","childNodes","nodeName","removeChild","svgElm","firstElementChild","svgClass","setAttribute","isValid","elm","nodeType","indexOf","isSvgDataUrl","isEncodedDataUrl","pdsIconContent","requests","parser","getSvgContent","sanitize","req","fetch","DOMParser","doc","parseFromString","svg","set","outerHTML","Promise","resolve","then","rsp","ok","text","pdsIconCss","PdsIcon","constructor","hostRef","this","inheritedAttributes","isVisible","size","hasAriaHidden","iconSize","sizes","small","regular","medium","large","componentDidLoad","setCSSVariables","componentWillLoad","style","setProperty","color","connectedCallback","waitUntilVisible","loadIcon","disconnectedCallback","io","disconnect","undefined","updateStyles","has","label","ariaLabel","render","h","Host","Object","assign","key","alt","role","class","createColorClasses","rootMargin","cb","IntersectionObserver","data","isIntersecting","observe","assetsDirs"],"sources":["../../node_modules/@pine-ds/icons/dist/collection/components/pds-icon/assetPath.js","../../node_modules/@pine-ds/icons/dist/collection/components/pds-icon/utils.js","../../node_modules/@pine-ds/icons/dist/collection/components/pds-icon/validate.js","../../node_modules/@pine-ds/icons/dist/collection/components/pds-icon/request.js","../../node_modules/@pine-ds/icons/dist/collection/components/pds-icon/pds-icon.css?tag=pds-icon&encapsulation=shadow","../../node_modules/@pine-ds/icons/dist/collection/components/pds-icon/pds-icon.js"],"sourcesContent":["import { Build } from \"@stencil/core\";\nlet missingAssetPathWarning = false;\n/**\n *\n * Reads the component asset path config from meta tag or a global variable.\n * This is a temporary workaround until these issues have been addressed:\n *\n * https://github.com/ionic-team/stencil/issues/2826/\n * https://github.com/ionic-team/stencil/issues/3470\n * https://github.com/ionic-team/stencil-ds-output-targets/issues/186\n */\nexport const getAssetPath = (path) => {\n var _a;\n const metaPineAssetPath = (_a = document.head.querySelector('meta[data-pine-asset-path]')) === null || _a === void 0 ? void 0 : _a.dataset.pineAssetPath;\n // Get the asset path from the window object if available\n const windowAssetPath = window.__PINE_ASSET_PATH__;\n // Set the CDN Asset path using the latest version\n const cdnAssetPath = 'https://cdn.jsdelivr.net/npm/@pine-ds/icons/dist/';\n const assetBasePath = Build.isTesting ? '/dist/pds-icons' : metaPineAssetPath || windowAssetPath || cdnAssetPath || '/';\n // Display a warning if the assets are fetched from the CDN.\n if (assetBasePath.startsWith('https://cdn.jsdelivr.net/npm/') && !missingAssetPathWarning) {\n missingAssetPathWarning = true;\n console.warn(`\n Fetching Pine assets from jsDelivr CDN.\\n\\n It's recommended that you bundle Pine Assets with your application and set the path accordingly.\\n\\nFor more information, read the documentation: \\nhttps://pine-design-system.netlify.app/?path=/docs/resources-assets--docs\n `);\n }\n let assetPath = path;\n if (path.startsWith('./')) {\n assetPath = path.substring(2);\n }\n if (!assetBasePath.endsWith('/')) {\n assetPath = '/' + assetPath;\n }\n return assetBasePath + assetPath;\n};\n//# sourceMappingURL=assetPath.js.map\n","import { getAssetPath } from \"./assetPath\";\nlet CACHED_MAP;\nexport const addIcons = (icons) => {\n const map = getIconMap();\n Object.keys(icons).forEach(name => map.set(name, icons[name]));\n};\nexport const getIconMap = () => {\n if (typeof window === 'undefined') {\n return new Map();\n }\n else {\n if (!CACHED_MAP) {\n const win = window; // eslint-disable-line @typescript-eslint/no-explicit-any\n win.PdsIcons = win.PdsIcons || {};\n CACHED_MAP = win.PdsIcons.map = win.PdsIcons.map || new Map();\n }\n return CACHED_MAP;\n }\n};\nexport const getName = (iconName, icon) => {\n if (!iconName && icon && !isSrc(icon)) {\n iconName = icon;\n }\n if (isStr(iconName)) {\n iconName = toLower(iconName);\n }\n if (!isStr(iconName) || iconName.trim() === '') {\n return null;\n }\n const invalidChars = iconName.replace(/[a-z]|-|\\d/gi, '');\n if (invalidChars != '') {\n return null;\n }\n return iconName;\n};\nconst getNamedUrl = (iconName) => {\n const url = getIconMap().get(iconName);\n if (url) {\n return url;\n }\n return getAssetPath(`svg/${iconName}.svg`);\n};\nexport const getSrc = (src) => {\n if (isStr(src)) {\n src = src.trim();\n if (isSrc(src)) {\n return src;\n }\n }\n return null;\n};\nexport const getUrl = (pdsIcon) => {\n let url = getSrc(pdsIcon.src);\n if (url) {\n return url;\n }\n url = getName(pdsIcon.name, pdsIcon.icon);\n if (url) {\n return getNamedUrl(url);\n }\n if (pdsIcon.icon) {\n url = getSrc(pdsIcon.icon);\n if (url) {\n return url;\n }\n }\n return null;\n};\nexport const isSrc = (str) => str.length > 0 && /(\\/|\\.)/.test(str);\nexport const isStr = (val) => typeof val === 'string'; // eslint-disable-line @typescript-eslint/no-explicit-any\nexport const toLower = (val) => val.toLowerCase();\n/**\n * Elements inside of web components sometimes need to inherit global attributes\n * set on the host. For example, the inner input in `pds-input` should inherit\n * the `title` attribute that developers set directly on `pds-input`. This\n * helper function should be called in componentWillLoad and assigned to a variable\n * that is later used in the render function.\n *\n * This does not need to be reactive as changing attributes on the host element\n * does not trigger a re-render.\n */\nexport const inheritAttributes = (el, attributes = []) => {\n const attributeObject = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n attributes.forEach(attr => {\n if (el.hasAttribute(attr)) {\n const value = el.getAttribute(attr);\n if (value !== null) {\n attributeObject[attr] = el.getAttribute(attr);\n }\n el.removeAttribute(attr);\n }\n });\n return attributeObject;\n};\n//# sourceMappingURL=utils.js.map\n","import { isStr } from \"./utils\";\nexport const validateContent = (svgContent) => {\n const div = document.createElement('div');\n div.innerHTML = svgContent;\n // setup this way to ensure it works on our buddy IE\n for (let i = div.childNodes.length - 1; i >= 0; i--) {\n if (div.childNodes[i].nodeName.toLowerCase() !== 'svg') {\n div.removeChild(div.childNodes[i]);\n }\n }\n // must only have 1 root element\n const svgElm = div.firstElementChild;\n if (svgElm && svgElm.nodeName.toLowerCase() === 'svg') {\n const svgClass = svgElm.getAttribute('class') || '';\n svgElm.setAttribute('class', (svgClass + ' s-pds-icon').trim());\n // root element must be an svg\n // lets double check we've got valid elements\n // do not allow scripts\n if (isValid(svgElm)) {\n return div.innerHTML;\n }\n }\n return '';\n};\nexport const isValid = (elm) => {\n if (elm.nodeType === 1) {\n if (elm.nodeName.toLowerCase() === 'script') {\n return false;\n }\n for (let i = 0; i < elm.attributes.length; i++) {\n const name = elm.attributes[i].name;\n if (isStr(name) && name.toLowerCase().indexOf('on') === 0) {\n return false;\n }\n }\n for (let i = 0; i < elm.childNodes.length; i++) {\n if (!isValid(elm.childNodes[i])) {\n return false;\n }\n }\n }\n return true;\n};\nexport const isSvgDataUrl = (url) => url.startsWith('data:image/svg+xml');\nexport const isEncodedDataUrl = (url) => url.indexOf(';utf8,') !== -1;\n//# sourceMappingURL=validate.js.map\n","import { isEncodedDataUrl, isSvgDataUrl, validateContent } from \"./validate\";\nexport const pdsIconContent = new Map();\nconst requests = new Map(); // eslint-disable-line @typescript-eslint/no-explicit-any\nlet parser;\nexport const getSvgContent = (url, sanitize = false) => {\n let req = requests.get(url);\n if (!req) {\n if (typeof fetch != 'undefined' && typeof document !== 'undefined') {\n if (isSvgDataUrl(url) && isEncodedDataUrl(url)) {\n if (!parser) {\n parser = new DOMParser();\n }\n const doc = parser.parseFromString(url, 'text/html');\n const svg = doc.querySelector('svg');\n if (svg) {\n pdsIconContent.set(url, svg.outerHTML);\n }\n return Promise.resolve();\n }\n else {\n // we don't have a request\n req = fetch(url).then((rsp) => {\n if (rsp.ok) {\n return rsp.text().then((svgContent) => {\n if (svgContent && sanitize !== false) {\n svgContent = validateContent(svgContent);\n }\n pdsIconContent.set(url, svgContent || '');\n });\n }\n pdsIconContent.set(url, '');\n });\n requests.set(url, req);\n }\n }\n else {\n pdsIconContent.set(url, '');\n return Promise.resolve();\n }\n }\n return req;\n};\n//# sourceMappingURL=request.js.map\n",":host {\n --dimension-icon-height: 16px;\n --dimension-icon-width: 16px;\n --color-icon-fill: currentColor;\n contain: strict;\n display: inline-block;\n fill: var(--color-icon-fill);\n flex-shrink: 0;\n height: var(--dimension-icon-height);\n width: var(--dimension-icon-width);\n}\n:host .pdsicon {\n fill: var(--color-icon-fill);\n}\n\n.pds-icon-fill-none {\n fill: none;\n}\n\n.icon-inner,\n.pds-icon,\nsvg {\n display: block;\n height: 100%;\n width: 100%;\n}","import { Build, Host, h } from \"@stencil/core\";\nimport { getSvgContent, pdsIconContent } from \"./request\";\nimport { getName, getUrl, inheritAttributes } from \"./utils\";\nexport class PdsIcon {\n constructor() {\n this.inheritedAttributes = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n this.isVisible = false;\n /**\n * The size of the icon. This can be\n * 'small', 'regular', 'medium', large, or a\n * custom value (40px, 1rem, etc)\n *\n */\n this.size = 'regular';\n this.hasAriaHidden = () => {\n const { el } = this;\n return el.hasAttribute('aria-hidden') && el.getAttribute('aria-hidden') === 'true';\n };\n }\n iconSize() {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const sizes = {\n small: '12px',\n regular: '16px',\n medium: '20px',\n large: '24px',\n };\n if (sizes[this.size]) {\n return sizes[this.size];\n }\n else {\n return this.size;\n }\n }\n componentDidLoad() {\n this.setCSSVariables();\n }\n componentWillLoad() {\n this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);\n this.setCSSVariables();\n }\n setCSSVariables() {\n this.el.style.setProperty(`--dimension-icon-height`, this.iconSize());\n this.el.style.setProperty(`--dimension-icon-width`, this.iconSize());\n this.el.style.setProperty(`--color-icon-fill`, typeof this.color !== 'undefined' ? this.color : 'currentColor');\n }\n connectedCallback() {\n this.waitUntilVisible(this.el, '50px', () => {\n this.isVisible = true;\n this.loadIcon();\n });\n }\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n }\n updateStyles() {\n this.setCSSVariables();\n }\n loadIcon() {\n if (Build.isBrowser && this.isVisible) {\n const url = getUrl(this);\n if (url) {\n if (pdsIconContent.has(url)) {\n this.svgContent = pdsIconContent.get(url);\n }\n else {\n getSvgContent(url).then(() => (this.svgContent = pdsIconContent.get(url)));\n }\n }\n }\n const label = getName(this.name, this.icon);\n if (label) {\n this.ariaLabel = label.replace(/\\-/g, ' ');\n }\n }\n render() {\n const { ariaLabel, inheritedAttributes } = this;\n return (h(Host, Object.assign({ key: '4bbc232e2530d43e8b5afefb754486d94ea6538b', \"aria-label\": ariaLabel !== undefined && !this.hasAriaHidden() ? ariaLabel : null, alt: \"\", role: \"img\", class: Object.assign({}, createColorClasses(this.color)) }, inheritedAttributes), Build.isBrowser && this.svgContent ? (h(\"div\", { class: \"icon-inner\", innerHTML: this.svgContent })) : (h(\"div\", { class: \"icon-inner\" }))));\n }\n /*****\n * Private Methods\n ****/\n waitUntilVisible(el, rootMargin, cb) {\n if (Build.isBrowser && typeof window !== 'undefined' && (window).IntersectionObserver) {\n const io = (this.io = new (window).IntersectionObserver((data) => {\n if (data[0].isIntersecting) {\n io.disconnect();\n this.io = undefined;\n cb();\n }\n }, { rootMargin }));\n io.observe(el);\n }\n else {\n // browser doesn't support IntersectionObserver\n // so just fallback to always show it\n cb();\n }\n }\n static get is() { return \"pds-icon\"; }\n static get encapsulation() { return \"shadow\"; }\n static get originalStyleUrls() {\n return {\n \"$\": [\"pds-icon.scss\"]\n };\n }\n static get styleUrls() {\n return {\n \"$\": [\"pds-icon.css\"]\n };\n }\n static get assetsDirs() { return [\"svg\"]; }\n static get properties() {\n return {\n \"color\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"\\nThe color of the icon\"\n },\n \"getter\": false,\n \"setter\": false,\n \"attribute\": \"color\",\n \"reflect\": false\n },\n \"icon\": {\n \"type\": \"any\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"any\",\n \"resolved\": \"any\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"This a combination of both `name` and `src`. If a `src` url is detected\\nit will set the `src` property. Otherwise it assumes it's a built-in named\\nSVG and set the `name` property.\"\n },\n \"getter\": false,\n \"setter\": false,\n \"attribute\": \"icon\",\n \"reflect\": false\n },\n \"name\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The name of the icon to use from\\nthe built-in set.\"\n },\n \"getter\": false,\n \"setter\": false,\n \"attribute\": \"name\",\n \"reflect\": true\n },\n \"size\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"| 'small' // 12px\\n | 'regular' // 16px\\n | 'medium' // 20px\\n | 'large' // 24px\\n | 'auto'\\n | string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The size of the icon. This can be\\n'small', 'regular', 'medium', large, or a\\ncustom value (40px, 1rem, etc)\"\n },\n \"getter\": false,\n \"setter\": false,\n \"attribute\": \"size\",\n \"reflect\": true,\n \"defaultValue\": \"'regular'\"\n },\n \"src\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"\\nSpecifies the exact `src` of an SVG file to use.\"\n },\n \"getter\": false,\n \"setter\": false,\n \"attribute\": \"src\",\n \"reflect\": false\n }\n };\n }\n static get states() {\n return {\n \"ariaLabel\": {},\n \"isVisible\": {},\n \"svgContent\": {}\n };\n }\n static get elementRef() { return \"el\"; }\n static get watchers() {\n return [{\n \"propName\": \"size\",\n \"methodName\": \"updateStyles\"\n }, {\n \"propName\": \"color\",\n \"methodName\": \"updateStyles\"\n }, {\n \"propName\": \"name\",\n \"methodName\": \"loadIcon\"\n }, {\n \"propName\": \"src\",\n \"methodName\": \"loadIcon\"\n }, {\n \"propName\": \"icon\",\n \"methodName\": \"loadIcon\"\n }];\n }\n}\nconst createColorClasses = (color) => {\n return color\n ? {\n 'pds-color': true,\n [`pds-color-${color}`]: true,\n }\n : null;\n};\n//# sourceMappingURL=pds-icon.js.map\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"p-amsdFwC6.system.js","sources":["../../node_modules/@pine-ds/icons/dist/collection/components/pds-icon/assetPath.js","../../node_modules/@pine-ds/icons/dist/collection/components/pds-icon/utils.js","../../node_modules/@pine-ds/icons/dist/collection/components/pds-icon/validate.js","../../node_modules/@pine-ds/icons/dist/collection/components/pds-icon/request.js","../../node_modules/@pine-ds/icons/dist/collection/components/pds-icon/pds-icon.css?tag=pds-icon&encapsulation=shadow","../../node_modules/@pine-ds/icons/dist/collection/components/pds-icon/pds-icon.js"],"sourcesContent":["import { Build } from \"@stencil/core\";\nlet missingAssetPathWarning = false;\n/**\n *\n * Reads the component asset path config from meta tag or a global variable.\n * This is a temporary workaround until these issues have been addressed:\n *\n * https://github.com/ionic-team/stencil/issues/2826/\n * https://github.com/ionic-team/stencil/issues/3470\n * https://github.com/ionic-team/stencil-ds-output-targets/issues/186\n */\nexport const getAssetPath = (path) => {\n var _a;\n const metaPineAssetPath = (_a = document.head.querySelector('meta[data-pine-asset-path]')) === null || _a === void 0 ? void 0 : _a.dataset.pineAssetPath;\n // Get the asset path from the window object if available\n const windowAssetPath = window.__PINE_ASSET_PATH__;\n // Set the CDN Asset path using the latest version\n const cdnAssetPath = 'https://cdn.jsdelivr.net/npm/@pine-ds/icons/dist/';\n const assetBasePath = Build.isTesting ? '/dist/pds-icons' : metaPineAssetPath || windowAssetPath || cdnAssetPath || '/';\n // Display a warning if the assets are fetched from the CDN.\n if (assetBasePath.startsWith('https://cdn.jsdelivr.net/npm/') && !missingAssetPathWarning) {\n missingAssetPathWarning = true;\n console.warn(`\n Fetching Pine assets from jsDelivr CDN.\\n\\n It's recommended that you bundle Pine Assets with your application and set the path accordingly.\\n\\nFor more information, read the documentation: \\nhttps://pine-design-system.netlify.app/?path=/docs/resources-assets--docs\n `);\n }\n let assetPath = path;\n if (path.startsWith('./')) {\n assetPath = path.substring(2);\n }\n if (!assetBasePath.endsWith('/')) {\n assetPath = '/' + assetPath;\n }\n return assetBasePath + assetPath;\n};\n//# sourceMappingURL=assetPath.js.map\n","import { getAssetPath } from \"./assetPath\";\nlet CACHED_MAP;\nexport const addIcons = (icons) => {\n const map = getIconMap();\n Object.keys(icons).forEach(name => map.set(name, icons[name]));\n};\nexport const getIconMap = () => {\n if (typeof window === 'undefined') {\n return new Map();\n }\n else {\n if (!CACHED_MAP) {\n const win = window; // eslint-disable-line @typescript-eslint/no-explicit-any\n win.PdsIcons = win.PdsIcons || {};\n CACHED_MAP = win.PdsIcons.map = win.PdsIcons.map || new Map();\n }\n return CACHED_MAP;\n }\n};\nexport const getName = (iconName, icon) => {\n if (!iconName && icon && !isSrc(icon)) {\n iconName = icon;\n }\n if (isStr(iconName)) {\n iconName = toLower(iconName);\n }\n if (!isStr(iconName) || iconName.trim() === '') {\n return null;\n }\n const invalidChars = iconName.replace(/[a-z]|-|\\d/gi, '');\n if (invalidChars != '') {\n return null;\n }\n return iconName;\n};\nconst getNamedUrl = (iconName) => {\n const url = getIconMap().get(iconName);\n if (url) {\n return url;\n }\n return getAssetPath(`svg/${iconName}.svg`);\n};\nexport const getSrc = (src) => {\n if (isStr(src)) {\n src = src.trim();\n if (isSrc(src)) {\n return src;\n }\n }\n return null;\n};\nexport const getUrl = (pdsIcon) => {\n let url = getSrc(pdsIcon.src);\n if (url) {\n return url;\n }\n url = getName(pdsIcon.name, pdsIcon.icon);\n if (url) {\n return getNamedUrl(url);\n }\n if (pdsIcon.icon) {\n url = getSrc(pdsIcon.icon);\n if (url) {\n return url;\n }\n }\n return null;\n};\nexport const isSrc = (str) => str.length > 0 && /(\\/|\\.)/.test(str);\nexport const isStr = (val) => typeof val === 'string'; // eslint-disable-line @typescript-eslint/no-explicit-any\nexport const toLower = (val) => val.toLowerCase();\n/**\n * Elements inside of web components sometimes need to inherit global attributes\n * set on the host. For example, the inner input in `pds-input` should inherit\n * the `title` attribute that developers set directly on `pds-input`. This\n * helper function should be called in componentWillLoad and assigned to a variable\n * that is later used in the render function.\n *\n * This does not need to be reactive as changing attributes on the host element\n * does not trigger a re-render.\n */\nexport const inheritAttributes = (el, attributes = []) => {\n const attributeObject = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n attributes.forEach(attr => {\n if (el.hasAttribute(attr)) {\n const value = el.getAttribute(attr);\n if (value !== null) {\n attributeObject[attr] = el.getAttribute(attr);\n }\n el.removeAttribute(attr);\n }\n });\n return attributeObject;\n};\n//# sourceMappingURL=utils.js.map\n","import { isStr } from \"./utils\";\nexport const validateContent = (svgContent) => {\n const div = document.createElement('div');\n div.innerHTML = svgContent;\n // setup this way to ensure it works on our buddy IE\n for (let i = div.childNodes.length - 1; i >= 0; i--) {\n if (div.childNodes[i].nodeName.toLowerCase() !== 'svg') {\n div.removeChild(div.childNodes[i]);\n }\n }\n // must only have 1 root element\n const svgElm = div.firstElementChild;\n if (svgElm && svgElm.nodeName.toLowerCase() === 'svg') {\n const svgClass = svgElm.getAttribute('class') || '';\n svgElm.setAttribute('class', (svgClass + ' s-pds-icon').trim());\n // root element must be an svg\n // lets double check we've got valid elements\n // do not allow scripts\n if (isValid(svgElm)) {\n return div.innerHTML;\n }\n }\n return '';\n};\nexport const isValid = (elm) => {\n if (elm.nodeType === 1) {\n if (elm.nodeName.toLowerCase() === 'script') {\n return false;\n }\n for (let i = 0; i < elm.attributes.length; i++) {\n const name = elm.attributes[i].name;\n if (isStr(name) && name.toLowerCase().indexOf('on') === 0) {\n return false;\n }\n }\n for (let i = 0; i < elm.childNodes.length; i++) {\n if (!isValid(elm.childNodes[i])) {\n return false;\n }\n }\n }\n return true;\n};\nexport const isSvgDataUrl = (url) => url.startsWith('data:image/svg+xml');\nexport const isEncodedDataUrl = (url) => url.indexOf(';utf8,') !== -1;\n//# sourceMappingURL=validate.js.map\n","import { isEncodedDataUrl, isSvgDataUrl, validateContent } from \"./validate\";\nexport const pdsIconContent = new Map();\nconst requests = new Map(); // eslint-disable-line @typescript-eslint/no-explicit-any\nlet parser;\nexport const getSvgContent = (url, sanitize = false) => {\n let req = requests.get(url);\n if (!req) {\n if (typeof fetch != 'undefined' && typeof document !== 'undefined') {\n if (isSvgDataUrl(url) && isEncodedDataUrl(url)) {\n if (!parser) {\n parser = new DOMParser();\n }\n const doc = parser.parseFromString(url, 'text/html');\n const svg = doc.querySelector('svg');\n if (svg) {\n pdsIconContent.set(url, svg.outerHTML);\n }\n return Promise.resolve();\n }\n else {\n // we don't have a request\n req = fetch(url).then((rsp) => {\n if (rsp.ok) {\n return rsp.text().then((svgContent) => {\n if (svgContent && sanitize !== false) {\n svgContent = validateContent(svgContent);\n }\n pdsIconContent.set(url, svgContent || '');\n });\n }\n pdsIconContent.set(url, '');\n });\n requests.set(url, req);\n }\n }\n else {\n pdsIconContent.set(url, '');\n return Promise.resolve();\n }\n }\n return req;\n};\n//# sourceMappingURL=request.js.map\n",":host {\n --dimension-icon-height: 16px;\n --dimension-icon-width: 16px;\n --color-icon-fill: currentColor;\n contain: strict;\n display: inline-block;\n fill: var(--color-icon-fill);\n flex-shrink: 0;\n height: var(--dimension-icon-height);\n width: var(--dimension-icon-width);\n}\n:host .pdsicon {\n fill: var(--color-icon-fill);\n}\n\n.pds-icon-fill-none {\n fill: none;\n}\n\n.icon-inner,\n.pds-icon,\nsvg {\n display: block;\n height: 100%;\n width: 100%;\n}","import { Build, Host, h } from \"@stencil/core\";\nimport { getSvgContent, pdsIconContent } from \"./request\";\nimport { getName, getUrl, inheritAttributes } from \"./utils\";\nexport class PdsIcon {\n constructor() {\n this.inheritedAttributes = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n this.isVisible = false;\n /**\n * The size of the icon. This can be\n * 'small', 'regular', 'medium', large, or a\n * custom value (40px, 1rem, etc)\n *\n */\n this.size = 'regular';\n this.hasAriaHidden = () => {\n const { el } = this;\n return el.hasAttribute('aria-hidden') && el.getAttribute('aria-hidden') === 'true';\n };\n }\n iconSize() {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const sizes = {\n small: '12px',\n regular: '16px',\n medium: '20px',\n large: '24px',\n };\n if (sizes[this.size]) {\n return sizes[this.size];\n }\n else {\n return this.size;\n }\n }\n componentDidLoad() {\n this.setCSSVariables();\n }\n componentWillLoad() {\n this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);\n this.setCSSVariables();\n }\n setCSSVariables() {\n this.el.style.setProperty(`--dimension-icon-height`, this.iconSize());\n this.el.style.setProperty(`--dimension-icon-width`, this.iconSize());\n this.el.style.setProperty(`--color-icon-fill`, typeof this.color !== 'undefined' ? this.color : 'currentColor');\n }\n connectedCallback() {\n this.waitUntilVisible(this.el, '50px', () => {\n this.isVisible = true;\n this.loadIcon();\n });\n }\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n }\n updateStyles() {\n this.setCSSVariables();\n }\n loadIcon() {\n if (Build.isBrowser && this.isVisible) {\n const url = getUrl(this);\n if (url) {\n if (pdsIconContent.has(url)) {\n this.svgContent = pdsIconContent.get(url);\n }\n else {\n getSvgContent(url).then(() => (this.svgContent = pdsIconContent.get(url)));\n }\n }\n }\n const label = getName(this.name, this.icon);\n if (label) {\n this.ariaLabel = label.replace(/\\-/g, ' ');\n }\n }\n render() {\n const { ariaLabel, inheritedAttributes } = this;\n return (h(Host, Object.assign({ key: '4bbc232e2530d43e8b5afefb754486d94ea6538b', \"aria-label\": ariaLabel !== undefined && !this.hasAriaHidden() ? ariaLabel : null, alt: \"\", role: \"img\", class: Object.assign({}, createColorClasses(this.color)) }, inheritedAttributes), Build.isBrowser && this.svgContent ? (h(\"div\", { class: \"icon-inner\", innerHTML: this.svgContent })) : (h(\"div\", { class: \"icon-inner\" }))));\n }\n /*****\n * Private Methods\n ****/\n waitUntilVisible(el, rootMargin, cb) {\n if (Build.isBrowser && typeof window !== 'undefined' && (window).IntersectionObserver) {\n const io = (this.io = new (window).IntersectionObserver((data) => {\n if (data[0].isIntersecting) {\n io.disconnect();\n this.io = undefined;\n cb();\n }\n }, { rootMargin }));\n io.observe(el);\n }\n else {\n // browser doesn't support IntersectionObserver\n // so just fallback to always show it\n cb();\n }\n }\n static get is() { return \"pds-icon\"; }\n static get encapsulation() { return \"shadow\"; }\n static get originalStyleUrls() {\n return {\n \"$\": [\"pds-icon.scss\"]\n };\n }\n static get styleUrls() {\n return {\n \"$\": [\"pds-icon.css\"]\n };\n }\n static get assetsDirs() { return [\"svg\"]; }\n static get properties() {\n return {\n \"color\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"\\nThe color of the icon\"\n },\n \"getter\": false,\n \"setter\": false,\n \"attribute\": \"color\",\n \"reflect\": false\n },\n \"icon\": {\n \"type\": \"any\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"any\",\n \"resolved\": \"any\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"This a combination of both `name` and `src`. If a `src` url is detected\\nit will set the `src` property. Otherwise it assumes it's a built-in named\\nSVG and set the `name` property.\"\n },\n \"getter\": false,\n \"setter\": false,\n \"attribute\": \"icon\",\n \"reflect\": false\n },\n \"name\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The name of the icon to use from\\nthe built-in set.\"\n },\n \"getter\": false,\n \"setter\": false,\n \"attribute\": \"name\",\n \"reflect\": true\n },\n \"size\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"| 'small' // 12px\\n | 'regular' // 16px\\n | 'medium' // 20px\\n | 'large' // 24px\\n | 'auto'\\n | string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The size of the icon. This can be\\n'small', 'regular', 'medium', large, or a\\ncustom value (40px, 1rem, etc)\"\n },\n \"getter\": false,\n \"setter\": false,\n \"attribute\": \"size\",\n \"reflect\": true,\n \"defaultValue\": \"'regular'\"\n },\n \"src\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"\\nSpecifies the exact `src` of an SVG file to use.\"\n },\n \"getter\": false,\n \"setter\": false,\n \"attribute\": \"src\",\n \"reflect\": false\n }\n };\n }\n static get states() {\n return {\n \"ariaLabel\": {},\n \"isVisible\": {},\n \"svgContent\": {}\n };\n }\n static get elementRef() { return \"el\"; }\n static get watchers() {\n return [{\n \"propName\": \"size\",\n \"methodName\": \"updateStyles\"\n }, {\n \"propName\": \"color\",\n \"methodName\": \"updateStyles\"\n }, {\n \"propName\": \"name\",\n \"methodName\": \"loadIcon\"\n }, {\n \"propName\": \"src\",\n \"methodName\": \"loadIcon\"\n }, {\n \"propName\": \"icon\",\n \"methodName\": \"loadIcon\"\n }];\n }\n}\nconst createColorClasses = (color) => {\n return color\n ? {\n 'pds-color': true,\n [`pds-color-${color}`]: true,\n }\n : null;\n};\n//# sourceMappingURL=pds-icon.js.map\n"],"names":[],"mappings":"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","x_google_ignoreList":[0,1,2,3,4,5]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
System.register(["./p-C_8VmA8d.system.js","./p-BG7_qxVr.system.js","./p-Bd19LaTb.system.js"],(function(e){"use strict";var r,i,o,n,a,t,d;return{setters:[function(e){r=e.r;i=e.c;o=e.h;n=e.H},function(e){a=e.m;t=e.a},function(e){d=e.f}],execute:function(){var s=":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 c=':host{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap}:host(.is-invalid) input{border-color:var(--pine-color-border-danger)}:host(.is-invalid) input:checked{background:var(--pine-color-danger)}:host(.is-invalid) input:checked:hover{background:var(--pine-color-danger-hover);border-color:var(--pine-color-border-danger-hover)}:host(.is-invalid) input:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host(.is-invalid) label,:host(.is-invalid) .pds-checkbox__message--error{color:var(--pine-color-text-message-danger)}:host(.is-indeterminate) input{background:var(--pine-color-accent);border-color:var(--pine-color-accent)}:host(.is-indeterminate) input:hover{background:var(--pine-color-accent);border-color:var(--pine-color-accent-hover)}:host(.is-indeterminate) input::after{border:1px solid var(--pine-color-secondary);-webkit-border-after:var(--pine-border-width-none);border-block-end:var(--pine-border-width-none);-webkit-border-before:var(--pine-border-width-none);border-block-start:var(--pine-border-width-none);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);content:"";display:block;height:7px;left:50%;position:absolute;top:50%;-webkit-transform:rotate(90deg) translate3d(-103%, 32%, 0);transform:rotate(90deg) translate3d(-103%, 32%, 0);width:4px}input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-2xs);-ms-flex:none;flex:none;height:var(--pine-dimension-sm);margin:0;-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025);position:relative;width:var(--pine-dimension-sm)}input:hover{background:var(--pine-color-background-container-hover);border:var(--pine-border-hover)}input:checked{background:var(--pine-color-accent);border-color:var(--pine-color-accent)}input:checked:hover{background:var(--pine-color-accent-hover);border-color:var(--pine-color-accent-hover)}input:checked::after{border:1px solid var(--pine-color-secondary);-webkit-border-before:var(--pine-border-width-none);border-block-start:var(--pine-border-width-none);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);content:"";display:block;height:7px;left:50%;position:absolute;top:50%;-webkit-transform:rotate(43deg) translate3d(-110%, -30%, 0);transform:rotate(43deg) translate3d(-110%, -30%, 0);width:4px}input:disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}input:disabled:checked{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled)}input:disabled:checked::after{border-color:var(--pine-color-grey-300)}input:disabled+label{cursor:not-allowed}input:disabled~.pds-checkbox__message{color:var(--pine-color-text-disabled)}input:focus-visible{outline:var(--pine-outline-focus)}label{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-checkbox__message{color:var(--pine-color-text-message);-webkit-margin-before:6px;margin-block-start:6px;-webkit-margin-start:var(--pine-dimension-md);margin-inline-start:var(--pine-dimension-md);width:100%}.pds-checkbox__message--error{display:-ms-flexbox;display:flex;font-size:var(--pine-font-size-085);gap:var(--pine-dimension-050)}.pds-checkbox__message--error pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}';var l=e("pds_checkbox",function(){function e(e){var o=this;r(this,e);this.pdsCheckboxChange=i(this,"pdsCheckboxChange");this.pdsCheckboxInput=i(this,"pdsCheckboxInput");this.checked=false;this.handleCheckboxChange=function(e){if(o.disabled){return}var r=e.target;o.checked=r.checked;o.pdsCheckboxChange.emit({checked:r.checked,value:o.value})};this.handleInput=function(){o.pdsCheckboxInput.emit({checked:o.checked,value:o.value})}}e.prototype.updateIndeterminate=function(){this.indeterminate=undefined};e.prototype.classNames=function(){var e=[];if(this.invalid){e.push("is-invalid")}if(this.indeterminate){e.push("is-indeterminate")}if(this.disabled){e.push("is-disabled")}return e.join(" ")};e.prototype.render=function(){return o(n,{key:"794592fc5d1ab9b5d8efcc7b0708d0c008c0a62b",class:this.classNames()},o("label",{key:"f3f9c70f1a09685b1ce982bf4ec75d2386b98c99",htmlFor:this.componentId},o("input",{key:"c3d1c366b3c1e5e742971e12371ad609eddd9644",type:"checkbox","aria-describedby":t(this.componentId,this.invalid,this.helperMessage),"aria-invalid":this.invalid?"true":undefined,id:this.componentId,indeterminate:this.indeterminate,name:this.name,value:this.value,checked:this.checked,required:this.required,disabled:this.disabled,onChange:this.handleCheckboxChange,onInput:this.handleInput}),o("span",{key:"f7a85767dce55d15eaf087cc1ca072a4b5014aac",class:this.hideLabel?"visually-hidden":""},this.label)),this.helperMessage&&o("div",{key:"fc93320dcc90533a3b31b10bf1b7d8415d38781f",class:"pds-checkbox__message",id:a(this.componentId,"helper")},this.helperMessage),this.errorMessage&&o("div",{key:"1cfc39921da6bb9103650a367eca38d7eb68da1e",class:"pds-checkbox__message pds-checkbox__message--error",id:a(this.componentId,"error"),"aria-live":"assertive"},o("pds-icon",{key:"e449ff1c84a1262a09b08369161a731574568f4c",icon:d,size:"small"}),this.errorMessage))};Object.defineProperty(e,"watchers",{get:function(){return{checked:["updateIndeterminate"]}},enumerable:false,configurable:true});return e}());l.style=s+c}}}));
|
|
2
|
-
//# sourceMappingURL=p-b41dee6f.system.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["labelCss","pdsCheckboxCss","PdsCheckbox","exports","class_1","hostRef","_this","this","checked","handleCheckboxChange","e","disabled","target","pdsCheckboxChange","emit","value","handleInput","pdsCheckboxInput","prototype","updateIndeterminate","indeterminate","undefined","classNames","invalid","push","join","render","h","Host","key","class","htmlFor","componentId","type","assignDescription","helperMessage","id","name","required","onChange","onInput","hideLabel","label","messageId","errorMessage","icon","danger","size"],"sources":["src/global/styles/utils/label.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.tsx"],"sourcesContent":[":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 align-items: center;\n display: flex;\n flex-flow: row wrap;\n}\n\n:host(.is-invalid) {\n input {\n border-color: var(--pine-color-border-danger);\n\n &:checked {\n background: var( --pine-color-danger);\n\n &:hover {\n background: var(--pine-color-danger-hover);\n border-color: var(--pine-color-border-danger-hover);\n }\n }\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n\n label,\n .pds-checkbox__message--error {\n color: var(--pine-color-text-message-danger);\n }\n}\n\n:host(.is-indeterminate) {\n input {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent);\n\n &:hover {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent-hover);\n }\n\n &::after {\n border: 1px solid var(--pine-color-secondary);\n border-block-end: var(--pine-border-width-none);\n border-block-start: var(--pine-border-width-none);\n border-inline-start: var(--pine-border-width-none);\n content: \"\";\n display: block;\n height: 7px;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: rotate(90deg) translate3d(-103%, 32%, 0);\n width: 4px;\n }\n }\n}\n\ninput {\n appearance: none;\n background: var(--pine-color-background-container);\n border: var(--pine-border);\n border-radius: var(--pine-dimension-2xs);\n flex: none;\n height: var(--pine-dimension-sm);\n margin: 0;\n margin-block-start: var(--pine-dimension-025);\n position: relative;\n width: var(--pine-dimension-sm);\n\n &:hover {\n background: var(--pine-color-background-container-hover);\n border: var(--pine-border-hover);\n }\n\n &:checked {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent);\n\n &:hover {\n background: var(--pine-color-accent-hover);\n border-color: var(--pine-color-accent-hover);\n }\n\n &::after {\n border: 1px solid var(--pine-color-secondary);\n border-block-start: var(--pine-border-width-none);\n border-inline-start: var(--pine-border-width-none);\n content: \"\";\n display: block;\n height: 7px;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: rotate(43deg) translate3d(-110%, -30%, 0);\n width: 4px;\n }\n }\n\n &:disabled {\n background: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n cursor: not-allowed;\n\n &:checked {\n background: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n\n &::after {\n border-color: var(--pine-color-grey-300);\n }\n }\n\n + label {\n cursor: not-allowed;\n }\n\n ~ .pds-checkbox__message {\n color: var(--pine-color-text-disabled);\n }\n }\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n }\n}\n\nlabel {\n display: flex;\n gap: var(--pine-dimension-xs);\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n.pds-checkbox__message {\n color: var(--pine-color-text-message);\n margin-block-start: 6px;\n margin-inline-start: var(--pine-dimension-md);\n width: 100%;\n}\n\n.pds-checkbox__message--error {\n display: flex;\n font-size: var(--pine-font-size-085);\n gap: var(--pine-dimension-050);\n\n pds-icon {\n margin-block-start: var(--pine-dimension-025);\n }\n}\n","import { Component, h, Prop, Host, Event, EventEmitter, Watch } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { CheckboxChangeEventDetail } from './checkbox-interface';\nimport { danger } from '@pine-ds/icons/icons';\n\n@Component({\n tag: 'pds-checkbox',\n styleUrls: ['../../global/styles/utils/label.scss', 'pds-checkbox.scss'],\n shadow: true,\n})\nexport class PdsCheckbox {\n /**\n * It determines whether or not the checkbox is checked.\n */\n @Prop({ mutable: true }) checked?: boolean = false;\n\n /**\n * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * It determines whether or not the checkbox is disabled.\n */\n @Prop() disabled: boolean;\n\n /**\n * Displays message text describing an invalid state.\n */\n @Prop() errorMessage: string;\n\n /**\n * String used for helper message below checkbox.\n */\n @Prop() helperMessage: string;\n\n /**\n * If `true`, the checkbox will visually appear as indeterminate.\n * Only JavaScript can set the objects `indeterminate` property. See [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes).\n */\n @Prop({ mutable: true }) indeterminate: boolean;\n\n /**\n * It determines whether or not the checkbox is invalid.\n */\n @Prop() invalid: boolean;\n\n /**\n * String used for label text next to checkbox.\n */\n @Prop() label: string;\n\n /**\n * Visually hides the label text for instances where only the checkbox should be displayed. Label remains accessible to assistive technology such as screen readers.\n */\n @Prop() hideLabel: boolean;\n\n /**\n * String used for checkbox `name` attribute.\n */\n @Prop() name: string;\n\n /**\n * It determines whether or not the checkbox is required.\n */\n @Prop() required: boolean;\n\n /**\n * The value of the checkbox that is submitted with a form.\n */\n @Prop() value: string;\n\n /**\n * Event emitted that contains the `value` and `checked`.\n */\n @Event() pdsCheckboxChange: EventEmitter<CheckboxChangeEventDetail>;\n\n @Event() pdsCheckboxInput: EventEmitter<CheckboxChangeEventDetail>;\n\n @Watch('checked')\n updateIndeterminate() {\n this.indeterminate = undefined\n }\n\n private handleCheckboxChange = (e: Event) => {\n if (this.disabled) {\n return;\n }\n\n const target = e.target as HTMLInputElement;\n this.checked = target.checked;\n\n this.pdsCheckboxChange.emit({\n checked: target.checked,\n value: this.value\n });\n }\n\n private handleInput = () => {\n this.pdsCheckboxInput.emit({\n checked: this.checked,\n value: this.value\n });\n }\n\n private classNames() {\n const classNames = [];\n\n if (this.invalid) { classNames.push('is-invalid'); }\n if (this.indeterminate) { classNames.push('is-indeterminate'); }\n if (this.disabled) { classNames.push('is-disabled'); }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host class={this.classNames()}>\n <label htmlFor={this.componentId}>\n <input\n type=\"checkbox\"\n aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n id={this.componentId}\n indeterminate={this.indeterminate}\n name={this.name}\n value={this.value}\n checked={this.checked}\n required={this.required}\n disabled={this.disabled}\n onChange={this.handleCheckboxChange}\n onInput={this.handleInput}\n />\n <span class={this.hideLabel ? 'visually-hidden' : ''}>\n {this.label}\n </span>\n </label>\n {this.helperMessage &&\n <div\n class={'pds-checkbox__message'}\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </div>\n }\n {this.errorMessage &&\n <div\n class={`pds-checkbox__message pds-checkbox__message--error`}\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </div>\n }\n </Host>\n );\n }\n}\n"],"mappings":"8PAAA,IAAMA,EAAW,qTCAjB,IAAMC,EAAiB,guH,ICUVC,EAAWC,EAAA,0BALxB,SAAAC,EAAAC,GAAA,IAAAC,EAAAC,K,8GAS2BA,KAAOC,QAAa,MAsErCD,KAAAE,qBAAuB,SAACC,GAC9B,GAAIJ,EAAKK,SAAU,CACjB,M,CAGF,IAAMC,EAASF,EAAEE,OACjBN,EAAKE,QAAUI,EAAOJ,QAEtBF,EAAKO,kBAAkBC,KAAK,CAC1BN,QAASI,EAAOJ,QAChBO,MAAOT,EAAKS,OAEhB,EAEQR,KAAWS,YAAG,WACpBV,EAAKW,iBAAiBH,KAAK,CACzBN,QAASF,EAAKE,QACdO,MAAOT,EAAKS,OAEhB,CAuDD,CA9ECX,EAAAc,UAAAC,oBAAA,WACEZ,KAAKa,cAAgBC,S,EAwBfjB,EAAAc,UAAAI,WAAA,WACN,IAAMA,EAAa,GAEnB,GAAIf,KAAKgB,QAAS,CAAED,EAAWE,KAAK,a,CACpC,GAAIjB,KAAKa,cAAe,CAAEE,EAAWE,KAAK,mB,CAC1C,GAAIjB,KAAKI,SAAU,CAAEW,EAAWE,KAAK,c,CAErC,OAAOF,EAAWG,KAAK,K,EAGzBrB,EAAAc,UAAAQ,OAAA,WACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAOvB,KAAKe,cAChBK,EAAA,SAAAE,IAAA,2CAAOE,QAASxB,KAAKyB,aACnBL,EAAA,SAAAE,IAAA,2CACEI,KAAK,WAAU,mBACGC,EAAkB3B,KAAKyB,YAAazB,KAAKgB,QAAShB,KAAK4B,eAC3D,eAAA5B,KAAKgB,QAAU,OAASF,UACtCe,GAAI7B,KAAKyB,YACTZ,cAAeb,KAAKa,cACpBiB,KAAM9B,KAAK8B,KACXtB,MAAOR,KAAKQ,MACZP,QAASD,KAAKC,QACd8B,SAAU/B,KAAK+B,SACf3B,SAAUJ,KAAKI,SACf4B,SAAUhC,KAAKE,qBACf+B,QAASjC,KAAKS,cAEhBW,EAAA,QAAAE,IAAA,2CAAMC,MAAOvB,KAAKkC,UAAY,kBAAoB,IAC/ClC,KAAKmC,QAGTnC,KAAK4B,eACJR,EAAA,OAAAE,IAAA,2CACEC,MAAO,wBACPM,GAAIO,EAAUpC,KAAKyB,YAAa,WAE/BzB,KAAK4B,eAGT5B,KAAKqC,cACJjB,EAAA,OAAAE,IAAA,2CACEC,MAAO,qDACPM,GAAIO,EAAUpC,KAAKyB,YAAa,SAAQ,YAC9B,aAEVL,EAAA,YAAAE,IAAA,2CAAUgB,KAAMC,EAAQC,KAAK,UAC5BxC,KAAKqC,c,4IA9IM,I","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as e,c as r,h as i,H as o}from"./p-Uh5ntVcq.js";import{m as a,a as n}from"./p-DTL_39D_.js";import{f as t}from"./p-mVZRKoXd.js";const s=":host{display:inline-block}:host([aria-disabled=true]) label{color:var(--pine-color-text-label-disabled)}:host([aria-readonly=true]) label{color:var(--pine-color-text-label-readonly)}label{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}";const d=':host{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap}:host(.is-invalid) input{border-color:var(--pine-color-border-danger)}:host(.is-invalid) input:checked{background:var(--pine-color-danger)}:host(.is-invalid) input:checked:hover{background:var(--pine-color-danger-hover);border-color:var(--pine-color-border-danger-hover)}:host(.is-invalid) input:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}:host(.is-invalid) label,:host(.is-invalid) .pds-checkbox__message--error{color:var(--pine-color-text-message-danger)}:host(.is-indeterminate) input{background:var(--pine-color-accent);border-color:var(--pine-color-accent)}:host(.is-indeterminate) input:hover{background:var(--pine-color-accent);border-color:var(--pine-color-accent-hover)}:host(.is-indeterminate) input::after{border:1px solid var(--pine-color-secondary);-webkit-border-after:var(--pine-border-width-none);border-block-end:var(--pine-border-width-none);-webkit-border-before:var(--pine-border-width-none);border-block-start:var(--pine-border-width-none);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);content:"";display:block;height:7px;left:50%;position:absolute;top:50%;-webkit-transform:rotate(90deg) translate3d(-103%, 32%, 0);transform:rotate(90deg) translate3d(-103%, 32%, 0);width:4px}input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-2xs);-ms-flex:none;flex:none;height:var(--pine-dimension-sm);margin:0;-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025);position:relative;width:var(--pine-dimension-sm)}input:hover{background:var(--pine-color-background-container-hover);border:var(--pine-border-hover)}input:checked{background:var(--pine-color-accent);border-color:var(--pine-color-accent)}input:checked:hover{background:var(--pine-color-accent-hover);border-color:var(--pine-color-accent-hover)}input:checked::after{border:1px solid var(--pine-color-secondary);-webkit-border-before:var(--pine-border-width-none);border-block-start:var(--pine-border-width-none);-webkit-border-start:var(--pine-border-width-none);border-inline-start:var(--pine-border-width-none);content:"";display:block;height:7px;left:50%;position:absolute;top:50%;-webkit-transform:rotate(43deg) translate3d(-110%, -30%, 0);transform:rotate(43deg) translate3d(-110%, -30%, 0);width:4px}input:disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);cursor:not-allowed}input:disabled:checked{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled)}input:disabled:checked::after{border-color:var(--pine-color-grey-300)}input:disabled+label{cursor:not-allowed}input:disabled~.pds-checkbox__message{color:var(--pine-color-text-disabled)}input:focus-visible{outline:var(--pine-outline-focus)}label{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs)}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-checkbox__message{color:var(--pine-color-text-message);-webkit-margin-before:6px;margin-block-start:6px;-webkit-margin-start:var(--pine-dimension-md);margin-inline-start:var(--pine-dimension-md);width:100%}.pds-checkbox__message--error{display:-ms-flexbox;display:flex;font-size:var(--pine-font-size-085);gap:var(--pine-dimension-050)}.pds-checkbox__message--error pds-icon{-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}';const c=class{constructor(i){e(this,i);this.pdsCheckboxChange=r(this,"pdsCheckboxChange");this.pdsCheckboxInput=r(this,"pdsCheckboxInput");this.checked=false;this.handleCheckboxChange=e=>{if(this.disabled){return}const r=e.target;this.checked=r.checked;this.pdsCheckboxChange.emit({checked:r.checked,value:this.value})};this.handleInput=()=>{this.pdsCheckboxInput.emit({checked:this.checked,value:this.value})}}updateIndeterminate(){this.indeterminate=undefined}classNames(){const e=[];if(this.invalid){e.push("is-invalid")}if(this.indeterminate){e.push("is-indeterminate")}if(this.disabled){e.push("is-disabled")}return e.join(" ")}render(){return i(o,{key:"794592fc5d1ab9b5d8efcc7b0708d0c008c0a62b",class:this.classNames()},i("label",{key:"f3f9c70f1a09685b1ce982bf4ec75d2386b98c99",htmlFor:this.componentId},i("input",{key:"c3d1c366b3c1e5e742971e12371ad609eddd9644",type:"checkbox","aria-describedby":n(this.componentId,this.invalid,this.helperMessage),"aria-invalid":this.invalid?"true":undefined,id:this.componentId,indeterminate:this.indeterminate,name:this.name,value:this.value,checked:this.checked,required:this.required,disabled:this.disabled,onChange:this.handleCheckboxChange,onInput:this.handleInput}),i("span",{key:"f7a85767dce55d15eaf087cc1ca072a4b5014aac",class:this.hideLabel?"visually-hidden":""},this.label)),this.helperMessage&&i("div",{key:"fc93320dcc90533a3b31b10bf1b7d8415d38781f",class:"pds-checkbox__message",id:a(this.componentId,"helper")},this.helperMessage),this.errorMessage&&i("div",{key:"1cfc39921da6bb9103650a367eca38d7eb68da1e",class:`pds-checkbox__message pds-checkbox__message--error`,id:a(this.componentId,"error"),"aria-live":"assertive"},i("pds-icon",{key:"e449ff1c84a1262a09b08369161a731574568f4c",icon:t,size:"small"}),this.errorMessage))}static get watchers(){return{checked:["updateIndeterminate"]}}};c.style=s+d;export{c as pds_checkbox};
|
|
2
|
-
//# sourceMappingURL=p-e7bf0be9.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["labelCss","pdsCheckboxCss","PdsCheckbox","constructor","hostRef","this","checked","handleCheckboxChange","e","disabled","target","pdsCheckboxChange","emit","value","handleInput","pdsCheckboxInput","updateIndeterminate","indeterminate","undefined","classNames","invalid","push","join","render","h","Host","key","class","htmlFor","componentId","type","assignDescription","helperMessage","id","name","required","onChange","onInput","hideLabel","label","messageId","errorMessage","icon","danger","size"],"sources":["src/global/styles/utils/label.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.tsx"],"sourcesContent":[":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 align-items: center;\n display: flex;\n flex-flow: row wrap;\n}\n\n:host(.is-invalid) {\n input {\n border-color: var(--pine-color-border-danger);\n\n &:checked {\n background: var( --pine-color-danger);\n\n &:hover {\n background: var(--pine-color-danger-hover);\n border-color: var(--pine-color-border-danger-hover);\n }\n }\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n\n label,\n .pds-checkbox__message--error {\n color: var(--pine-color-text-message-danger);\n }\n}\n\n:host(.is-indeterminate) {\n input {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent);\n\n &:hover {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent-hover);\n }\n\n &::after {\n border: 1px solid var(--pine-color-secondary);\n border-block-end: var(--pine-border-width-none);\n border-block-start: var(--pine-border-width-none);\n border-inline-start: var(--pine-border-width-none);\n content: \"\";\n display: block;\n height: 7px;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: rotate(90deg) translate3d(-103%, 32%, 0);\n width: 4px;\n }\n }\n}\n\ninput {\n appearance: none;\n background: var(--pine-color-background-container);\n border: var(--pine-border);\n border-radius: var(--pine-dimension-2xs);\n flex: none;\n height: var(--pine-dimension-sm);\n margin: 0;\n margin-block-start: var(--pine-dimension-025);\n position: relative;\n width: var(--pine-dimension-sm);\n\n &:hover {\n background: var(--pine-color-background-container-hover);\n border: var(--pine-border-hover);\n }\n\n &:checked {\n background: var(--pine-color-accent);\n border-color: var(--pine-color-accent);\n\n &:hover {\n background: var(--pine-color-accent-hover);\n border-color: var(--pine-color-accent-hover);\n }\n\n &::after {\n border: 1px solid var(--pine-color-secondary);\n border-block-start: var(--pine-border-width-none);\n border-inline-start: var(--pine-border-width-none);\n content: \"\";\n display: block;\n height: 7px;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: rotate(43deg) translate3d(-110%, -30%, 0);\n width: 4px;\n }\n }\n\n &:disabled {\n background: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n cursor: not-allowed;\n\n &:checked {\n background: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n\n &::after {\n border-color: var(--pine-color-grey-300);\n }\n }\n\n + label {\n cursor: not-allowed;\n }\n\n ~ .pds-checkbox__message {\n color: var(--pine-color-text-disabled);\n }\n }\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n }\n}\n\nlabel {\n display: flex;\n gap: var(--pine-dimension-xs);\n}\n\n.visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n.pds-checkbox__message {\n color: var(--pine-color-text-message);\n margin-block-start: 6px;\n margin-inline-start: var(--pine-dimension-md);\n width: 100%;\n}\n\n.pds-checkbox__message--error {\n display: flex;\n font-size: var(--pine-font-size-085);\n gap: var(--pine-dimension-050);\n\n pds-icon {\n margin-block-start: var(--pine-dimension-025);\n }\n}\n","import { Component, h, Prop, Host, Event, EventEmitter, Watch } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { CheckboxChangeEventDetail } from './checkbox-interface';\nimport { danger } from '@pine-ds/icons/icons';\n\n@Component({\n tag: 'pds-checkbox',\n styleUrls: ['../../global/styles/utils/label.scss', 'pds-checkbox.scss'],\n shadow: true,\n})\nexport class PdsCheckbox {\n /**\n * It determines whether or not the checkbox is checked.\n */\n @Prop({ mutable: true }) checked?: boolean = false;\n\n /**\n * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.\n */\n @Prop() componentId!: string;\n\n /**\n * It determines whether or not the checkbox is disabled.\n */\n @Prop() disabled: boolean;\n\n /**\n * Displays message text describing an invalid state.\n */\n @Prop() errorMessage: string;\n\n /**\n * String used for helper message below checkbox.\n */\n @Prop() helperMessage: string;\n\n /**\n * If `true`, the checkbox will visually appear as indeterminate.\n * Only JavaScript can set the objects `indeterminate` property. See [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes).\n */\n @Prop({ mutable: true }) indeterminate: boolean;\n\n /**\n * It determines whether or not the checkbox is invalid.\n */\n @Prop() invalid: boolean;\n\n /**\n * String used for label text next to checkbox.\n */\n @Prop() label: string;\n\n /**\n * Visually hides the label text for instances where only the checkbox should be displayed. Label remains accessible to assistive technology such as screen readers.\n */\n @Prop() hideLabel: boolean;\n\n /**\n * String used for checkbox `name` attribute.\n */\n @Prop() name: string;\n\n /**\n * It determines whether or not the checkbox is required.\n */\n @Prop() required: boolean;\n\n /**\n * The value of the checkbox that is submitted with a form.\n */\n @Prop() value: string;\n\n /**\n * Event emitted that contains the `value` and `checked`.\n */\n @Event() pdsCheckboxChange: EventEmitter<CheckboxChangeEventDetail>;\n\n @Event() pdsCheckboxInput: EventEmitter<CheckboxChangeEventDetail>;\n\n @Watch('checked')\n updateIndeterminate() {\n this.indeterminate = undefined\n }\n\n private handleCheckboxChange = (e: Event) => {\n if (this.disabled) {\n return;\n }\n\n const target = e.target as HTMLInputElement;\n this.checked = target.checked;\n\n this.pdsCheckboxChange.emit({\n checked: target.checked,\n value: this.value\n });\n }\n\n private handleInput = () => {\n this.pdsCheckboxInput.emit({\n checked: this.checked,\n value: this.value\n });\n }\n\n private classNames() {\n const classNames = [];\n\n if (this.invalid) { classNames.push('is-invalid'); }\n if (this.indeterminate) { classNames.push('is-indeterminate'); }\n if (this.disabled) { classNames.push('is-disabled'); }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host class={this.classNames()}>\n <label htmlFor={this.componentId}>\n <input\n type=\"checkbox\"\n aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n id={this.componentId}\n indeterminate={this.indeterminate}\n name={this.name}\n value={this.value}\n checked={this.checked}\n required={this.required}\n disabled={this.disabled}\n onChange={this.handleCheckboxChange}\n onInput={this.handleInput}\n />\n <span class={this.hideLabel ? 'visually-hidden' : ''}>\n {this.label}\n </span>\n </label>\n {this.helperMessage &&\n <div\n class={'pds-checkbox__message'}\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </div>\n }\n {this.errorMessage &&\n <div\n class={`pds-checkbox__message pds-checkbox__message--error`}\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </div>\n }\n </Host>\n );\n }\n}\n"],"mappings":"wIAAA,MAAMA,EAAW,qTCAjB,MAAMC,EAAiB,guH,MCUVC,EAAW,MALxB,WAAAC,CAAAC,G,8GAS2BC,KAAOC,QAAa,MAsErCD,KAAAE,qBAAwBC,IAC9B,GAAIH,KAAKI,SAAU,CACjB,M,CAGF,MAAMC,EAASF,EAAEE,OACjBL,KAAKC,QAAUI,EAAOJ,QAEtBD,KAAKM,kBAAkBC,KAAK,CAC1BN,QAASI,EAAOJ,QAChBO,MAAOR,KAAKQ,OACZ,EAGIR,KAAWS,YAAG,KACpBT,KAAKU,iBAAiBH,KAAK,CACzBN,QAASD,KAAKC,QACdO,MAAOR,KAAKQ,OACZ,CAwDL,CA9EC,mBAAAG,GACEX,KAAKY,cAAgBC,S,CAwBf,UAAAC,GACN,MAAMA,EAAa,GAEnB,GAAId,KAAKe,QAAS,CAAED,EAAWE,KAAK,a,CACpC,GAAIhB,KAAKY,cAAe,CAAEE,EAAWE,KAAK,mB,CAC1C,GAAIhB,KAAKI,SAAU,CAAEU,EAAWE,KAAK,c,CAErC,OAAOF,EAAWG,KAAK,K,CAGzB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAOtB,KAAKc,cAChBK,EAAA,SAAAE,IAAA,2CAAOE,QAASvB,KAAKwB,aACnBL,EAAA,SAAAE,IAAA,2CACEI,KAAK,WAAU,mBACGC,EAAkB1B,KAAKwB,YAAaxB,KAAKe,QAASf,KAAK2B,eAC3D,eAAA3B,KAAKe,QAAU,OAASF,UACtCe,GAAI5B,KAAKwB,YACTZ,cAAeZ,KAAKY,cACpBiB,KAAM7B,KAAK6B,KACXrB,MAAOR,KAAKQ,MACZP,QAASD,KAAKC,QACd6B,SAAU9B,KAAK8B,SACf1B,SAAUJ,KAAKI,SACf2B,SAAU/B,KAAKE,qBACf8B,QAAShC,KAAKS,cAEhBU,EAAA,QAAAE,IAAA,2CAAMC,MAAOtB,KAAKiC,UAAY,kBAAoB,IAC/CjC,KAAKkC,QAGTlC,KAAK2B,eACJR,EAAA,OAAAE,IAAA,2CACEC,MAAO,wBACPM,GAAIO,EAAUnC,KAAKwB,YAAa,WAE/BxB,KAAK2B,eAGT3B,KAAKoC,cACJjB,EAAA,OAAAE,IAAA,2CACEC,MAAO,qDACPM,GAAIO,EAAUnC,KAAKwB,YAAa,SAAQ,YAC9B,aAEVL,EAAA,YAAAE,IAAA,2CAAUgB,KAAMC,EAAQC,KAAK,UAC5BvC,KAAKoC,c","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as o,c as r,h as e,H as t,g as n}from"./p-Uh5ntVcq.js";import{h as i}from"./p-Dw9B1JDC.js";import{b as a}from"./p-mVZRKoXd.js";const d=":host{--button-dimension:40px;--color-border-default:transparent;--color-border-disabled:transparent;--color-border-focus:transparent;--color-border-hover:transparent;--button-loader-color:var(--color-text-default);display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle}:host([full-width=true]){display:-ms-flexbox;display:flex;width:100%}:host([full-width=true]) button{-ms-flex-pack:center;justify-content:center;width:100%}:host([full-width=true]) .pds-button__content{-ms-flex-pack:center;justify-content:center;text-align:center}:host([loading=true]){cursor:wait;pointer-events:none}:host([disabled=true]){pointer-events:none}.pds-button{--pds-loader-color:var(--color-text-default);-ms-flex-align:center;align-items:center;background-color:var(--color-background-default);border:var(--pine-border);border-color:var(--color-border-default);border-radius:var(--pine-border-radius-full);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--color-text-default);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body-brand-label);letter-spacing:var(--pine-letter-spacing);min-height:var(--button-dimension);padding:var(--pine-dimension-xs) var(--pine-dimension-sm);text-decoration:none}.pds-button pds-icon{color:currentColor;fill:currentColor;-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{border-color:var(--color-border-focus);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-button:disabled{background-color:var(--color-background-disabled);border-color:var(--color-border-disabled);color:var(--color-text-disabled);pointer-events:none}.pds-button--primary{--color-background-default:var(--pine-color-primary);--color-background-hover:var(--pine-color-primary-hover);--color-background-disabled:var(--pine-color-primary-disabled);--color-border-default:var(--pine-color-primary);--color-border-hover:var(--pine-color-primary-hover);--color-text-default:var(--pine-color-text-primary);--color-text-disabled:var(--pine-color-text-primary-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-primary)}.pds-button--accent{--color-background-default:var(--pine-color-accent);--color-background-hover:var(--pine-color-accent-hover);--color-background-disabled:var(--pine-color-accent-disabled);--color-border-default:var(--pine-color-accent);--color-border-hover:var(--pine-color-accent-hover);--color-text-default:var(--pine-color-text-primary);--color-text-disabled:var(--pine-color-text-accent-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-primary)}.pds-button--destructive{--color-background-default:var(--pine-color-danger);--color-background-hover:var(--pine-color-danger-hover);--color-background-disabled:var(--pine-color-danger-disabled);--color-border-default:var(--pine-color-danger);--color-border-hover:var(--pine-color-danger-hover);--color-text-default:var(--pine-color-text-primary);--color-text-disabled:var(--pine-color-text-danger-disabled);--color-outline:var(--pine-color-focus-ring-danger);--button-loader-color:var(--pine-color-text-primary)}.pds-button--destructive:focus-visible{outline-color:var(--pine-color-focus-ring-danger)}.pds-button--secondary,.pds-button--disclosure{--color-background-default:var(--pine-color-secondary);--color-background-hover:var(--pine-color-secondary-hover);--color-background-disabled:var(--pine-color-secondary-disabled);--color-border-disabled:var(--pine-color-border-disabled);--color-border-focus:var(--pine-color-border);--color-border-hover:var(--pine-color-border-hover);--color-border-default:var(--pine-color-border);--color-text-default:var(--pine-color-text-secondary);--color-text-disabled:var(--pine-color-text-secondary-disabled);--color-outline:var(--pine-color-focus-ring);--button-loader-color:var(--pine-color-text-secondary)}.pds-button--secondary:hover,.pds-button--disclosure:hover{background-color:var(--pine-color-secondary-hover)}.pds-button--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;--button-loader-color:inherit;border-width:var(--pine-dimension-none);margin:var(--pine-dimension-none);min-height:auto;padding:var(--pine-dimension-none);width:inherit}.pds-button__content{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;position:relative;width:100%}.pds-button__text{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex}.pds-button__text--hidden,.pds-button__icon--hidden{opacity:0}.pds-button__loader{height:var(--pine-dimension-250);left:50%;position:absolute;top:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:var(--pine-dimension-250)}.pds-button--loading{cursor:wait;pointer-events:none}.pds-button--loading .pds-button__loader pds-loader{--loader-color:var(--button-loader-color)}.pds-button--icon-only{-ms-flex-align:center;align-items:center;border-radius:var(--pine-border-radius-full);height:var(--button-dimension);-ms-flex-pack:center;justify-content:center;min-height:var(--button-dimension);min-width:var(--button-dimension);padding:var(--pine-dimension-xs);width:var(--button-dimension)}.pds-button--icon-only .pds-button__content{height:100%;-ms-flex-pack:center;justify-content:center;width:100%}.pds-button--icon-only pds-icon{margin:0}.pds-button--icon-only .pds-button__text--hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}";const l=class{constructor(e){o(this,e);this.pdsClick=r(this,"pdsClick");this.disabled=false;this.fullWidth=false;this.icon=null;this.iconOnly=false;this.loading=false;this.type="button";this.variant="primary";this.handleClick=o=>{if(this.loading){o.preventDefault();return}if(!this.href&&this.type!="button"){if(i(this.el)){const r=this.el.closest("form");if(r){o.preventDefault();const e=document.createElement("button");e.type=this.type;e.style.display="none";r.appendChild(e);e.click();e.remove()}}}this.pdsClick.emit(o)}}classNames(){const o=["pds-button"];if(this.variant){o.push("pds-button--"+this.variant)}if(this.iconOnly){o.push("pds-button--icon-only")}if(this.loading){o.push("pds-button--loading")}return o.join(" ")}render(){const o={class:this.classNames(),part:"button"};const r=()=>{if(this.href){return Object.assign(Object.assign({},o),{href:this.disabled?null:this.href,target:this.target})}return Object.assign(Object.assign({},o),{"aria-busy":this.loading?"true":null,"aria-live":this.loading?"polite":null,disabled:this.disabled,name:this.name,type:this.type,value:this.value})};const n=this.href?"a":"button";const i=this.loading||this.iconOnly;const d=e("div",{class:"pds-button__content",part:"button-content"},this.icon&&this.variant!=="disclosure"&&e("pds-icon",{class:this.loading?"pds-button__icon--hidden":"",name:this.icon,part:"icon","aria-hidden":"true"}),e("span",{class:`pds-button__text ${i?"pds-button__text--hidden":""}`,part:"button-text"},e("slot",null)),this.loading&&e("span",{class:"pds-button__loader"},e("pds-loader",{"is-loading":true,size:"var(--pine-font-size-body-2xl)",variant:"spinner"},"Loading...")),this.variant==="disclosure"&&e("pds-icon",{class:this.loading?"pds-button__icon--hidden":"",icon:a,part:"caret","aria-hidden":"true"}));return e(t,{"aria-disabled":this.disabled?"true":null,id:this.componentId,onClick:this.handleClick,variant:this.variant},e(n,Object.assign({},r()),d))}get el(){return n(this)}};l.style=d;export{l as pds_button};
|
|
2
|
-
//# sourceMappingURL=p-f1156360.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["pdsButtonCss","PdsButton","constructor","hostRef","this","disabled","fullWidth","icon","iconOnly","loading","type","variant","handleClick","ev","preventDefault","href","hasShadowDom","el","form","closest","fakeButton","document","createElement","style","display","appendChild","click","remove","pdsClick","emit","classNames","push","join","render","commonProps","class","part","attributes","Object","assign","target","name","value","ContentElement","hideText","content","h","size","caretDown","Host","id","componentId","onClick"],"sources":["src/components/pds-button/pds-button.scss?tag=pds-button&encapsulation=shadow","src/components/pds-button/pds-button.tsx"],"sourcesContent":[":host {\n --button-dimension: 40px;\n --color-border-default: transparent;\n --color-border-disabled: transparent;\n --color-border-focus: transparent;\n --color-border-hover: transparent;\n --button-loader-color: var(--color-text-default);\n\n display: inline-flex;\n vertical-align: middle;\n}\n\n:host([full-width=\"true\"]) {\n display: flex;\n width: 100%;\n\n button {\n justify-content: center;\n width: 100%;\n }\n\n .pds-button__content {\n justify-content: center;\n text-align: center;\n }\n}\n\n:host([loading=\"true\"]) {\n cursor: wait;\n pointer-events: none;\n}\n\n:host([disabled=\"true\"]) {\n pointer-events: none;\n}\n\n.pds-button {\n --pds-loader-color: var(--color-text-default);\n align-items: center;\n background-color: var(--color-background-default);\n border: var(--pine-border);\n border-color: var(--color-border-default);\n border-radius: var(--pine-border-radius-full);\n box-sizing: border-box;\n color: var(--color-text-default); // Set in the variant classes below\n cursor: pointer;\n display: flex;\n font: var(--pine-typography-body-brand-label);\n letter-spacing: var(--pine-letter-spacing);\n min-height: var(--button-dimension);\n padding: var(--pine-dimension-xs) var(--pine-dimension-sm);\n text-decoration: none;\n\n pds-icon {\n color: currentColor;\n fill: currentColor;\n 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 border-color: var(--color-border-focus);\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n }\n\n &:disabled {\n background-color: var(--color-background-disabled);\n border-color: var(--color-border-disabled);\n color: var(--color-text-disabled);\n pointer-events: none;\n }\n}\n\n.pds-button--primary {\n --color-background-default: var(--pine-color-primary);\n --color-background-hover: var(--pine-color-primary-hover);\n --color-background-disabled: var(--pine-color-primary-disabled);\n --color-border-default: var(--pine-color-primary);\n --color-border-hover: var(--pine-color-primary-hover);\n --color-text-default: var(--pine-color-text-primary);\n --color-text-disabled: var(--pine-color-text-primary-disabled);\n --color-outline: var(--pine-color-focus-ring);\n --button-loader-color: var(--pine-color-text-primary);\n}\n\n.pds-button--accent {\n --color-background-default: var(--pine-color-accent);\n --color-background-hover: var(--pine-color-accent-hover);\n --color-background-disabled: var(--pine-color-accent-disabled);\n --color-border-default: var(--pine-color-accent);\n --color-border-hover: var(--pine-color-accent-hover);\n --color-text-default: var(--pine-color-text-primary);\n --color-text-disabled: var(--pine-color-text-accent-disabled);\n --color-outline: var(--pine-color-focus-ring);\n --button-loader-color: var(--pine-color-text-primary);\n}\n\n.pds-button--destructive {\n --color-background-default: var(--pine-color-danger);\n --color-background-hover: var(--pine-color-danger-hover);\n --color-background-disabled: var(--pine-color-danger-disabled);\n --color-border-default: var(--pine-color-danger);\n --color-border-hover: var(--pine-color-danger-hover);\n --color-text-default: var(--pine-color-text-primary);\n --color-text-disabled: var(--pine-color-text-danger-disabled);\n --color-outline: var(--pine-color-focus-ring-danger);\n --button-loader-color: var(--pine-color-text-primary);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n}\n\n.pds-button--secondary,\n.pds-button--disclosure {\n --color-background-default: var(--pine-color-secondary);\n --color-background-hover: var(--pine-color-secondary-hover);\n --color-background-disabled: var(--pine-color-secondary-disabled);\n --color-border-disabled: var(--pine-color-border-disabled);\n --color-border-focus: var(--pine-color-border);\n --color-border-hover: var(--pine-color-border-hover);\n --color-border-default: var(--pine-color-border);\n --color-text-default: var(--pine-color-text-secondary);\n --color-text-disabled: var(--pine-color-text-secondary-disabled);\n --color-outline: var(--pine-color-focus-ring);\n --button-loader-color: var(--pine-color-text-secondary);\n\n &:hover {\n background-color: var(--pine-color-secondary-hover);\n }\n}\n\n.pds-button--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 --button-loader-color: inherit;\n border-width: var(--pine-dimension-none);\n margin: var(--pine-dimension-none);\n min-height: auto;\n padding: var(--pine-dimension-none);\n width: inherit;\n}\n\n.pds-button__content {\n align-items: center;\n display: inline-flex;\n position: relative;\n width: 100%;\n}\n\n.pds-button__text {\n align-items: center;\n display: inline-flex;\n}\n\n.pds-button__text--hidden,\n.pds-button__icon--hidden {\n opacity: 0;\n}\n\n.pds-button__loader {\n height: var(--pine-dimension-250);\n left: 50%;\n position: absolute;\n top: 50%;\n transform: translate(-50%, -50%);\n width: var(--pine-dimension-250);\n}\n\n.pds-button--loading {\n cursor: wait;\n pointer-events: none;\n\n .pds-button__loader {\n pds-loader {\n --loader-color: var(--button-loader-color);\n }\n }\n}\n\n.pds-button--icon-only {\n align-items: center;\n border-radius: var(--pine-border-radius-full);\n height: var(--button-dimension);\n justify-content: center;\n min-height: var(--button-dimension);\n min-width: var(--button-dimension);\n padding: var(--pine-dimension-xs);\n width: var(--button-dimension);\n\n .pds-button__content {\n height: 100%;\n justify-content: center;\n width: 100%;\n }\n\n pds-icon {\n margin: 0;\n }\n\n .pds-button__text--hidden {\n border: 0;\n clip: rect(0 0 0 0);\n clip-path: polygon(0 0, 0 0, 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n }\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { hasShadowDom } from '../../utils/utils';\n\nimport { caretDown } from '@pine-ds/icons/icons';\n\n/**\n * @part button - Exposes the button element for styling.\n * @part button-content - Exposes the button content for styling.\n * @part button-text - Exposes the button text for styling.\n * @part caret - Exposes the caret icon component for styling. Appears only on the disclosure variant.\n * @part icon - Exposes the icon component for styling.\n*/\n\n@Component({\n tag: 'pds-button',\n styleUrls: ['pds-button.scss'],\n shadow: true,\n})\nexport class PdsButton {\n @Element() el: HTMLPdsButtonElement;\n\n /**\n * A unique identifier used for the underlying component `id` attribute.\n */\n @Prop() componentId: string;\n\n /**\n * Determines the button's disabled state.\n * @defaultValue false\n */\n @Prop() disabled? = false;\n\n /**\n * Determines if the button should take up the full width of its container.\n * @defaultValue false\n */\n @Prop() fullWidth? = false;\n\n /**\n * If provided, renders the component as an anchor (`<a>`) element instead of a button.\n * When using href, button-specific props (type, name, value, loading) will be ignored.\n */\n @Prop() href?: string;\n\n /**\n * Displays an icon in the button.\n * @defaultValue null\n */\n @Prop() icon?: string = null;\n\n /**\n * When true, displays only the icon and visually hides the text (keeping it accessible).\n */\n @Prop() iconOnly? = false;\n\n /**\n * Determines if the button is in a loading state.\n * When true, displays a loader and hides the button text.\n * @defaultValue false\n */\n @Prop() loading? = false;\n\n /**\n * Provides the button with a submittable name.\n */\n @Prop() name?: string;\n\n /**\n * Specifies where to open the linked document when href is provided.\n * Only applies when href is set.\n */\n @Prop() target?: '_blank' | '_self' | '_parent' | '_top';\n\n /**\n * Provides button with a type.\n * @defaultValue button\n */\n @Prop() type?: 'button' | 'reset' | 'submit' = 'button';\n\n /**\n * Provides button with a submittable value\n */\n @Prop() value?: string;\n\n /**\n * Sets the style variant of the button.\n * @defaultValue primary\n */\n @Prop() variant: 'primary' | 'secondary' | 'accent' | 'disclosure' | 'destructive' | 'unstyled' = 'primary';\n\n @Event() pdsClick: EventEmitter;\n\n private handleClick = (ev: Event) => {\n if (this.loading) {\n ev.preventDefault();\n return;\n }\n\n if (!this.href && this.type != 'button') {\n // If button clicked IS NOT associated with a form\n if (hasShadowDom(this.el)) {\n const form = this.el.closest('form');\n if (form) {\n ev.preventDefault();\n\n const fakeButton = document.createElement('button');\n fakeButton.type = this.type;\n fakeButton.style.display = 'none';\n form.appendChild(fakeButton);\n fakeButton.click();\n fakeButton.remove();\n }\n }\n }\n this.pdsClick.emit(ev);\n };\n\n private classNames() {\n const classNames = ['pds-button'];\n\n if (this.variant) {\n classNames.push('pds-button--' + this.variant);\n }\n\n if (this.iconOnly) {\n classNames.push('pds-button--icon-only');\n }\n\n if (this.loading) {\n classNames.push('pds-button--loading');\n }\n\n return classNames.join(' ');\n }\n\n render() {\n // Common props for both button and anchor elements\n const commonProps = {\n class: this.classNames(),\n part: 'button',\n };\n\n const attributes = () => {\n if (this.href) {\n return {\n // Anchor element props\n ...commonProps,\n href: this.disabled ? null : this.href,\n target: this.target,\n };\n }\n\n return {\n // Button element props\n ...commonProps,\n 'aria-busy': this.loading ? 'true' : null,\n 'aria-live': this.loading ? 'polite' : null,\n 'disabled': this.disabled,\n 'name': this.name,\n 'type': this.type,\n 'value': this.value,\n };\n };\n\n const ContentElement = this.href ? 'a' : 'button';\n\n // Hide text when loading or iconOnly is true\n const hideText = this.loading || this.iconOnly;\n\n const content = (\n <div class=\"pds-button__content\" part=\"button-content\">\n {this.icon && this.variant !== 'disclosure' &&\n <pds-icon class={this.loading ? 'pds-button__icon--hidden' : ''} name={this.icon} part=\"icon\" aria-hidden=\"true\"></pds-icon>\n }\n\n <span class={`pds-button__text ${hideText ? 'pds-button__text--hidden' : ''}`} part=\"button-text\">\n <slot />\n </span>\n\n {this.loading && (\n <span class=\"pds-button__loader\">\n <pds-loader is-loading={true} size=\"var(--pine-font-size-body-2xl)\" variant=\"spinner\">\n Loading...\n </pds-loader>\n </span>\n )}\n\n {this.variant === 'disclosure' &&\n <pds-icon class={this.loading ? 'pds-button__icon--hidden' : ''} icon={caretDown} part=\"caret\" aria-hidden=\"true\"></pds-icon>\n }\n </div>\n );\n\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n id={this.componentId}\n onClick={this.handleClick}\n variant={this.variant}\n >\n <ContentElement {...attributes()}>\n {content}\n </ContentElement>\n </Host>\n );\n }\n}\n"],"mappings":"wIAAA,MAAMA,EAAe,07L,MCkBRC,EAAS,MALtB,WAAAC,CAAAC,G,2CAiBUC,KAAQC,SAAI,MAMZD,KAASE,UAAI,MAYbF,KAAIG,KAAY,KAKhBH,KAAQI,SAAI,MAOZJ,KAAOK,QAAI,MAiBXL,KAAIM,KAAmC,SAWvCN,KAAOO,QAAmF,UAI1FP,KAAAQ,YAAeC,IACrB,GAAIT,KAAKK,QAAS,CAChBI,EAAGC,iBACH,M,CAGF,IAAKV,KAAKW,MAAQX,KAAKM,MAAQ,SAAU,CAEvC,GAAIM,EAAaZ,KAAKa,IAAK,CACzB,MAAMC,EAAOd,KAAKa,GAAGE,QAAQ,QAC7B,GAAID,EAAM,CACRL,EAAGC,iBAEH,MAAMM,EAAaC,SAASC,cAAc,UAC1CF,EAAWV,KAAON,KAAKM,KACvBU,EAAWG,MAAMC,QAAU,OAC3BN,EAAKO,YAAYL,GACjBA,EAAWM,QACXN,EAAWO,Q,GAIjBvB,KAAKwB,SAASC,KAAKhB,EAAG,CA4FzB,CAzFS,UAAAiB,GACN,MAAMA,EAAa,CAAC,cAEpB,GAAI1B,KAAKO,QAAS,CAChBmB,EAAWC,KAAK,eAAiB3B,KAAKO,Q,CAGxC,GAAIP,KAAKI,SAAU,CACjBsB,EAAWC,KAAK,wB,CAGlB,GAAI3B,KAAKK,QAAS,CAChBqB,EAAWC,KAAK,sB,CAGlB,OAAOD,EAAWE,KAAK,I,CAGzB,MAAAC,GAEE,MAAMC,EAAc,CAClBC,MAAO/B,KAAK0B,aACZM,KAAM,UAGR,MAAMC,EAAa,KACjB,GAAIjC,KAAKW,KAAM,CACb,OAEKuB,OAAAC,OAAAD,OAAAC,OAAA,GAAAL,GAAW,CACdnB,KAAMX,KAAKC,SAAW,KAAOD,KAAKW,KAClCyB,OAAQpC,KAAKoC,Q,CAIjB,OAEKF,OAAAC,OAAAD,OAAAC,OAAA,GAAAL,GACH,aAAa9B,KAAKK,QAAU,OAAS,KACrC,YAAaL,KAAKK,QAAU,SAAW,KACvCJ,SAAYD,KAAKC,SACjBoC,KAAQrC,KAAKqC,KACb/B,KAAQN,KAAKM,KACbgC,MAAStC,KAAKsC,OACd,EAGJ,MAAMC,EAAiBvC,KAAKW,KAAO,IAAM,SAGzC,MAAM6B,EAAWxC,KAAKK,SAAWL,KAAKI,SAEtC,MAAMqC,EACJC,EAAK,OAAAX,MAAM,sBAAsBC,KAAK,kBACnChC,KAAKG,MAAQH,KAAKO,UAAY,cAC7BmC,EAAU,YAAAX,MAAO/B,KAAKK,QAAU,2BAA6B,GAAIgC,KAAMrC,KAAKG,KAAM6B,KAAK,OAAmB,uBAG5GU,EAAA,QAAMX,MAAO,oBAAoBS,EAAW,2BAA6B,KAAMR,KAAK,eAClFU,EAAA,cAGD1C,KAAKK,SACJqC,EAAM,QAAAX,MAAM,sBACVW,EAAwB,gCAAMC,KAAK,iCAAiCpC,QAAQ,WAE/D,eAIhBP,KAAKO,UAAY,cAChBmC,EAAU,YAAAX,MAAO/B,KAAKK,QAAU,2BAA6B,GAAIF,KAAMyC,EAAWZ,KAAK,QAAO,cAAa,UAKjH,OACEU,EAACG,EAAI,iBACY7C,KAAKC,SAAW,OAAS,KACxC6C,GAAI9C,KAAK+C,YACTC,QAAShD,KAAKQ,YACdD,QAASP,KAAKO,SAEdmC,EAACH,EAAcL,OAAAC,OAAA,GAAKF,KACjBQ,G","ignoreList":[]}
|