@globalpayments/vega 2.77.1 → 2.78.0

package/dist/collection/components/vega-rich-text-editor/slimmers/renderers/vega-rich-text-editor-source-view-renderer.js

@@ -0,0 +1,102 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { MapToComponentField, MapToComponentMethod, VegaSlimmer } from 'vega-slimmer/core';
+import { h } from '@stencil/core';
+import CodeFormatter from '../../../../helpers/code-format/code-formatter';
+import { DomNodeSubjectObserverFactory } from '../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-observer-factory';
+import { VegaInternalCodeBlockBlur } from '../../../../helpers/event-manager/event-id/vega-internal-event-id';
+import { VegaRTEContent } from '../../dto/content-state';
+/**
+ * The renderer for the source view of the rich text editor. It renders a code block for editing the source code of the rich text editor content.
+ */
+export class VegaRichTextEditorSourceViewRenderer extends VegaSlimmer {
+  constructor() {
+    super(...arguments);
+    this.prevRecord = '';
+    /**
+     * Handle the blur event of the code block. When the code block loses focus, emit the source code change event with the current source code.
+     */
+    this.handleCodeBlockBlur = () => {
+      var _a;
+      // If source view is closed while blurring, it means the user switch back to normal mode, so we can skip emitting the change event.
+      if (this.sourceView) {
+        const sourceCode = this.getSourceCode();
+        const newValue = VegaRTEContent.fromHtml(sourceCode, {
+          autoMatchFormat: (_a = this.sourceEditConfig.autoMatchFormat) !== null && _a !== void 0 ? _a : true,
+        });
+        const newSourceCode = newValue.toHtml();
+        if (newSourceCode !== this.prevRecord) {
+          this.sourceCodeChangeEventEmitter.emit(newSourceCode);
+          this.prevRecord = newSourceCode;
+        }
+      }
+    };
+  }
+  /**
+   * Clean up the code block blur observer when the component is disconnected to prevent memory leaks.
+   */
+  clearCodeBlockBlurObserver() {
+    if (this.sourceCodeBlockRef) {
+      DomNodeSubjectObserverFactory.removeUniqueObserverFromNode(this.sourceCodeBlockRef, VegaInternalCodeBlockBlur);
+    }
+  }
+  /**
+   * Get the source code from the source view's code block.
+   *
+   * @returns {Nullable<string>} The source code, or null if the code block reference is not set.
+   */
+  getSourceCode() {
+    if (this.sourceCodeBlockRef) {
+      return this.sourceCodeBlockRef.value.code;
+    }
+  }
+  /**
+   * Render the source view, which is a code block for editing the source code of the rich text editor content.
+   *
+   * @returns {Nullable<HTMLElement>} The rendered source view element, or null if source editing is not allowed.
+   */
+  render() {
+    if (!this.allowSourceEdit)
+      return;
+    const sourceCode = this.value.toHtml();
+    const sourceViewValue = this.sourceView ? CodeFormatter.format(sourceCode) : '';
+    // Record the source view value when rendering, which will be used to compare with the current source view value when blurring the code block to determine whether to emit the source code change event.
+    this.prevRecord = sourceCode;
+    return (h("div", { class: {
+        'source-view-container': true,
+        'vega-hidden': !this.sourceView,
+      } },
+      h("vega-code-block", { ref: (ref) => {
+          this.sourceCodeBlockRef = ref;
+          DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaInternalCodeBlockBlur, this.handleCodeBlockBlur);
+        }, disabled: this.disabled, value: { language: 'html', code: sourceViewValue } })));
+  }
+}
+__decorate([
+  MapToComponentField()
+], VegaRichTextEditorSourceViewRenderer.prototype, "host", void 0);
+__decorate([
+  MapToComponentField()
+], VegaRichTextEditorSourceViewRenderer.prototype, "allowSourceEdit", void 0);
+__decorate([
+  MapToComponentField()
+], VegaRichTextEditorSourceViewRenderer.prototype, "sourceView", void 0);
+__decorate([
+  MapToComponentField()
+], VegaRichTextEditorSourceViewRenderer.prototype, "value", void 0);
+__decorate([
+  MapToComponentField()
+], VegaRichTextEditorSourceViewRenderer.prototype, "disabled", void 0);
+__decorate([
+  MapToComponentField()
+], VegaRichTextEditorSourceViewRenderer.prototype, "sourceEditConfig", void 0);
+__decorate([
+  MapToComponentField()
+], VegaRichTextEditorSourceViewRenderer.prototype, "sourceCodeChangeEventEmitter", void 0);
+__decorate([
+  MapToComponentMethod('disconnectedCallback')
+], VegaRichTextEditorSourceViewRenderer.prototype, "clearCodeBlockBlurObserver", null);

package/dist/collection/components/vega-rich-text-editor/vega-rich-text-editor.js

@@ -23,7 +23,7 @@ import { LessIndentToolbarButtonSlimmer } from './slimmers/renderers/tools/less-
 import { ImageToolbarButtonSlimmer } from './slimmers/renderers/tools/image-toolbar-button-slimmer';
 import { FormFieldControllerSlimmer } from '../../helpers/slimmers/form-field-controller-slimmer';
 import { createEventEmitSlimmer, } from '../../helpers/event-manager/slimmers/event-emit-slimmer';
-import { VegaChange, VegaImageInserted } from '../../helpers/event-manager/event-id/vega-event-id';
+import { VegaChange, VegaImageInserted, VegaSourceCodeChange, } from '../../helpers/event-manager/event-id/vega-event-id';
 import { TextColorToolbarButtonSlimmer } from './slimmers/renderers/tools/text-color-toolbar-button-slimmer';
 import { createSubStateNotifySlimmer } from '../../helpers/slimmers/sub-state/sub-state-notify-slimmer';
 import { BulletsNumbersToolbarButtonSlimmer } from './slimmers/renderers/tools/bullets-numbers/bullets-numbers-toolbar-button-slimmer';
@@ -49,6 +49,7 @@ import { InternalCodeBlockSelectionController } from './slimmers/controllers/int
 import { SourceEditToolbarButtonSlimmer } from './slimmers/renderers/tools/source-edit-toolbar-button-slimmer';
 import { RTEExtensionController } from './slimmers/controllers/extension-controller';
 import { VegaRTEPresetToolbarItems } from './constants/constant';
+import { VegaRichTextEditorSourceViewRenderer } from './slimmers/renderers/vega-rich-text-editor-source-view-renderer';
 /**
  * @vegaVersion 2.34.0
  */
@@ -106,6 +107,8 @@ export class VegaRichTextEditor {
     this.historyController = new HistoryController();
     this.internalCodeBlockSelectionController = new InternalCodeBlockSelectionController();
     this.rteExtensionController = new RTEExtensionController();
+    this.sourceCodeChangeEventEmitter = createEventEmitSlimmer(VegaRichTextEditor, VegaSourceCodeChange);
+    this.richTextEditorSourceViewRenderer = new VegaRichTextEditorSourceViewRenderer();
     this.richTextContentEditable = true;
     this.selectionMap = new Map();
     this.isInDarkMode = VegaInternalThemeManager.isDarkMode();
@@ -660,6 +663,45 @@ export class VegaRichTextEditor {
           }
         }
       }
+    }, {
+      "method": "vegaSourceCodeChange",
+      "name": "vegaSourceCodeChange",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [{
+            "name": "vegaVersion",
+            "text": "2.78.0"
+          }],
+        "text": "An event emitter notifying a source code change event. It triggers when the editor loses focus in source edit mode."
+      },
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      }
+    }, {
+      "method": "sourceCodeChange",
+      "name": "sourceCodeChange",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [{
+            "name": "eventSemantics",
+            "text": "namespace:native"
+          }, {
+            "name": "vegaVersion",
+            "text": "2.78.0"
+          }],
+        "text": "An event emitter notifying a source code change event. It triggers when the editor loses focus in source edit mode."
+      },
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      }
     }]; }
   static get elementRef() { return "host"; }
   static get watchers() { return [{
@@ -802,3 +844,9 @@ __decorate([
 __decorate([
   InjectVegaSlimmer()
 ], VegaRichTextEditor.prototype, "rteExtensionController", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaRichTextEditor.prototype, "sourceCodeChangeEventEmitter", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaRichTextEditor.prototype, "richTextEditorSourceViewRenderer", void 0);

package/dist/collection/components/vega-stepper/vega-stepper.js

@@ -188,7 +188,7 @@ export class VegaStepper {
             DomNodeSubjectObserverFactory.addUniqueObserverToNode(el, VegaBlur, (input) => this.handleInputBlur(input));
             DomNodeSubjectObserverFactory.addUniqueObserverToNode(el, VegaChange, (input) => this.onChildInputChange(input));
             return (this.inputRef = el);
-          } }),
+          }, "data-aria-label": this.label || 'stepper' }),
         h("vega-button-circle", { label: "Increase", showTooltip: false, ref: (ref) => {
             DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaClick, () => this.onIncrease());
           }, icon: "plus-sign", disabled: this.value >= this.max || this.disabled, size: "small", variant: this.buttonVariant == 'secondary' ? 'secondary' : 'primary' }))), this.host);