@libs-ui/utils 0.2.325-0 → 0.2.326-0

package/fesm2022/libs-ui-utils.mjs

@@ -1,7 +1,6 @@
 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 { Observable, Subject, fromEvent, takeUntil, filter, tap, mergeMap, startWith, finalize, lastValueFrom, timer } from 'rxjs';
 import { HttpParams } from '@angular/common/http';
 import { TemplateRef, ElementRef, isSignal, signal, InjectionToken } from '@angular/core';
 import dayjs from 'dayjs';
@@ -12,6 +11,7 @@ import localeData from 'dayjs/plugin/localeData';
 import timezone from 'dayjs/plugin/timezone';
 import updateLocale from 'dayjs/plugin/updateLocale';
 import utc from 'dayjs/plugin/utc';
+import CryptoES from 'crypto-es';
 
 const ERROR_MESSAGE_EMPTY_VALID = 'i18n_valid_empty_message';
 const ERROR_MESSAGE_PATTEN_VALID = 'i18n_valid_pattern_message';
@@ -233,355 +233,150 @@ const removeEmoji = (text) => {
     return text.replace(patternEmoji(), '');
 };
 
-const deviceDetector = new DeviceDetector();
-const parser = new DOMParser();
-const quill = new Quill(document.createElement('div'));
-const getDeviceInfo = () => {
-    return deviceDetector.parse(window.navigator.userAgent);
-};
-const getPlatFromBrowser = () => {
-    const info = getDeviceInfo();
-    return `${info.client?.name} ${info.client?.version}`;
-};
-const getEventNameHandleClick = (() => {
-    const deviceInfo = getDeviceInfo();
-    let nameEventHandleClick = deviceInfo.device?.type === 'desktop' ? 'click' : 'touchstart';
-    if ('onpointerdown' in window) {
-        nameEventHandleClick = 'pointerdown';
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/**
+ * 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;
     }
-    return nameEventHandleClick;
-})();
-const getDocumentByString = (htmlStr) => {
-    return parser.parseFromString(htmlStr, 'text/html');
-};
-const cloneIBoundingClientRect = (rect) => {
-    return {
-        top: rect['top'],
-        left: rect['left'],
-        width: rect['width'],
-        height: rect['height'],
-        bottom: rect['bottom'],
-    };
-};
-const setStylesElement = (el, styles, render2) => {
-    Object.keys(styles).forEach((key) => render2.setStyle(el, key, styles[key]));
+    return obj instanceof Window || obj instanceof Document || obj === window || obj === document || obj === globalThis;
 };
-const getViewport = (win = window) => {
-    const doc = win.document.documentElement, body = win.document.getElementsByTagName('body')[0], w = win.innerWidth || doc.clientWidth || body.clientWidth, h = win.innerHeight || doc.clientHeight || body.clientHeight;
-    return { width: w, height: h };
+/**
+ * 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;
+    }
+    return obj instanceof HTMLElement || obj instanceof Node || obj instanceof Element;
 };
-const setCaretPosition = (element, position) => {
-    if (!element || !element.setSelectionRange) {
-        return;
+/**
+ * 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;
     }
-    element.focus();
-    element.setSelectionRange(position, position);
+    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;
 };
-const checkViewInScreen = (container, element, elementScroll, maxTopLeft) => {
-    if (!container || !element) {
+/**
+ * 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;
     }
-    const rectContainer = cloneIBoundingClientRect(container.getBoundingClientRect());
-    if (elementScroll) {
-        const rectElementScroll = elementScroll.getBoundingClientRect();
-        rectContainer['left'] = rectElementScroll.left;
-        rectContainer['top'] = rectElementScroll.top;
+    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;
     }
-    const rectElement = element.getBoundingClientRect();
-    const { left, top } = rectElement;
-    const topContainer = rectContainer['top'];
-    const leftContainer = rectContainer['left'];
-    const widthContainer = rectContainer['width'];
-    const heightContainer = rectContainer['height'];
-    const scrollTopContainer = container.scrollTop;
-    const scrollLeftContainer = container.scrollLeft;
-    const limitTop = topContainer + scrollTopContainer + heightContainer;
-    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) {
-        return true;
+    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;
     }
-    return false;
+    return obj instanceof TemplateRef || obj instanceof ElementRef;
 };
-const checkMouseOverInContainer = (mousePosition, element, rect) => {
-    if (!element && !rect) {
+/**
+ * Kiểm tra đối tượng có phải là File/Blob object không
+ */
+const isFile = (obj) => {
+    if (obj === null || typeof obj !== 'object') {
         return false;
     }
-    const rectElement = rect || element?.getBoundingClientRect() || {};
-    const { left, top, width, height } = rectElement;
-    const limitLeft = left + width;
-    const limitTop = top + height;
-    const { clientX, clientY } = mousePosition;
-    if (left <= clientX && clientX <= limitLeft && top <= clientY && clientY <= limitTop) {
-        return true;
+    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;
     }
-    return false;
+    return obj instanceof Date || isRegExp(obj) || obj instanceof HttpParams || ('hasOwnProperty' in obj && '__ngContext__' in obj);
 };
-const getDragEventByElement = (config) => {
-    let timer;
-    const addClass = () => {
-        timer = setTimeout(() => {
-            document.body.classList.add('!select-none');
-            document.body.classList.add('!cursor-grabbing');
-        }, 250);
-    };
-    const removeClass = () => {
-        document.body.classList.remove('!select-none');
-        document.body.classList.remove('!cursor-grabbing');
-        clearTimeout(timer);
-    };
-    fromEvent(config.elementMouseDown, 'mouseleave')
-        .pipe(tap(() => document.body.classList.remove('cursor-pointer')), takeUntil(config.onDestroy))
-        .subscribe();
-    fromEvent(config.elementMouseDown, 'mouseenter')
-        .pipe(tap(() => document.body.classList.add('cursor-pointer')), takeUntil(config.onDestroy))
-        .subscribe();
-    const mouseDown = fromEvent(config.elementMouseDown, 'mousedown').pipe(tap((e) => {
-        e.stopPropagation();
-        addClass();
-        config.functionMouseDown?.(e);
-    }));
-    const mouseup = fromEvent(config.elementMouseUp || document, 'mouseup').pipe(tap((e) => {
-        e.stopPropagation();
-        removeClass();
-        config.functionMouseUp?.(e);
-    }));
-    const mousemove = fromEvent(config.elementMouseMove || document, 'mousemove').pipe(tap((e) => {
-        e.stopPropagation();
-        config.functionMouseMove?.(e);
-    }), takeUntil(mouseup));
-    return mouseDown.pipe(mergeMap((e) => (config.isStartWithMouseDownEvent ? mousemove.pipe(startWith(e)) : mousemove)), takeUntil(config.onDestroy), finalize(removeClass));
+/**
+ * Kiểm tra đối tượng có phải là RegExp object không
+ */
+const isRegExp = (obj) => {
+    return obj instanceof RegExp;
 };
-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') {
-                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);
-    let htmlText = options?.getRootHtml ? quill.root.innerHTML : quill.root.firstElementChild?.innerHTML;
-    if (replaceBrToDiv) {
-        htmlText = convertHtmlToDivBlocks(htmlText || '');
+/**
+ * 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;
     }
-    return decodeEscapeHtml(htmlText || '');
+    return obj instanceof Promise || obj instanceof Observable;
 };
-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('');
+/**
+ * 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) || isFile(obj) || isBuiltInObject(obj) || isAsyncObject(obj);
 };
-const getDeltaFromHTML = async (html) => {
-    quill.root.innerHTML = html;
-    setTimeout(() => {
-        console.log(quill.getContents());
-    }, 1000);
-    await lastValueFrom(timer(1000));
-    return quill.getContents();
+/**
+ * Kiểm tra đối tượng có phải là dayjs object không
+ */
+const isDayjsObject = (obj) => {
+    return dayjs.isDayjs(obj);
 };
-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');
+/**
+ * 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);
 };
-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);
+/**
+ * Kiểm tra đối tượng có phải là Map object không
+ */
+const isMap = (obj) => {
+    return obj instanceof Map;
+};
+/**
+ * Kiểm tra đối tượng có phải là Set object không
+ */
+const isSet = (obj) => {
+    return obj instanceof Set;
+};
+/**
+ * Kiểm tra đối tượng có phải là Array object không
+ */
+const isArray = (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);
 };
-
-class UtilsUrlSearchParams {
-    static instance;
-    params;
-    constructor(paramString) {
-        this.params = new Array();
-        this.params.length = 0;
-        this.params.push(...this.buildParams(paramString));
-    }
-    static getInstance() {
-        if (!this.instance) {
-            this.instance = new UtilsUrlSearchParams('');
-        }
-        return this.instance;
-    }
-    static toStringParamObject(params) {
-        const paramsArr = Object.keys(params).map((key) => {
-            return {
-                key,
-                value: params[key],
-            };
-        });
-        return UtilsUrlSearchParams.ToString(paramsArr);
-    }
-    static ToString(params) {
-        let paramsStr = '';
-        params
-            .sort((item1, item2) => item1.key.localeCompare(item2.key))
-            .forEach((item) => {
-            const { key, value } = item;
-            paramsStr = `${paramsStr}${paramsStr ? '&' : ''}${key}=${value}`;
-        });
-        return paramsStr;
-    }
-    buildParams(paramString) {
-        const paramsBuild = new Array();
-        if (!paramString) {
-            return paramsBuild;
-        }
-        const paramsError = paramString.split('?');
-        if (paramsError.length > 2) {
-            paramString = `${paramsError[0]}?${paramsError[1]}&${paramsError.slice(2).join('&')}`;
-        }
-        const params = paramString.replace(/\S+[?]/g, '').split('&');
-        if (params) {
-            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)) {
-                    paramsBuild.push({ key, value });
-                }
-            });
-        }
-        return paramsBuild;
-    }
-    set(key, value) {
-        const paramByKey = this.params.find((param) => param.key === key);
-        if (!paramByKey) {
-            this.params.push({ key, value: decodeURIComponent(value.replace(/\+/g, ' ')) });
-            return;
-        }
-        paramByKey['value'] = value;
-    }
-    get(key) {
-        return this.params.find((param) => param.key === key)?.value;
-    }
-    has(key) {
-        return this.params.some((param) => param.key === key);
-    }
-    delete(key) {
-        const index = this.params.findIndex((param) => param.key === key);
-        if (index >= 0) {
-            this.params.splice(index, 1);
-        }
-    }
-    length() {
-        return this.params.length;
-    }
-    toString(params) {
-        params = params || this.params;
-        return UtilsUrlSearchParams.ToString(params);
-    }
-    getParamObject() {
-        const params = {};
-        this.params.forEach((item) => {
-            params[item.key] = item.value;
-        });
-        return params;
-    }
-    compareParams(param1, param2) {
-        const params1 = this.toString(this.buildParams(param1));
-        const params2 = this.toString(this.buildParams(param2));
-        return params1 === params2;
-    }
-}
 
 let key$1 = '12~@#loqwsxacva(3rdhaq12';
 /**
@@ -623,192 +418,30 @@ const md5 = (plainData) => {
     return CryptoES.MD5(plainData).toString();
 };
 
-const uuid = () => {
-    const timestamp = performance.now() * 1000;
-    const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+-=[]{}|;:,.<>?/~';
-    let randomString = '';
-    for (let i = 0; i < 5; i++) {
-        randomString += chars.charAt(Math.floor(Math.random() * chars.length));
-    }
-    const baseString = `${Math.floor(timestamp)}-${randomString}`;
-    const charArray = baseString.split('');
-    for (let i = charArray.length - 1; i > 0; i--) {
-        const j = Math.floor(Math.random() * (i + 1));
-        [charArray[i], charArray[j]] = [charArray[j], charArray[i]];
-    }
-    const shuffledString = charArray.join('');
-    return md5(shuffledString);
-};
-
-/* eslint-disable @typescript-eslint/no-explicit-any */
-/**
- * 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'];
+let key = '12~@#loqwsxacva(3rdhaq12';
 /**
- * Kiểm tra xem đối tượng có phải là browser global object không
+ * @description Thiết lập key mã hóa
+ * @param value key mã hóa, độ dài bằng 24 hoặc 32 ký tự.
  */
-const isBrowserGlobalObject = (obj) => {
-    if (obj === null || typeof obj !== 'object') {
-        return false;
+const setKeyCrypto3rd = (value) => {
+    if (value.length !== 24 && value.length !== 32) {
+        throw Error(`key.length = ${value.length}; Key phải là 1 chuỗi dài 24 hoặc 32 ký tự`);
     }
-    return obj instanceof Window || obj instanceof Document || obj === window || obj === document || obj === globalThis;
+    key = value;
 };
-/**
- * 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;
-    }
-    return obj instanceof HTMLElement || obj instanceof Node || obj instanceof Element;
+const keyStore = () => {
+    return key;
 };
-/**
- * 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;
+const encrypt3rd = (plainData) => {
+    if (!keyStore()) {
+        throw Error('lỗi chưa setup key mã hóa');
     }
-    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;
-    }
-    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;
-    }
-    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;
-    }
-    return obj instanceof TemplateRef || obj instanceof ElementRef;
-};
-/**
- * Kiểm tra đối tượng có phải là File/Blob object không
- */
-const isFile = (obj) => {
-    if (obj === null || typeof obj !== 'object') {
-        return false;
-    }
-    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;
-    }
-    return obj instanceof Date || isRegExp(obj) || obj instanceof HttpParams || ('hasOwnProperty' in obj && '__ngContext__' in obj);
-};
-/**
- * Kiểm tra đối tượng có phải là RegExp object không
- */
-const isRegExp = (obj) => {
-    return obj instanceof RegExp;
-};
-/**
- * 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;
-    }
-    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) || isFile(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 isMap = (obj) => {
-    return obj instanceof Map;
-};
-/**
- * Kiểm tra đối tượng có phải là Set object không
- */
-const isSet = (obj) => {
-    return obj instanceof Set;
-};
-/**
- * Kiểm tra đối tượng có phải là Array object không
- */
-const isArray = (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';
-/**
- * @description Thiết lập key mã hóa
- * @param value key mã hóa, độ dài bằng 24 hoặc 32 ký tự.
- */
-const setKeyCrypto3rd = (value) => {
-    if (value.length !== 24 && value.length !== 32) {
-        throw Error(`key.length = ${value.length}; Key phải là 1 chuỗi dài 24 hoặc 32 ký tự`);
-    }
-    key = value;
-};
-const keyStore = () => {
-    return key;
-};
-const encrypt3rd = (plainData) => {
-    if (!keyStore()) {
-        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());
-    const mode = CryptoES.mode.CBC;
-    const padding = CryptoES.pad.Pkcs7;
-    const options = { iv: iv, mode: mode, padding: padding };
-    return CryptoES.AES.encrypt(plainData, key, options).toString();
+    const key = CryptoES.enc.Hex.parse(keyStore());
+    const iv = CryptoES.enc.Hex.parse(keyStore());
+    const mode = CryptoES.mode.CBC;
+    const padding = CryptoES.pad.Pkcs7;
+    const options = { iv: iv, mode: mode, padding: padding };
+    return CryptoES.AES.encrypt(plainData, key, options).toString();
 };
 const decrypt3rd = (encryptedData) => {
     if (!keyStore()) {
@@ -822,6 +455,7 @@ const decrypt3rd = (encryptedData) => {
     return CryptoES.AES.decrypt(encryptedData, key, options).toString(CryptoES.enc.Utf8);
 };
 
+//NOTE: Do là function truyền từ bên ngoài vào nên sẽ không có unit test
 let functionCheck = () => {
     return window.parent !== window.top;
 };
@@ -1045,6 +679,23 @@ class UtilsLanguageConstants {
     }
 }
 
+const uuid = () => {
+    const timestamp = performance.now() * 1000;
+    const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+-=[]{}|;:,.<>?/~';
+    let randomString = '';
+    for (let i = 0; i < 5; i++) {
+        randomString += chars.charAt(Math.floor(Math.random() * chars.length));
+    }
+    const baseString = `${Math.floor(timestamp)}-${randomString}`;
+    const charArray = baseString.split('');
+    for (let i = charArray.length - 1; i > 0; i--) {
+        const j = Math.floor(Math.random() * (i + 1));
+        [charArray[i], charArray[j]] = [charArray[j], charArray[i]];
+    }
+    const shuffledString = charArray.join('');
+    return md5(shuffledString);
+};
+
 /* eslint-disable no-async-promise-executor */
 /* eslint-disable @typescript-eslint/no-explicit-any */
 class UtilsCache {
@@ -2043,6 +1694,7 @@ const get = (obj, path, defaultValue, keepLastValueIfSignal) => {
             obj = obj[key];
             continue;
         }
+        obj = unwrapSignal(obj);
         if (isNil(obj) || !Object.prototype.hasOwnProperty.call(obj, key)) {
             return out(defaultValue);
         }
@@ -2458,6 +2110,353 @@ const generateInterface = (obj, interfaceName) => {
     return interfaceStr;
 };
 
+const deviceDetector = new DeviceDetector();
+const parser = new DOMParser();
+const quill = new Quill(document.createElement('div'));
+const getDeviceInfo = () => {
+    return deviceDetector.parse(window.navigator.userAgent);
+};
+const getPlatFromBrowser = () => {
+    const info = getDeviceInfo();
+    return `${info.client?.name} ${info.client?.version}`;
+};
+const getEventNameHandleClick = (() => {
+    const deviceInfo = getDeviceInfo();
+    let nameEventHandleClick = deviceInfo.device?.type === 'desktop' ? 'click' : 'touchstart';
+    if ('onpointerdown' in window) {
+        nameEventHandleClick = 'pointerdown';
+    }
+    return nameEventHandleClick;
+})();
+const getDocumentByString = (htmlStr) => {
+    return parser.parseFromString(htmlStr, 'text/html');
+};
+const cloneIBoundingClientRect = (rect) => {
+    return {
+        top: rect['top'],
+        left: rect['left'],
+        width: rect['width'],
+        height: rect['height'],
+        bottom: rect['bottom'],
+    };
+};
+const setStylesElement = (el, styles) => {
+    Object.keys(styles).forEach((key) => set(el, `style.${key}`, styles[key]));
+};
+const getViewport = (win = window) => {
+    const doc = win.document.documentElement, body = win.document.getElementsByTagName('body')[0], w = win.innerWidth || doc.clientWidth || body.clientWidth, h = win.innerHeight || doc.clientHeight || body.clientHeight;
+    return { width: w, height: h };
+};
+const setCaretPosition = (element, position) => {
+    if (!element || !element.setSelectionRange) {
+        return;
+    }
+    element.focus();
+    element.setSelectionRange(position, position);
+};
+const checkViewInScreen = (container, element, elementScroll, maxTopLeft) => {
+    if (!container || !element) {
+        return false;
+    }
+    const rectContainer = cloneIBoundingClientRect(container.getBoundingClientRect());
+    if (elementScroll) {
+        const rectElementScroll = elementScroll.getBoundingClientRect();
+        rectContainer['left'] = rectElementScroll.left;
+        rectContainer['top'] = rectElementScroll.top;
+    }
+    const rectElement = element.getBoundingClientRect();
+    const { left, top } = rectElement;
+    const topContainer = rectContainer['top'];
+    const leftContainer = rectContainer['left'];
+    const widthContainer = rectContainer['width'];
+    const heightContainer = rectContainer['height'];
+    const scrollTopContainer = container.scrollTop;
+    const scrollLeftContainer = container.scrollLeft;
+    const limitTop = topContainer + scrollTopContainer + heightContainer;
+    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) {
+        return true;
+    }
+    return false;
+};
+const checkMouseOverInContainer = (mousePosition, element, rect) => {
+    if (!element && !rect) {
+        return false;
+    }
+    const rectElement = rect || element?.getBoundingClientRect() || {};
+    const { left, top, width, height } = rectElement;
+    const limitLeft = left + width;
+    const limitTop = top + height;
+    const { clientX, clientY } = mousePosition;
+    if (left <= clientX && clientX <= limitLeft && top <= clientY && clientY <= limitTop) {
+        return true;
+    }
+    return false;
+};
+const getDragEventByElement = (config) => {
+    let timer;
+    const addClass = () => {
+        timer = setTimeout(() => {
+            document.body.classList.add('!select-none');
+            document.body.classList.add('!cursor-grabbing');
+        }, 250);
+    };
+    const removeClass = () => {
+        document.body.classList.remove('!select-none');
+        document.body.classList.remove('!cursor-grabbing');
+        clearTimeout(timer);
+    };
+    fromEvent(config.elementMouseDown, 'mouseleave')
+        .pipe(tap(() => document.body.classList.remove('cursor-pointer')), takeUntil(config.onDestroy))
+        .subscribe();
+    fromEvent(config.elementMouseDown, 'mouseenter')
+        .pipe(tap(() => document.body.classList.add('cursor-pointer')), takeUntil(config.onDestroy))
+        .subscribe();
+    const mouseDown = fromEvent(config.elementMouseDown, 'mousedown').pipe(tap((e) => {
+        e.stopPropagation();
+        addClass();
+        config.functionMouseDown?.(e);
+    }));
+    const mouseup = fromEvent(config.elementMouseUp || document, 'mouseup').pipe(tap((e) => {
+        e.stopPropagation();
+        removeClass();
+        config.functionMouseUp?.(e);
+    }));
+    const mousemove = fromEvent(config.elementMouseMove || document, 'mousemove').pipe(tap((e) => {
+        e.stopPropagation();
+        config.functionMouseMove?.(e);
+    }), takeUntil(mouseup));
+    return mouseDown.pipe(mergeMap((e) => (config.isStartWithMouseDownEvent ? mousemove.pipe(startWith(e)) : mousemove)), takeUntil(config.onDestroy), finalize(removeClass));
+};
+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') {
+                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);
+    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;
+    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;
+    params;
+    constructor(paramString) {
+        this.params = new Array();
+        this.params.length = 0;
+        this.params.push(...this.buildParams(paramString));
+    }
+    static getInstance() {
+        if (!this.instance) {
+            this.instance = new UtilsUrlSearchParams('');
+        }
+        return this.instance;
+    }
+    static toStringParamObject(params) {
+        const paramsArr = Object.keys(params).map((key) => {
+            return {
+                key,
+                value: params[key],
+            };
+        });
+        return UtilsUrlSearchParams.ToString(paramsArr);
+    }
+    static ToString(params) {
+        let paramsStr = '';
+        params
+            .sort((item1, item2) => item1.key.localeCompare(item2.key))
+            .forEach((item) => {
+            const { key, value } = item;
+            paramsStr = `${paramsStr}${paramsStr ? '&' : ''}${key}=${value}`;
+        });
+        return paramsStr;
+    }
+    buildParams(paramString) {
+        const paramsBuild = new Array();
+        if (!paramString) {
+            return paramsBuild;
+        }
+        const paramsError = paramString.split('?');
+        if (paramsError.length > 2) {
+            paramString = `${paramsError[0]}?${paramsError[1]}&${paramsError.slice(2).join('&')}`;
+        }
+        const params = paramString.replace(/\S+[?]/g, '').split('&');
+        if (params) {
+            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)) {
+                    paramsBuild.push({ key, value });
+                }
+            });
+        }
+        return paramsBuild;
+    }
+    set(key, value) {
+        const paramByKey = this.params.find((param) => param.key === key);
+        if (!paramByKey) {
+            this.params.push({ key, value: decodeURIComponent(value.replace(/\+/g, ' ')) });
+            return;
+        }
+        paramByKey['value'] = value;
+    }
+    get(key) {
+        return this.params.find((param) => param.key === key)?.value;
+    }
+    has(key) {
+        return this.params.some((param) => param.key === key);
+    }
+    delete(key) {
+        const index = this.params.findIndex((param) => param.key === key);
+        if (index >= 0) {
+            this.params.splice(index, 1);
+        }
+    }
+    length() {
+        return this.params.length;
+    }
+    toString(params) {
+        params = params || this.params;
+        return UtilsUrlSearchParams.ToString(params);
+    }
+    getParamObject() {
+        const params = {};
+        this.params.forEach((item) => {
+            params[item.key] = item.value;
+        });
+        return params;
+    }
+    compareParams(param1, param2) {
+        const params1 = this.toString(this.buildParams(param1));
+        const params2 = this.toString(this.buildParams(param2));
+        return params1 === params2;
+    }
+}
+
 const step = 20;
 const percent = 0.05;
 const colorStepContrastFromOrigin = (color, stepNumber) => {
@@ -2711,6 +2710,7 @@ class UtilsKeyCodeConstant {
     static CLOSE_SQUARE_BRACKET = 221;
     static SINGLE_QUOTE = 222;
     static MAC_META = 224;
+    static BUFFERED = 229;
 }
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
@@ -2919,6 +2919,7 @@ const downloadImageFromELement = (imageElement, typeFileDownload, nameFile) => {
     link.click();
 };
 
+//NOTE: Đây là các hàm token inject để các module khác có thể inject vào để sử dụng
 const LINK_IMAGE_ERROR_TOKEN_INJECT = new InjectionToken('LINK_IMAGE_ERROR_TOKEN_INJECT');
 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');