matcha-components 20.235.0 → 20.237.0

package/fesm2022/matcha-components.mjs

@@ -14576,7 +14576,7 @@ function buildButtonList(options) {
     const groups = [['undo', 'redo']];
     const formats = [
         options.showFont && 'font',
-        options.showFormats && 'formatBlock',
+        options.showFormats && 'blockStyle',
     ].filter(Boolean);
     if (formats.length)
         groups.push(formats);
@@ -14599,7 +14599,7 @@ function buildButtonList(options) {
         options.showInOutDent && 'indent',
         options.showAlign && 'align',
         options.showList && 'list',
-        options.showLine && 'line',
+        options.showLine && 'hr',
     ].filter(Boolean);
     if (para.length)
         groups.push(para);
@@ -14612,7 +14612,7 @@ function buildButtonList(options) {
     if (insert.length)
         groups.push(insert);
     if (options.showMarkdown)
-        groups.push(['markdown']);
+        groups.push(['markdownView']);
     const view = [
         options.showFullScreen && 'fullScreen',
         options.showCodeView && 'codeView',
@@ -14746,7 +14746,7 @@ class MatchaTextEditorComponent {
         const v = value || '';
         this._isSettingValue = true;
         if (this._editor) {
-            this._editor.setContent(v);
+            this._editor.$.html.set(v);
         }
         else {
             this._pendingValue = v;
@@ -14762,7 +14762,15 @@ class MatchaTextEditorComponent {
     setDisabledState(isDisabled) {
         this._disabled = isDisabled;
         if (this._editor) {
-            isDisabled ? this._editor.disable() : this._editor.enable();
+            const wysiwyg = this._editor.$.frameContext.get('wysiwyg');
+            if (isDisabled) {
+                this._editor.$.toolbar.disable();
+                wysiwyg?.setAttribute('contenteditable', 'false');
+            }
+            else {
+                this._editor.$.toolbar.enable();
+                wysiwyg?.setAttribute('contenteditable', 'true');
+            }
         }
     }
     // Private
@@ -14808,7 +14816,7 @@ class MatchaTextEditorComponent {
     }
     _reloadEditor() {
         this._el.nativeElement.querySelectorAll('.sun-editor').forEach((el) => el.remove());
-        const content = this._editor?.getValue() ?? '';
+        const content = this._editor?.$.html.get() ?? '';
         this._editor = null;
         this._pendingValue = content;
         this.isLoading = true;
@@ -14836,29 +14844,33 @@ class MatchaTextEditorComponent {
             imageWidth: mergedConfig.imageSize,
             videoWidth: mergedConfig.videoX,
             videoHeight: mergedConfig.videoY,
+            events: {
+                onChange: ({ data }) => {
+                    if (this._isSettingValue)
+                        return;
+                    this._ngZone.run(() => {
+                        this._onChange(data);
+                        this.contentChange.emit(data);
+                    });
+                },
+                onBlur: () => {
+                    this._ngZone.run(() => this._onTouched());
+                },
+            },
         });
         if (this._disabled) {
-            this._editor.disable();
+            const wysiwyg = this._editor.$.frameContext.get('wysiwyg');
+            this._editor.$.toolbar.disable();
+            wysiwyg?.setAttribute('contenteditable', 'false');
         }
         // Hide immediately so the skeleton doesn't overlap the editor during initialization
         const sunEditorEl = this._el.nativeElement.querySelector('.sun-editor');
         if (sunEditorEl)
             sunEditorEl.style.display = 'none';
-        this._editor.on('onChange', (content) => {
-            if (this._isSettingValue)
-                return;
-            this._ngZone.run(() => {
-                this._onChange(content);
-                this.contentChange.emit(content);
-            });
-        });
-        this._editor.on('onBlur', () => {
-            this._ngZone.run(() => this._onTouched());
-        });
         setTimeout(() => {
             if (this._pendingValue) {
                 this._isSettingValue = true;
-                this._editor.setContent(this._pendingValue);
+                this._editor.$.html.set(this._pendingValue);
                 this._pendingValue = '';
                 setTimeout(() => { this._isSettingValue = false; }, 0);
             }