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

package/dist/lib/client/avatar-DNZ4fnBd.js

@@ -0,0 +1,191 @@
+import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
+import { t } from "./useRender-CxZ8PI-g.js";
+import { n, t as r } from "./resolveStyle-XcgAuaKR.js";
+import { composeEventHandlers as i, liveEventHandler as a } from "./internals/composeEventHandlers.js";
+import { t as o } from "./runOnceAnimationsFinish-CFADb4CN.js";
+import { t as s } from "./createTransitionStatus-BL_cPSEA.js";
+import { createComponent as c, getNextElement as l, isServer as u, mergeProps as d, runHydrationEvents as f, spread as p, template as m } from "@solidjs/web";
+import { Show as h, createContext as g, createEffect as _, createMemo as v, createSignal as y, omit as b, onCleanup as x, untrack as S, useContext as C } from "solid-js";
+//#region src/avatar/root/AvatarRootContext.ts
+var w = Symbol("AvatarRootContext"), T = g(w);
+function E() {
+	let e = C(T);
+	if (e === w) throw Error("Base UI: AvatarRootContext is missing. Avatar parts must be placed within <Avatar.Root>.");
+	return e;
+}
+//#endregion
+//#region src/avatar/root/AvatarRoot.tsx
+var D = /* @__PURE__ */ m("<span>");
+function O(e) {
+	let [i, a] = y("idle"), o = b(e, "render", "class", "style"), s = v(() => ({ imageLoadingStatus: i() })), u = v(() => n(e.class, s())), m = v(() => r(e.style, s())), h = {
+		imageLoadingStatus: i,
+		setImageLoadingStatus: a
+	}, g = t(e, () => s(), (e) => (() => {
+		var t = l(D);
+		return p(t, e, !1), f(), t;
+	})());
+	return c(T, {
+		value: h,
+		get children() {
+			return c(g, d({
+				get class() {
+					return u();
+				},
+				get style() {
+					return m();
+				}
+			}, o));
+		}
+	});
+}
+//#endregion
+//#region src/avatar/image/createImageLoadingStatus.ts
+function k(e, t, n) {
+	let [r, i] = y("idle"), a = !0;
+	return _(e, (e) => {
+		if (u) return;
+		if (e.keepMounted) {
+			let e = t(), r = a;
+			if (a = !1, !e) return;
+			let o = e.complete ? e.naturalWidth > 0 ? "loaded" : "error" : "loading";
+			i(o), r && o === "loaded" && n();
+			return;
+		}
+		if (!e.src && !e.srcset) {
+			i("error");
+			return;
+		}
+		let r = !0, o = new window.Image(), s = (e) => {
+			r && i(e);
+		};
+		return i("loading"), o.onload = () => s("loaded"), o.onerror = () => s("error"), e.referrerpolicy && (o.referrerPolicy = e.referrerpolicy), o.crossOrigin = e.crossorigin ?? null, e.sizes && (o.sizes = e.sizes), e.srcset && (o.srcset = e.srcset), e.src && (o.src = e.src), o.complete && i(o.naturalWidth > 0 ? "loaded" : "error"), () => {
+			r = !1, o.onload = null, o.onerror = null;
+		};
+	}), [r, i];
+}
+//#endregion
+//#region src/avatar/image/AvatarImage.tsx
+var A = /* @__PURE__ */ m("<img>");
+function j(e) {
+	let u = E(), m, g = !1, y = "idle", C = b(e, "render", "class", "style", "onLoadingStatusChange", "ref", "keepMounted", "onLoad", "onError", "sizes", "srcset", "src"), [w, T] = k(() => ({
+		src: typeof e.src == "string" ? e.src : void 0,
+		srcset: typeof e.srcset == "string" ? e.srcset : void 0,
+		sizes: typeof e.sizes == "string" ? e.sizes : void 0,
+		crossorigin: typeof e.crossorigin == "string" ? e.crossorigin : void 0,
+		referrerpolicy: typeof e.referrerpolicy == "string" ? e.referrerpolicy : void 0,
+		keepMounted: e.keepMounted ?? !1
+	}), () => m, () => O.setMounted(!0)), D = v(() => w() === "loaded"), O = s(() => D()), j = v(() => ({
+		imageLoadingStatus: w(),
+		transitionStatus: e.keepMounted && O.transitionStatus() === "ending" ? void 0 : O.transitionStatus()
+	})), M = v(() => e.keepMounted || O.mounted() ? n(e.class, j()) : void 0), N = v(() => e.keepMounted || O.mounted() ? r(e.style, j()) : void 0), P = i(a(() => e.onLoad), () => {
+		e.keepMounted && T("loaded");
+	}), F = i(a(() => e.onError), () => {
+		e.keepMounted && T("error");
+	});
+	_(() => ({
+		status: w(),
+		onLoadingStatusChange: e.onLoadingStatusChange
+	}), (e) => {
+		e.status !== y && (y = e.status, e.status !== "idle" && (e.onLoadingStatusChange?.(e.status), u.setImageLoadingStatus(e.status)));
+	}), _(() => ({
+		visible: D(),
+		transitionStatus: O.transitionStatus(),
+		element: m
+	}), (t) => {
+		if (g = t.visible, t.visible || t.transitionStatus !== "ending" || !t.element) return;
+		let n = new AbortController();
+		return o(t.element, () => {
+			g || (S(() => e.keepMounted) || (m = void 0), O.setMounted(!1));
+		}, n.signal), () => n.abort();
+	}), x(() => u.setImageLoadingStatus("idle"));
+	let I = t(e, () => j(), (e) => (() => {
+		var t = l(A);
+		return p(t, e, !1), f(), t;
+	})());
+	return c(h, {
+		get when() {
+			return e.keepMounted || O.mounted();
+		},
+		get children() {
+			return c(I, d({
+				ref: [e.ref, (e) => m = e],
+				alt: "",
+				get class() {
+					return M();
+				},
+				get style() {
+					return N();
+				},
+				get "data-starting-style"() {
+					return j().transitionStatus === "starting" ? "" : void 0;
+				},
+				get "data-ending-style"() {
+					return j().transitionStatus === "ending" ? "" : void 0;
+				},
+				get "data-loading"() {
+					return e.keepMounted && w() === "loading" ? "" : void 0;
+				},
+				get "data-error"() {
+					return e.keepMounted && w() === "error" ? "" : void 0;
+				},
+				get "aria-hidden"() {
+					return e.keepMounted && w() !== "loaded" ? "true" : void 0;
+				},
+				onLoad: P,
+				onError: F
+			}, C, {
+				get sizes() {
+					return e.sizes;
+				},
+				get srcset() {
+					return e.srcset;
+				},
+				get src() {
+					return e.src;
+				}
+			}));
+		}
+	});
+}
+//#endregion
+//#region src/avatar/fallback/AvatarFallback.tsx
+var M = /* @__PURE__ */ m("<span>");
+function N(e) {
+	let i = E(), a = v(() => e.delay ?? 0), [o, s] = y(S(a) === 0), u = b(e, "render", "class", "style", "delay"), m = v(() => ({ imageLoadingStatus: i.imageLoadingStatus() })), g = v(() => i.imageLoadingStatus() !== "loaded" && (a() === 0 || o())), x = v(() => g() ? n(e.class, m()) : void 0), C = v(() => g() ? r(e.style, m()) : void 0);
+	_(a, (e) => {
+		if (e <= 0) {
+			s(!0);
+			return;
+		}
+		let t = setTimeout(() => s(!0), e);
+		return () => clearTimeout(t);
+	});
+	let w = t(e, () => m(), (e) => (() => {
+		var t = l(M);
+		return p(t, e, !1), f(), t;
+	})());
+	return c(h, {
+		get when() {
+			return g();
+		},
+		get children() {
+			return c(w, d({
+				get class() {
+					return x();
+				},
+				get style() {
+					return C();
+				}
+			}, u));
+		}
+	});
+}
+//#endregion
+//#region src/avatar/index.parts.ts
+var P = /* @__PURE__ */ e({
+	Fallback: () => N,
+	Image: () => j,
+	Root: () => O
+});
+//#endregion
+export { P as t };

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

@@ -1,2 +1,2 @@
-import { t as e } from "../button-DpUi-2g8.js";
+import { t as e } from "../button-BJZYmCVv.js";
 export { e as Button };

package/dist/lib/client/button-BJZYmCVv.js

@@ -0,0 +1,88 @@
+import { t as e } from "./useRender-CxZ8PI-g.js";
+import { n as t, t as n } from "./resolveStyle-XcgAuaKR.js";
+import { composeEventHandlers as r, liveEventHandler as i } from "./internals/composeEventHandlers.js";
+import { createComponent as a, getNextElement as o, mergeProps as s, runHydrationEvents as c, spread as l, template as u } from "@solidjs/web";
+import { createMemo as d, omit as f, onSettled as p, untrack as m } from "solid-js";
+//#region src/button/Button.tsx
+var h = /* @__PURE__ */ u("<button>");
+function g(u) {
+	let g = u, _ = f(u, "render", "class", "disabled", "focusableWhenDisabled", "nativeButton", "onClick", "onKeyDown", "onKeyUp", "onMouseDown", "onPointerDown", "ref", "style"), C = d(() => u.disabled ?? !1), w = d(() => u.focusableWhenDisabled ?? !1), T = d(() => u.nativeButton ?? !0), E = d(() => ({ disabled: C() })), D = d(() => t(u.class, E())), O = d(() => n(u.style, E())), k = d(() => T() && C() && !w()), A = d(() => T() ? w() ? C() ? "true" : "false" : void 0 : C() ? "true" : void 0), j = d(() => !T() && C() && !w() ? -1 : 0), M = r(i(() => m(() => u.disabled ?? !1 ? v : void 0)), i(() => g.onClick)), N = r(i(() => m(() => u.disabled ?? !1 ? y : void 0)), i(() => g.onMouseDown)), P = r(i(() => m(() => u.disabled ?? !1 ? v : void 0)), i(() => g.onPointerDown)), F = r(i(() => m(() => u.disabled ?? !1 ? u.focusableWhenDisabled ?? !1 ? b : y : void 0)), i(() => g.onKeyDown), i(() => m(() => u.nativeButton ?? !0 ? void 0 : x))), I = r(i(() => m(() => u.disabled ?? !1 ? y : void 0)), i(() => g.onKeyUp), i(() => m(() => u.nativeButton ?? !0 ? void 0 : S)));
+	p(() => {});
+	let L = e(u, () => E(), (e) => (() => {
+		var t = o(h);
+		return l(t, e, !1), c(), t;
+	})());
+	return a(L, s({
+		ref: [((e) => e), g.ref],
+		get class() {
+			return D();
+		},
+		get style() {
+			return O();
+		},
+		get type() {
+			return T() ? "button" : void 0;
+		},
+		get role() {
+			return T() ? void 0 : "button";
+		},
+		get tabIndex() {
+			return j();
+		},
+		get disabled() {
+			return k();
+		},
+		get "aria-disabled"() {
+			return A();
+		},
+		get "data-disabled"() {
+			return C() ? "" : void 0;
+		},
+		onClick: M,
+		onMouseDown: N,
+		onPointerDown: P,
+		onKeyDown: F,
+		onKeyUp: I
+	}, _));
+}
+function _(e) {
+	return e.tagName === "A" && !!e.href;
+}
+function v(e) {
+	e.preventDefault(), e.preventBaseUIHandler();
+}
+function y(e) {
+	e.preventBaseUIHandler();
+}
+function b(e) {
+	e.key !== "Tab" && e.preventDefault(), e.preventBaseUIHandler();
+}
+function x(e) {
+	if (e.target !== e.currentTarget) return;
+	let t = e.currentTarget, n = _(t), r = e.key === "Enter", i = e.key === " ";
+	if (n || !i && !r) {
+		n && i && e.preventDefault();
+		return;
+	}
+	e.defaultPrevented || (e.preventDefault(), r && (e.preventBaseUIHandler(), C(t, e)));
+}
+function S(e) {
+	e.target === e.currentTarget && !e.defaultPrevented && e.key === " " && (e.preventBaseUIHandler(), C(e.currentTarget, e));
+}
+function C(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
+	}));
+}
+//#endregion
+export { g as t };

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

@@ -1,2 +1,2 @@
-import { t as e } from "../checkbox-BbAwOptH.js";
+import { t as e } from "../checkbox-sQHYTbpB.js";
 export { e as Checkbox };

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-DGyrciZJ.js";
 export { e as CheckboxGroup };

package/dist/lib/client/checkbox-group-DGyrciZJ.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 { r as a } from "./FieldRootContext-D3fuVjs3.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 };