@slotted/react 0.0.0-stage → 0.1.0-beta.1

package/dist/loading-overlay-B83XFctM.js

@@ -0,0 +1,208 @@
+import { t as e } from "./react-dom-DzrKNxo6.js";
+import { r as t } from "./i18n-DpW8lqJ1.js";
+import { r as n } from "./progress-indicator-DwvUSFFs.js";
+/* empty css                         */
+import { createFocusScope as r } from "@slotted/core/focus";
+import { createContext as i, useCallback as a, useContext as o, useEffect as s, useRef as c, useState as l } from "react";
+import { Fragment as u, jsx as d, jsxs as f } from "react/jsx-runtime";
+import { createPresence as p } from "@slotted/core/presence";
+import { createPortalRoot as m } from "@slotted/core/portal";
+import { createDismissableLayer as h } from "@slotted/core/dismissable-layer";
+import { loadingOverlayMessages as g } from "@slotted/core/i18n";
+import { initialLoadingVisibility as _, nextLoadingVisibility as v } from "@slotted/core/loading";
+//#region src/loading-overlay/loading-overlay-defaults.tsx
+var y = e(), b = i({});
+function x() {
+	return o(b);
+}
+function S({ children: e, ...t }) {
+	let n = x();
+	return /* @__PURE__ */ d(b.Provider, {
+		value: {
+			delay: t.delay ?? n.delay,
+			live: t.live ?? n.live,
+			loadedLabel: t.loadedLabel ?? n.loadedLabel,
+			minDuration: t.minDuration ?? n.minDuration,
+			size: t.size ?? n.size,
+			veil: t.veil ?? n.veil
+		},
+		children: e
+	});
+}
+//#endregion
+//#region src/loading-overlay/use-loading-visibility.ts
+function C({ delay: e, loading: t, minDuration: n, onWithdraw: r }) {
+	let i = c(_), [, a] = l(0), o = v({
+		delay: e,
+		loading: t,
+		minDuration: n,
+		now: Date.now(),
+		state: i.current
+	});
+	i.current = o.state;
+	let { wait: u } = o;
+	s(() => {
+		if (u === null) return;
+		let e = setTimeout(() => a((e) => e + 1), u);
+		return () => clearTimeout(e);
+	}, [u, t]);
+	let d = o.state.visible, f = c(d);
+	return s(() => {
+		f.current && !d && r?.(), f.current = d;
+	}, [d, r]), d;
+}
+//#endregion
+//#region src/loading-overlay/loading-overlay.tsx
+var ee = "dismiss";
+function w({ cancelLabel: e, cancellable: i = !1, children: o, container: _, delay: v, description: b, indicator: S, live: w, loadedLabel: T, loading: te = !0, messages: ne, minDuration: E, onCancel: D, onReveal: re, render: O, renderCancel: k, scope: A = "region", size: j, veil: M, ...ie }) {
+	let N = x(), P = t(g, ne), F = {
+		cancelLabel: e ?? P("cancel"),
+		delay: v ?? N.delay ?? 0,
+		label: P("label"),
+		live: w ?? N.live ?? "polite",
+		loadedLabel: T ?? N.loadedLabel,
+		minDuration: E ?? N.minDuration ?? 0,
+		size: j ?? N.size ?? "md",
+		veil: M ?? N.veil ?? "wash"
+	}, I = C({
+		delay: F.delay,
+		loading: te,
+		minDuration: F.minDuration,
+		onWithdraw: re
+	}), L = a((e, t) => {
+		D?.({
+			reason: e,
+			source: t
+		});
+	}, [D]), [R, z] = l(null), B = c(void 0), [, V] = l(I ? "open" : "unmounted");
+	B.current ??= p({
+		present: I,
+		onStatusChange: V
+	}), s(() => {
+		B.current?.setNode(R);
+	}, [R]), s(() => {
+		B.current?.sync(I);
+	}, [I]), s(() => {
+		let e = B.current;
+		return () => e?.destroy();
+	}, []);
+	let H = B.current.mounted, U = c(null), W = c(null), [G, K] = l(null);
+	s(() => {
+		if (!I || G === null) return;
+		let e = G.ownerDocument.activeElement;
+		if (!(A === "page" || e !== null && (U.current?.contains(e) ?? !1))) return;
+		let t = r(G, {
+			contain: A === "page",
+			initial: i ? () => W.current : "container"
+		});
+		return t.enter(), () => t.destroy();
+	}, [
+		i,
+		I,
+		G,
+		A
+	]);
+	let [q, J] = l(null);
+	s(() => {
+		if (A !== "page") return;
+		let e = m(_ === void 0 ? {} : { container: _ });
+		return J(e.container), () => {
+			J(null), e.release();
+		};
+	}, [_, A]);
+	let [Y, X] = l(null);
+	s(() => {
+		if (A !== "page" || Y === null || !I) return;
+		let e = h(Y, {
+			escape: i,
+			modal: !0,
+			onDismiss: (e) => {
+				e.reason === "escape" && L("escape", e.source);
+			},
+			outsidePress: !1,
+			...G === null ? {} : { content: G }
+		});
+		return () => e.destroy();
+	}, [
+		i,
+		L,
+		I,
+		G,
+		Y,
+		A
+	]);
+	let ae = (e) => {
+		i && e.key === "Escape" && (e.stopPropagation(), L("escape", e));
+	}, oe = I ? F.label : F.loadedLabel ?? "", Z = {
+		children: F.cancelLabel,
+		"data-part": "cancel",
+		onClick: (e) => L(ee, e),
+		ref: W,
+		type: "button"
+	}, se = /* @__PURE__ */ f("div", {
+		"data-part": "panel",
+		ref: K,
+		tabIndex: -1,
+		children: [
+			/* @__PURE__ */ d("span", {
+				"data-part": "indicator",
+				...S === void 0 ? { "data-default": "" } : {},
+				children: S ?? /* @__PURE__ */ d(n, {
+					contained: !0,
+					decorative: !0,
+					size: F.size
+				})
+			}),
+			/* @__PURE__ */ d("span", {
+				"aria-hidden": "true",
+				"data-part": "label",
+				children: F.label
+			}),
+			b === void 0 ? null : /* @__PURE__ */ d("span", {
+				"aria-hidden": "true",
+				"data-part": "description",
+				children: b
+			}),
+			i ? k === void 0 ? /* @__PURE__ */ d("button", { ...Z }) : k(Z) : null
+		]
+	}), ce = /* @__PURE__ */ f(u, { children: [
+		F.live === "off" ? null : /* @__PURE__ */ d("span", {
+			"data-part": "announcement",
+			"data-ui": "visually-hidden",
+			role: "status",
+			children: oe
+		}),
+		A === "page" ? null : /* @__PURE__ */ d("div", {
+			"data-part": "content",
+			ref: U,
+			...I ? { inert: !0 } : {},
+			children: o
+		}),
+		/* @__PURE__ */ d("div", {
+			"data-part": "scrim",
+			onKeyDown: ae,
+			ref: z,
+			...I ? { "data-loading": "" } : {},
+			children: H ? se : null
+		})
+	] }), Q = {
+		...ie,
+		...A === "region" && I ? { "aria-busy": !0 } : {},
+		children: ce,
+		"data-part": "root",
+		"data-scope": A,
+		"data-size": F.size,
+		"data-ui": "loading-overlay",
+		"data-veil": F.veil,
+		...I ? { "data-loading": "" } : {}
+	}, $ = O === void 0 ? /* @__PURE__ */ d("div", {
+		...Q,
+		ref: X
+	}) : O({
+		...Q,
+		ref: X
+	});
+	return A === "page" ? q === null ? null : (0, y.createPortal)($, q) : $;
+}
+//#endregion
+export { S as n, x as r, w as t };

package/dist/loading-overlay.js

@@ -0,0 +1,2 @@
+import { n as e, r as t, t as n } from "./loading-overlay-B83XFctM.js";
+export { n as LoadingOverlay, e as LoadingOverlayDefaultsProvider, t as useLoadingOverlayDefaults };

package/dist/markdown-CpfDn1LF.js

@@ -0,0 +1,295 @@
+import { n as e, t } from "./icon-T9Yt4tnm.js";
+import { r as n } from "./i18n-DpW8lqJ1.js";
+import { a as r, i, r as a, t as o } from "./alert-CP62p9Ul.js";
+import { n as s } from "./icon-button-TnvMhK4o.js";
+import { t as c } from "./inline-message-C4a-A2mw.js";
+import { t as l } from "./checkbox-CwUOc-3u.js";
+import { t as u } from "./code-block-CFHf8uTm.js";
+import { n as d, o as f, t as p } from "./skeleton-2LSpg84Z.js";
+import { t as m } from "./visually-hidden-CE6u5JLW.js";
+import { t as h } from "./link-TjvRl2VQ.js";
+import { c as g, i as _, n as v, o as y, t as b } from "./prose-CkeNYS0X.js";
+import { Fragment as x, createContext as S, createElement as C, useContext as w, useEffect as T, useMemo as E, useRef as D, useState as O } from "react";
+import { Fragment as k, jsx as A, jsxs as j } from "react/jsx-runtime";
+import { markdownMessages as M } from "@slotted/core/i18n";
+import { initialLoadingVisibility as N, nextLoadingVisibility as P } from "@slotted/core/loading";
+import { MARKDOWN_KINDS as F, prepareMarkdown as I } from "@slotted/core/markdown";
+//#region src/markdown/markdown-defaults.tsx
+var L = S({});
+function R() {
+	return w(L);
+}
+function z({ children: e, ...t }) {
+	let n = R();
+	return /* @__PURE__ */ A(L.Provider, {
+		value: {
+			alerts: t.alerts ?? n.alerts,
+			allow: t.allow ?? n.allow,
+			external: t.external ?? n.external,
+			headingAnchors: t.headingAnchors ?? n.headingAnchors,
+			isExternal: t.isExternal ?? n.isExternal,
+			transformUrl: t.transformUrl ?? n.transformUrl
+		},
+		children: e
+	});
+}
+//#endregion
+//#region src/markdown/markdown.tsx
+var B = new Set(F);
+function V({ alerts: e, allow: t, empty: r, extensions: i, external: a, flow: o, headingAnchors: l, headingOffset: u, idPrefix: m, isExternal: h, loading: _ = !1, messages: v, onRetry: b, onTaskChange: x, render: S, renderers: C, size: w, status: T = "ready", streaming: D = !1, transformUrl: O, tree: k, unwrapDisallowed: N, ...P }) {
+	let F = R(), L = g(), z = f(), B = n(M, v), V = o ?? L.flow, U = O ?? F.transformUrl, W = h ?? F.isExternal, G = t ?? F.allow, K = e ?? F.alerts ?? !0, J = E(() => Object.keys(i ?? {}).join("\n"), [i]), Y = E(() => I(k, {
+		alerts: K,
+		allow: G,
+		custom: J ? J.split("\n") : [],
+		headingOffset: u,
+		idPrefix: m,
+		isExternal: W,
+		transformUrl: U,
+		unwrapDisallowed: N
+	}), [
+		k,
+		K,
+		G,
+		J,
+		u,
+		m,
+		W,
+		U,
+		N
+	]), X = ee({
+		delay: z.delay ?? 0,
+		loading: _,
+		minDuration: z.minDuration ?? 0
+	}), Z = {
+		document: Y,
+		extensions: i ?? {},
+		external: a ?? F.external ?? "new-tab",
+		headingAnchors: l ?? F.headingAnchors ?? !1,
+		onTaskChange: x,
+		t: B,
+		renderers: C ?? {}
+	}, Q;
+	Q = T === "error" ? /* @__PURE__ */ j("div", {
+		"data-part": "error",
+		children: [/* @__PURE__ */ A(c, {
+			tone: "danger",
+			children: B("error")
+		}), b === void 0 ? null : /* @__PURE__ */ A(s, {
+			onClick: (e) => b(e.detail === 0 ? "keyboard" : "pointer"),
+			size: "sm",
+			tone: "secondary",
+			variant: "outline",
+			children: B("retry")
+		})]
+	}) : X ? /* @__PURE__ */ A(d, {
+		delay: 0,
+		messages: { label: B("loading") },
+		loading: !0,
+		minDuration: 0,
+		children: /* @__PURE__ */ A(y, {
+			flow: V,
+			size: w,
+			children: /* @__PURE__ */ A(p, {
+				lastLineSize: "62%",
+				lines: 3
+			})
+		})
+	}) : Y.empty ? _ ? null : /* @__PURE__ */ A("p", {
+		"data-part": "empty",
+		children: r ?? B("empty")
+	}) : /* @__PURE__ */ j(y, {
+		flow: V,
+		size: w,
+		children: [H(Y.children, Z), q(Y, Z)]
+	});
+	let $ = {
+		...P,
+		"aria-busy": D || X || void 0,
+		children: Q,
+		"data-empty": T === "ready" && !X && Y.empty || void 0,
+		"data-flow": V,
+		"data-loading": X || void 0,
+		"data-part": "root",
+		"data-status": T,
+		"data-streaming": D || void 0,
+		"data-ui": "markdown"
+	};
+	return S === void 0 ? /* @__PURE__ */ A("div", { ...$ }) : S($);
+}
+function H(e, t) {
+	return e.map((e) => /* @__PURE__ */ A(x, { children: U(e, t) }, e.key));
+}
+function U(e, t) {
+	let n = "children" in e ? W(e, t) : null;
+	if (e.kind === "custom") {
+		let r = t.extensions[e.type];
+		return r === void 0 ? n : r({
+			children: n,
+			element: e
+		});
+	}
+	if (B.has(e.kind)) {
+		let r = t.renderers[e.kind];
+		if (r !== void 0) return r({
+			children: n,
+			element: e
+		});
+	}
+	return G(e, n, t);
+}
+function W(e, t) {
+	return e.kind === "list" || "children" in e ? H(e.children, t) : null;
+}
+function G(e, t, n) {
+	switch (e.kind) {
+		case "text": return e.value;
+		case "inlineCode": return /* @__PURE__ */ A("code", { children: e.value });
+		case "break": return /* @__PURE__ */ A("br", {});
+		case "thematicBreak": return /* @__PURE__ */ A("hr", {});
+		case "paragraph": return /* @__PURE__ */ A("p", { children: t });
+		case "emphasis": return /* @__PURE__ */ A("em", { children: t });
+		case "strong": return /* @__PURE__ */ A("strong", { children: t });
+		case "delete": return /* @__PURE__ */ A("del", { children: t });
+		case "blockquote": return /* @__PURE__ */ A("blockquote", { children: t });
+		case "heading": return C(`h${e.level}`, { id: e.id }, t, n.headingAnchors ? /* @__PURE__ */ A(v, {
+			"aria-label": n.t("anchor", { heading: e.text }),
+			href: `#${e.id}`,
+			children: "#"
+		}) : null);
+		case "alert": return /* @__PURE__ */ A("div", {
+			"data-part": "embed",
+			children: /* @__PURE__ */ A(o, {
+				live: "off",
+				reach: "section",
+				tone: e.tone,
+				children: /* @__PURE__ */ j(a, { children: [/* @__PURE__ */ A(r, { children: n.t(`alerts.${e.type}`) }), /* @__PURE__ */ A(i, {
+					render: ({ children: e, ...t }) => /* @__PURE__ */ A("div", {
+						...t,
+						children: e
+					}),
+					children: /* @__PURE__ */ A("div", {
+						"data-part": "alert-body",
+						children: t
+					})
+				})] })
+			})
+		});
+		case "list": {
+			let n = e.task ? "task-list" : void 0;
+			return e.ordered ? /* @__PURE__ */ A("ol", {
+				"data-part": n,
+				start: e.start ?? void 0,
+				children: t
+			}) : /* @__PURE__ */ A("ul", {
+				"data-part": n,
+				children: t
+			});
+		}
+		case "item": return e.checked === null ? /* @__PURE__ */ A("li", { children: t }) : K(e, t, n);
+		case "code": return /* @__PURE__ */ A("div", {
+			"data-part": "embed",
+			children: /* @__PURE__ */ A(u, {
+				code: e.code,
+				language: e.language ?? void 0,
+				lineNumbers: e.lineNumbers || void 0,
+				marks: e.highlight === null ? void 0 : { highlight: e.highlight },
+				title: e.title ?? void 0
+			})
+		});
+		case "table": return /* @__PURE__ */ A(b, { children: /* @__PURE__ */ j("table", { children: [/* @__PURE__ */ A("thead", { children: /* @__PURE__ */ A("tr", { children: e.head.map((e) => /* @__PURE__ */ A("th", {
+			"data-align": e.align ?? void 0,
+			scope: "col",
+			children: H(e.children, n)
+		}, e.key)) }) }), e.rows.length === 0 ? null : /* @__PURE__ */ A("tbody", { children: e.rows.map((e, t) => /* @__PURE__ */ A("tr", { children: e.map((e) => /* @__PURE__ */ A("td", {
+			"data-align": e.align ?? void 0,
+			children: H(e.children, n)
+		}, e.key)) }, e[0]?.key ?? t)) })] }) });
+		case "link": return e.external && n.external === "new-tab" ? /* @__PURE__ */ A(h, {
+			external: !0,
+			href: e.href,
+			title: e.title ?? void 0,
+			children: t
+		}) : /* @__PURE__ */ A("a", {
+			href: e.href,
+			title: e.title ?? void 0,
+			children: t
+		});
+		case "image": return /* @__PURE__ */ A("img", {
+			alt: e.alt,
+			decoding: "async",
+			loading: "lazy",
+			src: e.src,
+			title: e.title ?? void 0
+		});
+		case "footnoteReference": return /* @__PURE__ */ A("sup", { children: /* @__PURE__ */ A("a", {
+			"aria-describedby": n.document.footnoteLabelId,
+			"data-footnote-ref": "",
+			href: `#${e.target}`,
+			id: e.id,
+			children: e.number
+		}) });
+		case "custom": return t;
+	}
+}
+function K(e, t, n) {
+	let { onTaskChange: r } = n, i = e.task ?? 0;
+	return /* @__PURE__ */ j("li", {
+		"data-part": "task",
+		children: [/* @__PURE__ */ A(l, {
+			"aria-label": e.label,
+			checked: e.checked === !0,
+			onCheckedChange: r === void 0 ? void 0 : (t, n) => {
+				let a = {
+					checked: t,
+					index: i,
+					offset: e.offset
+				};
+				r(a, n);
+			},
+			readOnly: r === void 0 || void 0
+		}), /* @__PURE__ */ A("div", {
+			"data-part": "task-body",
+			children: t
+		})]
+	});
+}
+function q(e, t) {
+	return e.footnotes.length === 0 ? null : /* @__PURE__ */ j(_, { children: [/* @__PURE__ */ A(m, {
+		id: e.footnoteLabelId,
+		render: (e) => /* @__PURE__ */ A("h2", { ...e }),
+		children: t.t("footnotes")
+	}), /* @__PURE__ */ A("ol", { children: e.footnotes.map((e) => /* @__PURE__ */ A("li", {
+		id: e.id,
+		children: J(e, t)
+	}, e.key)) })] });
+}
+function J(n, r) {
+	let i = n.references.map((i, a) => /* @__PURE__ */ A("a", {
+		"aria-label": r.t("backReference", {
+			number: n.number,
+			occurrence: a + 1
+		}),
+		"data-part": "backref",
+		href: `#${i}`,
+		children: /* @__PURE__ */ A(t, { children: /* @__PURE__ */ A(e, { name: "arrow-left" }) })
+	}, i)), a = n.children.at(-1);
+	return a?.kind === "paragraph" ? /* @__PURE__ */ j(k, { children: [H(n.children.slice(0, -1), r), /* @__PURE__ */ j("p", { children: [H(a.children, r), i] }, a.key)] }) : /* @__PURE__ */ j(k, { children: [H(n.children, r), i] });
+}
+function ee({ delay: e, loading: t, minDuration: n }) {
+	let r = D(N), [, i] = O(0), a = P({
+		delay: e,
+		loading: t,
+		minDuration: n,
+		now: Date.now(),
+		state: r.current
+	});
+	r.current = a.state;
+	let { wait: o } = a;
+	return T(() => {
+		if (o === null) return;
+		let e = setTimeout(() => i((e) => e + 1), o);
+		return () => clearTimeout(e);
+	}, [o, t]), a.state.visible;
+}
+//#endregion
+export { z as n, R as r, V as t };

package/dist/markdown.js

@@ -0,0 +1,2 @@
+import { n as e, r as t, t as n } from "./markdown-CpfDn1LF.js";
+export { n as Markdown, e as MarkdownDefaultsProvider, t as useMarkdownDefaults };