@ng-nest/ui 17.0.12 → 18.0.0

package/fesm2022/ng-nest-ui-core.mjs

@@ -1,19 +1,18 @@
 import { trigger, transition, style, animate, state } from '@angular/animations';
-import { isObservable, Observable, of, throwError, Subject } from 'rxjs';
-import { coerceBooleanProperty, _isNumberValue } from '@angular/cdk/coercion';
-import { map, takeUntil, filter, mapTo } from 'rxjs/operators';
+import { isObservable, Observable, BehaviorSubject, Subject, of, throwError } from 'rxjs';
+import { coerceCssPixelValue } from '@angular/cdk/coercion';
+import { map, takeUntil, filter } from 'rxjs/operators';
 import * as i0 from '@angular/core';
-import { Injectable, InjectionToken, inject } from '@angular/core';
+import { booleanAttribute, numberAttribute, InjectionToken, inject, Injectable } from '@angular/core';
+import { DOCUMENT } from '@angular/common';
 import * as i1 from '@angular/common/http';
 import * as i1$1 from '@angular/cdk/platform';
-import { DOCUMENT } from '@angular/common';
 
 /**
- * Fill default values
- * @param option option
- * @param def default
+ * @zh_CN 填充默认值
+ * @en_US Fill default values
  */
-function fillDefault(option, def) {
+function XFillDefault(option, def) {
     if (option && def) {
         for (const key in def) {
             if (typeof option[key] === 'undefined') {
@@ -24,9 +23,10 @@ function fillDefault(option, def) {
 }
 
 /**
- * 删除当前标签，保留内容
+ * @zh_CN 删除当前标签，保留内容
+ * @en_US Delete the current label and keep the content
  */
-function removeNgTag(nativeElement) {
+function XRemoveNgTag(nativeElement) {
     const parentElement = nativeElement.parentElement;
     if (!parentElement || !parentElement.insertBefore)
         return;
@@ -36,18 +36,34 @@ function removeNgTag(nativeElement) {
     parentElement.removeChild(nativeElement);
 }
 
-function warnSVGTagNotFound() {
+/**
+ * @zh_CN svg 标签不存在的警告信息
+ * @en_US Warning information that does not exist in SVG tags
+ */
+function XWarnSVGTagNotFound() {
     console.warn(`<svg> tag not found.`);
 }
-function warnIconTypeNotFound() {
+/**
+ * @zh_CN icon 不存在的警告信息
+ * @en_US Warning information that does not exist in icon
+ */
+function XWarnIconTypeNotFound() {
     console.warn(`icon type not found.`);
 }
 
+/**
+ * @zh_CN 获取元素的指定样式的计算值
+ * @en_US The calculation value of the specified style of the element
+ */
 function XComputedStyle(element, style) {
     let computed = XComputed(element);
     let value = computed[style];
     return value.replace(/px/g, '');
 }
+/**
+ * @zh_CN 获取元素的计算样式
+ * @en_US Calculation style of obtaining elements
+ */
 function XComputed(element) {
     if (typeof getComputedStyle === 'function') {
         return getComputedStyle(element);
@@ -79,47 +95,71 @@ function getRequestAnimationFrame() {
     const prefix = availablePrefixes.filter((key) => `${key}RequestAnimationFrame` in window)[0];
     return prefix ? window[`${prefix}RequestAnimationFrame`] : requestAnimationFramePolyfill();
 }
-// export function cancelRequestAnimationFrame(id: number): any {
-//   if (typeof window === "undefined") {
-//     return null;
-//   }
-//   if (window.cancelAnimationFrame) {
-//     return window.cancelAnimationFrame(id);
-//   }
-//   const prefix = availablePrefixes.filter(
-//     key =>
-//       `${key}CancelAnimationFrame` in window ||
-//       `${key}CancelRequestAnimationFrame` in window
-//   )[0];
-//   return prefix
-//     ? (
-//         (window as any)[`${prefix}CancelAnimationFrame`] ||
-//         (window as any)[`${prefix}CancelRequestAnimationFrame`]
-//       )
-//         // @ts-ignore
-//         .call(this, id)
-//     : clearTimeout(id);
-// }
-const reqAnimFrame = getRequestAnimationFrame();
+const XRequestAnimationFrame = getRequestAnimationFrame();
 
 /**
- * 去除HTML标签
+ * @zh_CN 去除 HTML 标签
+ * @en_US Remove the html tag
  */
-function stripTags(text, ...usefulTags) {
-    if (!text || typeof (text) !== 'string')
+function XStripTags(text, ...usefulTags) {
+    if (!text || typeof text !== 'string')
         return text;
     return usefulTags.length > 0
         ? text.replace(new RegExp(`<(?!\/?(${usefulTags.join('|')})\s*\/?)[^>]+>`, 'g'), '')
         : text.replace(/<(?:.|\s)*?>/g, '');
 }
 
-function isNotNil(value) {
+/**
+ * @zh_CN 判断值不为 null 或 undefined
+ * @en_US The judgment value is not null or undefined
+ */
+function XIsNotNil(value) {
     return typeof value !== 'undefined' && value !== null;
 }
-function isNil(value) {
+/**
+ * @zh_CN 判断值为 null 或 undefined
+ * @en_US The judgment value is null or undefined
+ */
+function XIsNil(value) {
     return typeof value === 'undefined' || value === null;
 }
 
+/**
+ * @zh_CN 该函数将字符串中的驼峰命名法转换为减号命名法
+ * - 采用正则表达式匹配字符串中每个连续的大小写字母边界
+ * - 将其替换为小写字母和连字符的组合
+ * - 最后将整个字符串转换为小写
+ * - 例如，`XCamelToKebab('helloWorld')` 将返回 `hello-world`
+ * @en_US This function converts string of hump nomenclature kebab nomenclature
+ * - Use regular expression match each successive lowercase letters in the string boundary
+ * - Replace it with a lower case letters and hyphens
+ * - Finally the whole string converted to lowercase
+ * - For example, `XCamelToKebab('helloWorld')` returns the `hello-world`
+ */
+function XCamelToKebab(str) {
+    return str.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
+}
+
+/**
+ * @zh_CN 该函数将字符串中的减号命名法转换为驼峰命名法
+ * - 使用正则表达式匹配所有连字符后的字母 ( `(\w)` )
+ * - 用 `toUpperCase()` 将这些字母转换为大写
+ * - 替换原字符串中的连字符和小写字母为大写字母
+ * - 例如，`XKebabToCamel('hello-world')` 将返回 `helloWorld`
+ * @en_US This function converts string minus nomenclature of hump nomenclature
+ * - Use a regular expression match all the letter after a hyphen ( `(\w)` )
+ * - Use `toUpperCase()` converts these letters to uppercase
+ * - Replace the original string the hyphen and lowercase letters to uppercase
+ * - For example, `XKebabToCamel('hello-world')` returns `helloWorld`
+ */
+function XKebabToCamel(str) {
+    return str.replace(/-(\w)/g, (_, char) => char.toUpperCase());
+}
+
+/**
+ * @zh_CN 动画执行时间
+ * @en_US Animation execution time
+ */
 var XDuration;
 (function (XDuration) {
     XDuration["Slow"] = "0.3s";
@@ -127,10 +167,20 @@ var XDuration;
     XDuration["Fast"] = "0.1s";
 })(XDuration || (XDuration = {}));
 
-// 进场动画
+/**
+ * @zh_CN 进场动画
+ * @en_US Enter an animation
+ */
 const XDURATION_BASE_EASE_IN$1 = `${XDuration.Fast} ease-in`;
-// 移除动画
+/**
+ * @zh_CN 移除动画
+ * @en_US Remove animation
+ */
 const XDURATION_BASE_EASE_OUT$1 = `${XDuration.Fast} ease-out`;
+/**
+ * @zh_CN 淡入淡出动画
+ * @en_US Fade into the animation
+ */
 const XFadeAnimation = trigger('x-fade-animation', [
     transition(':enter', [
         style({ opacity: 0, transform: 'scale(0.8)' }),
@@ -139,6 +189,10 @@ const XFadeAnimation = trigger('x-fade-animation', [
     transition(':leave', [animate(`${XDURATION_BASE_EASE_OUT$1}`, style({ opacity: 0 }))])
 ]);
 
+/**
+ * @zh_CN 抽屉动画
+ * @en_US Drawer animation
+ */
 const XSlideAnimation = trigger('x-slide-animation', [
     transition('void => right', [style({ transform: 'translate(100%,0)' }), animate(`${XDuration.Base} ease-in`)]),
     transition('right => void', [animate(`${XDuration.Base} ease-out`, style({ transform: 'translate(100%,0)' }))]),
@@ -149,29 +203,11 @@ const XSlideAnimation = trigger('x-slide-animation', [
     transition('void => bottom', [style({ transform: 'translate(0,100%)' }), animate(`${XDuration.Base} ease-in`)]),
     transition('bottom => void', [animate(`${XDuration.Base} ease-out`, style({ transform: 'translate(0,100%)' }))])
 ]);
-const XSliderAnimation = trigger('x-slider-animation', [
-    transition('void => left, void => right', [
-        style({
-            width: 0,
-            opacity: 0
-        }),
-        animate(`${XDuration.Base}`, style({
-            width: '*',
-            opacity: 1
-        }))
-    ]),
-    transition('left => void, right => void', [
-        style({
-            width: '*',
-            opacity: 1
-        }),
-        animate(`${XDuration.Base}`, style({
-            width: 0,
-            opacity: 0
-        }))
-    ])
-]);
 
+/**
+ * @zh_CN 放置动画
+ * @en_US Drop animation
+ */
 const XDropAnimation = trigger('x-drop-animation', [
     state('*', style({ opacity: 0, height: 0, border: 0, padding: 0, visibility: 'hidden' })),
     state('false', style({ opacity: 0, height: 0, border: 0, padding: 0, visibility: 'hidden' })),
@@ -179,6 +215,10 @@ const XDropAnimation = trigger('x-drop-animation', [
     transition('* => *', animate(`${XDuration.Base} ease-out`))
 ]);
 
+/**
+ * @zh_CN 移入移出动画
+ * @en_US Move in the animation
+ */
 const XMoveAnimation = trigger('x-move-animation', [
     transition('void => top-start, void => top, void => top-end, void => center', [
         style({
@@ -352,121 +392,49 @@ const XMoveBoxAnimation = trigger('x-move-box-animation', [
     ])
 ]);
 
-// 进场动画
-// const XDURATION_SLOW_EASE_IN = `${XDuration.Slow} ease-in`;
+/**
+ * @zh_CN 进场动画
+ * @en_US Enter an animation
+ */
 const XDURATION_BASE_EASE_IN = `${XDuration.Base} ease-in`;
 const XDURATION_FAST_EASE_IN = `${XDuration.Fast} ease-in`;
-// 移除动画
-// const XDURATION_SLOW_EASE_OUT = `${XDuration.Slow} ease-out`;
+/**
+ * @zh_CN 移除动画
+ * @en_US Remove animation
+ */
 const XDURATION_BASE_EASE_OUT = `${XDuration.Base} ease-out`;
 const XDURATION_FAST_EASE_OUT = `${XDuration.Fast} ease-out`;
-const XConnectAnimation = trigger('x-connect-animation', [
-    transition('void => top-start, void => top, void => top-end, void => center', [
-        style({
-            opacity: 0
-            // transform: 'scaleY(0.8)',
-            // transformOrigin: '0% 100%'
-        }),
-        animate(XDURATION_FAST_EASE_IN, style({
-            opacity: 1
-            // transform: 'scaleY(1)',
-            // transformOrigin: '0% 100%'
-        }))
-    ]),
-    transition('top-start => void, top => void, top-end => void, center => void', [
-        style({
-            opacity: 1
-            // transform: 'scaleY(1)',
-            // transformOrigin: '0% 100%'
-        }),
-        animate(XDURATION_FAST_EASE_OUT, style({
-            opacity: 0
-            // transform: 'scaleY(0.8)',
-            // transformOrigin: '0% 100%'
-        }))
-    ]),
-    transition('void => left', [
-        style({
-            transform: 'translateX(-30%)',
-            opacity: 0
-        }),
-        animate(`${XDuration.Base}`, style({
-            transform: 'translateX(0%)',
-            opacity: 1
-        }))
-    ]),
-    transition('left => void', [
-        style({
-            transform: 'translateX(0%)',
-            opacity: 1,
-            height: '*'
-        }),
-        animate(`${XDuration.Base}`, style({
-            transform: 'translateX(-30%)',
-            opacity: 0,
-            height: 0
-        }))
-    ]),
-    transition('void => right', [
-        style({
-            transform: 'translateX(30%)',
-            opacity: 0
-        }),
-        animate(`${XDuration.Base}`, style({
-            transform: 'translateX(0%)',
-            opacity: 1
-        }))
-    ]),
-    transition('right => void', [
-        style({
-            transform: 'translateX(0%)',
-            opacity: 1,
-            height: '*'
-        }),
-        animate(`${XDuration.Base}`, style({
-            transform: 'translateX(30%)',
-            opacity: 0,
-            height: 0
-        }))
-    ]),
-    transition('void => bottom-start, void => bottom, void => bottom-end', [
-        style({
-            opacity: 0
-            // transform: 'scale(0)',
-            // transformOrigin: '0% 0%'
-        }),
-        animate(XDURATION_FAST_EASE_IN, style({
-            opacity: 1
-            // transform: 'scale(1)',
-            // transformOrigin: '30% 30%'
-        }))
-    ]),
-    transition('bottom-start => void, bottom => void, bottom-end => void', [
-        style({
-            opacity: 1
-            // transform: 'scale(1)',
-            // transformOrigin: '30% 30%'
-        }),
-        animate(XDURATION_FAST_EASE_OUT, style({
-            opacity: 0
-            // transform: 'scale(0)',
-            // transformOrigin: '0% 0%'
-        }))
-    ])
-]);
+/**
+ * @zh_CN 弹框连接时的动画，只处理 Y 轴
+ * @en_US The animation when the bomb frame is connected, only the y-axis
+ */
 const XConnectBaseAnimation = trigger('x-connect-base-animation', [
     transition(':enter', [style({ opacity: 0, transform: 'scaleY(0.8)' }), animate(XDURATION_FAST_EASE_IN)]),
     transition(':leave', [animate(XDURATION_FAST_EASE_OUT, style({ opacity: 0 }))])
 ]);
+/**
+ * @zh_CN 弹框连接时的动画，缩放
+ * @en_US The animation when the bomb frame is connected, zoomed in
+ */
 const XBaseAnimation = trigger('x-base-animation', [
     transition(':enter', [style({ opacity: 0, transform: 'scale(0.2)' }), animate(XDURATION_BASE_EASE_IN)]),
     transition(':leave', [animate(XDURATION_BASE_EASE_OUT, style({ opacity: 0, transform: 'scale(0.2)' }))])
 ]);
 
-// 进场动画
+/**
+ * @zh_CN 进场动画
+ * @en_US Enter an animation
+ */
 const XDURATION_SLOW_EASE_IN = `${XDuration.Slow} ease-in`;
-// 移除动画
+/**
+ * @zh_CN 移除动画
+ * @en_US Remove animation
+ */
 const XDURATION_SLOW_EASE_OUT = `${XDuration.Slow} ease-out`;
+/**
+ * @zh_CN Badge 动画
+ * @en_US Badge animation
+ */
 const XBadgeAnimation = trigger('x-badge-animation', [
     transition(':enter', [
         style({ opacity: 0, transform: 'scale(0) translate(50%, -50%)' }),
@@ -483,6 +451,10 @@ const XBadgeAnimation = trigger('x-badge-animation', [
         }))
     ])
 ]);
+/**
+ * @zh_CN Badge 独立存在时的动画
+ * @en_US The animation when Badge exists independently
+ */
 const XBadgeStandaloneAnimation = trigger('x-badge-standalone-animation', [
     transition(':enter', [
         style({ opacity: 0, transform: 'scale(0)' }),
@@ -500,6 +472,10 @@ const XBadgeStandaloneAnimation = trigger('x-badge-standalone-animation', [
     ])
 ]);
 
+/**
+ * @zh_CN 透明度淡入淡出动画
+ * @en_US The transparency fades into the animation
+ */
 const XOpacityAnimation = trigger('x-opacity-animation', [
     state('*', style({ opacity: 0 })),
     state('false', style({ opacity: 0 })),
@@ -507,95 +483,205 @@ const XOpacityAnimation = trigger('x-opacity-animation', [
     transition('* => *', animate(`${XDuration.Slow} cubic-bezier(0.25, 0.8, 0.25, 1)`))
 ]);
 
-// 类型判断
-const XIsType = (type) => (object) => Object.prototype.toString.call(object) === `[object ${type}]`;
-// 值改变判断
-const XIsChange = (...changes) => {
+/**
+ * @zh_CN 类型判断
+ * @en_US Type judgment
+ */
+function XIsType(type) {
+    return (object) => Object.prototype.toString.call(object) === `[object ${type}]`;
+}
+/**
+ * @zh_CN 值改变判断
+ * @en_US Value change judgment
+ */
+function XIsChange(...changes) {
     for (let change of changes) {
         if (change?.currentValue !== change?.previousValue)
             return true;
     }
     return false;
-};
+}
 const IsString = XIsType('String');
 const IsArray = XIsType('Array');
 const IsNumber = XIsType('Number');
 const IsBoolean = XIsType('Boolean');
 const IsObject = XIsType('Object');
-const IsNull = XIsType('Null');
+const IsNull = (value) => value === null;
 const IsFunction = XIsType('Function');
 const IsDate = XIsType('Date');
 const IsRegExp = XIsType('RegExp');
+/**
+ * @zh_CN 判断给定的值是否为字符串类型
+ * @en_US Determine whether the given value is a string type
+ */
 function XIsString(value) {
     return IsString(value);
 }
+/**
+ * @zh_CN 判断给定的值是否为数组类型
+ * @en_US Determine whether the given value is a array type
+ */
 function XIsArray(value) {
     return IsArray(value);
 }
+/**
+ * @zh_CN 判断给定的值是否为数字类型
+ * @en_US Determine whether the given value is a number type
+ */
 function XIsNumber(value) {
     return IsNumber(value);
 }
+/**
+ * @zh_CN 判断给定的值是否为布尔类型
+ * @en_US Determine whether the given value is a boolean type
+ */
 function XIsBoolean(value) {
     return IsBoolean(value);
 }
+/**
+ * @zh_CN 判断给定的值是否为对象类型
+ * @en_US Determine whether the given value is a object type
+ */
 function XIsObject(value) {
     return IsObject(value);
 }
+/**
+ * @zh_CN 判断给定的值是否为 null 类型
+ * @en_US Determine whether the given value is a null type
+ */
 function XIsNull(value) {
     return IsNull(value);
 }
+/**
+ * @zh_CN 判断给定的值是否为函数类型
+ * @en_US Determine whether the given value is a function type
+ */
 function XIsFunction(value) {
     return IsFunction(value);
 }
+/**
+ * @zh_CN 判断给定的值是否为日期类型
+ * @en_US Determine whether the given value is a date type
+ */
 function XIsDate(value) {
     return IsDate(value);
 }
+/**
+ * @zh_CN 判断给定的值是否为正则表达式
+ * @en_US Determine whether the given value is a regular expression
+ */
 function XIsRegExp(value) {
     return IsRegExp(value);
 }
+/**
+ * @zh_CN 判断给定的值是否为 undefined
+ * @en_US Determine whether the given value is undefined
+ */
 function XIsUndefined(value) {
     return typeof value === 'undefined';
 }
+/**
+ * @zh_CN 判断给定的值是否为字符串、数字、布尔值或日期
+ * @en_US Determine whether the given value is a string, number, Boolean value or date
+ */
 function XIsValue(object) {
     return XIsString(object) || XIsNumber(object) || XIsBoolean(object) || XIsDate(object);
 }
+/**
+ * @zh_CN 判断一个对象是否为空
+ * @en_US Determine whether an object is empty
+ */
 function XIsEmpty(object) {
-    return XIsUndefined(object) || XIsNull(object) || object === '' || object.length === 0;
+    try {
+        return XIsUndefined(object) || XIsNull(object) || object === '' || object.length === 0;
+    }
+    catch (e) {
+        console.error(object, e);
+    }
+    return true;
 }
+/**
+ * @zh_CN 判断给定的对象是否为非空数组
+ * @en_US Determine whether the given object is a non -empty array
+ */
 function XIsValueArray(object) {
     return XIsArray(object) && object.length > 0 && !XIsObject(object[0]);
 }
+/**
+ * @zh_CN 判断给定的对象是否为非空对象数组
+ * @en_US Determine whether the given object is a non -empty object array
+ */
 function XIsObjectArray(object) {
     return XIsArray(object) && object.length > 0 && XIsObject(object[0]);
 }
+/**
+ * @zh_CN 判断给定的对象是否为 Observable
+ * @en_US Determine whether the given object is observable
+ */
 function XIsObservable(object) {
     return isObservable(object);
 }
+/**
+ * @zh_CN 判断给定的对象是否为 TemplateRef
+ * @en_US Determine whether the given object is TemplateRef
+ */
 function XIsTemplateRef(object) {
     if (!XIsEmpty(object) && object.elementRef)
         return true;
     else
         return false;
 }
+/**
+ * @zh_CN 判断给定的对象是否为 XTemplateRef
+ * @en_US Determine whether the given object is XTemplateRef
+ */
 function XIsXTemplate(object) {
     return XIsString(object) || XIsNumber(object) || XIsDate(object) || XIsTemplateRef(object);
 }
+/**
+ * @zh_CN 判断给定的对象是否为 InputSignal
+ * @en_US Determine whether a given object for InputSignal
+ */
+function XIsInputSignal(object) {
+    return XIsFunction(object) && object.name === 'inputValueFn';
+}
 
-// 标识对象
+/**
+ * @zh_CN 标识对象
+ * @en_US Identify object
+ */
 class XIdentity {
 }
 
+/**
+ * @zh_CN 转换 value 为 boolean 值
+ * @en_US Convert the value to boolean value
+ */
 function XToBoolean(value) {
-    // if (XIsString(value)) {
-    //   return ['', 'true'].indexOf(String(value).trim()) !== -1;
-    // } else {
-    //   return Boolean(value);
-    // }
-    return coerceBooleanProperty(value);
+    return booleanAttribute(value);
 }
-function XToNumber(value, fallbackValue = 0) {
-    return _isNumberValue(value) ? Number(value) : fallbackValue;
+/**
+ * @zh_CN 转换 value 为像素值
+ * @en_US Convert the value to pixels
+ */
+function XToCssPixelValue(value) {
+    if (!XIsNumber(value) && /^\d+(\.\d+)?$/.test(value)) {
+        return coerceCssPixelValue(Number(value));
+    }
+    else {
+        return coerceCssPixelValue(value);
+    }
+}
+function XToString(value) {
+    return `${value}`;
 }
+function XToNumber(value, fallbackValue) {
+    return numberAttribute(value, fallbackValue);
+}
+/**
+ * @zh_CN 转换 value 为指定的 list 数据 [{ label: any; id: any }, ....]
+ * @en_US Convert value as the specified list data [{ label: any; id: any }, ....]
+ */
 function XToDataConvert(value) {
     if (XIsArray(value)) {
         return value.map((x) => {
@@ -612,6 +698,30 @@ function XToDataConvert(value) {
     }
     return value;
 }
+/**
+ * @zh_CN 转换 value 为指定的 list 数据 [{ label: any; id: any }, ....]
+ * @en_US Convert value as the specified list data [{ label: any; id: any }, ....]
+ */
+function XToDataArray(value) {
+    if (XIsArray(value)) {
+        return value.map((x) => {
+            if (XIsValue(x)) {
+                return { label: x, id: x };
+            }
+            else if (XIsObject(x)) {
+                x.label = XIsUndefined(x.label) || XIsNull(x.label) ? x.id : x.label;
+                x.id = XIsUndefined(x.id) || XIsNull(x.id) ? x.label : x.id;
+                return x;
+            }
+            return x;
+        });
+    }
+    return [{ label: value, id: value }];
+}
+/**
+ * @zh_CN 根据 data 的类型获取实际的数据
+ * @en_US Obtain actual data based on the type of data
+ */
 function XSetData(data, unSubject, toConvert = true, funcParam = null) {
     return new Observable((x) => {
         const result = (res) => {
@@ -640,8 +750,12 @@ function XSetData(data, unSubject, toConvert = true, funcParam = null) {
                 result((toConvert ? XToDataConvert(data) : data));
             }
         }
-    });
+    }).pipe(takeUntil(unSubject));
 }
+/**
+ * @zh_CN 根据 id、pid 获取子节点
+ * @en_US Obtain sub-nodes based on ID and PID
+ */
 function XGetChildren(nodes, node, level) {
     node.level = level;
     node.children = nodes.filter((y) => y.pid === node.id);
@@ -650,12 +764,20 @@ function XGetChildren(nodes, node, level) {
         node.children.map((y) => XGetChildren(nodes, y, level + 1));
     return node;
 }
+/**
+ * @zh_CN 将对象键值对反转
+ * @en_US Reversal the key value of the object
+ */
 function XInvertKeyValues(obj) {
     return Object.keys(obj).reduce((nw, key) => {
         nw.set(obj[key], key);
         return nw;
     }, new Map());
 }
+/**
+ * @zh_CN 设置样式名称为 false
+ * @en_US Set style name is false
+ */
 function XClearClass(...classMaps) {
     classMaps.forEach((classMap) => {
         for (const key in classMap) {
@@ -663,6 +785,23 @@ function XClearClass(...classMaps) {
         }
     });
 }
+/**
+ * @zh_CN 设置样式名称为 false
+ * @en_US Set style name is false
+ */
+function XClearClassSignal(...classMaps) {
+    classMaps.forEach((classMap) => {
+        const value = classMap();
+        for (const key in value) {
+            value[key] = false;
+        }
+        classMap.set(value);
+    });
+}
+/**
+ * @zh_CN 创建属性装饰器的工厂函数
+ * @en_US Factory functions that create attribute decorators
+ */
 function propDecoratorFactory(name, fallback) {
     function propDecorator(target, propName, originalDescriptor) {
         const privatePropName = `$$__${propName}`;
@@ -675,7 +814,9 @@ function propDecoratorFactory(name, fallback) {
         });
         return {
             get() {
-                return originalDescriptor && originalDescriptor.get ? originalDescriptor.get.bind(this)() : this[privatePropName];
+                return originalDescriptor && originalDescriptor.get
+                    ? originalDescriptor.get.bind(this)()
+                    : this[privatePropName];
             },
             set(value) {
                 if (originalDescriptor && originalDescriptor.set) {
@@ -687,19 +828,46 @@ function propDecoratorFactory(name, fallback) {
     }
     return propDecorator;
 }
+/**
+ * @zh_CN 创建 XInputBoolean 属性装饰器
+ * @en_US Create XInputBoolean Properties
+ */
 function XInputBoolean() {
     return propDecoratorFactory('XInputBoolean', XToBoolean);
 }
+/**
+ * @zh_CN 创建 XInputNumber 属性装饰器
+ * @en_US Create XInputNumber Properties
+ */
 function XInputNumber() {
     return propDecoratorFactory('XInputNumber', XToNumber);
 }
+/**
+ * @zh_CN 创建 XInputNumber 属性装饰器
+ * @en_US Create XInputNumber Properties
+ */
+function XInputCssPixelValue() {
+    return propDecoratorFactory('XInputCssPixelValue', XToCssPixelValue);
+}
+/**
+ * @zh_CN 创建 XDataConvert 属性装饰器
+ * @en_US Create XDataConvert Properties
+ */
 function XDataConvert() {
     return propDecoratorFactory('XDataConvert', XToDataConvert);
 }
+/**
+ * @zh_CN 限制给定数值 value 的范围
+ * @en_US Limit the range of the given value value
+ */
 function XClamp(value, min, max) {
     return Math.max(min, Math.min(max, value));
 }
 
+/**
+ * @zh_CN 转换 Date
+ * @en_US Convert to date
+ */
 function XToDate(date) {
     if (XIsDate(date) || XIsNumber(date)) {
         return new Date(date);
@@ -708,6 +876,10 @@ function XToDate(date) {
         return new Date(Date.parse(date));
     }
 }
+/**
+ * @zh_CN 日期添加毫秒数，负数为减少
+ * @en_US Add milliseconds to the date, the negative number is reduced
+ */
 function XAddMilliseconds(date, amount) {
     let dt = XToDate(date);
     if (!isNaN(dt.valueOf()) && amount) {
@@ -717,15 +889,31 @@ function XAddMilliseconds(date, amount) {
         return date;
     }
 }
+/**
+ * @zh_CN 日期添加秒数，负数为减少
+ * @en_US Date adds seconds, the negative number is reduced
+ */
 function XAddSeconds(date, amount) {
     return XAddMilliseconds(date, amount * 1000);
 }
+/**
+ * @zh_CN 日期添加分钟数，负数为减少
+ * @en_US Date adds minutes, the negative number is reduced
+ */
 function XAddMinutes(date, amount) {
     return XAddMilliseconds(date, amount * 60000);
 }
-function XAddHours(date, amount) {
+/**
+ * @zh_CN 日期添加小时数，负数为减少
+ * @en_US Date adds hours, the negative number is reduced
+ */
+function XAddHours(date, amount) {
     return XAddMilliseconds(date, amount * 3600000);
 }
+/**
+ * @zh_CN 日期添加天数，负数为减少
+ * @en_US Date adds days, the negative number is reduced
+ */
 function XAddDays(date, amount) {
     let dt = XToDate(date);
     if (!isNaN(dt.valueOf()) && amount) {
@@ -736,6 +924,10 @@ function XAddDays(date, amount) {
         return date;
     }
 }
+/**
+ * @zh_CN 日期添加月数，负数为减少
+ * @en_US Date adds monthly number, negative number is reduced
+ */
 function XAddMonths(date, amount) {
     let dt = XToDate(date);
     if (!isNaN(dt.valueOf()) && amount) {
@@ -756,9 +948,17 @@ function XAddMonths(date, amount) {
         return date;
     }
 }
+/**
+ * @zh_CN 日期添加年数，负数为减少
+ * @en_US The number of years of date, the negative number is reduced
+ */
 function XAddYears(date, amount) {
     return XAddMonths(date, amount * 12);
 }
+/**
+ * @zh_CN 获取给定日期的 ISO 周数
+ * @en_US Get the number of ISO weeks of the given date
+ */
 function XDateWeek(date) {
     let dt = XToDate(date);
     if (!isNaN(dt.valueOf())) {
@@ -766,6 +966,10 @@ function XDateWeek(date) {
     }
     return;
 }
+/**
+ * @zh_CN 获取指定日期的 ISO 周年份
+ * @en_US Get the ISO anniversary of the specified date
+ */
 function XDateWeekYear(date) {
     let dt = XToDate(date);
     if (!isNaN(dt.valueOf())) {
@@ -773,34 +977,58 @@ function XDateWeekYear(date) {
     }
     return;
 }
+/**
+ * @zh_CN 获取指定日期的年份和周数
+ * @en_US Get the year and week of the specified date
+ */
 function XDateYearWeek(date) {
     let dt = XToDate(date);
     if (!isNaN(dt.valueOf())) {
         return `${getISOWeekYear(dt)}-${getISOWeek(dt)}`;
     }
-    return;
+    return '';
 }
+/**
+ * @zh_CN 获取指定日期的年份和季度
+ * @en_US Get the year and quarter of the specified date
+ */
 function XDateYearQuarter(date) {
     let dt = XToDate(date);
     if (!isNaN(dt.valueOf())) {
         return `${dt.getFullYear()}-${XDateQuarter(dt)}`;
     }
-    return;
+    return '';
 }
+/**
+ * @zh_CN 获取指定日期所属的季度
+ * @en_US Get the season when the specified date belongs
+ */
 function XDateQuarter(date) {
     let dt = XToDate(date);
     if (!isNaN(dt.valueOf())) {
         return `Q${Math.ceil((dt.getMonth() + 1) / 3)}`;
     }
-    return;
+    return '';
 }
+/**
+ * @zh_CN 获取给定日期的 ISO 周数
+ * @en_US Get the number of ISO weeks of the given date
+ */
 function getISOWeek(date) {
     const diff = startOfISOWeek(date).getTime() - startOfISOWeekYear(date).getTime();
     return Math.round(diff / 604800000) + 1;
 }
+/**
+ * @zh_CN 获取给定日期所在 ISO 周的开始日期
+ * @en_US The start date of the ISO week where the given date is located
+ */
 function startOfISOWeek(date) {
     return startOfWeek(date, { weekStartsOn: 1 });
 }
+/**
+ * @zh_CN 获取给定日期所在周的开始日期
+ * @en_US The start date of the ISO week where the given date is located
+ */
 function startOfWeek(date, options) {
     const weekStartsOn = options?.weekStartsOn || 0;
     const day = date.getDay();
@@ -809,6 +1037,10 @@ function startOfWeek(date, options) {
     date.setHours(0, 0, 0, 0);
     return date;
 }
+/**
+ * @zh_CN 获取给定日期所在 ISO 周年的起始日期
+ * @en_US The start date of the ISO anniversary where the given date is located
+ */
 function startOfISOWeekYear(date) {
     const year = getISOWeekYear(date);
     const fourthOfJanuary = constructFrom(date, 0);
@@ -817,6 +1049,10 @@ function startOfISOWeekYear(date) {
     const result = startOfISOWeek(fourthOfJanuary);
     return result;
 }
+/**
+ * @zh_CN 返回一个与传入的 date 参数类型相同的对象
+ * @en_US Return to an object of the same type of Date parameter.
+ */
 function constructFrom(date, value) {
     if (date instanceof Date) {
         return new date.constructor(value);
@@ -825,6 +1061,10 @@ function constructFrom(date, value) {
         return new Date(value);
     }
 }
+/**
+ * @zh_CN 获取给定日期的 ISO 周年份
+ * @en_US Obtain the ISO anniversary of the given date
+ */
 function getISOWeekYear(date) {
     const year = date.getFullYear();
     const fourthOfJanuaryOfNextYear = constructFrom(date, 0);
@@ -846,6 +1086,10 @@ function getISOWeekYear(date) {
     }
 }
 
+/**
+ * @zh_CN 用于设置元素的 flex 样式
+ * @en_US Flex style for setting elements
+ */
 function XSetFlex(ele, renderer, justify, align, direction) {
     let result = [];
     if (!XIsEmpty(justify)) {
@@ -866,6 +1110,18 @@ function XSetFlex(ele, renderer, justify, align, direction) {
     return result;
 }
 
+/**
+ * @zh_CN 通过参数 n 来截取数组
+ * 如果 n 未定义或为 0，则返回与原数组相同的数组
+ * 如果原数组长度小于 1 或小于等于 n 的绝对值，则返回一个空数组
+ * 如果 n 大于 0，则截取从第 n 个元素开始到数组末尾的子数组
+ * 如果 n 小于等于 0，则截取从第 0 个元素到倒数第 n 个元素
+ * @en_US Send the array by parameter n
+ * If n is not defined or 0, returns the same array as the original array
+ * If the original array length is less than 1 or less than equal to N, return a empty array
+ * If n is greater than 0, cut off the sub-array starting from the nn element to the end of the array
+ * If n is less than or equal to 0, cut off from the 0th element to the countless nary element
+ */
 function XDrop(array, n) {
     if (!n)
         return [...array];
@@ -874,6 +1130,10 @@ function XDrop(array, n) {
     return array.slice(n > 0 ? n : 0, n > 0 ? array.length : n);
 }
 
+/**
+ * @zh_CN 从数组中移除满足条件的元素，并返回被移除的元素组成的数组
+ * @en_US Remove elements that meet the conditions from the array and return the array of the removal element
+ */
 function XRemove(array, predicate) {
     if (typeof predicate === 'undefined')
         return [];
@@ -889,6 +1149,10 @@ function XRemove(array, predicate) {
     return result;
 }
 
+/**
+ * @zh_CN 根据指定元素来排序
+ * @en_US Sort by specified elements
+ */
 function XOrderBy(collection, iteratees, orders) {
     if (!iteratees)
         return collection;
@@ -941,6 +1205,22 @@ function XOrderBy(collection, iteratees, orders) {
     return collection;
 }
 
+/**
+ * @zh_CN 该函数是一个深拷贝函数，用于克隆一个对象或数组
+ * 它会递归地复制对象的所有属性，包括嵌套对象和数组，生成一个全新的独立副本。
+ * 对于非对象和非数组类型的值，直接返回该值。
+ * 函数接受一个参数 value，表示需要进行深拷贝的值。
+ * 首先创建一个空的结果对象 result，如果 value 是数组，则 result 也是一个空数组。
+ * 遍历 value 的所有属性，如果属性是对象，则递归调用 XCloneDeep 函数进行深拷贝，并将结果赋值给 result 对应的属性。
+ * 最后返回 result，即深拷贝后的对象或数组。
+ * @en_US This function is a deep copy function that is used for a cloning object or array
+ * It will recover all the attributes of the object, including nested objects and array, and generate a new independent copy.
+ * For non object and non -array type values, return that value directly.
+ * The function accepts a parameter Value, indicating that the value of deep copy needs to be performed.
+ * First create a empty result object Result. If Value is an array, Result is also an empty array.
+ * It traverses all the attributes of Value. If the attribute is an object, the recursively calls the XCLONEDEEP function for deep copy, and assign the result to the corresponding attributes corresponding to Result.
+ * Finally return to Result, that is, the object or array after the deep copy.
+ */
 function XCloneDeep(value) {
     let result = Array.isArray(value) ? [] : {};
     if (value && typeof value === 'object') {
@@ -953,10 +1233,25 @@ function XCloneDeep(value) {
     return result;
 }
 
+/**
+ * @zh_CN 判断一个对象是否包含指定的属性
+ * @en_US Determine whether an object contains the specified attribute
+ */
 function XHasIn(object, key) {
     return object != null && key in Object(object);
 }
 
+/**
+ * @zh_CN 该函数用于将给定的数组拆分成多个小数组
+ * 每个小数组的长度由函数的第二个参数指定，默认为 1。
+ * 如果给定的数组为空或者小数组长度小于等于 0，则函数返回一个空数组。
+ * 函数通过循环遍历给定的数组，并使用 slice 方法将数组拆分成小数组，然后将小数组添加到结果数组中，最后返回结果数组。
+ * @en_US This function is used to split the given array into multiple decimal arrays
+ * The length of each decimal array is specified by the second parameter of the function, and the default is 1.
+ * If the given array is empty or the length of the decimal array is less than equal to 0, the function returns a empty array.
+ * The function traverses the given array by circulating, and uses the Slice method to split the array into a decimal array,
+ * then add the decimal array to the result array, and finally return the result array.
+ */
 function XChunk(array, size = 1) {
     const len = array == null ? 0 : array.length;
     if (!len || size < 1) {
@@ -972,7 +1267,8 @@ function XChunk(array, size = 1) {
 }
 
 /**
- * 生成 GUID
+ * @zh_CN 生成 GUID
+ * @en_US GUID
  */
 function XGuid() {
     let S4 = () => {
@@ -981,6 +1277,10 @@ function XGuid() {
     return S4() + S4() + '-' + S4() + '-' + S4() + '-' + S4() + '-' + S4() + S4() + S4();
 }
 
+/**
+ * @zh_CN 根据属性 name 来对数组分组
+ * @en_US Based on the array according to the attribute name
+ */
 function XGroupBy(array, name) {
     const groups = {};
     array.forEach((obj) => {
@@ -991,7 +1291,11 @@ function XGroupBy(array, name) {
     return Object.keys(groups).map((group) => groups[group]);
 }
 
-const XResize = (...element) => {
+/**
+ * @zh_CN 这个函数的功能是创建一个Observable，用于监听多个元素的尺寸变化
+ * @en_US The function of this function is to create an Observable to monitor the size changes of multiple elements.
+ */
+function XResize(...element) {
     return new Observable((x) => {
         if (typeof ResizeObserver !== 'function') {
             return;
@@ -1005,11 +1309,13 @@ const XResize = (...element) => {
             if (ele)
                 resizeObserver.observe(ele);
         }
-        //XResize 取消订阅的时候自动销毁
-        //resizeObserver.disconnect();
     });
-};
+}
 
+/**
+ * @zh_CN 获取元素的父节点路径
+ * @en_US The parent node of the element
+ */
 function XParentPath(ele) {
     let path = [];
     let nowEle = ele;
@@ -1019,6 +1325,10 @@ function XParentPath(ele) {
     }
     return path;
 }
+/**
+ * @zh_CN 获取元素的父元素路径
+ * @en_US The parent element path of obtaining elements
+ */
 function XParents(ele) {
     let res = [];
     let nowEle = ele;
@@ -1029,436 +1339,202 @@ function XParents(ele) {
     return res;
 }
 
-/**
- * 组件公共属性
- */
-class XProperty {
-    constructor() {
-        /**
-         * 样式映射属性
-         */
-        this.classMap = {};
-    }
-}
+const X_CONFIG = new InjectionToken('x-config');
 
-// @dynamic
-class XReuseStrategyService {
-    // 存储的复用路由
-    static { this.storages = []; }
-    /**
-     * 表示对所有路由允许复用 如果你有路由不想利用可以在这加一些业务逻辑判断
-     */
-    shouldDetach(_route) {
-        return true;
-    }
-    /**
-     * 当路由离开时会触发。按path作为key存储路由快照&组件当前实例对象
-     */
-    store(route, handle) {
-        if (handle == null)
-            return;
-        if (XReuseStrategyService.waitDelete && this.getRouteUrl(route).indexOf(XReuseStrategyService.waitDelete) == 0) {
-            //如果待删除是当前路由则不存储快照
-            XReuseStrategyService.waitDelete = null;
-            return;
-        }
-        this.add(this.getRouteUrl(route), handle);
-    }
-    /**
-     * 若 path 在缓存中有的都认为允许还原路由
-     */
-    shouldAttach(route) {
-        return !!XReuseStrategyService.storages.find((x) => x.id == this.getRouteUrl(route));
+const X_THEME = new InjectionToken('xTheme');
+const X_THEME_PREFIX = '--x-';
+const X_THEME_MERGE = '#ffffff';
+const X_THEME_BLACK_MERGE = '#cccccc';
+const X_THEME_AMOUNTS = [
+    0, -0.1, -0.2, -0.3, -0.4, -0.5, -0.6, -0.7, -0.8, -0.9, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9
+];
+const X_THEME_BACKGROUNDS = [-0.2, -0.3, -0.4];
+const X_THEME_TEXTS = [
+    [-0.5, 0],
+    [-0.6, 0.2],
+    [-0.7, 0.4]
+];
+const X_THEME_BORDERS = [
+    [-0.8, 0],
+    [-0.9, 0.2]
+];
+const X_THEME_EXCHANGES = [
+    [-0.1, -0.1],
+    [0.1, -0.1],
+    [0.2, 0.2],
+    [0.3, 0],
+    [0.4, -0.4],
+    [0.5, -0.2],
+    [0.6, 0],
+    [0.7, -0.4],
+    [0.8, -0.4],
+    [0.9, -0.2]
+];
+const X_THEME_LIGHT_COLORS = {
+    text: '#333333',
+    border: '#efefef',
+    background: '#ffffff'
+};
+const X_THEME_DARK_COLORS = {
+    text: '#dddddd',
+    border: '#252022',
+    background: '#0f0f11'
+};
+const X_THEME_COLORS = {
+    primary: '#3B82F6',
+    success: '#67c23a',
+    warning: '#e6a23c',
+    danger: '#f56c6c',
+    info: '#909399',
+    ...X_THEME_LIGHT_COLORS
+};
+const X_THEME_VARS = {
+    black: '#000000',
+    white: '#ffffff',
+    fontSize: '0.875rem',
+    fontSizeMini: '0.75rem',
+    fontSizeSmall: '0.875rem',
+    fontSizeMedium: '1rem',
+    fontSizeLarge: '1.25rem',
+    fontSizeBig: '1.5rem',
+    fontVariant: 'tabular-nums',
+    fontFamily: '-appleSystem, SF UI Text, Arial, PingFang SC, Hiragino Sans GB, Microsoft YaHei, WenQuanYi Micro Hei, sansSerif',
+    fontCodeFamily: 'SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace',
+    lineHeight: '1.75rem',
+    heightBig: '2.75rem',
+    heightLarge: '2.5rem',
+    heightMedium: '2.25rem',
+    heightSmall: '2rem',
+    heightMini: '1.75rem',
+    paddingBig: '1.5rem',
+    paddingLarge: '1.25rem',
+    paddingMedium: '1rem',
+    paddingSmall: '0.75rem',
+    paddingMini: '0.5rem',
+    borderStyle: 'solid',
+    borderRadius: '0.75rem',
+    borderSmallRadius: '0.5rem',
+    borderWidth: '0.0625rem',
+    borderDeepWidth: '0.125rem',
+    boxShadow: '0 0.0625rem 0.25rem 0.0625rem rgba(0, 0, 0, 0.15)',
+    boxShadowHover: '0 0.0625rem 0.25rem 0.0625rem rgba(0, 0, 0, 0.3)',
+    boxShadowTop: '0 -0.0625rem 0.25rem rgba(0, 0, 0, 0.15)',
+    boxShadowRight: '0.0625rem 0 0.25rem rgba(0, 0, 0, 0.15)',
+    boxShadowBottom: '0 0.0625rem 0.25rem rgba(0, 0, 0, 0.15)',
+    boxShadowLeft: '-0.0625rem 0 0.25rem rgba(0, 0, 0, 0.15)',
+    animationDurationSlow: '0.3s',
+    animationDurationBase: '0.2s',
+    animationDurationFast: '0.1s'
+};
+const X_THEME_COLOR_KEYS = Object.keys(X_THEME_COLORS);
+const X_THEME_VARS_KEYS = Object.keys(X_THEME_VARS);
+
+class XThemeService {
+    constructor(factory) {
+        this.factory = factory;
+        this.colorsProp = {};
+        this.varsProp = {};
+        this.doc = inject(DOCUMENT);
+        this.changed = new BehaviorSubject('light');
+        this.renderer2 = this.factory.createRenderer(null, null);
+        this.declaration = XComputed(this.doc.documentElement);
     }
-    /**
-     * 从缓存中获取快照，若无则返回nul
-     */
-    retrieve(route) {
-        if (!route.routeConfig) {
-            return {};
-        }
-        let stroage = XReuseStrategyService.storages.find((x) => x.id == this.getRouteUrl(route));
-        return stroage ? stroage.handle : {};
+    setInitialTheme(theme) {
+        this.setVars(theme?.vars);
+        if (theme?.vars)
+            Object.assign(X_THEME_VARS, theme.vars);
+        this.setColors(theme?.colors);
+        if (theme?.colors)
+            Object.assign(X_THEME_COLORS, theme.colors);
     }
-    /**
-     * 进入路由触发，判断是否同一路由
-     * 解决不同的参数也会认为是同一个路由，导致会将之前的路由拿出来复用
-     */
-    shouldReuseRoute(future, curr) {
-        return future.routeConfig === curr.routeConfig && JSON.stringify(future.params) == JSON.stringify(curr.params);
+    setTheme(theme) {
+        this.setColors(theme?.colors);
+        this.setVars(theme?.vars);
+        this.setDark(theme?.dark);
     }
-    /**
-     * 解决不同的主路由会存在相同名称的子路由
-     */
-    getRouteUrl(route) {
-        let url = route.url.map((x) => x.path).join('_');
-        return url;
+    getTheme(includesAll = false) {
+        return {
+            colors: this.getColors(includesAll),
+            vars: this.getVars()
+        };
     }
-    /**
-     * 删除复用的路由
-     */
-    static deleteRouteSnapshot(name) {
-        if (name) {
-            let id = name.replace(/\//g, '_');
-            XReuseStrategyService.storages.splice(XReuseStrategyService.storages.findIndex((x) => x.id.indexOf(id) === 0), 1);
-            XReuseStrategyService.waitDelete = id;
-        }
-        else {
-            XReuseStrategyService.storages = [];
+    setColors(colors) {
+        colors = this.getColorsTheme(colors);
+        for (let key in colors) {
+            Object.assign(this.colorsProp, this.setColorRoot(key, colors[key]));
         }
+        this.createColorsStyle();
     }
-    add(id, handle) {
-        XReuseStrategyService.storages.splice(XReuseStrategyService.storages.findIndex((x) => x.id == id), 1);
-        XReuseStrategyService.storages = [...XReuseStrategyService.storages, { id: id, handle: handle }];
-    }
-}
-
-// @dynamic
-class XPreloadingStrategyService {
-    constructor() {
-        // 需要预加载的模块
-        this.preloadedModules = [];
-    }
-    preload(route, load) {
-        if (route.data && route.data['preload']) {
-            this.preloadedModules.push(route.path);
-            return load();
+    setDark(dark) {
+        const colors = this.getColors();
+        if (dark === true) {
+            Object.assign(colors, X_THEME_DARK_COLORS);
+            this.setDarkColors(colors);
+            this.changed.next('dark');
         }
-        else {
-            return of(null);
+        else if (dark === false) {
+            Object.assign(colors, X_THEME_LIGHT_COLORS);
+            this.setColors(colors);
+            this.changed.next('light');
         }
+        return colors;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: XPreloadingStrategyService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: XPreloadingStrategyService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: XPreloadingStrategyService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }] });
-
-// @dynamic
-class XHttpService {
-    constructor(http) {
-        this.http = http;
-        this.api = '';
+    setDarkColors(colors) {
+        this.colorsProp = this.getDefineColors(colors, X_THEME_PREFIX, true);
+        this.createColorsStyle();
     }
-    /**
-     * get请求
-     */
-    get(url, params) {
-        return this.request('GET', url, params);
+    getColors(includes = false, prefix = X_THEME_PREFIX) {
+        let result = {};
+        const keys = includes ? Object.keys(this.colorsProp) : X_THEME_COLOR_KEYS.map((x) => `${prefix}${x}`);
+        keys.forEach((x) => {
+            result[x.replace(prefix, '')] = this.declaration.getPropertyValue(`${x}`).trim();
+        });
+        return result;
     }
-    /**
-     * get请求
-     */
-    post(url, params) {
-        return this.request('POST', url, params);
+    getVars(prefix = X_THEME_PREFIX) {
+        let result = {};
+        const keys = Object.keys(this.varsProp);
+        keys.forEach((x) => {
+            result[XKebabToCamel(x.replace(prefix, ''))] = this.declaration.getPropertyValue(`${x}`).trim();
+        });
+        return result;
     }
-    /**
-     * put请求
-     */
-    put(url, params) {
-        return this.request('PUT', url, params);
+    getColorsInProperty(colors, prefix = X_THEME_PREFIX) {
+        let result = {};
+        Object.keys(colors).forEach((x) => {
+            result[x] = this.declaration.getPropertyValue(`${prefix}${x}`).trim();
+        });
+        return result;
     }
-    /**
-     * delete请求
-     */
-    delete(url, params) {
-        return this.request('DELETE', url, params);
+    getColorsTheme(colors) {
+        if (typeof colors === 'undefined')
+            colors = X_THEME_COLORS;
+        else
+            colors = Object.assign({}, X_THEME_COLORS, colors);
+        return colors;
     }
-    /**
-     * request通用请求
-     */
-    request(method, url, params, option) {
-        if (!option)
-            option = {};
-        let opt = {};
-        url = `${this.api}${url}`;
-        method = method.toUpperCase();
-        if (['POST', 'PUT', 'DELETE'].indexOf(method) > -1) {
-            opt = { body: params, observe: 'body', responseType: 'json' };
+    setColorRoot(color, value, prefix = X_THEME_PREFIX) {
+        let result = {};
+        if (X_THEME_COLOR_KEYS.includes(color)) {
+            for (let amount of X_THEME_AMOUNTS) {
+                if (amount === 0) {
+                    result[`${prefix}${color}`] = value;
+                }
+                else {
+                    result[`${prefix}${color}${this.getSuffix(amount)}`] = XToHex(XMixColors(amount > 0 ? X_THEME_MERGE : X_THEME_BLACK_MERGE, value, Math.abs(amount)));
+                }
+            }
         }
-        else if (['GET'].indexOf(method) > -1) {
-            opt = { params: params };
+        else {
+            result[`${prefix}${color}`] = value;
         }
-        Object.assign(opt, option);
-        this.addHeader(opt);
-        return new Observable((x) => {
-            this.http.request(method, url, opt).subscribe((y) => {
-                x.next(y);
-                x.complete();
-            }, (y) => {
-                x.error(y);
-                x.complete();
-                this.handleError(y);
-            });
-        });
+        return result;
     }
-    /**
-     * 错误处理
-     */
-    handleError(error) {
-        if (error.error) {
-        }
-        return throwError(error.error);
-    }
-    /**
-     * 添加头部信息
-     */
-    addHeader(_option) {
-        // let auth = this.setting.getSession("Auth");
-        // if (auth && auth["token"]) {
-        //   option["headers"] = { Authorization: `Bearer ${auth["token"]}` };
-        // }
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: XHttpService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: XHttpService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: XHttpService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: i1.HttpClient }] });
-
-// @dynamic
-class XStorageService {
-    constructor(platform) {
-        this.platform = platform;
-    }
-    /**
-     * 获取本地值
-     */
-    getLocal(key) {
-        if (this.platform.isBrowser) {
-            let str = localStorage.getItem(key);
-            try {
-                return JSON.parse(localStorage.getItem(key) || 'null') || null;
-            }
-            catch (_e) {
-                return str;
-            }
-        }
-        else {
-            return null;
-        }
-    }
-    /**
-     * 设置本地值
-     */
-    setLocal(key, value) {
-        if (this.platform.isBrowser) {
-            if (XIsString(value)) {
-                localStorage.setItem(key, value);
-            }
-            else {
-                localStorage.setItem(key, JSON.stringify(value));
-            }
-        }
-    }
-    /**
-     * 获取当前会话的值
-     */
-    getSession(key) {
-        if (this.platform.isBrowser) {
-            let str = localStorage.getItem(key);
-            try {
-                return JSON.parse(sessionStorage.getItem(key) || 'null') || null;
-            }
-            catch (_e) {
-                return str;
-            }
-        }
-        else {
-            return null;
-        }
-    }
-    /**
-     * 设置当前会话值
-     */
-    setSession(key, value) {
-        if (this.platform.isBrowser) {
-            sessionStorage.setItem(key, JSON.stringify(value));
-        }
-    }
-    /**
-     * 移除本地值
-     */
-    removeLocal(key) {
-        if (this.platform.isBrowser) {
-            localStorage.removeItem(key);
-        }
-    }
-    /**
-     * 移除当前会话
-     */
-    removeSession(key) {
-        if (this.platform.isBrowser) {
-            sessionStorage.removeItem(key);
-        }
-    }
-    /**
-     * 生成guid
-     */
-    guid() {
-        let S4 = () => {
-            return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
-        };
-        return S4() + S4() + '-' + S4() + '-' + S4() + '-' + S4() + '-' + S4() + S4() + S4();
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: XStorageService, deps: [{ token: i1$1.Platform }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: XStorageService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: XStorageService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: i1$1.Platform }] });
-
-class XRepositoryAbstract {
-}
-class XRepositoryService extends XRepositoryAbstract {
-    constructor(http, input) {
-        super();
-        this.http = http;
-        this.input = input;
-        this.api = '';
-        this.api = typeof input.api !== 'undefined' ? input.api : '';
-    }
-    getList(index, size, query) {
-        index = index ? index : 1;
-        size = size ? size : 10;
-        return this.http.post(`${this.api}${this.input.controller.name}/${size}/${index}`, query);
-    }
-    get(id) {
-        return this.http.get(`${this.api}${this.input.controller.name}/${id}`);
-    }
-    post(entity) {
-        return this.http.post(`${this.api}${this.input.controller.name}`, entity);
-    }
-    put(entity) {
-        return this.http.put(`${this.api}${this.input.controller.name}`, entity);
-    }
-    delete(id) {
-        return this.http.delete(`${this.api}${this.input.controller.name}/${id}`);
-    }
-}
-
-const X_CONFIG = new InjectionToken('x-config');
-
-const X_THEME = new InjectionToken('x-theme');
-const X_THEME_PREFIX = '--x-';
-const X_THEME_MERGE = '#ffffff';
-const X_THEME_BLACK_MERGE = '#cccccc';
-const X_THEME_AMOUNTS = [0, -0.1, -0.2, -0.3, -0.4, -0.5, -0.6, -0.7, -0.8, -0.9, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9];
-const X_THEME_BACKGROUNDS = [-0.2, -0.3, -0.4];
-const X_THEME_TEXTS = [
-    [-0.5, 0],
-    [-0.6, 0.2],
-    [-0.7, 0.4]
-];
-const X_THEME_BORDERS = [
-    [-0.8, 0],
-    [-0.9, 0.2]
-];
-const X_THEME_EXCHANGES = [
-    [-0.1, -0.1],
-    [0.1, -0.1],
-    [0.2, 0.2],
-    [0.3, 0],
-    [0.4, -0.4],
-    [0.5, -0.2],
-    [0.6, 0],
-    [0.7, -0.4],
-    [0.8, -0.4],
-    [0.9, -0.2]
-];
-const X_THEME_COLORS = {
-    primary: '#1976d2',
-    success: '#67c23a',
-    warning: '#e6a23c',
-    danger: '#f56c6c',
-    info: '#909399',
-    text: '#333333',
-    border: '#dddddd',
-    background: '#ffffff'
-};
-const X_THEME_DARK_COLORS = {
-    text: '#dddddd',
-    border: '#424242',
-    background: '#1e1e1f'
-};
-const X_THEME_COLOR_KEYS = Object.keys(X_THEME_COLORS);
-
-class XThemeService {
-    constructor(factory) {
-        this.factory = factory;
-        this.colorsProp = {};
-        this.doc = inject(DOCUMENT);
-        this.renderer2 = this.factory.createRenderer(null, null);
-        this.declaration = XComputed(this.doc.documentElement);
-    }
-    setInitialTheme(theme) {
-        this.setColors(theme?.colors);
-        if (theme?.colors)
-            Object.assign(X_THEME_COLORS, theme.colors);
-    }
-    setTheme(theme) {
-        this.setColors(theme?.colors);
-    }
-    getTheme(includesAll = false) {
-        return {
-            colors: this.getColors(includesAll)
-        };
-    }
-    setColors(colors) {
-        colors = this.getColorsTheme(colors);
-        for (let key in colors) {
-            Object.assign(this.colorsProp, this.setRoot(key, colors[key]));
-        }
-        this.createColorsStyle();
-    }
-    getColors(includes = false, prefix = X_THEME_PREFIX) {
-        let result = {};
-        const keys = includes ? Object.keys(this.colorsProp) : X_THEME_COLOR_KEYS.map((x) => `${prefix}${x}`);
-        keys.forEach((x) => {
-            result[x.replace(prefix, '')] = this.declaration.getPropertyValue(`${x}`).trim();
-        });
-        return result;
-    }
-    getColorsInProperty(colors, prefix = X_THEME_PREFIX) {
-        let result = {};
-        Object.keys(colors).forEach((x) => {
-            result[x] = this.declaration.getPropertyValue(`${prefix}${x}`).trim();
-        });
-        return result;
-    }
-    getColorsTheme(colors) {
-        if (typeof colors === 'undefined')
-            colors = X_THEME_COLORS;
-        else
-            colors = Object.assign({}, X_THEME_COLORS, colors);
-        return colors;
-    }
-    setRoot(color, value, prefix = X_THEME_PREFIX) {
+    setDarkColorRoot(color, value, prefix = X_THEME_PREFIX) {
         let result = {};
+        let allColors = this.setColorRoot(color, value, '');
         if (X_THEME_COLOR_KEYS.includes(color)) {
-            for (let amount of X_THEME_AMOUNTS) {
-                if (amount === 0) {
-                    result[`${prefix}${color}`] = value;
-                }
-                else {
-                    result[`${prefix}${color}${this.getSuffix(amount)}`] = toHex(mixColors(amount > 0 ? X_THEME_MERGE : X_THEME_BLACK_MERGE, value, Math.abs(amount)));
-                }
-            }
-        }
-        else {
-            result[`${prefix}${color}`] = value;
-        }
-        return result;
-    }
-    setDarkRoot(color, value, prefix = X_THEME_PREFIX) {
-        let result = {};
-        const allColors = this.setRoot(color, value, '');
-        if (X_THEME_COLOR_KEYS.includes(color) && !['background'].includes(color)) {
-            const allColors = this.setRoot(color, value, prefix);
+            allColors = this.setColorRoot(color, value, prefix);
             X_THEME_EXCHANGES.forEach((x) => {
                 if (x[1] >= -0.1) {
                     const curr = this.getSuffix(x[0]);
@@ -1476,7 +1552,7 @@ class XThemeService {
         let result = {};
         colors = this.getColorsTheme(colors);
         for (let key in colors) {
-            Object.assign(result, this.setRoot(key, colors[key], prefix));
+            Object.assign(result, this.setColorRoot(key, colors[key], prefix));
         }
         if (darken) {
             const colorsFunc = (nums, callback) => {
@@ -1519,6 +1595,21 @@ class XThemeService {
         }
         return '';
     }
+    setVarRoot(va, value, prefix = X_THEME_PREFIX) {
+        let result = {};
+        result[`${prefix}${XCamelToKebab(va)}`] = value;
+        return result;
+    }
+    setVars(vars) {
+        if (typeof vars === 'undefined')
+            vars = X_THEME_VARS;
+        else
+            vars = Object.assign({}, X_THEME_VARS, vars);
+        for (let key in vars) {
+            Object.assign(this.varsProp, this.setVarRoot(key, vars[key]));
+        }
+        this.createVarsStyle();
+    }
     createColorsStyle() {
         if (this.colorsStyleEle)
             this.renderer2.removeChild(this.colorsStyleEle.parentNode, this.colorsStyleEle);
@@ -1530,18 +1621,32 @@ class XThemeService {
         this.renderer2.addClass(this.doc.documentElement, 'x-theme-colors');
         this.doc.documentElement.getElementsByTagName('head')[0].appendChild(this.colorsStyleEle);
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: XThemeService, deps: [{ token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: XThemeService, providedIn: 'root' }); }
+    createVarsStyle() {
+        if (this.varsStyleEle)
+            this.renderer2.removeChild(this.varsStyleEle.parentNode, this.varsStyleEle);
+        const styles = Object.entries(this.varsProp)
+            .map((x) => `${x[0]}: ${x[1]};`)
+            .join('');
+        this.varsStyleEle = this.renderer2.createElement('style');
+        this.varsStyleEle.innerHTML = `:root{${styles}}`;
+        this.doc.documentElement.getElementsByTagName('head')[0].appendChild(this.varsStyleEle);
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XThemeService, deps: [{ token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XThemeService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: XThemeService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XThemeService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
                 }]
         }], ctorParameters: () => [{ type: i0.RendererFactory2 }] });
-function mixColors(color1, color2, weight) {
-    let rgb1 = toRgb(color1);
-    let rgb2 = toRgb(color2);
+/**
+ * @zh_CN 根据权重混合2种颜色
+ * @en_US Mix 2 colors according to heavy weights
+ */
+function XMixColors(color1, color2, weight) {
+    let rgb1 = XToRgb(color1);
+    let rgb2 = XToRgb(color2);
     let weight1 = weight;
     let weight2 = 1 - weight;
     let result;
@@ -1555,10 +1660,18 @@ function mixColors(color1, color2, weight) {
     };
     return result;
 }
-function toHex(rgb) {
+/**
+ * @zh_CN RGB 颜色转换为 Hex
+ * @en_US RGB color converts to hex
+ */
+function XToHex(rgb) {
     return '#' + ((1 << 24) + (rgb.r << 16) + (rgb.g << 8) + rgb.b).toString(16).slice(1);
 }
-function toRgb(hex) {
+/**
+ * @zh_CN Hex 颜色转换为 RGB
+ * @en_US Hex color converts to RGB
+ */
+function XToRgb(hex) {
     if (hex.indexOf('#') == 0)
         hex = hex.slice(1);
     let num = parseInt(hex, 16);
@@ -1580,10 +1693,6 @@ function toRgb(hex) {
     return { r: r, g: g, b: b };
 }
 
-// tslint:disable no-any
-const isDefined = function (value) {
-    return value !== undefined;
-};
 class XConfigService {
     constructor() {
         this.componentConfigUpdated$ = new Subject();
@@ -1596,7 +1705,7 @@ class XConfigService {
         return this.config?.components ? this.config.components[componentName] : undefined;
     }
     getConfigChangeEventForComponent(componentName) {
-        return this.componentConfigUpdated$.pipe(filter((n) => n === componentName), mapTo(undefined));
+        return this.componentConfigUpdated$.pipe(filter((n) => n === componentName), map(() => undefined));
     }
     set(componentName, value) {
         if (this.config?.components) {
@@ -1607,21 +1716,11 @@ class XConfigService {
             this.componentConfigUpdated$.next(componentName);
         }
     }
-    setDarkTheme(theme) {
-        let colors = theme?.colors;
-        if (!colors)
-            colors = X_THEME_DARK_COLORS;
-        this.setTheme({
-            colors: this.themeService.getDefineColors(Object.assign({}, this.themeService.getColorsInProperty(X_THEME_COLORS), colors), '', true)
-        });
+    setDarkTheme() {
+        return this.themeService.setDark(true);
     }
-    setLightTheme(theme) {
-        let colors = theme?.colors;
-        if (!colors)
-            colors = X_THEME_COLORS;
-        this.setTheme({
-            colors: this.themeService.getDefineColors(Object.assign({}, this.themeService.getColorsInProperty(X_THEME_COLORS), colors), '', false)
-        });
+    setLightTheme() {
+        return this.themeService.setDark(false);
     }
     setTheme(theme) {
         this.themeService.setTheme(theme);
@@ -1632,53 +1731,275 @@ class XConfigService {
     getTheme(includesAll = false) {
         return this.themeService.getTheme(includesAll);
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: XConfigService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: XConfigService, providedIn: 'root' }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XConfigService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XConfigService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: XConfigService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XConfigService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
                 }]
         }], ctorParameters: () => [] });
-// tslint:disable-next-line:typedef
-function XWithConfig(componentName, innerDefaultValue) {
-    return function ConfigDecorator(target, propName, originalDescriptor) {
-        const privatePropName = `$$__assignedValue__${propName}`;
-        Object.defineProperty(target, privatePropName, {
-            configurable: true,
-            writable: true,
-            enumerable: false
+
+/**
+ * @zh_CN 组件公共属性
+ * @en_US Component of public properties
+ */
+class XProperty {
+}
+/**
+ * @zh_CN 组件公共属性，通过函数返回，注入全局配置
+ * @en_US Component of public properties, through the function returns, into the global configuration
+ */
+function XPropertyFunction(configName) {
+    return class XPropertyFun {
+        constructor() {
+            this.config = inject(XConfigService).getConfigForComponent(configName);
+        }
+    };
+}
+
+/**
+ * @zh_CN 转换 csspx 为像素宽度
+ * @en_US Convert CSS PX to pixel width
+ */
+function XToCssPx(csspx, fontSize) {
+    if (csspx === '0')
+        return 0;
+    if (XIsNumber(csspx))
+        return Number(csspx);
+    else if (csspx.endsWith('rem'))
+        return Number(csspx.replace(/rem/g, '')) * fontSize;
+    else if (csspx.endsWith('px'))
+        return Number(csspx.replace(/px/g, ''));
+    return 0;
+}
+
+class XReuseStrategyService {
+    static { this.storages = []; }
+    shouldDetach(_route) {
+        return true;
+    }
+    store(route, handle) {
+        if (handle == null)
+            return;
+        if (XReuseStrategyService.waitDelete && this.getRouteUrl(route).indexOf(XReuseStrategyService.waitDelete) == 0) {
+            XReuseStrategyService.waitDelete = null;
+            return;
+        }
+        this.add(this.getRouteUrl(route), handle);
+    }
+    shouldAttach(route) {
+        return !!XReuseStrategyService.storages.find((x) => x.id == this.getRouteUrl(route));
+    }
+    retrieve(route) {
+        if (!route.routeConfig) {
+            return {};
+        }
+        let stroage = XReuseStrategyService.storages.find((x) => x.id == this.getRouteUrl(route));
+        return stroage ? stroage.handle : {};
+    }
+    shouldReuseRoute(future, curr) {
+        return future.routeConfig === curr.routeConfig && JSON.stringify(future.params) == JSON.stringify(curr.params);
+    }
+    getRouteUrl(route) {
+        let url = route.url.map((x) => x.path).join('_');
+        return url;
+    }
+    static deleteRouteSnapshot(name) {
+        if (name) {
+            let id = name.replace(/\//g, '_');
+            XReuseStrategyService.storages.splice(XReuseStrategyService.storages.findIndex((x) => x.id.indexOf(id) === 0), 1);
+            XReuseStrategyService.waitDelete = id;
+        }
+        else {
+            XReuseStrategyService.storages = [];
+        }
+    }
+    add(id, handle) {
+        XReuseStrategyService.storages.splice(XReuseStrategyService.storages.findIndex((x) => x.id == id), 1);
+        XReuseStrategyService.storages = [...XReuseStrategyService.storages, { id: id, handle: handle }];
+    }
+}
+
+class XPreloadingStrategyService {
+    constructor() {
+        this.preloadedModules = [];
+    }
+    preload(route, load) {
+        if (route.data && route.data['preload']) {
+            this.preloadedModules.push(route.path);
+            return load();
+        }
+        else {
+            return of(null);
+        }
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XPreloadingStrategyService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XPreloadingStrategyService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XPreloadingStrategyService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+class XHttpService {
+    constructor(http) {
+        this.http = http;
+        this.api = '';
+    }
+    get(url, params) {
+        return this.request('GET', url, params);
+    }
+    post(url, params) {
+        return this.request('POST', url, params);
+    }
+    put(url, params) {
+        return this.request('PUT', url, params);
+    }
+    delete(url, params) {
+        return this.request('DELETE', url, params);
+    }
+    request(method, url, params, option) {
+        if (!option)
+            option = {};
+        let opt = {};
+        url = `${this.api}${url}`;
+        method = method.toUpperCase();
+        if (['POST', 'PUT', 'DELETE'].indexOf(method) > -1) {
+            opt = { body: params, observe: 'body', responseType: 'json' };
+        }
+        else if (['GET'].indexOf(method) > -1) {
+            opt = { params: params };
+        }
+        Object.assign(opt, option);
+        return new Observable((x) => {
+            this.http.request(method, url, opt).subscribe((y) => {
+                x.next(y);
+                x.complete();
+            }, (y) => {
+                x.error(y);
+                x.complete();
+                this.handleError(y);
+            });
         });
-        return {
-            get() {
-                const originalValue = originalDescriptor && originalDescriptor.get
-                    ? originalDescriptor.get.bind(this)()
-                    : this[privatePropName];
-                if (isDefined(originalValue)) {
-                    return originalValue;
-                }
-                const componentConfig = this.configService?.getConfigForComponent(componentName) || {};
-                const configValue = componentConfig[propName];
-                return isDefined(configValue) ? configValue : innerDefaultValue;
-            },
-            set(value) {
-                if (originalDescriptor && originalDescriptor.set) {
-                    originalDescriptor.set.bind(this)(value);
-                }
-                else {
-                    this[privatePropName] = value;
-                }
-            },
-            configurable: true,
-            enumerable: true
+    }
+    handleError(error) {
+        if (error.error) {
+        }
+        return throwError(error.error);
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XHttpService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XHttpService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XHttpService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], ctorParameters: () => [{ type: i1.HttpClient }] });
+
+class XStorageService {
+    constructor(platform) {
+        this.platform = platform;
+    }
+    getLocal(key) {
+        if (this.platform.isBrowser) {
+            let str = localStorage.getItem(key);
+            try {
+                return JSON.parse(localStorage.getItem(key) || 'null') || null;
+            }
+            catch (_e) {
+                return str;
+            }
+        }
+        else {
+            return null;
+        }
+    }
+    setLocal(key, value) {
+        if (this.platform.isBrowser) {
+            if (XIsString(value)) {
+                localStorage.setItem(key, value);
+            }
+            else {
+                localStorage.setItem(key, JSON.stringify(value));
+            }
+        }
+    }
+    getSession(key) {
+        if (this.platform.isBrowser) {
+            let str = localStorage.getItem(key);
+            try {
+                return JSON.parse(sessionStorage.getItem(key) || 'null') || null;
+            }
+            catch (_e) {
+                return str;
+            }
+        }
+        else {
+            return null;
+        }
+    }
+    setSession(key, value) {
+        if (this.platform.isBrowser) {
+            sessionStorage.setItem(key, JSON.stringify(value));
+        }
+    }
+    removeLocal(key) {
+        if (this.platform.isBrowser) {
+            localStorage.removeItem(key);
+        }
+    }
+    removeSession(key) {
+        if (this.platform.isBrowser) {
+            sessionStorage.removeItem(key);
+        }
+    }
+    guid() {
+        let S4 = () => {
+            return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
         };
-    };
+        return S4() + S4() + '-' + S4() + '-' + S4() + '-' + S4() + '-' + S4() + S4() + S4();
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XStorageService, deps: [{ token: i1$1.Platform }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XStorageService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XStorageService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], ctorParameters: () => [{ type: i1$1.Platform }] });
+
+class XRepositoryAbstract {
+}
+class XRepositoryService extends XRepositoryAbstract {
+    constructor(http, input) {
+        super();
+        this.http = http;
+        this.input = input;
+        this.api = '';
+        this.api = typeof input.api !== 'undefined' ? input.api : '';
+    }
+    getList(index, size, query) {
+        index = index ? index : 1;
+        size = size ? size : 10;
+        return this.http.post(`${this.api}${this.input.controller.name}/${size}/${index}`, query);
+    }
+    get(id) {
+        return this.http.get(`${this.api}${this.input.controller.name}/${id}`);
+    }
+    post(entity) {
+        return this.http.post(`${this.api}${this.input.controller.name}`, entity);
+    }
+    put(entity) {
+        return this.http.put(`${this.api}${this.input.controller.name}`, entity);
+    }
+    delete(id) {
+        return this.http.delete(`${this.api}${this.input.controller.name}/${id}`);
+    }
 }
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { XAddDays, XAddHours, XAddMilliseconds, XAddMinutes, XAddMonths, XAddSeconds, XAddYears, XBadgeAnimation, XBadgeStandaloneAnimation, XBaseAnimation, XChunk, XClamp, XClearClass, XCloneDeep, XComputed, XComputedStyle, XConfigService, XConnectAnimation, XConnectBaseAnimation, XDataConvert, XDateQuarter, XDateWeek, XDateWeekYear, XDateYearQuarter, XDateYearWeek, XDrop, XDropAnimation, XDuration, XFadeAnimation, XGetChildren, XGroupBy, XGuid, XHasIn, XHttpService, XIdentity, XInputBoolean, XInputNumber, XInvertKeyValues, XIsArray, XIsBoolean, XIsChange, XIsDate, XIsEmpty, XIsFunction, XIsNull, XIsNumber, XIsObject, XIsObjectArray, XIsObservable, XIsRegExp, XIsString, XIsTemplateRef, XIsType, XIsUndefined, XIsValue, XIsValueArray, XIsXTemplate, XMoveAnimation, XMoveBoxAnimation, XOpacityAnimation, XOrderBy, XParentPath, XParents, XPreloadingStrategyService, XProperty, XRemove, XRepositoryAbstract, XRepositoryService, XResize, XReuseStrategyService, XSetData, XSetFlex, XSlideAnimation, XSliderAnimation, XStorageService, XThemeService, XToBoolean, XToDataConvert, XToDate, XWithConfig, X_CONFIG, X_THEME, X_THEME_AMOUNTS, X_THEME_BACKGROUNDS, X_THEME_BLACK_MERGE, X_THEME_BORDERS, X_THEME_COLORS, X_THEME_COLOR_KEYS, X_THEME_DARK_COLORS, X_THEME_EXCHANGES, X_THEME_MERGE, X_THEME_PREFIX, X_THEME_TEXTS, fillDefault, isNil, isNotNil, mixColors, removeNgTag, reqAnimFrame, stripTags, toHex, toRgb, warnIconTypeNotFound, warnSVGTagNotFound };
+export { XAddDays, XAddHours, XAddMilliseconds, XAddMinutes, XAddMonths, XAddSeconds, XAddYears, XBadgeAnimation, XBadgeStandaloneAnimation, XBaseAnimation, XCamelToKebab, XChunk, XClamp, XClearClass, XClearClassSignal, XCloneDeep, XComputed, XComputedStyle, XConfigService, XConnectBaseAnimation, XDataConvert, XDateQuarter, XDateWeek, XDateWeekYear, XDateYearQuarter, XDateYearWeek, XDrop, XDropAnimation, XDuration, XFadeAnimation, XFillDefault, XGetChildren, XGroupBy, XGuid, XHasIn, XHttpService, XIdentity, XInputBoolean, XInputCssPixelValue, XInputNumber, XInvertKeyValues, XIsArray, XIsBoolean, XIsChange, XIsDate, XIsEmpty, XIsFunction, XIsInputSignal, XIsNil, XIsNotNil, XIsNull, XIsNumber, XIsObject, XIsObjectArray, XIsObservable, XIsRegExp, XIsString, XIsTemplateRef, XIsType, XIsUndefined, XIsValue, XIsValueArray, XIsXTemplate, XKebabToCamel, XMixColors, XMoveAnimation, XMoveBoxAnimation, XOpacityAnimation, XOrderBy, XParentPath, XParents, XPreloadingStrategyService, XProperty, XPropertyFunction, XRemove, XRemoveNgTag, XRepositoryAbstract, XRepositoryService, XRequestAnimationFrame, XResize, XReuseStrategyService, XSetData, XSetFlex, XSlideAnimation, XStorageService, XStripTags, XThemeService, XToBoolean, XToCssPixelValue, XToCssPx, XToDataArray, XToDataConvert, XToDate, XToHex, XToNumber, XToRgb, XToString, XWarnIconTypeNotFound, XWarnSVGTagNotFound, X_CONFIG, X_THEME, X_THEME_AMOUNTS, X_THEME_BACKGROUNDS, X_THEME_BLACK_MERGE, X_THEME_BORDERS, X_THEME_COLORS, X_THEME_COLOR_KEYS, X_THEME_DARK_COLORS, X_THEME_EXCHANGES, X_THEME_LIGHT_COLORS, X_THEME_MERGE, X_THEME_PREFIX, X_THEME_TEXTS, X_THEME_VARS, X_THEME_VARS_KEYS };
 //# sourceMappingURL=ng-nest-ui-core.mjs.map