@pantheon-systems/pds-toolkit-react 2.0.0-alpha.49 → 2.0.0-alpha.50

package/dist/index.js

@@ -1,8 +1,8 @@
 import e, { Children as t, cloneElement as n, createContext as r, createElement as i, forwardRef as a, isValidElement as o, useCallback as s, useContext as c, useEffect as l, useId as u, useImperativeHandle as d, useLayoutEffect as f, useMemo as p, useRef as m, useState as h, useSyncExternalStore as g } from "react";
 import _ from "hash-sum";
 import { FloatingArrow as v, FloatingFocusManager as y, FloatingOverlay as b, FloatingPortal as x, arrow as S, autoUpdate as C, flip as w, offset as T, safePolygon as E, shift as D, size as O, useClick as k, useDismiss as A, useFloating as j, useFocus as M, useHover as N, useId as P, useInteractions as F, useListNavigation as I, useRole as L, useTransitionStyles as R, useTypeahead as z } from "@floating-ui/react";
-import { Bar as B, BarChart as V, CartesianGrid as H, Cell as U, Line as ee, LineChart as W, Pie as G, PieChart as K, ReferenceLine as q, ResponsiveContainer as te, Tooltip as ne, XAxis as J, YAxis as re } from "recharts";
-import { CodeBlock as ie } from "react-code-block";
+import { Bar as B, BarChart as V, CartesianGrid as H, Cell as U, Line as W, LineChart as G, Pie as K, PieChart as ee, ReferenceLine as q, ResponsiveContainer as te, Tooltip as ne, XAxis as re, YAxis as ie } from "recharts";
+import { CodeBlock as J } from "react-code-block";
 import { useCombobox as Y, useMultipleSelection as X } from "downshift";
 import { format as ae } from "date-fns";
 import { DayPicker as oe } from "react-day-picker";
@@ -3524,12 +3524,12 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 		return e.forEach((t, o) => {
 			t === i ? (n.push(a), a = [], a.push(t), i = r.shift()) : (a.push(t), o + 1 === e.length && n.push(a));
 		}), n.filter((e) => e.length > 0);
-	}, H, U = u === "m" ? "s" : "xs", ee = f ? /* @__PURE__ */ e.createElement(e.Fragment, null, s, /* @__PURE__ */ e.createElement(Gt, {
+	}, H, U = u === "m" ? "s" : "xs", W = f ? /* @__PURE__ */ e.createElement(e.Fragment, null, s, /* @__PURE__ */ e.createElement(Gt, {
 		className: "pds-button__tally",
 		label: f.label,
 		size: U,
 		type: f.type
-	})) : s, W = f ? /* @__PURE__ */ e.createElement("span", { className: `${j}__accordion-label` }, s, /* @__PURE__ */ e.createElement(Gt, {
+	})) : s, G = f ? /* @__PURE__ */ e.createElement("span", { className: `${j}__accordion-label` }, s, /* @__PURE__ */ e.createElement(Gt, {
 		className: `${j}__tally`,
 		label: f.label,
 		size: "s",
@@ -3546,7 +3546,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 		iconName: "angleDown",
 		id: M,
 		isSplitButton: o,
-		label: ee,
+		label: W,
 		size: u,
 		statusDot: d,
 		type: "button",
@@ -3571,18 +3571,18 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 			...C({ onClick: L })
 		});
 	}
-	let G = i ? /* @__PURE__ */ e.createElement("span", { className: `${j}__icon-label` }, /* @__PURE__ */ e.createElement(Q, { iconName: r }), " ", s) : W, K = T ? `${j}--expanded` : null;
+	let K = i ? /* @__PURE__ */ e.createElement("span", { className: `${j}__icon-label` }, /* @__PURE__ */ e.createElement(Q, { iconName: r }), " ", s) : G, ee = T ? `${j}--expanded` : null;
 	return /* @__PURE__ */ e.createElement("span", {
 		className: Z([
 			j,
-			K,
+			ee,
 			t
 		]),
 		"data-testid": p,
 		..._
 	}, A ? /* @__PURE__ */ e.createElement(gn, {
 		disabled: n,
-		label: G
+		label: K
 	}, /* @__PURE__ */ e.createElement("ul", {
 		className: `${j}__mobile-menu`,
 		role: "menu"
@@ -4161,18 +4161,18 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 }, message: d, onBlur: f, onFocus: p, onOptionSelect: m, options: g, required: _ = !1, showLabel: v = !0, size: y = "s", tooltipText: b = null, validationMessage: x, validationStatus: S, value: C, ...w }) => {
 	let T = Dt(s), E = "pds-select", D = t ? `${E}--auto-width` : null, O = y === "s" ? null : `${E}--${y}`, k = i ? $.disabled : null, A = _ && !i ? $.required : null, j = S === "error" ? $.error : null, M = S === "success" ? $.success : null, N = null;
 	S === "error" && (N = "error"), S === "success" && (N = "success");
-	let P = x || d, F = C !== void 0, I = r !== void 0, L = ((e) => e.reduce((e, t) => Rt(t) ? [...e, ...t.options] : [...e, t], []))(g), R = (e) => L.findIndex((t) => t.value === e), z = F && R(C) >= 0 ? R(C) : null, B = I ? R(r) : null, [V, H] = h((z || B) ?? null), { activeIndex: U, floatingStyles: ee, getFloatingProps: W, getItemProps: G, getReferenceProps: K, isMounted: q, listRef: te, refs: ne, setIsOpen: J, transitionStyles: re } = rn({
+	let P = x || d, F = C !== void 0, I = r !== void 0, L = ((e) => e.reduce((e, t) => Rt(t) ? [...e, ...t.options] : [...e, t], []))(g), R = (e) => L.findIndex((t) => t.value === e), z = F && R(C) >= 0 ? R(C) : null, B = I ? R(r) : null, [V, H] = h((z || B) ?? null), { activeIndex: U, floatingStyles: W, getFloatingProps: G, getItemProps: K, getReferenceProps: ee, isMounted: q, listRef: te, refs: ne, setIsOpen: re, transitionStyles: ie } = rn({
 		enableClick: !i,
 		enableTypeahead: !0,
 		role: "listbox",
 		selectedIndex: V,
 		variant: "input"
-	}), ie = V === null ? void 0 : L[V]?.label, Y = V === null ? void 0 : L[V]?.icon, X = V === null ? void 0 : L[V]?.value, ae = (e) => {
+	}), J = V === null ? void 0 : L[V]?.label, Y = V === null ? void 0 : L[V]?.icon, X = V === null ? void 0 : L[V]?.value, ae = (e) => {
 		let t = L[e];
-		F || (H(e), J(!1)), m && m(t);
+		F || (H(e), re(!1)), m && m(t);
 	};
 	l(() => {
-		F && (H(R(C)), J(!1));
+		F && (H(R(C)), re(!1));
 	}, [C]);
 	let oe = () => {
 		f && f(X);
@@ -4202,7 +4202,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 						"aria-disabled": t?.disabled,
 						"aria-selected": r === V && r === U,
 						tabIndex: r === U ? 0 : -1,
-						...!t?.disabled && G({
+						...!t?.disabled && K({
 							onClick() {
 								ae(r);
 							},
@@ -4226,7 +4226,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 				"aria-disabled": t?.disabled,
 				"aria-selected": r === V && r === U,
 				tabIndex: r === U ? 0 : -1,
-				...!t?.disabled && G({
+				...!t?.disabled && K({
 					onClick() {
 						ae(r);
 					},
@@ -4274,23 +4274,23 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 		className: `${E}__input-wrapper`,
 		id: o,
 		tabIndex: 0,
-		...K({
+		...ee({
 			onClick: ce,
 			onBlur: oe,
 			onFocus: se
 		})
-	}, N && /* @__PURE__ */ e.createElement(Nt, { variant: N }), /* @__PURE__ */ e.createElement("span", { className: `${E}__input-inner` }, /* @__PURE__ */ e.createElement("span", { className: `${E}__option-text` }, (Y || !ie && a) && le(Y || a, `${E}__icon`), /* @__PURE__ */ e.createElement("span", { className: `${E}__option-label-text` }, ie ?? u.selectOptionText)), /* @__PURE__ */ e.createElement(Q, {
+	}, N && /* @__PURE__ */ e.createElement(Nt, { variant: N }), /* @__PURE__ */ e.createElement("span", { className: `${E}__input-inner` }, /* @__PURE__ */ e.createElement("span", { className: `${E}__option-text` }, (Y || !J && a) && le(Y || a, `${E}__icon`), /* @__PURE__ */ e.createElement("span", { className: `${E}__option-label-text` }, J ?? u.selectOptionText)), /* @__PURE__ */ e.createElement(Q, {
 		className: `${E}__trigger-icon`,
 		iconName: "angleDown"
 	}))), q && /* @__PURE__ */ e.createElement("div", {
 		ref: ne.setFloating,
 		className: `pds-dropdown__panel ${E}__dropdown`,
 		style: {
-			...ee,
+			...W,
 			zIndex: "var(--pds-z-index-dropdown)"
 		},
-		...W()
-	}, /* @__PURE__ */ e.createElement("div", { style: { ...re } }, /* @__PURE__ */ e.createElement("ul", {
+		...G()
+	}, /* @__PURE__ */ e.createElement("div", { style: { ...ie } }, /* @__PURE__ */ e.createElement("ul", {
 		className: `${E}__options`,
 		role: "group"
 	}, ue(g)))), P && /* @__PURE__ */ e.createElement(jt, {
@@ -4622,7 +4622,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 	let t = Math.abs(e);
 	return t >= 1e9 ? `${(e / 1e9).toFixed(1).replace(/\.0$/, "")}B` : t >= 1e6 ? `${(e / 1e6).toFixed(1).replace(/\.0$/, "")}M` : t >= 1e3 ? `${(e / 1e3).toFixed(1).replace(/\.0$/, "")}K` : String(e);
 }, ir = ({ barRadius: t = 2, chartHeight: n, chartWidth: r, className: i, colorPalette: a = "categorical", data: o = [], isLoading: c = !1, isThumbnail: u = !1, labelStrings: d = {}, layout: f = "horizontal", legendVariant: p = "inline", onTimePeriodChange: g, selectedTimePeriod: _, series: v = [], showAccessibleTable: y, showAxisLines: b, showGrid: x, showLegend: S, showTooltip: E, timePeriodOptions: O, tooltipContent: k, variant: A = "stacked", xAxisLabel: M, xAxisTickInterval: N, yAxisDomain: P, yAxisFormatter: F = rr, yAxisLabel: I, yAxisTickInterval: L, ...z }) => {
-	let { accessibleTableDescription: U = "Bar chart data", emptyStateHeading: ee = "No data available", emptyStateMessage: W, legendTableHeader: G, loadingLabel: K = "Loading chart data" } = d, q = m(null), ie = Hn(a, Jn(q, a)), Y = n ?? (u ? 60 : 360), X = r ?? (u ? 60 : void 0), ae = x ?? !u, oe = b ?? !u, se = S ?? !u, ce = E ?? !u, le = y ?? !0, [ue, de] = h(null), fe = m(ue);
+	let { accessibleTableDescription: U = "Bar chart data", emptyStateHeading: W = "No data available", emptyStateMessage: G, legendTableHeader: K, loadingLabel: ee = "Loading chart data" } = d, q = m(null), J = Hn(a, Jn(q, a)), Y = n ?? (u ? 60 : 360), X = r ?? (u ? 60 : void 0), ae = x ?? !u, oe = b ?? !u, se = S ?? !u, ce = E ?? !u, le = y ?? !0, [ue, de] = h(null), fe = m(ue);
 	ue && (fe.current = ue);
 	let pe = m({ getBoundingClientRect: () => ({
 		bottom: 0,
@@ -4672,7 +4672,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 	if (c) return /* @__PURE__ */ e.createElement("div", {
 		ref: q,
 		"aria-busy": "true",
-		"aria-label": K,
+		"aria-label": ee,
 		className: Z([
 			be,
 			`${be}--loading`,
@@ -4698,8 +4698,8 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 		},
 		...z
 	}, /* @__PURE__ */ e.createElement(Ln, {
-		heading: ee,
-		message: W
+		heading: W,
+		message: G
 	}));
 	let we = f === "vertical", Te = (e) => A === "grouped" || A === "stacked" && e === v.length - 1 ? we ? [
 		0,
@@ -4755,7 +4755,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 		stroke: "var(--pds-color-border-default)",
 		strokeDasharray: "3 3",
 		vertical: we
-	}), /* @__PURE__ */ e.createElement(J, {
+	}), /* @__PURE__ */ e.createElement(re, {
 		axisLine: oe,
 		dataKey: we ? void 0 : "label",
 		hide: !oe,
@@ -4771,7 +4771,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 		tickLine: !1,
 		tickMargin: 10,
 		type: we ? "number" : "category"
-	}), /* @__PURE__ */ e.createElement(re, {
+	}), /* @__PURE__ */ e.createElement(ie, {
 		axisLine: oe,
 		dataKey: we ? "label" : void 0,
 		domain: P,
@@ -4803,12 +4803,12 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 	}), v.map((t, n) => /* @__PURE__ */ e.createElement(B, {
 		key: t.dataKey,
 		dataKey: t.dataKey,
-		fill: Kn(n, ie, t.color, Un(a, t.paletteIndex)),
+		fill: Kn(n, J, t.color, Un(a, t.paletteIndex)),
 		name: t.label,
 		onMouseEnter: k ? void 0 : (e) => {
 			let r = e;
 			ce && r && de({
-				color: Kn(n, ie, t.color, Un(a, t.paletteIndex)),
+				color: Kn(n, J, t.color, Un(a, t.paletteIndex)),
 				label: String(r.label ?? ""),
 				name: t.label,
 				value: Number(r[t.dataKey] ?? 0)
@@ -4833,8 +4833,8 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 	}), /* @__PURE__ */ e.createElement("span", { className: "recharts-tooltip-item-name" }, fe.current.name), /* @__PURE__ */ e.createElement("span", { className: "recharts-tooltip-item-separator" }, ": "), /* @__PURE__ */ e.createElement("span", { className: "recharts-tooltip-item-value" }, F(fe.current.value)))), se && /* @__PURE__ */ e.createElement(Qn, {
 		data: o,
 		series: v,
-		seriesColors: ie,
-		tableHeader: G,
+		seriesColors: J,
+		tableHeader: K,
 		valueFormatter: F,
 		variant: p
 	}), le && /* @__PURE__ */ e.createElement(Zn, {
@@ -4849,7 +4849,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 		default: return;
 	}
 }, or = ({ annotations: t, chartHeight: n, chartWidth: r, className: i, colorPalette: a = "categorical", data: o = [], isLoading: s = !1, isThumbnail: c = !1, labelStrings: l = {}, legendVariant: u = "inline", lineStyle: d = "smooth", onTimePeriodChange: f, referenceLines: p, selectedTimePeriod: h, series: g = [], showAccessibleTable: _, showAxisLines: v, showDataPoints: y, showGrid: b, showLegend: x, showTooltip: S, timePeriodOptions: C, tooltipContent: w, xAxisLabel: T, xAxisTickInterval: E, yAxisDomain: D, yAxisFormatter: O = rr, yAxisLabel: k, yAxisTickInterval: A, ...j }) => {
-	let { accessibleTableDescription: M = "Line chart data", emptyStateHeading: N = "No data available", emptyStateMessage: P, legendTableHeader: F, loadingLabel: I = "Loading chart data" } = l, L = m(null), R = Hn(a, Jn(L, a)), z = n ?? (c ? 60 : 360), B = r ?? (c ? 60 : void 0), V = b ?? !c, U = v ?? !c, G = x ?? !c, K = S ?? !c, ie = y ?? !c, Y = _ ?? !0, X = "pds-line-chart";
+	let { accessibleTableDescription: M = "Line chart data", emptyStateHeading: N = "No data available", emptyStateMessage: P, legendTableHeader: F, loadingLabel: I = "Loading chart data" } = l, L = m(null), R = Hn(a, Jn(L, a)), z = n ?? (c ? 60 : 360), B = r ?? (c ? 60 : void 0), V = b ?? !c, U = v ?? !c, K = x ?? !c, ee = S ?? !c, J = y ?? !c, Y = _ ?? !0, X = "pds-line-chart";
 	return s ? /* @__PURE__ */ e.createElement("div", {
 		ref: L,
 		"aria-busy": "true",
@@ -4864,7 +4864,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 	}, /* @__PURE__ */ e.createElement(nr, {
 		height: z,
 		legendVariant: u,
-		showLegend: G
+		showLegend: K
 	})) : !o || o.length === 0 ? /* @__PURE__ */ e.createElement("div", {
 		ref: L,
 		className: Z([
@@ -4899,7 +4899,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 	})), /* @__PURE__ */ e.createElement("div", { "aria-hidden": "true" }, /* @__PURE__ */ e.createElement(te, {
 		height: z,
 		width: "100%"
-	}, /* @__PURE__ */ e.createElement(W, {
+	}, /* @__PURE__ */ e.createElement(G, {
 		data: o,
 		margin: c ? {
 			bottom: 0,
@@ -4915,7 +4915,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 	}, V && /* @__PURE__ */ e.createElement(H, {
 		stroke: "var(--pds-color-border-default)",
 		strokeDasharray: "3 3"
-	}), /* @__PURE__ */ e.createElement(J, {
+	}), /* @__PURE__ */ e.createElement(re, {
 		axisLine: U,
 		dataKey: "label",
 		hide: !U,
@@ -4929,7 +4929,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 		tick: U ? Yn : !1,
 		tickLine: !1,
 		tickMargin: 10
-	}), /* @__PURE__ */ e.createElement(re, {
+	}), /* @__PURE__ */ e.createElement(ie, {
 		axisLine: U,
 		domain: D,
 		hide: !U,
@@ -4945,7 +4945,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 		tickFormatter: O,
 		tickLine: !1,
 		tickMargin: 6
-	}), K && /* @__PURE__ */ e.createElement(ne, { content: (t) => {
+	}), ee && /* @__PURE__ */ e.createElement(ne, { content: (t) => {
 		if (!t.active || !t.payload?.length) return null;
 		let n = t.payload.map((e) => ({
 			color: String(e.color ?? ""),
@@ -4963,11 +4963,11 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 			className: "recharts-tooltip-item__color",
 			style: { backgroundColor: t.color }
 		}), t.name, /* @__PURE__ */ e.createElement("span", { className: "recharts-tooltip-item-separator" }, " ", ":", " "), O(t.value))));
-	} }), g.map((t, n) => /* @__PURE__ */ e.createElement(ee, {
+	} }), g.map((t, n) => /* @__PURE__ */ e.createElement(W, {
 		key: t.dataKey,
-		activeDot: ie ? { r: 6 } : !1,
+		activeDot: J ? { r: 6 } : !1,
 		dataKey: t.dataKey,
-		dot: ie ? {
+		dot: J ? {
 			fill: Kn(n, R, t.color, Un(a, t.paletteIndex)),
 			r: 4,
 			strokeWidth: 0
@@ -5017,7 +5017,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 			strokeDasharray: ar(t.strokeStyle ?? "dashed"),
 			x: t.atLabel
 		});
-	})))), G && /* @__PURE__ */ e.createElement(Qn, {
+	})))), K && /* @__PURE__ */ e.createElement(Qn, {
 		data: o,
 		series: g,
 		seriesColors: R,
@@ -5108,7 +5108,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 	}, /* @__PURE__ */ e.createElement(te, {
 		height: w,
 		width: "100%"
-	}, /* @__PURE__ */ e.createElement(K, null, /* @__PURE__ */ e.createElement(G, {
+	}, /* @__PURE__ */ e.createElement(ee, null, /* @__PURE__ */ e.createElement(K, {
 		cx: "50%",
 		cy: "50%",
 		data: A,
@@ -5165,7 +5165,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 		width: 0,
 		x: 0,
 		y: 0
-	}) }), { context: V, floatingStyles: H, refs: U, update: ee } = j({
+	}) }), { context: V, floatingStyles: H, refs: U, update: W } = j({
 		middleware: [
 			T(8),
 			w(),
@@ -5174,7 +5174,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 		open: !!I,
 		placement: "top",
 		whileElementsMounted: C
-	}), { isMounted: W, styles: G } = R(V, {
+	}), { isMounted: G, styles: K } = R(V, {
 		duration: {
 			close: 150,
 			open: 150
@@ -5184,7 +5184,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 	l(() => {
 		U.setReference(B.current);
 	}, [U]);
-	let K = s((e) => {
+	let ee = s((e) => {
 		B.current.getBoundingClientRect = () => ({
 			bottom: e.clientY,
 			height: 0,
@@ -5194,8 +5194,8 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 			width: 0,
 			x: e.clientX,
 			y: e.clientY
-		}), ee();
-	}, [ee]), q = s(() => {
+		}), W();
+	}, [W]), q = s(() => {
 		L(null);
 	}, []);
 	return o ? /* @__PURE__ */ e.createElement("div", {
@@ -5234,7 +5234,7 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 		"aria-hidden": "true",
 		className: `${k}__track`,
 		onMouseLeave: N ? q : void 0,
-		onMouseMove: N ? K : void 0,
+		onMouseMove: N ? ee : void 0,
 		style: { height: t }
 	}, a.map((t, n) => {
 		let r = F(n, t), i = Math.round(t.value / P * 100);
@@ -5252,13 +5252,13 @@ var hn = ({ className: t, clearLabel: n = "Clear", disabled: r = !1, filterKey:
 				flex: t.value
 			}
 		});
-	})), N && W && z.current && /* @__PURE__ */ e.createElement("div", {
+	})), N && G && z.current && /* @__PURE__ */ e.createElement("div", {
 		ref: U.setFloating,
 		className: "recharts-default-tooltip",
 		role: "tooltip",
 		style: {
 			...H,
-			...G,
+			...K,
 			pointerEvents: "none",
 			zIndex: "var(--pds-z-index-notifications)"
 		}
@@ -6364,17 +6364,17 @@ var fr = {
 			variant: "reverse"
 		}))));
 	}
-	let C = /* @__PURE__ */ e.createElement(ie.LineContent, null, /* @__PURE__ */ e.createElement(ie.Token, null)), w = /* @__PURE__ */ e.createElement("div", { className: `${g}__line ${_}` }, /* @__PURE__ */ e.createElement(ie.LineNumber, { className: `${g}__number` }), C), T = /* @__PURE__ */ e.createElement("div", { className: `${g}__line` }, /* @__PURE__ */ e.createElement("span", { className: `${g}__prompt` }, f), C);
+	let C = /* @__PURE__ */ e.createElement(J.LineContent, null, /* @__PURE__ */ e.createElement(J.Token, null)), w = /* @__PURE__ */ e.createElement("div", { className: `${g}__line ${_}` }, /* @__PURE__ */ e.createElement(J.LineNumber, { className: `${g}__number` }), C), T = /* @__PURE__ */ e.createElement("div", { className: `${g}__line` }, /* @__PURE__ */ e.createElement("span", { className: `${g}__prompt` }, f), C);
 	return /* @__PURE__ */ e.createElement("div", {
 		className: Z([g, t ?? ""]),
 		style: v,
 		...h
-	}, c ? y : /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(ie, {
+	}, c ? y : /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(J, {
 		code: n,
 		language: l || "",
 		prism: dr.default,
 		theme: fr
-	}, /* @__PURE__ */ e.createElement(ie.Code, {
+	}, /* @__PURE__ */ e.createElement(J.Code, {
 		className: `${g}__code`,
 		tabIndex: 0
 	}, a || o ? a ? w : T : C)), i && /* @__PURE__ */ e.createElement("div", { className: `${g}__copy` }, /* @__PURE__ */ e.createElement(en, {
@@ -6439,10 +6439,10 @@ var fr = {
 		className: Z(["pds-video-embed", t ?? ""]),
 		...a
 	}, l);
-}, _r = ({ alignment: t = "center", className: n, ctaRegion: r, heading: i, headingLevel: a = "h1", image: o, imageMarginLeft: s = "0", imageWidth: c = "40%", isWithinPanel: l, maxWidth: u = "1200px", message: d, video: f, ...p }) => {
-	let m = "pds-horizontal-empty-state", h = `${m}--${t}`, g = l ? `${m}--panel` : null, _ = f ? `${m}--video` : null, v = {
-		marginInlineStart: s,
-		width: c
+}, _r = ({ alignment: t = "center", className: n, ctaRegion: r, hasIndentedContent: i, heading: a, headingLevel: o = "h1", image: s, imageMarginLeft: c = "0", imageWidth: l = "40%", maxWidth: u = "100%", message: d, video: f, ...p }) => {
+	let m = "pds-horizontal-empty-state", h = `${m}--${t}`, g = i ? `${m}--indented-content` : null, _ = f ? `${m}--video` : null, v = {
+		marginInlineStart: c,
+		width: l
 	};
 	return d = typeof d == "string" ? /* @__PURE__ */ e.createElement("p", { className: `${m}__message` }, d) : /* @__PURE__ */ e.createElement("div", { className: `${m}__message` }, d), /* @__PURE__ */ e.createElement("div", {
 		className: Z([
@@ -6456,16 +6456,16 @@ var fr = {
 		...p
 	}, /* @__PURE__ */ e.createElement("div", { className: `${m}__content` }, /* @__PURE__ */ e.createElement(Jt, {
 		baseClass: m,
-		className: `${l ? "pds-ts-2xl" : "pds-ts-4xl"} pds-fw-bold`,
-		level: a
-	}, i), d && d, r && /* @__PURE__ */ e.createElement("div", { className: `${m}__cta` }, r)), o && !f && /* @__PURE__ */ e.createElement("div", {
+		className: "pds-ts-4xl pds-fw-bold",
+		level: o
+	}, a), d && d, r && /* @__PURE__ */ e.createElement("div", { className: `${m}__cta` }, r)), s && !f && /* @__PURE__ */ e.createElement("div", {
 		className: `${m}__media ${m}__media--image`,
 		style: v
-	}, typeof o == "string" ? /* @__PURE__ */ e.createElement("img", {
+	}, typeof s == "string" ? /* @__PURE__ */ e.createElement("img", {
 		alt: "",
 		className: `${m}__image`,
-		src: o
-	}) : o), f && /* @__PURE__ */ e.createElement("div", { className: `${m}__media ${m}__media--video` }, /* @__PURE__ */ e.createElement(gr, {
+		src: s
+	}) : s), f && /* @__PURE__ */ e.createElement("div", { className: `${m}__media ${m}__media--video` }, /* @__PURE__ */ e.createElement(gr, {
 		platform: f.platform,
 		videoId: f.videoId
 	})));
@@ -6959,15 +6959,15 @@ var fr = {
 	searchShortcut: "Press / to focus the search field",
 	triggerButton: "Toggle dropdown menu"
 }, loadingText: v = "Loading results...", message: y, noResultsText: b = "No results found", onBlur: x, onChange: S, onClear: E, onFocus: D, onOptionSelect: k, options: A, placeholder: M, required: N = !1, showLabel: P = !0, showUnfilteredOptions: F = !1, size: I = "s", tooltipText: L = null, validationMessage: z, validationStatus: B, value: V, ...H }, U) => {
-	let ee = Dt(d), W = "pds-combobox", G = I === "s" ? null : `${W}--${I}`, K = r ? $.disabled : null, q = N && !r ? $.required : null, te = B === "error" ? $.error : null, ne = B === "success" ? $.success : null, J = null;
-	o && (J = "search"), B === "error" && (J = "error"), B === "success" && (J = "success");
-	let re = z || y, ie = V !== void 0, X = n !== void 0, ae = (e) => {
+	let W = Dt(d), G = "pds-combobox", K = I === "s" ? null : `${G}--${I}`, ee = r ? $.disabled : null, q = N && !r ? $.required : null, te = B === "error" ? $.error : null, ne = B === "success" ? $.success : null, re = null;
+	o && (re = "search"), B === "error" && (re = "error"), B === "success" && (re = "success");
+	let ie = z || y, J = V !== void 0, X = n !== void 0, ae = (e) => {
 		let t = A.find((t) => t.value === e);
 		return t ? t.label : "";
-	}, [oe, se] = h(X ? n : void 0), [ce, le] = h(ie ? V ?? "" : X ? ae(n) : "");
+	}, [oe, se] = h(X ? n : void 0), [ce, le] = h(J ? V ?? "" : X ? ae(n) : "");
 	l(() => {
-		ie && le(V ?? "");
-	}, [ie, V]);
+		J && le(V ?? "");
+	}, [J, V]);
 	let ue = m(null), de = (e) => e.map(({ label: e, optionDisplay: t, searchIndex: n, value: r, ...i }) => {
 		let a = r || e, o = [e, r];
 		return n && o.push(...n), {
@@ -6997,7 +6997,7 @@ var fr = {
 			le(e ?? "");
 		},
 		onSelectedItemChange: ({ selectedItem: e }) => {
-			e && (ie || le(e.label), se(e.value), k?.(e));
+			e && (J || le(e.label), se(e.value), k?.(e));
 		},
 		stateReducer: (e, { changes: t, type: n }) => {
 			if (n === Y.stateChangeTypes.InputBlur) return {
@@ -7053,7 +7053,7 @@ var fr = {
 	}, [U, Se]), Ee = () => {
 		_e ? ye() : ve();
 	}, De = () => {
-		ie || le(""), se(void 0), ye(), ue.current?.focus(), F && ve(), E?.();
+		J || le(""), se(void 0), ye(), ue.current?.focus(), F && ve(), E?.();
 	}, Oe = (e) => {
 		x?.(oe);
 	}, ke = (e) => {
@@ -7065,19 +7065,19 @@ var fr = {
 			item: t,
 			index: n
 		})
-	}, /* @__PURE__ */ e.createElement("span", { className: `${W}__option-label` }, t.optionDisplay || t.label)));
+	}, /* @__PURE__ */ e.createElement("span", { className: `${G}__option-label` }, t.optionDisplay || t.label)));
 	return /* @__PURE__ */ e.createElement("div", {
 		className: Z([
 			$.base,
-			W,
 			G,
 			K,
+			ee,
 			q,
 			te,
 			ne,
 			t ?? ""
 		]),
-		style: d ? ee : null,
+		style: d ? W : null,
 		...H
 	}, /* @__PURE__ */ e.createElement(At, {
 		disabled: r,
@@ -7088,16 +7088,16 @@ var fr = {
 		tooltipText: L
 	}), /* @__PURE__ */ e.createElement("span", {
 		ref: Te,
-		"aria-describedby": re ? `${u}__message` : null,
+		"aria-describedby": ie ? `${u}__message` : null,
 		"aria-disabled": r ? !0 : null,
 		"aria-invalid": B === "error" ? !0 : null,
 		"aria-required": N ? !0 : null,
-		className: `${W}__input-wrapper`,
+		className: `${G}__input-wrapper`,
 		id: u
-	}, J && /* @__PURE__ */ e.createElement(Nt, { variant: J }), /* @__PURE__ */ e.createElement("input", {
+	}, re && /* @__PURE__ */ e.createElement(Nt, { variant: re }), /* @__PURE__ */ e.createElement("input", {
 		ref: ue,
 		autoComplete: "off",
-		className: `${W}__input`,
+		className: `${G}__input`,
 		id: `input-${u}`,
 		...pe({
 			"aria-label": _.inputInstructions,
@@ -7119,30 +7119,30 @@ var fr = {
 	}), a && /* @__PURE__ */ e.createElement("button", {
 		"aria-expanded": _e,
 		"aria-label": _.triggerButton,
-		className: `${W}__trigger`,
+		className: `${G}__trigger`,
 		disabled: r,
 		onClick: Ee,
 		type: "button"
 	}, /* @__PURE__ */ e.createElement(Q, {
-		className: `${W}__trigger-icon`,
+		className: `${G}__trigger-icon`,
 		iconName: "angleDown",
 		size: "m"
 	}))), /* @__PURE__ */ e.createElement("div", {
 		ref: Se.setFloating,
-		className: `pds-dropdown__panel ${W}__dropdown`,
+		className: `pds-dropdown__panel ${G}__dropdown`,
 		style: Ce ? {
 			...xe,
 			...we,
 			zIndex: "var(--pds-z-index-dropdown)"
 		} : { display: "none" }
-	}, Ce && f && /* @__PURE__ */ e.createElement("div", { className: `${W}__loading` }, v), Ce && !f && fe.length === 0 && /* @__PURE__ */ e.createElement("div", { className: "pds-dropdown__no-results" }, b), /* @__PURE__ */ e.createElement("ul", {
-		className: `${W}__options`,
+	}, Ce && f && /* @__PURE__ */ e.createElement("div", { className: `${G}__loading` }, v), Ce && !f && fe.length === 0 && /* @__PURE__ */ e.createElement("div", { className: "pds-dropdown__no-results" }, b), /* @__PURE__ */ e.createElement("ul", {
+		className: `${G}__options`,
 		...he(),
 		style: Ce && !f && fe.length > 0 ? void 0 : { display: "none" }
-	}, Ce && !f && Ae())), re && /* @__PURE__ */ e.createElement(jt, {
+	}, Ce && !f && Ae())), ie && /* @__PURE__ */ e.createElement(jt, {
 		hasValidationMessage: !!z,
 		id: u,
-		message: re,
+		message: ie,
 		validationMessageHasDecorators: !1,
 		validationStatus: B
 	}));
@@ -7160,16 +7160,16 @@ var fr = {
 	inputInstructions: "Type to search options",
 	triggerButton: "Toggle dropdown menu"
 }, loadingText: u = "Loading results...", noResultsText: d = "No results found", onChange: f, options: g, placeholder: _ = "Filter", required: v = !1, showAllTags: y = !1, showLabel: b = !0, size: x = "s", ...S }) => {
-	let E = Dt(o), D = "pds-combobox-multi", k = x === "s" ? null : `${D}--${x}`, M = r ? $.disabled : null, N = v && !r ? $.required : null, P = y ? `${D}--show-all-tags` : null, [I, L] = h(""), [R, z] = h(a), [B, V] = h(null), [H, U] = h(!1), ee = p(() => Dr(g, R, I), [
+	let E = Dt(o), D = "pds-combobox-multi", k = x === "s" ? null : `${D}--${x}`, M = r ? $.disabled : null, N = v && !r ? $.required : null, P = y ? `${D}--show-all-tags` : null, [I, L] = h(""), [R, z] = h(a), [B, V] = h(null), [H, U] = h(!1), W = p(() => Dr(g, R, I), [
 		g,
 		R,
 		I
-	]), W = p(() => t?.items?.map((e) => ({
+	]), G = p(() => t?.items?.map((e) => ({
 		...e,
 		isAlreadySelected: R.some((t) => t.id === e.id)
-	})) || [], [t?.items, R]), G = (e) => {
+	})) || [], [t?.items, R]), K = (e) => {
 		z(e), f?.(e);
-	}, { getDropdownProps: K, getSelectedItemProps: q, removeSelectedItem: te } = X({
+	}, { getDropdownProps: ee, getSelectedItemProps: q, removeSelectedItem: te } = X({
 		selectedItems: R,
 		onStateChange: ({ selectedItems: e, type: t }) => {
 			if (!r) switch (t) {
@@ -7177,13 +7177,13 @@ var fr = {
 				case X.stateChangeTypes.SelectedItemKeyDownDelete:
 				case X.stateChangeTypes.DropdownKeyDownBackspace:
 				case X.stateChangeTypes.FunctionRemoveSelectedItem:
-					G(e || []);
+					K(e || []);
 					break;
 				default: break;
 			}
 		}
-	}), { closeMenu: ne, getInputProps: J, getItemProps: re, getMenuProps: ie, getToggleButtonProps: ae, highlightedIndex: oe, isOpen: se, openMenu: ce, selectedItem: le } = Y({
-		items: ee,
+	}), { closeMenu: ne, getInputProps: re, getItemProps: ie, getMenuProps: J, getToggleButtonProps: ae, highlightedIndex: oe, isOpen: se, openMenu: ce, selectedItem: le } = Y({
+		items: W,
 		itemToString: (e) => e ? e.label : "",
 		selectedItem: null,
 		inputValue: I,
@@ -7205,7 +7205,7 @@ var fr = {
 				case Y.stateChangeTypes.InputKeyDownEnter:
 				case Y.stateChangeTypes.ItemClick:
 				case Y.stateChangeTypes.InputBlur:
-					n && (n.isAlreadySelected ? G(R.filter((e) => e.id !== n.id)) : G([...R, n]), L(""), V(null));
+					n && (n.isAlreadySelected ? K(R.filter((e) => e.id !== n.id)) : K([...R, n]), L(""), V(null));
 					break;
 				case Y.stateChangeTypes.InputChange:
 					L(e || ""), V(null);
@@ -7255,7 +7255,7 @@ var fr = {
 		let t = !H;
 		U(t), t && se && ne();
 	}, _e = (e) => {
-		r || (e.isAlreadySelected ? G(R.filter((t) => t.id !== e.id)) : G([...R, e]));
+		r || (e.isAlreadySelected ? K(R.filter((t) => t.id !== e.id)) : K([...R, e]));
 	}, ve = () => {
 		U(!1), t?.onClose?.();
 	}, ye = () => {
@@ -7264,7 +7264,7 @@ var fr = {
 		if (B === null) V(R.length - 1);
 		else {
 			let e = [...R];
-			e.splice(B, 1), G(e), V(null);
+			e.splice(B, 1), K(e), V(null);
 		}
 	}, xe = m(!1), Se = () => {
 		r || (xe.current ? ne() : ce());
@@ -7272,8 +7272,8 @@ var fr = {
 		xe.current = se, !r && e.currentTarget.setAttribute("data-focus-method", "mouse");
 	}, we = (e) => {
 		e.currentTarget.setAttribute("data-focus-method", "keyboard"), !r && ((e.key === "Backspace" || e.key === "Delete") && !I && R.length > 0 && (e.preventDefault(), be()), e.key === "Enter" && B !== null && (e.preventDefault(), be()), !se && (e.key === "Enter" || e.key === "ArrowDown") && (e.preventDefault(), ce()));
-	}, Te = J({
-		...K({ preventKeyAction: se }),
+	}, Te = re({
+		...ee({ preventKeyAction: se }),
 		disabled: r,
 		onKeyDown: we
 	}), Ee = R.length === 2 ? /* @__PURE__ */ e.createElement("span", { className: `${D}__counter-item` }, R.length - 1) : R.length === 3 ? /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("span", { className: `${D}__counter-layer` }), /* @__PURE__ */ e.createElement("span", { className: `${D}__counter-item` }, R.length - 1)) : R.length > 3 ? /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("span", { className: `${D}__counter-layer` }), /* @__PURE__ */ e.createElement("span", { className: `${D}__counter-layer` }), /* @__PURE__ */ e.createElement("span", { className: `${D}__counter-item` }, R.length - 1)) : "";
@@ -7351,7 +7351,7 @@ var fr = {
 		iconName: "angleDown",
 		size: "m"
 	})))), /* @__PURE__ */ e.createElement("div", {
-		...K(),
+		...ee(),
 		ref: de.setFloating,
 		className: `pds-dropdown__panel ${D}__dropdown`,
 		style: se ? {
@@ -7366,17 +7366,17 @@ var fr = {
 		onClick: (e) => {
 			e.stopPropagation();
 		}
-	})), se && s && /* @__PURE__ */ e.createElement("div", { className: `${D}__loading` }, u), se && !s && ee.length === 0 && /* @__PURE__ */ e.createElement("div", { className: "pds-dropdown__no-results" }, d), /* @__PURE__ */ e.createElement("ul", {
+	})), se && s && /* @__PURE__ */ e.createElement("div", { className: `${D}__loading` }, u), se && !s && W.length === 0 && /* @__PURE__ */ e.createElement("div", { className: "pds-dropdown__no-results" }, d), /* @__PURE__ */ e.createElement("ul", {
 		className: `${D}__dropdown-list`,
-		...ie(),
-		style: se && !s && ee.length > 0 ? void 0 : { display: "none" }
-	}, se && !s && ee.map((t, n) => /* @__PURE__ */ e.createElement(zt, {
+		...J(),
+		style: se && !s && W.length > 0 ? void 0 : { display: "none" }
+	}, se && !s && W.map((t, n) => /* @__PURE__ */ e.createElement(zt, {
 		key: `${t.id}-${n}`,
 		className: `${D}__dropdown-item
                   ${oe === n ? "pds-dropdown__item--focused" : ""}
                   ${le === t ? `${D}__dropdown-item--selected` : ""}
                   ${t.isAlreadySelected ? "pds-dropdown__item--active" : ""}`,
-		...re({
+		...ie({
 			item: t,
 			index: n
 		})
@@ -7395,7 +7395,7 @@ var fr = {
 		className: `${D}__aux-panel-icon`,
 		iconName: "sparkles",
 		size: "m"
-	}), /* @__PURE__ */ e.createElement("div", { className: `${D}__aux-panel-items` }, W.map((t) => /* @__PURE__ */ e.createElement("button", {
+	}), /* @__PURE__ */ e.createElement("div", { className: `${D}__aux-panel-items` }, G.map((t) => /* @__PURE__ */ e.createElement("button", {
 		key: t.id,
 		className: Z([`${D}__aux-panel-item`, t.isAlreadySelected ? `${D}__aux-panel-item--selected` : ""]),
 		onClick: () => _e(t),
@@ -7487,7 +7487,7 @@ var fr = {
 	let E = {
 		...jr,
 		...v
-	}, [O, k] = h(x), [A, M] = h(!1), [N, P] = h(null), [F, I] = h(r ? x?.from : x), L = Dt(a), R = "pds-datepicker", z = n ? $.disabled : null, B = m && !n ? $.required : null, V = b === "error" ? $.error : null, H = b === "success" ? $.success : null, U = y || u, { floatingStyles: ee, refs: W } = j({
+	}, [O, k] = h(x), [A, M] = h(!1), [N, P] = h(null), [F, I] = h(r ? x?.from : x), L = Dt(a), R = "pds-datepicker", z = n ? $.disabled : null, B = m && !n ? $.required : null, V = b === "error" ? $.error : null, H = b === "success" ? $.success : null, U = y || u, { floatingStyles: W, refs: G } = j({
 		open: A,
 		onOpenChange: M,
 		placement: "bottom-start",
@@ -7497,22 +7497,22 @@ var fr = {
 			D({ padding: 8 })
 		],
 		whileElementsMounted: C
-	}), G = (e) => {
+	}), K = (e) => {
 		k(e), f?.(e), r || setTimeout(() => {
 			M(!1);
 		}, 300);
-	}, K = (e) => {
-		G(e);
+	}, ee = (e) => {
+		K(e);
 	}, q = (e) => {
-		G(e);
+		K(e);
 	}, te = () => {
 		k(void 0), f?.(void 0);
 	}, ne = () => {
 		M(!1);
-	}, J = () => {
+	}, re = () => {
 		let e = /* @__PURE__ */ new Date();
 		I(e), r ? (k(void 0), f?.(void 0)) : (k(e), f?.(e));
-	}, re = () => r ? O?.from : O, ie = ({ className: t, orientation: n }) => n === "left" ? /* @__PURE__ */ e.createElement(Q, {
+	}, ie = () => r ? O?.from : O, J = ({ className: t, orientation: n }) => n === "left" ? /* @__PURE__ */ e.createElement(Q, {
 		className: t,
 		iconName: "angleLeft",
 		size: "m"
@@ -7540,7 +7540,7 @@ var fr = {
 			return e ? `${E.selectedDate}${kr(e, s)}` : E.noDateSelected || "";
 		}
 	}, ue = (e) => {
-		W.floating.current && !W.floating.current.contains(e.target) && N && !N.contains(e.target) && M(!1);
+		G.floating.current && !G.floating.current.contains(e.target) && N && !N.contains(e.target) && M(!1);
 	};
 	return l(() => {
 		k(x);
@@ -7567,7 +7567,7 @@ var fr = {
 		tooltipText: _
 	}), /* @__PURE__ */ e.createElement("div", { className: `${R}__input-wrapper` }, /* @__PURE__ */ e.createElement("button", {
 		ref: (e) => {
-			W.setReference(e), P(e);
+			G.setReference(e), P(e);
 		},
 		"aria-describedby": U ? `${i}__message` : null,
 		"aria-expanded": A,
@@ -7576,7 +7576,7 @@ var fr = {
 		className: Z([`${R}__trigger`, A ? `${R}__trigger--open` : null]),
 		disabled: n,
 		onClick: () => {
-			A || I(re() ?? /* @__PURE__ */ new Date()), M(!A);
+			A || I(ie() ?? /* @__PURE__ */ new Date()), M(!A);
 		},
 		type: "button"
 	}, /* @__PURE__ */ e.createElement(Q, {
@@ -7588,11 +7588,11 @@ var fr = {
 		message: U,
 		validationStatus: b
 	}), A && /* @__PURE__ */ e.createElement("div", {
-		ref: W.setFloating,
+		ref: G.setFloating,
 		className: `${R}__popover`,
-		style: ee
+		style: W
 	}, /* @__PURE__ */ e.createElement("div", { className: `${R}__calendar` }, r ? /* @__PURE__ */ e.createElement(oe, {
-		components: { Chevron: ie },
+		components: { Chevron: J },
 		disabled: X(),
 		footer: /* @__PURE__ */ e.createElement("div", { className: "visually-hidden" }, le()),
 		formatters: { formatWeekdayName: Y },
@@ -7602,10 +7602,10 @@ var fr = {
 		navLayout: "around",
 		numberOfMonths: 2,
 		onMonthChange: I,
-		onSelect: K,
+		onSelect: ee,
 		selected: O
 	}) : /* @__PURE__ */ e.createElement(oe, {
-		components: { Chevron: ie },
+		components: { Chevron: J },
 		disabled: X(),
 		footer: /* @__PURE__ */ e.createElement("div", { className: "visually-hidden" }, le()),
 		formatters: { formatWeekdayName: Y },
@@ -7620,7 +7620,7 @@ var fr = {
 	})), /* @__PURE__ */ e.createElement("div", { className: `${R}__actions` }, /* @__PURE__ */ e.createElement(Xt, {
 		className: `${R}__action-button ${R}__action-button--today`,
 		label: E.todayButton,
-		onClick: J,
+		onClick: re,
 		size: "s",
 		type: "button",
 		variant: "secondary"
@@ -7658,13 +7658,13 @@ var fr = {
 		if (!e || !r) return;
 		let t = new DataTransfer();
 		t.items.add(H), e.files = t.files, E(!0);
-	}, ee = (e) => {
+	}, W = (e) => {
 		if (e.target.files.length === 0) {
 			r ? U() : E(!1);
 			return;
 		}
 		se && r && (r === e.target.value ? O(!0) : O(!1)), m && m(e.target.files), E(!0);
-	}, W = () => {
+	}, G = () => {
 		let e = document.getElementById(`${o}--input`);
 		e.value = "", se && O(!1), p && p(), E(!1), e.focus();
 	};
@@ -7708,13 +7708,13 @@ var fr = {
 		disabled: i,
 		id: `${o}--input`,
 		multiple: f,
-		onChange: ee,
+		onChange: W,
 		required: g,
 		type: "file",
 		...s
 	}), T && /* @__PURE__ */ e.createElement(Ft, {
 		clearLabel: u.clearButton,
-		handleClearInput: W,
+		handleClearInput: G,
 		id: o
 	})), R && /* @__PURE__ */ e.createElement(jt, {
 		hasValidationMessage: !!x,
@@ -7917,9 +7917,9 @@ var fr = {
 	tagRemove: "Remove {value}",
 	tagsListLabel: "Current tags"
 }, validationMessage: b, validationStatus: x, ...S }, C) => {
-	let w = Dt(o), T = "pds-tags-input", E = g === "s" ? null : `${T}--${g}`, D = r ? $.disabled : null, O = f && !r ? $.required : null, k = x === "error" ? $.error : null, A = x === "success" ? $.success : null, j = b || l, [M, N] = h(""), [P, F] = h(null), [I, L] = h(null), [R, z] = h(null), [B, V] = h(null), [H, U] = h(""), ee = m(null), W = _.length > 0 ? t : d, G = (e) => {
+	let w = Dt(o), T = "pds-tags-input", E = g === "s" ? null : `${T}--${g}`, D = r ? $.disabled : null, O = f && !r ? $.required : null, k = x === "error" ? $.error : null, A = x === "success" ? $.success : null, j = b || l, [M, N] = h(""), [P, F] = h(null), [I, L] = h(null), [R, z] = h(null), [B, V] = h(null), [H, U] = h(""), W = m(null), G = _.length > 0 ? t : d, K = (e) => {
 		U(e), setTimeout(() => U(""), 1e3);
-	}, K = (e) => {
+	}, ee = (e) => {
 		u(e);
 	}, q = (e) => {
 		F(e);
@@ -7927,21 +7927,21 @@ var fr = {
 		F(null), L(null), z(null);
 	}, ne = (e, t) => {
 		P === null || P === e || (L(e), z(t));
-	}, J = (e) => {
+	}, re = (e) => {
 		if (e.preventDefault(), P === null || I === null || R === null) return;
 		let t = _.findIndex((e) => e.id === P), n = _.findIndex((e) => e.id === I);
 		if (t === -1 || n === -1) return;
 		let r = [..._], [i] = r.splice(t, 1), a = n;
-		a = R === "after" ? t < n ? n : n + 1 : n, r.splice(a, 0, i), K(r), G("Tag reordered"), F(null), L(null), z(null);
-	}, re = (e, t) => {
+		a = R === "after" ? t < n ? n : n + 1 : n, r.splice(a, 0, i), ee(r), K("Tag reordered"), F(null), L(null), z(null);
+	}, ie = (e, t) => {
 		let n = [..._], [r] = n.splice(e, 1);
-		n.splice(t, 0, r), G(`${r.value} moved to position ${t + 1} of ${_.length}`), K(n);
-	}, ie = (e) => {
+		n.splice(t, 0, r), K(`${r.value} moved to position ${t + 1} of ${_.length}`), ee(n);
+	}, J = (e) => {
 		let t = _.find((t) => t.id === e);
-		K(_.filter((t) => t.id !== e)), t && G(`${t.value} removed`);
+		ee(_.filter((t) => t.id !== e)), t && K(`${t.value} removed`);
 	}, Y = () => {
 		V(null), setTimeout(() => {
-			ee.current?.focus();
+			W.current?.focus();
 		}, 0);
 	}, X = (e) => {
 		if (!r) if (e.key === "Enter" && M.trim()) {
@@ -7950,10 +7950,10 @@ var fr = {
 				id: Date.now().toString(),
 				value: M.trim()
 			};
-			K([..._, t]), G(`${M.trim()} added`), N("");
+			ee([..._, t]), K(`${M.trim()} added`), N("");
 		} else if (e.key === "Backspace" && !M && _.length > 0) {
 			let e = _[_.length - 1];
-			K(_.slice(0, -1)), G(`${e.value} removed`);
+			ee(_.slice(0, -1)), K(`${e.value} removed`);
 		} else e.key === "ArrowLeft" && !M && _.length > 0 && (e.preventDefault(), V(_.length - 1));
 	};
 	return /* @__PURE__ */ e.createElement("div", {
@@ -7989,7 +7989,7 @@ var fr = {
 		"aria-label": y.tagsListLabel,
 		className: `${T}__tags`,
 		onDragOver: s ? (e) => e.preventDefault() : void 0,
-		onDrop: s ? J : void 0,
+		onDrop: s ? re : void 0,
 		role: "list"
 	}, _.map((t, n) => {
 		let i = null;
@@ -8007,8 +8007,8 @@ var fr = {
 			onDragOver: ne,
 			onDragStart: q,
 			onFocusInput: Y,
-			onKeyboardMove: re,
-			onRemove: ie,
+			onKeyboardMove: ie,
+			onRemove: J,
 			setFocusedIndex: V,
 			tag: t,
 			totalTags: _.length,
@@ -8016,7 +8016,7 @@ var fr = {
 		}));
 	})), /* @__PURE__ */ e.createElement("input", {
 		ref: (e) => {
-			ee.current = e, typeof C == "function" ? C(e) : C && (C.current = e);
+			W.current = e, typeof C == "function" ? C(e) : C && (C.current = e);
 		},
 		"aria-describedby": `${i}__instructions`,
 		"aria-invalid": x === "error" ? !0 : null,
@@ -8026,7 +8026,7 @@ var fr = {
 		name: i,
 		onChange: (e) => N(e.target.value),
 		onKeyDown: X,
-		placeholder: W,
+		placeholder: G,
 		required: f,
 		type: "text",
 		value: M
@@ -8114,8 +8114,8 @@ var fr = {
 }, type: O = "text", validationMessage: k, validationStatus: A, value: j, ...M }, N) => {
 	let P = Dt(d), F = "pds-text-input", I = a ? $.disabled : null, L = x && !a ? $.required : null, R = A === "error" ? $.error : null, z = A === "success" ? $.success : null, B = b ? $.readonly : null, V = T === "s" ? null : `${F}--${T}`, H = c && O === "url" ? `${F}--has-url-prefix` : null, U = null;
 	O === "search" && (U = "search"), O === "search" && S === "filter" && (U = "filter"), A === "error" && (U = "error"), A === "success" && (U = "success");
-	let ee = k || p, W = j !== void 0, [G, K] = h(i === void 0 ? "" : i), q = j || G, te = (e) => {
-		if (w && re && ie(!1), c && O === "url") {
+	let W = k || p, G = j !== void 0, [K, ee] = h(i === void 0 ? "" : i), q = j || K, te = (e) => {
+		if (w && ie && J(!1), c && O === "url") {
 			let t = Ot(e.target.value), n = {
 				...e,
 				target: {
@@ -8134,18 +8134,18 @@ var fr = {
 					value: t
 				}
 			};
-			W || K(t), g && g(n);
-		} else W || K(e.target.value), g && g(e);
-	}, J = () => {
-		W || K(""), _ && _();
+			G || ee(t), g && g(n);
+		} else G || ee(e.target.value), g && g(e);
+	}, re = () => {
+		G || ee(""), _ && _();
 		let e = document.getElementById(l);
 		e && e.focus();
-	}, [re, ie] = h(!1), Y = () => {
-		ie((e) => !e);
+	}, [ie, J] = h(!1), Y = () => {
+		J((e) => !e);
 		let e = document.getElementById(l);
 		e && e.focus();
 	}, X = O;
-	return w && O === "password" && (X = re ? "text" : "password"), /* @__PURE__ */ e.createElement("div", {
+	return w && O === "password" && (X = ie ? "text" : "password"), /* @__PURE__ */ e.createElement("div", {
 		className: Z([
 			$.base,
 			F,
@@ -8170,9 +8170,9 @@ var fr = {
 	}), w && O === "password" && /* @__PURE__ */ e.createElement("div", {
 		"aria-live": "polite",
 		className: "visually-hidden"
-	}, `${D.visibilityStatus} ${re ? "visible" : "hidden"}.`), /* @__PURE__ */ e.createElement("div", { className: `${F}__input-wrapper ${c && O === "url" ? `${F}__input-wrapper--has-prefix` : ""}` }, U && /* @__PURE__ */ e.createElement(Nt, { variant: U }), c && O === "url" && /* @__PURE__ */ e.createElement(Br, null), /* @__PURE__ */ e.createElement("input", {
+	}, `${D.visibilityStatus} ${ie ? "visible" : "hidden"}.`), /* @__PURE__ */ e.createElement("div", { className: `${F}__input-wrapper ${c && O === "url" ? `${F}__input-wrapper--has-prefix` : ""}` }, U && /* @__PURE__ */ e.createElement(Nt, { variant: U }), c && O === "url" && /* @__PURE__ */ e.createElement(Br, null), /* @__PURE__ */ e.createElement("input", {
 		ref: N,
-		"aria-describedby": ee ? `${l}__message` : null,
+		"aria-describedby": W ? `${l}__message` : null,
 		"aria-invalid": A === "error" ? !0 : null,
 		autoComplete: O === "password" ? "off" : t,
 		className: `${F}__input ${c && O === "url" ? `${F}__input--has-prefix` : ""}`,
@@ -8186,21 +8186,21 @@ var fr = {
 		readOnly: b,
 		required: x,
 		type: X,
-		value: W ? j : G,
+		value: G ? j : K,
 		...u
 	}), o && q && /* @__PURE__ */ e.createElement(Ft, {
 		clearLabel: D.clearButton,
-		handleClearInput: J,
+		handleClearInput: re,
 		id: l
 	}), w && O === "password" && /* @__PURE__ */ e.createElement("button", {
 		"aria-controls": l,
 		className: `${F}__visibility-toggle`,
 		onClick: Y,
 		onMouseDown: (e) => e.preventDefault(),
-		title: re ? D.visibilityToggleHide : D.visibilityToggleShow,
+		title: ie ? D.visibilityToggleHide : D.visibilityToggleShow,
 		type: "button"
 	}, /* @__PURE__ */ e.createElement(Q, {
-		iconName: re ? "eyeSlash" : "eye",
+		iconName: ie ? "eyeSlash" : "eye",
 		size: "m"
 	})), s && O === "search" && !q && /* @__PURE__ */ e.createElement(Pt, {
 		inputId: l,
@@ -8210,10 +8210,10 @@ var fr = {
 		id: l,
 		maxLength: r,
 		overLimitMessage: D.counterOverLimit
-	})), ee && /* @__PURE__ */ e.createElement(jt, {
+	})), W && /* @__PURE__ */ e.createElement(jt, {
 		hasValidationMessage: !!k,
 		id: l,
-		message: ee,
+		message: W,
 		validationMessageHasDecorators: !1,
 		validationStatus: A
 	}));
@@ -9274,7 +9274,7 @@ var fr = {
 			D()
 		],
 		whileElementsMounted: C
-	}), z = k(M, { event: "mousedown" }), B = A(M), V = L(M, { role: "menu" }), H = m([]), { getFloatingProps: U, getItemProps: ee, getReferenceProps: W } = F([
+	}), z = k(M, { event: "mousedown" }), B = A(M), V = L(M, { role: "menu" }), H = m([]), { getFloatingProps: U, getItemProps: W, getReferenceProps: G } = F([
 		B,
 		V,
 		z,
@@ -9287,7 +9287,7 @@ var fr = {
 			focusItemOnOpen: !1,
 			focusItemOnHover: !0
 		})
-	]), { isMounted: G, styles: K } = R(M, {
+	]), { isMounted: K, styles: ee } = R(M, {
 		duration: {
 			open: 300,
 			close: 150
@@ -9319,13 +9319,13 @@ var fr = {
 		let n = e.id ? e.id : `${S}-item-${t}`;
 		y.current.push(n), b.current.push(e);
 	});
-	let J = (e) => {
+	let re = (e) => {
 		let t = y.current.indexOf(e), n = b.current[t];
 		n.linkContent && !n.disabled && (H.current[t].querySelector("a").click(), v(!1)), n.callback && !n.disabled && (n.callback(), v(!1));
-	}, re = (e) => {
-		e.preventDefault(), e.key === "Enter" && J(e.currentTarget.id);
 	}, ie = (e) => {
-		J(e.currentTarget.id);
+		e.preventDefault(), e.key === "Enter" && re(e.currentTarget.id);
+	}, J = (e) => {
+		re(e.currentTarget.id);
 	}, Y = r.map((t, n) => {
 		let r = y.current[n], i = `${E}__item`, a = t.disabled ? `${i}--disabled` : null;
 		return /* @__PURE__ */ e.createElement("li", {
@@ -9335,10 +9335,10 @@ var fr = {
 			},
 			className: Z([i, a]),
 			id: r,
-			onKeyDown: re,
+			onKeyDown: ie,
 			role: "menuitem",
 			tabIndex: p === n ? 0 : -1,
-			...ee({ onClick: (e) => ie(e) })
+			...W({ onClick: (e) => J(e) })
 		}, t.linkContent ? t.linkContent : t.label, t.iconName && /* @__PURE__ */ e.createElement(Q, {
 			className: `${E}__icon`,
 			iconName: t.iconName,
@@ -9371,8 +9371,8 @@ var fr = {
 		"aria-label": t,
 		className: `${E}__trigger`,
 		type: "button",
-		...W()
-	}, q), G && /* @__PURE__ */ e.createElement(x, null, /* @__PURE__ */ e.createElement("div", {
+		...G()
+	}, q), K && /* @__PURE__ */ e.createElement(x, null, /* @__PURE__ */ e.createElement("div", {
 		ref: P.setFloating,
 		className: `${E}__dropdown`,
 		style: {
@@ -9380,7 +9380,7 @@ var fr = {
 			zIndex: "var(--pds-z-index-dropdown)"
 		},
 		...U()
-	}, /* @__PURE__ */ e.createElement("div", { style: { ...K } }, /* @__PURE__ */ e.createElement("ul", {
+	}, /* @__PURE__ */ e.createElement("div", { style: { ...ee } }, /* @__PURE__ */ e.createElement("ul", {
 		className: O,
 		role: "menu"
 	}, te, /* @__PURE__ */ e.createElement("li", { role: "separator" }), ne, Y)))));
@@ -10420,7 +10420,7 @@ var fr = {
 	}, [d]), l(() => {
 		f(O);
 	}, [O]);
-	let N = typeof a, P = "pds-popover", I = Z([`${P}__trigger-custom`, N === "string" ? `${P}__trigger-text` : ""]), z = a ? s : 0, B = m(null), { context: V, floatingStyles: H, middlewareData: U, refs: ee } = j({
+	let N = typeof a, P = "pds-popover", I = Z([`${P}__trigger-custom`, N === "string" ? `${P}__trigger-text` : ""]), z = a ? s : 0, B = m(null), { context: V, floatingStyles: H, middlewareData: U, refs: W } = j({
 		placement: u,
 		open: O,
 		onOpenChange(e) {
@@ -10433,44 +10433,44 @@ var fr = {
 			S({ element: B })
 		],
 		whileElementsMounted: C
-	}), W = () => {
+	}), G = () => {
 		M(!1), c && c();
-	}, { getFloatingProps: G, getReferenceProps: K } = F([
+	}, { getFloatingProps: K, getReferenceProps: ee } = F([
 		k(V),
 		A(V),
 		L(V)
-	]), q = U.arrow?.x ?? 0, te = U.arrow?.y ?? 0, ne = q + ea / 2, J = te + $i, { isMounted: re } = R(V, {
+	]), q = U.arrow?.x ?? 0, te = U.arrow?.y ?? 0, ne = q + ea / 2, re = te + $i, { isMounted: ie } = R(V, {
 		initial: { transform: "scale(0)" },
 		common: ({ side: e }) => ({ transformOrigin: {
 			top: `${ne}px calc(100% + ${$i}px)`,
 			bottom: `${ne}px -8px`,
-			left: `calc(100% + ${$i}px) ${J}px`,
-			right: `-8px ${J}px`
+			left: `calc(100% + ${$i}px) ${re}px`,
+			right: `-8px ${re}px`
 		}[e] })
 	});
 	return /* @__PURE__ */ e.createElement("div", {
 		className: Z([P, t]),
 		...E
 	}, /* @__PURE__ */ e.createElement("span", {
-		ref: ee.setReference,
+		ref: W.setReference,
 		className: `${P}__trigger`,
 		role: "button",
 		tabIndex: 0,
-		...K(),
+		...ee(),
 		...E
 	}, a ? /* @__PURE__ */ e.createElement("span", { className: I }, a) : /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("span", { className: "visually-hidden" }, g), /* @__PURE__ */ e.createElement(Q, {
 		className: `${P}__icon`,
 		iconName: _,
 		size: b
-	}))), re && /* @__PURE__ */ e.createElement(x, null, /* @__PURE__ */ e.createElement(y, {
+	}))), ie && /* @__PURE__ */ e.createElement(x, null, /* @__PURE__ */ e.createElement(y, {
 		context: V,
 		initialFocus: -1,
 		modal: o
 	}, /* @__PURE__ */ e.createElement("div", {
-		ref: ee.setFloating,
+		ref: W.setFloating,
 		className: Z([`${P}__container`, n]),
 		style: H,
-		...G()
+		...K()
 	}, /* @__PURE__ */ e.createElement(v, {
 		ref: B,
 		className: `${P}__arrow`,
@@ -10483,7 +10483,7 @@ var fr = {
 		width: ea
 	}), /* @__PURE__ */ e.createElement("div", { className: `${P}__container-inner` }, p && /* @__PURE__ */ e.createElement("div", { className: `${P}__title` }, p), i && /* @__PURE__ */ e.createElement("div", { className: `${P}__content` }, i), o && /* @__PURE__ */ e.createElement("div", { className: `${P}__close-wrapper` }, /* @__PURE__ */ e.createElement(tn, {
 		ariaLabel: r,
-		onClick: W,
+		onClick: G,
 		size: "s"
 	})))))));
 }, na = {
@@ -10794,7 +10794,7 @@ function _a(e) {
 //#endregion
 //#region src/components/SortableList/SortableList.tsx
 var va = 24, ya = { droppable: { strategy: ve.Always } }, ba = a(function({ children: n, className: r, columns: i, defaultItems: a, getItemLabel: c = (e) => String(e.id), isDragEnabled: l, isItemLocked: u = () => !1, isNestingLocked: f = () => !1, items: g, maxDepth: _ = 0, onReorder: v, renderRow: y, reorderMode: b = "always", screenReaderInstructions: x, ...S }, C) {
-	let w = "pds-sortable-list", [T, E] = h(null), D = m(null), [O, k] = h(!1), A = m(!1), [j, M] = h(null), N = m(0), P = m(0), F = m("pointer"), I = m(0), L = m(null), [R, z] = h(0), B = m(0), [V, H] = h(0), U = m(0), ee = s((e, t) => {
+	let w = "pds-sortable-list", [T, E] = h(null), D = m(null), [O, k] = h(!1), A = m(!1), [j, M] = h(null), N = m(0), P = m(0), F = m("pointer"), I = m(0), L = m(null), [R, z] = h(0), B = m(0), [V, H] = h(0), U = m(0), W = s((e, t) => {
 		if (_ > 0 && (e.key === "ArrowLeft" || e.key === "ArrowRight")) {
 			e.preventDefault();
 			let n = e.key === "ArrowRight" ? 1 : -1, r = B.current, i = Math.max(-_, Math.min(_, r + n)), a = i - r;
@@ -10804,14 +10804,14 @@ var va = 24, ya = { droppable: { strategy: ve.Always } }, ba = a(function({ chil
 			};
 		}
 		return we(e, t);
-	}, [_]), W = b === "always" || b === "toggle" && (l ?? !1), { currentItems: G, expandItem: K, flatNodes: q, handleReorder: te, resetToSnapshot: ne, sortableIds: J, toggleExpand: re } = ha({
+	}, [_]), G = b === "always" || b === "toggle" && (l ?? !1), { currentItems: K, expandItem: ee, flatNodes: q, handleReorder: te, resetToSnapshot: ne, sortableIds: re, toggleExpand: ie } = ha({
 		defaultItems: a,
-		isDragEnabled: W,
+		isDragEnabled: G,
 		items: g,
 		onReorder: v
 	});
 	d(C, () => ({ resetToSnapshot: ne }), [ne]);
-	let ie = Se(xe(ye, { activationConstraint: { distance: 5 } }), xe(_e, { coordinateGetter: ee })), Y = W ? `${w}--reorder-active` : null, X = p(() => new Set(q.filter((e) => u(e.data)).map((e) => e.id)), [q, u]), ae = p(() => new Set(q.filter((e) => f(e.data)).map((e) => e.id)), [q, f]), oe = s((e) => {
+	let J = Se(xe(ye, { activationConstraint: { distance: 5 } }), xe(_e, { coordinateGetter: W })), Y = G ? `${w}--reorder-active` : null, X = p(() => new Set(q.filter((e) => u(e.data)).map((e) => e.id)), [q, u]), ae = p(() => new Set(q.filter((e) => f(e.data)).map((e) => e.id)), [q, f]), oe = s((e) => {
 		if (_ === 0 || ae.has(String(e))) return !1;
 		let t = q.find((t) => t.id === e);
 		return !t || t.depth >= _ ? !1 : t.hasChildren ? !t.isExpanded : !0;
@@ -10831,7 +10831,7 @@ var va = 24, ya = { droppable: { strategy: ve.Always } }, ba = a(function({ chil
 		oe,
 		X,
 		j
-	]).size > 0, le = p(() => T ? q.find((e) => e.id === T) ?? null : null, [T, q]), ue = p(() => T ? fa(G, String(T)) ?? null : null, [T, G]), de = p(() => {
+	]).size > 0, le = p(() => T ? q.find((e) => e.id === T) ?? null : null, [T, q]), ue = p(() => T ? fa(K, String(T)) ?? null : null, [T, K]), de = p(() => {
 		let e = le?.depth ?? 0;
 		return !T || !j || O || _ === 0 ? e : pa(q, String(T), String(j), V * va, va, _);
 	}, [
@@ -10855,8 +10855,8 @@ var va = 24, ya = { droppable: { strategy: ve.Always } }, ba = a(function({ chil
 		de
 	]), pe = s((e) => {
 		let { active: t } = e, n = F.current === "keyboard", r = q.find((e) => e.id === t.id);
-		E(t.id), D.current = t.id, k(n), A.current = n, I.current = r?.depth ?? 0, M(null), N.current = 0, P.current = 0, U.current = 0, H(0), B.current = 0, z(0), r?.hasChildren && r?.isExpanded && (re(String(t.id)), L.current = String(t.id));
-	}, [q, re]), me = s((e) => {
+		E(t.id), D.current = t.id, k(n), A.current = n, I.current = r?.depth ?? 0, M(null), N.current = 0, P.current = 0, U.current = 0, H(0), B.current = 0, z(0), r?.hasChildren && r?.isExpanded && (ie(String(t.id)), L.current = String(t.id));
+	}, [q, ie]), me = s((e) => {
 		let t = be(e);
 		if (!t.length || !D.current || X.size === 0) return t;
 		let n = q.findIndex((e) => e.id === D.current);
@@ -10895,7 +10895,7 @@ var va = 24, ya = { droppable: { strategy: ve.Always } }, ba = a(function({ chil
 		(n > r || n < r && t < r * va - va * .4) && (U.current = n, H(n));
 	}, [_]), De = s((e) => {
 		let { active: t, over: n } = e, r = A.current, i = B.current, a = U.current;
-		E(null), D.current = null, k(!1), A.current = !1, M(null), U.current = 0, H(0), L.current && (K(L.current), L.current = null);
+		E(null), D.current = null, k(!1), A.current = !1, M(null), U.current = 0, H(0), L.current && (ee(L.current), L.current = null);
 		let o = q.findIndex((e) => e.id === t.id), s = r ? i * va : a * va, c = !n || t.id === n.id, l = n?.id ?? null;
 		if (r && i > 0 && c && o > 0 && (l = q[o - 1].id), !l || t.id === l) {
 			if (o === -1) return;
@@ -10913,7 +10913,7 @@ var va = 24, ya = { droppable: { strategy: ve.Always } }, ba = a(function({ chil
 			r.splice(o, 0, c);
 			let l = q.filter((e) => e.id !== t.id).map((e) => e.id), u = r.filter((e) => e.id !== t.id).map((e) => e.id);
 			if (l.some((e, t) => X.has(e) ? u.indexOf(e) !== t : !1)) return;
-			te(r), n > 0 && a && K(a);
+			te(r), n > 0 && a && ee(a);
 			return;
 		}
 		let u = q.findIndex((e) => e.id === l);
@@ -10937,9 +10937,9 @@ var va = 24, ya = { droppable: { strategy: ve.Always } }, ba = a(function({ chil
 		}, b = d[h], x = b && b.depth === g - 1 && v === String(l) || o < u ? h + 1 : h;
 		d.splice(x, 0, y, ...m);
 		let S = new Set([String(t.id), ...m.map((e) => e.id)]);
-		q.some((e, t) => !X.has(e.id) || S.has(e.id) || e.id === v ? !1 : d.findIndex((t) => t.id === e.id) !== t) || (te(d), g > 0 && v !== null && K(v));
+		q.some((e, t) => !X.has(e.id) || S.has(e.id) || e.id === v ? !1 : d.findIndex((t) => t.id === e.id) !== t) || (te(d), g > 0 && v !== null && ee(v));
 	}, [
-		K,
+		ee,
 		q,
 		te,
 		oe,
@@ -10947,31 +10947,31 @@ var va = 24, ya = { droppable: { strategy: ve.Always } }, ba = a(function({ chil
 		_,
 		ae
 	]), Oe = s(() => {
-		E(null), D.current = null, k(!1), A.current = !1, M(null), P.current = 0, U.current = 0, H(0), B.current = 0, z(0), L.current && (K(L.current), L.current = null);
-	}, [K]), ke = p(() => ({
+		E(null), D.current = null, k(!1), A.current = !1, M(null), P.current = 0, U.current = 0, H(0), B.current = 0, z(0), L.current && (ee(L.current), L.current = null);
+	}, [ee]), ke = p(() => ({
 		onDragStart({ active: e }) {
-			let t = q.find((t) => t.id === e.id), n = fa(G, String(e.id));
+			let t = q.find((t) => t.id === e.id), n = fa(K, String(e.id));
 			return `Picked up ${n ? c(n) : String(e.id)}. Current position: ${t ? q.indexOf(t) + 1 : "?"} of ${q.length} at depth ${t?.depth ?? 0}.`;
 		},
 		onDragOver({ active: e, over: t }) {
 			if (!t) return;
 			let n = q.findIndex((e) => e.id === t.id);
 			if (n === -1) return;
-			let r = fa(G, String(e.id)), i = r ? c(r) : String(e.id), a = pa(q, String(e.id), String(t.id), P.current, va, _);
+			let r = fa(K, String(e.id)), i = r ? c(r) : String(e.id), a = pa(q, String(e.id), String(t.id), P.current, va, _);
 			return `Moving ${i}. Target position: ${n + 1} of ${q.length} at depth ${a}.`;
 		},
 		onDragEnd({ active: e, over: t }) {
-			let n = fa(G, String(e.id)), r = n ? c(n) : String(e.id);
+			let n = fa(K, String(e.id)), r = n ? c(n) : String(e.id);
 			if (!t || e.id === t.id) return `${r} dropped. No change in position.`;
 			let i = q.findIndex((e) => e.id === t.id), a = pa(q, String(e.id), String(t.id), P.current, va, _);
 			return `${r} dropped at position ${i + 1} of ${q.length} at depth ${a}.`;
 		},
 		onDragCancel({ active: e }) {
-			let t = q.find((t) => t.id === e.id), n = fa(G, String(e.id));
+			let t = q.find((t) => t.id === e.id), n = fa(K, String(e.id));
 			return `Sorting cancelled. ${n ? c(n) : String(e.id)} returned to position ${t ? q.indexOf(t) + 1 : "?"} of ${q.length}.`;
 		}
 	}), [
-		G,
+		K,
 		q,
 		c,
 		_
@@ -10988,9 +10988,9 @@ var va = 24, ya = { droppable: { strategy: ve.Always } }, ba = a(function({ chil
 		onDragMove: Te,
 		onDragOver: ve,
 		onDragStart: pe,
-		sensors: ie
+		sensors: J
 	}, /* @__PURE__ */ e.createElement(Ce, {
-		items: J,
+		items: re,
 		strategy: se
 	}, /* @__PURE__ */ e.createElement("div", {
 		className: Z([
@@ -11014,18 +11014,18 @@ var va = 24, ya = { droppable: { strategy: ve.Always } }, ba = a(function({ chil
 			isDragging: t.id === T,
 			isExpanded: t.isExpanded,
 			isLocked: X.has(t.id),
-			toggleExpand: () => re(t.id)
+			toggleExpand: () => ie(t.id)
 		}, r = y(t.data, n), a = t.id === T, s = {
 			columns: i,
 			depth: t.depth,
 			hasChildren: t.hasChildren,
-			isDragActive: W,
+			isDragActive: G,
 			isDragging: a,
 			isDropTarget: t.id === j && oe(t.id),
 			isProjectedParent: t.id === fe && !ae.has(t.id),
 			isExpanded: t.isExpanded,
 			...X.has(t.id) ? { isLocked: !0 } : {},
-			onToggleExpand: () => re(t.id),
+			onToggleExpand: () => ie(t.id),
 			...a && !O && _ > 0 ? { projectedDepthDelta: de - t.depth } : {}
 		};
 		return o(r) ? e.cloneElement(r, {
@@ -11344,76 +11344,79 @@ var Sa = ({ children: t, className: n, columns: r, depth: i = 0, hasChildren: a
 		className: Z([a, t ?? ""]),
 		...i
 	}, /* @__PURE__ */ e.createElement("ol", { className: `${a}__steps` }, r && c));
-}, ka = ({ className: t, closeDetailPanelLabel: n = "Close detail panel", columns: r, currentPage: i, defaultSortKey: a, defaultSortOrder: o = "asc", detailPanelNav: s = !0, detailPanelTitle: c, detailPanelWidth: d, emptyState: f, emptyStateHeading: m = "No results found.", emptyStateMessage: g, footer: _, getPageSizeLabel: v = (e) => `Show ${e} rows per page`, getRowClassName: y, getRowId: b, getSelectRowLabel: x = (e, t) => `Select row ${t}`, getSortLabel: S = (e) => `Sort by ${e}`, inspectedRowId: C, isLoading: w = !1, itemsPerPage: T, loadingRowCount: E = 5, nextDetailPanelRowLabel: D = "Next row", onDetailPanelNext: O, onDetailPanelPrev: k, onPageChange: A, onPageSizeChange: j, onRowInspect: M, onRowSelectionChange: N, onSort: P, pageSizeOptions: F, panel: I, prevDetailPanelRowLabel: L = "Previous row", renderDetailPanel: R, renderDetailPanelFooter: z, rowData: B, selectAllLabel: V = "Select all rows", selectedRows: H, sortKey: U, sortOrder: ee, totalItemCount: W, ...G }) => {
-	let K = "pds-table", q = u(), te = u(), ne = P !== void 0, J = A !== void 0, re = j !== void 0, ie = J || T !== void 0 || F !== void 0, [Y, X] = h({
+}, ka = ({ className: t, closeDetailPanelLabel: n = "Close detail panel", columns: r, currentPage: i, defaultSortKey: a, defaultSortOrder: o = "asc", detailPanelNav: s = !0, detailPanelTitle: c, detailPanelWidth: d, emptyState: f, emptyStateHeading: m = "No results found.", emptyStateMessage: g, footer: _, getPageSizeLabel: v = (e) => `Show ${e} rows per page`, getRowClassName: y, getRowId: b, getRowSelectDisabledReason: x, getSelectRowLabel: S = (e, t) => `Select row ${t}`, getSortLabel: C = (e) => `Sort by ${e}`, inspectedRowId: w, isLoading: T = !1, isRowSelectable: E = () => !0, itemsPerPage: D, loadingRowCount: O = 5, nextDetailPanelRowLabel: k = "Next row", onDetailPanelNext: A, onDetailPanelPrev: j, onPageChange: M, onPageSizeChange: N, onRowInspect: P, onRowSelectionChange: F, onSort: I, pageSizeOptions: L, pageSizeSelectLabel: R = "Rows per page", paginationLabels: z, panel: B, prevDetailPanelRowLabel: V = "Previous row", renderDetailPanel: H, renderDetailPanelFooter: U, rowData: W, selectAllLabel: G = "Select all rows", selectedRows: K, sortKey: ee, sortOrder: q, totalItemCount: te, ...ne }) => {
+	let re = "pds-table", ie = u(), J = u(), Y = I !== void 0, X = M !== void 0, ae = N !== void 0, oe = X || D !== void 0 || L !== void 0, [se, ce] = h({
 		key: a ?? "",
 		order: a === void 0 ? "asc" : o
-	}), [ae, oe] = h(1), [se, ce] = h(T ?? F?.[0] ?? 10), [le, ue] = h(null), de = C ?? le, fe = !!de && !!R, pe = J ? T ?? 10 : se, me = (e) => {
-		re ? j(e) : ce(e), J || oe(1);
+	}), [le, ue] = h(1), [de, fe] = h(D ?? L?.[0] ?? 10), [pe, me] = h(null), he = w ?? pe, ge = !!he && !!H, _e = X ? D ?? 10 : de, ve = (e) => {
+		ae ? N(e) : fe(e), X || ue(1);
 	};
 	l(() => {
-		J || oe(1);
-	}, [B.length, J]), l(() => {
-		process.env.NODE_ENV !== "production" && i !== void 0 && !A && console.warn("[Table] `currentPage` was provided without `onPageChange`. Controlled pagination requires both props. The table is running in uncontrolled mode.");
+		X || ue(1);
+	}, [W.length, X]), l(() => {
+		process.env.NODE_ENV !== "production" && i !== void 0 && !M && console.warn("[Table] `currentPage` was provided without `onPageChange`. Controlled pagination requires both props. The table is running in uncontrolled mode.");
 	}, []);
-	let he = N !== void 0, ge = H !== void 0, [_e, ve] = h(/* @__PURE__ */ new Set()), ye = ge ? new Set(H) : _e, be = p(() => new Map(B.map((e, t) => [e, t])), [B]), xe = (e, t) => b ? b(e) : String(be.get(e) ?? t), Se = p(() => B.findIndex((e, t) => (b ? b(e) : String(be.get(e) ?? t)) === de), [
-		B,
-		de,
+	let ye = F !== void 0, be = K !== void 0, [xe, Se] = h(/* @__PURE__ */ new Set()), Ce = be ? new Set(K) : xe, we = p(() => new Map(W.map((e, t) => [e, t])), [W]), Te = (e, t) => b ? b(e) : String(we.get(e) ?? t), Ee = p(() => W.findIndex((e, t) => (b ? b(e) : String(we.get(e) ?? t)) === he), [
+		W,
+		he,
 		b,
-		be
-	]), Ce = Se >= 0 ? B[Se] : null, we = (e, t) => {
-		R && C === void 0 && ue(t), M?.(e, t);
-	}, Te = () => {
-		C === void 0 && ue(null);
-	}, Ee = () => {
-		if (Se <= 0) return;
-		let e = B[Se - 1], t = xe(e, Se - 1);
-		C === void 0 && ue(t), M?.(e, t), k?.(e, t);
-	}, De = () => {
-		if (Se >= B.length - 1) return;
-		let e = B[Se + 1], t = xe(e, Se + 1);
-		C === void 0 && ue(t), M?.(e, t), O?.(e, t);
-	}, Oe = ne ? U ?? "" : Y.key, ke = ne ? ee ?? "asc" : Y.order, Ae = p(() => {
-		if (w) return [];
-		let e = B;
-		if (!ne && Y.key !== "") {
-			let t = r.find((e) => e.id === Y.key)?.sortKey ?? Y.key;
+		we
+	]), De = Ee >= 0 ? W[Ee] : null, Oe = (e, t) => {
+		H && w === void 0 && me(t), P?.(e, t);
+	}, ke = () => {
+		w === void 0 && me(null);
+	}, Ae = () => {
+		if (Ee <= 0) return;
+		let e = W[Ee - 1], t = Te(e, Ee - 1);
+		w === void 0 && me(t), P?.(e, t), j?.(e, t);
+	}, je = () => {
+		if (Ee >= W.length - 1) return;
+		let e = W[Ee + 1], t = Te(e, Ee + 1);
+		w === void 0 && me(t), P?.(e, t), A?.(e, t);
+	}, Me = Y ? ee ?? "" : se.key, Ne = Y ? q ?? "asc" : se.order, Pe = p(() => {
+		if (T) return [];
+		let e = W;
+		if (!Y && se.key !== "") {
+			let t = r.find((e) => e.id === se.key)?.sortKey ?? se.key;
 			e = [...e].sort((e, n) => {
 				let r = String(e[t]).localeCompare(String(n[t]));
-				return Y.order === "asc" ? r : -r;
+				return se.order === "asc" ? r : -r;
 			});
 		}
-		if (!J && ie && pe) {
-			let t = (ae - 1) * pe;
-			e = e.slice(t, t + pe);
+		if (!X && oe && _e) {
+			let t = (le - 1) * _e;
+			e = e.slice(t, t + _e);
 		}
 		return e;
 	}, [
-		B,
+		W,
+		se,
 		Y,
-		ne,
-		J,
-		ie,
-		ae,
-		pe,
-		w
-	]), je = (e) => {
-		ne ? P(e, U === e && ee === "asc" ? "desc" : "asc") : X((t) => ({
+		X,
+		oe,
+		le,
+		_e,
+		T
+	]), Fe = (e) => {
+		Y ? I(e, ee === e && q === "asc" ? "desc" : "asc") : ce((t) => ({
 			key: e,
 			order: t.key === e && t.order === "asc" ? "desc" : "asc"
 		}));
-	}, Me = (e) => Oe === e ? ke === "asc" ? "ascending" : "descending" : "none", Ne = (e, t) => {
-		let n = `${K}__sort-button-${t}`, r = !w && Ae.length === 0;
-		if (w || r || Oe === "") return t === "top" ? `${n}--inactive` : "";
-		let i = Oe === e;
-		return t === "top" ? i && ke === "asc" ? "" : `${n}--inactive` : i && ke === "desc" ? `${n}--desc` : "";
-	}, Pe = Ae.map((e, t) => xe(e, t)), Fe = Pe.length > 0 && Pe.every((e) => ye.has(e)), Ie = !Fe && Pe.some((e) => ye.has(e)), Le = (e) => {
-		let t = new Set(ye);
-		t.has(e) ? t.delete(e) : t.add(e), ge || ve(t), N?.(Array.from(t));
-	}, Re = () => {
-		let e = new Set(ye);
-		Fe || Ie ? Pe.forEach((t) => e.delete(t)) : Pe.forEach((t) => e.add(t)), ge || ve(e), N?.(Array.from(e));
-	}, ze = (t) => /* @__PURE__ */ e.createElement("tr", { key: `skeleton-${t}` }, he && /* @__PURE__ */ e.createElement("td", { className: "pds-table__checkbox-cell" }, /* @__PURE__ */ e.createElement(er, {
+	}, Ie = (e) => Me === e ? Ne === "asc" ? "ascending" : "descending" : "none", Le = (e, t) => {
+		let n = `${re}__sort-button-${t}`, r = !T && Pe.length === 0;
+		if (T || r || Me === "") return t === "top" ? `${n}--inactive` : "";
+		let i = Me === e;
+		return t === "top" ? i && Ne === "asc" ? "" : `${n}--inactive` : i && Ne === "desc" ? `${n}--desc` : "";
+	}, Re = Pe.reduce((e, t, n) => {
+		let r = Te(t, n);
+		return E(t, r) && e.push(r), e;
+	}, []), ze = Re.length > 0 && Re.every((e) => Ce.has(e)), Be = !ze && Re.some((e) => Ce.has(e)), Ve = (e) => {
+		let t = new Set(Ce);
+		t.has(e) ? t.delete(e) : t.add(e), be || Se(t), F?.(Array.from(t));
+	}, He = () => {
+		let e = new Set(Ce);
+		ze || Be ? Re.forEach((t) => e.delete(t)) : Re.forEach((t) => e.add(t)), be || Se(e), F?.(Array.from(e));
+	}, Ue = (t) => /* @__PURE__ */ e.createElement("tr", { key: `skeleton-${t}` }, ye && /* @__PURE__ */ e.createElement("td", { className: "pds-table__checkbox-cell" }, /* @__PURE__ */ e.createElement(er, {
 		shape: "rounded",
 		size: {
 			height: 1,
@@ -11422,119 +11425,122 @@ var Sa = ({ children: t, className: n, columns: r, depth: i = 0, hasChildren: a
 	})), r.map((n) => /* @__PURE__ */ e.createElement("td", { key: `skeleton-${t}-${n.id}` }, /* @__PURE__ */ e.createElement(er, {
 		shape: "rounded",
 		size: { height: 1 }
-	})))), Be = () => /* @__PURE__ */ e.createElement("tr", null, /* @__PURE__ */ e.createElement("td", {
+	})))), We = () => /* @__PURE__ */ e.createElement("tr", null, /* @__PURE__ */ e.createElement("td", {
 		className: "pds-table__empty-cell",
-		colSpan: r.length + +!!he
+		colSpan: r.length + +!!ye
 	}, f ?? /* @__PURE__ */ e.createElement(Ln, {
 		heading: m,
 		iconName: "emptySet",
 		message: g
-	}))), Ve = (t, n) => {
-		let i = xe(t, n), a = M !== void 0 || R !== void 0, o = a && de === i;
+	}))), Ge = (t, n) => {
+		let i = Te(t, n), a = P !== void 0 || H !== void 0, o = a && he === i, s = E(t, i), c = s ? void 0 : x?.(t, i), l = S(t, n + 1), u = c ? `${l} (${c})` : l;
 		return /* @__PURE__ */ e.createElement("tr", {
 			key: `row-${i}`,
 			"aria-selected": a ? o : void 0,
 			className: Z([
-				a ? `${K}__row--inspectable` : null,
-				o ? `${K}__row--inspected` : null,
+				a ? `${re}__row--inspectable` : null,
+				o ? `${re}__row--inspected` : null,
 				y?.(t, i) ?? null
 			]),
-			onClick: a ? () => we(t, i) : void 0,
+			onClick: a ? () => Oe(t, i) : void 0,
 			onKeyDown: a ? (e) => {
-				(e.key === "Enter" || e.key === " ") && (e.preventDefault(), we(t, i));
+				(e.key === "Enter" || e.key === " ") && (e.preventDefault(), Oe(t, i));
 			} : void 0,
 			tabIndex: a ? 0 : void 0
-		}, he && /* @__PURE__ */ e.createElement("td", { className: "pds-table__checkbox-cell" }, /* @__PURE__ */ e.createElement(Cr, {
-			checked: ye.has(i),
-			id: `${te}-row-${i}`,
-			label: x(t, n + 1),
-			onChange: () => Le(i),
+		}, ye && /* @__PURE__ */ e.createElement("td", { className: "pds-table__checkbox-cell" }, /* @__PURE__ */ e.createElement(Cr, {
+			checked: Ce.has(i),
+			disabled: !s,
+			id: `${J}-row-${i}`,
+			inputProps: c ? { title: c } : void 0,
+			label: u,
+			onChange: () => Ve(i),
 			showLabel: !1
 		})), r.map((n) => /* @__PURE__ */ e.createElement("td", { key: `${i}-${n.id}` }, t[n.id])));
-	}, He = d ? { "--pds-detail-panel-width": d } : void 0, Ue = /* @__PURE__ */ e.createElement("div", { className: Z(["pds-table-wrapper", I ? "pds-table-wrapper--in-panel" : null]) }, /* @__PURE__ */ e.createElement("div", {
-		className: Z(["pds-table-wrapper__content", fe ? "pds-table-wrapper__content--panel-open" : null]),
-		style: He
+	}, Ke = d ? { "--pds-detail-panel-width": d } : void 0, qe = /* @__PURE__ */ e.createElement("div", { className: Z(["pds-table-wrapper", B ? "pds-table-wrapper--in-panel" : null]) }, /* @__PURE__ */ e.createElement("div", {
+		className: Z(["pds-table-wrapper__content", ge ? "pds-table-wrapper__content--panel-open" : null]),
+		style: Ke
 	}, /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__table-column" }, /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__table-area" }, /* @__PURE__ */ e.createElement("table", {
-		"aria-busy": w,
-		className: Z([K, t]),
-		...G
-	}, /* @__PURE__ */ e.createElement("thead", null, /* @__PURE__ */ e.createElement("tr", null, he && /* @__PURE__ */ e.createElement("th", { className: "pds-table__checkbox-cell" }, /* @__PURE__ */ e.createElement(Cr, {
-		checked: Fe,
-		id: te,
-		indeterminate: Ie,
-		label: V,
-		onChange: Re,
+		"aria-busy": T,
+		className: Z([re, t]),
+		...ne
+	}, /* @__PURE__ */ e.createElement("thead", null, /* @__PURE__ */ e.createElement("tr", null, ye && /* @__PURE__ */ e.createElement("th", { className: "pds-table__checkbox-cell" }, /* @__PURE__ */ e.createElement(Cr, {
+		checked: ze,
+		id: J,
+		indeterminate: Be,
+		label: G,
+		onChange: He,
 		showLabel: !1
 	})), r.map((t) => /* @__PURE__ */ e.createElement("th", {
 		key: t.id,
-		"aria-sort": t.sortable ? Me(t.id) : void 0
+		"aria-sort": t.sortable ? Ie(t.id) : void 0
 	}, t.sortable ? /* @__PURE__ */ e.createElement("button", {
-		"aria-label": S(Yt(t.header)),
-		className: `${K}__sort-button`,
-		onClick: () => je(t.id),
+		"aria-label": C(Yt(t.header)),
+		className: `${re}__sort-button`,
+		onClick: () => Fe(t.id),
 		type: "button"
 	}, t.header, /* @__PURE__ */ e.createElement("span", {
 		"aria-hidden": "true",
-		className: `${K}__sort-icons`
-	}, /* @__PURE__ */ e.createElement("span", { className: Z([`${K}__sort-button-top`, Ne(t.id, "top")]) }, /* @__PURE__ */ e.createElement(Q, {
+		className: `${re}__sort-icons`
+	}, /* @__PURE__ */ e.createElement("span", { className: Z([`${re}__sort-button-top`, Le(t.id, "top")]) }, /* @__PURE__ */ e.createElement(Q, {
 		iconName: "caretUp",
 		size: "m"
-	})), /* @__PURE__ */ e.createElement("span", { className: Z([`${K}__sort-button-bottom`, Ne(t.id, "bottom")]) }, /* @__PURE__ */ e.createElement(Q, {
+	})), /* @__PURE__ */ e.createElement("span", { className: Z([`${re}__sort-button-bottom`, Le(t.id, "bottom")]) }, /* @__PURE__ */ e.createElement(Q, {
 		iconName: "caretDown",
 		size: "m"
-	})))) : /* @__PURE__ */ e.createElement("span", null, t.header))))), /* @__PURE__ */ e.createElement("tbody", null, w ? Array.from({ length: E }, (e, t) => ze(t)) : Ae.length === 0 ? Be() : Ae.map((e, t) => Ve(e, t))))), ie && !w && (J || B.length > 0) && /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__pagination" }, F && F.length > 0 && /* @__PURE__ */ e.createElement(Bn, {
+	})))) : /* @__PURE__ */ e.createElement("span", null, t.header))))), /* @__PURE__ */ e.createElement("tbody", null, T ? Array.from({ length: O }, (e, t) => Ue(t)) : Pe.length === 0 ? We() : Pe.map((e, t) => Ge(e, t))))), oe && !T && (X || W.length > 0) && /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__pagination" }, L && L.length > 0 && /* @__PURE__ */ e.createElement(Bn, {
 		autoWidth: !0,
-		id: q,
-		label: "Rows per page",
-		onOptionSelect: (e) => me(Number(e.value)),
-		options: F.map((e) => ({
+		id: ie,
+		label: R,
+		onOptionSelect: (e) => ve(Number(e.value)),
+		options: L.map((e) => ({
 			label: v(e),
 			value: String(e)
 		})),
 		showLabel: !1,
 		size: "s",
-		value: String(pe)
+		value: String(_e)
 	}), /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__pagination-controls" }, /* @__PURE__ */ e.createElement(Hi, {
-		currentPage: J ? i ?? 1 : ae,
-		itemsPerPage: pe,
-		onPageChange: J ? A : oe,
-		totalItemCount: J ? W ?? 0 : B.length
-	}))), _ && /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__footer" }, _)), R && /* @__PURE__ */ e.createElement("div", { className: Z(["pds-table-wrapper__detail-panel", fe ? "pds-table-wrapper__detail-panel--open" : null]) }, /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__detail-panel-upper" }, /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__detail-panel-header" }, c && /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__detail-panel-title" }, c), /* @__PURE__ */ e.createElement(tn, {
+		currentPage: X ? i ?? 1 : le,
+		itemsPerPage: _e,
+		labelStrings: z,
+		onPageChange: X ? M : ue,
+		totalItemCount: X ? te ?? 0 : W.length
+	}))), _ && /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__footer" }, _)), H && /* @__PURE__ */ e.createElement("div", { className: Z(["pds-table-wrapper__detail-panel", ge ? "pds-table-wrapper__detail-panel--open" : null]) }, /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__detail-panel-upper" }, /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__detail-panel-header" }, c && /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__detail-panel-title" }, c), /* @__PURE__ */ e.createElement(tn, {
 		ariaLabel: n,
-		onClick: Te,
+		onClick: ke,
 		size: "s"
-	})), /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__detail-panel-content" }, fe && Ce && R(Ce, {
-		rowId: de,
-		onClose: Te,
-		onPrev: Ee,
-		onNext: De,
-		hasPrev: Se > 0,
-		hasNext: Se < B.length - 1
-	}))), fe && Ce && (z || s) && /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__detail-panel-footer" }, z ? z(Ce, {
-		hasNext: Se < B.length - 1,
-		hasPrev: Se > 0,
-		onClose: Te,
-		onNext: De,
-		onPrev: Ee,
-		rowId: de
+	})), /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__detail-panel-content" }, ge && De && H(De, {
+		rowId: he,
+		onClose: ke,
+		onPrev: Ae,
+		onNext: je,
+		hasPrev: Ee > 0,
+		hasNext: Ee < W.length - 1
+	}))), ge && De && (U || s) && /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__detail-panel-footer" }, U ? U(De, {
+		hasNext: Ee < W.length - 1,
+		hasPrev: Ee > 0,
+		onClose: ke,
+		onNext: je,
+		onPrev: Ae,
+		rowId: he
 	}) : /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__detail-panel-nav" }, /* @__PURE__ */ e.createElement($t, {
 		hasBorder: !0,
-		ariaLabel: L,
-		disabled: Se <= 0,
+		ariaLabel: V,
+		disabled: Ee <= 0,
 		iconName: "angleUp",
-		onClick: Ee,
+		onClick: Ae,
 		size: "s",
 		variant: "standard"
 	}), /* @__PURE__ */ e.createElement($t, {
 		hasBorder: !0,
-		ariaLabel: D,
-		disabled: Se >= B.length - 1,
+		ariaLabel: k,
+		disabled: Ee >= W.length - 1,
 		iconName: "angleDown",
-		onClick: De,
+		onClick: je,
 		size: "s",
 		variant: "standard"
 	}))))));
-	return I ? /* @__PURE__ */ e.createElement(Ki, { padding: "none" }, Ue) : Ue;
+	return B ? /* @__PURE__ */ e.createElement(Ki, { padding: "none" }, qe) : qe;
 }, Aa = [
 	" ",
 	"/",
@@ -11869,11 +11875,11 @@ var Sa = ({ children: t, className: n, columns: r, depth: i = 0, hasChildren: a
 			return;
 		}
 		N(!M);
-	}, ee = Wa();
+	}, W = Wa();
 	l(() => {
-		ee === "sm" && !M ? (H.current = !0, S ? S() : N(!0)) : ee !== "sm" && H.current && (H.current = !1, S ? S() : N(!1));
-	}, [ee]);
-	let W = s(() => {
+		W === "sm" && !M ? (H.current = !0, S ? S() : N(!0)) : W !== "sm" && H.current && (H.current = !1, S ? S() : N(!1));
+	}, [W]);
+	let G = s(() => {
 		let e = document.activeElement;
 		if (!e) return !1;
 		let t = e.tagName.toLowerCase();
@@ -11890,15 +11896,15 @@ var Sa = ({ children: t, className: n, columns: r, depth: i = 0, hasChildren: a
 			].includes(t);
 		}
 		return e.isContentEditable;
-	}, []), G = p && c;
+	}, []), K = p && c;
 	Tt("[", (e) => {
-		W() || (e.preventDefault(), M || U());
-	}, { enabled: G }), Tt("]", (e) => {
-		W() || (e.preventDefault(), M && U());
-	}, { enabled: G });
-	let K = m(null);
+		G() || (e.preventDefault(), M || U());
+	}, { enabled: K }), Tt("]", (e) => {
+		G() || (e.preventDefault(), M && U());
+	}, { enabled: K });
+	let ee = m(null);
 	f(() => {
-		let e = K.current;
+		let e = ee.current;
 		if (!e) return;
 		if (z != null) {
 			e.style.setProperty("--pds-app-layout-top-offset", z);
@@ -11916,14 +11922,14 @@ var Sa = ({ children: t, className: n, columns: r, depth: i = 0, hasChildren: a
 			r.disconnect(), i?.disconnect(), window.removeEventListener("resize", t);
 		};
 	}, [z]);
-	let q = Le(t), te = q.__unslotted, ne = q.header, J = q.footer, re = q.sidebar, ie = q.identity, Y = q["content-top"], X = q.navigation, ae = q["content-bottom"], oe = ie || Y || X || ae, se = oe ? /* @__PURE__ */ e.createElement(e.Fragment, null, (ie || o) && /* @__PURE__ */ e.createElement("div", { className: `${P}__sidebar-identity` }, ie, o && !M && /* @__PURE__ */ e.createElement($t, {
+	let q = Le(t), te = q.__unslotted, ne = q.header, re = q.footer, ie = q.sidebar, J = q.identity, Y = q["content-top"], X = q.navigation, ae = q["content-bottom"], oe = J || Y || X || ae, se = oe ? /* @__PURE__ */ e.createElement(e.Fragment, null, (J || o) && /* @__PURE__ */ e.createElement("div", { className: `${P}__sidebar-identity` }, J, o && !M && /* @__PURE__ */ e.createElement($t, {
 		hasBorder: !0,
 		ariaLabel: I.drawerToggle,
 		className: `${P}__drawer-toggle`,
 		iconName: "sidebar",
 		onClick: x,
 		size: "s"
-	})), Y && /* @__PURE__ */ e.createElement("div", { className: `${P}__sidebar-content-top` }, Y), X && /* @__PURE__ */ e.createElement("div", { className: `${P}__sidebar-navigation` }, X), ae && /* @__PURE__ */ e.createElement("div", { className: `${P}__sidebar-content-bottom` }, ae)) : re, ce = i(v, {
+	})), Y && /* @__PURE__ */ e.createElement("div", { className: `${P}__sidebar-content-top` }, Y), X && /* @__PURE__ */ e.createElement("div", { className: `${P}__sidebar-navigation` }, X), ae && /* @__PURE__ */ e.createElement("div", { className: `${P}__sidebar-content-bottom` }, ae)) : ie, ce = i(v, {
 		...b,
 		className: Z([`${P}__main`, b?.className]),
 		id: L,
@@ -11938,10 +11944,10 @@ var Sa = ({ children: t, className: n, columns: r, depth: i = 0, hasChildren: a
 	}, te)), le = /* @__PURE__ */ e.createElement("div", {
 		className: `${P}__content-column`,
 		style: { backgroundColor: _ || void 0 }
-	}, ce, J && /* @__PURE__ */ e.createElement("div", { className: `${P}__footer` }, /* @__PURE__ */ e.createElement("div", {
+	}, ce, re && /* @__PURE__ */ e.createElement("div", { className: `${P}__footer` }, /* @__PURE__ */ e.createElement("div", {
 		className: `${P}__footer-inner`,
 		style: { maxWidth: R }
-	}, J))), ue = /* @__PURE__ */ e.createElement(e.Fragment, null, (re || oe) && /* @__PURE__ */ e.createElement("div", {
+	}, re))), ue = /* @__PURE__ */ e.createElement(e.Fragment, null, (ie || oe) && /* @__PURE__ */ e.createElement("div", {
 		...k,
 		className: Z([
 			`${P}__sidebar`,
@@ -11970,7 +11976,7 @@ var Sa = ({ children: t, className: n, columns: r, depth: i = 0, hasChildren: a
 		preferredPlacement: "right-end"
 	}), /* @__PURE__ */ e.createElement("div", { className: `${P}__sidebar-inner` }, se)), le);
 	return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", {
-		ref: K,
+		ref: ee,
 		className: Z([
 			P,
 			F,