local-operator-ui 0.12.3 → 0.12.4

package/out/renderer/assets/{index-gGvrtoJX.js → index-C4NwO8de.js}

@@ -1,4 +1,4 @@
-const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["./index-Bz9i7Cd8.js","./fonts-DqkQ6BY5.js","./fonts-CM-VN_uu.css","./index-kCiyjU-8.js","./pug-By0kVCfm.js","./javascript-C3MnDRiU.js","./dagre-OKDRZEBW-BT5Skj91.js","./graph-D872quDZ.js","./_baseUniq-DVHyzMWx.js","./layout-e8Y1M0Nl.js","./_basePickBy-D_lB49Nw.js","./clone-DwRww_yE.js","./c4Diagram-VJAJSXHY-f9fZ76vg.js","./chunk-D6G4REZN-B4s3i2fv.js","./flowDiagram-4HSFHLVR-DCXlt-VL.js","./chunk-RZ5BOZE2-BtZxEqZj.js","./channel-DDua3gpf.js","./erDiagram-Q7BY3M3F-CbXbwJWU.js","./gitGraphDiagram-7IBYFJ6S-05jpnuDv.js","./chunk-4BMEZGHF-BImCYdva.js","./chunk-XZIHB7SX-mUnOuu-C.js","./radar-MK3ICKWK-DDcxEZev.js","./ganttDiagram-APWFNJXF-ByRCNFDO.js","./infoDiagram-PH2N3AL5-BpYJVAYI.js","./pieDiagram-IB7DONF6-DaslafX0.js","./arc-Cz0FYAxj.js","./quadrantDiagram-7GDLP6J5-DSgptiHP.js","./xychartDiagram-VJFVF3MP-BpNk-8_j.js","./requirementDiagram-KVF5MWMF-DK6InPeo.js","./sequenceDiagram-X6HHIX6F-BDt_f_hQ.js","./classDiagram-GIVACNV2-BSvSEfYr.js","./chunk-A2AXSNBT-Duouqy8R.js","./classDiagram-v2-COTLJTTW-BSvSEfYr.js","./stateDiagram-DGXRK772-vXoCogWI.js","./chunk-AEK57VVT-ug6WkgVp.js","./stateDiagram-v2-YXO3MK2T-OXX9BIpM.js","./journeyDiagram-U35MCT3I-CX7f5NLJ.js","./timeline-definition-BDJGKUSR-Br6iVGoQ.js","./mindmap-definition-ALO5MXBD-BiKEPoOD.js","./cytoscape.esm-C0AOj4uS.js","./kanban-definition-NDS4AKOZ-b906EDwu.js","./sankeyDiagram-QLVOVGJD-DZTaN53O.js","./diagram-VNBRO52H-DYNE5bP-.js","./diagram-SSKATNLV-CARCGGp8.js","./blockDiagram-JOT3LUYC-CU6r8dcw.js","./architectureDiagram-IEHRJDOE-C4ktN37D.js"])))=>i.map(i=>d[i]);
+const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["./index-CtrEBFNz.js","./fonts-DqkQ6BY5.js","./fonts-CM-VN_uu.css","./index-B4xrtp2Z.js","./pug-By0kVCfm.js","./javascript-C3MnDRiU.js","./dagre-OKDRZEBW-DZOFGtWs.js","./graph-P5xyWsnt.js","./_baseUniq-CVF81xU9.js","./layout-Bep2Ed3s.js","./_basePickBy-D-mTy0T7.js","./clone-D4Ah0_EU.js","./c4Diagram-VJAJSXHY-B8ZTZ0n8.js","./chunk-D6G4REZN-_hQRwF7v.js","./flowDiagram-4HSFHLVR-tRJWBVYd.js","./chunk-RZ5BOZE2-Vl3-h4SG.js","./channel-BQBOXiqs.js","./erDiagram-Q7BY3M3F-CfYzgE98.js","./gitGraphDiagram-7IBYFJ6S-Cd11pFbi.js","./chunk-4BMEZGHF-BCTXK4C0.js","./chunk-XZIHB7SX-C61iNqnQ.js","./radar-MK3ICKWK-BIBBEO8S.js","./ganttDiagram-APWFNJXF-BWG5VLyZ.js","./infoDiagram-PH2N3AL5-KjJg15gx.js","./pieDiagram-IB7DONF6-C7Crt4gw.js","./arc-BcZxubla.js","./quadrantDiagram-7GDLP6J5-BMbHGD_6.js","./xychartDiagram-VJFVF3MP-DD0agc1N.js","./requirementDiagram-KVF5MWMF-BumPivJk.js","./sequenceDiagram-X6HHIX6F-CwnYTtil.js","./classDiagram-GIVACNV2-CNcNWb-o.js","./chunk-A2AXSNBT-Dt4gXQBd.js","./classDiagram-v2-COTLJTTW-CNcNWb-o.js","./stateDiagram-DGXRK772-4yXBR_vP.js","./chunk-AEK57VVT-CAAj-J2-.js","./stateDiagram-v2-YXO3MK2T-6p7BdIAB.js","./journeyDiagram-U35MCT3I-Dp2FVK6h.js","./timeline-definition-BDJGKUSR-CCdgMyc-.js","./mindmap-definition-ALO5MXBD-DiLxGufv.js","./cytoscape.esm-C0AOj4uS.js","./kanban-definition-NDS4AKOZ-cttuutf_.js","./sankeyDiagram-QLVOVGJD-D1LzUzj2.js","./diagram-VNBRO52H-DUz0a2Uz.js","./diagram-SSKATNLV-DGVbLzJc.js","./blockDiagram-JOT3LUYC-DIjqxpHX.js","./architectureDiagram-IEHRJDOE-0JBfW8n9.js"])))=>i.map(i=>d[i]);
 import { i as createStyled, l as resolveProps, m as useTheme, n as useTheme$1, r as reactExports, o as React, p as useEnhancedEffect$1, q as clsx, t as useForkRef$1, v as extendSxProp, j as jsxRuntimeExports, w as handleBreakpoints, x as resolveBreakpointValues, y as createUnarySpacing, z as deepmerge, A as mergeBreakpointsInOrder, F as composeClasses$1, G as generateUtilityClass$1, I as createTheme$1, J as getValue$1, h as React$1, K as requireReactDom, g as getDefaultExportFromCjs, L as defaultTheme$2, M as THEME_ID, N as generateUtilityClasses$1, O as useDefaultProps, s as styled$1, P as capitalize$1, Q as memoTheme, _ as _inheritsLoose, S as _objectWithoutPropertiesLoose$k, U as TransitionGroupContext, V as _extends$w, W as duration, u as useTheme$2, X as useTimeout$1, Y as useId$1, Z as ButtonBase, b as alpha$1, $ as createSimplePaletteValueFilter, a0 as CircularProgress, a1 as Paper, a2 as darken$1, a3 as lighten$1, a4 as useEventCallback$1, a5 as useRtl, a6 as globalCss, a7 as formatMuiErrorMessage$1, a8 as rootShouldForwardProp, T as Typography, a9 as css$1, k as keyframes, aa as getPath$2, ab as isFocusVisible, ac as typographyClasses, ad as slotShouldForwardProp, ae as clamp$1, af as emphasize, ag as Timeout$1, c as createLucideIcon, a as Button, B as Box, ah as FontAwesomeIcon, ai as faExclamationTriangle, D as DEFAULT_THEME, aj as faChevronLeft, ak as faChevronRight, al as faRobot, am as faCheck, an as faTimes, ao as faEraser, ap as faPen, aq as faFileImport, ar as faUpload, as as GlobalStyles, at as requireReact, au as faComment, av as faSave, aw as faEdit, ax as faTrashAlt, ay as faInfoCircle, az as faGear, aA as faPlus, aB as faServer, aC as faStar, aD as faTag, aE as faIdCard, aF as faCalendarAlt, aG as faCodeBranch, aH as faShieldAlt, aI as faArrowLeft, aJ as faClock, C as Code, aK as faHome, aL as faDownload, aM as faFileAlt, aN as faDesktop, aO as faImage, aP as faMusic, aQ as faVideo, aR as faLaptop, aS as faUsers, aT as faDatabase, aU as faBoxOpen, aV as faBook, aW as faHdd, aX as faBox, aY as faArchive, aZ as faNetworkWired, a_ as faFolder, a$ as faFolderOpen, b0 as faFolderTree, b1 as faFile, b2 as faCode, b3 as faSliders, b4 as faTrash, b5 as faArrowDown, b6 as faPaperclip, b7 as faPaperPlane, b8 as faExclamationCircle, b9 as faChevronDown, ba as isDevelopmentMode, bb as faCommentSlash, bc as faArrowRight, bd as faBrain, be as faWandMagicSparkles, bf as faExternalLinkAlt, bg as faKey, bh as radientTheme, bi as faGlobe, bj as faSearch, bk as PropTypes, bl as shouldForwardProp, bm as TransitionGroup, bn as commonjsGlobal, bo as faLock, bp as faPuzzlePiece, H as HardDrive, bq as faSignOut, br as themes$1, bs as faMoon, bt as faSun, bu as faHexagonNodes, bv as faSkull, bw as faLeaf, bx as faMountain, by as faFire, bz as faIcicles, bA as faBolt, bB as faAdjust, bC as faWaveSquare, bD as faUser, bE as faEnvelope, bF as faHistory, bG as faListAlt, bH as faCreditCard, bI as faPlusCircle, bJ as faChartLine, bK as faShield, bL as library$1, bM as icons$1, f as CssBaseline, e as ThemeProvider$1, d as getTheme, R as ReactDOM$1, E as ErrorBoundary } from "./fonts-DqkQ6BY5.js";
 const styled = createStyled();
 function getThemeProps(params) {
@@ -89889,7 +89889,7 @@ const languages = [
     name: "Go",
     extensions: ["go"],
     load() {
-      return __vitePreload(() => import("./index-Bz9i7Cd8.js"), true ? __vite__mapDeps([0,1,2]) : void 0, import.meta.url).then((m2) => m2.go());
+      return __vitePreload(() => import("./index-CtrEBFNz.js"), true ? __vite__mapDeps([0,1,2]) : void 0, import.meta.url).then((m2) => m2.go());
     }
   }),
   /* @__PURE__ */ LanguageDescription.of({
@@ -90066,7 +90066,7 @@ const languages = [
     alias: ["yml"],
     extensions: ["yaml", "yml"],
     load() {
-      return __vitePreload(() => import("./index-kCiyjU-8.js"), true ? __vite__mapDeps([3,1,2]) : void 0, import.meta.url).then((m2) => m2.yaml());
+      return __vitePreload(() => import("./index-B4xrtp2Z.js"), true ? __vite__mapDeps([3,1,2]) : void 0, import.meta.url).then((m2) => m2.yaml());
     }
   }),
   // Legacy modes ported from CodeMirror 5
@@ -129102,7 +129102,7 @@ const ReviewHeader = styled$1(Box)(({ theme: theme2 }) => ({
   justifyContent: "space-between",
   padding: theme2.spacing(0.5, 2, 1, 1),
   gap: theme2.spacing(1),
-  height: "64px"
+  minHeight: "64px"
 }));
 const ReviewPrompt = styled$1(Typography)(({ theme: theme2 }) => ({
   flexGrow: 1,
@@ -129135,7 +129135,6 @@ const InlineEdit = ({
   const mediaRecorderRef = reactExports.useRef(null);
   const audioChunksRef = reactExports.useRef([]);
   const [platform, setPlatform] = reactExports.useState("");
-  const fileInputRef = reactExports.useRef(null);
   const textareaRef = reactExports.useRef(null);
   const isCancelledRef = reactExports.useRef(false);
   const containerRef = reactExports.useRef(null);
@@ -129343,22 +129342,18 @@ const InlineEdit = ({
       !isLoading && !isRecording && !isTranscribing && canEnableRecordingFeature
     )
   );
-  const triggerFileInput = () => {
-    fileInputRef.current?.click();
-  };
-  const handleFileSelect = (e3) => {
-    if (e3.target.files && e3.target.files.length > 0) {
-      const newAttachments = Array.from(e3.target.files).map((file) => {
-        const filePath2 = file.name;
-        if (filePath2) {
-          return normalizePath(filePath2);
-        }
-        return URL.createObjectURL(file);
-      });
-      setAttachments((prev2) => [...prev2, ...newAttachments]);
-      if (fileInputRef.current) {
-        fileInputRef.current.value = "";
+  const handleAttachFile = async () => {
+    const result = await window.electron.ipcRenderer.invoke(
+      "show-open-dialog",
+      {
+        properties: ["openFile", "multiSelections"]
       }
+    );
+    if (!result.canceled && result.filePaths.length > 0) {
+      const newAttachments = result.filePaths.map(
+        (path2) => normalizePath(path2)
+      );
+      setAttachments((prev2) => [...prev2, ...newAttachments]);
     }
   };
   const handleRemoveAttachment = (index2) => {
@@ -129575,27 +129570,14 @@ const InlineEdit = ({
             }
           ),
           /* @__PURE__ */ jsxRuntimeExports.jsxs(ButtonsRow$1, { children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { display: "flex", alignItems: "center", gap: 1, children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx(
-                "input",
-                {
-                  type: "file",
-                  ref: fileInputRef,
-                  onChange: handleFileSelect,
-                  style: { display: "none" },
-                  disabled: isLoading || isRecording || isTranscribing,
-                  multiple: true
-                }
-              ),
-              /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip$1, { title: "Add attachments", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                AttachmentButton$1,
-                {
-                  onClick: triggerFileInput,
-                  disabled: isLoading || isRecording || isTranscribing || !!reviewState,
-                  children: /* @__PURE__ */ jsxRuntimeExports.jsx(Paperclip, { size: iconSize })
-                }
-              ) })
-            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(Box, { display: "flex", alignItems: "center", gap: 1, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip$1, { title: "Add attachments", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+              AttachmentButton$1,
+              {
+                onClick: handleAttachFile,
+                disabled: isLoading || isRecording || isTranscribing || !!reviewState,
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(Paperclip, { size: iconSize })
+              }
+            ) }) }),
             /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { display: "flex", alignItems: "center", gap: 1, children: [
               !isRecording && !isTranscribing && !isLoading && /* @__PURE__ */ jsxRuntimeExports.jsx(
                 Tooltip$1,
@@ -227631,7 +227613,7 @@ const InsertImageDialog = ({
   onInsert
 }) => {
   const theme2 = useTheme$2();
-  const [url, setUrl] = reactExports.useState("");
+  const [path2, setPath] = reactExports.useState("");
   const handleFile = reactExports.useCallback(
     (file) => {
       const reader = new FileReader();
@@ -227666,18 +227648,18 @@ const InsertImageDialog = ({
       handleFile(file);
     }
   };
-  const handleInsertFromUrl = () => {
-    if (url) {
-      onInsert(url);
+  const handleInsertFromPath = () => {
+    if (path2) {
+      onInsert(path2);
       onClose();
-      setUrl("");
+      setPath("");
     }
   };
   const handleKeyDown = (e3) => {
     if (e3.key === "Enter") {
       e3.preventDefault();
-      if (url.trim()) {
-        handleInsertFromUrl();
+      if (path2.trim()) {
+        handleInsertFromPath();
       }
     }
   };
@@ -227713,7 +227695,7 @@ const InsertImageDialog = ({
       fullWidth: true,
       children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { sx: { pt: 2 }, children: [
         /* @__PURE__ */ jsxRuntimeExports.jsxs(FieldContainer$1, { children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx(FieldLabel$7, { children: "Image URL" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(FieldLabel$7, { children: "Image Path on Device" }),
           /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { sx: { display: "flex", gap: 1, alignItems: "center" }, children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx(
               StyledTextField$4,
@@ -227721,24 +227703,24 @@ const InsertImageDialog = ({
                 autoFocus: true,
                 fullWidth: true,
                 variant: "outlined",
-                type: "url",
-                placeholder: "https://example.com/image.jpg",
-                value: url,
-                onChange: (e3) => setUrl(e3.target.value),
+                type: "text",
+                placeholder: "/Users/eren/Documents/image.png",
+                value: path2,
+                onChange: (e3) => setPath(e3.target.value),
                 onKeyDown: handleKeyDown,
                 InputProps: {
-                  startAdornment: /* @__PURE__ */ jsxRuntimeExports.jsx(InputAdornment, { position: "start", sx: { paddingLeft: 1 }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Link, { size: 16 }) })
+                  startAdornment: /* @__PURE__ */ jsxRuntimeExports.jsx(InputAdornment, { position: "start", sx: { paddingLeft: 1 }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(File$1, { size: 16 }) })
                 }
               }
             ),
             /* @__PURE__ */ jsxRuntimeExports.jsx(
               Button,
               {
-                onClick: handleInsertFromUrl,
+                onClick: handleInsertFromPath,
                 variant: "contained",
                 color: "primary",
                 size: "small",
-                disabled: !url.trim(),
+                disabled: !path2.trim(),
                 sx: {
                   textTransform: "none",
                   fontSize: "0.8125rem",
@@ -228251,7 +228233,8 @@ const EditorContainer = styled$1(Paper)(({ theme: theme2 }) => ({
   width: "100%",
   overflow: "hidden",
   backgroundColor: theme2.palette.background.paper,
-  border: `1px solid ${theme2.palette.divider}`
+  borderRadius: "0px",
+  border: "none"
 }));
 const EditorToolbar = styled$1(Toolbar)(({ theme: theme2 }) => ({
   minHeight: "48px !important",
@@ -228942,15 +228925,27 @@ const WysiwygMarkdownEditorComponent = ({
     [executeCommand, handleContentChange]
   );
   const insertImage = reactExports.useCallback(() => {
+    const selection2 = window.getSelection();
+    if (selection2?.rangeCount) {
+      selectionRef.current = selection2.getRangeAt(0).cloneRange();
+    }
     setIsImageDialogOpen(true);
   }, []);
   const handleInsertImage = reactExports.useCallback(
     (url) => {
+      editorRef.current?.focus();
+      const selection2 = window.getSelection();
+      if (!selection2) return;
+      if (selectionRef.current) {
+        selection2.removeAllRanges();
+        selection2.addRange(selectionRef.current);
+      }
       if (url) {
         executeCommand("insertImage", url);
       }
+      handleContentChange();
     },
-    [executeCommand]
+    [executeCommand, handleContentChange]
   );
   const insertTable = reactExports.useCallback((event) => {
     const selection2 = window.getSelection();
@@ -232387,6 +232382,8 @@ const ChatHeader = ({
 }) => {
   const setCanvasOpen = useUiPreferencesStore((s2) => s2.setCanvasOpen);
   const isCanvasOpen = useUiPreferencesStore((s2) => s2.isCanvasOpen);
+  const isMac = navigator.platform.toUpperCase().indexOf("MAC") >= 0;
+  const shortcut = isMac ? "⌘+Shift+C" : "Ctrl+Shift+C";
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(
     Box,
     {
@@ -232445,7 +232442,7 @@ const ChatHeader = ({
             }
           )
         ] }),
-        onOpenOptions && !isCanvasOpen && /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip$1, { title: "Open Canvas", arrow: true, placement: "top", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+        onOpenOptions && !isCanvasOpen && /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip$1, { title: `Open Canvas (${shortcut})`, arrow: true, placement: "top", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
           OptionsButton,
           {
             onClick: () => setCanvasOpen(true),
@@ -233445,7 +233442,6 @@ const MessageInput = reactExports.forwardRef(
     const mediaRecorderRef = reactExports.useRef(null);
     const audioChunksRef = reactExports.useRef([]);
     const [platform, setPlatform] = reactExports.useState("");
-    const fileInputRef = reactExports.useRef(null);
     const { data: credentialsData, isLoading: isLoadingCredentials } = useCredentials();
     const isRadientApiKeyConfigured = reactExports.useMemo(
       () => credentialsData?.keys?.includes("RADIENT_API_KEY"),
@@ -233647,32 +233643,28 @@ ${message2}`;
       if (!newMessage.trim() && attachments.length === 0) return;
       submitMessage();
     };
-    const handleFileSelect = (e3) => {
-      if (e3.target.files && e3.target.files.length > 0) {
-        const newAttachments = Array.from(e3.target.files).map((file) => {
-          const filePath = file.name;
-          if (filePath) {
-            return normalizePath(filePath);
-          }
-          return URL.createObjectURL(file);
-        });
-        if (conversationId) {
-          for (const path2 of newAttachments) {
-            addAttachment(conversationId, { id: v4(), path: path2 });
-          }
-        }
-        if (fileInputRef.current) {
-          fileInputRef.current.value = "";
-        }
-      }
-    };
     const handleRemoveAttachment = (id27) => {
       if (conversationId) {
         removeAttachment(conversationId, id27);
       }
     };
-    const triggerFileInput = () => {
-      fileInputRef.current?.click();
+    const handleAttachFile = async () => {
+      const result = await window.electron.ipcRenderer.invoke(
+        "show-open-dialog",
+        {
+          properties: ["openFile", "multiSelections"]
+        }
+      );
+      if (!result.canceled && result.filePaths.length > 0) {
+        if (conversationId) {
+          for (const path2 of result.filePaths) {
+            addAttachment(conversationId, {
+              id: v4(),
+              path: normalizePath(path2)
+            });
+          }
+        }
+      }
     };
     const handlePaste = (event) => {
       const items = event.clipboardData?.items;
@@ -233720,157 +233712,150 @@ ${message2}`;
     };
     const iconSize = isSmallView ? 16 : 18;
     const inputContent = /* @__PURE__ */ jsxRuntimeExports.jsxs("form", { onSubmit: handleSubmit, style: { width: "100%" }, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsxs(InputInnerContainer, { isSmallView, children: [
-        replies.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(ReplyPreview, { replies, onRemoveReply: handleRemoveReply }),
-        attachments.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(
-          AttachmentsPreview,
-          {
-            attachments: attachments.map((a2) => a2.path),
-            onRemoveAttachment: (index2) => handleRemoveAttachment(attachments[index2].id),
-            disabled: isInputDisabled || isRecording || isTranscribing
-          }
-        ),
-        isRecording ? /* @__PURE__ */ jsxRuntimeExports.jsx(AudioRecordingIndicator, { isRecording }) : isTranscribing ? /* @__PURE__ */ jsxRuntimeExports.jsxs(TranscriptionIndicator, { children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx(TranscriptionText, { variant: "body2", children: "Processing audio" }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(WaveformAnimation, {})
-        ] }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
-          StyledTextField$2,
-          {
-            fullWidth: true,
-            placeholder: isInputDisabled ? "Agent is busy" : "Ask me for help",
-            isSmallView,
-            value: newMessage,
-            onChange: (e3) => setNewMessage(e3.target.value),
-            onKeyDown: handleKeyDown,
-            onPaste: handlePaste,
-            multiline: true,
-            maxRows: 4,
-            variant: "outlined",
-            inputRef: textareaRef,
-            disabled: isInputDisabled,
-            inputProps: {
-              "data-tour-tag": "chat-input-textarea"
-            }
-          }
-        ),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs(ButtonsRow, { children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { display: "flex", alignItems: "center", gap: 1, children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx(
-              "input",
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(
+        InputInnerContainer,
+        {
+          isSmallView,
+          "data-tour-tag": "chat-input-textarea",
+          children: [
+            replies.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(ReplyPreview, { replies, onRemoveReply: handleRemoveReply }),
+            attachments.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(
+              AttachmentsPreview,
               {
-                type: "file",
-                ref: fileInputRef,
-                onChange: handleFileSelect,
-                style: { display: "none" },
-                disabled: isInputDisabled || isRecording || isTranscribing,
-                multiple: true
+                attachments: attachments.map((a2) => a2.path),
+                onRemoveAttachment: (index2) => handleRemoveAttachment(attachments[index2].id),
+                disabled: isInputDisabled || isRecording || isTranscribing
               }
             ),
-            /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip$1, { title: "Attach file", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-              AttachmentButton,
+            isRecording ? /* @__PURE__ */ jsxRuntimeExports.jsx(AudioRecordingIndicator, { isRecording }) : isTranscribing ? /* @__PURE__ */ jsxRuntimeExports.jsxs(TranscriptionIndicator, { children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(TranscriptionText, { variant: "body2", children: "Processing audio" }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx(WaveformAnimation, {})
+            ] }) : /* @__PURE__ */ jsxRuntimeExports.jsx(
+              StyledTextField$2,
               {
-                onClick: triggerFileInput,
-                color: "primary",
-                size: "small",
-                "aria-label": "Attach file",
-                "data-tour-tag": "chat-input-attach-file-button",
-                disabled: isInputDisabled || isRecording || isTranscribing,
+                fullWidth: true,
+                placeholder: isInputDisabled ? "Agent is busy" : "Ask me for help",
                 isSmallView,
-                children: /* @__PURE__ */ jsxRuntimeExports.jsx(FontAwesomeIcon, { icon: faPaperclip, fontSize: iconSize })
-              }
-            ) }) }),
-            conversationId && /* @__PURE__ */ jsxRuntimeExports.jsx(
-              DirectoryIndicator,
-              {
-                agentId: conversationId,
-                currentWorkingDirectory: agentData?.current_working_directory
+                value: newMessage,
+                onChange: (e3) => setNewMessage(e3.target.value),
+                onKeyDown: handleKeyDown,
+                onPaste: handlePaste,
+                multiline: true,
+                maxRows: 4,
+                variant: "outlined",
+                inputRef: textareaRef,
+                disabled: isInputDisabled
               }
-            )
-          ] }),
-          /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { display: "flex", alignItems: "center", gap: 1, children: [
-            !isRecording && !isTranscribing && !(isLoading && currentJobId) && /* @__PURE__ */ jsxRuntimeExports.jsx(
-              Tooltip$1,
-              {
-                title: !canEnableRecordingFeature ? "Sign in to Radient in the settings page to enable audio recording" : `Start recording (${shortcutText} or hold Space)`,
-                children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                  IconButton,
+            ),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs(ButtonsRow, { children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { display: "flex", alignItems: "center", gap: 1, children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip$1, { title: "Attach file", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  AttachmentButton,
                   {
-                    onClick: handleStartRecording,
+                    onClick: handleAttachFile,
                     color: "primary",
                     size: "small",
-                    "aria-label": "Start recording",
-                    disabled: isLoading || !canEnableRecordingFeature,
-                    children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                      Mic,
+                    "aria-label": "Attach file",
+                    "data-tour-tag": "chat-input-attach-file-button",
+                    disabled: isInputDisabled || isRecording || isTranscribing,
+                    isSmallView,
+                    children: /* @__PURE__ */ jsxRuntimeExports.jsx(FontAwesomeIcon, { icon: faPaperclip, fontSize: iconSize })
+                  }
+                ) }) }),
+                conversationId && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  DirectoryIndicator,
+                  {
+                    agentId: conversationId,
+                    currentWorkingDirectory: agentData?.current_working_directory
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxRuntimeExports.jsxs(Box, { display: "flex", alignItems: "center", gap: 1, children: [
+                !isRecording && !isTranscribing && !(isLoading && currentJobId) && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  Tooltip$1,
+                  {
+                    title: !canEnableRecordingFeature ? "Sign in to Radient in the settings page to enable audio recording" : `Start recording (${shortcutText} or hold Space)`,
+                    children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      IconButton,
                       {
-                        size: iconSize * 1.1,
-                        style: {
-                          width: iconSize * 1.4,
-                          height: iconSize * 1.4,
-                          padding: "2px"
-                        }
+                        onClick: handleStartRecording,
+                        color: "primary",
+                        size: "small",
+                        "aria-label": "Start recording",
+                        disabled: isLoading || !canEnableRecordingFeature,
+                        children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                          Mic,
+                          {
+                            size: iconSize * 1.1,
+                            style: {
+                              width: iconSize * 1.4,
+                              height: iconSize * 1.4,
+                              padding: "2px"
+                            }
+                          }
+                        )
                       }
-                    )
+                    ) })
                   }
-                ) })
-              }
-            ),
-            isRecording && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip$1, { title: "Confirm recording (Enter)", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                IconButton,
-                {
-                  onClick: handleConfirmRecording,
-                  color: "success",
-                  size: "small",
-                  "aria-label": "Confirm recording",
-                  disabled: isLoading,
-                  children: /* @__PURE__ */ jsxRuntimeExports.jsx(Check, { size: iconSize })
-                }
-              ) }) }),
-              /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip$1, { title: "Cancel recording (Esc)", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                IconButton,
-                {
-                  onClick: handleCancelRecording,
-                  color: "error",
-                  size: "small",
-                  "aria-label": "Cancel recording",
-                  disabled: isLoading,
-                  children: /* @__PURE__ */ jsxRuntimeExports.jsx(X$2, { size: iconSize })
-                }
-              ) }) })
-            ] }),
-            isLoading && currentJobId ? /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip$1, { title: "Stop agent", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-              SendButton,
-              {
-                type: "button",
-                variant: "contained",
-                color: "error",
-                onClick: () => onCancelJob?.(currentJobId),
-                "aria-label": "Stop agent",
-                isSmallView,
-                children: /* @__PURE__ */ jsxRuntimeExports.jsx(Square, { size: iconSize })
-              }
-            ) }) }) : !isRecording && !isTranscribing && /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip$1, { title: "Send message", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-              SendButton,
-              {
-                type: "submit",
-                variant: "contained",
-                color: "primary",
-                disabled: isLoading || !newMessage.trim() && attachments.length === 0,
-                "aria-label": "Send message",
-                isSmallView,
-                children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-                  FontAwesomeIcon,
+                ),
+                isRecording && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip$1, { title: "Confirm recording (Enter)", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                    IconButton,
+                    {
+                      onClick: handleConfirmRecording,
+                      color: "success",
+                      size: "small",
+                      "aria-label": "Confirm recording",
+                      disabled: isLoading,
+                      children: /* @__PURE__ */ jsxRuntimeExports.jsx(Check, { size: iconSize })
+                    }
+                  ) }) }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip$1, { title: "Cancel recording (Esc)", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                    IconButton,
+                    {
+                      onClick: handleCancelRecording,
+                      color: "error",
+                      size: "small",
+                      "aria-label": "Cancel recording",
+                      disabled: isLoading,
+                      children: /* @__PURE__ */ jsxRuntimeExports.jsx(X$2, { size: iconSize })
+                    }
+                  ) }) })
+                ] }),
+                isLoading && currentJobId ? /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip$1, { title: "Stop agent", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  SendButton,
                   {
-                    icon: faPaperPlane,
-                    fontSize: iconSize * 0.8
+                    type: "button",
+                    variant: "contained",
+                    color: "error",
+                    onClick: () => onCancelJob?.(currentJobId),
+                    "aria-label": "Stop agent",
+                    isSmallView,
+                    children: /* @__PURE__ */ jsxRuntimeExports.jsx(Square, { size: iconSize })
                   }
-                )
-              }
-            ) }) })
-          ] })
-        ] })
-      ] }),
+                ) }) }) : !isRecording && !isTranscribing && /* @__PURE__ */ jsxRuntimeExports.jsx(Tooltip$1, { title: "Send message", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  SendButton,
+                  {
+                    type: "submit",
+                    variant: "contained",
+                    color: "primary",
+                    disabled: isLoading || !newMessage.trim() && attachments.length === 0,
+                    "aria-label": "Send message",
+                    isSmallView,
+                    children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                      FontAwesomeIcon,
+                      {
+                        icon: faPaperPlane,
+                        fontSize: iconSize * 0.8
+                      }
+                    )
+                  }
+                ) }) })
+              ] })
+            ] })
+          ]
+        }
+      ),
       messages.length === 0 && !isSmallView && /* @__PURE__ */ jsxRuntimeExports.jsx(SuggestionsContainer, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
         Box,
         {
@@ -273876,7 +273861,7 @@ var registerDefaultLayoutLoaders = /* @__PURE__ */ __name(() => {
   registerLayoutLoaders([
     {
       name: "dagre",
-      loader: /* @__PURE__ */ __name(async () => await __vitePreload(() => import("./dagre-OKDRZEBW-BT5Skj91.js"), true ? __vite__mapDeps([6,7,8,9,10,11,1,2]) : void 0, import.meta.url), "loader")
+      loader: /* @__PURE__ */ __name(async () => await __vitePreload(() => import("./dagre-OKDRZEBW-DZOFGtWs.js"), true ? __vite__mapDeps([6,7,8,9,10,11,1,2]) : void 0, import.meta.url), "loader")
     }
   ]);
 }, "registerDefaultLayoutLoaders");
@@ -274466,7 +274451,7 @@ var detector = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./c4Diagram-VJAJSXHY-f9fZ76vg.js");
+    const { diagram: diagram22 } = await import("./c4Diagram-VJAJSXHY-B8ZTZ0n8.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([12,13,1,2]) : void 0, import.meta.url);
   return { id, diagram: diagram2 };
@@ -274486,7 +274471,7 @@ var detector2 = /* @__PURE__ */ __name((txt, config2) => {
 }, "detector");
 var loader2 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./flowDiagram-4HSFHLVR-DCXlt-VL.js");
+    const { diagram: diagram22 } = await import("./flowDiagram-4HSFHLVR-tRJWBVYd.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([14,15,16,1,2]) : void 0, import.meta.url);
   return { id: id2, diagram: diagram2 };
@@ -274512,7 +274497,7 @@ var detector3 = /* @__PURE__ */ __name((txt, config2) => {
 }, "detector");
 var loader3 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./flowDiagram-4HSFHLVR-DCXlt-VL.js");
+    const { diagram: diagram22 } = await import("./flowDiagram-4HSFHLVR-tRJWBVYd.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([14,15,16,1,2]) : void 0, import.meta.url);
   return { id: id3, diagram: diagram2 };
@@ -274529,7 +274514,7 @@ var detector4 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader4 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./erDiagram-Q7BY3M3F-CbXbwJWU.js");
+    const { diagram: diagram22 } = await import("./erDiagram-Q7BY3M3F-CfYzgE98.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([17,15,16,1,2]) : void 0, import.meta.url);
   return { id: id4, diagram: diagram2 };
@@ -274546,7 +274531,7 @@ var detector5 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader5 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./gitGraphDiagram-7IBYFJ6S-05jpnuDv.js");
+    const { diagram: diagram22 } = await import("./gitGraphDiagram-7IBYFJ6S-Cd11pFbi.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([18,19,20,21,8,10,11,1,2]) : void 0, import.meta.url);
   return { id: id5, diagram: diagram2 };
@@ -274563,7 +274548,7 @@ var detector6 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader6 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./ganttDiagram-APWFNJXF-ByRCNFDO.js");
+    const { diagram: diagram22 } = await import("./ganttDiagram-APWFNJXF-BWG5VLyZ.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([22,1,2]) : void 0, import.meta.url);
   return { id: id6, diagram: diagram2 };
@@ -274580,7 +274565,7 @@ var detector7 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader7 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./infoDiagram-PH2N3AL5-BpYJVAYI.js");
+    const { diagram: diagram22 } = await import("./infoDiagram-PH2N3AL5-KjJg15gx.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([23,21,8,10,11,1,2]) : void 0, import.meta.url);
   return { id: id7, diagram: diagram2 };
@@ -274596,7 +274581,7 @@ var detector8 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader8 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./pieDiagram-IB7DONF6-DaslafX0.js");
+    const { diagram: diagram22 } = await import("./pieDiagram-IB7DONF6-C7Crt4gw.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([24,19,21,8,10,11,25,1,2]) : void 0, import.meta.url);
   return { id: id8, diagram: diagram2 };
@@ -274612,7 +274597,7 @@ var detector9 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader9 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./quadrantDiagram-7GDLP6J5-DSgptiHP.js");
+    const { diagram: diagram22 } = await import("./quadrantDiagram-7GDLP6J5-BMbHGD_6.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([26,1,2]) : void 0, import.meta.url);
   return { id: id9, diagram: diagram2 };
@@ -274629,7 +274614,7 @@ var detector10 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader10 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./xychartDiagram-VJFVF3MP-BpNk-8_j.js");
+    const { diagram: diagram22 } = await import("./xychartDiagram-VJFVF3MP-DD0agc1N.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([27,1,2]) : void 0, import.meta.url);
   return { id: id10, diagram: diagram2 };
@@ -274646,7 +274631,7 @@ var detector11 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader11 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./requirementDiagram-KVF5MWMF-DK6InPeo.js");
+    const { diagram: diagram22 } = await import("./requirementDiagram-KVF5MWMF-BumPivJk.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([28,15,1,2]) : void 0, import.meta.url);
   return { id: id11, diagram: diagram2 };
@@ -274663,7 +274648,7 @@ var detector12 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader12 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./sequenceDiagram-X6HHIX6F-BDt_f_hQ.js");
+    const { diagram: diagram22 } = await import("./sequenceDiagram-X6HHIX6F-CwnYTtil.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([29,13,20,1,2]) : void 0, import.meta.url);
   return { id: id12, diagram: diagram2 };
@@ -274683,7 +274668,7 @@ var detector13 = /* @__PURE__ */ __name((txt, config2) => {
 }, "detector");
 var loader13 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./classDiagram-GIVACNV2-BSvSEfYr.js");
+    const { diagram: diagram22 } = await import("./classDiagram-GIVACNV2-CNcNWb-o.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([30,31,15,1,2]) : void 0, import.meta.url);
   return { id: id13, diagram: diagram2 };
@@ -274703,7 +274688,7 @@ var detector14 = /* @__PURE__ */ __name((txt, config2) => {
 }, "detector");
 var loader14 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./classDiagram-v2-COTLJTTW-BSvSEfYr.js");
+    const { diagram: diagram22 } = await import("./classDiagram-v2-COTLJTTW-CNcNWb-o.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([32,31,15,1,2]) : void 0, import.meta.url);
   return { id: id14, diagram: diagram2 };
@@ -274723,7 +274708,7 @@ var detector15 = /* @__PURE__ */ __name((txt, config2) => {
 }, "detector");
 var loader15 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./stateDiagram-DGXRK772-vXoCogWI.js");
+    const { diagram: diagram22 } = await import("./stateDiagram-DGXRK772-4yXBR_vP.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([33,34,15,7,8,9,10,1,2]) : void 0, import.meta.url);
   return { id: id15, diagram: diagram2 };
@@ -274746,7 +274731,7 @@ var detector16 = /* @__PURE__ */ __name((txt, config2) => {
 }, "detector");
 var loader16 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./stateDiagram-v2-YXO3MK2T-OXX9BIpM.js");
+    const { diagram: diagram22 } = await import("./stateDiagram-v2-YXO3MK2T-6p7BdIAB.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([35,34,15,1,2]) : void 0, import.meta.url);
   return { id: id16, diagram: diagram2 };
@@ -274763,7 +274748,7 @@ var detector17 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader17 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./journeyDiagram-U35MCT3I-CX7f5NLJ.js");
+    const { diagram: diagram22 } = await import("./journeyDiagram-U35MCT3I-Dp2FVK6h.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([36,13,25,1,2]) : void 0, import.meta.url);
   return { id: id17, diagram: diagram2 };
@@ -274833,7 +274818,7 @@ var detector18 = /* @__PURE__ */ __name((txt, config2 = {}) => {
 }, "detector");
 var loader18 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./flowDiagram-4HSFHLVR-DCXlt-VL.js");
+    const { diagram: diagram22 } = await import("./flowDiagram-4HSFHLVR-tRJWBVYd.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([14,15,16,1,2]) : void 0, import.meta.url);
   return { id: id18, diagram: diagram2 };
@@ -274850,7 +274835,7 @@ var detector19 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader19 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./timeline-definition-BDJGKUSR-Br6iVGoQ.js");
+    const { diagram: diagram22 } = await import("./timeline-definition-BDJGKUSR-CCdgMyc-.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([37,25,1,2]) : void 0, import.meta.url);
   return { id: id19, diagram: diagram2 };
@@ -274867,7 +274852,7 @@ var detector20 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader20 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./mindmap-definition-ALO5MXBD-BiKEPoOD.js");
+    const { diagram: diagram22 } = await import("./mindmap-definition-ALO5MXBD-DiLxGufv.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([38,39,1,2]) : void 0, import.meta.url);
   return { id: id20, diagram: diagram2 };
@@ -274884,7 +274869,7 @@ var detector21 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader21 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./kanban-definition-NDS4AKOZ-b906EDwu.js");
+    const { diagram: diagram22 } = await import("./kanban-definition-NDS4AKOZ-cttuutf_.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([40,1,2]) : void 0, import.meta.url);
   return { id: id21, diagram: diagram2 };
@@ -274901,7 +274886,7 @@ var detector22 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader22 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./sankeyDiagram-QLVOVGJD-DZTaN53O.js");
+    const { diagram: diagram22 } = await import("./sankeyDiagram-QLVOVGJD-D1LzUzj2.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([41,1,2]) : void 0, import.meta.url);
   return { id: id22, diagram: diagram2 };
@@ -274918,7 +274903,7 @@ var detector23 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader23 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./diagram-VNBRO52H-DYNE5bP-.js");
+    const { diagram: diagram22 } = await import("./diagram-VNBRO52H-DUz0a2Uz.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([42,19,21,8,10,11,1,2]) : void 0, import.meta.url);
   return { id: id23, diagram: diagram2 };
@@ -274934,7 +274919,7 @@ var detector24 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader24 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./diagram-SSKATNLV-CARCGGp8.js");
+    const { diagram: diagram22 } = await import("./diagram-SSKATNLV-DGVbLzJc.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([43,19,21,8,10,11,1,2]) : void 0, import.meta.url);
   return { id: id24, diagram: diagram2 };
@@ -274950,7 +274935,7 @@ var detector25 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader25 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./blockDiagram-JOT3LUYC-CU6r8dcw.js");
+    const { diagram: diagram22 } = await import("./blockDiagram-JOT3LUYC-DIjqxpHX.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([44,11,8,7,16,1,2]) : void 0, import.meta.url);
   return { id: id25, diagram: diagram2 };
@@ -274967,7 +274952,7 @@ var detector26 = /* @__PURE__ */ __name((txt) => {
 }, "detector");
 var loader26 = /* @__PURE__ */ __name(async () => {
   const { diagram: diagram2 } = await __vitePreload(async () => {
-    const { diagram: diagram22 } = await import("./architectureDiagram-IEHRJDOE-C4ktN37D.js");
+    const { diagram: diagram22 } = await import("./architectureDiagram-IEHRJDOE-0JBfW8n9.js");
     return { diagram: diagram22 };
   }, true ? __vite__mapDeps([45,19,20,21,8,10,11,39,1,2]) : void 0, import.meta.url);
   return { id: id26, diagram: diagram2 };
@@ -317557,6 +317542,19 @@ const ChatPage = () => {
   const { agentId, navigateToAgent } = useAgentRouteParam();
   const navigate = useNavigate();
   const queryClient2 = useQueryClient();
+  const { isCanvasOpen, setCanvasOpen } = useUiPreferencesStore();
+  reactExports.useEffect(() => {
+    const handleKeyDown = (event) => {
+      if (event.key === "c" && (event.metaKey || event.ctrlKey) && event.shiftKey) {
+        event.preventDefault();
+        setCanvasOpen(!isCanvasOpen);
+      }
+    };
+    document.addEventListener("keydown", handleKeyDown);
+    return () => {
+      document.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [isCanvasOpen, setCanvasOpen]);
   const { setLastChatAgentId, getLastAgentId } = useAgentSelectionStore();
   const effectiveAgentId = agentId || getLastAgentId("chat");
   const conversationId = effectiveAgentId || void 0;
@@ -324311,6 +324309,7 @@ const tourCanvasOverviewImage = "" + new URL("canvas-overview-CruGEIRC.png", imp
 const tourCanvasVariablesImage = "" + new URL("canvas-variables-view-DrA20zqs.png", import.meta.url).href;
 const tourChatAttachmentsImage = "" + new URL("chat-attachments-_3cRrONU.png", import.meta.url).href;
 const tourChatFullViewImage = "" + new URL("chat-full-view-e-eJPzrw.png", import.meta.url).href;
+const tourChatInputImage = "" + new URL("chat-input-CU-CA7Se.png", import.meta.url).href;
 const tourInlineEditCanvasImage = "" + new URL("inline-edit-canvas-O9conTkE.png", import.meta.url).href;
 const tourSteps = [
   {
@@ -324331,7 +324330,7 @@ const tourSteps = [
     id: "agent-list",
     attachTo: { element: '[data-tour-tag="agent-list-panel"]', on: "right" },
     title: "Your Agents",
-    text: "On the left, you'll see a list of your available AI agents. You can select an agent to start a conversation or manage its settings.  Think of this as your WhatsApp chat list, but for AI agents!  There are no limits to how many agents you can have, so create as many as you need to handle all your daily tasks.",
+    text: "On the left, you'll see a list of your available AI agents. You can select an agent to start a conversation or manage its settings.  Think of this as your messenger contacts list, but for AI agents!  There are no limits to how many agents you can have, so create as many as you need to handle all your daily tasks.<br/><br/>Use the create agents button at the top of the toolbar to create a new agent at any time.  You can also import agents from the Agent Hub, which we will cover later in this tour.",
     buttons: [
       {
         text: "Back",
@@ -324386,11 +324385,11 @@ const tourSteps = [
   {
     id: "chat-input",
     attachTo: {
-      element: 'textarea[data-tour-tag="chat-input-textarea"]',
+      element: '[data-tour-tag="chat-input-textarea"]',
       on: "top"
     },
     title: "Ask Your Agent Anything",
-    text: `Type your request here. Agents can answer questions, perform tasks, search the web, and much more. When you create a new agent, you'll see suggested prompts for ideas!<br /><br />Some powerful requests that you can try:<br /><br /><ul><li>"Create a spreadsheet in my Documents folder with all the major cities in Canada."</li><li>"Search the web for the latest news on AI and make a thorough report."</li><li>Select an attachment and then "translate this document to French."</li></ul>`,
+    text: `Type your request here. Agents can answer questions, perform tasks, search the web, and much more. When you create a new agent, you'll see suggested prompts for ideas!<br /><br />Some powerful requests that you can try:<br /><br /><ul><li>"Create a spreadsheet in my Documents folder with all the major cities in Canada."</li><li>"Search the web for the latest news on AI and make a thorough report."</li><li>Select an attachment and then "translate this document to French."</li></ul><br /><img src="${tourChatInputImage}" alt="Chat Input" style="width: 100%; height: 200px; object-fit: contain; border-radius: 8px;"/><br />You can also attach files to your message by clicking the paperclip button, which we will cover in the next step.`,
     buttons: [
       {
         text: "Back",
@@ -324574,7 +324573,7 @@ const tourSteps = [
       on: "top"
     },
     title: "Documents View",
-    text: `The Documents view shows all your open markdown, code, and HTML documents as tabs. You can switch between documents and see dynamic visualizations in HTML created by your agents. Use this view to work with your notes, reports, and agent-generated content.<br /><br />This is where you can get more precise around your agents' work.<br/><img src="${tourInlineEditCanvasImage}" alt="Inline Edit Canvas" style="width: 100%; height: 200px; object-fit: contain; border-radius: 8px;"/><br />In your documents, highlight any text that you want your agent to improve and press Cmd/Ctrl+K to bring up the inline AI editor.  
+    text: `The Documents view shows all your open notes, blog articles, code, and visualizations as tabs. You can switch between documents to edit them and see dynamic visualizations in HTML created by your agents. Use this view to work with your notes, reports, and agent-generated content.<br /><br />This is where you can get more precise around your agents' work.<br/><img src="${tourInlineEditCanvasImage}" alt="Inline Edit Canvas" style="width: 100%; height: 200px; object-fit: contain; border-radius: 8px;"/><br />In your documents, highlight any text that you want your agent to improve and press Cmd/Ctrl+K to bring up the inline AI editor.  
     <br /><img src="${tourCanvasCodeInlineEditImage}" alt="Canvas Code Inline Edit" style="width: 100%; height: 200px; object-fit: cover; object-position: top; border-radius: 8px;"/><br />You can be as precise as you want and the agent will edit the document for you in place, using its memories and context so you don't have to re-explain things!`,
     buttons: [
       {