@ugurdemirel/landcraft 0.1.19 → 0.1.21

package/dist/es/components/AgentDemo/Player.js

@@ -0,0 +1,171 @@
+"use client";
+import { jsx as t, jsxs as T, Fragment as oe } from "react/jsx-runtime";
+import { forwardRef as ie, useState as f, useRef as k, useEffect as l } from "react";
+import { Pause as ce, Play as le, RotateCcw as ae } from "../../icons.js";
+import { ToolCard as ue } from "./ToolCard.js";
+import { DemoWindow as H, EmptyState as de, FinishedStep as X, DemoFooter as Y, AssistantMessage as fe, ThinkingRow as me, StepProgress as he, ControlButton as K } from "./parts.js";
+const ge = 24, pe = 350, ye = 1e3, Pe = 1100, Re = 2600;
+function Te() {
+  const [q, r] = f(!1);
+  return l(() => {
+    if (typeof window > "u" || typeof window.matchMedia != "function") return;
+    const m = window.matchMedia("(prefers-reduced-motion: reduce)");
+    r(m.matches);
+  }, []), q;
+}
+const we = ie(function({
+  script: r,
+  title: m,
+  subtitle: I,
+  logo: S,
+  logoSrc: x,
+  logoAlt: C,
+  logoClassName: b,
+  height: A,
+  autoplay: a = !0,
+  paused: h = !1,
+  loop: U = !1,
+  speed: E = 1,
+  showControls: Z = !0,
+  showSteps: $ = !0,
+  onDone: O,
+  className: F,
+  "aria-label": L,
+  ...N
+}, _) {
+  const ee = Te(), g = !a || ee, p = E && E > 0 ? E : 1, [W, te] = f(0), [j, u] = f(a && !h), [i, B] = f(0), [D, ne] = f(""), [z, y] = f(!1), w = k(null), J = k(""), d = k(0), M = k(O);
+  l(() => {
+    M.current = O;
+  }, [O]);
+  const c = r.length, s = c > 0 && i >= c, v = (e) => {
+    J.current = e, ne(e);
+  }, Q = () => {
+    d.current = 0, v(""), y(!1), B(0), u(!0), te((e) => e + 1);
+  };
+  if (l(() => {
+    d.current = 0, v(""), y(!1), B(0), u(a && !h);
+  }, [r, a, h]), l(() => {
+    h ? u(!1) : a && u(!0);
+  }, [h, a]), l(() => {
+    if (g || !j || i >= c) return;
+    const e = r[i], n = [];
+    let P;
+    d.current = J.current.length;
+    const G = () => {
+      n.push(
+        setTimeout(() => {
+          v(""), y(!1), d.current = 0, B((R) => R + 1);
+        }, pe / p)
+      );
+    };
+    if (e.type === "user" || e.type === "assistant") {
+      const R = e.text, se = Math.max(1, Math.ceil(R.length / 36));
+      P = setInterval(() => {
+        d.current += se;
+        const V = R.slice(0, d.current);
+        v(V), V.length >= R.length && (P && clearInterval(P), G());
+      }, ge / p);
+    } else e.type === "thinking" ? n.push(setTimeout(G, ye / p)) : (y(!0), n.push(
+      setTimeout(() => {
+        y(!1), G();
+      }, Pe / p)
+    ));
+    return () => {
+      P && clearInterval(P), n.forEach(clearTimeout);
+    };
+  }, [g, j, i, W, r, p, c]), l(() => {
+    var n;
+    if (g || !s || ((n = M.current) == null || n.call(M), !U)) return;
+    const e = setTimeout(Q, Re);
+    return () => clearTimeout(e);
+  }, [g, s, U, W]), l(() => {
+    const e = w.current;
+    e && (e.scrollTop = e.scrollHeight);
+  }, [i, D, z]), c === 0)
+    return /* @__PURE__ */ t("div", { ref: _, className: F, ...N, children: /* @__PURE__ */ t(
+      H,
+      {
+        title: m,
+        subtitle: I,
+        logo: S,
+        logoSrc: x,
+        logoAlt: C,
+        logoClassName: b,
+        logLabel: L ?? "Scripted agent demo",
+        height: A,
+        logRef: w,
+        children: /* @__PURE__ */ t(de, {})
+      }
+    ) });
+  if (g)
+    return /* @__PURE__ */ t("div", { ref: _, className: F, ...N, children: /* @__PURE__ */ t(
+      H,
+      {
+        title: m,
+        subtitle: I,
+        logo: S,
+        logoSrc: x,
+        logoAlt: C,
+        logoClassName: b,
+        logLabel: L ?? "Scripted agent demo",
+        height: A,
+        logRef: w,
+        footer: /* @__PURE__ */ t(Y, {}),
+        children: r.map((e, n) => /* @__PURE__ */ t(X, { step: e }, n))
+      }
+    ) });
+  const o = r[Math.min(i, c - 1)], re = !s && o.type === "user" ? D : void 0;
+  return /* @__PURE__ */ t("div", { ref: _, className: F, ...N, children: /* @__PURE__ */ T(
+    H,
+    {
+      title: m,
+      subtitle: I,
+      logo: S,
+      logoSrc: x,
+      logoAlt: C,
+      logoClassName: b,
+      logLabel: L ?? "Scripted agent demo",
+      height: A,
+      logRef: w,
+      footer: /* @__PURE__ */ t(
+        Y,
+        {
+          composing: re,
+          controls: Z ? /* @__PURE__ */ T(oe, { children: [
+            j && !s ? /* @__PURE__ */ T(K, { onClick: () => u(!1), "aria-label": "Pause demo", children: [
+              /* @__PURE__ */ t(ce, { className: "h-3.5 w-3.5", "aria-hidden": !0 }),
+              "Pause"
+            ] }) : s ? null : /* @__PURE__ */ T(K, { onClick: () => u(!0), "aria-label": "Play demo", children: [
+              /* @__PURE__ */ t(le, { className: "h-3.5 w-3.5", "aria-hidden": !0 }),
+              "Play"
+            ] }),
+            /* @__PURE__ */ T(K, { onClick: Q, "aria-label": "Replay demo", children: [
+              /* @__PURE__ */ t(ae, { className: "h-3.5 w-3.5", "aria-hidden": !0 }),
+              "Replay"
+            ] })
+          ] }) : void 0,
+          progress: $ ? /* @__PURE__ */ t("span", { className: "ml-auto", children: /* @__PURE__ */ t(he, { current: i + 1, total: c, done: s }) }) : void 0
+        }
+      ),
+      children: [
+        r.slice(0, i).map((e, n) => /* @__PURE__ */ t(X, { step: e }, n)),
+        !s && o.type === "assistant" ? /* @__PURE__ */ t(fe, { text: D, partial: !0 }) : null,
+        !s && o.type === "thinking" ? /* @__PURE__ */ t(me, { label: o.label ?? "Thinking…" }) : null,
+        !s && o.type === "tool" ? /* @__PURE__ */ t(
+          ue,
+          {
+            name: o.name,
+            args: o.args,
+            result: o.result,
+            status: z ? "running" : o.status === "error" ? "error" : "success"
+          }
+        ) : null
+      ]
+    }
+  ) });
+});
+we.displayName = "AgentDemoPlayer";
+export {
+  we as AgentDemoPlayer
+};
+//# sourceMappingURL=Player.js.map

package/dist/es/components/AgentDemo/Player.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Player.js","sources":["../../../../src/components/AgentDemo/Player.tsx"],"sourcesContent":["\"use client\";\nimport { forwardRef, useEffect, useRef, useState } from \"react\";\nimport { Pause, Play, RotateCcw } from \"../../icons\";\nimport type { AgentDemoProps } from \"./types\";\nimport { ToolCard } from \"./ToolCard\";\nimport {\n  AssistantMessage,\n  ControlButton,\n  DemoFooter,\n  DemoWindow,\n  EmptyState,\n  FinishedStep,\n  StepProgress,\n  ThinkingRow,\n} from \"./parts\";\n\nconst TICK = 24;\nconst GAP = 350;\nconst THINKING_MS = 1000;\nconst TOOL_MS = 1100;\nconst LOOP_PAUSE = 2600;\n\nfunction usePrefersReducedMotion() {\n  const [reduced, setReduced] = useState(false);\n  useEffect(() => {\n    if (typeof window === \"undefined\" || typeof window.matchMedia !== \"function\") return;\n    const query = window.matchMedia(\"(prefers-reduced-motion: reduce)\");\n    setReduced(query.matches);\n  }, []);\n  return reduced;\n}\n\nexport const AgentDemoPlayer = forwardRef<HTMLDivElement, AgentDemoProps>(function AgentDemoPlayer(\n  {\n    script,\n    title,\n    subtitle,\n    logo,\n    logoSrc,\n    logoAlt,\n    logoClassName,\n    height,\n    autoplay = true,\n    paused = false,\n    loop = false,\n    speed = 1,\n    showControls = true,\n    showSteps = true,\n    onDone,\n    className,\n    \"aria-label\": ariaLabel,\n    ...props\n  },\n  ref,\n) {\n  const reduceMotion = usePrefersReducedMotion();\n  const staticRender = !autoplay || reduceMotion;\n  const rate = speed && speed > 0 ? speed : 1;\n\n  const [runId, setRunId] = useState(0);\n  const [playing, setPlaying] = useState(autoplay && !paused);\n  const [completed, setCompleted] = useState(0);\n  const [partial, setPartial] = useState(\"\");\n  const [toolRunning, setToolRunning] = useState(false);\n\n  const logRef = useRef<HTMLDivElement | null>(null);\n  const partialRef = useRef(\"\");\n  const progressRef = useRef(0);\n  const onDoneRef = useRef(onDone);\n  useEffect(() => {\n    onDoneRef.current = onDone;\n  }, [onDone]);\n\n  const total = script.length;\n  const done = total > 0 && completed >= total;\n\n  const setPartialBoth = (value: string) => {\n    partialRef.current = value;\n    setPartial(value);\n  };\n\n  const replay = () => {\n    progressRef.current = 0;\n    setPartialBoth(\"\");\n    setToolRunning(false);\n    setCompleted(0);\n    setPlaying(true);\n    setRunId((id) => id + 1);\n  };\n\n  // Reset when the script changes.\n  useEffect(() => {\n    progressRef.current = 0;\n    setPartialBoth(\"\");\n    setToolRunning(false);\n    setCompleted(0);\n    setPlaying(autoplay && !paused);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [script, autoplay, paused]);\n\n  // Follow the `paused` prop (explicit Play/Pause clicks always win locally).\n  useEffect(() => {\n    if (paused) {\n      setPlaying(false);\n    } else if (autoplay) {\n      setPlaying(true);\n    }\n  }, [paused, autoplay]);\n\n  // Core playback loop: one effect per in-progress step.\n  useEffect(() => {\n    if (staticRender || !playing || completed >= total) return;\n    const step = script[completed];\n    const timers: ReturnType<typeof setTimeout>[] = [];\n    let interval: ReturnType<typeof setInterval> | undefined;\n    // Resume typing where it paused instead of restarting the message.\n    progressRef.current = partialRef.current.length;\n\n    const finish = () => {\n      timers.push(\n        setTimeout(() => {\n          setPartialBoth(\"\");\n          setToolRunning(false);\n          progressRef.current = 0;\n          setCompleted((c) => c + 1);\n        }, GAP / rate),\n      );\n    };\n\n    if (step.type === \"user\" || step.type === \"assistant\") {\n      const full = step.text;\n      const chunk = Math.max(1, Math.ceil(full.length / 36));\n      interval = setInterval(() => {\n        progressRef.current += chunk;\n        const next = full.slice(0, progressRef.current);\n        setPartialBoth(next);\n        if (next.length >= full.length) {\n          if (interval) clearInterval(interval);\n          finish();\n        }\n      }, TICK / rate);\n    } else if (step.type === \"thinking\") {\n      timers.push(setTimeout(finish, THINKING_MS / rate));\n    } else {\n      setToolRunning(true);\n      timers.push(\n        setTimeout(() => {\n          setToolRunning(false);\n          finish();\n        }, TOOL_MS / rate),\n      );\n    }\n\n    return () => {\n      if (interval) clearInterval(interval);\n      timers.forEach(clearTimeout);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [staticRender, playing, completed, runId, script, rate, total]);\n\n  // Completion: notify once per run, then loop if asked.\n  useEffect(() => {\n    if (staticRender || !done) return;\n    onDoneRef.current?.();\n    if (!loop) return;\n    const timer = setTimeout(replay, LOOP_PAUSE);\n    return () => clearTimeout(timer);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [staticRender, done, loop, runId]);\n\n  // Keep the newest step in view while playing.\n  useEffect(() => {\n    const el = logRef.current;\n    if (el) el.scrollTop = el.scrollHeight;\n  }, [completed, partial, toolRunning]);\n\n  if (total === 0) {\n    return (\n      <div ref={ref} className={className} {...props}>\n        <DemoWindow\n          title={title}\n          subtitle={subtitle}\n          logo={logo}\n          logoSrc={logoSrc}\n          logoAlt={logoAlt}\n          logoClassName={logoClassName}\n          logLabel={ariaLabel ?? \"Scripted agent demo\"}\n          height={height}\n          logRef={logRef}\n        >\n          <EmptyState />\n        </DemoWindow>\n      </div>\n    );\n  }\n\n  if (staticRender) {\n    return (\n      <div ref={ref} className={className} {...props}>\n        <DemoWindow\n          title={title}\n          subtitle={subtitle}\n          logo={logo}\n          logoSrc={logoSrc}\n          logoAlt={logoAlt}\n          logoClassName={logoClassName}\n          logLabel={ariaLabel ?? \"Scripted agent demo\"}\n          height={height}\n          logRef={logRef}\n          footer={<DemoFooter />}\n        >\n          {script.map((step, i) => (\n            <FinishedStep key={i} step={step} />\n          ))}\n        </DemoWindow>\n      </div>\n    );\n  }\n\n  const current = script[Math.min(completed, total - 1)];\n  // The user \"types\" in the input box; the bubble only mounts once sent.\n  const composing = !done && current.type === \"user\" ? partial : undefined;\n\n  return (\n    <div ref={ref} className={className} {...props}>\n      <DemoWindow\n        title={title}\n        subtitle={subtitle}\n        logo={logo}\n        logoSrc={logoSrc}\n        logoAlt={logoAlt}\n        logoClassName={logoClassName}\n        logLabel={ariaLabel ?? \"Scripted agent demo\"}\n        height={height}\n        logRef={logRef}\n        footer={\n          <DemoFooter\n            composing={composing}\n            controls={\n              showControls ? (\n                <>\n                  {playing && !done ? (\n                    <ControlButton onClick={() => setPlaying(false)} aria-label=\"Pause demo\">\n                      <Pause className=\"h-3.5 w-3.5\" aria-hidden />\n                      Pause\n                    </ControlButton>\n                  ) : !done ? (\n                    <ControlButton onClick={() => setPlaying(true)} aria-label=\"Play demo\">\n                      <Play className=\"h-3.5 w-3.5\" aria-hidden />\n                      Play\n                    </ControlButton>\n                  ) : null}\n                  <ControlButton onClick={replay} aria-label=\"Replay demo\">\n                    <RotateCcw className=\"h-3.5 w-3.5\" aria-hidden />\n                    Replay\n                  </ControlButton>\n                </>\n              ) : undefined\n            }\n            progress={\n              showSteps ? (\n                <span className=\"ml-auto\">\n                  <StepProgress current={completed + 1} total={total} done={done} />\n                </span>\n              ) : undefined\n            }\n          />\n        }\n      >\n        {script.slice(0, completed).map((step, i) => (\n          <FinishedStep key={i} step={step} />\n        ))}\n        {!done && current.type === \"assistant\" ? (\n          <AssistantMessage text={partial} partial />\n        ) : null}\n        {!done && current.type === \"thinking\" ? (\n          <ThinkingRow label={current.label ?? \"Thinking…\"} />\n        ) : null}\n        {!done && current.type === \"tool\" ? (\n          <ToolCard\n            name={current.name}\n            args={current.args}\n            result={current.result}\n            status={\n              toolRunning ? \"running\" : current.status === \"error\" ? \"error\" : \"success\"\n            }\n          />\n        ) : null}\n      </DemoWindow>\n    </div>\n  );\n});\nAgentDemoPlayer.displayName = \"AgentDemoPlayer\";\n"],"names":["TICK","GAP","THINKING_MS","TOOL_MS","LOOP_PAUSE","usePrefersReducedMotion","reduced","setReduced","useState","useEffect","query","AgentDemoPlayer","forwardRef","script","title","subtitle","logo","logoSrc","logoAlt","logoClassName","height","autoplay","paused","loop","speed","showControls","showSteps","onDone","className","ariaLabel","props","ref","reduceMotion","staticRender","rate","runId","setRunId","playing","setPlaying","completed","setCompleted","partial","setPartial","toolRunning","setToolRunning","logRef","useRef","partialRef","progressRef","onDoneRef","total","done","setPartialBoth","value","replay","id","step","timers","interval","finish","c","full","chunk","next","_a","timer","el","jsx","DemoWindow","EmptyState","DemoFooter","i","FinishedStep","current","composing","jsxs","Fragment","ControlButton","Pause","Play","RotateCcw","StepProgress","AssistantMessage","ThinkingRow","ToolCard"],"mappings":"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"}

package/dist/es/components/AgentDemo/ToolCard.js

@@ -0,0 +1,96 @@
+"use client";
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { useState as m } from "react";
+import { cn as o } from "../../utils/cn.js";
+import { X as p, Check as x, Terminal as f, ChevronDown as g, Cpu as h } from "../../icons.js";
+const s = {
+  running: "Running",
+  success: "Done",
+  error: "Failed"
+};
+function v({
+  name: d,
+  args: t,
+  result: a,
+  status: r = "success"
+}) {
+  const [i, c] = m(!1), l = !!(t ?? a);
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      className: o(
+        "rounded-xl border border-border bg-surface-strong/40",
+        r === "error" && "border-red-500/40"
+      ),
+      children: [
+        /* @__PURE__ */ n(
+          "button",
+          {
+            type: "button",
+            "aria-expanded": i,
+            "aria-label": `${d} details, ${s[r].toLowerCase()}`,
+            onClick: () => c((u) => !u),
+            className: "flex w-full cursor-pointer items-center gap-2.5 px-3.5 py-2.5 text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring",
+            children: [
+              /* @__PURE__ */ e(
+                "span",
+                {
+                  className: o(
+                    "inline-flex h-6 w-6 shrink-0 items-center justify-center rounded-md",
+                    r === "error" ? "bg-red-500/15 text-red-500" : "bg-foreground/8 text-foreground"
+                  ),
+                  children: r === "running" ? /* @__PURE__ */ e(
+                    "span",
+                    {
+                      "aria-hidden": !0,
+                      className: "h-3 w-3 animate-spin rounded-full border-[1.5px] border-current border-t-transparent"
+                    }
+                  ) : r === "error" ? /* @__PURE__ */ e(p, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ e(x, { className: "h-3.5 w-3.5" })
+                }
+              ),
+              /* @__PURE__ */ e(f, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground", "aria-hidden": !0 }),
+              /* @__PURE__ */ e("span", { className: "truncate font-mono text-[13px] font-medium", children: d }),
+              /* @__PURE__ */ n(
+                "span",
+                {
+                  className: o(
+                    "ml-auto flex shrink-0 items-center gap-1.5 text-xs",
+                    r === "running" ? "text-muted-foreground" : r === "error" ? "text-red-500" : "text-emerald-600 dark:text-emerald-400"
+                  ),
+                  children: [
+                    r === "running" ? /* @__PURE__ */ e("span", { className: "h-1.5 w-1.5 animate-pulse rounded-full bg-current", "aria-hidden": !0 }) : null,
+                    s[r]
+                  ]
+                }
+              ),
+              l ? /* @__PURE__ */ e(
+                g,
+                {
+                  "aria-hidden": !0,
+                  className: o("h-3.5 w-3.5 shrink-0 text-muted-foreground transition-transform", i && "rotate-180")
+                }
+              ) : null
+            ]
+          }
+        ),
+        i && l ? /* @__PURE__ */ n("div", { className: "space-y-2 border-t border-border px-3.5 py-3", children: [
+          t ? /* @__PURE__ */ n("div", { children: [
+            /* @__PURE__ */ n("p", { className: "mb-1 flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground", children: [
+              /* @__PURE__ */ e(h, { className: "h-3 w-3", "aria-hidden": !0 }),
+              " Arguments"
+            ] }),
+            /* @__PURE__ */ e("pre", { className: "overflow-x-auto rounded-lg bg-background/60 p-2.5 font-mono text-xs leading-5", children: t })
+          ] }) : null,
+          a ? /* @__PURE__ */ n("div", { children: [
+            /* @__PURE__ */ e("p", { className: "mb-1 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground", children: "Result" }),
+            /* @__PURE__ */ e("p", { className: "rounded-lg bg-background/60 p-2.5 font-mono text-xs leading-5", children: a })
+          ] }) : null
+        ] }) : null
+      ]
+    }
+  );
+}
+export {
+  v as ToolCard
+};
+//# sourceMappingURL=ToolCard.js.map

package/dist/es/components/AgentDemo/ToolCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolCard.js","sources":["../../../../src/components/AgentDemo/ToolCard.tsx"],"sourcesContent":["\"use client\";\nimport { useState } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Check, ChevronDown, Cpu, Terminal, X } from \"../../icons\";\n\nexport type ToolStatus = \"running\" | \"success\" | \"error\";\n\nconst statusLabel: Record<ToolStatus, string> = {\n  running: \"Running\",\n  success: \"Done\",\n  error: \"Failed\",\n};\n\nexport function ToolCard({\n  name,\n  args,\n  result,\n  status = \"success\",\n}: {\n  name: string;\n  args?: string;\n  result?: string;\n  status?: ToolStatus;\n}) {\n  const [open, setOpen] = useState(false);\n  const hasDetails = Boolean(args ?? result);\n\n  return (\n    <div\n      className={cn(\n        \"rounded-xl border border-border bg-surface-strong/40\",\n        status === \"error\" && \"border-red-500/40\",\n      )}\n    >\n      <button\n        type=\"button\"\n        aria-expanded={open}\n        aria-label={`${name} details, ${statusLabel[status].toLowerCase()}`}\n        onClick={() => setOpen((o) => !o)}\n        className=\"flex w-full cursor-pointer items-center gap-2.5 px-3.5 py-2.5 text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring\"\n      >\n        <span\n          className={cn(\n            \"inline-flex h-6 w-6 shrink-0 items-center justify-center rounded-md\",\n            status === \"error\" ? \"bg-red-500/15 text-red-500\" : \"bg-foreground/8 text-foreground\",\n          )}\n        >\n          {status === \"running\" ? (\n            <span\n              aria-hidden\n              className=\"h-3 w-3 animate-spin rounded-full border-[1.5px] border-current border-t-transparent\"\n            />\n          ) : status === \"error\" ? (\n            <X className=\"h-3.5 w-3.5\" />\n          ) : (\n            <Check className=\"h-3.5 w-3.5\" />\n          )}\n        </span>\n        <Terminal className=\"h-3.5 w-3.5 shrink-0 text-muted-foreground\" aria-hidden />\n        <span className=\"truncate font-mono text-[13px] font-medium\">{name}</span>\n        <span\n          className={cn(\n            \"ml-auto flex shrink-0 items-center gap-1.5 text-xs\",\n            status === \"running\"\n              ? \"text-muted-foreground\"\n              : status === \"error\"\n                ? \"text-red-500\"\n                : \"text-emerald-600 dark:text-emerald-400\",\n          )}\n        >\n          {status === \"running\" ? (\n            <span className=\"h-1.5 w-1.5 animate-pulse rounded-full bg-current\" aria-hidden />\n          ) : null}\n          {statusLabel[status]}\n        </span>\n        {hasDetails ? (\n          <ChevronDown\n            aria-hidden\n            className={cn(\"h-3.5 w-3.5 shrink-0 text-muted-foreground transition-transform\", open && \"rotate-180\")}\n          />\n        ) : null}\n      </button>\n      {open && hasDetails ? (\n        <div className=\"space-y-2 border-t border-border px-3.5 py-3\">\n          {args ? (\n            <div>\n              <p className=\"mb-1 flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground\">\n                <Cpu className=\"h-3 w-3\" aria-hidden /> Arguments\n              </p>\n              <pre className=\"overflow-x-auto rounded-lg bg-background/60 p-2.5 font-mono text-xs leading-5\">\n                {args}\n              </pre>\n            </div>\n          ) : null}\n          {result ? (\n            <div>\n              <p className=\"mb-1 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground\">\n                Result\n              </p>\n              <p className=\"rounded-lg bg-background/60 p-2.5 font-mono text-xs leading-5\">{result}</p>\n            </div>\n          ) : null}\n        </div>\n      ) : null}\n    </div>\n  );\n}\n"],"names":["statusLabel","ToolCard","name","args","result","status","open","setOpen","useState","hasDetails","jsxs","cn","o","jsx","X","Check","Terminal","ChevronDown","Cpu"],"mappings":";;;;AAOA,MAAMA,IAA0C;AAAA,EAC9C,SAAS;AAAA,EACT,SAAS;AAAA,EACT,OAAO;AACT;AAEO,SAASC,EAAS;AAAA,EACvB,MAAAC;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC,IAAS;AACX,GAKG;AACD,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAS,EAAK,GAChCC,IAAa,GAAQN,KAAQC;AAEnC,SACE,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAN,MAAW,WAAW;AAAA,MAAA;AAAA,MAGxB,UAAA;AAAA,QAAA,gBAAAK;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,iBAAeJ;AAAA,YACf,cAAY,GAAGJ,CAAI,aAAaF,EAAYK,CAAM,EAAE,aAAa;AAAA,YACjE,SAAS,MAAME,EAAQ,CAACK,MAAM,CAACA,CAAC;AAAA,YAChC,WAAU;AAAA,YAEV,UAAA;AAAA,cAAA,gBAAAC;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAWF;AAAA,oBACT;AAAA,oBACAN,MAAW,UAAU,+BAA+B;AAAA,kBAAA;AAAA,kBAGrD,gBAAW,YACV,gBAAAQ;AAAA,oBAAC;AAAA,oBAAA;AAAA,sBACC,eAAW;AAAA,sBACX,WAAU;AAAA,oBAAA;AAAA,kBAAA,IAEVR,MAAW,UACb,gBAAAQ,EAACC,GAAA,EAAE,WAAU,cAAA,CAAc,IAE3B,gBAAAD,EAACE,GAAA,EAAM,WAAU,cAAA,CAAc;AAAA,gBAAA;AAAA,cAAA;AAAA,cAGnC,gBAAAF,EAACG,GAAA,EAAS,WAAU,8CAA6C,eAAW,IAAC;AAAA,cAC7E,gBAAAH,EAAC,QAAA,EAAK,WAAU,8CAA8C,UAAAX,GAAK;AAAA,cACnE,gBAAAQ;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAWC;AAAA,oBACT;AAAA,oBACAN,MAAW,YACP,0BACAA,MAAW,UACT,iBACA;AAAA,kBAAA;AAAA,kBAGP,UAAA;AAAA,oBAAAA,MAAW,YACV,gBAAAQ,EAAC,QAAA,EAAK,WAAU,qDAAoD,eAAW,IAAC,IAC9E;AAAA,oBACHb,EAAYK,CAAM;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEpBI,IACC,gBAAAI;AAAA,gBAACI;AAAA,gBAAA;AAAA,kBACC,eAAW;AAAA,kBACX,WAAWN,EAAG,mEAAmEL,KAAQ,YAAY;AAAA,gBAAA;AAAA,cAAA,IAErG;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAELA,KAAQG,IACP,gBAAAC,EAAC,OAAA,EAAI,WAAU,gDACZ,UAAA;AAAA,UAAAP,sBACE,OAAA,EACC,UAAA;AAAA,YAAA,gBAAAO,EAAC,KAAA,EAAE,WAAU,2GACX,UAAA;AAAA,cAAA,gBAAAG,EAACK,GAAA,EAAI,WAAU,WAAU,eAAW,IAAC;AAAA,cAAE;AAAA,YAAA,GACzC;AAAA,YACA,gBAAAL,EAAC,OAAA,EAAI,WAAU,iFACZ,UAAAV,EAAA,CACH;AAAA,UAAA,EAAA,CACF,IACE;AAAA,UACHC,sBACE,OAAA,EACC,UAAA;AAAA,YAAA,gBAAAS,EAAC,KAAA,EAAE,WAAU,iFAAgF,UAAA,UAE7F;AAAA,YACA,gBAAAA,EAAC,KAAA,EAAE,WAAU,iEAAiE,UAAAT,EAAA,CAAO;AAAA,UAAA,EAAA,CACvF,IACE;AAAA,QAAA,EAAA,CACN,IACE;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/dist/es/components/AgentDemo/parts.js

@@ -0,0 +1,163 @@
+import { jsx as r, jsxs as a } from "react/jsx-runtime";
+import { cn as l } from "../../utils/cn.js";
+import { Send as p } from "../../icons.js";
+import { ToolCard as g } from "./ToolCard.js";
+function j({
+  title: e,
+  subtitle: n,
+  logo: t,
+  logoSrc: s,
+  logoAlt: o,
+  logoClassName: i,
+  footer: u,
+  logLabel: c,
+  logRef: m,
+  height: f = "70dvh",
+  children: x
+}) {
+  const d = t ?? (s ? /* @__PURE__ */ r(
+    "img",
+    {
+      src: s,
+      alt: o ?? (typeof e == "string" ? e : "Logo"),
+      className: l("h-8 w-8 rounded-lg object-cover", i)
+    }
+  ) : void 0);
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      style: { height: f },
+      className: "flex flex-col overflow-hidden rounded-2xl border border-border bg-surface text-foreground shadow-overlay",
+      children: [
+        /* @__PURE__ */ a("div", { className: "flex shrink-0 items-center gap-3 border-b border-border px-4 py-3 sm:px-5", children: [
+          /* @__PURE__ */ a("div", { className: "flex gap-1.5", "aria-hidden": !0, children: [
+            /* @__PURE__ */ r("span", { className: "h-2.5 w-2.5 rounded-full bg-foreground/15" }),
+            /* @__PURE__ */ r("span", { className: "h-2.5 w-2.5 rounded-full bg-foreground/15" }),
+            /* @__PURE__ */ r("span", { className: "h-2.5 w-2.5 rounded-full bg-foreground/15" })
+          ] }),
+          d ? /* @__PURE__ */ r("span", { className: "flex shrink-0 items-center", children: d }) : null,
+          e ?? n ? /* @__PURE__ */ a("div", { className: "min-w-0", children: [
+            e ? /* @__PURE__ */ r("p", { className: "truncate text-sm font-semibold tracking-tight", children: e }) : null,
+            n ? /* @__PURE__ */ r("p", { className: "truncate text-xs text-muted-foreground", children: n }) : null
+          ] }) : null
+        ] }),
+        /* @__PURE__ */ r(
+          "div",
+          {
+            role: "log",
+            ref: m,
+            "aria-live": "polite",
+            "aria-label": c,
+            className: "min-h-0 flex-1 overflow-y-auto px-4 py-5 sm:px-5",
+            children: /* @__PURE__ */ r("div", { className: "flex flex-col gap-4", children: x })
+          }
+        ),
+        u
+      ]
+    }
+  );
+}
+function M({
+  controls: e,
+  progress: n,
+  composing: t
+}) {
+  return /* @__PURE__ */ a("div", { className: "shrink-0 border-t border-border px-4 py-3 sm:px-5", children: [
+    e ?? n ? /* @__PURE__ */ a("div", { className: "mb-3 flex items-center gap-2", children: [
+      e,
+      n
+    ] }) : null,
+    /* @__PURE__ */ a(
+      "div",
+      {
+        "aria-hidden": !0,
+        className: "flex cursor-not-allowed items-center gap-2 rounded-xl border border-border bg-surface-strong/40 px-3.5 py-2.5 text-sm text-muted-foreground select-none",
+        children: [
+          t !== void 0 ? /* @__PURE__ */ a("span", { className: "flex-1 truncate text-foreground", children: [
+            t,
+            /* @__PURE__ */ r("span", { className: "ml-0.5 inline-block h-4 w-[2px] translate-y-[3px] animate-pulse bg-foreground" })
+          ] }) : /* @__PURE__ */ r("span", { className: "flex-1 truncate", children: "Ask anything…" }),
+          /* @__PURE__ */ r(
+            p,
+            {
+              className: l("h-4 w-4 shrink-0", t ? "text-foreground" : void 0)
+            }
+          )
+        ]
+      }
+    )
+  ] });
+}
+function h({ text: e, partial: n = !1 }) {
+  return /* @__PURE__ */ r("div", { className: "flex justify-end", children: /* @__PURE__ */ a("p", { className: "max-w-[85%] rounded-2xl rounded-br-md bg-primary px-3.5 py-2.5 text-sm leading-6 text-on-primary", children: [
+    e,
+    n ? /* @__PURE__ */ r("span", { className: "ml-0.5 inline-block h-4 w-[2px] translate-y-[3px] animate-pulse bg-on-primary" }) : null
+  ] }) });
+}
+function b({ text: e, partial: n = !1 }) {
+  return /* @__PURE__ */ r("div", { className: "flex justify-start", children: /* @__PURE__ */ a("p", { className: "max-w-[90%] rounded-2xl rounded-bl-md bg-primary-soft px-3.5 py-2.5 text-sm leading-6 text-foreground", children: [
+    e,
+    n ? /* @__PURE__ */ r("span", { className: "ml-0.5 inline-block h-4 w-[2px] translate-y-[3px] animate-pulse bg-foreground" }) : null
+  ] }) });
+}
+function N({ label: e, active: n = !0 }) {
+  return /* @__PURE__ */ a("div", { className: "flex items-center gap-2 text-[13px] text-muted-foreground", children: [
+    /* @__PURE__ */ r("span", { className: "flex gap-1", "aria-hidden": !0, children: ["[animation-delay:-0.3s]", "[animation-delay:-0.15s]", ""].map((s, o) => /* @__PURE__ */ r(
+      "span",
+      {
+        className: l(
+          "h-1.5 w-1.5 rounded-full bg-current",
+          n && "animate-bounce",
+          n && s
+        )
+      },
+      o
+    )) }),
+    /* @__PURE__ */ r("span", { className: n ? "animate-pulse" : void 0, children: e })
+  ] });
+}
+function S() {
+  return /* @__PURE__ */ r("p", { className: "py-10 text-center text-sm text-muted-foreground", children: "This demo has no steps yet." });
+}
+function T({ current: e, total: n, done: t }) {
+  return /* @__PURE__ */ r("span", { className: "text-xs tabular-nums text-muted-foreground", children: t ? "Demo complete" : `Step ${Math.min(e, n)} of ${n}` });
+}
+function D({ step: e }) {
+  return e.type === "user" ? /* @__PURE__ */ r(h, { text: e.text }) : e.type === "assistant" ? /* @__PURE__ */ r(b, { text: e.text }) : e.type === "thinking" ? /* @__PURE__ */ r(N, { label: e.label ?? "Thinking…", active: !1 }) : /* @__PURE__ */ r(
+    g,
+    {
+      name: e.name,
+      args: e.args,
+      result: e.result,
+      status: e.status === "error" ? "error" : "success"
+    }
+  );
+}
+function A({
+  className: e,
+  ...n
+}) {
+  return /* @__PURE__ */ r(
+    "button",
+    {
+      type: "button",
+      className: l(
+        "inline-flex h-8 cursor-pointer items-center gap-1.5 rounded-lg border border-border px-3 text-xs font-semibold text-foreground transition-colors duration-150 hover:border-foreground/25 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+        e
+      ),
+      ...n
+    }
+  );
+}
+export {
+  b as AssistantMessage,
+  A as ControlButton,
+  M as DemoFooter,
+  j as DemoWindow,
+  S as EmptyState,
+  D as FinishedStep,
+  T as StepProgress,
+  N as ThinkingRow,
+  h as UserMessage
+};
+//# sourceMappingURL=parts.js.map

package/dist/es/components/AgentDemo/parts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"parts.js","sources":["../../../../src/components/AgentDemo/parts.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes, ReactNode, Ref } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Send } from \"../../icons\";\nimport type { AgentScriptStep } from \"./types\";\nimport { ToolCard } from \"./ToolCard\";\n\nexport function DemoWindow({\n  title,\n  subtitle,\n  logo,\n  logoSrc,\n  logoAlt,\n  logoClassName,\n  footer,\n  logLabel,\n  logRef,\n  height = \"70dvh\",\n  children,\n}: {\n  title?: ReactNode;\n  subtitle?: ReactNode;\n  logo?: ReactNode;\n  logoSrc?: string;\n  logoAlt?: string;\n  logoClassName?: string;\n  footer?: ReactNode;\n  logLabel: string;\n  logRef?: Ref<HTMLDivElement>;\n  height?: string;\n  children: ReactNode;\n}) {\n  const logoNode =\n    logo ??\n    (logoSrc ? (\n      <img\n        src={logoSrc}\n        alt={logoAlt ?? (typeof title === \"string\" ? title : \"Logo\")}\n        className={cn(\"h-8 w-8 rounded-lg object-cover\", logoClassName)}\n      />\n    ) : undefined);\n  return (\n    <div\n      style={{ height }}\n      className=\"flex flex-col overflow-hidden rounded-2xl border border-border bg-surface text-foreground shadow-overlay\"\n    >\n      <div className=\"flex shrink-0 items-center gap-3 border-b border-border px-4 py-3 sm:px-5\">\n        <div className=\"flex gap-1.5\" aria-hidden>\n          <span className=\"h-2.5 w-2.5 rounded-full bg-foreground/15\" />\n          <span className=\"h-2.5 w-2.5 rounded-full bg-foreground/15\" />\n          <span className=\"h-2.5 w-2.5 rounded-full bg-foreground/15\" />\n        </div>\n        {logoNode ? <span className=\"flex shrink-0 items-center\">{logoNode}</span> : null}\n        {title ?? subtitle ? (\n          <div className=\"min-w-0\">\n            {title ? (\n              <p className=\"truncate text-sm font-semibold tracking-tight\">{title}</p>\n            ) : null}\n            {subtitle ? (\n              <p className=\"truncate text-xs text-muted-foreground\">{subtitle}</p>\n            ) : null}\n          </div>\n        ) : null}\n      </div>\n\n      <div\n        role=\"log\"\n        ref={logRef}\n        aria-live=\"polite\"\n        aria-label={logLabel}\n        className=\"min-h-0 flex-1 overflow-y-auto px-4 py-5 sm:px-5\"\n      >\n        <div className=\"flex flex-col gap-4\">{children}</div>\n      </div>\n\n      {footer}\n    </div>\n  );\n}\n\nexport function DemoFooter({\n  controls,\n  progress,\n  composing,\n}: {\n  controls?: ReactNode;\n  progress?: ReactNode;\n  composing?: string;\n}) {\n  const hasMeta = controls ?? progress;\n  return (\n    <div className=\"shrink-0 border-t border-border px-4 py-3 sm:px-5\">\n      {hasMeta ? (\n        <div className=\"mb-3 flex items-center gap-2\">\n          {controls}\n          {progress}\n        </div>\n      ) : null}\n      <div\n        aria-hidden\n        className=\"flex cursor-not-allowed items-center gap-2 rounded-xl border border-border bg-surface-strong/40 px-3.5 py-2.5 text-sm text-muted-foreground select-none\"\n      >\n        {composing !== undefined ? (\n          <span className=\"flex-1 truncate text-foreground\">\n            {composing}\n            <span className=\"ml-0.5 inline-block h-4 w-[2px] translate-y-[3px] animate-pulse bg-foreground\" />\n          </span>\n        ) : (\n          <span className=\"flex-1 truncate\">Ask anything…</span>\n        )}\n        <Send\n          className={cn(\"h-4 w-4 shrink-0\", composing ? \"text-foreground\" : undefined)}\n        />\n      </div>\n    </div>\n  );\n}\n\nexport function UserMessage({ text, partial = false }: { text: string; partial?: boolean }) {\n  return (\n    <div className=\"flex justify-end\">\n      <p className=\"max-w-[85%] rounded-2xl rounded-br-md bg-primary px-3.5 py-2.5 text-sm leading-6 text-on-primary\">\n        {text}\n        {partial ? (\n          <span className=\"ml-0.5 inline-block h-4 w-[2px] translate-y-[3px] animate-pulse bg-on-primary\" />\n        ) : null}\n      </p>\n    </div>\n  );\n}\n\nexport function AssistantMessage({ text, partial = false }: { text: string; partial?: boolean }) {\n  return (\n    <div className=\"flex justify-start\">\n      <p className=\"max-w-[90%] rounded-2xl rounded-bl-md bg-primary-soft px-3.5 py-2.5 text-sm leading-6 text-foreground\">\n        {text}\n        {partial ? (\n          <span className=\"ml-0.5 inline-block h-4 w-[2px] translate-y-[3px] animate-pulse bg-foreground\" />\n        ) : null}\n      </p>\n    </div>\n  );\n}\n\nexport function ThinkingRow({ label, active = true }: { label: string; active?: boolean }) {\n  const dots = [\"[animation-delay:-0.3s]\", \"[animation-delay:-0.15s]\", \"\"];\n  return (\n    <div className=\"flex items-center gap-2 text-[13px] text-muted-foreground\">\n      <span className=\"flex gap-1\" aria-hidden>\n        {dots.map((delay, i) => (\n          <span\n            key={i}\n            className={cn(\n              \"h-1.5 w-1.5 rounded-full bg-current\",\n              active && \"animate-bounce\",\n              active && delay,\n            )}\n          />\n        ))}\n      </span>\n      <span className={active ? \"animate-pulse\" : undefined}>{label}</span>\n    </div>\n  );\n}\n\nexport function EmptyState() {\n  return (\n    <p className=\"py-10 text-center text-sm text-muted-foreground\">\n      This demo has no steps yet.\n    </p>\n  );\n}\n\nexport function StepProgress({ current, total, done }: { current: number; total: number; done: boolean }) {\n  return (\n    <span className=\"text-xs tabular-nums text-muted-foreground\">\n      {done ? \"Demo complete\" : `Step ${Math.min(current, total)} of ${total}`}\n    </span>\n  );\n}\n\n/** Render one script step in its finished state (used by the transcript and completed player steps). */\nexport function FinishedStep({ step }: { step: AgentScriptStep }) {\n  if (step.type === \"user\") return <UserMessage text={step.text} />;\n  if (step.type === \"assistant\") return <AssistantMessage text={step.text} />;\n  if (step.type === \"thinking\") return <ThinkingRow label={step.label ?? \"Thinking…\"} active={false} />;\n  return (\n    <ToolCard\n      name={step.name}\n      args={step.args}\n      result={step.result}\n      status={step.status === \"error\" ? \"error\" : \"success\"}\n    />\n  );\n}\n\nexport function ControlButton({\n  className,\n  ...props\n}: ButtonHTMLAttributes<HTMLButtonElement>) {\n  return (\n    <button\n      type=\"button\"\n      className={cn(\n        \"inline-flex h-8 cursor-pointer items-center gap-1.5 rounded-lg border border-border px-3 text-xs font-semibold text-foreground transition-colors duration-150 hover:border-foreground/25 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n"],"names":["DemoWindow","title","subtitle","logo","logoSrc","logoAlt","logoClassName","footer","logLabel","logRef","height","children","logoNode","jsx","cn","jsxs","DemoFooter","controls","progress","composing","Send","UserMessage","text","partial","AssistantMessage","ThinkingRow","label","active","delay","i","EmptyState","StepProgress","current","total","done","FinishedStep","step","ToolCard","ControlButton","className","props"],"mappings":"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"}