@prosekit/svelte 0.7.1 → 0.8.0

package/dist/build/components/client-update/index.d.ts

@@ -1,3 +1,2 @@
-import ClientUpdate from './client-update.svelte';
-export { ClientUpdate };
+export { default as ClientUpdate } from './client-update.svelte';
 //# sourceMappingURL=index.d.ts.map

package/dist/build/components/client-update/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/client-update/index.ts"],"names":[],"mappings":"AAAA,OAAO,YAAY,MAAM,wBAAwB,CAAA;AAEjD,OAAO,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/client-update/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,wBAAwB,CAAA"}

package/dist/build/components/client-update/index.js

@@ -1,2 +1 @@
-import ClientUpdate from './client-update.svelte';
-export { ClientUpdate };
+export { default as ClientUpdate } from './client-update.svelte';

package/dist/build/hooks/use-editor-derived-value.d.ts

@@ -0,0 +1,30 @@
+import type { Editor, Extension } from '@prosekit/core';
+import { type Readable } from 'svelte/store';
+export interface UseEditorDerivedOptions<E extends Extension = any> {
+    /**
+     * The editor to add the extension to. If not provided, it will use the
+     * editor from the nearest `<ProseKit>` component.
+     */
+    editor?: Editor<E>;
+}
+/**
+ * Runs a function to derive a value from the editor instance after editor state
+ * changes.
+ *
+ * This is useful when you need to render something based on the editor state,
+ * for example, whether the selected text is wrapped in an italic mark.
+ *
+ * It returns a Svelte store that stores the derived value and updates whenever
+ * the editor state changes.
+ *
+ * @public
+ */
+export declare function useEditorDerivedValue<E extends Extension, Derived>(
+/**
+ * A function that receives the editor instance and returns a derived value.
+ *
+ * It will be called whenever the editor's document state changes, or when it
+ * mounts.
+ */
+derive: (editor: Editor<E>) => Derived, options?: UseEditorDerivedOptions<E>): Readable<Derived>;
+//# sourceMappingURL=use-editor-derived-value.d.ts.map

package/dist/build/hooks/use-editor-derived-value.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-editor-derived-value.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-editor-derived-value.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,MAAM,EACN,SAAS,EACV,MAAM,gBAAgB,CAAA;AACvB,OAAO,EAGL,KAAK,QAAQ,EACd,MAAM,cAAc,CAAA;AAIrB,MAAM,WAAW,uBAAuB,CAAC,CAAC,SAAS,SAAS,GAAG,GAAG;IAChE;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC,CAAA;CACnB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,qBAAqB,CAAC,CAAC,SAAS,SAAS,EAAE,OAAO;AAChE;;;;;GAKG;AACH,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,KAAK,OAAO,EACtC,OAAO,CAAC,EAAE,uBAAuB,CAAC,CAAC,CAAC,GACnC,QAAQ,CAAC,OAAO,CAAC,CAOnB"}

package/dist/build/hooks/use-editor-derived-value.js

@@ -0,0 +1,28 @@
+import { derived, readable, } from 'svelte/store';
+import { useEditor } from './use-editor';
+/**
+ * Runs a function to derive a value from the editor instance after editor state
+ * changes.
+ *
+ * This is useful when you need to render something based on the editor state,
+ * for example, whether the selected text is wrapped in an italic mark.
+ *
+ * It returns a Svelte store that stores the derived value and updates whenever
+ * the editor state changes.
+ *
+ * @public
+ */
+export function useEditorDerivedValue(
+/**
+ * A function that receives the editor instance and returns a derived value.
+ *
+ * It will be called whenever the editor's document state changes, or when it
+ * mounts.
+ */
+derive, options) {
+    const initialEditor = options?.editor;
+    const editorStore = initialEditor
+        ? readable(initialEditor)
+        : useEditor({ update: true });
+    return derived(editorStore, derive);
+}

package/dist/build/hooks/use-extension.d.ts

@@ -3,7 +3,7 @@ import type { Readable } from 'svelte/store';
 export interface UseExtensionOptions {
     /**
      * The editor to add the extension to. If not provided, it will use the
-     * editor from the nearest `ProseKit` component.
+     * editor from the nearest `<ProseKit>` component.
      */
     editor?: Editor;
     /**

package/dist/build/index.d.ts

@@ -3,6 +3,7 @@ export { defineSvelteMarkView, type SvelteMarkViewComponent, type SvelteMarkView
 export { defineSvelteNodeView, type SvelteNodeViewComponent, type SvelteNodeViewOptions, type SvelteNodeViewProps, } from './extensions/svelte-node-view';
 export { useDocChange } from './hooks/use-doc-change';
 export { useEditor } from './hooks/use-editor';
+export { useEditorDerivedValue, type UseEditorDerivedOptions, } from './hooks/use-editor-derived-value';
 export { useExtension, type UseExtensionOptions, } from './hooks/use-extension';
 export { useKeymap } from './hooks/use-keymap';
 export { useStateUpdate } from './hooks/use-state-update';

package/dist/build/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EACR,KAAK,aAAa,GACnB,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EACL,oBAAoB,EACpB,KAAK,uBAAuB,EAC5B,KAAK,qBAAqB,EAC1B,KAAK,mBAAmB,GACzB,MAAM,+BAA+B,CAAA;AACtC,OAAO,EACL,oBAAoB,EACpB,KAAK,uBAAuB,EAC5B,KAAK,qBAAqB,EAC1B,KAAK,mBAAmB,GACzB,MAAM,+BAA+B,CAAA;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AAC9C,OAAO,EACL,YAAY,EACZ,KAAK,mBAAmB,GACzB,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAA;AACzD,YAAY,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EACR,KAAK,aAAa,GACnB,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EACL,oBAAoB,EACpB,KAAK,uBAAuB,EAC5B,KAAK,qBAAqB,EAC1B,KAAK,mBAAmB,GACzB,MAAM,+BAA+B,CAAA;AACtC,OAAO,EACL,oBAAoB,EACpB,KAAK,uBAAuB,EAC5B,KAAK,qBAAqB,EAC1B,KAAK,mBAAmB,GACzB,MAAM,+BAA+B,CAAA;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AAC9C,OAAO,EACL,qBAAqB,EACrB,KAAK,uBAAuB,GAC7B,MAAM,kCAAkC,CAAA;AACzC,OAAO,EACL,YAAY,EACZ,KAAK,mBAAmB,GACzB,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAA;AACzD,YAAY,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA"}

package/dist/build/index.js

@@ -3,6 +3,7 @@ export { defineSvelteMarkView, } from './extensions/svelte-mark-view';
 export { defineSvelteNodeView, } from './extensions/svelte-node-view';
 export { useDocChange } from './hooks/use-doc-change';
 export { useEditor } from './hooks/use-editor';
+export { useEditorDerivedValue, } from './hooks/use-editor-derived-value';
 export { useExtension, } from './hooks/use-extension';
 export { useKeymap } from './hooks/use-keymap';
 export { useStateUpdate } from './hooks/use-state-update';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@prosekit/svelte",
   "type": "module",
-  "version": "0.7.1",
+  "version": "0.8.0",
   "private": false,
   "description": "Svelte components and utilities for ProseKit",
   "author": {
@@ -76,11 +76,11 @@
     "src"
   ],
   "dependencies": {
-    "@prosemirror-adapter/core": "^0.4.2",
-    "@prosemirror-adapter/svelte": "^0.4.3",
+    "@prosemirror-adapter/core": "^0.4.6",
+    "@prosemirror-adapter/svelte": "^0.4.6",
+    "@prosekit/pm": "^0.1.13",
     "@prosekit/core": "^0.8.4",
-    "@prosekit/web": "^0.7.4",
-    "@prosekit/pm": "^0.1.12"
+    "@prosekit/web": "^0.7.5"
   },
   "peerDependencies": {
     "svelte": ">= 5.0.0"
@@ -91,13 +91,13 @@
     }
   },
   "devDependencies": {
-    "@sveltejs/package": "^2.5.0",
+    "@sveltejs/package": "^2.5.4",
     "@types/node": "^20.19.11",
     "read-pkg": "^9.0.1",
-    "svelte": "^5.38.7",
-    "svelte-check": "^4.3.1",
-    "tsx": "^4.20.5",
-    "typescript": "~5.9.2"
+    "svelte": "^5.43.0",
+    "svelte-check": "^4.3.3",
+    "tsx": "^4.20.6",
+    "typescript": "~5.9.3"
   },
   "publishConfig": {
     "dev": {}

package/src/components/client-update/index.ts

@@ -1,3 +1 @@
-import ClientUpdate from './client-update.svelte'
-
-export { ClientUpdate }
+export { default as ClientUpdate } from './client-update.svelte'

package/src/hooks/use-editor-derived-value.ts

@@ -0,0 +1,49 @@
+import type {
+  Editor,
+  Extension,
+} from '@prosekit/core'
+import {
+  derived,
+  readable,
+  type Readable,
+} from 'svelte/store'
+
+import { useEditor } from './use-editor'
+
+export interface UseEditorDerivedOptions<E extends Extension = any> {
+  /**
+   * The editor to add the extension to. If not provided, it will use the
+   * editor from the nearest `<ProseKit>` component.
+   */
+  editor?: Editor<E>
+}
+
+/**
+ * Runs a function to derive a value from the editor instance after editor state
+ * changes.
+ *
+ * This is useful when you need to render something based on the editor state,
+ * for example, whether the selected text is wrapped in an italic mark.
+ *
+ * It returns a Svelte store that stores the derived value and updates whenever
+ * the editor state changes.
+ *
+ * @public
+ */
+export function useEditorDerivedValue<E extends Extension, Derived>(
+  /**
+   * A function that receives the editor instance and returns a derived value.
+   *
+   * It will be called whenever the editor's document state changes, or when it
+   * mounts.
+   */
+  derive: (editor: Editor<E>) => Derived,
+  options?: UseEditorDerivedOptions<E>,
+): Readable<Derived> {
+  const initialEditor = options?.editor
+  const editorStore: Readable<Editor<E>> = initialEditor
+    ? readable(initialEditor)
+    : useEditor<E>({ update: true })
+
+  return derived(editorStore, derive)
+}

package/src/hooks/use-extension.ts

@@ -11,7 +11,7 @@ import { usePriorityExtension } from './use-priority-extension'
 export interface UseExtensionOptions {
   /**
    * The editor to add the extension to. If not provided, it will use the
-   * editor from the nearest `ProseKit` component.
+   * editor from the nearest `<ProseKit>` component.
    */
   editor?: Editor
 

package/src/index.ts

@@ -16,6 +16,10 @@ export {
 } from './extensions/svelte-node-view'
 export { useDocChange } from './hooks/use-doc-change'
 export { useEditor } from './hooks/use-editor'
+export {
+  useEditorDerivedValue,
+  type UseEditorDerivedOptions,
+} from './hooks/use-editor-derived-value'
 export {
   useExtension,
   type UseExtensionOptions,