@opengeni/react 6.5.2-canary.41607687019001 → 6.7.0

package/dist/chunk-2RG7NIAS.js

@@ -0,0 +1,2936 @@
+"use client";
+import {
+  OPEN_WORKSTREAM_CONTROL_EVENT
+} from "./chunk-3IWPC6O3.js";
+import {
+  useCalmServiceFailure
+} from "./chunk-SVKPSCTH.js";
+import {
+  defaultChatComposerMessages
+} from "./chunk-DGMR6JEJ.js";
+import {
+  useVoiceInput
+} from "./chunk-SODC7T6L.js";
+import {
+  shouldRecallQueuedOnKey,
+  shouldSteerOnKey,
+  shouldSubmitOnKey
+} from "./chunk-MIHN76LX.js";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger
+} from "./chunk-6IWKHHRS.js";
+import {
+  ShimmerText,
+  useLightboxOptional
+} from "./chunk-XHIQ5I6N.js";
+import {
+  COMPOSER_VOICE_INPUT_START_EVENT,
+  ComposerFooterSignalProvider,
+  composerVoiceEventScope,
+  useComposerFooterSignal,
+  useComposerFooterSignalState
+} from "./chunk-6F34IWSA.js";
+import {
+  ComposerResponsiveContext
+} from "./chunk-XEA5BCMA.js";
+import {
+  useErrorMessage
+} from "./chunk-CM7LVUKC.js";
+import {
+  composerSubmissionErrorMessage
+} from "./chunk-5MOJZORA.js";
+import {
+  OPENGENI_UPDATING_ACTION_NOTICE,
+  OPENGENI_UPDATING_NOTICE,
+  isActionFailure
+} from "./chunk-5AIMVW6Y.js";
+import {
+  groupPickerRowsByBillingClass,
+  projectClientModelRows
+} from "./chunk-ZHC47M2B.js";
+import {
+  cn
+} from "./chunk-TXS65BB2.js";
+import {
+  singleSendText,
+  useOpenGeniText
+} from "./chunk-7T2ZE3VT.js";
+
+// src/commands/registry.ts
+import { formatErrorMessage } from "@opengeni/sdk";
+function parseCommandLine(value) {
+  if (value[0] !== "/") {
+    return null;
+  }
+  const body = value.slice(1);
+  const firstSpace = body.indexOf(" ");
+  if (firstSpace === -1) {
+    return { name: body, rest: "", hasTrailingSpace: false, args: [] };
+  }
+  const name = body.slice(0, firstSpace);
+  const rest = body.slice(firstSpace + 1);
+  return {
+    name,
+    rest,
+    hasTrailingSpace: true,
+    args: rest.split(/\s+/).filter((token) => token.length > 0)
+  };
+}
+var PERMISSION_SUPERUSER = "workspace:admin";
+function hasPermission(required, permissions) {
+  if (!required) {
+    return true;
+  }
+  return permissions.includes(required) || permissions.includes(PERMISSION_SUPERUSER);
+}
+function matchCommand(commands, value) {
+  const parsed = parseCommandLine(value);
+  if (!parsed) {
+    return null;
+  }
+  const token = parsed.name.toLowerCase();
+  return commands.find((command) => command.name === token || command.aliases?.includes(token)) ?? null;
+}
+function filterCommands(commands, token, ctx) {
+  const needle = token.toLowerCase();
+  return commands.filter((command) => {
+    if (!hasPermission(command.permission, ctx.permissions)) {
+      return false;
+    }
+    if (command.available && !command.available(ctx)) {
+      return false;
+    }
+    if (needle.length === 0) {
+      return true;
+    }
+    return command.name.startsWith(needle) || (command.aliases?.some((alias) => alias.startsWith(needle)) ?? false);
+  });
+}
+function argHint(args) {
+  if (!args || args.length === 0) {
+    return "";
+  }
+  return args.map((arg) => {
+    const label = arg.oneOf ? arg.oneOf.join("|") : arg.name;
+    return arg.required ? `<${label}>` : `[${label}]`;
+  }).join(" ");
+}
+function firstMissingRequiredArg(command, args) {
+  const required = (command.args ?? []).filter((arg) => arg.required);
+  for (let i = 0; i < required.length; i += 1) {
+    const value = args[i];
+    if (value === void 0 || value.length === 0) {
+      return required[i] ?? null;
+    }
+  }
+  return null;
+}
+function requireSession(t, ctx) {
+  if (!ctx.sessionId) {
+    throw new Error(t("commands.registry.noActiveSessionYetStart"));
+  }
+  return ctx.sessionId;
+}
+var hasSession = (ctx) => ctx.sessionId !== null;
+var defaultCommands = (t) => [
+  {
+    name: "help",
+    aliases: ["?"],
+    description: t("commands.registry.showAvailableCommands"),
+    run: (_args, ctx) => {
+      ctx.openHelp();
+      return { status: "ok" };
+    }
+  },
+  {
+    name: "clear-view",
+    description: t("commands.registry.clearTheLocalTimelineView"),
+    run: (_args, ctx) => {
+      const cleared = ctx.clearView();
+      if (!cleared) {
+        return {
+          status: "error",
+          message: t("commands.registry.thisViewCanTBe")
+        };
+      }
+      return { status: "ok", message: t("commands.registry.localViewCleared") };
+    }
+  },
+  {
+    name: "goal",
+    description: t("commands.registry.pauseOrResumeTheSession"),
+    permission: "sessions:control",
+    available: hasSession,
+    args: [
+      { name: "action", required: true, oneOf: ["pause", "resume"], description: "pause | resume" }
+    ],
+    run: async (args, ctx) => {
+      const sessionId = requireSession(t, ctx);
+      const action = args[0];
+      if (action !== "pause" && action !== "resume") {
+        return { status: "error", message: "Usage: /goal pause | /goal resume" };
+      }
+      try {
+        await ctx.client.updateGoal(ctx.workspaceId, sessionId, {
+          status: action === "pause" ? "paused" : "active"
+        });
+        return {
+          status: "ok",
+          message: action === "pause" ? t("commands.registry.goalPaused") : t("commands.registry.goalResumed")
+        };
+      } catch (cause) {
+        return {
+          status: "error",
+          message: commandErrorMessage(ctx, cause, goalErrorMessage(t, cause, action))
+        };
+      }
+    }
+  },
+  {
+    name: "compact",
+    description: t("commands.registry.compactTheConversationContextNow"),
+    permission: "sessions:control",
+    available: hasSession,
+    run: async (_args, ctx) => {
+      const sessionId = requireSession(t, ctx);
+      try {
+        const result = await ctx.client.compactSessionContext(ctx.workspaceId, sessionId);
+        return { status: "ok", message: result.message };
+      } catch (cause) {
+        return { status: "error", message: commandErrorMessage(ctx, cause) };
+      }
+    }
+  },
+  {
+    name: "clear",
+    description: t("commands.registry.clearTheConversationContextDestructive"),
+    permission: "sessions:control",
+    danger: true,
+    available: hasSession,
+    run: async (_args, ctx) => {
+      const sessionId = requireSession(t, ctx);
+      const confirmed = await ctx.confirm();
+      if (!confirmed) {
+        return { status: "ok", keepDraft: true };
+      }
+      try {
+        await ctx.client.clearSessionContext(ctx.workspaceId, sessionId);
+        return { status: "ok", message: t("commands.registry.contextCleared") };
+      } catch (cause) {
+        return {
+          status: "error",
+          message: commandErrorMessage(ctx, cause, clearErrorMessage(t, cause))
+        };
+      }
+    }
+  }
+];
+function commandErrorMessage(ctx, cause, message = formatErrorMessage(cause)) {
+  return ctx.formatError?.(cause, message) || message;
+}
+function statusCode(cause) {
+  if (cause && typeof cause === "object" && "status" in cause && typeof cause.status === "number") {
+    return cause.status;
+  }
+  return void 0;
+}
+function goalErrorMessage(t, cause, action) {
+  const code = statusCode(cause);
+  if (code === 404) {
+    return t("commands.registry.thisSessionHasNoGoal");
+  }
+  if (code === 409) {
+    return action === "resume" ? t("commands.registry.onlyAPausedGoalCan") : t("commands.registry.goalIsAlreadyInA");
+  }
+  return formatErrorMessage(cause);
+}
+function clearErrorMessage(t, cause) {
+  if (statusCode(cause) === 409) {
+    return t("commands.registry.pauseTheSessionAndWait");
+  }
+  return formatErrorMessage(cause);
+}
+
+// src/hooks/use-slash-commands.ts
+import { useCallback, useMemo, useRef, useState } from "react";
+function useSlashCommands(options) {
+  const formatError = useErrorMessage();
+  const { commands, context, handlers, value, setValue } = options;
+  const [highlight, setHighlight] = useState(0);
+  const [dismissedValue, setDismissedValue] = useState(null);
+  const dismissed = dismissedValue !== null && dismissedValue === value;
+  const navigatedRef = useRef(false);
+  const navTokenRef = useRef(value);
+  if (navTokenRef.current !== value) {
+    navTokenRef.current = value;
+    navigatedRef.current = false;
+  }
+  const parsed = useMemo(() => parseCommandLine(value), [value]);
+  const filterCtx = useMemo(
+    () => ({
+      sessionId: context?.sessionId ?? null,
+      status: context?.status ?? null,
+      permissions: context?.permissions ?? []
+    }),
+    [context?.sessionId, context?.status, context?.permissions]
+  );
+  const activeCommand = useMemo(() => {
+    if (!parsed || !parsed.hasTrailingSpace) {
+      return null;
+    }
+    return matchCommand(commands, value);
+  }, [commands, value, parsed]);
+  const items = useMemo(() => {
+    if (!parsed) {
+      return [];
+    }
+    if (activeCommand) {
+      return [activeCommand];
+    }
+    return filterCommands(commands, parsed.name, filterCtx);
+  }, [commands, parsed, activeCommand, filterCtx]);
+  const open = parsed !== null && items.length > 0 && !dismissed;
+  const isCommandDraft = parsed !== null && items.length > 0;
+  const clampedHighlight = items.length === 0 ? 0 : Math.min(highlight, items.length - 1);
+  const activeArgHint = activeCommand ? argHint(activeCommand.args) : "";
+  const buildContext = useCallback(
+    (command) => {
+      if (!context) {
+        return null;
+      }
+      return { ...context, ...handlers, formatError, confirm: () => handlers.confirm(command) };
+    },
+    [context, handlers, formatError]
+  );
+  const execute = useCallback(
+    async (command, args) => {
+      const ctx = buildContext(command);
+      if (!ctx) {
+        return;
+      }
+      try {
+        const result = await command.run(args, ctx);
+        if (result.message) {
+          ctx.notice({ tone: result.status === "ok" ? "ok" : "error", message: result.message });
+        }
+        if (result.status === "ok" && !result.keepDraft) {
+          setValue("");
+        }
+      } catch (cause) {
+        ctx.notice({ tone: "error", message: formatError(cause) });
+      }
+    },
+    [buildContext, setValue, formatError]
+  );
+  const autocomplete = useCallback(
+    (command) => {
+      setValue(`/${command.name} `);
+      setHighlight(0);
+    },
+    [setValue]
+  );
+  const autocompleteHighlighted = useCallback(() => {
+    const command = items[clampedHighlight];
+    if (command) {
+      autocomplete(command);
+    }
+  }, [items, clampedHighlight, autocomplete]);
+  const runningRef = useRef(false);
+  const runResolved = useCallback(
+    async (command, executionOptions) => {
+      if (!parsed || runningRef.current) {
+        return;
+      }
+      runningRef.current = true;
+      try {
+        const explicit = executionOptions?.explicit ?? false;
+        const nameMatchesToken = command.name === parsed.name.toLowerCase() || (command.aliases?.includes(parsed.name.toLowerCase()) ?? false);
+        if (!explicit && !activeCommand && !nameMatchesToken && !parsed.hasTrailingSpace) {
+          autocomplete(command);
+          return;
+        }
+        const args = nameMatchesToken || parsed.hasTrailingSpace ? parsed.args : [];
+        const missing = firstMissingRequiredArg(command, args);
+        if (missing) {
+          if (!parsed.hasTrailingSpace) {
+            autocomplete(command);
+          }
+          return;
+        }
+        await execute(command, args);
+      } finally {
+        runningRef.current = false;
+      }
+    },
+    [parsed, activeCommand, autocomplete, execute]
+  );
+  const runHighlighted = useCallback(async () => {
+    if (!parsed) {
+      return;
+    }
+    if (navigatedRef.current && !activeCommand) {
+      const highlighted = items[clampedHighlight];
+      if (highlighted) {
+        await runResolved(highlighted, { explicit: true });
+      }
+      return;
+    }
+    const token = parsed.name.toLowerCase();
+    const exact = items.find((item) => item.name === token || item.aliases?.includes(token));
+    const command = activeCommand ?? exact ?? items[clampedHighlight];
+    if (!command) {
+      return;
+    }
+    await runResolved(command);
+  }, [parsed, activeCommand, items, clampedHighlight, runResolved]);
+  const runAt = useCallback(
+    async (index) => {
+      const command = items[index];
+      if (!command) {
+        return;
+      }
+      await runResolved(command, { explicit: true });
+    },
+    [items, runResolved]
+  );
+  const onKeyDown = useCallback(
+    (event) => {
+      if (!open) {
+        return false;
+      }
+      switch (event.key) {
+        case "ArrowDown": {
+          event.preventDefault();
+          navigatedRef.current = true;
+          setHighlight(
+            (current) => items.length === 0 ? 0 : (Math.min(current, items.length - 1) + 1) % items.length
+          );
+          return true;
+        }
+        case "ArrowUp": {
+          event.preventDefault();
+          navigatedRef.current = true;
+          setHighlight((current) => {
+            const base = Math.min(current, items.length - 1);
+            return items.length === 0 ? 0 : (base - 1 + items.length) % items.length;
+          });
+          return true;
+        }
+        case "Tab": {
+          event.preventDefault();
+          autocompleteHighlighted();
+          return true;
+        }
+        case "Enter": {
+          if (event.shiftKey || event.nativeEvent?.isComposing) {
+            return false;
+          }
+          event.preventDefault();
+          void runHighlighted();
+          return true;
+        }
+        case "Escape": {
+          event.preventDefault();
+          setDismissedValue(value);
+          return true;
+        }
+        default:
+          return false;
+      }
+    },
+    [open, items, autocompleteHighlighted, runHighlighted, value]
+  );
+  return {
+    open,
+    isCommandDraft,
+    items,
+    highlight: clampedHighlight,
+    setHighlight,
+    activeCommand,
+    activeArgHint,
+    onKeyDown,
+    runHighlighted,
+    runAt,
+    autocompleteHighlighted
+  };
+}
+
+// src/components/command-palette.tsx
+import { AnimatePresence, motion } from "motion/react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function CommandPalette({
+  open,
+  items,
+  highlight,
+  onHighlight,
+  onRun,
+  argHintText,
+  listboxId,
+  label: labelProp,
+  dangerLabel = "danger"
+}) {
+  const t = useOpenGeniText();
+  const label = labelProp === void 0 ? t("commandPalette.slashCommands") : labelProp;
+  return /* @__PURE__ */ jsx(AnimatePresence, { children: open ? /* @__PURE__ */ jsxs(
+    motion.div,
+    {
+      initial: { opacity: 0, y: 6, scale: 0.99 },
+      animate: { opacity: 1, y: 0, scale: 1 },
+      exit: { opacity: 0, y: 6, scale: 0.99 },
+      transition: { duration: 0.13, ease: "easeOut" },
+      className: cn(
+        "absolute bottom-full left-0 right-0 z-20 mb-2 overflow-hidden",
+        "rounded-og-lg border border-og-border bg-og-surface-2 shadow-og-sm"
+      ),
+      children: [
+        /* @__PURE__ */ jsx(
+          "ul",
+          {
+            id: listboxId,
+            role: "listbox",
+            "aria-label": label,
+            className: "max-h-72 overflow-y-auto py-1",
+            children: items.map((command, index) => {
+              const selected = index === highlight;
+              const hint = argHint(command.args);
+              return /* @__PURE__ */ jsxs(
+                "li",
+                {
+                  id: `${listboxId}-option-${index}`,
+                  role: "option",
+                  "aria-selected": selected,
+                  onMouseEnter: () => onHighlight(index),
+                  onMouseDown: (event) => {
+                    event.preventDefault();
+                    onRun(index);
+                  },
+                  className: cn(
+                    "mx-1 flex cursor-pointer items-center gap-2 rounded-og-md px-2.5 py-1.5",
+                    "transition-colors duration-100",
+                    selected ? "bg-og-accent/15 text-og-fg" : "text-og-fg-muted hover:bg-og-surface-3"
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 items-baseline gap-1.5", children: [
+                      /* @__PURE__ */ jsxs(
+                        "span",
+                        {
+                          className: cn(
+                            "font-mono text-[13px]",
+                            selected ? "text-og-accent" : "text-og-fg"
+                          ),
+                          children: [
+                            "/",
+                            command.name
+                          ]
+                        }
+                      ),
+                      hint ? /* @__PURE__ */ jsx("span", { className: "truncate font-mono text-[11px] text-og-fg-subtle", children: hint }) : null
+                    ] }),
+                    /* @__PURE__ */ jsxs("span", { className: "ml-auto flex items-center gap-1.5", children: [
+                      command.danger ? /* @__PURE__ */ jsx("span", { className: "rounded-og-xs bg-og-status-failed/15 px-1 text-[10px] uppercase tracking-wide text-og-status-failed", children: dangerLabel }) : null,
+                      /* @__PURE__ */ jsx("span", { className: "og-command-description truncate text-[12px] text-og-fg-subtle max-sm:hidden", children: command.description })
+                    ] })
+                  ]
+                },
+                command.name
+              );
+            })
+          }
+        ),
+        argHintText ? /* @__PURE__ */ jsx("div", { className: "border-t border-og-border px-3 py-1.5 font-mono text-[11px] text-og-fg-subtle", children: argHintText }) : null
+      ]
+    }
+  ) : null });
+}
+
+// src/components/model-picker.tsx
+import { modelDisplayName } from "@opengeni/sdk/model-display";
+import { ChevronDownIcon } from "lucide-react";
+import { useId, useMemo as useMemo2 } from "react";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var EMPTY_CLIENT_MODELS = [];
+function isCodexClientModel(model) {
+  return model.id.startsWith("codex/") || model.source === "codex";
+}
+function isCodexPickerRow(row) {
+  return row.id.startsWith("codex/") || row.catalog.source === "codex";
+}
+function applyCodexOnlyRows(t, rows, codexOnly) {
+  if (!codexOnly) return rows;
+  return rows.map((row) => {
+    if (isCodexPickerRow(row)) return row;
+    return {
+      ...row,
+      selectable: false,
+      unavailableReason: row.unavailableReason ?? t("modelPicker.codexOnlySession")
+    };
+  });
+}
+function providerGroups(models, codexOnly) {
+  const byProvider = /* @__PURE__ */ new Map();
+  for (const model of models) {
+    let group = byProvider.get(model.provider);
+    if (!group) {
+      group = { label: model.providerLabel, models: [] };
+      byProvider.set(model.provider, group);
+    }
+    group.models.push({
+      ...model,
+      optionDisabled: codexOnly && !isCodexClientModel(model)
+    });
+  }
+  const groups = [...byProvider.values()];
+  if (codexOnly) {
+    const codexIndex = groups.findIndex(
+      (group) => group.models.some((model) => !model.optionDisabled && isCodexClientModel(model))
+    );
+    if (codexIndex > 0) groups.unshift(...groups.splice(codexIndex, 1));
+  }
+  return groups;
+}
+function ModelPicker({
+  models = EMPTY_CLIENT_MODELS,
+  rows,
+  value,
+  onChange,
+  disabled,
+  className,
+  label: labelProp,
+  codexOnly = false
+}) {
+  const t = useOpenGeniText();
+  const label = labelProp === void 0 ? t("modelPicker.model") : labelProp;
+  const selectId = useId();
+  const effectiveRows = useMemo2(
+    () => rows && rows.length > 0 ? applyCodexOnlyRows(t, rows, codexOnly) : [],
+    [rows, codexOnly, t]
+  );
+  const billingGroups = useMemo2(
+    () => effectiveRows.length > 0 ? groupPickerRowsByBillingClass(t, effectiveRows, { codexOnly, selectedId: value }) : [],
+    [effectiveRows, codexOnly, value, t]
+  );
+  const providerGroupList = useMemo2(() => providerGroups(models, codexOnly), [models, codexOnly]);
+  const modelLabels = useMemo2(
+    () => new Map(projectClientModelRows(t, models).map((row) => [row.id, row.label])),
+    [models, t]
+  );
+  const useBillingGroups = Boolean(effectiveRows.length);
+  if (models.length === 0 && effectiveRows.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs2("span", { className: cn("relative inline-flex items-center", className), children: [
+    /* @__PURE__ */ jsx2("label", { htmlFor: selectId, className: "sr-only", children: label }),
+    /* @__PURE__ */ jsx2(
+      "select",
+      {
+        id: selectId,
+        value: value ?? "",
+        onChange: (event) => onChange(event.target.value),
+        disabled: disabled === true,
+        "aria-label": label,
+        className: cn(
+          "og-model-picker-native h-8 max-w-[180px] cursor-pointer appearance-none truncate rounded-og-md bg-transparent pointer-coarse:h-11",
+          "py-0 pl-2 pr-6 text-[13px] text-og-fg-muted",
+          "transition-colors duration-150 hover:bg-og-surface-2 hover:text-og-fg",
+          "focus:outline-hidden focus-visible:outline-hidden",
+          "disabled:cursor-not-allowed disabled:opacity-50"
+        ),
+        children: useBillingGroups ? billingGroups.map((group) => /* @__PURE__ */ jsx2("optgroup", { label: group.label, children: group.rows.map((row) => /* @__PURE__ */ jsx2("option", { value: row.id, disabled: !row.selectable, children: row.unavailableReason ? `${row.label} (${row.unavailableReason})` : row.label }, row.id)) }, group.billingClass)) : providerGroupList.map((group) => /* @__PURE__ */ jsx2("optgroup", { label: group.label, children: group.models.map((model) => /* @__PURE__ */ jsx2("option", { value: model.id, disabled: model.optionDisabled, children: modelLabels.get(model.id) ?? modelDisplayName(model) }, model.id)) }, group.label))
+      }
+    ),
+    /* @__PURE__ */ jsx2(
+      ChevronDownIcon,
+      {
+        "aria-hidden": true,
+        className: "pointer-events-none absolute right-1.5 size-3.5 text-og-fg-subtle"
+      }
+    )
+  ] });
+}
+
+// src/components/composer.tsx
+import {
+  AppWindowIcon,
+  ArrowUpIcon,
+  ChevronDownIcon as ChevronDownIcon2,
+  FileIcon,
+  ImageIcon,
+  LoaderCircleIcon,
+  PaperclipIcon,
+  PauseIcon,
+  PlayIcon,
+  RotateCwIcon,
+  SquareIcon,
+  XIcon
+} from "lucide-react";
+import { AnimatePresence as AnimatePresence2, motion as motion2 } from "motion/react";
+import {
+  cloneElement,
+  createContext,
+  forwardRef,
+  useCallback as useCallback2,
+  useContext,
+  useEffect,
+  useId as useId2,
+  useLayoutEffect,
+  useMemo as useMemo3,
+  useRef as useRef2,
+  useState as useState2
+} from "react";
+import { Fragment, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function ComposerTip({
+  tip,
+  children
+}) {
+  if (!tip) return children;
+  return cloneElement(children, { title: tip });
+}
+var HELD_SEND_LIMIT_MS = 3e4;
+var composerHeightMirror = null;
+function measureComposerContentHeight(textarea) {
+  if (typeof document === "undefined") {
+    return textarea.scrollHeight;
+  }
+  const width = textarea.clientWidth;
+  if (width <= 0) {
+    return textarea.offsetHeight;
+  }
+  let mirror = composerHeightMirror;
+  if (!mirror) {
+    mirror = document.createElement("textarea");
+    mirror.setAttribute("aria-hidden", "true");
+    mirror.tabIndex = -1;
+    mirror.rows = 1;
+    mirror.style.cssText = "position:fixed;top:0;left:-100000px;visibility:hidden;pointer-events:none;height:auto;min-height:0;max-height:none;overflow:hidden;z-index:-1;";
+    composerHeightMirror = mirror;
+  }
+  const style = getComputedStyle(textarea);
+  mirror.style.width = `${width}px`;
+  mirror.style.boxSizing = style.boxSizing;
+  mirror.style.font = style.font;
+  mirror.style.fontSize = style.fontSize;
+  mirror.style.fontFamily = style.fontFamily;
+  mirror.style.fontWeight = style.fontWeight;
+  mirror.style.fontStyle = style.fontStyle;
+  mirror.style.letterSpacing = style.letterSpacing;
+  mirror.style.lineHeight = style.lineHeight;
+  mirror.style.textTransform = style.textTransform;
+  mirror.style.paddingTop = style.paddingTop;
+  mirror.style.paddingRight = style.paddingRight;
+  mirror.style.paddingBottom = style.paddingBottom;
+  mirror.style.paddingLeft = style.paddingLeft;
+  mirror.style.borderTopWidth = style.borderTopWidth;
+  mirror.style.borderRightWidth = style.borderRightWidth;
+  mirror.style.borderBottomWidth = style.borderBottomWidth;
+  mirror.style.borderLeftWidth = style.borderLeftWidth;
+  mirror.style.borderStyle = style.borderStyle;
+  mirror.style.whiteSpace = style.whiteSpace;
+  mirror.style.wordBreak = style.wordBreak;
+  mirror.style.overflowWrap = style.overflowWrap;
+  mirror.value = textarea.value;
+  if (!mirror.isConnected) {
+    document.documentElement.appendChild(mirror);
+  }
+  return mirror.scrollHeight;
+}
+function applyComposerTextareaHeight(textarea, maxPx = 220, measure = measureComposerContentHeight) {
+  const before = textarea.offsetHeight;
+  const nextPx = Math.min(
+    textarea.scrollHeight > textarea.clientHeight + 1 ? textarea.scrollHeight : measure(textarea),
+    maxPx
+  );
+  if (Math.abs(nextPx - before) < 1) {
+    return;
+  }
+  textarea.style.height = `${nextPx}px`;
+}
+var WORKING_CONTROLS_LINGER_MS = 1e3;
+function useLingeringTrue(value, lingerMs) {
+  const [state, setState] = useState2({ value, lingering: false });
+  let current = state;
+  if (state.value !== value) {
+    current = { value, lingering: state.value && !value };
+    setState(current);
+  }
+  const { lingering } = current;
+  const currentValue = current.value;
+  useEffect(() => {
+    if (!lingering || currentValue) return;
+    const timer = setTimeout(
+      () => setState((latest) => latest.value ? latest : { value: false, lingering: false }),
+      lingerMs
+    );
+    return () => clearTimeout(timer);
+  }, [currentValue, lingering, lingerMs]);
+  return current.value || current.lingering;
+}
+function useChatComposerController({
+  delivery,
+  draft,
+  control,
+  effectiveControl,
+  queuedAheadCount = 0,
+  canControlWorkspace = false,
+  controlLinks,
+  disabled = false,
+  attachments,
+  commands: commandsProp,
+  commandContext,
+  onClearView,
+  onPaste,
+  messages: messageOverrides,
+  runControl = "pause",
+  running = false,
+  queuedRecall
+}) {
+  const t = useOpenGeniText();
+  const commands = useMemo3(() => commandsProp ?? defaultCommands(t), [commandsProp, t]);
+  const formatError = useErrorMessage();
+  const singleSend = delivery.singleSend === true;
+  const deliveryWorking = delivery.working ?? true;
+  const working = deliveryWorking;
+  const workstreamWorking = useLingeringTrue(
+    deliveryWorking || running,
+    WORKING_CONTROLS_LINGER_MS
+  );
+  const messages = useMemo3(
+    () => ({
+      ...defaultChatComposerMessages(singleSend ? singleSendText(t) : t),
+      ...messageOverrides
+    }),
+    [messageOverrides, singleSend, t]
+  );
+  const id = useId2();
+  const rootRef = useRef2(null);
+  const textareaRef = useRef2(null);
+  const pauseButtonRef = useRef2(null);
+  const fileInputRef = useRef2(null);
+  const listboxId = useId2();
+  const controlPaused = effectiveControl?.state === "paused";
+  const [stoppedHere, setStoppedHere] = useState2(false);
+  useEffect(() => {
+    if (!controlPaused) setStoppedHere(false);
+  }, [controlPaused]);
+  const resumesOnSend = runControl === "stop" && stoppedHere && controlPaused && effectiveControl?.directState === "paused" && effectiveControl.additionalBlockerCount === 0 && queuedAheadCount === 0;
+  const paused = controlPaused && !resumesOnSend;
+  const [controlDetailsOpen, setControlDetailsOpen] = useState2(false);
+  const [paletteMounted, setPaletteMounted] = useState2(false);
+  const [submitting, setSubmitting] = useState2(false);
+  const [submittingMode, setSubmittingMode] = useState2(null);
+  const submittingRef = useRef2(false);
+  const controlOperationRef = useRef2(false);
+  const deliveryValue = delivery.value;
+  const setDeliveryValue = delivery.setValue;
+  const mountedRef = useRef2(true);
+  const deliveredValueRef = useRef2(deliveryValue);
+  const liveValueRef = useRef2(deliveryValue);
+  const [renderedValue, setRenderedValue] = useState2(deliveryValue);
+  const deliveryChanged = deliveryValue !== deliveredValueRef.current;
+  if (deliveryChanged) {
+    deliveredValueRef.current = deliveryValue;
+    liveValueRef.current = deliveryValue;
+  }
+  const setComposerValue = useCallback2(
+    (next) => {
+      liveValueRef.current = next;
+      setRenderedValue(next);
+      setDeliveryValue(next);
+    },
+    [setDeliveryValue]
+  );
+  const visibleValue = deliveryChanged ? deliveryValue : renderedValue;
+  useLayoutEffect(() => {
+    if (renderedValue !== liveValueRef.current) {
+      setRenderedValue(liveValueRef.current);
+    }
+  }, [deliveryValue, renderedValue]);
+  useEffect(() => {
+    mountedRef.current = true;
+    return () => {
+      mountedRef.current = false;
+    };
+  }, []);
+  useEffect(() => {
+    const openControl = (event) => {
+      const requestedId = event instanceof CustomEvent && isRecord(event.detail) && typeof event.detail.composerId === "string" ? event.detail.composerId : null;
+      if (requestedId && requestedId !== id) return;
+      if (!requestedId) {
+        const roots = document.querySelectorAll("[data-og-composer-id]");
+        if (roots.length > 1 && !rootRef.current?.contains(document.activeElement)) return;
+      }
+      textareaRef.current?.scrollIntoView({ block: "end", behavior: "smooth" });
+      if (paused) {
+        setControlDetailsOpen(true);
+        return;
+      }
+      window.requestAnimationFrame(() => pauseButtonRef.current?.focus());
+    };
+    document.addEventListener(OPEN_WORKSTREAM_CONTROL_EVENT, openControl);
+    return () => document.removeEventListener(OPEN_WORKSTREAM_CONTROL_EVENT, openControl);
+  }, [id, paused]);
+  const blockedByAttachment = attachments?.hasUnresolved === true;
+  const [dragging, setDragging] = useState2(false);
+  const dragCarriesFiles = (event) => event.dataTransfer !== null && [...event.dataTransfer.types].includes("Files");
+  const handleDragOver = useCallback2(
+    (event) => {
+      if (!attachments || !dragCarriesFiles(event)) return;
+      event.preventDefault();
+      if (!disabled) setDragging(true);
+    },
+    [attachments, disabled]
+  );
+  const handleDragLeave = useCallback2(
+    (event) => {
+      if (!attachments) return;
+      if (event.currentTarget.contains(event.relatedTarget)) return;
+      setDragging(false);
+    },
+    [attachments]
+  );
+  const handleDrop = useCallback2(
+    (event) => {
+      if (!attachments || !dragCarriesFiles(event)) return;
+      event.preventDefault();
+      setDragging(false);
+      if (!disabled && event.dataTransfer.files.length > 0)
+        attachments.addFiles(event.dataTransfer.files);
+    },
+    [attachments, disabled]
+  );
+  useEffect(() => {
+    if (disabled) setDragging(false);
+  }, [disabled]);
+  const [notice, setNotice] = useState2(null);
+  const [helpOpen, setHelpOpen] = useState2(false);
+  const [confirmState, setConfirmState] = useState2(null);
+  const pendingConfirm = useRef2(null);
+  const settleConfirmation = useCallback2((confirmed) => {
+    const resolve = pendingConfirm.current;
+    pendingConfirm.current = null;
+    setConfirmState(null);
+    resolve?.(confirmed);
+  }, []);
+  useEffect(
+    () => () => {
+      pendingConfirm.current?.(false);
+      pendingConfirm.current = null;
+    },
+    []
+  );
+  const resizeInputRafRef = useRef2(null);
+  const resizeInput = useCallback2(() => {
+    if (resizeInputRafRef.current !== null) {
+      return;
+    }
+    resizeInputRafRef.current = requestAnimationFrame(() => {
+      resizeInputRafRef.current = null;
+      const textarea = textareaRef.current;
+      if (!textarea) {
+        return;
+      }
+      applyComposerTextareaHeight(textarea, 220);
+    });
+  }, []);
+  useEffect(() => resizeInput(), [resizeInput, visibleValue]);
+  useEffect(
+    () => () => {
+      if (resizeInputRafRef.current !== null) {
+        cancelAnimationFrame(resizeInputRafRef.current);
+        resizeInputRafRef.current = null;
+      }
+    },
+    []
+  );
+  const handlers = useMemo3(
+    () => ({
+      notice: (next) => {
+        setNotice(next);
+        delivery.clearError();
+      },
+      openHelp: () => setHelpOpen(true),
+      clearView: () => {
+        if (!onClearView) return false;
+        onClearView();
+        return true;
+      },
+      confirm: (command) => new Promise((resolve) => {
+        pendingConfirm.current?.(false);
+        pendingConfirm.current = resolve;
+        setConfirmState({ command, resolve: settleConfirmation });
+      })
+    }),
+    [delivery, onClearView, settleConfirmation]
+  );
+  const palette = useSlashCommands({
+    commands,
+    context: commandContext,
+    handlers,
+    value: visibleValue,
+    setValue: setComposerValue
+  });
+  const paletteEnabled = commandContext !== void 0;
+  const commandDraftBlocked = paletteEnabled && palette.isCommandDraft;
+  const annotationsIncomplete = (delivery.annotations ?? []).some(
+    (annotation) => annotation.note.trim().length === 0
+  );
+  const preparing = delivery.preparing === true;
+  const hasDraftText = visibleValue.trim().length > 0 || (attachments?.attachments.length ?? 0) > 0;
+  const waitsForPreparation = preparing && hasDraftText;
+  const heldSendRef = useRef2(null);
+  const heldSendNoticeRef = useRef2(null);
+  const clearHeldSendNotice = useCallback2(() => {
+    const shown = heldSendNoticeRef.current;
+    if (!shown) return;
+    heldSendNoticeRef.current = null;
+    setNotice((current) => current === shown ? null : current);
+  }, []);
+  const latestSendRef = useRef2({ delivery, resumesOnSend, singleSend });
+  useLayoutEffect(() => {
+    latestSendRef.current = { delivery, resumesOnSend, singleSend };
+  });
+  const deliveryCanSend = delivery.canSend;
+  useEffect(() => {
+    const release = heldSendRef.current;
+    if (!release) return;
+    const ready = deliveryCanSend && !disabled;
+    if (!ready && waitsForPreparation) return;
+    heldSendRef.current = null;
+    release(ready);
+  }, [deliveryCanSend, disabled, waitsForPreparation]);
+  useEffect(
+    () => () => {
+      heldSendRef.current?.(false);
+      heldSendRef.current = null;
+    },
+    []
+  );
+  const submitBlocker = disabled ? "disabled" : blockedByAttachment ? "attachment" : delivery.sending || submitting ? "sending" : commandDraftBlocked ? "command" : annotationsIncomplete ? "annotations" : delivery.canSend || waitsForPreparation ? null : "empty";
+  const canSubmit = submitBlocker === null;
+  const submit = useCallback2(
+    async (mode) => {
+      clearHeldSendNotice();
+      if (commandDraftBlocked) {
+        setNotice({ tone: "error", message: messages.slashCommandBlocked });
+        delivery.clearError();
+        return false;
+      }
+      if (disabled || blockedByAttachment || delivery.sending || submittingRef.current)
+        return false;
+      if (annotationsIncomplete) {
+        setNotice({ tone: "error", message: messages.annotationNotesRequired });
+        delivery.clearError();
+        delivery.requestAnnotationReview?.();
+        return false;
+      }
+      if (!delivery.canSend && !waitsForPreparation) return false;
+      submittingRef.current = true;
+      setSubmitting(true);
+      setSubmittingMode(mode);
+      try {
+        if (!delivery.canSend) {
+          let gaveUp = false;
+          const ready = await new Promise((resolve) => {
+            const limit = window.setTimeout(() => {
+              if (heldSendRef.current !== settle) return;
+              heldSendRef.current = null;
+              gaveUp = true;
+              resolve(false);
+            }, HELD_SEND_LIMIT_MS);
+            const settle = (value) => {
+              window.clearTimeout(limit);
+              resolve(value);
+            };
+            heldSendRef.current = settle;
+          });
+          if (!ready) {
+            if (gaveUp && mountedRef.current) {
+              const gaveUpNotice = {
+                tone: "error",
+                message: messages.heldSendGaveUp ?? t("composerMessages.heldSendGaveUp")
+              };
+              heldSendNoticeRef.current = gaveUpNotice;
+              setNotice(gaveUpNotice);
+            }
+            return false;
+          }
+        }
+        const current = latestSendRef.current;
+        if (current.resumesOnSend) return await current.delivery.steer();
+        if (mode !== "steer" || current.singleSend) return await current.delivery.send();
+        return current.delivery.sendAlternate ? await current.delivery.sendAlternate() : await current.delivery.steer();
+      } finally {
+        submittingRef.current = false;
+        if (mountedRef.current) {
+          setSubmitting(false);
+          setSubmittingMode(null);
+        }
+      }
+    },
+    [
+      annotationsIncomplete,
+      blockedByAttachment,
+      clearHeldSendNotice,
+      commandDraftBlocked,
+      delivery,
+      disabled,
+      messages.annotationNotesRequired,
+      messages.heldSendGaveUp,
+      messages.slashCommandBlocked,
+      t,
+      waitsForPreparation
+    ]
+  );
+  const recallingRef = useRef2(false);
+  const caretToEndRef = useRef2(false);
+  const placeCaretAtEnd = useCallback2(() => {
+    const textarea = textareaRef.current;
+    if (!textarea) return;
+    textarea.focus();
+    const end = textarea.value.length;
+    textarea.setSelectionRange(end, end);
+  }, []);
+  useLayoutEffect(() => {
+    if (!caretToEndRef.current) return;
+    caretToEndRef.current = false;
+    placeCaretAtEnd();
+  }, [placeCaretAtEnd, visibleValue]);
+  const recallQueued = useCallback2(async () => {
+    if (!queuedRecall || recallingRef.current) return;
+    recallingRef.current = true;
+    try {
+      const outcome = await queuedRecall.recall();
+      if (!mountedRef.current) return;
+      if (outcome === "recalled") {
+        caretToEndRef.current = true;
+        window.requestAnimationFrame(() => {
+          if (!caretToEndRef.current) return;
+          caretToEndRef.current = false;
+          placeCaretAtEnd();
+        });
+      } else if (outcome === "already_sent") {
+        setNotice({
+          tone: "ok",
+          message: messages.queuedPromptAlreadySent ?? t("composerMessages.queuedPromptAlreadySent")
+        });
+      }
+    } catch {
+    } finally {
+      recallingRef.current = false;
+    }
+  }, [messages.queuedPromptAlreadySent, placeCaretAtEnd, queuedRecall, t]);
+  const handleKeyDown = useCallback2(
+    (event) => {
+      if (paletteEnabled && paletteMounted && palette.onKeyDown(event)) return;
+      if (queuedRecall?.available && !disabled && shouldRecallQueuedOnKey(event, {
+        value: event.currentTarget.value,
+        selectionStart: event.currentTarget.selectionStart,
+        selectionEnd: event.currentTarget.selectionEnd,
+        hasOtherContent: (delivery.annotations?.length ?? 0) > 0 || (draft?.restoredResources.length ?? 0) > 0 || (attachments?.attachments.length ?? 0) > 0,
+        popupOpen: paletteEnabled && paletteMounted && palette.open
+      })) {
+        event.preventDefault();
+        void recallQueued();
+        return;
+      }
+      if (!shouldSubmitOnKey(event)) return;
+      event.preventDefault();
+      void submit(shouldSteerOnKey(event) ? "steer" : "queue");
+    },
+    [
+      attachments,
+      delivery.annotations,
+      disabled,
+      draft?.restoredResources,
+      palette,
+      paletteEnabled,
+      paletteMounted,
+      queuedRecall,
+      recallQueued,
+      submit
+    ]
+  );
+  const handlePaste = useCallback2(
+    (event) => {
+      if (disabled) return;
+      onPaste?.(event);
+      attachments?.addFromPaste(event);
+    },
+    [attachments, disabled, onPaste]
+  );
+  const handleFileChange = useCallback2(
+    (event) => {
+      if (!disabled && event.target.files) attachments?.addFiles(event.target.files);
+      event.target.value = "";
+    },
+    [attachments, disabled]
+  );
+  const helpCommands = useMemo3(
+    () => commands.filter((command) => {
+      if (command.permission && commandContext) {
+        const permissions = commandContext.permissions;
+        return permissions.includes(command.permission) || permissions.includes("workspace:admin");
+      }
+      return true;
+    }),
+    [commandContext, commands]
+  );
+  const calmServiceFailure = useCalmServiceFailure(delivery.error);
+  const calmActionFailure = calmServiceFailure && isActionFailure(delivery.error);
+  const serviceUpdating = calmServiceFailure && !calmActionFailure || delivery.reconnecting === true;
+  const activeNotice = notice ?? (calmActionFailure ? { tone: "ok", message: OPENGENI_UPDATING_ACTION_NOTICE(t) } : delivery.error && !calmServiceFailure ? {
+    tone: "error",
+    message: /control changed|paused while/i.test(delivery.error.message) ? messages.controlChangedError : formatError(
+      delivery.error,
+      composerSubmissionErrorMessage(
+        t,
+        delivery.error,
+        delivery.canBuyCredits ?? true
+      ) || messages.sendFailedError
+    )
+  } : null);
+  useEffect(() => {
+    if (notice?.tone !== "ok") return;
+    const timer = window.setTimeout(
+      () => setNotice((current) => current === notice ? null : current),
+      2400
+    );
+    return () => window.clearTimeout(timer);
+  }, [notice]);
+  useEffect(() => {
+    if (annotationsIncomplete) return;
+    setNotice(
+      (current) => current?.message === messages.annotationNotesRequired ? null : current
+    );
+  }, [annotationsIncomplete, messages.annotationNotesRequired]);
+  const attachmentCount = attachments?.attachments.length ?? 0;
+  useEffect(() => {
+    clearHeldSendNotice();
+  }, [attachmentCount, clearHeldSendNotice, visibleValue]);
+  const runControlOperation = useCallback2(async (operation) => {
+    if (controlOperationRef.current) return false;
+    controlOperationRef.current = true;
+    try {
+      await operation();
+      return true;
+    } finally {
+      controlOperationRef.current = false;
+    }
+  }, []);
+  const pause = useCallback2(
+    async (reason) => {
+      if (!control || control.pausing || control.resuming) return false;
+      return await runControlOperation(() => control.pause(reason));
+    },
+    [control, runControlOperation]
+  );
+  const resume = useCallback2(
+    async (reason) => {
+      if (!control || control.pausing || control.resuming) return false;
+      return await runControlOperation(() => control.resume(reason));
+    },
+    [control, runControlOperation]
+  );
+  const resumeScope = useCallback2(
+    async (option) => {
+      if (!control || control.pausing || control.resuming) return false;
+      return await runControlOperation(() => control.resumeScope(option));
+    },
+    [control, runControlOperation]
+  );
+  const stop = useCallback2(async () => {
+    const stopped = await pause();
+    if (stopped && mountedRef.current) setStoppedHere(true);
+    return stopped;
+  }, [pause]);
+  return {
+    id,
+    rootRef,
+    textareaRef,
+    pauseButtonRef,
+    fileInputRef,
+    listboxId,
+    effectiveControl,
+    queuedAheadCount,
+    canControlWorkspace,
+    controlLinks,
+    disabled,
+    attachments,
+    messages,
+    sending: delivery.sending || submitting,
+    error: delivery.error,
+    clearError: delivery.clearError,
+    hasDraftState: draft !== void 0,
+    draftConflict: draft?.draftConflict ?? null,
+    draftSaving: draft?.draftSaving ?? false,
+    restoredResources: draft?.restoredResources ?? [],
+    removeRestoredResource: draft?.removeRestoredResource,
+    resolveDraftConflict: draft?.resolveDraftConflict,
+    hasControl: control !== void 0,
+    runControl,
+    running,
+    pausing: control?.pausing ?? false,
+    resuming: control?.resuming ?? false,
+    pause,
+    stop,
+    resume,
+    resumeScope,
+    paused,
+    controlDetailsOpen,
+    setControlDetailsOpen,
+    paletteMounted,
+    setPaletteMounted,
+    dragging,
+    handleDragOver,
+    handleDragLeave,
+    handleDrop,
+    palette,
+    paletteEnabled,
+    commandDraftBlocked,
+    confirmState,
+    settleConfirmation,
+    helpOpen,
+    setHelpOpen,
+    helpCommands,
+    activeNotice,
+    /** Opengeni is updating: show the calm reconnecting line, not an error. */
+    serviceUpdating,
+    serviceUpdatingMessage: OPENGENI_UPDATING_NOTICE(t),
+    canSubmit,
+    submitBlocker,
+    submit,
+    busySend: delivery.busySend ?? "queue",
+    singleSend,
+    /** The agent works here (a turn runs or messages wait); Send uses its working wording and the Steer/Queue choice shows. */
+    working,
+    /** This conversation, work it started or a pending wake keeps it working; Pause is offered (lingers briefly). */
+    workstreamWorking,
+    alternateSend: delivery.sendAlternate && working ? delivery.alternateSend ?? null : null,
+    submittingMode,
+    handleKeyDown,
+    handlePaste,
+    handleFileChange,
+    focusInput: () => textareaRef.current?.focus(),
+    setValue: setComposerValue,
+    value: visibleValue
+  };
+}
+var ComposerContext = createContext(null);
+function useComposerController() {
+  const controller = useContext(ComposerContext);
+  if (!controller) throw new Error("useChatComposer must be used inside <Composer.Root>");
+  return controller;
+}
+function useChatComposer() {
+  return useComposerController();
+}
+function isRecord(value) {
+  return typeof value === "object" && value !== null;
+}
+var Root = forwardRef(function ComposerRoot({ controller, children, className, style, responsiveBasis = "viewport", ...props }, forwardedRef) {
+  const responsiveRootRef = useRef2(null);
+  const responsiveContext = useMemo3(
+    () => ({ responsiveBasis, rootRef: responsiveRootRef }),
+    [responsiveBasis]
+  );
+  return /* @__PURE__ */ jsx3(ComposerContext.Provider, { value: controller, children: /* @__PURE__ */ jsx3(ComposerResponsiveContext.Provider, { value: responsiveContext, children: /* @__PURE__ */ jsx3(TooltipProvider, { delayDuration: 300, children: /* @__PURE__ */ jsxs3(
+    "div",
+    {
+      ...props,
+      ref: mergeRefs(controller.rootRef, responsiveRootRef, forwardedRef),
+      "data-og-composer-id": controller.id,
+      "data-og-responsive-basis": responsiveBasis,
+      className: cn("og-root og-composer", className),
+      style: { paddingBottom: "env(safe-area-inset-bottom)", ...style },
+      children: [
+        children,
+        /* @__PURE__ */ jsx3(ComposerAnnouncements, {})
+      ]
+    }
+  ) }) }) });
+});
+var Frame = forwardRef(function ComposerFrame({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx3("div", { ...props, ref, className: cn("relative", className) });
+});
+function CommandPalette2({ className }) {
+  const controller = useComposerController();
+  const setPaletteMounted = controller.setPaletteMounted;
+  useEffect(() => {
+    setPaletteMounted(true);
+    return () => setPaletteMounted(false);
+  }, [setPaletteMounted]);
+  if (!controller.paletteEnabled) return null;
+  return /* @__PURE__ */ jsx3("div", { className, children: /* @__PURE__ */ jsx3(
+    CommandPalette,
+    {
+      open: controller.palette.open && controller.confirmState === null,
+      items: controller.palette.items,
+      highlight: controller.palette.highlight,
+      onHighlight: controller.palette.setHighlight,
+      onRun: (index) => {
+        controller.palette.setHighlight(index);
+        void controller.palette.runAt(index);
+      },
+      argHintText: controller.palette.activeArgHint,
+      listboxId: controller.listboxId,
+      label: controller.messages.slashCommandsLabel,
+      dangerLabel: controller.messages.danger
+    }
+  ) });
+}
+var Surface = forwardRef(function ComposerSurface({ className, children, ...props }, ref) {
+  const controller = useComposerController();
+  return /* @__PURE__ */ jsxs3(
+    "div",
+    {
+      "data-og-composer-surface": "",
+      ...props,
+      ref,
+      onDragOver: controller.attachments ? controller.handleDragOver : void 0,
+      onDragLeave: controller.attachments ? controller.handleDragLeave : void 0,
+      onDrop: controller.attachments ? controller.handleDrop : void 0,
+      className: cn(
+        "relative rounded-og-lg border border-og-border/90 bg-og-surface-1 shadow-og-sm",
+        "transition-[border-color,box-shadow] duration-200 ease-og-out",
+        "focus-within:border-og-accent/50 focus-within:shadow-og-glow",
+        controller.dragging && "border-dashed border-og-accent",
+        className
+      ),
+      children: [
+        controller.dragging ? /* @__PURE__ */ jsx3(
+          "div",
+          {
+            "aria-hidden": true,
+            className: cn(
+              "pointer-events-none absolute inset-0 z-10 flex items-center justify-center",
+              "rounded-og-lg bg-og-surface-1/85 text-og-menu font-medium text-og-accent backdrop-blur-[1px]"
+            ),
+            children: /* @__PURE__ */ jsxs3("span", { className: "inline-flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx3(PaperclipIcon, { className: "size-4" }),
+              controller.messages.dropFiles
+            ] })
+          }
+        ) : null,
+        children
+      ]
+    }
+  );
+});
+function PausedState() {
+  const controller = useComposerController();
+  if (!controller.paused || !controller.effectiveControl || !controller.hasControl) return null;
+  return /* @__PURE__ */ jsx3(
+    WorkstreamPausedStrip,
+    {
+      control: controller.effectiveControl,
+      queuedAheadCount: controller.queuedAheadCount,
+      open: controller.controlDetailsOpen,
+      busy: controller.resuming,
+      sending: controller.sending,
+      canControlWorkspace: controller.canControlWorkspace,
+      controlLinks: controller.controlLinks,
+      messages: controller.messages,
+      onOpenChange: controller.setControlDetailsOpen,
+      onResume: () => void controller.resume(),
+      onResumeOption: (option) => void controller.resumeScope(option)
+    }
+  );
+}
+function RestoredResources() {
+  const controller = useComposerController();
+  if (controller.restoredResources.length === 0 || !controller.removeRestoredResource) return null;
+  return /* @__PURE__ */ jsx3(
+    RestoredResourceChips,
+    {
+      resources: controller.restoredResources,
+      messages: controller.messages,
+      onRemove: controller.removeRestoredResource
+    }
+  );
+}
+function Attachments() {
+  const controller = useComposerController();
+  if (!controller.attachments || controller.attachments.attachments.length === 0) return null;
+  return /* @__PURE__ */ jsx3(
+    AttachmentChips,
+    {
+      attachments: controller.attachments.attachments,
+      messages: controller.messages,
+      disabled: controller.disabled,
+      onRemove: controller.attachments.remove,
+      onRetry: controller.attachments.retry,
+      onRetainPreview: controller.attachments.retainPreview,
+      onLoadPreview: controller.attachments.loadPreview
+    }
+  );
+}
+var EDITING_FOCUS_SELECTOR = 'input, textarea, select, [contenteditable="true"], [role="textbox"]';
+var POPUP_FOCUS_SELECTOR = '[role="menu"], [role="menubar"], [role="listbox"], [role="dialog"], [role="alertdialog"]';
+function focusBelongsElsewhere(textarea) {
+  const active = textarea.ownerDocument.activeElement;
+  if (!active || active === textarea) return false;
+  if (active.closest(EDITING_FOCUS_SELECTOR)) return true;
+  const popup = active.closest(POPUP_FOCUS_SELECTOR);
+  if (popup) return !popup.contains(textarea);
+  return active !== textarea.ownerDocument.body && active !== textarea.ownerDocument.documentElement;
+}
+var Input = forwardRef(function ComposerInput({ rows = 1, placeholder, className, "aria-label": ariaLabel, autoFocus = false, ...props }, forwardedRef) {
+  const controller = useComposerController();
+  const autoFocusedRef = useRef2(false);
+  const paletteOpen = controller.paletteEnabled && controller.paletteMounted && controller.palette.open;
+  useEffect(() => {
+    if (!autoFocus || controller.disabled || autoFocusedRef.current) return;
+    const frame = window.requestAnimationFrame(() => {
+      const textarea = controller.textareaRef.current;
+      if (!textarea || textarea.disabled) return;
+      autoFocusedRef.current = true;
+      if (focusBelongsElsewhere(textarea)) return;
+      textarea.focus();
+    });
+    return () => window.cancelAnimationFrame(frame);
+  }, [autoFocus, controller.disabled, controller.textareaRef]);
+  useEffect(() => {
+    const textarea = controller.textareaRef.current;
+    if (!textarea || typeof ResizeObserver === "undefined") return;
+    let width = textarea.clientWidth;
+    let frame = null;
+    const observer = new ResizeObserver(() => {
+      if (textarea.clientWidth === width) return;
+      width = textarea.clientWidth;
+      if (frame !== null) return;
+      frame = window.requestAnimationFrame(() => {
+        frame = null;
+        applyComposerTextareaHeight(textarea, 220);
+      });
+    });
+    observer.observe(textarea);
+    return () => {
+      observer.disconnect();
+      if (frame !== null) window.cancelAnimationFrame(frame);
+    };
+  }, [controller.textareaRef]);
+  return /* @__PURE__ */ jsx3(
+    "textarea",
+    {
+      ...props,
+      ref: mergeRefs(controller.textareaRef, forwardedRef),
+      rows,
+      value: controller.value,
+      onChange: (event) => controller.setValue(event.target.value),
+      onKeyDown: controller.handleKeyDown,
+      onPaste: controller.handlePaste,
+      placeholder: controller.paused && !controller.disabled ? controller.messages.pausedPlaceholder : placeholder ?? controller.messages.messagePlaceholder,
+      disabled: controller.disabled,
+      "aria-label": ariaLabel ?? controller.messages.inputLabel,
+      "aria-keyshortcuts": "Enter Meta+Enter Control+Enter Shift+Enter",
+      "aria-autocomplete": controller.paletteEnabled && controller.paletteMounted ? "list" : void 0,
+      "aria-controls": paletteOpen ? controller.listboxId : void 0,
+      "aria-activedescendant": paletteOpen ? `${controller.listboxId}-option-${controller.palette.highlight}` : void 0,
+      className: cn(
+        "og-composer-input block w-full resize-none bg-transparent px-3.5 pt-3 pb-1 text-og-composer md:px-4 md:text-og-composer-wide pointer-coarse:min-h-11",
+        "text-og-fg placeholder:text-og-fg-subtle focus:outline-hidden focus-visible:outline-hidden",
+        "disabled:cursor-not-allowed disabled:opacity-60",
+        className
+      )
+    }
+  );
+});
+function Confirmation() {
+  const controller = useComposerController();
+  const command = controller.confirmState?.command;
+  if (!command || !controller.confirmState) return null;
+  return /* @__PURE__ */ jsx3(
+    ConfirmBar,
+    {
+      command,
+      messages: controller.messages,
+      onCancel: () => controller.settleConfirmation(false),
+      onConfirm: () => controller.settleConfirmation(true),
+      returnFocusRef: controller.textareaRef
+    }
+  );
+}
+var Footer = forwardRef(function ComposerFooter({ className, children, ...props }, ref) {
+  const signals = useComposerFooterSignalState();
+  return /* @__PURE__ */ jsx3(
+    "div",
+    {
+      ...props,
+      ...signals.attributes,
+      ref,
+      className: cn(
+        "og-composer-footer flex items-end gap-1.5 px-2 pb-2 pt-0.5 sm:px-2.5 sm:pb-2.5",
+        // Mobile: one control row — never wrap into a second toolbar line.
+        "max-sm:flex-nowrap max-sm:items-center max-sm:gap-1",
+        className
+      ),
+      children: /* @__PURE__ */ jsx3(ComposerFooterSignalProvider, { value: signals.report, children })
+    }
+  );
+});
+var Controls = forwardRef(
+  function ComposerControls({ className, ...props }, ref) {
+    return /* @__PURE__ */ jsx3(
+      "span",
+      {
+        ...props,
+        ref,
+        className: cn(
+          "og-composer-controls flex min-w-0 flex-1 flex-wrap items-center gap-1.5",
+          // Phone: 44px touch targets already space themselves; tight gaps leave
+          // the model pill room for its name.
+          "max-sm:flex-nowrap max-sm:gap-0.5",
+          className
+        )
+      }
+    );
+  }
+);
+var Hint = forwardRef(function ComposerHint({ className, children, ...props }, ref) {
+  const controller = useComposerController();
+  return /* @__PURE__ */ jsx3(
+    "span",
+    {
+      ...props,
+      ref,
+      className: cn(
+        "og-composer-hint min-w-0 flex-1 px-1.5 text-og-xs text-og-fg-subtle max-sm:hidden",
+        className
+      ),
+      children: children ?? controller.messages.keyboardHint
+    }
+  );
+});
+var Actions = forwardRef(function ComposerActions({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx3(
+    "span",
+    {
+      ...props,
+      ref,
+      className: cn(
+        "og-composer-actions ml-auto flex shrink-0 items-center gap-1.5",
+        "max-sm:flex-nowrap max-sm:gap-0.5",
+        className
+      )
+    }
+  );
+});
+var AttachButton = forwardRef(
+  function ComposerAttachButton({ accept, multiple = true, className, "aria-label": ariaLabel, title, children, ...props }, ref) {
+    const controller = useComposerController();
+    if (!controller.attachments) return null;
+    const tip = title ?? controller.messages.attachFiles;
+    return /* @__PURE__ */ jsxs3(Fragment, { children: [
+      /* @__PURE__ */ jsx3(
+        "input",
+        {
+          ref: controller.fileInputRef,
+          type: "file",
+          accept,
+          multiple,
+          "data-og-composer-attach": true,
+          className: "hidden",
+          onChange: controller.handleFileChange
+        }
+      ),
+      /* @__PURE__ */ jsx3(ComposerTip, { tip, children: /* @__PURE__ */ jsx3(
+        "button",
+        {
+          ...props,
+          ref,
+          type: "button",
+          disabled: controller.disabled,
+          onClick: () => controller.fileInputRef.current?.click(),
+          "aria-label": ariaLabel ?? tip,
+          className: cn(
+            "inline-flex size-8 items-center justify-center rounded-og-md",
+            "text-og-fg-muted transition-colors duration-150 hover:bg-og-surface-2 hover:text-og-fg",
+            "disabled:cursor-not-allowed disabled:opacity-50 pointer-coarse:size-11",
+            className
+          ),
+          children: children ?? /* @__PURE__ */ jsx3(PaperclipIcon, { className: "size-4" })
+        }
+      ) })
+    ] });
+  }
+);
+function ModelPicker2({
+  models,
+  rows,
+  value,
+  onChange,
+  label,
+  className,
+  codexOnly
+}) {
+  const controller = useComposerController();
+  return /* @__PURE__ */ jsx3(
+    ModelPicker,
+    {
+      models,
+      rows,
+      value,
+      onChange: (modelId) => onChange?.(modelId),
+      disabled: controller.disabled,
+      label: label ?? controller.messages.modelLabel,
+      className,
+      codexOnly
+    }
+  );
+}
+function pausePresence(controller) {
+  if (controller.runControl !== "pause" || !controller.effectiveControl || controller.paused || !controller.hasControl)
+    return "none";
+  return controller.workstreamWorking ? "shown" : "reserved";
+}
+var PAUSE_BOX_CLASS = "inline-flex size-8 items-center justify-center pointer-coarse:size-11";
+var PAUSE_YIELDS_CLASS = "og-composer-pause-yields max-sm:hidden";
+function PauseButtonSlot() {
+  const controller = useComposerController();
+  if (pausePresence(controller) !== "reserved") return null;
+  return /* @__PURE__ */ jsx3(
+    "span",
+    {
+      "aria-hidden": true,
+      "data-og-composer-pause-slot": "",
+      className: cn(
+        PAUSE_BOX_CLASS,
+        "invisible shrink-0",
+        controller.submitBlocker !== "empty" && PAUSE_YIELDS_CLASS
+      )
+    }
+  );
+}
+var PauseButton = forwardRef(
+  function ComposerPauseButton({ className, "aria-label": ariaLabel, title, children, ...props }, ref) {
+    const controller = useComposerController();
+    if (pausePresence(controller) !== "shown") return null;
+    const busy = controller.pausing || controller.resuming;
+    const tip = title ?? controller.messages.pauseTitle;
+    const yieldsToDraft = controller.submitBlocker !== "empty";
+    return /* @__PURE__ */ jsx3(ComposerTip, { tip, children: /* @__PURE__ */ jsx3(
+      "button",
+      {
+        "data-analytics-action": "pause",
+        ...props,
+        ref: mergeRefs(controller.pauseButtonRef, ref),
+        type: "button",
+        onClick: () => void controller.pause(),
+        disabled: busy,
+        "aria-label": ariaLabel ?? controller.messages.pauseAriaLabel,
+        className: cn(
+          PAUSE_BOX_CLASS,
+          "rounded-og-md border border-og-border",
+          "bg-og-surface-2 text-og-fg-muted transition-colors duration-150",
+          "hover:border-og-status-waiting/50 hover:text-og-status-waiting",
+          "disabled:opacity-50",
+          yieldsToDraft && PAUSE_YIELDS_CLASS,
+          className
+        ),
+        children: children ?? (busy ? /* @__PURE__ */ jsx3(LoaderCircleIcon, { className: "size-3.5 animate-og-spin" }) : /* @__PURE__ */ jsx3(PauseIcon, { className: "size-3.5 fill-current" }))
+      }
+    ) });
+  }
+);
+var StopButton = forwardRef(
+  function ComposerStopButton({ className, "aria-label": ariaLabel, title, children, ...props }, ref) {
+    const t = useOpenGeniText();
+    const controller = useComposerController();
+    if (controller.runControl !== "stop" || !controller.running || !controller.hasControl || controller.effectiveControl?.state === "paused")
+      return null;
+    const busy = controller.pausing;
+    const label = ariaLabel ?? controller.messages.stopAriaLabel ?? t("composer.stop");
+    const tip = title ?? controller.messages.stopTitle ?? label;
+    return /* @__PURE__ */ jsx3(ComposerTip, { tip, children: /* @__PURE__ */ jsx3(
+      "button",
+      {
+        "data-analytics-action": "stop",
+        "data-og-composer-stop": "",
+        ...props,
+        ref,
+        type: "button",
+        onClick: () => void controller.stop(),
+        disabled: busy,
+        "aria-label": label,
+        className: cn(
+          "inline-flex size-8 items-center justify-center rounded-og-md border border-og-border pointer-coarse:size-11",
+          "bg-og-surface-1 text-og-fg transition-colors duration-150",
+          "hover:bg-og-surface-2 disabled:opacity-50",
+          className
+        ),
+        children: children ?? (busy ? /* @__PURE__ */ jsx3(LoaderCircleIcon, { className: "size-3.5 animate-og-spin" }) : /* @__PURE__ */ jsx3(SquareIcon, { className: "size-3 fill-current" }))
+      }
+    ) });
+  }
+);
+var AlternateSendButton = forwardRef(
+  function ComposerAlternateSendButton({ className, "aria-label": ariaLabel, title, children, ...props }, ref) {
+    const t = useOpenGeniText();
+    const controller = useComposerController();
+    if (controller.alternateSend === null || controller.paused || controller.submitBlocker === "empty" || controller.submitBlocker === "disabled")
+      return null;
+    const queues = controller.alternateSend === "queue";
+    const label = queues ? controller.messages.queueLabel ?? t("composerMessages.queue") : controller.messages.steerLabel ?? t("composerMessages.steer");
+    const tip = title ?? (controller.submitBlocker === "annotations" ? controller.messages.annotationNotesRequired : queues ? controller.messages.queueTitle ?? t("composerMessages.queueRunsAfterCurrentWork") : controller.messages.steerTitle ?? t("composerMessages.steerReadsItSoon"));
+    const inFlight = controller.sending && controller.submittingMode === "steer";
+    return /* @__PURE__ */ jsx3(ComposerTip, { tip, children: /* @__PURE__ */ jsx3(
+      "button",
+      {
+        "data-analytics-action": queues ? "queue" : "steer",
+        "data-og-composer-alternate-send": "",
+        ...props,
+        ref,
+        type: "button",
+        onClick: (event) => {
+          const hadFocus = event.currentTarget === document.activeElement;
+          void controller.submit("steer").then((sent) => {
+            if (sent && hadFocus) controller.focusInput();
+          });
+        },
+        disabled: !controller.canSubmit,
+        "aria-label": ariaLabel ?? label,
+        "aria-keyshortcuts": "Meta+Enter Control+Enter",
+        className: cn(
+          "inline-flex h-8 shrink-0 items-center justify-center gap-1.5 rounded-og-md px-2.5 pointer-coarse:h-11 pointer-coarse:px-3.5",
+          "border border-og-border bg-og-surface-1 text-og-control font-medium text-og-fg",
+          "transition-[background-color,transform,opacity] duration-150 ease-og-spring",
+          "hover:bg-og-surface-2 active:scale-95",
+          "disabled:cursor-not-allowed disabled:opacity-50",
+          className
+        ),
+        children: children ?? (inFlight ? /* @__PURE__ */ jsxs3(Fragment, { children: [
+          /* @__PURE__ */ jsx3(LoaderCircleIcon, { "aria-hidden": "true", className: "size-3.5 animate-og-spin" }),
+          /* @__PURE__ */ jsx3("span", { children: label })
+        ] }) : label)
+      }
+    ) });
+  }
+);
+var SendButton = forwardRef(
+  function ComposerSendButton({ className, "aria-label": ariaLabel, title, children, ...props }, ref) {
+    const controller = useComposerController();
+    const tip = title ?? (controller.submitBlocker === "annotations" ? controller.messages.annotationNotesRequired : controller.paused ? controller.messages.sendAndResumeTitle : !controller.working ? controller.messages.idleSendTitle ?? controller.messages.sendTitle : controller.busySend === "steer" ? controller.messages.steerSendTitle ?? controller.messages.sendTitle : controller.messages.sendTitle);
+    return /* @__PURE__ */ jsx3(ComposerTip, { tip, children: /* @__PURE__ */ jsx3(
+      "button",
+      {
+        "data-analytics-action": "send",
+        ...props,
+        ref,
+        type: "button",
+        onClick: (event) => {
+          const hadFocus = event.currentTarget === document.activeElement;
+          void controller.submit("queue").then((sent) => {
+            if (sent && hadFocus) controller.focusInput();
+          });
+        },
+        disabled: !controller.canSubmit,
+        "data-og-tip": tip,
+        "aria-label": ariaLabel ?? (controller.paused ? controller.messages.sendAndResumeAriaLabel : controller.messages.sendMessageAriaLabel),
+        className: cn(
+          "inline-flex size-8 items-center justify-center rounded-og-md pointer-coarse:size-11",
+          "border border-og-primary-border bg-og-primary text-og-primary-fg",
+          "transition-[background-color,transform,opacity] duration-150 ease-og-spring",
+          "hover:bg-og-primary-hover active:scale-95",
+          "disabled:cursor-not-allowed disabled:opacity-50",
+          className
+        ),
+        children: children ?? (controller.sending && controller.submittingMode !== "steer" ? /* @__PURE__ */ jsx3(LoaderCircleIcon, { className: "size-4 animate-og-spin" }) : /* @__PURE__ */ jsx3(ArrowUpIcon, { className: "size-4" }))
+      }
+    ) });
+  }
+);
+function Help() {
+  const controller = useComposerController();
+  return /* @__PURE__ */ jsx3(AnimatePresence2, { children: controller.helpOpen ? /* @__PURE__ */ jsx3(
+    HelpPanel,
+    {
+      commands: controller.helpCommands,
+      messages: controller.messages,
+      onClose: () => controller.setHelpOpen(false)
+    }
+  ) : null });
+}
+function Status() {
+  const controller = useComposerController();
+  return /* @__PURE__ */ jsxs3(Fragment, { children: [
+    /* @__PURE__ */ jsx3(AnimatePresence2, { children: controller.activeNotice ? (
+      // Visible only: the composer root's ComposerAnnouncements region
+      // already announces this notice, so a second live region here would
+      // make screen readers read it twice.
+      /* @__PURE__ */ jsx3(
+        motion2.p,
+        {
+          initial: { opacity: 0, height: 0 },
+          animate: { opacity: 1, height: "auto" },
+          exit: { opacity: 0, height: 0 },
+          className: cn(
+            "overflow-hidden px-1 pt-1.5 text-og-control",
+            controller.activeNotice.tone === "ok" ? "text-og-fg-muted" : "text-og-status-failed"
+          ),
+          children: controller.activeNotice.message
+        },
+        "notice"
+      )
+    ) : controller.serviceUpdating ? /* @__PURE__ */ jsxs3(
+      motion2.p,
+      {
+        "data-og-composer-status": "updating",
+        initial: { opacity: 0, height: 0 },
+        animate: { opacity: 1, height: "auto" },
+        exit: { opacity: 0, height: 0 },
+        className: "flex items-center gap-1.5 overflow-hidden px-1 pt-1.5 text-og-control text-og-fg-muted",
+        children: [
+          /* @__PURE__ */ jsx3(
+            LoaderCircleIcon,
+            {
+              "aria-hidden": "true",
+              className: "size-3.5 shrink-0 animate-og-spin motion-reduce:animate-none"
+            }
+          ),
+          /* @__PURE__ */ jsx3("span", { children: controller.serviceUpdatingMessage })
+        ]
+      },
+      "service-updating"
+    ) : null }),
+    controller.draftConflict ? /* @__PURE__ */ jsxs3("div", { className: "mt-1.5 flex flex-wrap items-center gap-2 px-1 text-og-xs text-og-status-failed", children: [
+      /* @__PURE__ */ jsx3("span", { className: "min-w-0 flex-1", children: controller.messages.draftConflict }),
+      /* @__PURE__ */ jsx3(
+        "button",
+        {
+          type: "button",
+          className: "underline underline-offset-2",
+          onClick: () => void controller.resolveDraftConflict?.("use_remote"),
+          children: controller.messages.useOtherDraft
+        }
+      ),
+      /* @__PURE__ */ jsx3(
+        "button",
+        {
+          type: "button",
+          className: "font-medium underline underline-offset-2",
+          onClick: () => void controller.resolveDraftConflict?.("keep_mine"),
+          children: controller.messages.keepMine
+        }
+      )
+    ] }) : null
+  ] });
+}
+function ComposerAnnouncements() {
+  const controller = useComposerController();
+  return /* @__PURE__ */ jsxs3("div", { className: "sr-only", children: [
+    controller.activeNotice ? /* @__PURE__ */ jsx3("p", { role: controller.activeNotice.tone === "error" ? "alert" : "status", children: controller.activeNotice.message }) : controller.serviceUpdating ? /* @__PURE__ */ jsx3("p", { role: "status", children: controller.serviceUpdatingMessage }) : null,
+    controller.draftConflict ? /* @__PURE__ */ jsx3("p", { role: "alert", children: controller.messages.draftConflict }) : null
+  ] });
+}
+function mergeRefs(...refs) {
+  return (node) => {
+    for (const ref of refs) {
+      if (typeof ref === "function") ref(node);
+      else if (ref) ref.current = node;
+    }
+  };
+}
+function WorkstreamPausedStrip({
+  control,
+  queuedAheadCount,
+  open,
+  busy,
+  sending,
+  canControlWorkspace,
+  controlLinks,
+  messages,
+  onOpenChange,
+  onResume,
+  onResumeOption
+}) {
+  const blocker = control.primaryBlocker;
+  const cause = blocker?.kind === "workspace" ? messages.workspacePaused : control.directState === "paused" ? messages.pausedHere : messages.pausedBy(blocker?.displayName ?? messages.parentBlocker);
+  const primary = control.resumeOptions.find((option) => option.scope === "selected");
+  const broaderOptions = control.resumeOptions.filter(
+    (option) => option !== primary && option.scope !== "selected" && (option.scope !== "workspace" || canControlWorkspace)
+  );
+  return /* @__PURE__ */ jsxs3("div", { className: "border-b border-og-status-waiting/25 bg-og-status-waiting/[0.07]", children: [
+    /* @__PURE__ */ jsxs3("div", { className: "flex min-w-0 items-center gap-2 px-3 py-2", children: [
+      /* @__PURE__ */ jsx3(PauseIcon, { className: "size-3.5 shrink-0 text-og-status-waiting" }),
+      /* @__PURE__ */ jsxs3(
+        "button",
+        {
+          type: "button",
+          className: "min-w-0 flex-1 text-left",
+          onClick: () => onOpenChange(!open),
+          "aria-expanded": open,
+          children: [
+            /* @__PURE__ */ jsx3("span", { className: "block truncate text-og-xs font-medium text-og-fg", children: cause }),
+            /* @__PURE__ */ jsx3("span", { className: "block truncate text-[11px] text-og-fg-muted", children: queuedAheadCount > 0 ? messages.queuedAhead(queuedAheadCount) : sending ? messages.resumingAndSending : messages.nextMessageResumes })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxs3(
+        "button",
+        {
+          type: "button",
+          "aria-label": messages.resumeThisWorkstream,
+          className: "inline-flex min-h-8 shrink-0 items-center gap-1.5 rounded-og-md border border-og-primary-border bg-og-primary px-2.5 text-og-xs font-medium text-og-primary-fg hover:bg-og-primary-hover disabled:cursor-not-allowed disabled:opacity-50 pointer-coarse:min-h-11",
+          disabled: busy,
+          onClick: onResume,
+          children: [
+            busy ? /* @__PURE__ */ jsx3(LoaderCircleIcon, { className: "size-3.5 animate-og-spin" }) : /* @__PURE__ */ jsx3(PlayIcon, { className: "size-3.5 fill-current" }),
+            /* @__PURE__ */ jsx3("span", { className: "og-composer-resume-label-long hidden min-[400px]:inline", children: messages.resumeThisWorkstream }),
+            /* @__PURE__ */ jsx3("span", { className: "og-composer-resume-label-short min-[400px]:hidden", children: messages.resumeShort })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx3(
+        "button",
+        {
+          type: "button",
+          className: "inline-flex size-8 shrink-0 items-center justify-center rounded-og-md text-og-fg-muted hover:bg-og-surface-2 pointer-coarse:size-11",
+          onClick: () => onOpenChange(!open),
+          "aria-label": open ? messages.hidePauseDetails : messages.showPauseDetails,
+          children: /* @__PURE__ */ jsx3(ChevronDownIcon2, { className: cn("size-3.5 transition-transform", open && "rotate-180") })
+        }
+      )
+    ] }),
+    open ? /* @__PURE__ */ jsxs3("div", { className: "border-t border-og-status-waiting/20 px-3 pb-3 pt-2", children: [
+      /* @__PURE__ */ jsx3("ul", { className: "grid gap-2", "aria-label": messages.pauseReasonsLabel, children: control.blockers.map((entry, index) => /* @__PURE__ */ jsxs3(
+        "li",
+        {
+          className: "text-og-xs",
+          children: [
+            /* @__PURE__ */ jsx3("span", { className: "font-medium text-og-fg", children: index === 0 ? messages.pausedByLabel : messages.alsoPausedByLabel }),
+            blockerHref(entry, controlLinks) ? /* @__PURE__ */ jsx3(
+              "a",
+              {
+                href: blockerHref(entry, controlLinks),
+                className: "font-medium text-og-fg underline decoration-og-border-strong underline-offset-2 hover:text-og-accent focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-og-accent/40",
+                children: entry.displayName
+              }
+            ) : /* @__PURE__ */ jsx3("span", { className: "font-medium text-og-fg", children: entry.displayName }),
+            entry.reason ? /* @__PURE__ */ jsxs3("span", { className: "text-og-fg-muted", children: [
+              " \xB7 ",
+              entry.reason
+            ] }) : null,
+            entry.actor ? /* @__PURE__ */ jsxs3("span", { className: "text-og-fg-subtle", children: [
+              " \xB7 ",
+              entry.actor
+            ] }) : null,
+            entry.changedAt ? /* @__PURE__ */ jsxs3("span", { className: "text-og-fg-subtle", children: [
+              " ",
+              "\xB7 ",
+              messages.formatRelativeTime(entry.changedAt)
+            ] }) : null
+          ]
+        },
+        `${entry.kind}-${entry.sessionId ?? "workspace"}-${entry.revision}`
+      )) }),
+      broaderOptions.length > 0 ? /* @__PURE__ */ jsx3("div", { className: "mt-2 flex flex-wrap gap-1.5", children: broaderOptions.map((option) => /* @__PURE__ */ jsx3(
+        ComposerTip,
+        {
+          tip: option.impactCopy,
+          children: /* @__PURE__ */ jsxs3(
+            "button",
+            {
+              type: "button",
+              disabled: busy,
+              onClick: () => onResumeOption(option),
+              className: "rounded-og-md border border-og-border bg-og-surface-1 px-2 py-1 text-og-xs text-og-fg-muted hover:bg-og-surface-2 hover:text-og-fg pointer-coarse:min-h-10",
+              children: [
+                /* @__PURE__ */ jsx3("span", { className: "block font-medium", children: option.scope === "workspace" ? messages.resumeWorkspace : messages.resumeFromSession }),
+                /* @__PURE__ */ jsx3("span", { className: "block text-[10px] text-og-fg-subtle", children: option.selectedStateAfter === "active" ? messages.sessionCanRun : messages.stillPausedBy(
+                  option.remainingPrimaryBlocker?.displayName ?? messages.narrowerPause
+                ) })
+              ]
+            }
+          )
+        },
+        `${option.scope}-${option.targetId ?? "selected"}`
+      )) }) : null
+    ] }) : null
+  ] });
+}
+function blockerHref(blocker, links) {
+  if (blocker.kind === "workspace") return links?.workspaceHref;
+  return blocker.sessionId ? links?.sessionHref?.(blocker.sessionId) : void 0;
+}
+function RestoredResourceChips({
+  resources,
+  messages,
+  onRemove
+}) {
+  return /* @__PURE__ */ jsx3(
+    "div",
+    {
+      className: "flex flex-wrap gap-1.5 border-b border-og-border px-3 py-2",
+      "aria-label": messages.restoredResourcesLabel,
+      children: resources.map((resource, index) => /* @__PURE__ */ jsxs3(
+        "span",
+        {
+          className: "inline-flex min-w-0 max-w-full items-center gap-1.5 rounded-og-md border border-og-border bg-og-surface-2 px-2 py-1 text-og-xs text-og-fg-muted",
+          children: [
+            /* @__PURE__ */ jsx3(FileIcon, { className: "size-3 shrink-0" }),
+            /* @__PURE__ */ jsx3("span", { className: "truncate", children: resource.kind === "file" ? messages.restoredFile(resource.fileId) : resource.uri }),
+            /* @__PURE__ */ jsx3(
+              "button",
+              {
+                type: "button",
+                className: "shrink-0 hover:text-og-fg",
+                onClick: () => onRemove(index),
+                "aria-label": messages.removeRestoredResource(index),
+                children: /* @__PURE__ */ jsx3(XIcon, { className: "size-3" })
+              }
+            )
+          ]
+        },
+        `${resource.kind}-${resource.kind === "file" ? resource.fileId : resource.uri}`
+      ))
+    }
+  );
+}
+function ConfirmBar({
+  command,
+  messages,
+  onCancel,
+  onConfirm,
+  returnFocusRef
+}) {
+  const confirmRef = useRef2(null);
+  const descriptionId = useId2();
+  useEffect(() => {
+    const returnTo = returnFocusRef?.current ?? null;
+    confirmRef.current?.focus();
+    return () => returnTo?.focus();
+  }, [returnFocusRef]);
+  return /* @__PURE__ */ jsxs3(
+    "div",
+    {
+      role: "alertdialog",
+      "aria-label": messages.confirmCommand(command.name),
+      "aria-describedby": descriptionId,
+      "data-testid": "danger-confirm",
+      onKeyDown: (event) => {
+        if (event.key === "Escape") {
+          event.preventDefault();
+          event.stopPropagation();
+          onCancel();
+        }
+      },
+      className: "flex items-end justify-between gap-2 px-2.5 pb-2.5 pt-1",
+      children: [
+        /* @__PURE__ */ jsx3("span", { id: descriptionId, className: "min-w-0 flex-1 px-1.5 text-og-sm text-og-status-failed", children: messages.confirmDescription(command) }),
+        /* @__PURE__ */ jsxs3("span", { className: "flex shrink-0 items-center gap-1.5", children: [
+          /* @__PURE__ */ jsx3(
+            "button",
+            {
+              type: "button",
+              onClick: onCancel,
+              className: "rounded-og-md border border-og-border bg-og-surface-2 px-2.5 py-1 text-og-sm text-og-fg-muted hover:bg-og-surface-3 pointer-coarse:min-h-11",
+              children: messages.cancel
+            }
+          ),
+          /* @__PURE__ */ jsx3(
+            "button",
+            {
+              ref: confirmRef,
+              type: "button",
+              onClick: onConfirm,
+              className: "rounded-og-md border border-og-status-failed/50 bg-og-status-failed/15 px-2.5 py-1 text-og-sm text-og-status-failed hover:bg-og-status-failed/25 pointer-coarse:min-h-11",
+              children: messages.runCommand(command.name)
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+function AttachmentChips({
+  attachments,
+  messages,
+  disabled,
+  onRemove,
+  onRetry,
+  onRetainPreview,
+  onLoadPreview
+}) {
+  const t = useOpenGeniText();
+  const lightbox = useLightboxOptional();
+  const previewRequest = useRef2(null);
+  const [previewLoadingId, setPreviewLoadingId] = useState2(null);
+  const [previewErrorId, setPreviewErrorId] = useState2(null);
+  const [storedThumbs, setStoredThumbs] = useState2({});
+  const [brokenLocal, setBrokenLocal] = useState2(() => /* @__PURE__ */ new Set());
+  const thumbRequests = useRef2(/* @__PURE__ */ new Map());
+  const localPreview = (attachment) => attachment.previewUrl && !brokenLocal.has(attachment.id) ? attachment.previewUrl : void 0;
+  useEffect(() => {
+    if (!onLoadPreview) return;
+    for (const attachment of attachments) {
+      const id = attachment.id;
+      if (attachment.status !== "ready" || !attachment.file || !attachment.contentType.startsWith("image/") || attachment.previewUrl && !brokenLocal.has(id) || storedThumbs[id] || thumbRequests.current.has(id)) {
+        continue;
+      }
+      const controller = new AbortController();
+      thumbRequests.current.set(id, controller);
+      void onLoadPreview(id, controller.signal).then((url) => {
+        if (url && !controller.signal.aborted) {
+          setStoredThumbs((current) => ({ ...current, [id]: url }));
+        }
+      }).catch(() => void 0).finally(() => {
+        if (thumbRequests.current.get(id) === controller) thumbRequests.current.delete(id);
+      });
+    }
+  }, [attachments, brokenLocal, onLoadPreview, storedThumbs]);
+  useEffect(() => {
+    const requests = thumbRequests.current;
+    return () => {
+      for (const controller of requests.values()) controller.abort();
+      requests.clear();
+    };
+  }, []);
+  useEffect(() => () => previewRequest.current?.abort(), [onLoadPreview]);
+  async function openPreview(attachment, source, canLoadPreview) {
+    previewRequest.current?.abort();
+    const attachmentId = attachment.id;
+    const local = localPreview(attachment);
+    const releaseSource = local ? onRetainPreview(attachmentId) : void 0;
+    let src = local ?? storedThumbs[attachmentId];
+    if (!releaseSource && canLoadPreview) src = storedThumbs[attachmentId];
+    if (!src && canLoadPreview) {
+      const controller = new AbortController();
+      previewRequest.current = controller;
+      setPreviewLoadingId(attachmentId);
+      setPreviewErrorId(null);
+      try {
+        src = await onLoadPreview(attachmentId, controller.signal);
+        if (controller.signal.aborted) return;
+        if (!src) {
+          setPreviewErrorId(attachmentId);
+          return;
+        }
+      } catch {
+        if (!controller.signal.aborted) setPreviewErrorId(attachmentId);
+        return;
+      } finally {
+        if (previewRequest.current === controller) {
+          setPreviewLoadingId(null);
+        }
+      }
+    }
+    lightbox.open(
+      src,
+      attachment.name,
+      source,
+      messages.attachmentPreviewLabel,
+      attachment.name,
+      {
+        download: messages.downloadAttachment(attachment.name),
+        close: messages.closeAttachmentPreview
+      },
+      releaseSource
+    );
+  }
+  return (
+    // Compact chips extend their touch targets beyond their visible borders.
+    // Keep neighboring rows and columns outside those expanded hit areas.
+    /* @__PURE__ */ jsx3("div", { className: "flex flex-wrap gap-1.5 px-3 pt-2 pb-0.5 pointer-coarse:gap-2.5", children: attachments.map((attachment) => {
+      const failed = attachment.status === "failed";
+      const secureContextRequired = attachment.errorCode === "secure_context_required";
+      const previewFailed = previewErrorId === attachment.id;
+      const previewLoading = previewLoadingId === attachment.id;
+      const local = localPreview(attachment);
+      const thumb = local ?? storedThumbs[attachment.id];
+      const onThumbError = local ? () => setBrokenLocal(
+        (current) => current.has(attachment.id) ? current : new Set(current).add(attachment.id)
+      ) : void 0;
+      const canLoadPreview = Boolean(
+        lightbox && onLoadPreview && attachment.status === "ready" && attachment.file && attachment.contentType.startsWith("image/")
+      );
+      const appShot = attachment.appShot;
+      const statusText = previewFailed ? messages.previewUnavailable ?? t("composer.previewUnavailable") : attachment.status === "uploading" ? messages.uploading : failed ? attachment.error || messages.uploadFailed : appShot ? t("composer.appShotSummary", { app: appShot.app }) : messages.formatBytes(attachment.sizeBytes);
+      const displayName = appShot ? appShot.title.trim() || appShot.app : attachment.name;
+      const compact = !appShot && !failed && !previewFailed;
+      const thumbSize = appShot ? "h-10 w-16" : compact ? "size-6" : "size-8";
+      return /* @__PURE__ */ jsxs3(
+        "div",
+        {
+          "data-app-shot": appShot ? "" : void 0,
+          className: cn(
+            "flex min-w-0 items-center gap-2 rounded-og-md border text-og-sm",
+            compact ? "py-1 pr-1 pl-1" : "px-2 py-1.5",
+            // A captured window arrives from outside the page: let it settle in.
+            appShot && "animate-og-enter",
+            failed ? cn(
+              "border-og-status-failed/40 bg-og-status-failed/10",
+              secureContextRequired ? "max-w-full items-start sm:max-w-[32rem]" : appShot ? "max-w-[320px]" : "max-w-[240px]"
+            ) : cn(
+              "border-og-border bg-og-surface-2",
+              appShot ? "max-w-[320px]" : "max-w-[240px]"
+            )
+          ),
+          children: [
+            lightbox && (thumb || canLoadPreview) ? /* @__PURE__ */ jsx3(
+              "button",
+              {
+                type: "button",
+                className: cn(
+                  thumbSize,
+                  "shrink-0 overflow-hidden rounded outline-hidden focus-visible:ring-2 focus-visible:ring-og-accent",
+                  // The slim chip's 24px preview keeps a 44px touch target; the
+                  // hit area grows over the name, never the remove button.
+                  compact && "relative overflow-visible pointer-coarse:before:absolute pointer-coarse:before:-inset-y-2.5 pointer-coarse:before:-left-2.5 pointer-coarse:before:-right-2.5 pointer-coarse:before:content-['']",
+                  appShot && "border border-og-border bg-og-surface-1",
+                  !thumb && "flex items-center justify-center disabled:cursor-wait"
+                ),
+                "aria-label": messages.previewAttachment(displayName),
+                "aria-busy": previewLoading || void 0,
+                disabled: previewLoading,
+                onClick: (event) => void openPreview(attachment, event.currentTarget, canLoadPreview),
+                children: thumb ? /* @__PURE__ */ jsx3(
+                  "img",
+                  {
+                    src: thumb,
+                    alt: "",
+                    onError: onThumbError,
+                    className: cn(
+                      "h-full w-full object-cover transition-opacity hover:opacity-80",
+                      appShot && "object-top",
+                      compact && "rounded"
+                    )
+                  }
+                ) : previewLoading ? /* @__PURE__ */ jsx3(LoaderCircleIcon, { className: "size-4 animate-og-spin text-og-fg-muted" }) : /* @__PURE__ */ jsx3(ImageIcon, { className: "size-4 text-og-fg-muted" })
+              }
+            ) : thumb ? /* @__PURE__ */ jsx3(
+              "img",
+              {
+                src: thumb,
+                alt: "",
+                onError: onThumbError,
+                className: cn(thumbSize, "shrink-0 rounded object-cover", appShot && "object-top")
+              }
+            ) : attachment.contentType.startsWith("image/") ? /* @__PURE__ */ jsx3(ImageIcon, { className: "size-4 shrink-0 text-og-fg-muted" }) : /* @__PURE__ */ jsx3(FileIcon, { className: "size-4 shrink-0 text-og-fg-muted" }),
+            compact ? /* @__PURE__ */ jsxs3("div", { className: "flex min-w-0 flex-1 items-baseline gap-1.5", children: [
+              /* @__PURE__ */ jsx3("span", { className: "truncate font-medium text-og-fg", children: displayName }),
+              /* @__PURE__ */ jsx3("span", { className: "shrink-0 text-og-xs text-og-fg-subtle tabular-nums", children: statusText })
+            ] }) : /* @__PURE__ */ jsxs3("div", { className: "min-w-0 flex-1", children: [
+              /* @__PURE__ */ jsx3("div", { className: "truncate font-medium text-og-fg", children: displayName }),
+              appShot && !failed && !previewFailed && attachment.status !== "uploading" ? /* @__PURE__ */ jsx3(
+                ComposerTip,
+                {
+                  tip: appShot.text?.trim() ? t("composer.appShotTextIncluded") : t("composer.appShotNoText"),
+                  children: /* @__PURE__ */ jsxs3("div", { className: "flex min-w-0 items-center gap-1 text-og-xs text-og-fg-subtle", children: [
+                    /* @__PURE__ */ jsx3(AppWindowIcon, { "aria-hidden": true, className: "size-3 shrink-0" }),
+                    /* @__PURE__ */ jsx3("span", { className: "truncate", children: statusText })
+                  ] })
+                }
+              ) : secureContextRequired ? /* @__PURE__ */ jsx3("div", { className: "break-words text-og-xs leading-4 text-og-status-failed", children: statusText }) : failed || previewFailed ? /* @__PURE__ */ jsx3(ComposerTip, { tip: statusText, children: /* @__PURE__ */ jsx3("div", { className: "truncate text-og-xs text-og-status-failed", children: statusText }) }) : /* @__PURE__ */ jsx3("div", { className: "truncate text-og-xs text-og-fg-subtle", children: statusText })
+            ] }),
+            attachment.status === "uploading" ? /* @__PURE__ */ jsx3(LoaderCircleIcon, { className: "size-3.5 shrink-0 animate-og-spin" }) : null,
+            failed && !secureContextRequired && onRetry ? /* @__PURE__ */ jsx3(ComposerTip, { tip: messages.retryUpload, children: /* @__PURE__ */ jsx3(
+              "button",
+              {
+                type: "button",
+                onClick: () => onRetry(attachment.id),
+                disabled,
+                className: "shrink-0 rounded-og-xs p-1 text-og-fg-muted hover:bg-og-surface-1 hover:text-og-fg disabled:cursor-not-allowed disabled:opacity-50 pointer-coarse:size-10",
+                "aria-label": messages.retryAttachment(displayName),
+                children: /* @__PURE__ */ jsx3(RotateCwIcon, { className: "size-3.5" })
+              }
+            ) }) : null,
+            /* @__PURE__ */ jsx3(
+              "button",
+              {
+                type: "button",
+                onClick: () => onRemove(attachment.id),
+                disabled,
+                className: cn(
+                  "shrink-0 rounded-og-xs p-1 text-og-fg-muted hover:bg-og-surface-1 hover:text-og-fg disabled:cursor-not-allowed disabled:opacity-50",
+                  // The slim chip keeps a 44px touch target with an invisible hit area.
+                  compact ? "relative pointer-coarse:p-1.5 pointer-coarse:before:absolute pointer-coarse:before:-inset-2.5 pointer-coarse:before:content-['']" : "pointer-coarse:size-10"
+                ),
+                "aria-label": messages.removeAttachment(displayName),
+                children: /* @__PURE__ */ jsx3(XIcon, { className: "size-3.5" })
+              }
+            )
+          ]
+        },
+        attachment.id
+      );
+    }) })
+  );
+}
+function HelpPanel({
+  commands,
+  messages,
+  onClose
+}) {
+  return /* @__PURE__ */ jsxs3(
+    motion2.div,
+    {
+      initial: { opacity: 0, height: 0 },
+      animate: { opacity: 1, height: "auto" },
+      exit: { opacity: 0, height: 0 },
+      className: "mt-2 overflow-hidden rounded-og-lg border border-og-border bg-og-surface-2",
+      children: [
+        /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-between border-b border-og-border px-3 py-1.5", children: [
+          /* @__PURE__ */ jsx3("span", { className: "text-og-sm font-medium text-og-fg", children: messages.commands }),
+          /* @__PURE__ */ jsx3(
+            "button",
+            {
+              type: "button",
+              onClick: onClose,
+              className: "text-og-xs text-og-fg-subtle hover:text-og-fg",
+              children: messages.close
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx3("ul", { className: "py-1", children: commands.map((command) => {
+          const hint = argHint(command.args);
+          return /* @__PURE__ */ jsxs3("li", { className: "flex items-baseline gap-2 px-3 py-1", children: [
+            /* @__PURE__ */ jsxs3("span", { className: "font-mono text-og-sm text-og-accent", children: [
+              "/",
+              command.name,
+              hint ? /* @__PURE__ */ jsx3("span", { className: "ml-1 text-og-fg-subtle", children: hint }) : null
+            ] }),
+            /* @__PURE__ */ jsx3("span", { className: "text-og-sm text-og-fg-muted", children: command.description }),
+            command.danger ? /* @__PURE__ */ jsx3("span", { className: "ml-auto rounded-og-xs bg-og-status-failed/15 px-1 text-og-xs uppercase tracking-wide text-og-status-failed", children: messages.danger }) : null
+          ] }, command.name);
+        }) })
+      ]
+    }
+  );
+}
+
+// src/components/composer-transcription-control.tsx
+import {
+  ClipboardPasteIcon,
+  LoaderCircleIcon as LoaderCircleIcon2,
+  MicIcon,
+  RefreshCwIcon,
+  SquareIcon as SquareIcon2,
+  Trash2Icon,
+  XIcon as XIcon2
+} from "lucide-react";
+import { AnimatePresence as AnimatePresence3, motion as motion3 } from "motion/react";
+import {
+  forwardRef as forwardRef2,
+  useCallback as useCallback3,
+  useEffect as useEffect2,
+  useRef as useRef3,
+  useState as useState3
+} from "react";
+import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var Tip = /* @__PURE__ */ forwardRef2(
+  function Tip2({ tip, children }, ref) {
+    return /* @__PURE__ */ jsxs4(Tooltip, { children: [
+      /* @__PURE__ */ jsx4(TooltipTrigger, { ref, asChild: true, children }),
+      /* @__PURE__ */ jsx4(TooltipContent, { side: "top", children: tip })
+    ] });
+  }
+);
+var defaultMessages = (t) => ({
+  start: t("composerTranscriptionControl.startVoiceInput"),
+  stop: t("composerTranscriptionControl.stopAndTranscribe"),
+  cancel: t("composerTranscriptionControl.discardDictation"),
+  retry: t("composerTranscriptionControl.retryVoiceInput"),
+  transcribeSaved: t("composerTranscriptionControl.transcribeSavedRecording"),
+  timeRemaining: t("composerTranscriptionControl.stopsAndTranscribesInSeconds", {
+    seconds: "{seconds}"
+  }),
+  pauseRetrying: t("composerTranscriptionControl.pauseAutomaticRetry"),
+  requestingPermission: t("composerTranscriptionControl.requestingMicrophone"),
+  recording: t("composerTranscriptionControl.recordingPressEscapeToDiscard"),
+  saving: t("composerTranscriptionControl.savingAudioLocally"),
+  transcribing: t("composerTranscriptionControl.transcribing"),
+  retrying: t("composerTranscriptionControl.savedRetryingTranscription"),
+  recovered: t("composerTranscriptionControl.recordingSavedOnThisDevice"),
+  recoveredTranscript: t("composerTranscriptionControl.transcriptSavedInsertItInto"),
+  insertRecoveredTranscript: t("composerTranscriptionControl.insertSavedTranscript"),
+  discardRecovered: t("composerTranscriptionControl.discardSavedRecording"),
+  unavailableDisabled: t("composerTranscriptionControl.voiceInputIsUnavailableWhile"),
+  unavailable: t("composerTranscriptionControl.voiceInputIsUnavailableFor"),
+  errorPermissionDenied: t("composerTranscriptionControl.microphoneAccessIsBlockedAllow"),
+  errorNotSupported: t("composerTranscriptionControl.voiceInputIsNotSupported"),
+  errorUnavailable: t("composerTranscriptionControl.voiceInputIsNotConfigured"),
+  errorInsufficientCredits: t("composerTranscriptionControl.voiceInputNeedsCreditsRecording"),
+  errorAllowanceExhausted: t("composerTranscriptionControl.usageLimitReachedRecordingSaved"),
+  errorPolicyBlocked: t("composerTranscriptionControl.voiceInputIsnTAllowed"),
+  errorRegionRestricted: t("inferenceRegion.notSupportedInEu"),
+  errorTooLarge: t("composerTranscriptionControl.recordingIsTooLargeTry"),
+  errorInvalidAudio: t("composerTranscriptionControl.theRecordingCouldNotBe"),
+  errorStorageUnavailable: t("composerTranscriptionControl.voiceInputStoppedBecauseAudio"),
+  errorRetryable: t("composerTranscriptionControl.savedTranscriptionFailedRetryWhen"),
+  errorHandoffUncertain: t("composerTranscriptionControl.transcriptSavedCheckYourDraft"),
+  errorUnknown: t("composerTranscriptionControl.voiceInputCouldNotStart")
+});
+var WAVEFORM_BARS = 18;
+var WAVEFORM_BAR_KEYS = Array.from(
+  { length: WAVEFORM_BARS },
+  (_, index) => `voice-waveform-bar-${index + 1}`
+);
+function ComposerTranscriptionControl({
+  client = null,
+  workspaceId = "",
+  capability = null,
+  workspaceEnabled = false,
+  language = null,
+  beforeStart,
+  messages: overrides,
+  className,
+  recordings,
+  platform,
+  suppressed = false
+}) {
+  const t = useOpenGeniText();
+  const composer = useChatComposer();
+  const messages = { ...defaultMessages(t), ...overrides };
+  const startScope = useRef3(null);
+  const hostGate = useRef3(beforeStart);
+  hostGate.current = beforeStart;
+  const gate = useCallback3(async () => {
+    if (hostGate.current && !await hostGate.current()) return false;
+    startScope.current?.dispatchEvent(new Event(COMPOSER_VOICE_INPUT_START_EVENT));
+    return true;
+  }, []);
+  const transcription = useVoiceInput({
+    client,
+    workspaceId,
+    capability,
+    enabled: workspaceEnabled && !suppressed,
+    value: composer.value,
+    setValue: composer.setValue,
+    focusInput: composer.focusInput,
+    disabled: composer.disabled,
+    language,
+    beforeStart: gate,
+    recordings,
+    platform
+  });
+  const { status } = transcription;
+  const retrying = status === "retrying";
+  const capturing = status === "requesting-permission" || status === "recording";
+  const setAsideTranscription = transcription.setAside;
+  const discardTranscription = transcription.discard;
+  const hasRecoverableRecording = transcription.hasRecoverableRecording;
+  useEffect2(() => {
+    if (!suppressed) return;
+    if (status === "recording" || status === "requesting-permission") {
+      setAsideTranscription();
+    } else if (status === "error" && !hasRecoverableRecording) {
+      void discardTranscription();
+    }
+  }, [setAsideTranscription, discardTranscription, hasRecoverableRecording, status, suppressed]);
+  const active = capturing || status === "saving" || status === "transcribing";
+  const recoverable = transcription.hasRecoverableRecording && (retrying || status === "recovered" || status === "transcript-ready" || status === "error");
+  const savedTranscript = status === "transcript-ready" && transcription.savedTranscript !== null;
+  const unavailableMessage = composer.disabled ? messages.unavailableDisabled : !capability?.available || !workspaceEnabled ? messages.unavailable : !transcription.available ? messages.errorStorageUnavailable : null;
+  const idleLabel = unavailableMessage ?? (status === "error" ? messages.retry : messages.start);
+  const errorMessage = transcription.error ? transcriptionErrorMessage(transcription.error, messages) : null;
+  const announcement = status === "requesting-permission" ? messages.requestingPermission : status === "recording" ? messages.recording : status === "saving" ? messages.saving : status === "transcribing" ? messages.transcribing : retrying ? messages.retrying : status === "recovered" ? messages.recovered : status === "transcript-ready" ? messages.recoveredTranscript : status === "error" ? errorMessage ?? messages.errorUnknown : unavailableMessage;
+  const recoveredLabel = savedTranscript ? errorMessage ?? messages.recoveredTranscript : retrying ? messages.retrying : status === "error" ? errorMessage ?? messages.errorRetryable : messages.recovered;
+  function start(event) {
+    if (unavailableMessage) {
+      event.preventDefault();
+      return;
+    }
+    startScope.current = composerVoiceEventScope(event.currentTarget) ?? null;
+    void transcription.start();
+  }
+  const needsAttention = !capturing && (recoverable || status === "error" && !!errorMessage);
+  useComposerFooterSignal("transcription-capturing", !suppressed && capturing);
+  useComposerFooterSignal("transcription-attention", !suppressed && needsAttention);
+  return /* @__PURE__ */ jsx4(AnimatePresence3, { initial: false, children: suppressed ? null : /* @__PURE__ */ jsx4(
+    motion3.span,
+    {
+      initial: { opacity: 0, width: 0 },
+      animate: { opacity: 1, width: "auto" },
+      exit: { opacity: 0, width: 0 },
+      transition: { duration: 0.36, ease: [0.22, 1, 0.36, 1] },
+      className: cn(
+        "inline-flex min-w-0 overflow-hidden",
+        // Mobile capture mode reserves the footer for this control. Keep the
+        // shell itself from shrinking and clipping its trailing actions.
+        capturing && "shrink-0",
+        className
+      ),
+      "data-transcription-status": status,
+      "data-transcription-capturing": capturing ? "" : void 0,
+      "data-transcription-attention": needsAttention ? "" : void 0,
+      children: /* @__PURE__ */ jsxs4("span", { className: "inline-flex min-w-0 items-center gap-1.5", children: [
+        /* @__PURE__ */ jsx4(AnimatePresence3, { mode: "popLayout", initial: false, children: recoverable ? /* @__PURE__ */ jsxs4(
+          motion3.span,
+          {
+            initial: { opacity: 0, scale: 0.96 },
+            animate: { opacity: 1, scale: 1 },
+            exit: { opacity: 0, scale: 0.96 },
+            transition: { duration: 0.16, ease: [0.22, 1, 0.36, 1] },
+            className: cn(
+              "inline-flex h-8 min-w-0 items-center gap-1 rounded-og-md border border-og-border/80",
+              "bg-og-surface-2/70 pl-2 pr-1 pointer-coarse:h-11"
+            ),
+            children: [
+              /* @__PURE__ */ jsx4(
+                "span",
+                {
+                  title: recoveredLabel,
+                  className: "og-transcription-recovered-label max-w-56 line-clamp-2 text-og-xs leading-tight text-og-fg-muted max-sm:max-w-32",
+                  children: recoveredLabel
+                }
+              ),
+              /* @__PURE__ */ jsx4(
+                Tip,
+                {
+                  tip: savedTranscript ? messages.insertRecoveredTranscript : retrying ? messages.pauseRetrying : status === "recovered" ? messages.transcribeSaved : messages.retry,
+                  children: /* @__PURE__ */ jsx4(
+                    "button",
+                    {
+                      type: "button",
+                      disabled: composer.disabled && !retrying,
+                      onClick: () => savedTranscript ? void transcription.insertSavedTranscript() : retrying ? transcription.setAside() : transcription.retry(),
+                      "aria-label": savedTranscript ? messages.insertRecoveredTranscript : retrying ? messages.pauseRetrying : status === "recovered" ? messages.transcribeSaved : messages.retry,
+                      className: cn(
+                        "inline-flex size-7 shrink-0 items-center justify-center rounded-og-sm",
+                        "border border-og-primary-border bg-og-primary text-og-primary-fg hover:bg-og-primary-hover transition-colors duration-150 motion-reduce:transition-none",
+                        "disabled:cursor-not-allowed disabled:opacity-50 pointer-coarse:size-11"
+                      ),
+                      children: savedTranscript ? /* @__PURE__ */ jsx4(ClipboardPasteIcon, { className: "size-3.5" }) : retrying ? /* @__PURE__ */ jsx4(SquareIcon2, { className: "size-3.5" }) : /* @__PURE__ */ jsx4(RefreshCwIcon, { className: "size-3.5" })
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsx4(Tip, { tip: messages.discardRecovered, children: /* @__PURE__ */ jsx4(
+                "button",
+                {
+                  type: "button",
+                  disabled: composer.disabled,
+                  onClick: () => void transcription.discard(),
+                  "aria-label": messages.discardRecovered,
+                  className: cn(
+                    "inline-flex size-7 shrink-0 items-center justify-center rounded-og-sm",
+                    "text-og-fg-muted transition-colors duration-150 motion-reduce:transition-none",
+                    "hover:bg-og-surface-3 hover:text-og-status-failed disabled:cursor-not-allowed disabled:opacity-50 pointer-coarse:size-11"
+                  ),
+                  children: /* @__PURE__ */ jsx4(Trash2Icon, { className: "size-3.5" })
+                }
+              ) })
+            ]
+          },
+          "recovered"
+        ) : active ? /* @__PURE__ */ jsxs4(
+          motion3.span,
+          {
+            initial: { opacity: 0, scale: 0.96 },
+            animate: { opacity: 1, scale: 1 },
+            exit: { opacity: 0, scale: 0.96 },
+            transition: { duration: 0.16, ease: [0.22, 1, 0.36, 1] },
+            className: cn(
+              "inline-flex h-8 items-center gap-1 rounded-og-md border border-og-border/80",
+              "bg-og-surface-2/70 pl-2 pr-1 pointer-coarse:h-11"
+            ),
+            children: [
+              status === "requesting-permission" ? /* @__PURE__ */ jsx4(
+                LoaderCircleIcon2,
+                {
+                  className: "size-3.5 shrink-0 text-og-fg-muted animate-og-spin motion-reduce:animate-none",
+                  "aria-hidden": true
+                }
+              ) : /* @__PURE__ */ jsxs4("span", { className: "flex items-center gap-1.5", children: [
+                status === "recording" ? /* @__PURE__ */ jsx4(
+                  "span",
+                  {
+                    "aria-hidden": true,
+                    className: "size-1.5 shrink-0 rounded-full bg-og-status-failed animate-og-pulse motion-reduce:animate-none"
+                  }
+                ) : null,
+                /* @__PURE__ */ jsx4(
+                  VoiceWaveform,
+                  {
+                    stream: status === "recording" ? transcription.stream : null,
+                    mode: status === "recording" ? "recording" : "transcribing"
+                  }
+                ),
+                status === "recording" && transcription.recordingStartedAt !== null ? /* @__PURE__ */ jsx4(
+                  RecordingClock,
+                  {
+                    startedAt: transcription.recordingStartedAt,
+                    maxSeconds: transcription.maxRecordingSeconds,
+                    remainingLabel: messages.timeRemaining
+                  }
+                ) : null
+              ] }),
+              status === "recording" ? /* @__PURE__ */ jsxs4(Fragment2, { children: [
+                /* @__PURE__ */ jsx4(Tip, { tip: messages.cancel, children: /* @__PURE__ */ jsx4(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => transcription.cancel(),
+                    "aria-label": messages.cancel,
+                    className: cn(
+                      "inline-flex size-7 shrink-0 items-center justify-center rounded-og-sm",
+                      "text-og-fg-muted transition-colors duration-150 motion-reduce:transition-none",
+                      "hover:bg-og-surface-3 hover:text-og-fg pointer-coarse:size-11"
+                    ),
+                    children: /* @__PURE__ */ jsx4(XIcon2, { className: "size-3.5" })
+                  }
+                ) }),
+                /* @__PURE__ */ jsx4(Tip, { tip: messages.stop, children: /* @__PURE__ */ jsx4(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => transcription.stop(),
+                    "aria-label": messages.stop,
+                    className: cn(
+                      "inline-flex size-7 shrink-0 items-center justify-center rounded-og-sm",
+                      "border border-og-primary-border bg-og-primary text-og-primary-fg hover:bg-og-primary-hover",
+                      "transition-colors duration-150 motion-reduce:transition-none pointer-coarse:size-11"
+                    ),
+                    children: /* @__PURE__ */ jsx4(SquareIcon2, { className: "size-2.5 fill-current" })
+                  }
+                ) })
+              ] }) : status === "transcribing" || status === "saving" ? /* @__PURE__ */ jsx4(ShimmerText, { className: "px-1.5 text-og-xs font-medium whitespace-nowrap", children: status === "saving" ? messages.saving : messages.transcribing }) : /* @__PURE__ */ jsx4("span", { className: "px-1.5 text-og-xs text-og-fg-muted whitespace-nowrap", children: messages.requestingPermission })
+            ]
+          },
+          status === "transcribing" || status === "saving" ? "processing" : "capture"
+        ) : /* @__PURE__ */ jsx4(Tip, { tip: idleLabel, children: /* @__PURE__ */ jsx4(
+          motion3.button,
+          {
+            type: "button",
+            "data-og-composer-dictate": true,
+            initial: { opacity: 0, scale: 0.96 },
+            animate: { opacity: 1, scale: 1 },
+            exit: { opacity: 0, scale: 0.96 },
+            transition: { duration: 0.14, ease: [0.22, 1, 0.36, 1] },
+            onClick: start,
+            "aria-label": idleLabel,
+            "aria-pressed": false,
+            "aria-disabled": unavailableMessage !== null,
+            className: cn(
+              "inline-flex size-8 shrink-0 items-center justify-center rounded-og-md pointer-coarse:size-11",
+              "text-og-fg-muted transition-colors duration-150 motion-reduce:transition-none",
+              unavailableMessage ? "cursor-not-allowed opacity-45" : "hover:bg-og-surface-2 hover:text-og-fg"
+            ),
+            children: /* @__PURE__ */ jsx4(MicIcon, { className: "size-4" })
+          }
+        ) }, "idle") }),
+        status === "error" && errorMessage && !recoverable ? (
+          // Nothing is saved in this state, so dismissing loses no speech.
+          /* @__PURE__ */ jsxs4(
+            "button",
+            {
+              type: "button",
+              title: errorMessage,
+              "aria-label": t("composerTranscriptionControl.dismissErrormessage", { errorMessage }),
+              onClick: () => void transcription.discard(),
+              className: cn(
+                "inline-flex min-w-0 items-center gap-1 rounded-og-sm text-left outline-hidden",
+                "text-og-status-failed focus-visible:ring-2 focus-visible:ring-og-accent/45"
+              ),
+              children: [
+                /* @__PURE__ */ jsx4("span", { className: "og-transcription-error-label max-w-56 line-clamp-2 text-og-xs leading-tight max-sm:max-w-32", children: errorMessage }),
+                /* @__PURE__ */ jsx4(XIcon2, { className: "size-3 shrink-0 opacity-70", "aria-hidden": true })
+              ]
+            }
+          )
+        ) : null,
+        /* @__PURE__ */ jsx4(
+          "span",
+          {
+            className: "sr-only",
+            role: status === "error" ? "alert" : "status",
+            "aria-live": "polite",
+            children: announcement
+          }
+        )
+      ] })
+    },
+    "composer-dictate"
+  ) });
+}
+function RecordingClock({
+  startedAt,
+  maxSeconds,
+  remainingLabel
+}) {
+  const [now, setNow] = useState3(() => Date.now());
+  useEffect2(() => {
+    const timer = setInterval(() => setNow(Date.now()), 500);
+    return () => clearInterval(timer);
+  }, []);
+  const elapsed = Math.max(0, Math.floor((now - startedAt) / 1e3));
+  const remaining = maxSeconds === null ? null : Math.max(0, maxSeconds - elapsed);
+  const warn = remaining !== null && remaining <= 15;
+  const label = `${Math.floor(elapsed / 60)}:${String(elapsed % 60).padStart(2, "0")}`;
+  return /* @__PURE__ */ jsxs4(
+    "span",
+    {
+      "data-recording-clock": true,
+      title: warn ? remainingLabel.replace("{seconds}", String(remaining)) : void 0,
+      className: cn(
+        "min-w-[2.25rem] text-right text-og-xs tabular-nums",
+        warn ? "font-medium text-og-status-failed" : "text-og-fg-muted"
+      ),
+      children: [
+        label,
+        warn ? /* @__PURE__ */ jsx4("span", { className: "sr-only", children: remainingLabel.replace("{seconds}", String(remaining)) }) : null
+      ]
+    }
+  );
+}
+function VoiceWaveform({
+  stream,
+  mode
+}) {
+  const [levels, setLevels] = useState3(() => restingLevels(WAVEFORM_BARS));
+  const [live, setLive] = useState3(false);
+  useEffect2(() => {
+    if (!stream || mode !== "recording") {
+      setLive(false);
+      setLevels(restingLevels(WAVEFORM_BARS));
+      return;
+    }
+    const AudioCtx = window.AudioContext ?? window.webkitAudioContext;
+    if (!AudioCtx) return;
+    let cancelled = false;
+    let frame = 0;
+    let context = null;
+    try {
+      context = new AudioCtx();
+      const source = context.createMediaStreamSource(stream);
+      const analyser = context.createAnalyser();
+      analyser.fftSize = 64;
+      analyser.smoothingTimeConstant = 0.8;
+      source.connect(analyser);
+      const bins = new Uint8Array(analyser.frequencyBinCount);
+      const tick = () => {
+        if (cancelled) return;
+        analyser.getByteFrequencyData(bins);
+        const next = new Array(WAVEFORM_BARS);
+        const usable = Math.max(8, Math.floor(bins.length * 0.65));
+        for (let i = 0; i < WAVEFORM_BARS; i++) {
+          const start = Math.floor(i / WAVEFORM_BARS * usable);
+          const end = Math.max(start + 1, Math.floor((i + 1) / WAVEFORM_BARS * usable));
+          let sum = 0;
+          for (let j = start; j < end; j++) sum += bins[j] ?? 0;
+          const avg = sum / (end - start) / 255;
+          next[i] = Math.min(1, 0.14 + avg * 1.65);
+        }
+        setLevels(next);
+        setLive(true);
+        frame = requestAnimationFrame(tick);
+      };
+      void context.resume().then(() => {
+        if (!cancelled) frame = requestAnimationFrame(tick);
+      });
+    } catch {
+      setLive(false);
+    }
+    return () => {
+      cancelled = true;
+      cancelAnimationFrame(frame);
+      void context?.close();
+    };
+  }, [stream, mode]);
+  return /* @__PURE__ */ jsx4(
+    "span",
+    {
+      "aria-hidden": true,
+      "data-voice-waveform": live ? "live" : "fallback",
+      className: "flex h-4 w-[3.75rem] items-center justify-center gap-px",
+      children: WAVEFORM_BAR_KEYS.map((key, index) => {
+        const level = levels[index] ?? 0;
+        return /* @__PURE__ */ jsx4(
+          "span",
+          {
+            className: cn(
+              "w-0.5 rounded-full bg-og-fg-muted/90 origin-center",
+              !live && "animate-og-waveform motion-reduce:animate-none",
+              mode === "transcribing" && "opacity-45"
+            ),
+            style: {
+              height: live ? `${Math.max(3, Math.round(level * 14))}px` : "14px",
+              animationDelay: live ? void 0 : `${index % 9 * 0.07}s`,
+              opacity: live ? 0.55 + level * 0.45 : void 0
+            }
+          },
+          key
+        );
+      })
+    }
+  );
+}
+function restingLevels(count) {
+  return Array.from({ length: count }, (_, index) => 0.22 + index * 17 % 5 * 0.06);
+}
+function transcriptionErrorMessage(code, messages) {
+  switch (code) {
+    case "insufficient_credits":
+      return messages.errorInsufficientCredits;
+    case "allowance_exhausted":
+    case "monthly_model_cost_limit":
+      return messages.errorAllowanceExhausted;
+    case "policy_blocked":
+      return messages.errorPolicyBlocked;
+    case "region_restricted":
+      return messages.errorRegionRestricted;
+    case "permission_denied":
+      return messages.errorPermissionDenied;
+    case "not_supported":
+      return messages.errorNotSupported;
+    case "unavailable":
+      return messages.errorUnavailable;
+    case "too_large":
+      return messages.errorTooLarge;
+    case "invalid_audio":
+      return messages.errorInvalidAudio;
+    case "storage_unavailable":
+      return messages.errorStorageUnavailable;
+    case "network":
+    case "provider":
+    case "timeout":
+      return messages.errorRetryable;
+    case "handoff_uncertain":
+      return messages.errorHandoffUncertain;
+    case "unknown":
+      return messages.errorUnknown;
+    default:
+      return messages.errorUnknown;
+  }
+}
+
+export {
+  parseCommandLine,
+  hasPermission,
+  matchCommand,
+  filterCommands,
+  argHint,
+  firstMissingRequiredArg,
+  defaultCommands,
+  useSlashCommands,
+  CommandPalette,
+  ModelPicker,
+  useChatComposerController,
+  useChatComposer,
+  Root,
+  Frame,
+  CommandPalette2,
+  Surface,
+  PausedState,
+  RestoredResources,
+  Attachments,
+  Input,
+  Confirmation,
+  Footer,
+  Controls,
+  Hint,
+  Actions,
+  AttachButton,
+  ModelPicker2,
+  PauseButtonSlot,
+  PauseButton,
+  StopButton,
+  AlternateSendButton,
+  SendButton,
+  Help,
+  Status,
+  ComposerTranscriptionControl
+};
+//# sourceMappingURL=chunk-2RG7NIAS.js.map