@wfrog/vc-ui 1.0.0

package/dist/es/chunk/D3DXeVfC.mjs

@@ -0,0 +1,1171 @@
+import { inject, computed, getCurrentInstance, watch, nextTick, ref, toRaw, defineComponent, useSlots, createBlock, openBlock, resolveDynamicComponent, unref, normalizeClass, withCtx, createElementVNode, createElementBlock, createCommentVNode, withDirectives, mergeProps, isRef, withModifiers, vModelCheckbox, renderSlot, Fragment, createTextVNode, toDisplayString, normalizeStyle, provide, toRefs, renderList, vModelRadio, onMounted, reactive } from 'vue';
+import { u as useSizeProp } from './CS4VKsqy.mjs';
+import { a as flatRest, u as useAriaProps, p as pick } from './C2LgraHx.mjs';
+import { U as UPDATE_MODEL_EVENT, C as CHANGE_EVENT } from './Ct6q2FXg.mjs';
+import { h as isString, f as isNumber, x as isBoolean, g as isUndefined, e as debugWarn, i as isArray, C as isPropAbsent, s as isObject, u as useNamespace, c as buildProps, d as definePropType } from './E_WRn0OP.mjs';
+import { _ as _export_sfc, a as withNoopInstall, w as withInstall } from './D389hx_T.mjs';
+import { b as formContextKey, u as useId } from './8rLUmOVR.mjs';
+import { b as useFormDisabled, u as useFormItem, c as useFormSize, a as useFormItemInputId } from './DZACQ9LT.mjs';
+import { i as isEqual } from './-EkpfdcW.mjs';
+import { u as useDeprecated } from './VAdRxe-1.mjs';
+import { d as baseGet, e as castPath, t as toKey, a as arrayMap } from './Spa-JKB4.mjs';
+import { g as getPrototype, c as copyObject, a as getAllKeysIn, b as baseClone } from './nWBcrYxV.mjs';
+import { i as isObjectLike, b as baseGetTag } from './Fo0dZYnz.mjs';
+
+/** `Object#toString` result references. */
+var objectTag = '[object Object]';
+
+/** Used for built-in method references. */
+var funcProto = Function.prototype,
+    objectProto = Object.prototype;
+
+/** Used to resolve the decompiled source of functions. */
+var funcToString = funcProto.toString;
+
+/** Used to check objects for own properties. */
+var hasOwnProperty = objectProto.hasOwnProperty;
+
+/** Used to infer the `Object` constructor. */
+var objectCtorString = funcToString.call(Object);
+
+/**
+ * Checks if `value` is a plain object, that is, an object created by the
+ * `Object` constructor or one with a `[[Prototype]]` of `null`.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.8.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a plain object, else `false`.
+ * @example
+ *
+ * function Foo() {
+ *   this.a = 1;
+ * }
+ *
+ * _.isPlainObject(new Foo);
+ * // => false
+ *
+ * _.isPlainObject([1, 2, 3]);
+ * // => false
+ *
+ * _.isPlainObject({ 'x': 0, 'y': 0 });
+ * // => true
+ *
+ * _.isPlainObject(Object.create(null));
+ * // => true
+ */
+function isPlainObject(value) {
+  if (!isObjectLike(value) || baseGetTag(value) != objectTag) {
+    return false;
+  }
+  var proto = getPrototype(value);
+  if (proto === null) {
+    return true;
+  }
+  var Ctor = hasOwnProperty.call(proto, 'constructor') && proto.constructor;
+  return typeof Ctor == 'function' && Ctor instanceof Ctor &&
+    funcToString.call(Ctor) == objectCtorString;
+}
+
+/**
+ * The base implementation of `_.slice` without an iteratee call guard.
+ *
+ * @private
+ * @param {Array} array The array to slice.
+ * @param {number} [start=0] The start position.
+ * @param {number} [end=array.length] The end position.
+ * @returns {Array} Returns the slice of `array`.
+ */
+function baseSlice(array, start, end) {
+  var index = -1,
+      length = array.length;
+
+  if (start < 0) {
+    start = -start > length ? 0 : (length + start);
+  }
+  end = end > length ? length : end;
+  if (end < 0) {
+    end += length;
+  }
+  length = start > end ? 0 : ((end - start) >>> 0);
+  start >>>= 0;
+
+  var result = Array(length);
+  while (++index < length) {
+    result[index] = array[index + start];
+  }
+  return result;
+}
+
+/**
+ * Gets the last element of `array`.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Array
+ * @param {Array} array The array to query.
+ * @returns {*} Returns the last element of `array`.
+ * @example
+ *
+ * _.last([1, 2, 3]);
+ * // => 3
+ */
+function last(array) {
+  var length = array == null ? 0 : array.length;
+  return length ? array[length - 1] : undefined;
+}
+
+/**
+ * Gets the parent value at `path` of `object`.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @param {Array} path The path to get the parent value of.
+ * @returns {*} Returns the parent value.
+ */
+function parent(object, path) {
+  return path.length < 2 ? object : baseGet(object, baseSlice(path, 0, -1));
+}
+
+/**
+ * The base implementation of `_.unset`.
+ *
+ * @private
+ * @param {Object} object The object to modify.
+ * @param {Array|string} path The property path to unset.
+ * @returns {boolean} Returns `true` if the property is deleted, else `false`.
+ */
+function baseUnset(object, path) {
+  path = castPath(path, object);
+  object = parent(object, path);
+  return object == null || delete object[toKey(last(path))];
+}
+
+/**
+ * Used by `_.omit` to customize its `_.cloneDeep` use to only clone plain
+ * objects.
+ *
+ * @private
+ * @param {*} value The value to inspect.
+ * @param {string} key The key of the property to inspect.
+ * @returns {*} Returns the uncloned value or `undefined` to defer cloning to `_.cloneDeep`.
+ */
+function customOmitClone(value) {
+  return isPlainObject(value) ? undefined : value;
+}
+
+/** Used to compose bitmasks for cloning. */
+var CLONE_DEEP_FLAG = 1,
+    CLONE_FLAT_FLAG = 2,
+    CLONE_SYMBOLS_FLAG = 4;
+
+/**
+ * The opposite of `_.pick`; this method creates an object composed of the
+ * own and inherited enumerable property paths of `object` that are not omitted.
+ *
+ * **Note:** This method is considerably slower than `_.pick`.
+ *
+ * @static
+ * @since 0.1.0
+ * @memberOf _
+ * @category Object
+ * @param {Object} object The source object.
+ * @param {...(string|string[])} [paths] The property paths to omit.
+ * @returns {Object} Returns the new object.
+ * @example
+ *
+ * var object = { 'a': 1, 'b': '2', 'c': 3 };
+ *
+ * _.omit(object, ['a', 'c']);
+ * // => { 'b': '2' }
+ */
+var omit = flatRest(function(object, paths) {
+  var result = {};
+  if (object == null) {
+    return result;
+  }
+  var isDeep = false;
+  paths = arrayMap(paths, function(path) {
+    path = castPath(path, object);
+    isDeep || (isDeep = path.length > 1);
+    return path;
+  });
+  copyObject(object, getAllKeysIn(object), result);
+  if (isDeep) {
+    result = baseClone(result, CLONE_DEEP_FLAG | CLONE_FLAT_FLAG | CLONE_SYMBOLS_FLAG, customOmitClone);
+  }
+  var length = paths.length;
+  while (length--) {
+    baseUnset(result, paths[length]);
+  }
+  return result;
+});
+
+const checkboxProps = {
+  modelValue: {
+    type: [Number, String, Boolean],
+    default: void 0
+  },
+  label: {
+    type: [String, Boolean, Number, Object],
+    default: void 0
+  },
+  value: {
+    type: [String, Boolean, Number, Object],
+    default: void 0
+  },
+  indeterminate: Boolean,
+  disabled: {
+    type: Boolean,
+    default: void 0
+  },
+  checked: Boolean,
+  name: {
+    type: String,
+    default: void 0
+  },
+  trueValue: {
+    type: [String, Number],
+    default: void 0
+  },
+  falseValue: {
+    type: [String, Number],
+    default: void 0
+  },
+  trueLabel: {
+    type: [String, Number],
+    default: void 0
+  },
+  falseLabel: {
+    type: [String, Number],
+    default: void 0
+  },
+  id: {
+    type: String,
+    default: void 0
+  },
+  border: Boolean,
+  size: useSizeProp,
+  tabindex: [String, Number],
+  validateEvent: {
+    type: Boolean,
+    default: true
+  },
+  ariaLabel: String,
+  ...useAriaProps(["ariaControls"])
+};
+const checkboxEmits = {
+  [UPDATE_MODEL_EVENT]: (val) => isString(val) || isNumber(val) || isBoolean(val),
+  change: (val) => isString(val) || isNumber(val) || isBoolean(val)
+};
+
+const checkboxGroupContextKey = Symbol("checkboxGroupContextKey");
+
+const useCheckboxDisabled = ({
+  model,
+  isChecked
+}) => {
+  const checkboxGroup = inject(checkboxGroupContextKey, void 0);
+  const formContext = inject(formContextKey, void 0);
+  const isLimitDisabled = computed(() => {
+    var _a, _b;
+    const max = (_a = checkboxGroup == null ? void 0 : checkboxGroup.max) == null ? void 0 : _a.value;
+    const min = (_b = checkboxGroup == null ? void 0 : checkboxGroup.min) == null ? void 0 : _b.value;
+    return !isUndefined(max) && model.value.length >= max && !isChecked.value || !isUndefined(min) && model.value.length <= min && isChecked.value;
+  });
+  const isDisabled = useFormDisabled(computed(() => {
+    var _a, _b;
+    if (checkboxGroup === void 0) {
+      return (_a = formContext == null ? void 0 : formContext.disabled) != null ? _a : isLimitDisabled.value;
+    } else {
+      return ((_b = checkboxGroup.disabled) == null ? void 0 : _b.value) || isLimitDisabled.value;
+    }
+  }));
+  return {
+    isDisabled,
+    isLimitDisabled
+  };
+};
+
+const useCheckboxEvent = (props, {
+  model,
+  isLimitExceeded,
+  hasOwnLabel,
+  isDisabled,
+  isLabeledByFormItem
+}) => {
+  const checkboxGroup = inject(checkboxGroupContextKey, void 0);
+  const { formItem } = useFormItem();
+  const { emit } = getCurrentInstance();
+  function getLabeledValue(value) {
+    var _a, _b, _c, _d;
+    return [true, props.trueValue, props.trueLabel].includes(value) ? (_b = (_a = props.trueValue) != null ? _a : props.trueLabel) != null ? _b : true : (_d = (_c = props.falseValue) != null ? _c : props.falseLabel) != null ? _d : false;
+  }
+  function emitChangeEvent(checked, e) {
+    emit(CHANGE_EVENT, getLabeledValue(checked), e);
+  }
+  function handleChange(e) {
+    if (isLimitExceeded.value)
+      return;
+    const target = e.target;
+    emit(CHANGE_EVENT, getLabeledValue(target.checked), e);
+  }
+  async function onClickRoot(e) {
+    if (isLimitExceeded.value)
+      return;
+    if (!hasOwnLabel.value && !isDisabled.value && isLabeledByFormItem.value) {
+      const eventTargets = e.composedPath();
+      const hasLabel = eventTargets.some((item) => item.tagName === "LABEL");
+      if (!hasLabel) {
+        model.value = getLabeledValue([false, props.falseValue, props.falseLabel].includes(model.value));
+        await nextTick();
+        emitChangeEvent(model.value, e);
+      }
+    }
+  }
+  const validateEvent = computed(() => (checkboxGroup == null ? void 0 : checkboxGroup.validateEvent) || props.validateEvent);
+  watch(() => props.modelValue, () => {
+    if (validateEvent.value) {
+      formItem == null ? void 0 : formItem.validate("change").catch((err) => debugWarn(err));
+    }
+  });
+  return {
+    handleChange,
+    onClickRoot
+  };
+};
+
+const useCheckboxModel = (props) => {
+  const selfModel = ref(false);
+  const { emit } = getCurrentInstance();
+  const checkboxGroup = inject(checkboxGroupContextKey, void 0);
+  const isGroup = computed(() => isUndefined(checkboxGroup) === false);
+  const isLimitExceeded = ref(false);
+  const model = computed({
+    get() {
+      var _a, _b;
+      return isGroup.value ? (_a = checkboxGroup == null ? void 0 : checkboxGroup.modelValue) == null ? void 0 : _a.value : (_b = props.modelValue) != null ? _b : selfModel.value;
+    },
+    set(val) {
+      var _a, _b;
+      if (isGroup.value && isArray(val)) {
+        isLimitExceeded.value = ((_a = checkboxGroup == null ? void 0 : checkboxGroup.max) == null ? void 0 : _a.value) !== void 0 && val.length > (checkboxGroup == null ? void 0 : checkboxGroup.max.value) && val.length > model.value.length;
+        isLimitExceeded.value === false && ((_b = checkboxGroup == null ? void 0 : checkboxGroup.changeEvent) == null ? void 0 : _b.call(checkboxGroup, val));
+      } else {
+        emit(UPDATE_MODEL_EVENT, val);
+        selfModel.value = val;
+      }
+    }
+  });
+  return {
+    model,
+    isGroup,
+    isLimitExceeded
+  };
+};
+
+const useCheckboxStatus = (props, slots, { model }) => {
+  const checkboxGroup = inject(checkboxGroupContextKey, void 0);
+  const isFocused = ref(false);
+  const actualValue = computed(() => {
+    if (!isPropAbsent(props.value)) {
+      return props.value;
+    }
+    return props.label;
+  });
+  const isChecked = computed(() => {
+    const value = model.value;
+    if (isBoolean(value)) {
+      return value;
+    } else if (isArray(value)) {
+      if (isObject(actualValue.value)) {
+        return value.map(toRaw).some((o) => isEqual(o, actualValue.value));
+      } else {
+        return value.map(toRaw).includes(actualValue.value);
+      }
+    } else if (value !== null && value !== void 0) {
+      return value === props.trueValue || value === props.trueLabel;
+    } else {
+      return !!value;
+    }
+  });
+  const checkboxButtonSize = useFormSize(computed(() => {
+    var _a;
+    return (_a = checkboxGroup == null ? void 0 : checkboxGroup.size) == null ? void 0 : _a.value;
+  }), {
+    prop: true
+  });
+  const checkboxSize = useFormSize(computed(() => {
+    var _a;
+    return (_a = checkboxGroup == null ? void 0 : checkboxGroup.size) == null ? void 0 : _a.value;
+  }));
+  const hasOwnLabel = computed(() => {
+    return !!slots.default || !isPropAbsent(actualValue.value);
+  });
+  return {
+    checkboxButtonSize,
+    isChecked,
+    isFocused,
+    checkboxSize,
+    hasOwnLabel,
+    actualValue
+  };
+};
+
+const useCheckbox = (props, slots) => {
+  const { formItem: elFormItem } = useFormItem();
+  const { model, isGroup, isLimitExceeded } = useCheckboxModel(props);
+  const {
+    isFocused,
+    isChecked,
+    checkboxButtonSize,
+    checkboxSize,
+    hasOwnLabel,
+    actualValue
+  } = useCheckboxStatus(props, slots, { model });
+  const { isDisabled } = useCheckboxDisabled({ model, isChecked });
+  const { inputId, isLabeledByFormItem } = useFormItemInputId(props, {
+    formItemContext: elFormItem,
+    disableIdGeneration: hasOwnLabel,
+    disableIdManagement: isGroup
+  });
+  const { handleChange, onClickRoot } = useCheckboxEvent(props, {
+    model,
+    isLimitExceeded,
+    hasOwnLabel,
+    isDisabled,
+    isLabeledByFormItem
+  });
+  const setStoreValue = () => {
+    function addToStore() {
+      var _a, _b;
+      if (isArray(model.value) && !model.value.includes(actualValue.value)) {
+        model.value.push(actualValue.value);
+      } else {
+        model.value = (_b = (_a = props.trueValue) != null ? _a : props.trueLabel) != null ? _b : true;
+      }
+    }
+    props.checked && addToStore();
+  };
+  setStoreValue();
+  useDeprecated({
+    from: "label act as value",
+    replacement: "value",
+    version: "3.0.0",
+    scope: "el-checkbox",
+    ref: "https://element-plus.org/en-US/component/checkbox.html"
+  }, computed(() => isGroup.value && isPropAbsent(props.value)));
+  useDeprecated({
+    from: "true-label",
+    replacement: "true-value",
+    version: "3.0.0",
+    scope: "el-checkbox",
+    ref: "https://element-plus.org/en-US/component/checkbox.html"
+  }, computed(() => !!props.trueLabel));
+  useDeprecated({
+    from: "false-label",
+    replacement: "false-value",
+    version: "3.0.0",
+    scope: "el-checkbox",
+    ref: "https://element-plus.org/en-US/component/checkbox.html"
+  }, computed(() => !!props.falseLabel));
+  return {
+    inputId,
+    isLabeledByFormItem,
+    isChecked,
+    isDisabled,
+    isFocused,
+    checkboxButtonSize,
+    checkboxSize,
+    hasOwnLabel,
+    model,
+    actualValue,
+    handleChange,
+    onClickRoot
+  };
+};
+
+const __default__$5 = defineComponent({
+  name: "ElCheckbox"
+});
+const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+  ...__default__$5,
+  props: checkboxProps,
+  emits: checkboxEmits,
+  setup(__props) {
+    const props = __props;
+    const slots = useSlots();
+    const {
+      inputId,
+      isLabeledByFormItem,
+      isChecked,
+      isDisabled,
+      isFocused,
+      checkboxSize,
+      hasOwnLabel,
+      model,
+      actualValue,
+      handleChange,
+      onClickRoot
+    } = useCheckbox(props, slots);
+    const inputBindings = computed(() => {
+      var _a, _b, _c, _d;
+      if (props.trueValue || props.falseValue || props.trueLabel || props.falseLabel) {
+        return {
+          "true-value": (_b = (_a = props.trueValue) != null ? _a : props.trueLabel) != null ? _b : true,
+          "false-value": (_d = (_c = props.falseValue) != null ? _c : props.falseLabel) != null ? _d : false
+        };
+      }
+      return {
+        value: actualValue.value
+      };
+    });
+    const ns = useNamespace("checkbox");
+    const compKls = computed(() => {
+      return [
+        ns.b(),
+        ns.m(checkboxSize.value),
+        ns.is("disabled", isDisabled.value),
+        ns.is("bordered", props.border),
+        ns.is("checked", isChecked.value)
+      ];
+    });
+    const spanKls = computed(() => {
+      return [
+        ns.e("input"),
+        ns.is("disabled", isDisabled.value),
+        ns.is("checked", isChecked.value),
+        ns.is("indeterminate", props.indeterminate),
+        ns.is("focus", isFocused.value)
+      ];
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(resolveDynamicComponent(!unref(hasOwnLabel) && unref(isLabeledByFormItem) ? "span" : "label"), {
+        for: !unref(hasOwnLabel) && unref(isLabeledByFormItem) ? null : unref(inputId),
+        class: normalizeClass(unref(compKls)),
+        "aria-controls": _ctx.indeterminate ? _ctx.ariaControls : null,
+        "aria-checked": _ctx.indeterminate ? "mixed" : void 0,
+        "aria-label": _ctx.ariaLabel,
+        onClick: unref(onClickRoot)
+      }, {
+        default: withCtx(() => [
+          createElementVNode("span", {
+            class: normalizeClass(unref(spanKls))
+          }, [
+            withDirectives(createElementVNode("input", mergeProps({
+              id: unref(inputId),
+              "onUpdate:modelValue": ($event) => isRef(model) ? model.value = $event : null,
+              class: unref(ns).e("original"),
+              type: "checkbox",
+              indeterminate: _ctx.indeterminate,
+              name: _ctx.name,
+              tabindex: _ctx.tabindex,
+              disabled: unref(isDisabled)
+            }, unref(inputBindings), {
+              onChange: unref(handleChange),
+              onFocus: ($event) => isFocused.value = true,
+              onBlur: ($event) => isFocused.value = false,
+              onClick: withModifiers(() => {
+              }, ["stop"])
+            }), null, 16, ["id", "onUpdate:modelValue", "indeterminate", "name", "tabindex", "disabled", "onChange", "onFocus", "onBlur", "onClick"]), [
+              [vModelCheckbox, unref(model)]
+            ]),
+            createElementVNode("span", {
+              class: normalizeClass(unref(ns).e("inner"))
+            }, null, 2)
+          ], 2),
+          unref(hasOwnLabel) ? (openBlock(), createElementBlock("span", {
+            key: 0,
+            class: normalizeClass(unref(ns).e("label"))
+          }, [
+            renderSlot(_ctx.$slots, "default"),
+            !_ctx.$slots.default ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+              createTextVNode(toDisplayString(_ctx.label), 1)
+            ], 64)) : createCommentVNode("v-if", true)
+          ], 2)) : createCommentVNode("v-if", true)
+        ]),
+        _: 3
+      }, 8, ["for", "class", "aria-controls", "aria-checked", "aria-label", "onClick"]);
+    };
+  }
+});
+var Checkbox = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__file", "checkbox.vue"]]);
+
+const __default__$4 = defineComponent({
+  name: "ElCheckboxButton"
+});
+const _sfc_main$4 = /* @__PURE__ */ defineComponent({
+  ...__default__$4,
+  props: checkboxProps,
+  emits: checkboxEmits,
+  setup(__props) {
+    const props = __props;
+    const slots = useSlots();
+    const {
+      isFocused,
+      isChecked,
+      isDisabled,
+      checkboxButtonSize,
+      model,
+      actualValue,
+      handleChange
+    } = useCheckbox(props, slots);
+    const inputBindings = computed(() => {
+      var _a, _b, _c, _d;
+      if (props.trueValue || props.falseValue || props.trueLabel || props.falseLabel) {
+        return {
+          "true-value": (_b = (_a = props.trueValue) != null ? _a : props.trueLabel) != null ? _b : true,
+          "false-value": (_d = (_c = props.falseValue) != null ? _c : props.falseLabel) != null ? _d : false
+        };
+      }
+      return {
+        value: actualValue.value
+      };
+    });
+    const checkboxGroup = inject(checkboxGroupContextKey, void 0);
+    const ns = useNamespace("checkbox");
+    const activeStyle = computed(() => {
+      var _a, _b, _c, _d;
+      const fillValue = (_b = (_a = checkboxGroup == null ? void 0 : checkboxGroup.fill) == null ? void 0 : _a.value) != null ? _b : "";
+      return {
+        backgroundColor: fillValue,
+        borderColor: fillValue,
+        color: (_d = (_c = checkboxGroup == null ? void 0 : checkboxGroup.textColor) == null ? void 0 : _c.value) != null ? _d : "",
+        boxShadow: fillValue ? `-1px 0 0 0 ${fillValue}` : void 0
+      };
+    });
+    const labelKls = computed(() => {
+      return [
+        ns.b("button"),
+        ns.bm("button", checkboxButtonSize.value),
+        ns.is("disabled", isDisabled.value),
+        ns.is("checked", isChecked.value),
+        ns.is("focus", isFocused.value)
+      ];
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("label", {
+        class: normalizeClass(unref(labelKls))
+      }, [
+        withDirectives(createElementVNode("input", mergeProps({
+          "onUpdate:modelValue": ($event) => isRef(model) ? model.value = $event : null,
+          class: unref(ns).be("button", "original"),
+          type: "checkbox",
+          name: _ctx.name,
+          tabindex: _ctx.tabindex,
+          disabled: unref(isDisabled)
+        }, unref(inputBindings), {
+          onChange: unref(handleChange),
+          onFocus: ($event) => isFocused.value = true,
+          onBlur: ($event) => isFocused.value = false,
+          onClick: withModifiers(() => {
+          }, ["stop"])
+        }), null, 16, ["onUpdate:modelValue", "name", "tabindex", "disabled", "onChange", "onFocus", "onBlur", "onClick"]), [
+          [vModelCheckbox, unref(model)]
+        ]),
+        _ctx.$slots.default || _ctx.label ? (openBlock(), createElementBlock("span", {
+          key: 0,
+          class: normalizeClass(unref(ns).be("button", "inner")),
+          style: normalizeStyle(unref(isChecked) ? unref(activeStyle) : void 0)
+        }, [
+          renderSlot(_ctx.$slots, "default", {}, () => [
+            createTextVNode(toDisplayString(_ctx.label), 1)
+          ])
+        ], 6)) : createCommentVNode("v-if", true)
+      ], 2);
+    };
+  }
+});
+var CheckboxButton = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__file", "checkbox-button.vue"]]);
+
+const checkboxGroupProps = buildProps({
+  modelValue: {
+    type: definePropType(Array),
+    default: () => []
+  },
+  disabled: {
+    type: Boolean,
+    default: void 0
+  },
+  min: Number,
+  max: Number,
+  size: useSizeProp,
+  fill: String,
+  textColor: String,
+  tag: {
+    type: String,
+    default: "div"
+  },
+  validateEvent: {
+    type: Boolean,
+    default: true
+  },
+  options: {
+    type: definePropType(Array)
+  },
+  props: {
+    type: definePropType(Object),
+    default: () => checkboxDefaultProps
+  },
+  type: {
+    type: String,
+    values: ["checkbox", "button"],
+    default: "checkbox"
+  },
+  ...useAriaProps(["ariaLabel"])
+});
+const checkboxGroupEmits = {
+  [UPDATE_MODEL_EVENT]: (val) => isArray(val),
+  change: (val) => isArray(val)
+};
+const checkboxDefaultProps = {
+  label: "label",
+  value: "value",
+  disabled: "disabled"
+};
+
+const __default__$3 = defineComponent({
+  name: "ElCheckboxGroup"
+});
+const _sfc_main$3 = /* @__PURE__ */ defineComponent({
+  ...__default__$3,
+  props: checkboxGroupProps,
+  emits: checkboxGroupEmits,
+  setup(__props, { emit }) {
+    const props = __props;
+    const ns = useNamespace("checkbox");
+    const checkboxDisabled = useFormDisabled();
+    const { formItem } = useFormItem();
+    const { inputId: groupId, isLabeledByFormItem } = useFormItemInputId(props, {
+      formItemContext: formItem
+    });
+    const changeEvent = async (value) => {
+      emit(UPDATE_MODEL_EVENT, value);
+      await nextTick();
+      emit(CHANGE_EVENT, value);
+    };
+    const modelValue = computed({
+      get() {
+        return props.modelValue;
+      },
+      set(val) {
+        changeEvent(val);
+      }
+    });
+    const aliasProps = computed(() => ({
+      ...checkboxDefaultProps,
+      ...props.props
+    }));
+    const getOptionProps = (option) => {
+      const { label, value, disabled } = aliasProps.value;
+      const base = {
+        label: option[label],
+        value: option[value],
+        disabled: option[disabled]
+      };
+      return { ...omit(option, [label, value, disabled]), ...base };
+    };
+    const optionComponent = computed(() => props.type === "button" ? CheckboxButton : Checkbox);
+    provide(checkboxGroupContextKey, {
+      ...pick(toRefs(props), [
+        "size",
+        "min",
+        "max",
+        "validateEvent",
+        "fill",
+        "textColor"
+      ]),
+      disabled: checkboxDisabled,
+      modelValue,
+      changeEvent
+    });
+    watch(() => props.modelValue, (newVal, oldValue) => {
+      if (props.validateEvent && !isEqual(newVal, oldValue)) {
+        formItem == null ? void 0 : formItem.validate("change").catch((err) => debugWarn(err));
+      }
+    });
+    return (_ctx, _cache) => {
+      var _a;
+      return openBlock(), createBlock(resolveDynamicComponent(_ctx.tag), {
+        id: unref(groupId),
+        class: normalizeClass(unref(ns).b("group")),
+        role: "group",
+        "aria-label": !unref(isLabeledByFormItem) ? _ctx.ariaLabel || "checkbox-group" : void 0,
+        "aria-labelledby": unref(isLabeledByFormItem) ? (_a = unref(formItem)) == null ? void 0 : _a.labelId : void 0
+      }, {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default", {}, () => [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.options, (item, index) => {
+              return openBlock(), createBlock(resolveDynamicComponent(unref(optionComponent)), mergeProps({ key: index }, getOptionProps(item)), null, 16);
+            }), 128))
+          ])
+        ]),
+        _: 3
+      }, 8, ["id", "class", "aria-label", "aria-labelledby"]);
+    };
+  }
+});
+var CheckboxGroup = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__file", "checkbox-group.vue"]]);
+
+const ElCheckbox = withInstall(Checkbox, {
+  CheckboxButton,
+  CheckboxGroup
+});
+withNoopInstall(CheckboxButton);
+const ElCheckboxGroup = withNoopInstall(CheckboxGroup);
+
+const radioPropsBase = buildProps({
+  modelValue: {
+    type: [String, Number, Boolean],
+    default: void 0
+  },
+  size: useSizeProp,
+  disabled: {
+    type: Boolean,
+    default: void 0
+  },
+  label: {
+    type: [String, Number, Boolean],
+    default: void 0
+  },
+  value: {
+    type: [String, Number, Boolean],
+    default: void 0
+  },
+  name: {
+    type: String,
+    default: void 0
+  }
+});
+const radioProps = buildProps({
+  ...radioPropsBase,
+  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 = ref();
+  const radioGroup = inject(radioGroupKey, void 0);
+  const isGroup = computed(() => !!radioGroup);
+  const actualValue = computed(() => {
+    if (!isPropAbsent(props.value)) {
+      return props.value;
+    }
+    return props.label;
+  });
+  const modelValue = 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 === actualValue.value;
+    }
+  });
+  const size = useFormSize(computed(() => radioGroup == null ? void 0 : radioGroup.size));
+  const disabled = useFormDisabled(computed(() => radioGroup == null ? void 0 : radioGroup.disabled));
+  const focus = ref(false);
+  const tabIndex = computed(() => {
+    return disabled.value || isGroup.value && modelValue.value !== actualValue.value ? -1 : 0;
+  });
+  useDeprecated({
+    from: "label act as value",
+    replacement: "value",
+    version: "3.0.0",
+    scope: "el-radio",
+    ref: "https://element-plus.org/en-US/component/radio.html"
+  }, computed(() => isGroup.value && isPropAbsent(props.value)));
+  return {
+    radioRef,
+    isGroup,
+    radioGroup,
+    focus,
+    size,
+    disabled,
+    tabIndex,
+    modelValue,
+    actualValue
+  };
+};
+
+const __default__$2 = defineComponent({
+  name: "ElRadio"
+});
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+  ...__default__$2,
+  props: radioProps,
+  emits: radioEmits,
+  setup(__props, { emit }) {
+    const props = __props;
+    const ns = useNamespace("radio");
+    const { radioRef, radioGroup, focus, size, disabled, modelValue, actualValue } = useRadio(props, emit);
+    function handleChange() {
+      nextTick(() => emit(CHANGE_EVENT, modelValue.value));
+    }
+    return (_ctx, _cache) => {
+      var _a;
+      return openBlock(), createElementBlock("label", {
+        class: normalizeClass([
+          unref(ns).b(),
+          unref(ns).is("disabled", unref(disabled)),
+          unref(ns).is("focus", unref(focus)),
+          unref(ns).is("bordered", _ctx.border),
+          unref(ns).is("checked", unref(modelValue) === unref(actualValue)),
+          unref(ns).m(unref(size))
+        ])
+      }, [
+        createElementVNode("span", {
+          class: normalizeClass([
+            unref(ns).e("input"),
+            unref(ns).is("disabled", unref(disabled)),
+            unref(ns).is("checked", unref(modelValue) === unref(actualValue))
+          ])
+        }, [
+          withDirectives(createElementVNode("input", {
+            ref_key: "radioRef",
+            ref: radioRef,
+            "onUpdate:modelValue": ($event) => isRef(modelValue) ? modelValue.value = $event : null,
+            class: normalizeClass(unref(ns).e("original")),
+            value: unref(actualValue),
+            name: _ctx.name || ((_a = unref(radioGroup)) == null ? void 0 : _a.name),
+            disabled: unref(disabled),
+            checked: unref(modelValue) === unref(actualValue),
+            type: "radio",
+            onFocus: ($event) => focus.value = true,
+            onBlur: ($event) => focus.value = false,
+            onChange: handleChange,
+            onClick: withModifiers(() => {
+            }, ["stop"])
+          }, null, 42, ["onUpdate:modelValue", "value", "name", "disabled", "checked", "onFocus", "onBlur", "onClick"]), [
+            [vModelRadio, unref(modelValue)]
+          ]),
+          createElementVNode("span", {
+            class: normalizeClass(unref(ns).e("inner"))
+          }, null, 2)
+        ], 2),
+        createElementVNode("span", {
+          class: normalizeClass(unref(ns).e("label")),
+          onKeydown: withModifiers(() => {
+          }, ["stop"])
+        }, [
+          renderSlot(_ctx.$slots, "default", {}, () => [
+            createTextVNode(toDisplayString(_ctx.label), 1)
+          ])
+        ], 42, ["onKeydown"])
+      ], 2);
+    };
+  }
+});
+var Radio = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__file", "radio.vue"]]);
+
+const radioButtonProps = buildProps({
+  ...radioPropsBase
+});
+
+const __default__$1 = defineComponent({
+  name: "ElRadioButton"
+});
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  ...__default__$1,
+  props: radioButtonProps,
+  setup(__props) {
+    const props = __props;
+    const ns = useNamespace("radio");
+    const { radioRef, focus, size, disabled, modelValue, radioGroup, actualValue } = useRadio(props);
+    const activeStyle = 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 openBlock(), createElementBlock("label", {
+        class: normalizeClass([
+          unref(ns).b("button"),
+          unref(ns).is("active", unref(modelValue) === unref(actualValue)),
+          unref(ns).is("disabled", unref(disabled)),
+          unref(ns).is("focus", unref(focus)),
+          unref(ns).bm("button", unref(size))
+        ])
+      }, [
+        withDirectives(createElementVNode("input", {
+          ref_key: "radioRef",
+          ref: radioRef,
+          "onUpdate:modelValue": ($event) => isRef(modelValue) ? modelValue.value = $event : null,
+          class: normalizeClass(unref(ns).be("button", "original-radio")),
+          value: unref(actualValue),
+          type: "radio",
+          name: _ctx.name || ((_a = unref(radioGroup)) == null ? void 0 : _a.name),
+          disabled: unref(disabled),
+          onFocus: ($event) => focus.value = true,
+          onBlur: ($event) => focus.value = false,
+          onClick: withModifiers(() => {
+          }, ["stop"])
+        }, null, 42, ["onUpdate:modelValue", "value", "name", "disabled", "onFocus", "onBlur", "onClick"]), [
+          [vModelRadio, unref(modelValue)]
+        ]),
+        createElementVNode("span", {
+          class: normalizeClass(unref(ns).be("button", "inner")),
+          style: normalizeStyle(unref(modelValue) === unref(actualValue) ? unref(activeStyle) : {}),
+          onKeydown: withModifiers(() => {
+          }, ["stop"])
+        }, [
+          renderSlot(_ctx.$slots, "default", {}, () => [
+            createTextVNode(toDisplayString(_ctx.label), 1)
+          ])
+        ], 46, ["onKeydown"])
+      ], 2);
+    };
+  }
+});
+var RadioButton = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__file", "radio-button.vue"]]);
+
+const radioGroupProps = buildProps({
+  id: {
+    type: String,
+    default: void 0
+  },
+  size: useSizeProp,
+  disabled: {
+    type: Boolean,
+    default: void 0
+  },
+  modelValue: {
+    type: [String, Number, Boolean],
+    default: void 0
+  },
+  fill: {
+    type: String,
+    default: ""
+  },
+  textColor: {
+    type: String,
+    default: ""
+  },
+  name: {
+    type: String,
+    default: void 0
+  },
+  validateEvent: {
+    type: Boolean,
+    default: true
+  },
+  options: {
+    type: definePropType(Array)
+  },
+  props: {
+    type: definePropType(Object),
+    default: () => radioDefaultProps
+  },
+  type: {
+    type: String,
+    values: ["radio", "button"],
+    default: "radio"
+  },
+  ...useAriaProps(["ariaLabel"])
+});
+const radioGroupEmits = radioEmits;
+const radioDefaultProps = {
+  label: "label",
+  value: "value",
+  disabled: "disabled"
+};
+
+const __default__ = defineComponent({
+  name: "ElRadioGroup"
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: radioGroupProps,
+  emits: radioGroupEmits,
+  setup(__props, { emit }) {
+    const props = __props;
+    const ns = useNamespace("radio");
+    const radioId = useId();
+    const radioGroupRef = ref();
+    const { formItem } = useFormItem();
+    const { inputId: groupId, isLabeledByFormItem } = useFormItemInputId(props, {
+      formItemContext: formItem
+    });
+    const changeEvent = (value) => {
+      emit(UPDATE_MODEL_EVENT, value);
+      nextTick(() => emit(CHANGE_EVENT, value));
+    };
+    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 = computed(() => {
+      return props.name || radioId.value;
+    });
+    const aliasProps = computed(() => ({
+      ...radioDefaultProps,
+      ...props.props
+    }));
+    const getOptionProps = (option) => {
+      const { label, value, disabled } = aliasProps.value;
+      const base = {
+        label: option[label],
+        value: option[value],
+        disabled: option[disabled]
+      };
+      return { ...omit(option, [label, value, disabled]), ...base };
+    };
+    const optionComponent = computed(() => props.type === "button" ? RadioButton : Radio);
+    provide(radioGroupKey, reactive({
+      ...toRefs(props),
+      changeEvent,
+      name
+    }));
+    watch(() => props.modelValue, (newVal, oldValue) => {
+      if (props.validateEvent && !isEqual(newVal, oldValue)) {
+        formItem == null ? void 0 : formItem.validate("change").catch((err) => debugWarn(err));
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        id: unref(groupId),
+        ref_key: "radioGroupRef",
+        ref: radioGroupRef,
+        class: normalizeClass(unref(ns).b("group")),
+        role: "radiogroup",
+        "aria-label": !unref(isLabeledByFormItem) ? _ctx.ariaLabel || "radio-group" : void 0,
+        "aria-labelledby": unref(isLabeledByFormItem) ? unref(formItem).labelId : void 0
+      }, [
+        renderSlot(_ctx.$slots, "default", {}, () => [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.options, (item, index) => {
+            return openBlock(), createBlock(resolveDynamicComponent(unref(optionComponent)), mergeProps({ key: index }, getOptionProps(item)), null, 16);
+          }), 128))
+        ])
+      ], 10, ["id", "aria-label", "aria-labelledby"]);
+    };
+  }
+});
+var RadioGroup = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "radio-group.vue"]]);
+
+const ElRadio = withInstall(Radio, {
+  RadioButton,
+  RadioGroup
+});
+const ElRadioGroup = withNoopInstall(RadioGroup);
+withNoopInstall(RadioButton);
+
+export { ElRadioGroup as E, ElCheckboxGroup as a, ElCheckbox as b, ElRadio as c };