feat: !revert back esl prefix for events

Due to low specificity and high risk of conflicts of plain events
like show / hide / refresh events were modified with esl prefix.

BREAKING CHANGE:
 events of BasePopup now have esl prefix
('esl:hide' / 'esl:show' / 'esl:before:hide' / 'esl:before:show')

 events of Trigger now have esl prefix:  'esl:change:active'

 events of Panel now have esl prefix: 'esl:after:hide' / 'esl:after:show'

src/modules/draft/esl-carousel/plugin/esl-carousel-autoplay.plugin.ts

@@ -33,7 +33,7 @@ export class ESLCarouselAutoplayPlugin extends ESLCarouselPlugin {
     this.carousel.addEventListener('mouseout', this._onInteract);
     this.carousel.addEventListener('focusin', this._onInteract);
     this.carousel.addEventListener('focusout', this._onInteract);
-    this.carousel.addEventListener('slide:changed', this._onInteract);
+    this.carousel.addEventListener('esl:slide:changed', this._onInteract);
     this.start();
     // console.log('Auto-advance plugin attached successfully to ', this.carousel);
   }
@@ -42,7 +42,7 @@ export class ESLCarouselAutoplayPlugin extends ESLCarouselPlugin {
     this.carousel.removeEventListener('mouseout', this._onInteract);
     this.carousel.removeEventListener('focusin', this._onInteract);
     this.carousel.removeEventListener('focusout', this._onInteract);
-    this.carousel.removeEventListener('slide:changed', this._onInteract);
+    this.carousel.removeEventListener('esl:slide:changed', this._onInteract);
     this.stop();
     // console.log('Auto-advance plugin detached successfully from ', this.carousel);
   }
@@ -84,7 +84,7 @@ export class ESLCarouselAutoplayPlugin extends ESLCarouselPlugin {
       case 'focusout':
         this.start();
         return;
-      case 'slide:changed':
+      case 'esl:slide:changed':
         this.reset();
         return;
     }

src/modules/draft/esl-carousel/plugin/esl-carousel-dots.plugin.ts

@@ -16,12 +16,12 @@ export class ESLCarouselDotsPlugin extends ESLCarouselPlugin {
 
   public bind() {
     this.rerender();
-    this.carousel.addEventListener('slide:changed', this._onUpdate);
+    this.carousel.addEventListener('esl:slide:changed', this._onUpdate);
   }
 
   public unbind() {
     this.innerHTML = '';
-    this.carousel.removeEventListener('slide:changed', this._onUpdate);
+    this.carousel.removeEventListener('esl:slide:changed', this._onUpdate);
   }
 
   public rerender() {

src/modules/draft/esl-carousel/plugin/esl-carousel-link.plugin.ts

@@ -31,16 +31,16 @@ export class ESLCarouselLinkPlugin extends ESLCarouselPlugin {
     if (!(this.target instanceof ESLCarousel)) return;
 
     if (this.direction === 'both' || this.direction === 'reverse') {
-      this.target.addEventListener('slide:changed', this._onSlideChange);
+      this.target.addEventListener('esl:slide:changed', this._onSlideChange);
     }
     if (this.direction === 'both' || this.direction === 'target') {
-      this.carousel.addEventListener('slide:changed', this._onSlideChange);
+      this.carousel.addEventListener('esl:slide:changed', this._onSlideChange);
     }
   }
 
   public unbind() {
-    this.target && this.target.removeEventListener('slide:changed', this._onSlideChange);
-    this.carousel && this.carousel.removeEventListener('slide:changed', this._onSlideChange);
+    this.target && this.target.removeEventListener('esl:slide:changed', this._onSlideChange);
+    this.carousel && this.carousel.removeEventListener('esl:slide:changed', this._onSlideChange);
   }
 
   protected _onSlideChange(e: CustomEvent) {

src/modules/esl-base-element/core/esl-base-element.ts

@@ -25,17 +25,29 @@ export abstract class ESLBaseElement extends HTMLElement {
 
   /**
    * Dispatch component custom event.
-   * Event bubbles and is cancelable by default, use {@param eventInit} to override that.
+   * Uses 'esl:' prefix for event name, overridable to customize event namespaces.
    * @param eventName - event name
    * @param [eventInit] - custom event init. See {@link CustomEventInit}
+   * @see ESLBaseElement.$$fire
    */
   public $$fire(eventName: string, eventInit?: CustomEventInit): boolean {
+    return ESLBaseElement.$$fire(this, 'esl:' + eventName, eventInit);
+  }
+
+  /**
+   * Dispatch custom event.
+   * Event bubbles and is cancelable by default, use {@param eventInit} to override that.
+   * @param el - element target
+   * @param eventName - event name
+   * @param [eventInit] - custom event init. See {@link CustomEventInit}
+   */
+  protected static $$fire(el: ESLBaseElement, eventName: string, eventInit?: CustomEventInit) {
     const init = Object.assign({
       bubbles: true,
       composed: true,
       cancelable: true
     }, eventInit || {});
-    return this.dispatchEvent(new CustomEvent(eventName, init));
+    return el.dispatchEvent(new CustomEvent(eventName, init));
   }
 
   /**

src/modules/esl-image/core/esl-image.ts

@@ -300,7 +300,7 @@ export class ESLImage extends ESLBaseElement {
   }
 
   public $$fire(eventName: string, eventInit: CustomEventInit = {bubbles: false}): boolean {
-    return super.$$fire(eventName, eventInit);
+    return ESLBaseElement.$$fire(this, eventName, eventInit);
   }
 
   public static isEmptyImage(src: string) {

src/modules/esl-media/README.md

@@ -1,6 +1,6 @@
 # [ESL](../../../README.md) Media
 
-Version: *1.0.0-alpha*.
+Version: *1.0.0*.
 
 Authors: *Alexey Stsefanovich (ala'n)*, *Yuliya Adamskaya*, *Julia Murashko*.
 

src/modules/esl-media/core/esl-media.ts

@@ -344,7 +344,7 @@ export class ESLMedia extends ESLBaseElement {
 
   public $$fire(eventName: string, eventInit?: CustomEventInit): boolean {
     const name = (this.constructor as typeof ESLMedia).eventNs + eventName;
-    return super.$$fire(name, eventInit);
+    return ESLBaseElement.$$fire(this, name, eventInit);
   }
 }
 

src/modules/esl-panel/core/esl-panel-stack.ts

@@ -30,14 +30,14 @@ export class ESLPanelStack extends ESLBaseElement {
   }
 
   protected bindEvents() {
-    this.addEventListener('show', this._onShowPanel);
-    this.addEventListener('before:hide', this._onBeforeHide);
+    this.addEventListener('esl:show', this._onShowPanel);
+    this.addEventListener('esl:before:hide', this._onBeforeHide);
     this.addEventListener('transitionend', this._onTransitionEnd);
   }
 
   protected unbindEvents() {
-    this.removeEventListener('show', this._onShowPanel);
-    this.removeEventListener('before:hide', this._onBeforeHide);
+    this.removeEventListener('esl:show', this._onShowPanel);
+    this.removeEventListener('esl:before:hide', this._onBeforeHide);
     this.removeEventListener('transitionend', this._onTransitionEnd);
   }
 

src/modules/esl-scrollable-tabs/core/esl-scrollable-tabs.ts

@@ -24,7 +24,7 @@ export class ESLScrollableTabs extends ESLTabsContainer {
     this.addEventListener('click', this._onClick, false);
     this.$list?.addEventListener('scroll', this._onScroll, {passive: true});
     this.addEventListener('focusin', this._onFocus);
-    this.addEventListener('change:active', this._onTriggerStateChange);
+    this.addEventListener('esl:change:active', this._onTriggerStateChange);
     window.addEventListener('resize', this.onResize);
   }
 
@@ -33,7 +33,7 @@ export class ESLScrollableTabs extends ESLTabsContainer {
     this.removeEventListener('click', this._onClick, false);
     this.$list?.removeEventListener('scroll', this._onScroll);
     this.removeEventListener('focusin', this._onFocus);
-    this.removeEventListener('change:active', this._onTriggerStateChange);
+    this.removeEventListener('esl:change:active', this._onTriggerStateChange);
     window.removeEventListener('resize', this.onResize);
   }
 

src/modules/esl-trigger/core/esl-trigger.ts

@@ -107,8 +107,8 @@ export class ESLTrigger extends ESLBaseElement {
       this.attachEventListener(this.hideEvent, this._onHideEvent);
     }
     const popupClass = this._popup.constructor as typeof ESLBasePopup;
-    this.popup.addEventListener('show', this._onPopupStateChange);
-    this.popup.addEventListener('hide', this._onPopupStateChange);
+    this.popup.addEventListener('esl:show', this._onPopupStateChange);
+    this.popup.addEventListener('esl:hide', this._onPopupStateChange);
 
     this.addEventListener('keydown', this._onKeydown);
   }
@@ -118,8 +118,8 @@ export class ESLTrigger extends ESLBaseElement {
     if (!this.popup) return;
 
     const popupClass = this._popup.constructor as typeof ESLBasePopup;
-    this.popup.removeEventListener('show', this._onPopupStateChange);
-    this.popup.removeEventListener('hide', this._onPopupStateChange);
+    this.popup.removeEventListener('esl:show', this._onPopupStateChange);
+    this.popup.removeEventListener('esl:hide', this._onPopupStateChange);
 
     this.removeEventListener('keydown', this._onKeydown);
   }