@pantheon-systems/pds-toolkit-react 2.0.0-alpha.55 → 2.0.0-alpha.56

package/dist/index.js

@@ -3475,7 +3475,8 @@ var On = ({ className: t = "pds-dropdown__selected-icon" }) => /* @__PURE__ */ e
 				onClick: () => {
 					Pn(t) || I(t);
 				},
-				role: "menuitem"
+				role: "menuitem",
+				tabIndex: t.disabled ? -1 : 0
 			}, c);
 		}
 	}, B = (t) => {
@@ -4027,9 +4028,9 @@ var On = ({ className: t = "pds-dropdown__selected-icon" }) => /* @__PURE__ */ e
 		}, T(t));
 	}
 	let E = /* @__PURE__ */ e.createElement("button", {
-		"aria-disabled": i || u || f,
 		className: Z([`${v}__button`, y]),
-		onClick: i ? void 0 : h,
+		disabled: i || u || f,
+		onClick: h,
 		type: "button",
 		...t
 	}, S(C));
@@ -7357,7 +7358,7 @@ var Tr = {
 		onClick: Se,
 		onKeyDown: we,
 		onMouseDown: Ce,
-		tabIndex: 0
+		tabIndex: r ? -1 : 0
 	}, R.length > 1 && !y && /* @__PURE__ */ e.createElement("div", { className: `${D}__counter` }, /* @__PURE__ */ e.createElement("span", { className: `${D}__counter-wrapper` }, Ee)), R.length > 0 && /* @__PURE__ */ e.createElement("div", { className: `${D}__items-wrapper` }, R.map((t, n) => /* @__PURE__ */ e.createElement("span", {
 		key: `selected-item-${n}`,
 		className: `
@@ -7928,6 +7929,7 @@ var Tr = {
 	}, w = String(i + 1), T = String(_), E = o ? v.tagAriaLabel : v.tagAriaLabelSimple, D = `${g.value}, ${E.replace("{index}", w).replace("{total}", T)}`, O = a ? `${b}--dragging` : null, k = t ? $.disabled : null, A = n ? `${b}--drop-target-${n}` : null;
 	return /* @__PURE__ */ e.createElement("div", {
 		ref: y,
+		"aria-disabled": t || void 0,
 		"aria-label": D,
 		className: Z([
 			b,
@@ -9489,6 +9491,7 @@ var Tr = {
 			ref: (e) => {
 				H.current[n] = e;
 			},
+			"aria-disabled": t.disabled || void 0,
 			className: Z([i, a]),
 			id: r,
 			onKeyDown: q,
@@ -9504,6 +9507,7 @@ var Tr = {
 		let r = y.current[n], i = `${E}__item`, a = t.disabled ? `${i}--disabled` : null;
 		return /* @__PURE__ */ e.createElement("li", {
 			key: r,
+			"aria-disabled": t.disabled || void 0,
 			className: Z([i, a]),
 			id: `${r}-accordion`,
 			onClick: () => {
@@ -10121,7 +10125,7 @@ var Tr = {
 			transform: "translateY(1rem)"
 		}
 	});
-	return /* @__PURE__ */ e.createElement(e.Fragment, null, P && /* @__PURE__ */ e.createElement(b, {
+	return P ? Ee(/* @__PURE__ */ e.createElement(b, {
 		lockScroll: !0,
 		style: {
 			...O,
@@ -10153,7 +10157,7 @@ var Tr = {
 	})), /* @__PURE__ */ e.createElement("div", { className: `${v}__title` }, f), /* @__PURE__ */ e.createElement("div", {
 		className: `${v}__content`,
 		style: S
-	}, g), _ && /* @__PURE__ */ e.createElement("div", { className: `${v}__footer` }, _)))));
+	}, g), _ && /* @__PURE__ */ e.createElement("div", { className: `${v}__footer` }, _)))), document.body) : null;
 }, ra = (e, t) => {
 	let n = t - e + 1;
 	return Array.from({ length: n }, (t, n) => n + e);
@@ -10272,10 +10276,10 @@ var Tr = {
 	}), /* @__PURE__ */ e.createElement("span", { className: `${_}__count` }, o.of, " ", f), /* @__PURE__ */ e.createElement("div", { className: `${_}__nav` }, /* @__PURE__ */ e.createElement(zt, {
 		content: o.previous,
 		customTrigger: /* @__PURE__ */ e.createElement("button", {
-			"aria-disabled": h ? !0 : void 0,
 			"aria-label": o.previous,
 			className: Z([`${_}__btn`, h ? `${_}__btn--disabled` : null]),
-			onClick: h ? void 0 : () => s(n - 1),
+			disabled: h,
+			onClick: () => s(n - 1),
 			type: "button"
 		}, /* @__PURE__ */ e.createElement(Q, {
 			iconName: "angleLeft",
@@ -10284,10 +10288,10 @@ var Tr = {
 	}), /* @__PURE__ */ e.createElement(zt, {
 		content: o.next,
 		customTrigger: /* @__PURE__ */ e.createElement("button", {
-			"aria-disabled": g ? !0 : void 0,
 			"aria-label": o.next,
 			className: Z([`${_}__btn`, g ? `${_}__btn--disabled` : null]),
-			onClick: g ? void 0 : () => s(n + 1),
+			disabled: g,
+			onClick: () => s(n + 1),
 			type: "button"
 		}, /* @__PURE__ */ e.createElement(Q, {
 			iconName: "angleRight",
@@ -11851,7 +11855,7 @@ var Ba = ({ children: t, className: n, columns: r, depth: i = 0, hasChildren: a
 	let f = (e) => {
 		let t = e.currentTarget.getAttribute("data-tabnumber");
 		t && d(parseInt(t, 10));
-	}, p = m([]);
+	}, p = m([]), g = m([]);
 	l(() => {
 		i(u);
 	}, [u, i]), l(() => {
@@ -11864,30 +11868,30 @@ var Ba = ({ children: t, className: n, columns: r, depth: i = 0, hasChildren: a
 			return;
 		}
 	}, [u]);
-	let g = (e, t) => {
-		let n = u, r = p.current[t === "next" ? n + 1 < p.current.length ? n + 1 : 0 : n - 1 >= 0 ? n - 1 : p.current.length - 1];
-		r || (r = t == "next" ? p.current[e + 1] == null ? p.current[0] : p.current[e + 1] : p.current[e - 1]), r.focus();
-	}, _ = (e) => {
-		let t = p.current.length, n = () => {
-			g((u + 1) % t, "next"), d(u + 1);
-		}, r = () => {
-			g((u - 1 + t) % t, "prev"), d(u - 1);
+	let _ = (e, t, n) => {
+		let r = u, i = e.current[n === "next" ? r + 1 < e.current.length ? r + 1 : 0 : r - 1 >= 0 ? r - 1 : e.current.length - 1];
+		i || (i = n == "next" ? e.current[t + 1] == null ? e.current[0] : e.current[t + 1] : e.current[t - 1]), i.focus();
+	}, v = (e) => (t) => {
+		let n = e.current.length, r = () => {
+			_(e, (u + 1) % n, "next"), d(u + 1);
 		}, i = () => {
-			g(0), d(0);
+			_(e, (u - 1 + n) % n, "prev"), d(u - 1);
 		}, a = () => {
-			g(t - 1), d(t - 1);
+			_(e, 0), d(0);
 		}, o = () => {
-			p.current[u].focus();
-		}, s = {
-			ArrowRight: n,
-			ArrowLeft: r,
-			Home: i,
-			End: a,
-			Space: o,
-			Enter: o
-		}[e.code];
-		s && (e.preventDefault(), s());
-	};
+			_(e, n - 1), d(n - 1);
+		}, s = () => {
+			e.current[u].focus();
+		}, c = {
+			ArrowRight: r,
+			ArrowLeft: i,
+			Home: a,
+			End: o,
+			Space: s,
+			Enter: s
+		}[t.code];
+		c && (t.preventDefault(), c());
+	}, y = v(p), b = v(g);
 	return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", {
 		className: Z([c, n]),
 		...s
@@ -11902,14 +11906,14 @@ var Ba = ({ children: t, className: n, columns: r, depth: i = 0, hasChildren: a
 			t || (p.current[o] = e);
 		},
 		"aria-controls": `${c}__tab--${o}`,
-		"aria-disabled": !!t,
 		"aria-selected": o == u,
 		className: `${c}__tab`,
 		"data-tabnumber": o,
+		disabled: t,
 		id: r,
-		onClick: t ? null : f,
+		onClick: f,
 		onKeyDown: (e) => {
-			e.preventDefault(), _(e);
+			e.preventDefault(), y(e);
 		},
 		role: "tab",
 		tabIndex: u === o ? 0 : -1,
@@ -11929,15 +11933,18 @@ var Ba = ({ children: t, className: n, columns: r, depth: i = 0, hasChildren: a
 		role: "tabpanel"
 	}, /* @__PURE__ */ e.createElement("button", {
 		key: o,
+		ref: (e) => {
+			t || (g.current[o] = e);
+		},
 		"aria-controls": `tabpanel_${o}`,
-		"aria-disabled": !!t,
 		"aria-selected": o == u,
 		className: `${c}__trigger`,
 		"data-tabnumber": o,
-		onClick: t ? null : f,
-		onKeyDown: _,
+		disabled: t,
+		onClick: f,
+		onKeyDown: b,
 		role: "tab",
-		tabIndex: u === o ? 1 : -1,
+		tabIndex: u === o ? 0 : -1,
 		type: "button"
 	}, /* @__PURE__ */ e.createElement("div", { className: `${c}__tab-label` }, n && /* @__PURE__ */ e.createElement(Q, {
 		iconName: n,