"use strict"; var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard"); var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty")); var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck")); var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass")); var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits")); var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn")); var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf")); var React = _interopRequireWildcard(require("react")); var _rcResizeObserver = _interopRequireDefault(require("rc-resize-observer")); var _omit = _interopRequireDefault(require("omit.js")); var _classnames = _interopRequireDefault(require("classnames")); var _calculateNodeHeight = _interopRequireDefault(require("./calculateNodeHeight")); function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; } 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; } } // 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) { (0, _inherits2.default)(ResizableTextArea, _React$Component); var _super = _createSuper(ResizableTextArea); function ResizableTextArea(props) { var _this; (0, _classCallCheck2.default)(this, ResizableTextArea); _this = _super.call(this, props); _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 = (0, _calculateNodeHeight.default)(_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 = (0, _omit.default)(_this.props, ['prefixCls', 'onPressEnter', 'autoSize', 'defaultValue', 'onResize']); var cls = (0, _classnames.default)(prefixCls, className, (0, _defineProperty2.default)({}, "".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 React.createElement(_rcResizeObserver.default, { onResize: _this.handleResize, disabled: !(autoSize || onResize) }, React.createElement("textarea", Object.assign({}, otherProps, { className: cls, style: style, ref: _this.saveTextArea }))); }; _this.state = { textareaStyles: {}, resizeStatus: RESIZE_STATUS.NONE }; return _this; } (0, _createClass2.default)(ResizableTextArea, [{ key: "componentDidMount", value: function componentDidMount() { this.resizeTextarea(); } }, { key: "componentDidUpdate", value: function componentDidUpdate(prevProps) { // Re-render with the new content then recalculate the height as required. if (prevProps.value !== this.props.value) { 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); var _default = ResizableTextArea; exports.default = _default;