Radio.js 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.radioProps = exports.default = void 0;
  7. var _vue = require("vue");
  8. var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
  9. var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
  10. var _vueTypes = _interopRequireDefault(require("../_util/vue-types"));
  11. var _Checkbox = _interopRequireDefault(require("../vc-checkbox/Checkbox"));
  12. var _classNames = _interopRequireDefault(require("../_util/classNames"));
  13. var _useConfigInject = _interopRequireDefault(require("../config-provider/hooks/useConfigInject"));
  14. var _FormItemContext = require("../form/FormItemContext");
  15. var _omit = _interopRequireDefault(require("../_util/omit"));
  16. var _context = require("./context");
  17. var _type = require("../_util/type");
  18. var _style = _interopRequireDefault(require("./style"));
  19. var _DisabledContext = require("../config-provider/DisabledContext");
  20. var __rest = void 0 && (void 0).__rest || function (s, e) {
  21. var t = {};
  22. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  23. if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  24. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  25. }
  26. return t;
  27. };
  28. // CSSINJS
  29. const radioProps = () => ({
  30. prefixCls: String,
  31. checked: (0, _type.booleanType)(),
  32. disabled: (0, _type.booleanType)(),
  33. isGroup: (0, _type.booleanType)(),
  34. value: _vueTypes.default.any,
  35. name: String,
  36. id: String,
  37. autofocus: (0, _type.booleanType)(),
  38. onChange: (0, _type.functionType)(),
  39. onFocus: (0, _type.functionType)(),
  40. onBlur: (0, _type.functionType)(),
  41. onClick: (0, _type.functionType)(),
  42. 'onUpdate:checked': (0, _type.functionType)(),
  43. 'onUpdate:value': (0, _type.functionType)()
  44. });
  45. exports.radioProps = radioProps;
  46. var _default = exports.default = (0, _vue.defineComponent)({
  47. compatConfig: {
  48. MODE: 3
  49. },
  50. name: 'ARadio',
  51. inheritAttrs: false,
  52. props: radioProps(),
  53. setup(props, _ref) {
  54. let {
  55. emit,
  56. expose,
  57. slots,
  58. attrs
  59. } = _ref;
  60. const formItemContext = (0, _FormItemContext.useInjectFormItemContext)();
  61. const formItemInputContext = _FormItemContext.FormItemInputContext.useInject();
  62. const radioOptionTypeContext = (0, _context.useInjectRadioOptionTypeContext)();
  63. const radioGroupContext = (0, _context.useInjectRadioGroupContext)();
  64. const disabledContext = (0, _DisabledContext.useInjectDisabled)();
  65. const mergedDisabled = (0, _vue.computed)(() => {
  66. var _a;
  67. return (_a = disabled.value) !== null && _a !== void 0 ? _a : disabledContext.value;
  68. });
  69. const vcCheckbox = (0, _vue.ref)();
  70. const {
  71. prefixCls: radioPrefixCls,
  72. direction,
  73. disabled
  74. } = (0, _useConfigInject.default)('radio', props);
  75. const prefixCls = (0, _vue.computed)(() => (radioGroupContext === null || radioGroupContext === void 0 ? void 0 : radioGroupContext.optionType.value) === 'button' || radioOptionTypeContext === 'button' ? `${radioPrefixCls.value}-button` : radioPrefixCls.value);
  76. const contextDisabled = (0, _DisabledContext.useInjectDisabled)();
  77. // Style
  78. const [wrapSSR, hashId] = (0, _style.default)(radioPrefixCls);
  79. const focus = () => {
  80. vcCheckbox.value.focus();
  81. };
  82. const blur = () => {
  83. vcCheckbox.value.blur();
  84. };
  85. expose({
  86. focus,
  87. blur
  88. });
  89. const handleChange = event => {
  90. const targetChecked = event.target.checked;
  91. emit('update:checked', targetChecked);
  92. emit('update:value', targetChecked);
  93. emit('change', event);
  94. formItemContext.onFieldChange();
  95. };
  96. const onChange = e => {
  97. emit('change', e);
  98. if (radioGroupContext && radioGroupContext.onChange) {
  99. radioGroupContext.onChange(e);
  100. }
  101. };
  102. return () => {
  103. var _a;
  104. const radioGroup = radioGroupContext;
  105. const {
  106. prefixCls: customizePrefixCls,
  107. id = formItemContext.id.value
  108. } = props,
  109. restProps = __rest(props, ["prefixCls", "id"]);
  110. const rProps = (0, _extends2.default)((0, _extends2.default)({
  111. prefixCls: prefixCls.value,
  112. id
  113. }, (0, _omit.default)(restProps, ['onUpdate:checked', 'onUpdate:value'])), {
  114. disabled: (_a = disabled.value) !== null && _a !== void 0 ? _a : contextDisabled.value
  115. });
  116. if (radioGroup) {
  117. rProps.name = radioGroup.name.value;
  118. rProps.onChange = onChange;
  119. rProps.checked = props.value === radioGroup.value.value;
  120. rProps.disabled = mergedDisabled.value || radioGroup.disabled.value;
  121. } else {
  122. rProps.onChange = handleChange;
  123. }
  124. const wrapperClassString = (0, _classNames.default)({
  125. [`${prefixCls.value}-wrapper`]: true,
  126. [`${prefixCls.value}-wrapper-checked`]: rProps.checked,
  127. [`${prefixCls.value}-wrapper-disabled`]: rProps.disabled,
  128. [`${prefixCls.value}-wrapper-rtl`]: direction.value === 'rtl',
  129. [`${prefixCls.value}-wrapper-in-form-item`]: formItemInputContext.isFormItemInput
  130. }, attrs.class, hashId.value);
  131. return wrapSSR((0, _vue.createVNode)("label", (0, _objectSpread2.default)((0, _objectSpread2.default)({}, attrs), {}, {
  132. "class": wrapperClassString
  133. }), [(0, _vue.createVNode)(_Checkbox.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, rProps), {}, {
  134. "type": "radio",
  135. "ref": vcCheckbox
  136. }), null), slots.default && (0, _vue.createVNode)("span", null, [slots.default()])]));
  137. };
  138. }
  139. });