@uzum-tech/ui 2.1.3 → 2.2.0

package/dist/index.mjs

@@ -3408,7 +3408,7 @@ function getOffset$2(placement, offsetRect, targetRect, offsetTopToStandardPlace
 }
 
 /* eslint-disable @typescript-eslint/no-non-null-assertion */
-const style$1Y = c([c('.v-binder-follower-container', {
+const style$1Z = c([c('.v-binder-follower-container', {
   position: 'absolute',
   left: '0',
   right: '0',
@@ -3487,7 +3487,7 @@ var VFollower = defineComponent({
       }
     });
     const ssrAdapter = useSsrAdapter();
-    style$1Y.mount({
+    style$1Z.mount({
       id: 'vueuc/binder',
       head: true,
       anchorMetaName: cssrAnchorMetaName$1,
@@ -4947,7 +4947,7 @@ var VXScroll = defineComponent({
 
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
 const hiddenAttr = 'v-hidden';
-const style$1X = c('[v-hidden]', {
+const style$1Y = c('[v-hidden]', {
   display: 'none!important'
 });
 var VOverflow = defineComponent({
@@ -5060,7 +5060,7 @@ var VOverflow = defineComponent({
       }
     }
     const ssrAdapter = useSsrAdapter();
-    style$1X.mount({
+    style$1Y.mount({
       id: 'vueuc/overflow',
       head: true,
       anchorMetaName: cssrAnchorMetaName$1,
@@ -5442,6 +5442,14 @@ function rtlInset(inset) {
   return `${top} ${left} ${bottom} ${right}`;
 }
 
+function copyToClipboard(text) {
+  const clipboard = globalThis.navigator?.clipboard;
+  if (!clipboard?.writeText) {
+    return Promise.reject(new Error("Clipboard API is unavailable"));
+  }
+  return clipboard.writeText(text);
+}
+
 function download$1(url, name) {
   if (!url) return;
   const a = document.createElement("a");
@@ -5876,6 +5884,9 @@ function useThemeClass(componentName, hashRef, cssVarsRef, props) {
   };
 }
 
+const formInjectionKey = createInjectionKey("u-form");
+const formItemInstsInjectionKey = createInjectionKey("u-form-item-insts");
+
 const formItemInjectionKey = createInjectionKey("u-form-item");
 function useFormItem(props, {
   defaultSize = "medium",
@@ -5883,6 +5894,7 @@ function useFormItem(props, {
   mergedDisabled
 } = {}) {
   const UFormItem = inject(formItemInjectionKey, null);
+  const UForm = inject(formInjectionKey, null);
   provide(formItemInjectionKey, null);
   const mergedSizeRef = computed(mergedSize ? () => mergedSize(UFormItem) : () => {
     const {
@@ -5909,6 +5921,9 @@ function useFormItem(props, {
     if (UFormItem) {
       return UFormItem.disabled.value;
     }
+    if (UForm) {
+      return UForm.props.disabled;
+    }
     return false;
   });
   const mergedStatusRef = computed(() => {
@@ -14065,7 +14080,7 @@ useTheme.props = {
   builtinThemeOverrides: Object
 };
 
-var style$1W = cB("base-icon", `
+var style$1X = cB("base-icon", `
   height: 1em;
   width: 1em;
   line-height: 1em;
@@ -14101,7 +14116,7 @@ var UBaseIcon = defineComponent({
     onMouseup: Function
   },
   setup(props) {
-    useStyle("-base-icon", style$1W, toRef(props, "clsPrefix"));
+    useStyle("-base-icon", style$1X, toRef(props, "clsPrefix"));
   },
   render() {
     return /* @__PURE__ */ h(
@@ -14129,10 +14144,14 @@ const iconProps = {
   component: Object,
   name: String,
   pack: String,
+  async: {
+    type: Boolean,
+    default: void 0
+  },
   onClick: Function
 };
 
-var style$1V = cB("icon", `
+var style$1W = cB("icon", `
   height: 1em;
   width: 1em;
   line-height: 1em;
@@ -14318,7 +14337,7 @@ const derived = {
   boxShadow2: "0px 20px 80px 0px rgba(0, 0, 0, 0.07)"
 };
 
-function self$1C(vars) {
+function self$1D(vars) {
   const {
     elementsPrimary
   } = vars;
@@ -14334,15 +14353,16 @@ function self$1C(vars) {
 const iconLight = {
   name: "Icon",
   common: derived,
-  self: self$1C
+  self: self$1D
 };
 
 const iconDark$1 = {
   name: "Icon",
   common: derived$1,
-  self: self$1C
+  self: self$1D
 };
 
+const FALLBACK_ICON = "&#65533";
 const UIconImpl = defineComponent({
   _n_icon__: true,
   name: "Icon",
@@ -14353,7 +14373,7 @@ const UIconImpl = defineComponent({
       mergedIconPacksRef,
       inlineThemeDisabled
     } = useConfig(props);
-    const themeRef = useTheme("Icon", "-icon", style$1V, iconLight, props, mergedClsPrefixRef);
+    const themeRef = useTheme("Icon", "-icon", style$1W, iconLight, props, mergedClsPrefixRef);
     const cssVarsRef = computed(() => {
       const {
         depth
@@ -14399,14 +14419,24 @@ const UIconImpl = defineComponent({
         warn("icon", `icon pack "${targetName}" not found`);
         return null;
       }
-      if (config.async) {
-        return target.renderAsyncIcon(name);
-      }
-      if (!("renderIcon" in target)) {
-        warn("icon", `pack "${target.name}" is async-only, set \`async: true\` on \`u-config-provider :icon-packs\``);
-        return null;
+      try {
+        if (props.async ?? config.async) {
+          if ("renderIcon" in target) {
+            warnOnce("icon", `pack "${target.name}" is a sync pack rendered in async mode \u2014 its icons are already bundled, so async loads them again at runtime. Register the async pack ("${target.name}Async") or drop \`async\`.`);
+          }
+          return target.renderAsyncIcon(name);
+        }
+        if (!("renderIcon" in target)) {
+          warn("icon", `pack "${target.name}" is async-only, set \`async: true\` on \`u-config-provider :icon-packs\``);
+          return null;
+        }
+        return target.renderIcon(name);
+      } catch (err) {
+        warnOnce("icon", `icon "${name}" not found in pack "${target.name}", rendering fallback (${err.message})`);
+        return h("span", {
+          innerHTML: FALLBACK_ICON
+        });
       }
-      return target.renderIcon(name);
     });
     return {
       mergedClsPrefix: mergedClsPrefixRef,
@@ -14465,6 +14495,12 @@ function renderIcon(name, props, children) {
     name
   }, slots);
 }
+function renderAsyncIcon(name, props, children) {
+  return renderIcon(name, {
+    ...props,
+    async: true
+  }, children);
+}
 
 var commonVars$b = {
   iconWidth: "44px",
@@ -14478,7 +14514,7 @@ var commonVars$b = {
   avatarSize: "16px"
 };
 
-function self$1B(vars) {
+function self$1C(vars) {
   const {
     heightHuge,
     fontBodyLarge,
@@ -14508,16 +14544,16 @@ function self$1B(vars) {
 const accountOptionLight = {
   name: "AccountOption",
   common: derived,
-  self: self$1B
+  self: self$1C
 };
 
 const accountOptionDark = {
   name: "AccountOption",
   common: derived$1,
-  self: self$1B
+  self: self$1C
 };
 
-var style$1U = cB("base-account-option", `
+var style$1V = cB("base-account-option", `
   display: flex;
   align-items: center;
   position: relative;
@@ -14572,7 +14608,7 @@ var UBaseAccountOption = defineComponent({
     const themeRef = useTheme(
       "AccountOption",
       "-base-account-option",
-      style$1U,
+      style$1V,
       accountOptionLight,
       props,
       mergedClsPrefixRef
@@ -15851,6 +15887,31 @@ var SearchIcon = defineComponent({
   }
 });
 
+var SearchOutlineIcon = defineComponent({
+  name: "SearchOutline",
+  render() {
+    return /* @__PURE__ */ h(
+      "svg",
+      {
+        viewBox: "0 0 24 24",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        "aria-hidden": true
+      },
+      /* @__PURE__ */ h(
+        "path",
+        {
+          d: "M21 21l-4.35-4.35M19 11a8 8 0 1 1-16 0 8 8 0 0 1 16 0z",
+          stroke: "currentColor",
+          "stroke-width": "2",
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round"
+        }
+      )
+    );
+  }
+});
+
 var SendFilled = defineComponent({
   name: "SendFilled",
   render() {
@@ -16027,7 +16088,7 @@ function iconSwitchTransition({
   })];
 }
 
-var style$1T = cB("base-clear", `
+var style$1U = cB("base-clear", `
   flex-shrink: 0;
   height: 1em;
   width: 1em;
@@ -16068,7 +16129,7 @@ var UBaseClear = defineComponent({
     onClear: Function
   },
   setup(props) {
-    useStyle("-base-clear", style$1T, toRef(props, "clsPrefix"));
+    useStyle("-base-clear", style$1U, toRef(props, "clsPrefix"));
     return {
       handleMouseDown(e) {
         e.preventDefault();
@@ -16099,7 +16160,7 @@ var UBaseClear = defineComponent({
   }
 });
 
-var style$1S = cB("base-close", `
+var style$1T = cB("base-close", `
   display: flex;
   align-items: center;
   justify-content: center;
@@ -16171,7 +16232,7 @@ var UBaseClose = defineComponent({
     absolute: Boolean
   },
   setup(props) {
-    useStyle("-base-close", style$1S, toRef(props, "clsPrefix"));
+    useStyle("-base-close", style$1T, toRef(props, "clsPrefix"));
     return () => {
       const { clsPrefix, disabled, absolute, round, isButtonTag } = props;
       const Tag = isButtonTag ? "button" : "div";
@@ -16330,7 +16391,7 @@ var FocusDetector = defineComponent({
   }
 });
 
-var style$1R = c$1([c$1("@keyframes loading-container-rotate", `
+var style$1S = c$1([c$1("@keyframes loading-container-rotate", `
     to {
       -webkit-transform: rotate(360deg);
       transform: rotate(360deg);
@@ -16500,7 +16561,7 @@ var UBaseLoading = defineComponent({
     ...exposedLoadingProps
   },
   setup(props) {
-    useStyle("-base-loading", style$1R, toRef(props, "clsPrefix"));
+    useStyle("-base-loading", style$1S, toRef(props, "clsPrefix"));
   },
   render() {
     const { clsPrefix, radius, strokeWidth, stroke, scale } = this;
@@ -16630,7 +16691,7 @@ function fadeInTransition({
   })];
 }
 
-var style$1Q = cB("base-menu-mask", `
+var style$1R = cB("base-menu-mask", `
   position: absolute;
   left: 0;
   right: 0;
@@ -16653,7 +16714,7 @@ var UBaseMenuMask = defineComponent({
     }
   },
   setup(props) {
-    useStyle("-base-menu-mask", style$1Q, toRef(props, "clsPrefix"));
+    useStyle("-base-menu-mask", style$1R, toRef(props, "clsPrefix"));
     const messageRef = ref(null);
     let timerId = null;
     const uncontrolledShowRef = ref(false);
@@ -16841,7 +16902,7 @@ const commonVars$a = {
   railColor: "transparent"
 };
 
-function self$1A(vars) {
+function self$1B(vars) {
   const {
     scrollbarColor,
     scrollbarColorHover,
@@ -16861,13 +16922,13 @@ function self$1A(vars) {
 const safeTopScrollbarLight = {
   name: "SafeTopScrollbar",
   common: derived,
-  self: self$1A
+  self: self$1B
 };
 
 const safeTopScrollbarDark = {
   name: "SafeTopScrollbar",
   common: derived$1,
-  self: self$1A
+  self: self$1B
 };
 
 cB("scrollbar", [cM("rtl", `
@@ -16880,7 +16941,7 @@ cB("scrollbar", [cM("rtl", `
           right: unset;
         `)])])])]);
 
-var style$1P = cB("safe-top-scrollbar", `
+var style$1Q = cB("safe-top-scrollbar", `
   overflow: hidden;
   position: relative;
   z-index: auto;
@@ -17029,7 +17090,7 @@ const SafeTopScrollbar$1 = defineComponent({
     const themeRef = useTheme(
       "SafeTopScrollbar",
       "-safe-top-scrollbar",
-      style$1P,
+      style$1Q,
       safeTopScrollbarLight,
       props,
       mergedClsPrefixRef
@@ -17763,7 +17824,7 @@ const commonVars$9 = {
   railColor: "transparent"
 };
 
-function self$1z(vars) {
+function self$1A(vars) {
   const {
     scrollbarColor,
     scrollbarColorHover,
@@ -17783,13 +17844,13 @@ function self$1z(vars) {
 const scrollbarLight = {
   name: "Scrollbar",
   common: derived,
-  self: self$1z
+  self: self$1A
 };
 
 const scrollbarDark = {
   name: "Scrollbar",
   common: derived$1,
-  self: self$1z
+  self: self$1A
 };
 
 var rtlStyle$t = cB("scrollbar", [cM("rtl", `
@@ -17807,7 +17868,7 @@ const scrollbarRtl = {
   style: rtlStyle$t
 };
 
-var style$1O = cB("scrollbar", `
+var style$1P = cB("scrollbar", `
   overflow: hidden;
   position: relative;
   z-index: auto;
@@ -17950,7 +18011,7 @@ const Scrollbar$1 = defineComponent({
     const themeRef = useTheme(
       "Scrollbar",
       "-scrollbar",
-      style$1O,
+      style$1P,
       scrollbarLight,
       props,
       mergedClsPrefixRef
@@ -19322,7 +19383,7 @@ function createTreeMate(rawNodes, options = {}) {
   return treemate;
 }
 
-function self$1y(vars) {
+function self$1z(vars) {
   const {
     fontBodyMedium,
     fontTitleLarge,
@@ -19354,16 +19415,16 @@ function self$1y(vars) {
 const emptyLight = {
   name: "Empty",
   common: derived,
-  self: self$1y
+  self: self$1z
 };
 
 const emptyDark$1 = {
   name: "Empty",
   common: derived$1,
-  self: self$1y
+  self: self$1z
 };
 
-var style$1N = cB("empty", `
+var style$1O = cB("empty", `
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -19441,7 +19502,7 @@ var UEmpty$1 = defineComponent({
     const themeRef = useTheme(
       "Empty",
       "-empty",
-      style$1N,
+      style$1O,
       emptyLight,
       props,
       mergedClsPrefixRef
@@ -19529,7 +19590,7 @@ var UEmpty$1 = defineComponent({
   }
 });
 
-function self$1x(vars) {
+function self$1y(vars) {
   const {
     borderRadius,
     iconMedium,
@@ -19586,7 +19647,7 @@ const internalSelectMenuLight = createTheme$1({
     Scrollbar: scrollbarLight,
     Empty: emptyLight
   },
-  self: self$1x
+  self: self$1y
 });
 
 const internalSelectMenuDark = {
@@ -19596,7 +19657,7 @@ const internalSelectMenuDark = {
     Scrollbar: scrollbarDark,
     Empty: emptyDark$1
   },
-  self: self$1x
+  self: self$1y
 };
 
 cB("base-select-menu", [cM("rtl", `
@@ -19837,7 +19898,7 @@ function fadeInScaleUpTransition({
   })];
 }
 
-var style$1M = cB("base-select-menu", `
+var style$1N = cB("base-select-menu", `
   line-height: 1.5;
   outline: none;
   z-index: 0;
@@ -20025,7 +20086,7 @@ var UInternalSelectMenu = defineComponent({
     const themeRef = useTheme(
       "InternalSelectMenu",
       "-internal-select-menu",
-      style$1M,
+      style$1N,
       internalSelectMenuLight,
       props,
       toRef(props, "clsPrefix")
@@ -20493,7 +20554,7 @@ var UInternalSelectMenu = defineComponent({
   }
 });
 
-function self$1w(vars) {
+function self$1x(vars) {
   const {
     fontBodyMedium,
     containerPrimary,
@@ -20520,13 +20581,13 @@ function self$1w(vars) {
 const popoverLight = {
   name: "Popover",
   common: derived,
-  self: self$1w
+  self: self$1x
 };
 
 const popoverDark = {
   name: "Popover",
   common: derived$1,
-  self: self$1w
+  self: self$1x
 };
 
 cB("popover", [cM("rtl", `
@@ -20541,7 +20602,7 @@ const oppositePlacement = {
   right: "left"
 };
 const arrowSize = "var(--u-arrow-height) * 1.414";
-var style$1L = c$1([cB("popover", `
+var style$1M = c$1([cB("popover", `
     transition:
       box-shadow .3s var(--u-bezier),
       background-color .3s var(--u-bezier),
@@ -20760,7 +20821,7 @@ var UPopoverBody = defineComponent({
     const themeRef = useTheme(
       "Popover",
       "-popover",
-      style$1L,
+      style$1M,
       popoverLight,
       props,
       mergedClsPrefixRef
@@ -21590,7 +21651,7 @@ var UPopover$1 = defineComponent({
   }
 });
 
-function self$1v(vars) {
+function self$1w(vars) {
   const {
     opacityDisabled,
     borderRadiusSmall: borderRadius,
@@ -21688,13 +21749,13 @@ function self$1v(vars) {
 const tagLight = {
   name: "Tag",
   common: derived,
-  self: self$1v
+  self: self$1w
 };
 
 const tagDark = {
   name: "Tag",
   common: derived$1,
-  self: self$1v
+  self: self$1w
 };
 
 var rtlStyle$s = cB("tag", [cM("rtl", `
@@ -21741,7 +21802,7 @@ var commonProps = {
   }
 };
 
-var style$1K = cB("tag", `
+var style$1L = cB("tag", `
   white-space: nowrap;
   position: relative;
   box-sizing: border-box;
@@ -21908,7 +21969,7 @@ var _UTag = defineComponent({
     const themeRef = useTheme(
       "Tag",
       "-tag",
-      style$1K,
+      style$1L,
       tagLight,
       props,
       mergedClsPrefixRef
@@ -22272,7 +22333,7 @@ var _UTagGroup = defineComponent({
   }
 });
 
-function self$1u(vars) {
+function self$1v(vars) {
   const {
     heightSmall,
     heightMedium,
@@ -22292,10 +22353,10 @@ function self$1u(vars) {
 }
 const skeletonLight$1 = {
   common: derived,
-  self: self$1u
+  self: self$1v
 };
 
-var style$1J = c$1([cB("skeleton", `
+var style$1K = c$1([cB("skeleton", `
     height: 1em;
     width: 100%;
     transition: background-color .3s var(--u-bezier);
@@ -22351,7 +22412,7 @@ var UBaseSkeleton = defineComponent({
     const themeRef = useTheme(
       "Skeleton",
       "-skeleton",
-      style$1J,
+      style$1K,
       skeletonLight$1,
       props,
       mergedClsPrefixRef
@@ -22467,7 +22528,7 @@ var UBaseSuffix = defineComponent({
   }
 });
 
-function self$1t(vars) {
+function self$1u(vars) {
   const {
     borderRadius,
     iconMedium,
@@ -22625,7 +22686,7 @@ const internalSelectionLight = createTheme$1({
   peers: {
     Popover: popoverLight
   },
-  self: self$1t
+  self: self$1u
 });
 
 const internalSelectionDark = {
@@ -22634,7 +22695,7 @@ const internalSelectionDark = {
   peers: {
     Popover: popoverDark
   },
-  self: self$1t
+  self: self$1u
 };
 
 cB("base-selection", [cM("rtl", `
@@ -22667,7 +22728,7 @@ function generateSecondaryStates(state) {
         color: var(--u-arrow-color${state}-secondary);
       `)])];
 }
-var style$1I = c$1([cB("base-selection", `
+var style$1J = c$1([cB("base-selection", `
     position: relative;
     z-index: auto;
     box-shadow: none;
@@ -23018,7 +23079,7 @@ var UInternalSelection = defineComponent({
     const themeRef = useTheme(
       "InternalSelection",
       "-internal-selection",
-      style$1I,
+      style$1J,
       internalSelectionLight,
       props,
       toRef(props, "clsPrefix")
@@ -24099,7 +24160,7 @@ function fadeUpWidthExpandTransition({
   })];
 }
 
-var style$1H = c$1([c$1("@keyframes u-base-slot-machine-fade-up-in", `
+var style$1I = c$1([c$1("@keyframes u-base-slot-machine-fade-up-in", `
     from {
       transform: translateY(60%);
       opacity: 0;
@@ -24218,7 +24279,7 @@ var UBaseSlotMachine = defineComponent({
     }
   },
   setup(props) {
-    useStyle("-base-slot-machine", style$1H, toRef(props, "clsPrefix"));
+    useStyle("-base-slot-machine", style$1I, toRef(props, "clsPrefix"));
     const oldValueRef = ref();
     const newValueRef = ref();
     const numbersRef = computed(() => {
@@ -24273,7 +24334,7 @@ var UBaseSlotMachine = defineComponent({
   }
 });
 
-function self$1s(vars) {
+function self$1t(vars) {
   const {
     borderRadiusSmall,
     brandPrimary500,
@@ -24309,10 +24370,10 @@ function self$1s(vars) {
 }
 const typographyLight$1 = {
   common: derived,
-  self: self$1s
+  self: self$1t
 };
 
-var style$1G = cB("text", `
+var style$1H = cB("text", `
   transition: color .3s var(--u-bezier);
   color: var(--u-text-color);
   margin: 0;
@@ -24620,7 +24681,7 @@ var InternalUText = defineComponent({
     const themeRef = useTheme(
       "Typography",
       "-text",
-      style$1G,
+      style$1H,
       typographyLight$1,
       props,
       mergedClsPrefixRef
@@ -24708,7 +24769,7 @@ var InternalUText = defineComponent({
   }
 });
 
-var style$1F = cB("base-wave", `
+var style$1G = cB("base-wave", `
   position: absolute;
   left: 0;
   right: 0;
@@ -24726,7 +24787,7 @@ var UBaseWave = defineComponent({
     }
   },
   setup(props) {
-    useStyle("-base-wave", style$1F, toRef(props, "clsPrefix"));
+    useStyle("-base-wave", style$1G, toRef(props, "clsPrefix"));
     const selfRef = ref(null);
     const activeRef = ref(false);
     let animationTimerId = null;
@@ -24771,7 +24832,7 @@ var UBaseWave = defineComponent({
   }
 });
 
-function self$1r(vars) {
+function self$1s(vars) {
   const {
     borderRadius,
     fontBodyMedium,
@@ -24808,7 +24869,7 @@ const tooltipLight = createTheme$1({
   peers: {
     Popover: popoverLight
   },
-  self: self$1r
+  self: self$1s
 });
 
 const tooltipDark = {
@@ -24817,10 +24878,10 @@ const tooltipDark = {
   peers: {
     Popover: popoverDark
   },
-  self: self$1r
+  self: self$1s
 };
 
-var style$1E = cB("tooltip", "", [cE("content", `
+var style$1F = cB("tooltip", "", [cE("content", `
     display: flex;
     align-items: flex-start;
   `), cE("icon", `
@@ -24946,7 +25007,7 @@ var _UTooltip = defineComponent({
     const themeRef = useTheme(
       "Tooltip",
       "-tooltip",
-      props.variant === "plain" ? void 0 : style$1E,
+      props.variant === "plain" ? void 0 : style$1F,
       tooltipLight,
       props,
       mergedClsPrefixRef
@@ -25076,7 +25137,7 @@ const ellipsisLight = createTheme$1({
   }
 });
 
-var style$1D = cB("ellipsis", {
+var style$1E = cB("ellipsis", {
   overflow: "hidden"
 }, [cNotM("line-clamp", `
     white-space: nowrap;
@@ -25114,7 +25175,7 @@ var _UEllipsis = defineComponent({
     const mergedTheme = useTheme(
       "Ellipsis",
       "-ellipsis",
-      style$1D,
+      style$1E,
       ellipsisLight,
       props,
       mergedClsPrefixRef
@@ -25271,7 +25332,7 @@ const UPerformantEllipsis$1 = defineComponent({
   setup(props, { attrs, slots }) {
     const mouseEnteredRef = ref(false);
     const mergedClsPrefixRef = useMergedClsPrefix();
-    useStyle("-ellipsis", style$1D, mergedClsPrefixRef);
+    useStyle("-ellipsis", style$1E, mergedClsPrefixRef);
     const renderTrigger = () => {
       const { lineClamp } = props;
       const mergedClsPrefix = mergedClsPrefixRef.value;
@@ -25311,7 +25372,7 @@ const UPerformantEllipsis$1 = defineComponent({
   }
 });
 
-function self$1q(vars) {
+function self$1r(vars) {
   const {
     borderRadiusLarge,
     elementsQuaternary,
@@ -25353,21 +25414,21 @@ function self$1q(vars) {
 const actionCardLight = {
   name: "ActionCard",
   common: derived,
-  self: self$1q
+  self: self$1r
 };
 
 const actionCardDark = {
   name: "ActionCard",
   common: derived$1,
   self: vars => {
-    const lightVars = self$1q(vars);
+    const lightVars = self$1r(vars);
     return {
       ...lightVars
     };
   }
 };
 
-var style$1C = cB("action-card", `
+var style$1D = cB("action-card", `
   position: relative;
   width: var(--u-width);
   min-height: var(--u-min-height);
@@ -25488,7 +25549,7 @@ var _UActionCard = defineComponent({
     const themeRef = useTheme(
       "ActionCard",
       "-action-card",
-      style$1C,
+      style$1D,
       actionCardLight,
       props,
       mergedClsPrefixRef
@@ -25619,7 +25680,7 @@ var _UActionCard = defineComponent({
   }
 });
 
-var style$1B = cB("affix", [cM("affixed", {
+var style$1C = cB("affix", [cM("affixed", {
   position: "fixed"
 }, [cM("absolute-positioned", {
   position: "absolute"
@@ -25689,7 +25750,7 @@ var _UAffix = defineComponent({
   props: affixProps,
   setup(props) {
     const { mergedClsPrefixRef } = useConfig(props);
-    useStyle("-affix", style$1B, mergedClsPrefixRef);
+    useStyle("-affix", style$1C, mergedClsPrefixRef);
     let scrollTarget = null;
     const stickToTopRef = ref(false);
     const stickToBottomRef = ref(false);
@@ -25825,7 +25886,7 @@ var commonVars$8 = {
   descriptionSpaceBanner: "24px"
 };
 
-function self$1p(vars) {
+function self$1q(vars) {
   const {
     iconMedium,
     closeMedium,
@@ -25934,13 +25995,13 @@ function self$1p(vars) {
 const alertLight = {
   name: "Alert",
   common: derived,
-  self: self$1p
+  self: self$1q
 };
 
 const alertDark = {
   name: "Alert",
   common: derived$1,
-  self: self$1p
+  self: self$1q
 };
 
 var rtlStyle$r = cB("alert", [cM("rtl", `
@@ -26016,7 +26077,7 @@ function fadeInHeightExpandTransition({
     `)];
 }
 
-var style$1A = cB("alert", `
+var style$1B = cB("alert", `
   line-height: var(--u-line-height);
   position: relative;
   transition: background-color .3s var(--u-bezier);
@@ -26195,7 +26256,7 @@ var _UAlert = defineComponent({
     const themeRef = useTheme(
       "Alert",
       "-alert",
-      style$1A,
+      style$1B,
       alertLight,
       props,
       mergedClsPrefixRef
@@ -26336,7 +26397,7 @@ var _UAlert = defineComponent({
   }
 });
 
-function self$1o(vars) {
+function self$1p(vars) {
   const {
     borderRadius,
     fontBodyMedium,
@@ -26366,13 +26427,13 @@ function self$1o(vars) {
 const anchorLight = {
   name: "Anchor",
   common: derived,
-  self: self$1o
+  self: self$1p
 };
 
 const anchorDark = {
   name: "Anchor",
   common: derived$1,
-  self: self$1o
+  self: self$1p
 };
 
 const anchorInjectionKey = createInjectionKey("u-anchor");
@@ -26711,7 +26772,7 @@ var UBaseAnchor = defineComponent({
   }
 });
 
-var style$1z = cB("anchor", `
+var style$1A = cB("anchor", `
   position: relative;
 `, [cNotM("block", `
     padding-left: var(--u-rail-width);
@@ -26801,7 +26862,7 @@ var _UAnchor = defineComponent({
     const themeRef = useTheme(
       "Anchor",
       "-anchor",
-      style$1z,
+      style$1A,
       anchorLight,
       props,
       mergedClsPrefixRef
@@ -26881,7 +26942,7 @@ const isChrome = isBrowser$1 && "chrome" in window;
 isBrowser$1 && navigator.userAgent.includes("Firefox");
 const isSafari = isBrowser$1 && navigator.userAgent.includes("Safari") && !isChrome;
 
-function self$1n(vars) {
+function self$1o(vars) {
   const {
     iconMedium,
     textSecondary,
@@ -26992,13 +27053,13 @@ function self$1n(vars) {
 const inputLight = {
   name: "Input",
   common: derived,
-  self: self$1n
+  self: self$1o
 };
 
 const inputDark = {
   name: "Input",
   common: derived$1,
-  self: self$1n
+  self: self$1o
 };
 
 var rtlStyle$q = cB("input", [cM("rtl", `
@@ -27024,7 +27085,7 @@ const inputRtl = {
 
 const inputInjectionKey = createInjectionKey("u-input");
 
-var style$1y = cB("input", `
+var style$1z = cB("input", `
   max-width: 100%;
   cursor: text;
   line-height: 1.5;
@@ -27572,7 +27633,7 @@ var commonVariables$5 = {
   rippleDuration: ".6s"
 };
 
-function self$1m(vars) {
+function self$1n(vars) {
   const {
     heightMini,
     heightTiny,
@@ -27828,13 +27889,13 @@ function self$1m(vars) {
 const buttonLight = {
   name: "Button",
   common: derived,
-  self: self$1m
+  self: self$1n
 };
 
 const buttonDark = {
   name: "Button",
   common: derived$1,
-  self: self$1m
+  self: self$1n
 };
 
 var rtlStyle$p = cB("button", [cM("rtl", `
@@ -27852,7 +27913,7 @@ const buttonRtl = {
   style: rtlStyle$p
 };
 
-var style$1x = c$1([cB("button", `
+var style$1y = c$1([cB("button", `
     margin: 0;
     font-weight: var(--u-font-weight);
     line-height: 1;
@@ -28183,7 +28244,7 @@ const Button = defineComponent({
     const themeRef = useTheme(
       "Button",
       "-button",
-      style$1x,
+      style$1y,
       buttonLight,
       props,
       mergedClsPrefixRef
@@ -28617,7 +28678,7 @@ var commonVariables$4 = {
   iconMargin: "0 16px 0 0"
 };
 
-function self$1l(vars) {
+function self$1m(vars) {
   const {
     closeMedium,
     iconMedium,
@@ -28702,13 +28763,13 @@ function self$1l(vars) {
 const messageLight = {
   name: "Message",
   common: derived,
-  self: self$1l
+  self: self$1m
 };
 
 const messageDark = {
   name: "Message",
   common: derived$1,
-  self: self$1l
+  self: self$1m
 };
 
 var rtlStyle$o = cB("message", [cM("rtl", `
@@ -28743,7 +28804,7 @@ const messageProps = {
   onMouseleave: Function
 };
 
-var style$1w = c$1([cB("message-wrapper", `
+var style$1x = c$1([cB("message-wrapper", `
     margin: var(--u-margin);
     z-index: 0;
     transform-origin: top center;
@@ -28864,7 +28925,7 @@ var UMessage = defineComponent({
     const themeRef = useTheme(
       "Message",
       "-message",
-      style$1w,
+      style$1x,
       messageLight,
       messageProviderProps,
       mergedClsPrefixRef
@@ -29543,7 +29604,7 @@ var UInput$1 = defineComponent({
     const themeRef = useTheme(
       "Input",
       "-input",
-      style$1y,
+      style$1z,
       inputLight,
       props,
       mergedClsPrefixRef
@@ -29782,10 +29843,12 @@ var UInput$1 = defineComponent({
     }
     function handleInput(e, index = 0, event = "input") {
       let targetValue = e.target.value;
+      const sourceValue = targetValue;
       if (props.uppercase)
         targetValue = targetValue.toUpperCase();
       if (props.formatter)
         targetValue = props.formatter(targetValue);
+      const valueTransformed = targetValue !== sourceValue;
       syncMirror(targetValue);
       if (e instanceof InputEvent && !e.isComposing) {
         isComposingRef.value = false;
@@ -29816,7 +29879,7 @@ var UInput$1 = defineComponent({
         }
       }
       vm.$forceUpdate();
-      if (!isIncomingValueValid) {
+      if (!isIncomingValueValid || valueTransformed) {
         void nextTick(focusedInputCursorControl.restoreCursor);
       }
     }
@@ -30630,7 +30693,7 @@ var UInput$1 = defineComponent({
   }
 });
 
-var style$1v = cB("input-group", `
+var style$1w = cB("input-group", `
   display: inline-flex;
   width: 100%;
   flex-wrap: nowrap;
@@ -30693,7 +30756,7 @@ var _UInputGroup = defineComponent({
   props: inputGroupProps,
   setup(props) {
     const { mergedClsPrefixRef } = useConfig(props);
-    useStyle("-input-group", style$1v, mergedClsPrefixRef);
+    useStyle("-input-group", style$1w, mergedClsPrefixRef);
     return {
       mergedClsPrefix: mergedClsPrefixRef
     };
@@ -30704,7 +30767,7 @@ var _UInputGroup = defineComponent({
   }
 });
 
-var style$1u = cB("input-group-label", `
+var style$1v = cB("input-group-label", `
   position: relative;
   user-select: none;
   -webkit-user-select: none;
@@ -30752,7 +30815,7 @@ var _UInputGroupLabel = defineComponent({
     const themeRef = useTheme(
       "Input",
       "-input-group-label",
-      style$1u,
+      style$1v,
       inputLight,
       props,
       mergedClsPrefixRef
@@ -30878,7 +30941,7 @@ function createValOptMap(options, valueField, childrenField) {
   return valOptMap;
 }
 
-function self$1k(vars) {
+function self$1l(vars) {
   const {
     shadowDepth2
   } = vars;
@@ -30893,7 +30956,7 @@ const autoCompleteLight = createTheme$1({
     InternalSelectMenu: internalSelectMenuLight,
     Input: inputLight
   },
-  self: self$1k
+  self: self$1l
 });
 
 const autoCompleteDark = {
@@ -30903,10 +30966,10 @@ const autoCompleteDark = {
     InternalSelectMenu: internalSelectMenuDark,
     Input: inputDark
   },
-  self: self$1k
+  self: self$1l
 };
 
-var style$1t = c$1([cB("auto-complete", `
+var style$1u = c$1([cB("auto-complete", `
     z-index: auto;
     position: relative;
     display: inline-flex;
@@ -31036,7 +31099,7 @@ var _UAutoComplete = defineComponent({
     const themeRef = useTheme(
       "AutoComplete",
       "-auto-complete",
-      style$1t,
+      style$1u,
       autoCompleteLight,
       props,
       mergedClsPrefixRef
@@ -31433,7 +31496,7 @@ const observeIntersection = (el, options, shouldStartLoadingRef) => {
   return unobserve;
 };
 
-function self$1j(vars) {
+function self$1k(vars) {
   const {
     heightSmall,
     heightMedium,
@@ -31454,16 +31517,16 @@ function self$1j(vars) {
 const skeletonLight = {
   name: "Skeleton",
   common: derived,
-  self: self$1j
+  self: self$1k
 };
 
 const skeletonDark = {
   name: "Skeleton",
   common: derived$1,
-  self: self$1j
+  self: self$1k
 };
 
-var style$1s = c$1([cB("skeleton", `
+var style$1t = c$1([cB("skeleton", `
     height: 1em;
     width: 100%;
     transition: background-color .3s var(--u-bezier);
@@ -31522,7 +31585,7 @@ var _USkeleton = defineComponent({
     const themeRef = useTheme(
       "Skeleton",
       "-skeleton",
-      style$1s,
+      style$1t,
       skeletonLight,
       props,
       mergedClsPrefixRef
@@ -31577,7 +31640,7 @@ var _USkeleton = defineComponent({
   }
 });
 
-function self$1i(vars) {
+function self$1j(vars) {
   const {
     borderRadius,
     heightSmall,
@@ -31609,18 +31672,18 @@ function self$1i(vars) {
 const avatarLight = {
   name: "Avatar",
   common: derived,
-  self: self$1i
+  self: self$1j
 };
 
 const avatarDark = {
   name: "Avatar",
   common: derived$1,
-  self: self$1i
+  self: self$1j
 };
 
 const avatarGroupInjectionKey = createInjectionKey("u-avatar-group");
 
-var style$1r = cB("avatar", `
+var style$1s = cB("avatar", `
   width: var(--u-merged-size);
   height: var(--u-merged-size);
   color: var(--u-text-color);
@@ -31732,7 +31795,7 @@ var _UAvatar = defineComponent({
     const themeRef = useTheme(
       "Avatar",
       "-avatar",
-      style$1r,
+      style$1s,
       avatarLight,
       props,
       mergedClsPrefixRef
@@ -31943,7 +32006,7 @@ var _UAvatar = defineComponent({
   }
 });
 
-function self$1h() {
+function self$1i() {
   return {
     gap: "-12px"
   };
@@ -31954,7 +32017,7 @@ const avatarGroupLight = createTheme$1({
   peers: {
     Avatar: avatarLight
   },
-  self: self$1h
+  self: self$1i
 });
 
 const avatarGroupDark = {
@@ -31963,7 +32026,7 @@ const avatarGroupDark = {
   peers: {
     Avatar: avatarDark
   },
-  self: self$1h
+  self: self$1i
 };
 
 var rtlStyle$n = cB("avatar-group", [cM("rtl", `
@@ -31980,7 +32043,7 @@ const avatarGroupRtl = {
   style: rtlStyle$n
 };
 
-var style$1q = cB("avatar-group", `
+var style$1r = cB("avatar-group", `
   flex-wrap: nowrap;
   display: inline-flex;
   position: relative;
@@ -32015,7 +32078,7 @@ var _UAvatarGroup = defineComponent({
     const mergedThemeRef = useTheme(
       "AvatarGroup",
       "-avatar-group",
-      style$1q,
+      style$1r,
       avatarGroupLight,
       props,
       mergedClsPrefixRef
@@ -32104,7 +32167,7 @@ var _UAvatarGroup = defineComponent({
   }
 });
 
-function self$1g(vars) {
+function self$1h(vars) {
   const {
     heightLarge,
     iconMedium,
@@ -32129,13 +32192,13 @@ function self$1g(vars) {
 const backTopLight = {
   name: "BackTop",
   common: derived,
-  self: self$1g
+  self: self$1h
 };
 
 const backTopDark = {
   name: "BackTop",
   common: derived$1,
-  self: self$1g
+  self: self$1h
 };
 
 var BackTopIcon = /* @__PURE__ */ h(
@@ -32149,7 +32212,7 @@ var BackTopIcon = /* @__PURE__ */ h(
   /* @__PURE__ */ h("g", { stroke: "none", "stroke-width": "1", "fill-rule": "evenodd" }, /* @__PURE__ */ h("g", { transform: "translate(-139.000000, -4423.000000)", "fill-rule": "nonzero" }, /* @__PURE__ */ h("g", { transform: "translate(120.000000, 4285.000000)" }, /* @__PURE__ */ h("g", { transform: "translate(7.000000, 126.000000)" }, /* @__PURE__ */ h("g", { transform: "translate(24.000000, 24.000000) scale(1, -1) translate(-24.000000, -24.000000) translate(12.000000, 12.000000)" }, /* @__PURE__ */ h("g", { transform: "translate(4.000000, 2.000000)" }, /* @__PURE__ */ h("path", { d: "M8,0 C8.51283584,0 8.93550716,0.38604019 8.99327227,0.883378875 L9,1 L9,10.584 L12.2928932,7.29289322 C12.6834175,6.90236893 13.3165825,6.90236893 13.7071068,7.29289322 C14.0675907,7.65337718 14.0953203,8.22060824 13.7902954,8.61289944 L13.7071068,8.70710678 L8.70710678,13.7071068 L8.62544899,13.7803112 L8.618,13.784 L8.59530661,13.8036654 L8.4840621,13.8753288 L8.37133602,13.9287745 L8.22929083,13.9735893 L8.14346259,13.9897165 L8.03324678,13.9994506 L7.9137692,13.9962979 L7.77070917,13.9735893 L7.6583843,13.9401293 L7.57677845,13.9063266 L7.47929125,13.8540045 L7.4048407,13.8036865 L7.38131006,13.7856883 C7.35030318,13.7612383 7.32077858,13.7349921 7.29289322,13.7071068 L2.29289322,8.70710678 L2.20970461,8.61289944 C1.90467972,8.22060824 1.93240926,7.65337718 2.29289322,7.29289322 C2.65337718,6.93240926 3.22060824,6.90467972 3.61289944,7.20970461 L3.70710678,7.29289322 L7,10.585 L7,1 L7.00672773,0.883378875 C7.06449284,0.38604019 7.48716416,0 8,0 Z" }), /* @__PURE__ */ h("path", { d: "M14.9333333,15.9994506 C15.5224371,15.9994506 16,16.4471659 16,16.9994506 C16,17.5122865 15.5882238,17.9349578 15.0577292,17.9927229 L14.9333333,17.9994506 L1.06666667,17.9994506 C0.477562934,17.9994506 0,17.5517354 0,16.9994506 C0,16.4866148 0.411776203,16.0639435 0.9422708,16.0061783 L1.06666667,15.9994506 L14.9333333,15.9994506 Z" })))))))
 );
 
-var style$1p = cB("back-top", `
+var style$1q = cB("back-top", `
   position: fixed;
   right: 40px;
   bottom: 40px;
@@ -32288,7 +32351,7 @@ var _UBackTop = defineComponent({
     const themeRef = useTheme(
       "BackTop",
       "-back-top",
-      style$1p,
+      style$1q,
       backTopLight,
       props,
       mergedClsPrefixRef
@@ -32439,7 +32502,7 @@ var _UBackTop = defineComponent({
   }
 });
 
-function self$1f(vars) {
+function self$1g(vars) {
   const {
     brandQuaternary500,
     elementsPrimary,
@@ -32472,13 +32535,13 @@ function self$1f(vars) {
 const badgeLight = {
   name: "Badge",
   common: derived,
-  self: self$1f
+  self: self$1g
 };
 
 const badgeDark = {
   name: "Badge",
   common: derived$1,
-  self: self$1f
+  self: self$1g
 };
 
 var rtlStyle$m = cB("badge", [cM("rtl", `
@@ -32495,7 +32558,7 @@ const badgeRtl = {
   style: rtlStyle$m
 };
 
-var style$1o = c$1([c$1("@keyframes badge-wave-spread", {
+var style$1p = c$1([c$1("@keyframes badge-wave-spread", {
   from: {
     boxShadow: "0 0 0.5px 0px var(--u-ripple-color)",
     opacity: 0.6
@@ -32609,7 +32672,7 @@ var _UBadge = defineComponent({
     const themeRef = useTheme(
       "Badge",
       "-badge",
-      style$1o,
+      style$1p,
       badgeLight,
       props,
       mergedClsPrefixRef
@@ -32745,7 +32808,7 @@ var _UBadge = defineComponent({
   }
 });
 
-function self$1e(vars) {
+function self$1f(vars) {
   const {
     fontWeightStrong,
     fontBodyMedium,
@@ -32768,16 +32831,16 @@ function self$1e(vars) {
 const breadcrumbLight = {
   name: "Breadcrumb",
   common: derived,
-  self: self$1e
+  self: self$1f
 };
 
 const breadcrumbDark = {
   name: "Breadcrumb",
   common: derived$1,
-  self: self$1e
+  self: self$1f
 };
 
-var style$1n = cB("breadcrumb", `
+var style$1o = cB("breadcrumb", `
   white-space: nowrap;
   cursor: default;
   line-height: var(--u-item-line-height);
@@ -32847,7 +32910,7 @@ var _UBreadcrumb = defineComponent({
     const themeRef = useTheme(
       "Breadcrumb",
       "-breadcrumb",
-      style$1n,
+      style$1o,
       breadcrumbLight,
       props,
       mergedClsPrefixRef
@@ -33032,7 +33095,7 @@ function createTopBorderStyle(type) {
     top: n1
   })])])])]);
 }
-var style$1m = cB("button-group", `
+var style$1n = cB("button-group", `
   flex-wrap: nowrap;
   display: inline-flex;
   position: relative;
@@ -33081,7 +33144,7 @@ var _UButtonGroup = defineComponent({
   props: buttonGroupProps,
   setup(props) {
     const { mergedClsPrefixRef, mergedRtlRef } = useConfig(props);
-    useStyle("-button-group", style$1m, mergedClsPrefixRef);
+    useStyle("-button-group", style$1n, mergedClsPrefixRef);
     provide(buttonGroupInjectionKey, props);
     const rtlEnabledRef = useRtl(
       "ButtonGroup",
@@ -39025,7 +39088,7 @@ function getMsByDateCommonItem(item) {
   return resultDate.getTime();
 }
 
-function self$1d(vars) {
+function self$1e(vars) {
   const {
     borderRadius,
     fontWeightStrong,
@@ -39069,7 +39132,7 @@ const calendarLight = createTheme$1({
   peers: {
     Button: buttonLight
   },
-  self: self$1d
+  self: self$1e
 });
 
 const calendarDark = {
@@ -39078,10 +39141,10 @@ const calendarDark = {
   peers: {
     Button: buttonDark
   },
-  self: self$1d
+  self: self$1e
 };
 
-var style$1l = c$1([cB("calendar", `
+var style$1m = c$1([cB("calendar", `
     line-height: var(--u-line-height);
     font-size: var(--u-font-size);
     color: var(--u-text-color);
@@ -39220,7 +39283,7 @@ var _UCalendar = defineComponent({
     const themeRef = useTheme(
       "Calendar",
       "-calendar",
-      style$1l,
+      style$1m,
       calendarLight,
       props,
       mergedClsPrefixRef
@@ -39508,7 +39571,7 @@ var commonVariables$3 = {
   paddingHuge: "27px 40px 28px"
 };
 
-function self$1c(vars) {
+function self$1d(vars) {
   const {
     borderRadius,
     fontWeight,
@@ -39574,13 +39637,13 @@ function self$1c(vars) {
 const cardLight = {
   name: "Card",
   common: derived,
-  self: self$1c
+  self: self$1d
 };
 
 const cardDark$1 = {
   name: "Card",
   common: derived$1,
-  self: self$1c
+  self: self$1d
 };
 
 var rtlStyle$l = cB("card", [cM("rtl", `
@@ -39603,7 +39666,7 @@ const contentBaseStyle = cB("card-content", `
 `, [c$1("&:first-child", {
   paddingTop: "var(--u-padding-bottom)"
 })]);
-var style$1k = c$1([cB("card", `
+var style$1l = c$1([cB("card", `
     font-size: var(--u-font-size);
     line-height: var(--u-line-height);
     font-weight: var(--u-font-weight);
@@ -39786,7 +39849,7 @@ var _UCard = defineComponent({
     const themeRef = useTheme(
       "Card",
       "-card",
-      style$1k,
+      style$1l,
       cardLight,
       props,
       mergedClsPrefixRef
@@ -40369,7 +40432,7 @@ var UGi$1 = defineComponent({
   }
 });
 
-function self$1b(vars) {
+function self$1c(vars) {
   const {
     textSecondary,
     textPrimary,
@@ -40404,10 +40467,10 @@ function self$1b(vars) {
 const cardListLight = {
   name: "CardList",
   common: derived,
-  self: self$1b
+  self: self$1c
 };
 
-var style$1j = cB("card-list-item", [c$1("&", {
+var style$1k = cB("card-list-item", [c$1("&", {
   padding: "16px",
   borderRadius: "var(--u-border-radius)",
   display: "flex",
@@ -40528,7 +40591,7 @@ var UCardListItem = defineComponent({
   props: cardListItemProps,
   setup(props, { slots }) {
     const { mergedClsPrefixRef } = useConfig(props);
-    useStyle("-card-list-item", style$1j, mergedClsPrefixRef);
+    useStyle("-card-list-item", style$1k, mergedClsPrefixRef);
     const isOpen = ref(false);
     const toggle = () => {
       isOpen.value = !isOpen.value;
@@ -40659,7 +40722,7 @@ var _UCardList = defineComponent({
     const themeRef = useTheme(
       "CardList",
       "-card-list",
-      style$1j,
+      style$1k,
       cardListLight,
       props,
       mergedClsPrefixRef
@@ -40756,7 +40819,7 @@ var _UCardList = defineComponent({
   }
 });
 
-function self$1a() {
+function self$1b() {
   return {
     dotSize: "8px",
     dotColor: "rgba(255, 255, 255, .3)",
@@ -40770,13 +40833,13 @@ function self$1a() {
 const carouselLight = {
   name: "Carousel",
   common: derived,
-  self: self$1a
+  self: self$1b
 };
 
 const carouselDark = {
   name: "Carousel",
   common: derived$1,
-  self: self$1a
+  self: self$1b
 };
 
 const carouselMethodsInjectionKey = createInjectionKey("u-carousel-methods");
@@ -41060,7 +41123,7 @@ var _UCarouselItem = defineComponent({
   }
 });
 
-var style$1i = cB("carousel", `
+var style$1j = cB("carousel", `
   position: relative;
   width: 100%;
   height: 100%;
@@ -42062,7 +42125,7 @@ var _UCarousel = defineComponent({
     const themeRef = useTheme(
       "Carousel",
       "-carousel",
-      style$1i,
+      style$1j,
       carouselLight,
       props,
       mergedClsPrefixRef
@@ -42222,7 +42285,7 @@ var commonVariables$2 = {
   labelPadding: "0 16px"
 };
 
-function self$19(vars) {
+function self$1a(vars) {
   const {
     lineHeightBodyLarge,
     fontBodyLarge,
@@ -42298,13 +42361,13 @@ function self$19(vars) {
 const checkboxLight = {
   name: "Checkbox",
   common: derived,
-  self: self$19
+  self: self$1a
 };
 
 const checkboxDark = {
   name: "Checkbox",
   common: derived$1,
-  self: self$19
+  self: self$1a
 };
 
 var rtlStyle$k = cB("checkbox", [cM("rtl", `
@@ -42316,7 +42379,7 @@ const checkboxRtl = {
   style: rtlStyle$k
 };
 
-function self$18(vars) {
+function self$19(vars) {
   const {
     borderRadius,
     heightMedium,
@@ -42357,7 +42420,7 @@ const cascaderLight = createTheme$1({
     Checkbox: checkboxLight,
     Empty: emptyLight
   },
-  self: self$18
+  self: self$19
 });
 
 const cascaderDark = {
@@ -42370,14 +42433,14 @@ const cascaderDark = {
     Checkbox: checkboxDark,
     Empty: emptyLight
   },
-  self: self$18
+  self: self$19
 };
 
 var CheckMark = /* @__PURE__ */ h("svg", { width: "20", height: "20", viewBox: "0 0 20 20", class: "check-icon" }, /* @__PURE__ */ h("path", { d: "M7.95833 14.6458C7.84722 14.6458 7.74306 14.6283 7.64583 14.5933C7.54861 14.5589 7.45833 14.5 7.375 14.4166L3.79167 10.8333C3.63889 10.6805 3.56583 10.4825 3.5725 10.2391C3.57972 9.99637 3.65972 9.79859 3.8125 9.64581C3.96528 9.49304 4.15972 9.41665 4.39583 9.41665C4.63195 9.41665 4.82639 9.49304 4.97917 9.64581L7.95833 12.625L15.0208 5.56248C15.1736 5.4097 15.3717 5.33331 15.615 5.33331C15.8578 5.33331 16.0556 5.4097 16.2083 5.56248C16.3611 5.71526 16.4375 5.91304 16.4375 6.15581C16.4375 6.39915 16.3611 6.5972 16.2083 6.74998L8.54167 14.4166C8.45833 14.5 8.36806 14.5589 8.27083 14.5933C8.17361 14.6283 8.06945 14.6458 7.95833 14.6458Z" }));
 
 var LineMark = /* @__PURE__ */ h("svg", { width: "22", height: "24", viewBox: "0 0 22 24", class: "line-icon" }, /* @__PURE__ */ h("path", { d: "M5.49998 13C5.24026 13 5.0224 12.904 4.8464 12.712C4.67101 12.5207 4.58331 12.2833 4.58331 12C4.58331 11.7167 4.67101 11.479 4.8464 11.287C5.0224 11.0957 5.24026 11 5.49998 11H16.5C16.7597 11 16.9773 11.0957 17.1526 11.287C17.3286 11.479 17.4166 11.7167 17.4166 12C17.4166 12.2833 17.3286 12.5207 17.1526 12.712C16.9773 12.904 16.7597 13 16.5 13H5.49998Z" }));
 
-var style$1h = c$1([iconSwitchTransition(), c$1("@keyframes ripple", {
+var style$1i = c$1([iconSwitchTransition(), c$1("@keyframes ripple", {
   from: {
     transform: "scale(0)"
   },
@@ -42591,7 +42654,7 @@ var _UCheckbox = defineComponent({
     const themeRef = useTheme(
       "Checkbox",
       "-checkbox",
-      style$1h,
+      style$1i,
       checkboxLight,
       props,
       mergedClsPrefixRef
@@ -43665,7 +43728,7 @@ var CascaderSelectMenu = defineComponent({
   }
 });
 
-var style$1g = c$1([cB("cascader-menu", `
+var style$1h = c$1([cB("cascader-menu", `
     outline: none;
     position: relative;
     margin: 4px 0;
@@ -43907,7 +43970,7 @@ var _UCascader = defineComponent({
     const themeRef = useTheme(
       "Cascader",
       "-cascader",
-      style$1g,
+      style$1h,
       cascaderLight,
       props,
       mergedClsPrefixRef
@@ -44839,12 +44902,12 @@ const flexDark = {
   }
 };
 
-function self$17() {
+function self$18() {
   return commonVars$7;
 }
 const flexLight = {
   name: "Flex",
-  self: self$17
+  self: self$18
 };
 
 cB("space", [cM("rtl", `
@@ -44962,7 +45025,7 @@ var _UFlex = defineComponent({
   }
 });
 
-function self$16(vars) {
+function self$17(vars) {
   const {
     borderRadius,
     borderRadiusMedium,
@@ -45006,13 +45069,13 @@ function self$16(vars) {
 const listLight = {
   name: "List",
   common: derived,
-  self: self$16
+  self: self$17
 };
 
 const listDark$1 = {
   name: "List",
   common: derived$1,
-  self: self$16
+  self: self$17
 };
 
 var rtlStyle$j = cB("list", [cM("rtl", `
@@ -45031,7 +45094,7 @@ const listRtl = {
   style: rtlStyle$j
 };
 
-function self$15(vars) {
+function self$16(vars) {
   const {
     shadowDepth2
   } = vars;
@@ -45046,7 +45109,7 @@ const selectLight = createTheme$1({
     InternalSelection: internalSelectionLight,
     InternalSelectMenu: internalSelectMenuLight
   },
-  self: self$15
+  self: self$16
 });
 
 const selectDark = {
@@ -45056,13 +45119,13 @@ const selectDark = {
     InternalSelection: internalSelectionDark,
     InternalSelectMenu: internalSelectMenuDark
   },
-  self: self$15
+  self: self$16
 };
 
 ({
   style: c$1([])});
 
-function self$14(vars) {
+function self$15(vars) {
   const {
     borderRadiusSmall,
     fontWeightStrong,
@@ -45157,19 +45220,19 @@ function self$14(vars) {
 const typographyLight = {
   name: "Typography",
   common: derived,
-  self: self$14
+  self: self$15
 };
 
 const typographyDark = {
   name: "Typography",
   common: derived$1,
-  self: self$14
+  self: self$15
 };
 
 const chatInputLight = {
   ...inputLight,
   self(vars) {
-    const originalInputSelf = self$1n(vars);
+    const originalInputSelf = self$1o(vars);
     const {
       elementsTertiary
     } = vars;
@@ -45189,7 +45252,7 @@ const chatInputLight = {
 const chatBadgeLight = {
   ...badgeLight,
   self(vars) {
-    const originalBadgeSelf = self$1f(vars);
+    const originalBadgeSelf = self$1g(vars);
     const {
       brandPrimary400,
       elementsSecondary
@@ -45201,7 +45264,7 @@ const chatBadgeLight = {
     };
   }
 };
-function self$13(vars) {
+function self$14(vars) {
   const {
     borderRadiusLarge,
     elementsQuaternary,
@@ -45274,7 +45337,7 @@ const chatLight = createTheme$1({
     HeaderShareIcon: iconLight,
     HeaderProfileIcon: iconLight
   },
-  self: self$13
+  self: self$14
 });
 
 const chatDark = createTheme$1({
@@ -45296,7 +45359,7 @@ const chatDark = createTheme$1({
     HeaderProfileIcon: iconDark$1
   },
   self: vars => {
-    const lightVars = self$13(vars);
+    const lightVars = self$14(vars);
     return {
       ...lightVars
     };
@@ -45404,7 +45467,7 @@ const listProps = {
 };
 const listInjectionKey = createInjectionKey("u-list");
 
-var style$1f = c$1([cB("align-start", `
+var style$1g = c$1([cB("align-start", `
     align-self: self-start;
   `), cB("align-center", `
     align-self: center;
@@ -45537,7 +45600,7 @@ var _UList = defineComponent({
     const themeRef = useTheme(
       "List",
       "-list",
-      style$1f,
+      style$1g,
       listLight,
       props,
       mergedClsPrefixRef
@@ -46019,7 +46082,7 @@ const SafeTopScrollbar = defineComponent({
   }
 });
 
-var style$1e = cB("a", `
+var style$1f = cB("a", `
   cursor: pointer;
   transition:
     color .3s var(--u-bezier),
@@ -46042,7 +46105,7 @@ var a = defineComponent({
     const themeRef = useTheme(
       "Typography",
       "-a",
-      style$1e,
+      style$1f,
       typographyLight,
       props,
       mergedClsPrefixRef
@@ -46078,7 +46141,7 @@ var a = defineComponent({
   }
 });
 
-var style$1d = cB("blockquote", `
+var style$1e = cB("blockquote", `
   font-size: var(--u-font-size);
   line-height: var(--u-line-height);
   margin: 0;
@@ -46117,7 +46180,7 @@ var _UBlockquote = defineComponent({
     const themeRef = useTheme(
       "Typography",
       "-blockquote",
-      style$1d,
+      style$1e,
       typographyLight,
       props,
       mergedClsPrefixRef
@@ -46166,7 +46229,7 @@ var _UBlockquote = defineComponent({
   }
 });
 
-var style$1c = cB("h", `
+var style$1d = cB("h", `
   font-size: var(--u-font-size);
   font-weight: var(--u-font-weight);
   margin: var(--u-margin);
@@ -46211,7 +46274,7 @@ var createHeader = level => defineComponent({
       mergedClsPrefixRef,
       inlineThemeDisabled
     } = useConfig(props);
-    const themeRef = useTheme("Typography", "-h", style$1c, typographyLight, props, mergedClsPrefixRef);
+    const themeRef = useTheme("Typography", "-h", style$1d, typographyLight, props, mergedClsPrefixRef);
     const cssVarsRef = computed(() => {
       const {
         type
@@ -46275,7 +46338,7 @@ const UH4$1 = createHeader("4");
 const UH5$1 = createHeader("5");
 const UH6$1 = createHeader("6");
 
-var style$1b = cB("hr", `
+var style$1c = cB("hr", `
   margin: 12px 0;
   transition: border-color .3s var(--u-bezier);
   border-left: none;
@@ -46300,7 +46363,7 @@ var _UHr = defineComponent({
     const themeRef = useTheme(
       "Typography",
       "-hr",
-      style$1b,
+      style$1c,
       typographyLight,
       props,
       mergedClsPrefixRef
@@ -46354,7 +46417,7 @@ const childStyle = [c$1("&:first-child", `
   `), c$1("&:last-child", `
     margin-bottom: 0;
   `)];
-var style$1a = c$1([cB("ol", {
+var style$1b = c$1([cB("ol", {
   fontSize: "var(--u-font-size)",
   padding: "var(--u-ol-padding)"
 }, [cM("align-text", {
@@ -46378,7 +46441,7 @@ var _UOl = defineComponent({
     const themeRef = useTheme(
       "Typography",
       "-xl",
-      style$1a,
+      style$1b,
       typographyLight,
       props,
       mergedClsPrefixRef
@@ -46431,7 +46494,7 @@ var _UOl = defineComponent({
   }
 });
 
-var style$19 = cB("p", `
+var style$1a = cB("p", `
   box-sizing: border-box;
   transition: color .3s var(--u-bezier);
   margin: var(--u-margin);
@@ -46452,7 +46515,7 @@ var p = defineComponent({
     const themeRef = useTheme(
       "Typography",
       "-p",
-      style$19,
+      style$1a,
       typographyLight,
       props,
       mergedClsPrefixRef
@@ -46592,7 +46655,7 @@ var _UUl = defineComponent({
     const themeRef = useTheme(
       "Typography",
       "-xl",
-      style$1a,
+      style$1b,
       typographyLight,
       props,
       mergedClsPrefixRef
@@ -46645,7 +46708,7 @@ var _UUl = defineComponent({
   }
 });
 
-function self$12(vars) {
+function self$13(vars) {
   const {
     fontWeight,
     fontBodyMedium,
@@ -46686,16 +46749,16 @@ function self$12(vars) {
 const progressLight = {
   name: "Progress",
   common: derived,
-  self: self$12
+  self: self$13
 };
 
 const progressDark = {
   name: "Progress",
   common: derived$1,
-  self: self$12
+  self: self$13
 };
 
-function self$11(vars) {
+function self$12(vars) {
   const {
     staticGreen,
     staticRed,
@@ -46752,7 +46815,7 @@ const uploadLight = createTheme$1({
     Button: buttonLight,
     Progress: progressLight
   },
-  self: self$11
+  self: self$12
 });
 
 const uploadDark = {
@@ -46762,7 +46825,7 @@ const uploadDark = {
     Button: buttonDark,
     Progress: progressDark
   },
-  self: self$11
+  self: self$12
 };
 
 var rtlStyle$i = cB("upload", [cM("rtl", `
@@ -46777,7 +46840,7 @@ const uploadRtl = {
 
 const uploadInjectionKey = createInjectionKey("u-upload");
 
-var style$18 = c$1([cB("upload", "width: var(--u-upload-width)", [cM("dragger-inside", [cB("upload-trigger", `
+var style$19 = c$1([cB("upload", "width: var(--u-upload-width)", [cM("dragger-inside", [cB("upload-trigger", `
         display: block;
       `)]), cM("drag-over", [cB("upload-dragger", `
         border: var(--u-dragger-border-hover);
@@ -47238,10 +47301,10 @@ const buttonGroupRtl = {
 const cardDark = {
   name: "CardList",
   common: derived$1,
-  self: self$1b
+  self: self$1c
 };
 
-function self$10(vars) {
+function self$11(vars) {
   const {
     textPrimary,
     fontBodyMedium,
@@ -47269,12 +47332,12 @@ function self$10(vars) {
 const codeLight = {
   name: "Code",
   common: derived,
-  self: self$10
+  self: self$11
 };
 
-function self$$(vars) {
+function self$10(vars) {
   return {
-    ...self$10(vars),
+    ...self$11(vars),
     // extracted from hljs atom-one-dark.scss
     "mono-3": "#5c6370",
     "hue-1": "#56b6c2",
@@ -47290,10 +47353,10 @@ function self$$(vars) {
 const codeDark = {
   name: "Code",
   common: derived$1,
-  self: self$$
+  self: self$10
 };
 
-function self$_(vars) {
+function self$$(vars) {
   const {
     cubicBezierEaseInOut
   } = vars;
@@ -47304,13 +47367,13 @@ function self$_(vars) {
 const collapseTransitionLight = {
   name: "CollapseTransition",
   common: derived,
-  self: self$_
+  self: self$$
 };
 
 const collapseTransitionDark = {
   name: "CollapseTransition",
   common: derived$1,
-  self: self$_
+  self: self$$
 };
 
 var rtlStyle$g = cB("collapse-transition", [cM("rtl", `
@@ -47323,7 +47386,7 @@ const collapseTransitionRtl = {
   style: rtlStyle$g
 };
 
-function self$Z(vars) {
+function self$_(vars) {
   const {
     fontWeight,
     fontBodyLarge,
@@ -47363,13 +47426,13 @@ function self$Z(vars) {
 const collapseLight = {
   name: "Collapse",
   common: derived,
-  self: self$Z
+  self: self$_
 };
 
 const collapseDark = {
   name: "Collapse",
   common: derived$1,
-  self: self$Z
+  self: self$_
 };
 
 var rtlStyle$f = cB("collapse", [cM("rtl", `
@@ -47392,7 +47455,7 @@ const collapseRtl = {
   style: rtlStyle$f
 };
 
-function self$Y(vars) {
+function self$Z(vars) {
   const {
     borderRadius,
     fontBodySmall,
@@ -47479,7 +47542,7 @@ const dropdownLight = createTheme$1({
   peers: {
     Popover: popoverLight
   },
-  self: self$Y
+  self: self$Z
 });
 
 const dropdownDark = {
@@ -47488,7 +47551,7 @@ const dropdownDark = {
   peers: {
     Popover: popoverDark
   },
-  self: self$Y
+  self: self$Z
 };
 
 const popselect = {
@@ -47500,7 +47563,7 @@ const popselect = {
   }
 };
 
-function self$X(vars) {
+function self$Y(vars) {
   const {
     shadowDepth2
   } = vars;
@@ -47515,10 +47578,10 @@ const popselectLight = createTheme$1({
     Popover: popoverLight,
     InternalSelectMenu: internalSelectMenuLight
   },
-  self: self$X
+  self: self$Y
 });
 
-function self$W(vars) {
+function self$X(vars) {
   const {
     brandPrimary100,
     transparencySecondary,
@@ -47616,7 +47679,7 @@ const paginationLight = createTheme$1({
     Input: inputLight,
     Popselect: popselectLight
   },
-  self: self$W
+  self: self$X
 });
 
 const paginationDark = {
@@ -47627,7 +47690,7 @@ const paginationDark = {
     Input: inputDark,
     Popselect: popselect
   },
-  self: self$W
+  self: self$X
 };
 
 var rtlStyle$e = cB("pagination", [cM("rtl", `
@@ -47644,7 +47707,7 @@ const paginationRtl = {
   peers: [inputRtl]
 };
 
-function self$V(vars) {
+function self$W(vars) {
   const {
     heightTiny,
     heightSmall,
@@ -47736,13 +47799,13 @@ function self$V(vars) {
 const radioLight = {
   name: "Radio",
   common: derived,
-  self: self$V
+  self: self$W
 };
 
 const radioDark = {
   name: "Radio",
   common: derived$1,
-  self: self$V
+  self: self$W
 };
 
 var rtlStyle$d = c$1([cB("radio", [cM("rtl", `
@@ -47770,7 +47833,7 @@ const radioRtl = {
   style: rtlStyle$d
 };
 
-function self$U(vars) {
+function self$V(vars) {
   const {
     borderRadius,
     opacityDisabled,
@@ -47871,7 +47934,7 @@ const dataTableLight = createTheme$1({
     Ellipsis: ellipsisLight,
     Dropdown: dropdownLight
   },
-  self: self$U
+  self: self$V
 });
 
 const dataTableDark = {
@@ -47888,10 +47951,10 @@ const dataTableDark = {
     Ellipsis: ellipsisDark,
     Dropdown: dropdownDark
   },
-  self: self$U
+  self: self$V
 };
 
-function self$T(vars) {
+function self$U(vars) {
   const {
     opacityDisabled,
     borderRadius,
@@ -47933,7 +47996,7 @@ const timePickerLight = createTheme$1({
     Button: buttonLight,
     Input: inputLight
   },
-  self: self$T
+  self: self$U
 });
 
 const timePickerDark = {
@@ -47944,7 +48007,7 @@ const timePickerDark = {
     Button: buttonDark,
     Input: inputDark
   },
-  self: self$T
+  self: self$U
 };
 
 const itemWidth = "38px";
@@ -47990,7 +48053,7 @@ var commonVars$6 = {
   calendarRightPaddingYearrange: "0"
 };
 
-function self$S(vars) {
+function self$T(vars) {
   const {
     iconMedium,
     fontWeightStrong,
@@ -48091,7 +48154,7 @@ const datePickerLight = createTheme$1({
     Scrollbar: scrollbarLight,
     Select: internalSelectionLight
   },
-  self: self$S
+  self: self$T
 });
 
 const datePickerDark = {
@@ -48104,10 +48167,10 @@ const datePickerDark = {
     Scrollbar: scrollbarDark,
     Select: internalSelectionDark
   },
-  self: self$S
+  self: self$T
 };
 
-function self$R(vars) {
+function self$S(vars) {
   const {
     borderRadius,
     lineHeightBodyLarge,
@@ -48157,13 +48220,13 @@ function self$R(vars) {
 const descriptionsLight = {
   name: "Descriptions",
   common: derived,
-  self: self$R
+  self: self$S
 };
 
 const descriptionsDark = {
   name: "Descriptions",
   common: derived$1,
-  self: self$R
+  self: self$S
 };
 
 var commonVars$5 = {
@@ -48177,7 +48240,7 @@ var commonVars$5 = {
   closeBorderRadius: "100px"
 };
 
-function self$Q(vars) {
+function self$R(vars) {
   const {
     borderRadius,
     containerPrimary,
@@ -48234,7 +48297,7 @@ const dialogLight = createTheme$1({
   peers: {
     Button: buttonLight
   },
-  self: self$Q
+  self: self$R
 });
 
 const dialogDark = {
@@ -48243,10 +48306,10 @@ const dialogDark = {
   peers: {
     Button: buttonDark
   },
-  self: self$Q
+  self: self$R
 };
 
-function self$P(vars) {
+function self$Q(vars) {
   const {
     elementsQuaternary,
     textPrimary,
@@ -48266,13 +48329,13 @@ function self$P(vars) {
 const dividerLight = {
   name: "Divider",
   common: derived,
-  self: self$P
+  self: self$Q
 };
 
 const dividerDark = {
   name: "Divider",
   common: derived$1,
-  self: self$P
+  self: self$Q
 };
 
 var commonVars$4 = {
@@ -48288,7 +48351,7 @@ var commonVars$4 = {
   contentBorderRadius: "24px"
 };
 
-function self$O(vars) {
+function self$P(vars) {
   const {
     containerPrimary,
     textPrimary,
@@ -48337,7 +48400,7 @@ const drawerLight = createTheme$1({
   peers: {
     Scrollbar: scrollbarLight
   },
-  self: self$O
+  self: self$P
 });
 
 const drawerDark = {
@@ -48346,7 +48409,7 @@ const drawerDark = {
   peers: {
     Scrollbar: scrollbarDark
   },
-  self: self$O
+  self: self$P
 };
 
 var rtlStyle$c = cB("drawer", [cM("rtl", `
@@ -48380,7 +48443,7 @@ const dynamicInputDark = {
   }
 };
 
-function self$N() {
+function self$O() {
   return commonVariables$1;
 }
 const dynamicInputLight = createTheme$1({
@@ -48390,7 +48453,7 @@ const dynamicInputLight = createTheme$1({
     Input: inputLight,
     Button: buttonLight
   },
-  self: self$N
+  self: self$O
 });
 
 var rtlStyle$b = cB("input-number", [cM("rtl", `
@@ -48431,12 +48494,12 @@ const spaceDark = {
   }
 };
 
-function self$M() {
+function self$N() {
   return commonVars$3;
 }
 const spaceLight = {
   name: "Space",
-  self: self$M
+  self: self$N
 };
 
 var rtlStyle$9 = cB("space", [cM("rtl", `
@@ -48508,7 +48571,7 @@ const floatButtonGroupDark = {
   }
 };
 
-function self$L(vars) {
+function self$M(vars) {
   const {
     containerPrimary,
     elementsQuaternary,
@@ -48524,7 +48587,7 @@ function self$L(vars) {
 const themeLight$4 = {
   name: "FloatButtonGroup",
   common: derived,
-  self: self$L
+  self: self$M
 };
 
 const floatButtonDark = {
@@ -48559,7 +48622,7 @@ const floatButtonDark = {
   }
 };
 
-function self$K(vars) {
+function self$L(vars) {
   const {
     containerPrimary,
     textPrimary,
@@ -48588,10 +48651,10 @@ function self$K(vars) {
 const themeLight$3 = {
   name: "FloatButton",
   common: derived,
-  self: self$K
+  self: self$L
 };
 
-function self$J(vars) {
+function self$K(vars) {
   const {
     heightSmall,
     heightMedium,
@@ -48646,16 +48709,16 @@ function self$J(vars) {
 const formLight = {
   name: "Form",
   common: derived,
-  self: self$J
+  self: self$K
 };
 
 const formItemDark = {
   name: "Form",
   common: derived$1,
-  self: self$J
+  self: self$K
 };
 
-function self$I(vars) {
+function self$J(vars) {
   const {
     brandPrimary500,
     staticGreen,
@@ -48692,16 +48755,16 @@ function self$I(vars) {
 const gradientTextLight = {
   name: "GradientText",
   common: derived,
-  self: self$I
+  self: self$J
 };
 
 const gradientTextDark = {
   name: "GradientText",
   common: derived$1,
-  self: self$I
+  self: self$J
 };
 
-function self$H(vars) {
+function self$I(vars) {
   const {
     textSecondary
   } = vars;
@@ -48716,7 +48779,7 @@ const inputNumberLight = createTheme$1({
     Button: buttonLight,
     Input: inputLight
   },
-  self: self$H
+  self: self$I
 });
 
 const inputNumberDark = {
@@ -48726,10 +48789,10 @@ const inputNumberDark = {
     Button: buttonDark,
     Input: inputDark
   },
-  self: self$H
+  self: self$I
 };
 
-function self$G() {
+function self$H() {
   return {
     inputWidthSmall: "44px",
     inputWidthMedium: "50px",
@@ -48745,7 +48808,7 @@ const inputOtpLight = createTheme$1({
   peers: {
     Input: inputLight
   },
-  self: self$G
+  self: self$H
 });
 
 const inputOtpDark = {
@@ -48754,7 +48817,7 @@ const inputOtpDark = {
   peers: {
     Input: inputDark
   },
-  self: self$G
+  self: self$H
 };
 
 var rtlStyle$8 = cB("input-otp", [cM("rtl", `
@@ -48766,7 +48829,7 @@ const inputOtpRtl = {
   style: rtlStyle$8
 };
 
-function self$F(vars) {
+function self$G(vars) {
   const {
     textPrimary,
     textQuaternary,
@@ -48812,7 +48875,7 @@ const layoutLight = createTheme$1({
   peers: {
     Scrollbar: scrollbarLight
   },
-  self: self$F
+  self: self$G
 });
 
 const layoutDark = {
@@ -48821,7 +48884,7 @@ const layoutDark = {
   peers: {
     Scrollbar: scrollbarDark
   },
-  self: self$F
+  self: self$G
 };
 
 const rowDark = {
@@ -48858,7 +48921,7 @@ const rowRtl = {
   style: rtlStyle$7
 };
 
-function self$E(vars) {
+function self$F(vars) {
   const {
     brandPrimary500,
     staticRed
@@ -48872,16 +48935,16 @@ function self$E(vars) {
 const loadingBarLight = {
   name: "LoadingBar",
   common: derived,
-  self: self$E
+  self: self$F
 };
 
 const loadingBarDark = {
   name: "LoadingBar",
   common: derived$1,
-  self: self$E
+  self: self$F
 };
 
-function self$D(vars) {
+function self$E(vars) {
   const {
     fontBodyMedium,
     textPrimary,
@@ -48904,7 +48967,7 @@ const logLight = createTheme$1({
     Scrollbar: scrollbarLight,
     Code: codeLight
   },
-  self: self$D
+  self: self$E
 });
 
 const logDark = {
@@ -48914,25 +48977,25 @@ const logDark = {
     Scrollbar: scrollbarDark,
     Code: codeDark
   },
-  self: self$D
+  self: self$E
 };
 
-function self$C() {
+function self$D() {
   return {};
 }
 const marqueeLight = {
   name: "Marquee",
   common: derived,
-  self: self$C
+  self: self$D
 };
 
 const marqueeDark = {
   name: "Marquee",
   common: derived$1,
-  self: self$C
+  self: self$D
 };
 
-function self$B(vars) {
+function self$C(vars) {
   const {
     shadowDepth2
   } = vars;
@@ -48947,7 +49010,7 @@ const mentionLight = createTheme$1({
     InternalSelectMenu: internalSelectMenuLight,
     Input: inputLight
   },
-  self: self$B
+  self: self$C
 });
 
 const listDark = {
@@ -48957,7 +49020,7 @@ const listDark = {
     InternalSelectMenu: internalSelectMenuDark,
     Input: inputDark
   },
-  self: self$B
+  self: self$C
 };
 
 function createPartialInvertedVars(color, activeItemColor, activeTextColor, groupTextColor) {
@@ -49000,7 +49063,7 @@ function createPartialInvertedVars(color, activeItemColor, activeTextColor, grou
     groupTextColorInverted: groupTextColor
   };
 }
-function self$A(vars) {
+function self$B(vars) {
   const {
     textSecondary,
     borderRadiusSmall,
@@ -49068,7 +49131,7 @@ const menuLight = createTheme$1({
     Tooltip: tooltipLight,
     Dropdown: dropdownLight
   },
-  self: self$A
+  self: self$B
 });
 
 const menuDark = {
@@ -49078,10 +49141,10 @@ const menuDark = {
     Tooltip: tooltipDark,
     Dropdown: dropdownDark
   },
-  self: self$A
+  self: self$B
 };
 
-function self$z(vars) {
+function self$A(vars) {
   const {
     transparencyModal,
     containerPrimary,
@@ -49105,7 +49168,7 @@ const modalLight = createTheme$1({
     Dialog: dialogLight,
     Card: cardLight
   },
-  self: self$z
+  self: self$A
 });
 
 const modalDark = {
@@ -49116,7 +49179,7 @@ const modalDark = {
     Dialog: dialogDark,
     Card: cardDark$1
   },
-  self: self$z
+  self: self$A
 };
 
 var commonVars$2 = {
@@ -49125,7 +49188,7 @@ var commonVars$2 = {
   closeBorderRadius: "50px"
 };
 
-function self$y(vars) {
+function self$z(vars) {
   const {
     fontWeightStrong,
     lineHeightBodyMedium,
@@ -49258,7 +49321,7 @@ const notificationLight = createTheme$1({
   peers: {
     Scrollbar: scrollbarLight
   },
-  self: self$y
+  self: self$z
 });
 
 const notificationDark = {
@@ -49267,7 +49330,7 @@ const notificationDark = {
   peers: {
     Scrollbar: scrollbarDark
   },
-  self: self$y
+  self: self$z
 };
 
 var rtlStyle$6 = cB("notification", [cM("rtl", `
@@ -49297,7 +49360,7 @@ const notificationRtl = {
   style: rtlStyle$6
 };
 
-function self$x(vars) {
+function self$y(vars) {
   const {
     fontWeightStrong,
     fontTitleSmall,
@@ -49323,13 +49386,13 @@ function self$x(vars) {
 const pageHeaderLight = createTheme$1({
   name: "PageHeader",
   common: derived,
-  self: self$x
+  self: self$y
 });
 
 const pageHeaderDark = {
   name: "PageHeader",
   common: derived$1,
-  self: self$x
+  self: self$y
 };
 
 var rtlStyle$5 = cB("page-header-wrapper", [cM("rtl", [cB("page-header-header", `
@@ -49356,7 +49419,7 @@ var rtl = {
   style: rtlStyle$5
 };
 
-function self$w(vars) {
+function self$x(vars) {
   const {
     fontBodyMedium,
     staticOrange
@@ -49374,7 +49437,7 @@ const popconfirmLight = createTheme$1({
     Button: buttonLight,
     Popover: popoverLight
   },
-  self: self$w
+  self: self$x
 });
 
 const popconfirmDark = {
@@ -49384,10 +49447,10 @@ const popconfirmDark = {
     Button: buttonDark,
     Popover: popoverDark
   },
-  self: self$w
+  self: self$x
 };
 
-function self$v(vars) {
+function self$w(vars) {
   const {
     elementsQuinary,
     brandSecondary600
@@ -49403,16 +49466,16 @@ function self$v(vars) {
 const themeLight$2 = {
   name: "Rate",
   common: derived,
-  self: self$v
+  self: self$w
 };
 
 const rateDark = {
   name: "Rate",
   common: derived$1,
-  self: self$v
+  self: self$w
 };
 
-function self$u(vars) {
+function self$v(vars) {
   const {
     fontHeadingSmall,
     fontHeadingMedium,
@@ -49461,16 +49524,16 @@ function self$u(vars) {
 const resultLight = {
   name: "Result",
   common: derived,
-  self: self$u
+  self: self$v
 };
 
 const resultDark = {
   name: "Result",
   common: derived$1,
-  self: self$u
+  self: self$v
 };
 
-function self$t(vars) {
+function self$u(vars) {
   const {
     borderRadius,
     opacityDisabled,
@@ -49517,16 +49580,16 @@ function self$t(vars) {
 const sliderLight = {
   name: "Slider",
   common: derived,
-  self: self$t
+  self: self$u
 };
 
 const sliderDark = {
   name: "Slider",
   common: derived$1,
-  self: self$t
+  self: self$u
 };
 
-function self$s(vars) {
+function self$t(vars) {
   const {
     opacityDisabled,
     elementsPrimary,
@@ -49553,16 +49616,16 @@ function self$s(vars) {
 const spinLight = {
   name: "Spin",
   common: derived,
-  self: self$s
+  self: self$t
 };
 
 const spinDark = {
   name: "Spin",
   common: derived$1,
-  self: self$s
+  self: self$t
 };
 
-function self$r(vars) {
+function self$s(vars) {
   const {
     fontBodyMedium,
     fontHeadingSmall,
@@ -49584,13 +49647,13 @@ function self$r(vars) {
 const statisticLight = {
   name: "Statistic",
   common: derived,
-  self: self$r
+  self: self$s
 };
 
 const statisticDark = {
   name: "Statistic",
   common: derived$1,
-  self: self$r
+  self: self$s
 };
 
 var rtlStyle$4 = cB("statistic", [cM("rtl", `
@@ -49607,7 +49670,7 @@ const statisticRtl = {
   style: rtlStyle$4
 };
 
-function self$q(vars) {
+function self$r(vars) {
   const {
     fontBodyMedium,
     lineHeightBodyMedium,
@@ -49636,16 +49699,16 @@ function self$q(vars) {
 const statusLight = {
   name: "Status",
   common: derived,
-  self: self$q
+  self: self$r
 };
 
 const emptyDark = {
   name: "Status",
   common: derived$1,
-  self: self$q
+  self: self$r
 };
 
-function self$p(vars) {
+function self$q(vars) {
   const {
     fontWeightStrong,
     fontBodySmall,
@@ -49722,13 +49785,13 @@ function self$p(vars) {
 const stepsLight = {
   name: "Steps",
   common: derived,
-  self: self$p
+  self: self$q
 };
 
 const stepsDark = {
   name: "Steps",
   common: derived$1,
-  self: self$p
+  self: self$q
 };
 
 var rtlStyle$3 = c$1([cB("steps", [cM("rtl", `
@@ -49750,7 +49813,7 @@ const stepsRtl = {
   style: rtlStyle$3
 };
 
-function self$o(vars) {
+function self$p(vars) {
   const {
     opacityDisabled,
     borderRadius,
@@ -49814,16 +49877,16 @@ function self$o(vars) {
 const switchLight = {
   name: "Switch",
   common: derived,
-  self: self$o
+  self: self$p
 };
 
 const switchDark = {
   name: "Switch",
   common: derived$1,
-  self: self$o
+  self: self$p
 };
 
-function self$n(vars) {
+function self$o(vars) {
   const {
     fontBodySmall,
     fontBodyMedium,
@@ -49868,13 +49931,13 @@ function self$n(vars) {
 const tableLight = {
   name: "Table",
   common: derived,
-  self: self$n
+  self: self$o
 };
 
 const tableDark = {
   name: "Table",
   common: derived$1,
-  self: self$n
+  self: self$o
 };
 
 var rtlStyle$2 = c$1([cB("table", [cM("rtl", `
@@ -49895,7 +49958,7 @@ const tableRtl = {
   style: rtlStyle$2
 };
 
-function self$m(vars) {
+function self$n(vars) {
   const {
     borderRadius,
     closeSmall,
@@ -50016,16 +50079,16 @@ function self$m(vars) {
 const tabsLight = {
   name: "Tabs",
   common: derived,
-  self: self$m
+  self: self$n
 };
 
 const tabsDark = {
   name: "Tabs",
   common: derived$1,
-  self: self$m
+  self: self$n
 };
 
-function self$l(vars) {
+function self$m(vars) {
   const {
     fontBodyMedium,
     textPrimary,
@@ -50042,13 +50105,13 @@ function self$l(vars) {
 const thingLight = {
   name: "Thing",
   common: derived,
-  self: self$l
+  self: self$m
 };
 
 const thingDark = {
   name: "Thing",
   common: derived$1,
-  self: self$l
+  self: self$m
 };
 
 var rtlStyle$1 = cB("thing", [cM("rtl", `
@@ -50065,7 +50128,7 @@ const thingRtl = {
   peers: [buttonRtl, spaceRtl]
 };
 
-function self$k(vars) {
+function self$l(vars) {
   const {
     fontWeightStrong,
     fontBodyLarge,
@@ -50106,13 +50169,13 @@ function self$k(vars) {
 const timelineLight = {
   name: "Timeline",
   common: derived,
-  self: self$k
+  self: self$l
 };
 
 const timelineDark = {
   name: "Timeline",
   common: derived$1,
-  self: self$k
+  self: self$l
 };
 
 var commonVariables = {
@@ -50122,7 +50185,7 @@ var commonVariables = {
   iconMargin: "16px"
 };
 
-function self$j(vars) {
+function self$k(vars) {
   const {
     borderRadiusLarge,
     fontBodyLarge,
@@ -50187,16 +50250,16 @@ function self$j(vars) {
 const toggleButtonLight = {
   name: "ToggleButton",
   common: derived,
-  self: self$j
+  self: self$k
 };
 
 const toggleButtonDark = {
   name: "ToggleButton",
   common: derived$1,
-  self: self$j
+  self: self$k
 };
 
-function self$i(vars) {
+function self$j(vars) {
   const {
     iconMedium,
     fontWeight,
@@ -50266,7 +50329,7 @@ const transferLight$1 = createTheme$1({
     Empty: emptyLight,
     Button: buttonLight
   },
-  self: self$i
+  self: self$j
 });
 
 const transferDark$1 = {
@@ -50279,10 +50342,10 @@ const transferDark$1 = {
     Empty: emptyDark$1,
     Button: buttonDark
   },
-  self: self$i
+  self: self$j
 };
 
-function self$h(vars) {
+function self$i(vars) {
   const {
     fontBodyMedium,
     lineHeightBodyMedium,
@@ -50320,7 +50383,7 @@ const treeLight = createTheme$1({
     Scrollbar: scrollbarLight,
     Empty: emptyLight
   },
-  self: self$h
+  self: self$i
 });
 
 const treeDark = {
@@ -50331,7 +50394,7 @@ const treeDark = {
     Scrollbar: scrollbarDark,
     Empty: emptyDark$1
   },
-  self: self$h
+  self: self$i
 };
 
 var rtlStyle = cB("tree", [cM("rtl", `
@@ -50366,7 +50429,7 @@ const treeSelectDark = {
   }
 };
 
-function self$g(vars) {
+function self$h(vars) {
   const {
     containerPrimary,
     shadowDepth2,
@@ -50394,7 +50457,7 @@ const treeSelectLight = createTheme$1({
     Empty: emptyLight,
     InternalSelection: internalSelectionLight
   },
-  self: self$g
+  self: self$h
 });
 
 const watermarkDark = {
@@ -50423,7 +50486,7 @@ const watermarkLight = createTheme$1({
   }
 });
 
-function self$f(vars) {
+function self$g(vars) {
   const {
     elementsSecondary,
     elementsSenary,
@@ -50443,7 +50506,7 @@ const imageLight = createTheme$1({
   peers: {
     Tooltip: tooltipLight
   },
-  self: self$f
+  self: self$g
 });
 
 const imageDark = {
@@ -50452,7 +50515,7 @@ const imageDark = {
   peers: {
     Tooltip: tooltipDark
   },
-  self: self$f
+  self: self$g
 };
 
 const prevIcon = /* @__PURE__ */ h("svg", { viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ h(
@@ -50506,7 +50569,7 @@ const imagePreviewSharedProps = {
 };
 const imageContextKey = createInjectionKey("u-image");
 
-var style$17 = c$1([c$1("body >", [cB("image-container", "position: fixed;")]), cB("image-preview-container", `
+var style$18 = c$1([c$1("body >", [cB("image-container", "position: fixed;")]), cB("image-preview-container", `
     position: fixed;
     left: 0;
     right: 0;
@@ -50590,7 +50653,7 @@ var _UImagePreview = defineComponent({
     const themeRef = useTheme(
       "Image",
       "-image",
-      style$17,
+      style$18,
       imageLight,
       props,
       mergedClsPrefixRef
@@ -51521,7 +51584,7 @@ var _UImage = defineComponent({
   }
 });
 
-var style$16 = c$1([c$1("@keyframes spin-rotate", `
+var style$17 = c$1([c$1("@keyframes spin-rotate", `
     from {
       transform: rotate(0);
     }
@@ -51625,7 +51688,7 @@ var _USpin = defineComponent({
     const themeRef = useTheme(
       "Spin",
       "-spin",
-      style$16,
+      style$17,
       spinLight,
       props,
       mergedClsPrefixRef
@@ -52882,7 +52945,7 @@ var _UUpload = defineComponent({
     const themeRef = useTheme(
       "Upload",
       "-upload",
-      style$18,
+      style$19,
       uploadLight,
       props,
       mergedClsPrefixRef
@@ -53906,7 +53969,7 @@ var UDropdownMenu = defineComponent({
   }
 });
 
-var style$15 = cB("dropdown-menu", `
+var style$16 = cB("dropdown-menu", `
   transform-origin: var(--v-transform-origin);
   background-color: var(--u-color);
   border-radius: var(--u-border-radius);
@@ -54153,7 +54216,7 @@ var _UDropdown = defineComponent({
     const themeRef = useTheme(
       "Dropdown",
       "-dropdown",
-      style$15,
+      style$16,
       dropdownLight,
       props,
       mergedClsPrefixRef
@@ -54547,7 +54610,7 @@ var ChatAttachmentComponent = defineComponent({
   }
 });
 
-var style$14 = cB("chat", `
+var style$15 = cB("chat", `
   height: 100%;
   background-color: transparent;
   box-sizing: border-box;
@@ -54990,7 +55053,7 @@ var _UChatMessages = defineComponent({
   setup(props, { slots }) {
     const UChat = inject(chatInjectionKey, null);
     const { mergedClsPrefixRef } = useConfig(props);
-    const themeRef = UChat?.mergedThemeRef ?? useTheme("Chat", "-chat", style$14, chatLight, props, mergedClsPrefixRef);
+    const themeRef = UChat?.mergedThemeRef ?? useTheme("Chat", "-chat", style$15, chatLight, props, mergedClsPrefixRef);
     const { localeRef } = useLocale("Chat");
     const contextMenuShow = ref(false);
     const contextMenuMessage = ref();
@@ -56251,7 +56314,7 @@ const Scrollbar = defineComponent({
   }
 });
 
-var style$13 = c$1([cB("select", `
+var style$14 = c$1([cB("select", `
     z-index: auto;
     outline: none;
     width: 100%;
@@ -56423,7 +56486,7 @@ var _USelect = defineComponent({
     const themeRef = useTheme(
       "Select",
       "-select",
-      style$13,
+      style$14,
       selectLight,
       props,
       mergedClsPrefixRef
@@ -57257,7 +57320,7 @@ var _UChatListItems = defineComponent({
   setup(props, { slots }) {
     const UChat = inject(chatInjectionKey, null);
     const { mergedClsPrefixRef } = useConfig(props);
-    const themeRef = UChat?.mergedThemeRef ?? useTheme("Chat", "-chat", style$14, chatLight, props, mergedClsPrefixRef);
+    const themeRef = UChat?.mergedThemeRef ?? useTheme("Chat", "-chat", style$15, chatLight, props, mergedClsPrefixRef);
     const { localeRef } = useLocale("Chat");
     const cssVarsRef = computed(() => {
       const {
@@ -57929,7 +57992,7 @@ var _UChat = defineComponent({
     const themeRef = useTheme(
       "Chat",
       "-chat",
-      style$14,
+      style$15,
       chatLight,
       props,
       mergedClsPrefixRef
@@ -58258,7 +58321,7 @@ var _UChat = defineComponent({
   }
 });
 
-var style$12 = c$1([cB("code", `
+var style$13 = c$1([cB("code", `
     font-size: var(--u-font-size);
     font-family: var(--u-font-family);
   `, [cM("show-line-numbers", `
@@ -58429,7 +58492,7 @@ var _UCode = defineComponent({
     const themeRef = useTheme(
       "Code",
       "-code",
-      style$12,
+      style$13,
       codeLight,
       props,
       mergedClsPrefixRef
@@ -58567,7 +58630,7 @@ const collapseProps = {
   }
 };
 
-var style$11 = cB("collapse", `
+var style$12 = cB("collapse", `
     width: 100%;
     background-color: var(--u-background-color);
     border-radius: var(--u-border-radius);
@@ -58650,7 +58713,7 @@ var UCollapse$1 = defineComponent({
     const themeRef = useTheme(
       "Collapse",
       "-collapse",
-      style$11,
+      style$12,
       collapseLight,
       props,
       mergedClsPrefixRef
@@ -58992,7 +59055,7 @@ var UCollapseItem$1 = defineComponent({
   }
 });
 
-var style$10 = cB("collapse-transition", {
+var style$11 = cB("collapse-transition", {
   width: "100%"
 }, [fadeInHeightExpandTransition()]);
 
@@ -59031,7 +59094,7 @@ var _UCollapseTransition = defineComponent({
     const mergedThemeRef = useTheme(
       "CollapseTransition",
       "-collapse-transition",
-      style$10,
+      style$11,
       collapseTransitionLight,
       props,
       mergedClsPrefixRef
@@ -59092,7 +59155,7 @@ var _UCollapseTransition = defineComponent({
   }
 });
 
-function self$e(vars) {
+function self$f(vars) {
   const {
     borderRadius,
     borderRadiusSmall,
@@ -59139,7 +59202,7 @@ const colorPickerLight = createTheme$1({
     Input: inputLight,
     Button: buttonLight
   },
-  self: self$e
+  self: self$f
 });
 
 const colorPickerDark = {
@@ -59149,7 +59212,7 @@ const colorPickerDark = {
     Input: inputDark,
     Button: buttonDark
   },
-  self: self$e
+  self: self$f
 };
 
 function deriveDefaultValue(modes, showAlpha) {
@@ -60107,7 +60170,7 @@ var Pallete = defineComponent({
   }
 });
 
-var style$$ = c$1([cB("color-picker", `
+var style$10 = c$1([cB("color-picker", `
     display: inline-block;
     box-sizing: border-box;
     height: var(--u-height);
@@ -60379,7 +60442,7 @@ var UColorPicker$1 = defineComponent({
     const themeRef = useTheme(
       "ColorPicker",
       "-color-picker",
-      style$$,
+      style$10,
       colorPickerLight,
       props,
       mergedClsPrefixRef
@@ -64722,7 +64785,7 @@ var commonVars$1 = {
   wrapperMargin: "0 0 20px"
 };
 
-function self$d(vars) {
+function self$e(vars) {
   const {
     elementsSenary,
     borderRadiusLarge
@@ -64737,17 +64800,17 @@ const cropLight = createTheme$1({
   name: "Crop",
   common: derived,
   peers: {},
-  self: self$d
+  self: self$e
 });
 
 const cropDark = {
   name: "Crop",
   common: derived$1,
   peers: {},
-  self: self$d
+  self: self$e
 };
 
-var style$_ = c$1([c$1([c$1(".cropper-container", {
+var style$$ = c$1([c$1([c$1(".cropper-container", {
   direction: "ltr",
   fontSize: "0",
   lineHeight: "0",
@@ -65137,7 +65200,7 @@ var _UCrop = defineComponent({
     const themeRef = useTheme(
       "Crop",
       "-crop",
-      style$_,
+      style$$,
       cropLight,
       props,
       mergedClsPrefixRef
@@ -65261,9 +65324,77 @@ var _UCrop = defineComponent({
   }
 });
 
+const paginationProps = {
+  ...useTheme.props,
+  simple: Boolean,
+  variant: {
+    type: String,
+    default: "default"
+  },
+  hasPrev: {
+    type: Boolean,
+    default: void 0
+  },
+  hasNext: {
+    type: Boolean,
+    default: void 0
+  },
+  page: Number,
+  defaultPage: {
+    type: Number,
+    default: 1
+  },
+  itemCount: Number,
+  pageCount: Number,
+  defaultPageCount: {
+    type: Number,
+    default: 1
+  },
+  showSizePicker: Boolean,
+  sizePickerLabel: String,
+  pageSize: Number,
+  defaultPageSize: Number,
+  pageSizes: {
+    type: Array,
+    default() {
+      return [10];
+    }
+  },
+  showQuickJumper: Boolean,
+  size: {
+    type: String,
+    default: "medium"
+  },
+  disabled: Boolean,
+  pageSlot: {
+    type: Number,
+    default: 9
+  },
+  selectProps: Object,
+  prev: Function,
+  next: Function,
+  goto: Function,
+  prefix: Function,
+  suffix: Function,
+  label: Function,
+  displayOrder: {
+    type: Array,
+    default: ["size-picker", "pages", "quick-jumper"]
+  },
+  to: useAdjustedTo.propTo,
+  "onUpdate:page": [Function, Array],
+  onUpdatePage: [Function, Array],
+  "onUpdate:pageSize": [Function, Array],
+  onUpdatePageSize: [Function, Array],
+  /** @deprecated */
+  onPageSizeChange: [Function, Array],
+  /** @deprecated */
+  onChange: [Function, Array]
+};
+
 const popselectInjectionKey = createInjectionKey("u-popselect");
 
-var style$Z = cB("popselect-menu", `
+var style$_ = cB("popselect-menu", `
   box-shadow: var(--u-menu-box-shadow);
 `);
 
@@ -65317,7 +65448,7 @@ var UPopselectPanel = defineComponent({
     const themeRef = useTheme(
       "Popselect",
       "-pop-select",
-      style$Z,
+      style$_,
       popselectLight,
       UPopselect.props,
       mergedClsPrefixRef
@@ -65567,7 +65698,7 @@ const hoverStyleChildren$1 = [cM("button", `
     border: var(--u-button-border-hover);
     color: var(--u-button-icon-color-hover);
   `)];
-var style$Y = cB("pagination", `
+var style$Z = cB("pagination", `
   display: flex;
   width: 100%;
   justify-content: space-between;
@@ -65824,61 +65955,6 @@ function createRange(from, to) {
   return range;
 }
 
-const paginationProps = {
-  ...useTheme.props,
-  simple: Boolean,
-  page: Number,
-  defaultPage: {
-    type: Number,
-    default: 1
-  },
-  itemCount: Number,
-  pageCount: Number,
-  defaultPageCount: {
-    type: Number,
-    default: 1
-  },
-  showSizePicker: Boolean,
-  sizePickerLabel: String,
-  pageSize: Number,
-  defaultPageSize: Number,
-  pageSizes: {
-    type: Array,
-    default() {
-      return [10];
-    }
-  },
-  showQuickJumper: Boolean,
-  size: {
-    type: String,
-    default: "medium"
-  },
-  disabled: Boolean,
-  pageSlot: {
-    type: Number,
-    default: 9
-  },
-  selectProps: Object,
-  prev: Function,
-  next: Function,
-  goto: Function,
-  prefix: Function,
-  suffix: Function,
-  label: Function,
-  displayOrder: {
-    type: Array,
-    default: ["size-picker", "pages", "quick-jumper"]
-  },
-  to: useAdjustedTo.propTo,
-  "onUpdate:page": [Function, Array],
-  onUpdatePage: [Function, Array],
-  "onUpdate:pageSize": [Function, Array],
-  onUpdatePageSize: [Function, Array],
-  /** @deprecated */
-  onPageSizeChange: [Function, Array],
-  /** @deprecated */
-  onChange: [Function, Array]
-};
 var _UPagination = defineComponent({
   name: "Pagination",
   props: paginationProps,
@@ -65915,7 +65991,7 @@ var _UPagination = defineComponent({
     const themeRef = useTheme(
       "Pagination",
       "-pagination",
-      style$Y,
+      style$Z,
       paginationLight,
       props,
       mergedClsPrefixRef
@@ -65951,6 +66027,18 @@ var _UPagination = defineComponent({
         return Math.max(pageCount, 1);
       return 1;
     });
+    const mergedHasPrevRef = computed(() => {
+      const { hasPrev } = props;
+      if (hasPrev !== void 0)
+        return hasPrev;
+      return mergedPageRef.value > 1;
+    });
+    const mergedHasNextRef = computed(() => {
+      const { hasNext } = props;
+      if (hasNext !== void 0)
+        return hasNext;
+      return mergedPageRef.value < mergedPageCountRef.value;
+    });
     const jumperValueRef = ref("");
     watchEffect(() => {
       void props.simple;
@@ -66090,13 +66178,13 @@ var _UPagination = defineComponent({
       }
     }
     function forward() {
-      if (props.disabled)
+      if (props.disabled || !mergedHasNextRef.value)
         return;
-      const page = Math.min(mergedPageRef.value + 1, mergedPageCountRef.value);
+      const page = props.hasNext === void 0 ? Math.min(mergedPageRef.value + 1, mergedPageCountRef.value) : mergedPageRef.value + 1;
       doUpdatePage(page);
     }
     function backward() {
-      if (props.disabled)
+      if (props.disabled || !mergedHasPrevRef.value)
         return;
       const page = Math.max(mergedPageRef.value - 1, 1);
       doUpdatePage(page);
@@ -66270,6 +66358,8 @@ var _UPagination = defineComponent({
       locale: localeRef,
       selfRef,
       mergedPage: mergedPageRef,
+      mergedHasPrev: mergedHasPrevRef,
+      mergedHasNext: mergedHasNextRef,
       pageItems: computed(() => {
         return pageItemsInfo.value.items;
       }),
@@ -66311,6 +66401,9 @@ var _UPagination = defineComponent({
       cssVars,
       mergedPage,
       mergedPageCount,
+      mergedHasPrev,
+      mergedHasNext,
+      variant,
       pageItems,
       showSizePicker,
       sizePickerLabel,
@@ -66352,7 +66445,8 @@ var _UPagination = defineComponent({
           this.themeClass,
           this.rtlEnabled && `${mergedClsPrefix}-pagination--rtl`,
           disabled && `${mergedClsPrefix}-pagination--disabled`,
-          simple && `${mergedClsPrefix}-pagination--simple`
+          simple && `${mergedClsPrefix}-pagination--simple`,
+          variant === "cursor" && `${mergedClsPrefix}-pagination--cursor`
         ],
         style: cssVars
       },
@@ -66373,7 +66467,7 @@ var _UPagination = defineComponent({
                 class: [
                   `${mergedClsPrefix}-pagination-item`,
                   !renderPrev && `${mergedClsPrefix}-pagination-item--button`,
-                  (mergedPage <= 1 || mergedPage > mergedPageCount || disabled) && `${mergedClsPrefix}-pagination-item--disabled`
+                  (!mergedHasPrev || disabled) && `${mergedClsPrefix}-pagination-item--disabled`
                 ],
                 onClick: handleBackwardClick
               },
@@ -66387,7 +66481,7 @@ var _UPagination = defineComponent({
               }) : /* @__PURE__ */ h(UBaseIcon, { clsPrefix: mergedClsPrefix }, {
                 default: () => this.rtlEnabled ? /* @__PURE__ */ h(ForwardIcon, null) : /* @__PURE__ */ h(BackwardIcon, null)
               })
-            ), simple ? /* @__PURE__ */ h(Fragment, null, /* @__PURE__ */ h(
+            ), variant === "cursor" ? null : simple ? /* @__PURE__ */ h(Fragment, null, /* @__PURE__ */ h(
               "div",
               {
                 class: `${mergedClsPrefix}-pagination-quick-jumper`
@@ -66536,7 +66630,7 @@ var _UPagination = defineComponent({
                   `${mergedClsPrefix}-pagination-item`,
                   !renderNext && `${mergedClsPrefix}-pagination-item--button`,
                   {
-                    [`${mergedClsPrefix}-pagination-item--disabled`]: mergedPage < 1 || mergedPage >= mergedPageCount || disabled
+                    [`${mergedClsPrefix}-pagination-item--disabled`]: !mergedHasNext || disabled
                   }
                 ],
                 onClick: handleForwardClick
@@ -67191,7 +67285,7 @@ var RenderSafeCheckbox = defineComponent({
   }
 });
 
-var style$X = cB("radio", `
+var style$Y = cB("radio", `
   outline: none;
   position: relative;
   user-select: none;
@@ -67340,7 +67434,7 @@ var _URadio = defineComponent({
     const themeRef = useTheme(
       "Radio",
       "-radio",
-      style$X,
+      style$Y,
       radioLight,
       props,
       radio.mergedClsPrefix
@@ -67524,7 +67618,7 @@ var _URadioButton = defineComponent({
   }
 });
 
-var style$W = cB("radio-group", `
+var style$X = cB("radio-group", `
   display: inline-block;
   font-size: var(--u-font-size);
 `, [cE("splitor", `
@@ -67704,7 +67798,7 @@ var _URadioGroup = defineComponent({
     const themeRef = useTheme(
       "Radio",
       "-radio-group",
-      style$W,
+      style$X,
       radioLight,
       props,
       mergedClsPrefixRef
@@ -70298,7 +70392,7 @@ var MainTable = defineComponent({
 });
 
 const fixedColumnStyle = createFixedColumnStyle();
-var style$V = c$1([cB("data-table", `
+var style$W = c$1([cB("data-table", `
     width: 100%;
     font-size: var(--u-font-size);
     display: flex;
@@ -72141,7 +72235,7 @@ var _UDataTable = defineComponent({
     const themeRef = useTheme(
       "DataTable",
       "-data-table",
-      style$V,
+      style$W,
       dataTableLight,
       props,
       mergedClsPrefixRef
@@ -76569,7 +76663,7 @@ var Panel = defineComponent({
   }
 });
 
-var style$U = c$1([cB("time-picker", `
+var style$V = c$1([cB("time-picker", `
     z-index: auto;
     position: relative;
   `, [cB("time-picker-icon", `
@@ -76764,7 +76858,7 @@ var _UTimePicker = defineComponent({
     const themeRef = useTheme(
       "TimePicker",
       "-time-picker",
-      style$U,
+      style$V,
       timePickerLight,
       props,
       mergedClsPrefixRef
@@ -77932,7 +78026,7 @@ var DatetimeRangePanel = defineComponent({
   }
 });
 
-var style$T = c$1([cB("date-picker", `
+var style$U = c$1([cB("date-picker", `
     position: relative;
     z-index: auto;
   `, [cB("date-picker-icon", `
@@ -78641,7 +78735,7 @@ var _UDatePicker = defineComponent({
     const themeRef = useTheme(
       "DatePicker",
       "-date-picker",
-      style$T,
+      style$U,
       datePickerLight,
       props,
       mergedClsPrefixRef
@@ -78883,12 +78977,13 @@ var _UDatePicker = defineComponent({
       }
     }
     function handleClear() {
+      doUpdateValue(null, { doConfirm: false });
       doUpdateShow(false);
-      inputInstRef.value?.deactivate();
+      inputInstRef.value?.deactivate?.();
       doClear();
     }
     function handlePanelClear() {
-      inputInstRef.value?.deactivate();
+      inputInstRef.value?.deactivate?.();
       doClear();
     }
     function handlePanelTabOut() {
@@ -79625,7 +79720,7 @@ var _UDatePicker = defineComponent({
   }
 });
 
-function self$c(vars) {
+function self$d(vars) {
   const {
     brandPrimary100,
     brandPrimary500,
@@ -79687,7 +79782,7 @@ const datePickerV2Light = createTheme$1({
     Select: internalSelectionLight,
     Scrollbar: scrollbarLight
   },
-  self: self$c
+  self: self$d
 });
 
 const datePickerV2Dark = createTheme$1({
@@ -79699,7 +79794,7 @@ const datePickerV2Dark = createTheme$1({
     Select: internalSelectionDark,
     Scrollbar: scrollbarDark
   },
-  self: self$c
+  self: self$d
 });
 
 const datePickerV2InjectionKey = Symbol("datePickerV2");
@@ -80491,7 +80586,7 @@ var CalendarRangePanel = defineComponent({
   }
 });
 
-var style$S = c$1([cB("date-picker-v2", `
+var style$T = c$1([cB("date-picker-v2", `
     position: relative;
     z-index: auto;
   `, [cB("date-picker-v2-icon", `
@@ -80929,7 +81024,7 @@ var _UDatePickerV2 = defineComponent({
     const themeRef = useTheme(
       "DatePickerV2",
       "-date-picker-v2",
-      style$S,
+      style$T,
       datePickerV2Light,
       props,
       mergedClsPrefixRef
@@ -81573,7 +81668,7 @@ var _UDatePickerV2 = defineComponent({
   }
 });
 
-var style$R = c$1([cB("descriptions", {
+var style$S = c$1([cB("descriptions", {
   fontSize: "var(--u-font-size)"
 }, [cB("descriptions-separator", `
       display: inline-block;
@@ -81728,7 +81823,7 @@ var _UDescriptions = defineComponent({
     const themeRef = useTheme(
       "Descriptions",
       "-descriptions",
-      style$R,
+      style$S,
       descriptionsLight,
       props,
       mergedClsPrefixRef
@@ -82070,7 +82165,7 @@ const dialogProps = {
 };
 const dialogPropKeys = keysOf(dialogProps);
 
-var style$Q = c$1([cB("dialog", `
+var style$R = c$1([cB("dialog", `
     word-break: break-word;
     position: relative;
     background: var(--u-color);
@@ -82188,7 +82283,7 @@ const UDialog$1 = defineComponent({
     const themeRef = useTheme(
       "Dialog",
       "-dialog",
-      style$Q,
+      style$R,
       dialogLight,
       props,
       mergedClsPrefixRef
@@ -82842,7 +82937,7 @@ var UModalBodyWrapper = defineComponent({
   }
 });
 
-var style$P = c$1([cB("modal-container", `
+var style$Q = c$1([cB("modal-container", `
     position: fixed;
     left: 0;
     top: 0;
@@ -82991,7 +83086,7 @@ var _UModal = defineComponent({
     const themeRef = useTheme(
       "Modal",
       "-modal",
-      style$P,
+      style$Q,
       modalLight,
       props,
       mergedClsPrefixRef
@@ -83465,7 +83560,7 @@ const UDialogProvider = defineComponent({
   }
 });
 
-var style$O = cB("divider", `
+var style$P = cB("divider", `
   position: relative;
   display: flex;
   width: 100%;
@@ -83536,7 +83631,7 @@ var UDivider$1 = defineComponent({
     const themeRef = useTheme(
       "Divider",
       "-divider",
-      style$O,
+      style$P,
       dividerLight,
       props,
       mergedClsPrefixRef
@@ -84002,7 +84097,7 @@ function slideInFromTopTransition({
   })];
 }
 
-var style$N = c$1([cB("drawer", `
+var style$O = c$1([cB("drawer", `
     word-break: break-word;
     position: absolute;
     pointer-events: all;
@@ -84308,7 +84403,7 @@ var _UDrawer = defineComponent({
     const themeRef = useTheme(
       "Drawer",
       "-drawer",
-      style$N,
+      style$O,
       drawerLight,
       props,
       mergedClsPrefixRef
@@ -84903,7 +84998,7 @@ var UDynamicInputPairPreset = defineComponent({
   }
 });
 
-var style$M = cB("dynamic-input", {
+var style$N = cB("dynamic-input", {
   width: "100%"
 }, [cB("dynamic-input-item", `
     margin-bottom: 10px;
@@ -85019,7 +85114,7 @@ var _UDynamicInput = defineComponent({
     const themeRef = useTheme(
       "DynamicInput",
       "-dynamic-input",
-      style$M,
+      style$N,
       dynamicInputLight,
       props,
       mergedClsPrefixRef
@@ -85543,7 +85638,7 @@ var USpace$1 = defineComponent({
   }
 });
 
-var style$L = cB("dynamic-tags", [cB("input", {
+var style$M = cB("dynamic-tags", [cB("input", {
   minWidth: "var(--u-input-width)"
 })]);
 
@@ -85603,7 +85698,7 @@ var _UDynamicTags = defineComponent({
     const themeRef = useTheme(
       "DynamicTags",
       "-dynamic-tags",
-      style$L,
+      style$M,
       dynamicTagsLight,
       props,
       mergedClsPrefixRef
@@ -85895,7 +85990,7 @@ const Equation = defineComponent({
   }
 });
 
-var style$K = cB("float-button-group", [cB("float-button", `
+var style$L = cB("float-button-group", [cB("float-button", `
     position: relative;
   `), cM("square-shape", `
     background-color: var(--u-color);
@@ -85958,7 +86053,7 @@ var _UFloatButtonGroup = defineComponent({
     const themeRef = useTheme(
       "FloatButtonGroup",
       "-float-button-group",
-      style$K,
+      style$L,
       themeLight$4,
       props,
       mergedClsPrefixRef
@@ -86009,7 +86104,7 @@ var _UFloatButtonGroup = defineComponent({
   }
 });
 
-var style$J = cB("float-button", `
+var style$K = cB("float-button", `
   user-select: none;
   cursor: pointer;
   color: var(--u-text-color);
@@ -86139,7 +86234,7 @@ var _UFloatButton = defineComponent({
     const themeRef = useTheme(
       "FloatButton",
       "-float-button",
-      style$J,
+      style$K,
       themeLight$3,
       props,
       mergedClsPrefixRef
@@ -86310,10 +86405,7 @@ var _UFloatButton = defineComponent({
   }
 });
 
-const formInjectionKey = createInjectionKey("u-form");
-const formItemInstsInjectionKey = createInjectionKey("u-form-item-insts");
-
-var style$I = cB("form", [cM("inline", `
+var style$J = cB("form", [cM("inline", `
     width: 100%;
     display: inline-flex;
     align-items: flex-start;
@@ -86368,7 +86460,7 @@ var _UForm = defineComponent({
   props: formProps,
   setup(props) {
     const { mergedClsPrefixRef } = useConfig(props);
-    useTheme("Form", "-form", style$I, formLight, props, mergedClsPrefixRef);
+    useTheme("Form", "-form", style$J, formLight, props, mergedClsPrefixRef);
     const formItems = {};
     const maxChildLabelWidthRef = ref(void 0);
     const deriveMaxChildLabelWidth = (currentWidth) => {
@@ -87582,7 +87674,7 @@ function fadeDownTransition({
   })];
 }
 
-var style$H = cB("form-item", `
+var style$I = cB("form-item", `
   display: grid;
 `, [cB("form-item-label", `
     grid-area: label;
@@ -87967,7 +88059,7 @@ var _UFormItem = defineComponent({
     const themeRef = useTheme(
       "Form",
       "-form-item",
-      style$H,
+      style$I,
       formLight,
       props,
       mergedClsPrefixRef
@@ -88407,7 +88499,7 @@ const positionStyles = repeat(24, null).map((_, index) => {
     right: percent
   })];
 });
-var style$G = c$1([cB("row", {
+var style$H = c$1([cB("row", {
   width: "100%",
   display: "flex",
   flexWrap: "wrap"
@@ -88439,7 +88531,7 @@ var _URow = defineComponent({
   props: rowProps,
   setup(props) {
     const { mergedClsPrefixRef, mergedRtlRef } = useConfig(props);
-    useStyle("-legacy-grid", style$G, mergedClsPrefixRef);
+    useStyle("-legacy-grid", style$H, mergedClsPrefixRef);
     const rtlEnabledRef = useRtl("Row", mergedRtlRef, mergedClsPrefixRef);
     const verticalGutterRef = useMemo(() => {
       const { gutter } = props;
@@ -88785,7 +88877,7 @@ var _UGlobalStyle = defineComponent({
   }
 });
 
-var style$F = cB("gradient-text", `
+var style$G = cB("gradient-text", `
   display: inline-block;
   font-weight: var(--u-font-weight);
   -webkit-background-clip: text;
@@ -88843,7 +88935,7 @@ var _UGradientText = defineComponent({
     const themeRef = useTheme(
       "GradientText",
       "-gradient-text",
-      style$F,
+      style$G,
       gradientTextLight,
       props,
       mergedClsPrefixRef
@@ -88907,7 +88999,7 @@ var _UGradientText = defineComponent({
   }
 });
 
-function self$b(vars) {
+function self$c(vars) {
   const {
     containerPrimary,
     textPrimary,
@@ -88962,13 +89054,13 @@ function self$b(vars) {
 const headerLight = createTheme$1({
   name: "Header",
   common: derived,
-  self: self$b
+  self: self$c
 });
 
 const headerDark = createTheme$1({
   name: "Header",
   common: derived$1,
-  self: vars => self$b(vars)
+  self: vars => self$c(vars)
 });
 
 const SEARCH_DEBOUNCE_MS = 300;
@@ -90372,7 +90464,7 @@ var HeaderMobile = defineComponent({
   }
 });
 
-var style$E = cB("header", `
+var style$F = cB("header", `
   width: 100%;
   box-sizing: border-box;
   font-size: var(--u-font-size);
@@ -91066,7 +91158,7 @@ var _UHeader = defineComponent({
     const themeRef = useTheme(
       "Header",
       "-header",
-      style$E,
+      style$F,
       headerLight,
       props,
       mergedClsPrefixRef
@@ -91434,7 +91526,7 @@ var _UHeader = defineComponent({
   }
 });
 
-function self$a(vars) {
+function self$b(vars) {
   const {
     borderRadius,
     fontBodyLarge,
@@ -91474,7 +91566,7 @@ function self$a(vars) {
 const heatmapLight = createTheme$1({
   name: "Heatmap",
   common: derived,
-  self: self$a
+  self: self$b
 });
 
 function useLoadingStyleClass(props, themeRef) {
@@ -91623,7 +91715,7 @@ var Rect = defineComponent({
   }
 });
 
-var style$D = c$1([cB("heatmap", `
+var style$E = c$1([cB("heatmap", `
     display: flex;
     flex-direction: column;
     max-width: fit-content;
@@ -91897,7 +91989,7 @@ var _UHeatmap = defineComponent({
     const themeRef = useTheme(
       "Heatmap",
       "-heatmap",
-      style$D,
+      style$E,
       heatmapLight,
       props,
       mergedClsPrefixRef
@@ -92209,7 +92301,7 @@ const HeatmapDark = {
   name: "Heatmap",
   common: derived$1,
   self(vars) {
-    const lightSelf = self$a(vars);
+    const lightSelf = self$b(vars);
     return {
       ...lightSelf,
       activeColors: ["#0d4429", "#006d32", "#26a641", "#39d353"],
@@ -92324,7 +92416,7 @@ var _UHighlight = defineComponent({
   }
 });
 
-function self$9(vars) {
+function self$a(vars) {
   const {
     elementsPrimary,
     elementsTertiary,
@@ -92350,13 +92442,13 @@ function self$9(vars) {
 const iconBarLight = {
   name: "IconBar",
   common: derived,
-  self: self$9
+  self: self$a
 };
 
 const iconBarDark = {
   name: "IconBar",
   common: derived$1,
-  self: self$9
+  self: self$a
 };
 
 const iconBarInjectionKey = createInjectionKey("icon-bar");
@@ -92389,7 +92481,7 @@ const iconBarProps = {
   itemSize: [Number, String]
 };
 
-var style$C = c$1([cB("icon-bar", `
+var style$D = c$1([cB("icon-bar", `
     justify-content: space-between !important;
     grid-template-columns: repeat(var(--u-icon-bar-cols), var(--u-icon-bar-item-size)) !important;
   `), cB("icon-bar-item-wrapper", `
@@ -92452,7 +92544,7 @@ var _UIconBarItem = defineComponent({
     const themeRef = useTheme(
       "IconBar",
       "-icon-bar-item",
-      style$C,
+      style$D,
       iconBarLight,
       props,
       mergedClsPrefixRef
@@ -92530,7 +92622,7 @@ var _UIconBar = defineComponent({
     const themeRef = useTheme(
       "IconBar",
       "-icon-bar",
-      style$C,
+      style$D,
       iconBarLight,
       props,
       mergedClsPrefixRef
@@ -92583,6 +92675,607 @@ var _UIconBar = defineComponent({
   }
 });
 
+const iconPackInputLight = {
+  ...inputLight,
+  self(vars) {
+    const originalInputSelf = self$1o(vars);
+    const {
+      elementsDarkQuinary,
+      elementsPrimary
+    } = vars;
+    return {
+      ...originalInputSelf,
+      heightMedium: "44px",
+      borderRadius: "12px",
+      paddingMedium: "0 20px",
+      border: `2px solid ${elementsDarkQuinary}`,
+      borderHover: `2px solid ${elementsPrimary}`,
+      borderFocus: `2px solid ${elementsPrimary}`,
+      boxShadowFocus: "none"
+    };
+  }
+};
+function self$9(vars) {
+  const {
+    staticWhite,
+    textPrimary,
+    textSecondary,
+    elementsTertiary,
+    elementsQuaternary,
+    elementsQuinary,
+    brandPrimary500
+  } = vars;
+  return {
+    containerColor: staticWhite,
+    borderRadius: "24px",
+    titleTextColor: textPrimary,
+    descriptionTextColor: textSecondary,
+    groupTitleTextColor: textPrimary,
+    groupCounterTextColor: textSecondary,
+    cardColor: elementsTertiary,
+    cardColorHover: elementsQuaternary,
+    cardColorPressed: elementsQuinary,
+    cardColorSelected: brandPrimary500,
+    cardBorderRadius: "20px",
+    cardIconColor: textPrimary,
+    cardIconColorSelected: staticWhite,
+    cardLabelTextColor: textPrimary,
+    cardLabelTextColorSelected: staticWhite,
+    dividerColor: elementsQuaternary
+  };
+}
+const iconPackLight = createTheme$1({
+  name: "IconPack",
+  common: derived,
+  peers: {
+    Input: iconPackInputLight,
+    Scrollbar: scrollbarLight,
+    Empty: emptyLight
+  },
+  self: self$9
+});
+
+const iconPackDark = createTheme$1({
+  name: "IconPack",
+  common: derived$1,
+  peers: {
+    Input: inputDark,
+    Scrollbar: scrollbarDark,
+    Empty: emptyDark$1
+  },
+  self: vars => {
+    const lightVars = self$9(vars);
+    return {
+      ...lightVars
+    };
+  }
+});
+
+const iconPackProps = {
+  ...useTheme.props,
+  pack: [Object, String],
+  value: String,
+  defaultValue: {
+    type: String,
+    default: null
+  },
+  disabled: {
+    type: Boolean,
+    default: void 0
+  },
+  title: String,
+  description: String,
+  searchable: {
+    type: Boolean,
+    default: true
+  },
+  searchValue: String,
+  defaultSearchValue: {
+    type: String,
+    default: ""
+  },
+  searchPlaceholder: String,
+  searchDebounce: {
+    type: Number,
+    default: 200
+  },
+  grouped: {
+    type: Boolean,
+    default: true
+  },
+  columns: {
+    type: [Number, String],
+    default: "auto"
+  },
+  minColumnWidth: {
+    type: [Number, String],
+    default: 150
+  },
+  iconSize: {
+    type: [Number, String],
+    default: 40
+  },
+  height: [Number, String],
+  maxBodyHeight: {
+    type: [Number, String],
+    default: 496
+  },
+  contentPadding: {
+    type: [Number, String],
+    default: 24
+  },
+  async: {
+    type: Boolean,
+    default: void 0
+  },
+  copyable: {
+    type: Boolean,
+    default: true
+  },
+  formatCopy: Function,
+  formatGroupLabel: Function,
+  formatIconLabel: Function,
+  showGroupCounter: {
+    type: Boolean,
+    default: true
+  },
+  emptyText: String,
+  emptyProps: Object,
+  searchInputProps: Object,
+  scrollbarProps: Object
+};
+const iconPackInjectionKey = createInjectionKey("icon-pack");
+
+var style$C = cB("icon-pack", `
+  box-sizing: border-box;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 28px;
+  background-color: var(--u-icon-pack-container-color);
+  border-radius: var(--u-icon-pack-border-radius);
+  transition: background-color .3s var(--u-bezier);
+`, [cM("disabled", `
+    opacity: .5;
+  `, [cB("icon-pack-card", `
+      cursor: not-allowed;
+    `)]), cE("header", `
+    display: flex;
+    align-items: flex-start;
+    gap: 32px;
+    padding: var(--u-icon-pack-content-padding) var(--u-icon-pack-content-padding) 0;
+  `, [cE("header-main", `
+      flex: 1;
+      min-width: 0;
+      display: flex;
+      flex-direction: column;
+      gap: 16px;
+    `), cE("title", `
+      margin: 0;
+      font-size: 22px;
+      line-height: 32px;
+      font-weight: 700;
+      color: var(--u-icon-pack-title-text-color);
+      transition: color .3s var(--u-bezier);
+    `), cE("description", `
+      margin: 0;
+      font-size: 16px;
+      line-height: 24px;
+      font-weight: 500;
+      color: var(--u-icon-pack-description-text-color);
+      transition: color .3s var(--u-bezier);
+    `)]), cE("search", `
+    padding: 0 var(--u-icon-pack-content-padding);
+  `), cE("body", `
+    min-height: 0;
+  `, [c$1(".u-scrollbar-content", `
+      padding: 0 var(--u-icon-pack-content-padding) var(--u-icon-pack-content-padding);
+    `)]), cE("groups", `
+    display: flex;
+    flex-direction: column;
+    gap: 28px;
+  `), cE("group", `
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+  `), cE("group-header", `
+    display: flex;
+    align-items: flex-end;
+    gap: 8px;
+  `, [cE("group-title", `
+      margin: 0;
+      font-size: 18px;
+      line-height: 28px;
+      font-weight: 700;
+      color: var(--u-icon-pack-group-title-text-color);
+      transition: color .3s var(--u-bezier);
+    `), cE("group-counter", `
+      font-size: 14px;
+      line-height: 24px;
+      font-weight: 500;
+      color: var(--u-icon-pack-group-counter-text-color);
+      transition: color .3s var(--u-bezier);
+    `)]), cE("grid", `
+    display: grid;
+    grid-template-columns: var(--u-icon-pack-grid-template-columns);
+    gap: 20px;
+  `), cB("icon-pack-card", `
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 24px;
+    padding: 24px 12px;
+    border: none;
+    outline: none;
+    background-color: var(--u-icon-pack-card-color);
+    border-radius: var(--u-icon-pack-card-border-radius);
+    cursor: pointer;
+    user-select: none;
+    transition:
+      background-color .2s var(--u-bezier),
+      color .2s var(--u-bezier);
+  `, [c$1("&:hover", `
+      background-color: var(--u-icon-pack-card-color-hover);
+    `), c$1("&:active", `
+      background-color: var(--u-icon-pack-card-color-pressed);
+    `), cM("selected", `
+      background-color: var(--u-icon-pack-card-color-selected);
+      --u-icon-pack-card-icon-color: var(--u-icon-pack-card-icon-color-selected);
+      --u-icon-pack-card-label-text-color: var(--u-icon-pack-card-label-text-color-selected);
+    `, [c$1("&:hover", `
+        background-color: var(--u-icon-pack-card-color-selected);
+      `)]), cE("icon", `
+      flex-shrink: 0;
+      width: var(--u-icon-pack-icon-size);
+      height: var(--u-icon-pack-icon-size);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      color: var(--u-icon-pack-card-icon-color);
+    `, [c$1("svg", `
+        width: var(--u-icon-pack-icon-size);
+        height: var(--u-icon-pack-icon-size);
+      `)]), cE("label", `
+      max-width: 100%;
+      padding: 0 12px;
+      font-size: 12px;
+      line-height: 16px;
+      font-weight: 600;
+      text-align: center;
+      color: var(--u-icon-pack-card-label-text-color);
+      transition: color .2s var(--u-bezier);
+    `)]), cE("empty", `
+    padding: 40px 0;
+    display: flex;
+    justify-content: center;
+  `), cE("footer", `
+    display: flex;
+    align-items: center;
+    gap: 16px;
+    padding: 16px var(--u-icon-pack-content-padding) var(--u-icon-pack-content-padding);
+    border-top: 1px solid var(--u-icon-pack-divider-color);
+  `)]);
+
+var _UIconPack = defineComponent({
+  name: "IconPack",
+  props: iconPackProps,
+  emits: ["update:value", "update:searchValue", "select", "copy", "search"],
+  setup(props, { emit }) {
+    const { mergedClsPrefixRef, mergedIconPacksRef } = useConfig(props);
+    const themeRef = useTheme(
+      "IconPack",
+      "-icon-pack",
+      style$C,
+      iconPackLight,
+      props,
+      mergedClsPrefixRef
+    );
+    const formItem = useFormItem(props);
+    const { mergedDisabledRef } = formItem;
+    provide(iconPackInjectionKey, {
+      mergedClsPrefixRef
+    });
+    const uncontrolledValueRef = ref(props.defaultValue);
+    const mergedValueRef = computed(
+      () => props.value !== void 0 ? props.value : uncontrolledValueRef.value
+    );
+    const uncontrolledSearchRef = ref(props.defaultSearchValue);
+    const mergedSearchRef = computed(
+      () => props.searchValue !== void 0 ? props.searchValue : uncontrolledSearchRef.value
+    );
+    const mergedPackRef = computed(() => {
+      const { pack } = props;
+      if (pack && typeof pack === "object")
+        return pack;
+      const config = mergedIconPacksRef?.value;
+      if (!config)
+        return void 0;
+      const name = typeof pack === "string" ? pack : config.defaultPackName;
+      return config.packs.find((p) => p.name === name);
+    });
+    function renderIconVNode(name) {
+      const pack = mergedPackRef.value;
+      if (!pack)
+        return null;
+      if (props.async === true && typeof pack.renderAsyncIcon === "function")
+        return pack.renderAsyncIcon(name);
+      if (typeof pack.renderIcon === "function")
+        return pack.renderIcon(name);
+      if (typeof pack.renderAsyncIcon === "function")
+        return pack.renderAsyncIcon(name);
+      return null;
+    }
+    const allIconsRef = computed(() => {
+      const pack = mergedPackRef.value;
+      if (!pack)
+        return [];
+      const format = props.formatIconLabel;
+      return pack.iconNames.map((name) => {
+        const slashIndex = name.indexOf("/");
+        const group = slashIndex === -1 ? "" : name.slice(0, slashIndex);
+        const defaultLabel = slashIndex === -1 ? name : name.slice(slashIndex + 1);
+        return {
+          name,
+          group,
+          label: format ? format(name, group) : defaultLabel,
+          render: () => renderIconVNode(name)
+        };
+      });
+    });
+    const searchIndexRef = computed(
+      () => allIconsRef.value.map(
+        (icon) => `${icon.name}
+${icon.label}`.toLowerCase()
+      )
+    );
+    const debouncedQueryRef = ref(
+      mergedSearchRef.value.trim().toLowerCase()
+    );
+    const applyQuery = (value) => {
+      debouncedQueryRef.value = value.trim().toLowerCase();
+    };
+    const applyQueryDebounced = debounce(applyQuery, props.searchDebounce);
+    watch(mergedSearchRef, (value) => {
+      if (props.searchDebounce <= 0)
+        applyQuery(value);
+      else applyQueryDebounced(value);
+    });
+    const filteredIconsRef = computed(() => {
+      const query = debouncedQueryRef.value;
+      const icons = allIconsRef.value;
+      if (!query)
+        return icons;
+      const searchIndex = searchIndexRef.value;
+      const result = [];
+      for (let index = 0; index < icons.length; index++) {
+        if (searchIndex[index].includes(query))
+          result.push(icons[index]);
+      }
+      return result;
+    });
+    const groupsRef = computed(() => {
+      const icons = filteredIconsRef.value;
+      if (!props.grouped)
+        return [{ key: "", label: "", icons }];
+      const map = /* @__PURE__ */ new Map();
+      for (const icon of icons) {
+        const existing = map.get(icon.group);
+        if (existing)
+          existing.push(icon);
+        else map.set(icon.group, [icon]);
+      }
+      const format = props.formatGroupLabel;
+      return Array.from(map, ([key, groupIcons]) => ({
+        key,
+        label: format ? format(key) : key,
+        icons: groupIcons
+      }));
+    });
+    const isEmptyRef = computed(
+      () => filteredIconsRef.value.length === 0
+    );
+    function handleSearch(value) {
+      if (props.searchValue === void 0)
+        uncontrolledSearchRef.value = value;
+      emit("update:searchValue", value);
+      emit("search", value);
+    }
+    function handleSelect(icon) {
+      if (mergedDisabledRef.value)
+        return;
+      if (props.value === void 0)
+        uncontrolledValueRef.value = icon.name;
+      emit("update:value", icon.name);
+      emit("select", icon.name, icon);
+      formItem.triggerFormInput();
+      formItem.triggerFormChange();
+      if (props.copyable) {
+        const text = props.formatCopy ? props.formatCopy(icon.name, icon) : icon.name;
+        void copyToClipboard(text).catch(() => {
+        });
+        emit("copy", text, icon);
+      }
+    }
+    const cssVarsRef = computed(() => {
+      const {
+        common: { cubicBezierEaseInOut },
+        self: {
+          containerColor,
+          borderRadius,
+          titleTextColor,
+          descriptionTextColor,
+          groupTitleTextColor,
+          groupCounterTextColor,
+          cardColor,
+          cardColorHover,
+          cardColorPressed,
+          cardColorSelected,
+          cardBorderRadius,
+          cardIconColor,
+          cardIconColorSelected,
+          cardLabelTextColor,
+          cardLabelTextColorSelected,
+          dividerColor
+        }
+      } = themeRef.value;
+      const { columns } = props;
+      const gridTemplateColumns = columns === void 0 || columns === null || columns === "auto" ? `repeat(auto-fill, minmax(${formatLength(props.minColumnWidth)}, 1fr))` : `repeat(${columns}, minmax(0, 1fr))`;
+      return {
+        "--u-bezier": cubicBezierEaseInOut,
+        "--u-icon-pack-container-color": containerColor,
+        "--u-icon-pack-border-radius": borderRadius,
+        "--u-icon-pack-title-text-color": titleTextColor,
+        "--u-icon-pack-description-text-color": descriptionTextColor,
+        "--u-icon-pack-group-title-text-color": groupTitleTextColor,
+        "--u-icon-pack-group-counter-text-color": groupCounterTextColor,
+        "--u-icon-pack-card-color": cardColor,
+        "--u-icon-pack-card-color-hover": cardColorHover,
+        "--u-icon-pack-card-color-pressed": cardColorPressed,
+        "--u-icon-pack-card-color-selected": cardColorSelected,
+        "--u-icon-pack-card-border-radius": cardBorderRadius,
+        "--u-icon-pack-card-icon-color": cardIconColor,
+        "--u-icon-pack-card-icon-color-selected": cardIconColorSelected,
+        "--u-icon-pack-card-label-text-color": cardLabelTextColor,
+        "--u-icon-pack-card-label-text-color-selected": cardLabelTextColorSelected,
+        "--u-icon-pack-divider-color": dividerColor,
+        "--u-icon-pack-grid-template-columns": gridTemplateColumns,
+        "--u-icon-pack-icon-size": formatLength(props.iconSize),
+        "--u-icon-pack-content-padding": formatLength(props.contentPadding)
+      };
+    });
+    const themeClassHandle = useThemeClass(
+      "icon-pack",
+      computed(() => ""),
+      cssVarsRef,
+      props
+    );
+    return {
+      mergedClsPrefix: mergedClsPrefixRef,
+      mergedTheme: themeRef,
+      cssVars: cssVarsRef,
+      themeClass: themeClassHandle?.themeClass,
+      onRender: themeClassHandle?.onRender,
+      mergedValue: mergedValueRef,
+      mergedSearch: mergedSearchRef,
+      mergedDisabled: mergedDisabledRef,
+      groups: groupsRef,
+      isEmpty: isEmptyRef,
+      handleSearch,
+      handleSelect
+    };
+  },
+  render() {
+    const {
+      mergedClsPrefix: cls,
+      $slots,
+      title,
+      description,
+      searchable,
+      grouped,
+      showGroupCounter,
+      searchPlaceholder,
+      searchInputProps,
+      scrollbarProps,
+      emptyText,
+      emptyProps,
+      height,
+      maxBodyHeight,
+      mergedDisabled
+    } = this;
+    this.onRender?.();
+    const showHeader = !!(title || description) || !!$slots.header || !!$slots.title || !!$slots.description;
+    const hasFixedHeight = height !== void 0 && height !== null;
+    const bodyStyle = hasFixedHeight ? { flex: "1 1 auto", minHeight: 0 } : { maxHeight: formatLength(maxBodyHeight) };
+    const renderCard = (icon) => {
+      const selected = this.mergedValue === icon.name;
+      return /* @__PURE__ */ h(
+        "div",
+        {
+          key: icon.name,
+          class: [
+            `${cls}-icon-pack-card`,
+            selected && `${cls}-icon-pack-card--selected`
+          ],
+          role: "button",
+          tabindex: mergedDisabled ? -1 : 0,
+          "aria-pressed": selected,
+          "aria-disabled": mergedDisabled,
+          onClick: () => this.handleSelect(icon),
+          onKeydown: (e) => {
+            if (e.key === "Enter" || e.key === " ") {
+              e.preventDefault();
+              this.handleSelect(icon);
+            }
+          }
+        },
+        /* @__PURE__ */ h("div", { class: `${cls}-icon-pack-card__icon` }, icon.render()),
+        /* @__PURE__ */ h(
+          UPerformantEllipsis$1,
+          {
+            class: `${cls}-icon-pack-card__label`,
+            lineClamp: 1
+          },
+          { default: () => icon.label }
+        )
+      );
+    };
+    return /* @__PURE__ */ h(
+      "div",
+      {
+        class: [
+          `${cls}-icon-pack`,
+          this.themeClass,
+          mergedDisabled && `${cls}-icon-pack--disabled`
+        ],
+        style: {
+          ...this.cssVars,
+          ...hasFixedHeight ? { height: formatLength(height) } : {}
+        }
+      },
+      showHeader && /* @__PURE__ */ h("div", { class: `${cls}-icon-pack__header` }, /* @__PURE__ */ h("div", { class: `${cls}-icon-pack__header-main` }, resolveSlot($slots.header, () => [
+        (title || $slots.title) && /* @__PURE__ */ h("div", { class: `${cls}-icon-pack__title` }, $slots.title ? $slots.title() : title),
+        (description || $slots.description) && /* @__PURE__ */ h("div", { class: `${cls}-icon-pack__description` }, $slots.description ? $slots.description() : description)
+      ]))),
+      searchable && /* @__PURE__ */ h("div", { class: `${cls}-icon-pack__search` }, /* @__PURE__ */ h(
+        UInput$1,
+        {
+          value: this.mergedSearch,
+          clearable: true,
+          disabled: mergedDisabled,
+          placeholder: searchPlaceholder,
+          onUpdateValue: this.handleSearch,
+          ...searchInputProps
+        },
+        { prefix: () => h(SearchOutlineIcon) }
+      )),
+      /* @__PURE__ */ h(
+        Scrollbar,
+        {
+          class: `${cls}-icon-pack__body`,
+          style: bodyStyle,
+          ...scrollbarProps
+        },
+        {
+          default: () => this.isEmpty ? /* @__PURE__ */ h("div", { class: `${cls}-icon-pack__empty` }, resolveSlot($slots.empty, () => [
+            /* @__PURE__ */ h(
+              UEmpty$1,
+              {
+                ...emptyProps,
+                size: "large",
+                description: emptyText,
+                theme: this.mergedTheme.peers.Empty,
+                themeOverrides: this.mergedTheme.peerOverrides.Empty
+              }
+            )
+          ])) : /* @__PURE__ */ h("div", { class: `${cls}-icon-pack__groups` }, this.groups.map((group) => /* @__PURE__ */ h("div", { key: group.key, class: `${cls}-icon-pack__group` }, grouped && group.key !== "" && /* @__PURE__ */ h("div", { class: `${cls}-icon-pack__group-header` }, /* @__PURE__ */ h("div", { class: `${cls}-icon-pack__group-title` }, group.label), showGroupCounter && /* @__PURE__ */ h("span", { class: `${cls}-icon-pack__group-counter` }, "(", group.icons.length, ")")), /* @__PURE__ */ h("div", { class: `${cls}-icon-pack__grid` }, group.icons.map(renderCard)))))
+        }
+      ),
+      $slots.footer && /* @__PURE__ */ h("div", { class: `${cls}-icon-pack__footer` }, $slots.footer())
+    );
+  }
+});
+
 function self$8(vars) {
   const {
     brandPrimary500,
@@ -115163,6 +115856,7 @@ const UHighlight = wrap(_UHighlight);
 const UIcon = wrap(UIcon$1);
 const UIconBar = wrap(_UIconBar);
 const UIconBarItem = wrap(_UIconBarItem);
+const UIconPack = wrap(_UIconPack);
 const UIconWrapper = wrap(UIconWrapper$1);
 const UImage = wrap(_UImage);
 const UImageGroup = wrap(_UImageGroup);
@@ -115358,6 +116052,7 @@ var components = /*#__PURE__*/Object.freeze({
   UIcon: UIcon,
   UIconBar: UIconBar,
   UIconBarItem: UIconBarItem,
+  UIconPack: UIconPack,
   UIconWrapper: UIconWrapper,
   UImage: UImage,
   UImageGroup: UImageGroup,
@@ -115538,6 +116233,9 @@ var components = /*#__PURE__*/Object.freeze({
   highlightProps: highlightProps,
   iconBarItemProps: iconBarItemProps,
   iconBarProps: iconBarProps,
+  iconPackDark: iconPackDark,
+  iconPackLight: iconPackLight,
+  iconPackProps: iconPackProps,
   iconProps: iconProps,
   iconWrapperProps: iconWrapperProps,
   imageGroupProps: imageGroupProps,
@@ -115589,6 +116287,7 @@ var components = /*#__PURE__*/Object.freeze({
   radioGroupProps: radioGroupProps,
   radioProps: radioProps,
   rateProps: rateProps,
+  renderAsyncIcon: renderAsyncIcon,
   renderBadge: renderBadge,
   renderConfig: renderConfig,
   renderIcon: renderIcon,
@@ -115662,7 +116361,7 @@ function useThemeVars() {
   });
 }
 
-var version = "2.1.3";
+var version = "2.2.0";
 
 function create({
   componentPrefix = "U",
@@ -115818,6 +116517,7 @@ const lightTheme = {
   Crop: cropLight,
   Header: headerLight,
   IconBar: iconBarLight,
+  IconPack: iconPackLight,
   QrCode: themeLight$1
 };
 
@@ -116441,6 +117141,7 @@ const darkTheme = {
   Crop: cropDark,
   Header: headerDark,
   IconBar: iconBarDark,
+  IconPack: iconPackDark,
   QrCode: qrcodeDark
 };
 
@@ -116463,4 +117164,4 @@ function createTheme(name, componentThemes) {
   return theme;
 }
 
-export { ChatAttachmentStatus, ChatMarkType, ChatMessageType, MessageStatus, a as NA, p as NP, UActionCard, UAffix, UAlert, UAnchor, UAnchorLink, UAutoComplete, UAvatar, UAvatarGroup, UBackTop, UBadge, UBlockquote, UBreadcrumb, UBreadcrumbItem, UButton, UButtonGroup, UCalendar, UCard, UCardList, UCarousel, UCarouselItem, UCascader, UChat, UChatListItems, UChatMessages, UCheckbox, UCheckboxGroup, UCode, UCol, UCollapse, UCollapseItem, UCollapseTransition, UColorPicker, UConfigProvider, UCountdown, UCrop, UDataTable, UDatePicker, UDatePickerV2, UDescriptions, UDescriptionsItem, UDialog, UDialogProvider, UDivider, UDrawer, UDrawerContent, UDropdown, UDynamicInput, UDynamicTags, UEl, UElement, UEllipsis, UEmpty, UEquation, UFlex, UFloatButton, UFloatButtonGroup, UForm, UFormItem, UFormItemCol, UFormItemGi, UFormItemGridItem, UFormItemRow, UGi, UGlobalStyle, UGradientText, UGrid, UGridItem, UH1, UH2, UH3, UH4, UH5, UH6, UHeader, UHeaderActions, UHeaderDesktopLayout, HeaderMobile as UHeaderMobile, UHeaderMobileLayout, UHeaderNavigation, UHeaderSearchDesktop, UHeaderSearchMobile, UHeaderSearchResults, UHeatmap, UHighlight, UHr, UIcon, UIconBar, UIconBarItem, UIconWrapper, UImage, UImageGroup, UImagePreview, UInfiniteScroll, UInput, UInputGroup, UInputGroupLabel, UInputNumber, UInputOtp, UKanban, UKanbanCard, UKanbanColumn, ULayout, ULayoutContent, ULayoutFooter, ULayoutHeader, ULayoutSider, ULegacyTransfer, ULi, UList, UListItem, ULoadingBarProvider, ULog, UMappingCard, UMappingCardList, UMarquee, UMention, UMenu, UMessageProvider, UModal, UModalFullscreen, UModalProvider, UNotificationProvider, UNumberAnimation, UOl, UPageHeader, UPagination, UPerformantEllipsis, UPopconfirm, UPopover, UPopselect, UProgress, UQrCode, URadio, URadioButton, URadioGroup, URate, UResult, URow, USafeTopScrollbar, UScrollbar, USelect, USkeleton, USlider, USpace, USpin, USplit, UStatistic, UStatus, UStep, USteps, USwitch, UTab, UTabPane, UTable, UTabs, UTag, UTagGroup, UTbody, UTd, UText, UTh, UThead, ThemeEditor as UThemeEditor, UThing, UTime, UTimePicker, UTimeline, UTimelineItem, UToggleButton, UTooltip, UTr, UTransfer, UTree, UTreeSelect, UUl, UUpload, UUploadDragger, UUploadFileList, UUploadTrigger, UVirtualList, UWatermark, UxButton, UzumUiResolver, aProps, actionCardDark, actionCardLight, affixProps, alertDark, alertProps, anchorDark, anchorLinkProps, anchorProps, autoCompleteDark, autoCompleteProps, avatarDark, avatarGroupProps, avatarProps, backTopDark, backTopProps, badgeDark, badgeProps, blockquoteProps, breadcrumbDark, breadcrumbItemProps, breadcrumbProps, buttonDark, buttonGroupDark, buttonGroupProps, buttonProps, c$1 as c, cB, cE, cM, cNotM, calendarProps, cardDark$1 as cardDark, cardDark as cardListDark, cardListProps, cardProps, carouselProps, cascaderDark, cascaderProps, checkboxDark, checkboxGroupProps, checkboxProps, codeDark, codeProps, colProps, collapseDark, collapseItemProps, collapseProps, collapseTransitionProps, colorPickerProps, derived$1 as commonDark, derived as commonLight, configProviderProps, countdownProps, create, createDiscreteApi, createLocale, createTheme, cropProps, darkTheme, dataTableDark, dataTableProps, dateEnUs as dateEnUS, datePickerDark, datePickerProps, datePickerV2Dark, datePickerV2Light, dateRuRU, dateUzUZ, dateZhCN, uzumUi as default, descriptionsDark, descriptionsItemProps, descriptionsProps, dialogDark, dialogProps, dialogProviderProps, dividerDark, dividerProps, drawerContentProps, drawerDark, drawerProps, dropdownDark, dropdownProps, dynamicInputDark, dynamicInputProps, dynamicTagsDark, dynamicTagsProps, elementDark, elementProps, ellipsisProps, emptyDark$1 as emptyDark, emptyProps, enUS$1 as enUS, equationProps, flexProps, floatButtonDark, floatButtonGroupDark, floatButtonGroupProps, floatButtonProps, formItemDark as formDark, formItemGiProps, formItemGiProps as formItemGridItemProps, formItemProps, formProps, getMenuItemKey, gridItemProps as giProps, gradientTextDark, gradientTextProps, gridItemProps, gridProps, headerProps$2 as h1Props, headerProps$2 as h2Props, headerProps$2 as h3Props, headerProps$2 as h4Props, headerProps$2 as h5Props, headerProps$2 as h6Props, hasChildren, headerActionsProps, headerDesktopLayoutProps, headerMobileLayoutProps, headerMobileProps, headerNavigationProps, headerProps$1 as headerProps, headerSearchDesktopProps, headerSearchMobileProps, headerSearchResultsProps, HeatmapDark as heatmapDark, heatmapLight, heatmapMockData, heatmapProps, highlightProps, iconBarItemProps, iconBarProps, iconDark$1 as iconDark, iconProps, iconWrapperProps, imageGroupProps, imagePreviewProps, imageProps, infiniteScrollProps, inputDark, inputGroupLabelProps, inputGroupProps, inputNumberDark, inputNumberProps, inputOtpDark, inputOtpProps, inputProps, install, internalSelectMenuDark, internalSelectionDark, isColumnOption, isDividerOption, isGroupOption, isLeafMenuOption, isNotNull, kanbanDark, kanbanLight, kanbanProps, layoutProps as layoutContentProps, layoutDark, layoutFooterProps, headerProps as layoutHeaderProps, layoutProps, layoutSiderProps, transferProps$1 as legacyTransferProps, lightTheme, listDark$1 as listDark, listProps, loadingBarDark, loadingBarProviderProps, logDark, logProps, mappingCardDark, mappingCardLight, marqueeDark, listDark as mentionDark, mentionProps, menuDark, menuProps, messageDark, messageProviderProps, modalDark, modalFullscreenProps, modalProps, modalProviderProps, notificationDark, notificationProviderProps, numberAnimationProps, olProps, pProps, pageHeaderProps, paginationDark, paginationProps, popconfirmDark, popconfirmProps, popoverDark, popoverProps, popselect as popselectDark, popselectProps, progressDark, progressProps, qrCodeProps, radioButtonProps, radioDark, radioGroupProps, radioProps, rateDark, rateProps, renderBadge, renderConfig, renderIcon, renderOptionLabel, resolvePlacement, resolveTopLevelMenuKey, resultDark, resultProps, rowProps, ruRu as ruRU, safeTopScrollbarProps, scrollbarDark, scrollbarProps, selectDark, selectProps, skeletonProps, sliderDark, sliderProps, spaceDark, spaceProps, spinDark, spinProps, splitProps, statisticDark, statisticProps, emptyDark as statusDark, statusProps, stepProps, stepsDark, stepsProps, switchDark, switchProps, tabPaneProps, tabProps, tableDark, tableProps, tabsDark, tabsProps, tagDark, tagProps, textProps, thingDark, thingProps, timePickerDark, timePickerProps, timeProps, timelineDark, timelineItemProps, timelineProps, toggleButtonDark, toggleButtonProps, tooltipDark, tooltipProps, transferDark$1 as transferDark, transferProps, treeDark, treeGetClickTarget, treeProps, treeSelectDark, treeSelectProps, typographyDark, ulProps, alertRtl as unstableAlertRtl, avatarGroupRtl as unstableAvatarGroupRtl, badgeRtl as unstableBadgeRtl, buttonGroupRtl as unstableButtonGroupRtl, buttonRtl as unstableButtonRtl, cardRtl as unstableCardRtl, checkboxRtl as unstableCheckboxRtl, collapseRtl as unstableCollapseRtl, collapseTransitionRtl as unstableCollapseTransitionRtl, drawerRtl as unstableDrawerRtl, dynamicInputRtl as unstableDynamicInputRtl, inputNumberRtl as unstableInputNumberRtl, inputOtpRtl as unstableInputOtpRtl, inputRtl as unstableInputRtl, listRtl as unstableListRtl, messageRtl as unstableMessageRtl, notificationRtl as unstableNotificationRtl, rtl as unstablePageHeaderRtl, paginationRtl as unstablePaginationRtl, radioRtl as unstableRadioRtl, rowRtl as unstableRowRtl, scrollbarRtl as unstableScrollbarRtl, spaceRtl as unstableSpaceRtl, statisticRtl as unstableStatisticRtl, stepsRtl as unstableStepsRtl, tableRtl as unstableTableRtl, tagRtl as unstableTagRtl, thingRtl as unstableThingRtl, treeRtl as unstableTreeRtl, uploadRtl as unstableUploadRtl, uploadDark, publicDownload as uploadDownload, uploadProps, useDialog, useDialogReactiveList, useLoadingBar, useMessage, useModal, useModalReactiveList, useNotification, useOsTheme, useThemeVars, uzUZ, version, virtualListProps, watermarkDark, watermarkProps, zhCN$1 as zhCN, zindexable };
+export { ChatAttachmentStatus, ChatMarkType, ChatMessageType, MessageStatus, a as NA, p as NP, UActionCard, UAffix, UAlert, UAnchor, UAnchorLink, UAutoComplete, UAvatar, UAvatarGroup, UBackTop, UBadge, UBlockquote, UBreadcrumb, UBreadcrumbItem, UButton, UButtonGroup, UCalendar, UCard, UCardList, UCarousel, UCarouselItem, UCascader, UChat, UChatListItems, UChatMessages, UCheckbox, UCheckboxGroup, UCode, UCol, UCollapse, UCollapseItem, UCollapseTransition, UColorPicker, UConfigProvider, UCountdown, UCrop, UDataTable, UDatePicker, UDatePickerV2, UDescriptions, UDescriptionsItem, UDialog, UDialogProvider, UDivider, UDrawer, UDrawerContent, UDropdown, UDynamicInput, UDynamicTags, UEl, UElement, UEllipsis, UEmpty, UEquation, UFlex, UFloatButton, UFloatButtonGroup, UForm, UFormItem, UFormItemCol, UFormItemGi, UFormItemGridItem, UFormItemRow, UGi, UGlobalStyle, UGradientText, UGrid, UGridItem, UH1, UH2, UH3, UH4, UH5, UH6, UHeader, UHeaderActions, UHeaderDesktopLayout, HeaderMobile as UHeaderMobile, UHeaderMobileLayout, UHeaderNavigation, UHeaderSearchDesktop, UHeaderSearchMobile, UHeaderSearchResults, UHeatmap, UHighlight, UHr, UIcon, UIconBar, UIconBarItem, UIconPack, UIconWrapper, UImage, UImageGroup, UImagePreview, UInfiniteScroll, UInput, UInputGroup, UInputGroupLabel, UInputNumber, UInputOtp, UKanban, UKanbanCard, UKanbanColumn, ULayout, ULayoutContent, ULayoutFooter, ULayoutHeader, ULayoutSider, ULegacyTransfer, ULi, UList, UListItem, ULoadingBarProvider, ULog, UMappingCard, UMappingCardList, UMarquee, UMention, UMenu, UMessageProvider, UModal, UModalFullscreen, UModalProvider, UNotificationProvider, UNumberAnimation, UOl, UPageHeader, UPagination, UPerformantEllipsis, UPopconfirm, UPopover, UPopselect, UProgress, UQrCode, URadio, URadioButton, URadioGroup, URate, UResult, URow, USafeTopScrollbar, UScrollbar, USelect, USkeleton, USlider, USpace, USpin, USplit, UStatistic, UStatus, UStep, USteps, USwitch, UTab, UTabPane, UTable, UTabs, UTag, UTagGroup, UTbody, UTd, UText, UTh, UThead, ThemeEditor as UThemeEditor, UThing, UTime, UTimePicker, UTimeline, UTimelineItem, UToggleButton, UTooltip, UTr, UTransfer, UTree, UTreeSelect, UUl, UUpload, UUploadDragger, UUploadFileList, UUploadTrigger, UVirtualList, UWatermark, UxButton, UzumUiResolver, aProps, actionCardDark, actionCardLight, affixProps, alertDark, alertProps, anchorDark, anchorLinkProps, anchorProps, autoCompleteDark, autoCompleteProps, avatarDark, avatarGroupProps, avatarProps, backTopDark, backTopProps, badgeDark, badgeProps, blockquoteProps, breadcrumbDark, breadcrumbItemProps, breadcrumbProps, buttonDark, buttonGroupDark, buttonGroupProps, buttonProps, c$1 as c, cB, cE, cM, cNotM, calendarProps, cardDark$1 as cardDark, cardDark as cardListDark, cardListProps, cardProps, carouselProps, cascaderDark, cascaderProps, checkboxDark, checkboxGroupProps, checkboxProps, codeDark, codeProps, colProps, collapseDark, collapseItemProps, collapseProps, collapseTransitionProps, colorPickerProps, derived$1 as commonDark, derived as commonLight, configProviderProps, countdownProps, create, createDiscreteApi, createLocale, createTheme, cropProps, darkTheme, dataTableDark, dataTableProps, dateEnUs as dateEnUS, datePickerDark, datePickerProps, datePickerV2Dark, datePickerV2Light, dateRuRU, dateUzUZ, dateZhCN, uzumUi as default, descriptionsDark, descriptionsItemProps, descriptionsProps, dialogDark, dialogProps, dialogProviderProps, dividerDark, dividerProps, drawerContentProps, drawerDark, drawerProps, dropdownDark, dropdownProps, dynamicInputDark, dynamicInputProps, dynamicTagsDark, dynamicTagsProps, elementDark, elementProps, ellipsisProps, emptyDark$1 as emptyDark, emptyProps, enUS$1 as enUS, equationProps, flexProps, floatButtonDark, floatButtonGroupDark, floatButtonGroupProps, floatButtonProps, formItemDark as formDark, formItemGiProps, formItemGiProps as formItemGridItemProps, formItemProps, formProps, getMenuItemKey, gridItemProps as giProps, gradientTextDark, gradientTextProps, gridItemProps, gridProps, headerProps$2 as h1Props, headerProps$2 as h2Props, headerProps$2 as h3Props, headerProps$2 as h4Props, headerProps$2 as h5Props, headerProps$2 as h6Props, hasChildren, headerActionsProps, headerDesktopLayoutProps, headerMobileLayoutProps, headerMobileProps, headerNavigationProps, headerProps$1 as headerProps, headerSearchDesktopProps, headerSearchMobileProps, headerSearchResultsProps, HeatmapDark as heatmapDark, heatmapLight, heatmapMockData, heatmapProps, highlightProps, iconBarItemProps, iconBarProps, iconDark$1 as iconDark, iconPackDark, iconPackLight, iconPackProps, iconProps, iconWrapperProps, imageGroupProps, imagePreviewProps, imageProps, infiniteScrollProps, inputDark, inputGroupLabelProps, inputGroupProps, inputNumberDark, inputNumberProps, inputOtpDark, inputOtpProps, inputProps, install, internalSelectMenuDark, internalSelectionDark, isColumnOption, isDividerOption, isGroupOption, isLeafMenuOption, isNotNull, kanbanDark, kanbanLight, kanbanProps, layoutProps as layoutContentProps, layoutDark, layoutFooterProps, headerProps as layoutHeaderProps, layoutProps, layoutSiderProps, transferProps$1 as legacyTransferProps, lightTheme, listDark$1 as listDark, listProps, loadingBarDark, loadingBarProviderProps, logDark, logProps, mappingCardDark, mappingCardLight, marqueeDark, listDark as mentionDark, mentionProps, menuDark, menuProps, messageDark, messageProviderProps, modalDark, modalFullscreenProps, modalProps, modalProviderProps, notificationDark, notificationProviderProps, numberAnimationProps, olProps, pProps, pageHeaderProps, paginationDark, paginationProps, popconfirmDark, popconfirmProps, popoverDark, popoverProps, popselect as popselectDark, popselectProps, progressDark, progressProps, qrCodeProps, radioButtonProps, radioDark, radioGroupProps, radioProps, rateDark, rateProps, renderAsyncIcon, renderBadge, renderConfig, renderIcon, renderOptionLabel, resolvePlacement, resolveTopLevelMenuKey, resultDark, resultProps, rowProps, ruRu as ruRU, safeTopScrollbarProps, scrollbarDark, scrollbarProps, selectDark, selectProps, skeletonProps, sliderDark, sliderProps, spaceDark, spaceProps, spinDark, spinProps, splitProps, statisticDark, statisticProps, emptyDark as statusDark, statusProps, stepProps, stepsDark, stepsProps, switchDark, switchProps, tabPaneProps, tabProps, tableDark, tableProps, tabsDark, tabsProps, tagDark, tagProps, textProps, thingDark, thingProps, timePickerDark, timePickerProps, timeProps, timelineDark, timelineItemProps, timelineProps, toggleButtonDark, toggleButtonProps, tooltipDark, tooltipProps, transferDark$1 as transferDark, transferProps, treeDark, treeGetClickTarget, treeProps, treeSelectDark, treeSelectProps, typographyDark, ulProps, alertRtl as unstableAlertRtl, avatarGroupRtl as unstableAvatarGroupRtl, badgeRtl as unstableBadgeRtl, buttonGroupRtl as unstableButtonGroupRtl, buttonRtl as unstableButtonRtl, cardRtl as unstableCardRtl, checkboxRtl as unstableCheckboxRtl, collapseRtl as unstableCollapseRtl, collapseTransitionRtl as unstableCollapseTransitionRtl, drawerRtl as unstableDrawerRtl, dynamicInputRtl as unstableDynamicInputRtl, inputNumberRtl as unstableInputNumberRtl, inputOtpRtl as unstableInputOtpRtl, inputRtl as unstableInputRtl, listRtl as unstableListRtl, messageRtl as unstableMessageRtl, notificationRtl as unstableNotificationRtl, rtl as unstablePageHeaderRtl, paginationRtl as unstablePaginationRtl, radioRtl as unstableRadioRtl, rowRtl as unstableRowRtl, scrollbarRtl as unstableScrollbarRtl, spaceRtl as unstableSpaceRtl, statisticRtl as unstableStatisticRtl, stepsRtl as unstableStepsRtl, tableRtl as unstableTableRtl, tagRtl as unstableTagRtl, thingRtl as unstableThingRtl, treeRtl as unstableTreeRtl, uploadRtl as unstableUploadRtl, uploadDark, publicDownload as uploadDownload, uploadProps, useDialog, useDialogReactiveList, useLoadingBar, useMessage, useModal, useModalReactiveList, useNotification, useOsTheme, useThemeVars, uzUZ, version, virtualListProps, watermarkDark, watermarkProps, zhCN$1 as zhCN, zindexable };