solid-baseui 0.1.0-alpha.0

package/dist/lib/client/toolbar-Du22aKCv.js

@@ -0,0 +1,492 @@
+import { t as e } from "./rolldown-runtime-Dy4uBu1J.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 "./setRef-fXF6OIo3.js";
+import { n as o } from "./DirectionContext-BwMabICS.js";
+import { n as s, t as c } from "./ToolbarRootContext-88yZoAOy.js";
+import { t as l } from "./withoutComponentBinding-CcCW7fSc.js";
+import { n as u, t as d } from "./ToolbarGroupContext-Dpc3_mFx.js";
+import { t as f } from "./ToolbarItemOwnerContext-DtVqVnSE.js";
+import { Dynamic as p, createComponent as m, delegateEvents as h, dynamic as g, memo as _, mergeProps as v } from "@solidjs/web";
+import { createEffect as y, createMemo as b, createSignal as x, omit as S, onCleanup as C, onSettled as w, untrack as T } from "solid-js";
+//#region src/toolbar/root/ToolbarRoot.tsx
+function E(e) {
+	let a = o(), s = e, u = e, [d, f] = x(), [h, g] = x(), [_, C] = x(0), w = /* @__PURE__ */ new Map(), T = 0, E = !1, M = S(u, "as", "class", "disabled", "loopFocus", "onFocus", "onFocusIn", "onKeyDown", "orientation", "ref", "style"), N = b(() => s.disabled ?? !1), P = b(() => s.orientation ?? "horizontal"), F = b(() => ({
+		disabled: N(),
+		orientation: P()
+	})), I = b(() => n(e.class, F())), L = b(() => r(e.style, F())), R = b(() => t(F()));
+	function z() {
+		E || (E = !0, queueMicrotask(() => {
+			E = !1, C((e) => e + 1);
+		}));
+	}
+	function B(e) {
+		return e.order = T, T += 1, w.set(e.token, e), z(), () => {
+			w.delete(e.token), z();
+		};
+	}
+	function V() {
+		let e = Array.from(w.values()).sort(D), t = /* @__PURE__ */ new Set();
+		return e.filter((e) => {
+			let n = e.element();
+			return !n || t.has(n) ? !1 : (t.add(n), !0);
+		});
+	}
+	function H() {
+		return V().filter(O);
+	}
+	function U(e) {
+		_();
+		let t = H(), n = t.find((e) => e.token === h());
+		return O(e) && (n ?? t[0])?.token === e.token;
+	}
+	function W(e) {
+		O(e) && g(e.token);
+	}
+	function G(e) {
+		let t = e.composedPath(), n = t[0];
+		return V().find((e) => {
+			let r = e.element();
+			return r && (t.includes(r) || n instanceof Node && r.contains(n));
+		});
+	}
+	function K(e) {
+		let t = G(e);
+		t && W(t);
+		let n = e.composedPath()[0];
+		k(n) && queueMicrotask(() => n.setSelectionRange(0, n.value.length));
+	}
+	function q(e) {
+		if (e.shiftKey || e.ctrlKey || e.altKey || e.metaKey) return;
+		let t = a() === "rtl" ? "ArrowLeft" : "ArrowRight", n = a() === "rtl" ? "ArrowRight" : "ArrowLeft", r = P() === "vertical" ? "ArrowDown" : t, i = P() === "vertical" ? "ArrowUp" : n;
+		if (e.key !== r && e.key !== i) return;
+		let o = e.composedPath()[0];
+		if (k(o) && !A(o)) {
+			let t = o.selectionStart, n = o.selectionEnd;
+			if (t == null || e.shiftKey || t !== n || e.key !== i && t < o.value.length || e.key !== r && t > 0) return;
+		}
+		_();
+		let c = H();
+		if (c.length === 0) return;
+		let l = G(e), u = c.findIndex((e) => e.token === (l?.token ?? h())), f = e.key === r ? 1 : -1, p = u === -1 ? f > 0 ? 0 : c.length - 1 : u + f;
+		if (p < 0 || p >= c.length) {
+			if (!(s.loopFocus ?? !0)) return;
+			p = (p + c.length) % c.length;
+		}
+		let m = c[p];
+		!m || m.token === l?.token || (e.preventDefault(), e.stopPropagation(), W(m), j(d(), m.element(), a(), P()), queueMicrotask(() => m.element()?.focus()));
+	}
+	let J = i(() => s.onFocusIn, () => K), Y = i(() => s.onKeyDown, () => q);
+	function X(e) {
+		Reflect.deleteProperty(e, "baseUIHandlerPrevented"), Reflect.apply(Y, e.currentTarget, [e]);
+	}
+	let Z = {
+		disabled: N,
+		orientation: P,
+		isTabStop: U,
+		notifyItemChange: z,
+		registerItem: B,
+		setActiveItem: W
+	};
+	return y(d, (e) => {
+		let t = e?.ownerDocument.defaultView?.MutationObserver;
+		if (!e || !t) return;
+		let n = new t(z);
+		return n.observe(e, {
+			attributes: !0,
+			childList: !0,
+			subtree: !0,
+			attributeFilter: [
+				"class",
+				"disabled",
+				"hidden",
+				"style"
+			]
+		}), () => n.disconnect();
+	}), m(c, {
+		value: Z,
+		get children() {
+			return m(p, v({
+				get component() {
+					return l(e.as ?? "div");
+				},
+				ref: [((e) => f(e)), s.ref],
+				get class() {
+					return I();
+				},
+				get style() {
+					return L();
+				},
+				role: "toolbar",
+				get "aria-orientation"() {
+					return P();
+				},
+				get onFocus() {
+					return s.onFocus;
+				},
+				onFocusIn: J,
+				onKeyDown: X
+			}, R, M));
+		}
+	});
+}
+function D(e, t) {
+	let n = e.element(), r = t.element();
+	if (n && r && n !== r) {
+		let e = n.compareDocumentPosition(r);
+		if ((e & Node.DOCUMENT_POSITION_DISCONNECTED) === 0) {
+			if (e & Node.DOCUMENT_POSITION_FOLLOWING) return -1;
+			if (e & Node.DOCUMENT_POSITION_PRECEDING) return 1;
+		}
+	}
+	return e.order - t.order;
+}
+function O(e) {
+	let t = e.element();
+	if (!t?.isConnected || e.disabled() && !e.focusableWhenDisabled() || t.matches(":disabled")) return !1;
+	let n = t.ownerDocument.defaultView?.getComputedStyle(t);
+	return !n || n.display === "none" || n.display === "contents" || n.visibility === "hidden" || n.visibility === "collapse" ? !1 : typeof t.checkVisibility != "function" || t.checkVisibility();
+}
+function k(e) {
+	if (!e || typeof e != "object" || !("tagName" in e)) return !1;
+	let t = e;
+	return t.tagName === "TEXTAREA" || t.tagName === "INPUT" && t.selectionStart != null;
+}
+function A(e) {
+	return e.matches(":disabled") || e.getAttribute("aria-disabled") === "true";
+}
+function j(e, t, n, r) {
+	if (!e || !t || typeof e.scrollTo != "function") return;
+	let i = e.scrollLeft, a = e.scrollTop, o = N(e), s = N(t);
+	if (r === "horizontal" && e.clientWidth < e.scrollWidth) {
+		let n = M(e, t, "left");
+		n - s.scrollMarginLeft < e.scrollLeft + o.scrollPaddingLeft ? i = n - s.scrollMarginLeft - o.scrollPaddingLeft : n + t.offsetWidth + s.scrollMarginRight > e.scrollLeft + e.clientWidth - o.scrollPaddingRight && (i = n + t.offsetWidth + s.scrollMarginRight - e.clientWidth + o.scrollPaddingRight);
+	}
+	if (r === "vertical" && e.scrollHeight > e.clientHeight) {
+		let n = M(e, t, "top");
+		n - s.scrollMarginTop < e.scrollTop + o.scrollPaddingTop ? a = n - s.scrollMarginTop - o.scrollPaddingTop : n + t.offsetHeight + s.scrollMarginBottom > e.scrollTop + e.clientHeight - o.scrollPaddingBottom && (a = n + t.offsetHeight + s.scrollMarginBottom - e.clientHeight + o.scrollPaddingBottom);
+	}
+	e.scrollTo({
+		behavior: "auto",
+		left: i,
+		top: a
+	});
+}
+function M(e, t, n) {
+	let r = n === "left" ? "offsetLeft" : "offsetTop", i = t, a = 0;
+	for (; i.offsetParent && (a += i[r], i.offsetParent !== e);) i = i.offsetParent;
+	return a;
+}
+function N(e) {
+	let t = e.ownerDocument.defaultView?.getComputedStyle(e);
+	return {
+		scrollMarginTop: Number.parseFloat(t?.scrollMarginTop ?? "") || 0,
+		scrollMarginRight: Number.parseFloat(t?.scrollMarginRight ?? "") || 0,
+		scrollMarginBottom: Number.parseFloat(t?.scrollMarginBottom ?? "") || 0,
+		scrollMarginLeft: Number.parseFloat(t?.scrollMarginLeft ?? "") || 0,
+		scrollPaddingTop: Number.parseFloat(t?.scrollPaddingTop ?? "") || 0,
+		scrollPaddingRight: Number.parseFloat(t?.scrollPaddingRight ?? "") || 0,
+		scrollPaddingBottom: Number.parseFloat(t?.scrollPaddingBottom ?? "") || 0,
+		scrollPaddingLeft: Number.parseFloat(t?.scrollPaddingLeft ?? "") || 0
+	};
+}
+//#endregion
+//#region src/toolbar/group/ToolbarGroup.tsx
+function P(e) {
+	let i = s(), a = e, o = S(e, "as", "class", "disabled", "ref", "style"), c = b(() => i.disabled() || (a.disabled ?? !1)), u = b(() => ({
+		disabled: c(),
+		orientation: i.orientation()
+	})), f = b(() => n(e.class, u())), h = b(() => r(e.style, u())), g = b(() => t(u()));
+	return m(d, {
+		value: { disabled: c },
+		get children() {
+			return m(p, v({
+				get component() {
+					return l(e.as ?? "div");
+				},
+				ref: [a.ref],
+				get class() {
+					return f();
+				},
+				get style() {
+					return h();
+				},
+				role: "group"
+			}, g, o));
+		}
+	});
+}
+//#endregion
+//#region src/internals/installOwnedEventHandlers.ts
+function F(e, t) {
+	let n = /* @__PURE__ */ new WeakSet(), r = /* @__PURE__ */ new WeakSet(), i = [], a = [], o = !0;
+	for (let [a, o] of t) {
+		let t = (t) => {
+			n.add(t), Reflect.apply(o, e, [t]), t.baseUIHandlerPrevented && r.add(t);
+		};
+		e.addEventListener(a, t), i.push([a, t]);
+	}
+	return queueMicrotask(() => {
+		if (o) {
+			for (let [i, o] of t) {
+				let t = `$$${i}`, s = `${t}Data`, c = e, l = c[t], u = c[s], d = (t) => {
+					n.has(t) || (n.add(t), Reflect.apply(o, e, [t]), t.baseUIHandlerPrevented && r.add(t)), !(r.has(t) || typeof l != "function") && (u === void 0 ? Reflect.apply(l, e, [t]) : Reflect.apply(l, e, [u, t]));
+				};
+				Object.defineProperty(c, t, {
+					configurable: !0,
+					enumerable: !0,
+					get: () => d,
+					set: (e) => {
+						l = e;
+					}
+				}), Object.defineProperty(c, s, {
+					configurable: !0,
+					enumerable: !0,
+					get: () => void 0,
+					set: (e) => {
+						u = e;
+					}
+				}), a.push(() => {
+					Reflect.deleteProperty(c, t), Reflect.deleteProperty(c, s), c[t] = l, c[s] = u;
+				});
+			}
+			h(t.map(([e]) => e));
+		}
+	}), () => {
+		o = !1;
+		for (let [t, n] of i) e.removeEventListener(t, n);
+		for (let e of a) e();
+	};
+}
+//#endregion
+//#region src/toolbar/createToolbarItem.ts
+function I(e) {
+	let t = s(), [n, r] = x(), i = {
+		token: Symbol("ToolbarItem"),
+		order: 0,
+		element: n,
+		disabled: e.disabled,
+		focusableWhenDisabled: e.focusableWhenDisabled
+	}, a = t.registerItem(i);
+	return y(() => ({
+		disabled: e.disabled(),
+		element: n(),
+		focusableWhenDisabled: e.focusableWhenDisabled()
+	}), () => t.notifyItemChange()), C(a), {
+		element: n,
+		registration: i,
+		root: t,
+		setElement: r,
+		tabIndex: () => t.isTabStop(i) ? 0 : -1
+	};
+}
+//#endregion
+//#region src/toolbar/button/ToolbarButton.tsx
+function L(e) {
+	let o = s(), c = u(), d = g(() => l(e.as ?? "button")), p = e, h = e, [E, D] = x(!1), O = b(() => o.disabled() || (c?.disabled() ?? !1) || (p.disabled ?? !1)), k = b(() => O() || E()), A = b(() => E() && !O() ? !1 : p.focusableWhenDisabled ?? !0), j = b(() => p.nativeButton ?? !0), M = I({
+		disabled: k,
+		focusableWhenDisabled: A
+	}), N = S(h, "as", "class", "disabled", "focusableWhenDisabled", "nativeButton", "onClick", "onFocus", "onKeyDown", "onKeyUp", "onMouseDown", "onPointerDown", "ref", "style"), P = b(() => ({
+		disabled: k(),
+		focusable: A(),
+		orientation: o.orientation()
+	})), L = b(() => n(e.class, P())), H = b(() => r(e.style, P())), U = b(() => t(P())), W, G = b(() => j() && k() && !A()), K = b(() => j() && A() ? k() ? "true" : "false" : !j() && k() ? "true" : void 0);
+	function q() {
+		M.root.setActiveItem(M.registration);
+	}
+	function J(t) {
+		if (t.target !== t.currentTarget) return;
+		let n = t.key === " ", r = t.key === "Enter", i = t.currentTarget.tagName === "BUTTON", a = t.currentTarget.tagName === "A" && !!t.currentTarget.href, o = t.currentTarget.getAttribute("role"), s = o?.startsWith("menuitem") || o === "option" || o === "gridcell";
+		if (n) {
+			if (t.defaultPrevented && s) return;
+			t.preventDefault(), (!j() || i || typeof e.as == "function") && (t.preventBaseUIHandler(), V(t.currentTarget, t));
+			return;
+		}
+		!j() && !a && r && !t.defaultPrevented && (t.preventDefault(), t.preventBaseUIHandler(), V(t.currentTarget, t));
+	}
+	function Y(t) {
+		t.target === t.currentTarget && t.key === " " && (!j() || t.currentTarget.tagName === "BUTTON" || typeof e.as == "function") && (t.preventDefault(), t.preventBaseUIHandler());
+	}
+	let X = i(() => T(() => k() ? R : void 0), () => p.onClick), Z = i(() => p.onFocus, () => q), Q = i(() => T(() => k() ? B : void 0), () => T(() => k() ? void 0 : p.onKeyDown), () => T(() => k() ? void 0 : J)), $ = i(() => T(() => k() ? z : void 0), () => T(() => k() ? void 0 : p.onKeyUp), () => T(() => k() ? void 0 : Y)), ee = i(() => T(() => k() ? z : void 0), () => T(() => k() ? void 0 : p.onMouseDown)), te = i(() => T(() => k() ? R : void 0), () => p.onPointerDown);
+	w(() => {
+		M.element();
+	});
+	function ne(e) {
+		W?.(), M.setElement(e), W = F(e, [
+			["click", X],
+			["focus", Z],
+			["keydown", Q],
+			["keyup", $],
+			["mousedown", ee],
+			["pointerdown", te]
+		]), a(p.ref, e);
+	}
+	return y(() => ({
+		disabled: k(),
+		element: M.element(),
+		focusableWhenDisabled: A()
+	}), (e) => {
+		e.disabled && e.focusableWhenDisabled && e.element && e.element.removeAttribute("disabled");
+	}), C(() => W?.()), m(f, {
+		value: {
+			disabled: k,
+			focusableWhenDisabled: A,
+			setChildDisabled: D
+		},
+		get children() {
+			return m(d, v({
+				ref: (e) => {
+					ne(e);
+				},
+				get class() {
+					return L();
+				},
+				get style() {
+					return H();
+				},
+				get type() {
+					return j() ? "button" : void 0;
+				}
+			}, () => j() ? {} : { role: "button" }, {
+				get tabIndex() {
+					return M.tabIndex();
+				},
+				get disabled() {
+					return _(() => typeof e.as == "function")() ? k() : G();
+				},
+				get "aria-disabled"() {
+					return K();
+				}
+			}, U, N));
+		}
+	});
+}
+function R(e) {
+	e.preventDefault(), e.preventBaseUIHandler();
+}
+function z(e) {
+	e.preventBaseUIHandler();
+}
+function B(e) {
+	e.key !== "Tab" && (e.preventDefault(), e.preventBaseUIHandler());
+}
+function V(e, t) {
+	let n = e.ownerDocument.defaultView;
+	n && e.dispatchEvent(new n.MouseEvent("click", {
+		bubbles: !0,
+		cancelable: !0,
+		composed: !0,
+		detail: 0,
+		shiftKey: t.shiftKey,
+		ctrlKey: t.ctrlKey,
+		altKey: t.altKey,
+		metaKey: t.metaKey
+	}));
+}
+//#endregion
+//#region src/toolbar/link/ToolbarLink.tsx
+var H = () => !1, U = () => !0;
+function W(e) {
+	let o = s(), c = e, u = e, d = I({
+		disabled: H,
+		focusableWhenDisabled: U
+	}), f = S(u, "as", "class", "onFocus", "ref", "style"), h = b(() => ({ orientation: o.orientation() })), g = b(() => n(e.class, h())), _ = b(() => r(e.style, h())), y = b(() => t(h())), x = i(() => c.onFocus, () => () => d.root.setActiveItem(d.registration));
+	return m(p, v({
+		get component() {
+			return l(e.as ?? "a");
+		},
+		ref: (e) => {
+			d.setElement(e), a(c.ref, e);
+		},
+		get class() {
+			return g();
+		},
+		get style() {
+			return _();
+		},
+		get tabIndex() {
+			return d.tabIndex();
+		},
+		onFocus: x
+	}, y, f));
+}
+//#endregion
+//#region src/toolbar/input/ToolbarInput.tsx
+function G(e) {
+	let o = s(), c = u(), d = g(() => l(e.as ?? "input")), f = e, p = e, h = b(() => o.disabled() || (c?.disabled() ?? !1) || (f.disabled ?? !1)), _ = b(() => f.focusableWhenDisabled ?? !0), y = I({
+		disabled: h,
+		focusableWhenDisabled: _
+	}), x = S(p, "as", "class", "disabled", "focusableWhenDisabled", "onClick", "onFocus", "onKeyDown", "onPointerDown", "ref", "style"), w = b(() => ({
+		disabled: h(),
+		focusable: _(),
+		orientation: o.orientation()
+	})), E = b(() => n(e.class, w())), D = b(() => r(e.style, w())), O = b(() => t(w())), k;
+	function A() {
+		y.root.setActiveItem(y.registration);
+	}
+	let j = i(() => f.onClick, () => T(() => h() ? K : void 0)), M = i(() => f.onFocus, () => A), N = i(() => T(() => h() ? q : void 0), () => f.onKeyDown), P = i(() => f.onPointerDown, () => T(() => h() ? K : void 0));
+	function L(e) {
+		k?.(), y.setElement(e), k = F(e, [
+			["click", j],
+			["focus", M],
+			["keydown", N],
+			["pointerdown", P]
+		]), a(f.ref, e);
+	}
+	return C(() => k?.()), m(d, v({
+		ref: (e) => {
+			L(e);
+		},
+		get class() {
+			return E();
+		},
+		get style() {
+			return D();
+		},
+		get tabIndex() {
+			return y.tabIndex();
+		},
+		get "aria-disabled"() {
+			return h() ? "true" : void 0;
+		}
+	}, O, x));
+}
+function K(e) {
+	e.preventDefault();
+}
+function q(e) {
+	e.key !== "Tab" && e.preventDefault();
+}
+//#endregion
+//#region src/toolbar/separator/ToolbarSeparator.tsx
+function J(e) {
+	let i = s(), a = S(e, "as", "class", "orientation", "style"), o = b(() => e.orientation ?? (i.orientation() === "vertical" ? "horizontal" : "vertical")), c = b(() => ({ orientation: o() })), u = b(() => n(e.class, c())), d = b(() => r(e.style, c())), f = b(() => t(c()));
+	return m(p, v({
+		get component() {
+			return l(e.as ?? "div");
+		},
+		get class() {
+			return u();
+		},
+		get style() {
+			return d();
+		},
+		role: "separator",
+		get "aria-orientation"() {
+			return o();
+		}
+	}, f, a));
+}
+//#endregion
+//#region src/toolbar/index.parts.ts
+var Y = /* @__PURE__ */ e({
+	Button: () => L,
+	Group: () => P,
+	Input: () => G,
+	Link: () => W,
+	Root: () => E,
+	Separator: () => J
+});
+//#endregion
+export { Y as t };

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

@@ -0,0 +1,2 @@
+import { t as e } from "../tooltip-CyK61fl1.js";
+export { e as Tooltip };