@pine-ds/core 3.28.0 → 3.30.0

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

@@ -121,13 +121,13 @@ export class PdsToast {
         return this.icon && h("pds-icon", { name: this.icon, class: "pds-toast__icon" });
     }
     render() {
-        return (h(Host, { key: 'a1ec97158a6665aa25b58b1954b4b5c622590615', hidden: !this.isVisible }, h("div", { key: 'd9b01164364c76512852a260cede50000b73a563', class: {
+        return (h(Host, { key: '87c9b15656a2765eb9e722c85dba5c5edbe07c42', hidden: !this.isVisible }, h("div", { key: 'bd8b26ef0c33b96603313bce74505953d8fe7410', class: {
                 'pds-toast': true,
                 [`pds-toast--${this.type}`]: this.type !== 'default',
                 'pds-toast--animating-out': this.isAnimatingOut
-            }, role: "alert", "aria-live": "polite" }, this.renderIcon(), h("span", { key: '1f581c7c29ea3fc795dfca061d3575c5a9895b3c', class: "pds-toast__message" }, h("slot", { key: '645b31eae3be23de63ab2562234caf0be2510645' })), this.dismissible && (h("button", { key: '44a62b304468c0fca0b8d490ad9c8b5932176ac9', type: "button", part: "dismiss", class: "pds-toast__button", onClick: () => {
+            }, role: "alert", "aria-live": "polite" }, this.renderIcon(), h("span", { key: '5f7fd6b70fe130d8b0915da07640bec01b3b2bcb', class: "pds-toast__message" }, h("slot", { key: '4aa0cf737b420ae51297126b423b44d2a8610226' })), this.dismissible && (h("button", { key: 'a8b8e5e9ba956b2d9cca284d114afa37b80570cf', type: "button", part: "dismiss", class: "pds-toast__button", onClick: () => {
                 this.dismiss();
-            }, "aria-label": this.dismissLabel }, h("pds-icon", { key: 'fde63f279f696d9f02875cc1beee3542c97f0c7e', name: "remove" }))))));
+            }, "aria-label": this.dismissLabel }, h("pds-icon", { key: 'dac8f2099b2ab8a68d208aac288d48019df6d7e7', name: "remove" }))))));
     }
     static get is() { return "pds-toast"; }
     static get encapsulation() { return "shadow"; }

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

@@ -312,9 +312,9 @@ export class PdsTooltip {
     }
     render() {
         const hostId = this.componentId || undefined;
-        return (h(Host, { key: '4e6188e03c2f1d33e571b96a3006a585840716bd', id: hostId, class: { 'pds-tooltip--is-open': this.opened } }, h("span", { key: '0b82d180295421c32548577fb2038422b8ebd3be', class: "pds-tooltip__trigger", onMouseEnter: this.handleShow, onMouseLeave: this.handleHide,
+        return (h(Host, { key: '6af9c969e0dae4f3969cba2153797a1bccfc6d21', id: hostId, class: { 'pds-tooltip--is-open': this.opened } }, h("span", { key: '97c48a8b8d626ee913412bd55aefb17f36fad401', 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 }, h("slot", { key: '661014ee46b11bcc906e7b64ef8c8a5739d459f0' })), h("div", { key: '1861ce9b260f5f7d2eb0a1f337dadd63a0dfee97', class: "pds-tooltip__content-slot-wrapper", hidden: true }, h("slot", { key: '963fb263c72fba432c2b672a2c3e85ca524f2b67', name: "content" }))));
+            onFocusin: this.handleShow, onFocusout: this.handleHide, ref: el => this.triggerEl = el }, h("slot", { key: '37715fc0bf525695a62af1944ff853228080302a' })), h("div", { key: 'a9a925b1de9ea45d2f6b9f39ec5e386537313217', class: "pds-tooltip__content-slot-wrapper", hidden: true }, h("slot", { key: '1486b30af21dc69758d7dc9890cbaf227bafffc7', name: "content" }))));
     }
     static get is() { return "pds-tooltip"; }
     static get originalStyleUrls() {

package/dist/collection/utils/form.js

@@ -6,14 +6,18 @@ export const messageId = (id, messageType) => {
 };
 /**
  * Assign aria-description id to relate messages with form element
+ *
+ * Returns the error message id when invalid, otherwise the helper message id.
+ * Pass only messages the component renders — a described id must exist in the DOM.
  */
-export const assignDescription = (id, invalid, helperMessage) => {
-    if (!helperMessage)
-        return;
-    let relatedId = messageId(id, 'helper');
-    if (invalid)
-        relatedId = messageId(id, 'error');
-    return relatedId;
+export const assignDescription = (id, invalid, helperMessage, errorMessage) => {
+    const hasErrorMessage = Boolean(errorMessage);
+    const hasHelperMessage = Boolean(helperMessage);
+    if (invalid && hasErrorMessage)
+        return messageId(id, 'error');
+    if (hasHelperMessage)
+        return messageId(id, 'helper');
+    return undefined;
 };
 /**
  * Updates the `invalid` prop of a form element based on it's values validity

package/dist/docs.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2026-08-07T01:13:40",
+  "timestamp": "2026-08-27T21:56:56",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.43.5",
@@ -705,6 +705,10 @@
         {
           "name": "part",
           "text": "image - The main image element that represents the avatar component."
+        },
+        {
+          "name": "part",
+          "text": "initials - The text element that renders the avatar's initials, for restyling their color."
         }
       ],
       "usage": {},
@@ -906,6 +910,101 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "status",
+          "type": "\"away\" | \"offline\" | \"online\"",
+          "complexType": {
+            "original": "'online' | 'away' | 'offline' | null",
+            "resolved": "\"away\" | \"offline\" | \"online\"",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "status",
+          "reflectToAttr": true,
+          "docs": "Displays a presence status indicator (a dot) on the avatar: `online`\n(success), `away` (warning), or `offline` (neutral). For a simple\nactive/inactive presence, map active to `online` and inactive to `offline`.\nTakes precedence over `badge` — they share the same corner, so the badge is\nhidden while `status` is set.",
+          "docsTags": [
+            {
+              "name": "defaultValue",
+              "text": "null"
+            }
+          ],
+          "default": "null",
+          "values": [
+            {
+              "value": "away",
+              "type": "string"
+            },
+            {
+              "value": "offline",
+              "type": "string"
+            },
+            {
+              "value": "online",
+              "type": "string"
+            }
+          ],
+          "optional": true,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "statusLabel",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "status-label",
+          "reflectToAttr": false,
+          "docs": "Accessible label for the presence status indicator. Pass a translated\nstring to localize it; defaults to English (`\"{status} status\"`). Has no\neffect on dropdown avatars, where the trigger's `triggerLabel` owns the\naccessible name — fold presence into `triggerLabel` there.",
+          "docsTags": [
+            {
+              "name": "defaultValue",
+              "text": "null"
+            }
+          ],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": true,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "statusRing",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "status-ring",
+          "reflectToAttr": false,
+          "docs": "Determines whether a ring is shown around the avatar in the `status` color.\nHas no effect unless `status` is set.",
+          "docsTags": [
+            {
+              "name": "defaultValue",
+              "text": "false"
+            }
+          ],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": true,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "triggerLabel",
           "type": "string",
@@ -987,6 +1086,14 @@
         {
           "name": "image",
           "docs": "The main image element that represents the avatar component."
+        },
+        {
+          "name": "initials",
+          "docs": "The text element that renders the avatar's initials, for restyling their color."
+        },
+        {
+          "name": "status",
+          "docs": ""
         }
       ],
       "states": [],
@@ -11749,7 +11856,7 @@
       "docsTags": [
         {
           "name": "part",
-          "text": "button - Exposes the button element for styling."
+          "text": "button - Exposes the underlying button (or anchor) element for styling, including custom size, shape, or surface on icon-only placements (e.g. a compact square or inverse icon button)."
         },
         {
           "name": "part",
@@ -12272,7 +12379,7 @@
       "parts": [
         {
           "name": "button",
-          "docs": "Exposes the button element for styling."
+          "docs": "Exposes the underlying button (or anchor) element for styling, including custom size, shape, or surface on icon-only placements (e.g. a compact square or inverse icon button)."
         },
         {
           "name": "button-content",
@@ -13604,6 +13711,29 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "errorMessage",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "error-message",
+          "reflectToAttr": false,
+          "docs": "Error message to display.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": true,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "fetchTimeout",
           "type": "number",
@@ -13662,6 +13792,29 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "helperMessage",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "helper-message",
+          "reflectToAttr": false,
+          "docs": "Helper message to display below the combobox.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": true,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "hideLabel",
           "type": "boolean",
@@ -13691,6 +13844,29 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "invalid",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "invalid",
+          "reflectToAttr": false,
+          "docs": "If true, the combobox is in an invalid state.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": true,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "label",
           "type": "string",
@@ -16537,6 +16713,35 @@
       ],
       "usage": {},
       "props": [
+        {
+          "name": "active",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "active",
+          "reflectToAttr": true,
+          "docs": "Marks the link as the current/active navigation item — for tab strips and\nnav rails built from links. Applies the active treatment (persistent\nunderline + strong text) and sets `aria-current=\"page\"`.",
+          "docsTags": [
+            {
+              "name": "defaultValue",
+              "text": "false"
+            }
+          ],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "color",
           "type": "string",
@@ -17255,6 +17460,35 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "disableTopLayer",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "disable-top-layer",
+          "reflectToAttr": false,
+          "docs": "Whether the modal opens outside the browser top layer as a non-modal dialog.\nWhen `true` it opens with `dialog.show()` instead of `dialog.showModal()`, so\noverlays rendered elsewhere in the DOM (file pickers, editor menus) can display\nabove it via `z-index`. The page is not made inert and focus is not trapped in\nthis mode. Read when the modal opens; changing it while the modal is open is\nnot supported.",
+          "docsTags": [
+            {
+              "name": "default",
+              "text": "false"
+            }
+          ],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "open",
           "type": "boolean",
@@ -22028,6 +22262,35 @@
       "docsTags": [],
       "usage": {},
       "props": [
+        {
+          "name": "active",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "active",
+          "reflectToAttr": false,
+          "docs": "Marks this tab as the current one in navigation mode (`href` set). Applies\nthe active treatment and `aria-current=\"page\"`. Ignored in panel mode, where\nthe active tab is derived from the parent's `activeTabName`.",
+          "docsTags": [
+            {
+              "name": "defaultValue",
+              "text": "false"
+            }
+          ],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": true,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "disabled",
           "type": "boolean",
@@ -22057,6 +22320,29 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "href",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "href",
+          "reflectToAttr": false,
+          "docs": "Turns the tab into a navigation link to this URL. When set, the tab renders\nan `<a href>` (marked `aria-current=\"page\"` when `active`) instead of a\n`role=\"tab\"` button, so each tab is its own page/URL — for tab strips that\nnavigate rather than switch in-page panels. Pairs with `pds-tabs` navigation\nmode; no `pds-tabpanel`s are needed. Apply `href` to all tabs in a\n`pds-tabs` or none — mixing navigation and panel tabs is not supported.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": true,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "name",
           "type": "string",
@@ -22079,6 +22365,93 @@
           "required": true,
           "getter": false,
           "setter": false
+        },
+        {
+          "name": "target",
+          "type": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\"",
+          "complexType": {
+            "original": "'_blank' | '_self' | '_parent' | '_top'",
+            "resolved": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\"",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "target",
+          "reflectToAttr": false,
+          "docs": "Where to open the linked URL, in navigation mode. Maps to the anchor's\n`target` attribute.",
+          "docsTags": [],
+          "values": [
+            {
+              "value": "_blank",
+              "type": "string"
+            },
+            {
+              "value": "_parent",
+              "type": "string"
+            },
+            {
+              "value": "_self",
+              "type": "string"
+            },
+            {
+              "value": "_top",
+              "type": "string"
+            }
+          ],
+          "optional": true,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "turboAction",
+          "type": "\"advance\" | \"replace\"",
+          "complexType": {
+            "original": "'advance' | 'replace'",
+            "resolved": "\"advance\" | \"replace\"",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "turbo-action",
+          "reflectToAttr": false,
+          "docs": "Navigation mode: the Turbo visit action. Maps to `data-turbo-action` on the\nanchor (`advance` gives each tab its own history entry).",
+          "docsTags": [],
+          "values": [
+            {
+              "value": "advance",
+              "type": "string"
+            },
+            {
+              "value": "replace",
+              "type": "string"
+            }
+          ],
+          "optional": true,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "turboFrame",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "turbo-frame",
+          "reflectToAttr": false,
+          "docs": "Navigation mode: the Turbo Frame to target. Maps to `data-turbo-frame` on the\nanchor, so a tab can swap a single frame (e.g. a page body) while leaving the\nrest of the page in place.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": true,
+          "required": false,
+          "getter": false,
+          "setter": false
         }
       ],
       "methods": [],
@@ -23043,15 +23416,15 @@
           "mutable": true,
           "attr": "active-tab-name",
           "reflectToAttr": false,
-          "docs": "Sets the starting active tab name and maintains the name as the component re-renders",
+          "docs": "Sets the starting active tab name and maintains the name as the component re-renders.\nPanel mode only — in navigation mode (`nav`) the active tab is set per-tab via\n`active`, so this is not required there.",
           "docsTags": [],
           "values": [
             {
               "type": "string"
             }
           ],
-          "optional": false,
-          "required": true,
+          "optional": true,
+          "required": false,
           "getter": false,
           "setter": false
         },
@@ -23078,6 +23451,93 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "divider",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "divider",
+          "reflectToAttr": false,
+          "docs": "Adds a divider rule beneath the tab list.",
+          "docsTags": [
+            {
+              "name": "defaultValue",
+              "text": "false"
+            }
+          ],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": true,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "nav",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "nav",
+          "reflectToAttr": false,
+          "docs": "Renders the tab strip as navigation instead of an in-page panel switcher: each\n`pds-tab` becomes an `<a href>` inside a `<nav>` landmark (with `aria-current`\non the `active` tab) rather than a `role=\"tab\"` button over a `pds-tabpanel`.\nGive every `pds-tab` an `href` and omit `pds-tabpanel`s.",
+          "docsTags": [
+            {
+              "name": "defaultValue",
+              "text": "false"
+            }
+          ],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": true,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
+        {
+          "name": "stretch",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "stretch",
+          "reflectToAttr": false,
+          "docs": "Stretches the component so the active tab panel fills the remaining height.\nRequires the component to have a constrained height (e.g. a flex parent).",
+          "docsTags": [
+            {
+              "name": "defaultValue",
+              "text": "false"
+            }
+          ],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": true,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "tablistLabel",
           "type": "string",

package/dist/esm/{form-C3xDZBme.js → form-BuRbS7Hp.js}

@@ -6,14 +6,18 @@ const messageId = (id, messageType) => {
 };
 /**
  * Assign aria-description id to relate messages with form element
+ *
+ * Returns the error message id when invalid, otherwise the helper message id.
+ * Pass only messages the component renders — a described id must exist in the DOM.
  */
-const assignDescription = (id, invalid, helperMessage) => {
-    if (!helperMessage)
-        return;
-    let relatedId = messageId(id, 'helper');
-    if (invalid)
-        relatedId = messageId(id, 'error');
-    return relatedId;
+const assignDescription = (id, invalid, helperMessage, errorMessage) => {
+    const hasErrorMessage = Boolean(errorMessage);
+    const hasHelperMessage = Boolean(helperMessage);
+    if (invalid && hasErrorMessage)
+        return messageId(id, 'error');
+    if (hasHelperMessage)
+        return messageId(id, 'helper');
+    return undefined;
 };
 /**
  * Updates the `invalid` prop of a form element based on it's values validity

package/dist/esm/{index-D4ys0pep.js → index-BjlFq0VD.js}

@@ -1,4 +1,4 @@
-/* pds-icons v9.21.0, ES Modules */
+/* pds-icons v10.2.0, ES Modules */
 
 const addCircle = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' class='pdsicon'><path fill-rule='evenodd' d='M12 3a9 9 0 1 0 0 18 9 9 0 0 0 0-18M1 12C1 5.925 5.925 1 12 1s11 4.925 11 11-4.925 11-11 11S1 18.075 1 12m11-5a1 1 0 0 1 1 1v3h3a1 1 0 1 1 0 2h-3v3a1 1 0 1 1-2 0v-3H8a1 1 0 1 1 0-2h3V8a1 1 0 0 1 1-1'/></svg>";
 const caretDown = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' class='pdsicon'><path fill-rule='evenodd' d='M5.293 8.293a1 1 0 0 1 1.414 0L12 13.586l5.293-5.293a1 1 0 1 1 1.414 1.414l-6 6a1 1 0 0 1-1.414 0l-6-6a1 1 0 0 1 0-1.414'/></svg>";