@mechane-ai/elements 0.8.0 → 0.10.0

package/dist/charts/timeline.js

@@ -1,15 +1,16 @@
-import { c as e } from "../src-Bc5sEhdO.js";
-import * as t from "@stylexjs/stylex";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
-import { scaleLinear as i } from "@visx/scale";
-import { Bar as a } from "@visx/shape";
+import { c as e } from "../src-sU9b0oZW.js";
+import { n as t, t as n } from "../chart-input-CdLkFomi.js";
+import * as r from "@stylexjs/stylex";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { scaleLinear as o } from "@visx/scale";
+import { Bar as s } from "@visx/shape";
 // packages/charts/src/timeline/waterfall.tsx
-var o = {
+var c = {
 	plot: {
 		k7Eaqz: "xeuugli",
 		kUOVxO: "xl4o6ss",
-		kBCFzs: "x1npkx4u xp7zxbh",
-		kbNqZ1: "x1ms6mhf xq5skvx",
+		kBCFzs: "x1npkx4u x1v577k8",
+		kbNqZ1: "x1ms6mhf x1aa6nly",
 		$$css: !0
 	},
 	neutral: {
@@ -24,162 +25,187 @@ var o = {
 		kMwMTN: "xr5kp14",
 		$$css: !0
 	}
-}, s = {
-	neutral: o.neutral,
-	positive: o.positive,
-	negative: o.negative
-}, c = [
+}, l = {
+	neutral: c.neutral,
+	positive: c.positive,
+	negative: c.negative
+}, u = [
 	0,
 	.5,
 	1
-], l = 100;
-function u({ items: a, start: u, end: p, label: m, rowLabel: h, summaryLabel: g, emptyLabel: _, selectedId: v, onSelect: y, formatOffset: b }) {
-	let x = p - u, S = i({
-		domain: [u, p],
-		range: [0, x === 0 ? 0 : l]
-	}), C = x > 0 ? c : [0];
-	return /* @__PURE__ */ r("div", {
+], d = 100;
+function f({ items: t, start: s, end: f, label: g, rowLabel: _, summaryLabel: v, emptyLabel: y, selectedId: b, onSelect: x, formatOffset: S }) {
+	let C = p({
+		items: t,
+		start: s,
+		end: f
+	});
+	if (C !== void 0) return /* @__PURE__ */ i(n, {
+		title: g,
+		message: C
+	});
+	let w = f - s, T = o({
+		domain: [s, f],
+		range: [0, w === 0 ? 0 : d]
+	}), E = w > 0 ? u : [0];
+	return /* @__PURE__ */ a("div", {
 		role: "group",
-		"aria-label": m,
-		className: "xeuugli x1hz01jw",
+		"aria-label": g,
+		className: "xeuugli x1hz01jw x12h1iku",
 		children: [
-			/* @__PURE__ */ r("div", {
-				className: "xrvj5dj x13sfnbj xj8mwme x6s0dn4 x1mw73un xq5c7ks xh8yej3 x9f619 xqin4a2 xu0aao5 x153jb6y xy8obcc xso031l x1q0q8m5 x1qndepd",
+			/* @__PURE__ */ a("div", {
+				className: "xrvj5dj x13sfnbj x1prkh4w x6s0dn4 x1gkm1c7 x1y1mm1b xh8yej3 x9f619 x1doqdfy x1uey4wk x153jb6y xy8obcc xso031l x1q0q8m5 x1qndepd",
 				children: [
-					/* @__PURE__ */ n(e, {
+					/* @__PURE__ */ i(e, {
 						variant: "caption",
 						tone: "muted",
-						children: h
+						children: _
 					}),
-					/* @__PURE__ */ n("div", {
-						className: "xeuugli xl4o6ss x1npkx4u xp7zxbh x1ms6mhf xq5skvx x78zum5 x1qughib x6s0dn4 xy8obcc xas2l8k xss6m8b",
-						children: C.map((e) => /* @__PURE__ */ n("span", { children: b(x * e) }, e))
+					/* @__PURE__ */ i("div", {
+						className: "xeuugli xl4o6ss x1npkx4u x1v577k8 x1ms6mhf x1aa6nly x78zum5 x1qughib x6s0dn4 xy8obcc xas2l8k xss6m8b",
+						children: E.map((e) => /* @__PURE__ */ i("span", { children: S(w * e) }, e))
 					}),
-					/* @__PURE__ */ n("span", {
-						className: "xeuugli x1k3v4rp x1moszlt x1ms6mhf xp4054r xj0a0fe xss6m8b",
-						children: /* @__PURE__ */ n(e, {
+					/* @__PURE__ */ i("span", {
+						className: "xrvj5dj xfko13i xeuugli x1k3v4rp x14r0xmm x1ms6mhf xp4054r xj0a0fe xss6m8b",
+						children: /* @__PURE__ */ i(e, {
 							variant: "caption",
 							tone: "muted",
-							children: g
+							children: v
 						})
 					})
 				]
 			}),
-			a.length === 0 && /* @__PURE__ */ n("p", {
+			t.length === 0 && /* @__PURE__ */ i("p", {
 				className: "x1ghz6dp x1c8xbx5",
-				children: /* @__PURE__ */ n(e, {
+				children: /* @__PURE__ */ i(e, {
 					tone: "muted",
-					children: _
+					children: y
 				})
 			}),
-			a.map((i) => {
-				let a = f({
-					geometry: i.geometry,
-					start: u,
-					formatOffset: b
+			t.map((t) => {
+				let n = h({
+					geometry: t.geometry,
+					start: s,
+					formatOffset: S
 				});
-				return /* @__PURE__ */ r("button", {
+				return /* @__PURE__ */ a("button", {
 					type: "button",
-					"aria-pressed": v === i.id,
-					"aria-label": `${i.label} · ${i.detail} · ${i.summary} · ${a}`,
-					onClick: () => y(i.id),
+					"aria-pressed": b === t.id,
+					"aria-label": `${t.label} · ${t.detail} · ${t.summary} · ${n}`,
+					onClick: () => x(t.id),
 					...{
-						0: { className: "xrvj5dj x13sfnbj xj8mwme x6s0dn4 x1mw73un xq5c7ks xh8yej3 x9f619 xqin4a2 xn9t2bk x1wiwyrm xc342km xso031l x1q0q8m5 x1qndepd xpvm0e4 xbixft x1hz01jw x1yc453h x1ypdohk xzro8vx x19rmrnh x9v5kkp x13qnu6 x1bqaal x1t1lzn6" },
-						1: { className: "xrvj5dj x13sfnbj xj8mwme x6s0dn4 x1mw73un xq5c7ks xh8yej3 x9f619 xqin4a2 xn9t2bk x1wiwyrm xc342km xso031l x1q0q8m5 x1qndepd xbixft x1hz01jw x1yc453h x1ypdohk xzro8vx x19rmrnh x9v5kkp x13qnu6 x1bqaal x1t1lzn6 x1r7kqkb x1jmj9dw" }
-					}[v === i.id | 0],
+						0: { className: "xrvj5dj x13sfnbj x1prkh4w x6s0dn4 x1gkm1c7 x1y1mm1b xh8yej3 x9f619 x1doqdfy xn9t2bk x1wiwyrm xc342km xso031l x1q0q8m5 x1qndepd xpvm0e4 xbixft x1hz01jw x1yc453h x1ypdohk x1t137rt xzro8vx x1ecmtor x19rmrnh x9v5kkp x13qnu6 x1bqaal x1t1lzn6" },
+						1: { className: "xrvj5dj x13sfnbj x1prkh4w x6s0dn4 x1gkm1c7 x1y1mm1b xh8yej3 x9f619 x1doqdfy xn9t2bk x1wiwyrm xc342km xso031l x1q0q8m5 x1qndepd xbixft x1hz01jw x1yc453h x1ypdohk x1t137rt xzro8vx x1ecmtor x19rmrnh x9v5kkp x13qnu6 x1bqaal x1t1lzn6 x1r7kqkb x1jmj9dw" }
+					}[b === t.id | 0],
 					children: [
-						/* @__PURE__ */ r("span", {
+						/* @__PURE__ */ a("span", {
 							className: "xeuugli xrvj5dj xfko13i",
-							children: [/* @__PURE__ */ n("span", {
-								className: "xk50ysn xj0a0fe",
-								children: /* @__PURE__ */ n(e, { children: i.label })
-							}), /* @__PURE__ */ n("span", {
-								title: i.detail,
-								className: "xb3r6kr xuxw1ft xlyipyv",
-								children: /* @__PURE__ */ n(e, {
+							children: [/* @__PURE__ */ i(e, { children: t.label }), /* @__PURE__ */ i("span", {
+								title: t.detail,
+								...{
+									0: { className: "xb3r6kr xuxw1ft xlyipyv" },
+									1: { className: "xb3r6kr xlyipyv xeaf4i8 xj0a0fe" }
+								}[b === t.id | 0],
+								children: /* @__PURE__ */ i(e, {
 									variant: "caption",
 									tone: "muted",
-									children: i.detail
+									children: t.detail
 								})
 							})]
 						}),
-						/* @__PURE__ */ n("span", {
-							title: a,
-							...t.props(o.plot, s[i.tone]),
-							children: i.geometry.kind === "unavailable" ? /* @__PURE__ */ n(e, {
+						/* @__PURE__ */ i("span", {
+							title: n,
+							...r.props(c.plot, l[t.tone]),
+							children: t.geometry.kind === "unavailable" ? /* @__PURE__ */ i(e, {
 								variant: "caption",
 								tone: "muted",
-								children: a
-							}) : /* @__PURE__ */ r("svg", {
+								children: n
+							}) : /* @__PURE__ */ a("svg", {
 								"aria-hidden": !0,
 								className: "x1lliihq xh8yej3 xmix8c7 x1rea2x4",
-								children: [C.map((e) => /* @__PURE__ */ n("line", {
-									x1: `${e * l}%`,
-									x2: `${e * l}%`,
+								children: [E.map((e) => /* @__PURE__ */ i("line", {
+									x1: `${e * d}%`,
+									x2: `${e * d}%`,
 									y1: "0",
 									y2: "18",
 									className: "x13hfdr1"
-								}, e)), /* @__PURE__ */ n(d, {
-									geometry: i.geometry,
-									scale: S
+								}, e)), /* @__PURE__ */ i(m, {
+									geometry: t.geometry,
+									scale: T
 								})]
 							})
 						}),
-						/* @__PURE__ */ n("span", {
-							className: "xeuugli x1k3v4rp x1moszlt x1ms6mhf xp4054r xj0a0fe xss6m8b",
-							children: /* @__PURE__ */ n(e, {
+						/* @__PURE__ */ a("span", {
+							className: "xrvj5dj xfko13i xeuugli x1k3v4rp x14r0xmm x1ms6mhf xp4054r xj0a0fe xss6m8b",
+							children: [/* @__PURE__ */ i(e, {
 								variant: "caption",
 								tone: "muted",
-								children: i.summary
-							})
+								children: t.summary
+							}), b === t.id && /* @__PURE__ */ i(e, {
+								variant: "caption",
+								tone: "muted",
+								children: n
+							})]
 						})
 					]
-				}, i.id);
+				}, t.id);
 			})
 		]
 	});
 }
-function d({ geometry: e, scale: t }) {
+function p({ items: e, start: n, end: r }) {
+	if (!Number.isFinite(n) || !Number.isFinite(r) || !Number.isFinite(r - n) || r < n) return "The timing domain must have finite, ordered endpoints.";
+	if (!t(e)) return "Timing records must have unique identifiers.";
+	for (let t of e) {
+		let e = t.geometry;
+		if (e.kind === "interval") {
+			if (!Number.isFinite(e.start) || !Number.isFinite(e.end) || e.end < e.start) return "Timing intervals must have finite, ordered endpoints.";
+			if (e.start < n || e.end > r) return "Timing intervals must fit inside the supplied domain.";
+		}
+		if (e.kind === "point" && (!Number.isFinite(e.at) || e.at < n || e.at > r)) return "Timing points must be finite and fit inside the supplied domain.";
+	}
+}
+function m({ geometry: e, scale: t }) {
 	switch (e.kind) {
 		case "unavailable": return null;
 		case "interval": {
-			let r = t(e.start), i = t(e.end) - r;
-			return i === 0 ? /* @__PURE__ */ n("circle", {
-				cx: `${r}%`,
+			let n = t(e.start), r = t(e.end) - n;
+			return r === 0 ? /* @__PURE__ */ i("circle", {
+				cx: `${n}%`,
 				cy: 9,
 				r: 3,
 				className: "x117rol3"
-			}) : /* @__PURE__ */ n(a, {
-				x: `${r}%`,
+			}) : /* @__PURE__ */ i(s, {
+				x: `${n}%`,
 				y: 6,
-				width: `${i}%`,
+				width: `${r}%`,
 				height: 6,
 				rx: 2,
 				className: "x117rol3"
 			});
 		}
 		case "point": {
-			let r = t(e.at);
+			let n = t(e.at);
 			switch (e.marker) {
-				case "filled": return /* @__PURE__ */ n("circle", {
-					cx: `${r}%`,
+				case "filled": return /* @__PURE__ */ i("circle", {
+					cx: `${n}%`,
 					cy: 9,
 					r: 3,
 					className: "x117rol3"
 				});
-				case "hollow": return /* @__PURE__ */ n("circle", {
-					cx: `${r}%`,
+				case "hollow": return /* @__PURE__ */ i("circle", {
+					cx: `${n}%`,
 					cy: 9,
 					r: 3.5,
 					className: "x1fytgo2 x73je2i xvlca1e"
 				});
-				case "diamond": return /* @__PURE__ */ n("svg", {
-					x: `${r}%`,
+				case "diamond": return /* @__PURE__ */ i("svg", {
+					x: `${n}%`,
 					y: 9,
 					width: 1,
 					height: 1,
 					overflow: "visible",
-					children: /* @__PURE__ */ n("path", {
+					children: /* @__PURE__ */ i("path", {
 						d: "M0 -5 5 0 0 5 -5 0Z",
 						className: "x117rol3"
 					})
@@ -188,11 +214,11 @@ function d({ geometry: e, scale: t }) {
 		}
 	}
 }
-function f({ geometry: e, start: t, formatOffset: n }) {
+function h({ geometry: e, start: t, formatOffset: n }) {
 	switch (e.kind) {
 		case "interval": return `Start ${n(e.start - t)}, end ${n(e.end - t)}, duration ${n(e.end - e.start)}`;
 		case "point": return `At ${n(e.at - t)}`;
 		case "unavailable": return "Timing unavailable";
 	}
 }
-export { u as Waterfall };
+export { f as Waterfall };

package/dist/charts.js

@@ -1 +1 @@
-export { r as ChartFrame, i as ChartLegend } from "./chart-frame-DgPdIguO.js";
+export { r as ChartFrame, i as ChartLegend } from "./chart-frame-et6f6Vhg.js";

package/dist/code-block-D77maJBB.js

@@ -0,0 +1,180 @@
+import { _ as e } from "./src-sU9b0oZW.js";
+import { colors as t } from "./tokens.js";
+import { t as n } from "./viewer-styles-CpHqp5Qv.js";
+import { t as r } from "./pierre-theme-D9hnHv3Z.js";
+import * as i from "@stylexjs/stylex";
+import { useEffect as a, useRef as o, useState as s } from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+// packages/content/src/code/use-highlighted-code.ts
+var u = 2e5, d = 4096;
+function f(e, t) {
+	let n = o(null), [i, c] = s();
+	return a(() => () => {
+		n.current !== null && (n.current.tokenizer.dispose(), n.current = null);
+	}, []), a(() => {
+		let i = !0;
+		async function a() {
+			try {
+				let a = await import("@pierre/highlights");
+				if (!i || e.length > u || !a.isSupportedLanguage(t)) return;
+				let o = n.current, s = o !== null && o.language === t, l = s ? o : {
+					language: t,
+					source: e,
+					tokenizer: new a.LiveTokenizer({
+						code: e,
+						lang: t,
+						theme: r,
+						tokenizeMaxLineLength: d
+					})
+				};
+				if (s) {
+					if (e.startsWith(o.source)) {
+						let t = l.tokenizer.lineCount - 1, n = {
+							line: t,
+							character: l.tokenizer.getLineLength(t)
+						};
+						l.tokenizer.applyEdits([{
+							range: {
+								start: n,
+								end: n
+							},
+							newText: e.slice(o.source.length)
+						}]);
+					} else l.tokenizer.reset(e);
+				} else o !== null && o.tokenizer.dispose();
+				n.current = {
+					...l,
+					source: e
+				};
+				let f = l.tokenizer;
+				f.flush();
+				let p = Array.from({ length: f.lineCount }, (e, t) => f.getLineTokens(t).tokens);
+				c({
+					code: e,
+					language: t,
+					lines: p,
+					hasFailed: !1
+				});
+			} catch {
+				i && c({
+					code: e,
+					language: t,
+					lines: [],
+					hasFailed: !0
+				});
+			}
+		}
+		return a(), () => {
+			i = !1;
+		};
+	}, [e, t]), i !== void 0 && i.code === e && i.language === t ? i : void 0;
+}
+// packages/content/src/code/code-block.tsx
+var p = {
+	kVQacm: "xysyzu8",
+	k9g6sI: "x12h1iku",
+	$$css: !0
+}, m = {
+	viewport: (e) => [
+		p,
+		{
+			kskxy: e == null ? e : "x1jols5v",
+			$$css: !0
+		},
+		{ "--x-maxHeight": ((e) => typeof e == "number" ? e + "px" : e ?? void 0)(e) }
+	],
+	token: (e) => [{
+		kMwMTN: e == null ? e : "x14rh7hd",
+		$$css: !0
+	}, { "--x-color": e ?? void 0 }],
+	italic: {
+		kKX8nH: "x1k4tb9n",
+		$$css: !0
+	},
+	bold: {
+		k63SB2: "x1b5ytql",
+		$$css: !0
+	}
+}, h = 2e5;
+function g({ token: e }) {
+	let n = e.fontStyle ?? 0, [r, a] = [!!(n & 1), !!(n & 2)];
+	return /* @__PURE__ */ c("span", {
+		...i.props(m.token(e.color ?? t.ink), r && m.italic, a && m.bold),
+		children: e.content
+	});
+}
+function _({ code: t, language: r = "text", filename: a, streaming: o = !1, wrap: s = !1, lineNumbers: u = !0, selectedLines: d, annotations: p = [], maxHeight: _ = 400, maxLines: v = 2e3 }) {
+	let y = f(t, r), b = t.slice(0, h).split(/\r\n|\n|\r/u), x = b.slice(0, Math.max(1, v)).map((e, t) => ({
+		text: e,
+		line: t + 1
+	})), S = a ?? r;
+	return /* @__PURE__ */ l("section", {
+		"aria-label": a ?? "Code",
+		...i.props(n.root),
+		children: [
+			/* @__PURE__ */ l("div", {
+				...i.props(n.header),
+				children: [/* @__PURE__ */ l("span", {
+					...i.props(n.label),
+					children: [S, o && " · streaming"]
+				}), /* @__PURE__ */ c(e, {
+					label: a ?? "code",
+					value: t,
+					children: "Copy"
+				})]
+			}),
+			/* @__PURE__ */ c("div", {
+				role: "region",
+				"aria-label": `${S} source`,
+				tabIndex: 0,
+				...i.props(n.scrollRegion, m.viewport(_)),
+				children: /* @__PURE__ */ c("pre", {
+					...{
+						0: { className: "x1ghz6dp xn9t2bk xiard35 xy8obcc x1778rvt xeq4nuv xk8lq53" },
+						1: { className: "x1ghz6dp xn9t2bk xiard35 xy8obcc x1778rvt xeq4nuv xeuugli x126k92a xj0a0fe" }
+					}[!!s | 0],
+					children: /* @__PURE__ */ c("code", {
+						className: "xjb2p0i",
+						children: x.map(({ text: e, line: t }) => {
+							let n = y === void 0 ? void 0 : y.lines[t - 1], r = d !== void 0 && t >= d.start && t <= (d.end ?? d.start), i = p.find((e) => e.line === t);
+							return /* @__PURE__ */ l("span", { children: [/* @__PURE__ */ l("span", {
+								...{
+									0: { className: "x78zum5 x16exltd" },
+									1: { className: "x78zum5 x16exltd x1r8u7ye" }
+								}[!!r | 0],
+								children: [u && /* @__PURE__ */ c("span", {
+									"aria-hidden": !0,
+									className: "x1rg5ohu x2lah0s xl3ry0p x5g2kb4 xp4054r x153jb6y x87ps6o",
+									children: t
+								}), /* @__PURE__ */ l("span", {
+									className: "x1lliihq x12lumcd x1doqdfy xeuugli",
+									children: [n === void 0 ? e : n.map((e) => /* @__PURE__ */ c(g, { token: e }, e.offset)), e.length === 0 && "\n"]
+								})]
+							}), i !== void 0 && /* @__PURE__ */ c("span", {
+								className: "x1lliihq x9f619 x7wzq59 x1o0tod xzfn7dr x1mvvolr x1r7kqkb x1hz01jw xtqrqnz x1778rvt xeaf4i8 xj0a0fe",
+								children: i.content
+							})] }, t);
+						})
+					})
+				})
+			}),
+			b.length > x.length && /* @__PURE__ */ c("div", {
+				...i.props(n.note),
+				children: "Additional lines omitted. Copy includes the complete source."
+			}),
+			t.length > h && /* @__PURE__ */ c("div", {
+				...i.props(n.note),
+				children: "Preview limited to the first 200,000 characters. Copy includes the complete source."
+			}),
+			t.length === 0 && /* @__PURE__ */ c("div", {
+				...i.props(n.note),
+				children: "No source text."
+			}),
+			y !== void 0 && y.hasFailed && /* @__PURE__ */ c("div", {
+				...i.props(n.note),
+				children: "Syntax highlighting unavailable. The source is shown unchanged."
+			})
+		]
+	});
+}
+export { _ as t };