@xlabs-store/core 0.0.1 → 0.0.3

package/dist/cjs/x-icon-picker-dropdown-content.cjs.entry.js

@@ -0,0 +1,158 @@
+'use strict';
+
+var index = require('./index-Cy2P_ln3.js');
+var icons = require('./icons-BfHE2jcr.js');
+var locale_service = require('./locale.service-DT6E8Rzd.js');
+
+const iconPickerDropdownContentCss = () => `@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-text-processing:#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}.x-icon-picker-panel{width:var(--x-input-icon-panel-width, 300px);background-color:var(--x-input-icon-bg, var(--x-control-bg, var(--x-color-bg-container, #ffffff)));border-radius:var(--x-input-icon-item-border-radius, var(--x-border-radius));-webkit-box-shadow:var(--x-box-shadow);box-shadow:var(--x-box-shadow);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;overflow:hidden;position:relative;z-index:1050}.x-icon-picker-panel.x-date-picker-dropdown-hidden{display:none}.x-icon-picker-search{padding:8px 8px 0}.x-icon-picker-body{height:var(--x-input-icon-panel-height, 320px);overflow-y:auto;padding:8px 8px 4px}.x-icon-picker-body::-webkit-scrollbar{width:5px}.x-icon-picker-body::-webkit-scrollbar-thumb{background-color:var(--x-border-color-split);border-radius:4px}.x-icon-picker-body::-webkit-scrollbar-track{background:transparent}.x-icon-picker-group{margin-bottom:8px}.x-icon-picker-group:last-of-type{margin-bottom:0}.x-icon-picker-group-header{font-size:11px;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;color:var(--x-text-color-secondary);padding:4px 2px 6px;line-height:1;border-bottom:1px solid var(--x-border-color-split);margin-bottom:6px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.x-icon-picker-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(36px, 1fr));gap:3px}.x-icon-picker-item{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;height:36px;width:100%;font-size:20px;border-radius:var(--x-border-radius-sm);cursor:pointer;-webkit-transition:background-color 0.15s ease, color 0.15s ease;transition:background-color 0.15s ease, color 0.15s ease;color:var(--x-text-color);overflow:hidden;white-space:nowrap}.x-icon-picker-item x-icon{max-width:100%;max-height:100%;overflow:hidden;pointer-events:none}.x-icon-picker-item:hover{background-color:var(--x-input-icon-item-hover-bg, var(--x-control-item-bg-hover));color:var(--x-primary-color)}.x-icon-picker-item-selected{background-color:var(--x-input-icon-item-active-bg, var(--x-control-item-bg-active));color:var(--x-input-icon-item-active-color, var(--x-primary-color))}.x-icon-picker-item-selected:hover{background-color:var(--x-input-icon-item-active-bg, var(--x-control-item-bg-active))}.x-icon-picker-empty{display:-ms-flexbox;display:flex;width:100%;height:100%;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-height:120px}.x-icon-picker-sentinel{height:40px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;margin-top:4px}.x-icon-picker-loading{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;opacity:0.5}.x-icon-picker-footer{font-size:11px;color:var(--x-text-color-quaternary, var(--x-text-color-secondary));text-align:center;padding:6px 4px 4px;border-top:1px solid var(--x-border-color-split);margin-top:6px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}`;
+
+// ─── Constants ─────────────────────────────────────────────────────────────────
+const PAGE_SIZE = 48;
+// ─── Pre-build full grouped data once at module load ──────────────────────────
+const ALL_GROUPS = icons.Icons;
+const XIconPickerDropdownContent = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.xIconClick = index.createEvent(this, "xIconClick", 7);
+        this.xSearch = index.createEvent(this, "xSearch", 7);
+    }
+    get el() { return index.getElement(this); }
+    value;
+    placement = 'bottomLeft';
+    dropdownClasses = {};
+    /**
+     * Search query passed from the trigger (x-select's showSearch input).
+     * When this changes, pagination resets and icons are filtered.
+     */
+    searchQuery = '';
+    /**
+     * Whether to show an internal search input field at the top of the dropdown.
+     * Useful when the trigger (e.g. avatar, button) does not have its own search input.
+     */
+    showSearchInput = false;
+    /** How many icons have been "loaded" (lazy pagination) */
+    loadedCount = PAGE_SIZE;
+    /** Whether more icons are being loaded */
+    isLoadingMore = false;
+    xIconClick;
+    xSearch;
+    sentinelRef;
+    observer;
+    // ─── Reset pagination when search changes ─────────────────────────────────
+    onSearchChange() {
+        this.loadedCount = PAGE_SIZE;
+    }
+    // ─── Setup IntersectionObserver after render ──────────────────────────────
+    componentDidLoad() {
+        this.setupObserver();
+    }
+    componentDidUpdate() {
+        this.setupObserver();
+    }
+    disconnectedCallback() {
+        this.observer?.disconnect();
+    }
+    setupObserver() {
+        this.observer?.disconnect();
+        if (!this.sentinelRef)
+            return;
+        this.observer = new IntersectionObserver(entries => {
+            const entry = entries[0];
+            if (entry.isIntersecting && !this.isLoadingMore) {
+                this.loadMore();
+            }
+        }, {
+            root: this.el.shadowRoot?.querySelector('.x-icon-picker-body') ?? null,
+            threshold: 0.1,
+        });
+        this.observer.observe(this.sentinelRef);
+    }
+    loadMore() {
+        const totalFiltered = this.getTotalFilteredCount();
+        if (this.loadedCount >= totalFiltered)
+            return;
+        this.isLoadingMore = true;
+        requestAnimationFrame(() => {
+            this.loadedCount = Math.min(this.loadedCount + PAGE_SIZE, totalFiltered);
+            this.isLoadingMore = false;
+        });
+    }
+    // ─── Handlers ─────────────────────────────────────────────────────────────
+    handleIconClick(icon) {
+        this.xIconClick.emit(icon.code);
+    }
+    handleSearchChange = (e) => {
+        const val = e.detail?.value !== undefined ? e.detail.value : e.detail;
+        this.xSearch.emit(val);
+    };
+    // ─── Data helpers ─────────────────────────────────────────────────────────
+    getFilteredGroups() {
+        const q = (this.searchQuery || '').toLowerCase().trim();
+        if (!q)
+            return ALL_GROUPS;
+        return ALL_GROUPS.reduce((results, item) => {
+            const icons = item.icons.filter(i => (i.name + i.code).toLowerCase().includes(q));
+            if (icons.length) {
+                results.push({
+                    categorie: item.categorie,
+                    icons
+                });
+            }
+            return results;
+        }, []);
+    }
+    getTotalFilteredCount() {
+        return this.getFilteredGroups().reduce((sum, g) => sum + g.icons.length, 0);
+    }
+    getVisibleGroups() {
+        const filtered = this.getFilteredGroups();
+        let budget = this.loadedCount;
+        const result = [];
+        for (const group of filtered) {
+            if (budget <= 0)
+                break;
+            const visible = group.icons.slice(0, budget);
+            budget -= visible.length;
+            result.push({ categorie: group.categorie, icons: visible });
+        }
+        return result;
+    }
+    // ─── Render helpers ───────────────────────────────────────────────────────
+    renderGroup(group) {
+        return (index.h("div", { class: "x-icon-picker-group", key: group.categorie }, index.h("div", { class: "x-icon-picker-group-header" }, group.categorie), index.h("div", { class: "x-icon-picker-grid" }, group.icons.map(icon => {
+            const isSelected = this.value === icon.code;
+            return (index.h("div", { class: {
+                    'x-icon-picker-item': true,
+                    'x-icon-picker-item-selected': isSelected,
+                }, onClick: () => this.handleIconClick(icon), title: icon.name, key: icon.code }, index.h("x-icon", { name: icon.code })));
+        }))));
+    }
+    renderBody() {
+        const visibleGroups = this.getVisibleGroups();
+        const totalFiltered = this.getTotalFilteredCount();
+        const hasMore = this.loadedCount < totalFiltered;
+        if (totalFiltered === 0) {
+            return (index.h("div", { class: "x-icon-picker-empty" }, index.h("x-empty", { description: locale_service.translate('IconPicker.empty', {}, 'No icons found') })));
+        }
+        return [
+            ...visibleGroups.map(g => this.renderGroup(g)),
+            hasMore && (index.h("div", { class: "x-icon-picker-sentinel", ref: el => (this.sentinelRef = el) }, index.h("div", { class: "x-icon-picker-loading" }, index.h("x-spin", { size: "small" })))),
+            index.h("div", { class: "x-icon-picker-footer" }, `${Math.min(this.loadedCount, totalFiltered)} / ${totalFiltered} icons`),
+        ];
+    }
+    render() {
+        const wrapperClasses = {
+            'x-icon-picker-panel': true,
+            ...this.dropdownClasses,
+        };
+        return (index.h("div", { key: '3e5976ada71894111ae1e25c83d20f575f75a83c', class: wrapperClasses }, this.showSearchInput && (index.h("div", { key: '7ab45031d191e2520209f7d9a33f800430047503', class: "x-icon-picker-search" }, index.h("x-input", { key: 'a3c3040a79d553a5b8e18415a703157f7d2f2f06', value: this.searchQuery, placeholder: locale_service.translate('IconPicker.searchPlaceholder', {}, 'Search icon...'), allowClear: true, onXChange: this.handleSearchChange, onXInput: this.handleSearchChange }, index.h("x-icon", { key: '32ea8a961966111b63ce3ace2e3ccaffb6dabbe4', name: "search", slot: "prefix" })))), index.h("div", { key: 'c1fbcd46bd59469d2fdaf0dac70b52b5e6f07ccc', class: "x-icon-picker-body" }, this.renderBody())));
+    }
+    static get watchers() { return {
+        "searchQuery": [{
+                "onSearchChange": 0
+            }]
+    }; }
+};
+XIconPickerDropdownContent.style = iconPickerDropdownContentCss();
+
+exports.x_icon_picker_dropdown_content = XIconPickerDropdownContent;

package/dist/cjs/x-infinite-scroll.cjs.entry.js

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-C7sKs9A2.js');
+var index = require('./index-Cy2P_ln3.js');
 
-const xInfiniteScrollCss = () => `@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;position:relative}.x-infinite-scroll-sentinel{height:1px;width:100%}.x-infinite-scroll-status{padding:var(--x-infinite-scroll-status-padding-block, 12px) var(--x-infinite-scroll-status-padding-inline, 0);text-align:center}.x-infinite-scroll-loading{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}.x-infinite-scroll-no-more{color:var(--x-infinite-scroll-no-more-color, var(--x-color-text-description, rgba(0, 0, 0, 0.45)));font-size:var(--x-infinite-scroll-no-more-font-size, var(--x-font-size-sm, 12px))}`;
+const xInfiniteScrollCss = () => `@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-text-processing:#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;position:relative}.x-infinite-scroll-sentinel{height:1px;width:100%}.x-infinite-scroll-status{padding:var(--x-infinite-scroll-status-padding-block, 12px) var(--x-infinite-scroll-status-padding-inline, 0);text-align:center}.x-infinite-scroll-loading{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}.x-infinite-scroll-no-more{color:var(--x-infinite-scroll-no-more-color, var(--x-color-text-description, rgba(0, 0, 0, 0.45)));font-size:var(--x-infinite-scroll-no-more-font-size, var(--x-font-size-sm, 12px))}`;
 
 const XInfiniteScroll = class {
     constructor(hostRef) {
@@ -81,7 +81,7 @@ const XInfiniteScroll = class {
         if (this.disabled || !this.hasMore) {
             return;
         }
-        this.observer = new IntersectionObserver((entries) => {
+        this.observer = new IntersectionObserver(entries => {
             const entry = entries[0];
             if (entry.isIntersecting && !this.loading && this.hasMore && !this.disabled) {
                 this.xLoadMore.emit();
@@ -110,7 +110,7 @@ const XInfiniteScroll = class {
      * </x-infinite-scroll>
      */
     render() {
-        return (index.h(index.Host, { key: '2c402e182338838f2303fbd7d7e6d72a85b75f61', class: "x-infinite-scroll" }, index.h("div", { key: '55688e4590660c16c6ed413d3a2cfea10120229b', class: "x-infinite-scroll-content" }, index.h("slot", { key: '163f8b5f05846f1b5f3ac7bbc2f8da847bc67cb9' })), index.h("div", { key: '84ee17b317206114bc8e6720f0ee7f4cee78f77a', ref: (el) => (this.sentinel = el), class: "x-infinite-scroll-sentinel" }), index.h("div", { key: 'f3305017c26f8d9c4e659dfefffc12cae882def0', class: "x-infinite-scroll-status" }, this.loading && (index.h("div", { key: '601ff13b31d6f0f7cea639d108a13fb26b0bd27e', class: "x-infinite-scroll-loading" }, index.h("x-spin", { key: '8bc76127a6b9a818496c281ae0bb0f4a1c84c1bb', spinning: true, size: "small", tip: this.loadingText }))), !this.hasMore && (index.h("div", { key: '61dc13b4f7a0a9b12e1edab1b0bc8a2e7e2510f6', class: "x-infinite-scroll-no-more" }, index.h("slot", { key: 'f1bfe2b4ad1482e989b5c5ad750413e4ce2a7704', name: "noMore" }, this.noMoreText))))));
+        return (index.h(index.Host, { key: '096788e6f8979a160900b5e4f1e50b8ed45595e6', class: "x-infinite-scroll" }, index.h("div", { key: '2cfe24d963736ceefaf0bce393b0b58ae4bd5451', class: "x-infinite-scroll-content" }, index.h("slot", { key: 'a8fb3b00256d181b0e26e85b253660abcabdffb3' })), index.h("div", { key: '5278b0fd7ec177707f6f90aaf6f14c340d98316a', ref: el => (this.sentinel = el), class: "x-infinite-scroll-sentinel" }), index.h("div", { key: 'abd3dec40aff21261b5749fe91c4da826ba23fdf', class: "x-infinite-scroll-status" }, this.loading && (index.h("div", { key: '687c5a55cdae413adb5c4d19ed0af928bf1d8094', class: "x-infinite-scroll-loading" }, index.h("x-spin", { key: '062bb9872ad91951e43a3fce68794945b789081a', spinning: true, size: "small", tip: this.loadingText }))), !this.hasMore && (index.h("div", { key: 'c4958032f48158b6300f41f99ab53e497424be3e', class: "x-infinite-scroll-no-more" }, index.h("slot", { key: 'c05f1b3a5ee006fc550f80463c6b4c5a9fd769f3', name: "noMore" }, this.noMoreText))))));
     }
     static get watchers() { return {
         "disabled": [{

package/dist/cjs/x-input-icon.cjs.entry.js

@@ -0,0 +1,361 @@
+'use strict';
+
+var index = require('./index-Cy2P_ln3.js');
+var portalController = require('./portal-controller-DJft2QkA.js');
+var locale_service = require('./locale.service-DT6E8Rzd.js');
+
+const xInputIconCss = () => `@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-text-processing:#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;width:100%;position:relative;font-family:inherit;-webkit-box-sizing:border-box;box-sizing:border-box}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}.x-input-icon-wrapper{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;width:100%;cursor:pointer}.x-input-icon-wrapper x-select{width:100%;display:block;pointer-events:auto}.x-input-icon-wrapper x-select::part(dropdown){display:none !important}.x-input-icon-wrapper x-select::part(selector){cursor:pointer}.x-input-icon-preview{position:absolute;left:var(--x-input-icon-preview-left, 11px);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);z-index:2;pointer-events:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;font-size:var(--x-input-icon-preview-size, 18px);color:var(--x-input-icon-color, var(--x-control-color, var(--x-color-text, rgba(0, 0, 0, 0.88))));line-height:1;width:var(--x-input-icon-preview-size, 18px)}.x-input-icon-has-value x-select::part(selector){padding-left:40px !important}:host(.x-input-icon-small) .x-input-icon-preview{left:var(--x-input-icon-padding-horizontal-sm, var(--x-control-padding-horizontal-sm, var(--x-spacing-sm, 8px)));font-size:14px;width:14px}:host(.x-input-icon-small) .x-input-icon-has-value x-select::part(selector){padding-left:34px !important}:host(.x-input-icon-large) .x-input-icon-preview{font-size:20px;width:20px}:host(.x-input-icon-large) .x-input-icon-has-value x-select::part(selector){padding-left:44px !important}.x-input-icon-only-icon{width:100%}`;
+
+const XInputIcon = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.xChange = index.createEvent(this, "xChange", 7);
+        this.xOpenChange = index.createEvent(this, "xOpenChange", 7);
+        this.xBlur = index.createEvent(this, "xBlur", 7);
+        this.xFocus = index.createEvent(this, "xFocus", 7);
+    }
+    get el() { return index.getElement(this); }
+    /**
+     * Whether the input is disabled.
+     * @example <x-input-icon disabled></x-input-icon>
+     * @default false
+     */
+    disabled = false;
+    /**
+     * The selected icon name (controlled value).
+     * @example <x-input-icon value="home"></x-input-icon>
+     * @default ''
+     */
+    value = '';
+    /**
+     * The initial icon name (uncontrolled).
+     * @example <x-input-icon defaultValue="home"></x-input-icon>
+     */
+    defaultValue;
+    /**
+     * Placeholder text shown when no icon is selected.
+     * @example <x-input-icon placeholder="Choose an icon"></x-input-icon>
+     * @default 'Select icon'
+     */
+    placeholder = locale_service.translate('InputIcon.placeholder', {}, 'Select icon');
+    /**
+     * Size of the input trigger: 'large' | 'middle' | 'small'.
+     * @example <x-input-icon size="large"></x-input-icon>
+     * @default 'middle'
+     */
+    size = 'middle';
+    /**
+     * Visual variant of the trigger: 'outlined' | 'filled' | 'borderless'.
+     * Mapped to x-select's `bordered` prop internally.
+     * @example <x-input-icon variant="borderless"></x-input-icon>
+     * @default 'outlined'
+     */
+    variant = 'outlined';
+    /**
+     * Validation status: 'error' | 'warning'.
+     * @example <x-input-icon status="error"></x-input-icon>
+     */
+    status;
+    /**
+     * Placement of the icon picker dropdown.
+     * @example <x-input-icon placement="bottomRight"></x-input-icon>
+     * @default 'bottomLeft'
+     */
+    placement = 'bottomLeft';
+    /**
+     * The trigger type: 'input' | 'avatar' | 'button' | 'div' | 'icon'.
+     * @example <x-input-icon triggerType="avatar"></x-input-icon>
+     * @default 'input'
+     */
+    triggerType = 'input';
+    /**
+     * Whether to show the clear button when a value is selected.
+     * @example <x-input-icon [allowClear]="false"></x-input-icon>
+     * @default true
+     */
+    allowClear = true;
+    /**
+     * Whether to show the icon name as text inside the input.
+     * Set to false to display only the icon glyph.
+     * @example <x-input-icon [showName]="false"></x-input-icon>
+     * @default true
+     */
+    showName = true;
+    /**
+     * Whether the dropdown picker is open (controlled).
+     * @example <x-input-icon [open]="true"></x-input-icon>
+     * @default false
+     */
+    open = false;
+    /**
+     * The id attribute for the inner input element.
+     * Useful for associating a <label> element.
+     * @example <x-input-icon inputId="icon-field"></x-input-icon>
+     */
+    inputId;
+    /**
+     * The name attribute for the inner input (form submission).
+     * @example <x-input-icon name="menuIcon"></x-input-icon>
+     */
+    name;
+    /**
+     * Whether to auto-focus the input on mount.
+     * @example <x-input-icon autofocus></x-input-icon>
+     * @default false
+     */
+    autofocus = false;
+    focused = false;
+    /** Current search text typed in x-select's showSearch input */
+    pickerSearchQuery = '';
+    /**
+     * Emitted when the selected icon changes.
+     * @example (xChange)="handleChange($event)"
+     */
+    xChange;
+    /**
+     * Emitted when the dropdown open state changes.
+     * @example (xOpenChange)="handleOpenChange($event)"
+     */
+    xOpenChange;
+    /**
+     * Emitted when the input loses focus.
+     * @example (xBlur)="handleBlur($event)"
+     */
+    xBlur;
+    /**
+     * Emitted when the input gains focus.
+     * @example (xFocus)="handleFocus($event)"
+     */
+    xFocus;
+    wrapperRef;
+    inputRef;
+    portalInstance = null;
+    /** Persistent reference to the dropdown content element for live searchQuery updates */
+    dropdownContentEl = null;
+    componentWillLoad() {
+        if (!this.value && this.defaultValue) {
+            this.value = this.defaultValue;
+        }
+    }
+    componentDidLoad() {
+        if (this.autofocus && !this.disabled) {
+            this.setFocus();
+        }
+    }
+    disconnectedCallback() {
+        this.destroyPortal();
+    }
+    openChanged(newValue) {
+        this.xOpenChange.emit(newValue);
+        if (newValue) {
+            this.createOrUpdatePortal();
+        }
+        else {
+            this.destroyPortal();
+        }
+    }
+    handleWindowClick(ev) {
+        if (!this.open)
+            return;
+        const path = ev.composedPath();
+        const isInsideComponent = path.includes(this.el);
+        const portalEl = this.portalInstance?.getElement();
+        const isInsidePortal = portalEl ? path.includes(portalEl) : false;
+        if (!isInsideComponent && !isInsidePortal) {
+            this.closeDropdown();
+        }
+    }
+    handleKeydown(ev) {
+        if (this.disabled)
+            return;
+        if (ev.key === 'Escape') {
+            ev.preventDefault();
+            this.closeDropdown();
+            this.inputRef?.setBlur();
+        }
+        else if (ev.key === 'Enter') {
+            if (!this.open) {
+                this.openDropdown();
+            }
+        }
+    }
+    async setFocus() {
+        this.inputRef?.setFocus();
+        this.focused = true;
+    }
+    async setBlur() {
+        this.inputRef?.setBlur();
+        this.focused = false;
+    }
+    /** Handle search text typed in x-select → propagate to dropdown content */
+    handleSearch = (e) => {
+        const query = (e.detail || '').toLowerCase().trim();
+        this.pickerSearchQuery = query;
+        // Update existing dropdown element directly without rebuilding portal
+        if (this.dropdownContentEl) {
+            this.dropdownContentEl.searchQuery = query;
+        }
+        // Ensure portal is open when user starts typing
+        if (!this.open) {
+            this.openDropdown();
+        }
+    };
+    /**
+     * Wrapper click handler — toggles the icon picker portal open/closed.
+     * Click when closed → opens portal.
+     * Click when open  → closes portal (toggle behavior).
+     */
+    handleWrapperClick = (e) => {
+        if (this.disabled)
+            return;
+        // Detect if the click came from x-select's clear button (inside its shadow DOM).
+        const path = e.composedPath();
+        const isClearBtn = path.some(node => {
+            const el = node;
+            return el && el.classList && el.classList.contains('x-select-clear');
+        });
+        if (isClearBtn)
+            return;
+        // Toggle: close if already open, open if closed
+        if (this.open) {
+            this.closeDropdown();
+        }
+        else {
+            this.openDropdown();
+        }
+    };
+    openDropdown() {
+        if (this.disabled || this.open)
+            return;
+        this.open = true;
+    }
+    closeDropdown() {
+        if (!this.open)
+            return;
+        this.open = false;
+        // Reset search query so next open starts fresh
+        this.pickerSearchQuery = '';
+        if (this.dropdownContentEl) {
+            this.dropdownContentEl.searchQuery = '';
+        }
+    }
+    handleIconSelect = (icon) => {
+        this.value = icon;
+        this.xChange.emit({ value: icon });
+        this.closeDropdown();
+        this.inputRef?.setFocus();
+    };
+    handleClear = () => {
+        this.value = '';
+        this.xChange.emit({ value: '' });
+    };
+    handleInputFocus = (e) => {
+        this.focused = true;
+        this.xFocus.emit(e.detail);
+        // Do NOT auto-open here — wrapper onClick handles toggle.
+        // Auto-opening on focus conflicts with the toggle close behavior.
+    };
+    handleInputBlur = (e) => {
+        this.focused = false;
+        this.xBlur.emit(e.detail);
+    };
+    getWrapperEl() {
+        return this.wrapperRef || undefined;
+    }
+    createOrUpdatePortal() {
+        if (!this.open)
+            return;
+        const triggerEl = this.getWrapperEl();
+        if (!triggerEl)
+            return;
+        const dropdownContent = this.buildDropdownElement();
+        if (!this.portalInstance) {
+            this.portalInstance = portalController.PortalController.create({
+                open: true,
+                target: triggerEl,
+                placement: this.placement,
+                zIndex: 1050,
+                content: dropdownContent,
+            });
+        }
+        else {
+            this.portalInstance.update({
+                open: true,
+                target: triggerEl,
+                placement: this.placement,
+                zIndex: 1050,
+                content: dropdownContent,
+            });
+        }
+    }
+    destroyPortal() {
+        if (this.portalInstance) {
+            this.portalInstance.destroy();
+            this.portalInstance = null;
+        }
+        this.dropdownContentEl = null;
+        this.pickerSearchQuery = '';
+    }
+    buildDropdownElement() {
+        // Reuse existing element to preserve searchQuery and observer state
+        if (!this.dropdownContentEl) {
+            const el = document.createElement('x-icon-picker-dropdown-content');
+            el.addEventListener('xIconClick', ((e) => {
+                this.handleIconSelect(e.detail);
+            }));
+            el.addEventListener('xSearch', ((e) => {
+                this.handleSearch({ detail: e.detail });
+            }));
+            this.dropdownContentEl = el;
+        }
+        const classes = {
+            'x-input-icon-dropdown': true,
+            'x-input-icon-dropdown-hidden': !this.open,
+        };
+        this.dropdownContentEl.dropdownClasses = classes;
+        this.dropdownContentEl.value = this.value;
+        this.dropdownContentEl.placement = this.placement;
+        this.dropdownContentEl.searchQuery = this.pickerSearchQuery;
+        this.dropdownContentEl.showSearchInput = this.triggerType !== 'input';
+        return this.dropdownContentEl;
+    }
+    renderTrigger(hasValue, isSearching) {
+        if (this.triggerType === 'avatar') {
+            return (index.h("x-avatar", { icon: this.value || undefined, size: this.size === 'middle' ? 'default' : this.size }, !this.value && this.showName ? this.placeholder : ''));
+        }
+        if (this.triggerType === 'button') {
+            return (index.h("x-button", { size: this.size, disabled: this.disabled, type: this.variant === 'filled' ? 'primary' : 'default' }, hasValue && index.h("x-icon", { name: this.value, slot: "icon" }), hasValue ? (this.showName ? this.value : '') : this.placeholder));
+        }
+        if (this.triggerType === 'icon') {
+            return (index.h("x-icon", { name: hasValue ? this.value : 'appstore' }));
+        }
+        if (this.triggerType === 'div') {
+            return (index.h("div", null, hasValue && index.h("x-icon", { name: this.value }), index.h("span", null, hasValue ? (this.showName ? this.value : '') : this.placeholder)));
+        }
+        // Default 'input' trigger
+        return [
+            hasValue && !isSearching && (index.h("div", { class: "x-input-icon-preview", "aria-hidden": "true", key: "preview" }, index.h("x-icon", { name: this.value }))),
+            index.h("x-select", { key: "select", ref: el => (this.inputRef = el), open: false, value: hasValue ? this.value : undefined, options: hasValue ? [{ value: this.value, label: this.showName ? this.value : '' }] : [], placeholder: this.placeholder, allowClear: this.allowClear && hasValue, disabled: this.disabled, size: this.size, status: this.status, bordered: this.variant !== 'borderless', inputId: this.inputId, name: this.name, showSearch: true, dropdownStyle: { display: 'none' }, notFoundContent: " ", onXSearch: this.handleSearch, onXClear: this.handleClear, onXBlur: this.handleInputBlur, onXFocus: this.handleInputFocus }),
+        ];
+    }
+    render() {
+        const hasValue = !!this.value;
+        // When searching, hide the icon preview and remove left-padding shift
+        const isSearching = !!this.pickerSearchQuery;
+        return (index.h(index.Host, { key: '0076a9cc582b756efee6dd13fbf5f002ce2a2e6d' }, index.h("div", { key: 'bc64265cd01262fb2acf6c407743178528c51ded', class: {
+                'x-input-icon-wrapper': true,
+                // Only apply icon-offset padding when showing icon (not during search)
+                'x-input-icon-has-value': hasValue && !isSearching && this.triggerType === 'input',
+                'x-input-icon-only-icon': !this.showName && this.triggerType === 'input',
+                [`x-input-icon-${this.triggerType}`]: true,
+            }, ref: el => (this.wrapperRef = el), onClick: this.handleWrapperClick }, this.renderTrigger(hasValue, isSearching))));
+    }
+    static get watchers() { return {
+        "open": [{
+                "openChanged": 0
+            }]
+    }; }
+};
+XInputIcon.style = xInputIconCss();
+
+exports.x_input_icon = XInputIcon;