npm - @pine-ds/core - Versions diffs - 3.0.0 → 3.0.1 - Mend

@pine-ds/core 3.0.0 → 3.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (348) hide show

package/dist/esm/pds-accordion.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host } from './index-Uh5ntVcq.js';
-import { d as downSmall } from './index-B_0tBgWY.js';
+import { d as downSmall } from './index-DgttLLHX.js';
 const pdsAccordionCss = ":host{display:block}details{--number-animation-transform-timing:200ms;border-radius:var(--pine-dimension-xs)}details pds-icon{-webkit-transform:scaleY(1);transform:scaleY(1)}details[open]{background-color:var(--pine-color-background-container)}details[open] summary{color:var(--pine-color-text-active);font-weight:var(--pine-font-weight-semi-bold)}details[open] summary pds-icon{-webkit-transform:scaleY(-1);transform:scaleY(-1)}summary{background-color:var(--pine-color-background-container);border-radius:var(--pine-dimension-xs);color:var(--pine-color-text-readonly);font-family:var(--pine-font-family-body);font-size:var(--pine-font-size-body-md);font-weight:var(--pine-font-weight-medium);letter-spacing:var(--pine-letter-spacing);line-height:var(--pine-line-height-body);padding-block:calc(var(--pine-dimension-2xs) * 1.5);-webkit-padding-end:var(--pine-dimension-2xs);padding-inline-end:var(--pine-dimension-2xs);-webkit-padding-start:var(--pine-dimension-xs);padding-inline-start:var(--pine-dimension-xs);-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex}summary::-webkit-details-marker{display:none}summary:hover{background:var(--pine-color-background-container-hover);color:var(--pine-color-text);cursor:pointer}summary:focus-visible{outline:var(--pine-outline-focus);position:relative}summary pds-icon{-webkit-margin-start:auto;margin-inline-start:auto}.pds-accordion__body{-webkit-padding-after:calc(var(--pine-dimension-sm) + 2);padding-block-end:calc(var(--pine-dimension-sm) + 2);padding-inline:calc(var(--pine-dimension-2xs) * 1.5)}";

package/dist/esm/pds-avatar.entry.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { r as registerInstance, h, H as Host } from './index-Uh5ntVcq.js';
-import { c as checkCircleFilled, u as userFilled } from './index-B_0tBgWY.js';
+import { c as checkCircleFilled, u as userFilled } from './index-DgttLLHX.js';
-const pdsAvatarCss = ":host{display:inline-block}div{--color-background-container:var(--pine-color-mercury-050);-ms-flex-align:center;align-items:center;background-color:var(--color-background-container);border-radius:var(--border-radius-admin-round, var(--pine-border-radius-full));display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;position:relative}:host(.pds-avatar--admin) div{--border-radius-admin-round:var(--pine-dimension-150);border-radius:var(--border-radius-admin-round)}:host(.pds-avatar--has-image) div{background:transparent}@supports selector(:has){div:has(img){background-color:transparent}}.pds-avatar__button{-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:var(--pine-dimension-none);border-radius:var(--pine-border-radius-full);cursor:pointer;display:-ms-flexbox;display:flex;padding:var(--pine-dimension-none)}.pds-avatar__button:focus-visible{outline:var(--pine-outline-focus)}.pds-avatar__badge{background-color:var(--pine-color-background-container);border:var(--pine-border);border-color:var(--pine-color-secondary);border-radius:var(--pine-border-radius-round);bottom:var(--pine-dimension-none);position:absolute;right:var(--pine-dimension-none)}img{border-radius:var(--border-radius-admin-round, var(--pine-border-radius-full));height:100%;-o-object-fit:cover;object-fit:cover;width:100%}";
+const pdsAvatarCss = ":host{display:inline-block}div{--color-background-container:var(--pine-color-mercury-050);-ms-flex-align:center;align-items:center;background-color:var(--color-background-container);border-radius:var(--border-radius-admin-round, var(--pine-border-radius-full));display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;position:relative}:host(.pds-avatar--admin) div{--border-radius-admin-round:var(--pine-dimension-150);border-radius:var(--border-radius-admin-round)}:host(.pds-avatar--has-image) div{background:transparent}@supports selector(:has){div:has(img){background-color:transparent}}.pds-avatar__button{-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:var(--pine-dimension-none);border-radius:var(--pine-border-radius-full);cursor:pointer;display:-ms-flexbox;display:flex;padding:var(--pine-dimension-none)}.pds-avatar__button:focus-visible{outline:var(--pine-outline-focus)}.pds-avatar__badge{background-color:var(--pine-color-background-container);border:var(--pine-border);border-color:var(--pine-color-secondary);border-radius:var(--pine-border-radius-round);inset-block-end:var(--pine-dimension-none);inset-inline-end:var(--pine-dimension-none);position:absolute}img{border-radius:var(--border-radius-admin-round, var(--pine-border-radius-full));height:100%;-o-object-fit:cover;object-fit:cover;width:100%}";
 const PdsAvatar = class {
     constructor(hostRef) {

package/dist/esm/pds-avatar.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pds-avatar.entry.js","sources":["src/components/pds-avatar/pds-avatar.scss?tag=pds-avatar&encapsulation=shadow","src/components/pds-avatar/pds-avatar.tsx"],"sourcesContent":[":host {\n display: inline-block;\n}\n\ndiv {\n // These custom props are not reachable\n --color-background-container: var(--pine-color-mercury-050);\n\n align-items: center;\n background-color: var(--color-background-container);\n border-radius: var(--border-radius-admin-round, var(--pine-border-radius-full));\n display: inline-flex;\n justify-content: center;\n position: relative;\n\n :host(.pds-avatar--admin) & {\n --border-radius-admin-round: var(--pine-dimension-150);\n border-radius: var(--border-radius-admin-round);\n }\n\n // Remove when FF has support for :has\n :host(.pds-avatar--has-image) & {\n background: transparent\n }\n\n @supports selector(:has) {\n &:has(img) {\n background-color: transparent\n }\n }\n}\n\n.pds-avatar__button {\n align-items: center;\n appearance: none;\n background: transparent;\n border: var(--pine-dimension-none);\n border-radius: var(--pine-border-radius-full);\n cursor: pointer;\n display: flex;\n padding: var(--pine-dimension-none);\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n }\n}\n\n.pds-avatar__badge {\n background-color: var(--pine-color-background-container);\n border: var(--pine-border);\n border-color: var(--pine-color-secondary);\n border-radius: var(--pine-border-radius-round);\n ~~bottom~~: var(--pine-dimension-none);\n ~~position~~: ~~absolute;\n right:~~ var(--pine-dimension-none);\n}\n\nimg {\n border-radius: var(--border-radius-admin-round, var(--pine-border-radius-full));\n height: 100%;\n object-fit: cover;\n width: 100%;\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport { checkCircleFilled, userFilled } from '@pine-ds/icons/icons';\n\n/*\n @part image - The main image element that represents the avatar component.\n/\n@Component({\n tag: 'pds-avatar',\n styleUrls: ['pds-avatar.scss'],\n shadow: true,\n})\nexport class PdsAvatar {\n\n /\n The alt for a custom user image.\n * @defaultValue null\n /\n @Prop() alt?: string \| null = null;\n\n /\n Determines whether the badge is visible or not.\n * @defaultValue false\n /\n @Prop() badge? = false;\n\n /\n A unique identifier used for the underlying component `id` attribute.\n /\n @Prop() componentId: string;\n\n /\n Determines whether the avatar functions as a dropdown trigger.\n * @defaultValue false\n /\n @Prop() dropdown? = false;\n\n /\n The src for a custom user image.\n * @defaultValue null\n /\n @Prop() image?: string \| null = null;\n\n /\n Size of the avatar. Value can be preset or custom.\n * @defaultValue lg\n /\n @Prop({ reflect: true }) size?:\n \| 'xl' // 64px\n \| 'lg' // 56px\n \| 'md' // 40px\n \| 'sm' // 32px\n \| 'xs' // 24px\n \| string = 'lg';\n\n /\n Determines the variant of avatar. Changes appearance accordingly.\n * @defaultValue customer\n */\n @Prop({ reflect: true }) variant?: 'customer' \| 'admin' = 'customer';\n\n private avatarSize() {\n const sizes: { [key: string]: any } = {\n xs: '24px',\n sm: '32px',\n md: '40px',\n lg: '56px',\n xl: '64px',\n }\n\n if (sizes[this.size]) {\n return sizes[this.size];\n } else {\n return this.size\n }\n }\n\n private renderAssetWrapper = () => {\n const style = {\n height: this.avatarSize(),\n width: this.avatarSize()\n };\n\n return (\n <div style={style} part=\"asset-wrapper\">\n {this.renderIconOrImage()}\n {this.renderBadge()}\n </div>\n )\n };\n\n private renderAvatar = () => {\n return (\n this.dropdown\n ?\n <button class=\"pds-avatar__button\" type=\"button\" aria-label=\"Avatar dropdown trigger\">\n {this.renderAssetWrapper()}\n </button>\n :\n this.renderAssetWrapper()\n )\n };\n\n private renderBadge = () => (\n this.badge\n // Percentage is average size of icon in relation to total avatar size\n // of all preset sizes found in Figma.\n // Used to allow icons to scale to container size\n && <pds-icon color=\"var(--pine-color-purple-600)\" class=\"pds-avatar__badge\" icon={checkCircleFilled} size=\"33.53%\"></pds-icon>\n );\n\n private renderIconOrImage = () => (\n this.image\n ? <img alt={this.alt} src={this.image} />\n // Percentage is average size of icon in relation to total avatar size\n // of all preset sizes found in Figma.\n // Used to allow icons to scale to container size\n : <pds-icon color=\"var(--pine-color-mercury-500)\" icon={userFilled} size=\"33.53%\"></pds-icon>\n );\n\n private classNames = () => (\n {\n 'pds-avatar': true,\n [`pds-avatar--has-image`]: this.image !== '' && this.image !== null, // Remove when FF supports :has selector\n [`pds-avatar--${this.variant}`]: this.variant === 'admin'\n }\n );\n\n render() {\n\n return (\n <Host\n id={this.componentId}\n class={{...this.classNames()}}\n >\n {this.renderAvatar()}\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;AAAA,MAAM,YAAY,GAAG~~,24CAA24C~~;;~~MCWn5C~~,SAAS,GAAA,MAAA;AALtB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAOE;;;AAGG;AACK,QAAA,IAAG,CAAA,GAAA,GAAmB,IAAI;AAElC;;;AAGG;AACK,QAAA,IAAK,CAAA,KAAA,GAAI,KAAK;AAOtB;;;AAGG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAI,KAAK;AAEzB;;;AAGG;AACK,QAAA,IAAK,CAAA,KAAA,GAAmB,IAAI;AAEpC;;;AAGG;AACsB,QAAA,IAAI,CAAA,IAAA,GAMlB,IAAI;AAEf;;;AAGG;AACsB,QAAA,IAAO,CAAA,OAAA,GAA0B,UAAU;AAkB5D,QAAA,IAAkB,CAAA,kBAAA,GAAG,MAAK;AAChC,YAAA,MAAM,KAAK,GAAG;AACZ,gBAAA,MAAM,EAAE,IAAI,CAAC,UAAU,EAAE;AACzB,gBAAA,KAAK,EAAE,IAAI,CAAC,UAAU;aACvB;YAED,QACE,WAAK,KAAK,EAAE,KAAK,EAAE,IAAI,EAAC,eAAe,EAAA,EACpC,IAAI,CAAC,iBAAiB,EAAE,EACxB,IAAI,CAAC,WAAW,EAAE,CACf;AAEV,SAAC;AAEO,QAAA,IAAY,CAAA,YAAA,GAAG,MAAK;YAC1B,QACE,IAAI,CAAC;;oBAEH,CAAA,CAAA,QAAA,EAAA,EAAQ,KAAK,EAAC,oBAAoB,EAAC,IAAI,EAAC,QAAQ,EAAY,YAAA,EAAA,yBAAyB,EACpF,EAAA,IAAI,CAAC,kBAAkB,EAAE;;AAG1B,oBAAA,IAAI,CAAC,kBAAkB,EAAE;AAE/B,SAAC;QAEO,IAAA,CAAA,WAAW,GAAG,OACpB,IAAI,CAAC;;;;eAIA,CAAA,CAAA,UAAA,EAAA,EAAU,KAAK,EAAC,8BAA8B,EAAC,KAAK,EAAC,mBAAmB,EAAC,IAAI,EAAE,iBAAiB,EAAE,IAAI,EAAC,QAAQ,EAAA,CAAY,CACjI;QAEO,IAAA,CAAA,iBAAiB,GAAG,OAC1B,IAAI,CAAC;AACH,cAAE,CAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,KAAK,EAAI;;;;cAIvC,CAAA,CAAA,UAAA,EAAA,EAAU,KAAK,EAAC,+BAA+B,EAAC,IAAI,EAAE,UAAU,EAAE,IAAI,EAAC,QAAQ,EAAA,CAAY,CAChG;AAEO,QAAA,IAAA,CAAA,UAAU,GAAG,OACnB;AACE,YAAA,YAAY,EAAE,IAAI;AAClB,YAAA,CAAC,CAAuB,qBAAA,CAAA,GAAG,IAAI,CAAC,KAAK,KAAK,EAAE,IAAI,IAAI,CAAC,KAAK,KAAK,IAAI;YACnE,CAAC,CAAA,YAAA,EAAe,IAAI,CAAC,OAAO,CAAA,CAAE,GAAG,IAAI,CAAC,OAAO,KAAK;AACnD,SAAA,CACF;AAaF;IA9ES,UAAU,GAAA;AAChB,QAAA,MAAM,KAAK,GAA2B;AACpC,YAAA,EAAE,EAAE,MAAM;AACV,YAAA,EAAE,EAAE,MAAM;AACV,YAAA,EAAE,EAAE,MAAM;AACV,YAAA,EAAE,EAAE,MAAM;AACV,YAAA,EAAE,EAAE,MAAM;SACX;AAED,QAAA,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;AACpB,YAAA,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC;;aAClB;YACL,OAAO,IAAI,CAAC,IAAI;;;IAuDpB,MAAM,GAAA;AAEJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,EAAE,EAAE,IAAI,CAAC,WAAW,EACpB,KAAK,oBAAM,IAAI,CAAC,UAAU,EAAE,CAE3B,EAAA,EAAA,IAAI,CAAC,YAAY,EAAE,CACf;;;;;;;"}
1	+ {"version":3,"file":"pds-avatar.entry.js","sources":["src/components/pds-avatar/pds-avatar.scss?tag=pds-avatar&encapsulation=shadow","src/components/pds-avatar/pds-avatar.tsx"],"sourcesContent":[":host {\n display: inline-block;\n}\n\ndiv {\n // These custom props are not reachable\n --color-background-container: var(--pine-color-mercury-050);\n\n align-items: center;\n background-color: var(--color-background-container);\n border-radius: var(--border-radius-admin-round, var(--pine-border-radius-full));\n display: inline-flex;\n justify-content: center;\n position: relative;\n\n :host(.pds-avatar--admin) & {\n --border-radius-admin-round: var(--pine-dimension-150);\n border-radius: var(--border-radius-admin-round);\n }\n\n // Remove when FF has support for :has\n :host(.pds-avatar--has-image) & {\n background: transparent\n }\n\n @supports selector(:has) {\n &:has(img) {\n background-color: transparent\n }\n }\n}\n\n.pds-avatar__button {\n align-items: center;\n appearance: none;\n background: transparent;\n border: var(--pine-dimension-none);\n border-radius: var(--pine-border-radius-full);\n cursor: pointer;\n display: flex;\n padding: var(--pine-dimension-none);\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n }\n}\n\n.pds-avatar__badge {\n background-color: var(--pine-color-background-container);\n border: var(--pine-border);\n border-color: var(--pine-color-secondary);\n border-radius: var(--pine-border-radius-round);\n inset-block-end: var(--pine-dimension-none);\n inset-inline-end: var(--pine-dimension-none);\n position: absolute;\n}\n\nimg {\n border-radius: var(--border-radius-admin-round, var(--pine-border-radius-full));\n height: 100%;\n object-fit: cover;\n width: 100%;\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport { checkCircleFilled, userFilled } from '@pine-ds/icons/icons';\n\n/*\n @part image - The main image element that represents the avatar component.\n/\n@Component({\n tag: 'pds-avatar',\n styleUrls: ['pds-avatar.scss'],\n shadow: true,\n})\nexport class PdsAvatar {\n\n /\n The alt for a custom user image.\n * @defaultValue null\n /\n @Prop() alt?: string \| null = null;\n\n /\n Determines whether the badge is visible or not.\n * @defaultValue false\n /\n @Prop() badge? = false;\n\n /\n A unique identifier used for the underlying component `id` attribute.\n /\n @Prop() componentId: string;\n\n /\n Determines whether the avatar functions as a dropdown trigger.\n * @defaultValue false\n /\n @Prop() dropdown? = false;\n\n /\n The src for a custom user image.\n * @defaultValue null\n /\n @Prop() image?: string \| null = null;\n\n /\n Size of the avatar. Value can be preset or custom.\n * @defaultValue lg\n /\n @Prop({ reflect: true }) size?:\n \| 'xl' // 64px\n \| 'lg' // 56px\n \| 'md' // 40px\n \| 'sm' // 32px\n \| 'xs' // 24px\n \| string = 'lg';\n\n /\n Determines the variant of avatar. Changes appearance accordingly.\n * @defaultValue customer\n */\n @Prop({ reflect: true }) variant?: 'customer' \| 'admin' = 'customer';\n\n private avatarSize() {\n const sizes: { [key: string]: any } = {\n xs: '24px',\n sm: '32px',\n md: '40px',\n lg: '56px',\n xl: '64px',\n }\n\n if (sizes[this.size]) {\n return sizes[this.size];\n } else {\n return this.size\n }\n }\n\n private renderAssetWrapper = () => {\n const style = {\n height: this.avatarSize(),\n width: this.avatarSize()\n };\n\n return (\n <div style={style} part=\"asset-wrapper\">\n {this.renderIconOrImage()}\n {this.renderBadge()}\n </div>\n )\n };\n\n private renderAvatar = () => {\n return (\n this.dropdown\n ?\n <button class=\"pds-avatar__button\" type=\"button\" aria-label=\"Avatar dropdown trigger\">\n {this.renderAssetWrapper()}\n </button>\n :\n this.renderAssetWrapper()\n )\n };\n\n private renderBadge = () => (\n this.badge\n // Percentage is average size of icon in relation to total avatar size\n // of all preset sizes found in Figma.\n // Used to allow icons to scale to container size\n && <pds-icon color=\"var(--pine-color-purple-600)\" class=\"pds-avatar__badge\" icon={checkCircleFilled} size=\"33.53%\"></pds-icon>\n );\n\n private renderIconOrImage = () => (\n this.image\n ? <img alt={this.alt} src={this.image} />\n // Percentage is average size of icon in relation to total avatar size\n // of all preset sizes found in Figma.\n // Used to allow icons to scale to container size\n : <pds-icon color=\"var(--pine-color-mercury-500)\" icon={userFilled} size=\"33.53%\"></pds-icon>\n );\n\n private classNames = () => (\n {\n 'pds-avatar': true,\n [`pds-avatar--has-image`]: this.image !== '' && this.image !== null, // Remove when FF supports :has selector\n [`pds-avatar--${this.variant}`]: this.variant === 'admin'\n }\n );\n\n render() {\n\n return (\n <Host\n id={this.componentId}\n class={{...this.classNames()}}\n >\n {this.renderAvatar()}\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;AAAA,MAAM,YAAY,GAAG,+5CAA+5C;;MCWv6C,SAAS,GAAA,MAAA;AALtB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAOE;;;AAGG;AACK,QAAA,IAAG,CAAA,GAAA,GAAmB,IAAI;AAElC;;;AAGG;AACK,QAAA,IAAK,CAAA,KAAA,GAAI,KAAK;AAOtB;;;AAGG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAI,KAAK;AAEzB;;;AAGG;AACK,QAAA,IAAK,CAAA,KAAA,GAAmB,IAAI;AAEpC;;;AAGG;AACsB,QAAA,IAAI,CAAA,IAAA,GAMlB,IAAI;AAEf;;;AAGG;AACsB,QAAA,IAAO,CAAA,OAAA,GAA0B,UAAU;AAkB5D,QAAA,IAAkB,CAAA,kBAAA,GAAG,MAAK;AAChC,YAAA,MAAM,KAAK,GAAG;AACZ,gBAAA,MAAM,EAAE,IAAI,CAAC,UAAU,EAAE;AACzB,gBAAA,KAAK,EAAE,IAAI,CAAC,UAAU;aACvB;YAED,QACE,WAAK,KAAK,EAAE,KAAK,EAAE,IAAI,EAAC,eAAe,EAAA,EACpC,IAAI,CAAC,iBAAiB,EAAE,EACxB,IAAI,CAAC,WAAW,EAAE,CACf;AAEV,SAAC;AAEO,QAAA,IAAY,CAAA,YAAA,GAAG,MAAK;YAC1B,QACE,IAAI,CAAC;;oBAEH,CAAA,CAAA,QAAA,EAAA,EAAQ,KAAK,EAAC,oBAAoB,EAAC,IAAI,EAAC,QAAQ,EAAY,YAAA,EAAA,yBAAyB,EACpF,EAAA,IAAI,CAAC,kBAAkB,EAAE;;AAG1B,oBAAA,IAAI,CAAC,kBAAkB,EAAE;AAE/B,SAAC;QAEO,IAAA,CAAA,WAAW,GAAG,OACpB,IAAI,CAAC;;;;eAIA,CAAA,CAAA,UAAA,EAAA,EAAU,KAAK,EAAC,8BAA8B,EAAC,KAAK,EAAC,mBAAmB,EAAC,IAAI,EAAE,iBAAiB,EAAE,IAAI,EAAC,QAAQ,EAAA,CAAY,CACjI;QAEO,IAAA,CAAA,iBAAiB,GAAG,OAC1B,IAAI,CAAC;AACH,cAAE,CAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,KAAK,EAAI;;;;cAIvC,CAAA,CAAA,UAAA,EAAA,EAAU,KAAK,EAAC,+BAA+B,EAAC,IAAI,EAAE,UAAU,EAAE,IAAI,EAAC,QAAQ,EAAA,CAAY,CAChG;AAEO,QAAA,IAAA,CAAA,UAAU,GAAG,OACnB;AACE,YAAA,YAAY,EAAE,IAAI;AAClB,YAAA,CAAC,CAAuB,qBAAA,CAAA,GAAG,IAAI,CAAC,KAAK,KAAK,EAAE,IAAI,IAAI,CAAC,KAAK,KAAK,IAAI;YACnE,CAAC,CAAA,YAAA,EAAe,IAAI,CAAC,OAAO,CAAA,CAAE,GAAG,IAAI,CAAC,OAAO,KAAK;AACnD,SAAA,CACF;AAaF;IA9ES,UAAU,GAAA;AAChB,QAAA,MAAM,KAAK,GAA2B;AACpC,YAAA,EAAE,EAAE,MAAM;AACV,YAAA,EAAE,EAAE,MAAM;AACV,YAAA,EAAE,EAAE,MAAM;AACV,YAAA,EAAE,EAAE,MAAM;AACV,YAAA,EAAE,EAAE,MAAM;SACX;AAED,QAAA,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;AACpB,YAAA,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC;;aAClB;YACL,OAAO,IAAI,CAAC,IAAI;;;IAuDpB,MAAM,GAAA;AAEJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,EAAE,EAAE,IAAI,CAAC,WAAW,EACpB,KAAK,oBAAM,IAAI,CAAC,UAAU,EAAE,CAE3B,EAAA,EAAA,IAAI,CAAC,YAAY,EAAE,CACf;;;;;;;"}

package/dist/esm/pds-button.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-Uh5ntVcq.js';
 import { h as hasShadowDom } from './utils-Dw9B1JDC.js';
-import { b as caretDown } from './index-B_0tBgWY.js';
+import { b as caretDown } from './index-DgttLLHX.js';
 const pdsButtonCss = ":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}";

package/dist/esm/pds-checkbox.entry.js CHANGED Viewed

@@ -1,10 +1,10 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-Uh5ntVcq.js';
 import { m as messageId, a as assignDescription } from './form-DTL_39D_.js';
-import { f as danger } from './index-B_0tBgWY.js';
+import { f as danger } from './index-DgttLLHX.js';
 const labelCss = ":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 pdsCheckboxCss = ":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);border-bottom:0;border-left:0;border-top:0;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);border-left:0;border-top:0;content:\"\";display:block;height:7px;left:50%;position:absolute;top:50%;-webkit-transform:rotate(43deg) translate3d(-110%, -30%, 0);transform:rotate(43deg) translate3d(-110%, -30%, 0);width:4px}input:disabled{background:var(--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 pdsCheckboxCss = ":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 PdsCheckbox = class {
     constructor(hostRef) {

package/dist/esm/pds-checkbox.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pds-checkbox.entry.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-bottom: 0;\n border-left: 0;\n border-top: 0;\n content: \"\";\n display: block;\n height: 7px;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: rotate(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-left: 0;\n border-top: 0;\n content: \"\";\n display: block;\n height: 7px;\n left: 50%;\n position: absolute;\n top: 50%;\n transform: rotate(43deg) translate3d(-110%, -30%, 0);\n width: 4px;\n }\n }\n\n &:disabled {\n background: var(--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	+ {"version":3,"file":"pds-checkbox.entry.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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"}

package/dist/esm/pds-chip.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-Uh5ntVcq.js';
-import { d as downSmall, r as remove } from './index-B_0tBgWY.js';
+import { d as downSmall, r as remove } from './index-DgttLLHX.js';
 const pdsChipTokensCss = ":host{--pine-chip-color-accent:var(--pine-color-purple-100);--pine-chip-color-accent-hover:var(--pine-color-purple-300);--pine-chip-color-accent-dot:var(--pine-color-purple-600);--pine-chip-color-danger:var(--pine-color-red-100);--pine-chip-color-danger-hover:var(--pine-color-red-300);--pine-chip-color-danger-dot:var(--pine-color-red-600);--pine-chip-color-info:var(--pine-color-blue-100);--pine-chip-color-info-hover:var(--pine-color-blue-300);--pine-chip-color-info-dot:var(--pine-color-blue-600);--pine-chip-color-neutral:var(--pine-color-grey-100);--pine-chip-color-neutral-hover:var(--pine-color-grey-300);--pine-chip-color-neutral-dot:var(--pine-color-grey-600);--pine-chip-color-success:var(--pine-color-green-100);--pine-chip-color-success-hover:var(--pine-color-green-300);--pine-chip-color-success-dot:var(--pine-color-green-600);--pine-chip-color-warning:var(--pine-color-yellow-100);--pine-chip-color-warning-hover:var(--pine-color-yellow-300);--pine-chip-color-warning-dot:var(--pine-color-yellow-600)}";

package/dist/esm/pds-chip.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pds-chip.entry.js","sources":["src/components/pds-chip/pds-chip.tokens.scss?tag=pds-chip&encapsulation=shadow","src/components/pds-chip/pds-chip.scss?tag=pds-chip&encapsulation=shadow","src/components/pds-chip/pds-chip.tsx"],"sourcesContent":["/*\n Do not edit directly, this file was auto-generated.\n /\n\n:host {\n --pine-chip-color-accent: var(--pine-color-purple-100);\n --pine-chip-color-accent-hover: var(--pine-color-purple-300);\n --pine-chip-color-accent-dot: var(--pine-color-purple-600);\n --pine-chip-color-danger: var(--pine-color-red-100);\n --pine-chip-color-danger-hover: var(--pine-color-red-300);\n --pine-chip-color-danger-dot: var(--pine-color-red-600);\n --pine-chip-color-info: var(--pine-color-blue-100);\n --pine-chip-color-info-hover: var(--pine-color-blue-300);\n --pine-chip-color-info-dot: var(--pine-color-blue-600);\n --pine-chip-color-neutral: var(--pine-color-grey-100);\n --pine-chip-color-neutral-hover: var(--pine-color-grey-300);\n --pine-chip-color-neutral-dot: var(--pine-color-grey-600);\n --pine-chip-color-success: var(--pine-color-green-100);\n --pine-chip-color-success-hover: var(--pine-color-green-300);\n --pine-chip-color-success-dot: var(--pine-color-green-600);\n --pine-chip-color-warning: var(--pine-color-yellow-100);\n --pine-chip-color-warning-hover: var(--pine-color-yellow-300);\n --pine-chip-color-warning-dot: var(--pine-color-yellow-600);\n}\n",":host {\n --sizing-close: var(--pine-dimension-125);\n\n align-items: center;\n border-radius: var(--pine-dimension-sm);\n display: inline-flex;\n padding-block: var(--pine-dimension-2xs);\n padding-inline: var(--pine-dimension-150);\n}\n\n$pds-chip-sentiment: (\n accent: var(--pine-chip-color-accent),\n danger: var(--pine-chip-color-danger),\n info: var(--pine-chip-color-info),\n neutral: var(--pine-chip-color-neutral),\n success: var(--pine-chip-color-success),\n warning: var(--pine-chip-color-warning),\n);\n\n$pds-chip-sentiment-text: (\n accent: var(--pine-color-text-accent),\n danger: var(--pine-color-text-danger),\n info: var(--pine-color-text-info),\n neutral: var(--pine-color-text-neutral),\n success: var(--pine-color-text-success),\n warning: var(--pine-color-text-warning),\n);\n\n$pds-chip-sentiment-dots: (\n accent: var(--pine-chip-color-accent-dot),\n danger: var(--pine-chip-color-danger-dot),\n info: var(--pine-chip-color-info-dot),\n neutral: var(--pine-chip-color-neutral-dot),\n success: var(--pine-chip-color-success-dot),\n warning: var(--pine-chip-color-warning-dot),\n);\n\n$pds-chip-sentiment-hover: (\n accent: var(--pine-chip-color-accent-hover),\n danger: var(--pine-chip-color-danger-hover),\n info: var(--pine-chip-color-info-hover),\n neutral: var(--pine-chip-color-neutral-hover),\n success: var(--pine-chip-color-success-hover),\n warning: var(--pine-chip-color-warning-hover),\n);\n\n@each $sentiment, $value in $pds-chip-sentiment {\n :host(.pds-chip--#{$sentiment}) {\n background: $value;\n border: var(--pine-border-width) solid var(--pine-chip-color-#{$sentiment}-hover);\n\n // dot colors\n .pds-chip__dot {\n / stylelint-disable-next-line /\n background: map-get($pds-chip-sentiment-dots, $sentiment);\n }\n\n .pds-chip__label, .pds-chip__button, .pds-chip__close {\n / stylelint-disable-next-line /\n color: map-get($pds-chip-sentiment-text, $sentiment);\n font-weight: var(--pine-font-weight-medium);\n }\n\n // tag close hover colors\n .pds-chip__close:hover {\n / stylelint-disable-next-line /\n background: map-get($pds-chip-sentiment-hover, $sentiment);\n }\n }\n // dropdown hover colors\n :host(.pds-chip--#{$sentiment}.pds-chip--dropdown:hover) {\n / stylelint-disable-next-line /\n background: map-get($pds-chip-sentiment-hover, $sentiment);\n }\n}\n\n.pds-chip__dot {\n border: var(--pine-border-width) solid transparent;\n border-radius: var(--pine-border-radius-full);\n display: inline-block;\n height: var(--pine-dimension-2xs);\n margin-block-end: var(--pine-dimension-025);\n margin-inline-end: var(--pine-dimension-2xs);\n width: var(--pine-dimension-2xs);\n}\n\n.pds-chip__label {\n align-items: center;\n display: flex;\n}\n\n.pds-chip__label, .pds-chip__button {\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n\n// dropdown\n\n:host(.pds-chip--dropdown) {\n padding: var(--pine-dimension-none);\n\n .pds-chip__dot {\n margin-block-end: calc(var(--pine-dimension-025) / 4);\n margin-block-start: var(--pine-dimension-025);\n }\n}\n\n.pds-chip__button {\n align-items: center;\n appearance: none;\n background: transparent;\n border: var(--pine-dimension-none);\n border-radius: var(--pine-dimension-sm);\n cursor: pointer;\n display: flex;\n padding: var(--pine-dimension-2xs) var(--pine-dimension-150);\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n }\n\n pds-icon {\n margin-inline-end: calc(var(--pine-dimension-025) -1);\n margin-inline-start: var(--pine-dimension-2xs);\n }\n}\n\n.pds-chip__close {\n appearance: none;\n background: transparent;\n border: 0;\n border-radius: var(--pine-border-radius-full);\n height: var(--sizing-close);\n margin-inline-end: calc(var(--pine-dimension-xs) * -1);\n margin-inline-start: var(--pine-dimension-2xs);\n padding: var(--sizing-close);\n position: relative;\n width: var(--sizing-close);\n\n pds-icon {\n left: 50%;\n position: absolute;\n top: 50%;\n transform: translate(-50%, -50%);\n }\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n }\n}\n\n// large\n\n:host(.pds-chip--large) {\n padding-block: var(--pine-dimension-2xs);\n padding-inline: var(--pine-dimension-150);\n\n .pds-chip__label, .pds-chip__button {\n font: var(--pine-typography-heading-6);\n letter-spacing: var(--pine-letter-spacing-heading-6);\n }\n}\n\n:host(.pds-chip--large):has(.pds-chip__button) {\n padding: var(--pine-dimension-none);\n}\n","import { downSmall, remove } from '@pine-ds/icons/icons';\nimport { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n/*\n @slot (default) - The chip's label text.\n /\n\n@Component({\n tag: 'pds-chip',\n styleUrls: ['pds-chip.tokens.scss', 'pds-chip.scss'],\n shadow: true,\n})\nexport class PdsChip {\n /\n A unique identifier used for the underlying component `id` attribute.\n /\n @Prop() componentId: string;\n\n /\n Determines whether a dot should be displayed on the chip.\n * @defaultValue false\n /\n @Prop() dot = false;\n\n\n /\n Determines whether the chip should be displayed in a larger size.\n * @defaultValue false\n /\n @Prop() large = false;\n\n /\n Defines the color scheme of the chip.\n * @defaultValue 'neutral'\n /\n @Prop() sentiment: 'accent' \| 'danger' \| 'info' \| 'neutral' \| 'success' \| 'warning' = 'neutral';\n\n /\n Sets the style variant of the chip.\n * @defaultValue 'text'\n /\n @Prop() variant: 'text' \| 'tag' \| 'dropdown' = 'text';\n\n /\n Event emitted when the close button is clicked on a tag variant chip.\n */\n @Event() pdsTagCloseClick: EventEmitter;\n\n private handleCloseClick = () => {\n this.pdsTagCloseClick.emit();\n };\n\n private classNames() {\n const classNames = ['pds-chip'];\n\n if (this.large) {\n classNames.push('pds-chip--large');\n }\n if (this.variant) {\n classNames.push('pds-chip--' + this.variant);\n }\n if (this.sentiment) {\n classNames.push('pds-chip--' + this.sentiment);\n }\n\n return classNames.join(' ');\n }\n\n private setChipContent() {\n const isDropdown = this.variant === 'dropdown';\n const chipContent = isDropdown ? (\n <button class=\"pds-chip__button\" type=\"button\">\n {this.dot && <i class=\"pds-chip__dot\" aria-hidden=\"true\"></i>}\n <slot></slot>\n <pds-icon icon={downSmall} size=\"12px\" aria-hidden=\"true\"></pds-icon>\n </button>\n ) : (\n <span class=\"pds-chip__label\">\n {this.dot && <i class=\"pds-chip__dot\" aria-hidden=\"true\"></i>}\n <slot></slot>\n </span>\n );\n\n return chipContent;\n }\n\n render() {\n return (\n <Host class={this.classNames()} id={this.componentId}>\n {this.setChipContent()}\n {this.variant === 'tag' && (\n <button class=\"pds-chip__close\" type=\"button\" onClick={this.handleCloseClick} aria-label=\"Remove\">\n <pds-icon icon={remove} size=\"12px\"></pds-icon>\n </button>\n )}\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;AAAA,MAAM,gBAAgB,GAAG,2/BAA2/B;;ACAphC,MAAM,UAAU,GAAG,66MAA66M;;MCYn7M,OAAO,GAAA,MAAA;AALpB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAWE;;;AAGG;AACK,QAAA,IAAG,CAAA,GAAA,GAAG,KAAK;AAGnB;;;AAGG;AACK,QAAA,IAAK,CAAA,KAAA,GAAG,KAAK;AAErB;;;AAGG;AACK,QAAA,IAAS,CAAA,SAAA,GAAqE,SAAS;AAE/F;;;AAGG;AACK,QAAA,IAAO,CAAA,OAAA,GAAgC,MAAM;AAO7C,QAAA,IAAgB,CAAA,gBAAA,GAAG,MAAK;AAC9B,YAAA,IAAI,CAAC,gBAAgB,CAAC,IAAI,EAAE;AAC9B,SAAC;AAgDF;IA9CS,UAAU,GAAA;AAChB,QAAA,MAAM,UAAU,GAAG,CAAC,UAAU,CAAC;AAE/B,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;AACd,YAAA,UAAU,CAAC,IAAI,CAAC,iBAAiB,CAAC;;AAEpC,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC;;AAE9C,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,SAAS,CAAC;;AAGhD,QAAA,OAAO,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC;;IAGrB,cAAc,GAAA;AACpB,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,KAAK,UAAU;QAC9C,MAAM,WAAW,GAAG,UAAU,IAC5B,CAAQ,CAAA,QAAA,EAAA,EAAA,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,QAAQ,EAAA,EAC3C,IAAI,CAAC,GAAG,IAAI,CAAA,CAAA,GAAA,EAAA,EAAG,KAAK,EAAC,eAAe,EAAa,aAAA,EAAA,MAAM,EAAK,CAAA,EAC7D,CAAa,CAAA,MAAA,EAAA,IAAA,CAAA,EACb,CAAA,CAAA,UAAA,EAAA,EAAU,IAAI,EAAE,SAAS,EAAE,IAAI,EAAC,MAAM,EAAa,aAAA,EAAA,MAAM,GAAY,CAC9D,KAET,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,iBAAiB,EAAA,EAC1B,IAAI,CAAC,GAAG,IAAI,CAAA,CAAA,GAAA,EAAA,EAAG,KAAK,EAAC,eAAe,EAAa,aAAA,EAAA,MAAM,EAAK,CAAA,EAC7D,CAAa,CAAA,MAAA,EAAA,IAAA,CAAA,CACR,CACR;AAED,QAAA,OAAO,WAAW;;IAGpB,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,IAAI,CAAC,WAAW,EAAA,EACjD,IAAI,CAAC,cAAc,EAAE,EACrB,IAAI,CAAC,OAAO,KAAK,KAAK,KACrB,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAAA,YAAA,EAAa,QAAQ,EAAA,EAC/F,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAE,MAAM,EAAE,IAAI,EAAC,MAAM,EAAA,CAAY,CACxC,CACV,CACI;;;;;;;"}
1	+ {"version":3,"file":"pds-chip.entry.js","sources":["src/components/pds-chip/pds-chip.tokens.scss?tag=pds-chip&encapsulation=shadow","src/components/pds-chip/pds-chip.scss?tag=pds-chip&encapsulation=shadow","src/components/pds-chip/pds-chip.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-chip/pds-chip.tokens'\n",":host {\n --sizing-close: var(--pine-dimension-125);\n\n align-items: center;\n border-radius: var(--pine-dimension-sm);\n display: inline-flex;\n padding-block: var(--pine-dimension-2xs);\n padding-inline: var(--pine-dimension-150);\n}\n\n$pds-chip-sentiment: (\n accent: var(--pine-chip-color-accent),\n danger: var(--pine-chip-color-danger),\n info: var(--pine-chip-color-info),\n neutral: var(--pine-chip-color-neutral),\n success: var(--pine-chip-color-success),\n warning: var(--pine-chip-color-warning),\n);\n\n$pds-chip-sentiment-text: (\n accent: var(--pine-color-text-accent),\n danger: var(--pine-color-text-danger),\n info: var(--pine-color-text-info),\n neutral: var(--pine-color-text-neutral),\n success: var(--pine-color-text-success),\n warning: var(--pine-color-text-warning),\n);\n\n$pds-chip-sentiment-dots: (\n accent: var(--pine-chip-color-accent-dot),\n danger: var(--pine-chip-color-danger-dot),\n info: var(--pine-chip-color-info-dot),\n neutral: var(--pine-chip-color-neutral-dot),\n success: var(--pine-chip-color-success-dot),\n warning: var(--pine-chip-color-warning-dot),\n);\n\n$pds-chip-sentiment-hover: (\n accent: var(--pine-chip-color-accent-hover),\n danger: var(--pine-chip-color-danger-hover),\n info: var(--pine-chip-color-info-hover),\n neutral: var(--pine-chip-color-neutral-hover),\n success: var(--pine-chip-color-success-hover),\n warning: var(--pine-chip-color-warning-hover),\n);\n\n@each $sentiment, $value in $pds-chip-sentiment {\n :host(.pds-chip--#{$sentiment}) {\n background: $value;\n border: var(--pine-border-width) solid var(--pine-chip-color-#{$sentiment}-hover);\n\n // dot colors\n .pds-chip__dot {\n /* stylelint-disable-next-line /\n background: map-get($pds-chip-sentiment-dots, $sentiment);\n }\n\n .pds-chip__label, .pds-chip__button, .pds-chip__close {\n / stylelint-disable-next-line /\n color: map-get($pds-chip-sentiment-text, $sentiment);\n font-weight: var(--pine-font-weight-medium);\n }\n\n // tag close hover colors\n .pds-chip__close:hover {\n / stylelint-disable-next-line /\n background: map-get($pds-chip-sentiment-hover, $sentiment);\n }\n }\n // dropdown hover colors\n :host(.pds-chip--#{$sentiment}.pds-chip--dropdown:hover) {\n / stylelint-disable-next-line /\n background: map-get($pds-chip-sentiment-hover, $sentiment);\n }\n}\n\n.pds-chip__dot {\n border: var(--pine-border-width) solid transparent;\n border-radius: var(--pine-border-radius-full);\n display: inline-block;\n height: var(--pine-dimension-2xs);\n margin-block-end: var(--pine-dimension-025);\n margin-inline-end: var(--pine-dimension-2xs);\n width: var(--pine-dimension-2xs);\n}\n\n.pds-chip__label {\n align-items: center;\n display: flex;\n}\n\n.pds-chip__label, .pds-chip__button {\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n\n// dropdown\n\n:host(.pds-chip--dropdown) {\n padding: var(--pine-dimension-none);\n\n .pds-chip__dot {\n margin-block-end: calc(var(--pine-dimension-025) / 4);\n margin-block-start: var(--pine-dimension-025);\n }\n}\n\n.pds-chip__button {\n align-items: center;\n appearance: none;\n background: transparent;\n border: var(--pine-dimension-none);\n border-radius: var(--pine-dimension-sm);\n cursor: pointer;\n display: flex;\n padding: var(--pine-dimension-2xs) var(--pine-dimension-150);\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n }\n\n pds-icon {\n margin-inline-end: calc(var(--pine-dimension-025) -1);\n margin-inline-start: var(--pine-dimension-2xs);\n }\n}\n\n.pds-chip__close {\n appearance: none;\n background: transparent;\n border: 0;\n border-radius: var(--pine-border-radius-full);\n height: var(--sizing-close);\n margin-inline-end: calc(var(--pine-dimension-xs) * -1);\n margin-inline-start: var(--pine-dimension-2xs);\n padding: var(--sizing-close);\n position: relative;\n width: var(--sizing-close);\n\n pds-icon {\n left: 50%;\n position: absolute;\n top: 50%;\n transform: translate(-50%, -50%);\n }\n\n &:focus-visible {\n outline: var(--pine-outline-focus);\n }\n}\n\n// large\n\n:host(.pds-chip--large) {\n padding-block: var(--pine-dimension-2xs);\n padding-inline: var(--pine-dimension-150);\n\n .pds-chip__label, .pds-chip__button {\n font: var(--pine-typography-heading-6);\n letter-spacing: var(--pine-letter-spacing-heading-6);\n }\n}\n\n:host(.pds-chip--large):has(.pds-chip__button) {\n padding: var(--pine-dimension-none);\n}\n","import { downSmall, remove } from '@pine-ds/icons/icons';\nimport { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n/*\n @slot (default) - The chip's label text.\n /\n\n@Component({\n tag: 'pds-chip',\n styleUrls: ['pds-chip.tokens.scss', 'pds-chip.scss'],\n shadow: true,\n})\nexport class PdsChip {\n /\n A unique identifier used for the underlying component `id` attribute.\n /\n @Prop() componentId: string;\n\n /\n Determines whether a dot should be displayed on the chip.\n * @defaultValue false\n /\n @Prop() dot = false;\n\n\n /\n Determines whether the chip should be displayed in a larger size.\n * @defaultValue false\n /\n @Prop() large = false;\n\n /\n Defines the color scheme of the chip.\n * @defaultValue 'neutral'\n /\n @Prop() sentiment: 'accent' \| 'danger' \| 'info' \| 'neutral' \| 'success' \| 'warning' = 'neutral';\n\n /\n Sets the style variant of the chip.\n * @defaultValue 'text'\n /\n @Prop() variant: 'text' \| 'tag' \| 'dropdown' = 'text';\n\n /\n Event emitted when the close button is clicked on a tag variant chip.\n */\n @Event() pdsTagCloseClick: EventEmitter;\n\n private handleCloseClick = () => {\n this.pdsTagCloseClick.emit();\n };\n\n private classNames() {\n const classNames = ['pds-chip'];\n\n if (this.large) {\n classNames.push('pds-chip--large');\n }\n if (this.variant) {\n classNames.push('pds-chip--' + this.variant);\n }\n if (this.sentiment) {\n classNames.push('pds-chip--' + this.sentiment);\n }\n\n return classNames.join(' ');\n }\n\n private setChipContent() {\n const isDropdown = this.variant === 'dropdown';\n const chipContent = isDropdown ? (\n <button class=\"pds-chip__button\" type=\"button\">\n {this.dot && <i class=\"pds-chip__dot\" aria-hidden=\"true\"></i>}\n <slot></slot>\n <pds-icon icon={downSmall} size=\"12px\" aria-hidden=\"true\"></pds-icon>\n </button>\n ) : (\n <span class=\"pds-chip__label\">\n {this.dot && <i class=\"pds-chip__dot\" aria-hidden=\"true\"></i>}\n <slot></slot>\n </span>\n );\n\n return chipContent;\n }\n\n render() {\n return (\n <Host class={this.classNames()} id={this.componentId}>\n {this.setChipContent()}\n {this.variant === 'tag' && (\n <button class=\"pds-chip__close\" type=\"button\" onClick={this.handleCloseClick} aria-label=\"Remove\">\n <pds-icon icon={remove} size=\"12px\"></pds-icon>\n </button>\n )}\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;AAAA,MAAM,gBAAgB,GAAG,2/BAA2/B;;ACAphC,MAAM,UAAU,GAAG,66MAA66M;;MCYn7M,OAAO,GAAA,MAAA;AALpB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAWE;;;AAGG;AACK,QAAA,IAAG,CAAA,GAAA,GAAG,KAAK;AAGnB;;;AAGG;AACK,QAAA,IAAK,CAAA,KAAA,GAAG,KAAK;AAErB;;;AAGG;AACK,QAAA,IAAS,CAAA,SAAA,GAAqE,SAAS;AAE/F;;;AAGG;AACK,QAAA,IAAO,CAAA,OAAA,GAAgC,MAAM;AAO7C,QAAA,IAAgB,CAAA,gBAAA,GAAG,MAAK;AAC9B,YAAA,IAAI,CAAC,gBAAgB,CAAC,IAAI,EAAE;AAC9B,SAAC;AAgDF;IA9CS,UAAU,GAAA;AAChB,QAAA,MAAM,UAAU,GAAG,CAAC,UAAU,CAAC;AAE/B,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;AACd,YAAA,UAAU,CAAC,IAAI,CAAC,iBAAiB,CAAC;;AAEpC,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC;;AAE9C,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,SAAS,CAAC;;AAGhD,QAAA,OAAO,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC;;IAGrB,cAAc,GAAA;AACpB,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,KAAK,UAAU;QAC9C,MAAM,WAAW,GAAG,UAAU,IAC5B,CAAQ,CAAA,QAAA,EAAA,EAAA,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,QAAQ,EAAA,EAC3C,IAAI,CAAC,GAAG,IAAI,CAAA,CAAA,GAAA,EAAA,EAAG,KAAK,EAAC,eAAe,EAAa,aAAA,EAAA,MAAM,EAAK,CAAA,EAC7D,CAAa,CAAA,MAAA,EAAA,IAAA,CAAA,EACb,CAAA,CAAA,UAAA,EAAA,EAAU,IAAI,EAAE,SAAS,EAAE,IAAI,EAAC,MAAM,EAAa,aAAA,EAAA,MAAM,GAAY,CAC9D,KAET,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,iBAAiB,EAAA,EAC1B,IAAI,CAAC,GAAG,IAAI,CAAA,CAAA,GAAA,EAAA,EAAG,KAAK,EAAC,eAAe,EAAa,aAAA,EAAA,MAAM,EAAK,CAAA,EAC7D,CAAa,CAAA,MAAA,EAAA,IAAA,CAAA,CACR,CACR;AAED,QAAA,OAAO,WAAW;;IAGpB,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,IAAI,CAAC,WAAW,EAAA,EACjD,IAAI,CAAC,cAAc,EAAE,EACrB,IAAI,CAAC,OAAO,KAAK,KAAK,KACrB,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAAA,YAAA,EAAa,QAAQ,EAAA,EAC/F,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAE,MAAM,EAAE,IAAI,EAAC,MAAM,EAAA,CAAY,CACxC,CACV,CACI;;;;;;;"}

package/dist/esm/pds-copytext.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-Uh5ntVcq.js';
-import { a as copy } from './index-B_0tBgWY.js';
+import { a as copy } from './index-DgttLLHX.js';
 const pdsCopytextCss = ":host(.pds-copytext){--copytext-color-background-hover:var(--pine-color-grey-200)}:host(.pds-copytext) pds-button{-ms-flex-align:center;align-items:center;background:var(--pine-color-secondary);border-radius:var(--pine-border-radius-full);border-width:var(--pine-dimension-none);display:-ms-inline-flexbox;display:inline-flex;font-family:var(--pine-font-family-heading);font-size:var(--pine-font-size-body-md);font-weight:var(--pine-font-weight-body-medium);letter-spacing:var(--pine-letter-spacing);line-height:var(--pine-line-height-body);max-width:100%;padding:var(--pine-dimension-2xs) var(--pine-dimension-xs)}:host(.pds-copytext) pds-button::part(button){-webkit-padding-end:calc(var(--pine-dimension-xs) / 2);padding-inline-end:calc(var(--pine-dimension-xs) / 2)}:host(.pds-copytext) pds-button::part(button):hover{background-color:var(--copytext-color-background-hover);color:var(--pine-color-text-secondary-hover)}:host(.pds-copytext) pds-button span{font-weight:var(--pine-font-weight-medium);-webkit-margin-end:var(--pine-dimension-xs);margin-inline-end:var(--pine-dimension-xs);white-space:nowrap}:host(.pds-copytext) pds-button :nth-child(2){-ms-flex-negative:0;flex-shrink:0}:host(.pds-copytext):host(.pds-copytext--bordered){border-width:var(--pine-dimension-none);padding:var(--pine-dimension-none)}:host(.pds-copytext):host(.pds-copytext--bordered) pds-button{padding:var(--pine-dimension-none)}:host(.pds-copytext):host(.pds-copytext--bordered)::part(button):hover{background-color:transparent}:host(.pds-copytext):host(.pds-copytext--bordered) span{border:var(--pine-border);border-radius:var(--pine-border-radius-full);-webkit-margin-end:var(--pine-dimension-sm);margin-inline-end:var(--pine-dimension-sm);padding-block:var(--pine-dimension-xs);padding-inline:var(--pine-dimension-sm)}:host(.pds-copytext):host(.pds-copytext--bordered) :hover span{border:var(--pine-border-hover)}:host(.pds-copytext):host(.pds-copytext--full-width) pds-button,:host(.pds-copytext):host(.pds-copytext--truncated) pds-button{display:-ms-inline-flexbox;display:inline-flex;min-width:auto;width:100%}:host(.pds-copytext):host(.pds-copytext--full-width) pds-button::part(button-content),:host(.pds-copytext):host(.pds-copytext--full-width) pds-button::part(button-text),:host(.pds-copytext):host(.pds-copytext--truncated) pds-button::part(button-content),:host(.pds-copytext):host(.pds-copytext--truncated) pds-button::part(button-text){-ms-flex-negative:1;flex-shrink:1;width:100%}:host(.pds-copytext):host(.pds-copytext--full-width) pds-button span,:host(.pds-copytext):host(.pds-copytext--truncated) pds-button span{text-align:left;width:100%}:host(.pds-copytext):host(.pds-copytext--full-width) pds-button{-ms-flex-pack:justify;justify-content:space-between}:host(.pds-copytext):host(.pds-copytext--truncated) pds-button span{overflow:hidden;text-overflow:ellipsis}";

package/dist/esm/pds-divider.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host } from './index-Uh5ntVcq.js';
-const pdsDividerCss = ".pds-divider{background:var(--pine-color-border);display:-ms-flexbox;display:flex;margin:0;width:100%}.pds-divider--vertical{height:100%;width:1px}.pds-divider--offset-xxs{margin:0 calc(var(--pine-dimension-2xs) * -1);padding:0 var(--pine-dimension-2xs)}.pds-divider--offset-xxs.pds-divider--vertical{margin:calc(var(--pine-dimension-2xs) * -1) 0;padding:var(--pine-dimension-2xs) 0}.pds-divider--offset-xs{margin:0 calc(var(--pine-dimension-xs) * -1);padding:0 var(--pine-dimension-xs)}.pds-divider--offset-xs.pds-divider--vertical{margin:calc(var(--pine-dimension-xs) * -1) 0;padding:var(--pine-dimension-xs) 0}.pds-divider--offset-sm{margin:0 calc(var(--pine-dimension-sm) * -1);padding:0 var(--pine-dimension-sm)}.pds-divider--offset-sm.pds-divider--vertical{margin:calc(var(--pine-dimension-sm) * -1) 0;padding:var(--pine-dimension-sm) 0}.pds-divider--offset-md{margin:0 calc(var(--pine-dimension-md) * -1);padding:0 var(--pine-dimension-md)}.pds-divider--offset-md.pds-divider--vertical{margin:calc(var(--pine-dimension-md) * -1) 0;padding:var(--pine-dimension-md) 0}.pds-divider--offset-lg{margin:0 calc(var(--pine-dimension-lg) * -1);padding:0 var(--pine-dimension-lg)}.pds-divider--offset-lg.pds-divider--vertical{margin:calc(var(--pine-dimension-lg) * -1) 0;padding:var(--pine-dimension-lg) 0}.pds-divider--offset-xl{margin:0 calc(var(--pine-dimension-xl) * -1);padding:0 var(--pine-dimension-xl)}.pds-divider--offset-xl.pds-divider--vertical{margin:calc(var(--pine-dimension-xl) * -1) 0;padding:var(--pine-dimension-xl) 0}.pds-divider--offset-xxl{margin:0 calc(var(--pine-dimension-2xl) * -1);padding:0 var(--pine-dimension-2xl)}.pds-divider--offset-xxl.pds-divider--vertical{margin:calc(var(--pine-dimension-2xl) * -1) 0;padding:var(--pine-dimension-2xl) 0}@media (max-width: 767px){.pds-divider--vertical{display:none}}";
+const pdsDividerCss = ".pds-divider{background:var(--pine-color-border);border:0;display:-ms-flexbox;display:flex;height:var(--pine-border-width);margin:0;width:100%}.pds-divider--vertical{height:100%;width:1px}.pds-divider--offset-xxs{margin:0 calc(var(--pine-dimension-2xs) * -1);padding:0 var(--pine-dimension-2xs)}.pds-divider--offset-xxs.pds-divider--vertical{margin:calc(var(--pine-dimension-2xs) * -1) 0;padding:var(--pine-dimension-2xs) 0}.pds-divider--offset-xs{margin:0 calc(var(--pine-dimension-xs) * -1);padding:0 var(--pine-dimension-xs)}.pds-divider--offset-xs.pds-divider--vertical{margin:calc(var(--pine-dimension-xs) * -1) 0;padding:var(--pine-dimension-xs) 0}.pds-divider--offset-sm{margin:0 calc(var(--pine-dimension-sm) * -1);padding:0 var(--pine-dimension-sm)}.pds-divider--offset-sm.pds-divider--vertical{margin:calc(var(--pine-dimension-sm) * -1) 0;padding:var(--pine-dimension-sm) 0}.pds-divider--offset-md{margin:0 calc(var(--pine-dimension-md) * -1);padding:0 var(--pine-dimension-md)}.pds-divider--offset-md.pds-divider--vertical{margin:calc(var(--pine-dimension-md) * -1) 0;padding:var(--pine-dimension-md) 0}.pds-divider--offset-lg{margin:0 calc(var(--pine-dimension-lg) * -1);padding:0 var(--pine-dimension-lg)}.pds-divider--offset-lg.pds-divider--vertical{margin:calc(var(--pine-dimension-lg) * -1) 0;padding:var(--pine-dimension-lg) 0}.pds-divider--offset-xl{margin:0 calc(var(--pine-dimension-xl) * -1);padding:0 var(--pine-dimension-xl)}.pds-divider--offset-xl.pds-divider--vertical{margin:calc(var(--pine-dimension-xl) * -1) 0;padding:var(--pine-dimension-xl) 0}.pds-divider--offset-xxl{margin:0 calc(var(--pine-dimension-2xl) * -1);padding:0 var(--pine-dimension-2xl)}.pds-divider--offset-xxl.pds-divider--vertical{margin:calc(var(--pine-dimension-2xl) * -1) 0;padding:var(--pine-dimension-2xl) 0}@media (max-width: 767px){.pds-divider--vertical{display:none}}";
 const PdsDivider = class {
     constructor(hostRef) {

package/dist/esm/pds-divider.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pds-divider.entry.js","sources":["src/components/pds-divider/pds-divider.scss?tag=pds-divider&encapsulation=shadow","src/components/pds-divider/pds-divider.tsx"],"sourcesContent":["$pds-divider-offsets: (\n xxs: var(--pine-dimension-2xs),\n xs: var(--pine-dimension-xs),\n sm: var(--pine-dimension-sm),\n md: var(--pine-dimension-md),\n lg: var(--pine-dimension-lg),\n xl: var(--pine-dimension-xl),\n xxl: var(--pine-dimension-2xl),\n);\n\n.pds-divider {\n background: var(--pine-color-border);\n display: flex;\n margin: 0;\n width: 100%;\n}\n\n.pds-divider--vertical {\n height: 100%;\n width: 1px;\n}\n\n@each $offset, $value in $pds-divider-offsets {\n .pds-divider--offset-#{$offset} {\n margin: 0 calc($value * -1);\n padding: 0 $value;\n\n &.pds-divider--vertical {\n margin: calc($value * -1) 0;\n padding: $value 0;\n }\n }\n}\n\n@media (max-width: 767px) {\n .pds-divider--vertical {\n display: none;\n }\n}\n","import { Component, Prop, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'pds-divider',\n styleUrls: ['pds-divider.scss'],\n shadow: true,\n})\nexport class PdsDivider {\n /*\n A unique identifier used for the underlying component `id` attribute.\n /\n @Prop() componentId: string;\n\n /\n Adds offset margin/padding to expand the width (horizontal) or the height (vertical) of divider.\n /\n @Prop() offset: 'xxs' \| 'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'xxl';\n\n /\n Sets divider to display vertically.\n * @defaultValue false\n */\n @Prop() vertical = false;\n\n private classNames() {\n const classNames = ['pds-divider'];\n\n if (this.vertical) {\n classNames.push('pds-divider--vertical');\n }\n\n if (this.offset) {\n const offsetClassName = 'pds-divider--offset-' + this.offset;\n classNames.push(offsetClassName);\n }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host id={this.componentId}>\n <hr class={this.classNames()} />\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,aAAa,GAAG,~~0yDAA0yD~~;;~~MCOnzD~~,UAAU,GAAA,MAAA;AALvB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAgBE;;;AAGG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;AAwBzB;IAtBS,UAAU,GAAA;AAChB,QAAA,MAAM,UAAU,GAAG,CAAC,aAAa,CAAC;AAElC,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACjB,YAAA,UAAU,CAAC,IAAI,CAAC,uBAAuB,CAAC;;AAG1C,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE;AACf,YAAA,MAAM,eAAe,GAAG,sBAAsB,GAAG,IAAI,CAAC,MAAM;AAC5D,YAAA,UAAU,CAAC,IAAI,CAAC,eAAe,CAAC;;AAGlC,QAAA,OAAO,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC;;IAG7B,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,EAAE,EAAE,IAAI,CAAC,WAAW,EAAA,EACxB,CAAI,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAA,CAAI,CAC3B;;;;;;;"}
1	+ {"version":3,"file":"pds-divider.entry.js","sources":["src/components/pds-divider/pds-divider.scss?tag=pds-divider&encapsulation=shadow","src/components/pds-divider/pds-divider.tsx"],"sourcesContent":["$pds-divider-offsets: (\n xxs: var(--pine-dimension-2xs),\n xs: var(--pine-dimension-xs),\n sm: var(--pine-dimension-sm),\n md: var(--pine-dimension-md),\n lg: var(--pine-dimension-lg),\n xl: var(--pine-dimension-xl),\n xxl: var(--pine-dimension-2xl),\n);\n\n.pds-divider {\n background: var(--pine-color-border);\n border: 0;\n display: flex;\n height: var(--pine-border-width);\n margin: 0;\n width: 100%;\n}\n\n.pds-divider--vertical {\n height: 100%;\n width: 1px;\n}\n\n@each $offset, $value in $pds-divider-offsets {\n .pds-divider--offset-#{$offset} {\n margin: 0 calc($value * -1);\n padding: 0 $value;\n\n &.pds-divider--vertical {\n margin: calc($value * -1) 0;\n padding: $value 0;\n }\n }\n}\n\n@media (max-width: 767px) {\n .pds-divider--vertical {\n display: none;\n }\n}\n","import { Component, Prop, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'pds-divider',\n styleUrls: ['pds-divider.scss'],\n shadow: true,\n})\nexport class PdsDivider {\n /*\n A unique identifier used for the underlying component `id` attribute.\n /\n @Prop() componentId: string;\n\n /\n Adds offset margin/padding to expand the width (horizontal) or the height (vertical) of divider.\n /\n @Prop() offset: 'xxs' \| 'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'xxl';\n\n /\n Sets divider to display vertically.\n * @defaultValue false\n */\n @Prop() vertical = false;\n\n private classNames() {\n const classNames = ['pds-divider'];\n\n if (this.vertical) {\n classNames.push('pds-divider--vertical');\n }\n\n if (this.offset) {\n const offsetClassName = 'pds-divider--offset-' + this.offset;\n classNames.push(offsetClassName);\n }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host id={this.componentId}>\n <hr class={this.classNames()} />\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,aAAa,GAAG,m1DAAm1D;;MCO51D,UAAU,GAAA,MAAA;AALvB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAgBE;;;AAGG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;AAwBzB;IAtBS,UAAU,GAAA;AAChB,QAAA,MAAM,UAAU,GAAG,CAAC,aAAa,CAAC;AAElC,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACjB,YAAA,UAAU,CAAC,IAAI,CAAC,uBAAuB,CAAC;;AAG1C,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE;AACf,YAAA,MAAM,eAAe,GAAG,sBAAsB,GAAG,IAAI,CAAC,MAAM;AAC5D,YAAA,UAAU,CAAC,IAAI,CAAC,eAAe,CAAC;;AAGlC,QAAA,OAAO,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC;;IAG7B,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,EAAE,EAAE,IAAI,CAAC,WAAW,EAAA,EACxB,CAAI,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAA,CAAI,CAC3B;;;;;;;"}

package/dist/esm/pds-icon.entry.js CHANGED Viewed

@@ -212,7 +212,7 @@ const getSvgContent = (url, sanitize = false) => {
     return req;
 };
-const pdsIconCss = ":host{--dimension-icon-height:16px;--dimension-icon-width:16px;--color-icon-fill:currentColor;contain:strict;display:inline-block;fill:var(--color-icon-fill);height:var(--dimension-icon-height);width:var(--dimension-icon-width)}:host .pdsicon{fill:var(--color-icon-fill)}.pds-icon-fill-none{fill:none}.icon-inner,.pds-icon,svg{display:block;height:100%;width:100%}";
+const pdsIconCss = ":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 PdsIcon = class {
     constructor(hostRef) {

package/dist/esm/pds-icon.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pds-icon.entry.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/pds-icons/';\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 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	+ {"version":3,"file":"pds-icon.entry.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/pds-icons/';\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]}

package/dist/esm/pds-input.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-Uh5ntVcq.js';
 import { a as assignDescription, m as messageId } from './form-DTL_39D_.js';
-import { f as danger } from './index-B_0tBgWY.js';
+import { f as danger } from './index-DgttLLHX.js';
 import { d as debounceEvent } from './utils-Dw9B1JDC.js';
 import { i as inheritAriaAttributes } from './attributes-C0M1gTKv.js';

package/dist/esm/pds-input.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pds-input.entry.js","sources":["src/components/pds-input/pds-input.tokens.scss?tag=pds-input&encapsulation=shadow","src/global/styles/utils/label.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.tsx"],"sourcesContent":["/*\n Do not edit directly, this file was auto-generated.\n /\n\n:host {\n --pine-input-color-background-danger: var(--pine-color-red-050);\n}\n",":host {\n display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n label {\n color: var(--pine-color-text-label-readonly);\n }\n}\n\nlabel {\n color: var(--pine-color-text-label);\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n display: inline;\n}\n\n:host([aria-readonly=\"true\"]) {\n input {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-readonly);\n }\n}\n\n.pds-input {\n display: flex;\n flex-direction: column;\n}\n\n.pds-input__label {\n margin-block-end: var(--pine-dimension-2xs)\n}\n\n.pds-input__field {\n background: var(--pine-color-background-container);\n border: 1px solid var(--pine-color-border);\n border-radius: var(--pine-dimension-125);\n color: var(--pine-color-text-active);\n font: var(--pine-typography-body);\n letter-spacing: var(--pine-letter-spacing);\n padding: var(--pine-dimension-xs) var(--pine-dimension-sm);\n\n &:hover:not(:disabled, .is-invalid) {\n border: var(--pine-border-hover);\n }\n\n &:disabled {\n background-color: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n color: var(--pine-color-text-disabled);\n cursor: not-allowed;\n\n / stylelint-disable /\n &::-webkit-input-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &:-ms-input-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n / stylelint-enable /\n }\n\n &:hover {\n border-color: var(--pine-color-border-hover);\n }\n\n &:focus-visible {\n border-color: var(--pine-color-border-active);\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n }\n\n / stylelint-disable /\n &::-webkit-input-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &:-ms-input-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n / stylelint-enable /\n\n &.is-invalid {\n background-color: var(--pine-input-color-background-danger);\n border-color: var(--pine-color-border-danger);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n}\n\n.pds-input__error-message,\n.pds-input__helper-message {\n font: var(--pine-typography-body-sm-medium);\n margin-block-end: 0;\n margin-block-start: var(--pine-dimension-2xs)\n}\n\n.pds-input__error-message {\n align-items: center;\n color: var(--pine-color-text-message-danger);\n display: flex;\n gap: var(--pine-dimension-2xs);\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { danger } from '@pine-ds/icons/icons';\n\nimport { debounceEvent } from '@utils/utils';\nimport { inheritAriaAttributes } from '@utils/attributes';\n\nimport type { Attributes } from '@utils/attributes';\nimport type { InputChangeEventDetail, InputInputEventDetail } from './input-interface';\n\n@Component({\n tag: 'pds-input',\n styleUrls: ['pds-input.tokens.scss', '../../global/styles/utils/label.scss', 'pds-input.scss'],\n shadow: true,\n})\nexport class PdsInput {\n private nativeInput?: HTMLInputElement;\n private inheritedAttributes: Attributes = {};\n private isComposing = false;\n /\n The value of the input when the input is focused.\n /\n private focusedValue?: string \| number \| null;\n\n private originalPdsInput?: EventEmitter<InputInputEventDetail>;\n\n @Element() el!: HTMLPdsInputElement;\n\n /\n Emitted when the input loses focus.\n /\n @Event() pdsBlur!: EventEmitter<FocusEvent>;\n\n /\n \n * Emitted when the value has changed.\n \n This event will not emit when programmatically setting the `value` property.\n /\n @Event() pdsChange!: EventEmitter<InputChangeEventDetail>;\n\n /\n Emitted when the input has focus.\n /\n @Event() pdsFocus!: EventEmitter<FocusEvent>;\n\n /\n Emitted when a keyboard input occurs.\n /\n @Event() pdsInput: EventEmitter<InputInputEventDetail>;\n\n /\n Sets focus on the native `input` in the `pds-input`. Use this method instead of the global\n * `input.focus()`.\n /\n @Method()\n async setFocus() {\n if ( this.nativeInput ) {\n this.nativeInput.focus();\n }\n }\n\n /\n Specifies if and how the browser provides `autocomplete` assistance for the field.\n /\n @Prop() autocomplete: string;\n\n /\n A unique identifier used for the underlying component `id` attribute.\n /\n @Prop() componentId!: string;\n\n /\n Sets the number of milliseconds to wait before updating the value.\n /\n @Prop() debounce?: number;\n\n /\n Determines whether or not the input field is disabled.\n /\n @Prop() disabled?: boolean;\n\n /\n Specifies the error message and provides an error-themed treatment to the field.\n /\n @Prop() errorMessage?: string;\n\n /\n Displays a message or hint below the input field.\n /\n @Prop() helperMessage?: string;\n\n /\n Determines whether or not the input field is invalid or throws an error.\n /\n @Prop() invalid?: boolean;\n\n /\n Text to be displayed as the input label.\n /\n @Prop() label?: string;\n\n /\n Specifies the name. Submitted with the form name/value pair.\n /\n @Prop() name?: string;\n\n /\n Specifies a short hint that describes the expected value of the input field.\n /\n @Prop() placeholder?: string;\n\n /\n Determines whether or not the input field is readonly.\n /\n @Prop() readonly?: boolean;\n\n /\n Determines whether or not the input field is required.\n /\n @Prop() required?: boolean;\n\n /\n Determines the type of control that will be displayed\n * `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`, `'url'`\n * @defaultValue \"text\"\n /\n @Prop() type = 'text';\n\n /\n The value of the input.\n /\n @Prop({mutable: true}) value?: string \| number \| null = '';\n\n /\n Determines if the input has focus.\n /\n @State() hasFocus = false;\n\n\n @Watch('debounce')\n protected debounceChanged() {\n const { pdsInput, debounce, originalPdsInput } = this;\n\n /\n If debounce is undefined, we have to manually revert the pdsInput emitter in case\n * debounce used to be set to a number. Otherwise, the event would stay debounced.\n /\n this.pdsInput = debounce === undefined ? originalPdsInput ?? pdsInput : debounceEvent(pdsInput, debounce);\n }\n\n @Watch('value')\n protected valueChanged() {\n const nativeInput = this.nativeInput;\n const value = this.getValue();\n\n if (nativeInput && nativeInput.value !== value && !this.isComposing) {\n nativeInput.value = value;\n }\n }\n\n private getValue(): string {\n return typeof this.value === 'number' ? this.value.toString() : (this.value \|\| '').toString();\n }\n\n private onInputEvent = (ev: Event) => {\n const input = ev.target as HTMLInputElement \| null;\n if (input) {\n this.value = input.value \|\| '';\n }\n this.emitInputChange(ev);\n };\n\n private onChangeEvent = (ev: Event) => {\n this.emitValueChange(ev);\n };\n\n private onBlurEvent = (ev: FocusEvent) => {\n this.hasFocus = false;\n\n if (this.focusedValue !== this.value) {\n /\n Emits the `pdsChange` event when the input value\n * is different than the value when the input was focused.\n /\n this.emitValueChange(ev);\n }\n\n this.pdsBlur.emit(ev);\n };\n\n private onFocusEvent = (ev: FocusEvent) => {\n this.hasFocus = true;\n this.focusedValue = this.value;\n\n this.pdsFocus.emit(ev);\n };\n\n private onCompositionStart = () => {\n this.isComposing = true;\n }\n\n private onCompositionEnd = () => {\n this.isComposing = false;\n }\n\n /\n Emits a pdsChange event\n /\n private emitValueChange(event?: Event) {\n const { value } = this;\n const newValue = value == null ? value : value.toString();\n\n this.focusedValue = newValue;\n this.pdsChange.emit({ value: newValue, event });\n }\n\n /\n \n * Emits a `pdsInput` event\n */\n private emitInputChange(event?: Event) {\n const { value } = this;\n\n // Checks for both null and undefined values\n const newValue = value == null ? value : value.toString();\n\n this.pdsInput.emit({ value: newValue, event });\n }\n\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n }\n }\n\n componentDidLoad() {\n this.debounceChanged();\n }\n\n private inputClassNames() {\n const classNames = ['pds-input__field'];\n\n if (this.invalid && this.invalid === true) {\n classNames.push('is-invalid');\n }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n aria-readonly={this.readonly ? 'true' : null}\n >\n <div class=\"pds-input\">\n {this.label &&\n <label class=\"pds-input__label\" htmlFor={this.componentId}>{this.label}</label>\n }\n <input\n class={this.inputClassNames()}\n ref={(input) => this.nativeInput = input}\n aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n autocomplete={this.autocomplete}\n disabled={this.disabled}\n id={this.componentId}\n name={this.name}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n type={this.type}\n value={this.value}\n onInput={this.onInputEvent}\n onChange={this.onChangeEvent}\n onBlur={this.onBlurEvent}\n onFocus={this.onFocusEvent}\n onCompositionstart={this.onCompositionStart}\n onCompositionend={this.onCompositionEnd}\n {...this.inheritedAttributes}\n />\n {this.helperMessage &&\n <p\n class=\"pds-input__helper-message\"\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </p>\n }\n {this.errorMessage &&\n <p\n class=\"pds-input__error-message\"\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </p>\n }\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"pds-input.entry.js","sources":["src/components/pds-input/pds-input.tokens.scss?tag=pds-input&encapsulation=shadow","src/global/styles/utils/label.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.scss?tag=pds-input&encapsulation=shadow","src/components/pds-input/pds-input.tsx"],"sourcesContent":["@use '~@kajabi-ui/styles/dist/pine/components/pds-input/pds-input.tokens'\n",":host {\n display: inline-block;\n}\n\n:host([aria-disabled=\"true\"]) label {\n color: var(--pine-color-text-label-disabled);\n}\n\n:host([aria-readonly=\"true\"]) {\n label {\n color: var(--pine-color-text-label-readonly);\n }\n}\n\nlabel {\n color: var(--pine-color-text-label);\n font: var(--pine-typography-body-medium);\n letter-spacing: var(--pine-letter-spacing);\n}\n",":host {\n display: inline;\n}\n\n:host([aria-readonly=\"true\"]) {\n input {\n background-color: var(--pine-color-background-container-disabled);\n color: var(--pine-color-text-readonly);\n }\n}\n\n.pds-input {\n display: flex;\n flex-direction: column;\n}\n\n.pds-input__label {\n margin-block-end: var(--pine-dimension-2xs)\n}\n\n.pds-input__field {\n background: var(--pine-color-background-container);\n border: 1px solid var(--pine-color-border);\n border-radius: var(--pine-dimension-125);\n color: var(--pine-color-text-active);\n font: var(--pine-typography-body);\n letter-spacing: var(--pine-letter-spacing);\n padding: var(--pine-dimension-xs) var(--pine-dimension-sm);\n\n &:hover:not(:disabled, .is-invalid) {\n border: var(--pine-border-hover);\n }\n\n &:disabled {\n background-color: var(--pine-color-background-container-disabled);\n border-color: var(--pine-color-border-disabled);\n color: var(--pine-color-text-disabled);\n cursor: not-allowed;\n\n /* stylelint-disable /\n &::-webkit-input-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n\n &:-ms-input-placeholder {\n color: var(--pine-color-text-placeholder-disabled);\n }\n / stylelint-enable /\n }\n\n &:hover {\n border-color: var(--pine-color-border-hover);\n }\n\n &:focus-visible {\n border-color: var(--pine-color-border-active);\n outline: var(--pine-outline-focus);\n outline-offset: var(--pine-border-width);\n }\n\n / stylelint-disable /\n &::-webkit-input-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &::-moz-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n\n &:-ms-input-placeholder {\n color: var(--pine-color-text-placeholder);\n }\n / stylelint-enable /\n\n &.is-invalid {\n background-color: var(--pine-input-color-background-danger);\n border-color: var(--pine-color-border-danger);\n\n &:focus-visible {\n outline-color: var(--pine-color-focus-ring-danger);\n }\n }\n}\n\n.pds-input__error-message,\n.pds-input__helper-message {\n font: var(--pine-typography-body-sm-medium);\n margin-block-end: 0;\n margin-block-start: var(--pine-dimension-2xs)\n}\n\n.pds-input__error-message {\n align-items: center;\n color: var(--pine-color-text-message-danger);\n display: flex;\n gap: var(--pine-dimension-2xs);\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { danger } from '@pine-ds/icons/icons';\n\nimport { debounceEvent } from '@utils/utils';\nimport { inheritAriaAttributes } from '@utils/attributes';\n\nimport type { Attributes } from '@utils/attributes';\nimport type { InputChangeEventDetail, InputInputEventDetail } from './input-interface';\n\n@Component({\n tag: 'pds-input',\n styleUrls: ['pds-input.tokens.scss', '../../global/styles/utils/label.scss', 'pds-input.scss'],\n shadow: true,\n})\nexport class PdsInput {\n private nativeInput?: HTMLInputElement;\n private inheritedAttributes: Attributes = {};\n private isComposing = false;\n /\n The value of the input when the input is focused.\n /\n private focusedValue?: string \| number \| null;\n\n private originalPdsInput?: EventEmitter<InputInputEventDetail>;\n\n @Element() el!: HTMLPdsInputElement;\n\n /\n Emitted when the input loses focus.\n /\n @Event() pdsBlur!: EventEmitter<FocusEvent>;\n\n /\n \n * Emitted when the value has changed.\n \n This event will not emit when programmatically setting the `value` property.\n /\n @Event() pdsChange!: EventEmitter<InputChangeEventDetail>;\n\n /\n Emitted when the input has focus.\n /\n @Event() pdsFocus!: EventEmitter<FocusEvent>;\n\n /\n Emitted when a keyboard input occurs.\n /\n @Event() pdsInput: EventEmitter<InputInputEventDetail>;\n\n /\n Sets focus on the native `input` in the `pds-input`. Use this method instead of the global\n * `input.focus()`.\n /\n @Method()\n async setFocus() {\n if ( this.nativeInput ) {\n this.nativeInput.focus();\n }\n }\n\n /\n Specifies if and how the browser provides `autocomplete` assistance for the field.\n /\n @Prop() autocomplete: string;\n\n /\n A unique identifier used for the underlying component `id` attribute.\n /\n @Prop() componentId!: string;\n\n /\n Sets the number of milliseconds to wait before updating the value.\n /\n @Prop() debounce?: number;\n\n /\n Determines whether or not the input field is disabled.\n /\n @Prop() disabled?: boolean;\n\n /\n Specifies the error message and provides an error-themed treatment to the field.\n /\n @Prop() errorMessage?: string;\n\n /\n Displays a message or hint below the input field.\n /\n @Prop() helperMessage?: string;\n\n /\n Determines whether or not the input field is invalid or throws an error.\n /\n @Prop() invalid?: boolean;\n\n /\n Text to be displayed as the input label.\n /\n @Prop() label?: string;\n\n /\n Specifies the name. Submitted with the form name/value pair.\n /\n @Prop() name?: string;\n\n /\n Specifies a short hint that describes the expected value of the input field.\n /\n @Prop() placeholder?: string;\n\n /\n Determines whether or not the input field is readonly.\n /\n @Prop() readonly?: boolean;\n\n /\n Determines whether or not the input field is required.\n /\n @Prop() required?: boolean;\n\n /\n Determines the type of control that will be displayed\n * `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`, `'url'`\n * @defaultValue \"text\"\n /\n @Prop() type = 'text';\n\n /\n The value of the input.\n /\n @Prop({mutable: true}) value?: string \| number \| null = '';\n\n /\n Determines if the input has focus.\n /\n @State() hasFocus = false;\n\n\n @Watch('debounce')\n protected debounceChanged() {\n const { pdsInput, debounce, originalPdsInput } = this;\n\n /\n If debounce is undefined, we have to manually revert the pdsInput emitter in case\n * debounce used to be set to a number. Otherwise, the event would stay debounced.\n /\n this.pdsInput = debounce === undefined ? originalPdsInput ?? pdsInput : debounceEvent(pdsInput, debounce);\n }\n\n @Watch('value')\n protected valueChanged() {\n const nativeInput = this.nativeInput;\n const value = this.getValue();\n\n if (nativeInput && nativeInput.value !== value && !this.isComposing) {\n nativeInput.value = value;\n }\n }\n\n private getValue(): string {\n return typeof this.value === 'number' ? this.value.toString() : (this.value \|\| '').toString();\n }\n\n private onInputEvent = (ev: Event) => {\n const input = ev.target as HTMLInputElement \| null;\n if (input) {\n this.value = input.value \|\| '';\n }\n this.emitInputChange(ev);\n };\n\n private onChangeEvent = (ev: Event) => {\n this.emitValueChange(ev);\n };\n\n private onBlurEvent = (ev: FocusEvent) => {\n this.hasFocus = false;\n\n if (this.focusedValue !== this.value) {\n /\n Emits the `pdsChange` event when the input value\n * is different than the value when the input was focused.\n /\n this.emitValueChange(ev);\n }\n\n this.pdsBlur.emit(ev);\n };\n\n private onFocusEvent = (ev: FocusEvent) => {\n this.hasFocus = true;\n this.focusedValue = this.value;\n\n this.pdsFocus.emit(ev);\n };\n\n private onCompositionStart = () => {\n this.isComposing = true;\n }\n\n private onCompositionEnd = () => {\n this.isComposing = false;\n }\n\n /\n Emits a pdsChange event\n /\n private emitValueChange(event?: Event) {\n const { value } = this;\n const newValue = value == null ? value : value.toString();\n\n this.focusedValue = newValue;\n this.pdsChange.emit({ value: newValue, event });\n }\n\n /\n \n * Emits a `pdsInput` event\n */\n private emitInputChange(event?: Event) {\n const { value } = this;\n\n // Checks for both null and undefined values\n const newValue = value == null ? value : value.toString();\n\n this.pdsInput.emit({ value: newValue, event });\n }\n\n\n componentWillLoad() {\n this.inheritedAttributes = {\n ...inheritAriaAttributes(this.el)\n }\n }\n\n componentDidLoad() {\n this.debounceChanged();\n }\n\n private inputClassNames() {\n const classNames = ['pds-input__field'];\n\n if (this.invalid && this.invalid === true) {\n classNames.push('is-invalid');\n }\n\n return classNames.join(' ');\n }\n\n render() {\n return (\n <Host\n aria-disabled={this.disabled ? 'true' : null}\n aria-readonly={this.readonly ? 'true' : null}\n >\n <div class=\"pds-input\">\n {this.label &&\n <label class=\"pds-input__label\" htmlFor={this.componentId}>{this.label}</label>\n }\n <input\n class={this.inputClassNames()}\n ref={(input) => this.nativeInput = input}\n aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n aria-invalid={this.invalid ? \"true\" : undefined}\n autocomplete={this.autocomplete}\n disabled={this.disabled}\n id={this.componentId}\n name={this.name}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n type={this.type}\n value={this.value}\n onInput={this.onInputEvent}\n onChange={this.onChangeEvent}\n onBlur={this.onBlurEvent}\n onFocus={this.onFocusEvent}\n onCompositionstart={this.onCompositionStart}\n onCompositionend={this.onCompositionEnd}\n {...this.inheritedAttributes}\n />\n {this.helperMessage &&\n <p\n class=\"pds-input__helper-message\"\n id={messageId(this.componentId, 'helper')}\n >\n {this.helperMessage}\n </p>\n }\n {this.errorMessage &&\n <p\n class=\"pds-input__error-message\"\n id={messageId(this.componentId, 'error')}\n aria-live=\"assertive\"\n >\n <pds-icon icon={danger} size=\"small\" />\n {this.errorMessage}\n </p>\n }\n </div>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/pds-link.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h } from './index-Uh5ntVcq.js';
-import { l as launch } from './index-B_0tBgWY.js';
+import { l as launch } from './index-DgttLLHX.js';
 const pdsLinkCss = ":host{display:inline}:host pds-icon{-webkit-margin-start:var(--pine-dimension-2xs);margin-inline-start:var(--pine-dimension-2xs)}.pds-link{-ms-flex-align:center;align-items:center;color:var(--pine-color-text);display:-ms-inline-flexbox;display:inline-flex;font-weight:var(--pine-font-weight-medium)}.pds-link:focus-visible{border-radius:var(--pine-dimension-2xs);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width-thick);position:relative}.pds-link--sm{font-size:var(--pine-font-size-body-xs)}.pds-link--sm pds-icon{height:var(--pine-dimension-xs);width:var(--pine-dimension-xs)}.pds-link--md{font-size:var(--pine-font-size-body-sm)}.pds-link--md pds-icon{height:var(--pine-dimension-xs);width:var(--pine-dimension-xs)}.pds-link--lg{font-size:var(--pine-font-size-body-md)}.pds-link--lg pds-icon{height:var(--pine-dimension-sm);width:var(--pine-dimension-sm)}.pds-link--plain{text-decoration:none}.pds-link--plain:hover{color:var(--pine-color-text-hover);text-decoration:underline}.pds-link--default{text-decoration:underline}.pds-link--default:hover{color:var(--pine-color-text-hover);text-decoration:none}";

package/dist/esm/pds-radio.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-Uh5ntVcq.js';
 import { m as messageId, a as assignDescription } from './form-DTL_39D_.js';
-import { f as danger } from './index-B_0tBgWY.js';
+import { f as danger } from './index-DgttLLHX.js';
 const labelCss = ".sc-pds-radio-h{display:inline-block}[aria-disabled=true].sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text-label-disabled)}[aria-readonly=true].sc-pds-radio-h label.sc-pds-radio{color:var(--pine-color-text-label-readonly)}label.sc-pds-radio{color:var(--pine-color-text-label);font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing)}";