@corenel/web-ui 0.7.0 → 0.8.0

package/dist/transcriptSkinCss.js

@@ -0,0 +1,136 @@
+const T = (skin) => `[data-tx-skin="${skin}"]`;
+const terminal = `
+${T('terminal')} [data-tx-part="user"]::before { content: "you ~ % "; color: #5fb3f9; }
+${T('terminal')} [data-tx-part="assistant"] { padding-left: 2ch; border-left: 1px solid #26303b; }
+${T('terminal')} [data-tx-part="tool-name"] { color: #7ee787; }
+${T('terminal')} [data-tx-status="error"] { --tx-glyph-fg: #ff7b72; }
+${T('terminal')} [data-tx-status="error"] [data-tx-part="tool-name"] { color: #ff7b72; }
+${T('terminal')} [data-tx-part="stats"]::before { content: "-- "; }
+`;
+const crt = `
+@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
+${T('crt')} { text-shadow: 0 0 4px rgba(255,170,60,0.55), 0 0 12px rgba(255,140,20,0.25); }
+${T('crt')}::after { content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: inherit;
+  background: repeating-linear-gradient(to bottom, rgba(0,0,0,0.28) 0 1px, transparent 1px 3px);
+  box-shadow: inset 0 0 90px rgba(0,0,0,0.85); }
+${T('crt')} [data-tx-part="user"]::before { content: "> "; }
+${T('crt')} [data-tx-part="tool-name"] { text-transform: uppercase; }
+${T('crt')} [data-tx-status="error"] { --tx-glyph-fg: #ff6a3d; }
+${T('crt')} [data-tx-status="error"] [data-tx-part="tool-name"] { color: #ff6a3d; text-shadow: 0 0 6px rgba(255,90,40,0.7); }
+${T('crt')} [data-tx-part="turn"]:last-child [data-tx-last]::after {
+  content: ""; display: inline-block; width: 0.6em; height: 1em; margin-left: 4px; vertical-align: -2px;
+  background: #ffb347; box-shadow: 0 0 8px rgba(255,170,60,0.7); animation: tx-crt-blink 1.1s steps(1) infinite; }
+@keyframes tx-crt-blink { 50% { opacity: 0; } }
+@media (prefers-reduced-motion: reduce) {
+  ${T('crt')} [data-tx-part="turn"]:last-child [data-tx-last]::after { animation: none; }
+}
+`;
+const minimal = `
+${T('minimal')} [data-tx-status="error"] [data-tx-part="tool-name"] { color: #e0776b; }
+${T('minimal')} [data-tx-part="tool-head"]:hover [data-tx-part="tool-name"] { color: #e9e6e1; }
+`;
+const paper = `
+@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,600;1,8..60,400&display=swap');
+${T('paper')} [data-tx-part="user"] { box-shadow: inset 2px 0 0 #b9ac98; }
+${T('paper')} [data-tx-part="tool-name"] { font-variant: small-caps; letter-spacing: 0.03em; }
+${T('paper')} [data-tx-part="tool-group"] { border-top: 1px solid #ddd3c2; border-bottom: 1px solid #ddd3c2; padding: 4px 0; }
+${T('paper')} [data-tx-part="tool"] { box-shadow: inset 0 1px #ddd3c2, inset 0 -1px #ddd3c2; }
+${T('paper')} [data-tx-status="error"] { --tx-glyph-fg: #a8412f; }
+${T('paper')} [data-tx-status="error"] [data-tx-part="tool-name"] { color: #a8412f; }
+`;
+const blueprint = `
+${T('blueprint')} [data-tx-part="user"]::before { content: "REQ  "; color: #7fc4ff; font-size: 11px; letter-spacing: 0.1em; }
+${T('blueprint')} [data-tx-part="tool"] { position: relative; margin-left: 18px; }
+${T('blueprint')} [data-tx-part="tool"]::before { content: ""; position: absolute; left: -13px; top: 13px; width: 12px; border-top: 1px solid #7fc4ff; }
+${T('blueprint')} [data-tx-part="tool"]::after { content: ""; position: absolute; left: -13px; top: -8px; bottom: -8px; border-left: 1px solid #7fc4ff; }
+${T('blueprint')} [data-tx-part="tool-name"] { text-transform: uppercase; letter-spacing: 0.08em; }
+${T('blueprint')} [data-tx-part="tool-body"] { border-top: 1px dashed rgba(159,208,255,0.5); }
+${T('blueprint')} [data-tx-status="error"] { outline: 1px dashed #ff9f7a; outline-offset: -1px; --tx-glyph-fg: #ff9f7a; }
+${T('blueprint')} [data-tx-status="error"] [data-tx-part="tool-name"] { color: #ff9f7a; }
+${T('blueprint')} [data-tx-part="stats"] { letter-spacing: 0.06em; }
+`;
+/* Nicks are generic on purpose: the same code serves both apps, so the agent
+ * is "<agent>", never a product name. Exported so the Netsplit arrival effect's
+ * join line uses the very same nick. */
+export const IRC_AGENT_NICK = 'agent';
+const N = IRC_AGENT_NICK;
+const irc = `
+${T('irc')} [data-tx-part="user"]::before { content: "<you> "; color: #79c0ff; }
+${T('irc')} [data-tx-part="assistant"]::before { content: "<${N}> "; float: left; margin-right: 1ch; color: #d2a8ff; }
+${T('irc')} [data-tx-part="tool-name"] { color: #e3b341; font-style: italic; }
+${T('irc')} [data-tx-part="tool-name"]::before { content: "* ${N} ran "; }
+${T('irc')} [data-tx-status="running"] [data-tx-part="tool-name"]::before { content: "* ${N} is running "; }
+${T('irc')} [data-tx-status="error"] [data-tx-part="tool-name"] { color: #ff7b72; }
+${T('irc')} [data-tx-status="error"] [data-tx-part="tool-name"]::before { content: "* ${N} failed "; }
+${T('irc')} [data-tx-part="stats"]::before { content: "-!- "; color: #3fb950; }
+`;
+const handheld = `
+@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
+${T('handheld')} [data-tx-part="assistant"] { position: relative; margin: 3px; padding: 10px 12px 16px; background: #9bbc0f;
+  box-shadow: 0 0 0 3px #0f380f, inset 0 0 0 2px #9bbc0f, inset 0 0 0 4px #306230; }
+${T('handheld')} [data-tx-part="turn"]:last-child [data-tx-last]::after { content: ""; position: absolute; right: 10px; bottom: 5px;
+  border: 5px solid transparent; border-top: 6px solid #0f380f; border-bottom: 0; animation: tx-hh-bob 1s steps(2) infinite; }
+@keyframes tx-hh-bob { 50% { transform: translateY(2px); } }
+@media (prefers-reduced-motion: reduce) {
+  ${T('handheld')} [data-tx-part="turn"]:last-child [data-tx-last]::after { animation: none; }
+}
+${T('handheld')} [data-tx-status="error"] { --tx-glyph-bg: #9bbc0f; --tx-glyph-fg: #0f380f; }
+${T('handheld')} [data-tx-status="error"] [data-tx-part="glyph"] { box-shadow: inset 0 0 0 2px #0f380f; }
+${T('handheld')} [data-tx-status="error"] [data-tx-part="tool-name"] { text-decoration: underline wavy; }
+`;
+const receipt = `
+@import url('https://fonts.googleapis.com/css2?family=Courier+Prime:wght@400;700&display=swap');
+${T('receipt')} [data-tx-part="list"] { max-width: 40ch; margin: 0 auto; padding: 16px 16px 26px; background: #fbfaf6;
+  box-shadow: 0 1px 3px rgba(0,0,0,0.18);
+  -webkit-mask: linear-gradient(#000 0 0) top/100% calc(100% - 8px) no-repeat, conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom/12px 8px repeat-x;
+  mask: linear-gradient(#000 0 0) top/100% calc(100% - 8px) no-repeat, conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom/12px 8px repeat-x; }
+${T('receipt')} [data-tx-part="list"]::before { content: "*** RECEIPT ***"; display: block; text-align: center; font-weight: 700; }
+${T('receipt')} [data-tx-part="turn"] + [data-tx-part="turn"] { border-top: 1px dashed #999; padding-top: 12px; }
+${T('receipt')} [data-tx-part="stats"] { font-weight: 700; border-top: 1px dashed #999; padding-top: 4px; }
+${T('receipt')} [data-tx-part="stats"]::before { content: "TOTAL  "; }
+${T('receipt')} [data-tx-status="error"] [data-tx-part="tool-name"] { text-decoration: line-through; }
+`;
+/* T+ is the agent's working time (data-tx-elapsed, Transcript.tsx), not a
+ * wall clock. */
+const mission = `
+${T('mission')} [data-tx-part="list"]::before { content: "\\25CF  LIVE    MISSION LOG"; display: block; padding-bottom: 6px; border-bottom: 1px solid #22313f;
+  color: #3ddc84; font-size: 10.5px; letter-spacing: 0.14em; }
+${T('mission')} [data-tx-part="turn"][data-tx-elapsed]::before { content: attr(data-tx-elapsed); color: #5d7488; font-size: 10.5px; letter-spacing: 0.08em; }
+${T('mission')} [data-tx-part="user"]::before { content: "FLIGHT  "; color: #ffb454; font-size: 10.5px; letter-spacing: 0.1em; }
+${T('mission')} [data-tx-part="assistant"]::before { content: "CAPCOM  "; float: left; margin-right: 1ch; color: #6cc4ff; font-size: 10.5px; letter-spacing: 0.1em; }
+${T('mission')} [data-tx-part="tool-name"]::before { content: "GO"; display: inline-block; margin-right: 8px; padding: 0 6px; border: 1px solid #3ddc84;
+  border-radius: 3px; color: #3ddc84; font-size: 9.5px; letter-spacing: 0.1em; line-height: 1.6; }
+${T('mission')} [data-tx-status="running"] [data-tx-part="tool-name"]::before { content: "HOLD"; border-color: #ffb454; color: #ffb454; }
+${T('mission')} [data-tx-status="error"] [data-tx-part="tool-name"]::before { content: "NO-GO"; border-color: #ff5d5d; color: #ff5d5d; }
+${T('mission')} [data-tx-part="stats"] { align-self: flex-start; padding: 4px 8px; border: 1px solid #22313f; background: #0f1821; }
+${T('mission')} [data-tx-part="stats"]::before { content: "TELEMETRY  "; color: #5d7488; }
+`;
+const BEVEL = 'inset -1px -1px #0a0a0a, inset 1px 1px #fff, inset -2px -2px #808080, inset 2px 2px #dfdfdf';
+const SUNKEN = 'inset 1px 1px #808080, inset -1px -1px #fff, inset 2px 2px #0a0a0a, inset -2px -2px #dfdfdf';
+const retro = `
+${T('retro')} [data-tx-part="list"] { counter-reset: tx-win; }
+${T('retro')} [data-tx-part="turn"] { counter-increment: tx-win; padding: 3px 3px 8px; background: #c0c0c0; box-shadow: ${BEVEL}; }
+${T('retro')} [data-tx-part="turn"]::before { content: "Transcript - turn " counter(tx-win); display: block; padding: 3px 6px;
+  background: linear-gradient(90deg, #000080, #1084d0); color: #fff; font-weight: 700; font-size: 11.5px; }
+${T('retro')} [data-tx-part="turn"] > [data-tx-part] { margin-left: 6px; margin-right: 6px; }
+${T('retro')} [data-tx-part="user"] { box-shadow: ${SUNKEN}; }
+${T('retro')} [data-tx-part="assistant"] { padding: 6px 8px; background: #fff; box-shadow: ${SUNKEN}; }
+${T('retro')} [data-tx-part="stats"] { padding: 2px 6px; box-shadow: inset 1px 1px #808080, inset -1px -1px #fff; }
+${T('retro')} [data-tx-status="error"] { padding: 3px; box-shadow: ${BEVEL}; }
+${T('retro')} [data-tx-status="error"]::before { content: "Error"; display: block; padding: 2px 6px;
+  background: linear-gradient(90deg, #800000, #c04040); color: #fff; font-weight: 700; font-size: 11.5px; }
+`;
+export const SKIN_CSS = {
+    default: '',
+    terminal,
+    crt,
+    minimal,
+    paper,
+    blueprint,
+    irc,
+    handheld,
+    receipt,
+    mission,
+    retro,
+};
+//# sourceMappingURL=transcriptSkinCss.js.map

package/dist/transcriptSkinCss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"transcriptSkinCss.js","sourceRoot":"","sources":["../transcriptSkinCss.ts"],"names":[],"mappings":"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"}

package/dist/usageSummary.d.ts

@@ -0,0 +1,31 @@
+import type { ConversationTurn } from '@corenel/harness/conversation';
+export interface UsageTotals {
+    inTok: number;
+    outTok: number;
+    /** Null when no turn measured it: unknown, not "none cached". */
+    cachedTok: number | null;
+    cost: number;
+    turns: number;
+    /** Model calls across the session; null when no turn recorded its count. */
+    calls: number | null;
+}
+export interface UsageRow {
+    id: string;
+    /** 1-based position among the turns that ran, so "Turn 4" means the fourth. */
+    index: number;
+    /** The turn's largest single request, or null when it was not measured. */
+    ctxTok: number | null;
+    calls: number | null;
+    inTok: number;
+    outTok: number;
+    cachedTok: number | null;
+    cost: number;
+}
+/** Session totals, the last `n` turns that ran (newest first), and the latest
+ * request's size -- the figure the gauge can be checked against. */
+export declare function usageSummary(turns: readonly ConversationTurn[], n: number): {
+    session: UsageTotals;
+    recent: UsageRow[];
+    lastContext: number | null;
+};
+//# sourceMappingURL=usageSummary.d.ts.map

package/dist/usageSummary.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usageSummary.d.ts","sourceRoot":"","sources":["../usageSummary.ts"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAEtE,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,iEAAiE;IACjE,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,4EAA4E;IAC5E,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB;AAED,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,+EAA+E;IAC/E,KAAK,EAAE,MAAM,CAAC;IACd,2EAA2E;IAC3E,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,IAAI,EAAE,MAAM,CAAC;CACd;AAED;oEACoE;AACpE,wBAAgB,YAAY,CAAC,KAAK,EAAE,SAAS,gBAAgB,EAAE,EAAE,CAAC,EAAE,MAAM,GAAG;IAAE,OAAO,EAAE,WAAW,CAAC;IAAC,MAAM,EAAE,QAAQ,EAAE,CAAC;IAAC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE,CAkCpJ"}

package/dist/usageSummary.js

@@ -0,0 +1,39 @@
+/** Session totals, the last `n` turns that ran (newest first), and the latest
+ * request's size -- the figure the gauge can be checked against. */
+export function usageSummary(turns, n) {
+    const ran = [];
+    for (const t of turns) {
+        if (!t.stats)
+            continue;
+        const calls = t.stats.calls ?? null;
+        ran.push({
+            id: t.id,
+            index: ran.length + 1,
+            // One call means the turn's billed `in` was its only request.
+            ctxTok: t.stats.ctxTok ?? (calls === 1 ? t.stats.inTok : null),
+            calls,
+            inTok: t.stats.inTok,
+            outTok: t.stats.outTok,
+            cachedTok: t.stats.cachedTok ?? null,
+            cost: t.stats.cost,
+        });
+    }
+    const sumKnown = (pick) => {
+        const known = ran.map(pick).filter((v) => v !== null);
+        return known.length ? known.reduce((a, v) => a + v, 0) : null;
+    };
+    const session = {
+        inTok: ran.reduce((a, r) => a + r.inTok, 0),
+        outTok: ran.reduce((a, r) => a + r.outTok, 0),
+        cachedTok: sumKnown((r) => r.cachedTok),
+        cost: ran.reduce((a, r) => a + r.cost, 0),
+        turns: ran.length,
+        calls: sumKnown((r) => r.calls),
+    };
+    return {
+        session,
+        recent: ran.slice(-Math.max(0, n)).reverse(),
+        lastContext: ran.length ? ran[ran.length - 1].ctxTok : null,
+    };
+}
+//# sourceMappingURL=usageSummary.js.map

package/dist/usageSummary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usageSummary.js","sourceRoot":"","sources":["../usageSummary.ts"],"names":[],"mappings":"AAuCA;oEACoE;AACpE,MAAM,UAAU,YAAY,CAAC,KAAkC,EAAE,CAAS;IACxE,MAAM,GAAG,GAAe,EAAE,CAAC;IAC3B,KAAK,MAAM,CAAC,IAAI,KAAK,EAAE,CAAC;QACtB,IAAI,CAAC,CAAC,CAAC,KAAK;YAAE,SAAS;QACvB,MAAM,KAAK,GAAG,CAAC,CAAC,KAAK,CAAC,KAAK,IAAI,IAAI,CAAC;QACpC,GAAG,CAAC,IAAI,CAAC;YACP,EAAE,EAAE,CAAC,CAAC,EAAE;YACR,KAAK,EAAE,GAAG,CAAC,MAAM,GAAG,CAAC;YACrB,8DAA8D;YAC9D,MAAM,EAAE,CAAC,CAAC,KAAK,CAAC,MAAM,IAAI,CAAC,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;YAC9D,KAAK;YACL,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,KAAK;YACpB,MAAM,EAAE,CAAC,CAAC,KAAK,CAAC,MAAM;YACtB,SAAS,EAAE,CAAC,CAAC,KAAK,CAAC,SAAS,IAAI,IAAI;YACpC,IAAI,EAAE,CAAC,CAAC,KAAK,CAAC,IAAI;SACnB,CAAC,CAAC;IACL,CAAC;IACD,MAAM,QAAQ,GAAG,CAAC,IAAoC,EAAiB,EAAE;QACvE,MAAM,KAAK,GAAG,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAe,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC;QACnE,OAAO,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IAChE,CAAC,CAAC;IACF,MAAM,OAAO,GAAgB;QAC3B,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC;QAC3C,MAAM,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,CAAC;QAC7C,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;QACvC,IAAI,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;QACzC,KAAK,EAAE,GAAG,CAAC,MAAM;QACjB,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC;KAChC,CAAC;IACF,OAAO;QACL,OAAO;QACP,MAAM,EAAE,GAAG,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,OAAO,EAAE;QAC5C,WAAW,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI;KAC5D,CAAC;AACJ,CAAC"}

package/dist/verificationView.d.ts

@@ -0,0 +1,3 @@
+export type VerificationView = 'collapsed' | 'expanded';
+export declare function useVerificationView(): [VerificationView, (v: VerificationView) => void];
+//# sourceMappingURL=verificationView.d.ts.map

package/dist/verificationView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"verificationView.d.ts","sourceRoot":"","sources":["../verificationView.tsx"],"names":[],"mappings":"AAMA,MAAM,MAAM,gBAAgB,GAAG,WAAW,GAAG,UAAU,CAAC;AAaxD,wBAAgB,mBAAmB,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,CAAC,CAoBvF"}

package/dist/verificationView.js

@@ -0,0 +1,37 @@
+/* Turn verification summary — whether the "Observed: …" block under an agent
+ * turn starts collapsed (one line) or expanded (with the observed changes).
+ * A starting state only: each summary still toggles on its own. Persisted and
+ * synced across instances the same way as transcriptView.tsx. */
+import { useCallback, useEffect, useState } from 'react';
+const KEY = 'prompd.web.verificationView';
+const EVENT = 'prompd:verificationView';
+function read() {
+    try {
+        return localStorage.getItem(KEY) === 'expanded' ? 'expanded' : 'collapsed';
+    }
+    catch {
+        return 'collapsed';
+    }
+}
+export function useVerificationView() {
+    const [view, setViewState] = useState(read);
+    useEffect(() => {
+        const sync = () => setViewState(read());
+        window.addEventListener('storage', sync);
+        window.addEventListener(EVENT, sync);
+        return () => {
+            window.removeEventListener('storage', sync);
+            window.removeEventListener(EVENT, sync);
+        };
+    }, []);
+    const setView = useCallback((v) => {
+        setViewState(v);
+        try {
+            localStorage.setItem(KEY, v);
+        }
+        catch { /* storage unavailable: the choice lasts this session */ }
+        window.dispatchEvent(new CustomEvent(EVENT));
+    }, []);
+    return [view, setView];
+}
+//# sourceMappingURL=verificationView.js.map

package/dist/verificationView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"verificationView.js","sourceRoot":"","sources":["../verificationView.tsx"],"names":[],"mappings":"AAAA;;;iEAGiE;AACjE,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAIzD,MAAM,GAAG,GAAG,6BAA6B,CAAC;AAC1C,MAAM,KAAK,GAAG,yBAAyB,CAAC;AAExC,SAAS,IAAI;IACX,IAAI,CAAC;QACH,OAAO,YAAY,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC;IAC7E,CAAC;IAAC,MAAM,CAAC;QACP,OAAO,WAAW,CAAC;IACrB,CAAC;AACH,CAAC;AAED,MAAM,UAAU,mBAAmB;IACjC,MAAM,CAAC,IAAI,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAmB,IAAI,CAAC,CAAC;IAE9D,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,IAAI,GAAG,GAAG,EAAE,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC,CAAC;QACxC,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC;QACzC,MAAM,CAAC,gBAAgB,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;QACrC,OAAO,GAAG,EAAE;YACV,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC;YAC5C,MAAM,CAAC,mBAAmB,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;QAC1C,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,OAAO,GAAG,WAAW,CAAC,CAAC,CAAmB,EAAE,EAAE;QAClD,YAAY,CAAC,CAAC,CAAC,CAAC;QAChB,IAAI,CAAC;YAAC,YAAY,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;QAAC,CAAC;QAAC,MAAM,CAAC,CAAC,wDAAwD,CAAC,CAAC;QACxG,MAAM,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC;IAC/C,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;AACzB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@corenel/web-ui",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "license": "Elastic-2.0",
   "type": "module",
   "description": "Corenel browser dock/agent UI — the presentational components (transcript, composer, rich content, tool render, context manager, etc.). The prompd app's AgentPanel/PolicyEditor compose these on top.",
@@ -15,10 +15,10 @@
     }
   },
   "dependencies": {
-    "@corenel/protocol": "0.9.0",
-    "@corenel/ui-kit": "0.6.0",
-    "@corenel/harness": "0.10.0",
-    "@corenel/tools-web": "0.5.0"
+    "@corenel/protocol": "0.10.0",
+    "@corenel/harness": "0.11.0",
+    "@corenel/tools-web": "0.6.0",
+    "@corenel/ui-kit": "0.7.0"
   },
   "peerDependencies": {
     "react": "^18.3.1",