You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
InternshipProject/node_modules/rc-textarea/es/ResizableTextArea.js

180 lines
6.1 KiB

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
import * as React from 'react';
import ResizeObserver from 'rc-resize-observer';
import omit from "rc-util/es/omit";
import classNames from 'classnames';
import calculateNodeHeight from './calculateNodeHeight';
import shallowEqual from 'shallowequal'; // eslint-disable-next-line @typescript-eslint/naming-convention
var RESIZE_STATUS;
(function (RESIZE_STATUS) {
RESIZE_STATUS[RESIZE_STATUS["NONE"] = 0] = "NONE";
RESIZE_STATUS[RESIZE_STATUS["RESIZING"] = 1] = "RESIZING";
RESIZE_STATUS[RESIZE_STATUS["RESIZED"] = 2] = "RESIZED";
})(RESIZE_STATUS || (RESIZE_STATUS = {}));
var ResizableTextArea = /*#__PURE__*/function (_React$Component) {
_inherits(ResizableTextArea, _React$Component);
var _super = _createSuper(ResizableTextArea);
function ResizableTextArea(props) {
var _this;
_classCallCheck(this, ResizableTextArea);
_this = _super.call(this, props);
_this.nextFrameActionId = void 0;
_this.resizeFrameId = void 0;
_this.textArea = void 0;
_this.saveTextArea = function (textArea) {
_this.textArea = textArea;
};
_this.handleResize = function (size) {
var resizeStatus = _this.state.resizeStatus;
var _this$props = _this.props,
autoSize = _this$props.autoSize,
onResize = _this$props.onResize;
if (resizeStatus !== RESIZE_STATUS.NONE) {
return;
}
if (typeof onResize === 'function') {
onResize(size);
}
if (autoSize) {
_this.resizeOnNextFrame();
}
};
_this.resizeOnNextFrame = function () {
cancelAnimationFrame(_this.nextFrameActionId);
_this.nextFrameActionId = requestAnimationFrame(_this.resizeTextarea);
};
_this.resizeTextarea = function () {
var autoSize = _this.props.autoSize;
if (!autoSize || !_this.textArea) {
return;
}
var minRows = autoSize.minRows,
maxRows = autoSize.maxRows;
var textareaStyles = calculateNodeHeight(_this.textArea, false, minRows, maxRows);
_this.setState({
textareaStyles: textareaStyles,
resizeStatus: RESIZE_STATUS.RESIZING
}, function () {
cancelAnimationFrame(_this.resizeFrameId);
_this.resizeFrameId = requestAnimationFrame(function () {
_this.setState({
resizeStatus: RESIZE_STATUS.RESIZED
}, function () {
_this.resizeFrameId = requestAnimationFrame(function () {
_this.setState({
resizeStatus: RESIZE_STATUS.NONE
});
_this.fixFirefoxAutoScroll();
});
});
});
});
};
_this.renderTextArea = function () {
var _this$props2 = _this.props,
_this$props2$prefixCl = _this$props2.prefixCls,
prefixCls = _this$props2$prefixCl === void 0 ? 'rc-textarea' : _this$props2$prefixCl,
autoSize = _this$props2.autoSize,
onResize = _this$props2.onResize,
className = _this$props2.className,
disabled = _this$props2.disabled;
var _this$state = _this.state,
textareaStyles = _this$state.textareaStyles,
resizeStatus = _this$state.resizeStatus;
var otherProps = omit(_this.props, ['prefixCls', 'onPressEnter', 'autoSize', 'defaultValue', 'onResize']);
var cls = classNames(prefixCls, className, _defineProperty({}, "".concat(prefixCls, "-disabled"), disabled)); // Fix https://github.com/ant-design/ant-design/issues/6776
// Make sure it could be reset when using form.getFieldDecorator
if ('value' in otherProps) {
otherProps.value = otherProps.value || '';
}
var style = _objectSpread(_objectSpread(_objectSpread({}, _this.props.style), textareaStyles), resizeStatus === RESIZE_STATUS.RESIZING ? // React will warning when mix `overflow` & `overflowY`.
// We need to define this separately.
{
overflowX: 'hidden',
overflowY: 'hidden'
} : null);
return /*#__PURE__*/React.createElement(ResizeObserver, {
onResize: _this.handleResize,
disabled: !(autoSize || onResize)
}, /*#__PURE__*/React.createElement("textarea", _extends({}, otherProps, {
className: cls,
style: style,
ref: _this.saveTextArea
})));
};
_this.state = {
textareaStyles: {},
resizeStatus: RESIZE_STATUS.NONE
};
return _this;
}
_createClass(ResizableTextArea, [{
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
// Re-render with the new content or new autoSize property then recalculate the height as required.
if (prevProps.value !== this.props.value || !shallowEqual(prevProps.autoSize, this.props.autoSize)) {
this.resizeTextarea();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
cancelAnimationFrame(this.nextFrameActionId);
cancelAnimationFrame(this.resizeFrameId);
} // https://github.com/ant-design/ant-design/issues/21870
}, {
key: "fixFirefoxAutoScroll",
value: function fixFirefoxAutoScroll() {
try {
if (document.activeElement === this.textArea) {
var currentStart = this.textArea.selectionStart;
var currentEnd = this.textArea.selectionEnd;
this.textArea.setSelectionRange(currentStart, currentEnd);
}
} catch (e) {// Fix error in Chrome:
// Failed to read the 'selectionStart' property from 'HTMLInputElement'
// http://stackoverflow.com/q/21177489/3040605
}
}
}, {
key: "render",
value: function render() {
return this.renderTextArea();
}
}]);
return ResizableTextArea;
}(React.Component);
export default ResizableTextArea;