@libs-ui/utils 0.2.304 → 0.2.306-10

package/fesm2022/libs-ui-utils.mjs

@@ -1,9 +1,9 @@
-import { fromEvent, tap, takeUntil, mergeMap, startWith, finalize, Subject, filter, Observable } from 'rxjs';
-import Quill from 'quill';
 import DeviceDetector from 'device-detector-js';
+import Quill from 'quill';
+import { fromEvent, tap, takeUntil, mergeMap, startWith, finalize, lastValueFrom, timer, Observable, Subject, filter } from 'rxjs';
 import CryptoES from 'crypto-es';
 import { HttpParams } from '@angular/common/http';
-import { isSignal, TemplateRef, ElementRef, signal, InjectionToken } from '@angular/core';
+import { TemplateRef, ElementRef, isSignal, signal, InjectionToken } from '@angular/core';
 import dayjs from 'dayjs';
 import 'dayjs/locale/en';
 import 'dayjs/locale/vi';
@@ -90,7 +90,7 @@ const highlightByKeyword = (value, search, ignoreHighlight, classHightLight) =>
         if (!classHightLight) {
             classHightLight = 'bg-[#19344a] text-white';
         }
-        keysReplace.forEach(key => {
+        keysReplace.forEach((key) => {
             const regExp = new RegExp(key, 'gi');
             value = value?.replace(regExp, `<span class="${classHightLight}">$&</span>`);
         });
@@ -119,7 +119,7 @@ const formatTextCompare = (text, options) => {
     if (!text) {
         return text;
     }
-    text = text.normalize("NFC");
+    text = text.normalize('NFC');
     return formatByOptions(text, options);
 };
 const fullNameFormat = (value) => {
@@ -133,7 +133,10 @@ const capitalize = (text, options) => {
         return text;
     }
     text = formatByOptions(text, options);
-    return text.split(' ').map(word => firstLetterToUpperCase(word)).join(' ');
+    return text
+        .split(' ')
+        .map((word) => firstLetterToUpperCase(word))
+        .join(' ');
 };
 const firstLetterToUpperCase = (text, options) => {
     if (!text) {
@@ -159,7 +162,7 @@ const formatByOptions = (text, options) => {
         text = text.toLowerCase();
     }
     if (options?.removeMultipleSpace) {
-        text = text.replace(/\u200B|\u00A0/g, "");
+        text = text.replace(/\u200B|\u00A0/g, '');
         text = text.replace(/\s+/g, ' ');
     }
     if (options?.removeEmoji) {
@@ -177,12 +180,7 @@ const escapeHtml = (str) => {
     if (!str || typeof str !== 'string') {
         return str;
     }
-    return str
-        .replace(/&/g, "&amp;")
-        .replace(/</g, "&lt;")
-        .replace(/>/g, "&gt;")
-        .replace(/"/g, "&quot;")
-        .replace(/'/g, "&#039;");
+    return str.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#039;');
 };
 const decodeEscapeHtml = (str) => {
     const htmlTag = document.createElement('textarea');
@@ -213,9 +211,9 @@ const deleteUnicode = (str) => {
     str = str.replace(/Ù|Ú|Ụ|Ủ|Ũ|Ư|Ừ|Ứ|Ự|Ử|Ữ/g, 'U');
     str = str.replace(/Ỳ|Ý|Ỵ|Ỷ|Ỹ/g, 'Y');
     str = str.replace(/Đ/g, 'D');
-    str = str.replace(/\u0300|\u0301|\u0303|\u0309|\u0323/g, ""); // ̀ ́ ̃ ̉ ̣  huyền, sắc, ngã, hỏi, nặng
-    str = str.replace(/\u02C6|\u0306|\u031B/g, ""); // ˆ ̆ ̛  Â, Ê, Ă, Ơ, Ư
-    return str.normalize("NFC");
+    str = str.replace(/\u0300|\u0301|\u0303|\u0309|\u0323/g, ''); // ̀ ́ ̃ ̉ ̣  huyền, sắc, ngã, hỏi, nặng
+    str = str.replace(/\u02C6|\u0306|\u031B/g, ''); // ˆ ̆ ̛  Â, Ê, Ă, Ơ, Ư
+    return str.normalize('NFC');
 };
 const removeEmoji = (text) => {
     if (!text || !text.trim()) {
@@ -290,10 +288,7 @@ const checkViewInScreen = (container, element, elementScroll, maxTopLeft) => {
     const limitLeft = leftContainer + scrollLeftContainer + widthContainer;
     const maxTopItem = top + (maxTopLeft?.top || 0);
     const maxLeftItem = left + (maxTopLeft?.left || 0);
-    if (topContainer <= maxTopItem &&
-        maxTopItem <= limitTop &&
-        leftContainer <= maxLeftItem &&
-        maxLeftItem <= limitLeft) {
+    if (topContainer <= maxTopItem && maxTopItem <= limitTop && leftContainer <= maxLeftItem && maxLeftItem <= limitLeft) {
         return true;
     }
     return false;
@@ -307,10 +302,7 @@ const checkMouseOverInContainer = (mousePosition, element, rect) => {
     const limitLeft = left + width;
     const limitTop = top + height;
     const { clientX, clientY } = mousePosition;
-    if (left <= clientX &&
-        clientX <= limitLeft &&
-        top <= clientY &&
-        clientY <= limitTop) {
+    if (left <= clientX && clientX <= limitLeft && top <= clientY && clientY <= limitTop) {
         return true;
     }
     return false;
@@ -348,22 +340,138 @@ const getDragEventByElement = (config) => {
         e.stopPropagation();
         config.functionMouseMove?.(e);
     }), takeUntil(mouseup));
-    return mouseDown.pipe(mergeMap((e) => config.isStartWithMouseDownEvent
-        ? mousemove.pipe(startWith(e))
-        : mousemove), takeUntil(config.onDestroy), finalize(removeClass));
+    return mouseDown.pipe(mergeMap((e) => (config.isStartWithMouseDownEvent ? mousemove.pipe(startWith(e)) : mousemove)), takeUntil(config.onDestroy), finalize(removeClass));
 };
-const getHTMLFromQuill = (delta) => {
+const getHTMLFromQuill = async (data, options) => {
+    const { replaceNewLineTo = '<br>', replaceTagBRTo, replaceTags, replaceBrToDiv } = options || {};
+    const delta = typeof data === 'string' ? await getDeltaFromHTML(data) : data;
+    if (options?.functionReplaceDelta) {
+        options.functionReplaceDelta(delta);
+    }
     delta.ops.forEach((op) => {
         if (op.insert) {
             if (typeof op.insert === 'string') {
-                op.insert = op.insert.replace(/\n/g, '<br>');
+                if (replaceNewLineTo) {
+                    op.insert = op.insert.replace(/\n/g, replaceNewLineTo);
+                }
+                if (replaceTagBRTo) {
+                    op.insert = op.insert.replace(/<br>/g, replaceTagBRTo);
+                }
+                if (replaceTags?.length) {
+                    for (const tag of replaceTags) {
+                        op.insert = op.insert.replace(new RegExp(`<${tag.tag}>`, 'g'), `<${tag.replaceTo}>`);
+                        op.insert = op.insert.replace(new RegExp(`</${tag.tag}>`, 'g'), `</${tag.replaceTo}>`);
+                    }
+                }
             }
         }
     });
     quill.setContents(delta);
-    const htmlText = quill.root.firstElementChild?.innerHTML;
+    let htmlText = options?.getRootHtml ? quill.root.innerHTML : quill.root.firstElementChild?.innerHTML;
+    if (replaceBrToDiv) {
+        htmlText = convertHtmlToDivBlocks(htmlText || '');
+    }
     return decodeEscapeHtml(htmlText || '');
 };
+const convertHtmlToDivBlocks = (html) => {
+    const BREAK_TOKEN = '<<<BREAK>>>';
+    // Bước 1: thay <br> thành token tạm
+    const normalizedHtml = html.replace(/<br\s*\/?>/gi, BREAK_TOKEN);
+    // Bước 2: tách theo token
+    const parts = normalizedHtml.split(BREAK_TOKEN);
+    const parser = new DOMParser();
+    const divs = [];
+    for (const raw of parts) {
+        const trimmed = raw.trim();
+        if (!trimmed)
+            continue;
+        // parse mỗi phần nhỏ như một document riêng
+        const doc = parser.parseFromString(trimmed, 'text/html');
+        const body = doc.body;
+        // Lấy lại nội dung bên trong body
+        divs.push(`<div>${body.innerHTML}</div>`);
+    }
+    return divs.join('');
+};
+const getDeltaFromHTML = async (html) => {
+    quill.root.innerHTML = html;
+    setTimeout(() => {
+        console.log(quill.getContents());
+    }, 1000);
+    await lastValueFrom(timer(1000));
+    return quill.getContents();
+};
+const processPasteData = async (e, config) => {
+    const element = config.element;
+    const files = e.clipboardData?.files;
+    if (files?.length) {
+        e.preventDefault();
+        config.handlerPasteFile?.(files);
+        config.callBack?.('file');
+        return;
+    }
+    // Lưu selection TRƯỚC khi prevent default
+    const selection = window.getSelection();
+    let savedRange = null;
+    if (selection && selection.rangeCount > 0) {
+        const range = selection.getRangeAt(0);
+        // Chỉ lưu nếu range nằm trong contentText element
+        const container = range.commonAncestorContainer;
+        const isInContentElement = element.contains(container.nodeType === Node.TEXT_NODE ? container.parentNode : container);
+        if (isInContentElement) {
+            savedRange = range.cloneRange();
+        }
+    }
+    // Prevent default để tự xử lý paste
+    e.preventDefault();
+    // Sử dụng Quill để clean HTML content
+    const htmlContent = e.clipboardData?.getData('text/html') || '';
+    const plainText = e.clipboardData?.getData('text/plain') || '';
+    let contentToInsert = (plainText || '').replace(/\n/g, '<br>');
+    if (htmlContent) {
+        contentToInsert = await getHTMLFromQuill(htmlContent);
+    }
+    if (!contentToInsert) {
+        config.callBack?.('no-content');
+        return;
+    }
+    if (savedRange) {
+        insertContentWithRange(contentToInsert, savedRange, element);
+        config.callBack?.('range');
+        return;
+    }
+    element.innerHTML += contentToInsert;
+    config.callBack?.('content');
+};
+const insertContentWithRange = (content, savedRange, element) => {
+    const selection = window.getSelection();
+    if (!selection) {
+        // Fallback: append vào cuối
+        element.innerHTML += content;
+        return;
+    }
+    // Restore selection
+    selection.removeAllRanges();
+    selection.addRange(savedRange);
+    // Xóa nội dung đã select (nếu có)
+    savedRange.deleteContents();
+    // Tạo document fragment từ HTML content
+    const tempDiv = document.createElement('div');
+    tempDiv.innerHTML = content;
+    const fragment = document.createDocumentFragment();
+    while (tempDiv.firstChild) {
+        fragment.appendChild(tempDiv.firstChild);
+    }
+    // Insert fragment tại vị trí range
+    savedRange.insertNode(fragment);
+    // Di chuyển cursor đến cuối nội dung vừa insert
+    if (fragment.lastChild) {
+        savedRange.setStartAfter(fragment.lastChild);
+    }
+    savedRange.collapse(true);
+    selection.removeAllRanges();
+    selection.addRange(savedRange);
+};
 
 class UtilsUrlSearchParams {
     static instance;
@@ -380,17 +488,19 @@ class UtilsUrlSearchParams {
         return this.instance;
     }
     static toStringParamObject(params) {
-        const paramsArr = Object.keys(params).map(key => {
+        const paramsArr = Object.keys(params).map((key) => {
             return {
                 key,
-                value: params[key]
+                value: params[key],
             };
         });
         return UtilsUrlSearchParams.ToString(paramsArr);
     }
     static ToString(params) {
         let paramsStr = '';
-        params.sort((item1, item2) => item1.key.localeCompare(item2.key)).forEach((item) => {
+        params
+            .sort((item1, item2) => item1.key.localeCompare(item2.key))
+            .forEach((item) => {
             const { key, value } = item;
             paramsStr = `${paramsStr}${paramsStr ? '&' : ''}${key}=${value}`;
         });
@@ -407,14 +517,14 @@ class UtilsUrlSearchParams {
         }
         const params = paramString.replace(/\S+[?]/g, '').split('&');
         if (params) {
-            params.forEach(param => {
+            params.forEach((param) => {
                 if (param.indexOf('=') < 0) {
                     return;
                 }
                 let [key, value] = param.split('=');
                 key = key.replace(/[?&]+/g, '');
                 value = decodeURIComponent(value.replace(/\+/g, ' '));
-                if (!paramsBuild.some(param => param.key === key)) {
+                if (!paramsBuild.some((param) => param.key === key)) {
                     paramsBuild.push({ key, value });
                 }
             });
@@ -422,7 +532,7 @@ class UtilsUrlSearchParams {
         return paramsBuild;
     }
     set(key, value) {
-        const paramByKey = this.params.find(param => param.key === key);
+        const paramByKey = this.params.find((param) => param.key === key);
         if (!paramByKey) {
             this.params.push({ key, value: decodeURIComponent(value.replace(/\+/g, ' ')) });
             return;
@@ -430,13 +540,13 @@ class UtilsUrlSearchParams {
         paramByKey['value'] = value;
     }
     get(key) {
-        return this.params.find(param => param.key === key)?.value;
+        return this.params.find((param) => param.key === key)?.value;
     }
     has(key) {
-        return this.params.some(param => param.key === key);
+        return this.params.some((param) => param.key === key);
     }
     delete(key) {
-        const index = this.params.findIndex(param => param.key === key);
+        const index = this.params.findIndex((param) => param.key === key);
         if (index >= 0) {
             this.params.splice(index, 1);
         }
@@ -450,7 +560,7 @@ class UtilsUrlSearchParams {
     }
     getParamObject() {
         const params = {};
-        this.params.forEach(item => {
+        this.params.forEach((item) => {
             params[item.key] = item.value;
         });
         return params;
@@ -478,7 +588,7 @@ const keyStore$1 = () => {
 };
 const encrypt = (plainData) => {
     if (!keyStore$1()) {
-        throw Error("lỗi chưa setup key mã hóa");
+        throw Error('lỗi chưa setup key mã hóa');
     }
     const key = CryptoES.enc.Hex.parse(keyStore$1());
     const iv = CryptoES.enc.Hex.parse(keyStore$1());
@@ -489,7 +599,7 @@ const encrypt = (plainData) => {
 };
 const decrypt = (encryptedData) => {
     if (!keyStore$1()) {
-        throw Error("lỗi chưa setup key mã hóa");
+        throw Error('lỗi chưa setup key mã hóa');
     }
     const key = CryptoES.enc.Hex.parse(keyStore$1());
     const iv = CryptoES.enc.Hex.parse(keyStore$1());
@@ -520,83 +630,143 @@ const uuid = () => {
 };
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
-const UtilsHttpParamsRequestInstance = (options, instance) => {
-    return new UtilsHttpParamsRequest(options, instance);
-};
-class UtilsHttpParamsRequest extends HttpParams {
-    params = new HttpParams();
-    constructor(options, instance) {
-        super(options);
-        if (!instance) {
-            this.params = new HttpParams(options);
-            return;
-        }
-        if (instance instanceof UtilsHttpParamsRequest) {
-            this.params = instance.getInstance();
-            return;
-        }
-        if (instance instanceof HttpParams) {
-            this.params = instance;
-            return;
-        }
-    }
-    getInstance() {
-        return this.params;
-    }
-    setInstance(instance) {
-        if (instance instanceof UtilsHttpParamsRequest) {
-            this.params = instance.getInstance();
-            return;
-        }
-        if (instance instanceof HttpParams) {
-            this.params = instance;
-            return;
-        }
-    }
-    set(param, value) {
-        this.params = this.params.set(param, value);
-        return this;
+/**
+ * Danh sách các constructor name nguy hiểm
+ */
+const DANGEROUS_CONSTRUCTOR_NAMES = ['Window', 'Document', 'HTMLDocument', 'HTMLElement', 'Element', 'Node', 'Location', 'Navigator', 'Screen', 'History', 'Storage', 'Console', 'Performance'];
+/**
+ * Kiểm tra xem đối tượng có phải là browser global object không
+ */
+const isBrowserGlobalObject = (obj) => {
+    if (obj === null || typeof obj !== 'object') {
+        return false;
     }
-    has(param) {
-        return this.params.has(param);
+    return obj instanceof Window || obj instanceof Document || obj === window || obj === document || obj === globalThis;
+};
+/**
+ * Kiểm tra xem đối tượng có phải là DOM object không
+ */
+const isDOMObject = (obj) => {
+    if (obj === null || typeof obj !== 'object') {
+        return false;
     }
-    get(param) {
-        return this.params.get(param);
+    return obj instanceof HTMLElement || obj instanceof Node || obj instanceof Element;
+};
+/**
+ * Kiểm tra xem đối tượng có phải là browser API object không
+ */
+const isBrowserAPIObject = (obj) => {
+    if (obj === null || typeof obj !== 'object' || typeof window === 'undefined') {
+        return false;
     }
-    getAll(param) {
-        return this.params.getAll(param);
+    return obj === window.location || obj === window.navigator || obj === window.screen || obj === window.history || obj === window.localStorage || obj === window.sessionStorage || obj === window.console || obj === window.performance;
+};
+/**
+ * Kiểm tra constructor name có nằm trong danh sách nguy hiểm không
+ */
+const hasDangerousConstructorName = (obj) => {
+    if (obj === null || typeof obj !== 'object') {
+        return false;
     }
-    keys() {
-        return this.params.keys();
+    const constructorName = obj.constructor?.name;
+    return constructorName && DANGEROUS_CONSTRUCTOR_NAMES.includes(constructorName);
+};
+/**
+ * Kiểm tra xem đối tượng có phải là DOM object hoặc browser object nguy hiểm không
+ * Những đối tượng này có thể gây ra circular reference và maximum call stack
+ */
+const isDangerousObject = (obj) => {
+    if (obj === null || typeof obj !== 'object') {
+        return false;
     }
-    append(param, value) {
-        this.params = this.params.append(param, value);
-        return this;
+    return isBrowserGlobalObject(obj) || isDOMObject(obj) || isBrowserAPIObject(obj) || hasDangerousConstructorName(obj);
+};
+/**
+ * Kiểm tra đối tượng có phải là Angular/Framework object không
+ */
+const isFrameworkObject = (obj) => {
+    if (obj === null || typeof obj !== 'object') {
+        return false;
     }
-    appendAll(params) {
-        this.params = this.params.appendAll(params);
-        return this;
+    return obj instanceof TemplateRef || obj instanceof ElementRef;
+};
+/**
+ * Kiểm tra đối tượng có phải là File/Blob object không
+ */
+const isFileObject = (obj) => {
+    if (obj === null || typeof obj !== 'object') {
+        return false;
     }
-    delete(param, value) {
-        this.params = this.params.delete(param, value);
-        return this;
+    return obj instanceof File || obj instanceof Blob || Object.prototype.toString.call(obj) === '[object File]';
+};
+/**
+ * Kiểm tra đối tượng có phải là Built-in object không
+ */
+const isBuiltInObject = (obj) => {
+    if (obj === null || typeof obj !== 'object') {
+        return false;
     }
-    toString() {
-        return this.params.toString();
+    return obj instanceof Date || obj instanceof RegExp || obj instanceof HttpParams;
+};
+/**
+ * Kiểm tra đối tượng có phải là Async object không
+ */
+const isAsyncObject = (obj) => {
+    if (obj === null || typeof obj !== 'object') {
+        return false;
     }
-}
-// Demo su dung GET_PATH_VARIABLE
-// interface Person {
-//   name: string;
-//   age: number;
-//   location: string;
-// }
-// type c = GET_PATH_VARIABLE<Person, unknown>;
-// const a: c = {
-//   "pathVariable-age": 1,
-//   "pathVariable-location": '12',
-//   "pathVariable-name": '124',
-// };
+    return obj instanceof Promise || obj instanceof Observable;
+};
+/**
+ * Kiểm tra đối tượng có phải là Special object cần bỏ qua không
+ * Bao gồm: Framework objects, File objects, Built-in objects, Async objects
+ */
+const isSpecialObject = (obj) => {
+    return isFrameworkObject(obj) || isFileObject(obj) || isBuiltInObject(obj) || isAsyncObject(obj);
+};
+/**
+ * Kiểm tra đối tượng có phải là dayjs object không
+ */
+const isDayjsObject = (obj) => {
+    return dayjs.isDayjs(obj);
+};
+/**
+ * Kiểm tra đối tượng có phải là object cần bỏ qua trong quá trình convert không
+ */
+const isSkippableObject = (obj) => {
+    return isDangerousObject(obj) || isSpecialObject(obj);
+};
+/**
+ * Kiểm tra đối tượng có phải là Map object không
+ */
+const isMapObject = (obj) => {
+    return obj instanceof Map;
+};
+/**
+ * Kiểm tra đối tượng có phải là Set object không
+ */
+const isSetObject = (obj) => {
+    return obj instanceof Set;
+};
+/**
+ * Kiểm tra đối tượng có phải là Array object không
+ */
+const isArrayObject = (obj) => {
+    return Array.isArray(obj);
+};
+/**
+ * Kiểm tra đối tượng có phải là object cần trả về nguyên trạng không
+ * Bao gồm: dangerous objects, special objects, dayjs objects
+ */
+const isReturnAsIsObject = (obj) => {
+    return isSkippableObject(obj) || isDayjsObject(obj);
+};
+/**
+ * Kiểm tra xem đối tượng có an toàn để clone/convert không
+ */
+const isSafeToProcess = (obj) => {
+    return !isDangerousObject(obj);
+};
 
 let key = '12~@#loqwsxacva(3rdhaq12';
 /**
@@ -614,7 +784,7 @@ const keyStore = () => {
 };
 const encrypt3rd = (plainData) => {
     if (!keyStore()) {
-        throw Error("lỗi chưa setup key mã hóa");
+        throw Error('lỗi chưa setup key mã hóa');
     }
     const key = CryptoES.enc.Hex.parse(keyStore());
     const iv = CryptoES.enc.Hex.parse(keyStore());
@@ -625,7 +795,7 @@ const encrypt3rd = (plainData) => {
 };
 const decrypt3rd = (encryptedData) => {
     if (!keyStore()) {
-        throw Error("lỗi chưa setup key mã hóa");
+        throw Error('lỗi chưa setup key mã hóa');
     }
     const key = CryptoES.enc.Hex.parse(keyStore());
     const iv = CryptoES.enc.Hex.parse(keyStore());
@@ -672,7 +842,9 @@ class UtilsCommunicateMicro {
         if (!this.subs.get(COMMUNICATE_MICRO_KEY_GET_ALL_MESSAGE)) {
             this.subs.set(COMMUNICATE_MICRO_KEY_GET_ALL_MESSAGE, UtilsCommunicateMicro.allMessageSub);
         }
-        fromEvent(currentWindow, 'message').pipe(takeUntil(onDestroy)).subscribe(e => {
+        fromEvent(currentWindow, 'message')
+            .pipe(takeUntil(onDestroy))
+            .subscribe((e) => {
             const event = { data: { ...e.data } };
             const data = event.data;
             const type = data.type;
@@ -700,7 +872,9 @@ class UtilsCommunicateMicro {
                 this.allMessageSub.next(event);
             }
         });
-        UtilsCommunicateMicro.GetMessage(UtilsCache.typeKeyClearLocalStorage).pipe(filter(e => e.data.response !== UtilsCache.idService), takeUntil(onDestroy)).subscribe(() => {
+        UtilsCommunicateMicro.GetMessage(UtilsCache.typeKeyClearLocalStorage)
+            .pipe(filter((e) => e.data.response !== UtilsCache.idService), takeUntil(onDestroy))
+            .subscribe(() => {
             console.log('clear all cache by event');
             UtilsCache.ClearAll();
         });
@@ -709,10 +883,10 @@ class UtilsCommunicateMicro {
         data = this.convertData(data);
         try {
             if (isEmbedFrame()) {
-                window?.parent?.postMessage(data, "*");
+                window?.parent?.postMessage(data, '*');
                 return;
             }
-            window?.top?.postMessage(data, "*");
+            window?.top?.postMessage(data, '*');
         }
         catch (error) {
             console.log(error);
@@ -720,8 +894,8 @@ class UtilsCommunicateMicro {
     }
     static PostMessageToChildren(data) {
         data = this.convertData(data);
-        const iframes = document.querySelectorAll("iframe");
-        Array.from(iframes).forEach(iframe => {
+        const iframes = document.querySelectorAll('iframe');
+        Array.from(iframes).forEach((iframe) => {
             iframe?.contentWindow?.postMessage(data, '*');
         });
     }
@@ -759,7 +933,7 @@ class UtilsCommunicateMicro {
     }
     static GetMessage(messageType) {
         if (!this.initdEvent) {
-            throw Error("chưa khơi tạo hàm lắng nghe sự kiện, gọi UtilsCommunicateMicro.initEvent(window) tại root component");
+            throw Error('chưa khơi tạo hàm lắng nghe sự kiện, gọi UtilsCommunicateMicro.initEvent(window) tại root component');
         }
         if (typeof messageType === 'string') {
             let sub = this.subs.get(messageType);
@@ -787,8 +961,8 @@ class UtilsCommunicateMicro {
         return sub;
     }
     static initSubject(subRoot, messageType) {
-        messageType.forEach(key => {
-            this.GetMessage(key).subscribe(e => {
+        messageType.forEach((key) => {
+            this.GetMessage(key).subscribe((e) => {
                 subRoot.next(e);
             });
         });
@@ -796,33 +970,33 @@ class UtilsCommunicateMicro {
 }
 
 class UtilsLanguageConstants {
-    static VI = "vi"; // Tiếng Việt
-    static EN = "en"; // Tiếng Anh
-    static FR = "fr"; // Tiếng Pháp
-    static DE = "de"; // Tiếng Đức
-    static ES = "es"; // Tiếng Tây Ban Nha
-    static ZH = "zh"; // Tiếng Trung (Giản thể)
-    static ZH_TW = "zh-TW"; // Tiếng Trung (Phồn thể)
-    static JA = "ja"; // Tiếng Nhật
-    static KO = "ko"; // Tiếng Hàn
-    static RU = "ru"; // Tiếng Nga
-    static IT = "it"; // Tiếng Ý
-    static PT = "pt"; // Tiếng Bồ Đào Nha
-    static TH = "th"; // Tiếng Thái
-    static ID = "id"; // Tiếng Indonesia
-    static MS = "ms"; // Tiếng Malaysia
-    static AR = "ar"; // Tiếng Ả Rập
-    static HI = "hi"; // Tiếng Hindi
-    static BN = "bn"; // Tiếng Bengal
-    static TR = "tr"; // Tiếng Thổ Nhĩ Kỳ
-    static NL = "nl"; // Tiếng Hà Lan
-    static KM = "km"; // Tiếng Khmer (Campuchia)
-    static LO = "lo"; // Tiếng Lào
-    static MY = "my"; // Tiếng Miến Điện (Myanmar)
-    static TL = "tl"; // Tiếng Tagalog (Philippines)
-    static CEB = "ceb"; // Tiếng Cebuano (Philippines)
-    static JV = "jv"; // Tiếng Java (Indonesia)
-    static SU = "su"; // Tiếng Sundanese (Indonesia)
+    static VI = 'vi'; // Tiếng Việt
+    static EN = 'en'; // Tiếng Anh
+    static FR = 'fr'; // Tiếng Pháp
+    static DE = 'de'; // Tiếng Đức
+    static ES = 'es'; // Tiếng Tây Ban Nha
+    static ZH = 'zh'; // Tiếng Trung (Giản thể)
+    static ZH_TW = 'zh-TW'; // Tiếng Trung (Phồn thể)
+    static JA = 'ja'; // Tiếng Nhật
+    static KO = 'ko'; // Tiếng Hàn
+    static RU = 'ru'; // Tiếng Nga
+    static IT = 'it'; // Tiếng Ý
+    static PT = 'pt'; // Tiếng Bồ Đào Nha
+    static TH = 'th'; // Tiếng Thái
+    static ID = 'id'; // Tiếng Indonesia
+    static MS = 'ms'; // Tiếng Malaysia
+    static AR = 'ar'; // Tiếng Ả Rập
+    static HI = 'hi'; // Tiếng Hindi
+    static BN = 'bn'; // Tiếng Bengal
+    static TR = 'tr'; // Tiếng Thổ Nhĩ Kỳ
+    static NL = 'nl'; // Tiếng Hà Lan
+    static KM = 'km'; // Tiếng Khmer (Campuchia)
+    static LO = 'lo'; // Tiếng Lào
+    static MY = 'my'; // Tiếng Miến Điện (Myanmar)
+    static TL = 'tl'; // Tiếng Tagalog (Philippines)
+    static CEB = 'ceb'; // Tiếng Cebuano (Philippines)
+    static JV = 'jv'; // Tiếng Java (Indonesia)
+    static SU = 'su'; // Tiếng Sundanese (Indonesia)
     // Ngôn ngữ mặc định
     static defaultLang = UtilsLanguageConstants.VI;
     // Danh sách các ngôn ngữ được hỗ trợ
@@ -908,7 +1082,7 @@ class UtilsCache {
         return this.Get(this.languageKeyCache, UtilsLanguageConstants.defaultLang);
     }
     static openDB() {
-        return new Promise(resolve => {
+        return new Promise((resolve) => {
             const request = indexedDB.open(this.dbName, this.dbVersion);
             request.onupgradeneeded = (event) => {
                 const db = event.target.result;
@@ -980,7 +1154,7 @@ class UtilsCache {
             clear: () => {
                 this.storage = {};
                 localStorage.clear();
-            }
+            },
         };
     }
     static getLocalStorageFake() {
@@ -999,7 +1173,7 @@ class UtilsCache {
             },
             clear: () => {
                 this.storage = {};
-            }
+            },
         };
     }
     static async GetAsync(key, default_value, isKeyMD5 = false) {
@@ -1018,7 +1192,7 @@ class UtilsCache {
                 if (data.expire === this.CACHE_EXPIRE_NONE) {
                     return resolve(data.json);
                 }
-                const currentMillisecond = (new Date().valueOf() / 1000);
+                const currentMillisecond = new Date().valueOf() / 1000;
                 if (data.expire < currentMillisecond) {
                     return resolve(default_value);
                 }
@@ -1031,6 +1205,7 @@ class UtilsCache {
         });
     }
     static Get(key, default_value) {
+        // support cho những file không thể inject UtilsCache
         if (!key) {
             return this.GetDefaultValueBySpecificKey(key, default_value);
         }
@@ -1043,7 +1218,7 @@ class UtilsCache {
             if (data.expire === this.CACHE_EXPIRE_NONE) {
                 return data.value ?? default_value;
             }
-            const currentMillisecond = (new Date().valueOf() / 1000);
+            const currentMillisecond = new Date().valueOf() / 1000;
             if (data.expire < currentMillisecond) {
                 return this.GetDefaultValueBySpecificKey(key, default_value);
             }
@@ -1058,11 +1233,12 @@ class UtilsCache {
         return default_value;
     }
     static async SetAsync(key, value, expireTimeBySecond = this.CACHE_EXPIRE_TIME_DEFAULT, isKeyMD5 = false) {
+        // support inject UtilsCache
         return new Promise(async (resolve) => {
             const objectStore = await this.getObjectStore();
             key = isKeyMD5 ? key : md5(key);
             try {
-                const currentMillisecond = expireTimeBySecond === this.CACHE_EXPIRE_NONE ? this.CACHE_EXPIRE_NONE : (new Date().valueOf() / 1000) + expireTimeBySecond;
+                const currentMillisecond = expireTimeBySecond === this.CACHE_EXPIRE_NONE ? this.CACHE_EXPIRE_NONE : new Date().valueOf() / 1000 + expireTimeBySecond;
                 const data = {
                     value: encrypt(JSON.stringify({ json: value, expire: currentMillisecond })),
                 };
@@ -1088,10 +1264,11 @@ class UtilsCache {
         });
     }
     static Set(key, value, expireTimeBySecond = this.CACHE_EXPIRE_TIME_DEFAULT) {
-        const currentMillisecond = expireTimeBySecond === this.CACHE_EXPIRE_NONE ? this.CACHE_EXPIRE_NONE : (new Date().valueOf() / 1000) + expireTimeBySecond;
+        // support cho những file không inject UtilsCache
+        const currentMillisecond = expireTimeBySecond === this.CACHE_EXPIRE_NONE ? this.CACHE_EXPIRE_NONE : new Date().valueOf() / 1000 + expireTimeBySecond;
         const data = {
             value: value,
-            expire: currentMillisecond
+            expire: currentMillisecond,
         };
         try {
             this.LocalStorage.setItem(key, encrypt(JSON.stringify(data)));
@@ -1146,13 +1323,13 @@ class UtilsCache {
             const data = {
                 type: this.typeKeyClearLocalStorage,
                 response: {
-                    idEvent: this.idService
-                }
+                    idEvent: this.idService,
+                },
             };
             UtilsCommunicateMicro.PostMessageToParent(data);
         }
         const keys = [...this.listKeyKeepWhenClearALll];
-        Object.keys(this.LocalStorage).forEach(key => {
+        Object.keys(this.LocalStorage).forEach((key) => {
             if (key.includes('kc-callback-')) {
                 keys.push(key);
             }
@@ -1198,7 +1375,7 @@ class UtilsCache {
                 if (!Array.isArray(data)) {
                     return resolve({});
                 }
-                data.forEach(obj => {
+                data.forEach((obj) => {
                     if (obj[this.itemIndexByKey].startsWith(keyCacheStartWith)) {
                         this.ClearAsync(obj[this.itemIndexByKey], true);
                     }
@@ -1216,7 +1393,7 @@ class UtilsCache {
         if (!keys || !keys.length) {
             return;
         }
-        keys.forEach(key => {
+        keys.forEach((key) => {
             if (key.startsWith(keyCache)) {
                 this.Clear(key);
             }
@@ -1231,8 +1408,9 @@ class UtilsCache {
                 resolve({ deleteSuccess: true });
             };
             request.onerror = (event) => {
-                console.trace('Error deleting database:', event.target.error);
-                resolve({ messageError: get(event.target.error, 'message'), deleteSuccess: false });
+                const error = event.target.error;
+                console.trace('Error deleting database:', error);
+                resolve({ messageError: get(error || {}, 'message'), deleteSuccess: false });
             };
             request.onblocked = () => {
                 console.trace('Delete request is blocked');
@@ -1247,7 +1425,7 @@ dayjs.extend(updateLocale);
 dayjs.extend(utc);
 dayjs.extend(timezone);
 dayjs.extend(customParseFormat);
-let timeZoneSetup = "Asia/Ho_Chi_Minh";
+let timeZoneSetup = 'Asia/Ho_Chi_Minh';
 const setDefaultTimeZone = (localeZone = timeZoneSetup) => {
     timeZoneSetup = localeZone;
     dayjs.tz.setDefault(localeZone);
@@ -1257,23 +1435,25 @@ const updateFunctionFormatDate = (functionCustom) => {
     functionFormatDate = functionCustom;
 };
 /**
-  * @description Lấy đối tượng dayjs theo config
-  * @param config nếu không có config sẽ trả về đối tượng dayjs là thời gian hiện tại
-  * @param config.date thời gian cần lấy
-  * @param config.returnDayjsIfConfigDateNotExist true nếu muốn trả về đối tượng dayjs nếu config.date không có
-  * @param config.utc true nếu muốn lấy thời gian UTC
-  * @param config.formatOfDate định dạng thời gian đang được truyền vào
-*/
+ * @description Lấy đối tượng dayjs theo config
+ * @param config nếu không có config sẽ trả về đối tượng dayjs là thời gian hiện tại
+ * @param config.date thời gian cần lấy
+ * @param config.returnDayjsIfConfigDateNotExist true nếu muốn trả về đối tượng dayjs nếu config.date không có
+ * @param config.utc true nếu muốn lấy thời gian UTC
+ * @param config.formatOfDate định dạng thời gian đang được truyền vào
+ */
 const getDayjs = (config) => {
+    // helper cast để tránh lặp lại kiểu điều kiện ở các return
+    const out = (v) => v;
     if (!config) {
-        return dayjs().tz();
+        return out(dayjs().tz());
     }
     config.date = !config.date && config.returnDayjsIfConfigDateNotExist ? dayjs().tz() : config.date;
     if (typeof config.date === 'number') {
         config.date = dayjs.unix(config.date);
     }
     if (!config.date) {
-        return undefined;
+        return out(undefined);
     }
     let { date, utc, formatOfDate } = config;
     while (isSignal(date)) {
@@ -1287,18 +1467,18 @@ const getDayjs = (config) => {
     }
     if (utc) {
         if (formatOfDate) {
-            return dayjs(date, formatOfDate).utc();
+            return out(dayjs(date, formatOfDate).utc());
         }
         const dateInputIsUTC = (dayjs.isDayjs(date) && date.isUTC()) || (typeof date === 'string' && date.includes('Z'));
         if (dateInputIsUTC) {
-            return dayjs(date);
+            return out(dayjs(date));
         }
-        return dayjs(date).utc();
+        return out(dayjs(date).utc());
     }
     if (typeof date === 'string' && !date.includes('Z') && !date.includes('+')) {
-        return (formatOfDate ? dayjs.tz(date, formatOfDate, config.localeZone || timeZoneSetup) : dayjs.tz(date, config.localeZone || timeZoneSetup));
+        return out(formatOfDate ? dayjs.tz(date, formatOfDate, config.localeZone || timeZoneSetup) : dayjs.tz(date, config.localeZone || timeZoneSetup));
     }
-    return (formatOfDate ? dayjs(date, formatOfDate) : dayjs(date)).tz();
+    return out((formatOfDate ? dayjs(date, formatOfDate) : dayjs(date)).tz());
 };
 /**
  * @description Kiểm tra xem hai ngày có khác nhau không (khác ngày trong tuần)
@@ -1356,7 +1536,7 @@ const formatDate = (date, formatOutput = 'YYYY/MM/DD HH:mm', lang, formatInput)
     date = getDayjs({ date, formatOfDate: formatInput }).locale(lang);
     if (lang === 'vi') {
         dayjs.updateLocale('vi', {
-            monthsShort: 'Thg 1_Thg 2_Thg 3_Thg 4_Thg 5_Thg 6_Thg 7_Thg 8_Thg 9_Thg 10_Thg 11_Thg 12'.split('_')
+            monthsShort: 'Thg 1_Thg 2_Thg 3_Thg 4_Thg 5_Thg 6_Thg 7_Thg 8_Thg 9_Thg 10_Thg 11_Thg 12'.split('_'),
         });
     }
     return date.format(getFormatData(getTypeByFormat(formatOutput), lang)) || '';
@@ -1421,6 +1601,207 @@ const getFormatData = (type, lang) => {
     }
 };
 
+/* eslint-disable @typescript-eslint/no-explicit-any */
+const UtilsHttpParamsRequestInstance = (options, instance) => {
+    return new UtilsHttpParamsRequest(options, instance);
+};
+class UtilsHttpParamsRequest extends HttpParams {
+    params = new HttpParams();
+    constructor(options, instance) {
+        super(options);
+        if (!instance) {
+            this.params = new HttpParams(options);
+            return;
+        }
+        if (instance instanceof UtilsHttpParamsRequest) {
+            this.params = instance.getInstance();
+            return;
+        }
+        if (instance instanceof HttpParams) {
+            this.params = instance;
+            return;
+        }
+    }
+    getInstance() {
+        return this.params;
+    }
+    setInstance(instance) {
+        if (instance instanceof UtilsHttpParamsRequest) {
+            this.params = instance.getInstance();
+            return;
+        }
+        if (instance instanceof HttpParams) {
+            this.params = instance;
+            return;
+        }
+    }
+    set(param, value) {
+        this.params = this.params.set(param, value);
+        return this;
+    }
+    has(param) {
+        return this.params.has(param);
+    }
+    get(param) {
+        return this.params.get(param);
+    }
+    getAll(param) {
+        return this.params.getAll(param);
+    }
+    keys() {
+        return this.params.keys();
+    }
+    append(param, value) {
+        this.params = this.params.append(param, value);
+        return this;
+    }
+    appendAll(params) {
+        this.params = this.params.appendAll(params);
+        return this;
+    }
+    delete(param, value) {
+        this.params = this.params.delete(param, value);
+        return this;
+    }
+    toString() {
+        return this.params.toString();
+    }
+}
+// Demo su dung GET_PATH_VARIABLE
+// interface Person {
+//   name: string;
+//   age: number;
+//   location: string;
+// }
+// type c = GET_PATH_VARIABLE<Person, unknown>;
+// const a: c = {
+//   "pathVariable-age": 1,
+//   "pathVariable-location": '12',
+//   "pathVariable-name": '124',
+// };
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/**
+ * Chuyển đổi một đối tượng hoặc giá trị thành signal
+ * @param data Dữ liệu cần chuyển đổi thành signal
+ * @param cloneDeepIfNotSignal Có thực hiện sao chép sâu dữ liệu trước khi chuyển đổi hay không nếu data không phải signal. Mặc định là true.
+ * Đặt false nếu muốn giữ nguyên tham chiếu đến dữ liệu gốc.
+ * Nếu muốn sao chép sâu đối tượng signal thì đặt cloneDeepIfNotSignal là true và acceptConvertObjectInnerWritableSignal là true.
+ * @param isSignalPrimitiveType Có chuyển đổi các giá trị nguyên thủy (string, number, boolean) thành signal hay không. Mặc định là false.
+ * Đặt true nếu muốn bọc các giá trị nguyên thủy trong signal.
+ * @param acceptConvertObjectInnerWritableSignal Có tiếp tục tìm kiếm và chuyển đổi các đối tượng bên trong signal hay không. Mặc định là false.
+ * Đặt true nếu muốn tìm và chuyển đổi các đối tượng bên trong signal hoặc chính nó thành signal mới.
+ * @returns Dữ liệu đã được chuyển đổi theo kiểu T
+ */
+const convertObjectToSignal = (data, cloneDeepIfNotSignal = true, isSignalPrimitiveType = false, acceptConvertObjectInnerWritableSignal = false, seen = new WeakMap()) => {
+    if ((data === null || typeof data !== 'object') && !isSignal(data)) {
+        return (isSignalPrimitiveType ? signal(data) : data);
+    }
+    if (seen.has(data)) {
+        return seen.get(data);
+    }
+    if (isSignal(data)) {
+        if (!acceptConvertObjectInnerWritableSignal) {
+            return data;
+        }
+        seen.set(data, convertObjectToSignal(data(), cloneDeepIfNotSignal, isSignalPrimitiveType, acceptConvertObjectInnerWritableSignal, seen));
+        return seen.get(data);
+    }
+    if (isArrayObject(data)) {
+        seen.set(data, signal(data.map((item) => convertObjectToSignal(item, cloneDeepIfNotSignal, isSignalPrimitiveType, acceptConvertObjectInnerWritableSignal, seen))));
+        return seen.get(data);
+    }
+    if (isMapObject(data)) {
+        const mapCopy = new Map();
+        Array.from(data.keys()).forEach((key) => {
+            mapCopy.set(key, convertObjectToSignal(data.get(key), cloneDeepIfNotSignal, isSignalPrimitiveType, acceptConvertObjectInnerWritableSignal));
+        });
+        seen.set(data, signal(mapCopy));
+        return seen.get(data);
+    }
+    // Bỏ qua các đối tượng async
+    if (isAsyncObject(data)) {
+        return data;
+    }
+    data = signal(cloneDeepIfNotSignal ? { ...data } : data);
+    seen.set(data, data);
+    for (const key in data()) {
+        const value = data()[key];
+        // Bỏ qua các đối tượng nguy hiểm và đặc biệt
+        if (isReturnAsIsObject(value)) {
+            continue;
+        }
+        if (Object.prototype.hasOwnProperty.call(data(), key)) {
+            data()[key] = convertObjectToSignal(value, cloneDeepIfNotSignal, isSignalPrimitiveType, acceptConvertObjectInnerWritableSignal);
+        }
+    }
+    return data;
+};
+const convertSignalToObject = (data, isCloneDeep = true, seen = new WeakMap()) => {
+    let ignoreCheckSeenHasDataAfterWhile = false;
+    while (isSignal(data) && !seen.has(data)) {
+        const dataConvert = data();
+        if (typeof dataConvert === 'object') {
+            if (dataConvert === null || isReturnAsIsObject(dataConvert)) {
+                return dataConvert;
+            }
+            seen.set(dataConvert, dataConvert);
+            data = dataConvert;
+            ignoreCheckSeenHasDataAfterWhile = true;
+            break;
+        }
+        seen.set(data, dataConvert);
+        data = dataConvert;
+    }
+    if (data === null || typeof data === 'function' || typeof data !== 'object' || isReturnAsIsObject(data)) {
+        return data;
+    }
+    if (!ignoreCheckSeenHasDataAfterWhile && seen.has(data)) {
+        return seen.get(data);
+    }
+    if (isArrayObject(data)) {
+        if (!isSignal(data[0])) {
+            return data;
+        }
+        seen.set(data, data.map((item) => convertSignalToObject(isCloneDeep ? cloneDeep(item) : item, isCloneDeep, seen)));
+        return seen.get(data);
+    }
+    if (isMapObject(data)) {
+        const mapCopy = new Map();
+        Array.from(data.keys()).forEach((key) => {
+            mapCopy.set(key, convertSignalToObject(isCloneDeep ? cloneDeep(data.get(key)) : data.get(key), isCloneDeep));
+        });
+        seen.set(data, mapCopy);
+        return seen.get(data);
+    }
+    if (isSetObject(data)) {
+        const setCopy = new Set();
+        Array.from(data.values()).forEach((value) => {
+            setCopy.add(convertSignalToObject(isCloneDeep ? cloneDeep(value) : value, isCloneDeep));
+        });
+        seen.set(data, setCopy);
+        return seen.get(data);
+    }
+    // Bỏ qua các đối tượng nguy hiểm và đặc biệt
+    if (isReturnAsIsObject(data)) {
+        return data;
+    }
+    const result = isCloneDeep ? {} : data;
+    seen.set(data, result);
+    for (const key in data) {
+        const value = data[key];
+        if (Object.prototype.hasOwnProperty.call(data, key)) {
+            // Bỏ qua các đối tượng nguy hiểm để tránh maximum call stack
+            if (isReturnAsIsObject(value)) {
+                result[key] = value;
+                continue;
+            }
+            result[key] = convertSignalToObject(isCloneDeep ? cloneDeep(value) : value, isCloneDeep);
+        }
+    }
+    return result;
+};
+
 /* eslint-disable @typescript-eslint/no-explicit-any */
 /**Các hàm tương tự thư viện lodash */
 /**
@@ -1433,7 +1814,10 @@ const getFormatData = (type, lang) => {
  * isNil(0); // false
  * isNil('hello'); // false
  */
-const isNil = (value) => {
+const isNil = (value, options) => {
+    if (!options?.ignoreUnWrapSignal) {
+        value = convertSignalToObject(value);
+    }
     return value === null || value === undefined;
 };
 /**
@@ -1449,11 +1833,78 @@ const isNil = (value) => {
  * isEmpty([1, 2, 3]); // false
  * isEmpty({ a: 1 }); // false
  */
-const isEmpty = (value) => {
-    while (isSignal(value)) {
-        value = value();
+const isEmpty = (value, options) => {
+    if (!options?.ignoreUnWrapSignal) {
+        value = convertSignalToObject(value);
+    }
+    if (options?.ignoreCheckTypePrimitive) {
+        return isEmptyTypeObject(value);
+    }
+    return isEmptyTypePrimitive(value, { ignoreCheckString: options?.ignoreCheckString }) || isEmptyTypeObject(value);
+};
+/**
+ * Kiểm tra xem một giá trị có phải là object rỗng hay không
+ * @param value Giá trị cần kiểm tra
+ * @returns true nếu giá trị là object rỗng, false nếu không
+ * @example
+ * isEmptyTypeObject({}); // true
+ * isEmptyTypeObject({ a: 1 }); // false
+ */
+const isEmptyTypeObject = (value) => {
+    return typeof value === 'object' && (JSON.stringify(value) === '{}' || JSON.stringify(value) === '[]');
+};
+const isEmptyTypePrimitive = (value, options) => {
+    if (options?.ignoreCheckString && value === '') {
+        return false;
+    }
+    return value === '' || isNil(value, { ignoreUnWrapSignal: true });
+};
+/**
+ * Kiểm tra xem một giá trị có phải là null, rỗng, undefined hoặc 0 hay không
+ * @param value Giá trị cần kiểm tra
+ * @param options Cấu hình tùy chọn
+ * @param options.ignoreZero Nếu true, sẽ không kiểm tra giá trị 0
+ * @returns true nếu giá trị là null, rỗng, undefined hoặc 0, false nếu không
+ * @example
+ * isTruthy(null); // false
+ * isTruthy(''); // false
+ * isTruthy(undefined); // false
+ * isTruthy(0); // false
+ * isTruthy({}); // true
+ * isTruthy(0, { ignoreZero: true }); // true
+ */
+const isTruthy = (value, options) => {
+    return !isFalsy(value, options);
+};
+/**
+ * Kiểm tra xem một giá trị có phải là null, rỗng, undefined hoặc 0 hay không
+ * @param value Giá trị cần kiểm tra
+ * @param options Cấu hình tùy chọn
+ * @param options.ignoreZero Nếu true, sẽ không kiểm tra giá trị 0
+ * @returns true nếu giá trị là null, rỗng, undefined hoặc 0, false nếu không
+ * @example
+ * isFalsy(null); // true
+ * isFalsy(''); // true
+ * isFalsy(undefined); // true
+ * isFalsy(0); // true
+ * isFalsy({}); // false
+ * isFalsy(0, { ignoreZero: true }); // false
+ */
+const isFalsy = (value, options) => {
+    if (!options?.ignoreUnWrapSignal) {
+        value = convertSignalToObject(value);
     }
-    return value === null || value === '' || value === undefined || (typeof value === 'object' && (JSON.stringify(value) === '{}' || JSON.stringify(value) === '[]'));
+    const isFalse = !value;
+    if (!isFalse) {
+        return false;
+    }
+    if (options?.ignoreZero && value === 0) {
+        return false;
+    }
+    if (options?.ignoreCheckString && value === '') {
+        return false;
+    }
+    return isFalse;
 };
 /**
  * Loại bỏ các thuộc tính của đối tượng dựa trên một hàm điều kiện
@@ -1469,7 +1920,7 @@ const omitBy = (objData, predicate) => {
         return objData;
     }
     const newObj = {};
-    Object.keys(objData).forEach(key => {
+    Object.keys(objData).forEach((key) => {
         const valueOfKey = get(objData, key);
         if (!predicate(valueOfKey)) {
             set(newObj, key, valueOfKey);
@@ -1540,23 +1991,30 @@ const omitBy = (objData, predicate) => {
  * get(null, 'any.path'); // undefined
  * get(undefined, 'any.path', 'fallback'); // 'fallback'
  */
-const get = (obj, path, defaultValue = undefined, keepLastValueIfSignal) => {
+const get = (obj, path, defaultValue, keepLastValueIfSignal) => {
+    // helper cast để tránh lặp lại kiểu điều kiện ở các return
+    const out = (v) => v;
     if (isNil(obj)) {
-        return defaultValue;
+        return out(defaultValue);
     }
     while (isSignal(obj)) {
         obj = obj();
     }
     if (path === '') {
-        return obj;
+        return out(obj);
     }
     if (obj instanceof HttpParams) {
-        return obj.get(`${path}`);
+        return out(obj.get(`${path}`) ?? defaultValue);
     }
     if (obj instanceof DOMRect) {
-        return obj[path];
-    }
-    const paths = Array.isArray(path) ? path : path.replace(/\[(\d+)]/g, '.$1').split('.').filter(key => key);
+        return out(obj[path]);
+    }
+    const paths = Array.isArray(path)
+        ? path
+        : path
+            .replace(/\[(\d+)]/g, '.$1')
+            .split('.')
+            .filter((key) => key);
     for (const index in paths) {
         const key = paths[index];
         if (obj instanceof CSSStyleDeclaration) {
@@ -1568,12 +2026,12 @@ const get = (obj, path, defaultValue = undefined, keepLastValueIfSignal) => {
             continue;
         }
         if (isNil(obj) || !Object.prototype.hasOwnProperty.call(obj, key)) {
-            return defaultValue;
+            return out(defaultValue);
         }
         const val = isSignal(obj[key]) && !keepLastValueIfSignal ? obj[key]() : obj[key];
         obj = val;
     }
-    return obj;
+    return out(obj ?? defaultValue);
 };
 /**
  * Thiết lập giá trị cho một thuộc tính trong đối tượng theo đường dẫn chỉ định
@@ -1586,29 +2044,36 @@ const get = (obj, path, defaultValue = undefined, keepLastValueIfSignal) => {
  * const obj = { a: { b: 1 } };
  * set(obj, 'a.b', 2); // { a: { b: 2 } }
  */
-const set = (obj, path, value) => {
-    if (!obj || (typeof obj !== "object" && !isSignal(obj)) || (isSignal(obj) && typeof obj() !== "object")) {
-        throw new Error("The first argument must be an object");
+const set = (obj, path, value, options) => {
+    if (!obj || (typeof obj !== 'object' && !isSignal(obj)) || (isSignal(obj) && typeof obj() !== 'object')) {
+        throw new Error('The first argument must be an object');
     }
     if (obj instanceof HttpParams) {
         return obj.set(`${path}`, value);
     }
-    const pathArray = Array.isArray(path) ? path : path.replace(/\[(\d+)]/g, '.[$1]').split('.').filter(key => key);
+    const pathArray = Array.isArray(path)
+        ? path
+        : path
+            .replace(/\[(\d+)]/g, '.[$1]')
+            .split('.')
+            .filter((key) => key);
     let currentObjectByKey = isSignal(obj) ? obj() : obj;
     let preObjectByKey = obj;
     pathArray.forEach((key, index) => {
         if (index < pathArray.length - 1) {
-            if (!(key in currentObjectByKey) || (typeof currentObjectByKey[key] !== "object" && !isSignal(currentObjectByKey[key]))) {
+            if (!(key in currentObjectByKey) || (typeof currentObjectByKey[key] !== 'object' && !isSignal(currentObjectByKey[key]))) {
                 const nextKey = pathArray[index + 1];
                 key = key.replace(/\[(\d+)]/g, '$1');
-                currentObjectByKey[key] = /\[(\d+)]/g.test(nextKey) ? [] : {};
+                if (isNil(currentObjectByKey[key])) {
+                    currentObjectByKey[key] = /\[(\d+)]/g.test(nextKey) ? (options?.valueDefaultPathArrayUndefined ?? []) : (options?.valueDefaultPathObjectUndefined ?? {});
+                }
             }
             currentObjectByKey = key ? currentObjectByKey[key] : currentObjectByKey;
             preObjectByKey = currentObjectByKey;
             currentObjectByKey = isSignal(currentObjectByKey) ? currentObjectByKey() : currentObjectByKey;
             return;
         }
-        if (typeof currentObjectByKey !== "object") {
+        if (typeof currentObjectByKey !== 'object') {
             return;
         }
         // Gán giá trị ở cuối đường dẫn
@@ -1660,7 +2125,7 @@ const set = (obj, path, value) => {
  * // clone là một bản sao hoàn toàn độc lập của obj
  */
 const cloneDeep = (data, options = { ignoreSignal: false }, seen = new WeakMap()) => {
-    if (data === null || (typeof data !== 'object' && !isSignal(data))) {
+    if (data === null || (typeof data !== 'object' && !isSignal(data)) || isDangerousObject(data)) {
         return data;
     }
     if (seen.has(data)) {
@@ -1689,19 +2154,16 @@ const cloneDeep = (data, options = { ignoreSignal: false }, seen = new WeakMap()
     if (data instanceof Set) {
         const setCopy = new Set();
         seen.set(data, setCopy);
-        data.forEach(val => {
+        data.forEach((val) => {
             setCopy.add(cloneDeep(val, options, seen));
         });
         return setCopy;
     }
     if (Array.isArray(data)) {
-        seen.set(data, data.map(item => cloneDeep(item, options, seen)));
+        seen.set(data, data.map((item) => cloneDeep(item, options, seen)));
         return seen.get(data);
     }
-    if (data instanceof File || data instanceof Blob || Object.prototype.toString.call(data) === '[object File]') {
-        return data;
-    }
-    if (data instanceof TemplateRef || data instanceof ElementRef || data instanceof Element || data instanceof Promise || data instanceof Observable) {
+    if (isReturnAsIsObject(data)) {
         return data;
     }
     if (isSignal(data)) {
@@ -1719,11 +2181,19 @@ const cloneDeep = (data, options = { ignoreSignal: false }, seen = new WeakMap()
             result[key] = new UtilsHttpParamsRequest(undefined, value);
             continue;
         }
+        if (value instanceof Date) {
+            result[key] = new Date(value.getTime());
+            continue;
+        }
         if (dayjs.isDayjs(value)) {
             result[key] = getDayjs({ date: value.valueOf() });
             continue;
         }
-        if (value instanceof TemplateRef || value instanceof ElementRef || value instanceof Element || value instanceof Promise || value instanceof Observable) {
+        if (value instanceof RegExp) {
+            result[key] = new RegExp(value.source, value.flags);
+            continue;
+        }
+        if (isReturnAsIsObject(data)) {
             result[key] = value;
             continue;
         }
@@ -1786,7 +2256,7 @@ const keyBy = (data, key) => {
  * // }
  */
 const groupBy = (data, key) => {
-    if (!data || !data.length || !Object.keys(get(data, '0')).length || !key) {
+    if (!data || !data.length || !Object.keys(get(data, '[0]')).length || !key) {
         return {};
     }
     return data.reduce((dir, nextItem) => {
@@ -1855,6 +2325,11 @@ const range = (start, end, step) => {
  * isEqual({a:1}, {a:1}); // true
  */
 const isEqual = (value1, value2, options) => {
+    // Handle signals
+    if (!options?.ignoreUnWrapSignal) {
+        value1 = convertSignalToObject(value1);
+        value2 = convertSignalToObject(value2);
+    }
     const { exactlyPosition = false, ignoreExactlyDataType = false } = options || {};
     if (value1 === value2 || (value1 === null && value2 === null) || (value1 === undefined && value2 === undefined)) {
         return true;
@@ -1862,13 +2337,6 @@ const isEqual = (value1, value2, options) => {
     if (ignoreExactlyDataType) {
         return isEqual(isNil(value1) ? undefined : `${value1}`, isNil(value2) ? undefined : `${value2}`);
     }
-    // Handle signals
-    while (isSignal(value1)) {
-        value1 = value1();
-    }
-    while (isSignal(value2)) {
-        value2 = value2();
-    }
     if (typeof value1 !== 'object' || typeof value2 !== 'object' || (Array.isArray(value1) && !Array.isArray(value2)) || (!Array.isArray(value1) && Array.isArray(value2))) {
         return false;
     }
@@ -1877,7 +2345,7 @@ const isEqual = (value1, value2, options) => {
             return false;
         }
         if (!exactlyPosition) {
-            return !value1.some(item => !value2.includes(item));
+            return !value1.some((item) => !value2.includes(item));
         }
         return !value1.some((item, index) => !isEqual(item, value2[index], options));
     }
@@ -1906,11 +2374,11 @@ const isEqual = (value1, value2, options) => {
  * uniqBy(numbersSignal); // [signal(1), signal(2), signal(3), signal(5), signal(4), signal(6), signal(7)]
  */
 const uniqBy = (data, key) => {
-    if (!key || !data?.length || typeof get(data, '0') !== 'object') {
+    if (!key || !data?.length || typeof get(data, '[0]') !== 'object') {
         // Xử lý mảng chứa signal values
         if (data[0] && isSignal(data[0])) {
             const seen = new Set();
-            return data.filter(item => {
+            return data.filter((item) => {
                 const value = `${get(item, '')}`;
                 if (seen.has(value)) {
                     return false;
@@ -1923,7 +2391,7 @@ const uniqBy = (data, key) => {
         return Array.from(new Set(data));
     }
     const dataUnique = keyBy(data, key);
-    return Object.keys(dataUnique).map(key => dataUnique[key]);
+    return Object.keys(dataUnique).map((key) => dataUnique[key]);
 };
 const generateInterface = (obj, interfaceName) => {
     const generateType = (value) => {
@@ -1972,11 +2440,10 @@ const generateInterface = (obj, interfaceName) => {
     return interfaceStr;
 };
 
-;
 const step = 20;
 const percent = 0.05;
 const colorStepContrastFromOrigin = (color, stepNumber) => {
-    return colorContrastFromOrigin(color).find(item => item.step === stepNumber);
+    return colorContrastFromOrigin(color).find((item) => item.step === stepNumber);
 };
 const colorContrastFromOrigin = (color) => {
     const parsedColorsArray = parseColorValues(color);
@@ -2011,10 +2478,10 @@ const parseColorValues = (colorValues) => {
     return colorValuesArray;
 };
 const calculateShades = (colorValue) => {
-    return calculate(colorValue, rgbShade).concat("000000");
+    return calculate(colorValue, rgbShade).concat('000000');
 };
 const calculateTints = (colorValue) => {
-    return calculate(colorValue, rgbTint).concat("ffffff");
+    return calculate(colorValue, rgbTint).concat('ffffff');
 };
 const calculate = (colorValue, shadeOrTint) => {
     const color = hexToRGB(colorValue);
@@ -2024,11 +2491,21 @@ const calculate = (colorValue, shadeOrTint) => {
     }
     return shadeValues;
 };
-const rgbShade = (rgb, i) => { return { red: rgb.red * (1 - percent * i), green: rgb.green * (1 - percent * i), blue: rgb.blue * (1 - percent * i) }; };
-const rgbTint = (rgb, i) => { return { red: rgb.red + (255 - rgb.red) * i * percent, green: rgb.green + (255 - rgb.green) * i * percent, blue: rgb.blue + (255 - rgb.blue) * i * percent }; };
-const rgbToHex = (rgb) => { return intToHex(rgb.red) + intToHex(rgb.green) + intToHex(rgb.blue); };
-const hexToRGB = (colorValue) => { return { red: parseInt(colorValue.substr(0, 2), 16), green: parseInt(colorValue.substr(2, 2), 16), blue: parseInt(colorValue.substr(4, 2), 16) }; };
-const intToHex = (rgbint) => { return pad(Math.min(Math.max(Math.round(rgbint), 0), 255).toString(16), 2); };
+const rgbShade = (rgb, i) => {
+    return { red: rgb.red * (1 - percent * i), green: rgb.green * (1 - percent * i), blue: rgb.blue * (1 - percent * i) };
+};
+const rgbTint = (rgb, i) => {
+    return { red: rgb.red + (255 - rgb.red) * i * percent, green: rgb.green + (255 - rgb.green) * i * percent, blue: rgb.blue + (255 - rgb.blue) * i * percent };
+};
+const rgbToHex = (rgb) => {
+    return intToHex(rgb.red) + intToHex(rgb.green) + intToHex(rgb.blue);
+};
+const hexToRGB = (colorValue) => {
+    return { red: parseInt(colorValue.substr(0, 2), 16), green: parseInt(colorValue.substr(2, 2), 16), blue: parseInt(colorValue.substr(4, 2), 16) };
+};
+const intToHex = (rgbint) => {
+    return pad(Math.min(Math.max(Math.round(rgbint), 0), 255).toString(16), 2);
+};
 const pad = (number, length) => {
     let str = '' + number;
     while (str.length < length) {
@@ -2036,9 +2513,52 @@ const pad = (number, length) => {
     }
     return str;
 };
-const listColorDefine = ['#E62222', '#B81B1B', '#EB4E4E', '#F97316', '#C75C12', '#FA8F45', '#FFB700', '#CC9200', '#FFC533', '#84CC16', '#6AA312', '#9dd645', '#00BC62', '#00A757', '#33DA8A', '#06B6D4', '#1B59C4', '#4E8CF7', '#0EA5E9',
-    '#1B59C4', '#4E8CF7', '#226FF5', '#1B59C4', '#4E8CF7', '#6366F1', '#4F52C1', '#8285F4', '#5B04B3', '#49038F', '#7C36C2', '#D946EF', '#AE38BF', '#E16BF2', '#EC4899', '#BD3A7A', '#F06DAD', '#F43F5E', '#C3324B', '#F6657E', '#757380', '#5E5C66', '#918F99',
-    '#202020', '#1A1A1A', '#4D4D4D'
+const listColorDefine = [
+    '#E62222',
+    '#B81B1B',
+    '#EB4E4E',
+    '#F97316',
+    '#C75C12',
+    '#FA8F45',
+    '#FFB700',
+    '#CC9200',
+    '#FFC533',
+    '#84CC16',
+    '#6AA312',
+    '#9dd645',
+    '#00BC62',
+    '#00A757',
+    '#33DA8A',
+    '#06B6D4',
+    '#1B59C4',
+    '#4E8CF7',
+    '#0EA5E9',
+    '#1B59C4',
+    '#4E8CF7',
+    '#226FF5',
+    '#1B59C4',
+    '#4E8CF7',
+    '#6366F1',
+    '#4F52C1',
+    '#8285F4',
+    '#5B04B3',
+    '#49038F',
+    '#7C36C2',
+    '#D946EF',
+    '#AE38BF',
+    '#E16BF2',
+    '#EC4899',
+    '#BD3A7A',
+    '#F06DAD',
+    '#F43F5E',
+    '#C3324B',
+    '#F6657E',
+    '#757380',
+    '#5E5C66',
+    '#918F99',
+    '#202020',
+    '#1A1A1A',
+    '#4D4D4D',
 ];
 const getColorById = (str) => {
     let hashString = 0;
@@ -2047,7 +2567,7 @@ const getColorById = (str) => {
     }
     for (let i = 0; i < str.length; i++) {
         const char = str.charCodeAt(i);
-        hashString = ((hashString << 5) - hashString) + char;
+        hashString = (hashString << 5) - hashString + char;
         hashString = hashString & hashString;
     }
     return listColorDefine[Math.abs(hashString) % listColorDefine.length];
@@ -2187,8 +2707,8 @@ const getKeyCacheByArrayObject = (keyCache, argumentsValue) => {
                 keyBuild = `${keyBuild}${JSON.stringify(item)}`;
                 return;
             }
-            const keys = (item instanceof HttpParams ? item.keys() : Object.keys(item)).sort(((str1, str2) => str1.localeCompare(str2)));
-            keys.forEach(key => {
+            const keys = (item instanceof HttpParams ? item.keys() : Object.keys(item)).sort((str1, str2) => str1.localeCompare(str2));
+            keys.forEach((key) => {
                 if (key.toLocaleLowerCase() === 'pem') {
                     return;
                 }
@@ -2232,7 +2752,7 @@ const viewDataNumberByLanguage = (value, acceptNegativeValue, parseFixed = 1, ig
         return Math.round(value * fixed) / fixed;
     };
     if (parseFixed > (floatStr?.length || 0)) {
-        const maxParseFixed = (acceptNegativeValue && +value < 0) ? 17 : 16;
+        const maxParseFixed = acceptNegativeValue && +value < 0 ? 17 : 16;
         const fixed = maxParseFixed - (intStr?.length || 0);
         parseFixed = parseFixed < fixed ? parseFixed : fixed;
     }
@@ -2259,7 +2779,10 @@ const viewDataNumberByLanguage = (value, acceptNegativeValue, parseFixed = 1, ig
         if (lang === UtilsLanguageConstants.EN) {
             return value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
         }
-        return value.toString().replace('.', ',').replace(/\B(?=(\d{3})+(?!\d))/g, '.');
+        return value
+            .toString()
+            .replace('.', ',')
+            .replace(/\B(?=(\d{3})+(?!\d))/g, '.');
     }
 };
 
@@ -2273,120 +2796,14 @@ const xssFilter = async (data) => {
     return await functionXssFilter(data);
 };
 
-/* eslint-disable @typescript-eslint/no-explicit-any */
-/**
- * Chuyển đổi một đối tượng hoặc giá trị thành signal
- * @param data Dữ liệu cần chuyển đổi thành signal
- * @param cloneDeepIfNotSignal Có thực hiện sao chép sâu dữ liệu trước khi chuyển đổi hay không nếu data không phải signal. Mặc định là true.
- * Đặt false nếu muốn giữ nguyên tham chiếu đến dữ liệu gốc.
- * Nếu muốn sao chép sâu đối tượng signal thì đặt cloneDeepIfNotSignal là true và acceptConvertObjectInnerWritableSignal là true.
- * @param isSignalPrimitiveType Có chuyển đổi các giá trị nguyên thủy (string, number, boolean) thành signal hay không. Mặc định là false.
- * Đặt true nếu muốn bọc các giá trị nguyên thủy trong signal.
- * @param acceptConvertObjectInnerWritableSignal Có tiếp tục tìm kiếm và chuyển đổi các đối tượng bên trong signal hay không. Mặc định là false.
- * Đặt true nếu muốn tìm và chuyển đổi các đối tượng bên trong signal hoặc chính nó thành signal mới.
- * @returns Dữ liệu đã được chuyển đổi theo kiểu T
- */
-const convertObjectToSignal = (data, cloneDeepIfNotSignal = true, isSignalPrimitiveType = false, acceptConvertObjectInnerWritableSignal = false, seen = new WeakMap()) => {
-    if ((data === null || typeof data !== 'object') && !isSignal(data)) {
-        return (isSignalPrimitiveType ? signal(data) : data);
-    }
-    if (seen.has(data)) {
-        return seen.get(data);
-    }
-    if (isSignal(data)) {
-        if (!acceptConvertObjectInnerWritableSignal) {
-            return data;
-        }
-        seen.set(data, convertObjectToSignal(data(), cloneDeepIfNotSignal, isSignalPrimitiveType, acceptConvertObjectInnerWritableSignal, seen));
-        return seen.get(data);
-    }
-    if (Array.isArray(data)) {
-        seen.set(data, signal(data.map(item => convertObjectToSignal(item, cloneDeepIfNotSignal, isSignalPrimitiveType, acceptConvertObjectInnerWritableSignal, seen))));
-        return seen.get(data);
-    }
-    if (data instanceof Map) {
-        const mapCopy = new Map();
-        Array.from(data.keys()).forEach(key => {
-            mapCopy.set(key, convertObjectToSignal(data.get(key), cloneDeepIfNotSignal, isSignalPrimitiveType, acceptConvertObjectInnerWritableSignal));
-        });
-        seen.set(data, signal(mapCopy));
-        return seen.get(data);
-    }
-    if (data instanceof Promise || data instanceof Observable) {
-        return data;
-    }
-    data = signal(cloneDeepIfNotSignal ? { ...data } : data);
-    seen.set(data, data);
-    for (const key in data()) {
-        const value = data()[key];
-        if (value instanceof TemplateRef || value instanceof File || value instanceof Blob || Object.prototype.toString.call(value) === '[object File]' || value instanceof ElementRef || value instanceof Element || value instanceof Date || value instanceof RegExp || value instanceof Set || value instanceof Map || value instanceof Promise || value instanceof Observable || value instanceof HttpParams) {
-            continue;
-        }
-        if (Object.prototype.hasOwnProperty.call(data(), key)) {
-            data()[key] = convertObjectToSignal(value, cloneDeepIfNotSignal, isSignalPrimitiveType, acceptConvertObjectInnerWritableSignal);
-        }
-    }
-    return data;
-};
-const convertSignalToObject = (data, isCloneDeep = true, seen = new WeakMap()) => {
-    let ignoreCheckSeenHasDataAfterWhile = false;
-    while (isSignal(data) && !seen.has(data)) {
-        const dataConvert = data();
-        if (typeof dataConvert === 'object') {
-            if (dataConvert === null) {
-                return dataConvert;
-            }
-            seen.set(dataConvert, dataConvert);
-            data = dataConvert;
-            ignoreCheckSeenHasDataAfterWhile = true;
-            break;
-        }
-        seen.set(data, dataConvert);
-        data = dataConvert;
-    }
-    if (data === null || typeof data === 'function' || typeof data !== 'object') {
-        return data;
-    }
-    if (!ignoreCheckSeenHasDataAfterWhile && seen.has(data)) {
-        return seen.get(data);
-    }
-    if (Array.isArray(data)) {
-        if (!isSignal(data[0])) {
-            return data;
-        }
-        seen.set(data, data.map(item => convertSignalToObject((isCloneDeep ? cloneDeep(item) : item), isCloneDeep, seen)));
-        return seen.get(data);
-    }
-    if (data instanceof Map) {
-        const mapCopy = new Map();
-        Array.from(data.keys()).forEach(key => {
-            mapCopy.set(key, convertSignalToObject(isCloneDeep ? cloneDeep(data.get(key)) : data.get(key), isCloneDeep));
-        });
-        seen.set(data, mapCopy);
-        return seen.get(data);
-    }
-    if (data instanceof File || data instanceof Blob || Object.prototype.toString.call(data) === '[object File]') {
-        return data;
-    }
-    if (data instanceof TemplateRef || data instanceof ElementRef || data instanceof Element || data instanceof Promise || data instanceof Observable || data instanceof HttpParams) {
-        return data;
-    }
-    const result = isCloneDeep ? {} : data;
-    seen.set(data, result);
-    for (const key in data) {
-        const value = data[key];
-        if (Object.prototype.hasOwnProperty.call(data, key)) {
-            result[key] = convertSignalToObject(isCloneDeep ? cloneDeep(value) : value, isCloneDeep);
-        }
-    }
-    return result;
-};
-
 const ENCODE_URI_PATTERN = /%([0-9A-F]{2})/g;
 const decodeURI = (value) => {
-    return decodeURIComponent(value.split('').map((c) => {
+    return decodeURIComponent(value
+        .split('')
+        .map((c) => {
         return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
-    }).join(''));
+    })
+        .join(''));
 };
 const encodeURI = (value) => {
     return encodeURIComponent(value).replace(ENCODE_URI_PATTERN, (match, p1) => {
@@ -2394,7 +2811,7 @@ const encodeURI = (value) => {
     });
 };
 const endCodeUrl = (params, isBody) => {
-    params = omitBy(params, param => param === '' || isNil(param));
+    params = omitBy(params, (param) => param === '' || isNil(param));
     let res = '';
     for (const p in params) {
         res += `&${p}=${encodeURIComponent(params[p])}`;
@@ -2472,7 +2889,7 @@ const downloadFileByUrl = async (fileUrl, filename, onlyOpen) => {
 const downloadImageFromELement = (imageElement, typeFileDownload, nameFile) => {
     const parentElement = imageElement?.src;
     const blobData = convertBase64ToBlob(parentElement);
-    const blob = new Blob([blobData], { type: typeFileDownload || "image/png" });
+    const blob = new Blob([blobData], { type: typeFileDownload || 'image/png' });
     const url = window.URL.createObjectURL(blob);
     const link = document.createElement('a');
     link.href = url;
@@ -2484,12 +2901,22 @@ const LINK_IMAGE_ERROR_TOKEN_INJECT = new InjectionToken('LINK_IMAGE_ERROR_TOKEN
 const PROCESS_BAR_STANDARD_CONFIG_DEFAULT_TOKEN_INJECT = new InjectionToken('PROCESS_BAR_STANDARD_CONFIG_DEFAULT_TOKEN_INJECT');
 const PROCESS_BAR_STEPS_CONFIG_DEFAULT_TOKEN_INJECT = new InjectionToken('PROCESS_BAR_STEPS_CONFIG_DEFAULT_TOKEN_INJECT');
 
-const isTypeImage = (file) => file.type.match(/image.*/) ? true : false;
-const isTypeVideo = (file) => file.type.match(/video.*/) ? true : false;
-const isTypeAudio = (file) => file.type.match(/audio.*/) ? true : false;
-const isTypeFile = (file) => file instanceof File || Object.prototype.toString.call(file) === '[object File]' ? true : false;
+const isTypeImage = (file) => (file.type.match(/image.*/) ? true : false);
+const isTypeVideo = (file) => (file.type.match(/video.*/) ? true : false);
+const isTypeAudio = (file) => (file.type.match(/audio.*/) ? true : false);
+const isTypeFile = (file) => (file instanceof File || Object.prototype.toString.call(file) === '[object File]' ? true : false);
 const ExcelExtList = ['xls', 'xlsx', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'];
-const DocumentExtList = ['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'pdf', 'json', 'xml', 'application/msword',
+const DocumentExtList = [
+    'doc',
+    'docx',
+    'xls',
+    'xlsx',
+    'ppt',
+    'pptx',
+    'pdf',
+    'json',
+    'xml',
+    'application/msword',
     'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
     'application/vnd.ms-excel',
     'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
@@ -2497,7 +2924,8 @@ const DocumentExtList = ['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'pdf', 'js
     'application/vnd.openxmlformats-officedocument.presentationml.presentation',
     'application/pdf',
     'application/json',
-    'application/xml'];
+    'application/xml',
+];
 const isIncludeDocumentExtList = (ext, listExt = DocumentExtList) => listExt.includes(ext) || listExt.includes(`application/${ext}`);
 const ImageExtList = ['gif', 'jpg', 'jpeg', 'png', 'image/gif', 'image/jpeg', 'image/jpeg', 'image/png'];
 const isIncludeImageExtList = (ext, listExt = ImageExtList) => listExt.includes(ext);
@@ -2522,7 +2950,7 @@ const getFileExtension = (file) => {
         fileName = url.split('/').pop() || '';
         set(file, 'name', fileName);
     }
-    const dots = fileName.split(".");
+    const dots = fileName.split('.');
     if (!dots) {
         return;
     }
@@ -2548,6 +2976,7 @@ const convertUrlToFile = (url, fileName) => {
                 const file = convertBase64ToBlob(reader.result);
                 resolve(convertBlobToFile(file, fileName || Date.now().toLocaleString()));
             };
+            reader.onerror = () => resolve(undefined);
             reader.readAsDataURL(xhr.response);
         };
         xhr.onerror = (err) => {
@@ -2625,12 +3054,12 @@ const getSmartAxisScale = (originalMaxData, options) => {
                 }
                 const maxValuePositive = maxValue - Math.abs(minValue);
                 tickCount = maxValuePositive - originalMaxData > Math.abs(step) && tickCount - 1 >= minTickCount ? tickCount - 1 : tickCount;
-                maxValue = (step * tickCount * scaleDirection) - (minValue * scaleDirection);
+                maxValue = step * tickCount * scaleDirection - minValue * scaleDirection;
                 return {
                     stepSize: Math.abs(step),
                     max: maxValue,
                     min: minValue,
-                    tickAmount: tickCount
+                    tickAmount: tickCount,
                 };
             }
         }
@@ -2645,7 +3074,7 @@ const getSmartAxisScale = (originalMaxData, options) => {
         stepSize: Math.abs(step),
         max: maxValue,
         min: 0,
-        tickAmount: minTickCount
+        tickAmount: minTickCount,
     };
 };
 // Cache cho các giá trị lũy thừa 10 để tối ưu hiệu suất
@@ -2701,7 +3130,7 @@ const getStepCandidates = (maxData, minStep, minNegative, acceptStepIsTypeFloat
 const checkAndSetNegativeSteps = (stepCandidates, acceptNegative, minNegative) => {
     if (acceptNegative && minNegative < 0) {
         // Tạo các step âm và thêm vào đầu danh sách
-        const negativeSteps = [...stepCandidates].map(step => -step);
+        const negativeSteps = [...stepCandidates].map((step) => -step);
         stepCandidates.unshift(...negativeSteps);
     }
 };
@@ -2714,20 +3143,20 @@ const checkAndSetNegativeSteps = (stepCandidates, acceptNegative, minNegative) =
 const validateInputs = (maxData, options) => {
     // Kiểm tra maxData âm khi không chấp nhận giá trị âm
     if (maxData < 0 && !options?.acceptNegative) {
-        throw new Error("maxData is less than 0 and acceptNegative is false");
+        throw new Error('maxData is less than 0 and acceptNegative is false');
     }
     if (options?.acceptNegative) {
         // Kiểm tra minNegative có được cung cấp không
         if (isNil(options.minNegative)) {
-            throw new Error("minNegative is required when acceptNegative is true");
+            throw new Error('minNegative is required when acceptNegative is true');
         }
         // Kiểm tra maxData phải >= minNegative
         if (maxData < options.minNegative) {
-            throw new Error("maxData is less than minNegative");
+            throw new Error('maxData is less than minNegative');
         }
         // Kiểm tra minNegative phải là số âm
         if (options.minNegative >= 0) {
-            throw new Error("minNegative must be negative");
+            throw new Error('minNegative must be negative');
         }
     }
 };
@@ -2747,7 +3176,7 @@ const revealString = (encoded) => {
     const decoded = base
         .split('')
         .reverse()
-        .map(c => String.fromCharCode(c.charCodeAt(0) ^ xorKey))
+        .map((c) => String.fromCharCode(c.charCodeAt(0) ^ xorKey))
         .join('');
     return decoded;
 };
@@ -2778,5 +3207,5 @@ const createUniqueRandomIntGenerator = (min, max) => {
  * Generated bundle index. Do not edit.
  */
 
-export { AudioExtList, CHARACTER_DATA_EMPTY, COMMUNICATE_MICRO_KEY_GET_ALL_MESSAGE, COMMUNICATE_MICRO_PREFIX_TYPE, DEFAULT_START_PAGE_0, DocumentExtList, ENCODE_URI_PATTERN, ERROR_MESSAGE_EMPTY_VALID, ERROR_MESSAGE_MAX_LENGTH, ERROR_MESSAGE_MAX_VALID, ERROR_MESSAGE_MIN_LENGTH, ERROR_MESSAGE_MIN_VALID, ERROR_MESSAGE_PATTEN_VALID, ExcelExtList, ImageExtList, LINK_IMAGE_ERROR_TOKEN_INJECT, PROCESS_BAR_STANDARD_CONFIG_DEFAULT_TOKEN_INJECT, PROCESS_BAR_STEPS_CONFIG_DEFAULT_TOKEN_INJECT, UtilsCache, UtilsCommunicateMicro, UtilsCommunicateMicroKeyGlobal, UtilsHttpParamsRequest, UtilsHttpParamsRequestInstance, UtilsKeyCodeConstant, UtilsLanguageConstants, UtilsUrlSearchParams, VideoExtList, base64Decode, base64Encode, capitalize, checkMouseOverInContainer, checkViewInScreen, cloneDeep, cloneIBoundingClientRect, colorContrastFromOrigin, colorStepContrastFromOrigin, convertBase64ToBlob, convertBlobToFile, convertFileToBase64, convertFileToBase64_ObjectUrl, convertObjectToSignal, convertSignalToObject, convertUrlToFile, createUniqueRandomIntGenerator, decodeEscapeHtml, decodeURI, decrypt, decrypt3rd, deleteUnicode, downloadFileByUrl, downloadFileByUrlUseXmlRequest, downloadImageFromELement, encodeURI, encrypt, encrypt3rd, endCodeUrl, escapeHtml, firstLetterToUpperCase, formatDate, formatNumber, formatTextCompare, fullNameFormat, generateInterface, get, getColorById, getDayjs, getDeviceInfo, getDocumentByString, getDragEventByElement, getEventNameHandleClick, getFileExtension, getHTMLFromQuill, getKeyCacheByArrayObject, getLabelBySizeFile, getPlatFromBrowser, getSmartAxisScale, getViewport, groupBy, highlightByKeyword, isDifferenceDay, isDifferenceMonth, isDifferenceYear, isEmbedFrame, isEmpty, isEqual, isIncludeAudioExtList, isIncludeDocumentExtList, isIncludeImageExtList, isIncludeVideoExtList, isNil, isTypeAudio, isTypeFile, isTypeImage, isTypeVideo, keyBy, listColorDefine, md5, omitBy, patternAccount, patternDomain, patternEmail, patternEmoji, patternEncodeUri, patternGetFieldByRuleFieldReplace, patternHostUrl, patternKey, patternMobilePhone, patternName, patternNameProfile, patternNameSpecial, patternNameUtf8, patternNumber, patternPem, patternPhone, patternPhoneNormal, patternRuleFieldReplace, patternTax, patternUrl, protectString, range, removeEmoji, revealString, rgbToHex, set, setCaretPosition, setDefaultTimeZone, setKeyCrypto, setKeyCrypto3rd, setStylesElement, uniqBy, updateFunctionCheckEmbedFrame, updateFunctionFormatDate, updateFunctionXssFilter, uppercaseByPosition, uuid, viewDataNumberByLanguage, xssFilter };
+export { AudioExtList, CHARACTER_DATA_EMPTY, COMMUNICATE_MICRO_KEY_GET_ALL_MESSAGE, COMMUNICATE_MICRO_PREFIX_TYPE, DEFAULT_START_PAGE_0, DocumentExtList, ENCODE_URI_PATTERN, ERROR_MESSAGE_EMPTY_VALID, ERROR_MESSAGE_MAX_LENGTH, ERROR_MESSAGE_MAX_VALID, ERROR_MESSAGE_MIN_LENGTH, ERROR_MESSAGE_MIN_VALID, ERROR_MESSAGE_PATTEN_VALID, ExcelExtList, ImageExtList, LINK_IMAGE_ERROR_TOKEN_INJECT, PROCESS_BAR_STANDARD_CONFIG_DEFAULT_TOKEN_INJECT, PROCESS_BAR_STEPS_CONFIG_DEFAULT_TOKEN_INJECT, UtilsCache, UtilsCommunicateMicro, UtilsCommunicateMicroKeyGlobal, UtilsHttpParamsRequest, UtilsHttpParamsRequestInstance, UtilsKeyCodeConstant, UtilsLanguageConstants, UtilsUrlSearchParams, VideoExtList, base64Decode, base64Encode, capitalize, checkMouseOverInContainer, checkViewInScreen, cloneDeep, cloneIBoundingClientRect, colorContrastFromOrigin, colorStepContrastFromOrigin, convertBase64ToBlob, convertBlobToFile, convertFileToBase64, convertFileToBase64_ObjectUrl, convertHtmlToDivBlocks, convertObjectToSignal, convertSignalToObject, convertUrlToFile, createUniqueRandomIntGenerator, decodeEscapeHtml, decodeURI, decrypt, decrypt3rd, deleteUnicode, downloadFileByUrl, downloadFileByUrlUseXmlRequest, downloadImageFromELement, encodeURI, encrypt, encrypt3rd, endCodeUrl, escapeHtml, firstLetterToUpperCase, formatDate, formatNumber, formatTextCompare, fullNameFormat, generateInterface, get, getColorById, getDayjs, getDeltaFromHTML, getDeviceInfo, getDocumentByString, getDragEventByElement, getEventNameHandleClick, getFileExtension, getHTMLFromQuill, getKeyCacheByArrayObject, getLabelBySizeFile, getPlatFromBrowser, getSmartAxisScale, getViewport, groupBy, hasDangerousConstructorName, highlightByKeyword, insertContentWithRange, isArrayObject, isAsyncObject, isBrowserAPIObject, isBrowserGlobalObject, isBuiltInObject, isDOMObject, isDangerousObject, isDayjsObject, isDifferenceDay, isDifferenceMonth, isDifferenceYear, isEmbedFrame, isEmpty, isEqual, isFalsy, isFileObject, isFrameworkObject, isIncludeAudioExtList, isIncludeDocumentExtList, isIncludeImageExtList, isIncludeVideoExtList, isMapObject, isNil, isReturnAsIsObject, isSafeToProcess, isSetObject, isSkippableObject, isSpecialObject, isTruthy, isTypeAudio, isTypeFile, isTypeImage, isTypeVideo, keyBy, listColorDefine, md5, omitBy, patternAccount, patternDomain, patternEmail, patternEmoji, patternEncodeUri, patternGetFieldByRuleFieldReplace, patternHostUrl, patternKey, patternMobilePhone, patternName, patternNameProfile, patternNameSpecial, patternNameUtf8, patternNumber, patternPem, patternPhone, patternPhoneNormal, patternRuleFieldReplace, patternTax, patternUrl, processPasteData, protectString, range, removeEmoji, revealString, rgbToHex, set, setCaretPosition, setDefaultTimeZone, setKeyCrypto, setKeyCrypto3rd, setStylesElement, uniqBy, updateFunctionCheckEmbedFrame, updateFunctionFormatDate, updateFunctionXssFilter, uppercaseByPosition, uuid, viewDataNumberByLanguage, xssFilter };
 //# sourceMappingURL=libs-ui-utils.mjs.map