Radio.js 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
  2. import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
  3. import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
  4. var _excluded = ["prefixCls", "id"];
  5. import { createVNode as _createVNode } from "vue";
  6. import { defineComponent, inject, ref } from 'vue';
  7. import PropTypes from '../_util/vue-types';
  8. import VcCheckbox from '../vc-checkbox/Checkbox';
  9. import classNames from '../_util/classNames';
  10. import useConfigInject from '../_util/hooks/useConfigInject';
  11. import { useInjectFormItemContext } from '../form/FormItemContext';
  12. import omit from '../_util/omit';
  13. export var radioProps = function radioProps() {
  14. return {
  15. prefixCls: String,
  16. checked: {
  17. type: Boolean,
  18. default: undefined
  19. },
  20. disabled: {
  21. type: Boolean,
  22. default: undefined
  23. },
  24. isGroup: {
  25. type: Boolean,
  26. default: undefined
  27. },
  28. value: PropTypes.any,
  29. name: String,
  30. id: String,
  31. autofocus: {
  32. type: Boolean,
  33. default: undefined
  34. },
  35. onChange: Function,
  36. onFocus: Function,
  37. onBlur: Function,
  38. onClick: Function,
  39. 'onUpdate:checked': Function,
  40. 'onUpdate:value': Function
  41. };
  42. };
  43. export default defineComponent({
  44. compatConfig: {
  45. MODE: 3
  46. },
  47. name: 'ARadio',
  48. props: radioProps(),
  49. // emits: ['update:checked', 'update:value', 'change', 'blur', 'focus'],
  50. setup: function setup(props, _ref) {
  51. var emit = _ref.emit,
  52. expose = _ref.expose,
  53. slots = _ref.slots;
  54. var formItemContext = useInjectFormItemContext();
  55. var vcCheckbox = ref();
  56. var radioGroupContext = inject('radioGroupContext', undefined);
  57. var _useConfigInject = useConfigInject('radio', props),
  58. prefixCls = _useConfigInject.prefixCls,
  59. direction = _useConfigInject.direction;
  60. var focus = function focus() {
  61. vcCheckbox.value.focus();
  62. };
  63. var blur = function blur() {
  64. vcCheckbox.value.blur();
  65. };
  66. expose({
  67. focus: focus,
  68. blur: blur
  69. });
  70. var handleChange = function handleChange(event) {
  71. var targetChecked = event.target.checked;
  72. emit('update:checked', targetChecked);
  73. emit('update:value', targetChecked);
  74. emit('change', event);
  75. formItemContext.onFieldChange();
  76. };
  77. var onChange = function onChange(e) {
  78. emit('change', e);
  79. if (radioGroupContext && radioGroupContext.onRadioChange) {
  80. radioGroupContext.onRadioChange(e);
  81. }
  82. };
  83. return function () {
  84. var _classNames;
  85. var radioGroup = radioGroupContext;
  86. var customizePrefixCls = props.prefixCls,
  87. _props$id = props.id,
  88. id = _props$id === void 0 ? formItemContext.id.value : _props$id,
  89. restProps = _objectWithoutProperties(props, _excluded);
  90. var rProps = _objectSpread({
  91. prefixCls: prefixCls.value,
  92. id: id
  93. }, omit(restProps, ['onUpdate:checked', 'onUpdate:value']));
  94. if (radioGroup) {
  95. rProps.name = radioGroup.props.name;
  96. rProps.onChange = onChange;
  97. rProps.checked = props.value === radioGroup.stateValue.value;
  98. rProps.disabled = props.disabled || radioGroup.props.disabled;
  99. } else {
  100. rProps.onChange = handleChange;
  101. }
  102. 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));
  103. return _createVNode("label", {
  104. "class": wrapperClassString
  105. }, [_createVNode(VcCheckbox, _objectSpread(_objectSpread({}, rProps), {}, {
  106. "type": "radio",
  107. "ref": vcCheckbox
  108. }), null), slots.default && _createVNode("span", null, [slots.default()])]);
  109. };
  110. }
  111. });