@artooi/ag-ui-web-component 0.1.0 → 0.1.1

package/CHANGELOG.md

@@ -7,7 +7,32 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [0.1.1] — 2026-06-01
+
+### Changed
+- CI: resolve the pnpm version from `package.json`'s `packageManager` only
+  (dropped the conflicting `version` input in the release/test workflows).
+
+### Notes
+- First fully-automated release via the npm OIDC publish pipeline — 0.1.0 was
+  the manual bootstrap publish that created the package.
+
+## [0.1.0] — 2026-06-01
+
 ### Added
-- Initial scaffold.
+- `<ag-ui-chat>` Web Component over AG-UI: Shadow-DOM chat UI, a pluggable tool
+  registry (`registerTool`), the `x-destructive` confirmation modal, and the
+  DOM-driver + animation primitives.
+- Durable conversation + resumable run loop that survives the full page reloads
+  of a multi-page app: `SessionStorageStore`, a persisted thread id, and
+  `x-navigates` checkpoints completed via `navigationResult` on the next mount.
+- Host seams: `routeMap` (+ `list_routes` / `navigate_to_route`), an
+  auto-injected `getPageMap` context, `registerStateHook`, and an optional
+  client-side `navigate()` callback (SPA vs MPA).
+
+### Notes
+- First release — exercising the automated npm OIDC publish pipeline end-to-end.
 
-[Unreleased]: https://github.com/Artui/ag-ui-web-component/compare/v0.1.0...HEAD
+[Unreleased]: https://github.com/Artui/ag-ui-web-component/compare/v0.1.1...HEAD
+[0.1.1]: https://github.com/Artui/ag-ui-web-component/compare/v0.1.0...v0.1.1
+[0.1.0]: https://github.com/Artui/ag-ui-web-component/releases/tag/v0.1.0

package/dist/ag-ui-web-component.bundle.js

@@ -299,7 +299,7 @@ Error: ${E}`)}}return p()}case h.MESSAGES_SNAPSHOT:{let d=await G(n,a,l,(f,m,E)=
   background: var(--ag-ui-accent);
   color: #ffffff;
 }
-`;var la={[q.PENDING]:"running\u2026",[q.DONE]:"\u2713 done",[q.ERROR]:"\u26A0 error",[q.DECLINED]:"\u2298 declined"},fc={[q.DONE]:"Result",[q.ERROR]:"Error",[q.DECLINED]:"Declined"},Dt=class{element;#e;constructor(t,r){this.element=document.createElement("div"),this.element.className="tool-call",this.element.setAttribute("data-tool-name",t),this.element.setAttribute("data-status",q.PENDING);let n=document.createElement("div");n.className="tool-call-head";let s=document.createElement("span");s.className="tool-call-name",s.textContent=`\u{1F527} ${t}`,this.#e=document.createElement("span"),this.#e.className="tool-call-status",this.#e.textContent=la[q.PENDING],n.append(s,this.#e);let o=document.createElement("pre");o.className="tool-call-args",o.textContent=JSON.stringify(r,null,2),this.element.append(n,o)}settle(t,r){this.element.setAttribute("data-status",t),this.#e.textContent=la[t];let n=document.createElement("button");n.type="button",n.className="tool-call-toggle",n.setAttribute("aria-expanded","false"),n.textContent=fc[t];let s=document.createElement("pre");s.className="tool-call-result",s.textContent=r,s.hidden=!0,n.addEventListener("click",()=>{let o=s.hidden;s.hidden=!o,n.setAttribute("aria-expanded",String(o))}),this.element.append(n,s)}};var Ut=class extends HTMLElement{agentFactory=ao;headers={};autoConfirm=!1;getTools=()=>[...this.#d().map(t=>({name:t.name,description:t.description,parameters:t.parameters})),...this.#e.tools()];getContext=()=>uo(this.getPageMap,this.autoInjectPageMap);routeMap=[];navigate=null;getPageMap=null;autoInjectPageMap=!0;conversationStore=new Lt;navigationResult=()=>({navigated:!0,url:window.location.href});#e=new Pt;#i=new Map;#l;#o;#t;#r;#n;#u=null;#s=null;#a="";#c=[];constructor(){super(),this.#l=this.attachShadow({mode:"open"}),this.#o=document.createElement("div"),this.#t=document.createElement("div"),this.#r=document.createElement("textarea"),this.#n=document.createElement("button")}registerTool(t){this.#e.register(t)}registerStateHook(t){for(let r of fo(t))this.#e.register(r)}#d(){return this.routeMap.length===0?[]:co(()=>this.routeMap,()=>this.navigate)}#g(t){let r=this.#d().find(n=>n.name===t);return r!==void 0?r:this.#e.has(t)?this.#e.get(t):null}get endpoint(){return this.getAttribute("endpoint")??""}connectedCallback(){this.#_(),this.#a=this.conversationStore.threadId(),this.#v()}async#v(){let t=await this.conversationStore.loadMessages(this.#a);if(t!==null){this.#c=t;for(let n of t)this.#y(n)}let r=this.conversationStore.loadCheckpoint(this.#a);r!==null&&await this.#E(r)}#y(t){typeof t.content!="string"||t.content===""||(t.role===Te.USER?this.appendMessage(Te.USER,t.content):t.role===Te.ASSISTANT&&this.appendMessage(Te.ASSISTANT,t.content))}async#E(t){this.conversationStore.saveCheckpoint(this.#a,null);let r=this.#p();r.addToolResult(t.toolCallId,JSON.stringify(this.navigationResult(t))),await r.resume()}appendMessage(t,r){let n=document.createElement("div");return n.className=`message message--${t}`,n.textContent=r,this.#t.appendChild(n),this.#t.scrollTop=this.#t.scrollHeight,n}#_(){let t=document.createElement("style");t.textContent=ia,this.#o.className="chat";let r=document.createElement("div");r.className="header",r.textContent=this.getAttribute("title-text")??"Assistant",this.#t.className="messages";let n=document.createElement("div");n.className="input-row",this.#r.className="input",this.#r.rows=2,this.#r.placeholder="Ask anything\u2026",this.#r.addEventListener("keydown",s=>this.#x(s)),this.#n.className="send",this.#n.type="button",this.#n.textContent="Send",this.#n.addEventListener("click",()=>{this.#f()}),n.append(this.#r,this.#n),this.#o.append(r,this.#t,n),this.#l.append(t,this.#o)}#x(t){t.key==="Enter"&&!t.shiftKey&&(t.preventDefault(),this.#f())}async#f(){let t=this.#r.value.trim();t!==""&&(this.appendMessage(Te.USER,t),this.#r.value="",this.dispatchEvent(new CustomEvent(eo,{detail:{content:t},bubbles:!0,composed:!0})),await this.#b(t))}async#b(t){this.endpoint!==""&&await this.#p().send(t)}#p(){if(this.#u===null){let t=this.agentFactory({endpoint:this.endpoint,headers:this.headers,threadId:this.#a,initialMessages:this.#c});this.#u=new Mt({agent:t,handlers:this.#T(),getTools:()=>this.getTools(),getContext:()=>this.getContext(),executeTool:r=>this.#S(r),onPersist:r=>this.conversationStore.saveMessages(this.#a,r)})}return this.#u}async#S(t){let r=this.#h(t);this.#i.delete(t.id);let n=this.#g(t.name);if(n===null)return r.settle(q.DONE,"Executed on the server."),null;if(io(n.parameters)&&!this.autoConfirm&&!await ro(this.#o,{toolName:t.name,args:t.args})){let a="User declined the action.";return r.settle(q.DECLINED,a),{content:a}}let s=lo(n.parameters)&&this.navigate===null;s&&this.conversationStore.saveCheckpoint(this.#a,{toolCallId:t.id});try{let o=await n.handler(t.args);if(s)return r.settle(q.DONE,"Navigating\u2026"),{content:"",halt:!0};let a=JSON.stringify(o??null);return r.settle(q.DONE,a),{content:a}}catch(o){s&&this.conversationStore.saveCheckpoint(this.#a,null);let a=o instanceof Error?o.message:String(o);return r.settle(q.ERROR,a),{content:`Error: ${a}`,error:a}}}#T(){return{onRunStart:()=>{this.#n.disabled=!0},onTextDelta:t=>{this.#m(t)},onTextEnd:t=>{this.#m(t),this.#s=null},onToolCall:t=>{this.#h(t)},onRunEnd:()=>{this.#n.disabled=!1,this.#s=null},onError:t=>{this.appendMessage(Te.ASSISTANT,`\u26A0\uFE0F ${t}`),this.#n.disabled=!1,this.#s=null}}}#m(t){this.#s===null&&(this.#s=this.appendMessage(Te.ASSISTANT,"")),this.#s.textContent=t,this.#t.scrollTop=this.#t.scrollHeight}#h(t){let r=this.#i.get(t.id);if(r!==void 0)return r;let n=new Dt(t.name,t.args);return this.#i.set(t.id,n),this.#t.appendChild(n.element),this.#t.scrollTop=this.#t.scrollHeight,n}};var pc="#4f46e5";function po(e){return new Promise(t=>{setTimeout(t,e)})}async function mo(e,t,r={}){let n=r.charDelayMs??35;e.value="",e.dispatchEvent(new Event("input",{bubbles:!0}));for(let s of t)e.value+=s,e.dispatchEvent(new Event("input",{bubbles:!0})),n>0&&await po(n);e.dispatchEvent(new Event("change",{bubbles:!0}))}async function ho(e,t={}){let r=t.highlightMs??280,n=e.style.outline,s=e.style.outlineOffset;e.style.outline=`2px solid ${pc}`,e.style.outlineOffset="2px",await po(r),e.style.outline=n,e.style.outlineOffset=s,e.click()}function dn(e){e.scrollIntoView({block:"center",inline:"nearest",behavior:"smooth"})}async function go(e,t={}){let r=t.flashMs??200;e.focus();let n=e.style.boxShadow;e.style.boxShadow="0 0 0 3px rgba(79, 70, 229, 0.4)",await po(r),e.style.boxShadow=n}function mc(){customElements.get(cn)===void 0&&customElements.define(cn,Ut)}async function hc(e,t,r={}){dn(e),await go(e,{flashMs:r.flashMs??0}),await mo(e,t,r)}async function gc(e,t={}){dn(e),await ho(e,t)}function vc(e,t){e instanceof HTMLInputElement&&e.type==="checkbox"?e.checked=!!t:e.value=String(t),e.dispatchEvent(new Event("input",{bubbles:!0})),e.dispatchEvent(new Event("change",{bubbles:!0}))}var yc="0.1.0";export{Ut as AgUiChat,Mt as AgUiClient,Pt as ClientToolRegistry,cn as ELEMENT_TAG,to as MAX_TOOL_ROUNDS,Te as MESSAGE_ROLE,eo as SUBMIT_EVENT,Lt as SessionStorageStore,q as TOOL_CALL_STATUS,Dt as ToolCallCard,yc as VERSION,Ot as X_DESTRUCTIVE_KEY,Rt as X_NAVIGATES_KEY,gc as clickElement,ao as createHttpAgent,uo as createPageMapContext,co as createRouteTools,fo as createStateHookTools,mc as defineAgUiChat,hc as fillField,go as focusWithFlash,ho as highlightThenClick,io as isDestructive,lo as isNavigates,ro as requestConfirmation,dn as scrollIntoCenterView,vc as setControlValue,mo as typeInto};
+`;var la={[q.PENDING]:"running\u2026",[q.DONE]:"\u2713 done",[q.ERROR]:"\u26A0 error",[q.DECLINED]:"\u2298 declined"},fc={[q.DONE]:"Result",[q.ERROR]:"Error",[q.DECLINED]:"Declined"},Dt=class{element;#e;constructor(t,r){this.element=document.createElement("div"),this.element.className="tool-call",this.element.setAttribute("data-tool-name",t),this.element.setAttribute("data-status",q.PENDING);let n=document.createElement("div");n.className="tool-call-head";let s=document.createElement("span");s.className="tool-call-name",s.textContent=`\u{1F527} ${t}`,this.#e=document.createElement("span"),this.#e.className="tool-call-status",this.#e.textContent=la[q.PENDING],n.append(s,this.#e);let o=document.createElement("pre");o.className="tool-call-args",o.textContent=JSON.stringify(r,null,2),this.element.append(n,o)}settle(t,r){this.element.setAttribute("data-status",t),this.#e.textContent=la[t];let n=document.createElement("button");n.type="button",n.className="tool-call-toggle",n.setAttribute("aria-expanded","false"),n.textContent=fc[t];let s=document.createElement("pre");s.className="tool-call-result",s.textContent=r,s.hidden=!0,n.addEventListener("click",()=>{let o=s.hidden;s.hidden=!o,n.setAttribute("aria-expanded",String(o))}),this.element.append(n,s)}};var Ut=class extends HTMLElement{agentFactory=ao;headers={};autoConfirm=!1;getTools=()=>[...this.#d().map(t=>({name:t.name,description:t.description,parameters:t.parameters})),...this.#e.tools()];getContext=()=>uo(this.getPageMap,this.autoInjectPageMap);routeMap=[];navigate=null;getPageMap=null;autoInjectPageMap=!0;conversationStore=new Lt;navigationResult=()=>({navigated:!0,url:window.location.href});#e=new Pt;#i=new Map;#l;#o;#t;#r;#n;#u=null;#s=null;#a="";#c=[];constructor(){super(),this.#l=this.attachShadow({mode:"open"}),this.#o=document.createElement("div"),this.#t=document.createElement("div"),this.#r=document.createElement("textarea"),this.#n=document.createElement("button")}registerTool(t){this.#e.register(t)}registerStateHook(t){for(let r of fo(t))this.#e.register(r)}#d(){return this.routeMap.length===0?[]:co(()=>this.routeMap,()=>this.navigate)}#g(t){let r=this.#d().find(n=>n.name===t);return r!==void 0?r:this.#e.has(t)?this.#e.get(t):null}get endpoint(){return this.getAttribute("endpoint")??""}connectedCallback(){this.#_(),this.#a=this.conversationStore.threadId(),this.#v()}async#v(){let t=await this.conversationStore.loadMessages(this.#a);if(t!==null){this.#c=t;for(let n of t)this.#y(n)}let r=this.conversationStore.loadCheckpoint(this.#a);r!==null&&await this.#E(r)}#y(t){typeof t.content!="string"||t.content===""||(t.role===Te.USER?this.appendMessage(Te.USER,t.content):t.role===Te.ASSISTANT&&this.appendMessage(Te.ASSISTANT,t.content))}async#E(t){this.conversationStore.saveCheckpoint(this.#a,null);let r=this.#p();r.addToolResult(t.toolCallId,JSON.stringify(this.navigationResult(t))),await r.resume()}appendMessage(t,r){let n=document.createElement("div");return n.className=`message message--${t}`,n.textContent=r,this.#t.appendChild(n),this.#t.scrollTop=this.#t.scrollHeight,n}#_(){let t=document.createElement("style");t.textContent=ia,this.#o.className="chat";let r=document.createElement("div");r.className="header",r.textContent=this.getAttribute("title-text")??"Assistant",this.#t.className="messages";let n=document.createElement("div");n.className="input-row",this.#r.className="input",this.#r.rows=2,this.#r.placeholder="Ask anything\u2026",this.#r.addEventListener("keydown",s=>this.#x(s)),this.#n.className="send",this.#n.type="button",this.#n.textContent="Send",this.#n.addEventListener("click",()=>{this.#f()}),n.append(this.#r,this.#n),this.#o.append(r,this.#t,n),this.#l.append(t,this.#o)}#x(t){t.key==="Enter"&&!t.shiftKey&&(t.preventDefault(),this.#f())}async#f(){let t=this.#r.value.trim();t!==""&&(this.appendMessage(Te.USER,t),this.#r.value="",this.dispatchEvent(new CustomEvent(eo,{detail:{content:t},bubbles:!0,composed:!0})),await this.#b(t))}async#b(t){this.endpoint!==""&&await this.#p().send(t)}#p(){if(this.#u===null){let t=this.agentFactory({endpoint:this.endpoint,headers:this.headers,threadId:this.#a,initialMessages:this.#c});this.#u=new Mt({agent:t,handlers:this.#T(),getTools:()=>this.getTools(),getContext:()=>this.getContext(),executeTool:r=>this.#S(r),onPersist:r=>this.conversationStore.saveMessages(this.#a,r)})}return this.#u}async#S(t){let r=this.#h(t);this.#i.delete(t.id);let n=this.#g(t.name);if(n===null)return r.settle(q.DONE,"Executed on the server."),null;if(io(n.parameters)&&!this.autoConfirm&&!await ro(this.#o,{toolName:t.name,args:t.args})){let a="User declined the action.";return r.settle(q.DECLINED,a),{content:a}}let s=lo(n.parameters)&&this.navigate===null;s&&this.conversationStore.saveCheckpoint(this.#a,{toolCallId:t.id});try{let o=await n.handler(t.args);if(s)return r.settle(q.DONE,"Navigating\u2026"),{content:"",halt:!0};let a=JSON.stringify(o??null);return r.settle(q.DONE,a),{content:a}}catch(o){s&&this.conversationStore.saveCheckpoint(this.#a,null);let a=o instanceof Error?o.message:String(o);return r.settle(q.ERROR,a),{content:`Error: ${a}`,error:a}}}#T(){return{onRunStart:()=>{this.#n.disabled=!0},onTextDelta:t=>{this.#m(t)},onTextEnd:t=>{this.#m(t),this.#s=null},onToolCall:t=>{this.#h(t)},onRunEnd:()=>{this.#n.disabled=!1,this.#s=null},onError:t=>{this.appendMessage(Te.ASSISTANT,`\u26A0\uFE0F ${t}`),this.#n.disabled=!1,this.#s=null}}}#m(t){this.#s===null&&(this.#s=this.appendMessage(Te.ASSISTANT,"")),this.#s.textContent=t,this.#t.scrollTop=this.#t.scrollHeight}#h(t){let r=this.#i.get(t.id);if(r!==void 0)return r;let n=new Dt(t.name,t.args);return this.#i.set(t.id,n),this.#t.appendChild(n.element),this.#t.scrollTop=this.#t.scrollHeight,n}};var pc="#4f46e5";function po(e){return new Promise(t=>{setTimeout(t,e)})}async function mo(e,t,r={}){let n=r.charDelayMs??35;e.value="",e.dispatchEvent(new Event("input",{bubbles:!0}));for(let s of t)e.value+=s,e.dispatchEvent(new Event("input",{bubbles:!0})),n>0&&await po(n);e.dispatchEvent(new Event("change",{bubbles:!0}))}async function ho(e,t={}){let r=t.highlightMs??280,n=e.style.outline,s=e.style.outlineOffset;e.style.outline=`2px solid ${pc}`,e.style.outlineOffset="2px",await po(r),e.style.outline=n,e.style.outlineOffset=s,e.click()}function dn(e){e.scrollIntoView({block:"center",inline:"nearest",behavior:"smooth"})}async function go(e,t={}){let r=t.flashMs??200;e.focus();let n=e.style.boxShadow;e.style.boxShadow="0 0 0 3px rgba(79, 70, 229, 0.4)",await po(r),e.style.boxShadow=n}function mc(){customElements.get(cn)===void 0&&customElements.define(cn,Ut)}async function hc(e,t,r={}){dn(e),await go(e,{flashMs:r.flashMs??0}),await mo(e,t,r)}async function gc(e,t={}){dn(e),await ho(e,t)}function vc(e,t){e instanceof HTMLInputElement&&e.type==="checkbox"?e.checked=!!t:e.value=String(t),e.dispatchEvent(new Event("input",{bubbles:!0})),e.dispatchEvent(new Event("change",{bubbles:!0}))}var yc="0.1.1";export{Ut as AgUiChat,Mt as AgUiClient,Pt as ClientToolRegistry,cn as ELEMENT_TAG,to as MAX_TOOL_ROUNDS,Te as MESSAGE_ROLE,eo as SUBMIT_EVENT,Lt as SessionStorageStore,q as TOOL_CALL_STATUS,Dt as ToolCallCard,yc as VERSION,Ot as X_DESTRUCTIVE_KEY,Rt as X_NAVIGATES_KEY,gc as clickElement,ao as createHttpAgent,uo as createPageMapContext,co as createRouteTools,fo as createStateHookTools,mc as defineAgUiChat,hc as fillField,go as focusWithFlash,ho as highlightThenClick,io as isDestructive,lo as isNavigates,ro as requestConfirmation,dn as scrollIntoCenterView,vc as setControlValue,mo as typeInto};
 /*! Bundled license information:
 
 fast-json-patch/module/helpers.mjs: