@pine-ds/core 2.16.1 → 2.16.3

package/dist/cjs/pds-switch.cjs.entry.js

@@ -5,10 +5,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-b7d9268e.js');
 const form = require('./form-4f00637c.js');
 const pdsLabel = require('./pds-label-e0d9a97d.js');
-const index$1 = require('./index-034a8bb0.js');
+const index$1 = require('./index-59b0d7e2.js');
 
-const pdsSwitchCss = ":host{--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);--sizing-input-toggle-size:calc(var(--pine-dimension-250) - (var(--pine-dimension-025) * 2));--pine-dimension-025:2px;--spacing-message-inline:calc(var(--pine-dimension-450) + var(--pine-dimension-150));--number-transition-timing:0.15s ease-out;-ms-flex-align:start;align-items:flex-start;color:var(--pine-color-text);display:-ms-inline-flexbox;display:inline-flex;-ms-flex-flow:row wrap;flex-flow:row wrap;position:relative}:host(.pds-switch--error){color:var(--pine-color-text-message-danger)}:host(.pds-switch--error) input,:host(.pds-switch--error) input:checked,:host(.pds-switch--error) input:hover:not(:disabled):not(:checked){background-color:var(--pine-color-danger)}:host(.pds-switch--error) input:focus-visible:not(:disabled):not(:checked){-webkit-box-shadow:var(--box-shadow-focus-error);box-shadow:var(--box-shadow-focus-error)}:host(.pds-switch--error) label{color:var(--color-text-error)}input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--pine-color-neutral);border:0;border-radius:var(--pine-dimension-sm);cursor:pointer;display:inline-block;height:var(--pine-dimension-250);margin:0;padding:0;position:relative;-webkit-transition:var(--number-transition-timing);transition:var(--number-transition-timing);-webkit-transition-property:background, border, color;transition-property:background, border, color;width:var(--pine-dimension-450)}input::after{background:var(--pine-color-secondary);border-radius:var(--pine-border-radius-full);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);content:\"\";display:block;height:var(--sizing-input-toggle-size);inset-block-start:50%;inset-inline-start:50%;position:absolute;-webkit-transform:translate3d(-100%, -50%, 0);transform:translate3d(-100%, -50%, 0);-webkit-transition:-webkit-transform var(--number-transition-timing);transition:-webkit-transform var(--number-transition-timing);transition:transform var(--number-transition-timing);transition:transform var(--number-transition-timing), -webkit-transform var(--number-transition-timing);width:var(--sizing-input-toggle-size)}label{cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-positive:1;flex-grow:1;font-weight:var(--pine-font-weight-medium);-webkit-margin-start:var(--pine-dimension-150);margin-inline-start:var(--pine-dimension-150)}.pds-switch--error label{color:inherit}.pds-switch__message{color:var(--pine-color-text-message);-ms-flex:1 0 100%;flex:1 0 100%;font:var(--pine-typography-body-sm-medium);-webkit-margin-before:var(--pine-dimension-xs);margin-block-start:var(--pine-dimension-xs)}.pds-switch__message+.pds-switch__message{-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-switch__message--error{-ms-flex-align:center;align-items:center;color:inherit;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}input:disabled{background-color:var(--pine-color-neutral-disabled);cursor:not-allowed}input:disabled~label{color:var(--pine-color-text-disabled);cursor:initial}input:disabled:hover::after{background-color:var(--pine-color-background-container-disabled)}input:disabled .pds-switch__message{color:initial}input:hover:not(:disabled){background-color:var(--pine-color-neutral-hover)}input:focus-visible:not(:disabled){-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}input:checked::after{-webkit-transform:translate3d(0, -50%, 0);transform:translate3d(0, -50%, 0)}input:checked:not(:disabled){background-color:currentColor;color:var(--pine-color-accent)}input:checked:not(:disabled):hover{border-color:currentColor;color:var(--pine-color-accent-hover)}";
-const PdsSwitchStyle0 = pdsSwitchCss;
+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 PdsSwitchStyle0 = labelCss;
+
+const pdsSwitchCss = ":host{--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);--sizing-input-toggle-size:calc(var(--pine-dimension-250) - (var(--pine-dimension-025) * 2));--pine-dimension-025:2px;--spacing-message-inline:calc(var(--pine-dimension-450) + var(--pine-dimension-150));--number-transition-timing:0.15s ease-out;-ms-flex-align:start;align-items:flex-start;color:var(--pine-color-text);display:-ms-inline-flexbox;display:inline-flex;-ms-flex-flow:row wrap;flex-flow:row wrap;position:relative}:host(.pds-switch--error){color:var(--pine-color-text-message-danger)}:host(.pds-switch--error) input,:host(.pds-switch--error) input:checked,:host(.pds-switch--error) input:hover:not(:disabled):not(:checked){background-color:var(--pine-color-danger)}:host(.pds-switch--error) input:focus-visible:not(:disabled):not(:checked){-webkit-box-shadow:var(--box-shadow-focus-error);box-shadow:var(--box-shadow-focus-error)}:host(.pds-switch--error) label{color:var(--color-text-error)}input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--pine-color-neutral);border:0;border-radius:var(--pine-dimension-sm);cursor:pointer;display:inline-block;height:var(--pine-dimension-250);margin:0;padding:0;position:relative;-webkit-transition:var(--number-transition-timing);transition:var(--number-transition-timing);-webkit-transition-property:background, border, color;transition-property:background, border, color;width:var(--pine-dimension-450)}input::after{background:var(--pine-color-secondary);border-radius:var(--pine-border-radius-full);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);content:\"\";display:block;height:var(--sizing-input-toggle-size);inset-block-start:50%;inset-inline-start:50%;position:absolute;-webkit-transform:translate3d(-100%, -50%, 0);transform:translate3d(-100%, -50%, 0);-webkit-transition:-webkit-transform var(--number-transition-timing);transition:-webkit-transform var(--number-transition-timing);transition:transform var(--number-transition-timing);transition:transform var(--number-transition-timing), -webkit-transform var(--number-transition-timing);width:var(--sizing-input-toggle-size)}label{cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-positive:1;flex-grow:1;-webkit-margin-start:var(--pine-dimension-150);margin-inline-start:var(--pine-dimension-150)}.pds-switch--error label{color:inherit}.pds-switch__message{color:var(--pine-color-text-message);-ms-flex:1 0 100%;flex:1 0 100%;font:var(--pine-typography-body-sm-medium);-webkit-margin-before:var(--pine-dimension-xs);margin-block-start:var(--pine-dimension-xs);-webkit-margin-start:var(--pine-dimension-2xl);margin-inline-start:var(--pine-dimension-2xl)}.pds-switch__message+.pds-switch__message{-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-switch__message--error{-ms-flex-align:center;align-items:center;color:inherit;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}input:disabled{background-color:var(--pine-color-neutral-disabled);cursor:not-allowed}input:disabled~label{cursor:initial}input:disabled:hover::after{background-color:var(--pine-color-background-container-disabled)}input:disabled .pds-switch__message{color:initial}input:hover:not(:disabled){background-color:var(--pine-color-neutral-hover)}input:focus-visible:not(:disabled){-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}input:checked::after{-webkit-transform:translate3d(0, -50%, 0);transform:translate3d(0, -50%, 0)}input:checked:not(:disabled){background-color:currentColor;color:var(--pine-color-accent)}input:checked:not(:disabled):hover{border-color:currentColor;color:var(--pine-color-accent-hover)}";
+const PdsSwitchStyle1 = pdsSwitchCss;
 
 const PdsSwitch = class {
     constructor(hostRef) {
@@ -43,13 +46,13 @@ const PdsSwitch = class {
         this.value = undefined;
     }
     render() {
-        return (index.h(index.Host, { key: '0c57e5a99f6d5c398c9c1a0164a9cad167d21bf8', class: this.switchClassNames(), "aria-disabled": this.disabled ? 'true' : null }, index.h("input", { key: '3be2c03ee6525bdc1b215f252d9a8a04539fec9d', "aria-describedby": form.assignDescription(this.componentId, this.invalid, this.helperMessage), "aria-invalid": this.invalid ? "true" : undefined, checked: this.checked, class: "pds-switch__input", disabled: this.disabled, id: this.componentId, name: this.name ? this.name : this.componentId, onChange: this.onSwitchUpdate, required: this.required, type: "checkbox", value: this.value }), index.h(pdsLabel.PdsLabel, { key: 'c6a42085334420dc87265dbb89414c23af3e82d1', classNames: "pds-switch__label", htmlFor: this.componentId, text: this.label }), this.helperMessage &&
-            index.h("div", { key: '307b54a0fb0c71af5cf91a7ba80c8c3b3c7201b0', class: `pds-switch__message`, id: form.messageId(this.componentId, 'helper') }, this.helperMessage), this.errorMessage &&
-            index.h("div", { key: '5fa0429017fa7083db7baa5c4d8bea11c9c92a1d', class: `pds-switch__message pds-switch__message--error`, id: form.messageId(this.componentId, 'error'), "aria-live": "assertive" }, index.h("pds-icon", { key: '3dcc1270248d7efeaccc8a9d5bccf2888b10ccae', icon: index$1.danger, size: "small" }), this.errorMessage)));
+        return (index.h(index.Host, { key: 'c4d1c78da3de4034094ff3bc1167437e33ebd9fd', class: this.switchClassNames(), "aria-disabled": this.disabled ? 'true' : null }, index.h("input", { key: '709b51cfd719b5498395e0921536606124c84626', "aria-describedby": form.assignDescription(this.componentId, this.invalid, this.helperMessage), "aria-invalid": this.invalid ? "true" : undefined, checked: this.checked, class: "pds-switch__input", disabled: this.disabled, id: this.componentId, name: this.name ? this.name : this.componentId, onChange: this.onSwitchUpdate, required: this.required, type: "checkbox", value: this.value }), index.h(pdsLabel.PdsLabel, { key: 'cf834cf60234a6a041d0fe75632ee13220b25fd3', classNames: "pds-switch__label", htmlFor: this.componentId, text: this.label }), this.helperMessage &&
+            index.h("div", { key: '93424c713be90c58cbe0330859688f8fee15163c', class: `pds-switch__message`, id: form.messageId(this.componentId, 'helper') }, this.helperMessage), this.errorMessage &&
+            index.h("div", { key: 'a20a1c59aefe4e33fd6f595a80408626c8d2623e', class: `pds-switch__message pds-switch__message--error`, id: form.messageId(this.componentId, 'error'), "aria-live": "assertive" }, index.h("pds-icon", { key: 'c35d6daab76aeec7f64e72a38b1c8fe59ea5d897', icon: index$1.danger, size: "small" }), this.errorMessage)));
     }
     get el() { return index.getElement(this); }
 };
-PdsSwitch.style = PdsSwitchStyle0;
+PdsSwitch.style = PdsSwitchStyle0 + PdsSwitchStyle1;
 
 exports.pds_switch = PdsSwitch;
 

package/dist/cjs/pds-switch.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"pds-switch.entry.cjs.js","mappings":";;;;;;;;;AAAA,MAAM,YAAY,GAAG,mwHAAmwH,CAAC;AACzxH,wBAAe,YAAY;;MCSd,SAAS;;;;QA0DZ,mBAAc,GAAG,CAAC,CAAQ;YAChC,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;YAE1B,MAAM,KAAK,GAAG,CAAC,CAAC,MAA0B,CAAC;YAC3C,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC;YAC7B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,CAAe,CAAC,CAAC;SAC5C,CAAC;QAEM,qBAAgB,GAAG;YACzB,IAAI,aAAa,GAAG,YAAY,CAAC;YAEjC,IAAI,IAAI,CAAC,OAAO,KAAK,IAAI,EAAE;gBACzB,aAAa,IAAI,oBAAoB,CAAC;aACvC;YACD,IAAI,IAAI,CAAC,aAAa,KAAK,SAAS,EAAE;gBACpC,aAAa,IAAI,sBAAsB,CAAC;aACzC;YACD,OAAO,aAAa,CAAC;SACtB,CAAC;;uBAjEiC,KAAK;wBAKpB,KAAK;;;uBAeN,KAAK;;;wBAeJ,KAAK;;;IAgCzB,MAAM;QACJ,QACEA,QAACC,UAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE,mBAAiB,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,IAAI,IAChFD,wFACoBE,sBAAiB,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,kBACzE,IAAI,CAAC,OAAO,GAAG,MAAM,GAAG,SAAS,EAC/C,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAC,mBAAmB,EACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,EAAE,EAAE,IAAI,CAAC,WAAW,EACpB,IAAI,EAAE,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,WAAW,EAC9C,QAAQ,EAAE,IAAI,CAAC,cAAc,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAC,UAAU,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,GACjB,EACFF,QAACG,iBAAQ,qDAAC,UAAU,EAAC,mBAAmB,EAAC,OAAO,EAAE,IAAI,CAAC,WAAW,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,GAAI,EACvF,IAAI,CAAC,aAAa;YACjBH,kEACE,KAAK,EAAE,qBAAqB,EAC5B,EAAE,EAAEI,cAAS,CAAC,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,IAExC,IAAI,CAAC,aAAa,CACf,EAEP,IAAI,CAAC,YAAY;YAChBJ,kEACE,KAAK,EAAE,gDAAgD,EACvD,EAAE,EAAEI,cAAS,CAAC,IAAI,CAAC,WAAW,EAAE,OAAO,CAAC,eAC9B,WAAW,IAErBJ,uEAAU,IAAI,EAAEK,cAAM,EAAE,IAAI,EAAC,OAAO,GAAG,EACtC,IAAI,CAAC,YAAY,CACd,CAEH,EACP;KACH;;;;;;;","names":["h","Host","assignDescription","PdsLabel","messageId","danger"],"sources":["src/components/pds-switch/pds-switch.scss?tag=pds-switch&encapsulation=shadow","src/components/pds-switch/pds-switch.tsx"],"sourcesContent":[":host {\n\n  --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n  --box-shadow-focus-error: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);\n\n  // Need discussions\n  --sizing-input-toggle-size: calc(var(--pine-dimension-250) - (var(--pine-dimension-025) * 2));\n  --pine-dimension-025: 2px;\n  --spacing-message-inline: calc(var(--pine-dimension-450) + var(--pine-dimension-150));\n  --number-transition-timing: 0.15s ease-out;\n\n  align-items: flex-start;\n  color: var(--pine-color-text);\n  display: inline-flex;\n  flex-flow: row wrap;\n  position: relative;\n}\n\n:host(.pds-switch--error) {\n  color: var(--pine-color-text-message-danger);\n\n  input,\n  input:checked,\n  input:hover:not(:disabled):not(:checked) {\n    background-color: var(--pine-color-danger);\n  }\n\n  input:focus-visible:not(:disabled):not(:checked) {\n    box-shadow: var(--box-shadow-focus-error);\n  }\n\n  label {\n    color: var(--color-text-error);\n  }\n}\n\n// switch container\ninput {\n  appearance: none;\n  background: var(--pine-color-neutral);\n  border: 0;\n  border-radius: var(--pine-dimension-sm);\n  cursor: pointer;\n  display: inline-block;\n  height: var(--pine-dimension-250);\n  margin: 0;\n  padding: 0;\n  position: relative;\n  transition: var(--number-transition-timing);\n  transition-property: background, border, color;\n  width: var(--pine-dimension-450);\n\n  // switch toggle\n  &::after {\n    background: var(--pine-color-secondary);\n    border-radius: var(--pine-border-radius-full);\n    box-shadow: var(--pine-box-shadow);\n    content: \"\";\n    display: block;\n    height: var(--sizing-input-toggle-size);\n    inset-block-start: 50%;\n    inset-inline-start: 50%;\n    position: absolute;\n    transform: translate3d(-100%, -50%, 0);\n    transition: transform var(--number-transition-timing);\n    width: var(--sizing-input-toggle-size);\n  }\n}\n\nlabel {\n  cursor: pointer;\n  display: inline-flex;\n  flex-grow: 1;\n  font-weight: var(--pine-font-weight-medium);\n  margin-inline-start: var(--pine-dimension-150);\n\n  .pds-switch--error & {\n    color: inherit;\n  }\n}\n\n// Help and error messages\n.pds-switch__message {\n  color: var(--pine-color-text-message);\n  flex: 1 0 100%;\n  font: var(--pine-typography-body-sm-medium);\n  margin-block-start: var(--pine-dimension-xs);\n\n  + .pds-switch__message {\n    margin-block-start: var(--pine-dimension-2xs);\n  }\n}\n\n.pds-switch__message--error {\n  align-items: center;\n  color: inherit;\n  display: flex;\n  gap: var(--pine-dimension-2xs);\n}\n\n// Disabled state\ninput:disabled {\n  background-color: var(--pine-color-neutral-disabled);\n  cursor: not-allowed;\n\n  ~ label {\n    color: var(--pine-color-text-disabled);\n    cursor: initial;\n  }\n\n  &:hover::after {\n    background-color: var(--pine-color-background-container-disabled);\n  }\n\n  .pds-switch__message {\n    color: initial;\n  }\n}\n\n// Hover state\ninput:hover:not(:disabled) {\n  background-color: var(--pine-color-neutral-hover);\n}\n\n // Focus state\ninput:focus-visible:not(:disabled) {\n  box-shadow: var(--box-shadow-focus);\n  outline: none;\n}\n\n// 'Checked' state\n// switch toggle\ninput:checked::after {\n  transform: translate3d(0, -50%, 0);\n}\n\n// switch container\ninput:checked:not(:disabled) {\n  background-color: currentColor;\n  color: var(--pine-color-accent);\n\n  &:hover {\n    border-color: currentColor;\n    color: var(--pine-color-accent-hover);\n  }\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { PdsLabel } from '../_internal/pds-label/pds-label';\nimport { danger } from '@pine-ds/icons/icons';\n\n@Component({\n  tag: 'pds-switch',\n  styleUrls: ['pds-switch.scss'],\n  shadow: true,\n})\nexport class PdsSwitch {\n  @Element() el: HTMLPdsSwitchElement;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.\n   */\n  @Prop() componentId!: string;\n\n  /**\n   * Determines the input 'checked' state.\n   */\n  @Prop({ mutable: true }) checked = false;\n\n  /**\n   * Determines the input 'disabled' state, preventing user interaction.\n   */\n  @Prop() disabled? = false;\n\n  /**\n   * Displays message text describing an invalid state.\n   */\n  @Prop() errorMessage?: string;\n\n  /**\n   * Displays help text for additional description of an input.\n   */\n  @Prop() helperMessage: string;\n\n  /**\n   * Determines the input 'invalid' state, signifying an error is present.\n   */\n  @Prop() invalid? = false;\n\n  /**\n   * Displays text to describe the input.\n   */\n  @Prop() label!: string;\n\n  /**\n   * Identifies form data and unifies a group of radio inputs for toggling a single property/value.\n   */\n  @Prop() name: string;\n\n  /**\n   * Determines the 'required' state of the input.\n   */\n  @Prop() required? = false;\n\n  /**\n   * Provides input with a string submitted in form data.\n   */\n  @Prop() value: string;\n\n  /**\n   * Emits an event on input change.\n   */\n  @Event() pdsSwitchChange: EventEmitter<InputEvent>;\n\n  private onSwitchUpdate = (e: Event) => {\n    if (this.disabled) return;\n\n    const input = e.target as HTMLInputElement;\n    this.checked = input.checked;\n    this.pdsSwitchChange.emit(e as InputEvent);\n  };\n\n  private switchClassNames = () => {\n    let switchClasses = `pds-switch`;\n\n    if (this.invalid === true) {\n      switchClasses += \" pds-switch--error\";\n    }\n    if (this.helperMessage !== undefined) {\n      switchClasses += \" pds-switch--message\";\n    }\n    return switchClasses;\n  };\n\n  render() {\n    return (\n      <Host class={this.switchClassNames()} aria-disabled={this.disabled ? 'true' : null}>\n        <input\n          aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n          aria-invalid={this.invalid ? \"true\" : undefined}\n          checked={this.checked}\n          class=\"pds-switch__input\"\n          disabled={this.disabled}\n          id={this.componentId}\n          name={this.name ? this.name : this.componentId}\n          onChange={this.onSwitchUpdate}\n          required={this.required}\n          type=\"checkbox\"\n          value={this.value}\n        />\n        <PdsLabel classNames=\"pds-switch__label\" htmlFor={this.componentId} text={this.label} />\n        {this.helperMessage &&\n          <div\n            class={`pds-switch__message`}\n            id={messageId(this.componentId, 'helper')}\n          >\n            {this.helperMessage}\n          </div>\n        }\n        {this.errorMessage &&\n          <div\n            class={`pds-switch__message pds-switch__message--error`}\n            id={messageId(this.componentId, 'error')}\n            aria-live=\"assertive\"\n          >\n            <pds-icon icon={danger} size=\"small\" />\n            {this.errorMessage}\n          </div>\n        }\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"pds-switch.entry.cjs.js","mappings":";;;;;;;;;AAAA,MAAM,QAAQ,GAAG,oTAAoT,CAAC;AACtU,wBAAe,QAAQ;;ACDvB,MAAM,YAAY,GAAG,+wHAA+wH,CAAC;AACryH,wBAAe,YAAY;;MCSd,SAAS;;;;QA0DZ,mBAAc,GAAG,CAAC,CAAQ;YAChC,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;YAE1B,MAAM,KAAK,GAAG,CAAC,CAAC,MAA0B,CAAC;YAC3C,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC;YAC7B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,CAAe,CAAC,CAAC;SAC5C,CAAC;QAEM,qBAAgB,GAAG;YACzB,IAAI,aAAa,GAAG,YAAY,CAAC;YAEjC,IAAI,IAAI,CAAC,OAAO,KAAK,IAAI,EAAE;gBACzB,aAAa,IAAI,oBAAoB,CAAC;aACvC;YACD,IAAI,IAAI,CAAC,aAAa,KAAK,SAAS,EAAE;gBACpC,aAAa,IAAI,sBAAsB,CAAC;aACzC;YACD,OAAO,aAAa,CAAC;SACtB,CAAC;;uBAjEiC,KAAK;wBAKpB,KAAK;;;uBAeN,KAAK;;;wBAeJ,KAAK;;;IAgCzB,MAAM;QACJ,QACEA,QAACC,UAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE,mBAAiB,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,IAAI,IAChFD,wFACoBE,sBAAiB,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,kBACzE,IAAI,CAAC,OAAO,GAAG,MAAM,GAAG,SAAS,EAC/C,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAC,mBAAmB,EACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,EAAE,EAAE,IAAI,CAAC,WAAW,EACpB,IAAI,EAAE,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,WAAW,EAC9C,QAAQ,EAAE,IAAI,CAAC,cAAc,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAC,UAAU,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,GACjB,EACFF,QAACG,iBAAQ,qDAAC,UAAU,EAAC,mBAAmB,EAAC,OAAO,EAAE,IAAI,CAAC,WAAW,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,GAAI,EACvF,IAAI,CAAC,aAAa;YACjBH,kEACE,KAAK,EAAE,qBAAqB,EAC5B,EAAE,EAAEI,cAAS,CAAC,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,IAExC,IAAI,CAAC,aAAa,CACf,EAEP,IAAI,CAAC,YAAY;YAChBJ,kEACE,KAAK,EAAE,gDAAgD,EACvD,EAAE,EAAEI,cAAS,CAAC,IAAI,CAAC,WAAW,EAAE,OAAO,CAAC,eAC9B,WAAW,IAErBJ,uEAAU,IAAI,EAAEK,cAAM,EAAE,IAAI,EAAC,OAAO,GAAG,EACtC,IAAI,CAAC,YAAY,CACd,CAEH,EACP;KACH;;;;;;;","names":["h","Host","assignDescription","PdsLabel","messageId","danger"],"sources":["src/global/styles/utils/label.scss?tag=pds-switch&encapsulation=shadow","src/components/pds-switch/pds-switch.scss?tag=pds-switch&encapsulation=shadow","src/components/pds-switch/pds-switch.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\n  --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n  --box-shadow-focus-error: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);\n\n  // Need discussions\n  --sizing-input-toggle-size: calc(var(--pine-dimension-250) - (var(--pine-dimension-025) * 2));\n  --pine-dimension-025: 2px;\n  --spacing-message-inline: calc(var(--pine-dimension-450) + var(--pine-dimension-150));\n  --number-transition-timing: 0.15s ease-out;\n\n  align-items: flex-start;\n  color: var(--pine-color-text);\n  display: inline-flex;\n  flex-flow: row wrap;\n  position: relative;\n}\n\n:host(.pds-switch--error) {\n  color: var(--pine-color-text-message-danger);\n\n  input,\n  input:checked,\n  input:hover:not(:disabled):not(:checked) {\n    background-color: var(--pine-color-danger);\n  }\n\n  input:focus-visible:not(:disabled):not(:checked) {\n    box-shadow: var(--box-shadow-focus-error);\n  }\n\n  label {\n    color: var(--color-text-error);\n  }\n}\n\n// switch container\ninput {\n  appearance: none;\n  background: var(--pine-color-neutral);\n  border: 0;\n  border-radius: var(--pine-dimension-sm);\n  cursor: pointer;\n  display: inline-block;\n  height: var(--pine-dimension-250);\n  margin: 0;\n  padding: 0;\n  position: relative;\n  transition: var(--number-transition-timing);\n  transition-property: background, border, color;\n  width: var(--pine-dimension-450);\n\n  // switch toggle\n  &::after {\n    background: var(--pine-color-secondary);\n    border-radius: var(--pine-border-radius-full);\n    box-shadow: var(--pine-box-shadow);\n    content: \"\";\n    display: block;\n    height: var(--sizing-input-toggle-size);\n    inset-block-start: 50%;\n    inset-inline-start: 50%;\n    position: absolute;\n    transform: translate3d(-100%, -50%, 0);\n    transition: transform var(--number-transition-timing);\n    width: var(--sizing-input-toggle-size);\n  }\n}\n\nlabel {\n  cursor: pointer;\n  display: inline-flex;\n  flex-grow: 1;\n  margin-inline-start: var(--pine-dimension-150);\n\n  .pds-switch--error & {\n    color: inherit;\n  }\n}\n\n// Help and error messages\n.pds-switch__message {\n  color: var(--pine-color-text-message);\n  flex: 1 0 100%;\n  font: var(--pine-typography-body-sm-medium);\n  margin-block-start: var(--pine-dimension-xs);\n  margin-inline-start: var(--pine-dimension-2xl);\n\n  + .pds-switch__message {\n    margin-block-start: var(--pine-dimension-2xs);\n  }\n}\n\n.pds-switch__message--error {\n  align-items: center;\n  color: inherit;\n  display: flex;\n  gap: var(--pine-dimension-2xs);\n}\n\n// Disabled state\ninput:disabled {\n  background-color: var(--pine-color-neutral-disabled);\n  cursor: not-allowed;\n\n  ~ label {\n    cursor: initial;\n  }\n\n  &:hover::after {\n    background-color: var(--pine-color-background-container-disabled);\n  }\n\n  .pds-switch__message {\n    color: initial;\n  }\n}\n\n// Hover state\ninput:hover:not(:disabled) {\n  background-color: var(--pine-color-neutral-hover);\n}\n\n // Focus state\ninput:focus-visible:not(:disabled) {\n  box-shadow: var(--box-shadow-focus);\n  outline: none;\n}\n\n// 'Checked' state\n// switch toggle\ninput:checked::after {\n  transform: translate3d(0, -50%, 0);\n}\n\n// switch container\ninput:checked:not(:disabled) {\n  background-color: currentColor;\n  color: var(--pine-color-accent);\n\n  &:hover {\n    border-color: currentColor;\n    color: var(--pine-color-accent-hover);\n  }\n}\n","import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { PdsLabel } from '../_internal/pds-label/pds-label';\nimport { danger } from '@pine-ds/icons/icons';\n\n@Component({\n  tag: 'pds-switch',\n  styleUrls: ['../../global/styles/utils/label.scss', 'pds-switch.scss'],\n  shadow: true,\n})\nexport class PdsSwitch {\n  @Element() el: HTMLPdsSwitchElement;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.\n   */\n  @Prop() componentId!: string;\n\n  /**\n   * Determines the input 'checked' state.\n   */\n  @Prop({ mutable: true }) checked = false;\n\n  /**\n   * Determines the input 'disabled' state, preventing user interaction.\n   */\n  @Prop() disabled? = false;\n\n  /**\n   * Displays message text describing an invalid state.\n   */\n  @Prop() errorMessage?: string;\n\n  /**\n   * Displays help text for additional description of an input.\n   */\n  @Prop() helperMessage: string;\n\n  /**\n   * Determines the input 'invalid' state, signifying an error is present.\n   */\n  @Prop() invalid? = false;\n\n  /**\n   * Displays text to describe the input.\n   */\n  @Prop() label!: string;\n\n  /**\n   * Identifies form data and unifies a group of radio inputs for toggling a single property/value.\n   */\n  @Prop() name: string;\n\n  /**\n   * Determines the 'required' state of the input.\n   */\n  @Prop() required? = false;\n\n  /**\n   * Provides input with a string submitted in form data.\n   */\n  @Prop() value: string;\n\n  /**\n   * Emits an event on input change.\n   */\n  @Event() pdsSwitchChange: EventEmitter<InputEvent>;\n\n  private onSwitchUpdate = (e: Event) => {\n    if (this.disabled) return;\n\n    const input = e.target as HTMLInputElement;\n    this.checked = input.checked;\n    this.pdsSwitchChange.emit(e as InputEvent);\n  };\n\n  private switchClassNames = () => {\n    let switchClasses = `pds-switch`;\n\n    if (this.invalid === true) {\n      switchClasses += \" pds-switch--error\";\n    }\n    if (this.helperMessage !== undefined) {\n      switchClasses += \" pds-switch--message\";\n    }\n    return switchClasses;\n  };\n\n  render() {\n    return (\n      <Host class={this.switchClassNames()} aria-disabled={this.disabled ? 'true' : null}>\n        <input\n          aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n          aria-invalid={this.invalid ? \"true\" : undefined}\n          checked={this.checked}\n          class=\"pds-switch__input\"\n          disabled={this.disabled}\n          id={this.componentId}\n          name={this.name ? this.name : this.componentId}\n          onChange={this.onSwitchUpdate}\n          required={this.required}\n          type=\"checkbox\"\n          value={this.value}\n        />\n        <PdsLabel classNames=\"pds-switch__label\" htmlFor={this.componentId} text={this.label} />\n        {this.helperMessage &&\n          <div\n            class={`pds-switch__message`}\n            id={messageId(this.componentId, 'helper')}\n          >\n            {this.helperMessage}\n          </div>\n        }\n        {this.errorMessage &&\n          <div\n            class={`pds-switch__message pds-switch__message--error`}\n            id={messageId(this.componentId, 'error')}\n            aria-live=\"assertive\"\n          >\n            <pds-icon icon={danger} size=\"small\" />\n            {this.errorMessage}\n          </div>\n        }\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/pds-tab.cjs.entry.js

@@ -21,9 +21,9 @@ const PdsTab = class {
         this.pdsTabClick.emit([index, parentComponentId]);
     }
     render() {
-        const availabilityTabEdgeInlineStart = (index.h("span", { key: 'd98a922aaa1b9a6023830badc391c3d1d615ec6a', class: "pds-tab-edge", role: "presentation" }));
-        const availabilityTabEdgeInlineEnd = (index.h("span", { key: '390da28bb3fd9ab1fa2fddda45569e92d4547fa3', class: "pds-tab-edge pds-tab-edge--end", role: "presentation" }));
-        return (index.h(index.Host, { key: '5996673486d4bd95f98a691b155529a60655e92f', variant: this.variant, slot: "tabs", index: this.index }, index.h("button", { key: '6eded79f9d5aa9093080933aa9aaa2ad88440759', role: "tab", id: this.parentComponentId + "__" + this.name, "aria-controls": this.parentComponentId + "__" + this.name + "-panel", tabindex: this.selected ? "0" : "-1", "aria-selected": this.selected ? "true" : "false", class: this.selected ? "pds-tab is-active" : "pds-tab", onClick: this.onTabClick.bind(this, this.index, this.parentComponentId) }, this.variant === "availability" && availabilityTabEdgeInlineStart, this.variant === "availability" && availabilityTabEdgeInlineEnd, index.h("div", { key: '9f8927d976b6964c22414e9fbb8680b9132370fa', class: "pds-tab__content" }, index.h("slot", { key: '691c6cf5e42bc42c6492276fd5905733c424921c' })))));
+        const availabilityTabEdgeInlineStart = (index.h("span", { key: '86bc0085668c8abc70d43b3d51ecb0328c74a250', class: "pds-tab-edge", role: "presentation" }));
+        const availabilityTabEdgeInlineEnd = (index.h("span", { key: '1156c49c0448e6ea11bfe7b292d96c3a396c59e4', class: "pds-tab-edge pds-tab-edge--end", role: "presentation" }));
+        return (index.h(index.Host, { key: 'fc6a96add1a97e05ad8d85856ce44a3bc99c7581', variant: this.variant, slot: "tabs", index: this.index }, index.h("button", { key: '41b1b8bf4e74974aa1e375a87d69c149a1fb04e6', role: "tab", id: this.parentComponentId + "__" + this.name, "aria-controls": this.parentComponentId + "__" + this.name + "-panel", tabindex: this.selected ? "0" : "-1", "aria-selected": this.selected ? "true" : "false", class: this.selected ? "pds-tab is-active" : "pds-tab", onClick: this.onTabClick.bind(this, this.index, this.parentComponentId) }, this.variant === "availability" && availabilityTabEdgeInlineStart, this.variant === "availability" && availabilityTabEdgeInlineEnd, index.h("div", { key: '81d264e8ac4e9d94e59ea8c377ac7225f48353db', class: "pds-tab__content" }, index.h("slot", { key: '9549347c6fc773e9f9b234e72f39fa265e77aac2' })))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/pds-table-body.cjs.entry.js

@@ -12,7 +12,7 @@ const PdsTableBody = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '60a95951b44201ddb343ad09de86e456e0699660', role: "rowgroup" }, index.h("slot", { key: '76859c304c640fb6aa2ea1239e500fe94da7402f' })));
+        return (index.h(index.Host, { key: '41157c331cf95bb8044016a19244b4773c0a719a', role: "rowgroup" }, index.h("slot", { key: '366c8c12343cb47ca01c84e20bba94a191b1d3b4' })));
     }
 };
 PdsTableBody.style = PdsTableBodyStyle0;

package/dist/cjs/pds-table-cell.cjs.entry.js

@@ -43,11 +43,11 @@ const PdsTableCell = class {
         return classNames.join(' ');
     }
     render() {
-        return (index.h(index.Host, { key: 'f2a3b657bff0ad827eb7de95d858d9e8cc34ab79', class: this.classNames(), role: "gridcell", style: this.tableRef &&
+        return (index.h(index.Host, { key: '1c66a12a003b939e523af9885dd4812bb6d0381e', class: this.classNames(), role: "gridcell", style: this.tableRef &&
                 this.tableRef.fixedColumn &&
                 this.tableRef.selectable
                 ? { '--fixed-cell-position': '40px' }
-                : {} }, index.h("slot", { key: '39d0cbe1dbf20b1786be18ba60acd0dd2256da5b' })));
+                : {} }, index.h("slot", { key: 'e0741820507ca0ac27ef693a0f4e553c1d90ba1e' })));
     }
     get hostElement() { return index.getElement(this); }
 };

package/dist/cjs/pds-table-head-cell.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b7d9268e.js');
-const index$1 = require('./index-034a8bb0.js');
+const index$1 = require('./index-59b0d7e2.js');
 
 const pdsTableHeadCellCss = ":host{--border-head-cell-default:var(--pine-border-width-thin) solid var(--pine-color-grey-100);--box-shadow-default:3px 3px 6px -2px rgba(0, 0, 0, 0.1);-webkit-border-after:var(--border-head-cell-default);border-block-end:var(--border-head-cell-default);color:var(--pine-color-text);display:table-cell;font-family:var(--pine-font-family-body);font-size:var(--pine-font-size);font-weight:var(--pine-font-weight-regular);line-height:var(--pine-line-height-body);padding:12px;text-align:start;vertical-align:inherit}:host(.is-compact){padding-block:var(--pine-dimension-2xs)}:host(.is-fixed){background:var(--pine-color-background-container);left:var(--pine-dimension-none);position:-webkit-sticky;position:sticky;z-index:1}:host(.has-scrolled.is-fixed){-webkit-box-shadow:var(--box-shadow-default);box-shadow:var(--box-shadow-default)}:host(.is-sortable){cursor:pointer}:host(.is-sortable) pds-icon{-webkit-margin-start:var(--pine-dimension-2xs);margin-inline-start:var(--pine-dimension-2xs);-webkit-padding-before:2px;padding-block-start:2px;position:absolute}:host(.is-sortable:hover),:host(.is-active){color:var(--pine-color-text-active)}";
 const PdsTableHeadCellStyle0 = pdsTableHeadCellCss;
@@ -61,11 +61,11 @@ const PdsTableHeadCell = class {
         return classNames.join('  ');
     }
     render() {
-        return (index.h(index.Host, { key: '0eae693d1a14a1c7a21a9841a9bb6fbce9c3fe39', class: this.classNames(), role: "columnheader", onClick: this.toggleSort, style: this.tableRef &&
+        return (index.h(index.Host, { key: 'cc69c3960907c848101775317b0ff4e700e055e8', class: this.classNames(), role: "columnheader", onClick: this.toggleSort, style: this.tableRef &&
                 this.tableRef.fixedColumn &&
                 this.tableRef.selectable
                 ? { '--fixed-cell-position': '40px' }
-                : {} }, index.h("slot", { key: 'ce895362068b7912c3bb2ef46de0c2194417ebb4' }), this.sortable && (index.h("pds-icon", { key: '1fb79e6e54adecef28106f6b28537c6a48cd7182', icon: this.sortingDirection === 'asc' ? index$1.upSmall : index$1.downSmall }))));
+                : {} }, index.h("slot", { key: '02d63e30c6e05104b14fba26cf9f95709feb9d6c' }), this.sortable && (index.h("pds-icon", { key: 'e19c0af58d1ab0a909c72f6ddac89eacb6013a20', icon: this.sortingDirection === 'asc' ? index$1.upSmall : index$1.downSmall }))));
     }
     get hostElement() { return index.getElement(this); }
 };

package/dist/cjs/pds-table-head.cjs.entry.js

@@ -44,7 +44,7 @@ const PdsTableHead = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'ceec2beb6cbf4db01d34616d6b34b52fa035cfeb', role: "row" }, this.tableRef && this.tableRef.selectable && (index.h("pds-table-head-cell", { key: '7488151c5cffe43f7f16baf52869dbd0646bb8a5', part: this.tableRef.selectable ? 'checkbox-cell' : '' }, index.h("pds-checkbox", { key: '1d33580a684a0119d5fad179145e56c36533dbfd', componentId: this.generateUniqueId(), indeterminate: this.indeterminate, onInput: this.handleInput, label: "Select All Rows", labelHidden: true, checked: this.isSelected }))), index.h("slot", { key: '71200e7941259e2ea59d2b86370bb3a0dfac727f' })));
+        return (index.h(index.Host, { key: '400ce9df17b3e7237b06c53e511c06f96e794cc3', role: "row" }, this.tableRef && this.tableRef.selectable && (index.h("pds-table-head-cell", { key: '177e4324e68c94a3bf4ccf6211a68ea9a16dcd21', part: this.tableRef.selectable ? 'checkbox-cell' : '' }, index.h("pds-checkbox", { key: '3de990702506daebe0920bc0b41b05a66598e33c', componentId: this.generateUniqueId(), indeterminate: this.indeterminate, onInput: this.handleInput, label: "Select All Rows", labelHidden: true, checked: this.isSelected }))), index.h("slot", { key: '3f7c275d9ba797413c7c00f10598165b140f9370' })));
     }
     get hostElement() { return index.getElement(this); }
 };

package/dist/cjs/pds-table-row.cjs.entry.js

@@ -55,7 +55,7 @@ const PdsTableRow = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '34730cfe4b6a914918ec68ed8d0276b7f53d889f', class: this.classNames(), role: "row" }, this.tableRef && this.tableRef.selectable && (index.h("pds-table-cell", { key: '800c34b7d9b6502ba0c5d261d2e5d569f98fbedf', part: this.tableRef.fixedColumn ? 'checkbox-cell' : '', class: this.tableRef.selectable ? 'has-checkbox' : '' }, index.h("pds-checkbox", { key: 'e7128f1d9880b1ab4f5ac477b079056def352372', componentId: this.generateUniqueId(), onClick: this.handleClick, indeterminate: this.indeterminate, label: "Select Row", labelHidden: true, checked: this.isSelected }))), index.h("slot", { key: 'd8b499c2c4217ec614bbab351aa1b8e6ef04f786' })));
+        return (index.h(index.Host, { key: '6d45bf5daa277f7be53ddeb0160d6385cf7deaf8', class: this.classNames(), role: "row" }, this.tableRef && this.tableRef.selectable && (index.h("pds-table-cell", { key: '41ede9f594d32ddc8c579fd76ab5c1f96ec36f15', part: this.tableRef.fixedColumn ? 'checkbox-cell' : '', class: this.tableRef.selectable ? 'has-checkbox' : '' }, index.h("pds-checkbox", { key: '112919d44ed2ebf59bc656a08b02c48b703c0487', componentId: this.generateUniqueId(), onClick: this.handleClick, indeterminate: this.indeterminate, label: "Select Row", labelHidden: true, checked: this.isSelected }))), index.h("slot", { key: 'cc280937ec2e77773ac10720e4e9bca9a4610501' })));
     }
     get hostElement() { return index.getElement(this); }
 };

package/dist/cjs/pds-table.cjs.entry.js

@@ -91,7 +91,7 @@ const PdsTable = class {
         headerCheckbox.indeterminate = !allSelectedRows && !noneSelectedRows;
     }
     render() {
-        return (index.h(index.Host, { key: '50503c576bf533366ef44f3571d389d1eed7297e', class: this.classNames(), id: this.componentId, role: "grid", selectable: this.selectable, tabindex: "0" }, index.h("slot", { key: '8348c103d0627440f6ce9b7640a64ce1180cfb39' })));
+        return (index.h(index.Host, { key: '7540429df3f462d59b731a08ff610c9d4c2a4d10', class: this.classNames(), id: this.componentId, role: "grid", selectable: this.selectable, tabindex: "0" }, index.h("slot", { key: '33a267a84e96e7aea042335672dab2a45d46ad15' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/pds-tabpanel.cjs.entry.js

@@ -16,7 +16,7 @@ const PdsTabpanel = class {
         this.selected = false;
     }
     render() {
-        return (index.h(index.Host, { key: 'e373f0105e391bcb04888b060f41d96cf374ee2d', slot: "tabpanels" }, index.h("div", { key: '699b02073f6fa1caafc5920b82f776c86c553599', role: "tabpanel", id: this.parentComponentId + "__" + this.name + '-panel', tabindex: "0", "aria-labelledby": this.parentComponentId + "__" + this.name, class: this.selected ? "pds-tabpanel is-active" : "pds-tabpanel" }, index.h("slot", { key: 'df59ed91bf0ca60ccbde92b2f84c7c17659bfdbd' }))));
+        return (index.h(index.Host, { key: '63913321e3c0005e6a0e924a4de620ab2e46157a', slot: "tabpanels" }, index.h("div", { key: '6a7a0af19b0b506c927001484a935220e6b8e966', role: "tabpanel", id: this.parentComponentId + "__" + this.name + '-panel', tabindex: "0", "aria-labelledby": this.parentComponentId + "__" + this.name, class: this.selected ? "pds-tabpanel is-active" : "pds-tabpanel" }, index.h("slot", { key: '57dd1e7e66bb23562b527f9218fa350ed3f3c1a7' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/pds-tabs.cjs.entry.js

@@ -88,7 +88,7 @@ const PdsTabs = class {
         this.passPropsToChildren();
     }
     render() {
-        return (index.h(index.Host, { key: '48a7f7d7124c700612089ba096e932f0e376b418', "active-tab-name": this.activeTabName, class: this.classNames(), id: this.componentId }, index.h("div", { key: '285092baa2367bd90736a6b893745874b2e96cc4', class: "pds-tabs__tablist", role: "tablist", "aria-label": this.tablistLabel }, index.h("slot", { key: '451b42c90fcd53ce0d51f550b402533a2fcd24df', name: "tabs" })), index.h("slot", { key: '945fe293061a5fff2e3777e3d454d10f3bc59125', name: "tabpanels" })));
+        return (index.h(index.Host, { key: '93431c0270fb4f658262c43ab65fc144c527d7bf', "active-tab-name": this.activeTabName, class: this.classNames(), id: this.componentId }, index.h("div", { key: 'a9b216ad2a3612b4bc5219b370efa90b9ef89e1c', class: "pds-tabs__tablist", role: "tablist", "aria-label": this.tablistLabel }, index.h("slot", { key: 'a4a9a6cf3a3d43ad6b390a041cc1ef18472325f0', name: "tabs" })), index.h("slot", { key: '729ae2b2a129760d0d347acaee0118ba667b5292', name: "tabpanels" })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/pds-text.cjs.entry.js

@@ -29,7 +29,7 @@ const PdsText = class {
       ${this.weight !== undefined && this.weight.trim() !== '' ? `pds-text--weight-${this.weight}` : ''}
       ${this.decoration !== undefined && this.decoration.trim() !== '' ? `pds-text--decoration-${this.decoration}` : ''}
     `;
-        return (index.h(Tag, { key: '1f4e66d525057dea787cafa3e553572333dc1f1d', class: typeClasses }, index.h("slot", { key: '035a577c6c1b67b200362c0bf6431714ac8c52ba' })));
+        return (index.h(Tag, { key: '2484af922fff3a9b3eb4064e1d5bc9d760bba47f', class: typeClasses }, index.h("slot", { key: '1f7dd37b81a6b0c2c2a7ca55f7616f12f22a67b1' })));
     }
 };
 PdsText.style = PdsTextStyle0;

package/dist/cjs/pds-textarea.cjs.entry.js

@@ -6,15 +6,15 @@ const index = require('./index-b7d9268e.js');
 const form = require('./form-4f00637c.js');
 const utils = require('./utils-39c972f8.js');
 const attributes = require('./attributes-73ee8de7.js');
-const index$1 = require('./index-034a8bb0.js');
+const index$1 = require('./index-59b0d7e2.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-weight:var(--pine-font-weight-medium)}";
+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 PdsTextareaStyle0 = labelCss;
 
 const pdsInputTokensCss = ":host{--pine-input-color-background-danger:var(--pine-color-red-050)}";
 const PdsTextareaStyle1 = pdsInputTokensCss;
 
-const pdsTextareaCss = ":host{--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);display:inline}:host([aria-readonly=true]) textarea{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}.pds-textarea{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}label{display:block;font-weight:var(--pine-font-weight-medium);-webkit-margin-after:var(--pine-dimension-xs);margin-block-end:var(--pine-dimension-xs)}.pds-textarea__field{background-color:var(--pine-color-background-container);border:var(--pine-border);border-radius:calc(var(--pine-dimension-xs) * 1.25);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-textarea__field:hover:not(:disabled,.is-invalid){border:var(--pine-border-hover)}.pds-textarea__field:disabled{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}.pds-textarea__field:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-textarea__field::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field.is-invalid{background-color:var(--pine-input-color-background-danger);border-color:var(--pine-color-border-danger)}.pds-textarea__field.is-invalid:focus-visible{-webkit-box-shadow:var(--box-shadow-focus-error);box-shadow:var(--box-shadow-focus-error)}.pds-textarea__error-message,.pds-textarea__helper-message{font:var(--pine-typography-body-sm-medium);-webkit-margin-before:var(--pine-dimension-xs);margin-block-start:var(--pine-dimension-xs)}.pds-textarea__error-message{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}";
+const pdsTextareaCss = ":host{--box-shadow-focus:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);--box-shadow-focus-error:0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);display:inline}:host([aria-readonly=true]) textarea{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-readonly)}.pds-textarea{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}label{display:block;-webkit-margin-after:var(--pine-dimension-xs);margin-block-end:var(--pine-dimension-xs)}.pds-textarea__field{background-color:var(--pine-color-background-container);border:var(--pine-border);border-radius:calc(var(--pine-dimension-xs) * 1.25);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-textarea__field:hover:not(:disabled,.is-invalid){border:var(--pine-border-hover)}.pds-textarea__field:disabled{background-color:var(--pine-color-background-container-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}.pds-textarea__field:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-textarea__field::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field::placeholder{color:var(--pine-color-text-placeholder)}.pds-textarea__field.is-invalid{background-color:var(--pine-input-color-background-danger);border-color:var(--pine-color-border-danger)}.pds-textarea__field.is-invalid:focus-visible{-webkit-box-shadow:var(--box-shadow-focus-error);box-shadow:var(--box-shadow-focus-error)}.pds-textarea__error-message,.pds-textarea__helper-message{font:var(--pine-typography-body-sm-medium);-webkit-margin-before:var(--pine-dimension-xs);margin-block-start:var(--pine-dimension-xs)}.pds-textarea__error-message{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}";
 const PdsTextareaStyle2 = pdsTextareaCss;
 
 const PdsTextarea = class {
@@ -126,10 +126,10 @@ const PdsTextarea = class {
     }
     render() {
         const value = this.getValue();
-        return (index.h(index.Host, { key: 'aa960b2a67c927c296040e835fadcd8f8bcbbc18', "aria-disabled": this.disabled ? 'true' : null, "aria-readonly": this.readonly ? 'true' : null }, index.h("div", { key: 'b95804e8ddbd92f4d7177c90d342d0ff2022ad44', class: "pds-textarea" }, this.label &&
-            index.h("label", { key: 'ef508b6af03cf871b419b2dd4d79ded182b59da5', htmlFor: this.componentId }, this.label), index.h("textarea", Object.assign({ key: '2d2f195e8a715332eab0bba4f869db67b0f249c9', ref: (el) => this.nativeTextarea = el, "aria-describedby": form.assignDescription(this.componentId, this.invalid, this.helperMessage), "aria-invalid": this.invalid ? "true" : undefined, autocomplete: this.autocomplete, class: this.textareaClassNames(), disabled: this.disabled, id: this.componentId, name: this.name, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, rows: this.rows, onBlur: this.onBlur, onChange: this.onTextareaChange, onFocus: this.onFocus, onInput: this.onInput }, this.inheritedAttributes), value), this.helperMessage &&
-            index.h("p", { key: '84ad453017c378553eeda5198267564661b9bc8f', class: "pds-textarea__helper-message", id: form.messageId(this.componentId, 'helper') }, this.helperMessage), this.invalid &&
-            index.h("p", { key: 'd1fbcbe5af314a25bdec647d560f9e964a9c8b90', "aria-live": "assertive", class: "pds-textarea__error-message", id: form.messageId(this.componentId, 'error') }, index.h("pds-icon", { key: '525edfdafeabd31a41e62c0c0e454752123c7c8a', icon: index$1.danger, size: "small" }), this.errorMessage))));
+        return (index.h(index.Host, { key: 'ff1ea6dcc0543b1c706f922a8563fa63b4721343', "aria-disabled": this.disabled ? 'true' : null, "aria-readonly": this.readonly ? 'true' : null }, index.h("div", { key: '25d4efe232c9d90967a17920fb82f17d075189ae', class: "pds-textarea" }, this.label &&
+            index.h("label", { key: '764e320927d0eac61ad9c08b00f805b9bae4d525', htmlFor: this.componentId }, this.label), index.h("textarea", Object.assign({ key: '04f18ad66ebf94e7e52fab68e8e8d997e5d57270', ref: (el) => this.nativeTextarea = el, "aria-describedby": form.assignDescription(this.componentId, this.invalid, this.helperMessage), "aria-invalid": this.invalid ? "true" : undefined, autocomplete: this.autocomplete, class: this.textareaClassNames(), disabled: this.disabled, id: this.componentId, name: this.name, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, rows: this.rows, onBlur: this.onBlur, onChange: this.onTextareaChange, onFocus: this.onFocus, onInput: this.onInput }, this.inheritedAttributes), value), this.helperMessage &&
+            index.h("p", { key: '5c4d5afb3239208a18c47755412ab2a80ed599f8', class: "pds-textarea__helper-message", id: form.messageId(this.componentId, 'helper') }, this.helperMessage), this.invalid &&
+            index.h("p", { key: '906bc964bd9ff7bc5399dd693535ceeb80e9fcc6', "aria-live": "assertive", class: "pds-textarea__error-message", id: form.messageId(this.componentId, 'error') }, index.h("pds-icon", { key: '19e00869fca337c8b4473852c8e4c2f57c605a64', icon: index$1.danger, size: "small" }), this.errorMessage))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/pds-textarea.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"pds-textarea.entry.cjs.js","mappings":"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","names":["debounceEvent","isRequired","inheritAriaAttributes","inheritAttributes","h","Host","assignDescription","messageId","danger"],"sources":["src/global/styles/utils/label.scss?tag=pds-textarea&encapsulation=shadow","src/components/pds-input/pds-input.tokens.scss?tag=pds-textarea&encapsulation=shadow","src/components/pds-textarea/pds-textarea.scss?tag=pds-textarea&encapsulation=shadow","src/components/pds-textarea/pds-textarea.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-weight: var(--pine-font-weight-medium);\n\n}\n","/**\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\n  --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n  --box-shadow-focus-error: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);\n\n  display: inline;\n}\n\n:host([aria-readonly=\"true\"]) {\n  textarea {\n    background-color: var(--pine-color-background-container-disabled);\n    color: var(--pine-color-text-readonly);\n  }\n}\n\n.pds-textarea {\n  display: flex;\n  flex-direction: column;\n}\n\nlabel {\n  display: block;\n  font-weight: var(--pine-font-weight-medium);\n  margin-block-end: var(--pine-dimension-xs);\n}\n\n.pds-textarea__field {\n  background-color: var(--pine-color-background-container);\n  border: var(--pine-border);\n  border-radius: calc(var(--pine-dimension-xs) * 1.25);\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    color: var(--pine-color-text-disabled);\n    cursor: not-allowed;\n  }\n\n  &:focus-visible {\n    // outline: var(--pine-border-focus); Border radius for outline does not work in Safari\n    box-shadow: var(--box-shadow-focus); // Remove when outline radius is supported in Safari\n    outline: none;\n  }\n\n  &::placeholder {\n    color: var(--pine-color-text-placeholder);\n  }\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      box-shadow: var(--box-shadow-focus-error);\n    }\n  }\n}\n\n.pds-textarea__error-message,\n.pds-textarea__helper-message {\n  font: var(--pine-typography-body-sm-medium);\n  margin-block-start: var(--pine-dimension-xs);\n}\n\n.pds-textarea__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, Host, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, isRequired, messageId } from '../../utils/form';\nimport { TextareaChangeEventDetail, TextareaInputEventDetail } from './textarea-interface';\nimport { debounceEvent } from '@utils/utils';\nimport type { Attributes } from '@utils/attributes';\nimport { inheritAttributes, inheritAriaAttributes } from '@utils/attributes';\nimport { danger } from '@pine-ds/icons/icons';\n\n@Component({\n  tag: 'pds-textarea',\n  styleUrls: [\n    '../../global/styles/utils/label.scss',\n    '../pds-input/pds-input.tokens.scss',\n    'pds-textarea.scss'\n  ],\n  shadow: true,\n})\nexport class PdsTextarea {\n  private nativeTextarea?: HTMLTextAreaElement\n  private focusedValue?: string | null;\n  private inheritedAttributes: Attributes = {};\n  private originalPdsInput?: EventEmitter<TextareaInputEventDetail>;\n\n  @Element() el: HTMLPdsTextareaElement;\n\n  /**\n   * Emitted when the input loses focus.\n   */\n  @Event() pdsBlur!: EventEmitter<FocusEvent>;\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   * For elements that accept text input (`type=text`, `type=tel`, etc.), the interface\n   * is [`InputEvent`](https://developer.mozilla.org/en-US/docs/Web/API/InputEvent); for others,\n   * the interface is [`Event`](https://developer.mozilla.org/en-US/docs/Web/API/Event). If\n   * the input is cleared on edit, the type is `null`.\n   */\n  @Event() pdsInput: EventEmitter<TextareaInputEventDetail>;\n\n  /**\n   * Event emitted whenever the value of the textarea changes.\n   *\n   * This event will not emit when programmatically setting the `value` property.\n   */\n  @Event() pdsTextareaChange: EventEmitter<TextareaChangeEventDetail>;\n\n  /**\n   * Sets focus on the native `textarea` in the `pds-texarea`. Use this method instead of the global\n   * `textarea.focus()`.\n   */\n  @Method()\n  async setFocus() {\n    if (this.nativeTextarea) {\n      this.nativeTextarea.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   * Determines whether or not the textarea is disabled.\n   * @defaultValue false\n   */\n  @Prop() disabled = false;\n\n  /**\n   * The amount of time, in milliseconds, to wait to trigger the event after each keystroke.\n   */\n  @Prop() debounce?: number;\n\n  /**\n   * Displays an error message below the textarea field.\n   */\n  @Prop() errorMessage?: string;\n\n  /**\n   * Displays a message or hint below the textarea field.\n   */\n  @Prop() helperMessage?: string;\n\n  /**\n   * Determines whether or not the textarea is invalid or throws an error.\n   * @defaultValue false\n   */\n  @Prop({mutable: true}) invalid = false;       // eslint-disable-line @stencil-community/strict-mutable\n\n  /**\n   * Text to be displayed as the textarea label.\n   */\n  @Prop() label?: string;\n\n  /**\n   * Specifies the name. Submitted with the form name/value pair. This value will mirror the componentId.\n   */\n  @Prop() name: string = this.componentId;\n\n  /**\n   * Specifies a short hint that describes the expected value of the textarea.\n   */\n  @Prop() placeholder?: string;\n\n  /**\n   * Determines whether or not the textarea is readonly.\n   * @defaultValue false\n   */\n  @Prop() readonly = false;\n\n  /**\n   * Determines whether or not the textarea is required.\n   * @defaultValue false\n   */\n  @Prop() required = false;\n\n  /**\n   * Sets number of rows of text visible without needing to scroll in the textarea.\n   */\n  @Prop() rows?: number;\n\n  /**\n   * The value of the textarea.\n   */\n  @Prop({mutable: true}) value?: string | null = '';\n\n  @State() hasFocus = false;\n\n  @Watch('debounce')\n  protected debounceChanged() {\n    const { pdsInput, debounce, originalPdsInput } = this;\n\n    this.pdsInput = debounce === undefined ? originalPdsInput ?? pdsInput : debounceEvent(pdsInput, debounce);\n  }\n\n  /**\n   * Update the native input element when the value changes\n   */\n  @Watch('value')\n  protected valueChanged() {\n    const nativeTextarea = this.nativeTextarea;\n    const value = this.getValue();\n\n    if (nativeTextarea && nativeTextarea.value !== value) {\n      nativeTextarea.value = value;\n    }\n  }\n\n  /**\n   * Emits an `pdsInput` event.\n   */\n  private emitInputChange(event?: Event) {\n    const { value } = this;\n    this.pdsInput.emit({ value, event });\n  }\n\n  /**\n   * Emits an `pdsTextareaChange` event.\n   */\n  private emitValueChange(event?: Event) {\n    const textarea = event.target as HTMLTextAreaElement;\n    isRequired(textarea, this);\n\n    const { value } = textarea;\n\n    // Checks for both null and undefined values\n    const newValue = value == null ? value : value.toString();\n    this.focusedValue = newValue;\n    this.pdsTextareaChange.emit({ value: newValue, event });\n  }\n\n  private getValue(): string {\n    return this.value || '';\n  }\n\n  private onBlur = (ev: FocusEvent) => {\n    this.hasFocus = false;\n\n    if (this.focusedValue !== this.value) {\n      this.emitValueChange(ev);\n    }\n\n    this.pdsBlur.emit(ev);\n  };\n\n  private onFocus = (ev: FocusEvent) => {\n    this.hasFocus = true;\n    this.focusedValue = this.value;\n\n    this.pdsFocus.emit(ev);\n  };\n\n  private onInput = (ev: Event) => {\n    const input = ev.target as HTMLTextAreaElement | null;\n    if (input) {\n      this.value = input.value || '';\n    }\n    this.emitInputChange(ev);\n  };\n\n  private onTextareaChange = (ev: Event) => {\n    this.emitValueChange(ev);\n  };\n\n  private textareaClassNames() {\n    const classNames = ['pds-textarea__field'];\n\n    if (this.invalid && this.invalid === true) {\n      classNames.push('is-invalid');\n    }\n\n    return classNames.join('  ');\n  }\n\n  connectedCallback() {\n    this.debounceChanged();\n  }\n\n  componentWillLoad() {\n    this.inheritedAttributes = {\n      ...inheritAriaAttributes(this.el),\n      ...inheritAttributes(this.el),\n    };\n  }\n\n  componentDidLoad() {\n    this.originalPdsInput = this.pdsInput;\n  }\n\n  render() {\n    const value = this.getValue();\n\n    return (\n      <Host\n        aria-disabled={this.disabled ? 'true' : null}\n        aria-readonly={this.readonly ? 'true' : null}\n      >\n        <div class=\"pds-textarea\">\n          {this.label &&\n            <label htmlFor={this.componentId}>{this.label}</label>\n          }\n          <textarea\n            ref={(el) => this.nativeTextarea = el }\n            aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n            aria-invalid={this.invalid ? \"true\" : undefined}\n            autocomplete={this.autocomplete}\n            class={this.textareaClassNames()}\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            rows={this.rows}\n            onBlur={this.onBlur}\n            onChange={this.onTextareaChange}\n            onFocus={this.onFocus}\n            onInput={this.onInput}\n            {...this.inheritedAttributes}\n          >\n            {value}\n          </textarea>\n          {this.helperMessage &&\n            <p\n              class=\"pds-textarea__helper-message\"\n              id={messageId(this.componentId, 'helper')}\n            >\n              {this.helperMessage}\n            </p>\n          }\n          {this.invalid &&\n            <p\n              aria-live=\"assertive\"\n              class=\"pds-textarea__error-message\"\n              id={messageId(this.componentId, 'error')}\n            >\n              <pds-icon icon={danger} size=\"small\" />\n              {this.errorMessage}\n            </p>\n          }\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"pds-textarea.entry.cjs.js","mappings":"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","names":["debounceEvent","isRequired","inheritAriaAttributes","inheritAttributes","h","Host","assignDescription","messageId","danger"],"sources":["src/global/styles/utils/label.scss?tag=pds-textarea&encapsulation=shadow","src/components/pds-input/pds-input.tokens.scss?tag=pds-textarea&encapsulation=shadow","src/components/pds-textarea/pds-textarea.scss?tag=pds-textarea&encapsulation=shadow","src/components/pds-textarea/pds-textarea.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","/**\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\n  --box-shadow-focus: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring);\n  --box-shadow-focus-error: 0 0 0 1px #ffffff, 0 0 0 3px var(--pine-color-focus-ring-danger);\n\n  display: inline;\n}\n\n:host([aria-readonly=\"true\"]) {\n  textarea {\n    background-color: var(--pine-color-background-container-disabled);\n    color: var(--pine-color-text-readonly);\n  }\n}\n\n.pds-textarea {\n  display: flex;\n  flex-direction: column;\n}\n\nlabel {\n  display: block;\n  margin-block-end: var(--pine-dimension-xs);\n}\n\n.pds-textarea__field {\n  background-color: var(--pine-color-background-container);\n  border: var(--pine-border);\n  border-radius: calc(var(--pine-dimension-xs) * 1.25);\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    color: var(--pine-color-text-disabled);\n    cursor: not-allowed;\n  }\n\n  &:focus-visible {\n    // outline: var(--pine-border-focus); Border radius for outline does not work in Safari\n    box-shadow: var(--box-shadow-focus); // Remove when outline radius is supported in Safari\n    outline: none;\n  }\n\n  &::placeholder {\n    color: var(--pine-color-text-placeholder);\n  }\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      box-shadow: var(--box-shadow-focus-error);\n    }\n  }\n}\n\n.pds-textarea__error-message,\n.pds-textarea__helper-message {\n  font: var(--pine-typography-body-sm-medium);\n  margin-block-start: var(--pine-dimension-xs);\n}\n\n.pds-textarea__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, Host, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { assignDescription, isRequired, messageId } from '../../utils/form';\nimport { TextareaChangeEventDetail, TextareaInputEventDetail } from './textarea-interface';\nimport { debounceEvent } from '@utils/utils';\nimport type { Attributes } from '@utils/attributes';\nimport { inheritAttributes, inheritAriaAttributes } from '@utils/attributes';\nimport { danger } from '@pine-ds/icons/icons';\n\n@Component({\n  tag: 'pds-textarea',\n  styleUrls: [\n    '../../global/styles/utils/label.scss',\n    '../pds-input/pds-input.tokens.scss',\n    'pds-textarea.scss'\n  ],\n  shadow: true,\n})\nexport class PdsTextarea {\n  private nativeTextarea?: HTMLTextAreaElement\n  private focusedValue?: string | null;\n  private inheritedAttributes: Attributes = {};\n  private originalPdsInput?: EventEmitter<TextareaInputEventDetail>;\n\n  @Element() el: HTMLPdsTextareaElement;\n\n  /**\n   * Emitted when the input loses focus.\n   */\n  @Event() pdsBlur!: EventEmitter<FocusEvent>;\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   * For elements that accept text input (`type=text`, `type=tel`, etc.), the interface\n   * is [`InputEvent`](https://developer.mozilla.org/en-US/docs/Web/API/InputEvent); for others,\n   * the interface is [`Event`](https://developer.mozilla.org/en-US/docs/Web/API/Event). If\n   * the input is cleared on edit, the type is `null`.\n   */\n  @Event() pdsInput: EventEmitter<TextareaInputEventDetail>;\n\n  /**\n   * Event emitted whenever the value of the textarea changes.\n   *\n   * This event will not emit when programmatically setting the `value` property.\n   */\n  @Event() pdsTextareaChange: EventEmitter<TextareaChangeEventDetail>;\n\n  /**\n   * Sets focus on the native `textarea` in the `pds-texarea`. Use this method instead of the global\n   * `textarea.focus()`.\n   */\n  @Method()\n  async setFocus() {\n    if (this.nativeTextarea) {\n      this.nativeTextarea.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   * Determines whether or not the textarea is disabled.\n   * @defaultValue false\n   */\n  @Prop() disabled = false;\n\n  /**\n   * The amount of time, in milliseconds, to wait to trigger the event after each keystroke.\n   */\n  @Prop() debounce?: number;\n\n  /**\n   * Displays an error message below the textarea field.\n   */\n  @Prop() errorMessage?: string;\n\n  /**\n   * Displays a message or hint below the textarea field.\n   */\n  @Prop() helperMessage?: string;\n\n  /**\n   * Determines whether or not the textarea is invalid or throws an error.\n   * @defaultValue false\n   */\n  @Prop({mutable: true}) invalid = false;       // eslint-disable-line @stencil-community/strict-mutable\n\n  /**\n   * Text to be displayed as the textarea label.\n   */\n  @Prop() label?: string;\n\n  /**\n   * Specifies the name. Submitted with the form name/value pair. This value will mirror the componentId.\n   */\n  @Prop() name: string = this.componentId;\n\n  /**\n   * Specifies a short hint that describes the expected value of the textarea.\n   */\n  @Prop() placeholder?: string;\n\n  /**\n   * Determines whether or not the textarea is readonly.\n   * @defaultValue false\n   */\n  @Prop() readonly = false;\n\n  /**\n   * Determines whether or not the textarea is required.\n   * @defaultValue false\n   */\n  @Prop() required = false;\n\n  /**\n   * Sets number of rows of text visible without needing to scroll in the textarea.\n   */\n  @Prop() rows?: number;\n\n  /**\n   * The value of the textarea.\n   */\n  @Prop({mutable: true}) value?: string | null = '';\n\n  @State() hasFocus = false;\n\n  @Watch('debounce')\n  protected debounceChanged() {\n    const { pdsInput, debounce, originalPdsInput } = this;\n\n    this.pdsInput = debounce === undefined ? originalPdsInput ?? pdsInput : debounceEvent(pdsInput, debounce);\n  }\n\n  /**\n   * Update the native input element when the value changes\n   */\n  @Watch('value')\n  protected valueChanged() {\n    const nativeTextarea = this.nativeTextarea;\n    const value = this.getValue();\n\n    if (nativeTextarea && nativeTextarea.value !== value) {\n      nativeTextarea.value = value;\n    }\n  }\n\n  /**\n   * Emits an `pdsInput` event.\n   */\n  private emitInputChange(event?: Event) {\n    const { value } = this;\n    this.pdsInput.emit({ value, event });\n  }\n\n  /**\n   * Emits an `pdsTextareaChange` event.\n   */\n  private emitValueChange(event?: Event) {\n    const textarea = event.target as HTMLTextAreaElement;\n    isRequired(textarea, this);\n\n    const { value } = textarea;\n\n    // Checks for both null and undefined values\n    const newValue = value == null ? value : value.toString();\n    this.focusedValue = newValue;\n    this.pdsTextareaChange.emit({ value: newValue, event });\n  }\n\n  private getValue(): string {\n    return this.value || '';\n  }\n\n  private onBlur = (ev: FocusEvent) => {\n    this.hasFocus = false;\n\n    if (this.focusedValue !== this.value) {\n      this.emitValueChange(ev);\n    }\n\n    this.pdsBlur.emit(ev);\n  };\n\n  private onFocus = (ev: FocusEvent) => {\n    this.hasFocus = true;\n    this.focusedValue = this.value;\n\n    this.pdsFocus.emit(ev);\n  };\n\n  private onInput = (ev: Event) => {\n    const input = ev.target as HTMLTextAreaElement | null;\n    if (input) {\n      this.value = input.value || '';\n    }\n    this.emitInputChange(ev);\n  };\n\n  private onTextareaChange = (ev: Event) => {\n    this.emitValueChange(ev);\n  };\n\n  private textareaClassNames() {\n    const classNames = ['pds-textarea__field'];\n\n    if (this.invalid && this.invalid === true) {\n      classNames.push('is-invalid');\n    }\n\n    return classNames.join('  ');\n  }\n\n  connectedCallback() {\n    this.debounceChanged();\n  }\n\n  componentWillLoad() {\n    this.inheritedAttributes = {\n      ...inheritAriaAttributes(this.el),\n      ...inheritAttributes(this.el),\n    };\n  }\n\n  componentDidLoad() {\n    this.originalPdsInput = this.pdsInput;\n  }\n\n  render() {\n    const value = this.getValue();\n\n    return (\n      <Host\n        aria-disabled={this.disabled ? 'true' : null}\n        aria-readonly={this.readonly ? 'true' : null}\n      >\n        <div class=\"pds-textarea\">\n          {this.label &&\n            <label htmlFor={this.componentId}>{this.label}</label>\n          }\n          <textarea\n            ref={(el) => this.nativeTextarea = el }\n            aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n            aria-invalid={this.invalid ? \"true\" : undefined}\n            autocomplete={this.autocomplete}\n            class={this.textareaClassNames()}\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            rows={this.rows}\n            onBlur={this.onBlur}\n            onChange={this.onTextareaChange}\n            onFocus={this.onFocus}\n            onInput={this.onInput}\n            {...this.inheritedAttributes}\n          >\n            {value}\n          </textarea>\n          {this.helperMessage &&\n            <p\n              class=\"pds-textarea__helper-message\"\n              id={messageId(this.componentId, 'helper')}\n            >\n              {this.helperMessage}\n            </p>\n          }\n          {this.invalid &&\n            <p\n              aria-live=\"assertive\"\n              class=\"pds-textarea__error-message\"\n              id={messageId(this.componentId, 'error')}\n            >\n              <pds-icon icon={danger} size=\"small\" />\n              {this.errorMessage}\n            </p>\n          }\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/pds-tooltip.cjs.entry.js

@@ -139,13 +139,13 @@ const PdsTooltip = class {
         this.opened = false;
     }
     render() {
-        return (index.h(index.Host, { key: '33df155f78b81a7c933e89bb115247c49732fa3c', onMouseEnter: this.handleShow, onMouseLeave: this.handleHide, onFocusin: this.handleShow, onFocusout: this.handleHide }, index.h("div", { key: '42acdb06c67d77e05a2079423731b2587c04193b', class: `
+        return (index.h(index.Host, { key: '0db068ff80874300eb6945484cbaae6848b049e5', onMouseEnter: this.handleShow, onMouseLeave: this.handleHide, onFocusin: this.handleShow, onFocusout: this.handleHide }, index.h("div", { key: 'd3bc1f943ae310e9e520b3ff11f153a3bd2ab995', class: `
             pds-tooltip
             pds-tooltip--${this.placement}
             ${this.htmlContent ? 'pds-tooltip--has-html-content' : ''}
             ${this.opened ? 'pds-tooltip--is-open' : ''}
             ${this.hasArrow ? '' : 'pds-tooltip--no-arrow'}
-          ` }, index.h("span", { key: '3086830ad1713041b1750868f1455ac5c246af20', "aria-describedby": this.componentId, class: "pds-tooltip__trigger" }, index.h("slot", { key: '0fcff3e24fcfac192581cf51ec0c7b22f2d338ec' })), index.h("div", { key: 'e8c73dc4872b2356dd6bcd278f181816d9237997', class: "pds-tooltip__content", "aria-hidden": this.opened ? 'false' : 'true', "aria-live": this.opened ? 'polite' : 'off', id: this.componentId, ref: (el) => (this.contentEl = el), role: "tooltip", style: { maxWidth: this.maxWidth } }, index.h("slot", { key: '031946f960e6250fe7af1535648317ef5a9521f9', name: "content" }), this.content))));
+          ` }, index.h("span", { key: '9e44354763e75d71fc61927720f9e2307a5d65ac', "aria-describedby": this.componentId, class: "pds-tooltip__trigger" }, index.h("slot", { key: '67f6124bea83fcdb6d2182f1c97782d8b8538be3' })), index.h("div", { key: '1a28d38b279c10c1597bd91e5e0188875a9b8552', class: "pds-tooltip__content", "aria-hidden": this.opened ? 'false' : 'true', "aria-live": this.opened ? 'polite' : 'off', id: this.componentId, ref: (el) => (this.contentEl = el), role: "tooltip", style: { maxWidth: this.maxWidth } }, index.h("slot", { key: 'c6f5f7bdb013c93a8139f07b9fcb47d3acb0ab54', name: "content" }), this.content))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/pine-core.cjs.js

@@ -19,7 +19,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["pds-table-head.cjs",[[1,"pds-table-head",{"indeterminate":[1028],"isSelected":[1028,"is-selected"]}]]],["pds-table-row.cjs",[[1,"pds-table-row",{"indeterminate":[1028],"isSelected":[1028,"is-selected"]}]]],["pds-copytext.cjs",[[1,"pds-copytext",{"border":[516],"componentId":[1,"component-id"],"fullWidth":[4,"full-width"],"truncate":[4],"value":[1]}]]],["pds-accordion.cjs",[[1,"pds-accordion",{"componentId":[1,"component-id"],"isOpen":[1540,"open"]},null,{"isOpen":["handleOpenState"]}]]],["pds-avatar.cjs",[[1,"pds-avatar",{"alt":[1],"badge":[4],"componentId":[1,"component-id"],"dropdown":[4],"image":[1],"size":[513],"variant":[513]}]]],["pds-chip.cjs",[[1,"pds-chip",{"componentId":[1,"component-id"],"dot":[4],"label":[1],"large":[4],"sentiment":[1],"variant":[1]}]]],["pds-input.cjs",[[1,"pds-input",{"autocomplete":[1],"componentId":[1,"component-id"],"debounce":[2],"disabled":[4],"errorMessage":[1,"error-message"],"helperMessage":[1,"helper-message"],"invalid":[4],"label":[1],"name":[1],"placeholder":[1],"readonly":[4],"required":[4],"type":[1],"value":[1032],"hasFocus":[32],"setFocus":[64]},null,{"debounce":["debounceChanged"],"value":["valueChanged"]}]]],["pds-link.cjs",[[1,"pds-link",{"componentId":[1,"component-id"],"external":[4],"variant":[1],"fontSize":[1,"font-size"],"href":[1]}]]],["pds-radio.cjs",[[2,"pds-radio",{"checked":[4],"componentId":[1,"component-id"],"disabled":[4],"errorMessage":[1,"error-message"],"helperMessage":[1,"helper-message"],"invalid":[4],"label":[1],"name":[1],"required":[4],"value":[1]}]]],["pds-select.cjs",[[1,"pds-select",{"autocomplete":[1],"componentId":[1,"component-id"],"disabled":[4],"errorMessage":[1,"error-message"],"helperMessage":[1,"helper-message"],"invalid":[4],"label":[1],"multiple":[4],"name":[1],"required":[4],"value":[1025]},null,{"value":["valueChanged"]}]]],["pds-sortable-item.cjs",[[6,"pds-sortable-item",{"enableActions":[4,"enable-actions"],"componentId":[1,"component-id"],"showHandle":[1028,"show-handle"]}]]],["pds-switch.cjs",[[1,"pds-switch",{"componentId":[1,"component-id"],"checked":[1028],"disabled":[4],"errorMessage":[1,"error-message"],"helperMessage":[1,"helper-message"],"invalid":[4],"label":[1],"name":[1],"required":[4],"value":[1]}]]],["pds-textarea.cjs",[[1,"pds-textarea",{"autocomplete":[1],"componentId":[1,"component-id"],"disabled":[4],"debounce":[2],"errorMessage":[1,"error-message"],"helperMessage":[1,"helper-message"],"invalid":[1028],"label":[1],"name":[1],"placeholder":[1],"readonly":[4],"required":[4],"rows":[2],"value":[1025],"hasFocus":[32],"setFocus":[64]},null,{"debounce":["debounceChanged"],"value":["valueChanged"]}]]],["pds-box.cjs",[[0,"pds-box",{"alignItems":[1,"align-items"],"auto":[4],"backgroundColor":[1,"background-color"],"border":[4],"borderColor":[1,"border-color"],"borderRadius":[1,"border-radius"],"direction":[1],"display":[1],"fit":[4],"gap":[1],"flex":[1],"justifyContent":[1,"justify-content"],"minHeight":[1,"min-height"],"minWidth":[1,"min-width"],"offset":[1],"offsetXs":[1,"offset-xs"],"offsetSm":[1,"offset-sm"],"offsetMd":[1,"offset-md"],"offsetLg":[1,"offset-lg"],"offsetXl":[1,"offset-xl"],"padding":[1],"shadow":[1],"size":[1],"sizeXs":[1,"size-xs"],"sizeSm":[1,"size-sm"],"sizeMd":[1,"size-md"],"sizeLg":[1,"size-lg"],"sizeXl":[1,"size-xl"]}]]],["pds-divider.cjs",[[1,"pds-divider",{"componentId":[1,"component-id"],"offset":[1],"vertical":[4]}]]],["pds-image.cjs",[[1,"pds-image",{"alt":[1],"componentId":[1,"component-id"],"height":[2],"loading":[1],"sizes":[1],"src":[1],"srcset":[1],"width":[2]}]]],["pds-loader.cjs",[[1,"pds-loader",{"isLoading":[4,"is-loading"],"showLabel":[4,"show-label"],"size":[513],"variant":[1]}]]],["pds-popover.cjs",[[1,"pds-popover",{"popoverTargetAction":[1,"popover-target-action"],"popoverType":[1,"popover-type"],"componentId":[1,"component-id"],"text":[1],"maxWidth":[2,"max-width"],"placement":[513],"active":[32]},[[2,"click","handleClick"],[11,"scroll","handleScroll"]]]]],["pds-progress.cjs",[[1,"pds-progress",{"animated":[4],"componentId":[1,"component-id"],"fillColor":[1,"fill-color"],"label":[1],"percent":[2],"showPercent":[4,"show-percent"]}]]],["pds-row.cjs",[[0,"pds-row",{"alignItems":[1,"align-items"],"border":[4],"colGap":[1,"col-gap"],"componentId":[1,"component-id"],"justifyContent":[1,"justify-content"],"minHeight":[1,"min-height"],"noWrap":[4,"no-wrap"]}]]],["pds-sortable.cjs",[[6,"pds-sortable",{"border":[516],"componentId":[1,"component-id"],"dividers":[516],"handleType":[1,"handle-type"]}]]],["pds-tab.cjs",[[4,"pds-tab",{"name":[1],"parentComponentId":[1,"parent-component-id"],"variant":[1],"index":[2],"selected":[4]}]]],["pds-table.cjs",[[1,"pds-table",{"compact":[4],"componentId":[1,"component-id"],"responsive":[4],"fixedColumn":[4,"fixed-column"],"selectable":[4],"sortingColumn":[32],"sortingDirection":[32]},[[0,"pdsTableSort","handleTableSort"],[0,"pdsTableSelectAll","handleTableSelectAll"],[0,"pdsTableRowSelected","handleTableSelect"]]]]],["pds-table-body.cjs",[[1,"pds-table-body"]]],["pds-tabpanel.cjs",[[4,"pds-tabpanel",{"name":[1],"parentComponentId":[1,"parent-component-id"],"variant":[1],"selected":[1028]}]]],["pds-tabs.cjs",[[1,"pds-tabs",{"tablistLabel":[1,"tablist-label"],"componentId":[1,"component-id"],"variant":[1],"activeTabName":[1025,"active-tab-name"],"activeTabIndex":[1026,"active-tab-index"]},[[16,"pdsTabClick","tabClickHandler"],[0,"keydown","handleKeyDown"]]]]],["pds-text.cjs",[[1,"pds-text",{"align":[1],"color":[1],"decoration":[1],"gutter":[1],"size":[1],"weight":[1],"tag":[1]}]]],["pds-tooltip.cjs",[[1,"pds-tooltip",{"content":[1],"componentId":[1,"component-id"],"hasArrow":[4,"has-arrow"],"htmlContent":[4,"html-content"],"placement":[513],"maxWidth":[1,"max-width"],"opened":[1540],"isOpen":[32],"showTooltip":[64],"hideTooltip":[64]},null,{"opened":["handleOpenToggle"]}]]],["pds-icon.cjs",[[1,"pds-icon",{"color":[1],"icon":[8],"name":[513],"size":[513],"src":[1],"ariaLabel":[32],"isVisible":[32],"svgContent":[32]},null,{"size":["updateStyles"],"color":["updateStyles"],"name":["loadIcon"],"src":["loadIcon"],"icon":["loadIcon"]}]]],["pds-button.cjs",[[1,"pds-button",{"componentId":[1,"component-id"],"disabled":[4],"icon":[1],"name":[1],"value":[1],"type":[1],"variant":[1]}]]],["pds-table-head-cell.cjs",[[1,"pds-table-head-cell",{"sortable":[4],"sortingDirection":[32],"tableScrolling":[32],"isSelected":[32]}]]],["pds-table-cell.cjs",[[1,"pds-table-cell",{"truncate":[4],"tableScrolling":[32]}]]],["pds-checkbox.cjs",[[1,"pds-checkbox",{"checked":[1028],"componentId":[1,"component-id"],"disabled":[4],"errorMessage":[1,"error-message"],"helperMessage":[1,"helper-message"],"indeterminate":[1028],"invalid":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"required":[4],"value":[1]},null,{"checked":["updateIndeterminate"]}]]]], options);
+  return index.bootstrapLazy([["pds-copytext.cjs",[[1,"pds-copytext",{"border":[516],"componentId":[1,"component-id"],"fullWidth":[4,"full-width"],"truncate":[4],"value":[1]}]]],["pds-table-head.cjs",[[1,"pds-table-head",{"indeterminate":[1028],"isSelected":[1028,"is-selected"]}]]],["pds-table-row.cjs",[[1,"pds-table-row",{"indeterminate":[1028],"isSelected":[1028,"is-selected"]}]]],["pds-accordion.cjs",[[1,"pds-accordion",{"componentId":[1,"component-id"],"isOpen":[1540,"open"]},null,{"isOpen":["handleOpenState"]}]]],["pds-avatar.cjs",[[1,"pds-avatar",{"alt":[1],"badge":[4],"componentId":[1,"component-id"],"dropdown":[4],"image":[1],"size":[513],"variant":[513]}]]],["pds-chip.cjs",[[1,"pds-chip",{"componentId":[1,"component-id"],"dot":[4],"label":[1],"large":[4],"sentiment":[1],"variant":[1]}]]],["pds-input.cjs",[[1,"pds-input",{"autocomplete":[1],"componentId":[1,"component-id"],"debounce":[2],"disabled":[4],"errorMessage":[1,"error-message"],"helperMessage":[1,"helper-message"],"invalid":[4],"label":[1],"name":[1],"placeholder":[1],"readonly":[4],"required":[4],"type":[1],"value":[1032],"hasFocus":[32],"setFocus":[64]},null,{"debounce":["debounceChanged"],"value":["valueChanged"]}]]],["pds-link.cjs",[[1,"pds-link",{"componentId":[1,"component-id"],"external":[4],"variant":[1],"fontSize":[1,"font-size"],"href":[1]}]]],["pds-radio.cjs",[[2,"pds-radio",{"checked":[4],"componentId":[1,"component-id"],"disabled":[4],"errorMessage":[1,"error-message"],"helperMessage":[1,"helper-message"],"invalid":[4],"label":[1],"name":[1],"required":[4],"value":[1]}]]],["pds-select.cjs",[[1,"pds-select",{"autocomplete":[1],"componentId":[1,"component-id"],"disabled":[4],"errorMessage":[1,"error-message"],"helperMessage":[1,"helper-message"],"invalid":[4],"label":[1],"multiple":[4],"name":[1],"required":[4],"value":[1025]},null,{"value":["valueChanged"]}]]],["pds-sortable-item.cjs",[[6,"pds-sortable-item",{"enableActions":[4,"enable-actions"],"componentId":[1,"component-id"],"showHandle":[1028,"show-handle"]}]]],["pds-switch.cjs",[[1,"pds-switch",{"componentId":[1,"component-id"],"checked":[1028],"disabled":[4],"errorMessage":[1,"error-message"],"helperMessage":[1,"helper-message"],"invalid":[4],"label":[1],"name":[1],"required":[4],"value":[1]}]]],["pds-textarea.cjs",[[1,"pds-textarea",{"autocomplete":[1],"componentId":[1,"component-id"],"disabled":[4],"debounce":[2],"errorMessage":[1,"error-message"],"helperMessage":[1,"helper-message"],"invalid":[1028],"label":[1],"name":[1],"placeholder":[1],"readonly":[4],"required":[4],"rows":[2],"value":[1025],"hasFocus":[32],"setFocus":[64]},null,{"debounce":["debounceChanged"],"value":["valueChanged"]}]]],["pds-box.cjs",[[0,"pds-box",{"alignItems":[1,"align-items"],"auto":[4],"backgroundColor":[1,"background-color"],"border":[4],"borderColor":[1,"border-color"],"borderRadius":[1,"border-radius"],"direction":[1],"display":[1],"fit":[4],"gap":[1],"flex":[1],"justifyContent":[1,"justify-content"],"minHeight":[1,"min-height"],"minWidth":[1,"min-width"],"offset":[1],"offsetXs":[1,"offset-xs"],"offsetSm":[1,"offset-sm"],"offsetMd":[1,"offset-md"],"offsetLg":[1,"offset-lg"],"offsetXl":[1,"offset-xl"],"padding":[1],"shadow":[1],"size":[1],"sizeXs":[1,"size-xs"],"sizeSm":[1,"size-sm"],"sizeMd":[1,"size-md"],"sizeLg":[1,"size-lg"],"sizeXl":[1,"size-xl"]}]]],["pds-divider.cjs",[[1,"pds-divider",{"componentId":[1,"component-id"],"offset":[1],"vertical":[4]}]]],["pds-image.cjs",[[1,"pds-image",{"alt":[1],"componentId":[1,"component-id"],"height":[2],"loading":[1],"sizes":[1],"src":[1],"srcset":[1],"width":[2]}]]],["pds-popover.cjs",[[1,"pds-popover",{"popoverTargetAction":[1,"popover-target-action"],"popoverType":[1,"popover-type"],"componentId":[1,"component-id"],"text":[1],"maxWidth":[2,"max-width"],"placement":[513],"active":[32]},[[2,"click","handleClick"],[11,"scroll","handleScroll"]]]]],["pds-progress.cjs",[[1,"pds-progress",{"animated":[4],"componentId":[1,"component-id"],"fillColor":[1,"fill-color"],"label":[1],"percent":[2],"showPercent":[4,"show-percent"]}]]],["pds-row.cjs",[[0,"pds-row",{"alignItems":[1,"align-items"],"border":[4],"colGap":[1,"col-gap"],"componentId":[1,"component-id"],"justifyContent":[1,"justify-content"],"minHeight":[1,"min-height"],"noWrap":[4,"no-wrap"]}]]],["pds-sortable.cjs",[[6,"pds-sortable",{"border":[516],"componentId":[1,"component-id"],"dividers":[516],"handleType":[1,"handle-type"]}]]],["pds-tab.cjs",[[4,"pds-tab",{"name":[1],"parentComponentId":[1,"parent-component-id"],"variant":[1],"index":[2],"selected":[4]}]]],["pds-table.cjs",[[1,"pds-table",{"compact":[4],"componentId":[1,"component-id"],"responsive":[4],"fixedColumn":[4,"fixed-column"],"selectable":[4],"sortingColumn":[32],"sortingDirection":[32]},[[0,"pdsTableSort","handleTableSort"],[0,"pdsTableSelectAll","handleTableSelectAll"],[0,"pdsTableRowSelected","handleTableSelect"]]]]],["pds-table-body.cjs",[[1,"pds-table-body"]]],["pds-tabpanel.cjs",[[4,"pds-tabpanel",{"name":[1],"parentComponentId":[1,"parent-component-id"],"variant":[1],"selected":[1028]}]]],["pds-tabs.cjs",[[1,"pds-tabs",{"tablistLabel":[1,"tablist-label"],"componentId":[1,"component-id"],"variant":[1],"activeTabName":[1025,"active-tab-name"],"activeTabIndex":[1026,"active-tab-index"]},[[16,"pdsTabClick","tabClickHandler"],[0,"keydown","handleKeyDown"]]]]],["pds-text.cjs",[[1,"pds-text",{"align":[1],"color":[1],"decoration":[1],"gutter":[1],"size":[1],"weight":[1],"tag":[1]}]]],["pds-tooltip.cjs",[[1,"pds-tooltip",{"content":[1],"componentId":[1,"component-id"],"hasArrow":[4,"has-arrow"],"htmlContent":[4,"html-content"],"placement":[513],"maxWidth":[1,"max-width"],"opened":[1540],"isOpen":[32],"showTooltip":[64],"hideTooltip":[64]},null,{"opened":["handleOpenToggle"]}]]],["pds-loader.cjs",[[1,"pds-loader",{"isLoading":[4,"is-loading"],"showLabel":[4,"show-label"],"size":[513],"variant":[1]}]]],["pds-icon.cjs",[[1,"pds-icon",{"color":[1],"icon":[8],"name":[513],"size":[513],"src":[1],"ariaLabel":[32],"isVisible":[32],"svgContent":[32]},null,{"size":["updateStyles"],"color":["updateStyles"],"name":["loadIcon"],"src":["loadIcon"],"icon":["loadIcon"]}]]],["pds-button.cjs",[[1,"pds-button",{"componentId":[1,"component-id"],"disabled":[4],"fullWidth":[4,"full-width"],"icon":[1],"loading":[4],"name":[1],"value":[1],"type":[1],"variant":[1]}]]],["pds-table-head-cell.cjs",[[1,"pds-table-head-cell",{"sortable":[4],"sortingDirection":[32],"tableScrolling":[32],"isSelected":[32]}]]],["pds-table-cell.cjs",[[1,"pds-table-cell",{"truncate":[4],"tableScrolling":[32]}]]],["pds-checkbox.cjs",[[1,"pds-checkbox",{"checked":[1028],"componentId":[1,"component-id"],"disabled":[4],"errorMessage":[1,"error-message"],"helperMessage":[1,"helper-message"],"indeterminate":[1028],"invalid":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"required":[4],"value":[1]},null,{"checked":["updateIndeterminate"]}]]]], options);
 });
 
 exports.setNonce = index.setNonce;

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

@@ -27,7 +27,7 @@ details[open] summary pds-icon {
 summary {
   background-color: var(--pine-color-background-container);
   border-radius: var(--pine-dimension-xs);
-  color: var(--pine-color-text);
+  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);
@@ -45,7 +45,7 @@ summary::-webkit-details-marker {
 }
 summary:hover {
   background: var(--pine-color-background-container-hover);
-  color: var(--color-text-hover);
+  color: var(--pine-color-text);
   cursor: pointer;
 }
 summary:focus-visible {

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

@@ -1156,7 +1156,7 @@ pds-box {
 }
 
 .pds-box-gap-xxl {
-  gap: var(--pine-dimension-xxl);
+  gap: var(--pine-dimension-2xl);
 }
 
 .pds-padding-none {
@@ -1168,7 +1168,7 @@ pds-box {
 }
 
 .pds-padding-xs {
-  padding: var(--pine-dimension-2xs);
+  padding: var(--pine-dimension-xs);
 }
 
 .pds-padding-sm {
@@ -1188,7 +1188,7 @@ pds-box {
 }
 
 .pds-padding-xxl {
-  padding: var(--pine-dimension-xxl);
+  padding: var(--pine-dimension-2xl);
 }
 
 .pds-box-display-flex {