Inline rich text — dir/ui

Edit a formatted document directly in a record property.

# Inline rich text

Edit a formatted document directly in a record property.

## Install

```sh
npx shadcn@4.21.0 add lr-run/dir-ui/inline-rich-text#v0.1.2
```

[Registry item with source and dependencies](https://github.com/lr-run/dir-ui/blob/v0.1.2/registry.json)

Requires React 19, Tailwind CSS 4 and shadcn initialized with Base UI. Registry target placeholders resolve through components.json: @ui, @components, @hooks and @lib. Imports below use the conventional @/ prefix for illustration; the CLI rewrites them to your configured aliases. Shared components are installed once through registryDependencies. Theme CSS is imported by the UI modules. Existing files are never forcibly overwritten; review CLI conflicts before accepting changes. No Dir runtime is required.

## InlineRichText

```tsx
import { InlineRichText } from '@/components/ui/inline-rich-text.tsx'
```

| Prop | Type | Default / required | Notes |
| --- | --- | --- | --- |
| label | string | Required |  |
| value | { notes: string; notesDoc?: Note } | Required |  |
| onValueChange | InlineSaveHandler<RichTextValue> | Required |  |
| disabled | boolean | false |  |

```ts
type InlineSaveHandler<T> = (value: T) => void | Promise<void>
import type { Note } from '@/components/ui/rich-text.tsx'
type RichTextValue = { notes: string; notesDoc: Note }
```

Update the parent value only after persistence succeeds; throw or reject on failure. Pending saves prevent duplicate requests. Failed saves preserve the draft and offer retry or cancel. Use Save or Cmd/Ctrl+Enter to save and Escape to cancel.