revert: refactor(esl-toggleable): move open state updating to `onSh…

…ow`/`onHide` callbacks This reverts commit b184eb1.
exadel-inc · Mar 6, 2024 · dee9503 · dee9503
1 parent a5d5dd3
commit dee9503
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 5 deletions.
diff --git a/src/modules/esl-popup/core/esl-popup.ts b/src/modules/esl-popup/core/esl-popup.ts
@@ -194,8 +194,7 @@ export class ESLPopup extends ESLToggleable {
    * Adds CSS classes, update a11y and fire esl:refresh event by default.
    */
   protected override onShow(params: ESLPopupActionParams): void {
-    const wasOpened = this.open;
-    if (wasOpened) {
+    if (this.wasOpened) {
       this.beforeOnHide(params);
       this.afterOnHide(params);
     }
@@ -222,7 +221,7 @@ export class ESLPopup extends ESLToggleable {
     this.style.visibility = 'hidden'; // eliminates the blinking of the popup at the previous position
 
     // running as a separate task solves the problem with incorrect positioning on the first showing
-    if (wasOpened) this.afterOnShow(params);
+    if (this.wasOpened) this.afterOnShow(params);
     else afterNextRender(() => this.afterOnShow(params));
 
     // Autofocus logic

diff --git a/src/modules/esl-toggleable/core/esl-toggleable.ts b/src/modules/esl-toggleable/core/esl-toggleable.ts
@@ -132,6 +132,12 @@ export class ESLToggleable extends ESLBaseElement {
   /** Inner state */
   private _open: boolean = false;
 
+  /**
+   * Marker of last opened state.
+   * @deprecated and will be removed in 5.0.0 (`this.open` will be moved inside `onShow` and `onHide` methods)
+   */
+  protected wasOpened: boolean = false;
+
   /** Inner show/hide task manager instance */
   protected _task: DelayedTask = new DelayedTask();
   /** Marker for current hover listener state */
@@ -226,6 +232,8 @@ export class ESLToggleable extends ESLBaseElement {
     if (!this.shouldShow(params)) return;
     if (!params.silent && !this.$$fire(this.BEFORE_SHOW_EVENT, {detail: {params}})) return;
     this.activator = params.activator;
+    this.wasOpened = this.open;
+    this.open = true;
     this.onShow(params);
     if (!params.silent) this.$$fire(this.SHOW_EVENT, {detail: {params}, cancelable: false});
   }
@@ -234,6 +242,8 @@ export class ESLToggleable extends ESLBaseElement {
     Object.defineProperty(params, 'action', {value: 'hide', writable: false});
     if (!this.shouldHide(params)) return;
     if (!params.silent && !this.$$fire(this.BEFORE_HIDE_EVENT, {detail: {params}})) return;
+    this.wasOpened = this.open;
+    this.open = false;
     this.onHide(params);
     this.bindOutsideEventTracking(false);
     if (!params.silent) this.$$fire(this.HIDE_EVENT, {detail: {params}, cancelable: false});
@@ -260,7 +270,6 @@ export class ESLToggleable extends ESLBaseElement {
    * Adds CSS classes, update a11y and fire {@link ESLToggleable.REFRESH_EVENT} event by default.
    */
   protected onShow(params: ESLToggleableActionParams): void {
-    this.open = true;
     CSSClassUtils.add(this, this.activeClass);
     CSSClassUtils.add(document.body, this.bodyClass, this);
     if (this.containerActiveClass) {
@@ -293,7 +302,6 @@ export class ESLToggleable extends ESLBaseElement {
    * Removes CSS classes and update a11y by default.
    */
   protected onHide(params: ESLToggleableActionParams): void {
-    this.open = false;
     CSSClassUtils.remove(this, this.activeClass);
     CSSClassUtils.remove(document.body, this.bodyClass, this);
     if (this.containerActiveClass) {