ant-design-vue
Version:
An enterprise-class UI design language and Vue-based implementation
134 lines (117 loc) • 4.4 kB
JavaScript
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import _extends from "@babel/runtime/helpers/esm/extends";
import { createVNode as _createVNode } from "vue";
var __rest = this && this.__rest || function (s, e) {
var t = {};
for (var p in s) {
if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
}
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
}
return t;
};
import { defineComponent, inject, ref } from 'vue';
import PropTypes from '../_util/vue-types';
import VcCheckbox from '../vc-checkbox/Checkbox';
import classNames from '../_util/classNames';
import useConfigInject from '../_util/hooks/useConfigInject';
import { useInjectFormItemContext } from '../form/FormItemContext';
import omit from '../_util/omit';
export var radioProps = function radioProps() {
return {
prefixCls: String,
checked: {
type: Boolean,
default: undefined
},
disabled: {
type: Boolean,
default: undefined
},
isGroup: {
type: Boolean,
default: undefined
},
value: PropTypes.any,
name: String,
id: String,
autofocus: {
type: Boolean,
default: undefined
},
onChange: Function,
onFocus: Function,
onBlur: Function,
onClick: Function,
'onUpdate:checked': Function,
'onUpdate:value': Function
};
};
export default defineComponent({
name: 'ARadio',
props: radioProps(),
// emits: ['update:checked', 'update:value', 'change', 'blur', 'focus'],
setup: function setup(props, _ref) {
var emit = _ref.emit,
expose = _ref.expose,
slots = _ref.slots;
var formItemContext = useInjectFormItemContext();
var vcCheckbox = ref();
var radioGroupContext = inject('radioGroupContext', undefined);
var _useConfigInject = useConfigInject('radio', props),
prefixCls = _useConfigInject.prefixCls,
direction = _useConfigInject.direction;
var focus = function focus() {
vcCheckbox.value.focus();
};
var blur = function blur() {
vcCheckbox.value.blur();
};
expose({
focus: focus,
blur: blur
});
var handleChange = function handleChange(event) {
var targetChecked = event.target.checked;
emit('update:checked', targetChecked);
emit('update:value', targetChecked);
emit('change', event);
formItemContext.onFieldChange();
};
var onChange = function onChange(e) {
emit('change', e);
if (radioGroupContext && radioGroupContext.onRadioChange) {
radioGroupContext.onRadioChange(e);
}
};
return function () {
var _classNames;
var radioGroup = radioGroupContext;
var customizePrefixCls = props.prefixCls,
_props$id = props.id,
id = _props$id === void 0 ? formItemContext.id.value : _props$id,
restProps = __rest(props, ["prefixCls", "id"]);
var rProps = _extends({
prefixCls: prefixCls.value,
id: id
}, omit(restProps, ['onUpdate:checked', 'onUpdate:value']));
if (radioGroup) {
rProps.name = radioGroup.props.name;
rProps.onChange = onChange;
rProps.checked = props.value === radioGroup.stateValue.value;
rProps.disabled = props.disabled || radioGroup.props.disabled;
} else {
rProps.onChange = handleChange;
}
var wrapperClassString = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(prefixCls.value, "-wrapper"), true), _defineProperty(_classNames, "".concat(prefixCls.value, "-wrapper-checked"), rProps.checked), _defineProperty(_classNames, "".concat(prefixCls.value, "-wrapper-disabled"), rProps.disabled), _defineProperty(_classNames, "".concat(prefixCls.value, "-wrapper-rtl"), direction.value === 'rtl'), _classNames));
return _createVNode("label", {
"class": wrapperClassString
}, [_createVNode(VcCheckbox, _objectSpread(_objectSpread({}, rProps), {}, {
"type": "radio",
"ref": vcCheckbox
}), null), slots.default && _createVNode("span", null, [slots.default()])]);
};
}
});