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.
209 lines
8.3 KiB
209 lines
8.3 KiB
"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; |