@opositatest/markdown-text-editor 1.1.1 → 1.3.0-canary.6b2b8ea
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +82 -23
- package/dist/editor.css +1 -1
- package/dist/editor.js +14987 -13701
- package/dist/react/index.js +16493 -15253
- package/dist/react/markdown-text-editor.css +1 -1
- package/dist/react/{module-BNH92kHQ.js → module-CTSMhL_P.js} +98 -98
- package/dist/react/native-B_0ZyPxP.js +107 -0
- package/package.json +13 -3
- package/dist/react/native-PBRRnxaU.js +0 -107
package/README.md
CHANGED
|
@@ -47,7 +47,7 @@ In the editor UI, the math block is available from the slash menu and can be fou
|
|
|
47
47
|
|
|
48
48
|
### Scope note
|
|
49
49
|
|
|
50
|
-
This package documents and supports the text-oriented authoring experience above, including the custom math block. Advanced upstream BlockNote media and
|
|
50
|
+
This package documents and supports the text-oriented authoring experience above, including the custom math block. Advanced upstream BlockNote media flows (video, audio, and file blocks) are not part of the documented, supported surface of this package, and are **hidden from the slash menu by default**. Enable them explicitly with `enabled-media-blocks` / `enabledMediaBlocks` if a host app needs them — see [Available slash menu item ids](#available-slash-menu-item-ids).
|
|
51
51
|
|
|
52
52
|
## Web Component
|
|
53
53
|
|
|
@@ -81,19 +81,70 @@ Load via CDN (no build step required):
|
|
|
81
81
|
|
|
82
82
|
### Attributes
|
|
83
83
|
|
|
84
|
-
| Attribute
|
|
85
|
-
|
|
|
86
|
-
| `name`
|
|
87
|
-
| `value`
|
|
88
|
-
| `placeholder`
|
|
89
|
-
| `width`
|
|
90
|
-
| `height`
|
|
91
|
-
| `disabled`
|
|
92
|
-
| `readonly`
|
|
93
|
-
| `required`
|
|
84
|
+
| Attribute | Type | Description |
|
|
85
|
+
| --------------------------- | ------- | ------------------------------------------------ |
|
|
86
|
+
| `name` | string | Field name for form submission |
|
|
87
|
+
| `value` | string | Initial Markdown value |
|
|
88
|
+
| `placeholder` | string | Placeholder text shown when empty |
|
|
89
|
+
| `width` | string | CSS width for the editor container |
|
|
90
|
+
| `height` | string | CSS height for the editor container |
|
|
91
|
+
| `disabled` | boolean | Disables the editor |
|
|
92
|
+
| `readonly` | boolean | Makes the editor read-only |
|
|
93
|
+
| `required` | boolean | Participates in native form validation |
|
|
94
|
+
| `hidden-slash-menu-items` | string | JSON array of item ids to hide from the slash menu |
|
|
95
|
+
| `enabled-media-blocks` | string | JSON array of item ids to re-enable; `video`, `audio`, and `file` are hidden from the slash menu by default (see [Scope note](#scope-note)) |
|
|
96
|
+
| `formatting-toolbar` | boolean | Floating formatting toolbar on text selection (default: enabled, set to `false` to disable) |
|
|
94
97
|
|
|
95
98
|
`width` and `height` accept any valid CSS size, such as `320px`, `40rem`, or `100%`.
|
|
96
99
|
|
|
100
|
+
### Formatting toolbar
|
|
101
|
+
|
|
102
|
+
Selecting text opens the formatting toolbar. Its **Quitar formato** action converts selected
|
|
103
|
+
text blocks to paragraphs and removes inline styles, colors, code formatting, and links in one
|
|
104
|
+
undoable operation. Non-text blocks such as images, tables, and formulas are left unchanged.
|
|
105
|
+
|
|
106
|
+
The action tooltip also shows the browser shortcut for pasting without source formatting:
|
|
107
|
+
`Ctrl/⌘ + Shift + V`.
|
|
108
|
+
|
|
109
|
+
#### Available slash menu item ids
|
|
110
|
+
|
|
111
|
+
Use these stable, English ids (not the localized, user-facing title) in the `hidden-slash-menu-items` / `enabled-media-blocks` JSON arrays:
|
|
112
|
+
|
|
113
|
+
| Id | Group | Description | Visible by default |
|
|
114
|
+
| ---------------- | ------------ | ------------------------------- | ------------------- |
|
|
115
|
+
| `heading-1` | Headings | Top-level heading | Yes |
|
|
116
|
+
| `heading-2` | Headings | Key section heading | Yes |
|
|
117
|
+
| `heading-3` | Headings | Subsection and group heading | Yes |
|
|
118
|
+
| `paragraph` | Basic blocks | Plain text | Yes |
|
|
119
|
+
| `bullet-list` | Basic blocks | Create a simple bullet list | Yes |
|
|
120
|
+
| `numbered-list` | Basic blocks | Create a list with numbering | Yes |
|
|
121
|
+
| `checklist` | Basic blocks | Track tasks with a checklist | Yes |
|
|
122
|
+
| `blockquote` | Basic blocks | Capture a quote | Yes |
|
|
123
|
+
| `code-block` | Basic blocks | Capture a code snippet | Yes |
|
|
124
|
+
| `divider` | Basic blocks | Visually divide blocks | Yes |
|
|
125
|
+
| `image` | Multimedia | Fullscreen image | Yes |
|
|
126
|
+
| `video` | Multimedia | Resizable video with caption | **No** — opt in via `enabled-media-blocks` |
|
|
127
|
+
| `audio` | Multimedia | Embed audio | **No** — opt in via `enabled-media-blocks` |
|
|
128
|
+
| `file` | Multimedia | Embed a file | **No** — opt in via `enabled-media-blocks` |
|
|
129
|
+
| `table` | Multimedia | Create a table | Yes |
|
|
130
|
+
| `math-formula` | Multimedia | Insert LaTeX formula | Yes |
|
|
131
|
+
|
|
132
|
+
**Example:** Hide the image and table items, on top of the media items that are already hidden by default:
|
|
133
|
+
|
|
134
|
+
```html
|
|
135
|
+
<markdown-text-editor
|
|
136
|
+
hidden-slash-menu-items='["image", "table"]'
|
|
137
|
+
></markdown-text-editor>
|
|
138
|
+
```
|
|
139
|
+
|
|
140
|
+
**Example:** Opt in to the video block while keeping audio and file hidden:
|
|
141
|
+
|
|
142
|
+
```html
|
|
143
|
+
<markdown-text-editor
|
|
144
|
+
enabled-media-blocks='["video"]'
|
|
145
|
+
></markdown-text-editor>
|
|
146
|
+
```
|
|
147
|
+
|
|
97
148
|
### Properties
|
|
98
149
|
|
|
99
150
|
| Property | Type | Description |
|
|
@@ -103,6 +154,9 @@ Load via CDN (no build step required):
|
|
|
103
154
|
| `element.height` | string | Get or set CSS height |
|
|
104
155
|
| `element.disabled` | boolean | Get or set disabled state |
|
|
105
156
|
| `element.readOnly` | boolean | Get or set read-only state |
|
|
157
|
+
| `element.hiddenSlashMenuItems` | string[] | Get or set the list of hidden slash menu item ids |
|
|
158
|
+
| `element.enabledMediaBlocks` | string[] | Get or set the list of default-hidden media item ids to re-enable |
|
|
159
|
+
| `element.formattingToolbar` | boolean | Get or set the floating formatting toolbar state |
|
|
106
160
|
|
|
107
161
|
### Methods
|
|
108
162
|
|
|
@@ -141,21 +195,26 @@ import "@opositatest/markdown-text-editor/style";
|
|
|
141
195
|
|
|
142
196
|
### Props
|
|
143
197
|
|
|
144
|
-
| Prop
|
|
145
|
-
|
|
|
146
|
-
| `value`
|
|
147
|
-
| `defaultValue`
|
|
148
|
-
| `onChange`
|
|
149
|
-
| `onReady`
|
|
150
|
-
| `placeholder`
|
|
151
|
-
| `width`
|
|
152
|
-
| `height`
|
|
153
|
-
| `disabled`
|
|
154
|
-
| `readonly`
|
|
155
|
-
| `className`
|
|
198
|
+
| Prop | Type | Description |
|
|
199
|
+
| ----------------------- | -------------------------------------------- | -------------------------------------------- |
|
|
200
|
+
| `value` | `string` | Controlled Markdown value |
|
|
201
|
+
| `defaultValue` | `string` | Uncontrolled initial value |
|
|
202
|
+
| `onChange` | `(value: string) => void` | Called on every content change |
|
|
203
|
+
| `onReady` | `(handle: MarkdownTextEditorHandle) => void` | Called once editor has initialized |
|
|
204
|
+
| `placeholder` | `string` | Placeholder text shown when empty |
|
|
205
|
+
| `width` | `string` | CSS width for the editor container |
|
|
206
|
+
| `height` | `string` | CSS height for the editor container |
|
|
207
|
+
| `disabled` | `boolean` | Disables the editor |
|
|
208
|
+
| `readonly` | `boolean` | Makes the editor read-only |
|
|
209
|
+
| `className` | `string` | Additional CSS class on the editor container |
|
|
210
|
+
| `hiddenSlashMenuItems` | `string[]` | Array of item ids to hide from the slash menu |
|
|
211
|
+
| `enabledMediaBlocks` | `string[]` | Array of item ids to re-enable; `video`, `audio`, and `file` are hidden by default |
|
|
212
|
+
| `formattingToolbar` | `boolean` | Floating formatting toolbar on text selection (default: `true`) |
|
|
156
213
|
|
|
157
214
|
`width` and `height` accept any valid CSS size, such as `320px`, `40rem`, or `100%`.
|
|
158
215
|
|
|
216
|
+
See the [Web Component section](#available-slash-menu-item-ids) for the list of available item ids.
|
|
217
|
+
|
|
159
218
|
### Imperative handle (via ref)
|
|
160
219
|
|
|
161
220
|
```tsx
|