@iota-uz/sdk 0.4.25 → 0.4.26

package/dist/bichat/index.mjs

@@ -2,7 +2,7 @@ import React, { createContext, memo, useRef, useEffect, useCallback, useState, u
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import ReactApexChart from 'react-apexcharts';
 import ApexCharts from 'apexcharts';
-import { CaretUp, CaretDown, DotsThreeVertical, Check, Copy, X, Columns, ArrowsIn, ArrowsOut, Warning, ArrowClockwise, Paperclip, PaperPlaneRight, ChartBar, FileText, Lightbulb, CircleNotch, ArrowUUpLeft, PencilSimple, Bookmark, ArrowsClockwise, Archive, Trash, UsersThree, DotsThree, Image, MagnifyingGlass, DownloadSimple, ArrowCounterClockwise, Bug, ArrowUp, ArrowDown, Stack, ImageBroken, CaretLeft, CaretRight, Info, CheckCircle, XCircle, Spinner, WarningCircle, FilePdf, FileXls, FileCsv, FileDoc, FileCode, File as File$1, MagnifyingGlassMinus, MagnifyingGlassPlus, Download, ChatCircleDots, PencilSimpleLine, ArrowLeft, PaperPlaneTilt, ArrowRight, Timer, Lightning, Database, ArrowSquareOut, Wrench, ClockCounterClockwise, Package, Plus, Crown, UserPlus, ArrowsCounterClockwise, ChatCircle, Gear, Users, List, CaretLineLeft, CaretLineRight, Code, Table, SpinnerGap, FloppyDisk, ShareNetwork, Sidebar } from '@phosphor-icons/react';
+import { CaretUp, CaretDown, DotsThreeVertical, Check, Copy, X, Columns, ArrowsIn, ArrowsOut, Warning, ArrowClockwise, Paperclip, Stop, PaperPlaneRight, ChartBar, FileText, Lightbulb, CircleNotch, ArrowUUpLeft, PencilSimple, Bookmark, ArrowsClockwise, Archive, Trash, UsersThree, DotsThree, Image, MagnifyingGlass, DownloadSimple, ArrowCounterClockwise, Bug, ArrowUp, ArrowDown, Stack, ImageBroken, CaretLeft, CaretRight, Info, CheckCircle, XCircle, Spinner, WarningCircle, FilePdf, FileXls, FileCsv, FileDoc, FileCode, File as File$1, MagnifyingGlassMinus, MagnifyingGlassPlus, Download, ChatCircleDots, PencilSimpleLine, ArrowLeft, PaperPlaneTilt, ArrowRight, Timer, Lightning, Database, ArrowSquareOut, Wrench, ClockCounterClockwise, Package, Plus, Crown, UserPlus, ArrowsCounterClockwise, ChatCircle, Gear, Users, List, CaretLineLeft, CaretLineRight, Code, Table, SpinnerGap, FloppyDisk, ShareNetwork, Sidebar } from '@phosphor-icons/react';
 import { Prism } from 'react-syntax-highlighter';
 import { vscDarkPlus, vs } from 'react-syntax-highlighter/dist/esm/styles/prism';
 import ReactMarkdown from 'react-markdown';
@@ -1637,6 +1637,37 @@ function loadDebugMode(sessionId) {
   }
 }
 
+// ui/src/bichat/utils/reasoningEffortStorage.ts
+var STORAGE_KEY = "bichat.reasoningEffort";
+function saveReasoningEffort(effort) {
+  if (typeof window === "undefined") {
+    return;
+  }
+  try {
+    window.sessionStorage.setItem(STORAGE_KEY, effort);
+  } catch {
+  }
+}
+function loadReasoningEffort() {
+  if (typeof window === "undefined") {
+    return null;
+  }
+  try {
+    return window.sessionStorage.getItem(STORAGE_KEY);
+  } catch {
+    return null;
+  }
+}
+function clearReasoningEffort() {
+  if (typeof window === "undefined") {
+    return;
+  }
+  try {
+    window.sessionStorage.removeItem(STORAGE_KEY);
+  } catch {
+  }
+}
+
 // ui/src/bichat/utils/debugTrace.ts
 function hasMeaningfulUsage(trace) {
   if (!trace) {
@@ -1779,6 +1810,16 @@ function readDebugLimitsFromGlobalContext() {
     completionReserveTokens
   };
 }
+function readReasoningEffortOptionsFromGlobalContext() {
+  if (typeof window === "undefined") {
+    return void 0;
+  }
+  const opts = window.__APPLET_CONTEXT__?.extensions?.llm?.reasoningEffortOptions;
+  if (!Array.isArray(opts) || opts.length === 0) {
+    return void 0;
+  }
+  return opts.filter((o) => typeof o === "string");
+}
 
 // ui/src/bichat/machine/selectors.ts
 function deriveDebugMode(state) {
@@ -1795,8 +1836,10 @@ function deriveSessionSnapshot(state, methods) {
     debugMode: deriveDebugMode(state),
     sessionDebugUsage: getSessionDebugUsage(state.messaging.turns),
     debugLimits: state.session.debugLimits,
+    reasoningEffort: state.session.reasoningEffort,
     setError: methods.setError,
-    retryFetchSession: methods.retryFetchSession
+    retryFetchSession: methods.retryFetchSession,
+    setReasoningEffort: methods.setReasoningEffort
   };
 }
 function deriveMessagingSnapshot(state, methods) {
@@ -1986,6 +2029,7 @@ var ChatMachine = class {
     this.sendingSessionId = null;
     this.fetchCancelled = false;
     this.disposed = false;
+    this.reasoningEffortOptions = null;
     /** Memoized sessionDebugUsage — avoids unnecessary session re-renders during streaming. */
     this.lastSessionDebugUsage = null;
     /** Interval handle for passive polling when another tab has an active stream. */
@@ -2017,7 +2061,8 @@ var ChatMachine = class {
       if (this.lastSessionSnapshotVersion !== this.sessionSnapshotVersion) {
         this.cachedSessionSnapshot = deriveSessionSnapshot(this.state, {
           setError: this.setError,
-          retryFetchSession: this.retryFetchSession
+          retryFetchSession: this.retryFetchSession,
+          setReasoningEffort: this.setReasoningEffort
         });
         this.lastSessionSnapshotVersion = this.sessionSnapshotVersion;
       }
@@ -2071,6 +2116,11 @@ var ChatMachine = class {
     this.dataSource = config.dataSource;
     this.rateLimiter = config.rateLimiter;
     this.onSessionCreated = config.onSessionCreated;
+    this.reasoningEffortOptions = this.buildReasoningEffortOptions();
+    const initialReasoningEffort = this.sanitizeReasoningEffort(loadReasoningEffort() || void 0);
+    if (!initialReasoningEffort) {
+      clearReasoningEffort();
+    }
     this.state = {
       session: {
         currentSessionId: void 0,
@@ -2079,7 +2129,8 @@ var ChatMachine = class {
         error: null,
         errorRetryable: false,
         debugModeBySession: {},
-        debugLimits: readDebugLimitsFromGlobalContext()
+        debugLimits: readDebugLimitsFromGlobalContext(),
+        reasoningEffort: initialReasoningEffort
       },
       messaging: {
         turns: [],
@@ -2121,6 +2172,21 @@ var ChatMachine = class {
     this.enqueueMessage = this._enqueueMessage.bind(this);
     this.removeQueueItem = this._removeQueueItem.bind(this);
     this.updateQueueItem = this._updateQueueItem.bind(this);
+    this.setReasoningEffort = this._setReasoningEffort.bind(this);
+  }
+  buildReasoningEffortOptions() {
+    const options = readReasoningEffortOptionsFromGlobalContext();
+    if (!options || options.length === 0) {
+      return null;
+    }
+    return new Set(options);
+  }
+  // Keep outbound payloads constrained to server-declared options.
+  sanitizeReasoningEffort(effort) {
+    if (!effort || !this.reasoningEffortOptions || this.reasoningEffortOptions.size === 0) {
+      return void 0;
+    }
+    return this.reasoningEffortOptions.has(effort) ? effort : void 0;
   }
   // =====================================================================
   // Lifecycle
@@ -2241,6 +2307,15 @@ var ChatMachine = class {
       }
     });
   }
+  _setReasoningEffort(effort) {
+    const next = this.sanitizeReasoningEffort(effort);
+    this._updateSession({ reasoningEffort: next });
+    if (next) {
+      saveReasoningEffort(next);
+      return;
+    }
+    clearReasoningEffort();
+  }
   // =====================================================================
   // Private — session fetch
   // =====================================================================
@@ -2668,6 +2743,7 @@ var ChatMachine = class {
       attachments,
       debugMode,
       replaceFromMessageID,
+      reasoningEffort,
       tempTurnId
     } = params;
     let accumulatedContent = "";
@@ -2682,7 +2758,8 @@ var ChatMachine = class {
       this.abortController?.signal,
       {
         debugMode,
-        replaceFromMessageID
+        replaceFromMessageID,
+        reasoningEffort
       }
     )) {
       if (this.abortController?.signal.aborted) {
@@ -2879,6 +2956,7 @@ var ChatMachine = class {
         attachments,
         debugMode: curDebugMode,
         replaceFromMessageID,
+        reasoningEffort: this.sanitizeReasoningEffort(this.state.session.reasoningEffort),
         tempTurnId: tempTurn.id
       });
       if (stopped) {
@@ -7115,6 +7193,43 @@ function CopyPill({ text }) {
     }
   );
 }
+function InlineCopyButton({ text }) {
+  const [copied, setCopied] = useState(false);
+  const timerRef = useRef(null);
+  useEffect(() => () => {
+    if (timerRef.current !== null) {
+      clearTimeout(timerRef.current);
+    }
+  }, []);
+  const handleCopy = async (e) => {
+    e.stopPropagation();
+    try {
+      await navigator.clipboard.writeText(text);
+      setCopied(true);
+      if (timerRef.current !== null) {
+        clearTimeout(timerRef.current);
+      }
+      timerRef.current = window.setTimeout(() => {
+        setCopied(false);
+        timerRef.current = null;
+      }, 2e3);
+    } catch (err) {
+      console.error("Copy failed:", err);
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      onClick: handleCopy,
+      "aria-label": copied ? "Copied" : "Copy",
+      className: [
+        "flex-shrink-0 p-1 rounded transition-colors duration-150",
+        copied ? "text-emerald-500 dark:text-emerald-400" : "text-gray-300 dark:text-gray-600 hover:text-gray-500 dark:hover:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700/40"
+      ].join(" "),
+      children: copied ? /* @__PURE__ */ jsx(Check, { size: 11, weight: "bold" }) : /* @__PURE__ */ jsx(Copy, { size: 11 })
+    }
+  );
+}
 function MetricChip({ icon, value, label }) {
   return /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5 px-2 py-1 rounded-md bg-gray-50 dark:bg-gray-800/40 text-[11px] tabular-nums", children: [
     icon,
@@ -7213,7 +7328,7 @@ function ToolCard({ tool }) {
     }
   );
 }
-function DebugPanel({ trace, debugLimits = null }) {
+function DebugPanel({ trace }) {
   const hasData = !!trace && hasDebugTrace(trace);
   const traceID = trace?.traceId?.trim() || "";
   const traceURL = trace?.traceUrl?.trim() || "";
@@ -7232,22 +7347,6 @@ function DebugPanel({ trace, debugLimits = null }) {
     }
   })();
   const tokensPerSecond = calculateCompletionTokensPerSecond(trace?.usage, trace?.generationMs);
-  const effectiveMaxTokens = debugLimits?.effectiveMaxTokens ?? 0;
-  const promptTokens = trace?.usage?.promptTokens ?? 0;
-  const contextUsagePercent = calculateContextUsagePercent(promptTokens, effectiveMaxTokens);
-  const contextUsagePercentLabel = contextUsagePercent !== null ? contextUsagePercent.toFixed(1) : null;
-  const formatCompactTokens = (value) => {
-    if (!Number.isFinite(value) || value <= 0) {
-      return "0 tokens";
-    }
-    return `${new Intl.NumberFormat("en-US", {
-      notation: "compact",
-      maximumFractionDigits: value >= 1e5 ? 0 : 1
-    }).format(value)} tokens`;
-  };
-  const contextPercentValue = contextUsagePercent ?? 0;
-  const contextUsageToneClass = contextPercentValue > 75 ? "bg-red-100 dark:bg-red-900/30 text-red-600 dark:text-red-400" : contextPercentValue > 50 ? "bg-amber-100 dark:bg-amber-900/30 text-amber-600 dark:text-amber-400" : "bg-emerald-100 dark:bg-emerald-900/30 text-emerald-600 dark:text-emerald-400";
-  const contextUsageBarColor = contextPercentValue > 75 ? "#ef4444" : contextPercentValue > 50 ? "#f59e0b" : "#10b981";
   const metrics = [];
   if (hasData && trace) {
     if (trace.generationMs !== void 0) {
@@ -7300,34 +7399,36 @@ function DebugPanel({ trace, debugLimits = null }) {
       hasData && trace && /* @__PURE__ */ jsx(CopyPill, { text: JSON.stringify(trace, null, 2) })
     ] }),
     hasData && trace ? /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
-      (traceID || safeTraceURL) && /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-gray-200/60 dark:border-gray-700/40 bg-gray-50/50 dark:bg-gray-800/40 p-3 space-y-2", children: [
-        traceID && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
-          /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
-            /* @__PURE__ */ jsx("div", { className: "text-[10px] uppercase tracking-wider text-gray-500 dark:text-gray-400", children: "Trace ID" }),
-            /* @__PURE__ */ jsx("div", { className: "font-mono text-[11px] text-gray-800 dark:text-gray-200 break-all", children: traceID })
-          ] }),
-          /* @__PURE__ */ jsx(CopyPill, { text: traceID })
+      (traceID || trace.sessionId) && /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-gray-200/60 dark:border-gray-700/40 bg-gray-50/50 dark:bg-gray-800/40 px-3 py-2 space-y-1.5", children: [
+        traceID && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 min-w-0", children: [
+          /* @__PURE__ */ jsx("span", { className: "flex-shrink-0 text-[10px] uppercase tracking-wider text-gray-400 dark:text-gray-500 w-14", children: "Trace" }),
+          /* @__PURE__ */ jsx("span", { className: "flex-1 min-w-0 font-mono text-[11px] text-gray-700 dark:text-gray-300 truncate", title: traceID, children: traceID }),
+          /* @__PURE__ */ jsx(InlineCopyButton, { text: traceID })
         ] }),
-        safeTraceURL && /* @__PURE__ */ jsxs(
-          "a",
-          {
-            href: safeTraceURL,
-            target: "_blank",
-            rel: "noopener noreferrer",
-            "aria-label": "View full trace in Langfuse (opens in new tab)",
-            className: "inline-flex items-center gap-1.5 text-[11px] font-medium text-blue-600 hover:text-blue-700 dark:text-blue-400 dark:hover:text-blue-300",
-            children: [
-              /* @__PURE__ */ jsx(ArrowSquareOut, { size: 12, weight: "bold" }),
-              /* @__PURE__ */ jsx("span", { children: "Open in Langfuse" })
-            ]
-          }
-        )
-      ] }),
-      (trace.thinking || trace.observationReason || trace.sessionId) && /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-gray-200/60 dark:border-gray-700/40 bg-gray-50/50 dark:bg-gray-800/40 p-3 space-y-2", children: [
-        trace.sessionId && /* @__PURE__ */ jsxs("div", { className: "text-[10px] uppercase tracking-wider text-gray-500 dark:text-gray-400", children: [
-          "Session: ",
-          /* @__PURE__ */ jsx("span", { className: "font-mono normal-case break-all", children: trace.sessionId })
+        trace.sessionId && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 min-w-0", children: [
+          /* @__PURE__ */ jsx("span", { className: "flex-shrink-0 text-[10px] uppercase tracking-wider text-gray-400 dark:text-gray-500 w-14", children: "Session" }),
+          /* @__PURE__ */ jsx("span", { className: "flex-1 min-w-0 font-mono text-[11px] text-gray-700 dark:text-gray-300 truncate", title: trace.sessionId, children: trace.sessionId }),
+          /* @__PURE__ */ jsx(InlineCopyButton, { text: trace.sessionId })
         ] }),
+        safeTraceURL && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 min-w-0 pt-0.5", children: [
+          /* @__PURE__ */ jsx("span", { className: "flex-shrink-0 w-14" }),
+          /* @__PURE__ */ jsxs(
+            "a",
+            {
+              href: safeTraceURL,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              "aria-label": "Open in Langfuse",
+              className: "inline-flex items-center gap-1.5 text-[11px] font-medium text-blue-500 hover:text-blue-600 dark:text-blue-400 dark:hover:text-blue-300 transition-colors duration-150",
+              children: [
+                /* @__PURE__ */ jsx(ArrowSquareOut, { size: 11, weight: "bold" }),
+                /* @__PURE__ */ jsx("span", { children: "Open in Langfuse" })
+              ]
+            }
+          )
+        ] })
+      ] }),
+      (trace.thinking || trace.observationReason) && /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-gray-200/60 dark:border-gray-700/40 bg-gray-50/50 dark:bg-gray-800/40 p-3 space-y-2", children: [
         trace.observationReason && /* @__PURE__ */ jsxs("div", { className: "text-[11px] text-amber-700 dark:text-amber-300", children: [
           "Observation: ",
           /* @__PURE__ */ jsx("span", { className: "font-mono", children: trace.observationReason })
@@ -7367,30 +7468,6 @@ function DebugPanel({ trace, debugLimits = null }) {
           /* @__PURE__ */ jsx("span", { className: "px-1.5 py-0.5 rounded-full bg-gray-100 dark:bg-gray-800 text-[10px] font-mono font-medium text-gray-500 dark:text-gray-400 tabular-nums", children: trace.tools.length })
         ] }),
         /* @__PURE__ */ jsx("div", { className: "space-y-1.5", children: trace.tools.map((tool, idx) => /* @__PURE__ */ jsx(ToolCard, { tool }, `${tool.callId || tool.name}-${idx}`)) })
-      ] }),
-      contextUsagePercentLabel !== null && /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-gray-200/60 dark:border-gray-700/40 bg-gray-50/50 dark:bg-gray-800/40 p-3 space-y-2", children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
-          /* @__PURE__ */ jsx("span", { className: "text-[10px] uppercase tracking-wider text-gray-500 dark:text-gray-400", children: "Context usage" }),
-          /* @__PURE__ */ jsxs("span", { className: "font-mono text-[10px] text-gray-500 dark:text-gray-400 tabular-nums", children: [
-            formatCompactTokens(promptTokens),
-            " / ",
-            formatCompactTokens(effectiveMaxTokens)
-          ] }),
-          /* @__PURE__ */ jsxs("span", { className: `px-1.5 py-0.5 rounded-full text-[10px] font-semibold tabular-nums ${contextUsageToneClass}`, children: [
-            contextUsagePercentLabel,
-            "%"
-          ] })
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: "h-1.5 rounded-full bg-gray-200/80 dark:bg-gray-700/50 overflow-hidden", children: /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: "h-full rounded-full transition-all duration-700 ease-out",
-            style: {
-              width: `${Math.min(contextPercentValue, 100)}%`,
-              backgroundColor: contextUsageBarColor
-            }
-          }
-        ) })
       ] })
     ] }) : /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-400 dark:text-gray-500 italic", children: "Debug info unavailable" })
   ] });
@@ -7452,8 +7529,7 @@ function AssistantMessage({
   hideAvatar = false,
   hideActions = false,
   hideTimestamp = false,
-  showDebug = false,
-  debugLimits = null
+  showDebug = false
 }) {
   const { t } = useTranslation();
   const [explanationExpanded, setExplanationExpanded] = useState(false);
@@ -7644,7 +7720,7 @@ function AssistantMessage({
             explanationExpanded && /* @__PURE__ */ jsx("div", { className: "pt-3 text-sm text-gray-600 dark:text-gray-400", children: /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx("div", { children: t("BiChat.Common.Loading") }), children: /* @__PURE__ */ jsx(MarkdownRenderer2, { content: turn.explanation }) }) })
           ] })
         ) }),
-        showDebug && /* @__PURE__ */ jsx(DebugPanel, { trace: turn.debug, debugLimits })
+        showDebug && /* @__PURE__ */ jsx(DebugPanel, { trace: turn.debug })
       ] }),
       turn.artifacts && turn.artifacts.length > 0 && /* @__PURE__ */ jsx("div", { className: classes.artifacts, children: renderSlot(
         slots?.artifacts,
@@ -7836,7 +7912,7 @@ function AssistantTurnView({
   hideTimestamp,
   allowRegenerate = true
 }) {
-  const { debugMode, debugLimits } = useChatSession();
+  const { debugMode } = useChatSession();
   const { handleCopy, handleRegenerate, pendingQuestion, sendMessage: sendMessage2, loading } = useChatMessaging();
   const assistantTurn = turn.assistantTurn;
   if (!assistantTurn) {
@@ -7871,8 +7947,7 @@ function AssistantTurnView({
       hideAvatar,
       hideActions,
       hideTimestamp,
-      showDebug: debugMode,
-      debugLimits
+      showDebug: debugMode
     }
   );
 }
@@ -9017,6 +9092,36 @@ function DebugStatsPanel({ debugSessionUsage, debugLimits }) {
     ] })
   ] });
 }
+var EFFORT_LABEL_KEYS = {
+  low: "BiChat.Input.ReasoningEffortLow",
+  medium: "BiChat.Input.ReasoningEffortMedium",
+  high: "BiChat.Input.ReasoningEffortHigh",
+  xhigh: "BiChat.Input.ReasoningEffortXHigh"
+};
+function ReasoningEffortSelector({ options, value, onChange, disabled }) {
+  const { t } = useTranslation();
+  const selected = value || options[1] || options[0];
+  const label = t("BiChat.Input.ReasoningEffort");
+  return /* @__PURE__ */ jsxs("div", { className: "flex-shrink-0 self-center flex items-center gap-1.5", children: [
+    /* @__PURE__ */ jsx("span", { className: "text-[10px] text-gray-400 dark:text-gray-500 font-medium whitespace-nowrap select-none", children: label }),
+    /* @__PURE__ */ jsx(
+      "select",
+      {
+        value: selected,
+        disabled,
+        onChange: (event) => onChange(event.target.value),
+        className: [
+          "cursor-pointer h-8 rounded-lg border border-gray-200 dark:border-gray-600",
+          "bg-gray-50 dark:bg-gray-700/50 px-2.5 text-[11px] font-medium leading-none",
+          "text-gray-700 dark:text-gray-200 focus:outline-none focus:ring-2 focus:ring-primary-500/25",
+          "disabled:opacity-40 disabled:cursor-not-allowed"
+        ].join(" "),
+        "aria-label": label,
+        children: options.map((opt) => /* @__PURE__ */ jsx("option", { value: opt, children: t(EFFORT_LABEL_KEYS[opt] ?? opt) }, opt))
+      }
+    )
+  ] });
+}
 var MAX_FILES_DEFAULT = 10;
 var MAX_FILE_SIZE_DEFAULT = 20 * 1024 * 1024;
 var MAX_HEIGHT = 192;
@@ -9043,7 +9148,10 @@ var MessageInput = forwardRef(
     maxFiles = MAX_FILES_DEFAULT,
     maxFileSize = MAX_FILE_SIZE_DEFAULT,
     containerClassName,
-    formClassName
+    formClassName,
+    reasoningEffortOptions,
+    reasoningEffort,
+    onReasoningEffortChange
   }, ref) => {
     const { t } = useTranslation();
     const [attachments, setAttachments] = useState([]);
@@ -9492,16 +9600,25 @@ var MessageInput = forwardRef(
                           "aria-label": t("BiChat.Input.MessageInput")
                         }
                       ) }),
+                      reasoningEffortOptions && reasoningEffortOptions.length > 0 && onReasoningEffortChange && /* @__PURE__ */ jsx(
+                        ReasoningEffortSelector,
+                        {
+                          options: reasoningEffortOptions,
+                          value: reasoningEffort,
+                          onChange: onReasoningEffortChange,
+                          disabled: disabled || loading
+                        }
+                      ),
                       isStreaming && onCancelStreaming ? /* @__PURE__ */ jsx(
                         "button",
                         {
                           type: "button",
                           onClick: onCancelStreaming,
                           disabled: disabled || fetching,
-                          className: "cursor-pointer flex-shrink-0 self-center p-2 rounded-lg bg-red-600 hover:bg-red-700 active:bg-red-800 active:scale-95 text-white shadow-sm transition-all disabled:opacity-40 disabled:cursor-not-allowed disabled:hover:bg-red-600",
+                          className: "cursor-pointer flex-shrink-0 self-center p-2 rounded-lg bg-gray-900 hover:bg-gray-800 active:bg-black active:scale-95 text-white shadow-sm transition-all dark:bg-gray-100 dark:hover:bg-gray-200 dark:active:bg-white dark:text-gray-900 disabled:opacity-40 disabled:cursor-not-allowed",
                           "aria-label": t("BiChat.Common.Cancel"),
                           title: t("BiChat.Common.Cancel"),
-                          children: /* @__PURE__ */ jsx(X, { size: 18, weight: "bold" })
+                          children: /* @__PURE__ */ jsx(Stop, { size: 18, weight: "fill" })
                         }
                       ) : /* @__PURE__ */ jsx(
                         "button",
@@ -11691,7 +11808,9 @@ function ChatSessionCore({
     debugLimits,
     currentSessionId,
     setError,
-    retryFetchSession
+    retryFetchSession,
+    reasoningEffort,
+    setReasoningEffort
   } = useChatSession();
   const {
     turns,
@@ -11719,6 +11838,7 @@ function ChatSessionCore({
   const accessReadOnly = session?.access ? !session.access.canWrite : false;
   const effectiveReadOnly = Boolean(readOnly ?? isReadOnly) || isArchived || accessReadOnly;
   const [restoring, setRestoring] = useState(false);
+  const [reasoningEffortOptions] = useState(() => readReasoningEffortOptionsFromGlobalContext());
   const handleRestore = useCallback(async () => {
     if (!session?.id) {
       return;
@@ -11986,7 +12106,10 @@ function ChatSessionCore({
                     onUpdateQueueItem: updateQueueItem,
                     onCancelStreaming: cancel,
                     containerClassName: "pt-6 px-6",
-                    formClassName: "mx-auto"
+                    formClassName: "mx-auto",
+                    reasoningEffortOptions,
+                    reasoningEffort,
+                    onReasoningEffortChange: setReasoningEffort
                   }
                 ),
                 /* @__PURE__ */ jsx("p", { className: "mt-4 pb-1 text-center text-xs text-gray-500 dark:text-gray-400", children: t("BiChat.Welcome.Disclaimer") })
@@ -12042,7 +12165,10 @@ function ChatSessionCore({
                     onUnqueue: handleUnqueue,
                     onRemoveQueueItem: removeQueueItem,
                     onUpdateQueueItem: updateQueueItem,
-                    onCancelStreaming: cancel
+                    onCancelStreaming: cancel,
+                    reasoningEffortOptions,
+                    reasoningEffort,
+                    onReasoningEffortChange: setReasoningEffort
                   }
                 )
               ] }) }),
@@ -18574,6 +18700,9 @@ async function* sendMessage(deps, sessionId, content, attachments = [], signal,
       replaceFromMessageId: options?.replaceFromMessageID,
       attachments: streamAttachments
     };
+    if (options?.reasoningEffort) {
+      payload.reasoningEffort = options.reasoningEffort;
+    }
     const timeoutMs = deps.streamConnectTimeoutMs ?? 0;
     if (timeoutMs > 0) {
       connectionTimeoutID = setTimeout(() => {