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

package/dist/lib/client/DialogPopup-Df7MC358.js

@@ -0,0 +1,138 @@
+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 { composeEventHandlers as i } from "./internals/composeEventHandlers.js";
+import { t as a } from "./FocusManager-NP1uPXTi.js";
+import { d as o, f as s, h as c, s as l, u } from "./DialogHandle-BGyIbcvg.js";
+import { createComponent as d, getNextElement as f, mergeProps as p, runHydrationEvents as m, spread as h, template as g } from "@solidjs/web";
+import { Show as _, createEffect as v, createMemo as y, omit as b, onCleanup as x } from "solid-js";
+//#region src/dialog/backdrop/DialogBackdrop.tsx
+var S = /* @__PURE__ */ g("<div>");
+function C(i) {
+	let a = c(), l = i, u = b(i, "render", "class", "forceRender", "ref", "style"), g = y(() => ({
+		open: a.store.open(),
+		transitionStatus: a.store.track().transitionStatus
+	})), v = e(i, () => g(), (e) => (() => {
+		var t = f(S);
+		return h(t, e, !1), m(), t;
+	})()), C = y(() => n(i.class, g())), w = y(() => s({
+		"user-select": "none",
+		"-webkit-user-select": "none"
+	}, r(i.style, g()))), T = y(() => t(g(), o)), E = y(() => !!l.forceRender || !a.nested);
+	function D() {
+		let e = null;
+		return x(() => {
+			a.backdropElement() === e && a.setBackdropElement(null);
+		}), d(v, p({
+			ref: [((t) => {
+				e = t, a.setBackdropElement(t);
+			}), l.ref],
+			role: "presentation",
+			get hidden() {
+				return !a.presence.mounted();
+			},
+			get class() {
+				return C();
+			},
+			get style() {
+				return w();
+			}
+		}, T, u));
+	}
+	return d(_, {
+		get when() {
+			return E();
+		},
+		get children() {
+			return d(D, {});
+		}
+	});
+}
+//#endregion
+//#region src/dialog/popup/DialogPopup.tsx
+var w = /* @__PURE__ */ g("<div>"), T = /* @__PURE__ */ new Set([
+	"ArrowUp",
+	"ArrowDown",
+	"ArrowLeft",
+	"ArrowRight",
+	"Home",
+	"End"
+]);
+function E(o) {
+	l();
+	let g = c(), _ = o, S = b(o, "render", "class", "finalFocus", "id", "initialFocus", "onKeyDown", "ref", "style"), C = y(() => ({
+		open: g.store.open(),
+		transitionStatus: g.store.track().transitionStatus,
+		nested: g.nested,
+		nestedDialogOpen: g.nestedOpenDialogCount() > 0
+	})), E = e(o, () => C(), (e) => (() => {
+		var t = f(w);
+		return h(t, e, !1), m(), t;
+	})()), D = y(() => n(o.class, C())), O = y(() => s({ "--nested-dialogs": g.nestedOpenDialogCount() }, r(o.style, C()))), k = y(() => t(C(), u)), A = y(() => _.id ?? g.store.context.floatingId), j = y(() => _.initialFocus ?? ((e) => e !== "touch" || g.store.state.popupElement)), M = i(() => _.onKeyDown, () => (e) => {
+		T.has(e.key) && e.stopPropagation();
+	}), N = null;
+	v(() => A(), (e) => {
+		g.store.setPopupId(e);
+	}), x(() => {
+		g.store.state.popupElement === N && g.store.setPopupElement(null);
+	});
+	let P = d(E, p({
+		ref: [((e) => {
+			N = e, g.store.setPopupElement(e);
+		}), _.ref],
+		get id() {
+			return A();
+		},
+		get role() {
+			return g.role;
+		},
+		tabIndex: -1,
+		"data-base-ui-focusable": "",
+		get hidden() {
+			return !g.presence.mounted();
+		},
+		get "aria-labelledby"() {
+			return g.titleId();
+		},
+		get "aria-describedby"() {
+			return g.descriptionId();
+		},
+		get class() {
+			return D();
+		},
+		get style() {
+			return O();
+		},
+		onKeyDown: M
+	}, k, S));
+	return d(a, {
+		get context() {
+			return g.store.context.floatingRoot;
+		},
+		get tree() {
+			return g.tree;
+		},
+		get disabled() {
+			return !g.presence.mounted();
+		},
+		get closeOnFocusOut() {
+			return !g.disablePointerDismissal();
+		},
+		get initialFocus() {
+			return j();
+		},
+		get returnFocus() {
+			return _.finalFocus;
+		},
+		get modal() {
+			return g.modal() !== !1;
+		},
+		restoreFocus: "popup",
+		get openInteractionType() {
+			return g.store.openMethod();
+		},
+		children: P
+	});
+}
+//#endregion
+export { C as n, E as t };

package/dist/lib/client/FieldControl-C0PATyKV.js

@@ -0,0 +1,142 @@
+import { t as e } from "./useRender-CxZ8PI-g.js";
+import { getStateAttributesProps as t } from "./internals/getStateAttributesProps.js";
+import { w as n } from "./reasons-Co5CzjKq.js";
+import { n as r, t as i } from "./resolveStyle-XcgAuaKR.js";
+import { createChangeEventDetails as a } from "./internals/createBaseUIEventDetails.js";
+import { composeEventHandlers as o } from "./internals/composeEventHandlers.js";
+import { fieldStateAttributesMapping as s } from "./internals/field-constants.js";
+import { n as c } from "./FieldRootContext-izCEh80D.js";
+import { n as ee } from "./FormContext-CwLBtm_d.js";
+import { r as l } from "./LabelableContext-CmQF-TX2.js";
+import { t as u } from "./createLabelableId-DxJRwMUJ.js";
+import { createComponent as te, getNextElement as ne, mergeProps as d, runHydrationEvents as f, spread as p, template as m } from "@solidjs/web";
+import { createEffect as h, createMemo as g, createSignal as _, createUniqueId as v, omit as y, onCleanup as b, onSettled as x, untrack as S } from "solid-js";
+//#region src/field/control/FieldControl.tsx
+var C = /* @__PURE__ */ m("<input>");
+function w(m) {
+	let w = c(!0), D = ee(), O = l(), k = m, A = m, j = Symbol("FieldControl"), M = !1, N = S(() => k.value !== void 0), P = () => k.value == null ? void 0 : String(k.value), F = S(P), I, L = !1, R = O.defaultControlId, z = typeof R == "string" ? R : `base-ui-${v()}`, [B, V] = _(), H = y(A, "aria-describedby", "aria-labelledby", "render", "autofocus", "class", "defaultValue", "disabled", "id", "name", "onBlur", "onFocus", "onInput", "onKeyDown", "onValueChange", "ref", "style", "value"), U = u(() => k.id, z), W = g(() => w.disabled() || (k.disabled ?? !1)), G = g(() => w.name() ?? k.name), K = g(() => ({
+		...w.state(),
+		disabled: W()
+	})), q = g(() => r(m.class, K())), J = e(m, () => K(), (e) => (() => {
+		var t = ne(C);
+		return p(t, e, !1), f(), t;
+	})()), Y = g(() => i(m.style, K())), X = g(() => t(K(), s)), Z = () => {
+		if (k.value !== void 0) return P();
+		let e = B();
+		return T(e) ? e.value : k.defaultValue;
+	}, Q = {
+		id: z,
+		name: void 0,
+		value: Z,
+		getValue: () => {
+			let e = B();
+			return T(e) ? e.value : Z();
+		},
+		getControl: () => B() ?? null
+	}, re = o(() => k.onInput), ie = o(() => k.onFocus), ae = o(() => k.onBlur), oe = o(() => k.onKeyDown);
+	function $(e) {
+		if (V(e), M || !T(e)) return;
+		M = !0;
+		let t = S(() => k.defaultValue);
+		if (S(() => k.value) === void 0 && t !== void 0 && !Array.isArray(t)) {
+			let n = String(t);
+			"defaultValue" in e && (e.defaultValue = n), e.value = n;
+		}
+	}
+	function se(e) {
+		if (re.call(e.currentTarget, e), e.baseUIHandlerPrevented) return;
+		let t = E(e.currentTarget), r = a(n, e);
+		if (k.onValueChange?.(t, r), N) {
+			let t = e.currentTarget;
+			queueMicrotask(() => {
+				!L && T(t) && (t.value = P() ?? "");
+			});
+			return;
+		}
+		w.setDirty(t !== (w.validityData().initialValue ?? "")), w.setFilled(t !== ""), !e.defaultPrevented && !r.isCanceled && (D.clearError(G()), w.validation.change(t));
+	}
+	function ce(e) {
+		ie.call(e.currentTarget, e), !e.baseUIHandlerPrevented && w.setFocused(!0);
+	}
+	function le(e) {
+		if (ae.call(e.currentTarget, e), !e.baseUIHandlerPrevented && (w.setTouched(!0), w.setFocused(!1), w.validationMode() === "onBlur")) {
+			let t = E(e.currentTarget);
+			w.validation.commit(t), N && queueMicrotask(() => {
+				if (L) return;
+				let e = P();
+				e !== void 0 && e !== t && e !== (w.validityData().initialValue ?? "") && w.validation.commit(e);
+			});
+		}
+	}
+	function ue(e) {
+		if (oe.call(e.currentTarget, e), !e.baseUIHandlerPrevented && e.currentTarget.tagName === "INPUT" && e.key === "Enter") {
+			w.setTouched(!0);
+			let t = e.currentTarget;
+			if (t.form && t.form === D.formElement() && !e.defaultPrevented) {
+				let e = D.submitCount();
+				clearTimeout(I), I = setTimeout(() => {
+					D.submitCount() === e && w.validation.commit(t.value);
+				}, 0);
+			} else w.validation.commit(t.value);
+		}
+	}
+	return h(() => ({
+		id: U(),
+		name: k.name,
+		disabled: W(),
+		element: B()
+	}), (e) => {
+		Q.id = e.id, Q.name = e.name, w.registerFieldControl(j, e.disabled || !e.element ? void 0 : Q);
+	}), h(() => B(), (e) => {
+		if (T(e)) return w.validation.registerInput(j, e, () => S(() => B() ?? null));
+	}), h(P, (e) => S(() => {
+		e !== void 0 && (w.setFilled(e !== ""), e !== F && (F = e, D.clearError(G()), w.setDirty(e !== (w.validityData().initialValue ?? "")), w.validation.change(e)));
+	})), x(() => {
+		let e = B();
+		T(e) && w.setFilled(e.value !== ""), k.autofocus && e?.ownerDocument.activeElement === e && w.setFocused(!0);
+	}), b(() => {
+		L = !0, clearTimeout(I), w.registerFieldControl(j, void 0);
+	}), te(J, d({
+		ref: [$, k.ref],
+		get id() {
+			return U();
+		},
+		get class() {
+			return q();
+		},
+		get style() {
+			return Y();
+		},
+		get name() {
+			return G();
+		},
+		get disabled() {
+			return W();
+		}
+	}, () => k.value === void 0 ? { defaultValue: k.defaultValue } : { value: k.value }, {
+		get autofocus() {
+			return k.autofocus;
+		},
+		get "aria-labelledby"() {
+			return k["aria-labelledby"] ?? O.labelId();
+		},
+		get "aria-describedby"() {
+			return O.getAriaDescribedBy(k["aria-describedby"]);
+		},
+		get "aria-invalid"() {
+			return K().valid === !1 && !W() ? "true" : void 0;
+		},
+		onInput: se,
+		onFocus: ce,
+		onBlur: le,
+		onKeyDown: ue
+	}, X, H));
+}
+function T(e) {
+	return !!(e && (e.tagName === "INPUT" || e.tagName === "SELECT" || e.tagName === "TEXTAREA"));
+}
+function E(e) {
+	return "value" in e ? String(e.value) : "";
+}
+//#endregion
+export { w as t };

package/dist/lib/client/{FocusManager-grSdNHqW.js → FocusManager-NP1uPXTi.js}

@@ -2,7 +2,7 @@ import { u as e } from "./reasons-Co5CzjKq.js";
 import { createChangeEventDetails as t } from "./internals/createBaseUIEventDetails.js";
 import { c as n, d as r, f as i, i as a, n as o, o as s, p as c, r as l, t as u, u as d } from "./dom-BEAeQ9Eb.js";
 import { a as f, o as p } from "./FloatingTree-23B7KKPD.js";
-import { c as m, g as h, h as g, l as _, m as v, p as y, s as b, u as x } from "./popupStateMapping-C9eZl19i.js";
+import { c as m, g as h, h as g, l as _, m as v, p as y, s as b, u as x } from "./popupStateMapping-C6jQ_LKo.js";
 import { applyRef as ee, createComponent as S, memo as C } from "@solidjs/web";
 import { Show as w, createEffect as T, createMemo as E, untrack as D } from "solid-js";
 //#region src/internals/overlay/markOthers.ts
@@ -324,11 +324,11 @@ function K(d) {
 				return S(h, {
 					"data-type": "inside",
 					ref: [m?.setBeforeInside, d.beforeContentGuardRef],
-					onFocus: (n) => {
+					onFocus: (e) => {
 						if (K()) {
 							let e = Z();
 							G(e[e.length - 1]);
-						} else m?.portalNode() && (O = !1, y(n, m.portalNode()) ? _(L())?.focus() : (U(d.previousFocusableElement) ?? m.beforeOutside())?.focus(), J() && d.context.setOpen(!1, t(e, n)));
+						} else m?.portalNode() && (O = !1, y(e, m.portalNode()) ? _(L())?.focus() : (U(d.previousFocusableElement) ?? m.beforeOutside())?.focus());
 					}
 				});
 			}
@@ -345,8 +345,8 @@ function K(d) {
 						var t = m?.setAfterInside;
 						typeof t == "function" || Array.isArray(t) ? ee(t, e) : m && (m.setAfterInside = e);
 					},
-					onFocus: (n) => {
-						K() ? G(Z()[0]) : m?.portalNode() && (J() && (O = !0), y(n, m.portalNode()) ? x(L())?.focus() : (U(d.nextFocusableElement) ?? m.afterOutside())?.focus(), J() && d.context.setOpen(!1, t(e, n)));
+					onFocus: (e) => {
+						K() ? G(Z()[0]) : m?.portalNode() && (J() && (O = !0), y(e, m.portalNode()) ? x(L())?.focus() : (U(d.nextFocusableElement) ?? m.afterOutside())?.focus());
 					}
 				});
 			}

package/dist/lib/client/{FormContext-BB05lWOI.js → FormContext-CwLBtm_d.js}

@@ -4,6 +4,7 @@ var n = Object.freeze({}), r = e({
 	errors: () => n,
 	validationMode: () => "onSubmit",
 	submitAttempted: () => !1,
+	submitCount: () => 0,
 	formElement: () => null,
 	clearError: () => void 0,
 	registerField: () => () => void 0,

package/dist/lib/client/{LabelableContext-DKsB0fIx.js → LabelableContext-CmQF-TX2.js}

@@ -15,13 +15,9 @@ function o() {
 function s(e = {}) {
 	let r = `base-ui-${n()}`, [a, o] = t(e.controlId === void 0 ? r : e.controlId), [s, c] = t(e.labelId), [l, u] = t(i), d = /* @__PURE__ */ new Map(), f = /* @__PURE__ */ new Map();
 	function p(e, t) {
-		if (t === void 0) {
-			d.delete(e);
-			return;
-		}
-		d.set(e, t), o((e) => {
+		t === void 0 ? d.delete(e) : d.set(e, t), o((e) => {
 			for (let t of d.values()) if (t === e) return e;
-			return d.values().next().value ?? r;
+			return d.size ? d.values().next().value : r;
 		});
 	}
 	function m(e) {
@@ -35,6 +31,7 @@ function s(e = {}) {
 		return n.push(...e.parent?.messageIds() ?? i, ...l()), Array.from(new Set(n)).join(" ") || void 0;
 	}
 	return {
+		defaultControlId: r,
 		controlId: a,
 		labelId: s,
 		messageIds: l,