"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const event = require("../../../constants/event.js");
const error = require("../../../utils/error.js");
const index = require("../../../hooks/use-namespace/index.js");
const index$1 = require("../../../hooks/use-id/index.js");
const useFormItem = require("../../form/src/hooks/use-form-item.js");
const constants = require("./constants.js");
const radio2 = require("./radio2.js");
const radioButton2 = require("./radio-button2.js");
const radioGroup = require("./radio-group.js");
const Vue = require("vue");
const isEqual = require("../../../../../lodash-es/isEqual.js");
const omit = require("../../../../../lodash-es/omit.js");
const _hoisted_1 = [
  "id",
  "aria-label",
  "aria-labelledby"
];
var radio_group_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ Vue.defineComponent({
  name: "ElRadioGroup",
  __name: "radio-group",
  props: radioGroup.radioGroupProps,
  emits: radioGroup.radioGroupEmits,
  setup(__props, { emit: __emit }) {
    const props = __props;
    const emit = __emit;
    const ns = index.useNamespace("radio");
    const radioId = index$1.useId();
    const radioGroupRef = Vue.ref();
    const { formItem } = useFormItem.useFormItem();
    const { inputId: groupId, isLabeledByFormItem } = useFormItem.useFormItemInputId(props, { formItemContext: formItem });
    const changeEvent = (value) => {
      emit(event.UPDATE_MODEL_EVENT, value);
      Vue.nextTick(() => emit(event.CHANGE_EVENT, 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;
    });
    const aliasProps = Vue.computed(() => ({
      ...radioGroup.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.default(option, [
          label,
          value,
          disabled
        ]),
        ...base
      };
    };
    const optionComponent = Vue.computed(() => props.type === "button" ? radioButton2.default : radio2.default);
    Vue.provide(constants.radioGroupKey, Vue.reactive({
      ...Vue.toRefs(props),
      changeEvent,
      name
    }));
    Vue.watch(() => props.modelValue, (newVal, oldValue) => {
      if (props.validateEvent && !isEqual.default(newVal, oldValue)) formItem == null ? void 0 : formItem.validate("change").catch((err) => error.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) ? __props.ariaLabel || "radio-group" : void 0,
        "aria-labelledby": Vue.unref(isLabeledByFormItem) ? Vue.unref(formItem).labelId : void 0
      }, [Vue.renderSlot(_ctx.$slots, "default", {}, () => [(Vue.openBlock(true), Vue.createElementBlock(Vue.Fragment, null, Vue.renderList(__props.options, (item, index2) => {
        return Vue.openBlock(), Vue.createBlock(Vue.resolveDynamicComponent(optionComponent.value), Vue.mergeProps({ key: index2 }, { ref_for: true }, getOptionProps(item)), null, 16);
      }), 128))])], 10, _hoisted_1);
    };
  }
});
exports.default = radio_group_vue_vue_type_script_setup_true_lang_default;
