@soyfri/template 1.0.6 → 1.0.7-beta.0

package/README.md

@@ -3,6 +3,14 @@
 ## Description
 This package contains a Metronic template specifically designed for FRI frontend projects. It provides a set of pre-built components, styles, and utilities to streamline frontend development.
 
+## Build
+
+At this point, if the dependencies are updated, the whole project can break, be careful.
+
+```sh
+npm install --legacy-peer-deps
+```
+
 ## Installation
 ```bash
 npm install @soyfri/template

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

@@ -4,7 +4,7 @@ declare function getCSS(el: HTMLElement, styleProp: string): string;
 declare function getCSSVariableValue(variableName: string): string;
 declare function getElementActualCss(el: HTMLElement, prop: any, cache: boolean): number | undefined;
 declare function getElementActualHeight(el: HTMLElement): number | undefined;
-declare function getElementActualWidth(el: HTMLElement, cache?: boolean): number | undefined;
+declare function getElementActualWidth(el: HTMLElement, _cache?: boolean): number | undefined;
 declare function getElementIndex(element: HTMLElement): number;
 declare function getElementMatches(element: HTMLElement, selector: string): boolean;
 declare function getElementOffset(el: HTMLElement): OffsetModel;

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

@@ -52,7 +52,7 @@ function getElementActualCss(el, prop, cache) {
 function getElementActualHeight(el) {
     return getElementActualCss(el, 'height', false);
 }
-function getElementActualWidth(el, cache) {
+function getElementActualWidth(el, _cache) {
     return getElementActualCss(el, 'width', false);
 }
 function getElementIndex(element) {

package/dist/assets/ts/_utils/DomHelpers.ts

@@ -66,7 +66,7 @@ function getElementActualHeight(el: HTMLElement) {
   return getElementActualCss(el, 'height', false)
 }
 
-function getElementActualWidth(el: HTMLElement, cache?: boolean) {
+function getElementActualWidth(el: HTMLElement, _cache?: boolean) {
   return getElementActualCss(el, 'width', false)
 }
 

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

@@ -10,14 +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;
+    static trigger(element: HTMLElement, name: string, target?: any, _e?: Event): boolean;
     static on: (element: HTMLElement, name: string, callBack: Function) => void;
     static one(element: HTMLElement, name: string, callBack: Function): void;
     static off(element: HTMLElement, name: string, handerId: string): void;

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

@@ -2,12 +2,6 @@ import { DataUtil } from './_DataUtil';
 import { getUniqueIdWithPrefix } from './_TypesHelpers';
 export class EventHandlerUtil {
     static store = {};
-    static setEventMetasByName(name, handlers) {
-        EventHandlerUtil.store[name] = handlers;
-    }
-    static getEventMetaByName(name) {
-        return EventHandlerUtil.store[name];
-    }
     static setEventMetaByNameAndHandlerId(name, handlerId, meta) {
         if (EventHandlerUtil.store[name]) {
             EventHandlerUtil.store[name][handlerId] = meta;
@@ -23,14 +17,6 @@ export class EventHandlerUtil {
         }
         return handlersIds[handlerId];
     }
-    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);
@@ -54,7 +40,7 @@ export class EventHandlerUtil {
         }
         delete EventHandlerUtil.store[name][handerId];
     }
-    static trigger(element, name, target, e) {
+    static trigger(element, name, target, _e) {
         let returnValue = true;
         if (!DataUtil.has(element, name)) {
             return returnValue;

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

@@ -15,23 +15,6 @@ export class EventHandlerUtil {
     }
   } = {}
 
-  private static setEventMetasByName(
-    name: string,
-    handlers: {
-      [handlerId: string]: EventMeta
-    }
-  ): void {
-    EventHandlerUtil.store[name] = handlers
-  }
-
-  private static getEventMetaByName(name: string):
-    | {
-        [handlerId: string]: EventMeta
-      }
-    | undefined {
-    return EventHandlerUtil.store[name]
-  }
-
   private static setEventMetaByNameAndHandlerId(
     name: string,
     handlerId: string,
@@ -53,16 +36,6 @@ export class EventHandlerUtil {
     return handlersIds[handlerId]
   }
 
-  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,
     name: string,
@@ -97,7 +70,7 @@ export class EventHandlerUtil {
     delete EventHandlerUtil.store[name][handerId]
   }
 
-  public static trigger(element: HTMLElement, name: string, target?: any, e?: Event): boolean {
+  public static trigger(element: HTMLElement, name: string, target?: any, _e?: Event): boolean {
     let returnValue = true
     if (!DataUtil.has(element, name)) {
       return returnValue

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

@@ -30,7 +30,6 @@ declare class MenuComponent {
     private _isItemSubShown;
     private _isItemDropdownPermanent;
     private _isItemParentShown;
-    private _isItemSubElement;
     private _hasItemSub;
     private _getItemLinkElement;
     private _getItemToggleElement;
@@ -42,7 +41,6 @@ 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,10 +262,6 @@ class MenuComponent {
     _isItemParentShown = (item) => {
         return getElementParents(item, '.menu-item.show').length > 0;
     };
-    // Test of it is item sub element
-    _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');
@@ -470,8 +466,6 @@ class MenuComponent {
             }
         } // updated
     };
-    // TODO: not done
-    _destroy = () => { };
     // Update all item state classes if item sub type changed
     _update = () => {
         const items = this.element.querySelectorAll('.menu-item[data-kt-menu-trigger]');
@@ -522,7 +516,7 @@ class MenuComponent {
         }
     };
     // Mouseout handle
-    _mouseout = (element, e) => {
+    _mouseout = (element, _e) => {
         const item = this._getItemElement(element);
         if (!item) {
             return;
@@ -539,7 +533,7 @@ class MenuComponent {
         DataUtil.set(item, 'timeout', timeout);
     };
     // Mouseover handle
-    _mouseover = (element, e) => {
+    _mouseover = (element, _e) => {
         const item = this._getItemElement(element);
         if (!item) {
             return;
@@ -558,7 +552,7 @@ class MenuComponent {
         this._show(item);
     };
     // Dismiss handler
-    _dismiss = (element, e) => {
+    _dismiss = (element, _e) => {
         const item = this._getItemElement(element);
         if (!item) {
             return;
@@ -765,8 +759,6 @@ class MenuComponent {
                     const item = menuItems[i];
                     const menuObj = MenuComponent.getInstance(item);
                     if (menuObj && menuObj.getItemSubType(item) === 'dropdown') {
-                        // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                        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

@@ -353,11 +353,6 @@ class MenuComponent {
     return getElementParents(item, '.menu-item.show').length > 0
   }
 
-  // Test of it is item sub element
-  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')
@@ -604,8 +599,6 @@ class MenuComponent {
     } // updated
   }
 
-  // TODO: not done
-  private _destroy = () => {}
 
   // Update all item state classes if item sub type changed
   private _update = () => {
@@ -665,7 +658,7 @@ class MenuComponent {
   }
 
   // Mouseout handle
-  private _mouseout = (element: HTMLElement, e: MouseEvent) => {
+  private _mouseout = (element: HTMLElement, _e: MouseEvent) => {
     const item = this._getItemElement(element)
     if (!item) {
       return
@@ -686,7 +679,7 @@ class MenuComponent {
   }
 
   // Mouseover handle
-  private _mouseover = (element: HTMLElement, e: MouseEvent) => {
+  private _mouseover = (element: HTMLElement, _e: MouseEvent) => {
     const item = this._getItemElement(element)
     if (!item) {
       return
@@ -709,7 +702,7 @@ class MenuComponent {
   }
 
   // Dismiss handler
-  private _dismiss = (element: HTMLElement, e: Event) => {
+  private _dismiss = (element: HTMLElement, _e: Event) => {
     const item = this._getItemElement(element)
     if (!item) {
       return
@@ -959,8 +952,6 @@ class MenuComponent {
           const item = menuItems[i] as HTMLElement
           const menuObj = MenuComponent.getInstance(item) as MenuComponent
           if (menuObj && menuObj.getItemSubType(item) === 'dropdown') {
-            // eslint-disable-next-line @typescript-eslint/no-unused-vars
-            const menu = menuObj.getElement()
             const sub = menuObj.getItemSubElement(item) as HTMLElement
             if (item === e.target || item.contains(e.target as HTMLElement)) {
               continue

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

@@ -32,8 +32,6 @@ 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,16 +192,6 @@ class DrawerComponent {
             this.overlayElement.parentNode.removeChild(this.overlayElement);
         }
     };
-    _getDirection = () => {
-        return String(this._getOption('direction')) === 'left' ? 'left' : 'right';
-    };
-    _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

@@ -238,18 +238,6 @@ class DrawerComponent {
     }
   }
 
-  private _getDirection = () => {
-    return String(this._getOption('direction')) === 'left' ? 'left' : 'right'
-  }
-
-  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/_FeedbackComponent.d.ts

@@ -24,9 +24,9 @@ declare class FeedbackComponent {
     one: (name: string, handler: Function) => void;
     off: (name: string, handerId: string) => void;
     trigger: (name: string, event: Event) => boolean;
-    static createInstances(selector: string): void;
-    static hasInstace(element: HTMLElement): void;
-    static getInstance(element: HTMLElement): void;
-    static bootstrap(attr?: string): void;
+    static createInstances(_selector: string): void;
+    static hasInstace(_element: HTMLElement): void;
+    static getInstance(_element: HTMLElement): void;
+    static bootstrap(_attr?: string): void;
 }
 export { FeedbackComponent, defaultFeedbackOptions };

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

@@ -92,17 +92,17 @@ class FeedbackComponent {
         return EventHandlerUtil.trigger(this.element, name, event);
     };
     // Create Instances
-    static createInstances(selector) {
+    static createInstances(_selector) {
         throw new Error('not implemented');
     }
     // Static methods
-    static hasInstace(element) {
+    static hasInstace(_element) {
         throw new Error('not implemented');
     }
-    static getInstance(element) {
+    static getInstance(_element) {
         throw new Error('not implemented');
     }
-    static bootstrap(attr = '[data-Feedback]') {
+    static bootstrap(_attr = '[data-Feedback]') {
         throw new Error('not implemented');
     }
 }

package/dist/assets/ts/components/_FeedbackComponent.ts

@@ -131,20 +131,20 @@ class FeedbackComponent {
   }
 
   // Create Instances
-  public static createInstances(selector: string) {
+  public static createInstances(_selector: string) {
     throw new Error('not implemented')
   }
 
   // Static methods
-  public static hasInstace(element: HTMLElement) {
+  public static hasInstace(_element: HTMLElement) {
     throw new Error('not implemented')
   }
 
-  public static getInstance(element: HTMLElement) {
+  public static getInstance(_element: HTMLElement ) {
     throw new Error('not implemented')
   }
 
-  public static bootstrap(attr: string = '[data-Feedback]') {
+  public static bootstrap(_attr: string = '[data-Feedback]') {
     throw new Error('not implemented')
   }
 }

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

@@ -27,7 +27,6 @@ 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,26 +88,6 @@ class ImageInputComponent {
         // Fire canceled event
         EventHandlerUtil.trigger(this.element, 'kt.imageinput.canceled', e);
     };
-    _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

@@ -121,31 +121,6 @@ class ImageInputComponent {
     EventHandlerUtil.trigger(this.element, 'kt.imageinput.canceled', e)
   }
 
-  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,7 +34,6 @@ 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,9 +66,6 @@ class PasswordMeterComponent {
             this.inputElement.focus();
         }
     }
-    checkScore() {
-        return 0;
-    }
     checkLength() {
         if (this.inputElement) {
             return this.inputElement.value.length >= this.options.minLength; // 20 score

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

@@ -103,9 +103,7 @@ class PasswordMeterComponent {
     }
   }
 
-  private checkScore(): number {
-    return 0
-  }
+
 
   private checkLength(): boolean {
     if (this.inputElement) {

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

@@ -22,7 +22,7 @@ declare class ScrollComponent {
     static hasInstace(element: HTMLElement): boolean;
     static getInstance(element: HTMLElement): ScrollComponent | undefined;
     static createInstances(selector: string): void;
-    static destroyAll(attr?: string): void;
+    static destroyAll(_attr?: string): void;
     static bootstrap(attr?: string): void;
     static createInstance: (element: HTMLElement, options?: ScrollOptions) => ScrollComponent | undefined;
     static reinitialization(attr?: string): void;

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

@@ -216,7 +216,7 @@ class ScrollComponent {
             }
         });
     }
-    static destroyAll(attr = '[data-kt-scroll="true"]') { }
+    static destroyAll(_attr = '[data-kt-scroll="true"]') { }
     static bootstrap(attr = '[data-kt-scroll="true"]') {
         ScrollComponent.createInstances(attr);
         ScrollComponent.resize();

package/dist/assets/ts/components/_ScrollComponent.ts

@@ -261,7 +261,7 @@ class ScrollComponent {
     })
   }
 
-  public static destroyAll(attr: string = '[data-kt-scroll="true"]') {}
+  public static destroyAll(_attr: string = '[data-kt-scroll="true"]') {}
 
   public static bootstrap(attr: string = '[data-kt-scroll="true"]') {
     ScrollComponent.createInstances(attr)

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

@@ -21,13 +21,10 @@ 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;
@@ -37,7 +34,7 @@ declare class StepperComponent {
     getNextStepIndex: () => number;
     getPassedStepIndex: () => number;
     getPrevStepIndex: () => number;
-    getElement: (index: number) => HTMLElement;
+    getElement: (_index: number) => HTMLElement;
     on: (name: string, handler: Function) => void;
     one: (name: string, handler: Function) => void;
     off: (name: string, handlerId: string) => void;

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

@@ -80,22 +80,9 @@ class StepperComponent {
     _getStepDirection = (index) => {
         return index > this.currentStepIndex ? 'next' : 'previous';
     };
-    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;
     };
-    getTotalStepsNumber = () => {
-        return this.totalStepsNumber;
-    };
     refreshUI = () => {
         let state = '';
         if (this.isLastStep()) {
@@ -150,9 +137,6 @@ class StepperComponent {
     isFirstStep = () => {
         return this.currentStepIndex === 1;
     };
-    isBetweenStep = () => {
-        return this.isLastStep() === false && this.isFirstStep() === false;
-    };
     //   ///////////////////////
     //   // ** Public API  ** //
     //   ///////////////////////
@@ -194,7 +178,7 @@ class StepperComponent {
             return 1;
         }
     };
-    getElement = (index) => {
+    getElement = (_index) => {
         return this.element;
     };
     // Event API

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

@@ -117,26 +117,11 @@ class StepperComponent {
     return index > this.currentStepIndex ? 'next' : 'previous'
   }
 
-  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
   }
 
-  private getTotalStepsNumber = () => {
-    return this.totalStepsNumber
-  }
 
   private refreshUI = () => {
     let state = ''
@@ -206,9 +191,6 @@ class StepperComponent {
     return this.currentStepIndex === 1
   }
 
-  private isBetweenStep = () => {
-    return this.isLastStep() === false && this.isFirstStep() === false
-  }
 
   //   ///////////////////////
   //   // ** Public API  ** //
@@ -259,7 +241,7 @@ class StepperComponent {
     }
   }
 
-  public getElement = (index: number) => {
+  public getElement = (_index: number) => {
     return this.element
   }
 

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

@@ -27,7 +27,7 @@ declare class SwapperComponent {
     one: (name: string, handler: Function) => void;
     off: (name: string, handlerId: string) => void;
     trigger: (name: string, event: Event) => boolean;
-    static getInstance: (el: HTMLElement, componentName?: string) => SwapperComponent | null;
+    static getInstance: (el: HTMLElement, _componentName?: string) => SwapperComponent | null;
     static createInstances: (selector?: string, options?: ISwapperOptions, queries?: ISwapperQueries) => void;
     static createInsance: (selector?: string, options?: ISwapperOptions, queries?: ISwapperQueries) => SwapperComponent | undefined;
     static bootstrap: (selector?: string) => void;

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

@@ -102,7 +102,7 @@ class SwapperComponent {
         return EventHandlerUtil.trigger(this.element, name, event);
     };
     // Static methods
-    static getInstance = (el, componentName = defaultSwapperQueires.componentName) => {
+    static getInstance = (el, _componentName = defaultSwapperQueires.componentName) => {
         const place = SwapperStore.get(el.id);
         if (place) {
             return place;

package/dist/assets/ts/components/_SwapperComponent.ts

@@ -137,7 +137,7 @@ class SwapperComponent {
   // Static methods
   public static getInstance = (
     el: HTMLElement,
-    componentName: string = defaultSwapperQueires.componentName
+    _componentName: string = defaultSwapperQueires.componentName
   ): SwapperComponent | null => {
     const place = SwapperStore.get(el.id)
     if (place) {

package/package.json

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