MemoryFileDetail

One memory file on its own: file name, scope badge, path, relative update time and the content rendered as Markdown. Use it where MemoryPanel is too much, for example after a Saved to memory notice. Editing is controlled: editing switches to a text editor that starts from file.content; the Edit button appears when both onEdit and onSave are set. Save calls onSave and shows a loader; a rejection keeps the editor open with the message, success calls onSaved. onDirtyChange reports unsaved edits so you can confirm before leaving. An empty file shows This file is empty.. now and locale control the relative update time.

Getting Started
$pnpm add @sinups/ai-kit @mantine/core @mantine/hooks @tabler/icons-react
Examples
View and edit
API reference
Prop
Type
Required
file
MemoryFile
Yes
File to show
editing
boolean
No
Renders the editor instead of the rendered Markdown; the editor starts from `file.content` when it mounts
onEdit
(file: MemoryFile) => void
No
Opens the editor, the Edit button is shown only when set together with `onSave`
onCancelEdit
() => void
No
Closes the editor without saving
onSave
(file: MemoryFile, content: string) => void | Promise<void>
No
Saves the edited content; the editor stays open and shows the rejection message when the promise rejects
onSaved
() => void
No
Called after a successful save
onDirtyChange
(dirty: boolean) => void
No
Reports whether the editor holds unsaved changes
onOpenLocation
(file: MemoryFile) => void
No
Shows the Open location button
now
number
No
Current time used for the relative update time, `Date.now()` by default
locale
string
No
Locale of the relative update time, `en` by default
labels
Partial<MemoryFileDetailLabels>
No
Overrides of the default English labels
className
string
No
Class name added to the root element
style
React.CSSProperties
No
Inline styles added to the root element