selective-ui 1.0.2 → 1.0.3

package/src/js/types/libs.type.js

@@ -1,28 +1,28 @@
-/**
- * @template TTags
- * @typedef {{
- *   id: string
- *   view: HTMLElement
- *   tags: TTags
- * }} MountViewResult
- */
-
-/**
- * @typedef {Object} NodeSpec
- * @property {string} [node]
- * @property {string|string[]} [classList]
- * @property {Object} [style]
- * @property {Object} [dataset]
- * @property {string} [innerHTML]
- * @property {string} [textContent]
- * @property {string} [role]
- * @property {string} [ariaLive]
- * @property {string} [ariaLabel]
- * @property {string} [ariaLabelledby]
- * @property {string} [ariaControls]
- * @property {string} [ariaHaspopup]
- * @property {string} [ariaMultiselectable]
- * @property {string} [ariaAutocomplete]
- * @property {string} [tabIndex]
- * @property {Record<string, EventListenerOrEventListenerObject>} [event]
+/**
+ * @template TTags
+ * @typedef {{
+ *   id: string
+ *   view: HTMLElement
+ *   tags: TTags
+ * }} MountViewResult
+ */
+
+/**
+ * @typedef {Object} NodeSpec
+ * @property {string} [node]
+ * @property {string|string[]} [classList]
+ * @property {Object} [style]
+ * @property {Object} [dataset]
+ * @property {string} [innerHTML]
+ * @property {string} [textContent]
+ * @property {string} [role]
+ * @property {string} [ariaLive]
+ * @property {string} [ariaLabel]
+ * @property {string} [ariaLabelledby]
+ * @property {string} [ariaControls]
+ * @property {string} [ariaHaspopup]
+ * @property {string} [ariaMultiselectable]
+ * @property {string} [ariaAutocomplete]
+ * @property {string} [tabIndex]
+ * @property {Record<string, EventListenerOrEventListenerObject>} [event]
  */

package/src/js/types/model.type.js

@@ -1,11 +1,11 @@
-/**
- * @template TTarget
- * @template {ViewContract<any>} TView
- * @typedef {Object} ModelContract
- *
- * @property {TTarget | null} targetElement
- * @property {TView | null} view
- * @property {any} value
- * @property {number} position
- * @property {boolean} isInit
- */
+/**
+ * @template TTarget
+ * @template {ViewContract<any>} TView
+ * @typedef {Object} ModelContract
+ *
+ * @property {TTarget | null} targetElement
+ * @property {TView | null} view
+ * @property {any} value
+ * @property {number} position
+ * @property {boolean} isInit
+ */

package/src/js/types/recyclerview.type.js

@@ -1,12 +1,12 @@
-/**
- * @template TAdapter extends AdapterContract
- * @typedef {Object} RecyclerViewContract
- *
- * @property {HTMLElement | null} viewElement - The container element for the recycler view
- * @property {TAdapter | null} adapter - The adapter instance controlling the items
- * @property {(viewElement: HTMLElement) => void} setView - Set or change the container element
- * @property {(adapter: TAdapter) => void} setAdapter - Attach an adapter and refresh the view
- * @property {() => void} render - Render all item views inside the container
- * @property {() => void} clear - Clear all item views from the container
- * @property {() => void} refresh - Refresh item views from the container
+/**
+ * @template TAdapter extends AdapterContract
+ * @typedef {Object} RecyclerViewContract
+ *
+ * @property {HTMLElement | null} viewElement - The container element for the recycler view
+ * @property {TAdapter | null} adapter - The adapter instance controlling the items
+ * @property {(viewElement: HTMLElement) => void} setView - Set or change the container element
+ * @property {(adapter: TAdapter) => void} setAdapter - Attach an adapter and refresh the view
+ * @property {() => void} render - Render all item views inside the container
+ * @property {() => void} clear - Clear all item views from the container
+ * @property {() => void} refresh - Refresh item views from the container
  */

package/src/js/types/resize-observer.type.js

@@ -1,19 +1,19 @@
-/**
- * @typedef {Object} BoxEdges
- * @property {number} top
- * @property {number} right
- * @property {number} bottom
- * @property {number} left
- */
-
-/**
- * @typedef {Object} ElementMetrics
- * @property {number} width
- * @property {number} height
- * @property {number} top
- * @property {number} left
- *
- * @property {BoxEdges} padding
- * @property {BoxEdges} border
- * @property {BoxEdges} margin
+/**
+ * @typedef {Object} BoxEdges
+ * @property {number} top
+ * @property {number} right
+ * @property {number} bottom
+ * @property {number} left
+ */
+
+/**
+ * @typedef {Object} ElementMetrics
+ * @property {number} width
+ * @property {number} height
+ * @property {number} top
+ * @property {number} left
+ *
+ * @property {BoxEdges} padding
+ * @property {BoxEdges} border
+ * @property {BoxEdges} margin
  */

package/src/js/types/view.group.type.js

@@ -1,13 +1,13 @@
-/**
- * @typedef {{
- *   GroupView: HTMLDivElement
- *   GroupHeader: HTMLDivElement
- *   GroupItems: HTMLDivElement
- * }} GroupViewTags
- */
-
-/**
- * @typedef {MountViewResult<GroupViewTags> & {
- *   view: Element
- * }} GroupViewResult
+/**
+ * @typedef {{
+ *   GroupView: HTMLDivElement
+ *   GroupHeader: HTMLDivElement
+ *   GroupItems: HTMLDivElement
+ * }} GroupViewTags
+ */
+
+/**
+ * @typedef {MountViewResult<GroupViewTags> & {
+ *   view: Element
+ * }} GroupViewResult
  */

package/src/js/types/view.option.type.js

@@ -1,15 +1,15 @@
-/**
- * @typedef {{
- *   OptionView: HTMLDivElement,
- *   OptionInput: HTMLInputElement,
- *   OptionLabel: HTMLLabelElement,
- *   LabelContent: HTMLDivElement
- *   OptionImage: HTMLImageElement
- * }} OptionViewTags
- */
-
-/**
- * @typedef {MountViewResult<OptionViewTags> & {
- *   view: Element
- * }} OptionViewResult
+/**
+ * @typedef {{
+ *   OptionView: HTMLDivElement,
+ *   OptionInput: HTMLInputElement,
+ *   OptionLabel: HTMLLabelElement,
+ *   LabelContent: HTMLDivElement
+ *   OptionImage: HTMLImageElement
+ * }} OptionViewTags
+ */
+
+/**
+ * @typedef {MountViewResult<OptionViewTags> & {
+ *   view: Element
+ * }} OptionViewResult
  */

package/src/js/types/view.type.js

@@ -1,11 +1,11 @@
-/**
- * @template {Record<string, Element>} TTags
- * @typedef {Object} ViewContract
- *
- * @property {Element | null} parent
- * @property {MountViewResult<TTags> | null} view
- * @property {() => void} render
- * @property {<K extends keyof TTags>(tag: K) => TTags[K]} getTag
- * @property {() => TTags} getTags
- * @property {() => Element} getView
+/**
+ * @template {Record<string, Element>} TTags
+ * @typedef {Object} ViewContract
+ *
+ * @property {Element | null} parent
+ * @property {MountViewResult<TTags> | null} view
+ * @property {() => void} render
+ * @property {<K extends keyof TTags>(tag: K) => TTags[K]} getTag
+ * @property {() => TTags} getTags
+ * @property {() => Element} getView
  */

package/src/js/utils/guard.js

@@ -1,47 +1,47 @@
-/**
- * Checks for a previously loaded global library instance by name.
- * If found (with `__loaded` flag), logs a warning and returns true; otherwise
- * initializes a loading placeholder on `window[name]` and returns false.
- *
- * @param {string} LIB_NAME - The global namespace key to check on `window`.
- * @returns {boolean} - True if a loaded instance already exists; false otherwise.
- */
-export function checkDuplicate(LIB_NAME) {
-    if (typeof window === "undefined") return false;
-    
-    if (window[LIB_NAME] && window[LIB_NAME].__loaded) {
-        console.warn(
-            `[${LIB_NAME}] Already loaded (v${window[LIB_NAME].__version}). ` +
-            `Using existing instance. Please remove duplicate <script> tags.`
-        );
-        return true;
-    }
-    
-    window[LIB_NAME] = window[LIB_NAME] || {};
-    window[LIB_NAME].__loading = true;
-    return false;
-}
-
-/**
- * Marks a global library namespace as fully loaded, sets version metadata,
- * merges its public API into `window[name]`, freezes the object to prevent
- * further mutation, and logs a success message.
- *
- * @param {string} name - The global namespace key on `window`.
- * @param {string} version - Semantic version string of the library.
- * @param {Object} api - Public API surface to expose under `window[name]`.
- * @returns {void}
- */
-export function markLoaded(name, version, api) {
-    if (typeof window === "undefined") return;
-    
-    window[name].__loaded = true;
-    window[name].__loading = false;
-    window[name].__version = version;
-    
-    Object.assign(window[name], api);
-    
-    Object.freeze(window[name]);
-    
-    console.log(`[${name}] v${version} loaded successfully`);
+/**
+ * Checks for a previously loaded global library instance by name.
+ * If found (with `__loaded` flag), logs a warning and returns true; otherwise
+ * initializes a loading placeholder on `window[name]` and returns false.
+ *
+ * @param {string} LIB_NAME - The global namespace key to check on `window`.
+ * @returns {boolean} - True if a loaded instance already exists; false otherwise.
+ */
+export function checkDuplicate(LIB_NAME) {
+    if (typeof window === "undefined") return false;
+    
+    if (window[LIB_NAME] && window[LIB_NAME].__loaded) {
+        console.warn(
+            `[${LIB_NAME}] Already loaded (v${window[LIB_NAME].__version}). ` +
+            `Using existing instance. Please remove duplicate <script> tags.`
+        );
+        return true;
+    }
+    
+    window[LIB_NAME] = window[LIB_NAME] || {};
+    window[LIB_NAME].__loading = true;
+    return false;
+}
+
+/**
+ * Marks a global library namespace as fully loaded, sets version metadata,
+ * merges its public API into `window[name]`, freezes the object to prevent
+ * further mutation, and logs a success message.
+ *
+ * @param {string} name - The global namespace key on `window`.
+ * @param {string} version - Semantic version string of the library.
+ * @param {Object} api - Public API surface to expose under `window[name]`.
+ * @returns {void}
+ */
+export function markLoaded(name, version, api) {
+    if (typeof window === "undefined") return;
+    
+    window[name].__loaded = true;
+    window[name].__loading = false;
+    window[name].__version = version;
+    
+    Object.assign(window[name], api);
+    
+    Object.freeze(window[name]);
+    
+    console.log(`[${name}] v${version} loaded successfully`);
 }

package/src/js/utils/ievents.js

@@ -1,83 +1,83 @@
-
-/**
- * Provides a lightweight event utility with cancel/continue control:
- * - buildEventToken(): creates a token/callback pair to control flow (stopPropagation/cancel).
- * - callEvent(): invokes handlers in order, passing params; stops when canceled or propagation stopped.
- * - trigger(): dispatches a native DOM Event on the given element.
- * - callFunctions(): executes an array of functions with optional parameters.
- */
-export class iEvents {
-    /**
-     * Creates an event token and its controller callbacks.
-     * @returns {{ token: IEventToken, callback: IEventCallback }}
-     */
-    static buildEventToken() {
-        const privToken = { isContinue: true, isCancel: false };
-
-        const token = {
-            get isContinue() { return privToken.isContinue; },
-            get isCancel() { return privToken.isCancel; }
-        };
-
-        const callback = {
-            stopPropagation() { privToken.isContinue = false; },
-            cancel() { privToken.isCancel = true; privToken.isContinue = false; }
-        };
-
-        return { token, callback };
-    }
-
-    /**
-     * Calls event handlers sequentially with optional parameters and a control callback.
-     * Stops invoking further handlers if canceled or propagation is stopped.
-     *
-     * @template T
-     * @param {T[]|null} params
-     * @param {...Function} handles
-     * @returns {IEventToken}
-     */
-    static callEvent(params, ...handles) {
-        const { token, callback } = this.buildEventToken();
-
-        for (let i = 0; i < handles.length; i++) {
-            const handle = handles[i];
-
-            if (typeof handle !== 'function') continue;
-
-            if (params && Array.isArray(params)) {
-                handle(callback, ...params);
-            } else {
-                handle(callback);
-            }
-
-            if (token.isCancel || !token.isContinue) break;
-        }
-
-        return token;
-    }
-
-    /**
-     * Dispatches a native DOM event on the specified element.
-     * @param {HTMLElement|Window|Document} element
-     * @param {string} eventSTR
-     * @param {{bubbles?: boolean, cancelable?: boolean}} [opts]
-     */
-    static trigger(element, eventSTR, opts = { bubbles: true, cancelable: true }) {
-        const evt = new Event(eventSTR, opts);
-        element.dispatchEvent(evt);
-        return evt;
-    }
-
-    /**
-     * Invokes an array of functions with optional parameters.
-     * @param {Function[]} funcs
-     * @param {...any} params
-     */
-    static callFunctions(funcs, ...params) {
-        if (!Array.isArray(funcs)) return;
-        for (const fn of funcs) {
-            if (typeof fn !== 'function') continue;
-            fn(...params);
-        }
-    }
-}
+
+/**
+ * Provides a lightweight event utility with cancel/continue control:
+ * - buildEventToken(): creates a token/callback pair to control flow (stopPropagation/cancel).
+ * - callEvent(): invokes handlers in order, passing params; stops when canceled or propagation stopped.
+ * - trigger(): dispatches a native DOM Event on the given element.
+ * - callFunctions(): executes an array of functions with optional parameters.
+ */
+export class iEvents {
+    /**
+     * Creates an event token and its controller callbacks.
+     * @returns {{ token: IEventToken, callback: IEventCallback }}
+     */
+    static buildEventToken() {
+        const privToken = { isContinue: true, isCancel: false };
+
+        const token = {
+            get isContinue() { return privToken.isContinue; },
+            get isCancel() { return privToken.isCancel; }
+        };
+
+        const callback = {
+            stopPropagation() { privToken.isContinue = false; },
+            cancel() { privToken.isCancel = true; privToken.isContinue = false; }
+        };
+
+        return { token, callback };
+    }
+
+    /**
+     * Calls event handlers sequentially with optional parameters and a control callback.
+     * Stops invoking further handlers if canceled or propagation is stopped.
+     *
+     * @template T
+     * @param {T[]|null} params
+     * @param {...Function} handles
+     * @returns {IEventToken}
+     */
+    static callEvent(params, ...handles) {
+        const { token, callback } = this.buildEventToken();
+
+        for (let i = 0; i < handles.length; i++) {
+            const handle = handles[i];
+
+            if (typeof handle !== 'function') continue;
+
+            if (params && Array.isArray(params)) {
+                handle(callback, ...params);
+            } else {
+                handle(callback);
+            }
+
+            if (token.isCancel || !token.isContinue) break;
+        }
+
+        return token;
+    }
+
+    /**
+     * Dispatches a native DOM event on the specified element.
+     * @param {HTMLElement|Window|Document} element
+     * @param {string} eventSTR
+     * @param {{bubbles?: boolean, cancelable?: boolean}} [opts]
+     */
+    static trigger(element, eventSTR, opts = { bubbles: true, cancelable: true }) {
+        const evt = new Event(eventSTR, opts);
+        element.dispatchEvent(evt);
+        return evt;
+    }
+
+    /**
+     * Invokes an array of functions with optional parameters.
+     * @param {Function[]} funcs
+     * @param {...any} params
+     */
+    static callFunctions(funcs, ...params) {
+        if (!Array.isArray(funcs)) return;
+        for (const fn of funcs) {
+            if (typeof fn !== 'function') continue;
+            fn(...params);
+        }
+    }
+}

package/src/js/utils/istorage.js

@@ -1,61 +1,61 @@
-/**
- * @class
- */
-export class iStorage {
-    defaultConfig = {
-        showPanel: true,
-        accessoryStyle: "top",
-        multiple: false,
-        minWidth: "50px",
-        width: "0px",
-        offsetWidth: null,
-        minHeight: "30px",
-        height: "30px",
-        panelHeight: "220px",
-        panelMinHeight: "100px",
-        disabled: false,
-        readonly: false,
-        selectall: true,
-        keepSelected: true,
-        placeholder: "Chọn giá trị",
-        altMask: "",
-        autoclose: false,
-        autoscroll: true,
-        autofocus: true,
-        searchable: true,
-        loadingfield: true,
-        visible: true,
-        skipError: false,
-        customDelimiter: ",",
-        textLoading: "Đang xử lý...",
-        textNoData: "Không có dữ liệu",
-        textNotFound: "Không tìm thấy",
-        textSelectAll: "Chọn tất cả",
-        textDeselectAll: "Bỏ chọn",
-        textAccessoryDeselect: "Bỏ chọn: ",
-        animationtime: 200, // milisecond
-        delaysearchtime: 200, // milisecond
-        allowHtml: true,
-        maxSelected: 0,
-        labelHalign: "left",
-        labelValign: "center",
-        imageMode: false,
-        imageWidth: "60px",
-        imageHeight: "60px",
-        imageBorderRadius: "4px",
-        imagePosition: "right",
-        ajax: null,
-        on: {
-            load: [],
-            beforeShow: [],
-            show: [],
-            beforeChange: [],
-            change: [],
-            beforeClose: [],
-            close: []
-        }
-    };
-    bindedMap = new Map;
-    unbindedMap = new Map;
-    bindedCommand = [];
+/**
+ * @class
+ */
+export class iStorage {
+    defaultConfig = {
+        showPanel: true,
+        accessoryStyle: "top",
+        multiple: false,
+        minWidth: "50px",
+        width: "0px",
+        offsetWidth: null,
+        minHeight: "30px",
+        height: "30px",
+        panelHeight: "220px",
+        panelMinHeight: "100px",
+        disabled: false,
+        readonly: false,
+        selectall: true,
+        keepSelected: true,
+        placeholder: "Select value",
+        altMask: "",
+        autoclose: false,
+        autoscroll: true,
+        autofocus: true,
+        searchable: true,
+        loadingfield: true,
+        visible: true,
+        skipError: false,
+        customDelimiter: ",",
+        textLoading: "Processing...",
+        textNoData: "No data available",
+        textNotFound: "Not found",
+        textSelectAll: "Select all",
+        textDeselectAll: "Deselect all",
+        textAccessoryDeselect: "Deselect: ",
+        animationtime: 200, // milisecond
+        delaysearchtime: 200, // milisecond
+        allowHtml: true,
+        maxSelected: 0,
+        labelHalign: "left",
+        labelValign: "center",
+        imageMode: false,
+        imageWidth: "60px",
+        imageHeight: "60px",
+        imageBorderRadius: "4px",
+        imagePosition: "right",
+        ajax: null,
+        on: {
+            load: [],
+            beforeShow: [],
+            show: [],
+            beforeChange: [],
+            change: [],
+            beforeClose: [],
+            close: []
+        }
+    };
+    bindedMap = new Map;
+    unbindedMap = new Map;
+    bindedCommand = [];
 }