You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
45 lines
1.3 KiB
45 lines
1.3 KiB
2 years ago
|
import { ref, inject, computed } from 'vue';
|
||
|
|
import '../../../constants/index.mjs';
|
||
|
|
import '../../form/index.mjs';
|
||
|
|
import { radioGroupKey } from './constants.mjs';
|
||
|
|
import { UPDATE_MODEL_EVENT } from '../../../constants/event.mjs';
|
||
|
|
import { useFormSize, useFormDisabled } from '../../form/src/hooks/use-form-common-props.mjs';
|
||
|
|
|
||
|
|
const useRadio = (props, emit) => {
|
||
|
|
const radioRef = ref();
|
||
|
|
const radioGroup = inject(radioGroupKey, void 0);
|
||
|
|
const isGroup = computed(() => !!radioGroup);
|
||
|
|
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 === props.label;
|
||
|
|
}
|
||
|
|
});
|
||
|
|
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 !== props.label ? -1 : 0;
|
||
|
|
});
|
||
|
|
return {
|
||
|
|
radioRef,
|
||
|
|
isGroup,
|
||
|
|
radioGroup,
|
||
|
|
focus,
|
||
|
|
size,
|
||
|
|
disabled,
|
||
|
|
tabIndex,
|
||
|
|
modelValue
|
||
|
|
};
|
||
|
|
};
|
||
|
|
|
||
|
|
export { useRadio };
|
||
|
|
//# sourceMappingURL=use-radio.mjs.map
|