@api-client/ui 0.5.14 → 0.5.15

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.
@@ -18,6 +18,7 @@ import { SuggestionMatchDecorator } from './SuggestionMatchDecorator.js';
18
18
  * @fires change - When the editor loses focus and content has changed
19
19
  */
20
20
  export default class CodeEditor extends LitElement {
21
+ #private;
21
22
  /**
22
23
  * Shadow root configuration for the component.
23
24
  * Uses 'open' mode for accessibility and delegates focus to enable proper focus management.
@@ -54,7 +55,8 @@ export default class CodeEditor extends LitElement {
54
55
  /**
55
56
  * The editor content value
56
57
  */
57
- accessor value: string;
58
+ get value(): string;
59
+ set value(newValue: string);
58
60
  /**
59
61
  * Available function schemas for autocomplete
60
62
  */
@@ -75,6 +77,10 @@ export default class CodeEditor extends LitElement {
75
77
  private accessor hasContent;
76
78
  private accessor isEditorFocus;
77
79
  private editorView?;
80
+ /**
81
+ * A control value to track previous value of the editor.
82
+ * This is used to detect when change event should be dispatched.
83
+ */
78
84
  private _previousValue;
79
85
  /**
80
86
  * Matcher for suggestion placeholders in the editor.
@@ -84,6 +90,7 @@ export default class CodeEditor extends LitElement {
84
90
  * Get all suggestions (placeholders) currently in the editor
85
91
  */
86
92
  get activeSuggestions(): Suggestion[];
93
+ private readonlyState;
87
94
  disconnectedCallback(): void;
88
95
  firstUpdated(): void;
89
96
  willUpdate(changedProperties: PropertyValues): void;
@@ -120,10 +127,6 @@ export default class CodeEditor extends LitElement {
120
127
  * Update editor content when value changes
121
128
  */
122
129
  private updateEditorContent;
123
- /**
124
- * Update editor state (e.g., disabled state)
125
- */
126
- private updateEditorState;
127
130
  /**
128
131
  * Handle editor content change
129
132
  */
@@ -1 +1 @@
1
- {"version":3,"file":"CodeEditor.d.ts","sourceRoot":"","sources":["../../../../../src/elements/code-editor/internals/CodeEditor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,UAAU,EAAE,cAAc,EAAE,cAAc,EAAW,MAAM,KAAK,CAAA;AA0B/E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAA;AAGrE,OAAO,KAAK,EAAuB,UAAU,EAAyB,MAAM,YAAY,CAAA;AACxF,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAA;AAExE;;;;;;;;;;;;;;GAcG;AACH,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,UAAU;IAChD;;;OAGG;IACH,OAAgB,iBAAiB,EAAE,cAAc,CAGhD;IAED;;OAEG;IAEH,QAAQ,CAAC,KAAK,SAAK;IAEnB;;OAEG;IAEH,QAAQ,CAAC,cAAc,SAAK;IAE5B;;OAEG;IAEH,QAAQ,CAAC,QAAQ,UAAQ;IAEzB;;OAEG;IAEH,QAAQ,CAAC,OAAO,UAAQ;IAExB;;OAEG;IAEH,QAAQ,CAAC,IAAI,SAAK;IAElB;;OAEG;IAEH,QAAQ,CAAC,QAAQ,UAAQ;IAEzB;;OAEG;IAEH,QAAQ,CAAC,WAAW,SAAK;IAEzB;;OAEG;IAEH,QAAQ,CAAC,KAAK,SAAK;IAEnB;;OAEG;IAEH,QAAQ,CAAC,eAAe,EAAE,cAAc,EAAE,CAAK;IAE/C;;OAEG;IAEH,QAAQ,CAAC,WAAW,EAAE,UAAU,EAAE,CAAK;IAEvC;;OAEG;IAEH,QAAQ,CAAC,SAAS,UAAQ;IAE1B;;OAEG;IAEH,QAAQ,CAAC,QAAQ,SAAe;IAGhC,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAiB;IAGjD,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAQ;IAGnC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAQ;IAEtC,OAAO,CAAC,UAAU,CAAC,CAAY;IAC/B,OAAO,CAAC,cAAc,CAAK;IAC3B;;OAEG;IACH,kBAAkB,CAAC,EAAE,wBAAwB,CAAA;IAE7C;;OAEG;IACH,IAAI,iBAAiB,IAAI,UAAU,EAAE,CAapC;IAEQ,oBAAoB,IAAI,IAAI;IAK5B,YAAY,IAAI,IAAI;IAKpB,UAAU,CAAC,iBAAiB,EAAE,cAAc,GAAG,IAAI;IAkB5D;;OAEG;IACH,OAAO,CAAC,oBAAoB;IAoD5B;;;OAGG;IACH,OAAO,CAAC,uBAAuB;IAoB/B;;OAEG;IACH,OAAO,CAAC,sBAAsB;IA0C9B,OAAO,CAAC,wBAAwB;IAkBhC,OAAO,CAAC,0BAA0B;IAkBlC;;;OAGG;IACH,OAAO,CAAC,wBAAwB,CAmB/B;IAED;;;OAGG;IACH,OAAO,CAAC,yBAAyB;IAgEjC;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAiB1B;;OAEG;IACH,OAAO,CAAC,mBAAmB;IAe3B;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAYzB;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAa1B;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAQzB;;OAEG;IACH,OAAO,CAAC,sBAAsB;IAQ9B;;OAEG;IACH,OAAO,CAAC,wBAAwB;IAQhC;;OAEG;IACM,KAAK,IAAI,IAAI;IAItB;;OAEG;IACH,YAAY,IAAI;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI;IAMnD;;OAEG;IACH,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAUrB,MAAM,IAAI,cAAc;CAgBlC"}
1
+ {"version":3,"file":"CodeEditor.d.ts","sourceRoot":"","sources":["../../../../../src/elements/code-editor/internals/CodeEditor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,UAAU,EAAE,cAAc,EAAE,cAAc,EAAW,MAAM,KAAK,CAAA;AA0B/E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iCAAiC,CAAA;AAGrE,OAAO,KAAK,EAAuB,UAAU,EAAyB,MAAM,YAAY,CAAA;AACxF,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAA;AAExE;;;;;;;;;;;;;;GAcG;AACH,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,UAAU;;IAChD;;;OAGG;IACH,OAAgB,iBAAiB,EAAE,cAAc,CAGhD;IAED;;OAEG;IAEH,QAAQ,CAAC,KAAK,SAAK;IAEnB;;OAEG;IAEH,QAAQ,CAAC,cAAc,SAAK;IAE5B;;OAEG;IAEH,QAAQ,CAAC,QAAQ,UAAQ;IAEzB;;OAEG;IAEH,QAAQ,CAAC,OAAO,UAAQ;IAExB;;OAEG;IAEH,QAAQ,CAAC,IAAI,SAAK;IAElB;;OAEG;IAEH,QAAQ,CAAC,QAAQ,UAAQ;IAEzB;;OAEG;IAEH,QAAQ,CAAC,WAAW,SAAK;IAOzB;;OAEG;IACH,IAAI,KAAK,IAAI,MAAM,CAElB;IAED,IACI,KAAK,CAAC,QAAQ,EAAE,MAAM,EAOzB;IAED;;OAEG;IAEH,QAAQ,CAAC,eAAe,EAAE,cAAc,EAAE,CAAK;IAE/C;;OAEG;IAEH,QAAQ,CAAC,WAAW,EAAE,UAAU,EAAE,CAAK;IAEvC;;OAEG;IAEH,QAAQ,CAAC,SAAS,UAAQ;IAE1B;;OAEG;IAEH,QAAQ,CAAC,QAAQ,SAAe;IAGhC,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAiB;IAGjD,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAQ;IAGnC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAQ;IAEtC,OAAO,CAAC,UAAU,CAAC,CAAY;IAC/B;;;OAGG;IACH,OAAO,CAAC,cAAc,CAAK;IAC3B;;OAEG;IACH,kBAAkB,CAAC,EAAE,wBAAwB,CAAA;IAE7C;;OAEG;IACH,IAAI,iBAAiB,IAAI,UAAU,EAAE,CAapC;IAED,OAAO,CAAC,aAAa,CAAoB;IAEhC,oBAAoB,IAAI,IAAI;IAK5B,YAAY,IAAI,IAAI;IAKpB,UAAU,CAAC,iBAAiB,EAAE,cAAc,GAAG,IAAI;IAoB5D;;OAEG;IACH,OAAO,CAAC,oBAAoB;IAqD5B;;;OAGG;IACH,OAAO,CAAC,uBAAuB;IAoB/B;;OAEG;IACH,OAAO,CAAC,sBAAsB;IA0C9B,OAAO,CAAC,wBAAwB;IAkBhC,OAAO,CAAC,0BAA0B;IAkBlC;;;OAGG;IACH,OAAO,CAAC,wBAAwB,CAmB/B;IAED;;;OAGG;IACH,OAAO,CAAC,yBAAyB;IAgEjC;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAiB1B;;OAEG;IACH,OAAO,CAAC,mBAAmB;IAe3B;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAU1B;;OAEG;IACH,OAAO,CAAC,iBAAiB;IASzB;;OAEG;IACH,OAAO,CAAC,sBAAsB;IAQ9B;;OAEG;IACH,OAAO,CAAC,wBAAwB;IAQhC;;OAEG;IACM,KAAK,IAAI,IAAI;IAItB;;OAEG;IACH,YAAY,IAAI;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI;IAMnD;;OAEG;IACH,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAUrB,MAAM,IAAI,cAAc;CAgBlC"}
@@ -3,7 +3,7 @@ import { html, LitElement, nothing } from 'lit';
3
3
  import { property, query, state } from 'lit/decorators.js';
4
4
  import { classMap } from 'lit/directives/class-map.js';
5
5
  import { linter } from '@codemirror/lint';
6
- import { EditorState } from '@codemirror/state';
6
+ import { Compartment, EditorState } from '@codemirror/state';
7
7
  import { autocompletion, } from '@codemirror/autocomplete';
8
8
  import { javascript } from '@codemirror/lang-javascript';
9
9
  import { syntaxHighlighting, defaultHighlightStyle } from '@codemirror/language';
@@ -16,6 +16,7 @@ import { functionLinter } from './Linter.js';
16
16
  import { SuggestionMatchDecorator } from './SuggestionMatchDecorator.js';
17
17
  let CodeEditor = (() => {
18
18
  let _classSuper = LitElement;
19
+ let _instanceExtraInitializers = [];
19
20
  let _label_decorators;
20
21
  let _label_initializers = [];
21
22
  let _label_extraInitializers = [];
@@ -37,9 +38,7 @@ let CodeEditor = (() => {
37
38
  let _placeholder_decorators;
38
39
  let _placeholder_initializers = [];
39
40
  let _placeholder_extraInitializers = [];
40
- let _value_decorators;
41
- let _value_initializers = [];
42
- let _value_extraInitializers = [];
41
+ let _set_value_decorators;
43
42
  let _functionSchemas_decorators;
44
43
  let _functionSchemas_initializers = [];
45
44
  let _functionSchemas_extraInitializers = [];
@@ -71,7 +70,7 @@ let CodeEditor = (() => {
71
70
  _name_decorators = [property({ type: String })];
72
71
  _required_decorators = [property({ type: Boolean })];
73
72
  _placeholder_decorators = [property({ type: String })];
74
- _value_decorators = [property({ type: String })];
73
+ _set_value_decorators = [property({ type: String })];
75
74
  _functionSchemas_decorators = [property({ type: Array, attribute: false })];
76
75
  _suggestions_decorators = [property({ type: Array, attribute: false })];
77
76
  _darkTheme_decorators = [property({ type: Boolean, attribute: 'dark-theme' })];
@@ -86,7 +85,7 @@ let CodeEditor = (() => {
86
85
  __esDecorate(this, null, _name_decorators, { kind: "accessor", name: "name", static: false, private: false, access: { has: obj => "name" in obj, get: obj => obj.name, set: (obj, value) => { obj.name = value; } }, metadata: _metadata }, _name_initializers, _name_extraInitializers);
87
86
  __esDecorate(this, null, _required_decorators, { kind: "accessor", name: "required", static: false, private: false, access: { has: obj => "required" in obj, get: obj => obj.required, set: (obj, value) => { obj.required = value; } }, metadata: _metadata }, _required_initializers, _required_extraInitializers);
88
87
  __esDecorate(this, null, _placeholder_decorators, { kind: "accessor", name: "placeholder", static: false, private: false, access: { has: obj => "placeholder" in obj, get: obj => obj.placeholder, set: (obj, value) => { obj.placeholder = value; } }, metadata: _metadata }, _placeholder_initializers, _placeholder_extraInitializers);
89
- __esDecorate(this, null, _value_decorators, { kind: "accessor", name: "value", static: false, private: false, access: { has: obj => "value" in obj, get: obj => obj.value, set: (obj, value) => { obj.value = value; } }, metadata: _metadata }, _value_initializers, _value_extraInitializers);
88
+ __esDecorate(this, null, _set_value_decorators, { kind: "setter", name: "value", static: false, private: false, access: { has: obj => "value" in obj, set: (obj, value) => { obj.value = value; } }, metadata: _metadata }, null, _instanceExtraInitializers);
90
89
  __esDecorate(this, null, _functionSchemas_decorators, { kind: "accessor", name: "functionSchemas", static: false, private: false, access: { has: obj => "functionSchemas" in obj, get: obj => obj.functionSchemas, set: (obj, value) => { obj.functionSchemas = value; } }, metadata: _metadata }, _functionSchemas_initializers, _functionSchemas_extraInitializers);
91
90
  __esDecorate(this, null, _suggestions_decorators, { kind: "accessor", name: "suggestions", static: false, private: false, access: { has: obj => "suggestions" in obj, get: obj => obj.suggestions, set: (obj, value) => { obj.suggestions = value; } }, metadata: _metadata }, _suggestions_initializers, _suggestions_extraInitializers);
92
91
  __esDecorate(this, null, _darkTheme_decorators, { kind: "accessor", name: "darkTheme", static: false, private: false, access: { has: obj => "darkTheme" in obj, get: obj => obj.darkTheme, set: (obj, value) => { obj.darkTheme = value; } }, metadata: _metadata }, _darkTheme_initializers, _darkTheme_extraInitializers);
@@ -104,11 +103,11 @@ let CodeEditor = (() => {
104
103
  mode: 'open',
105
104
  delegatesFocus: true,
106
105
  };
107
- #label_accessor_storage = __runInitializers(this, _label_initializers, ''
106
+ #label_accessor_storage = (__runInitializers(this, _instanceExtraInitializers), __runInitializers(this, _label_initializers, ''
108
107
  /**
109
108
  * Supporting text displayed below the editor
110
109
  */
111
- );
110
+ ));
112
111
  /**
113
112
  * The label text displayed as placeholder/floating label
114
113
  */
@@ -166,7 +165,7 @@ let CodeEditor = (() => {
166
165
  set required(value) { this.#required_accessor_storage = value; }
167
166
  #placeholder_accessor_storage = (__runInitializers(this, _required_extraInitializers), __runInitializers(this, _placeholder_initializers, ''
168
167
  /**
169
- * The editor content value
168
+ * This property is used internally to set value without triggering updates.
170
169
  */
171
170
  ));
172
171
  /**
@@ -174,21 +173,29 @@ let CodeEditor = (() => {
174
173
  */
175
174
  get placeholder() { return this.#placeholder_accessor_storage; }
176
175
  set placeholder(value) { this.#placeholder_accessor_storage = value; }
177
- #value_accessor_storage = (__runInitializers(this, _placeholder_extraInitializers), __runInitializers(this, _value_initializers, ''
178
176
  /**
179
- * Available function schemas for autocomplete
177
+ * This property is used internally to set value without triggering updates.
180
178
  */
181
- ));
179
+ #value = (__runInitializers(this, _placeholder_extraInitializers), '');
182
180
  /**
183
181
  * The editor content value
184
182
  */
185
- get value() { return this.#value_accessor_storage; }
186
- set value(value) { this.#value_accessor_storage = value; }
187
- #functionSchemas_accessor_storage = (__runInitializers(this, _value_extraInitializers), __runInitializers(this, _functionSchemas_initializers, []
183
+ get value() {
184
+ return this.#value;
185
+ }
186
+ set value(newValue) {
187
+ const oldValue = this.#value;
188
+ if (newValue !== oldValue) {
189
+ this.#value = newValue;
190
+ this._previousValue = newValue;
191
+ this.requestUpdate('value', oldValue);
192
+ }
193
+ }
194
+ #functionSchemas_accessor_storage = __runInitializers(this, _functionSchemas_initializers, []
188
195
  /**
189
196
  * Available suggestions for autocomplete
190
197
  */
191
- ));
198
+ );
192
199
  /**
193
200
  * Available function schemas for autocomplete
194
201
  */
@@ -230,6 +237,10 @@ let CodeEditor = (() => {
230
237
  get isEditorFocus() { return this.#isEditorFocus_accessor_storage; }
231
238
  set isEditorFocus(value) { this.#isEditorFocus_accessor_storage = value; }
232
239
  editorView = __runInitializers(this, _isEditorFocus_extraInitializers);
240
+ /**
241
+ * A control value to track previous value of the editor.
242
+ * This is used to detect when change event should be dispatched.
243
+ */
233
244
  _previousValue = '';
234
245
  /**
235
246
  * Matcher for suggestion placeholders in the editor.
@@ -252,6 +263,7 @@ let CodeEditor = (() => {
252
263
  }
253
264
  return suggestions;
254
265
  }
266
+ readonlyState = new Compartment();
255
267
  disconnectedCallback() {
256
268
  super.disconnectedCallback();
257
269
  this.editorView?.destroy();
@@ -271,7 +283,9 @@ let CodeEditor = (() => {
271
283
  this.updateEditorContent();
272
284
  }
273
285
  if (changedProperties.has('disabled')) {
274
- this.updateEditorState();
286
+ this.editorView?.dispatch({
287
+ effects: this.readonlyState.reconfigure(EditorState.readOnly.of(this.disabled)),
288
+ });
275
289
  }
276
290
  }
277
291
  /**
@@ -297,6 +311,7 @@ let CodeEditor = (() => {
297
311
  this.createPlaceholderPlugin(),
298
312
  hoverTooltip(this.createHoverTooltipSource),
299
313
  linter((view) => functionLinter(view, this.functionSchemas, (e) => this.dispatchEvent(e))),
314
+ this.readonlyState.of(EditorState.readOnly.of(this.disabled)),
300
315
  ];
301
316
  // Add language support
302
317
  if (this.language === 'javascript') {
@@ -524,21 +539,6 @@ let CodeEditor = (() => {
524
539
  });
525
540
  }
526
541
  }
527
- /**
528
- * Update editor state (e.g., disabled state)
529
- */
530
- updateEditorState() {
531
- if (!this.editorView)
532
- return;
533
- // For now, we'll handle disabled state differently
534
- // CodeMirror 6 doesn't use reconfigure for editable
535
- if (this.disabled) {
536
- this.editorView.contentDOM.setAttribute('contenteditable', 'false');
537
- }
538
- else {
539
- this.editorView.contentDOM.setAttribute('contenteditable', 'true');
540
- }
541
- }
542
542
  /**
543
543
  * Handle editor content change
544
544
  */
@@ -546,20 +546,18 @@ let CodeEditor = (() => {
546
546
  if (!this.editorView)
547
547
  return;
548
548
  const newValue = this.editorView.state.doc.toString();
549
- if (newValue !== this._previousValue) {
550
- this._previousValue = newValue;
551
- this.value = newValue;
552
- this.hasContent = newValue.length > 0;
553
- this.dispatchEvent(new Event('input', { bubbles: true }));
554
- }
549
+ this.#value = newValue;
550
+ this.hasContent = newValue.length > 0;
551
+ this.dispatchEvent(new Event('input', { bubbles: true }));
555
552
  }
556
553
  /**
557
554
  * Handle focus change
558
555
  */
559
556
  handleFocusChange(hasFocus) {
560
557
  this.isEditorFocus = hasFocus;
561
- if (!hasFocus && this.value !== this._previousValue) {
562
- this.dispatchEvent(new Event('change', { bubbles: true }));
558
+ if (!hasFocus && this.#value !== this._previousValue) {
559
+ this._previousValue = this.#value;
560
+ this.dispatchEvent(new Event('change'));
563
561
  }
564
562
  }
565
563
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"CodeEditor.js","sourceRoot":"","sources":["../../../../../src/elements/code-editor/internals/CodeEditor.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, PropertyValues, TemplateResult, nothing } from 'lit'\nimport { property, query, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { linter } from '@codemirror/lint'\nimport { EditorState, Extension } from '@codemirror/state'\nimport {\n autocompletion,\n CompletionContext,\n type CompletionResult,\n type CompletionSource,\n type Completion,\n} from '@codemirror/autocomplete'\nimport { javascript } from '@codemirror/lang-javascript'\nimport { syntaxHighlighting, defaultHighlightStyle } from '@codemirror/language'\nimport { oneDark } from '@codemirror/theme-one-dark'\nimport { keymap } from '@codemirror/view'\nimport { defaultKeymap } from '@codemirror/commands'\nimport {\n EditorView,\n Decoration,\n DecorationSet,\n ViewPlugin,\n ViewUpdate,\n hoverTooltip,\n type Tooltip,\n} from '@codemirror/view'\nimport type { FunctionSchema } from '@pawel-up/jexl/schemas/types.js'\nimport { getTypeStringFromSchema } from '@pawel-up/jexl/schemas/utils.js'\nimport { functionLinter } from './Linter.js'\nimport type { FunctionInsertEvent, Suggestion, SuggestionInsertEvent } from './types.js'\nimport { SuggestionMatchDecorator } from './SuggestionMatchDecorator.js'\n\n/**\n * A CodeMirror 6 based editor component that supports function autocomplete and suggestion placeholders.\n *\n * Features:\n * - Dynamic function schema loading\n * - Autocomplete for functions and suggestions\n * - Suggestion placeholders with double curly braces ({{suggestion}})\n * - Keyboard navigation\n * - Accessibility support\n *\n * @fires function-insert - When a function is inserted\n * @fires suggestion-insert - When a suggestion is inserted\n * @fires input - When the editor content changes\n * @fires change - When the editor loses focus and content has changed\n */\nexport default class CodeEditor extends LitElement {\n /**\n * Shadow root configuration for the component.\n * Uses 'open' mode for accessibility and delegates focus to enable proper focus management.\n */\n static override shadowRootOptions: ShadowRootInit = {\n mode: 'open',\n delegatesFocus: true,\n }\n\n /**\n * The label text displayed as placeholder/floating label\n */\n @property({ type: String })\n accessor label = ''\n\n /**\n * Supporting text displayed below the editor\n */\n @property({ type: String, attribute: 'supporting-text' })\n accessor supportingText = ''\n\n /**\n * Whether the component is disabled\n */\n @property({ type: Boolean, reflect: true })\n accessor disabled = false\n\n /**\n * Whether the component is in an invalid state\n */\n @property({ type: Boolean, reflect: true })\n accessor invalid = false\n\n /**\n * The name attribute for form integration\n */\n @property({ type: String })\n accessor name = ''\n\n /**\n * Whether the input is required\n */\n @property({ type: Boolean })\n accessor required = false\n\n /**\n * Placeholder text shown when editor is empty\n */\n @property({ type: String })\n accessor placeholder = ''\n\n /**\n * The editor content value\n */\n @property({ type: String })\n accessor value = ''\n\n /**\n * Available function schemas for autocomplete\n */\n @property({ type: Array, attribute: false })\n accessor functionSchemas: FunctionSchema[] = []\n\n /**\n * Available suggestions for autocomplete\n */\n @property({ type: Array, attribute: false })\n accessor suggestions: Suggestion[] = []\n\n /**\n * Whether to use dark theme\n */\n @property({ type: Boolean, attribute: 'dark-theme' })\n accessor darkTheme = false\n\n /**\n * Programming language for syntax highlighting\n */\n @property({ type: String })\n accessor language = 'javascript'\n\n @query('.editor-container')\n private accessor editorContainer!: HTMLDivElement\n\n @state()\n private accessor hasContent = false\n\n @state()\n private accessor isEditorFocus = false\n\n private editorView?: EditorView\n private _previousValue = ''\n /**\n * Matcher for suggestion placeholders in the editor.\n */\n placeholderMatcher?: SuggestionMatchDecorator\n\n /**\n * Get all suggestions (placeholders) currently in the editor\n */\n get activeSuggestions(): Suggestion[] {\n const suggestions: Suggestion[] = []\n const placeholderPattern = /\\{\\{(\\w+)\\}\\}/g\n let match: RegExpExecArray | null\n while ((match = placeholderPattern.exec(this.value)) !== null) {\n const placeholderText = match[1]\n // Find suggestion by label\n const suggestion = this.suggestions.find((s) => s.label.toLowerCase() === placeholderText.toLowerCase())\n if (suggestion) {\n suggestions.push(suggestion)\n }\n }\n return suggestions\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback()\n this.editorView?.destroy()\n }\n\n override firstUpdated(): void {\n this.initializeCodeMirror()\n this.updateEditorContent()\n }\n\n override willUpdate(changedProperties: PropertyValues): void {\n super.willUpdate(changedProperties)\n\n if (changedProperties.has('suggestions')) {\n if (this.placeholderMatcher) {\n this.placeholderMatcher.suggestions = this.suggestions || []\n }\n }\n\n if (changedProperties.has('value') && this.editorView) {\n this.updateEditorContent()\n }\n\n if (changedProperties.has('disabled')) {\n this.updateEditorState()\n }\n }\n\n /**\n * Initialize CodeMirror editor with extensions\n */\n private initializeCodeMirror(): void {\n const extensions: Extension[] = [\n keymap.of(defaultKeymap),\n syntaxHighlighting(defaultHighlightStyle),\n autocompletion({\n override: [this.createCompletionSource()],\n activateOnTyping: true,\n maxRenderedOptions: 10,\n }),\n EditorView.updateListener.of((update: ViewUpdate) => {\n if (update.docChanged) {\n this.handleEditorChange()\n }\n if (update.focusChanged) {\n this.handleFocusChange(update.view.hasFocus)\n }\n }),\n this.createPlaceholderPlugin(),\n hoverTooltip(this.createHoverTooltipSource),\n linter((view) => functionLinter(view, this.functionSchemas, (e) => this.dispatchEvent(e))),\n ]\n\n // Add language support\n if (this.language === 'javascript') {\n extensions.push(javascript())\n }\n\n // Add theme\n if (this.darkTheme) {\n extensions.push(oneDark)\n }\n\n // Add placeholder\n if (this.placeholder) {\n extensions.push(\n EditorView.contentAttributes.of({\n 'aria-placeholder': this.placeholder,\n })\n )\n }\n\n const state = EditorState.create({\n doc: this.value,\n extensions,\n })\n\n this.editorView = new EditorView({\n state,\n parent: this.editorContainer,\n })\n }\n\n /**\n * Creates the ViewPlugin for rendering suggestion placeholders.\n * This is created as a method to get access to the component's `suggestions`.\n */\n private createPlaceholderPlugin(): Extension {\n const placeholderMatcher = new SuggestionMatchDecorator(/\\{\\{(\\w+)\\}\\}/g, this.suggestions)\n this.placeholderMatcher = placeholderMatcher\n // This class needs to be defined here to have access to the `placeholderMatcher`\n class AtomicDecorationRange {\n placeholders: DecorationSet\n constructor(view: EditorView) {\n this.placeholders = placeholderMatcher.createDeco(view)\n }\n update(update: ViewUpdate) {\n this.placeholders = placeholderMatcher.updateDeco(update, this.placeholders)\n }\n }\n\n return ViewPlugin.fromClass(AtomicDecorationRange, {\n decorations: (instance) => instance.placeholders,\n provide: (plugin) => EditorView.atomicRanges.of((view) => view.plugin(plugin)?.placeholders || Decoration.none),\n })\n }\n\n /**\n * Create completion source for functions and suggestions\n */\n private createCompletionSource(): CompletionSource {\n return (context: CompletionContext): CompletionResult | null => {\n const { pos } = context\n const line = context.state.doc.lineAt(pos)\n const textBefore = line.text.slice(0, pos - line.from)\n\n // Check if we're typing a function name\n const functionMatch = textBefore.match(/(\\w+)$/)\n if (functionMatch) {\n const prefix = functionMatch[1]\n const functions = this.functionSchemas\n .filter((fn) => fn.name.toLowerCase().startsWith(prefix.toLowerCase()))\n .map((fn) => this.createFunctionCompletion(fn))\n\n if (functions.length > 0) {\n return {\n from: pos - prefix.length,\n options: functions,\n }\n }\n }\n\n // Check if we're typing a suggestion trigger (e.g., {{)\n const suggestionMatch = textBefore.match(/\\{\\{(\\w*)$/)\n if (suggestionMatch) {\n const prefix = suggestionMatch[1]\n const suggestions = this.suggestions\n .filter((suggestion) => suggestion.label.toLowerCase().startsWith(prefix.toLowerCase()))\n .map((suggestion) => this.createSuggestionCompletion(suggestion))\n\n if (suggestions.length > 0) {\n return {\n from: pos - prefix.length,\n options: suggestions,\n }\n }\n }\n\n return null\n }\n }\n\n private createFunctionCompletion(schema: FunctionSchema): Completion {\n const result: Completion = {\n label: schema.name,\n detail: schema.description || '',\n info: () => this.createFunctionInfoElement(schema),\n apply: (view: EditorView, completion: unknown, from: number, to: number) => {\n const functionCall = this.formatFunctionCall(schema)\n view.dispatch({\n changes: { from, to, insert: functionCall },\n selection: { anchor: from + functionCall.length },\n })\n this.dispatchFunctionInsert(schema, from)\n },\n }\n\n return result\n }\n\n private createSuggestionCompletion(suggestion: Suggestion): Completion {\n const result: Completion = {\n label: suggestion.label,\n detail: suggestion.description || '',\n info: suggestion.suffix || '',\n apply: (view: EditorView, completion: unknown, from: number, to: number) => {\n const placeholderText = `{{${suggestion.label}}}`\n view.dispatch({\n changes: { from: from - 2, to, insert: placeholderText }, // -2 to include the {{\n selection: { anchor: from - 2 + placeholderText.length },\n })\n this.dispatchSuggestionInsert(suggestion, from - 2)\n },\n }\n\n return result\n }\n\n /**\n * Creates the source for the hover tooltips.\n * This is an arrow function to automatically bind `this`.\n */\n private createHoverTooltipSource = (view: EditorView, pos: number): Tooltip | null => {\n const word = view.state.wordAt(pos)\n if (!word) {\n return null\n }\n\n const functionName = view.state.doc.sliceString(word.from, word.to)\n const fnSchema = this.functionSchemas.find((schema) => schema.name === functionName)\n\n if (!fnSchema) {\n return null\n }\n\n return {\n pos: word.from,\n end: word.to,\n above: true,\n create: () => ({ dom: this.createFunctionInfoElement(fnSchema) }),\n }\n }\n\n /**\n * Creates a styled HTML element to display function documentation.\n * This is used for both hover tooltips and autocomplete info panels.\n */\n private createFunctionInfoElement(fn: FunctionSchema): HTMLElement {\n const container = document.createElement('div')\n container.className = 'function-info' // for styling\n\n if (fn.description) {\n const description = document.createElement('p')\n description.className = 'description'\n description.textContent = fn.description\n container.appendChild(description)\n }\n\n if (fn.parameters && fn.parameters.length > 0) {\n const paramsContainer = document.createElement('div')\n paramsContainer.className = 'parameters'\n\n const paramsHeader = document.createElement('h4')\n paramsHeader.textContent = 'Parameters'\n paramsContainer.appendChild(paramsHeader)\n\n const paramsList = document.createElement('ul')\n fn.parameters.forEach((param) => {\n const listItem = document.createElement('li')\n\n const name = document.createElement('span')\n name.className = 'param-name'\n name.textContent = param.name\n\n const type = document.createElement('span')\n type.className = 'param-type'\n type.textContent = `: ${getTypeStringFromSchema(param.schema)}`\n\n listItem.appendChild(name)\n listItem.appendChild(type)\n\n if (param.schema.description) {\n const paramDesc = document.createElement('p')\n paramDesc.className = 'param-description'\n paramDesc.textContent = param.schema.description\n listItem.appendChild(paramDesc)\n }\n paramsList.appendChild(listItem)\n })\n paramsContainer.appendChild(paramsList)\n container.appendChild(paramsContainer)\n }\n\n if (fn.returns) {\n const returnsContainer = document.createElement('div')\n returnsContainer.className = 'returns'\n\n const returnsHeader = document.createElement('h4')\n returnsHeader.textContent = 'Returns'\n returnsContainer.appendChild(returnsHeader)\n\n const returnsDesc = document.createElement('p')\n const returnType = getTypeStringFromSchema(fn.returns)\n returnsDesc.textContent = fn.returns.description ? `${returnType}: ${fn.returns.description}` : returnType\n returnsContainer.appendChild(returnsDesc)\n container.appendChild(returnsContainer)\n }\n\n return container\n }\n\n /**\n * Format function call with parameters\n */\n private formatFunctionCall(fn: FunctionSchema): string {\n if (!fn.parameters || fn.parameters.length === 0) {\n return `${fn.name}()`\n }\n\n const params = fn.parameters\n .map((param) => {\n if (param.required) {\n return param.name\n }\n return `${param.name}?`\n })\n .join(', ')\n\n return `${fn.name}(${params})`\n }\n\n /**\n * Update editor content when value changes\n */\n private updateEditorContent(): void {\n if (!this.editorView) return\n\n const currentValue = this.editorView.state.doc.toString()\n if (currentValue !== this.value) {\n this.editorView.dispatch({\n changes: {\n from: 0,\n to: this.editorView.state.doc.length,\n insert: this.value,\n },\n })\n }\n }\n\n /**\n * Update editor state (e.g., disabled state)\n */\n private updateEditorState(): void {\n if (!this.editorView) return\n\n // For now, we'll handle disabled state differently\n // CodeMirror 6 doesn't use reconfigure for editable\n if (this.disabled) {\n this.editorView.contentDOM.setAttribute('contenteditable', 'false')\n } else {\n this.editorView.contentDOM.setAttribute('contenteditable', 'true')\n }\n }\n\n /**\n * Handle editor content change\n */\n private handleEditorChange(): void {\n if (!this.editorView) return\n\n const newValue = this.editorView.state.doc.toString()\n if (newValue !== this._previousValue) {\n this._previousValue = newValue\n this.value = newValue\n this.hasContent = newValue.length > 0\n\n this.dispatchEvent(new Event('input', { bubbles: true }))\n }\n }\n\n /**\n * Handle focus change\n */\n private handleFocusChange(hasFocus: boolean): void {\n this.isEditorFocus = hasFocus\n\n if (!hasFocus && this.value !== this._previousValue) {\n this.dispatchEvent(new Event('change', { bubbles: true }))\n }\n }\n\n /**\n * Dispatch function insert event\n */\n private dispatchFunctionInsert(functionSchema: FunctionSchema, position: number): void {\n const event = new CustomEvent<FunctionInsertEvent>('function-insert', {\n detail: { functionSchema, position },\n bubbles: true,\n })\n this.dispatchEvent(event)\n }\n\n /**\n * Dispatch suggestion insert event\n */\n private dispatchSuggestionInsert(suggestion: Suggestion, position: number): void {\n const event = new CustomEvent<SuggestionInsertEvent>('suggestion-insert', {\n detail: { suggestion, position },\n bubbles: true,\n })\n this.dispatchEvent(event)\n }\n\n /**\n * Focus the editor\n */\n override focus(): void {\n this.editorView?.focus()\n }\n\n /**\n * Get the editor's current selection\n */\n getSelection(): { from: number; to: number } | null {\n if (!this.editorView) return null\n const { from, to } = this.editorView.state.selection.main\n return { from, to }\n }\n\n /**\n * Insert text at the current cursor position\n */\n insertText(text: string): void {\n if (!this.editorView) return\n\n const { from, to } = this.editorView.state.selection.main\n this.editorView.dispatch({\n changes: { from, to, insert: text },\n selection: { anchor: from + text.length },\n })\n }\n\n override render(): TemplateResult {\n const hasLabel = !!this.label\n const hasSupportingText = !!this.supportingText\n\n return html`\n <div class=\"surface ${classMap({ 'has-focus': this.isEditorFocus, 'invalid': this.invalid })}\">\n <div class=\"content\">\n ${hasLabel ? html`<div class=\"label\">${this.label}</div>` : nothing}\n\n <div class=\"editor-container\" part=\"editor\"></div>\n </div>\n\n ${hasSupportingText ? html`<div class=\"supporting-text\">${this.supportingText}</div>` : nothing}\n </div>\n `\n }\n}\n"]}
1
+ {"version":3,"file":"CodeEditor.js","sourceRoot":"","sources":["../../../../../src/elements/code-editor/internals/CodeEditor.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, PropertyValues, TemplateResult, nothing } from 'lit'\nimport { property, query, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { linter } from '@codemirror/lint'\nimport { Compartment, EditorState, Extension } from '@codemirror/state'\nimport {\n autocompletion,\n CompletionContext,\n type CompletionResult,\n type CompletionSource,\n type Completion,\n} from '@codemirror/autocomplete'\nimport { javascript } from '@codemirror/lang-javascript'\nimport { syntaxHighlighting, defaultHighlightStyle } from '@codemirror/language'\nimport { oneDark } from '@codemirror/theme-one-dark'\nimport { keymap } from '@codemirror/view'\nimport { defaultKeymap } from '@codemirror/commands'\nimport {\n EditorView,\n Decoration,\n DecorationSet,\n ViewPlugin,\n ViewUpdate,\n hoverTooltip,\n type Tooltip,\n} from '@codemirror/view'\nimport type { FunctionSchema } from '@pawel-up/jexl/schemas/types.js'\nimport { getTypeStringFromSchema } from '@pawel-up/jexl/schemas/utils.js'\nimport { functionLinter } from './Linter.js'\nimport type { FunctionInsertEvent, Suggestion, SuggestionInsertEvent } from './types.js'\nimport { SuggestionMatchDecorator } from './SuggestionMatchDecorator.js'\n\n/**\n * A CodeMirror 6 based editor component that supports function autocomplete and suggestion placeholders.\n *\n * Features:\n * - Dynamic function schema loading\n * - Autocomplete for functions and suggestions\n * - Suggestion placeholders with double curly braces ({{suggestion}})\n * - Keyboard navigation\n * - Accessibility support\n *\n * @fires function-insert - When a function is inserted\n * @fires suggestion-insert - When a suggestion is inserted\n * @fires input - When the editor content changes\n * @fires change - When the editor loses focus and content has changed\n */\nexport default class CodeEditor extends LitElement {\n /**\n * Shadow root configuration for the component.\n * Uses 'open' mode for accessibility and delegates focus to enable proper focus management.\n */\n static override shadowRootOptions: ShadowRootInit = {\n mode: 'open',\n delegatesFocus: true,\n }\n\n /**\n * The label text displayed as placeholder/floating label\n */\n @property({ type: String })\n accessor label = ''\n\n /**\n * Supporting text displayed below the editor\n */\n @property({ type: String, attribute: 'supporting-text' })\n accessor supportingText = ''\n\n /**\n * Whether the component is disabled\n */\n @property({ type: Boolean, reflect: true })\n accessor disabled = false\n\n /**\n * Whether the component is in an invalid state\n */\n @property({ type: Boolean, reflect: true })\n accessor invalid = false\n\n /**\n * The name attribute for form integration\n */\n @property({ type: String })\n accessor name = ''\n\n /**\n * Whether the input is required\n */\n @property({ type: Boolean })\n accessor required = false\n\n /**\n * Placeholder text shown when editor is empty\n */\n @property({ type: String })\n accessor placeholder = ''\n\n /**\n * This property is used internally to set value without triggering updates.\n */\n #value = ''\n\n /**\n * The editor content value\n */\n get value(): string {\n return this.#value\n }\n\n @property({ type: String })\n set value(newValue: string) {\n const oldValue = this.#value\n if (newValue !== oldValue) {\n this.#value = newValue\n this._previousValue = newValue\n this.requestUpdate('value', oldValue)\n }\n }\n\n /**\n * Available function schemas for autocomplete\n */\n @property({ type: Array, attribute: false })\n accessor functionSchemas: FunctionSchema[] = []\n\n /**\n * Available suggestions for autocomplete\n */\n @property({ type: Array, attribute: false })\n accessor suggestions: Suggestion[] = []\n\n /**\n * Whether to use dark theme\n */\n @property({ type: Boolean, attribute: 'dark-theme' })\n accessor darkTheme = false\n\n /**\n * Programming language for syntax highlighting\n */\n @property({ type: String })\n accessor language = 'javascript'\n\n @query('.editor-container')\n private accessor editorContainer!: HTMLDivElement\n\n @state()\n private accessor hasContent = false\n\n @state()\n private accessor isEditorFocus = false\n\n private editorView?: EditorView\n /**\n * A control value to track previous value of the editor.\n * This is used to detect when change event should be dispatched.\n */\n private _previousValue = ''\n /**\n * Matcher for suggestion placeholders in the editor.\n */\n placeholderMatcher?: SuggestionMatchDecorator\n\n /**\n * Get all suggestions (placeholders) currently in the editor\n */\n get activeSuggestions(): Suggestion[] {\n const suggestions: Suggestion[] = []\n const placeholderPattern = /\\{\\{(\\w+)\\}\\}/g\n let match: RegExpExecArray | null\n while ((match = placeholderPattern.exec(this.value)) !== null) {\n const placeholderText = match[1]\n // Find suggestion by label\n const suggestion = this.suggestions.find((s) => s.label.toLowerCase() === placeholderText.toLowerCase())\n if (suggestion) {\n suggestions.push(suggestion)\n }\n }\n return suggestions\n }\n\n private readonlyState = new Compartment()\n\n override disconnectedCallback(): void {\n super.disconnectedCallback()\n this.editorView?.destroy()\n }\n\n override firstUpdated(): void {\n this.initializeCodeMirror()\n this.updateEditorContent()\n }\n\n override willUpdate(changedProperties: PropertyValues): void {\n super.willUpdate(changedProperties)\n\n if (changedProperties.has('suggestions')) {\n if (this.placeholderMatcher) {\n this.placeholderMatcher.suggestions = this.suggestions || []\n }\n }\n\n if (changedProperties.has('value') && this.editorView) {\n this.updateEditorContent()\n }\n\n if (changedProperties.has('disabled')) {\n this.editorView?.dispatch({\n effects: this.readonlyState.reconfigure(EditorState.readOnly.of(this.disabled)),\n })\n }\n }\n\n /**\n * Initialize CodeMirror editor with extensions\n */\n private initializeCodeMirror(): void {\n const extensions: Extension[] = [\n keymap.of(defaultKeymap),\n syntaxHighlighting(defaultHighlightStyle),\n autocompletion({\n override: [this.createCompletionSource()],\n activateOnTyping: true,\n maxRenderedOptions: 10,\n }),\n EditorView.updateListener.of((update: ViewUpdate) => {\n if (update.docChanged) {\n this.handleEditorChange()\n }\n if (update.focusChanged) {\n this.handleFocusChange(update.view.hasFocus)\n }\n }),\n this.createPlaceholderPlugin(),\n hoverTooltip(this.createHoverTooltipSource),\n linter((view) => functionLinter(view, this.functionSchemas, (e) => this.dispatchEvent(e))),\n this.readonlyState.of(EditorState.readOnly.of(this.disabled)),\n ]\n\n // Add language support\n if (this.language === 'javascript') {\n extensions.push(javascript())\n }\n\n // Add theme\n if (this.darkTheme) {\n extensions.push(oneDark)\n }\n\n // Add placeholder\n if (this.placeholder) {\n extensions.push(\n EditorView.contentAttributes.of({\n 'aria-placeholder': this.placeholder,\n })\n )\n }\n\n const state = EditorState.create({\n doc: this.value,\n extensions,\n })\n\n this.editorView = new EditorView({\n state,\n parent: this.editorContainer,\n })\n }\n\n /**\n * Creates the ViewPlugin for rendering suggestion placeholders.\n * This is created as a method to get access to the component's `suggestions`.\n */\n private createPlaceholderPlugin(): Extension {\n const placeholderMatcher = new SuggestionMatchDecorator(/\\{\\{(\\w+)\\}\\}/g, this.suggestions)\n this.placeholderMatcher = placeholderMatcher\n // This class needs to be defined here to have access to the `placeholderMatcher`\n class AtomicDecorationRange {\n placeholders: DecorationSet\n constructor(view: EditorView) {\n this.placeholders = placeholderMatcher.createDeco(view)\n }\n update(update: ViewUpdate) {\n this.placeholders = placeholderMatcher.updateDeco(update, this.placeholders)\n }\n }\n\n return ViewPlugin.fromClass(AtomicDecorationRange, {\n decorations: (instance) => instance.placeholders,\n provide: (plugin) => EditorView.atomicRanges.of((view) => view.plugin(plugin)?.placeholders || Decoration.none),\n })\n }\n\n /**\n * Create completion source for functions and suggestions\n */\n private createCompletionSource(): CompletionSource {\n return (context: CompletionContext): CompletionResult | null => {\n const { pos } = context\n const line = context.state.doc.lineAt(pos)\n const textBefore = line.text.slice(0, pos - line.from)\n\n // Check if we're typing a function name\n const functionMatch = textBefore.match(/(\\w+)$/)\n if (functionMatch) {\n const prefix = functionMatch[1]\n const functions = this.functionSchemas\n .filter((fn) => fn.name.toLowerCase().startsWith(prefix.toLowerCase()))\n .map((fn) => this.createFunctionCompletion(fn))\n\n if (functions.length > 0) {\n return {\n from: pos - prefix.length,\n options: functions,\n }\n }\n }\n\n // Check if we're typing a suggestion trigger (e.g., {{)\n const suggestionMatch = textBefore.match(/\\{\\{(\\w*)$/)\n if (suggestionMatch) {\n const prefix = suggestionMatch[1]\n const suggestions = this.suggestions\n .filter((suggestion) => suggestion.label.toLowerCase().startsWith(prefix.toLowerCase()))\n .map((suggestion) => this.createSuggestionCompletion(suggestion))\n\n if (suggestions.length > 0) {\n return {\n from: pos - prefix.length,\n options: suggestions,\n }\n }\n }\n\n return null\n }\n }\n\n private createFunctionCompletion(schema: FunctionSchema): Completion {\n const result: Completion = {\n label: schema.name,\n detail: schema.description || '',\n info: () => this.createFunctionInfoElement(schema),\n apply: (view: EditorView, completion: unknown, from: number, to: number) => {\n const functionCall = this.formatFunctionCall(schema)\n view.dispatch({\n changes: { from, to, insert: functionCall },\n selection: { anchor: from + functionCall.length },\n })\n this.dispatchFunctionInsert(schema, from)\n },\n }\n\n return result\n }\n\n private createSuggestionCompletion(suggestion: Suggestion): Completion {\n const result: Completion = {\n label: suggestion.label,\n detail: suggestion.description || '',\n info: suggestion.suffix || '',\n apply: (view: EditorView, completion: unknown, from: number, to: number) => {\n const placeholderText = `{{${suggestion.label}}}`\n view.dispatch({\n changes: { from: from - 2, to, insert: placeholderText }, // -2 to include the {{\n selection: { anchor: from - 2 + placeholderText.length },\n })\n this.dispatchSuggestionInsert(suggestion, from - 2)\n },\n }\n\n return result\n }\n\n /**\n * Creates the source for the hover tooltips.\n * This is an arrow function to automatically bind `this`.\n */\n private createHoverTooltipSource = (view: EditorView, pos: number): Tooltip | null => {\n const word = view.state.wordAt(pos)\n if (!word) {\n return null\n }\n\n const functionName = view.state.doc.sliceString(word.from, word.to)\n const fnSchema = this.functionSchemas.find((schema) => schema.name === functionName)\n\n if (!fnSchema) {\n return null\n }\n\n return {\n pos: word.from,\n end: word.to,\n above: true,\n create: () => ({ dom: this.createFunctionInfoElement(fnSchema) }),\n }\n }\n\n /**\n * Creates a styled HTML element to display function documentation.\n * This is used for both hover tooltips and autocomplete info panels.\n */\n private createFunctionInfoElement(fn: FunctionSchema): HTMLElement {\n const container = document.createElement('div')\n container.className = 'function-info' // for styling\n\n if (fn.description) {\n const description = document.createElement('p')\n description.className = 'description'\n description.textContent = fn.description\n container.appendChild(description)\n }\n\n if (fn.parameters && fn.parameters.length > 0) {\n const paramsContainer = document.createElement('div')\n paramsContainer.className = 'parameters'\n\n const paramsHeader = document.createElement('h4')\n paramsHeader.textContent = 'Parameters'\n paramsContainer.appendChild(paramsHeader)\n\n const paramsList = document.createElement('ul')\n fn.parameters.forEach((param) => {\n const listItem = document.createElement('li')\n\n const name = document.createElement('span')\n name.className = 'param-name'\n name.textContent = param.name\n\n const type = document.createElement('span')\n type.className = 'param-type'\n type.textContent = `: ${getTypeStringFromSchema(param.schema)}`\n\n listItem.appendChild(name)\n listItem.appendChild(type)\n\n if (param.schema.description) {\n const paramDesc = document.createElement('p')\n paramDesc.className = 'param-description'\n paramDesc.textContent = param.schema.description\n listItem.appendChild(paramDesc)\n }\n paramsList.appendChild(listItem)\n })\n paramsContainer.appendChild(paramsList)\n container.appendChild(paramsContainer)\n }\n\n if (fn.returns) {\n const returnsContainer = document.createElement('div')\n returnsContainer.className = 'returns'\n\n const returnsHeader = document.createElement('h4')\n returnsHeader.textContent = 'Returns'\n returnsContainer.appendChild(returnsHeader)\n\n const returnsDesc = document.createElement('p')\n const returnType = getTypeStringFromSchema(fn.returns)\n returnsDesc.textContent = fn.returns.description ? `${returnType}: ${fn.returns.description}` : returnType\n returnsContainer.appendChild(returnsDesc)\n container.appendChild(returnsContainer)\n }\n\n return container\n }\n\n /**\n * Format function call with parameters\n */\n private formatFunctionCall(fn: FunctionSchema): string {\n if (!fn.parameters || fn.parameters.length === 0) {\n return `${fn.name}()`\n }\n\n const params = fn.parameters\n .map((param) => {\n if (param.required) {\n return param.name\n }\n return `${param.name}?`\n })\n .join(', ')\n\n return `${fn.name}(${params})`\n }\n\n /**\n * Update editor content when value changes\n */\n private updateEditorContent(): void {\n if (!this.editorView) return\n\n const currentValue = this.editorView.state.doc.toString()\n if (currentValue !== this.value) {\n this.editorView.dispatch({\n changes: {\n from: 0,\n to: this.editorView.state.doc.length,\n insert: this.value,\n },\n })\n }\n }\n\n /**\n * Handle editor content change\n */\n private handleEditorChange(): void {\n if (!this.editorView) return\n\n const newValue = this.editorView.state.doc.toString()\n this.#value = newValue\n this.hasContent = newValue.length > 0\n\n this.dispatchEvent(new Event('input', { bubbles: true }))\n }\n\n /**\n * Handle focus change\n */\n private handleFocusChange(hasFocus: boolean): void {\n this.isEditorFocus = hasFocus\n\n if (!hasFocus && this.#value !== this._previousValue) {\n this._previousValue = this.#value\n this.dispatchEvent(new Event('change'))\n }\n }\n\n /**\n * Dispatch function insert event\n */\n private dispatchFunctionInsert(functionSchema: FunctionSchema, position: number): void {\n const event = new CustomEvent<FunctionInsertEvent>('function-insert', {\n detail: { functionSchema, position },\n bubbles: true,\n })\n this.dispatchEvent(event)\n }\n\n /**\n * Dispatch suggestion insert event\n */\n private dispatchSuggestionInsert(suggestion: Suggestion, position: number): void {\n const event = new CustomEvent<SuggestionInsertEvent>('suggestion-insert', {\n detail: { suggestion, position },\n bubbles: true,\n })\n this.dispatchEvent(event)\n }\n\n /**\n * Focus the editor\n */\n override focus(): void {\n this.editorView?.focus()\n }\n\n /**\n * Get the editor's current selection\n */\n getSelection(): { from: number; to: number } | null {\n if (!this.editorView) return null\n const { from, to } = this.editorView.state.selection.main\n return { from, to }\n }\n\n /**\n * Insert text at the current cursor position\n */\n insertText(text: string): void {\n if (!this.editorView) return\n\n const { from, to } = this.editorView.state.selection.main\n this.editorView.dispatch({\n changes: { from, to, insert: text },\n selection: { anchor: from + text.length },\n })\n }\n\n override render(): TemplateResult {\n const hasLabel = !!this.label\n const hasSupportingText = !!this.supportingText\n\n return html`\n <div class=\"surface ${classMap({ 'has-focus': this.isEditorFocus, 'invalid': this.invalid })}\">\n <div class=\"content\">\n ${hasLabel ? html`<div class=\"label\">${this.label}</div>` : nothing}\n\n <div class=\"editor-container\" part=\"editor\"></div>\n </div>\n\n ${hasSupportingText ? html`<div class=\"supporting-text\">${this.supportingText}</div>` : nothing}\n </div>\n `\n }\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"CodeEditor.styles.d.ts","sourceRoot":"","sources":["../../../../../src/elements/code-editor/internals/CodeEditor.styles.ts"],"names":[],"mappings":";AAEA,wBAuJC"}
1
+ {"version":3,"file":"CodeEditor.styles.d.ts","sourceRoot":"","sources":["../../../../../src/elements/code-editor/internals/CodeEditor.styles.ts"],"names":[],"mappings":";AAEA,wBA8MC"}
@@ -128,8 +128,63 @@ export default css `
128
128
  outline: none;
129
129
  }
130
130
 
131
+ .cm-tooltip-hover {
132
+ box-shadow: var(--md-sys-elevation-3);
133
+ }
134
+
135
+ .editor-container .cm-editor .cm-tooltip,
136
+ .cm-tooltip-lint,
137
+ .function-info {
138
+ background-color: var(--md-sys-color-surface-container-highest);
139
+ color: var(--md-sys-color-on-surface);
140
+ }
141
+
131
142
  .function-info {
132
143
  padding: 8px;
144
+
145
+ font-family: var(--md-sys-typescale-body-medium-font);
146
+ font-weight: var(--md-sys-typescale-body-medium-weight);
147
+ font-size: var(--md-sys-typescale-body-medium-size);
148
+ letter-spacing: var(--md-sys-typescale-body-medium-tracking);
149
+ line-height: var(--md-sys-typescale-body-medium-height);
150
+
151
+ h4 {
152
+ margin: 4px 0;
153
+ font-family: var(--md-sys-typescale-title-medium-font);
154
+ font-weight: var(--md-sys-typescale-title-medium-weight);
155
+ font-size: var(--md-sys-typescale-title-medium-size);
156
+ letter-spacing: var(--md-sys-typescale-title-medium-tracking);
157
+ line-height: var(--md-sys-typescale-title-medium-height);
158
+ }
159
+
160
+ p {
161
+ margin: 0;
162
+ }
163
+
164
+ .description {
165
+ font-family: var(--md-sys-typescale-body-large-font);
166
+ font-weight: var(--md-sys-typescale-body-large-weight);
167
+ font-size: var(--md-sys-typescale-body-large-size);
168
+ letter-spacing: var(--md-sys-typescale-body-large-tracking);
169
+ line-height: var(--md-sys-typescale-body-large-height);
170
+ }
171
+
172
+ ul {
173
+ margin: 0;
174
+ }
175
+
176
+ .param-name,
177
+ .param-type {
178
+ font-family: var(--md-sys-typescale-label-large-font);
179
+ font-weight: var(--md-sys-typescale-label-large-weight);
180
+ font-size: var(--md-sys-typescale-label-large-size);
181
+ letter-spacing: var(--md-sys-typescale-label-large-tracking);
182
+ line-height: var(--md-sys-typescale-label-large-height);
183
+ }
184
+
185
+ .param-description {
186
+ color: var(--md-sys-color-on-surface-variant);
187
+ }
133
188
  }
134
189
 
135
190
  /* Responsive */
@@ -1 +1 @@
1
- {"version":3,"file":"CodeEditor.styles.js","sourceRoot":"","sources":["../../../../../src/elements/code-editor/internals/CodeEditor.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuJjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n :host {\n display: flex;\n flex-direction: column;\n outline: none;\n min-width: 200px;\n background-color: transparent;\n color: var(--md-sys-color-on-surface);\n\n font-family: var(--md-sys-typescale-body-large-font);\n font-size: var(--md-sys-typescale-body-large-size);\n letter-spacing: var(--md-sys-typescale-body-large-tracking);\n line-height: var(--md-sys-typescale-body-large-height);\n }\n\n .surface {\n display: flex;\n flex-direction: column;\n }\n\n .content {\n display: flex;\n flex-direction: column;\n flex: 1;\n }\n\n .label {\n font-family: var(--md-sys-typescale-label-medium-font);\n font-weight: var(--md-sys-typescale-label-medium-weight);\n font-size: var(--md-sys-typescale-label-medium-size);\n letter-spacing: var(--md-sys-typescale-label-medium-tracking);\n line-height: var(--md-sys-typescale-label-medium-height);\n color: var(--md-sys-color-on-surface-variant);\n\n padding: 8px 16px 4px 16px;\n margin: 0;\n }\n\n .has-focus .label {\n color: var(--md-sys-color-primary);\n }\n\n .editor-container {\n position: relative;\n flex: 1;\n\n border-radius: var(--md-sys-shape-corner-extra-small);\n border: 1px solid var(--md-sys-color-outline);\n outline: 0px solid var(--md-sys-color-primary);\n outline-offset: -1px;\n transition:\n border-color 150ms cubic-bezier(0.4, 0, 0.2, 1),\n outline-width 150ms cubic-bezier(0.4, 0, 0.2, 1),\n outline-offset 150ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n .editor-container:focus-within {\n border-color: var(--md-sys-color-primary);\n outline-width: 2px;\n outline-offset: -2px;\n }\n\n .supporting-text {\n margin-top: 4px;\n padding: 0 16px;\n color: var(--md-sys-color-on-surface-variant);\n font-family: var(--md-sys-typescale-body-small-font);\n font-weight: var(--md-sys-typescale-body-small-weight);\n font-size: var(--md-sys-typescale-body-small-size);\n letter-spacing: var(--md-sys-typescale-body-small-tracking);\n line-height: var(--md-sys-typescale-body-small-height);\n }\n\n :host([disabled]) {\n pointer-events: none;\n }\n\n :host([disabled]) .editor-container {\n border-color: var(--md-sys-color-on-surface);\n }\n\n :host([disabled]) .label,\n :host([disabled]) .editor-container {\n color: var(--md-sys-color-on-surface);\n opacity: 0.38;\n }\n\n :host([invalid]) .label,\n :host([invalid]) .supporting-text {\n color: var(--md-sys-color-error);\n }\n\n :host([invalid]) .editor-container {\n border-color: var(--md-sys-color-error);\n outline-color: var(--md-sys-color-error);\n }\n\n .mention-chip {\n display: inline-flex;\n align-items: center;\n margin: 0 2px;\n vertical-align: baseline;\n user-select: none;\n }\n\n .mention-chip ui-chip {\n margin: 0;\n font-size: inherit;\n line-height: inherit;\n }\n\n .cm-gutters {\n background: var(--md-sys-color-surface-variant);\n color: var(--md-sys-color-on-surface-variant);\n border: none;\n }\n\n .cm-focused .cm-cursor {\n border-left-color: var(--md-sys-color-primary);\n }\n\n ::selection {\n background: var(--md-sys-color-surface-variant);\n }\n\n .ͼ1.cm-focused {\n outline: none;\n }\n\n .function-info {\n padding: 8px;\n }\n\n /* Responsive */\n @media (max-width: 600px) {\n :host {\n min-width: 0;\n }\n\n .label {\n padding: 6px 6px 3px 6px;\n }\n\n .editor-container {\n padding: 6px;\n }\n\n .supporting-text {\n padding: 3px 6px 6px 6px;\n }\n }\n`\n"]}
1
+ {"version":3,"file":"CodeEditor.styles.js","sourceRoot":"","sources":["../../../../../src/elements/code-editor/internals/CodeEditor.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8MjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n :host {\n display: flex;\n flex-direction: column;\n outline: none;\n min-width: 200px;\n background-color: transparent;\n color: var(--md-sys-color-on-surface);\n\n font-family: var(--md-sys-typescale-body-large-font);\n font-size: var(--md-sys-typescale-body-large-size);\n letter-spacing: var(--md-sys-typescale-body-large-tracking);\n line-height: var(--md-sys-typescale-body-large-height);\n }\n\n .surface {\n display: flex;\n flex-direction: column;\n }\n\n .content {\n display: flex;\n flex-direction: column;\n flex: 1;\n }\n\n .label {\n font-family: var(--md-sys-typescale-label-medium-font);\n font-weight: var(--md-sys-typescale-label-medium-weight);\n font-size: var(--md-sys-typescale-label-medium-size);\n letter-spacing: var(--md-sys-typescale-label-medium-tracking);\n line-height: var(--md-sys-typescale-label-medium-height);\n color: var(--md-sys-color-on-surface-variant);\n\n padding: 8px 16px 4px 16px;\n margin: 0;\n }\n\n .has-focus .label {\n color: var(--md-sys-color-primary);\n }\n\n .editor-container {\n position: relative;\n flex: 1;\n\n border-radius: var(--md-sys-shape-corner-extra-small);\n border: 1px solid var(--md-sys-color-outline);\n outline: 0px solid var(--md-sys-color-primary);\n outline-offset: -1px;\n transition:\n border-color 150ms cubic-bezier(0.4, 0, 0.2, 1),\n outline-width 150ms cubic-bezier(0.4, 0, 0.2, 1),\n outline-offset 150ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n .editor-container:focus-within {\n border-color: var(--md-sys-color-primary);\n outline-width: 2px;\n outline-offset: -2px;\n }\n\n .supporting-text {\n margin-top: 4px;\n padding: 0 16px;\n color: var(--md-sys-color-on-surface-variant);\n font-family: var(--md-sys-typescale-body-small-font);\n font-weight: var(--md-sys-typescale-body-small-weight);\n font-size: var(--md-sys-typescale-body-small-size);\n letter-spacing: var(--md-sys-typescale-body-small-tracking);\n line-height: var(--md-sys-typescale-body-small-height);\n }\n\n :host([disabled]) {\n pointer-events: none;\n }\n\n :host([disabled]) .editor-container {\n border-color: var(--md-sys-color-on-surface);\n }\n\n :host([disabled]) .label,\n :host([disabled]) .editor-container {\n color: var(--md-sys-color-on-surface);\n opacity: 0.38;\n }\n\n :host([invalid]) .label,\n :host([invalid]) .supporting-text {\n color: var(--md-sys-color-error);\n }\n\n :host([invalid]) .editor-container {\n border-color: var(--md-sys-color-error);\n outline-color: var(--md-sys-color-error);\n }\n\n .mention-chip {\n display: inline-flex;\n align-items: center;\n margin: 0 2px;\n vertical-align: baseline;\n user-select: none;\n }\n\n .mention-chip ui-chip {\n margin: 0;\n font-size: inherit;\n line-height: inherit;\n }\n\n .cm-gutters {\n background: var(--md-sys-color-surface-variant);\n color: var(--md-sys-color-on-surface-variant);\n border: none;\n }\n\n .cm-focused .cm-cursor {\n border-left-color: var(--md-sys-color-primary);\n }\n\n ::selection {\n background: var(--md-sys-color-surface-variant);\n }\n\n .ͼ1.cm-focused {\n outline: none;\n }\n\n .cm-tooltip-hover {\n box-shadow: var(--md-sys-elevation-3);\n }\n\n .editor-container .cm-editor .cm-tooltip,\n .cm-tooltip-lint,\n .function-info {\n background-color: var(--md-sys-color-surface-container-highest);\n color: var(--md-sys-color-on-surface);\n }\n\n .function-info {\n padding: 8px;\n\n font-family: var(--md-sys-typescale-body-medium-font);\n font-weight: var(--md-sys-typescale-body-medium-weight);\n font-size: var(--md-sys-typescale-body-medium-size);\n letter-spacing: var(--md-sys-typescale-body-medium-tracking);\n line-height: var(--md-sys-typescale-body-medium-height);\n\n h4 {\n margin: 4px 0;\n font-family: var(--md-sys-typescale-title-medium-font);\n font-weight: var(--md-sys-typescale-title-medium-weight);\n font-size: var(--md-sys-typescale-title-medium-size);\n letter-spacing: var(--md-sys-typescale-title-medium-tracking);\n line-height: var(--md-sys-typescale-title-medium-height);\n }\n\n p {\n margin: 0;\n }\n\n .description {\n font-family: var(--md-sys-typescale-body-large-font);\n font-weight: var(--md-sys-typescale-body-large-weight);\n font-size: var(--md-sys-typescale-body-large-size);\n letter-spacing: var(--md-sys-typescale-body-large-tracking);\n line-height: var(--md-sys-typescale-body-large-height);\n }\n\n ul {\n margin: 0;\n }\n\n .param-name,\n .param-type {\n font-family: var(--md-sys-typescale-label-large-font);\n font-weight: var(--md-sys-typescale-label-large-weight);\n font-size: var(--md-sys-typescale-label-large-size);\n letter-spacing: var(--md-sys-typescale-label-large-tracking);\n line-height: var(--md-sys-typescale-label-large-height);\n }\n\n .param-description {\n color: var(--md-sys-color-on-surface-variant);\n }\n }\n\n /* Responsive */\n @media (max-width: 600px) {\n :host {\n min-width: 0;\n }\n\n .label {\n padding: 6px 6px 3px 6px;\n }\n\n .editor-container {\n padding: 6px;\n }\n\n .supporting-text {\n padding: 3px 6px 6px 6px;\n }\n }\n`\n"]}
@@ -124,6 +124,13 @@ class CodeEditorDemo extends DemoPage {
124
124
  private handleInput(event: Event): void {
125
125
  const target = event.target as HTMLElement & { value: string }
126
126
  this.editorValue = target.value
127
+ console.log('Editor input:', new Error().stack)
128
+ }
129
+
130
+ private handleChange(event: Event): void {
131
+ const target = event.target as HTMLElement & { value: string }
132
+ this.output = `Editor content changed: ${target.value}`
133
+ console.log('Editor change:', target.value)
127
134
  }
128
135
 
129
136
  contentTemplate() {
@@ -143,6 +150,7 @@ class CodeEditorDemo extends DemoPage {
143
150
  @function-insert=${this.handleFunctionInsert}
144
151
  @suggestion-insert=${this.handleSuggestionInsert}
145
152
  @input=${this.handleInput}
153
+ @change=${this.handleChange}
146
154
  ></code-editor>
147
155
 
148
156
  ${this.output ? html`<p><strong>Output:</strong> ${this.output}</p>` : ''}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@api-client/ui",
3
- "version": "0.5.14",
3
+ "version": "0.5.15",
4
4
  "description": "Internal UI component library for the API Client ecosystem.",
5
5
  "license": "UNLICENSED",
6
6
  "main": "build/src/index.js",
@@ -129,8 +129,63 @@ export default css`
129
129
  outline: none;
130
130
  }
131
131
 
132
+ .cm-tooltip-hover {
133
+ box-shadow: var(--md-sys-elevation-3);
134
+ }
135
+
136
+ .editor-container .cm-editor .cm-tooltip,
137
+ .cm-tooltip-lint,
138
+ .function-info {
139
+ background-color: var(--md-sys-color-surface-container-highest);
140
+ color: var(--md-sys-color-on-surface);
141
+ }
142
+
132
143
  .function-info {
133
144
  padding: 8px;
145
+
146
+ font-family: var(--md-sys-typescale-body-medium-font);
147
+ font-weight: var(--md-sys-typescale-body-medium-weight);
148
+ font-size: var(--md-sys-typescale-body-medium-size);
149
+ letter-spacing: var(--md-sys-typescale-body-medium-tracking);
150
+ line-height: var(--md-sys-typescale-body-medium-height);
151
+
152
+ h4 {
153
+ margin: 4px 0;
154
+ font-family: var(--md-sys-typescale-title-medium-font);
155
+ font-weight: var(--md-sys-typescale-title-medium-weight);
156
+ font-size: var(--md-sys-typescale-title-medium-size);
157
+ letter-spacing: var(--md-sys-typescale-title-medium-tracking);
158
+ line-height: var(--md-sys-typescale-title-medium-height);
159
+ }
160
+
161
+ p {
162
+ margin: 0;
163
+ }
164
+
165
+ .description {
166
+ font-family: var(--md-sys-typescale-body-large-font);
167
+ font-weight: var(--md-sys-typescale-body-large-weight);
168
+ font-size: var(--md-sys-typescale-body-large-size);
169
+ letter-spacing: var(--md-sys-typescale-body-large-tracking);
170
+ line-height: var(--md-sys-typescale-body-large-height);
171
+ }
172
+
173
+ ul {
174
+ margin: 0;
175
+ }
176
+
177
+ .param-name,
178
+ .param-type {
179
+ font-family: var(--md-sys-typescale-label-large-font);
180
+ font-weight: var(--md-sys-typescale-label-large-weight);
181
+ font-size: var(--md-sys-typescale-label-large-size);
182
+ letter-spacing: var(--md-sys-typescale-label-large-tracking);
183
+ line-height: var(--md-sys-typescale-label-large-height);
184
+ }
185
+
186
+ .param-description {
187
+ color: var(--md-sys-color-on-surface-variant);
188
+ }
134
189
  }
135
190
 
136
191
  /* Responsive */
@@ -2,7 +2,7 @@ import { html, LitElement, PropertyValues, TemplateResult, nothing } from 'lit'
2
2
  import { property, query, state } from 'lit/decorators.js'
3
3
  import { classMap } from 'lit/directives/class-map.js'
4
4
  import { linter } from '@codemirror/lint'
5
- import { EditorState, Extension } from '@codemirror/state'
5
+ import { Compartment, EditorState, Extension } from '@codemirror/state'
6
6
  import {
7
7
  autocompletion,
8
8
  CompletionContext,
@@ -97,11 +97,27 @@ export default class CodeEditor extends LitElement {
97
97
  @property({ type: String })
98
98
  accessor placeholder = ''
99
99
 
100
+ /**
101
+ * This property is used internally to set value without triggering updates.
102
+ */
103
+ #value = ''
104
+
100
105
  /**
101
106
  * The editor content value
102
107
  */
108
+ get value(): string {
109
+ return this.#value
110
+ }
111
+
103
112
  @property({ type: String })
104
- accessor value = ''
113
+ set value(newValue: string) {
114
+ const oldValue = this.#value
115
+ if (newValue !== oldValue) {
116
+ this.#value = newValue
117
+ this._previousValue = newValue
118
+ this.requestUpdate('value', oldValue)
119
+ }
120
+ }
105
121
 
106
122
  /**
107
123
  * Available function schemas for autocomplete
@@ -137,6 +153,10 @@ export default class CodeEditor extends LitElement {
137
153
  private accessor isEditorFocus = false
138
154
 
139
155
  private editorView?: EditorView
156
+ /**
157
+ * A control value to track previous value of the editor.
158
+ * This is used to detect when change event should be dispatched.
159
+ */
140
160
  private _previousValue = ''
141
161
  /**
142
162
  * Matcher for suggestion placeholders in the editor.
@@ -161,6 +181,8 @@ export default class CodeEditor extends LitElement {
161
181
  return suggestions
162
182
  }
163
183
 
184
+ private readonlyState = new Compartment()
185
+
164
186
  override disconnectedCallback(): void {
165
187
  super.disconnectedCallback()
166
188
  this.editorView?.destroy()
@@ -185,7 +207,9 @@ export default class CodeEditor extends LitElement {
185
207
  }
186
208
 
187
209
  if (changedProperties.has('disabled')) {
188
- this.updateEditorState()
210
+ this.editorView?.dispatch({
211
+ effects: this.readonlyState.reconfigure(EditorState.readOnly.of(this.disabled)),
212
+ })
189
213
  }
190
214
  }
191
215
 
@@ -212,6 +236,7 @@ export default class CodeEditor extends LitElement {
212
236
  this.createPlaceholderPlugin(),
213
237
  hoverTooltip(this.createHoverTooltipSource),
214
238
  linter((view) => functionLinter(view, this.functionSchemas, (e) => this.dispatchEvent(e))),
239
+ this.readonlyState.of(EditorState.readOnly.of(this.disabled)),
215
240
  ]
216
241
 
217
242
  // Add language support
@@ -480,21 +505,6 @@ export default class CodeEditor extends LitElement {
480
505
  }
481
506
  }
482
507
 
483
- /**
484
- * Update editor state (e.g., disabled state)
485
- */
486
- private updateEditorState(): void {
487
- if (!this.editorView) return
488
-
489
- // For now, we'll handle disabled state differently
490
- // CodeMirror 6 doesn't use reconfigure for editable
491
- if (this.disabled) {
492
- this.editorView.contentDOM.setAttribute('contenteditable', 'false')
493
- } else {
494
- this.editorView.contentDOM.setAttribute('contenteditable', 'true')
495
- }
496
- }
497
-
498
508
  /**
499
509
  * Handle editor content change
500
510
  */
@@ -502,13 +512,10 @@ export default class CodeEditor extends LitElement {
502
512
  if (!this.editorView) return
503
513
 
504
514
  const newValue = this.editorView.state.doc.toString()
505
- if (newValue !== this._previousValue) {
506
- this._previousValue = newValue
507
- this.value = newValue
508
- this.hasContent = newValue.length > 0
515
+ this.#value = newValue
516
+ this.hasContent = newValue.length > 0
509
517
 
510
- this.dispatchEvent(new Event('input', { bubbles: true }))
511
- }
518
+ this.dispatchEvent(new Event('input', { bubbles: true }))
512
519
  }
513
520
 
514
521
  /**
@@ -517,8 +524,9 @@ export default class CodeEditor extends LitElement {
517
524
  private handleFocusChange(hasFocus: boolean): void {
518
525
  this.isEditorFocus = hasFocus
519
526
 
520
- if (!hasFocus && this.value !== this._previousValue) {
521
- this.dispatchEvent(new Event('change', { bubbles: true }))
527
+ if (!hasFocus && this.#value !== this._previousValue) {
528
+ this._previousValue = this.#value
529
+ this.dispatchEvent(new Event('change'))
522
530
  }
523
531
  }
524
532