@pine-ds/core 3.9.0 → 3.11.0

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

@@ -212,7 +212,7 @@ export class PdsSelect {
     }
     render() {
         const hasAction = this.el.querySelector('[slot="action"]') !== null;
-        return (h(Host, { key: 'b3be9584f5fddb4f1a55517f54c1713f99881217', "aria-disabled": this.disabled ? 'true' : null, class: this.classNames(), "has-action": hasAction && !this.hideLabel ? 'true' : null }, h("div", { key: '89ea75fbce2c1a0e5b4b744f10bacfd84db73773', class: "pds-select" }, !this.hideLabel && (h("div", { key: 'bf1c8c06c96d941d7d93b960de9279df4520f10f', class: "pds-select__label-wrapper" }, h("label", { key: 'eb7beaa77f9f2be302e7b14642c6c5153db4cebe', htmlFor: this.componentId }, h("span", { key: '47a737210afc1c86431c123aa2449827f0b9755d', class: this.hideLabel ? 'visually-hidden' : '' }, this.label)), hasAction && this.renderAction())), h("select", { key: 'f510d59fe20742e210c4fb949d468184bb2f12cc', "aria-label": this.hideLabel ? this.label : undefined, autocomplete: this.autocomplete || undefined, class: "pds-select__field", disabled: this.disabled, id: this.componentId, multiple: this.multiple, name: this.name, onChange: this.onSelectUpdate, part: "select", required: this.required, ref: (el) => (this.selectEl = el) }), h("div", { key: '7653404278cc8446de96e3e1fdbfcf47ea6b8edc', "aria-hidden": "true", class: "hidden", ref: (el) => (this.slotContainer = el) }, h("slot", { key: '04626b23972a2d3fe73b09ea8fbe94021e89d98d', onSlotchange: this.handleSlotChange })), this.renderMessages(), !this.multiple && h("pds-icon", { key: '0d97224a202e0a6e7ad36e2b8a027975ff22079d', class: "pds-select__select-icon", icon: enlarge }))));
+        return (h(Host, { key: '0d94c80a048b1ce3a0c2c6147bf84aab09781e08', "aria-disabled": this.disabled ? 'true' : null, class: this.classNames(), "has-action": hasAction && !this.hideLabel ? 'true' : null }, h("div", { key: '15533d7713175f9fddd1fd972f7faa0852753763', class: "pds-select" }, !this.hideLabel && (h("div", { key: '5327297f4963ec4d1e182ee63f973e7309164389', class: "pds-select__label-wrapper" }, h("label", { key: 'b9d697e170c343be49f3654432eb3e9a269dc28c', htmlFor: this.componentId }, h("span", { key: 'f2b2a61293818d2a163836f25e32bf8f66936752', class: this.hideLabel ? 'visually-hidden' : '' }, this.label)), hasAction && this.renderAction())), h("select", { key: '4b1eed0ba9cb197fa2fdb9ac0a342bd3df21313b', "aria-label": this.hideLabel ? this.label : undefined, autocomplete: this.autocomplete || undefined, class: "pds-select__field", disabled: this.disabled, id: this.componentId, multiple: this.multiple, name: this.name, onChange: this.onSelectUpdate, part: "select", required: this.required, ref: (el) => (this.selectEl = el) }), h("div", { key: '2ceb92d89a00308245571f2aeae0c901cd850874', "aria-hidden": "true", class: "hidden", ref: (el) => (this.slotContainer = el) }, h("slot", { key: '032ef7c0c4b7442fd8f524995cfb95475687b98c', onSlotchange: this.handleSlotChange })), this.renderMessages(), !this.multiple && h("pds-icon", { key: 'ee2773042ca2d05a98ff9c46c2934926de69d8e6', class: "pds-select__select-icon", icon: enlarge }))));
     }
     static get is() { return "pds-select"; }
     static get encapsulation() { return "shadow"; }
@@ -245,8 +245,8 @@ export class PdsSelect {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "autocomplete",
-                "reflect": false
+                "reflect": false,
+                "attribute": "autocomplete"
             },
             "componentId": {
                 "type": "string",
@@ -264,8 +264,8 @@ export class PdsSelect {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "component-id",
-                "reflect": false
+                "reflect": false,
+                "attribute": "component-id"
             },
             "disabled": {
                 "type": "boolean",
@@ -286,8 +286,8 @@ export class PdsSelect {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "disabled",
                 "reflect": false,
+                "attribute": "disabled",
                 "defaultValue": "false"
             },
             "errorMessage": {
@@ -306,8 +306,8 @@ export class PdsSelect {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "error-message",
-                "reflect": false
+                "reflect": false,
+                "attribute": "error-message"
             },
             "hideLabel": {
                 "type": "boolean",
@@ -325,8 +325,8 @@ export class PdsSelect {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "hide-label",
-                "reflect": false
+                "reflect": false,
+                "attribute": "hide-label"
             },
             "helperMessage": {
                 "type": "string",
@@ -344,8 +344,8 @@ export class PdsSelect {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "helper-message",
-                "reflect": false
+                "reflect": false,
+                "attribute": "helper-message"
             },
             "invalid": {
                 "type": "boolean",
@@ -363,8 +363,8 @@ export class PdsSelect {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "invalid",
-                "reflect": false
+                "reflect": false,
+                "attribute": "invalid"
             },
             "label": {
                 "type": "string",
@@ -382,8 +382,8 @@ export class PdsSelect {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "label",
-                "reflect": false
+                "reflect": false,
+                "attribute": "label"
             },
             "multiple": {
                 "type": "boolean",
@@ -404,8 +404,8 @@ export class PdsSelect {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "multiple",
                 "reflect": false,
+                "attribute": "multiple",
                 "defaultValue": "false"
             },
             "name": {
@@ -424,8 +424,8 @@ export class PdsSelect {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "name",
-                "reflect": false
+                "reflect": false,
+                "attribute": "name"
             },
             "required": {
                 "type": "boolean",
@@ -446,8 +446,8 @@ export class PdsSelect {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "required",
                 "reflect": false,
+                "attribute": "required",
                 "defaultValue": "false"
             },
             "highlight": {
@@ -466,8 +466,8 @@ export class PdsSelect {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "highlight",
-                "reflect": true
+                "reflect": true,
+                "attribute": "highlight"
             },
             "value": {
                 "type": "string",
@@ -485,8 +485,8 @@ export class PdsSelect {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "value",
-                "reflect": false
+                "reflect": false,
+                "attribute": "value"
             }
         };
     }

package/dist/collection/components/pds-sortable/pds-sortable-item/pds-sortable-item.js

@@ -25,7 +25,7 @@ export class PdsSortableItem {
         }
     }
     render() {
-        return (h(Host, { key: 'c09d0efc16e9cfb2e3eb567620d768e55aedaf77', class: "pds-sortable-item", id: this.componentId }, this.showHandle && (h("div", { key: '256c70c9ae566781ee3647196ba7bfa8b2e8f7cf', class: "pds-sortable-item__handle" }, h("pds-icon", { key: 'ec56d4eac7f1f464df061297a613554565130d3d', icon: handleIcon }))), h("slot", { key: '6131eda3a2b8a7ef96883f9f791a2cf777407fa4' }), this.enableActions && (h("div", { key: '126589fa42498a25f5049786def7fb96f16087aa', class: "pds-sortable-item__actions" }, h("slot", { key: 'e2726fb1ae3f74c5ff4b7879ee32b826fb2b8518', name: "sortable-item-actions" })))));
+        return (h(Host, { key: '5c5ada49c505d935bfe505997ab69e7eafc2f642', class: "pds-sortable-item", id: this.componentId }, this.showHandle && (h("div", { key: '3041977b792e192192fa9c101f113eb42e87ceea', class: "pds-sortable-item__handle" }, h("pds-icon", { key: '082a98c200abcc8023dc126ed83091167c59290e', icon: handleIcon }))), h("slot", { key: '1e2b2154acee0c3ce09ec77b9949c761ff37181d' }), this.enableActions && (h("div", { key: '5b318f04eb9c74f660900163e17ba51e2c354538', class: "pds-sortable-item__actions" }, h("slot", { key: '2c6631a860af0da48b3a007daeff69b59cfaff59', name: "sortable-item-actions" })))));
     }
     static get is() { return "pds-sortable-item"; }
     static get encapsulation() { return "scoped"; }
@@ -60,8 +60,8 @@ export class PdsSortableItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "enable-actions",
                 "reflect": false,
+                "attribute": "enable-actions",
                 "defaultValue": "false"
             },
             "componentId": {
@@ -80,8 +80,8 @@ export class PdsSortableItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "component-id",
-                "reflect": false
+                "reflect": false,
+                "attribute": "component-id"
             },
             "showHandle": {
                 "type": "boolean",
@@ -102,8 +102,8 @@ export class PdsSortableItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "show-handle",
                 "reflect": false,
+                "attribute": "show-handle",
                 "defaultValue": "false"
             }
         };

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

@@ -44,7 +44,7 @@ export class PdsSortable {
         Sortable.create(this.el, sortableOptions);
     }
     render() {
-        return (h(Host, { key: '8d6acb29c18b53a699281b86f73c566b9ebfd291', class: this.classNames(), id: this.componentId }, h("slot", { key: '32fee1636973846016311c70e885a0e5c7645431' })));
+        return (h(Host, { key: '0af78db3e32adf714d10fb08ff4318f7c84aaef9', class: this.classNames(), id: this.componentId }, h("slot", { key: '1e7ac27c41de163ea4d59c6186a1282eb5f0b27d' })));
     }
     static get is() { return "pds-sortable"; }
     static get encapsulation() { return "scoped"; }
@@ -79,8 +79,8 @@ export class PdsSortable {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "border",
                 "reflect": true,
+                "attribute": "border",
                 "defaultValue": "false"
             },
             "componentId": {
@@ -99,8 +99,8 @@ export class PdsSortable {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "component-id",
-                "reflect": false
+                "reflect": false,
+                "attribute": "component-id"
             },
             "dividers": {
                 "type": "boolean",
@@ -118,8 +118,8 @@ export class PdsSortable {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "dividers",
                 "reflect": true,
+                "attribute": "dividers",
                 "defaultValue": "false"
             },
             "handleType": {
@@ -138,8 +138,8 @@ export class PdsSortable {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "handle-type",
                 "reflect": false,
+                "attribute": "handle-type",
                 "defaultValue": "'row'"
             }
         };

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

@@ -1 +1 @@
-{"version":3,"file":"pds-sortable.js","sourceRoot":"","sources":["../../../src/components/pds-sortable/pds-sortable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEvF,OAAO,QAAQ,MAAM,YAAY,CAAC;AAOlC,MAAM,OAAO,WAAW;IALxB;QAaE;;;WAGG;QACsB,WAAM,GAAG,KAAK,CAAC;QAOxC;;WAEG;QACsB,aAAQ,GAAG,KAAK,CAAC;QAE1C;;WAEG;QACK,eAAU,GAAqB,KAAK,CAAC;KAgD9C;IA9CS,UAAU;QAChB,MAAM,UAAU,GAAG,CAAC,cAAc,CAAC,CAAC;QAEpC,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,UAAU,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC;QAC5C,CAAC;QAED,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,UAAU,CAAC,IAAI,CAAC,uBAAuB,CAAC,CAAC;QAC3C,CAAC;QAED,IAAI,IAAI,CAAC,UAAU,KAAK,SAAS,EAAE,CAAC;YAClC,UAAU,CAAC,IAAI,CAAC,6BAA6B,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;QAClE,CAAC;QAED,OAAO,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC/B,CAAC;IAED,gBAAgB;QAEd,IAAI,eAAe,GAAiB;YAClC,SAAS,EAAE,GAAG;YACd,UAAU,EAAE,0BAA0B;YACtC,SAAS,EAAE,yBAAyB;YACpC,KAAK,EAAE,CAAC,GAAG,EAAE,EAAE;gBACb,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YACtC,CAAC;SACF,CAAC;QAEF,IAAI,IAAI,CAAC,UAAU,KAAK,QAAQ,EAAE,CAAC;YACjC,eAAe,mCACV,eAAe,KAClB,MAAM,EAAE,4BAA4B,GACrC,CAAC;QACJ,CAAC;QAED,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,EAAE,eAAe,CAAC,CAAC;IAC5C,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,IAAI,CAAC,WAAW;YAClD,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { SortableType } from './sortable-interface';\nimport Sortable from 'sortablejs';\n\n@Component({\n  tag: 'pds-sortable',\n  styleUrls: ['pds-sortable.scss'],\n  scoped: true,\n})\nexport class PdsSortable {\n  @Element() el: HTMLPdsSortableElement;\n\n  /**\n   * Event emitted when a sortable item is moved.\n   */\n  @Event() pdsSortableItemMoved: EventEmitter;\n\n  /**\n   * Determines whether `sortable` should have a border.\n   * @defaultValue false\n   */\n  @Prop({ reflect: true }) border = false;\n\n  /**\n   * A unique identifier used for the sortable container `id` attribute.\n   */\n  @Prop() componentId!: string;\n\n  /**\n   * Deternines whether `sortable` items should be divided with border.\n   */\n  @Prop({ reflect: true }) dividers = false;\n\n  /**\n   * Determines the grabbable area for the `pds-sortable-item`.\n   */\n  @Prop() handleType: 'handle' | 'row' = 'row';\n\n  private classNames() {\n    const classNames = ['pds-sortable'];\n\n    if (this.border) {\n      classNames.push('pds-sortable--bordered');\n    }\n\n    if (this.dividers) {\n      classNames.push('pds-sortable--divided');\n    }\n\n    if (this.handleType !== undefined) {\n      classNames.push(`pds-sortable--handle-type-${this.handleType}`);\n    }\n\n    return classNames.join('  ');\n  }\n\n  componentDidLoad() {\n\n    let sortableOptions: SortableType = {\n      animation: 150,\n      ghostClass: 'pds-sortable-item--ghost',\n      dragClass: 'pds-sortable-item--drag',\n      onEnd: (evt) => {\n        this.pdsSortableItemMoved.emit(evt);\n      },\n    };\n\n    if (this.handleType === 'handle') {\n      sortableOptions = {\n        ...sortableOptions,\n        handle: '.pds-sortable-item__handle',\n      };\n    }\n\n    Sortable.create(this.el, sortableOptions);\n  }\n\n  render() {\n    return (\n      <Host class={this.classNames()} id={this.componentId}>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"pds-sortable.js","sourceRoot":"","sources":["../../../src/components/pds-sortable/pds-sortable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEvF,OAAO,QAAQ,MAAM,YAAY,CAAC;AAOlC,MAAM,OAAO,WAAW;IALxB;QAaE;;;WAGG;QACsB,WAAM,GAAG,KAAK,CAAC;QAOxC;;WAEG;QACsB,aAAQ,GAAG,KAAK,CAAC;QAE1C;;WAEG;QACK,eAAU,GAAqB,KAAK,CAAC;KAgD9C;IA9CS,UAAU;QAChB,MAAM,UAAU,GAAG,CAAC,cAAc,CAAC,CAAC;QAEpC,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,UAAU,CAAC,IAAI,CAAC,wBAAwB,CAAC,CAAC;QAC5C,CAAC;QAED,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,UAAU,CAAC,IAAI,CAAC,uBAAuB,CAAC,CAAC;QAC3C,CAAC;QAED,IAAI,IAAI,CAAC,UAAU,KAAK,SAAS,EAAE,CAAC;YAClC,UAAU,CAAC,IAAI,CAAC,6BAA6B,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;QAClE,CAAC;QAED,OAAO,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC/B,CAAC;IAED,gBAAgB;QAEd,IAAI,eAAe,GAAiB;YAClC,SAAS,EAAE,GAAG;YACd,UAAU,EAAE,0BAA0B;YACtC,SAAS,EAAE,yBAAyB;YACpC,KAAK,EAAE,CAAC,GAAG,EAAE,EAAE;gBACb,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YACtC,CAAC;SACF,CAAC;QAEF,IAAI,IAAI,CAAC,UAAU,KAAK,QAAQ,EAAE,CAAC;YACjC,eAAe,mCACV,eAAe,KAClB,MAAM,EAAE,4BAA4B,GACrC,CAAC;QACJ,CAAC;QAED,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,EAAiB,EAAE,eAAe,CAAC,CAAC;IAC3D,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,IAAI,CAAC,WAAW;YAClD,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Event, EventEmitter, Host, h, Prop } from '@stencil/core';\nimport { SortableType } from './sortable-interface';\nimport Sortable from 'sortablejs';\n\n@Component({\n  tag: 'pds-sortable',\n  styleUrls: ['pds-sortable.scss'],\n  scoped: true,\n})\nexport class PdsSortable {\n  @Element() el: HTMLPdsSortableElement;\n\n  /**\n   * Event emitted when a sortable item is moved.\n   */\n  @Event() pdsSortableItemMoved: EventEmitter;\n\n  /**\n   * Determines whether `sortable` should have a border.\n   * @defaultValue false\n   */\n  @Prop({ reflect: true }) border = false;\n\n  /**\n   * A unique identifier used for the sortable container `id` attribute.\n   */\n  @Prop() componentId!: string;\n\n  /**\n   * Deternines whether `sortable` items should be divided with border.\n   */\n  @Prop({ reflect: true }) dividers = false;\n\n  /**\n   * Determines the grabbable area for the `pds-sortable-item`.\n   */\n  @Prop() handleType: 'handle' | 'row' = 'row';\n\n  private classNames() {\n    const classNames = ['pds-sortable'];\n\n    if (this.border) {\n      classNames.push('pds-sortable--bordered');\n    }\n\n    if (this.dividers) {\n      classNames.push('pds-sortable--divided');\n    }\n\n    if (this.handleType !== undefined) {\n      classNames.push(`pds-sortable--handle-type-${this.handleType}`);\n    }\n\n    return classNames.join('  ');\n  }\n\n  componentDidLoad() {\n\n    let sortableOptions: SortableType = {\n      animation: 150,\n      ghostClass: 'pds-sortable-item--ghost',\n      dragClass: 'pds-sortable-item--drag',\n      onEnd: (evt) => {\n        this.pdsSortableItemMoved.emit(evt);\n      },\n    };\n\n    if (this.handleType === 'handle') {\n      sortableOptions = {\n        ...sortableOptions,\n        handle: '.pds-sortable-item__handle',\n      };\n    }\n\n    Sortable.create(this.el as HTMLElement, sortableOptions);\n  }\n\n  render() {\n    return (\n      <Host class={this.classNames()} id={this.componentId}>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"]}

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

@@ -83,9 +83,9 @@ export class PdsSwitch {
         this.inheritedAttributes = Object.assign({}, inheritAriaAttributes(this.el));
     }
     render() {
-        return (h(Host, { key: 'ab8da77b752d017bafd9ce22daf8973967d4b063', class: this.switchClassNames(), "aria-disabled": this.disabled ? 'true' : null }, h("label", { key: '95245686f147a5b1a50540319ab4a6e87dd04451', htmlFor: this.componentId }, h("input", Object.assign({ key: 'f32fbaf3997fee37c645b7578d117f4f9ed8c23a', "aria-describedby": assignDescription(this.componentId, this.invalid, this.errorMessage || 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 }, this.inheritedAttributes)), h("span", { key: 'ff8441d3d043a4fd7f7f4d5fac659ca9ba7554a7', class: this.hideLabel ? 'visually-hidden' : '' }, this.label)), this.helperMessage &&
-            h("div", { key: '2a4ee4dbe651f76e782f9c20314b0d46aa6faf04', class: `pds-switch__message`, id: messageId(this.componentId, 'helper') }, this.helperMessage), this.errorMessage &&
-            h("div", { key: '58a3dfb0ca96cc90da7fc606152f63f23d41391d', class: `pds-switch__message pds-switch__message--error`, id: messageId(this.componentId, 'error'), "aria-live": "assertive" }, h("pds-icon", { key: 'e8db31c01ba78b986e3f746f11dddb8c28dbd6be', icon: danger, size: "small" }), this.errorMessage)));
+        return (h(Host, { key: 'bc66c138352b3de0330f5b725e043b4055bec2d6', class: this.switchClassNames(), "aria-disabled": this.disabled ? 'true' : null }, h("label", { key: 'c4e400efb2dd2701217bb1044f036d1a281d0001', htmlFor: this.componentId }, h("input", Object.assign({ key: '7b80961fb73cd330088f2c93d46475c1d1853da7', "aria-describedby": assignDescription(this.componentId, this.invalid, this.errorMessage || 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 }, this.inheritedAttributes)), h("span", { key: '318e23af1f6126302b8bb0bb8b9f12a0dc7f71b5', class: this.hideLabel ? 'visually-hidden' : '' }, this.label)), this.helperMessage &&
+            h("div", { key: 'd16fc523de5eacdd14dc4edce347e3be63edeb3e', class: `pds-switch__message`, id: messageId(this.componentId, 'helper') }, this.helperMessage), this.errorMessage &&
+            h("div", { key: '3c4ecef3cdb08568b0f52ed4af58a60c5f6ace62', class: `pds-switch__message pds-switch__message--error`, id: messageId(this.componentId, 'error'), "aria-live": "assertive" }, h("pds-icon", { key: 'ef58ca016b5e0cf63cb43591ec7b50e84b19595d', icon: danger, size: "small" }), this.errorMessage)));
     }
     static get is() { return "pds-switch"; }
     static get encapsulation() { return "shadow"; }
@@ -118,8 +118,8 @@ export class PdsSwitch {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "component-id",
-                "reflect": false
+                "reflect": false,
+                "attribute": "component-id"
             },
             "checked": {
                 "type": "boolean",
@@ -137,8 +137,8 @@ export class PdsSwitch {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "checked",
                 "reflect": false,
+                "attribute": "checked",
                 "defaultValue": "false"
             },
             "disabled": {
@@ -157,8 +157,8 @@ export class PdsSwitch {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "disabled",
                 "reflect": false,
+                "attribute": "disabled",
                 "defaultValue": "false"
             },
             "errorMessage": {
@@ -177,8 +177,8 @@ export class PdsSwitch {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "error-message",
-                "reflect": false
+                "reflect": false,
+                "attribute": "error-message"
             },
             "hideLabel": {
                 "type": "boolean",
@@ -196,8 +196,8 @@ export class PdsSwitch {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "hide-label",
-                "reflect": false
+                "reflect": false,
+                "attribute": "hide-label"
             },
             "helperMessage": {
                 "type": "string",
@@ -215,8 +215,8 @@ export class PdsSwitch {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "helper-message",
-                "reflect": false
+                "reflect": false,
+                "attribute": "helper-message"
             },
             "invalid": {
                 "type": "boolean",
@@ -234,8 +234,8 @@ export class PdsSwitch {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "invalid",
                 "reflect": false,
+                "attribute": "invalid",
                 "defaultValue": "false"
             },
             "label": {
@@ -254,8 +254,8 @@ export class PdsSwitch {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "label",
-                "reflect": false
+                "reflect": false,
+                "attribute": "label"
             },
             "name": {
                 "type": "string",
@@ -273,8 +273,8 @@ export class PdsSwitch {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "name",
-                "reflect": false
+                "reflect": false,
+                "attribute": "name"
             },
             "required": {
                 "type": "boolean",
@@ -292,8 +292,8 @@ export class PdsSwitch {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "required",
                 "reflect": false,
+                "attribute": "required",
                 "defaultValue": "false"
             },
             "value": {
@@ -312,8 +312,8 @@ export class PdsSwitch {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "value",
-                "reflect": false
+                "reflect": false,
+                "attribute": "value"
             }
         };
     }

package/dist/collection/components/pds-table/pds-table-body/pds-table-body.js

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
 export class PdsTableBody {
     render() {
-        return (h(Host, { key: '0f587d936a93187caa879ae07b9f54072e4b9aa2', role: "rowgroup", part: "body" }, h("slot", { key: '026fd33ac51c548fccd5465dfd675566e95fae33' })));
+        return (h(Host, { key: '7c9b15bea47bcede62a93ef11ee9dba093450ab9', role: "rowgroup", part: "body" }, h("slot", { key: 'fab0b2ca27185373cdb7b29d9cb1807b4097aea9' })));
     }
     static get is() { return "pds-table-body"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pds-table/pds-table-cell/pds-table-cell.js

@@ -94,11 +94,11 @@ export class PdsTableCell {
         return classNames.join(' ');
     }
     render() {
-        return (h(Host, { key: '5c3d35742f438d2bbb3bc9194e6bc0abf769e66f', class: this.classNames(), role: "gridcell", part: "cell", style: this.tableRef &&
+        return (h(Host, { key: 'b1c76cfb3fa26b7e59586cfd693380701c9146ff', class: this.classNames(), role: "gridcell", part: "cell", style: this.tableRef &&
                 this.tableRef.fixedColumn &&
                 this.tableRef.selectable
                 ? { '--fixed-cell-position': '40px' }
-                : {} }, h("slot", { key: 'dcc7fe8ffa481915dbe61bad294855a05d9e8aeb' })));
+                : {} }, h("slot", { key: '1a04730905bf7ad930141c1914f37dd7717570d8' })));
     }
     static get is() { return "pds-table-cell"; }
     static get encapsulation() { return "shadow"; }
@@ -130,8 +130,8 @@ export class PdsTableCell {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "cell-align",
-                "reflect": false
+                "reflect": false,
+                "attribute": "cell-align"
             },
             "truncate": {
                 "type": "boolean",
@@ -149,8 +149,8 @@ export class PdsTableCell {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "truncate",
-                "reflect": false
+                "reflect": false,
+                "attribute": "truncate"
             }
         };
     }

package/dist/collection/components/pds-table/pds-table-head/pds-table-head.js

@@ -32,7 +32,7 @@ export class PdsTableHead {
         }
     }
     render() {
-        return (h(Host, { key: '773bc9ea7631958d8ef6adcbdc862f47e4052687', role: "row", part: "head" }, this.tableRef && this.tableRef.selectable && (h("pds-table-head-cell", { key: 'b065650fb881746ce17cd702c51aecb1abe07898', part: this.tableRef.selectable ? 'checkbox-cell' : '' }, h("pds-checkbox", { key: 'eab146eb7bca6f4cf04cbd3adc5a90c76ede9ca1', componentId: this.generateUniqueId(), indeterminate: this.indeterminate, onInput: this.handleInput, label: "Select All Rows", hideLabel: true, checked: this.isSelected, part: "select-all-checkbox" }))), h("slot", { key: '5b18fb5c6e7f09cbff336e8922b39eacc34fa692' })));
+        return (h(Host, { key: '933e69ad28aaf0b899a8ee504088bc5b6396889d', role: "row", part: "head" }, this.tableRef && this.tableRef.selectable && (h("pds-table-head-cell", { key: 'a006c965a4e9bacb4b8e07b34799bab6a0bd482a', part: this.tableRef.selectable ? 'checkbox-cell' : '' }, h("pds-checkbox", { key: 'd7f94ac83be970b2c2ed334296971bc6762602e2', componentId: this.generateUniqueId(), indeterminate: this.indeterminate, onInput: this.handleInput, label: "Select All Rows", hideLabel: true, checked: this.isSelected, part: "select-all-checkbox" }))), h("slot", { key: '22edaaa12d31b2be1fd2835d6d4c2801386405af' })));
     }
     static get is() { return "pds-table-head"; }
     static get encapsulation() { return "shadow"; }
@@ -64,8 +64,8 @@ export class PdsTableHead {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "indeterminate",
-                "reflect": false
+                "reflect": false,
+                "attribute": "indeterminate"
             },
             "isSelected": {
                 "type": "boolean",
@@ -86,8 +86,8 @@ export class PdsTableHead {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "is-selected",
-                "reflect": false
+                "reflect": false,
+                "attribute": "is-selected"
             }
         };
     }

package/dist/collection/components/pds-table/pds-table-head-cell/pds-table-head-cell.js

@@ -118,11 +118,11 @@ export class PdsTableHeadCell {
         return classNames.join(' ');
     }
     render() {
-        return (h(Host, { key: '6ee9e95f9ccdaa15037875425e5512b5b5e2c540', class: this.classNames(), role: "columnheader", onClick: this.toggleSort, part: "head-cell", style: this.tableRef &&
+        return (h(Host, { key: '3d950a2997ef4c095d08f9c4e67b9a963fea093d', class: this.classNames(), role: "columnheader", onClick: this.toggleSort, part: "head-cell", style: this.tableRef &&
                 this.tableRef.fixedColumn &&
                 this.tableRef.selectable
                 ? { '--fixed-cell-position': '40px' }
-                : {} }, h("slot", { key: '9f6716080ff52e32ea65080f29102fd8111436bf' }), this.sortable && (h("pds-icon", { key: '538ea6761216c10f716e4d53b53bbcd69b73fd45', icon: this.sortingDirection === 'asc' ? upSmall : downSmall, part: "sort-icon" }))));
+                : {} }, h("slot", { key: '8ca7d4d169612e5ba237691d9a5ec9ed35610230' }), this.sortable && (h("pds-icon", { key: 'e2e214b39a1706d887bb34a0d4fc3f632e752306', icon: this.sortingDirection === 'asc' ? upSmall : downSmall, part: "sort-icon" }))));
     }
     static get is() { return "pds-table-head-cell"; }
     static get encapsulation() { return "shadow"; }
@@ -154,8 +154,8 @@ export class PdsTableHeadCell {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "cell-align",
-                "reflect": false
+                "reflect": false,
+                "attribute": "cell-align"
             },
             "sortable": {
                 "type": "boolean",
@@ -173,8 +173,8 @@ export class PdsTableHeadCell {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "sortable",
-                "reflect": false
+                "reflect": false,
+                "attribute": "sortable"
             }
         };
     }

package/dist/collection/components/pds-table/pds-table-row/pds-table-row.js

@@ -43,7 +43,7 @@ export class PdsTableRow {
         }
     }
     render() {
-        return (h(Host, { key: '5853e143e9866a596924b204c25d20a3983fc064', class: this.classNames(), role: "row", part: "row" }, this.tableRef && this.tableRef.selectable && (h("pds-table-cell", { key: '687d0a86e434d2422e794b14d0a9514b213c2afc', part: this.tableRef.fixedColumn ? 'checkbox-cell' : 'checkbox-cell', class: this.tableRef.selectable ? 'has-checkbox' : '' }, h("pds-checkbox", { key: '109474126dbf72c218a180985169ef608d7d0c40', componentId: this.generateUniqueId(), onClick: this.handleClick, indeterminate: this.indeterminate, label: "Select Row", hideLabel: true, checked: this.isSelected, part: "row-checkbox" }))), h("slot", { key: 'e685aa96c44d590ddf0d1d1842f8e672c11cadcb' })));
+        return (h(Host, { key: 'cffeb199c48f2a06af70a2e5a5b41a21649c24c7', class: this.classNames(), role: "row", part: "row" }, this.tableRef && this.tableRef.selectable && (h("pds-table-cell", { key: '02a80cd54efe360550e636f7bc0f11e3de59af1c', part: this.tableRef.fixedColumn ? 'checkbox-cell' : 'checkbox-cell', class: this.tableRef.selectable ? 'has-checkbox' : '' }, h("pds-checkbox", { key: 'a8cd6c303ec35f71e0a97f130c5d53a2e81a3e4a', componentId: this.generateUniqueId(), onClick: this.handleClick, indeterminate: this.indeterminate, label: "Select Row", hideLabel: true, checked: this.isSelected, part: "row-checkbox" }))), h("slot", { key: '820a502627ffc329f650f7f0110e34ae3f096357' })));
     }
     static get is() { return "pds-table-row"; }
     static get encapsulation() { return "shadow"; }
@@ -75,8 +75,8 @@ export class PdsTableRow {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "indeterminate",
-                "reflect": false
+                "reflect": false,
+                "attribute": "indeterminate"
             },
             "isSelected": {
                 "type": "boolean",
@@ -94,8 +94,8 @@ export class PdsTableRow {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "is-selected",
-                "reflect": false
+                "reflect": false,
+                "attribute": "is-selected"
             }
         };
     }

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

@@ -217,8 +217,8 @@ export class PdsTable {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "compact",
-                "reflect": false
+                "reflect": false,
+                "attribute": "compact"
             },
             "componentId": {
                 "type": "string",
@@ -236,8 +236,8 @@ export class PdsTable {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "component-id",
-                "reflect": false
+                "reflect": false,
+                "attribute": "component-id"
             },
             "responsive": {
                 "type": "boolean",
@@ -255,8 +255,8 @@ export class PdsTable {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "responsive",
-                "reflect": false
+                "reflect": false,
+                "attribute": "responsive"
             },
             "fixedColumn": {
                 "type": "boolean",
@@ -274,8 +274,8 @@ export class PdsTable {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "fixed-column",
-                "reflect": false
+                "reflect": false,
+                "attribute": "fixed-column"
             },
             "selectable": {
                 "type": "boolean",
@@ -293,8 +293,8 @@ export class PdsTable {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "selectable",
-                "reflect": false
+                "reflect": false,
+                "attribute": "selectable"
             }
         };
     }