@pantheon-systems/pds-toolkit-react 2.0.0-alpha.34 → 2.0.0-alpha.35

package/dist/index.js

@@ -116,6 +116,17 @@ var X = (e) => {
 		svgPathData: "M241.5 239c9.4 9.4 9.4 24.6 0 33.9L81.5 433c-9.4 9.4-24.6 9.4-33.9 0s-9.4-24.6 0-33.9l143-143-143-143c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l160 160z",
 		width: 256
 	},
+	anglesDown: {
+		aliases: [
+			"chevrons down",
+			"double down",
+			"scroll to bottom"
+		],
+		categories: ["arrows"],
+		height: 512,
+		svgPathData: "M369.5 113l-160 160c-9.4 9.4-24.6 9.4-33.9 0L15.5 113c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l143 143 143-143c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9zm0 192l-160 160c-9.4 9.4-24.6 9.4-33.9 0L15.5 305c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l143 143 143-143c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z",
+		width: 384
+	},
 	anglesLeft: {
 		aliases: ["chevrons left", "double left"],
 		categories: ["arrows"],
@@ -130,6 +141,17 @@ var X = (e) => {
 		svgPathData: "M81.5 433l160-160c9.4-9.4 9.4-24.6 0-33.9L81.5 79c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l143 143-143 143c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0zm192 0l160-160c9.4-9.4 9.4-24.6 0-33.9L273.5 79c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l143 143-143 143c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0z",
 		width: 448
 	},
+	anglesUp: {
+		aliases: [
+			"chevrons up",
+			"double up",
+			"scroll to top"
+		],
+		categories: ["arrows"],
+		height: 512,
+		svgPathData: "M209.5 47c-9.4-9.4-24.6-9.4-33.9 0L15.5 207c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l143-143 143 143c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9L209.5 47zm160 352l-160-160c-9.4-9.4-24.6-9.4-33.9 0L15.5 399c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l143-143 143 143c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9z",
+		width: 384
+	},
 	angleUp: {
 		aliases: ["chevron up"],
 		categories: ["arrows"],
@@ -2138,7 +2160,7 @@ var X = (e) => {
 		svgPathData: "M549.7 124.1C543.5 100.4 524.9 81.8 501.4 75.5 458.9 64 288.1 64 288.1 64S117.3 64 74.7 75.5C51.2 81.8 32.7 100.4 26.4 124.1 15 167 15 256.4 15 256.4s0 89.4 11.4 132.3c6.3 23.6 24.8 41.5 48.3 47.8 42.6 11.5 213.4 11.5 213.4 11.5s170.8 0 213.4-11.5c23.5-6.3 42-24.2 48.3-47.8 11.4-42.9 11.4-132.3 11.4-132.3s0-89.4-11.4-132.3zM232.2 337.6l0-162.4 142.7 81.2-142.7 81.2z",
 		width: 576
 	}
-}, Oe = /* @__PURE__ */ "angleDown.angleLeft.angleRight.anglesLeft.anglesRight.angleUp.arrowDownLeftAndArrowUpRightToCenter.arrowDownToLine.arrowLeft.arrowRight.arrowsRetweet.arrowsUpDownLeftRight.asterisk.banBug.bars.barsFilter.barsStaggered.bell.billboard.bitbucket.bluesky.bolt.boltPantheon.boltSolid.book.books.bracketRight.bracketsSquare.brainCircuit.broomWide.building.buildings.bullhorn.calendarDays.caretDown.caretLeft.caretRight.caretUp.ccAmex.ccApplePay.ccDiscover.ccGeneric.ccMC.ccPaypal.ccVisa.chartLine.chartNetwork.chartSimple.check.circle.circleCheck.circleExclamation.circleExclamationSolid.circleInfo.circleInfoSolid.circleMinus.circleNotch.circlePlus.circleQuestion.circleQuestionSolid.circleUser.circleXmark.cloud.cloudArrowDown.cloudArrowUp.cloudPlus.code.codeBranch.codeMerge.command.comment.compress.copy.desktop.diamondExclamation.diamonds4.discourse.display.dollarSign.download.drupal.ellipsis.ellipsisVertical.emptySet.envelope.envelopeOpen.exclamation.expand.expandFromCenter.externalLink.eye.eyeSlash.facebook.file.fileCheck.fileContract.fileCSV.fileDiff.fileExport.fileImport.fileLines.filePDF.fileZip.folder.folderTree.gear.gem.github.gitlab.globe.graduationCap.grid.gripDots.gripDotsVertical.heart.heartSolid.house.idCard.image.inputText.instagram.keySkeleton.landmark.laptop.laptopCode.leaf.lifeRing.linkedin.linkSimple.linkSimpleSlash.listCheck.locationCrosshairs.lock.lockOpen.magnifyingGlass.medal.memo.messages.minus.moon.nextJs.paperclip.paperPlane.pause.pen.penField.phone.play.plus.question.quotesLeft.quotesRight.rectangleList.reply.robot.rocketLaunch.rotate.rotateClock.rotateLeft.rotateRight.rss.save.server.shareNodes.shield.shieldQuartered.shovel.sidebar.siren.sirenOn.sitemap.slack.slashForward.slidersSimple.snowflake.sparkles.squareCheck.squareCode.squareMinus.squarePen.squareQuestion.squareTerminal.star.starSolid.sun.sunBright.table.tableRows.terminal.text.threads.thumbsDown.thumbsUp.trash.triangleExclamation.twitter.upload.user.userAstronaut.userGear.userPlus.users.video.wavePulse.windowRestore.wordpress.wreathLaurel.wrench.xmark.xmarkLarge.xTwitter.youtube".split("."), Q = ({ className: t, display: n = "inline-block", iconName: r, size: i = "l", style: a, verticalAlign: o = "middle", ...s }) => {
+}, Oe = /* @__PURE__ */ "angleDown.angleLeft.angleRight.anglesDown.anglesLeft.anglesRight.anglesUp.angleUp.arrowDownLeftAndArrowUpRightToCenter.arrowDownToLine.arrowLeft.arrowRight.arrowsRetweet.arrowsUpDownLeftRight.asterisk.banBug.bars.barsFilter.barsStaggered.bell.billboard.bitbucket.bluesky.bolt.boltPantheon.boltSolid.book.books.bracketRight.bracketsSquare.brainCircuit.broomWide.building.buildings.bullhorn.calendarDays.caretDown.caretLeft.caretRight.caretUp.ccAmex.ccApplePay.ccDiscover.ccGeneric.ccMC.ccPaypal.ccVisa.chartLine.chartNetwork.chartSimple.check.circle.circleCheck.circleExclamation.circleExclamationSolid.circleInfo.circleInfoSolid.circleMinus.circleNotch.circlePlus.circleQuestion.circleQuestionSolid.circleUser.circleXmark.cloud.cloudArrowDown.cloudArrowUp.cloudPlus.code.codeBranch.codeMerge.command.comment.compress.copy.desktop.diamondExclamation.diamonds4.discourse.display.dollarSign.download.drupal.ellipsis.ellipsisVertical.emptySet.envelope.envelopeOpen.exclamation.expand.expandFromCenter.externalLink.eye.eyeSlash.facebook.file.fileCheck.fileContract.fileCSV.fileDiff.fileExport.fileImport.fileLines.filePDF.fileZip.folder.folderTree.gear.gem.github.gitlab.globe.graduationCap.grid.gripDots.gripDotsVertical.heart.heartSolid.house.idCard.image.inputText.instagram.keySkeleton.landmark.laptop.laptopCode.leaf.lifeRing.linkedin.linkSimple.linkSimpleSlash.listCheck.locationCrosshairs.lock.lockOpen.magnifyingGlass.medal.memo.messages.minus.moon.nextJs.paperclip.paperPlane.pause.pen.penField.phone.play.plus.question.quotesLeft.quotesRight.rectangleList.reply.robot.rocketLaunch.rotate.rotateClock.rotateLeft.rotateRight.rss.save.server.shareNodes.shield.shieldQuartered.shovel.sidebar.siren.sirenOn.sitemap.slack.slashForward.slidersSimple.snowflake.sparkles.squareCheck.squareCode.squareMinus.squarePen.squareQuestion.squareTerminal.star.starSolid.sun.sunBright.table.tableRows.terminal.text.threads.thumbsDown.thumbsUp.trash.triangleExclamation.twitter.upload.user.userAstronaut.userGear.userPlus.users.video.wavePulse.windowRestore.wordpress.wreathLaurel.wrench.xmark.xmarkLarge.xTwitter.youtube".split("."), Q = ({ className: t, display: n = "inline-block", iconName: r, size: i = "l", style: a, verticalAlign: o = "middle", ...s }) => {
 	let c = "pds-icon", l = `${c} ${c}--${i} ${c}--${r}`, u = De[r], d = `0 0 ${u.width} ${u.height}`, f = r in Ee ? Ee[r] : null, p;
 	if (f?.type === "complex") p = f.render();
 	else {
@@ -3157,38 +3179,41 @@ var Fe = "7rem", Ie = "10rem", Le = "8rem", Re = "6rem", ze = "5rem", Be = "4rem
 		role: "menu"
 	}, c.map((e, t) => I(e, t)))), z, S && L(c));
 }, Jt = ({ className: t, defaultValue: n, disabled: r = !1, id: i, label: a, onChange: o, options: s, size: c = "s", value: l, ...u }) => {
-	let d = "pds-segmented-button", f = r ? "pds-is-disabled" : null, p = `${d}--${c}`, m = c === "s" ? "s" : "m", g = l !== void 0, [_, v] = h(n === void 0 ? "" : n), y = (e) => {
-		v(e.target.value), o && o(e.target.value);
+	let d = "pds-segmented-button", f = l !== void 0, [p, m] = h(n === void 0 ? "" : n), g = (e) => {
+		m(e.target.value), o?.(e.target.value);
 	};
-	if (s.length >= 2 && s.length <= 6) return /* @__PURE__ */ e.createElement("fieldset", {
+	return s.length < 2 || s.length > 6 ? null : /* @__PURE__ */ e.createElement("fieldset", {
 		className: Z([
 			d,
-			p,
-			f,
+			`${d}--${c}`,
 			t ?? ""
 		]),
 		...u
 	}, /* @__PURE__ */ e.createElement("legend", { className: "visually-hidden" }, a), /* @__PURE__ */ e.createElement("div", { className: `${d}__options` }, s.map((t, n) => {
-		let a = g ? l === t.value : _ === t.value, o = `${d}__option`, s = a ? `${o}--checked` : null;
+		let a = f ? l === t.value : p === t.value, o = r || !!t.disabled, s = t.id ?? `${i}-option-${n}`, u = c === "s" ? "m" : "l";
 		return /* @__PURE__ */ e.createElement("div", {
-			key: `${i}-option-${n}`,
-			className: Z([o, s])
+			key: s,
+			className: Z([
+				`${d}__option`,
+				a ? `${d}__option--checked` : null,
+				o ? `${d}__option--disabled` : null
+			])
 		}, /* @__PURE__ */ e.createElement("input", {
 			checked: a,
 			className: "visually-hidden",
-			disabled: r || t.disabled,
-			id: t.id ? t.id : `${i}-option-${n}`,
+			disabled: o,
+			id: s,
 			name: i,
-			onChange: y,
+			onChange: g,
 			type: "radio",
 			value: t.value
 		}), /* @__PURE__ */ e.createElement("label", {
-			htmlFor: t.id ? t.id : `${i}-option-${n}`,
+			htmlFor: s,
 			title: t.label
 		}, t.iconName && /* @__PURE__ */ e.createElement(Q, {
 			className: `${d}__icon`,
 			iconName: t.iconName,
-			size: m
+			size: u
 		}), /* @__PURE__ */ e.createElement("span", { className: `${d}__label-text` }, t.label), t.tally && /* @__PURE__ */ e.createElement(Pe, {
 			className: `${d}__tally`,
 			label: t.tally.label,
@@ -8326,70 +8351,70 @@ var Kn = ({ className: t, platform: n, videoId: r, videoTitle: i, ...a }) => {
 		exit: "pds-toast--slideOut"
 	})
 ], mi = ({ ariaLabel: t, children: n, className: r, closeButtonLabel: i = "Close drawer", disableOutsideClick: a, hasCloseButton: o = !0, isOpen: c = !1, placement: u = "right", setIsOpen: d = () => {}, size: f = "m", title: p, width: g, ..._ }) => {
-	let v = "pds-drawer", y = g ? null : `${v}--${f}`, b = `${v}--${u}`, x = g ? { width: g } : void 0, [S, C] = h(c), [w, T] = h(!1), E = m(null), { closeOverlay: D, openOverlay: O } = ft();
+	let v = X(n), y = v.__unslotted, b = v.footer, x = "pds-drawer", S = g ? null : `${x}--${f}`, C = `${x}--${u}`, w = g ? { width: g } : void 0, [T, E] = h(c), [D, O] = h(!1), k = m(null), { closeOverlay: A, openOverlay: j } = ft();
 	l(() => {
-		c ? C(!0) : T(!1);
+		c ? E(!0) : O(!1);
 	}, [c]), l(() => {
-		S && requestAnimationFrame(() => {
+		T && requestAnimationFrame(() => {
 			requestAnimationFrame(() => {
-				T(!0);
+				O(!0);
 			});
 		});
-	}, [S]), l(() => {
-		d(S);
-	}, [S]), l(() => {
-		if (!(!O || !D) && S) return O(), () => D();
+	}, [T]), l(() => {
+		d(T);
+	}, [T]), l(() => {
+		if (!(!j || !A) && T) return j(), () => A();
 	}, [
-		S,
-		O,
-		D
+		T,
+		j,
+		A
 	]), l(() => {
-		if (S) return document.body.style.overflow = "hidden", () => {
+		if (T) return document.body.style.overflow = "hidden", () => {
 			document.body.style.overflow = "";
 		};
-	}, [S]);
-	let k = s(() => {
-		T(!1);
-	}, []), A = s(() => {
-		w || C(!1);
-	}, [w]), j = s(() => {
-		a || k();
-	}, [a, k]);
+	}, [T]);
+	let M = s(() => {
+		O(!1);
+	}, []), N = s(() => {
+		D || E(!1);
+	}, [D]), P = s(() => {
+		a || M();
+	}, [a, M]);
 	return l(() => {
-		if (!S) return;
+		if (!T) return;
 		let e = (e) => {
-			e.key === "Escape" && k();
+			e.key === "Escape" && M();
 		};
 		return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
-	}, [S, k]), S ? ue(/* @__PURE__ */ e.createElement(Y, {
-		active: w,
+	}, [T, M]), T ? ue(/* @__PURE__ */ e.createElement(Y, {
+		active: D,
 		focusTrapOptions: {
 			clickOutsideDeactivates: !a,
 			initialFocus: !1,
 			escapeDeactivates: !1
 		}
-	}, /* @__PURE__ */ e.createElement("div", { className: `${v}__wrapper` }, /* @__PURE__ */ e.createElement("div", {
-		className: Z([`${v}__overlay`, w ? `${v}__overlay--visible` : null]),
-		onClick: j
+	}, /* @__PURE__ */ e.createElement("div", { className: `${x}__wrapper` }, /* @__PURE__ */ e.createElement("div", {
+		className: Z([`${x}__overlay`, D ? `${x}__overlay--visible` : null]),
+		onClick: P
 	}), /* @__PURE__ */ e.createElement("div", {
-		ref: E,
+		ref: k,
 		"aria-label": t || (typeof p == "string" ? p : void 0),
 		className: Z([
-			v,
-			y,
-			b,
-			w ? `${v}--open` : null,
+			x,
+			S,
+			C,
+			D ? `${x}--open` : null,
 			r
 		]),
-		onTransitionEnd: A,
+		onTransitionEnd: N,
 		role: "dialog",
-		style: x,
+		style: w,
 		..._
-	}, /* @__PURE__ */ e.createElement("div", { className: `${v}__header` }, p && /* @__PURE__ */ e.createElement("div", { className: `${v}__title` }, p), o && /* @__PURE__ */ e.createElement(It, {
+	}, /* @__PURE__ */ e.createElement("div", { className: `${x}__header` }, p && /* @__PURE__ */ e.createElement("div", { className: `${x}__title` }, p), o && /* @__PURE__ */ e.createElement(It, {
 		ariaLabel: i,
-		onClick: k,
+		onClick: M,
 		size: "l"
-	})), /* @__PURE__ */ e.createElement("div", { className: `${v}__content` }, n)))), document.body) : null;
+	})), /* @__PURE__ */ e.createElement("div", { className: `${x}__content` }, y), b && /* @__PURE__ */ e.createElement("div", { className: `${x}__footer` }, b)))), document.body) : null;
 }, hi = ({ ariaLabel: t, background: n = "default", children: r, className: i, closeButtonLabel: a = "Close", closeIconName: o = "compress", hasCloseButton: s = !0, isOpen: c, onClose: u, ...d }) => {
 	let f = "pds-full-screen-overlay", p = n === "default" ? null : `${f}--bg-${n}`, { closeOverlay: m, openOverlay: h } = ft();
 	l(() => {
@@ -9708,128 +9733,197 @@ var Yi = ({ 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));
-}, na = ({ className: t, columns: n, currentPage: r, defaultSortKey: i, defaultSortOrder: a = "asc", emptyState: o, emptyStateHeading: s = "No results found.", emptyStateMessage: c, getPageSizeLabel: d = (e) => `Show ${e} rows per page`, getRowId: f, getSelectRowLabel: m = (e, t) => `Select row ${t}`, getSortLabel: g = (e) => `Sort by ${e}`, isLoading: _ = !1, itemsPerPage: v, loadingRowCount: y = 5, onPageChange: b, onPageSizeChange: x, onRowSelectionChange: S, onSort: C, pageSizeOptions: w, rowData: T, selectAllLabel: E = "Select all rows", selectedRows: D, sortKey: O, sortOrder: k, totalItemCount: A, ...j }) => {
-	let M = "pds-table", N = u(), P = u(), F = C !== void 0, I = b !== void 0, L = x !== void 0, R = I || v !== void 0 || w !== void 0, [z, B] = h({
-		key: i ?? "",
-		order: i === void 0 ? "asc" : a
-	}), [V, H] = h(1), [U, ee] = h(v ?? w?.[0] ?? 10), W = I ? v ?? 10 : U, G = (e) => {
-		L ? x(e) : ee(e), I || H(1);
+}, na = ({ 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, re = A !== void 0, J = j !== void 0, ie = re || T !== void 0 || F !== void 0, [ae, Y] = h({
+		key: a ?? "",
+		order: a === void 0 ? "asc" : o
+	}), [oe, se] = h(1), [ce, le] = h(T ?? F?.[0] ?? 10), [ue, de] = h(null), fe = C ?? ue, pe = !!fe && !!R, me = re ? T ?? 10 : ce, he = (e) => {
+		J ? j(e) : le(e), re || se(1);
 	};
 	l(() => {
-		I || H(1);
-	}, [T.length, I]), l(() => {
-		process.env.NODE_ENV !== "production" && r !== void 0 && !b && console.warn("[Table] `currentPage` was provided without `onPageChange`. Controlled pagination requires both props. The table is running in uncontrolled mode.");
+		re || se(1);
+	}, [B.length, re]), 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.");
 	}, []);
-	let K = S !== void 0, q = D !== void 0, [te, ne] = h(/* @__PURE__ */ new Set()), re = q ? new Set(D) : te, J = p(() => new Map(T.map((e, t) => [e, t])), [T]), ie = (e, t) => f ? f(e) : String(J.get(e) ?? t), ae = F ? O ?? "" : z.key, Y = F ? k ?? "asc" : z.order, oe = p(() => {
-		if (_) return [];
-		let e = T;
-		if (!F && z.key !== "") {
-			let t = n.find((e) => e.id === z.key)?.sortKey ?? z.key;
+	let ge = N !== void 0, _e = H !== void 0, [ve, ye] = h(/* @__PURE__ */ new Set()), be = _e ? new Set(H) : ve, xe = p(() => new Map(B.map((e, t) => [e, t])), [B]), Se = (e, t) => b ? b(e) : String(xe.get(e) ?? t), Ce = p(() => B.findIndex((e, t) => (b ? b(e) : String(xe.get(e) ?? t)) === fe), [
+		B,
+		fe,
+		b,
+		xe
+	]), we = Ce >= 0 ? B[Ce] : null, X = (e, t) => {
+		R && C === void 0 && de(t), M?.(e, t);
+	}, Te = () => {
+		C === void 0 && de(null);
+	}, Ee = () => {
+		if (Ce <= 0) return;
+		let e = B[Ce - 1], t = Se(e, Ce - 1);
+		C === void 0 && de(t), M?.(e, t), k?.(e, t);
+	}, De = () => {
+		if (Ce >= B.length - 1) return;
+		let e = B[Ce + 1], t = Se(e, Ce + 1);
+		C === void 0 && de(t), M?.(e, t), O?.(e, t);
+	}, Oe = ne ? U ?? "" : ae.key, ke = ne ? ee ?? "asc" : ae.order, Ae = p(() => {
+		if (w) return [];
+		let e = B;
+		if (!ne && ae.key !== "") {
+			let t = r.find((e) => e.id === ae.key)?.sortKey ?? ae.key;
 			e = [...e].sort((e, n) => {
 				let r = String(e[t]).localeCompare(String(n[t]));
-				return z.order === "asc" ? r : -r;
+				return ae.order === "asc" ? r : -r;
 			});
 		}
-		if (!I && R && W) {
-			let t = (V - 1) * W;
-			e = e.slice(t, t + W);
+		if (!re && ie && me) {
+			let t = (oe - 1) * me;
+			e = e.slice(t, t + me);
 		}
 		return e;
 	}, [
-		T,
-		z,
-		F,
-		I,
-		R,
-		V,
-		W,
-		_
-	]), se = (e) => {
-		F ? C(e, O === e && k === "asc" ? "desc" : "asc") : B((t) => ({
+		B,
+		ae,
+		ne,
+		re,
+		ie,
+		oe,
+		me,
+		w
+	]), je = (e) => {
+		ne ? P(e, U === e && ee === "asc" ? "desc" : "asc") : Y((t) => ({
 			key: e,
 			order: t.key === e && t.order === "asc" ? "desc" : "asc"
 		}));
-	}, ce = (e) => ae === e ? Y === "asc" ? "ascending" : "descending" : "none", le = (e, t) => {
-		let n = ae === e, r = ae !== "" && !n, i = `${M}__sort-button-${t}`;
-		return t === "top" && r ? `${i}--inactive` : n && Y === "desc" ? `${i}--desc` : "";
-	}, ue = oe.map((e, t) => ie(e, t)), de = ue.length > 0 && ue.every((e) => re.has(e)), fe = !de && ue.some((e) => re.has(e)), pe = (e) => {
-		let t = new Set(re);
-		t.has(e) ? t.delete(e) : t.add(e), q || ne(t), S?.(Array.from(t));
-	}, me = () => {
-		let e = new Set(re);
-		de || fe ? ue.forEach((t) => e.delete(t)) : ue.forEach((t) => e.add(t)), q || ne(e), S?.(Array.from(e));
-	}, he = (t) => /* @__PURE__ */ e.createElement("tr", { key: `skeleton-${t}` }, K && /* @__PURE__ */ e.createElement("td", { className: "pds-table__checkbox-cell" }, /* @__PURE__ */ e.createElement(wn, {
+	}, 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) => Se(e, t)), Fe = Pe.length > 0 && Pe.every((e) => be.has(e)), Ie = !Fe && Pe.some((e) => be.has(e)), Le = (e) => {
+		let t = new Set(be);
+		t.has(e) ? t.delete(e) : t.add(e), _e || ye(t), N?.(Array.from(t));
+	}, Re = () => {
+		let e = new Set(be);
+		Fe || Ie ? Pe.forEach((t) => e.delete(t)) : Pe.forEach((t) => e.add(t)), _e || ye(e), N?.(Array.from(e));
+	}, ze = (t) => /* @__PURE__ */ e.createElement("tr", { key: `skeleton-${t}` }, ge && /* @__PURE__ */ e.createElement("td", { className: "pds-table__checkbox-cell" }, /* @__PURE__ */ e.createElement(wn, {
 		shape: "rounded",
 		size: {
 			height: 1,
 			width: 1
 		}
-	})), n.map((n) => /* @__PURE__ */ e.createElement("td", { key: `skeleton-${t}-${n.id}` }, /* @__PURE__ */ e.createElement(wn, {
+	})), r.map((n) => /* @__PURE__ */ e.createElement("td", { key: `skeleton-${t}-${n.id}` }, /* @__PURE__ */ e.createElement(wn, {
 		shape: "rounded",
 		size: { height: 1 }
-	})))), ge = () => /* @__PURE__ */ e.createElement("tr", null, /* @__PURE__ */ e.createElement("td", {
+	})))), Be = () => /* @__PURE__ */ e.createElement("tr", null, /* @__PURE__ */ e.createElement("td", {
 		className: "pds-table__empty-cell",
-		colSpan: n.length + +!!K
-	}, o ?? /* @__PURE__ */ e.createElement(sn, {
-		heading: s,
+		colSpan: r.length + +!!ge
+	}, f ?? /* @__PURE__ */ e.createElement(sn, {
+		heading: m,
 		iconName: "emptySet",
-		message: c
-	}))), _e = (t, r) => {
-		let i = ie(t, r);
-		return /* @__PURE__ */ e.createElement("tr", { key: `row-${i}` }, K && /* @__PURE__ */ e.createElement("td", { className: "pds-table__checkbox-cell" }, /* @__PURE__ */ e.createElement($n, {
-			checked: re.has(i),
-			id: `${P}-row-${i}`,
-			label: m(t, r + 1),
-			onChange: () => pe(i),
+		message: g
+	}))), Ve = (t, n) => {
+		let i = Se(t, n), a = M !== void 0 || R !== void 0, o = a && fe === i;
+		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,
+				y?.(t, i) ?? null
+			]),
+			onClick: a ? () => X(t, i) : void 0,
+			onKeyDown: a ? (e) => {
+				(e.key === "Enter" || e.key === " ") && (e.preventDefault(), X(t, i));
+			} : void 0,
+			tabIndex: a ? 0 : void 0
+		}, ge && /* @__PURE__ */ e.createElement("td", { className: "pds-table__checkbox-cell" }, /* @__PURE__ */ e.createElement($n, {
+			checked: be.has(i),
+			id: `${te}-row-${i}`,
+			label: x(t, n + 1),
+			onChange: () => Le(i),
 			showLabel: !1
-		})), n.map((n) => /* @__PURE__ */ e.createElement("td", { key: `${i}-${n.id}` }, t[n.id])));
-	};
-	return /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper" }, /* @__PURE__ */ e.createElement("table", {
-		"aria-busy": _,
-		className: Z([M, t]),
-		...j
-	}, /* @__PURE__ */ e.createElement("thead", null, /* @__PURE__ */ e.createElement("tr", null, K && /* @__PURE__ */ e.createElement("th", { className: "pds-table__checkbox-cell" }, /* @__PURE__ */ e.createElement($n, {
-		checked: de,
-		id: P,
-		indeterminate: fe,
-		label: E,
-		onChange: me,
+		})), 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", pe ? "pds-table-wrapper__content--panel-open" : null]),
+		style: He
+	}, /* @__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, ge && /* @__PURE__ */ e.createElement("th", { className: "pds-table__checkbox-cell" }, /* @__PURE__ */ e.createElement($n, {
+		checked: Fe,
+		id: te,
+		indeterminate: Ie,
+		label: V,
+		onChange: Re,
 		showLabel: !1
-	})), n.map((t) => /* @__PURE__ */ e.createElement("th", {
+	})), r.map((t) => /* @__PURE__ */ e.createElement("th", {
 		key: t.id,
-		"aria-sort": t.sortable ? ce(t.id) : void 0
+		"aria-sort": t.sortable ? Me(t.id) : void 0
 	}, t.sortable ? /* @__PURE__ */ e.createElement("button", {
-		"aria-label": g(it(t.header)),
-		className: `${M}__sort-button`,
-		onClick: () => se(t.id),
+		"aria-label": S(it(t.header)),
+		className: `${K}__sort-button`,
+		onClick: () => je(t.id),
 		type: "button"
 	}, t.header, /* @__PURE__ */ e.createElement("span", {
 		"aria-hidden": "true",
-		className: `${M}__sort-icons`
-	}, /* @__PURE__ */ e.createElement("span", { className: Z([`${M}__sort-button-top`, le(t.id, "top")]) }, /* @__PURE__ */ e.createElement(Q, {
+		className: `${K}__sort-icons`
+	}, /* @__PURE__ */ e.createElement("span", { className: Z([`${K}__sort-button-top`, Ne(t.id, "top")]) }, /* @__PURE__ */ e.createElement(Q, {
 		iconName: "caretUp",
 		size: "m"
-	})), /* @__PURE__ */ e.createElement("span", { className: Z([`${M}__sort-button-bottom`, le(t.id, "bottom")]) }, /* @__PURE__ */ e.createElement(Q, {
+	})), /* @__PURE__ */ e.createElement("span", { className: Z([`${K}__sort-button-bottom`, Ne(t.id, "bottom")]) }, /* @__PURE__ */ e.createElement(Q, {
 		iconName: "caretDown",
 		size: "m"
-	})))) : /* @__PURE__ */ e.createElement("span", null, t.header))))), /* @__PURE__ */ e.createElement("tbody", null, _ ? Array.from({ length: y }, (e, t) => he(t)) : oe.length === 0 ? ge() : oe.map((e, t) => _e(e, t)))), R && !_ && (I || T.length > 0) && /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__pagination" }, w && w.length > 0 && /* @__PURE__ */ e.createElement(un, {
+	})))) : /* @__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 && (re || B.length > 0) && /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__pagination" }, F && F.length > 0 && /* @__PURE__ */ e.createElement(un, {
 		autoWidth: !0,
-		id: N,
+		id: q,
 		label: "Rows per page",
-		onOptionSelect: (e) => G(Number(e.value)),
-		options: w.map((e) => ({
-			label: d(e),
+		onOptionSelect: (e) => he(Number(e.value)),
+		options: F.map((e) => ({
+			label: v(e),
 			value: String(e)
 		})),
 		showLabel: !1,
 		size: "s",
-		value: String(W)
+		value: String(me)
 	}), /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__pagination-controls" }, /* @__PURE__ */ e.createElement(bi, {
-		currentPage: I ? r ?? 1 : V,
-		itemsPerPage: W,
-		onPageChange: I ? b : H,
-		totalItemCount: I ? A ?? 0 : T.length
-	}))));
+		currentPage: re ? i ?? 1 : oe,
+		itemsPerPage: me,
+		onPageChange: re ? A : se,
+		totalItemCount: re ? 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", pe ? "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(It, {
+		ariaLabel: n,
+		onClick: Te,
+		size: "m"
+	})), /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__detail-panel-content" }, pe && we && R(we, {
+		rowId: fe,
+		onClose: Te,
+		onPrev: Ee,
+		onNext: De,
+		hasPrev: Ce > 0,
+		hasNext: Ce < B.length - 1
+	}))), pe && we && (z || s) && /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__detail-panel-footer" }, z ? z(we, {
+		hasNext: Ce < B.length - 1,
+		hasPrev: Ce > 0,
+		onClose: Te,
+		onNext: De,
+		onPrev: Ee,
+		rowId: fe
+	}) : /* @__PURE__ */ e.createElement("div", { className: "pds-table-wrapper__detail-panel-nav" }, /* @__PURE__ */ e.createElement(Pt, {
+		hasBorder: !0,
+		ariaLabel: L,
+		disabled: Ce <= 0,
+		iconName: "angleUp",
+		onClick: Ee,
+		size: "s",
+		variant: "standard"
+	}), /* @__PURE__ */ e.createElement(Pt, {
+		hasBorder: !0,
+		ariaLabel: D,
+		disabled: Ce >= B.length - 1,
+		iconName: "angleDown",
+		onClick: De,
+		size: "s",
+		variant: "standard"
+	}))))));
+	return I ? /* @__PURE__ */ e.createElement(wi, { padding: "none" }, Ue) : Ue;
 }, ra = [
 	" ",
 	"/",