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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "solid-baseui",
-  "version": "0.1.0-alpha.0",
+  "version": "0.1.0-alpha.2",
   "description": "A native Solid 2 port of Base UI. Alpha: unannounced and unstable.",
   "type": "module",
   "module": "./dist/lib/client/index.js",
@@ -17,7 +17,8 @@
   "sideEffects": false,
   "files": [
     "dist/lib",
-    "README.md"
+    "README.md",
+    "CHANGELOG.md"
   ],
   "exports": {
     ".": {
@@ -389,6 +390,15 @@
       "import": "./dist/lib/client/toggle-group/index.js",
       "default": "./dist/lib/client/toggle-group/index.js"
     },
+    "./use-render": {
+      "types": "./dist/lib/types/use-render/index.d.ts",
+      "worker": "./dist/lib/server/use-render/index.js",
+      "deno": "./dist/lib/server/use-render/index.js",
+      "browser": "./dist/lib/client/use-render/index.js",
+      "node": "./dist/lib/server/use-render/index.js",
+      "import": "./dist/lib/client/use-render/index.js",
+      "default": "./dist/lib/client/use-render/index.js"
+    },
     "./types": {
       "types": "./dist/lib/types/types/index.d.ts",
       "default": "./dist/lib/client/types/index.js"
@@ -508,6 +518,8 @@
     "./package.json": "./package.json"
   },
   "scripts": {
+    "bench": "bun benchmarks/run.mjs",
+    "bench:typecheck": "tsc -p benchmarks/solid-baseui/tsconfig.json && tsc -p benchmarks/kobalte/tsconfig.json && tsc -p benchmarks/react/tsconfig.json",
     "start": "vite",
     "dev": "vite",
     "build": "bun run build:lib && bun run build:preview",
@@ -542,14 +554,15 @@
   ],
   "license": "MIT",
   "publishConfig": {
-    "access": "public"
+    "access": "public",
+    "tag": "alpha"
   },
   "devDependencies": {
     "@solidjs/meta": "^1.0.0-next.2",
-    "@solidjs/router": "^2.0.0-next.16",
-    "@solidjs/testing-library": "1.0.0-beta.2",
-    "@solidjs/vite-plugin": "^3.0.0-next.29",
-    "@solidjs/web": "^2.0.0-rc.0",
+    "@solidjs/router": "2.0.0-next.17",
+    "@solidjs/testing-library": "1.0.0-beta.3",
+    "@solidjs/vite-plugin": "3.0.0-next.38",
+    "@solidjs/web": "2.0.0-rc.6",
     "@testing-library/jest-dom": "^6.6.3",
     "@types/node": "^26.2.0",
     "@vitest/browser-playwright": "4.1.10",
@@ -558,15 +571,15 @@
     "jsdom": "^25.0.1",
     "oxlint": "~1.79.0",
     "playwright": "1.62.1",
-    "solid-js": "^2.0.0-rc.0",
+    "solid-js": "2.0.0-rc.6",
     "typescript": "^5.9.2",
     "vite": "^8.1.5",
     "vitest": "4.1.10",
     "zod": "4.4.3"
   },
   "peerDependencies": {
-    "@solidjs/web": "^2.0.0-rc.0",
-    "solid-js": "^2.0.0-rc.0"
+    "@solidjs/web": "^2.0.0-rc.6",
+    "solid-js": "^2.0.0-rc.6"
   },
   "dependencies": {
     "@floating-ui/dom": "1.8.0",
@@ -577,7 +590,7 @@
     "packageManager": {
       "name": "bun",
       "version": "1.4.0",
-      "onFail": "download"
+      "onFail": "warn"
     }
   }
 }

package/dist/lib/client/DialogHandle-DrN2YWCv.js

@@ -1,518 +0,0 @@
-import { getStateAttributesProps as e } from "./internals/getStateAttributesProps.js";
-import { P as t, d as n, i 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 { a as l, n as u, r as d } from "./dom-BEAeQ9Eb.js";
-import { n as f, t as p } from "./InternalBackdrop-cSK13gaM.js";
-import { c as m, i as ee, n as te, r as h, s as g, t as _ } from "./FloatingTree-23B7KKPD.js";
-import { a as ne, n as re, o as ie, t as v } from "./PopupStore-DjB-wO88.js";
-import { a as ae, o as y } from "./popupStateMapping-C9eZl19i.js";
-import { i as b, n as x, r as S, t as C } from "./PopupHandle-CcJG4NMy.js";
-import { a as w, i as T, n as oe, r as E, t as se } from "./buttonSemantics-paljfpOX.js";
-import { t as D } from "./setRef-fXF6OIo3.js";
-import { Dynamic as O, createComponent as k, memo as A, mergeProps as j } from "@solidjs/web";
-import { $REFRESH as ce, Show as M, createContext as N, createEffect as P, createMemo as F, createSignal as I, createUniqueId as L, omit as R, onCleanup as z, untrack as B, useContext as V } from "solid-js";
-//#region src/dialog/store/DialogStore.ts
-var le = class extends v {
-	openMethodAccessor;
-	setOpenMethodSignal;
-	openMethodRevisionAccessor;
-	setOpenMethodRevision;
-	constructor(e = {}) {
-		super(e);
-		let [t, n] = I(null, { ownedWrite: !0 });
-		this.openMethodAccessor = t, this.setOpenMethodSignal = n;
-		let [r, i] = I(0, { ownedWrite: !0 });
-		this.openMethodRevisionAccessor = r, this.setOpenMethodRevision = i;
-	}
-	openMethod() {
-		return this.openMethodAccessor();
-	}
-	setOpenMethod(e) {
-		this.setOpenMethodSignal(e), this.setOpenMethodRevision((e) => e + 1);
-	}
-	openMethodRevision() {
-		return this.openMethodRevisionAccessor();
-	}
-	setPayload(e) {
-		this.set("payload", e);
-	}
-	setOpen(e, t) {
-		return !e && t.trigger == null && this.activeTriggerId() != null && (t.trigger = this.state.activeTriggerElement ?? void 0), super.setOpen(e, t);
-	}
-}, H = class extends x {
-	openMethod() {
-		return null;
-	}
-	setOpenMethod(e) {}
-	setPayload(e) {}
-}, U = Symbol("DialogRootContext"), ue = N(U);
-function W(e = !1) {
-	let t = V(ue);
-	if (t === U) {
-		if (e) return;
-		throw Error("Base UI: DialogRootContext is missing. Dialog parts must be placed within <Dialog.Root>.");
-	}
-	return t;
-}
-//#endregion
-//#region src/dialog/root/DialogRoot.tsx
-function G(e) {
-	return K("dialog", e);
-}
-function K(e, t, r = {}) {
-	let i = W(!0), a = m(), s = g(), c = a ?? new h(), p = L(), re = L(), v = B(() => t.open !== void 0), ae = B(() => t.triggerId !== void 0), y = i !== void 0, b = e === "alert-dialog", x = e === "drawer", C = F(() => b ? !0 : t.modal ?? !0), w = F(() => b || (t.disablePointerDismissal ?? !1)), T = new le({
-		controlledOpen: () => v ? t.open : void 0,
-		controlledTriggerId: () => ae ? t.triggerId : void 0,
-		floatingId: re,
-		nested: s !== null,
-		nodeId: p,
-		onOpenChange: () => t.onOpenChange,
-		onOpenChangeComplete: () => t.onOpenChangeComplete
-	});
-	T.update({
-		open: v ? !!B(() => t.open) : !!B(() => t.defaultOpen),
-		activeTriggerId: B(() => t.defaultTriggerId ?? null)
-	});
-	let oe = T.access((e) => e.payload), E = ee({
-		tree: c,
-		id: p,
-		parentId: s,
-		context: () => T.context.floatingRoot
-	}), [se, D] = I(), [O, j] = I(), [M, N] = I(null, { ownedWrite: !0 }), [R, V] = I(null, { ownedWrite: !0 }), [H, U] = I(null, { ownedWrite: !0 }), [G, K] = I(0, {
-		equals: !1,
-		ownedWrite: !0
-	}), q = /* @__PURE__ */ new Map(), J = F(() => {
-		G();
-		let e = 0;
-		for (let t of q.values()) e += t.dialogCount;
-		return e;
-	}), de = F(() => {
-		G();
-		let e = 0;
-		for (let t of q.values()) e += t.drawerCount;
-		return e;
-	}), fe = { current: !0 }, Y = ne(T, () => T.track().popupElement, { onUnmount: () => T.setOpenMethod(null) });
-	function pe(e, t, n) {
-		let r = q.get(e);
-		(r?.dialogCount !== t || r.drawerCount !== n) && (q.set(e, {
-			dialogCount: t,
-			drawerCount: n
-		}), K((e) => e + 1));
-	}
-	function me(e) {
-		q.delete(e) && K((e) => e + 1);
-	}
-	let he = {
-		store: T,
-		tree: c,
-		nested: y,
-		role: b ? "alertdialog" : "dialog",
-		modal: C,
-		disablePointerDismissal: w,
-		nestedOpenDialogCount: J,
-		nestedOpenDrawerCount: de,
-		outsidePressEnabled: fe,
-		titleId: se,
-		setTitleId: D,
-		descriptionId: O,
-		setDescriptionId: j,
-		backdropElement: M,
-		setBackdropElement: N,
-		internalBackdropElement: R,
-		setInternalBackdropElement: V,
-		viewportElement: H,
-		setViewportElement: U,
-		presence: Y,
-		updateNestedLayer: pe,
-		removeNestedLayer: me
-	};
-	T.context.floatingRoot.context.data.insideElements = () => [
-		M(),
-		R(),
-		H()
-	], T.configureTriggerUnmount({ closeOnActiveTriggerUnmount: !1 }), S(() => t.handle, T);
-	let X = ie({
-		context: T.context.floatingRoot,
-		tree: () => c,
-		escapeKey: () => J() === 0,
-		outsidePress: () => (e) => {
-			if (!fe.current || w() || J() > 0 || "button" in e && e.button !== 0) return !1;
-			if ("touches" in e) {
-				if (e.type === "touchend") {
-					if (e.changedTouches.length !== 1 || e.touches.length !== 0) return !1;
-				} else if (e.touches.length !== 1) return !1;
-			}
-			if (C() === !1) return !0;
-			let t = d(e), n = R(), r = M();
-			return !n && !r || t === n || t === r || l(t) && u(t, T.state.popupElement) && !t.hasAttribute("data-base-ui-portal");
-		},
-		outsidePressEvent: () => R() || M() ? "intentional" : {
-			mouse: C() === "trap-focus" ? "sloppy" : "intentional",
-			touch: "sloppy"
-		}
-	});
-	T.setInteractionProps({
-		activeTriggerProps: { onKeyDown: X.onKeyDown },
-		inactiveTriggerProps: { onKeyDown: X.onKeyDown },
-		popupProps: {}
-	}), f(() => T.open() && C() === !0, () => T.track().popupElement), P(() => ({
-		open: T.open(),
-		activeTriggerId: T.activeTriggerId()
-	}), () => B(() => T.reconcileTriggers()));
-	let Z = B(() => T.open()), Q = B(() => T.openMethodRevision());
-	P(() => ({
-		open: T.open(),
-		openMethodRevision: T.openMethodRevision()
-	}), (e) => {
-		!e.open && Z ? Q = e.openMethodRevision : e.open && !Z && e.openMethodRevision === Q && T.setOpenMethod(null), Z = e.open;
-	});
-	let $ = Symbol("DialogRoot");
-	P(() => ({
-		open: T.open(),
-		nestedDialogs: J(),
-		nestedDrawers: de()
-	}), (e) => {
-		i?.updateNestedLayer($, e.open ? e.nestedDialogs + 1 : 0, e.open ? e.nestedDrawers + +!!x : 0);
-	});
-	let ge = {
-		unmount: Y.forceUnmount,
-		close() {
-			T.setOpen(!1, o(n));
-		}
-	};
-	P(() => t.actionsRef, (e) => {
-		e?.(ge);
-	});
-	function _e() {
-		let e = F(() => t.children), n = B(e), r = n;
-		return typeof n == "function" && (r = n.name === "bound read" && Object.prototype.hasOwnProperty.call(n, ce) ? A(() => e()) : B(() => n({ payload: oe }))), r;
-	}
-	return z(() => {
-		i?.removeNestedLayer($), T.clearInteractionProps(), delete T.context.floatingRoot.context.data.insideElements;
-	}), k(ue, {
-		value: he,
-		get children() {
-			return k(te, {
-				value: c,
-				get children() {
-					return k(_, {
-						get value() {
-							return E.id ?? null;
-						},
-						get children() {
-							return [A(() => r.extraContent?.()), k(_e, {})];
-						}
-					});
-				}
-			});
-		}
-	});
-}
-//#endregion
-//#region src/dialog/utils/mergeDialogStyles.ts
-function q(e, t) {
-	if (typeof t == "string") {
-		let n = Object.entries(e).filter((e) => e[1] != null).map(([e, t]) => `${e}:${String(t)}`).join(";");
-		return n ? `${n};${t}` : t;
-	}
-	return {
-		...e,
-		...t || void 0
-	};
-}
-//#endregion
-//#region src/dialog/utils/stateAttributesMapping.ts
-var J = { "data-open": "" }, de = { "data-closed": "" }, fe = { "data-nested-dialog-open": "" }, Y = {
-	open: (e) => e ? J : de,
-	...s
-}, pe = {
-	...Y,
-	nestedDialogOpen: (e) => e ? fe : null
-};
-//#endregion
-//#region src/dialog/close/DialogClose.tsx
-function me(t) {
-	let n = W(), s = t, l = t, u = F(() => s.disabled ?? !1), d = F(() => s.nativeButton ?? !0), f = F(() => ({ disabled: u() })), p = F(() => i(t.class, f())), m = F(() => a(t.style, f())), ee = F(() => e(f())), te = R(l, "as", "class", "disabled", "nativeButton", "onClick", "onKeyDown", "onKeyUp", "onMouseDown", "onPointerDown", "ref", "style");
-	function h(e) {
-		n.store.open() && n.store.setOpen(!1, o(r, e));
-	}
-	let g = c(() => B(() => u() ? E : void 0), () => s.onClick, () => h), _ = c(() => B(() => u() ? E : void 0), () => s.onPointerDown), ne = c(() => B(() => u() ? w : void 0), () => s.onMouseDown), re = c(() => B(() => u() ? T : void 0), () => s.onKeyDown, () => B(() => d() ? void 0 : se)), ie = c(() => B(() => u() ? w : void 0), () => s.onKeyUp, () => B(() => d() ? void 0 : oe));
-	return k(O, j({
-		get component() {
-			return t.as ?? "button";
-		},
-		ref: [s.ref],
-		get type() {
-			return d() ? "button" : void 0;
-		},
-		get role() {
-			return d() ? void 0 : "button";
-		},
-		get tabIndex() {
-			return !d() && u() ? -1 : 0;
-		},
-		get disabled() {
-			return (A(() => !!d())() ? u() : d()) || void 0;
-		},
-		get "aria-disabled"() {
-			return !d() && u() ? "true" : void 0;
-		},
-		get class() {
-			return p();
-		},
-		get style() {
-			return m();
-		},
-		onClick: g,
-		onKeyDown: re,
-		onKeyUp: ie,
-		onMouseDown: ne,
-		onPointerDown: _
-	}, ee, te));
-}
-//#endregion
-//#region src/dialog/description/DialogDescription.tsx
-function he(e) {
-	let t = W(), n = e, r = e, o = `base-ui-${L()}`, s = F(() => n.id || o), c = {}, l = F(() => i(e.class, c)), u = F(() => a(e.style, c)), d = R(r, "as", "class", "id", "ref", "style");
-	return P(() => s(), (e) => (t.setDescriptionId(e), () => t.setDescriptionId((t) => t === e ? void 0 : t))), k(O, j({
-		get component() {
-			return e.as ?? "p";
-		},
-		ref: [n.ref],
-		get id() {
-			return s();
-		},
-		get class() {
-			return l();
-		},
-		get style() {
-			return u();
-		}
-	}, d));
-}
-//#endregion
-//#region src/dialog/portal/DialogPortalContext.ts
-var X = Symbol("DialogPortalContext"), Z = N(X);
-function Q() {
-	let e = V(Z);
-	if (e === X) throw Error("Base UI: <Dialog.Portal> is missing.");
-	return e;
-}
-//#endregion
-//#region src/dialog/portal/DialogPortal.tsx
-function $(e) {
-	let t = W(), n = e, r = e, o = F(() => n.keepMounted ?? !1), s = F(() => t.presence.mounted() || o()), c = {}, l = F(() => i(e.class, c)), u = F(() => a(e.style, c)), d = R(r, "as", "class", "container", "keepMounted", "ref", "style"), f = { keepMounted: o };
-	function m() {
-		let e = null;
-		return z(() => {
-			t.internalBackdropElement() === e && t.setInternalBackdropElement(null);
-		}), k(p, {
-			ref: (n) => {
-				e = n, t.setInternalBackdropElement(n);
-			},
-			get open() {
-				return t.store.open();
-			}
-		});
-	}
-	return k(M, {
-		get when() {
-			return s();
-		},
-		get children() {
-			return k(Z, {
-				value: f,
-				get children() {
-					return k(y, j({
-						get as() {
-							return e.as;
-						},
-						get container() {
-							return n.container;
-						},
-						ref: (e) => {
-							n.ref && D(n.ref, e);
-						},
-						get class() {
-							return l();
-						},
-						get style() {
-							return u();
-						}
-					}, d, { get children() {
-						return [k(M, {
-							get when() {
-								return A(() => !!t.presence.mounted())() ? t.modal() === !0 : t.presence.mounted();
-							},
-							get children() {
-								return k(m, {});
-							}
-						}), A(() => e.children)];
-					} }));
-				}
-			});
-		}
-	});
-}
-//#endregion
-//#region src/dialog/title/DialogTitle.tsx
-function ge(e) {
-	let t = W(), n = e, r = e, o = `base-ui-${L()}`, s = F(() => n.id || o), c = {}, l = F(() => i(e.class, c)), u = F(() => a(e.style, c)), d = R(r, "as", "class", "id", "ref", "style");
-	return P(() => s(), (e) => (t.setTitleId(e), () => t.setTitleId((t) => t === e ? void 0 : t))), k(O, j({
-		get component() {
-			return e.as ?? "h2";
-		},
-		ref: [n.ref],
-		get id() {
-			return s();
-		},
-		get class() {
-			return l();
-		},
-		get style() {
-			return u();
-		}
-	}, d));
-}
-//#endregion
-//#region src/dialog/trigger/DialogTrigger.tsx
-function _e(n) {
-	let r = W(!0), s = n;
-	if (!r && !B(() => s.handle)) throw Error("Base UI: <Dialog.Trigger> must be used within <Dialog.Root> or provided with a handle.");
-	let l = n, u = `base-ui-${L()}`, d = F(() => s.id || u), f = F(() => s.disabled ?? !1), p = F(() => s.nativeButton ?? !0), [m, ee] = I(null, { ownedWrite: !0 }), te = b(() => s.handle), h = F(() => te() ?? r?.store), g = F(() => {
-		let e = h();
-		return !!(e?.open() && e.activeTriggerId() === d());
-	}), _ = F(() => ({
-		disabled: f(),
-		open: g()
-	})), ne = F(() => i(n.class, _())), ie = F(() => a(n.style, _())), v = F(() => e(_(), ae)), y = R(l, "as", "class", "disabled", "handle", "id", "nativeButton", "onClick", "onKeyDown", "onKeyUp", "onMouseDown", "onPointerDown", "payload", "ref", "style"), x = "", S = "";
-	re(h, d, m, () => ({ payload: s.payload }));
-	function C(e) {
-		let n = h(), r = m();
-		!n || !r || e.button !== 0 || (n.open() || n.setOpenMethod(S || (e.detail === 0 ? "keyboard" : ve() ? "touch" : "mouse")), n.setOpen(!(n.open() && n.activeTriggerId() === d()), o(t, e, r)));
-	}
-	function D() {
-		S = x, x = "";
-	}
-	function ce(e) {
-		x = e.pointerType;
-	}
-	function M(e) {
-		x = "keyboard";
-		let t = h(), n = t?.state.popupElement, r = t ? (t.activeTriggerId() === d() ? t.state.activeTriggerProps : t.state.inactiveTriggerProps).onKeyDown : void 0, i = e.currentTarget;
-		n && i && n.ownerDocument !== i.ownerDocument && typeof r == "function" && r(e);
-	}
-	let N = c(() => B(() => f() ? E : void 0), () => D, () => s.onClick, () => C), P = c(() => B(() => f() ? E : void 0), () => s.onPointerDown, () => ce), z = c(() => B(() => f() ? w : void 0), () => s.onMouseDown), V = c(() => B(() => f() ? T : void 0), () => s.onKeyDown, () => M, () => B(() => p() ? void 0 : se)), le = c(() => B(() => f() ? w : void 0), () => s.onKeyUp, () => B(() => p() ? void 0 : oe));
-	return k(O, j({
-		get component() {
-			return n.as ?? "button";
-		},
-		ref: [((e) => ee(e)), s.ref],
-		get id() {
-			return d();
-		},
-		get type() {
-			return p() ? "button" : void 0;
-		},
-		get role() {
-			return p() ? void 0 : "button";
-		},
-		get tabIndex() {
-			return !p() && f() ? -1 : 0;
-		},
-		get disabled() {
-			return (A(() => !!p())() ? f() : p()) || void 0;
-		},
-		get "aria-disabled"() {
-			return !p() && f() ? "true" : void 0;
-		},
-		"aria-haspopup": "dialog",
-		get "aria-expanded"() {
-			return g() ? "true" : "false";
-		},
-		get "aria-controls"() {
-			return h()?.triggerPopupId(d());
-		},
-		"data-base-ui-click-trigger": "",
-		get class() {
-			return ne();
-		},
-		get style() {
-			return ie();
-		},
-		onClick: N,
-		onKeyDown: V,
-		onKeyUp: le,
-		onMouseDown: z,
-		onPointerDown: P
-	}, v, y));
-}
-function ve() {
-	if (typeof navigator > "u") return !1;
-	let e = navigator.platform.toLowerCase();
-	return /^i(os$|p)/.test(e) || e === "macintel" && navigator.maxTouchPoints > 1;
-}
-//#endregion
-//#region src/dialog/viewport/DialogViewport.tsx
-function ye(t) {
-	let n = Q(), r = W(), o = t, s = R(t, "as", "class", "ref", "style"), c = F(() => ({
-		open: r.store.open(),
-		transitionStatus: r.store.track().transitionStatus,
-		nested: r.nested,
-		nestedDialogOpen: r.nestedOpenDialogCount() > 0
-	})), l = F(() => i(t.class, c())), u = F(() => q({ "pointer-events": r.store.open() ? void 0 : "none" }, a(t.style, c()))), d = F(() => e(c(), pe)), f = F(() => n.keepMounted() || r.presence.mounted()), p = null;
-	return z(() => {
-		r.viewportElement() === p && r.setViewportElement(null);
-	}), k(M, {
-		get when() {
-			return f();
-		},
-		get children() {
-			return k(O, j({
-				get component() {
-					return t.as ?? "div";
-				},
-				ref: [((e) => {
-					p = e, r.setViewportElement(e);
-				}), o.ref],
-				role: "presentation",
-				get hidden() {
-					return !r.presence.mounted();
-				},
-				get class() {
-					return l();
-				},
-				get style() {
-					return u();
-				}
-			}, d, s));
-		}
-	});
-}
-//#endregion
-//#region src/dialog/store/DialogHandle.ts
-var be = class extends C {
-	constructor() {
-		super("Dialog", !1, new H());
-	}
-	open(e) {
-		this.openByTrigger(e);
-	}
-	openWithPayload(e) {
-		this.attachedStore && (this.attachedStore.setPayload(e), this.attachedStore.setOpen(!0, o(n)));
-	}
-	close() {
-		this.closePopup();
-	}
-	get isOpen() {
-		return this.attachedStore?.open() ?? !1;
-	}
-};
-function xe() {
-	return new be();
-}
-//#endregion
-export { ge as a, he as c, Y as d, q as f, W as h, _e as i, me as l, K as m, xe as n, $ as o, G as p, ye as r, Q as s, be as t, pe as u };