@txdfe/at
Version:
一个设计体系组件库
294 lines (288 loc) • 11.6 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _classnames = _interopRequireDefault(require("classnames"));
var _util = require("../util");
var _zhCn = _interopRequireDefault(require("../locale/zh-cn"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
function _possibleConstructorReturn(t, e) { if (e && ("object" == _typeof(e) || "function" == typeof e)) return e; if (void 0 !== e) throw new TypeError("Derived constructors may only return object or undefined"); return _assertThisInitialized(t); }
function _assertThisInitialized(e) { if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); return e; }
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
function _getPrototypeOf(t) { return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) { return t.__proto__ || Object.getPrototypeOf(t); }, _getPrototypeOf(t); }
function _inherits(t, e) { if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function"); t.prototype = Object.create(e && e.prototype, { constructor: { value: t, writable: !0, configurable: !0 } }), Object.defineProperty(t, "prototype", { writable: !1 }), e && _setPrototypeOf(t, e); }
function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
var Base = /*#__PURE__*/function (_React$Component) {
function Base() {
var _this;
_classCallCheck(this, Base);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _callSuper(this, Base, [].concat(args));
_defineProperty(_this, "saveRef", function (input) {
_this.inputRef = input;
});
return _this;
}
_inherits(Base, _React$Component);
return _createClass(Base, [{
key: "UNSAFE_componentWillReceiveProps",
value: function UNSAFE_componentWillReceiveProps(nextProps) {
if ('value' in nextProps) {
this.setState({
value: typeof nextProps.value === 'undefined' ? '' : nextProps.value
});
}
}
}, {
key: "ieHack",
value: function ieHack(value) {
return value;
}
}, {
key: "onChange",
value: function onChange(e) {
var value = e.target.value;
if (this.props.trim) {
value = value.trim();
}
value = this.ieHack(value);
// not controlled
if (!('value' in this.props)) {
this.setState({
value: value
});
}
// Number('') = 0
if (value && this.props.htmlType === 'number') {
value = Number(value);
}
this.props.onChange(value, e);
}
}, {
key: "onKeyDown",
value: function onKeyDown(e) {
var value = e.target.value;
var maxLength = this.props.maxLength;
var len = maxLength > 0 && value ? this.getValueLength(value) : 0;
var opts = {};
// has enable trim and has input whitespace
if (this.props.trim && e.keyCode === 32) {
opts.beTrimed = true;
}
// has defined maxLength and has over max length and has not input backspace and delete
if (maxLength > 0 && (len > maxLength + 1 || (len === maxLength || len === maxLength + 1) && e.keyCode !== 8 && e.keyCode !== 46)) {
opts.overMaxLength = true;
}
this.props.onKeyDown(e, opts);
}
}, {
key: "onFocus",
value: function onFocus(e) {
this.setState({
focus: true
});
this.props.onFocus(e);
}
}, {
key: "onBlur",
value: function onBlur(e) {
this.setState({
focus: false
});
this.props.onBlur(e);
}
}, {
key: "renderLength",
value: function renderLength() {
var _this$props = this.props,
maxLength = _this$props.maxLength,
hasLimitHint = _this$props.hasLimitHint,
prefix = _this$props.prefix,
rtl = _this$props.rtl;
var len = maxLength > 0 && this.state.value ? this.getValueLength(this.state.value) : 0;
var classesLenWrap = (0, _classnames["default"])(_defineProperty(_defineProperty({}, "".concat(prefix, "input-len"), true), "".concat(prefix, "error"), len > maxLength));
var content = rtl ? "".concat(maxLength, "/").concat(len) : "".concat(len, "/").concat(maxLength);
return maxLength && hasLimitHint ? /*#__PURE__*/_react["default"].createElement("span", {
className: classesLenWrap
}, content) : null;
}
}, {
key: "renderControl",
value: function renderControl() {
var lenWrap = this.renderLength();
return lenWrap ? /*#__PURE__*/_react["default"].createElement("span", {
className: "".concat(this.props.prefix, "input-control")
}, lenWrap) : null;
}
}, {
key: "getClass",
value: function getClass() {
var _this$props2 = this.props,
disabled = _this$props2.disabled,
state = _this$props2.state,
prefix = _this$props2.prefix;
return (0, _classnames["default"])(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefix, "input"), true), "".concat(prefix, "disabled"), !!disabled), "".concat(prefix, "error"), state === 'error'), "".concat(prefix, "success"), state === 'success'), "".concat(prefix, "focus"), this.state.focus));
}
}, {
key: "getProps",
value: function getProps() {
var _this$props3 = this.props,
placeholder = _this$props3.placeholder,
inputStyle = _this$props3.inputStyle,
disabled = _this$props3.disabled,
readOnly = _this$props3.readOnly,
cutString = _this$props3.cutString,
maxLength = _this$props3.maxLength,
name = _this$props3.name;
var props = {
style: inputStyle,
placeholder: placeholder,
disabled: disabled,
readOnly: readOnly,
name: name,
maxLength: cutString ? maxLength : undefined,
value: this.state.value,
onChange: this.onChange.bind(this),
onBlur: this.onBlur.bind(this),
onFocus: this.onFocus.bind(this)
};
// fix accessibility：auto process status of aria disabled
if (disabled) {
props['aria-disabled'] = disabled;
}
return props;
}
}, {
key: "getInputNode",
value: function getInputNode() {
return this.inputRef;
}
}, {
key: "focus",
value: function focus(start, end) {
this.inputRef.focus();
if (typeof start !== 'undefined') {
this.inputRef.selectionStart = start;
}
if (typeof end !== 'undefined') {
this.inputRef.selectionEnd = end;
}
}
}]);
}(_react["default"].Component);
_defineProperty(Base, "propTypes", {
prefix: _propTypes["default"].string,
/**
* 当前值
*/
value: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
/**
* 初始化值
*/
defaultValue: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
/**
* 发生改变的时候触发的回调
* @param {String} value 数据
* @param {Event} e DOM事件对象
*/
onChange: _propTypes["default"].func,
/**
* 键盘按下的时候触发的回调
* @param {Event} e DOM事件对象
* @param {Object} opts 可扩展的附加信息：<br> - opts.overMaxLength: {Boolean} 已超出最大长度<br> - opts.beTrimed: {Boolean} 输入的空格被清理
*/
onKeyDown: _propTypes["default"].func,
/**
* 禁用状态
*/
disabled: _propTypes["default"].bool,
/**
* 最大长度
*/
maxLength: _propTypes["default"].number,
/**
* 是否展现最大长度样式
*/
hasLimitHint: _propTypes["default"].bool,
/**
* 当设置了maxLength时，是否截断超出字符串
*/
cutString: _propTypes["default"].bool,
/**
* 只读
*/
readOnly: _propTypes["default"].bool,
/**
* onChange返回会自动去除头尾空字符
*/
trim: _propTypes["default"].bool,
/**
* 输入提示
*/
placeholder: _propTypes["default"].string,
/**
* 获取焦点时候触发的回调
* @param {Event} e DOM事件对象
*/
onFocus: _propTypes["default"].func,
/**
* 失去焦点时候触发的回调
* @param {Event} e DOM事件对象
*/
onBlur: _propTypes["default"].func,
/**
* 自定义字符串计算长度方式
* @param {String} value 数据
* @returns {Number} 自定义长度
*/
getValueLength: _propTypes["default"].func,
inputStyle: _propTypes["default"].object,
/**
* 自定义class
*/
className: _propTypes["default"].string,
/**
* 自定义内联样式
*/
style: _propTypes["default"].object,
/**
* 原生type
*/
htmlType: _propTypes["default"].string,
/**
* name
*/
name: _propTypes["default"].string,
rtl: _propTypes["default"].bool,
state: _propTypes["default"].oneOf(['error', 'loading', 'success']),
locale: _propTypes["default"].object
});
_defineProperty(Base, "defaultProps", {
disabled: false,
prefix: 'next-',
maxLength: null,
hasLimitHint: false,
cutString: true,
readOnly: false,
trim: false,
onFocus: _util.func.noop,
onBlur: _util.func.noop,
onChange: _util.func.noop,
onKeyDown: _util.func.noop,
getValueLength: _util.func.noop,
locale: _zhCn["default"].Input
});
var _default = exports["default"] = Base;