@ai-ecoverse/slicc-spectrum 1.103.1 → 1.103.2

package/dist/slicc-ui.js

@@ -6247,8 +6247,8 @@ var containRe = /paint|layout|strict|content/;
 var isNotNone = (value) => !!value && value !== "none";
 var isWebKitValue;
 function isContainingBlock(elementOrCss) {
-  const css2 = isElement(elementOrCss) ? getComputedStyle2(elementOrCss) : elementOrCss;
-  return isNotNone(css2.transform) || isNotNone(css2.translate) || isNotNone(css2.scale) || isNotNone(css2.rotate) || isNotNone(css2.perspective) || !isWebKit2() && (isNotNone(css2.backdropFilter) || isNotNone(css2.filter)) || willChangeRe.test(css2.willChange || "") || containRe.test(css2.contain || "");
+  const css3 = isElement(elementOrCss) ? getComputedStyle2(elementOrCss) : elementOrCss;
+  return isNotNone(css3.transform) || isNotNone(css3.translate) || isNotNone(css3.scale) || isNotNone(css3.rotate) || isNotNone(css3.perspective) || !isWebKit2() && (isNotNone(css3.backdropFilter) || isNotNone(css3.filter)) || willChangeRe.test(css3.willChange || "") || containRe.test(css3.contain || "");
 }
 function getContainingBlock(element3) {
   let currentNode = getParentNode(element3);
@@ -6333,9 +6333,9 @@ function getFrameElement(win) {
 
 // node_modules/@adobe/spectrum-wc-core/node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs
 function getCssDimensions(element3) {
-  const css2 = getComputedStyle2(element3);
-  let width = parseFloat(css2.width) || 0;
-  let height = parseFloat(css2.height) || 0;
+  const css3 = getComputedStyle2(element3);
+  let width = parseFloat(css3.width) || 0;
+  let height = parseFloat(css3.height) || 0;
   const hasOffset = isHTMLElement(element3);
   const offsetWidth = hasOffset ? element3.offsetWidth : width;
   const offsetHeight = hasOffset ? element3.offsetHeight : height;
@@ -6429,9 +6429,9 @@ function getBoundingClientRect(element3, includeScale, isFixedStrategy, offsetPa
     while (currentIFrame && offsetParent && offsetWin !== currentWin) {
       const iframeScale = getScale(currentIFrame);
       const iframeRect = currentIFrame.getBoundingClientRect();
-      const css2 = getComputedStyle2(currentIFrame);
-      const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css2.paddingLeft)) * iframeScale.x;
-      const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css2.paddingTop)) * iframeScale.y;
+      const css3 = getComputedStyle2(currentIFrame);
+      const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css3.paddingLeft)) * iframeScale.x;
+      const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css3.paddingTop)) * iframeScale.y;
       x7 *= iframeScale.x;
       y10 *= iframeScale.y;
       width *= iframeScale.x;
@@ -6821,20 +6821,20 @@ function observeMove(element3, onMove) {
     };
     let isFirstUpdate = true;
     function handleObserve(entries) {
-      const ratio = entries[0].intersectionRatio;
-      if (ratio !== threshold) {
+      const ratio2 = entries[0].intersectionRatio;
+      if (ratio2 !== threshold) {
         if (!isFirstUpdate) {
           return refresh2();
         }
-        if (!ratio) {
+        if (!ratio2) {
           timeoutId = setTimeout(() => {
             refresh2(false, 1e-7);
           }, 1e3);
         } else {
-          refresh2(false, ratio);
+          refresh2(false, ratio2);
         }
       }
-      if (ratio === 1 && !rectsAreEqual(elementRectForRootMargin, element3.getBoundingClientRect())) {
+      if (ratio2 === 1 && !rectsAreEqual(elementRectForRootMargin, element3.getBoundingClientRect())) {
         refresh2();
       }
       isFirstUpdate = false;
@@ -10438,6 +10438,299 @@ e25("swc-icon-new", o55);
 // node_modules/@adobe/spectrum-wc/dist/link.css
 var link_default = '/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the "License");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/**\n * Standalone link presentation for native `<a href>` elements.\n *\n * Default anchor appearance inside `.swc-Typography--prose` and\n * `.swc-Typography--links` ships with `typography.css` (generated). Import this\n * stylesheet when authors need explicit BEM modifiers on anchors.\n *\n */\n\n.swc-Link {\n  inline-size: -moz-fit-content;\n  inline-size: fit-content;\n  font-family: var(--swc-sans-font-family-stack);\n  font-size: var(--swc-font-size-100);\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1.30;\n  color: var(--swc-link-text-color-default, var(--swc-accent-color-900));\n  -webkit-text-decoration: underline;\n  text-decoration: underline;\n  text-decoration-thickness: 1px;\n  text-underline-offset: 1px;\n  transition: color 130ms ease-in-out;\n\n  &:hover {\n    color: var(--swc-link-text-color-hover, var(--swc-accent-color-1000));\n  }\n\n  &:active {\n    color: var(--swc-link-text-color-down, var(--swc-accent-color-1000));\n  }\n\n  &:focus-visible {\n    color: var(--swc-link-text-color-focus, var(--swc-accent-color-1000));\n    border-radius: 4px;\n    outline: 2px solid var(--swc-link-focus-indicator-color, var(--swc-blue-800));\n    outline-offset: 2px;\n  }\n\n  &:lang(ja),\n  &:lang(zh),\n  &:lang(ko) {\n    line-height: 1.50;\n  }\n}\n\n.swc-Link--standalone {\n  font-weight: 500;\n}\n\n.swc-Link--secondary {\n  --swc-link-text-color-default: var(--swc-gray-800);\n  --swc-link-text-color-hover: var(--swc-gray-900);\n  --swc-link-text-color-down: var(--swc-gray-900);\n  --swc-link-text-color-focus: var(--swc-gray-900);\n}\n\n.swc-Link--staticWhite {\n  --swc-link-text-color-default: var(--swc-white);\n  --swc-link-text-color-hover: var(--swc-white);\n  --swc-link-text-color-down: var(--swc-white);\n  --swc-link-text-color-focus: var(--swc-white);\n  --swc-link-focus-indicator-color: var(--swc-white);\n}\n\n.swc-Link--staticBlack {\n  --swc-link-text-color-default: var(--swc-black);\n  --swc-link-text-color-hover: var(--swc-black);\n  --swc-link-text-color-down: var(--swc-black);\n  --swc-link-text-color-focus: var(--swc-black);\n  --swc-link-focus-indicator-color: var(--swc-black);\n}\n\n.swc-Link--quiet.swc-Link--standalone {\n  -webkit-text-decoration: none;\n  text-decoration: none;\n}\n\n.swc-Link--quiet.swc-Link--standalone:hover {\n  -webkit-text-decoration: underline;\n  text-decoration: underline;\n}\n';
 
+// src/app/ansi.ts
+var lightPalette = [
+  "gray-800",
+  "negative-color-900",
+  "positive-color-900",
+  "notice-color-1000",
+  "informative-color-900",
+  "purple-900",
+  "cyan-1000",
+  "gray-600",
+  "gray-700",
+  "negative-color-1000",
+  "positive-color-1000",
+  "notice-color-1100",
+  "informative-color-1000",
+  "purple-1000",
+  "cyan-1100",
+  "gray-800"
+];
+var terminalPalette = r(
+  lightPalette.map((token2, n37) => `--slicc-terminal-color-${n37}: var(--swc-${token2});`).join("\n")
+);
+var tints = [
+  "gray-800",
+  "negative-subtle-background-color-default",
+  "positive-subtle-background-color-default",
+  "notice-subtle-background-color-default",
+  "informative-subtle-background-color-default",
+  "purple-subtle-background-color-default",
+  "cyan-subtle-background-color-default",
+  "gray-subtle-background-color-default"
+];
+var plain = {
+  bold: false,
+  dim: false,
+  italic: false,
+  underline: false,
+  inverse: false,
+  fg: null,
+  bg: null
+};
+var levels = [0, 95, 135, 175, 215, 255];
+function indexed(n37) {
+  if (!Number.isInteger(n37) || n37 < 0 || n37 > 255) return null;
+  if (n37 < 16) return n37;
+  if (n37 >= 232) {
+    const grey = 8 + (n37 - 232) * 10;
+    return `rgb(${grey}, ${grey}, ${grey})`;
+  }
+  const cube = n37 - 16;
+  const [r40, g7, b13] = [Math.floor(cube / 36), Math.floor(cube / 6) % 6, cube % 6].map(
+    (level) => levels[level]
+  );
+  return `rgb(${r40}, ${g7}, ${b13})`;
+}
+function channel(value) {
+  return Number.isInteger(value) && value >= 0 && value <= 255 ? value : null;
+}
+function extended(params, at) {
+  const mode2 = params[at + 1];
+  if (mode2 === 5) return { color: indexed(params[at + 2]), used: 2 };
+  if (mode2 === 2) {
+    const rgb = params.slice(at + 2, at + 5).map(channel);
+    const ok4 = rgb.length === 3 && rgb.every((value) => value !== null);
+    return { color: ok4 ? `rgb(${rgb.join(", ")})` : null, used: 4 };
+  }
+  return { color: null, used: 0 };
+}
+function numbers(text5) {
+  return text5.split(":").map((part2) => part2 === "" ? 0 : Number(part2));
+}
+var flags = {
+  0: plain,
+  1: { bold: true },
+  2: { dim: true },
+  3: { italic: true },
+  4: { underline: true },
+  7: { inverse: true },
+  22: { bold: false, dim: false },
+  23: { italic: false },
+  24: { underline: false },
+  27: { inverse: false },
+  39: { fg: null },
+  49: { bg: null }
+};
+var ranges = [
+  [30, "fg", 0],
+  [40, "bg", 0],
+  [90, "fg", 8],
+  [100, "bg", 8]
+];
+function simple(code3) {
+  const flag = flags[code3];
+  if (flag) return flag;
+  const range3 = ranges.find(([start2]) => code3 >= start2 && code3 < start2 + 8);
+  return range3 ? { [range3[1]]: code3 - range3[0] + range3[2] } : null;
+}
+function wide(groups2, i26) {
+  const group = groups2[i26];
+  if (group.length === 1)
+    return extended(
+      groups2.slice(i26).map((entry) => entry[0]),
+      0
+    );
+  const spaced = group[1] === 2 && group.length > 5;
+  return { color: extended(spaced ? [0, 2, ...group.slice(3)] : group, 0).color, used: 0 };
+}
+function sgr(style, body4) {
+  const next = { ...style };
+  const groups2 = body4 === "" ? [[0]] : body4.split(";").map(numbers);
+  for (let i26 = 0; i26 < groups2.length; i26++) {
+    const group = groups2[i26];
+    const code3 = group[0];
+    if (code3 === 38 || code3 === 48) {
+      const { color: color2, used } = wide(groups2, i26);
+      i26 += used;
+      if (color2 !== null) next[code3 === 38 ? "fg" : "bg"] = color2;
+    } else if (code3 === 4 && group.length > 1) next.underline = group[1] !== 0;
+    else Object.assign(next, simple(code3));
+  }
+  return next;
+}
+function terminated(text5, from, streaming) {
+  for (let i26 = from; i26 < text5.length; i26++) {
+    if (text5[i26] === "\x07") return i26 + 1;
+    if (text5[i26] === "\x1B" && text5[i26 + 1] === "\\") return i26 + 2;
+  }
+  if (streaming) return -1;
+  const line = text5.indexOf("\n", from);
+  return line === -1 ? text5.length : line;
+}
+function csi(text5, from) {
+  for (let i26 = from; i26 < text5.length; i26++) {
+    const code3 = text5.charCodeAt(i26);
+    if (code3 >= 64 && code3 <= 126) {
+      return { end: i26 + 1, body: text5.slice(from, i26), final: text5[i26] };
+    }
+    if (code3 < 32 || code3 > 63) return { end: i26, body: "", final: "" };
+  }
+  return null;
+}
+function escape(text5, at, style, streaming) {
+  const kind = text5[at + 1];
+  if (kind === void 0) return { end: -1, style };
+  if (kind === "[") {
+    const found = csi(text5, at + 2);
+    if (!found) return { end: -1, style };
+    const styled = found.final === "m" && /^[\d;:]*$/.test(found.body);
+    return { end: found.end, style: styled ? sgr(style, found.body) : style };
+  }
+  if ("]PX^_".includes(kind)) return { end: terminated(text5, at + 2, streaming), style };
+  let i26 = at + 1;
+  while (i26 < text5.length && text5.charCodeAt(i26) >= 32 && text5.charCodeAt(i26) <= 47) i26++;
+  if (i26 === text5.length) return { end: -1, style };
+  const final = text5.charCodeAt(i26);
+  return { end: final >= 48 && final <= 126 ? i26 + 1 : at + 1, style };
+}
+function parseAnsi(text5, streaming = false) {
+  const runs = [];
+  let style = plain;
+  let start2 = 0;
+  const push2 = (end) => {
+    if (end <= start2) return;
+    const last = runs.at(-1);
+    const piece = text5.slice(start2, end);
+    if (last?.style === style) last.text += piece;
+    else runs.push({ text: piece, style });
+  };
+  let i26 = text5.indexOf("\x1B");
+  while (i26 !== -1) {
+    push2(i26);
+    const found = escape(text5, i26, style, streaming);
+    if (found.end === -1) return runs;
+    style = found.style;
+    start2 = found.end;
+    i26 = text5.indexOf("\x1B", start2);
+  }
+  push2(text5.length);
+  return runs;
+}
+function swatch(color2) {
+  if (color2 === null) return null;
+  return typeof color2 === "number" ? `var(--slicc-terminal-color-${color2}, var(--swc-${lightPalette[color2]}))` : color2;
+}
+function on(rgb) {
+  const [r40, g7, b13] = rgb.match(/\d+/g).map((value) => {
+    const v13 = Number(value) / 255;
+    return v13 <= 0.03928 ? v13 / 12.92 : ((v13 + 0.055) / 1.055) ** 2.4;
+  });
+  return 0.2126 * r40 + 0.7152 * g7 + 0.0722 * b13 > 0.179 ? "var(--swc-black)" : "var(--swc-white)";
+}
+function triple(color2) {
+  const found = color2.match(/^rgb\((\d+), (\d+), (\d+)\)$/);
+  return found ? found.slice(1).map(Number) : null;
+}
+function readSurface(root2) {
+  const read = (scheme) => {
+    const probe = document.createElement("div");
+    probe.className = "call run-detail";
+    probe.hidden = true;
+    probe.style.colorScheme = scheme;
+    root2.append(probe);
+    const style = getComputedStyle(probe);
+    const found = [triple(style.backgroundColor), triple(style.color)];
+    probe.remove();
+    return found;
+  };
+  const [light, dark] = [read("light"), read("dark")];
+  if (![...light, ...dark].every(Boolean)) return void 0;
+  return {
+    card: [light[0], dark[0]],
+    text: [light[1], dark[1]]
+  };
+}
+function luminance(rgb) {
+  const [r40, g7, b13] = rgb.map((value) => {
+    const v13 = value / 255;
+    return v13 <= 0.03928 ? v13 / 12.92 : ((v13 + 0.055) / 1.055) ** 2.4;
+  });
+  return 0.2126 * r40 + 0.7152 * g7 + 0.0722 * b13;
+}
+function ratio(a23, b13) {
+  const [high, low] = [luminance(a23), luminance(b13)].sort((x7, y10) => y10 - x7);
+  return (high + 0.05) / (low + 0.05);
+}
+function mix(color2, base, amount) {
+  return color2.map(
+    (value, i26) => Math.round(base[i26] + (value - base[i26]) * amount)
+  );
+}
+function floor2(color2, under) {
+  const black = [0, 0, 0];
+  const white = [255, 255, 255];
+  const pole = ratio(black, under) >= ratio(white, under) ? black : white;
+  let step2 = 0;
+  while (ratio(mix(pole, color2, step2 / 20), under) < 4.5) step2++;
+  return mix(pole, color2, step2 / 20);
+}
+var strength = [0.12, 0.25];
+function tint(color2, card2, text5, side) {
+  const amount = strength[side];
+  const tinted = mix(color2, card2, amount);
+  const apart = Math.hypot(...tinted.map((value, i26) => value - card2[i26]));
+  return apart < 16 ? mix(text5, card2, amount) : tinted;
+}
+var css = (rgb) => `rgb(${rgb.join(", ")})`;
+var both = (pair) => `light-dark(${pair.map(css).join(", ")})`;
+function extendedPaint(fg, bg, surface2) {
+  const backs = typeof bg === "string" ? surface2.card.map(
+    (card2, side) => tint(triple(bg), card2, surface2.text[side], side)
+  ) : null;
+  const fronts = surface2.card.map(
+    (card2, side) => floor2(
+      typeof fg === "string" ? triple(fg) : surface2.text[side],
+      backs?.[side] ?? card2
+    )
+  );
+  return [both(fronts), backs ? both(backs) : null];
+}
+function paint(style, surface2) {
+  let { fg, bg } = style;
+  if (style.inverse && fg === null && bg === null) {
+    return ["var(--swc-background-layer-1-color)", "var(--swc-neutral-content-color-default)"];
+  }
+  if (style.inverse) [fg, bg] = [bg, fg];
+  if (style.dim && typeof fg === "number" && fg >= 8) fg -= 8;
+  if (style.dim && fg === null && bg === null) {
+    return ["var(--swc-neutral-subdued-content-color-default)", null];
+  }
+  const extendedColor = typeof bg === "string" || bg === null && typeof fg === "string";
+  if (surface2 && extendedColor) return extendedPaint(fg, bg, surface2);
+  if (bg === null) return [swatch(fg), null];
+  if (typeof bg === "string") return [typeof fg === "string" ? fg : on(bg), bg];
+  const tint2 = `var(--swc-${bg === 8 ? "gray-700" : tints[bg % 8]})`;
+  return [bg % 8 === 0 ? "var(--swc-gray-25)" : null, tint2];
+}
+function inline2(style, surface2) {
+  const [fg, bg] = paint(style, surface2);
+  return [
+    fg ? `color: ${fg}` : "",
+    bg ? `background: ${bg}` : "",
+    style.bold ? "font-weight: var(--swc-bold-font-weight)" : "",
+    style.italic ? "font-style: italic" : "",
+    style.underline ? "text-decoration: underline" : ""
+  ].filter(Boolean).join("; ");
+}
+function ansi(text5, streaming = false, surface2) {
+  return parseAnsi(text5, streaming).map((run) => {
+    const style = inline2(run.style, surface2);
+    return style ? b`<span style=${style}>${run.text}</span>` : run.text;
+  });
+}
+
 // src/app/command.ts
 var toShow = "Show the full command to allow it.";
 var toScroll = "Scroll to the end of the command to allow it.";
@@ -14273,229 +14566,6 @@ var o63 = class extends a10 {
 };
 e25("swc-icon-info-circle", o63);
 
-// src/app/ansi.ts
-var lightPalette = [
-  "gray-800",
-  "negative-color-900",
-  "positive-color-900",
-  "notice-color-1000",
-  "informative-color-900",
-  "purple-900",
-  "cyan-1000",
-  "gray-600",
-  "gray-700",
-  "negative-color-1000",
-  "positive-color-1000",
-  "notice-color-1100",
-  "informative-color-1000",
-  "purple-1000",
-  "cyan-1100",
-  "gray-800"
-];
-var terminalPalette = r(
-  lightPalette.map((token2, n37) => `--slicc-terminal-color-${n37}: var(--swc-${token2});`).join("\n")
-);
-var tints = [
-  "gray-800",
-  "negative-subtle-background-color-default",
-  "positive-subtle-background-color-default",
-  "notice-subtle-background-color-default",
-  "informative-subtle-background-color-default",
-  "purple-subtle-background-color-default",
-  "cyan-subtle-background-color-default",
-  "gray-subtle-background-color-default"
-];
-var plain = {
-  bold: false,
-  dim: false,
-  italic: false,
-  underline: false,
-  inverse: false,
-  fg: null,
-  bg: null
-};
-var levels = [0, 95, 135, 175, 215, 255];
-function indexed(n37) {
-  if (!Number.isInteger(n37) || n37 < 0 || n37 > 255) return null;
-  if (n37 < 16) return n37;
-  if (n37 >= 232) {
-    const grey = 8 + (n37 - 232) * 10;
-    return `rgb(${grey}, ${grey}, ${grey})`;
-  }
-  const cube = n37 - 16;
-  const [r40, g7, b13] = [Math.floor(cube / 36), Math.floor(cube / 6) % 6, cube % 6].map(
-    (level) => levels[level]
-  );
-  return `rgb(${r40}, ${g7}, ${b13})`;
-}
-function channel(value) {
-  return Number.isInteger(value) && value >= 0 && value <= 255 ? value : null;
-}
-function extended(params, at) {
-  const mode2 = params[at + 1];
-  if (mode2 === 5) return { color: indexed(params[at + 2]), used: 2 };
-  if (mode2 === 2) {
-    const rgb = params.slice(at + 2, at + 5).map(channel);
-    const ok4 = rgb.length === 3 && rgb.every((value) => value !== null);
-    return { color: ok4 ? `rgb(${rgb.join(", ")})` : null, used: 4 };
-  }
-  return { color: null, used: 0 };
-}
-function numbers(text5) {
-  return text5.split(":").map((part2) => part2 === "" ? 0 : Number(part2));
-}
-var flags = {
-  0: plain,
-  1: { bold: true },
-  2: { dim: true },
-  3: { italic: true },
-  4: { underline: true },
-  7: { inverse: true },
-  22: { bold: false, dim: false },
-  23: { italic: false },
-  24: { underline: false },
-  27: { inverse: false },
-  39: { fg: null },
-  49: { bg: null }
-};
-var ranges = [
-  [30, "fg", 0],
-  [40, "bg", 0],
-  [90, "fg", 8],
-  [100, "bg", 8]
-];
-function simple(code3) {
-  const flag = flags[code3];
-  if (flag) return flag;
-  const range3 = ranges.find(([start2]) => code3 >= start2 && code3 < start2 + 8);
-  return range3 ? { [range3[1]]: code3 - range3[0] + range3[2] } : null;
-}
-function wide(groups2, i26) {
-  const group = groups2[i26];
-  if (group.length === 1)
-    return extended(
-      groups2.slice(i26).map((entry) => entry[0]),
-      0
-    );
-  const spaced = group[1] === 2 && group.length > 5;
-  return { color: extended(spaced ? [0, 2, ...group.slice(3)] : group, 0).color, used: 0 };
-}
-function sgr(style, body4) {
-  const next = { ...style };
-  const groups2 = body4 === "" ? [[0]] : body4.split(";").map(numbers);
-  for (let i26 = 0; i26 < groups2.length; i26++) {
-    const group = groups2[i26];
-    const code3 = group[0];
-    if (code3 === 38 || code3 === 48) {
-      const { color: color2, used } = wide(groups2, i26);
-      i26 += used;
-      if (color2 !== null) next[code3 === 38 ? "fg" : "bg"] = color2;
-    } else if (code3 === 4 && group.length > 1) next.underline = group[1] !== 0;
-    else Object.assign(next, simple(code3));
-  }
-  return next;
-}
-function terminated(text5, from, streaming) {
-  for (let i26 = from; i26 < text5.length; i26++) {
-    if (text5[i26] === "\x07") return i26 + 1;
-    if (text5[i26] === "\x1B" && text5[i26 + 1] === "\\") return i26 + 2;
-  }
-  if (streaming) return -1;
-  const line = text5.indexOf("\n", from);
-  return line === -1 ? text5.length : line;
-}
-function csi(text5, from) {
-  for (let i26 = from; i26 < text5.length; i26++) {
-    const code3 = text5.charCodeAt(i26);
-    if (code3 >= 64 && code3 <= 126) {
-      return { end: i26 + 1, body: text5.slice(from, i26), final: text5[i26] };
-    }
-    if (code3 < 32 || code3 > 63) return { end: i26, body: "", final: "" };
-  }
-  return null;
-}
-function escape(text5, at, style, streaming) {
-  const kind = text5[at + 1];
-  if (kind === void 0) return { end: -1, style };
-  if (kind === "[") {
-    const found = csi(text5, at + 2);
-    if (!found) return { end: -1, style };
-    const styled = found.final === "m" && /^[\d;:]*$/.test(found.body);
-    return { end: found.end, style: styled ? sgr(style, found.body) : style };
-  }
-  if ("]PX^_".includes(kind)) return { end: terminated(text5, at + 2, streaming), style };
-  let i26 = at + 1;
-  while (i26 < text5.length && text5.charCodeAt(i26) >= 32 && text5.charCodeAt(i26) <= 47) i26++;
-  if (i26 === text5.length) return { end: -1, style };
-  const final = text5.charCodeAt(i26);
-  return { end: final >= 48 && final <= 126 ? i26 + 1 : at + 1, style };
-}
-function parseAnsi(text5, streaming = false) {
-  const runs = [];
-  let style = plain;
-  let start2 = 0;
-  const push2 = (end) => {
-    if (end <= start2) return;
-    const last = runs.at(-1);
-    const piece = text5.slice(start2, end);
-    if (last?.style === style) last.text += piece;
-    else runs.push({ text: piece, style });
-  };
-  let i26 = text5.indexOf("\x1B");
-  while (i26 !== -1) {
-    push2(i26);
-    const found = escape(text5, i26, style, streaming);
-    if (found.end === -1) return runs;
-    style = found.style;
-    start2 = found.end;
-    i26 = text5.indexOf("\x1B", start2);
-  }
-  push2(text5.length);
-  return runs;
-}
-function swatch(color2) {
-  if (color2 === null) return null;
-  return typeof color2 === "number" ? `var(--slicc-terminal-color-${color2}, var(--swc-${lightPalette[color2]}))` : color2;
-}
-function on(rgb) {
-  const [r40, g7, b13] = rgb.match(/\d+/g).map((value) => {
-    const v13 = Number(value) / 255;
-    return v13 <= 0.03928 ? v13 / 12.92 : ((v13 + 0.055) / 1.055) ** 2.4;
-  });
-  return 0.2126 * r40 + 0.7152 * g7 + 0.0722 * b13 > 0.179 ? "var(--swc-black)" : "var(--swc-white)";
-}
-function paint(style) {
-  let { fg, bg } = style;
-  if (style.inverse && fg === null && bg === null) {
-    return ["var(--swc-background-layer-1-color)", "var(--swc-neutral-content-color-default)"];
-  }
-  if (style.inverse) [fg, bg] = [bg, fg];
-  if (style.dim && typeof fg === "number" && fg >= 8) fg -= 8;
-  if (style.dim && fg === null && bg === null) {
-    return ["var(--swc-neutral-subdued-content-color-default)", null];
-  }
-  if (bg === null) return [swatch(fg), null];
-  if (typeof bg === "string") return [typeof fg === "string" ? fg : on(bg), bg];
-  const tint = `var(--swc-${bg === 8 ? "gray-700" : tints[bg % 8]})`;
-  return [bg % 8 === 0 ? "var(--swc-gray-25)" : null, tint];
-}
-function inline2(style) {
-  const [fg, bg] = paint(style);
-  return [
-    fg ? `color: ${fg}` : "",
-    bg ? `background: ${bg}` : "",
-    style.bold ? "font-weight: var(--swc-bold-font-weight)" : "",
-    style.italic ? "font-style: italic" : "",
-    style.underline ? "text-decoration: underline" : ""
-  ].filter(Boolean).join("; ");
-}
-function ansi(text5, streaming = false) {
-  return parseAnsi(text5, streaming).map((run) => {
-    const style = inline2(run.style);
-    return style ? b`<span style=${style}>${run.text}</span>` : run.text;
-  });
-}
-
 // src/app/guard.ts
 var prefixes = [
   "sk-",
@@ -21909,7 +21979,7 @@ function step(call, context, id) {
     row,
     b`<div class="call run-detail" id=${`detail-${call.id}`} role="listitem" aria-label=${label} data-target=${call.id} ?hidden=${!open}>
       ${body(call, context.color)}
-      ${call.output ? b`<pre class="output">${ansi(call.output, call.status === "running")}</pre>` : A}
+      ${call.output ? b`<pre class="output">${ansi(call.output, call.status === "running", context.surface)}</pre>` : A}
       ${call.notes?.length ? notes(call.notes) : A}
       ${call.image ? b`<img class="shot" src=${call.image} alt=${call.title} />` : A}
       ${call.meta ? b`<span class="tool-meta">${call.meta}</span>` : A}
@@ -26276,6 +26346,7 @@ var SliccChat = class _SliccChat extends ThemedElement {
   render() {
     this.#handlers.color = this.color;
     this.#handlers.model = this.model ?? null;
+    this.#handlers.surface ??= readSurface(this.renderRoot);
     const agent = this.#agent();
     this.#switched(agent);
     const watch2 = watchOnly(this.model);
@@ -27891,9 +27962,9 @@ function sparkline(points, width = 120, height = 28) {
     (value, i26) => `${(i26 / (points.length - 1) * width).toFixed(1)},${(height - (value - min2) / span * (height - 2) - 1).toFixed(1)}`
   ).join(" ");
 }
-function meterVariant2(ratio) {
-  if (ratio >= 0.9) return "negative";
-  if (ratio >= 0.6) return "notice";
+function meterVariant2(ratio2) {
+  if (ratio2 >= 0.9) return "negative";
+  if (ratio2 >= 0.6) return "notice";
   return "informative";
 }
 var surfaces = {
@@ -60233,9 +60304,9 @@ function transformerStyleToClass(options2 = {}) {
       return classToStyle;
     },
     getCSS() {
-      let css2 = "";
-      for (const [className, style] of classToStyle.entries()) css2 += `.${className}{${typeof style === "string" ? style : stringifyStyle(style)}}`;
-      return css2;
+      let css3 = "";
+      for (const [className, style] of classToStyle.entries()) css3 += `.${className}{${typeof style === "string" ? style : stringifyStyle(style)}}`;
+      return css3;
     },
     clearRegistry() {
       classToStyle.clear();
@@ -95863,7 +95934,7 @@ var FileTree = class {
 };
 
 // src/components/file-tree.ts
-var css = `
+var css2 = `
 :host {
   display: block;
   height: 100%;
@@ -96174,7 +96245,7 @@ ${view.focused}`;
   connectedCallback() {
     const root2 = this.shadowRoot ?? this.attachShadow({ mode: "open", delegatesFocus: true });
     if (!this.#mount) {
-      adoptStyles(root2, css);
+      adoptStyles(root2, css2);
       this.#mount = document.createElement("div");
       this.#mount.className = "mount";
       root2.append(this.#mount);