@xlabs-store/core 0.0.1

package/dist/collection/locales/languages/zh_TW.js

@@ -0,0 +1,120 @@
+export default {
+    locale: 'zh_TW',
+    Pagination: {
+        items_per_page: '/ 頁',
+        jump_to: '跳至',
+        page: '頁',
+        prev_page: '上一頁',
+        next_page: '下一頁',
+    },
+    DatePicker: {
+        lang: {
+            placeholder: '選擇日期',
+            weekDays: ['日', '一', '二', '三', '四', '五', '六'],
+            monthsShort: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
+            monthsFull: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
+            quarters: [
+                { label: 'Q1', months: '1月 - 3月' },
+                { label: 'Q2', months: '4月 - 6月' },
+                { label: 'Q3', months: '7月 - 9月' },
+                { label: 'Q4', months: '10月 - 12月' },
+            ],
+            today: '今天',
+            now: '現在',
+            ok: 'OK',
+            hour: '小時',
+            minute: '分鐘',
+            second: '秒',
+            am: 'AM',
+            pm: 'PM',
+            ampm: 'AM/PM',
+            week: '週',
+        },
+    },
+    TimePicker: {
+        placeholder: '選擇時間',
+    },
+    global: {
+        close: '關閉',
+        go: '前往',
+    },
+    Table: {
+        filterConfirm: 'OK',
+        filterReset: '重置',
+    },
+    Modal: {
+        okText: 'OK',
+        cancelText: '取消',
+    },
+    Popconfirm: {
+        okText: 'OK',
+        cancelText: '取消',
+    },
+    Transfer: {
+        title: {
+            source: '來源',
+            target: '目標',
+        },
+        searchPlaceholder: '搜尋',
+        notFoundContent: '暫無資料',
+    },
+    Empty: {
+        description: '暫無資料',
+    },
+    TreeSelect: {
+        placeholder: '請選擇',
+        notFoundContent: '暫無資料',
+    },
+    Cascader: {
+        placeholder: '請選擇',
+        notFoundContent: '暫無資料',
+    },
+    RangePicker: {
+        startPlaceholder: '開始日期',
+        endPlaceholder: '結束日期',
+    },
+    Editor: {
+        placeholder: '開始輸入...',
+        undo: '復原 (Ctrl+Z)',
+        redo: '重做 (Ctrl+Shift+Z)',
+        bold: '粗體 (Ctrl+B)',
+        italic: '斜體 (Ctrl+I)',
+        underline: '底線 (Ctrl+U)',
+        strikethrough: '刪除線',
+        textColor: '文字顏色',
+        backgroundColor: '背景顏色',
+        fontFamily: '字型',
+        fontSize: '字型大小',
+        h1: '標題 1',
+        h2: '標題 2',
+        h3: '標題 3',
+        h4: '標題 4',
+        h5: '標題 5',
+        h6: '標題 6',
+        paragraph: '段落',
+        blockquote: '引用',
+        codeBlock: '程式碼區塊',
+        alignLeft: '靠左對齊',
+        alignCenter: '置中對齊',
+        alignRight: '靠右對齊',
+        alignJustify: '左右對齊',
+        outdent: '減少縮排',
+        indent: '增加縮排',
+        insertLink: '插入連結',
+        insertImage: '插入圖片',
+        insertVideo: '插入影片',
+        insertFile: '插入檔案',
+        insertTable: '插入表格',
+        horizontalLine: '水平線',
+    },
+    Drawer: {
+        close: '關閉',
+    },
+    Image: {
+        preview: '預覽',
+    },
+    Select: {
+        placeholder: '請選擇',
+        notFoundContent: '暫無資料',
+    },
+};

package/dist/collection/locales/locale.service.js

@@ -0,0 +1,179 @@
+import { builtInLocales } from "./languages";
+/**
+ * Current active locale code
+ */
+let currentLocaleCode = 'en_US';
+/**
+ * Custom locale data registered by the user
+ */
+const customLocales = {};
+const listeners = new Set();
+/**
+ * Get the current locale code
+ */
+export function getLocaleCode() {
+    return currentLocaleCode;
+}
+/**
+ * Get the full locale data for the current (or specified) locale.
+ * Falls back to en_US if the locale is not found.
+ */
+export function getLocaleData(code) {
+    const target = code || currentLocaleCode;
+    // Check custom locales first, then built-in
+    const custom = customLocales[target];
+    if (custom) {
+        return deepMerge(builtInLocales['en_US'], custom);
+    }
+    return builtInLocales[target] || builtInLocales['en_US'];
+}
+/**
+ * Set the current locale.
+ * This will notify all registered listeners.
+ *
+ * @param code - Locale code (e.g. 'en_US', 'vi_VN')
+ *
+ * @example
+ * ```ts
+ * import { setLocale } from '@xlabs/core/locales';
+ * setLocale('vi_VN');
+ * ```
+ */
+export function setLocale(code) {
+    currentLocaleCode = code;
+    const data = getLocaleData(code);
+    listeners.forEach((fn) => fn(currentLocaleCode, data));
+}
+/**
+ * Register a custom locale.
+ * You can extend the built-in locales or add a completely new one.
+ *
+ * @param code - Locale code (e.g. 'ja_JP')
+ * @param data - Partial locale data (will be merged with en_US defaults)
+ *
+ * @example
+ * ```ts
+ * import { registerLocale } from '@xlabs/core/locales';
+ * registerLocale('ja_JP', {
+ *   locale: 'ja',
+ *   Modal: { okText: 'はい', cancelText: 'いいえ', justOkText: 'はい' },
+ * });
+ * ```
+ */
+export function registerLocale(code, data) {
+    customLocales[code] = data;
+}
+/**
+ * Subscribe to locale changes.
+ * Returns an unsubscribe function.
+ *
+ * @param listener - Callback function
+ * @returns unsubscribe function
+ *
+ * @example
+ * ```ts
+ * const unsub = onLocaleChange((code, data) => {
+ *   console.log('Locale changed to', code);
+ * });
+ * // later
+ * unsub();
+ * ```
+ */
+export function onLocaleChange(listener) {
+    listeners.add(listener);
+    return () => listeners.delete(listener);
+}
+/**
+ * Translate a key to the corresponding locale string or value.
+ * Works like `ngx-translate`: uses dot-notation keys, supports interpolation,
+ * and falls back to `defaultValue` → key itself if no translation is found.
+ *
+ * @param key - Dot-notation key path (e.g. 'Modal.okText', 'Pagination.items_per_page')
+ * @param params - Optional interpolation params. Values replace `{{ key }}` or `{ key }` placeholders.
+ * @param defaultValue - Optional fallback when key is not found. If omitted, returns the key itself.
+ *
+ * @example
+ * ```ts
+ * // Simple lookup
+ * translate('Modal.okText');                    // → 'OK'  (en_US)
+ * translate('Modal.okText');                    // → 'Đồng ý' (vi_VN)
+ *
+ * // With default fallback
+ * translate('MyComponent.hello', {}, 'Hello');  // → 'Hello' if key missing
+ *
+ * // With interpolation
+ * translate('Pagination.total', { count: 50 }); // → 'Total 50 items'
+ *   // given locale entry: 'Total {{ count }} items'
+ *
+ * // Complex values
+ * translate<string[]>('DatePicker.lang.weekDays'); // → ['Su', 'Mo', ...]
+ * ```
+ */
+export function translate(key, params, defaultValue) {
+    if (!key)
+        return defaultValue;
+    const data = getLocaleData();
+    const value = resolveKey(data, key);
+    // If value is found
+    if (value !== undefined && value !== null) {
+        if (typeof value === 'string' && params) {
+            return interpolate(value, params);
+        }
+        return value;
+    }
+    // If not found, use defaultValue or key itself
+    if (defaultValue !== undefined) {
+        return defaultValue;
+    }
+    // Fallback to key itself for strings, or undefined for others
+    return key;
+}
+/**
+ * Resolve a dot-notation key from any nested object.
+ * Returns `undefined` if the path does not exist.
+ */
+function resolveKey(data, key) {
+    const parts = key.split('.');
+    let current = data;
+    for (const part of parts) {
+        if (current == null || typeof current !== 'object')
+            return undefined;
+        current = current[part];
+    }
+    return current;
+}
+/**
+ * Interpolate `{{ key }}` and `{ key }` placeholders in a message string.
+ */
+function interpolate(message, params) {
+    let result = message;
+    for (const [key, value] of Object.entries(params)) {
+        const strVal = String(value);
+        // {{ key }} — double-brace style (Angular / ngx-translate)
+        result = result.replace(new RegExp(`\\{\\{\\s*${key}\\s*\\}\\}`, 'g'), strVal);
+        // { key } — single-brace style (ICU-lite)
+        result = result.replace(new RegExp(`\\{\\s*${key}\\s*\\}`, 'g'), strVal);
+    }
+    return result;
+}
+// ===================== Utility =====================
+/**
+ * Deep merge two objects. Source values override target values.
+ */
+function deepMerge(target, source) {
+    const output = { ...target };
+    for (const key of Object.keys(source)) {
+        if (source[key] &&
+            typeof source[key] === 'object' &&
+            !Array.isArray(source[key]) &&
+            target[key] &&
+            typeof target[key] === 'object' &&
+            !Array.isArray(target[key])) {
+            output[key] = deepMerge(target[key], source[key]);
+        }
+        else {
+            output[key] = source[key];
+        }
+    }
+    return output;
+}

package/dist/collection/types.js

@@ -0,0 +1,11 @@
+/**
+ * XLabs Component Types
+ *
+ * Central export file for all component types
+ */
+// Modal Service
+export { Modal } from './components/x-modal/modal-service';
+// Message Service
+export { message } from './components/x-message/message-service';
+// Notification Service
+export { notification } from './components/x-notification/notification-service';

package/dist/collection/utils/app-service.js

@@ -0,0 +1,19 @@
+let activeAppInstance = null;
+/**
+ * Register the global app instance
+ */
+export const registerApp = (instance) => {
+    activeAppInstance = instance;
+};
+/**
+ * Unregister the global app instance
+ */
+export const unregisterApp = () => {
+    activeAppInstance = null;
+};
+/**
+ * Get the currently active global app instance
+ */
+export const getAppInstance = () => {
+    return activeAppInstance;
+};

package/dist/collection/utils/cascader.service.js

@@ -0,0 +1,142 @@
+export class CascaderService {
+    valueKey;
+    labelKey;
+    childrenKey;
+    constructor(fieldNames) {
+        this.valueKey = fieldNames?.value || 'value';
+        this.labelKey = fieldNames?.label || 'label';
+        this.childrenKey = fieldNames?.children || 'children';
+    }
+    /**
+     * Get option value
+     */
+    getValue(option) {
+        return option[this.valueKey];
+    }
+    /**
+     * Get option label
+     */
+    getLabel(option) {
+        return option[this.labelKey];
+    }
+    /**
+     * Get option children
+     */
+    getChildren(option) {
+        return option[this.childrenKey];
+    }
+    /**
+     * Find an option path based on an array of values
+     */
+    findOptionPath(options, valuePath) {
+        const result = [];
+        let currentOptions = options;
+        for (const val of valuePath) {
+            if (!currentOptions)
+                break;
+            const found = currentOptions.find(opt => this.getValue(opt) === val);
+            if (found) {
+                result.push(found);
+                currentOptions = this.getChildren(found) || [];
+            }
+            else {
+                break; // Path is broken
+            }
+        }
+        return result;
+    }
+    /**
+     * Calculate active options (columns representation) from a selected path
+     * @param options The root options
+     * @param path The selected path of options
+     */
+    getActiveOptionsFromPath(options, path) {
+        if (!options || options.length === 0)
+            return [];
+        if (!path || path.length === 0) {
+            return [options];
+        }
+        const activeOptions = [options];
+        for (const opt of path) {
+            const children = this.getChildren(opt);
+            if (children && children.length > 0) {
+                activeOptions.push(children);
+            }
+        }
+        return activeOptions;
+    }
+    /**
+     * Filter cascader options based on search value
+     */
+    filterOptions(options, searchValue, filterFn, currentPath = []) {
+        if (!searchValue)
+            return options;
+        const result = [];
+        if (!options)
+            return result;
+        for (const option of options) {
+            const path = [...currentPath, option];
+            const isMatch = filterFn
+                ? filterFn(searchValue, path)
+                : path.some(opt => {
+                    const label = this.getLabel(opt) || '';
+                    return label.toLowerCase().includes(searchValue.toLowerCase());
+                });
+            const children = this.getChildren(option);
+            if (children && children.length > 0) {
+                const filteredChildren = this.filterOptions(children, searchValue, filterFn, path);
+                if (filteredChildren.length > 0 || isMatch) {
+                    const newOption = { ...option };
+                    newOption[this.childrenKey] = filteredChildren.length > 0 ? filteredChildren : children;
+                    result.push(newOption);
+                }
+            }
+            else {
+                if (isMatch) {
+                    result.push(option);
+                }
+            }
+        }
+        return result;
+    }
+    /**
+     * Get the path to the first leaf node in a tree
+     */
+    getFirstPath(options) {
+        if (!options || options.length === 0)
+            return [];
+        const firstNode = options[0];
+        const children = this.getChildren(firstNode);
+        if (children && children.length > 0) {
+            return [firstNode, ...this.getFirstPath(children)];
+        }
+        return [firstNode];
+    }
+    /**
+     * Get the path to the first matching node in the tree
+     */
+    getFirstMatchingPath(options, searchValue, filterFn, currentPath = []) {
+        if (!options || options.length === 0)
+            return [];
+        for (const option of options) {
+            const path = [...currentPath, option];
+            const isMatch = filterFn
+                ? filterFn(searchValue, path)
+                : path.some(opt => {
+                    const label = this.getLabel(opt) || '';
+                    return label.toLowerCase().includes(searchValue.toLowerCase());
+                });
+            if (isMatch) {
+                return [option];
+            }
+            const children = this.getChildren(option);
+            if (children && children.length > 0) {
+                const childPath = this.getFirstMatchingPath(children, searchValue, filterFn, path);
+                if (childPath.length > 0) {
+                    return [option, ...childPath];
+                }
+            }
+        }
+        return [options[0]];
+    }
+}

package/dist/collection/utils/config.js

@@ -0,0 +1,59 @@
+const defaultConfig = {
+    icons: {
+        search: 'search',
+        clear: 'cancel',
+        close: 'close',
+        delete: 'delete',
+        remove: 'cancel',
+        check: 'check',
+        checkSmall: 'check_small',
+        loading: 'progress_activity',
+        upload: 'upload',
+        date: 'date_range',
+        time: 'pace',
+        calendar: 'calendar_today',
+        arrowDown: 'keyboard_arrow_down',
+        arrowUp: 'keyboard_arrow_up',
+        arrowLeft: 'keyboard_arrow_left',
+        arrowRight: 'keyboard_arrow_right',
+        doubleArrowLeft: 'keyboard_double_arrow_left',
+        doubleArrowRight: 'keyboard_double_arrow_right',
+        visibility: 'visibility',
+        visibilityOff: 'visibility_off',
+        file: 'file',
+        more: 'more_vert',
+        paperClip: 'attach_file',
+        picture: 'image',
+        eye: 'visibility',
+        download: 'download',
+        plus: 'add',
+        inbox: 'inbox',
+        zoomIn: 'zoom_in',
+        zoomOut: 'zoom_out',
+        rotateLeft: 'rotate_left',
+        rotateRight: 'rotate_right',
+        flipX: 'flip',
+        flipY: 'flip',
+        success: 'check_circle',
+        error: 'cancel',
+        warning: 'warning',
+        info: 'info',
+    }
+};
+let globalConfig = {
+    icons: { ...defaultConfig.icons }
+};
+export const setGlobalConfig = (config) => {
+    globalConfig = {
+        ...globalConfig,
+        ...config,
+        icons: {
+            ...globalConfig.icons,
+            ...(config.icons || {}),
+        }
+    };
+};
+export const getIcon = (key) => {
+    return globalConfig.icons[key] ?? defaultConfig.icons[key];
+};
+export const getGlobalConfig = () => globalConfig;