@overlap/rte 0.1.5 → 0.1.6

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.
Files changed (58) hide show
  1. package/README.md +52 -40
  2. package/dist/components/Editor.d.ts.map +1 -1
  3. package/dist/components/Icons.d.ts +2 -0
  4. package/dist/components/Icons.d.ts.map +1 -1
  5. package/dist/constants.d.ts +9 -0
  6. package/dist/constants.d.ts.map +1 -0
  7. package/dist/hooks/useCheckbox.d.ts +23 -0
  8. package/dist/hooks/useCheckbox.d.ts.map +1 -0
  9. package/dist/hooks/useEditorEvents.d.ts +18 -0
  10. package/dist/hooks/useEditorEvents.d.ts.map +1 -0
  11. package/dist/hooks/useEditorInit.d.ts +23 -0
  12. package/dist/hooks/useEditorInit.d.ts.map +1 -0
  13. package/dist/hooks/useEditorSelection.d.ts +7 -0
  14. package/dist/hooks/useEditorSelection.d.ts.map +1 -0
  15. package/dist/index.d.ts +45 -7
  16. package/dist/index.d.ts.map +1 -1
  17. package/dist/index.esm.js +1294 -628
  18. package/dist/index.esm.js.map +1 -1
  19. package/dist/index.js +1295 -626
  20. package/dist/index.js.map +1 -1
  21. package/dist/plugins/blockFormat.d.ts +2 -2
  22. package/dist/plugins/blockFormat.d.ts.map +1 -1
  23. package/dist/styles.css +476 -386
  24. package/dist/types.d.ts +2 -2
  25. package/dist/types.d.ts.map +1 -1
  26. package/dist/utils/checkbox.d.ts +27 -0
  27. package/dist/utils/checkbox.d.ts.map +1 -0
  28. package/dist/utils/content.d.ts +19 -2
  29. package/dist/utils/content.d.ts.map +1 -1
  30. package/dist/utils/dom.d.ts +31 -0
  31. package/dist/utils/dom.d.ts.map +1 -0
  32. package/package.json +2 -3
  33. package/src/components/Dropdown.tsx +0 -103
  34. package/src/components/Editor.css +0 -2
  35. package/src/components/Editor.tsx +0 -828
  36. package/src/components/FloatingToolbar.tsx +0 -214
  37. package/src/components/IconWrapper.tsx +0 -14
  38. package/src/components/Icons.tsx +0 -374
  39. package/src/components/Toolbar.tsx +0 -137
  40. package/src/components/index.ts +0 -3
  41. package/src/index.ts +0 -19
  42. package/src/plugins/base.tsx +0 -91
  43. package/src/plugins/blockFormat.tsx +0 -194
  44. package/src/plugins/clearFormatting.tsx +0 -31
  45. package/src/plugins/colors.tsx +0 -122
  46. package/src/plugins/fontSize.tsx +0 -81
  47. package/src/plugins/headings.tsx +0 -87
  48. package/src/plugins/image.tsx +0 -189
  49. package/src/plugins/index.tsx +0 -161
  50. package/src/plugins/listIndent.tsx +0 -90
  51. package/src/plugins/optional.tsx +0 -243
  52. package/src/styles.css +0 -638
  53. package/src/types.ts +0 -95
  54. package/src/utils/clearFormatting.ts +0 -244
  55. package/src/utils/content.ts +0 -290
  56. package/src/utils/history.ts +0 -59
  57. package/src/utils/listIndent.ts +0 -171
  58. package/src/utils/stateReflection.ts +0 -175
package/README.md CHANGED
@@ -1,7 +1,13 @@
1
- # HENDRIKS-RTE
1
+ # @overlap/rte
2
2
 
3
3
  A lightweight, extensible Rich Text Editor for React.
4
4
 
5
+ ## Installation
6
+
7
+ ```bash
8
+ npm install @overlap/rte
9
+ ```
10
+
5
11
  ## Features
6
12
 
7
13
  - ✅ **Lightweight**: Minimal dependencies (React only)
@@ -10,13 +16,14 @@ A lightweight, extensible Rich Text Editor for React.
10
16
  - ✅ **Undo/Redo**: Full history support
11
17
  - ✅ **JSON data model**: Structured export/import
12
18
  - ✅ **TypeScript**: Fully typed
19
+ - ✅ **Vite & Deno compatible**: ESM module support
13
20
 
14
21
  ## Basic Usage
15
22
 
16
23
  ```tsx
17
24
  import React, { useState } from "react";
18
- import { Editor, EditorContent } from "hendriks-rte";
19
- import "hendriks-rte/dist/styles.css"; // CSS importieren
25
+ import { Editor, EditorContent } from "@overlap/rte";
26
+ import "@overlap/rte/dist/styles.css"; // CSS importieren
20
27
 
21
28
  function App() {
22
29
  const [content, setContent] = useState<EditorContent | undefined>();
@@ -34,13 +41,13 @@ function App() {
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
+ **Note:** The CSS must be imported separately. Import it with `import '@overlap/rte/dist/styles.css'`.
38
45
 
39
46
  ## With Custom Plugins
40
47
 
41
48
  ```tsx
42
49
  import React from "react";
43
- import { Editor, Plugin, EditorAPI, ButtonProps } from "hendriks-rte";
50
+ import { Editor, Plugin, EditorAPI, ButtonProps } from "@overlap/rte";
44
51
 
45
52
  // Create custom plugin
46
53
  const customPlugin: Plugin = {
@@ -77,23 +84,10 @@ function App() {
77
84
 
78
85
  ```tsx
79
86
  import React from "react";
80
- import {
81
- Editor,
82
- defaultPlugins,
83
- linkPlugin,
84
- blockquotePlugin,
85
- unorderedListPlugin,
86
- orderedListPlugin,
87
- } from "hendriks-rte";
87
+ import { Editor, defaultPlugins, linkPlugin } from "@overlap/rte";
88
88
 
89
89
  function App() {
90
- const allPlugins = [
91
- ...defaultPlugins,
92
- linkPlugin,
93
- blockquotePlugin,
94
- unorderedListPlugin,
95
- orderedListPlugin,
96
- ];
90
+ const allPlugins = [...defaultPlugins, linkPlugin];
97
91
 
98
92
  return (
99
93
  <Editor
@@ -104,19 +98,31 @@ function App() {
104
98
  }
105
99
  ```
106
100
 
101
+ **Note:** The `defaultPlugins` already include block formatting (headings, lists, blockquote) in a single dropdown. You can customize which headings are available using the `headings` prop:
102
+
103
+ ```tsx
104
+ <Editor
105
+ headings={["h1", "h2", "h3", "h4"]} // Customize available headings
106
+ plugins={allPlugins}
107
+ onChange={(content) => console.log(content)}
108
+ />
109
+ ```
110
+
107
111
  ## API
108
112
 
109
113
  ### Editor Props
110
114
 
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 |
115
+ | Prop | Type | Description |
116
+ | ------------------ | ----------------------------------- | ------------------------------------------------------ |
117
+ | `initialContent` | `EditorContent?` | Initial editor content |
118
+ | `onChange` | `(content: EditorContent) => void?` | Callback on changes |
119
+ | `plugins` | `Plugin[]?` | Array of plugins (default: defaultPlugins) |
120
+ | `headings` | `string[]?` | Available heading levels (default: ["h1", "h2", "h3"]) |
121
+ | `placeholder` | `string?` | Placeholder text |
122
+ | `className` | `string?` | CSS class for container |
123
+ | `toolbarClassName` | `string?` | CSS class for toolbar |
124
+ | `editorClassName` | `string?` | CSS class for editor |
125
+ | `onImageUpload` | `(file: File) => Promise<string>?` | Callback for image uploads |
120
126
 
121
127
  ### EditorContent
122
128
 
@@ -147,6 +153,8 @@ The EditorAPI is passed to plugins and provides the following methods:
147
153
  - `redo(): void` - Redoes the last action
148
154
  - `canUndo(): boolean` - Checks if undo is possible
149
155
  - `canRedo(): boolean` - Checks if redo is possible
156
+ - `indentListItem(): void` - Indents a list item (creates sub-list)
157
+ - `outdentListItem(): void` - Outdents a list item
150
158
 
151
159
  ### Plugin Interface
152
160
 
@@ -164,26 +172,30 @@ interface Plugin {
164
172
 
165
173
  ## Default Plugins
166
174
 
167
- - `boldPlugin` - Bold
168
- - `italicPlugin` - Italic
169
- - `underlinePlugin` - Underline
170
- - `undoPlugin` - Undo
171
- - `redoPlugin` - Redo
175
+ The `defaultPlugins` include:
176
+
177
+ - **Bold, Italic, Underline** - Text formatting
178
+ - **Undo/Redo** - History management
179
+ - **Block Format Dropdown** - Headings (h1-h3 by default), Lists (ul, ol), Blockquote
180
+ - **Clear Formatting** - Remove all formatting
181
+ - **Indent/Outdent** - List indentation (Tab/Shift+Tab)
172
182
 
173
183
  ## Optional Plugins
174
184
 
175
- - `linkPlugin` - Insert links
176
- - `blockquotePlugin` - Blockquotes
177
- - `unorderedListPlugin` - Unordered list
178
- - `orderedListPlugin` - Ordered list
185
+ - `linkPlugin` - Insert and edit links
186
+ - `createFontSizePlugin` - Font size selector
187
+ - `createColorPlugin` - Text color picker
188
+ - `createBackgroundColorPlugin` - Background color picker
189
+ - `createImagePlugin` - Image upload
190
+ - `createHeadingsPlugin` - Custom heading levels (if not using default block format)
179
191
 
180
192
  ## Creating Plugins
181
193
 
182
194
  ### Example: Simple Inline Plugin
183
195
 
184
196
  ```typescript
185
- import { Plugin, EditorAPI, ButtonProps } from "hendriks-rte";
186
- import { createInlinePlugin } from "hendriks-rte/plugins/base";
197
+ import { Plugin, EditorAPI, ButtonProps } from "@overlap/rte";
198
+ import { createInlinePlugin } from "@overlap/rte";
187
199
 
188
200
  const myPlugin = createInlinePlugin(
189
201
  "myPlugin",
@@ -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,CA+xBxC,CAAC"}
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;AAwBjE,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA2exC,CAAC"}
@@ -17,6 +17,7 @@ export declare const NumberedListIcon: React.FC<IconProps>;
17
17
  export declare const TextColorIcon: React.FC<IconProps>;
18
18
  export declare const BackgroundColorIcon: React.FC<IconProps>;
19
19
  export declare const HeadingIcon: React.FC<IconProps>;
20
+ export declare const FormatIcon: React.FC<IconProps>;
20
21
  export declare const FontSizeIcon: React.FC<IconProps>;
21
22
  export declare const ImageIcon: React.FC<IconProps>;
22
23
  export declare const CloseIcon: React.FC<IconProps>;
@@ -24,6 +25,7 @@ export declare const LoadingIcon: React.FC<IconProps>;
24
25
  export declare const UploadIcon: React.FC<IconProps>;
25
26
  export declare const IndentIcon: React.FC<IconProps>;
26
27
  export declare const OutdentIcon: React.FC<IconProps>;
28
+ export declare const CheckboxIcon: React.FC<IconProps>;
27
29
  export declare const Icon: React.FC<{
28
30
  icon: string;
29
31
  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,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"}
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,CAgCnD,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAc3C,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAe1C,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;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAc5C,CAAC;AA2BF,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"}
@@ -0,0 +1,9 @@
1
+ /** Debounce time for pushing to history after input (ms) */
2
+ export declare const HISTORY_DEBOUNCE_MS = 300;
3
+ /** Width of the clickable checkbox area in pixels */
4
+ export declare const CHECKBOX_CLICK_ZONE_PX = 40;
5
+ /** Maximum nesting depth for lists */
6
+ export declare const MAX_LIST_DEPTH = 6;
7
+ /** Maximum number of history entries */
8
+ export declare const MAX_HISTORY_SIZE = 50;
9
+ //# sourceMappingURL=constants.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,eAAO,MAAM,mBAAmB,MAAM,CAAC;AAEvC,qDAAqD;AACrD,eAAO,MAAM,sBAAsB,KAAK,CAAC;AAEzC,sCAAsC;AACtC,eAAO,MAAM,cAAc,IAAI,CAAC;AAEhC,wCAAwC;AACxC,eAAO,MAAM,gBAAgB,KAAK,CAAC"}
@@ -0,0 +1,23 @@
1
+ import { EditorContent } from "../types";
2
+ import { ensureAllCheckboxes, updateListItemChecked } from "../utils/checkbox";
3
+ interface UseCheckboxOptions {
4
+ editorRef: React.RefObject<HTMLDivElement | null>;
5
+ isUpdatingRef: React.MutableRefObject<boolean>;
6
+ pushToHistory: (content: EditorContent) => void;
7
+ notifyChange: (content: EditorContent) => void;
8
+ getDomContent: () => EditorContent;
9
+ }
10
+ /**
11
+ * Hook that manages all checkbox list interactions.
12
+ * Consolidates click handling, keyboard navigation, and checkbox insertion.
13
+ * Uses event delegation (single listener on editor root) for all checkbox events.
14
+ */
15
+ export declare function useCheckbox({ editorRef, isUpdatingRef, pushToHistory, notifyChange, getDomContent, }: UseCheckboxOptions): {
16
+ ensureAllCheckboxes: typeof ensureAllCheckboxes;
17
+ insertCheckboxList: (editor: HTMLElement) => boolean;
18
+ handleCheckboxKeyDown: (e: KeyboardEvent) => boolean;
19
+ handleCheckboxEnter: (e: KeyboardEvent) => boolean;
20
+ updateListItemChecked: typeof updateListItemChecked;
21
+ };
22
+ export {};
23
+ //# sourceMappingURL=useCheckbox.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useCheckbox.d.ts","sourceRoot":"","sources":["../../src/hooks/useCheckbox.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AACzC,OAAO,EACH,mBAAmB,EAInB,qBAAqB,EACxB,MAAM,mBAAmB,CAAC;AAS3B,UAAU,kBAAkB;IACxB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAClD,aAAa,EAAE,KAAK,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAC/C,aAAa,EAAE,CAAC,OAAO,EAAE,aAAa,KAAK,IAAI,CAAC;IAChD,YAAY,EAAE,CAAC,OAAO,EAAE,aAAa,KAAK,IAAI,CAAC;IAC/C,aAAa,EAAE,MAAM,aAAa,CAAC;CACtC;AAED;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,EACxB,SAAS,EACT,aAAa,EACb,aAAa,EACb,YAAY,EACZ,aAAa,GAChB,EAAE,kBAAkB;;iCA+NJ,WAAW,KAAG,OAAO;+BAvI1B,aAAa,KAAG,OAAO;6BAkFvB,aAAa,KAAG,OAAO;;EA6JlC"}
@@ -0,0 +1,18 @@
1
+ import { EditorContent } from "../types";
2
+ import { HistoryManager } from "../utils/history";
3
+ interface UseEditorEventsOptions {
4
+ editorRef: React.RefObject<HTMLDivElement | null>;
5
+ historyRef: React.MutableRefObject<HistoryManager>;
6
+ isUpdatingRef: React.MutableRefObject<boolean>;
7
+ notifyChange: (content: EditorContent) => void;
8
+ handleCheckboxKeyDown: (e: KeyboardEvent) => boolean;
9
+ handleCheckboxEnter: (e: KeyboardEvent) => boolean;
10
+ undo: () => void;
11
+ redo: () => void;
12
+ }
13
+ /**
14
+ * Hook that sets up input, keyup, and keydown event listeners on the editor.
15
+ */
16
+ export declare function useEditorEvents({ editorRef, historyRef, isUpdatingRef, notifyChange, handleCheckboxKeyDown, handleCheckboxEnter, undo, redo, }: UseEditorEventsOptions): void;
17
+ export {};
18
+ //# sourceMappingURL=useEditorEvents.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useEditorEvents.d.ts","sourceRoot":"","sources":["../../src/hooks/useEditorEvents.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAGzC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAGlD,UAAU,sBAAsB;IAC5B,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAClD,UAAU,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;IACnD,aAAa,EAAE,KAAK,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAC/C,YAAY,EAAE,CAAC,OAAO,EAAE,aAAa,KAAK,IAAI,CAAC;IAC/C,qBAAqB,EAAE,CAAC,CAAC,EAAE,aAAa,KAAK,OAAO,CAAC;IACrD,mBAAmB,EAAE,CAAC,CAAC,EAAE,aAAa,KAAK,OAAO,CAAC;IACnD,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,IAAI,EAAE,MAAM,IAAI,CAAC;CACpB;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,EAC5B,SAAS,EACT,UAAU,EACV,aAAa,EACb,YAAY,EACZ,qBAAqB,EACrB,mBAAmB,EACnB,IAAI,EACJ,IAAI,GACP,EAAE,sBAAsB,QAsGxB"}
@@ -0,0 +1,23 @@
1
+ import React from "react";
2
+ import { EditorContent } from "../types";
3
+ import { HistoryManager } from "../utils/history";
4
+ interface UseEditorInitOptions {
5
+ editorRef: React.RefObject<HTMLDivElement | null>;
6
+ historyRef: React.MutableRefObject<HistoryManager>;
7
+ isUpdatingRef: React.MutableRefObject<boolean>;
8
+ initialContent?: EditorContent;
9
+ notifyChange: (content: EditorContent) => void;
10
+ customLinkComponent?: React.ComponentType<{
11
+ href: string;
12
+ children: React.ReactNode;
13
+ [key: string]: unknown;
14
+ }>;
15
+ customHeadingRenderer?: (level: string, children: React.ReactNode) => React.ReactElement;
16
+ }
17
+ /**
18
+ * Hook that initializes the editor with initial content and sets up the MutationObserver.
19
+ * Runs once on mount.
20
+ */
21
+ export declare function useEditorInit({ editorRef, historyRef, isUpdatingRef, initialContent, customLinkComponent, customHeadingRenderer, }: UseEditorInitOptions): void;
22
+ export {};
23
+ //# sourceMappingURL=useEditorInit.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useEditorInit.d.ts","sourceRoot":"","sources":["../../src/hooks/useEditorInit.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAGzC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,UAAU,oBAAoB;IAC1B,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAClD,UAAU,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;IACnD,aAAa,EAAE,KAAK,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAC/C,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,YAAY,EAAE,CAAC,OAAO,EAAE,aAAa,KAAK,IAAI,CAAC;IAC/C,mBAAmB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QACtC,IAAI,EAAE,MAAM,CAAC;QACb,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;QAC1B,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;KAC1B,CAAC,CAAC;IACH,qBAAqB,CAAC,EAAE,CACpB,KAAK,EAAE,MAAM,EACb,QAAQ,EAAE,KAAK,CAAC,SAAS,KACxB,KAAK,CAAC,YAAY,CAAC;CAC3B;AAED;;;GAGG;AACH,wBAAgB,aAAa,CAAC,EAC1B,SAAS,EACT,UAAU,EACV,aAAa,EACb,cAAc,EACd,mBAAmB,EACnB,qBAAqB,GACxB,EAAE,oBAAoB,QAoEtB"}
@@ -0,0 +1,7 @@
1
+ /**
2
+ * Hook for editor selection management.
3
+ */
4
+ export declare function useEditorSelection(): {
5
+ restoreSelection: (editor: HTMLElement) => void;
6
+ };
7
+ //# sourceMappingURL=useEditorSelection.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useEditorSelection.d.ts","sourceRoot":"","sources":["../../src/hooks/useEditorSelection.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,wBAAgB,kBAAkB;+BACgB,WAAW;EAkB5D"}
package/dist/index.d.ts CHANGED
@@ -31,7 +31,7 @@ interface Plugin {
31
31
  type: 'inline' | 'block' | 'command';
32
32
  command?: string;
33
33
  renderButton?: (props: ButtonProps & {
34
- [key: string]: any;
34
+ [key: string]: unknown;
35
35
  }) => React.ReactElement;
36
36
  execute?: (editor: EditorAPI, value?: string) => void;
37
37
  isActive?: (editor: EditorAPI) => boolean;
@@ -81,7 +81,7 @@ interface EditorProps {
81
81
  customLinkComponent?: React.ComponentType<{
82
82
  href: string;
83
83
  children: React.ReactNode;
84
- [key: string]: any;
84
+ [key: string]: unknown;
85
85
  }>;
86
86
  fontSizes?: number[];
87
87
  colors?: string[];
@@ -129,8 +129,8 @@ declare const outdentListItemPlugin: Plugin;
129
129
  declare const defaultPlugins: Plugin[];
130
130
 
131
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"])
132
+ * Creates a Block Format plugin that combines headings, lists, and quote in a dropdown.
133
+ * @param headings - Array of heading levels (e.g. ["h1", "h2", "h3"])
134
134
  */
135
135
  declare function createBlockFormatPlugin(headings?: string[]): Plugin;
136
136
 
@@ -169,15 +169,32 @@ declare const unorderedListPlugin: Plugin;
169
169
  */
170
170
  declare const orderedListPlugin: Plugin;
171
171
 
172
+ /**
173
+ * Converts a DOM element (editor root) to EditorContent JSON.
174
+ * Supports own format, Lexical HTML, and GitHub HTML.
175
+ */
172
176
  declare function domToContent(element: HTMLElement): EditorContent;
177
+ /**
178
+ * Converts EditorContent JSON to DOM and appends to the container.
179
+ */
173
180
  declare function contentToDOM(content: EditorContent, container: HTMLElement, customLinkComponent?: React$1.ComponentType<{
174
181
  href: string;
175
182
  children: React$1.ReactNode;
176
- [key: string]: any;
183
+ [key: string]: unknown;
177
184
  }>, customHeadingRenderer?: (level: string, children: React$1.ReactNode) => React$1.ReactElement): void;
185
+ /**
186
+ * Creates empty editor content with a single paragraph.
187
+ */
178
188
  declare function createEmptyContent(): EditorContent;
179
- declare function htmlToContent(htmlString: string): EditorContent;
189
+ /**
190
+ * Converts EditorContent to an HTML string.
191
+ */
180
192
  declare function contentToHTML(content: EditorContent): string;
193
+ /**
194
+ * Converts an HTML string to EditorContent.
195
+ * Supports Lexical, GitHub, and standard HTML formats.
196
+ */
197
+ declare function htmlToContent(htmlString: string): EditorContent;
181
198
 
182
199
  declare class HistoryManager {
183
200
  private history;
@@ -218,5 +235,26 @@ declare function getCurrentBackgroundColor(editor: EditorAPI): string | undefine
218
235
  */
219
236
  declare function getCurrentHeading(editor: EditorAPI, availableHeadings: string[]): string | undefined;
220
237
 
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 };
238
+ /**
239
+ * Pure DOM utility functions.
240
+ * No React dependencies - only native browser APIs.
241
+ */
242
+ /**
243
+ * Checks if a UL element is a checkbox list.
244
+ * Detects: own format, Lexical format, and GitHub format.
245
+ */
246
+ declare function isCheckboxList(element: HTMLElement): boolean;
247
+ /**
248
+ * Finds the closest checkbox list ancestor from an element.
249
+ * Works with all supported formats (own, Lexical, GitHub).
250
+ */
251
+ declare function findClosestCheckboxList(element: HTMLElement): HTMLElement | null;
252
+
253
+ /**
254
+ * Ensures all checkbox list items in the editor have correct attributes.
255
+ * Normalizes foreign formats (Lexical, GitHub) to internal format.
256
+ */
257
+ declare function ensureAllCheckboxes(editor: HTMLElement): void;
258
+
259
+ export { Dropdown, Editor, HistoryManager, Toolbar, blockquotePlugin, boldPlugin, clearFormattingPlugin, contentToDOM, contentToHTML, createBackgroundColorPlugin, createBlockFormatPlugin, createEmptyContent, createFontSizePlugin, createHeadingsPlugin, createImagePlugin, createLinkPlugin, createTextColorPlugin, Editor as default, defaultPlugins, domToContent, ensureAllCheckboxes, findClosestCheckboxList, getCurrentBackgroundColor, getCurrentFontSize, getCurrentHeading, getCurrentTextColor, htmlToContent, indentListItem, indentListItemPlugin, isCheckboxList, italicPlugin, linkPlugin, orderedListPlugin, outdentListItem, outdentListItemPlugin, redoPlugin, underlinePlugin, undoPlugin, unorderedListPlugin };
222
260
  export type { ButtonProps, CustomRenderer, EditorAPI, EditorContent, EditorNode, EditorProps, Plugin };
@@ -1 +1 @@
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"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAG/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;AAGnC,cAAc,SAAS,CAAC;AAGxB,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAG/D,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrE,cAAc,yBAAyB,CAAC;AAGxC,OAAO,EAAE,cAAc,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAC;AAGtE,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAGvD,OAAO,EAAE,MAAM,IAAI,OAAO,EAAE,MAAM,qBAAqB,CAAC"}