@pine-ds/core 2.1.1 → 2.1.2

package/dist/collection/components/pds-chip/pds-chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"pds-chip.js","sourceRoot":"","sources":["../../../src/components/pds-chip/pds-chip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAO9E,MAAM,OAAO,OAAO;;QAwCV,qBAAgB,GAAG,GAAG,EAAE;YAC9B,IAAI,CAAC,gBAAgB,CAAC,IAAI,EAAE,CAAC;QAC/B,CAAC,CAAA;;yBAhCqF,SAAS;mBAMjF,KAAK;;qBAWH,KAAK;uBAM0B,MAAM;;IAW7C,UAAU;QAChB,MAAM,UAAU,GAAG,CAAC,UAAU,CAAC,CAAC;QAEhC,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,UAAU,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;QACrC,CAAC;QACD,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACjB,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC;QAC/C,CAAC;QACD,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACnB,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC;QACjD,CAAC;QAED,OAAO,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC/B,CAAC;IAEO,cAAc;QACpB,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,KAAK,UAAU,CAAC;QAC/C,MAAM,WAAW,GAAG,UAAU,CAAC,CAAC,CAAC,CAC/B,cAAQ,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,QAAQ;YAC3C,IAAI,CAAC,GAAG,IAAI,SAAG,KAAK,EAAC,eAAe,iBAAa,MAAM,GAAK;YAC5D,IAAI,CAAC,KAAK;YACX,gBAAU,IAAI,EAAE,SAAS,EAAE,IAAI,EAAC,MAAM,iBAAa,MAAM,GAAY,CAC9D,CACV,CAAC,CAAC,CAAC,CACF,YAAM,KAAK,EAAC,iBAAiB;YAC1B,IAAI,CAAC,GAAG,IAAI,SAAG,KAAK,EAAC,eAAe,iBAAa,MAAM,GAAK;YAC5D,IAAI,CAAC,KAAK,CACN,CACR,CAAC;QAEF,OAAO,WAAW,CAAC;IACrB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,IAAI,CAAC,WAAW;YACjD,IAAI,CAAC,cAAc,EAAE;YACrB,IAAI,CAAC,OAAO,KAAK,KAAK,IAAI,CACzB,+DAAQ,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,IAAI,CAAC,gBAAgB,gBAAa,QAAQ;gBAC/F,iEAAU,IAAI,EAAE,MAAM,EAAE,IAAI,EAAC,MAAM,GAAY,CACxC,CACV,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { downSmall, remove } from '@pine-ds/icons/icons';\nimport { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'pds-chip',\n  styleUrls: ['../../global/styles/base.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   * Sets the color scheme of the chip.\n   * @defaultValue 'neutral'\n   */\n  @Prop() sentiment: 'accent' | 'danger' | 'info' | 'neutral' | 'success' | 'warning' = 'neutral';\n\n  /**\n   * Determines whether a dot should be displayed on the chip.\n   * @defaultValue false\n   */\n  @Prop() dot = false;\n\n  /**\n   *  Sets the text label content of the chip.\n   */\n  @Prop() label: string;\n\n  /**\n   * Determines whether the chip should be rendered in a larger size.\n   * @defaultValue false\n   */\n  @Prop() large = false;\n\n  /**\n   * Sets the style variant of the chip.\n   * @defaultValue 'text'\n   */\n  @Prop() variant: 'text' | 'tag' | 'dropdown' = 'text';\n\n  /**\n   * Event when close button is clicked on tag variant.\n   */\n  @Event() pdsTagCloseClick: EventEmitter;\n\n  private handleCloseClick = () => {\n    this.pdsTagCloseClick.emit();\n  }\n\n  private classNames() {\n    const classNames = ['pds-chip'];\n\n    if (this.large) {\n      classNames.push('pds-chip--large');\n    }\n    if (this.variant) {\n      classNames.push('pds-chip--' + this.variant);\n    }\n    if (this.sentiment) {\n      classNames.push('pds-chip--' + this.sentiment);\n    }\n\n    return classNames.join('  ');\n  }\n\n  private setChipContent() {\n    const isDropdown = this.variant === 'dropdown';\n    const chipContent = isDropdown ? (\n      <button class=\"pds-chip__button\" type=\"button\">\n        {this.dot && <i class=\"pds-chip__dot\" aria-hidden=\"true\"></i>}\n        {this.label}\n        <pds-icon 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        {this.label}\n      </span>\n    );\n\n    return chipContent;\n  }\n\n  render() {\n    return (\n      <Host class={this.classNames()} id={this.componentId}>\n        {this.setChipContent()}\n        {this.variant === 'tag' && (\n          <button class=\"pds-chip__close\" type=\"button\" onClick={this.handleCloseClick} aria-label=\"Remove\">\n            <pds-icon icon={remove} size=\"12px\"></pds-icon>\n          </button>\n        )}\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"pds-chip.js","sourceRoot":"","sources":["../../../src/components/pds-chip/pds-chip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAO9E,MAAM,OAAO,OAAO;;QAwCV,qBAAgB,GAAG,GAAG,EAAE;YAC9B,IAAI,CAAC,gBAAgB,CAAC,IAAI,EAAE,CAAC;QAC/B,CAAC,CAAC;;mBAhCY,KAAK;;qBAWH,KAAK;yBAMiE,SAAS;uBAMhD,MAAM;;IAW7C,UAAU;QAChB,MAAM,UAAU,GAAG,CAAC,UAAU,CAAC,CAAC;QAEhC,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,UAAU,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;QACrC,CAAC;QACD,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACjB,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC;QAC/C,CAAC;QACD,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACnB,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC;QACjD,CAAC;QAED,OAAO,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC9B,CAAC;IAEO,cAAc;QACpB,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,KAAK,UAAU,CAAC;QAC/C,MAAM,WAAW,GAAG,UAAU,CAAC,CAAC,CAAC,CAC/B,cAAQ,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,QAAQ;YAC3C,IAAI,CAAC,GAAG,IAAI,SAAG,KAAK,EAAC,eAAe,iBAAa,MAAM,GAAK;YAC5D,IAAI,CAAC,KAAK;YACX,gBAAU,IAAI,EAAE,SAAS,EAAE,IAAI,EAAC,MAAM,iBAAa,MAAM,GAAY,CAC9D,CACV,CAAC,CAAC,CAAC,CACF,YAAM,KAAK,EAAC,iBAAiB;YAC1B,IAAI,CAAC,GAAG,IAAI,SAAG,KAAK,EAAC,eAAe,iBAAa,MAAM,GAAK;YAC5D,IAAI,CAAC,KAAK,CACN,CACR,CAAC;QAEF,OAAO,WAAW,CAAC;IACrB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,IAAI,CAAC,WAAW;YACjD,IAAI,CAAC,cAAc,EAAE;YACrB,IAAI,CAAC,OAAO,KAAK,KAAK,IAAI,CACzB,+DAAQ,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,IAAI,CAAC,gBAAgB,gBAAa,QAAQ;gBAC/F,iEAAU,IAAI,EAAE,MAAM,EAAE,IAAI,EAAC,MAAM,GAAY,CACxC,CACV,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { downSmall, remove } from '@pine-ds/icons/icons';\nimport { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'pds-chip',\n  styleUrls: ['../../global/styles/base.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   * Sets the text label content of the chip.\n   */\n  @Prop() label: string;\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        {this.label}\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        {this.label}\n      </span>\n    );\n\n    return chipContent;\n  }\n\n  render() {\n    return (\n      <Host class={this.classNames()} id={this.componentId}>\n        {this.setChipContent()}\n        {this.variant === 'tag' && (\n          <button class=\"pds-chip__close\" type=\"button\" onClick={this.handleCloseClick} aria-label=\"Remove\">\n            <pds-icon icon={remove} size=\"12px\"></pds-icon>\n          </button>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/pds-copytext/pds-copytext.js

@@ -36,7 +36,7 @@ export class PdsCopytext {
         return classNames.join('  ');
     }
     render() {
-        return (h(Host, { key: '24f8ccba6099b5a4f283fe049dc38e32c916c80e', class: this.classNames(), id: this.componentId }, h("pds-button", { key: '7b4d6703944df7a4a3932663b5c09b496d642f0c', type: "button", variant: "unstyled", onClick: this.handleClick }, h("span", { key: '68ab90f525b04edc3d708d7405d34558aee8c98e' }, this.value), h("pds-icon", { key: '06a24c4577dc10917e69314a6d19db8e6a88e7f7', icon: copyIcon, size: "16px" }))));
+        return (h(Host, { key: '43aceb92fe0cc910613115bc882b04108efeffba', class: this.classNames(), id: this.componentId }, h("pds-button", { key: 'f152bc288e64192a80ed8f4f48d90e3edb7558cc', type: "button", variant: "unstyled", onClick: this.handleClick }, h("span", { key: 'ed9486b47835e21601047d2a915a412e664c6b4b' }, this.value), h("pds-icon", { key: 'bfbf6d92775171c36f768d654c5866f2f4ce8479', icon: copyIcon, size: "16px" }))));
     }
     static get is() { return "pds-copytext"; }
     static get encapsulation() { return "shadow"; }
@@ -67,7 +67,7 @@ export class PdsCopytext {
                             "name": "defaultValue",
                             "text": "true"
                         }],
-                    "text": "Determines whether `copytext` should have a border."
+                    "text": "Determines whether `copytext` should have a visible border."
                 },
                 "attribute": "border",
                 "reflect": true,
@@ -144,7 +144,7 @@ export class PdsCopytext {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "String that is displayed and that is also copied to the clipboard upon interaction."
+                    "text": "The string displayed that is also copied to the clipboard upon interaction."
                 },
                 "attribute": "value",
                 "reflect": false
@@ -160,7 +160,7 @@ export class PdsCopytext {
                 "composed": true,
                 "docs": {
                     "tags": [],
-                    "text": "Event when copyText button is clicked."
+                    "text": "Event fired when copyText button is clicked."
                 },
                 "complexType": {
                     "original": "any",

package/dist/collection/components/pds-copytext/pds-copytext.js.map

@@ -1 +1 @@
-{"version":3,"file":"pds-copytext.js","sourceRoot":"","sources":["../../../src/components/pds-copytext/pds-copytext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAE9E,OAAO,EAAE,IAAI,IAAI,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAOxD,MAAM,OAAO,WAAW;;QAkCd,oBAAe,GAAG,KAAK,EAAE,KAAa,EAAE,EAAE;YAChD,IAAI,CAAC;gBACH,IAAI,OAAO,SAAS,CAAC,SAAS,KAAK,WAAW,EAAE,CAAC;oBAC/C,MAAM,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;oBAC3C,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;gBACpD,CAAC;YACH,CAAC;YAAC,OAAO,GAAG,EAAE,CAAC;gBACb,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,oCAAoC,GAAG,EAAE,CAAC,CAAC;YACxE,CAAC;QACH,CAAC,CAAC;QAEM,gBAAW,GAAG,GAAG,EAAE;YACzB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACnC,CAAC,CAAC;sBA1CgC,IAAI;;yBAWlB,KAAK;wBAMN,KAAK;;;IA2BhB,UAAU;QAChB,MAAM,UAAU,GAAG,CAAC,cAAc,CAAC,CAAC;QAEpC,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,UAAU,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC;QAC5C,CAAC;QAED,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACnB,UAAU,CAAC,IAAI,CAAC,0BAA0B,CAAC,CAAC;QAC9C,CAAC;QAED,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,UAAU,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC;QAC7C,CAAC;QAED,OAAO,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC/B,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,IAAI,CAAC,WAAW;YAClD,mEAAY,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAC,UAAU,EAAC,OAAO,EAAE,IAAI,CAAC,WAAW;gBACpE,+DAAO,IAAI,CAAC,KAAK,CAAQ;gBACzB,iEAAU,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAC,MAAM,GAAY,CACtC,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\n\nimport { copy as copyIcon } from '@pine-ds/icons/icons';\n\n@Component({\n  tag: 'pds-copytext',\n  styleUrls: ['../../global/styles/base.scss', 'pds-copytext.scss'],\n  shadow: true,\n})\nexport class PdsCopytext {\n  /**\n   * Determines whether `copytext` should have a border.\n   * @defaultValue true\n   */\n  @Prop({ reflect: true }) border = true;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Determines whether `copytext` should expand to the full width of its container.\n   * @defaultValue false\n   */\n  @Prop() fullWidth = false;\n\n  /**\n   * Determines whether the `value` should truncate and display with an ellipsis.\n   * @defaultValue false\n   */\n  @Prop() truncate = false;\n\n  /**\n   * String that is displayed and that is also copied to the clipboard upon interaction.\n   */\n  @Prop() value!: string;\n\n  /**\n   * Event when copyText button is clicked.\n   */\n  @Event() pdsCopyTextClick: EventEmitter;\n\n  private copyToClipboard = async (value: string) => {\n    try {\n      if (typeof navigator.clipboard !== 'undefined') {\n        await navigator.clipboard.writeText(value);\n        this.pdsCopyTextClick.emit('Copied to clipboard');\n      }\n    } catch (err) {\n      this.pdsCopyTextClick.emit(`Error writing text to clipboard: ${err}`);\n    }\n  };\n\n  private handleClick = () => {\n    this.copyToClipboard(this.value);\n  };\n\n  private classNames() {\n    const classNames = ['pds-copytext'];\n\n    if (this.border) {\n      classNames.push('pds-copytext--bordered');\n    }\n\n    if (this.fullWidth) {\n      classNames.push('pds-copytext--full-width');\n    }\n\n    if (this.truncate) {\n      classNames.push('pds-copytext--truncated');\n    }\n\n    return classNames.join('  ');\n  }\n\n  render() {\n    return (\n      <Host class={this.classNames()} id={this.componentId}>\n        <pds-button type=\"button\" variant=\"unstyled\" onClick={this.handleClick}>\n          <span>{this.value}</span>\n          <pds-icon icon={copyIcon} size=\"16px\"></pds-icon>\n        </pds-button>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"pds-copytext.js","sourceRoot":"","sources":["../../../src/components/pds-copytext/pds-copytext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAE9E,OAAO,EAAE,IAAI,IAAI,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAOxD,MAAM,OAAO,WAAW;;QAkCd,oBAAe,GAAG,KAAK,EAAE,KAAa,EAAE,EAAE;YAChD,IAAI,CAAC;gBACH,IAAI,OAAO,SAAS,CAAC,SAAS,KAAK,WAAW,EAAE,CAAC;oBAC/C,MAAM,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;oBAC3C,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;gBACpD,CAAC;YACH,CAAC;YAAC,OAAO,GAAG,EAAE,CAAC;gBACb,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,oCAAoC,GAAG,EAAE,CAAC,CAAC;YACxE,CAAC;QACH,CAAC,CAAC;QAEM,gBAAW,GAAG,GAAG,EAAE;YACzB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACnC,CAAC,CAAC;sBA1CgC,IAAI;;yBAWlB,KAAK;wBAMN,KAAK;;;IA2BhB,UAAU;QAChB,MAAM,UAAU,GAAG,CAAC,cAAc,CAAC,CAAC;QAEpC,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,UAAU,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC;QAC5C,CAAC;QAED,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACnB,UAAU,CAAC,IAAI,CAAC,0BAA0B,CAAC,CAAC;QAC9C,CAAC;QAED,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,UAAU,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC;QAC7C,CAAC;QAED,OAAO,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC/B,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,IAAI,CAAC,WAAW;YAClD,mEAAY,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAC,UAAU,EAAC,OAAO,EAAE,IAAI,CAAC,WAAW;gBACpE,+DAAO,IAAI,CAAC,KAAK,CAAQ;gBACzB,iEAAU,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAC,MAAM,GAAY,CACtC,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\n\nimport { copy as copyIcon } from '@pine-ds/icons/icons';\n\n@Component({\n  tag: 'pds-copytext',\n  styleUrls: ['../../global/styles/base.scss', 'pds-copytext.scss'],\n  shadow: true,\n})\nexport class PdsCopytext {\n  /**\n   * Determines whether `copytext` should have a visible border.\n   * @defaultValue true\n   */\n  @Prop({ reflect: true }) border = true;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Determines whether `copytext` should expand to the full width of its container.\n   * @defaultValue false\n   */\n  @Prop() fullWidth = false;\n\n  /**\n   * Determines whether the `value` should truncate and display with an ellipsis.\n   * @defaultValue false\n   */\n  @Prop() truncate = false;\n\n  /**\n   * The string displayed that is also copied to the clipboard upon interaction.\n   */\n  @Prop() value!: string;\n\n  /**\n   * Event fired when copyText button is clicked.\n   */\n  @Event() pdsCopyTextClick: EventEmitter;\n\n  private copyToClipboard = async (value: string) => {\n    try {\n      if (typeof navigator.clipboard !== 'undefined') {\n        await navigator.clipboard.writeText(value);\n        this.pdsCopyTextClick.emit('Copied to clipboard');\n      }\n    } catch (err) {\n      this.pdsCopyTextClick.emit(`Error writing text to clipboard: ${err}`);\n    }\n  };\n\n  private handleClick = () => {\n    this.copyToClipboard(this.value);\n  };\n\n  private classNames() {\n    const classNames = ['pds-copytext'];\n\n    if (this.border) {\n      classNames.push('pds-copytext--bordered');\n    }\n\n    if (this.fullWidth) {\n      classNames.push('pds-copytext--full-width');\n    }\n\n    if (this.truncate) {\n      classNames.push('pds-copytext--truncated');\n    }\n\n    return classNames.join('  ');\n  }\n\n  render() {\n    return (\n      <Host class={this.classNames()} id={this.componentId}>\n        <pds-button type=\"button\" variant=\"unstyled\" onClick={this.handleClick}>\n          <span>{this.value}</span>\n          <pds-icon icon={copyIcon} size=\"16px\"></pds-icon>\n        </pds-button>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/pds-divider/pds-divider.js

@@ -17,7 +17,7 @@ export class PdsDivider {
         return classNames.join(' ');
     }
     render() {
-        return (h(Host, { key: '03b43edbf300af791cb86d11991507f1449981f7', id: this.componentId }, h("hr", { key: '3385a8497632540187d3c5f16716032d37d5c036', class: this.classNames() })));
+        return (h(Host, { key: 'cb64d56832d159848ac7d45959b5f1d9874715d7', id: this.componentId }, h("hr", { key: '10a7b11448b031b24174fe9278ac05504cf8523c', class: this.classNames() })));
     }
     static get is() { return "pds-divider"; }
     static get encapsulation() { return "shadow"; }
@@ -82,7 +82,7 @@ export class PdsDivider {
                             "name": "defaultValue",
                             "text": "false"
                         }],
-                    "text": "Sets divider to display vertically"
+                    "text": "Sets divider to display vertically."
                 },
                 "attribute": "vertical",
                 "reflect": false,

package/dist/collection/components/pds-divider/pds-divider.js.map

@@ -1 +1 @@
-{"version":3,"file":"pds-divider.js","sourceRoot":"","sources":["../../../src/components/pds-divider/pds-divider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,UAAU;;;;wBAeF,KAAK;;IAEhB,UAAU;QAChB,MAAM,UAAU,GAAG,CAAC,aAAa,CAAC,CAAC;QAEnC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,UAAU,CAAC,IAAI,CAAC,uBAAuB,CAAC,CAAC;QAC3C,CAAC;QAED,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,MAAM,eAAe,GAAG,sBAAsB,GAAG,IAAI,CAAC,MAAM,CAAC;YAC7D,UAAU,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACnC,CAAC;QAED,OAAO,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC9B,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,EAAE,EAAE,IAAI,CAAC,WAAW;YACxB,2DAAI,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,GAAI,CAC3B,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, Host, h } from '@stencil/core';\n\n@Component({\n  tag: 'pds-divider',\n  styleUrls: ['../../global/styles/base.scss', '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"]}
+{"version":3,"file":"pds-divider.js","sourceRoot":"","sources":["../../../src/components/pds-divider/pds-divider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,UAAU;;;;wBAeF,KAAK;;IAEhB,UAAU;QAChB,MAAM,UAAU,GAAG,CAAC,aAAa,CAAC,CAAC;QAEnC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,UAAU,CAAC,IAAI,CAAC,uBAAuB,CAAC,CAAC;QAC3C,CAAC;QAED,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,MAAM,eAAe,GAAG,sBAAsB,GAAG,IAAI,CAAC,MAAM,CAAC;YAC7D,UAAU,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACnC,CAAC;QAED,OAAO,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC9B,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,EAAE,EAAE,IAAI,CAAC,WAAW;YACxB,2DAAI,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,GAAI,CAC3B,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, Host, h } from '@stencil/core';\n\n@Component({\n  tag: 'pds-divider',\n  styleUrls: ['../../global/styles/base.scss', '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"]}

package/dist/collection/components/pds-image/pds-image.js

@@ -11,9 +11,9 @@ export class PdsImage {
         this.width = undefined;
     }
     render() {
-        return (h(Host, { key: '810bb5579a28b8a1867f202ccf555bcb0a1be2a5', class: {
+        return (h(Host, { key: 'b74f7f59eadec75c48052e0760ef07ea0b5eb848', class: {
                 'pds-image': true,
-            }, id: this.componentId }, h("img", { key: '66d78e000caaa91db5dbd68ce34824215d3c7bf9', alt: this.alt, height: this.height, loading: this.loading, sizes: this.sizes, src: this.src, srcset: this.srcset, width: this.width })));
+            }, id: this.componentId }, h("img", { key: '0e993e6d4cb70d73562cbcd3cf193080406adf7a', alt: this.alt, height: this.height, loading: this.loading, sizes: this.sizes, src: this.src, srcset: this.srcset, width: this.width })));
     }
     static get is() { return "pds-image"; }
     static get encapsulation() { return "shadow"; }
@@ -40,8 +40,11 @@ export class PdsImage {
                 "required": false,
                 "optional": true,
                 "docs": {
-                    "tags": [],
-                    "text": "The image's alt tag. If none is provided,\nit will default to an empty string."
+                    "tags": [{
+                            "name": "defaultValue",
+                            "text": "''"
+                        }],
+                    "text": "The image's alt tag. If none is provided,\nit will default to an empty string, which is desired for\ndecorative images."
                 },
                 "attribute": "alt",
                 "reflect": false,
@@ -92,7 +95,10 @@ export class PdsImage {
                 "required": false,
                 "optional": true,
                 "docs": {
-                    "tags": [],
+                    "tags": [{
+                            "name": "defaultValue",
+                            "text": "eager"
+                        }],
                     "text": "Indicates how the browser should load the image."
                 },
                 "attribute": "loading",
@@ -111,7 +117,7 @@ export class PdsImage {
                 "optional": true,
                 "docs": {
                     "tags": [],
-                    "text": "Determines the intended display size of an image\nwithin certian breakpoints. Has no effect if `srcset`\nis not set or value has no width descriptor."
+                    "text": "Determines the intended display size of an image\nwithin certain breakpoints. Has no effect if `srcset`\nis not set or value has no width descriptor."
                 },
                 "attribute": "sizes",
                 "reflect": false
@@ -145,7 +151,7 @@ export class PdsImage {
                 "optional": true,
                 "docs": {
                     "tags": [],
-                    "text": "A set of image sources for the browser to use."
+                    "text": "A set of image sources for the browser to use\nfor responsiveness."
                 },
                 "attribute": "srcset",
                 "reflect": false

package/dist/collection/components/pds-image/pds-image.js.map

@@ -1 +1 @@
-{"version":3,"file":"pds-image.js","sourceRoot":"","sources":["../../../src/components/pds-image/pds-image.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,QAAQ;;mBAKJ,EAAE;;;uBAiBoB,OAAO;;;;;;IA0B5C,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,WAAW,EAAE,IAAI;aAClB,EACD,EAAE,EAAE,IAAI,CAAC,WAAW;YAEpB,4DACE,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,GACjB,CACG,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'pds-image',\n  styleUrls: ['../../global/styles/base.scss', 'pds-image.scss'],\n  shadow: true,\n})\nexport class PdsImage {\n  /**\n   * The image's alt tag. If none is provided,\n   * it will default to an empty string.\n   */\n  @Prop() alt? = '';\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * The height of the image in pixels. Setting this will\n   * devote space in the layout to prevent layout\n   * shifts when the image is loaded.\n   */\n  @Prop() height?: number;\n\n  /**\n   * Indicates how the browser should load the image.\n   */\n  @Prop() loading?: 'eager' | 'lazy' = 'eager';\n\n  /**\n   * Determines the intended display size of an image\n   * within certian breakpoints. Has no effect if `srcset`\n   * is not set or value has no width descriptor.\n   */\n  @Prop() sizes?: string;\n\n  /**\n   * The image's source.\n   */\n  @Prop() src: string;\n\n  /**\n   * A set of image sources for the browser to use.\n   */\n  @Prop() srcset?: string\n\n  /**\n   * The width of the image in pixels. Setting this will\n   * devote space in the layout to prevent layout\n   * shifts when the image is loaded.\n   */\n  @Prop() width?: number;\n\n  render() {\n    return (\n      <Host\n        class={{\n          'pds-image': true,\n        }}\n        id={this.componentId}\n      >\n        <img\n          alt={this.alt}\n          height={this.height}\n          loading={this.loading}\n          sizes={this.sizes}\n          src={this.src}\n          srcset={this.srcset}\n          width={this.width}\n        />\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"pds-image.js","sourceRoot":"","sources":["../../../src/components/pds-image/pds-image.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,QAAQ;;mBAOJ,EAAE;;;uBAkBoB,OAAO;;;;;;IA2B5C,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,WAAW,EAAE,IAAI;aAClB,EACD,EAAE,EAAE,IAAI,CAAC,WAAW;YAEpB,4DACE,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,GACjB,CACG,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'pds-image',\n  styleUrls: ['../../global/styles/base.scss', 'pds-image.scss'],\n  shadow: true,\n})\nexport class PdsImage {\n  /**\n   * The image's alt tag. If none is provided,\n   * it will default to an empty string, which is desired for\n   * decorative images.\n   * @defaultValue ''\n   */\n  @Prop() alt? = '';\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * The height of the image in pixels. Setting this will\n   * devote space in the layout to prevent layout\n   * shifts when the image is loaded.\n   */\n  @Prop() height?: number;\n\n  /**\n   * Indicates how the browser should load the image.\n   * @defaultValue eager\n   */\n  @Prop() loading?: 'eager' | 'lazy' = 'eager';\n\n  /**\n   * Determines the intended display size of an image\n   * within certain breakpoints. Has no effect if `srcset`\n   * is not set or value has no width descriptor.\n   */\n  @Prop() sizes?: string;\n\n  /**\n   * The image's source.\n   */\n  @Prop() src: string;\n\n  /**\n   * A set of image sources for the browser to use\n   * for responsiveness.\n   */\n  @Prop() srcset?: string\n\n  /**\n   * The width of the image in pixels. Setting this will\n   * devote space in the layout to prevent layout\n   * shifts when the image is loaded.\n   */\n  @Prop() width?: number;\n\n  render() {\n    return (\n      <Host\n        class={{\n          'pds-image': true,\n        }}\n        id={this.componentId}\n      >\n        <img\n          alt={this.alt}\n          height={this.height}\n          loading={this.loading}\n          sizes={this.sizes}\n          src={this.src}\n          srcset={this.srcset}\n          width={this.width}\n        />\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/pds-input/pds-input.css

@@ -13,7 +13,7 @@
   --color-text-error: var(--pine-color-red-600);
   --color-text-placeholder: var(--pine-color-grey-600);
   --color-text-placeholder-disabled: var(--pine-color-grey-400);
-  --font-size-helper-message: var(--pine-font-size-100);
+  --font-size-helper-message: var(--pine-font-size-085);
   --font-size-input-field: var(--pine-font-size-100);
   --font-size-label: var(--pine-font-size-100);
   --font-weight-helper-message: var(--pine-font-weight-normal);
@@ -26,6 +26,7 @@
   --spacing-input-field-padding-inline: var(--pine-spacing-200);
   --spacing-label-margin-block-end: var(--pine-spacing-100);
   --spacing-margin-top-helper-message: var(--pine-spacing-100);
+  --spacing-icon-error-message: var(--pine-spacing-050);
   display: inline;
 }
 
@@ -110,5 +111,9 @@ input:has(~ .pds-input__error-message):focus-visible {
 }
 
 .pds-input__error-message {
+  align-items: center;
   color: var(--color-text-error);
+  display: flex;
+  font-size: var(--font-size-helper-message);
+  gap: var(--spacing-icon-error-message);
 }

package/dist/collection/components/pds-input/pds-input.js

@@ -1,6 +1,7 @@
 import { h, Host } from "@stencil/core";
 import { assignDescription, messageId } from "../../utils/form";
 import { PdsLabel } from "../_internal/pds-label/pds-label";
+import { danger } from "@pine-ds/icons/icons";
 export class PdsInput {
     constructor() {
         this.onInputEvent = (ev) => {
@@ -25,9 +26,9 @@ export class PdsInput {
         this.value = undefined;
     }
     render() {
-        return (h(Host, { key: '8990807dd2c25acb305113e838b14c4c6f5969d2', "aria-disabled": this.disabled ? 'true' : null }, h("div", { key: '15f1ccb9ef012df067bcb9feb51639a6e7d2c2c8', class: "pds-input" }, h(PdsLabel, { key: '73231c8d2bec7262e7bd6a0d002a130d29b102aa', htmlFor: this.componentId, text: this.label }), h("input", { key: 'd916e33b722be33c7908bad78400648fe39a120d', class: "pds-input__field", "aria-describedby": assignDescription(this.componentId, this.invalid, this.helperMessage), "aria-invalid": this.invalid ? "true" : undefined, autocomplete: this.autocomplete, disabled: this.disabled, id: this.componentId, name: this.name, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, type: this.type, value: this.value, onInput: this.onInputEvent }), this.helperMessage &&
-            h("p", { key: '91fb93380296d18b97e5469bd56d04e8aceab20d', class: "pds-input__helper-message", id: messageId(this.componentId, 'helper') }, this.helperMessage), this.errorMessage &&
-            h("p", { key: '97fe0723e77b49b6be1f7666888a5d97d9ab842b', class: "pds-input__error-message", id: messageId(this.componentId, 'error'), "aria-live": "assertive" }, this.errorMessage))));
+        return (h(Host, { key: '2f805bb34305276216d5eb59b869b0a1e8d36745', "aria-disabled": this.disabled ? 'true' : null }, h("div", { key: 'c0a9c51f99aa746d0c8edda0306055e637cfcf98', class: "pds-input" }, h(PdsLabel, { key: '636c5aa772da49e1e84b29b6dde1191a71de0d5f', htmlFor: this.componentId, text: this.label }), h("input", { key: 'c9e5c281a2b5fe4e2c652bc44a9ad14e3d6b90c8', class: "pds-input__field", "aria-describedby": assignDescription(this.componentId, this.invalid, this.helperMessage), "aria-invalid": this.invalid ? "true" : undefined, autocomplete: this.autocomplete, disabled: this.disabled, id: this.componentId, name: this.name, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, type: this.type, value: this.value, onInput: this.onInputEvent }), this.helperMessage &&
+            h("p", { key: '48c897acc4d26ab2e1a4e16e04ba0f730e5aeb72', class: "pds-input__helper-message", id: messageId(this.componentId, 'helper') }, this.helperMessage), this.errorMessage &&
+            h("p", { key: 'fe0ba7e0e0032983128c41a772f22d2c804345fb', class: "pds-input__error-message", id: messageId(this.componentId, 'error'), "aria-live": "assertive" }, h("pds-icon", { key: '6270eed8637a5342911e0947f462f592bbedddac', icon: danger, size: "small" }), this.errorMessage))));
     }
     static get is() { return "pds-input"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pds-input/pds-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"pds-input.js","sourceRoot":"","sources":["../../../src/components/pds-input/pds-input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC9E,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAChE,OAAO,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AAO5D,MAAM,OAAO,QAAQ;;QA0EX,iBAAY,GAAG,CAAC,EAAS,EAAE,EAAE;YACnC,MAAM,KAAK,GAAG,EAAE,CAAC,MAAiC,CAAC;YACnD,IAAI,KAAK,EAAE,CAAC;gBACV,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,IAAI,EAAE,CAAC;YACjC,CAAC;YACD,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAgB,CAAC,CAAC;QACvC,CAAC,CAAC;;;;;;;;;;;;oBAlBa,MAAM;;;IAoBrB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,sEACY,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI;YAE5C,4DAAK,KAAK,EAAC,WAAW;gBACpB,EAAC,QAAQ,qDAAC,OAAO,EAAE,IAAI,CAAC,WAAW,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,GAAI;gBACzD,8DAAO,KAAK,EAAC,kBAAkB,sBACX,iBAAiB,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,kBACzE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAC/C,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,EAAE,EAAE,IAAI,CAAC,WAAW,EACpB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,IAAI,CAAC,YAAY,GAC1B;gBACD,IAAI,CAAC,aAAa;oBACjB,0DACE,KAAK,EAAC,2BAA2B,EACjC,EAAE,EAAE,SAAS,CAAC,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,IAExC,IAAI,CAAC,aAAa,CACjB;gBAEL,IAAI,CAAC,YAAY;oBAChB,0DACE,KAAK,EAAC,0BAA0B,EAChC,EAAE,EAAE,SAAS,CAAC,IAAI,CAAC,WAAW,EAAE,OAAO,CAAC,eAC9B,WAAW,IAEpB,IAAI,CAAC,YAAY,CAChB,CAEF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { PdsLabel } from '../_internal/pds-label/pds-label';\n\n@Component({\n  tag: 'pds-input',\n  styleUrls: ['../../global/styles/base.scss', 'pds-input.scss'],\n  shadow: true,\n})\nexport class PdsInput {\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   * Indicates whether or not the input field is disabled.\n   */\n  @Prop() disabled?: boolean;\n\n  /**\n   * Specifies the error message and provides an error-themed treatment to the field.\n   */\n  @Prop() errorMessage?: string;\n\n  /**\n   * Displays a message or hint below the input field.\n   */\n  @Prop() helperMessage?: string;\n\n  /**\n   * Indicates whether or not the input field is invalid or throws an error.\n   */\n  @Prop() invalid?: boolean;\n\n  /**\n   * Text to be displayed as the input label.\n   */\n  @Prop() label?: string;\n\n  /**\n   * Specifies the name. Submitted with the form name/value pair.\n   */\n  @Prop() name?: string;\n\n  /**\n   * Specifies a short hint that describes the expected value of the input field.\n   */\n  @Prop() placeholder?: string;\n\n  /**\n   * Indicates whether or not the input field is readonly.\n   */\n  @Prop() readonly?: boolean;\n\n  /**\n   * Indicates whether or not the input field is required.\n   */\n  @Prop() required?: boolean;\n\n  /**\n   * Determines the type of control that will be displayed\n   `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`\n   * @defaultValue \"text\"\n   */\n  @Prop() type = 'text';\n\n  /**\n   * The value of the input.\n   */\n  @Prop({mutable: true}) value?: string;\n\n  /**\n   * Emitted when a keyboard input occurred.\n   */\n  @Event() pdsInput: EventEmitter<InputEvent>;\n\n  private onInputEvent = (ev: Event) => {\n    const input = ev.target as HTMLInputElement | null;\n    if (input) {\n      this.value = input.value || '';\n    }\n    this.pdsInput.emit(ev as InputEvent);\n  };\n\n  render() {\n    return (\n      <Host\n        aria-disabled={this.disabled ? 'true' : null}\n      >\n        <div class=\"pds-input\">\n          <PdsLabel htmlFor={this.componentId} text={this.label} />\n          <input class=\"pds-input__field\"\n            aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n            aria-invalid={this.invalid ? \"true\" : undefined}\n            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          />\n          {this.helperMessage &&\n            <p\n              class=\"pds-input__helper-message\"\n              id={messageId(this.componentId, 'helper')}\n            >\n              {this.helperMessage}\n            </p>\n          }\n          {this.errorMessage &&\n            <p\n              class=\"pds-input__error-message\"\n              id={messageId(this.componentId, 'error')}\n              aria-live=\"assertive\"\n            >\n              {this.errorMessage}\n            </p>\n          }\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"pds-input.js","sourceRoot":"","sources":["../../../src/components/pds-input/pds-input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC9E,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAChE,OAAO,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAO9C,MAAM,OAAO,QAAQ;;QA0EX,iBAAY,GAAG,CAAC,EAAS,EAAE,EAAE;YACnC,MAAM,KAAK,GAAG,EAAE,CAAC,MAAiC,CAAC;YACnD,IAAI,KAAK,EAAE,CAAC;gBACV,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,IAAI,EAAE,CAAC;YACjC,CAAC;YACD,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAgB,CAAC,CAAC;QACvC,CAAC,CAAC;;;;;;;;;;;;oBAlBa,MAAM;;;IAoBrB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,sEACY,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI;YAE5C,4DAAK,KAAK,EAAC,WAAW;gBACpB,EAAC,QAAQ,qDAAC,OAAO,EAAE,IAAI,CAAC,WAAW,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,GAAI;gBACzD,8DAAO,KAAK,EAAC,kBAAkB,sBACX,iBAAiB,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,kBACzE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAC/C,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,EAAE,EAAE,IAAI,CAAC,WAAW,EACpB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,IAAI,CAAC,YAAY,GAC1B;gBACD,IAAI,CAAC,aAAa;oBACjB,0DACE,KAAK,EAAC,2BAA2B,EACjC,EAAE,EAAE,SAAS,CAAC,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,IAExC,IAAI,CAAC,aAAa,CACjB;gBAEL,IAAI,CAAC,YAAY;oBAChB,0DACE,KAAK,EAAC,0BAA0B,EAChC,EAAE,EAAE,SAAS,CAAC,IAAI,CAAC,WAAW,EAAE,OAAO,CAAC,eAC9B,WAAW;wBAErB,iEAAU,IAAI,EAAE,MAAM,EAAE,IAAI,EAAC,OAAO,GAAG;wBACtC,IAAI,CAAC,YAAY,CAChB,CAEF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { PdsLabel } from '../_internal/pds-label/pds-label';\nimport { danger } from '@pine-ds/icons/icons';\n\n@Component({\n  tag: 'pds-input',\n  styleUrls: ['../../global/styles/base.scss', 'pds-input.scss'],\n  shadow: true,\n})\nexport class PdsInput {\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   * Indicates whether or not the input field is disabled.\n   */\n  @Prop() disabled?: boolean;\n\n  /**\n   * Specifies the error message and provides an error-themed treatment to the field.\n   */\n  @Prop() errorMessage?: string;\n\n  /**\n   * Displays a message or hint below the input field.\n   */\n  @Prop() helperMessage?: string;\n\n  /**\n   * Indicates whether or not the input field is invalid or throws an error.\n   */\n  @Prop() invalid?: boolean;\n\n  /**\n   * Text to be displayed as the input label.\n   */\n  @Prop() label?: string;\n\n  /**\n   * Specifies the name. Submitted with the form name/value pair.\n   */\n  @Prop() name?: string;\n\n  /**\n   * Specifies a short hint that describes the expected value of the input field.\n   */\n  @Prop() placeholder?: string;\n\n  /**\n   * Indicates whether or not the input field is readonly.\n   */\n  @Prop() readonly?: boolean;\n\n  /**\n   * Indicates whether or not the input field is required.\n   */\n  @Prop() required?: boolean;\n\n  /**\n   * Determines the type of control that will be displayed\n   `'email'`, `'number'`, `'password'`, `'tel'`, `'text'`\n   * @defaultValue \"text\"\n   */\n  @Prop() type = 'text';\n\n  /**\n   * The value of the input.\n   */\n  @Prop({mutable: true}) value?: string;\n\n  /**\n   * Emitted when a keyboard input occurred.\n   */\n  @Event() pdsInput: EventEmitter<InputEvent>;\n\n  private onInputEvent = (ev: Event) => {\n    const input = ev.target as HTMLInputElement | null;\n    if (input) {\n      this.value = input.value || '';\n    }\n    this.pdsInput.emit(ev as InputEvent);\n  };\n\n  render() {\n    return (\n      <Host\n        aria-disabled={this.disabled ? 'true' : null}\n      >\n        <div class=\"pds-input\">\n          <PdsLabel htmlFor={this.componentId} text={this.label} />\n          <input class=\"pds-input__field\"\n            aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n            aria-invalid={this.invalid ? \"true\" : undefined}\n            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          />\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"]}

package/dist/collection/components/pds-link/pds-link.js

@@ -1,8 +1,8 @@
 import { h } from "@stencil/core";
 import { launch } from "@pine-ds/icons/icons";
 /**
- * @part link - The main link element that represents the link component.
- * @slot - Content is placed between the opening closing tags.
+ * @part link - Link element styles.
+ * @slot (default) - Text content placed between the opening and closing tags. If no text is provided, the **href** will be used as a fallback.
  */
 export class PdsLink {
     constructor() {
@@ -23,8 +23,8 @@ export class PdsLink {
         return classNames.join(' ');
     }
     render() {
-        return (h("a", { key: '48d18c76dabdf7848cb28406ca41bcb319046f15', class: this.classNames(), href: this.href, id: this.componentId, target: this.external ? '_blank' : undefined, part: "link" }, h("slot", { key: 'd1300abecf3a94cbeb0dd0203e0938496499750b' }, this.href), this.external &&
-            h("pds-icon", { key: '353ee581e0060669910e0e9220f3e85d2c46e41b', icon: launch, size: this.fontSize })));
+        return (h("a", { key: '0301c40c5571d5713ff50262c9cd288b476bfb02', class: this.classNames(), href: this.href, id: this.componentId, target: this.external ? '_blank' : undefined, part: "link" }, h("slot", { key: 'dae97a17d38c0308d74f75b859d704d0d28d789d' }, this.href), this.external &&
+            h("pds-icon", { key: '5c242186e0080db10ede73c232fd83643b54df03', icon: launch, size: this.fontSize })));
     }
     static get is() { return "pds-link"; }
     static get encapsulation() { return "shadow"; }
@@ -72,7 +72,7 @@ export class PdsLink {
                             "name": "defaultValue",
                             "text": "false"
                         }],
-                    "text": "When enabled, opens link in a new tab."
+                    "text": "Determines whether the link should open in a new tab."
                 },
                 "attribute": "external",
                 "reflect": false,
@@ -89,8 +89,11 @@ export class PdsLink {
                 "required": false,
                 "optional": false,
                 "docs": {
-                    "tags": [],
-                    "text": "\nModifies the look of the link"
+                    "tags": [{
+                            "name": "defaultValue",
+                            "text": "inline"
+                        }],
+                    "text": "Sets the link variant styles."
                 },
                 "attribute": "variant",
                 "reflect": false,
@@ -111,7 +114,7 @@ export class PdsLink {
                             "name": "defaultValue",
                             "text": "lg"
                         }],
-                    "text": "\nThe Font size follows t-shirt model\nsm: 12px\nmd: 14px\nlg: 16px"
+                    "text": "The font size of the link's text."
                 },
                 "attribute": "font-size",
                 "reflect": false,
@@ -129,7 +132,7 @@ export class PdsLink {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "The URL that the hyperlink points to."
+                    "text": "The hyperlink's destination URL. If no text is provided in the custom slot, the href will be used."
                 },
                 "attribute": "href",
                 "reflect": false

package/dist/collection/components/pds-link/pds-link.js.map

@@ -1 +1 @@
-{"version":3,"file":"pds-link.js","sourceRoot":"","sources":["../../../src/components/pds-link/pds-link.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAE9C;;;GAGG;AAMH,MAAM,OAAO,OAAO;;;wBAUC,KAAK;uBAMc,QAAQ;wBAUP,IAAI;;;IAOnC,UAAU;QAChB,MAAM,UAAU,GAAG,CAAC,UAAU,CAAC,CAAC;QAEhC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;QAChD,CAAC;QAED,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACjB,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC;QAC/C,CAAC;QAED,OAAO,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC9B,CAAC;IAED,MAAM;QAEJ,OAAO,CACL,0DACE,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EACxB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,EAAE,EAAE,IAAI,CAAC,WAAW,EACpB,MAAM,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAC5C,IAAI,EAAC,MAAM;YAEX,+DAAO,IAAI,CAAC,IAAI,CAAQ;YACvB,IAAI,CAAC,QAAQ;gBACZ,iEAAU,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,GAAa,CAExD,CACL,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\nimport { launch } from '@pine-ds/icons/icons';\n\n/**\n * @part link - The main link element that represents the link component.\n * @slot - Content is placed between the opening closing tags.\n */\n@Component({\n  tag: 'pds-link',\n  styleUrls: ['../../global/styles/base.scss', 'pds-link.scss'],\n  shadow: true,\n})\nexport class PdsLink {\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * When enabled, opens link in a new tab.\n   * @defaultValue false\n   */\n  @Prop() external = false;\n\n  /**\n   *\n   * Modifies the look of the link\n   */\n  @Prop() variant: 'inline' | 'plain' = 'inline';\n\n  /**\n   *\n   * The Font size follows t-shirt model\n   * sm: 12px\n   * md: 14px\n   * lg: 16px\n   * @defaultValue lg\n   */\n  @Prop() fontSize: 'sm' | 'md' | 'lg' = 'lg';\n\n  /**\n   * The URL that the hyperlink points to.\n   */\n  @Prop() href!: string;\n\n  private classNames() {\n    const classNames = ['pds-link'];\n\n    if (this.fontSize) {\n      classNames.push('pds-link--' + this.fontSize);\n    }\n\n    if (this.variant) {\n      classNames.push('pds-link--' + this.variant);\n    }\n\n    return classNames.join(' ');\n  }\n\n  render() {\n\n    return (\n      <a\n        class={this.classNames()}\n        href={this.href}\n        id={this.componentId}\n        target={this.external ? '_blank' : undefined}\n        part=\"link\"\n      >\n        <slot>{this.href}</slot>\n        {this.external &&\n          <pds-icon icon={launch} size={this.fontSize}></pds-icon>\n        }\n      </a>\n    );\n  }\n}\n"]}
+{"version":3,"file":"pds-link.js","sourceRoot":"","sources":["../../../src/components/pds-link/pds-link.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAE9C;;;GAGG;AAMH,MAAM,OAAO,OAAO;;;wBAUC,KAAK;uBAMc,QAAQ;wBAMP,IAAI;;;IAOnC,UAAU;QAChB,MAAM,UAAU,GAAG,CAAC,UAAU,CAAC,CAAC;QAEhC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;QAChD,CAAC;QAED,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACjB,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC;QAC/C,CAAC;QAED,OAAO,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC9B,CAAC;IAED,MAAM;QAEJ,OAAO,CACL,0DACE,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EACxB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,EAAE,EAAE,IAAI,CAAC,WAAW,EACpB,MAAM,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAC5C,IAAI,EAAC,MAAM;YAEX,+DAAO,IAAI,CAAC,IAAI,CAAQ;YACvB,IAAI,CAAC,QAAQ;gBACZ,iEAAU,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,GAAa,CAExD,CACL,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\nimport { launch } from '@pine-ds/icons/icons';\n\n/**\n * @part link - Link element styles.\n * @slot (default) - Text content placed between the opening and closing tags. If no text is provided, the **href** will be used as a fallback.\n */\n@Component({\n  tag: 'pds-link',\n  styleUrls: ['../../global/styles/base.scss', 'pds-link.scss'],\n  shadow: true,\n})\nexport class PdsLink {\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Determines whether the link should open in a new tab.\n   * @defaultValue false\n   */\n  @Prop() external = false;\n\n  /**\n   * Sets the link variant styles.\n   * @defaultValue inline\n   */\n  @Prop() variant: 'inline' | 'plain' = 'inline';\n\n  /**\n   * The font size of the link's text.\n   * @defaultValue lg\n   */\n  @Prop() fontSize: 'sm' | 'md' | 'lg' = 'lg';\n\n  /**\n   * The hyperlink's destination URL. If no text is provided in the custom slot, the href will be used.\n   */\n  @Prop() href!: string;\n\n  private classNames() {\n    const classNames = ['pds-link'];\n\n    if (this.fontSize) {\n      classNames.push('pds-link--' + this.fontSize);\n    }\n\n    if (this.variant) {\n      classNames.push('pds-link--' + this.variant);\n    }\n\n    return classNames.join(' ');\n  }\n\n  render() {\n\n    return (\n      <a\n        class={this.classNames()}\n        href={this.href}\n        id={this.componentId}\n        target={this.external ? '_blank' : undefined}\n        part=\"link\"\n      >\n        <slot>{this.href}</slot>\n        {this.external &&\n          <pds-icon icon={launch} size={this.fontSize}></pds-icon>\n        }\n      </a>\n    );\n  }\n}\n"]}

package/dist/collection/components/pds-loader/pds-loader.js

@@ -33,7 +33,7 @@ export class PdsLoader {
         }
     }
     render() {
-        return (h(Host, { key: 'd86c3a84f772eedb15662d0d2e22e53ec7064245', class: `pds-loader ${this.isLoading ? '' : 'pds-loader--hidden'}`, "aria-hidden": !this.isLoading, "aria-busy": this.isLoading, "aria-live": "polite" }, this.variant === 'spinner' && (h("div", { key: 'ec7cda5951617f46427729e5497c7d1b46562ae0', class: "pds-loader--spinner" }, h("svg", { key: '5a7bc867400981ba2190dd00836af63cd2492e80', style: this.style(), viewBox: "0 0 200 200", fill: "none" }, h("defs", { key: 'ee88cb4c138868b286f017f84925d3cf8226eeb8' }, h("linearGradient", { key: '435c54ff00cf11654e01d3d6932e77e74fdef8ae', id: "spinner-secondHalf" }, h("stop", { key: '4b9b65cde42833c14285f97c7f4b4acb681db89c', offset: "0%", "stop-opacity": "0", "stop-color": "currentColor" }), h("stop", { key: '207b3963322e1f7f54f2b7b42b328e868a9b8e78', offset: "100%", "stop-opacity": "0.5", "stop-color": "currentColor" })), h("linearGradient", { key: 'fc877ee5738a8184227fe022534e9cdfd8e27bd1', id: "spinner-firstHalf" }, h("stop", { key: '3d210b400691e364e9d1214531c86003a7588d2c', offset: "0%", "stop-opacity": "1", "stop-color": "currentColor" }), h("stop", { key: 'e99b0c940dc876637d90c3d86ce87f35e2f82687', offset: "100%", "stop-opacity": "0.5", "stop-color": "currentColor" }))), h("g", { key: 'f2acd79941647de3a5c5aae6383d021d1fad7493', class: "pds-loader__spinner-path" }, h("path", { key: '9f1d64d00c633dc7ff0a0f2173c7f0e0c04198d6', stroke: "url(#spinner-secondHalf)", d: "M 4 100 A 96 96 0 0 1 196 100" }), h("path", { key: 'd5ff2bd47100be8eee961b00102e77b3456e8236', stroke: "url(#spinner-firstHalf)", d: "M 196 100 A 96 96 0 0 1 4 100" }), h("path", { key: 'd7cc6e2da92238c023d322f023e7e437a5d41404', stroke: "currentColor", "stroke-linecap": "round", d: "M 4 100 A 96 96 0 0 1 4 98" }))))), this.variant === 'typing' && (h("div", { key: '3c893dc1ae4f39f2b5873ba46d4ae30f873d1158', class: "pds-loader--typing" }, h("span", { key: '8b38041018e2039fcc19ad3dbce6de3924725cc3' }), h("span", { key: 'b3e827a9fded83368404e8bb5c83306ff6a35979' }), h("span", { key: '41fedabc2db044862892ae68476756c6400a58fa' }))), h("div", { key: 'b4cf5add3094c4824612216b8ca7291a4e40ff08', class: `pds-loader__label ${this.showLabel ? '' : 'pds-loader--hidden'}` }, h("slot", { key: 'c7b10e65a5a5350e7973a49c540907edf44c71fa', name: "label" }, "Loading..."))));
+        return (h(Host, { key: 'e69acbb3ba84e723ce654fb8288c54d6c878a515', class: `pds-loader ${this.isLoading ? '' : 'pds-loader--hidden'}`, "aria-hidden": !this.isLoading, "aria-busy": this.isLoading, "aria-live": "polite" }, this.variant === 'spinner' && (h("div", { key: 'dd121b0adc8825e8b8e5aa6c4c2756d2bbc8aec3', class: "pds-loader--spinner" }, h("svg", { key: '91474584a672fc78a0e1d169eaff53fbbce1b658', style: this.style(), viewBox: "0 0 200 200", fill: "none" }, h("defs", { key: '38fe6181c360cce4c31402ac7408b3120dbf4419' }, h("linearGradient", { key: '29cf900bc3ab8c6b5cb7da36f96207b4e234179a', id: "spinner-secondHalf" }, h("stop", { key: 'aaa993d38e5cc792417160d8febde05e94a55503', offset: "0%", "stop-opacity": "0", "stop-color": "currentColor" }), h("stop", { key: '3df5fe92f07c054016840413979e6f4bbc967af1', offset: "100%", "stop-opacity": "0.5", "stop-color": "currentColor" })), h("linearGradient", { key: '853f7b5ae56dab5688c1bbf2e24fd3f38f13997f', id: "spinner-firstHalf" }, h("stop", { key: '54282ea20ec47332c65559f70ca4dd1429c2fe44', offset: "0%", "stop-opacity": "1", "stop-color": "currentColor" }), h("stop", { key: '471bc0aaa05940103ca1aa50b9772e514a19f912', offset: "100%", "stop-opacity": "0.5", "stop-color": "currentColor" }))), h("g", { key: 'de35b85d92de0e958a0ec6753fa2362d2884c99f', class: "pds-loader__spinner-path" }, h("path", { key: '2238b370478f385ad6201b4aeadc9aedc7702ac7', stroke: "url(#spinner-secondHalf)", d: "M 4 100 A 96 96 0 0 1 196 100" }), h("path", { key: '3a6434262838be8654212f30f40af5bb50c5b679', stroke: "url(#spinner-firstHalf)", d: "M 196 100 A 96 96 0 0 1 4 100" }), h("path", { key: '687280eed667bfa794c4ea380274867614b66ff6', stroke: "currentColor", "stroke-linecap": "round", d: "M 4 100 A 96 96 0 0 1 4 98" }))))), this.variant === 'typing' && (h("div", { key: 'a38bb46b431c96efa00d234ec6ce6b3ff2adb0e5', class: "pds-loader--typing" }, h("span", { key: 'bdd865189cf2fe87181b13fbdb01fcc7086c9f2c' }), h("span", { key: '79be0a18686ac726b3b012cb1b796a1265c45ddb' }), h("span", { key: '351a6709d5b50c27b82d9dfba1d01cd058e8c10f' }))), h("div", { key: '81602e65ce055f10b39a70d5f29ffb62471bcb25', class: `pds-loader__label ${this.showLabel ? '' : 'pds-loader--hidden'}` }, h("slot", { key: '1ce406972db7f6ef5cc7d558301facb5e455956b', name: "label" }, "Loading..."))));
     }
     static get is() { return "pds-loader"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pds-popover/pds-popover.css

@@ -0,0 +1,51 @@
+:host {
+  --sizing-max-width-default: 352px;
+  display: inline-block;
+}
+:host [popover] {
+  background-color: var(--pine-color-white);
+  border: 1px solid var(--pine-color-gray-200);
+  border-radius: var(--pine-border-radius-125);
+  box-shadow: var(--pine-box-shadow-200);
+  margin: 0;
+  max-width: var(--sizing-max-width-default);
+  padding: var(--pine-spacing-300);
+  position: fixed;
+}
+:host button {
+  --border-radius-default: var(--pine-border-radius-round);
+  --border-width-default: var(--pine-border-width-thin);
+  --border-width-unstyled: var(--pine-border-radius-0);
+  --color-background-secondary-hover: var(--pine-color-grey-050);
+  --color-border-secondary-default: var(--pine-color-grey-400);
+  --color-border-secondary-disabled: var(--pine-color-grey-300);
+  --color-border-secondary-focus: var(--pine-color-grey-300);
+  --color-border-secondary-hover: var(--pine-color-grey-500);
+  --color-text-secondary-default: var(--pine-color-grey-800);
+  --color-text-secondary-disabled: var(--pine-color-grey-400);
+  --color-outline-secondary: var(--pine-color-purple-300);
+  --color-border-disabled: var(--color-border-secondary-disabled);
+  --color-border-focus: var(--color-border-secondary-focus);
+  --color-border-hover: var(--color-border-secondary-hover);
+  --color-border-default: var(--color-border-secondary-default);
+  --color-text-default: var(--color-text-secondary-default);
+  --color-text-disabled: var(--color-text-secondary-disabled);
+  --color-outline: var(--color-outline-secondary);
+  --spacing-padding-block: var(--pine-spacing-100);
+  --spacing-padding-inline: var(--pine-spacing-200);
+  align-items: center;
+  background-color: var(--color-background-default);
+  border: var(--border-width-default) solid var(--color-border-default);
+  border-radius: var(--pine-border-radius-circle);
+  color: var(--color-text-default);
+  display: flex;
+  font-family: var(--pine-font-family-greet);
+  font-size: var(--pine-font-size-100);
+  font-weight: var(--pine-font-weight-body-medium);
+  line-height: var(--pine-line-height-150);
+  min-height: 40px;
+  padding: var(--spacing-padding-block) var(--spacing-padding-inline);
+}
+:host button:hover {
+  background-color: var(--color-background-secondary-hover);
+}