@slotted/react 0.1.0-beta.7 → 0.1.0-beta.9

package/dist/dialog-yT-x3B9s.js

@@ -1,498 +0,0 @@
-import { n as e, t } from "./icon-T9Yt4tnm.js";
-import { r as n } from "./i18n-DpW8lqJ1.js";
-import { createFocusScope as r } from "@slotted/core/focus";
-import { createControllable as i } from "@slotted/core/state";
-import { createContext as a, useCallback as o, useContext as s, useEffect as c, useId as l, useImperativeHandle as u, useLayoutEffect as d, useMemo as f, useRef as p, useState as m } from "react";
-import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
-import { createPresence as ee } from "@slotted/core/presence";
-import { createPortalRoot as v } from "@slotted/core/portal";
-import { createDismissableLayer as y } from "@slotted/core/dismissable-layer";
-import { createPortal as b } from "react-dom";
-import { dialogMessages as te } from "@slotted/core/i18n";
-//#region src/dialog/dialog-defaults.tsx
-var x = a({
-	back: "close",
-	escape: "close",
-	fullScreen: "narrow",
-	modal: !0,
-	mount: "active",
-	outsidePress: "close",
-	placement: "center",
-	scroll: "content",
-	size: "md",
-	surface: "panel"
-});
-function S() {
-	return s(x);
-}
-function C({ children: e, ...t }) {
-	let n = S();
-	return /* @__PURE__ */ g(x.Provider, {
-		value: {
-			back: t.back ?? n.back,
-			escape: t.escape ?? n.escape,
-			fullScreen: t.fullScreen ?? n.fullScreen,
-			modal: t.modal ?? n.modal,
-			mount: t.mount ?? n.mount,
-			outsidePress: t.outsidePress ?? n.outsidePress,
-			placement: t.placement ?? n.placement,
-			scroll: t.scroll ?? n.scroll,
-			size: t.size ?? n.size,
-			surface: t.surface ?? n.surface
-		},
-		children: e
-	});
-}
-//#endregion
-//#region src/dialog/dialog.tsx
-var w = a(void 0);
-function T() {
-	let e = s(w);
-	if (e === void 0) throw Error("Every dialog part must be rendered inside Dialog or AlertDialog.");
-	return e;
-}
-function E({ back: e, children: t, container: r, defaultFullscreen: a, defaultOpen: s, escape: d, finalFocus: h, fullscreen: _, fullScreen: v, fullscreenToggle: y, initialFocus: b, loading: x, member: C, messages: T, modal: E, mount: D, onFullscreenChange: O, onOpenChange: k, open: A, outsidePress: j, placement: M, ref: ne, scroll: re, size: ie, surface: ae, tone: N }) {
-	let P = S(), F = n(te, T), I = l(), [L, R] = m(s ?? !1), z = A ?? L, B = C === "alertDialog", [V, oe] = m(a ?? !1), H = !B && (_ ?? V), U = !B && y === !0, W = B ? !0 : E ?? P.modal, G = B ? "none" : j ?? P.outsidePress, K = D ?? P.mount, q = ie ?? (B ? "sm" : P.size), J = v ?? (B ? "never" : P.fullScreen), se = b ?? (B ? "cancel" : "first"), ce = d ?? P.escape, le = e ?? P.back, ue = M ?? P.placement, de = re ?? P.scroll, fe = ae ?? P.surface, [Y, pe] = m(z ? "open" : "unmounted"), X = p(null);
-	X.current === null && (X.current = ee({
-		present: z,
-		onStatusChange: pe
-	})), c(() => {
-		X.current?.sync(z);
-	}, [z]), c(() => {
-		let e = X.current;
-		return () => e?.stop();
-	}, []);
-	let me = p(z);
-	z && (me.current = !0);
-	let he = K === "eager" ? !0 : K === "lazy" ? me.current : Y !== "unmounted", Z = p({
-		cancel: null,
-		content: null,
-		trigger: null
-	}), [ge, _e] = m(!1), [Q, ve] = m(!1), ye = o((e, t) => (e === "cancel" && (Z.current.cancel = t), e === "title" && _e(!0), e === "description" && ve(!0), () => {
-		e === "cancel" && (Z.current.cancel = null), e === "title" && _e(!1), e === "description" && ve(!1);
-	}), []), $ = o((e, t, n, r) => {
-		if (e === z) return;
-		let a = !1, o = i({
-			controlled: A,
-			initial: z,
-			onRequest: (e) => {
-				a = e.cancelled, k?.(e.value, {
-					get cancelled() {
-						return e.cancelled;
-					},
-					cancel: () => e.cancel(),
-					previous: e.previous,
-					reason: t,
-					result: n,
-					source: e.source,
-					value: e.value
-				});
-			}
-		}).request(e, t, r);
-		a || o && R(e);
-	}, [
-		z,
-		k,
-		A
-	]), be = o((e, t, n) => {
-		e !== H && i({
-			controlled: _,
-			initial: H,
-			onRequest: (e) => {
-				O?.(e.value, {
-					get cancelled() {
-						return e.cancelled;
-					},
-					cancel: () => e.cancel(),
-					previous: e.previous,
-					reason: t,
-					source: e.source,
-					value: e.value
-				});
-			}
-		}).request(e, t, n) && oe(e);
-	}, [
-		H,
-		_,
-		O
-	]);
-	u(ne, () => ({
-		open: () => $(!0, "programmatic", void 0, void 0),
-		close: (e) => $(!1, "programmatic", e, void 0),
-		focus: () => Z.current.content?.focus(),
-		get content() {
-			return Z.current.content;
-		}
-	}), [$]);
-	let xe = f(() => ({
-		announce: ye,
-		close: (e, t, n) => $(!1, e, t, n),
-		container: r,
-		descriptionId: Q ? `${I}description` : "",
-		back: le,
-		escape: ce,
-		finalFocus: h,
-		fullScreen: J,
-		fullscreen: H,
-		fullscreenToggle: U,
-		initialFocus: se,
-		setFullscreen: be,
-		loading: x === !0,
-		member: C,
-		modal: W,
-		mount: K,
-		mounted: he,
-		nodes: Z.current,
-		open: z,
-		openWith: (e, t) => $(!0, e, void 0, t),
-		outsidePress: G,
-		placement: ue,
-		registerContent: (e) => {
-			Z.current.content = e;
-		},
-		registerLayer: (e) => X.current?.setNode(e),
-		registerTrigger: (e) => {
-			Z.current.trigger = e;
-		},
-		scroll: de,
-		size: q,
-		surface: fe,
-		t: F,
-		titleId: ge ? `${I}title` : "",
-		tone: B ? N ?? "danger" : void 0,
-		triggerId: `${I}trigger`,
-		visible: Y === "open",
-		interactive: Y === "entering" || Y === "open"
-	}), [
-		ye,
-		I,
-		r,
-		z,
-		H,
-		Q,
-		h,
-		B,
-		x,
-		C,
-		he,
-		$,
-		le,
-		ce,
-		J,
-		U,
-		se,
-		W,
-		K,
-		G,
-		ue,
-		de,
-		q,
-		be,
-		fe,
-		Y,
-		F,
-		ge,
-		N
-	]);
-	return /* @__PURE__ */ g(w.Provider, {
-		value: xe,
-		children: t
-	});
-}
-function D(e) {
-	return /* @__PURE__ */ g(E, {
-		...e,
-		member: "dialog"
-	});
-}
-function O(e) {
-	return /* @__PURE__ */ g(E, {
-		...e,
-		member: "alertDialog"
-	});
-}
-//#endregion
-//#region src/dialog/dialog-parts.tsx
-function k(e) {
-	return e.detail === 0 ? "keyboard" : "pointer";
-}
-var A = typeof document > "u" ? c : d;
-function j({ children: e, className: t, onClick: n, ref: r, render: i, style: a, ...o }) {
-	let s = T(), c = {
-		...o,
-		"aria-controls": s.mounted ? `${s.triggerId}-content` : void 0,
-		"aria-expanded": s.open,
-		"aria-haspopup": "dialog",
-		children: e,
-		className: t,
-		"data-part": "trigger",
-		...s.open ? { "data-open": "" } : {},
-		id: s.triggerId,
-		onClick: (e) => {
-			n?.(e), !e.defaultPrevented && s.openWith(k(e), e);
-		},
-		ref: (e) => {
-			s.registerTrigger(e), typeof r == "function" ? r(e) : r && (r.current = e);
-		},
-		style: a,
-		type: "button"
-	};
-	return i === void 0 ? /* @__PURE__ */ g("button", { ...c }) : i(c);
-}
-function M(e) {
-	let [t, n] = m(null);
-	return A(() => {
-		if (!e.mounted) return;
-		let t = v({
-			origin: e.nodes.trigger,
-			...e.container === void 0 ? {} : { container: e.container }
-		});
-		return n(t.container), () => {
-			n(null), t.release();
-		};
-	}, [
-		e.container,
-		e.mounted,
-		e.nodes
-	]), t;
-}
-function ne({ children: e, className: t, ref: n, render: i, style: a, ...o }) {
-	let s = T(), l = M(s), [u, d] = m(null), f = `${s.triggerId}-content`, p = s.titleId !== "" && o["aria-label"] === void 0, h = s.descriptionId !== "";
-	if (c(() => {
-		if (s.member === "alertDialog" && u !== null && u.querySelector("[data-part=\"description\"]") === null) throw Error("AlertDialog requires a DialogDescription: the alertdialog pattern makes aria-describedby mandatory.");
-	}, [u, s.member]), c(() => {
-		if (u === null || !s.open) return;
-		let e = u.closest("[data-ui=\"dialog\"]");
-		if (e === null) return;
-		let t = s.nodes.trigger === null ? [] : [s.nodes.trigger], n = y(e, {
-			back: s.modal && s.back === "close",
-			branches: t,
-			content: u,
-			escape: s.escape === "close",
-			modal: s.modal,
-			onDismiss: (e) => {
-				if (e.reason === "outsidePress" && s.outsidePress === "none") return e.cancel();
-				s.close(e.reason, void 0, e.source);
-			},
-			outsidePress: s.outsidePress === "close",
-			outsidePressEvent: "click"
-		}), i = s.initialFocus, a = s.finalFocus, o = r(u, {
-			contain: s.modal,
-			initial: i === "cancel" ? () => s.nodes.cancel : typeof i == "object" && i ? () => i.current : i,
-			...a === void 0 ? {} : { restore: a === !1 ? !1 : () => a.current }
-		});
-		return o.enter(), () => {
-			n.destroy(), o.destroy();
-		};
-	}, [u, s]), !s.mounted || l === null) return null;
-	let ee = {
-		"data-full-screen": s.fullScreen,
-		...s.fullscreen ? { "data-fullscreen": "" } : {},
-		...s.loading ? { "data-loading": "" } : {},
-		...s.modal ? { "data-modal": "" } : {},
-		"data-mount": s.mount,
-		...s.visible ? { "data-open": "" } : {},
-		"data-outside-press": s.outsidePress,
-		"data-part": "root",
-		"data-placement": s.placement,
-		"data-scroll": s.scroll,
-		"data-size": s.size,
-		"data-surface": s.surface,
-		...s.tone === void 0 ? {} : { "data-tone": s.tone },
-		"data-ui": "dialog"
-	}, v = {
-		...o,
-		...h ? { "aria-describedby": s.descriptionId } : {},
-		...p ? { "aria-labelledby": s.titleId } : {},
-		...s.modal ? { "aria-modal": !0 } : {},
-		children: e,
-		className: t,
-		"data-part": "content",
-		id: f,
-		ref: (e) => {
-			d(e), s.registerContent(e), typeof n == "function" ? n(e) : n && (n.current = e);
-		},
-		role: s.member === "alertDialog" ? "alertdialog" : "dialog",
-		style: a
-	}, te = i === void 0 ? /* @__PURE__ */ g("div", { ...v }) : i(v);
-	return b(/* @__PURE__ */ _("div", {
-		...ee,
-		...s.interactive ? {} : { inert: !0 },
-		ref: s.registerLayer,
-		children: [/* @__PURE__ */ g("div", { "data-part": "backdrop" }), /* @__PURE__ */ g("div", {
-			"data-part": "viewport",
-			children: te
-		})]
-	}), l);
-}
-function re({ children: e, className: t, ref: n, render: r, style: i, ...a }) {
-	let o = T(), s = {
-		...a,
-		children: /* @__PURE__ */ _(h, { children: [e, o.fullscreenToggle ? /* @__PURE__ */ g(ie, {}) : null] }),
-		className: t,
-		"data-part": "header",
-		style: i
-	};
-	return r === void 0 ? /* @__PURE__ */ g("header", {
-		...s,
-		ref: n
-	}) : r(s);
-}
-function ie() {
-	let n = T();
-	return /* @__PURE__ */ g("button", {
-		"aria-label": n.t("fullScreen"),
-		"aria-pressed": n.fullscreen,
-		"data-part": "fullscreen",
-		onClick: (e) => {
-			e.defaultPrevented || n.setFullscreen(!n.fullscreen, e.detail === 0 ? "keyboard" : "pointer", e);
-		},
-		type: "button",
-		children: /* @__PURE__ */ g(t, { children: /* @__PURE__ */ g(e, { name: n.fullscreen ? "minimize" : "maximize" }) })
-	});
-}
-function ae({ children: e, className: t, ref: n, render: r, style: i, ...a }) {
-	let o = T();
-	c(() => o.announce("title", null), [o]);
-	let s = {
-		...a,
-		children: e,
-		className: t,
-		"data-part": "title",
-		id: o.titleId === "" ? void 0 : o.titleId,
-		style: i
-	};
-	return r === void 0 ? /* @__PURE__ */ g("h2", {
-		...s,
-		ref: n
-	}) : r(s);
-}
-function N({ children: e, className: t, ref: n, render: r, style: i, ...a }) {
-	let o = T();
-	c(() => o.announce("description", null), [o]);
-	let s = {
-		...a,
-		children: e,
-		className: t,
-		"data-part": "description",
-		id: o.descriptionId === "" ? void 0 : o.descriptionId,
-		style: i
-	};
-	return r === void 0 ? /* @__PURE__ */ g("p", {
-		...s,
-		ref: n
-	}) : r(s);
-}
-function P({ children: e, className: t, ref: n, render: r, style: i, ...a }) {
-	let o = T(), s = {
-		...a,
-		...o.loading ? { "aria-busy": !0 } : {},
-		children: e,
-		className: t,
-		"data-part": "body",
-		style: i
-	};
-	return r === void 0 ? /* @__PURE__ */ g("div", {
-		...s,
-		ref: n
-	}) : r(s);
-}
-function F({ children: e, className: t, ref: n, render: r, style: i, ...a }) {
-	let o = {
-		...a,
-		children: e,
-		className: t,
-		"data-part": "footer",
-		style: i
-	};
-	return r === void 0 ? /* @__PURE__ */ g("footer", {
-		...o,
-		ref: n
-	}) : r(o);
-}
-function I(e, t, n, r) {
-	let i = T();
-	return {
-		dialog: i,
-		handleClick: (e) => {
-			n?.(e), !e.defaultPrevented && i.close(t, r, e);
-		},
-		part: e
-	};
-}
-function L({ children: n, className: r, onClick: i, ref: a, render: o, style: s, value: c, ...l }) {
-	let { dialog: u, handleClick: d } = I("close", "dismiss", i, c);
-	if (u.member === "alertDialog") throw Error("AlertDialog has no close part: a confirmation is answered with AlertDialogCancel or AlertDialogAction, not dismissed by an ✕.");
-	let f = {
-		"aria-label": u.t("close"),
-		...l,
-		children: n ?? /* @__PURE__ */ g(t, { children: /* @__PURE__ */ g(e, { name: "x" }) }),
-		className: r,
-		"data-part": "close",
-		onClick: d,
-		style: s,
-		type: "button"
-	};
-	return o === void 0 ? /* @__PURE__ */ g("button", {
-		...f,
-		ref: a
-	}) : o(f);
-}
-var R = {
-	accent: "circle-info",
-	secondary: "circle-info",
-	success: "circle-check",
-	warning: "triangle-alert",
-	danger: "circle-alert"
-};
-function z({ children: n, className: r, ref: i, render: a, style: o, ...s }) {
-	let c = T(), l = {
-		"aria-hidden": !0,
-		...s,
-		children: n ?? /* @__PURE__ */ g(t, { children: /* @__PURE__ */ g(e, { name: c.tone === void 0 ? "triangle-alert" : R[c.tone] }) }),
-		className: r,
-		"data-part": "icon",
-		style: o
-	};
-	return a === void 0 ? /* @__PURE__ */ g("span", {
-		...l,
-		ref: i
-	}) : a(l);
-}
-function B({ children: e, className: t, onClick: n, ref: r, render: i, style: a, value: o, ...s }) {
-	let { dialog: c, handleClick: l } = I("cancel", "dismiss", n, o ?? "cancel"), u = {
-		...s,
-		children: e,
-		className: t,
-		"data-part": "cancel",
-		onClick: l,
-		style: a,
-		type: "button"
-	}, d = (e) => {
-		c.announce("cancel", e), typeof r == "function" ? r(e) : r && (r.current = e);
-	};
-	return i === void 0 ? /* @__PURE__ */ g("button", {
-		...u,
-		ref: d
-	}) : i({
-		...u,
-		ref: d
-	});
-}
-function V({ children: e, className: t, onClick: n, ref: r, render: i, style: a, value: o, ...s }) {
-	let { handleClick: c } = I("action", "submit", n, o ?? "confirm"), l = {
-		...s,
-		children: e,
-		className: t,
-		"data-part": "action",
-		onClick: c,
-		style: a,
-		type: "button"
-	};
-	return i === void 0 ? /* @__PURE__ */ g("button", {
-		...l,
-		ref: r
-	}) : i(l);
-}
-//#endregion
-export { L as a, F as c, j as d, O as f, S as g, C as h, P as i, re as l, T as m, B as n, ne as o, D as p, z as r, N as s, V as t, ae as u };

package/dist/divider-D36Jqo0J.js

@@ -1,33 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-//#region src/divider/divider.tsx
-function t({ align: t = "center", decorative: r = !1, inset: i = !1, label: a, orientation: o = "horizontal", render: s, role: c, ...l }) {
-	let u = a !== void 0, d = s === void 0 && !u, f = {
-		...l,
-		...u && !r ? { "aria-label": a } : {},
-		...o === "vertical" && !r ? { "aria-orientation": "vertical" } : {},
-		...u ? {
-			"data-align": t,
-			"data-labelled": ""
-		} : {},
-		...i ? { "data-inset": "" } : {},
-		"data-orientation": o,
-		"data-part": "root",
-		"data-ui": "divider",
-		role: c ?? (r ? "none" : d ? void 0 : "separator")
-	};
-	return s === void 0 ? u ? /* @__PURE__ */ e("div", {
-		...f,
-		children: n(a)
-	}) : /* @__PURE__ */ e("hr", { ...f }) : s(u ? {
-		...f,
-		children: n(a)
-	} : f);
-}
-function n(t) {
-	return /* @__PURE__ */ e("span", {
-		"data-part": "label",
-		children: t
-	});
-}
-//#endregion
-export { t };