rx-compo 1.0.52 → 1.0.54

package/lib/components/RxRadioGroup/index.js

@@ -0,0 +1,1122 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var withInstall$1 = require('rx-compo/lib/utils/with-install');
+var vue = require('vue');
+var vueDemi = require('vue-demi');
+
+const RxRadioGroupProps = {
+    radioGutter: Number,
+    radioSpan: Number,
+    radioGroupData: {
+        type: Array,
+        default: []
+    },
+    value: {
+        type: String,
+        default: ''
+    },
+    radioType: {
+        type: String,
+        default: 'radio'
+    }
+};
+
+var _a;
+const isClient$1 = typeof window !== "undefined";
+isClient$1 && ((_a = window == null ? void 0 : window.navigator) == null ? void 0 : _a.userAgent) && /iP(ad|hone|od)/.test(window.navigator.userAgent);
+
+!!(process.env.NODE_ENV !== "production") ? Object.freeze({}) : {};
+!!(process.env.NODE_ENV !== "production") ? Object.freeze([]) : [];
+const NOOP = () => {
+};
+const hasOwnProperty = Object.prototype.hasOwnProperty;
+const hasOwn = (val, key) => hasOwnProperty.call(val, key);
+const isString = (val) => typeof val === "string";
+const isObject = (val) => val !== null && typeof val === "object";
+
+/**
+ * The inverse of `_.toPairs`; this method returns an object composed
+ * from key-value `pairs`.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Array
+ * @param {Array} pairs The key-value pairs.
+ * @returns {Object} Returns the new object.
+ * @example
+ *
+ * _.fromPairs([['a', 1], ['b', 2]]);
+ * // => { 'a': 1, 'b': 2 }
+ */
+function fromPairs(pairs) {
+  var index = -1,
+      length = pairs == null ? 0 : pairs.length,
+      result = {};
+
+  while (++index < length) {
+    var pair = pairs[index];
+    result[pair[0]] = pair[1];
+  }
+  return result;
+}
+
+const isBoolean = (val) => typeof val === "boolean";
+const isNumber = (val) => typeof val === "number";
+
+class ElementPlusError extends Error {
+  constructor(m) {
+    super(m);
+    this.name = "ElementPlusError";
+  }
+}
+function debugWarn(scope, message) {
+  if (process.env.NODE_ENV !== "production") {
+    const error = isString(scope) ? new ElementPlusError(`[${scope}] ${message}`) : scope;
+    console.warn(error);
+  }
+}
+
+const epPropKey = "__epPropKey";
+const definePropType = (val) => val;
+const isEpProp = (val) => isObject(val) && !!val[epPropKey];
+const buildProp = (prop, key) => {
+  if (!isObject(prop) || isEpProp(prop))
+    return prop;
+  const { values, required, default: defaultValue, type, validator } = prop;
+  const _validator = values || validator ? (val) => {
+    let valid = false;
+    let allowedValues = [];
+    if (values) {
+      allowedValues = Array.from(values);
+      if (hasOwn(prop, "default")) {
+        allowedValues.push(defaultValue);
+      }
+      valid || (valid = allowedValues.includes(val));
+    }
+    if (validator)
+      valid || (valid = validator(val));
+    if (!valid && allowedValues.length > 0) {
+      const allowValuesText = [...new Set(allowedValues)].map((value) => JSON.stringify(value)).join(", ");
+      vue.warn(`Invalid prop: validation failed${key ? ` for prop "${key}"` : ""}. Expected one of [${allowValuesText}], got value ${JSON.stringify(val)}.`);
+    }
+    return valid;
+  } : void 0;
+  const epProp = {
+    type,
+    required: !!required,
+    validator: _validator,
+    [epPropKey]: true
+  };
+  if (hasOwn(prop, "default"))
+    epProp.default = defaultValue;
+  return epProp;
+};
+const buildProps = (props) => fromPairs(Object.entries(props).map(([key, option]) => [
+  key,
+  buildProp(option, key)
+]));
+
+const withInstall = (main, extra) => {
+  main.install = (app) => {
+    for (const comp of [main, ...Object.values(extra != null ? extra : {})]) {
+      app.component(comp.name, comp);
+    }
+  };
+  if (extra) {
+    for (const [key, comp] of Object.entries(extra)) {
+      main[key] = comp;
+    }
+  }
+  return main;
+};
+const withNoopInstall = (component) => {
+  component.install = NOOP;
+  return component;
+};
+
+const UPDATE_MODEL_EVENT = "update:modelValue";
+const CHANGE_EVENT = "change";
+
+const componentSizes = ["", "default", "small", "large"];
+
+const mutable = (val) => val;
+
+const defaultNamespace = "el";
+const statePrefix = "is-";
+const _bem = (namespace, block, blockSuffix, element, modifier) => {
+  let cls = `${namespace}-${block}`;
+  if (blockSuffix) {
+    cls += `-${blockSuffix}`;
+  }
+  if (element) {
+    cls += `__${element}`;
+  }
+  if (modifier) {
+    cls += `--${modifier}`;
+  }
+  return cls;
+};
+const namespaceContextKey = Symbol("namespaceContextKey");
+const useGetDerivedNamespace = (namespaceOverrides) => {
+  const derivedNamespace = namespaceOverrides || vue.inject(namespaceContextKey, vue.ref(defaultNamespace));
+  const namespace = vue.computed(() => {
+    return vue.unref(derivedNamespace) || defaultNamespace;
+  });
+  return namespace;
+};
+const useNamespace = (block, namespaceOverrides) => {
+  const namespace = useGetDerivedNamespace(namespaceOverrides);
+  const b = (blockSuffix = "") => _bem(namespace.value, block, blockSuffix, "", "");
+  const e = (element) => element ? _bem(namespace.value, block, "", element, "") : "";
+  const m = (modifier) => modifier ? _bem(namespace.value, block, "", "", modifier) : "";
+  const be = (blockSuffix, element) => blockSuffix && element ? _bem(namespace.value, block, blockSuffix, element, "") : "";
+  const em = (element, modifier) => element && modifier ? _bem(namespace.value, block, "", element, modifier) : "";
+  const bm = (blockSuffix, modifier) => blockSuffix && modifier ? _bem(namespace.value, block, blockSuffix, "", modifier) : "";
+  const bem = (blockSuffix, element, modifier) => blockSuffix && element && modifier ? _bem(namespace.value, block, blockSuffix, element, modifier) : "";
+  const is = (name, ...args) => {
+    const state = args.length >= 1 ? args[0] : true;
+    return name && state ? `${statePrefix}${name}` : "";
+  };
+  const cssVar = (object) => {
+    const styles = {};
+    for (const key in object) {
+      if (object[key]) {
+        styles[`--${namespace.value}-${key}`] = object[key];
+      }
+    }
+    return styles;
+  };
+  const cssVarBlock = (object) => {
+    const styles = {};
+    for (const key in object) {
+      if (object[key]) {
+        styles[`--${namespace.value}-${block}-${key}`] = object[key];
+      }
+    }
+    return styles;
+  };
+  const cssVarName = (name) => `--${namespace.value}-${name}`;
+  const cssVarBlockName = (name) => `--${namespace.value}-${block}-${name}`;
+  return {
+    namespace,
+    b,
+    e,
+    m,
+    be,
+    em,
+    bm,
+    bem,
+    is,
+    cssVar,
+    cssVarName,
+    cssVarBlock,
+    cssVarBlockName
+  };
+};
+
+const useProp = (name) => {
+  const vm = vue.getCurrentInstance();
+  return vue.computed(() => {
+    var _a, _b;
+    return (_b = (_a = vm == null ? void 0 : vm.proxy) == null ? void 0 : _a.$props) == null ? void 0 : _b[name];
+  });
+};
+
+const defaultIdInjection = {
+  prefix: Math.floor(Math.random() * 1e4),
+  current: 0
+};
+const ID_INJECTION_KEY = Symbol("elIdInjection");
+const useIdInjection = () => {
+  return vue.getCurrentInstance() ? vue.inject(ID_INJECTION_KEY, defaultIdInjection) : defaultIdInjection;
+};
+const useId = (deterministicId) => {
+  const idInjection = useIdInjection();
+  if (!isClient$1 && idInjection === defaultIdInjection) {
+    debugWarn("IdInjection", `Looks like you are using server rendering, you must provide a id provider to ensure the hydration process to be succeed
+usage: app.provide(ID_INJECTION_KEY, {
+  prefix: number,
+  current: number,
+})`);
+  }
+  const namespace = useGetDerivedNamespace();
+  const idRef = vue.computed(() => vue.unref(deterministicId) || `${namespace.value}-id-${idInjection.prefix}-${idInjection.current++}`);
+  return idRef;
+};
+
+const useSizeProp = buildProp({
+  type: String,
+  values: componentSizes,
+  required: false
+});
+const SIZE_INJECTION_KEY = Symbol("size");
+const useGlobalSize = () => {
+  const injectedSize = vue.inject(SIZE_INJECTION_KEY, {});
+  return vue.computed(() => {
+    return vue.unref(injectedSize.size) || "";
+  });
+};
+
+var _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+
+const formContextKey = Symbol("formContextKey");
+const formItemContextKey = Symbol("formItemContextKey");
+
+const useFormSize = (fallback, ignore = {}) => {
+  const emptyRef = vue.ref(void 0);
+  const size = ignore.prop ? emptyRef : useProp("size");
+  const globalConfig = ignore.global ? emptyRef : useGlobalSize();
+  const form = ignore.form ? { size: void 0 } : vue.inject(formContextKey, void 0);
+  const formItem = ignore.formItem ? { size: void 0 } : vue.inject(formItemContextKey, void 0);
+  return vue.computed(() => size.value || vue.unref(fallback) || (formItem == null ? void 0 : formItem.size) || (form == null ? void 0 : form.size) || globalConfig.value || "");
+};
+const useFormDisabled = (fallback) => {
+  const disabled = useProp("disabled");
+  const form = vue.inject(formContextKey, void 0);
+  return vue.computed(() => disabled.value || vue.unref(fallback) || (form == null ? void 0 : form.disabled) || false);
+};
+
+const useFormItem = () => {
+  const form = vue.inject(formContextKey, void 0);
+  const formItem = vue.inject(formItemContextKey, void 0);
+  return {
+    form,
+    formItem
+  };
+};
+const useFormItemInputId = (props, {
+  formItemContext,
+  disableIdGeneration,
+  disableIdManagement
+}) => {
+  if (!disableIdGeneration) {
+    disableIdGeneration = vue.ref(false);
+  }
+  if (!disableIdManagement) {
+    disableIdManagement = vue.ref(false);
+  }
+  const inputId = vue.ref();
+  let idUnwatch = void 0;
+  const isLabeledByFormItem = vue.computed(() => {
+    var _a;
+    return !!(!props.label && formItemContext && formItemContext.inputIds && ((_a = formItemContext.inputIds) == null ? void 0 : _a.length) <= 1);
+  });
+  vue.onMounted(() => {
+    idUnwatch = vue.watch([vue.toRef(props, "id"), disableIdGeneration], ([id, disableIdGeneration2]) => {
+      const newId = id != null ? id : !disableIdGeneration2 ? useId().value : void 0;
+      if (newId !== inputId.value) {
+        if (formItemContext == null ? void 0 : formItemContext.removeInputId) {
+          inputId.value && formItemContext.removeInputId(inputId.value);
+          if (!(disableIdManagement == null ? void 0 : disableIdManagement.value) && !disableIdGeneration2 && newId) {
+            formItemContext.addInputId(newId);
+          }
+        }
+        inputId.value = newId;
+      }
+    }, { immediate: true });
+  });
+  vue.onUnmounted(() => {
+    idUnwatch && idUnwatch();
+    if (formItemContext == null ? void 0 : formItemContext.removeInputId) {
+      inputId.value && formItemContext.removeInputId(inputId.value);
+    }
+  });
+  return {
+    isLabeledByFormItem,
+    inputId
+  };
+};
+
+const radioPropsBase = buildProps({
+  size: useSizeProp,
+  disabled: Boolean,
+  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(val) || isNumber(val) || isBoolean(val),
+  [CHANGE_EVENT]: (val) => isString(val) || isNumber(val) || isBoolean(val)
+};
+
+const radioGroupKey = Symbol("radioGroupKey");
+
+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 && emit(UPDATE_MODEL_EVENT, val);
+      }
+      radioRef.value.checked = props.modelValue === props.label;
+    }
+  });
+  const size = useFormSize(vue.computed(() => radioGroup == null ? void 0 : radioGroup.size));
+  const disabled = useFormDisabled(vue.computed(() => radioGroup == null ? void 0 : radioGroup.disabled));
+  const focus = vue.ref(false);
+  const tabIndex = vue.computed(() => {
+    return disabled.value || isGroup.value && modelValue.value !== props.label ? -1 : 0;
+  });
+  return {
+    radioRef,
+    isGroup,
+    radioGroup,
+    focus,
+    size,
+    disabled,
+    tabIndex,
+    modelValue
+  };
+};
+
+const _hoisted_1$3 = ["value", "name", "disabled"];
+const __default__$4 = vue.defineComponent({
+  name: "ElRadio"
+});
+const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
+  ...__default__$4,
+  props: radioProps,
+  emits: radioEmits,
+  setup(__props, { emit }) {
+    const props = __props;
+    const ns = useNamespace("radio");
+    const { radioRef, radioGroup, focus, size, disabled, modelValue } = useRadio(props, emit);
+    function handleChange() {
+      vue.nextTick(() => emit("change", modelValue.value));
+    }
+    return (_ctx, _cache) => {
+      var _a;
+      return vue.openBlock(), vue.createElementBlock("label", {
+        class: vue.normalizeClass([
+          vue.unref(ns).b(),
+          vue.unref(ns).is("disabled", vue.unref(disabled)),
+          vue.unref(ns).is("focus", vue.unref(focus)),
+          vue.unref(ns).is("bordered", _ctx.border),
+          vue.unref(ns).is("checked", vue.unref(modelValue) === _ctx.label),
+          vue.unref(ns).m(vue.unref(size))
+        ])
+      }, [
+        vue.createElementVNode("span", {
+          class: vue.normalizeClass([
+            vue.unref(ns).e("input"),
+            vue.unref(ns).is("disabled", vue.unref(disabled)),
+            vue.unref(ns).is("checked", vue.unref(modelValue) === _ctx.label)
+          ])
+        }, [
+          vue.withDirectives(vue.createElementVNode("input", {
+            ref_key: "radioRef",
+            ref: radioRef,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => vue.isRef(modelValue) ? modelValue.value = $event : null),
+            class: vue.normalizeClass(vue.unref(ns).e("original")),
+            value: _ctx.label,
+            name: _ctx.name || ((_a = vue.unref(radioGroup)) == null ? void 0 : _a.name),
+            disabled: vue.unref(disabled),
+            type: "radio",
+            onFocus: _cache[1] || (_cache[1] = ($event) => focus.value = true),
+            onBlur: _cache[2] || (_cache[2] = ($event) => focus.value = false),
+            onChange: handleChange
+          }, null, 42, _hoisted_1$3), [
+            [vue.vModelRadio, vue.unref(modelValue)]
+          ]),
+          vue.createElementVNode("span", {
+            class: vue.normalizeClass(vue.unref(ns).e("inner"))
+          }, null, 2)
+        ], 2),
+        vue.createElementVNode("span", {
+          class: vue.normalizeClass(vue.unref(ns).e("label")),
+          onKeydown: _cache[3] || (_cache[3] = vue.withModifiers(() => {
+          }, ["stop"]))
+        }, [
+          vue.renderSlot(_ctx.$slots, "default", {}, () => [
+            vue.createTextVNode(vue.toDisplayString(_ctx.label), 1)
+          ])
+        ], 34)
+      ], 2);
+    };
+  }
+});
+var Radio = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/radio/src/radio.vue"]]);
+
+const radioButtonProps = buildProps({
+  ...radioPropsBase,
+  name: {
+    type: String,
+    default: ""
+  }
+});
+
+const _hoisted_1$2 = ["value", "name", "disabled"];
+const __default__$3 = vue.defineComponent({
+  name: "ElRadioButton"
+});
+const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
+  ...__default__$3,
+  props: radioButtonProps,
+  setup(__props) {
+    const props = __props;
+    const ns = useNamespace("radio");
+    const { radioRef, focus, size, disabled, modelValue, radioGroup } = useRadio(props);
+    const activeStyle = vue.computed(() => {
+      return {
+        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 (_ctx, _cache) => {
+      var _a;
+      return vue.openBlock(), vue.createElementBlock("label", {
+        class: vue.normalizeClass([
+          vue.unref(ns).b("button"),
+          vue.unref(ns).is("active", vue.unref(modelValue) === _ctx.label),
+          vue.unref(ns).is("disabled", vue.unref(disabled)),
+          vue.unref(ns).is("focus", vue.unref(focus)),
+          vue.unref(ns).bm("button", vue.unref(size))
+        ])
+      }, [
+        vue.withDirectives(vue.createElementVNode("input", {
+          ref_key: "radioRef",
+          ref: radioRef,
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => vue.isRef(modelValue) ? modelValue.value = $event : null),
+          class: vue.normalizeClass(vue.unref(ns).be("button", "original-radio")),
+          value: _ctx.label,
+          type: "radio",
+          name: _ctx.name || ((_a = vue.unref(radioGroup)) == null ? void 0 : _a.name),
+          disabled: vue.unref(disabled),
+          onFocus: _cache[1] || (_cache[1] = ($event) => focus.value = true),
+          onBlur: _cache[2] || (_cache[2] = ($event) => focus.value = false)
+        }, null, 42, _hoisted_1$2), [
+          [vue.vModelRadio, vue.unref(modelValue)]
+        ]),
+        vue.createElementVNode("span", {
+          class: vue.normalizeClass(vue.unref(ns).be("button", "inner")),
+          style: vue.normalizeStyle(vue.unref(modelValue) === _ctx.label ? vue.unref(activeStyle) : {}),
+          onKeydown: _cache[3] || (_cache[3] = vue.withModifiers(() => {
+          }, ["stop"]))
+        }, [
+          vue.renderSlot(_ctx.$slots, "default", {}, () => [
+            vue.createTextVNode(vue.toDisplayString(_ctx.label), 1)
+          ])
+        ], 38)
+      ], 2);
+    };
+  }
+});
+var RadioButton = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/radio/src/radio-button.vue"]]);
+
+const radioGroupProps = buildProps({
+  id: {
+    type: String,
+    default: void 0
+  },
+  size: useSizeProp,
+  disabled: Boolean,
+  modelValue: {
+    type: [String, Number, Boolean],
+    default: ""
+  },
+  fill: {
+    type: String,
+    default: ""
+  },
+  label: {
+    type: String,
+    default: void 0
+  },
+  textColor: {
+    type: String,
+    default: ""
+  },
+  name: {
+    type: String,
+    default: void 0
+  },
+  validateEvent: {
+    type: Boolean,
+    default: true
+  }
+});
+const radioGroupEmits = radioEmits;
+
+const _hoisted_1$1 = ["id", "aria-label", "aria-labelledby"];
+const __default__$2 = vue.defineComponent({
+  name: "ElRadioGroup"
+});
+const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
+  ...__default__$2,
+  props: radioGroupProps,
+  emits: radioGroupEmits,
+  setup(__props, { emit }) {
+    const props = __props;
+    const ns = useNamespace("radio");
+    const radioId = useId();
+    const radioGroupRef = vue.ref();
+    const { formItem } = useFormItem();
+    const { inputId: groupId, isLabeledByFormItem } = useFormItemInputId(props, {
+      formItemContext: formItem
+    });
+    const changeEvent = (value) => {
+      emit(UPDATE_MODEL_EVENT, value);
+      vue.nextTick(() => emit("change", value));
+    };
+    vue.onMounted(() => {
+      const radios = radioGroupRef.value.querySelectorAll("[type=radio]");
+      const firstLabel = radios[0];
+      if (!Array.from(radios).some((radio) => radio.checked) && firstLabel) {
+        firstLabel.tabIndex = 0;
+      }
+    });
+    const name = vue.computed(() => {
+      return props.name || radioId.value;
+    });
+    vue.provide(radioGroupKey, vue.reactive({
+      ...vue.toRefs(props),
+      changeEvent,
+      name
+    }));
+    vue.watch(() => props.modelValue, () => {
+      if (props.validateEvent) {
+        formItem == null ? void 0 : formItem.validate("change").catch((err) => debugWarn(err));
+      }
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", {
+        id: vue.unref(groupId),
+        ref_key: "radioGroupRef",
+        ref: radioGroupRef,
+        class: vue.normalizeClass(vue.unref(ns).b("group")),
+        role: "radiogroup",
+        "aria-label": !vue.unref(isLabeledByFormItem) ? _ctx.label || "radio-group" : void 0,
+        "aria-labelledby": vue.unref(isLabeledByFormItem) ? vue.unref(formItem).labelId : void 0
+      }, [
+        vue.renderSlot(_ctx.$slots, "default")
+      ], 10, _hoisted_1$1);
+    };
+  }
+});
+var RadioGroup = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/radio/src/radio-group.vue"]]);
+
+const ElRadio = withInstall(Radio, {
+  RadioButton,
+  RadioGroup
+});
+const ElRadioGroup = withNoopInstall(RadioGroup);
+const ElRadioButton = withNoopInstall(RadioButton);
+
+const rowContextKey = Symbol("rowContextKey");
+
+const RowJustify = [
+  "start",
+  "center",
+  "end",
+  "space-around",
+  "space-between",
+  "space-evenly"
+];
+const RowAlign = ["top", "middle", "bottom"];
+const rowProps = buildProps({
+  tag: {
+    type: String,
+    default: "div"
+  },
+  gutter: {
+    type: Number,
+    default: 0
+  },
+  justify: {
+    type: String,
+    values: RowJustify,
+    default: "start"
+  },
+  align: {
+    type: String,
+    values: RowAlign,
+    default: "top"
+  }
+});
+
+const __default__$1 = vue.defineComponent({
+  name: "ElRow"
+});
+const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
+  ...__default__$1,
+  props: rowProps,
+  setup(__props) {
+    const props = __props;
+    const ns = useNamespace("row");
+    const gutter = vue.computed(() => props.gutter);
+    vue.provide(rowContextKey, {
+      gutter
+    });
+    const style = vue.computed(() => {
+      const styles = {};
+      if (!props.gutter) {
+        return styles;
+      }
+      styles.marginRight = styles.marginLeft = `-${props.gutter / 2}px`;
+      return styles;
+    });
+    const rowKls = vue.computed(() => [
+      ns.b(),
+      ns.is(`justify-${props.justify}`, props.justify !== "start"),
+      ns.is(`align-${props.align}`, props.align !== "top")
+    ]);
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.tag), {
+        class: vue.normalizeClass(vue.unref(rowKls)),
+        style: vue.normalizeStyle(vue.unref(style))
+      }, {
+        default: vue.withCtx(() => [
+          vue.renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 8, ["class", "style"]);
+    };
+  }
+});
+var Row = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/row/src/row.vue"]]);
+
+const ElRow = withInstall(Row);
+
+const colProps = buildProps({
+  tag: {
+    type: String,
+    default: "div"
+  },
+  span: {
+    type: Number,
+    default: 24
+  },
+  offset: {
+    type: Number,
+    default: 0
+  },
+  pull: {
+    type: Number,
+    default: 0
+  },
+  push: {
+    type: Number,
+    default: 0
+  },
+  xs: {
+    type: definePropType([Number, Object]),
+    default: () => mutable({})
+  },
+  sm: {
+    type: definePropType([Number, Object]),
+    default: () => mutable({})
+  },
+  md: {
+    type: definePropType([Number, Object]),
+    default: () => mutable({})
+  },
+  lg: {
+    type: definePropType([Number, Object]),
+    default: () => mutable({})
+  },
+  xl: {
+    type: definePropType([Number, Object]),
+    default: () => mutable({})
+  }
+});
+
+const __default__ = vue.defineComponent({
+  name: "ElCol"
+});
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
+  props: colProps,
+  setup(__props) {
+    const props = __props;
+    const { gutter } = vue.inject(rowContextKey, { gutter: vue.computed(() => 0) });
+    const ns = useNamespace("col");
+    const style = vue.computed(() => {
+      const styles = {};
+      if (gutter.value) {
+        styles.paddingLeft = styles.paddingRight = `${gutter.value / 2}px`;
+      }
+      return styles;
+    });
+    const colKls = vue.computed(() => {
+      const classes = [];
+      const pos = ["span", "offset", "pull", "push"];
+      pos.forEach((prop) => {
+        const size = props[prop];
+        if (isNumber(size)) {
+          if (prop === "span")
+            classes.push(ns.b(`${props[prop]}`));
+          else if (size > 0)
+            classes.push(ns.b(`${prop}-${props[prop]}`));
+        }
+      });
+      const sizes = ["xs", "sm", "md", "lg", "xl"];
+      sizes.forEach((size) => {
+        if (isNumber(props[size])) {
+          classes.push(ns.b(`${size}-${props[size]}`));
+        } else if (isObject(props[size])) {
+          Object.entries(props[size]).forEach(([prop, sizeProp]) => {
+            classes.push(prop !== "span" ? ns.b(`${size}-${prop}-${sizeProp}`) : ns.b(`${size}-${sizeProp}`));
+          });
+        }
+      });
+      if (gutter.value) {
+        classes.push(ns.is("guttered"));
+      }
+      return [ns.b(), classes];
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.tag), {
+        class: vue.normalizeClass(vue.unref(colKls)),
+        style: vue.normalizeStyle(vue.unref(style))
+      }, {
+        default: vue.withCtx(() => [
+          vue.renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 8, ["class", "style"]);
+    };
+  }
+});
+var Col = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/col/src/col.vue"]]);
+
+const ElCol = withInstall(Col);
+
+const RxRadioProps = {};
+
+var script$2 = vue.defineComponent({
+    name: 'RxRadio',
+    components: {
+        ElRadio
+    },
+    props: RxRadioProps,
+    setup() {
+        return {};
+    }
+});
+
+function render$2(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_el_radio = vue.resolveComponent("el-radio");
+
+  return (vue.openBlock(), vue.createBlock(_component_el_radio, vue.mergeProps(_ctx.$props, { class: "rx-radio" }), vue.createSlots({ _: 2 /* DYNAMIC */ }, [
+    (_ctx.$slots.default)
+      ? {
+          name: "default",
+          fn: vue.withCtx(() => [
+            vue.renderSlot(_ctx.$slots, "default")
+          ]),
+          key: "0"
+        }
+      : undefined
+  ]), 1040 /* FULL_PROPS, DYNAMIC_SLOTS */))
+}
+
+script$2.render = render$2;
+script$2.__file = "packages/components/RxRadio/src/index.vue";
+
+const RxRadio = withInstall$1.withInstall(script$2);
+
+const RxRadioButtonProps = {};
+
+var script$1 = vue.defineComponent({
+    name: 'RxRadioButton',
+    components: {
+        ElRadioButton
+    },
+    props: RxRadioButtonProps,
+    setup() {
+        return {};
+    }
+});
+
+function render$1(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_el_radio_button = vue.resolveComponent("el-radio-button");
+
+  return (vue.openBlock(), vue.createBlock(_component_el_radio_button, vue.mergeProps(_ctx.$props, { class: "rx-radio-button" }), vue.createSlots({ _: 2 /* DYNAMIC */ }, [
+    (_ctx.$slots.default)
+      ? {
+          name: "default",
+          fn: vue.withCtx(() => [
+            vue.renderSlot(_ctx.$slots, "default")
+          ]),
+          key: "0"
+        }
+      : undefined
+  ]), 1040 /* FULL_PROPS, DYNAMIC_SLOTS */))
+}
+
+script$1.render = render$1;
+script$1.__file = "packages/components/RxRadioButton/src/index.vue";
+
+const RxRadioButton = withInstall$1.withInstall(script$1);
+
+function useRadioGroup(props) {
+    const radioData = vue.ref();
+    const radioGutter = vue.ref();
+    const radioSpan = vue.ref();
+    const radioType = vue.ref();
+    const isTooltip = vue.ref(true);
+    radioGutter.value = props.radioGutter;
+    radioSpan.value = props.radioSpan;
+    radioData.value = props.radioGroupData;
+    radioType.value = props.radioType;
+    const textOverflow = (e) => {
+        if (e.target.children[1]) {
+            isTooltip.value = e.target.children[1].scrollWidth > e.target.children[1].offsetWidth;
+        }
+    };
+    const textOverflowLeave = () => {
+        isTooltip.value = false;
+    };
+    return {
+        radioGutter,
+        radioSpan,
+        radioData,
+        radioType,
+        isTooltip,
+        textOverflow,
+        textOverflowLeave
+    };
+}
+
+function useTextEllipsis() {
+    const isTooltip = vue.ref(true);
+    const textOverflow = (e) => {
+        const eleDom = e.target.children[1];
+        if (eleDom) {
+            isTooltip.value = eleDom.scrollWidth > eleDom.offsetWidth;
+        }
+    };
+    const textOverflowLeave = () => {
+        isTooltip.value = false;
+    };
+    return {
+        isTooltip,
+        textOverflowLeave,
+        textOverflow
+    };
+}
+
+const isClient = typeof window !== "undefined";
+const isDef = (val) => typeof val !== "undefined";
+
+isClient ? window : void 0;
+isClient ? window.document : void 0;
+isClient ? window.navigator : void 0;
+isClient ? window.location : void 0;
+function cloneFnJSON(source) {
+  return JSON.parse(JSON.stringify(source));
+}
+
+function useVModel(props, key, emit, options = {}) {
+  var _a, _b, _c, _d, _e;
+  const {
+    clone = false,
+    passive = false,
+    eventName,
+    deep = false,
+    defaultValue,
+    shouldEmit
+  } = options;
+  const vm = vueDemi.getCurrentInstance();
+  const _emit = emit || (vm == null ? void 0 : vm.emit) || ((_a = vm == null ? void 0 : vm.$emit) == null ? void 0 : _a.bind(vm)) || ((_c = (_b = vm == null ? void 0 : vm.proxy) == null ? void 0 : _b.$emit) == null ? void 0 : _c.bind(vm == null ? void 0 : vm.proxy));
+  let event = eventName;
+  if (!key) {
+    if (vueDemi.isVue2) {
+      const modelOptions = (_e = (_d = vm == null ? void 0 : vm.proxy) == null ? void 0 : _d.$options) == null ? void 0 : _e.model;
+      key = (modelOptions == null ? void 0 : modelOptions.value) || "value";
+      if (!eventName)
+        event = (modelOptions == null ? void 0 : modelOptions.event) || "input";
+    } else {
+      key = "modelValue";
+    }
+  }
+  event = event || `update:${key.toString()}`;
+  const cloneFn = (val) => !clone ? val : typeof clone === "function" ? clone(val) : cloneFnJSON(val);
+  const getValue = () => isDef(props[key]) ? cloneFn(props[key]) : defaultValue;
+  const triggerEmit = (value) => {
+    if (shouldEmit) {
+      if (shouldEmit(value))
+        _emit(event, value);
+    } else {
+      _emit(event, value);
+    }
+  };
+  if (passive) {
+    const initialValue = getValue();
+    const proxy = vueDemi.ref(initialValue);
+    vueDemi.watch(
+      () => props[key],
+      (v) => proxy.value = cloneFn(v)
+    );
+    vueDemi.watch(
+      proxy,
+      (v) => {
+        if (v !== props[key] || deep)
+          triggerEmit(v);
+      },
+      { deep }
+    );
+    return proxy;
+  } else {
+    return vueDemi.computed({
+      get() {
+        return getValue();
+      },
+      set(value) {
+        triggerEmit(value);
+      }
+    });
+  }
+}
+
+var script = vue.defineComponent({
+    name: 'RxRadioGroup',
+    components: {
+        ElRadioGroup,
+        ElRow,
+        ElCol,
+        RxRadio,
+        RxRadioButton
+    },
+    props: RxRadioGroupProps,
+    setup(props, { emit }) {
+        const radioGroupValue = useVModel(props, 'value', emit);
+        const { radioGutter, radioSpan, radioData, radioType } = useRadioGroup(props);
+        const { isTooltip, textOverflowLeave, textOverflow } = useTextEllipsis();
+        return {
+            radioGutter,
+            radioSpan,
+            radioData,
+            radioGroupValue,
+            radioType,
+            isTooltip,
+            textOverflow,
+            textOverflowLeave
+        };
+    }
+});
+
+const _hoisted_1 = { key: 0 };
+const _hoisted_2 = { class: "rx-radio-group-slot" };
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_rx_radio_button = vue.resolveComponent("rx-radio-button");
+  const _component_rx_radio = vue.resolveComponent("rx-radio");
+  const _component_rx_tooltip = vue.resolveComponent("rx-tooltip");
+  const _component_el_col = vue.resolveComponent("el-col");
+  const _component_el_row = vue.resolveComponent("el-row");
+  const _component_el_radio_group = vue.resolveComponent("el-radio-group");
+
+  return (vue.openBlock(), vue.createBlock(_component_el_radio_group, vue.mergeProps(_ctx.$props, {
+    modelValue: _ctx.radioGroupValue,
+    "onUpdate:modelValue": _cache[2] || (_cache[2] = $event => ((_ctx.radioGroupValue) = $event)),
+    class: "rx-radio-group"
+  }), vue.createSlots({
+    default: vue.withCtx(() => [
+      (_ctx.radioType === 'radio-button')
+        ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.radioData, (item, index) => {
+              return (vue.openBlock(), vue.createBlock(_component_rx_radio_button, {
+                key: index,
+                label: item
+              }, null, 8 /* PROPS */, ["label"]))
+            }), 128 /* KEYED_FRAGMENT */))
+          ]))
+        : (vue.openBlock(), vue.createBlock(_component_el_row, {
+            key: 1,
+            gutter: _ctx.radioGutter
+          }, {
+            default: vue.withCtx(() => [
+              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.radioData, (item, index) => {
+                return (vue.openBlock(), vue.createBlock(_component_el_col, {
+                  span: _ctx.radioSpan,
+                  key: index
+                }, {
+                  default: vue.withCtx(() => [
+                    (_ctx.isTooltip)
+                      ? (vue.openBlock(), vue.createBlock(_component_rx_tooltip, {
+                          key: 0,
+                          content: item,
+                          placement: "bottom"
+                        }, {
+                          default: vue.withCtx(() => [
+                            (vue.openBlock(), vue.createBlock(_component_rx_radio, {
+                              key: item,
+                              label: item,
+                              onMouseenter: _cache[0] || (_cache[0] = $event => (_ctx.textOverflow($event))),
+                              onMouseleave: _ctx.textOverflowLeave
+                            }, null, 8 /* PROPS */, ["label", "onMouseleave"]))
+                          ]),
+                          _: 2 /* DYNAMIC */
+                        }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["content"]))
+                      : vue.createCommentVNode("v-if", true),
+                    (!_ctx.isTooltip)
+                      ? (vue.openBlock(), vue.createBlock(_component_rx_radio, {
+                          key: item,
+                          label: item,
+                          onMouseenter: _cache[1] || (_cache[1] = $event => (_ctx.textOverflow($event))),
+                          onMouseleave: _ctx.textOverflowLeave
+                        }, null, 8 /* PROPS */, ["label", "onMouseleave"]))
+                      : vue.createCommentVNode("v-if", true)
+                  ]),
+                  _: 2 /* DYNAMIC */
+                }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["span"]))
+              }), 128 /* KEYED_FRAGMENT */))
+            ]),
+            _: 1 /* STABLE */
+          }, 8 /* PROPS */, ["gutter"]))
+    ]),
+    _: 2 /* DYNAMIC */
+  }, [
+    (_ctx.$slots.default)
+      ? {
+          name: "default",
+          fn: vue.withCtx(() => [
+            vue.createElementVNode("div", _hoisted_2, [
+              vue.renderSlot(_ctx.$slots, "default")
+            ])
+          ]),
+          key: "0"
+        }
+      : undefined
+  ]), 1040 /* FULL_PROPS, DYNAMIC_SLOTS */, ["modelValue"]))
+}
+
+script.render = render;
+script.__file = "packages/components/RxRadioGroup/src/index.vue";
+
+const RxRadioGroup = withInstall$1.withInstall(script);
+
+exports.RxRadioGroup = RxRadioGroup;
+exports["default"] = RxRadioGroup;