@opensig/opendesign/lib/radio/ORadio.vue.js

"use strict";
const vue = require("vue");
const provide$1 = require("./provide.js");
const types = require("./types.js");
const provide = require("../radio-group/provide.js");
const is = require("../_utils/is.js");
const helper = require("../_utils/helper.js");
const _hoisted_1 = ["for"];
const _hoisted_2 = { class: "o-radio-wrap" };
const _hoisted_3 = ["id", "value", "disabled", "checked"];
const _hoisted_4 = { class: "o-radio-label" };
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  __name: "ORadio",
  props: types.radioProps,
  emits: ["update:modelValue", "change"],
  setup(__props, { expose: __expose, emit: __emit }) {
    const props = __props;
    const emits = __emit;
    const radioGroupInjection = vue.inject(provide.radioGroupInjectKey, null);
    const inputId = vue.ref(props.inputId);
    vue.onMounted(() => {
      if (!inputId.value) {
        inputId.value = helper.uniqueId();
      }
    });
    const _checked = vue.ref(props.defaultChecked);
    const isChecked = vue.computed(() => {
      if (radioGroupInjection) {
        return radioGroupInjection.realValue.value === props.value;
      }
      if (!is.isUndefined(props.modelValue)) {
        return props.modelValue === props.value;
      }
      return _checked.value;
    });
    vue.watch(
      isChecked,
      (val) => {
        _checked.value = val;
      },
      { immediate: true }
    );
    __expose({
      /**
       * @zh-CN 是否已选中
       * @en-US Whether the radio is checked
       */
      checked: isChecked
    });
    const isDisabled = vue.computed(() => (radioGroupInjection == null ? void 0 : radioGroupInjection.disabled.value) || props.disabled);
    const onClick = (ev) => {
      ev.stopPropagation();
    };
    const onChange = (ev) => {
      if (isDisabled.value) {
        return;
      }
      _checked.value = true;
      const val = props.value ?? true;
      emits("update:modelValue", val);
      radioGroupInjection == null ? void 0 : radioGroupInjection.updateModelValue(val);
      vue.nextTick(() => {
        emits("change", val, ev);
        radioGroupInjection == null ? void 0 : radioGroupInjection.onChange(val, ev);
      });
    };
    vue.provide(provide$1.radioInjectKey, {
      checked: isChecked,
      disabled: isDisabled
    });
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createElementBlock("label", {
        class: vue.normalizeClass(["o-radio", {
          "o-radio-checked": isChecked.value,
          "o-radio-disabled": isDisabled.value
        }]),
        for: inputId.value
      }, [
        vue.createElementVNode("div", _hoisted_2, [
          vue.createElementVNode("input", {
            id: inputId.value,
            type: "radio",
            value: props.value,
            disabled: isDisabled.value,
            checked: isChecked.value,
            onClick,
            onChange
          }, null, 40, _hoisted_3),
          vue.renderSlot(_ctx.$slots, "radio", {
            checked: isChecked.value,
            disabled: isDisabled.value
          }, () => [
            _cache[0] || (_cache[0] = vue.createElementVNode(
              "div",
              { class: "o-radio-input-wrap" },
              [
                vue.createElementVNode("span", { class: "o-radio-input" })
              ],
              -1
              /* CACHED */
            )),
            vue.createElementVNode("span", _hoisted_4, [
              vue.renderSlot(_ctx.$slots, "default")
            ])
          ])
        ])
      ], 10, _hoisted_1);
    };
  }
});
module.exports = _sfc_main;