@element-plus/nightly 0.0.20260421 → 0.0.20260422

package/es/components/popover/src/popover.vue.d.ts

@@ -20,36 +20,36 @@ declare const __VLS_base: vue.DefineComponent<PopoverProps, {
   /** @description popper ref */popperRef: vue.ComputedRef<PopperInstance | undefined>; /** @description hide popover */
   hide: () => void;
 }, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
+  "update:visible": (value: boolean) => void;
   "after-enter": () => void;
   "after-leave": () => void;
   "before-enter": () => void;
   "before-leave": () => void;
-  "update:visible": (value: boolean) => void;
 }, string, vue.PublicProps, Readonly<PopoverProps> & Readonly<{
+  "onUpdate:visible"?: ((value: boolean) => any) | undefined;
   "onAfter-enter"?: (() => any) | undefined;
   "onAfter-leave"?: (() => any) | undefined;
   "onBefore-enter"?: (() => any) | undefined;
   "onBefore-leave"?: (() => any) | undefined;
-  "onUpdate:visible"?: ((value: boolean) => any) | undefined;
 }>, {
+  placement: Placement;
+  popperStyle: string | false | vue.CSSProperties | vue.StyleValue[] | null;
+  teleported: boolean;
   effect: PopperEffect;
+  persistent: boolean;
+  visible: boolean | null;
   enterable: boolean;
-  hideAfter: number;
   offset: number;
-  placement: Placement;
   popperOptions: Partial<Options>;
-  showAfter: number;
   showArrow: boolean;
-  visible: boolean | null;
   content: string;
-  width: string | number;
-  tabindex: string | number;
-  popperStyle: string | false | vue.CSSProperties | vue.StyleValue[] | null;
+  showAfter: number;
+  hideAfter: number;
   autoClose: number;
-  teleported: boolean;
-  persistent: boolean;
   trigger: Arrayable<TooltipTriggerType>;
   triggerKeys: string[];
+  width: string | number;
+  tabindex: string | number;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/es/components/popper/src/composables/use-content.d.ts

@@ -52,16 +52,16 @@ declare const usePopperContent: (props: PopperContentProps) => {
         popperEscapeOffsets: _popperjs_core0.SideObject;
       };
       offset?: {
-        auto?: _popperjs_core0.Offsets | undefined;
-        left?: _popperjs_core0.Offsets | undefined;
-        right?: _popperjs_core0.Offsets | undefined;
+        "bottom-start"?: _popperjs_core0.Offsets | undefined;
         bottom?: _popperjs_core0.Offsets | undefined;
-        top?: _popperjs_core0.Offsets | undefined;
+        auto?: _popperjs_core0.Offsets | undefined;
         "auto-start"?: _popperjs_core0.Offsets | undefined;
         "auto-end"?: _popperjs_core0.Offsets | undefined;
+        top?: _popperjs_core0.Offsets | undefined;
+        right?: _popperjs_core0.Offsets | undefined;
+        left?: _popperjs_core0.Offsets | undefined;
         "top-start"?: _popperjs_core0.Offsets | undefined;
         "top-end"?: _popperjs_core0.Offsets | undefined;
-        "bottom-start"?: _popperjs_core0.Offsets | undefined;
         "bottom-end"?: _popperjs_core0.Offsets | undefined;
         "right-start"?: _popperjs_core0.Offsets | undefined;
         "right-end"?: _popperjs_core0.Offsets | undefined;

package/es/components/popper/src/composables/use-focus-trap.d.ts

@@ -4,7 +4,7 @@ import { SetupContext } from "vue";
 
 //#region ../../packages/components/popper/src/composables/use-focus-trap.d.ts
 declare const usePopperContentFocusTrap: (props: PopperContentProps, emit: SetupContext<PopperContentEmits>["emit"]) => {
-  focusStartRef: vue.Ref<HTMLElement | "first" | "container" | undefined, HTMLElement | "first" | "container" | undefined>;
+  focusStartRef: vue.Ref<HTMLElement | "container" | "first" | undefined, HTMLElement | "container" | "first" | undefined>;
   trapped: vue.Ref<boolean, boolean>;
   onFocusAfterReleased: (event: CustomEvent) => void;
   onFocusAfterTrapped: () => void;

package/es/components/popper/src/content.d.ts

@@ -45,7 +45,7 @@ declare const popperCoreConfigProps: {
   readonly offset: EpPropFinalized<NumberConstructor, unknown, unknown, 12, boolean>;
   readonly placement: EpPropFinalized<StringConstructor, Placement, unknown, "bottom", boolean>;
   readonly popperOptions: EpPropFinalized<(new (...args: any[]) => Partial<Options>) | (() => Partial<Options>) | (((new (...args: any[]) => Partial<Options>) | (() => Partial<Options>)) | null)[], unknown, unknown, () => {}, boolean>;
-  readonly strategy: EpPropFinalized<StringConstructor, "fixed" | "absolute", unknown, "absolute", boolean>;
+  readonly strategy: EpPropFinalized<StringConstructor, "absolute" | "fixed", unknown, "absolute", boolean>;
 };
 /**
  * @deprecated Removed after 3.0.0, Use `PopperCoreConfigProps` instead.
@@ -130,7 +130,7 @@ declare const popperContentProps: {
   readonly offset: EpPropFinalized<NumberConstructor, unknown, unknown, 12, boolean>;
   readonly placement: EpPropFinalized<StringConstructor, Placement, unknown, "bottom", boolean>;
   readonly popperOptions: EpPropFinalized<(new (...args: any[]) => Partial<Options>) | (() => Partial<Options>) | (((new (...args: any[]) => Partial<Options>) | (() => Partial<Options>)) | null)[], unknown, unknown, () => {}, boolean>;
-  readonly strategy: EpPropFinalized<StringConstructor, "fixed" | "absolute", unknown, "absolute", boolean>;
+  readonly strategy: EpPropFinalized<StringConstructor, "absolute" | "fixed", unknown, "absolute", boolean>;
 };
 /**
  * @deprecated Removed after 3.0.0, Use `PopperContentProps` instead.
@@ -181,7 +181,7 @@ declare const usePopperCoreConfigProps: {
   readonly offset: EpPropFinalized<NumberConstructor, unknown, unknown, 12, boolean>;
   readonly placement: EpPropFinalized<StringConstructor, Placement, unknown, "bottom", boolean>;
   readonly popperOptions: EpPropFinalized<(new (...args: any[]) => Partial<Options>) | (() => Partial<Options>) | (((new (...args: any[]) => Partial<Options>) | (() => Partial<Options>)) | null)[], unknown, unknown, () => {}, boolean>;
-  readonly strategy: EpPropFinalized<StringConstructor, "fixed" | "absolute", unknown, "absolute", boolean>;
+  readonly strategy: EpPropFinalized<StringConstructor, "absolute" | "fixed", unknown, "absolute", boolean>;
 };
 /** @deprecated use `popperContentProps` instead, and it will be deprecated in the next major version */
 declare const usePopperContentProps: {
@@ -240,7 +240,7 @@ declare const usePopperContentProps: {
   readonly offset: EpPropFinalized<NumberConstructor, unknown, unknown, 12, boolean>;
   readonly placement: EpPropFinalized<StringConstructor, Placement, unknown, "bottom", boolean>;
   readonly popperOptions: EpPropFinalized<(new (...args: any[]) => Partial<Options>) | (() => Partial<Options>) | (((new (...args: any[]) => Partial<Options>) | (() => Partial<Options>)) | null)[], unknown, unknown, () => {}, boolean>;
-  readonly strategy: EpPropFinalized<StringConstructor, "fixed" | "absolute", unknown, "absolute", boolean>;
+  readonly strategy: EpPropFinalized<StringConstructor, "absolute" | "fixed", unknown, "absolute", boolean>;
 };
 /** @deprecated use `popperContentEmits` instead, and it will be deprecated in the next major version */
 declare const usePopperContentEmits: {

package/es/components/popper/src/content.vue.d.ts

@@ -28,36 +28,36 @@ declare const __VLS_base: vue.DefineComponent<PopperContentProps, {
    */
   contentStyle: vue.ComputedRef<vue.StyleValue[]>;
 }, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
-  close: () => void;
-  blur: () => void;
   focus: () => void;
+  blur: () => void;
+  close: () => void;
   mouseenter: (evt: MouseEvent) => void;
   mouseleave: (evt: MouseEvent) => void;
 }, string, vue.PublicProps, Readonly<PopperContentProps> & Readonly<{
-  onClose?: (() => any) | undefined;
-  onBlur?: (() => any) | undefined;
   onFocus?: (() => any) | undefined;
+  onBlur?: (() => any) | undefined;
+  onClose?: (() => any) | undefined;
   onMouseenter?: ((evt: MouseEvent) => any) | undefined;
   onMouseleave?: ((evt: MouseEvent) => any) | undefined;
 }>, {
-  effect: PopperEffect;
-  enterable: boolean;
-  offset: number;
   placement: Placement$1;
-  popperOptions: Partial<Options$1>;
+  popperStyle: string | false | vue.CSSProperties | vue.StyleValue[] | null;
+  effect: PopperEffect;
   visible: boolean;
   style: string | false | vue.CSSProperties | vue.StyleValue[] | null;
-  strategy: "fixed" | "absolute";
-  popperStyle: string | false | vue.CSSProperties | vue.StyleValue[] | null;
-  boundariesPadding: number;
-  gpuAcceleration: boolean;
-  arrowOffset: number;
-  stopPopperMouseEvent: boolean;
-  loop: boolean;
+  enterable: boolean;
   pure: boolean;
   focusOnShow: boolean;
   trapping: boolean;
+  stopPopperMouseEvent: boolean;
   virtualTriggering: boolean;
+  loop: boolean;
+  boundariesPadding: number;
+  gpuAcceleration: boolean;
+  offset: number;
+  popperOptions: Partial<Options$1>;
+  strategy: "absolute" | "fixed";
+  arrowOffset: number;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/es/components/popper/src/popper.d.ts

@@ -23,7 +23,7 @@ interface PopperProps {
  * @deprecated Removed after 3.0.0, Use `PopperProps` instead.
  */
 declare const popperProps: {
-  readonly role: EpPropFinalized<StringConstructor, "dialog" | "tree" | "listbox" | "grid" | "menu" | "tooltip" | "group" | "navigation", unknown, "tooltip", boolean>;
+  readonly role: EpPropFinalized<StringConstructor, "tooltip" | "dialog" | "grid" | "group" | "listbox" | "menu" | "navigation" | "tree", unknown, "tooltip", boolean>;
 };
 /**
  * @deprecated Removed after 3.0.0, Use `PopperProps` instead.
@@ -32,7 +32,7 @@ type PopperPropsPublic = ExtractPublicPropTypes<typeof popperProps>;
 type PopperInstance = InstanceType<typeof _default> & unknown;
 /** @deprecated use `popperProps` instead, and it will be deprecated in the next major version */
 declare const usePopperProps: {
-  readonly role: EpPropFinalized<StringConstructor, "dialog" | "tree" | "listbox" | "grid" | "menu" | "tooltip" | "group" | "navigation", unknown, "tooltip", boolean>;
+  readonly role: EpPropFinalized<StringConstructor, "tooltip" | "dialog" | "grid" | "group" | "listbox" | "menu" | "navigation" | "tree", unknown, "tooltip", boolean>;
 };
 /** @deprecated use `PopperProps` instead, and it will be deprecated in the next major version */
 type UsePopperProps = PopperProps;

package/es/components/progress/src/progress.d.ts

@@ -73,7 +73,7 @@ interface ProgressProps {
 declare const progressProps: {
   readonly type: EpPropFinalized<StringConstructor, "circle" | "line" | "dashboard", unknown, "line", boolean>;
   readonly percentage: EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
-  readonly status: EpPropFinalized<StringConstructor, "" | "success" | "exception" | "warning", unknown, "", boolean>;
+  readonly status: EpPropFinalized<StringConstructor, "" | "success" | "warning" | "exception", unknown, "", boolean>;
   readonly indeterminate: BooleanConstructor;
   readonly duration: EpPropFinalized<NumberConstructor, unknown, unknown, 3, boolean>;
   readonly strokeWidth: EpPropFinalized<NumberConstructor, unknown, unknown, 6, boolean>;

package/es/components/progress/src/progress.vue.d.ts

@@ -14,16 +14,16 @@ type __VLS_Slots = {} & {
   default?: (props: typeof __VLS_3) => any;
 };
 declare const __VLS_base: vue.DefineComponent<ProgressProps, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<ProgressProps> & Readonly<{}>, {
-  showText: boolean;
   type: "line" | "circle" | "dashboard";
   color: string | ProgressColor[] | ProgressFn;
   strokeLinecap: NonNullable<vue.SVGAttributes["stroke-linecap"]>;
   strokeWidth: number;
   width: number;
-  percentage: number;
   status: "" | "success" | "exception" | "warning";
-  duration: number;
+  percentage: number;
   format: ProgressFn;
+  duration: number;
+  showText: boolean;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/es/components/radio/src/radio-button.d.ts

@@ -11,16 +11,16 @@ interface RadioButtonProps extends RadioPropsBase {}
  * @deprecated Removed after 3.0.0, Use `RadioButtonProps` instead.
  */
 declare const radioButtonProps: {
-  readonly modelValue: EpPropFinalized<(BooleanConstructor | StringConstructor | NumberConstructor)[], unknown, unknown, undefined, boolean>;
+  readonly modelValue: EpPropFinalized<(NumberConstructor | BooleanConstructor | StringConstructor)[], unknown, unknown, undefined, boolean>;
   readonly size: {
-    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never>>;
+    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "large" | "small", never>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
   };
   readonly disabled: EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
-  readonly label: EpPropFinalized<(BooleanConstructor | StringConstructor | NumberConstructor)[], unknown, unknown, undefined, boolean>;
-  readonly value: EpPropFinalized<(BooleanConstructor | StringConstructor | NumberConstructor)[], unknown, unknown, undefined, boolean>;
+  readonly label: EpPropFinalized<(NumberConstructor | BooleanConstructor | StringConstructor)[], unknown, unknown, undefined, boolean>;
+  readonly value: EpPropFinalized<(NumberConstructor | BooleanConstructor | StringConstructor)[], unknown, unknown, undefined, boolean>;
   readonly name: EpPropFinalized<StringConstructor, unknown, unknown, undefined, boolean>;
 };
 /**

package/es/components/radio/src/radio-button.vue.d.ts

@@ -7,11 +7,11 @@ type __VLS_Slots = {} & {
   default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_base: vue.DefineComponent<RadioButtonProps, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<RadioButtonProps> & Readonly<{}>, {
-  modelValue: string | number | boolean;
-  disabled: boolean;
+  value: string | number | boolean;
   label: string | number | boolean;
+  disabled: boolean;
+  modelValue: string | number | boolean;
   name: string;
-  value: string | number | boolean;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/es/components/radio/src/radio-group.d.ts

@@ -70,7 +70,7 @@ declare const radioGroupProps: {
   readonly ariaLabel: StringConstructor;
   readonly id: EpPropFinalized<StringConstructor, unknown, unknown, undefined, boolean>;
   readonly size: {
-    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never>>;
+    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "large" | "small", never>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;

package/es/components/radio/src/radio-group.vue.d.ts

@@ -8,21 +8,21 @@ type __VLS_Slots = {} & {
   default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_base: vue.DefineComponent<RadioGroupProps, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
-  change: (val: string | number | boolean | undefined) => void;
   "update:modelValue": (val: string | number | boolean | undefined) => void;
+  change: (val: string | number | boolean | undefined) => void;
 }, string, vue.PublicProps, Readonly<RadioGroupProps> & Readonly<{
-  onChange?: ((val: string | number | boolean | undefined) => any) | undefined;
   "onUpdate:modelValue"?: ((val: string | number | boolean | undefined) => any) | undefined;
+  onChange?: ((val: string | number | boolean | undefined) => any) | undefined;
 }>, {
-  modelValue: string | number | boolean;
-  id: string;
   disabled: boolean;
-  textColor: string;
   fill: string;
+  validateEvent: boolean;
+  modelValue: string | number | boolean;
   props: radioOptionProp;
   type: "radio" | "button";
+  id: string;
   name: string;
-  validateEvent: boolean;
+  textColor: string;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/es/components/radio/src/radio.d.ts

@@ -42,16 +42,16 @@ interface RadioProps extends RadioPropsBase {
  * @deprecated Removed after 3.0.0, Use `RadioPropsBase` instead.
  */
 declare const radioPropsBase: {
-  modelValue: EpPropFinalized<(BooleanConstructor | StringConstructor | NumberConstructor)[], unknown, unknown, undefined, boolean>;
+  modelValue: EpPropFinalized<(NumberConstructor | BooleanConstructor | StringConstructor)[], unknown, unknown, undefined, boolean>;
   size: {
-    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never>>;
+    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "large" | "small", never>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
   };
   disabled: EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
-  label: EpPropFinalized<(BooleanConstructor | StringConstructor | NumberConstructor)[], unknown, unknown, undefined, boolean>;
-  value: EpPropFinalized<(BooleanConstructor | StringConstructor | NumberConstructor)[], unknown, unknown, undefined, boolean>;
+  label: EpPropFinalized<(NumberConstructor | BooleanConstructor | StringConstructor)[], unknown, unknown, undefined, boolean>;
+  value: EpPropFinalized<(NumberConstructor | BooleanConstructor | StringConstructor)[], unknown, unknown, undefined, boolean>;
   name: EpPropFinalized<StringConstructor, unknown, unknown, undefined, boolean>;
 };
 /**
@@ -59,16 +59,16 @@ declare const radioPropsBase: {
  */
 declare const radioProps: {
   readonly border: BooleanConstructor;
-  readonly modelValue: EpPropFinalized<(BooleanConstructor | StringConstructor | NumberConstructor)[], unknown, unknown, undefined, boolean>;
+  readonly modelValue: EpPropFinalized<(NumberConstructor | BooleanConstructor | StringConstructor)[], unknown, unknown, undefined, boolean>;
   readonly size: {
-    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never>>;
+    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "large" | "small", never>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;
   };
   readonly disabled: EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
-  readonly label: EpPropFinalized<(BooleanConstructor | StringConstructor | NumberConstructor)[], unknown, unknown, undefined, boolean>;
-  readonly value: EpPropFinalized<(BooleanConstructor | StringConstructor | NumberConstructor)[], unknown, unknown, undefined, boolean>;
+  readonly label: EpPropFinalized<(NumberConstructor | BooleanConstructor | StringConstructor)[], unknown, unknown, undefined, boolean>;
+  readonly value: EpPropFinalized<(NumberConstructor | BooleanConstructor | StringConstructor)[], unknown, unknown, undefined, boolean>;
   readonly name: EpPropFinalized<StringConstructor, unknown, unknown, undefined, boolean>;
 };
 declare const radioEmits: {

package/es/components/radio/src/radio.vue.d.ts

@@ -7,18 +7,18 @@ type __VLS_Slots = {} & {
   default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_base: vue.DefineComponent<RadioProps, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
-  change: (val: string | number | boolean | undefined) => void;
   "update:modelValue": (val: string | number | boolean | undefined) => void;
+  change: (val: string | number | boolean | undefined) => void;
 }, string, vue.PublicProps, Readonly<RadioProps> & Readonly<{
-  onChange?: ((val: string | number | boolean | undefined) => any) | undefined;
   "onUpdate:modelValue"?: ((val: string | number | boolean | undefined) => any) | undefined;
+  onChange?: ((val: string | number | boolean | undefined) => any) | undefined;
 }>, {
-  modelValue: string | number | boolean;
-  disabled: boolean;
+  value: string | number | boolean;
   label: string | number | boolean;
+  disabled: boolean;
+  modelValue: string | number | boolean;
   border: boolean;
   name: string;
-  value: string | number | boolean;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/es/components/rate/src/rate.d.ts

@@ -117,7 +117,7 @@ declare const rateProps: {
   readonly texts: EpPropFinalized<(new (...args: any[]) => string[]) | (() => string[]) | (((new (...args: any[]) => string[]) | (() => string[])) | null)[], unknown, unknown, () => ["Extremely bad", "Disappointed", "Fair", "Satisfied", "Surprise"], boolean>;
   readonly scoreTemplate: EpPropFinalized<StringConstructor, unknown, unknown, "{value}", boolean>;
   readonly size: {
-    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never>>;
+    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "large" | "small", never>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;

package/es/components/rate/src/rate.vue.d.ts

@@ -10,25 +10,25 @@ declare const __VLS_export: vue.DefineComponent<RateProps, {
   /** @description set current value */setCurrentValue: typeof setCurrentValue; /** @description reset current value */
   resetCurrentValue: typeof resetCurrentValue;
 }, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
-  change: (value: number) => void;
   "update:modelValue": (value: number) => void;
+  change: (value: number) => void;
 }, string, vue.PublicProps, Readonly<RateProps> & Readonly<{
-  onChange?: ((value: number) => any) | undefined;
   "onUpdate:modelValue"?: ((value: number) => any) | undefined;
+  onChange?: ((value: number) => any) | undefined;
 }>, {
+  disabled: boolean;
   modelValue: number;
   id: string;
+  max: number;
+  textColor: string;
   lowThreshold: number;
   highThreshold: number;
-  max: number;
   colors: string[] | Record<number, string>;
   voidColor: string;
   disabledVoidColor: string;
   icons: Array<IconPropType> | Record<number, IconPropType>;
   voidIcon: IconPropType;
   disabledVoidIcon: IconPropType;
-  disabled: boolean;
-  textColor: string;
   texts: string[];
   scoreTemplate: string;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;

package/es/components/result/src/result.d.ts

@@ -32,7 +32,7 @@ interface ResultProps {
 declare const resultProps: {
   readonly title: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
   readonly subTitle: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
-  readonly icon: EpPropFinalized<StringConstructor, "error" | "success" | "warning" | "primary" | "info", unknown, "info", boolean>;
+  readonly icon: EpPropFinalized<StringConstructor, "info" | "primary" | "success" | "warning" | "error", unknown, "info", boolean>;
 };
 /**
  * @deprecated Removed after 3.0.0, Use `ResultProps` instead.

package/es/components/result/src/result.vue.d.ts

@@ -13,8 +13,8 @@ type __VLS_Slots = {} & {
   extra?: (props: typeof __VLS_12) => any;
 };
 declare const __VLS_base: vue.DefineComponent<ResultProps, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<ResultProps> & Readonly<{}>, {
-  title: string;
   icon: "primary" | "success" | "warning" | "info" | "error";
+  title: string;
   subTitle: string;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/es/components/roving-focus-group/src/roving-focus-item.vue.d.ts

@@ -13,15 +13,15 @@ declare const __VLS_export: vue.DefineComponent<vue.ExtractPropTypes<{
   handleKeydown: (event: Event) => void;
   handleFocus: (event: Event) => void;
   handleMousedown: (event: Event) => void;
-}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("focus" | "keydown" | "mousedown")[], "focus" | "keydown" | "mousedown", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("focus" | "mousedown" | "keydown")[], "focus" | "mousedown" | "keydown", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
   focusable: {
     type: BooleanConstructor;
     default: boolean;
   };
   active: BooleanConstructor;
 }>> & Readonly<{
-  onFocus?: ((...args: any[]) => any) | undefined;
   onKeydown?: ((...args: any[]) => any) | undefined;
+  onFocus?: ((...args: any[]) => any) | undefined;
   onMousedown?: ((...args: any[]) => any) | undefined;
 }>, {
   active: boolean;

package/es/components/row/src/row.d.ts

@@ -33,7 +33,7 @@ declare const rowProps: {
   readonly gutter: EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
   readonly justify: EpPropFinalized<StringConstructor, "space-around" | "space-between" | "space-evenly" | "center" | "end" | "start", unknown, "start", boolean>;
   readonly align: {
-    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "middle" | "bottom" | "top", unknown>>;
+    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "bottom" | "top" | "middle", unknown>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;

package/es/components/row/src/row.vue.d.ts

@@ -8,8 +8,8 @@ type __VLS_Slots = {} & {
   default?: (props: typeof __VLS_8) => any;
 };
 declare const __VLS_base: vue.DefineComponent<RowProps, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<RowProps> & Readonly<{}>, {
-  tag: string;
   justify: typeof RowJustify[number];
+  tag: string;
   gutter: number;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/es/components/scrollbar/src/scrollbar.vue.d.ts

@@ -29,9 +29,9 @@ declare const __VLS_base: vue.DefineComponent<ScrollbarProps, {
   }) => any) | undefined;
   "onEnd-reached"?: ((direction: ScrollbarDirection) => any) | undefined;
 }>, {
-  tag: keyof HTMLElementTagNameMap | (string & {});
   height: number | string;
   maxHeight: number | string;
+  tag: keyof HTMLElementTagNameMap | (string & {});
   distance: number;
   wrapStyle: string | false | CSSProperties | StyleValue[] | null;
   wrapClass: string | string[];

package/es/components/segmented/index.d.ts

@@ -6,8 +6,8 @@ import * as vue from "vue";
 
 //#region ../../packages/components/segmented/index.d.ts
 declare const ElSegmented: (<T extends Option = Option>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: {
+  emit: ((event: "update:modelValue", val: any) => void) & ((event: "change", val: any) => void);
   attrs: any;
-  emit: ((event: "change", val: any) => void) & ((event: "update:modelValue", val: any) => void);
   slots: {
     default?: (props: {
       item: T;
@@ -26,8 +26,8 @@ declare const ElSegmented: (<T extends Option = Option>(__VLS_props: NonNullable
     id?: string | undefined;
     name?: string | undefined;
     ariaLabel?: string | undefined;
-    onChange?: ((val: any) => any) | undefined;
     "onUpdate:modelValue"?: ((val: any) => any) | undefined;
+    onChange?: ((val: any) => any) | undefined;
   } & (typeof globalThis extends {
     __VLS_PROPS_FALLBACK: infer P;
   } ? P : {});
@@ -38,7 +38,7 @@ declare const ElSegmented: (<T extends Option = Option>(__VLS_props: NonNullable
       item: T;
     }) => any;
   };
-  emit: ((event: "change", val: any) => void) & ((event: "update:modelValue", val: any) => void);
+  emit: ((event: "update:modelValue", val: any) => void) & ((event: "change", val: any) => void);
 }>) => vue.VNode & {
   __ctx?: Awaited<typeof __VLS_setup>;
 }) & vue.ObjectPlugin & Record<string, any>;

package/es/components/segmented/src/segmented.d.ts

@@ -64,11 +64,11 @@ declare const segmentedProps: {
   ariaLabel: StringConstructor;
   direction: EpPropFinalized<(new (...args: any[]) => "horizontal" | "vertical") | (() => "horizontal" | "vertical") | (((new (...args: any[]) => "horizontal" | "vertical") | (() => "horizontal" | "vertical")) | null)[], unknown, unknown, string, boolean>;
   options: EpPropFinalized<(new (...args: any[]) => Option[]) | (() => Option[]) | (((new (...args: any[]) => Option[]) | (() => Option[])) | null)[], unknown, unknown, () => never[], boolean>;
-  modelValue: EpPropFinalized<(BooleanConstructor | StringConstructor | NumberConstructor)[], unknown, unknown, undefined, boolean>;
+  modelValue: EpPropFinalized<(NumberConstructor | BooleanConstructor | StringConstructor)[], unknown, unknown, undefined, boolean>;
   props: EpPropFinalized<(new (...args: any[]) => Props) | (() => Props) | (((new (...args: any[]) => Props) | (() => Props)) | null)[], unknown, unknown, () => Required<Props>, boolean>;
   block: BooleanConstructor;
   size: {
-    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never>>;
+    readonly type: vue.PropType<EpPropMergeType<StringConstructor, "" | "default" | "large" | "small", never>>;
     readonly required: false;
     readonly validator: ((val: unknown) => boolean) | undefined;
     __epPropKey: true;

package/es/components/segmented/src/segmented.vue.d.ts

@@ -5,8 +5,8 @@ import * as vue from "vue";
 //#region ../../packages/components/segmented/src/segmented.vue.d.ts
 declare const __VLS_export: <T extends Option = Option>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
   props: vue.PublicProps & __VLS_PrettifyLocal<SegmentedProps<T> & {
-    onChange?: ((val: any) => any) | undefined;
     "onUpdate:modelValue"?: ((val: any) => any) | undefined;
+    onChange?: ((val: any) => any) | undefined;
   }> & (typeof globalThis extends {
     __VLS_PROPS_FALLBACK: infer P;
   } ? P : {});
@@ -17,7 +17,7 @@ declare const __VLS_export: <T extends Option = Option>(__VLS_props: NonNullable
       item: T;
     }) => any;
   };
-  emit: ((event: "change", val: any) => void) & ((event: "update:modelValue", val: any) => void);
+  emit: ((event: "update:modelValue", val: any) => void) & ((event: "change", val: any) => void);
 }>) => vue.VNode & {
   __ctx?: Awaited<typeof __VLS_setup>;
 };

package/es/components/segmented/src/segmented.vue_vue_type_script_setup_true_lang.mjs

@@ -122,6 +122,10 @@ var segmented_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
 		});
 		useResizeObserver(segmentedRef, updateSelect);
 		watch(activeElement, updateSelect);
+		watch(() => props.options, updateSelect, {
+			deep: true,
+			flush: "post"
+		});
 		watch(() => props.modelValue, () => {
 			updateSelect();
 			if (props.validateEvent) formItem?.validate?.("change").catch(NOOP);

package/es/components/segmented/src/segmented.vue_vue_type_script_setup_true_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"segmented.vue_vue_type_script_setup_true_lang.mjs","names":[],"sources":["../../../../../../packages/components/segmented/src/segmented.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"options.length\"\n    :id=\"inputId\"\n    ref=\"segmentedRef\"\n    :class=\"segmentedCls\"\n    role=\"radiogroup\"\n    :aria-label=\"!isLabeledByFormItem ? ariaLabel || 'segmented' : undefined\"\n    :aria-labelledby=\"isLabeledByFormItem ? formItem!.labelId : undefined\"\n  >\n    <div :class=\"[ns.e('group'), ns.m(direction)]\">\n      <div :style=\"selectedStyle\" :class=\"selectedCls\" />\n      <label\n        v-for=\"(item, index) in options\"\n        :key=\"index\"\n        :class=\"getItemCls(item)\"\n      >\n        <input\n          :class=\"ns.e('item-input')\"\n          type=\"radio\"\n          :name=\"name\"\n          :disabled=\"getDisabled(item)\"\n          :checked=\"getSelected(item)\"\n          @change=\"handleChange($event, item)\"\n        />\n        <div :class=\"ns.e('item-label')\">\n          <slot :item=\"item\">{{ getLabel(item) }}</slot>\n        </div>\n      </label>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup generic=\"T extends Option = Option\">\nimport { computed, reactive, ref, watch } from 'vue'\nimport { useActiveElement, useResizeObserver } from '@vueuse/core'\nimport { useId, useNamespace } from '@element-plus/hooks'\nimport {\n  useFormDisabled,\n  useFormItem,\n  useFormItemInputId,\n  useFormSize,\n} from '@element-plus/components/form'\nimport { NOOP, isObject } from '@element-plus/utils'\nimport { CHANGE_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { defaultProps, segmentedEmits } from './segmented'\n\nimport type { Option } from './types'\nimport type { SegmentedProps } from './segmented'\n\ndefineOptions({\n  name: 'ElSegmented',\n})\n\nconst props = withDefaults(defineProps<SegmentedProps<T>>(), {\n  direction: 'horizontal',\n  options: () => [],\n  props: () => defaultProps,\n  validateEvent: true,\n  modelValue: undefined,\n  disabled: undefined,\n})\nconst emit = defineEmits(segmentedEmits)\n\nconst ns = useNamespace('segmented')\nconst segmentedId = useId()\nconst segmentedSize = useFormSize()\nconst _disabled = useFormDisabled()\nconst { formItem } = useFormItem()\nconst { inputId, isLabeledByFormItem } = useFormItemInputId(props, {\n  formItemContext: formItem,\n})\n\nconst segmentedRef = ref<HTMLElement | null>(null)\nconst activeElement = useActiveElement()\n\nconst state = reactive({\n  isInit: false,\n  width: 0,\n  height: 0,\n  translateX: 0,\n  translateY: 0,\n  focusVisible: false,\n})\n\nconst handleChange = (evt: Event, item: T) => {\n  const value = getValue(item)\n  emit(UPDATE_MODEL_EVENT, value)\n  emit(CHANGE_EVENT, value)\n  ;(evt.target as HTMLInputElement).checked = value === props.modelValue\n}\n\nconst aliasProps = computed(() => ({ ...defaultProps, ...props.props }))\n\nconst getValue = (item: T) => {\n  return isObject(item) ? item[aliasProps.value.value] : item\n}\n\nconst getLabel = (item: T) => {\n  return isObject(item) ? item[aliasProps.value.label] : item\n}\n\nconst getDisabled = (item: T | undefined) => {\n  return !!(\n    _disabled.value ||\n    (isObject(item) ? item[aliasProps.value.disabled] : false)\n  )\n}\n\nconst getSelected = (item: T) => {\n  return props.modelValue === getValue(item)\n}\n\nconst getOption = (value: any) => {\n  return props.options.find((item) => getValue(item) === value)\n}\n\nconst getItemCls = (item: T) => {\n  return [\n    ns.e('item'),\n    ns.is('selected', getSelected(item)),\n    ns.is('disabled', getDisabled(item)),\n  ]\n}\n\nconst updateSelect = () => {\n  if (!segmentedRef.value) return\n  const selectedItem = segmentedRef.value.querySelector(\n    '.is-selected'\n  ) as HTMLElement\n  const selectedItemInput = segmentedRef.value.querySelector(\n    '.is-selected input'\n  ) as HTMLElement\n  if (!selectedItem || !selectedItemInput) {\n    state.width = 0\n    state.height = 0\n    state.translateX = 0\n    state.translateY = 0\n    state.focusVisible = false\n    return\n  }\n  state.isInit = true\n  if (props.direction === 'vertical') {\n    state.height = selectedItem.offsetHeight\n    state.translateY = selectedItem.offsetTop\n  } else {\n    state.width = selectedItem.offsetWidth\n    state.translateX = selectedItem.offsetLeft\n  }\n  try {\n    // This will failed in test\n    state.focusVisible = selectedItemInput.matches(':focus-visible')\n  } catch {}\n}\n\nconst segmentedCls = computed(() => [\n  ns.b(),\n  ns.m(segmentedSize.value),\n  ns.is('block', props.block),\n])\n\nconst selectedStyle = computed(() => ({\n  width: props.direction === 'vertical' ? '100%' : `${state.width}px`,\n  height: props.direction === 'vertical' ? `${state.height}px` : '100%',\n  transform:\n    props.direction === 'vertical'\n      ? `translateY(${state.translateY}px)`\n      : `translateX(${state.translateX}px)`,\n  display: state.isInit ? 'block' : 'none',\n}))\n\nconst selectedCls = computed(() => [\n  ns.e('item-selected'),\n  ns.is('disabled', getDisabled(getOption(props.modelValue))),\n  ns.is('focus-visible', state.focusVisible),\n])\n\nconst name = computed(() => {\n  return props.name || segmentedId.value\n})\n\nuseResizeObserver(segmentedRef, updateSelect)\n\nwatch(activeElement, updateSelect)\n\nwatch(\n  () => props.modelValue,\n  () => {\n    updateSelect()\n    if (props.validateEvent) {\n      formItem?.validate?.('change').catch(NOOP)\n    }\n  },\n  {\n    flush: 'post',\n  }\n)\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsDA,MAAM,QAAQ;EAQd,MAAM,OAAO;EAEb,MAAM,KAAK,aAAa,YAAW;EACnC,MAAM,cAAc,OAAM;EAC1B,MAAM,gBAAgB,aAAY;EAClC,MAAM,YAAY,iBAAgB;EAClC,MAAM,EAAE,aAAa,aAAY;EACjC,MAAM,EAAE,SAAS,wBAAwB,mBAAmB,OAAO,EACjE,iBAAiB,UAClB,CAAA;EAED,MAAM,eAAe,IAAwB,KAAI;EACjD,MAAM,gBAAgB,kBAAiB;EAEvC,MAAM,QAAQ,SAAS;GACrB,QAAQ;GACR,OAAO;GACP,QAAQ;GACR,YAAY;GACZ,YAAY;GACZ,cAAc;GACf,CAAA;EAED,MAAM,gBAAgB,KAAY,SAAY;GAC5C,MAAM,QAAQ,SAAS,KAAI;AAC3B,QAAK,oBAAoB,MAAK;AAC9B,QAAK,cAAc,MAAK;AACvB,GAAC,IAAI,OAA4B,UAAU,UAAU,MAAM;;EAG9D,MAAM,aAAa,gBAAgB;GAAE,GAAG;GAAc,GAAG,MAAM;GAAO,EAAC;EAEvE,MAAM,YAAY,SAAY;AAC5B,UAAO,SAAS,KAAK,GAAG,KAAK,WAAW,MAAM,SAAS;;EAGzD,MAAM,YAAY,SAAY;AAC5B,UAAO,SAAS,KAAK,GAAG,KAAK,WAAW,MAAM,SAAS;;EAGzD,MAAM,eAAe,SAAwB;AAC3C,UAAO,CAAC,EACN,UAAU,UACT,SAAS,KAAK,GAAG,KAAK,WAAW,MAAM,YAAY;;EAIxD,MAAM,eAAe,SAAY;AAC/B,UAAO,MAAM,eAAe,SAAS,KAAI;;EAG3C,MAAM,aAAa,UAAe;AAChC,UAAO,MAAM,QAAQ,MAAM,SAAS,SAAS,KAAK,KAAK,MAAK;;EAG9D,MAAM,cAAc,SAAY;AAC9B,UAAO;IACL,GAAG,EAAE,OAAO;IACZ,GAAG,GAAG,YAAY,YAAY,KAAK,CAAC;IACpC,GAAG,GAAG,YAAY,YAAY,KAAK,CAAC;IACtC;;EAGF,MAAM,qBAAqB;AACzB,OAAI,CAAC,aAAa,MAAO;GACzB,MAAM,eAAe,aAAa,MAAM,cACtC,eACD;GACD,MAAM,oBAAoB,aAAa,MAAM,cAC3C,qBACD;AACD,OAAI,CAAC,gBAAgB,CAAC,mBAAmB;AACvC,UAAM,QAAQ;AACd,UAAM,SAAS;AACf,UAAM,aAAa;AACnB,UAAM,aAAa;AACnB,UAAM,eAAe;AACrB;;AAEF,SAAM,SAAS;AACf,OAAI,MAAM,cAAc,YAAY;AAClC,UAAM,SAAS,aAAa;AAC5B,UAAM,aAAa,aAAa;UAC3B;AACL,UAAM,QAAQ,aAAa;AAC3B,UAAM,aAAa,aAAa;;AAElC,OAAI;AAEF,UAAM,eAAe,kBAAkB,QAAQ,iBAAgB;WACzD;;EAGV,MAAM,eAAe,eAAe;GAClC,GAAG,GAAG;GACN,GAAG,EAAE,cAAc,MAAM;GACzB,GAAG,GAAG,SAAS,MAAM,MAAM;GAC5B,CAAA;EAED,MAAM,gBAAgB,gBAAgB;GACpC,OAAO,MAAM,cAAc,aAAa,SAAS,GAAG,MAAM,MAAM;GAChE,QAAQ,MAAM,cAAc,aAAa,GAAG,MAAM,OAAO,MAAM;GAC/D,WACE,MAAM,cAAc,aAChB,cAAc,MAAM,WAAW,OAC/B,cAAc,MAAM,WAAW;GACrC,SAAS,MAAM,SAAS,UAAU;GACnC,EAAC;EAEF,MAAM,cAAc,eAAe;GACjC,GAAG,EAAE,gBAAgB;GACrB,GAAG,GAAG,YAAY,YAAY,UAAU,MAAM,WAAW,CAAC,CAAC;GAC3D,GAAG,GAAG,iBAAiB,MAAM,aAAa;GAC3C,CAAA;EAED,MAAM,OAAO,eAAe;AAC1B,UAAO,MAAM,QAAQ,YAAY;IAClC;AAED,oBAAkB,cAAc,aAAY;AAE5C,QAAM,eAAe,aAAY;AAEjC,cACQ,MAAM,kBACN;AACJ,iBAAa;AACb,OAAI,MAAM,cACR,WAAU,WAAW,SAAS,CAAC,MAAM,KAAI;KAG7C,EACE,OAAO,QACT,CACF;;UAlMU,QAAA,QAAQ,uBADhB,mBA6BM,OAAA;;IA3BH,IAAI,MAAA,QAAO;aACR;IAAJ,KAAI;IACH,OAAK,eAAE,aAAA,MAAY;IACpB,MAAK;IACJ,cAAU,CAAG,MAAA,oBAAmB,GAAG,QAAA,aAAS,cAAkB;IAC9D,mBAAiB,MAAA,oBAAmB,GAAG,MAAA,SAAQ,CAAE,UAAU;OAE5D,mBAmBM,OAAA,EAnBA,OAAK,eAAA,CAAG,MAAA,GAAE,CAAC,EAAC,QAAA,EAAW,MAAA,GAAE,CAAC,EAAE,QAAA,UAAS,CAAA,CAAA,KACzC,mBAAmD,OAAA;IAA7C,OAAK,eAAE,cAAA,MAAa;IAAG,OAAK,eAAE,YAAA,MAAW;kCAC/C,mBAgBQ,UAAA,MAAA,WAfkB,QAAA,UAAhB,MAAM,UAAK;wBADrB,mBAgBQ,SAAA;KAdL,KAAK;KACL,OAAK,eAAE,WAAW,KAAI,CAAA;QAEvB,mBAOE,SAAA;KANC,OAAK,eAAE,MAAA,GAAE,CAAC,EAAC,aAAA,CAAA;KACZ,MAAK;KACJ,MAAM,KAAA;KACN,UAAU,YAAY,KAAI;KAC1B,SAAS,YAAY,KAAI;KACzB,WAAM,WAAE,aAAa,QAAQ,KAAI;8BAEpC,mBAEM,OAAA,EAFA,OAAK,eAAE,MAAA,GAAE,CAAC,EAAC,aAAA,CAAA,KACf,WAA8C,KAAA,QAAA,WAAA,EAAjC,MAAI,QAA6B,iCAAxB,SAAS,KAAI,CAAA,EAAA,EAAA"}
+{"version":3,"file":"segmented.vue_vue_type_script_setup_true_lang.mjs","names":[],"sources":["../../../../../../packages/components/segmented/src/segmented.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"options.length\"\n    :id=\"inputId\"\n    ref=\"segmentedRef\"\n    :class=\"segmentedCls\"\n    role=\"radiogroup\"\n    :aria-label=\"!isLabeledByFormItem ? ariaLabel || 'segmented' : undefined\"\n    :aria-labelledby=\"isLabeledByFormItem ? formItem!.labelId : undefined\"\n  >\n    <div :class=\"[ns.e('group'), ns.m(direction)]\">\n      <div :style=\"selectedStyle\" :class=\"selectedCls\" />\n      <label\n        v-for=\"(item, index) in options\"\n        :key=\"index\"\n        :class=\"getItemCls(item)\"\n      >\n        <input\n          :class=\"ns.e('item-input')\"\n          type=\"radio\"\n          :name=\"name\"\n          :disabled=\"getDisabled(item)\"\n          :checked=\"getSelected(item)\"\n          @change=\"handleChange($event, item)\"\n        />\n        <div :class=\"ns.e('item-label')\">\n          <slot :item=\"item\">{{ getLabel(item) }}</slot>\n        </div>\n      </label>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup generic=\"T extends Option = Option\">\nimport { computed, reactive, ref, watch } from 'vue'\nimport { useActiveElement, useResizeObserver } from '@vueuse/core'\nimport { useId, useNamespace } from '@element-plus/hooks'\nimport {\n  useFormDisabled,\n  useFormItem,\n  useFormItemInputId,\n  useFormSize,\n} from '@element-plus/components/form'\nimport { NOOP, isObject } from '@element-plus/utils'\nimport { CHANGE_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport { defaultProps, segmentedEmits } from './segmented'\n\nimport type { Option } from './types'\nimport type { SegmentedProps } from './segmented'\n\ndefineOptions({\n  name: 'ElSegmented',\n})\n\nconst props = withDefaults(defineProps<SegmentedProps<T>>(), {\n  direction: 'horizontal',\n  options: () => [],\n  props: () => defaultProps,\n  validateEvent: true,\n  modelValue: undefined,\n  disabled: undefined,\n})\nconst emit = defineEmits(segmentedEmits)\n\nconst ns = useNamespace('segmented')\nconst segmentedId = useId()\nconst segmentedSize = useFormSize()\nconst _disabled = useFormDisabled()\nconst { formItem } = useFormItem()\nconst { inputId, isLabeledByFormItem } = useFormItemInputId(props, {\n  formItemContext: formItem,\n})\n\nconst segmentedRef = ref<HTMLElement | null>(null)\nconst activeElement = useActiveElement()\n\nconst state = reactive({\n  isInit: false,\n  width: 0,\n  height: 0,\n  translateX: 0,\n  translateY: 0,\n  focusVisible: false,\n})\n\nconst handleChange = (evt: Event, item: T) => {\n  const value = getValue(item)\n  emit(UPDATE_MODEL_EVENT, value)\n  emit(CHANGE_EVENT, value)\n  ;(evt.target as HTMLInputElement).checked = value === props.modelValue\n}\n\nconst aliasProps = computed(() => ({ ...defaultProps, ...props.props }))\n\nconst getValue = (item: T) => {\n  return isObject(item) ? item[aliasProps.value.value] : item\n}\n\nconst getLabel = (item: T) => {\n  return isObject(item) ? item[aliasProps.value.label] : item\n}\n\nconst getDisabled = (item: T | undefined) => {\n  return !!(\n    _disabled.value ||\n    (isObject(item) ? item[aliasProps.value.disabled] : false)\n  )\n}\n\nconst getSelected = (item: T) => {\n  return props.modelValue === getValue(item)\n}\n\nconst getOption = (value: any) => {\n  return props.options.find((item) => getValue(item) === value)\n}\n\nconst getItemCls = (item: T) => {\n  return [\n    ns.e('item'),\n    ns.is('selected', getSelected(item)),\n    ns.is('disabled', getDisabled(item)),\n  ]\n}\n\nconst updateSelect = () => {\n  if (!segmentedRef.value) return\n  const selectedItem = segmentedRef.value.querySelector(\n    '.is-selected'\n  ) as HTMLElement\n  const selectedItemInput = segmentedRef.value.querySelector(\n    '.is-selected input'\n  ) as HTMLElement\n  if (!selectedItem || !selectedItemInput) {\n    state.width = 0\n    state.height = 0\n    state.translateX = 0\n    state.translateY = 0\n    state.focusVisible = false\n    return\n  }\n  state.isInit = true\n  if (props.direction === 'vertical') {\n    state.height = selectedItem.offsetHeight\n    state.translateY = selectedItem.offsetTop\n  } else {\n    state.width = selectedItem.offsetWidth\n    state.translateX = selectedItem.offsetLeft\n  }\n  try {\n    // This will failed in test\n    state.focusVisible = selectedItemInput.matches(':focus-visible')\n  } catch {}\n}\n\nconst segmentedCls = computed(() => [\n  ns.b(),\n  ns.m(segmentedSize.value),\n  ns.is('block', props.block),\n])\n\nconst selectedStyle = computed(() => ({\n  width: props.direction === 'vertical' ? '100%' : `${state.width}px`,\n  height: props.direction === 'vertical' ? `${state.height}px` : '100%',\n  transform:\n    props.direction === 'vertical'\n      ? `translateY(${state.translateY}px)`\n      : `translateX(${state.translateX}px)`,\n  display: state.isInit ? 'block' : 'none',\n}))\n\nconst selectedCls = computed(() => [\n  ns.e('item-selected'),\n  ns.is('disabled', getDisabled(getOption(props.modelValue))),\n  ns.is('focus-visible', state.focusVisible),\n])\n\nconst name = computed(() => {\n  return props.name || segmentedId.value\n})\n\nuseResizeObserver(segmentedRef, updateSelect)\n\nwatch(activeElement, updateSelect)\n\nwatch(() => props.options, updateSelect, { deep: true, flush: 'post' })\n\nwatch(\n  () => props.modelValue,\n  () => {\n    updateSelect()\n    if (props.validateEvent) {\n      formItem?.validate?.('change').catch(NOOP)\n    }\n  },\n  {\n    flush: 'post',\n  }\n)\n</script>\n"],"mappings":"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"}