@kitn.ai/ui 0.29.0 → 0.31.0

package/README.md

@@ -75,7 +75,7 @@ The element bundle is a self-contained ES module — load it directly from [jsDe
 ```
 
 <!-- x-release-please-start-version -->
-The URLs above track the **latest** release — handy for trying things out. **For production, pin an exact version** (e.g. `@kitn.ai/ui@0.29.0/dist/kai.es.js`): pinned URLs are immutable and cached far more aggressively, and — since this package is pre-1.0 — pinning shields you from breaking changes in a future minor release.
+The URLs above track the **latest** release — handy for trying things out. **For production, pin an exact version** (e.g. `@kitn.ai/ui@0.31.0/dist/kai.es.js`): pinned URLs are immutable and cached far more aggressively, and — since this package is pre-1.0 — pinning shields you from breaking changes in a future minor release.
 <!-- x-release-please-end -->
 
 > **Pin `0.25.0` or newer.** Every version from `0.14.1` through `0.24.0` is covered by a [critical security advisory](https://github.com/kitn-ai/ui/security/advisories) and is deprecated on npm. `npm install` warns you about a deprecated version; **a CDN fetch does not**, so an old pinned URL in a page keeps serving the vulnerable bundle silently.
@@ -96,7 +96,7 @@ import {
   Message, MessageContent,
   PromptInput, PromptInputTextarea, PromptInputActions,
 } from '@kitn.ai/ui';
-import '@kitn.ai/ui/theme.css'; // Tailwind-source; non-Tailwind builds import theme.tokens.css instead — see "Which theme file"
+import '@kitn.ai/ui/solid.css'; // Tailwind-source: tokens + base rules + the animation/typography plugins, see "Which theme file"
 
 function App() {
   const [input, setInput] = createSignal('');
@@ -315,17 +315,19 @@ Per element: `<kai-chat codeHighlight={false}>` renders code as plain text.
 
 ## Theming
 
-Visual appearance is driven by `--color-*` CSS custom properties in `theme.css`. Because inherited CSS pierces the Shadow DOM boundary, overriding tokens on `:root` rebrands the components — even the web-component ones:
+Every element reads its colors from `--color-*` custom properties, and each of those is defined on `:host` inside the shadow root as `var(--kai-color-*, <default>)`. A `:host` declaration beats anything inherited from the page, so setting `--color-primary` on `:root` does NOT reach the elements. Set the `--kai-` names instead; custom properties inherit through the shadow boundary and the `:host` fallback picks them up:
 
 ```css
 :root {
-  --color-background: #0f0f0f;
-  --color-primary: #7c3aed;
-  --color-muted: #1e1e1e;
+  --kai-color-background: #0f0f0f;
+  --kai-color-primary: #7c3aed;
+  --kai-color-muted: #1e1e1e;
 }
 ```
 
-For web components the kit's CSS is injected into each shadow root automatically; the token stylesheet is optional and only themes host-page chrome / rebrands.
+To rebrand one element rather than the page, target the element itself. A rule in the document (`kai-chat { --color-primary: #7c3aed }`) outranks the shadow root's `:host` rule, so the bare `--color-*` names work there.
+
+The kit's CSS is injected into each shadow root automatically, so the token stylesheet is optional for web components. The unprefixed `--color-*` names it defines are for your own host-page chrome and the light-DOM SolidJS components, which have no shadow root.
 
 ### Which theme file
 
@@ -334,6 +336,8 @@ Two builds of the same tokens; the condition is whether **Tailwind processes the
 - **`@kitn.ai/ui/theme.css`** — Tailwind v4 source (`@theme` block; needs `tailwindcss` as a peer). Import it only in an app whose build runs Tailwind over its CSS. Served raw to a browser, the `@theme` block is discarded whole and the tokens never apply.
 - **`@kitn.ai/ui/theme.tokens.css`** — the compiled plain-CSS build of the same tokens, no toolchain requirements. Use it in every non-Tailwind bundler app and for `<link>`/CDN pages.
 
+For the SolidJS components (Option B) import **`@kitn.ai/ui/solid.css`** instead of `theme.css`. It imports `theme.css` and adds what the `kai-*` elements carry in their shadow roots and a light-DOM app must compile itself: the form-control and focus-ring rules, `tw-animate-css` (overlay animations) and `@tailwindcss/typography` (`prose-*`). Those two are optional peer dependencies: `npm i -D tw-animate-css @tailwindcss/typography`. Keep the `@source` line pointing at the kit either way.
+
 ## For AI agents / LLMs
 
 The package ships a stdio MCP server too — `npx @kitn.ai/ui mcp` gives any MCP harness tools to look up the real `kai-*` API, scaffold a wired chat surface, theme it, and catch the classic mistakes:

package/dist/{Icon-DObhsRtm.js → Icon-DJDuE_-x.js}

@@ -1 +1 @@
-import{s as d,p as h,q as i,m as u,i as c,c as n,D as k,F as g,t as w}from"./define-By-uL588.js";var m={xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":2,"stroke-linecap":"round","stroke-linejoin":"round"},t=m,p=w("<svg>"),v=r=>r.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase(),b=(...r)=>r.filter((e,s,o)=>!!e&&o.indexOf(e)===s).join(" "),f=r=>{const[e,s]=d(r,["color","size","strokeWidth","children","class","name","iconNode","absoluteStrokeWidth"]);return(()=>{var o=p();return h(o,i(t,{get width(){return e.size??t.width},get height(){return e.size??t.height},get stroke(){return e.color??t.stroke},get"stroke-width"(){return u(()=>!!e.absoluteStrokeWidth)()?Number(e.strokeWidth??t["stroke-width"])*24/Number(e.size):Number(e.strokeWidth??t["stroke-width"])},get class(){return b("lucide","lucide-icon",e.name!=null?`lucide-${v(e?.name)}`:void 0,e.class!=null?e.class:"")}},s),!0,!0),c(o,n(g,{get each(){return e.iconNode},children:([a,l])=>n(k,i({component:a},l))})),o})()},z=f;export{z as I};
+import{s as d,p as h,q as i,m as u,i as c,c as n,D as k,F as g,t as w}from"./define-B3OpsIDE.js";var m={xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":2,"stroke-linecap":"round","stroke-linejoin":"round"},t=m,p=w("<svg>"),v=r=>r.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase(),b=(...r)=>r.filter((e,s,o)=>!!e&&o.indexOf(e)===s).join(" "),f=r=>{const[e,s]=d(r,["color","size","strokeWidth","children","class","name","iconNode","absoluteStrokeWidth"]);return(()=>{var o=p();return h(o,i(t,{get width(){return e.size??t.width},get height(){return e.size??t.height},get stroke(){return e.color??t.stroke},get"stroke-width"(){return u(()=>!!e.absoluteStrokeWidth)()?Number(e.strokeWidth??t["stroke-width"])*24/Number(e.size):Number(e.strokeWidth??t["stroke-width"])},get class(){return b("lucide","lucide-icon",e.name!=null?`lucide-${v(e?.name)}`:void 0,e.class!=null?e.class:"")}},s),!0,!0),c(o,n(g,{get each(){return e.iconNode},children:([a,l])=>n(k,i({component:a},l))})),o})()},z=f;export{z as I};

package/dist/action-icons-xkBBVKkF.js

@@ -0,0 +1 @@
+import{I as e}from"./Icon-DJDuE_-x.js";import{c as o,q as r}from"./define-B3OpsIDE.js";import{f as s,t as i,b as p,s as m,p as k}from"./trash-2-Cu8yZmFQ.js";import{c as d}from"./check-BG1VfYjm.js";import{c as n}from"./copy-DfI2NYEX.js";import{d as l}from"./rotate-cw-qkl39dw3.js";import{e as f}from"./ellipsis-CJ5QIjWo.js";import{l as c}from"./link-rlN11N0B.js";import{s as y}from"./star-ZvSbbXS6.js";import{t as h,a as v}from"./thumbs-up-CDGW7a4o.js";import{x as u}from"./x-C4niw05N.js";var g=[["path",{d:"M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8",key:"v9h5vc"}],["path",{d:"M21 3v5h-5",key:"1q7to0"}],["path",{d:"M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16",key:"3uifl3"}],["path",{d:"M8 16H3v5",key:"1cv678"}]],M=a=>o(e,r(a,{name:"RefreshCw",iconNode:g})),R=M,L=[["polyline",{points:"9 17 4 12 9 7",key:"hvgpf2"}],["path",{d:"M20 18v-2a4 4 0 0 0-4-4H4",key:"5vmcpk"}]],N=a=>o(e,r(a,{name:"Reply",iconNode:L})),w=N,x=[["polygon",{points:"11 5 6 9 2 9 2 15 6 15 11 19 11 5",key:"16drj5"}],["path",{d:"M15.54 8.46a5 5 0 0 1 0 7.07",key:"ltjumu"}],["path",{d:"M19.07 4.93a10 10 0 0 1 0 14.14",key:"1kegas"}]],C=a=>o(e,r(a,{name:"Volume2",iconNode:x})),t=C;const b={copy:n,like:v,dislike:h,regenerate:R,edit:k,speak:t,share:m,bookmark:p,download:l,link:c,trash:i,check:d,x:u,star:y,flag:s,reply:w,more:f,"volume-2":t};function j(a){if(a)return b[a]}const q={copy:"Copy",like:"Like",dislike:"Dislike",regenerate:"Regenerate",edit:"Edit",speak:"Read aloud"};export{q as B,j as a};

package/dist/agent-tooling/construct/schema-url.d.ts

@@ -0,0 +1,9 @@
+/**
+ * The construct schema's published URL — a LEAF on purpose (the kit-pin.ts
+ * pattern, same reason as C-2's chat-actions const): templates.ts must stamp
+ * `$schema` on every starter (B-14) without a value import of schema.ts,
+ * whose top-level zod side effects esbuild cannot tree-shake past
+ * (create-kai's wizard.ts header records that failure). schema.ts re-exports
+ * this, so every existing import site keeps its one address.
+ */
+export declare const CONSTRUCT_SCHEMA_URL = "https://ui.kitn.ai/schemas/construct/v1.json";

package/dist/agent-tooling/construct/schema.d.ts

@@ -1,5 +1,5 @@
 import { z } from 'zod';
-export declare const CONSTRUCT_SCHEMA_URL = "https://ui.kitn.ai/schemas/construct/v1.json";
+export { CONSTRUCT_SCHEMA_URL } from './schema-url.js';
 export declare const ConstructSchema: z.ZodObject<{
     $schema: z.ZodOptional<z.ZodString>;
     name: z.ZodString;
@@ -32,6 +32,17 @@ export declare const ConstructSchema: z.ZodObject<{
     }, z.core.$strict>>;
     header: z.ZodOptional<z.ZodObject<{
         title: z.ZodOptional<z.ZodString>;
+        themeToggle: z.ZodOptional<z.ZodBoolean>;
+        actions: z.ZodOptional<z.ZodArray<z.ZodObject<{
+            label: z.ZodString;
+            variant: z.ZodOptional<z.ZodEnum<{
+                default: "default";
+                ghost: "ghost";
+                subtle: "subtle";
+                outline: "outline";
+                destructive: "destructive";
+            }>>;
+        }, z.core.$strict>>>;
     }, z.core.$strict>>;
     empty: z.ZodOptional<z.ZodObject<{
         title: z.ZodString;
@@ -74,6 +85,27 @@ export declare const ConstructSchema: z.ZodObject<{
         }>>;
         reasoningOpen: z.ZodOptional<z.ZodBoolean>;
         conversations: z.ZodOptional<z.ZodLiteral<true>>;
+        messageActions: z.ZodOptional<z.ZodObject<{
+            user: z.ZodOptional<z.ZodArray<z.ZodEnum<{
+                copy: "copy";
+                like: "like";
+                dislike: "dislike";
+                regenerate: "regenerate";
+                edit: "edit";
+                speak: "speak";
+            }>>>;
+            assistant: z.ZodOptional<z.ZodArray<z.ZodEnum<{
+                copy: "copy";
+                like: "like";
+                dislike: "dislike";
+                regenerate: "regenerate";
+                edit: "edit";
+                speak: "speak";
+            }>>>;
+        }, z.core.$strict>>;
+        sources: z.ZodOptional<z.ZodObject<{
+            strip: z.ZodOptional<z.ZodBoolean>;
+        }, z.core.$strict>>;
     }, z.core.$strict>>;
     cards: z.ZodOptional<z.ZodArray<z.ZodObject<{
         name: z.ZodString;
@@ -90,8 +122,51 @@ export declare const ConstructSchema: z.ZodObject<{
         launcherIcon: z.ZodOptional<z.ZodString>;
         defaultOpen: z.ZodOptional<z.ZodBoolean>;
     }, z.core.$strict>>;
+    aside: z.ZodOptional<z.ZodObject<{
+        position: z.ZodOptional<z.ZodEnum<{
+            start: "start";
+            end: "end";
+        }>>;
+        width: z.ZodOptional<z.ZodString>;
+    }, z.core.$strict>>;
+    shell: z.ZodOptional<z.ZodObject<{
+        commandPalette: z.ZodOptional<z.ZodLiteral<true>>;
+        userMenu: z.ZodOptional<z.ZodObject<{
+            name: z.ZodString;
+            plan: z.ZodOptional<z.ZodString>;
+        }, z.core.$strict>>;
+    }, z.core.$strict>>;
+    composer: z.ZodOptional<z.ZodObject<{
+        triggers: z.ZodOptional<z.ZodObject<{
+            slash: z.ZodOptional<z.ZodArray<z.ZodObject<{
+                id: z.ZodString;
+                label: z.ZodString;
+                description: z.ZodOptional<z.ZodString>;
+            }, z.core.$strict>>>;
+            mention: z.ZodOptional<z.ZodArray<z.ZodObject<{
+                id: z.ZodString;
+                label: z.ZodString;
+                description: z.ZodOptional<z.ZodString>;
+            }, z.core.$strict>>>;
+        }, z.core.$strict>>;
+    }, z.core.$strict>>;
 }, z.core.$strict>;
 export type Construct = z.infer<typeof ConstructSchema>;
+/** One cross-field rule of the construct format (B-20). The table is the
+ *  visibility layer's guard: the builder's RULE_VISIBILITY registry
+ *  (src/components/construct-form-paths.ts) is keyed by these ids, and a
+ *  key-set-equality test fails any new rule until the builder classifies
+ *  it. `paths` names the dotted construct paths the rule READS — panel
+ *  metadata, not zod mechanics. Bodies are the pre-table superRefine code
+ *  verbatim; behavior (messages included) is pinned by schema.test.ts and
+ *  the generated artifact is pinned byte-identical by verify:generated
+ *  (superRefine never serializes into z.toJSONSchema output). */
+export interface CrossFieldRule {
+    id: string;
+    paths: readonly string[];
+    check: (construct: Construct, ctx: z.RefinementCtx) => void;
+}
+export declare const CROSS_FIELD_RULES: readonly CrossFieldRule[];
 export interface ConstructProblem {
     /** Dotted path into the construct, '' for the root. */
     path: string;

package/dist/agent-tooling/construct/templates.d.ts

@@ -0,0 +1,45 @@
+import { Construct } from './schema.js';
+export type TemplateId = 'widget' | 'inAppAssistant' | 'assistant' | 'research' | 'workspace' | 'voice';
+export type BuildableTemplateId = Exclude<TemplateId, 'voice'>;
+export interface TemplateVariant {
+    id: string;
+    name: string;
+    description: string;
+    starter: Construct;
+}
+/** One panel section: a stable id (phase 3's BuilderPanel keys its section
+ *  registry off these — the shape builder-panel.tsx's sections already
+ *  stubbed) plus the schema paths the section edits. */
+export interface TemplateControlSection {
+    id: string;
+    paths: readonly string[];
+}
+export interface BuildableTemplate {
+    id: BuildableTemplateId;
+    name: string;
+    description: string;
+    availability: 'buildable';
+    starter: Construct;
+    variants?: readonly TemplateVariant[];
+    controls: readonly TemplateControlSection[];
+}
+export interface StoryOnlyTemplate {
+    id: Extract<TemplateId, 'voice'>;
+    name: string;
+    description: string;
+    availability: 'story-only';
+}
+export type TemplateEntry = BuildableTemplate | StoryOnlyTemplate;
+export declare const TEMPLATES: readonly TemplateEntry[];
+export declare function buildableTemplates(): readonly BuildableTemplate[];
+export declare function templateById(id: TemplateId): TemplateEntry | undefined;
+/**
+ * Derive a buildable template's family from a LOADED construct's own shape
+ * (T-3 forbids a template key in the file, so there is nothing else to read
+ * this from). Layout is the discriminant for four of the five buildable
+ * families; `fullscreen` splits further on `capabilities.sources` being
+ * present, the research template's one defining fact (see researchStarter's
+ * comment). `custom` and any unrecognized shape return undefined — the
+ * caller falls back to a neutral label rather than guessing.
+ */
+export declare function inferTemplateId(c: Construct): BuildableTemplateId | undefined;

package/dist/arrow-down-DU6wOl-h.js

@@ -0,0 +1 @@
+import{I as o}from"./Icon-DJDuE_-x.js";import{c as r,q as e}from"./define-B3OpsIDE.js";var m=[["path",{d:"M12 5v14",key:"s699le"}],["path",{d:"m19 12-7 7-7-7",key:"1idqje"}]],p=a=>r(o,e(a,{name:"ArrowDown",iconNode:m})),t=p;export{t as a};

package/dist/arrow-left-DD46kN17.js

@@ -0,0 +1 @@
+import{I as o}from"./Icon-DJDuE_-x.js";import{c as r,q as e}from"./define-B3OpsIDE.js";var m=[["path",{d:"m12 19-7-7 7-7",key:"1l729n"}],["path",{d:"M19 12H5",key:"x3x0zl"}]],t=a=>r(o,e(a,{name:"ArrowLeft",iconNode:m})),p=t;export{p as a};

package/dist/artifact-DoUAr1Fd.js

@@ -0,0 +1 @@
+import{q as J,s as he,g as k,k as y,j as F,x as Q,o as X,p as fe,i as c,c as a,S as g,t as v,d as p,a as z,b as Y,u as Z,m as ge,h as be,e as ve}from"./define-B3OpsIDE.js";import{c as H}from"./cn-DN5AWfiS.js";import{B as C}from"./button-BM0YTTDQ.js";import{C as me,a as pe}from"./code-block-H6E5Eurc.js";import{F as we}from"./file-tree-a9tfWYmg.js";import{L as xe}from"./loader-BdFK70fF.js";import{a as ke,i as ee}from"./url-scheme-policy-DR5DgvkM.js";import{a as ye}from"./arrow-left-DD46kN17.js";import{a as ze,r as Ce,h as Te,e as Fe,c as Pe,d as Se}from"./rotate-cw-qkl39dw3.js";import{e as re}from"./external-link-BPTtTdet.js";import{f as Oe}from"./file-text-eVjcFDrK.js";import{m as Re,a as je}from"./minimize-2-BxLOOSEf.js";const Ie="6.0.227",ne=`https://cdn.jsdelivr.net/npm/pdfjs-dist@${Ie}/build`,He=()=>import(/*@vite-ignore*/`${ne}/pdf.min.mjs`),Ne=`${ne}/pdf.worker.min.mjs`;let Ee=He,Me=Ne,N=null;function $e(){if(!N){const r=Ee;N=(async()=>{const t=await r(),e=t.default??t;return e.GlobalWorkerOptions.workerSrc=Me,e})()}return N}async function Be(r,t,e){const i=await(await $e()).getDocument({url:r}).promise;t.replaceChildren();const o=typeof window<"u"&&window.devicePixelRatio?window.devicePixelRatio:1;for(let s=1;s<=i.numPages;s++){const d=await i.getPage(s),u=d.getViewport({scale:1}),h=u.width>0?e/u.width:1,f=d.getViewport({scale:h*o}),b=document.createElement("canvas");b.width=Math.max(1,Math.floor(f.width)),b.height=Math.max(1,Math.floor(f.height)),b.setAttribute("role","img"),b.setAttribute("aria-label",`Page ${s}`),b.style.width="100%",b.style.height="auto",b.style.display="block";const w=b.getContext("2d");t.appendChild(b),await d.render({canvasContext:w,viewport:f}).promise}return{pages:i.numPages}}var Le=v('<div><div class="relative min-h-0 flex-1">'),Ue=v('<form class="min-w-0 flex-1"><label class=sr-only for=kai-artifact-path>Address</label><input id=kai-artifact-path name=kai-artifact-path type=text autocomplete=off placeholder="Enter a path or URL\u2026">'),De=v("<div class=flex-1 aria-hidden=true>"),Ae=v('<div role=tablist aria-label=View class="flex shrink-0 items-center gap-0.5 rounded-md bg-muted p-0.5">'),Ve=v('<div data-artifact-toolbar class="flex shrink-0 items-center gap-1.5 border-b border-border bg-surface px-2 py-1.5">'),We=v("<button type=button role=tab>"),Ke=v('<iframe class="absolute inset-0 h-full w-full border-0 bg-white">'),_e=v('<div class="absolute inset-0 flex"><div class="w-56 shrink-0 overflow-auto border-r border-border bg-surface-sunken py-1.5 kai-scrollbar-thin"></div><div class="min-w-0 flex-1 overflow-auto kai-scrollbar-thin">'),qe=v('<div class="flex h-full items-center justify-center p-6 text-sm text-muted-foreground">Select a file to view its source.'),Ge=v('<div class="flex h-full items-center justify-center p-6 text-sm text-muted-foreground">No source \u2014 this file (<!>) has no code view.'),Je=v('<div class="flex flex-wrap items-center justify-center gap-2"><a class="inline-flex h-8 items-center gap-1.5 rounded-md border border-border bg-background px-3 text-xs font-medium text-foreground transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"target=_blank rel="noopener noreferrer">Open in new tab</a><a class="inline-flex h-8 items-center gap-1.5 rounded-md border border-border bg-background px-3 text-xs font-medium text-foreground transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"download>Download'),Qe=v(`<div role=region aria-label="PDF preview unavailable"class="absolute inset-0 flex flex-col items-center justify-center gap-3 bg-card p-6 text-center"><div class="text-sm font-medium text-foreground"></div><div class="text-xs text-muted-foreground">Can't preview this PDF inline.`),Xe=v(`<div class="text-xs text-muted-foreground">Blocked: that address uses a scheme this viewer won't open.`),Ye=v('<div class="pointer-events-none absolute inset-0 flex items-center justify-center">'),Ze=v('<div class="absolute inset-0"><div role=region aria-label="PDF preview"tabindex=0 class="absolute inset-0 flex flex-col items-center gap-3 overflow-auto bg-surface-sunken p-3 kai-scrollbar-thin focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset">');const er="allow-scripts allow-forms";function E(r,t){console.warn(`[kai-artifact] blocked unsafe url in ${r}: ${t}`)}function rr(r,t){if(r.url)return r.url;if(!t)return r.path;try{return new URL(r.path,t).href}catch{return r.path}}function nr(r,t){if(!r)return!1;const e=t.find(o=>o.url===r||o.path===r);if(e?.type==="pdf")return!0;const i=r.split(/[?#]/)[0];return/\.pdf$/i.test(i)}function tr(r){const t=J({files:[],defaultTab:"preview",sandbox:er,showNav:!0,showReload:!0,showHome:!0,showPathField:!0,showTabs:!0,expandable:!1,openInTab:!1,standalone:!1,readonlyPath:!1,maximized:!1},r),[e,i]=he(t,["src","files","tab","defaultTab","activeFile","sandbox","iframeTitle","onNavigate","onTabChange","onFileSelect","maximized","onMaximizeChange","showNav","showReload","showHome","showPathField","showTabs","expandable","openInTab","standalone","readonlyPath","displayUrl","controllerRef","class"]),[o,s]=k(e.src?[e.src]:[]),[d,u]=k(e.src?0:-1),h=()=>o()[d()]??"",f=()=>d()>0,b=()=>d()<o().length-1,w=y(()=>{const n=h();return n&&ke(n)?(E("preview",n),""):n}),[P,M]=k(e.tab??e.defaultTab),[$,B]=k(e.activeFile),[ae,ie]=k(0),[S,O]=k(e.maximized??!1);F(()=>O(e.maximized??!1));const le=()=>{var n;const l=!S();O(l),(n=e.onMaximizeChange)==null||n.call(e,l)},L=y(()=>{const n=h();return!!n&&n!=="about:blank"&&ee(n)}),U=()=>{const n=h();if(!L()){n&&n!=="about:blank"&&E("openExternal",n);return}window.open(n,"_blank","noopener,noreferrer")},D=y(()=>e.expandable&&!e.standalone),oe=y(()=>e.showNav||e.showReload||e.showHome||e.showPathField||e.showTabs||D()||e.openInTab);let x;F(()=>{e.tab!==void 0&&M(e.tab)}),F(()=>B(e.activeFile)),F(Q(()=>e.src,n=>{n&&n!==h()&&T(n)},{defer:!0}));const A=n=>n===void 0?void 0:e.files.find(l=>l.path===n),V=y(()=>A($())),se=y(()=>{const n=V();return!!n&&n.type!=="image"&&n.type!=="pdf"&&typeof n.code=="string"});function T(n){if(n===h()){j();return}s(l=>[...l.slice(0,d()+1),n]),u(l=>l+1),R()}function R(){var n;x&&(x.src=w()||"about:blank"),(n=e.onNavigate)==null||n.call(e,h())}function de(n){var l;n!==P()&&(M(n),(l=e.onTabChange)==null||l.call(e,n))}function W(n,l){var m;B(n),(m=e.onFileSelect)==null||m.call(e,n),T(rr(l,e.src))}const K=()=>{f()&&(u(n=>n-1),R())},_=()=>{b()&&(u(n=>n+1),R())};function j(){var n;x&&(x.src="about:blank",x.src=w()||"about:blank"),ie(l=>l+1),(n=e.onNavigate)==null||n.call(e,h())}const q=()=>{e.src&&T(e.src)},G=n=>{var l;S()!==n&&(O(n),(l=e.onMaximizeChange)==null||l.call(e,n))};X(()=>{var n;(n=e.controllerRef)==null||n.call(e,{back:()=>K(),forward:()=>_(),reload:()=>j(),home:()=>q(),navigate:l=>T(l),selectFile:l=>{const m=A(l);m&&W(l,m)},openExternal:()=>U(),maximize:()=>G(!0),restore:()=>G(!1)})});const ue=()=>{var n,l;try{const m=(n=x?.contentWindow)==null?void 0:n.location.href;m&&m!=="about:blank"&&m!==h()&&(s(I=>[...I.slice(0,d()+1),m]),u(I=>I+1),(l=e.onNavigate)==null||l.call(e,m))}catch{}},ce=n=>{n.preventDefault();const l=n.currentTarget.elements.namedItem("kai-artifact-path");if(e.readonlyPath||e.displayUrl!=null){l&&(l.value=e.displayUrl??h());return}l&&l.value&&T(l.value)};return(()=>{var n=Le(),l=n.firstChild;return fe(n,J({get class(){return H("flex h-full w-full flex-col overflow-hidden bg-card text-card-foreground",e.standalone&&"rounded-xl border border-border",e.class)}},i),!1,!0),c(n,a(g,{get when(){return oe()},get children(){return a(ar,{url:()=>e.displayUrl??h(),tab:P,canBack:f,canForward:b,canHome:()=>!!e.src,onBack:K,onForward:_,onReload:j,onHome:q,onSubmitPath:ce,onTab:de,showNav:()=>e.showNav,showReload:()=>e.showReload,showHome:()=>e.showHome,showPathField:()=>e.showPathField,showTabs:()=>e.showTabs,showExpand:D,showOpenInTab:()=>e.openInTab,maximized:S,onToggleMaximize:le,canOpenInTab:L,onOpenInTab:U,readonlyPath:()=>e.readonlyPath||e.displayUrl!=null})}}),l),c(l,a(g,{get when(){return P()==="preview"},get fallback(){return a(lr,{get files(){return e.files},activeFile:$,activeFileObj:V,hasSource:se,onSelect:W})},get children(){return a(g,{get when(){return nr(h(),e.files)},get fallback(){return a(ir,{ref:m=>x=m,src:w,get sandbox(){return e.sandbox},get title(){return e.iframeTitle??"Artifact preview"},onLoad:ue})},get children(){return a(sr,{get url(){return h()},get reloadKey(){return ae()}})}})}})),n})()}function ar(r){return(()=>{var t=Ve();return c(t,a(g,{get when(){return r.showNav()},get children(){return[a(C,{variant:"ghost",size:"icon-sm","aria-label":"Back",get disabled(){return!r.canBack()},onClick:()=>r.onBack(),get children(){return a(ye,{size:16,"aria-hidden":"true"})}}),a(C,{variant:"ghost",size:"icon-sm","aria-label":"Forward",get disabled(){return!r.canForward()},onClick:()=>r.onForward(),get children(){return a(ze,{size:16,"aria-hidden":"true"})}})]}}),null),c(t,a(g,{get when(){return r.showReload()},get children(){return a(C,{variant:"ghost",size:"icon-sm","aria-label":"Reload",onClick:()=>r.onReload(),get children(){return a(Ce,{size:15,"aria-hidden":"true"})}})}}),null),c(t,a(g,{get when(){return r.showHome()},get children(){return a(C,{variant:"ghost",size:"icon-sm","aria-label":"Home",get disabled(){return!r.canHome()},onClick:()=>r.onHome(),get children(){return a(Te,{size:15,"aria-hidden":"true"})}})}}),null),c(t,a(g,{get when(){return r.showPathField()},get children(){var e=Ue(),i=e.firstChild,o=i.nextSibling;return e.addEventListener("submit",s=>r.onSubmitPath(s)),p(o,"spellcheck",!1),z(s=>{var d=r.readonlyPath()||void 0,u=r.readonlyPath()?"true":void 0,h=H("h-7 w-full rounded-md border border-border px-2.5 text-xs text-foreground font-mono outline-none",r.readonlyPath()?"bg-muted/40 cursor-default":"bg-background focus-visible:ring-2 focus-visible:ring-ring");return d!==s.e&&(o.readOnly=s.e=d),u!==s.t&&p(o,"aria-readonly",s.t=u),h!==s.a&&Y(o,s.a=h),s},{e:void 0,t:void 0,a:void 0}),z(()=>o.value=r.url()),e}}),null),c(t,a(g,{get when(){return!r.showPathField()},get children(){return De()}}),null),c(t,a(g,{get when(){return r.showExpand()},get children(){return a(C,{variant:"ghost",size:"icon-sm",get"aria-label"(){return r.maximized()?"Collapse":"Expand"},get"aria-expanded"(){return r.maximized()},onClick:()=>r.onToggleMaximize(),get children(){return a(g,{get when(){return r.maximized()},get fallback(){return a(je,{size:15,"aria-hidden":"true"})},get children(){return a(Re,{size:15,"aria-hidden":"true"})}})}})}}),null),c(t,a(g,{get when(){return r.showOpenInTab()},get children(){return a(C,{variant:"ghost",size:"icon-sm","aria-label":"Open in new tab",get disabled(){return!r.canOpenInTab()},onClick:()=>r.onOpenInTab(),get children(){return a(re,{size:15,"aria-hidden":"true"})}})}}),null),c(t,a(g,{get when(){return r.showTabs()},get children(){var e=Ae();return c(e,a(te,{label:"Preview",get icon(){return a(Fe,{size:14,"aria-hidden":"true"})},get selected(){return r.tab()==="preview"},onClick:()=>r.onTab("preview")}),null),c(e,a(te,{label:"Code",get icon(){return a(Pe,{size:14,"aria-hidden":"true"})},get selected(){return r.tab()==="code"},onClick:()=>r.onTab("code")}),null),e}}),null),t})()}function te(r){return(()=>{var t=We();return t.$$click=()=>r.onClick(),c(t,()=>r.icon,null),c(t,()=>r.label,null),z(e=>{var i=r.selected,o=H("inline-flex h-6 items-center gap-1.5 rounded px-2 text-xs font-medium transition-colors outline-none","focus-visible:ring-2 focus-visible:ring-ring",r.selected?"bg-background text-foreground shadow-sm":"text-muted-foreground hover:text-foreground");return i!==e.e&&p(t,"aria-selected",e.e=i),o!==e.t&&Y(t,e.t=o),e},{e:void 0,t:void 0}),t})()}function ir(r){return(()=>{var t=Ke();t.addEventListener("load",()=>r.onLoad());var e=r.ref;return typeof e=="function"?Z(e,t):r.ref=t,z(i=>{var o=r.src()||"about:blank",s=r.sandbox,d=r.title;return o!==i.e&&p(t,"src",i.e=o),s!==i.t&&p(t,"sandbox",i.t=s),d!==i.a&&p(t,"title",i.a=d),i},{e:void 0,t:void 0,a:void 0}),t})()}function lr(r){return(()=>{var t=_e(),e=t.firstChild,i=e.nextSibling;return c(e,a(we,{get files(){return r.files},get activeFile(){return r.activeFile()},onSelect:(o,s)=>r.onSelect(o,s)})),c(i,a(g,{get when(){return r.activeFileObj()},get fallback(){return qe()},get children(){return a(g,{get when(){return r.hasSource()},get fallback(){return(()=>{var o=Ge(),s=o.firstChild,d=s.nextSibling;return d.nextSibling,c(o,()=>r.activeFileObj().type??"binary",d),o})()},get children(){return a(me,{class:"h-full rounded-none border-0",get children(){return a(pe,{get code(){return r.activeFileObj().code??""},get language(){return r.activeFileObj().language}})}})}})}})),t})()}function or(r){const t=()=>{const i=r.url.split(/[?#]/)[0];return i.slice(i.lastIndexOf("/")+1)||"document.pdf"},e=y(()=>{if(r.url){if(ee(r.url))return r.url;E("pdf fallback",r.url)}});return(()=>{var i=Qe(),o=i.firstChild;return o.nextSibling,c(i,a(Oe,{size:40,class:"text-muted-foreground","aria-hidden":"true"}),o),c(o,t),c(i,a(g,{get when(){return e()},get fallback(){return Xe()},get children(){var s=Je(),d=s.firstChild;d.firstChild;var u=d.nextSibling,h=u.firstChild;return c(d,a(re,{size:13,"aria-hidden":"true"}),null),c(u,a(Se,{size:13,"aria-hidden":"true"}),h),z(f=>{var b=e(),w=e();return b!==f.e&&p(d,"href",f.e=b),w!==f.t&&p(u,"href",f.t=w),f},{e:void 0,t:void 0}),s}}),null),i})()}function sr(r){const[t,e]=k("loading");let i,o=0,s;const d=async()=>{if(!i){e("error");return}const u=++o;e("loading");try{const h=i.clientWidth||600;await Be(r.url,i,h),u===o&&e("success")}catch{u===o&&e("error")}};return F(Q(()=>[r.url,r.reloadKey],()=>{d()})),X(()=>{if(!i||typeof ResizeObserver>"u")return;const u=new ResizeObserver(()=>{t()==="success"&&(clearTimeout(s),s=setTimeout(()=>{d()},200))});u.observe(i),be(()=>{u.disconnect(),clearTimeout(s),o++})}),(()=>{var u=Ze(),h=u.firstChild;return Z(f=>i=f,h),c(u,a(g,{get when(){return ge(()=>!0)()&&t()==="loading"},get children(){var f=Ye();return c(f,a(xe,{variant:"circular",size:"md"})),f}}),null),c(u,a(g,{get when(){return t()==="error"},get children(){return a(or,{get url(){return r.url}})}}),null),z(()=>p(h,"aria-busy",t()==="loading")),u})()}ve(["click"]);export{tr as A};