claude-artifact-framework 0.7.1 → 0.7.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +52 -8
- package/dist/index.esm.js +116 -8
- package/dist/index.esm.js.map +2 -2
- package/dist/index.global.js +34 -13
- package/dist/index.global.js.map +3 -3
- package/package.json +1 -1
- package/src/app.js +126 -7
- package/src/appState.js +1 -1
package/dist/index.global.js
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
var ArtifactKit=(()=>{var
|
|
1
|
+
var ArtifactKit=(()=>{var Y=Object.defineProperty;var Be=Object.getOwnPropertyDescriptor;var De=Object.getOwnPropertyNames;var Ve=Object.prototype.hasOwnProperty;var Ie=(e,a)=>{for(var t in a)Y(e,t,{get:a[t],enumerable:!0})},Fe=(e,a,t,r)=>{if(a&&typeof a=="object"||typeof a=="function")for(let o of De(a))!Ve.call(e,o)&&o!==t&&Y(e,o,{get:()=>a[o],enumerable:!(r=Be(a,o))||r.enumerable});return e};var He=e=>Fe(Y({},"__esModule",{value:!0}),e);var Tt={};Ie(Tt,{contrast:()=>W,createApp:()=>Me,createPersistedStore:()=>le,createSharedStore:()=>fe,createStore:()=>ie,hasReact:()=>L,palette:()=>Q,storage:()=>w,themeCss:()=>B,useReact:()=>ue});function O(){return typeof window<"u"&&typeof window.storage=="object"&&window.storage!==null}function se(e){return{async get(a,t=void 0){if(!O())return t;try{let r=await window.storage.get(a,e);if(r?.value===void 0||r?.value===null)return t;try{return JSON.parse(r.value)}catch{return r.value}}catch{return t}},async set(a,t,{raw:r=!1}={}){if(!O())throw new Error("window.storage is not available (is this a Code Artifact rather than a published Chat Artifact?)");let o=r?t:JSON.stringify(t);if(typeof o!="string")throw new Error("window.storage only accepts strings \u2014 the value must be JSON-serializable");return window.storage.set(a,o,e)},async delete(a){if(O())try{await window.storage.delete(a,e)}catch{}},async list(a){if(!O())return[];try{return(await window.storage.list(a,e))?.keys||[]}catch{return[]}}}}var w={...se(!1),shared:se(!0),available:O};function K(e){let a=e,t=new Set;function r(){return a}function o(c){a=typeof c=="function"?c(a):c,t.forEach(i=>i(a))}function s(c){return t.add(c),()=>t.delete(c)}return{get:r,set:o,subscribe:s}}function ce(e,a){let t;return(...r)=>{clearTimeout(t),t=setTimeout(()=>e(...r),a)}}function ie(e){return K(e)}function le(e,a,{debounceMs:t=300}={}){let r=K(a),o=ce(c=>w.set(e,c),t),s=w.get(e,a).then(c=>r.set(c));return r.subscribe(o),{...r,ready:s}}function fe(e,a,{pollMs:t=2e3,debounceMs:r=300}={}){let o=K(a),s=ce(u=>w.shared.set(e,u),r),c=!1;o.subscribe(u=>{c||s(u)});async function i(){let u=await w.shared.get(e,a);JSON.stringify(u)!==JSON.stringify(o.get())&&(c=!0,o.set(u),c=!1)}let f=i(),l=setInterval(i,t);return{...o,ready:f,stop:()=>clearInterval(l)}}var A=typeof globalThis<"u"?globalThis.React:void 0;function ue(e){return A=e,e}function L(){return!!A}function de(){return T()}function T(){if(!A)throw new Error(`claude-artifact-framework: React not found. Hand it over once, before createApp:
|
|
2
2
|
|
|
3
3
|
import React from "react";
|
|
4
4
|
ArtifactKit.useReact(React);
|
|
5
|
-
`);return A}var n=(...e)=>T().createElement(...e),x=(...e)=>T().useState(...e),$=(...e)=>T().useEffect(...e);var
|
|
6
|
-
:root { ${
|
|
7
|
-
@media (prefers-color-scheme: dark) { :root { ${
|
|
8
|
-
:root[data-theme="dark"] { ${
|
|
9
|
-
:root[data-theme="light"] { ${
|
|
10
|
-
`}function ke(e,a){let[t,r]=
|
|
11
|
-
`);l=p.pop();for(let
|
|
5
|
+
`);return A}var n=(...e)=>T().createElement(...e),x=(...e)=>T().useState(...e),$=(...e)=>T().useEffect(...e);var me=(...e)=>T().useRef(...e),_t=A&&A.Component||class{render(){return T()}};var J="caf:data",pe="caf:view",be={screen:null,arg:null,stack:[],step:0,selected:null,tabs:{},collapsed:{}};function _(e){return e!==null&&typeof e=="object"&&!Array.isArray(e)}function q(e,a){if(!_(e)||!_(a))return a===void 0?e:a;let t={...e};for(let r of Object.keys(a))t[r]=_(e[r])?q(e[r],a[r]):a[r];return t}function he(e,a){let t;return(...r)=>{clearTimeout(t),t=setTimeout(()=>e(...r),a)}}function ge(e,{debounceMs:a=400,shared:t=!1,pollMs:r=2500}={}){let o=t?w.shared:w,s=U(e),c={...be},i=!1,f=0,l=0,u=new Set,d=!1;function p(){d||(d=!0,Promise.resolve().then(()=>{d=!1;for(let m of u)m()}))}let b=he(()=>{let m=f;Promise.resolve(o.set(J,s)).then(()=>{l=Math.max(l,m)}).catch(()=>{})},a),g=he(()=>w.set(pe,c),a);t&&setInterval(async()=>{if(!(!i||f>l))try{let m=await o.get(J,void 0);m!==void 0&&JSON.stringify(m)!==JSON.stringify(s)&&(s=q(e,m),p())}catch{}},r);let k=(async()=>{let[m,y]=await Promise.all([o.get(J,void 0),w.get(pe,void 0)]);m!==void 0&&(s=q(e,m)),y!==void 0&&(c={...be,...y}),i=!0,p()})();function C(m){let y=m(s);y!==void 0&&(s=y),s={...s},f++,b(),p()}function v(m){c={...c,...m},g(),p()}return{ready:k,isHydrated:()=>i,getData:()=>s,getView:()=>c,update:C,setView:v,go(m,y){v({stack:[...c.stack,{screen:c.screen,arg:c.arg}],screen:m,arg:y})},back(){let m=c.stack.slice(),y=m.pop()||{screen:null,arg:null};v({stack:m,screen:y.screen,arg:y.arg})},subscribe(m){return u.add(m),()=>u.delete(m)}}}function U(e){if(Array.isArray(e))return e.map(U);if(_(e)){let a={};for(let t of Object.keys(e))a[t]=U(e[t]);return a}return e}function E(e,a,t){return Math.min(t,Math.max(a,e))}function z(e){let a=String(e).replace("#","").trim();a.length===3&&(a=a.split("").map(r=>r+r).join(""));let t=parseInt(a,16);return Number.isFinite(t)?[t>>16&255,t>>8&255,t&255]:[59,110,246]}function Pe(e){return"#"+e.map(a=>E(Math.round(a),0,255).toString(16).padStart(2,"0")).join("")}function we([e,a,t]){e/=255,a/=255,t/=255;let r=Math.max(e,a,t),o=Math.min(e,a,t),s=(r+o)/2,c=r-o,i=0,f=0;return c&&(f=s>.5?c/(2-r-o):c/(r+o),r===e?i=(a-t)/c+(a<t?6:0):r===a?i=(t-e)/c+2:i=(e-a)/c+4,i/=6),[i*360,f*100,s*100]}function Ye(e,a,t){if(e=(e%360+360)%360/360,a=E(a,0,100)/100,t=E(t,0,100)/100,!a)return[t*255,t*255,t*255];let r=t<.5?t*(1+a):t+a-t*a,o=2*t-r,s=c=>(c<0&&(c+=1),c>1&&(c-=1),c<1/6?o+(r-o)*6*c:c<1/2?r:c<2/3?o+(r-o)*(2/3-c)*6:o);return[s(e+1/3)*255,s(e)*255,s(e-1/3)*255]}function h(e,a,t){return Pe(Ye(e,a,t))}function ye(e){let a=e.map(t=>(t/=255,t<=.03928?t/12.92:Math.pow((t+.055)/1.055,2.4)));return .2126*a[0]+.7152*a[1]+.0722*a[2]}function W(e,a){let t=ye(z(e)),r=ye(z(a));return(Math.max(t,r)+.05)/(Math.min(t,r)+.05)}function S(e,a,t,r,o,s){for(let c=o;c>=4&&c<=96;c+=s){let i=h(e,a,c);if(W(i,t)>=r)return i}return h(e,a,s<0?24:82)}function Q(e="#3b6ef6"){let[a,t]=we(z(e)),r=E(t,30,88),o=E(r*.1,3,9),s=h(a,o*.4,100),c=h(a,o*1.4,13);return{light:{bg:h(a,o,96.5),surface:s,sunken:h(a,o,93),border:h(a,o,86),text:h(a,o*1.6,11),muted:h(a,o*1.2,41),accent:S(a,r,"#ffffff",4.5,54,-2),accentText:"#ffffff",danger:S(2,68,"#ffffff",4.5,54,-2),ok:S(148,62,"#ffffff",4.5,44,-2),warn:S(38,88,"#ffffff",4.5,44,-2)},dark:{bg:h(a,o*1.5,9),surface:c,sunken:h(a,o*1.5,7),border:h(a,o*1.3,24),text:h(a,o*.6,95),muted:h(a,o*.8,66),accent:S(a,E(r,40,80),c,4.5,62,2),accentText:h(a,o*2,8),danger:S(2,70,c,4.5,62,2),ok:S(148,55,c,4.5,62,2),warn:S(38,80,c,4.5,62,2)}}}function M(e){return Object.entries(e).map(([a,t])=>`--caf-${a}: ${t};`).join("")}function B(e){let a=Q(e);return`
|
|
6
|
+
:root { ${M(a.light)} }
|
|
7
|
+
@media (prefers-color-scheme: dark) { :root { ${M(a.dark)} } }
|
|
8
|
+
:root[data-theme="dark"] { ${M(a.dark)} }
|
|
9
|
+
:root[data-theme="light"] { ${M(a.light)} }
|
|
10
|
+
`}function ke(e,a){let[t,r]=we(z(e||"#3b6ef6")),o=E(r,45,70);return Array.from({length:a},(s,c)=>h((t+c*137.5)%360,o,52))}var G=["system","greeting","placeholder","tools","model","maxTokens"],Ke="claude-sonnet-4-6",Je=8;async function qe({model:e,maxTokens:a,system:t,messages:r,onText:o}){let s=await fetch("https://api.anthropic.com/v1/messages",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({model:e,max_tokens:a,system:t,messages:r,stream:!0})});if(!s.ok||!s.body){let u="";try{let d=await s.json();u=d&&d.error&&d.error.message||JSON.stringify(d)}catch{u=await s.text().catch(()=>"")}throw new Error(`HTTP ${s.status}${u?": "+u:""}`)}let c=s.body.getReader(),i=new TextDecoder,f="",l="";for(;;){let{done:u,value:d}=await c.read();if(u)break;l+=i.decode(d,{stream:!0});let p=l.split(`
|
|
11
|
+
`);l=p.pop();for(let b of p)if(b.startsWith("data: "))try{let g=JSON.parse(b.slice(6));g.type==="content_block_delta"&&g.delta&&g.delta.text&&(f+=g.delta.text,o&&o(f))}catch{}}return f}function Ue(e){let a=e.match(/```tool_call\s*\n?([\s\S]*?)```/);if(!a)return null;try{let t=JSON.parse(a[1]);return Array.isArray(t)&&t.length?t:null}catch{return null}}function ve(e){return e.replace(/```tool_call\s*\n?[\s\S]*?```/,"").trim()}function We(e){return`
|
|
12
12
|
|
|
13
13
|
You have tools available:
|
|
14
14
|
${Object.entries(e).map(([t,r])=>`- ${t}: ${r.description}
|
|
@@ -21,15 +21,15 @@ This environment does not support native function calling. To use a tool, reply
|
|
|
21
21
|
[{ "name": "tool_name", "input": { "param": "value" } }]
|
|
22
22
|
\`\`\`
|
|
23
23
|
|
|
24
|
-
You may include several calls in one array. NEVER invent a tool's result \u2014 emit the pure tool_call block and wait for the real result, which arrives in the next message tagged [TOOL_RESULT]. When you have everything you need, answer in natural language with no tool_call block.`}function
|
|
25
|
-
${JSON.stringify(
|
|
24
|
+
You may include several calls in one array. NEVER invent a tool's result \u2014 emit the pure tool_call block and wait for the real result, which arrives in the next message tagged [TOOL_RESULT]. When you have everything you need, answer in natural language with no tool_call block.`}function Qe(e,a,t){return e.map(r=>{let o=a[r.name];if(!o)return{name:r.name,error:`unknown tool "${r.name}". Valid tools: ${Object.keys(a).join(", ")}`};try{let s=o.run(r.input||{},t);return{name:r.name,result:s===void 0?{ok:!0}:s}}catch(s){return{name:r.name,error:String(s&&s.message||s)}}})}var xe=e=>String(e).replace(/[&<>"]/g,a=>({"&":"&","<":"<",">":">",'"':"""})[a]);function X(e){let a=[],t=String(e).replace(/```[a-z]*\n?([\s\S]*?)```/g,(r,o)=>(a.push(o.replace(/\n$/,"")),"\0"+(a.length-1)+"\0"));return t=xe(t),t=t.replace(/`([^`]+)`/g,"<code>$1</code>"),t=t.replace(/\*\*([^*]+)\*\*/g,"<strong>$1</strong>"),t=t.replace(/(^|[^*])\*([^*\n]+)\*/g,"$1<em>$2</em>"),t=t.replace(/^#{1,3} (.+)$/gm,'<strong class="caf-md-h">$1</strong>'),t=t.replace(/^[-•*] (.+)$/gm,'<span class="caf-md-li">$1</span>'),t=t.replace(/^\d+\. (.+)$/gm,'<span class="caf-md-li caf-md-num">$1</span>'),t=t.replace(/\n/g,"<br>"),t=t.replace(/\u0000(\d+)\u0000/g,(r,o)=>'<pre class="caf-code">'+xe(a[Number(o)])+"</pre>"),t}function Xe({m:e}){return e.role==="tools"?n("div",{className:"caf-msg-tools"},`used: ${e.tools.join(", ")}`):e.role==="error"?n("div",{className:"caf-msg caf-msg-error"},n("strong",null,"The call failed"),n("span",null,e.content),n("span",{className:"caf-hint"},"Your message is kept \u2014 send again to retry.")):e.role==="user"?n("div",{className:"caf-msg caf-msg-user"},e.content):n("div",{className:"caf-msg caf-msg-assistant",dangerouslySetInnerHTML:{__html:X(e.content)}})}function Z({cfg:e,ctx:a}){let t=e,[r,o]=x(""),[s,c]=x(!1),[i,f]=x(null),l=me(null),u=a.data.chat||{api:[],log:[]},d=u.log||[];$(()=>{l.current&&l.current.scrollIntoView({block:"end"})},[d.length,i]);async function p(){let b=r.trim();if(!b||s)return;o(""),c(!0);let g=[...u.api||[],{role:"user",content:b}],k=[...d,{role:"user",content:b}],C=()=>a.update(v=>{v.chat={api:g,log:k}});C();try{let v=(typeof t.system=="function"?t.system(a.data):t.system||"")+(t.tools?We(t.tools):"");for(let m=0;m<Je;m++){let y=await qe({model:t.model||Ke,maxTokens:t.maxTokens||2e3,system:v,messages:g,onText:P=>f(ve(P))});g=[...g,{role:"assistant",content:y}];let F=ve(y),H=t.tools?Ue(y):null;if(!H){k=[...k,{role:"assistant",content:F||y}],C();break}let ze=Qe(H,t.tools,a);F&&(k=[...k,{role:"assistant",content:F}]),k=[...k,{role:"tools",tools:H.map(P=>P.name)}],g=[...g,{role:"user",content:`[TOOL_RESULT]
|
|
25
|
+
${JSON.stringify(ze)}
|
|
26
26
|
[/TOOL_RESULT]
|
|
27
27
|
|
|
28
|
-
Continue with this information. If you have everything you need, answer in natural language without further tool_call.`}],C(),f(null)}}catch(v){w=[...w,{role:"error",content:String(v&&v.message||v)}],C()}finally{f(null),c(!1)}}return n("div",{className:"caf-chat-panel"},n("div",{className:"caf-block caf-chat-log"},t.greeting?n("div",{className:"caf-msg caf-msg-assistant",dangerouslySetInnerHTML:{__html:Q(t.greeting)}}):null,d.map((h,b)=>n(Qe,{key:b,m:h})),i!==null?n("div",{className:"caf-msg caf-msg-assistant caf-msg-live",dangerouslySetInnerHTML:{__html:Q(i||"\u2026")}}):null,s&&i===null?n("div",{className:"caf-msg-tools"},"thinking\u2026"):null,n("div",{ref:l})),n("div",{className:"caf-chat-input"},n("input",{value:r,placeholder:t.placeholder||"Message\u2026",disabled:s,enterKeyHint:"send",onChange:h=>o(h.target.value),onKeyDown:h=>{h.key==="Enter"&&(h.preventDefault(),p())},"aria-label":"Message"}),n("button",{type:"button",className:"caf-btn caf-btn-primary",disabled:s||!r.trim(),onClick:p},"Send")))}function xe({spec:e,ctx:a}){return n("div",{className:"caf-panel caf-panel-single"},n(G,{cfg:e.chat,ctx:a}))}var Z=["text","textarea","number","money","percent","check","date","select"];function N(e,a){if(e==null||e==="")return"\u2014";let t=Number(e);switch(a){case"money":return Number.isFinite(t)?t.toLocaleString(void 0,{style:"currency",currency:"USD",maximumFractionDigits:2}):String(e);case"percent":return Number.isFinite(t)?`${t.toLocaleString(void 0,{maximumFractionDigits:2})}%`:String(e);case"number":return Number.isFinite(t)?t.toLocaleString(void 0,{maximumFractionDigits:2}):String(e);case"date":return e instanceof Date?e.toLocaleDateString():String(e);default:return String(e)}}function ee(e,a){if(e.required&&(a===""||a===null||a===void 0))return"Required";if(a===""||a===null||a===void 0)return null;if(e.type==="number"||e.type==="money"||e.type==="percent"){let t=Number(a);if(!Number.isFinite(t))return"Must be a number";if(e.min!==void 0&&t<e.min)return`Must be at least ${e.min}`;if(e.max!==void 0&&t>e.max)return`Must be at most ${e.max}`}return null}function j({field:e,value:a,onChange:t,data:r}){let o=ee(e,a),s=`caf-f-${e.key}`,c=e.type==="number"||e.type==="money"||e.type==="percent";if(e.type==="check")return n("label",{className:"caf-check"},n("input",{id:s,type:"checkbox",checked:!!a,onChange:l=>t(l.target.checked)}),n("span",null,e.label||e.key));let i={id:s,value:a??"","aria-invalid":o?"true":void 0,onChange:l=>t(c?Xe(l.target.value):l.target.value)},f;if(e.type==="textarea")f=n("textarea",{...i,rows:e.rows||3});else if(e.type==="select"){let l=typeof e.options=="function"?e.options(r)||[]:e.options||[];f=n("select",i,n("option",{value:""},e.placeholder||"Select\u2026"),l.map(u=>{let d=typeof u=="string"?u:u.value,p=typeof u=="string"?u:u.label;return n("option",{key:d,value:d},p)}))}else f=n("input",{...i,type:e.type==="date"?"date":c?"number":"text",min:e.min,max:e.max,step:e.step||(e.type==="money"||e.type==="percent"?"any":void 0),placeholder:e.placeholder});return n("div",{className:"caf-field"},n("label",{htmlFor:s},e.label||e.key),f,e.hint&&!o?n("small",{className:"caf-hint"},e.hint):null,o?n("small",{className:"caf-error"},o):null)}function Xe(e){if(e==="")return"";let a=Number(e);return Number.isFinite(a)?a:e}function Ge({spec:e,ctx:a}){let t=e.fields||[];return n("div",{className:"caf-block caf-fields"},e.title?n("h2",{className:"caf-block-title"},e.title):null,t.map(r=>n(j,{key:r.key,field:r,data:a.data,value:a.data[r.key],onChange:o=>a.update(s=>{s[r.key]=o})})))}function Ze({spec:e,ctx:a}){let t=typeof e.output=="function"?e.output(a.data):e.output||[];return t.length?n("div",{className:"caf-block caf-output"},e.title?n("h2",{className:"caf-block-title"},e.title):null,n("div",{className:"caf-output-grid"},t.map((r,o)=>n("div",{key:r.label||o,className:r.big?"caf-stat caf-stat-big":"caf-stat"},n("span",{className:"caf-stat-label"},r.label),n("span",{className:"caf-stat-value"},N(r.value,r.format)),r.hint?n("small",{className:"caf-hint"},r.hint):null)))):n("div",{className:"caf-block caf-empty"},e.empty||"Nothing to show yet.")}function et({spec:e,ctx:a}){let t=typeof e.text=="function"?e.text(a.data):e.text;return n("div",{className:"caf-block caf-text"},e.title?n("h2",{className:"caf-block-title"},e.title):null,n("p",null,t))}function tt({spec:e,ctx:a}){let t=(typeof e.list=="function"?e.list(a.data):e.list)||[],r=typeof e.title=="string"?e.title:null,o=typeof e.title=="function"?e.title:s=>s.title??s.name??s.label??s.text??String(s);return t.length?n("div",{className:"caf-block caf-list"},r?n("h2",{className:"caf-block-title"},r):null,t.map((s,c)=>n("button",{key:s.id??c,className:"caf-row",type:"button",onClick:e.onSelect?()=>e.onSelect(s,a):void 0},n("span",{className:"caf-row-title"},o(s)),e.subtitle?n("span",{className:"caf-row-sub"},e.subtitle(s)):null))):n("div",{className:"caf-block caf-empty"},e.empty||"Nothing here yet.")}var Ne=["bar","line","donut"];function at({spec:e,ctx:a}){let t=typeof e.chart=="function"?e.chart(a.data):e.chart,r=t&&t.items||[];if(!r.length)return n("div",{className:"caf-block caf-empty"},e.empty||"No data to chart yet.");let o=t.type||"bar";if(!Ne.includes(o))throw new Error(`unknown chart type "${o}". Valid types: ${Ne.join(", ")}.`);let s=a.colors(r.length),c=o==="bar"?rt(r,t,s):o==="line"?nt(r,t):ot(r,t,s);return n("div",{className:"caf-block caf-chart"},e.title?n("h2",{className:"caf-block-title"},e.title):null,c)}function rt(e,a,t){let r=Math.max(...e.map(o=>Number(o.value)||0),0)||1;return n("div",{className:"caf-bars"},e.map((o,s)=>n("div",{key:o.label??s,className:"caf-bar-row"},n("span",{className:"caf-bar-label"},o.label),n("div",{className:"caf-bar-track"},n("div",{className:"caf-bar-fill",style:{width:`${Math.max(2,(Number(o.value)||0)/r*100)}%`,background:t[s]}})),n("span",{className:"caf-bar-value"},N(o.value,a.format)))))}function nt(e,a){let t=e.map(u=>Number(u.value)||0),r=Math.min(...t),s=Math.max(...t)-r||1,c=100,i=36,f=t.map((u,d)=>[t.length===1?c/2:d/(t.length-1)*c,i-3-(u-r)/s*(i-6)]),l=f[f.length-1];return n("div",{className:"caf-line"},n("svg",{viewBox:`0 0 ${c} ${i}`,className:"caf-line-svg",preserveAspectRatio:"none","aria-hidden":"true"},[.25,.5,.75].map(u=>n("line",{key:u,x1:0,x2:c,y1:i*u,y2:i*u,className:"caf-line-grid"})),n("polyline",{points:f.map(u=>u.join(",")).join(" "),className:"caf-line-path"}),n("circle",{cx:l[0],cy:l[1],r:1.6,className:"caf-line-dot"})),n("div",{className:"caf-line-meta"},n("span",{className:"caf-hint"},String(e[0].label??"")),n("span",{className:"caf-line-last"},N(t[t.length-1],a.format)),n("span",{className:"caf-hint"},String(e[e.length-1].label??""))))}function ot(e,a,t){let r=e.reduce((i,f)=>i+(Number(f.value)||0),0)||1,o=15.9155,s=25,c=e.map((i,f)=>{let l=(Number(i.value)||0)/r*100,u=n("circle",{key:i.label??f,cx:21,cy:21,r:o,className:"caf-donut-seg",stroke:t[f],strokeDasharray:`${l} ${100-l}`,strokeDashoffset:s});return s-=l,u});return n("div",{className:"caf-donut"},n("svg",{viewBox:"0 0 42 42",className:"caf-donut-svg","aria-hidden":"true"},c),n("div",{className:"caf-donut-legend"},e.map((i,f)=>n("div",{key:i.label??f,className:"caf-legend-row"},n("span",{className:"caf-legend-swatch",style:{background:t[f]}}),n("span",{className:"caf-legend-label"},i.label),n("span",{className:"caf-legend-value"},N(i.value,a.format))))))}function st({spec:e,ctx:a}){let t=e.timer||{},r=Math.max(1,Math.round((t.minutes||0)*60+(t.seconds||0))||300),[o,s]=x(r),[c,i]=x(!1);$(()=>{if(!c)return;let d=setInterval(()=>s(p=>Math.max(0,p-1)),1e3);return()=>clearInterval(d)},[c]),$(()=>{o===0&&c&&(i(!1),typeof t.onDone=="function"&&a.update(d=>t.onDone(d)))},[o,c]);let f=String(Math.floor(o/60)).padStart(2,"0"),l=String(o%60).padStart(2,"0"),u=o===0;return n("div",{className:"caf-block caf-timer"},e.title?n("h2",{className:"caf-block-title"},e.title):null,t.label?n("span",{className:"caf-hint"},t.label):null,n("div",{className:u?"caf-timer-time caf-timer-done":"caf-timer-time"},u?t.doneText||"Done!":`${f}:${l}`),n("div",{className:"caf-bar-track"},n("div",{className:"caf-bar-fill caf-timer-fill",style:{width:`${o/r*100}%`}})),n("div",{className:"caf-timer-controls"},n("button",{type:"button",className:"caf-btn caf-btn-primary",disabled:u,onClick:()=>i(d=>!d)},c?"Pause":"Start"),n("button",{type:"button",className:"caf-btn",onClick:()=>{i(!1),s(r)}},"Reset")))}function ct({spec:e,ctx:a}){let r=(e.actions||[]).filter(o=>!o.when||o.when(a.data));return n("div",{className:"caf-block caf-actions"},e.title?n("h2",{className:"caf-block-title"},e.title):null,n("div",{className:"caf-actions-row"},r.map(o=>n("button",{key:o.label,type:"button",className:o.kind==="danger"?"caf-btn caf-btn-danger":o.kind==="primary"?"caf-btn caf-btn-primary":"caf-btn",onClick:()=>a.update(s=>o.run(s))},o.label))))}function it({spec:e,ctx:a}){let t=e.custom(a);return typeof t=="string"?n("div",{className:"caf-block",dangerouslySetInnerHTML:{__html:t}}):n("div",{className:"caf-block"},t)}var te={fields:Ge,output:Ze,text:et,list:tt,chart:at,timer:st,actions:ct,chat:({spec:e,ctx:a})=>n(G,{cfg:e.chat,ctx:a}),custom:it},D=Object.keys(te);function Se(e){return Object.entries(e.compute||{}).map(([a,t])=>[a,typeof t=="function"?{value:t}:t])}function ae(e,a){if(!e.compute)return a;let t={...a};for(let[r,o]of Se(e))try{t[r]=o.value(a)}catch{t[r]=void 0}return t}function $e(e){let a={};for(let t of e)a[t.key]=t.value!==void 0?t.value:t.type==="check"?!1:"";return a}function Ee(){return"r"+Date.now().toString(36)+Math.random().toString(36).slice(2,8)}function lt(e,a){if(e.title)return e.title(a);let t=e.fields.find(o=>!o.type||o.type==="text"||o.type==="textarea"||o.type==="select"),r=t&&a[t.key];return r===""||r===void 0||r===null?"(untitled)":String(r)}function ft({spec:e,records:a}){if(!e.summary)return null;let t=e.summary(a)||[];return t.length?n("div",{className:"caf-block caf-output"},n("div",{className:"caf-output-grid"},t.map((r,o)=>n("div",{key:r.label||o,className:r.big?"caf-stat caf-stat-big":"caf-stat"},n("span",{className:"caf-stat-label"},r.label),n("span",{className:"caf-stat-value"},N(r.value,r.format)))))):null}function ut({spec:e,ctx:a}){let t=e.label||"item",[r,o]=x(""),s=a.data.records.map(l=>ae(e,l));e.sort&&(s=s.slice().sort(e.sort));let c=s.length,i=r.trim().toLowerCase();e.search&&i&&(s=s.filter(l=>e.fields.some(u=>String(l[u.key]??"").toLowerCase().includes(i))));function f(){let l={id:Ee(),...$e(e.fields)};e.items&&(l.items=[]),a.update(u=>{u.records=[...u.records,l]}),a.go("record",l.id)}return n("div",{className:"caf-block caf-list"},n("div",{className:"caf-toolbar"},n("span",{className:"caf-count"},e.search&&i?`${s.length} of ${c}`:`${c} ${t}${c===1?"":"s"}`),n("button",{type:"button",className:"caf-btn caf-btn-primary",onClick:f},`Add ${t}`)),e.search?n("input",{className:"caf-search",value:r,placeholder:`Search ${t}s\u2026`,"aria-label":"Search",onChange:l=>o(l.target.value)}):null,e.search&&i&&s.length===0&&c>0?n("div",{className:"caf-empty"},`Nothing matches "${r}".`):null,s.length===0?n("div",{className:"caf-empty"},e.empty||`No ${t}s yet. Add the first one.`):s.map(l=>n("div",{key:l.id,className:"caf-row-wrap"},n("button",{type:"button",className:"caf-row",onClick:()=>a.go("record",l.id)},n("span",{className:"caf-row-title"},lt(e,l)),e.subtitle?n("span",{className:"caf-row-sub"},e.subtitle(l)):null),e.actions?n("div",{className:"caf-row-actions"},e.actions.filter(u=>!u.when||u.when(l)).map(u=>n("button",{key:u.label,type:"button",className:u.kind==="danger"?"caf-btn caf-btn-danger caf-btn-sm":"caf-btn caf-btn-sm",onClick:()=>a.update(d=>{let p=d.records.find(h=>h.id===l.id);p&&u.run(p,d)})},u.label))):null)))}function dt({spec:e,ctx:a,record:t}){let r=e.label||"item";function o(){a.update(s=>{s.records=s.records.filter(c=>c.id!==t.id)}),a.back()}return n("div",{className:"caf-block caf-fields"},n("div",{className:"caf-toolbar"},n("button",{type:"button",className:"caf-btn",onClick:a.back},"\u2039 Back"),n("button",{type:"button",className:"caf-btn caf-btn-danger",onClick:o},`Delete ${r}`)),e.fields.map(s=>n(j,{key:s.key,field:s,data:a.data,value:t[s.key],onChange:c=>a.update(i=>{let f=i.records.find(l=>l.id===t.id);f&&(f[s.key]=c)})})),e.items?n(mt,{spec:e,ctx:a,record:t}):null,e.compute?n("div",{className:"caf-output-grid caf-computed"},Se(e).map(([s,c])=>{let i=ae(e,t);return n("div",{key:s,className:"caf-stat"},n("span",{className:"caf-stat-label"},c.label||s),n("span",{className:"caf-stat-value"},N(i[s],c.format)))})):null)}function mt({spec:e,ctx:a,record:t}){let r=e.items,o=r.label||"item";function s(i){a.update(f=>{let l=f.records.find(u=>u.id===t.id);l&&(Array.isArray(l.items)||(l.items=[]),i(l))})}let c=Array.isArray(t.items)?t.items:[];return n("div",{className:"caf-items"},n("div",{className:"caf-toolbar"},n("span",{className:"caf-count"},`${c.length} ${o}${c.length===1?"":"s"}`),n("button",{type:"button",className:"caf-btn caf-btn-sm",onClick:()=>s(i=>i.items.push({id:Ee(),...$e(r.fields)}))},`Add ${o}`)),c.length===0?n("div",{className:"caf-empty caf-empty-sm"},r.empty||`No ${o}s yet.`):c.map(i=>n("div",{key:i.id,className:"caf-item-row"},r.fields.map(f=>n(j,{key:f.key,field:f,data:a.data,value:i[f.key],onChange:l=>s(u=>{let d=u.items.find(p=>p.id===i.id);d&&(d[f.key]=l)})})),n("button",{type:"button",className:"caf-btn caf-btn-danger caf-btn-sm caf-item-remove","aria-label":`Remove ${o}`,onClick:()=>s(f=>{f.items=f.items.filter(l=>l.id!==i.id)})},"\u2715"))))}function Ce({spec:e,ctx:a}){let t=e.records;if(a.view.screen==="record"){let r=a.data.records.find(o=>o.id===a.view.arg);if(r)return n("div",{className:"caf-panel caf-panel-single"},n(dt,{spec:t,ctx:a,record:r}))}return n("div",{className:"caf-panel caf-panel-single"},n(ft,{spec:t,records:a.data.records.map(r=>ae(t,r))}),n(ut,{spec:t,ctx:a}))}function pt(e,a){return(e.fields||[]).some(t=>ee(t,a[t.key])!==null)}function ht({step:e,ctx:a}){let t=e.result(a.data)||[];return n("div",{className:"caf-block caf-output"},e.title?n("h2",{className:"caf-block-title"},e.title):null,n("div",{className:"caf-output-grid"},t.map((r,o)=>n("div",{key:r.label??o,className:r.big?"caf-stat caf-stat-big":"caf-stat"},n("span",{className:"caf-stat-label"},r.label),n("span",{className:"caf-stat-value"},N(r.value,r.format)),r.hint?n("small",{className:"caf-hint"},r.hint):null))),n("div",{className:"caf-step-nav"},n("button",{type:"button",className:"caf-btn",onClick:()=>a.setStep(0)},"Start over")))}function Ae({spec:e,ctx:a}){let t=e.steps,r=Math.min(Math.max(a.view.step||0,0),t.length-1),o=t[r],s=typeof o.result=="function",c=r===t.length-1;return n("div",{className:"caf-panel caf-panel-single"},n("div",{className:"caf-steps-progress"},n("span",{className:"caf-hint"},s?"Result":`Step ${r+1} of ${t.length}`),n("div",{className:"caf-bar-track"},n("div",{className:"caf-bar-fill caf-steps-fill",style:{width:`${(r+1)/t.length*100}%`}}))),s?n(ht,{step:o,ctx:a}):n("div",{className:"caf-block caf-fields"},o.title?n("h2",{className:"caf-block-title"},o.title):null,o.text?n("p",{className:"caf-step-text"},typeof o.text=="function"?o.text(a.data):o.text):null,(o.fields||[]).map(i=>n(j,{key:i.key,field:i,data:a.data,value:a.data[i.key],onChange:f=>a.update(l=>{l[i.key]=f})})),n("div",{className:"caf-step-nav"},r>0?n("button",{type:"button",className:"caf-btn",onClick:()=>a.setStep(r-1)},"\u2039 Back"):n("span"),c?null:n("button",{type:"button",className:"caf-btn caf-btn-primary",disabled:pt(o,a.data),onClick:()=>a.setStep(r+1)},"Next \u203A"))))}var Te=["panel","records","steps","chat","workspace"],gt=["title","empty","wide","onSelect","subtitle"],je=["title","subtitle","theme","layout","blocks","records","steps","chat","data","shared","main","sidebar"];function V(e,a){for(let t of e||[]){if(!t||!t.key)throw new Error(`claude-artifact-framework: every field in ${a} needs a \`key\`.`);if(t.type!==void 0&&!Z.includes(t.type))throw new Error(`claude-artifact-framework: field "${t.key}" in ${a} has unknown type "${t.type}". Valid types: ${Z.join(", ")}.`);if(t.type==="select"&&t.options!==void 0&&!Array.isArray(t.options)&&typeof t.options!="function")throw new Error(`claude-artifact-framework: field "${t.key}" in ${a}: \`options\` must be an array or a function of data returning one.`)}}function Re(e,a){if(!e||typeof e.system!="string"&&typeof e.system!="function")throw new Error(`claude-artifact-framework: ${a} needs \`{ system: "..." }\` (a string or a function of data).`);let t=Object.keys(e).filter(r=>!X.includes(r));if(t.length)throw new Error(`claude-artifact-framework: ${a} has unknown keys (${t.join(", ")}). Valid keys: ${X.join(", ")}.`);for(let[r,o]of Object.entries(e.tools||{}))if(!o||typeof o.description!="string"||typeof o.run!="function")throw new Error(`claude-artifact-framework: chat tool "${r}" needs a \`description\` string and a \`run(input, ctx)\` function.`)}var Oe=["label","run","when","kind"];function _e(e,a){if(!Array.isArray(e))throw new Error(`claude-artifact-framework: ${a} must be an array of { label, run }.`);e.forEach((t,r)=>{if(!t||typeof t.label!="string"||typeof t.run!="function")throw new Error(`claude-artifact-framework: ${a}[${r}] needs a \`label\` string and a \`run\` function.`);let o=Object.keys(t).filter(s=>!Oe.includes(s));if(o.length)throw new Error(`claude-artifact-framework: ${a}[${r}] has unknown keys (${o.join(", ")}). Valid keys: ${Oe.join(", ")}.`)})}function B(e){if(!Array.isArray(e))throw new Error("claude-artifact-framework: `blocks` must be an array.");e.forEach((a,t)=>{if(!a||typeof a!="object")throw new Error(`claude-artifact-framework: blocks[${t}] must be an object like { fields: [...] }.`);let r=Object.keys(a).filter(s=>!gt.includes(s)),o=r.filter(s=>D.includes(s));if(o.length===0)throw new Error(`claude-artifact-framework: blocks[${t}] has no recognised block type (found: ${r.join(", ")||"nothing"}). Valid block types: ${D.join(", ")}.`);if(o.length>1)throw new Error(`claude-artifact-framework: blocks[${t}] declares more than one block type (${o.join(", ")}). Split them into separate entries of \`blocks\`.`);V(a.fields,`blocks[${t}]`),o[0]==="actions"&&_e(a.actions,`blocks[${t}].actions`),o[0]==="chat"&&Re(a.chat,`blocks[${t}].chat`)})}function bt(e){let a=Object.keys(e).filter(r=>!je.includes(r));if(a.length)throw new Error(`claude-artifact-framework: unknown top-level keys (${a.join(", ")}). Valid keys: ${je.join(", ")}.`);let t=e.layout||"panel";if(!Te.includes(t))throw new Error(`claude-artifact-framework: unknown layout "${t}". Valid layouts: ${Te.join(", ")}.`);if(t==="steps"){let r=e.steps;if(!Array.isArray(r)||r.length===0)throw new Error('claude-artifact-framework: layout "steps" needs `steps: [...]` with at least one step.');let o=["title","text","fields","result"],s=new Set;return r.forEach((c,i)=>{if(!c||typeof c!="object")throw new Error(`claude-artifact-framework: steps[${i}] must be an object.`);let f=Object.keys(c).filter(l=>!o.includes(l));if(f.length)throw new Error(`claude-artifact-framework: steps[${i}] has unknown keys (${f.join(", ")}). Valid keys: ${o.join(", ")}.`);if(!c.fields&&!c.text&&!c.result)throw new Error(`claude-artifact-framework: steps[${i}] needs \`fields\`, \`text\`, or \`result\`.`);V(c.fields,`steps[${i}]`);for(let l of c.fields||[]){if(s.has(l.key))throw new Error(`claude-artifact-framework: field key "${l.key}" appears in more than one step \u2014 keys share one data pool and must be unique.`);s.add(l.key)}}),t}if(t==="chat")return Re(e.chat,"chat"),t;if(t==="workspace"){if(!Array.isArray(e.main)||e.main.length===0)throw new Error('claude-artifact-framework: layout "workspace" needs `main: [...]` (an array of blocks). `sidebar: [...]` is optional.');if(B(e.main),e.sidebar!==void 0){if(!Array.isArray(e.sidebar))throw new Error("claude-artifact-framework: workspace `sidebar` must be an array of blocks.");B(e.sidebar)}if([...e.main,...e.sidebar||[]].filter(o=>o&&o.chat).length>1)throw new Error("claude-artifact-framework: only one chat block per app \u2014 the conversation persists under data.chat and there is exactly one.");return t}if(t==="records"){let r=e.records;if(!r||!Array.isArray(r.fields)||r.fields.length===0)throw new Error('claude-artifact-framework: layout "records" needs `records: { fields: [...] }` \u2014 the same field declarations the fields block uses.');let o=["label","fields","title","subtitle","sort","summary","empty","search","compute","items","actions"],s=Object.keys(r).filter(i=>!o.includes(i));if(s.length)throw new Error(`claude-artifact-framework: records has unknown keys (${s.join(", ")}). Valid keys: ${o.join(", ")}.`);V(r.fields,"records");let c=new Set;for(let i of r.fields){if(i.key==="id")throw new Error('claude-artifact-framework: "id" is reserved on records \u2014 the framework assigns it.');if(c.has(i.key))throw new Error(`claude-artifact-framework: duplicate records field key "${i.key}".`);c.add(i.key)}if(e.blocks&&B(e.blocks),r.actions&&_e(r.actions,"records.actions"),r.items){let i=["label","fields","empty"],f=Object.keys(r.items).filter(l=>!i.includes(l));if(f.length)throw new Error(`claude-artifact-framework: records.items has unknown keys (${f.join(", ")}). Valid keys: ${i.join(", ")}.`);if(!Array.isArray(r.items.fields)||r.items.fields.length===0)throw new Error("claude-artifact-framework: records.items needs `fields: [...]` \u2014 the same field declarations as everywhere else.");V(r.items.fields,"records.items");for(let l of r.items.fields)if(l.key==="id")throw new Error('claude-artifact-framework: "id" is reserved on items \u2014 the framework assigns it.');if(c.has("items")||r.fields.some(l=>l.key==="items"))throw new Error('claude-artifact-framework: a records field cannot be named "items" when `items` is declared \u2014 that key holds the child collection.')}for(let[i,f]of Object.entries(r.compute||{})){if(c.has(i)||i==="id"||r.items&&i==="items")throw new Error(`claude-artifact-framework: compute key "${i}" collides with a field key \u2014 computed values are derived, never stored.`);if(typeof f!="function"&&typeof(f&&f.value)!="function")throw new Error(`claude-artifact-framework: compute "${i}" must be a function of the record, or { label, format, value: (r) => ... }.`)}return t}return B(e.blocks||[]),t}function yt(e){let a={...e.data||{}};(e.layout||"panel")==="records"&&!Array.isArray(a.records)&&(a.records=[]);let t=[...e.blocks||[],...e.main||[],...e.sidebar||[]];((e.layout||"panel")==="chat"||t.some(o=>o&&o.chat))&&!a.chat&&(a.chat={api:[],log:[]});for(let o of[...t,...e.steps||[]])for(let s of o.fields||[])s&&s.key!==void 0&&!(s.key in a)&&(a[s.key]=s.value!==void 0?s.value:s.type==="check"?!1:"");return a}var re=null;function kt(e){return re||(re=class extends e.Component{constructor(a){super(a),this.state={error:null}}static getDerivedStateFromError(a){return{error:a}}render(){return this.state.error?n("div",{className:"caf-block caf-block-error"},n("strong",null,"This section failed to render"),n("code",null,String(this.state.error.message||this.state.error))):this.props.children}}),re}function ne({block:e,ctx:a}){let t=Object.keys(e).find(o=>D.includes(o)),r=te[t];return n(kt(a.React),null,n(r,{spec:e,ctx:a}))}function wt({spec:e,ctx:a}){return n("div",{className:"caf-panel"},(e.blocks||[]).map((t,r)=>n("section",{key:r,className:t.wide?"caf-slot caf-slot-wide":"caf-slot"},n(ne,{block:t,ctx:a}))))}function vt({spec:e,ctx:a}){let t=a.view.screen==="record"&&(a.data.records||[]).some(r=>r.id===a.view.arg);return n("div",null,n(Ce,{spec:e,ctx:a}),!t&&Array.isArray(e.blocks)&&e.blocks.length?n("div",{className:"caf-panel caf-records-blocks"},e.blocks.map((r,o)=>n("section",{key:o,className:r.wide?"caf-slot caf-slot-wide":"caf-slot"},n(ne,{block:r,ctx:a})))):null)}function xt({spec:e,ctx:a}){let t=r=>(r||[]).map((o,s)=>n("section",{key:s,className:"caf-ws-slot"},n(ne,{block:o,ctx:a})));return n("div",{className:"caf-workspace"},n("div",{className:"caf-ws-main"},t(e.main)),e.sidebar&&e.sidebar.length?n("div",{className:"caf-ws-side"},t(e.sidebar)):null)}var Nt={panel:wt,records:vt,steps:Ae,chat:xe,workspace:xt};function Le(e={}){let a=bt(e),t=ge(yt(e),{shared:!!e.shared}),r=z(e.theme&&e.theme.seed)+St;return function(){if(!R())throw new Error(`claude-artifact-framework: React not found. Hand it over once, before rendering:
|
|
28
|
+
Continue with this information. If you have everything you need, answer in natural language without further tool_call.`}],C(),f(null)}}catch(v){k=[...k,{role:"error",content:String(v&&v.message||v)}],C()}finally{f(null),c(!1)}}return n("div",{className:"caf-chat-panel"},n("div",{className:"caf-block caf-chat-log"},t.greeting?n("div",{className:"caf-msg caf-msg-assistant",dangerouslySetInnerHTML:{__html:X(t.greeting)}}):null,d.map((b,g)=>n(Xe,{key:g,m:b})),i!==null?n("div",{className:"caf-msg caf-msg-assistant caf-msg-live",dangerouslySetInnerHTML:{__html:X(i||"\u2026")}}):null,s&&i===null?n("div",{className:"caf-msg-tools"},"thinking\u2026"):null,n("div",{ref:l})),n("div",{className:"caf-chat-input"},n("input",{value:r,placeholder:t.placeholder||"Message\u2026",disabled:s,enterKeyHint:"send",onChange:b=>o(b.target.value),onKeyDown:b=>{b.key==="Enter"&&(b.preventDefault(),p())},"aria-label":"Message"}),n("button",{type:"button",className:"caf-btn caf-btn-primary",disabled:s||!r.trim(),onClick:p},"Send")))}function Ne({spec:e,ctx:a}){return n("div",{className:"caf-panel caf-panel-single"},n(Z,{cfg:e.chat,ctx:a}))}var ee=["text","textarea","number","money","percent","check","date","select"];function N(e,a){if(e==null||e==="")return"\u2014";let t=Number(e);switch(a){case"money":return Number.isFinite(t)?t.toLocaleString(void 0,{style:"currency",currency:"USD",maximumFractionDigits:2}):String(e);case"percent":return Number.isFinite(t)?`${t.toLocaleString(void 0,{maximumFractionDigits:2})}%`:String(e);case"number":return Number.isFinite(t)?t.toLocaleString(void 0,{maximumFractionDigits:2}):String(e);case"date":return e instanceof Date?e.toLocaleDateString():String(e);default:return String(e)}}function te(e,a){if(e.required&&(a===""||a===null||a===void 0))return"Required";if(a===""||a===null||a===void 0)return null;if(e.type==="number"||e.type==="money"||e.type==="percent"){let t=Number(a);if(!Number.isFinite(t))return"Must be a number";if(e.min!==void 0&&t<e.min)return`Must be at least ${e.min}`;if(e.max!==void 0&&t>e.max)return`Must be at most ${e.max}`}return null}function j({field:e,value:a,onChange:t,data:r}){let o=te(e,a),s=`caf-f-${e.key}`,c=e.type==="number"||e.type==="money"||e.type==="percent";if(e.type==="check")return n("label",{className:"caf-check"},n("input",{id:s,type:"checkbox",checked:!!a,onChange:l=>t(l.target.checked)}),n("span",null,e.label||e.key));let i={id:s,value:a??"","aria-invalid":o?"true":void 0,onChange:l=>t(c?Ge(l.target.value):l.target.value)},f;if(e.type==="textarea")f=n("textarea",{...i,rows:e.rows||3});else if(e.type==="select"){let l=typeof e.options=="function"?e.options(r)||[]:e.options||[];f=n("select",i,n("option",{value:""},e.placeholder||"Select\u2026"),l.map(u=>{let d=typeof u=="string"?u:u.value,p=typeof u=="string"?u:u.label;return n("option",{key:d,value:d},p)}))}else f=n("input",{...i,type:e.type==="date"?"date":c?"number":"text",min:e.min,max:e.max,step:e.step||(e.type==="money"||e.type==="percent"?"any":void 0),placeholder:e.placeholder});return n("div",{className:"caf-field"},n("label",{htmlFor:s},e.label||e.key),f,e.hint&&!o?n("small",{className:"caf-hint"},e.hint):null,o?n("small",{className:"caf-error"},o):null)}function Ge(e){if(e==="")return"";let a=Number(e);return Number.isFinite(a)?a:e}function Ze({spec:e,ctx:a}){let t=e.fields||[];return n("div",{className:"caf-block caf-fields"},e.title?n("h2",{className:"caf-block-title"},e.title):null,t.map(r=>n(j,{key:r.key,field:r,data:a.data,value:a.data[r.key],onChange:o=>a.update(s=>{s[r.key]=o})})))}function et({spec:e,ctx:a}){let t=typeof e.output=="function"?e.output(a.data):e.output||[];return t.length?n("div",{className:"caf-block caf-output"},e.title?n("h2",{className:"caf-block-title"},e.title):null,n("div",{className:"caf-output-grid"},t.map((r,o)=>n("div",{key:r.label||o,className:r.big?"caf-stat caf-stat-big":"caf-stat"},n("span",{className:"caf-stat-label"},r.label),n("span",{className:"caf-stat-value"},N(r.value,r.format)),r.hint?n("small",{className:"caf-hint"},r.hint):null)))):n("div",{className:"caf-block caf-empty"},e.empty||"Nothing to show yet.")}function tt({spec:e,ctx:a}){let t=typeof e.text=="function"?e.text(a.data):e.text;return n("div",{className:"caf-block caf-text"},e.title?n("h2",{className:"caf-block-title"},e.title):null,n("p",null,t))}function at({spec:e,ctx:a}){let t=(typeof e.list=="function"?e.list(a.data):e.list)||[],r=typeof e.title=="string"?e.title:null,o=typeof e.title=="function"?e.title:s=>s.title??s.name??s.label??s.text??String(s);return t.length?n("div",{className:"caf-block caf-list"},r?n("h2",{className:"caf-block-title"},r):null,t.map((s,c)=>n("button",{key:s.id??c,className:"caf-row",type:"button",onClick:e.onSelect?()=>e.onSelect(s,a):void 0},n("span",{className:"caf-row-title"},o(s)),e.subtitle?n("span",{className:"caf-row-sub"},e.subtitle(s)):null))):n("div",{className:"caf-block caf-empty"},e.empty||"Nothing here yet.")}var Se=["bar","line","donut"];function rt({spec:e,ctx:a}){let t=typeof e.chart=="function"?e.chart(a.data):e.chart,r=t&&t.items||[];if(!r.length)return n("div",{className:"caf-block caf-empty"},e.empty||"No data to chart yet.");let o=t.type||"bar";if(!Se.includes(o))throw new Error(`unknown chart type "${o}". Valid types: ${Se.join(", ")}.`);let s=a.colors(r.length),c=o==="bar"?nt(r,t,s):o==="line"?ot(r,t):st(r,t,s);return n("div",{className:"caf-block caf-chart"},e.title?n("h2",{className:"caf-block-title"},e.title):null,c)}function nt(e,a,t){let r=Math.max(...e.map(o=>Number(o.value)||0),0)||1;return n("div",{className:"caf-bars"},e.map((o,s)=>n("div",{key:o.label??s,className:"caf-bar-row"},n("span",{className:"caf-bar-label"},o.label),n("div",{className:"caf-bar-track"},n("div",{className:"caf-bar-fill",style:{width:`${Math.max(2,(Number(o.value)||0)/r*100)}%`,background:t[s]}})),n("span",{className:"caf-bar-value"},N(o.value,a.format)))))}function ot(e,a){let t=e.map(u=>Number(u.value)||0),r=Math.min(...t),s=Math.max(...t)-r||1,c=100,i=36,f=t.map((u,d)=>[t.length===1?c/2:d/(t.length-1)*c,i-3-(u-r)/s*(i-6)]),l=f[f.length-1];return n("div",{className:"caf-line"},n("svg",{viewBox:`0 0 ${c} ${i}`,className:"caf-line-svg",preserveAspectRatio:"none","aria-hidden":"true"},[.25,.5,.75].map(u=>n("line",{key:u,x1:0,x2:c,y1:i*u,y2:i*u,className:"caf-line-grid"})),n("polyline",{points:f.map(u=>u.join(",")).join(" "),className:"caf-line-path"}),n("circle",{cx:l[0],cy:l[1],r:1.6,className:"caf-line-dot"})),n("div",{className:"caf-line-meta"},n("span",{className:"caf-hint"},String(e[0].label??"")),n("span",{className:"caf-line-last"},N(t[t.length-1],a.format)),n("span",{className:"caf-hint"},String(e[e.length-1].label??""))))}function st(e,a,t){let r=e.reduce((i,f)=>i+(Number(f.value)||0),0)||1,o=15.9155,s=25,c=e.map((i,f)=>{let l=(Number(i.value)||0)/r*100,u=n("circle",{key:i.label??f,cx:21,cy:21,r:o,className:"caf-donut-seg",stroke:t[f],strokeDasharray:`${l} ${100-l}`,strokeDashoffset:s});return s-=l,u});return n("div",{className:"caf-donut"},n("svg",{viewBox:"0 0 42 42",className:"caf-donut-svg","aria-hidden":"true"},c),n("div",{className:"caf-donut-legend"},e.map((i,f)=>n("div",{key:i.label??f,className:"caf-legend-row"},n("span",{className:"caf-legend-swatch",style:{background:t[f]}}),n("span",{className:"caf-legend-label"},i.label),n("span",{className:"caf-legend-value"},N(i.value,a.format))))))}function ct({spec:e,ctx:a}){let t=e.timer||{},r=Math.max(1,Math.round((t.minutes||0)*60+(t.seconds||0))||300),[o,s]=x(r),[c,i]=x(!1);$(()=>{if(!c)return;let d=setInterval(()=>s(p=>Math.max(0,p-1)),1e3);return()=>clearInterval(d)},[c]),$(()=>{o===0&&c&&(i(!1),typeof t.onDone=="function"&&a.update(d=>t.onDone(d)))},[o,c]);let f=String(Math.floor(o/60)).padStart(2,"0"),l=String(o%60).padStart(2,"0"),u=o===0;return n("div",{className:"caf-block caf-timer"},e.title?n("h2",{className:"caf-block-title"},e.title):null,t.label?n("span",{className:"caf-hint"},t.label):null,n("div",{className:u?"caf-timer-time caf-timer-done":"caf-timer-time"},u?t.doneText||"Done!":`${f}:${l}`),n("div",{className:"caf-bar-track"},n("div",{className:"caf-bar-fill caf-timer-fill",style:{width:`${o/r*100}%`}})),n("div",{className:"caf-timer-controls"},n("button",{type:"button",className:"caf-btn caf-btn-primary",disabled:u,onClick:()=>i(d=>!d)},c?"Pause":"Start"),n("button",{type:"button",className:"caf-btn",onClick:()=>{i(!1),s(r)}},"Reset")))}function it({spec:e,ctx:a}){let r=(e.actions||[]).filter(o=>!o.when||o.when(a.data));return n("div",{className:"caf-block caf-actions"},e.title?n("h2",{className:"caf-block-title"},e.title):null,n("div",{className:"caf-actions-row"},r.map(o=>n("button",{key:o.label,type:"button",className:o.kind==="danger"?"caf-btn caf-btn-danger":o.kind==="primary"?"caf-btn caf-btn-primary":"caf-btn",onClick:()=>a.update(s=>o.run(s))},o.label))))}function lt({spec:e,ctx:a}){let t=e.custom(a);return typeof t=="string"?n("div",{className:"caf-block",dangerouslySetInnerHTML:{__html:t}}):n("div",{className:"caf-block"},t)}var ae={fields:Ze,output:et,text:tt,list:at,chart:rt,timer:ct,actions:it,chat:({spec:e,ctx:a})=>n(Z,{cfg:e.chat,ctx:a}),custom:lt},D=Object.keys(ae);function $e(e){return Object.entries(e.compute||{}).map(([a,t])=>[a,typeof t=="function"?{value:t}:t])}function re(e,a){if(!e.compute)return a;let t={...a};for(let[r,o]of $e(e))try{t[r]=o.value(a)}catch{t[r]=void 0}return t}function Ee(e){let a={};for(let t of e)a[t.key]=t.value!==void 0?t.value:t.type==="check"?!1:"";return a}function Ce(){return"r"+Date.now().toString(36)+Math.random().toString(36).slice(2,8)}function ft(e,a){if(e.title)return e.title(a);let t=e.fields.find(o=>!o.type||o.type==="text"||o.type==="textarea"||o.type==="select"),r=t&&a[t.key];return r===""||r===void 0||r===null?"(untitled)":String(r)}function ut({spec:e,records:a}){if(!e.summary)return null;let t=e.summary(a)||[];return t.length?n("div",{className:"caf-block caf-output"},n("div",{className:"caf-output-grid"},t.map((r,o)=>n("div",{key:r.label||o,className:r.big?"caf-stat caf-stat-big":"caf-stat"},n("span",{className:"caf-stat-label"},r.label),n("span",{className:"caf-stat-value"},N(r.value,r.format)))))):null}function dt({spec:e,ctx:a}){let t=e.label||"item",[r,o]=x(""),s=a.data.records.map(l=>re(e,l));e.sort&&(s=s.slice().sort(e.sort));let c=s.length,i=r.trim().toLowerCase();e.search&&i&&(s=s.filter(l=>e.fields.some(u=>String(l[u.key]??"").toLowerCase().includes(i))));function f(){let l={id:Ce(),...Ee(e.fields)};e.items&&(l.items=[]),a.update(u=>{u.records=[...u.records,l]}),a.go("record",l.id)}return n("div",{className:"caf-block caf-list"},n("div",{className:"caf-toolbar"},n("span",{className:"caf-count"},e.search&&i?`${s.length} of ${c}`:`${c} ${t}${c===1?"":"s"}`),n("button",{type:"button",className:"caf-btn caf-btn-primary",onClick:f},`Add ${t}`)),e.search?n("input",{className:"caf-search",value:r,placeholder:`Search ${t}s\u2026`,"aria-label":"Search",onChange:l=>o(l.target.value)}):null,e.search&&i&&s.length===0&&c>0?n("div",{className:"caf-empty"},`Nothing matches "${r}".`):null,s.length===0?n("div",{className:"caf-empty"},e.empty||`No ${t}s yet. Add the first one.`):s.map(l=>n("div",{key:l.id,className:"caf-row-wrap"},n("button",{type:"button",className:"caf-row",onClick:()=>a.go("record",l.id)},n("span",{className:"caf-row-title"},ft(e,l)),e.subtitle?n("span",{className:"caf-row-sub"},e.subtitle(l)):null),e.actions?n("div",{className:"caf-row-actions"},e.actions.filter(u=>!u.when||u.when(l)).map(u=>n("button",{key:u.label,type:"button",className:u.kind==="danger"?"caf-btn caf-btn-danger caf-btn-sm":"caf-btn caf-btn-sm",onClick:()=>a.update(d=>{let p=d.records.find(b=>b.id===l.id);p&&u.run(p,d)})},u.label))):null)))}function mt({spec:e,ctx:a,record:t}){let r=e.label||"item";function o(){a.update(s=>{s.records=s.records.filter(c=>c.id!==t.id)}),a.back()}return n("div",{className:"caf-block caf-fields"},n("div",{className:"caf-toolbar"},n("button",{type:"button",className:"caf-btn",onClick:a.back},"\u2039 Back"),n("button",{type:"button",className:"caf-btn caf-btn-danger",onClick:o},`Delete ${r}`)),e.fields.map(s=>n(j,{key:s.key,field:s,data:a.data,value:t[s.key],onChange:c=>a.update(i=>{let f=i.records.find(l=>l.id===t.id);f&&(f[s.key]=c)})})),e.items?n(pt,{spec:e,ctx:a,record:t}):null,e.compute?n("div",{className:"caf-output-grid caf-computed"},$e(e).map(([s,c])=>{let i=re(e,t);return n("div",{key:s,className:"caf-stat"},n("span",{className:"caf-stat-label"},c.label||s),n("span",{className:"caf-stat-value"},N(i[s],c.format)))})):null)}function pt({spec:e,ctx:a,record:t}){let r=e.items,o=r.label||"item";function s(i){a.update(f=>{let l=f.records.find(u=>u.id===t.id);l&&(Array.isArray(l.items)||(l.items=[]),i(l))})}let c=Array.isArray(t.items)?t.items:[];return n("div",{className:"caf-items"},n("div",{className:"caf-toolbar"},n("span",{className:"caf-count"},`${c.length} ${o}${c.length===1?"":"s"}`),n("button",{type:"button",className:"caf-btn caf-btn-sm",onClick:()=>s(i=>i.items.push({id:Ce(),...Ee(r.fields)}))},`Add ${o}`)),c.length===0?n("div",{className:"caf-empty caf-empty-sm"},r.empty||`No ${o}s yet.`):c.map(i=>n("div",{key:i.id,className:"caf-item-row"},r.fields.map(f=>n(j,{key:f.key,field:f,data:a.data,value:i[f.key],onChange:l=>s(u=>{let d=u.items.find(p=>p.id===i.id);d&&(d[f.key]=l)})})),n("button",{type:"button",className:"caf-btn caf-btn-danger caf-btn-sm caf-item-remove","aria-label":`Remove ${o}`,onClick:()=>s(f=>{f.items=f.items.filter(l=>l.id!==i.id)})},"\u2715"))))}function Ae({spec:e,ctx:a}){let t=e.records;if(a.view.screen==="record"){let r=a.data.records.find(o=>o.id===a.view.arg);if(r)return n("div",{className:"caf-panel caf-panel-single"},n(mt,{spec:t,ctx:a,record:r}))}return n("div",{className:"caf-panel caf-panel-single"},n(ut,{spec:t,records:a.data.records.map(r=>re(t,r))}),n(dt,{spec:t,ctx:a}))}function bt(e,a){return(e.fields||[]).some(t=>te(t,a[t.key])!==null)}function ht({step:e,ctx:a}){let t=e.result(a.data)||[];return n("div",{className:"caf-block caf-output"},e.title?n("h2",{className:"caf-block-title"},e.title):null,n("div",{className:"caf-output-grid"},t.map((r,o)=>n("div",{key:r.label??o,className:r.big?"caf-stat caf-stat-big":"caf-stat"},n("span",{className:"caf-stat-label"},r.label),n("span",{className:"caf-stat-value"},N(r.value,r.format)),r.hint?n("small",{className:"caf-hint"},r.hint):null))),n("div",{className:"caf-step-nav"},n("button",{type:"button",className:"caf-btn",onClick:()=>a.setStep(0)},"Start over")))}function Te({spec:e,ctx:a}){let t=e.steps,r=Math.min(Math.max(a.view.step||0,0),t.length-1),o=t[r],s=typeof o.result=="function",c=r===t.length-1;return n("div",{className:"caf-panel caf-panel-single"},n("div",{className:"caf-steps-progress"},n("span",{className:"caf-hint"},s?"Result":`Step ${r+1} of ${t.length}`),n("div",{className:"caf-bar-track"},n("div",{className:"caf-bar-fill caf-steps-fill",style:{width:`${(r+1)/t.length*100}%`}}))),s?n(ht,{step:o,ctx:a}):n("div",{className:"caf-block caf-fields"},o.title?n("h2",{className:"caf-block-title"},o.title):null,o.text?n("p",{className:"caf-step-text"},typeof o.text=="function"?o.text(a.data):o.text):null,(o.fields||[]).map(i=>n(j,{key:i.key,field:i,data:a.data,value:a.data[i.key],onChange:f=>a.update(l=>{l[i.key]=f})})),n("div",{className:"caf-step-nav"},r>0?n("button",{type:"button",className:"caf-btn",onClick:()=>a.setStep(r-1)},"\u2039 Back"):n("span"),c?null:n("button",{type:"button",className:"caf-btn caf-btn-primary",disabled:bt(o,a.data),onClick:()=>a.setStep(r+1)},"Next \u203A"))))}var je=["panel","records","steps","chat","workspace"],gt=["title","empty","wide","onSelect","subtitle","when","collapsible"],Oe=["title","subtitle","theme","layout","blocks","records","steps","chat","data","shared","main","sidebar"];function V(e,a){for(let t of e||[]){if(!t||!t.key)throw new Error(`claude-artifact-framework: every field in ${a} needs a \`key\`.`);if(t.type!==void 0&&!ee.includes(t.type))throw new Error(`claude-artifact-framework: field "${t.key}" in ${a} has unknown type "${t.type}". Valid types: ${ee.join(", ")}.`);if(t.type==="select"&&t.options!==void 0&&!Array.isArray(t.options)&&typeof t.options!="function")throw new Error(`claude-artifact-framework: field "${t.key}" in ${a}: \`options\` must be an array or a function of data returning one.`)}}function Le(e,a){if(!e||typeof e.system!="string"&&typeof e.system!="function")throw new Error(`claude-artifact-framework: ${a} needs \`{ system: "..." }\` (a string or a function of data).`);let t=Object.keys(e).filter(r=>!G.includes(r));if(t.length)throw new Error(`claude-artifact-framework: ${a} has unknown keys (${t.join(", ")}). Valid keys: ${G.join(", ")}.`);for(let[r,o]of Object.entries(e.tools||{}))if(!o||typeof o.description!="string"||typeof o.run!="function")throw new Error(`claude-artifact-framework: chat tool "${r}" needs a \`description\` string and a \`run(input, ctx)\` function.`)}var Re=["label","run","when","kind"];function _e(e,a){if(!Array.isArray(e))throw new Error(`claude-artifact-framework: ${a} must be an array of { label, run }.`);e.forEach((t,r)=>{if(!t||typeof t.label!="string"||typeof t.run!="function")throw new Error(`claude-artifact-framework: ${a}[${r}] needs a \`label\` string and a \`run\` function.`);let o=Object.keys(t).filter(s=>!Re.includes(s));if(o.length)throw new Error(`claude-artifact-framework: ${a}[${r}] has unknown keys (${o.join(", ")}). Valid keys: ${Re.join(", ")}.`)})}function R(e){if(!Array.isArray(e))throw new Error("claude-artifact-framework: `blocks` must be an array.");e.forEach((a,t)=>{if(!a||typeof a!="object")throw new Error(`claude-artifact-framework: blocks[${t}] must be an object like { fields: [...] }.`);let r=Object.keys(a).filter(s=>!gt.includes(s)),o=r.filter(s=>D.includes(s)||s==="tabs");if(o.length===0)throw new Error(`claude-artifact-framework: blocks[${t}] has no recognised block type (found: ${r.join(", ")||"nothing"}). Valid block types: ${D.join(", ")}.`);if(o.length>1)throw new Error(`claude-artifact-framework: blocks[${t}] declares more than one block type (${o.join(", ")}). Split them into separate entries of \`blocks\`.`);if(V(a.fields,`blocks[${t}]`),o[0]==="actions"&&_e(a.actions,`blocks[${t}].actions`),o[0]==="chat"&&Le(a.chat,`blocks[${t}].chat`),o[0]==="tabs"){let s=a.tabs;if(!Array.isArray(s)||s.length===0)throw new Error(`claude-artifact-framework: blocks[${t}].tabs needs an array of { label, blocks: [...] }.`);s.forEach((c,i)=>{if(!c||typeof c.label!="string"||!Array.isArray(c.blocks)||c.blocks.length===0)throw new Error(`claude-artifact-framework: tabs[${i}] needs a \`label\` string and a non-empty \`blocks\` array.`);if(c.blocks.some(f=>f&&f.tabs))throw new Error("claude-artifact-framework: tabs cannot nest inside tabs.");R(c.blocks)})}if(a.when!==void 0&&typeof a.when!="function")throw new Error(`claude-artifact-framework: blocks[${t}].when must be a function of data returning true/false.`)})}function yt(e){let a=Object.keys(e).filter(r=>!Oe.includes(r));if(a.length)throw new Error(`claude-artifact-framework: unknown top-level keys (${a.join(", ")}). Valid keys: ${Oe.join(", ")}.`);let t=e.layout||"panel";if(!je.includes(t))throw new Error(`claude-artifact-framework: unknown layout "${t}". Valid layouts: ${je.join(", ")}.`);if(t==="steps"){let r=e.steps;if(!Array.isArray(r)||r.length===0)throw new Error('claude-artifact-framework: layout "steps" needs `steps: [...]` with at least one step.');let o=["title","text","fields","result"],s=new Set;return r.forEach((c,i)=>{if(!c||typeof c!="object")throw new Error(`claude-artifact-framework: steps[${i}] must be an object.`);let f=Object.keys(c).filter(l=>!o.includes(l));if(f.length)throw new Error(`claude-artifact-framework: steps[${i}] has unknown keys (${f.join(", ")}). Valid keys: ${o.join(", ")}.`);if(!c.fields&&!c.text&&!c.result)throw new Error(`claude-artifact-framework: steps[${i}] needs \`fields\`, \`text\`, or \`result\`.`);V(c.fields,`steps[${i}]`);for(let l of c.fields||[]){if(s.has(l.key))throw new Error(`claude-artifact-framework: field key "${l.key}" appears in more than one step \u2014 keys share one data pool and must be unique.`);s.add(l.key)}}),t}if(t==="chat")return Le(e.chat,"chat"),t;if(t==="workspace"){if(!Array.isArray(e.main)||e.main.length===0)throw new Error('claude-artifact-framework: layout "workspace" needs `main: [...]` (an array of blocks). `sidebar: [...]` is optional.');if(R(e.main),e.sidebar!==void 0){if(!Array.isArray(e.sidebar))throw new Error("claude-artifact-framework: workspace `sidebar` must be an array of blocks.");R(e.sidebar)}if(oe([...e.main,...e.sidebar||[]]).filter(o=>o&&o.chat).length>1)throw new Error("claude-artifact-framework: only one chat block per app \u2014 the conversation persists under data.chat and there is exactly one.");return t}if(t==="records"){let r=e.records;if(!r||!Array.isArray(r.fields)||r.fields.length===0)throw new Error('claude-artifact-framework: layout "records" needs `records: { fields: [...] }` \u2014 the same field declarations the fields block uses.');let o=["label","fields","title","subtitle","sort","summary","empty","search","compute","items","actions"],s=Object.keys(r).filter(i=>!o.includes(i));if(s.length)throw new Error(`claude-artifact-framework: records has unknown keys (${s.join(", ")}). Valid keys: ${o.join(", ")}.`);V(r.fields,"records");let c=new Set;for(let i of r.fields){if(i.key==="id")throw new Error('claude-artifact-framework: "id" is reserved on records \u2014 the framework assigns it.');if(c.has(i.key))throw new Error(`claude-artifact-framework: duplicate records field key "${i.key}".`);c.add(i.key)}if(e.blocks&&R(e.blocks),r.actions&&_e(r.actions,"records.actions"),r.items){let i=["label","fields","empty"],f=Object.keys(r.items).filter(l=>!i.includes(l));if(f.length)throw new Error(`claude-artifact-framework: records.items has unknown keys (${f.join(", ")}). Valid keys: ${i.join(", ")}.`);if(!Array.isArray(r.items.fields)||r.items.fields.length===0)throw new Error("claude-artifact-framework: records.items needs `fields: [...]` \u2014 the same field declarations as everywhere else.");V(r.items.fields,"records.items");for(let l of r.items.fields)if(l.key==="id")throw new Error('claude-artifact-framework: "id" is reserved on items \u2014 the framework assigns it.');if(c.has("items")||r.fields.some(l=>l.key==="items"))throw new Error('claude-artifact-framework: a records field cannot be named "items" when `items` is declared \u2014 that key holds the child collection.')}for(let[i,f]of Object.entries(r.compute||{})){if(c.has(i)||i==="id"||r.items&&i==="items")throw new Error(`claude-artifact-framework: compute key "${i}" collides with a field key \u2014 computed values are derived, never stored.`);if(typeof f!="function"&&typeof(f&&f.value)!="function")throw new Error(`claude-artifact-framework: compute "${i}" must be a function of the record, or { label, format, value: (r) => ... }.`)}return t}return R(e.blocks||[]),t}function oe(e){let a=[];for(let t of e||[])if(a.push(t),t&&Array.isArray(t.tabs))for(let r of t.tabs)a.push(...oe(r.blocks));return a}function wt(e){let a={...e.data||{}};(e.layout||"panel")==="records"&&!Array.isArray(a.records)&&(a.records=[]);let t=oe([...e.blocks||[],...e.main||[],...e.sidebar||[]]);((e.layout||"panel")==="chat"||t.some(o=>o&&o.chat))&&!a.chat&&(a.chat={api:[],log:[]});for(let o of[...t,...e.steps||[]])for(let s of o.fields||[])s&&s.key!==void 0&&!(s.key in a)&&(a[s.key]=s.value!==void 0?s.value:s.type==="check"?!1:"");return a}var ne=null;function kt(e){return ne||(ne=class extends e.Component{constructor(a){super(a),this.state={error:null}}static getDerivedStateFromError(a){return{error:a}}render(){return this.state.error?n("div",{className:"caf-block caf-block-error"},n("strong",null,"This section failed to render"),n("code",null,String(this.state.error.message||this.state.error))):this.props.children}}),ne}function vt({spec:e,ctx:a}){let t=e.tabs,r=t.map(c=>c.label).join("|"),o=a.view.tabs?a.view.tabs[r]:void 0,s=Math.min(o===void 0?0:o,t.length-1);return n("div",{className:"caf-tabs"},n("div",{className:"caf-tabbar",role:"tablist"},t.map((c,i)=>n("button",{key:c.label,type:"button",role:"tab","aria-selected":i===s,className:i===s?"caf-tab caf-tab-active":"caf-tab",onClick:()=>a.setTab(r,i)},c.label))),n("div",{className:"caf-tabs-body"},t[s].blocks.map((c,i)=>n(I,{key:s+":"+i,block:c,ctx:a}))))}var xt={...ae,tabs:vt},Nt=[...D,"tabs"];function I({block:e,ctx:a}){if(typeof e.when=="function"&&!e.when(a.data))return null;let t=Object.keys(e).find(i=>Nt.includes(i)),r=xt[t],o=n(kt(a.React),null,n(r,{spec:e.collapsible?{...e,title:void 0}:e,ctx:a}));if(!e.collapsible)return o;let s=typeof e.title=="string"&&e.title?e.title:t,c=a.view.collapsed&&s in a.view.collapsed?a.view.collapsed[s]:e.collapsible==="collapsed";return n("div",{className:"caf-collapse"},n("button",{type:"button",className:"caf-collapse-head","aria-expanded":!c,onClick:()=>a.toggleCollapsed(s,!c)},n("span",null,e.title||t),n("span",{className:c?"caf-chevron caf-chevron-closed":"caf-chevron"},"\u25BE")),c?null:n("div",{className:"caf-collapse-body"},o))}function St({spec:e,ctx:a}){return n("div",{className:"caf-panel"},(e.blocks||[]).map((t,r)=>n("section",{key:r,className:t.wide?"caf-slot caf-slot-wide":"caf-slot"},n(I,{block:t,ctx:a}))))}function $t({spec:e,ctx:a}){let t=a.view.screen==="record"&&(a.data.records||[]).some(r=>r.id===a.view.arg);return n("div",null,n(Ae,{spec:e,ctx:a}),!t&&Array.isArray(e.blocks)&&e.blocks.length?n("div",{className:"caf-panel caf-records-blocks"},e.blocks.map((r,o)=>n("section",{key:o,className:r.wide?"caf-slot caf-slot-wide":"caf-slot"},n(I,{block:r,ctx:a})))):null)}function Et({spec:e,ctx:a}){let t=r=>(r||[]).map((o,s)=>n("section",{key:s,className:"caf-ws-slot"},n(I,{block:o,ctx:a})));return n("div",{className:"caf-workspace"},n("div",{className:"caf-ws-main"},t(e.main)),e.sidebar&&e.sidebar.length?n("div",{className:"caf-ws-side"},t(e.sidebar)):null)}var Ct={panel:St,records:$t,steps:Te,chat:Ne,workspace:Et};function Me(e={}){let a=yt(e),t=ge(wt(e),{shared:!!e.shared}),r=B(e.theme&&e.theme.seed)+At;return function(){if(!L())throw new Error(`claude-artifact-framework: React not found. Hand it over once, before rendering:
|
|
29
29
|
|
|
30
30
|
import React from "react";
|
|
31
31
|
ArtifactKit.useReact(React);
|
|
32
|
-
`);let[,s]=x(0);$(()=>{let f=t.subscribe(()=>s(l=>l+1));return t.isHydrated()&&s(l=>l+1),f},[]);let c={React:
|
|
32
|
+
`);let[,s]=x(0);$(()=>{let f=t.subscribe(()=>s(l=>l+1));return t.isHydrated()&&s(l=>l+1),f},[]);let c={React:de(),data:t.getData(),view:t.getView(),update:t.update,go:t.go,back:t.back,setStep:f=>t.setView({step:f}),setTab:(f,l)=>t.setView({tabs:{...t.getView().tabs,[f]:l}}),toggleCollapsed:(f,l)=>t.setView({collapsed:{...t.getView().collapsed,[f]:l}}),colors:f=>ke(e.theme&&e.theme.seed,f)},i=Ct[a];return n("div",{className:"caf-root"},n("style",{dangerouslySetInnerHTML:{__html:r}}),n("header",{className:"caf-header"},e.title?n("h1",null,e.title):null,e.subtitle?n("p",null,e.subtitle):null),t.isHydrated()?n(i,{spec:e,ctx:c}):n("div",{className:"caf-block caf-loading"},"Loading\u2026"))}}var At=`
|
|
33
33
|
.caf-root {
|
|
34
34
|
--caf-radius: 10px;
|
|
35
35
|
box-sizing: border-box;
|
|
@@ -177,9 +177,30 @@ Continue with this information. If you have everything you need, answer in natur
|
|
|
177
177
|
.caf-workspace { flex-direction: column; align-items: stretch; }
|
|
178
178
|
.caf-ws-side { width: 100%; position: static; }
|
|
179
179
|
}
|
|
180
|
+
.caf-tabs { display: flex; flex-direction: column; gap: 0.8rem; min-width: 0; }
|
|
181
|
+
.caf-tabbar { display: flex; gap: 0.2rem; border-bottom: 1px solid var(--caf-border); overflow-x: auto; }
|
|
182
|
+
.caf-tab {
|
|
183
|
+
font: inherit; font-size: 0.85rem; font-weight: 600; cursor: pointer;
|
|
184
|
+
padding: 0.45rem 0.8rem; border: none; background: none; color: var(--caf-muted);
|
|
185
|
+
border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap;
|
|
186
|
+
}
|
|
187
|
+
.caf-tab:hover { color: var(--caf-text); }
|
|
188
|
+
.caf-tab:focus-visible { outline: 2px solid var(--caf-accent); outline-offset: -2px; }
|
|
189
|
+
.caf-tab-active { color: var(--caf-accent); border-bottom-color: var(--caf-accent); }
|
|
190
|
+
.caf-tabs-body { display: flex; flex-direction: column; gap: 0.8rem; }
|
|
191
|
+
.caf-collapse { display: flex; flex-direction: column; gap: 0.5rem; min-width: 0; }
|
|
192
|
+
.caf-collapse-head {
|
|
193
|
+
font: inherit; font-size: 0.95rem; font-weight: 650; cursor: pointer;
|
|
194
|
+
display: flex; align-items: center; justify-content: space-between; gap: 0.6rem;
|
|
195
|
+
padding: 0.7rem 1rem; border: 1px solid var(--caf-border); border-radius: var(--caf-radius);
|
|
196
|
+
background: var(--caf-surface); color: var(--caf-text); width: 100%; text-align: left;
|
|
197
|
+
}
|
|
198
|
+
.caf-collapse-head:focus-visible { outline: 2px solid var(--caf-accent); outline-offset: 1px; }
|
|
199
|
+
.caf-chevron { transition: transform 0.15s ease; color: var(--caf-muted); }
|
|
200
|
+
.caf-chevron-closed { transform: rotate(-90deg); }
|
|
180
201
|
.caf-empty, .caf-loading { color: var(--caf-muted); font-size: 0.9rem; text-align: center; padding: 1.6rem 1rem; }
|
|
181
202
|
.caf-block-error { border-color: var(--caf-danger); gap: 0.4rem; }
|
|
182
203
|
.caf-block-error strong { font-size: 0.9rem; color: var(--caf-danger); }
|
|
183
204
|
.caf-block-error code { font-size: 0.78rem; color: var(--caf-muted); word-break: break-word; }
|
|
184
|
-
`;return
|
|
205
|
+
`;return He(Tt);})();
|
|
185
206
|
//# sourceMappingURL=index.global.js.map
|