@heartlandone/vega 1.50.1 → 2.0.0-preview-1

package/dist/cjs/_commonjsHelpers-537d719a.js

@@ -0,0 +1,20 @@
+'use strict';
+
+var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+
+function createCommonjsModule(fn, basedir, module) {
+	return module = {
+		path: basedir,
+		exports: {},
+		require: function (path, base) {
+			return commonjsRequire();
+		}
+	}, fn(module, module.exports), module.exports;
+}
+
+function commonjsRequire () {
+	throw new Error('Dynamic requires are not currently supported by @rollup/plugin-commonjs');
+}
+
+exports.commonjsGlobal = commonjsGlobal;
+exports.createCommonjsModule = createCommonjsModule;

package/dist/cjs/{app-globals-2dcb0981.js → app-globals-96b1451c.js}

@@ -1,14 +1,16 @@
 'use strict';
 
-const featureFlagController = require('./featureFlagController-9161143b.js');
-const themeManager = require('./themeManager-36e68114.js');
-const vegaEnvManager = require('./vegaEnvManager-295ccbd7.js');
+const featureFlagController = require('./featureFlagController-daf977be.js');
+const vegaEventManager = require('./vegaEventManager-a06ff179.js');
+const vegaEnvManager = require('./vegaEnvManager-812c97fa.js');
 const log = require('./log-5d8066e0.js');
 const vegaDialogController = require('./vegaDialogController-d2ae40fb.js');
 const globalSlimmerRegistry = require('./global-slimmer-registry-58eee093.js');
 const mapToComponentMethod = require('./map-to-component-method-bdf875d3.js');
 const vegaSlimmer = require('./vega-slimmer-f026897e.js');
-require('./ui-97068bc7.js');
+require('./internalVegaEventManager-11e57997.js');
+require('./ui-25a66a2a.js');
+const typography = require('./typography-3d2ba97d.js');
 
 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;
@@ -119,6 +121,8 @@ function appGlobalScript () {
   injectVegaLogLevelIntoGlobal();
   injectVegaDialogIntoGlobal();
   registerGlobalVegaSlimmers();
+  injectSetEventSemanticsIntoGlobal();
+  injectVegaTypography();
 }
 /**
  * Disable feature flags from the client global defined lists.
@@ -140,7 +144,7 @@ function enableFeatureFlagFromClientGlobal() {
  * Inject VegaLoader to global as a public api
  */
 function injectVegaLoaderIntoGlobal() {
-  globalThis['VegaLoader'] = themeManager.VegaLoader;
+  globalThis['VegaLoader'] = vegaEventManager.VegaLoader;
 }
 /**
  * Inject VegaNotify to global as a public api
@@ -152,7 +156,7 @@ function injectVegaNotifyIntoGlobal() {
  * Inject VegaThemeManager to global as a public api
  */
 function injectVegaThemeManagerIntoGlobal() {
-  globalThis.VegaThemeManager = themeManager.VegaThemeManager;
+  globalThis.VegaThemeManager = vegaEventManager.VegaThemeManager;
 }
 /**
  * Inject VegaLogLevel to global as a public api
@@ -172,6 +176,28 @@ function injectVegaDialogIntoGlobal() {
 function registerGlobalVegaSlimmers() {
   globalSlimmerRegistry.GlobalSlimmersRegistry.register([VegaWatchMethodCancelSlimmer]);
 }
+/**
+ * Inject setEventSemantics to global as a public api
+ */
+function injectSetEventSemanticsIntoGlobal() {
+  globalThis.VegaEventManager = vegaEventManager.VegaEventManager;
+}
+/**
+ * Inject Vega typography stylesheet
+ */
+function injectVegaTypography() {
+  Object.keys(typography.TypographyUrls).forEach((key) => {
+    const { url } = typography.TypographyUrls[key];
+    const typographyLinkId = `vega-typography-${key}`;
+    if (!document.querySelector(`#${typographyLinkId}`)) {
+      const typographyLink = document.createElement('link');
+      typographyLink.id = typographyLinkId;
+      typographyLink.href = url;
+      typographyLink.rel = 'stylesheet';
+      document.head.append(typographyLink);
+    }
+  });
+}
 
 const globalScripts = appGlobalScript;
 

package/dist/cjs/{breakpoints-b5eab9c2.js → breakpoints-96bd8c73.js}

@@ -40,6 +40,54 @@ const Breakpoints = {
   "XL": 1440
 };
 
+/**
+ * Get current breakpoint according current window size
+ *
+ * @returns {BreakpointsTokenType} - current breakpoint
+ */
+const getCurrentBreakpoint = () => {
+  let index = BreakpointKeys.length - 1;
+  const windowWidth = window.innerWidth;
+  for (index; index >= 0; index--) {
+    const breakpointKey = BreakpointKeys[index];
+    if (breakpointKey === 'default')
+      break;
+    if (windowWidth >= Breakpoints[breakpointKey])
+      return breakpointKey;
+  }
+  return 'default';
+};
+/**
+ * Completion breakponts, eg:
+ * {
+ *   default: 'size-12',
+ *   M: 'size-24'
+ * }
+ * it will convert to
+ * {
+ *   default: 'size-12',
+ *   S: 'size-12',
+ *   M: 'size-24',
+ *   L: 'size-24',
+ *   XL: 'size-24',
+ * }
+ *
+ * @param {ResponsiveType<ResponsiveScope>} breakpoints - responsive token
+ * @returns {ResponsiveType<ResponsiveScope>} - completed breakpointss
+ */
+const createCompleteResponsiveMap = (breakpoints) => {
+  let responsiveScope;
+  BreakpointKeys.forEach((breakpoint) => {
+    if (Object.prototype.hasOwnProperty.call(breakpoints, breakpoint)) {
+      responsiveScope = breakpoints[breakpoint];
+    }
+    else {
+      breakpoints[breakpoint] = responsiveScope;
+    }
+  });
+  return breakpoints;
+};
+
 exports.Alignments = Alignments;
 exports.BoxDisplay = BoxDisplay;
 exports.BreakpointKeys = BreakpointKeys;
@@ -50,3 +98,5 @@ exports.FlexDirections = FlexDirections;
 exports.FlexJustifyContent = FlexJustifyContent;
 exports.ItemToggleTransitionMillisecond = ItemToggleTransitionMillisecond;
 exports.Placements = Placements;
+exports.createCompleteResponsiveMap = createCompleteResponsiveMap;
+exports.getCurrentBreakpoint = getCurrentBreakpoint;

package/dist/cjs/changeManager-1dd5ac2a.js

@@ -0,0 +1,78 @@
+'use strict';
+
+const log = require('./log-5d8066e0.js');
+
+/**
+ * The ChangeManager is a class that allows observers to register themselves to a subject
+ * and notify the observer if signaled by subject
+ *
+ * @requires Subject
+ * @requires Observer
+ * @property {Map<Subject, Observer<unknown>[]>} pubSubMap - the map of subject to observers
+ */
+class ChangeManager {
+  constructor() {
+    this.pubSubMap = new Map();
+  }
+  /**
+   * If the subject is already in the map, add the observer to the list of observers for that subject. If the subject is not
+   * in the map, add the subject to the map and add the observer to the list of observers for that subject
+   *
+   * @param {Subject} subject - The subject of the event.
+   * @param {Observer<unknown>} observer - The observer that will be registered.
+   */
+  register(subject, observer) {
+    if (this.pubSubMap.has(subject)) {
+      const observers = this.pubSubMap.get(subject);
+      if (observers && !observers.includes(observer)) {
+        observers.push(observer);
+      }
+    }
+    else {
+      this.pubSubMap.set(subject, [observer]);
+    }
+  }
+  /**
+   * If the subject is in the map, remove the observer from the list of observers for that subject
+   *
+   * @param {Subject} subject - The subject of the event.
+   * @param {Observer<unknown>} observer - The observer to be unregistered.
+   */
+  unregister(subject, observer) {
+    if (this.pubSubMap.has(subject)) {
+      const observers = this.pubSubMap.get(subject);
+      if (observers && observers.includes(observer)) {
+        observers.splice(observers.indexOf(observer), 1);
+      }
+    }
+  }
+  /**
+   * The function clears the observers for a given subject in a pub-sub map.
+   *
+   * @param {Subject} subject - The subject parameter is an object that represents the subject of the observer pattern. It is used as a key to identify the observers that are subscribed to it.
+   */
+  clearObserversBySubject(subject) {
+    this.pubSubMap.delete(subject);
+  }
+  /**
+   * If the subject is in the map, then notify all observers of the subject
+   *
+   * @param {Subject} subject - Subject
+   * @param {unknown} payload - The payload to be sent to the observer.
+   */
+  notify(subject, payload) {
+    if (this.pubSubMap.has(subject)) {
+      this.pubSubMap.get(subject).forEach((observer) => {
+        try {
+          observer.notify(payload);
+        }
+        catch (e) {
+          log.LogUtility.warn(`Encountered error while notifying observer for subject ${subject.getDescription()}`, e);
+        }
+      });
+    }
+  }
+}
+const ChangeManager$1 = new ChangeManager();
+
+exports.ChangeManager = ChangeManager$1;

package/dist/cjs/childNodesEventPreventSlimmer-76e4ad14.js

@@ -0,0 +1,129 @@
+'use strict';
+
+const vegaSlimmer = require('./vega-slimmer-f026897e.js');
+const mapToComponentMethod = require('./map-to-component-method-bdf875d3.js');
+require('./global-slimmer-registry-58eee093.js');
+const internalVegaEventManager = require('./internalVegaEventManager-11e57997.js');
+
+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;
+};
+/** The ChildNodesEventPreventSlimmer class prevents specified events from propagating to parent elements. */
+class ChildNodesEventPreventSlimmer extends vegaSlimmer.VegaSlimmer {
+  /**
+   * The constructor function takes in an array of event names and a function to get the parent element, and assigns them to the corresponding properties of the class.
+   *
+   * @param {VegaEventIDInterface[]} eventIds - The eventNames parameter is an array of VegaEventID that represents the names of the events that will be handled by the constructor.
+   * @param {HTMLElement} getHostElement - The `getHostElement` parameter is a function that returns an `HTMLElement`. It is used to get the parent element where the events will be attached.
+   * @param {boolean | EventPreventOptions} options - add event listener in capture or bubbles.
+   */
+  constructor(eventIds, getHostElement, options) {
+    super();
+    // the event names need prevent from child nodes
+    this.eventIds = [];
+    this.useCapture = false;
+    this.isEventListenerAdded = false;
+    /**
+     * prevent the child event
+     *
+     * @param {CustomEvent} event event object
+     */
+    this.preventChildEvent = (event) => {
+      const hostElement = this.getHostElement();
+      if (typeof this.customPreventHandle === 'function') {
+        this.customPreventHandle(event);
+      }
+      else {
+        const composed = event.composedPath();
+        if (hostElement !== event.target || hostElement !== composed[0]) {
+          event.stopImmediatePropagation();
+        }
+      }
+    };
+    this.eventIds = eventIds;
+    this.getHostElement = getHostElement;
+    if (options === true) {
+      this.useCapture = true;
+    }
+    else if (options) {
+      const { useCapture = false, customPreventHandle } = options;
+      this.useCapture = useCapture;
+      this.customPreventHandle = customPreventHandle;
+    }
+  }
+  /**
+   * add event listener when component connected, we can call the method manually if the host element not ready when connectedCallback
+   */
+  setup() {
+    this.addOrRemoveEventListener('add');
+  }
+  /**
+   * if the host element ready after component did load, then add the event listener again.
+   */
+  checkEventListenerStatus() {
+    if (!this.isEventListenerAdded) {
+      this.setup();
+    }
+  }
+  /**
+   * remove the event listener when component disconnect
+   */
+  destroy() {
+    this.addOrRemoveEventListener('remove');
+  }
+  /**
+   * add or remove the event from the parent element
+   *
+   * @param {'add'|'remove'} actionType add or remove
+   */
+  addOrRemoveEventListener(actionType) {
+    const hostElement = this.getHostElement();
+    if (this.eventIds && this.eventIds.length && hostElement) {
+      this.eventIds
+        .filter((eventID) => this.shouldPrevent(eventID))
+        .forEach((eventID) => {
+        hostElement[actionType === 'add' ? 'addEventListener' : 'removeEventListener'](this.getCurrentEventName(eventID), this.preventChildEvent, this.useCapture);
+      });
+      this.isEventListenerAdded = actionType === 'add' ? true : false;
+    }
+  }
+  /**
+   * get the current event name
+   *
+   * @param {VegaEventIDInterface} eventId event id class
+   * @returns {string} native or vega event name string
+   */
+  getCurrentEventName(eventId) {
+    return eventId.getCurrentName(internalVegaEventManager.internalVegaEventManager.getSemantics(this.host));
+  }
+  /**
+   * The function shouldPrevent checks if a given event ID should be prevented based on whether it is a
+   * native event and if it is enabled for the host.
+   *
+   * @param {VegaEventIDInterface} eventId - The `eventId` parameter is of type `VegaEventIDInterface`. It represents the ID of an event.
+   * @returns {boolean} a boolean value.
+   */
+  shouldPrevent(eventId) {
+    const { namespace, jqueryDelegatedEvent } = internalVegaEventManager.internalVegaEventManager.getSemantics(this.host);
+    return !(namespace === 'native' &&
+      !!jqueryDelegatedEvent &&
+      internalVegaEventManager.jqueryDelegatedStrategyController.isSupportDelegated(this.host, eventId));
+  }
+}
+__decorate([
+  vegaSlimmer.MapToComponentField()
+], ChildNodesEventPreventSlimmer.prototype, "host", void 0);
+__decorate([
+  mapToComponentMethod.MapToComponentMethod('connectedCallback')
+], ChildNodesEventPreventSlimmer.prototype, "setup", null);
+__decorate([
+  mapToComponentMethod.MapToComponentMethod('componentDidLoad')
+], ChildNodesEventPreventSlimmer.prototype, "checkEventListenerStatus", null);
+__decorate([
+  mapToComponentMethod.MapToComponentMethod('disconnectedCallback')
+], ChildNodesEventPreventSlimmer.prototype, "destroy", null);
+
+exports.ChildNodesEventPreventSlimmer = ChildNodesEventPreventSlimmer;

package/dist/cjs/childNodesNotifyObserverSlimmer-cc6d9d8d.js

@@ -0,0 +1,92 @@
+'use strict';
+
+const vegaSlimmer = require('./vega-slimmer-f026897e.js');
+const mapToComponentMethod = require('./map-to-component-method-bdf875d3.js');
+require('./global-slimmer-registry-58eee093.js');
+const observer = require('./observer-f49483e8.js');
+const changeManager = require('./changeManager-1dd5ac2a.js');
+const ui = require('./ui-25a66a2a.js');
+
+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;
+};
+/** The `ChildNodesNotifyObserverSlimmer` class is a TypeScript class that acts as a slimmed-down version of a notify observer for child nodes, allowing for add and remove of observers and handling of observer payloads. */
+class ChildNodesNotifyObserverSlimmer extends vegaSlimmer.VegaSlimmer {
+  /**
+   * The constructor function initializes the subject and notifyObserverEntry properties of the class.
+   *
+   * @param {Subject} subject - The `subject` parameter is an instance of the `Subject` class. It represents the subject that the observer will be observing.
+   * @param {NotifyObserverCallback} callback - It is typically called by the subject when it undergoes a change and needs to notify its observers.
+   * @param {CustomAcceptableType} [customAcceptableHandle] - It is typically called by the subject when it undergoes a change and needs to notify its observers.
+   */
+  constructor(subject, callback, customAcceptableHandle) {
+    super();
+    this.acceptableResultMap = new WeakMap();
+    /**
+     * It is used to determine whether a given observer payload is acceptable for the observer.
+     *
+     * @param {NotifyObserverPayload<unknown>} input input payload
+     * @returns {boolean} true or false
+     */
+    this.isAcceptableObserverPayload = (input) => {
+      let result = false;
+      if (typeof this.customAcceptableHandle === 'function') {
+        result = this.customAcceptableHandle(input);
+      }
+      else if (this.host && input.host) {
+        if (this.acceptableResultMap.has(input.host)) {
+          result = !!this.acceptableResultMap.get(input.host);
+        }
+        else {
+          result = this.host === input.host ? false : ui.isParent(input.host, this.host);
+          this.acceptableResultMap.set(input.host, result);
+        }
+      }
+      return result;
+    };
+    /**
+     * trigger the callback function
+     *
+     * @param {NotifyObserverPayload<unknown>} input input payload
+     */
+    this.handleObserver = (input) => {
+      if (typeof this.callback === 'function') {
+        this.callback(input);
+      }
+    };
+    this.subject = subject;
+    this.callback = callback;
+    this.customAcceptableHandle = customAcceptableHandle;
+  }
+  /**
+   * Initialize the notify observer.
+   */
+  connectedCallback() {
+    if (this.subject) {
+      this.notifyObserver = new observer.Observer(this.isAcceptableObserverPayload.bind(this), this.handleObserver);
+      changeManager.ChangeManager.register(this.subject, this.notifyObserver);
+    }
+  }
+  /**
+   * Unregister the observer when disconnectedCallback
+   */
+  disconnectedCallback() {
+    if (this.subject) {
+      changeManager.ChangeManager.unregister(this.subject, this.notifyObserver);
+    }
+  }
+}
+__decorate([
+  vegaSlimmer.MapToComponentField()
+], ChildNodesNotifyObserverSlimmer.prototype, "host", void 0);
+__decorate([
+  mapToComponentMethod.MapToComponentMethod('connectedCallback')
+], ChildNodesNotifyObserverSlimmer.prototype, "connectedCallback", null);
+__decorate([
+  mapToComponentMethod.MapToComponentMethod('disconnectedCallback')
+], ChildNodesNotifyObserverSlimmer.prototype, "disconnectedCallback", null);
+
+exports.ChildNodesNotifyObserverSlimmer = ChildNodesNotifyObserverSlimmer;

package/dist/cjs/{component-4fa182e0.js → component-de54cd0d.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const featureFlagController = require('./featureFlagController-9161143b.js');
+const featureFlagController = require('./featureFlagController-daf977be.js');
 const log = require('./log-5d8066e0.js');
 
 const exemptionClasses = [
@@ -15,7 +15,6 @@ const exemptionClasses = [
   'v-text-black',
   'v-text-white',
   'v-hidden',
-  'vega-loader-container-relative',
   'vega-page-notification-fade-out',
   'v-h-full',
   'v-h-screen',
@@ -92,5 +91,30 @@ function checkIfUseDataShrink(hostElement) {
     });
   }
 }
+/* istanbul ignore next */
+/**
+ * The function `getActiveElement` returns the active element within a shadow root or the
+ * document.
+ *
+ * @param {Document | ShadowRoot} root - The `root` parameter is the root element from which to start
+ * searching for the active element. It can be either a `Document` or a `ShadowRoot`. If no `root` is
+ * provided, it defaults to the `document` object.
+ * @returns {Nullable<Element>} The function `getActiveElementInShadow` returns an `Element` if there is an active element
+ * in the given `root` (either a `Document` or a `ShadowRoot`). If there is no active element, it
+ * returns `null`.
+ */
+const getActiveElement = (root = document) => {
+  const activeEl = root.activeElement;
+  if (activeEl === null || activeEl === void 0 ? void 0 : activeEl.shadowRoot) {
+    return getActiveElement(activeEl.shadowRoot);
+  }
+  else if (activeEl) {
+    return activeEl;
+  }
+  else {
+    return null;
+  }
+};
 
+exports.getActiveElement = getActiveElement;
 exports.sanitizeVegaComponent = sanitizeVegaComponent;

package/dist/cjs/{designToken-45078c17.js → designToken-ed34a533.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-const typeGuard = require('./typeGuard-447fb5bd.js');
-const breakpoints = require('./breakpoints-b5eab9c2.js');
+const typeGuard = require('./typeGuard-46915d8c.js');
+const breakpoints = require('./breakpoints-96bd8c73.js');
 const log = require('./log-5d8066e0.js');
-const responsiveFormatFacade = require('./responsiveFormatFacade-6cc0b6b2.js');
-const typography = require('./typography-358013af.js');
+const responsiveFormatFacade = require('./responsiveFormatFacade-8bfed8eb.js');
+const typography = require('./typography-3d2ba97d.js');
 
 /**
  * It logs a warning message to the console.
@@ -104,20 +104,6 @@ function formatAndValidTextColor(token, withModes = []) {
     logInvalidValueMessage('text-color', token, typeGuard.Colors.filter(() => /^border-.+$/.test));
   }
 }
-/**
- * If the token is a valid breakpoint, return CSS class string for the flex breakpoint. Otherwise, log an error
- *
- * @param {unknown} token - The value of the breakpoint.
- * @returns {string} CSS class string for the flex breakpoint.
- */
-function formatAndValidFlexBreakpoint(token) {
-  if (typeGuard.isBreakpointsTokenType(token)) {
-    return `vega-flex-${token}`;
-  }
-  else {
-    logInvalidValueMessage('breakpoint', token, Object.keys(breakpoints.Breakpoints));
-  }
-}
 /**
  * If the token is a breakpoint, return the breakpoint value. Otherwise, log an error and return 0
  *
@@ -194,7 +180,6 @@ exports.formatAndValidBackgroundColor = formatAndValidBackgroundColor;
 exports.formatAndValidBorderColor = formatAndValidBorderColor;
 exports.formatAndValidBorderRadius = formatAndValidBorderRadius;
 exports.formatAndValidBreakpointSize = formatAndValidBreakpointSize;
-exports.formatAndValidFlexBreakpoint = formatAndValidFlexBreakpoint;
 exports.formatAndValidGap = formatAndValidGap;
 exports.formatAndValidPadding = formatAndValidPadding;
 exports.formatAndValidResponsiveToken = formatAndValidResponsiveToken;

package/dist/cjs/domNodeSubjectObserverFactory-8663ab4f.js

@@ -0,0 +1,123 @@
+'use strict';
+
+const changeManager = require('./changeManager-1dd5ac2a.js');
+const observer = require('./observer-f49483e8.js');
+
+/** The DomNodeSubject class represents a subject related to DOM nodes. */
+class DomNodeSubject {
+  /**
+   * The constructor function takes a SubjectTitle parameter and assigns it to the private title property.
+   *
+   * @param {SubjectTitle} title - The "title" parameter is a private property of the class that is of type "SubjectTitle".
+   * @param {HTMLElement} host - The `host` parameter is an HTMLElement that represents the container or
+   * parent element where the subject title will be displayed. It is used to specify the location where
+   * the title will be rendered on the web page.
+   */
+  constructor(title, host) {
+    this.title = title;
+    this.host = host;
+  }
+  /**
+   * The getDescription function returns the title of an object as a string.
+   *
+   * @returns {string} The title of the object.
+   */
+  getDescription() {
+    return `, this is a dom nodes subject of ${this.title}.(class name:${this.host.className}, id:${this.host.id})`;
+  }
+}
+
+/** The `DomNodesSubjectFactory` class is responsible for managing and caching `DomNodeSubject` objects associated with HTML elements. */
+class DomNodeSubjectFactory {
+  constructor() {
+    this.cache = new WeakMap();
+  }
+  /**
+   * The function `getSubject` returns the subject associated with a given node and event ID, either from the cache or by setting it if it doesn't exist.
+   *
+   * @param {HTMLElement} node - The `node` parameter is an HTMLElement, which represents an element in the HTML document.
+   * @param {VegaEventIDInterface} eventId - The `eventId` parameter is of type `VegaEventIDInterface`. It represents the ID of the event for which we want to get the subject.
+   * @returns {DomNodeSubject} a `DomNodeSubject` object.
+   */
+  getSubject(node, eventId) {
+    if (this.isExist(node, eventId)) {
+      return this.cache.get(node).get(eventId);
+    }
+    else {
+      return this.setSubject(node, eventId);
+    }
+  }
+  /**
+   * The function checks if a given node exists in the cache and if it has a specific event ID.
+   *
+   * @param {HTMLElement} node - The "node" parameter is an HTMLElement, which represents an HTML element in the DOM (Document Object Model). It could be any HTML element such as a div, span, button, etc.
+   * @param {VegaEventIDInterface} eventId - The `eventId` parameter is of type `VegaEventIDInterface`. It represents an event ID that is used to identify a specific event.
+   * @returns {boolean} a boolean value.
+   */
+  isExist(node, eventId) {
+    if (node) {
+      return (this.cache.has(node) &&
+        this.cache.get(node) !== undefined &&
+        this.cache.get(node).has(eventId));
+    }
+    return false;
+  }
+  /**
+   * The function `setSubject` creates a new `DomNodeSubject` and associates it with a given `node` and `eventId`, and then returns the created subject.
+   *
+   * @param {HTMLElement} node - The `node` parameter is an HTMLElement object representing an HTML element in the DOM (Document Object Model).
+   * @param {VegaEventIDInterface} eventId - The `eventId` parameter is of type `VegaEventIDInterface`. It represents the ID of a Vega event.
+   * @returns {DomNodeSubject} dom node subject object
+   */
+  setSubject(node, eventId) {
+    const subjectTitle = `${node.tagName}:${eventId.getVegaName()}`;
+    const subject = new DomNodeSubject(subjectTitle, node);
+    if (!this.cache.get(node)) {
+      this.cache.set(node, new Map());
+    }
+    this.cache.get(node).set(eventId, subject);
+    return subject;
+  }
+}
+const domNodeSubjectFactory = new DomNodeSubjectFactory();
+
+/**
+ * The function `domAcceptableHandle` always returns `true`.
+ *
+ * @returns {boolean} true
+ */
+const domAcceptableHandle = () => {
+  return true;
+};
+/** The `DomNodeSubjectObserverFactory` class provides methods to add and remove observers to HTML element nodes. */
+class DomNodeSubjectObserverFactory {
+  /**
+   * add observer to a given HTML element node
+   *
+   * @param {HTMLElement} node the node ref
+   * @param {VegaEventIDInterface} eventId The `eventId` parameter is of type `VegaEventIDInterface`. It represents the ID of a Vega event.
+   * @param {(input?: unknown) => void} callback the callback handle
+   * @param {(input?: unknown) => boolean} acceptableHandle the acceptable handle
+   */
+  static addObserverToNode(node, eventId, callback, acceptableHandle) {
+    if (node) {
+      const domNodesObserver = new observer.Observer(typeof acceptableHandle === 'function' ? acceptableHandle.bind(null) : domAcceptableHandle, callback);
+      DomNodeSubjectObserverFactory.removeObserverFromNode(node, eventId);
+      changeManager.ChangeManager.register(domNodeSubjectFactory.getSubject(node, eventId), domNodesObserver);
+    }
+  }
+  /**
+   * The function removes observers from a given HTML element node.
+   *
+   * @param {HTMLElement} node - The `node` parameter is an `HTMLElement` object representing an HTML element in the DOM (Document Object Model).
+   * @param {VegaEventIDInterface} eventId The `eventId` parameter is of type `VegaEventIDInterface`. It represents the ID of a Vega event.
+   */
+  static removeObserverFromNode(node, eventId) {
+    if (domNodeSubjectFactory.isExist(node, eventId)) {
+      changeManager.ChangeManager.clearObserversBySubject(domNodeSubjectFactory.getSubject(node, eventId));
+    }
+  }
+}
+
+exports.DomNodeSubjectObserverFactory = DomNodeSubjectObserverFactory;
+exports.domNodeSubjectFactory = domNodeSubjectFactory;