UNPKG

choerodon-ui

Version:

An enterprise-class UI design language and React-based implementation

297 lines (256 loc) 8.55 kB
import _objectSpread from "@babel/runtime/helpers/objectSpread2"; import _defineProperty from "@babel/runtime/helpers/defineProperty"; import _extends from "@babel/runtime/helpers/extends"; import _classCallCheck from "@babel/runtime/helpers/classCallCheck"; import _createClass from "@babel/runtime/helpers/createClass"; import _get from "@babel/runtime/helpers/get"; import _inherits from "@babel/runtime/helpers/inherits"; import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn"; import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf"; function _createSuper(Derived) { function isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } return function () { var Super = _getPrototypeOf(Derived), result; if (isNativeReflectConstruct()) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } import { __decorate } from "tslib"; import React from 'react'; import PropTypes from 'prop-types'; import { action, computed } from 'mobx'; import { observer } from 'mobx-react'; import omit from 'lodash/omit'; import noop from 'lodash/noop'; import { FormField } from '../field/FormField'; import autobind from '../_util/autobind'; import { ViewMode } from './enum'; import { $l } from '../locale-context'; import { LabelLayout } from '../form/enum'; export var Radio = /*#__PURE__*/ function (_FormField) { _inherits(Radio, _FormField); var _super = _createSuper(Radio); function Radio() { var _this; _classCallCheck(this, Radio); _this = _super.apply(this, arguments); _this.type = 'radio'; return _this; } _createClass(Radio, [{ key: "getOtherProps", value: function getOtherProps() { var otherProps = omit(_get(_getPrototypeOf(Radio.prototype), "getOtherProps", this).call(this), ['value', 'readOnly', 'mode']); otherProps.type = this.type; // if (this.isReadOnly()) { // otherProps.disabled = true; // } otherProps.onMouseDown = this.handleMouseDown; otherProps.onClick = otherProps.onChange; otherProps.onChange = noop; return otherProps; } }, { key: "renderWrapper", value: function renderWrapper() { var checked = this.isChecked(); return React.createElement(React.Fragment, null, React.createElement("label", _extends({ key: "wrapper" }, this.getWrapperProps()), React.createElement("input", _extends({}, this.getOtherProps(), { checked: checked, value: this.checkedValue })), this.renderInner(), this.getTextNode(), this.renderFloatLabel()), _get(_getPrototypeOf(Radio.prototype), "hasFloatLabel", this) ? this.renderSwitchFloatLabel() : undefined); } /** * 解决form 在float的时候没有表头的问题 * 也可以在需要不在组件内部展现label的时候使用 */ }, { key: "renderSwitchFloatLabel", value: function renderSwitchFloatLabel() { return undefined; } }, { key: "renderInner", value: function renderInner() { return React.createElement("span", { className: "".concat(this.prefixCls, "-inner") }); } /** * 当使用label代替children时,不需要展示float label * * @readonly * @memberof Radio */ }, { key: "getLabelChildren", /** * 没有children时,使用label替代children * * @returns {ReactNode} label * @memberof Radio */ value: function getLabelChildren() { var labelLayout = this.labelLayout; return labelLayout && ![LabelLayout.horizontal, LabelLayout.vertical, LabelLayout.none].includes(labelLayout) && this.getLabel(); } }, { key: "getChildrenText", value: function getChildrenText() { return this.props.children; } }, { key: "getTextNode", value: function getTextNode() { var prefixCls = this.prefixCls; var text = this.getChildrenText() || this.getLabelChildren(); if (text) { return React.createElement("span", { className: "".concat(prefixCls, "-label") }, text); } } }, { key: "getWrapperClassNames", value: function getWrapperClassNames() { var _get2; var prefixCls = this.prefixCls, mode = this.props.mode; for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { args[_key] = arguments[_key]; } return (_get2 = _get(_getPrototypeOf(Radio.prototype), "getWrapperClassNames", this)).call.apply(_get2, [this, _defineProperty({}, "".concat(prefixCls, "-button"), mode === ViewMode.button)].concat(args)); } }, { key: "isChecked", value: function isChecked() { var checked = this.props.checked; var name = this.name, dataSet = this.dataSet, checkedValue = this.checkedValue; if (dataSet && name) { return this.getDataSetValue() === checkedValue; } return checked; } }, { key: "handleMouseDown", value: function handleMouseDown(e) { // e.stopPropagation(); var onMouseDown = this.props.onMouseDown; if (typeof onMouseDown === 'function') { onMouseDown(e); } } }, { key: "handleChange", value: function handleChange(e) { var _this$props$onClick = this.props.onClick, onClick = _this$props$onClick === void 0 ? noop : _this$props$onClick; var checked = e.target.checked; onClick(e); this.setChecked(checked); } }, { key: "setChecked", value: function setChecked(checked) { if (checked) { this.setValue(this.checkedValue); } } }, { key: "getOldValue", value: function getOldValue() { return this.isChecked() ? this.checkedValue : undefined; } }, { key: "defaultValidationMessages", get: function get() { var label = this.getProp('label'); return { valueMissing: $l('Radio', label ? 'value_missing' : 'value_missing_no_label', { label: label }) }; } }, { key: "checkedValue", get: function get() { var _this$props$value = this.props.value, value = _this$props$value === void 0 ? 'on' : _this$props$value; return value; } }, { key: "isControlled", get: function get() { return this.props.checked !== undefined; } }, { key: "hasFloatLabel", get: function get() { return this.getLabelChildren() ? false : _get(_getPrototypeOf(Radio.prototype), "hasFloatLabel", this); } }]); return Radio; }(FormField); Radio.displayName = 'Radio'; Radio.propTypes = _objectSpread({ /** * <受控>是否选中 */ checked: PropTypes.bool, /** * 初始是否选中 */ defaultChecked: PropTypes.bool, /** * 显示模式 * 可选值: button | box * @default box */ mode: PropTypes.oneOf([ViewMode.button, ViewMode.box]) }, FormField.propTypes); Radio.defaultProps = _objectSpread({}, FormField.defaultProps, { suffixCls: 'radio' }); // eslint-disable-next-line camelcase Radio.__PRO_RADIO = true; // eslint-disable-next-line camelcase Radio.__IS_IN_CELL_EDITOR = true; __decorate([computed], Radio.prototype, "defaultValidationMessages", null); __decorate([autobind], Radio.prototype, "handleMouseDown", null); __decorate([autobind], Radio.prototype, "handleChange", null); __decorate([action], Radio.prototype, "setChecked", null); var ObserverRadio = /*#__PURE__*/ function (_Radio) { _inherits(ObserverRadio, _Radio); var _super2 = _createSuper(ObserverRadio); function ObserverRadio() { _classCallCheck(this, ObserverRadio); return _super2.apply(this, arguments); } return ObserverRadio; }(Radio); ObserverRadio.defaultProps = Radio.defaultProps; // eslint-disable-next-line camelcase ObserverRadio.__PRO_RADIO = true; // eslint-disable-next-line camelcase ObserverRadio.__IS_IN_CELL_EDITOR = true; ObserverRadio = __decorate([observer], ObserverRadio); export default ObserverRadio; //# sourceMappingURL=Radio.js.map