@soyfri/template 1.0.10-beta.1 → 1.0.10-beta.3

package/dist/assets/ts/_utils/EventHandlerUtil.d.ts

@@ -10,7 +10,11 @@ export declare class EventHandlerUtil {
             [handlerId: string]: EventMeta;
         };
     };
+    private static setEventMetasByName;
+    private static getEventMetaByName;
     private static setEventMetaByNameAndHandlerId;
+    private static getEventMetaByHandlerId;
+    private static setFiredByNameAndHandlerId;
     private static addEvent;
     private static removeEvent;
     static trigger(element: HTMLElement, name: string, target?: any, _e?: Event): boolean;

package/dist/assets/ts/_utils/EventHandlerUtil.js

@@ -2,6 +2,14 @@ import { DataUtil } from './_DataUtil';
 import { getUniqueIdWithPrefix } from './_TypesHelpers';
 export class EventHandlerUtil {
     static store = {};
+    // @ts-ignore
+    static setEventMetasByName(name, handlers) {
+        EventHandlerUtil.store[name] = handlers;
+    }
+    // @ts-ignore
+    static getEventMetaByName(name) {
+        return EventHandlerUtil.store[name];
+    }
     static setEventMetaByNameAndHandlerId(name, handlerId, meta) {
         if (EventHandlerUtil.store[name]) {
             EventHandlerUtil.store[name][handlerId] = meta;
@@ -10,6 +18,23 @@ export class EventHandlerUtil {
         EventHandlerUtil.store[name] = {};
         EventHandlerUtil.store[name][handlerId] = meta;
     }
+    //@ts-ignore
+    static getEventMetaByHandlerId(name, handlerId) {
+        const handlersIds = EventHandlerUtil.store[name];
+        if (!handlersIds) {
+            return;
+        }
+        return handlersIds[handlerId];
+    }
+    //@ts-ignore
+    static setFiredByNameAndHandlerId(name, handerId, fired) {
+        const meta = EventHandlerUtil.getEventMetaByHandlerId(name, handerId);
+        if (!meta) {
+            return;
+        }
+        meta.fired = fired;
+        EventHandlerUtil.setEventMetaByNameAndHandlerId(name, handerId, meta);
+    }
     static addEvent(element, name, callback, one = false) {
         const handlerId = getUniqueIdWithPrefix('event');
         const data = DataUtil.get(element, name);

package/dist/assets/ts/_utils/EventHandlerUtil.ts

@@ -1,5 +1,5 @@
-import {DataUtil} from './_DataUtil'
-import {getUniqueIdWithPrefix} from './_TypesHelpers'
+import { DataUtil } from './_DataUtil'
+import { getUniqueIdWithPrefix } from './_TypesHelpers'
 
 export interface EventMeta {
   name: string
@@ -14,6 +14,24 @@ export class EventHandlerUtil {
       [handlerId: string]: EventMeta
     }
   } = {}
+  // @ts-ignore
+  private static setEventMetasByName(
+    name: string,
+    handlers: {
+      [handlerId: string]: EventMeta
+    }
+  ): void {
+    EventHandlerUtil.store[name] = handlers
+  }
+  // @ts-ignore
+  private static getEventMetaByName(name: string):
+    | {
+      [handlerId: string]: EventMeta
+    }
+    | undefined {
+    return EventHandlerUtil.store[name]
+  }
+
 
   private static setEventMetaByNameAndHandlerId(
     name: string,
@@ -28,6 +46,25 @@ export class EventHandlerUtil {
     EventHandlerUtil.store[name][handlerId] = meta
   }
 
+  //@ts-ignore
+  private static getEventMetaByHandlerId(name: string, handlerId: string): EventMeta | undefined {
+    const handlersIds = EventHandlerUtil.store[name]
+    if (!handlersIds) {
+      return
+    }
+    return handlersIds[handlerId]
+  }
+
+    //@ts-ignore
+  private static setFiredByNameAndHandlerId(name: string, handerId: string, fired: boolean): void {
+    const meta = EventHandlerUtil.getEventMetaByHandlerId(name, handerId)
+    if (!meta) {
+      return
+    }
+
+    meta.fired = fired
+    EventHandlerUtil.setEventMetaByNameAndHandlerId(name, handerId, meta)
+  }
 
   private static addEvent(
     element: HTMLElement,

package/dist/assets/ts/components/MenuComponent.d.ts

@@ -30,6 +30,7 @@ declare class MenuComponent {
     private _isItemSubShown;
     private _isItemDropdownPermanent;
     private _isItemParentShown;
+    private _isItemSubElement;
     private _hasItemSub;
     private _getItemLinkElement;
     private _getItemToggleElement;
@@ -41,6 +42,7 @@ declare class MenuComponent {
     private _hideAccordion;
     private _hideAccordions;
     private _reset;
+    private _destroy;
     private _update;
     private _hide;
     private _show;

package/dist/assets/ts/components/MenuComponent.js

@@ -262,6 +262,10 @@ class MenuComponent {
     _isItemParentShown = (item) => {
         return getElementParents(item, '.menu-item.show').length > 0;
     };
+    //@ts-ignore
+    _isItemSubElement = (item) => {
+        return item.classList.contains('menu-sub');
+    };
     // Test if item has sub
     _hasItemSub = (item) => {
         return item.classList.contains('menu-item') && item.hasAttribute('data-kt-menu-trigger');
@@ -466,6 +470,8 @@ class MenuComponent {
             }
         } // updated
     };
+    //@ts-ignore
+    _destroy = () => { };
     // Update all item state classes if item sub type changed
     _update = () => {
         const items = this.element.querySelectorAll('.menu-item[data-kt-menu-trigger]');
@@ -759,6 +765,8 @@ class MenuComponent {
                     const item = menuItems[i];
                     const menuObj = MenuComponent.getInstance(item);
                     if (menuObj && menuObj.getItemSubType(item) === 'dropdown') {
+                        //@ts-ignore
+                        const menu = menuObj.getElement();
                         const sub = menuObj.getItemSubElement(item);
                         if (item === e.target || item.contains(e.target)) {
                             continue;

package/dist/assets/ts/components/MenuComponent.ts

@@ -1,4 +1,4 @@
-import {createPopper, VirtualElement} from '@popperjs/core'
+import { createPopper, VirtualElement } from '@popperjs/core'
 import {
   getElementChild,
   getElementParents,
@@ -352,7 +352,10 @@ class MenuComponent {
   private _isItemParentShown = (item: HTMLElement) => {
     return getElementParents(item, '.menu-item.show').length > 0
   }
-
+ //@ts-ignore
+  private _isItemSubElement = (item: HTMLElement) => {
+    return item.classList.contains('menu-sub')
+  }
   // Test if item has sub
   private _hasItemSub = (item: HTMLElement) => {
     return item.classList.contains('menu-item') && item.hasAttribute('data-kt-menu-trigger')
@@ -599,7 +602,8 @@ class MenuComponent {
     } // updated
   }
 
-
+  //@ts-ignore
+  private _destroy = () => { }
   // Update all item state classes if item sub type changed
   private _update = () => {
     const items = this.element.querySelectorAll('.menu-item[data-kt-menu-trigger]')
@@ -952,6 +956,8 @@ class MenuComponent {
           const item = menuItems[i] as HTMLElement
           const menuObj = MenuComponent.getInstance(item) as MenuComponent
           if (menuObj && menuObj.getItemSubType(item) === 'dropdown') {
+            //@ts-ignore
+            const menu = menuObj.getElement()
             const sub = menuObj.getItemSubElement(item) as HTMLElement
             if (item === e.target || item.contains(e.target as HTMLElement)) {
               continue
@@ -1078,4 +1084,4 @@ class MenuComponent {
   }
 }
 
-export {MenuComponent, defaultMenuOptions}
+export { MenuComponent, defaultMenuOptions }

package/dist/assets/ts/components/_DrawerComponent.d.ts

@@ -32,6 +32,8 @@ declare class DrawerComponent {
     private _show;
     private _createOverlay;
     private _deleteOverlay;
+    private _getDirection;
+    private _getWidth;
     toggle: () => void;
     show: () => void;
     hide: () => void;

package/dist/assets/ts/components/_DrawerComponent.js

@@ -192,6 +192,18 @@ class DrawerComponent {
             this.overlayElement.parentNode.removeChild(this.overlayElement);
         }
     };
+    //@ts-ignore
+    _getDirection = () => {
+        return String(this._getOption('direction')) === 'left' ? 'left' : 'right';
+    };
+    //@ts-ignore
+    _getWidth = () => {
+        let width = this._getOption('width');
+        if (width && width === 'auto') {
+            width = getCSS(this.element, 'width');
+        }
+        return width;
+    };
     ///////////////////////
     // ** Public API  ** //
     ///////////////////////

package/dist/assets/ts/components/_DrawerComponent.ts

@@ -237,8 +237,19 @@ class DrawerComponent {
       this.overlayElement.parentNode.removeChild(this.overlayElement)
     }
   }
+  //@ts-ignore
+  private _getDirection = () => {
+    return String(this._getOption('direction')) === 'left' ? 'left' : 'right'
+  }
+  //@ts-ignore
+  private _getWidth = () => {
+    let width = this._getOption('width')
+    if (width && width === 'auto') {
+      width = getCSS(this.element, 'width')
+    }
 
-
+    return width
+  }
   ///////////////////////
   // ** Public API  ** //
   ///////////////////////

package/dist/assets/ts/components/_ImageInputComponent.d.ts

@@ -27,6 +27,7 @@ declare class ImageInputComponent {
     private handlers;
     private _change;
     private _cancel;
+    private _remove;
     getInputElement(): HTMLInputElement | null;
     getElement(): HTMLElement;
     on: (name: string, handler: Function) => void;

package/dist/assets/ts/components/_ImageInputComponent.js

@@ -88,6 +88,27 @@ class ImageInputComponent {
         // Fire canceled event
         EventHandlerUtil.trigger(this.element, 'kt.imageinput.canceled', e);
     };
+    //@ts-ignore
+    _remove = (e) => {
+        e.preventDefault();
+        // Fire remove event
+        if (EventHandlerUtil.trigger(this.element, 'kt.imageinput.remove', e) === false) {
+            return;
+        }
+        this.element.classList.remove('image-input-changed');
+        this.element.classList.add('image-input-empty');
+        if (this.wrapperElement) {
+            this.wrapperElement.style.setProperty('background-image', 'none');
+        }
+        if (this.inputElement) {
+            this.inputElement.value = '';
+        }
+        if (this.hiddenElement !== null) {
+            this.hiddenElement.value = '1';
+        }
+        // Fire removed event
+        EventHandlerUtil.trigger(this.element, 'kt.imageinput.removed', e);
+    };
     ///////////////////////
     // ** Public API  ** //
     ///////////////////////

package/dist/assets/ts/components/_ImageInputComponent.ts

@@ -120,8 +120,33 @@ class ImageInputComponent {
     // Fire canceled event
     EventHandlerUtil.trigger(this.element, 'kt.imageinput.canceled', e)
   }
+  
+  //@ts-ignore
+  private _remove = (e: Event) => {
+    e.preventDefault()
+
+    // Fire remove event
+    if (EventHandlerUtil.trigger(this.element, 'kt.imageinput.remove', e) === false) {
+      return
+    }
 
+    this.element.classList.remove('image-input-changed')
+    this.element.classList.add('image-input-empty')
+    if (this.wrapperElement) {
+      this.wrapperElement.style.setProperty('background-image', 'none')
+    }
 
+    if (this.inputElement) {
+      this.inputElement.value = ''
+    }
+
+    if (this.hiddenElement !== null) {
+      this.hiddenElement.value = '1'
+    }
+
+    // Fire removed event
+    EventHandlerUtil.trigger(this.element, 'kt.imageinput.removed', e)
+  }
   ///////////////////////
   // ** Public API  ** //
   ///////////////////////

package/dist/assets/ts/components/_PasswordMeterComponent.d.ts

@@ -34,6 +34,7 @@ declare class PasswordMeterComponent {
     constructor(_element: HTMLElement, _options: IPasswordMeterOptions, _queries: IPasswordMeterQueries);
     private handlers;
     private visitbility;
+    private checkScore;
     private checkLength;
     private checkLowerCase;
     private checkUppercase;

package/dist/assets/ts/components/_PasswordMeterComponent.js

@@ -66,6 +66,10 @@ class PasswordMeterComponent {
             this.inputElement.focus();
         }
     }
+    //@ts-ignore
+    checkScore() {
+        return 0;
+    }
     checkLength() {
         if (this.inputElement) {
             return this.inputElement.value.length >= this.options.minLength; // 20 score

package/dist/assets/ts/components/_PasswordMeterComponent.ts

@@ -102,8 +102,10 @@ class PasswordMeterComponent {
       this.inputElement.focus()
     }
   }
-
-
+  //@ts-ignore
+  private checkScore(): number {
+    return 0
+  }
 
   private checkLength(): boolean {
     if (this.inputElement) {

package/dist/assets/ts/components/_StepperComponent.d.ts

@@ -21,10 +21,13 @@ declare class StepperComponent {
     private _goTo;
     private initHandlers;
     private _getStepDirection;
+    private getStepContent;
     private getLastStepIndex;
+    private getTotalStepsNumber;
     private refreshUI;
     private isLastStep;
     private isFirstStep;
+    private isBetweenStep;
     goto: (index: number) => void;
     goNext: () => void;
     goPrev: () => void;

package/dist/assets/ts/components/_StepperComponent.js

@@ -80,9 +80,24 @@ class StepperComponent {
     _getStepDirection = (index) => {
         return index > this.currentStepIndex ? 'next' : 'previous';
     };
+    //@ts-ignore
+    getStepContent = (index) => {
+        const content = this.element.querySelectorAll('[data-kt-stepper-element="content"]');
+        if (!content) {
+            return false;
+        }
+        if (content[index - 1]) {
+            return content[index - 1];
+        }
+        return false;
+    };
     getLastStepIndex = () => {
         return this.totalStepsNumber;
     };
+    //@ts-ignore
+    getTotalStepsNumber = () => {
+        return this.totalStepsNumber;
+    };
     refreshUI = () => {
         let state = '';
         if (this.isLastStep()) {
@@ -137,6 +152,10 @@ class StepperComponent {
     isFirstStep = () => {
         return this.currentStepIndex === 1;
     };
+    //@ts-ignore
+    isBetweenStep = () => {
+        return this.isLastStep() === false && this.isFirstStep() === false;
+    };
     //   ///////////////////////
     //   // ** Public API  ** //
     //   ///////////////////////

package/dist/assets/ts/components/_StepperComponent.ts

@@ -117,12 +117,27 @@ class StepperComponent {
     return index > this.currentStepIndex ? 'next' : 'previous'
   }
 
+ //@ts-ignore
+  private getStepContent = (index: number) => {
+    const content = this.element.querySelectorAll('[data-kt-stepper-element="content"]')
+    if (!content) {
+      return false
+    }
+
+    if (content[index - 1]) {
+      return content[index - 1]
+    }
 
+    return false
+  }
   private getLastStepIndex = () => {
     return this.totalStepsNumber
   }
 
-
+ //@ts-ignore
+  private getTotalStepsNumber = () => {
+    return this.totalStepsNumber
+  }
   private refreshUI = () => {
     let state = ''
 
@@ -190,7 +205,11 @@ class StepperComponent {
   private isFirstStep = () => {
     return this.currentStepIndex === 1
   }
-
+  
+ //@ts-ignore
+  private isBetweenStep = () => {
+    return this.isLastStep() === false && this.isFirstStep() === false
+  }
 
   //   ///////////////////////
   //   // ** Public API  ** //
@@ -311,4 +330,4 @@ class StepperComponent {
   }
 }
 
-export {StepperComponent, defaultStepperOptions}
+export { StepperComponent, defaultStepperOptions }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@soyfri/template",
-  "version": "1.0.10-beta.1",
+  "version": "1.0.10-beta.3",
   "description": "Metronic template components and utilities for Fri projects",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",