@svadmin/editor 0.4.6 → 0.5.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.
@@ -1,7 +1,8 @@
1
1
  <script lang="ts">
2
- /* eslint-disable @typescript-eslint/no-explicit-any */
3
- import { Editor } from '@tiptap/core';
4
- import { fullPreset, minimalPreset, prosePreset, type EditorPresetOptions } from '../extensions/index.js';
2
+ import { definedOptions } from '@svadmin/core/options';
3
+
4
+ import { Editor as TiptapEditor } from '@tiptap/core';
5
+ import { fullPreset, minimalPreset, prosePreset, type EditorPresetOptions, type Lowlight } from '../extensions/index.js';
5
6
  import type { AnyExtension } from '@tiptap/core';
6
7
  import Toolbar from './Toolbar.svelte';
7
8
  import BubbleMenuComp from './BubbleMenu.svelte';
@@ -43,7 +44,7 @@
43
44
  /** Max height for the editor content area */
44
45
  maxHeight?: string;
45
46
  /** lowlight instance for syntax-highlighted code blocks */
46
- lowlight?: unknown;
47
+ lowlight?: Lowlight;
47
48
  }
48
49
 
49
50
  let {
@@ -67,7 +68,7 @@
67
68
  }: Props = $props();
68
69
 
69
70
  let editorElement: HTMLDivElement | undefined = $state();
70
- let editor: Editor | null = $state(null);
71
+ let editor: TiptapEditor | null = $state(null);
71
72
 
72
73
  // Track whether we're updating externally to prevent loops
73
74
  let isUpdatingFromExternal = false;
@@ -77,11 +78,11 @@
77
78
  function buildExtensions(): AnyExtension[] {
78
79
  if (customExtensions) return customExtensions;
79
80
 
80
- const opts: EditorPresetOptions = {
81
+ const opts: EditorPresetOptions = definedOptions({
81
82
  placeholder,
82
83
  maxLength,
83
84
  lowlight,
84
- };
85
+ });
85
86
 
86
87
  switch (preset) {
87
88
  case 'minimal': return minimalPreset(opts);
@@ -97,7 +98,7 @@
97
98
 
98
99
  const ext = buildExtensions();
99
100
 
100
- editor = new Editor({
101
+ editor = new TiptapEditor({
101
102
  element: editorElement,
102
103
  extensions: ext,
103
104
  content: value || '',
@@ -111,16 +112,16 @@
111
112
  handleDrop(view, event, slice, moved) {
112
113
  if (!moved && event.dataTransfer?.files?.length && onUpload) {
113
114
  const files = event.dataTransfer.files;
114
- for (let i = 0; i < files.length; i++) {
115
- const file = files[i];
115
+ for (const file of files) {
116
116
  if (file.type.startsWith('image/')) {
117
117
  event.preventDefault();
118
118
  onUpload(file).then((url) => {
119
119
  if (editor) {
120
120
  const { schema } = editor.state;
121
121
  const pos = view.posAtCoords({ left: event.clientX, top: event.clientY });
122
- if (pos) {
123
- const node = schema.nodes.image.create({ src: url, alt: file.name });
122
+ const imageNode = schema.nodes['image'];
123
+ if (pos && imageNode) {
124
+ const node = imageNode.create({ src: url, alt: file.name });
124
125
  const transaction = view.state.tr.insert(pos.pos, node);
125
126
  view.dispatch(transaction);
126
127
  }
@@ -136,8 +137,7 @@
136
137
  handlePaste(view, event) {
137
138
  const items = event.clipboardData?.items;
138
139
  if (items && onUpload) {
139
- for (let i = 0; i < items.length; i++) {
140
- const item = items[i];
140
+ for (const item of items) {
141
141
  if (item.type.startsWith('image/')) {
142
142
  event.preventDefault();
143
143
  const file = item.getAsFile();
@@ -191,13 +191,13 @@
191
191
  });
192
192
 
193
193
  // Character count
194
- const charCount = $derived(((editor as any)?.storage as Record<string, any>)?.characterCount?.characters() ?? 0);
195
- const wordCount = $derived(((editor as any)?.storage as Record<string, any>)?.characterCount?.words() ?? 0);
194
+ const charCount = $derived.by(() => editor?.storage.characterCount?.characters() ?? 0);
195
+ const wordCount = $derived.by(() => editor?.storage.characterCount?.words() ?? 0);
196
196
  </script>
197
197
 
198
198
  <div class="svadmin-editor {className}">
199
199
  {#if showToolbar && editor}
200
- <Toolbar {editor} {onUpload} {preset} />
200
+ <Toolbar {editor} {...definedOptions({ "onUpload": onUpload })} {preset} />
201
201
  {/if}
202
202
 
203
203
  <div
@@ -1,4 +1,4 @@
1
- import { Editor } from '@tiptap/core';
1
+ import { type Lowlight } from '../extensions/index.js';
2
2
  import type { AnyExtension } from '@tiptap/core';
3
3
  import '../styles/editor.css';
4
4
  interface Props {
@@ -35,7 +35,7 @@ interface Props {
35
35
  /** Max height for the editor content area */
36
36
  maxHeight?: string;
37
37
  /** lowlight instance for syntax-highlighted code blocks */
38
- lowlight?: unknown;
38
+ lowlight?: Lowlight;
39
39
  }
40
40
  declare const Editor: import("svelte").Component<Props, {}, "value">;
41
41
  type Editor = ReturnType<typeof Editor>;
@@ -25,6 +25,8 @@ import TableHeader from '@tiptap/extension-table-header';
25
25
  import TableCell from '@tiptap/extension-table-cell';
26
26
  import CodeBlockLowlight from '@tiptap/extension-code-block-lowlight';
27
27
  import type { AnyExtension } from '@tiptap/core';
28
+ import type { createLowlight } from 'lowlight';
29
+ export type Lowlight = ReturnType<typeof createLowlight>;
28
30
  export interface EditorPresetOptions {
29
31
  /** Placeholder text */
30
32
  placeholder?: string;
@@ -33,7 +35,7 @@ export interface EditorPresetOptions {
33
35
  /** Enable code block syntax highlighting */
34
36
  codeHighlight?: boolean;
35
37
  /** lowlight instance (required if codeHighlight is true) */
36
- lowlight?: unknown;
38
+ lowlight?: Lowlight;
37
39
  }
38
40
  /**
39
41
  * Full preset: all extensions enabled.
@@ -1,3 +1,4 @@
1
+ import { definedOptions } from '@svadmin/core/options';
1
2
  /**
2
3
  * @svadmin/editor — Extension presets
3
4
  *
@@ -30,10 +31,10 @@ import CodeBlockLowlight from '@tiptap/extension-code-block-lowlight';
30
31
  */
31
32
  export function fullPreset(options = {}) {
32
33
  const extensions = [
33
- StarterKit.configure({
34
+ StarterKit.configure(definedOptions({
34
35
  // Disable default code block in favor of CodeBlockLowlight
35
36
  codeBlock: options.codeHighlight ? false : undefined,
36
- }),
37
+ })),
37
38
  Underline,
38
39
  TextStyle,
39
40
  Color,
@@ -117,9 +118,9 @@ export function minimalPreset(options = {}) {
117
118
  */
118
119
  export function prosePreset(options = {}) {
119
120
  const extensions = [
120
- StarterKit.configure({
121
+ StarterKit.configure(definedOptions({
121
122
  codeBlock: options.codeHighlight ? false : undefined,
122
- }),
123
+ })),
123
124
  Underline,
124
125
  TextStyle,
125
126
  Color,
package/dist/index.d.ts CHANGED
@@ -23,7 +23,7 @@ export { default as ColorPicker } from './components/ColorPicker.svelte';
23
23
  export { default as LinkPopover } from './components/LinkPopover.svelte';
24
24
  export { default as TableMenu } from './components/TableMenu.svelte';
25
25
  export { default as ImageUpload } from './components/ImageUpload.svelte';
26
- export { fullPreset, minimalPreset, prosePreset, type EditorPresetOptions, } from './extensions/index.js';
26
+ export { fullPreset, minimalPreset, prosePreset, type EditorPresetOptions, type Lowlight, } from './extensions/index.js';
27
27
  export { StarterKit, Underline, TextAlign, TextStyle, Color, Highlight, Link, Image, Placeholder, CharacterCount, Typography, Subscript, Superscript, TaskList, TaskItem, Table, TableRow, TableHeader, TableCell, CodeBlockLowlight, } from './extensions/index.js';
28
28
  export { Editor as TiptapEditor } from '@tiptap/core';
29
29
  export type { AnyExtension, Extension, Mark, Node } from '@tiptap/core';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@svadmin/editor",
3
- "version": "0.4.6",
3
+ "version": "0.5.6",
4
4
  "description": "Modern Tiptap-based rich text editor for Svelte 5 — headless, modular, production-ready",
5
5
  "type": "module",
6
6
  "sideEffects": [
@@ -37,7 +37,7 @@
37
37
  },
38
38
  "peerDependencies": {
39
39
  "svelte": "^5.56.10",
40
- "@svadmin/core": "^0.49.1"
40
+ "@svadmin/core": "^0.52.0"
41
41
  },
42
42
  "dependencies": {
43
43
  "@lucide/svelte": "^1.35.0",
@@ -79,7 +79,7 @@
79
79
  "author": "zuohuadong",
80
80
  "repository": {
81
81
  "type": "git",
82
- "url": "https://github.com/vibeunion/svadmin.git",
82
+ "url": "git+https://github.com/vibeunion/svadmin.git",
83
83
  "directory": "packages/editor"
84
84
  },
85
85
  "peerDependenciesMeta": {