@flamingo-stack/openframe-frontend-core 0.0.710 → 0.0.712

package/dist/chunk-KT3U3ZRP.cjs

@@ -0,0 +1,1137 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }"use client";
+
+
+
+
+
+
+var _chunkFFT56TYBcjs = require('./chunk-FFT56TYB.cjs');
+
+
+
+var _chunkWVOTC7HWcjs = require('./chunk-WVOTC7HW.cjs');
+
+
+
+
+var _chunkF5BPGWGTcjs = require('./chunk-F5BPGWGT.cjs');
+
+
+
+
+var _chunkULWVKHSIcjs = require('./chunk-ULWVKHSI.cjs');
+
+
+
+
+
+var _chunkVX4E6YSBcjs = require('./chunk-VX4E6YSB.cjs');
+
+
+var _chunkDFQYAYBHcjs = require('./chunk-DFQYAYBH.cjs');
+
+
+var _chunk3ATAYP36cjs = require('./chunk-3ATAYP36.cjs');
+
+// src/utils/date-utils.ts
+var ZONED_DATE_FIELDS_MEDIUM_DATETIME = {
+  year: "numeric",
+  month: "short",
+  day: "numeric",
+  hour: "numeric",
+  minute: "2-digit"
+};
+function formatTicketRelativeTime(iso) {
+  const now = /* @__PURE__ */ new Date();
+  const date = new Date(iso);
+  if (Number.isNaN(date.getTime())) return "";
+  const diffMs = now.getTime() - date.getTime();
+  const diffMin = Math.floor(diffMs / 6e4);
+  if (diffMin < 1) return "Just now";
+  if (diffMin < 60) return `${diffMin} min ago`;
+  const diffHours = Math.floor(diffMin / 60);
+  if (diffHours < 24) return diffHours === 1 ? "1 hour ago" : `${diffHours} hours ago`;
+  return _chunkF5BPGWGTcjs.formatDateWithTimezone.call(void 0, date, null, "numeric");
+}
+function formatTicketFullTimestamp(iso) {
+  return _chunkF5BPGWGTcjs.formatDateWithTimezone.call(void 0, iso, null, "numericDateTime");
+}
+function formatRelativeTime(timestamp) {
+  return formatRelativeTimeFrom(timestamp, /* @__PURE__ */ new Date());
+}
+function formatRelativeTimeFrom(timestamp, now) {
+  const targetTime = typeof timestamp === "string" ? new Date(timestamp) : timestamp;
+  if (isNaN(targetTime.getTime())) {
+    console.warn("\u26A0\uFE0F Invalid timestamp in formatRelativeTime:", timestamp);
+    return "Unknown time";
+  }
+  const diffInMs = now.getTime() - targetTime.getTime();
+  const diffInMinutes = Math.floor(diffInMs / (1e3 * 60));
+  if (diffInMinutes < 0) {
+    return "Just now";
+  }
+  if (diffInMinutes < 1) return "Just now";
+  if (diffInMinutes < 60) return `${diffInMinutes}m ago`;
+  const diffInHours = Math.floor(diffInMinutes / 60);
+  if (diffInHours < 24) return `${diffInHours}h ago`;
+  const diffInDays = Math.floor(diffInHours / 24);
+  if (diffInDays < 7) return `${diffInDays}d ago`;
+  if (diffInDays < 30) {
+    const weeks = Math.floor(diffInDays / 7);
+    return `${weeks}w ago`;
+  }
+  return _chunkF5BPGWGTcjs.formatDateWithTimezone.call(void 0, targetTime, null, {
+    month: "short",
+    day: "numeric",
+    year: targetTime.getUTCFullYear() !== now.getUTCFullYear() ? "numeric" : void 0
+  });
+}
+function formatAbsoluteDate(timestamp, options = {}) {
+  const targetTime = typeof timestamp === "string" ? new Date(timestamp) : timestamp;
+  if (isNaN(targetTime.getTime())) {
+    console.warn("\u26A0\uFE0F Invalid timestamp in formatAbsoluteDate:", timestamp);
+    return "Invalid date";
+  }
+  return _chunkF5BPGWGTcjs.formatDateWithTimezone.call(void 0, targetTime, _nullishCoalesce(options.timeZone, () => ( null)), {
+    year: "numeric",
+    month: "short",
+    day: "numeric",
+    ...options
+  });
+}
+function formatDateTime(timestamp, options = {}) {
+  const targetTime = typeof timestamp === "string" ? new Date(timestamp) : timestamp;
+  if (isNaN(targetTime.getTime())) {
+    console.warn("\u26A0\uFE0F Invalid timestamp in formatDateTime:", timestamp);
+    return "Invalid date";
+  }
+  return _chunkF5BPGWGTcjs.formatDateWithTimezone.call(void 0, targetTime, _nullishCoalesce(options.timeZone, () => ( null)), {
+    ...ZONED_DATE_FIELDS_MEDIUM_DATETIME,
+    ...options
+  });
+}
+function getDetailedTimeDifference(timestamp) {
+  const now = /* @__PURE__ */ new Date();
+  const targetTime = typeof timestamp === "string" ? new Date(timestamp) : timestamp;
+  if (isNaN(targetTime.getTime())) {
+    return "Invalid date";
+  }
+  const diffInMs = now.getTime() - targetTime.getTime();
+  const diffInSeconds = Math.floor(diffInMs / 1e3);
+  const diffInMinutes = Math.floor(diffInSeconds / 60);
+  const diffInHours = Math.floor(diffInMinutes / 60);
+  const diffInDays = Math.floor(diffInHours / 24);
+  if (diffInSeconds < 60) return `${diffInSeconds} seconds ago`;
+  if (diffInMinutes < 60) return `${diffInMinutes} minutes ago`;
+  if (diffInHours < 24) return `${diffInHours} hours ago`;
+  if (diffInDays < 30) return `${diffInDays} days ago`;
+  const diffInMonths = Math.floor(diffInDays / 30);
+  if (diffInMonths < 12) return `${diffInMonths} months ago`;
+  const diffInYears = Math.floor(diffInDays / 365);
+  return `${diffInYears} years ago`;
+}
+function isToday(timestamp) {
+  const today = /* @__PURE__ */ new Date();
+  const targetTime = typeof timestamp === "string" ? new Date(timestamp) : timestamp;
+  return today.toDateString() === targetTime.toDateString();
+}
+function isWithinMinutes(timestamp, minutes) {
+  const now = /* @__PURE__ */ new Date();
+  const targetTime = typeof timestamp === "string" ? new Date(timestamp) : timestamp;
+  const diffInMs = now.getTime() - targetTime.getTime();
+  const diffInMinutes = diffInMs / (1e3 * 60);
+  return diffInMinutes <= minutes && diffInMinutes >= 0;
+}
+function createUTCTimestamp() {
+  return (/* @__PURE__ */ new Date()).toISOString();
+}
+
+// src/utils/color-analysis.ts
+var DESIGN_PALETTE = [
+  { name: "yellow", hex: "#FFC008", rgb: [255, 192, 8] },
+  { name: "black", hex: "#161616", rgb: [22, 22, 22] },
+  { name: "gray", hex: "#888888", rgb: [136, 136, 136] }
+];
+function hexToRgb(hex) {
+  const normalized = hex.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i, (_, r, g, b) => `${r}${r}${g}${g}${b}${b}`);
+  const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(normalized);
+  return result ? [parseInt(result[1], 16), parseInt(result[2], 16), parseInt(result[3], 16)] : [0, 0, 0];
+}
+function getLuminance(rgb) {
+  const [r, g, b] = rgb.map((channel) => {
+    const c = channel / 255;
+    return c <= 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+  });
+  return 0.2126 * r + 0.7152 * g + 0.0722 * b;
+}
+function getContrastRatio(color1, color2) {
+  const lum1 = getLuminance(color1);
+  const lum2 = getLuminance(color2);
+  const brightest = Math.max(lum1, lum2);
+  const darkest = Math.min(lum1, lum2);
+  return (brightest + 0.05) / (darkest + 0.05);
+}
+function pickReadableTextColor(bgHex) {
+  const bg = hexToRgb(bgHex);
+  const darkContrast = getContrastRatio(bg, [26, 26, 26]);
+  const lightContrast = getContrastRatio(bg, [250, 250, 250]);
+  return darkContrast >= lightContrast ? "dark" : "light";
+}
+function extractDominantColor(canvas) {
+  const ctx = canvas.getContext("2d");
+  if (!ctx) return [128, 128, 128];
+  const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
+  const data = imageData.data;
+  const sampleSize = Math.max(1, Math.floor(data.length / (4 * 1e3)));
+  const colorCounts = {};
+  for (let i = 0; i < data.length; i += 4 * sampleSize) {
+    const r = data[i];
+    const g = data[i + 1];
+    const b = data[i + 2];
+    const alpha = data[i + 3];
+    if (alpha < 128) continue;
+    const bucketR = Math.round(r / 32) * 32;
+    const bucketG = Math.round(g / 32) * 32;
+    const bucketB = Math.round(b / 32) * 32;
+    const key = `${bucketR},${bucketG},${bucketB}`;
+    colorCounts[key] = (colorCounts[key] || 0) + 1;
+  }
+  let maxCount = 0;
+  let dominantColor = [128, 128, 128];
+  for (const [colorKey, count] of Object.entries(colorCounts)) {
+    if (count > maxCount) {
+      maxCount = count;
+      const [r, g, b] = colorKey.split(",").map(Number);
+      dominantColor = [r, g, b];
+    }
+  }
+  return dominantColor;
+}
+function getBestContrastColor(imageColor) {
+  let bestColor = DESIGN_PALETTE[0];
+  let bestContrast = 0;
+  for (const color of DESIGN_PALETTE) {
+    const contrast = getContrastRatio(imageColor, color.rgb);
+    if (contrast > bestContrast) {
+      bestContrast = contrast;
+      bestColor = color;
+    }
+  }
+  return bestContrast >= 3 ? bestColor : DESIGN_PALETTE.find((c) => c.name === "black") || bestColor;
+}
+function analyzeImageColor(imageSrc) {
+  return new Promise((resolve, reject) => {
+    const img = new Image();
+    img.crossOrigin = "anonymous";
+    img.onload = () => {
+      try {
+        const canvas = document.createElement("canvas");
+        const ctx = canvas.getContext("2d");
+        if (!ctx) {
+          reject(new Error("Could not get canvas context"));
+          return;
+        }
+        const maxSize = 100;
+        const scale = Math.min(maxSize / img.width, maxSize / img.height);
+        canvas.width = img.width * scale;
+        canvas.height = img.height * scale;
+        ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
+        const dominantColor = extractDominantColor(canvas);
+        const bestContrastColor = getBestContrastColor(dominantColor);
+        resolve(bestContrastColor);
+      } catch (error) {
+        reject(error);
+      }
+    };
+    img.onerror = () => reject(new Error("Failed to load image"));
+    img.src = imageSrc;
+  });
+}
+async function extractImageEdgeColorAsync(imageUrl) {
+  return new Promise((resolve) => {
+    if (typeof window === "undefined") {
+      resolve("#000000");
+      return;
+    }
+    const img = new Image();
+    img.crossOrigin = "anonymous";
+    img.onload = () => {
+      try {
+        const canvas = document.createElement("canvas");
+        const ctx = canvas.getContext("2d");
+        if (!ctx) {
+          resolve("#000000");
+          return;
+        }
+        const maxSize = 50;
+        const scale = Math.min(maxSize / img.naturalWidth, maxSize / img.naturalHeight);
+        const w = Math.round(img.naturalWidth * scale);
+        const h = Math.round(img.naturalHeight * scale);
+        canvas.width = w;
+        canvas.height = h;
+        ctx.drawImage(img, 0, 0, w, h);
+        const data = ctx.getImageData(0, 0, w, h).data;
+        const edgeW = Math.max(2, Math.round(w * 0.15));
+        const edgeH = Math.max(2, Math.round(h * 0.15));
+        const bucketSize = 32;
+        const buckets = /* @__PURE__ */ new Map();
+        for (let y = 0; y < h; y++) {
+          for (let x = 0; x < w; x++) {
+            if (!(x < edgeW || x >= w - edgeW || y < edgeH || y >= h - edgeH)) continue;
+            const i = (y * w + x) * 4;
+            if (data[i + 3] < 128) continue;
+            const br = Math.floor(data[i] / bucketSize) * bucketSize;
+            const bg = Math.floor(data[i + 1] / bucketSize) * bucketSize;
+            const bb = Math.floor(data[i + 2] / bucketSize) * bucketSize;
+            const key = `${br},${bg},${bb}`;
+            const existing = buckets.get(key);
+            if (existing) {
+              existing.r += data[i];
+              existing.g += data[i + 1];
+              existing.b += data[i + 2];
+              existing.count++;
+            } else {
+              buckets.set(key, { r: data[i], g: data[i + 1], b: data[i + 2], count: 1 });
+            }
+          }
+        }
+        let best = { r: 0, g: 0, b: 0, count: 0 };
+        for (const b2 of buckets.values()) {
+          if (b2.count > best.count) best = b2;
+        }
+        if (best.count === 0) {
+          resolve("#000000");
+          return;
+        }
+        const r = Math.round(best.r / best.count), g = Math.round(best.g / best.count), b = Math.round(best.b / best.count);
+        resolve(
+          `#${r.toString(16).padStart(2, "0")}${g.toString(16).padStart(2, "0")}${b.toString(16).padStart(2, "0")}`
+        );
+      } catch (e) {
+        resolve("#000000");
+      }
+    };
+    img.onerror = () => resolve("#000000");
+    img.src = imageUrl;
+  });
+}
+
+// src/utils/ods-color-tokens-stub.ts
+var colorTokens = {
+  primary: "#FFC008",
+  secondary: "#161616",
+  background: "#FAFAFA",
+  surface: "#FFFFFF",
+  text: {
+    primary: "#161616",
+    secondary: "#666666",
+    inverse: "#FFFFFF"
+  },
+  border: "#E5E5E5"
+};
+
+// src/utils/ods-color-utils.ts
+var TOKEN_MAP = colorTokens;
+function lookupToken(tokenKey) {
+  const value = TOKEN_MAP[tokenKey];
+  return typeof value === "string" ? value : void 0;
+}
+function getODSToken(category, color, variant = "base") {
+  const tokenKey = `${category}-${color}-${variant}`;
+  return lookupToken(tokenKey);
+}
+function getCurrentPlatform() {
+  if (typeof window === "undefined") {
+    return process.env.NEXT_PUBLIC_APP_TYPE || "openmsp";
+  }
+  const domPlatform = document.documentElement.getAttribute("data-app-type");
+  if (domPlatform) {
+    return domPlatform;
+  }
+  return process.env.NEXT_PUBLIC_APP_TYPE || "openmsp";
+}
+function switchPlatformTheme(platform) {
+  if (typeof window === "undefined") return;
+  const root = document.documentElement;
+  root.setAttribute("data-app-type", platform);
+  window.dispatchEvent(
+    new CustomEvent("platformThemeChanged", {
+      detail: { platform }
+    })
+  );
+}
+function getSemanticColor(semanticName, platform) {
+  if (typeof window === "undefined") return void 0;
+  const currentPlatform = platform || getCurrentPlatform();
+  const originalPlatform = getCurrentPlatform();
+  if (currentPlatform !== originalPlatform) {
+    switchPlatformTheme(currentPlatform);
+  }
+  const testElement = document.createElement("div");
+  document.body.appendChild(testElement);
+  const computedStyle = getComputedStyle(testElement);
+  const colorValue = computedStyle.getPropertyValue(`--color-${semanticName}`);
+  document.body.removeChild(testElement);
+  if (currentPlatform !== originalPlatform) {
+    switchPlatformTheme(originalPlatform);
+  }
+  return colorValue.trim() || void 0;
+}
+function getPlatformConfig(platform) {
+  const currentPlatform = platform || getCurrentPlatform();
+  const isDarkTheme = _chunkULWVKHSIcjs.PLATFORM_THEME === "dark";
+  return {
+    platform: currentPlatform,
+    accentColor: _chunkULWVKHSIcjs.getPlatformAccentColor.call(void 0, currentPlatform),
+    isDarkTheme,
+    isLightTheme: !isDarkTheme,
+    brandName: _chunkULWVKHSIcjs.getPlatformDisplayName.call(void 0, currentPlatform)
+  };
+}
+function usePlatformColors(platform) {
+  const currentPlatform = platform || getCurrentPlatform();
+  const config = getPlatformConfig(currentPlatform);
+  return {
+    platform: currentPlatform,
+    accentColor: config.accentColor,
+    isDarkTheme: config.isDarkTheme,
+    isLightTheme: config.isLightTheme,
+    brandName: config.brandName,
+    getToken: (category, color, variant) => getODSToken(category, color, variant),
+    switchTheme: (newPlatform) => switchPlatformTheme(newPlatform),
+    getSemanticColor: (semanticName) => getSemanticColor(semanticName, currentPlatform)
+  };
+}
+function getReadableTextColor(hex) {
+  return pickReadableTextColor(hex) === "dark" ? "#212121" : "#fafafa";
+}
+var HEX_PATTERN = /^#[0-9a-fA-F]{6}$/;
+function hexToRgb2(hex) {
+  if (!HEX_PATTERN.test(hex)) return null;
+  const n = Number.parseInt(hex.slice(1), 16);
+  return { r: n >> 16 & 255, g: n >> 8 & 255, b: n & 255 };
+}
+function rgbToHex(r, g, b) {
+  const to = (n) => _chunkWVOTC7HWcjs.clamp.call(void 0, Math.round(n), 0, 255).toString(16).padStart(2, "0");
+  return `#${to(r)}${to(g)}${to(b)}`;
+}
+var HOVER_DARKEN_STEP = 10;
+var ACTIVE_DARKEN_STEP = 20;
+function darkenByStep(hex, step) {
+  const rgb = hexToRgb2(hex);
+  if (!rgb) return hex;
+  return rgbToHex(rgb.r - step, rgb.g - step, rgb.b - step);
+}
+function deriveHoverColor(hex) {
+  return darkenByStep(hex, HOVER_DARKEN_STEP);
+}
+function deriveActiveColor(hex) {
+  return darkenByStep(hex, ACTIVE_DARKEN_STEP);
+}
+function rgbToHsl(r, g, b) {
+  const rn = r / 255;
+  const gn = g / 255;
+  const bn = b / 255;
+  const max = Math.max(rn, gn, bn);
+  const min = Math.min(rn, gn, bn);
+  const l = (max + min) / 2;
+  if (max === min) return { h: 0, s: 0, l: Math.round(l * 100) };
+  const d = max - min;
+  const s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
+  let h;
+  if (max === rn) h = (gn - bn) / d + (gn < bn ? 6 : 0);
+  else if (max === gn) h = (bn - rn) / d + 2;
+  else h = (rn - gn) / d + 4;
+  h *= 60;
+  return { h: Math.round(h), s: Math.round(s * 100), l: Math.round(l * 100) };
+}
+function hslToRgb(h, s, l) {
+  const sn = _chunkWVOTC7HWcjs.clamp.call(void 0, s, 0, 100) / 100;
+  const ln = _chunkWVOTC7HWcjs.clamp.call(void 0, l, 0, 100) / 100;
+  const hn = (h % 360 + 360) % 360;
+  if (sn === 0) {
+    const v = Math.round(ln * 255);
+    return { r: v, g: v, b: v };
+  }
+  const q = ln < 0.5 ? ln * (1 + sn) : ln + sn - ln * sn;
+  const p = 2 * ln - q;
+  const hue2rgb = (t) => {
+    let tn = t;
+    if (tn < 0) tn += 1;
+    if (tn > 1) tn -= 1;
+    if (tn < 1 / 6) return p + (q - p) * 6 * tn;
+    if (tn < 1 / 2) return q;
+    if (tn < 2 / 3) return p + (q - p) * (2 / 3 - tn) * 6;
+    return p;
+  };
+  const hk = hn / 360;
+  return {
+    r: Math.round(hue2rgb(hk + 1 / 3) * 255),
+    g: Math.round(hue2rgb(hk) * 255),
+    b: Math.round(hue2rgb(hk - 1 / 3) * 255)
+  };
+}
+
+// src/components/ui/color-swatch.tsx
+var _jsxruntime = require('react/jsx-runtime');
+function ColorSwatch({ color, className }) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    "span",
+    {
+      "aria-hidden": true,
+      className: _chunk3ATAYP36cjs.cn.call(void 0, "inline-block size-4 shrink-0 rounded-sm", className),
+      style: { backgroundColor: color }
+    }
+  );
+}
+
+// src/components/ui/ticket-status-tag.tsx
+
+var STATUS_CONFIG = {
+  ACTIVE: {
+    label: "Active",
+    variant: "success"
+  },
+  AI_ASSISTANCE: {
+    label: "AI Handling",
+    variant: "outline"
+  },
+  TECH_REQUIRED: {
+    label: "Tech Required",
+    variant: "warning"
+  },
+  ON_HOLD: {
+    label: "On Hold",
+    variant: "error"
+  },
+  RESOLVED: {
+    label: "Resolved",
+    variant: "outline",
+    icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVX4E6YSBcjs.CheckCircleIcon, { size: 16, color: "var(--color-success)" })
+  },
+  ARCHIVED: {
+    label: "Archived",
+    variant: "grey"
+  }
+};
+var STATUS_ALIASES = {
+  // Canonical (backend enum)
+  ACTIVE: "ACTIVE",
+  AI_ASSISTANCE: "AI_ASSISTANCE",
+  ai_assistance: "AI_ASSISTANCE",
+  TECH_REQUIRED: "TECH_REQUIRED",
+  ON_HOLD: "ON_HOLD",
+  RESOLVED: "RESOLVED",
+  ARCHIVED: "ARCHIVED",
+  // Dialog-layer alias
+  ACTION_REQUIRED: "TECH_REQUIRED",
+  // HubSpot canonical (OPEN/CLOSED) — drives color + icon variant. The
+  // user-facing label still comes from `pipeline_stage_label` when the
+  // caller passes <TicketStatusTag label={…}>, so the badge can read
+  // "New" / "Working" / "Waiting on contact" while the canonical status
+  // remains OPEN.
+  OPEN: "ACTIVE",
+  open: "ACTIVE",
+  CLOSED: "RESOLVED",
+  closed: "RESOLVED",
+  // Chat lowercase variants
+  active: "ACTIVE",
+  tech_required: "TECH_REQUIRED",
+  on_hold: "ON_HOLD",
+  resolved: "RESOLVED",
+  archived: "ARCHIVED",
+  action_required: "TECH_REQUIRED"
+};
+function resolveTicketStatus(status) {
+  return _nullishCoalesce(STATUS_ALIASES[status], () => ( null));
+}
+function getTicketStatusConfig(status) {
+  const canonical = resolveTicketStatus(status);
+  if (!canonical) {
+    return { label: status.replace(/_/g, " "), variant: "outline" };
+  }
+  return STATUS_CONFIG[canonical];
+}
+function getTicketStatusTag(status) {
+  const config = getTicketStatusConfig(status);
+  return { label: config.label, variant: config.variant, icon: config.icon };
+}
+var KIND_TO_CANONICAL = {
+  AI_ASSISTANCE: "AI_ASSISTANCE",
+  TECH_REQUIRED: "TECH_REQUIRED",
+  RESOLVED: "RESOLVED",
+  ARCHIVED: "ARCHIVED"
+};
+function kindToCanonicalStatus(kind) {
+  if (kind == null || kind === "CUSTOM") return void 0;
+  return KIND_TO_CANONICAL[kind];
+}
+function usesCanonicalStatusStyle(kind) {
+  return kind != null && kind !== "CUSTOM" && kind !== "TECH_REQUIRED";
+}
+function resolveStatusTagProps(input) {
+  const canonical = usesCanonicalStatusStyle(input.statusKind) ? kindToCanonicalStatus(input.statusKind) : void 0;
+  return {
+    status: _nullishCoalesce(_nullishCoalesce(canonical, () => ( input.status)), () => ( "")),
+    label: _nullishCoalesce(input.statusName, () => ( void 0)),
+    color: canonical ? void 0 : _nullishCoalesce(input.statusColor, () => ( void 0))
+  };
+}
+function TicketStatusTag({
+  status,
+  label,
+  color,
+  variant,
+  className,
+  showIcon = true,
+  options,
+  onSelect,
+  isPending = false,
+  disabled = false,
+  disabledReason
+}) {
+  const config = getTicketStatusConfig(status);
+  const customStyle = color ? {
+    "--tag-bg": color,
+    "--tag-bg-hover": deriveHoverColor(color),
+    "--tag-bg-active": deriveActiveColor(color),
+    color: getReadableTextColor(color)
+  } : void 0;
+  const customColorClasses = color ? "bg-[var(--tag-bg)] hover:bg-[var(--tag-bg-hover)] active:bg-[var(--tag-bg-active)]" : void 0;
+  const tag = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _chunkF5BPGWGTcjs.Tag,
+    {
+      label: _nullishCoalesce(label, () => ( config.label)),
+      variant: _nullishCoalesce(variant, () => ( config.variant)),
+      icon: showIcon ? config.icon : void 0,
+      className: _chunk3ATAYP36cjs.cn.call(void 0, "w-fit shrink-0", customColorClasses, className),
+      style: customStyle
+    }
+  );
+  if (disabled || !options || options.length === 0 || !onSelect) {
+    if (disabled && disabledReason) {
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkFFT56TYBcjs.TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkFFT56TYBcjs.Tooltip, { children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkFFT56TYBcjs.TooltipTrigger, { asChild: true, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "w-fit shrink-0 cursor-not-allowed", children: tag }) }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkFFT56TYBcjs.TooltipContent, { children: disabledReason })
+      ] }) });
+    }
+    return tag;
+  }
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _chunkFFT56TYBcjs.ActionsMenuDropdown,
+    {
+      align: "start",
+      groups: [
+        {
+          items: options.map((option) => ({
+            id: option.id,
+            label: option.name,
+            icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ColorSwatch, { color: option.color }),
+            onClick: () => onSelect(option.id),
+            disabled: isPending
+          }))
+        }
+      ],
+      customTrigger: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+        "button",
+        {
+          type: "button",
+          disabled: isPending,
+          "aria-label": "Change status",
+          style: customStyle,
+          className: _chunk3ATAYP36cjs.cn.call(void 0, 
+            // Reuse the tag's variant styling, but split into a label section and a
+            // separated chevron section (the common dropdown-button seam).
+            _chunkF5BPGWGTcjs.tagVariants.call(void 0, { variant: _nullishCoalesce(variant, () => ( config.variant)) }),
+            "w-fit shrink-0 items-stretch justify-start gap-0 overflow-hidden p-0",
+            "disabled:cursor-not-allowed disabled:opacity-60",
+            // Custom color: bg/hover/active from the CSS vars set above.
+            customColorClasses,
+            className
+          ),
+          children: [
+            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { className: "flex items-center gap-[var(--spacing-system-xxs)] px-[var(--spacing-system-xsf)]", children: [
+              showIcon && config.icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "flex size-5 shrink-0 items-center justify-center", children: config.icon }),
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "truncate", children: _nullishCoalesce(label, () => ( config.label)) })
+            ] }),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "flex items-center justify-center self-stretch border-l border-ods-border px-[var(--spacing-system-xsf)]", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVX4E6YSBcjs.Chevron02DownIcon, { className: "size-4 shrink-0" }) })
+          ]
+        }
+      )
+    }
+  );
+}
+
+// src/components/ui/status-line.tsx
+
+function StatusLine({ tone, label, className }) {
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "span",
+    {
+      className: _chunk3ATAYP36cjs.cn.call(void 0, 
+        "inline-flex items-center gap-1.5 whitespace-nowrap text-h6",
+        tone === "waiting" ? "text-ods-warning" : tone === "error" ? "text-ods-error" : tone === "muted" ? "text-ods-text-secondary" : "text-ods-text-primary",
+        className
+      ),
+      children: [
+        tone === "working" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "span",
+          {
+            className: "h-2 w-2 shrink-0 animate-pulse rounded-full bg-ods-flamingo-cyan motion-reduce:animate-none",
+            "aria-hidden": true
+          }
+        ),
+        tone === "success" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVX4E6YSBcjs.CheckCircleIcon, { size: 16, className: "shrink-0 text-ods-success", "aria-hidden": true }),
+        tone === "error" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVX4E6YSBcjs.XmarkCircleIcon, { size: 16, className: "shrink-0 text-ods-error", "aria-hidden": true }),
+        label
+      ]
+    }
+  );
+}
+
+// src/components/chat/expand-chevron.tsx
+
+function ExpandChevron({ expanded, className }) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _chunkVX4E6YSBcjs.Chevron02DownIcon,
+    {
+      className: _chunk3ATAYP36cjs.cn.call(void 0, 
+        "h-4 w-4 shrink-0 text-ods-text-secondary transition-transform duration-200",
+        expanded && "rotate-180",
+        className
+      )
+    }
+  );
+}
+
+// src/components/chat/hooks/use-collapsible.ts
+var _react = require('react');
+function useCollapsible({
+  expanded,
+  collapsedHeight = 0,
+  disableTransition = false,
+  durationMs = 200
+}) {
+  const [element, setElement] = _react.useState.call(void 0, null);
+  const [contentHeight, setContentHeight] = _react.useState.call(void 0, 0);
+  const [collapsedPx, setCollapsedPx] = _react.useState.call(void 0, 0);
+  _react.useLayoutEffect.call(void 0, () => {
+    if (!element) return void 0;
+    const measure = () => {
+      setContentHeight(element.scrollHeight);
+      setCollapsedPx(collapsedHeight === "1lh" ? parseFloat(getComputedStyle(element).lineHeight) : collapsedHeight);
+    };
+    measure();
+    const observer = new ResizeObserver(measure);
+    observer.observe(element);
+    return () => observer.disconnect();
+  }, [element, collapsedHeight]);
+  const collapsedValue = collapsedHeight === "1lh" ? collapsedPx || collapsedHeight : collapsedHeight;
+  const containerStyle = {
+    overflow: "hidden",
+    maxHeight: expanded ? contentHeight : collapsedValue,
+    transition: disableTransition ? "none" : `max-height ${durationMs}ms ease-in-out`
+  };
+  return {
+    innerRef: setElement,
+    isOverflowing: contentHeight > collapsedPx,
+    containerStyle
+  };
+}
+
+// src/components/chat/utils/tool-call-helpers.ts
+var COMMAND_BODY_ARG_KEYS = ["command", "query", "script", "scriptContent", "code"];
+function getToolCallTitle(opts) {
+  const { args, title, name } = opts;
+  if (args && typeof args === "object") {
+    for (const key of COMMAND_BODY_ARG_KEYS) {
+      const candidate = args[key];
+      if (typeof candidate === "string" && candidate.trim()) return candidate;
+    }
+  }
+  return title || name || "Tool call";
+}
+function getCommandText(call) {
+  return getToolCallTitle({
+    args: call.toolCallArguments,
+    title: call.toolTitle,
+    name: call.toolName
+  });
+}
+var INLINE_STRING_MAX = 80;
+function expandJson(value, indent) {
+  const pad = (n) => "  ".repeat(n);
+  if (value === null) return "null";
+  const t = typeof value;
+  if (t === "number" || t === "boolean" || t === "bigint") return String(value);
+  if (t === "string") {
+    const s = value.replace(/\r\n/g, "\n").replace(/\r/g, "\n");
+    if (!s.includes("\n")) return JSON.stringify(s);
+    return s.replace(/^\n+/, "").replace(/\n+$/, "").split("\n").map((line) => pad(indent) + line).join("\n");
+  }
+  if (Array.isArray(value)) {
+    if (value.length === 0) return "[]";
+    const items = value.map(
+      (v) => typeof v === "string" && /[\r\n]/.test(v) ? expandJson(v, indent + 1) : pad(indent + 1) + expandJson(v, indent + 1)
+    );
+    return "[\n" + items.join(",\n") + "\n" + pad(indent) + "]";
+  }
+  if (t === "object") {
+    const entries = Object.entries(value);
+    if (entries.length === 0) return "{}";
+    const items = entries.map(([k, v]) => {
+      const key = JSON.stringify(k);
+      if (typeof v === "string" && /[\r\n]/.test(v)) {
+        return pad(indent + 1) + key + ":\n" + expandJson(v, indent + 2);
+      }
+      return pad(indent + 1) + key + ": " + expandJson(v, indent + 1);
+    });
+    return "{\n" + items.join(",\n") + "\n" + pad(indent) + "}";
+  }
+  return JSON.stringify(value);
+}
+function expandedJsonStringify(value) {
+  try {
+    return expandJson(value, 0);
+  } catch (e2) {
+    return String(value);
+  }
+}
+function formatToolArgValue(value) {
+  if (value === null || value === void 0) return { kind: "inline", text: "" };
+  if (typeof value === "object") {
+    return { kind: "block", text: safeStringify(value), language: "json" };
+  }
+  if (typeof value === "string") {
+    const trimmed = value.trim();
+    if (trimmed.startsWith("{") && trimmed.endsWith("}") || trimmed.startsWith("[") && trimmed.endsWith("]")) {
+      try {
+        return { kind: "block", text: expandedJsonStringify(JSON.parse(trimmed)), language: "json" };
+      } catch (e3) {
+      }
+    }
+    if (value.includes("\n") || value.length > INLINE_STRING_MAX) {
+      return { kind: "block", text: value, language: "text" };
+    }
+    return { kind: "inline", text: value };
+  }
+  return { kind: "inline", text: String(value) };
+}
+function safeStringify(value) {
+  return expandedJsonStringify(value);
+}
+function formatToolResult(value) {
+  if (typeof value !== "string") return { kind: "inline", text: "" };
+  const fenced = value.match(/^\s*```(?:[a-zA-Z0-9_-]*)\n([\s\S]*?)\n```\s*$/);
+  const body = fenced ? fenced[1] : value;
+  const trimmed = body.trim();
+  if (trimmed.startsWith("{") && trimmed.endsWith("}") || trimmed.startsWith("[") && trimmed.endsWith("]")) {
+    try {
+      return { kind: "block", text: expandedJsonStringify(JSON.parse(trimmed)), language: "json" };
+    } catch (e4) {
+    }
+  }
+  if (body.includes("\n") || body.length > INLINE_STRING_MAX) {
+    return { kind: "block", text: body, language: "text" };
+  }
+  return { kind: "inline", text: body };
+}
+
+// src/components/chat/tool-call-blocks.tsx
+
+var CODE_PRE_CLASS = "bg-ods-bg border border-ods-border rounded-md p-[var(--spacing-system-sf)] w-full max-h-64 overflow-auto overscroll-contain text-code text-ods-text-primary whitespace-pre";
+function ArgRow({ argKey, value }) {
+  const formatted = formatToolArgValue(value);
+  if (formatted.kind === "inline") {
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-full items-start gap-[var(--spacing-system-xxs)]", children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { className: "shrink-0 text-ods-text-secondary", children: [
+        argKey,
+        ":"
+      ] }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "min-w-0 flex-1 break-all text-ods-text-primary", children: formatted.text })
+    ] });
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-full flex-col items-start gap-[var(--spacing-system-xxs)]", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { className: "text-ods-text-secondary", children: [
+      argKey,
+      ":"
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "pre", { className: CODE_PRE_CLASS, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "code", { children: formatted.text }) })
+  ] });
+}
+function ResultBlock({ result, className }) {
+  const formatted = formatToolResult(result);
+  if (!formatted.text) return null;
+  if (formatted.kind === "inline") {
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunk3ATAYP36cjs.cn.call(void 0, "flex w-full flex-col items-start gap-[var(--spacing-system-xxs)]", className), children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-ods-text-secondary", children: "Result:" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "break-all text-ods-text-primary", children: formatted.text })
+    ] });
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunk3ATAYP36cjs.cn.call(void 0, "flex w-full flex-col items-start gap-[var(--spacing-system-xxs)]", className), children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-ods-text-secondary", children: "Result:" }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "pre", { className: CODE_PRE_CLASS, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "code", { children: formatted.text }) })
+  ] });
+}
+function CommandBlock({ command, className }) {
+  if (!command) return null;
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "pre", { className: _chunk3ATAYP36cjs.cn.call(void 0, CODE_PRE_CLASS, className), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "code", { children: command }) });
+}
+
+// src/components/chat/approval-batch-message.tsx
+
+
+// src/components/chat/chat-block-frame.ts
+var CHAT_BLOCK_FRAME_CLASS = "rounded-lg border border-ods-border bg-ods-bg";
+var CHAT_BLOCK_CLASS = `${CHAT_BLOCK_FRAME_CLASS} flex flex-col gap-[var(--spacing-system-xsf)] p-[var(--spacing-system-sf)]`;
+
+// src/components/chat/approval-batch-message.tsx
+
+var COMMAND_BODY_KEYS = new Set(COMMAND_BODY_ARG_KEYS);
+function ApprovalStatusTag({ status, resolvedByName, inlineResolver = false }) {
+  const suffix = inlineResolver && resolvedByName ? ` by ${resolvedByName}` : "";
+  if (status === "approved") return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StatusLine, { tone: "success", label: `Approved${suffix}` });
+  if (status === "cancelled") return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StatusLine, { tone: "muted", label: `Canceled${suffix}` });
+  if (status === "rejected") return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StatusLine, { tone: "error", label: `Rejected${suffix}` });
+  return null;
+}
+function ApprovalWaitingLine() {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StatusLine, { tone: "waiting", label: "Waiting for you" });
+}
+function getArgEntries(call) {
+  const args = call.toolCallArguments;
+  if (!args || typeof args !== "object") return [];
+  return Object.entries(args).filter(
+    ([k, v]) => !COMMAND_BODY_KEYS.has(k) && v !== null && v !== void 0 && v !== ""
+  );
+}
+function ExecutionStatusIcon({
+  batchStatus,
+  execution
+}) {
+  if (batchStatus !== "approved") return null;
+  if (!execution || execution.status === "executing")
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVX4E6YSBcjs.DotsLoaderIcon, { size: 16, className: "text-ods-text-secondary" });
+  if (execution.success === false) return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVX4E6YSBcjs.XmarkCircleIcon, { className: "h-4 w-4 text-ods-error" });
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVX4E6YSBcjs.CheckCircleIcon, { className: "h-4 w-4 text-ods-success" });
+}
+function ToolCallRow({ call, expanded, onToggle, batchStatus, execution, showExecutionStatus }) {
+  const command = getCommandText(call);
+  const args = getArgEntries(call);
+  const toolType = call.toolType || "OPENFRAME";
+  const { innerRef, containerStyle } = useCollapsible({ expanded });
+  const result = _optionalChain([execution, 'optionalAccess', _2 => _2.status]) === "done" ? execution.result : void 0;
+  const hasExpandableBody = args.length > 0 || typeof result === "string" && result.length > 0;
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-full flex-col items-start border-b border-ods-border bg-ods-card last:border-b-0", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      "button",
+      {
+        type: "button",
+        onClick: onToggle,
+        className: "flex w-full cursor-pointer items-start gap-[var(--spacing-system-xsf)] p-[var(--spacing-system-sf)] text-left",
+        children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex h-5 w-5 shrink-0 items-center justify-center text-ods-text-secondary", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkWVOTC7HWcjs.ToolIcon, { toolType, size: 16 }) }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "div",
+            {
+              className: _chunk3ATAYP36cjs.cn.call(void 0, 
+                "min-w-0 flex-1 text-h6",
+                expanded ? "whitespace-pre-wrap break-all text-ods-text-primary" : "line-clamp-2 max-h-10 break-all text-ods-text-secondary"
+              ),
+              children: command
+            }
+          ),
+          showExecutionStatus && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex h-5 w-5 shrink-0 items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ExecutionStatusIcon, { batchStatus, execution }) }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex h-5 w-5 shrink-0 items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ExpandChevron, { expanded }) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-full", style: containerStyle, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { ref: innerRef, children: hasExpandableBody && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-full flex-col items-start gap-0 bg-ods-card px-[var(--spacing-system-sf)] pb-[var(--spacing-system-sf)] text-h6", children: [
+      args.map(([key, value]) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ArgRow, { argKey: key, value }, key)),
+      result && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        ResultBlock,
+        {
+          result,
+          className: args.length > 0 ? "mt-[var(--spacing-system-xsf)]" : void 0
+        }
+      )
+    ] }) }) })
+  ] });
+}
+var ApprovalBatchMessage = _react.forwardRef.call(void 0, 
+  ({
+    className,
+    data,
+    onApprove,
+    onReject,
+    status = "pending",
+    maxBodyHeight,
+    resolvedByName,
+    showExecutionStatus = true,
+    assistantType: _assistantType,
+    variant = "admin",
+    showFooterActions = true,
+    ...props
+  }, ref) => {
+    const [expandedId, setExpandedId] = _react.useState.call(void 0, null);
+    const [isProcessing, setIsProcessing] = _react.useState.call(void 0, false);
+    const isClient = variant === "client";
+    const explanations = data.toolCalls.map((c) => _optionalChain([c, 'access', _3 => _3.toolExplanation, 'optionalAccess', _4 => _4.trim, 'call', _5 => _5()])).filter((s) => !!s);
+    const handleApprove = async () => {
+      setIsProcessing(true);
+      try {
+        await _optionalChain([onApprove, 'optionalCall', _6 => _6(data.approvalRequestId)]);
+      } finally {
+        setIsProcessing(false);
+      }
+    };
+    const handleReject = async () => {
+      setIsProcessing(true);
+      try {
+        await _optionalChain([onReject, 'optionalCall', _7 => _7(data.approvalRequestId)]);
+      } finally {
+        setIsProcessing(false);
+      }
+    };
+    const actionButtons = /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunkDFQYAYBHcjs.Button,
+        {
+          size: "small-legacy",
+          variant: "accent",
+          onClick: handleApprove,
+          disabled: isProcessing,
+          className: _chunk3ATAYP36cjs.cn.call(void 0, 
+            "bg-ods-accent hover:bg-ods-accent/90",
+            "text-ods-bg text-h5",
+            "h-8 px-[var(--spacing-system-xsf)]"
+          ),
+          children: "Approve"
+        }
+      ),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunkDFQYAYBHcjs.Button,
+        {
+          size: "small-legacy",
+          variant: "outline",
+          onClick: handleReject,
+          disabled: isProcessing,
+          className: _chunk3ATAYP36cjs.cn.call(void 0, 
+            "border-ods-border bg-ods-card",
+            "text-ods-text-primary text-h5",
+            "h-8 px-[var(--spacing-system-xsf)] hover:bg-ods-bg"
+          ),
+          children: "Reject"
+        }
+      )
+    ] });
+    if (isClient) {
+      const titles = data.toolCalls.map((c) => _optionalChain([c, 'access', _8 => _8.toolExplanation, 'optionalAccess', _9 => _9.trim, 'call', _10 => _10()]) || _optionalChain([c, 'access', _11 => _11.toolTitle, 'optionalAccess', _12 => _12.trim, 'call', _13 => _13()])).filter((s) => !!s);
+      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { ref, className: _chunk3ATAYP36cjs.cn.call(void 0, "mb-[var(--spacing-system-xsf)]", CHAT_BLOCK_CLASS, className), ...props, children: [
+        titles.length > 0 ? titles.map((title, i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "w-full whitespace-pre-line break-words text-ods-text-primary text-h4", children: title }, i)) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "w-full text-ods-text-primary text-h4", children: "Approval required" }),
+        showFooterActions && status === "pending" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ApprovalWaitingLine, {}),
+        showFooterActions && (status === "pending" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex w-full items-center gap-[var(--spacing-system-xsf)]", children: actionButtons }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex w-full", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ApprovalStatusTag, { status, resolvedByName, inlineResolver: true }) }))
+      ] });
+    }
+    const showFooterBlock = explanations.length > 0 || showFooterActions;
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      "div",
+      {
+        ref,
+        className: _chunk3ATAYP36cjs.cn.call(void 0, 
+          "mb-[var(--spacing-system-xsf)] flex flex-col overflow-hidden",
+          CHAT_BLOCK_FRAME_CLASS,
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "div",
+            {
+              className: _chunk3ATAYP36cjs.cn.call(void 0, "flex flex-col", maxBodyHeight != null && "overflow-y-auto overscroll-contain"),
+              style: maxBodyHeight != null ? { maxHeight: maxBodyHeight } : void 0,
+              children: data.toolCalls.map((call) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                ToolCallRow,
+                {
+                  call,
+                  expanded: expandedId === call.toolExecutionRequestId,
+                  onToggle: () => setExpandedId((prev) => prev === call.toolExecutionRequestId ? null : call.toolExecutionRequestId),
+                  batchStatus: status,
+                  execution: _optionalChain([data, 'access', _14 => _14.executions, 'optionalAccess', _15 => _15[call.toolExecutionRequestId]]),
+                  showExecutionStatus
+                },
+                call.toolExecutionRequestId
+              ))
+            }
+          ),
+          showFooterBlock && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col items-start justify-center gap-[var(--spacing-system-xsf)] border-t border-ods-border p-[var(--spacing-system-sf)]", children: [
+            explanations.length > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "ul", { className: "w-full list-disc pl-5 text-ods-text-primary text-h6", children: explanations.map((expl, i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "li", { children: expl }, i)) }),
+            showFooterActions && status === "pending" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ApprovalWaitingLine, {}),
+            showFooterActions && (status === "pending" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex items-center gap-[var(--spacing-system-xsf)]", children: actionButtons }) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-[var(--spacing-system-xsf)]", children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ApprovalStatusTag, { status, resolvedByName }),
+              resolvedByName && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { className: "text-ods-text-secondary text-h6", children: [
+                "by ",
+                resolvedByName
+              ] })
+            ] }))
+          ] })
+        ]
+      }
+    );
+  }
+);
+ApprovalBatchMessage.displayName = "ApprovalBatchMessage";
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+exports.formatTicketRelativeTime = formatTicketRelativeTime; exports.formatTicketFullTimestamp = formatTicketFullTimestamp; exports.formatRelativeTime = formatRelativeTime; exports.formatRelativeTimeFrom = formatRelativeTimeFrom; exports.formatAbsoluteDate = formatAbsoluteDate; exports.formatDateTime = formatDateTime; exports.getDetailedTimeDifference = getDetailedTimeDifference; exports.isToday = isToday; exports.isWithinMinutes = isWithinMinutes; exports.createUTCTimestamp = createUTCTimestamp; exports.DESIGN_PALETTE = DESIGN_PALETTE; exports.getContrastRatio = getContrastRatio; exports.pickReadableTextColor = pickReadableTextColor; exports.extractDominantColor = extractDominantColor; exports.getBestContrastColor = getBestContrastColor; exports.analyzeImageColor = analyzeImageColor; exports.extractImageEdgeColorAsync = extractImageEdgeColorAsync; exports.getCurrentPlatform = getCurrentPlatform; exports.switchPlatformTheme = switchPlatformTheme; exports.getSemanticColor = getSemanticColor; exports.getPlatformConfig = getPlatformConfig; exports.usePlatformColors = usePlatformColors; exports.getReadableTextColor = getReadableTextColor; exports.HEX_PATTERN = HEX_PATTERN; exports.hexToRgb = hexToRgb2; exports.rgbToHex = rgbToHex; exports.deriveHoverColor = deriveHoverColor; exports.deriveActiveColor = deriveActiveColor; exports.rgbToHsl = rgbToHsl; exports.hslToRgb = hslToRgb; exports.ColorSwatch = ColorSwatch; exports.resolveTicketStatus = resolveTicketStatus; exports.getTicketStatusConfig = getTicketStatusConfig; exports.getTicketStatusTag = getTicketStatusTag; exports.kindToCanonicalStatus = kindToCanonicalStatus; exports.usesCanonicalStatusStyle = usesCanonicalStatusStyle; exports.resolveStatusTagProps = resolveStatusTagProps; exports.TicketStatusTag = TicketStatusTag; exports.StatusLine = StatusLine; exports.CHAT_BLOCK_FRAME_CLASS = CHAT_BLOCK_FRAME_CLASS; exports.CHAT_BLOCK_CLASS = CHAT_BLOCK_CLASS; exports.ExpandChevron = ExpandChevron; exports.useCollapsible = useCollapsible; exports.COMMAND_BODY_ARG_KEYS = COMMAND_BODY_ARG_KEYS; exports.getCommandText = getCommandText; exports.ArgRow = ArgRow; exports.ResultBlock = ResultBlock; exports.CommandBlock = CommandBlock; exports.ApprovalStatusTag = ApprovalStatusTag; exports.ApprovalWaitingLine = ApprovalWaitingLine; exports.ApprovalBatchMessage = ApprovalBatchMessage;