@kortix/ui 0.14.5 → 0.14.7

package/dist/files/renderers/sqlite-renderer.js

@@ -675,7 +675,7 @@ export function SqliteRenderer({ filePath, fileName, className, readOnly = false
     // ── Main layout ───────────────────────────────────────────────────────
     return (_jsxs("div", { className: cn('bg-background relative flex h-full w-full flex-col', className), children: [_jsxs("div", { className: "flex h-10 shrink-0 items-center gap-2 border-b px-3 py-1.5", children: [_jsxs("span", { className: "text-muted-foreground/60 text-xs tabular-nums", children: [tables.filter((t) => t.type === 'table').length, ' ', tHardcodedUi.raw('i18nComplete.text0d4fc4a78d37'), tables.filter((t) => t.type === 'table').length !== 1 ? 's' : '', tables.some((t) => t.type === 'view') && (_jsxs(_Fragment, { children: [' ', "\u00B7 ", tables.filter((t) => t.type === 'view').length, ' ', tHardcodedUi.raw('i18nComplete.text2bcb43cbc8f6'), tables.filter((t) => t.type === 'view').length !== 1 ? 's' : ''] })), _jsxs(_Fragment, { children: [' ', "\u00B7 ", tables.reduce((sum, t) => sum + t.rowCount, 0).toLocaleString(), ' ', tHardcodedUi.raw('i18nComplete.textbc51e9e65d79')] })] }), hasUnsavedChanges && (_jsx("span", { className: "bg-kortix-yellow h-1.5 w-1.5 shrink-0 rounded-full", title: tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line795JsxAttrTitleUnsavedChanges') })), _jsxs("div", { className: "ml-auto flex items-center gap-1", children: [hasUnsavedChanges && (_jsxs(_Fragment, { children: [_jsxs(Button, { variant: "muted", size: "toolbar", onClick: handleDiscard, title: tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line806JsxAttrTitleDiscardChanges'), children: [_jsx(Undo2, { className: "h-3 w-3" }), tHardcodedUi.raw('i18nComplete.texteb1a70e39274')] }), _jsxs(Button, { variant: "default", size: "toolbar", onClick: handleSave, disabled: isSaving, title: tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line816JsxAttrTitleSaveToFileS'), children: [isSaving ? _jsx(Loading, { className: "h-3 w-3" }) : _jsx(Save, { className: "h-3 w-3" }), tHardcodedUi.raw('i18nComplete.text1509f561f241')] })] })), _jsx("div", { className: "bg-muted/60 ml-1 flex items-center rounded-md p-0.5", children: ['data', 'schema', 'query'].map((mode) => (_jsxs("button", { className: cn('inline-flex h-6 cursor-pointer items-center gap-1 rounded-sm px-2 text-xs transition-colors', viewMode === mode
                                         ? 'bg-background text-foreground shadow-sm'
-                                        : 'text-muted-foreground/60 hover:text-foreground'), onClick: () => setViewMode(mode), children: [mode === 'data' && _jsx(List, { className: "h-3 w-3" }), mode === 'schema' && _jsx(Code2, { className: "h-3 w-3" }), mode === 'query' && _jsx(Play, { className: "h-3 w-3" }), mode.charAt(0).toUpperCase() + mode.slice(1)] }, mode))) })] })] }), _jsxs("div", { className: "flex flex-1 overflow-hidden", children: [_jsxs("div", { className: "bg-muted/10 flex w-56 shrink-0 flex-col border-r", children: [_jsx("div", { className: "border-b p-2", children: _jsxs("div", { className: "relative", children: [_jsx(Search, { className: "text-muted-foreground/50 absolute top-1/2 left-2 h-3 w-3 -translate-y-1/2" }), _jsx(Input, { type: "text", placeholder: tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line860JsxAttrPlaceholderFilterTables'), autoComplete: "off", value: tableSearch, onChange: (e) => setTableSearch(e.target.value), className: "h-7 pr-7 pl-7 text-xs" }), tableSearch && (_jsx("button", { onClick: () => setTableSearch(''), className: "text-muted-foreground hover:text-foreground absolute top-1/2 right-2 -translate-y-1/2 cursor-pointer", children: _jsx(X, { className: "h-3 w-3" }) }))] }) }), _jsx("div", { className: "flex-1 overflow-y-auto py-1", children: filteredTables.map((table) => (_jsxs("button", { onClick: () => {
+                                        : 'text-muted-foreground/60 hover:text-foreground'), onClick: () => setViewMode(mode), children: [mode === 'data' && _jsx(List, { className: "h-3 w-3" }), mode === 'schema' && _jsx(Code2, { className: "h-3 w-3" }), mode === 'query' && _jsx(Play, { className: "h-3 w-3" }), mode.charAt(0).toUpperCase() + mode.slice(1)] }, mode))) })] })] }), _jsxs("div", { className: "flex flex-1 overflow-hidden", children: [_jsxs("div", { className: "bg-muted/10 flex w-56 shrink-0 flex-col border-r", children: [_jsx("div", { className: "border-b p-2", children: _jsxs("div", { className: "relative", children: [_jsx(Search, { className: "text-muted-foreground/50 absolute top-1/2 left-2 h-3 w-3 -translate-y-1/2" }), _jsx(Input, { type: "text", placeholder: tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line860JsxAttrPlaceholderFilterTables'), autoComplete: "off", value: tableSearch, onChange: (e) => setTableSearch(e.target.value), className: "h-7 pr-7 pl-7 text-xs" }), tableSearch && (_jsx("button", { onClick: () => setTableSearch(''), "aria-label": tHardcodedUi.raw('i18nComplete.text83b12c2216ef'), className: "text-muted-foreground hover:text-foreground absolute top-1/2 right-2 -translate-y-1/2 cursor-pointer", children: _jsx(X, { className: "h-3 w-3" }) }))] }) }), _jsx("div", { className: "flex-1 overflow-y-auto py-1", children: filteredTables.map((table) => (_jsxs("button", { onClick: () => {
                                         setSelectedTable(table.name);
                                         setSearchTerm('');
                                         if (viewMode === 'query') {
@@ -683,7 +683,7 @@ export function SqliteRenderer({ filePath, fileName, className, readOnly = false
                                         }
                                     }, className: cn('flex w-full cursor-pointer items-center gap-2 px-3 py-1.5 text-left text-sm transition-colors', selectedTable === table.name
                                         ? 'bg-accent text-accent-foreground'
-                                        : 'text-muted-foreground hover:bg-muted/50 hover:text-foreground'), children: [table.type === 'view' ? (_jsx(Eye, { className: "text-kortix-purple h-3.5 w-3.5 shrink-0" })) : (_jsx(Table2, { className: "text-kortix-blue h-3.5 w-3.5 shrink-0" })), _jsx("span", { className: "flex-1 truncate text-xs font-medium", children: table.name }), _jsx("span", { className: "text-muted-foreground/50 shrink-0 text-xs tabular-nums", children: table.rowCount.toLocaleString() })] }, table.name))) }), _jsxs("div", { className: "text-muted-foreground/30 border-t px-3 py-1.5 text-xs tabular-nums", children: [filteredTables.length, "/", tables.length, ' ', tHardcodedUi.raw('i18nComplete.textbaaf53622a51')] })] }), _jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [viewMode === 'data' && selectedTableInfo && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex h-9 shrink-0 items-center gap-2 border-b px-3 py-1.5", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-1.5", children: [selectedTableInfo.type === 'view' ? (_jsx(Eye, { className: "text-kortix-purple h-3.5 w-3.5 shrink-0" })) : (_jsx(Table2, { className: "text-kortix-blue h-3.5 w-3.5 shrink-0" })), _jsx("span", { className: "text-foreground truncate text-xs font-medium", children: selectedTableInfo.name }), _jsxs("span", { className: "text-muted-foreground/40 shrink-0 text-xs tabular-nums", children: [selectedTableInfo.rowCount.toLocaleString(), " \u00D7", ' ', selectedTableInfo.columns.length] })] }), _jsxs("div", { className: "ml-auto flex items-center gap-1", children: [isEditable && (_jsxs(_Fragment, { children: [_jsx("button", { className: "text-muted-foreground/50 hover:text-foreground hover:bg-muted inline-flex h-7 w-7 cursor-pointer items-center justify-center rounded-md transition-colors", onClick: handleAddRow, title: tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line941JsxAttrTitleInsertRow'), children: _jsx(Plus, { className: "h-3.5 w-3.5" }) }), _jsx("button", { className: "text-muted-foreground/50 hover:bg-destructive/10 hover:text-destructive inline-flex h-7 w-7 cursor-pointer items-center justify-center rounded-md transition-colors", onClick: handleDeleteSelected, title: tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line948JsxAttrTitleDeleteSelectedRows'), children: _jsx(Trash2, { className: "h-3.5 w-3.5" }) }), _jsx("div", { className: "bg-border mx-0.5 h-4 w-px" })] })), _jsxs("div", { className: "relative", children: [_jsx(Search, { className: "text-muted-foreground/40 absolute top-1/2 left-2 h-3 w-3 -translate-y-1/2" }), _jsx(Input, { type: "text", placeholder: tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line961JsxAttrPlaceholderFilter'), autoComplete: "off", value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), className: "h-7 w-40 pr-7 pl-7 text-xs" }), searchTerm && (_jsx("button", { onClick: () => setSearchTerm(''), className: "text-muted-foreground hover:text-foreground absolute top-1/2 right-2 -translate-y-1/2 cursor-pointer", children: _jsx(X, { className: "h-3 w-3" }) }))] }), _jsx("button", { className: "text-muted-foreground/50 hover:text-foreground hover:bg-muted inline-flex h-7 w-7 cursor-pointer items-center justify-center rounded-md transition-colors", onClick: handleExportCsv, title: tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line979JsxAttrTitleExportAsCsv'), children: _jsx(Download, { className: "h-3.5 w-3.5" }) })] })] }), _jsx("div", { className: "flex-1 overflow-hidden", children: tableData.rows.length > 0 ? (_jsx("div", { className: "h-full w-full", children: _jsx(AgGridReact, { ref: gridApiRef, theme: agTheme, rowData: tableData.rows, columnDefs: columnDefs, defaultColDef: {
+                                        : 'text-muted-foreground hover:bg-muted/50 hover:text-foreground'), children: [table.type === 'view' ? (_jsx(Eye, { className: "text-kortix-purple h-3.5 w-3.5 shrink-0" })) : (_jsx(Table2, { className: "text-kortix-blue h-3.5 w-3.5 shrink-0" })), _jsx("span", { className: "flex-1 truncate text-xs font-medium", children: table.name }), _jsx("span", { className: "text-muted-foreground/50 shrink-0 text-xs tabular-nums", children: table.rowCount.toLocaleString() })] }, table.name))) }), _jsxs("div", { className: "text-muted-foreground/30 border-t px-3 py-1.5 text-xs tabular-nums", children: [filteredTables.length, "/", tables.length, ' ', tHardcodedUi.raw('i18nComplete.textbaaf53622a51')] })] }), _jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [viewMode === 'data' && selectedTableInfo && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex h-9 shrink-0 items-center gap-2 border-b px-3 py-1.5", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-1.5", children: [selectedTableInfo.type === 'view' ? (_jsx(Eye, { className: "text-kortix-purple h-3.5 w-3.5 shrink-0" })) : (_jsx(Table2, { className: "text-kortix-blue h-3.5 w-3.5 shrink-0" })), _jsx("span", { className: "text-foreground truncate text-xs font-medium", children: selectedTableInfo.name }), _jsxs("span", { className: "text-muted-foreground/40 shrink-0 text-xs tabular-nums", children: [selectedTableInfo.rowCount.toLocaleString(), " \u00D7", ' ', selectedTableInfo.columns.length] })] }), _jsxs("div", { className: "ml-auto flex items-center gap-1", children: [isEditable && (_jsxs(_Fragment, { children: [_jsx("button", { className: "text-muted-foreground/50 hover:text-foreground hover:bg-muted inline-flex h-7 w-7 cursor-pointer items-center justify-center rounded-md transition-colors", onClick: handleAddRow, title: tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line941JsxAttrTitleInsertRow'), children: _jsx(Plus, { className: "h-3.5 w-3.5" }) }), _jsx("button", { className: "text-muted-foreground/50 hover:bg-destructive/10 hover:text-destructive inline-flex h-7 w-7 cursor-pointer items-center justify-center rounded-md transition-colors", onClick: handleDeleteSelected, title: tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line948JsxAttrTitleDeleteSelectedRows'), children: _jsx(Trash2, { className: "h-3.5 w-3.5" }) }), _jsx("div", { className: "bg-border mx-0.5 h-4 w-px" })] })), _jsxs("div", { className: "relative", children: [_jsx(Search, { className: "text-muted-foreground/40 absolute top-1/2 left-2 h-3 w-3 -translate-y-1/2" }), _jsx(Input, { type: "text", placeholder: tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line961JsxAttrPlaceholderFilter'), autoComplete: "off", value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), className: "h-7 w-40 pr-7 pl-7 text-xs" }), searchTerm && (_jsx("button", { onClick: () => setSearchTerm(''), "aria-label": tHardcodedUi.raw('i18nComplete.text83b12c2216ef'), className: "text-muted-foreground hover:text-foreground absolute top-1/2 right-2 -translate-y-1/2 cursor-pointer", children: _jsx(X, { className: "h-3 w-3" }) }))] }), _jsx("button", { className: "text-muted-foreground/50 hover:text-foreground hover:bg-muted inline-flex h-7 w-7 cursor-pointer items-center justify-center rounded-md transition-colors", onClick: handleExportCsv, title: tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line979JsxAttrTitleExportAsCsv'), children: _jsx(Download, { className: "h-3.5 w-3.5" }) })] })] }), _jsx("div", { className: "flex-1 overflow-hidden", children: tableData.rows.length > 0 ? (_jsx("div", { className: "h-full w-full", children: _jsx(AgGridReact, { ref: gridApiRef, theme: agTheme, rowData: tableData.rows, columnDefs: columnDefs, defaultColDef: {
                                                     sortable: true,
                                                     filter: true,
                                                     resizable: true,
@@ -723,5 +723,10 @@ export function SqliteRenderer({ filePath, fileName, className, readOnly = false
                                                                         ? '⌘'
                                                                         : 'Ctrl', tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line1169JsxTextEnter')] }), _jsxs("button", { className: cn('inline-flex h-7 cursor-pointer items-center gap-1 rounded-md px-2.5 text-xs transition-colors', sqlQuery.trim()
                                                                     ? 'bg-primary text-primary-foreground hover:bg-primary/90'
-                                                                    : 'bg-muted text-muted-foreground cursor-not-allowed'), onClick: runQuery, disabled: isQueryRunning || !sqlQuery.trim(), children: [isQueryRunning ? (_jsx(Loading, { className: "h-3 w-3" })) : (_jsx(Play, { className: "h-3 w-3" })), tHardcodedUi.raw('i18nComplete.text00d60e31a4e6')] })] })] }), _jsx("textarea", { value: sqlQuery, onChange: (e) => setSqlQuery(e.target.value), onKeyDown: handleQueryKeyDown, placeholder: `SELECT * FROM "${selectedTable || 'table_name'}" LIMIT 100`, className: cn('bg-muted/30 h-24 w-full cursor-text rounded-md border px-3 py-2 font-mono text-xs', 'focus:ring-ring resize-none focus:ring-1 focus:outline-none', 'placeholder:text-muted-foreground/30'), spellCheck: false })] }), _jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [queryResult?.error && (_jsxs("div", { className: "border-destructive/20 bg-destructive/5 text-destructive shrink-0 border-b px-4 py-2 font-mono text-xs select-text", children: [tHardcodedUi.raw('i18nComplete.text617062906764'), " ", queryResult.error] })), queryResult && !queryResult.error && (_jsxs("div", { className: "text-muted-foreground flex shrink-0 items-center gap-2 border-b px-3 py-1.5 text-xs", children: [_jsxs("span", { children: [queryResult.rowCount.toLocaleString(), ' ', tHardcodedUi.raw('i18nComplete.text634768dae147'), queryResult.rowCount !== 1 ? 's' : ''] }), _jsx("span", { className: "text-muted-foreground/30", children: "\u00B7" }), _jsxs("span", { children: [queryResult.time.toFixed(1), tHardcodedUi.raw('i18nComplete.textf785c3ce1d58')] })] })), queryResult && queryResult.rows.length > 0 && (_jsx("div", { className: "flex-1 overflow-hidden", children: _jsx(Suspense, { fallback: _jsx(GridFallback, {}), children: _jsx(DataGrid, { rowData: queryResult.rows, className: "h-full" }, `query-${queryResult.time}`) }) })), !queryResult && (_jsx("div", { className: "flex flex-1 items-center justify-center", children: _jsxs("div", { className: "space-y-2 text-center", children: [_jsx(Play, { className: "text-muted-foreground/20 mx-auto h-8 w-8" }), _jsx("p", { className: "text-muted-foreground/40 text-sm", children: tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line1237JsxTextWriteAQueryAndPressRun') })] }) })), queryResult && queryResult.rows.length === 0 && !queryResult.error && (_jsx("div", { className: "flex flex-1 items-center justify-center", children: _jsxs("p", { className: "text-muted-foreground/40 text-sm", children: [tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line1246JsxTextQueryReturnedNoRows'), queryResult.time.toFixed(1), tHardcodedUi.raw('i18nComplete.text9e7d85a50dc3')] }) }))] })] }))] })] }), expandedCell && (_jsx("div", { className: "absolute inset-0 z-50 flex items-center justify-center bg-black/40 p-6 backdrop-blur-[2px]", onClick: () => setExpandedCell(null), children: _jsxs("div", { className: "bg-background border-border/60 flex max-h-[70vh] w-full max-w-xl flex-col overflow-hidden rounded-md border shadow-xl", onClick: (e) => e.stopPropagation(), children: [_jsxs("div", { className: "flex items-center justify-between border-b px-4 py-2.5", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsx("span", { className: "text-muted-foreground truncate font-mono text-xs", children: expandedCell.column }), _jsxs("span", { className: "text-muted-foreground/30 shrink-0 text-xs tabular-nums", children: [tHardcodedUi.raw('i18nComplete.text634768dae147'), " ", expandedCell.rowIndex + 1] })] }), _jsxs("div", { className: "flex shrink-0 items-center gap-1", children: [isEditable && expandedEditValue !== expandedCell.value && (_jsxs(Button, { variant: "default", size: "toolbar", onClick: handleExpandedSave, children: [_jsx(Check, { className: "h-3 w-3" }), tHardcodedUi.raw('i18nComplete.text31e392d1c037')] })), _jsx(Button, { onClick: () => setExpandedCell(null), variant: "ghost", size: "icon-sm", children: _jsx(X, { className: "h-3.5 w-3.5" }) })] })] }), _jsx("div", { className: "flex-1 overflow-auto", children: isEditable ? (_jsx("textarea", { value: expandedEditValue, onChange: (e) => setExpandedEditValue(e.target.value), className: cn('h-full min-h-[180px] w-full cursor-text bg-transparent p-4 font-mono text-sm', 'resize-none focus:outline-none', 'placeholder:text-muted-foreground/20'), placeholder: "NULL", "aria-label": `${expandedCell.column} value`, spellCheck: false, autoFocus: true })) : (_jsx("pre", { className: "text-muted-foreground min-h-[180px] p-4 font-mono text-sm break-all whitespace-pre-wrap select-text", children: expandedCell.value || (_jsx("span", { className: "text-muted-foreground/30 italic", children: "NULL" })) })) }), _jsxs("div", { className: "text-muted-foreground/30 border-t px-4 py-1.5 text-xs tabular-nums", children: [expandedEditValue.length.toLocaleString(), ' ', tHardcodedUi.raw('i18nComplete.text1ce93dacbcf4')] })] }) }))] }));
+                                                                    : 'bg-muted text-muted-foreground cursor-not-allowed'), onClick: runQuery, disabled: isQueryRunning || !sqlQuery.trim(), children: [isQueryRunning ? (_jsx(Loading, { className: "h-3 w-3" })) : (_jsx(Play, { className: "h-3 w-3" })), tHardcodedUi.raw('i18nComplete.text00d60e31a4e6')] })] })] }), _jsx("textarea", { value: sqlQuery, onChange: (e) => setSqlQuery(e.target.value), onKeyDown: handleQueryKeyDown, placeholder: `SELECT * FROM "${selectedTable || 'table_name'}" LIMIT 100`, className: cn('bg-muted/30 h-24 w-full cursor-text rounded-md border px-3 py-2 font-mono text-xs', 'focus:ring-ring resize-none focus:ring-1 focus:outline-none', 'placeholder:text-muted-foreground/30'), spellCheck: false })] }), _jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [queryResult?.error && (_jsxs("div", { className: "border-destructive/20 bg-destructive/5 text-destructive shrink-0 border-b px-4 py-2 font-mono text-xs select-text", children: [tHardcodedUi.raw('i18nComplete.text617062906764'), " ", queryResult.error] })), queryResult && !queryResult.error && (_jsxs("div", { className: "text-muted-foreground flex shrink-0 items-center gap-2 border-b px-3 py-1.5 text-xs", children: [_jsxs("span", { children: [queryResult.rowCount.toLocaleString(), ' ', tHardcodedUi.raw('i18nComplete.text634768dae147'), queryResult.rowCount !== 1 ? 's' : ''] }), _jsx("span", { className: "text-muted-foreground/30", children: "\u00B7" }), _jsxs("span", { children: [queryResult.time.toFixed(1), tHardcodedUi.raw('i18nComplete.textf785c3ce1d58')] })] })), queryResult && queryResult.rows.length > 0 && (_jsx("div", { className: "flex-1 overflow-hidden", children: _jsx(Suspense, { fallback: _jsx(GridFallback, {}), children: _jsx(DataGrid, { rowData: queryResult.rows, className: "h-full" }, `query-${queryResult.time}`) }) })), !queryResult && (_jsx("div", { className: "flex flex-1 items-center justify-center", children: _jsxs("div", { className: "space-y-2 text-center", children: [_jsx(Play, { className: "text-muted-foreground/20 mx-auto h-8 w-8" }), _jsx("p", { className: "text-muted-foreground/40 text-sm", children: tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line1237JsxTextWriteAQueryAndPressRun') })] }) })), queryResult && queryResult.rows.length === 0 && !queryResult.error && (_jsx("div", { className: "flex flex-1 items-center justify-center", children: _jsxs("p", { className: "text-muted-foreground/40 text-sm", children: [tHardcodedUi.raw('componentsFileRenderersSqliteRenderer.line1246JsxTextQueryReturnedNoRows'), queryResult.time.toFixed(1), tHardcodedUi.raw('i18nComplete.text9e7d85a50dc3')] }) }))] })] }))] })] }), expandedCell && (_jsx("div", { role: "presentation", className: "absolute inset-0 z-50 flex items-center justify-center bg-black/40 p-6 backdrop-blur-[2px]", onClick: (e) => {
+                    if (e.target === e.currentTarget)
+                        setExpandedCell(null);
+                    else
+                        e.stopPropagation();
+                }, children: _jsxs("div", { className: "bg-background border-border/60 flex max-h-[70vh] w-full max-w-xl flex-col overflow-hidden rounded-md border shadow-xl", children: [_jsxs("div", { className: "flex items-center justify-between border-b px-4 py-2.5", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsx("span", { className: "text-muted-foreground truncate font-mono text-xs", children: expandedCell.column }), _jsxs("span", { className: "text-muted-foreground/30 shrink-0 text-xs tabular-nums", children: [tHardcodedUi.raw('i18nComplete.text634768dae147'), " ", expandedCell.rowIndex + 1] })] }), _jsxs("div", { className: "flex shrink-0 items-center gap-1", children: [isEditable && expandedEditValue !== expandedCell.value && (_jsxs(Button, { variant: "default", size: "toolbar", onClick: handleExpandedSave, children: [_jsx(Check, { className: "h-3 w-3" }), tHardcodedUi.raw('i18nComplete.text31e392d1c037')] })), _jsx(Button, { onClick: () => setExpandedCell(null), variant: "ghost", size: "icon-sm", children: _jsx(X, { className: "h-3.5 w-3.5" }) })] })] }), _jsx("div", { className: "flex-1 overflow-auto", children: isEditable ? (_jsx("textarea", { value: expandedEditValue, onChange: (e) => setExpandedEditValue(e.target.value), className: cn('h-full min-h-[180px] w-full cursor-text bg-transparent p-4 font-mono text-sm', 'resize-none focus:outline-none', 'placeholder:text-muted-foreground/20'), placeholder: "NULL", "aria-label": `${expandedCell.column} value`, spellCheck: false, autoFocus: true })) : (_jsx("pre", { className: "text-muted-foreground min-h-[180px] p-4 font-mono text-sm break-all whitespace-pre-wrap select-text", children: expandedCell.value || (_jsx("span", { className: "text-muted-foreground/30 italic", children: "NULL" })) })) }), _jsxs("div", { className: "text-muted-foreground/30 border-t px-4 py-1.5 text-xs tabular-nums", children: [expandedEditValue.length.toLocaleString(), ' ', tHardcodedUi.raw('i18nComplete.text1ce93dacbcf4')] })] }) }))] }));
 }

package/dist/files/renderers/xlsx/xlsx-viewer.js

@@ -508,22 +508,21 @@ const WorkbookSheetTabsInner = React.memo(function WorkbookSheetTabsInner({ acti
         setThumbnailUrls({});
     }, [clearCloseTimeout, clearOpenTimeout, workbookIdentity]);
     React.useEffect(() => {
-        thumbnails.forEach((thumbnail) => {
-            setThumbnailUrls((current) => {
-                if (current[thumbnail.sheetIndex])
-                    return current;
-                const canvas = document.createElement('canvas');
-                canvas.width = thumbnail.width;
-                canvas.height = thumbnail.height;
-                if (!thumbnail.paint(canvas))
-                    return current;
-                return {
-                    ...current,
-                    [thumbnail.sheetIndex]: canvas.toDataURL('image/png'),
-                };
-            });
-        });
-    }, [thumbnails]);
+        const painted = {};
+        for (const thumbnail of thumbnails) {
+            if (thumbnailUrls[thumbnail.sheetIndex])
+                continue;
+            const canvas = document.createElement('canvas');
+            canvas.width = thumbnail.width;
+            canvas.height = thumbnail.height;
+            if (thumbnail.paint(canvas))
+                painted[thumbnail.sheetIndex] = canvas.toDataURL('image/png');
+        }
+        if (Object.keys(painted).length === 0)
+            return;
+        // Existing entries win, as before: a sheet is painted once per workbook.
+        setThumbnailUrls((current) => ({ ...painted, ...current }));
+    }, [thumbnails, thumbnailUrls]);
     React.useEffect(() => {
         if (visiblePreviewIndex === null)
             return;

package/dist/files/tree/components/file-tree-item.js

@@ -141,7 +141,7 @@ export function FileTreeItem({ node, onClick, onDownload, onRename, onDelete, on
             return;
         onDropMove(sourcePath, node.path);
     }, [isDropTarget, node.path, onDropMove]);
-    const content = isRenaming ? (_jsxs("div", { className: cn('flex w-full items-center gap-2 rounded-lg px-3 py-1.5 text-sm', node.ignored && 'opacity-50'), children: [getNodeIcon(node), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [_jsx("input", { type: "text", ref: renameInputRef, value: renameName, onChange: (e) => setRenameName(e.target.value), onKeyDown: (e) => {
+    const content = isRenaming ? (_jsxs("div", { className: cn('flex w-full items-center gap-2 rounded-lg px-3 py-1.5 text-sm', node.ignored && 'opacity-50'), children: [getNodeIcon(node), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [_jsx("input", { type: "text", ref: renameInputRef, "aria-label": tHardcodedUi.raw('i18nComplete.text3064d79a295c'), value: renameName, onChange: (e) => setRenameName(e.target.value), onKeyDown: (e) => {
                             if (e.nativeEvent.isComposing)
                                 return;
                             if (e.key === 'Enter' && !nameConflict)

package/dist/files/viewer/file-header.js

@@ -9,7 +9,7 @@ import { cn } from '../../lib/utils.js';
 import { WarningIcon as AlertTriangle, BracketsCurlyIcon as Braces, CheckIcon as Check, WarningCircleIcon as CircleAlert, CodeIcon as Code, EyeIcon as Eye, GlobeIcon as Globe, ArrowCounterClockwiseIcon as RotateCcw, FloppyDiskIcon as Save } from '@phosphor-icons/react';
 import { Download } from '../../internal/icons/download.js';
 export function FileHeader({ showHeader, Breadcrumbs, filePath, readOnly, hasUnsavedChanges, saveFlash, fileDiagErrorCount, fileDiagWarningCount, fileContent, isSaving, handleSave, latestContentRef, discardLabel, handleDiscard, isHtmlFile, isHtmlPreview, setIsHtmlPreview, isJsonFile, isJsonTreeView, setIsJsonTreeView, hasPreviewToggle, isMarkdownPreview, setIsMarkdownPreview, headerActions, handleDownload, blobUrl, rawBlob, tI18nHardcoded, tHardcodedUi }) {
-    return (_jsx(_Fragment, { children: showHeader && (_jsxs("div", { className: "border-border/50 flex h-10 shrink-0 items-center gap-2 border-b px-3 py-1.5", children: [_jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-1", children: [Breadcrumbs && _jsx(Breadcrumbs, { filePath: filePath }), !readOnly && hasUnsavedChanges && (_jsxs(Badge, { variant: "warning", size: "sm", className: "shrink-0", children: [_jsx(StatusDot, { tone: "warning", pulse: true }), tI18nHardcoded.raw('i18nComplete.text7117f0807129')] })), !readOnly && saveFlash && !hasUnsavedChanges && (_jsxs(Badge, { variant: "success", size: "sm", className: "shrink-0", children: [_jsx(Check, { className: "h-3 w-3" }), tI18nHardcoded.raw('i18nComplete.textb5c120b316c2')] })), readOnly && (_jsx(Badge, { variant: "muted", size: "sm", className: "shrink-0 tracking-wider uppercase", children: tHardcodedUi.raw('featuresFilesComponentsFileContentRenderer.line554JsxTextViewOnly') })), (fileDiagErrorCount > 0 || fileDiagWarningCount > 0) && (_jsxs("span", { className: "inline-flex shrink-0 items-center gap-1.5", children: [fileDiagErrorCount > 0 && (_jsxs("span", { className: "text-destructive inline-flex items-center gap-0.5 text-xs font-medium tabular-nums", children: [_jsx(CircleAlert, { className: "h-3 w-3" }), fileDiagErrorCount] })), fileDiagWarningCount > 0 && (_jsxs("span", { className: "text-kortix-orange inline-flex items-center gap-0.5 text-xs font-medium tabular-nums", children: [_jsx(AlertTriangle, { className: "h-3 w-3" }), fileDiagWarningCount] }))] }))] }), _jsxs("div", { className: "flex shrink-0 items-center gap-0.5", children: [!readOnly && hasUnsavedChanges && fileContent?.type === 'text' && (_jsxs(_Fragment, { children: [_jsxs(Button, { variant: "default", size: "sm", className: "h-7 gap-1.5 px-3 text-xs font-medium", onClick: () => handleSave(latestContentRef.current), disabled: isSaving, title: tHardcodedUi.raw('featuresFilesComponentsFileContentRenderer.line586JsxAttrTitleSaveS'), children: [isSaving ? (_jsx(Loading, { className: "h-3.5 w-3.5" })) : (_jsx(Save, { className: "h-3.5 w-3.5" })), tI18nHardcoded.raw('i18nComplete.text1509f561f241')] }), _jsx(Hint, { label: discardLabel, side: "bottom", children: _jsx(Button, { variant: "ghost", size: "icon", "aria-label": discardLabel, className: "text-muted-foreground hover:text-foreground h-7 w-7 active:scale-[0.96]", onClick: handleDiscard, children: _jsx(RotateCcw, { className: "h-3.5 w-3.5" }) }) })] })), isHtmlFile && (_jsx(Hint, { label: isHtmlPreview ? tI18nHardcoded.raw('i18nComplete.text6ee818aa2de3') : 'Preview', side: "bottom", children: _jsx(Button, { variant: "ghost", size: "icon", "aria-label": isHtmlPreview ? tI18nHardcoded.raw('i18nComplete.text6ee818aa2de3') : 'Preview', "aria-pressed": isHtmlPreview, className: cn('h-7 w-7 active:scale-[0.96]', isHtmlPreview && 'text-primary'), onClick: () => setIsHtmlPreview((v) => !v), children: isHtmlPreview ? _jsx(Code, { className: "h-4 w-4" }) : _jsx(Globe, { className: "h-4 w-4" }) }) })), isJsonFile && fileContent?.type === 'text' && (_jsx(Hint, { label: isJsonTreeView
+    return (_jsx(_Fragment, { children: showHeader && (_jsxs("div", { className: "border-border/50 flex h-10 shrink-0 items-center gap-2 border-b px-3 py-1.5", children: [_jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-1", children: [Breadcrumbs && _jsx(Breadcrumbs, { filePath: filePath }), !readOnly && hasUnsavedChanges && (_jsxs(Badge, { variant: "warning", size: "sm", className: "shrink-0", children: [_jsx(StatusDot, { tone: "warning", pulse: true }), tI18nHardcoded.raw('i18nComplete.text7117f0807129')] })), !readOnly && saveFlash && !hasUnsavedChanges && (_jsxs(Badge, { variant: "success", size: "sm", className: "shrink-0", children: [_jsx(Check, { className: "h-3 w-3" }), tI18nHardcoded.raw('i18nComplete.textb5c120b316c2')] })), readOnly && (_jsx(Badge, { variant: "muted", size: "sm", className: "shrink-0 tracking-wider uppercase", children: tHardcodedUi.raw('featuresFilesComponentsFileContentRenderer.line554JsxTextViewOnly') })), (fileDiagErrorCount > 0 || fileDiagWarningCount > 0) && (_jsxs("span", { className: "inline-flex shrink-0 items-center gap-1.5", children: [fileDiagErrorCount > 0 && (_jsxs("span", { className: "text-destructive inline-flex items-center gap-0.5 text-xs font-medium tabular-nums", children: [_jsx(CircleAlert, { className: "h-3 w-3" }), fileDiagErrorCount] })), fileDiagWarningCount > 0 && (_jsxs("span", { className: "text-kortix-orange inline-flex items-center gap-0.5 text-xs font-medium tabular-nums", children: [_jsx(AlertTriangle, { className: "h-3 w-3" }), fileDiagWarningCount] }))] }))] }), _jsxs("div", { className: "flex shrink-0 items-center gap-0.5", children: [!readOnly && hasUnsavedChanges && fileContent?.type === 'text' && (_jsxs(_Fragment, { children: [_jsxs(Button, { variant: "default", size: "sm", className: "h-7 gap-1.5 px-3 text-xs font-medium", onClick: () => { void handleSave(latestContentRef.current).catch(() => undefined); }, disabled: isSaving, title: tHardcodedUi.raw('featuresFilesComponentsFileContentRenderer.line586JsxAttrTitleSaveS'), children: [isSaving ? (_jsx(Loading, { className: "h-3.5 w-3.5" })) : (_jsx(Save, { className: "h-3.5 w-3.5" })), tI18nHardcoded.raw('i18nComplete.text1509f561f241')] }), _jsx(Hint, { label: discardLabel, side: "bottom", children: _jsx(Button, { variant: "ghost", size: "icon", "aria-label": discardLabel, className: "text-muted-foreground hover:text-foreground h-7 w-7 active:scale-[0.96]", onClick: handleDiscard, children: _jsx(RotateCcw, { className: "h-3.5 w-3.5" }) }) })] })), isHtmlFile && (_jsx(Hint, { label: isHtmlPreview ? tI18nHardcoded.raw('i18nComplete.text6ee818aa2de3') : 'Preview', side: "bottom", children: _jsx(Button, { variant: "ghost", size: "icon", "aria-label": isHtmlPreview ? tI18nHardcoded.raw('i18nComplete.text6ee818aa2de3') : 'Preview', "aria-pressed": isHtmlPreview, className: cn('h-7 w-7 active:scale-[0.96]', isHtmlPreview && 'text-primary'), onClick: () => setIsHtmlPreview((v) => !v), children: isHtmlPreview ? _jsx(Code, { className: "h-4 w-4" }) : _jsx(Globe, { className: "h-4 w-4" }) }) })), isJsonFile && fileContent?.type === 'text' && (_jsx(Hint, { label: isJsonTreeView
                                 ? tI18nHardcoded.raw('i18nComplete.text6ee818aa2de3')
                                 : tI18nHardcoded.raw('i18nComplete.text4f50bda41e87'), side: "bottom", children: _jsx(Button, { variant: "ghost", size: "icon", "aria-label": isJsonTreeView
                                     ? tI18nHardcoded.raw('i18nComplete.text6ee818aa2de3')

package/dist/files/viewer/file-preview-modal.d.ts

@@ -60,4 +60,4 @@ export interface FilePreviewModalProps extends FilePreviewState {
  *     hit that path, which is why only the mouse appeared broken.)
  * Z-index is dialog-depth aware so it always stacks above its host overlay.
  */
-export declare function FilePreviewModal({ selectedFilePath, panelMode, filePathList, currentFileIndex, onClose, onNext, onPrev, source, HistoryContent, statusSlot, extraActions, shareContext, historyLabel, embedded, targetLine, }: FilePreviewModalProps): import("react").JSX.Element | null;
+export declare function FilePreviewModal({ selectedFilePath, panelMode, filePathList, currentFileIndex, onClose: closePreview, onNext: nextPreview, onPrev: prevPreview, source, HistoryContent, statusSlot, extraActions, shareContext, historyLabel, embedded, targetLine, }: FilePreviewModalProps): import("react").JSX.Element | null;

package/dist/files/viewer/file-preview-modal.js

@@ -54,9 +54,19 @@ const NO_REFRESH = {
  *     hit that path, which is why only the mouse appeared broken.)
  * Z-index is dialog-depth aware so it always stacks above its host overlay.
  */
-export function FilePreviewModal({ selectedFilePath, panelMode, filePathList, currentFileIndex, onClose, onNext, onPrev, source, HistoryContent, statusSlot, extraActions, shareContext, historyLabel = "History", embedded = false, targetLine = null, }) {
+export function FilePreviewModal({ selectedFilePath, panelMode, filePathList, currentFileIndex, onClose: closePreview, onNext: nextPreview, onPrev: prevPreview, source, HistoryContent, statusSlot, extraActions, shareContext, historyLabel = "History", embedded = false, targetLine = null, }) {
     const tI18nHardcoded = useTranslations("hardcodedUi");
     const isOpen = panelMode === "viewer" && !!selectedFilePath;
+    const [dirty, setDirty] = useState(false);
+    const leave = (action) => {
+        if (dirty && !window.confirm('Discard unsaved changes?'))
+            return;
+        setDirty(false);
+        action();
+    };
+    const onClose = () => leave(closePreview);
+    const onNext = () => leave(nextPreview);
+    const onPrev = () => leave(prevPreview);
     // Embedded viewers start inline (in the side panel); "Expand" pops them to
     // the full-screen overlay. Non-embedded viewers are always full-screen.
     const [expanded, setExpanded] = useState(false);
@@ -264,7 +274,7 @@ export function FilePreviewModal({ selectedFilePath, panelMode, filePathList, cu
                             : "Expand", side: "bottom", children: _jsx(Button, { variant: "ghost", size: "icon", "aria-label": expanded
                                 ? tI18nHardcoded.raw("i18nComplete.textde12e3c7c7a8")
                                 : "Expand", "aria-pressed": expanded, className: "text-muted-foreground hover:text-foreground h-8 w-8 active:scale-[0.96]", onClick: () => setExpanded((v) => !v), children: expanded ? (_jsx(Minimize2, { className: "h-4 w-4" })) : (_jsx(Maximize2, { className: "h-4 w-4" })) }) })), _jsx(ButtonGroup, { className: "ml-1.5", children: _jsx(Hint, { label: tI18nHardcoded.raw("autoFeaturesFileViewerFilePreviewModalJsxAttrTitleClosea40d0510"), side: "bottom", children: _jsx(Button, { variant: "secondary", size: "icon-base", "aria-label": tI18nHardcoded.raw("autoFeaturesFileViewerFilePreviewModalJsxAttrTitleClosea40d0510"), className: "active:scale-[0.96]", onClick: onClose, children: _jsx(X, { className: "h-4 w-4" }) }) }) })] })] }));
-    const body = (_jsxs(_Fragment, { children: [_jsx("div", { className: "h-full w-full overflow-hidden px-3 pt-3 pb-2", children: _jsx(FileSourceProvider, { value: source, children: _jsx(FileContentRenderer, { filePath: selectedFilePath, reloadKey: reloadKey, showHeader: false, readOnly: true, targetLine: targetLine, markdownPreview: markdownPreview, onMarkdownPreviewChange: setMarkdownPreview }) }) }), historyPath && (_jsx("div", { className: "bg-popover border-border/60 animate-in slide-in-from-bottom-4 fade-in-0 absolute right-4 bottom-4 z-30 overflow-hidden rounded-md border shadow-md duration-normal", children: _jsx(HistoryContent, { filePath: historyPath, onClose: () => setHistoryPath(null) }) }))] }));
+    const body = (_jsxs(_Fragment, { children: [_jsx("div", { className: "h-full w-full overflow-hidden px-3 pt-3 pb-2", children: _jsx(FileSourceProvider, { value: source, children: _jsx(FileContentRenderer, { filePath: selectedFilePath, reloadKey: reloadKey, onUnsavedChange: setDirty, showHeader: !!source.editablePreview, readOnly: !source.editablePreview, targetLine: targetLine, markdownPreview: markdownPreview, onMarkdownPreviewChange: setMarkdownPreview }) }) }), historyPath && (_jsx("div", { className: "bg-popover border-border/60 animate-in slide-in-from-bottom-4 fade-in-0 absolute right-4 bottom-4 z-30 overflow-hidden rounded-md border shadow-md duration-normal", children: _jsx(HistoryContent, { filePath: historyPath, onClose: () => setHistoryPath(null) }) }))] }));
     const panelInner = (_jsxs(_Fragment, { children: [_jsx("div", { ref: toolbarRef, className: "border-border/40 bg-background/95 flex h-12 shrink-0 items-center gap-2 border-b px-3 backdrop-blur-sm", children: toolbar }), _jsx("div", { ref: contentRef, className: "relative min-h-0 flex-1 overflow-hidden", children: body })] }));
     // Inline (embedded, not expanded): fill the relative parent — the side panel —
     // instead of portaling to a full-screen overlay. No backdrop, no body lock.
@@ -273,7 +283,7 @@ export function FilePreviewModal({ selectedFilePath, panelMode, filePathList, cu
                 value0: fileName ? `: ${fileName}` : "",
             }), tabIndex: -1, className: "bg-background animate-in fade-in-0 absolute inset-0 z-20 flex flex-col overflow-hidden duration-normal outline-none", children: panelInner }));
     }
-    const node = (_jsxs(DialogDepthProvider, { depth: dialogDepth, children: [_jsx("div", { "data-file-preview-overlay": "", className: "animate-in fade-in-0 pointer-events-auto fixed inset-0 bg-black/50 backdrop-blur-sm duration-normal", style: { zIndex: dialogOverlayZ(dialogDepth) }, onClick: embedded ? () => setExpanded(false) : onClose }), _jsx("div", { ref: surfaceRef, "data-file-preview-overlay": "", role: "dialog", "aria-modal": "true", "aria-label": tI18nHardcoded("i18nComplete.text4a7346d46cf6", {
+    const node = (_jsxs(DialogDepthProvider, { depth: dialogDepth, children: [_jsx("div", { "data-file-preview-overlay": "", className: "animate-in fade-in-0 pointer-events-auto fixed inset-0 bg-black/50 backdrop-blur-sm duration-normal", style: { zIndex: dialogOverlayZ(dialogDepth) }, "aria-hidden": "true", onClick: embedded ? () => setExpanded(false) : onClose }), _jsx("div", { ref: surfaceRef, "data-file-preview-overlay": "", role: "dialog", "aria-modal": "true", "aria-label": tI18nHardcoded("i18nComplete.text4a7346d46cf6", {
                     value0: fileName ? `: ${fileName}` : "",
                 }), tabIndex: -1, className: "kx-fullscreen-modal border-border/60 bg-background animate-in fade-in-0 zoom-in-[0.98] pointer-events-auto fixed inset-3 flex flex-col overflow-hidden rounded-xl border shadow-lg duration-normal outline-none sm:inset-4", style: { zIndex: dialogContentZ(dialogDepth) }, children: panelInner })] }));
     return createPortal(node, document.body);

package/dist/files/viewer/file-source.d.ts

@@ -5,6 +5,7 @@ import { type ComponentType, type ReactNode } from 'react';
  * their own typed hooks without conversion.
  */
 export interface FileContent {
+    revision?: string;
     type: 'text' | 'binary';
     content: string;
     patch?: FilePatch;
@@ -79,7 +80,8 @@ export interface FileSource {
      * instead of `upload`, so a source can refuse a save over a file someone
      * changed since it was read (a conditional write) rather than clobber it.
      */
-    save?: (filePath: string, file: File) => Promise<unknown>;
+    editablePreview?: boolean;
+    save?: (filePath: string, file: File, revision?: string) => Promise<unknown>;
     /**
      * Every byte the viewer shows comes from this source, which owns the
      * authorization. Previewers that otherwise read a sandbox path themselves

package/dist/files/viewer/use-file-content-state.js

@@ -61,6 +61,13 @@ export function useFileContentState({ filePath, onUnsavedChange, onSaved, readOn
     const contentRevision = useContentRevision(fileContent);
     const fetchRevision = useContentRevision(dataUpdatedAt || undefined);
     const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false);
+    // A refetch may replace server content while CodeEditor retains a dirty draft.
+    // CAS must compare against the revision that draft started from.
+    const draftRevisionRef = useRef(fileContent?.revision);
+    useEffect(() => {
+        if (!hasUnsavedChanges)
+            draftRevisionRef.current = fileContent?.revision;
+    }, [hasUnsavedChanges, fileContent?.revision]);
     const [isSaving, setIsSaving] = useState(false);
     const [saveFlash, setSaveFlash] = useState(false);
     // Tracks the latest editor content so we can save from the header button.
@@ -120,12 +127,12 @@ export function useFileContentState({ filePath, onUnsavedChange, onSaved, readOn
     // HEIC conversion — converts the raw HEIC blob to a renderable JPEG URL
     const { url: heicImageUrl, isConverting: heicConverting } = useHeicBlob(isHeicImage ? rawBlob : null, fileName);
     const displayContent = fileContent?.content ?? '';
-    // Keep latestContentRef in sync with loaded content
+    // Refresh clean content only; header Save must keep the visible dirty draft.
     useEffect(() => {
-        if (fileContent?.content) {
-            latestContentRef.current = fileContent.content;
+        if (!hasUnsavedChanges) {
+            latestContentRef.current = fileContent?.content ?? '';
         }
-    }, [fileContent?.content]);
+    }, [fileContent?.content, hasUnsavedChanges]);
     // Reset state when the FILE changes — markdown defaults to rendered preview.
     //
     // `setIsMarkdownPreview` MUST NOT be a dependency here, and this effect must
@@ -167,15 +174,17 @@ export function useFileContentState({ filePath, onUnsavedChange, onSaved, readOn
     // Save handler — called by CodeEditor (Cmd+S) and by the header Save button.
     // When called from the header button we pass latestContentRef.current.
     // When called from CodeEditor's Cmd+S, CodeEditor passes its own localContent.
+    const draftGeneration = useRef(0);
     const handleSave = useCallback(async (content) => {
         if (readOnly)
             return;
+        const generation = draftGeneration.current;
         setIsSaving(true);
         try {
             const blob = new Blob([content], { type: 'text/plain;charset=utf-8' });
             const file = new File([blob], fileName, { type: 'text/plain' });
             if (source.save) {
-                await source.save(filePath, file);
+                await source.save(filePath, file, draftRevisionRef.current);
             }
             else {
                 const parentPath = filePath.substring(0, filePath.lastIndexOf('/'));
@@ -184,7 +193,15 @@ export function useFileContentState({ filePath, onUnsavedChange, onSaved, readOn
             // Refetch so fileContent.content (= originalContent for CodeEditor) updates.
             // CodeEditor's originalContent effect will then sync savedContent.current
             // to match localContent, clearing its internal hasChanges flag.
-            await refetch();
+            const refreshed = await refetch();
+            if (refreshed && typeof refreshed === 'object' && 'data' in refreshed) {
+                const data = refreshed.data;
+                if (data && typeof data === 'object' && 'revision' in data && typeof data.revision === 'string') {
+                    draftRevisionRef.current = data.revision;
+                }
+            }
+            if (draftGeneration.current !== generation)
+                return;
             setHasUnsavedChanges(false);
             setSaveFlash(true);
             if (saveFlashTimerRef.current)
@@ -199,11 +216,12 @@ export function useFileContentState({ filePath, onUnsavedChange, onSaved, readOn
                     ? err.message
                     : tI18nHardcoded.raw('i18nComplete.text27c2ccd962c2'),
             }));
+            throw err;
         }
         finally {
             setIsSaving(false);
         }
-    }, [filePath, fileName, refetch, onSaved, readOnly, source]);
+    }, [filePath, fileName, refetch, onSaved, readOnly, source, tHardcodedUi, tI18nHardcoded]);
     // Discard handler — force-remounts CodeEditor so it re-initialises from fileContent.content.
     const handleDiscard = useCallback(() => {
         if (readOnly)
@@ -216,6 +234,7 @@ export function useFileContentState({ filePath, onUnsavedChange, onSaved, readOn
     const handleEditorChange = useCallback((content) => {
         if (readOnly)
             return;
+        draftGeneration.current++;
         latestContentRef.current = content;
     }, [readOnly]);
     // Cmd+S handler for when CodeEditor is not mounted (e.g. markdown preview)
@@ -226,7 +245,7 @@ export function useFileContentState({ filePath, onUnsavedChange, onSaved, readOn
             if ((e.metaKey || e.ctrlKey) && e.key === 's') {
                 e.preventDefault();
                 if (hasUnsavedChanges && latestContentRef.current) {
-                    handleSave(latestContentRef.current);
+                    void handleSave(latestContentRef.current).catch(() => undefined);
                 }
             }
         };

package/dist/files/viewer/viewer-actions.js

@@ -148,8 +148,8 @@ function expiryLabel(expiresAt) {
 /**
  * `Copy link` and everything about the link behind it, in one popover.
  *
- * A file or app mint always makes a NEW public token (only transcripts are
- * reused server-side), so the popover reads the session's live shares first:
+ * A file or app mint always makes a NEW public token, so the popover reads
+ * the session's live shares first:
  *
  *   - a live link for this exact file or port → show it, copy it, see when it
  *     expires, revoke it;