1 | "use strict";
|
2 |
|
3 | var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
4 | var _typeof = require("@babel/runtime/helpers/typeof");
|
5 | Object.defineProperty(exports, "__esModule", {
|
6 | value: true
|
7 | });
|
8 | exports.default = void 0;
|
9 | var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
10 | var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
11 | var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
12 | var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
13 | var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
14 | var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
15 | var _classnames = _interopRequireDefault(require("classnames"));
|
16 | var _useMergedState3 = _interopRequireDefault(require("rc-util/lib/hooks/useMergedState"));
|
17 | var _omit = _interopRequireDefault(require("rc-util/lib/omit"));
|
18 | var _react = _interopRequireWildcard(require("react"));
|
19 | var _BaseInput = _interopRequireDefault(require("./BaseInput"));
|
20 | var _useCount = _interopRequireDefault(require("./hooks/useCount"));
|
21 | var _commonUtils = require("./utils/commonUtils");
|
22 | var _excluded = ["autoComplete", "onChange", "onFocus", "onBlur", "onPressEnter", "onKeyDown", "prefixCls", "disabled", "htmlSize", "className", "maxLength", "suffix", "showCount", "count", "type", "classes", "classNames", "styles", "onCompositionStart", "onCompositionEnd"];
|
23 | function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
24 | function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
25 | var Input = (0, _react.forwardRef)(function (props, ref) {
|
26 | var autoComplete = props.autoComplete,
|
27 | onChange = props.onChange,
|
28 | onFocus = props.onFocus,
|
29 | onBlur = props.onBlur,
|
30 | onPressEnter = props.onPressEnter,
|
31 | onKeyDown = props.onKeyDown,
|
32 | _props$prefixCls = props.prefixCls,
|
33 | prefixCls = _props$prefixCls === void 0 ? 'rc-input' : _props$prefixCls,
|
34 | disabled = props.disabled,
|
35 | htmlSize = props.htmlSize,
|
36 | className = props.className,
|
37 | maxLength = props.maxLength,
|
38 | suffix = props.suffix,
|
39 | showCount = props.showCount,
|
40 | count = props.count,
|
41 | _props$type = props.type,
|
42 | type = _props$type === void 0 ? 'text' : _props$type,
|
43 | classes = props.classes,
|
44 | classNames = props.classNames,
|
45 | styles = props.styles,
|
46 | _onCompositionStart = props.onCompositionStart,
|
47 | onCompositionEnd = props.onCompositionEnd,
|
48 | rest = (0, _objectWithoutProperties2.default)(props, _excluded);
|
49 | var _useState = (0, _react.useState)(false),
|
50 | _useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
51 | focused = _useState2[0],
|
52 | setFocused = _useState2[1];
|
53 | var compositionRef = _react.default.useRef(false);
|
54 | var inputRef = (0, _react.useRef)(null);
|
55 | var focus = function focus(option) {
|
56 | if (inputRef.current) {
|
57 | (0, _commonUtils.triggerFocus)(inputRef.current, option);
|
58 | }
|
59 | };
|
60 |
|
61 |
|
62 | var _useMergedState = (0, _useMergedState3.default)(props.defaultValue, {
|
63 | value: props.value
|
64 | }),
|
65 | _useMergedState2 = (0, _slicedToArray2.default)(_useMergedState, 2),
|
66 | value = _useMergedState2[0],
|
67 | setValue = _useMergedState2[1];
|
68 | var formatValue = value === undefined || value === null ? '' : String(value);
|
69 |
|
70 |
|
71 | var _React$useState = _react.default.useState(null),
|
72 | _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
|
73 | selection = _React$useState2[0],
|
74 | setSelection = _React$useState2[1];
|
75 |
|
76 |
|
77 | var countConfig = (0, _useCount.default)(count, showCount);
|
78 | var mergedMax = countConfig.max || maxLength;
|
79 | var valueLength = countConfig.strategy(formatValue);
|
80 | var isOutOfRange = !!mergedMax && valueLength > mergedMax;
|
81 |
|
82 |
|
83 | (0, _react.useImperativeHandle)(ref, function () {
|
84 | return {
|
85 | focus: focus,
|
86 | blur: function blur() {
|
87 | var _inputRef$current;
|
88 | (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.blur();
|
89 | },
|
90 | setSelectionRange: function setSelectionRange(start, end, direction) {
|
91 | var _inputRef$current2;
|
92 | (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 || _inputRef$current2.setSelectionRange(start, end, direction);
|
93 | },
|
94 | select: function select() {
|
95 | var _inputRef$current3;
|
96 | (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 || _inputRef$current3.select();
|
97 | },
|
98 | input: inputRef.current
|
99 | };
|
100 | });
|
101 | (0, _react.useEffect)(function () {
|
102 | setFocused(function (prev) {
|
103 | return prev && disabled ? false : prev;
|
104 | });
|
105 | }, [disabled]);
|
106 | var triggerChange = function triggerChange(e, currentValue) {
|
107 | var cutValue = currentValue;
|
108 | if (!compositionRef.current && countConfig.exceedFormatter && countConfig.max && countConfig.strategy(currentValue) > countConfig.max) {
|
109 | cutValue = countConfig.exceedFormatter(currentValue, {
|
110 | max: countConfig.max
|
111 | });
|
112 | if (currentValue !== cutValue) {
|
113 | var _inputRef$current4, _inputRef$current5;
|
114 | setSelection([((_inputRef$current4 = inputRef.current) === null || _inputRef$current4 === void 0 ? void 0 : _inputRef$current4.selectionStart) || 0, ((_inputRef$current5 = inputRef.current) === null || _inputRef$current5 === void 0 ? void 0 : _inputRef$current5.selectionEnd) || 0]);
|
115 | }
|
116 | }
|
117 | setValue(cutValue);
|
118 | if (inputRef.current) {
|
119 | (0, _commonUtils.resolveOnChange)(inputRef.current, e, onChange, cutValue);
|
120 | }
|
121 | };
|
122 | _react.default.useEffect(function () {
|
123 | if (selection) {
|
124 | var _inputRef$current6;
|
125 | (_inputRef$current6 = inputRef.current) === null || _inputRef$current6 === void 0 || _inputRef$current6.setSelectionRange.apply(_inputRef$current6, (0, _toConsumableArray2.default)(selection));
|
126 | }
|
127 | }, [selection]);
|
128 | var onInternalChange = function onInternalChange(e) {
|
129 | triggerChange(e, e.target.value);
|
130 | };
|
131 | var onInternalCompositionEnd = function onInternalCompositionEnd(e) {
|
132 | compositionRef.current = false;
|
133 | triggerChange(e, e.currentTarget.value);
|
134 | onCompositionEnd === null || onCompositionEnd === void 0 || onCompositionEnd(e);
|
135 | };
|
136 | var handleKeyDown = function handleKeyDown(e) {
|
137 | if (onPressEnter && e.key === 'Enter') {
|
138 | onPressEnter(e);
|
139 | }
|
140 | onKeyDown === null || onKeyDown === void 0 || onKeyDown(e);
|
141 | };
|
142 | var handleFocus = function handleFocus(e) {
|
143 | setFocused(true);
|
144 | onFocus === null || onFocus === void 0 || onFocus(e);
|
145 | };
|
146 | var handleBlur = function handleBlur(e) {
|
147 | setFocused(false);
|
148 | onBlur === null || onBlur === void 0 || onBlur(e);
|
149 | };
|
150 | var handleReset = function handleReset(e) {
|
151 | setValue('');
|
152 | focus();
|
153 | if (inputRef.current) {
|
154 | (0, _commonUtils.resolveOnChange)(inputRef.current, e, onChange);
|
155 | }
|
156 | };
|
157 |
|
158 |
|
159 | var outOfRangeCls = isOutOfRange && "".concat(prefixCls, "-out-of-range");
|
160 | var getInputElement = function getInputElement() {
|
161 |
|
162 | var otherProps = (0, _omit.default)(props, ['prefixCls', 'onPressEnter', 'addonBefore', 'addonAfter', 'prefix', 'suffix', 'allowClear',
|
163 |
|
164 |
|
165 | 'defaultValue', 'showCount', 'count', 'classes', 'htmlSize', 'styles', 'classNames']);
|
166 | return _react.default.createElement("input", (0, _extends2.default)({
|
167 | autoComplete: autoComplete
|
168 | }, otherProps, {
|
169 | onChange: onInternalChange,
|
170 | onFocus: handleFocus,
|
171 | onBlur: handleBlur,
|
172 | onKeyDown: handleKeyDown,
|
173 | className: (0, _classnames.default)(prefixCls, (0, _defineProperty2.default)({}, "".concat(prefixCls, "-disabled"), disabled), classNames === null || classNames === void 0 ? void 0 : classNames.input),
|
174 | style: styles === null || styles === void 0 ? void 0 : styles.input,
|
175 | ref: inputRef,
|
176 | size: htmlSize,
|
177 | type: type,
|
178 | onCompositionStart: function onCompositionStart(e) {
|
179 | compositionRef.current = true;
|
180 | _onCompositionStart === null || _onCompositionStart === void 0 || _onCompositionStart(e);
|
181 | },
|
182 | onCompositionEnd: onInternalCompositionEnd
|
183 | }));
|
184 | };
|
185 | var getSuffix = function getSuffix() {
|
186 |
|
187 | var hasMaxLength = Number(mergedMax) > 0;
|
188 | if (suffix || countConfig.show) {
|
189 | var dataCount = countConfig.showFormatter ? countConfig.showFormatter({
|
190 | value: formatValue,
|
191 | count: valueLength,
|
192 | maxLength: mergedMax
|
193 | }) : "".concat(valueLength).concat(hasMaxLength ? " / ".concat(mergedMax) : '');
|
194 | return _react.default.createElement(_react.default.Fragment, null, countConfig.show && _react.default.createElement("span", {
|
195 | className: (0, _classnames.default)("".concat(prefixCls, "-show-count-suffix"), (0, _defineProperty2.default)({}, "".concat(prefixCls, "-show-count-has-suffix"), !!suffix), classNames === null || classNames === void 0 ? void 0 : classNames.count),
|
196 | style: (0, _objectSpread2.default)({}, styles === null || styles === void 0 ? void 0 : styles.count)
|
197 | }, dataCount), suffix);
|
198 | }
|
199 | return null;
|
200 | };
|
201 |
|
202 |
|
203 | return _react.default.createElement(_BaseInput.default, (0, _extends2.default)({}, rest, {
|
204 | prefixCls: prefixCls,
|
205 | className: (0, _classnames.default)(className, outOfRangeCls),
|
206 | handleReset: handleReset,
|
207 | value: formatValue,
|
208 | focused: focused,
|
209 | triggerFocus: focus,
|
210 | suffix: getSuffix(),
|
211 | disabled: disabled,
|
212 | classes: classes,
|
213 | classNames: classNames,
|
214 | styles: styles
|
215 | }), getInputElement());
|
216 | });
|
217 | var _default = exports.default = Input; |
\ | No newline at end of file |