@globalpayments/vega 2.45.0 → 2.47.0

package/dist/esm/image-annotation-action-de567e61.js

@@ -0,0 +1,272 @@
+import { h } from './index-187f71d1.js';
+import { c as MapToComponentField, V as VegaSlimmer } from './global-slimmer-registry-17c4efd4.js';
+import { D as DomNodeSubjectObserverFactory } from './dom-node-subject-observer-factory-715dccf9.js';
+import { a as VegaClick, M as VegaPopoverShow, N as VegaPopoverHide, f as VegaChange } from './dom-node-subject-factory-f77cf9cc.js';
+import { V as VegaInternalIconManager } from './internal-icon-manager-58cf8aa6.js';
+import { T as TextSplittableAction, j as TextColorAnnotation, k as RTE_TEXT_COLORS, f as RTETextNode, h as NodeAnnotationTypeEnum, A as AnnotationAction, i as ImageAnnotation } from './content-state-8d0d38d7.js';
+import { a as VegaDarkModeStyleController } from './dark-mode-style-controller-e5915f26.js';
+
+var __decorate$1 = (undefined && undefined.__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;
+};
+class ToolbarButtonSlimmer extends VegaSlimmer {
+  constructor({ icon, tooltip }) {
+    super();
+    this.renderBtn = ({ showArrowIcon, iconColor } = {}) => {
+      var _a;
+      return (h("vega-tooltip", { text: this.translationSlimmer.t(this.tooltip.text), placement: ['bottom', 'top'] },
+        h("vega-rich-text-editor-toolbar-button", Object.assign({ showArrowIcon: showArrowIcon, icon: this.icon, iconColor: iconColor, ref: (ref) => {
+            DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaClick, () => {
+              this.handleClick();
+            });
+          }, selected: this.isSelected(), disabled: this.isDisabled() }, this.preventLostFocus()), (_a = this.renderSlotContent) === null || _a === void 0 ? void 0 : _a.call(this))));
+    };
+    /**
+     * Handle the click event on the toolbar button.
+     * If there are no selected nodes, the focus will be set on the content and the click will be triggered after the selection change.
+     */
+    this.handleClick = () => {
+      if (typeof this.onClick === 'function') {
+        const selectedNodes = this.selectionController.getSelectedNodes();
+        if (!selectedNodes.length) {
+          void this.focusController.focusOnLastTextNode().then(() => {
+            this.onClick();
+          });
+        }
+        else {
+          this.onClick();
+        }
+      }
+    };
+    this.icon = icon;
+    this.tooltip = tooltip;
+  }
+  setIcon(icon) {
+    this.icon = icon;
+  }
+  render() {
+    return typeof this.renderBtnWrapper === 'function'
+      ? this.renderBtnWrapper(this.renderBtn)
+      : this.renderBtn();
+  }
+  /**
+   * Whether the button is disabled or not.
+   */
+  isDisabled() {
+    return this.disabled;
+  }
+  preventLostFocus() {
+    return {
+      onMouseDown: (e) => e.preventDefault(),
+    };
+  }
+}
+__decorate$1([
+  MapToComponentField()
+], ToolbarButtonSlimmer.prototype, "translationSlimmer", void 0);
+__decorate$1([
+  MapToComponentField()
+], ToolbarButtonSlimmer.prototype, "selectionController", void 0);
+__decorate$1([
+  MapToComponentField()
+], ToolbarButtonSlimmer.prototype, "focusController", void 0);
+__decorate$1([
+  MapToComponentField()
+], ToolbarButtonSlimmer.prototype, "disabled", void 0);
+
+const text = {
+  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path fill="currentColor" d="M64 96v32c0 17.7-14.3 32-32 32s-32-14.3-32-32V80C0 53.5 21.5 32 48 32H224 400c26.5 0 48 21.5 48 48v48c0 17.7-14.3 32-32 32s-32-14.3-32-32V96H256l0 320h48c17.7 0 32 14.3 32 32s-14.3 32-32 32H144c-17.7 0-32-14.3-32-32s14.3-32 32-32h48l0-320H64z"/></svg>`,
+};
+
+/**
+ * Action to toggle the text color annotation visibility/state.
+ */
+class TextColorAnnotationAction extends TextSplittableAction {
+  constructor(textColor) {
+    super();
+    this.isFlushable = true;
+    this.textColor = textColor;
+  }
+  /**
+   * Converts the action into a text color annotation.
+   *
+   * @returns {Annotation} the annotation
+   */
+  toAnnotation() {
+    return new TextColorAnnotation(this.textColor);
+  }
+}
+
+var __decorate = (undefined && undefined.__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;
+};
+class TextColorToolbarButtonSlimmer extends ToolbarButtonSlimmer {
+  constructor() {
+    super({
+      icon: 'text',
+      tooltip: { text: 'Text Color' },
+    });
+    this.popoverShow = false;
+    VegaDarkModeStyleController.registerCustomDarkModeColor(TextColorToolbarButtonSlimmer.formatDarkModeColor());
+  }
+  static formatDarkModeColor() {
+    return RTE_TEXT_COLORS.reduce((prev, current) => {
+      current.dark && (prev[`rich-text-editor-${current.key}`] = current.dark);
+      return prev;
+    }, {});
+  }
+  renderSlotContent() {
+    return (h("div", { class: {
+        'toolbar-btn-color-preview-box': true,
+        'disabled': this.isDisabled(),
+      }, style: {
+        backgroundColor: this.getCurrentColor(),
+      } }));
+  }
+  handlePopoverShowChange() {
+    this.popoverShow = true;
+  }
+  handlePopoverHideChange() {
+    this.popoverShow = false;
+  }
+  renderBtnWrapper(renderBtn) {
+    return (h("vega-popover", { placement: "bottom", alignment: "center", ref: (ref) => {
+        this.popoverRef = ref;
+        DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaPopoverShow, this.handlePopoverShowChange.bind(this));
+        DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaPopoverHide, this.handlePopoverHideChange.bind(this));
+      } },
+      h("div", { slot: "popover-content" }, renderBtn({
+        showArrowIcon: false,
+      })),
+      h("div", Object.assign({ slot: "popover", style: { userSelect: 'none' } }, super.preventLostFocus()), this.renderPopoverContent())));
+  }
+  renderPopoverContent() {
+    return (h("vega-color-picker", { isInline: true, colors: RTE_TEXT_COLORS.map((item) => item[!this.isInDarkMode ? 'light' : 'dark']), ref: (ref) => {
+        DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaChange, this.handleChange.bind(this));
+      }, value: this.getCurrentColor() }));
+  }
+  async handleChange(e) {
+    if (this.popoverShow) {
+      if (!this.selectionController.getSelectedNodes().length) {
+        await this.focusController.focusOnLastTextNode();
+      }
+      this.selectionController
+        .getSelectedNodes()
+        .filter((node) => node instanceof RTETextNode)
+        .forEach((node) => node.apply(new TextColorAnnotationAction(this.matchColor(e.detail).key)));
+    }
+    void this.popoverRef.hide();
+  }
+  matchColor(value) {
+    return RTE_TEXT_COLORS.find((item) => item[this.isInDarkMode ? 'dark' : 'light'] === value);
+  }
+  getCurrentColor() {
+    let selectedItem = RTE_TEXT_COLORS[0];
+    const selectedNodes = this.selectionController.getSelectedNodes();
+    if (selectedNodes.length > 1) {
+      if (this.isSelectedSameColor(selectedNodes)) {
+        selectedItem = this.getTextColor(selectedNodes[0]);
+      }
+      else {
+        selectedItem = null;
+      }
+    }
+    if (selectedNodes.length === 1) {
+      selectedItem = this.getTextColor(selectedNodes[0]);
+    }
+    return selectedItem ? selectedItem[!this.isInDarkMode ? 'light' : 'dark'] : null;
+  }
+  isSelected() {
+    return false;
+  }
+  isSelectedSameColor(selectedNodes) {
+    return selectedNodes.every((node) => this.getTextColor(node).key === this.getTextColor(selectedNodes[0]).key);
+  }
+  getTextColor(selectedNodes) {
+    var _a;
+    return (((_a = selectedNodes.getAnnotationByType('TEXT_COLOR')) === null || _a === void 0 ? void 0 : _a.textColor) ||
+      RTE_TEXT_COLORS[0]);
+  }
+  isDisabled() {
+    const selectedNodes = this.selectionController.getSelectedNodes();
+    return (super.isDisabled() ||
+      selectedNodes.some((node) => {
+        var _a;
+        return ((_a = node.getAnnotationByType(NodeAnnotationTypeEnum.CODE)) === null || _a === void 0 ? void 0 : _a.code) ||
+          node.getAnnotationByType(NodeAnnotationTypeEnum.LINK) ||
+          node.getAnnotationByType(NodeAnnotationTypeEnum.IMAGE);
+      }));
+  }
+}
+(() => {
+  VegaInternalIconManager.register({
+    text,
+  });
+})();
+__decorate([
+  MapToComponentField()
+], TextColorToolbarButtonSlimmer.prototype, "host", void 0);
+__decorate([
+  MapToComponentField()
+], TextColorToolbarButtonSlimmer.prototype, "isInDarkMode", void 0);
+__decorate([
+  MapToComponentField()
+], TextColorToolbarButtonSlimmer.prototype, "selectionController", void 0);
+__decorate([
+  MapToComponentField()
+], TextColorToolbarButtonSlimmer.prototype, "focusController", void 0);
+
+/**
+ * This class is responsible for keeping track of the DOM elements.
+ */
+class TextNodeRenderingRegistry {
+  constructor() {
+    this.textNodeElements = new Map();
+  }
+  /**
+   * Registers a DOM element and the color annotation of the DOM element.
+   *
+   * @param {HTMLElement} dom The DOM element to register.
+   * @param {TextColorAnnotation} textColorAnnotation The text color annotation of text node to register.
+   */
+  register(dom, textColorAnnotation) {
+    this.textNodeElements.set(dom, textColorAnnotation);
+  }
+  /**
+   * Retrieves the text node elements.
+   *
+   * @returns {Map<HTMLElement, TextColorAnnotation>} The text node elements, or empty array.
+   */
+  getTextNodeElements() {
+    return this.textNodeElements;
+  }
+}
+const TextNodeRenderingRegistry$1 = new TextNodeRenderingRegistry();
+
+/**
+ * Action to add an image annotation to the editor
+ */
+class ImageAnnotationAction extends AnnotationAction {
+  constructor(size, alt) {
+    super();
+    this.isFlushable = true;
+    this.size = size;
+    this.alt = alt;
+  }
+  /**
+   * Converts the action to an annotation
+   *
+   * @returns {ImageAnnotation} The annotation
+   */
+  toAnnotation() {
+    return new ImageAnnotation(this.size, this.alt);
+  }
+}
+
+export { ImageAnnotationAction as I, TextNodeRenderingRegistry$1 as T, TextColorToolbarButtonSlimmer as a, ToolbarButtonSlimmer as b };

package/dist/esm/index-187f71d1.js

@@ -1508,6 +1508,10 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
           return import(
             /* webpackMode: "lazy" */
             './vega-icon.entry.js').then(processMod, consoleError);
+        case 'vega-flag-icon':
+          return import(
+            /* webpackMode: "lazy" */
+            './vega-flag-icon.entry.js').then(processMod, consoleError);
         case 'vega-image-uploader':
           return import(
             /* webpackMode: "lazy" */
@@ -1612,6 +1616,10 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
           return import(
             /* webpackMode: "lazy" */
             './vega-rich-text-content.entry.js').then(processMod, consoleError);
+        case 'vega-brand-logo':
+          return import(
+            /* webpackMode: "lazy" */
+            './vega-brand-logo.entry.js').then(processMod, consoleError);
         case 'vega-checkbox_2':
           return import(
             /* webpackMode: "lazy" */

package/dist/esm/index-96374234.js

@@ -0,0 +1,40 @@
+import { W as WaitForVega } from './wait-for-vega-handler-b18eb955.js';
+import { O as Observer } from './observer-3959f9dd.js';
+import { C as ChangeManager } from './change-manager-6a7eb88c.js';
+import { d as domNodeSubjectFactory } from './dom-node-subject-factory-f77cf9cc.js';
+import { V as VegaInternalComponentDidRender } from './vega-internal-event-id-7d1ff289.js';
+
+/* istanbul ignore next */
+/**
+ * Wait for all vega elements to be ready.
+ *
+ * The below method is e2e-test covered in @see{module:wait-for-vega-should-work-as-expected}
+ */
+const waitForVega = async () => {
+  return WaitForVega.handle();
+};
+/**
+ * Wait for the component has been rendered.
+ *
+ * @param {HTMLStencilElement} componentRef - The reference to the component that needs to be rendered.
+ * @returns {Promise<unknown>} A promise that resolves when the component has been rendered.
+ */
+const waitForComponentDidRender = async (componentRef) => {
+  return new Promise((resolve) => {
+    const observer = new Observer(isAcceptableComponentDidRender.bind(null), () => {
+      ChangeManager.unregister(domNodeSubjectFactory.getSubject(componentRef, VegaInternalComponentDidRender), observer);
+      resolve(null);
+    });
+    ChangeManager.register(domNodeSubjectFactory.getSubject(componentRef, VegaInternalComponentDidRender), observer);
+  });
+};
+/**
+ * Determines whether the observer should accept changes.
+ *
+ * @returns {boolean} Always returns true in the current implementation.
+ */
+const isAcceptableComponentDidRender = () => {
+  return true;
+};
+
+export { waitForComponentDidRender as a, waitForVega as w };

package/dist/esm/index.js

@@ -1,6 +1,6 @@
 export { g as getCurrentBreakpoint } from './page-resize-observer-slimmer-15a84d26.js';
 export { L as LogUtility, s as setVegaLogLevel } from './global-slimmer-registry-17c4efd4.js';
-export { d as formatAndValidBackgroundColor, e as formatAndValidBorderColor, g as formatAndValidBorderRadius, c as formatAndValidBreakpointSize, a as formatAndValidGap, h as formatAndValidPadding, f as formatAndValidResponsiveToken, b as formatAndValidShadow, i as formatAndValidTextColor } from './design-token-e349fd57.js';
+export { d as formatAndValidBackgroundColor, e as formatAndValidBorderColor, g as formatAndValidBorderRadius, c as formatAndValidBreakpointSize, a as formatAndValidGap, h as formatAndValidPadding, f as formatAndValidResponsiveToken, b as formatAndValidShadow, i as formatAndValidTextColor } from './design-token-7406782c.js';
 export { c as camelToDashCase } from './string-be824360.js';
 export { d as BackgroundColorMap, a as BackgroundColors, e as BorderColorMap, b as BorderColors, B as BorderRadius, C as Colors, F as FillBackgroundColors, g as ShadowMap, f as Shadows, h as Spacing, S as StrokeBackgroundColors, c as TextColorMap, T as TextColors } from './type-guard-158f6d7a.js';
 export { B as Breakpoints } from './breakpoints-d9faf11c.js';
@@ -8,21 +8,21 @@ export { I as Icons, g as getIconFromToken } from './icons-8627925e.js';
 export { b as Typography, a as TypographyKeys, T as TypographyUrls } from './typography-396de03f.js';
 export { e as BoxDisplay, B as BreakpointKeys, C as CssStates, F as FlexDirections } from './ui-8424715a.js';
 export { F as FrameworkEnum, v as VegaEnvManager } from './vega-env-manager-8f8dc473.js';
-export { b as VegaDialog, c as VegaEventManager, V as VegaLoader, a as VegaNotify, e as VegaSkeletonLoader, d as VegaZIndexManager } from './vega-skeleton-loader-controller-722a41c2.js';
+export { c as VegaDialog, d as VegaEventManager, V as VegaLoader, a as VegaNotify, f as VegaSkeletonLoader, b as VegaThemeManager, e as VegaZIndexManager } from './vega-skeleton-loader-controller-90e8d34d.js';
 export { F as FeatureFlag } from './feature-flag-controller-690eac1d.js';
-export { M as ModifyContentAction, e as RTEBlock, b as RTEImageBlock, f as RTEImageNode, d as RTEListBlock, c as RTEListItemBlock, h as RTENode, R as RTETextBlock, g as RTETextNode, a as VegaRTEContent, V as VegaThemeManager } from './content-state-7e9f3421.js';
-export { B as VegaJQueryDelegatedEventStrategy } from './internal-vega-event-manager-d2c962d2.js';
+export { B as VegaJQueryDelegatedEventStrategy } from './internal-vega-event-manager-87dc436c.js';
 export { V as VegaIconManager } from './icon-manager-638dd4d4.js';
 export { V as ValidCreditCardNumberRule } from './valid-credit-card-number-rule-cc497bec.js';
-export { w as waitForVega } from './index-707fec53.js';
-export { a as VegaTranslation, s as VegaTranslationResourceEN } from './translation-4bed3392.js';
-export { G as GridColumns, a as GridRows } from './responsive-format-facade-ce8a1ef5.js';
+export { w as waitForVega } from './index-96374234.js';
+export { a as VegaTranslation, s as VegaTranslationResourceEN } from './translation-78207e81.js';
+export { M as ModifyContentAction, d as RTEBlock, a as RTEImageBlock, e as RTEImageNode, c as RTEListBlock, b as RTEListItemBlock, g as RTENode, R as RTETextBlock, f as RTETextNode, V as VegaRTEContent } from './content-state-8d0d38d7.js';
+export { G as GridColumns, a as GridRows } from './responsive-format-facade-299d8ee9.js';
 export { C as CheckBoxRequiredRule } from './check-box-required-rule-cb0aa339.js';
 export { D as DateRequiredRule } from './date-required-rule-8944f3bf.js';
 export { I as InputPhoneNumberRequiredRule } from './input-phone-number-required-rule-be6a5572.js';
 export { I as InputRangeRequiredRule } from './input-range-required-rule-3ad74776.js';
 export { R as RequiredFieldRule } from './required-field-rule-ab4bdc47.js';
-export { R as RichTextEditorRequiredRule } from './rich-text-editor-required-rule-ef25c4da.js';
+export { R as RichTextEditorRequiredRule } from './rich-text-editor-required-rule-7fd7dcb3.js';
 export { T as TimeRangeRequiredRule, a as TimeRequiredRule } from './time-required-rule-a01163b5.js';
 export { T as ToggleSwitchRequiredRule } from './toggle-switch-required-rule-b3cf4302.js';
 export { F as FileUploaderRequiredRule } from './file-uploader-required-rule-ad886d01.js';
@@ -31,15 +31,17 @@ import './regex-dfe11abf.js';
 import './create-public-api-runtime-metrics-slimmer-8ada793f.js';
 import './dynamic-slimmer-90b8af32.js';
 import './ui-ed1283bb.js';
+import './dark-mode-style-controller-e5915f26.js';
+import './static-subject-title-4a9deb68.js';
+import './change-manager-6a7eb88c.js';
+import './observer-3959f9dd.js';
+import './_commonjsHelpers-9943807e.js';
 import './number-4398f2e1.js';
 import './index-44c794b4.js';
-import './_commonjsHelpers-9943807e.js';
-import './change-manager-6a7eb88c.js';
-import './dom-node-subject-factory-286df025.js';
-import './vega-internal-event-id-d7113cf7.js';
-import './static-subject-title-249c76cd.js';
+import './dom-node-subject-factory-f77cf9cc.js';
 import './internal-form-field-validation-rule.abstract-f5b6bdbf.js';
 import './wait-for-vega-handler-b18eb955.js';
+import './vega-internal-event-id-7d1ff289.js';
 import './pixel-f32c07ce.js';
 import './array-3113609f.js';
 import './date-c55b97f0.js';

package/dist/esm/internal-icon-manager-58cf8aa6.js

@@ -0,0 +1,53 @@
+import { V as VegaIconManager } from './icon-manager-638dd4d4.js';
+
+/**
+ * Internal icon manager
+ */
+class InternalIconManager {
+  /**
+   * Get the internal icon key by name
+   *
+   * @param {string} name - The name of the icon
+   * @returns {string} returns the internal icon key
+   */
+  getIconKey(name) {
+    return this.generateIconKeyWithNamespace(name, InternalIconManager.INTERNAL_ICON_NAMESPACE);
+  }
+  /**
+   *  Check if the internal icon manager has an icon by name
+   *
+   * @param {string} name - The name of the icon
+   * @returns {boolean} returns true if the icon exists
+   * @vegaVersion 2.46.0
+   */
+  hasIcon(name) {
+    return VegaIconManager.hasIcon(this.getIconKey(name));
+  }
+  /**
+   * Register internal icons
+   *
+   * @param {Record<string, IconPayload>} icons - The icons to register
+   */
+  register(icons) {
+    const iconsWithNamespace = Object.entries(icons).reduce((icons, [name, value]) => {
+      const newKey = this.generateIconKeyWithNamespace(name, InternalIconManager.INTERNAL_ICON_NAMESPACE);
+      icons[newKey] = value;
+      return icons;
+    }, {});
+    VegaIconManager.register(iconsWithNamespace);
+  }
+  /**
+   * Generate the icon key with the namespace
+   *
+   * @param {string} name - The name of the icon
+   * @param {string} namespace - The namespace of the icon
+   * @returns {string} returns the key with the namespace
+   */
+  generateIconKeyWithNamespace(name, namespace) {
+    return [namespace, name].join(' ');
+  }
+}
+InternalIconManager.INTERNAL_ICON_NAMESPACE = 'v-internal-icon';
+const VegaInternalIconManager = new InternalIconManager();
+
+export { VegaInternalIconManager as V };