@noxickon/onyx 5.0.1 → 6.0.0

package/dist/node_modules/@base-ui/react/checkbox/root/CheckboxRoot.js

@@ -0,0 +1,194 @@
+"use client";
+import { useControlled as e } from "../../../utils/useControlled.js";
+import { useRefWithInit as t } from "../../../utils/useRefWithInit.js";
+import { useIsoLayoutEffect as n } from "../../../utils/useIsoLayoutEffect.js";
+import { useMergedRefs as r } from "../../../utils/useMergedRefs.js";
+import { EMPTY_OBJECT as i, NOOP as a } from "../../../utils/empty.js";
+import { mergeProps as o } from "../../merge-props/mergeProps.js";
+import { useRenderElement as ee } from "../../internals/useRenderElement.js";
+import { useBaseUiId as s } from "../../internals/useBaseUiId.js";
+import { none as te } from "../../internals/reason-parts.js";
+import { createChangeEventDetails as ne } from "../../internals/createBaseUIEventDetails.js";
+import { getWindow as c } from "../../../../@floating-ui/utils/dist/floating-ui.utils.dom.js";
+import { useButton as re } from "../../internals/use-button/useButton.js";
+import { visuallyHidden as ie, visuallyHiddenInput as ae } from "../../../utils/visuallyHidden.js";
+import { useValueChanged as oe } from "../../internals/useValueChanged.js";
+import { useFieldRootContext as se } from "../../internals/field-root-context/FieldRootContext.js";
+import { useRegisterFieldControl as ce } from "../../internals/field-register-control/useRegisterFieldControl.js";
+import { useFormContext as le } from "../../internals/form-context/FormContext.js";
+import { useLabelableContext as ue } from "../../internals/labelable-provider/LabelableContext.js";
+import { getDefaultFormSubmitter as de } from "../../../utils/getDefaultFormSubmitter.js";
+import { useStateAttributesMapping as fe } from "../utils/useStateAttributesMapping.js";
+import { useFieldItemContext as pe } from "../../field/item/FieldItemContext.js";
+import { useAriaLabelledBy as me } from "../../internals/labelable-provider/useAriaLabelledBy.js";
+import { useCheckboxGroupContext as he } from "../../checkbox-group/CheckboxGroupContext.js";
+import { CheckboxRootContext as ge } from "./CheckboxRootContext.js";
+import * as l from "react";
+import { jsx as u, jsxs as _e } from "react/jsx-runtime";
+//#region node_modules/@base-ui/react/checkbox/root/CheckboxRoot.mjs
+var d = "data-parent", f = /*#__PURE__*/ l.forwardRef(function(f, ve) {
+	let { checked: ye, className: be, defaultChecked: xe = !1, "aria-labelledby": Se, disabled: Ce = !1, form: p, id: m, indeterminate: h = !1, inputRef: we, name: g, onCheckedChange: Te, parent: _ = !1, readOnly: v = !1, render: Ee, required: y = !1, uncheckedValue: b, value: x, nativeButton: S = !1, style: De, ...Oe } = f, { clearErrors: C } = le(), { disabled: w, name: T, setDirty: ke, setFilled: E, setFocused: D, setTouched: Ae, state: O, validationMode: je, validityData: Me, validation: Ne } = se(), Pe = pe(), { labelId: Fe, controlId: Ie, registerControlId: k, getDescriptionProps: A } = ue(), j = he(), M = j?.parent, N = M && j.allValues, P = w || Pe.disabled || j?.disabled || Ce, F = T ?? g, I = x ?? F, L = s(), Le = s(), R = Ie;
+	N ? R = _ ? Le : `${M.id}-${I}` : m && (R = m);
+	let z = {};
+	N && (_ ? z = j.parent.getParentProps() : I && (z = j.parent.getChildProps(I)));
+	let { checked: B = ye, indeterminate: Re = h, onCheckedChange: ze, ...Be } = z, V = j?.value, H = j?.setValue, U = j?.defaultValue, W = l.useRef(null), G = t(() => Symbol("checkbox-control")), K = l.useRef(!1), { getButtonProps: Ve, buttonRef: He } = re({
+		disabled: P,
+		native: S
+	}), q = j?.validation ?? Ne, [J, Ue] = e({
+		controlled: I && V && !_ ? V.includes(I) : B,
+		default: I && U && !_ ? U.includes(I) : xe,
+		name: "Checkbox",
+		state: "checked"
+	}), Y = N ? !!B : J, X = N && Re || h;
+	n(() => {
+		k !== a && (K.current = !0, k(G.current, R));
+	}, [
+		R,
+		k,
+		G
+	]), l.useEffect(() => {
+		let e = G.current;
+		return () => {
+			!K.current || k === a || (K.current = !1, k(e, void 0));
+		};
+	}, [k, G]), ce(W, L, J, void 0, !j && !P, g);
+	let Z = l.useRef(null), We = r(we, Z, q.inputRef, q.registerInput), Ge = me(Se, Fe, Z, !S, R ?? void 0);
+	n(() => {
+		Z.current && (Z.current.indeterminate = X, J && E(!0));
+	}, [
+		J,
+		X,
+		E
+	]), oe(J, () => {
+		j || (C(F), E(J), ke(J !== Me.initialValue), q.change(J));
+	});
+	let Q = o({
+		checked: J,
+		disabled: P,
+		form: p,
+		name: _ ? void 0 : F,
+		id: S ? void 0 : R ?? void 0,
+		required: y,
+		ref: We,
+		style: F ? ae : ie,
+		tabIndex: -1,
+		type: "checkbox",
+		"aria-hidden": !0,
+		onChange(e) {
+			if (e.nativeEvent.defaultPrevented) return;
+			if (v) {
+				e.preventDefault();
+				return;
+			}
+			let t = e.currentTarget.checked, n = ne(te, e.nativeEvent);
+			if (Te?.(t, n), !n.isCanceled && (ze?.(t, n), !n.isCanceled && (Ue(t), I && V && H && !_ && !N))) {
+				let e = t ? [...V, I] : V.filter((e) => e !== I);
+				H(e, n);
+			}
+		},
+		onFocus() {
+			W.current?.focus();
+		}
+	}, x === void 0 ? i : { value: (j ? J && x : x) || "" }, A, (e) => q.getValidationProps(P, e));
+	l.useEffect(() => {
+		if (!M || !I) return;
+		let e = M.disabledStatesRef.current;
+		return e.set(I, P), () => {
+			e.delete(I);
+		};
+	}, [
+		M,
+		P,
+		I
+	]);
+	let $ = l.useMemo(() => ({
+		...O,
+		checked: Y,
+		disabled: P,
+		readOnly: v,
+		required: y,
+		indeterminate: X
+	}), [
+		O,
+		Y,
+		P,
+		v,
+		y,
+		X
+	]), Ke = fe($), qe = ee("span", f, {
+		state: $,
+		ref: [
+			He,
+			W,
+			ve,
+			j?.registerControlRef
+		],
+		props: [
+			{
+				id: S ? R ?? void 0 : L,
+				role: "checkbox",
+				"aria-checked": X ? "mixed" : Y,
+				"aria-readonly": v || void 0,
+				"aria-required": y || void 0,
+				"aria-labelledby": Ge,
+				[d]: _ ? "" : void 0,
+				onFocus() {
+					P || D(!0);
+				},
+				onBlur() {
+					let e = Z.current;
+					e && (Ae(!0), D(!1), je === "onBlur" && q.commit(j ? V : e.checked));
+				},
+				onKeyDown(e) {
+					if (e.key !== "Enter" || (e.preventBaseUIHandler(), e.defaultPrevented)) return;
+					let t = Z.current?.form ?? null, n = e.currentTarget, r = e.nativeEvent, i = e.preventDefault, a = r.preventDefault, o = !1;
+					e.preventDefault = () => {
+						o = !0, i.call(e);
+					}, r.preventDefault = () => {
+						o = !0, a.call(r);
+					}, a.call(r), c(n).queueMicrotask(() => {
+						e.preventDefault = i, r.preventDefault = a, o || de(t)?.click();
+					});
+				},
+				onClick(e) {
+					if (v || P) return;
+					e.preventDefault();
+					let t = Z.current;
+					t && t.dispatchEvent(new (c(t)).PointerEvent("click", {
+						bubbles: !0,
+						shiftKey: e.shiftKey,
+						ctrlKey: e.ctrlKey,
+						altKey: e.altKey,
+						metaKey: e.metaKey
+					}));
+				}
+			},
+			Oe,
+			Be,
+			Ve,
+			A,
+			(e) => q.getValidationProps(P, e)
+		],
+		stateAttributesMapping: Ke
+	});
+	return /*#__PURE__*/ _e(ge.Provider, {
+		value: $,
+		children: [
+			qe,
+			!J && !j && F && !_ && b !== void 0 && /*#__PURE__*/ u("input", {
+				type: "hidden",
+				form: p,
+				name: F,
+				value: b,
+				disabled: P
+			}),
+			/*#__PURE__*/ u("input", {
+				...Q,
+				suppressHydrationWarning: !0
+			})
+		]
+	});
+});
+process.env.NODE_ENV !== "production" && (f.displayName = "CheckboxRoot");
+//#endregion
+export { f as CheckboxRoot, d as PARENT_CHECKBOX };

package/dist/node_modules/@base-ui/react/checkbox/root/CheckboxRootContext.js

@@ -0,0 +1,13 @@
+"use client";
+import e from "../../../utils/formatErrorMessage.js";
+import * as t from "react";
+//#region node_modules/@base-ui/react/checkbox/root/CheckboxRootContext.mjs
+var n = /*#__PURE__*/ t.createContext(void 0);
+process.env.NODE_ENV !== "production" && (n.displayName = "CheckboxRootContext");
+function r() {
+	let r = t.useContext(n);
+	if (r === void 0) throw Error(process.env.NODE_ENV === "production" ? e(14) : "Base UI: CheckboxRootContext is missing. Checkbox parts must be placed within <Checkbox.Root>.");
+	return r;
+}
+//#endregion
+export { n as CheckboxRootContext, r as useCheckboxRootContext };

package/dist/node_modules/@base-ui/react/checkbox/root/CheckboxRootDataAttributes.js

@@ -0,0 +1,6 @@
+//#region node_modules/@base-ui/react/checkbox/root/CheckboxRootDataAttributes.mjs
+var e = /*#__PURE__*/ function(e) {
+	return e.checked = "data-checked", e.unchecked = "data-unchecked", e.indeterminate = "data-indeterminate", e.disabled = "data-disabled", e.readonly = "data-readonly", e.required = "data-required", e.valid = "data-valid", e.invalid = "data-invalid", e.touched = "data-touched", e.dirty = "data-dirty", e.filled = "data-filled", e.focused = "data-focused", e;
+}({});
+//#endregion
+export { e as CheckboxRootDataAttributes };

package/dist/node_modules/@base-ui/react/checkbox/utils/useStateAttributesMapping.js

@@ -0,0 +1,15 @@
+"use client";
+import { fieldValidityMapping as e } from "../../internals/field-constants/constants.js";
+import { CheckboxRootDataAttributes as t } from "../root/CheckboxRootDataAttributes.js";
+import * as n from "react";
+//#region node_modules/@base-ui/react/checkbox/utils/useStateAttributesMapping.mjs
+function r(r) {
+	return n.useMemo(() => ({
+		checked(e) {
+			return r.indeterminate ? {} : e ? { [t.checked]: "" } : { [t.unchecked]: "" };
+		},
+		...e
+	}), [r.indeterminate]);
+}
+//#endregion
+export { r as useStateAttributesMapping };

package/dist/node_modules/@base-ui/react/checkbox-group/CheckboxGroup.js

@@ -0,0 +1,86 @@
+"use client";
+import { useControlled as e } from "../../utils/useControlled.js";
+import { useStableCallback as t } from "../../utils/useStableCallback.js";
+import { EMPTY_ARRAY as n } from "../../utils/empty.js";
+import { useRenderElement as r } from "../internals/useRenderElement.js";
+import { useBaseUiId as i } from "../internals/useBaseUiId.js";
+import { useValueChanged as a } from "../internals/useValueChanged.js";
+import { fieldValidityMapping as o } from "../internals/field-constants/constants.js";
+import { useFieldRootContext as s } from "../internals/field-root-context/FieldRootContext.js";
+import { useRegisterFieldControl as c } from "../internals/field-register-control/useRegisterFieldControl.js";
+import { useFormContext as l } from "../internals/form-context/FormContext.js";
+import { useLabelableContext as u } from "../internals/labelable-provider/LabelableContext.js";
+import { areArraysEqual as d } from "../internals/areArraysEqual.js";
+import { CheckboxGroupContext as f } from "./CheckboxGroupContext.js";
+import "../checkbox/root/CheckboxRoot.js";
+import { useCheckboxGroupParent as p } from "./useCheckboxGroupParent.js";
+import * as m from "react";
+import { jsx as h } from "react/jsx-runtime";
+//#region node_modules/@base-ui/react/checkbox-group/CheckboxGroup.mjs
+var g = /*#__PURE__*/ m.forwardRef(function(g, _) {
+	let { allValues: v, className: y, defaultValue: b, disabled: x = !1, id: S, onValueChange: C, render: w, value: T, style: E, ...D } = g, { disabled: O, name: k, state: A, validation: j, setFilled: M, setDirty: N, validityData: P } = s(), { labelId: F, getDescriptionProps: I } = u(), { clearErrors: L } = l(), R = O || x, z = m.useMemo(() => {
+		if (T === void 0) return b ?? [];
+	}, [T, b]), [B, V] = e({
+		controlled: T,
+		default: z,
+		name: "CheckboxGroup",
+		state: "value"
+	}), H = t((e, t) => {
+		C?.(e, t), !t.isCanceled && V(e);
+	}), U = p({
+		allValues: v,
+		value: B,
+		onValueChange: H
+	}), W = i(S), G = m.useRef(null), K = m.useCallback((e) => {
+		G.current == null && e != null && !e.hasAttribute("data-parent") && (G.current = e);
+	}, []);
+	c(G, W, B, void 0, !!k && !R, k);
+	let q = B ?? n;
+	a(q, () => {
+		k && L(k);
+		let e = Array.isArray(P.initialValue) ? P.initialValue : n;
+		M(q.length > 0), N(!d(q, e)), j.change(q);
+	});
+	let J = {
+		...A,
+		disabled: R
+	}, Y = m.useMemo(() => ({
+		allValues: v,
+		value: B,
+		defaultValue: z,
+		setValue: H,
+		parent: U,
+		disabled: R,
+		validation: j,
+		registerControlRef: K
+	}), [
+		v,
+		B,
+		z,
+		H,
+		U,
+		R,
+		j,
+		K
+	]), X = r("div", g, {
+		state: J,
+		ref: _,
+		props: [
+			{
+				id: S,
+				role: "group",
+				"aria-labelledby": F
+			},
+			D,
+			I
+		],
+		stateAttributesMapping: o
+	});
+	return /*#__PURE__*/ h(f.Provider, {
+		value: Y,
+		children: X
+	});
+});
+process.env.NODE_ENV !== "production" && (g.displayName = "CheckboxGroup");
+//#endregion
+export { g as CheckboxGroup };

package/dist/node_modules/@base-ui/react/checkbox-group/CheckboxGroupContext.js

@@ -0,0 +1,13 @@
+"use client";
+import e from "../../utils/formatErrorMessage.js";
+import * as t from "react";
+//#region node_modules/@base-ui/react/checkbox-group/CheckboxGroupContext.mjs
+var n = /*#__PURE__*/ t.createContext(void 0);
+process.env.NODE_ENV !== "production" && (n.displayName = "CheckboxGroupContext");
+function r(r = !0) {
+	let i = t.useContext(n);
+	if (i === void 0 && !r) throw Error(process.env.NODE_ENV === "production" ? e(3) : "Base UI: CheckboxGroupContext is missing. CheckboxGroup parts must be placed within <CheckboxGroup>.");
+	return i;
+}
+//#endregion
+export { n as CheckboxGroupContext, r as useCheckboxGroupContext };

package/dist/node_modules/@base-ui/react/checkbox-group/useCheckboxGroupParent.js

@@ -0,0 +1,51 @@
+"use client";
+import { useStableCallback as e } from "../../utils/useStableCallback.js";
+import { useBaseUiId as t } from "../internals/useBaseUiId.js";
+import * as n from "react";
+//#region node_modules/@base-ui/react/checkbox-group/useCheckboxGroupParent.mjs
+var r = [];
+function i(i) {
+	let { allValues: a = r, value: o = r, onValueChange: s } = i, c = n.useRef(o), l = n.useRef(/* @__PURE__ */ new Map()), [u, d] = n.useState("mixed"), f = t(), p = o.length === a.length, m = o.length !== a.length && o.length > 0, h = e(s), g = n.useCallback(() => ({
+		id: f,
+		indeterminate: m,
+		checked: p,
+		"aria-controls": a.map((e) => `${f}-${e}`).join(" "),
+		onCheckedChange(e, t) {
+			let n = c.current, r = a.filter((e) => l.current.get(e) && n.includes(e)), i = a.filter((e) => !l.current.get(e) || l.current.get(e) && n.includes(e));
+			if (n.length === i.length || n.length === 0) {
+				o.length === i.length ? h(r, t) : h(i, t);
+				return;
+			}
+			let s = "mixed", f = n;
+			u === "mixed" ? (s = "on", f = i) : u === "on" && (s = "off", f = r), h(f, t), t.isCanceled || d(s);
+		}
+	}), [
+		a,
+		p,
+		f,
+		m,
+		h,
+		u,
+		o.length
+	]), _ = n.useCallback((e) => ({
+		checked: o.includes(e),
+		onCheckedChange(t, n) {
+			let r = o.slice();
+			t ? r.push(e) : r.splice(r.indexOf(e), 1), h(r, n), n.isCanceled || (c.current = r, d("mixed"));
+		}
+	}), [h, o]);
+	return n.useMemo(() => ({
+		id: f,
+		indeterminate: m,
+		getParentProps: g,
+		getChildProps: _,
+		disabledStatesRef: l
+	}), [
+		f,
+		m,
+		g,
+		_
+	]);
+}
+//#endregion
+export { i as useCheckboxGroupParent };

package/dist/node_modules/@base-ui/react/collapsible/panel/CollapsiblePanel.js

@@ -0,0 +1,59 @@
+"use client";
+import { useIsoLayoutEffect as e } from "../../../utils/useIsoLayoutEffect.js";
+import { warn as t } from "../../../utils/warn.js";
+import { resolveStyle as n } from "../../utils/resolveStyle.js";
+import { useRenderElement as r } from "../../internals/useRenderElement.js";
+import { useCollapsibleRootContext as i } from "../root/CollapsibleRootContext.js";
+import { useCollapsiblePanel as a } from "./useCollapsiblePanel.js";
+import { collapsibleStateAttributesMapping as o } from "../root/stateAttributesMapping.js";
+import { CollapsiblePanelCssVars as s } from "./CollapsiblePanelCssVars.js";
+import * as c from "react";
+//#region node_modules/@base-ui/react/collapsible/panel/CollapsiblePanel.mjs
+var l = /*#__PURE__*/ c.forwardRef(function(c, l) {
+	let { className: u, hiddenUntilFound: d, keepMounted: f, render: p, id: m, style: h, ...g } = c;
+	process.env.NODE_ENV !== "production" && e(() => {
+		d && f === !1 && t("The `keepMounted={false}` prop on `Collapsible.Panel` is ignored when `hiddenUntilFound` is enabled, since the panel must remain mounted while closed.");
+	}, [d, f]);
+	let { mounted: _, onOpenChange: v, open: y, panelId: b, setMounted: x, setPanelIdState: S, setOpen: C, state: w, transitionStatus: T } = i(), E = d ?? !1, D = f ?? !1;
+	e(() => {
+		if (m) return S(m), () => {
+			S(void 0);
+		};
+	}, [m, S]);
+	let { height: O, props: k, ref: A, shouldPreventOpenAnimation: j, shouldRender: M, transitionStatus: N, width: P } = a({
+		externalRef: l,
+		hiddenUntilFound: E,
+		id: b,
+		keepMounted: D,
+		mounted: _,
+		onOpenChange: v,
+		open: y,
+		setMounted: x,
+		setOpen: C,
+		transitionStatus: T
+	}), F = {
+		...w,
+		transitionStatus: N
+	}, I = n(h, F), L = r("div", {
+		...c,
+		style: void 0
+	}, {
+		state: F,
+		ref: A,
+		props: [
+			k,
+			{ style: {
+				[s.collapsiblePanelHeight]: O === void 0 ? "auto" : `${O}px`,
+				[s.collapsiblePanelWidth]: P === void 0 ? "auto" : `${P}px`
+			} },
+			g,
+			I ? { style: I } : void 0,
+			j ? { style: { animationName: "none" } } : void 0
+		],
+		stateAttributesMapping: o
+	});
+	return M ? L : null;
+});
+process.env.NODE_ENV !== "production" && (l.displayName = "CollapsiblePanel");
+//#endregion
+export { l as CollapsiblePanel };

package/dist/node_modules/@base-ui/react/collapsible/panel/CollapsiblePanelCssVars.js

@@ -0,0 +1,6 @@
+//#region node_modules/@base-ui/react/collapsible/panel/CollapsiblePanelCssVars.mjs
+var e = /*#__PURE__*/ function(e) {
+	return e.collapsiblePanelHeight = "--collapsible-panel-height", e.collapsiblePanelWidth = "--collapsible-panel-width", e;
+}({});
+//#endregion
+export { e as CollapsiblePanelCssVars };

package/dist/node_modules/@base-ui/react/collapsible/panel/CollapsiblePanelDataAttributes.js

@@ -0,0 +1,7 @@
+import { TransitionStatusDataAttributes as e } from "../../internals/stateAttributesMapping.js";
+//#region node_modules/@base-ui/react/collapsible/panel/CollapsiblePanelDataAttributes.mjs
+var t = function(t) {
+	return t.open = "data-open", t.closed = "data-closed", t[t.startingStyle = e.startingStyle] = "startingStyle", t[t.endingStyle = e.endingStyle] = "endingStyle", t;
+}({});
+//#endregion
+export { t as CollapsiblePanelDataAttributes };

package/dist/node_modules/@base-ui/react/collapsible/panel/useCollapsiblePanel.js

@@ -0,0 +1,200 @@
+"use client";
+import { useStableCallback as e } from "../../../utils/useStableCallback.js";
+import { useIsoLayoutEffect as t } from "../../../utils/useIsoLayoutEffect.js";
+import { warn as n } from "../../../utils/warn.js";
+import { useMergedRefs as r } from "../../../utils/useMergedRefs.js";
+import { none as i } from "../../internals/reason-parts.js";
+import { createChangeEventDetails as a } from "../../internals/createBaseUIEventDetails.js";
+import { AnimationFrame as o } from "../../../utils/useAnimationFrame.js";
+import { CollapsiblePanelDataAttributes as s } from "./CollapsiblePanelDataAttributes.js";
+import { getWindow as c } from "../../../../@floating-ui/utils/dist/floating-ui.utils.dom.js";
+import { addEventListener as l } from "../../../utils/addEventListener.js";
+import { useValueAsRef as u } from "../../../utils/useValueAsRef.js";
+import { useAnimationsFinished as d } from "../../internals/useAnimationsFinished.js";
+import { useOpenChangeComplete as f } from "../../internals/useOpenChangeComplete.js";
+import * as p from "react";
+//#region node_modules/@base-ui/react/collapsible/panel/useCollapsiblePanel.mjs
+var m = {
+	height: void 0,
+	width: void 0
+};
+function h(n) {
+	let { externalRef: c, hiddenUntilFound: h, id: v, keepMounted: x, mounted: S, onOpenChange: C, open: w, setMounted: T, setOpen: E, transitionStatus: D } = n, O = p.useRef(null), k = p.useRef(null), [A, j] = p.useState(m), M = p.useRef(m), N = p.useRef(!1), P = p.useRef(w), F = p.useRef(!1), [I, L] = p.useState(!1), R = p.useRef(null), z = r(c, O), B = u({
+		mounted: S,
+		open: w
+	}), V = d(O, !1, !1), H = !w && !S, U = I ? "idle" : D, W = w && (P.current || F.current), G = !w && S && k.current === "css-animation" && A.height === void 0 && A.width === void 0 ? M.current : A, K = h && H && k.current !== "css-animation", q = e((e, t = !0) => {
+		t && (M.current = e), j(e);
+	}), J = e(() => {
+		R.current?.(), R.current = null;
+	}), Y = e((e) => {
+		J(), R.current = () => {
+			R.current = null, e();
+		};
+	}), X = e(() => {
+		w && S && k.current === "css-animation" && (F.current = !0);
+	});
+	t(() => {
+		!I || D === "starting" || L(!1);
+	}, [I, D]), p.useEffect(() => () => {
+		X(), J();
+	}, [X, J]), t(() => {
+		let e = O.current;
+		if (!e) return;
+		!w && R.current && J();
+		let t = _(e, W);
+		if (k.current = t, w && D === "idle" && P.current && t === "css-animation") {
+			M.current = g(e);
+			return;
+		}
+		if (w && D === "starting") {
+			let n = N.current;
+			if (N.current = !1, t === "none") {
+				q(g(e)), L(!0);
+				return;
+			}
+			if (t === "css-transition") {
+				let t = b(e);
+				if (q(g(e)), !n) return t;
+				let r = y(e, "transition-duration", "0s");
+				return Y(r), L(!0), t;
+			}
+			if (t === "css-animation") {
+				if (q(g(e)), !n) {
+					y(e, "animation-name", "none")();
+					return;
+				}
+				let t = y(e, "animation-name", "none"), r = y(e, "animation-duration", "0s");
+				t(), Y(r), L(!0);
+				return;
+			}
+		}
+		if (!w && S && (D === "idle" || D === "starting")) {
+			if (P.current = !1, F.current = !1, t === "none") {
+				q(m, !1), T(!1);
+				return;
+			}
+			q(g(e));
+			return;
+		}
+		if (D !== "ending") return;
+		if (t === "none") {
+			T(!1);
+			return;
+		}
+		let n = g(e);
+		if (!((n.height ?? 0) > 0 || (n.width ?? 0) > 0)) {
+			T(!1);
+			return;
+		}
+		q(n), t === "css-animation" && y(e, "animation-name", "none")();
+	}, [
+		S,
+		w,
+		J,
+		q,
+		T,
+		Y,
+		W,
+		D
+	]), f({
+		enabled: w && S && U === "idle",
+		open: !0,
+		ref: O,
+		onComplete() {
+			w && q(m, !1);
+		}
+	}), p.useEffect(() => {
+		if (w || !S || U !== "ending" || !O.current) return;
+		let e = new AbortController(), t = -1;
+		function n() {
+			B.current.open || (T(!1), q(m, !1));
+		}
+		return t = o.request(() => {
+			e.signal.aborted || V(n, e.signal);
+		}), () => {
+			o.cancel(t), e.abort();
+		};
+	}, [
+		B,
+		S,
+		w,
+		U,
+		V,
+		q,
+		T
+	]), t(() => {
+		let e = O.current;
+		!e || !h || !H || e.setAttribute("hidden", "until-found");
+	}, [H, h]), p.useEffect(function() {
+		let e = O.current;
+		if (!e) return;
+		function t(e) {
+			let t = a(i, e);
+			C(!0, t), !t.isCanceled && (N.current = !0, E(!0));
+		}
+		return l(e, "beforematch", t);
+	}, [C, E]);
+	let Z = x || h || S || w;
+	return {
+		height: G.height,
+		props: {
+			...K ? { [s.startingStyle]: "" } : void 0,
+			hidden: H,
+			id: v
+		},
+		ref: z,
+		shouldPreventOpenAnimation: W,
+		shouldRender: Z,
+		transitionStatus: U,
+		width: G.width
+	};
+}
+function g(e) {
+	return {
+		height: e.scrollHeight,
+		width: e.scrollWidth
+	};
+}
+function _(e, t = !1) {
+	let r = c(e).getComputedStyle(e), i = (r.animationName.split(",").map((e) => e.trim()).some((e) => e !== "" && e !== "none") || t) && v(r.animationDuration), a = v(r.transitionDuration);
+	return i && a ? (process.env.NODE_ENV !== "production" && n("CSS transitions and CSS animations both detected on Collapsible or Accordion panel.", "Only one of either animation type should be used."), "css-transition") : a ? "css-transition" : i ? "css-animation" : "none";
+}
+function v(e) {
+	return e.split(",").map((e) => e.trim()).some((e) => e !== "" && Number.parseFloat(e) > 0);
+}
+function y(e, t, n) {
+	let r = e.style.getPropertyValue(t), i = e.style.getPropertyPriority(t);
+	return e.style.setProperty(t, n), () => {
+		if (r === "") {
+			e.style.removeProperty(t);
+			return;
+		}
+		e.style.setProperty(t, r, i);
+	};
+}
+function b(e) {
+	let t = {
+		"justify-content": e.style.justifyContent,
+		"align-items": e.style.alignItems,
+		"align-content": e.style.alignContent,
+		"justify-items": e.style.justifyItems
+	};
+	Object.keys(t).forEach((t) => {
+		e.style.setProperty(t, "initial", "important");
+	});
+	function n() {
+		Object.entries(t).forEach(([t, n]) => {
+			if (n === "") {
+				e.style.removeProperty(t);
+				return;
+			}
+			e.style.setProperty(t, n);
+		});
+	}
+	let r = o.request(n);
+	return () => {
+		o.cancel(r), n();
+	};
+}
+//#endregion
+export { h as useCollapsiblePanel };