@overlap/rte 0.1.0 → 0.1.2
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 +62 -68
- package/dist/components/Editor.d.ts.map +1 -1
- package/dist/components/Icons.d.ts +3 -1
- package/dist/components/Icons.d.ts.map +1 -1
- package/dist/index.d.ts +59 -45
- package/dist/index.d.ts.map +1 -1
- package/dist/index.esm.js +470 -197
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +472 -196
- package/dist/index.js.map +1 -1
- package/dist/plugins/blockFormat.d.ts +7 -0
- package/dist/plugins/blockFormat.d.ts.map +1 -0
- package/dist/plugins/headings.d.ts +1 -1
- package/dist/plugins/headings.d.ts.map +1 -1
- package/dist/plugins/index.d.ts +8 -2
- package/dist/plugins/index.d.ts.map +1 -1
- package/dist/plugins/listIndent.d.ts +10 -0
- package/dist/plugins/listIndent.d.ts.map +1 -0
- package/dist/plugins/optional.d.ts +1 -1
- package/dist/plugins/optional.d.ts.map +1 -1
- package/dist/types.d.ts +2 -0
- package/dist/types.d.ts.map +1 -1
- package/package.json +16 -4
- package/src/components/Editor.tsx +92 -49
- package/src/components/Icons.tsx +306 -77
- package/src/index.ts +18 -18
- package/src/plugins/blockFormat.tsx +194 -0
- package/src/plugins/headings.tsx +39 -28
- package/src/plugins/index.tsx +161 -0
- package/src/plugins/listIndent.tsx +90 -0
- package/src/plugins/optional.tsx +216 -194
- package/src/types.ts +3 -0
- package/src/plugins/index.ts +0 -54
package/README.md
CHANGED
|
@@ -1,23 +1,17 @@
|
|
|
1
1
|
# HENDRIKS-RTE
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
A lightweight, extensible Rich Text Editor for React.
|
|
4
4
|
|
|
5
5
|
## Features
|
|
6
6
|
|
|
7
|
-
- ✅ **
|
|
8
|
-
- ✅ **
|
|
9
|
-
- ✅ **Contenteditable-
|
|
10
|
-
- ✅ **Undo/Redo**:
|
|
11
|
-
- ✅ **JSON
|
|
12
|
-
- ✅ **TypeScript**:
|
|
7
|
+
- ✅ **Lightweight**: Minimal dependencies (React only)
|
|
8
|
+
- ✅ **Extensible**: Simple plugin system
|
|
9
|
+
- ✅ **Contenteditable-based**: Uses native browser functionality
|
|
10
|
+
- ✅ **Undo/Redo**: Full history support
|
|
11
|
+
- ✅ **JSON data model**: Structured export/import
|
|
12
|
+
- ✅ **TypeScript**: Fully typed
|
|
13
13
|
|
|
14
|
-
##
|
|
15
|
-
|
|
16
|
-
```bash
|
|
17
|
-
npm install hendriks-rte
|
|
18
|
-
```
|
|
19
|
-
|
|
20
|
-
## Grundlegende Verwendung
|
|
14
|
+
## Basic Usage
|
|
21
15
|
|
|
22
16
|
```tsx
|
|
23
17
|
import React, { useState } from "react";
|
|
@@ -40,25 +34,25 @@ function App() {
|
|
|
40
34
|
}
|
|
41
35
|
```
|
|
42
36
|
|
|
43
|
-
**
|
|
37
|
+
**Note:** The CSS is automatically imported with the Editor when you use it. If you want to import the CSS separately, you can use `import 'hendriks-rte/dist/styles.css'`.
|
|
44
38
|
|
|
45
|
-
##
|
|
39
|
+
## With Custom Plugins
|
|
46
40
|
|
|
47
41
|
```tsx
|
|
48
42
|
import React from "react";
|
|
49
43
|
import { Editor, Plugin, EditorAPI, ButtonProps } from "hendriks-rte";
|
|
50
44
|
|
|
51
|
-
//
|
|
45
|
+
// Create custom plugin
|
|
52
46
|
const customPlugin: Plugin = {
|
|
53
47
|
name: "custom",
|
|
54
48
|
type: "inline",
|
|
55
|
-
command: "bold", //
|
|
49
|
+
command: "bold", // or custom logic
|
|
56
50
|
renderButton: (props: ButtonProps) => (
|
|
57
51
|
<button
|
|
58
52
|
onClick={props.onClick}
|
|
59
53
|
className={`toolbar-button ${props.isActive ? "active" : ""}`}
|
|
60
54
|
>
|
|
61
|
-
⭐ {/*
|
|
55
|
+
⭐ {/* Or use SVG icons */}
|
|
62
56
|
</button>
|
|
63
57
|
),
|
|
64
58
|
execute: (editor: EditorAPI) => {
|
|
@@ -79,7 +73,7 @@ function App() {
|
|
|
79
73
|
}
|
|
80
74
|
```
|
|
81
75
|
|
|
82
|
-
##
|
|
76
|
+
## With Optional Plugins
|
|
83
77
|
|
|
84
78
|
```tsx
|
|
85
79
|
import React from "react";
|
|
@@ -114,15 +108,15 @@ function App() {
|
|
|
114
108
|
|
|
115
109
|
### Editor Props
|
|
116
110
|
|
|
117
|
-
| Prop | Type |
|
|
118
|
-
| ------------------ | ----------------------------------- |
|
|
119
|
-
| `initialContent` | `EditorContent?` |
|
|
120
|
-
| `onChange` | `(content: EditorContent) => void?` | Callback
|
|
121
|
-
| `plugins` | `Plugin[]?` | Array
|
|
122
|
-
| `placeholder` | `string?` |
|
|
123
|
-
| `className` | `string?` | CSS
|
|
124
|
-
| `toolbarClassName` | `string?` | CSS
|
|
125
|
-
| `editorClassName` | `string?` | CSS
|
|
111
|
+
| Prop | Type | Description |
|
|
112
|
+
| ------------------ | ----------------------------------- | ------------------------------------------ |
|
|
113
|
+
| `initialContent` | `EditorContent?` | Initial editor content |
|
|
114
|
+
| `onChange` | `(content: EditorContent) => void?` | Callback on changes |
|
|
115
|
+
| `plugins` | `Plugin[]?` | Array of plugins (default: defaultPlugins) |
|
|
116
|
+
| `placeholder` | `string?` | Placeholder text |
|
|
117
|
+
| `className` | `string?` | CSS class for container |
|
|
118
|
+
| `toolbarClassName` | `string?` | CSS class for toolbar |
|
|
119
|
+
| `editorClassName` | `string?` | CSS class for editor |
|
|
126
120
|
|
|
127
121
|
### EditorContent
|
|
128
122
|
|
|
@@ -141,18 +135,18 @@ interface EditorNode {
|
|
|
141
135
|
|
|
142
136
|
### EditorAPI
|
|
143
137
|
|
|
144
|
-
|
|
138
|
+
The EditorAPI is passed to plugins and provides the following methods:
|
|
145
139
|
|
|
146
|
-
- `executeCommand(command: string, value?: string): boolean` -
|
|
147
|
-
- `getSelection(): Selection | null` -
|
|
148
|
-
- `getContent(): EditorContent` -
|
|
149
|
-
- `setContent(content: EditorContent): void` -
|
|
150
|
-
- `insertBlock(type: string, attributes?: Record<string, string>): void` -
|
|
151
|
-
- `insertInline(type: string, attributes?: Record<string, string>): void` -
|
|
152
|
-
- `undo(): void` -
|
|
153
|
-
- `redo(): void` -
|
|
154
|
-
- `canUndo(): boolean` -
|
|
155
|
-
- `canRedo(): boolean` -
|
|
140
|
+
- `executeCommand(command: string, value?: string): boolean` - Executes a command
|
|
141
|
+
- `getSelection(): Selection | null` - Returns the current selection
|
|
142
|
+
- `getContent(): EditorContent` - Returns the current content
|
|
143
|
+
- `setContent(content: EditorContent): void` - Sets the content
|
|
144
|
+
- `insertBlock(type: string, attributes?: Record<string, string>): void` - Inserts a block
|
|
145
|
+
- `insertInline(type: string, attributes?: Record<string, string>): void` - Inserts an inline element
|
|
146
|
+
- `undo(): void` - Undoes the last action
|
|
147
|
+
- `redo(): void` - Redoes the last action
|
|
148
|
+
- `canUndo(): boolean` - Checks if undo is possible
|
|
149
|
+
- `canRedo(): boolean` - Checks if redo is possible
|
|
156
150
|
|
|
157
151
|
### Plugin Interface
|
|
158
152
|
|
|
@@ -168,24 +162,24 @@ interface Plugin {
|
|
|
168
162
|
}
|
|
169
163
|
```
|
|
170
164
|
|
|
171
|
-
##
|
|
165
|
+
## Default Plugins
|
|
172
166
|
|
|
173
|
-
- `boldPlugin` -
|
|
174
|
-
- `italicPlugin` -
|
|
175
|
-
- `underlinePlugin` -
|
|
176
|
-
- `undoPlugin` -
|
|
177
|
-
- `redoPlugin` -
|
|
167
|
+
- `boldPlugin` - Bold
|
|
168
|
+
- `italicPlugin` - Italic
|
|
169
|
+
- `underlinePlugin` - Underline
|
|
170
|
+
- `undoPlugin` - Undo
|
|
171
|
+
- `redoPlugin` - Redo
|
|
178
172
|
|
|
179
|
-
##
|
|
173
|
+
## Optional Plugins
|
|
180
174
|
|
|
181
|
-
- `linkPlugin` -
|
|
182
|
-
- `blockquotePlugin` -
|
|
183
|
-
- `unorderedListPlugin` -
|
|
184
|
-
- `orderedListPlugin` -
|
|
175
|
+
- `linkPlugin` - Insert links
|
|
176
|
+
- `blockquotePlugin` - Blockquotes
|
|
177
|
+
- `unorderedListPlugin` - Unordered list
|
|
178
|
+
- `orderedListPlugin` - Ordered list
|
|
185
179
|
|
|
186
|
-
##
|
|
180
|
+
## Creating Plugins
|
|
187
181
|
|
|
188
|
-
###
|
|
182
|
+
### Example: Simple Inline Plugin
|
|
189
183
|
|
|
190
184
|
```typescript
|
|
191
185
|
import { Plugin, EditorAPI, ButtonProps } from "hendriks-rte";
|
|
@@ -194,14 +188,14 @@ import { createInlinePlugin } from "hendriks-rte/plugins/base";
|
|
|
194
188
|
const myPlugin = createInlinePlugin(
|
|
195
189
|
"myPlugin",
|
|
196
190
|
"bold", // Command
|
|
197
|
-
"mdi:format-bold", // Icon
|
|
198
|
-
"
|
|
191
|
+
"mdi:format-bold", // Icon name (rendered internally as SVG)
|
|
192
|
+
"My Plugin" // Label
|
|
199
193
|
);
|
|
200
194
|
```
|
|
201
195
|
|
|
202
|
-
**
|
|
196
|
+
**Note:** Icons are rendered internally as SVG. You can also use your own SVG icons in your plugins.
|
|
203
197
|
|
|
204
|
-
###
|
|
198
|
+
### Example: Complex Plugin
|
|
205
199
|
|
|
206
200
|
```typescript
|
|
207
201
|
const customPlugin: Plugin = {
|
|
@@ -209,7 +203,7 @@ const customPlugin: Plugin = {
|
|
|
209
203
|
type: "block",
|
|
210
204
|
renderButton: (props: ButtonProps) => (
|
|
211
205
|
<button onClick={props.onClick}>
|
|
212
|
-
{/*
|
|
206
|
+
{/* Use SVG icons or emojis */}
|
|
213
207
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor">
|
|
214
208
|
<path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z" />
|
|
215
209
|
</svg>
|
|
@@ -219,11 +213,11 @@ const customPlugin: Plugin = {
|
|
|
219
213
|
editor.insertBlock("div", { class: "custom-block" });
|
|
220
214
|
},
|
|
221
215
|
isActive: (editor: EditorAPI) => {
|
|
222
|
-
//
|
|
216
|
+
// Check if plugin is active
|
|
223
217
|
return false;
|
|
224
218
|
},
|
|
225
219
|
canExecute: (editor: EditorAPI) => {
|
|
226
|
-
//
|
|
220
|
+
// Check if plugin can be executed
|
|
227
221
|
return true;
|
|
228
222
|
},
|
|
229
223
|
};
|
|
@@ -231,36 +225,36 @@ const customPlugin: Plugin = {
|
|
|
231
225
|
|
|
232
226
|
## Styling
|
|
233
227
|
|
|
234
|
-
|
|
228
|
+
The editor comes with minimal CSS. You can override the styles:
|
|
235
229
|
|
|
236
230
|
```css
|
|
237
231
|
.rte-container {
|
|
238
|
-
/* Container
|
|
232
|
+
/* Container styles */
|
|
239
233
|
}
|
|
240
234
|
|
|
241
235
|
.rte-toolbar {
|
|
242
|
-
/* Toolbar
|
|
236
|
+
/* Toolbar styles */
|
|
243
237
|
}
|
|
244
238
|
|
|
245
239
|
.rte-toolbar-button {
|
|
246
|
-
/* Button
|
|
240
|
+
/* Button styles */
|
|
247
241
|
}
|
|
248
242
|
|
|
249
243
|
.rte-editor {
|
|
250
|
-
/* Editor
|
|
244
|
+
/* Editor styles */
|
|
251
245
|
}
|
|
252
246
|
```
|
|
253
247
|
|
|
254
|
-
##
|
|
248
|
+
## Development
|
|
255
249
|
|
|
256
250
|
```bash
|
|
257
|
-
#
|
|
251
|
+
# Install dependencies
|
|
258
252
|
npm install
|
|
259
253
|
|
|
260
254
|
# Build
|
|
261
255
|
npm run build
|
|
262
256
|
|
|
263
|
-
# Development
|
|
257
|
+
# Development with watch
|
|
264
258
|
npm run dev
|
|
265
259
|
```
|
|
266
260
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Editor.d.ts","sourceRoot":"","sources":["../../src/components/Editor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAC;AASvE,OAAO,EAA4B,WAAW,EAAE,MAAM,UAAU,CAAC;AAmBjE,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,
|
|
1
|
+
{"version":3,"file":"Editor.d.ts","sourceRoot":"","sources":["../../src/components/Editor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAC;AASvE,OAAO,EAA4B,WAAW,EAAE,MAAM,UAAU,CAAC;AAmBjE,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA+xBxC,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React from
|
|
1
|
+
import React from "react";
|
|
2
2
|
interface IconProps {
|
|
3
3
|
width?: number;
|
|
4
4
|
height?: number;
|
|
@@ -22,6 +22,8 @@ export declare const ImageIcon: React.FC<IconProps>;
|
|
|
22
22
|
export declare const CloseIcon: React.FC<IconProps>;
|
|
23
23
|
export declare const LoadingIcon: React.FC<IconProps>;
|
|
24
24
|
export declare const UploadIcon: React.FC<IconProps>;
|
|
25
|
+
export declare const IndentIcon: React.FC<IconProps>;
|
|
26
|
+
export declare const OutdentIcon: React.FC<IconProps>;
|
|
25
27
|
export declare const Icon: React.FC<{
|
|
26
28
|
icon: string;
|
|
27
29
|
width?: number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icons.d.ts","sourceRoot":"","sources":["../../src/components/Icons.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,UAAU,SAAS;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,
|
|
1
|
+
{"version":3,"file":"Icons.d.ts","sourceRoot":"","sources":["../../src/components/Icons.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,UAAU,SAAS;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAcxC,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAc1C,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAc7C,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAcxC,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAcxC,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAenD,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAcxC,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAczC,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAc9C,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAchD,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAc7C,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAsBnD,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAc3C,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAc5C,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAczC,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAczC,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAc3C,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAc1C,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAc1C,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAc3C,CAAC;AAyBF,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAQA,CAAC"}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,22 @@
|
|
|
1
1
|
import React$1 from 'react';
|
|
2
2
|
|
|
3
|
+
interface DropdownProps {
|
|
4
|
+
icon: string;
|
|
5
|
+
label: string;
|
|
6
|
+
options: Array<{
|
|
7
|
+
value: string;
|
|
8
|
+
label: string;
|
|
9
|
+
icon?: string;
|
|
10
|
+
color?: string;
|
|
11
|
+
preview?: string;
|
|
12
|
+
headingPreview?: string;
|
|
13
|
+
}>;
|
|
14
|
+
onSelect: (value: string) => void;
|
|
15
|
+
currentValue?: string;
|
|
16
|
+
disabled?: boolean;
|
|
17
|
+
}
|
|
18
|
+
declare const Dropdown: React$1.FC<DropdownProps>;
|
|
19
|
+
|
|
3
20
|
interface EditorNode {
|
|
4
21
|
type: string;
|
|
5
22
|
children?: EditorNode[];
|
|
@@ -46,6 +63,8 @@ interface EditorAPI {
|
|
|
46
63
|
clearBackgroundColor: () => void;
|
|
47
64
|
clearFontSize: () => void;
|
|
48
65
|
clearLinks: () => void;
|
|
66
|
+
indentListItem: () => void;
|
|
67
|
+
outdentListItem: () => void;
|
|
49
68
|
}
|
|
50
69
|
interface CustomRenderer {
|
|
51
70
|
renderNode?: (node: EditorNode, children: React.ReactNode) => React.ReactElement | null;
|
|
@@ -90,23 +109,6 @@ interface ToolbarProps {
|
|
|
90
109
|
}
|
|
91
110
|
declare const Toolbar: React$1.FC<ToolbarProps>;
|
|
92
111
|
|
|
93
|
-
interface DropdownProps {
|
|
94
|
-
icon: string;
|
|
95
|
-
label: string;
|
|
96
|
-
options: Array<{
|
|
97
|
-
value: string;
|
|
98
|
-
label: string;
|
|
99
|
-
icon?: string;
|
|
100
|
-
color?: string;
|
|
101
|
-
preview?: string;
|
|
102
|
-
headingPreview?: string;
|
|
103
|
-
}>;
|
|
104
|
-
onSelect: (value: string) => void;
|
|
105
|
-
currentValue?: string;
|
|
106
|
-
disabled?: boolean;
|
|
107
|
-
}
|
|
108
|
-
declare const Dropdown: React$1.FC<DropdownProps>;
|
|
109
|
-
|
|
110
112
|
/**
|
|
111
113
|
* Standard-Plugins
|
|
112
114
|
*/
|
|
@@ -116,10 +118,39 @@ declare const underlinePlugin: Plugin;
|
|
|
116
118
|
declare const undoPlugin: Plugin;
|
|
117
119
|
declare const redoPlugin: Plugin;
|
|
118
120
|
/**
|
|
119
|
-
*
|
|
121
|
+
* Indent List Item Plugin (Tab für Unterliste)
|
|
120
122
|
*/
|
|
123
|
+
declare const indentListItemPlugin: Plugin;
|
|
124
|
+
/**
|
|
125
|
+
* Outdent List Item Plugin (Shift+Tab)
|
|
126
|
+
*/
|
|
127
|
+
declare const outdentListItemPlugin: Plugin;
|
|
128
|
+
|
|
121
129
|
declare const defaultPlugins: Plugin[];
|
|
122
130
|
|
|
131
|
+
/**
|
|
132
|
+
* Erstellt ein Block-Format-Plugin, das Headlines, Listen und Quote in einem Dropdown kombiniert
|
|
133
|
+
* @param headings - Array von Heading-Levels (z.B. ["h1", "h2", "h3"])
|
|
134
|
+
*/
|
|
135
|
+
declare function createBlockFormatPlugin(headings?: string[]): Plugin;
|
|
136
|
+
|
|
137
|
+
/**
|
|
138
|
+
* Clear Formatting Plugin - Entfernt alle Formatierungen
|
|
139
|
+
*/
|
|
140
|
+
declare const clearFormattingPlugin: Plugin;
|
|
141
|
+
|
|
142
|
+
declare function createTextColorPlugin(colors?: string[]): Plugin;
|
|
143
|
+
declare function createBackgroundColorPlugin(colors?: string[]): Plugin;
|
|
144
|
+
|
|
145
|
+
declare function createFontSizePlugin(fontSizes?: number[]): Plugin;
|
|
146
|
+
|
|
147
|
+
declare function createHeadingsPlugin(headings?: string[]): Plugin;
|
|
148
|
+
|
|
149
|
+
/**
|
|
150
|
+
* Image-Plugin mit URL-Eingabe und File-Upload
|
|
151
|
+
*/
|
|
152
|
+
declare function createImagePlugin(onImageUpload?: (file: File) => Promise<string>): Plugin;
|
|
153
|
+
|
|
123
154
|
/**
|
|
124
155
|
* Link-Plugin mit verbesserter Funktionalität
|
|
125
156
|
*/
|
|
@@ -138,23 +169,6 @@ declare const unorderedListPlugin: Plugin;
|
|
|
138
169
|
*/
|
|
139
170
|
declare const orderedListPlugin: Plugin;
|
|
140
171
|
|
|
141
|
-
declare function createFontSizePlugin(fontSizes?: number[]): Plugin;
|
|
142
|
-
|
|
143
|
-
declare function createTextColorPlugin(colors?: string[]): Plugin;
|
|
144
|
-
declare function createBackgroundColorPlugin(colors?: string[]): Plugin;
|
|
145
|
-
|
|
146
|
-
declare function createHeadingsPlugin(headings?: string[]): Plugin;
|
|
147
|
-
|
|
148
|
-
/**
|
|
149
|
-
* Clear Formatting Plugin - Entfernt alle Formatierungen
|
|
150
|
-
*/
|
|
151
|
-
declare const clearFormattingPlugin: Plugin;
|
|
152
|
-
|
|
153
|
-
/**
|
|
154
|
-
* Image-Plugin mit URL-Eingabe und File-Upload
|
|
155
|
-
*/
|
|
156
|
-
declare function createImagePlugin(onImageUpload?: (file: File) => Promise<string>): Plugin;
|
|
157
|
-
|
|
158
172
|
declare function domToContent(element: HTMLElement): EditorContent;
|
|
159
173
|
declare function contentToDOM(content: EditorContent, container: HTMLElement, customLinkComponent?: React$1.ComponentType<{
|
|
160
174
|
href: string;
|
|
@@ -178,6 +192,15 @@ declare class HistoryManager {
|
|
|
178
192
|
reset(): void;
|
|
179
193
|
}
|
|
180
194
|
|
|
195
|
+
/**
|
|
196
|
+
* Erhöht den Einrückungs-Level eines List-Items (Tab)
|
|
197
|
+
*/
|
|
198
|
+
declare function indentListItem(selection: Selection): boolean;
|
|
199
|
+
/**
|
|
200
|
+
* Reduziert den Einrückungs-Level eines List-Items (Shift+Tab)
|
|
201
|
+
*/
|
|
202
|
+
declare function outdentListItem(selection: Selection): boolean;
|
|
203
|
+
|
|
181
204
|
/**
|
|
182
205
|
* Liest die aktuelle Font-Size aus dem DOM an der Cursor-Position
|
|
183
206
|
*/
|
|
@@ -195,14 +218,5 @@ declare function getCurrentBackgroundColor(editor: EditorAPI): string | undefine
|
|
|
195
218
|
*/
|
|
196
219
|
declare function getCurrentHeading(editor: EditorAPI, availableHeadings: string[]): string | undefined;
|
|
197
220
|
|
|
198
|
-
|
|
199
|
-
* Erhöht den Einrückungs-Level eines List-Items (Tab)
|
|
200
|
-
*/
|
|
201
|
-
declare function indentListItem(selection: Selection): boolean;
|
|
202
|
-
/**
|
|
203
|
-
* Reduziert den Einrückungs-Level eines List-Items (Shift+Tab)
|
|
204
|
-
*/
|
|
205
|
-
declare function outdentListItem(selection: Selection): boolean;
|
|
206
|
-
|
|
207
|
-
export { Dropdown, Editor, HistoryManager, Toolbar, blockquotePlugin, boldPlugin, clearFormattingPlugin, contentToDOM, contentToHTML, createBackgroundColorPlugin, createEmptyContent, createFontSizePlugin, createHeadingsPlugin, createImagePlugin, createLinkPlugin, createTextColorPlugin, Editor as default, defaultPlugins, domToContent, getCurrentBackgroundColor, getCurrentFontSize, getCurrentHeading, getCurrentTextColor, htmlToContent, indentListItem, italicPlugin, linkPlugin, orderedListPlugin, outdentListItem, redoPlugin, underlinePlugin, undoPlugin, unorderedListPlugin };
|
|
221
|
+
export { Dropdown, Editor, HistoryManager, Toolbar, blockquotePlugin, boldPlugin, clearFormattingPlugin, contentToDOM, contentToHTML, createBackgroundColorPlugin, createBlockFormatPlugin, createEmptyContent, createFontSizePlugin, createHeadingsPlugin, createImagePlugin, createLinkPlugin, createTextColorPlugin, Editor as default, defaultPlugins, domToContent, getCurrentBackgroundColor, getCurrentFontSize, getCurrentHeading, getCurrentTextColor, htmlToContent, indentListItem, indentListItemPlugin, italicPlugin, linkPlugin, orderedListPlugin, outdentListItem, outdentListItemPlugin, redoPlugin, underlinePlugin, undoPlugin, unorderedListPlugin };
|
|
208
222
|
export type { ButtonProps, CustomRenderer, EditorAPI, EditorContent, EditorNode, EditorProps, Plugin };
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,cAAc,WAAW,CAAC;AAC1B,cAAc,uBAAuB,CAAC;AACtC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,SAAS,CAAC;AACxB,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrE,cAAc,yBAAyB,CAAC;AAExC,OAAO,EAAE,MAAM,IAAI,OAAO,EAAE,MAAM,qBAAqB,CAAC"}
|