comisai 1.0.24 → 1.0.25

package/node_modules/@comis/web/dist/assets/{context-dag-browser-BwiaF5tf.js → context-dag-browser-BHm00mJD.js}

@@ -1,107 +1,4 @@
-import{a as h,b as s,A as n,s as v,f as m,i as u,n as g,r,t as _}from"./index-CEcM1R_C.js";import"./ic-empty-state-60l2ePhd.js";import"./ic-search-input-CSOxY9g7.js";import"./ic-tag-CPPUnDLF.js";import"./ic-relative-time-3FqpjeAI.js";import"./ic-detail-panel-BF83r-if.js";import"./ic-icon-xeGTVhVG.js";var f=Object.defineProperty,x=Object.getOwnPropertyDescriptor,i=(e,t,l,d)=>{for(var o=d>1?void 0:d?x(t,l):t,c=e.length-1,p;c>=0;c--)(p=e[c])&&(o=(d?p(t,l,o):p(o))||o);return d&&o&&f(t,l,o),o};let a=class extends h{constructor(){super(...arguments),this.rpcClient=null,this._loadState="loading",this._conversations=[],this._selectedConvId=null,this._treeNodes=[],this._treeMessageCount=0,this._expanded=new Set,this._searchQuery="",this._searchResults=[],this._inspectedNode=null,this._detailOpen=!1,this._treeLoading=!1,this._searchLoading=!1,this._errorMsg="",this._searchTimeout=null,this._rpcClientInitialized=!1}updated(e){e.has("rpcClient")&&this.rpcClient&&!this._rpcClientInitialized&&(this._rpcClientInitialized=!0,this._loadConversations())}async _loadConversations(){if(this.rpcClient){this._loadState="loading";try{const e=await this.rpcClient.call("context.conversations",{limit:100,offset:0});this._conversations=e.conversations,this._loadState="loaded"}catch(e){this._errorMsg=e.message,this._loadState="error"}}}async _selectConversation(e){this._selectedConvId!==e&&(this._selectedConvId=e,this._treeNodes=[],this._searchQuery="",this._searchResults=[],this._expanded=new Set,this._inspectedNode=null,this._detailOpen=!1,await this._loadTree(e))}async _loadTree(e){if(this.rpcClient){this._treeLoading=!0;try{const t=await this.rpcClient.call("context.tree",{conversation_id:e});this._treeNodes=t.nodes,this._treeMessageCount=t.messageCount}catch(t){this._errorMsg=t.message}finally{this._treeLoading=!1}}}_toggleNode(e){const t=new Set(this._expanded);t.has(e)?t.delete(e):t.add(e),this._expanded=t}async _inspectNode(e){if(this.rpcClient)try{const t=await this.rpcClient.call("context.inspect",{id:e});this._inspectedNode=t,this._detailOpen=!0}catch(t){this._errorMsg=t.message}}_handleSearch(e){const t=e.detail;if(this._searchQuery=t,this._searchTimeout&&clearTimeout(this._searchTimeout),!t){this._searchResults=[];return}this._searchTimeout=setTimeout(()=>this._executeSearch(t),300)}async _executeSearch(e){if(!(!this.rpcClient||!this._selectedConvId)){this._searchLoading=!0;try{const t=await this.rpcClient.call("context.searchByConversation",{conversation_id:this._selectedConvId,query:e,limit:50});this._searchResults=t.results}catch(t){this._errorMsg=t.message}finally{this._searchLoading=!1}}}_handleSearchResultClick(e){e.type==="summary"?this._inspectNode(e.id):(this._inspectedNode={type:"message",content:e.content},this._detailOpen=!0)}_renderConversationList(){return this._conversations.length===0?s`<ic-empty-state message="No conversations found"></ic-empty-state>`:s`
-      <div class="conv-panel-title">Conversations</div>
-      ${this._conversations.map(e=>s`
-        <button
-          class="conv-card ${this._selectedConvId===e.conversation_id?"selected":""}"
-          @click=${()=>this._selectConversation(e.conversation_id)}
-        >
-          <div class="conv-agent">${e.agent_id}</div>
-          <div class="conv-session">${e.session_key.length>40?e.session_key.slice(0,40)+"...":e.session_key}</div>
-          ${e.title?s`<div class="conv-session">${e.title}</div>`:n}
-          <div class="conv-meta">
-            <ic-relative-time .timestamp=${new Date(e.updated_at).getTime()}></ic-relative-time>
-          </div>
-        </button>
-      `)}
-    `}_getRootNodes(){return this._treeNodes.filter(e=>e.parentIds.length===0||e.depth===0)}_renderNode(e){const t=e.childIds.length>0,l=this._expanded.has(e.summaryId),d=this._inspectedNode?.summaryId===e.summaryId,o=t&&l?this._treeNodes.filter(c=>e.childIds.includes(c.summaryId)):[];return s`
-      <div style="padding-left: ${e.depth*16}px">
-        <div
-          class="tree-node ${d?"inspected":""}"
-          @click=${()=>this._inspectNode(e.summaryId)}
-        >
-          <span
-            class="tree-chevron ${t?l?"expanded":"":"leaf"}"
-            @click=${c=>{c.stopPropagation(),t&&this._toggleNode(e.summaryId)}}
-          >${t?"▶":""}</span>
-          <div class="tree-content">
-            <div class="tree-node-header">
-              <ic-tag .label=${e.kind}></ic-tag>
-              <span class="tree-node-meta">d${e.depth} | ${e.tokenCount}t</span>
-            </div>
-            <div class="tree-preview">${e.contentPreview.slice(0,100)}</div>
-          </div>
-        </div>
-        ${o.map(c=>this._renderNode(c))}
-      </div>
-    `}_renderTree(){if(this._treeLoading)return s`<ic-loading></ic-loading>`;if(this._treeNodes.length===0)return s`<ic-empty-state message="No summaries in this conversation"></ic-empty-state>`;const e=this._getRootNodes();return s`${e.map(t=>this._renderNode(t))}`}_renderSearchResults(){return this._searchLoading?s`<ic-loading></ic-loading>`:this._searchResults.length===0?s`<ic-empty-state message="No results found"></ic-empty-state>`:s`
-      <div class="search-results">
-        ${this._searchResults.map(e=>s`
-          <div class="search-result" @click=${()=>this._handleSearchResultClick(e)}>
-            <ic-tag .label=${e.type}></ic-tag>
-            <div class="search-result-content">${e.content.slice(0,150)}</div>
-            ${e.rank!=null?s`<span class="search-rank">${e.rank.toFixed(2)}</span>`:n}
-          </div>
-        `)}
-      </div>
-    `}_renderDetailPanel(){if(!this._inspectedNode)return n;const e=this._inspectedNode;return s`
-      <ic-detail-panel
-        ?open=${this._detailOpen}
-        panelTitle="${e.type==="summary"?"Summary Detail":"Message Detail"}"
-        @close=${()=>{this._detailOpen=!1}}
-      >
-        <div class="detail-section">
-          <div class="detail-label">Content</div>
-          <div class="detail-content">${e.content}</div>
-        </div>
-
-        ${e.type==="summary"?s`
-          <div class="detail-section">
-            <div class="detail-label">Metadata</div>
-            <div class="detail-meta-grid">
-              ${e.summaryId?s`<span class="detail-meta-key">ID</span><span class="detail-meta-val">${e.summaryId}</span>`:n}
-              ${e.kind?s`<span class="detail-meta-key">Kind</span><span class="detail-meta-val">${e.kind}</span>`:n}
-              ${e.depth!=null?s`<span class="detail-meta-key">Depth</span><span class="detail-meta-val">${e.depth}</span>`:n}
-              ${e.tokenCount!=null?s`<span class="detail-meta-key">Tokens</span><span class="detail-meta-val">${e.tokenCount}</span>`:n}
-              ${e.sourceMessageCount!=null?s`<span class="detail-meta-key">Source Messages</span><span class="detail-meta-val">${e.sourceMessageCount}</span>`:n}
-              ${e.parentIds?s`<span class="detail-meta-key">Parents</span><span class="detail-meta-val">${e.parentIds.length>0?e.parentIds.join(", "):"none"}</span>`:n}
-              ${e.childIds?s`<span class="detail-meta-key">Children</span><span class="detail-meta-val">${e.childIds.length>0?e.childIds.join(", "):"none"}</span>`:n}
-            </div>
-          </div>
-        `:n}
-      </ic-detail-panel>
-    `}render(){if(this._loadState==="loading")return s`<ic-loading></ic-loading>`;if(this._loadState==="error")return s`<div class="error-msg">Failed to load conversations: ${this._errorMsg}</div>`;const e=this._selectedConvId!==null;return s`
-      <div class="header-row">
-        <span class="header-title">Context DAG Browser</span>
-        <span class="header-stats">${this._conversations.length} conversations</span>
-      </div>
-
-      <div class="layout ${e?"":"no-tree"}">
-        <div class="conv-panel">
-          ${this._renderConversationList()}
-        </div>
-
-        ${e?s`
-          <div class="tree-panel">
-            <div class="tree-header">
-              <span class="tree-title">Summary Tree</span>
-              <span class="tree-msg-count">${this._treeMessageCount} messages</span>
-            </div>
-
-            <div class="search-section">
-              <ic-search-input
-                placeholder="Search messages & summaries..."
-                debounce="300"
-                @search=${this._handleSearch}
-              ></ic-search-input>
-            </div>
-
-            ${this._searchQuery?this._renderSearchResults():this._renderTree()}
-          </div>
-        `:n}
-      </div>
-
-      ${this._renderDetailPanel()}
-    `}};a.styles=[v,m,u`
+import{c as e,f as t,h as n,l as r,n as i,o as a,r as o,s,t as c,u as l}from"./decorate-BvWYovGE.js";import"./index-FLPhHz8p.js";import"./ic-tag-CvMVQFRR.js";import"./ic-relative-time-B3UAnTqg.js";import"./ic-search-input-B02AGw1i.js";import"./ic-empty-state-CM3Wbj2f.js";import"./ic-detail-panel-DiCe4hLr.js";var u=class extends r{constructor(...e){super(...e),this.rpcClient=null,this._loadState=`loading`,this._conversations=[],this._selectedConvId=null,this._treeNodes=[],this._treeMessageCount=0,this._expanded=new Set,this._searchQuery=``,this._searchResults=[],this._inspectedNode=null,this._detailOpen=!1,this._treeLoading=!1,this._searchLoading=!1,this._errorMsg=``,this._searchTimeout=null,this._rpcClientInitialized=!1}static{this.styles=[o,i,n`
       :host {
         display: block;
       }
@@ -390,4 +287,107 @@ import{a as h,b as s,A as n,s as v,f as m,i as u,n as g,r,t as _}from"./index-CE
         font-size: var(--ic-text-sm);
         padding: var(--ic-space-md);
       }
-    `];i([g({attribute:!1})],a.prototype,"rpcClient",2);i([r()],a.prototype,"_loadState",2);i([r()],a.prototype,"_conversations",2);i([r()],a.prototype,"_selectedConvId",2);i([r()],a.prototype,"_treeNodes",2);i([r()],a.prototype,"_treeMessageCount",2);i([r()],a.prototype,"_expanded",2);i([r()],a.prototype,"_searchQuery",2);i([r()],a.prototype,"_searchResults",2);i([r()],a.prototype,"_inspectedNode",2);i([r()],a.prototype,"_detailOpen",2);i([r()],a.prototype,"_treeLoading",2);i([r()],a.prototype,"_searchLoading",2);i([r()],a.prototype,"_errorMsg",2);a=i([_("ic-context-dag-browser")],a);export{a as IcContextDagBrowser};
+    `]}updated(e){e.has(`rpcClient`)&&this.rpcClient&&!this._rpcClientInitialized&&(this._rpcClientInitialized=!0,this._loadConversations())}async _loadConversations(){if(this.rpcClient){this._loadState=`loading`;try{let e=await this.rpcClient.call(`context.conversations`,{limit:100,offset:0});this._conversations=e.conversations,this._loadState=`loaded`}catch(e){this._errorMsg=e.message,this._loadState=`error`}}}async _selectConversation(e){this._selectedConvId!==e&&(this._selectedConvId=e,this._treeNodes=[],this._searchQuery=``,this._searchResults=[],this._expanded=new Set,this._inspectedNode=null,this._detailOpen=!1,await this._loadTree(e))}async _loadTree(e){if(this.rpcClient){this._treeLoading=!0;try{let t=await this.rpcClient.call(`context.tree`,{conversation_id:e});this._treeNodes=t.nodes,this._treeMessageCount=t.messageCount}catch(e){this._errorMsg=e.message}finally{this._treeLoading=!1}}}_toggleNode(e){let t=new Set(this._expanded);t.has(e)?t.delete(e):t.add(e),this._expanded=t}async _inspectNode(e){if(this.rpcClient)try{let t=await this.rpcClient.call(`context.inspect`,{id:e});this._inspectedNode=t,this._detailOpen=!0}catch(e){this._errorMsg=e.message}}_handleSearch(e){let t=e.detail;if(this._searchQuery=t,this._searchTimeout&&clearTimeout(this._searchTimeout),!t){this._searchResults=[];return}this._searchTimeout=setTimeout(()=>this._executeSearch(t),300)}async _executeSearch(e){if(!(!this.rpcClient||!this._selectedConvId)){this._searchLoading=!0;try{let t=await this.rpcClient.call(`context.searchByConversation`,{conversation_id:this._selectedConvId,query:e,limit:50});this._searchResults=t.results}catch(e){this._errorMsg=e.message}finally{this._searchLoading=!1}}}_handleSearchResultClick(e){e.type===`summary`?this._inspectNode(e.id):(this._inspectedNode={type:`message`,content:e.content},this._detailOpen=!0)}_renderConversationList(){return this._conversations.length===0?t`<ic-empty-state message="No conversations found"></ic-empty-state>`:t`
+      <div class="conv-panel-title">Conversations</div>
+      ${this._conversations.map(e=>t`
+        <button
+          class="conv-card ${this._selectedConvId===e.conversation_id?`selected`:``}"
+          @click=${()=>this._selectConversation(e.conversation_id)}
+        >
+          <div class="conv-agent">${e.agent_id}</div>
+          <div class="conv-session">${e.session_key.length>40?e.session_key.slice(0,40)+`...`:e.session_key}</div>
+          ${e.title?t`<div class="conv-session">${e.title}</div>`:l}
+          <div class="conv-meta">
+            <ic-relative-time .timestamp=${new Date(e.updated_at).getTime()}></ic-relative-time>
+          </div>
+        </button>
+      `)}
+    `}_getRootNodes(){return this._treeNodes.filter(e=>e.parentIds.length===0||e.depth===0)}_renderNode(e){let n=e.childIds.length>0,r=this._expanded.has(e.summaryId),i=this._inspectedNode?.summaryId===e.summaryId,a=n&&r?this._treeNodes.filter(t=>e.childIds.includes(t.summaryId)):[];return t`
+      <div style="padding-left: ${e.depth*16}px">
+        <div
+          class="tree-node ${i?`inspected`:``}"
+          @click=${()=>this._inspectNode(e.summaryId)}
+        >
+          <span
+            class="tree-chevron ${n?r?`expanded`:``:`leaf`}"
+            @click=${t=>{t.stopPropagation(),n&&this._toggleNode(e.summaryId)}}
+          >${n?`▶`:``}</span>
+          <div class="tree-content">
+            <div class="tree-node-header">
+              <ic-tag .label=${e.kind}></ic-tag>
+              <span class="tree-node-meta">d${e.depth} | ${e.tokenCount}t</span>
+            </div>
+            <div class="tree-preview">${e.contentPreview.slice(0,100)}</div>
+          </div>
+        </div>
+        ${a.map(e=>this._renderNode(e))}
+      </div>
+    `}_renderTree(){return this._treeLoading?t`<ic-loading></ic-loading>`:this._treeNodes.length===0?t`<ic-empty-state message="No summaries in this conversation"></ic-empty-state>`:t`${this._getRootNodes().map(e=>this._renderNode(e))}`}_renderSearchResults(){return this._searchLoading?t`<ic-loading></ic-loading>`:this._searchResults.length===0?t`<ic-empty-state message="No results found"></ic-empty-state>`:t`
+      <div class="search-results">
+        ${this._searchResults.map(e=>t`
+          <div class="search-result" @click=${()=>this._handleSearchResultClick(e)}>
+            <ic-tag .label=${e.type}></ic-tag>
+            <div class="search-result-content">${e.content.slice(0,150)}</div>
+            ${e.rank==null?l:t`<span class="search-rank">${e.rank.toFixed(2)}</span>`}
+          </div>
+        `)}
+      </div>
+    `}_renderDetailPanel(){if(!this._inspectedNode)return l;let e=this._inspectedNode;return t`
+      <ic-detail-panel
+        ?open=${this._detailOpen}
+        panelTitle="${e.type===`summary`?`Summary Detail`:`Message Detail`}"
+        @close=${()=>{this._detailOpen=!1}}
+      >
+        <div class="detail-section">
+          <div class="detail-label">Content</div>
+          <div class="detail-content">${e.content}</div>
+        </div>
+
+        ${e.type===`summary`?t`
+          <div class="detail-section">
+            <div class="detail-label">Metadata</div>
+            <div class="detail-meta-grid">
+              ${e.summaryId?t`<span class="detail-meta-key">ID</span><span class="detail-meta-val">${e.summaryId}</span>`:l}
+              ${e.kind?t`<span class="detail-meta-key">Kind</span><span class="detail-meta-val">${e.kind}</span>`:l}
+              ${e.depth==null?l:t`<span class="detail-meta-key">Depth</span><span class="detail-meta-val">${e.depth}</span>`}
+              ${e.tokenCount==null?l:t`<span class="detail-meta-key">Tokens</span><span class="detail-meta-val">${e.tokenCount}</span>`}
+              ${e.sourceMessageCount==null?l:t`<span class="detail-meta-key">Source Messages</span><span class="detail-meta-val">${e.sourceMessageCount}</span>`}
+              ${e.parentIds?t`<span class="detail-meta-key">Parents</span><span class="detail-meta-val">${e.parentIds.length>0?e.parentIds.join(`, `):`none`}</span>`:l}
+              ${e.childIds?t`<span class="detail-meta-key">Children</span><span class="detail-meta-val">${e.childIds.length>0?e.childIds.join(`, `):`none`}</span>`:l}
+            </div>
+          </div>
+        `:l}
+      </ic-detail-panel>
+    `}render(){if(this._loadState===`loading`)return t`<ic-loading></ic-loading>`;if(this._loadState===`error`)return t`<div class="error-msg">Failed to load conversations: ${this._errorMsg}</div>`;let e=this._selectedConvId!==null;return t`
+      <div class="header-row">
+        <span class="header-title">Context DAG Browser</span>
+        <span class="header-stats">${this._conversations.length} conversations</span>
+      </div>
+
+      <div class="layout ${e?``:`no-tree`}">
+        <div class="conv-panel">
+          ${this._renderConversationList()}
+        </div>
+
+        ${e?t`
+          <div class="tree-panel">
+            <div class="tree-header">
+              <span class="tree-title">Summary Tree</span>
+              <span class="tree-msg-count">${this._treeMessageCount} messages</span>
+            </div>
+
+            <div class="search-section">
+              <ic-search-input
+                placeholder="Search messages & summaries..."
+                debounce="300"
+                @search=${this._handleSearch}
+              ></ic-search-input>
+            </div>
+
+            ${this._searchQuery?this._renderSearchResults():this._renderTree()}
+          </div>
+        `:l}
+      </div>
+
+      ${this._renderDetailPanel()}
+    `}};c([s({attribute:!1})],u.prototype,`rpcClient`,void 0),c([a()],u.prototype,`_loadState`,void 0),c([a()],u.prototype,`_conversations`,void 0),c([a()],u.prototype,`_selectedConvId`,void 0),c([a()],u.prototype,`_treeNodes`,void 0),c([a()],u.prototype,`_treeMessageCount`,void 0),c([a()],u.prototype,`_expanded`,void 0),c([a()],u.prototype,`_searchQuery`,void 0),c([a()],u.prototype,`_searchResults`,void 0),c([a()],u.prototype,`_inspectedNode`,void 0),c([a()],u.prototype,`_detailOpen`,void 0),c([a()],u.prototype,`_treeLoading`,void 0),c([a()],u.prototype,`_searchLoading`,void 0),c([a()],u.prototype,`_errorMsg`,void 0),u=c([e(`ic-context-dag-browser`)],u);export{u as IcContextDagBrowser};

package/node_modules/@comis/web/dist/assets/{context-engine-BZ5Am6hA.js → context-engine-BENY3pWE.js}

@@ -1,28 +1,4 @@
-import{s as m,i as h,n as v,a as f,b as r,A as g,t as _,S as b,f as x,r as d}from"./index-CEcM1R_C.js";import"./ic-budget-segment-bar-BtJ6x5mN.js";import"./ic-layer-waterfall-COvEYMg5.js";import"./ic-relative-time-3FqpjeAI.js";import"./ic-empty-state-60l2ePhd.js";import"./ic-icon-xeGTVhVG.js";var y=Object.defineProperty,w=Object.getOwnPropertyDescriptor,u=(e,t,i,s)=>{for(var a=s>1?void 0:s?w(t,i):t,n=e.length-1,c;n>=0;n--)(c=e[n])&&(a=(s?c(t,i,a):c(a))||a);return s&&a&&y(t,i,a),a};const $={file_read:"var(--ic-accent)",exec:"var(--ic-success)",web:"var(--ic-info, #3b82f6)",image:"var(--ic-warning)",error:"var(--ic-error)"},C="var(--ic-text-dim)";let p=class extends f{constructor(){super(...arguments),this.categories={},this.showLegend=!0}_getColor(e){return $[e]??C}_getEntries(){return Object.entries(this.categories).filter(([,e])=>e>0).map(([e,t])=>({name:e,count:t,color:this._getColor(e)}))}render(){const e=this._getEntries(),t=e.reduce((i,s)=>i+s.count,0);return t===0||e.length===0?r`<div class="empty">No evictions</div>`:r`
-      <div class="total-label">${t} eviction${t===1?"":"s"}</div>
-      <div class="bar" role="img" aria-label="Eviction breakdown">
-        ${e.map(i=>{const s=i.count/t*100;return r`
-            <div
-              class="segment"
-              style="width: ${s}%; background: ${i.color};"
-              title="${i.name}: ${i.count} evictions (${s.toFixed(1)}%)"
-            ></div>
-          `})}
-      </div>
-      ${this.showLegend?r`
-            <div class="legend">
-              ${e.map(i=>r`
-                  <span class="legend-item">
-                    <span
-                      class="legend-dot"
-                      style="background: ${i.color};"
-                    ></span>
-                    ${i.name}
-                  </span>
-                `)}
-            </div>
-          `:g}
-    `}};p.styles=[m,h`
+import{c as e,f as t,h as n,l as r,n as i,o as a,r as o,s,t as c,u as l}from"./decorate-BvWYovGE.js";import{i as u}from"./index-FLPhHz8p.js";import"./ic-relative-time-B3UAnTqg.js";import"./ic-empty-state-CM3Wbj2f.js";import"./ic-budget-segment-bar-zLsMzjDO.js";import"./ic-layer-waterfall-WkaFyu-l.js";var d={file_read:`var(--ic-accent)`,exec:`var(--ic-success)`,web:`var(--ic-info, #3b82f6)`,image:`var(--ic-warning)`,error:`var(--ic-error)`},f=`var(--ic-text-dim)`,p=class extends r{constructor(...e){super(...e),this.categories={},this.showLegend=!0}static{this.styles=[o,n`
       :host {
         display: block;
       }
@@ -73,118 +49,31 @@ import{s as m,i as h,n as v,a as f,b as r,A as g,t as _,S as b,f as x,r as d}fro
         color: var(--ic-text-dim);
         font-style: italic;
       }
-    `];u([v({attribute:!1})],p.prototype,"categories",2);u([v({type:Boolean,attribute:"show-legend"})],p.prototype,"showLegend",2);p=u([_("ic-eviction-chart")],p);var k=Object.defineProperty,D=Object.getOwnPropertyDescriptor,l=(e,t,i,s)=>{for(var a=s>1?void 0:s?D(t,i):t,n=e.length-1,c;n>=0;n--)(c=e[n])&&(a=(s?c(t,i,a):c(a))||a);return s&&a&&k(t,i,a),a};const P=3e4;let o=class extends f{constructor(){super(...arguments),this.rpcClient=null,this.eventDispatcher=null,this._sse=null,this._reloadDebounce=null,this._loadState="loading",this._pipelines=[],this._dagCompactions=[],this._selectedPipeline=null,this._agentFilter="",this._agents=[],this._refreshInterval=null,this._rpcStatusUnsub=null}connectedCallback(){super.connectedCallback(),this._initSse()}_initSse(){!this.eventDispatcher||this._sse||(this._sse=new b(this,this.eventDispatcher,{"observability:token_usage":()=>{this._scheduleReload()}}))}_scheduleReload(e=300){this._reloadDebounce!==null&&clearTimeout(this._reloadDebounce),this._reloadDebounce=setTimeout(()=>{this._reloadDebounce=null,this._loadData()},e)}disconnectedCallback(){super.disconnectedCallback(),this._reloadDebounce!==null&&(clearTimeout(this._reloadDebounce),this._reloadDebounce=null),this._refreshInterval!==null&&(clearInterval(this._refreshInterval),this._refreshInterval=null),this._rpcStatusUnsub?.(),this._rpcStatusUnsub=null}willUpdate(e){e.has("rpcClient")&&this.rpcClient&&this._tryLoad(),e.has("eventDispatcher")&&this.eventDispatcher&&!this._sse&&this._initSse()}_tryLoad(){if(!this.rpcClient){this._loadState="loaded";return}this._rpcStatusUnsub?.(),this.rpcClient.status==="connected"?this._startLoading():this._rpcStatusUnsub=this.rpcClient.onStatusChange(e=>{e==="connected"&&this._startLoading()})}_startLoading(){this._loadData(),this._refreshInterval===null&&(this._refreshInterval=setInterval(()=>{this._loadData()},P))}async _loadData(){if(!this.rpcClient||this.rpcClient.status!=="connected"){this._loadState="loaded";return}const e=this.rpcClient,t={};this._agentFilter&&(t.agentId=this._agentFilter);try{const i=await e.call("obs.context.pipeline",t);this._pipelines=Array.isArray(i)?i:[]}catch{this._pipelines=[]}!this._selectedPipeline&&this._pipelines.length>0&&(this._selectedPipeline=this._pipelines[0]),this._loadState="loaded",Promise.allSettled([e.call("obs.context.dag",t),e.call("agents.list")]).then(([i,s])=>{if(this._dagCompactions=i.status==="fulfilled"&&Array.isArray(i.value)?i.value:[],s.status==="fulfilled"){const a=s.value,n=Array.isArray(a)?a:Array.isArray(a.agents)?a.agents:[];this._agents=n.map(c=>typeof c=="string"?{id:c,name:c,provider:"",model:"",status:"active"}:c)}})}_onAgentFilter(e){this._agentFilter=e.target.value,this._selectedPipeline=null,this._loadData()}_onPipelineSelect(e){this._selectedPipeline=e}_formatTime(e){return new Date(e).toLocaleTimeString(void 0,{hour:"2-digit",minute:"2-digit",second:"2-digit"})}_formatNumber(e){return new Intl.NumberFormat("en-US").format(e)}_renderPipelineMetrics(){const e=this._pipelines.length>0?this._pipelines[0]:null;if(!e)return r`
-        <div class="section">
-          <div class="section-title">Pipeline Metrics</div>
-          <ic-empty-state
-            icon="activity"
-            message="No pipeline data available. Pipeline metrics appear after the context engine processes messages."
-          ></ic-empty-state>
-        </div>
-      `;const i=[{label:"System",tokens:Math.max(0,e.tokensLoaded-e.tokensEvicted-e.tokensMasked-e.tokensCompacted),color:"var(--ic-accent)"},{label:"Evicted",tokens:e.tokensEvicted,color:"var(--ic-error)"},{label:"Masked",tokens:e.tokensMasked,color:"var(--ic-warning)"},{label:"Compacted",tokens:e.tokensCompacted,color:"var(--ic-info, #3b82f6)"}].filter(n=>n.tokens>0),s=this._pipelines.filter(n=>n.cacheHitTokens>0).length,a=this._pipelines.length>0?Math.round(s/this._pipelines.length*100):0;return r`
-      <div class="section">
-        <div class="section-title">Pipeline Metrics</div>
-        <div class="card">
-          <div class="metrics-grid">
-            <div class="budget-bar-container">
-              <ic-budget-segment-bar .segments=${i}></ic-budget-segment-bar>
-            </div>
-            <ic-metric-gauge
-              .value=${a}
-              label="Cache Hit Rate"
-              size="sm"
-            ></ic-metric-gauge>
-            <ic-eviction-chart
-              .categories=${e.evictionCategories}
-            ></ic-eviction-chart>
-          </div>
-          <div class="stat-badges">
-            <div class="stat-badge">
-              Masked <span class="stat-value">${this._formatNumber(e.tokensMasked)}</span> tokens
-            </div>
-            <div class="stat-badge">
-              Duration <span class="stat-value">${e.durationMs}</span>ms
-            </div>
-            <div class="stat-badge">
-              Thinking removed <span class="stat-value">${e.thinkingBlocksRemoved}</span>
-            </div>
-            <div class="stat-badge">
-              Budget <span class="stat-value">${Math.round(e.budgetUtilization*100)}%</span>
-            </div>
-          </div>
-        </div>
-      </div>
-    `}_renderLayerWaterfall(){const e=this._pipelines.slice(0,10);return r`
-      <div class="section">
-        <div class="section-title">Layer Waterfall</div>
-        ${e.length===0?r`<ic-empty-state icon="layers" message="No pipeline executions to display"></ic-empty-state>`:r`
-              <div class="execution-list">
-                ${e.map(t=>r`
-                    <button
-                      class="execution-row ${this._selectedPipeline===t?"selected":""}"
-                      @click=${()=>this._onPipelineSelect(t)}
-                    >
-                      <span class="exec-time">${this._formatTime(t.timestamp)}</span>
-                      <span class="exec-agent">${t.agentId}</span>
-                      <span class="exec-duration">${t.durationMs}ms</span>
-                      <span class="exec-layers">${t.layerCount} layers</span>
-                    </button>
-                  `)}
-              </div>
-              ${this._selectedPipeline&&this._selectedPipeline.layers.length>0?r`
-                    <div class="card">
-                      <ic-layer-waterfall
-                        .layers=${this._selectedPipeline.layers}
-                        .totalDurationMs=${this._selectedPipeline.durationMs}
-                      ></ic-layer-waterfall>
-                    </div>
-                  `:g}
-            `}
+    `]}_getColor(e){return d[e]??f}_getEntries(){return Object.entries(this.categories).filter(([,e])=>e>0).map(([e,t])=>({name:e,count:t,color:this._getColor(e)}))}render(){let e=this._getEntries(),n=e.reduce((e,t)=>e+t.count,0);return n===0||e.length===0?t`<div class="empty">No evictions</div>`:t`
+      <div class="total-label">${n} eviction${n===1?``:`s`}</div>
+      <div class="bar" role="img" aria-label="Eviction breakdown">
+        ${e.map(e=>{let r=e.count/n*100;return t`
+            <div
+              class="segment"
+              style="width: ${r}%; background: ${e.color};"
+              title="${e.name}: ${e.count} evictions (${r.toFixed(1)}%)"
+            ></div>
+          `})}
       </div>
-    `}_renderDagPanel(){if(this._dagCompactions.length===0)return g;const e=this._dagCompactions.length,t=Math.round(this._dagCompactions.reduce((a,n)=>a+n.totalSummariesCreated,0)/e),i=Math.max(...this._dagCompactions.map(a=>a.maxDepthReached)),s=this._dagCompactions[0].durationMs;return r`
-      <div class="section">
-        <div class="section-title">DAG Compaction</div>
-        <div class="card">
-          <div class="dag-grid">
-            <div class="dag-stat">
-              <div class="dag-value">${e}</div>
-              <div class="dag-label">Total Compactions</div>
-            </div>
-            <div class="dag-stat">
-              <div class="dag-value">${t}</div>
-              <div class="dag-label">Avg Summaries</div>
-            </div>
-            <div class="dag-stat">
-              <div class="dag-value">${i}</div>
-              <div class="dag-label">Max Depth</div>
-            </div>
-            <div class="dag-stat">
-              <div class="dag-value">${s}ms</div>
-              <div class="dag-label">Latest Duration</div>
+      ${this.showLegend?t`
+            <div class="legend">
+              ${e.map(e=>t`
+                  <span class="legend-item">
+                    <span
+                      class="legend-dot"
+                      style="background: ${e.color};"
+                    ></span>
+                    ${e.name}
+                  </span>
+                `)}
             </div>
-          </div>
-        </div>
-      </div>
-    `}render(){return this._loadState==="loading"&&!this.rpcClient?r`<ic-skeleton-view variant="table"></ic-skeleton-view>`:this._loadState==="error"?r`
-        <div class="error-container">
-          <span class="error-message">Failed to load context engine data</span>
-          <button class="retry-btn" @click=${()=>this._tryLoad()}>Retry</button>
-        </div>
-      `:r`
-      <div class="context-engine-view">
-        <div class="filter-row">
-          ${this._renderAgentFilter()}
-        </div>
-        ${this._renderPipelineMetrics()}
-        ${this._renderLayerWaterfall()}
-        ${this._renderDagPanel()}
-      </div>
-    `}_renderAgentFilter(){return r`
-      <select class="filter-select" @change=${this._onAgentFilter}>
-        <option value="">All Agents</option>
-        ${this._agents.map(e=>r`<option value=${e.id}>${e.id}</option>`)}
-      </select>
-    `}};o.styles=[m,x,h`
+          `:l}
+    `}};c([s({attribute:!1})],p.prototype,`categories`,void 0),c([s({type:Boolean,attribute:`show-legend`})],p.prototype,`showLegend`,void 0),p=c([e(`ic-eviction-chart`)],p);var m=3e4,h=class extends r{constructor(...e){super(...e),this.rpcClient=null,this.eventDispatcher=null,this._sse=null,this._reloadDebounce=null,this._loadState=`loading`,this._pipelines=[],this._dagCompactions=[],this._selectedPipeline=null,this._agentFilter=``,this._agents=[],this._refreshInterval=null,this._rpcStatusUnsub=null}static{this.styles=[o,i,n`
       :host {
         display: block;
       }
@@ -390,4 +279,115 @@ import{s as m,i as h,n as v,a as f,b as r,A as g,t as _,S as b,f as x,r as d}fro
       .retry-btn:hover {
         background: var(--ic-surface-alt, #374151);
       }
-    `];l([v({attribute:!1})],o.prototype,"rpcClient",2);l([v({attribute:!1})],o.prototype,"eventDispatcher",2);l([d()],o.prototype,"_loadState",2);l([d()],o.prototype,"_pipelines",2);l([d()],o.prototype,"_dagCompactions",2);l([d()],o.prototype,"_selectedPipeline",2);l([d()],o.prototype,"_agentFilter",2);l([d()],o.prototype,"_agents",2);o=l([_("ic-context-engine-view")],o);export{o as IcContextEngineView};
+    `]}connectedCallback(){super.connectedCallback(),this._initSse()}_initSse(){!this.eventDispatcher||this._sse||(this._sse=new u(this,this.eventDispatcher,{"observability:token_usage":()=>{this._scheduleReload()}}))}_scheduleReload(e=300){this._reloadDebounce!==null&&clearTimeout(this._reloadDebounce),this._reloadDebounce=setTimeout(()=>{this._reloadDebounce=null,this._loadData()},e)}disconnectedCallback(){super.disconnectedCallback(),this._reloadDebounce!==null&&(clearTimeout(this._reloadDebounce),this._reloadDebounce=null),this._refreshInterval!==null&&(clearInterval(this._refreshInterval),this._refreshInterval=null),this._rpcStatusUnsub?.(),this._rpcStatusUnsub=null}willUpdate(e){e.has(`rpcClient`)&&this.rpcClient&&this._tryLoad(),e.has(`eventDispatcher`)&&this.eventDispatcher&&!this._sse&&this._initSse()}_tryLoad(){if(!this.rpcClient){this._loadState=`loaded`;return}this._rpcStatusUnsub?.(),this.rpcClient.status===`connected`?this._startLoading():this._rpcStatusUnsub=this.rpcClient.onStatusChange(e=>{e===`connected`&&this._startLoading()})}_startLoading(){this._loadData(),this._refreshInterval===null&&(this._refreshInterval=setInterval(()=>{this._loadData()},m))}async _loadData(){if(!this.rpcClient||this.rpcClient.status!==`connected`){this._loadState=`loaded`;return}let e=this.rpcClient,t={};this._agentFilter&&(t.agentId=this._agentFilter);try{let n=await e.call(`obs.context.pipeline`,t);this._pipelines=Array.isArray(n)?n:[]}catch{this._pipelines=[]}!this._selectedPipeline&&this._pipelines.length>0&&(this._selectedPipeline=this._pipelines[0]),this._loadState=`loaded`,Promise.allSettled([e.call(`obs.context.dag`,t),e.call(`agents.list`)]).then(([e,t])=>{if(this._dagCompactions=e.status===`fulfilled`&&Array.isArray(e.value)?e.value:[],t.status===`fulfilled`){let e=t.value,n=Array.isArray(e)?e:Array.isArray(e.agents)?e.agents:[];this._agents=n.map(e=>typeof e==`string`?{id:e,name:e,provider:``,model:``,status:`active`}:e)}})}_onAgentFilter(e){this._agentFilter=e.target.value,this._selectedPipeline=null,this._loadData()}_onPipelineSelect(e){this._selectedPipeline=e}_formatTime(e){return new Date(e).toLocaleTimeString(void 0,{hour:`2-digit`,minute:`2-digit`,second:`2-digit`})}_formatNumber(e){return new Intl.NumberFormat(`en-US`).format(e)}_renderPipelineMetrics(){let e=this._pipelines.length>0?this._pipelines[0]:null;if(!e)return t`
+        <div class="section">
+          <div class="section-title">Pipeline Metrics</div>
+          <ic-empty-state
+            icon="activity"
+            message="No pipeline data available. Pipeline metrics appear after the context engine processes messages."
+          ></ic-empty-state>
+        </div>
+      `;let n=[{label:`System`,tokens:Math.max(0,e.tokensLoaded-e.tokensEvicted-e.tokensMasked-e.tokensCompacted),color:`var(--ic-accent)`},{label:`Evicted`,tokens:e.tokensEvicted,color:`var(--ic-error)`},{label:`Masked`,tokens:e.tokensMasked,color:`var(--ic-warning)`},{label:`Compacted`,tokens:e.tokensCompacted,color:`var(--ic-info, #3b82f6)`}].filter(e=>e.tokens>0),r=this._pipelines.filter(e=>e.cacheHitTokens>0).length;return t`
+      <div class="section">
+        <div class="section-title">Pipeline Metrics</div>
+        <div class="card">
+          <div class="metrics-grid">
+            <div class="budget-bar-container">
+              <ic-budget-segment-bar .segments=${n}></ic-budget-segment-bar>
+            </div>
+            <ic-metric-gauge
+              .value=${this._pipelines.length>0?Math.round(r/this._pipelines.length*100):0}
+              label="Cache Hit Rate"
+              size="sm"
+            ></ic-metric-gauge>
+            <ic-eviction-chart
+              .categories=${e.evictionCategories}
+            ></ic-eviction-chart>
+          </div>
+          <div class="stat-badges">
+            <div class="stat-badge">
+              Masked <span class="stat-value">${this._formatNumber(e.tokensMasked)}</span> tokens
+            </div>
+            <div class="stat-badge">
+              Duration <span class="stat-value">${e.durationMs}</span>ms
+            </div>
+            <div class="stat-badge">
+              Thinking removed <span class="stat-value">${e.thinkingBlocksRemoved}</span>
+            </div>
+            <div class="stat-badge">
+              Budget <span class="stat-value">${Math.round(e.budgetUtilization*100)}%</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    `}_renderLayerWaterfall(){let e=this._pipelines.slice(0,10);return t`
+      <div class="section">
+        <div class="section-title">Layer Waterfall</div>
+        ${e.length===0?t`<ic-empty-state icon="layers" message="No pipeline executions to display"></ic-empty-state>`:t`
+              <div class="execution-list">
+                ${e.map(e=>t`
+                    <button
+                      class="execution-row ${this._selectedPipeline===e?`selected`:``}"
+                      @click=${()=>this._onPipelineSelect(e)}
+                    >
+                      <span class="exec-time">${this._formatTime(e.timestamp)}</span>
+                      <span class="exec-agent">${e.agentId}</span>
+                      <span class="exec-duration">${e.durationMs}ms</span>
+                      <span class="exec-layers">${e.layerCount} layers</span>
+                    </button>
+                  `)}
+              </div>
+              ${this._selectedPipeline&&this._selectedPipeline.layers.length>0?t`
+                    <div class="card">
+                      <ic-layer-waterfall
+                        .layers=${this._selectedPipeline.layers}
+                        .totalDurationMs=${this._selectedPipeline.durationMs}
+                      ></ic-layer-waterfall>
+                    </div>
+                  `:l}
+            `}
+      </div>
+    `}_renderDagPanel(){if(this._dagCompactions.length===0)return l;let e=this._dagCompactions.length;return t`
+      <div class="section">
+        <div class="section-title">DAG Compaction</div>
+        <div class="card">
+          <div class="dag-grid">
+            <div class="dag-stat">
+              <div class="dag-value">${e}</div>
+              <div class="dag-label">Total Compactions</div>
+            </div>
+            <div class="dag-stat">
+              <div class="dag-value">${Math.round(this._dagCompactions.reduce((e,t)=>e+t.totalSummariesCreated,0)/e)}</div>
+              <div class="dag-label">Avg Summaries</div>
+            </div>
+            <div class="dag-stat">
+              <div class="dag-value">${Math.max(...this._dagCompactions.map(e=>e.maxDepthReached))}</div>
+              <div class="dag-label">Max Depth</div>
+            </div>
+            <div class="dag-stat">
+              <div class="dag-value">${this._dagCompactions[0].durationMs}ms</div>
+              <div class="dag-label">Latest Duration</div>
+            </div>
+          </div>
+        </div>
+      </div>
+    `}render(){return this._loadState===`loading`&&!this.rpcClient?t`<ic-skeleton-view variant="table"></ic-skeleton-view>`:this._loadState===`error`?t`
+        <div class="error-container">
+          <span class="error-message">Failed to load context engine data</span>
+          <button class="retry-btn" @click=${()=>this._tryLoad()}>Retry</button>
+        </div>
+      `:t`
+      <div class="context-engine-view">
+        <div class="filter-row">
+          ${this._renderAgentFilter()}
+        </div>
+        ${this._renderPipelineMetrics()}
+        ${this._renderLayerWaterfall()}
+        ${this._renderDagPanel()}
+      </div>
+    `}_renderAgentFilter(){return t`
+      <select class="filter-select" @change=${this._onAgentFilter}>
+        <option value="">All Agents</option>
+        ${this._agents.map(e=>t`<option value=${e.id}>${e.id}</option>`)}
+      </select>
+    `}};c([s({attribute:!1})],h.prototype,`rpcClient`,void 0),c([s({attribute:!1})],h.prototype,`eventDispatcher`,void 0),c([a()],h.prototype,`_loadState`,void 0),c([a()],h.prototype,`_pipelines`,void 0),c([a()],h.prototype,`_dagCompactions`,void 0),c([a()],h.prototype,`_selectedPipeline`,void 0),c([a()],h.prototype,`_agentFilter`,void 0),c([a()],h.prototype,`_agents`,void 0),h=c([e(`ic-context-engine-view`)],h);export{h as IcContextEngineView};

package/node_modules/@comis/web/dist/assets/decorate-BvWYovGE.js

@@ -0,0 +1,38 @@
+var e=globalThis,t=e.ShadowRoot&&(e.ShadyCSS===void 0||e.ShadyCSS.nativeShadow)&&`adoptedStyleSheets`in Document.prototype&&`replace`in CSSStyleSheet.prototype,n=Symbol(),r=new WeakMap,i=class{constructor(e,t,r){if(this._$cssResult$=!0,r!==n)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=e,this.t=t}get styleSheet(){let e=this.o,n=this.t;if(t&&e===void 0){let t=n!==void 0&&n.length===1;t&&(e=r.get(n)),e===void 0&&((this.o=e=new CSSStyleSheet).replaceSync(this.cssText),t&&r.set(n,e))}return e}toString(){return this.cssText}},a=e=>new i(typeof e==`string`?e:e+``,void 0,n),o=(e,...t)=>new i(e.length===1?e[0]:t.reduce((t,n,r)=>t+(e=>{if(!0===e._$cssResult$)return e.cssText;if(typeof e==`number`)return e;throw Error(`Value passed to 'css' function must be a 'css' function result: `+e+`. Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.`)})(n)+e[r+1],e[0]),e,n),s=(n,r)=>{if(t)n.adoptedStyleSheets=r.map(e=>e instanceof CSSStyleSheet?e:e.styleSheet);else for(let t of r){let r=document.createElement(`style`),i=e.litNonce;i!==void 0&&r.setAttribute(`nonce`,i),r.textContent=t.cssText,n.appendChild(r)}},c=t?e=>e:e=>e instanceof CSSStyleSheet?(e=>{let t=``;for(let n of e.cssRules)t+=n.cssText;return a(t)})(e):e,{is:l,defineProperty:u,getOwnPropertyDescriptor:d,getOwnPropertyNames:ee,getOwnPropertySymbols:te,getPrototypeOf:ne}=Object,f=globalThis,p=f.trustedTypes,re=p?p.emptyScript:``,ie=f.reactiveElementPolyfillSupport,m=(e,t)=>e,h={toAttribute(e,t){switch(t){case Boolean:e=e?re:null;break;case Object:case Array:e=e==null?e:JSON.stringify(e)}return e},fromAttribute(e,t){let n=e;switch(t){case Boolean:n=e!==null;break;case Number:n=e===null?null:Number(e);break;case Object:case Array:try{n=JSON.parse(e)}catch{n=null}}return n}},g=(e,t)=>!l(e,t),_={attribute:!0,type:String,converter:h,reflect:!1,useDefault:!1,hasChanged:g};Symbol.metadata??=Symbol(`metadata`),f.litPropertyMetadata??=new WeakMap;var v=class extends HTMLElement{static addInitializer(e){this._$Ei(),(this.l??=[]).push(e)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(e,t=_){if(t.state&&(t.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(e)&&((t=Object.create(t)).wrapped=!0),this.elementProperties.set(e,t),!t.noAccessor){let n=Symbol(),r=this.getPropertyDescriptor(e,n,t);r!==void 0&&u(this.prototype,e,r)}}static getPropertyDescriptor(e,t,n){let{get:r,set:i}=d(this.prototype,e)??{get(){return this[t]},set(e){this[t]=e}};return{get:r,set(t){let a=r?.call(this);i?.call(this,t),this.requestUpdate(e,a,n)},configurable:!0,enumerable:!0}}static getPropertyOptions(e){return this.elementProperties.get(e)??_}static _$Ei(){if(this.hasOwnProperty(m(`elementProperties`)))return;let e=ne(this);e.finalize(),e.l!==void 0&&(this.l=[...e.l]),this.elementProperties=new Map(e.elementProperties)}static finalize(){if(this.hasOwnProperty(m(`finalized`)))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(m(`properties`))){let e=this.properties,t=[...ee(e),...te(e)];for(let n of t)this.createProperty(n,e[n])}let e=this[Symbol.metadata];if(e!==null){let t=litPropertyMetadata.get(e);if(t!==void 0)for(let[e,n]of t)this.elementProperties.set(e,n)}this._$Eh=new Map;for(let[e,t]of this.elementProperties){let n=this._$Eu(e,t);n!==void 0&&this._$Eh.set(n,e)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(e){let t=[];if(Array.isArray(e)){let n=new Set(e.flat(1/0).reverse());for(let e of n)t.unshift(c(e))}else e!==void 0&&t.push(c(e));return t}static _$Eu(e,t){let n=t.attribute;return!1===n?void 0:typeof n==`string`?n:typeof e==`string`?e.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise(e=>this.enableUpdating=e),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach(e=>e(this))}addController(e){(this._$EO??=new Set).add(e),this.renderRoot!==void 0&&this.isConnected&&e.hostConnected?.()}removeController(e){this._$EO?.delete(e)}_$E_(){let e=new Map,t=this.constructor.elementProperties;for(let n of t.keys())this.hasOwnProperty(n)&&(e.set(n,this[n]),delete this[n]);e.size>0&&(this._$Ep=e)}createRenderRoot(){let e=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return s(e,this.constructor.elementStyles),e}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach(e=>e.hostConnected?.())}enableUpdating(e){}disconnectedCallback(){this._$EO?.forEach(e=>e.hostDisconnected?.())}attributeChangedCallback(e,t,n){this._$AK(e,n)}_$ET(e,t){let n=this.constructor.elementProperties.get(e),r=this.constructor._$Eu(e,n);if(r!==void 0&&!0===n.reflect){let i=(n.converter?.toAttribute===void 0?h:n.converter).toAttribute(t,n.type);this._$Em=e,i==null?this.removeAttribute(r):this.setAttribute(r,i),this._$Em=null}}_$AK(e,t){let n=this.constructor,r=n._$Eh.get(e);if(r!==void 0&&this._$Em!==r){let e=n.getPropertyOptions(r),i=typeof e.converter==`function`?{fromAttribute:e.converter}:e.converter?.fromAttribute===void 0?h:e.converter;this._$Em=r;let a=i.fromAttribute(t,e.type);this[r]=a??this._$Ej?.get(r)??a,this._$Em=null}}requestUpdate(e,t,n,r=!1,i){if(e!==void 0){let a=this.constructor;if(!1===r&&(i=this[e]),n??=a.getPropertyOptions(e),!((n.hasChanged??g)(i,t)||n.useDefault&&n.reflect&&i===this._$Ej?.get(e)&&!this.hasAttribute(a._$Eu(e,n))))return;this.C(e,t,n)}!1===this.isUpdatePending&&(this._$ES=this._$EP())}C(e,t,{useDefault:n,reflect:r,wrapped:i},a){n&&!(this._$Ej??=new Map).has(e)&&(this._$Ej.set(e,a??t??this[e]),!0!==i||a!==void 0)||(this._$AL.has(e)||(this.hasUpdated||n||(t=void 0),this._$AL.set(e,t)),!0===r&&this._$Em!==e&&(this._$Eq??=new Set).add(e))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(e){Promise.reject(e)}let e=this.scheduleUpdate();return e!=null&&await e,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(let[e,t]of this._$Ep)this[e]=t;this._$Ep=void 0}let e=this.constructor.elementProperties;if(e.size>0)for(let[t,n]of e){let{wrapped:e}=n,r=this[t];!0!==e||this._$AL.has(t)||r===void 0||this.C(t,void 0,n,r)}}let e=!1,t=this._$AL;try{e=this.shouldUpdate(t),e?(this.willUpdate(t),this._$EO?.forEach(e=>e.hostUpdate?.()),this.update(t)):this._$EM()}catch(t){throw e=!1,this._$EM(),t}e&&this._$AE(t)}willUpdate(e){}_$AE(e){this._$EO?.forEach(e=>e.hostUpdated?.()),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(e)),this.updated(e)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(e){return!0}update(e){this._$Eq&&=this._$Eq.forEach(e=>this._$ET(e,this[e])),this._$EM()}updated(e){}firstUpdated(e){}};v.elementStyles=[],v.shadowRootOptions={mode:`open`},v[m(`elementProperties`)]=new Map,v[m(`finalized`)]=new Map,ie?.({ReactiveElement:v}),(f.reactiveElementVersions??=[]).push(`2.1.2`);var y=globalThis,b=e=>e,x=y.trustedTypes,ae=x?x.createPolicy(`lit-html`,{createHTML:e=>e}):void 0,S=`$lit$`,C=`lit$${Math.random().toFixed(9).slice(2)}$`,w=`?`+C,oe=`<${w}>`,T=document,E=()=>T.createComment(``),D=e=>e===null||typeof e!=`object`&&typeof e!=`function`,O=Array.isArray,k=e=>O(e)||typeof e?.[Symbol.iterator]==`function`,A=`[ 	
+\f\r]`,j=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,M=/-->/g,N=/>/g,P=RegExp(`>|${A}(?:([^\\s"'>=/]+)(${A}*=${A}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,`g`),F=/'/g,I=/"/g,L=/^(?:script|style|textarea|title)$/i,R=e=>(t,...n)=>({_$litType$:e,strings:t,values:n}),se=R(1),ce=R(2),z=Symbol.for(`lit-noChange`),B=Symbol.for(`lit-nothing`),V=new WeakMap,H=T.createTreeWalker(T,129);function U(e,t){if(!O(e)||!e.hasOwnProperty(`raw`))throw Error(`invalid template strings array`);return ae===void 0?t:ae.createHTML(t)}var W=(e,t)=>{let n=e.length-1,r=[],i,a=t===2?`<svg>`:t===3?`<math>`:``,o=j;for(let t=0;t<n;t++){let n=e[t],s,c,l=-1,u=0;for(;u<n.length&&(o.lastIndex=u,c=o.exec(n),c!==null);)u=o.lastIndex,o===j?c[1]===`!--`?o=M:c[1]===void 0?c[2]===void 0?c[3]!==void 0&&(o=P):(L.test(c[2])&&(i=RegExp(`</`+c[2],`g`)),o=P):o=N:o===P?c[0]===`>`?(o=i??j,l=-1):c[1]===void 0?l=-2:(l=o.lastIndex-c[2].length,s=c[1],o=c[3]===void 0?P:c[3]===`"`?I:F):o===I||o===F?o=P:o===M||o===N?o=j:(o=P,i=void 0);let d=o===P&&e[t+1].startsWith(`/>`)?` `:``;a+=o===j?n+oe:l>=0?(r.push(s),n.slice(0,l)+S+n.slice(l)+C+d):n+C+(l===-2?t:d)}return[U(e,a+(e[n]||`<?>`)+(t===2?`</svg>`:t===3?`</math>`:``)),r]},G=class e{constructor({strings:t,_$litType$:n},r){let i;this.parts=[];let a=0,o=0,s=t.length-1,c=this.parts,[l,u]=W(t,n);if(this.el=e.createElement(l,r),H.currentNode=this.el.content,n===2||n===3){let e=this.el.content.firstChild;e.replaceWith(...e.childNodes)}for(;(i=H.nextNode())!==null&&c.length<s;){if(i.nodeType===1){if(i.hasAttributes())for(let e of i.getAttributeNames())if(e.endsWith(S)){let t=u[o++],n=i.getAttribute(e).split(C),r=/([.?@])?(.*)/.exec(t);c.push({type:1,index:a,name:r[2],strings:n,ctor:r[1]===`.`?le:r[1]===`?`?X:r[1]===`@`?ue:Y}),i.removeAttribute(e)}else e.startsWith(C)&&(c.push({type:6,index:a}),i.removeAttribute(e));if(L.test(i.tagName)){let e=i.textContent.split(C),t=e.length-1;if(t>0){i.textContent=x?x.emptyScript:``;for(let n=0;n<t;n++)i.append(e[n],E()),H.nextNode(),c.push({type:2,index:++a});i.append(e[t],E())}}}else if(i.nodeType===8)if(i.data===w)c.push({type:2,index:a});else{let e=-1;for(;(e=i.data.indexOf(C,e+1))!==-1;)c.push({type:7,index:a}),e+=C.length-1}a++}}static createElement(e,t){let n=T.createElement(`template`);return n.innerHTML=e,n}};function K(e,t,n=e,r){if(t===z)return t;let i=r===void 0?n._$Cl:n._$Co?.[r],a=D(t)?void 0:t._$litDirective$;return i?.constructor!==a&&(i?._$AO?.(!1),a===void 0?i=void 0:(i=new a(e),i._$AT(e,n,r)),r===void 0?n._$Cl=i:(n._$Co??=[])[r]=i),i!==void 0&&(t=K(e,i._$AS(e,t.values),i,r)),t}var q=class{constructor(e,t){this._$AV=[],this._$AN=void 0,this._$AD=e,this._$AM=t}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(e){let{el:{content:t},parts:n}=this._$AD,r=(e?.creationScope??T).importNode(t,!0);H.currentNode=r;let i=H.nextNode(),a=0,o=0,s=n[0];for(;s!==void 0;){if(a===s.index){let t;s.type===2?t=new J(i,i.nextSibling,this,e):s.type===1?t=new s.ctor(i,s.name,s.strings,this,e):s.type===6&&(t=new de(i,this,e)),this._$AV.push(t),s=n[++o]}a!==s?.index&&(i=H.nextNode(),a++)}return H.currentNode=T,r}p(e){let t=0;for(let n of this._$AV)n!==void 0&&(n.strings===void 0?n._$AI(e[t]):(n._$AI(e,n,t),t+=n.strings.length-2)),t++}},J=class e{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(e,t,n,r){this.type=2,this._$AH=B,this._$AN=void 0,this._$AA=e,this._$AB=t,this._$AM=n,this.options=r,this._$Cv=r?.isConnected??!0}get parentNode(){let e=this._$AA.parentNode,t=this._$AM;return t!==void 0&&e?.nodeType===11&&(e=t.parentNode),e}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(e,t=this){e=K(this,e,t),D(e)?e===B||e==null||e===``?(this._$AH!==B&&this._$AR(),this._$AH=B):e!==this._$AH&&e!==z&&this._(e):e._$litType$===void 0?e.nodeType===void 0?k(e)?this.k(e):this._(e):this.T(e):this.$(e)}O(e){return this._$AA.parentNode.insertBefore(e,this._$AB)}T(e){this._$AH!==e&&(this._$AR(),this._$AH=this.O(e))}_(e){this._$AH!==B&&D(this._$AH)?this._$AA.nextSibling.data=e:this.T(T.createTextNode(e)),this._$AH=e}$(e){let{values:t,_$litType$:n}=e,r=typeof n==`number`?this._$AC(e):(n.el===void 0&&(n.el=G.createElement(U(n.h,n.h[0]),this.options)),n);if(this._$AH?._$AD===r)this._$AH.p(t);else{let e=new q(r,this),n=e.u(this.options);e.p(t),this.T(n),this._$AH=e}}_$AC(e){let t=V.get(e.strings);return t===void 0&&V.set(e.strings,t=new G(e)),t}k(t){O(this._$AH)||(this._$AH=[],this._$AR());let n=this._$AH,r,i=0;for(let a of t)i===n.length?n.push(r=new e(this.O(E()),this.O(E()),this,this.options)):r=n[i],r._$AI(a),i++;i<n.length&&(this._$AR(r&&r._$AB.nextSibling,i),n.length=i)}_$AR(e=this._$AA.nextSibling,t){for(this._$AP?.(!1,!0,t);e!==this._$AB;){let t=b(e).nextSibling;b(e).remove(),e=t}}setConnected(e){this._$AM===void 0&&(this._$Cv=e,this._$AP?.(e))}},Y=class{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(e,t,n,r,i){this.type=1,this._$AH=B,this._$AN=void 0,this.element=e,this.name=t,this._$AM=r,this.options=i,n.length>2||n[0]!==``||n[1]!==``?(this._$AH=Array(n.length-1).fill(new String),this.strings=n):this._$AH=B}_$AI(e,t=this,n,r){let i=this.strings,a=!1;if(i===void 0)e=K(this,e,t,0),a=!D(e)||e!==this._$AH&&e!==z,a&&(this._$AH=e);else{let r=e,o,s;for(e=i[0],o=0;o<i.length-1;o++)s=K(this,r[n+o],t,o),s===z&&(s=this._$AH[o]),a||=!D(s)||s!==this._$AH[o],s===B?e=B:e!==B&&(e+=(s??``)+i[o+1]),this._$AH[o]=s}a&&!r&&this.j(e)}j(e){e===B?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,e??``)}},le=class extends Y{constructor(){super(...arguments),this.type=3}j(e){this.element[this.name]=e===B?void 0:e}},X=class extends Y{constructor(){super(...arguments),this.type=4}j(e){this.element.toggleAttribute(this.name,!!e&&e!==B)}},ue=class extends Y{constructor(e,t,n,r,i){super(e,t,n,r,i),this.type=5}_$AI(e,t=this){if((e=K(this,e,t,0)??B)===z)return;let n=this._$AH,r=e===B&&n!==B||e.capture!==n.capture||e.once!==n.once||e.passive!==n.passive,i=e!==B&&(n===B||r);r&&this.element.removeEventListener(this.name,this,n),i&&this.element.addEventListener(this.name,this,e),this._$AH=e}handleEvent(e){typeof this._$AH==`function`?this._$AH.call(this.options?.host??this.element,e):this._$AH.handleEvent(e)}},de=class{constructor(e,t,n){this.element=e,this.type=6,this._$AN=void 0,this._$AM=t,this.options=n}get _$AU(){return this._$AM._$AU}_$AI(e){K(this,e)}},fe={M:S,P:C,A:w,C:1,L:W,R:q,D:k,V:K,I:J,H:Y,N:X,U:ue,B:le,F:de},pe=y.litHtmlPolyfillSupport;pe?.(G,J),(y.litHtmlVersions??=[]).push(`3.3.2`);var me=(e,t,n)=>{let r=n?.renderBefore??t,i=r._$litPart$;if(i===void 0){let e=n?.renderBefore??null;r._$litPart$=i=new J(t.insertBefore(E(),e),e,void 0,n??{})}return i._$AI(e),i},Z=globalThis,Q=class extends v{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){let e=super.createRenderRoot();return this.renderOptions.renderBefore??=e.firstChild,e}update(e){let t=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(e),this._$Do=me(t,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(!1)}render(){return z}};Q._$litElement$=!0,Q.finalized=!0,Z.litElementHydrateSupport?.({LitElement:Q});var he=Z.litElementPolyfillSupport;he?.({LitElement:Q}),(Z.litElementVersions??=[]).push(`4.2.2`);var ge=e=>(t,n)=>{n===void 0?customElements.define(e,t):n.addInitializer(()=>{customElements.define(e,t)})},_e={attribute:!0,type:String,converter:h,reflect:!1,hasChanged:g},ve=(e=_e,t,n)=>{let{kind:r,metadata:i}=n,a=globalThis.litPropertyMetadata.get(i);if(a===void 0&&globalThis.litPropertyMetadata.set(i,a=new Map),r===`setter`&&((e=Object.create(e)).wrapped=!0),a.set(n.name,e),r===`accessor`){let{name:r}=n;return{set(n){let i=t.get.call(this);t.set.call(this,n),this.requestUpdate(r,i,e,!0,n)},init(t){return t!==void 0&&this.C(r,void 0,e,t),t}}}if(r===`setter`){let{name:r}=n;return function(n){let i=this[r];t.call(this,n),this.requestUpdate(r,i,e,!0,n)}}throw Error(`Unsupported decorator location: `+r)};function ye(e){return(t,n)=>typeof n==`object`?ve(e,t,n):((e,t,n)=>{let r=t.hasOwnProperty(n);return t.constructor.createProperty(n,e),r?Object.getOwnPropertyDescriptor(t,n):void 0})(e,t,n)}function be(e){return ye({...e,state:!0,attribute:!1})}var $=(e,t,n)=>(n.configurable=!0,n.enumerable=!0,Reflect.decorate&&typeof t!=`object`&&Object.defineProperty(e,t,n),n);function xe(e,t){return(n,r,i)=>{let a=t=>t.renderRoot?.querySelector(e)??null;if(t){let{get:e,set:t}=typeof r==`object`?n:i??(()=>{let e=Symbol();return{get(){return this[e]},set(t){this[e]=t}}})();return $(n,r,{get(){let n=e.call(this);return n===void 0&&(n=a(this),(n!==null||this.hasUpdated)&&t.call(this,n)),n}})}return $(n,r,{get(){return a(this)}})}}var Se=o`
+  :host {
+    font-family: var(--ic-font-sans);
+  }
+
+  *,
+  *::before,
+  *::after {
+    box-sizing: border-box;
+  }
+
+  :host {
+    color: var(--ic-text);
+  }
+`,Ce=o`
+  .focusable:focus-visible,
+  button:focus-visible,
+  a:focus-visible,
+  input:focus-visible,
+  select:focus-visible,
+  textarea:focus-visible {
+    outline: 2px solid var(--ic-accent);
+    outline-offset: 2px;
+  }
+`,we=o`
+  .sr-only {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
+  }
+`;function Te(e,t,n,r){var i=arguments.length,a=i<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,n):r,o;if(typeof Reflect==`object`&&typeof Reflect.decorate==`function`)a=Reflect.decorate(e,t,n,r);else for(var s=e.length-1;s>=0;s--)(o=e[s])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a}export{xe as a,ge as c,z as d,se as f,o as h,we as i,Q as l,ce as m,Ce as n,be as o,fe as p,Se as r,ye as s,Te as t,B as u};