@pantheon-systems/pds-toolkit-react 2.0.0-alpha.26 → 2.0.0-alpha.28

package/dist/index.js

@@ -2033,7 +2033,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
     restMs: 300,
     delay: { open: 100, close: 0 },
     move: !1
-  }), M = Zt(E, { enabled: !l }), y = We(E), N = n2(E, { role: "tooltip" }), { getFloatingProps: I, getReferenceProps: x } = Ue([
+  }), M = Zt(E, { enabled: !l }), y = We(E), N = n2(E, { role: "tooltip" }), { getFloatingProps: D, getReferenceProps: x } = Ue([
     k,
     M,
     y,
@@ -2077,7 +2077,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
         pointerEvents: g ? "auto" : "none",
         transition: "var(--pds-animation-transition-reveal)"
       },
-      ...I()
+      ...D()
     },
     n
   )));
@@ -2474,8 +2474,8 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
         y = "l", N = "l";
         break;
     }
-    let I = "monochromatic";
-    ["primary"].includes(u) && (I = "monochromatic-reverse");
+    let D = "monochromatic";
+    ["primary"].includes(u) && (D = "monochromatic-reverse");
     const z = /* @__PURE__ */ e.createElement(
       G,
       {
@@ -2510,7 +2510,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
         D2,
         {
           className: `${b}__working-indicator`,
-          colorType: I,
+          colorType: D,
           size: N
         }
       ),
@@ -2634,12 +2634,12 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
         M = "m", k = 8;
         break;
     }
-    const y = o !== null, N = ge(null), I = ge(null), x = () => {
-      N.current.classList.add(C.fadeOut), N.current.classList.add(C.hide), I.current.classList.remove(C.hide), I.current.classList.add(C.scaleIn), setTimeout(() => {
+    const y = o !== null, N = ge(null), D = ge(null), x = () => {
+      N.current.classList.add(C.fadeOut), N.current.classList.add(C.hide), D.current.classList.remove(C.hide), D.current.classList.add(C.scaleIn), setTimeout(() => {
         N.current.classList.remove(
           C.fadeOut,
           C.hide
-        ), N.current.classList.add(C.scaleIn), I.current.classList.remove(C.scaleIn), I.current.classList.add(C.hide);
+        ), N.current.classList.add(C.scaleIn), D.current.classList.remove(C.scaleIn), D.current.classList.add(C.hide);
       }, 2e3);
     }, z = (R) => {
       y && x(), i && i(R);
@@ -2653,7 +2653,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
     )), /* @__PURE__ */ e.createElement(
       "div",
       {
-        ref: I,
+        ref: D,
         className: `${h}__icon-wrapper ${C.hide}`
       },
       /* @__PURE__ */ e.createElement(
@@ -2847,10 +2847,10 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
       V2({
         apply({ availableHeight: Z, elements: H, rects: O }) {
           if (H.floating) {
-            const D = {
+            const I = {
               maxHeight: `${Z}px`
             };
-            E && (D.minHeight = "var(--pds-spacing-3xl)", D.minWidth = `${O.reference.width}px`), Object.assign(H.floating.style, D);
+            E && (I.minHeight = "var(--pds-spacing-3xl)", I.minWidth = `${O.reference.width}px`), Object.assign(H.floating.style, I);
           }
         },
         padding: { top: 12, right: 24, bottom: 24, left: 24 }
@@ -2865,7 +2865,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
   }), y = k2(C, {
     enabled: n,
     event: "mousedown"
-  }), N = We(C), I = n2(C, { role: i }), x = f1(C, {
+  }), N = We(C), D = n2(C, { role: i }), x = f1(C, {
     enabled: r,
     move: !1,
     delay: { open: 100, close: 0 },
@@ -2893,7 +2893,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
     },
     findMatch: K4
   }), { getFloatingProps: P, getItemProps: R, getReferenceProps: V } = Ue(
-    [y, N, I, x, z, L]
+    [y, N, D, x, z, L]
   ), { isMounted: U, styles: F } = Qe(
     C,
     c ? {
@@ -2947,7 +2947,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
     listRef: M,
     refs: y,
     setIsOpen: N,
-    transitionStyles: I
+    transitionStyles: D
   } = r2({
     enableClick: !n,
     enableShift: !1,
@@ -3136,7 +3136,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
           role: "menu",
           style: {
             ..._,
-            ...I,
+            ...D,
             zIndex: "var(--pds-z-index-dropdown)"
           },
           ...b()
@@ -3174,7 +3174,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
           role: "menu",
           style: {
             ..._,
-            ...I,
+            ...D,
             zIndex: "var(--pds-z-index-dropdown)"
           },
           ...b()
@@ -3191,8 +3191,8 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
       ne !== le ? (T.push(ne), ce + 1 === w.length && Q.push(T)) : (Q.push(T), T = [], T.push(ne), le = ue.shift());
     }), Q.filter((ne) => ne.length > 0);
   };
-  let D;
-  if (t === "icon-end" && (D = /* @__PURE__ */ e.createElement(
+  let I;
+  if (t === "icon-end" && (I = /* @__PURE__ */ e.createElement(
     Xe,
     {
       ref: y.setReference,
@@ -3215,7 +3215,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
     }
   )), t === "icon-only") {
     const w = q2(o);
-    D = /* @__PURE__ */ e.createElement(
+    I = /* @__PURE__ */ e.createElement(
       f2,
       {
         ref: y.setReference,
@@ -3246,7 +3246,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
       ...u
     },
     /* @__PURE__ */ e.createElement(S2, { disabled: n, label: Y }, /* @__PURE__ */ e.createElement("ul", { className: `${x}__mobile-menu`, role: "menu" }, r.map((w, se) => Z(w, se)))),
-    D,
+    I,
     C && H(r)
   );
 }, pa = ({
@@ -3792,10 +3792,10 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
       size: "s"
     }
   ) : null, f = (N) => {
-    const I = [];
-    return a === "before" && I.push(b("icon-before")), I.push(E()), I.push(
+    const D = [];
+    return a === "before" && D.push(b("icon-before")), D.push(E()), D.push(
       /* @__PURE__ */ e.createElement("span", { key: "label", className: `${h}__label` }, N)
-    ), a === "after" && I.push(b("icon-after")), I.filter(Boolean);
+    ), a === "after" && D.push(b("icon-after")), D.filter(Boolean);
   }, C = v && Me(v) ? v.props.children : m, k = $([
     h,
     l ? `${h}--border` : null,
@@ -4011,10 +4011,10 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
   value: C,
   ...k
 }) => {
-  const M = Ye(o), y = "pds-select", N = s ? `${y}--auto-width` : null, I = _ !== "s" ? `${y}--${_}` : null, x = l ? re.disabled : null, z = u && !l ? re.required : null, L = f === "error" ? re.error : null, P = f === "success" ? re.success : null;
+  const M = Ye(o), y = "pds-select", N = s ? `${y}--auto-width` : null, D = _ !== "s" ? `${y}--${_}` : null, x = l ? re.disabled : null, z = u && !l ? re.required : null, L = f === "error" ? re.error : null, P = f === "success" ? re.success : null;
   let R = null;
   f === "error" && (R = "error"), f === "success" && (R = "success");
-  const V = E || i, U = typeof C < "u", F = typeof t < "u", Z = ((_e) => _e.reduce((Le, j) => H1(j) ? [...Le, ...j.options] : [...Le, j], []))(p), H = (_e) => Z.findIndex((Le) => Le.value === _e), O = U && H(C) >= 0 ? H(C) : null, D = F ? H(t) : null, Y = O || D, [X, w] = K(
+  const V = E || i, U = typeof C < "u", F = typeof t < "u", Z = ((_e) => _e.reduce((Le, j) => H1(j) ? [...Le, ...j.options] : [...Le, j], []))(p), H = (_e) => Z.findIndex((Le) => Le.value === _e), O = U && H(C) >= 0 ? H(C) : null, I = F ? H(t) : null, Y = O || I, [X, w] = K(
     Y ?? null
   ), {
     activeIndex: se,
@@ -4129,7 +4129,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
         re.base,
         y,
         N,
-        I,
+        D,
         x,
         z,
         L,
@@ -4450,7 +4450,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
       return 1;
     const R = f - P, V = x - P, U = 1 - 0.1, F = V / R, W = 1 - U * F;
     return Math.max(0.1, W);
-  }, I = /* @__PURE__ */ e.createElement(
+  }, D = /* @__PURE__ */ e.createElement(
     "div",
     {
       className: $([
@@ -4503,7 +4503,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
       )
     ))
   );
-  return g.includes(l) ? I : _;
+  return g.includes(l) ? D : _;
 }, Q4 = () => /* @__PURE__ */ e.createElement("div", { className: "pds-chart__skeleton-legend pds-chart__skeleton-legend--inline" }, /* @__PURE__ */ e.createElement(a2, { shape: "rounded", size: { height: 0.75, width: 5 } }), /* @__PURE__ */ e.createElement(a2, { shape: "rounded", size: { height: 0.75, width: 5 } }), /* @__PURE__ */ e.createElement(a2, { shape: "rounded", size: { height: 0.75, width: 5 } })), J4 = () => /* @__PURE__ */ e.createElement("div", { className: "pds-chart__skeleton-legend pds-chart__skeleton-legend--table" }, /* @__PURE__ */ e.createElement(a2, { shape: "rounded", size: { height: 4, width: "100%" } })), yt = ({
   height: s,
   legendVariant: n = "inline",
@@ -4537,7 +4537,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
   xAxisLabel: M,
   xAxisTickInterval: y,
   yAxisDomain: N,
-  yAxisFormatter: I = Lt,
+  yAxisFormatter: D = Lt,
   yAxisLabel: x,
   yAxisTickInterval: z,
   ...L
@@ -4551,7 +4551,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
   } = d, W = ge(null), Z = Ct(
     c,
     bt(W, c)
-  ), H = n ?? (r ? 60 : 360), O = t ?? (r ? 60 : void 0), D = _ ?? !r, Y = h ?? !r, X = b ?? !r, w = E ?? !r, se = u ?? !0, [Q, ue] = K(null), le = ge(Q);
+  ), H = n ?? (r ? 60 : 360), O = t ?? (r ? 60 : void 0), I = _ ?? !r, Y = h ?? !r, X = b ?? !r, w = E ?? !r, se = u ?? !0, [Q, ue] = K(null), le = ge(Q);
   Q && (le.current = Q);
   const T = ge({
     getBoundingClientRect: () => ({
@@ -4682,7 +4682,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
             top: 20
           }
         },
-        D && /* @__PURE__ */ e.createElement(
+        I && /* @__PURE__ */ e.createElement(
           J1,
           {
             horizontal: !Ce,
@@ -4705,7 +4705,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
               value: M
             } : void 0,
             tick: Y ? B2 : !1,
-            tickFormatter: Ce ? I : void 0,
+            tickFormatter: Ce ? D : void 0,
             tickLine: !1,
             tickMargin: 10,
             type: Ce ? "number" : "category"
@@ -4727,7 +4727,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
               value: x
             } : void 0,
             tick: Y ? B2 : !1,
-            tickFormatter: Ce ? void 0 : I,
+            tickFormatter: Ce ? void 0 : D,
             tickLine: !1,
             tickMargin: 6,
             type: Ce ? "category" : "number"
@@ -4803,7 +4803,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
             backgroundColor: le.current.color
           }
         }
-      ), /* @__PURE__ */ e.createElement("span", { className: "recharts-tooltip-item-name" }, le.current.name), /* @__PURE__ */ e.createElement("span", { className: "recharts-tooltip-item-separator" }, ": "), /* @__PURE__ */ e.createElement("span", { className: "recharts-tooltip-item-value" }, I(le.current.value)))
+      ), /* @__PURE__ */ e.createElement("span", { className: "recharts-tooltip-item-name" }, le.current.name), /* @__PURE__ */ e.createElement("span", { className: "recharts-tooltip-item-separator" }, ": "), /* @__PURE__ */ e.createElement("span", { className: "recharts-tooltip-item-value" }, D(le.current.value)))
     ),
     X && /* @__PURE__ */ e.createElement(
       $t,
@@ -4812,7 +4812,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
         series: p,
         seriesColors: Z,
         tableHeader: U,
-        valueFormatter: I,
+        valueFormatter: D,
         variant: m
       }
     ),
@@ -4822,7 +4822,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
         data: a,
         description: P,
         series: p,
-        valueFormatter: I
+        valueFormatter: D
       }
     )
   );
@@ -4855,7 +4855,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
   tooltipContent: M,
   xAxisLabel: y,
   xAxisTickInterval: N,
-  yAxisDomain: I,
+  yAxisDomain: D,
   yAxisFormatter: x = Lt,
   yAxisLabel: z,
   yAxisTickInterval: L,
@@ -4870,7 +4870,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
   } = d, Z = ge(null), H = Ct(
     c,
     bt(Z, c)
-  ), O = n ?? (r ? 60 : 360), D = t ?? (r ? 60 : void 0), Y = E ?? !r, X = _ ?? !r, w = f ?? !r, se = C ?? !r, Q = b ?? !r, ue = h ?? !0, le = "pds-line-chart";
+  ), O = n ?? (r ? 60 : 360), I = t ?? (r ? 60 : void 0), Y = E ?? !r, X = _ ?? !r, w = f ?? !r, se = C ?? !r, Q = b ?? !r, ue = h ?? !0, le = "pds-line-chart";
   return o ? /* @__PURE__ */ e.createElement(
     "div",
     {
@@ -4882,7 +4882,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
         `${le}--loading`,
         l ?? ""
       ]),
-      style: { maxWidth: D },
+      style: { maxWidth: I },
       ...P
     },
     /* @__PURE__ */ e.createElement(
@@ -4902,7 +4902,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
         `${le}--empty`,
         l ?? ""
       ]),
-      style: { height: O, maxWidth: D },
+      style: { height: O, maxWidth: I },
       ...P
     },
     /* @__PURE__ */ e.createElement(
@@ -4917,7 +4917,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
     {
       ref: Z,
       className: $([le, l ?? ""]),
-      style: D ? { maxWidth: D } : void 0,
+      style: I ? { maxWidth: I } : void 0,
       ...P
     },
     !r && k && k.length > 0 && /* @__PURE__ */ e.createElement("div", { className: `${le}__header` }, /* @__PURE__ */ e.createElement(
@@ -4969,7 +4969,7 @@ const v4 = 768, C4 = 1280, _4 = 1440, b4 = "7rem", E4 = "10rem", w4 = "8rem", ct
         tt,
         {
           axisLine: X,
-          domain: I,
+          domain: D,
           hide: !X,
           interval: L,
           label: z && X ? {
@@ -5963,11 +5963,11 @@ const os = ({
     value: C,
     ...k
   }, M) => {
-    const y = r ? { width: `${r / 16}rem` } : null, N = "pds-checkbox", I = l ? re.disabled : null, x = f === "error" ? re.error : null, z = v > 0 ? `${N}--indent-${v}` : null, L = h && !l ? re.required : null, P = b !== "s" ? `${N}--${b}` : null, R = f === "success" ? re.success : null, V = E || i, U = typeof s < "u", F = typeof t < "u", [W, Z] = K(
+    const y = r ? { width: `${r / 16}rem` } : null, N = "pds-checkbox", D = l ? re.disabled : null, x = f === "error" ? re.error : null, z = v > 0 ? `${N}--indent-${v}` : null, L = h && !l ? re.required : null, P = b !== "s" ? `${N}--${b}` : null, R = f === "success" ? re.success : null, V = E || i, U = typeof s < "u", F = typeof t < "u", [W, Z] = K(
       F ? t : !1
     ), H = s || W, O = (se) => {
       U || Z(se.target.checked), p && p(se);
-    }, D = `${N}__box`, Y = a ? null : H ? `${D}--checked` : null, X = a ? `${D}--indeterminate` : null, w = we(() => {
+    }, I = `${N}__box`, Y = a ? null : H ? `${I}--checked` : null, X = a ? `${I}--indeterminate` : null, w = we(() => {
       if (a)
         return /* @__PURE__ */ e.createElement(
           "svg",
@@ -6002,7 +6002,7 @@ const os = ({
       {
         className: $([
           N,
-          I,
+          D,
           L,
           x,
           R,
@@ -6036,7 +6036,7 @@ const os = ({
         "div",
         {
           className: $([
-            D,
+            I,
             Y,
             X
           ])
@@ -6146,9 +6146,9 @@ const os = ({
   i.map((L) => {
     L.checked === !0 && y.push(L.value);
   });
-  const [N, I] = K(y), x = (L) => {
+  const [N, D] = K(y), x = (L) => {
     const { value: P } = L.target, R = N.includes(P) ? N.filter((V) => V !== P) : [...N, P];
-    I(R), d && d(R);
+    D(R), d && d(R);
   };
   i.map((L) => {
     N.includes(L.value) ? L.checked = !0 : L.checked = !1;
@@ -6241,14 +6241,14 @@ const os = ({
     required: M = !1,
     showLabel: y = !0,
     showUnfilteredOptions: N = !1,
-    size: I = "s",
+    size: D = "s",
     tooltipText: x = null,
     validationMessage: z,
     validationStatus: L,
     value: P,
     ...R
   }, V) => {
-    const U = Ye(d), F = "pds-combobox", W = I !== "s" ? `${F}--${I}` : null, Z = t ? re.disabled : null, H = M && !t ? re.required : null, O = L === "error" ? re.error : null, D = L === "success" ? re.success : null;
+    const U = Ye(d), F = "pds-combobox", W = D !== "s" ? `${F}--${D}` : null, Z = t ? re.disabled : null, H = M && !t ? re.required : null, O = L === "error" ? re.error : null, I = L === "success" ? re.success : null;
     let Y = null;
     a && (Y = "search"), L === "error" && (Y = "error"), L === "success" && (Y = "success");
     const X = z || p, w = typeof P < "u", se = typeof n < "u", Q = (q) => {
@@ -6354,7 +6354,7 @@ const os = ({
           Z,
           H,
           O,
-          D,
+          I,
           s ?? ""
         ]),
         style: d ? U : null,
@@ -6500,11 +6500,11 @@ const os = ({
   size: b = "s",
   ...E
 }) => {
-  const f = Ye(a), C = "pds-combobox-multi", k = b !== "s" ? `${C}--${b}` : null, M = t ? re.disabled : null, y = u && !t ? re.required : null, N = h ? `${C}--show-all-tags` : null, [I, x] = K(""), [z, L] = K(c), [P, R] = K(
+  const f = Ye(a), C = "pds-combobox-multi", k = b !== "s" ? `${C}--${b}` : null, M = t ? re.disabled : null, y = u && !t ? re.required : null, N = h ? `${C}--show-all-tags` : null, [D, x] = K(""), [z, L] = K(c), [P, R] = K(
     null
   ), [V, U] = K(!1), F = Ne(
-    () => ms(g, z, I),
-    [g, z, I]
+    () => ms(g, z, D),
+    [g, z, D]
   ), W = Ne(
     () => s?.items?.map((B) => ({
       ...B,
@@ -6515,7 +6515,7 @@ const os = ({
     [s?.items, z]
   ), Z = (B) => {
     L(B), v?.(B);
-  }, { getDropdownProps: H, getSelectedItemProps: O, removeSelectedItem: D } = y2({
+  }, { getDropdownProps: H, getSelectedItemProps: O, removeSelectedItem: I } = y2({
     selectedItems: z,
     onStateChange: ({ selectedItems: B, type: S }) => {
       if (!t)
@@ -6542,7 +6542,7 @@ const os = ({
     items: F,
     itemToString: (B) => B ? B.label : "",
     selectedItem: null,
-    inputValue: I,
+    inputValue: D,
     isOpen: t ? !1 : void 0,
     stateReducer: (B, { changes: S, type: A }) => {
       if (t) return B;
@@ -6655,7 +6655,7 @@ const os = ({
   }, Le = (B) => {
     ze.current = le, !t && B.currentTarget.setAttribute("data-focus-method", "mouse");
   }, j = (B) => {
-    B.currentTarget.setAttribute("data-focus-method", "keyboard"), !t && ((B.key === "Backspace" || B.key === "Delete") && !I && z.length > 0 && (B.preventDefault(), pe()), B.key === "Enter" && P !== null && (B.preventDefault(), pe()), !le && (B.key === "Enter" || B.key === "ArrowDown") && (B.preventDefault(), T()));
+    B.currentTarget.setAttribute("data-focus-method", "keyboard"), !t && ((B.key === "Backspace" || B.key === "Delete") && !D && z.length > 0 && (B.preventDefault(), pe()), B.key === "Enter" && P !== null && (B.preventDefault(), pe()), !le && (B.key === "Enter" || B.key === "ArrowDown") && (B.preventDefault(), T()));
   }, oe = X({
     ...H({
       preventKeyAction: le
@@ -6724,7 +6724,7 @@ const os = ({
             "aria-label": `Remove ${B.label}`,
             className: `${C}__selected-item-remove`,
             onClick: (A) => {
-              A.stopPropagation(), D(B);
+              A.stopPropagation(), I(B);
             },
             onKeyDown: (A) => {
               (A.key === "Enter" || A.key === " ") && A.stopPropagation();
@@ -6901,19 +6901,19 @@ const os = ({
     validationStatus: f,
     ...C
   }, k) => {
-    const [M, y] = K(!1), [N, I] = K(
+    const [M, y] = K(!1), [N, D] = K(
       !!(P2 && t)
     ), x = Ye(r), z = "pds-file-upload", L = _ !== "s" ? `${z}--${_}` : null, P = l ? re.disabled : null, R = p && !l ? re.required : null, V = f === "error" ? re.error : null, U = f === "success" ? re.success : null, F = N ? `${z}--safari-default` : null;
     let W = null;
     f === "error" && (W = "error"), f === "success" && (W = "success");
-    const Z = E || i, H = t ? [t] : null, O = t ? t.split("/").pop() : null, D = u ? t : O, Y = t ? new File(H, D) : null;
+    const Z = E || i, H = t ? [t] : null, O = t ? t.split("/").pop() : null, I = u ? t : O, Y = t ? new File(H, I) : null;
     he(() => {
       const Q = new DataTransfer();
       if (Y && Q.items.add(Y), Q.files.length > 0) {
         const ue = document.getElementById(
           `${a}--input`
         );
-        ue.files = Q.files, P2 && (ue.dataset.file = `${D}`), y(!0);
+        ue.files = Q.files, P2 && (ue.dataset.file = `${I}`), y(!0);
       }
     }, [t, u]);
     const X = () => {
@@ -6928,12 +6928,12 @@ const os = ({
         t ? X() : y(!1);
         return;
       }
-      P2 && t && (t === Q.target.value ? I(!0) : I(!1)), g && g(Q.target.files), y(!0);
+      P2 && t && (t === Q.target.value ? D(!0) : D(!1)), g && g(Q.target.files), y(!0);
     }, se = () => {
       const Q = document.getElementById(
         `${a}--input`
       );
-      Q.value = "", P2 && I(!1), v && v(), y(!1), Q.focus();
+      Q.value = "", P2 && D(!1), v && v(), y(!1), Q.focus();
     };
     return /* @__PURE__ */ e.createElement(
       "div",
@@ -7054,8 +7054,8 @@ const os = ({
   value: b,
   ...E
 }) => {
-  const f = "pds-radio-group", C = t ? re.disabled : null, k = g && !t ? re.required : null, M = _ === "error" ? re.error : null, y = _ === "success" ? re.success : null, N = typeof b < "u", I = typeof n < "u", [x, z] = K(
-    I ? n : ""
+  const f = "pds-radio-group", C = t ? re.disabled : null, k = g && !t ? re.required : null, M = _ === "error" ? re.error : null, y = _ === "success" ? re.success : null, N = typeof b < "u", D = typeof n < "u", [x, z] = K(
+    D ? n : ""
   ), L = h || r, P = (V) => {
     N || z(V.target.value), i && i(V), m && m(V.target.value);
   }, R = (V) => {
@@ -7136,7 +7136,7 @@ const os = ({
     switchPlacement: g = "right",
     ...p
   }, u) => {
-    const h = Ye(o), _ = "pds-switch", b = `${_}--${g}`, E = d ? `${_}--message` : null, f = l ? re.disabled : null, C = m && !l ? re.required : null, k = typeof s < "u", M = !k && t ? t : !1, [y, N] = K(M), I = (P) => {
+    const h = Ye(o), _ = "pds-switch", b = `${_}--${g}`, E = d ? `${_}--message` : null, f = l ? re.disabled : null, C = m && !l ? re.required : null, k = typeof s < "u", M = !k && t ? t : !1, [y, N] = K(M), D = (P) => {
       k || N(P.target.checked), i && i(P);
     }, x = () => {
       l || document.getElementById(c)?.click();
@@ -7150,7 +7150,7 @@ const os = ({
         disabled: l,
         id: c,
         name: c,
-        onChange: I,
+        onChange: D,
         required: m,
         role: "switch",
         type: "checkbox",
@@ -7251,7 +7251,7 @@ const os = ({
       }
       L.key === "Delete" || L.key === "Enter" ? (L.preventDefault(), v(p.id), u === 1 ? i() : l > 0 ? g(l - 1) : g(0)) : L.key === "Escape" ? (L.preventDefault(), i()) : L.key === "ArrowLeft" && !L.shiftKey && l > 0 ? (L.preventDefault(), g(l - 1)) : L.key === "ArrowRight" && !L.shiftKey && (L.preventDefault(), l < u - 1 ? g(l + 1) : i());
     }
-  }, k = String(l + 1), M = String(u), y = a ? h.tagAriaLabel : h.tagAriaLabelSimple, N = `${p.value}, ${y.replace("{index}", k).replace("{total}", M)}`, I = c ? `${b}--dragging` : null, x = s ? re.disabled : null, z = n ? `${b}--drop-target-${n}` : null;
+  }, k = String(l + 1), M = String(u), y = a ? h.tagAriaLabel : h.tagAriaLabelSimple, N = `${p.value}, ${y.replace("{index}", k).replace("{total}", M)}`, D = c ? `${b}--dragging` : null, x = s ? re.disabled : null, z = n ? `${b}--drop-target-${n}` : null;
   return /* @__PURE__ */ e.createElement(
     "div",
     {
@@ -7259,7 +7259,7 @@ const os = ({
       "aria-label": N,
       className: $([
         b,
-        I,
+        D,
         x,
         z
       ]),
@@ -7324,7 +7324,7 @@ const os = ({
     validationStatus: E,
     ...f
   }, C) => {
-    const k = Ye(a), M = "pds-tags-input", y = p !== "s" ? `${M}--${p}` : null, N = t ? re.disabled : null, I = v && !t ? re.required : null, x = E === "error" ? re.error : null, z = E === "success" ? re.success : null, L = b || d, [P, R] = K(""), [V, U] = K(null), [F, W] = K(null), [Z, H] = K(null), [O, D] = K(null), [Y, X] = K(""), w = ge(null), se = u.length > 0 ? s : m, Q = (ae) => {
+    const k = Ye(a), M = "pds-tags-input", y = p !== "s" ? `${M}--${p}` : null, N = t ? re.disabled : null, D = v && !t ? re.required : null, x = E === "error" ? re.error : null, z = E === "success" ? re.success : null, L = b || d, [P, R] = K(""), [V, U] = K(null), [F, W] = K(null), [Z, H] = K(null), [O, I] = K(null), [Y, X] = K(""), w = ge(null), se = u.length > 0 ? s : m, Q = (ae) => {
       X(ae), setTimeout(() => X(""), 1e3);
     }, ue = (ae) => {
       i(ae);
@@ -7351,7 +7351,7 @@ const os = ({
       const ie = u.find((me) => me.id === ae), ee = u.filter((me) => me.id !== ae);
       ue(ee), ie && Q(`${ie.value} removed`);
     }, ve = () => {
-      D(null), setTimeout(() => {
+      I(null), setTimeout(() => {
         w.current?.focus();
       }, 0);
     }, $e = (ae) => {
@@ -7366,7 +7366,7 @@ const os = ({
         } else if (ae.key === "Backspace" && !P && u.length > 0) {
           const ie = u[u.length - 1];
           ue(u.slice(0, -1)), Q(`${ie.value} removed`);
-        } else ae.key === "ArrowLeft" && !P && u.length > 0 && (ae.preventDefault(), D(u.length - 1));
+        } else ae.key === "ArrowLeft" && !P && u.length > 0 && (ae.preventDefault(), I(u.length - 1));
     };
     return /* @__PURE__ */ e.createElement(
       "div",
@@ -7376,7 +7376,7 @@ const os = ({
           M,
           y,
           N,
-          I,
+          D,
           x,
           z,
           n ?? ""
@@ -7430,7 +7430,7 @@ const os = ({
                 onFocusInput: ve,
                 onKeyboardMove: te,
                 onRemove: fe,
-                setFocusedIndex: D,
+                setFocusedIndex: I,
                 tag: ae,
                 totalTags: u.length,
                 translationStrings: _
@@ -7506,10 +7506,10 @@ const os = ({
     validationStatus: M,
     value: y,
     ...N
-  }, I) => {
-    const x = Ye(a), z = "pds-textarea", L = o ? "pds-is-resizable" : null, P = l ? re.disabled : null, R = u && !l ? re.required : null, V = M === "error" ? re.error : null, U = M === "success" ? re.success : null, F = b !== "s" ? `${z}--${b}` : null, W = p ? re.readonly : null, Z = k || d, H = y != null && m !== void 0, O = typeof t < "u", [D, Y] = K(
+  }, D) => {
+    const x = Ye(a), z = "pds-textarea", L = o ? "pds-is-resizable" : null, P = l ? re.disabled : null, R = u && !l ? re.required : null, V = M === "error" ? re.error : null, U = M === "success" ? re.success : null, F = b !== "s" ? `${z}--${b}` : null, W = p ? re.readonly : null, Z = k || d, H = y != null && m !== void 0, O = typeof t < "u", [I, Y] = K(
       O ? t : ""
-    ), X = y || D, w = (Q) => {
+    ), X = y || I, w = (Q) => {
       H || Y(Q.target.value), m && m(Q);
     }, se = (Q) => {
       i && i(Q);
@@ -7554,7 +7554,7 @@ const os = ({
       /* @__PURE__ */ e.createElement("div", { className: `${z}__input-wrapper` }, /* @__PURE__ */ e.createElement(
         "textarea",
         {
-          ref: I,
+          ref: D,
           "aria-describedby": Z ? `${c}__message` : null,
           "aria-invalid": M === "error",
           className: $([`${z}--textarea`, L]),
@@ -7568,7 +7568,7 @@ const os = ({
           readOnly: p,
           required: u,
           rows: h,
-          value: H ? y : D,
+          value: H ? y : I,
           ...E
         }
       )),
@@ -7611,7 +7611,7 @@ const os = ({
     showVisibilityToggle: M = !1,
     size: y = "s",
     tooltipText: N = null,
-    translationStrings: I = {
+    translationStrings: D = {
       clearButton: "Clear input text",
       counterOverLimit: "Character limit exceeded by",
       searchShortcut: "Press / to focus the search field",
@@ -7625,7 +7625,7 @@ const os = ({
     value: P,
     ...R
   }, V) => {
-    const U = Ye(m), F = "pds-text-input", W = c ? re.disabled : null, Z = f && !c ? re.required : null, H = L === "error" ? re.error : null, O = L === "success" ? re.success : null, D = E ? re.readonly : null, Y = y !== "s" ? `${F}--${y}` : null, X = r && x === "url" ? `${F}--has-url-prefix` : null;
+    const U = Ye(m), F = "pds-text-input", W = c ? re.disabled : null, Z = f && !c ? re.required : null, H = L === "error" ? re.error : null, O = L === "success" ? re.success : null, I = E ? re.readonly : null, Y = y !== "s" ? `${F}--${y}` : null, X = r && x === "url" ? `${F}--has-url-prefix` : null;
     let w = null;
     x === "search" && (w = "search"), x === "search" && C === "filter" && (w = "filter"), L === "error" && (w = "error"), L === "success" && (w = "success");
     const se = z || g, Q = typeof P < "u", ue = typeof l < "u", [le, T] = K(
@@ -7674,7 +7674,7 @@ const os = ({
           Z,
           H,
           O,
-          D,
+          I,
           X,
           n ?? ""
         ]),
@@ -7692,7 +7692,7 @@ const os = ({
           tooltipText: N
         }
       ),
-      M && x === "password" && /* @__PURE__ */ e.createElement("div", { "aria-live": "polite", className: "visually-hidden" }, `${I.visibilityStatus} ${ve ? "visible" : "hidden"}.`),
+      M && x === "password" && /* @__PURE__ */ e.createElement("div", { "aria-live": "polite", className: "visually-hidden" }, `${D.visibilityStatus} ${ve ? "visible" : "hidden"}.`),
       /* @__PURE__ */ e.createElement(
         "div",
         {
@@ -7725,7 +7725,7 @@ const os = ({
         a && ne && /* @__PURE__ */ e.createElement(
           $1,
           {
-            clearLabel: I.clearButton,
+            clearLabel: D.clearButton,
             handleClearInput: fe,
             id: d
           }
@@ -7737,7 +7737,7 @@ const os = ({
             className: `${F}__visibility-toggle`,
             onClick: ae,
             onMouseDown: (ee) => ee.preventDefault(),
-            title: ve ? I.visibilityToggleHide : I.visibilityToggleShow,
+            title: ve ? D.visibilityToggleHide : D.visibilityToggleShow,
             type: "button"
           },
           /* @__PURE__ */ e.createElement(G, { iconName: ve ? "eyeSlash" : "eye", size: "m" })
@@ -7746,7 +7746,7 @@ const os = ({
           pt,
           {
             inputId: d,
-            shortcutLabel: I.searchShortcut
+            shortcutLabel: D.searchShortcut
           }
         ),
         t && x !== "password" && /* @__PURE__ */ e.createElement(
@@ -7755,7 +7755,7 @@ const os = ({
             currentLength: ne.length,
             id: d,
             maxLength: t,
-            overLimitMessage: I.counterOverLimit
+            overLimitMessage: D.counterOverLimit
           }
         )
       ),
@@ -8161,7 +8161,7 @@ const os = ({
     item: y,
     level: N
   }) => {
-    const I = hs(
+    const D = hs(
       y.linkContent,
       y.links
     );
@@ -8169,16 +8169,20 @@ const os = ({
       ...y,
       level: N,
       linkContent: Ve(
-        I,
-        Object.assign({}, I.props, {
+        D,
+        Object.assign({}, D.props, {
           tabIndex: -1
         })
       )
     };
   }, M = (y) => {
     const N = [];
-    return y.forEach((I) => {
-      I.links ? (N.push(k({ item: I, level: "top-level" })), I.links.forEach((x) => {
+    return y.forEach((D) => {
+      if (D.isSeparator) {
+        N.push({ isSeparator: !0, level: "top-level" });
+        return;
+      }
+      D.links ? (N.push(k({ item: D, level: "top-level" })), D.links.forEach((x) => {
         x.links ? (N.push(k({ item: x, level: "second-level" })), x.links.forEach((z) => {
           z.links && (N.push(
             k({ item: z, level: "third-level" })
@@ -8190,7 +8194,7 @@ const os = ({
             k({ item: z, level: "third-level" })
           );
         })) : N.push(k({ item: x, level: "second-level" }));
-      })) : N.push(k({ item: I, level: "top-level" }));
+      })) : N.push(k({ item: D, level: "top-level" }));
     }), N;
   };
   return /* @__PURE__ */ e.createElement("div", { className: $([a, s ?? ""]), ...c }, n && /* @__PURE__ */ e.createElement("h2", { className: `${a}__heading pds-ts-m` }, n), /* @__PURE__ */ e.createElement(
@@ -8223,26 +8227,39 @@ const os = ({
       },
       ...v()
     },
-    M(t).map((y, N) => /* @__PURE__ */ e.createElement(
-      "li",
-      {
-        key: N,
-        ref: (I) => {
-          h.current[N] = I;
+    M(t).map(
+      (y, N) => y.isSeparator ? /* @__PURE__ */ e.createElement(
+        "li",
+        {
+          key: N,
+          ref: (D) => {
+            h.current[N] = D;
+          },
+          "aria-hidden": "true",
+          className: `${a}__separator`,
+          role: "separator"
+        }
+      ) : /* @__PURE__ */ e.createElement(
+        "li",
+        {
+          key: N,
+          ref: (D) => {
+            h.current[N] = D;
+          },
+          className: $([
+            "pds-dropdown__item",
+            `${a}__item`,
+            `${a}__item--${y.level}`,
+            i === N ? "pds-dropdown__item--focused" : null,
+            y.isActive === !0 ? "pds-dropdown__item--active" : null
+          ]),
+          tabIndex: i === N ? 0 : -1,
+          ...g({ onKeyDown: C })
         },
-        className: $([
-          "pds-dropdown__item",
-          `${a}__item`,
-          `${a}__item--${y.level}`,
-          i === N ? "pds-dropdown__item--focused" : null,
-          y.isActive === !0 ? "pds-dropdown__item--active" : null
-        ]),
-        tabIndex: i === N ? 0 : -1,
-        ...g({ onKeyDown: C })
-      },
-      y.linkContent,
-      y.isActive === !0 && d
-    ))
+        y.linkContent,
+        y.isActive === !0 && d
+      )
+    )
   ));
 }, e1 = ({
   children: s,
@@ -8632,8 +8649,8 @@ const os = ({
       return h(), () => u();
   }, [g, h, u]);
   const M = Fe(s), y = M["items-left"], N = M["items-right"];
-  let I = "default";
-  (t === "reverse" || t === "reverse-transparent") && (I = "reverse");
+  let D = "default";
+  (t === "reverse" || t === "reverse-transparent") && (D = "reverse");
   const x = Me(r) ? r.props.children : null, z = Me(r) && x ? Ve(
     r,
     Object.assign({}, r.props, {
@@ -8643,7 +8660,7 @@ const os = ({
   ) : /* @__PURE__ */ e.createElement("img", { alt: "", className: `${_}__custom-logo`, src: d }), L = () => d ? z : /* @__PURE__ */ e.createElement(
     Cs,
     {
-      colorType: I,
+      colorType: D,
       displayType: o,
       linkContent: r,
       subBrand: i
@@ -8750,7 +8767,7 @@ const os = ({
     t && a && (x.key === "ArrowDown" || x.key === "ArrowRight" || x.key === " " || x.key === "Spacebar") && (x.preventDefault(), p(!0));
   }, N = (x) => {
     !t || !a || !o || !(x.nativeEvent.pointerType === "touch") || (x.preventDefault(), x.stopPropagation(), o());
-  }, I = (x) => {
+  }, D = (x) => {
     const z = x.currentTarget, L = z.parentElement?.nextElementSibling;
     if (!L) return;
     const P = z.getAttribute("aria-expanded") === "false";
@@ -8784,7 +8801,7 @@ const os = ({
           `${r}__toggle`,
           n ? `${r}__toggle--expanded` : null
         ]),
-        onClick: I,
+        onClick: D,
         type: "button"
       },
       /* @__PURE__ */ e.createElement(G, { iconName: "angleDown", size: "m" }),
@@ -9033,7 +9050,7 @@ const os = ({
     listRef: M,
     refs: y,
     setActiveIndex: N,
-    transitionStyles: I
+    transitionStyles: D
   } = r2({
     offsetValue: 8,
     placement: "bottom-start",
@@ -9042,7 +9059,7 @@ const os = ({
     H.preventDefault(), H.key === "Enter" && M.current[h].querySelector("a")?.click(), H.key === "Tab" && H.shiftKey && m && document.getElementById("links-filter").focus();
   }, z = (H, O) => s2(H.linkContent).toLowerCase().includes(O.toLowerCase()), L = (H) => {
     const O = H.target.value;
-    i(O), r(l.filter((D) => z(D, O)));
+    i(O), r(l.filter((I) => z(I, O)));
   };
   he(() => {
     r(l.filter((H) => z(H, d)));
@@ -9070,7 +9087,7 @@ const os = ({
       type: "search"
     }
   )), Z = o.map((H, O) => {
-    const D = H.isActive ? `${u}--active` : null;
+    const I = H.isActive ? `${u}--active` : null;
     return /* @__PURE__ */ e.createElement(
       "li",
       {
@@ -9078,7 +9095,7 @@ const os = ({
         ref: (Y) => {
           M.current[O] = Y;
         },
-        className: $([u, D]),
+        className: $([u, I]),
         onKeyDown: x,
         tabIndex: O === h ? 0 : -1,
         ...E()
@@ -9118,7 +9135,7 @@ const os = ({
         }
       })
     },
-    /* @__PURE__ */ e.createElement("div", { style: { ...I } }, W, /* @__PURE__ */ e.createElement("ul", { className: $([g, p]) }, Z.length === 0 ? /* @__PURE__ */ e.createElement("p", { className: `${v}__no-results` }, a) : Z))
+    /* @__PURE__ */ e.createElement("div", { style: { ...D } }, W, /* @__PURE__ */ e.createElement("ul", { className: $([g, p]) }, Z.length === 0 ? /* @__PURE__ */ e.createElement("p", { className: `${v}__no-results` }, a) : Z))
   ));
 }, Ka = ({
   ariaLabel: s,
@@ -9222,7 +9239,7 @@ const os = ({
     openOnArrowKeyDown: !0,
     focusItemOnOpen: !1,
     focusItemOnHover: !0
-  }), { getFloatingProps: y, getItemProps: N, getReferenceProps: I } = Ue(
+  }), { getFloatingProps: y, getItemProps: N, getReferenceProps: D } = Ue(
     [f, C, E, M]
   ), { isMounted: x, styles: z } = Qe(h, {
     duration: { open: 300, close: 150 },
@@ -9244,23 +9261,23 @@ const os = ({
     v.current.push(O), g.current.push(H);
   });
   const R = (H) => {
-    const O = v.current.indexOf(H), D = g.current[O];
-    D.linkContent && !D.disabled && (k.current[O].querySelector("a").click(), m(!1)), D.callback && !D.disabled && (D.callback(), m(!1));
+    const O = v.current.indexOf(H), I = g.current[O];
+    I.linkContent && !I.disabled && (k.current[O].querySelector("a").click(), m(!1)), I.callback && !I.disabled && (I.callback(), m(!1));
   }, V = (H) => {
     H.preventDefault(), H.key === "Enter" && R(H.currentTarget.id);
   }, U = (H) => {
     R(H.currentTarget.id);
   }, F = t.map((H, O) => {
-    const D = v.current[O], Y = `${p}__item`, X = H.disabled ? `${Y}--disabled` : null;
+    const I = v.current[O], Y = `${p}__item`, X = H.disabled ? `${Y}--disabled` : null;
     return /* @__PURE__ */ e.createElement(
       "li",
       {
-        key: D,
+        key: I,
         ref: (w) => {
           k.current[O] = w;
         },
         className: $([Y, X]),
-        id: D,
+        id: I,
         onKeyDown: V,
         role: "menuitem",
         tabIndex: r === O ? 0 : -1,
@@ -9277,15 +9294,15 @@ const os = ({
       H.linkContent ? H.linkContent : H.label
     );
   }), W = t.map((H, O) => {
-    const D = v.current[O], Y = `${p}__item`, X = H.disabled ? `${Y}--disabled` : null;
+    const I = v.current[O], Y = `${p}__item`, X = H.disabled ? `${Y}--disabled` : null;
     return /* @__PURE__ */ e.createElement(
       "li",
       {
-        key: D,
+        key: I,
         className: $([Y, X]),
-        id: `${D}-accordion`,
+        id: `${I}-accordion`,
         onClick: () => {
-          H.linkContent && !H.disabled ? document.getElementById(`${D}-accordion`)?.querySelector("a")?.click() : H.callback && !H.disabled && H.callback();
+          H.linkContent && !H.disabled ? document.getElementById(`${I}-accordion`)?.querySelector("a")?.click() : H.callback && !H.disabled && H.callback();
         },
         role: "menuitem"
       },
@@ -9316,7 +9333,7 @@ const os = ({
       "aria-label": s,
       className: `${p}__trigger`,
       type: "button",
-      ...I()
+      ...D()
     },
     L
   ), x && /* @__PURE__ */ e.createElement(
@@ -9360,7 +9377,7 @@ const os = ({
     getItemProps: M,
     getReferenceProps: y,
     isMounted: N,
-    listRef: I,
+    listRef: D,
     refs: x,
     setIsOpen: z,
     transitionStyles: L
@@ -9368,34 +9385,34 @@ const os = ({
     enableTypeahead: !h,
     role: "menu"
   });
-  let P = d.find((D) => D.isActive);
+  let P = d.find((I) => I.isActive);
   P || (P = d[0]);
   const R = Ne(() => {
     if (!m) return d;
-    const D = m.toLowerCase();
+    const I = m.toLowerCase();
     return d.filter(
-      (Y) => Y.displayName?.toLowerCase().includes(D)
+      (Y) => Y.displayName?.toLowerCase().includes(I)
     );
   }, [d, m]), V = Ne(() => {
     if (!g) return d;
-    const D = g.toLowerCase();
+    const I = g.toLowerCase();
     return d.filter(
-      (Y) => Y.displayName?.toLowerCase().includes(D)
+      (Y) => Y.displayName?.toLowerCase().includes(I)
     );
-  }, [d, g]), U = (D) => {
-    D.preventDefault(), D.key === "Enter" && (I.current[f]?.querySelector("a") || I.current[f]?.querySelector("button"))?.click(), D.key === "Tab" && (D.shiftKey ? h ? document.getElementById("workspace-filter")?.focus() : z(!1) : t ? u.current?.querySelector("a")?.focus() : z(!1));
-  }, F = (D) => /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: `${_}__item-content` }, /* @__PURE__ */ e.createElement(
+  }, [d, g]), U = (I) => {
+    I.preventDefault(), I.key === "Enter" && (D.current[f]?.querySelector("a") || D.current[f]?.querySelector("button"))?.click(), I.key === "Tab" && (I.shiftKey ? h ? document.getElementById("workspace-filter")?.focus() : z(!1) : t ? u.current?.querySelector("a")?.focus() : z(!1));
+  }, F = (I) => /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: `${_}__item-content` }, /* @__PURE__ */ e.createElement(
     T2,
     {
       className: `${_}__list-avatar`,
-      imageSrc: D.imageSrc,
+      imageSrc: I.imageSrc,
       size: "s",
-      uniqueId: D.workspaceId
+      uniqueId: I.workspaceId
     }
-  ), D.displayName, D.isRestricted && /* @__PURE__ */ e.createElement("span", { className: "visually-hidden" }, D.restrictedLabel ?? "Restricted")), (D.isRestricted || D.isActive) && /* @__PURE__ */ e.createElement("div", { className: `${_}__icons` }, D.isRestricted && /* @__PURE__ */ e.createElement(G, { className: `${_}__lock-icon`, iconName: "lock" }), D.isActive && /* @__PURE__ */ e.createElement(M2, null))), W = R.map(
-    (D, Y) => {
-      const X = `${_}__item`, w = D.workspaceId, se = D.isRestricted && D.onRestrictedSelection, Q = D.workspaceLink?.type, ue = D.isUnprivileged ? null : (le) => {
-        I.current[Y] = le;
+  ), I.displayName, I.isRestricted && /* @__PURE__ */ e.createElement("span", { className: "visually-hidden" }, I.restrictedLabel ?? "Restricted")), (I.isRestricted || I.isActive) && /* @__PURE__ */ e.createElement("div", { className: `${_}__icons` }, I.isRestricted && /* @__PURE__ */ e.createElement(G, { className: `${_}__lock-icon`, iconName: "lock" }), I.isActive && /* @__PURE__ */ e.createElement(M2, null))), W = R.map(
+    (I, Y) => {
+      const X = `${_}__item`, w = I.workspaceId, se = I.isRestricted && I.onRestrictedSelection, Q = I.workspaceLink?.type, ue = I.isUnprivileged ? null : (le) => {
+        D.current[Y] = le;
       };
       return /* @__PURE__ */ e.createElement(
         "li",
@@ -9405,10 +9422,10 @@ const os = ({
           className: $([
             "pds-dropdown__item",
             X,
-            D.isActive ? "pds-dropdown__item--active" : null,
-            D.isActive ? `${X}--active` : null,
-            D.isUnprivileged ? `${X}--unprivileged` : null,
-            D.isRestricted ? `${X}--restricted` : null
+            I.isActive ? "pds-dropdown__item--active" : null,
+            I.isActive ? `${X}--active` : null,
+            I.isUnprivileged ? `${X}--unprivileged` : null,
+            I.isRestricted ? `${X}--restricted` : null
           ]),
           id: w,
           onKeyDown: U,
@@ -9420,25 +9437,25 @@ const os = ({
           "button",
           {
             onClick: () => {
-              D.onRestrictedSelection(), z(!1);
+              I.onRestrictedSelection(), z(!1);
             },
             type: "button"
           },
-          F(D)
+          F(I)
         ) : Q ? /* @__PURE__ */ e.createElement(
           Q,
           {
-            ...Object.assign({}, D.workspaceLink.props, {
+            ...Object.assign({}, I.workspaceLink.props, {
               onClick: () => z(!1)
             })
           },
-          F(D)
+          F(I)
         ) : null
       );
     }
   ), Z = V.map(
-    (D) => {
-      const Y = `${_}__item`, X = D.workspaceId, w = D.isRestricted && D.onRestrictedSelection, se = D.workspaceLink?.type;
+    (I) => {
+      const Y = `${_}__item`, X = I.workspaceId, w = I.isRestricted && I.onRestrictedSelection, se = I.workspaceLink?.type;
       return /* @__PURE__ */ e.createElement(
         "li",
         {
@@ -9446,10 +9463,10 @@ const os = ({
           className: $([
             "pds-dropdown__item",
             Y,
-            D.isActive ? "pds-dropdown__item--active" : null,
-            D.isActive ? `${Y}--active` : null,
-            D.isUnprivileged ? `${Y}--unprivileged` : null,
-            D.isRestricted ? `${Y}--restricted` : null
+            I.isActive ? "pds-dropdown__item--active" : null,
+            I.isActive ? `${Y}--active` : null,
+            I.isUnprivileged ? `${Y}--unprivileged` : null,
+            I.isRestricted ? `${Y}--restricted` : null
           ]),
           id: `${X}-accordion`,
           role: "menuitem"
@@ -9457,11 +9474,11 @@ const os = ({
         w ? /* @__PURE__ */ e.createElement(
           "button",
           {
-            onClick: () => D.onRestrictedSelection(),
+            onClick: () => I.onRestrictedSelection(),
             type: "button"
           },
-          F(D)
-        ) : se ? /* @__PURE__ */ e.createElement(se, { ...Object.assign({}, D.workspaceLink?.props) }, F(D)) : null
+          F(I)
+        ) : se ? /* @__PURE__ */ e.createElement(se, { ...Object.assign({}, I.workspaceLink?.props) }, F(I)) : null
       );
     }
   ), H = t && /* @__PURE__ */ e.createElement("div", { ref: u, className: `${_}__create-link` }, /* @__PURE__ */ e.createElement(
@@ -9495,7 +9512,7 @@ const os = ({
       hasClearButton: !0,
       id: "workspace-filter-mobile",
       label: l,
-      onChange: (D) => p(D.target.value),
+      onChange: (I) => p(I.target.value),
       onClear: () => p(""),
       placeholder: c,
       showLabel: !1,
@@ -9552,7 +9569,7 @@ const os = ({
         hasClearButton: !0,
         id: "workspace-filter",
         label: l,
-        onChange: (D) => v(D.target.value),
+        onChange: (I) => v(I.target.value),
         onClear: () => v(""),
         placeholder: c,
         showLabel: !1,
@@ -9597,7 +9614,7 @@ const os = ({
     info: `${E}--info`,
     neutral: `${E}--neutral`,
     warning: `${E}--warning`
-  }, k = i[0].type, M = k ? `${E}-group--${k}` : null, y = (L) => Y2 - L, N = (L) => L === 0 ? 0 : -1, I = () => {
+  }, k = i[0].type, M = k ? `${E}-group--${k}` : null, y = (L) => Y2 - L, N = (L) => L === 0 ? 0 : -1, D = () => {
     g(i[0].id), setTimeout(() => {
       m((L) => [
         ...L.slice(1),
@@ -9617,7 +9634,7 @@ const os = ({
       ]), g(null), _({});
     }, s1);
   }, z = (L, P) => {
-    const { iconName: R, id: V, isDismissible: U, message: F, onDismiss: W, type: Z } = L, H = Z === "critical" ? "alert" : "status", O = `${o[Z]}:  `, D = (X) => {
+    const { iconName: R, id: V, isDismissible: U, message: F, onDismiss: W, type: Z } = L, H = Z === "critical" ? "alert" : "status", O = `${o[Z]}:  `, I = (X) => {
       X.preventDefault(), u(V), setTimeout(() => {
         W?.(), u(null), m((w) => w.filter(
           (Q) => Q.id !== V
@@ -9650,7 +9667,7 @@ const os = ({
         "button",
         {
           className: `${E}__dismiss-button`,
-          onClick: D,
+          onClick: I,
           tabIndex: N(P),
           type: "button"
         },
@@ -9685,7 +9702,7 @@ const os = ({
         ariaLabel: c,
         className: `${E}__nav-button ${E}__nav-button--next`,
         iconName: "angleRight",
-        onClick: I,
+        onClick: D,
         size: "m"
       }
     ), i.map((L, P) => z(L, P))) : z(i[0], 0)
@@ -9779,9 +9796,9 @@ const os = ({
     open: h,
     placement: "bottom-end",
     whileElementsMounted: qe
-  }), I = k2(M, { event: "mousedown" }), x = We(M), { getFloatingProps: z, getReferenceProps: L } = Ue([
+  }), D = k2(M, { event: "mousedown" }), x = We(M), { getFloatingProps: z, getReferenceProps: L } = Ue([
     x,
-    I
+    D
   ]), { isMounted: P, styles: R } = Qe(M, {
     close: { opacity: 0 },
     duration: { close: 150, open: 300 },
@@ -9792,12 +9809,12 @@ const os = ({
   }, U = () => {
     i && i(), _(!1);
   }, F = f ? `${s}, ${g}` : s, W = k.map((O) => {
-    const D = `${C}__item`, Y = `${O.type} notification: ${O.title}${O.siteName ? `, ${O.siteName}` : ""}, ${O.timestamp}${O.read ? "" : `, ${g}`}`;
-    return /* @__PURE__ */ e.createElement("li", { key: O.id, className: D }, /* @__PURE__ */ e.createElement(
+    const I = `${C}__item`, Y = `${O.type} notification: ${O.title}${O.siteName ? `, ${O.siteName}` : ""}, ${O.timestamp}${O.read ? "" : `, ${g}`}`;
+    return /* @__PURE__ */ e.createElement("li", { key: O.id, className: I }, /* @__PURE__ */ e.createElement(
       "button",
       {
         "aria-label": Y,
-        className: `${D}-button`,
+        className: `${I}-button`,
         onClick: () => V(O),
         type: "button"
       },
@@ -9805,13 +9822,13 @@ const os = ({
         Ls,
         {
           category: O.category,
-          className: `${D}-icon`,
+          className: `${I}-icon`,
           displayType: "popover",
           type: O.type
         }
       ),
-      /* @__PURE__ */ e.createElement("div", { className: `${D}-content` }, /* @__PURE__ */ e.createElement("div", { "aria-hidden": "true", className: `${D}-title` }, O.title), /* @__PURE__ */ e.createElement("div", { "aria-hidden": "true", className: `${D}-details` }, O.siteName && /* @__PURE__ */ e.createElement("span", { className: `${D}-site` }, O.siteName), /* @__PURE__ */ e.createElement("span", { className: `${D}-timestamp` }, O.timestamp))),
-      !O.read && /* @__PURE__ */ e.createElement("div", { "aria-hidden": "true", className: `${D}-dot` })
+      /* @__PURE__ */ e.createElement("div", { className: `${I}-content` }, /* @__PURE__ */ e.createElement("div", { "aria-hidden": "true", className: `${I}-title` }, O.title), /* @__PURE__ */ e.createElement("div", { "aria-hidden": "true", className: `${I}-details` }, O.siteName && /* @__PURE__ */ e.createElement("span", { className: `${I}-site` }, O.siteName), /* @__PURE__ */ e.createElement("span", { className: `${I}-timestamp` }, O.timestamp))),
+      !O.read && /* @__PURE__ */ e.createElement("div", { "aria-hidden": "true", className: `${I}-dot` })
     ));
   }), Z = /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: `${C}__header` }, /* @__PURE__ */ e.createElement("span", { className: `${C}__heading` }, o), /* @__PURE__ */ e.createElement("div", { className: `${C}__header-actions` }, i && r.length > 0 && /* @__PURE__ */ e.createElement(
     Xe,
@@ -10114,7 +10131,7 @@ const t0 = () => {
   }, [b]);
   const N = we(() => {
     C(!1);
-  }, []), I = we(() => {
+  }, []), D = we(() => {
     f || E(!1);
   }, [f]), x = we(() => {
     c || N();
@@ -10157,7 +10174,7 @@ const t0 = () => {
             f ? `${p}--open` : null,
             t
           ]),
-          onTransitionEnd: I,
+          onTransitionEnd: D,
           role: "dialog",
           style: _,
           ...g
@@ -10297,9 +10314,9 @@ const t0 = () => {
   const { context: M, floatingStyles: y, refs: N } = Te({
     open: E,
     onOpenChange: f
-  }), I = k2(M), x = a ? void 0 : We(M, {
+  }), D = k2(M), x = a ? void 0 : We(M, {
     outsidePressEvent: "mousedown"
-  }), z = n2(M), { getFloatingProps: L } = Ue([I, x, z]), { isMounted: P, styles: R } = Qe(M, {
+  }), z = n2(M), { getFloatingProps: L } = Ue([D, x, z]), { isMounted: P, styles: R } = Qe(M, {
     duration: {
       open: 300,
       close: 300
@@ -10838,11 +10855,11 @@ const t0 = () => {
   const E = typeof c, f = "pds-popover", C = $([
     `${f}__trigger-custom`,
     E === "string" ? `${f}__trigger-text` : ""
-  ]), k = c ? o : 0, M = ge(null), { context: y, floatingStyles: N, middlewareData: I, refs: x } = Te({
+  ]), k = c ? o : 0, M = ge(null), { context: y, floatingStyles: N, middlewareData: D, refs: x } = Te({
     placement: d,
     open: _,
-    onOpenChange(D) {
-      b(D), D || r();
+    onOpenChange(I) {
+      b(I), I || r();
     },
     middleware: [
       Ae(t2 + Hs + k),
@@ -10857,17 +10874,17 @@ const t0 = () => {
     L,
     P,
     R
-  ]), F = I.arrow?.x ?? 0, W = I.arrow?.y ?? 0, Z = F + F1 / 2, H = W + t2, { isMounted: O } = Qe(y, {
+  ]), F = D.arrow?.x ?? 0, W = D.arrow?.y ?? 0, Z = F + F1 / 2, H = W + t2, { isMounted: O } = Qe(y, {
     initial: {
       transform: "scale(0)"
     },
-    common: ({ side: D }) => ({
+    common: ({ side: I }) => ({
       transformOrigin: {
         top: `${Z}px calc(100% + ${t2}px)`,
         bottom: `${Z}px ${-t2}px`,
         left: `calc(100% + ${t2}px) ${H}px`,
         right: `${-t2}px ${H}px`
-      }[D]
+      }[I]
     })
   });
   return /* @__PURE__ */ e.createElement("div", { className: $([f, s]), ...h }, /* @__PURE__ */ e.createElement(
@@ -11252,7 +11269,7 @@ const Pe = 24, Fs = {
     screenReaderInstructions: u,
     ...h
   }, _) {
-    const b = "pds-sortable-list", [E, f] = K(null), C = ge(null), [k, M] = K(!1), y = ge(!1), [N, I] = K(null), x = ge(0), z = ge(0), L = ge("pointer"), P = ge(0), R = ge(null), [V, U] = K(0), F = ge(0), [W, Z] = K(0), H = ge(0), O = we(
+    const b = "pds-sortable-list", [E, f] = K(null), C = ge(null), [k, M] = K(!1), y = ge(!1), [N, D] = K(null), x = ge(0), z = ge(0), L = ge("pointer"), P = ge(0), R = ge(null), [V, U] = K(0), F = ge(0), [W, Z] = K(0), H = ge(0), O = we(
       (S, A) => {
         if (m > 0 && (S.key === "ArrowLeft" || S.key === "ArrowRight")) {
           S.preventDefault();
@@ -11265,7 +11282,7 @@ const Pe = 24, Fs = {
         return r4(S, A);
       },
       [m]
-    ), D = p === "always" || p === "toggle" && (o ?? !1), {
+    ), I = p === "always" || p === "toggle" && (o ?? !1), {
       currentItems: Y,
       expandItem: X,
       flatNodes: w,
@@ -11275,7 +11292,7 @@ const Pe = 24, Fs = {
       toggleExpand: le
     } = As({
       defaultItems: c,
-      isDragEnabled: D,
+      isDragEnabled: I,
       items: i,
       onReorder: v
     });
@@ -11289,7 +11306,7 @@ const Pe = 24, Fs = {
       x1(s4, {
         coordinateGetter: O
       })
-    ), ne = D ? `${b}--reorder-active` : null, ce = Ne(
+    ), ne = I ? `${b}--reorder-active` : null, ce = Ne(
       () => new Set(w.filter((S) => r(S.data)).map((S) => S.id)),
       [w, r]
     ), te = Ne(
@@ -11350,7 +11367,7 @@ const Pe = 24, Fs = {
     ]), Ie = we(
       (S) => {
         const { active: A } = S, q = L.current === "keyboard", J = w.find((de) => de.id === A.id);
-        f(A.id), C.current = A.id, M(q), y.current = q, P.current = J?.depth ?? 0, I(null), x.current = 0, z.current = 0, H.current = 0, Z(0), F.current = 0, U(0), J?.hasChildren && J?.isExpanded && (le(String(A.id)), R.current = String(A.id));
+        f(A.id), C.current = A.id, M(q), y.current = q, P.current = J?.depth ?? 0, D(null), x.current = 0, z.current = 0, H.current = 0, Z(0), F.current = 0, U(0), J?.hasChildren && J?.isExpanded && (le(String(A.id)), R.current = String(A.id));
       },
       [w, le]
     ), pe = we(
@@ -11390,7 +11407,7 @@ const Pe = 24, Fs = {
             if (w.slice(Ee, be + 1).some((o2) => ce.has(o2.id))) return;
           }
         }
-        I(A);
+        D(A);
       },
       [w, ce]
     ), _e = we(
@@ -11409,7 +11426,7 @@ const Pe = 24, Fs = {
     ), Le = we(
       (S) => {
         const { active: A, over: q } = S, J = y.current, de = F.current, Ee = H.current;
-        f(null), C.current = null, M(!1), y.current = !1, I(null), H.current = 0, Z(0), R.current && (X(R.current), R.current = null);
+        f(null), C.current = null, M(!1), y.current = !1, D(null), H.current = 0, Z(0), R.current && (X(R.current), R.current = null);
         const be = w.findIndex((ke) => ke.id === A.id), Je = J ? de * Pe : Ee * Pe, o2 = !q || A.id === q.id;
         let xe = q?.id ?? null;
         if (J && de > 0 && o2 && be > 0 && (xe = w[be - 1].id), !xe || A.id === xe) {
@@ -11494,7 +11511,7 @@ const Pe = 24, Fs = {
         te
       ]
     ), j = we(() => {
-      f(null), C.current = null, M(!1), y.current = !1, I(null), z.current = 0, H.current = 0, Z(0), F.current = 0, U(0), R.current && (X(R.current), R.current = null);
+      f(null), C.current = null, M(!1), y.current = !1, D(null), z.current = 0, H.current = 0, Z(0), F.current = 0, U(0), R.current && (X(R.current), R.current = null);
     }, [X]), oe = Ne(
       () => ({
         onDragStart({ active: S }) {
@@ -11589,7 +11606,7 @@ const Pe = 24, Fs = {
             columns: l,
             depth: S.depth,
             hasChildren: S.hasChildren,
-            isDragActive: D,
+            isDragActive: I,
             isDragging: J,
             isDropTarget: S.id === N && fe(S.id),
             isProjectedParent: S.id === Ce && !te.has(S.id),
@@ -11682,7 +11699,7 @@ const h0 = ({
     attributes: { role: "listitem", roleDescription: "sortable" },
     disabled: m,
     id: a
-  }), { "aria-pressed": k, ...M } = h, y = "pds-sortable-row", N = m ? `${y}--locked` : null, I = _ ? `${y}--dragging` : null, x = _ && p !== void 0 ? `${y}--depth-projecting` : null, z = d ? `${y}--drop-target` : null, L = v ? `${y}--projected-parent` : null, P = {
+  }), { "aria-pressed": k, ...M } = h, y = "pds-sortable-row", N = m ? `${y}--locked` : null, D = _ ? `${y}--dragging` : null, x = _ && p !== void 0 ? `${y}--depth-projecting` : null, z = d ? `${y}--drop-target` : null, L = v ? `${y}--projected-parent` : null, P = {
     ..._ && p !== void 0 ? {
       "--projected-depth-delta": p
     } : {},
@@ -11703,7 +11720,7 @@ const h0 = ({
       className: $([
         y,
         N,
-        I,
+        D,
         x,
         z,
         L,
@@ -11858,8 +11875,8 @@ const h0 = ({
   ...l
 }) => {
   const c = "pds-stepper", a = "pds-stepper-mobile", o = ge(null), [r] = at(o), d = r.width, i = parseFloat(b4) * 16, m = -36, v = 2, g = 5, p = n.length, u = n.map((b) => b.isCurrent).lastIndexOf(!0), h = n.map((b, E) => {
-    const f = E + 1, C = E === u, k = b.isComplete || E < u, M = b.hasError && C, N = (d - p * i) / (p + (p - 2)), I = i + N * 2, x = i + N, z = N + m * -1, L = E === 0, P = E === p - 1;
-    let R = I;
+    const f = E + 1, C = E === u, k = b.isComplete || E < u, M = b.hasError && C, N = (d - p * i) / (p + (p - 2)), D = i + N * 2, x = i + N, z = N + m * -1, L = E === 0, P = E === p - 1;
+    let R = D;
     (L || P) && (R = x);
     const V = `${c}__step`, U = [V];
     C && U.push(`${V}--current`), k && U.push(`${V}--complete`), M && U.push(`${V}--error`);
@@ -11880,8 +11897,8 @@ const h0 = ({
     )) : /* @__PURE__ */ e.createElement("div", { "aria-hidden": "true", className: `${c}__step-indicator` }), Z = /* @__PURE__ */ e.createElement("div", { className: `${c}__step-label` }, b.label);
     let H = /* @__PURE__ */ e.createElement("div", { className: `${c}__step-content` }, Z, W);
     if (k && b.callback) {
-      const O = (D) => {
-        b.callback(b), D.preventDefault();
+      const O = (I) => {
+        b.callback(b), I.preventDefault();
       };
       H = /* @__PURE__ */ e.createElement(
         "button",
@@ -11928,7 +11945,7 @@ const h0 = ({
   }), _ = n.map((b, E) => {
     const f = E + 1, C = E === u, k = E === p - 1, M = b.hasError && C, y = n[u + 1] ? n[u + 1].label : null;
     if (C) {
-      const N = /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("span", { className: "visually-hidden" }, t.step, " "), f, " of ", p), I = f / p * 100, x = M ? {
+      const N = /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("span", { className: "visually-hidden" }, t.step, " "), f, " of ", p), D = f / p * 100, x = M ? {
         "--pds-color-status-info-foreground": "var(--pds-color-status-critical-foreground)"
       } : {
         "--pds-color-status-info-foreground": "var(--pds-color-fg-default)"
@@ -11945,7 +11962,7 @@ const h0 = ({
           {
             innerLabel: N,
             label: "Step progress",
-            percentage: I,
+            percentage: D,
             size: "s",
             style: x
           }
@@ -12066,15 +12083,15 @@ const h0 = ({
   selectedRows: M,
   sortKey: y,
   sortOrder: N,
-  totalItemCount: I,
+  totalItemCount: D,
   ...x
 }) => {
   const z = "pds-table", L = c1(), P = c1(), R = E !== void 0, V = h !== void 0, U = _ !== void 0, F = V || p !== void 0 || f !== void 0, [W, Z] = K({
     key: l ?? "",
     order: l !== void 0 ? c : "asc"
-  }), [H, O] = K(1), [D, Y] = K(
+  }), [H, O] = K(1), [I, Y] = K(
     p ?? f?.[0] ?? 10
-  ), X = V ? p ?? 10 : D, w = (j) => {
+  ), X = V ? p ?? 10 : I, w = (j) => {
     U ? _(j) : Y(j), V || O(1);
   };
   he(() => {
@@ -12240,7 +12257,7 @@ const h0 = ({
       currentPage: V ? t ?? 1 : H,
       itemsPerPage: X,
       onPageChange: V ? h : O,
-      totalItemCount: V ? I ?? 0 : C.length
+      totalItemCount: V ? D ?? 0 : C.length
     }
   ))));
 }, b0 = ({
@@ -12292,7 +12309,7 @@ const h0 = ({
       h(E - 1), g(E - 1);
     }, y = () => {
       u.current[v].focus();
-    }, I = {
+    }, D = {
       ArrowRight: f,
       ArrowLeft: C,
       Home: k,
@@ -12300,7 +12317,7 @@ const h0 = ({
       Space: y,
       Enter: y
     }[b.code];
-    I && (b.preventDefault(), I());
+    D && (b.preventDefault(), D());
   };
   return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
     "div",
@@ -12599,7 +12616,7 @@ const h0 = ({
   he(() => {
     N(r || !1);
   }, [r]);
-  const I = "pds-app-layout", x = h ? `${I}--scrollable` : null, z = y ? `${b}rem` : `${E}`, L = {
+  const D = "pds-app-layout", x = h ? `${D}--scrollable` : null, z = y ? `${b}rem` : `${E}`, L = {
     backgroundColor: _ || void 0,
     maxWidth: y ? void 0 : `${f}rem`,
     minWidth: y ? `${b}rem` : `${C}rem`,
@@ -12659,22 +12676,22 @@ const h0 = ({
     const ne = new ResizeObserver(T);
     return ne.observe(document.documentElement), () => ne.disconnect();
   }, []);
-  const Z = Fe(s), H = Z.__unslotted, O = Z.sidebar, D = Z.identity, Y = Z["content-top"], X = Z.navigation, w = Z["content-bottom"], se = D || Y || X || w, Q = se ? /* @__PURE__ */ e.createElement(e.Fragment, null, (D || c) && /* @__PURE__ */ e.createElement("div", { className: `${I}__sidebar-identity` }, D, c && !y && /* @__PURE__ */ e.createElement(
+  const Z = Fe(s), H = Z.__unslotted, O = Z.sidebar, I = Z.identity, Y = Z["content-top"], X = Z.navigation, w = Z["content-bottom"], se = I || Y || X || w, Q = se ? /* @__PURE__ */ e.createElement(e.Fragment, null, (I || c) && /* @__PURE__ */ e.createElement("div", { className: `${D}__sidebar-identity` }, I, c && !y && /* @__PURE__ */ e.createElement(
     f2,
     {
       hasBorder: !0,
       ariaLabel: i.drawerToggle,
-      className: `${I}__drawer-toggle`,
+      className: `${D}__drawer-toggle`,
       iconName: "sidebar",
       onClick: p,
       size: "s"
     }
-  )), Y && /* @__PURE__ */ e.createElement("div", { className: `${I}__sidebar-content-top` }, Y), X && /* @__PURE__ */ e.createElement("div", { className: `${I}__sidebar-navigation` }, X), w && /* @__PURE__ */ e.createElement("div", { className: `${I}__sidebar-content-bottom` }, w)) : O, ue = G1(
+  )), Y && /* @__PURE__ */ e.createElement("div", { className: `${D}__sidebar-content-top` }, Y), X && /* @__PURE__ */ e.createElement("div", { className: `${D}__sidebar-navigation` }, X), w && /* @__PURE__ */ e.createElement("div", { className: `${D}__sidebar-content-bottom` }, w)) : O, ue = G1(
     v,
     {
       ...g,
       className: $([
-        `${I}__main`,
+        `${D}__main`,
         g?.className
       ]),
       style: {
@@ -12688,8 +12705,8 @@ const h0 = ({
     {
       ...k,
       className: $([
-        `${I}__sidebar`,
-        y ? `${I}__sidebar--collapsed` : null,
+        `${D}__sidebar`,
+        y ? `${D}__sidebar--collapsed` : null,
         k?.className
       ]),
       style: L
@@ -12697,30 +12714,30 @@ const h0 = ({
     a && /* @__PURE__ */ e.createElement(
       De,
       {
-        className: `${I}__sidebar-toggle-tooltip`,
+        className: `${D}__sidebar-toggle-tooltip`,
         content: y ? i.expandSidebar : i.collapseSidebar,
         customTrigger: /* @__PURE__ */ e.createElement(
           "button",
           {
             "aria-expanded": !y,
             "aria-label": y ? i.expandSidebar : i.collapseSidebar,
-            className: `${I}__sidebar-toggle-button`,
+            className: `${D}__sidebar-toggle-button`,
             onClick: R,
             type: "button"
           },
-          /* @__PURE__ */ e.createElement("span", { className: `${I}__sidebar-toggle-icon` }, /* @__PURE__ */ e.createElement(G, { iconName: "angleLeft", size: "s", verticalAlign: "-1px" }))
+          /* @__PURE__ */ e.createElement("span", { className: `${D}__sidebar-toggle-icon` }, /* @__PURE__ */ e.createElement(G, { iconName: "angleLeft", size: "s", verticalAlign: "-1px" }))
         ),
         offsetValue: { mainAxis: 8, crossAxis: -96 },
         preferredPlacement: "right-end"
       }
     ),
-    /* @__PURE__ */ e.createElement("div", { className: `${I}__sidebar-inner` }, Q)
+    /* @__PURE__ */ e.createElement("div", { className: `${D}__sidebar-inner` }, Q)
   ), ue);
   return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
     "div",
     {
       ref: W,
-      className: $([I, x, n ?? ""]),
+      className: $([D, x, n ?? ""]),
       ...M
     },
     le