@slotted/react 0.1.0-beta.1 → 0.1.0-beta.11

package/dist/wizard.js

@@ -1,2 +1,2 @@
-import { a as e, c as t, d as n, f as r, g as i, h as a, i as o, l as s, m as c, n as l, o as u, p as d, r as f, s as p, t as m, u as h } from "./wizard-B4GrlEqh.js";
+import { a as e, c as t, d as n, f as r, g as i, h as a, i as o, l as s, m as c, n as l, o as u, p as d, r as f, s as p, t as m, u as h } from "./wizard-CK1x2fs3.js";
 export { r as WIZARD_FALLBACK, m as Wizard, l as WizardActions, f as WizardCancel, o as WizardComplete, d as WizardDefaultsProvider, e as WizardDraftStatus, u as WizardEdit, p as WizardNext, t as WizardPrevious, s as WizardSaveDraft, h as WizardSkip, n as WizardStep, a as useWizard, c as useWizardDefaults, i as useWizardStep };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@slotted/react",
-  "version": "0.1.0-beta.1",
+  "version": "0.1.0-beta.11",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -11,6 +11,9 @@
   "files": [
     "dist"
   ],
+  "bin": {
+    "slotted-agent-docs": "./dist/bin/slotted-agent-docs.mjs"
+  },
   "sideEffects": [
     "**/*.css"
   ],
@@ -335,6 +338,10 @@
       "types": "./dist/types/popover/index.d.ts",
       "import": "./dist/popover.js"
     },
+    "./press-selection": {
+      "types": "./dist/types/press-selection/index.d.ts",
+      "import": "./dist/press-selection.js"
+    },
     "./progress-indicator": {
       "types": "./dist/types/progress-indicator/index.d.ts",
       "import": "./dist/progress-indicator.js"
@@ -523,19 +530,21 @@
       "types": "./dist/types/wizard/index.d.ts",
       "import": "./dist/wizard.js"
     },
-    "./styles.css": "./dist/styles.css"
+    "./styles.css": "./dist/styles.css",
+    "./*/styles.css": "./dist/styles/*.css"
   },
   "peerDependencies": {
-    "@slotted/core": "0.1.0-beta.1",
-    "@slotted/theme": "0.1.0-beta.1",
-    "react": ">=19.2.0 <20"
+    "@slotted/core": "0.1.0-beta.11",
+    "@slotted/theme": "0.1.0-beta.11",
+    "react": ">=19.2.0 <20",
+    "react-dom": ">=19.2.0 <20"
   },
   "devDependencies": {
     "@slotted/agent-docs": "0.0.0",
-    "@slotted/core": "0.1.0-beta.1",
+    "@slotted/core": "0.1.0-beta.11",
     "@slotted/storybook-workbench": "0.0.0",
-    "@slotted/styles": "0.1.0-beta.1",
-    "@slotted/theme": "0.1.0-beta.1",
+    "@slotted/styles": "0.1.0-beta.11",
+    "@slotted/theme": "0.1.0-beta.11",
     "@storybook/react-vite": "10.5.10",
     "@testing-library/jest-dom": "7.0.1",
     "@testing-library/react": "16.3.3",
@@ -543,9 +552,11 @@
     "@types/react": "19.2.18",
     "@types/react-dom": "19.2.5",
     "@vitejs/plugin-react": "6.1.1",
+    "@vitest/browser-playwright": "4.1.11",
     "jsdom": "30.0.1",
     "lucide-react": "1.24.0",
     "marked": "18.0.5",
+    "playwright": "1.63.0",
     "react": "19.2.8",
     "react-dom": "19.2.8",
     "storybook": "10.5.10",
@@ -553,9 +564,11 @@
     "vitest": "4.1.11"
   },
   "scripts": {
-    "build": "vite build && tsc -p tsconfig.build.json && node declarations.build.mjs && node layer-order.build.mjs && node ../../tools/agent-docs/bin/build.mjs --binding react --out dist/docs && node package-boundary.verify.mjs",
-    "test": "vitest run",
+    "build": "vite build && vite build --config vite.styles.config.ts && tsc -p tsconfig.build.json && node declarations.build.mjs && node css.build.mjs && node ../../tools/agent-docs/bin/build.mjs --binding react --out dist/docs --bin dist/bin/slotted-agent-docs.mjs && node package-boundary.verify.mjs",
+    "test": "vitest run --project unit",
+    "test:browser": "vitest run --project browser",
+    "test:perf": "vitest run --config vitest.perf.config.ts",
     "typecheck": "tsc -p tsconfig.json --noEmit --pretty false",
-    "verify": "pnpm test && pnpm typecheck && pnpm build"
+    "verify": "pnpm test && pnpm test:browser && pnpm typecheck && pnpm build"
   }
 }

package/dist/accordion-D-YuMJzk.js

@@ -1,143 +0,0 @@
-import { isHeldOpen as e, nextOpenValues as t, sameOpenValues as n } from "@slotted/core/disclosure";
-import { createArrowNavigation as r } from "@slotted/core/focus";
-import { createControllable as i } from "@slotted/core/state";
-import { createContext as a, useContext as o, useEffect as s, useImperativeHandle as c, useState as l } from "react";
-import { jsx as u } from "react/jsx-runtime";
-//#region src/accordion/accordion-defaults.tsx
-var d = a({
-	headingLevel: "3",
-	indicator: "chevron",
-	loop: !0,
-	mount: "eager",
-	multiple: !1,
-	requireOpen: !1,
-	size: "md",
-	togglePlacement: "end",
-	truncate: !1,
-	variant: "ruled"
-});
-function f() {
-	return o(d);
-}
-function p({ children: e, ...t }) {
-	let n = f();
-	return /* @__PURE__ */ u(d.Provider, {
-		value: {
-			headingLevel: t.headingLevel ?? n.headingLevel,
-			indicator: t.indicator ?? n.indicator,
-			loop: t.loop ?? n.loop,
-			mount: t.mount ?? n.mount,
-			multiple: t.multiple ?? n.multiple,
-			requireOpen: t.requireOpen ?? n.requireOpen,
-			size: t.size ?? n.size,
-			togglePlacement: t.togglePlacement ?? n.togglePlacement,
-			truncate: t.truncate ?? n.truncate,
-			variant: t.variant ?? n.variant
-		},
-		children: e
-	});
-}
-//#endregion
-//#region src/accordion/accordion.tsx
-var m = ":scope > * > [data-part=\"header\"] > [data-part=\"trigger\"]", h = {
-	plain: "plain",
-	ruled: "ruled",
-	framed: "ruled",
-	separated: "framed"
-}, g = a(void 0);
-function _(e) {
-	return e === null ? [] : [...e.querySelectorAll(":scope > [data-value]")].map((e) => ({
-		disabled: e.hasAttribute("data-disabled"),
-		value: e.getAttribute("data-value") ?? ""
-	}));
-}
-function v() {
-	return o(g);
-}
-function y({ children: a, className: o, defaultValue: d, disabled: p, handle: v, headingLevel: y, indicator: b, loop: x, mount: S, multiple: C, onValueChange: w, ref: T, render: E, requireOpen: D, size: O, style: k, togglePlacement: A, truncate: ee, value: j, variant: M, ...N }) {
-	let P = f(), [F, I] = l(d ?? []), L = j ?? F, [R, z] = l(null), B = p === !0, V = y ?? P.headingLevel, H = b ?? P.indicator, U = x ?? P.loop, W = S ?? P.mount, G = C ?? P.multiple, K = D ?? P.requireOpen, q = O ?? P.size, J = A ?? P.togglePlacement, Y = ee ?? P.truncate, X = M ?? P.variant, Z = {
-		multiple: G,
-		requireOpen: K
-	};
-	s(() => {
-		if (R === null) return;
-		let e = r(R, {
-			itemSelector: m,
-			loop: U,
-			orientation: () => "vertical"
-		}), t = new MutationObserver(() => e.refresh());
-		return t.observe(R, {
-			childList: !0,
-			subtree: !0
-		}), () => {
-			t.disconnect(), e.destroy();
-		};
-	}, [R, U]);
-	function Q(e, t, r) {
-		let a = !1, o = i({
-			controlled: j,
-			equals: n,
-			initial: L,
-			onRequest: (e) => {
-				a = e.cancelled, w?.(e.value, e);
-			}
-		}).request(e, t, r);
-		a || o && I(e);
-	}
-	let te = {
-		disabled: B,
-		indicator: H,
-		isHeld: (t) => e(L, t, Z),
-		isOpen: (e) => L.includes(e),
-		level: V,
-		mount: W,
-		size: q,
-		togglePlacement: J,
-		toggle: (e, n, r) => {
-			let i = t(L, e, Z);
-			i !== L && Q(i, n, r);
-		},
-		truncate: Y,
-		variant: h[X]
-	};
-	c(v, () => ({
-		openAll: () => {
-			let e = _(R).filter((e) => !e.disabled).map((e) => e.value);
-			Q(G ? e : e.slice(0, 1), "programmatic", void 0);
-		},
-		closeAll: () => {
-			if (K && L.length > 0) {
-				Q(L.slice(0, 1), "programmatic", void 0);
-				return;
-			}
-			Q([], "programmatic", void 0);
-		}
-	}), [
-		R,
-		L,
-		G,
-		K
-	]);
-	let $ = {
-		...N,
-		children: a,
-		className: o,
-		...B ? { "data-disabled": "" } : {},
-		"data-part": "root",
-		"data-size": q,
-		"data-ui": "accordion",
-		"data-variant": X,
-		style: k
-	};
-	return /* @__PURE__ */ u(g.Provider, {
-		value: te,
-		children: E === void 0 ? /* @__PURE__ */ u("div", {
-			...$,
-			ref: (e) => {
-				z(e), typeof T == "function" ? T(e) : T != null && (T.current = e);
-			}
-		}) : E($)
-	});
-}
-//#endregion
-export { f as a, p as i, y as n, v as r, m as t };

package/dist/action-bar-C7cGnEyJ.js

@@ -1,282 +0,0 @@
-import { t as e } from "./button-defaults-DNq_DDJh.js";
-import { n as t, t as n } from "./icon-T9Yt4tnm.js";
-import { _ as r, g as i, n as a, t as o } from "./menu-parts-BQej6eU9.js";
-import { Fragment as s, createContext as c, useCallback as l, useContext as u, useEffect as d, useId as f, useMemo as p, useRef as m, useState as h } from "react";
-import { jsx as g, jsxs as _ } from "react/jsx-runtime";
-import { createCollapse as v } from "@slotted/core/overflow";
-import { createPresence as y } from "@slotted/core/presence";
-var b = c({
-	counterpart: () => null,
-	declare: () => void 0,
-	registerActions: () => void 0,
-	registerTrigger: () => void 0,
-	release: () => void 0,
-	surface: []
-});
-function x() {
-	return u(b);
-}
-var S = "data-unit", C = "data-priority", w = "--_stacked", T = Object.freeze({
-	always: 0,
-	hide: 0,
-	high: 2,
-	low: 1,
-	pinned: 0
-});
-function E(e, t) {
-	return e === void 0 ? t ? "low" : "pinned" : e === "hide" || e === "pinned" || t ? e : "pinned";
-}
-//#endregion
-//#region src/action-bar/action-bar-defaults.tsx
-var D = c({
-	align: "end",
-	size: "md",
-	sticky: !1,
-	variant: "plain"
-});
-function O() {
-	return u(D);
-}
-function k({ children: e, ...t }) {
-	let n = O();
-	return /* @__PURE__ */ g(D.Provider, {
-		value: {
-			align: t.align ?? n.align,
-			size: t.size ?? n.size,
-			sticky: t.sticky ?? n.sticky,
-			variant: t.variant ?? n.variant
-		},
-		children: e
-	});
-}
-//#endregion
-//#region src/action-bar/action-bar.tsx
-var A = Object.freeze([]);
-function j(e) {
-	return [...e.children].filter((e) => e instanceof HTMLElement && e.getAttribute("data-part") !== "overflow" && e.getAttribute("data-priority") !== "always");
-}
-function M(e) {
-	return e.getAttribute("data-priority") ?? "pinned";
-}
-function N(e, t) {
-	for (let n = e.nextElementSibling; n !== null && n !== t; n = n.nextElementSibling) if (n.getAttribute("data-part") === "separator") return !0;
-	return !1;
-}
-function P(e, t) {
-	let n = new Set(t), r = [...e.children].filter((e) => e instanceof HTMLElement && e.hasAttribute("data-unit") && (n.has(e) || e.getAttribute("data-priority") === "always"));
-	return r.map((e, t) => {
-		let n = r[t - 1];
-		return {
-			id: e.getAttribute("data-unit") ?? "",
-			separatorBefore: n !== void 0 && N(n, e)
-		};
-	});
-}
-function F(e, t) {
-	return e.length === t.length && e.every((e, n) => e.id === t[n]?.id && e.separatorBefore === t[n]?.separatorBefore);
-}
-function I({ align: t, children: n, className: r, onOverflowChange: i, present: a, ref: o, render: s, size: c, sticky: u, style: f, variant: _, ...x }) {
-	let E = O(), D = m(null), k = m(/* @__PURE__ */ new Map()), N = m([]), I = m(null), [L, R] = h(null), [z, B] = h(null), [V, H] = h(!1), [U, W] = h(A), G = m(i);
-	G.current = i;
-	let ee = t ?? E.align, K = c ?? E.size, te = u ?? E.sticky, ne = _ ?? E.variant, q = a ?? !0, [J, re] = h(q ? "open" : "unmounted"), Y = m(null);
-	Y.current ??= y({
-		onStatusChange: re,
-		present: q,
-		skipInitialAnimation: !0
-	}), d(() => {
-		Y.current?.sync(q);
-	}, [q]), d(() => {
-		let e = Y.current;
-		return () => e?.destroy();
-	}, []);
-	let X = l((e) => R(e), []), Z = l((e) => B(e), []), ie = p(() => ({
-		counterpart: (e) => k.current.get(e) ?? null,
-		declare: (e, t) => {
-			k.current.set(e, t);
-		},
-		registerActions: X,
-		registerTrigger: Z,
-		release: (e) => {
-			k.current.delete(e);
-		},
-		surface: U
-	}), [
-		X,
-		Z,
-		U
-	]), Q = l((e) => {
-		if (D.current = e, Y.current?.setNode(e), typeof o == "function") return o(e);
-		o && (o.current = e);
-	}, [o]);
-	if (d(() => {
-		let e = L;
-		if (e === null) return;
-		let t = () => {
-			let t = (e.ownerDocument?.defaultView)?.getComputedStyle(e).getPropertyValue(w).trim() === "1";
-			H((e) => e === t ? e : t);
-		};
-		if (t(), typeof ResizeObserver > "u") return;
-		let n = new ResizeObserver(t);
-		return n.observe(e), () => n.disconnect();
-	}, [L]), d(() => {
-		let e = L;
-		if (e === null || V) return;
-		let t = () => {
-			let t = P(e, N.current);
-			W((e) => F(e, t) ? e : t);
-		}, n = v(e, {
-			collapsible: (e) => M(e) !== "pinned",
-			divides: (e) => e.getAttribute("data-part") === "separator",
-			onChange: (e) => {
-				N.current = e, t(), G.current?.(e.filter((e) => e.hasAttribute(S)).length);
-			},
-			rank: (e) => T[M(e)],
-			trigger: () => z,
-			triggerAlways: () => e.querySelector(`[${C}='always']`) !== null,
-			units: () => j(e)
-		});
-		I.current = n, t();
-		let r = new MutationObserver(() => {
-			n.refresh(), t();
-		});
-		return r.observe(e, {
-			childList: !0,
-			subtree: !0
-		}), () => {
-			r.disconnect(), n.destroy(), I.current = null, N.current = [], W(A);
-		};
-	}, [
-		L,
-		V,
-		z
-	]), J === "unmounted") return null;
-	let ae = N.current.length, $ = {
-		role: "group",
-		...x,
-		children: /* @__PURE__ */ g(e, {
-			size: K,
-			children: n
-		}),
-		className: r,
-		"data-align": ee,
-		...z === null ? {} : { "data-collapsed": String(ae) },
-		"data-part": "root",
-		"data-size": K,
-		...J === "open" ? {} : { "data-status": J },
-		...te ? { "data-sticky": "" } : {},
-		"data-ui": "action-bar",
-		"data-variant": ne,
-		style: f
-	};
-	return /* @__PURE__ */ g(b.Provider, {
-		value: ie,
-		children: s === void 0 ? /* @__PURE__ */ g("div", {
-			...$,
-			ref: Q
-		}) : s({
-			...$,
-			ref: Q
-		})
-	});
-}
-//#endregion
-//#region src/action-bar/action-bar-overflow.tsx
-function L(e, ...t) {
-	for (let n of t) typeof n == "function" ? n(e) : n != null && (n.current = e);
-}
-function R(e, t) {
-	return typeof e == "function" ? e(t) : e === void 0 ? `${t} more ${t === 1 ? "action" : "actions"}` : e;
-}
-function z({ align: e, label: c, menuRef: u, ref: d, render: f, side: p, size: h, ...v }) {
-	let y = x(), b = y.surface, { registerTrigger: S } = y, C = m(void 0), w = l((e) => {
-		S(e), L(e, C.current, d);
-	}, [d, S]);
-	return /* @__PURE__ */ _(r, {
-		...e === void 0 ? {} : { align: e },
-		...u === void 0 ? {} : { ref: u },
-		...p === void 0 ? {} : { side: p },
-		...h === void 0 ? {} : { size: h },
-		children: [/* @__PURE__ */ g(a, { render: ({ ref: e, ...r }) => {
-			C.current = e;
-			let i = {
-				...r,
-				...v,
-				"aria-label": R(c, b.length),
-				children: /* @__PURE__ */ g(n, { children: /* @__PURE__ */ g(t, { name: "ellipsis" }) }),
-				"data-part": "overflow"
-			};
-			return f === void 0 ? /* @__PURE__ */ g("button", {
-				...i,
-				ref: w,
-				type: "button"
-			}) : f({
-				...i,
-				ref: w
-			});
-		} }), /* @__PURE__ */ g(o, { children: b.map((e) => /* @__PURE__ */ _(s, { children: [e.separatorBefore ? /* @__PURE__ */ g(i, {}) : null, y.counterpart(e.id)] }, e.id)) })]
-	});
-}
-//#endregion
-//#region src/action-bar/action-bar-parts.tsx
-function B({ children: e, ref: t, render: n, ...r }) {
-	let i = {
-		...r,
-		children: e,
-		"data-part": "status"
-	};
-	return n === void 0 ? /* @__PURE__ */ g("div", {
-		...i,
-		ref: t
-	}) : n(i);
-}
-function V({ children: e, ref: t, render: n, ...r }) {
-	let { registerActions: i } = x(), a = l((e) => {
-		if (i(e), typeof t == "function") return t(e);
-		t && (t.current = e);
-	}, [t, i]);
-	d(() => () => i(null), [i]);
-	let o = {
-		...r,
-		children: e,
-		"data-part": "actions"
-	};
-	return n === void 0 ? /* @__PURE__ */ g("div", {
-		...o,
-		ref: a
-	}) : n({
-		...o,
-		ref: a
-	});
-}
-function H({ children: e, counterpart: t, priority: n, ref: r, render: i, ...a }) {
-	let o = x(), s = f(), c = t != null && t !== !1, l = E(n, c);
-	c && o.declare(s, t);
-	let { release: u } = o;
-	d(() => () => u(s), [s, u]);
-	let p = {
-		...a,
-		...c ? { [S]: s } : {},
-		...l === "always" ? { hidden: !0 } : {},
-		children: e,
-		"data-part": "action",
-		"data-priority": l
-	};
-	return i === void 0 ? /* @__PURE__ */ g("div", {
-		...p,
-		ref: r
-	}) : i(p);
-}
-function U({ ref: e, render: t, ...n }) {
-	let r = {
-		"aria-orientation": "vertical",
-		...n,
-		"data-part": "separator",
-		role: "separator"
-	};
-	return t === void 0 ? /* @__PURE__ */ g("div", {
-		...r,
-		ref: e
-	}) : t(r);
-}
-//#endregion
-export { z as a, O as c, B as i, x as l, V as n, I as o, U as r, k as s, H as t };