@heartlandone/vega 2.0.0-temp-test-0.2 → 2.0.0

package/dist/cjs/{elementAppender-35b30be1.js → elementAppender-e585dbc9.js}

@@ -1,14 +1,15 @@
 'use strict';
 
 const log = require('./log-5d8066e0.js');
-const breakpoints = require('./breakpoints-b5eab9c2.js');
-const typeGuard = require('./typeGuard-447fb5bd.js');
-const responsiveFormatFacade = require('./responsiveFormatFacade-6cc0b6b2.js');
-const ui = require('./ui-97068bc7.js');
+const ui = require('./ui-ef822fe1.js');
+const typeGuard = require('./typeGuard-70b919b6.js');
+const responsiveFormatFacade = require('./responsiveFormatFacade-8518443e.js');
+const ui$1 = require('./ui-23cd9abb.js');
 const zIndexManager = require('./zIndexManager-de9aa352.js');
-const vegaSlimmer = require('./vega-slimmer-281f0079.js');
-const dynamicSlimmer = require('./dynamic-slimmer-e289eb0b.js');
-const pageResizeObserverSlimmer = require('./pageResizeObserverSlimmer-a81a52b1.js');
+const globalSlimmerRegistry = require('./global-slimmer-registry-58eee093.js');
+const dynamicSlimmer = require('./dynamic-slimmer-c718b7d9.js');
+const pageResizeObserverSlimmer = require('./pageResizeObserverSlimmer-9751395d.js');
+const vegaSlimmer = require('./vega-slimmer-af488dc3.js');
 
 /**
  * Get the position of the element in the container according to the target element and the placement
@@ -91,14 +92,14 @@ function getTranslocationBox(originPlacement, placement, translocation) {
  */
 function getPlacements(placement) {
   if (typeof placement === 'string') {
-    const partial = breakpoints.Placements.filter((direction) => direction !== placement);
+    const partial = ui.Placements.filter((direction) => direction !== placement);
     return [placement, ...partial];
   }
   else if (Array.isArray(placement)) {
     return placement;
   }
   else {
-    return [...breakpoints.Placements];
+    return [...ui.Placements];
   }
 }
 /**
@@ -109,14 +110,14 @@ function getPlacements(placement) {
  */
 function getAlignments(alignment) {
   if (typeof alignment === 'string') {
-    const partial = breakpoints.Alignments.filter((item) => item !== alignment);
+    const partial = ui.Alignments.filter((item) => item !== alignment);
     return [alignment, ...partial];
   }
   else if (Array.isArray(alignment)) {
     return alignment;
   }
   else {
-    return [...breakpoints.Alignments];
+    return [...ui.Alignments];
   }
 }
 /**
@@ -381,6 +382,234 @@ function getElementScrollDimension(container) {
   };
 }
 
+var __decorate$5 = (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;
+};
+/**
+ * This class is is used to retrieve the body element of document.
+ */
+class DefaultWrapper {
+  constructor() {
+    /**
+     * The canRetrieve function return is always true.
+     *
+     * @returns {boolean} the boolean type.
+     */
+    this.canRetrieve = () => true;
+    /**
+     * The retrieve function get the body element of document.
+     *
+     * @returns {HTMLElement} the element.
+     */
+    this.retrieve = () => {
+      const container = document.body;
+      container.append(this.showConfig.appendableElement);
+      return container;
+    };
+  }
+}
+__decorate$5([
+  vegaSlimmer.MapToComponentField()
+], DefaultWrapper.prototype, "showConfig", void 0);
+
+var __decorate$4 = (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;
+};
+/**
+ * This class is is used to retrieve an HTML element based on a specified selector.
+ *
+ * @property {HTMLElement} showConfig the show config
+ */
+class PositionRelativeToWrapper {
+  constructor() {
+    /**
+     * The canRetrieve function just determines whether the showConfig contains the positionRelativeTo object.
+     *
+     * @returns {boolean} the boolean type.
+     */
+    this.canRetrieve = () => !!this.showConfig.positionRelativeTo &&
+      !!document.querySelector(this.showConfig.positionRelativeTo);
+    /**
+     * The retrieve function query the element of positionRelativeTo in showConfig.
+     *
+     * @returns {HTMLElement} the element.
+     */
+    this.retrieve = () => {
+      const container = document.querySelector(this.showConfig.positionRelativeTo);
+      container.append(this.showConfig.appendableElement);
+      return container;
+    };
+  }
+}
+__decorate$4([
+  vegaSlimmer.MapToComponentField()
+], PositionRelativeToWrapper.prototype, "showConfig", void 0);
+
+var __decorate$3 = (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;
+};
+/**
+ * This class is is used to get vega-modal element as a container and store the element appender element to slot.
+ *
+ * @property {HTMLElement} showConfig the show config
+ */
+class VegaModalWrapper {
+  constructor() {
+    /**
+     * The canRetrieve function just determines whether the target of showConfig has the `vega-modal` element. If not, search upwards layer by layer.
+     *
+     * @returns {boolean} the boolean type.
+     */
+    this.canRetrieve = () => !!ui$1.findParent(this.showConfig.target, 'vega-modal');
+    /**
+     * The retrieve function get the slot position of vega-modal element.
+     *
+     * @returns {HTMLElement} the element.
+     */
+    this.retrieve = () => this.getVegaModalShowConfigContainer();
+  }
+  /**
+   * This function `getVegaModalContentWithoutScroll` determines whether vega-modal has a slot whose name is `content` or `modal-content`. If there is a component rendered in the modal, the elementAppender added to the corresponding slot attribute is added. If not, the elementAppender is not directly appended to the root directory of vega-modal.
+   *
+   * @param {Nullable<HTMLElement>} parentModal The parentModal is vega-modal element.
+   * @param {Nullable<HTMLElement>} element The parentModal is vega-modal element.
+   */
+  setElementSlot(parentModal, element) {
+    var _a;
+    const slotName = (_a = Array.from(parentModal.children)
+      .find((item) => {
+      const slotName = item.getAttribute('slot');
+      return slotName && ['content', 'modal-content'].includes(slotName);
+    })) === null || _a === void 0 ? void 0 : _a.getAttribute('slot');
+    if (slotName) {
+      element.setAttribute('slot', slotName);
+    }
+  }
+  /**
+   * The function "getShowConfigContainer" returns the appended element container. If the modal content can be scrolled, the container is the div element that wraps the append element. Otherwise, the container is the modal dialog itself.
+   *
+   * @returns {HTMLElement} the `scrollContainer` element.
+   */
+  getVegaModalShowConfigContainer() {
+    const parentModal = ui$1.findParent(this.showConfig.target, 'vega-modal');
+    const modalContentScrollable = parentModal.shadowRoot.querySelector('.vega-modal-content-with-scroll');
+    const modalDialog = parentModal.shadowRoot.querySelector('.modal-dialog');
+    this.setElementSlot(parentModal, this.showConfig.appendableElement);
+    parentModal.append(this.showConfig.appendableElement);
+    return modalContentScrollable ? modalContentScrollable : modalDialog;
+  }
+}
+__decorate$3([
+  vegaSlimmer.MapToComponentField({ writable: true })
+], VegaModalWrapper.prototype, "showConfig", void 0);
+
+var __decorate$2 = (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;
+};
+/**
+ * This class is used to get the class `vega-popover` as a container and store the element appender element.
+ *
+ * @property {HTMLElement} showConfig the show config
+ */
+class VegaPopoverWrapper {
+  constructor() {
+    /**
+     * The canRetrieve function just determine whether the target of showConfig has the class `vega-popover`. If not, search upwards layer by layer.
+     *
+     * @returns {boolean} the boolean type.
+     */
+    this.canRetrieve = () => !!ui$1.findParent(this.showConfig.target, '.vega-popover');
+    /**
+     * The retrieve function get the element that if the target of showConfig does not have the class vega-popover, search upwards layer by layer until this element is found.
+     *
+     * @returns {HTMLElement} the element.
+     */
+    this.retrieve = () => {
+      const container = ui$1.findParent(this.showConfig.target, '.vega-popover');
+      container.append(this.showConfig.appendableElement);
+      return container;
+    };
+  }
+}
+__decorate$2([
+  vegaSlimmer.MapToComponentField()
+], VegaPopoverWrapper.prototype, "showConfig", void 0);
+
+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;
+};
+/**
+ * This class is responsible for setting the container element for appending an element based on certain conditions.
+ *
+ * @property {HTMLElement} container the container
+ * @property {HTMLElement} showConfig the show config
+ */
+class ElementAppenderContainerController extends vegaSlimmer.VegaSlimmer {
+  constructor() {
+    super(...arguments);
+    this.positionRelativeToWrapper = new PositionRelativeToWrapper();
+    this.vegaPopoverWrapper = new VegaPopoverWrapper();
+    this.vegaModalWrapper = new VegaModalWrapper();
+    this.defaultWrapper = new DefaultWrapper();
+  }
+  /**
+   * The function sets the container element by iterating through a list of retrievers, defaulting to the document body.
+   */
+  setContainer() {
+    this.setContainerRetrievers();
+    for (const retriever of this.containerRetrievers) {
+      if (retriever.canRetrieve()) {
+        this.container = retriever.retrieve();
+        return;
+      }
+    }
+  }
+  /**
+   * The function sets up an array of container retrievers based on certain conditions.
+   */
+  setContainerRetrievers() {
+    this.containerRetrievers = [
+      this.positionRelativeToWrapper,
+      this.vegaPopoverWrapper,
+      this.vegaModalWrapper,
+      this.defaultWrapper,
+    ];
+  }
+}
+__decorate$1([
+  vegaSlimmer.MapToComponentField({ writable: true })
+], ElementAppenderContainerController.prototype, "container", void 0);
+__decorate$1([
+  vegaSlimmer.MapToComponentField({ writable: true })
+], ElementAppenderContainerController.prototype, "showConfig", void 0);
+__decorate$1([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], ElementAppenderContainerController.prototype, "positionRelativeToWrapper", void 0);
+__decorate$1([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], ElementAppenderContainerController.prototype, "vegaPopoverWrapper", void 0);
+__decorate$1([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], ElementAppenderContainerController.prototype, "vegaModalWrapper", void 0);
+__decorate$1([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], ElementAppenderContainerController.prototype, "defaultWrapper", void 0);
+
 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);
@@ -423,8 +652,8 @@ class ElementAppender {
         callback: /* istanbul ignore next */ () => {
           // while target and appendableElement are both visible, we can adjust position.
           // https://gethired.atlassian.net/browse/VD-1087
-          if (ui.isElementVisible(this.showConfig.target) &&
-            ui.isElementVisible(this.showConfig.appendableElement)) {
+          if (ui$1.isElementVisible(this.showConfig.target) &&
+            ui$1.isElementVisible(this.showConfig.appendableElement)) {
             this.adjustWidth();
             this.adjustHeight();
             this.adjustPosition();
@@ -434,6 +663,7 @@ class ElementAppender {
         target: () => [document.body, this.showConfig.appendableElement, this.showConfig.target],
       },
     ]);
+    this.elementAppenderContainerController = new ElementAppenderContainerController();
     this.showConfigCallback = showConfigCallback;
     this.showConfigCallbackTarget = showConfigCallbackTarget;
     const config = this.getShowConfig();
@@ -560,38 +790,9 @@ class ElementAppender {
       matchContainerHeight: false,
     }, this.showConfig);
     if (this.showConfig.target && this.showConfig.appendableElement) {
-      this.setShowConfigContainer();
+      this.elementAppenderContainerController.setContainer();
     }
   }
-  /**
-   * If the user has specified a positionRelativeTo, then we use that as the container. Otherwise, we try
-   * to find a parent modal, and if we find one, we use that as the container. If we don't find a parent
-   * modal, then we use the body as the container
-   */
-  setShowConfigContainer() {
-    let container = document.body;
-    if (this.showConfig.positionRelativeTo) {
-      const positionRelativeContainer = document.querySelector(this.showConfig.positionRelativeTo);
-      if (positionRelativeContainer) {
-        container = positionRelativeContainer;
-      }
-    }
-    else {
-      const parentPopover = ui.findParent(this.showConfig.target, '.vega-popover');
-      if (parentPopover) {
-        container = parentPopover;
-      }
-      else {
-        const parentModal = ui.findParent(this.showConfig.target, '.vega-modal-content-with-scroll') ||
-          ui.findParent(this.showConfig.target, '.modal-dialog');
-        if (parentModal) {
-          container = parentModal;
-        }
-      }
-    }
-    container.append(this.showConfig.appendableElement);
-    this.container = container;
-  }
   /**
    * It makes sure that the container element is positioned relatively, and that the appendable element
    * has box-sizing set to border-box
@@ -713,7 +914,10 @@ class ElementAppender {
  */
 ElementAppender.containerMap = new Map();
 __decorate([
-  vegaSlimmer.InjectVegaSlimmer()
+  globalSlimmerRegistry.InjectVegaSlimmer()
 ], ElementAppender.prototype, "resizeObserverSlimmer", void 0);
+__decorate([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], ElementAppender.prototype, "elementAppenderContainerController", void 0);
 
 exports.ElementAppender = ElementAppender;

package/dist/cjs/{subStateNotifySlimmer-0602d340.js → elementAppenderSlimmer-853b7f89.js}

@@ -1,33 +1,33 @@
 'use strict';
 
-const vegaSlimmer = require('./vega-slimmer-281f0079.js');
-const mapToComponentMethod = require('./map-to-component-method-ec6546f1.js');
-const elementAppender = require('./elementAppender-35b30be1.js');
-const ui = require('./ui-97068bc7.js');
-const keyboardManager = require('./keyboardManager-8084a0cf.js');
-const dynamicSlimmer = require('./dynamic-slimmer-e289eb0b.js');
-const changeManager = require('./changeManager-91f1f24a.js');
+require('./global-slimmer-registry-58eee093.js');
+const vegaSlimmer = require('./vega-slimmer-af488dc3.js');
+const elementAppender = require('./elementAppender-e585dbc9.js');
+const ui = require('./ui-23cd9abb.js');
 
-var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+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 ElementAppenderSlimmer extends vegaSlimmer.VegaSlimmer {
-  constructor(showConfigFactory, getTrigger, isDropdownShowName = 'isDropdownShow') {
+  constructor(showConfigFactory, getTrigger, isDropdownShowName = 'isDropdownShow', disableInteractiveGetter = () => false) {
     super();
     /**
      * It adds event listeners to the target and the appendable element
      */
     this.registerElementAppenderListener = () => {
-      var _a, _b, _c, _d, _e;
+      var _a, _b, _c, _d, _e, _f;
       this.unRegisterElementAppenderListener();
-      (_a = this.showConfig.target) === null || _a === void 0 ? void 0 : _a.addEventListener('click', this.targetClickHandler);
-      (_b = this.showConfig.target) === null || _b === void 0 ? void 0 : _b.addEventListener('mouseenter', this.targetMouseEnterHandler);
-      (_c = this.showConfig.target) === null || _c === void 0 ? void 0 : _c.addEventListener('mouseleave', this.targetMouseLeaveHandler);
-      (_d = this.showConfig.appendableElement) === null || _d === void 0 ? void 0 : _d.addEventListener('mouseenter', this.elementMouseEnterHandler);
-      (_e = this.showConfig.appendableElement) === null || _e === void 0 ? void 0 : _e.addEventListener('mouseleave', this.elementMouseLeaveHandler);
+      if (this.showConfig) {
+        (_a = this.showConfig.target) === null || _a === void 0 ? void 0 : _a.addEventListener('click', this.targetClickHandler);
+        (_b = this.showConfig.target) === null || _b === void 0 ? void 0 : _b.addEventListener('mouseenter', this.targetMouseEnterHandler);
+        (_c = this.showConfig.target) === null || _c === void 0 ? void 0 : _c.addEventListener('mouseleave', this.targetMouseLeaveHandler);
+        (_d = this.showConfig.target) === null || _d === void 0 ? void 0 : _d.addEventListener('focusout', this.targetMouseLeaveHandler);
+        (_e = this.showConfig.appendableElement) === null || _e === void 0 ? void 0 : _e.addEventListener('mouseenter', this.elementMouseEnterHandler);
+        (_f = this.showConfig.appendableElement) === null || _f === void 0 ? void 0 : _f.addEventListener('mouseleave', this.elementMouseLeaveHandler);
+      }
       window.addEventListener('mousedown', this.globalMouseDownHandler);
     };
     /* It's a function that listens to the click event on the dropdown. It checks if the trigger
@@ -56,7 +56,7 @@ class ElementAppenderSlimmer extends vegaSlimmer.VegaSlimmer {
     /* It's a function that listens to the mouseenter event on the dropdown. It checks if the trigger
     property is equal to 'hover'. If it is, then it clears the timer. */
     this.elementMouseEnterHandler = () => {
-      if (this.shouldListenerWork('hover')) {
+      if (this.shouldListenerWork('hover') && !this.disableInteractiveGetter()) {
         this.clearDelayHideTimer();
       }
     };
@@ -64,7 +64,7 @@ class ElementAppenderSlimmer extends vegaSlimmer.VegaSlimmer {
     property is equal to 'hover'. If it is, then it creates a timer that will hide the dropdown after a
     certain amount of time. */
     this.elementMouseLeaveHandler = () => {
-      if (this.shouldListenerWork('hover')) {
+      if (this.shouldListenerWork('hover') && !this.disableInteractiveGetter()) {
         this.createDelayHideTimer();
       }
     };
@@ -72,12 +72,13 @@ class ElementAppenderSlimmer extends vegaSlimmer.VegaSlimmer {
     and if the target of the event is not a child of the dropdown or the trigger. If it is, then it
     hides the dropdown. */
     this.globalMouseDownHandler = (e) => {
+      const currentTarget = e.composedPath()[0];
       if (this.shouldListenerWork('custom') &&
         this.isShowing() &&
-        !ui.isParent(e.target, this.showConfig.appendableElement) &&
-        !ui.isParent(e.target, this.showConfig.target) &&
-        ui.findParent(e.target, 'vega-modal') ===
-          ui.findParent(this.showConfig.target, 'vega-modal')) {
+        this.showConfig &&
+        !ui.isParent(currentTarget, this.showConfig.appendableElement) &&
+        !ui.isParent(currentTarget, this.showConfig.target) &&
+        ui.findParent(currentTarget, 'vega-modal') === ui.findParent(this.showConfig.target, 'vega-modal')) {
         this.hide();
       }
     };
@@ -109,6 +110,7 @@ class ElementAppenderSlimmer extends vegaSlimmer.VegaSlimmer {
     this.showConfigFactory = showConfigFactory;
     this.getTrigger = getTrigger;
     this.isDropdownShowName = isDropdownShowName;
+    this.disableInteractiveGetter = disableInteractiveGetter;
   }
   connectedCallback() {
     if (this.elementAppender === null) {
@@ -156,95 +158,27 @@ class ElementAppenderSlimmer extends vegaSlimmer.VegaSlimmer {
    * It removes all event listeners that were added in the `register()` function
    */
   unRegisterElementAppenderListener() {
-    var _a, _b, _c, _d, _e;
-    (_a = this.showConfig.target) === null || _a === void 0 ? void 0 : _a.removeEventListener('click', this.targetClickHandler);
-    (_b = this.showConfig.target) === null || _b === void 0 ? void 0 : _b.removeEventListener('mouseenter', this.targetMouseEnterHandler);
-    (_c = this.showConfig.target) === null || _c === void 0 ? void 0 : _c.removeEventListener('mouseleave', this.targetMouseLeaveHandler);
-    (_d = this.showConfig.appendableElement) === null || _d === void 0 ? void 0 : _d.removeEventListener('mouseenter', this.elementMouseEnterHandler);
-    (_e = this.showConfig.appendableElement) === null || _e === void 0 ? void 0 : _e.removeEventListener('mouseleave', this.elementMouseLeaveHandler);
+    var _a, _b, _c, _d, _e, _f;
+    if (this.showConfig) {
+      (_a = this.showConfig.target) === null || _a === void 0 ? void 0 : _a.removeEventListener('click', this.targetClickHandler);
+      (_b = this.showConfig.target) === null || _b === void 0 ? void 0 : _b.removeEventListener('mouseenter', this.targetMouseEnterHandler);
+      (_c = this.showConfig.target) === null || _c === void 0 ? void 0 : _c.removeEventListener('mouseleave', this.targetMouseLeaveHandler);
+      (_d = this.showConfig.target) === null || _d === void 0 ? void 0 : _d.removeEventListener('focusout', this.targetMouseLeaveHandler);
+      (_e = this.showConfig.appendableElement) === null || _e === void 0 ? void 0 : _e.removeEventListener('mouseenter', this.elementMouseEnterHandler);
+      (_f = this.showConfig.appendableElement) === null || _f === void 0 ? void 0 : _f.removeEventListener('mouseleave', this.elementMouseLeaveHandler);
+    }
     window.removeEventListener('mousedown', this.globalMouseDownHandler);
   }
 }
 ElementAppenderSlimmer.DELAY_HIDE_TIME = 100;
-__decorate$1([
-  mapToComponentMethod.MapToComponentMethod('connectedCallback')
-], ElementAppenderSlimmer.prototype, "connectedCallback", null);
-__decorate$1([
-  mapToComponentMethod.MapToComponentMethod('disconnectedCallback')
-], ElementAppenderSlimmer.prototype, "disconnectedCallback", null);
-__decorate$1([
-  mapToComponentMethod.MapToComponentMethod('componentDidLoad')
-], ElementAppenderSlimmer.prototype, "componentDidLoad", null);
-
-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 KeyboardManagerSlimmer extends vegaSlimmer.VegaSlimmer {
-  constructor(listenersRetriever) {
-    super();
-    this.listenersRetriever = listenersRetriever;
-  }
-  connectedCallback() {
-    this.keyboardEventListeners && keyboardManager.KeyboardManager.register(this.keyboardEventListeners);
-  }
-  disconnectedCallback() {
-    keyboardManager.KeyboardManager.deregister(this.keyboardEventListeners);
-  }
-  componentDidLoad() {
-    this.keyboardEventListeners = this.listenersRetriever(this);
-    keyboardManager.KeyboardManager.register(this.keyboardEventListeners);
-  }
-}
 __decorate([
-  mapToComponentMethod.MapToComponentMethod('connectedCallback')
-], KeyboardManagerSlimmer.prototype, "connectedCallback", null);
+  vegaSlimmer.MapToComponentMethod('connectedCallback')
+], ElementAppenderSlimmer.prototype, "connectedCallback", null);
 __decorate([
-  mapToComponentMethod.MapToComponentMethod('disconnectedCallback')
-], KeyboardManagerSlimmer.prototype, "disconnectedCallback", null);
+  vegaSlimmer.MapToComponentMethod('disconnectedCallback')
+], ElementAppenderSlimmer.prototype, "disconnectedCallback", null);
 __decorate([
-  mapToComponentMethod.MapToComponentMethod('componentDidLoad')
-], KeyboardManagerSlimmer.prototype, "componentDidLoad", null);
-
-/**
- * Sub state notify slimmer
- */
-class SubStateNotifySlimmerBase extends vegaSlimmer.VegaSlimmer {
-  // eslint-disable-next-line jsdoc/require-jsdoc
-  constructor({ propName }) {
-    super();
-    this.propName = propName;
-  }
-  /**
-   * Notify the children component which prop has been changed in the parent component
-   */
-  subStateNotify() {
-    changeManager.ChangeManager.notify(changeManager.SUB_STATE_CHANGE, {
-      host: this.host,
-      stateName: this.propName,
-      value: this.host[this.propName],
-    });
-  }
-}
-
-/**
- * Create dynamic subState notify slimmer
- *
- * @param {ClassPrototype} mapFromClass - It represents the class that you want to map from.
- * @param {string} propName - The parent component prop name
- * @param {string} watchMethodName - The watch method name of prop change
- * @returns {SubStateNotifySlimmerBase} - SubState notify slimmer
- */
-function createSubStateNotifySlimmer(mapFromClass, propName, watchMethodName) {
-  return dynamicSlimmer.createDynamicSlimmer(mapFromClass, SubStateNotifySlimmerBase, [{ mapFrom: 'host', mapTo: 'host' }], [{ mapFrom: watchMethodName, mapTo: 'subStateNotify' }], [
-    {
-      propName: propName,
-    },
-  ]);
-}
+  vegaSlimmer.MapToComponentMethod('componentDidLoad')
+], ElementAppenderSlimmer.prototype, "componentDidLoad", null);
 
 exports.ElementAppenderSlimmer = ElementAppenderSlimmer;
-exports.KeyboardManagerSlimmer = KeyboardManagerSlimmer;
-exports.createSubStateNotifySlimmer = createSubStateNotifySlimmer;