@servicetitan/json-render-react 0.2.0 → 0.3.1

package/dist/json-render-react.js

@@ -1,1183 +0,0 @@
-import { defineCatalog as e, getByPath as t } from "@json-render/core";
-import { JSONUIProvider as n, Renderer as r, createStateStore as i, defineRegistry as a, useStateStore as o } from "@json-render/react";
-import { schema as s } from "@json-render/react/schema";
-import { z as c } from "zod";
-import { Alert as l, Badge as u, Button as d, Card as f, Checkbox as ee, Chip as te, Divider as ne, FieldLabel as re, Flex as p, Grid as ie, Icon as ae, Link as m, Listbox as h, ProgressBar as g, Radio as _, Switch as oe, Text as v, TextField as se, Textarea as ce } from "@servicetitan/anvil2";
-import { jsx as y, jsxs as b } from "react/jsx-runtime";
-import * as x from "@amcharts/amcharts5";
-import * as S from "@amcharts/amcharts5/xy";
-import { Children as C, useEffect as w, useMemo as T, useRef as E } from "react";
-import le from "@amcharts/amcharts5/themes/Animated";
-import { ThemeCategorical as ue, ThemeMonochrome as D, ThemeSemantic as de } from "@servicetitan/anvil2-ext-charts/am5";
-import O from "@servicetitan/anvil2/assets/icons/material/round/check_circle.svg";
-import k from "@servicetitan/anvil2/assets/icons/material/round/radio_button_unchecked.svg";
-import A from "@servicetitan/anvil2/assets/icons/st/in_progress.svg";
-import * as j from "@amcharts/amcharts5/percent";
-//#region src/core/actions.ts
-var M = {
-	"atlas.submitUserAction": {
-		params: c.object({
-			data: c.record(c.string(), c.unknown()).optional(),
-			actionId: c.string().optional()
-		}),
-		description: "Submit form data. actionId overrides default \"form_submit\" identifier."
-	},
-	"atlas.navigate": {
-		params: c.object({ url: c.string() }),
-		description: "Navigate to a URL or internal route. External URLs (http/https) open in a new tab; internal route strings navigate within the app."
-	},
-	"atlas.toolCall": {
-		params: c.object({
-			tool: c.string(),
-			args: c.record(c.string(), c.unknown()).optional()
-		}),
-		description: "Invoke a tool on the active artifact panel app (an MCP-backed MFE). args is the tool argument payload; if omitted the current form state is sent."
-	}
-}, fe = {
-	"atlas.submitUserAction": async (e) => {},
-	"atlas.navigate": async (e) => {},
-	"atlas.toolCall": async (e) => {}
-}, N = [
-	"chat",
-	"panel",
-	"app"
-], P = {
-	props: c.object({
-		title: c.string(),
-		status: c.enum([
-			"info",
-			"success",
-			"warning",
-			"danger"
-		]).optional(),
-		dismissible: c.boolean().optional()
-	}),
-	slots: ["default"],
-	description: "Alert/notification banner. dismissible: true adds a close button that emits a \"close\" event."
-}, pe = ({ props: e, emit: t, children: n }) => /* @__PURE__ */ y(l, {
-	title: e.title,
-	status: e.status ?? "info",
-	...e.dismissible ? { onClose: () => t("close") } : {},
-	children: n
-});
-//#endregion
-//#region src/utils/defined-props.ts
-function F(e) {
-	let t = {};
-	for (let n of Object.keys(e)) {
-		let r = e[n];
-		r !== void 0 && (t[n] = r);
-	}
-	return t;
-}
-//#endregion
-//#region src/core/catalog/badge.catalog.ts
-var I = {
-	props: c.object({
-		content: c.string().optional(),
-		offset: c.object({
-			x: c.string().optional(),
-			y: c.string().optional()
-		}).optional()
-	}),
-	slots: ["default"],
-	description: "Unread notification count on a Button or Link. Wrap the interactive element as a child of Badge (the renderer adds position:relative). content: numerical count only (e.g. 3, 99+); omit for dot-only. offset: {x, y} CSS values to fine-tune position on non-square anchors like links."
-}, me = "_128xbc80", he = ({ props: e, children: t }) => {
-	let n = e.offset ? F({
-		x: e.offset.x,
-		y: e.offset.y
-	}) : void 0, r = n ? /* @__PURE__ */ y(u, {
-		offset: n,
-		children: e.content
-	}) : /* @__PURE__ */ y(u, { children: e.content });
-	return t ? /* @__PURE__ */ b("div", {
-		className: me,
-		children: [t, r]
-	}) : r;
-}, L = {
-	props: c.object({
-		data: c.array(c.object({
-			category: c.string(),
-			value: c.number()
-		})),
-		orientation: c.enum(["vertical", "horizontal"]).optional(),
-		theme: c.enum([
-			"monochrome",
-			"categorical",
-			"semantic"
-		]).optional(),
-		height: c.number().optional(),
-		unit: c.string().optional()
-	}),
-	slots: [],
-	description: "Bar chart (vertical or horizontal) with Anvil2 theme. data: [{category, value}]. theme: monochrome (default, ≤4 vars), categorical (5-9 distinct), semantic (success/neutral/warning/danger order). unit: tooltip suffix."
-}, R = "zf6dad0";
-//#endregion
-//#region src/core/catalog/chart-utils.ts
-function z(e, t = "monochrome") {
-	let n = {
-		monochrome: D,
-		categorical: ue,
-		semantic: de
-	}[t] ?? D;
-	e.setThemes([le.new(e), n.new(e)]);
-}
-//#endregion
-//#region src/core/catalog/bar-chart.tsx
-var ge = ({ props: e }) => {
-	let t = E(null);
-	return w(() => {
-		let n = t.current;
-		if (!n) return;
-		let r, i = () => {
-			r && r.dispose(), r = x.Root.new(n), z(r, e.theme);
-			let t = r.container.children.push(S.XYChart.new(r, { paddingLeft: 0 }));
-			if (e.orientation === "horizontal") {
-				let n = t.yAxes.push(S.CategoryAxis.new(r, {
-					categoryField: "category",
-					renderer: S.AxisRendererY.new(r, { minGridDistance: 20 })
-				})), i = t.xAxes.push(S.ValueAxis.new(r, { renderer: S.AxisRendererX.new(r, {}) })), a = t.series.push(S.ColumnSeries.new(r, {
-					xAxis: i,
-					yAxis: n,
-					valueXField: "value",
-					categoryYField: "category"
-				}));
-				a.columns.template.setAll({ tooltipText: `{categoryY}: ${e.unit ?? ""}{valueX}` }), n.data.setAll(e.data), a.data.setAll(e.data);
-			} else {
-				let n = t.xAxes.push(S.CategoryAxis.new(r, {
-					categoryField: "category",
-					renderer: S.AxisRendererX.new(r, { minGridDistance: 30 })
-				})), i = t.yAxes.push(S.ValueAxis.new(r, { renderer: S.AxisRendererY.new(r, {}) })), a = t.series.push(S.ColumnSeries.new(r, {
-					xAxis: n,
-					yAxis: i,
-					valueYField: "value",
-					categoryXField: "category"
-				}));
-				a.columns.template.setAll({ tooltipText: `{categoryX}: ${e.unit ?? ""}{valueY}` }), n.data.setAll(e.data), a.data.setAll(e.data);
-			}
-		}, a = new ResizeObserver((e) => {
-			(e[0]?.contentRect.width ?? 0) > 0 && !r && i();
-		});
-		return a.observe(n), n.offsetWidth > 0 && i(), () => {
-			a.disconnect(), r?.dispose();
-		};
-	}, []), /* @__PURE__ */ y("div", {
-		ref: t,
-		className: R,
-		style: { height: e.height ?? 300 }
-	});
-}, B = {
-	props: c.object({
-		label: c.string(),
-		appearance: c.enum([
-			"primary",
-			"secondary",
-			"ghost"
-		]).optional(),
-		size: c.enum([
-			"xsmall",
-			"small",
-			"medium",
-			"large"
-		]).optional(),
-		loading: c.boolean().optional(),
-		disabled: c.boolean().optional()
-	}),
-	slots: [],
-	description: "Clickable button. Every button automatically submits form data when pressed — the element key is used as the actionId to identify which button was clicked. loading: true shows a spinner. disabled: true prevents interaction. size: xsmall | small | medium (default) | large."
-}, _e = ({ props: e, emit: t }) => /* @__PURE__ */ y(d, {
-	appearance: e.appearance ?? "secondary",
-	...F({
-		size: e.size,
-		loading: e.loading,
-		disabled: e.disabled
-	}),
-	onClick: () => t("press"),
-	children: e.label
-}), V = {
-	props: c.object({
-		background: c.enum(["strong", "stronger"]).optional(),
-		padding: c.enum([
-			"0",
-			"xsmall",
-			"small",
-			"medium",
-			"large"
-		]).optional()
-	}),
-	slots: ["default"],
-	description: "White surface with padding; groups related content. background: strong | stronger for elevated surfaces. padding: 0 | xsmall | small | medium (default) | large."
-}, ve = ({ props: e, children: t }) => /* @__PURE__ */ y(f, {
-	...F({
-		background: e.background,
-		padding: e.padding
-	}),
-	children: t
-}), H = {
-	props: c.object({
-		label: c.string(),
-		checked: c.boolean().optional(),
-		disabled: c.boolean().optional()
-	}),
-	slots: [],
-	description: "Checkbox input with label. Use $bindState on checked to track state."
-}, ye = {
-	props: c.object({
-		label: c.string(),
-		size: c.enum(["small", "medium"]).optional(),
-		color: c.string().optional(),
-		icon: c.enum([
-			"check-circle",
-			"in-progress",
-			"radio-button-unchecked"
-		]).optional(),
-		removable: c.boolean().optional()
-	}),
-	slots: [],
-	description: "Inline label pill for metadata, tags, or categories — use for job statuses, not notification counts (use Badge for those). size: small | medium (default). color: any CSS color. icon: optional leading icon. removable: true adds a close button (not available for size=small)."
-}, U = {
-	props: c.object({
-		vertical: c.boolean().optional(),
-		spacing: c.enum([
-			"0",
-			"half",
-			"1",
-			"2",
-			"3",
-			"4",
-			"5",
-			"6",
-			"8",
-			"12"
-		]).optional(),
-		alignContent: c.enum([
-			"start",
-			"center",
-			"end"
-		]).optional()
-	}),
-	slots: [],
-	description: "Divider between sections. vertical: true for vertical separator. spacing: gap around the divider. alignContent: alignment of content within the divider."
-}, W = {
-	props: c.object({
-		data: c.array(c.object({
-			category: c.string(),
-			value: c.number()
-		})),
-		theme: c.enum([
-			"monochrome",
-			"categorical",
-			"semantic"
-		]).optional(),
-		showLegend: c.boolean().optional(),
-		height: c.number().optional(),
-		unit: c.string().optional()
-	}),
-	slots: [],
-	description: "Donut chart with optional legend and Anvil2 theme. data: [{category, value}]. theme: monochrome (≤4 vars), categorical (5-9 distinct), semantic (status values)."
-}, G = {
-	props: c.object({
-		direction: c.enum(["row", "column"]).optional(),
-		gap: c.enum([
-			"1",
-			"2",
-			"3",
-			"4",
-			"5",
-			"6"
-		]).optional(),
-		alignItems: c.enum([
-			"center",
-			"flex-start",
-			"flex-end",
-			"stretch",
-			"baseline"
-		]).optional(),
-		justifyContent: c.enum([
-			"center",
-			"flex-start",
-			"flex-end",
-			"space-between",
-			"space-around",
-			"space-evenly"
-		]).optional(),
-		wrap: c.enum([
-			"wrap",
-			"nowrap",
-			"wrap-reverse"
-		]).optional(),
-		grow: c.number().optional(),
-		shrink: c.number().optional(),
-		inline: c.boolean().optional()
-	}),
-	slots: ["default"],
-	description: "Flex layout container. gap: 1=4px 2=8px 3=12px 4=16px 5=20px 6=24px. grow: 1=fill available width. alignItems: vertical alignment. justifyContent: horizontal distribution."
-}, K = {
-	props: c.object({
-		templateColumns: c.string().optional(),
-		gap: c.enum([
-			"1",
-			"2",
-			"3",
-			"4",
-			"5",
-			"6"
-		]).optional(),
-		bordered: c.boolean().optional()
-	}),
-	slots: ["default"],
-	description: "CSS Grid layout. templateColumns: CSS grid-template-columns value — \"repeat(3, 1fr)\" for equal columns, \"200px 1fr\" for fixed+flex two-column (e.g. key-value tables), \"1fr 1fr 80px\" for multi-column tables. Children flow into grid cells left-to-right, top-to-bottom. gap: 1=4px … 6=24px. bordered: true renders a bordered table with row separators and cell padding — use for key-value and data tables."
-}, q = {
-	props: c.object({
-		name: c.enum([
-			"check-circle",
-			"in-progress",
-			"radio-button-unchecked"
-		]),
-		size: c.enum([
-			"small",
-			"medium",
-			"large",
-			"xlarge"
-		]).optional(),
-		color: c.string().optional()
-	}),
-	slots: [],
-	description: "Anvil2 icon. name: check-circle=completed checkmark, in-progress=spinning partial circle, radio-button-unchecked=empty circle (pending)"
-}, J = {
-	props: c.object({
-		label: c.string(),
-		placeholder: c.string().optional(),
-		type: c.enum([
-			"text",
-			"password",
-			"email",
-			"tel",
-			"url",
-			"number"
-		]).optional(),
-		value: c.string().optional(),
-		disabled: c.boolean().optional()
-	}),
-	slots: [],
-	description: "Free-text input field for user-typed values (names, notes, numbers, etc). type: text (default), password (masked), email, tel (phone), url, number. Use $bindState on value to bind to state. Prefer this over Select when the value is not from a fixed list."
-}, Y = {
-	props: c.object({
-		data: c.array(c.record(c.string(), c.union([c.string(), c.number()]))),
-		series: c.array(c.string()).optional(),
-		theme: c.enum([
-			"monochrome",
-			"categorical",
-			"semantic"
-		]).optional(),
-		showLegend: c.boolean().optional(),
-		showDots: c.boolean().optional(),
-		height: c.number().optional(),
-		unit: c.string().optional()
-	}),
-	slots: [],
-	description: "Line chart for tracking trends over time with optional multiple series. data: array of objects with a \"category\" key (x-axis label) and one numeric key per series (e.g. [{category: \"Jan\", revenue: 100, cost: 60}]). series: explicit list of series keys to plot (inferred from data keys if omitted, max 6). theme: monochrome (1-2 series), categorical (3-6 distinct). showLegend: true when multiple series (default true for 2+ series). showDots: true adds data-point markers (default true). unit: tooltip value suffix."
-}, X = {
-	props: c.object({
-		label: c.string(),
-		href: c.string(),
-		appearance: c.enum(["primary", "secondary"]).optional(),
-		target: c.enum(["_blank", "_self"]).optional(),
-		ghost: c.boolean().optional()
-	}),
-	slots: [],
-	description: "Inline navigation link. href: destination URL. appearance: primary (default) | secondary. target: _blank opens in new tab (shows external-link icon). ghost: quieter styling (primary only)."
-}, Z = {
-	props: c.object({
-		label: c.string(),
-		options: c.array(c.object({
-			value: c.string(),
-			label: c.string()
-		})),
-		value: c.string().optional(),
-		disabled: c.boolean().optional()
-	}),
-	slots: [],
-	description: "Listbox for choosing from a fixed list of known options. Use only when options are predefined. For free-text user input use Input instead."
-}, Q = {
-	props: c.object({
-		label: c.string(),
-		value: c.number().min(0).max(100).optional(),
-		description: c.string().optional(),
-		indeterminate: c.boolean().optional()
-	}),
-	slots: [],
-	description: "Progress bar showing task completion. value: 0–100 (percentage). Omit value and set indeterminate=true for unknown progress."
-}, be = {
-	props: c.object({
-		label: c.string(),
-		options: c.array(c.object({
-			value: c.string(),
-			label: c.string()
-		})),
-		value: c.string().optional(),
-		disabled: c.boolean().optional()
-	}),
-	slots: [],
-	description: "Group of radio buttons for single selection. Use $bindState on value to capture selection."
-}, xe = {
-	props: c.object({
-		label: c.string(),
-		checked: c.boolean().optional(),
-		disabled: c.boolean().optional()
-	}),
-	slots: [],
-	description: "Toggle switch for binary on/off settings. Prefer over Checkbox for enabling/disabling features. Use $bindState on checked to track state."
-}, Se = {
-	props: c.object({
-		content: c.string(),
-		variant: c.enum([
-			"headline",
-			"body",
-			"eyebrow"
-		]).optional(),
-		size: c.enum([
-			"small",
-			"medium",
-			"large",
-			"xlarge"
-		]).optional(),
-		subdued: c.boolean().optional(),
-		el: c.enum([
-			"h1",
-			"h2",
-			"h3",
-			"h4",
-			"h5",
-			"h6"
-		]).optional()
-	}),
-	slots: [],
-	description: "Display text. variant: headline=bold title, eyebrow=small label, body=default. size: small/medium/large/xlarge (headline and body only). subdued: deemphasized body text. el: heading element for variant=headline (default h3)."
-}, Ce = {
-	props: c.object({
-		label: c.string(),
-		placeholder: c.string().optional(),
-		description: c.string().optional(),
-		moreInfo: c.string().optional(),
-		value: c.string().optional(),
-		rows: c.number().optional(),
-		disabled: c.boolean().optional()
-	}),
-	slots: [],
-	description: "Multi-line free-text input for long values (notes, descriptions, email body). Use $bindState on value to bind to state. rows: visible row count (default 3)."
-}, we = {
-	Text: Se,
-	Card: V,
-	Flex: G,
-	Grid: K,
-	Alert: P,
-	Divider: U,
-	Icon: q,
-	Badge: I,
-	Chip: ye,
-	Link: X,
-	ProgressBar: Q,
-	BarChart: L,
-	DonutChart: W,
-	LineChart: Y,
-	Button: B,
-	Checkbox: H,
-	Input: J,
-	Textarea: Ce,
-	Listbox: Z,
-	RadioGroup: be,
-	Switch: xe
-}, Te = e(s, {
-	components: we,
-	actions: M
-}), Ee = ({ props: e, bindings: n, emit: r }) => {
-	let i = n?.checked, { state: a, set: s } = o(), c = i ? t(a, i) : void 0, l = i ? c ?? e.checked ?? !1 : e.checked ?? !1;
-	return /* @__PURE__ */ y(ee, {
-		label: e.label,
-		checked: l,
-		onClick: (e, t) => {
-			i && s(i, !(t?.checked ?? !1)), r("change");
-		}
-	});
-}, De = {
-	"check-circle": O,
-	"in-progress": A,
-	"radio-button-unchecked": k
-}, Oe = ({ props: e, emit: t }) => {
-	let n = e.icon ? De[e.icon] : void 0, r = e.removable && e.size !== "small" ? () => t("close") : void 0;
-	return /* @__PURE__ */ y(te, {
-		label: e.label,
-		...F({
-			size: e.size,
-			color: e.color,
-			icon: n,
-			onClose: r
-		})
-	});
-}, ke = ({ props: e }) => /* @__PURE__ */ y(ne, { ...F({
-	vertical: e.vertical,
-	spacing: e.spacing,
-	alignContent: e.alignContent
-}) }), Ae = ({ props: e }) => {
-	let t = E(null);
-	return w(() => {
-		let n = t.current;
-		if (!n) return;
-		let r, i = () => {
-			r && r.dispose(), r = x.Root.new(n), z(r, e.theme);
-			let t = r.container.children.push(j.PieChart.new(r, {
-				layout: r.horizontalLayout,
-				innerRadius: x.percent(50)
-			})), i = t.series.push(j.PieSeries.new(r, {
-				valueField: "value",
-				categoryField: "category",
-				legendValueText: ""
-			}));
-			i.labels.template.set("text", "{valuePercentTotal.formatNumber('#.')}%"), i.data.setAll(e.data), (e.showLegend ?? !0) && t.children.push(x.Legend.new(r, {
-				centerY: x.percent(50),
-				y: x.percent(50),
-				layout: r.verticalLayout
-			})).data.setAll(i.dataItems);
-		}, a = new ResizeObserver((e) => {
-			(e[0]?.contentRect.width ?? 0) > 0 && !r && i();
-		});
-		return a.observe(n), n.offsetWidth > 0 && i(), () => {
-			a.disconnect(), r?.dispose();
-		};
-	}, []), /* @__PURE__ */ y("div", {
-		ref: t,
-		className: R,
-		style: { height: e.height ?? 300 }
-	});
-}, je = ({ props: e, children: t }) => /* @__PURE__ */ y(p, {
-	...F({
-		direction: e.direction,
-		gap: e.gap,
-		alignItems: e.alignItems,
-		justifyContent: e.justifyContent,
-		wrap: e.wrap,
-		grow: e.grow,
-		shrink: e.shrink,
-		inline: e.inline
-	}),
-	children: t
-}), Me = (...e) => e.filter(Boolean).join(" "), Ne = "_1v76lkh0", Pe = "_1v76lkh1";
-//#endregion
-//#region src/core/catalog/grid.tsx
-function Fe(e) {
-	let t = e.match(/repeat\(\s*(\d+)/);
-	return t?.[1] ? Number(t[1]) : e.trim().split(/\s+/).length;
-}
-var Ie = ({ props: e, children: t }) => {
-	if (e.bordered) {
-		let n = e.templateColumns ?? "1fr", r = C.count(t), i = Math.max(1, Fe(n)), a = Math.max(0, r - (r % i || i));
-		return /* @__PURE__ */ y("div", {
-			className: Ne,
-			style: { gridTemplateColumns: n },
-			children: C.map(t, (e, t) => /* @__PURE__ */ y("div", {
-				className: Me(Pe, t < a && "_1v76lkh2"),
-				children: e
-			}))
-		});
-	}
-	return /* @__PURE__ */ y(ie, {
-		templateColumns: e.templateColumns,
-		gap: e.gap ?? "2",
-		children: t
-	});
-}, Le = {
-	"check-circle": O,
-	"in-progress": A,
-	"radio-button-unchecked": k
-}, Re = ({ props: e }) => {
-	let t = Le[e.name];
-	return t ? /* @__PURE__ */ y(ae, {
-		svg: t,
-		...F({
-			size: e.size,
-			color: e.color
-		})
-	}) : null;
-}, ze = ({ props: e, bindings: n, emit: r }) => {
-	let i = n?.value, { state: a, set: s } = o(), c = i ? t(a, i) : void 0, l = i ? c ?? e.value ?? "" : e.value ?? "";
-	return /* @__PURE__ */ y(se, {
-		label: e.label,
-		type: e.type ?? "text",
-		value: l,
-		...F({
-			placeholder: e.placeholder,
-			disabled: e.disabled
-		}),
-		onChange: (e) => {
-			i && s(i, e.target.value), r("change");
-		}
-	});
-}, Be = ({ props: e }) => {
-	let t = E(null);
-	return w(() => {
-		let n = t.current;
-		if (!n) return;
-		let r, i = () => {
-			r && r.dispose(), r = x.Root.new(n), z(r, e.theme);
-			let t = r.container.children.push(S.XYChart.new(r, { paddingLeft: 0 })), i = t.xAxes.push(S.CategoryAxis.new(r, {
-				categoryField: "category",
-				renderer: S.AxisRendererX.new(r, { minGridDistance: 30 })
-			})), a = t.yAxes.push(S.ValueAxis.new(r, { renderer: S.AxisRendererY.new(r, {}) })), o = e.data[0], s = e.series ?? (o ? Object.keys(o).filter((e) => e !== "category") : []);
-			for (let n of s) {
-				let o = t.series.push(S.LineSeries.new(r, {
-					name: n,
-					xAxis: i,
-					yAxis: a,
-					valueYField: n,
-					categoryXField: "category",
-					tooltip: x.Tooltip.new(r, { labelText: `${n}: ${e.unit ?? ""}{valueY}` })
-				}));
-				o.strokes.template.setAll({ strokeWidth: 2 }), (e.showDots ?? !0) && o.bullets.push(() => {
-					if (!r) throw Error("Chart root is not initialized");
-					let e = o.get("fill");
-					return x.Bullet.new(r, { sprite: x.Circle.new(r, {
-						radius: 4,
-						...e ? { fill: e } : {},
-						strokeWidth: 0
-					}) });
-				}), o.data.setAll(e.data);
-			}
-			i.data.setAll(e.data), (e.showLegend ?? s.length > 1) && t.children.push(x.Legend.new(r, {
-				centerX: x.percent(50),
-				x: x.percent(50),
-				marginTop: 8
-			})).data.setAll(t.series.values);
-		}, a = new ResizeObserver((e) => {
-			(e[0]?.contentRect.width ?? 0) > 0 && !r && i();
-		});
-		return a.observe(n), n.offsetWidth > 0 && i(), () => {
-			a.disconnect(), r?.dispose();
-		};
-	}, []), /* @__PURE__ */ y("div", {
-		ref: t,
-		className: R,
-		style: { height: e.height ?? 300 }
-	});
-}, Ve = ({ props: e, emit: t }) => {
-	let { label: n, href: r, appearance: i, target: a, ghost: o } = e, s = (e) => {
-		e.preventDefault(), t("press");
-	};
-	return i === "secondary" ? /* @__PURE__ */ y(m, {
-		appearance: "secondary",
-		ghost: !1,
-		href: r,
-		...a ? { target: a } : {},
-		onClick: s,
-		children: n
-	}) : o === void 0 ? /* @__PURE__ */ y(m, {
-		appearance: "primary",
-		href: r,
-		...a ? { target: a } : {},
-		onClick: s,
-		children: n
-	}) : /* @__PURE__ */ y(m, {
-		appearance: "primary",
-		ghost: o,
-		href: r,
-		...a ? { target: a } : {},
-		onClick: s,
-		children: n
-	});
-};
-//#endregion
-//#region ../../node_modules/.pnpm/@vanilla-extract+recipes@0.5.7_@vanilla-extract+css@1.20.1/node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js
-function He(e, t) {
-	if (typeof e != "object" || !e) return e;
-	var n = e[Symbol.toPrimitive];
-	if (n !== void 0) {
-		var r = n.call(e, t || "default");
-		if (typeof r != "object") return r;
-		throw TypeError("@@toPrimitive must return a primitive value.");
-	}
-	return (t === "string" ? String : Number)(e);
-}
-function Ue(e) {
-	var t = He(e, "string");
-	return typeof t == "symbol" ? t : String(t);
-}
-function We(e, t, n) {
-	return t = Ue(t), t in e ? Object.defineProperty(e, t, {
-		value: n,
-		enumerable: !0,
-		configurable: !0,
-		writable: !0
-	}) : e[t] = n, e;
-}
-function Ge(e, t) {
-	var n = Object.keys(e);
-	if (Object.getOwnPropertySymbols) {
-		var r = Object.getOwnPropertySymbols(e);
-		t && (r = r.filter(function(t) {
-			return Object.getOwnPropertyDescriptor(e, t).enumerable;
-		})), n.push.apply(n, r);
-	}
-	return n;
-}
-function Ke(e) {
-	for (var t = 1; t < arguments.length; t++) {
-		var n = arguments[t] == null ? {} : arguments[t];
-		t % 2 ? Ge(Object(n), !0).forEach(function(t) {
-			We(e, t, n[t]);
-		}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) : Ge(Object(n)).forEach(function(t) {
-			Object.defineProperty(e, t, Object.getOwnPropertyDescriptor(n, t));
-		});
-	}
-	return e;
-}
-function qe(e, t) {
-	var n = {};
-	for (var r in e) n[r] = t(e[r], r);
-	return n;
-}
-var Je = (e, t, n) => {
-	for (var r of Object.keys(e)) if (e[r] !== (t[r] ?? n[r])) return !1;
-	return !0;
-}, Ye = (e) => {
-	var t = (t) => {
-		var n = e.defaultClassName, r = Ke(Ke({}, e.defaultVariants), t);
-		for (var i in r) {
-			var a = r[i] ?? e.defaultVariants[i];
-			if (a != null) {
-				var o = a;
-				typeof o == "boolean" && (o = o === !0 ? "true" : "false");
-				var s = e.variantClassNames[i][o];
-				s && (n += " " + s);
-			}
-		}
-		for (var [c, l] of e.compoundVariants) Je(c, r, e.defaultVariants) && (n += " " + l);
-		return n;
-	};
-	return t.variants = () => Object.keys(e.variantClassNames), t.classNames = {
-		get base() {
-			return e.defaultClassName.split(" ")[0];
-		},
-		get variants() {
-			return qe(e.variantClassNames, (e) => qe(e, (e) => e.split(" ")[0]));
-		}
-	}, t;
-}, Xe = Ye({
-	defaultClassName: "_1le8ba60",
-	variantClassNames: { disabled: {
-		true: "_1le8ba61",
-		false: "_1le8ba62"
-	} },
-	defaultVariants: {},
-	compoundVariants: []
-}), Ze = [
-	{
-		name: "Text",
-		catalog: Se,
-		renderer: ({ props: e }) => {
-			if (e.variant === "headline") {
-				let t = e.el ?? "h3";
-				return e.size === void 0 ? /* @__PURE__ */ y(v, {
-					variant: "headline",
-					el: t,
-					children: e.content
-				}) : /* @__PURE__ */ y(v, {
-					variant: "headline",
-					el: t,
-					size: e.size,
-					children: e.content
-				});
-			}
-			return e.variant === "eyebrow" ? /* @__PURE__ */ y(v, {
-				variant: "eyebrow",
-				children: e.content
-			}) : e.size !== void 0 && e.subdued !== void 0 ? /* @__PURE__ */ y(v, {
-				variant: "body",
-				size: e.size,
-				subdued: e.subdued,
-				children: e.content
-			}) : e.size === void 0 ? e.subdued === void 0 ? /* @__PURE__ */ y(v, {
-				variant: "body",
-				children: e.content
-			}) : /* @__PURE__ */ y(v, {
-				variant: "body",
-				subdued: e.subdued,
-				children: e.content
-			}) : /* @__PURE__ */ y(v, {
-				variant: "body",
-				size: e.size,
-				children: e.content
-			});
-		},
-		renderers: N
-	},
-	{
-		name: "Card",
-		catalog: V,
-		renderer: ve,
-		renderers: N
-	},
-	{
-		name: "Flex",
-		catalog: G,
-		renderer: je,
-		renderers: N
-	},
-	{
-		name: "Grid",
-		catalog: K,
-		renderer: Ie,
-		renderers: N
-	},
-	{
-		name: "Alert",
-		catalog: P,
-		renderer: pe,
-		renderers: N
-	},
-	{
-		name: "Divider",
-		catalog: U,
-		renderer: ke,
-		renderers: N
-	},
-	{
-		name: "Icon",
-		catalog: q,
-		renderer: Re,
-		renderers: N
-	},
-	{
-		name: "Badge",
-		catalog: I,
-		renderer: he,
-		renderers: N
-	},
-	{
-		name: "Chip",
-		catalog: ye,
-		renderer: Oe,
-		renderers: N
-	},
-	{
-		name: "Link",
-		catalog: X,
-		renderer: Ve,
-		renderers: N
-	},
-	{
-		name: "ProgressBar",
-		catalog: Q,
-		renderer: ({ props: e }) => {
-			let t = F({ description: e.description });
-			return e.indeterminate || e.value === void 0 ? /* @__PURE__ */ y(g, {
-				label: e.label,
-				indeterminate: !0,
-				...t
-			}) : /* @__PURE__ */ y(g, {
-				label: e.label,
-				value: e.value,
-				...t
-			});
-		},
-		renderers: N
-	},
-	{
-		name: "BarChart",
-		catalog: L,
-		renderer: ge,
-		renderers: N
-	},
-	{
-		name: "DonutChart",
-		catalog: W,
-		renderer: Ae,
-		renderers: N
-	},
-	{
-		name: "LineChart",
-		catalog: Y,
-		renderer: Be,
-		renderers: N
-	},
-	{
-		name: "Button",
-		catalog: B,
-		renderer: _e,
-		renderers: N
-	},
-	{
-		name: "Checkbox",
-		catalog: H,
-		renderer: Ee,
-		renderers: N
-	},
-	{
-		name: "Input",
-		catalog: J,
-		renderer: ze,
-		renderers: N
-	},
-	{
-		name: "Textarea",
-		catalog: Ce,
-		renderer: ({ props: e, bindings: n, emit: r }) => {
-			let i = n?.value, { state: a, set: s } = o(), c = i ? t(a, i) : void 0, l = i ? c ?? e.value ?? "" : e.value ?? "";
-			return /* @__PURE__ */ y(ce, {
-				label: e.label,
-				value: l,
-				...F({
-					placeholder: e.placeholder,
-					description: e.description,
-					moreInfo: e.moreInfo,
-					rows: e.rows,
-					disabled: e.disabled
-				}),
-				onChange: (e) => {
-					i && s(i, e.target.value), r("change");
-				}
-			});
-		},
-		renderers: N
-	},
-	{
-		name: "Listbox",
-		catalog: Z,
-		renderer: ({ props: e, bindings: n, emit: r }) => {
-			let i = n?.value, { state: a, set: s } = o(), c = i ? t(a, i) : void 0, l = i ? c ?? e.value ?? "" : e.value ?? "", u = e.options.map((e) => ({
-				id: e.value,
-				label: e.label
-			})), d = u.find((e) => e.id === l);
-			return /* @__PURE__ */ b("div", {
-				className: Xe({ disabled: e.disabled ?? !1 }),
-				children: [/* @__PURE__ */ y(re, { children: e.label }), /* @__PURE__ */ y(h, {
-					items: u,
-					...d ? { selected: d } : {},
-					onSelectionChange: (e) => {
-						let t = e?.id ?? "";
-						i && s(i, t), r("change");
-					},
-					children: ({ items: e }) => e.map((e) => /* @__PURE__ */ y(h.Option, {
-						item: e,
-						children: e.label
-					}, e.id))
-				})]
-			});
-		},
-		renderers: N
-	},
-	{
-		name: "RadioGroup",
-		catalog: be,
-		renderer: ({ props: e, bindings: n, emit: r }) => {
-			let i = n?.value, { state: a, set: s } = o(), c = i ? t(a, i) : void 0, l = i ? c ?? e.value ?? "" : e.value ?? "";
-			return /* @__PURE__ */ y(_.Group, {
-				legend: e.label,
-				children: e.options.map((e) => /* @__PURE__ */ y(_, {
-					label: e.label,
-					value: e.value,
-					checked: l === e.value,
-					onChange: () => {
-						i && s(i, e.value), r("change");
-					}
-				}, e.value))
-			});
-		},
-		renderers: N
-	},
-	{
-		name: "Switch",
-		catalog: xe,
-		renderer: ({ props: e, bindings: n, emit: r }) => {
-			let i = n?.checked, { state: a, set: s } = o(), c = i ? t(a, i) : void 0, l = i ? c ?? e.checked ?? !1 : e.checked ?? !1;
-			return /* @__PURE__ */ y(oe, {
-				label: e.label,
-				value: e.label,
-				checked: l,
-				onChange: (e, t) => {
-					i && s(i, t?.checked ?? !1), r("change");
-				}
-			});
-		},
-		renderers: N
-	}
-];
-Object.fromEntries(Ze.map(({ name: e, renderer: t }) => [e, t]));
-//#endregion
-//#region src/team-catalog.ts
-function Qe(e) {
-	return e;
-}
-function $e(t) {
-	let n = {
-		...we,
-		...t.components ?? {}
-	}, r = Object.fromEntries(Object.entries(t.actions ?? {}).map(([e, n]) => [`${t.prefix}.${e}`, n])), i = e(s, {
-		components: n,
-		actions: {
-			...M,
-			...r
-		}
-	});
-	return {
-		prefix: t.prefix,
-		catalog: i,
-		prompt(e) {
-			let n = [
-				i.prompt(),
-				"\n",
-				e
-			];
-			return t.rules && n.push("\n", t.rules), n.join("");
-		},
-		jsonSchema() {
-			return i.jsonSchema();
-		}
-	};
-}
-//#endregion
-//#region src/marketing/catalog/components/revenue-card.catalog.ts
-var et = {
-	props: c.object({
-		title: c.string(),
-		value: c.string(),
-		trend: c.enum([
-			"up",
-			"down",
-			"flat"
-		]).optional(),
-		delta: c.string().optional()
-	}),
-	slots: [],
-	description: "KPI metric card. trend: up=green↑ down=red↓ flat=grey→. delta e.g. \"+12% vs last month\". Leaf node — no children."
-}, tt = Ye({
-	defaultClassName: "cy2dbi0",
-	variantClassNames: { trend: {
-		up: "cy2dbi1",
-		down: "cy2dbi2",
-		flat: "cy2dbi3"
-	} },
-	defaultVariants: {},
-	compoundVariants: []
-}), nt = [{
-	name: "RevenueCard",
-	catalog: et,
-	renderer: ({ props: e }) => {
-		let t = e.trend ?? "flat", n = e.trend === "up" ? "↑" : e.trend === "down" ? "↓" : "→", r = tt({ trend: t });
-		return /* @__PURE__ */ y(f, { children: /* @__PURE__ */ b(p, {
-			direction: "column",
-			gap: "2",
-			children: [
-				/* @__PURE__ */ y(v, {
-					variant: "eyebrow",
-					children: e.title
-				}),
-				/* @__PURE__ */ y(v, {
-					variant: "headline",
-					el: "h3",
-					children: e.value
-				}),
-				e.delta && /* @__PURE__ */ b(p, {
-					direction: "row",
-					gap: "1",
-					alignItems: "center",
-					children: [/* @__PURE__ */ y("span", {
-						className: r,
-						children: n
-					}), /* @__PURE__ */ y(v, {
-						variant: "eyebrow",
-						className: r,
-						children: e.delta
-					})]
-				})
-			]
-		}) });
-	},
-	renderers: N
-}];
-//#endregion
-//#region src/registry-utils.ts
-function rt(e, t) {
-	return e.filter(({ renderers: e }) => e.includes(t));
-}
-function it(e) {
-	return Object.fromEntries(e.map(({ name: e, catalog: t }) => [e, t]));
-}
-function at(e) {
-	return Object.fromEntries(e.map(({ name: e, renderer: t }) => [e, t]));
-}
-//#endregion
-//#region src/registry.ts
-var ot = [...Ze, ...nt];
-function st(t = "chat") {
-	let n = rt(ot, t), r = it(n), i = at(n);
-	return a(e(s, {
-		components: r,
-		actions: M
-	}), {
-		components: i,
-		actions: fe
-	});
-}
-var $ = st("chat"), ct = $.registry, lt = $.handlers, ut = $.executeAction;
-//#endregion
-//#region src/renderers/internal/enrichments/button-actions.ts
-function dt(e) {
-	let t = { ...e.elements };
-	for (let [e, n] of Object.entries(t)) {
-		if (n.type !== "Button" || n.on?.press) continue;
-		let r = e;
-		t[e] = {
-			...n,
-			on: {
-				...n.on,
-				press: {
-					action: "atlas.submitUserAction",
-					params: { actionId: r }
-				}
-			}
-		};
-	}
-	return {
-		...e,
-		elements: t
-	};
-}
-//#endregion
-//#region src/renderers/internal/enrichments/useEnrichedSpec.ts
-function ft(e, t) {
-	return T(() => t.reduce((e, t) => t(e), e), [e, t]);
-}
-//#endregion
-//#region src/renderers/spec-renderer.tsx
-var pt = [dt], mt = ({ spec: e, registry: t, handlers: a, actions: o }) => {
-	let s = ft(e, pt), c = E(null), l = E(null);
-	if (c.current !== e && (c.current = e, l.current = i(s.state ?? {})), l.current === null) throw Error("State store is not initialized");
-	let u = l.current;
-	return /* @__PURE__ */ y(n, {
-		registry: t,
-		store: u,
-		handlers: T(() => {
-			let e = a(() => void 0, () => u.getSnapshot()), t = o ? o({
-				setState: u.set,
-				getSnapshot: () => u.getSnapshot()
-			}) : {};
-			return {
-				...e,
-				...t
-			};
-		}, [
-			a,
-			o,
-			u
-		]),
-		functions: T(() => ({ computeTotal: (e) => `$${((Number.parseFloat(String(e.quantity ?? 0)) || 0) * (Number.parseFloat(String(e.unitPrice ?? "0").replace(/[^0-9.]/g, "")) || 0)).toFixed(2)}` }), []),
-		children: /* @__PURE__ */ y(r, {
-			spec: s,
-			registry: t
-		})
-	});
-};
-//#endregion
-export { mt as SpecRenderer, Te as catalog, Qe as createTeamCatalog, ut as executeAction, st as getRegistry, lt as handlers, $e as mergeCatalogs, ct as registry };
-
-//# sourceMappingURL=json-render-react.js.map