Skip to content

Commit 1aac594

Browse files
authored
Merge pull request #3809 from udecode/feat/editor-select
Select editor
2 parents cf820a1 + ee599d1 commit 1aac594

File tree

98 files changed

+3731
-80
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

98 files changed

+3731
-80
lines changed

.changeset/config.json

+11-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,17 @@
22
"$schema": "https://unpkg.com/@changesets/[email protected]/schema.json",
33
"changelog": ["./changelog-config", { "repo": "udecode/plate" }],
44
"commit": false,
5-
"linked": [["@udecode/*"]],
5+
"linked": [
6+
[
7+
"@udecode/plate",
8+
"@udecode/plate*",
9+
"@udecode/slate",
10+
"@udecode/slate*",
11+
"@udecode/react*",
12+
"@udecode/cn",
13+
"@udecode/utils"
14+
]
15+
],
616
"access": "public",
717
"baseBranch": "main",
818
"updateInternalDependencies": "patch",

.changeset/heavy-sheep-hang copy 2.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@udecode/slate-utils': patch
3+
---
4+
5+
- Add `removeEditorText`: Remove non-empty editor text nodes

.changeset/heavy-sheep-hang copy 3.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@udecode/plate-tag': patch
3+
---
4+
5+
- New plugins: `TagPlugin`, `MultiSelectPlugin`

.changeset/heavy-sheep-hang copy.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@udecode/plate-utils': patch
3+
---
4+
5+
- Add `useEditorString`: Subscribes to the editor string on each change

.changeset/heavy-sheep-hang.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@udecode/plate-core': patch
3+
---
4+
5+
- `PlateContent` new prop - `autoFocusOnEditable`: Autofocus when it becomes editable (readOnly false -> readOnly true)

.changeset/tender-parents-own.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@udecode/plate-media': patch
3+
---
4+
5+
Fix README

apps/www/content/docs/api/core/plate.mdx

+3
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,9 @@ Custom render function for leaf nodes.
4949
Props for the [Editable](https://docs.slatejs.org/libraries/slate-react/editable) component. Extends `TextareaHTMLAttributes<HTMLDivElement>`.
5050

5151
<APIProps>
52+
<APIItem name="autoFocusOnEditable" type="boolean" optional>
53+
Automatically focus the editor when it transitions from read-only to editable mode (when `readOnly` changes from `true` to `false`).
54+
</APIItem>
5255
<APIItem name="renderEditable" type="(editable: ReactNode) => ReactNode" optional>
5356
Custom `Editable` node.
5457

apps/www/content/docs/api/slate-utils.mdx

+13
Original file line numberDiff line numberDiff line change
@@ -771,6 +771,19 @@ The number of children moved.
771771

772772
</APIReturns>
773773

774+
### removeEditorText
775+
776+
Removes all non-empty text nodes from the editor.
777+
778+
<APIParameters>
779+
<APIItem name="editor" type="TEditor">
780+
The editor instance.
781+
</APIItem>
782+
<APIItem name="options" type="RemoveNodesOptions<E>" optional>
783+
Options for removing nodes. The `match` function in options will be combined with the text length check.
784+
</APIItem>
785+
</APIParameters>
786+
774787
### removeMark
775788

776789
Removes a mark and triggers `onChange` if the selection is collapsed.

apps/www/content/docs/api/utils.mdx

+10
Original file line numberDiff line numberDiff line change
@@ -121,6 +121,16 @@ If true, merges its props onto its immediate child.
121121

122122
## Hooks
123123

124+
### useEditorString
125+
126+
A hook that returns the entire text content of the editor as a string.
127+
128+
<APIReturns>
129+
<APIItem name="string" type="string">
130+
The concatenated text content of all text nodes in the editor.
131+
</APIItem>
132+
</APIReturns>
133+
124134
### useMarkToolbarButtonState
125135

126136
Generates the state for a mark toolbar button.

apps/www/content/docs/comments.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,7 @@ The currently active comment.
7878

7979
## API
8080

81-
### editor.insert.comment
81+
### editor.tf.insert.comment
8282

8383
Insert a new comment mark.
8484

apps/www/content/docs/components/changelog.mdx

+8
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,14 @@ Use the [CLI](https://platejs.org/docs/components/cli) to install the latest ver
1313

1414
### November 26 #16.9
1515

16+
https://github.com/udecode/plate/pull/3809/files
17+
- Add `select-editor`, `tag-element`, `label`, `form`
18+
- Replace `cmdk` dependency with `@udecode/cmdk`. It's a controllable version of `cmdk`.
19+
- `command`: add variants
20+
- `editor`: add `select` variant
21+
- `popover`: add `animate` variant
22+
23+
https://github.com/udecode/plate/pull/3807/files
1624
- `toc-element`: remove `<nav>` tag using `<div>` instead to fix html2canvas issue
1725
- `editor`: remove `role="button"` to fix html2canvas issue
1826

apps/www/content/docs/components/components-json.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ You can create a `components.json` file in your project by running the following
1919
npx shadcx@latest init plate
2020
```
2121

22-
See the [CLI section](/docs/cli) for more information.
22+
See the [CLI section](/docs/components/cli) for more information.
2323

2424
## $schema
2525

apps/www/content/docs/date.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,7 @@ A boolean indicating the direction to check. If true, checks the previous node;
7373

7474
## Plugin Transforms
7575

76-
### editor.insert.date
76+
### editor.tf.insert.date
7777

7878
Insert a date into the editor.
7979

apps/www/content/docs/dnd.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ title: Drag & Drop
33
docs:
44
- route: /docs/components/draggable
55
title: Draggable
6-
- route: /docs/api/dnd
6+
- route: /docs/dnd
77
title: Dnd Plugin
88
---
99

apps/www/content/docs/emoji.mdx

-2
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,6 @@ docs:
77
title: Emoji Input Element
88
- route: /docs/components/emoji-dropdown-menu
99
title: Emoji Dropdown Menu
10-
- route: /docs/components/emoji-toolbar-dropdown
11-
title: Emoji Toolbar Dropdown
1210
---
1311

1412
<ComponentPreview name="emoji-demo" />

apps/www/content/docs/examples/export.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -44,4 +44,4 @@ Refer to the preview above.
4444

4545
Try it out with our server-side PDF export:
4646

47-
<ComponentPreviewPro name="export-demo" />
47+
<ComponentPreviewPro name="export-pro" />

apps/www/content/docs/link.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ const plugins = [
4646

4747
## Plugin Transforms
4848

49-
### editor.insert.link
49+
### editor.tf.insert.link
5050

5151
Inserts a link node into the editor.
5252

apps/www/content/docs/media.mdx

+3-3
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,11 @@ title: Media
33
docs:
44
- route: /docs/components/image-element
55
title: Image Element
6-
- route: /docs/components/video-element
6+
- route: /docs/components/media-video-element
77
title: Video Element
8-
- route: /docs/components/audio-element
8+
- route: /docs/components/media-audio-element
99
title: Audio Element
10-
- route: /docs/components/file-element
10+
- route: /docs/components/media-file-element
1111
title: File Element
1212
- route: /docs/components/media-embed-element
1313
title: Media Embed Element
+89
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
---
2+
title: Multi Select
3+
docs:
4+
- route: /docs/components/tag-element
5+
- route: /docs/components/select-editor
6+
---
7+
8+
<ComponentPreview name="select-editor-demo" />
9+
10+
<PackageInfo>
11+
12+
## Features
13+
14+
- Inline selectable elements with keyboard navigation
15+
- Multi-item selection support
16+
- Automatic cleanup of surrounding text
17+
- Duplicate prevention
18+
- Customizable rendering and behavior
19+
- Built on top of the Tag plugin infrastructure
20+
- Keyboard shortcuts for quick selection and navigation
21+
22+
</PackageInfo>
23+
24+
## Installation
25+
26+
```bash
27+
npm install @udecode/plate-tag
28+
```
29+
30+
## Usage
31+
32+
```tsx
33+
import { MultiSelectPlugin } from '@udecode/plate-tag/react';
34+
import { TagElement } from '@/components/plate-ui/tag-element';
35+
import {
36+
SelectEditor,
37+
SelectEditorContent,
38+
SelectEditorInput,
39+
SelectEditorCombobox,
40+
type SelectItem,
41+
} from '@/components/plate-ui/select-editor';
42+
43+
// Define your items
44+
const ITEMS: SelectItem[] = [
45+
{ value: 'React' },
46+
{ value: 'TypeScript' },
47+
{ value: 'JavaScript' },
48+
];
49+
50+
export default function MySelectEditor() {
51+
const [value, setValue] = React.useState<SelectItem[]>([ITEMS[0]]);
52+
53+
return (
54+
<SelectEditor
55+
value={value}
56+
onValueChange={setValue}
57+
items={ITEMS}
58+
>
59+
<SelectEditorContent>
60+
<SelectEditorInput placeholder="Select items..." />
61+
<SelectEditorCombobox />
62+
</SelectEditorContent>
63+
</SelectEditor>
64+
);
65+
}
66+
```
67+
68+
- [TagElement](/docs/components/tag-element)
69+
- [SelectEditor](/docs/components/select-editor)
70+
71+
## Plugins
72+
73+
### MultiSelectPlugin
74+
75+
Handling multi-select elements in the editor. Built on top of TagPlugin.
76+
77+
<APIOptions>
78+
<APIItem name="type" type="string" optional>
79+
The type identifier for multi-select elements.
80+
81+
- **Default:** `'multi-select'`
82+
</APIItem>
83+
</APIOptions>
84+
85+
### TagPlugin
86+
87+
Inline void element plugin.
88+
89+
## API

apps/www/content/docs/tag.mdx

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
title: Tag
3+
docs:
4+
- route: /docs/components/tag-element
5+
title: Tag Element
6+
---
7+

apps/www/package.json

+7-1
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,8 @@
1515
"lint:fix": "yarn lint --fix",
1616
"preview": "next build && next start",
1717
"start": "next start",
18-
"typecheck": "yarn prebuild && tsc --noEmit"
18+
"typecheck": "yarn prebuild && tsc --noEmit",
19+
"typecheck:watch": "yarn typecheck --watch"
1920
},
2021
"browserslist": {
2122
"production": [
@@ -37,6 +38,7 @@
3738
"@ai-sdk/openai": "^0.0.67",
3839
"@ariakit/react": "0.4.11",
3940
"@faker-js/faker": "^9.0.2",
41+
"@hookform/resolvers": "3.9.1",
4042
"@next/third-parties": "15.0.3",
4143
"@radix-ui/colors": "3.0.0",
4244
"@radix-ui/react-accessible-icon": "^1.1.0",
@@ -69,6 +71,7 @@
6971
"@radix-ui/react-toggle-group": "^1.1.0",
7072
"@radix-ui/react-toolbar": "^1.1.0",
7173
"@radix-ui/react-tooltip": "^1.1.2",
74+
"@udecode/cmdk": "workspace:^",
7275
"@udecode/cn": "workspace:^",
7376
"@udecode/plate": "workspace:^",
7477
"@udecode/plate-ai": "workspace:^",
@@ -121,6 +124,7 @@
121124
"@udecode/plate-suggestion": "workspace:^",
122125
"@udecode/plate-tabbable": "workspace:^",
123126
"@udecode/plate-table": "workspace:^",
127+
"@udecode/plate-tag": "workspace:^",
124128
"@udecode/plate-test-utils": "workspace:^",
125129
"@udecode/plate-toggle": "workspace:^",
126130
"@udecode/plate-trailing-block": "workspace:^",
@@ -139,6 +143,7 @@
139143
"contentlayer2": "^0.4.6",
140144
"date-fns": "^3.6.0",
141145
"framer-motion": "^11.5.4",
146+
"fzf": "0.5.2",
142147
"html2canvas": "^1.4.1",
143148
"lodash.template": "^4.5.0",
144149
"lucide-react": "0.460.0",
@@ -154,6 +159,7 @@
154159
"react-dnd": "16.0.1",
155160
"react-dnd-html5-backend": "^16.0.1",
156161
"react-dom": "^18.3.1",
162+
"react-hook-form": "7.53.2",
157163
"react-lite-youtube-embed": "^2.4.0",
158164
"react-markdown": "9.0.1",
159165
"react-player": "2.16.0",

0 commit comments

Comments
 (0)