@seljs/editor 1.0.1-beta.9 → 1.1.0-beta.1

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/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # Changelog
2
2
 
3
+ ## [1.0.1](https://github.com/abinnovision/seljs/compare/editor-v1.0.0...editor-v1.0.1) (2026-03-16)
4
+
5
+
6
+ ### Bug Fixes
7
+
8
+ * export esm and cjs ([#23](https://github.com/abinnovision/seljs/issues/23)) ([23d525d](https://github.com/abinnovision/seljs/commit/23d525d9084d18a370d4c6307b983a857a865f59))
9
+
3
10
  ## 1.0.0 (2026-03-13)
4
11
 
5
12
 
@@ -2,7 +2,7 @@ const require_editor_config = require("./editor-config.cjs");
2
2
  let _codemirror_state = require("@codemirror/state");
3
3
  let _codemirror_view = require("@codemirror/view");
4
4
  //#region src/editor/create-editor.ts
5
- function createSELEditor(config) {
5
+ const createSELEditor = (config) => {
6
6
  const extensions = require_editor_config.buildExtensions(config);
7
7
  return new _codemirror_view.EditorView({
8
8
  state: _codemirror_state.EditorState.create({
@@ -11,6 +11,6 @@ function createSELEditor(config) {
11
11
  }),
12
12
  parent: config.parent
13
13
  });
14
- }
14
+ };
15
15
  //#endregion
16
16
  exports.createSELEditor = createSELEditor;
@@ -2,6 +2,6 @@ import { SELEditorConfig } from "./types.cjs";
2
2
  import { EditorView } from "@codemirror/view";
3
3
 
4
4
  //#region src/editor/create-editor.d.ts
5
- declare function createSELEditor(config: SELEditorConfig): EditorView;
5
+ declare const createSELEditor: (config: SELEditorConfig) => EditorView;
6
6
  //#endregion
7
7
  export { createSELEditor };
@@ -2,6 +2,6 @@ import { SELEditorConfig } from "./types.mjs";
2
2
  import { EditorView } from "@codemirror/view";
3
3
 
4
4
  //#region src/editor/create-editor.d.ts
5
- declare function createSELEditor(config: SELEditorConfig): EditorView;
5
+ declare const createSELEditor: (config: SELEditorConfig) => EditorView;
6
6
  //#endregion
7
7
  export { createSELEditor };
@@ -2,7 +2,7 @@ import { buildExtensions } from "./editor-config.mjs";
2
2
  import { EditorState } from "@codemirror/state";
3
3
  import { EditorView } from "@codemirror/view";
4
4
  //#region src/editor/create-editor.ts
5
- function createSELEditor(config) {
5
+ const createSELEditor = (config) => {
6
6
  const extensions = buildExtensions(config);
7
7
  return new EditorView({
8
8
  state: EditorState.create({
@@ -11,6 +11,6 @@ function createSELEditor(config) {
11
11
  }),
12
12
  parent: config.parent
13
13
  });
14
- }
14
+ };
15
15
  //#endregion
16
16
  export { createSELEditor };
@@ -1,6 +1,8 @@
1
1
  const require_tokenizer_config = require("../language/tokenizer-config.cjs");
2
2
  const require_schema_completion = require("../completion/schema-completion.cjs");
3
+ require("../completion/index.cjs");
3
4
  const require_sel_linter = require("../linting/sel-linter.cjs");
5
+ require("../linting/index.cjs");
4
6
  const require_theme = require("./theme.cjs");
5
7
  const require_type_display = require("./type-display.cjs");
6
8
  const require_semantic_highlighter = require("../language/semantic-highlighter.cjs");
@@ -12,15 +14,26 @@ let _codemirror_view = require("@codemirror/view");
12
14
  let _codemirror_commands = require("@codemirror/commands");
13
15
  let _seljs_cel_lezer = require("@seljs/cel-lezer");
14
16
  //#region src/editor/editor-config.ts
17
+ const resolveFeatures = (features) => ({
18
+ linting: features?.linting ?? true,
19
+ autocomplete: features?.autocomplete ?? true,
20
+ semanticHighlighting: features?.semanticHighlighting ?? true,
21
+ typeDisplay: features?.typeDisplay ?? false
22
+ });
15
23
  const buildExtensions = (config) => {
16
- const checker = new _seljs_checker.SELChecker(config.schema, { rules: [..._seljs_checker.rules.builtIn] });
24
+ const checker = new _seljs_checker.SELChecker(config.schema, config.checkerOptions);
25
+ const resolved = resolveFeatures(config.features);
17
26
  const extensions = [];
18
27
  extensions.push((0, _seljs_cel_lezer.celLanguageSupport)(config.dark));
19
28
  extensions.push((0, _codemirror_language.bracketMatching)());
20
- const tokenizerConfig = require_tokenizer_config.createTokenizerConfig(config.schema);
21
- extensions.push(require_semantic_highlighter.createSemanticHighlighter(tokenizerConfig, config.dark));
22
- extensions.push(require_schema_completion.createSchemaCompletion(config.schema, checker));
23
- extensions.push((0, _codemirror_autocomplete.closeBrackets)());
29
+ if (resolved.semanticHighlighting) {
30
+ const tokenizerConfig = require_tokenizer_config.createTokenizerConfig(config.schema);
31
+ extensions.push(require_semantic_highlighter.createSemanticHighlighter(tokenizerConfig, config.dark));
32
+ }
33
+ if (resolved.autocomplete) {
34
+ extensions.push(require_schema_completion.createSchemaCompletion(config.schema, checker));
35
+ extensions.push((0, _codemirror_autocomplete.closeBrackets)());
36
+ }
24
37
  extensions.push(_codemirror_view.keymap.of([
25
38
  ..._codemirror_autocomplete.closeBracketsKeymap,
26
39
  ..._codemirror_commands.defaultKeymap,
@@ -28,21 +41,19 @@ const buildExtensions = (config) => {
28
41
  ]));
29
42
  extensions.push((0, _codemirror_commands.history)());
30
43
  extensions.push(config.dark ? require_theme.selDarkTheme : require_theme.selLightTheme);
31
- const validate = config.validate ?? ((expression) => checker.check(expression).diagnostics);
32
- extensions.push(require_sel_linter.createSELLinter({
33
- validate,
34
- delay: config.validateDelay
35
- }));
44
+ if (resolved.linting) extensions.push(require_sel_linter.createSELLinter({ validate: (expression) => checker.check(expression).diagnostics }));
36
45
  if (config.onChange) {
37
46
  const onChange = config.onChange;
38
47
  extensions.push(_codemirror_view.EditorView.updateListener.of((update) => {
39
- if (update.docChanged) onChange(update.state.doc.toString());
48
+ if (update.docChanged) {
49
+ const value = update.state.doc.toString();
50
+ onChange(value, checker.check(value).valid);
51
+ }
40
52
  }));
41
53
  }
42
54
  if (config.readOnly) extensions.push(_codemirror_state.EditorState.readOnly.of(true));
43
55
  if (config.placeholder) extensions.push((0, _codemirror_view.placeholder)(config.placeholder));
44
- if (config.showType) extensions.push(require_type_display.createTypeDisplay(checker, config.dark ?? false));
45
- if (config.extensions) extensions.push(...config.extensions);
56
+ if (resolved.typeDisplay) extensions.push(require_type_display.createTypeDisplay(checker, config.dark ?? false));
46
57
  return extensions;
47
58
  };
48
59
  //#endregion
@@ -1,26 +1,39 @@
1
1
  import { createTokenizerConfig } from "../language/tokenizer-config.mjs";
2
2
  import { createSchemaCompletion } from "../completion/schema-completion.mjs";
3
+ import "../completion/index.mjs";
3
4
  import { createSELLinter } from "../linting/sel-linter.mjs";
5
+ import "../linting/index.mjs";
4
6
  import { selDarkTheme, selLightTheme } from "./theme.mjs";
5
7
  import { createTypeDisplay } from "./type-display.mjs";
6
8
  import { createSemanticHighlighter } from "../language/semantic-highlighter.mjs";
7
9
  import { closeBrackets, closeBracketsKeymap } from "@codemirror/autocomplete";
8
- import { SELChecker, rules } from "@seljs/checker";
10
+ import { SELChecker } from "@seljs/checker";
9
11
  import { bracketMatching } from "@codemirror/language";
10
12
  import { EditorState } from "@codemirror/state";
11
13
  import { EditorView, keymap, placeholder } from "@codemirror/view";
12
14
  import { defaultKeymap, history, historyKeymap } from "@codemirror/commands";
13
15
  import { celLanguageSupport } from "@seljs/cel-lezer";
14
16
  //#region src/editor/editor-config.ts
17
+ const resolveFeatures = (features) => ({
18
+ linting: features?.linting ?? true,
19
+ autocomplete: features?.autocomplete ?? true,
20
+ semanticHighlighting: features?.semanticHighlighting ?? true,
21
+ typeDisplay: features?.typeDisplay ?? false
22
+ });
15
23
  const buildExtensions = (config) => {
16
- const checker = new SELChecker(config.schema, { rules: [...rules.builtIn] });
24
+ const checker = new SELChecker(config.schema, config.checkerOptions);
25
+ const resolved = resolveFeatures(config.features);
17
26
  const extensions = [];
18
27
  extensions.push(celLanguageSupport(config.dark));
19
28
  extensions.push(bracketMatching());
20
- const tokenizerConfig = createTokenizerConfig(config.schema);
21
- extensions.push(createSemanticHighlighter(tokenizerConfig, config.dark));
22
- extensions.push(createSchemaCompletion(config.schema, checker));
23
- extensions.push(closeBrackets());
29
+ if (resolved.semanticHighlighting) {
30
+ const tokenizerConfig = createTokenizerConfig(config.schema);
31
+ extensions.push(createSemanticHighlighter(tokenizerConfig, config.dark));
32
+ }
33
+ if (resolved.autocomplete) {
34
+ extensions.push(createSchemaCompletion(config.schema, checker));
35
+ extensions.push(closeBrackets());
36
+ }
24
37
  extensions.push(keymap.of([
25
38
  ...closeBracketsKeymap,
26
39
  ...defaultKeymap,
@@ -28,21 +41,19 @@ const buildExtensions = (config) => {
28
41
  ]));
29
42
  extensions.push(history());
30
43
  extensions.push(config.dark ? selDarkTheme : selLightTheme);
31
- const validate = config.validate ?? ((expression) => checker.check(expression).diagnostics);
32
- extensions.push(createSELLinter({
33
- validate,
34
- delay: config.validateDelay
35
- }));
44
+ if (resolved.linting) extensions.push(createSELLinter({ validate: (expression) => checker.check(expression).diagnostics }));
36
45
  if (config.onChange) {
37
46
  const onChange = config.onChange;
38
47
  extensions.push(EditorView.updateListener.of((update) => {
39
- if (update.docChanged) onChange(update.state.doc.toString());
48
+ if (update.docChanged) {
49
+ const value = update.state.doc.toString();
50
+ onChange(value, checker.check(value).valid);
51
+ }
40
52
  }));
41
53
  }
42
54
  if (config.readOnly) extensions.push(EditorState.readOnly.of(true));
43
55
  if (config.placeholder) extensions.push(placeholder(config.placeholder));
44
- if (config.showType) extensions.push(createTypeDisplay(checker, config.dark ?? false));
45
- if (config.extensions) extensions.push(...config.extensions);
56
+ if (resolved.typeDisplay) extensions.push(createTypeDisplay(checker, config.dark ?? false));
46
57
  return extensions;
47
58
  };
48
59
  //#endregion
@@ -1,3 +1,2 @@
1
1
  require("./theme.cjs");
2
- require("./editor-config.cjs");
3
2
  require("./create-editor.cjs");
@@ -1,6 +1,5 @@
1
- import { SELEditorConfig } from "./types.cjs";
1
+ import { SELEditorConfig, SELEditorFeatures } from "./types.cjs";
2
2
  import { createSELEditor } from "./create-editor.cjs";
3
- import { buildExtensions } from "./editor-config.cjs";
4
3
  import { selDarkTheme, selLightTheme } from "./theme.cjs";
5
4
  import { EditorView as EditorView$1 } from "@codemirror/view";
6
5
  export { type EditorView$1 as EditorView };
@@ -1,6 +1,5 @@
1
- import { SELEditorConfig } from "./types.mjs";
1
+ import { SELEditorConfig, SELEditorFeatures } from "./types.mjs";
2
2
  import { createSELEditor } from "./create-editor.mjs";
3
- import { buildExtensions } from "./editor-config.mjs";
4
3
  import { selDarkTheme, selLightTheme } from "./theme.mjs";
5
4
  import { EditorView as EditorView$1 } from "@codemirror/view";
6
5
  export { type EditorView$1 as EditorView };
@@ -1,4 +1,3 @@
1
1
  import "./theme.mjs";
2
- import "./editor-config.mjs";
3
2
  import "./create-editor.mjs";
4
3
  export {};
@@ -9,50 +9,48 @@ const typeField = _codemirror_state.StateField.define({
9
9
  return value;
10
10
  }
11
11
  });
12
- function createTypePanel(dark) {
13
- return (view) => {
14
- const dom = document.createElement("div");
15
- dom.className = "sel-type-display";
16
- dom.style.cssText = [
17
- "display: flex",
18
- "align-items: center",
19
- "gap: 6px",
20
- `padding: 3px 8px`,
21
- "font-size: 12px",
22
- `font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace`,
23
- `color: ${dark ? "#9ca3af" : "#6b7280"}`,
24
- `background: ${dark ? "#262626" : "#f9fafb"}`,
25
- `border-top: 1px solid ${dark ? "#374151" : "#e5e7eb"}`
26
- ].join("; ");
27
- const update = () => {
28
- const type = view.state.field(typeField);
29
- dom.textContent = "";
30
- if (type) {
31
- const label = document.createElement("span");
32
- label.style.color = dark ? "#6b7280" : "#9ca3af";
33
- label.textContent = "output";
34
- const typeSpan = document.createElement("span");
35
- typeSpan.style.color = dark ? "#93c5fd" : "#2563eb";
36
- typeSpan.style.fontWeight = "500";
37
- typeSpan.textContent = type;
38
- dom.append(label, " ", typeSpan);
39
- }
40
- };
41
- update();
42
- return {
43
- dom,
44
- update: () => {
45
- update();
46
- }
47
- };
12
+ const createTypePanel = (dark) => (view) => {
13
+ const dom = document.createElement("div");
14
+ dom.className = "sel-type-display";
15
+ dom.style.cssText = [
16
+ "display: flex",
17
+ "align-items: center",
18
+ "gap: 6px",
19
+ `padding: 3px 8px`,
20
+ "font-size: 12px",
21
+ `font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace`,
22
+ `color: ${dark ? "#9ca3af" : "#6b7280"}`,
23
+ `background: ${dark ? "#262626" : "#f9fafb"}`,
24
+ `border-top: 1px solid ${dark ? "#374151" : "#e5e7eb"}`
25
+ ].join("; ");
26
+ const update = () => {
27
+ const type = view.state.field(typeField);
28
+ dom.textContent = "";
29
+ if (type) {
30
+ const label = document.createElement("span");
31
+ label.style.color = dark ? "#6b7280" : "#9ca3af";
32
+ label.textContent = "output";
33
+ const typeSpan = document.createElement("span");
34
+ typeSpan.style.color = dark ? "#93c5fd" : "#2563eb";
35
+ typeSpan.style.fontWeight = "500";
36
+ typeSpan.textContent = type;
37
+ dom.append(label, " ", typeSpan);
38
+ }
48
39
  };
49
- }
50
- function createTypeDisplay(checker, dark) {
40
+ update();
41
+ return {
42
+ dom,
43
+ update: () => {
44
+ update();
45
+ }
46
+ };
47
+ };
48
+ const createTypeDisplay = (checker, dark) => {
51
49
  let debounceTimer;
52
50
  return [
53
51
  typeField,
54
52
  _codemirror_view.EditorView.updateListener.of((update) => {
55
- if (!update.docChanged && !update.startState.field(typeField, false)) return;
53
+ if (!update.docChanged && update.startState.field(typeField, false) !== null) return;
56
54
  if (debounceTimer) clearTimeout(debounceTimer);
57
55
  debounceTimer = setTimeout(() => {
58
56
  const doc = update.state.doc.toString().trim();
@@ -66,6 +64,6 @@ function createTypeDisplay(checker, dark) {
66
64
  }),
67
65
  _codemirror_view.showPanel.of(createTypePanel(dark))
68
66
  ];
69
- }
67
+ };
70
68
  //#endregion
71
69
  exports.createTypeDisplay = createTypeDisplay;
@@ -9,50 +9,48 @@ const typeField = StateField.define({
9
9
  return value;
10
10
  }
11
11
  });
12
- function createTypePanel(dark) {
13
- return (view) => {
14
- const dom = document.createElement("div");
15
- dom.className = "sel-type-display";
16
- dom.style.cssText = [
17
- "display: flex",
18
- "align-items: center",
19
- "gap: 6px",
20
- `padding: 3px 8px`,
21
- "font-size: 12px",
22
- `font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace`,
23
- `color: ${dark ? "#9ca3af" : "#6b7280"}`,
24
- `background: ${dark ? "#262626" : "#f9fafb"}`,
25
- `border-top: 1px solid ${dark ? "#374151" : "#e5e7eb"}`
26
- ].join("; ");
27
- const update = () => {
28
- const type = view.state.field(typeField);
29
- dom.textContent = "";
30
- if (type) {
31
- const label = document.createElement("span");
32
- label.style.color = dark ? "#6b7280" : "#9ca3af";
33
- label.textContent = "output";
34
- const typeSpan = document.createElement("span");
35
- typeSpan.style.color = dark ? "#93c5fd" : "#2563eb";
36
- typeSpan.style.fontWeight = "500";
37
- typeSpan.textContent = type;
38
- dom.append(label, " ", typeSpan);
39
- }
40
- };
41
- update();
42
- return {
43
- dom,
44
- update: () => {
45
- update();
46
- }
47
- };
12
+ const createTypePanel = (dark) => (view) => {
13
+ const dom = document.createElement("div");
14
+ dom.className = "sel-type-display";
15
+ dom.style.cssText = [
16
+ "display: flex",
17
+ "align-items: center",
18
+ "gap: 6px",
19
+ `padding: 3px 8px`,
20
+ "font-size: 12px",
21
+ `font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace`,
22
+ `color: ${dark ? "#9ca3af" : "#6b7280"}`,
23
+ `background: ${dark ? "#262626" : "#f9fafb"}`,
24
+ `border-top: 1px solid ${dark ? "#374151" : "#e5e7eb"}`
25
+ ].join("; ");
26
+ const update = () => {
27
+ const type = view.state.field(typeField);
28
+ dom.textContent = "";
29
+ if (type) {
30
+ const label = document.createElement("span");
31
+ label.style.color = dark ? "#6b7280" : "#9ca3af";
32
+ label.textContent = "output";
33
+ const typeSpan = document.createElement("span");
34
+ typeSpan.style.color = dark ? "#93c5fd" : "#2563eb";
35
+ typeSpan.style.fontWeight = "500";
36
+ typeSpan.textContent = type;
37
+ dom.append(label, " ", typeSpan);
38
+ }
48
39
  };
49
- }
50
- function createTypeDisplay(checker, dark) {
40
+ update();
41
+ return {
42
+ dom,
43
+ update: () => {
44
+ update();
45
+ }
46
+ };
47
+ };
48
+ const createTypeDisplay = (checker, dark) => {
51
49
  let debounceTimer;
52
50
  return [
53
51
  typeField,
54
52
  EditorView.updateListener.of((update) => {
55
- if (!update.docChanged && !update.startState.field(typeField, false)) return;
53
+ if (!update.docChanged && update.startState.field(typeField, false) !== null) return;
56
54
  if (debounceTimer) clearTimeout(debounceTimer);
57
55
  debounceTimer = setTimeout(() => {
58
56
  const doc = update.state.doc.toString().trim();
@@ -66,6 +64,6 @@ function createTypeDisplay(checker, dark) {
66
64
  }),
67
65
  showPanel.of(createTypePanel(dark))
68
66
  ];
69
- }
67
+ };
70
68
  //#endregion
71
69
  export { createTypeDisplay };
@@ -1,31 +1,73 @@
1
- import { SELDiagnostic } from "../linting/diagnostic-mapper.cjs";
2
1
  import { SELSchema } from "@seljs/schema";
3
- import { Extension } from "@codemirror/state";
2
+ import { SELCheckerOptions } from "@seljs/checker";
4
3
 
5
4
  //#region src/editor/types.d.ts
5
+ interface SELEditorFeatures {
6
+ /**
7
+ * Enable linting/validation
8
+ *
9
+ * @default true
10
+ */
11
+ linting?: boolean;
12
+ /**
13
+ * Enable schema-aware autocomplete
14
+ *
15
+ * @default true
16
+ */
17
+ autocomplete?: boolean;
18
+ /**
19
+ * Enable schema-aware identifier coloring
20
+ *
21
+ * @default true
22
+ */
23
+ semanticHighlighting?: boolean;
24
+ /**
25
+ * Show inferred output type panel below editor
26
+ *
27
+ * @default false
28
+ */
29
+ typeDisplay?: boolean;
30
+ }
6
31
  interface SELEditorConfig {
7
- /** Container element to mount into */
32
+ /**
33
+ * Container element to mount into
34
+ */
8
35
  parent: HTMLElement;
9
- /** Schema driving autocomplete and syntax highlighting */
36
+ /**
37
+ * Schema driving autocomplete and syntax highlighting
38
+ */
10
39
  schema: SELSchema;
11
- /** Initial expression value */
40
+ /**
41
+ * Initial expression value
42
+ */
12
43
  value?: string;
13
- /** Called on every expression change */
14
- onChange?: (value: string) => void;
15
- /** Validation function for error highlighting */
16
- validate?: (expression: string) => SELDiagnostic[] | Promise<SELDiagnostic[]>;
17
- /** Debounce delay for validation (default: 300ms) */
18
- validateDelay?: number;
19
- /** Dark mode */
44
+ /**
45
+ * Called on every expression change with the current value and validity
46
+ */
47
+ onChange?: (value: string, valid: boolean) => void;
48
+ /**
49
+ * Options for the internal SELChecker instance
50
+ */
51
+ checkerOptions?: SELCheckerOptions;
52
+ /**
53
+ * Dark mode
54
+ *
55
+ * @default false
56
+ */
20
57
  dark?: boolean;
21
- /** Whether the editor is read-only */
58
+ /**
59
+ * Whether the editor is read-only
60
+ * @default false
61
+ */
22
62
  readOnly?: boolean;
23
- /** Placeholder text */
63
+ /**
64
+ * Placeholder text
65
+ */
24
66
  placeholder?: string;
25
- /** Show inferred output type below the editor */
26
- showType?: boolean;
27
- /** Additional CodeMirror extensions */
28
- extensions?: Extension[];
67
+ /**
68
+ * Optional feature toggles
69
+ */
70
+ features?: SELEditorFeatures;
29
71
  }
30
72
  //#endregion
31
- export { SELEditorConfig };
73
+ export { SELEditorConfig, SELEditorFeatures };
@@ -1,31 +1,73 @@
1
- import { SELDiagnostic } from "../linting/diagnostic-mapper.mjs";
2
- import { Extension } from "@codemirror/state";
1
+ import { SELCheckerOptions } from "@seljs/checker";
3
2
  import { SELSchema } from "@seljs/schema";
4
3
 
5
4
  //#region src/editor/types.d.ts
5
+ interface SELEditorFeatures {
6
+ /**
7
+ * Enable linting/validation
8
+ *
9
+ * @default true
10
+ */
11
+ linting?: boolean;
12
+ /**
13
+ * Enable schema-aware autocomplete
14
+ *
15
+ * @default true
16
+ */
17
+ autocomplete?: boolean;
18
+ /**
19
+ * Enable schema-aware identifier coloring
20
+ *
21
+ * @default true
22
+ */
23
+ semanticHighlighting?: boolean;
24
+ /**
25
+ * Show inferred output type panel below editor
26
+ *
27
+ * @default false
28
+ */
29
+ typeDisplay?: boolean;
30
+ }
6
31
  interface SELEditorConfig {
7
- /** Container element to mount into */
32
+ /**
33
+ * Container element to mount into
34
+ */
8
35
  parent: HTMLElement;
9
- /** Schema driving autocomplete and syntax highlighting */
36
+ /**
37
+ * Schema driving autocomplete and syntax highlighting
38
+ */
10
39
  schema: SELSchema;
11
- /** Initial expression value */
40
+ /**
41
+ * Initial expression value
42
+ */
12
43
  value?: string;
13
- /** Called on every expression change */
14
- onChange?: (value: string) => void;
15
- /** Validation function for error highlighting */
16
- validate?: (expression: string) => SELDiagnostic[] | Promise<SELDiagnostic[]>;
17
- /** Debounce delay for validation (default: 300ms) */
18
- validateDelay?: number;
19
- /** Dark mode */
44
+ /**
45
+ * Called on every expression change with the current value and validity
46
+ */
47
+ onChange?: (value: string, valid: boolean) => void;
48
+ /**
49
+ * Options for the internal SELChecker instance
50
+ */
51
+ checkerOptions?: SELCheckerOptions;
52
+ /**
53
+ * Dark mode
54
+ *
55
+ * @default false
56
+ */
20
57
  dark?: boolean;
21
- /** Whether the editor is read-only */
58
+ /**
59
+ * Whether the editor is read-only
60
+ * @default false
61
+ */
22
62
  readOnly?: boolean;
23
- /** Placeholder text */
63
+ /**
64
+ * Placeholder text
65
+ */
24
66
  placeholder?: string;
25
- /** Show inferred output type below the editor */
26
- showType?: boolean;
27
- /** Additional CodeMirror extensions */
28
- extensions?: Extension[];
67
+ /**
68
+ * Optional feature toggles
69
+ */
70
+ features?: SELEditorFeatures;
29
71
  }
30
72
  //#endregion
31
- export { SELEditorConfig };
73
+ export { SELEditorConfig, SELEditorFeatures };
package/dist/index.cjs CHANGED
@@ -6,11 +6,9 @@ const require_sel_linter = require("./linting/sel-linter.cjs");
6
6
  const require_diagnostic_mapper = require("./linting/diagnostic-mapper.cjs");
7
7
  require("./linting/index.cjs");
8
8
  const require_theme = require("./editor/theme.cjs");
9
- const require_editor_config = require("./editor/editor-config.cjs");
10
9
  const require_create_editor = require("./editor/create-editor.cjs");
11
10
  require("./editor/index.cjs");
12
11
  exports.SchemaCompletionProvider = require_schema_completion.SchemaCompletionProvider;
13
- exports.buildExtensions = require_editor_config.buildExtensions;
14
12
  exports.createSELEditor = require_create_editor.createSELEditor;
15
13
  exports.createSELLinter = require_sel_linter.createSELLinter;
16
14
  exports.createSchemaCompletion = require_schema_completion.createSchemaCompletion;
package/dist/index.d.cts CHANGED
@@ -1,10 +1,9 @@
1
1
  import { TokenizerConfig, createTokenizerConfig } from "./language/tokenizer-config.cjs";
2
2
  import { SchemaCompletionProvider, createSchemaCompletion } from "./completion/schema-completion.cjs";
3
- import { SELDiagnostic, mapCheckResult } from "./linting/diagnostic-mapper.cjs";
4
3
  import { SELLinterOptions, createSELLinter } from "./linting/sel-linter.cjs";
5
- import { SELEditorConfig } from "./editor/types.cjs";
4
+ import { mapCheckResult } from "./linting/diagnostic-mapper.cjs";
5
+ import { SELEditorConfig, SELEditorFeatures } from "./editor/types.cjs";
6
6
  import { createSELEditor } from "./editor/create-editor.cjs";
7
- import { buildExtensions } from "./editor/editor-config.cjs";
8
7
  import { selDarkTheme, selLightTheme } from "./editor/theme.cjs";
9
8
  import { EditorView } from "./editor/index.cjs";
10
- export { EditorView, SELDiagnostic, SELEditorConfig, SELLinterOptions, SchemaCompletionProvider, TokenizerConfig, buildExtensions, createSELEditor, createSELLinter, createSchemaCompletion, createTokenizerConfig, mapCheckResult, selDarkTheme, selLightTheme };
9
+ export { EditorView, SELEditorConfig, SELEditorFeatures, SELLinterOptions, SchemaCompletionProvider, TokenizerConfig, createSELEditor, createSELLinter, createSchemaCompletion, createTokenizerConfig, mapCheckResult, selDarkTheme, selLightTheme };
package/dist/index.d.mts CHANGED
@@ -1,10 +1,9 @@
1
1
  import { TokenizerConfig, createTokenizerConfig } from "./language/tokenizer-config.mjs";
2
2
  import { SchemaCompletionProvider, createSchemaCompletion } from "./completion/schema-completion.mjs";
3
- import { SELDiagnostic, mapCheckResult } from "./linting/diagnostic-mapper.mjs";
4
3
  import { SELLinterOptions, createSELLinter } from "./linting/sel-linter.mjs";
5
- import { SELEditorConfig } from "./editor/types.mjs";
4
+ import { mapCheckResult } from "./linting/diagnostic-mapper.mjs";
5
+ import { SELEditorConfig, SELEditorFeatures } from "./editor/types.mjs";
6
6
  import { createSELEditor } from "./editor/create-editor.mjs";
7
- import { buildExtensions } from "./editor/editor-config.mjs";
8
7
  import { selDarkTheme, selLightTheme } from "./editor/theme.mjs";
9
8
  import { EditorView } from "./editor/index.mjs";
10
- export { EditorView, SELDiagnostic, SELEditorConfig, SELLinterOptions, SchemaCompletionProvider, TokenizerConfig, buildExtensions, createSELEditor, createSELLinter, createSchemaCompletion, createTokenizerConfig, mapCheckResult, selDarkTheme, selLightTheme };
9
+ export { EditorView, SELEditorConfig, SELEditorFeatures, SELLinterOptions, SchemaCompletionProvider, TokenizerConfig, createSELEditor, createSELLinter, createSchemaCompletion, createTokenizerConfig, mapCheckResult, selDarkTheme, selLightTheme };
package/dist/index.mjs CHANGED
@@ -5,7 +5,6 @@ import { createSELLinter } from "./linting/sel-linter.mjs";
5
5
  import { mapCheckResult } from "./linting/diagnostic-mapper.mjs";
6
6
  import "./linting/index.mjs";
7
7
  import { selDarkTheme, selLightTheme } from "./editor/theme.mjs";
8
- import { buildExtensions } from "./editor/editor-config.mjs";
9
8
  import { createSELEditor } from "./editor/create-editor.mjs";
10
9
  import "./editor/index.mjs";
11
- export { SchemaCompletionProvider, buildExtensions, createSELEditor, createSELLinter, createSchemaCompletion, createTokenizerConfig, mapCheckResult, selDarkTheme, selLightTheme };
10
+ export { SchemaCompletionProvider, createSELEditor, createSELLinter, createSchemaCompletion, createTokenizerConfig, mapCheckResult, selDarkTheme, selLightTheme };
@@ -26,4 +26,4 @@ interface CheckResult {
26
26
  */
27
27
  declare const mapCheckResult: (resultOrError: CheckResult | Error, docLength: number) => SELDiagnostic[];
28
28
  //#endregion
29
- export { type SELDiagnostic, mapCheckResult };
29
+ export { mapCheckResult };
@@ -26,4 +26,4 @@ interface CheckResult {
26
26
  */
27
27
  declare const mapCheckResult: (resultOrError: CheckResult | Error, docLength: number) => SELDiagnostic[];
28
28
  //#endregion
29
- export { type SELDiagnostic, mapCheckResult };
29
+ export { mapCheckResult };
@@ -1,2 +1,2 @@
1
- import { SELDiagnostic, mapCheckResult } from "./diagnostic-mapper.mjs";
2
- import { SELLinterOptions, createSELLinter } from "./sel-linter.mjs";
1
+ import { SELLinterOptions, createSELLinter } from "./sel-linter.mjs";
2
+ import { mapCheckResult } from "./diagnostic-mapper.mjs";
@@ -5,7 +5,7 @@ const SEVERITY_MAP = {
5
5
  warning: "warning",
6
6
  info: "info"
7
7
  };
8
- function mapToCMDiagnostic(diag, docLength) {
8
+ const mapToCMDiagnostic = (diag, docLength) => {
9
9
  const from = diag.from ?? 0;
10
10
  const to = diag.to ?? docLength;
11
11
  return {
@@ -14,15 +14,13 @@ function mapToCMDiagnostic(diag, docLength) {
14
14
  severity: SEVERITY_MAP[diag.severity],
15
15
  message: diag.message
16
16
  };
17
- }
18
- function createSELLinter(options) {
19
- return (0, _codemirror_lint.linter)(async (view) => {
20
- const doc = view.state.doc.toString();
21
- if (!doc) return [];
22
- const diagnostics = await options.validate(doc);
23
- const docLength = doc.length;
24
- return diagnostics.map((d) => mapToCMDiagnostic(d, docLength));
25
- }, { delay: options.delay ?? 300 });
26
- }
17
+ };
18
+ const createSELLinter = (options) => (0, _codemirror_lint.linter)(async (view) => {
19
+ const doc = view.state.doc.toString();
20
+ if (!doc) return [];
21
+ const diagnostics = await options.validate(doc);
22
+ const docLength = doc.length;
23
+ return diagnostics.map((d) => mapToCMDiagnostic(d, docLength));
24
+ }, { delay: options.delay ?? 300 });
27
25
  //#endregion
28
26
  exports.createSELLinter = createSELLinter;
@@ -1,13 +1,17 @@
1
- import { SELDiagnostic } from "./diagnostic-mapper.cjs";
2
1
  import { Extension } from "@codemirror/state";
2
+ import { SELDiagnostic } from "@seljs/checker";
3
3
 
4
4
  //#region src/linting/sel-linter.d.ts
5
5
  interface SELLinterOptions {
6
- /** Validate an expression, return diagnostics */
6
+ /**
7
+ * Validate an expression, return diagnostics
8
+ */
7
9
  validate: (expression: string) => SELDiagnostic[] | Promise<SELDiagnostic[]>;
8
- /** Debounce delay in ms (default: 300) */
10
+ /**
11
+ * Debounce delay in ms (default: 300)
12
+ */
9
13
  delay?: number;
10
14
  }
11
- declare function createSELLinter(options: SELLinterOptions): Extension;
15
+ declare const createSELLinter: (options: SELLinterOptions) => Extension;
12
16
  //#endregion
13
- export { type SELLinterOptions, createSELLinter };
17
+ export { SELLinterOptions, createSELLinter };
@@ -1,13 +1,17 @@
1
- import { SELDiagnostic } from "./diagnostic-mapper.mjs";
1
+ import { SELDiagnostic } from "@seljs/checker";
2
2
  import { Extension } from "@codemirror/state";
3
3
 
4
4
  //#region src/linting/sel-linter.d.ts
5
5
  interface SELLinterOptions {
6
- /** Validate an expression, return diagnostics */
6
+ /**
7
+ * Validate an expression, return diagnostics
8
+ */
7
9
  validate: (expression: string) => SELDiagnostic[] | Promise<SELDiagnostic[]>;
8
- /** Debounce delay in ms (default: 300) */
10
+ /**
11
+ * Debounce delay in ms (default: 300)
12
+ */
9
13
  delay?: number;
10
14
  }
11
- declare function createSELLinter(options: SELLinterOptions): Extension;
15
+ declare const createSELLinter: (options: SELLinterOptions) => Extension;
12
16
  //#endregion
13
- export { type SELLinterOptions, createSELLinter };
17
+ export { SELLinterOptions, createSELLinter };
@@ -5,7 +5,7 @@ const SEVERITY_MAP = {
5
5
  warning: "warning",
6
6
  info: "info"
7
7
  };
8
- function mapToCMDiagnostic(diag, docLength) {
8
+ const mapToCMDiagnostic = (diag, docLength) => {
9
9
  const from = diag.from ?? 0;
10
10
  const to = diag.to ?? docLength;
11
11
  return {
@@ -14,15 +14,13 @@ function mapToCMDiagnostic(diag, docLength) {
14
14
  severity: SEVERITY_MAP[diag.severity],
15
15
  message: diag.message
16
16
  };
17
- }
18
- function createSELLinter(options) {
19
- return linter(async (view) => {
20
- const doc = view.state.doc.toString();
21
- if (!doc) return [];
22
- const diagnostics = await options.validate(doc);
23
- const docLength = doc.length;
24
- return diagnostics.map((d) => mapToCMDiagnostic(d, docLength));
25
- }, { delay: options.delay ?? 300 });
26
- }
17
+ };
18
+ const createSELLinter = (options) => linter(async (view) => {
19
+ const doc = view.state.doc.toString();
20
+ if (!doc) return [];
21
+ const diagnostics = await options.validate(doc);
22
+ const docLength = doc.length;
23
+ return diagnostics.map((d) => mapToCMDiagnostic(d, docLength));
24
+ }, { delay: options.delay ?? 300 });
27
25
  //#endregion
28
26
  export { createSELLinter };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@seljs/editor",
3
- "version": "1.0.1-beta.9",
3
+ "version": "1.1.0-beta.1",
4
4
  "repository": {
5
5
  "url": "https://github.com/abinnovision/seljs"
6
6
  },
@@ -56,9 +56,9 @@
56
56
  "@codemirror/view": "^6.40.0",
57
57
  "@lezer/common": "^1.5.1",
58
58
  "@lezer/highlight": "^1.2.3",
59
- "@seljs/cel-lezer": "1.0.1-beta.9",
60
- "@seljs/checker": "1.0.1-beta.9",
61
- "@seljs/schema": "1.0.0"
59
+ "@seljs/cel-lezer": "1.1.0-beta.1",
60
+ "@seljs/checker": "1.1.0-beta.1",
61
+ "@seljs/schema": "1.0.1"
62
62
  },
63
63
  "devDependencies": {
64
64
  "@abinnovision/eslint-config-base": "^3.2.0",
@@ -1,7 +0,0 @@
1
- import { SELEditorConfig } from "./types.cjs";
2
- import { Extension } from "@codemirror/state";
3
-
4
- //#region src/editor/editor-config.d.ts
5
- declare const buildExtensions: (config: SELEditorConfig) => Extension[];
6
- //#endregion
7
- export { buildExtensions };
@@ -1,7 +0,0 @@
1
- import { SELEditorConfig } from "./types.mjs";
2
- import { Extension } from "@codemirror/state";
3
-
4
- //#region src/editor/editor-config.d.ts
5
- declare const buildExtensions: (config: SELEditorConfig) => Extension[];
6
- //#endregion
7
- export { buildExtensions };