@pine-ds/core 4.12.0 → 5.0.0

package/dist/cjs/pds-dropdown-menu-separator.cjs.entry.js

@@ -15,7 +15,7 @@ const PdsDropdownMenuSeparator = class {
         this.disabled = false;
     }
     render() {
-        return (index.h(index.Host, { key: '74a214d61042d5759af5aef9d6410ed1a267083c', id: this.componentId }, index.h("hr", { key: 'c521eda51523fce09bd408af2586645fc9a9cd03' })));
+        return (index.h(index.Host, { key: '247de1e84622fc816f541e95da022c7d07b3852c' }, index.h("hr", { key: 'd66e06eee972fa962003152a4ec7703d7c66d620' })));
     }
 };
 PdsDropdownMenuSeparator.style = pdsDropdownMenuSeparatorCss();

package/dist/cjs/pds-dropdown-menu.cjs.entry.js

@@ -444,7 +444,7 @@ const PdsDropdownMenu = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '1776921b263178df0de2cdf07a9fb81c668381b6', id: this.componentId }, index.h("slot", { key: '952fdc2b6bb3f1fca5a17dc1962af0e4c38f92e2', name: "trigger", onSlotchange: this.handleTriggerSlotChange }), index.h("pds-box", { key: 'f5f95cebdcf4a4d78d0e4bc47b99c681045f8d38', "border-radius": "sm", display: "flex", direction: "column", class: "pds-dropdown-menu--panel is-hidden", shadow: "100", part: "menu-panel" }, index.h("div", { key: '8bff8a8dd06fe1f433bc512bc0ac9030fc9714e7', class: { 'pds-dropdown-menu__header': true, 'is-hidden': !this.hasHeader } }, index.h("slot", { key: '1c248f137414dd00037d333b1e07c6b04a7b079d', name: "header", onSlotchange: this.handleHeaderSlotChange })), index.h("div", { key: 'db9954f26762a65e762f8c7b3dfd60e363ff8573', class: "pds-dropdown-menu__items", role: "menu", "aria-orientation": "vertical" }, index.h("slot", { key: 'd5cb929db03966d673b23de150970744936cf26d', onSlotchange: this.handleSlotChange })))));
+        return (index.h(index.Host, { key: '3baa07d7761a581606704b5e79e68d7bc585ff36' }, index.h("slot", { key: '527afc60b7b6f7c869c62924fd00791de2538955', name: "trigger", onSlotchange: this.handleTriggerSlotChange }), index.h("pds-box", { key: '2efeff541331bc0b39ed271984c680e14892ed0b', "border-radius": "sm", display: "flex", direction: "column", class: "pds-dropdown-menu--panel is-hidden", shadow: "100", part: "menu-panel" }, index.h("div", { key: '591d61a9c12e10aef64638f1f51073321bddae69', class: { 'pds-dropdown-menu__header': true, 'is-hidden': !this.hasHeader } }, index.h("slot", { key: 'c3a7fd69e0074be99508ae6b6c14bbd78fbc1f03', name: "header", onSlotchange: this.handleHeaderSlotChange })), index.h("div", { key: '84c4f0cb77eadc86a5bb2b59c4b33f8691d2adfb', class: "pds-dropdown-menu__items", role: "menu", "aria-orientation": "vertical" }, index.h("slot", { key: '8c16bfd158a2be6009545562940c38ca433e1c47', onSlotchange: this.handleSlotChange })))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -503,7 +503,7 @@ const PdsFilter = class {
         return null;
     }
     render() {
-        return (index.h(index.Host, { key: '0876855dacf0172f83a6e1afcc8b9b1b6acf1251', id: this.componentId }, index.h("button", { key: 'e20b93644a520ed3351fb5802d1e6f0cb2465248', class: this.getTriggerClasses(), type: "button", popoverTarget: this.variant !== 'clear' ? `${this.componentId}-popover` : undefined, popoverTargetAction: this.variant !== 'clear' ? 'toggle' : undefined, onKeyDown: this.variant === 'clear' ? this.handleKeyDown : undefined, onClick: (event) => this.handleClick(event), part: "button", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": this.variant !== 'clear' ? 'true' : undefined, "aria-controls": this.variant !== 'clear' ? `${this.componentId}-popover` : undefined }, index.h("span", { key: '075e2f221d297ede0a52185853acbd3e74b99339', class: "pds-filter__button-content", part: "button-content" }, this.renderIcon(), this.text && (index.h("span", { key: 'cd1d3a15e0969c3d960786a7fd7fd7b3195dd4de', class: "pds-filter__button-text", part: "button-text" }, this.text)), this.renderDropdownIcon())), this.variant !== 'clear' && (index.h("div", { key: '6524cb11b96f03ef5c528325a950c9f80f5ae9fa', ref: el => this.popoverEl = el, id: `${this.componentId}-popover`, class: "pds-filter__popover", popover: "auto", part: "popover" }, index.h("slot", { key: '06cc2ca22068ccedbddf3ff69ce4a352fd01d142' })))));
+        return (index.h(index.Host, { key: 'ae727227de30a285588182dce73fa4867e66bb89' }, index.h("button", { key: '45ff52e203ff936d42c9ba037066756035d74d98', class: this.getTriggerClasses(), type: "button", popoverTarget: this.variant !== 'clear' ? `${this.componentId}-popover` : undefined, popoverTargetAction: this.variant !== 'clear' ? 'toggle' : undefined, onKeyDown: this.variant === 'clear' ? this.handleKeyDown : undefined, onClick: (event) => this.handleClick(event), part: "button", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": this.variant !== 'clear' ? 'true' : undefined, "aria-controls": this.variant !== 'clear' ? `${this.componentId}-popover` : undefined }, index.h("span", { key: '05fb0de22068e9fcc79d8903a617513db0d71da1', class: "pds-filter__button-content", part: "button-content" }, this.renderIcon(), this.text && (index.h("span", { key: '4589b7fc0aed1ab3d7e6c06fea123553d2b77a3e', class: "pds-filter__button-text", part: "button-text" }, this.text)), this.renderDropdownIcon())), this.variant !== 'clear' && (index.h("div", { key: '4cbad5c76e8e28eb4a09d4a2c8a3d7c30024f114', ref: el => this.popoverEl = el, id: `${this.componentId}-popover`, class: "pds-filter__popover", popover: "auto", part: "popover" }, index.h("slot", { key: 'c915f596e9d9efe1a7b1bd2edcf9b704d986438d' })))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -10,7 +10,7 @@ const PdsFilters = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '6f785fc222e3b5b7cf932f704b56aa7f1f52ead3', id: this.componentId }, index.h("div", { key: '0ffd2894cdeb1e632228b4c3fa523069dcffa4b2', class: "pds-filters" }, index.h("slot", { key: 'a3f42dedcda1b0fec78a33793d085791d9b9fc5c' }))));
+        return (index.h(index.Host, { key: '4a5ed2d7e80d82be9517682ee66e464fa61ea45b' }, index.h("div", { key: '7cabd4f934c17b14268c28f9ce99e8900795c516', class: "pds-filters" }, index.h("slot", { key: 'a1d01f1be8885c3cf68f98df59d67f56709f00e8' }))));
     }
 };
 PdsFilters.style = pdsFiltersCss();

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

@@ -155,10 +155,10 @@ const PdsImage = class {
         const ratioStyle = hasRatio
             ? { aspectRatio: this.imageRatio(), objectFit: this.fit }
             : undefined;
-        return (index.h(index.Host, { key: 'cbc53c10c1ace7c37e3210f2a9f94043d6cd6e0c', class: {
+        return (index.h(index.Host, { key: 'f01ae0cef8a08b686a62affe14e58661115f1e2e', class: {
                 'pds-image': true,
                 'pds-image--has-ratio': hasRatio,
-            }, id: this.componentId }, index.h("img", { key: '139dbcebc7a71aa237deb8e2d7281abd40488096', alt: this.alt, height: this.height, loading: this.loading, sizes: this.sizes, src: this.src, srcset: this.srcset, style: ratioStyle, width: this.width, onLoad: this.emitLoad, onError: this.emitError, ref: (el) => (this.imageEl = el) })));
+            } }, index.h("img", { key: '3e609d3b73154ea5c83ae2df58352b0021075373', alt: this.alt, height: this.height, loading: this.loading, sizes: this.sizes, src: this.src, srcset: this.srcset, style: ratioStyle, width: this.width, onLoad: this.emitLoad, onError: this.emitError, ref: (el) => (this.imageEl = el) })));
     }
     static get watchers() { return {
         "src": [{

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

@@ -10,7 +10,7 @@ var truncationTooltip = require('./truncation-tooltip-CM5HgRHh.js');
 require('./keep-hydrated-AKoh0DG4.js');
 require('./portal-target-e8WQ6dLx.js');
 
-const pdsMultiselectCss = () => `:host{display:block}:host([aria-disabled=true]) .pds-multiselect__trigger{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}:host([aria-disabled=true]) .pds-multiselect__icon{color:var(--pine-color-text-disabled)}.pds-multiselect{position:relative}.pds-multiselect__label{color:var(--pine-color-text-label);display:block;font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-multiselect__wrapper{position:relative}.pds-multiselect__trigger{-ms-flex-align:center;align-items:center;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-125);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body);gap:var(--pine-dimension-xs);-ms-flex-pack:justify;justify-content:space-between;letter-spacing:var(--pine-letter-spacing);min-height:var(--pine-dimension-450);padding:var(--pine-dimension-xs) var(--pine-dimension-sm);position:relative;text-align:start;-webkit-transition:border-color var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, box-shadow var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;width:100%}.pds-multiselect__trigger:hover:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-hover)}.pds-multiselect__trigger:focus:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-multiselect__trigger.pds-multiselect__trigger--open{border-color:var(--pine-color-border-active)}.pds-multiselect__trigger.pds-multiselect__trigger--invalid{background-color:var(--pine-color-red-050);border-color:var(--pine-color-border-danger)}.pds-multiselect__trigger.pds-multiselect__trigger--invalid:focus{outline-color:var(--pine-color-focus-ring-danger)}.pds-multiselect__trigger.pds-multiselect__trigger--disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}.pds-multiselect__trigger-text{color:var(--pine-color-text-strong);-ms-flex:1;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-multiselect__trigger-text.pds-multiselect__trigger-text--placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__trigger--disabled .pds-multiselect__trigger-text{color:var(--pine-color-text-disabled)}.pds-multiselect__icon{color:var(--pine-color-icon);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__pill-list{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-2xs)}.pds-multiselect__pill-list--inline{-ms-flex:1;flex:1;min-width:0}.pds-multiselect__pill-list--below{-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-multiselect__pill-overflow{color:var(--pine-color-text-muted);font:var(--pine-typography-body-sm-medium);white-space:nowrap}.pds-multiselect__trigger--pill-inline{-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-2xs);min-height:var(--pine-dimension-450);padding:var(--pine-dimension-2xs) var(--pine-dimension-sm)}.pds-multiselect__trigger--pill-inline.pds-multiselect__trigger--open{border-color:var(--pine-color-border-active)}.pds-multiselect__trigger--pill-inline:focus-within:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-multiselect__trigger--pill-inline.pds-multiselect__trigger--invalid:focus-within{outline-color:var(--pine-color-focus-ring-danger)}.pds-multiselect__pill-toggle{-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border-width:0;cursor:pointer;display:-ms-flexbox;display:flex;padding:0}.pds-multiselect__pill-toggle:focus{outline:3px solid transparent}.pds-multiselect__trigger--disabled .pds-multiselect__pill-toggle{cursor:not-allowed;pointer-events:none}.pds-multiselect__panel{background:var(--pine-color-background-overlay);border-radius:var(--pine-dimension-125);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;position:fixed;z-index:var(--pine-z-index-raised)}.pds-multiselect__search{-ms-flex-align:center;align-items:center;-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-active);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-multiselect__search pds-icon{color:var(--pine-color-text-muted);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__search-input{background:transparent;border:var(--pine-dimension-none);color:var(--pine-color-text-strong);-ms-flex:1;flex:1;font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);min-width:var(--pine-dimension-none);outline:none}.pds-multiselect__search-input::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__selected-section{-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-subtle);padding:var(--pine-dimension-xs)}.pds-multiselect__selected-list{list-style:none;margin:var(--pine-dimension-none);padding:var(--pine-dimension-none)}.pds-multiselect__selected-item{color:var(--pine-color-text-strong);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);overflow:hidden;padding:var(--pine-dimension-2xs) var(--pine-dimension-xs);text-overflow:ellipsis;white-space:nowrap}.pds-multiselect__listbox{background:transparent;border:var(--pine-dimension-none);-webkit-box-sizing:border-box;box-sizing:border-box;list-style:none;margin:var(--pine-dimension-none);overflow-y:auto;padding:var(--pine-dimension-xs)}.pds-multiselect__group-header{color:var(--pine-color-text-muted);display:block;font:var(--pine-typography-body-sm-medium);letter-spacing:var(--pine-letter-spacing);padding:var(--pine-dimension-sm) var(--pine-dimension-xs) var(--pine-dimension-2xs);text-transform:uppercase}.pds-multiselect__listbox>li:first-child>.pds-multiselect__group-header{-webkit-padding-before:var(--pine-dimension-xs);padding-block-start:var(--pine-dimension-xs)}.pds-multiselect__group-list{list-style:none;margin:var(--pine-dimension-none);padding:var(--pine-dimension-none)}.pds-multiselect__option{-ms-flex-align:center;align-items:center;background:transparent;border-radius:var(--pine-dimension-xs);cursor:pointer;display:-ms-flexbox;display:flex;padding:var(--pine-dimension-2xs) var(--pine-dimension-xs);-webkit-transition:background 0.15s;transition:background 0.15s}.pds-multiselect__option pds-checkbox{min-width:var(--pine-dimension-none);pointer-events:none;width:100%}.pds-multiselect__option pds-chip{pointer-events:auto}.pds-multiselect__option:hover:not(.pds-multiselect__option--disabled),.pds-multiselect__option.pds-multiselect__option--highlighted:not(.pds-multiselect__option--disabled){background:var(--pine-color-background-muted)}.pds-multiselect__option.pds-multiselect__option--disabled{cursor:not-allowed;opacity:0.5}.pds-multiselect__option:focus-visible{outline:var(--pine-dimension-none)}.pds-multiselect__option-action{-ms-flex-align:center;align-items:center;block-size:var(--pine-dimension-md);color:var(--pine-color-icon);cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;inline-size:var(--pine-dimension-md);-ms-flex-pack:center;justify-content:center;-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}.pds-multiselect__create-option{color:var(--pine-color-text-strong);width:100%}.pds-multiselect__create-option pds-icon{color:var(--pine-color-text-muted);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__empty,.pds-multiselect__loading{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-muted);display:-ms-flexbox;display:flex;font:var(--pine-typography-body);-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-sm)}.pds-multiselect__load-more{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-xs)}.pds-multiselect__footer{-webkit-border-before:var(--pine-border);border-block-start:var(--pine-border);border-block-start-color:var(--pine-color-border-subtle);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-multiselect__helper{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs);-webkit-margin-start:var(--pine-dimension-none);margin-inline-start:var(--pine-dimension-none)}.pds-multiselect__error{-ms-flex-align:start;align-items:flex-start;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;font:var(--pine-typography-body-sm-medium);gap:var(--pine-dimension-2xs);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs);-webkit-margin-start:var(--pine-dimension-none);margin-inline-start:var(--pine-dimension-none)}.pds-multiselect__error pds-icon{-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none);-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.visually-hidden{border:var(--pine-dimension-none);clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:var(--pine-dimension-none);position:absolute;white-space:nowrap;width:1px}`;
+const pdsMultiselectCss = () => `:host{display:block}:host([aria-disabled=true]) .pds-multiselect__trigger{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}:host([aria-disabled=true]) .pds-multiselect__icon{color:var(--pine-color-text-disabled)}.pds-multiselect{position:relative}.pds-multiselect__label{color:var(--pine-color-text-label);display:block;font:var(--pine-typography-body-medium);letter-spacing:var(--pine-letter-spacing);-webkit-margin-after:var(--pine-dimension-2xs);margin-block-end:var(--pine-dimension-2xs)}.pds-multiselect__wrapper{position:relative}.pds-multiselect__trigger{-ms-flex-align:center;align-items:center;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-125);cursor:pointer;display:-ms-flexbox;display:flex;font:var(--pine-typography-body);gap:var(--pine-dimension-xs);-ms-flex-pack:justify;justify-content:space-between;letter-spacing:var(--pine-letter-spacing);min-height:var(--pine-dimension-450);padding:var(--pine-dimension-xs) var(--pine-dimension-sm);position:relative;text-align:start;-webkit-transition:border-color var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, box-shadow var(--pine-motion-duration-base) ease;transition:border-color var(--pine-motion-duration-base) ease, box-shadow var(--pine-motion-duration-base) ease, -webkit-box-shadow var(--pine-motion-duration-base) ease;width:100%}.pds-multiselect__trigger:hover:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-hover)}.pds-multiselect__trigger:focus:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-multiselect__trigger.pds-multiselect__trigger--open{border-color:var(--pine-color-border-active)}.pds-multiselect__trigger.pds-multiselect__trigger--invalid{background-color:var(--pine-color-red-050);border-color:var(--pine-color-border-danger)}.pds-multiselect__trigger.pds-multiselect__trigger--invalid:focus{outline-color:var(--pine-color-focus-ring-danger)}.pds-multiselect__trigger.pds-multiselect__trigger--disabled{background:var(--pine-color-background-container-disabled);border-color:var(--pine-color-border-disabled);color:var(--pine-color-text-disabled);cursor:not-allowed}.pds-multiselect__trigger-label{display:grid;-ms-flex:1;flex:1;grid-template-columns:minmax(0, 1fr);min-width:0}.pds-multiselect__trigger-sizer{grid-area:1/1;overflow:hidden;visibility:hidden;white-space:nowrap}.pds-multiselect__trigger-label>.pds-multiselect__trigger-text{contain:inline-size;grid-area:1/1}.pds-multiselect__trigger-text{color:var(--pine-color-text-strong);-ms-flex:1;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-multiselect__trigger-text.pds-multiselect__trigger-text--placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__trigger--disabled .pds-multiselect__trigger-text{color:var(--pine-color-text-disabled)}.pds-multiselect__icon{color:var(--pine-color-icon);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__pill-list{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-2xs)}.pds-multiselect__pill-list--inline{-ms-flex:1;flex:1;min-width:0}.pds-multiselect__pill-list--below{-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs)}.pds-multiselect__pill-overflow{color:var(--pine-color-text-muted);font:var(--pine-typography-body-sm-medium);white-space:nowrap}.pds-multiselect__trigger--pill-inline{-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-2xs);min-height:var(--pine-dimension-450);padding:var(--pine-dimension-2xs) var(--pine-dimension-sm)}.pds-multiselect__trigger--pill-inline.pds-multiselect__trigger--open{border-color:var(--pine-color-border-active)}.pds-multiselect__trigger--pill-inline:focus-within:not(.pds-multiselect__trigger--disabled){border-color:var(--pine-color-border-active);outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}.pds-multiselect__trigger--pill-inline.pds-multiselect__trigger--invalid:focus-within{outline-color:var(--pine-color-focus-ring-danger)}.pds-multiselect__pill-toggle{-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border-width:0;cursor:pointer;display:-ms-flexbox;display:flex;padding:0}.pds-multiselect__pill-toggle:focus{outline:3px solid transparent}.pds-multiselect__trigger--disabled .pds-multiselect__pill-toggle{cursor:not-allowed;pointer-events:none}.pds-multiselect__panel{background:var(--pine-color-background-overlay);border-radius:var(--pine-dimension-125);-webkit-box-shadow:var(--pine-box-shadow);box-shadow:var(--pine-box-shadow);-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;position:fixed;z-index:var(--pine-z-index-raised)}.pds-multiselect__search{-ms-flex-align:center;align-items:center;-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-active);display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-multiselect__search pds-icon{color:var(--pine-color-text-muted);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__search-input{background:transparent;border:var(--pine-dimension-none);color:var(--pine-color-text-strong);-ms-flex:1;flex:1;font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);min-width:var(--pine-dimension-none);outline:none}.pds-multiselect__search-input::-webkit-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::-moz-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input:-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::-ms-input-placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__search-input::placeholder{color:var(--pine-color-text-placeholder)}.pds-multiselect__selected-section{-webkit-border-after:var(--pine-border);border-block-end:var(--pine-border);border-block-end-color:var(--pine-color-border-subtle);padding:var(--pine-dimension-xs)}.pds-multiselect__selected-list{list-style:none;margin:var(--pine-dimension-none);padding:var(--pine-dimension-none)}.pds-multiselect__selected-item{color:var(--pine-color-text-strong);font:var(--pine-typography-body);letter-spacing:var(--pine-letter-spacing);overflow:hidden;padding:var(--pine-dimension-2xs) var(--pine-dimension-xs);text-overflow:ellipsis;white-space:nowrap}.pds-multiselect__listbox{background:transparent;border:var(--pine-dimension-none);-webkit-box-sizing:border-box;box-sizing:border-box;list-style:none;margin:var(--pine-dimension-none);overflow-y:auto;padding:var(--pine-dimension-xs)}.pds-multiselect__group-header{color:var(--pine-color-text-muted);display:block;font:var(--pine-typography-body-sm-medium);letter-spacing:var(--pine-letter-spacing);padding:var(--pine-dimension-sm) var(--pine-dimension-sm) var(--pine-dimension-2xs);text-transform:uppercase}.pds-multiselect__listbox>li:first-child>.pds-multiselect__group-header{-webkit-padding-before:var(--pine-dimension-xs);padding-block-start:var(--pine-dimension-xs)}.pds-multiselect__group-list{list-style:none;margin:var(--pine-dimension-none);padding:var(--pine-dimension-none)}.pds-multiselect__option{-ms-flex-align:center;align-items:center;background:transparent;border-radius:var(--pine-dimension-xs);cursor:pointer;display:-ms-flexbox;display:flex;padding:var(--pine-dimension-xs) var(--pine-dimension-sm);-webkit-transition:background 0.15s;transition:background 0.15s}.pds-multiselect__option pds-checkbox{min-width:var(--pine-dimension-none);pointer-events:none;width:100%}.pds-multiselect__option pds-chip{pointer-events:auto}.pds-multiselect__option:hover:not(.pds-multiselect__option--disabled),.pds-multiselect__option.pds-multiselect__option--highlighted:not(.pds-multiselect__option--disabled){background:var(--pine-color-background-muted)}.pds-multiselect__option.pds-multiselect__option--disabled{cursor:not-allowed;opacity:0.5}.pds-multiselect__option:focus-visible{outline:var(--pine-dimension-none)}.pds-multiselect__option-action{-ms-flex-align:center;align-items:center;block-size:var(--pine-dimension-md);color:var(--pine-color-icon);cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;inline-size:var(--pine-dimension-md);-ms-flex-pack:center;justify-content:center;-webkit-margin-start:var(--pine-dimension-xs);margin-inline-start:var(--pine-dimension-xs)}.pds-multiselect__create-option{color:var(--pine-color-text-strong);width:100%}.pds-multiselect__create-option pds-icon{color:var(--pine-color-text-muted);-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none)}.pds-multiselect__empty,.pds-multiselect__loading{-ms-flex-align:center;align-items:center;color:var(--pine-color-text-muted);display:-ms-flexbox;display:flex;font:var(--pine-typography-body);-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-sm)}.pds-multiselect__load-more{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;padding:var(--pine-dimension-xs)}.pds-multiselect__footer{-webkit-border-before:var(--pine-border);border-block-start:var(--pine-border);border-block-start-color:var(--pine-color-border-subtle);padding:var(--pine-dimension-xs) var(--pine-dimension-sm)}.pds-multiselect__helper{color:var(--pine-color-text-message);font:var(--pine-typography-body-sm-medium);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs);-webkit-margin-start:var(--pine-dimension-none);margin-inline-start:var(--pine-dimension-none)}.pds-multiselect__error{-ms-flex-align:start;align-items:flex-start;color:var(--pine-color-text-message-danger);display:-ms-flexbox;display:flex;font:var(--pine-typography-body-sm-medium);gap:var(--pine-dimension-2xs);-webkit-margin-before:var(--pine-dimension-2xs);margin-block-start:var(--pine-dimension-2xs);-webkit-margin-start:var(--pine-dimension-none);margin-inline-start:var(--pine-dimension-none)}.pds-multiselect__error pds-icon{-ms-flex-negative:var(--pine-dimension-none);flex-shrink:var(--pine-dimension-none);-webkit-margin-before:var(--pine-dimension-025);margin-block-start:var(--pine-dimension-025)}.visually-hidden{border:var(--pine-dimension-none);clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:var(--pine-dimension-none);position:absolute;white-space:nowrap;width:1px}`;
 
 // Names only: pds-icon's `icon` prop also fetches URLs and data: SVGs, unsanitized.
 const PINE_ICON_NAME = /^[a-z0-9-]+$/i;
@@ -92,6 +92,7 @@ const PdsMultiselect = class {
         this.pillRemoveLabel = 'Remove';
         /**
          * Singular form of the selected-count trigger text. Pass a translated string to localize it; `{count}` is interpolated.
+         * A single selection shows the item's name instead, so this applies to other counts that a locale's plural rules treat as singular, and to a single selection whose item has no text.
          * @defaultValue '{count} item'
          */
         this.selectedCountLabelOne = '{count} item';
@@ -147,8 +148,9 @@ const PdsMultiselect = class {
         this.hideSelectedItems = false;
         /**
          * Display mode for selected items outside the dropdown panel.
-         * `'count'` shows "N item(s)" text in the trigger (default). `'pill'` renders
-         * selected items as dismissible pds-chip tags.
+         * `'count'` shows the item's name in the trigger when one is selected and
+         * "N items" text otherwise (default). `'pill'` renders selected items as
+         * dismissible pds-chip tags.
          * @default 'count'
          */
         this.selectedDisplay = 'count';
@@ -1281,6 +1283,7 @@ const PdsMultiselect = class {
         return (index.h("div", { class: "pds-multiselect__pill-list pds-multiselect__pill-list--below", "aria-label": this.selectedItemsLabel }, this.selectedItems.map(item => (index.h("pds-chip", { key: String(item.id), "component-id": `${this.componentId}-pill-${item.id}`, variant: variant, size: "md", sentiment: "neutral", "dismiss-label": this.pillRemoveLabel, onPdsTagCloseClick: this.handlePillRemove(item) }, item.text)))));
     }
     getTriggerText() {
+        var _a;
         const count = this.selectedItems.length;
         if (count === 0 || (this.selectedDisplay === 'pill' && this.pillPosition === 'below')) {
             // Fall back to a non-empty string: the trigger's accessible name comes from
@@ -1288,8 +1291,24 @@ const PdsMultiselect = class {
             // (WCAG 4.1.2). The prop is localizable; this last-resort default is not.
             return this.placeholder || 'Select...';
         }
+        // One selection shows its name; the count only says something once there's more than one.
+        // An option without text still falls back to the count, so the trigger is never nameless.
+        if (count === 1 && ((_a = this.selectedItems[0].text) === null || _a === void 0 ? void 0 : _a.trim())) {
+            return this.selectedItems[0].text;
+        }
         return i18nFormat.pluralize(this.el, count, this.resolveCountForms());
     }
+    /**
+     * The text that sets the trigger's width. A single selection's name could be any length, so the
+     * trigger keeps the width the count would give it and the name truncates inside that, rather than
+     * widening a multiselect that has no width of its own.
+     */
+    getTriggerSizerText() {
+        const text = this.getTriggerText();
+        const count = this.selectedItems.length;
+        const showsName = count === 1 && text === this.selectedItems[0].text && !(this.selectedDisplay === 'pill' && this.pillPosition === 'below');
+        return showsName ? i18nFormat.pluralize(this.el, count, this.resolveCountForms()) : text;
+    }
     /**
      * The `one`/`other` props are the ergonomic English defaults; `selectedCountLabels`
      * (object or JSON-string attribute) layers full CLDR forms on top for locales
@@ -1316,10 +1335,10 @@ const PdsMultiselect = class {
     }
     render() {
         const hasSelections = this.selectedItems.length > 0;
-        return (index.h(index.Host, { key: '2e5f7188cbb3928df3098644f9437449f5d5128d', "aria-disabled": this.disabled ? 'true' : null }, index.h("div", { key: 'f6b7d9d70e7635510bbcff648e1547c9cc222005', class: "pds-multiselect", onFocusout: this.handleContainerFocusOut }, this.label && (index.h("label", { key: '9e3f0bc63e20e0a1f03f87f4b89c478331bf4001', id: `${this.componentId}-label`, htmlFor: this.componentId, class: {
+        return (index.h(index.Host, { key: '12298f9692ac8644230195cc1abe0e26bb5715a9', "aria-disabled": this.disabled ? 'true' : null }, index.h("div", { key: '5d98f9edae2f471d9662c65454fbef7b2dec83e1', class: "pds-multiselect", onFocusout: this.handleContainerFocusOut }, this.label && (index.h("label", { key: '2f6d4162d0649978bc53c34327b6149dc971fd4c', id: `${this.componentId}-label`, htmlFor: this.componentId, class: {
                 'pds-multiselect__label': true,
                 'visually-hidden': this.hideLabel,
-            } }, this.label)), index.h("div", { key: 'efdf274b7223f77d646ac838f4163291ae310c31', class: "pds-multiselect__wrapper", ref: el => (this.containerEl = el), style: { width: this.triggerWidth } }, this.slottedTriggerEl ? (index.h("slot", { name: "trigger" })) : this.selectedDisplay === 'pill' && this.pillPosition === 'inline' ? (index.h("div", { ref: el => (this.pillInlineTriggerEl = el || undefined), part: "trigger", class: {
+            } }, this.label)), index.h("div", { key: '7a337e876c8fff854e5b9a067ef89b9d5136df4f', class: "pds-multiselect__wrapper", ref: el => (this.containerEl = el), style: { width: this.triggerWidth } }, this.slottedTriggerEl ? (index.h("slot", { name: "trigger" })) : this.selectedDisplay === 'pill' && this.pillPosition === 'inline' ? (index.h("div", { ref: el => (this.pillInlineTriggerEl = el || undefined), part: "trigger", class: {
                 'pds-multiselect__trigger': true,
                 'pds-multiselect__trigger--open': this.isOpen,
                 'pds-multiselect__trigger--disabled': this.disabled,
@@ -1332,10 +1351,10 @@ const PdsMultiselect = class {
                 'pds-multiselect__trigger--disabled': this.disabled,
                 'pds-multiselect__trigger--invalid': this.invalid || !!this.errorMessage,
                 'pds-multiselect__trigger--has-value': hasSelections,
-            }, id: this.componentId, disabled: this.disabled, "aria-required": this.required ? 'true' : undefined, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": "listbox", "aria-describedby": form.assignDescription(this.componentId, this.invalid || !!this.errorMessage, this.helperMessage, this.errorMessage), "aria-invalid": this.invalid || !!this.errorMessage ? 'true' : undefined, onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeyDown }, index.h("span", { class: {
+            }, id: this.componentId, disabled: this.disabled, "aria-required": this.required ? 'true' : undefined, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": "listbox", "aria-describedby": form.assignDescription(this.componentId, this.invalid || !!this.errorMessage, this.helperMessage, this.errorMessage), "aria-invalid": this.invalid || !!this.errorMessage ? 'true' : undefined, onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeyDown }, index.h("span", { class: "pds-multiselect__trigger-label" }, index.h("span", { class: "pds-multiselect__trigger-sizer", "aria-hidden": "true" }, this.getTriggerSizerText()), index.h("span", { class: {
                 'pds-multiselect__trigger-text': true,
                 'pds-multiselect__trigger-text--placeholder': !hasSelections || (this.selectedDisplay === 'pill' && this.pillPosition === 'below'),
-            } }, this.getTriggerText()), index.h("pds-icon", { "aria-hidden": "true", class: "pds-multiselect__icon", icon: index$1.enlarge }))), this.renderDropdown()), this.selectedDisplay === 'pill' && this.pillPosition === 'below' && this.renderBelowPills(), index.h("span", { key: 'd90262ab6971d16dab6f8a367d038ab2607d888c', class: "visually-hidden", "aria-live": "polite", "aria-atomic": "true" }, this.removalAnnouncement), this.helperMessage && !(this.errorMessage && this.errorMessage.length > 0) && (index.h("p", { key: '4baf142546462bea84ccb67b7ce288517f1de754', class: "pds-multiselect__helper", id: form.messageId(this.componentId, 'helper') }, this.helperMessage)), this.errorMessage && (index.h("p", { key: 'fdea175d93bc566d18cbad560e970f8c61495b1d', class: "pds-multiselect__error", id: form.messageId(this.componentId, 'error') }, index.h("pds-icon", { key: '63977a25e35def8a6a4b39b0039e2da08f99d02e', "aria-hidden": "true", icon: index$1.danger, size: "small" }), this.errorMessage)), index.h("div", { key: 'cb43771ef04a682a6d14d80b0b37618acc5748ad', style: { display: 'none' } }, index.h("slot", { key: '7733626ae7bd4ba83cb30bbbdb81c28e413e46a3' })))));
+            } }, this.getTriggerText())), index.h("pds-icon", { "aria-hidden": "true", class: "pds-multiselect__icon", icon: index$1.enlarge }))), this.renderDropdown()), this.selectedDisplay === 'pill' && this.pillPosition === 'below' && this.renderBelowPills(), index.h("span", { key: 'd3cf5bb64a6c296c84af30628698559c0c904117', class: "visually-hidden", "aria-live": "polite", "aria-atomic": "true" }, this.removalAnnouncement), this.helperMessage && !(this.errorMessage && this.errorMessage.length > 0) && (index.h("p", { key: 'a711280151ff360758143906a76fa2d25f4078a9', class: "pds-multiselect__helper", id: form.messageId(this.componentId, 'helper') }, this.helperMessage)), this.errorMessage && (index.h("p", { key: '17411d6bb55843f45f8d7ee410b627de846eed65', class: "pds-multiselect__error", id: form.messageId(this.componentId, 'error') }, index.h("pds-icon", { key: '446ffc0ed08b7856f0ef8c49bdf06b6011404a12', "aria-hidden": "true", icon: index$1.danger, size: "small" }), this.errorMessage)), index.h("div", { key: 'a83ed6c5d84cbf38f267f7e15bd871d09534c554', style: { display: 'none' } }, index.h("slot", { key: '294ce6a2bd4405854161aed5d8166fcc86e211e3' })))));
     }
     static get formAssociated() { return true; }
     get el() { return index.getElement(this); }

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

@@ -1079,7 +1079,7 @@ const PdsPopover = class {
         portal.style.left = `${left - origin.left}px`;
     }
     render() {
-        return (index.h(index.Host, { key: 'c76e121eb82b0d4f89f49bc83ff592ccf5774d57', id: this.componentId }, index.h("span", { key: '01061721f373e6f83729624d19f0beac0d6f093e', class: "pds-popover__trigger-wrapper" }, index.h("slot", { key: 'e68a2bd22ee6657e534da3d097bdaf3189815262', name: "trigger", onSlotchange: this.handleTriggerSlotChange })), index.h("span", { key: 'd48301ebb6a9e0729083829a0587a0a285faedda', class: "pds-popover__tab-guard", ref: (el) => (this.tabGuardEl = el !== null && el !== void 0 ? el : null), onFocus: this.handleTabGuardFocus }), index.h("div", { key: 'c7d2e348545adaa7566da7c4f6b13a7ee78d1322', class: "pds-popover__content-slot-wrapper" }, index.h("slot", { key: '312f54fa917c135adc2f2a5ccbbb3159a980df24', onSlotchange: this.handleContentSlotChange }))));
+        return (index.h(index.Host, { key: '1767e44f8f0fba0938cc99fefdeb786cf9131384' }, index.h("span", { key: 'b5369451958d62562f007d600e7567809f281bfb', class: "pds-popover__trigger-wrapper" }, index.h("slot", { key: '30a8273c6365eff7fd8265966ae09d66ac84e0a9', name: "trigger", onSlotchange: this.handleTriggerSlotChange })), index.h("span", { key: 'a562458380244ca76af047edd00d40d012bc30ce', class: "pds-popover__tab-guard", ref: (el) => (this.tabGuardEl = el !== null && el !== void 0 ? el : null), onFocus: this.handleTabGuardFocus }), index.h("div", { key: '36db874a9f1bcdf0dc52d9cce368c5fc4f296b62', class: "pds-popover__content-slot-wrapper" }, index.h("slot", { key: '295f000fcdcaa4ef5249f4e98ed83cbd467351b0', onSlotchange: this.handleContentSlotChange }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -14,7 +14,7 @@ const PdsProperty = class {
         this.icon = 'star';
     }
     render() {
-        return (index.h(index.Host, { key: '198ffd747b7a84a6f58a1b072890fc8bd3ed93aa', id: this.componentId }, index.h("pds-box", { key: 'be71f3d96efea0a45f357d888f71dbe5ad8b68d6', "align-items": "center", gap: "xs" }, index.h("pds-icon", { key: '1a52407e00b158d5e6a515ad4b07ed3407d31f75', icon: this.icon, size: "var(--pine-dimension-sm)", "aria-hidden": "true" }), index.h("slot", { key: '46ac5019b27bdd079c7853abeef8f7c240d19c2c' }))));
+        return (index.h(index.Host, { key: '1bdcebaa09a696b18871651ef2615d0d400ddbb8' }, index.h("pds-box", { key: 'a4dc57f9e758b78fe3d4f2c096fadec53288e47b', "align-items": "center", gap: "xs" }, index.h("pds-icon", { key: '2a89c7e1231163b5e4ac20d3d0c3d43af414a11a', icon: this.icon, size: "var(--pine-dimension-sm)", "aria-hidden": "true" }), index.h("slot", { key: '4c4d2ee5ed05ad2ec53bbe4f79fa11c04c8eb44d' }))));
     }
 };
 PdsProperty.style = pdsPropertyCss();

package/dist/cjs/pds-radio-group.cjs.entry.js

@@ -8,6 +8,8 @@ require('./keep-hydrated-AKoh0DG4.js');
 
 const pdsRadioGroupCss = () => `.sc-pds-radio-group-h{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--pine-dimension-sm)}.is-invalid.sc-pds-radio-group-h .pds-radio-group__message--error.sc-pds-radio-group{color:var(--pine-color-text-message-danger)}.pds-radio-group__label.sc-pds-radio-group{color:var(--pine-color-text-label);font:var(--pine-typography-heading-6);font-weight:var(--pine-font-weight-medium);letter-spacing:var(--pine-letter-spacing-heading-6)}.pds-radio-group__radios.sc-pds-radio-group{display:-ms-flexbox;display:flex;gap:var(--pds-radio-group-gap, var(--pine-dimension-xs))}.pds-radio-group__radios--row.sc-pds-radio-group{-ms-flex-align:start;align-items:flex-start;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap}.pds-radio-group__radios--column.sc-pds-radio-group{-ms-flex-direction:column;flex-direction:column}.pds-radio-group__message.sc-pds-radio-group{color:var(--pine-color-text-message);font:var(--pine-typography-body);width:100%}.pds-radio-group__message--error.sc-pds-radio-group{display:-ms-flexbox;display:flex;gap:var(--pine-dimension-2xs)}.pds-radio-group__message--error.sc-pds-radio-group pds-icon.sc-pds-radio-group{-webkit-margin-before:var(--pine-dimension-050);margin-block-start:var(--pine-dimension-050)}`;
 
+// The label and message ids a group without component-id generates for itself.
+const STALE_REFERENCE = /^radio-group-.+__(label|helper-message|error-message)$/;
 const PdsRadioGroup = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
@@ -125,18 +127,21 @@ const PdsRadioGroup = class {
                 : `${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;
             this._groupId = `radio-group-${uniqueId}`;
         }
-        // A restored or cloned host still carries the id and ARIA references an earlier instance wrote, pointing at
-        // that instance's label and messages. Drop them so this render writes its own: on first load, Stencil keeps a
-        // host attribute that's already there.
-        const previousId = this.el.getAttribute('id');
-        if (previousId && previousId !== this._groupId) {
-            ['aria-labelledby', 'aria-describedby'].forEach((name) => {
-                var _a, _b;
-                const ids = (_b = (_a = this.el.getAttribute(name)) === null || _a === void 0 ? void 0 : _a.split(/\s+/)) !== null && _b !== void 0 ? _b : [];
-                if (ids.some((id) => id.startsWith(`${previousId}__`)))
-                    this.el.removeAttribute(name);
-            });
-        }
+        // A restored or cloned host can still carry the ARIA references an earlier instance wrote, pointing at that
+        // instance's label and messages. Drop those tokens so this render writes its own, and keep any others.
+        ['aria-labelledby', 'aria-describedby'].forEach((name) => {
+            var _a;
+            const ids = (_a = this.el.getAttribute(name)) === null || _a === void 0 ? void 0 : _a.split(/\s+/).filter(Boolean);
+            if (!ids)
+                return;
+            const kept = ids.filter((id) => !STALE_REFERENCE.test(id) || id.startsWith(`${this._groupId}__`));
+            if (kept.length === ids.length)
+                return;
+            if (kept.length)
+                this.el.setAttribute(name, kept.join(' '));
+            else
+                this.el.removeAttribute(name);
+        });
     }
     componentDidLoad() {
         if (!this.name) {
@@ -226,13 +231,13 @@ const PdsRadioGroup = class {
             'aria-describedby': ariaDescribedBy,
             'aria-labelledby': ariaLabelledBy === this.labelId ? ariaLabelledBy : undefined,
         });
-        return (index.h(index.Host, { key: 'c0d30ada4c215a2a316e55e0c564eb2d74f811be', class: hostClass, id: this._groupId, role: "radiogroup", "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, style: {
+        return (index.h(index.Host, { key: 'd379f29bc62f1855c1a244c3edd800b390a98f54', class: hostClass, role: "radiogroup", "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, style: {
                 '--pds-radio-group-gap': gapValue,
-            } }, this.groupLabel && (index.h("div", { key: 'c237d7907b458131fd248b50b36f45df3c49f084', class: "pds-radio-group__label", id: this.labelId }, this.groupLabel)), index.h("div", { key: 'd31f36e69c4ee2fc9f9c86f0a25d56a4a5272372', class: {
+            } }, this.groupLabel && (index.h("div", { key: 'e2db8af21186405b0c7b6c23422e34b46ca6bbbe', class: "pds-radio-group__label", id: this.labelId }, this.groupLabel)), index.h("div", { key: 'f818e2b84374979cda34d635ff6e9d1982d67c46', class: {
                 'pds-radio-group__radios': true,
                 'pds-radio-group__radios--row': this.direction === 'row',
                 'pds-radio-group__radios--column': this.direction === 'column',
-            } }, index.h("slot", { key: '20153277b51dfe816596d7c4d7d1d12eaf08362a', onSlotchange: () => this.updateChildRadios() })), this.helperMessage && (index.h("div", { key: '1d48f78e3c3c56c949868a868bf9d73bdff81beb', class: "pds-radio-group__message", id: form.messageId(this._groupId, 'helper') }, this.helperMessage)), this.errorMessage && (index.h("div", { key: 'c2d0d3f60b9a598d60b372945852f0a7e512abbf', class: "pds-radio-group__message pds-radio-group__message--error", id: form.messageId(this._groupId, 'error'), "aria-live": "assertive" }, index.h("pds-icon", { key: '2f187a2fea00871f9980cc0fe799c758723174fe', "aria-hidden": "true", icon: index$1.danger, size: "small" }), this.errorMessage))));
+            } }, index.h("slot", { key: 'f4d61c9495773c33119fcddf270f5a4d345e507b', onSlotchange: () => this.updateChildRadios() })), this.helperMessage && (index.h("div", { key: '9ba493a3baf04085fba52f9f825024210122f0b5', class: "pds-radio-group__message", id: form.messageId(this._groupId, 'helper') }, this.helperMessage)), this.errorMessage && (index.h("div", { key: '3a11a19683b897b565d615d888c7f9357e0e1ed3', class: "pds-radio-group__message pds-radio-group__message--error", id: form.messageId(this._groupId, 'error'), "aria-live": "assertive" }, index.h("pds-icon", { key: 'c57a25a382cbcc216fffeab849eca06a78cb4b60', "aria-hidden": "true", icon: index$1.danger, size: "small" }), this.errorMessage))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/pds-sortable-item.cjs.entry.js

@@ -71,10 +71,10 @@ const PdsSortableItem = class {
         this.hostKeeper.record(hostClasses);
         const existingHandle = this.el.querySelector('.pds-sortable-item__handle');
         const wasPressed = (existingHandle === null || existingHandle === void 0 ? void 0 : existingHandle.getAttribute('aria-pressed')) === 'true';
-        return (index.h(index.Host, { key: '5fdef76101ce86c7769bb49bff9869246c3bdb32', class: hostClasses, id: this.componentId }, (this.showHandle || reorderable) && (index.h("div", { key: 'e54b5a0006b395dc67ff78c6a115e4e498cae096', class: {
+        return (index.h(index.Host, { key: '93566ff82e0603508392df14f6ecec11872e822c', class: hostClasses }, (this.showHandle || reorderable) && (index.h("div", { key: 'c3c6bd592ab827a0fc513c101b5afec8acc62cf4', class: {
                 'pds-sortable-item__handle': true,
                 'pds-sortable-item__handle--hidden': !this.showHandle,
-            }, role: reorderable ? 'button' : undefined, tabindex: reorderable ? '0' : undefined, "aria-label": reorderable ? i18nFormat.formatMessage(sortable.handleLabel, { item: sortableLabel.sortableItemLabel(this.el) }) : undefined, "aria-pressed": reorderable ? String(wasPressed) : undefined }, index.h("pds-icon", { key: 'e7099e03ea68c9f48c50d20868835081c4fdbc75', "aria-hidden": "true", icon: index$1.handle }))), index.h("slot", { key: 'c75d20569c150da8d0698657db787aa6d27e3408' }), this.enableActions && (index.h("div", { key: '14281b2eaedfa57ff90342fb1dcbff48cd656242', class: "pds-sortable-item__actions" }, index.h("slot", { key: 'ec1f75b331d136a00fc39db9ab2cadd86a416e8d', name: "sortable-item-actions" })))));
+            }, role: reorderable ? 'button' : undefined, tabindex: reorderable ? '0' : undefined, "aria-label": reorderable ? i18nFormat.formatMessage(sortable.handleLabel, { item: sortableLabel.sortableItemLabel(this.el) }) : undefined, "aria-pressed": reorderable ? String(wasPressed) : undefined }, index.h("pds-icon", { key: 'a71dd5c7c7d368ec0ef326d7f86f33bcaeecf238', "aria-hidden": "true", icon: index$1.handle }))), index.h("slot", { key: 'cf372e7f7a234829b77ae28604bfdbdced27b1e8' }), this.enableActions && (index.h("div", { key: 'abf8848c6c5ed09ddcf1b09be21f0ba851385f10', class: "pds-sortable-item__actions" }, index.h("slot", { key: 'e6b3b897c17529f5d803d72e6fcbeed66880f083', name: "sortable-item-actions" })))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -3069,7 +3069,7 @@ const PdsSortable = class {
     render() {
         const classNames = this.classNames();
         this.hostKeeper.record(classNames);
-        return (index$1.h(index$1.Host, { key: 'a1fb28574e3aa92a923c4baeecec690d4052601f', class: classNames, id: this.componentId, onFocusin: this.handleFocusIn, onFocusout: this.handleFocusOut, onKeyDown: this.handleKeyDown, onClick: this.handleClick }, index$1.h("slot", { key: 'b9a255d4f94a6b9976a4cac7e142e45210125828' })));
+        return (index$1.h(index$1.Host, { key: 'f758a8b71485f09185ba511b304c48c3fcdb5298', class: classNames, onFocusin: this.handleFocusIn, onFocusout: this.handleFocusOut, onKeyDown: this.handleKeyDown, onClick: this.handleClick }, index$1.h("slot", { key: 'fecbafc235475dc67fb1d7fe051c42d2a51b4bfe' })));
     }
     get el() { return index$1.getElement(this); }
     static get watchers() { return {

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

@@ -31,7 +31,7 @@ const PdsSwitch = class {
          */
         this.disabled = false;
         /**
-         * Determines the input 'invalid' state, signifying an error is present.
+         * Determines whether or not the switch is invalid.
          */
         this.invalid = false;
         /**
@@ -182,12 +182,12 @@ const PdsSwitch = class {
         const hostClass = this.switchClassNames();
         const ariaDisabled = this.isDisabled() ? 'true' : null;
         this.hostKeeper.record(hostClass, {}, { 'aria-disabled': ariaDisabled });
-        return (index.h(index.Host, { key: 'e5100ae3ecfac3bb556582507cc628b2455ae6cc', class: hostClass, "aria-disabled": ariaDisabled }, index.h("label", { key: 'c337b8c4dc381c3a745100c707792c11711c01a1', htmlFor: this.componentId }, index.h("input", Object.assign({ key: 'f18ae27e7c91ef4d54b0192a04130420b991c9ff', "aria-describedby": this.ownDescriptionId(), "aria-invalid": this.invalid ? "true" : undefined, checked: this.checked, class: "pds-switch__input", disabled: this.isDisabled(), id: this.componentId, name: this.name ? this.name : this.componentId, onChange: this.onSwitchUpdate,
+        return (index.h(index.Host, { key: '4c6f12c064caead89979cc4aa0ef25c4581381c3', class: hostClass, "aria-disabled": ariaDisabled }, index.h("label", { key: 'c97164a6d6318be6cbcc026373e3d5c0a9316d56', htmlFor: this.componentId }, index.h("input", Object.assign({ key: 'dfaf7408c3fbbed38bd0732ff156e53f57235100', "aria-describedby": this.ownDescriptionId(), "aria-invalid": this.invalid ? "true" : undefined, checked: this.checked, class: "pds-switch__input", disabled: this.isDisabled(), id: this.componentId, name: this.name ? this.name : this.componentId, onChange: this.onSwitchUpdate,
             // A description added after the switch, or replaced by a framework or a DOM morph, is picked up by the
             // time focus reaches the switch and it's announced.
-            onFocus: this.forwardDescription, ref: (el) => (this.inputEl = el), required: this.required, type: "checkbox", value: this.value }, this.inheritedAttributes)), index.h("span", { key: '4bddfc080db7fee6fa8080e890918757dacde3fb', class: this.hideLabel ? 'visually-hidden' : '' }, index.h("slot", { key: 'c9302409719113e12f6debb426c78dd0caaee88a', name: "label", onSlotchange: this.updateHasLabelSlot }), !this.hasLabelSlot && this.label)), this.helperMessage &&
-            index.h("div", { key: '60785b9779cb2d50e6f0f2b32179106256f55ebf', class: `pds-switch__message`, id: form.messageId(this.componentId, 'helper') }, this.helperMessage), this.errorMessage &&
-            index.h("div", { key: '9b258e9302c5ef959e8c06bee780d7d43144359b', class: `pds-switch__message pds-switch__message--error`, id: form.messageId(this.componentId, 'error'), "aria-live": "assertive" }, index.h("pds-icon", { key: 'f8df779a8c65a6f0b6ea139ff3c31cca76eb48fa', "aria-hidden": "true", icon: index$1.danger, size: "small" }), this.errorMessage)));
+            onFocus: this.forwardDescription, ref: (el) => (this.inputEl = el), required: this.required, type: "checkbox", value: this.value }, this.inheritedAttributes)), index.h("span", { key: '5e621fa2881bb2d1eddd3dcbc33173f3cf49bd93', class: this.hideLabel ? 'visually-hidden' : '' }, index.h("slot", { key: 'ef682ce320b8d9f2897676af97e0b4d55c55358a', name: "label", onSlotchange: this.updateHasLabelSlot }), !this.hasLabelSlot && this.label)), this.helperMessage &&
+            index.h("div", { key: '145da644abc8829de20ca6f9c4532f5341dec441', class: `pds-switch__message`, id: form.messageId(this.componentId, 'helper') }, this.helperMessage), this.errorMessage &&
+            index.h("div", { key: '7766e34f6daaf760d78aec6f08b64f0de15deb4c', class: `pds-switch__message pds-switch__message--error`, id: form.messageId(this.componentId, 'error'), "aria-live": "assertive" }, index.h("pds-icon", { key: '74dfd91aabf60608e8278ef84119466a2143ffc7', "aria-hidden": "true", icon: index$1.danger, size: "small" }), this.errorMessage)));
     }
     static get formAssociated() { return true; }
     get el() { return index.getElement(this); }

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

@@ -495,9 +495,9 @@ const PdsTable = class {
     }
     render() {
         if (this.responsive) {
-            return (index.h(index.Host, { class: `${this.classNames()} pds-table-responsive-host`, id: this.componentId, role: "grid", selectable: this.selectable, tabindex: "0", part: "table responsive-table" }, index.h("div", { class: "scroll-shadow-left", part: "scroll-shadow-left" }), index.h("div", { class: "scroll-shadow-right", part: "scroll-shadow-right" }), index.h("div", { class: "pds-table-responsive-container", part: "responsive-container" }, index.h("div", { class: "pds-table-responsive-wrapper", part: "responsive-wrapper" }, index.h("div", { class: this.classNames(), part: "table-inner" }, index.h("slot", null))))));
+            return (index.h(index.Host, { class: `${this.classNames()} pds-table-responsive-host`, role: "grid", selectable: this.selectable, tabindex: "0", part: "table responsive-table" }, index.h("div", { class: "scroll-shadow-left", part: "scroll-shadow-left" }), index.h("div", { class: "scroll-shadow-right", part: "scroll-shadow-right" }), index.h("div", { class: "pds-table-responsive-container", part: "responsive-container" }, index.h("div", { class: "pds-table-responsive-wrapper", part: "responsive-wrapper" }, index.h("div", { class: this.classNames(), part: "table-inner" }, index.h("slot", null))))));
         }
-        return (index.h(index.Host, { class: this.classNames(), id: this.componentId, role: "grid", selectable: this.selectable, tabindex: "0", part: "table" }, index.h("slot", null)));
+        return (index.h(index.Host, { class: this.classNames(), role: "grid", selectable: this.selectable, tabindex: "0", part: "table" }, index.h("slot", null)));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -278,7 +278,7 @@ const PdsTabs = class {
         // Only the classes: `active-tab-name` backs the mutable activeTabName prop, so a morph that drops
         // it is a prop change, not a strip.
         this.hostKeeper.record(hostClass);
-        return (index.h(index.Host, { key: '69985d6800ac879a8655d52a6b4f72c5b6a20c61', "active-tab-name": this.activeTabName, class: hostClass, id: this.componentId }, tabList, index.h("slot", { key: '0fb1b2521b15c77a50d81431cc1f0f6a40360cfa', name: "tabpanels" })));
+        return (index.h(index.Host, { key: '6ededb588230706dc0848164e991694490436bf1', "active-tab-name": this.activeTabName, class: hostClass }, tabList, index.h("slot", { key: '68d090b7b6a3bae74ceb66e1487ce96666a38c6e', name: "tabpanels" })));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -426,10 +426,9 @@ const PdsTooltip = class {
         this.lastCopiedHtml = null;
     }
     render() {
-        const hostId = this.componentId || undefined;
-        return (index.h(index.Host, { key: '475ff12d4be035e3effa894353e7948b42a23489', id: hostId, class: { 'pds-tooltip--is-open': this.opened } }, index.h("span", { key: '3375dfb5bb86ba373bc5d617f4a53171505631d1', class: "pds-tooltip__trigger", onMouseEnter: this.handleShow, onMouseLeave: this.handleHide,
+        return (index.h(index.Host, { key: '8e9f4aac519caacca9d7e7bc92a714e09ecc756f', class: { 'pds-tooltip--is-open': this.opened } }, index.h("span", { key: 'f4a706e2b5bb68ac171c25ae02ae23555860c165', class: "pds-tooltip__trigger", onMouseEnter: this.handleShow, onMouseLeave: this.handleHide,
             /* focusin/out bubble; ensure keyboard users see tooltips */
-            onFocusin: this.handleShow, onFocusout: this.handleHide, ref: el => this.triggerEl = el }, index.h("slot", { key: 'a3392ad415f5ac7f3883100bf914484ffcc8e536' })), index.h("div", { key: '774ac2c4808e96649b1536569aaf8cf8a6e3abc2', class: "pds-tooltip__content-slot-wrapper", hidden: true }, index.h("slot", { key: '672c64b4acdb365623885ac2105a9b90b1dcfa6b', name: "content" }))));
+            onFocusin: this.handleShow, onFocusout: this.handleHide, ref: el => this.triggerEl = el }, index.h("slot", { key: '7548da298a2295f40fd1c6a9b4f1e597f687b80e' })), index.h("div", { key: 'e19be5edd901bc8a6f96ace445451a976b92e447', class: "pds-tooltip__content-slot-wrapper", hidden: true }, index.h("slot", { key: '0616e0468350750019afb736d79ac9f49ace4730', name: "content" }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -31,7 +31,7 @@ export class PdsAccordion {
         this.detailsEl.addEventListener('toggle', this.handleToggle);
     }
     render() {
-        return (h(Host, { key: 'dd45657cb2bfe2e26f3a2fcad6a941559f1968c5', class: "pds-accordion", id: this.componentId }, h("details", Object.assign({ key: '9dff1b1a3e4cdd308537c1e5f4020d6b74e4ac4e' }, this.getOpenAttribute(), { ref: (el) => (this.detailsEl = el) }), h("summary", { key: '59152e8eece069bedd0109d1952dc1de95bc5d9a', part: "accordion-button" }, h("slot", { key: '73881348e657d880c60a5420a758217789f03b0c', name: "label" }, "Details"), h("pds-icon", { key: '35fbb0c45bc97ce3b69fd8184ef085230253d675', "aria-hidden": "true", icon: downSmall, part: "accordion-icon" })), h("div", { key: 'c9bb44d8135560b0e486a730830642387c87a67a', part: "accordion-body", class: "pds-accordion__body" }, h("slot", { key: 'f18d2a5a87d5d2653ce92766bc34c4506b88d4f4' })))));
+        return (h(Host, { key: '245ae62c7427cfcad6eb6c3213c9b13aada4de79', class: "pds-accordion" }, h("details", Object.assign({ key: 'f69707beaacf2d10d75d604042fa8ed99b345db1' }, this.getOpenAttribute(), { ref: (el) => (this.detailsEl = el) }), h("summary", { key: '0329e0502b344834f2180c9ecd17136416dc8700', part: "accordion-button" }, h("slot", { key: '59085adef7239c0e697ae4a0d0104d7a9a95c8d6', name: "label" }, "Details"), h("pds-icon", { key: '7ea87ae13f047de27cf469c48bc3bad90f5a01e7', "aria-hidden": "true", icon: downSmall, part: "accordion-icon" })), h("div", { key: '1e4febc7cbe2da9ffdd2f6a11802cca22f5b2573', part: "accordion-body", class: "pds-accordion__body" }, h("slot", { key: 'fcee6efccbc7233a83b62a443172a42c0f800aea' })))));
     }
     static get is() { return "pds-accordion"; }
     static get encapsulation() { return "shadow"; }
@@ -62,7 +62,7 @@ export class PdsAccordion {
                             "name": "defaultValue",
                             "text": "null"
                         }],
-                    "text": "A unique identifier used for the underlying component `id` attribute."
+                    "text": "A unique identifier for this component instance. Does not set the host element's `id` attribute \u2014 set `id` directly if you need one."
                 },
                 "getter": false,
                 "setter": false,

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

@@ -74,7 +74,7 @@ export class PdsAlert {
         };
         // Get the icon name based on the current variant
         const iconName = iconMap[this.variant] || iconMap.default;
-        return (h(Host, { key: '019ac6b59e4154b88814ccae8a9afa930efd7ac6', class: "pds-alert", id: this.componentId, variant: this.variant }, h("pds-box", { key: 'c85aa29140b2febe7af477cd968e0da0c18bf5df', class: `pds-alert__container pds-alert__container--${this.variant}`, "background-color": "var(--pds-alert-background)", "border-color": "var(--pds-alert-border-color)", "border-radius": "md", border: true, display: "block" }, h("pds-box", { key: '0c6cc23581fe7ce9e19ddedff5a3cc09e1401ebc', gap: "sm", display: "flex", "align-items": this.small ? "center" : undefined }, severity && h("span", { key: '7d89247321abb724c74d835e8930d39babaab5e5', class: "visually-hidden" }, severity), !this.hideIcon && (h("pds-icon", { key: '1d82c128e2d58b278391b79412c2770ab2c60987', class: `pds-alert__icon ${this.small ? 'pds-alert__icon--small' : ''}`, color: "var(--pds-alert-color-icon)", icon: iconName, size: "var(--pds-alert-icon-size)", "aria-hidden": "true" })), h("pds-box", { key: 'b40276367299c772114e99e94efc73cad5c63179', class: "pds-alert__content-wrapper", direction: "column", gap: "xs", flex: "grow" }, this.heading && !this.small && (h("pds-text", { key: '2d70990548c3ea7e7d78ca68683dee779e9e82fc', class: "pds-alert__heading", color: "var(--pds-alert-color-text)", size: "h5", tag: "h3", weight: "medium" }, this.heading)), this.renderContent()), this.dismissible && (h("button", { key: '777fe5ff528d2069fe77eacb22bc3d366f4100d4', class: "pds-alert__dismiss", type: "button", part: "dismiss", "aria-label": this.dismissLabel, onClick: this.handleCloseClick }, h("pds-icon", { key: 'd616de534455dbd43a5353634ddfed8332ee7e7c', icon: "remove", size: "var(--pds-alert-icon-size)", "aria-hidden": "true", color: "var(--pds-alert-color-dismiss)" })))))));
+        return (h(Host, { key: '1fc2d61c1740070616eb7819ff6a919241ce1f6e', class: "pds-alert", variant: this.variant }, h("pds-box", { key: 'd6ba30218ebbf89532a8a6c3d5db9b2e5321748a', class: `pds-alert__container pds-alert__container--${this.variant}`, "background-color": "var(--pds-alert-background)", "border-color": "var(--pds-alert-border-color)", "border-radius": "md", border: true, display: "block" }, h("pds-box", { key: 'c08f2c190c1d5a9bb95c7e6351dd615a3441a48d', gap: "sm", display: "flex", "align-items": this.small ? "center" : undefined }, severity && h("span", { key: '8ca461e81ac655fa0f9ee837a5f4d2380f9dc0a0', class: "visually-hidden" }, severity), !this.hideIcon && (h("pds-icon", { key: '79583456f1b9b0a167afe296fc09aaa1ceb64209', class: `pds-alert__icon ${this.small ? 'pds-alert__icon--small' : ''}`, color: "var(--pds-alert-color-icon)", icon: iconName, size: "var(--pds-alert-icon-size)", "aria-hidden": "true" })), h("pds-box", { key: 'f72b9ebea3fa5158d033c462b764f4135c3df240', class: "pds-alert__content-wrapper", direction: "column", gap: "xs", flex: "grow" }, this.heading && !this.small && (h("pds-text", { key: '6f023c4c98fbe50be53f531fa648690bb086946c', class: "pds-alert__heading", color: "var(--pds-alert-color-text)", size: "h5", tag: "h3", weight: "medium" }, this.heading)), this.renderContent()), this.dismissible && (h("button", { key: 'e366272888d222b184d8e56a74364abbb2b0799f', class: "pds-alert__dismiss", type: "button", part: "dismiss", "aria-label": this.dismissLabel, onClick: this.handleCloseClick }, h("pds-icon", { key: '10907ac14c1b24fbc73c2484e1e066c7e6c14ee2', icon: "remove", size: "var(--pds-alert-icon-size)", "aria-hidden": "true", color: "var(--pds-alert-color-dismiss)" })))))));
     }
     static get is() { return "pds-alert"; }
     static get encapsulation() { return "shadow"; }
@@ -102,7 +102,7 @@ export class PdsAlert {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "A unique identifier used for the underlying component `id` attribute."
+                    "text": "A unique identifier for this component instance. Does not set the host element's `id` attribute \u2014 set `id` directly if you need one."
                 },
                 "getter": false,
                 "setter": false,

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

@@ -152,7 +152,7 @@ export class PdsAvatar {
         }
     }
     render() {
-        return (h(Host, { key: 'b0464345bf1e351ea9a22a9aac9cf06f9f28ee18', id: this.componentId, class: Object.assign({}, this.classNames()) }, this.renderAvatar()));
+        return (h(Host, { key: '237598a069d4a3b1281b10b516c01c6d479ca3e9', class: Object.assign({}, this.classNames()) }, this.renderAvatar()));
     }
     static get is() { return "pds-avatar"; }
     static get encapsulation() { return "shadow"; }
@@ -248,7 +248,7 @@ export class PdsAvatar {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "A unique identifier used for the underlying component `id` attribute."
+                    "text": "A unique identifier for this component instance. Does not set the host element's `id` attribute \u2014 set `id` directly if you need one."
                 },
                 "getter": false,
                 "setter": false,

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

@@ -261,7 +261,7 @@ export class PdsButton {
         // Hide text when loading or iconOnly is true
         const hideText = this.loading || this.iconOnly;
         const content = (h("div", { class: "pds-button__content", part: "button-content" }, this.renderStartContent(), h("span", { class: `pds-button__text ${hideText ? 'pds-button__text--hidden' : ''}`, part: "button-text" }, h("slot", null)), this.loading && (h("span", { class: "pds-button__loader" }, h("pds-loader", { "is-loading": true, size: "var(--pine-font-size-body-2xl)", variant: "spinner", exportparts: "loader-svg" }, "Loading..."))), this.renderEndContent()));
-        return (h(Host, Object.assign({ "aria-disabled": this.disabled ? 'true' : null }, (this.componentId != null ? { id: this.componentId } : {}), { onClick: this.handleClick, onFocusin: this.handleFocusIn, variant: this.variant }), h(ContentElement, Object.assign({}, attributes()), content)));
+        return (h(Host, { "aria-disabled": this.disabled ? 'true' : null, onClick: this.handleClick, onFocusin: this.handleFocusIn, variant: this.variant }, h(ContentElement, Object.assign({}, attributes()), content)));
     }
     static get is() { return "pds-button"; }
     static get encapsulation() { return "shadow"; }
@@ -290,7 +290,7 @@ export class PdsButton {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "A unique identifier used for the underlying component `id` attribute."
+                    "text": "A unique identifier for this component instance. Does not set the host element's `id` attribute \u2014 set `id` directly if you need one."
                 },
                 "getter": false,
                 "setter": false,

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

@@ -239,7 +239,7 @@ export class PdsChip {
         const hostClass = this.classNames();
         const hostStyles = this.hostStyles;
         this.hostKeeper.record(hostClass, hostStyles);
-        return (h(Host, { key: 'd8c5e90c4d55959e7b2d0cc8a994136fb0abc5dc', class: hostClass, id: this.componentId, style: hostStyles }, this.setChipContent(), this.effectiveVariant === 'tag' && this.renderCloseButton()));
+        return (h(Host, { key: '7f9ee3000b4a68726730ee8019f5b866a2f53ae7', class: hostClass, style: hostStyles }, this.setChipContent(), this.effectiveVariant === 'tag' && this.renderCloseButton()));
     }
     static get is() { return "pds-chip"; }
     static get encapsulation() { return "shadow"; }
@@ -267,7 +267,7 @@ export class PdsChip {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "A unique identifier used for the underlying component `id` attribute."
+                    "text": "A unique identifier for this component instance. Does not set the host element's `id` attribute \u2014 set `id` directly if you need one."
                 },
                 "getter": false,
                 "setter": false,

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

@@ -107,7 +107,7 @@ export class PdsCopytext {
     render() {
         const hostClass = this.classNames();
         this.hostKeeper.record(hostClass);
-        return (h(Host, { key: '2c3bf9cd49adf9a68be5f6cf3bdf0bb29aab956a', class: hostClass, id: this.componentId }, h("pds-button", { key: '88ff5d9b7071583c76c8875834b9d4fda274d711', type: "button", variant: "unstyled", onClick: this.handleClick }, h("span", { key: '5dee0ec40cbabf3d781037a785ec7c5aa7621121', ref: (el) => this.valueSpanEl = el }, this.value), h("pds-icon", { key: '3399b3573670f32f6a70f78f1ae60c9cba031955', "aria-hidden": "true", icon: copyIcon, size: "16px" }))));
+        return (h(Host, { key: '088bbb25115146cf5ebce5ba98596ac987982ca1', class: hostClass }, h("pds-button", { key: 'c6ca05402e3957f129e95f8545ebfb0393baf648', type: "button", variant: "unstyled", onClick: this.handleClick }, h("span", { key: '95b0114960772b8d41ac1c55140eed73844be54b', ref: (el) => this.valueSpanEl = el }, this.value), h("pds-icon", { key: '49a1a13daf1bd9d875f6bc518f7002dc33652863', "aria-hidden": "true", icon: copyIcon, size: "16px" }))));
     }
     static get is() { return "pds-copytext"; }
     static get encapsulation() { return "shadow"; }
@@ -158,7 +158,7 @@ export class PdsCopytext {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "A unique identifier used for the underlying component `id` attribute."
+                    "text": "A unique identifier for this component instance. Does not set the host element's `id` attribute \u2014 set `id` directly if you need one."
                 },
                 "getter": false,
                 "setter": false,

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

@@ -29,7 +29,7 @@ export class PdsDivider {
         return classNames.join(' ');
     }
     render() {
-        return (h(Host, { key: '072cc8552bd33c4a00d216f15a5a848cfc97fd92', id: this.componentId }, this.hasLabel ? (h("div", { class: this.classNames(), role: "separator", "aria-label": this.label }, h("span", { class: "pds-divider__label", part: "label", "aria-hidden": "true" }, this.label))) : (h("hr", { class: this.classNames() }))));
+        return (h(Host, { key: '27f21f0697085d75414da7e626b44f5c0ad5b0b3' }, this.hasLabel ? (h("div", { class: this.classNames(), role: "separator", "aria-label": this.label }, h("span", { class: "pds-divider__label", part: "label", "aria-hidden": "true" }, this.label))) : (h("hr", { class: this.classNames() }))));
     }
     static get is() { return "pds-divider"; }
     static get encapsulation() { return "shadow"; }
@@ -57,7 +57,7 @@ export class PdsDivider {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "A unique identifier used for the underlying component `id` attribute."
+                    "text": "A unique identifier for this component instance. Does not set the host element's `id` attribute \u2014 set `id` directly if you need one."
                 },
                 "getter": false,
                 "setter": false,

package/dist/collection/components/pds-dropdown-menu/pds-dropdown-menu-item/pds-dropdown-menu-item.js

@@ -132,7 +132,7 @@ export class PdsDropdownMenuItem {
         return (_d = (_c = (_b = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('pds-link')) === null || _b === void 0 ? void 0 : _b.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('a')) !== null && _d !== void 0 ? _d : null;
     }
     render() {
-        return (h(Host, { key: '139943faad1c0047bb0363e0eaa0cde9efb2f957', id: this.componentId, class: {
+        return (h(Host, { key: '974b6da459ec11c49a0105b1b2f26eb134440d18', class: {
                 'is-disabled': this.disabled,
                 'is-informational': this.informational,
                 'destructive': !this.disabled && !this.informational && this.destructive
@@ -167,7 +167,7 @@ export class PdsDropdownMenuItem {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "A unique identifier used for the underlying component `id` attribute."
+                    "text": "A unique identifier for this component instance. Does not set the host element's `id` attribute \u2014 set `id` directly if you need one."
                 },
                 "getter": false,
                 "setter": false,