solid-baseui 0.1.0-alpha.0 → 0.1.0-alpha.1

package/dist/lib/client/checkbox-DOXtzBhA.js

@@ -0,0 +1,425 @@
+import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
+import { t } from "./useRender-CxZ8PI-g.js";
+import { getStateAttributesProps as n } from "./internals/getStateAttributesProps.js";
+import { w as r } from "./reasons-Co5CzjKq.js";
+import { n as i, t as a } from "./resolveStyle-XcgAuaKR.js";
+import { createChangeEventDetails as o } from "./internals/createBaseUIEventDetails.js";
+import { transitionStatusMapping as s } from "./internals/stateAttributesMapping.js";
+import { composeEventHandlers as c } from "./internals/composeEventHandlers.js";
+import { t as ee } from "./runOnceAnimationsFinish-CFADb4CN.js";
+import { t as te } from "./createTransitionStatus-BL_cPSEA.js";
+import { fieldStateAttributesMapping as l } from "./internals/field-constants.js";
+import { n as ne } from "./FieldRootContext-izCEh80D.js";
+import { n as u } from "./FormContext-CwLBtm_d.js";
+import { r as d } from "./LabelableContext-CmQF-TX2.js";
+import { t as f } from "./createLabelableId-DxJRwMUJ.js";
+import { n as p } from "./FieldItemContext-Bwzf-4tL.js";
+import { n as re } from "./CheckboxGroupContext-1CRRHK0T.js";
+import { createComponent as m, effect as ie, getNextElement as h, memo as g, mergeProps as _, ref as ae, runHydrationEvents as v, setAttribute as y, setProperty as oe, spread as b, template as x } from "@solidjs/web";
+import { Show as se, createContext as S, createEffect as C, createMemo as w, createSignal as T, createUniqueId as E, omit as ce, onCleanup as le, onSettled as ue, untrack as D, useContext as de } from "solid-js";
+//#region src/checkbox/utils/getCheckboxStateAttributesMapping.ts
+function fe(e) {
+	return {
+		...l,
+		checked(t) {
+			return e.indeterminate ? null : t ? { "data-checked": "" } : { "data-unchecked": "" };
+		}
+	};
+}
+//#endregion
+//#region src/checkbox/root/CheckboxRootContext.ts
+var O = Symbol("CheckboxRootContext"), pe = S(O);
+function me() {
+	let e = de(pe);
+	if (e === O) throw Error("Base UI: CheckboxRootContext is missing. Checkbox parts must be placed within <Checkbox.Root>.");
+	return e;
+}
+//#endregion
+//#region src/checkbox/root/CheckboxRoot.tsx
+var he = /* @__PURE__ */ x("<span>"), ge = /* @__PURE__ */ x("<input type=hidden>"), _e = /* @__PURE__ */ x("<input>"), ve = {
+	"clip-path": "inset(50%)",
+	overflow: "hidden",
+	"white-space": "nowrap",
+	border: "0",
+	padding: "0",
+	width: "1px",
+	height: "1px",
+	margin: "-1px",
+	position: "fixed",
+	top: "0",
+	left: "0"
+}, ye = {
+	...ve,
+	position: "absolute",
+	top: "auto",
+	left: "auto"
+};
+function k(e) {
+	let s = ne(!0), ee = u(), te = p(), l = d(), x = re(), S = e, de = e, O = Symbol("Checkbox"), me = Symbol("CheckboxGroupItem"), k = `base-ui-${E()}`, A = `base-ui-${E()}`, j = `base-ui-${E()}`, M = l.defaultControlId, Se = typeof M == "string" ? M : k, N = D(() => S.checked !== void 0), [Ce, we] = T(D(() => S.defaultChecked ?? !1)), [P, Te] = T(), [F, Ee] = T(), [De, I] = T(), Oe = D(() => N ? !!S.checked : Ce()), L = !1, R = !1, z, B = () => void 0, ke = ce(de, "aria-describedby", "aria-labelledby", "render", "checked", "class", "defaultChecked", "disabled", "form", "id", "indeterminate", "inputRef", "name", "nativeButton", "onBlur", "onChange", "onCheckedChange", "onClick", "onFocus", "onKeyDown", "onKeyUp", "parent", "readOnly", "ref", "required", "style", "uncheckedValue", "value"), V = w(() => S.nativeButton ?? !1), H = w(() => S.parent ?? !1), U = w(() => x?.allValues() !== void 0), W = w(() => s.disabled() || te.disabled() || (x?.disabled() ?? !1) || (S.disabled ?? !1)), G = w(() => S.readOnly ?? !1), K = w(() => S.required ?? !1), q = w(() => s.name() ?? S.name), J = w(() => S.value ?? q()), Ae = w(() => N ? !!S.checked : Ce()), Y = w(() => !x || J() === void 0 || H() ? U() && H() ? x?.parent.checked() ?? !1 : Ae() : x.value().includes(J())), X = w(() => U() && H() && (x?.parent.indeterminate() ?? !1) || (S.indeterminate ?? !1)), je = () => x?.registerControlId !== l.registerControlId, Me = f(() => S.id || void 0, je() ? Se : k, je), Ne = w(() => V() ? Me() : A), Z = w(() => ({
+		...s.state(),
+		checked: Y(),
+		disabled: W(),
+		readOnly: G(),
+		required: K(),
+		indeterminate: X()
+	})), Pe = w(() => i(e.class, Z())), Fe = t(e, () => Z(), (e) => (() => {
+		var t = h(he);
+		return b(t, e, !1), v(), t;
+	})()), Ie = w(() => a(e.style, Z())), Le = w(() => n(Z(), fe(Z()))), Re = w(() => S["aria-labelledby"] ?? l.labelId() ?? De()), ze = w(() => l.getAriaDescribedBy(S["aria-describedby"])), Be = {
+		token: me,
+		id: Ne,
+		disabled: W,
+		element: P,
+		input: F,
+		parent: H,
+		value: J
+	}, Ve = {
+		id: A,
+		name: S.name,
+		value: Y,
+		getControl: () => P() ?? null
+	}, He = c(() => S.onBlur), Ue = c(() => S.onClick), We = c(() => S.onFocus), Ge = c(() => S.onKeyDown), Ke = c(() => S.onKeyUp);
+	function qe(e) {
+		if (R) {
+			e.preventDefault(), e.stopPropagation();
+			return;
+		}
+		if (Ue.call(e.currentTarget, e), e.baseUIHandlerPrevented || G() || W()) return;
+		e.preventDefault();
+		let t = F();
+		t && be(t, e);
+	}
+	function Je(e) {
+		We.call(e.currentTarget, e), !e.baseUIHandlerPrevented && !W() && s.setFocused(!0);
+	}
+	function Ye(e) {
+		He.call(e.currentTarget, e), !e.baseUIHandlerPrevented && (s.setTouched(!0), s.setFocused(!1), s.validationMode() === "onBlur" && s.validation.commit(x ? x.value() : Y()));
+	}
+	function Xe(e) {
+		Ge.call(e.currentTarget, e), !e.baseUIHandlerPrevented && (e.key === "Enter" ? (V() && nt(e.currentTarget), xe(e, F()?.form ?? null)) : !V() && e.key === " " && e.preventDefault());
+	}
+	function Ze(e) {
+		Ke.call(e.currentTarget, e), !(e.baseUIHandlerPrevented || V() || e.defaultPrevented || e.key !== " " || W() || G()) && be(e.currentTarget, e);
+	}
+	function Qe(e) {
+		if (e.stopPropagation(), e.defaultPrevented) {
+			queueMicrotask(Q);
+			return;
+		}
+		L = !0, et(e.currentTarget.checked, e), setTimeout(() => {
+			L = !1;
+		}, 0), queueMicrotask(Q);
+	}
+	function $e(e) {
+		if (L && e.isTrusted) {
+			L = !1;
+			return;
+		}
+		if (e.defaultPrevented) {
+			queueMicrotask(Q);
+			return;
+		}
+		et(e.currentTarget.checked, e), queueMicrotask(Q);
+	}
+	function et(e, t) {
+		if (G() || W()) {
+			t.preventDefault();
+			return;
+		}
+		let n = o(r, t);
+		if (S.onCheckedChange?.(e, n), n.isCanceled) {
+			t.preventDefault();
+			return;
+		}
+		let i = J();
+		if (U() && H()) {
+			x?.parent.changeParent(n) || t.preventDefault();
+			return;
+		}
+		if (U() && x && i !== void 0) {
+			x.parent.changeChild(i, e, n) || t.preventDefault();
+			return;
+		}
+		if (x && i !== void 0 && !H()) {
+			let r = e ? [...x.getValue(), i] : x.getValue().filter((e) => e !== i);
+			x.setValue(r, n) || t.preventDefault();
+			return;
+		}
+		N || we(e);
+	}
+	function Q() {
+		let e = F();
+		e && (e.checked = D(Y), e.indeterminate = D(X));
+	}
+	function tt() {
+		return P() ?? null;
+	}
+	function nt(e) {
+		B(), R = !0;
+		let t = e.ownerDocument, n = t.defaultView, r, i = n?.setTimeout(a, 1e3);
+		function a() {
+			R = !1, t.removeEventListener("keyup", o, !0), n?.removeEventListener("blur", a), r !== void 0 && clearTimeout(r), i !== void 0 && clearTimeout(i), B = () => void 0;
+		}
+		function o(e) {
+			e.key === "Enter" && (r = setTimeout(a, 0));
+		}
+		t.addEventListener("keyup", o, !0), n?.addEventListener("blur", a, { once: !0 }), B = a;
+	}
+	function $(e) {
+		z && z !== e && z.id === j && z.removeAttribute("id"), z !== e && (z = void 0);
+	}
+	return C(() => ({
+		explicit: S["aria-labelledby"],
+		fieldLabel: l.labelId(),
+		input: F(),
+		inputId: Me(),
+		nativeButton: V()
+	}), (e) => {
+		function t() {
+			if (e.explicit || e.fieldLabel || e.nativeButton || !e.input) {
+				$(), I(void 0);
+				return;
+			}
+			let t = e.input.closest("label") ?? e.input.labels?.[0];
+			if (!t) {
+				$(), I(void 0);
+				return;
+			}
+			$(t), t.id || (t.id = j, z = t), I(t.id || void 0);
+		}
+		if (t(), e.explicit || e.fieldLabel || e.nativeButton || !e.input || typeof MutationObserver > "u") return;
+		let n, r = new MutationObserver(() => {
+			t(), i();
+		});
+		function i() {
+			let t = e.input?.getRootNode();
+			!t || t === n || (r.disconnect(), n = t, r.observe(t, {
+				attributes: !0,
+				attributeFilter: ["for", "id"],
+				childList: !0,
+				subtree: !0
+			}));
+		}
+		return i(), () => {
+			r.disconnect(), $();
+		};
+	}), C(() => x, (e) => e?.registerCheckbox(Be)), C(() => ({
+		group: x,
+		input: F(),
+		parent: H()
+	}), (e) => {
+		if (!e.input || e.parent) return;
+		let t = e.group?.fieldControlSource ?? O;
+		return s.validation.registerInput(t, e.input, tt);
+	}), C(() => ({
+		checked: Y(),
+		group: x,
+		indeterminate: X(),
+		input: F(),
+		name: q()
+	}), (e) => {
+		e.input && (e.input.indeterminate = e.indeterminate), e.group || s.setFilled(e.checked), !(e.group || e.checked === Oe) && (Oe = e.checked, D(() => {
+			ee.clearError(e.name), s.setDirty(e.checked !== s.validityData().initialValue), s.validation.change(e.checked);
+		}));
+	}), C(() => ({
+		disabled: W(),
+		group: x,
+		name: S.name,
+		root: P()
+	}), (e) => {
+		Ve.name = e.name, s.registerFieldControl(O, !e.group && !e.disabled && e.root ? Ve : void 0);
+	}), ue(() => {
+		x || s.setFilled(Y()), P();
+	}), le(() => {
+		B(), $(), s.registerFieldControl(O, void 0);
+	}), m(pe, {
+		value: Z,
+		get children() {
+			return [
+				m(Fe, _({
+					ref: [((e) => Te(e)), S.ref],
+					get id() {
+						return Ne();
+					},
+					get class() {
+						return Pe();
+					},
+					get style() {
+						return Ie();
+					},
+					get type() {
+						return V() ? "button" : void 0;
+					},
+					role: "checkbox",
+					get tabIndex() {
+						return W() ? -1 : 0;
+					},
+					get disabled() {
+						return V() && W() ? !0 : void 0;
+					},
+					get "aria-disabled"() {
+						return !V() && W() ? "true" : void 0;
+					},
+					get "aria-checked"() {
+						return g(() => !!X())() ? "mixed" : Y() ? "true" : "false";
+					},
+					get "aria-readonly"() {
+						return G() ? "true" : void 0;
+					},
+					get "aria-required"() {
+						return K() ? "true" : void 0;
+					},
+					get "aria-labelledby"() {
+						return Re();
+					},
+					get "aria-describedby"() {
+						return ze();
+					},
+					get "aria-invalid"() {
+						return Z().valid === !1 && !W() ? "true" : void 0;
+					},
+					get "data-parent"() {
+						return H() ? "" : void 0;
+					},
+					get "aria-controls"() {
+						return g(() => !!(U() && H()))() ? x?.parent.ariaControls() : void 0;
+					},
+					onBlur: Ye,
+					onClick: qe,
+					onFocus: Je,
+					onKeyDown: Xe,
+					onKeyUp: Ze
+				}, Le, ke)),
+				m(se, {
+					get when() {
+						return g(() => !!(!Y() && !x && q() && !H()))() ? S.uncheckedValue !== void 0 : !Y() && !x && q() && !H();
+					},
+					get children() {
+						var e = h(ge);
+						return ie(() => ({
+							e: S.form,
+							t: q(),
+							a: S.uncheckedValue,
+							o: W()
+						}), ({ e: t, t: n, a: r, o: i }, a) => {
+							t !== a?.e && y(e, "form", t), n !== a?.t && y(e, "name", n), oe(e, "value", r), i !== a?.o && y(e, "disabled", i);
+						}), e;
+					}
+				}),
+				(() => {
+					var e = h(_e);
+					return ae(() => [((e) => Ee(e)), S.inputRef], e), b(e, _({
+						type: "checkbox",
+						get form() {
+							return S.form;
+						},
+						get id() {
+							return V() ? void 0 : Me();
+						},
+						get name() {
+							return H() ? void 0 : q();
+						},
+						tabindex: -1,
+						get style() {
+							return q() ? ye : ve;
+						},
+						"aria-hidden": "true",
+						get "aria-describedby"() {
+							return ze();
+						},
+						get "aria-invalid"() {
+							return Z().valid === !1 && !W() ? "true" : void 0;
+						}
+					}, () => S.value === void 0 ? {} : { value: x && !Y() ? "" : S.value }, {
+						get disabled() {
+							return W();
+						},
+						get checked() {
+							return Y();
+						},
+						get required() {
+							return K();
+						},
+						onClick: Qe,
+						onChange: $e,
+						onFocus: () => P()?.focus({ preventScroll: !0 })
+					}), !1), v(), e;
+				})()
+			];
+		}
+	});
+}
+function be(e, t) {
+	let n = e.ownerDocument.defaultView;
+	if (!n) return;
+	let r = n.PointerEvent ?? n.MouseEvent;
+	e.dispatchEvent(new r("click", {
+		bubbles: !0,
+		cancelable: !0,
+		composed: !0,
+		detail: 0,
+		shiftKey: t.shiftKey,
+		ctrlKey: t.ctrlKey,
+		altKey: t.altKey,
+		metaKey: t.metaKey
+	}));
+}
+function xe(e, t) {
+	e.defaultPrevented || queueMicrotask(() => {
+		e.defaultPrevented || A(t)?.click();
+	});
+}
+function A(e) {
+	if (!e) return null;
+	for (let t of e.elements) if ((t.tagName === "BUTTON" || t.tagName === "INPUT") && t.type === "submit") return t;
+	return null;
+}
+//#endregion
+//#region src/checkbox/indicator/CheckboxIndicator.tsx
+var j = /* @__PURE__ */ x("<span>");
+function M(e) {
+	let r, o = !1, c = me(), l = e, ne = ce(e, "render", "class", "keepMounted", "ref", "style"), u = w(() => c().checked || c().indeterminate), d = te(() => u()), f = w(() => (l.keepMounted ?? !1) || d.mounted()), p = w(() => ({
+		...c(),
+		transitionStatus: d.transitionStatus()
+	})), re = t(e, () => p(), (e) => (() => {
+		var t = h(j);
+		return b(t, e, !1), v(), t;
+	})()), ie = w(() => f() ? i(e.class, p()) : void 0), g = w(() => f() ? a(e.style, p()) : void 0), ae = w(() => n(p(), {
+		...fe(p()),
+		...s
+	}));
+	return C(() => ({
+		element: r,
+		rendered: u(),
+		status: d.transitionStatus()
+	}), (e) => {
+		if (o = e.rendered, e.rendered || e.status !== "ending" || !e.element) return;
+		let t = new AbortController();
+		return ee(e.element, () => {
+			o || d.setMounted(!1);
+		}, t.signal), () => t.abort();
+	}), m(se, {
+		get when() {
+			return f();
+		},
+		get children() {
+			return m(re, _({
+				ref: [l.ref, ((e) => r = e)],
+				get class() {
+					return ie();
+				},
+				get style() {
+					return g();
+				}
+			}, ae, ne));
+		}
+	});
+}
+//#endregion
+//#region src/checkbox/index.parts.ts
+var Se = /* @__PURE__ */ e({
+	Indicator: () => M,
+	Root: () => k
+});
+//#endregion
+export { Se as t };

package/dist/lib/client/checkbox-group/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../checkbox-group-CSSp_805.js";
+import { t as e } from "../checkbox-group-CwMDoSTK.js";
 export { e as CheckboxGroup };

package/dist/lib/client/checkbox-group-CwMDoSTK.js

@@ -0,0 +1,135 @@
+import { t as e } from "./useRender-CxZ8PI-g.js";
+import { getStateAttributesProps as t } from "./internals/getStateAttributesProps.js";
+import { n, t as r } from "./resolveStyle-XcgAuaKR.js";
+import { fieldStateAttributesMapping as i } from "./internals/field-constants.js";
+import { n as a } from "./FieldRootContext-izCEh80D.js";
+import { n as o } from "./FormContext-CwLBtm_d.js";
+import { r as s } from "./LabelableContext-CmQF-TX2.js";
+import { t as ee } from "./createLabelableId-DxJRwMUJ.js";
+import { t as c } from "./CheckboxGroupContext-1CRRHK0T.js";
+import { createComponent as l, getNextElement as te, mergeProps as ne, runHydrationEvents as u, spread as d, template as f } from "@solidjs/web";
+import { createEffect as p, createMemo as m, createSignal as h, createUniqueId as g, omit as _, onCleanup as v, onSettled as y, untrack as b } from "solid-js";
+//#region src/checkbox-group/CheckboxGroup.tsx
+var re = /* @__PURE__ */ f("<div>"), x = [];
+function S(f) {
+	let S = a(!0), T = o(), E = s(), [D, O] = h(0);
+	ee(() => null, "");
+	let k = f, A = f, j = Symbol("CheckboxGroup"), M = `base-ui-${g()}`, N = `base-ui-${g()}`, P = b(() => k.value !== void 0), [F, I] = h(() => [...b(() => k.defaultValue) ?? x]), [L, R] = h(), [z, B] = h("mixed"), V = /* @__PURE__ */ new Map(), H = b(() => P ? k.value ?? x : F()), U = H, W = H, G = _(A, "aria-describedby", "aria-labelledby", "allValues", "render", "class", "defaultValue", "disabled", "onValueChange", "ref", "style", "value"), K = m(() => P ? k.value ?? x : F()), q = m(() => S.disabled() || (k.disabled ?? !1)), J = m(() => ({
+		...S.state(),
+		disabled: q()
+	})), Y = m(() => n(f.class, J())), ie = e(f, () => J(), (e) => (() => {
+		var t = te(re);
+		return d(t, e, !1), u(), t;
+	})()), ae = m(() => r(f.style, J())), oe = m(() => t(J(), i)), se = m(() => k["aria-labelledby"] ?? E.labelId()), ce = m(() => E.getAriaDescribedBy(k["aria-describedby"])), le = m(() => K().length === (k.allValues ?? x).length), ue = m(() => K().length > 0 && K().length !== (k.allValues ?? x).length), de = m(() => (D(), (k.allValues ?? x).map((e) => Array.from(V.values()).find((t) => !t.parent() && t.value() === e)?.id()).filter(Boolean).join(" ") || void 0));
+	function fe(e) {
+		return V.set(e.token, e), O((e) => e + 1), () => {
+			V.delete(e.token), O((e) => e + 1);
+		};
+	}
+	function X(e, t) {
+		return k.onValueChange?.(e, t), !t.isCanceled && (P || (U = e, I(e)), !0);
+	}
+	function Z(e) {
+		for (let t of V.values()) if (!t.parent() && t.value() === e) return t.disabled();
+		return !1;
+	}
+	function pe(e) {
+		let t = k.allValues ?? x, n = t.filter((e) => Z(e) && H.includes(e)), r = t.filter((e) => !Z(e) || H.includes(e)), i = H.length === r.length || H.length === 0, a, o = "mixed";
+		return i ? a = Q().length === r.length ? n : r : z() === "mixed" ? (a = r, o = "on") : z() === "on" ? (a = n, o = "off") : a = H, X(a, e) ? (i || B(o), !0) : !1;
+	}
+	function me(e, t, n) {
+		let r = Q().slice();
+		if (t) r.push(e);
+		else {
+			let t = r.indexOf(e);
+			t !== -1 && r.splice(t, 1);
+		}
+		return X(r, n) ? (H = r, B("mixed"), !0) : !1;
+	}
+	function he() {
+		let e = T.formElement();
+		if (!e) return Q();
+		let t = /* @__PURE__ */ new Set();
+		for (let n of V.values()) {
+			let r = n.input(), i = n.value();
+			r && !n.parent() && i !== void 0 && r.checked && w(r, e) && t.add(i);
+		}
+		return Q().filter((e) => t.has(e));
+	}
+	function Q() {
+		return P ? K() : U;
+	}
+	let $ = {
+		id: M,
+		name: void 0,
+		value: K,
+		getValue: he,
+		getControl: () => S.validation.getInputControl()
+	}, ge = {
+		allValues: () => k.allValues,
+		disabled: q,
+		fieldControlSource: j,
+		registerControlId: E.registerControlId,
+		getValue: Q,
+		parent: {
+			id: N,
+			checked: le,
+			indeterminate: ue,
+			ariaControls: de,
+			changeParent: pe,
+			changeChild: me
+		},
+		registerCheckbox: fe,
+		setValue: X,
+		value: K
+	};
+	return p(() => ({
+		disabled: q(),
+		element: L(),
+		id: k.id ?? M,
+		name: S.name()
+	}), (e) => {
+		$.id = e.id, $.name = e.name, S.registerFieldControl(j, e.name && !e.disabled && e.element ? $ : void 0);
+	}), p(() => ({
+		initialValue: S.validityData().initialValue,
+		name: S.name(),
+		value: K()
+	}), (e) => {
+		e.value !== W && (W = e.value, U = e.value, b(() => {
+			T.clearError(e.name), S.setFilled(e.value.length > 0), S.setDirty(!C(e.value, e.initialValue)), S.validation.change(e.value);
+		}));
+	}), y(() => {
+		S.setFilled(K().length > 0);
+	}), v(() => S.registerFieldControl(j, void 0)), l(c, {
+		value: ge,
+		get children() {
+			return l(ie, ne({
+				ref: [((e) => R(e)), k.ref],
+				get class() {
+					return Y();
+				},
+				get style() {
+					return ae();
+				},
+				role: "group",
+				get "aria-labelledby"() {
+					return se();
+				},
+				get "aria-describedby"() {
+					return ce();
+				},
+				get "aria-invalid"() {
+					return J().valid === !1 && !q() ? "true" : void 0;
+				}
+			}, oe, G));
+		}
+	});
+}
+function C(e, t) {
+	return !Array.isArray(t) || e.length !== t.length ? !1 : e.every((e, n) => e === t[n]);
+}
+function w(e, t) {
+	return e.matches(":disabled") ? !1 : e.form === t || e.form === null && !e.hasAttribute("form");
+}
+//#endregion
+export { S as t };

package/dist/lib/client/collapsible/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../collapsible-BIbje_ub.js";
+import { t as e } from "../collapsible-t8YReaIp.js";
 export { e as Collapsible };