@commercetools/nimbus 3.2.0 → 3.3.0

package/dist/chunks/use-responsive-splitter-sizes-HQ-JjaLl.esm.js

@@ -1,583 +0,0 @@
-import { t as e } from "./mergeProps-CGu7R6EG.esm.js";
-import { t } from "./useObjectRef-ClgudS2C.esm.js";
-import { t as n } from "./useMove-BCbuxYxv.esm.js";
-import { t as r } from "./useFocusRing-CYpmjNkh.esm.js";
-import { t as i } from "./useSeparator-BARleHFH.esm.js";
-import { n as a, t as o } from "./normalize-messages-CKl8ms10.esm.js";
-import { t as s } from "./extract-style-props-4RoFSvGV.esm.js";
-import { t as c } from "./merge-refs-C1GcH9iY.esm.js";
-import { createContext as l, useCallback as u, useContext as d, useEffect as f, useId as p, useMemo as m, useRef as h, useState as g } from "react";
-import { jsx as _ } from "react/jsx-runtime";
-import { createSlotRecipeContext as v, useSlotRecipe as y } from "@chakra-ui/react/styled-system";
-import { themeTokens as b } from "@commercetools/nimbus-tokens";
-//#region src/components/splitter/splitter.slots.tsx
-var { withProvider: x, withContext: S } = v({ key: "nimbusSplitter" }), C = x("div", "root"), w = S("div", "pane"), T = S("div", "handle"), E = l(void 0), D = ({ size: e, delta: t, minSize: n, maxSize: r }) => Math.min(Math.max(e + t, n), r), O = (e) => e.collapsible ? Math.min(e.minSize, e.collapsedSize) : e.minSize, k = (e, t) => {
-	let n = O(e), r = e.maxSize;
-	return t ? {
-		min: n,
-		max: r
-	} : {
-		min: 100 - r,
-		max: 100 - n
-	};
-}, A = (e) => typeof e != "number" || !Number.isFinite(e) ? null : Math.min(Math.max(e, 0), 100), j = (e) => A(e) ?? 50, M = 1e-6, N = (e, t) => e === t ? !0 : e == null || t == null ? !1 : Math.abs(e - t) <= M, P = .001, F = (e) => e.includes("aside") && e.includes("main"), I = (e) => {
-	let { orientation: t, defaultSize: n, size: r, asideConfig: i, keyboardStep: a, isDoubleClickDisabled: o, isDisabled: s, collapsed: c, defaultCollapsed: l, onSizeChange: d, onSizeChangeEnd: p, onCollapsedChange: _ } = e, [v, y] = g([]), [b, x] = g({}), S = r !== void 0, C = c !== void 0, w = (S ? A(r) : null) ?? j(n), T = (c ?? l ?? !1) && i.collapsible, E = T ? i.collapsedSize : w, [D, O] = g(E), k = h(E), M = h(r ?? null), I = h(!1), L = h(w), R = h(T ? w : null), [z, B] = g(l ?? !1), V = C ? c ?? !1 : z, H = h(T), U = u((e, t) => {
-		k.current = e, O(e), d?.(e), t.commit && p?.(e), H.current && e > i.collapsedSize + P && (H.current = !1, R.current = null, C || B(!1), _?.(!1));
-	}, [
-		d,
-		p,
-		i.collapsedSize,
-		C,
-		_
-	]), W = u((e) => U(e, { commit: !1 }), [U]), G = u((e) => {
-		e === void 0 ? p?.(k.current) : U(e, { commit: !0 });
-	}, [U, p]);
-	f(() => {
-		if (!F(v)) return;
-		let e = V, t = H.current;
-		if (e !== t && !(e && !i.collapsible)) if (H.current = e, e) t || (R.current = k.current), k.current = i.collapsedSize, O(i.collapsedSize);
-		else {
-			let e = R.current;
-			R.current = null;
-			let t = e ?? L.current;
-			k.current = t, O(t);
-		}
-	}, [V, v]), f(() => {
-		if (!S || !F(v) || N(r, M.current)) return;
-		let e = A(r);
-		if (e !== null) {
-			if (M.current = r ?? null, V) {
-				R.current = e;
-				return;
-			}
-			N(e, k.current) || (k.current = e, O(e));
-		}
-	}, [
-		r,
-		v,
-		V
-	]), f(() => {
-		typeof process > "u" || process.env.NODE_ENV === "production" || I.current || !S || (n === void 0 ? p === void 0 && (I.current = !0, console.warn("[Splitter] `size` is controlled but `onSizeChangeEnd` is not set. After a drag or keyboard resize the splitter keeps that value and behaves as uncontrolled. Wire `onSizeChangeEnd` and feed the value back to stay controlled.")) : (I.current = !0, console.warn("[Splitter] Both `size` (controlled) and `defaultSize` (uncontrolled) were provided. `defaultSize` is ignored — pass one or the other.")));
-	}, [
-		S,
-		n,
-		p
-	]);
-	let K = u((e, t) => {
-		y((t) => t.includes(e) ? t : [...t, e]), x((n) => n[e] === t ? n : {
-			...n,
-			[e]: t
-		});
-	}, []), q = u((e) => {
-		y((t) => t.filter((t) => t !== e)), x((t) => {
-			if (!(e in t)) return t;
-			let n = { ...t };
-			return delete n[e], n;
-		});
-	}, []), J = u((e) => {
-		s || e !== V && (e && !i.collapsible || (C || B(e), _?.(e)));
-	}, [
-		s,
-		V,
-		i.collapsible,
-		C,
-		_
-	]), Y = u(() => {
-		if (!F(v)) return;
-		let e = L.current;
-		V && (C || (H.current = !1, R.current = null, B(!1)), _?.(!1)), G(e);
-	}, [
-		v,
-		V,
-		C,
-		_,
-		G
-	]);
-	return m(() => ({
-		size: D,
-		setSize: W,
-		commitSize: G,
-		orientation: t,
-		keyboardStep: a,
-		isDoubleClickDisabled: o,
-		isDisabled: s,
-		asideConfig: i,
-		paneOrder: v,
-		paneDomIds: b,
-		registerPane: K,
-		unregisterPane: q,
-		collapsed: V,
-		setCollapsed: J,
-		restoreDefaults: Y
-	}), [
-		D,
-		W,
-		G,
-		t,
-		a,
-		o,
-		s,
-		i,
-		v,
-		b,
-		K,
-		q,
-		V,
-		J,
-		Y
-	]);
-}, L = ({ children: e, orientation: t = "horizontal", defaultSize: n, size: r, minSize: i, maxSize: a, collapsible: o, collapsedSize: c, onSizeChange: l, onSizeChangeEnd: u, collapsed: d, defaultCollapsed: p, onCollapsedChange: h, keyboardStep: g = 5, isDoubleClickDisabled: v = !1, isDisabled: b = !1, ref: x, ...S }) => {
-	let [w, T] = y({ key: "nimbusSplitter" }).splitVariantProps({
-		orientation: t,
-		...S
-	}), [D, O] = s(T), k = I({
-		orientation: t,
-		defaultSize: n,
-		size: r,
-		asideConfig: m(() => ({
-			minSize: i ?? 0,
-			maxSize: a ?? 100,
-			collapsible: o ?? !1,
-			collapsedSize: c ?? 0
-		}), [
-			i,
-			a,
-			o,
-			c
-		]),
-		collapsed: d,
-		defaultCollapsed: p,
-		keyboardStep: g,
-		isDoubleClickDisabled: v,
-		isDisabled: b,
-		onSizeChange: l,
-		onSizeChangeEnd: u,
-		onCollapsedChange: h
-	}), A = k.paneOrder.length;
-	return f(() => {
-		typeof process < "u" && process.env.NODE_ENV !== "production" && A > 0 && A !== 2 && console.warn(`[Splitter] Expected one <Splitter.Aside> and one <Splitter.Main>, got ${A} pane(s). The Splitter primitive is 2-pane; nest a second Splitter inside a pane for 3+ regions.`);
-	}, [A]), /* @__PURE__ */ _(E.Provider, {
-		value: k,
-		children: /* @__PURE__ */ _(C, {
-			ref: x,
-			...w,
-			...D,
-			...O,
-			children: e
-		})
-	});
-};
-L.displayName = "Splitter.Root";
-//#endregion
-//#region src/components/splitter/hooks/use-splitter-context.ts
-var R = () => {
-	let e = d(E);
-	if (!e) throw Error("useSplitterContext must be used within a Splitter.Root");
-	return e;
-}, z = ({ paneRole: e, id: t, children: n, style: r, ref: i, ...a }) => {
-	let { size: o, orientation: s, registerPane: c, unregisterPane: l } = R(), u = p(), d = t ?? u;
-	f(() => (c(e, d), () => l(e)), [
-		e,
-		d,
-		c,
-		l
-	]);
-	let m = e === "aside" ? o : 100 - o;
-	return /* @__PURE__ */ _(w, {
-		ref: i,
-		id: d,
-		style: {
-			[s === "horizontal" ? "width" : "height"]: `${m}%`,
-			...r
-		},
-		...a,
-		children: n
-	});
-}, B = (e) => /* @__PURE__ */ _(z, {
-	paneRole: "aside",
-	...e
-});
-B.displayName = "Splitter.Aside";
-//#endregion
-//#region src/components/splitter/components/splitter.main.tsx
-var V = (e) => /* @__PURE__ */ _(z, {
-	paneRole: "main",
-	...e
-});
-V.displayName = "Splitter.Main";
-//#endregion
-//#region src/components/splitter/hooks/use-handle-keyboard.ts
-var H = ({ isReady: e, applyDelta: t }) => {
-	let { orientation: n, keyboardStep: r, isDisabled: i, collapsed: a, setCollapsed: o, asideConfig: s } = R(), c = u(() => {
-		if (!(!e || i)) {
-			if (a) {
-				o(!1);
-				return;
-			}
-			s.collapsible && o(!0);
-		}
-	}, [
-		e,
-		i,
-		a,
-		s.collapsible,
-		o
-	]);
-	return { onKeyDown: u((a) => {
-		if (!(!e || i)) switch (a.key) {
-			case "ArrowLeft":
-				n === "horizontal" && (a.preventDefault(), t(-r, !0));
-				return;
-			case "ArrowRight":
-				n === "horizontal" && (a.preventDefault(), t(r, !0));
-				return;
-			case "ArrowUp":
-				n === "vertical" && (a.preventDefault(), t(-r, !0));
-				return;
-			case "ArrowDown":
-				n === "vertical" && (a.preventDefault(), t(r, !0));
-				return;
-			case "Home":
-				a.preventDefault(), t(-100, !0);
-				return;
-			case "End":
-				a.preventDefault(), t(100, !0);
-				return;
-			case "Enter":
-				a.preventDefault(), c();
-				return;
-		}
-	}, [
-		e,
-		i,
-		n,
-		r,
-		t,
-		c
-	]) };
-}, U = 1e-4, W = ({ handleRef: e, asideLeads: t, isReady: r, isResizeLocked: i }) => {
-	let { size: a, setSize: o, commitSize: s, orientation: c, isDisabled: l, asideConfig: d } = R(), f = u((e, n) => {
-		if (!r || l || i) return;
-		let c = D({
-			size: a,
-			delta: t ? e : -e,
-			minSize: d.minSize,
-			maxSize: d.maxSize
-		});
-		n ? s(c) : o(c);
-	}, [
-		r,
-		l,
-		i,
-		t,
-		a,
-		d.minSize,
-		d.maxSize,
-		o,
-		s
-	]), p = h(0), { moveProps: m } = n({
-		onMoveStart() {
-			p.current = 0;
-		},
-		onMove(t) {
-			if (!r || l || i) return;
-			let n = e.current?.parentElement;
-			if (!n) return;
-			let a = c === "horizontal" ? n.offsetWidth : n.offsetHeight;
-			if (a <= 0) return;
-			let o = c === "horizontal" ? t.deltaX : t.deltaY;
-			p.current += o / a * 100;
-			let s = p.current;
-			Math.abs(s) < U || (p.current -= s, f(s, !1));
-		},
-		onMoveEnd() {
-			!r || l || i || s();
-		}
-	});
-	return {
-		moveProps: m,
-		applyDelta: f
-	};
-}, G = {
-	en: o({ resizePanes: "Resize panes" }),
-	de: o({ resizePanes: "Resize panes" }),
-	es: o({ resizePanes: "Resize panes" }),
-	"fr-FR": o({ resizePanes: "Resize panes" }),
-	"pt-BR": o({ resizePanes: "Resize panes" })
-}, K = ({ "aria-label": n, "aria-labelledby": o, style: s, ref: l, ...d }) => {
-	let { size: f, orientation: p, isDoubleClickDisabled: m, isDisabled: g, asideConfig: v, paneOrder: y, paneDomIds: b, collapsed: x, restoreDefaults: S } = R(), C = a(G), w = n ?? C.format("resizePanes"), E = t(c(h(null), l)), D = y[0], O = y[1], A = !!D && !!O && D !== O, j = D === "aside", M = x, { moveProps: N, applyDelta: P } = W({
-		handleRef: E,
-		asideLeads: j,
-		isReady: A,
-		isResizeLocked: M
-	}), { onKeyDown: F } = H({
-		isReady: A,
-		applyDelta: P
-	}), { separatorProps: I } = i({
-		orientation: p,
-		"aria-label": w,
-		"aria-labelledby": o
-	}), { focusProps: L, isFocusVisible: z } = r(), B = u(() => {
-		g || m || S();
-	}, [
-		g,
-		m,
-		S
-	]), { min: V, max: U } = k(v, j), K = A ? j ? f : 100 - f : 0, q = A ? b[D] : void 0, J = A ? Math.round(K) : void 0, Y = p === "horizontal" ? { left: `${K}%` } : { top: `${K}%` };
-	return /* @__PURE__ */ _(T, {
-		ref: E,
-		...e(I, N, L, {
-			tabIndex: g ? -1 : 0,
-			"aria-valuenow": J,
-			"aria-valuemin": V,
-			"aria-valuemax": U,
-			"aria-valuetext": J === void 0 ? void 0 : `${J}%`,
-			"aria-orientation": p,
-			"aria-controls": q,
-			"aria-disabled": g || void 0,
-			"data-focus-visible": z || void 0,
-			"data-disabled": g || void 0,
-			"data-resize-locked": M || void 0,
-			onKeyDown: F,
-			onDoubleClick: B,
-			style: {
-				...Y,
-				...s
-			}
-		}, d)
-	});
-};
-K.displayName = "Splitter.Handle";
-//#endregion
-//#region src/components/splitter/splitter.tsx
-var q = {
-	Root: L,
-	Aside: B,
-	Main: V,
-	Handle: K
-}, J = [
-	"3xs",
-	"2xs",
-	"xs",
-	"sm",
-	"md",
-	"lg",
-	"xl",
-	"2xl",
-	"3xl",
-	"4xl",
-	"5xl",
-	"6xl",
-	"7xl",
-	"8xl",
-	"breakpoint-sm",
-	"breakpoint-md",
-	"breakpoint-lg",
-	"breakpoint-xl",
-	"breakpoint-2xl"
-], Y = new Set(J), X = (e) => typeof e == "string" && Y.has(e), Z = (e) => {
-	let t = b.size[e];
-	if (!t) return null;
-	let n = parseFloat(t.value);
-	return Number.isFinite(n) ? n : null;
-}, Q = (e) => typeof e == "number" && Number.isFinite(e) && e > 0, ee = /^-?\d+(?:\.\d+)?%$/, te = /^-?\d+(?:\.\d+)?$/, ne = (e) => typeof e == "string" && ee.test(e), re = (e, t) => {
-	if (typeof e == "number") return Q(t) ? e / t * 100 : null;
-	if (ne(e)) {
-		let t = parseFloat(e);
-		return Number.isFinite(t) ? t : null;
-	}
-	if (X(e)) {
-		let n = Z(e);
-		return n === null || !Q(t) ? null : n / t * 100;
-	}
-	return null;
-}, ie = (e, t = 0, n = 100) => Math.min(n, Math.max(t, e)), ae = (e, t) => e / 100 * t, oe = (e) => {
-	if (te.test(e)) {
-		let t = parseFloat(e);
-		return Number.isFinite(t) ? t : null;
-	}
-	return X(e) ? Z(e) : null;
-}, se = (e) => typeof e == "object" && !!e, ce = (e) => {
-	if (!se(e)) return [{
-		thresholdPx: 0,
-		value: e
-	}];
-	let t = [];
-	for (let [n, r] of Object.entries(e)) {
-		if (r === void 0) continue;
-		let e = oe(n);
-		e !== null && t.push({
-			thresholdPx: e,
-			value: r
-		});
-	}
-	return t.sort((e, t) => e.thresholdPx - t.thresholdPx), t;
-}, le = (e, t) => ce(e).find((e) => e.thresholdPx === t)?.value, ue = (e, t, n) => {
-	if (e.length === 0) return null;
-	let r = ((t) => {
-		let n = e[0];
-		for (let r of e) if (r.thresholdPx <= t) n = r;
-		else break;
-		return n;
-	})(t), i = n?.activeThresholdPx, a = n?.deadbandPx ?? 0;
-	if (i == null || a <= 0 || r.thresholdPx === i) return r;
-	let o = e.findIndex((e) => e.thresholdPx === i);
-	if (o === -1) return r;
-	let s = e[o], c = e[o + 1]?.thresholdPx ?? Infinity;
-	return t >= i - a && t < c + a ? s : r;
-}, $ = (e, t, n) => {
-	let r = ce(e);
-	if (r.length === 0) return {
-		percent: null,
-		thresholdPx: null
-	};
-	let i;
-	if (r.length === 1) i = r[0];
-	else {
-		if (!Q(t)) return {
-			percent: null,
-			thresholdPx: null
-		};
-		i = ue(r, t, {
-			activeThresholdPx: n?.activeThresholdPx,
-			deadbandPx: n?.deadbandPx
-		});
-	}
-	if (!i) return {
-		percent: null,
-		thresholdPx: null
-	};
-	let a = n?.stored?.[i.thresholdPx];
-	if (a) {
-		let e = a.unit === "pct" ? a.value : Q(t) ? a.value / t * 100 : null;
-		if (e !== null) return {
-			percent: e,
-			thresholdPx: i.thresholdPx
-		};
-	}
-	return {
-		percent: re(i.value, t),
-		thresholdPx: i.thresholdPx
-	};
-}, de = (e) => {
-	if (typeof e != "object" || !e) return !1;
-	let t = e;
-	return (t.unit === "px" || t.unit === "pct") && typeof t.value == "number" && Number.isFinite(t.value);
-}, fe = (e) => {
-	if (!e) return null;
-	let t;
-	try {
-		t = JSON.parse(e);
-	} catch {
-		return null;
-	}
-	if (typeof t != "object" || !t) return null;
-	let n = t;
-	if (n.v !== 1 || typeof n.bands != "object") return null;
-	let r = {};
-	for (let [e, t] of Object.entries(n.bands ?? {})) {
-		let n = Number(e);
-		Number.isFinite(n) && de(t) && (r[n] = t);
-	}
-	return r;
-}, pe = (e) => JSON.stringify({
-	v: 1,
-	bands: e
-}), me = () => ({
-	getItem: (e) => {
-		try {
-			return typeof localStorage > "u" ? null : localStorage.getItem(e);
-		} catch {
-			return null;
-		}
-	},
-	setItem: (e, t) => {
-		try {
-			if (typeof localStorage > "u") return;
-			localStorage.setItem(e, t);
-		} catch {}
-	}
-}), he = .05, ge = .5, _e = 2, ve = me(), ye = (e) => {
-	let { orientation: t = "horizontal", size: n, minSize: r, maxSize: i, collapsedSize: a, persistKey: o, storage: s = ve, onCollapsedChange: c } = e, [l, d] = g(null), p = h(null), [_, v] = g(() => o ? fe(s.getItem(o)) ?? {} : {}), y = h(_);
-	y.current = _;
-	let b = h(null), x = h(null), [S, C] = g(void 0), w = h(!1), T = h({
-		size: n,
-		persistKey: o,
-		onCollapsedChange: c
-	});
-	T.current = {
-		size: n,
-		persistKey: o,
-		onCollapsedChange: c
-	};
-	let E = $(n, l, {
-		activeThresholdPx: b.current,
-		deadbandPx: _e,
-		stored: _
-	}), D = r === void 0 ? void 0 : $(r, l).percent ?? void 0, O = i === void 0 ? void 0 : $(i, l).percent ?? void 0, k = a === void 0 ? void 0 : $(a, l).percent ?? void 0, A = E.percent === null ? null : ie(E.percent, D ?? 0, O ?? 100);
-	f(() => {
-		E.thresholdPx !== null && (b.current = E.thresholdPx), A !== null && (x.current !== null && Math.abs(A - x.current) < he || (x.current = A, C(A)));
-	}, [A, E.thresholdPx]);
-	let j = u((e) => {
-		if (!e) return;
-		let n = (e, n) => {
-			let r = t === "vertical" ? n : e;
-			!Number.isFinite(r) || r <= 0 || (p.current = r, d((e) => e !== null && Math.abs(e - r) < ge ? e : r));
-		};
-		if (typeof ResizeObserver > "u") {
-			let t = e.getBoundingClientRect();
-			n(t.width, t.height);
-			return;
-		}
-		let r = new ResizeObserver((e) => {
-			let t = e[0];
-			t && n(t.contentRect.width, t.contentRect.height);
-		});
-		return r.observe(e), () => r.disconnect();
-	}, [t]), M = u((e) => {
-		if (w.current) return;
-		x.current = e, C(e);
-		let { size: t, persistKey: n } = T.current, r = p.current;
-		if (!n || r === null || r <= 0) return;
-		let { thresholdPx: i } = $(t, r, {
-			activeThresholdPx: b.current,
-			deadbandPx: _e
-		});
-		if (i === null) return;
-		let a = ne(le(t, i)) ? "pct" : "px", o = a === "pct" ? e : ae(e, r), c = {
-			...y.current,
-			[i]: {
-				unit: a,
-				value: o
-			}
-		};
-		y.current = c, v(c);
-		try {
-			s.setItem(n, pe(c));
-		} catch {}
-	}, [s]), N = u((e) => {
-		w.current = e, T.current.onCollapsedChange?.(e);
-	}, []), P = S ?? A ?? void 0;
-	return { rootProps: m(() => {
-		let e = {
-			ref: j,
-			orientation: t,
-			onSizeChangeEnd: M,
-			onCollapsedChange: N
-		};
-		return P !== void 0 && (e.size = P), D !== void 0 && (e.minSize = D), O !== void 0 && (e.maxSize = O), k !== void 0 && (e.collapsedSize = k), e;
-	}, [
-		j,
-		t,
-		M,
-		N,
-		P,
-		D,
-		O,
-		k
-	]) };
-};
-//#endregion
-export { V as a, K as i, J as n, B as o, q as r, L as s, ye as t };
-
-//# sourceMappingURL=use-responsive-splitter-sizes-HQ-JjaLl.esm.js.map