@neocodemirror/svelte - npm Package Compare versions

Comparing version 0.0.14 to 0.0.15

./dist/index.js

@@ -16,8 +16,3 @@ import { defaultKeymap, indentWithTab } from '@codemirror/commands';
     throw new Error("No options provided. At least `value` is required.");
-  let {
-    value,
-    instanceStore,
-    diagnostics,
-    onChangeBehavior = { kind: "debounce", duration: 50 }
-  } = options;
+  let { value, instanceStore, onChangeBehavior = { kind: "debounce", duration: 50 } } = options;
   let fulfill_editor_initialized;
@@ -34,5 +29,6 @@ let editor_initialized = new Promise((r) => fulfill_editor_initialized = r);
   const autocomplete_compartment = new Compartment();
+  const linter_compartment = new Compartment();
   const watcher = EditorView.updateListener.of((view_update) => on_change(view_update));
   async function make_extensions(options2) {
-    return [
+    return Promise.all([
       watcher,
@@ -49,4 +45,5 @@ // User extensions matter the most, keep em on top
       tabs_compartment.of(await get_tab_setting(options2)),
-      readonly_compartment.of(get_readonly(options2))
-    ];
+      readonly_compartment.of(get_readonly(options2)),
+      linter_compartment.of(await get_linter(options2))
+    ]);
   }
@@ -78,10 +75,4 @@ function handle_change(view_update) {
     });
-    make_diagnostics(view, diagnostics);
     if (!is_undefined(options.cursorPos))
       view.focus();
-    instanceStore?.set({
-      view,
-      extensions: internal_extensions,
-      value
-    });
     fulfill_editor_initialized();
@@ -110,14 +101,16 @@ })();
         transaction.effects = transaction.effects ?? [];
+        const effects = transaction.effects;
+        let are_all_options_undefined = true;
         for (const option_name of options_list) {
           const new_option = new_options[option_name];
           const old_option = options[option_name];
-          const effects = transaction.effects;
-          if (typeof new_option !== "undefined") {
-            if (new_option !== old_option) {
-              effects.push(compartment.reconfigure(await factory(new_options)));
+          if (!is_undefined(new_option)) {
+            are_all_options_undefined = false;
+            if (!is_equal(new_option, old_option)) {
+              return effects.push(compartment.reconfigure(await factory(new_options)));
             }
-          } else {
-            return effects.push(compartment.reconfigure([]));
           }
         }
+        if (are_all_options_undefined)
+          effects.push(compartment.reconfigure([]));
       }
@@ -131,12 +124,6 @@ await Promise.all([
         append_effect(readonly_compartment, ["readonly"], get_readonly),
-        append_effect(autocomplete_compartment, ["autocomplete"], get_autocompletion)
+        append_effect(autocomplete_compartment, ["autocomplete"], get_autocompletion),
+        append_effect(linter_compartment, ["lint", "lintOptions"], get_linter)
       ]);
       view.dispatch(transaction);
-      make_diagnostics(view, new_options.diagnostics);
-      internal_extensions = await make_extensions(new_options);
-      instanceStore?.set({
-        view,
-        extensions: internal_extensions,
-        value
-      });
       const { kind: behaviorKind2 = "debounce", duration: behaviorDuration2 = 50 } = new_options.onChangeBehavior ?? { kind: "debounce", duration: 50 };
@@ -147,2 +134,3 @@ if (!is_equal(options.onChangeBehavior?.kind, behaviorKind2) || !is_equal(options.onChangeBehavior?.duration, behaviorDuration2)) {
       options = new_options;
+      internal_extensions = await make_extensions(new_options);
     },
@@ -197,11 +185,13 @@ destroy() {
 }
-async function make_diagnostics(view, diagnostics) {
-  if (is_undefined(diagnostics))
-    return;
-  const { setDiagnostics } = await import('@codemirror/lint');
-  const tr = setDiagnostics(view.state, diagnostics ?? []);
-  view.dispatch(tr);
+async function get_linter({ lint, lintOptions = {} }) {
+  if (is_undefined(lint))
+    return [];
+  if (!is_function(lint))
+    throw new Error("`lint` must be a function.");
+  const { linter } = await import('@codemirror/lint');
+  return linter(lint, lintOptions);
 }
 var is_equal = (a, b) => a === b;
 var is_undefined = (a) => typeof a === "undefined";
+var is_function = (a) => typeof a === "function";
 function debounce(func, threshold, execAsap = false) {
@@ -208,0 +198,0 @@ let timeout;

dist/index.d.ts

 import * as _codemirror_autocomplete from '@codemirror/autocomplete';
 import { LanguageSupport } from '@codemirror/language';
-import { Diagnostic } from '@codemirror/lint';
+import { LintSource, linter } from '@codemirror/lint';
 import { Extension, Transaction } from '@codemirror/state';
@@ -227,3 +227,5 @@ import { EditorView } from '@codemirror/view';
     /**
-     * Diagnostics data to pass to the editor. Defaults to none.
+     * A (possibly async) function to provide diagnostic hints for your code(squiggles for error, warning, info, etc).
+     * Runs everytime user types with a debounce duration.
+     * Can be pared with `lintOptions` to lint the editor. Defaults to nothing.
      *
@@ -237,4 +239,4 @@ * @default undefined
      *
-     * 	const diagnostics = [
-     * 		{
+     * 	function lint() {
+     * 		return [{
      * 			from: 0,
@@ -244,4 +246,4 @@ * 			to: 10,
      * 			severity: 'error'
-     * 		}
-     * 	];
+     * 		}]
+     * 	};
      *
@@ -251,3 +253,3 @@ * 	const lang = javascript({ typescript: true });
      *
-     * <div use:codemirror={{ lang, diagnostics }} />
+     * <div use:codemirror={{ lang, lint }} />
      * ```
@@ -257,4 +259,25 @@ *
      */
-    diagnostics?: Diagnostic[];
+    lint?: LintSource;
     /**
+     * Options to pass to the linter. Defaults to none.
+     *
+     * @default undefined
+     *
+     * @example
+     * ```svelte
+     * <script>
+     * 	import { javascript } from '@codemirror/lang-javascript';
+     *
+     * 	function lint() {
+     * 		// Omitted for brevity
+     * 	}
+     *
+     * 	const lang = javascript({ typescript: true });
+     * </script>
+     *
+     * <div use:codemirror={{ lang, lint, lintOptions: { delay: 100 } }} />
+     * ```
+     */
+    lintOptions?: Parameters<typeof linter>[1];
+    /**
      * The extensions to use. Defaults to empty array.
@@ -261,0 +284,0 @@ *

dist/index.js

@@ -16,8 +16,3 @@ import { defaultKeymap, indentWithTab } from '@codemirror/commands';
     throw new Error("No options provided. At least `value` is required.");
-  let {
-    value,
-    instanceStore,
-    diagnostics,
-    onChangeBehavior = { kind: "debounce", duration: 50 }
-  } = options;
+  let { value, instanceStore, onChangeBehavior = { kind: "debounce", duration: 50 } } = options;
   let fulfill_editor_initialized;
@@ -34,5 +29,6 @@ let editor_initialized = new Promise((r) => fulfill_editor_initialized = r);
   const autocomplete_compartment = new Compartment();
+  const linter_compartment = new Compartment();
   const watcher = EditorView.updateListener.of((view_update) => on_change(view_update));
   async function make_extensions(options2) {
-    return [
+    return Promise.all([
       watcher,
@@ -49,4 +45,5 @@ // User extensions matter the most, keep em on top
       tabs_compartment.of(await get_tab_setting(options2)),
-      readonly_compartment.of(get_readonly(options2))
-    ];
+      readonly_compartment.of(get_readonly(options2)),
+      linter_compartment.of(await get_linter(options2))
+    ]);
   }
@@ -78,10 +75,4 @@ function handle_change(view_update) {
     });
-    make_diagnostics(view, diagnostics);
     if (!is_undefined(options.cursorPos))
       view.focus();
-    instanceStore?.set({
-      view,
-      extensions: internal_extensions,
-      value
-    });
     fulfill_editor_initialized();
@@ -110,14 +101,16 @@ })();
         transaction.effects = transaction.effects ?? [];
+        const effects = transaction.effects;
+        let are_all_options_undefined = true;
         for (const option_name of options_list) {
           const new_option = new_options[option_name];
           const old_option = options[option_name];
-          const effects = transaction.effects;
-          if (typeof new_option !== "undefined") {
-            if (new_option !== old_option) {
-              effects.push(compartment.reconfigure(await factory(new_options)));
+          if (!is_undefined(new_option)) {
+            are_all_options_undefined = false;
+            if (!is_equal(new_option, old_option)) {
+              return effects.push(compartment.reconfigure(await factory(new_options)));
             }
-          } else {
-            return effects.push(compartment.reconfigure([]));
           }
         }
+        if (are_all_options_undefined)
+          effects.push(compartment.reconfigure([]));
       }
@@ -131,12 +124,6 @@ await Promise.all([
         append_effect(readonly_compartment, ["readonly"], get_readonly),
-        append_effect(autocomplete_compartment, ["autocomplete"], get_autocompletion)
+        append_effect(autocomplete_compartment, ["autocomplete"], get_autocompletion),
+        append_effect(linter_compartment, ["lint", "lintOptions"], get_linter)
       ]);
       view.dispatch(transaction);
-      make_diagnostics(view, new_options.diagnostics);
-      internal_extensions = await make_extensions(new_options);
-      instanceStore?.set({
-        view,
-        extensions: internal_extensions,
-        value
-      });
       const { kind: behaviorKind2 = "debounce", duration: behaviorDuration2 = 50 } = new_options.onChangeBehavior ?? { kind: "debounce", duration: 50 };
@@ -147,2 +134,3 @@ if (!is_equal(options.onChangeBehavior?.kind, behaviorKind2) || !is_equal(options.onChangeBehavior?.duration, behaviorDuration2)) {
       options = new_options;
+      internal_extensions = await make_extensions(new_options);
     },
@@ -197,11 +185,13 @@ destroy() {
 }
-async function make_diagnostics(view, diagnostics) {
-  if (is_undefined(diagnostics))
-    return;
-  const { setDiagnostics } = await import('@codemirror/lint');
-  const tr = setDiagnostics(view.state, diagnostics ?? []);
-  view.dispatch(tr);
+async function get_linter({ lint, lintOptions = {} }) {
+  if (is_undefined(lint))
+    return [];
+  if (!is_function(lint))
+    throw new Error("`lint` must be a function.");
+  const { linter } = await import('@codemirror/lint');
+  return linter(lint, lintOptions);
 }
 var is_equal = (a, b) => a === b;
 var is_undefined = (a) => typeof a === "undefined";
+var is_function = (a) => typeof a === "function";
 function debounce(func, threshold, execAsap = false) {
@@ -208,0 +198,0 @@ let timeout;

package.json

 {
   "name": "@neocodemirror/svelte",
-  "version": "0.0.14",
+  "version": "0.0.15",
   "description": "Svelte Action to add codemirro to your apps 😉",
@@ -5,0 +5,0 @@ "main": "./dist/index.js",

No alert changes

Improved metrics

Total package byte prevSize

32634

increased by2.56%

Lines of code

849

increased by0.35%

No dependency changes