coer-elements 1.0.2 → 1.0.4

package/Signals/index.ts

@@ -0,0 +1,7 @@
+import { signal } from "@angular/core"; 
+import { Screen } from './../Tools/Screen.class';
+
+export const breakpoint_signal = signal<'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl'>(Screen?.BREAKPOINT || 'xs');
+export const isReady_signal = signal<boolean>(false);
+export const isLoading_signal = signal<boolean>(false);
+export const isModalOpen_signal = signal<boolean>(false);

package/Tools/Files.class.ts

@@ -2,7 +2,7 @@ import { Tools } from ".";
 import * as XLSX from 'xlsx';
 
 export class Files { 
-    private static readonly EXCEL_EXTENSIONS: string[] = ['xls', 'xlsx', 'csv'];
+    public static readonly EXCEL_EXTENSIONS: string[] = ['xls', 'xlsx', 'csv'];
 
     /** Get Extension File */
     public static GetExtension(file: File): string | null {
@@ -99,4 +99,21 @@ export class Files {
         XLSX.utils.book_append_sheet(WORK_BOOK, WORK_SHEET, 'Sheet1');
         XLSX.writeFile(WORK_BOOK, fileName);
     }
+
+
+    /** Convert file to string base64 */
+    public static ConvertToBase64(file: File) {
+        return new Promise<string>(Resolve => {
+            const reader = new FileReader();
+            reader.readAsDataURL(file);
+    
+            reader.onload = () => {
+                Resolve(reader.result?.toString() || '');
+            }
+    
+            reader.onerror = () => {
+                Resolve('');
+            }
+        });
+    } 
 }

package/Tools/Screen.class.ts

@@ -0,0 +1,50 @@
+import { IScreenSize } from "interfaces";
+import { Observable } from "rxjs"; 
+
+export class Screen {
+
+    public static get WINDOW_WIDTH(): number {
+        return window.innerWidth;
+    }
+
+    
+    public static get WINDOW_HEIGHT(): number {
+        return window.innerHeight;
+    }
+
+
+    public static get DEVICE_WIDTH(): number {
+        return window.screen.width;
+    }
+
+
+    public static get DEVICE_HEIGHT(): number {
+        return window.screen.height;
+    }
+
+
+    public static get BREAKPOINT(): 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' {
+        if (window.innerWidth < 576) return 'xs';
+        else if (window.innerWidth >= 576 && window.innerWidth < 768) return 'sm';
+        else if (window.innerWidth >= 768 && window.innerWidth < 992) return 'md';
+        else if (window.innerWidth >= 992 && window.innerWidth < 1200) return 'lg';
+        else if (window.innerWidth >= 1200 && window.innerWidth < 1400) return 'xl';
+        else return 'xxl';
+    }
+
+
+    /** */
+    public static Resize = new Observable<IScreenSize>(subscriber => {
+        window.addEventListener("load", () => {
+            window.dispatchEvent(new Event('resize'));
+        });
+
+        window.onresize = () => {
+            subscriber.next({
+                width: window.innerWidth,
+                height: window.innerHeight,
+                breakpoin: this.BREAKPOINT
+            });
+        }
+    });
+}

package/Tools/index.ts

@@ -1,4 +1,6 @@
 import { Guid } from "guid-typescript";
+import { signal } from "@angular/core"; 
+const reference_signal = signal<any>({});
 
 export const Tools = {
     /** Generate a Guid */
@@ -6,6 +8,7 @@ export const Tools = {
         return `${seed}-${Guid.create().toString()}`;
     },
 
+
     /** Returns true if the value is null or undefined, false otherwise */
     IsNull: (value: any): boolean => {
         if (value === undefined) return true;
@@ -22,6 +25,15 @@ export const Tools = {
     },
 
 
+    /** Returns true if the value is null or undefined or contains only whitespace, false otherwise */
+    IsOnlyWhiteSpace: (value: any): boolean => {
+        if (value === undefined) return true;
+        if (value === null) return true; 
+        if((value as string).toString().trim() === '') return true;
+        return false;
+    },
+
+
     /** Break reference of a object or array */
     BreakReference: <T>(object: T): T => {
         if (object === undefined) return undefined as T;
@@ -91,14 +103,11 @@ export const Tools = {
     },
 
 
-    /** 
-     * Sort an array in ascending order by property 
-     * @returns A new array 
-     * */
+    /** Sort an array in ascending order by property */
     SortBy: <T>(array: T[], property: string, propertyType: 'string' | 'number' = 'string'): T[] => {
         switch (propertyType) {
             case 'string': {
-                return [...array].sort((x: any, y: any) => {
+                return array.sort((x: any, y: any) => {
                     if (String(x[property]).toUpperCase().trim() < String(y[property]).toUpperCase().trim()) return -1;
                     else if (String(x[property]).toUpperCase().trim() > String(y[property]).toUpperCase().trim()) return 1;
                     else return 0;
@@ -112,10 +121,7 @@ export const Tools = {
     },
 
 
-    /**
-     * Sort an array in descending order by property
-     * @returns A new array
-     * */
+    /** Sort an array in descending order by property */
     SortByDesc: <T>(array: T[], property: string, propertyType: 'string' | 'number' = 'string'): T[] => {
         switch (propertyType) {
             case 'string': {
@@ -130,5 +136,77 @@ export const Tools = {
                 return array.sort((x: any, y: any) => Number(Number(y[property])) - x[property]);
             }
         }
+    },
+
+
+    /** Return a string with forman numeric */
+    GetNumericFormat: (value: string | number | null | undefined, decimals: number = 0): string => {
+        if (value == undefined
+            || value == null
+            || value.toString().trim() == ''
+            || isNaN(Number(value))) {
+            return '0';
+        }
+
+        let valueInteger = '';
+        let valueDecimal = '';
+        value = value.toString().replaceAll(' ', '');
+
+        if (value.includes('.') || (decimals > 0)) {
+            valueInteger = value.includes('.') ? value.split('.')[0] : value;
+
+            if (decimals > 0) {
+                const PADDING = decimals - valueDecimal.length;
+                valueDecimal = value.includes('.') ? value.split('.')[1] : '';
+                for(let i = 0; i < PADDING; i++) valueDecimal += '0';
+                valueDecimal = valueDecimal.substring(0, decimals);
+                valueDecimal = `.${valueDecimal}`;
+            }
+        }
+
+        else {
+            valueInteger = value;
+        }
+
+        let counter = 0;
+        const VALUE_INTEGER_ARRAY: string[] = [];
+        for(const char of valueInteger.split('').reverse()) {
+            if (counter == 3) {
+                VALUE_INTEGER_ARRAY.push(',');
+                counter = 0;
+            }
+
+            VALUE_INTEGER_ARRAY.push(char);
+            ++counter;
+        }
+
+        valueInteger = VALUE_INTEGER_ARRAY.reverse().join('');
+        return `${valueInteger}${valueDecimal}`;
+    },
+
+
+    /** Wait the time indicated */
+    Sleep: (milliseconds: number = 0, reference: string | null = null) => {
+        if (Tools.IsNull(reference)) {
+            return new Promise(Resolve => setTimeout(Resolve, milliseconds));
+        }
+
+        else return new Promise<void>(Resolve => {
+            reference = reference!.replaceAll(' ', '_').toLowerCase();
+
+            if (reference_signal().hasOwnProperty(reference)) {
+                clearInterval(reference_signal()[reference!]);
+            }
+
+            reference_signal.set(Object.assign(reference_signal(), {
+                [reference!]: setTimeout(() => {
+                    Resolve();
+                    clearInterval(reference_signal()[reference!]);
+                    const _reference = { ...reference_signal() };
+                    delete _reference[reference!];
+                    reference_signal.set({ ..._reference });
+                }, milliseconds)
+            }));
+        });
     }
 };

package/index.ts

@@ -1,3 +1,4 @@
 export * from './Tools'
+export * from './Tools/DateTime.class';
 export * from './Tools/Files.class';
-export * from './Tools/DateTime.class';
+export * from './Tools/Screen.class';

package/interfaces/index.ts

@@ -2,4 +2,10 @@ export interface IPatch {
     op: 'remove' | 'add' | 'replace';
     path: string;
     value: any;
+}
+
+export interface IScreenSize {
+    width: number;
+    height: number;
+    breakpoin: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "coer-elements",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "author": "Christian Omar Escamilla Rodríguez",
   "keywords": [
     "coer",
@@ -19,14 +19,26 @@
     "build-browser": "tsc index.ts --outDir dist_browser --module ES6",
     "build-node": "tsc index.ts --outDir dist_node",
     "build": "npm run build-browser & npm run build-node",
-    "publish": "npm publish --access public"
+    "push": "npm publish --access public"
   },
   "dependencies": {
+    "@angular/animations": "^17.3.0",
+    "@angular/cdk": "^17.3.3",
+    "@angular/common": "^17.3.0",
+    "@angular/compiler": "^17.3.0",
+    "@angular/core": "^17.3.0",
+    "@angular/forms": "^17.3.0",
+    "@angular/material": "^17.3.3",
+    "@angular/platform-browser": "^17.3.0",
+    "@angular/platform-browser-dynamic": "^17.3.0",
+    "@angular/router": "^17.3.0",
     "guid-typescript": "^1.0.9",
     "moment": "^2.30.1",
+    "rxjs": "^7.8.1",
     "xlsx": "^0.18.5"
   },
   "devDependencies": {
+    "@types/xlsx": "^0.0.36",
     "typescript": "^5.5.4"
   }
 }