element-plus 1.2.0-beta.2 → 1.2.0-beta.3

package/dist/index.full.js

@@ -1,4 +1,4 @@
-/*! Element Plus v1.2.0-beta.2 */
+/*! Element Plus v1.2.0-beta.3 */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
@@ -6043,6 +6043,8 @@
 
   const configProviderContextKey = Symbol();
 
+  const radioGroupKey = Symbol("radioGroupKey");
+
   const sizes = ["", "large", "medium", "small", "mini"];
   const useFormItemProps = buildProps({
     size: {
@@ -6065,7 +6067,9 @@
       }),
       disabled: vue.computed(() => {
         return props.disabled === true || vue.unref(disabled) || (form == null ? void 0 : form.disabled) || false;
-      })
+      }),
+      form,
+      formItem
     };
   };
 
@@ -6099,7 +6103,7 @@
     return vue.inject(configProviderContextKey, defaultConfig);
   };
 
-  const version$1 = "1.2.0-beta.2";
+  const version$1 = "1.2.0-beta.3";
 
   const makeInstaller = (components = []) => {
     const apps = [];
@@ -13799,6 +13803,7 @@
       type: [String, Number],
       default: void 0
     },
+    tabindex: [String, Number],
     size: String
   };
   const useCheckboxGroup = () => {
@@ -13986,7 +13991,8 @@
       size: {
         type: String,
         validator: isValidComponentSize
-      }
+      },
+      tabindex: [String, Number]
     },
     emits: [UPDATE_MODEL_EVENT, "change"],
     setup(props) {
@@ -13997,8 +14003,8 @@
   const _hoisted_1$13 = ["id", "aria-controls"];
   const _hoisted_2$N = ["tabindex", "role", "aria-checked"];
   const _hoisted_3$E = /* @__PURE__ */ vue.createElementVNode("span", { class: "el-checkbox__inner" }, null, -1);
-  const _hoisted_4$t = ["aria-hidden", "name", "disabled", "true-value", "false-value"];
-  const _hoisted_5$l = ["aria-hidden", "disabled", "value", "name"];
+  const _hoisted_4$t = ["aria-hidden", "name", "tabindex", "disabled", "true-value", "false-value"];
+  const _hoisted_5$l = ["aria-hidden", "disabled", "value", "name", "tabindex"];
   const _hoisted_6$f = {
     key: 0,
     class: "el-checkbox__label"
@@ -14033,6 +14039,7 @@
           type: "checkbox",
           "aria-hidden": _ctx.indeterminate ? "true" : "false",
           name: _ctx.name,
+          tabindex: _ctx.tabindex,
           disabled: _ctx.isDisabled,
           "true-value": _ctx.trueLabel,
           "false-value": _ctx.falseLabel,
@@ -14050,6 +14057,7 @@
           disabled: _ctx.isDisabled,
           value: _ctx.label,
           name: _ctx.name,
+          tabindex: _ctx.tabindex,
           onChange: _cache[5] || (_cache[5] = (...args) => _ctx.handleChange && _ctx.handleChange(...args)),
           onFocus: _cache[6] || (_cache[6] = ($event) => _ctx.focus = true),
           onBlur: _cache[7] || (_cache[7] = ($event) => _ctx.focus = false)
@@ -14099,8 +14107,8 @@
   });
 
   const _hoisted_1$12 = ["aria-checked", "aria-disabled"];
-  const _hoisted_2$M = ["name", "disabled", "true-value", "false-value"];
-  const _hoisted_3$D = ["name", "disabled", "value"];
+  const _hoisted_2$M = ["name", "tabindex", "disabled", "true-value", "false-value"];
+  const _hoisted_3$D = ["name", "tabindex", "disabled", "value"];
   function render$1t(_ctx, _cache, $props, $setup, $data, $options) {
     return vue.openBlock(), vue.createElementBlock("label", {
       class: vue.normalizeClass(["el-checkbox-button", [
@@ -14119,6 +14127,7 @@
         class: "el-checkbox-button__original",
         type: "checkbox",
         name: _ctx.name,
+        tabindex: _ctx.tabindex,
         disabled: _ctx.isDisabled,
         "true-value": _ctx.trueLabel,
         "false-value": _ctx.falseLabel,
@@ -14133,6 +14142,7 @@
         class: "el-checkbox-button__original",
         type: "checkbox",
         name: _ctx.name,
+        tabindex: _ctx.tabindex,
         disabled: _ctx.isDisabled,
         value: _ctx.label,
         onChange: _cache[5] || (_cache[5] = (...args) => _ctx.handleChange && _ctx.handleChange(...args)),
@@ -14238,103 +14248,84 @@
   const ElCheckboxButton = withNoopInstall(script$1A);
   const ElCheckboxGroup$1 = withNoopInstall(script$1z);
 
-  const radioGroupKey = "RadioGroup";
-  var radioGroupKey$1 = radioGroupKey;
-
-  const useRadio = () => {
-    const ELEMENT = useGlobalConfig$1();
-    const elForm = vue.inject(elFormKey, {});
-    const elFormItem = vue.inject(elFormItemKey, {});
-    const radioGroup = vue.inject(radioGroupKey$1, {});
-    const focus = vue.ref(false);
-    const isGroup = vue.computed(() => (radioGroup == null ? void 0 : radioGroup.name) === "ElRadioGroup");
-    const elFormItemSize = vue.computed(() => elFormItem.size || ELEMENT.size);
-    return {
-      isGroup,
-      focus,
-      radioGroup,
-      elForm,
-      ELEMENT,
-      elFormItemSize
-    };
+  const radioPropsBase = buildProps({
+    ...useFormItemProps,
+    label: {
+      type: [String, Number, Boolean],
+      default: ""
+    }
+  });
+  const radioProps = buildProps({
+    ...radioPropsBase,
+    modelValue: {
+      type: [String, Number, Boolean],
+      default: ""
+    },
+    name: {
+      type: String,
+      default: ""
+    },
+    border: Boolean
+  });
+  const radioEmits = {
+    [UPDATE_MODEL_EVENT]: (val) => isString$1(val) || isNumber(val) || isBool(val),
+    change: (val) => isString$1(val) || isNumber(val) || isBool(val)
   };
-  const useRadioAttrs = (props, { isGroup, radioGroup, elForm, model }) => {
-    const isDisabled = vue.computed(() => {
-      return isGroup.value ? radioGroup.disabled || props.disabled || elForm.disabled : props.disabled || elForm.disabled;
+  const useRadio = (props, emit) => {
+    const radioRef = vue.ref();
+    const radioGroup = vue.inject(radioGroupKey, void 0);
+    const isGroup = vue.computed(() => !!radioGroup);
+    const modelValue = vue.computed({
+      get() {
+        return isGroup.value ? radioGroup.modelValue : props.modelValue;
+      },
+      set(val) {
+        if (isGroup.value) {
+          radioGroup.changeEvent(val);
+        } else {
+          emit(UPDATE_MODEL_EVENT, val);
+        }
+        radioRef.value.checked = props.modelValue === props.label;
+      }
+    });
+    const { size, disabled } = useFormItem({
+      size: vue.computed(() => radioGroup == null ? void 0 : radioGroup.size),
+      disabled: vue.computed(() => radioGroup == null ? void 0 : radioGroup.disabled)
     });
+    const focus = vue.ref(false);
     const tabIndex = vue.computed(() => {
-      return isDisabled.value || isGroup.value && model.value !== props.label ? -1 : 0;
+      return disabled.value || isGroup.value && modelValue.value !== props.label ? -1 : 0;
     });
     return {
-      isDisabled,
-      tabIndex
+      radioRef,
+      isGroup,
+      radioGroup,
+      focus,
+      size,
+      disabled,
+      tabIndex,
+      modelValue
     };
   };
 
   var script$1y = vue.defineComponent({
     name: "ElRadio",
-    componentName: "ElRadio",
-    props: {
-      modelValue: {
-        type: [String, Number, Boolean],
-        default: ""
-      },
-      label: {
-        type: [String, Number, Boolean],
-        default: ""
-      },
-      disabled: Boolean,
-      name: {
-        type: String,
-        default: ""
-      },
-      border: Boolean,
-      size: {
-        type: String,
-        validator: isValidComponentSize
-      }
-    },
-    emits: [UPDATE_MODEL_EVENT, "change"],
-    setup(props, ctx) {
-      const { isGroup, radioGroup, elFormItemSize, ELEMENT, focus, elForm } = useRadio();
-      const radioRef = vue.ref();
-      const model = vue.computed({
-        get() {
-          return isGroup.value ? radioGroup.modelValue : props.modelValue;
-        },
-        set(val) {
-          if (isGroup.value) {
-            radioGroup.changeEvent(val);
-          } else {
-            ctx.emit(UPDATE_MODEL_EVENT, val);
-          }
-          radioRef.value.checked = props.modelValue === props.label;
-        }
-      });
-      const { tabIndex, isDisabled } = useRadioAttrs(props, {
-        isGroup,
-        radioGroup,
-        elForm,
-        model
-      });
-      const radioSize = vue.computed(() => {
-        const temRadioSize = props.size || elFormItemSize.value || ELEMENT.size;
-        return isGroup.value ? radioGroup.radioGroupSize || temRadioSize : temRadioSize;
-      });
+    props: radioProps,
+    emits: radioEmits,
+    setup(props, { emit }) {
+      const { radioRef, isGroup, focus, size, disabled, tabIndex, modelValue } = useRadio(props, emit);
       function handleChange() {
-        vue.nextTick(() => {
-          ctx.emit("change", model.value);
-        });
+        vue.nextTick(() => emit("change", modelValue.value));
       }
       return {
         focus,
         isGroup,
-        isDisabled,
-        model,
+        modelValue,
         tabIndex,
-        radioSize,
-        handleChange,
-        radioRef
+        size,
+        disabled,
+        radioRef,
+        handleChange
       };
     }
   });
@@ -14345,40 +14336,40 @@
   function render$1r(_ctx, _cache, $props, $setup, $data, $options) {
     return vue.openBlock(), vue.createElementBlock("label", {
       class: vue.normalizeClass(["el-radio", {
-        [`el-radio--${_ctx.radioSize || ""}`]: _ctx.radioSize,
-        "is-disabled": _ctx.isDisabled,
+        [`el-radio--${_ctx.size || ""}`]: _ctx.size,
+        "is-disabled": _ctx.disabled,
         "is-focus": _ctx.focus,
         "is-bordered": _ctx.border,
-        "is-checked": _ctx.model === _ctx.label
+        "is-checked": _ctx.modelValue === _ctx.label
       }]),
       role: "radio",
-      "aria-checked": _ctx.model === _ctx.label,
-      "aria-disabled": _ctx.isDisabled,
+      "aria-checked": _ctx.modelValue === _ctx.label,
+      "aria-disabled": _ctx.disabled,
       tabindex: _ctx.tabIndex,
-      onKeydown: _cache[5] || (_cache[5] = vue.withKeys(vue.withModifiers(($event) => _ctx.model = _ctx.isDisabled ? _ctx.model : _ctx.label, ["stop", "prevent"]), ["space"]))
+      onKeydown: _cache[5] || (_cache[5] = vue.withKeys(vue.withModifiers(($event) => _ctx.modelValue = _ctx.disabled ? _ctx.modelValue : _ctx.label, ["stop", "prevent"]), ["space"]))
     }, [
       vue.createElementVNode("span", {
         class: vue.normalizeClass(["el-radio__input", {
-          "is-disabled": _ctx.isDisabled,
-          "is-checked": _ctx.model === _ctx.label
+          "is-disabled": _ctx.disabled,
+          "is-checked": _ctx.modelValue === _ctx.label
         }])
       }, [
         _hoisted_2$L,
         vue.withDirectives(vue.createElementVNode("input", {
           ref: "radioRef",
-          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.model = $event),
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.modelValue = $event),
           class: "el-radio__original",
           value: _ctx.label,
           type: "radio",
           "aria-hidden": "true",
           name: _ctx.name,
-          disabled: _ctx.isDisabled,
+          disabled: _ctx.disabled,
           tabindex: "-1",
           onFocus: _cache[1] || (_cache[1] = ($event) => _ctx.focus = true),
           onBlur: _cache[2] || (_cache[2] = ($event) => _ctx.focus = false),
           onChange: _cache[3] || (_cache[3] = (...args) => _ctx.handleChange && _ctx.handleChange(...args))
         }, null, 40, _hoisted_3$C), [
-          [vue.vModelRadio, _ctx.model]
+          [vue.vModelRadio, _ctx.modelValue]
         ])
       ], 2),
       vue.createElementVNode("span", {
@@ -14396,54 +14387,42 @@
   script$1y.render = render$1r;
   script$1y.__file = "packages/components/radio/src/radio.vue";
 
+  const radioButtonProps = buildProps({
+    ...radioPropsBase,
+    name: {
+      type: String,
+      default: ""
+    }
+  });
+
   var script$1x = vue.defineComponent({
     name: "ElRadioButton",
-    props: {
-      label: {
-        type: [String, Number, Boolean],
-        default: ""
-      },
-      disabled: Boolean,
-      name: {
-        type: String,
-        default: ""
-      }
-    },
-    setup(props) {
-      const { isGroup, radioGroup, elFormItemSize, ELEMENT, focus, elForm } = useRadio();
-      const size = vue.computed(() => {
-        return radioGroup.radioGroupSize || elFormItemSize.value || ELEMENT.size;
-      });
-      const radioRef = vue.ref();
-      const value = vue.computed({
-        get() {
-          return radioGroup.modelValue;
-        },
-        set(value2) {
-          radioGroup.changeEvent(value2);
-          radioRef.value.checked = radioGroup.modelValue === props.label;
-        }
-      });
-      const { isDisabled, tabIndex } = useRadioAttrs(props, {
-        model: value,
-        elForm,
-        radioGroup,
-        isGroup
-      });
+    props: radioButtonProps,
+    setup(props, { emit }) {
+      const {
+        radioRef,
+        isGroup,
+        focus,
+        size,
+        disabled,
+        tabIndex,
+        modelValue,
+        radioGroup
+      } = useRadio(props, emit);
       const activeStyle = vue.computed(() => {
         return {
-          backgroundColor: radioGroup.fill || "",
-          borderColor: radioGroup.fill || "",
-          boxShadow: radioGroup.fill ? `-1px 0 0 0 ${radioGroup.fill}` : "",
-          color: radioGroup.textColor || ""
+          backgroundColor: (radioGroup == null ? void 0 : radioGroup.fill) || "",
+          borderColor: (radioGroup == null ? void 0 : radioGroup.fill) || "",
+          boxShadow: (radioGroup == null ? void 0 : radioGroup.fill) ? `-1px 0 0 0 ${radioGroup.fill}` : "",
+          color: (radioGroup == null ? void 0 : radioGroup.textColor) || ""
         };
       });
       return {
         isGroup,
         size,
-        isDisabled,
+        disabled,
         tabIndex,
-        value,
+        modelValue,
         focus,
         activeStyle,
         radioRef
@@ -14458,34 +14437,34 @@
       class: vue.normalizeClass(["el-radio-button", [
         _ctx.size ? "el-radio-button--" + _ctx.size : "",
         {
-          "is-active": _ctx.value === _ctx.label,
-          "is-disabled": _ctx.isDisabled,
+          "is-active": _ctx.modelValue === _ctx.label,
+          "is-disabled": _ctx.disabled,
           "is-focus": _ctx.focus
         }
       ]]),
       role: "radio",
-      "aria-checked": _ctx.value === _ctx.label,
-      "aria-disabled": _ctx.isDisabled,
+      "aria-checked": _ctx.modelValue === _ctx.label,
+      "aria-disabled": _ctx.disabled,
       tabindex: _ctx.tabIndex,
-      onKeydown: _cache[4] || (_cache[4] = vue.withKeys(vue.withModifiers(($event) => _ctx.value = _ctx.isDisabled ? _ctx.value : _ctx.label, ["stop", "prevent"]), ["space"]))
+      onKeydown: _cache[4] || (_cache[4] = vue.withKeys(vue.withModifiers(($event) => _ctx.modelValue = _ctx.disabled ? _ctx.modelValue : _ctx.label, ["stop", "prevent"]), ["space"]))
     }, [
       vue.withDirectives(vue.createElementVNode("input", {
         ref: "radioRef",
-        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.value = $event),
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.modelValue = $event),
         class: "el-radio-button__original-radio",
         value: _ctx.label,
         type: "radio",
         name: _ctx.name,
-        disabled: _ctx.isDisabled,
+        disabled: _ctx.disabled,
         tabindex: "-1",
         onFocus: _cache[1] || (_cache[1] = ($event) => _ctx.focus = true),
         onBlur: _cache[2] || (_cache[2] = ($event) => _ctx.focus = false)
       }, null, 40, _hoisted_2$K), [
-        [vue.vModelRadio, _ctx.value]
+        [vue.vModelRadio, _ctx.modelValue]
       ]),
       vue.createElementVNode("span", {
         class: "el-radio-button__inner",
-        style: vue.normalizeStyle(_ctx.value === _ctx.label ? _ctx.activeStyle : null),
+        style: vue.normalizeStyle(_ctx.modelValue === _ctx.label ? _ctx.activeStyle : {}),
         onKeydown: _cache[3] || (_cache[3] = vue.withModifiers(() => {
         }, ["stop"]))
       }, [
@@ -14499,58 +14478,43 @@
   script$1x.render = render$1q;
   script$1x.__file = "packages/components/radio/src/radio-button.vue";
 
+  const radioGroupProps = buildProps({
+    ...useFormItemProps,
+    modelValue: {
+      type: [String, Number, Boolean],
+      default: ""
+    },
+    fill: {
+      type: String,
+      default: ""
+    },
+    textColor: {
+      type: String,
+      default: ""
+    }
+  });
+  const radioGroupEmits = radioEmits;
+
   var script$1w = vue.defineComponent({
     name: "ElRadioGroup",
-    componentName: "ElRadioGroup",
-    props: {
-      modelValue: {
-        type: [String, Number, Boolean],
-        default: ""
-      },
-      size: {
-        type: String,
-        validator: isValidComponentSize
-      },
-      fill: {
-        type: String,
-        default: ""
-      },
-      textColor: {
-        type: String,
-        default: ""
-      },
-      disabled: Boolean
-    },
-    emits: [UPDATE_MODEL_EVENT, "change"],
+    props: radioGroupProps,
+    emits: radioGroupEmits,
     setup(props, ctx) {
-      const radioGroup = vue.ref(null);
-      const elFormItem = vue.inject(elFormItemKey, {});
-      const radioGroupSize = vue.computed(() => {
-        return props.size || elFormItem.size;
-      });
+      const radioGroupRef = vue.ref();
+      const { size, disabled, formItem } = useFormItem({});
       const changeEvent = (value) => {
         ctx.emit(UPDATE_MODEL_EVENT, value);
-        vue.nextTick(() => {
-          ctx.emit("change", value);
-        });
+        vue.nextTick(() => ctx.emit("change", value));
       };
-      vue.provide(radioGroupKey$1, vue.reactive({
-        name: "ElRadioGroup",
-        ...vue.toRefs(props),
-        radioGroupSize,
-        changeEvent
-      }));
-      vue.watch(() => props.modelValue, () => {
-        var _a;
-        (_a = elFormItem.validate) == null ? void 0 : _a.call(elFormItem, "change");
-      });
       const handleKeydown = (e) => {
+        if (!radioGroupRef.value)
+          return;
         const target = e.target;
         const className = target.nodeName === "INPUT" ? "[type=radio]" : "[role=radio]";
-        const radios = radioGroup.value.querySelectorAll(className);
+        const radios = radioGroupRef.value.querySelectorAll(className);
         const length = radios.length;
         const index = Array.from(radios).indexOf(target);
-        const roleRadios = radioGroup.value.querySelectorAll("[role=radio]");
+        const roleRadios = radioGroupRef.value.querySelectorAll("[role=radio]");
         let nextIndex = null;
         switch (e.code) {
           case EVENT_CODE.left:
@@ -14572,23 +14536,29 @@
         roleRadios[nextIndex].focus();
       };
       vue.onMounted(() => {
-        const radios = radioGroup.value.querySelectorAll("[type=radio]");
+        const radios = radioGroupRef.value.querySelectorAll("[type=radio]");
         const firstLabel = radios[0];
         if (!Array.from(radios).some((radio) => radio.checked) && firstLabel) {
           firstLabel.tabIndex = 0;
         }
       });
+      vue.provide(radioGroupKey, vue.reactive({
+        ...vue.toRefs(props),
+        changeEvent
+      }));
+      vue.watch(() => props.modelValue, () => formItem == null ? void 0 : formItem.validate("change"));
       return {
-        handleKeydown,
-        radioGroupSize,
-        radioGroup
+        size,
+        disabled,
+        radioGroupRef,
+        handleKeydown
       };
     }
   });
 
   function render$1p(_ctx, _cache, $props, $setup, $data, $options) {
     return vue.openBlock(), vue.createElementBlock("div", {
-      ref: "radioGroup",
+      ref: "radioGroupRef",
       class: "el-radio-group",
       role: "radiogroup",
       onKeydown: _cache[0] || (_cache[0] = (...args) => _ctx.handleKeydown && _ctx.handleKeydown(...args))
@@ -14980,7 +14950,7 @@
       const { data, config, childrenData, loaded } = this;
       const { lazy, leaf } = config;
       const isLeaf = isFunction$3(leaf) ? leaf(data, this) : data[leaf];
-      return isUndefined(isLeaf) ? lazy && !loaded ? false : !Array.isArray(childrenData) : !!isLeaf;
+      return isUndefined(isLeaf) ? lazy && !loaded ? false : !(Array.isArray(childrenData) && childrenData.length) : !!isLeaf;
     }
     get valueByOption() {
       return this.config.emitPath ? this.pathValues : this.value;
@@ -28729,89 +28699,111 @@
   const _Progress = script$C;
   const ElProgress = _Progress;
 
+  const rateProps = buildProps({
+    modelValue: {
+      type: Number,
+      default: 0
+    },
+    lowThreshold: {
+      type: Number,
+      default: 2
+    },
+    highThreshold: {
+      type: Number,
+      default: 4
+    },
+    max: {
+      type: Number,
+      default: 5
+    },
+    colors: {
+      type: definePropType([Array, Object]),
+      default: () => mutable(["#F7BA2A", "#F7BA2A", "#F7BA2A"])
+    },
+    voidColor: {
+      type: String,
+      default: "#C6D1DE"
+    },
+    disabledVoidColor: {
+      type: String,
+      default: "#EFF2F7"
+    },
+    icons: {
+      type: definePropType([Array, Object]),
+      default: () => [StarFilled, StarFilled, StarFilled]
+    },
+    voidIcon: {
+      type: definePropType([String, Object]),
+      default: () => Star
+    },
+    disabledvoidIcon: {
+      type: definePropType([String, Object]),
+      default: () => StarFilled
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    allowHalf: {
+      type: Boolean,
+      default: false
+    },
+    showText: {
+      type: Boolean,
+      default: false
+    },
+    showScore: {
+      type: Boolean,
+      default: false
+    },
+    textColor: {
+      type: String,
+      default: "#1f2d3d"
+    },
+    texts: {
+      type: definePropType([Array]),
+      default: () => mutable([
+        "Extremely bad",
+        "Disappointed",
+        "Fair",
+        "Satisfied",
+        "Surprise"
+      ])
+    },
+    scoreTemplate: {
+      type: String,
+      default: "{value}"
+    }
+  });
+  const rateEmits = {
+    change: (value) => typeof value === "number",
+    [UPDATE_MODEL_EVENT]: (value) => typeof value === "number"
+  };
+
+  function getValueFromMap(value, map) {
+    const isExcludedObject = (val) => isObject$a(val);
+    const matchedKeys = Object.keys(map).map((key) => +key).filter((key) => {
+      const val = map[key];
+      const excluded = isExcludedObject(val) ? val.excluded : false;
+      return excluded ? value < key : value <= key;
+    }).sort((a, b) => a - b);
+    const matchedValue = map[matchedKeys[0]];
+    return isExcludedObject(matchedValue) ? matchedValue.value : matchedValue;
+  }
   var script$B = vue.defineComponent({
     name: "ElRate",
-    components: { ElIcon, StarFilled, Star },
-    props: {
-      modelValue: {
-        type: Number,
-        default: 0
-      },
-      lowThreshold: {
-        type: Number,
-        default: 2
-      },
-      highThreshold: {
-        type: Number,
-        default: 4
-      },
-      max: {
-        type: Number,
-        default: 5
-      },
-      colors: {
-        type: [Array, Object],
-        default: () => ["#F7BA2A", "#F7BA2A", "#F7BA2A"]
-      },
-      voidColor: {
-        type: String,
-        default: "#C6D1DE"
-      },
-      disabledVoidColor: {
-        type: String,
-        default: "#EFF2F7"
-      },
-      icons: {
-        type: [Array, Object],
-        default: () => [StarFilled, StarFilled, StarFilled]
-      },
-      voidIcon: {
-        type: [String, Object],
-        default: Star
-      },
-      disabledvoidIcon: {
-        type: [String, Object],
-        default: StarFilled
-      },
-      disabled: {
-        type: Boolean,
-        default: false
-      },
-      allowHalf: {
-        type: Boolean,
-        default: false
-      },
-      showText: {
-        type: Boolean,
-        default: false
-      },
-      showScore: {
-        type: Boolean,
-        default: false
-      },
-      textColor: {
-        type: String,
-        default: "#1f2d3d"
-      },
-      texts: {
-        type: Array,
-        default: () => [
-          "Extremely bad",
-          "Disappointed",
-          "Fair",
-          "Satisfied",
-          "Surprise"
-        ]
-      },
-      scoreTemplate: {
-        type: String,
-        default: "{value}"
-      }
+    components: {
+      ElIcon,
+      StarFilled,
+      Star
     },
-    emits: [UPDATE_MODEL_EVENT, "change"],
+    props: rateProps,
+    emits: rateEmits,
     setup(props, { emit }) {
       const elForm = vue.inject(elFormKey, {});
       const currentValue = vue.ref(props.modelValue);
+      const hoverIndex = vue.ref(-1);
+      const pointerAtLeftHalf = vue.ref(true);
       const rateDisabled = vue.computed(() => props.disabled || elForm.disabled);
       const text = vue.computed(() => {
         let result = "";
@@ -28822,15 +28814,6 @@
         }
         return result;
       });
-      function getValueFromMap(value, map) {
-        const matchedKeys = Object.keys(map).filter((key) => {
-          const val = map[key];
-          const excluded = isObject$a(val) ? val.excluded : false;
-          return excluded ? value < key : value <= key;
-        }).sort((a, b) => a - b);
-        const matchedValue = map[matchedKeys[0]];
-        return isObject$a(matchedValue) ? matchedValue.value || matchedValue : matchedValue || "";
-      }
       const valueDecimal = vue.computed(() => props.modelValue * 100 - Math.floor(props.modelValue) * 100);
       const colorMap = vue.computed(() => isArray$6(props.colors) ? {
         [props.lowThreshold]: props.colors[0],
@@ -28868,11 +28851,6 @@
         result.fill(voidComponent.value, threshold, props.max);
         return result;
       });
-      const pointerAtLeftHalf = vue.ref(true);
-      vue.watch(() => props.modelValue, (val) => {
-        currentValue.value = val;
-        pointerAtLeftHalf.value = props.modelValue !== Math.floor(props.modelValue);
-      });
       function showDecimalIcon(item) {
         const showWhenDisabled = rateDisabled.value && valueDecimal.value > 0 && item - 1 < props.modelValue && item > props.modelValue;
         const showWhenAllowHalf = props.allowHalf && pointerAtLeftHalf.value && item - 0.5 <= currentValue.value && item > currentValue.value;
@@ -28929,7 +28907,6 @@
         emit("change", _currentValue);
         return _currentValue;
       }
-      const hoverIndex = vue.ref(-1);
       function setCurrentValue(value, event) {
         if (rateDisabled.value) {
           return;
@@ -28959,6 +28936,10 @@
         currentValue.value = props.modelValue;
         hoverIndex.value = -1;
       }
+      vue.watch(() => props.modelValue, (val) => {
+        currentValue.value = val;
+        pointerAtLeftHalf.value = props.modelValue !== Math.floor(props.modelValue);
+      });
       if (!props.modelValue) {
         emit(UPDATE_MODEL_EVENT, 0);
       }
@@ -29033,13 +29014,9 @@
   }
 
   script$B.render = render$v;
-  script$B.__file = "packages/components/rate/src/index.vue";
+  script$B.__file = "packages/components/rate/src/rate.vue";
 
-  script$B.install = (app) => {
-    app.component(script$B.name, script$B);
-  };
-  const _Rate = script$B;
-  const ElRate = _Rate;
+  const ElRate = withInstall(script$B);
 
   const IconMap = {
     success: "icon-success",
@@ -29053,22 +29030,24 @@
     [IconMap.error]: CircleCloseFilled,
     [IconMap.info]: InfoFilled
   };
+  const resultProps = buildProps({
+    title: {
+      type: String,
+      default: ""
+    },
+    subTitle: {
+      type: String,
+      default: ""
+    },
+    icon: {
+      values: ["success", "warning", "info", "error"],
+      default: "info"
+    }
+  });
+
   var script$A = vue.defineComponent({
     name: "ElResult",
-    props: {
-      title: {
-        type: String,
-        default: ""
-      },
-      subTitle: {
-        type: String,
-        default: ""
-      },
-      icon: {
-        type: String,
-        default: "info"
-      }
-    },
+    props: resultProps,
     setup(props) {
       const resultIcon = vue.computed(() => {
         const icon = props.icon;
@@ -29126,34 +29105,33 @@
   }
 
   script$A.render = render$u;
-  script$A.__file = "packages/components/result/src/index.vue";
+  script$A.__file = "packages/components/result/src/result.vue";
 
-  script$A.install = (app) => {
-    app.component(script$A.name, script$A);
-  };
-  const _Result = script$A;
-  const ElResult = _Result;
+  const ElResult = withInstall(script$A);
 
+  const rowProps = buildProps({
+    tag: {
+      type: String,
+      default: "div"
+    },
+    gutter: {
+      type: Number,
+      default: 0
+    },
+    justify: {
+      type: String,
+      values: ["start", "center", "end", "space-around", "space-between"],
+      default: "start"
+    },
+    align: {
+      type: String,
+      values: ["top", "middle", "bottom"],
+      default: "top"
+    }
+  });
   var Row = vue.defineComponent({
     name: "ElRow",
-    props: {
-      tag: {
-        type: String,
-        default: "div"
-      },
-      gutter: {
-        type: Number,
-        default: 0
-      },
-      justify: {
-        type: String,
-        default: "start"
-      },
-      align: {
-        type: String,
-        default: "top"
-      }
-    },
+    props: rowProps,
     setup(props, { slots }) {
       const gutter = vue.computed(() => props.gutter);
       vue.provide("ElRow", {
@@ -29184,11 +29162,7 @@
     }
   });
 
-  const _Row = Row;
-  _Row.install = (app) => {
-    app.component(_Row.name, _Row);
-  };
-  const ElRow = _Row;
+  const ElRow = withInstall(Row);
 
   var MapCache = _MapCache;
 
@@ -46109,6 +46083,8 @@
   exports.ElUpload = ElUpload;
   exports.FixedSizeGrid = FixedSizeGrid$3;
   exports.FixedSizeList = FixedSizeList$1;
+  exports.IconComponentMap = IconComponentMap;
+  exports.IconMap = IconMap;
   exports.LIGHT_EFFECT = LIGHT_EFFECT;
   exports.LocaleInjectionKey = LocaleInjectionKey;
   exports.Mousewheel = Mousewheel;
@@ -46181,11 +46157,22 @@
   exports.popconfirmEmits = popconfirmEmits;
   exports.popconfirmProps = popconfirmProps;
   exports.popperDefaultProps = popperDefaultProps;
+  exports.radioButtonProps = radioButtonProps;
+  exports.radioEmits = radioEmits;
+  exports.radioGroupEmits = radioGroupEmits;
+  exports.radioGroupKey = radioGroupKey;
+  exports.radioGroupProps = radioGroupProps;
+  exports.radioProps = radioProps;
+  exports.radioPropsBase = radioPropsBase;
   exports.rangeArr = rangeArr;
+  exports.rateEmits = rateEmits;
+  exports.rateProps = rateProps;
   exports.renderArrow = renderArrow;
   exports.renderPopper = renderPopper;
   exports.renderThumbStyle = renderThumbStyle$1;
   exports.renderTrigger = renderTrigger;
+  exports.resultProps = resultProps;
+  exports.rowProps = rowProps;
   exports.selectGroupKey = selectGroupKey;
   exports.selectKey = selectKey;
   exports.selectV2InjectionKey = selectV2InjectionKey;
@@ -46218,6 +46205,7 @@
   exports.usePopperHook = usePopperHook;
   exports.usePopperProps = usePopperProps;
   exports.usePreventGlobal = usePreventGlobal;
+  exports.useRadio = useRadio;
   exports.useRestoreActive = useRestoreActive;
   exports.useSameTarget = useSameTarget;
   exports.useSpace = useSpace;