@xlabs-store/core 0.0.1 → 0.0.3

package/dist/cjs/x-color-picker_9.cjs.entry.js

@@ -1,3085 +0,0 @@
-'use strict';
-
-var index = require('./index-C7sKs9A2.js');
-var portalController = require('./portal-controller-CtYVbhXL.js');
-var config = require('./config-BP9bROYD.js');
-var types = require('./types-DQ-V76ZQ.js');
-var abstractControl = require('./abstract-control-C4D0eNCC.js');
-var locale_service = require('./locale.service-Cz-aZQnr.js');
-
-const xColorPickerCss = () => `:root{--x-color-primary:#1677ff;--x-color-primary-rgb:22, 119, 255;--x-color-primary-contrast:#ffffff;--x-color-primary-contrast-rgb:255, 255, 255;--x-color-primary-shade:#0958d9;--x-color-primary-tint:#4096ff;--x-color-primary-bg:#e6f4ff;--x-color-primary-bg-hover:#bae0ff;--x-color-primary-border:#91caff;--x-color-primary-border-hover:#69b1ff;--x-color-primary-hover:#4096ff;--x-color-primary-active:#0958d9;--x-color-primary-text:#1677ff;--x-color-primary-text-hover:#4096ff;--x-color-primary-text-active:#0958d9;--x-color-secondary:#3dc2ff;--x-color-secondary-rgb:61, 194, 255;--x-color-secondary-contrast:#ffffff;--x-color-secondary-contrast-rgb:255, 255, 255;--x-color-secondary-shade:#36abe0;--x-color-secondary-tint:#50c8ff;--x-color-success:#52c41a;--x-color-success-rgb:82, 196, 26;--x-color-success-contrast:#ffffff;--x-color-success-contrast-rgb:255, 255, 255;--x-color-success-shade:#389e0d;--x-color-success-tint:#73d13d;--x-color-success-bg:#f6ffed;--x-color-success-bg-hover:#d9f7be;--x-color-success-border:#b7eb8f;--x-color-success-border-hover:#95de64;--x-color-success-hover:#73d13d;--x-color-success-active:#389e0d;--x-color-success-text:#52c41a;--x-color-success-text-hover:#73d13d;--x-color-success-text-active:#389e0d;--x-color-warning:#faad14;--x-color-warning-rgb:250, 173, 20;--x-color-warning-contrast:#000000;--x-color-warning-contrast-rgb:0, 0, 0;--x-color-warning-shade:#d48806;--x-color-warning-tint:#ffc53d;--x-color-warning-bg:#fffbe6;--x-color-warning-bg-hover:#fff1b8;--x-color-warning-border:#ffe58f;--x-color-warning-border-hover:#ffd666;--x-color-warning-hover:#ffc53d;--x-color-warning-active:#d48806;--x-color-warning-text:#faad14;--x-color-warning-text-hover:#ffc53d;--x-color-warning-text-active:#d48806;--x-color-danger:#ff4d4f;--x-color-danger-rgb:255, 77, 79;--x-color-danger-contrast:#ffffff;--x-color-danger-contrast-rgb:255, 255, 255;--x-color-danger-shade:#cf1322;--x-color-danger-tint:#ff7875;--x-color-error:#ff4d4f;--x-color-error-rgb:255, 77, 79;--x-color-error-bg:#fff2f0;--x-color-error-bg-hover:#ffccc7;--x-color-error-border:#ffa39e;--x-color-error-border-hover:#ff7875;--x-color-error-hover:#ff7875;--x-color-error-active:#d9363e;--x-color-error-text:#ff4d4f;--x-color-error-text-hover:#ff7875;--x-color-error-text-active:#d9363e;--x-color-info:#1677ff;--x-color-info-rgb:22, 119, 255;--x-color-info-bg:#e6f4ff;--x-color-info-bg-hover:#bae0ff;--x-color-info-border:#91caff;--x-color-info-border-hover:#69b1ff;--x-color-info-hover:#69b1ff;--x-color-info-active:#0958d9;--x-color-info-text:#1677ff;--x-color-info-text-hover:#69b1ff;--x-color-info-text-active:#0958d9;--x-color-text:rgba(0, 0, 0, 0.88);--x-color-text-secondary:rgba(0, 0, 0, 0.65);--x-color-text-tertiary:rgba(0, 0, 0, 0.45);--x-color-text-quaternary:rgba(0, 0, 0, 0.25);--x-color-text-disabled:rgba(0, 0, 0, 0.25);--x-color-text-placeholder:rgba(0, 0, 0, 0.25);--x-color-text-heading:rgba(0, 0, 0, 0.88);--x-color-text-label:rgba(0, 0, 0, 0.65);--x-color-text-description:rgba(0, 0, 0, 0.45);--x-color-text-light-solid:#ffffff;--x-color-bg-container:#ffffff;--x-color-bg-elevated:#ffffff;--x-color-bg-layout:#f5f5f5;--x-color-bg-spotlight:rgba(0, 0, 0, 0.85);--x-color-bg-mask:rgba(0, 0, 0, 0.45);--x-color-bg-base:#ffffff;--x-color-bg-container-disabled:#f5f5f5;--x-color-bg-container-loading:rgba(255, 255, 255, 0.65);--x-color-white:#ffffff;--x-color-fill:rgba(0, 0, 0, 0.15);--x-color-fill-secondary:rgba(0, 0, 0, 0.06);--x-color-fill-tertiary:rgba(0, 0, 0, 0.04);--x-color-fill-quaternary:rgba(0, 0, 0, 0.02);--x-color-border:#d9d9d9;--x-color-border-secondary:#f0f0f0;--x-color-border-bg:#ffffff;--x-color-split:rgba(5, 5, 5, 0.06);--x-color-dark:#222428;--x-color-dark-rgb:34, 36, 40;--x-color-dark-contrast:#ffffff;--x-color-dark-contrast-rgb:255, 255, 255;--x-color-dark-shade:#1e2023;--x-color-dark-tint:#383a3e;--x-color-medium:#92949c;--x-color-medium-rgb:146, 148, 156;--x-color-medium-contrast:#ffffff;--x-color-medium-contrast-rgb:255, 255, 255;--x-color-medium-shade:#808289;--x-color-medium-tint:#9d9fa6;--x-color-light:#f4f5f8;--x-color-light-rgb:244, 245, 248;--x-color-light-contrast:#000000;--x-color-light-contrast-rgb:0, 0, 0;--x-color-light-shade:#d7d8da;--x-color-light-tint:#f5f6f9;--x-font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--x-font-family-code:"SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;--x-font-size:14px;--x-font-size-sm:12px;--x-font-size-lg:16px;--x-font-size-xl:20px;--x-font-size-heading-1:38px;--x-font-size-heading-2:30px;--x-font-size-heading-3:24px;--x-font-size-heading-4:20px;--x-font-size-heading-5:16px;--x-line-height:1.5714285714285714;--x-line-height-lg:1.5;--x-line-height-sm:1.6666666666666667;--x-line-height-heading-1:1.2105263157894737;--x-line-height-heading-2:1.2666666666666666;--x-line-height-heading-3:1.3333333333333333;--x-line-height-heading-4:1.4;--x-line-height-heading-5:1.5;--x-font-weight-normal:400;--x-font-weight-medium:500;--x-font-weight-semibold:600;--x-font-weight-strong:600;--x-font-size-base:14px;--x-font-size-xxl:24px;--x-line-height-base:1.5714285714285714;--x-spacing-xxs:4px;--x-spacing-xs:8px;--x-spacing-sm:12px;--x-spacing-md:16px;--x-spacing-lg:20px;--x-spacing-xl:24px;--x-spacing-xxl:32px;--x-spacing-xxxl:48px;--x-margin-xxs:4px;--x-margin-xs:8px;--x-margin-sm:12px;--x-margin-md:16px;--x-margin-lg:24px;--x-margin-xl:32px;--x-margin-xxl:48px;--x-padding-xxs:4px;--x-padding-xs:8px;--x-padding-sm:12px;--x-padding-md:16px;--x-padding-lg:24px;--x-padding-content-horizontal-lg:24px;--x-padding-content-vertical-lg:12px;--x-padding-content-horizontal:16px;--x-padding-content-vertical:12px;--x-padding-content-horizontal-sm:16px;--x-padding-content-vertical-sm:8px;--x-border-radius:6px;--x-border-radius-xs:2px;--x-border-radius-sm:4px;--x-border-radius-lg:8px;--x-border-radius-xl:12px;--x-border-radius-outer:4px;--x-border-radius-base:6px;--x-border-width:1px;--x-border-width-base:1px;--x-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-shadow-lg:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-box-shadow-popover-arrow:2px 2px 5px rgba(0, 0, 0, 0.05);--x-box-shadow-card:0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);--x-box-shadow-drawer-right:-6px 0 16px 0 rgba(0, 0, 0, 0.08), -3px 0 6px -4px rgba(0, 0, 0, 0.12), -9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-left:6px 0 16px 0 rgba(0, 0, 0, 0.08), 3px 0 6px -4px rgba(0, 0, 0, 0.12), 9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-up:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-down:0 -6px 16px 0 rgba(0, 0, 0, 0.08), 0 -3px 6px -4px rgba(0, 0, 0, 0.12), 0 -9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tabs-overflow-left:inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-right:inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-top:inset 0 10px 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-bottom:inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08);--x-motion-duration-fast:0.1s;--x-motion-duration-mid:0.2s;--x-motion-duration-slow:0.3s;--x-motion-ease-in-out:cubic-bezier(0.645, 0.045, 0.355, 1);--x-motion-ease-out:cubic-bezier(0.215, 0.61, 0.355, 1);--x-motion-ease-in:cubic-bezier(0.55, 0.055, 0.675, 0.19);--x-motion-ease-out-back:cubic-bezier(0.12, 0.4, 0.29, 1.46);--x-motion-ease-in-back:cubic-bezier(0.71, -0.46, 0.88, 0.6);--x-motion-ease-in-out-circle:cubic-bezier(0.78, 0.14, 0.15, 0.86);--x-motion-ease-out-circle:cubic-bezier(0.08, 0.82, 0.17, 1);--x-motion-ease-in-circle:cubic-bezier(0.6, 0.04, 0.98, 0.34);--x-motion-ease-in-quint:cubic-bezier(0.755, 0.05, 0.855, 0.06);--x-motion-ease-out-quint:cubic-bezier(0.23, 1, 0.32, 1);--x-z-index-base:0;--x-z-index-popup-base:1000;--x-z-index-popup:1030;--x-z-index-affix:10;--x-z-index-modal:1000;--x-z-index-modal-mask:1000;--x-z-index-drawer:1000;--x-z-index-popover:1030;--x-z-index-dropdown:1050;--x-z-index-tooltip:1070;--x-z-index-notification:1080;--x-z-index-message:1090;--x-z-index-popconfirm:1060;--x-z-index-table-fixed:10;--x-opacity-loading:0.65;--x-opacity-image:1;--x-opacity-disabled:0.5;--x-control-height:32px;--x-control-height-xs:24px;--x-control-height-sm:24px;--x-control-height-lg:40px;--x-control-radio-size:16px;--x-control-checkbox-size:16px;--x-control-padding-horizontal:12px;--x-control-padding-horizontal-sm:8px;--x-control-outline-width:2px;--x-control-outline:rgba(5, 145, 255, 0.1);--x-control-item-bg-hover:rgba(0, 0, 0, 0.04);--x-control-item-bg-active:#e6f4ff;--x-control-item-bg-active-hover:#bae0ff;--x-control-item-bg-active-disabled:rgba(0, 0, 0, 0.15);--x-control-tmp-outline:rgba(0, 0, 0, 0.02);--x-color-yellow:#fadb14;--x-color-yellow-rgb:250, 219, 20;--x-font-family-base:var(--x-font-family);--x-color-link:#1677ff;--x-color-link-hover:#69b1ff;--x-color-link-active:#0958d9;--x-color-icon:rgba(0, 0, 0, 0.45);--x-color-icon-hover:rgba(0, 0, 0, 0.88);--x-color-highlight:#ff4d4f;--x-color-bg-text-hover:rgba(0, 0, 0, 0.06);--x-color-bg-text-active:rgba(0, 0, 0, 0.15);--x-screen-xs:480px;--x-screen-xs-min:480px;--x-screen-xs-max:575px;--x-screen-sm:576px;--x-screen-sm-min:576px;--x-screen-sm-max:767px;--x-screen-md:768px;--x-screen-md-min:768px;--x-screen-md-max:991px;--x-screen-lg:992px;--x-screen-lg-min:992px;--x-screen-lg-max:1199px;--x-screen-xl:1200px;--x-screen-xl-min:1200px;--x-screen-xl-max:1599px;--x-screen-xxl:1600px;--x-screen-xxl-min:1600px;--x-color-fill-content:rgba(0, 0, 0, 0.06);--x-color-fill-content-hover:rgba(0, 0, 0, 0.15);--x-color-fill-alter:rgba(0, 0, 0, 0.02);--x-scrollbar-width:12px;--x-scrollbar-track-bg:rgba(0, 0, 0, 0.04);--x-scrollbar-thumb-bg:rgba(0, 0, 0, 0.25);--x-scrollbar-thumb-bg-hover:rgba(0, 0, 0, 0.35);--x-menu-dark-bg:#001529;--x-menu-dark-item-bg:#001529;--x-menu-dark-popup-bg:#001529;--x-menu-dark-submenu-item-bg:#000c17}:host{display:inline-block;font-size:14px;line-height:1.5715}:host(.x-color-picker-disabled){cursor:not-allowed}.x-color-picker-trigger{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:44px;height:32px;padding:4px 8px;background-color:#fff;border:1px solid #d9d9d9;border-radius:6px;cursor:pointer;-webkit-transition:all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);transition:all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);gap:8px}.x-color-picker-trigger:hover{border-color:#4096ff}.x-color-picker-trigger:focus-visible{border-color:#1677ff;outline:none;-webkit-box-shadow:0 0 0 2px rgba(22, 119, 255, 0.1);box-shadow:0 0 0 2px rgba(22, 119, 255, 0.1)}:host(.x-color-picker-sm) .x-color-picker-trigger{height:24px;padding:0 4px;font-size:12px;border-radius:4px}:host(.x-color-picker-sm) .x-color-picker-color-block{width:16px;height:16px}:host(.x-color-picker-lg) .x-color-picker-trigger{height:40px;padding:4px 12px}:host(.x-color-picker-lg) .x-color-picker-color-block{width:28px;height:28px}:host(.x-color-picker-disabled) .x-color-picker-trigger{background-color:#f5f5f5;border-color:#d9d9d9;cursor:not-allowed}:host(.x-color-picker-disabled) .x-color-picker-trigger:hover{border-color:#d9d9d9}:host(.x-color-picker-disabled) .x-color-picker-text{color:rgba(0, 0, 0, 0.25)}.x-color-picker-color-block{position:relative;width:24px;height:24px;border-radius:4px;overflow:hidden;-webkit-box-shadow:inset 0 0 1px 0 rgba(0, 0, 0, 0.25);box-shadow:inset 0 0 1px 0 rgba(0, 0, 0, 0.25)}.x-color-picker-color-block::before{content:"";position:absolute;inset:0;background-image:conic-gradient(rgba(0, 0, 0, 0.06) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.06) 50%, rgba(0, 0, 0, 0.06) 75%, transparent 75%);background-size:8px 8px;z-index:0}.x-color-picker-color-block-inner{position:relative;width:100%;height:100%;border-radius:inherit;z-index:1}.x-color-picker-color-block-cleared .x-color-picker-color-block-inner::after{content:"";position:absolute;top:50%;left:-2px;right:-2px;height:2px;background:#ff4d4f;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.x-color-picker-text{color:rgba(0, 0, 0, 0.88);font-size:inherit;white-space:nowrap}.x-color-picker-arrow{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;color:rgba(0, 0, 0, 0.45);font-size:12px;-webkit-transition:-webkit-transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);transition:-webkit-transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);transition:transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);transition:transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1)}.x-color-picker-arrow.x-color-picker-arrow-open{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.x-color-picker-clear{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:16px;height:16px;color:rgba(0, 0, 0, 0.45);font-size:12px;cursor:pointer;-webkit-transition:color 0.2s;transition:color 0.2s}.x-color-picker-clear:hover{color:rgba(0, 0, 0, 0.88)}`;
-
-const XColorPicker = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.xChange = index.createEvent(this, "xChange", 7);
-        this.xChangeComplete = index.createEvent(this, "xChangeComplete", 7);
-        this.xFormatChange = index.createEvent(this, "xFormatChange", 7);
-        this.xOpenChange = index.createEvent(this, "xOpenChange", 7);
-        this.xClear = index.createEvent(this, "xClear", 7);
-    }
-    get el() { return index.getElement(this); }
-    // ==================== Props ====================
-    /**
-     * Allow clearing color selected
-     * @default false
-     * @example
-     * <x-color-picker allowClear></x-color-picker>
-     */
-    allowClear = false;
-    /**
-     * Default value of color
-     * @example
-     * <x-color-picker defaultValue="#ff4d4f"></x-color-picker>
-     */
-    defaultValue;
-    /**
-     * Default format of color
-     * @default 'hex'
-     * @example
-     * <x-color-picker defaultFormat="rgb"></x-color-picker>
-     */
-    defaultFormat = 'hex';
-    /**
-     * Disable ColorPicker
-     * @default false
-     * @example
-     * <x-color-picker disabled></x-color-picker>
-     */
-    disabled = false;
-    /**
-     * Disable Alpha slider
-     * @default false
-     * @example
-     * <x-color-picker disabledAlpha></x-color-picker>
-     */
-    disabledAlpha = false;
-    /**
-     * Disable format selector
-     * @default false
-     * @example
-     * <x-color-picker disabledFormat></x-color-picker>
-     */
-    disabledFormat = false;
-    /**
-     * Format of color
-     * @example
-     * <x-color-picker format="hsb"></x-color-picker>
-     */
-    format;
-    /**
-     * Whether to show popup
-     * @example
-     * <x-color-picker open></x-color-picker>
-     */
-    open;
-    /**
-     * Preset colors
-     * @example
-     * <x-color-picker presets={[{ label: 'Primary', colors: ['#1677ff'] }]}></x-color-picker>
-     */
-    presets;
-    /**
-     * Placement of popup
-     * @default 'bottomLeft'
-     * @example
-     * <x-color-picker placement="topLeft"></x-color-picker>
-     */
-    placement = 'bottomLeft';
-    /**
-     * Show color text
-     * @default false
-     * @example
-     * <x-color-picker showText></x-color-picker>
-     */
-    showText = false;
-    /**
-     * Size of trigger
-     * @default 'middle'
-     * @example
-     * <x-color-picker size="small"></x-color-picker>
-     */
-    size = 'middle';
-    /**
-     * Trigger mode
-     * @default 'click'
-     * @example
-     * <x-color-picker trigger="hover"></x-color-picker>
-     */
-    trigger = 'click';
-    /**
-     * Value of color
-     * @example
-     * <x-color-picker value="#1677ff"></x-color-picker>
-     */
-    value;
-    /**
-     * Custom class names
-     * @example
-     * <x-color-picker classNames={{ root: 'my-color-picker' }}></x-color-picker>
-     */
-    classNames;
-    /**
-     * Custom styles
-     * @example
-     * <x-color-picker styles={{ root: { minWidth: '120px' } }}></x-color-picker>
-     */
-    styles;
-    // ==================== Events ====================
-    /**
-     * Callback when value is changed
-     * @example
-     * <x-color-picker onXChange={(ev) => console.log(ev.detail)}></x-color-picker>
-     */
-    xChange;
-    /**
-     * Called when color pick ends
-     * @example
-     * <x-color-picker onXChangeComplete={(ev) => console.log(ev.detail)}></x-color-picker>
-     */
-    xChangeComplete;
-    /**
-     * Callback when format is changed
-     * @example
-     * <x-color-picker onXFormatChange={(ev) => console.log(ev.detail)}></x-color-picker>
-     */
-    xFormatChange;
-    /**
-     * Callback when open is changed
-     * @example
-     * <x-color-picker onXOpenChange={(ev) => console.log(ev.detail)}></x-color-picker>
-     */
-    xOpenChange;
-    /**
-     * Called when clear
-     * @example
-     * <x-color-picker onXClear={() => {}}></x-color-picker>
-     */
-    xClear;
-    // ==================== State ====================
-    /**
-     * Internal open state for uncontrolled mode.
-     */
-    internalOpen = false;
-    /**
-     * Internal color format.
-     */
-    internalFormat = 'hex';
-    /**
-     * Internal color object.
-     */
-    internalColor = null;
-    /**
-     * Cleared state flag.
-     */
-    isCleared = false;
-    // ==================== Private Properties ====================
-    /**
-     * Trigger element reference.
-     */
-    triggerRef;
-    /**
-     * Portal instance for panel.
-     */
-    portalInstance = null;
-    /**
-     * Panel element reference.
-     */
-    panelElement = null;
-    /**
-     * Dragging flag for hover behavior.
-     */
-    isDragging = false;
-    // ==================== Lifecycle ====================
-    /**
-     * Initialize format and color.
-     * @returns void
-     */
-    componentWillLoad() {
-        // Initialize format
-        this.internalFormat = this.format ?? this.defaultFormat;
-        // Initialize color
-        const initialValue = this.value ?? this.defaultValue ?? '#1677ff';
-        if (typeof initialValue === 'string') {
-            this.internalColor = types.createColor(initialValue);
-        }
-    }
-    /**
-     * Cleanup portal on disconnect.
-     * @returns void
-     */
-    disconnectedCallback() {
-        this.destroyPortal();
-    }
-    // ==================== Watchers ====================
-    /**
-     * Sync internal color when value changes.
-     * @param newValue - New color value.
-     * @returns void
-     */
-    handleValueChange(newValue) {
-        if (typeof newValue === 'string') {
-            this.internalColor = types.createColor(newValue);
-            this.isCleared = false;
-        }
-    }
-    /**
-     * Sync format when format prop changes.
-     * @param newFormat - New format.
-     * @returns void
-     */
-    handleFormatChange(newFormat) {
-        if (newFormat) {
-            this.internalFormat = newFormat;
-        }
-    }
-    /**
-     * Sync open state when controlled prop changes.
-     * @param newOpen - Open state.
-     * @returns void
-     */
-    handleOpenPropChange(newOpen) {
-        if (newOpen !== undefined) {
-            this.setOpen(newOpen);
-        }
-    }
-    // ==================== Listeners ====================
-    /**
-     * Close panel on outside click.
-     *
-     * Flow:
-     * 1. Checks if panel is open.
-     * 2. Determines click target.
-     * 3. Checks if click is inside the trigger element or the portal panel.
-     * 4. If outside both, closes the panel by calling \`setOpen(false)\`.
-     *
-     * @param e - Mouse event.
-     * @returns void
-     */
-    handleDocumentClick(e) {
-        if (!this.internalOpen)
-            return;
-        const path = e.composedPath();
-        const isInsideTrigger = path.includes(this.el);
-        const portalEl = this.portalInstance?.getElement();
-        const isInsidePanel = portalEl ? path.includes(portalEl) : false;
-        if (!isInsideTrigger && !isInsidePanel) {
-            this.setOpen(false);
-        }
-    }
-    /**
-     * Close panel on Escape key.
-     * @param e - Keyboard event.
-     * @returns void
-     */
-    handleKeydown(e) {
-        if (e.key === 'Escape' && this.internalOpen) {
-            this.setOpen(false);
-        }
-    }
-    // ==================== Public Methods ====================
-    /**
-     * Get current color object
-     * @returns Promise<Color | null>
-     * @example
-     * const color = await el.getColor()
-     */
-    async getColor() {
-        return this.internalColor;
-    }
-    // ==================== Private Methods ====================
-    /**
-     * Update open state and portal.
-     *
-     * Flow:
-     * 1. Checks if disabled; returns if true.
-     * 2. Updates `internalOpen` state.
-     * 3. Emits `xOpenChange` event.
-     * 4. Calls `updatePortal` (if opening) or `destroyPortal` (if closing).
-     *
-     * @param open - Open state.
-     * @returns void
-     */
-    setOpen(open) {
-        if (this.disabled)
-            return;
-        this.internalOpen = open;
-        this.xOpenChange.emit({ open });
-        if (open) {
-            this.updatePortal();
-        }
-        else {
-            this.destroyPortal();
-        }
-    }
-    /**
-     * Handle trigger click.
-     * @returns void
-     */
-    handleTriggerClick = () => {
-        if (this.trigger === 'click') {
-            this.setOpen(!this.internalOpen);
-        }
-    };
-    /**
-     * Handle trigger mouse enter.
-     * @returns void
-     */
-    handleTriggerMouseEnter = () => {
-        if (this.trigger === 'hover') {
-            this.setOpen(true);
-        }
-    };
-    /**
-     * Handle trigger mouse leave.
-     * @returns void
-     */
-    handleTriggerMouseLeave = () => {
-        if (this.trigger === 'hover' && !this.isDragging) {
-            const portalEl = this.portalInstance?.getElement();
-            setTimeout(() => {
-                if (!portalEl?.matches(':hover') && !this.el.matches(':hover')) {
-                    this.setOpen(false);
-                }
-            }, 100);
-        }
-    };
-    /**
-     * Handle clear action.
-     * @param e - Event.
-     * @returns void
-     */
-    handleClear = (e) => {
-        e.stopPropagation();
-        this.isCleared = true;
-        this.xClear.emit();
-    };
-    // ==================== Portal Management ====================
-    /**
-     * Build color picker panel element.
-     * @returns HTMLElement
-     */
-    buildPanelElement() {
-        // Create x-color-picker-panel component
-        const panelEl = document.createElement('x-color-picker-panel');
-        // Set props on the panel element
-        panelEl.color = this.internalColor;
-        panelEl.format = this.internalFormat;
-        panelEl.disabledAlpha = this.disabledAlpha;
-        panelEl.disabledFormat = this.disabledFormat;
-        panelEl.presets = this.presets;
-        panelEl.allowClear = this.allowClear;
-        // Apply custom class and styles
-        if (this.classNames?.popup) {
-            panelEl.classList.add(...this.classNames.popup.split(' '));
-        }
-        if (this.styles?.popup) {
-            Object.assign(panelEl.style, this.styles.popup);
-        }
-        // Bind events
-        panelEl.addEventListener('colorChange', (e) => {
-            this.handleColorChange(e.detail);
-        });
-        panelEl.addEventListener('colorChangeComplete', (e) => {
-            this.xChangeComplete.emit(e.detail);
-            this.isDragging = false;
-        });
-        panelEl.addEventListener('formatChange', (e) => {
-            this.internalFormat = e.detail;
-            this.xFormatChange.emit({ format: e.detail });
-        });
-        panelEl.addEventListener('colorClear', () => {
-            this.isCleared = true;
-            this.xClear.emit();
-            this.setOpen(false);
-        });
-        // Track dragging state
-        panelEl.addEventListener('mousedown', () => {
-            this.isDragging = true;
-        });
-        return panelEl;
-    }
-    /**
-     * Get trigger element for portal target.
-     * @returns HTMLElement
-     */
-    getWrapperEl() {
-        return this.triggerRef;
-    }
-    /**
-     * Create or update portal for panel.
-     *
-     * Flow:
-     * 1. Checks if `internalOpen` is true.
-     * 2. Builds or reuses the panel element.
-     * 3. Uses `PortalController` to render the panel:
-     *    - Creates new instance if none exists.
-     *    - Updates existing instance with new content/position.
-     * 4. Requests animation frame to ensure position update.
-     *
-     * @returns void
-     */
-    updatePortal() {
-        if (!this.internalOpen) {
-            this.destroyPortal();
-            return;
-        }
-        this.panelElement = this.buildPanelElement();
-        if (!this.portalInstance) {
-            this.portalInstance = portalController.PortalController.create({
-                open: true,
-                target: this.getWrapperEl(),
-                placement: this.placement,
-                content: this.panelElement,
-                zIndex: 1050,
-            });
-        }
-        else {
-            this.portalInstance.update({
-                open: true,
-                target: this.getWrapperEl(),
-                placement: this.placement,
-                content: this.panelElement,
-            });
-        }
-        // Update position after render
-        requestAnimationFrame(() => {
-            if (this.portalInstance) {
-                this.portalInstance.update({});
-            }
-        });
-    }
-    /**
-     * Destroy portal instance if present.
-     * @returns void
-     */
-    destroyPortal() {
-        if (this.portalInstance) {
-            this.portalInstance.destroy();
-            this.portalInstance = null;
-            this.panelElement = null;
-        }
-    }
-    /**
-     * Handle color change from panel.
-     * @param color - New color.
-     * @returns void
-     */
-    handleColorChange(color) {
-        this.internalColor = color;
-        this.isCleared = false;
-        this.value = color.toHexString();
-        this.xChange.emit({
-            color,
-            css: color.toCssString(),
-        });
-        // Update panel element with new color
-        if (this.panelElement) {
-            this.panelElement.color = color;
-        }
-    }
-    // ==================== Render ====================
-    /**
-     * Get display text for current color.
-     * @returns string
-     */
-    getDisplayText() {
-        if (!this.internalColor || this.isCleared)
-            return '';
-        if (typeof this.showText === 'function') {
-            return this.showText(this.internalColor);
-        }
-        switch (this.internalFormat) {
-            case 'rgb':
-                return this.internalColor.toRgbString();
-            case 'hsb':
-                return this.internalColor.toHsbString();
-            default:
-                return this.internalColor.toHexString().toUpperCase();
-        }
-    }
-    /**
-     * Render down arrow icon.
-     * @returns JSX.Element
-     */
-    renderDownArrow() {
-        return (
-        // <svg viewBox="64 64 896 896" focusable="false" width="1em" height="1em" fill="currentColor">
-        //   <path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z" />
-        // </svg>
-        index.h("x-icon", { name: config.getIcon('arrowDown') }));
-    }
-    /**
-     * Render clear icon.
-     * @returns JSX.Element
-     */
-    renderCloseIcon() {
-        return (
-        // <svg viewBox="64 64 896 896" focusable="false" width="1em" height="1em" fill="currentColor">
-        //   <path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 01-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z" />
-        // </svg>
-        index.h("x-icon", { name: config.getIcon('clear') }));
-    }
-    /**
-     * Render trigger and optional text.
-     * @returns JSX.Element
-     */
-    render() {
-        const hostClasses = {
-            'x-color-picker': true,
-            'x-color-picker-sm': this.size === 'small',
-            'x-color-picker-lg': this.size === 'large',
-            'x-color-picker-disabled': this.disabled,
-            [this.classNames?.root ?? '']: !!this.classNames?.root,
-        };
-        const colorValue = this.internalColor && !this.isCleared
-            ? this.internalColor.toCssString()
-            : 'transparent';
-        return (index.h(index.Host, { key: 'f8f38365b7fd8c36aac0d9dc1799fc568516fea9', class: hostClasses, style: this.styles?.root }, index.h("div", { key: '8df150a9ac5477f34c21ef391c6a110a9518127e', class: "x-color-picker-trigger", ref: (el) => (this.triggerRef = el), onClick: this.handleTriggerClick, onMouseEnter: this.handleTriggerMouseEnter, onMouseLeave: this.handleTriggerMouseLeave, tabindex: this.disabled ? -1 : 0, role: "button", "aria-haspopup": "true", "aria-expanded": this.internalOpen ? 'true' : 'false' }, index.h("slot", { key: '77c612bde00f68546e52eb30351f9e26c724bbd8' }, index.h("div", { key: '19ddcbfc6acea0c985d263abeae54facb1878856', class: {
-                'x-color-picker-color-block': true,
-                'x-color-picker-color-block-cleared': this.isCleared,
-            } }, index.h("div", { key: 'd6223ba45365f694a1b760fc0779273903a3e080', class: "x-color-picker-color-block-inner", style: { background: colorValue } })), this.showText && (index.h("span", { key: 'b80debccfafa45df16aeabedfafcc9e0721a3a4d', class: "x-color-picker-text" }, this.getDisplayText())), this.allowClear && !this.isCleared && this.internalColor && (index.h("span", { key: '8caa5439b9ad31915420be95deb94eff604bc411', class: "x-color-picker-clear", onClick: this.handleClear }, this.renderCloseIcon())), index.h("span", { key: 'ed22036212268e812ebfe9869918cd31fcebaaef', class: {
-                'x-color-picker-arrow': true,
-                'x-color-picker-arrow-open': this.internalOpen,
-            } }, this.renderDownArrow())))));
-    }
-    static get watchers() { return {
-        "value": [{
-                "handleValueChange": 0
-            }],
-        "format": [{
-                "handleFormatChange": 0
-            }],
-        "open": [{
-                "handleOpenPropChange": 0
-            }]
-    }; }
-};
-XColorPicker.style = xColorPickerCss();
-
-const xDividerCss = () => `@charset "UTF-8";:root{--x-color-primary:#1677ff;--x-color-primary-rgb:22, 119, 255;--x-color-primary-contrast:#ffffff;--x-color-primary-contrast-rgb:255, 255, 255;--x-color-primary-shade:#0958d9;--x-color-primary-tint:#4096ff;--x-color-primary-bg:#e6f4ff;--x-color-primary-bg-hover:#bae0ff;--x-color-primary-border:#91caff;--x-color-primary-border-hover:#69b1ff;--x-color-primary-hover:#4096ff;--x-color-primary-active:#0958d9;--x-color-primary-text:#1677ff;--x-color-primary-text-hover:#4096ff;--x-color-primary-text-active:#0958d9;--x-color-secondary:#3dc2ff;--x-color-secondary-rgb:61, 194, 255;--x-color-secondary-contrast:#ffffff;--x-color-secondary-contrast-rgb:255, 255, 255;--x-color-secondary-shade:#36abe0;--x-color-secondary-tint:#50c8ff;--x-color-success:#52c41a;--x-color-success-rgb:82, 196, 26;--x-color-success-contrast:#ffffff;--x-color-success-contrast-rgb:255, 255, 255;--x-color-success-shade:#389e0d;--x-color-success-tint:#73d13d;--x-color-success-bg:#f6ffed;--x-color-success-bg-hover:#d9f7be;--x-color-success-border:#b7eb8f;--x-color-success-border-hover:#95de64;--x-color-success-hover:#73d13d;--x-color-success-active:#389e0d;--x-color-success-text:#52c41a;--x-color-success-text-hover:#73d13d;--x-color-success-text-active:#389e0d;--x-color-warning:#faad14;--x-color-warning-rgb:250, 173, 20;--x-color-warning-contrast:#000000;--x-color-warning-contrast-rgb:0, 0, 0;--x-color-warning-shade:#d48806;--x-color-warning-tint:#ffc53d;--x-color-warning-bg:#fffbe6;--x-color-warning-bg-hover:#fff1b8;--x-color-warning-border:#ffe58f;--x-color-warning-border-hover:#ffd666;--x-color-warning-hover:#ffc53d;--x-color-warning-active:#d48806;--x-color-warning-text:#faad14;--x-color-warning-text-hover:#ffc53d;--x-color-warning-text-active:#d48806;--x-color-danger:#ff4d4f;--x-color-danger-rgb:255, 77, 79;--x-color-danger-contrast:#ffffff;--x-color-danger-contrast-rgb:255, 255, 255;--x-color-danger-shade:#cf1322;--x-color-danger-tint:#ff7875;--x-color-error:#ff4d4f;--x-color-error-rgb:255, 77, 79;--x-color-error-bg:#fff2f0;--x-color-error-bg-hover:#ffccc7;--x-color-error-border:#ffa39e;--x-color-error-border-hover:#ff7875;--x-color-error-hover:#ff7875;--x-color-error-active:#d9363e;--x-color-error-text:#ff4d4f;--x-color-error-text-hover:#ff7875;--x-color-error-text-active:#d9363e;--x-color-info:#1677ff;--x-color-info-rgb:22, 119, 255;--x-color-info-bg:#e6f4ff;--x-color-info-bg-hover:#bae0ff;--x-color-info-border:#91caff;--x-color-info-border-hover:#69b1ff;--x-color-info-hover:#69b1ff;--x-color-info-active:#0958d9;--x-color-info-text:#1677ff;--x-color-info-text-hover:#69b1ff;--x-color-info-text-active:#0958d9;--x-color-text:rgba(0, 0, 0, 0.88);--x-color-text-secondary:rgba(0, 0, 0, 0.65);--x-color-text-tertiary:rgba(0, 0, 0, 0.45);--x-color-text-quaternary:rgba(0, 0, 0, 0.25);--x-color-text-disabled:rgba(0, 0, 0, 0.25);--x-color-text-placeholder:rgba(0, 0, 0, 0.25);--x-color-text-heading:rgba(0, 0, 0, 0.88);--x-color-text-label:rgba(0, 0, 0, 0.65);--x-color-text-description:rgba(0, 0, 0, 0.45);--x-color-text-light-solid:#ffffff;--x-color-bg-container:#ffffff;--x-color-bg-elevated:#ffffff;--x-color-bg-layout:#f5f5f5;--x-color-bg-spotlight:rgba(0, 0, 0, 0.85);--x-color-bg-mask:rgba(0, 0, 0, 0.45);--x-color-bg-base:#ffffff;--x-color-bg-container-disabled:#f5f5f5;--x-color-bg-container-loading:rgba(255, 255, 255, 0.65);--x-color-white:#ffffff;--x-color-fill:rgba(0, 0, 0, 0.15);--x-color-fill-secondary:rgba(0, 0, 0, 0.06);--x-color-fill-tertiary:rgba(0, 0, 0, 0.04);--x-color-fill-quaternary:rgba(0, 0, 0, 0.02);--x-color-border:#d9d9d9;--x-color-border-secondary:#f0f0f0;--x-color-border-bg:#ffffff;--x-color-split:rgba(5, 5, 5, 0.06);--x-color-dark:#222428;--x-color-dark-rgb:34, 36, 40;--x-color-dark-contrast:#ffffff;--x-color-dark-contrast-rgb:255, 255, 255;--x-color-dark-shade:#1e2023;--x-color-dark-tint:#383a3e;--x-color-medium:#92949c;--x-color-medium-rgb:146, 148, 156;--x-color-medium-contrast:#ffffff;--x-color-medium-contrast-rgb:255, 255, 255;--x-color-medium-shade:#808289;--x-color-medium-tint:#9d9fa6;--x-color-light:#f4f5f8;--x-color-light-rgb:244, 245, 248;--x-color-light-contrast:#000000;--x-color-light-contrast-rgb:0, 0, 0;--x-color-light-shade:#d7d8da;--x-color-light-tint:#f5f6f9;--x-font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--x-font-family-code:"SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;--x-font-size:14px;--x-font-size-sm:12px;--x-font-size-lg:16px;--x-font-size-xl:20px;--x-font-size-heading-1:38px;--x-font-size-heading-2:30px;--x-font-size-heading-3:24px;--x-font-size-heading-4:20px;--x-font-size-heading-5:16px;--x-line-height:1.5714285714285714;--x-line-height-lg:1.5;--x-line-height-sm:1.6666666666666667;--x-line-height-heading-1:1.2105263157894737;--x-line-height-heading-2:1.2666666666666666;--x-line-height-heading-3:1.3333333333333333;--x-line-height-heading-4:1.4;--x-line-height-heading-5:1.5;--x-font-weight-normal:400;--x-font-weight-medium:500;--x-font-weight-semibold:600;--x-font-weight-strong:600;--x-font-size-base:14px;--x-font-size-xxl:24px;--x-line-height-base:1.5714285714285714;--x-spacing-xxs:4px;--x-spacing-xs:8px;--x-spacing-sm:12px;--x-spacing-md:16px;--x-spacing-lg:20px;--x-spacing-xl:24px;--x-spacing-xxl:32px;--x-spacing-xxxl:48px;--x-margin-xxs:4px;--x-margin-xs:8px;--x-margin-sm:12px;--x-margin-md:16px;--x-margin-lg:24px;--x-margin-xl:32px;--x-margin-xxl:48px;--x-padding-xxs:4px;--x-padding-xs:8px;--x-padding-sm:12px;--x-padding-md:16px;--x-padding-lg:24px;--x-padding-content-horizontal-lg:24px;--x-padding-content-vertical-lg:12px;--x-padding-content-horizontal:16px;--x-padding-content-vertical:12px;--x-padding-content-horizontal-sm:16px;--x-padding-content-vertical-sm:8px;--x-border-radius:6px;--x-border-radius-xs:2px;--x-border-radius-sm:4px;--x-border-radius-lg:8px;--x-border-radius-xl:12px;--x-border-radius-outer:4px;--x-border-radius-base:6px;--x-border-width:1px;--x-border-width-base:1px;--x-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-shadow-lg:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-box-shadow-popover-arrow:2px 2px 5px rgba(0, 0, 0, 0.05);--x-box-shadow-card:0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);--x-box-shadow-drawer-right:-6px 0 16px 0 rgba(0, 0, 0, 0.08), -3px 0 6px -4px rgba(0, 0, 0, 0.12), -9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-left:6px 0 16px 0 rgba(0, 0, 0, 0.08), 3px 0 6px -4px rgba(0, 0, 0, 0.12), 9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-up:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-down:0 -6px 16px 0 rgba(0, 0, 0, 0.08), 0 -3px 6px -4px rgba(0, 0, 0, 0.12), 0 -9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tabs-overflow-left:inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-right:inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-top:inset 0 10px 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-bottom:inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08);--x-motion-duration-fast:0.1s;--x-motion-duration-mid:0.2s;--x-motion-duration-slow:0.3s;--x-motion-ease-in-out:cubic-bezier(0.645, 0.045, 0.355, 1);--x-motion-ease-out:cubic-bezier(0.215, 0.61, 0.355, 1);--x-motion-ease-in:cubic-bezier(0.55, 0.055, 0.675, 0.19);--x-motion-ease-out-back:cubic-bezier(0.12, 0.4, 0.29, 1.46);--x-motion-ease-in-back:cubic-bezier(0.71, -0.46, 0.88, 0.6);--x-motion-ease-in-out-circle:cubic-bezier(0.78, 0.14, 0.15, 0.86);--x-motion-ease-out-circle:cubic-bezier(0.08, 0.82, 0.17, 1);--x-motion-ease-in-circle:cubic-bezier(0.6, 0.04, 0.98, 0.34);--x-motion-ease-in-quint:cubic-bezier(0.755, 0.05, 0.855, 0.06);--x-motion-ease-out-quint:cubic-bezier(0.23, 1, 0.32, 1);--x-z-index-base:0;--x-z-index-popup-base:1000;--x-z-index-popup:1030;--x-z-index-affix:10;--x-z-index-modal:1000;--x-z-index-modal-mask:1000;--x-z-index-drawer:1000;--x-z-index-popover:1030;--x-z-index-dropdown:1050;--x-z-index-tooltip:1070;--x-z-index-notification:1080;--x-z-index-message:1090;--x-z-index-popconfirm:1060;--x-z-index-table-fixed:10;--x-opacity-loading:0.65;--x-opacity-image:1;--x-opacity-disabled:0.5;--x-control-height:32px;--x-control-height-xs:24px;--x-control-height-sm:24px;--x-control-height-lg:40px;--x-control-radio-size:16px;--x-control-checkbox-size:16px;--x-control-padding-horizontal:12px;--x-control-padding-horizontal-sm:8px;--x-control-outline-width:2px;--x-control-outline:rgba(5, 145, 255, 0.1);--x-control-item-bg-hover:rgba(0, 0, 0, 0.04);--x-control-item-bg-active:#e6f4ff;--x-control-item-bg-active-hover:#bae0ff;--x-control-item-bg-active-disabled:rgba(0, 0, 0, 0.15);--x-control-tmp-outline:rgba(0, 0, 0, 0.02);--x-color-yellow:#fadb14;--x-color-yellow-rgb:250, 219, 20;--x-font-family-base:var(--x-font-family);--x-color-link:#1677ff;--x-color-link-hover:#69b1ff;--x-color-link-active:#0958d9;--x-color-icon:rgba(0, 0, 0, 0.45);--x-color-icon-hover:rgba(0, 0, 0, 0.88);--x-color-highlight:#ff4d4f;--x-color-bg-text-hover:rgba(0, 0, 0, 0.06);--x-color-bg-text-active:rgba(0, 0, 0, 0.15);--x-screen-xs:480px;--x-screen-xs-min:480px;--x-screen-xs-max:575px;--x-screen-sm:576px;--x-screen-sm-min:576px;--x-screen-sm-max:767px;--x-screen-md:768px;--x-screen-md-min:768px;--x-screen-md-max:991px;--x-screen-lg:992px;--x-screen-lg-min:992px;--x-screen-lg-max:1199px;--x-screen-xl:1200px;--x-screen-xl-min:1200px;--x-screen-xl-max:1599px;--x-screen-xxl:1600px;--x-screen-xxl-min:1600px;--x-color-fill-content:rgba(0, 0, 0, 0.06);--x-color-fill-content-hover:rgba(0, 0, 0, 0.15);--x-color-fill-alter:rgba(0, 0, 0, 0.02);--x-scrollbar-width:12px;--x-scrollbar-track-bg:rgba(0, 0, 0, 0.04);--x-scrollbar-thumb-bg:rgba(0, 0, 0, 0.25);--x-scrollbar-thumb-bg-hover:rgba(0, 0, 0, 0.35);--x-menu-dark-bg:#001529;--x-menu-dark-item-bg:#001529;--x-menu-dark-popup-bg:#001529;--x-menu-dark-submenu-item-bg:#000c17}:host{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;color:var(--x-divider-color, var(--x-color-text, rgba(0, 0, 0, 0.88)));font-size:var(--x-divider-font-size, var(--x-font-size-base, 14px));font-variant:tabular-nums;line-height:var(--x-divider-line-height, var(--x-line-height-base, 1.5714));list-style:none;-webkit-font-feature-settings:"tnum";font-feature-settings:"tnum";border-top:var(--x-divider-border-width, var(--x-border-width-base, 1px)) solid var(--x-divider-border-color, var(--x-color-split, rgba(5, 5, 5, 0.06)))}:host(.x-divider-vertical){position:relative;top:var(--x-divider-vertical-top, -0.06em);display:inline-block;height:var(--x-divider-vertical-height, 0.9em);margin:0 var(--x-divider-margin-horizontal, var(--x-spacing-xs, 8px));vertical-align:middle;border-top:0;border-left:var(--x-divider-border-width, var(--x-border-width-base, 1px)) solid var(--x-divider-border-color, var(--x-color-split, rgba(5, 5, 5, 0.06)))}:host(.x-divider-horizontal){display:-ms-flexbox;display:flex;clear:both;width:100%;min-width:100%;margin:var(--x-divider-margin-vertical, var(--x-spacing-lg, 24px)) 0}:host(.x-divider-dashed){background:none;border-color:var(--x-divider-border-color, var(--x-color-split, rgba(5, 5, 5, 0.06)));border-style:dashed;border-width:var(--x-divider-border-width, var(--x-border-width-base, 1px)) 0 0}:host(.x-divider-horizontal.x-divider-with-text){display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin:var(--x-divider-with-text-margin, var(--x-spacing-md, 16px)) 0;color:var(--x-divider-color, var(--x-color-text, rgba(0, 0, 0, 0.88)));font-weight:var(--x-divider-font-weight, var(--x-font-weight-medium, 500));font-size:var(--x-divider-font-size-lg, var(--x-font-size-lg, 16px));white-space:nowrap;text-align:center;border-top:0;border-top-color:var(--x-divider-border-color, var(--x-color-split, rgba(5, 5, 5, 0.06)))}:host(.x-divider-horizontal.x-divider-with-text)::before,:host(.x-divider-horizontal.x-divider-with-text)::after{position:relative;width:50%;border-top:var(--x-divider-border-width, var(--x-border-width-base, 1px)) solid transparent;border-top-color:inherit;border-bottom:0;-webkit-transform:translateY(50%);transform:translateY(50%);content:"";-ms-flex:1;flex:1}:host(.x-divider-horizontal.x-divider-with-text-left)::before{-ms-flex:0 0 var(--x-divider-text-margin-left, 5%);flex:0 0 var(--x-divider-text-margin-left, 5%);width:var(--x-divider-text-margin-left, 5%)}:host(.x-divider-horizontal.x-divider-with-text-left)::after{-ms-flex:1;flex:1}:host(.x-divider-horizontal.x-divider-with-text-right)::before{-ms-flex:1;flex:1}:host(.x-divider-horizontal.x-divider-with-text-right)::after{-ms-flex:0 0 var(--x-divider-text-margin-right, 5%);flex:0 0 var(--x-divider-text-margin-right, 5%);width:var(--x-divider-text-margin-right, 5%)}.x-divider-inner-text{display:inline-block;padding:0 var(--x-divider-text-padding, 1em)}:host(.x-divider-plain) .x-divider-inner-text{font-weight:normal;font-size:var(--x-divider-font-size, var(--x-font-size-base, 14px))}`;
-
-const XDivider = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    get el() { return index.getElement(this); }
-    /**
-     * Tracks whether the divider has text content.
-     */
-    hasContent = false;
-    /**
-     * Whether line is dashed.
-     * @example
-     * <x-divider dashed></x-divider>
-     */
-    dashed = false;
-    /**
-     * The position of title inside divider.
-     * @example
-     * <x-divider orientation="left">Left</x-divider>
-     */
-    orientation = 'center';
-    /**
-     * Divider text show as plain style.
-     * @example
-     * <x-divider plain>Text</x-divider>
-     */
-    plain = false;
-    /**
-     * The direction type of divider.
-     * @example
-     * <x-divider type="vertical"></x-divider>
-     */
-    type = 'horizontal';
-    /**
-     * The margin-left/right of the title.
-     * @example
-     * <x-divider orientation="left" orientationMargin="12px">Text</x-divider>
-     */
-    orientationMargin;
-    /**
-     * Check for initial slot content.
-     * @returns void
-     * @example
-     * <x-divider>Text</x-divider>
-     */
-    componentWillLoad() {
-        this.checkContent();
-    }
-    /**
-     * Determine if default slot has content.
-     * @returns void
-     * @example
-     * <x-divider>Text</x-divider>
-     */
-    checkContent() {
-        // Initial check, though slotchange is better for dynamic updates
-        this.hasContent = this.el.innerHTML.trim().length > 0;
-    }
-    /**
-     * Update content state when slot changes.
-     * @param e - Slot change event.
-     * @returns void
-     * @example
-     * <x-divider>Text</x-divider>
-     */
-    handleSlotChange = (e) => {
-        const slot = e.target;
-        this.hasContent = slot.assignedNodes({ flatten: true }).length > 0;
-    };
-    /**
-     * Render divider with optional text and orientation styles.
-     *
-     * Flow:
-     * 1. Constructs class map based on type (horizontal/vertical), style (dashed/plain), and content presence.
-     * 2. Calculates orientation styles (margin-left/right) if needed.
-     * 3. Renders Host element.
-     * 4. If horizontal with content:
-     *    - Renders text wrapper span.
-     *    - Projects slot.
-     * 5. Otherwise (vertical or empty):
-     *    - Projects slot directly.
-     *
-     * @returns JSX.Element
-     * @example
-     * <x-divider orientation="right">Right</x-divider>
-     */
-    render() {
-        const { dashed, orientation, plain, type, orientationMargin, hasContent } = this;
-        // Build classes based on type and text presence.
-        const classes = {
-            'x-divider': true,
-            [`x-divider-${type}`]: true,
-            [`x-divider-with-text`]: hasContent && type === 'horizontal',
-            [`x-divider-with-text-${orientation}`]: hasContent && type === 'horizontal',
-            'x-divider-dashed': dashed,
-            'x-divider-plain': plain,
-        };
-        // Apply margin styles when orientation is left/right.
-        const style = {};
-        if (orientationMargin && type === 'horizontal' && hasContent) {
-            // Apply margin for left or right alignment.
-            if (orientation === 'left') {
-                style['--x-divider-margin-left'] = orientationMargin;
-            }
-            else if (orientation === 'right') {
-                style['--x-divider-margin-right'] = orientationMargin;
-            }
-        }
-        return (index.h(index.Host, { key: 'c01c2f45c5bd8644531889d9787efb9afaa53e5f', class: classes, style: style }, type === 'horizontal' && hasContent && (index.h("span", { key: 'de69f4795c2069fe4844d087827f33c625759e9a', class: "x-divider-inner-text" }, index.h("slot", { key: 'cb0b0e462a05bd6035579554f5665a4baf52b856', onSlotchange: this.handleSlotChange }))), (!hasContent || type === 'vertical') && index.h("slot", { key: '054ecd7d528d560edffbf86722a1e8084f29890e', onSlotchange: this.handleSlotChange })));
-    }
-};
-XDivider.style = xDividerCss();
-
-/**
- * FormControl — Tracks value & validity of an individual form control
- * Mirrors Angular's FormControl API 100%
- */
-class FormControl extends abstractControl.AbstractControl {
-    constructor(formState = null, validatorsOrOptions, asyncValidators) {
-        super();
-        this._initialize(formState, validatorsOrOptions, asyncValidators);
-        this._updateValueAndValidity({ onlySelf: true, emitEvent: false });
-    }
-    get value() {
-        return this._value;
-    }
-    setValue(value, options = {}) {
-        this._value = value;
-        if (this._onChange.length && options.emitModelToViewChange !== false) {
-            this._onChange.forEach(changeFn => changeFn(this._value));
-        }
-        this._updateValueAndValidity(options);
-        if (options.emitEvent !== false) {
-            this._emitValueChange(this._value);
-        }
-    }
-    patchValue(value, options = {}) {
-        this.setValue(value, options);
-    }
-    reset(formState = null, options = {}) {
-        this._initialize(formState, this._validators, this._asyncValidators);
-        this.markAsPristine(options);
-        this.markAsUntouched(options);
-        this._updateValueAndValidity(options);
-        if (options.emitEvent !== false) {
-            this._emitValueChange(this._value);
-        }
-    }
-    // ─── Internal ────────────────────────────────────────────────
-    _initialize(formState, validatorsOrOptions, asyncValidators) {
-        if (this._isFormControlOptions(validatorsOrOptions)) {
-            this._applyValidators(validatorsOrOptions);
-            this._updateOn = validatorsOrOptions.updateOn || 'change';
-        }
-        else {
-            this._applyValidators(validatorsOrOptions, asyncValidators);
-        }
-        if (formState !== null && typeof formState === 'object' && 'value' in formState) {
-            const state = formState;
-            this._value = state.value;
-            if (state.disabled) {
-                this.disable({ onlySelf: true, emitEvent: false });
-            }
-        }
-        else {
-            this._value = formState;
-        }
-    }
-    _isFormControlOptions(obj) {
-        return !!obj && typeof obj === 'object' && !Array.isArray(obj) && ('validators' in obj || 'asyncValidators' in obj || 'updateOn' in obj);
-    }
-    _runValidation() {
-        if (this._status === 'DISABLED')
-            return;
-        this._errors = this._runValidators(this._value);
-        this._status = this._calculateStatus();
-        if (this._status === 'VALID' && this._asyncValidators.length > 0) {
-            this._runAsyncValidators(this._value);
-        }
-    }
-}
-
-const xFormItemCss = () => `@charset "UTF-8";:root{--x-color-primary:#1677ff;--x-color-primary-rgb:22, 119, 255;--x-color-primary-contrast:#ffffff;--x-color-primary-contrast-rgb:255, 255, 255;--x-color-primary-shade:#0958d9;--x-color-primary-tint:#4096ff;--x-color-primary-bg:#e6f4ff;--x-color-primary-bg-hover:#bae0ff;--x-color-primary-border:#91caff;--x-color-primary-border-hover:#69b1ff;--x-color-primary-hover:#4096ff;--x-color-primary-active:#0958d9;--x-color-primary-text:#1677ff;--x-color-primary-text-hover:#4096ff;--x-color-primary-text-active:#0958d9;--x-color-secondary:#3dc2ff;--x-color-secondary-rgb:61, 194, 255;--x-color-secondary-contrast:#ffffff;--x-color-secondary-contrast-rgb:255, 255, 255;--x-color-secondary-shade:#36abe0;--x-color-secondary-tint:#50c8ff;--x-color-success:#52c41a;--x-color-success-rgb:82, 196, 26;--x-color-success-contrast:#ffffff;--x-color-success-contrast-rgb:255, 255, 255;--x-color-success-shade:#389e0d;--x-color-success-tint:#73d13d;--x-color-success-bg:#f6ffed;--x-color-success-bg-hover:#d9f7be;--x-color-success-border:#b7eb8f;--x-color-success-border-hover:#95de64;--x-color-success-hover:#73d13d;--x-color-success-active:#389e0d;--x-color-success-text:#52c41a;--x-color-success-text-hover:#73d13d;--x-color-success-text-active:#389e0d;--x-color-warning:#faad14;--x-color-warning-rgb:250, 173, 20;--x-color-warning-contrast:#000000;--x-color-warning-contrast-rgb:0, 0, 0;--x-color-warning-shade:#d48806;--x-color-warning-tint:#ffc53d;--x-color-warning-bg:#fffbe6;--x-color-warning-bg-hover:#fff1b8;--x-color-warning-border:#ffe58f;--x-color-warning-border-hover:#ffd666;--x-color-warning-hover:#ffc53d;--x-color-warning-active:#d48806;--x-color-warning-text:#faad14;--x-color-warning-text-hover:#ffc53d;--x-color-warning-text-active:#d48806;--x-color-danger:#ff4d4f;--x-color-danger-rgb:255, 77, 79;--x-color-danger-contrast:#ffffff;--x-color-danger-contrast-rgb:255, 255, 255;--x-color-danger-shade:#cf1322;--x-color-danger-tint:#ff7875;--x-color-error:#ff4d4f;--x-color-error-rgb:255, 77, 79;--x-color-error-bg:#fff2f0;--x-color-error-bg-hover:#ffccc7;--x-color-error-border:#ffa39e;--x-color-error-border-hover:#ff7875;--x-color-error-hover:#ff7875;--x-color-error-active:#d9363e;--x-color-error-text:#ff4d4f;--x-color-error-text-hover:#ff7875;--x-color-error-text-active:#d9363e;--x-color-info:#1677ff;--x-color-info-rgb:22, 119, 255;--x-color-info-bg:#e6f4ff;--x-color-info-bg-hover:#bae0ff;--x-color-info-border:#91caff;--x-color-info-border-hover:#69b1ff;--x-color-info-hover:#69b1ff;--x-color-info-active:#0958d9;--x-color-info-text:#1677ff;--x-color-info-text-hover:#69b1ff;--x-color-info-text-active:#0958d9;--x-color-text:rgba(0, 0, 0, 0.88);--x-color-text-secondary:rgba(0, 0, 0, 0.65);--x-color-text-tertiary:rgba(0, 0, 0, 0.45);--x-color-text-quaternary:rgba(0, 0, 0, 0.25);--x-color-text-disabled:rgba(0, 0, 0, 0.25);--x-color-text-placeholder:rgba(0, 0, 0, 0.25);--x-color-text-heading:rgba(0, 0, 0, 0.88);--x-color-text-label:rgba(0, 0, 0, 0.65);--x-color-text-description:rgba(0, 0, 0, 0.45);--x-color-text-light-solid:#ffffff;--x-color-bg-container:#ffffff;--x-color-bg-elevated:#ffffff;--x-color-bg-layout:#f5f5f5;--x-color-bg-spotlight:rgba(0, 0, 0, 0.85);--x-color-bg-mask:rgba(0, 0, 0, 0.45);--x-color-bg-base:#ffffff;--x-color-bg-container-disabled:#f5f5f5;--x-color-bg-container-loading:rgba(255, 255, 255, 0.65);--x-color-white:#ffffff;--x-color-fill:rgba(0, 0, 0, 0.15);--x-color-fill-secondary:rgba(0, 0, 0, 0.06);--x-color-fill-tertiary:rgba(0, 0, 0, 0.04);--x-color-fill-quaternary:rgba(0, 0, 0, 0.02);--x-color-border:#d9d9d9;--x-color-border-secondary:#f0f0f0;--x-color-border-bg:#ffffff;--x-color-split:rgba(5, 5, 5, 0.06);--x-color-dark:#222428;--x-color-dark-rgb:34, 36, 40;--x-color-dark-contrast:#ffffff;--x-color-dark-contrast-rgb:255, 255, 255;--x-color-dark-shade:#1e2023;--x-color-dark-tint:#383a3e;--x-color-medium:#92949c;--x-color-medium-rgb:146, 148, 156;--x-color-medium-contrast:#ffffff;--x-color-medium-contrast-rgb:255, 255, 255;--x-color-medium-shade:#808289;--x-color-medium-tint:#9d9fa6;--x-color-light:#f4f5f8;--x-color-light-rgb:244, 245, 248;--x-color-light-contrast:#000000;--x-color-light-contrast-rgb:0, 0, 0;--x-color-light-shade:#d7d8da;--x-color-light-tint:#f5f6f9;--x-font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--x-font-family-code:"SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;--x-font-size:14px;--x-font-size-sm:12px;--x-font-size-lg:16px;--x-font-size-xl:20px;--x-font-size-heading-1:38px;--x-font-size-heading-2:30px;--x-font-size-heading-3:24px;--x-font-size-heading-4:20px;--x-font-size-heading-5:16px;--x-line-height:1.5714285714285714;--x-line-height-lg:1.5;--x-line-height-sm:1.6666666666666667;--x-line-height-heading-1:1.2105263157894737;--x-line-height-heading-2:1.2666666666666666;--x-line-height-heading-3:1.3333333333333333;--x-line-height-heading-4:1.4;--x-line-height-heading-5:1.5;--x-font-weight-normal:400;--x-font-weight-medium:500;--x-font-weight-semibold:600;--x-font-weight-strong:600;--x-font-size-base:14px;--x-font-size-xxl:24px;--x-line-height-base:1.5714285714285714;--x-spacing-xxs:4px;--x-spacing-xs:8px;--x-spacing-sm:12px;--x-spacing-md:16px;--x-spacing-lg:20px;--x-spacing-xl:24px;--x-spacing-xxl:32px;--x-spacing-xxxl:48px;--x-margin-xxs:4px;--x-margin-xs:8px;--x-margin-sm:12px;--x-margin-md:16px;--x-margin-lg:24px;--x-margin-xl:32px;--x-margin-xxl:48px;--x-padding-xxs:4px;--x-padding-xs:8px;--x-padding-sm:12px;--x-padding-md:16px;--x-padding-lg:24px;--x-padding-content-horizontal-lg:24px;--x-padding-content-vertical-lg:12px;--x-padding-content-horizontal:16px;--x-padding-content-vertical:12px;--x-padding-content-horizontal-sm:16px;--x-padding-content-vertical-sm:8px;--x-border-radius:6px;--x-border-radius-xs:2px;--x-border-radius-sm:4px;--x-border-radius-lg:8px;--x-border-radius-xl:12px;--x-border-radius-outer:4px;--x-border-radius-base:6px;--x-border-width:1px;--x-border-width-base:1px;--x-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-shadow-lg:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-box-shadow-popover-arrow:2px 2px 5px rgba(0, 0, 0, 0.05);--x-box-shadow-card:0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);--x-box-shadow-drawer-right:-6px 0 16px 0 rgba(0, 0, 0, 0.08), -3px 0 6px -4px rgba(0, 0, 0, 0.12), -9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-left:6px 0 16px 0 rgba(0, 0, 0, 0.08), 3px 0 6px -4px rgba(0, 0, 0, 0.12), 9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-up:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-down:0 -6px 16px 0 rgba(0, 0, 0, 0.08), 0 -3px 6px -4px rgba(0, 0, 0, 0.12), 0 -9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tabs-overflow-left:inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-right:inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-top:inset 0 10px 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-bottom:inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08);--x-motion-duration-fast:0.1s;--x-motion-duration-mid:0.2s;--x-motion-duration-slow:0.3s;--x-motion-ease-in-out:cubic-bezier(0.645, 0.045, 0.355, 1);--x-motion-ease-out:cubic-bezier(0.215, 0.61, 0.355, 1);--x-motion-ease-in:cubic-bezier(0.55, 0.055, 0.675, 0.19);--x-motion-ease-out-back:cubic-bezier(0.12, 0.4, 0.29, 1.46);--x-motion-ease-in-back:cubic-bezier(0.71, -0.46, 0.88, 0.6);--x-motion-ease-in-out-circle:cubic-bezier(0.78, 0.14, 0.15, 0.86);--x-motion-ease-out-circle:cubic-bezier(0.08, 0.82, 0.17, 1);--x-motion-ease-in-circle:cubic-bezier(0.6, 0.04, 0.98, 0.34);--x-motion-ease-in-quint:cubic-bezier(0.755, 0.05, 0.855, 0.06);--x-motion-ease-out-quint:cubic-bezier(0.23, 1, 0.32, 1);--x-z-index-base:0;--x-z-index-popup-base:1000;--x-z-index-popup:1030;--x-z-index-affix:10;--x-z-index-modal:1000;--x-z-index-modal-mask:1000;--x-z-index-drawer:1000;--x-z-index-popover:1030;--x-z-index-dropdown:1050;--x-z-index-tooltip:1070;--x-z-index-notification:1080;--x-z-index-message:1090;--x-z-index-popconfirm:1060;--x-z-index-table-fixed:10;--x-opacity-loading:0.65;--x-opacity-image:1;--x-opacity-disabled:0.5;--x-control-height:32px;--x-control-height-xs:24px;--x-control-height-sm:24px;--x-control-height-lg:40px;--x-control-radio-size:16px;--x-control-checkbox-size:16px;--x-control-padding-horizontal:12px;--x-control-padding-horizontal-sm:8px;--x-control-outline-width:2px;--x-control-outline:rgba(5, 145, 255, 0.1);--x-control-item-bg-hover:rgba(0, 0, 0, 0.04);--x-control-item-bg-active:#e6f4ff;--x-control-item-bg-active-hover:#bae0ff;--x-control-item-bg-active-disabled:rgba(0, 0, 0, 0.15);--x-control-tmp-outline:rgba(0, 0, 0, 0.02);--x-color-yellow:#fadb14;--x-color-yellow-rgb:250, 219, 20;--x-font-family-base:var(--x-font-family);--x-color-link:#1677ff;--x-color-link-hover:#69b1ff;--x-color-link-active:#0958d9;--x-color-icon:rgba(0, 0, 0, 0.45);--x-color-icon-hover:rgba(0, 0, 0, 0.88);--x-color-highlight:#ff4d4f;--x-color-bg-text-hover:rgba(0, 0, 0, 0.06);--x-color-bg-text-active:rgba(0, 0, 0, 0.15);--x-screen-xs:480px;--x-screen-xs-min:480px;--x-screen-xs-max:575px;--x-screen-sm:576px;--x-screen-sm-min:576px;--x-screen-sm-max:767px;--x-screen-md:768px;--x-screen-md-min:768px;--x-screen-md-max:991px;--x-screen-lg:992px;--x-screen-lg-min:992px;--x-screen-lg-max:1199px;--x-screen-xl:1200px;--x-screen-xl-min:1200px;--x-screen-xl-max:1599px;--x-screen-xxl:1600px;--x-screen-xxl-min:1600px;--x-color-fill-content:rgba(0, 0, 0, 0.06);--x-color-fill-content-hover:rgba(0, 0, 0, 0.15);--x-color-fill-alter:rgba(0, 0, 0, 0.02);--x-scrollbar-width:12px;--x-scrollbar-track-bg:rgba(0, 0, 0, 0.04);--x-scrollbar-thumb-bg:rgba(0, 0, 0, 0.25);--x-scrollbar-thumb-bg-hover:rgba(0, 0, 0, 0.35);--x-menu-dark-bg:#001529;--x-menu-dark-item-bg:#001529;--x-menu-dark-popup-bg:#001529;--x-menu-dark-submenu-item-bg:#000c17}:host{display:block;margin-bottom:var(--x-form-item-margin-bottom, var(--x-spacing-lg, 24px));-webkit-transition:all var(--x-form-item-motion-duration, var(--x-motion-duration-mid, 0.2s)) var(--x-form-item-motion-ease-out, var(--x-motion-ease-out, cubic-bezier(0.215, 0.61, 0.355, 1)));transition:all var(--x-form-item-motion-duration, var(--x-motion-duration-mid, 0.2s)) var(--x-form-item-motion-ease-out, var(--x-motion-ease-out, cubic-bezier(0.215, 0.61, 0.355, 1)));-webkit-box-sizing:border-box;box-sizing:border-box;padding:0;color:var(--x-form-item-color, var(--x-color-text, rgba(0, 0, 0, 0.88)));font-size:var(--x-form-item-font-size, var(--x-font-size-base, 14px));font-variant:tabular-nums;line-height:var(--x-form-item-line-height, var(--x-line-height-base, 1.5715));list-style:none;-webkit-font-feature-settings:"tnum";font-feature-settings:"tnum"}:host(.x-form-item-horizontal) .x-form-item-row{display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap;min-width:0}:host(.x-form-item-vertical) .x-form-item-row{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host(.x-form-item-vertical) .x-form-item-label{text-align:left;padding:0 0 8px;line-height:var(--x-form-item-line-height, var(--x-line-height-base, 1.5715))}:host(.x-form-item-vertical) .x-form-item-label label::after{display:none}:host(.x-form-item-inline){display:-ms-inline-flexbox;display:inline-flex;margin-right:var(--x-form-item-inline-margin-right, 16px);margin-bottom:0}:host(.x-form-item-inline) .x-form-item-row{display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}:host(.x-form-item-horizontal) .x-form-item-row{display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap}:host(.x-form-item-vertical) .x-form-item-row{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host(.x-form-item-vertical) .x-form-item-label{text-align:left;margin-right:0;padding:0 0 var(--x-form-item-explain-padding-top, var(--x-spacing-xxs, 4px));width:100%}:host(.x-form-item-vertical) .x-form-item-label label{height:auto}:host(.x-form-item-vertical) .x-form-item-label label::after{display:none !important}:host(.x-form-item-inline){display:-ms-inline-flexbox;display:inline-flex;margin-right:var(--x-form-item-inline-margin-right, 16px);margin-bottom:0}:host(.x-form-item-inline) .x-form-item-row{display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-align:center;align-items:center}:host(.x-form-item-inline) .x-form-item-label{margin-right:var(--x-form-item-inline-label-margin-right, 8px)}.x-form-item-row{display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap;min-width:0;width:100%}.x-form-item-label{-ms-flex-positive:0;flex-grow:0;overflow:hidden;white-space:nowrap;vertical-align:middle;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center}.x-form-item-label.x-form-item-label-left{-ms-flex-pack:start !important;justify-content:flex-start !important;text-align:left !important}.x-form-item-label.x-form-item-label-right{-ms-flex-pack:end !important;justify-content:flex-end !important;text-align:right !important}.x-form-item-label.x-form-item-label-center{-ms-flex-pack:center !important;justify-content:center !important;text-align:center !important}.x-form-item-label{margin-right:var(--x-form-item-label-margin-right, var(--x-spacing-md, 16px));line-height:var(--x-form-item-control-height, var(--x-control-height, 32px))}.x-form-item-label label{position:relative;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;max-width:100%;height:var(--x-form-item-control-height, var(--x-control-height, 32px));color:var(--x-form-item-color, var(--x-color-text, rgba(0, 0, 0, 0.88)));font-size:var(--x-form-item-font-size, var(--x-font-size-base, 14px))}.x-form-item-label label::after{content:":";position:relative;top:-0.5px;margin:0 var(--x-form-item-label-colon-margin-inline, var(--x-spacing-xs, 8px)) 0 var(--x-form-item-label-colon-margin-inline-start, 2px)}.x-form-item-label label.x-form-item-no-colon::after{content:" "}.x-form-item-label label.x-form-item-required::before{display:inline-block;margin-right:var(--x-form-item-required-margin-right, var(--x-spacing-xxs, 4px));color:var(--x-form-item-color-error, var(--x-color-error, #ff4d4f));font-size:var(--x-form-item-font-size, var(--x-font-size-base, 14px));font-family:SimSun, sans-serif;line-height:1;content:"*"}.x-form-item-control{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-positive:1;flex-grow:1}.x-form-item-control-input{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-height:var(--x-form-item-control-height, var(--x-control-height, 32px))}.x-form-item-control-input-content{-ms-flex:auto;flex:auto;max-width:100%}.x-form-item-children-icon{position:absolute;top:50%;right:var(--x-form-item-control-padding-horizontal, var(--x-control-padding-horizontal, 11px));z-index:1;width:var(--x-form-item-icon-size, var(--x-spacing-md, 16px));height:var(--x-form-item-icon-size, var(--x-spacing-md, 16px));margin-top:calc(var(--x-form-item-icon-size, var(--x-spacing-md, 16px)) / -2);font-size:var(--x-form-item-icon-size, var(--x-spacing-md, 16px));line-height:var(--x-form-item-icon-size, var(--x-spacing-md, 16px));text-align:center;visibility:visible;-webkit-animation:zoomIn var(--x-form-item-motion-duration, var(--x-motion-duration-mid, 0.2s)) var(--x-form-item-motion-ease-out-back, var(--x-motion-ease-out-back, cubic-bezier(0.12, 0.4, 0.29, 1.46)));animation:zoomIn var(--x-form-item-motion-duration, var(--x-motion-duration-mid, 0.2s)) var(--x-form-item-motion-ease-out-back, var(--x-motion-ease-out-back, cubic-bezier(0.12, 0.4, 0.29, 1.46)));pointer-events:none}.x-form-item-explain{clear:both;min-height:var(--x-form-item-explain-min-height, var(--x-spacing-lg, 24px));margin-top:var(--x-form-item-explain-margin-top, -2px);color:var(--x-form-item-color-secondary, var(--x-color-text-secondary, rgba(0, 0, 0, 0.45)));font-size:var(--x-form-item-font-size, var(--x-font-size-base, 14px));line-height:var(--x-form-item-line-height, var(--x-line-height-base, 1.5715));-webkit-transition:color var(--x-form-item-motion-duration, var(--x-motion-duration-mid, 0.2s)) var(--x-form-item-motion-ease-in-out, var(--x-motion-ease-in-out, cubic-bezier(0.645, 0.045, 0.355, 1)));transition:color var(--x-form-item-motion-duration, var(--x-motion-duration-mid, 0.2s)) var(--x-form-item-motion-ease-in-out, var(--x-motion-ease-in-out, cubic-bezier(0.645, 0.045, 0.355, 1)));padding-top:var(--x-form-item-explain-padding-top, var(--x-spacing-xxs, 4px))}:host(.x-form-item-has-error) .x-form-item-children-icon{color:var(--x-form-item-color-error, var(--x-color-error, #ff4d4f))}:host(.x-form-item-has-error) .x-form-item-explain{color:var(--x-form-item-color-error, var(--x-color-error, #ff4d4f))}:host(.x-form-item-has-warning) .x-form-item-children-icon{color:var(--x-form-item-color-warning, var(--x-color-warning, #faad14))}:host(.x-form-item-has-warning) .x-form-item-explain{color:var(--x-form-item-color-warning, var(--x-color-warning, #faad14))}:host(.x-form-item-has-success) .x-form-item-children-icon{color:var(--x-form-item-color-success, var(--x-color-success, #52c41a))}:host-context(.x-form-vertical) .x-form-item{-ms-flex-direction:column;flex-direction:column}:host-context(.x-form-vertical) .x-form-item-label{text-align:left;margin-right:0;padding:0 0 var(--x-form-item-explain-padding-top, var(--x-spacing-xxs, 4px));line-height:var(--x-form-item-line-height, var(--x-line-height-base, 1.5715))}:host-context(.x-form-vertical) .x-form-item-label label{height:auto}:host-context(.x-form-vertical) .x-form-item-label label::after{display:none}@-webkit-keyframes zoomIn{0%{-webkit-transform:scale(0);transform:scale(0);opacity:0}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes zoomIn{0%{-webkit-transform:scale(0);transform:scale(0);opacity:0}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.anticon-spin{-webkit-animation:loadingCircle 1s infinite linear;animation:loadingCircle 1s infinite linear}@-webkit-keyframes loadingCircle{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes loadingCircle{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}`;
-
-const XFormItem = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    get el() { return index.getElement(this); }
-    /**
-     * Label text
-     * @example
-     * <x-form-item label="Email"></x-form-item>
-     */
-    label;
-    /**
-     * The validation status. If not provided, it will be automatically inferred from the form control.
-     * @example
-     * <x-form-item validateStatus="error"></x-form-item>
-     */
-    validateStatus;
-    /**
-     * The help message. If not provided, it will be automatically inferred from the form control errors.
-     * @example
-     * <x-form-item help="Required"></x-form-item>
-     */
-    help;
-    /**
-     * Whether to show the required mark. If not provided, it will be automatically inferred from the form control validators.
-     * @example
-     * <x-form-item required label="Name"></x-form-item>
-     */
-    required = false;
-    /**
-     * Whether to show the colon after label
-     * @example
-     * <x-form-item colon={false} label="Name"></x-form-item>
-     */
-    colon = true;
-    /**
-     * Whether to show the feedback icon
-     * @example
-     * <x-form-item hasFeedback validateStatus="success"></x-form-item>
-     */
-    hasFeedback = false;
-    /**
-     * Label column layout (e.g. span)
-     * @example
-     * <x-form-item labelCol="span: 6"></x-form-item>
-     */
-    labelCol;
-    /**
-     * Wrapper column layout
-     * @example
-     * <x-form-item wrapperCol="span: 18"></x-form-item>
-     */
-    wrapperCol;
-    /**
-     * Label alignment in horizontal layout
-     */
-    labelAlign;
-    /**
-     * Form layout (overrides parent x-form layout)
-     */
-    layout;
-    /**
-     * Field name for form binding
-     */
-    name;
-    /**
-     * Props of children node, for example checkbox should be 'checked'
-     */
-    valuePropName = 'value';
-    /**
-     * Extra prompt message
-     */
-    extra;
-    control;
-    status;
-    errorMessage;
-    parentLayout;
-    parentColon;
-    parentHideRequiredMark;
-    parentLabelAlign;
-    formEl = null;
-    unsubscribe = null;
-    observer = null;
-    nameChanged() {
-        this.connectControl();
-    }
-    componentWillLoad() {
-        this.formEl = this.el.closest('x-form');
-        if (this.formEl) {
-            this.syncParentProps();
-            this.setupObserver();
-        }
-        this.connectControl();
-    }
-    syncParentProps() {
-        if (this.formEl) {
-            this.parentLayout = this.formEl.getAttribute('layout') || this.formEl.layout || 'horizontal';
-            this.parentColon = this.formEl.getAttribute('colon') !== 'false' && this.formEl.colon !== false;
-            this.parentHideRequiredMark = this.formEl.getAttribute('hide-required-mark') === 'true' || this.formEl.hideRequiredMark === true;
-            this.parentLabelAlign = this.formEl.labelAlign || 'right';
-        }
-    }
-    setupObserver() {
-        if (this.formEl && !this.observer) {
-            this.observer = new MutationObserver((mutations) => {
-                mutations.forEach((mutation) => {
-                    if (mutation.type === 'attributes' && (mutation.attributeName === 'layout' ||
-                        mutation.attributeName === 'colon' ||
-                        mutation.attributeName === 'hide-required-mark')) {
-                        this.syncParentProps();
-                    }
-                });
-            });
-            this.observer.observe(this.formEl, { attributes: true });
-        }
-    }
-    disconnectedCallback() {
-        if (this.unsubscribe) {
-            this.unsubscribe();
-        }
-        if (this.observer) {
-            this.observer.disconnect();
-        }
-    }
-    connectControl() {
-        if (this.unsubscribe) {
-            this.unsubscribe();
-        }
-        if (this.formEl && this.formEl.form && this.name) {
-            let control = this.formEl.form.get(this.name);
-            if (!control) {
-                // Self-registration: create a control if it doesn't exist
-                const initialValue = this.formEl.initialValues?.[this.name];
-                control = new FormControl(initialValue);
-                this.formEl.form.addControl(this.name, control);
-            }
-            if (control) {
-                this.control = control;
-                this.syncState(control);
-                this.unsubscribe = control.stateChanges(() => {
-                    this.syncState(control);
-                });
-                // Update child component value
-                this.updateChildValue(control.value);
-            }
-        }
-    }
-    syncState(control) {
-        if (control.touched || control.dirty) {
-            this.validateStatus = control.invalid ? 'error' : (control.pending ? 'validating' : 'success');
-            if (control.errors && !this.help) {
-                this.errorMessage = Object.values(control.errors)[0];
-            }
-            else {
-                this.errorMessage = '';
-            }
-        }
-        const internalControl = control;
-        const validators = (internalControl._validators || internalControl.validators || []);
-        const isRequired = Array.isArray(validators) && validators.some((v) => v.name === 'required' ||
-            (v.toString && v.toString().includes('required')) ||
-            (v.validator && v.validator.name === 'required'));
-        if (isRequired && !this.required) {
-            this.required = true;
-        }
-    }
-    updateChildValue(value) {
-        const input = this.el.querySelector('x-input, x-input-number, x-select, x-checkbox, x-switch');
-        if (input && input[this.valuePropName] !== value) {
-            input[this.valuePropName] = value;
-        }
-    }
-    handleControlChange = (ev) => {
-        if (this.control && this.name) {
-            const detail = ev.detail;
-            const value = detail?.[this.valuePropName] !== undefined
-                ? detail[this.valuePropName]
-                : (detail?.value !== undefined ? detail.value : ev.target[this.valuePropName]);
-            this.control.setValue(value);
-            this.control.markAsDirty();
-        }
-    };
-    handleControlBlur = () => {
-        if (this.control) {
-            this.control.markAsTouched();
-        }
-    };
-    componentDidLoad() {
-        // Listen to changes from child inputs
-        this.el.addEventListener('xChange', this.handleControlChange);
-        this.el.addEventListener('xBlur', this.handleControlBlur);
-    }
-    render() {
-        const displayHelp = this.help || this.errorMessage;
-        const layout = this.layout || this.parentLayout || 'horizontal';
-        const isHorizontal = layout === 'horizontal';
-        const isVertical = layout === 'vertical';
-        const isInline = layout === 'inline';
-        const showColon = this.el.hasAttribute('colon') ? this.colon : this.parentColon;
-        const hideMark = this.parentHideRequiredMark;
-        return (index.h(index.Host, { key: '9e53e5534b7091f5041150f831adec589cffa581', class: {
-                'x-form-item': true,
-                'x-form-item-with-help': !!displayHelp,
-                'x-form-item-has-error': this.validateStatus === 'error',
-                'x-form-item-has-warning': this.validateStatus === 'warning',
-                'x-form-item-has-success': this.validateStatus === 'success',
-                'x-form-item-validating': this.validateStatus === 'validating',
-                'x-form-item-has-feedback': this.hasFeedback,
-                'x-form-item-horizontal': isHorizontal,
-                'x-form-item-vertical': isVertical,
-                'x-form-item-inline': isInline,
-            } }, index.h("div", { key: 'c5dd09be09f559f986fb4d36c70f5c391622b107', class: "x-form-item-row" }, this.label && (index.h("div", { key: 'f77d9c4d9b5241a540546b9d674178f375e92c6d', class: {
-                'x-form-item-label': true,
-                ...(typeof this.labelCol === 'string' ? { [this.labelCol]: true } : {}),
-                [`x-form-item-label-${this.labelAlign || this.parentLabelAlign || 'right'}`]: true
-            }, style: typeof this.labelCol === 'object' && this.labelCol?.span ? {
-                flex: `0 0 ${(this.labelCol.span / 24) * 100}%`,
-                maxWidth: `${(this.labelCol.span / 24) * 100}%`
-            } : {} }, index.h("label", { key: 'e4464d27147d1cee39619ad37cb7c5a6f9cb3139', class: {
-                'x-form-item-required': this.required && !hideMark,
-                'x-form-item-no-colon': !showColon
-            }, title: this.label }, this.label))), index.h("div", { key: '508207d8171598a5d2122eddc91ab9ddbedb8494', class: {
-                'x-form-item-control': true,
-                ...(typeof this.wrapperCol === 'string' ? { [this.wrapperCol]: true } : {})
-            }, style: typeof this.wrapperCol === 'object' && this.wrapperCol?.span ? {
-                flex: `0 0 ${(this.wrapperCol.span / 24) * 100}%`,
-                maxWidth: `${(this.wrapperCol.span / 24) * 100}%`
-            } : {} }, index.h("div", { key: 'b47d5161aaf6f42cd47781118b11094c599e240b', class: "x-form-item-control-input" }, index.h("div", { key: '3437bb735c66cafb7c463f7be885f19470fdf137', class: "x-form-item-control-input-content" }, index.h("slot", { key: '7f8b3ce874b4281e3a3f9eec36fe1f2a7a772a44' })), this.hasFeedback && this.validateStatus && (index.h("span", { key: '4e032dde91980865acc598ecb093d293f1188fa7', class: "x-form-item-children-icon" }, this.validateStatus === 'success' && (index.h("span", { key: 'b7af17e662a03db206209e6ac5fbb8e43630d2d5', role: "img", "aria-label": "check-circle", class: "anticon anticon-check-circle" }, index.h("svg", { key: '14772b5dbf639304b9fc6dc3fc64355a45ca880d', viewBox: "64 64 896 896", focusable: "false", "data-icon": "check-circle", width: "1em", height: "1em", fill: "currentColor", "aria-hidden": "true" }, index.h("path", { key: '1f5f902d9fd9cca98d5c6e0858a98bafcc346ae5', d: "M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm193.5 301.7l-210.6 292a31.8 31.8 0 01-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.2 0 19.9 4.9 25.9 13.3l71.2 98.8 157.2-218c6-8.3 15.6-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.5 12.7z" })))), this.validateStatus === 'error' && (index.h("span", { key: 'a26ddb33d965813b3b07c20579f96ea37a5ea5b7', role: "img", "aria-label": "close-circle", class: "anticon anticon-close-circle" }, index.h("svg", { key: 'c5a5ecb10bcbbb892a339747122e8245f0f19543', viewBox: "64 64 896 896", focusable: "false", "data-icon": "close-circle", width: "1em", height: "1em", fill: "currentColor", "aria-hidden": "true" }, index.h("path", { key: '5ad8e00a4a77691849eaede2b8a23baaf029805f', d: "M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 01-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z" })))), this.validateStatus === 'warning' && (index.h("span", { key: '7ebd6dd058a5c99ac84a9d2941d89638b2b1e52a', role: "img", "aria-label": "exclamation-circle", class: "anticon anticon-exclamation-circle" }, index.h("svg", { key: 'b3e076d376e5b977fa8a7a3aeed8e827d393e340', viewBox: "64 64 896 896", focusable: "false", "data-icon": "exclamation-circle", width: "1em", height: "1em", fill: "currentColor", "aria-hidden": "true" }, index.h("path", { key: '57965d3b6febe5754bff10a1971e2a6f7e6f742c', d: "M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 010-96 48.01 48.01 0 010 96z" })))), this.validateStatus === 'validating' && (index.h("span", { key: 'c6f937df1576cf819f82b781a51b4251327e58d0', role: "img", "aria-label": "loading", class: "anticon anticon-loading" }, index.h("svg", { key: '0ddc19bd99b81eb8d9cbfeef27713a84738821bc', viewBox: "0 0 1024 1024", focusable: "false", "data-icon": "loading", width: "1em", height: "1em", fill: "currentColor", "aria-hidden": "true", class: "anticon-spin" }, index.h("path", { key: '4170c00b2eb78bca579c05afcde8c6f74b2534f6', d: "M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z" }))))))), displayHelp && (index.h("div", { key: 'c0fee0d5924b829c6e83fdde04e6f6b8083763c6', class: "x-form-item-explain" }, index.h("div", { key: '95dfa6a1a8d9643934e09c13ec7266fd8e824df4', role: "alert" }, displayHelp))), this.extra && (index.h("div", { key: 'b71cc65d15e1eae8ce0a904d0db956c0f549dcce', class: "x-form-item-extra" }, this.extra))))));
-    }
-    static get watchers() { return {
-        "name": [{
-                "nameChanged": 0
-            }]
-    }; }
-};
-XFormItem.style = xFormItemCss();
-
-/**
- * X-Input-Number Types - Following Ant Design Specification
- */
-/**
- * Helper to validate if value is within range
- */
-/**
- * Helper to clamp value within range
- */
-function clampValue(value, min, max, precision) {
-    if (value === null || value === undefined || value === '') {
-        return value;
-    }
-    let numValue = typeof value === 'string' ? parseFloat(value) : value;
-    if (isNaN(numValue)) {
-        return null;
-    }
-    // Clamp to range
-    numValue = Math.min(Math.max(numValue, min), max);
-    // Apply precision
-    if (precision !== undefined && precision >= 0) {
-        numValue = parseFloat(numValue.toFixed(precision));
-    }
-    return numValue;
-}
-/**
- * Helper to format number with precision
- */
-function formatWithPrecision(value, precision) {
-    if (value === null || value === undefined || value === '') {
-        return '';
-    }
-    const numValue = typeof value === 'string' ? parseFloat(value) : value;
-    if (isNaN(numValue)) {
-        return '';
-    }
-    if (precision !== undefined && precision >= 0) {
-        return numValue.toFixed(precision);
-    }
-    return String(numValue);
-}
-/**
- * Helper to add step with precision handling
- */
-function addStep(value, step, direction, precision) {
-    let numValue = 0;
-    if (value !== null && value !== undefined && value !== '') {
-        numValue = typeof value === 'string' ? parseFloat(value) : value;
-        if (isNaN(numValue)) {
-            numValue = 0;
-        }
-    }
-    const offset = direction === 'up' ? step : -step;
-    let nextValue = numValue + offset;
-    // Handle floating point precision issues
-    if (precision !== undefined && precision >= 0) {
-        nextValue = parseFloat(nextValue.toFixed(precision));
-    }
-    else {
-        // Auto-detect precision from step
-        const stepStr = String(step);
-        const decimalIndex = stepStr.indexOf('.');
-        if (decimalIndex !== -1) {
-            const stepPrecision = stepStr.length - decimalIndex - 1;
-            nextValue = parseFloat(nextValue.toFixed(stepPrecision));
-        }
-    }
-    return nextValue;
-}
-
-const xInputNumberCss = () => `:root{--x-color-primary:#1677ff;--x-color-primary-rgb:22, 119, 255;--x-color-primary-contrast:#ffffff;--x-color-primary-contrast-rgb:255, 255, 255;--x-color-primary-shade:#0958d9;--x-color-primary-tint:#4096ff;--x-color-primary-bg:#e6f4ff;--x-color-primary-bg-hover:#bae0ff;--x-color-primary-border:#91caff;--x-color-primary-border-hover:#69b1ff;--x-color-primary-hover:#4096ff;--x-color-primary-active:#0958d9;--x-color-primary-text:#1677ff;--x-color-primary-text-hover:#4096ff;--x-color-primary-text-active:#0958d9;--x-color-secondary:#3dc2ff;--x-color-secondary-rgb:61, 194, 255;--x-color-secondary-contrast:#ffffff;--x-color-secondary-contrast-rgb:255, 255, 255;--x-color-secondary-shade:#36abe0;--x-color-secondary-tint:#50c8ff;--x-color-success:#52c41a;--x-color-success-rgb:82, 196, 26;--x-color-success-contrast:#ffffff;--x-color-success-contrast-rgb:255, 255, 255;--x-color-success-shade:#389e0d;--x-color-success-tint:#73d13d;--x-color-success-bg:#f6ffed;--x-color-success-bg-hover:#d9f7be;--x-color-success-border:#b7eb8f;--x-color-success-border-hover:#95de64;--x-color-success-hover:#73d13d;--x-color-success-active:#389e0d;--x-color-success-text:#52c41a;--x-color-success-text-hover:#73d13d;--x-color-success-text-active:#389e0d;--x-color-warning:#faad14;--x-color-warning-rgb:250, 173, 20;--x-color-warning-contrast:#000000;--x-color-warning-contrast-rgb:0, 0, 0;--x-color-warning-shade:#d48806;--x-color-warning-tint:#ffc53d;--x-color-warning-bg:#fffbe6;--x-color-warning-bg-hover:#fff1b8;--x-color-warning-border:#ffe58f;--x-color-warning-border-hover:#ffd666;--x-color-warning-hover:#ffc53d;--x-color-warning-active:#d48806;--x-color-warning-text:#faad14;--x-color-warning-text-hover:#ffc53d;--x-color-warning-text-active:#d48806;--x-color-danger:#ff4d4f;--x-color-danger-rgb:255, 77, 79;--x-color-danger-contrast:#ffffff;--x-color-danger-contrast-rgb:255, 255, 255;--x-color-danger-shade:#cf1322;--x-color-danger-tint:#ff7875;--x-color-error:#ff4d4f;--x-color-error-rgb:255, 77, 79;--x-color-error-bg:#fff2f0;--x-color-error-bg-hover:#ffccc7;--x-color-error-border:#ffa39e;--x-color-error-border-hover:#ff7875;--x-color-error-hover:#ff7875;--x-color-error-active:#d9363e;--x-color-error-text:#ff4d4f;--x-color-error-text-hover:#ff7875;--x-color-error-text-active:#d9363e;--x-color-info:#1677ff;--x-color-info-rgb:22, 119, 255;--x-color-info-bg:#e6f4ff;--x-color-info-bg-hover:#bae0ff;--x-color-info-border:#91caff;--x-color-info-border-hover:#69b1ff;--x-color-info-hover:#69b1ff;--x-color-info-active:#0958d9;--x-color-info-text:#1677ff;--x-color-info-text-hover:#69b1ff;--x-color-info-text-active:#0958d9;--x-color-text:rgba(0, 0, 0, 0.88);--x-color-text-secondary:rgba(0, 0, 0, 0.65);--x-color-text-tertiary:rgba(0, 0, 0, 0.45);--x-color-text-quaternary:rgba(0, 0, 0, 0.25);--x-color-text-disabled:rgba(0, 0, 0, 0.25);--x-color-text-placeholder:rgba(0, 0, 0, 0.25);--x-color-text-heading:rgba(0, 0, 0, 0.88);--x-color-text-label:rgba(0, 0, 0, 0.65);--x-color-text-description:rgba(0, 0, 0, 0.45);--x-color-text-light-solid:#ffffff;--x-color-bg-container:#ffffff;--x-color-bg-elevated:#ffffff;--x-color-bg-layout:#f5f5f5;--x-color-bg-spotlight:rgba(0, 0, 0, 0.85);--x-color-bg-mask:rgba(0, 0, 0, 0.45);--x-color-bg-base:#ffffff;--x-color-bg-container-disabled:#f5f5f5;--x-color-bg-container-loading:rgba(255, 255, 255, 0.65);--x-color-white:#ffffff;--x-color-fill:rgba(0, 0, 0, 0.15);--x-color-fill-secondary:rgba(0, 0, 0, 0.06);--x-color-fill-tertiary:rgba(0, 0, 0, 0.04);--x-color-fill-quaternary:rgba(0, 0, 0, 0.02);--x-color-border:#d9d9d9;--x-color-border-secondary:#f0f0f0;--x-color-border-bg:#ffffff;--x-color-split:rgba(5, 5, 5, 0.06);--x-color-dark:#222428;--x-color-dark-rgb:34, 36, 40;--x-color-dark-contrast:#ffffff;--x-color-dark-contrast-rgb:255, 255, 255;--x-color-dark-shade:#1e2023;--x-color-dark-tint:#383a3e;--x-color-medium:#92949c;--x-color-medium-rgb:146, 148, 156;--x-color-medium-contrast:#ffffff;--x-color-medium-contrast-rgb:255, 255, 255;--x-color-medium-shade:#808289;--x-color-medium-tint:#9d9fa6;--x-color-light:#f4f5f8;--x-color-light-rgb:244, 245, 248;--x-color-light-contrast:#000000;--x-color-light-contrast-rgb:0, 0, 0;--x-color-light-shade:#d7d8da;--x-color-light-tint:#f5f6f9;--x-font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--x-font-family-code:"SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;--x-font-size:14px;--x-font-size-sm:12px;--x-font-size-lg:16px;--x-font-size-xl:20px;--x-font-size-heading-1:38px;--x-font-size-heading-2:30px;--x-font-size-heading-3:24px;--x-font-size-heading-4:20px;--x-font-size-heading-5:16px;--x-line-height:1.5714285714285714;--x-line-height-lg:1.5;--x-line-height-sm:1.6666666666666667;--x-line-height-heading-1:1.2105263157894737;--x-line-height-heading-2:1.2666666666666666;--x-line-height-heading-3:1.3333333333333333;--x-line-height-heading-4:1.4;--x-line-height-heading-5:1.5;--x-font-weight-normal:400;--x-font-weight-medium:500;--x-font-weight-semibold:600;--x-font-weight-strong:600;--x-font-size-base:14px;--x-font-size-xxl:24px;--x-line-height-base:1.5714285714285714;--x-spacing-xxs:4px;--x-spacing-xs:8px;--x-spacing-sm:12px;--x-spacing-md:16px;--x-spacing-lg:20px;--x-spacing-xl:24px;--x-spacing-xxl:32px;--x-spacing-xxxl:48px;--x-margin-xxs:4px;--x-margin-xs:8px;--x-margin-sm:12px;--x-margin-md:16px;--x-margin-lg:24px;--x-margin-xl:32px;--x-margin-xxl:48px;--x-padding-xxs:4px;--x-padding-xs:8px;--x-padding-sm:12px;--x-padding-md:16px;--x-padding-lg:24px;--x-padding-content-horizontal-lg:24px;--x-padding-content-vertical-lg:12px;--x-padding-content-horizontal:16px;--x-padding-content-vertical:12px;--x-padding-content-horizontal-sm:16px;--x-padding-content-vertical-sm:8px;--x-border-radius:6px;--x-border-radius-xs:2px;--x-border-radius-sm:4px;--x-border-radius-lg:8px;--x-border-radius-xl:12px;--x-border-radius-outer:4px;--x-border-radius-base:6px;--x-border-width:1px;--x-border-width-base:1px;--x-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-shadow-lg:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-box-shadow-popover-arrow:2px 2px 5px rgba(0, 0, 0, 0.05);--x-box-shadow-card:0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);--x-box-shadow-drawer-right:-6px 0 16px 0 rgba(0, 0, 0, 0.08), -3px 0 6px -4px rgba(0, 0, 0, 0.12), -9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-left:6px 0 16px 0 rgba(0, 0, 0, 0.08), 3px 0 6px -4px rgba(0, 0, 0, 0.12), 9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-up:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-down:0 -6px 16px 0 rgba(0, 0, 0, 0.08), 0 -3px 6px -4px rgba(0, 0, 0, 0.12), 0 -9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tabs-overflow-left:inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-right:inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-top:inset 0 10px 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-bottom:inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08);--x-motion-duration-fast:0.1s;--x-motion-duration-mid:0.2s;--x-motion-duration-slow:0.3s;--x-motion-ease-in-out:cubic-bezier(0.645, 0.045, 0.355, 1);--x-motion-ease-out:cubic-bezier(0.215, 0.61, 0.355, 1);--x-motion-ease-in:cubic-bezier(0.55, 0.055, 0.675, 0.19);--x-motion-ease-out-back:cubic-bezier(0.12, 0.4, 0.29, 1.46);--x-motion-ease-in-back:cubic-bezier(0.71, -0.46, 0.88, 0.6);--x-motion-ease-in-out-circle:cubic-bezier(0.78, 0.14, 0.15, 0.86);--x-motion-ease-out-circle:cubic-bezier(0.08, 0.82, 0.17, 1);--x-motion-ease-in-circle:cubic-bezier(0.6, 0.04, 0.98, 0.34);--x-motion-ease-in-quint:cubic-bezier(0.755, 0.05, 0.855, 0.06);--x-motion-ease-out-quint:cubic-bezier(0.23, 1, 0.32, 1);--x-z-index-base:0;--x-z-index-popup-base:1000;--x-z-index-popup:1030;--x-z-index-affix:10;--x-z-index-modal:1000;--x-z-index-modal-mask:1000;--x-z-index-drawer:1000;--x-z-index-popover:1030;--x-z-index-dropdown:1050;--x-z-index-tooltip:1070;--x-z-index-notification:1080;--x-z-index-message:1090;--x-z-index-popconfirm:1060;--x-z-index-table-fixed:10;--x-opacity-loading:0.65;--x-opacity-image:1;--x-opacity-disabled:0.5;--x-control-height:32px;--x-control-height-xs:24px;--x-control-height-sm:24px;--x-control-height-lg:40px;--x-control-radio-size:16px;--x-control-checkbox-size:16px;--x-control-padding-horizontal:12px;--x-control-padding-horizontal-sm:8px;--x-control-outline-width:2px;--x-control-outline:rgba(5, 145, 255, 0.1);--x-control-item-bg-hover:rgba(0, 0, 0, 0.04);--x-control-item-bg-active:#e6f4ff;--x-control-item-bg-active-hover:#bae0ff;--x-control-item-bg-active-disabled:rgba(0, 0, 0, 0.15);--x-control-tmp-outline:rgba(0, 0, 0, 0.02);--x-color-yellow:#fadb14;--x-color-yellow-rgb:250, 219, 20;--x-font-family-base:var(--x-font-family);--x-color-link:#1677ff;--x-color-link-hover:#69b1ff;--x-color-link-active:#0958d9;--x-color-icon:rgba(0, 0, 0, 0.45);--x-color-icon-hover:rgba(0, 0, 0, 0.88);--x-color-highlight:#ff4d4f;--x-color-bg-text-hover:rgba(0, 0, 0, 0.06);--x-color-bg-text-active:rgba(0, 0, 0, 0.15);--x-screen-xs:480px;--x-screen-xs-min:480px;--x-screen-xs-max:575px;--x-screen-sm:576px;--x-screen-sm-min:576px;--x-screen-sm-max:767px;--x-screen-md:768px;--x-screen-md-min:768px;--x-screen-md-max:991px;--x-screen-lg:992px;--x-screen-lg-min:992px;--x-screen-lg-max:1199px;--x-screen-xl:1200px;--x-screen-xl-min:1200px;--x-screen-xl-max:1599px;--x-screen-xxl:1600px;--x-screen-xxl-min:1600px;--x-color-fill-content:rgba(0, 0, 0, 0.06);--x-color-fill-content-hover:rgba(0, 0, 0, 0.15);--x-color-fill-alter:rgba(0, 0, 0, 0.02);--x-scrollbar-width:12px;--x-scrollbar-track-bg:rgba(0, 0, 0, 0.04);--x-scrollbar-thumb-bg:rgba(0, 0, 0, 0.25);--x-scrollbar-thumb-bg-hover:rgba(0, 0, 0, 0.35);--x-menu-dark-bg:#001529;--x-menu-dark-item-bg:#001529;--x-menu-dark-popup-bg:#001529;--x-menu-dark-submenu-item-bg:#000c17}:host{display:-ms-inline-flexbox;display:inline-flex;width:100%;font-size:var(--x-input-number-font-size, var(--x-control-font-size, var(--x-font-size-base, 14px)));line-height:var(--x-input-number-line-height, var(--x-line-height-base, 1.5714285714));color:var(--x-input-number-color, var(--x-control-color, var(--x-color-text, rgba(0, 0, 0, 0.88))));-webkit-box-sizing:border-box;box-sizing:border-box}:host(.x-input-number-small){width:100%;font-size:var(--x-input-number-font-size-sm, var(--x-font-size-base, 14px))}:host(.x-input-number-large){width:100%;font-size:var(--x-input-number-font-size-lg, var(--x-font-size-lg, 16px))}.x-input-number-wrapper{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;width:100%;min-width:0;padding:0 var(--x-control-padding-horizontal, var(--x-spacing-md, 12px));min-height:var(--x-control-height, var(--x-size-control-height, 32px));background-color:var(--x-control-bg, var(--x-color-bg-container, #ffffff));border:var(--x-control-border-width, var(--x-border-width-base, 1px)) solid var(--x-control-border-color, var(--x-color-border, #d9d9d9));border-radius:var(--x-control-border-radius, var(--x-border-radius-base, 6px));-webkit-transition:all 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);transition:all 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);-webkit-box-sizing:border-box;box-sizing:border-box}.x-input-number-wrapper:hover:not(.disabled):not([disabled]):not([class*=-disabled]){border-color:var(--x-control-border-color-hover, var(--x-color-primary-hover, #4096ff))}.x-input-number-wrapper.focused:not(.disabled):not([disabled]):not([class*=-disabled]),.x-input-number-wrapper:focus-within:not(.disabled):not([disabled]):not([class*=-disabled]){border-color:var(--x-control-border-color-focus, var(--x-color-primary, #1677ff)) !important;-webkit-box-shadow:0 0 0 3px var(--x-color-primary-bg, rgba(22, 119, 255, 0.06));box-shadow:0 0 0 3px var(--x-color-primary-bg, rgba(22, 119, 255, 0.06));z-index:1;outline:none}.x-input-number-wrapper{display:-ms-inline-flexbox;display:inline-flex;padding:0;background-color:var(--x-input-number-bg, var(--x-control-bg, var(--x-color-bg-container, #ffffff)))}.x-input-number-wrapper:hover .x-input-number-handler-wrap{opacity:1}.x-input-number-wrapper.x-input-number-focused .x-input-number-handler-wrap{opacity:1}.x-input-number-wrapper.x-input-number-disabled.disabled,.x-input-number-wrapper.x-input-number-disabled[disabled],.x-input-number-wrapper.x-input-number-disabled[class*=-disabled]{background-color:var(--x-control-bg-disabled, var(--x-color-bg-container-disabled, rgba(0, 0, 0, 0.04)));border-color:var(--x-control-border-color-disabled, var(--x-color-border, #d9d9d9));color:var(--x-control-color-disabled, var(--x-color-text-disabled, rgba(0, 0, 0, 0.25)));cursor:not-allowed}.x-input-number-wrapper.x-input-number-disabled.disabled:hover,.x-input-number-wrapper.x-input-number-disabled[disabled]:hover,.x-input-number-wrapper.x-input-number-disabled[class*=-disabled]:hover{border-color:var(--x-control-border-color-disabled, var(--x-color-border, #d9d9d9)) !important}.x-input-number-wrapper.x-input-number-disabled .x-input-number-input{color:var(--x-input-number-disabled-color, var(--x-control-color-disabled, var(--x-color-text-disabled, rgba(0, 0, 0, 0.25))));cursor:not-allowed}.x-input-number-wrapper.x-input-number-disabled .x-input-number-handler-wrap{display:none}.x-input-number-wrapper.x-input-number-readonly .x-input-number-handler-wrap{display:none}.x-input-number-wrapper.x-input-number-out-of-range .x-input-number-input{color:var(--x-input-number-out-of-range-color, var(--x-color-error, #ff4d4f))}.x-input-number-wrapper.x-input-number-status-error{border-color:var(--x-control-border-color-error, var(--x-color-error, #ff4d4f))}.x-input-number-wrapper.x-input-number-status-error:hover:not(.disabled):not([disabled]){border-color:var(--x-control-border-color-error-hover, var(--x-color-error-hover, #ff7875))}.x-input-number-wrapper.x-input-number-status-error.focused,.x-input-number-wrapper.x-input-number-status-error:focus-within{border-color:var(--x-control-border-color-error, var(--x-color-error, #ff4d4f));-webkit-box-shadow:0 0 0 3px var(--x-control-focus-shadow-error-color, var(--x-color-error-bg, rgba(255, 38, 5, 0.06)));box-shadow:0 0 0 3px var(--x-control-focus-shadow-error-color, var(--x-color-error-bg, rgba(255, 38, 5, 0.06)))}.x-input-number-wrapper.x-input-number-status-warning{border-color:var(--x-control-border-color-warning, var(--x-color-warning, #faad14))}.x-input-number-wrapper.x-input-number-status-warning:hover:not(.disabled):not([disabled]){border-color:var(--x-control-border-color-warning-hover, var(--x-color-warning-hover, #ffc53d))}.x-input-number-wrapper.x-input-number-status-warning.focused,.x-input-number-wrapper.x-input-number-status-warning:focus-within{border-color:var(--x-control-border-color-warning, var(--x-color-warning, #faad14));-webkit-box-shadow:0 0 0 3px var(--x-control-focus-shadow-warning-color, var(--x-color-warning-bg, rgba(255, 215, 5, 0.1)));box-shadow:0 0 0 3px var(--x-control-focus-shadow-warning-color, var(--x-color-warning-bg, rgba(255, 215, 5, 0.1)))}.x-input-number-wrapper.x-input-number-borderless{background-color:transparent;border-color:transparent;-webkit-box-shadow:none;box-shadow:none}.x-input-number-wrapper.x-input-number-borderless:hover{border-color:transparent}.x-input-number-wrapper.x-input-number-borderless.focused,.x-input-number-wrapper.x-input-number-borderless:focus-within{border-color:transparent;-webkit-box-shadow:none;box-shadow:none}.x-input-number-wrapper.x-input-number-filled{background-color:var(--x-color-fill-tertiary, rgba(0, 0, 0, 0.04));border-color:transparent}.x-input-number-wrapper.x-input-number-filled:hover:not(.disabled):not([disabled]){background-color:var(--x-color-fill-secondary, rgba(0, 0, 0, 0.06));border-color:transparent}.x-input-number-wrapper.x-input-number-filled.focused,.x-input-number-wrapper.x-input-number-filled:focus-within{background-color:var(--x-control-bg, var(--x-color-bg-container, #ffffff));border-color:var(--x-control-border-color-focus, var(--x-color-primary, #1677ff))}.x-input-number-input-wrap{-ms-flex:1;flex:1;min-width:0}.x-input-number-input{width:100%;height:var(--x-input-number-height, var(--x-control-height, var(--x-size-control-height, 32px)));padding:var(--x-input-number-padding-vertical, var(--x-control-padding-vertical, 4px)) var(--x-input-number-padding-horizontal, var(--x-control-padding-horizontal, 11px));background-color:transparent;border:none;border-radius:var(--x-input-number-border-radius, var(--x-border-radius-base, 6px));outline:none;color:inherit;font-size:inherit;line-height:inherit;text-align:left;-webkit-transition:all var(--x-input-number-motion-duration, var(--x-motion-duration-mid, 0.2s)) var(--x-input-number-motion-ease, var(--x-motion-ease-in-out, cubic-bezier(0.645, 0.045, 0.355, 1)));transition:all var(--x-input-number-motion-duration, var(--x-motion-duration-mid, 0.2s)) var(--x-input-number-motion-ease, var(--x-motion-ease-in-out, cubic-bezier(0.645, 0.045, 0.355, 1)));-webkit-box-sizing:border-box;box-sizing:border-box;-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}.x-input-number-input::-webkit-inner-spin-button,.x-input-number-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.x-input-number-input::-webkit-input-placeholder{color:var(--x-input-number-placeholder-color, var(--x-control-placeholder-color, var(--x-color-text-placeholder, rgba(0, 0, 0, 0.25))))}.x-input-number-input::-moz-placeholder{color:var(--x-input-number-placeholder-color, var(--x-control-placeholder-color, var(--x-color-text-placeholder, rgba(0, 0, 0, 0.25))))}.x-input-number-input:-ms-input-placeholder{color:var(--x-input-number-placeholder-color, var(--x-control-placeholder-color, var(--x-color-text-placeholder, rgba(0, 0, 0, 0.25))))}.x-input-number-input::-ms-input-placeholder{color:var(--x-input-number-placeholder-color, var(--x-control-placeholder-color, var(--x-color-text-placeholder, rgba(0, 0, 0, 0.25))))}.x-input-number-input::placeholder{color:var(--x-input-number-placeholder-color, var(--x-control-placeholder-color, var(--x-color-text-placeholder, rgba(0, 0, 0, 0.25))))}.x-input-number-small .x-input-number-input{height:var(--x-input-number-height-sm, var(--x-control-height-sm, var(--x-size-control-height-sm, 24px)));padding:0 var(--x-input-number-padding-horizontal-sm, var(--x-control-padding-horizontal-sm, 7px))}.x-input-number-small{border-radius:var(--x-input-number-border-radius-sm, var(--x-border-radius-sm, 4px))}.x-input-number-small .x-input-number-handler-wrap{width:var(--x-input-number-handler-width-sm, 18px)}.x-input-number-large .x-input-number-input{height:var(--x-input-number-height-lg, var(--x-control-height-lg, var(--x-size-control-height-lg, 40px)));padding:var(--x-input-number-padding-vertical, var(--x-control-padding-vertical, 4px)) var(--x-input-number-padding-horizontal-lg, var(--x-control-padding-horizontal, 11px));font-size:var(--x-input-number-font-size-lg, var(--x-font-size-lg, 16px))}.x-input-number-large{border-radius:var(--x-input-number-border-radius-lg, var(--x-border-radius-lg, 8px))}.x-input-number-large .x-input-number-handler-wrap{width:var(--x-input-number-handler-width-lg, 24px)}.x-input-number-handler-wrap{position:absolute;top:0;right:0;width:var(--x-input-number-handler-width, 22px);height:100%;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;background-color:var(--x-input-number-handler-bg, var(--x-color-bg-container, #fff));border-left:var(--x-input-number-border-width, var(--x-control-border-width, var(--x-border-width-base, 1px))) solid var(--x-input-number-handler-border-color, var(--x-color-border, #d9d9d9));border-radius:0 var(--x-input-number-border-radius, var(--x-border-radius-base, 6px)) var(--x-input-number-border-radius, var(--x-border-radius-base, 6px)) 0;opacity:0;-webkit-transition:opacity var(--x-input-number-motion-duration-fast, var(--x-motion-duration-fast, 0.1s)) ease;transition:opacity var(--x-input-number-motion-duration-fast, var(--x-motion-duration-fast, 0.1s)) ease;overflow:hidden}.x-input-number-handler{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-ms-flex:1;flex:1;height:50%;color:var(--x-input-number-handler-color, var(--x-color-text-tertiary, rgba(0, 0, 0, 0.45)));font-size:7px;cursor:pointer;-webkit-transition:all var(--x-input-number-motion-duration-fast, var(--x-motion-duration-fast, 0.1s)) var(--x-input-number-motion-ease, var(--x-motion-ease-in-out, cubic-bezier(0.645, 0.045, 0.355, 1)));transition:all var(--x-input-number-motion-duration-fast, var(--x-motion-duration-fast, 0.1s)) var(--x-input-number-motion-ease, var(--x-motion-ease-in-out, cubic-bezier(0.645, 0.045, 0.355, 1)));-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.x-input-number-handler:hover{height:60%;color:var(--x-input-number-handler-color-hover, var(--x-color-primary, #1677ff))}.x-input-number-handler:active{background-color:var(--x-input-number-handler-active-bg, var(--x-color-fill-alter, rgba(0, 0, 0, 0.02)))}.x-input-number-handler.x-input-number-handler-disabled{color:var(--x-input-number-disabled-color, var(--x-control-color-disabled, var(--x-color-text-disabled, rgba(0, 0, 0, 0.25))));cursor:not-allowed}.x-input-number-handler.x-input-number-handler-disabled:hover{height:50%;color:var(--x-input-number-disabled-color, var(--x-control-color-disabled, var(--x-color-text-disabled, rgba(0, 0, 0, 0.25))))}.x-input-number-handler-up{border-bottom:var(--x-input-number-border-width, var(--x-control-border-width, var(--x-border-width-base, 1px))) solid var(--x-input-number-handler-border-color, var(--x-color-border, #d9d9d9));border-radius:0 var(--x-input-number-border-radius, var(--x-border-radius-base, 6px)) 0 0}.x-input-number-handler-down{border-radius:0 0 var(--x-input-number-border-radius, var(--x-border-radius-base, 6px)) 0}.x-input-number-handler-up-inner,.x-input-number-handler-down-inner{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:12px;height:12px}.x-input-number-handler-up-inner svg,.x-input-number-handler-down-inner svg{width:1em;height:1em}.x-input-number-prefix,.x-input-number-suffix{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;color:var(--x-input-number-color, var(--x-control-color, var(--x-color-text, rgba(0, 0, 0, 0.88))))}.x-input-number-prefix{padding-left:var(--x-input-number-padding-horizontal, var(--x-control-padding-horizontal, 11px))}.x-input-number-suffix{padding-right:var(--x-input-number-padding-horizontal, var(--x-control-padding-horizontal, 11px))}.x-input-number-has-affix .x-input-number-input{padding-left:8px;padding-right:8px}.x-input-number-group-addon{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding:0 12px;background-color:var(--x-input-number-addon-bg, var(--x-color-fill-alter, rgba(0, 0, 0, 0.02)));border:var(--x-input-number-border-width, var(--x-control-border-width, var(--x-border-width-base, 1px))) solid var(--x-input-number-border-color, var(--x-control-border-color, var(--x-color-border, #d9d9d9)));color:var(--x-input-number-addon-color, var(--x-color-text, rgba(0, 0, 0, 0.88)));font-size:var(--x-input-number-font-size, var(--x-control-font-size, var(--x-font-size-base, 14px)));white-space:nowrap;-webkit-transition:all var(--x-input-number-motion-duration, var(--x-motion-duration-mid, 0.2s)) var(--x-input-number-motion-ease, var(--x-motion-ease-in-out, cubic-bezier(0.645, 0.045, 0.355, 1)));transition:all var(--x-input-number-motion-duration, var(--x-motion-duration-mid, 0.2s)) var(--x-input-number-motion-ease, var(--x-motion-ease-in-out, cubic-bezier(0.645, 0.045, 0.355, 1)))}.x-input-number-group-addon-before{border-right:0;border-radius:var(--x-input-number-border-radius, var(--x-border-radius-base, 6px)) 0 0 var(--x-input-number-border-radius, var(--x-border-radius-base, 6px))}.x-input-number-group-addon-after{border-left:0;border-radius:0 var(--x-input-number-border-radius, var(--x-border-radius-base, 6px)) var(--x-input-number-border-radius, var(--x-border-radius-base, 6px)) 0}.x-input-number-has-addon{border-radius:0}:host:has(.x-input-number-group-addon-before) .x-input-number-wrapper{border-top-left-radius:0;border-bottom-left-radius:0}:host:has(.x-input-number-group-addon-after) .x-input-number-wrapper{border-top-right-radius:0;border-bottom-right-radius:0}`;
-
-const XInputNumber = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.xChange = index.createEvent(this, "xChange", 7);
-        this.xPressEnter = index.createEvent(this, "xPressEnter", 7);
-        this.xStep = index.createEvent(this, "xStep", 7);
-        this.xFocus = index.createEvent(this, "xFocus", 7);
-        this.xBlur = index.createEvent(this, "xBlur", 7);
-    }
-    get el() { return index.getElement(this); }
-    // ==================== Props ====================
-    /**
-     * The label text displayed after (on the right side of) the input field
-     * @example
-     * <x-input-number addonAfter="USD"></x-input-number>
-     */
-    addonAfter;
-    /**
-     * The label text displayed before (on the left side of) the input field
-     * @example
-     * <x-input-number addonBefore="$"></x-input-number>
-     */
-    addonBefore;
-    /**
-     * Whether to get focus when component mounted
-     * @default false
-     * @example
-     * <x-input-number autoFocus></x-input-number>
-     */
-    autoFocus = false;
-    /**
-     * Whether to show +/- controls
-     * @default true
-     * @example
-     * <x-input-number controls={false}></x-input-number>
-     */
-    controls = true;
-    /**
-     * Custom decimal separator
-     * @example
-     * <x-input-number decimalSeparator=","></x-input-number>
-     */
-    decimalSeparator;
-    /**
-     * Default value
-     * @example
-     * <x-input-number defaultValue={3}></x-input-number>
-     */
-    defaultValue;
-    /**
-     * Whether the input is disabled
-     * @default false
-     * @example
-     * <x-input-number disabled></x-input-number>
-     */
-    disabled = false;
-    /**
-     * Specifies the format of the value presented
-     * @example
-     * <x-input-number formatter={(v) => `$${v}`}></x-input-number>
-     */
-    formatter;
-    /**
-     * Whether to enable keyboard behavior
-     * @default true
-     * @example
-     * <x-input-number keyboard={false}></x-input-number>
-     */
-    keyboard = true;
-    /**
-     * The max value
-     * @default Number.MAX_SAFE_INTEGER
-     * @example
-     * <x-input-number max={100}></x-input-number>
-     */
-    max = Number.MAX_SAFE_INTEGER;
-    /**
-     * The min value
-     * @default Number.MIN_SAFE_INTEGER
-     * @example
-     * <x-input-number min={0}></x-input-number>
-     */
-    min = Number.MIN_SAFE_INTEGER;
-    /**
-     * Specifies the value extracted from formatter
-     * @example
-     * <x-input-number parser={(v) => v.replace(/[^\d.]/g, '')}></x-input-number>
-     */
-    parser;
-    /**
-     * Placeholder text
-     * @example
-     * <x-input-number placeholder="Amount"></x-input-number>
-     */
-    placeholder;
-    /**
-     * The precision of input value
-     * @example
-     * <x-input-number precision={2}></x-input-number>
-     */
-    precision;
-    /**
-     * The prefix icon/text for the Input
-     * @example
-     * <x-input-number prefixIcon="calculate"></x-input-number>
-     */
-    prefixIcon;
-    /**
-     * Whether the input is read only
-     * @default false
-     * @example
-     * <x-input-number readOnly></x-input-number>
-     */
-    readOnly = false;
-    /**
-     * The size of the input box
-     * @default 'middle'
-     * @example
-     * <x-input-number size="small"></x-input-number>
-     */
-    size = 'middle';
-    /**
-     * Set validation status
-     * @example
-     * <x-input-number status="error"></x-input-number>
-     */
-    status;
-    /**
-     * The number to which the current value is increased or decreased
-     * @default 1
-     * @example
-     * <x-input-number step={0.5}></x-input-number>
-     */
-    step = 1;
-    /**
-     * Set value as string to support high precision decimals
-     * @default false
-     * @example
-     * <x-input-number stringMode></x-input-number>
-     */
-    stringMode = false;
-    /**
-     * The suffix icon/text for the Input
-     * @example
-     * <x-input-number suffix="kg"></x-input-number>
-     */
-    suffix;
-    /**
-     * Current value
-     * @example
-     * <x-input-number value={10}></x-input-number>
-     */
-    value;
-    /**
-     * Variants of Input
-     * @default 'outlined'
-     * @example
-     * <x-input-number variant="filled"></x-input-number>
-     */
-    variant = 'outlined';
-    /**
-     * Enable wheel to change value
-     * @default false
-     * @example
-     * <x-input-number changeOnWheel></x-input-number>
-     */
-    changeOnWheel = false;
-    /**
-     * Custom class names
-     * @example
-     * <x-input-number classNames={{ root: 'my-input-number' }}></x-input-number>
-     */
-    classNames;
-    /**
-     * Custom styles
-     * @example
-     * <x-input-number styles={{ root: { width: '200px' } }}></x-input-number>
-     */
-    styles;
-    // ==================== Events ====================
-    /**
-     * Emitted when value is changed
-     * @example
-     * <x-input-number onXChange={(ev) => console.log(ev.detail)}></x-input-number>
-     */
-    xChange;
-    /**
-     * Emitted when the user presses Enter
-     * @example
-     * <x-input-number onXPressEnter={(ev) => console.log(ev.key)}></x-input-number>
-     */
-    xPressEnter;
-    /**
-     * Emitted when step button is clicked
-     * @example
-     * <x-input-number onXStep={(ev) => console.log(ev.detail)}></x-input-number>
-     */
-    xStep;
-    /**
-     * Emitted when input gets focus
-     * @example
-     * <x-input-number onXFocus={(ev) => console.log(ev)}></x-input-number>
-     */
-    xFocus;
-    /**
-     * Emitted when input loses focus
-     * @example
-     * <x-input-number onXBlur={(ev) => console.log(ev)}></x-input-number>
-     */
-    xBlur;
-    // ==================== State ====================
-    /**
-     * Focus state.
-     */
-    focused = false;
-    /**
-     * Display value in input.
-     */
-    inputValue = '';
-    /**
-     * Typing state to avoid clamping mid-typing.
-     */
-    isTyping = false;
-    // ==================== Private Properties ====================
-    /**
-     * Input element reference.
-     */
-    inputRef;
-    /**
-     * Timer for long-press stepping.
-     */
-    holdTimer;
-    // ==================== Lifecycle ====================
-    /**
-     * Initialize value before render.
-     * @returns void
-     */
-    componentWillLoad() {
-        // Initialize value
-        if (this.value === undefined && this.defaultValue !== undefined) {
-            this.value = this.defaultValue;
-        }
-        this.updateInputValue();
-    }
-    /**
-     * Auto focus on mount when enabled.
-     * @returns void
-     */
-    componentDidLoad() {
-        if (this.autoFocus && this.inputRef) {
-            this.inputRef.focus();
-        }
-    }
-    /**
-     * Cleanup timers on disconnect.
-     * @returns void
-     */
-    disconnectedCallback() {
-        if (this.holdTimer) {
-            clearInterval(this.holdTimer);
-        }
-    }
-    // ==================== Watchers ====================
-    /**
-     * Sync input display when value changes.
-     * @returns void
-     */
-    handleValueChange() {
-        if (!this.isTyping) {
-            this.updateInputValue();
-        }
-    }
-    // ==================== Public Methods ====================
-    /**
-     * Focus the input element
-     * @returns Promise<void>
-     * @example
-     * await el.setFocus()
-     */
-    async setFocus() {
-        this.inputRef?.focus();
-    }
-    /**
-     * Remove focus from the input element
-     * @returns Promise<void>
-     * @example
-     * await el.setBlur()
-     */
-    async setBlur() {
-        this.inputRef?.blur();
-    }
-    // ==================== Private Methods ====================
-    /**
-     * Update formatted input display value.
-     *
-     * Flow:
-     * 1. Checks if `value` is valid.
-     * 2. Formats value using `formatter` prop or default `formatWithPrecision`.
-     * 3. Replaces decimal separator if custom one is provided.
-     * 4. Updates `inputValue` state (which is displayed in the input).
-     *
-     * @returns void
-     */
-    updateInputValue() {
-        let displayValue = '';
-        if (this.value !== null && this.value !== undefined && this.value !== '') {
-            if (this.formatter) {
-                displayValue = this.formatter(this.value, {
-                    userTyping: this.isTyping,
-                    input: this.inputValue,
-                });
-            }
-            else {
-                displayValue = formatWithPrecision(this.value, this.precision);
-            }
-            // Apply custom decimal separator
-            if (this.decimalSeparator && this.decimalSeparator !== '.') {
-                displayValue = displayValue.replace('.', this.decimalSeparator);
-            }
-        }
-        this.inputValue = displayValue;
-    }
-    /**
-     * Parse input string into numeric value.
-     *
-     * Flow:
-     * 1. Handles empty or invalid inputs.
-     * 2. Applies `parser` prop if provided.
-     * 3. Normalizes custom decimal separator to dot.
-     * 4. Removes non-numeric characters.
-     * 5. Parses string to float.
-     *
-     * @param input - Input string.
-     * @returns InputNumberValue
-     */
-    parseValue(input) {
-        if (!input || input === '' || input === '-') {
-            return null;
-        }
-        let value = input;
-        // Apply parser if provided
-        if (this.parser) {
-            return this.parser(value);
-        }
-        // Replace custom decimal separator
-        if (this.decimalSeparator && this.decimalSeparator !== '.') {
-            value = value.replace(new RegExp(`\\${this.decimalSeparator}`, 'g'), '.');
-        }
-        // Remove non-numeric characters
-        value = value.replace(/[^\d.-]/g, '');
-        const numValue = parseFloat(value);
-        return isNaN(numValue) ? null : numValue;
-    }
-    /**
-     * Handle input change and emit events.
-     *
-     * Flow:
-     * 1. Updates `inputValue` state from target.
-     * 2. Sets `isTyping` flag to true (prevents auto-formatting while typing).
-     * 3. Parses value.
-     * 4. Updates `value` state (without clamping, to allow intermediate invalid states while typing).
-     * 5. Emits `xChange` event.
-     *
-     * @param e - Input event.
-     * @returns void
-     */
-    handleInput = (e) => {
-        const target = e.target;
-        this.inputValue = target.value;
-        this.isTyping = true;
-        const parsedValue = this.parseValue(target.value);
-        if (parsedValue !== null) {
-            // Don't clamp while typing, just update value
-            this.value = this.stringMode ? String(parsedValue) : parsedValue;
-            this.xChange.emit({ value: this.value });
-        }
-    };
-    /**
-     * Handle input focus.
-     * @param e - Focus event.
-     * @returns void
-     */
-    handleFocus = (e) => {
-        this.focused = true;
-        this.xFocus.emit(e);
-    };
-    /**
-     * Handle input blur and clamp value.
-     * @param e - Focus event.
-     * @returns void
-     */
-    handleBlur = (e) => {
-        this.focused = false;
-        this.isTyping = false;
-        // Validate and clamp value on blur
-        let finalValue = this.value;
-        if (finalValue !== null && finalValue !== undefined && finalValue !== '') {
-            finalValue = clampValue(finalValue, this.min, this.max, this.precision);
-        }
-        if (finalValue !== this.value) {
-            this.value = finalValue;
-            this.xChange.emit({ value: this.value });
-        }
-        this.updateInputValue();
-        this.xBlur.emit(e);
-    };
-    /**
-     * Handle keyboard input and stepping.
-     * @param e - Keyboard event.
-     * @returns void
-     */
-    handleKeyDown = (e) => {
-        if (e.key === 'Enter') {
-            this.xPressEnter.emit(e);
-            this.handleBlur(e);
-        }
-        else if (this.keyboard) {
-            if (e.key === 'ArrowUp') {
-                e.preventDefault();
-                this.handleStep('up');
-            }
-            else if (e.key === 'ArrowDown') {
-                e.preventDefault();
-                this.handleStep('down');
-            }
-        }
-    };
-    /**
-     * Handle mouse wheel for stepping.
-     * @param e - Wheel event.
-     * @returns void
-     */
-    handleWheel = (e) => {
-        if (!this.changeOnWheel || !this.focused || this.disabled || this.readOnly) {
-            return;
-        }
-        e.preventDefault();
-        if (e.deltaY < 0) {
-            this.handleStep('up');
-        }
-        else if (e.deltaY > 0) {
-            this.handleStep('down');
-        }
-    };
-    /**
-     * Handle step change.
-     *
-     * Flow:
-     * 1. Checks if disabled or readonly.
-     * 2. Calculates next value using `addStep`.
-     * 3. Clamps result within bounds.
-     * 4. Updates `value` and `inputValue`.
-     * 5. Emits `xChange` and `xStep` events.
-     *
-     * @param type - Step direction.
-     * @returns void
-     */
-    handleStep = (type) => {
-        if (this.disabled || this.readOnly)
-            return;
-        const nextValue = addStep(this.value, this.step, type, this.precision);
-        const clampedValue = clampValue(nextValue, this.min, this.max, this.precision);
-        if (clampedValue !== null) {
-            this.value = this.stringMode ? String(clampedValue) : clampedValue;
-            this.isTyping = false;
-            this.updateInputValue();
-            this.xChange.emit({ value: this.value });
-            this.xStep.emit({
-                value: this.value,
-                offset: type === 'up' ? this.step : -this.step,
-                type,
-            });
-        }
-    };
-    /**
-     * Handle step button press and start repeat.
-     * @param type - Step direction.
-     * @param e - Mouse event.
-     * @returns void
-     */
-    handleStepMouseDown = (type, e) => {
-        e.preventDefault();
-        this.handleStep(type);
-        // Long press handling
-        let delay = 600;
-        const repeatStep = () => {
-            this.handleStep(type);
-            delay = Math.max(50, delay * 0.9);
-            this.holdTimer = window.setTimeout(repeatStep, delay);
-        };
-        this.holdTimer = window.setTimeout(repeatStep, delay);
-    };
-    /**
-     * Stop long-press stepping.
-     * @returns void
-     */
-    handleStepMouseUp = () => {
-        if (this.holdTimer) {
-            clearTimeout(this.holdTimer);
-            this.holdTimer = undefined;
-        }
-    };
-    /**
-     * Check if step-up is disabled.
-     * @returns boolean
-     */
-    isUpDisabled() {
-        if (this.disabled || this.readOnly)
-            return true;
-        const numValue = typeof this.value === 'string' ? parseFloat(this.value) : this.value;
-        return numValue !== null && numValue !== undefined && !isNaN(numValue) && numValue >= this.max;
-    }
-    /**
-     * Check if step-down is disabled.
-     * @returns boolean
-     */
-    isDownDisabled() {
-        if (this.disabled || this.readOnly)
-            return true;
-        const numValue = typeof this.value === 'string' ? parseFloat(this.value) : this.value;
-        return numValue !== null && numValue !== undefined && !isNaN(numValue) && numValue <= this.min;
-    }
-    /**
-     * Check if current value is out of range.
-     * @returns boolean
-     */
-    isOutOfRange() {
-        if (this.value === null || this.value === undefined || this.value === '') {
-            return false;
-        }
-        const numValue = typeof this.value === 'string' ? parseFloat(this.value) : this.value;
-        if (isNaN(numValue))
-            return false;
-        return numValue < this.min || numValue > this.max;
-    }
-    // ==================== Render ====================
-    /**
-     * Render up icon.
-     * @returns JSX.Element
-     */
-    renderUpIcon() {
-        return (
-        // <svg viewBox="64 64 896 896" focusable="false" width="1em" height="1em" fill="currentColor">
-        //   <path d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z" />
-        // </svg>
-        index.h("x-icon", { name: config.getIcon('arrowUp') }));
-    }
-    /**
-     * Render down icon.
-     * @returns JSX.Element
-     */
-    renderDownIcon() {
-        return (
-        // <svg viewBox="64 64 896 896" focusable="false" width="1em" height="1em" fill="currentColor">
-        //   <path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z" />
-        // </svg>
-        index.h("x-icon", { name: config.getIcon('arrowDown') }));
-    }
-    /**
-     * Render input number with controls.
-     * @returns JSX.Element
-     * @example
-     * <x-input-number min={0} max={10} step={1}></x-input-number>
-     */
-    render() {
-        const hasAddon = !!this.addonBefore || !!this.addonAfter;
-        const hasAffix = !!this.prefixIcon || !!this.suffix;
-        const wrapperClasses = {
-            'x-input-number-wrapper': true,
-            'x-input-number-focused': this.focused,
-            'x-input-number-disabled': this.disabled,
-            'x-input-number-readonly': this.readOnly,
-            'disabled': this.disabled,
-            'readonly': this.readOnly,
-            'x-input-number-out-of-range': this.isOutOfRange(),
-            'x-input-number-status-error': this.status === 'error',
-            'x-input-number-status-warning': this.status === 'warning',
-            [`x-input-number-${this.size}`]: true,
-            [`x-input-number-${this.variant}`]: true,
-            'x-input-number-has-addon': hasAddon,
-            'x-input-number-has-affix': hasAffix,
-            [this.classNames?.root ?? '']: !!this.classNames?.root,
-        };
-        return (index.h(index.Host, { key: '121ff396550785581268cf58bbba452398aa194e', class: {
-                'x-input-number': true,
-                [`x-input-number-${this.size}`]: true,
-            } }, this.addonBefore && (index.h("span", { key: '65f9ebae015943f7748f625888a9257d3424d7de', class: "x-input-number-group-addon x-input-number-group-addon-before" }, index.h("slot", { key: 'eeaa2f4a4c22a04597109330901320ce5ca4d17a', name: "addonBefore" }, this.addonBefore))), index.h("div", { key: '4f13fea7319c6ea1520860a3eb62e758ed5f7e86', class: wrapperClasses, style: this.styles?.root }, this.prefixIcon && (index.h("span", { key: '5aef84bfd3445b9eba412a03c5bf3d6f4839849d', class: { 'x-input-number-prefix': true, [this.classNames?.prefix ?? '']: !!this.classNames?.prefix } }, index.h("slot", { key: 'e4d077e06a16fd89ea7e4d98767840b408123669', name: "prefix" }, this.prefixIcon))), index.h("div", { key: '95e44d6fb300e9a94c5bcbb64602523ee87bf26d', class: "x-input-number-input-wrap" }, index.h("input", { key: '9c416504c66b8ac7faa07dc2f83eca2867bb8d42', ref: (el) => (this.inputRef = el), class: {
-                'x-input-number-input': true,
-                [this.classNames?.input ?? '']: !!this.classNames?.input,
-            }, style: this.styles?.input, type: "text", inputMode: "decimal", autocomplete: "off", role: "spinbutton", "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": this.value, value: this.inputValue, disabled: this.disabled, readOnly: this.readOnly, placeholder: this.placeholder, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, onWheel: this.handleWheel })), this.suffix && (index.h("span", { key: 'f5d9448d1dd2f00cc7c874230e7aa44ee08d9116', class: { 'x-input-number-suffix': true, [this.classNames?.suffix ?? '']: !!this.classNames?.suffix } }, index.h("slot", { key: 'f58380ae67766132439c8146d823e2a86b6bf32b', name: "suffix" }, this.suffix))), this.controls && (index.h("div", { key: '72e5024bf232d212300639b5b2030093b2149531', class: { 'x-input-number-handler-wrap': true, [this.classNames?.handlers ?? '']: !!this.classNames?.handlers } }, index.h("span", { key: '67968406dee6198ff1cc652351d39ac53e6043ef', class: {
-                'x-input-number-handler': true,
-                'x-input-number-handler-up': true,
-                'x-input-number-handler-disabled': this.isUpDisabled(),
-            }, onMouseDown: (e) => !this.isUpDisabled() && this.handleStepMouseDown('up', e), onMouseUp: this.handleStepMouseUp, onMouseLeave: this.handleStepMouseUp }, index.h("span", { key: 'fba5d46dc0b52db13e8315e3201c87f23fd08f84', class: "x-input-number-handler-up-inner" }, this.renderUpIcon())), index.h("span", { key: '3ecbdf11351a90ebc795f021f0cccb05cf1e08f9', class: {
-                'x-input-number-handler': true,
-                'x-input-number-handler-down': true,
-                'x-input-number-handler-disabled': this.isDownDisabled(),
-            }, onMouseDown: (e) => !this.isDownDisabled() && this.handleStepMouseDown('down', e), onMouseUp: this.handleStepMouseUp, onMouseLeave: this.handleStepMouseUp }, index.h("span", { key: '4335fd45f1a1842d1419a8e5edc2449f45f3faf8', class: "x-input-number-handler-down-inner" }, this.renderDownIcon()))))), this.addonAfter && (index.h("span", { key: '0ca6d501421a7641e0ed055b1abd5f0d29e498d2', class: "x-input-number-group-addon x-input-number-group-addon-after" }, index.h("slot", { key: '41f103cb4fe2b0c7a6e6d2dccf82ac3b2a983f56', name: "addonAfter" }, this.addonAfter)))));
-    }
-    static get watchers() { return {
-        "value": [{
-                "handleValueChange": 0
-            }]
-    }; }
-};
-XInputNumber.style = xInputNumberCss();
-
-const xModalCss = () => `@charset "UTF-8";:root{--x-color-primary:#1677ff;--x-color-primary-rgb:22, 119, 255;--x-color-primary-contrast:#ffffff;--x-color-primary-contrast-rgb:255, 255, 255;--x-color-primary-shade:#0958d9;--x-color-primary-tint:#4096ff;--x-color-primary-bg:#e6f4ff;--x-color-primary-bg-hover:#bae0ff;--x-color-primary-border:#91caff;--x-color-primary-border-hover:#69b1ff;--x-color-primary-hover:#4096ff;--x-color-primary-active:#0958d9;--x-color-primary-text:#1677ff;--x-color-primary-text-hover:#4096ff;--x-color-primary-text-active:#0958d9;--x-color-secondary:#3dc2ff;--x-color-secondary-rgb:61, 194, 255;--x-color-secondary-contrast:#ffffff;--x-color-secondary-contrast-rgb:255, 255, 255;--x-color-secondary-shade:#36abe0;--x-color-secondary-tint:#50c8ff;--x-color-success:#52c41a;--x-color-success-rgb:82, 196, 26;--x-color-success-contrast:#ffffff;--x-color-success-contrast-rgb:255, 255, 255;--x-color-success-shade:#389e0d;--x-color-success-tint:#73d13d;--x-color-success-bg:#f6ffed;--x-color-success-bg-hover:#d9f7be;--x-color-success-border:#b7eb8f;--x-color-success-border-hover:#95de64;--x-color-success-hover:#73d13d;--x-color-success-active:#389e0d;--x-color-success-text:#52c41a;--x-color-success-text-hover:#73d13d;--x-color-success-text-active:#389e0d;--x-color-warning:#faad14;--x-color-warning-rgb:250, 173, 20;--x-color-warning-contrast:#000000;--x-color-warning-contrast-rgb:0, 0, 0;--x-color-warning-shade:#d48806;--x-color-warning-tint:#ffc53d;--x-color-warning-bg:#fffbe6;--x-color-warning-bg-hover:#fff1b8;--x-color-warning-border:#ffe58f;--x-color-warning-border-hover:#ffd666;--x-color-warning-hover:#ffc53d;--x-color-warning-active:#d48806;--x-color-warning-text:#faad14;--x-color-warning-text-hover:#ffc53d;--x-color-warning-text-active:#d48806;--x-color-danger:#ff4d4f;--x-color-danger-rgb:255, 77, 79;--x-color-danger-contrast:#ffffff;--x-color-danger-contrast-rgb:255, 255, 255;--x-color-danger-shade:#cf1322;--x-color-danger-tint:#ff7875;--x-color-error:#ff4d4f;--x-color-error-rgb:255, 77, 79;--x-color-error-bg:#fff2f0;--x-color-error-bg-hover:#ffccc7;--x-color-error-border:#ffa39e;--x-color-error-border-hover:#ff7875;--x-color-error-hover:#ff7875;--x-color-error-active:#d9363e;--x-color-error-text:#ff4d4f;--x-color-error-text-hover:#ff7875;--x-color-error-text-active:#d9363e;--x-color-info:#1677ff;--x-color-info-rgb:22, 119, 255;--x-color-info-bg:#e6f4ff;--x-color-info-bg-hover:#bae0ff;--x-color-info-border:#91caff;--x-color-info-border-hover:#69b1ff;--x-color-info-hover:#69b1ff;--x-color-info-active:#0958d9;--x-color-info-text:#1677ff;--x-color-info-text-hover:#69b1ff;--x-color-info-text-active:#0958d9;--x-color-text:rgba(0, 0, 0, 0.88);--x-color-text-secondary:rgba(0, 0, 0, 0.65);--x-color-text-tertiary:rgba(0, 0, 0, 0.45);--x-color-text-quaternary:rgba(0, 0, 0, 0.25);--x-color-text-disabled:rgba(0, 0, 0, 0.25);--x-color-text-placeholder:rgba(0, 0, 0, 0.25);--x-color-text-heading:rgba(0, 0, 0, 0.88);--x-color-text-label:rgba(0, 0, 0, 0.65);--x-color-text-description:rgba(0, 0, 0, 0.45);--x-color-text-light-solid:#ffffff;--x-color-bg-container:#ffffff;--x-color-bg-elevated:#ffffff;--x-color-bg-layout:#f5f5f5;--x-color-bg-spotlight:rgba(0, 0, 0, 0.85);--x-color-bg-mask:rgba(0, 0, 0, 0.45);--x-color-bg-base:#ffffff;--x-color-bg-container-disabled:#f5f5f5;--x-color-bg-container-loading:rgba(255, 255, 255, 0.65);--x-color-white:#ffffff;--x-color-fill:rgba(0, 0, 0, 0.15);--x-color-fill-secondary:rgba(0, 0, 0, 0.06);--x-color-fill-tertiary:rgba(0, 0, 0, 0.04);--x-color-fill-quaternary:rgba(0, 0, 0, 0.02);--x-color-border:#d9d9d9;--x-color-border-secondary:#f0f0f0;--x-color-border-bg:#ffffff;--x-color-split:rgba(5, 5, 5, 0.06);--x-color-dark:#222428;--x-color-dark-rgb:34, 36, 40;--x-color-dark-contrast:#ffffff;--x-color-dark-contrast-rgb:255, 255, 255;--x-color-dark-shade:#1e2023;--x-color-dark-tint:#383a3e;--x-color-medium:#92949c;--x-color-medium-rgb:146, 148, 156;--x-color-medium-contrast:#ffffff;--x-color-medium-contrast-rgb:255, 255, 255;--x-color-medium-shade:#808289;--x-color-medium-tint:#9d9fa6;--x-color-light:#f4f5f8;--x-color-light-rgb:244, 245, 248;--x-color-light-contrast:#000000;--x-color-light-contrast-rgb:0, 0, 0;--x-color-light-shade:#d7d8da;--x-color-light-tint:#f5f6f9;--x-font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--x-font-family-code:"SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;--x-font-size:14px;--x-font-size-sm:12px;--x-font-size-lg:16px;--x-font-size-xl:20px;--x-font-size-heading-1:38px;--x-font-size-heading-2:30px;--x-font-size-heading-3:24px;--x-font-size-heading-4:20px;--x-font-size-heading-5:16px;--x-line-height:1.5714285714285714;--x-line-height-lg:1.5;--x-line-height-sm:1.6666666666666667;--x-line-height-heading-1:1.2105263157894737;--x-line-height-heading-2:1.2666666666666666;--x-line-height-heading-3:1.3333333333333333;--x-line-height-heading-4:1.4;--x-line-height-heading-5:1.5;--x-font-weight-normal:400;--x-font-weight-medium:500;--x-font-weight-semibold:600;--x-font-weight-strong:600;--x-font-size-base:14px;--x-font-size-xxl:24px;--x-line-height-base:1.5714285714285714;--x-spacing-xxs:4px;--x-spacing-xs:8px;--x-spacing-sm:12px;--x-spacing-md:16px;--x-spacing-lg:20px;--x-spacing-xl:24px;--x-spacing-xxl:32px;--x-spacing-xxxl:48px;--x-margin-xxs:4px;--x-margin-xs:8px;--x-margin-sm:12px;--x-margin-md:16px;--x-margin-lg:24px;--x-margin-xl:32px;--x-margin-xxl:48px;--x-padding-xxs:4px;--x-padding-xs:8px;--x-padding-sm:12px;--x-padding-md:16px;--x-padding-lg:24px;--x-padding-content-horizontal-lg:24px;--x-padding-content-vertical-lg:12px;--x-padding-content-horizontal:16px;--x-padding-content-vertical:12px;--x-padding-content-horizontal-sm:16px;--x-padding-content-vertical-sm:8px;--x-border-radius:6px;--x-border-radius-xs:2px;--x-border-radius-sm:4px;--x-border-radius-lg:8px;--x-border-radius-xl:12px;--x-border-radius-outer:4px;--x-border-radius-base:6px;--x-border-width:1px;--x-border-width-base:1px;--x-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-shadow-lg:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-box-shadow-popover-arrow:2px 2px 5px rgba(0, 0, 0, 0.05);--x-box-shadow-card:0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);--x-box-shadow-drawer-right:-6px 0 16px 0 rgba(0, 0, 0, 0.08), -3px 0 6px -4px rgba(0, 0, 0, 0.12), -9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-left:6px 0 16px 0 rgba(0, 0, 0, 0.08), 3px 0 6px -4px rgba(0, 0, 0, 0.12), 9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-up:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-down:0 -6px 16px 0 rgba(0, 0, 0, 0.08), 0 -3px 6px -4px rgba(0, 0, 0, 0.12), 0 -9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tabs-overflow-left:inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-right:inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-top:inset 0 10px 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-bottom:inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08);--x-motion-duration-fast:0.1s;--x-motion-duration-mid:0.2s;--x-motion-duration-slow:0.3s;--x-motion-ease-in-out:cubic-bezier(0.645, 0.045, 0.355, 1);--x-motion-ease-out:cubic-bezier(0.215, 0.61, 0.355, 1);--x-motion-ease-in:cubic-bezier(0.55, 0.055, 0.675, 0.19);--x-motion-ease-out-back:cubic-bezier(0.12, 0.4, 0.29, 1.46);--x-motion-ease-in-back:cubic-bezier(0.71, -0.46, 0.88, 0.6);--x-motion-ease-in-out-circle:cubic-bezier(0.78, 0.14, 0.15, 0.86);--x-motion-ease-out-circle:cubic-bezier(0.08, 0.82, 0.17, 1);--x-motion-ease-in-circle:cubic-bezier(0.6, 0.04, 0.98, 0.34);--x-motion-ease-in-quint:cubic-bezier(0.755, 0.05, 0.855, 0.06);--x-motion-ease-out-quint:cubic-bezier(0.23, 1, 0.32, 1);--x-z-index-base:0;--x-z-index-popup-base:1000;--x-z-index-popup:1030;--x-z-index-affix:10;--x-z-index-modal:1000;--x-z-index-modal-mask:1000;--x-z-index-drawer:1000;--x-z-index-popover:1030;--x-z-index-dropdown:1050;--x-z-index-tooltip:1070;--x-z-index-notification:1080;--x-z-index-message:1090;--x-z-index-popconfirm:1060;--x-z-index-table-fixed:10;--x-opacity-loading:0.65;--x-opacity-image:1;--x-opacity-disabled:0.5;--x-control-height:32px;--x-control-height-xs:24px;--x-control-height-sm:24px;--x-control-height-lg:40px;--x-control-radio-size:16px;--x-control-checkbox-size:16px;--x-control-padding-horizontal:12px;--x-control-padding-horizontal-sm:8px;--x-control-outline-width:2px;--x-control-outline:rgba(5, 145, 255, 0.1);--x-control-item-bg-hover:rgba(0, 0, 0, 0.04);--x-control-item-bg-active:#e6f4ff;--x-control-item-bg-active-hover:#bae0ff;--x-control-item-bg-active-disabled:rgba(0, 0, 0, 0.15);--x-control-tmp-outline:rgba(0, 0, 0, 0.02);--x-color-yellow:#fadb14;--x-color-yellow-rgb:250, 219, 20;--x-font-family-base:var(--x-font-family);--x-color-link:#1677ff;--x-color-link-hover:#69b1ff;--x-color-link-active:#0958d9;--x-color-icon:rgba(0, 0, 0, 0.45);--x-color-icon-hover:rgba(0, 0, 0, 0.88);--x-color-highlight:#ff4d4f;--x-color-bg-text-hover:rgba(0, 0, 0, 0.06);--x-color-bg-text-active:rgba(0, 0, 0, 0.15);--x-screen-xs:480px;--x-screen-xs-min:480px;--x-screen-xs-max:575px;--x-screen-sm:576px;--x-screen-sm-min:576px;--x-screen-sm-max:767px;--x-screen-md:768px;--x-screen-md-min:768px;--x-screen-md-max:991px;--x-screen-lg:992px;--x-screen-lg-min:992px;--x-screen-lg-max:1199px;--x-screen-xl:1200px;--x-screen-xl-min:1200px;--x-screen-xl-max:1599px;--x-screen-xxl:1600px;--x-screen-xxl-min:1600px;--x-color-fill-content:rgba(0, 0, 0, 0.06);--x-color-fill-content-hover:rgba(0, 0, 0, 0.15);--x-color-fill-alter:rgba(0, 0, 0, 0.02);--x-scrollbar-width:12px;--x-scrollbar-track-bg:rgba(0, 0, 0, 0.04);--x-scrollbar-thumb-bg:rgba(0, 0, 0, 0.25);--x-scrollbar-thumb-bg-hover:rgba(0, 0, 0, 0.35);--x-menu-dark-bg:#001529;--x-menu-dark-item-bg:#001529;--x-menu-dark-popup-bg:#001529;--x-menu-dark-submenu-item-bg:#000c17}:host{display:none;position:fixed;top:0;left:0;width:100%;height:100%;z-index:var(--x-modal-z-index, 1000);font-family:var(--x-modal-font-family, var(--x-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif))}:host(.x-modal-open){display:block}.x-modal-mask{position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--x-modal-mask-bg, var(--x-color-bg-mask, rgba(0, 0, 0, 0.45)));z-index:var(--x-modal-mask-z-index, 1000)}.x-modal-wrap{position:fixed;top:0;left:0;width:100%;height:100%;overflow:auto;outline:0;z-index:var(--x-modal-z-index, 1000);display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:flex-start;-ms-flex-pack:center;justify-content:center;padding:var(--x-modal-padding-top, 100px) 0 var(--x-modal-padding-bottom, var(--x-spacing-xl, 24px))}:host(.x-modal-centered) .x-modal-wrap{-ms-flex-align:center;align-items:center;padding:0}.x-modal-content{position:relative;background-color:var(--x-modal-content-bg, var(--x-color-bg-container, #ffffff));background-clip:padding-box;border:0;border-radius:var(--x-modal-content-border-radius, var(--x-border-radius-lg, 8px));-webkit-box-shadow:var(--x-modal-content-shadow, var(--x-box-shadow, 0 6px 16px 0 rgba(0, 0, 0, 0.08)));box-shadow:var(--x-modal-content-shadow, var(--x-box-shadow, 0 6px 16px 0 rgba(0, 0, 0, 0.08)));pointer-events:auto;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.x-modal-header{padding:var(--x-modal-header-padding-block, var(--x-spacing-md, 16px)) var(--x-modal-header-padding-inline, var(--x-spacing-xl, 24px));color:var(--x-modal-title-color, var(--x-color-text-heading, rgba(0, 0, 0, 0.88)));background:var(--x-modal-header-bg, var(--x-color-bg-container, #ffffff));border-bottom:var(--x-modal-header-border-width, var(--x-border-width, 1px)) solid var(--x-modal-header-border-color, var(--x-color-border-secondary, #f0f0f0));border-radius:var(--x-modal-content-border-radius, var(--x-border-radius-lg, 8px)) var(--x-modal-content-border-radius, var(--x-border-radius-lg, 8px)) 0 0;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center}.x-modal-title{margin:0;color:var(--x-modal-title-color, var(--x-color-text-heading, rgba(0, 0, 0, 0.88)));font-weight:var(--x-modal-title-font-weight, var(--x-font-weight-strong, 600));font-size:var(--x-modal-title-font-size, var(--x-font-size-lg, 16px));line-height:var(--x-modal-close-size, 22px);word-wrap:break-word}.x-modal-close{display:block;width:var(--x-modal-close-size, 22px);height:var(--x-modal-close-size, 22px);margin-right:var(--x-modal-close-margin-end, -12px);padding:0;color:var(--x-modal-close-color, var(--x-color-icon, rgba(0, 0, 0, 0.45)));font-weight:var(--x-modal-close-font-weight, 700);line-height:var(--x-modal-close-line-height, 1);text-decoration:none;background:transparent;border:0;outline:0;cursor:pointer;-webkit-transition:color var(--x-modal-motion-duration, var(--x-motion-duration-slow, 0.3s));transition:color var(--x-modal-motion-duration, var(--x-motion-duration-slow, 0.3s))}.x-modal-close:hover{color:var(--x-modal-close-color-hover, var(--x-color-icon-hover, rgba(0, 0, 0, 0.88)));text-decoration:none}.x-modal-body{padding:var(--x-modal-body-padding, var(--x-spacing-xl, 24px));font-size:var(--x-modal-body-font-size, var(--x-font-size-base, 14px));line-height:var(--x-modal-body-line-height, var(--x-line-height-base, 1.5714));word-wrap:break-word}.x-modal-footer{padding:var(--x-modal-footer-padding-block, var(--x-spacing-sm, 8px)) var(--x-modal-footer-padding-inline, var(--x-spacing-md, 16px));text-align:right;background:transparent;border-top:var(--x-modal-header-border-width, var(--x-border-width, 1px)) solid var(--x-modal-footer-border-color, var(--x-color-border-secondary, #f0f0f0));border-radius:0 0 var(--x-modal-footer-border-radius, var(--x-border-radius-xs, 2px)) var(--x-modal-footer-border-radius, var(--x-border-radius-xs, 2px));display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:flex-end;gap:var(--x-modal-footer-gap, var(--x-spacing-xs, 8px))}`;
-
-const XModal = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.xOk = index.createEvent(this, "xOk", 7);
-        this.xCancel = index.createEvent(this, "xCancel", 7);
-    }
-    get el() { return index.getElement(this); }
-    /**
-     * Whether the modal is visible.
-     * @example
-     * <x-modal visible></x-modal>
-     */
-    visible = false;
-    /**
-     * Modal title.
-     * @example
-     * <x-modal modalTitle="Confirm"></x-modal>
-     */
-    modalTitle;
-    /**
-     * Width of the modal.
-     * @example
-     * <x-modal width={600}></x-modal>
-     */
-    width = 520;
-    /**
-     * Whether to show footer.
-     * @example
-     * <x-modal footer={false}></x-modal>
-     */
-    footer = true;
-    /**
-     * Whether to show close button.
-     * @example
-     * <x-modal closable={false}></x-modal>
-     */
-    closable = true;
-    /**
-     * Whether to show mask.
-     * @example
-     * <x-modal mask={false}></x-modal>
-     */
-    mask = true;
-    /**
-     * Whether clicking mask closes modal.
-     * @example
-     * <x-modal maskClosable={false}></x-modal>
-     */
-    maskClosable = true;
-    /**
-     * Whether to center the modal.
-     * @example
-     * <x-modal centered></x-modal>
-     */
-    centered = false;
-    /**
-     * OK button text.
-     * @example
-     * <x-modal okText="OK"></x-modal>
-     */
-    okText = locale_service.translate('Modal.okText', {}, 'OK');
-    /**
-     * Cancel button text.
-     * @example
-     * <x-modal cancelText="Cancel"></x-modal>
-     */
-    cancelText = locale_service.translate('Modal.cancelText', {}, 'Cancel');
-    /**
-     * OK button loading state.
-     * @example
-     * <x-modal okLoading></x-modal>
-     */
-    okLoading = false;
-    /**
-     * Cancel button loading state.
-     * @example
-     * <x-modal cancelLoading></x-modal>
-     */
-    cancelLoading = false;
-    /**
-     * OK button type.
-     * @example
-     * <x-modal okType="primary"></x-modal>
-     */
-    okType = 'primary';
-    /**
-     * Modal type (info, success, error, warning, confirm).
-     * @example
-     * <x-modal type="info"></x-modal>
-     */
-    type;
-    /**
-     * Event emitted when OK button is clicked.
-     * @example
-     * <x-modal onXOk={() => {}}></x-modal>
-     */
-    xOk;
-    /**
-     * Event emitted when Cancel button or modal is closed.
-     * @example
-     * <x-modal onXCancel={() => {}}></x-modal>
-     */
-    xCancel;
-    /**
-     * Portal instance for modal content.
-     */
-    portalInstance = null;
-    /**
-     * Create portal on initial visible state.
-     * @returns void
-     */
-    componentDidLoad() {
-        if (this.visible) {
-            this.updatePortal();
-        }
-    }
-    /**
-     * Cleanup portal on disconnect.
-     * @returns void
-     */
-    disconnectedCallback() {
-        this.destroyPortal();
-    }
-    handleVisibleChange() {
-        this.updatePortal();
-    }
-    handlePropsChange() {
-        if (this.visible) {
-            this.updatePortal();
-        }
-    }
-    /**
-     * Get body content from slot.
-     * @returns string
-     */
-    getBodyContent() {
-        const slot = this.el.shadowRoot?.querySelector('slot:not([name])');
-        if (slot) {
-            const nodes = slot.assignedNodes({ flatten: true });
-            return nodes.map(node => {
-                if (node.nodeType === Node.ELEMENT_NODE) {
-                    return node.outerHTML;
-                }
-                return node.textContent || '';
-            }).join('');
-        }
-        return '';
-    }
-    /**
-     * Get footer content from slot.
-     * @returns string
-     */
-    getFooterContent() {
-        const slot = this.el.shadowRoot?.querySelector('slot[name="footer"]');
-        if (slot) {
-            const nodes = slot.assignedNodes({ flatten: true });
-            if (nodes.length > 0) {
-                return nodes.map(node => {
-                    if (node.nodeType === Node.ELEMENT_NODE) {
-                        return node.outerHTML;
-                    }
-                    return node.textContent || '';
-                }).join('');
-            }
-        }
-        return '';
-    }
-    /**
-     * Build modal content element for portal.
-     *
-     * Flow:
-     * 1. Creates `x-modal-content` element.
-     * 2. Assigns all visual props (title, width, footer, etc.).
-     * 3. Injects body and footer content extracted from slots.
-     * 4. Attaches `xOk` and `xCancel` event listeners to forward events.
-     *
-     * @returns HTMLElement
-     */
-    buildModalElement() {
-        const modalEl = document.createElement('x-modal-content');
-        // Set properties
-        modalEl.modalTitle = this.modalTitle;
-        modalEl.width = this.width;
-        modalEl.footer = this.footer;
-        modalEl.closable = this.closable;
-        modalEl.mask = this.mask;
-        modalEl.maskClosable = this.maskClosable;
-        modalEl.centered = this.centered;
-        modalEl.okText = this.okText;
-        modalEl.cancelText = this.cancelText;
-        modalEl.okLoading = this.okLoading;
-        modalEl.cancelLoading = this.cancelLoading;
-        modalEl.okType = this.okType;
-        modalEl.type = this.type;
-        // Get slot content
-        modalEl.bodyContent = this.getBodyContent();
-        modalEl.footerContent = this.getFooterContent();
-        // Attach event listeners
-        modalEl.addEventListener('xOk', () => {
-            this.xOk.emit();
-        });
-        modalEl.addEventListener('xCancel', () => {
-            this.xCancel.emit();
-        });
-        return modalEl;
-    }
-    /**
-     * Update portal with modal content.
-     * @returns void
-     */
-    updatePortal() {
-        if (!this.visible) {
-            this.destroyPortal();
-            return;
-        }
-        // Build modal element
-        const modalElement = this.buildModalElement();
-        if (!this.portalInstance) {
-            // Create new portal instance
-            this.portalInstance = portalController.PortalController.create({
-                open: true,
-                zIndex: 1000,
-                content: modalElement,
-            });
-        }
-        else {
-            // Update existing portal
-            this.portalInstance.update({
-                open: true,
-                content: modalElement,
-            });
-        }
-    }
-    /**
-     * Destroy portal instance.
-     * @returns void
-     */
-    destroyPortal() {
-        if (this.portalInstance) {
-            this.portalInstance.destroy();
-            this.portalInstance = null;
-        }
-    }
-    /**
-     * Render hidden slots to capture content for portal.
-     * @returns JSX.Element
-     */
-    render() {
-        return (index.h(index.Host, { key: 'c3e46fc9b067f8d4700762b5bb0d284dc190c1e8', class: {
-                'x-modal': true,
-                'x-modal-open': this.visible,
-            } }, index.h("div", { key: 'd620493f845e4b86b29fa46b868dbab2d632908a', style: { display: 'none' } }, index.h("slot", { key: '202a7875383dfb9f3c6b5fc9a5183a916d0b9563' }), index.h("slot", { key: '10e85c6d0994bf249c3974bdb881efda16385702', name: "footer" }))));
-    }
-    static get watchers() { return {
-        "visible": [{
-                "handleVisibleChange": 0
-            }],
-        "modalTitle": [{
-                "handlePropsChange": 0
-            }],
-        "width": [{
-                "handlePropsChange": 0
-            }],
-        "footer": [{
-                "handlePropsChange": 0
-            }],
-        "closable": [{
-                "handlePropsChange": 0
-            }],
-        "mask": [{
-                "handlePropsChange": 0
-            }],
-        "maskClosable": [{
-                "handlePropsChange": 0
-            }],
-        "centered": [{
-                "handlePropsChange": 0
-            }],
-        "okText": [{
-                "handlePropsChange": 0
-            }],
-        "cancelText": [{
-                "handlePropsChange": 0
-            }],
-        "okLoading": [{
-                "handlePropsChange": 0
-            }],
-        "cancelLoading": [{
-                "handlePropsChange": 0
-            }],
-        "okType": [{
-                "handlePropsChange": 0
-            }],
-        "type": [{
-                "handlePropsChange": 0
-            }]
-    }; }
-};
-XModal.style = xModalCss();
-
-const xSliderCss = () => `@charset "UTF-8";:root{--x-color-primary:#1677ff;--x-color-primary-rgb:22, 119, 255;--x-color-primary-contrast:#ffffff;--x-color-primary-contrast-rgb:255, 255, 255;--x-color-primary-shade:#0958d9;--x-color-primary-tint:#4096ff;--x-color-primary-bg:#e6f4ff;--x-color-primary-bg-hover:#bae0ff;--x-color-primary-border:#91caff;--x-color-primary-border-hover:#69b1ff;--x-color-primary-hover:#4096ff;--x-color-primary-active:#0958d9;--x-color-primary-text:#1677ff;--x-color-primary-text-hover:#4096ff;--x-color-primary-text-active:#0958d9;--x-color-secondary:#3dc2ff;--x-color-secondary-rgb:61, 194, 255;--x-color-secondary-contrast:#ffffff;--x-color-secondary-contrast-rgb:255, 255, 255;--x-color-secondary-shade:#36abe0;--x-color-secondary-tint:#50c8ff;--x-color-success:#52c41a;--x-color-success-rgb:82, 196, 26;--x-color-success-contrast:#ffffff;--x-color-success-contrast-rgb:255, 255, 255;--x-color-success-shade:#389e0d;--x-color-success-tint:#73d13d;--x-color-success-bg:#f6ffed;--x-color-success-bg-hover:#d9f7be;--x-color-success-border:#b7eb8f;--x-color-success-border-hover:#95de64;--x-color-success-hover:#73d13d;--x-color-success-active:#389e0d;--x-color-success-text:#52c41a;--x-color-success-text-hover:#73d13d;--x-color-success-text-active:#389e0d;--x-color-warning:#faad14;--x-color-warning-rgb:250, 173, 20;--x-color-warning-contrast:#000000;--x-color-warning-contrast-rgb:0, 0, 0;--x-color-warning-shade:#d48806;--x-color-warning-tint:#ffc53d;--x-color-warning-bg:#fffbe6;--x-color-warning-bg-hover:#fff1b8;--x-color-warning-border:#ffe58f;--x-color-warning-border-hover:#ffd666;--x-color-warning-hover:#ffc53d;--x-color-warning-active:#d48806;--x-color-warning-text:#faad14;--x-color-warning-text-hover:#ffc53d;--x-color-warning-text-active:#d48806;--x-color-danger:#ff4d4f;--x-color-danger-rgb:255, 77, 79;--x-color-danger-contrast:#ffffff;--x-color-danger-contrast-rgb:255, 255, 255;--x-color-danger-shade:#cf1322;--x-color-danger-tint:#ff7875;--x-color-error:#ff4d4f;--x-color-error-rgb:255, 77, 79;--x-color-error-bg:#fff2f0;--x-color-error-bg-hover:#ffccc7;--x-color-error-border:#ffa39e;--x-color-error-border-hover:#ff7875;--x-color-error-hover:#ff7875;--x-color-error-active:#d9363e;--x-color-error-text:#ff4d4f;--x-color-error-text-hover:#ff7875;--x-color-error-text-active:#d9363e;--x-color-info:#1677ff;--x-color-info-rgb:22, 119, 255;--x-color-info-bg:#e6f4ff;--x-color-info-bg-hover:#bae0ff;--x-color-info-border:#91caff;--x-color-info-border-hover:#69b1ff;--x-color-info-hover:#69b1ff;--x-color-info-active:#0958d9;--x-color-info-text:#1677ff;--x-color-info-text-hover:#69b1ff;--x-color-info-text-active:#0958d9;--x-color-text:rgba(0, 0, 0, 0.88);--x-color-text-secondary:rgba(0, 0, 0, 0.65);--x-color-text-tertiary:rgba(0, 0, 0, 0.45);--x-color-text-quaternary:rgba(0, 0, 0, 0.25);--x-color-text-disabled:rgba(0, 0, 0, 0.25);--x-color-text-placeholder:rgba(0, 0, 0, 0.25);--x-color-text-heading:rgba(0, 0, 0, 0.88);--x-color-text-label:rgba(0, 0, 0, 0.65);--x-color-text-description:rgba(0, 0, 0, 0.45);--x-color-text-light-solid:#ffffff;--x-color-bg-container:#ffffff;--x-color-bg-elevated:#ffffff;--x-color-bg-layout:#f5f5f5;--x-color-bg-spotlight:rgba(0, 0, 0, 0.85);--x-color-bg-mask:rgba(0, 0, 0, 0.45);--x-color-bg-base:#ffffff;--x-color-bg-container-disabled:#f5f5f5;--x-color-bg-container-loading:rgba(255, 255, 255, 0.65);--x-color-white:#ffffff;--x-color-fill:rgba(0, 0, 0, 0.15);--x-color-fill-secondary:rgba(0, 0, 0, 0.06);--x-color-fill-tertiary:rgba(0, 0, 0, 0.04);--x-color-fill-quaternary:rgba(0, 0, 0, 0.02);--x-color-border:#d9d9d9;--x-color-border-secondary:#f0f0f0;--x-color-border-bg:#ffffff;--x-color-split:rgba(5, 5, 5, 0.06);--x-color-dark:#222428;--x-color-dark-rgb:34, 36, 40;--x-color-dark-contrast:#ffffff;--x-color-dark-contrast-rgb:255, 255, 255;--x-color-dark-shade:#1e2023;--x-color-dark-tint:#383a3e;--x-color-medium:#92949c;--x-color-medium-rgb:146, 148, 156;--x-color-medium-contrast:#ffffff;--x-color-medium-contrast-rgb:255, 255, 255;--x-color-medium-shade:#808289;--x-color-medium-tint:#9d9fa6;--x-color-light:#f4f5f8;--x-color-light-rgb:244, 245, 248;--x-color-light-contrast:#000000;--x-color-light-contrast-rgb:0, 0, 0;--x-color-light-shade:#d7d8da;--x-color-light-tint:#f5f6f9;--x-font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--x-font-family-code:"SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;--x-font-size:14px;--x-font-size-sm:12px;--x-font-size-lg:16px;--x-font-size-xl:20px;--x-font-size-heading-1:38px;--x-font-size-heading-2:30px;--x-font-size-heading-3:24px;--x-font-size-heading-4:20px;--x-font-size-heading-5:16px;--x-line-height:1.5714285714285714;--x-line-height-lg:1.5;--x-line-height-sm:1.6666666666666667;--x-line-height-heading-1:1.2105263157894737;--x-line-height-heading-2:1.2666666666666666;--x-line-height-heading-3:1.3333333333333333;--x-line-height-heading-4:1.4;--x-line-height-heading-5:1.5;--x-font-weight-normal:400;--x-font-weight-medium:500;--x-font-weight-semibold:600;--x-font-weight-strong:600;--x-font-size-base:14px;--x-font-size-xxl:24px;--x-line-height-base:1.5714285714285714;--x-spacing-xxs:4px;--x-spacing-xs:8px;--x-spacing-sm:12px;--x-spacing-md:16px;--x-spacing-lg:20px;--x-spacing-xl:24px;--x-spacing-xxl:32px;--x-spacing-xxxl:48px;--x-margin-xxs:4px;--x-margin-xs:8px;--x-margin-sm:12px;--x-margin-md:16px;--x-margin-lg:24px;--x-margin-xl:32px;--x-margin-xxl:48px;--x-padding-xxs:4px;--x-padding-xs:8px;--x-padding-sm:12px;--x-padding-md:16px;--x-padding-lg:24px;--x-padding-content-horizontal-lg:24px;--x-padding-content-vertical-lg:12px;--x-padding-content-horizontal:16px;--x-padding-content-vertical:12px;--x-padding-content-horizontal-sm:16px;--x-padding-content-vertical-sm:8px;--x-border-radius:6px;--x-border-radius-xs:2px;--x-border-radius-sm:4px;--x-border-radius-lg:8px;--x-border-radius-xl:12px;--x-border-radius-outer:4px;--x-border-radius-base:6px;--x-border-width:1px;--x-border-width-base:1px;--x-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-shadow-lg:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-box-shadow-popover-arrow:2px 2px 5px rgba(0, 0, 0, 0.05);--x-box-shadow-card:0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);--x-box-shadow-drawer-right:-6px 0 16px 0 rgba(0, 0, 0, 0.08), -3px 0 6px -4px rgba(0, 0, 0, 0.12), -9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-left:6px 0 16px 0 rgba(0, 0, 0, 0.08), 3px 0 6px -4px rgba(0, 0, 0, 0.12), 9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-up:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-down:0 -6px 16px 0 rgba(0, 0, 0, 0.08), 0 -3px 6px -4px rgba(0, 0, 0, 0.12), 0 -9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tabs-overflow-left:inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-right:inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-top:inset 0 10px 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-bottom:inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08);--x-motion-duration-fast:0.1s;--x-motion-duration-mid:0.2s;--x-motion-duration-slow:0.3s;--x-motion-ease-in-out:cubic-bezier(0.645, 0.045, 0.355, 1);--x-motion-ease-out:cubic-bezier(0.215, 0.61, 0.355, 1);--x-motion-ease-in:cubic-bezier(0.55, 0.055, 0.675, 0.19);--x-motion-ease-out-back:cubic-bezier(0.12, 0.4, 0.29, 1.46);--x-motion-ease-in-back:cubic-bezier(0.71, -0.46, 0.88, 0.6);--x-motion-ease-in-out-circle:cubic-bezier(0.78, 0.14, 0.15, 0.86);--x-motion-ease-out-circle:cubic-bezier(0.08, 0.82, 0.17, 1);--x-motion-ease-in-circle:cubic-bezier(0.6, 0.04, 0.98, 0.34);--x-motion-ease-in-quint:cubic-bezier(0.755, 0.05, 0.855, 0.06);--x-motion-ease-out-quint:cubic-bezier(0.23, 1, 0.32, 1);--x-z-index-base:0;--x-z-index-popup-base:1000;--x-z-index-popup:1030;--x-z-index-affix:10;--x-z-index-modal:1000;--x-z-index-modal-mask:1000;--x-z-index-drawer:1000;--x-z-index-popover:1030;--x-z-index-dropdown:1050;--x-z-index-tooltip:1070;--x-z-index-notification:1080;--x-z-index-message:1090;--x-z-index-popconfirm:1060;--x-z-index-table-fixed:10;--x-opacity-loading:0.65;--x-opacity-image:1;--x-opacity-disabled:0.5;--x-control-height:32px;--x-control-height-xs:24px;--x-control-height-sm:24px;--x-control-height-lg:40px;--x-control-radio-size:16px;--x-control-checkbox-size:16px;--x-control-padding-horizontal:12px;--x-control-padding-horizontal-sm:8px;--x-control-outline-width:2px;--x-control-outline:rgba(5, 145, 255, 0.1);--x-control-item-bg-hover:rgba(0, 0, 0, 0.04);--x-control-item-bg-active:#e6f4ff;--x-control-item-bg-active-hover:#bae0ff;--x-control-item-bg-active-disabled:rgba(0, 0, 0, 0.15);--x-control-tmp-outline:rgba(0, 0, 0, 0.02);--x-color-yellow:#fadb14;--x-color-yellow-rgb:250, 219, 20;--x-font-family-base:var(--x-font-family);--x-color-link:#1677ff;--x-color-link-hover:#69b1ff;--x-color-link-active:#0958d9;--x-color-icon:rgba(0, 0, 0, 0.45);--x-color-icon-hover:rgba(0, 0, 0, 0.88);--x-color-highlight:#ff4d4f;--x-color-bg-text-hover:rgba(0, 0, 0, 0.06);--x-color-bg-text-active:rgba(0, 0, 0, 0.15);--x-screen-xs:480px;--x-screen-xs-min:480px;--x-screen-xs-max:575px;--x-screen-sm:576px;--x-screen-sm-min:576px;--x-screen-sm-max:767px;--x-screen-md:768px;--x-screen-md-min:768px;--x-screen-md-max:991px;--x-screen-lg:992px;--x-screen-lg-min:992px;--x-screen-lg-max:1199px;--x-screen-xl:1200px;--x-screen-xl-min:1200px;--x-screen-xl-max:1599px;--x-screen-xxl:1600px;--x-screen-xxl-min:1600px;--x-color-fill-content:rgba(0, 0, 0, 0.06);--x-color-fill-content-hover:rgba(0, 0, 0, 0.15);--x-color-fill-alter:rgba(0, 0, 0, 0.02);--x-scrollbar-width:12px;--x-scrollbar-track-bg:rgba(0, 0, 0, 0.04);--x-scrollbar-thumb-bg:rgba(0, 0, 0, 0.25);--x-scrollbar-thumb-bg-hover:rgba(0, 0, 0, 0.35);--x-menu-dark-bg:#001529;--x-menu-dark-item-bg:#001529;--x-menu-dark-popup-bg:#001529;--x-menu-dark-submenu-item-bg:#000c17}:host{display:inline-block;position:relative;width:100%;height:var(--x-slider-height, var(--x-spacing-md, 16px));margin:var(--x-slider-margin-vertical, var(--x-spacing-sm, 12px)) var(--x-slider-margin-horizontal, var(--x-spacing-xs, 8px));padding:var(--x-slider-padding, var(--x-spacing-xxs, 4px)) 0;-ms-touch-action:none;touch-action:none;cursor:pointer;-webkit-box-sizing:border-box;box-sizing:border-box}:host(.x-slider-disabled){cursor:not-allowed}:host(.x-slider-vertical){width:var(--x-slider-height, var(--x-spacing-md, 16px));height:100%;margin:var(--x-slider-margin-horizontal, var(--x-spacing-xs, 8px)) var(--x-slider-margin-vertical, var(--x-spacing-sm, 12px));padding:0 var(--x-slider-padding, var(--x-spacing-xxs, 4px))}.x-slider-rail{position:absolute;top:50%;left:0;width:100%;height:var(--x-slider-track-height, 4px);background:var(--x-slider-rail-bg, var(--x-color-fill-secondary, rgba(0, 0, 0, 0.06)));border-radius:var(--x-slider-border-radius, var(--x-border-radius-xs, 4px));-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-transition:background var(--x-slider-motion-duration, var(--x-motion-duration-mid, 0.2s));transition:background var(--x-slider-motion-duration, var(--x-motion-duration-mid, 0.2s))}:host(.x-slider-vertical) .x-slider-rail{top:0;left:50%;width:var(--x-slider-track-height, 4px);height:100%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.x-slider-track{position:absolute;top:50%;height:var(--x-slider-track-height, 4px);background:var(--x-slider-track-bg, var(--x-color-primary-bg-hover, #91caff));border-radius:var(--x-slider-border-radius, var(--x-border-radius-xs, 4px));-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-transition:all var(--x-slider-motion-duration, var(--x-motion-duration-mid, 0.2s));transition:all var(--x-slider-motion-duration, var(--x-motion-duration-mid, 0.2s))}:host(.x-slider-vertical) .x-slider-track{left:50%;width:var(--x-slider-track-height, 4px);-webkit-transform:translateX(-50%);transform:translateX(-50%)}.x-slider-handle{position:absolute;top:50%;width:var(--x-slider-handle-size, var(--x-font-size-base, 14px));height:var(--x-slider-handle-size, var(--x-font-size-base, 14px));background:var(--x-slider-handle-bg, var(--x-color-white, #ffffff));border:2px solid var(--x-slider-handle-border-color, var(--x-color-primary, #1677ff));border-radius:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);-webkit-transition:border-color var(--x-slider-motion-duration, var(--x-motion-duration-mid, 0.2s)), -webkit-box-shadow var(--x-slider-motion-duration-slow, var(--x-motion-duration-slow, 0.3s)), -webkit-transform var(--x-slider-motion-duration, var(--x-motion-duration-mid, 0.2s)) var(--x-slider-motion-ease, var(--x-motion-ease-out-back, cubic-bezier(0.34, 1.56, 0.64, 1)));transition:border-color var(--x-slider-motion-duration, var(--x-motion-duration-mid, 0.2s)), -webkit-box-shadow var(--x-slider-motion-duration-slow, var(--x-motion-duration-slow, 0.3s)), -webkit-transform var(--x-slider-motion-duration, var(--x-motion-duration-mid, 0.2s)) var(--x-slider-motion-ease, var(--x-motion-ease-out-back, cubic-bezier(0.34, 1.56, 0.64, 1)));transition:border-color var(--x-slider-motion-duration, var(--x-motion-duration-mid, 0.2s)), box-shadow var(--x-slider-motion-duration-slow, var(--x-motion-duration-slow, 0.3s)), transform var(--x-slider-motion-duration, var(--x-motion-duration-mid, 0.2s)) var(--x-slider-motion-ease, var(--x-motion-ease-out-back, cubic-bezier(0.34, 1.56, 0.64, 1)));transition:border-color var(--x-slider-motion-duration, var(--x-motion-duration-mid, 0.2s)), box-shadow var(--x-slider-motion-duration-slow, var(--x-motion-duration-slow, 0.3s)), transform var(--x-slider-motion-duration, var(--x-motion-duration-mid, 0.2s)) var(--x-slider-motion-ease, var(--x-motion-ease-out-back, cubic-bezier(0.34, 1.56, 0.64, 1))), -webkit-box-shadow var(--x-slider-motion-duration-slow, var(--x-motion-duration-slow, 0.3s)), -webkit-transform var(--x-slider-motion-duration, var(--x-motion-duration-mid, 0.2s)) var(--x-slider-motion-ease, var(--x-motion-ease-out-back, cubic-bezier(0.34, 1.56, 0.64, 1)));cursor:-webkit-grab;cursor:grab;z-index:2}.x-slider-handle:hover{border-color:var(--x-slider-handle-border-color-hover, var(--x-color-primary, #1677ff))}.x-slider-handle:active{cursor:-webkit-grabbing;cursor:grabbing;-webkit-transform:translate(-50%, -50%) scale(1.1);transform:translate(-50%, -50%) scale(1.1);-webkit-box-shadow:var(--x-slider-handle-focus-shadow, 0 0 0 5px var(--x-color-primary-bg, rgba(22, 119, 255, 0.1)));box-shadow:var(--x-slider-handle-focus-shadow, 0 0 0 5px var(--x-color-primary-bg, rgba(22, 119, 255, 0.1)))}.x-slider-handle:focus{outline:none;border-color:var(--x-slider-handle-border-color-hover, var(--x-color-primary, #1677ff));-webkit-box-shadow:var(--x-slider-handle-focus-shadow, 0 0 0 5px var(--x-color-primary-bg, rgba(22, 119, 255, 0.1)));box-shadow:var(--x-slider-handle-focus-shadow, 0 0 0 5px var(--x-color-primary-bg, rgba(22, 119, 255, 0.1)))}:host(.x-slider-vertical) .x-slider-handle{left:50%;top:auto;-webkit-transform:translate(-50%, 50%);transform:translate(-50%, 50%)}.x-slider-tooltip{position:absolute;bottom:120%;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);padding:4px 8px;font-size:12px;background:#000;color:#fff;border-radius:4px;white-space:nowrap;opacity:0;pointer-events:none;-webkit-transition:opacity 0.2s ease;transition:opacity 0.2s ease}.x-slider-handle:hover .x-slider-tooltip,.x-slider-handle:active .x-slider-tooltip{opacity:1}:host(.x-slider-vertical) .x-slider-tooltip{left:120%;bottom:auto;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.x-slider-marks{position:absolute;top:100%;left:0;width:100%;margin-top:8px;font-size:12px}:host(.x-slider-vertical) .x-slider-marks{left:100%;top:0;width:auto;height:100%;margin-left:8px}.x-slider-mark{position:absolute;-webkit-transform:translateX(-50%);transform:translateX(-50%);color:rgba(0, 0, 0, 0.45);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}:host(.x-slider-vertical) .x-slider-mark{-webkit-transform:translateY(50%);transform:translateY(50%)}:host(.x-slider-disabled) .x-slider-rail{background:var(--x-slider-rail-bg-disabled, var(--x-color-fill-tertiary, rgba(0, 0, 0, 0.04)))}:host(.x-slider-disabled) .x-slider-track{background:var(--x-slider-track-bg-disabled, var(--x-color-text-quaternary, rgba(0, 0, 0, 0.25)))}:host(.x-slider-disabled) .x-slider-handle{border-color:var(--x-slider-handle-border-color-disabled, var(--x-color-text-quaternary, rgba(0, 0, 0, 0.25)));cursor:not-allowed;-webkit-box-shadow:none;box-shadow:none;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}:host(.x-slider-disabled) .x-slider-tooltip{display:none}`;
-
-const XSlider = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.xChange = index.createEvent(this, "xChange", 7);
-        this.xAfterChange = index.createEvent(this, "xAfterChange", 7);
-    }
-    get el() { return index.getElement(this); }
-    /* ---------------- PROPS ---------------- */
-    /**
-     * Minimum slider value.
-     * @example
-     * <x-slider min={0}></x-slider>
-     */
-    min = 0;
-    /**
-     * Maximum slider value.
-     * @example
-     * <x-slider max={100}></x-slider>
-     */
-    max = 100;
-    /**
-     * Step size between values, or null to use marks.
-     * @example
-     * <x-slider step={5}></x-slider>
-     */
-    step = 1;
-    /**
-     * Enable range mode with two thumbs.
-     * @example
-     * <x-slider range></x-slider>
-     */
-    range = false;
-    /**
-     * Render slider vertically.
-     * @example
-     * <x-slider vertical></x-slider>
-     */
-    vertical = false;
-    /**
-     * Disable interaction.
-     * @example
-     * <x-slider disabled></x-slider>
-     */
-    disabled = false;
-    /**
-     * Allow thumbs to cross in range mode.
-     * @example
-     * <x-slider range allowCross={false}></x-slider>
-     */
-    allowCross = true;
-    /**
-     * Push behavior or minimum distance between thumbs.
-     * @example
-     * <x-slider range pushable={10}></x-slider>
-     */
-    pushable = false;
-    /**
-     * Allow dragging the selected track in range mode.
-     * @example
-     * <x-slider range draggableTrack></x-slider>
-     */
-    draggableTrack = false;
-    /**
-     * Show tooltip values on handles.
-     * @example
-     * <x-slider tooltip={false}></x-slider>
-     */
-    tooltip = true;
-    /**
-     * Marks displayed on the rail.
-     * @example
-     * <x-slider marks={{ 0: '0', 100: '100' }}></x-slider>
-     */
-    marks = {};
-    /**
-     * Controlled value for slider.
-     * @example
-     * <x-slider value={50}></x-slider>
-     */
-    value;
-    /**
-     * Default value when uncontrolled.
-     * @example
-     * <x-slider defaultValue={20}></x-slider>
-     */
-    defaultValue = 0;
-    /* ---------------- STATE ---------------- */
-    /**
-     * Active thumb index while dragging.
-     */
-    activeThumb = null;
-    /**
-     * Whether a drag interaction is active.
-     */
-    isDragging = false;
-    /* ---------------- EVENTS ---------------- */
-    /**
-     * Emits on value change.
-     * @example
-     * <x-slider onXChange={(ev) => console.log(ev.detail)}></x-slider>
-     */
-    xChange;
-    /**
-     * Emits after drag interaction ends.
-     * @example
-     * <x-slider onXAfterChange={(ev) => console.log(ev.detail)}></x-slider>
-     */
-    xAfterChange;
-    /**
-     * Rail element reference for position calculations.
-     */
-    rail;
-    /* ---------------- LIFECYCLE ---------------- */
-    componentWillLoad() {
-        if (this.value === undefined) {
-            this.value = this.range
-                ? [this.min, this.max]
-                : this.defaultValue;
-        }
-    }
-    onValueChange() {
-        this.xChange.emit(this.value);
-    }
-    /* ---------------- UTIL ---------------- */
-    /**
-     * Clamp value within min and max.
-     * @param v - Input value.
-     * @returns number
-     * @example
-     * this.clamp(120)
-     */
-    clamp(v) {
-        return Math.min(this.max, Math.max(this.min, v));
-    }
-    /**
-     * Build list of steps based on step or marks.
-     * @returns number[]
-     * @example
-     * this.getSteps()
-     */
-    getSteps() {
-        if (this.step === null) {
-            return Object.keys(this.marks).map(Number);
-        }
-        const arr = [];
-        for (let v = this.min; v <= this.max; v += this.step) {
-            arr.push(v);
-        }
-        return arr;
-    }
-    /**
-     * Snap value to nearest step or mark.
-     * @param v - Raw value.
-     * @returns number
-     * @example
-     * this.snap(42)
-     */
-    snap(v) {
-        if (this.step === null) {
-            const steps = this.getSteps();
-            return steps.reduce((prev, curr) => Math.abs(curr - v) < Math.abs(prev - v) ? curr : prev);
-        }
-        return Math.round(v / this.step) * this.step;
-    }
-    /**
-     * Convert value to percentage along the rail.
-     * @param v - Value to convert.
-     * @returns number
-     * @example
-     * this.percent(50)
-     */
-    percent(v) {
-        return ((v - this.min) / (this.max - this.min)) * 100;
-    }
-    /**
-     * Calculates the slider value based on a mouse event.
-     *
-     * Flow:
-     * 1. Gets the bounding rectangle of the rail.
-     * 2. Calculates the ratio of the mouse position relative to the rail's width (or height if vertical).
-     * 3. Maps the ratio to the [min, max] range.
-     * 4. Clamps the value to ensure it stays within bounds.
-     * 5. Snaps the value to the nearest step.
-     *
-     * @param e - The mouse event.
-     * @returns number - The calculated value.
-     */
-    getValueFromEvent(e) {
-        const rect = this.rail.getBoundingClientRect();
-        const ratio = this.vertical
-            ? (rect.bottom - e.clientY) / rect.height
-            : (e.clientX - rect.left) / rect.width;
-        const v = this.min + this.clamp(ratio) * (this.max - this.min);
-        return this.snap(this.clamp(v));
-    }
-    /* ---------------- PUSH LOGIC ---------------- */
-    /**
-     * Enforces the `pushable` constraint between range thumbs.
-     * Ensures thumbs maintain a minimum distance from each other.
-     *
-     * @param values - Current range values [v1, v2].
-     * @param index - The index of the thumb actively being moved.
-     * @returns [number, number] - The adjusted values.
-     */
-    pushRange(values, index) {
-        if (!this.pushable)
-            return values;
-        const distance = typeof this.pushable === 'number' ? this.pushable : 1;
-        if (index === 0 && values[1] - values[0] < distance) {
-            values[1] = values[0] + distance;
-        }
-        if (index === 1 && values[1] - values[0] < distance) {
-            values[0] = values[1] - distance;
-        }
-        return values;
-    }
-    /* ---------------- MOUSE ---------------- */
-    /**
-     * Handles the mouse down event to initiate dragging.
-     *
-     * Flow:
-     * 1. Checks if disabled.
-     * 2. Sets `isDragging` flag.
-     * 3. Determines which thumb is active (closest to click if not specified).
-     * 4. Updates the value immediately.
-     * 5. Attaches global mouse listeners for drag and release.
-     *
-     * @param e - The mouse event.
-     * @param index - Optional index of the handle being clicked.
-     */
-    onMouseDown = (e, index) => {
-        if (this.disabled)
-            return;
-        this.isDragging = true;
-        if (this.range) {
-            this.activeThumb =
-                index ??
-                    this.getClosestThumb(this.getValueFromEvent(e));
-        }
-        this.updateValue(e);
-        document.addEventListener('mousemove', this.onMouseMove);
-        document.addEventListener('mouseup', this.onMouseUp);
-    };
-    /**
-     * Handles mouse move during drag.
-     * Updates the value if dragging is active.
-     */
-    onMouseMove = (e) => {
-        if (!this.isDragging)
-            return;
-        this.updateValue(e);
-    };
-    /**
-     * Handles mouse up to end drag.
-     * Clears state, emits final change event, and removes listeners.
-     */
-    onMouseUp = () => {
-        this.isDragging = false;
-        this.activeThumb = null;
-        this.xAfterChange.emit(this.value);
-        document.removeEventListener('mousemove', this.onMouseMove);
-        document.removeEventListener('mouseup', this.onMouseUp);
-    };
-    /**
-     * Updates the slider value logic during interaction.
-     *
-     * Flow:
-     * 1. Calculates new value from event.
-     * 2. If single mode, updates value directly.
-     * 3. If range mode:
-     *    - Handles track dragging (moving both thumbs).
-     *    - Handles individual thumb dragging.
-     *    - Enforces `allowCross` constraint (swapping thumbs if needed).
-     *    - Enforces `pushRange` constraint.
-     *
-     * @param e - The mouse event.
-     */
-    updateValue(e) {
-        const v = this.getValueFromEvent(e);
-        if (!this.range) {
-            this.value = v;
-            return;
-        }
-        let values = [...this.value];
-        if (this.draggableTrack && this.activeThumb === null) {
-            const diff = v - values[0];
-            values = [values[0] + diff, values[1] + diff];
-        }
-        else {
-            values[this.activeThumb] = v;
-            if (!this.allowCross) {
-                if (this.activeThumb === 0)
-                    values[0] = Math.min(values[0], values[1]);
-                else
-                    values[1] = Math.max(values[1], values[0]);
-            }
-            values = this.pushRange(values, this.activeThumb);
-        }
-        this.value = values;
-    }
-    /**
-     * Finds the index of the thumb closest to the given value.
-     * Used to determine which thumb to move when clicking on the rail.
-     *
-     * @param v - The target value.
-     * @returns number - 0 or 1.
-     */
-    getClosestThumb(v) {
-        const [v1, v2] = this.value;
-        return Math.abs(v - v1) < Math.abs(v - v2) ? 0 : 1;
-    }
-    /* ---------------- KEYBOARD ---------------- */
-    /**
-     * Handles keyboard navigation for fine-tuning values.
-     * Supports Arrow keys for stepping up/down.
-     *
-     * @param e - Keyboard event.
-     * @param index - Index of the handle focused.
-     */
-    onKeyDown = (e, index) => {
-        if (this.disabled)
-            return;
-        const delta = e.key === 'ArrowRight' || e.key === 'ArrowUp'
-            ? this.step ?? 1
-            : e.key === 'ArrowLeft' || e.key === 'ArrowDown'
-                ? -(this.step ?? 1)
-                : 0;
-        if (!delta)
-            return;
-        e.preventDefault();
-        if (!this.range) {
-            this.value = this.clamp(this.value + delta);
-        }
-        else {
-            const values = [...this.value];
-            values[index] = this.clamp(values[index] + delta);
-            this.value = values;
-        }
-    };
-    /* ---------------- RENDER ---------------- */
-    /**
-     * Renders the marks (ticks) along the slider rail.
-     *
-     * @returns JSX.Element[] - List of mark elements positioned by percentage.
-     */
-    renderMarks() {
-        return Object.entries(this.marks).map(([k, label]) => {
-            const percent = this.percent(Number(k));
-            return (index.h("div", { class: "x-slider-mark", style: {
-                    [this.vertical ? 'bottom' : 'left']: `${percent}%`,
-                } }, label));
-        });
-    }
-    /**
-     * Main render method for the Slider component.
-     *
-     * Structure:
-     * - Host element with classes for vertical/disabled state.
-     * - Rail: The background line.
-     * - Track: The active/colored segment indicating selected range.
-     * - Handles: Draggable knobs for interacting with values.
-     * - Marks: Optional labeled ticks.
-     *
-     * @returns JSX.Element
-     */
-    render() {
-        const values = this.range
-            ? this.value
-            : [this.value];
-        const p1 = this.percent(values[0]);
-        const p2 = this.range ? this.percent(values[1]) : p1;
-        return (index.h(index.Host, { key: '90fc23fbdcc78816be8c8d32d3e46e4687d3fad6', class: {
-                'x-slider': true,
-                'x-slider-vertical': this.vertical,
-                'x-slider-disabled': this.disabled,
-            } }, index.h("div", { key: '9ff4c3df41adfcd7cc3f7c65784fc569b6693ff3', class: "x-slider-rail", ref: el => (this.rail = el), onClick: e => this.onMouseDown(e) }), index.h("div", { key: '0c5f77c19a65e251e46d0393e626bfe96abd18c9', class: "x-slider-track", style: {
-                [this.vertical ? 'height' : 'width']: `${this.range ? p2 - p1 : p1}%`,
-                [this.vertical ? 'bottom' : 'left']: `${this.range ? p1 : 0}%`,
-            } }), values.map((v, i) => {
-            const percent = this.percent(v);
-            return (index.h("div", { class: "x-slider-handle", style: {
-                    [this.vertical ? 'bottom' : 'left']: `${percent}%`,
-                }, tabindex: 0, role: "slider", "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": v, onMouseDown: e => this.onMouseDown(e, i), onKeyDown: e => this.onKeyDown(e, i) }, this.tooltip && (index.h("div", { class: "x-slider-tooltip" }, v))));
-        }), index.h("div", { key: 'f3dd9f0c39947e115fd6160c1003cf48f93e97af', class: "x-slider-marks" }, this.renderMarks())));
-    }
-    static get watchers() { return {
-        "value": [{
-                "onValueChange": 0
-            }]
-    }; }
-};
-XSlider.style = xSliderCss();
-
-const xSwitchCss = () => `@charset "UTF-8";:root{--x-color-primary:#1677ff;--x-color-primary-rgb:22, 119, 255;--x-color-primary-contrast:#ffffff;--x-color-primary-contrast-rgb:255, 255, 255;--x-color-primary-shade:#0958d9;--x-color-primary-tint:#4096ff;--x-color-primary-bg:#e6f4ff;--x-color-primary-bg-hover:#bae0ff;--x-color-primary-border:#91caff;--x-color-primary-border-hover:#69b1ff;--x-color-primary-hover:#4096ff;--x-color-primary-active:#0958d9;--x-color-primary-text:#1677ff;--x-color-primary-text-hover:#4096ff;--x-color-primary-text-active:#0958d9;--x-color-secondary:#3dc2ff;--x-color-secondary-rgb:61, 194, 255;--x-color-secondary-contrast:#ffffff;--x-color-secondary-contrast-rgb:255, 255, 255;--x-color-secondary-shade:#36abe0;--x-color-secondary-tint:#50c8ff;--x-color-success:#52c41a;--x-color-success-rgb:82, 196, 26;--x-color-success-contrast:#ffffff;--x-color-success-contrast-rgb:255, 255, 255;--x-color-success-shade:#389e0d;--x-color-success-tint:#73d13d;--x-color-success-bg:#f6ffed;--x-color-success-bg-hover:#d9f7be;--x-color-success-border:#b7eb8f;--x-color-success-border-hover:#95de64;--x-color-success-hover:#73d13d;--x-color-success-active:#389e0d;--x-color-success-text:#52c41a;--x-color-success-text-hover:#73d13d;--x-color-success-text-active:#389e0d;--x-color-warning:#faad14;--x-color-warning-rgb:250, 173, 20;--x-color-warning-contrast:#000000;--x-color-warning-contrast-rgb:0, 0, 0;--x-color-warning-shade:#d48806;--x-color-warning-tint:#ffc53d;--x-color-warning-bg:#fffbe6;--x-color-warning-bg-hover:#fff1b8;--x-color-warning-border:#ffe58f;--x-color-warning-border-hover:#ffd666;--x-color-warning-hover:#ffc53d;--x-color-warning-active:#d48806;--x-color-warning-text:#faad14;--x-color-warning-text-hover:#ffc53d;--x-color-warning-text-active:#d48806;--x-color-danger:#ff4d4f;--x-color-danger-rgb:255, 77, 79;--x-color-danger-contrast:#ffffff;--x-color-danger-contrast-rgb:255, 255, 255;--x-color-danger-shade:#cf1322;--x-color-danger-tint:#ff7875;--x-color-error:#ff4d4f;--x-color-error-rgb:255, 77, 79;--x-color-error-bg:#fff2f0;--x-color-error-bg-hover:#ffccc7;--x-color-error-border:#ffa39e;--x-color-error-border-hover:#ff7875;--x-color-error-hover:#ff7875;--x-color-error-active:#d9363e;--x-color-error-text:#ff4d4f;--x-color-error-text-hover:#ff7875;--x-color-error-text-active:#d9363e;--x-color-info:#1677ff;--x-color-info-rgb:22, 119, 255;--x-color-info-bg:#e6f4ff;--x-color-info-bg-hover:#bae0ff;--x-color-info-border:#91caff;--x-color-info-border-hover:#69b1ff;--x-color-info-hover:#69b1ff;--x-color-info-active:#0958d9;--x-color-info-text:#1677ff;--x-color-info-text-hover:#69b1ff;--x-color-info-text-active:#0958d9;--x-color-text:rgba(0, 0, 0, 0.88);--x-color-text-secondary:rgba(0, 0, 0, 0.65);--x-color-text-tertiary:rgba(0, 0, 0, 0.45);--x-color-text-quaternary:rgba(0, 0, 0, 0.25);--x-color-text-disabled:rgba(0, 0, 0, 0.25);--x-color-text-placeholder:rgba(0, 0, 0, 0.25);--x-color-text-heading:rgba(0, 0, 0, 0.88);--x-color-text-label:rgba(0, 0, 0, 0.65);--x-color-text-description:rgba(0, 0, 0, 0.45);--x-color-text-light-solid:#ffffff;--x-color-bg-container:#ffffff;--x-color-bg-elevated:#ffffff;--x-color-bg-layout:#f5f5f5;--x-color-bg-spotlight:rgba(0, 0, 0, 0.85);--x-color-bg-mask:rgba(0, 0, 0, 0.45);--x-color-bg-base:#ffffff;--x-color-bg-container-disabled:#f5f5f5;--x-color-bg-container-loading:rgba(255, 255, 255, 0.65);--x-color-white:#ffffff;--x-color-fill:rgba(0, 0, 0, 0.15);--x-color-fill-secondary:rgba(0, 0, 0, 0.06);--x-color-fill-tertiary:rgba(0, 0, 0, 0.04);--x-color-fill-quaternary:rgba(0, 0, 0, 0.02);--x-color-border:#d9d9d9;--x-color-border-secondary:#f0f0f0;--x-color-border-bg:#ffffff;--x-color-split:rgba(5, 5, 5, 0.06);--x-color-dark:#222428;--x-color-dark-rgb:34, 36, 40;--x-color-dark-contrast:#ffffff;--x-color-dark-contrast-rgb:255, 255, 255;--x-color-dark-shade:#1e2023;--x-color-dark-tint:#383a3e;--x-color-medium:#92949c;--x-color-medium-rgb:146, 148, 156;--x-color-medium-contrast:#ffffff;--x-color-medium-contrast-rgb:255, 255, 255;--x-color-medium-shade:#808289;--x-color-medium-tint:#9d9fa6;--x-color-light:#f4f5f8;--x-color-light-rgb:244, 245, 248;--x-color-light-contrast:#000000;--x-color-light-contrast-rgb:0, 0, 0;--x-color-light-shade:#d7d8da;--x-color-light-tint:#f5f6f9;--x-font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--x-font-family-code:"SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;--x-font-size:14px;--x-font-size-sm:12px;--x-font-size-lg:16px;--x-font-size-xl:20px;--x-font-size-heading-1:38px;--x-font-size-heading-2:30px;--x-font-size-heading-3:24px;--x-font-size-heading-4:20px;--x-font-size-heading-5:16px;--x-line-height:1.5714285714285714;--x-line-height-lg:1.5;--x-line-height-sm:1.6666666666666667;--x-line-height-heading-1:1.2105263157894737;--x-line-height-heading-2:1.2666666666666666;--x-line-height-heading-3:1.3333333333333333;--x-line-height-heading-4:1.4;--x-line-height-heading-5:1.5;--x-font-weight-normal:400;--x-font-weight-medium:500;--x-font-weight-semibold:600;--x-font-weight-strong:600;--x-font-size-base:14px;--x-font-size-xxl:24px;--x-line-height-base:1.5714285714285714;--x-spacing-xxs:4px;--x-spacing-xs:8px;--x-spacing-sm:12px;--x-spacing-md:16px;--x-spacing-lg:20px;--x-spacing-xl:24px;--x-spacing-xxl:32px;--x-spacing-xxxl:48px;--x-margin-xxs:4px;--x-margin-xs:8px;--x-margin-sm:12px;--x-margin-md:16px;--x-margin-lg:24px;--x-margin-xl:32px;--x-margin-xxl:48px;--x-padding-xxs:4px;--x-padding-xs:8px;--x-padding-sm:12px;--x-padding-md:16px;--x-padding-lg:24px;--x-padding-content-horizontal-lg:24px;--x-padding-content-vertical-lg:12px;--x-padding-content-horizontal:16px;--x-padding-content-vertical:12px;--x-padding-content-horizontal-sm:16px;--x-padding-content-vertical-sm:8px;--x-border-radius:6px;--x-border-radius-xs:2px;--x-border-radius-sm:4px;--x-border-radius-lg:8px;--x-border-radius-xl:12px;--x-border-radius-outer:4px;--x-border-radius-base:6px;--x-border-width:1px;--x-border-width-base:1px;--x-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-shadow-lg:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-box-shadow-popover-arrow:2px 2px 5px rgba(0, 0, 0, 0.05);--x-box-shadow-card:0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);--x-box-shadow-drawer-right:-6px 0 16px 0 rgba(0, 0, 0, 0.08), -3px 0 6px -4px rgba(0, 0, 0, 0.12), -9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-left:6px 0 16px 0 rgba(0, 0, 0, 0.08), 3px 0 6px -4px rgba(0, 0, 0, 0.12), 9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-up:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-down:0 -6px 16px 0 rgba(0, 0, 0, 0.08), 0 -3px 6px -4px rgba(0, 0, 0, 0.12), 0 -9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tabs-overflow-left:inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-right:inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-top:inset 0 10px 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-bottom:inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08);--x-motion-duration-fast:0.1s;--x-motion-duration-mid:0.2s;--x-motion-duration-slow:0.3s;--x-motion-ease-in-out:cubic-bezier(0.645, 0.045, 0.355, 1);--x-motion-ease-out:cubic-bezier(0.215, 0.61, 0.355, 1);--x-motion-ease-in:cubic-bezier(0.55, 0.055, 0.675, 0.19);--x-motion-ease-out-back:cubic-bezier(0.12, 0.4, 0.29, 1.46);--x-motion-ease-in-back:cubic-bezier(0.71, -0.46, 0.88, 0.6);--x-motion-ease-in-out-circle:cubic-bezier(0.78, 0.14, 0.15, 0.86);--x-motion-ease-out-circle:cubic-bezier(0.08, 0.82, 0.17, 1);--x-motion-ease-in-circle:cubic-bezier(0.6, 0.04, 0.98, 0.34);--x-motion-ease-in-quint:cubic-bezier(0.755, 0.05, 0.855, 0.06);--x-motion-ease-out-quint:cubic-bezier(0.23, 1, 0.32, 1);--x-z-index-base:0;--x-z-index-popup-base:1000;--x-z-index-popup:1030;--x-z-index-affix:10;--x-z-index-modal:1000;--x-z-index-modal-mask:1000;--x-z-index-drawer:1000;--x-z-index-popover:1030;--x-z-index-dropdown:1050;--x-z-index-tooltip:1070;--x-z-index-notification:1080;--x-z-index-message:1090;--x-z-index-popconfirm:1060;--x-z-index-table-fixed:10;--x-opacity-loading:0.65;--x-opacity-image:1;--x-opacity-disabled:0.5;--x-control-height:32px;--x-control-height-xs:24px;--x-control-height-sm:24px;--x-control-height-lg:40px;--x-control-radio-size:16px;--x-control-checkbox-size:16px;--x-control-padding-horizontal:12px;--x-control-padding-horizontal-sm:8px;--x-control-outline-width:2px;--x-control-outline:rgba(5, 145, 255, 0.1);--x-control-item-bg-hover:rgba(0, 0, 0, 0.04);--x-control-item-bg-active:#e6f4ff;--x-control-item-bg-active-hover:#bae0ff;--x-control-item-bg-active-disabled:rgba(0, 0, 0, 0.15);--x-control-tmp-outline:rgba(0, 0, 0, 0.02);--x-color-yellow:#fadb14;--x-color-yellow-rgb:250, 219, 20;--x-font-family-base:var(--x-font-family);--x-color-link:#1677ff;--x-color-link-hover:#69b1ff;--x-color-link-active:#0958d9;--x-color-icon:rgba(0, 0, 0, 0.45);--x-color-icon-hover:rgba(0, 0, 0, 0.88);--x-color-highlight:#ff4d4f;--x-color-bg-text-hover:rgba(0, 0, 0, 0.06);--x-color-bg-text-active:rgba(0, 0, 0, 0.15);--x-screen-xs:480px;--x-screen-xs-min:480px;--x-screen-xs-max:575px;--x-screen-sm:576px;--x-screen-sm-min:576px;--x-screen-sm-max:767px;--x-screen-md:768px;--x-screen-md-min:768px;--x-screen-md-max:991px;--x-screen-lg:992px;--x-screen-lg-min:992px;--x-screen-lg-max:1199px;--x-screen-xl:1200px;--x-screen-xl-min:1200px;--x-screen-xl-max:1599px;--x-screen-xxl:1600px;--x-screen-xxl-min:1600px;--x-color-fill-content:rgba(0, 0, 0, 0.06);--x-color-fill-content-hover:rgba(0, 0, 0, 0.15);--x-color-fill-alter:rgba(0, 0, 0, 0.02);--x-scrollbar-width:12px;--x-scrollbar-track-bg:rgba(0, 0, 0, 0.04);--x-scrollbar-thumb-bg:rgba(0, 0, 0, 0.25);--x-scrollbar-thumb-bg-hover:rgba(0, 0, 0, 0.35);--x-menu-dark-bg:#001529;--x-menu-dark-item-bg:#001529;--x-menu-dark-popup-bg:#001529;--x-menu-dark-submenu-item-bg:#000c17}:host{margin:0;padding:0;color:var(--x-switch-inner-color, var(--x-color-white, #ffffff));font-size:var(--x-switch-font-size, var(--x-font-size-sm, 12px));line-height:var(--x-switch-height, 22px);list-style:none;position:relative;display:inline-block;min-width:var(--x-switch-min-width, 44px);height:var(--x-switch-height, 22px);vertical-align:middle;background:var(--x-switch-bg, var(--x-color-text-quaternary, rgba(0, 0, 0, 0.25)));border:0;border-radius:100px;cursor:pointer;-webkit-transition:all var(--x-switch-motion-duration, var(--x-motion-duration-fast, 0.1s)) var(--x-switch-motion-timing, ease-in-out);transition:all var(--x-switch-motion-duration, var(--x-motion-duration-fast, 0.1s)) var(--x-switch-motion-timing, ease-in-out);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host(.x-switch-checked){background:var(--x-switch-bg-checked, var(--x-color-primary, #1677ff))}:host(.x-switch-checked):not(.x-switch-disabled):not(.x-switch-loading):hover{background:var(--x-switch-bg-checked-hover, var(--x-color-primary-hover, #4096ff))}:host(.x-switch-disabled){cursor:not-allowed;opacity:var(--x-switch-opacity-disabled, var(--x-opacity-disabled, 0.65))}:host(.x-switch-loading){cursor:not-allowed;opacity:var(--x-switch-opacity-disabled, var(--x-opacity-disabled, 0.65))}.x-switch-handle{position:absolute;top:var(--x-switch-handle-offset, 2px);left:var(--x-switch-handle-offset, 2px);width:var(--x-switch-handle-size, 18px);height:var(--x-switch-handle-size, 18px);background:var(--x-switch-handle-bg, var(--x-color-white, #ffffff));border-radius:var(--x-switch-handle-size, 18px);-webkit-transition:all var(--x-switch-motion-duration, var(--x-motion-duration-fast, 0.1s)) var(--x-switch-motion-timing, ease-in-out);transition:all var(--x-switch-motion-duration, var(--x-motion-duration-fast, 0.1s)) var(--x-switch-motion-timing, ease-in-out);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.x-switch-handle::before{position:absolute;top:0;right:0;bottom:0;left:0;background-color:transparent;border-radius:calc(var(--x-switch-handle-size, 18px) / 2);-webkit-box-shadow:var(--x-switch-handle-shadow, var(--x-shadow-tertiary, 0 2px 4px 0 rgba(0, 21, 41, 0.08)));box-shadow:var(--x-switch-handle-shadow, var(--x-shadow-tertiary, 0 2px 4px 0 rgba(0, 21, 41, 0.08)));-webkit-transition:all var(--x-switch-motion-duration, var(--x-motion-duration-fast, 0.1s)) var(--x-switch-motion-timing, ease-in-out);transition:all var(--x-switch-motion-duration, var(--x-motion-duration-fast, 0.1s)) var(--x-switch-motion-timing, ease-in-out);content:""}:host(.x-switch-checked) .x-switch-handle{left:calc(100% - var(--x-switch-handle-size, 18px) - var(--x-switch-handle-offset, 2px))}.x-switch-inner{display:block;margin:0 7px 0 25px;color:var(--x-switch-inner-color, var(--x-color-white, #ffffff));font-size:var(--x-switch-font-size, var(--x-font-size-sm, 12px));-webkit-transition:margin var(--x-switch-motion-duration, var(--x-motion-duration-fast, 0.1s)) var(--x-switch-motion-timing, ease-in-out);transition:margin var(--x-switch-motion-duration, var(--x-motion-duration-fast, 0.1s)) var(--x-switch-motion-timing, ease-in-out)}:host(.x-switch-checked) .x-switch-inner{margin:0 25px 0 7px}:host(.x-switch-small){min-width:var(--x-switch-min-width-sm, 28px);height:var(--x-switch-height-sm, 16px);line-height:var(--x-switch-height-sm, 16px)}:host(.x-switch-small) .x-switch-handle{width:var(--x-switch-handle-size-sm, 12px);height:var(--x-switch-handle-size-sm, 12px)}:host(.x-switch-small.x-switch-checked) .x-switch-handle{left:calc(100% - var(--x-switch-handle-size-sm, 12px) - var(--x-switch-handle-offset, 2px))}:host(.x-switch-small) .x-switch-inner{margin:0 5px 0 18px}:host(.x-switch-small.x-switch-checked) .x-switch-inner{margin:0 18px 0 5px}.x-switch-loading-icon{color:var(--x-switch-loading-color, var(--x-color-text-secondary, rgba(0, 0, 0, 0.45)));font-size:var(--x-switch-font-size, var(--x-font-size-sm, 12px))}@-webkit-keyframes loadingCircle{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes loadingCircle{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.anticon-spin{display:inline-block;-webkit-animation:loadingCircle 1s infinite linear;animation:loadingCircle 1s infinite linear}`;
-
-const XSwitch = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.xChange = index.createEvent(this, "xChange", 7);
-        this.xClick = index.createEvent(this, "xClick", 7);
-    }
-    /**
-     * Whether the switch is automatically focused.
-     * @example
-     * <x-switch autoFocus></x-switch>
-     */
-    autoFocus = false;
-    /**
-     * Determine whether the Switch is checked.
-     * @example
-     * <x-switch checked></x-switch>
-     */
-    checked = false;
-    /**
-     * The content to be shown when the state is checked.
-     * @example
-     * <x-switch checkedChildren="On"></x-switch>
-     */
-    checkedChildren;
-    /**
-     * Whether to set the initial state.
-     * @example
-     * <x-switch defaultChecked></x-switch>
-     */
-    defaultChecked = false;
-    /**
-     * Disable switch.
-     * @example
-     * <x-switch disabled></x-switch>
-     */
-    disabled = false;
-    /**
-     * Loading state of switch.
-     * @example
-     * <x-switch loading></x-switch>
-     */
-    loading = false;
-    /**
-     * The size of the Switch.
-     * @example
-     * <x-switch size="small"></x-switch>
-     */
-    size = 'default';
-    /**
-     * The content to be shown when the state is unchecked.
-     * @example
-     * <x-switch unCheckedChildren="Off"></x-switch>
-     */
-    unCheckedChildren;
-    /**
-     * Emits when checked state changes.
-     * @example
-     * <x-switch onXChange={(ev) => console.log(ev.detail)}></x-switch>
-     */
-    xChange;
-    /**
-     * Emits when switch is clicked.
-     * @example
-     * <x-switch onXClick={(ev) => console.log(ev.detail)}></x-switch>
-     */
-    xClick;
-    /**
-     * Component lifecycle method called before loading.
-     * Initializes the checked state if `defaultChecked` is true.
-     */
-    componentWillLoad() {
-        if (this.defaultChecked) {
-            this.checked = true;
-        }
-    }
-    /**
-     * Handles click events to toggle the switch state.
-     *
-     * Flow:
-     * 1. Checks if disabled or loading; if so, returns immediately.
-     * 2. Toggles the `checked` state.
-     * 3. Emits `xChange` with the new boolean state.
-     * 4. Emits `xClick` with the original event.
-     *
-     * @param e - The click event.
-     */
-    handleClick(e) {
-        if (this.disabled || this.loading)
-            return;
-        this.checked = !this.checked;
-        this.xChange.emit(this.checked);
-        this.xClick.emit(e);
-    }
-    /**
-     * Renders the Switch component.
-     *
-     * Structure:
-     * - Host element serves as the container and click target.
-     * - Handle: The moving circle part (contains loading spinner if active).
-     * - Inner: The text label (On/Off) depending on checked state.
-     *
-     * @returns JSX.Element
-     */
-    render() {
-        return (index.h(index.Host, { key: '1503ee5789c9b75305a76eac0e2eece6c2422fa0', class: {
-                'x-switch': true,
-                'x-switch-checked': this.checked,
-                'x-switch-disabled': this.disabled,
-                'x-switch-loading': this.loading,
-                'x-switch-small': this.size === 'small',
-            }, onClick: (e) => this.handleClick(e) }, index.h("div", { key: 'b6ff513a02e20c628773c7424536c59b1e279f40', class: "x-switch-handle" }, this.loading && (index.h("span", { key: '79ae4f5fe973ef32f912eddcd312016eb7d43113', role: "img", "aria-label": "loading", class: "anticon anticon-loading x-switch-loading-icon" }, index.h("svg", { key: 'cc4f860e48867197507817752d901e6b4439aed4', viewBox: "0 0 1024 1024", focusable: "false", "data-icon": "loading", width: "1em", height: "1em", fill: "currentColor", "aria-hidden": "true", class: "anticon-spin" }, index.h("path", { key: '61d09ab8a2b080403e93bafb51e59c1624258097', d: "M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z" }))))), index.h("span", { key: '6bc8ccdd4d4468eae859ed05618a037fe8c324b9', class: "x-switch-inner" }, this.checked ? this.checkedChildren : this.unCheckedChildren)));
-    }
-};
-XSwitch.style = xSwitchCss();
-
-const xTooltipCss = () => `@charset "UTF-8";:root{--x-color-primary:#1677ff;--x-color-primary-rgb:22, 119, 255;--x-color-primary-contrast:#ffffff;--x-color-primary-contrast-rgb:255, 255, 255;--x-color-primary-shade:#0958d9;--x-color-primary-tint:#4096ff;--x-color-primary-bg:#e6f4ff;--x-color-primary-bg-hover:#bae0ff;--x-color-primary-border:#91caff;--x-color-primary-border-hover:#69b1ff;--x-color-primary-hover:#4096ff;--x-color-primary-active:#0958d9;--x-color-primary-text:#1677ff;--x-color-primary-text-hover:#4096ff;--x-color-primary-text-active:#0958d9;--x-color-secondary:#3dc2ff;--x-color-secondary-rgb:61, 194, 255;--x-color-secondary-contrast:#ffffff;--x-color-secondary-contrast-rgb:255, 255, 255;--x-color-secondary-shade:#36abe0;--x-color-secondary-tint:#50c8ff;--x-color-success:#52c41a;--x-color-success-rgb:82, 196, 26;--x-color-success-contrast:#ffffff;--x-color-success-contrast-rgb:255, 255, 255;--x-color-success-shade:#389e0d;--x-color-success-tint:#73d13d;--x-color-success-bg:#f6ffed;--x-color-success-bg-hover:#d9f7be;--x-color-success-border:#b7eb8f;--x-color-success-border-hover:#95de64;--x-color-success-hover:#73d13d;--x-color-success-active:#389e0d;--x-color-success-text:#52c41a;--x-color-success-text-hover:#73d13d;--x-color-success-text-active:#389e0d;--x-color-warning:#faad14;--x-color-warning-rgb:250, 173, 20;--x-color-warning-contrast:#000000;--x-color-warning-contrast-rgb:0, 0, 0;--x-color-warning-shade:#d48806;--x-color-warning-tint:#ffc53d;--x-color-warning-bg:#fffbe6;--x-color-warning-bg-hover:#fff1b8;--x-color-warning-border:#ffe58f;--x-color-warning-border-hover:#ffd666;--x-color-warning-hover:#ffc53d;--x-color-warning-active:#d48806;--x-color-warning-text:#faad14;--x-color-warning-text-hover:#ffc53d;--x-color-warning-text-active:#d48806;--x-color-danger:#ff4d4f;--x-color-danger-rgb:255, 77, 79;--x-color-danger-contrast:#ffffff;--x-color-danger-contrast-rgb:255, 255, 255;--x-color-danger-shade:#cf1322;--x-color-danger-tint:#ff7875;--x-color-error:#ff4d4f;--x-color-error-rgb:255, 77, 79;--x-color-error-bg:#fff2f0;--x-color-error-bg-hover:#ffccc7;--x-color-error-border:#ffa39e;--x-color-error-border-hover:#ff7875;--x-color-error-hover:#ff7875;--x-color-error-active:#d9363e;--x-color-error-text:#ff4d4f;--x-color-error-text-hover:#ff7875;--x-color-error-text-active:#d9363e;--x-color-info:#1677ff;--x-color-info-rgb:22, 119, 255;--x-color-info-bg:#e6f4ff;--x-color-info-bg-hover:#bae0ff;--x-color-info-border:#91caff;--x-color-info-border-hover:#69b1ff;--x-color-info-hover:#69b1ff;--x-color-info-active:#0958d9;--x-color-info-text:#1677ff;--x-color-info-text-hover:#69b1ff;--x-color-info-text-active:#0958d9;--x-color-text:rgba(0, 0, 0, 0.88);--x-color-text-secondary:rgba(0, 0, 0, 0.65);--x-color-text-tertiary:rgba(0, 0, 0, 0.45);--x-color-text-quaternary:rgba(0, 0, 0, 0.25);--x-color-text-disabled:rgba(0, 0, 0, 0.25);--x-color-text-placeholder:rgba(0, 0, 0, 0.25);--x-color-text-heading:rgba(0, 0, 0, 0.88);--x-color-text-label:rgba(0, 0, 0, 0.65);--x-color-text-description:rgba(0, 0, 0, 0.45);--x-color-text-light-solid:#ffffff;--x-color-bg-container:#ffffff;--x-color-bg-elevated:#ffffff;--x-color-bg-layout:#f5f5f5;--x-color-bg-spotlight:rgba(0, 0, 0, 0.85);--x-color-bg-mask:rgba(0, 0, 0, 0.45);--x-color-bg-base:#ffffff;--x-color-bg-container-disabled:#f5f5f5;--x-color-bg-container-loading:rgba(255, 255, 255, 0.65);--x-color-white:#ffffff;--x-color-fill:rgba(0, 0, 0, 0.15);--x-color-fill-secondary:rgba(0, 0, 0, 0.06);--x-color-fill-tertiary:rgba(0, 0, 0, 0.04);--x-color-fill-quaternary:rgba(0, 0, 0, 0.02);--x-color-border:#d9d9d9;--x-color-border-secondary:#f0f0f0;--x-color-border-bg:#ffffff;--x-color-split:rgba(5, 5, 5, 0.06);--x-color-dark:#222428;--x-color-dark-rgb:34, 36, 40;--x-color-dark-contrast:#ffffff;--x-color-dark-contrast-rgb:255, 255, 255;--x-color-dark-shade:#1e2023;--x-color-dark-tint:#383a3e;--x-color-medium:#92949c;--x-color-medium-rgb:146, 148, 156;--x-color-medium-contrast:#ffffff;--x-color-medium-contrast-rgb:255, 255, 255;--x-color-medium-shade:#808289;--x-color-medium-tint:#9d9fa6;--x-color-light:#f4f5f8;--x-color-light-rgb:244, 245, 248;--x-color-light-contrast:#000000;--x-color-light-contrast-rgb:0, 0, 0;--x-color-light-shade:#d7d8da;--x-color-light-tint:#f5f6f9;--x-font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--x-font-family-code:"SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;--x-font-size:14px;--x-font-size-sm:12px;--x-font-size-lg:16px;--x-font-size-xl:20px;--x-font-size-heading-1:38px;--x-font-size-heading-2:30px;--x-font-size-heading-3:24px;--x-font-size-heading-4:20px;--x-font-size-heading-5:16px;--x-line-height:1.5714285714285714;--x-line-height-lg:1.5;--x-line-height-sm:1.6666666666666667;--x-line-height-heading-1:1.2105263157894737;--x-line-height-heading-2:1.2666666666666666;--x-line-height-heading-3:1.3333333333333333;--x-line-height-heading-4:1.4;--x-line-height-heading-5:1.5;--x-font-weight-normal:400;--x-font-weight-medium:500;--x-font-weight-semibold:600;--x-font-weight-strong:600;--x-font-size-base:14px;--x-font-size-xxl:24px;--x-line-height-base:1.5714285714285714;--x-spacing-xxs:4px;--x-spacing-xs:8px;--x-spacing-sm:12px;--x-spacing-md:16px;--x-spacing-lg:20px;--x-spacing-xl:24px;--x-spacing-xxl:32px;--x-spacing-xxxl:48px;--x-margin-xxs:4px;--x-margin-xs:8px;--x-margin-sm:12px;--x-margin-md:16px;--x-margin-lg:24px;--x-margin-xl:32px;--x-margin-xxl:48px;--x-padding-xxs:4px;--x-padding-xs:8px;--x-padding-sm:12px;--x-padding-md:16px;--x-padding-lg:24px;--x-padding-content-horizontal-lg:24px;--x-padding-content-vertical-lg:12px;--x-padding-content-horizontal:16px;--x-padding-content-vertical:12px;--x-padding-content-horizontal-sm:16px;--x-padding-content-vertical-sm:8px;--x-border-radius:6px;--x-border-radius-xs:2px;--x-border-radius-sm:4px;--x-border-radius-lg:8px;--x-border-radius-xl:12px;--x-border-radius-outer:4px;--x-border-radius-base:6px;--x-border-width:1px;--x-border-width-base:1px;--x-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-shadow-lg:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-box-shadow-popover-arrow:2px 2px 5px rgba(0, 0, 0, 0.05);--x-box-shadow-card:0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);--x-box-shadow-drawer-right:-6px 0 16px 0 rgba(0, 0, 0, 0.08), -3px 0 6px -4px rgba(0, 0, 0, 0.12), -9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-left:6px 0 16px 0 rgba(0, 0, 0, 0.08), 3px 0 6px -4px rgba(0, 0, 0, 0.12), 9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-up:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-down:0 -6px 16px 0 rgba(0, 0, 0, 0.08), 0 -3px 6px -4px rgba(0, 0, 0, 0.12), 0 -9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tabs-overflow-left:inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-right:inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-top:inset 0 10px 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-bottom:inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08);--x-motion-duration-fast:0.1s;--x-motion-duration-mid:0.2s;--x-motion-duration-slow:0.3s;--x-motion-ease-in-out:cubic-bezier(0.645, 0.045, 0.355, 1);--x-motion-ease-out:cubic-bezier(0.215, 0.61, 0.355, 1);--x-motion-ease-in:cubic-bezier(0.55, 0.055, 0.675, 0.19);--x-motion-ease-out-back:cubic-bezier(0.12, 0.4, 0.29, 1.46);--x-motion-ease-in-back:cubic-bezier(0.71, -0.46, 0.88, 0.6);--x-motion-ease-in-out-circle:cubic-bezier(0.78, 0.14, 0.15, 0.86);--x-motion-ease-out-circle:cubic-bezier(0.08, 0.82, 0.17, 1);--x-motion-ease-in-circle:cubic-bezier(0.6, 0.04, 0.98, 0.34);--x-motion-ease-in-quint:cubic-bezier(0.755, 0.05, 0.855, 0.06);--x-motion-ease-out-quint:cubic-bezier(0.23, 1, 0.32, 1);--x-z-index-base:0;--x-z-index-popup-base:1000;--x-z-index-popup:1030;--x-z-index-affix:10;--x-z-index-modal:1000;--x-z-index-modal-mask:1000;--x-z-index-drawer:1000;--x-z-index-popover:1030;--x-z-index-dropdown:1050;--x-z-index-tooltip:1070;--x-z-index-notification:1080;--x-z-index-message:1090;--x-z-index-popconfirm:1060;--x-z-index-table-fixed:10;--x-opacity-loading:0.65;--x-opacity-image:1;--x-opacity-disabled:0.5;--x-control-height:32px;--x-control-height-xs:24px;--x-control-height-sm:24px;--x-control-height-lg:40px;--x-control-radio-size:16px;--x-control-checkbox-size:16px;--x-control-padding-horizontal:12px;--x-control-padding-horizontal-sm:8px;--x-control-outline-width:2px;--x-control-outline:rgba(5, 145, 255, 0.1);--x-control-item-bg-hover:rgba(0, 0, 0, 0.04);--x-control-item-bg-active:#e6f4ff;--x-control-item-bg-active-hover:#bae0ff;--x-control-item-bg-active-disabled:rgba(0, 0, 0, 0.15);--x-control-tmp-outline:rgba(0, 0, 0, 0.02);--x-color-yellow:#fadb14;--x-color-yellow-rgb:250, 219, 20;--x-font-family-base:var(--x-font-family);--x-color-link:#1677ff;--x-color-link-hover:#69b1ff;--x-color-link-active:#0958d9;--x-color-icon:rgba(0, 0, 0, 0.45);--x-color-icon-hover:rgba(0, 0, 0, 0.88);--x-color-highlight:#ff4d4f;--x-color-bg-text-hover:rgba(0, 0, 0, 0.06);--x-color-bg-text-active:rgba(0, 0, 0, 0.15);--x-screen-xs:480px;--x-screen-xs-min:480px;--x-screen-xs-max:575px;--x-screen-sm:576px;--x-screen-sm-min:576px;--x-screen-sm-max:767px;--x-screen-md:768px;--x-screen-md-min:768px;--x-screen-md-max:991px;--x-screen-lg:992px;--x-screen-lg-min:992px;--x-screen-lg-max:1199px;--x-screen-xl:1200px;--x-screen-xl-min:1200px;--x-screen-xl-max:1599px;--x-screen-xxl:1600px;--x-screen-xxl-min:1600px;--x-color-fill-content:rgba(0, 0, 0, 0.06);--x-color-fill-content-hover:rgba(0, 0, 0, 0.15);--x-color-fill-alter:rgba(0, 0, 0, 0.02);--x-scrollbar-width:12px;--x-scrollbar-track-bg:rgba(0, 0, 0, 0.04);--x-scrollbar-thumb-bg:rgba(0, 0, 0, 0.25);--x-scrollbar-thumb-bg-hover:rgba(0, 0, 0, 0.35);--x-menu-dark-bg:#001529;--x-menu-dark-item-bg:#001529;--x-menu-dark-popup-bg:#001529;--x-menu-dark-submenu-item-bg:#000c17}:host{display:inline-block;position:relative;font-family:var(--x-tooltip-font-family, var(--x-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif))}.x-tooltip-trigger{display:inline-block}.x-tooltip{position:absolute;z-index:var(--x-tooltip-z-index, var(--x-tooltip-z-index, var(--x-z-index-tooltip, 1070)));display:block;visibility:visible;font-size:var(--x-tooltip-font-size, var(--x-font-size, 14px));line-height:var(--x-tooltip-line-height, var(--x-line-height, 1.5714));word-wrap:break-word;opacity:1;-webkit-transition:opacity var(--x-tooltip-motion-duration, var(--x-motion-duration-slow, 0.3s)), visibility var(--x-tooltip-motion-duration, var(--x-motion-duration-slow, 0.3s));transition:opacity var(--x-tooltip-motion-duration, var(--x-motion-duration-slow, 0.3s)), visibility var(--x-tooltip-motion-duration, var(--x-motion-duration-slow, 0.3s));white-space:nowrap;max-width:var(--x-tooltip-max-width, 250px);pointer-events:none}.x-tooltip.x-tooltip-hidden{opacity:0;visibility:hidden;pointer-events:none}.x-tooltip-inner{min-width:var(--x-tooltip-min-width, 30px);min-height:var(--x-tooltip-min-height, var(--x-control-height, 32px));padding:var(--x-tooltip-padding-block, var(--x-spacing-xxs, 4px)) var(--x-tooltip-padding-inline, var(--x-spacing-xs, 8px));color:var(--x-tooltip-color, var(--x-color-white, #ffffff));text-align:left;text-decoration:none;word-wrap:break-word;background-color:var(--x-tooltip-color, var(--x-tooltip-bg, var(--x-color-bg-spotlight, rgba(0, 0, 0, 0.85))));border-radius:var(--x-tooltip-border-radius, var(--x-border-radius-xs, 4px));-webkit-box-shadow:var(--x-tooltip-shadow, var(--x-shadow-secondary, 0 6px 16px 0 rgba(0, 0, 0, 0.08)));box-shadow:var(--x-tooltip-shadow, var(--x-shadow-secondary, 0 6px 16px 0 rgba(0, 0, 0, 0.08)))}.x-tooltip-arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid}.x-tooltip-placement-top{bottom:100%;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);padding-bottom:var(--x-tooltip-offset, var(--x-spacing-xs, 8px))}.x-tooltip-placement-top .x-tooltip-arrow{bottom:var(--x-tooltip-arrow-offset-vertical, 3px);left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);border-width:var(--x-tooltip-arrow-size, 5px) var(--x-tooltip-arrow-size, 5px) 0;border-top-color:var(--x-tooltip-color, var(--x-tooltip-bg, var(--x-color-bg-spotlight, rgba(0, 0, 0, 0.85))))}.x-tooltip-placement-topLeft{bottom:100%;left:0;padding-bottom:var(--x-tooltip-offset, var(--x-spacing-xs, 8px))}.x-tooltip-placement-topLeft .x-tooltip-arrow{bottom:var(--x-tooltip-arrow-offset-vertical, 3px);left:var(--x-tooltip-arrow-offset-horizontal, 16px);border-width:var(--x-tooltip-arrow-size, 5px) var(--x-tooltip-arrow-size, 5px) 0;border-top-color:var(--x-tooltip-color, var(--x-tooltip-bg, var(--x-color-bg-spotlight, rgba(0, 0, 0, 0.85))))}.x-tooltip-placement-topRight{bottom:100%;right:0;padding-bottom:var(--x-tooltip-offset, var(--x-spacing-xs, 8px))}.x-tooltip-placement-topRight .x-tooltip-arrow{bottom:var(--x-tooltip-arrow-offset-vertical, 3px);right:var(--x-tooltip-arrow-offset-horizontal, 16px);border-width:var(--x-tooltip-arrow-size, 5px) var(--x-tooltip-arrow-size, 5px) 0;border-top-color:var(--x-tooltip-color, var(--x-tooltip-bg, var(--x-color-bg-spotlight, rgba(0, 0, 0, 0.85))))}.x-tooltip-placement-bottom{top:100%;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);padding-top:var(--x-tooltip-offset, var(--x-spacing-xs, 8px))}.x-tooltip-placement-bottom .x-tooltip-arrow{top:var(--x-tooltip-arrow-offset-vertical, 3px);left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);border-width:0 var(--x-tooltip-arrow-size, 5px) var(--x-tooltip-arrow-size, 5px);border-bottom-color:var(--x-tooltip-color, var(--x-tooltip-bg, var(--x-color-bg-spotlight, rgba(0, 0, 0, 0.85))))}.x-tooltip-placement-bottomLeft{top:100%;left:0;padding-top:var(--x-tooltip-offset, var(--x-spacing-xs, 8px))}.x-tooltip-placement-bottomLeft .x-tooltip-arrow{top:var(--x-tooltip-arrow-offset-vertical, 3px);left:var(--x-tooltip-arrow-offset-horizontal, 16px);border-width:0 var(--x-tooltip-arrow-size, 5px) var(--x-tooltip-arrow-size, 5px);border-bottom-color:var(--x-tooltip-color, var(--x-tooltip-bg, var(--x-color-bg-spotlight, rgba(0, 0, 0, 0.85))))}.x-tooltip-placement-bottomRight{top:100%;right:0;padding-top:var(--x-tooltip-offset, var(--x-spacing-xs, 8px))}.x-tooltip-placement-bottomRight .x-tooltip-arrow{top:var(--x-tooltip-arrow-offset-vertical, 3px);right:var(--x-tooltip-arrow-offset-horizontal, 16px);border-width:0 var(--x-tooltip-arrow-size, 5px) var(--x-tooltip-arrow-size, 5px);border-bottom-color:var(--x-tooltip-color, var(--x-tooltip-bg, var(--x-color-bg-spotlight, rgba(0, 0, 0, 0.85))))}.x-tooltip-placement-left{right:100%;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);padding-right:var(--x-tooltip-offset, var(--x-spacing-xs, 8px))}.x-tooltip-placement-left .x-tooltip-arrow{right:var(--x-tooltip-arrow-offset-vertical, 3px);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);border-width:var(--x-tooltip-arrow-size, 5px) 0 var(--x-tooltip-arrow-size, 5px) var(--x-tooltip-arrow-size, 5px);border-left-color:var(--x-tooltip-color, var(--x-tooltip-bg, var(--x-color-bg-spotlight, rgba(0, 0, 0, 0.85))))}.x-tooltip-placement-leftTop{right:100%;top:0;padding-right:var(--x-tooltip-offset, var(--x-spacing-xs, 8px))}.x-tooltip-placement-leftTop .x-tooltip-arrow{right:var(--x-tooltip-arrow-offset-vertical, 3px);top:var(--x-tooltip-arrow-edge-offset, 8px);border-width:var(--x-tooltip-arrow-size, 5px) 0 var(--x-tooltip-arrow-size, 5px) var(--x-tooltip-arrow-size, 5px);border-left-color:var(--x-tooltip-color, var(--x-tooltip-bg, var(--x-color-bg-spotlight, rgba(0, 0, 0, 0.85))))}.x-tooltip-placement-leftBottom{right:100%;bottom:0;padding-right:var(--x-tooltip-offset, var(--x-spacing-xs, 8px))}.x-tooltip-placement-leftBottom .x-tooltip-arrow{right:var(--x-tooltip-arrow-offset-vertical, 3px);bottom:var(--x-tooltip-arrow-edge-offset, 8px);border-width:var(--x-tooltip-arrow-size, 5px) 0 var(--x-tooltip-arrow-size, 5px) var(--x-tooltip-arrow-size, 5px);border-left-color:var(--x-tooltip-color, var(--x-tooltip-bg, var(--x-color-bg-spotlight, rgba(0, 0, 0, 0.85))))}.x-tooltip-placement-right{left:100%;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);padding-left:var(--x-tooltip-offset, var(--x-spacing-xs, 8px))}.x-tooltip-placement-right .x-tooltip-arrow{left:var(--x-tooltip-arrow-offset-vertical, 3px);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);border-width:var(--x-tooltip-arrow-size, 5px) var(--x-tooltip-arrow-size, 5px) var(--x-tooltip-arrow-size, 5px) 0;border-right-color:var(--x-tooltip-color, var(--x-tooltip-bg, var(--x-color-bg-spotlight, rgba(0, 0, 0, 0.85))))}.x-tooltip-placement-rightTop{left:100%;top:0;padding-left:var(--x-tooltip-offset, var(--x-spacing-xs, 8px))}.x-tooltip-placement-rightTop .x-tooltip-arrow{left:var(--x-tooltip-arrow-offset-vertical, 3px);top:var(--x-tooltip-arrow-edge-offset, 8px);border-width:var(--x-tooltip-arrow-size, 5px) var(--x-tooltip-arrow-size, 5px) var(--x-tooltip-arrow-size, 5px) 0;border-right-color:var(--x-tooltip-color, var(--x-tooltip-bg, var(--x-color-bg-spotlight, rgba(0, 0, 0, 0.85))))}.x-tooltip-placement-rightBottom{left:100%;bottom:0;padding-left:var(--x-tooltip-offset, var(--x-spacing-xs, 8px))}.x-tooltip-placement-rightBottom .x-tooltip-arrow{left:var(--x-tooltip-arrow-offset-vertical, 3px);bottom:var(--x-tooltip-arrow-edge-offset, 8px);border-width:var(--x-tooltip-arrow-size, 5px) var(--x-tooltip-arrow-size, 5px) var(--x-tooltip-arrow-size, 5px) 0;border-right-color:var(--x-tooltip-color, var(--x-tooltip-bg, var(--x-color-bg-spotlight, rgba(0, 0, 0, 0.85))))}`;
-
-const XTooltip = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.openChange = index.createEvent(this, "openChange", 7);
-    }
-    get el() { return index.getElement(this); }
-    // ==================== Props ====================
-    /**
-     * The text shown in the tooltip.
-     * Use `tooltipTitle` to avoid conflict with native `title` attribute.
-     * @example
-     * <x-tooltip tooltip-title="Info"></x-tooltip>
-     */
-    tooltipTitle;
-    /**
-     * The position of the tooltip relative to the target.
-     * @default 'top'
-     * @example
-     * <x-tooltip placement="bottom"></x-tooltip>
-     */
-    placement = 'top';
-    /**
-     * Tooltip trigger mode.
-     * @default 'hover'
-     * @example
-     * <x-tooltip trigger="click"></x-tooltip>
-     */
-    trigger = 'hover';
-    /**
-     * Background color of the tooltip.
-     * @example
-     * <x-tooltip color="#333"></x-tooltip>
-     */
-    color;
-    /**
-     * Whether the floating tooltip card is visible or not (controlled mode).
-     * @example
-     * <x-tooltip open></x-tooltip>
-     */
-    open;
-    /**
-     * Whether the floating tooltip card is visible by default.
-     * @example
-     * <x-tooltip defaultOpen></x-tooltip>
-     */
-    defaultOpen = false;
-    /**
-     * Whether to show arrow.
-     * Can be a boolean or an object with `pointAtCenter` option.
-     * @default true
-     * @example
-     * <x-tooltip arrow={false}></x-tooltip>
-     */
-    arrow = true;
-    /**
-     * Delay in seconds before tooltip is shown on mouse enter.
-     * @default 0.1
-     * @example
-     * <x-tooltip mouseEnterDelay={0.5}></x-tooltip>
-     */
-    mouseEnterDelay = 0.1;
-    /**
-     * Delay in seconds before tooltip is hidden on mouse leave.
-     * @default 0.1
-     * @example
-     * <x-tooltip mouseLeaveDelay={0.5}></x-tooltip>
-     */
-    mouseLeaveDelay = 0.1;
-    /**
-     * Whether to destroy tooltip on hide.
-     * @default false
-     * @example
-     * <x-tooltip destroyTooltipOnHide></x-tooltip>
-     */
-    destroyTooltipOnHide = false;
-    /**
-     * Whether to adjust popup placement automatically when popup is off screen.
-     * @default true
-     * @example
-     * <x-tooltip autoAdjustOverflow={false}></x-tooltip>
-     */
-    autoAdjustOverflow = true;
-    /**
-     * Z-index of the tooltip.
-     * @example
-     * <x-tooltip zIndex={2000}></x-tooltip>
-     */
-    zIndex = 9999;
-    /**
-     * Custom class names for tooltip parts.
-     * @example
-     * <x-tooltip classNames={{ root: 'my-tooltip' }}></x-tooltip>
-     */
-    classNames;
-    /**
-     * Custom styles for tooltip parts.
-     * @example
-     * <x-tooltip styles={{ root: { background: '#000' } }}></x-tooltip>
-     */
-    styles;
-    // ==================== Events ====================
-    /**
-     * Callback executed when visibility of the tooltip card is changed.
-     * @example
-     * <x-tooltip onOpenChange={(ev) => console.log(ev.detail)}></x-tooltip>
-     */
-    openChange;
-    // ==================== State ====================
-    /**
-     * Internal visibility state.
-     */
-    visible = false;
-    // ==================== Private ====================
-    /**
-     * Portal instance for tooltip content.
-     */
-    portalInstance = null;
-    /**
-     * Timeout for delayed show.
-     */
-    showTimeout;
-    /**
-     * Timeout for delayed hide.
-     */
-    hideTimeout;
-    // ==================== Computed ====================
-    get isOpen() {
-        return this.open ?? this.visible;
-    }
-    // ==================== Lifecycle ====================
-    componentWillLoad() {
-        this.visible = this.open ?? this.defaultOpen ?? false;
-    }
-    componentDidLoad() {
-        this.addEventListeners();
-    }
-    componentDidRender() {
-        this.updatePortal();
-    }
-    disconnectedCallback() {
-        this.clearTimeouts();
-        this.removeEventListeners();
-        this.destroyPortal();
-    }
-    // ==================== Watchers ====================
-    handleOpenChange(newValue) {
-        if (newValue !== undefined) {
-            this.setVisible(newValue);
-        }
-    }
-    // ==================== Methods ====================
-    /**
-     * Show the tooltip programmatically.
-     * @returns Promise<void>
-     * @example
-     * await el.show()
-     */
-    async show() {
-        this.setVisible(true);
-    }
-    /**
-     * Hide the tooltip programmatically.
-     * @returns Promise<void>
-     * @example
-     * await el.hide()
-     */
-    async hide() {
-        this.setVisible(false);
-    }
-    // ==================== Private Methods ====================
-    /**
-     * Clear pending show/hide timeouts.
-     * @returns void
-     */
-    clearTimeouts() {
-        if (this.showTimeout) {
-            clearTimeout(this.showTimeout);
-            this.showTimeout = undefined;
-        }
-        if (this.hideTimeout) {
-            clearTimeout(this.hideTimeout);
-            this.hideTimeout = undefined;
-        }
-    }
-    /**
-     * Update internal visibility and emit openChange.
-     * @param visible - New visibility state.
-     * @returns void
-     */
-    setVisible(visible) {
-        if (this.visible === visible)
-            return;
-        this.visible = visible;
-        this.openChange.emit({ open: visible });
-    }
-    /**
-     * Delay showing tooltip based on mouseEnterDelay.
-     * @returns void
-     */
-    delayShow = () => {
-        this.clearTimeouts();
-        const delay = (this.mouseEnterDelay ?? 0.1) * 1000;
-        this.showTimeout = setTimeout(() => {
-            if (this.open === undefined) {
-                this.setVisible(true);
-            }
-        }, delay);
-    };
-    /**
-     * Delay hiding tooltip based on mouseLeaveDelay.
-     * @returns void
-     */
-    delayHide = () => {
-        this.clearTimeouts();
-        const delay = (this.mouseLeaveDelay ?? 0.1) * 1000;
-        this.hideTimeout = setTimeout(() => {
-            if (this.open === undefined) {
-                this.setVisible(false);
-            }
-        }, delay);
-    };
-    /**
-     * Handle trigger mouse enter for hover mode.
-     * @returns void
-     */
-    handleMouseEnter = () => {
-        if (this.trigger === 'hover') {
-            this.delayShow();
-        }
-    };
-    /**
-     * Handle trigger mouse leave for hover mode.
-     * @returns void
-     */
-    handleMouseLeave = () => {
-        if (this.trigger === 'hover') {
-            this.delayHide();
-        }
-    };
-    /**
-     * Handle focus for focus trigger mode.
-     * @returns void
-     */
-    handleFocus = () => {
-        if (this.trigger === 'focus') {
-            this.delayShow();
-        }
-    };
-    /**
-     * Handle blur for focus trigger mode.
-     * @returns void
-     */
-    handleBlur = () => {
-        if (this.trigger === 'focus') {
-            this.delayHide();
-        }
-    };
-    /**
-     * Handle click for click trigger mode.
-     * @returns void
-     */
-    handleClick = () => {
-        if (this.trigger === 'click') {
-            if (this.open === undefined) {
-                this.setVisible(!this.visible);
-            }
-        }
-    };
-    /**
-     * Handle context menu trigger mode.
-     * @param e - Mouse event.
-     * @returns void
-     */
-    handleContextMenu = (e) => {
-        if (this.trigger === 'contextMenu') {
-            e.preventDefault();
-            if (this.open === undefined) {
-                this.setVisible(!this.visible);
-            }
-        }
-    };
-    /**
-     * Close tooltip when clicking outside.
-     * @param e - Mouse event.
-     * @returns void
-     */
-    handleDocumentClick = (e) => {
-        if (this.trigger === 'click' || this.trigger === 'contextMenu') {
-            const target = e.target;
-            // Check if click is inside component
-            if (this.el.contains(target))
-                return;
-            // Check if click is inside portal
-            const portalEl = this.portalInstance?.getElement?.();
-            if (portalEl?.contains(target))
-                return;
-            if (this.open === undefined) {
-                this.setVisible(false);
-            }
-        }
-    };
-    /**
-     * Handle hover inside portal to prevent hide.
-     * @returns void
-     */
-    handlePortalMouseEnter = () => {
-        if (this.trigger === 'hover') {
-            this.clearTimeouts();
-        }
-    };
-    /**
-     * Handle mouse leave from portal for hover trigger.
-     * @returns void
-     */
-    handlePortalMouseLeave = () => {
-        if (this.trigger === 'hover') {
-            this.delayHide();
-        }
-    };
-    /**
-     * Add global event listeners.
-     * @returns void
-     */
-    addEventListeners() {
-        document.addEventListener('click', this.handleDocumentClick);
-    }
-    /**
-     * Remove global event listeners.
-     * @returns void
-     */
-    removeEventListeners() {
-        document.removeEventListener('click', this.handleDocumentClick);
-    }
-    /**
-     * Determine whether to render arrow.
-     * @returns boolean
-     */
-    shouldShowArrow() {
-        if (typeof this.arrow === 'boolean') {
-            return this.arrow;
-        }
-        return this.arrow !== undefined;
-    }
-    /**
-     * Get trigger element inside shadow root.
-     * @returns HTMLElement | undefined
-     */
-    getTriggerEl() {
-        return this.el.shadowRoot
-            ? this.el.shadowRoot.querySelector('.x-tooltip-trigger')
-            : this.el.querySelector('.x-tooltip-trigger');
-    }
-    // ==================== Portal Methods ====================
-    /**
-     * Calculate arrow position based on trigger element and placement
-     * @returns { arrowX: number; arrowY: number }
-     */
-    calculateArrowPosition() {
-        const triggerEl = this.getTriggerEl();
-        if (!triggerEl) {
-            return { arrowX: 0, arrowY: 0 };
-        }
-        const triggerRect = triggerEl.getBoundingClientRect();
-        const triggerWidth = triggerRect.width;
-        const triggerHeight = triggerRect.height;
-        let arrowX = 0;
-        let arrowY = 0;
-        // Calculate arrow position based on placement
-        // We want the arrow to point at the center of the trigger
-        switch (this.placement) {
-            // Top placements - arrow points down, X is relative to trigger center
-            case 'top':
-                arrowX = triggerWidth / 2;
-                arrowY = 0;
-                break;
-            case 'topLeft':
-                arrowX = Math.min(20, triggerWidth / 2);
-                arrowY = 0;
-                break;
-            case 'topRight':
-                arrowX = triggerWidth - Math.min(20, triggerWidth / 2);
-                arrowY = 0;
-                break;
-            // Bottom placements - arrow points up, X is relative to trigger center
-            case 'bottom':
-                arrowX = triggerWidth / 2;
-                arrowY = 0;
-                break;
-            case 'bottomLeft':
-                arrowX = Math.min(20, triggerWidth / 2);
-                arrowY = 0;
-                break;
-            case 'bottomRight':
-                arrowX = triggerWidth - Math.min(20, triggerWidth / 2);
-                arrowY = 0;
-                break;
-            // Left placements - arrow points right, Y is relative to trigger center
-            case 'left':
-                arrowX = 0;
-                arrowY = triggerHeight / 2;
-                break;
-            case 'leftTop':
-                arrowX = 0;
-                arrowY = Math.min(16, triggerHeight / 2);
-                break;
-            case 'leftBottom':
-                arrowX = 0;
-                arrowY = triggerHeight - Math.min(16, triggerHeight / 2);
-                break;
-            // Right placements - arrow points left, Y is relative to trigger center
-            case 'right':
-                arrowX = 0;
-                arrowY = triggerHeight / 2;
-                break;
-            case 'rightTop':
-                arrowX = 0;
-                arrowY = Math.min(16, triggerHeight / 2);
-                break;
-            case 'rightBottom':
-                arrowX = 0;
-                arrowY = triggerHeight - Math.min(16, triggerHeight / 2);
-                break;
-        }
-        return { arrowX, arrowY };
-    }
-    /**
-     * Build tooltip content element for portal.
-     * @returns HTMLElement
-     */
-    buildTooltipElement() {
-        // Create x-tooltip-content component
-        const tooltipEl = document.createElement('x-tooltip-content');
-        // Set properties
-        tooltipEl.tooltipTitle = this.tooltipTitle || '';
-        tooltipEl.placement = this.placement;
-        tooltipEl.showArrow = this.shouldShowArrow();
-        if (this.color) {
-            tooltipEl.color = this.color;
-        }
-        if (this.classNames?.root) {
-            tooltipEl.contentClass = this.classNames.root;
-        }
-        // Calculate and set arrow position CSS variables
-        const { arrowX, arrowY } = this.calculateArrowPosition();
-        tooltipEl.style.setProperty('--arrow-x', `${arrowX}px`);
-        tooltipEl.style.setProperty('--arrow-y', `${arrowY}px`);
-        // Add event listeners for hover on portal
-        tooltipEl.addEventListener('mouseenter', this.handlePortalMouseEnter);
-        tooltipEl.addEventListener('mouseleave', this.handlePortalMouseLeave);
-        return tooltipEl;
-    }
-    /**
-     * Create or update portal content for tooltip.
-     * @returns void
-     */
-    updatePortal() {
-        const hasTitle = !!this.tooltipTitle;
-        if (!this.isOpen || !hasTitle) {
-            if (this.portalInstance) {
-                this.portalInstance.destroy();
-                this.portalInstance = null;
-            }
-            return;
-        }
-        const tooltipElement = this.buildTooltipElement();
-        if (!this.portalInstance) {
-            this.portalInstance = portalController.PortalController.create({
-                open: this.isOpen,
-                target: this.getTriggerEl(),
-                placement: this.placement,
-                zIndex: this.zIndex || 9999,
-                offset: 8, // arrow size (5px) + gap (3px)
-                content: tooltipElement,
-                flip: false,
-                shift: this.autoAdjustOverflow !== false,
-            });
-        }
-        else {
-            this.portalInstance.update({
-                open: this.isOpen,
-                target: this.getTriggerEl(),
-                placement: this.placement,
-                offset: 8,
-                content: tooltipElement,
-                flip: false,
-                shift: this.autoAdjustOverflow !== false,
-            });
-        }
-    }
-    /**
-     * Destroy portal instance if present.
-     * @returns void
-     */
-    destroyPortal() {
-        if (this.portalInstance) {
-            this.portalInstance.destroy();
-            this.portalInstance = null;
-        }
-    }
-    // ==================== Render ====================
-    /**
-     * Renders the Tooltip component.
-     *
-     * Flow:
-     * 1. Constructs host classes based on visibility and color.
-     * 2. Attaches event listeners for all trigger modes (hover, focus, click, contextMenu).
-     * 3. Renders a trigger wrapper `span` that wraps the default slot.
-     * 4. The actual tooltip content is rendered via a Portal (managed by `updatePortal`) to escape container clipping.
-     *
-     * @returns JSX.Element
-     */
-    render() {
-        return (index.h(index.Host, { key: '7f714f3aef2633cd18aac1fe03be7c840f01aa81', class: {
-                'x-tooltip-wrapper': true,
-                'x-tooltip-open': this.isOpen,
-                'x-tooltip-color': this.color ? true : false,
-            }, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onFocus: this.handleFocus, onBlur: this.handleBlur, onClick: this.handleClick, onContextMenu: this.handleContextMenu }, index.h("span", { key: 'ae94a1ccfc97a0ba7bddb87394e7cbe0e4a4ff2a', class: "x-tooltip-trigger" }, index.h("slot", { key: '1f2ca22b7b432abe47e12d69e3ea94efe4c06c08' }))));
-    }
-    static get watchers() { return {
-        "open": [{
-                "handleOpenChange": 0
-            }]
-    }; }
-};
-XTooltip.style = xTooltipCss();
-
-const xTooltipContentCss = () => `.x-tooltip-content{position:relative;display:block;font-family:var(--x-tooltip-font-family, var(--x-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif));font-size:var(--x-tooltip-font-size, var(--x-font-size-sm, 14px));line-height:var(--x-tooltip-line-height, var(--x-line-height, 1.5714));word-wrap:break-word;white-space:normal;max-width:var(--x-tooltip-max-width, 250px);pointer-events:auto;-webkit-animation:x-tooltip-fade-in var(--x-tooltip-motion-duration, 0.2s) ease-out;animation:x-tooltip-fade-in var(--x-tooltip-motion-duration, 0.2s) ease-out}@-webkit-keyframes x-tooltip-fade-in{from{opacity:0;-webkit-transform:scale(0.95);transform:scale(0.95)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes x-tooltip-fade-in{from{opacity:0;-webkit-transform:scale(0.95);transform:scale(0.95)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}.x-tooltip-content-inner{min-width:var(--x-tooltip-min-width, 30px);min-height:var(--x-tooltip-min-height, 32px);padding:var(--x-tooltip-padding-block, 6px) var(--x-tooltip-padding-inline, 8px)}.x-tooltip-content-inner:not(.x-tooltip-content-color){color:var(--x-tooltip-color, #ffffff)}.x-tooltip-content-inner.x-tooltip-content-color{color:white}.x-tooltip-content-inner{text-align:left;text-decoration:none;word-wrap:break-word;background-color:var(--x-tooltip-color, var(--x-tooltip-bg, rgba(0, 0, 0, 0.85)));border-radius:var(--x-tooltip-border-radius, 6px);-webkit-box-shadow:var(--x-tooltip-shadow, 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05));box-shadow:var(--x-tooltip-shadow, 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05));-webkit-box-sizing:border-box;box-sizing:border-box}.x-tooltip-content-arrow{position:absolute;width:0;height:0;border-style:solid;border-color:transparent;pointer-events:none}[class*=x-tooltip-content-placement-top]{-webkit-transform-origin:bottom center;transform-origin:bottom center}[class*=x-tooltip-content-placement-bottom]{-webkit-transform-origin:top center;transform-origin:top center}[class*=x-tooltip-content-placement-left]{-webkit-transform-origin:right center;transform-origin:right center}[class*=x-tooltip-content-placement-right]{-webkit-transform-origin:left center;transform-origin:left center}.x-tooltip-content-placement-top{padding-bottom:var(--x-tooltip-arrow-size, 8px)}.x-tooltip-content-placement-top .x-tooltip-content-arrow{bottom:0;left:var(--arrow-x, 50%);-webkit-transform:translateX(-50%);transform:translateX(-50%);border-width:var(--x-tooltip-arrow-size, 8px) var(--x-tooltip-arrow-size, 8px) 0;border-top-color:var(--x-tooltip-color, var(--x-tooltip-bg, rgba(0, 0, 0, 0.85)))}.x-tooltip-content-placement-topLeft{padding-bottom:var(--x-tooltip-arrow-size, 8px)}.x-tooltip-content-placement-topLeft .x-tooltip-content-arrow{bottom:0;left:var(--arrow-x, 16px);-webkit-transform:translateX(-50%);transform:translateX(-50%);border-width:var(--x-tooltip-arrow-size, 8px) var(--x-tooltip-arrow-size, 8px) 0;border-top-color:var(--x-tooltip-color, var(--x-tooltip-bg, rgba(0, 0, 0, 0.85)))}.x-tooltip-content-placement-topRight{padding-bottom:var(--x-tooltip-arrow-size, 8px)}.x-tooltip-content-placement-topRight .x-tooltip-content-arrow{bottom:0;right:var(--arrow-x, 16px);-webkit-transform:translateX(50%);transform:translateX(50%);border-width:var(--x-tooltip-arrow-size, 8px) var(--x-tooltip-arrow-size, 8px) 0;border-top-color:var(--x-tooltip-color, var(--x-tooltip-bg, rgba(0, 0, 0, 0.85)))}.x-tooltip-content-placement-bottom{padding-top:var(--x-tooltip-arrow-size, 8px)}.x-tooltip-content-placement-bottom .x-tooltip-content-arrow{top:0;left:var(--arrow-x, 50%);-webkit-transform:translateX(-50%);transform:translateX(-50%);border-width:0 var(--x-tooltip-arrow-size, 8px) var(--x-tooltip-arrow-size, 8px);border-bottom-color:var(--x-tooltip-color, var(--x-tooltip-bg, rgba(0, 0, 0, 0.85)))}.x-tooltip-content-placement-bottomLeft{padding-top:var(--x-tooltip-arrow-size, 8px)}.x-tooltip-content-placement-bottomLeft .x-tooltip-content-arrow{top:0;left:var(--arrow-x, 16px);-webkit-transform:translateX(-50%);transform:translateX(-50%);border-width:0 var(--x-tooltip-arrow-size, 8px) var(--x-tooltip-arrow-size, 8px);border-bottom-color:var(--x-tooltip-color, var(--x-tooltip-bg, rgba(0, 0, 0, 0.85)))}.x-tooltip-content-placement-bottomRight{padding-top:var(--x-tooltip-arrow-size, 8px)}.x-tooltip-content-placement-bottomRight .x-tooltip-content-arrow{top:0;right:var(--arrow-x, 16px);-webkit-transform:translateX(50%);transform:translateX(50%);border-width:0 var(--x-tooltip-arrow-size, 8px) var(--x-tooltip-arrow-size, 8px);border-bottom-color:var(--x-tooltip-color, var(--x-tooltip-bg, rgba(0, 0, 0, 0.85)))}.x-tooltip-content-placement-left{padding-right:var(--x-tooltip-arrow-size, 8px)}.x-tooltip-content-placement-left .x-tooltip-content-arrow{right:0;top:var(--arrow-y, 50%);-webkit-transform:translateY(-50%);transform:translateY(-50%);border-width:var(--x-tooltip-arrow-size, 8px) 0 var(--x-tooltip-arrow-size, 8px) var(--x-tooltip-arrow-size, 8px);border-left-color:var(--x-tooltip-color, var(--x-tooltip-bg, rgba(0, 0, 0, 0.85)))}.x-tooltip-content-placement-leftTop{padding-right:var(--x-tooltip-arrow-size, 8px)}.x-tooltip-content-placement-leftTop .x-tooltip-content-arrow{right:0;top:var(--arrow-y, 12px);-webkit-transform:translateY(-50%);transform:translateY(-50%);border-width:var(--x-tooltip-arrow-size, 8px) 0 var(--x-tooltip-arrow-size, 8px) var(--x-tooltip-arrow-size, 8px);border-left-color:var(--x-tooltip-color, var(--x-tooltip-bg, rgba(0, 0, 0, 0.85)))}.x-tooltip-content-placement-leftBottom{padding-right:var(--x-tooltip-arrow-size, 8px)}.x-tooltip-content-placement-leftBottom .x-tooltip-content-arrow{right:0;bottom:var(--arrow-y, 12px);-webkit-transform:translateY(50%);transform:translateY(50%);border-width:var(--x-tooltip-arrow-size, 8px) 0 var(--x-tooltip-arrow-size, 8px) var(--x-tooltip-arrow-size, 8px);border-left-color:var(--x-tooltip-color, var(--x-tooltip-bg, rgba(0, 0, 0, 0.85)))}.x-tooltip-content-placement-right{padding-left:var(--x-tooltip-arrow-size, 8px)}.x-tooltip-content-placement-right .x-tooltip-content-arrow{left:0;top:var(--arrow-y, 50%);-webkit-transform:translateY(-50%);transform:translateY(-50%);border-width:var(--x-tooltip-arrow-size, 8px) var(--x-tooltip-arrow-size, 8px) var(--x-tooltip-arrow-size, 8px) 0;border-right-color:var(--x-tooltip-color, var(--x-tooltip-bg, rgba(0, 0, 0, 0.85)))}.x-tooltip-content-placement-rightTop{padding-left:var(--x-tooltip-arrow-size, 8px)}.x-tooltip-content-placement-rightTop .x-tooltip-content-arrow{left:0;top:var(--arrow-y, 12px);-webkit-transform:translateY(-50%);transform:translateY(-50%);border-width:var(--x-tooltip-arrow-size, 8px) var(--x-tooltip-arrow-size, 8px) var(--x-tooltip-arrow-size, 8px) 0;border-right-color:var(--x-tooltip-color, var(--x-tooltip-bg, rgba(0, 0, 0, 0.85)))}.x-tooltip-content-placement-rightBottom{padding-left:var(--x-tooltip-arrow-size, 8px)}.x-tooltip-content-placement-rightBottom .x-tooltip-content-arrow{left:0;bottom:var(--arrow-y, 12px);-webkit-transform:translateY(50%);transform:translateY(50%);border-width:var(--x-tooltip-arrow-size, 8px) var(--x-tooltip-arrow-size, 8px) var(--x-tooltip-arrow-size, 8px) 0;border-right-color:var(--x-tooltip-color, var(--x-tooltip-bg, rgba(0, 0, 0, 0.85)))}.x-tooltip-content-hidden{display:none;pointer-events:none}`;
-
-const XTooltipContent = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    get el() { return index.getElement(this); }
-    // ==================== Props ====================
-    /**
-     * Tooltip title/content text.
-     * @example
-     * <x-tooltip-content tooltipTitle="Info"></x-tooltip-content>
-     */
-    tooltipTitle;
-    /**
-     * Placement of the tooltip.
-     * @example
-     * <x-tooltip-content placement="bottom"></x-tooltip-content>
-     */
-    placement = 'top';
-    /**
-     * Whether to show arrow.
-     * @example
-     * <x-tooltip-content showArrow={false}></x-tooltip-content>
-     */
-    showArrow = true;
-    /**
-     * Custom background color.
-     * @example
-     * <x-tooltip-content color="#333"></x-tooltip-content>
-     */
-    color;
-    /**
-     * Custom class for the content.
-     * @example
-     * <x-tooltip-content contentClass="my-tooltip"></x-tooltip-content>
-     */
-    contentClass;
-    /**
-     * Whether the tooltip is hidden.
-     * @example
-     * <x-tooltip-content hidden></x-tooltip-content>
-     */
-    hidden = false;
-    // ==================== Render ====================
-    /**
-     * Render tooltip content, arrow, and slot.
-     * @returns JSX.Element
-     * @example
-     * <x-tooltip-content tooltipTitle="Tip"></x-tooltip-content>
-     */
-    render() {
-        // Build class map based on placement and visibility.
-        const classes = {
-            'x-tooltip-content': true,
-            [`x-tooltip-content-placement-${this.placement}`]: true,
-            'x-tooltip-content-hidden': this.hidden,
-            [this.contentClass || '']: !!this.contentClass,
-        };
-        // Apply CSS variable for custom color.
-        const style = {};
-        if (this.color) {
-            style['--x-tooltip-color'] = this.color;
-        }
-        return (index.h(index.Host, { key: 'a583a96aef26105e6b21504201ffda958a46103c', class: classes, style: style, role: "tooltip" }, index.h("div", { key: '9cf9e614628b794ff569e26d679507c437395548', class: {
-                'x-tooltip-content-inner': true,
-                'x-tooltip-content-color': this.color ? true : false,
-                [this.contentClass || '']: !!this.contentClass,
-            } }, this.tooltipTitle, index.h("slot", { key: '799907798ddfca9bf4ccdee5850301af616f8127' })), this.showArrow && (index.h("div", { key: '0a9215b4cbb5f583188851171cb3a50bd26683a2', class: "x-tooltip-content-arrow" }))));
-    }
-};
-XTooltipContent.style = xTooltipContentCss();
-
-exports.x_color_picker = XColorPicker;
-exports.x_divider = XDivider;
-exports.x_form_item = XFormItem;
-exports.x_input_number = XInputNumber;
-exports.x_modal = XModal;
-exports.x_slider = XSlider;
-exports.x_switch = XSwitch;
-exports.x_tooltip = XTooltip;
-exports.x_tooltip_content = XTooltipContent;