@pine-ds/core 4.8.0 → 4.9.1

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

@@ -1,12 +1,13 @@
 'use strict';
 
-var index = require('./index-jl_Q819j.js');
-var floatingUi_dom = require('./floating-ui.dom-Dc8Anyel.js');
-var index$1 = require('./index-Do70atou.js');
+var index = require('./index-D9iJuJCP.js');
+var floatingUi_dom = require('./floating-ui.dom-Dw41zbyY.js');
+var index$1 = require('./index-BDnbr0DK.js');
 var form = require('./form-MhwfKTuo.js');
 var i18nFormat = require('./i18n-format-BD0PmYzT.js');
 var closest = require('./closest-D0qyYtJ3.js');
-require('./keep-hydrated-CiXgkEYd.js');
+var portalTarget = require('./portal-target-e8WQ6dLx.js');
+require('./keep-hydrated-AKoh0DG4.js');
 
 /**
  * Date-only helpers for pds-datepicker. Dates are `YYYY-MM-DD` strings and all arithmetic runs in
@@ -168,7 +169,7 @@ class CalendarPortal {
      */
     mount(calendar, locale) {
         if (!this.host.isConnected) {
-            findPortalTarget(this.datepicker).appendChild(this.host);
+            portalTarget.findPortalTarget(this.datepicker).appendChild(this.host);
             this.copyContext(locale);
         }
         else if (locale !== this.locale) {
@@ -238,44 +239,6 @@ class CalendarPortal {
     }
 }
 CalendarPortal.className = 'pds-datepicker-calendar-portal';
-/**
- * The native `<dialog>` or open `popover` (as pds-filter's) the datepicker sits in, so the
- * calendar shares its top layer and a click in it isn't outside it; otherwise `document.body`.
- * `closest()` stops at shadow boundaries and misses one that only wraps slotted content, so this
- * walks assigned slots and shadow hosts, as pds-combobox does.
- */
-function findPortalTarget(from) {
-    const seen = new Set();
-    let current = from;
-    while (current && !seen.has(current)) {
-        seen.add(current);
-        if (current.nodeType === Node.ELEMENT_NODE && isTopLayerHost(current)) {
-            return current;
-        }
-        const assigned = current.nodeType === Node.ELEMENT_NODE ? current.assignedSlot : null;
-        if (assigned) {
-            current = assigned;
-            continue;
-        }
-        const parent = current.parentNode;
-        current = parent instanceof ShadowRoot ? parent.host : parent;
-    }
-    return document.body;
-}
-function isTopLayerHost(el) {
-    // Only an open dialog: inside a closed one, the calendar would be hidden with it.
-    if (el.localName === 'dialog')
-        return el.open;
-    if (!el.hasAttribute('popover'))
-        return false;
-    try {
-        return el.matches(':popover-open');
-    }
-    catch (_a) {
-        // A browser without the Popover API: no top layer to share.
-        return false;
-    }
-}
 
 const DEFAULT_LABELS = {
     'today': 'Today',
@@ -1911,14 +1874,14 @@ const PdsDatepicker = class {
     }
     render() {
         const locale = this.resolvedLocale;
-        return (index.h(index.Host, { key: '82ffd88b7741a90edc28b66a7384178eb2a9a86c', class: { 'pds-datepicker--range': this.range, 'pds-datepicker--time': this.timePicker }, "full-width": this.fullWidth ? 'true' : null, onFocusin: this.onHostFocusIn, onFocusout: this.onHostFocusOut }, index.h("pds-input", { key: 'f2b9aad64d1fe8d94327cc3d4f87cd6904eb3076', ref: (el) => (this.inputEl = el), componentId: this.baseId, label: this.label, hideLabel: this.hideLabel, helperMessage: this.helperMessage, errorMessage: this.errorMessage, invalid: this.invalid || !!this.textError || !!this.valueError(), disabled: this.disabled, readonly: this.readonly, required: this.required, placeholder: this.fieldPlaceholder, fullWidth: this.fullWidth, autocomplete: "off", value: this.text, onClick: this.onFieldClick, onPdsInput: this.onTextInput, onPdsChange: this.onTextChange, onPdsKeyDown: this.onTextKeyDown, onPdsFocus: this.stopInnerEvent, onPdsBlur: this.stopInnerEvent }, this.clearable && !!this.value && this.isInteractive && (index.h("button", {
+        return (index.h(index.Host, { key: 'a761f0ca6eeedcac3e4bd90760aa9781cd37dcdc', class: { 'pds-datepicker--range': this.range, 'pds-datepicker--time': this.timePicker }, "full-width": this.fullWidth ? 'true' : null, onFocusin: this.onHostFocusIn, onFocusout: this.onHostFocusOut }, index.h("pds-input", { key: '2eb04f9fd4e2f7a2437145d250c629c2cc8a0bf6', ref: (el) => (this.inputEl = el), componentId: this.baseId, label: this.label, hideLabel: this.hideLabel, helperMessage: this.helperMessage, errorMessage: this.errorMessage, invalid: this.invalid || !!this.textError || !!this.valueError(), disabled: this.disabled, readonly: this.readonly, required: this.required, placeholder: this.fieldPlaceholder, fullWidth: this.fullWidth, autocomplete: "off", value: this.text, onClick: this.onFieldClick, onPdsInput: this.onTextInput, onPdsChange: this.onTextChange, onPdsKeyDown: this.onTextKeyDown, onPdsFocus: this.stopInnerEvent, onPdsBlur: this.stopInnerEvent }, this.clearable && !!this.value && this.isInteractive && (index.h("button", {
             // Keyed, as is the calendar button: when Clear appears after a pick, the focused
             // calendar button must stay that button rather than be reused as Clear.
             key: "clear", slot: "suffix", type: "button", class: "pds-datepicker__clear", ref: (el) => (this.clearEl = el), "aria-label": this.label ? `${this.clearLabel} ${this.label}` : this.clearLabel,
             // Out of the tab order, as a native search field's clear button is: Tab from a field
             // just emptied would land on it as the change removes it, dropping focus to the page.
             tabindex: "-1", onMouseDown: this.onClearMouseDown, onClick: this.onClearClick
-        }, index.h("pds-icon", { key: 'f2c784e9d6577d4900b7641ee58aa43f5922fc75', icon: index$1.remove, "aria-hidden": "true" }))), index.h("button", { key: "trigger", slot: "suffix", type: "button", class: "pds-datepicker__trigger", ref: (el) => (this.triggerEl = el), "aria-label": this.triggerAccessibleName(locale), "aria-haspopup": "dialog", "aria-expanded": this.isOpen ? 'true' : 'false', disabled: !this.isInteractive, onClick: this.onTriggerClick, onKeyDown: this.onTriggerKeyDown }, index.h("pds-icon", { key: '98b2e773240c8ea2bbd5a1acfa3c9ba74cb7917b', icon: index$1.calendarSimple, "aria-hidden": "true" }))), this.isOpen && this.renderCalendar(locale)));
+        }, index.h("pds-icon", { key: '98c325fbba8ea78b2d409bc77099db3206738508', icon: index$1.remove, "aria-hidden": "true" }))), index.h("button", { key: "trigger", slot: "suffix", type: "button", class: "pds-datepicker__trigger", ref: (el) => (this.triggerEl = el), "aria-label": this.triggerAccessibleName(locale), "aria-haspopup": "dialog", "aria-expanded": this.isOpen ? 'true' : 'false', disabled: !this.isInteractive, onClick: this.onTriggerClick, onKeyDown: this.onTriggerKeyDown }, index.h("pds-icon", { key: 'cb8483febe1b485058b7bb4271b749981a7747a1', icon: index$1.calendarSimple, "aria-hidden": "true" }))), this.isOpen && this.renderCalendar(locale)));
     }
     static get formAssociated() { return true; }
     get el() { return index.getElement(this); }

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

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-jl_Q819j.js');
-require('./keep-hydrated-CiXgkEYd.js');
+var index = require('./index-D9iJuJCP.js');
+require('./keep-hydrated-AKoh0DG4.js');
 
 const pdsDividerCss = () => `.pds-divider{background:var(--pine-color-border);border:0;display:-ms-flexbox;display:flex;height:var(--pine-border-width);margin:0;width:100%}.pds-divider--vertical{height:100%;width:1px}.pds-divider--labeled{-ms-flex-align:center;align-items:center;background:none;color:var(--pine-color-text);font:var(--pine-typography-body-sm-medium);gap:var(--pine-dimension-sm);height:auto;width:auto}.pds-divider--labeled::before,.pds-divider--labeled::after{background:var(--pine-color-border);content:"";-ms-flex:1;flex:1;height:var(--pine-border-width)}.pds-divider__label{text-align:center}.pds-divider--offset-xxs{margin:0 calc(var(--pine-dimension-2xs) * -1);padding:0 var(--pine-dimension-2xs)}.pds-divider--offset-xxs.pds-divider--vertical{margin:calc(var(--pine-dimension-2xs) * -1) 0;padding:var(--pine-dimension-2xs) 0}.pds-divider--offset-xxs.pds-divider--labeled{padding:0}.pds-divider--offset-xs{margin:0 calc(var(--pine-dimension-xs) * -1);padding:0 var(--pine-dimension-xs)}.pds-divider--offset-xs.pds-divider--vertical{margin:calc(var(--pine-dimension-xs) * -1) 0;padding:var(--pine-dimension-xs) 0}.pds-divider--offset-xs.pds-divider--labeled{padding:0}.pds-divider--offset-sm{margin:0 calc(var(--pine-dimension-sm) * -1);padding:0 var(--pine-dimension-sm)}.pds-divider--offset-sm.pds-divider--vertical{margin:calc(var(--pine-dimension-sm) * -1) 0;padding:var(--pine-dimension-sm) 0}.pds-divider--offset-sm.pds-divider--labeled{padding:0}.pds-divider--offset-md{margin:0 calc(var(--pine-dimension-md) * -1);padding:0 var(--pine-dimension-md)}.pds-divider--offset-md.pds-divider--vertical{margin:calc(var(--pine-dimension-md) * -1) 0;padding:var(--pine-dimension-md) 0}.pds-divider--offset-md.pds-divider--labeled{padding:0}.pds-divider--offset-lg{margin:0 calc(var(--pine-dimension-lg) * -1);padding:0 var(--pine-dimension-lg)}.pds-divider--offset-lg.pds-divider--vertical{margin:calc(var(--pine-dimension-lg) * -1) 0;padding:var(--pine-dimension-lg) 0}.pds-divider--offset-lg.pds-divider--labeled{padding:0}.pds-divider--offset-xl{margin:0 calc(var(--pine-dimension-xl) * -1);padding:0 var(--pine-dimension-xl)}.pds-divider--offset-xl.pds-divider--vertical{margin:calc(var(--pine-dimension-xl) * -1) 0;padding:var(--pine-dimension-xl) 0}.pds-divider--offset-xl.pds-divider--labeled{padding:0}.pds-divider--offset-xxl{margin:0 calc(var(--pine-dimension-2xl) * -1);padding:0 var(--pine-dimension-2xl)}.pds-divider--offset-xxl.pds-divider--vertical{margin:calc(var(--pine-dimension-2xl) * -1) 0;padding:var(--pine-dimension-2xl) 0}.pds-divider--offset-xxl.pds-divider--labeled{padding:0}@media (max-width: 767px){.pds-divider--vertical{display:none}}`;
 
@@ -33,7 +33,7 @@ const PdsDivider = class {
         return classNames.join(' ');
     }
     render() {
-        return (index.h(index.Host, { key: 'ef2a5ee85e8f37036be5b8df490683636ffb66f0', id: this.componentId }, this.hasLabel ? (index.h("div", { class: this.classNames(), role: "separator", "aria-label": this.label }, index.h("span", { class: "pds-divider__label", part: "label", "aria-hidden": "true" }, this.label))) : (index.h("hr", { class: this.classNames() }))));
+        return (index.h(index.Host, { key: '072cc8552bd33c4a00d216f15a5a848cfc97fd92', id: this.componentId }, this.hasLabel ? (index.h("div", { class: this.classNames(), role: "separator", "aria-label": this.label }, index.h("span", { class: "pds-divider__label", part: "label", "aria-hidden": "true" }, this.label))) : (index.h("hr", { class: this.classNames() }))));
     }
 };
 PdsDivider.style = pdsDividerCss();

package/dist/cjs/pds-drawer-content.cjs.entry.js

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-jl_Q819j.js');
+var index = require('./index-D9iJuJCP.js');
 var reconnectedContent = require('./reconnected-content-CpnEQcTp.js');
-require('./keep-hydrated-CiXgkEYd.js');
+require('./keep-hydrated-AKoh0DG4.js');
 
 const pdsDrawerContentCss = () => `pds-drawer-content{display:block;-ms-flex:1 1 auto;flex:1 1 auto;min-height:0;width:100%}.pds-drawer-content{-webkit-box-sizing:border-box;box-sizing:border-box;display:block;height:100%;padding:var(--pine-dimension-md);width:100%}.pds-modal--scrollable pds-drawer-content{overflow-y:auto}.pds-modal:not(.pds-modal--scrollable) pds-drawer-content{overflow-y:visible}`;
 
@@ -15,7 +15,7 @@ const PdsDrawerContent = class {
         reconnectedContent.unwrapReconnectedContent(this.el.querySelector('.pds-drawer-content'), '.pds-drawer-content');
     }
     render() {
-        return (index.h("div", { key: 'f307939ab0a94f6a0d8a3675c658def0ded68b98', class: "pds-drawer-content" }, index.h("slot", { key: 'dadac08ac15bb8ded98ea982511e2d57bea9bdca' })));
+        return (index.h("div", { key: 'b15b087506c1292f9d67e531e8d935069749c09d', class: "pds-drawer-content" }, index.h("slot", { key: '9c60ca75c7905e7e994f9c41eee213b962afb833' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/pds-drawer-footer.cjs.entry.js

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-jl_Q819j.js');
+var index = require('./index-D9iJuJCP.js');
 var reconnectedContent = require('./reconnected-content-CpnEQcTp.js');
-require('./keep-hydrated-CiXgkEYd.js');
+require('./keep-hydrated-AKoh0DG4.js');
 
 const pdsDrawerFooterCss = () => `pds-drawer-footer{display:block;-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.pds-drawer__footer{-webkit-border-before:1px solid var(--pine-color-border-subtle);border-block-start:1px solid var(--pine-color-border-subtle);-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-sm);-ms-flex-pack:end;justify-content:flex-end;padding:var(--pine-dimension-md);width:100%}`;
 
@@ -15,7 +15,7 @@ const PdsDrawerFooter = class {
         reconnectedContent.unwrapReconnectedContent(this.el.querySelector('.pds-drawer__footer'), '.pds-drawer__footer');
     }
     render() {
-        return (index.h("footer", { key: 'b58c68d88b467e8baa3682d16f97076d06ea2414', class: "pds-drawer__footer" }, index.h("slot", { key: 'ff2306202c14029b397d40b5bb3d672a8aa571c0' })));
+        return (index.h("footer", { key: 'a4eec0aff617c605b94f8d3b9ec1e2d98cded6fb', class: "pds-drawer__footer" }, index.h("slot", { key: '6dc379c940e37edfd05d99728be9dff58ca1d717' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/pds-drawer-header.cjs.entry.js

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-jl_Q819j.js');
+var index = require('./index-D9iJuJCP.js');
 var reconnectedContent = require('./reconnected-content-CpnEQcTp.js');
-require('./keep-hydrated-CiXgkEYd.js');
+require('./keep-hydrated-AKoh0DG4.js');
 
 const pdsDrawerHeaderCss = () => `pds-drawer-header{display:block;-ms-flex:0 0 auto;flex:0 0 auto;width:100%}.pds-drawer__header{-ms-flex-align:center;align-items:center;-webkit-border-after:1px solid var(--pine-color-border-subtle);border-block-end:1px solid var(--pine-color-border-subtle);-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding:var(--pine-dimension-md);width:100%}`;
 
@@ -15,7 +15,7 @@ const PdsDrawerHeader = class {
         reconnectedContent.unwrapReconnectedContent(this.el.querySelector('.pds-drawer__header'), '.pds-drawer__header');
     }
     render() {
-        return (index.h("header", { key: '280e6ca734317d5733e4c595431c8070eff13d58', class: "pds-drawer__header" }, index.h("slot", { key: 'cc6af6084600c4dc60d7bd99e040376abdf5ffe3' })));
+        return (index.h("header", { key: '6b9338e5dbf7a7e580c11b28c95ca53693528382', class: "pds-drawer__header" }, index.h("slot", { key: '0990fbcf94c0c438b98cf1e8945f1e2fd9aa33dc' })));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -1,9 +1,9 @@
 'use strict';
 
-var index = require('./index-jl_Q819j.js');
+var index = require('./index-D9iJuJCP.js');
 var closest = require('./closest-D0qyYtJ3.js');
 var reconnectedContent = require('./reconnected-content-CpnEQcTp.js');
-require('./keep-hydrated-CiXgkEYd.js');
+require('./keep-hydrated-AKoh0DG4.js');
 
 const pdsDrawerCss = () => `.pds-drawer__modal>.pds-modal__backdrop{-ms-flex-align:stretch;align-items:stretch}.pds-drawer__modal:not(.pds-drawer__modal--modal)>.pds-modal__backdrop{background-color:transparent;pointer-events:none}@supports ((-webkit-backdrop-filter: blur(3px)) or (backdrop-filter: blur(3px))){.pds-drawer__modal:not(.pds-drawer__modal--modal)>.pds-modal__backdrop{-webkit-backdrop-filter:none;backdrop-filter:none}}.pds-drawer__modal:not(.pds-drawer__modal--modal)>.pds-modal__backdrop>*{pointer-events:auto}.pds-drawer__modal>.pds-modal__backdrop[aria-modal]::before{content:none}.pds-drawer__modal>.pds-modal__backdrop>.pds-modal{border-radius:0;height:100%;margin:0;max-height:100%;max-width:100%;pointer-events:auto;width:var(--pds-drawer-width, 500px)}.pds-drawer{display:contents}.pds-drawer.pds-drawer--end .pds-drawer__modal>.pds-modal__backdrop{-ms-flex-pack:end;justify-content:flex-end}.pds-drawer.pds-drawer--start .pds-drawer__modal>.pds-modal__backdrop{-ms-flex-pack:start;justify-content:flex-start}.pds-drawer.pds-drawer--sm{--pds-drawer-width:360px}.pds-drawer.pds-drawer--md{--pds-drawer-width:500px}`;
 
@@ -145,11 +145,11 @@ const PdsDrawer = class {
         this.open = false;
     }
     render() {
-        return (index.h(index.Host, { key: '287bf043c991209488eb1b617031acffb59ff9af', class: {
+        return (index.h(index.Host, { key: '7cf13256457914e48e8fde422832a2a52ee0c13b', class: {
                 'pds-drawer': true,
                 [`pds-drawer--${this.side}`]: true,
                 [`pds-drawer--${this.size}`]: true,
-            } }, index.h("pds-modal", { key: 'cd86fb552353f5cc12fb36fc956033432a91847c', class: { 'pds-drawer__modal': true, 'pds-drawer__modal--modal': this.modal }, ref: (el) => (this.modalEl = el), componentId: this.componentId, open: this.open, scrollable: this.scrollable, disableTopLayer: !this.modal, backdropDismiss: this.lightDismiss, disableInitialFocus: !this.modal && this.initialFocus === 'none' }, index.h("slot", { key: '56bbe9b5c26b10b07c0f503ba147899a57a5de85' }))));
+            } }, index.h("pds-modal", { key: 'd4ceb5b4c0b03930aa3d001ae1bbbfbf449bde33', class: { 'pds-drawer__modal': true, 'pds-drawer__modal--modal': this.modal }, ref: (el) => (this.modalEl = el), componentId: this.componentId, open: this.open, scrollable: this.scrollable, disableTopLayer: !this.modal, backdropDismiss: this.lightDismiss, disableInitialFocus: !this.modal && this.initialFocus === 'none' }, index.h("slot", { key: '41bfdea76282b333ca6950048999cb9d94e69438' }))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-jl_Q819j.js');
-require('./keep-hydrated-CiXgkEYd.js');
+var index = require('./index-D9iJuJCP.js');
+require('./keep-hydrated-AKoh0DG4.js');
 
 const pdsDropdownMenuItemCss = () => `:host{cursor:pointer;display:-ms-flexbox;display:flex;width:100%;}:host(.is-disabled){cursor:not-allowed !important;opacity:0.5 !important}:host(.is-disabled) .pds-dropdown-menu-item__content{cursor:not-allowed !important;pointer-events:none !important}.pds-dropdown-menu-item__content{-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;border-radius:var(--pine-dimension-xs);color:var(--pine-color-text);display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;font:var(--pine-typography-body-medium);gap:var(--pine-dimension-xs);margin:calc(var(--pine-border-width) + 2px);padding:var(--pine-dimension-xs);text-align:start;width:100%;}.pds-dropdown-menu-item__content:hover{background-color:var(--pine-color-background-muted);color:var(--pine-color-text-hover)}.pds-dropdown-menu-item__content{}.pds-dropdown-menu-item__content:focus,.pds-dropdown-menu-item__content:focus-visible,.pds-dropdown-menu-item__content.has-focus{outline:var(--pine-outline-focus);outline-offset:var(--pine-border-width)}:host(.is-informational){cursor:default}:host(.is-informational) .pds-dropdown-menu-item__content:hover{background-color:transparent;color:var(--pine-color-text)}:host(.destructive) .pds-dropdown-menu-item__content{--pds-context-link-color:var(--pine-color-danger);--pds-context-link-color-hover:var(--pine-color-danger-hover);-ms-flex-align:center;align-items:center;color:var(--pine-color-danger)}:host(.destructive) .pds-dropdown-menu-item__content:hover{background-color:var(--pine-color-danger-disabled);color:var(--pine-color-danger-hover)}:host(.destructive) .pds-dropdown-menu-item__content:focus,:host(.destructive) .pds-dropdown-menu-item__content:focus-visible,:host(.destructive) .pds-dropdown-menu-item__content.has-focus{background-color:var(--pine-color-danger-disabled);outline:var(--pine-outline-focus-danger);outline-offset:var(--pine-border-width)}pds-link::part(link):focus,pds-link::part(link):focus-visible{-webkit-box-shadow:none;box-shadow:none;outline:none}pds-link::part(link){-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;gap:var(--pine-dimension-xs);margin:calc(var(--pine-dimension-xs) * -1);padding:var(--pine-dimension-xs);text-decoration:none;width:calc(100% + var(--pine-dimension-xs) * 2)}`;
 
@@ -88,7 +88,7 @@ const PdsDropdownMenuItem = class {
                 }, role: "menuitem", "aria-disabled": "true", part: "button", tabIndex: this.disabled ? -1 : 0, onKeyDown: this.handleInformationalKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur }, index.h("slot", null)));
         }
         if (this.href != null) {
-            return (index.h("pds-link", { download: this.download, href: this.disabled ? null : this.href, external: this.external, target: this.target, class: {
+            return (index.h("pds-link", { download: this.download, href: this.disabled ? null : this.href, external: this.external, externalLabel: this.externalLabel, target: this.target, class: {
                     'pds-dropdown-menu-item__content': true,
                     'has-focus': this.hasFocus
                 }, tabIndex: this.disabled ? -1 : 0, onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur, "aria-disabled": this.disabled ? 'true' : null }, index.h("slot", null)));
@@ -99,7 +99,7 @@ const PdsDropdownMenuItem = class {
             }, tabIndex: this.disabled ? -1 : 0, type: "button", part: "button", onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur, disabled: this.disabled, "aria-disabled": this.disabled ? 'true' : null }, index.h("slot", null)));
     }
     render() {
-        return (index.h(index.Host, { key: '47a62550fde33f892d7af4f4e71b67ebf7aa2c3f', id: this.componentId, class: {
+        return (index.h(index.Host, { key: 'a69947d99160783919f711d7c53e0592694f9565', id: this.componentId, class: {
                 'is-disabled': this.disabled,
                 'is-informational': this.informational,
                 'destructive': !this.disabled && !this.informational && this.destructive

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

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-jl_Q819j.js');
-require('./keep-hydrated-CiXgkEYd.js');
+var index = require('./index-D9iJuJCP.js');
+require('./keep-hydrated-AKoh0DG4.js');
 
 const pdsDropdownMenuSeparatorCss = () => `:host hr{border:0;border-top:var(--pine-border-width-thin) solid var(--pine-color-border);height:0;margin-block:var(--pine-dimension-xs);margin-inline:calc(var(--pine-dimension-xs) * -1)}`;
 
@@ -15,7 +15,7 @@ const PdsDropdownMenuSeparator = class {
         this.disabled = false;
     }
     render() {
-        return (index.h(index.Host, { key: '60407a2edc8b4667d39cbd1ba9a859d09b0b8ff1', id: this.componentId }, index.h("hr", { key: '8485d1c8508c5fe5e3635505f25e278f45f45b82' })));
+        return (index.h(index.Host, { key: '72f29c5015d2379d9986c90ec966f34f41298226', id: this.componentId }, index.h("hr", { key: '72c2155d0fbee6346f3f38997009a7d9e14ad0c8' })));
     }
 };
 PdsDropdownMenuSeparator.style = pdsDropdownMenuSeparatorCss();

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

@@ -1,9 +1,9 @@
 'use strict';
 
-var index = require('./index-jl_Q819j.js');
-var attributes = require('./attributes-BJ7KBHql.js');
-var keepHydrated = require('./keep-hydrated-CiXgkEYd.js');
-var floatingUi_dom = require('./floating-ui.dom-Dc8Anyel.js');
+var index = require('./index-D9iJuJCP.js');
+var attributes = require('./attributes-CW49XqaL.js');
+var keepHydrated = require('./keep-hydrated-AKoh0DG4.js');
+var floatingUi_dom = require('./floating-ui.dom-Dw41zbyY.js');
 
 const pdsDropdownMenuCss = () => `:host{display:block}.is-hidden{display:none}.pds-dropdown-menu--panel{background-color:var(--pine-color-background-overlay);border-radius:var(--pine-dimension-xs);left:var(--pine-dimension-none);min-width:170px;padding:var(--pine-dimension-xs);position:fixed;z-index:var(--pine-z-index-overlay)}:host-context([data-theme=dark]) .pds-dropdown-menu--panel{border:var(--pine-border)}.pds-dropdown-menu__header{-webkit-border-after:var(--pine-border-width-thin) solid var(--pine-color-border);border-block-end:var(--pine-border-width-thin) solid var(--pine-color-border);-webkit-margin-after:var(--pine-dimension-xs);margin-block-end:var(--pine-dimension-xs);margin-inline:calc(var(--pine-dimension-xs) * -1);-webkit-padding-after:var(--pine-dimension-xs);padding-block-end:var(--pine-dimension-xs);padding-inline:calc(var(--pine-dimension-xs) * 2 + var(--pine-border-width) + 2px);text-align:start}.pds-dropdown-menu__items{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}::slotted(a:not([slot=header])),::slotted(button:not([slot=header])){-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;border-radius:var(--pine-dimension-xs) !important;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pine-color-text) !important;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;font:var(--pine-typography-body-medium) !important;gap:var(--pine-dimension-xs);margin:calc(var(--pine-border-width) + 2px) !important;padding:var(--pine-dimension-xs) !important;text-align:start;text-decoration:none !important;width:calc(100% - (var(--pine-border-width) + 2px) * 2)}::slotted(.destructive:not([slot=header])){color:var(--pine-color-danger) !important}::slotted([aria-disabled=true]:not([slot=header])),::slotted([disabled]:not([disabled=false]):not([slot=header])){cursor:not-allowed;opacity:0.5;pointer-events:none}`;
 
@@ -359,7 +359,7 @@ const PdsDropdownMenu = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '1765909c8c3c140e52dc3f6b50693c97d6bcc003', id: this.componentId }, index.h("slot", { key: '0b566cd288428a0694a2d61d4a73bd79def4bfad', name: "trigger", onSlotchange: this.handleTriggerSlotChange }), index.h("pds-box", { key: '16cdfc208cfe7f6e074289c30aa0e1188a34876d', "border-radius": "sm", display: "flex", direction: "column", class: "pds-dropdown-menu--panel is-hidden", shadow: "100", part: "menu-panel" }, index.h("div", { key: 'a28c1736ad02e8ac3d82c0fe1933606a7216989b', class: { 'pds-dropdown-menu__header': true, 'is-hidden': !this.hasHeader } }, index.h("slot", { key: '9c6dfddefb266083f68aa27d6cc01127a69cd1cf', name: "header", onSlotchange: this.handleHeaderSlotChange })), index.h("div", { key: '8cfe85c10f92d4a4ec6b5d2d0264d054a74ba29b', class: "pds-dropdown-menu__items", role: "menu", "aria-orientation": "vertical" }, index.h("slot", { key: '1a5b4aa406d2706ca8cef49deb05140a5763be1c', onSlotchange: this.handleSlotChange })))));
+        return (index.h(index.Host, { key: '0ed3d8ee889a5423ca9de66a86791d084f75abf0', id: this.componentId }, index.h("slot", { key: '6bab71652d6afe094075623d3a48641a4d89b232', name: "trigger", onSlotchange: this.handleTriggerSlotChange }), index.h("pds-box", { key: 'fcef0667f999ae5b8cd03eb94a0db0be7be502cb', "border-radius": "sm", display: "flex", direction: "column", class: "pds-dropdown-menu--panel is-hidden", shadow: "100", part: "menu-panel" }, index.h("div", { key: 'c78d5bd7e48c5483b12171341271f9132f4b2ff9', class: { 'pds-dropdown-menu__header': true, 'is-hidden': !this.hasHeader } }, index.h("slot", { key: '6464994260720d6046da548f4aad0896965cc47c', name: "header", onSlotchange: this.handleHeaderSlotChange })), index.h("div", { key: '3e97dfc4e1911f91ce8917faf981d436e71e5c24', class: "pds-dropdown-menu__items", role: "menu", "aria-orientation": "vertical" }, index.h("slot", { key: 'dfd77a8b73df5ce9eef3e661d3f9501cb8bfdba2', onSlotchange: this.handleSlotChange })))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -1,9 +1,9 @@
 'use strict';
 
-var index = require('./index-jl_Q819j.js');
+var index = require('./index-D9iJuJCP.js');
 var scroll = require('./scroll-2XcoE_6Q.js');
-var index$1 = require('./index-Do70atou.js');
-require('./keep-hydrated-CiXgkEYd.js');
+var index$1 = require('./index-BDnbr0DK.js');
+require('./keep-hydrated-AKoh0DG4.js');
 
 const pdsFilterCss = () => `:host{--box-shadow-focus:0 0 0 1px var(--pine-color-background-container), 0 0 0 3px var(--pine-color-focus-ring);display:inline-block;position:relative}.pds-filter__trigger{-ms-flex-align:center;align-items:center;anchor-name:--filter-trigger;background:var(--pine-color-background-container);border:var(--pine-border);border-radius:var(--pine-dimension-100);-webkit-box-shadow:var(--pine-box-shadow-050);box-shadow:var(--pine-box-shadow-050);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--pine-color-text-tertiary);cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--pine-font-family-inter);font-size:var(--pine-font-size-100);font-weight:var(--pine-font-weight-400);gap:var(--pine-dimension-050);letter-spacing:var(--pine-letter-spacing-114);line-height:var(--pine-line-height-150);padding:var(--pine-dimension-025) var(--pine-dimension-125);position:relative;-webkit-transition:all var(--pine-motion-duration-base) ease;transition:all var(--pine-motion-duration-base) ease}.pds-filter__trigger pds-icon{block-size:var(--pine-font-size-100);color:var(--pine-color-text-secondary);-ms-flex-negative:0;flex-shrink:0;inline-size:var(--pine-font-size-100)}.pds-filter__trigger:hover,.pds-filter__trigger.pds-filter__trigger--open{background-color:var(--pine-color-background-subtle);border-color:var(--pine-color-border-hover);color:var(--pine-color-text-hover)}.pds-filter__trigger:hover pds-icon,.pds-filter__trigger.pds-filter__trigger--open pds-icon{color:var(--pine-color-text-secondary)}.pds-filter__trigger:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__trigger:disabled{cursor:not-allowed;opacity:0.5}.pds-filter__trigger--selected{background-color:var(--pine-color-purple-050);border-color:var(--pine-color-purple-500);color:var(--pine-color-purple-600)}.pds-filter__trigger--selected pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--selected:hover,.pds-filter__trigger--selected.pds-filter__trigger--open{background-color:var(--pine-color-purple-100);border-color:var(--pine-color-purple-500);color:var(--pine-color-purple-600)}.pds-filter__trigger--selected:hover pds-icon,.pds-filter__trigger--selected.pds-filter__trigger--open pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--selected:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__trigger--more{background-color:var(--pine-color-background-container-hover);border:var(--pine-border-width-thin) dashed var(--pine-color-border);color:var(--pine-color-text-tertiary)}.pds-filter__trigger--more pds-icon{color:var(--pine-color-text-secondary)}.pds-filter__trigger--more:hover,.pds-filter__trigger--more.pds-filter__trigger--open{background-color:var(--pine-color-background-subtle);border-color:var(--pine-color-border-hover);color:var(--pine-color-text-hover)}.pds-filter__trigger--more:hover pds-icon,.pds-filter__trigger--more.pds-filter__trigger--open pds-icon{color:var(--pine-color-text-secondary)}.pds-filter__trigger--more:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__trigger--clear{background:transparent;border:var(--pine-border-width-thin) solid transparent;border-radius:var(--pine-dimension-100);-webkit-box-shadow:none;box-shadow:none;color:var(--pine-color-purple-600)}.pds-filter__trigger--clear pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--clear:hover{background-color:var(--pine-color-purple-100);border-color:var(--pine-color-purple-100);color:var(--pine-color-purple-600)}.pds-filter__trigger--clear:hover pds-icon{color:var(--pine-color-purple-600)}.pds-filter__trigger--clear:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-filter__button-content{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;gap:var(--pine-dimension-050);max-inline-size:148px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-filter__button-text{line-height:var(--pine-line-height-150);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-filter__dropdown-icon{block-size:var(--pine-dimension-200);-ms-flex-negative:0;flex-shrink:0;inline-size:var(--pine-dimension-200)}.pds-filter__popover{background-color:var(--pine-color-background-overlay);border:0;border-radius:var(--pine-dimension-100);-webkit-box-shadow:var(--pine-box-shadow-100);box-shadow:var(--pine-box-shadow-100);display:none;inline-size:228px;inset:unset;padding:var(--pine-dimension-100);z-index:var(--pine-z-index-overlay);}.pds-filter__popover:popover-open,.pds-filter__popover.is-open{display:block}.pds-filter__popover{}@supports (anchor-name: --test){.pds-filter__popover{inset-block-start:calc(anchor(--filter-trigger bottom) + var(--pine-dimension-100));inset-inline-start:anchor(--filter-trigger start);position:fixed;position-anchor:--filter-trigger;}.pds-filter__popover.popover-flip-horizontal{inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto}.pds-filter__popover.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}.pds-filter__popover.popover-flip-horizontal.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto;-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}.pds-filter__popover{}.pds-filter__popover.is-open.popover-flip-horizontal{inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto}.pds-filter__popover.is-open.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}.pds-filter__popover.is-open.popover-flip-horizontal.popover-flip-vertical{inset-block-start:anchor(--filter-trigger top);inset-inline-end:anchor(--filter-trigger end);inset-inline-start:auto;-webkit-transform:translateY(calc(-100% - var(--pine-dimension-100)));transform:translateY(calc(-100% - var(--pine-dimension-100)))}}`;
 
@@ -481,7 +481,7 @@ const PdsFilter = class {
         return null;
     }
     render() {
-        return (index.h(index.Host, { key: '3cae951aee1f9c75f3e207cf6c68633a23f8f6dc', id: this.componentId }, index.h("button", { key: 'f4c644710dc936248995be9a49cef8ad13031d61', 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: '2dd87e53f363118becc762051ea1be664258b8b6', class: "pds-filter__button-content", part: "button-content" }, this.renderIcon(), this.text && (index.h("span", { key: '733ceb5e07198e844fbdc1af294d2046c4c571d8', class: "pds-filter__button-text", part: "button-text" }, this.text)), this.renderDropdownIcon())), this.variant !== 'clear' && (index.h("div", { key: 'beb65a21192c6f5c16703aec7ab9a92ea378ef3c', ref: el => this.popoverEl = el, id: `${this.componentId}-popover`, class: "pds-filter__popover", popover: "auto", part: "popover" }, index.h("slot", { key: '5a481cc6b143b059a5fc33d377abe5ab79aefb4e' })))));
+        return (index.h(index.Host, { key: '9b2286e9a0d7f88b7f6bc90f8444185cfec832c8', id: this.componentId }, index.h("button", { key: '968953600d615f2739757a91422dafdb817c9a6f', 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: 'ee479f7e510ffcb54f7857cb7d1345f2a5c1d76a', class: "pds-filter__button-content", part: "button-content" }, this.renderIcon(), this.text && (index.h("span", { key: 'e98aa8b915a2460f3c7d49e20ec7d43853ee5f9f', class: "pds-filter__button-text", part: "button-text" }, this.text)), this.renderDropdownIcon())), this.variant !== 'clear' && (index.h("div", { key: '3084babfba2d96880b2829a60d2ef00140a6813b', ref: el => this.popoverEl = el, id: `${this.componentId}-popover`, class: "pds-filter__popover", popover: "auto", part: "popover" }, index.h("slot", { key: 'e901488be75a18bedc6b2c42be5c398fd2cf2a29' })))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-jl_Q819j.js');
-require('./keep-hydrated-CiXgkEYd.js');
+var index = require('./index-D9iJuJCP.js');
+require('./keep-hydrated-AKoh0DG4.js');
 
 const pdsFiltersCss = () => `:host{display:block}.pds-filters{-ms-flex-align:start;align-items:flex-start;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--pine-dimension-100)}`;
 
@@ -10,7 +10,7 @@ const PdsFilters = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '8688235fe7cdea1b4fc540156ff21bb9711b41b6', id: this.componentId }, index.h("div", { key: 'e51a37977df8c31f99b28d8c7e4bedb0d63e53c6', class: "pds-filters" }, index.h("slot", { key: '8ce936da4d3f0213408090bc3eeb011920f9aa6c' }))));
+        return (index.h(index.Host, { key: '6f785fc222e3b5b7cf932f704b56aa7f1f52ead3', id: this.componentId }, index.h("div", { key: '0ffd2894cdeb1e632228b4c3fa523069dcffa4b2', class: "pds-filters" }, index.h("slot", { key: 'a3f42dedcda1b0fec78a33793d085791d9b9fc5c' }))));
     }
 };
 PdsFilters.style = pdsFiltersCss();

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

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-jl_Q819j.js');
-require('./keep-hydrated-CiXgkEYd.js');
+var index = require('./index-D9iJuJCP.js');
+require('./keep-hydrated-AKoh0DG4.js');
 
 let missingAssetPathWarning = false;
 /**
@@ -345,12 +345,16 @@ const getSvgContent = (url, sanitize = false) => {
 
 const pdsIconCss = () => `:host{--dimension-icon-height:16px;--dimension-icon-width:16px;--color-icon-fill:currentColor;contain:strict;display:inline-block;fill:var(--color-icon-fill);-ms-flex-negative:0;flex-shrink:0;height:var(--dimension-icon-height);width:var(--dimension-icon-width)}:host .pdsicon{fill:var(--color-icon-fill)}.pds-icon-fill-none{fill:none}.icon-inner,.pds-icon,svg{display:block;height:100%;width:100%}:host(.flip-rtl):host-context([dir=rtl]) .icon-inner{-webkit-transform:scaleX(-1);transform:scaleX(-1)}:host(.flip-rtl:dir(rtl)) .icon-inner{-webkit-transform:scaleX(-1);transform:scaleX(-1)}:host(.flip-rtl:dir(ltr)) .icon-inner{-webkit-transform:scaleX(1);transform:scaleX(1)}`;
 
+// The attributes that give an icon its own accessible name.
+const NAMING_ATTRIBUTES = ['aria-label', 'aria-labelledby'];
 const PdsIcon = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.didLoadIcon = false;
         this.iconName = null;
+        this.warnedUnnamedFocusable = false;
         this.inheritedAttributes = {}; // eslint-disable-line @typescript-eslint/no-explicit-any
+        this.isFocusable = false;
         this.isVisible = false;
         /**
          * The size of the icon. This can be
@@ -359,10 +363,6 @@ const PdsIcon = class {
          *
          */
         this.size = 'regular';
-        this.hasAriaHidden = () => {
-            const { el } = this;
-            return el.hasAttribute('aria-hidden') && el.getAttribute('aria-hidden') === 'true';
-        };
     }
     iconSize() {
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -401,9 +401,9 @@ const PdsIcon = class {
         }, 500);
     }
     componentWillLoad() {
-        this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);
+        this.inheritedAttributes = inheritAttributes(this.el, NAMING_ATTRIBUTES);
+        this.isFocusable = this.el.hasAttribute('tabindex');
         this.setCSSVariables();
-        this.setupInitialAriaLabel();
     }
     setCSSVariables() {
         var _a;
@@ -412,6 +412,7 @@ const PdsIcon = class {
         this.el.style.setProperty(`--color-icon-fill`, (_a = normalizeColorValue(this.color)) !== null && _a !== void 0 ? _a : 'currentColor');
     }
     connectedCallback() {
+        this.observeNamingAttributes();
         // Handle re-connection during client-side navigation
         if (!this.isVisible && !this.svgContent) {
             this.waitUntilVisible(this.el, '50px', () => {
@@ -430,14 +431,16 @@ const PdsIcon = class {
             this.io.disconnect();
             this.io = undefined;
         }
+        if (this.mo) {
+            this.mo.disconnect();
+            this.mo = undefined;
+        }
     }
     updateStyles() {
         this.setCSSVariables();
     }
     onIconPropertyChange() {
         this.loadIcon();
-        // Update aria-label when icon properties change
-        this.setupInitialAriaLabel();
     }
     loadIcon() {
         // Reset load state when URL changes
@@ -470,26 +473,56 @@ const PdsIcon = class {
         this.iconName = getName(this.name, this.icon);
     }
     render() {
-        const { ariaLabel, flipRtl, iconName, inheritedAttributes } = this;
+        const { flipRtl, iconName, inheritedAttributes } = this;
         const shouldIconAutoFlip = iconName
             ? shouldRtlFlipIcon(iconName, this.el) && flipRtl !== false
             : false;
         const shouldFlip = flipRtl || shouldIconAutoFlip;
-        // Use inherited aria-label if provided, otherwise fall back to auto-generated one
-        const finalAriaLabel = inheritedAttributes['aria-label'] || ariaLabel;
-        return (index.h(index.Host, Object.assign({ key: '3af1c02235a2645bc3bb300831b19779cca78827', "aria-label": finalAriaLabel !== undefined && !this.hasAriaHidden() ? finalAriaLabel : null, alt: "", role: "img", class: Object.assign(Object.assign({}, createColorClasses(this.color)), { 'flip-rtl': shouldFlip, 'icon-rtl': shouldFlip && isRTL(this.el) }) }, inheritedAttributes), this.svgContent ? (index.h("div", { class: "icon-inner", innerHTML: this.svgContent })) : (index.h("div", { class: "icon-inner" }))));
+        // An icon is decorative unless the author names it. A decorative icon is hidden
+        // from assistive technology, so it contributes nothing to the accessible name of
+        // the button or link it sits inside. Naming it from `name` instead would put an
+        // icon id ("rocket-tone") into that control's name, where neither a screen reader
+        // nor a page-inspecting agent can tell it apart from the real label.
+        //
+        // A focusable icon stays exposed even without a name: hiding something that
+        // takes focus leaves keyboard users on an element a screen reader can't see.
+        const isNamed = NAMING_ATTRIBUTES.some((attr) => inheritedAttributes[attr] !== undefined);
+        const isDecorative = !isNamed && !this.isFocusable;
+        return (index.h(index.Host
+        // undefined, not null: null would strip an aria-hidden the author set on a
+        // named icon once the component re-renders.
+        , Object.assign({ key: '6597475535756e7174072dc25c982137724d439d', "aria-hidden": isDecorative ? 'true' : undefined, alt: "", role: isDecorative ? null : 'img', class: Object.assign(Object.assign({}, createColorClasses(this.color)), { 'flip-rtl': shouldFlip, 'icon-rtl': shouldFlip && isRTL(this.el) }) }, inheritedAttributes), this.svgContent ? (index.h("div", { class: "icon-inner", innerHTML: this.svgContent })) : (index.h("div", { class: "icon-inner" }))));
     }
     /*****
      * Private Methods
      ****/
-    setupInitialAriaLabel() {
-        // Only set aria-label during initial load if one isn't already provided
-        if (!this.inheritedAttributes['aria-label']) {
-            const iconName = getName(this.name, this.icon);
-            if (iconName) {
-                this.ariaLabel = iconName.replace(/\-/g, ' ');
-            }
-        }
+    // The hide/expose decision reads the naming attributes and tabindex, which can
+    // change after load (a React prop going from undefined to a string, or
+    // setAttribute from script). Re-read them when they do.
+    observeNamingAttributes() {
+        if (typeof MutationObserver === 'undefined' || this.mo)
+            return;
+        this.mo = new MutationObserver(() => {
+            const next = Object.assign({}, this.inheritedAttributes);
+            let changed = false;
+            NAMING_ATTRIBUTES.forEach((attr) => {
+                var _a;
+                const value = (_a = this.el.getAttribute(attr)) !== null && _a !== void 0 ? _a : undefined;
+                if (next[attr] !== value) {
+                    if (value === undefined) {
+                        delete next[attr];
+                    }
+                    else {
+                        next[attr] = value;
+                    }
+                    changed = true;
+                }
+            });
+            if (changed)
+                this.inheritedAttributes = next;
+            this.isFocusable = this.el.hasAttribute('tabindex');
+        });
+        this.mo.observe(this.el, { attributes: true, attributeFilter: [...NAMING_ATTRIBUTES, 'tabindex'] });
     }
     waitUntilVisible(el, rootMargin, cb) {
         if (typeof window !== 'undefined' && (window).IntersectionObserver) {

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

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-jl_Q819j.js');
-require('./keep-hydrated-CiXgkEYd.js');
+var index = require('./index-D9iJuJCP.js');
+require('./keep-hydrated-AKoh0DG4.js');
 
 const pdsImageCss = () => `:host{--dimension-aspect-ratio:auto;display:inline-block}img{aspect-ratio:var(--dimension-aspect-ratio);display:block;height:auto;max-width:100%}`;
 
@@ -22,9 +22,9 @@ const PdsImage = class {
         this.loading = 'eager';
     }
     render() {
-        return (index.h(index.Host, { key: '1e8bb3882c2a629004ce1441e85d5c5a75a84e98', class: {
+        return (index.h(index.Host, { key: '6d2d48c468c39f53d67e63999dd83f3ad61053b5', class: {
                 'pds-image': true,
-            }, id: this.componentId }, index.h("img", { key: 'b50b19d51431d45027c7a918a4ba4c38493741d5', alt: this.alt, height: this.height, loading: this.loading, sizes: this.sizes, src: this.src, srcset: this.srcset, width: this.width })));
+            }, id: this.componentId }, index.h("img", { key: '393cc584586e37e8d5b602fbdcda1783bf80cf9b', alt: this.alt, height: this.height, loading: this.loading, sizes: this.sizes, src: this.src, srcset: this.srcset, width: this.width })));
     }
 };
 PdsImage.style = pdsImageCss();

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

@@ -1,11 +1,11 @@
 'use strict';
 
-var index = require('./index-jl_Q819j.js');
+var index = require('./index-D9iJuJCP.js');
 var form = require('./form-MhwfKTuo.js');
-var attributes = require('./attributes-BJ7KBHql.js');
+var attributes = require('./attributes-CW49XqaL.js');
 var utils = require('./utils-BhRmyxT8.js');
-var index$1 = require('./index-Do70atou.js');
-require('./keep-hydrated-CiXgkEYd.js');
+var index$1 = require('./index-BDnbr0DK.js');
+require('./keep-hydrated-AKoh0DG4.js');
 
 const pdsInputTokensCss = () => `:host{--pine-input-color-background-danger:var(--pine-color-red-050)}`;
 
@@ -298,10 +298,10 @@ const PdsInput = class {
             'has-prepend': this.hasPrepend,
             'has-append': this.hasAppend,
         };
-        return (index.h(index.Host, { key: '75eb8bc6cda5e947f8677ebefe7995688f03f947', "aria-disabled": this.disabled ? 'true' : null, "aria-readonly": this.readonly ? 'true' : null, "has-prefix": this.hasPrefix ? 'true' : null, "has-suffix": this.hasSuffix ? 'true' : null, "has-prepend": this.hasPrepend ? 'true' : null, "has-append": this.hasAppend ? 'true' : null, "has-action": this.hasAction && !this.hideLabel ? 'true' : null, "full-width": this.fullWidth ? 'true' : null }, index.h("div", { key: '93d7f90b9a64daccea1533abc08a8cb18825b828', class: "pds-input" }, label && (index.h("div", { key: '948109b3bfa1a1b8171572da9160425e3e35a7a6', class: {
+        return (index.h(index.Host, { key: '1706e29a68d25a8bb83c36d6bddace04a448f6f5', "aria-disabled": this.disabled ? 'true' : null, "aria-readonly": this.readonly ? 'true' : null, "has-prefix": this.hasPrefix ? 'true' : null, "has-suffix": this.hasSuffix ? 'true' : null, "has-prepend": this.hasPrepend ? 'true' : null, "has-append": this.hasAppend ? 'true' : null, "has-action": this.hasAction && !this.hideLabel ? 'true' : null, "full-width": this.fullWidth ? 'true' : null }, index.h("div", { key: '1488b6ea995c4ffc4068757f566494c0ac073950', class: "pds-input" }, label && (index.h("div", { key: 'e2fe4e461e626648ec51882e92e02fea179e3e13', class: {
                 'pds-input__label-wrapper': true,
                 'visually-hidden': this.hideLabel,
-            } }, index.h("label", { key: 'bb0e6c6febb97ad4aa3942ac5e67ac42dc1bde0a', htmlFor: componentId, class: "pds-input__label" }, index.h("span", { key: 'c6a122f829aa3b92ccb715c3f3975f6baadb3028' }, label, this.required && index.h("span", { key: 'dce7d1a9c010a545992734bd238e9f6a4ca7b4ce', class: "pds-input__required-indicator" }, " *"))), !this.hideLabel && this.renderAction())), index.h("div", { key: '1b92ab5d649a4a9cf8112ea9b8a8a1095714f6d0', class: inputWrapperClasses }, this.renderPrepend(), this.renderPrefix(), index.h("input", Object.assign({ key: 'bc3c4b907312149d375bb78f9912e4501da59348', ref: (input) => (this.nativeInput = input), class: "pds-input__field", "aria-describedby": form.assignDescription(componentId, invalid, helperMessage, errorMessage), "aria-invalid": invalid ? "true" : undefined, autocomplete: this.autocomplete, disabled: disabled, id: componentId, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, step: this.step, type: this.type, value: value, onInput: this.onInputEvent, onChange: this.onChangeEvent, onBlur: this.onBlurEvent, onFocus: this.onFocusEvent, onKeyDown: this.onKeyDownEvent, onCompositionstart: this.onCompositionStart, onCompositionend: this.onCompositionEnd }, this.inheritedAttributes)), this.renderSuffix(), this.renderAppend()), helperMessage && (index.h("p", { key: 'f7bcbafc17a20310d602fce14a0adad522acbcb1', class: "pds-input__helper-message", id: form.messageId(componentId, 'helper') }, helperMessage)), errorMessage && (index.h("p", { key: 'bbbd6dc3203b89e5759587147de74d2ce3ce6177', class: "pds-input__error-message", id: form.messageId(componentId, 'error') }, index.h("pds-icon", { key: '68a6a92c82c1756ad99f431e0cb56756e3cdf75c', "aria-hidden": "true", icon: index$1.danger, size: "small" }), errorMessage)))));
+            } }, index.h("label", { key: 'c926a6fbb3130afdc6c86d509b92fb6650391c4b', htmlFor: componentId, class: "pds-input__label" }, index.h("span", { key: 'dbbaf9d0db49f949f69f1faf848e7c6193e32793' }, label, this.required && index.h("span", { key: '42e6325a0f5ee276ed92cf2eb71942c268c3d1aa', class: "pds-input__required-indicator" }, " *"))), !this.hideLabel && this.renderAction())), index.h("div", { key: '4715743733f2d7d3e4edf9ac4ab6d69ffde04d00', class: inputWrapperClasses }, this.renderPrepend(), this.renderPrefix(), index.h("input", Object.assign({ key: '438ac0fc6d497a8227c83e628d29d4633ffc208a', ref: (input) => (this.nativeInput = input), class: "pds-input__field", "aria-describedby": form.assignDescription(componentId, invalid, helperMessage, errorMessage), "aria-invalid": invalid ? "true" : undefined, autocomplete: this.autocomplete, disabled: disabled, id: componentId, max: this.max, maxlength: this.maxlength, min: this.min, minlength: this.minlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, step: this.step, type: this.type, value: value, onInput: this.onInputEvent, onChange: this.onChangeEvent, onBlur: this.onBlurEvent, onFocus: this.onFocusEvent, onKeyDown: this.onKeyDownEvent, onCompositionstart: this.onCompositionStart, onCompositionend: this.onCompositionEnd }, this.inheritedAttributes)), this.renderSuffix(), this.renderAppend()), helperMessage && (index.h("p", { key: '43b5c3a332072f19a38be316565602932c61504d', class: "pds-input__helper-message", id: form.messageId(componentId, 'helper') }, helperMessage)), errorMessage && (index.h("p", { key: '54fd4fc2dcbc645377edbe4d04cfd82c7d1591e8', class: "pds-input__error-message", id: form.messageId(componentId, 'error') }, index.h("pds-icon", { key: '2bd509a575ec5c7a548955dd7f706d7c1d42557e', "aria-hidden": "true", icon: index$1.danger, size: "small" }), errorMessage)))));
     }
     static get formAssociated() { return true; }
     get el() { return index.getElement(this); }