@ai-matrx/agents 0.59.198 → 0.59.200

package/dist/settings/react/index.cjs

@@ -31,7 +31,7 @@ __export(react_exports, {
   useSettingsSelector: () => useSettingsSelector
 });
 module.exports = __toCommonJS(react_exports);
-var import_react5 = require("react");
+var import_react3 = require("react");
 
 // generated/llm-enums.ts
 var LLM_PARAMS_KEYS = [
@@ -110,168 +110,6 @@ var LLM_PARAMS_KEYS = [
   "tts_quality"
 ];
 
-// models/capabilities.ts
-function isManagedAgentModelCapability(capabilities) {
-  return capabilities.interaction === "agent";
-}
-function isDecisionModelCapability(capabilities) {
-  return capabilities.interaction === "decision";
-}
-function acceptsTextInstructions(capabilities) {
-  if (capabilities.interaction === "realtime") return true;
-  const input = capabilities.input ?? [];
-  return input.length === 0 || input.includes("text");
-}
-
-// models/feature-map.ts
-var FEATURE_BUCKET_ORDER = [
-  "thinking",
-  "tools",
-  "schema",
-  "search",
-  "extraction",
-  "x_search",
-  "other"
-];
-var FEATURE_BUCKETS = {
-  schema: { label: "Schema", description: "Structured & JSON output" },
-  tools: { label: "Tools", description: "Function & tool calling" },
-  search: { label: "Search", description: "Web search" },
-  x_search: { label: "X Search", description: "X (Twitter) platform search" },
-  thinking: { label: "Thinking", description: "Reasoning & extended thinking" },
-  extraction: {
-    label: "Extraction",
-    description: "NER, classification & entity extraction"
-  },
-  other: { label: "Other", description: "Uncategorized or niche features" }
-};
-
-// models/format.ts
-var RATING_TO_TIER = {
-  1: "$",
-  2: "$$",
-  3: "$$$",
-  4: "$$$$",
-  5: "$$$$$",
-  6: "$$$$$+"
-  // renders as the "5+" band
-};
-var TOP_TIER_COST_RATING = 6;
-var TOP_TIER_LOCKED_TITLE = "This model is limited to approved accounts";
-function isTopTierRating(rating) {
-  return typeof rating === "number" && rating >= TOP_TIER_COST_RATING;
-}
-function costRatingTier(rating) {
-  if (typeof rating !== "number") return null;
-  return RATING_TO_TIER[rating] ?? null;
-}
-function speedRatingLabel(rating) {
-  if (typeof rating !== "number") return null;
-  return rating >= 6 ? "5+" : String(rating);
-}
-function speedRatingWord(rating) {
-  if (typeof rating !== "number") return "\u2014";
-  if (rating <= 2) return "Slow";
-  if (rating === 3) return "Med";
-  if (rating === 4) return "Fast";
-  if (rating === 5) return "Fast+";
-  return "Max";
-}
-function costRatingWord(rating) {
-  if (typeof rating !== "number") return "\u2014";
-  if (rating <= 1) return "Low";
-  if (rating === 2) return "Low+";
-  if (rating === 3) return "Med";
-  if (rating === 4) return "High";
-  if (rating === 5) return "High+";
-  return "Max";
-}
-function priceTierRating(tier) {
-  return tier.endsWith("+") ? 6 : tier.length;
-}
-
-// models/service-label.ts
-var SERVICE_LABEL = "Service";
-var SERVICE_LABEL_PLURAL = "Services";
-function serviceCountLabel(count) {
-  const noun = (count === 1 ? SERVICE_LABEL : SERVICE_LABEL_PLURAL).toLowerCase();
-  return `${count} ${noun}`;
-}
-
-// models/catalog/types.ts
-var INPUT_MODALITIES = ["text", "image", "audio", "video"];
-var OUTPUT_MODALITIES = [
-  "text",
-  "image",
-  "audio",
-  "video",
-  "entities",
-  "decision"
-];
-
-// models/succession.ts
-var MAX_SUCCESSION_HOPS = 8;
-function buildSuccessionIndex(models) {
-  return new Map(models.map((m) => [m.id, m]));
-}
-function isSupersedable(node) {
-  return node.isDeprecated || node.retiredAt != null;
-}
-var loggedBroken = /* @__PURE__ */ new Set();
-function logBroken(modelId, reason) {
-  if (loggedBroken.has(modelId)) return;
-  loggedBroken.add(modelId);
-  console.warn(`[models/succession] ${modelId}: successor chain broken (${reason}); keeping the original model.`);
-}
-function resolveSuccessor(modelId, index) {
-  const start = index.get(modelId);
-  if (!start || !isSupersedable(start) || !start.successorId) return modelId;
-  const seen = /* @__PURE__ */ new Set([modelId]);
-  let current = start;
-  for (let hop = 0; hop < MAX_SUCCESSION_HOPS; hop += 1) {
-    const nextId = current.successorId;
-    if (!nextId) {
-      logBroken(modelId, `${current.id} is superseded and names no successor`);
-      return modelId;
-    }
-    if (seen.has(nextId)) {
-      logBroken(modelId, `cycle at ${nextId}`);
-      return modelId;
-    }
-    const next = index.get(nextId);
-    if (!next) {
-      logBroken(modelId, `successor ${nextId} is not in the catalog`);
-      return modelId;
-    }
-    if (!isSupersedable(next)) return next.id;
-    seen.add(nextId);
-    current = next;
-  }
-  logBroken(modelId, `more than ${MAX_SUCCESSION_HOPS} hops`);
-  return modelId;
-}
-
-// models/fit.ts
-var featuresOf = (c) => {
-  const f = c.features;
-  if (!f) return [];
-  return Array.isArray(f) ? f : f.raw ?? [];
-};
-function seesImages(c) {
-  return (c.input ?? []).includes("image") || featuresOf(c).includes("vision");
-}
-function takesInput(c, modality) {
-  if (modality === "image") return seesImages(c);
-  return (c.input ?? []).includes(modality);
-}
-var MEDIA_GENERATION_FEATURES = /* @__PURE__ */ new Set(["image_generation", "video_generation", "audio_generation", "music_generation"]);
-function isChatModelCapability(c) {
-  if (c.interaction !== "turn") return false;
-  if (!(c.input ?? []).includes("text")) return false;
-  if (!(c.output ?? []).includes("text")) return false;
-  return !featuresOf(c).some((f) => MEDIA_GENERATION_FEATURES.has(f));
-}
-
 // settings/ui-gates.ts
 var UI_GATE_KEYS = [
   "tools",
@@ -299,2107 +137,82 @@ var ALL_KNOWN_KEYS = /* @__PURE__ */ new Set([
   "end_image",
   "enhance_prompt",
   "first_frame_image",
-  "generate_audio",
-  "image",
-  "image_format",
-  "image_input",
-  "image_inputs",
-  "image_size",
-  "image_url",
-  "include_rai_reason",
-  "input_fidelity",
-  "input_images",
-  "last_frame",
-  "last_frame_image",
-  "mask",
-  "media",
-  "moderation",
-  "num_outputs",
-  "number_of_images",
-  "output_compression",
-  "output_mime_type",
-  "output_quality",
-  "partial_images",
-  "person_generation",
-  "prompt_image",
-  "quality",
-  "ratio",
-  "reference_strength",
-  "render_quality",
-  "resolution",
-  "seconds",
-  "start_image",
-  "start_image_url",
-  "style",
-  "video_action",
-  "video_input",
-  "multi_speaker",
-  // Legacy DB keys — normalizer converts at Redux boundary, but we still recognize them
-  "max_tokens",
-  "output_format",
-  "n",
-  // Frontend-only capability flags (never sent to the API)
-  "tools",
-  "file_urls",
-  "image_urls",
-  "youtube_videos",
-  "multi_speaker",
-  "internal_web_search",
-  "internal_url_context",
-  // Backend param not yet in generated types
-  "image_loras",
-  // Stop sequences
-  "stop_sequences"
-]);
-var UI_ONLY_SET = new Set(UI_GATE_KEYS);
-function mergeEffectiveSettings(defaults, overrides) {
-  const merged = { ...defaults };
-  for (const [key, value] of Object.entries(overrides)) {
-    if (value === null) delete merged[key];
-    else if (value !== void 0) merged[key] = value;
-  }
-  return merged;
-}
-
-// settings/store.ts
-var EMPTY = Object.freeze({});
-function readSettingsEntry(state, agentId) {
-  return agentId ? state.entries[agentId] : void 0;
-}
-function readEffectiveSettings(entry) {
-  return entry ? mergeEffectiveSettings(entry.defaults, entry.overrides) : EMPTY;
-}
-
-// settings/react/ModelSettingsPanel.tsx
-var import_design_system5 = require("@ai-matrx/design-system");
-var import_controls4 = require("@ai-matrx/design-system/controls");
-
-// models/react/context.tsx
-var import_react = require("react");
-var import_jsx_runtime = require("react/jsx-runtime");
-var ModelCatalogContext = (0, import_react.createContext)(null);
-function useBinding(hook) {
-  const binding = (0, import_react.useContext)(ModelCatalogContext);
-  if (!binding) {
-    throw new Error(`${hook}() needs <ModelCatalogProvider catalog={createModelCatalog(...)} favorites={createModelFavorites(...)}> above it. A picker with no catalog is a lie on screen.`);
-  }
-  return binding;
-}
-var useModelCatalogUiPorts = () => useBinding("useModelCatalogUiPorts").ports;
-function useModelCatalog(variant) {
-  const { catalog } = useBinding("useModelCatalog");
-  const state = (0, import_react.useSyncExternalStore)(catalog.subscribe, catalog.getState, catalog.getState);
-  (0, import_react.useEffect)(() => {
-    void catalog.load(variant);
-  }, [catalog, variant]);
-  const v = state[variant];
-  const loading = v.status === "idle" || v.status === "loading";
-  return {
-    models: loading ? [] : v.models,
-    isLoading: loading,
-    error: loading ? null : v.error,
-    reload: () => {
-      void catalog.reload(variant);
-    }
-  };
-}
-function useModelFavorites(active) {
-  const { favorites } = useBinding("useModelFavorites");
-  const state = (0, import_react.useSyncExternalStore)(favorites.subscribe, favorites.getState, favorites.getState);
-  (0, import_react.useEffect)(() => {
-    void favorites.reconcile();
-  }, [favorites, active]);
-  const favoriteSet = (0, import_react.useMemo)(() => new Set(state.favoriteIds), [state.favoriteIds]);
-  return { favoriteIds: state.favoriteIds, favoriteSet, toggleFavorite: favorites.toggle };
-}
-var NO_LOCAL_MODELS = [];
-var noopSubscribe = () => () => {
-};
-function useLocalModels(override) {
-  const contextPort = useBinding("useLocalModels").ports.localModels;
-  const port = override ?? contextPort;
-  const models = (0, import_react.useSyncExternalStore)(
-    port ? port.subscribe : noopSubscribe,
-    port ? port.getModels : () => NO_LOCAL_MODELS,
-    port ? port.getModels : () => NO_LOCAL_MODELS
-  );
-  return { models, groupLabel: port?.groupLabel ?? "On this computer", open: port?.open ? (id) => port.open?.(id) : void 0 };
-}
-
-// models/react/ModelListDropdown.tsx
-var import_format = require("@ai-matrx/kit/format");
-var import_react2 = require("react");
-var import_design_system = require("@ai-matrx/design-system");
-var import_controls = require("@ai-matrx/design-system/controls");
-var import_brand_glyphs = require("@ai-matrx/icons/brand-glyphs");
-
-// catalog/shared/icon-paths.ts
-var SHAPES = {
-  star: {
-    paths: [
-      "M11.5 3.2a.6.6 0 0 1 1 0l2.3 4.7 5.2.8a.6.6 0 0 1 .3 1l-3.8 3.7.9 5.2a.6.6 0 0 1-.9.6L12 16.8l-4.6 2.4a.6.6 0 0 1-.9-.6l.9-5.2-3.8-3.7a.6.6 0 0 1 .3-1l5.2-.8Z"
-    ],
-    fillable: true
-  },
-  chevronRight: { paths: ["m9 18 6-6-6-6"] },
-  chevronDown: { paths: ["m6 9 6 6 6-6"] },
-  search: {
-    paths: ["m21 21-4.3-4.3"],
-    circles: [{ cx: 11, cy: 11, r: 8 }]
-  },
-  x: { paths: ["M18 6 6 18", "m6 6 12 12"] },
-  check: { paths: ["M20 6 9 17l-5-5"] },
-  arrowUpDown: {
-    paths: ["m21 16-4 4-4-4", "M17 20V4", "m3 8 4-4 4 4", "M7 4v16"]
-  },
-  folder: {
-    paths: [
-      "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z"
-    ]
-  },
-  tag: {
-    paths: [
-      "M12.586 2.586A2 2 0 0 0 11.172 2H4a2 2 0 0 0-2 2v7.172a2 2 0 0 0 .586 1.414l8.704 8.704a2.426 2.426 0 0 0 3.42 0l6.58-6.58a2.426 2.426 0 0 0 0-3.42z"
-    ],
-    circles: [{ cx: 7.5, cy: 7.5, r: 0.5, filled: true }]
-  },
-  rotateCcw: {
-    paths: [
-      "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8",
-      "M3 3v5h5"
-    ]
-  },
-  loader: { paths: ["M21 12a9 9 0 1 1-6.219-8.56"] },
-  alertTriangle: {
-    paths: [
-      "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3",
-      "M12 9v4",
-      "M12 17h.01"
-    ]
-  },
-  /**
-   * The Orchestra marker (Lucide `music-4`): the glyph the Workflow Studio's
-   * picker used for a conductor, kept identical so the same agent wears the
-   * same mark in every client.
-   */
-  music4: {
-    paths: ["M9 18V5l12-2v13", "m9 9 12-2"],
-    circles: [
-      { cx: 6, cy: 18, r: 3 },
-      { cx: 18, cy: 16, r: 3 }
-    ]
-  },
-  clock: {
-    paths: ["M12 6v6l4 2"],
-    circles: [{ cx: 12, cy: 12, r: 10 }]
-  },
-  globe: {
-    paths: ["M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20", "M2 12h20"],
-    circles: [{ cx: 12, cy: 12, r: 10 }]
-  },
-  users: {
-    paths: [
-      "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2",
-      "M22 21v-2a4 4 0 0 0-3-3.87",
-      "M16 3.13a4 4 0 0 1 0 7.75"
-    ],
-    circles: [{ cx: 9, cy: 7, r: 4 }]
-  },
-  externalLink: {
-    paths: [
-      "M15 3h6v6",
-      "M10 14 21 3",
-      "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"
-    ]
-  },
-  messageCircle: { paths: ["M7.9 20A9 9 0 1 0 4 16.1L2 22Z"] },
-  rocket: {
-    paths: [
-      "M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91 0",
-      "m12 15-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 0 1-4 2",
-      "M9 12H4s.55-3.03 2-4c1.62-1.08 5 0 5 0",
-      "M12 15v5s3.03-.55 4-2c1.08-1.62 0-5 0-5"
-    ]
-  },
-  /**
-   * THE ARCHIVE GLYPH (Lucide `archive`) — the ONE mark of the platform
-   * archive filter, drawn identically in every Matrx client so the control a
-   * person learns on one surface is recognizable on all of them.
-   */
-  archive: {
-    paths: [
-      "M3 3h18a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1z",
-      "M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8",
-      "M10 12h4"
-    ]
-  },
-  circleCheck: {
-    paths: ["m9 12 2 2 4-4"],
-    circles: [{ cx: 12, cy: 12, r: 10 }]
-  }
-};
-var ICON_PATHS = SHAPES;
-var ICON_NAMES = Object.keys(ICON_PATHS);
-
-// catalog/react/icons.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
-function Svg({ children, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: 2,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      "aria-hidden": "true",
-      ...props,
-      children
-    }
-  );
-}
-function Shape({ name, filled }) {
-  const shape = ICON_PATHS[name];
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
-    shape.paths.map((d, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-      "path",
-      {
-        d,
-        ...filled && shape.fillable ? { fill: "currentColor" } : {}
-      },
-      `p${index}`
-    )),
-    (shape.circles ?? []).map((circle, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-      "circle",
-      {
-        cx: circle.cx,
-        cy: circle.cy,
-        r: circle.r,
-        ...circle.filled ? { fill: "currentColor" } : {}
-      },
-      `c${index}`
-    ))
-  ] });
-}
-function makeIcon(name) {
-  return function Icon(props) {
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Svg, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Shape, { name, filled: false }) });
-  };
-}
-var ArrowUpDownIcon = makeIcon("arrowUpDown");
-var FolderIcon = makeIcon("folder");
-var TagIcon = makeIcon("tag");
-var RotateCcwIcon = makeIcon("rotateCcw");
-var LoaderIcon = makeIcon("loader");
-var UsersIcon = makeIcon("users");
-var MessageCircleIcon = makeIcon("messageCircle");
-var RocketIcon = makeIcon("rocket");
-var CircleCheckIcon = makeIcon("circleCheck");
-var AlertTriangleIcon = makeIcon("alertTriangle");
-var Music4Icon = makeIcon("music4");
-function MousePointerClickIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Svg, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M14 4.1 12 6" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m5.1 8-2.9-.8" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m6 12-1.9 2" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M7.2 2.2 8 5.1" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M9.037 9.69a.498.498 0 0 1 .653-.653l11 4.5a.5.5 0 0 1-.074.949l-4.349 1.041a1 1 0 0 0-.74.739l-1.04 4.35a.5.5 0 0 1-.95.074z" })
-  ] });
-}
-
-// models/react/icons.tsx
-var import_jsx_runtime3 = require("react/jsx-runtime");
-function Svg2({ children, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: 2,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      "aria-hidden": "true",
-      ...props,
-      children
-    }
-  );
-}
-function ShieldIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Svg2, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z" }) });
-}
-function SlidersHorizontalIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Svg2, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M10 5H3" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M12 19H3" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M14 3v4" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M16 17v4" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M21 12h-9" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M21 19h-5" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M21 5h-7" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M8 10v4" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M8 12H3" })
-  ] });
-}
-function TypeIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Svg2, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M12 4v16" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M4 7V5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M9 20h6" })
-  ] });
-}
-function ImageIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Svg2, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", ry: "2" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("circle", { cx: "9", cy: "9", r: "2" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" })
-  ] });
-}
-function AudioLinesIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Svg2, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M2 10v3" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M6 6v11" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M10 3v18" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M14 8v7" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M18 5v13" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M22 10v3" })
-  ] });
-}
-function BoxesIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Svg2, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M2.97 12.92A2 2 0 0 0 2 14.63v3.24a2 2 0 0 0 .97 1.71l3 1.8a2 2 0 0 0 2.06 0L12 19v-5.5l-5-3-4.03 2.42Z" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "m7 16.5-4.74-2.85" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "m7 16.5 5-3" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M7 16.5v5.17" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M12 13.5V19l3.97 2.38a2 2 0 0 0 2.06 0l3-1.8a2 2 0 0 0 .97-1.71v-3.24a2 2 0 0 0-.97-1.71L17 10.5l-5 3Z" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "m17 16.5-5-3" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "m17 16.5 4.74-2.85" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M17 16.5v5.17" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M7.97 4.42A2 2 0 0 0 7 6.13v4.37l5 3 5-3V6.13a2 2 0 0 0-.97-1.71l-3-1.8a2 2 0 0 0-2.06 0l-3 1.8Z" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M12 8 7.26 5.15" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "m12 8 4.74-2.85" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M12 13.5V8" })
-  ] });
-}
-function FileTextIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Svg2, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M14 2v5a1 1 0 0 0 1 1h5" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M10 9H8" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M16 13H8" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M16 17H8" })
-  ] });
-}
-function LayersIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Svg2, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83z" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M2 12a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 12" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M2 17a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 17" })
-  ] });
-}
-function ScaleIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Svg2, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M12 3v18" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "m19 8 3 8a5 5 0 0 1-6 0zV7" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M3 7h1a17 17 0 0 0 8-2 17 17 0 0 0 8 2h1" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "m5 8 3 8a5 5 0 0 1-6 0zV7" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M7 21h10" })
-  ] });
-}
-function LanguagesIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Svg2, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "m5 8 6 6" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "m4 14 6-6 2-3" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M2 5h12" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M7 2h1" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "m22 22-5-10-5 10" }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M14 18h6" })
-  ] });
-}
-
-// models/react/ModelListDropdown.tsx
-var import_icons3 = require("@ai-matrx/design-system/icons");
-var import_jsx_runtime4 = require("react/jsx-runtime");
-var PANEL_HEIGHT = 640;
-var LIST_MAX_HEIGHT = `min(${PANEL_HEIGHT}px, var(--radix-popper-available-height, 70dvh))`;
-var LIST_WIDTH = 520;
-var DETAIL_WIDTH = 540;
-var INLINE_LIST_MIN_WIDTH = 400;
-var INLINE_DETAIL_MIN_WIDTH = 280;
-var ADMIN_PANEL_WIDTH = 400;
-var ADMIN_ONLY_SORTS = /* @__PURE__ */ new Set([
-  "vendor",
-  "api",
-  "deprecated",
-  "availability",
-  "premium"
-]);
-var MODALITY_ICON = {
-  text: TypeIcon,
-  image: ImageIcon,
-  audio: AudioLinesIcon,
-  video: import_icons3.VideoIcon,
-  document: FileTextIcon,
-  entities: BoxesIcon,
-  embedding: LayersIcon,
-  decision: ScaleIcon
-};
-var INTERACTION_LABEL = {
-  turn: "Standard",
-  single: "Single-shot",
-  extraction: "Extraction",
-  realtime: "Realtime",
-  embedding: "Embedding",
-  agent: "Background agent",
-  decision: "Decision",
-  adapter: "Adapter",
-  detection: "Detector"
-};
-function SpeedDots({ value }) {
-  const label = speedRatingLabel(value);
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-    "span",
-    {
-      className: "inline-flex items-center gap-1",
-      title: label == null ? "No speed rating yet" : `Speed ${label}/5`,
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "text-[11px] font-medium tabular-nums text-foreground/80", children: speedRatingWord(value) }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "inline-flex items-center gap-0.5", children: [
-          [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-            "span",
-            {
-              className: (0, import_design_system.cn)(
-                "h-1.5 w-1.5 rounded-full",
-                value != null && i < value ? "bg-foreground/70" : "bg-muted-foreground/25"
-              )
-            },
-            i
-          )),
-          value != null && value >= 6 && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "text-[9px] leading-none text-amber-500", children: "+" })
-        ] })
-      ]
-    }
-  );
-}
-function SpeedCell({ value }) {
-  const word = speedRatingWord(value);
-  const label = speedRatingLabel(value);
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    DelayedHint,
-    {
-      label: label == null ? "No speed rating yet" : `Speed ${word} (${label}/5)`,
-      children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "inline-block w-11 text-right text-[11px] font-medium tabular-nums text-foreground/80", children: word })
-    }
-  );
-}
-function CostTier({ tier }) {
-  if (!tier)
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "text-[11px] text-muted-foreground/50", children: "\u2014" });
-  const rating = priceTierRating(tier);
-  const word = costRatingWord(rating);
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    DelayedHint,
-    {
-      label: `Relative cost ${word} (${rating >= 6 ? "5+" : rating}/5 compared with other models)`,
-      children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "inline-block w-11 text-right text-[11px] font-medium tabular-nums text-foreground/80", children: word })
-    }
-  );
-}
-function ModalityIcons({ list }) {
-  if (list.length === 0)
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "text-[11px] text-muted-foreground/50", children: "\u2014" });
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "inline-flex flex-nowrap items-center gap-1 whitespace-nowrap", children: list.map((m) => {
-    const Icon = MODALITY_ICON[m];
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-      "span",
-      {
-        className: "inline-flex shrink-0 items-center gap-0.5 text-xs text-foreground/70",
-        title: m,
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Icon, { className: "h-3 w-3" }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "capitalize", children: m })
-        ]
-      },
-      m
-    );
-  }) });
-}
-function AdminRow({
-  label,
-  value,
-  mono
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex items-baseline gap-2 whitespace-nowrap", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "w-[76px] shrink-0 text-[10px] uppercase tracking-wide text-muted-foreground", children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      "span",
-      {
-        className: (0, import_design_system.cn)(
-          "min-w-0 truncate text-[11px] text-foreground/90",
-          mono && "font-mono"
-        ),
-        title: value ?? void 0,
-        children: value ?? "\u2014"
-      }
-    )
-  ] });
-}
-function fmtUsd(n) {
-  return n == null ? "\u2014" : `$${n}`;
-}
-function fmtPoints(n) {
-  return n == null ? "\u2014" : n.toLocaleString();
-}
-function fmtPointsCompact(n) {
-  return (0, import_format.formatCount)(n, { style: "compact" });
-}
-function AdminOfferingBlock({
-  offering,
-  index,
-  total
-}) {
-  const unit = offering.usageBasis ? `/ ${offering.usageBasis}` : "/ 1M tokens";
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "rounded-md border border-border p-2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "mb-1.5 flex items-center justify-between gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "truncate text-[11px] font-semibold text-foreground", children: [
-        "Offering ",
-        index + 1,
-        " of ",
-        total,
-        index === 0 ? " \u2014 preferred" : ""
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-        "span",
-        {
-          className: (0, import_design_system.cn)(
-            "shrink-0 rounded px-1.5 py-0.5 text-[9px] font-medium",
-            offering.isAvailable ? "bg-primary/10 text-foreground/80" : "bg-destructive/15 text-destructive-ink"
-          ),
-          children: offering.isAvailable ? "Available" : "Unavailable"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "space-y-0.5", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AdminRow, { label: "Model", value: offering.providerModelId, mono: true }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AdminRow, { label: "Vendor", value: offering.vendor, mono: true }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AdminRow, { label: "API", value: offering.apiName, mono: true }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AdminRow, { label: "Translator", value: offering.translatorKey, mono: true }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AdminRow, { label: "Transport", value: offering.transport, mono: true }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-        AdminRow,
-        {
-          label: "Endpoint",
-          value: offering.endpointDisplayName || offering.endpointInternalName ? `${offering.endpointDisplayName ?? "\u2014"} (${offering.endpointInternalName ?? "\u2014"})` : null
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AdminRow, { label: "Priority", value: String(offering.priority), mono: true }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-        AdminRow,
-        {
-          label: "Points in",
-          value: offering.pointsInput == null ? null : `${fmtPoints(offering.pointsInput)} / 1M`,
-          mono: true
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-        AdminRow,
-        {
-          label: "Points out",
-          value: offering.pointsOutput == null ? null : `${fmtPoints(offering.pointsOutput)} / 1M`,
-          mono: true
-        }
-      ),
-      offering.pointsCachedInput != null && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-        AdminRow,
-        {
-          label: "Points cached",
-          value: `${fmtPoints(offering.pointsCachedInput)} / 1M`,
-          mono: true
-        }
-      ),
-      offering.pricing.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AdminRow, { label: "Pricing", value: "\u2014 (no pricing rows)" }) : offering.pricing.map((band, i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "space-y-0.5", children: [
-        band.maxTokens != null && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          AdminRow,
-          {
-            label: `Band ${i + 1}`,
-            value: `\u2264 ${(0, import_format.formatCount)(band.maxTokens)} tokens`
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          AdminRow,
-          {
-            label: "Input $",
-            value: `${fmtUsd(band.inputPrice)} ${unit}`,
-            mono: true
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          AdminRow,
-          {
-            label: "Output $",
-            value: `${fmtUsd(band.outputPrice)} ${unit}`,
-            mono: true
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          AdminRow,
-          {
-            label: "Cached $",
-            value: `${fmtUsd(band.cachedInputPrice)} ${unit}`,
-            mono: true
-          }
-        )
-      ] }, i)),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-        AdminRow,
-        {
-          label: "Billing",
-          value: offering.usageBasis ? `Usage basis: ${offering.usageBasis}` : offering.tokenBilled ? "Token-billed (provider-reported tokens)" : "Standard $ / 1M tokens"
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AdminRow, { label: "Offering", value: offering.offeringId, mono: true })
-    ] })
-  ] });
-}
-function AdminOfferingsSection({ model }) {
-  const offerings = model.admin?.offerings ?? [];
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex h-full flex-col", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "shrink-0 border-b border-border px-3 py-2 text-[10px] uppercase tracking-wide text-muted-foreground", children: [
-      "Offerings \u2014 real vendor / wire data (",
-      offerings.length,
-      ")"
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "min-h-0 flex-1 space-y-2 overflow-y-auto p-2", children: offerings.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "rounded-md border border-destructive/40 bg-destructive/10 p-2 text-[11px] text-destructive-ink", children: "No offerings \u2014 this model is not callable (a model without an `ai.offering` row cannot be routed)." }) : offerings.map((o, i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      AdminOfferingBlock,
-      {
-        offering: o,
-        index: i,
-        total: offerings.length
-      },
-      o.offeringId
-    )) })
-  ] });
-}
-var SERVICE_CHIP_SELECTED = "rounded border border-primary/40 bg-primary/10 px-1.5 py-0.5 text-[10px] font-medium text-foreground";
-var SERVICE_CHIP_UNSELECTED = "rounded border border-border px-1.5 py-0.5 text-[10px] text-foreground/80";
-function ModelDetailCard({
-  model,
-  tier,
-  variant,
-  onSelect,
-  isCurrentModel,
-  pinnedOfferingId,
-  onPinOffering,
-  includeAdminSection
-}) {
-  const pinnedHere = (t) => !!isCurrentModel && !!pinnedOfferingId && t.offeringId === pinnedOfferingId;
-  const anyPinnedHere = model.tiers.some(pinnedHere);
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex h-full flex-col", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "min-h-0 flex-1 overflow-y-auto p-4", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex items-start justify-between gap-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "min-w-0", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "truncate text-sm font-semibold text-foreground", children: model.name }),
-          model.maker && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "mt-0.5 flex items-center gap-1 text-xs text-muted-foreground", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-              import_brand_glyphs.MakerBrandGlyph,
-              {
-                maker: model.maker,
-                colored: true,
-                className: "h-3.5 w-3.5"
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: model.maker })
-          ] })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex shrink-0 flex-col items-end gap-1", children: [
-          model.isPrimary && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "rounded bg-muted px-1.5 py-0.5 text-[10px] font-medium text-foreground/70", children: "Default" }),
-          model.isPremium && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "rounded bg-muted px-1.5 py-0.5 text-[10px] font-medium text-foreground/70", children: "Premium" }),
-          model.isDeprecated && !model.retiredAt && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-            "span",
-            {
-              className: "rounded bg-destructive/15 px-1.5 py-0.5 text-[10px] font-medium text-destructive-ink",
-              title: "Still runs normally; hidden from default selection.",
-              children: "Deprecated"
-            }
-          ),
-          model.retiredAt && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-            "span",
-            {
-              className: "rounded bg-destructive/15 px-1.5 py-0.5 text-[10px] font-medium text-destructive-ink",
-              title: `The provider no longer serves this model (retired ${model.retiredAt.slice(0, 10)}). It cannot be selected.`,
-              children: "Retired"
-            }
-          )
-        ] })
-      ] }),
-      model.description && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "mt-2 line-clamp-3 text-xs text-muted-foreground", children: model.description }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("dl", { className: "mt-3 space-y-2 text-xs", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dt", { className: "mb-0.5 text-[10px] uppercase tracking-wide text-muted-foreground", children: "Input" }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dd", { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ModalityIcons, { list: model.input }) })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dt", { className: "mb-0.5 text-[10px] uppercase tracking-wide text-muted-foreground", children: "Output" }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dd", { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ModalityIcons, { list: model.output }) })
-        ] }),
-        model.features.buckets.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dt", { className: "mb-0.5 text-[10px] uppercase tracking-wide text-muted-foreground", children: "Features" }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dd", { className: "flex flex-wrap gap-1", children: model.features.buckets.map((b) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-            "span",
-            {
-              className: "whitespace-nowrap rounded border border-border px-1.5 py-0.5 text-[10px] text-foreground/80",
-              title: FEATURE_BUCKETS[b].description,
-              children: FEATURE_BUCKETS[b].label
-            },
-            b
-          )) })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "grid grid-cols-2 gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "col-span-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dt", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: "Points / 1M tokens" }),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-              "dd",
-              {
-                className: "whitespace-nowrap text-sm font-semibold tabular-nums text-foreground",
-                title: "Points per 1 million tokens \u2014 what usage actually costs you",
-                children: model.pointsInput == null && model.pointsOutput == null ? "\u2014" : `${fmtPoints(model.pointsInput)} in \xB7 ${fmtPoints(model.pointsOutput)} out`
-              }
-            )
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dt", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: "Context window" }),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dd", { className: "tabular-nums text-foreground/80", children: model.contextWindow?.toLocaleString() ?? "\u2014" })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dt", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: "Max output" }),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dd", { className: "tabular-nums text-foreground/80", children: model.maxTokens?.toLocaleString() ?? "\u2014" })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dt", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: "Cost" }),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dd", { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CostTier, { tier }) })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dt", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: "Speed" }),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dd", { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SpeedDots, { value: model.speedRating }) })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dt", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: "Interaction" }),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dd", { className: "text-foreground/80", children: INTERACTION_LABEL[model.interaction] })
-          ] })
-        ] }),
-        model.tiers[0]?.servedVia && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dt", { className: "mb-0.5 text-[10px] uppercase tracking-wide text-muted-foreground", children: model.tiers.length === 1 ? SERVICE_LABEL : SERVICE_LABEL_PLURAL }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dd", { className: "flex flex-wrap gap-1", children: onPinOffering ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-              "button",
-              {
-                type: "button",
-                onClick: () => onPinOffering(model, void 0),
-                title: "Auto \u2014 the server picks the preferred Service for each call",
-                className: (0, import_design_system.cn)(
-                  "transition-colors",
-                  !anyPinnedHere ? SERVICE_CHIP_SELECTED : (0, import_design_system.cn)(
-                    SERVICE_CHIP_UNSELECTED,
-                    "hover:bg-muted/60 hover:text-foreground"
-                  )
-                ),
-                children: "Auto"
-              }
-            ),
-            model.tiers.map((t) => {
-              const pinned = pinnedHere(t);
-              return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-                "button",
-                {
-                  type: "button",
-                  onClick: () => onPinOffering(
-                    model,
-                    pinned ? void 0 : t.offeringId
-                  ),
-                  title: pinned ? "Pinned \u2014 every call uses this Service. Click to return to Auto." : `Pin every call to ${t.servedVia}`,
-                  className: (0, import_design_system.cn)(
-                    "transition-colors",
-                    pinned ? SERVICE_CHIP_SELECTED : (0, import_design_system.cn)(
-                      SERVICE_CHIP_UNSELECTED,
-                      "hover:bg-muted/60 hover:text-foreground"
-                    )
-                  ),
-                  children: t.servedVia
-                },
-                t.offeringId
-              );
-            })
-          ] }) : model.tiers.map((t, i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-            "span",
-            {
-              className: i === 0 ? SERVICE_CHIP_SELECTED : SERVICE_CHIP_UNSELECTED,
-              title: i === 0 ? "Default serving tier" : "Also available on this tier",
-              children: t.servedVia
-            },
-            t.offeringId
-          )) })
-        ] }),
-        model.multilingual && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex items-center gap-1 text-foreground/80", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(LanguagesIcon, { className: "h-3.5 w-3.5" }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: "Multilingual" })
-        ] }),
-        model.features.raw.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dt", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: "All capability flags" }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("dd", { className: "font-mono text-[10px] leading-relaxed text-muted-foreground/80", children: model.features.raw.join(", ") })
-        ] })
-      ] }),
-      includeAdminSection && variant === "admin" && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "mt-3 rounded-md border border-border", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AdminOfferingsSection, { model }) })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "shrink-0 border-t border-border p-3", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      "button",
-      {
-        type: "button",
-        onClick: onSelect,
-        className: "w-full rounded-md bg-primary py-1.5 text-xs font-medium text-primary-foreground transition-colors hover:bg-primary/90",
-        children: "Select model"
-      }
-    ) })
-  ] });
-}
-var HOVER_DELAY_MS = 400;
-function DelayedHint({
-  label,
-  children
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_design_system.Tooltip, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system.TooltipTrigger, { asChild: true, children }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system.TooltipContent, { side: "top", sideOffset: 6, className: "max-w-64 text-xs", children: label })
-  ] });
-}
-function ChipRow({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex flex-nowrap gap-1 overflow-x-auto pb-0.5", children });
-}
-function ChipToggle({
-  active,
-  onClick,
-  children,
-  className
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    "button",
-    {
-      type: "button",
-      onClick,
-      className: (0, import_design_system.cn)(
-        "inline-flex shrink-0 items-center rounded-md border px-2 py-0.5 text-[11px] transition-colors",
-        active ? "border-primary bg-primary/10 text-foreground" : "border-border text-muted-foreground hover:text-foreground",
-        className
-      ),
-      children
-    }
-  );
-}
-function MakerFilterButton({
-  maker,
-  active,
-  onClick
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-    "button",
-    {
-      type: "button",
-      "aria-pressed": active,
-      "aria-label": `Filter by ${maker}`,
-      onClick,
-      className: (0, import_design_system.cn)(
-        "flex min-w-0 items-center gap-1.5 rounded-md border px-1.5 py-1 text-left transition-colors",
-        active ? "border-primary bg-primary/10 text-foreground" : "border-border text-muted-foreground hover:text-foreground"
-      ),
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_brand_glyphs.MakerBrandGlyph, { maker, colored: true, className: "h-4 w-4 shrink-0" }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DelayedHint, { label: maker, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "min-w-0 truncate text-[11px] font-medium leading-tight", children: maker }) })
-      ]
-    }
-  );
-}
-function ServiceFilterButton({
-  service,
-  active,
-  onClick
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-    "button",
-    {
-      type: "button",
-      "aria-pressed": active,
-      "aria-label": `Filter by ${service}`,
-      onClick,
-      className: (0, import_design_system.cn)(
-        "flex min-w-0 items-center gap-1.5 rounded-md border px-1.5 py-1 text-left transition-colors",
-        active ? "border-primary bg-primary/10 text-foreground" : "border-border text-muted-foreground hover:text-foreground"
-      ),
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_brand_glyphs.ServiceBrandGlyph, { service, className: "h-4 w-4 shrink-0" }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DelayedHint, { label: service, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "min-w-0 truncate text-[11px] font-medium leading-tight", children: service }) })
-      ]
-    }
-  );
-}
-function TriStateChips({
-  value,
-  onChange,
-  yesLabel,
-  noLabel
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex flex-wrap gap-1", children: [
-    ["any", "Any"],
-    ["yes", yesLabel],
-    ["no", noLabel]
-  ].map(([key, label]) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    ChipToggle,
-    {
-      active: value === key,
-      onClick: () => onChange(key),
-      children: label
-    },
-    key
-  )) });
-}
-function FilterSection({
-  label,
-  children
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "mb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: label }),
-    children
-  ] });
-}
-function FiltersPanel({
-  filters,
-  setFilters,
-  variant,
-  makerOptions,
-  serviceOptions,
-  vendorOptions,
-  apiOptions
-}) {
-  const toggleModality = (kind, m) => setFilters((f) => {
-    const next = new Set(f[kind]);
-    if (next.has(m)) next.delete(m);
-    else next.add(m);
-    return { ...f, [kind]: next };
-  });
-  const toggleFeature = (b) => setFilters((f) => {
-    const next = new Set(f.features);
-    if (next.has(b)) next.delete(b);
-    else next.add(b);
-    return { ...f, features: next };
-  });
-  const toggleSetValue = (kind, value) => setFilters((f) => {
-    const next = new Set(f[kind]);
-    if (next.has(value)) next.delete(value);
-    else next.add(value);
-    return { ...f, [kind]: next };
-  });
-  const sortOptions = [
-    { key: "name", label: "Name" },
-    { key: "maker", label: "Maker" },
-    { key: "service", label: SERVICE_LABEL },
-    { key: "context", label: "Context window" },
-    { key: "price", label: variant === "admin" ? "Price ($/M out)" : "Cost" },
-    ...variant === "admin" ? [
-      { key: "vendor", label: "Vendor" },
-      { key: "api", label: "API" },
-      { key: "deprecated", label: "Deprecated" },
-      { key: "availability", label: "Availability" },
-      { key: "premium", label: "Premium" }
-    ] : []
-  ];
-  const setChip = (kind) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex flex-wrap gap-1", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      ChipToggle,
-      {
-        active: filters[kind].size === 0,
-        onClick: () => setFilters((f) => ({ ...f, [kind]: /* @__PURE__ */ new Set() })),
-        children: "Any"
-      }
-    ),
-    (kind === "makers" ? makerOptions : kind === "services" ? serviceOptions : kind === "vendors" ? vendorOptions : apiOptions).map((v) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      ChipToggle,
-      {
-        active: filters[kind].has(v),
-        onClick: () => toggleSetValue(kind, v),
-        children: v
-      },
-      v
-    ))
-  ] });
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex h-full flex-col text-xs", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "min-h-0 flex-1 space-y-3 overflow-y-auto p-3 pb-4", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FilterSection, { label: "Sort by", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ChipRow, { children: sortOptions.map((o) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-        ChipToggle,
-        {
-          active: filters.sort === o.key,
-          onClick: () => setFilters((f) => ({ ...f, sort: o.key })),
-          children: o.label
-        },
-        o.key
-      )) }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FilterSection, { label: "Input", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(ChipRow, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          ChipToggle,
-          {
-            active: filters.input.size === 0,
-            onClick: () => setFilters((f) => ({ ...f, input: /* @__PURE__ */ new Set() })),
-            children: "Any"
-          }
-        ),
-        INPUT_MODALITIES.map((m) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          ChipToggle,
-          {
-            active: filters.input.has(m),
-            onClick: () => toggleModality("input", m),
-            children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "capitalize", children: m })
-          },
-          m
-        ))
-      ] }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FilterSection, { label: "Output", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(ChipRow, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          ChipToggle,
-          {
-            active: filters.output.size === 0,
-            onClick: () => setFilters((f) => ({ ...f, output: /* @__PURE__ */ new Set() })),
-            children: "Any"
-          }
-        ),
-        OUTPUT_MODALITIES.map((m) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          ChipToggle,
-          {
-            active: filters.output.has(m),
-            onClick: () => toggleModality("output", m),
-            children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "capitalize", children: m })
-          },
-          m
-        ))
-      ] }) }),
-      variant === "admin" && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FilterSection, { label: "Deprecated", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          TriStateChips,
-          {
-            value: filters.deprecated,
-            onChange: (v) => setFilters((f) => ({ ...f, deprecated: v })),
-            yesLabel: "Deprecated only",
-            noLabel: "Active only"
-          }
-        ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FilterSection, { label: "Availability", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          TriStateChips,
-          {
-            value: filters.availability,
-            onChange: (v) => setFilters((f) => ({ ...f, availability: v })),
-            yesLabel: "Available",
-            noLabel: "Unavailable"
-          }
-        ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FilterSection, { label: "Premium", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          TriStateChips,
-          {
-            value: filters.premium,
-            onChange: (v) => setFilters((f) => ({ ...f, premium: v })),
-            yesLabel: "Premium only",
-            noLabel: "Standard only"
-          }
-        ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FilterSection, { label: "Vendor", children: setChip("vendors") }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FilterSection, { label: "API", children: setChip("apis") })
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FilterSection, { label: "Maker", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "grid grid-cols-3 gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          ChipToggle,
-          {
-            active: filters.makers.size === 0,
-            onClick: () => setFilters((f) => ({ ...f, makers: /* @__PURE__ */ new Set() })),
-            className: "justify-center py-1",
-            children: "Any"
-          }
-        ),
-        makerOptions.map((maker) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          MakerFilterButton,
-          {
-            maker,
-            active: filters.makers.has(maker),
-            onClick: () => toggleSetValue("makers", maker)
-          },
-          maker
-        ))
-      ] }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FilterSection, { label: SERVICE_LABEL, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "grid grid-cols-3 gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          ChipToggle,
-          {
-            active: filters.services.size === 0,
-            onClick: () => setFilters((f) => ({ ...f, services: /* @__PURE__ */ new Set() })),
-            className: "justify-center py-1",
-            children: "Any"
-          }
-        ),
-        serviceOptions.map((service) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          ServiceFilterButton,
-          {
-            service,
-            active: filters.services.has(service),
-            onClick: () => toggleSetValue("services", service)
-          },
-          service
-        ))
-      ] }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FilterSection, { label: "Features", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex flex-wrap gap-1", children: FEATURE_BUCKET_ORDER.map((b) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-        ChipToggle,
-        {
-          active: filters.features.has(b),
-          onClick: () => toggleFeature(b),
-          children: FEATURE_BUCKETS[b].label
-        },
-        b
-      )) }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FilterSection, { label: "Interaction", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex flex-wrap gap-1", children: ["any", "turn", "single", "extraction", "realtime"].map(
-        (i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          ChipToggle,
-          {
-            active: filters.interaction === i,
-            onClick: () => setFilters((f) => ({ ...f, interaction: i })),
-            children: i === "any" ? "Any" : INTERACTION_LABEL[i]
-          },
-          i
-        )
-      ) }) })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "z-10 flex shrink-0 flex-nowrap items-center gap-1 border-t border-border bg-popover px-3 py-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-        ChipToggle,
-        {
-          active: filters.multilingualOnly,
-          onClick: () => setFilters((f) => ({ ...f, multilingualOnly: !f.multilingualOnly })),
-          className: "flex-1 justify-center",
-          children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "inline-flex items-center gap-1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(LanguagesIcon, { className: "h-3 w-3" }),
-            " Multilingual"
-          ] })
-        }
-      ),
-      variant === "user" && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-        ChipToggle,
-        {
-          active: filters.includeDeprecated,
-          onClick: () => setFilters((f) => ({
-            ...f,
-            includeDeprecated: !f.includeDeprecated
-          })),
-          className: "flex-1 justify-center",
-          children: "Include deprecated"
-        }
-      )
-    ] })
-  ] });
-}
-function ModelRow({
-  model,
-  classTier,
-  tier,
-  variant,
-  selected,
-  isFavorite,
-  locked = false,
-  onSelect,
-  onHover,
-  onToggleFavorite
-}) {
-  const unavailable = variant === "admin" && !(model.admin?.offerings ?? []).some((o) => o.isAvailable);
-  const retired = model.retiredAt != null;
-  const retiredTitle = retired ? `Retired ${model.retiredAt?.slice(0, 10)} \u2014 the provider no longer serves this model, so it cannot be selected.` : locked ? TOP_TIER_LOCKED_TITLE : void 0;
-  const blocked = retired || locked;
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-    "div",
-    {
-      role: "button",
-      tabIndex: 0,
-      "aria-disabled": blocked || void 0,
-      title: retiredTitle,
-      onClick: blocked ? void 0 : onSelect,
-      onKeyDown: (e) => {
-        if (blocked) return;
-        if (e.key === "Enter" || e.key === " ") {
-          e.preventDefault();
-          onSelect();
-        }
-      },
-      onMouseEnter: onHover,
-      className: (0, import_design_system.cn)(
-        "grid w-full grid-cols-[16px_20px_minmax(0,1fr)_2.75rem_3rem_2.75rem] items-center gap-2 rounded px-2 py-1 transition-colors",
-        blocked ? "cursor-not-allowed opacity-60" : "cursor-pointer hover:bg-muted/60 focus:bg-muted/60 focus:outline-none",
-        selected && "bg-muted"
-      ),
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          "button",
-          {
-            type: "button",
-            onClick: (e) => {
-              e.stopPropagation();
-              onToggleFavorite();
-            },
-            title: isFavorite ? "Remove favorite" : "Add favorite",
-            "aria-label": isFavorite ? "Remove favorite" : "Add favorite",
-            className: (0, import_design_system.cn)(
-              "flex h-4 w-4 items-center justify-center rounded transition-colors",
-              isFavorite ? "text-amber-400" : "text-muted-foreground/30 hover:text-muted-foreground"
-            ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_icons3.StarIcon, { className: (0, import_design_system.cn)("h-3 w-3", isFavorite && "fill-amber-400") })
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          "span",
-          {
-            className: "flex w-5 justify-center",
-            title: model.maker ?? void 0,
-            children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_brand_glyphs.MakerBrandGlyph, { maker: model.maker, colored: true, className: "h-3.5 w-3.5" })
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "flex min-w-0 items-center gap-1.5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DelayedHint, { label: model.name, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "truncate text-xs font-medium text-foreground", children: model.name }) }),
-          isDecisionModelCapability(model) && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-            "span",
-            {
-              className: "shrink-0 rounded border border-primary/40 bg-primary/10 px-1 text-[9px] font-medium text-foreground/80",
-              title: "Decision model \u2014 it answers a Questions part with probabilities and generates no text.",
-              children: "decision"
-            }
-          ),
-          model.isDeprecated && !retired && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-            "span",
-            {
-              className: "shrink-0 rounded bg-destructive/15 px-1 text-[9px] text-destructive-ink",
-              title: "Deprecated \u2014 still runs; hidden from default selection",
-              children: "dep"
-            }
-          ),
-          retired && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-            "span",
-            {
-              className: "shrink-0 rounded bg-destructive/15 px-1 text-[9px] text-destructive-ink",
-              title: retiredTitle,
-              children: "retired"
-            }
-          ),
-          unavailable && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-            "span",
-            {
-              className: "shrink-0 rounded bg-destructive/15 px-1 text-[9px] text-destructive-ink",
-              title: "No available offerings \u2014 not callable",
-              children: "off"
-            }
-          ),
-          classTier ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-            "span",
-            {
-              className: "shrink-0 rounded border border-primary/40 bg-primary/10 px-1 text-[9px] font-medium text-foreground/80",
-              title: `Runs on ${classTier.servedVia}`,
-              children: classTier.servedVia
-            }
-          ) : model.tiers.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-            "span",
-            {
-              className: "shrink-0 rounded border border-primary/40 bg-primary/10 px-1 text-[9px] font-medium text-foreground/80",
-              title: model.tiers.map((t) => t.servedVia).join(" \xB7 "),
-              children: serviceCountLabel(model.tiers.length)
-            }
-          )
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SpeedCell, { value: model.speedRating }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          DelayedHint,
-          {
-            label: model.contextWindow == null ? "No context window listed" : `Context window ${(0, import_format.formatCount)(model.contextWindow)} tokens`,
-            children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "block w-12 whitespace-nowrap text-right font-mono text-[11px] tabular-nums text-foreground/80", children: model.contextWindow == null ? "\u2014" : fmtPointsCompact(model.contextWindow) })
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          DelayedHint,
-          {
-            label: tier == null ? "No relative cost rating yet" : `Relative cost ${tier.replace("+", "")}${tier.endsWith("+") ? "+" : ""} \u2014 more $ is more expensive`,
-            children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "block w-[2.75rem] text-right", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CostTier, { tier }) })
-          }
-        )
-      ]
-    }
-  );
+  "generate_audio",
+  "image",
+  "image_format",
+  "image_input",
+  "image_inputs",
+  "image_size",
+  "image_url",
+  "include_rai_reason",
+  "input_fidelity",
+  "input_images",
+  "last_frame",
+  "last_frame_image",
+  "mask",
+  "media",
+  "moderation",
+  "num_outputs",
+  "number_of_images",
+  "output_compression",
+  "output_mime_type",
+  "output_quality",
+  "partial_images",
+  "person_generation",
+  "prompt_image",
+  "quality",
+  "ratio",
+  "reference_strength",
+  "render_quality",
+  "resolution",
+  "seconds",
+  "start_image",
+  "start_image_url",
+  "style",
+  "video_action",
+  "video_input",
+  "multi_speaker",
+  // Legacy DB keys — normalizer converts at Redux boundary, but we still recognize them
+  "max_tokens",
+  "output_format",
+  "n",
+  // Frontend-only capability flags (never sent to the API)
+  "tools",
+  "file_urls",
+  "image_urls",
+  "youtube_videos",
+  "multi_speaker",
+  "internal_web_search",
+  "internal_url_context",
+  // Backend param not yet in generated types
+  "image_loras",
+  // Stop sequences
+  "stop_sequences"
+]);
+var UI_ONLY_SET = new Set(UI_GATE_KEYS);
+function mergeEffectiveSettings(defaults, overrides) {
+  const merged = { ...defaults };
+  for (const [key, value] of Object.entries(overrides)) {
+    if (value === null) delete merged[key];
+    else if (value !== void 0) merged[key] = value;
+  }
+  return merged;
 }
-function LocalModelRow({ model, selected, onSelect }) {
-  const dim = model.needsMoreMemory === true;
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-    "div",
-    {
-      role: "button",
-      tabIndex: 0,
-      "data-local-model": model.id,
-      title: dim ? "Needs more memory than this computer has free" : void 0,
-      onClick: onSelect,
-      onKeyDown: (e) => {
-        if (e.key === "Enter" || e.key === " ") {
-          e.preventDefault();
-          onSelect();
-        }
-      },
-      className: (0, import_design_system.cn)(
-        "grid w-full cursor-pointer grid-cols-[16px_20px_minmax(0,1fr)_2.75rem_3rem_2.75rem] items-center gap-2 rounded px-2 py-1 transition-colors hover:bg-muted/60 focus:bg-muted/60 focus:outline-none",
-        dim && "opacity-60",
-        selected && "bg-muted"
-      ),
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "w-4" }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "flex w-5 justify-center", title: model.maker ?? void 0, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_brand_glyphs.MakerBrandGlyph, { maker: model.maker ?? null, colored: true, className: "h-3.5 w-3.5" }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "flex min-w-0 items-center gap-1.5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "truncate text-xs font-medium text-foreground", children: model.name }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-            "span",
-            {
-              className: "shrink-0 rounded border border-primary/40 bg-primary/10 px-1 text-[9px] font-medium text-foreground/80",
-              title: "Runs on this computer",
-              children: "local"
-            }
-          ),
-          dim && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "shrink-0 rounded bg-muted px-1 text-[9px] text-muted-foreground", title: "Needs more memory than this computer has free", children: "needs memory" })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "w-11" }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "block w-12 whitespace-nowrap text-right font-mono text-[11px] tabular-nums text-foreground/80", children: model.contextWindow == null ? "\u2014" : fmtPointsCompact(model.contextWindow) }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "w-[2.75rem]" })
-      ]
-    }
-  );
+
+// settings/store.ts
+var EMPTY = Object.freeze({});
+function readSettingsEntry(state, agentId) {
+  return agentId ? state.entries[agentId] : void 0;
 }
-var GROUP_HEADING = "px-2 pb-0.5 pt-1.5 text-[10px] uppercase tracking-wide text-muted-foreground";
-function ModelListDropdown({
-  value: savedValue,
-  localModels: localModelsProp,
-  onValueChange,
-  inputModalities,
-  outputModalities,
-  selectionPurpose,
-  allowedModelIds,
-  catalogVariant,
-  emptyOptionLabel,
-  onClear,
-  placeholder = "Select a model\u2026",
-  priorityModelIds,
-  pinnedOfferingId,
-  onOfferingPinChange,
-  modelOnly,
-  className,
-  triggerVariant = "default",
-  presentation = "picker",
-  id,
-  disabled = false,
-  disabledTitle,
-  "aria-label": ariaLabel,
-  "aria-labelledby": ariaLabelledBy
-}) {
-  const isMobile = (0, import_design_system.useIsMobile)();
-  const dialogContainer = (0, import_design_system.useDialogContainer)();
-  const [pickerOpen, setOpen] = (0, import_react2.useState)(false);
-  const inline = presentation === "inline";
-  const open = inline || pickerOpen;
-  const { favoriteSet, toggleFavorite } = useModelFavorites(open);
-  const ports = useModelCatalogUiPorts();
-  const canUseTopTier = ports.canUseTopTier ?? false;
-  const isSuperAdmin = ports.isSuperAdmin ?? false;
-  const LinkComponent = ports.LinkComponent;
-  const hiddenModelIds = ports.hiddenModelIds;
-  const [adminMode, setAdminMode] = (0, import_react2.useState)(false);
-  const variant = catalogVariant ?? (adminMode && isSuperAdmin ? "admin" : "user");
-  const effectiveSelectionPurpose = selectionPurpose ?? (variant === "admin" ? "admin" : "chat");
-  const { models, isLoading, error } = useModelCatalog(variant);
-  const successionIndex = (0, import_react2.useMemo)(() => buildSuccessionIndex(models), [models]);
-  const value = savedValue ? resolveSuccessor(savedValue, successionIndex) : savedValue;
-  const healedFrom = (0, import_react2.useRef)(null);
-  (0, import_react2.useEffect)(() => {
-    if (!savedValue || !value || value === savedValue || healedFrom.current === savedValue) return;
-    healedFrom.current = savedValue;
-    if (onOfferingPinChange && pinnedOfferingId) onOfferingPinChange(void 0);
-    onValueChange(value);
-  }, [savedValue, value, onOfferingPinChange, pinnedOfferingId, onValueChange]);
-  const [query, setQuery] = (0, import_react2.useState)("");
-  const [tab, setTab] = (0, import_react2.useState)("all");
-  const [rightPanel, setRightPanel] = (0, import_react2.useState)(null);
-  const [hovered, setHovered] = (0, import_react2.useState)(null);
-  const [hoveredClass, setHoveredClass] = (0, import_react2.useState)(null);
-  const [mobileDetail, setMobileDetail] = (0, import_react2.useState)(null);
-  const [mobileDetailClass, setMobileDetailClass] = (0, import_react2.useState)(null);
-  const [mobileFilters, setMobileFilters] = (0, import_react2.useState)(false);
-  const inputRef = (0, import_react2.useRef)(null);
-  const [filters, setFilters] = (0, import_react2.useState)(() => ({
-    input: new Set(inputModalities),
-    output: new Set(outputModalities ?? []),
-    features: /* @__PURE__ */ new Set(),
-    makers: /* @__PURE__ */ new Set(),
-    services: /* @__PURE__ */ new Set(),
-    interaction: "any",
-    multilingualOnly: false,
-    sort: "name",
-    vendors: /* @__PURE__ */ new Set(),
-    apis: /* @__PURE__ */ new Set(),
-    includeDeprecated: false,
-    deprecated: "any",
-    availability: "any",
-    premium: "any"
-  }));
-  const setVariantMode = (nextAdmin) => {
-    setAdminMode(nextAdmin);
-    setHovered(null);
-    if (!nextAdmin) {
-      setFilters((f) => ({
-        ...f,
-        vendors: /* @__PURE__ */ new Set(),
-        apis: /* @__PURE__ */ new Set(),
-        deprecated: "any",
-        availability: "any",
-        premium: "any",
-        sort: ADMIN_ONLY_SORTS.has(f.sort) ? "name" : f.sort
-      }));
-    }
-  };
-  const allowedModelSet = allowedModelIds ? new Set(allowedModelIds) : null;
-  const priorityModelSet = priorityModelIds ? new Set(priorityModelIds) : null;
-  const eligibleModels = allowedModelSet ? models.filter((model) => allowedModelSet.has(model.id)) : models;
-  const selected = models.find((m) => m.id === value) ?? null;
-  const { models: localAll, groupLabel: localGroupLabel, open: openLocal } = useLocalModels(localModelsProp);
-  const selectedLocal = localAll.find((m) => m.id === value) ?? null;
-  const localEligible = !modelOnly && variant === "user" && !allowedModelSet && (effectiveSelectionPurpose === "chat" || effectiveSelectionPurpose === "agent");
-  const localRows = (0, import_react2.useMemo)(() => {
-    if (!localEligible || tab !== "all") return [];
-    const q = query.trim().toLowerCase();
-    return q ? localAll.filter((m) => [m.name, m.maker, "local"].some((f) => f?.toLowerCase().includes(q))) : localAll;
-  }, [localEligible, tab, query, localAll]);
-  const shown = selected ?? (selectedLocal ? { name: selectedLocal.name, maker: selectedLocal.maker ?? null } : null);
-  const makerOptions = (0, import_react2.useMemo)(
-    () => [
-      ...new Set(
-        eligibleModels.map((m) => m.maker).filter((v) => !!v)
-      )
-    ].sort((a, b) => a.localeCompare(b)),
-    [eligibleModels]
-  );
-  const serviceOptions = (0, import_react2.useMemo)(
-    () => [
-      ...new Set(
-        eligibleModels.flatMap((m) => m.tiers.map((t) => t.servedVia)).filter(Boolean)
-      )
-    ].sort((a, b) => a.localeCompare(b)),
-    [eligibleModels]
-  );
-  const vendorOptions = (0, import_react2.useMemo)(
-    () => [
-      ...new Set(
-        eligibleModels.flatMap((m) => (m.admin?.offerings ?? []).map((o) => o.vendor)).filter((v) => !!v)
-      )
-    ].sort((a, b) => a.localeCompare(b)),
-    [eligibleModels]
-  );
-  const apiOptions = (0, import_react2.useMemo)(
-    () => [
-      ...new Set(
-        eligibleModels.flatMap((m) => (m.admin?.offerings ?? []).map((o) => o.apiName)).filter((v) => !!v)
-      )
-    ].sort((a, b) => a.localeCompare(b)),
-    [eligibleModels]
-  );
-  const chatFitApplies = effectiveSelectionPurpose === "chat" && !(outputModalities ?? []).some((o) => o !== "text");
-  const filtered = (0, import_react2.useMemo)(() => {
-    const q = query.trim().toLowerCase();
-    const hasAvailable = (m) => (m.admin?.offerings ?? []).some((o) => o.isAvailable);
-    const rows = eligibleModels.filter((m) => {
-      const isDecision = isDecisionModelCapability(m);
-      if (effectiveSelectionPurpose === "chat" && isDecision) return false;
-      if (effectiveSelectionPurpose === "decision" && !isDecision) return false;
-      if (effectiveSelectionPurpose !== "admin" && !acceptsTextInstructions(m))
-        return false;
-      if (effectiveSelectionPurpose === "chat" && isManagedAgentModelCapability(m))
-        return false;
-      if (chatFitApplies && !isChatModelCapability(m)) return false;
-      if (tab === "favorites" && !favoriteSet.has(m.id)) return false;
-      const haystack = [
-        m.name,
-        m.maker,
-        ...m.tiers.map((t) => t.servedVia),
-        ...variant === "admin" ? (m.admin?.offerings ?? []).flatMap((o) => [
-          o.vendor,
-          o.apiName,
-          o.providerModelId
-        ]) : []
-      ];
-      if (q && !haystack.some((f) => f?.toLowerCase().includes(q)))
-        return false;
-      if (filters.makers.size > 0 && (!m.maker || !filters.makers.has(m.maker)))
-        return false;
-      if (filters.services.size > 0 && !m.tiers.some((t) => filters.services.has(t.servedVia)))
-        return false;
-      if (filters.vendors.size > 0 && !(m.admin?.offerings ?? []).some(
-        (o) => o.vendor != null && filters.vendors.has(o.vendor)
-      ))
-        return false;
-      if (filters.apis.size > 0 && !(m.admin?.offerings ?? []).some(
-        (o) => o.apiName != null && filters.apis.has(o.apiName)
-      ))
-        return false;
-      if (variant === "user" && m.id !== value && hiddenModelIds?.includes(m.id))
-        return false;
-      if (variant === "user" && !filters.includeDeprecated && m.isDeprecated && m.id !== value)
-        return false;
-      if (variant === "user" && resolveSuccessor(m.id, successionIndex) !== m.id) return false;
-      if (filters.deprecated !== "any") {
-        if (filters.deprecated === "yes" !== m.isDeprecated) return false;
-      }
-      if (filters.availability !== "any") {
-        if (filters.availability === "yes" !== hasAvailable(m)) return false;
-      }
-      if (filters.premium !== "any") {
-        if (filters.premium === "yes" !== m.isPremium) return false;
-      }
-      for (const m2 of filters.input) if (!takesInput(m, m2)) return false;
-      const outputSatisfied = (want) => m.output.includes(want) || effectiveSelectionPurpose === "agent" && isDecision && want === "text";
-      for (const m2 of filters.output) if (!outputSatisfied(m2)) return false;
-      for (const b of filters.features)
-        if (!m.features.buckets.includes(b)) return false;
-      if (filters.interaction !== "any" && m.interaction !== filters.interaction)
-        return false;
-      if (filters.multilingualOnly && !m.multilingual) return false;
-      return true;
-    });
-    const cmp = (a, b) => {
-      switch (filters.sort) {
-        case "maker":
-          return (a.maker ?? "").localeCompare(b.maker ?? "");
-        case "service":
-          return (a.tiers[0]?.servedVia ?? "\uFFFF").localeCompare(
-            b.tiers[0]?.servedVia ?? "\uFFFF"
-          ) || b.tiers.length - a.tiers.length;
-        case "context":
-          return (b.contextWindow ?? 0) - (a.contextWindow ?? 0);
-        case "price": {
-          const price = (m) => (variant === "admin" ? m.outputCost : m.costRating) ?? Infinity;
-          return price(a) - price(b) || a.name.localeCompare(b.name);
-        }
-        case "vendor":
-          return (a.admin?.offerings[0]?.vendor ?? "\uFFFF").localeCompare(
-            b.admin?.offerings[0]?.vendor ?? "\uFFFF"
-          ) || a.name.localeCompare(b.name);
-        case "api":
-          return (a.admin?.offerings[0]?.apiName ?? "\uFFFF").localeCompare(
-            b.admin?.offerings[0]?.apiName ?? "\uFFFF"
-          ) || a.name.localeCompare(b.name);
-        case "deprecated":
-          return Number(a.isDeprecated) - Number(b.isDeprecated) || a.name.localeCompare(b.name);
-        case "availability": {
-          const avail = (m) => (m.admin?.offerings ?? []).filter((o) => o.isAvailable).length;
-          return avail(b) - avail(a) || a.name.localeCompare(b.name);
-        }
-        case "premium":
-          return Number(b.isPremium) - Number(a.isPremium) || a.name.localeCompare(b.name);
-        default:
-          return a.name.localeCompare(b.name);
-      }
-    };
-    const sorted = [...rows].sort(cmp);
-    const prioritize = (items) => {
-      if (!priorityModelSet || priorityModelSet.size === 0) return items;
-      const priority = items.filter((m) => priorityModelSet.has(m.id));
-      const rest = items.filter((m) => !priorityModelSet.has(m.id));
-      return [...priority, ...rest];
-    };
-    if (tab === "all") {
-      const favs = sorted.filter((m) => favoriteSet.has(m.id));
-      const rest = sorted.filter((m) => !favoriteSet.has(m.id));
-      return [...prioritize(favs), ...prioritize(rest)];
-    }
-    return prioritize(sorted);
-  }, [
-    eligibleModels,
-    query,
-    filters,
-    tab,
-    favoriteSet,
-    variant,
-    priorityModelSet,
-    effectiveSelectionPurpose,
-    chatFitApplies,
-    hiddenModelIds,
-    value,
-    successionIndex
-  ]);
-  const listRows = (0, import_react2.useMemo)(
-    () => filtered.flatMap((m) => {
-      if (modelOnly || m.tiers.length < 2) {
-        return [{ model: m, classTier: null }];
-      }
-      const classes = filters.services.size > 0 ? m.tiers.filter((t) => filters.services.has(t.servedVia)) : m.tiers;
-      return classes.map((t) => ({ model: m, classTier: t }));
-    }),
-    [filtered, modelOnly, filters.services]
-  );
-  const selectedClass = selected ? selected.tiers.find((t) => t.offeringId === pinnedOfferingId) ?? selected.tiers[0] ?? null : null;
-  const selectedClassLabel = !modelOnly && selected && selected.tiers.length > 1 ? selectedClass?.servedVia : void 0;
-  const activeFilterCount = filters.input.size + filters.output.size + filters.features.size + filters.makers.size + filters.services.size + filters.vendors.size + filters.apis.size + (filters.deprecated !== "any" ? 1 : 0) + (filters.availability !== "any" ? 1 : 0) + (filters.premium !== "any" ? 1 : 0) + (filters.interaction !== "any" ? 1 : 0) + (filters.multilingualOnly ? 1 : 0) + (filters.includeDeprecated ? 1 : 0);
-  const handleOpen = (next) => {
-    setOpen(next);
-    if (next) {
-      setTimeout(() => inputRef.current?.focus(), 50);
-    } else {
-      setRightPanel(null);
-      setHovered(null);
-      setMobileDetail(null);
-      setMobileFilters(false);
-      setQuery("");
-    }
-  };
-  const refuseIfRetired = (id2) => {
-    const target = models.find((m) => m.id === id2);
-    if (target && !canUseTopTier && isTopTierRating(target.costRating)) {
-      console.warn(`[ModelListDropdown] Refused to select ${target.name} (${id2}): ${TOP_TIER_LOCKED_TITLE}.`);
-      return true;
-    }
-    if (!target?.retiredAt) return false;
-    console.warn(
-      `[ModelListDropdown] Refused to select ${target.name} (${id2}): retired ${target.retiredAt} \u2014 the provider no longer serves it.`
-    );
-    return true;
-  };
-  const handleSelectClass = (model, classTier) => {
-    if (refuseIfRetired(model.id)) return;
-    if (onOfferingPinChange) {
-      const nextPin = classTier && model.tiers.length > 1 ? classTier.offeringId : void 0;
-      if (nextPin !== (pinnedOfferingId ?? void 0)) onOfferingPinChange(nextPin);
-    }
-    onValueChange(model.id);
-    handleOpen(false);
-  };
-  const handleSelect = (id2, tappedClass) => {
-    const next = models.find((m) => m.id === id2);
-    if (!next) return;
-    const pinnedHere = next.tiers.find((t) => t.offeringId === pinnedOfferingId) ?? null;
-    handleSelectClass(next, tappedClass ?? pinnedHere ?? next.tiers[0] ?? null);
-  };
-  const handleSelectLocal = (local) => {
-    if (openLocal) {
-      openLocal(local.id);
-      handleOpen(false);
-      return;
-    }
-    if (onOfferingPinChange && pinnedOfferingId) onOfferingPinChange(void 0);
-    onValueChange(local.id);
-    handleOpen(false);
-  };
-  const handleClear = () => {
-    onClear?.();
-    handleOpen(false);
-  };
-  const handlePinOffering = (model, offeringId) => {
-    if (!onOfferingPinChange) return;
-    if (refuseIfRetired(model.id)) return;
-    onOfferingPinChange(offeringId);
-    if (model.id !== value) onValueChange(model.id);
-  };
-  const trigger = /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-    "button",
-    {
-      type: "button",
-      id,
-      disabled,
-      title: disabled ? disabledTitle : void 0,
-      "aria-label": ariaLabel,
-      "aria-labelledby": ariaLabelledBy,
-      "aria-disabled": disabled || void 0,
-      className: (0, import_design_system.cn)(
-        triggerVariant === "settings" ? (0, import_design_system.selectTriggerVariants)({
-          size: "default",
-          className: "h-auto min-h-9 max-lg:min-h-11 pointer-coarse:min-h-11 w-full min-w-0 max-w-full whitespace-normal text-left font-medium text-foreground"
-        }) : "inline-flex h-7 min-w-0 max-w-full items-center gap-1 overflow-hidden rounded-md bg-transparent px-1 text-xs font-medium text-foreground/80 transition-colors hover:text-foreground",
-        disabled && "cursor-not-allowed opacity-50 hover:text-foreground/80",
-        className
-      ),
-      children: [
-        triggerVariant === "settings" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex min-w-0 flex-1 items-center gap-1.5", children: shown ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-            import_brand_glyphs.MakerBrandGlyph,
-            {
-              maker: shown.maker,
-              colored: true,
-              className: "h-3.5 w-3.5 shrink-0"
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "min-w-0 whitespace-normal text-left leading-tight", children: [
-            shown.name,
-            selectedClassLabel && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "text-muted-foreground", children: [
-              " \xB7 ",
-              selectedClassLabel
-            ] })
-          ] })
-        ] }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "min-w-0 whitespace-normal text-left leading-tight text-muted-foreground", children: isLoading ? "Loading models\u2026" : emptyOptionLabel && !value ? emptyOptionLabel : placeholder }) }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "flex min-w-0 flex-1 items-center gap-1.5", children: shown ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-            import_brand_glyphs.MakerBrandGlyph,
-            {
-              maker: shown.maker,
-              colored: true,
-              className: "h-3.5 w-3.5 shrink-0"
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "min-w-0 truncate", children: [
-            shown.name,
-            selectedClassLabel && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "text-muted-foreground", children: [
-              " \xB7 ",
-              selectedClassLabel
-            ] })
-          ] })
-        ] }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "min-w-0 truncate text-muted-foreground", children: isLoading ? "Loading models\u2026" : emptyOptionLabel && !value ? emptyOptionLabel : placeholder }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          import_icons3.ChevronDownIcon,
-          {
-            className: (0, import_design_system.cn)(
-              "shrink-0 text-muted-foreground/60",
-              triggerVariant === "settings" ? "h-4 w-4" : "h-3 w-3"
-            )
-          }
-        )
-      ]
-    }
-  );
-  const listPanel = /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex h-full flex-col", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex items-center gap-1.5 border-b border-border p-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "relative flex-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_icons3.SearchIcon, { className: "absolute left-2 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground" }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-          import_controls.Input,
-          {
-            adornment: "start",
-            ref: inputRef,
-            value: query,
-            onChange: (e) => setQuery(e.target.value),
-            placeholder: "Search models\u2026"
-          }
-        )
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-        "button",
-        {
-          type: "button",
-          onClick: () => isMobile ? setMobileFilters(true) : setRightPanel(rightPanel === "filters" ? null : "filters"),
-          className: (0, import_design_system.cn)(
-            "inline-flex h-7 items-center gap-1 rounded-md border px-2 text-[11px] transition-colors",
-            rightPanel === "filters" ? "border-primary bg-primary/10 text-foreground" : "border-border text-muted-foreground hover:text-foreground"
-          ),
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SlidersHorizontalIcon, { className: "h-3.5 w-3.5" }),
-            "Filters",
-            activeFilterCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "text-primary", children: activeFilterCount })
-          ]
-        }
-      )
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex items-center gap-1 border-b border-border px-2 py-1", children: ["all", "favorites"].map((t) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-      "button",
-      {
-        type: "button",
-        onClick: () => setTab(t),
-        className: (0, import_design_system.cn)(
-          "inline-flex items-center gap-1 rounded px-2 py-0.5 text-[11px] transition-colors",
-          tab === t ? "bg-accent text-foreground" : "text-muted-foreground hover:text-foreground"
-        ),
-        children: [
-          t === "favorites" && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-            import_icons3.StarIcon,
-            {
-              className: (0, import_design_system.cn)(
-                "h-3 w-3",
-                tab === t && "fill-amber-400 text-amber-400"
-              )
-            }
-          ),
-          t === "all" ? "All" : "Favorites",
-          t === "favorites" && favoriteSet.size > 0 && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "text-muted-foreground", children: favoriteSet.size })
-        ]
-      },
-      t
-    )) }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "grid grid-cols-[16px_20px_minmax(0,1fr)_2.75rem_3rem_2.75rem] gap-2 border-b border-border px-2 py-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "w-4" }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "w-5", title: "Maker", "aria-label": "Maker" }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: "Name" }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "w-11 text-right", children: "Speed" }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DelayedHint, { label: "How many tokens this model can hold in one conversation", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "block w-12 text-right", title: "Context window", children: "Window" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DelayedHint, { label: "Relative cost band \u2014 more $ is more expensive. Not your personal usage.", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "block w-[2.75rem] text-right", children: "Cost" }) })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "min-h-0 flex-1 overflow-y-auto p-1", children: error ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "p-3 text-xs text-destructive", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "font-medium", children: [
-        "Failed to load ",
-        variant,
-        " catalog"
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "mt-0.5 font-mono text-[11px] opacity-80", children: error }),
-      variant === "admin" && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "mt-1 text-[11px] text-muted-foreground", children: "If this is a 42501, the admin_model_catalog RPC rejected your role (super admin required)." }),
-      ports.renderErrorAction?.(void 0)
-    ] }) : isLoading ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "p-4 text-center text-xs text-muted-foreground", children: "Loading catalog\u2026" }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-      emptyOptionLabel && onClear && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-        "button",
-        {
-          type: "button",
-          onClick: handleClear,
-          className: (0, import_design_system.cn)(
-            "mb-1 w-full rounded px-2 py-1.5 text-left text-xs transition-colors hover:bg-muted/60 focus:bg-muted/60 focus:outline-none",
-            !value ? "bg-muted font-medium text-foreground" : "text-muted-foreground"
-          ),
-          children: emptyOptionLabel
-        }
-      ),
-      localRows.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: GROUP_HEADING, children: localGroupLabel }),
-        localRows.map((l) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(LocalModelRow, { model: l, selected: l.id === value, onSelect: () => handleSelectLocal(l) }, l.id)),
-        filtered.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: GROUP_HEADING, children: "Cloud" })
-      ] }),
-      filtered.length === 0 ? localRows.length > 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "p-4 text-center text-xs text-muted-foreground", children: "No models match your filters." }) : listRows.map(({ model: m, classTier }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-        ModelRow,
-        {
-          model: m,
-          classTier,
-          tier: costRatingTier(m.costRating),
-          variant,
-          selected: m.id === value && (classTier == null || classTier.offeringId === selectedClass?.offeringId),
-          isFavorite: favoriteSet.has(m.id),
-          locked: !canUseTopTier && isTopTierRating(m.costRating),
-          onToggleFavorite: () => toggleFavorite(m.id),
-          onSelect: () => isMobile ? (setMobileDetail(m), setMobileDetailClass(classTier)) : handleSelectClass(m, classTier),
-          onHover: isMobile ? void 0 : () => {
-            setHovered(m);
-            setHoveredClass(classTier);
-            if (rightPanel !== "filters") setRightPanel("detail");
-          }
-        },
-        classTier ? `${m.id}:${classTier.offeringId}` : m.id
-      ))
-    ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex items-center justify-between gap-2 border-t border-border px-2 py-1 text-[10px] text-muted-foreground", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: error ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-        "Models couldn't be loaded",
-        ports.renderErrorAction?.(String(error))
-      ] }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-        listRows.length + localRows.length,
-        " model",
-        listRows.length + localRows.length === 1 ? "" : "s",
-        variant === "user" && (hiddenModelIds?.length ?? 0) > 0 ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-          " \xB7 ",
-          ports.settingsHref && LinkComponent ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(LinkComponent, { href: ports.settingsHref, className: "underline hover:text-foreground", children: [
-            hiddenModelIds?.length,
-            " hidden by you"
-          ] }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-            hiddenModelIds?.length,
-            " hidden by you"
-          ] })
-        ] }) : null
-      ] }) }),
-      isSuperAdmin && catalogVariant == null && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-        "button",
-        {
-          type: "button",
-          onClick: () => setVariantMode(variant !== "admin"),
-          title: variant === "admin" ? "Admin view \u2014 real vendor/api/$ data. Click to return to the user view." : "Switch to the admin view (real vendor/api/$ data)",
-          className: (0, import_design_system.cn)(
-            "inline-flex items-center gap-1 rounded px-1.5 py-0.5 transition-colors",
-            variant === "admin" ? "bg-primary/10 text-foreground" : "hover:text-foreground"
-          ),
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ShieldIcon, { className: "h-3 w-3" }),
-            "Admin"
-          ]
-        }
-      )
-    ] })
-  ] });
-  if (disabled) {
-    return trigger;
-  }
-  const mobileBody = /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex min-h-0 flex-1 flex-col overflow-hidden", children: mobileDetail ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-      "button",
-      {
-        onClick: () => setMobileDetail(null),
-        className: "flex shrink-0 items-center gap-1.5 border-b border-border px-3 py-2.5 text-sm font-medium text-primary",
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_icons3.ChevronRightIcon, { className: "h-4 w-4 rotate-180" }),
-          " Back"
-        ]
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "min-h-0 flex-1 overflow-y-auto", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      ModelDetailCard,
-      {
-        model: mobileDetail,
-        tier: costRatingTier(mobileDetail.costRating),
-        variant,
-        onSelect: () => handleSelect(mobileDetail.id, mobileDetailClass),
-        isCurrentModel: mobileDetail.id === value,
-        pinnedOfferingId,
-        onPinOffering: onOfferingPinChange ? handlePinOffering : void 0,
-        includeAdminSection: true
-      }
-    ) })
-  ] }) : mobileFilters ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-      "button",
-      {
-        onClick: () => setMobileFilters(false),
-        className: "flex shrink-0 items-center gap-1.5 border-b border-border px-3 py-2.5 text-sm font-medium text-primary",
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_icons3.ChevronRightIcon, { className: "h-4 w-4 rotate-180" }),
-          " Back"
-        ]
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "min-h-0 flex-1", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      FiltersPanel,
-      {
-        filters,
-        setFilters,
-        variant,
-        makerOptions,
-        serviceOptions,
-        vendorOptions,
-        apiOptions
-      }
-    ) })
-  ] }) : listPanel });
-  if (isMobile && inline) {
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system.TooltipProvider, { delayDuration: HOVER_DELAY_MS, skipDelayDuration: HOVER_DELAY_MS, children: mobileBody });
-  }
-  if (isMobile) {
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_design_system.Drawer, { open, onOpenChange: handleOpen, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system.DrawerTrigger, { asChild: true, children: trigger }),
-      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system.DrawerContent, { className: "h-[85dvh]", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-        import_design_system.TooltipProvider,
-        {
-          delayDuration: HOVER_DELAY_MS,
-          skipDelayDuration: HOVER_DELAY_MS,
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system.DrawerTitle, { className: "sr-only", children: "Select model" }),
-            mobileBody
-          ]
-        }
-      ) })
-    ] });
-  }
-  const popoverWidth = LIST_WIDTH + DETAIL_WIDTH + (variant === "admin" ? ADMIN_PANEL_WIDTH : 0);
-  const adminPanelModel = hovered ?? selected;
-  const desktopBody = /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    import_design_system.TooltipProvider,
-    {
-      delayDuration: HOVER_DELAY_MS,
-      skipDelayDuration: HOVER_DELAY_MS,
-      children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "h-full overflow-x-auto overflow-y-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-        "div",
-        {
-          className: "flex h-full",
-          style: inline ? void 0 : { minWidth: popoverWidth },
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-              "div",
-              {
-                className: "flex h-full min-h-0 flex-col border-r border-border",
-                style: inline ? { flex: `0 1 ${LIST_WIDTH}px`, minWidth: INLINE_LIST_MIN_WIDTH } : { width: LIST_WIDTH, flexShrink: 0 },
-                children: listPanel
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-              "div",
-              {
-                className: "flex h-full min-h-0 flex-col overflow-hidden",
-                style: inline ? { flex: "1 1 0", minWidth: INLINE_DETAIL_MIN_WIDTH } : { width: DETAIL_WIDTH, flexShrink: 0 },
-                children: rightPanel === "filters" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-                  FiltersPanel,
-                  {
-                    filters,
-                    setFilters,
-                    variant,
-                    makerOptions,
-                    serviceOptions,
-                    vendorOptions,
-                    apiOptions
-                  }
-                ) : rightPanel === "detail" && hovered ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-                  "div",
-                  {
-                    className: "h-full animate-in fade-in-0 duration-300",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-                      ModelDetailCard,
-                      {
-                        model: hovered,
-                        tier: costRatingTier(hovered.costRating),
-                        variant,
-                        onSelect: () => handleSelect(hovered.id, hoveredClass),
-                        isCurrentModel: hovered.id === value,
-                        pinnedOfferingId,
-                        onPinOffering: onOfferingPinChange ? handlePinOffering : void 0
-                      }
-                    )
-                  },
-                  hovered.id
-                ) : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex flex-1 flex-col items-center justify-center gap-2 px-6 text-center", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(MousePointerClickIcon, { className: "h-6 w-6 text-muted-foreground/40" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "text-xs leading-relaxed text-muted-foreground/70", children: "Hover a model to preview its details, or click to select." })
-                ] })
-              }
-            ),
-            variant === "admin" && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-              "div",
-              {
-                className: "flex h-full min-h-0 shrink-0 flex-col overflow-hidden border-l border-border",
-                style: { width: ADMIN_PANEL_WIDTH },
-                children: adminPanelModel ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AdminOfferingsSection, { model: adminPanelModel }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex flex-1 flex-col items-center justify-center gap-2 px-6 text-center", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ShieldIcon, { className: "h-6 w-6 text-muted-foreground/40" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "text-xs leading-relaxed text-muted-foreground/70", children: "Hover a model to see every offering's real vendor, api, provider model id and $ pricing." })
-                ] })
-              }
-            )
-          ]
-        }
-      ) })
-    }
-  );
-  if (inline) {
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "h-full w-full min-w-0", children: desktopBody });
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_design_system.Popover, { open, onOpenChange: handleOpen, modal: false, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system.PopoverTrigger, { asChild: true, children: trigger }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      import_design_system.PopoverContent,
-      {
-        align: "start",
-        sideOffset: 4,
-        collisionPadding: 12,
-        sticky: "always",
-        ...dialogContainer ? { container: dialogContainer } : {},
-        className: "overflow-hidden p-0",
-        style: {
-          // PopoverContent's 1px border is inside this border-box width.
-          // Give the fixed columns those two pixels at their natural desktop width;
-          // maxWidth still turns the inner panel into a horizontal scrollport.
-          width: popoverWidth + 2,
-          maxWidth: "calc(100vw - 24px)",
-          height: PANEL_HEIGHT,
-          // See LIST_MAX_HEIGHT — this clamp is what keeps the search row on
-          // screen at an 800px-tall window.
-          maxHeight: LIST_MAX_HEIGHT
-        },
-        children: desktopBody
-      }
-    )
-  ] });
+function readEffectiveSettings(entry) {
+  return entry ? mergeEffectiveSettings(entry.defaults, entry.overrides) : EMPTY;
 }
 
+// settings/react/ModelSettingsPanel.tsx
+var import_design_system4 = require("@ai-matrx/design-system");
+var import_controls3 = require("@ai-matrx/design-system/controls");
+var import_react2 = require("@ai-matrx/agents/models/react");
+
 // settings/settings-catalogue.ts
 var import_text_case = require("@ai-matrx/kit/text-case");
 var CONTROL_TYPES = [
@@ -2610,13 +423,13 @@ function isOffValue(value, control) {
 }
 
 // settings/react/InputCapabilitiesEditor.tsx
-var import_design_system3 = require("@ai-matrx/design-system");
-var import_controls2 = require("@ai-matrx/design-system/controls");
+var import_design_system2 = require("@ai-matrx/design-system");
+var import_controls = require("@ai-matrx/design-system/controls");
 
 // settings/react/settings-icons.tsx
-var import_jsx_runtime5 = require("react/jsx-runtime");
-function Svg3({ className, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+var import_jsx_runtime = require("react/jsx-runtime");
+function Svg({ className, children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -2632,98 +445,98 @@ function Svg3({ className, children }) {
     }
   );
 }
-var CircleCheckGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Svg3, { className, children: [
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "m16 9-5.5 5.5L8 12" })
+var CircleCheckGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Svg, { className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m16 9-5.5 5.5L8 12" })
 ] });
-var TriangleAlertGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Svg3, { className, children: [
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M12 9v4" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M12 17h.01" })
+var TriangleAlertGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Svg, { className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12 9v4" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12 17h.01" })
 ] });
-var VariableGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Svg3, { className, children: [
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M8 21s-4-3-4-9 4-9 4-9" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M16 3s4 3 4 9-4 9-4 9" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("line", { x1: "15", x2: "9", y1: "9", y2: "15" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("line", { x1: "9", x2: "15", y1: "9", y2: "15" })
+var VariableGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Svg, { className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M8 21s-4-3-4-9 4-9 4-9" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M16 3s4 3 4 9-4 9-4 9" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "15", x2: "9", y1: "9", y2: "15" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "9", x2: "15", y1: "9", y2: "15" })
 ] });
-var UnlinkGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Svg3, { className, children: [
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "m18.84 12.25 1.72-1.71h-.02a5.004 5.004 0 0 0-.12-7.07 5.006 5.006 0 0 0-6.95 0l-1.72 1.71" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "m5.17 11.75-1.71 1.71a5.004 5.004 0 0 0 .12 7.07 5.006 5.006 0 0 0 6.95 0l1.71-1.71" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("line", { x1: "8", x2: "8", y1: "2", y2: "5" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("line", { x1: "2", x2: "5", y1: "8", y2: "8" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("line", { x1: "16", x2: "16", y1: "19", y2: "22" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("line", { x1: "19", x2: "22", y1: "16", y2: "16" })
+var UnlinkGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Svg, { className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m18.84 12.25 1.72-1.71h-.02a5.004 5.004 0 0 0-.12-7.07 5.006 5.006 0 0 0-6.95 0l-1.72 1.71" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m5.17 11.75-1.71 1.71a5.004 5.004 0 0 0 .12 7.07 5.006 5.006 0 0 0 6.95 0l1.71-1.71" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "8", x2: "8", y1: "2", y2: "5" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "2", x2: "5", y1: "8", y2: "8" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "16", x2: "16", y1: "19", y2: "22" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "19", x2: "22", y1: "16", y2: "16" })
 ] });
-var WrenchGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Svg3, { className, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.106-3.105c.32-.322.863-.22.983.218a6 6 0 0 1-8.259 7.057l-7.91 7.91a1 1 0 0 1-2.999-3l7.91-7.91a6 6 0 0 1 7.057-8.259c.438.12.54.662.219.984z" }) });
-var Trash2Glyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Svg3, { className, children: [
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M10 11v6" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M14 11v6" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M3 6h18" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" })
+var WrenchGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Svg, { className, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.106-3.105c.32-.322.863-.22.983.218a6 6 0 0 1-8.259 7.057l-7.91 7.91a1 1 0 0 1-2.999-3l7.91-7.91a6 6 0 0 1 7.057-8.259c.438.12.54.662.219.984z" }) });
+var Trash2Glyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Svg, { className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M10 11v6" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M14 11v6" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M3 6h18" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" })
 ] });
-var RotateCcwGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Svg3, { className, children: [
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M3 3v5h5" })
+var RotateCcwGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Svg, { className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M3 3v5h5" })
 ] });
-var ImageGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Svg3, { className, children: [
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", ry: "2" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("circle", { cx: "9", cy: "9", r: "2" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" })
+var ImageGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Svg, { className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", ry: "2" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "9", cy: "9", r: "2" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" })
 ] });
-var FileTextGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Svg3, { className, children: [
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M14 2v4a2 2 0 0 0 2 2h4" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M10 9H8" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M16 13H8" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M16 17H8" })
+var FileTextGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Svg, { className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M14 2v4a2 2 0 0 0 2 2h4" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M10 9H8" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M16 13H8" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M16 17H8" })
 ] });
-var YoutubeGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Svg3, { className, children: [
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M2.5 17a24.12 24.12 0 0 1 0-10 2 2 0 0 1 1.4-1.4 49.56 49.56 0 0 1 16.2 0A2 2 0 0 1 21.5 7a24.12 24.12 0 0 1 0 10 2 2 0 0 1-1.4 1.4 49.55 49.55 0 0 1-16.2 0A2 2 0 0 1 2.5 17" }),
-  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "m10 15 5-3-5-3z" })
+var YoutubeGlyph = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Svg, { className, children: [
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M2.5 17a24.12 24.12 0 0 1 0-10 2 2 0 0 1 1.4-1.4 49.56 49.56 0 0 1 16.2 0A2 2 0 0 1 21.5 7a24.12 24.12 0 0 1 0 10 2 2 0 0 1-1.4 1.4 49.55 49.55 0 0 1-16.2 0A2 2 0 0 1 2.5 17" }),
+  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m10 15 5-3-5-3z" })
 ] });
 
 // settings/react/SettingRowFrame.tsx
-var import_design_system2 = require("@ai-matrx/design-system");
-var import_jsx_runtime6 = require("react/jsx-runtime");
-var cn2 = (...parts) => parts.filter(Boolean).join(" ");
+var import_design_system = require("@ai-matrx/design-system");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var cn = (...parts) => parts.filter(Boolean).join(" ");
 function formatSettingValue(value) {
   if (typeof value === "boolean") return value ? "On" : "Off";
   if (value !== null && typeof value === "object") return JSON.stringify(value);
   return String(value);
 }
 function SettingRowFrame({ rowKey, state, leading, label, children, actions }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
     "div",
     {
       "data-setting-row": rowKey,
       "data-setting-state": state,
       className: "grid grid-cols-[1rem_minmax(0,1fr)_auto] items-start gap-x-2 gap-y-1 py-1 @md:grid-cols-[1rem_9rem_minmax(0,1fr)_auto]",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex h-7 items-center", children: leading }),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex min-h-7 min-w-0 items-center", children: label }),
-        children !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "col-span-2 col-start-2 row-start-2 min-w-0 @md:col-span-1 @md:col-start-3 @md:row-start-1", children }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "col-start-3 row-start-1 flex min-h-7 items-center justify-end @md:col-start-4", children: actions })
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "flex h-7 items-center", children: leading }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "flex min-h-7 min-w-0 items-center", children: label }),
+        children !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "col-span-2 col-start-2 row-start-2 min-w-0 @md:col-span-1 @md:col-start-3 @md:row-start-1", children }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "col-start-3 row-start-1 flex min-h-7 items-center justify-end @md:col-start-4", children: actions })
       ]
     }
   );
 }
 function RowLabel({ htmlFor, muted, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_design_system2.Label, { htmlFor, className: cn2("min-w-0 truncate type-body", muted ? "text-muted-foreground" : "text-foreground"), children });
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_design_system.Label, { htmlFor, className: cn("min-w-0 truncate type-body", muted ? "text-muted-foreground" : "text-foreground"), children });
 }
 function RowText({ children, mono }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: cn2("flex min-h-7 items-center truncate type-secondary text-muted-foreground", mono && "font-mono"), children });
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: cn("flex min-h-7 items-center truncate type-secondary text-muted-foreground", mono && "font-mono"), children });
 }
 function SettingsGroupSection({ id, title, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("section", { "data-settings-group": id, className: title ? "mt-2 border-t border-border pt-2" : void 0, children: [
-    title ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h3", { className: "pb-1 type-title text-foreground", children: title }) : null,
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("section", { "data-settings-group": id, className: title ? "mt-2 border-t border-border pt-2" : void 0, children: [
+    title ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h3", { className: "pb-1 type-title text-foreground", children: title }) : null,
     children
   ] });
 }
 
 // settings/react/InputCapabilitiesEditor.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime3 = require("react/jsx-runtime");
 var GATE_META = {
   image_urls: {
     label: "Image URLs",
@@ -2752,24 +565,24 @@ function InputCapabilitiesEditor({
   title = "Input Capabilities",
   disabled = false
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(SettingsGroupSection, { id: "input-capabilities", title, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(SettingsGroupSection, { id: "input-capabilities", title, children: [
     UI_GATE_EDITABLE_KEYS.map((key) => {
       const { label, description, Icon } = GATE_META[key];
       const switchId = `${idPrefix}-${key}`;
       const changed = changedKeys?.has(key) === true;
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
         SettingRowFrame,
         {
           rowKey: key,
           state: values[key] === true ? "on" : "off",
-          leading: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Icon, { className: "h-4 w-4 text-muted-foreground" }),
-          label: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(RowLabel, { htmlFor: switchId, children: label }),
-          actions: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
-            changed && onReset ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-              import_controls2.Button,
+          leading: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon, { className: "h-4 w-4 text-muted-foreground" }),
+          label: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(RowLabel, { htmlFor: switchId, children: label }),
+          actions: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+            changed && onReset ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              import_controls.Button,
               {
                 variant: "quiet",
-                icon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(RotateCcwGlyph, {}),
+                icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(RotateCcwGlyph, {}),
                 onClick: () => onReset(key),
                 disabled,
                 "aria-label": `${resetLabel}: ${label}`,
@@ -2777,8 +590,8 @@ function InputCapabilitiesEditor({
                 "data-setting-reset": key
               }
             ) : null,
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-              import_controls2.Switch,
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              import_controls.Switch,
               {
                 id: switchId,
                 checked: values[key] === true,
@@ -2787,31 +600,31 @@ function InputCapabilitiesEditor({
               }
             )
           ] }),
-          children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(RowText, { children: description })
+          children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(RowText, { children: description })
         },
         key
       );
     }),
-    error ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_design_system3.ErrorBox, { as: "p", className: "py-1 type-meta text-destructive", message: error }) : null
+    error ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_design_system2.ErrorBox, { as: "p", className: "py-1 type-meta text-destructive", message: error }) : null
   ] });
 }
 
 // settings/react/SettingControlInput.tsx
-var import_react3 = require("react");
-var import_design_system4 = require("@ai-matrx/design-system");
-var import_controls3 = require("@ai-matrx/design-system/controls");
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_react = require("react");
+var import_design_system3 = require("@ai-matrx/design-system");
+var import_controls2 = require("@ai-matrx/design-system/controls");
+var import_jsx_runtime4 = require("react/jsx-runtime");
 var SELECT_MAX_OPTIONS = 12;
 function choiceFor(options) {
-  if ((0, import_controls3.isAspectRatioOptionSet)(options)) return "aspect-ratio";
+  if ((0, import_controls2.isAspectRatioOptionSet)(options)) return "aspect-ratio";
   if (options.length > SELECT_MAX_OPTIONS) return "searchable";
   return "select";
 }
 function WarningIcon({ className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", className, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M12 9v4" }),
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M12 17h.01" })
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", className, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M12 9v4" }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M12 17h.01" })
   ] });
 }
 function flattenTypeObject(value) {
@@ -2835,8 +648,8 @@ function SettingControlInput({
     const isValueMismatch = stringValue !== "" && !control.enum.includes(stringValue);
     const emit = (v) => onChange(settingKey === "response_format" ? { type: v } : v);
     const choice = choiceFor(control.enum);
-    const picker = choice === "aspect-ratio" ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-      import_controls3.AspectRatioSelect,
+    const picker = choice === "aspect-ratio" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      import_controls2.AspectRatioSelect,
       {
         value: isValueMismatch ? "" : stringValue,
         onChange: emit,
@@ -2846,8 +659,8 @@ function SettingControlInput({
         id: inputId,
         placeholder: "Default"
       }
-    ) : choice === "searchable" ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-      import_controls3.OptionCombobox,
+    ) : choice === "searchable" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      import_controls2.OptionCombobox,
       {
         value: isValueMismatch ? "" : stringValue,
         onChange: emit,
@@ -2858,24 +671,24 @@ function SettingControlInput({
         placeholder: "Default"
       }
     ) : null;
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex flex-1 items-center gap-1.5", children: [
-      picker ?? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
-        import_design_system4.Select,
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex flex-1 items-center gap-1.5", children: [
+      picker ?? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+        import_design_system3.Select,
         {
           value: isValueMismatch ? "" : stringValue,
           onValueChange: emit,
           disabled,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-              import_design_system4.SelectTrigger,
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+              import_design_system3.SelectTrigger,
               {
                 id: inputId,
                 className: "h-7 flex-1 border-0 bg-transparent px-1 text-xs font-medium text-foreground shadow-none hover:bg-transparent focus:ring-0 pointer-coarse:h-11 [&_svg]:h-3 [&_svg]:w-3",
-                children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_design_system4.SelectValue, { placeholder: isValueMismatch ? stringValue : "Default" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system3.SelectValue, { placeholder: isValueMismatch ? stringValue : "Default" })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_design_system4.SelectContent, { className: "text-xs", children: control.enum.map((option) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-              import_design_system4.SelectItem,
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system3.SelectContent, { className: "text-xs", children: control.enum.map((option) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+              import_design_system3.SelectItem,
               {
                 value: option,
                 className: "py-1 text-xs",
@@ -2886,9 +699,9 @@ function SettingControlInput({
           ]
         }
       ),
-      isValueMismatch && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_design_system4.TooltipProvider, { delayDuration: 200, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_design_system4.Tooltip, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_design_system4.TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "shrink-0 cursor-help text-amber-500", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(WarningIcon, { className: "h-3.5 w-3.5" }) }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_design_system4.TooltipContent, { side: "top", className: "max-w-[220px] type-secondary", children: [
+      isValueMismatch && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system3.TooltipProvider, { delayDuration: 200, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_design_system3.Tooltip, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_design_system3.TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "shrink-0 cursor-help text-amber-500", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(WarningIcon, { className: "h-3.5 w-3.5" }) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_design_system3.TooltipContent, { side: "top", className: "max-w-[220px] type-secondary", children: [
           '"',
           stringValue,
           '" is not a recognized option for this model'
@@ -2897,9 +710,9 @@ function SettingControlInput({
     ] });
   }
   if (control.type === "boolean") {
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-        import_design_system4.Checkbox,
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        import_design_system3.Checkbox,
         {
           id: inputId,
           checked: value === true,
@@ -2908,8 +721,8 @@ function SettingControlInput({
           className: "cursor-pointer"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-        import_design_system4.Label,
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        import_design_system3.Label,
         {
           htmlFor: inputId,
           className: "cursor-pointer text-xs text-muted-foreground",
@@ -2921,7 +734,7 @@ function SettingControlInput({
   if (control.type === "number" || control.type === "integer") {
     const numeric = typeof value === "number" ? value : void 0;
     const hasRange = control.min !== void 0 && control.max !== void 0;
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
       NumberInput,
       {
         value: numeric,
@@ -2939,8 +752,8 @@ function SettingControlInput({
   }
   if (control.type === "string_array") {
     const arrayValue = Array.isArray(value) ? value.join("\n") : "";
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-      import_design_system4.Textarea,
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      import_design_system3.Textarea,
       {
         id: inputId,
         value: arrayValue,
@@ -2952,7 +765,7 @@ function SettingControlInput({
     );
   }
   if (control.type === "array" || control.type === "object_array" || typeof value === "object" && value !== null) {
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
       JsonValueInput,
       {
         id: inputId,
@@ -2962,8 +775,8 @@ function SettingControlInput({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-    import_design_system4.Input,
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    import_design_system3.Input,
     {
       id: inputId,
       type: "text",
@@ -2981,15 +794,15 @@ function JsonValueInput({
   disabled
 }) {
   const toText = (v) => v === void 0 || v === null ? "" : JSON.stringify(v, null, 2);
-  const [draft, setDraft] = (0, import_react3.useState)(() => toText(value));
-  const [jsonError, setJsonError] = (0, import_react3.useState)(null);
-  (0, import_react3.useEffect)(() => {
+  const [draft, setDraft] = (0, import_react.useState)(() => toText(value));
+  const [jsonError, setJsonError] = (0, import_react.useState)(null);
+  (0, import_react.useEffect)(() => {
     setDraft(toText(value));
     setJsonError(null);
   }, [JSON.stringify(value)]);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex flex-col gap-1", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-      import_design_system4.Textarea,
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex flex-col gap-1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      import_design_system3.Textarea,
       {
         id,
         value: draft,
@@ -3015,7 +828,7 @@ function JsonValueInput({
         spellCheck: false
       }
     ),
-    jsonError && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "type-meta text-amber-600 dark:text-amber-400", children: jsonError })
+    jsonError && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "type-meta text-amber-600 dark:text-amber-400", children: jsonError })
   ] });
 }
 function NumberInput({
@@ -3031,7 +844,7 @@ function NumberInput({
   withSlider = false
 }) {
   const boxClass = "h-7 px-2 text-xs tabular-nums pointer-coarse:h-11";
-  const [draftState, setDraftState] = (0, import_react3.useState)(() => ({
+  const [draftState, setDraftState] = (0, import_react.useState)(() => ({
     sourceValue: value,
     text: value === void 0 ? "" : String(value)
   }));
@@ -3049,13 +862,13 @@ function NumberInput({
     } else setDraft(shown);
   };
   if (withSlider) {
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
       "div",
       {
         className: "grid grid-cols-[1fr_4.5rem] items-center gap-2",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-            import_design_system4.Slider,
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+            import_design_system3.Slider,
             {
               ...min !== void 0 ? { min } : {},
               ...max !== void 0 ? { max } : {},
@@ -3072,8 +885,8 @@ function NumberInput({
               disabled
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-            import_design_system4.Input,
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+            import_design_system3.Input,
             {
               type: "text",
               inputMode: "decimal",
@@ -3093,8 +906,8 @@ function NumberInput({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-    import_design_system4.Input,
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    import_design_system3.Input,
     {
       type: "text",
       inputMode: "decimal",
@@ -3113,28 +926,28 @@ function NumberInput({
 }
 
 // settings/react/ModelSettingsPanel.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_jsx_runtime5 = require("react/jsx-runtime");
 function StatusGlyph({ issue, source }) {
   const title = issue ? issue.message : source ? `Valid \xB7 ${source}` : "Valid";
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
     "span",
     {
-      className: cn2("inline-flex h-7 w-6 shrink-0 items-center justify-center", issue ? "text-warning" : "text-success"),
+      className: cn("inline-flex h-7 w-6 shrink-0 items-center justify-center", issue ? "text-warning" : "text-success"),
       role: "img",
       "aria-label": title,
       title,
-      children: issue ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TriangleAlertGlyph, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(CircleCheckGlyph, { className: "h-3.5 w-3.5" })
+      children: issue ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(TriangleAlertGlyph, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(CircleCheckGlyph, { className: "h-3.5 w-3.5" })
     }
   );
 }
 function ModelSettingRow({ row, control, target, idPrefix, disabled }) {
   const read = target.read(row.key, control);
   const resetLabel = target.resetLabel ?? "Reset to agent";
-  const reset = read.changedHere && target.resetToInherited ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-    import_controls4.Button,
+  const reset = read.changedHere && target.resetToInherited ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    import_controls3.Button,
     {
       variant: "quiet",
-      icon: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RotateCcwGlyph, {}),
+      icon: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(RotateCcwGlyph, {}),
       onClick: () => target.resetToInherited?.(row.key),
       disabled,
       "aria-label": `${resetLabel}: ${row.label}`,
@@ -3143,20 +956,20 @@ function ModelSettingRow({ row, control, target, idPrefix, disabled }) {
     }
   ) : null;
   if (read.state === "bound") {
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       SettingRowFrame,
       {
         rowKey: row.key,
         state: "bound",
-        leading: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_design_system5.Checkbox, { checked: true, disabled: true, "aria-label": `${row.label} is a run input` }),
-        label: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RowLabel, { children: row.label }),
-        actions: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
+        leading: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_design_system4.Checkbox, { checked: true, disabled: true, "aria-label": `${row.label} is a run input` }),
+        label: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(RowLabel, { children: row.label }),
+        actions: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
           reset,
-          target.unbind ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-            import_controls4.Button,
+          target.unbind ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+            import_controls3.Button,
             {
               variant: "quiet",
-              icon: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(UnlinkGlyph, {}),
+              icon: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(UnlinkGlyph, {}),
               onClick: () => target.unbind?.(row.key, control),
               disabled,
               "aria-label": `Make ${row.label} a fixed setting`,
@@ -3164,9 +977,9 @@ function ModelSettingRow({ row, control, target, idPrefix, disabled }) {
             }
           ) : null
         ] }),
-        children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { className: "flex min-h-7 min-w-0 items-center gap-2", "data-bound-control": row.key, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_controls4.Chip, { tone: "primary", icon: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(VariableGlyph, {}), label: `{{${read.variableName}}}` }),
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "truncate type-meta text-muted-foreground", children: read.value === void 0 || read.value === null || read.value === "" ? "Model default" : formatSettingValue(read.value) })
+        children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "flex min-h-7 min-w-0 items-center gap-2", "data-bound-control": row.key, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_controls3.Chip, { tone: "primary", icon: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(VariableGlyph, {}), label: `{{${read.variableName}}}` }),
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "truncate type-meta text-muted-foreground", children: read.value === void 0 || read.value === null || read.value === "" ? "Model default" : formatSettingValue(read.value) })
         ] })
       }
     );
@@ -3176,13 +989,13 @@ function ModelSettingRow({ row, control, target, idPrefix, disabled }) {
   const isOff = isSet && isOffValue(value, control);
   const checkboxId = `${idPrefix}-setting-${row.key}`;
   const canBind = Boolean(target.bind) && (target.canBind?.(row.key) ?? true);
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
     SettingRowFrame,
     {
       rowKey: row.key,
       state: isOff ? "off" : read.state,
-      leading: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-        import_design_system5.Checkbox,
+      leading: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        import_design_system4.Checkbox,
         {
           id: checkboxId,
           checked: isSet,
@@ -3190,14 +1003,14 @@ function ModelSettingRow({ row, control, target, idPrefix, disabled }) {
           onCheckedChange: (next) => next === true ? target.turnOn(row.key, control) : target.clear(row.key)
         }
       ),
-      label: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RowLabel, { htmlFor: checkboxId, muted: !isSet, children: row.label }),
-      actions: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(StatusGlyph, { issue: read.issue, source: read.source }),
-        canBind ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-          import_controls4.Button,
+      label: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(RowLabel, { htmlFor: checkboxId, muted: !isSet, children: row.label }),
+      actions: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(StatusGlyph, { issue: read.issue, source: read.source }),
+        canBind ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          import_controls3.Button,
           {
             variant: "quiet",
-            icon: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(VariableGlyph, {}),
+            icon: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(VariableGlyph, {}),
             onClick: () => target.bind?.(row.key, control),
             disabled,
             "aria-label": `Make ${row.label} a run input`,
@@ -3205,11 +1018,11 @@ function ModelSettingRow({ row, control, target, idPrefix, disabled }) {
             "data-bind-control": row.key
           }
         ) : null,
-        isSet && read.issue?.fixable && target.fix ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-          import_controls4.Button,
+        isSet && read.issue?.fixable && target.fix ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          import_controls3.Button,
           {
             variant: "quiet",
-            icon: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(WrenchGlyph, {}),
+            icon: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(WrenchGlyph, {}),
             onClick: () => target.fix?.(row.key),
             disabled,
             "aria-label": `Fix ${row.label} automatically`,
@@ -3217,12 +1030,12 @@ function ModelSettingRow({ row, control, target, idPrefix, disabled }) {
           }
         ) : null,
         reset,
-        isSet ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-          import_controls4.Button,
+        isSet ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          import_controls3.Button,
           {
             variant: "quiet",
             removes: true,
-            icon: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Trash2Glyph, {}),
+            icon: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Trash2Glyph, {}),
             onClick: () => target.clear(row.key),
             disabled,
             "aria-label": `Clear ${row.label} to not set`,
@@ -3231,8 +1044,8 @@ function ModelSettingRow({ row, control, target, idPrefix, disabled }) {
           }
         ) : null
       ] }),
-      children: isSet ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+      children: isSet ? /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
           SettingControlInput,
           {
             settingKey: row.key,
@@ -3243,40 +1056,40 @@ function ModelSettingRow({ row, control, target, idPrefix, disabled }) {
             id: `${idPrefix}-control-${row.key}`
           }
         ),
-        read.issue ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "pt-1 type-meta text-warning-ink", children: read.issue.message }) : null
-      ] }) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RowText, { children: read.modelDefault !== void 0 && read.modelDefault !== null ? `Not set \xB7 Model default: ${formatSettingValue(read.modelDefault)}` : "Not set" })
+        read.issue ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "pt-1 type-meta text-warning-ink", children: read.issue.message }) : null
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(RowText, { children: read.modelDefault !== void 0 && read.modelDefault !== null ? `Not set \xB7 Model default: ${formatSettingValue(read.modelDefault)}` : "Not set" })
     }
   );
 }
 function ExtraSettingRow({ rowKey, label, value, kind, onClear, onReset, resetLabel = "Reset to agent", disabled = false }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
     SettingRowFrame,
     {
       rowKey,
       state: kind,
-      label: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RowLabel, { children: label }),
-      actions: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
-        kind === "translated" ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_controls4.Chip, { tone: "sky", label: "Translated", title: "Kept as set and sent as this model's closest equivalent" }) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_controls4.Chip, { tone: "warning", label: "Not on this model", title: "This model has no such setting" }),
-        onReset ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_controls4.Button, { variant: "quiet", icon: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RotateCcwGlyph, {}), onClick: onReset, disabled, "aria-label": `${resetLabel}: ${label}`, title: resetLabel, "data-setting-reset": rowKey }) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_controls4.Button, { variant: "quiet", removes: true, icon: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Trash2Glyph, {}), onClick: onClear, disabled, "aria-label": `Clear ${label}`, title: "Clear to not set", "data-setting-clear": rowKey })
+      label: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(RowLabel, { children: label }),
+      actions: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+        kind === "translated" ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_controls3.Chip, { tone: "sky", label: "Translated", title: "Kept as set and sent as this model's closest equivalent" }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_controls3.Chip, { tone: "warning", label: "Not on this model", title: "This model has no such setting" }),
+        onReset ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_controls3.Button, { variant: "quiet", icon: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(RotateCcwGlyph, {}), onClick: onReset, disabled, "aria-label": `${resetLabel}: ${label}`, title: resetLabel, "data-setting-reset": rowKey }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_controls3.Button, { variant: "quiet", removes: true, icon: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Trash2Glyph, {}), onClick: onClear, disabled, "aria-label": `Clear ${label}`, title: "Clear to not set", "data-setting-clear": rowKey })
       ] }),
-      children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RowText, { mono: value !== void 0 && value !== null, children: value === void 0 || value === null ? "Not set" : isOffValue(value, null) ? "Off" : formatSettingValue(value) })
+      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(RowText, { mono: value !== void 0 && value !== null, children: value === void 0 || value === null ? "Not set" : isOffValue(value, null) ? "Off" : formatSettingValue(value) })
     }
   );
 }
-function ModelRow2({ model, resetLabel, idPrefix, disabled }) {
+function ModelRow({ model, resetLabel, idPrefix, disabled }) {
   const off = disabled || model.disabled === true;
   const oneMessageId = `${idPrefix}-model-one-message`;
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
     SettingRowFrame,
     {
       rowKey: "model",
       state: model.value ? "set" : "unset",
-      label: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RowLabel, { children: "Model" }),
-      actions: model.changedHere && model.resetToInherited ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-        import_controls4.Button,
+      label: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(RowLabel, { children: "Model" }),
+      actions: model.changedHere && model.resetToInherited ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        import_controls3.Button,
         {
           variant: "quiet",
-          icon: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RotateCcwGlyph, {}),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(RotateCcwGlyph, {}),
           onClick: () => model.resetToInherited?.(),
           disabled: off,
           "aria-label": `${resetLabel}: Model`,
@@ -3284,9 +1097,9 @@ function ModelRow2({ model, resetLabel, idPrefix, disabled }) {
           "data-setting-reset": "model"
         }
       ) : null,
-      children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex min-h-7 min-w-0 flex-wrap items-center gap-x-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-          ModelListDropdown,
+      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex min-h-7 min-w-0 flex-wrap items-center gap-x-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          import_react2.ModelListDropdown,
           {
             "aria-label": "Model",
             value: model.value,
@@ -3301,9 +1114,9 @@ function ModelRow2({ model, resetLabel, idPrefix, disabled }) {
             ...model.disabledTitle ? { disabledTitle: model.disabledTitle } : {}
           }
         ),
-        model.oneMessage ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { htmlFor: oneMessageId, className: "flex min-h-7 items-center gap-1 type-secondary text-muted-foreground", title: "Use this model for the next message, then go back", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-            import_controls4.Switch,
+        model.oneMessage ? /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("label", { htmlFor: oneMessageId, className: "flex min-h-7 items-center gap-1 type-secondary text-muted-foreground", title: "Use this model for the next message, then go back", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+            import_controls3.Switch,
             {
               id: oneMessageId,
               checked: model.oneMessage.on,
@@ -3332,7 +1145,7 @@ function ModelSettingsPanel({
   const groups = controls ? buildSettingsRows(controls, values).filter((group) => group.rows.length > 0) : [];
   const extras = extraSettingKeys(controls, values, target.changedKeys);
   const resetLabel = target.resetLabel ?? "Reset to agent";
-  const extraRow = (key, kind) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+  const extraRow = (key, kind) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
     ExtraSettingRow,
     {
       rowKey: key,
@@ -3346,17 +1159,17 @@ function ModelSettingsPanel({
     },
     key
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { "data-model-settings-panel": "", className: "@container flex min-w-0 flex-col", children: [
-    model ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(ModelRow2, { model, resetLabel, idPrefix, disabled }) : null,
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { "data-model-settings-panel": "", className: "@container flex min-w-0 flex-col", children: [
+    model ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ModelRow, { model, resetLabel, idPrefix, disabled }) : null,
     notices,
     extras.unsupported.map((key) => extraRow(key, "unsupported")),
-    extras.translated.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SettingsGroupSection, { id: "translated", title: "Translated for this model", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { "data-translated-settings": "", children: extras.translated.map((key) => extraRow(key, "translated")) }) }) : null,
-    groups.length === 0 && emptyNote ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "py-2 type-secondary text-muted-foreground", children: emptyNote }) : null,
-    groups.map((group) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(SettingsGroupSection, { id: group.id, title: group.label || void 0, children: group.rows.map((row) => {
+    extras.translated.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SettingsGroupSection, { id: "translated", title: "Translated for this model", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { "data-translated-settings": "", children: extras.translated.map((key) => extraRow(key, "translated")) }) }) : null,
+    groups.length === 0 && emptyNote ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "py-2 type-secondary text-muted-foreground", children: emptyNote }) : null,
+    groups.map((group) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SettingsGroupSection, { id: group.id, title: group.label || void 0, children: group.rows.map((row) => {
       const custom = renderRow?.(row);
-      if (custom !== void 0) return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { children: custom }, row.key);
+      if (custom !== void 0) return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { children: custom }, row.key);
       if (!row.control) return null;
-      return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
         ModelSettingRow,
         {
           row,
@@ -3368,7 +1181,7 @@ function ModelSettingsPanel({
         row.key
       );
     }) }, group.id)),
-    capabilities ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+    capabilities ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       InputCapabilitiesEditor,
       {
         values: capabilities.values,
@@ -3386,7 +1199,7 @@ function ModelSettingsPanel({
 
 // settings/react/index.ts
 function useSettingsSelector(store, select) {
-  return (0, import_react5.useSyncExternalStore)(
+  return (0, import_react3.useSyncExternalStore)(
     store.subscribe,
     () => select(store.getState()),
     () => select(store.getState())