rc-textarea - npm Package Compare versions

Comparing version 0.4.7 to 1.0.0-1

es/calculateNodeHeight.d.ts

@@ -1,5 +0,2 @@
-/**
- * calculateNodeHeight(uiTextNode, useCache = false)
- */
-/// <reference types="react" />
+import type React from 'react';
 export interface NodeType {
@@ -6,0 +3,0 @@ sizingStyle: string;

es/calculateNodeHeight.js

 // Thanks to https://github.com/andreypopp/react-textarea-autosize/
+
 /**
@@ -12,5 +13,7 @@ * calculateNodeHeight(uiTextNode, useCache = false)
   var nodeRef = node.getAttribute('id') || node.getAttribute('data-reactid') || node.getAttribute('name');
+
   if (useCache && computedStyleCache[nodeRef]) {
     return computedStyleCache[nodeRef];
   }
+
   var style = window.getComputedStyle(node);
@@ -29,5 +32,7 @@ var boxSizing = style.getPropertyValue('box-sizing') || style.getPropertyValue('-moz-box-sizing') || style.getPropertyValue('-webkit-box-sizing');
   };
+
   if (useCache && nodeRef) {
     computedStyleCache[nodeRef] = nodeInfo;
   }
+
   return nodeInfo;
@@ -39,2 +44,3 @@ }
   var maxRows = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
+
   if (!hiddenTextarea) {
@@ -45,5 +51,6 @@ hiddenTextarea = document.createElement('textarea');
     document.body.appendChild(hiddenTextarea);
-  }
-  // Fix wrap="off" issue
+  } // Fix wrap="off" issue
   // https://github.com/ant-design/ant-design/issues/6577
+
+
   if (uiTextNode.getAttribute('wrap')) {
@@ -53,13 +60,15 @@ hiddenTextarea.setAttribute('wrap', uiTextNode.getAttribute('wrap'));
     hiddenTextarea.removeAttribute('wrap');
-  }
-  // Copy all CSS properties that have an impact on the height of the content in
+  } // Copy all CSS properties that have an impact on the height of the content in
   // the textbox
+
+
   var _calculateNodeStyling = calculateNodeStyling(uiTextNode, useCache),
-    paddingSize = _calculateNodeStyling.paddingSize,
-    borderSize = _calculateNodeStyling.borderSize,
-    boxSizing = _calculateNodeStyling.boxSizing,
-    sizingStyle = _calculateNodeStyling.sizingStyle;
-  // Need to have the overflow attribute to hide the scrollbar otherwise
+      paddingSize = _calculateNodeStyling.paddingSize,
+      borderSize = _calculateNodeStyling.borderSize,
+      boxSizing = _calculateNodeStyling.boxSizing,
+      sizingStyle = _calculateNodeStyling.sizingStyle; // Need to have the overflow attribute to hide the scrollbar otherwise
   // text-lines will not calculated properly as the shadow will technically be
   // narrower for content
+
+
   hiddenTextarea.setAttribute('style', "".concat(sizingStyle, ";").concat(HIDDEN_TEXTAREA_STYLE));
@@ -71,2 +80,3 @@ hiddenTextarea.value = uiTextNode.value || uiTextNode.placeholder || '';
   var height = hiddenTextarea.scrollHeight;
+
   if (boxSizing === 'border-box') {
@@ -79,2 +89,3 @@ // border-box: add border, since height = content + padding + border
   }
+
   if (minRows !== null || maxRows !== null) {
@@ -84,14 +95,20 @@ // measure height of a textarea with a single row
     var singleRowHeight = hiddenTextarea.scrollHeight - paddingSize;
+
     if (minRows !== null) {
       minHeight = singleRowHeight * minRows;
+
       if (boxSizing === 'border-box') {
         minHeight = minHeight + paddingSize + borderSize;
       }
+
       height = Math.max(minHeight, height);
     }
+
     if (maxRows !== null) {
       maxHeight = singleRowHeight * maxRows;
+
       if (boxSizing === 'border-box') {
         maxHeight = maxHeight + paddingSize + borderSize;
       }
+
       overflowY = height > maxHeight ? '' : 'hidden';
@@ -101,2 +118,3 @@ height = Math.min(maxHeight, height);
   }
+
   var style = {
@@ -107,9 +125,12 @@ height: height,
   };
+
   if (minHeight) {
     style.minHeight = minHeight;
   }
+
   if (maxHeight) {
     style.maxHeight = maxHeight;
   }
+
   return style;
 }

es/index.d.ts

@@ -1,36 +0,4 @@
-import * as React from 'react';
-import ResizableTextArea from './ResizableTextArea';
-import type { ResizableTextAreaRef } from './ResizableTextArea';
-import type { AutoSizeType } from './ResizableTextArea';
-export type HTMLTextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;
-export interface TextAreaProps extends Omit<HTMLTextareaProps, 'onResize'> {
-    prefixCls?: string;
-    className?: string;
-    style?: React.CSSProperties;
-    autoSize?: boolean | AutoSizeType;
-    onPressEnter?: React.KeyboardEventHandler<HTMLTextAreaElement>;
-    onResize?: (size: {
-        width: number;
-        height: number;
-    }) => void;
-}
-export interface TextAreaState {
-    value: any;
-}
-declare class TextArea extends React.Component<TextAreaProps, TextAreaState> {
-    resizableTextArea: ResizableTextAreaRef;
-    constructor(props: TextAreaProps);
-    static getDerivedStateFromProps(nextProps: TextAreaProps): {
-        value: string | number | readonly string[];
-    };
-    setValue(value: string, callback?: () => void): void;
-    focus: () => void;
-    blur(): void;
-    saveTextArea: (resizableTextArea: ResizableTextAreaRef) => void;
-    handleChange: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
-    handleKeyDown: (e: React.KeyboardEvent<HTMLTextAreaElement>) => void;
-    render(): JSX.Element;
-}
-export { ResizableTextArea };
-export type { AutoSizeType };
+import TextArea from './TextArea';
+export { default as ResizableTextArea } from './ResizableTextArea';
+export type { AutoSizeType, ResizableTextAreaRef, TextAreaProps, TextAreaRef, } from './interface';
 export default TextArea;

es/index.js

@@ -1,84 +0,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-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 ResizableTextArea from './ResizableTextArea';
-var TextArea = /*#__PURE__*/function (_React$Component) {
-  _inherits(TextArea, _React$Component);
-  var _super = _createSuper(TextArea);
-  function TextArea(props) {
-    var _this;
-    _classCallCheck(this, TextArea);
-    _this = _super.call(this, props);
-    _this.resizableTextArea = void 0;
-    _this.focus = function () {
-      _this.resizableTextArea.textArea.focus();
-    };
-    _this.saveTextArea = function (resizableTextArea) {
-      _this.resizableTextArea = resizableTextArea;
-    };
-    _this.handleChange = function (e) {
-      var onChange = _this.props.onChange;
-      _this.setValue(e.target.value);
-      if (onChange) {
-        onChange(e);
-      }
-    };
-    _this.handleKeyDown = function (e) {
-      var _this$props = _this.props,
-        onPressEnter = _this$props.onPressEnter,
-        onKeyDown = _this$props.onKeyDown;
-      if (e.keyCode === 13 && onPressEnter) {
-        onPressEnter(e);
-      }
-      if (onKeyDown) {
-        onKeyDown(e);
-      }
-    };
-    var value = typeof props.value === 'undefined' || props.value === null ? props.defaultValue : props.value;
-    _this.state = {
-      value: value
-    };
-    return _this;
-  }
-  _createClass(TextArea, [{
-    key: "setValue",
-    value: function setValue(value, callback) {
-      if (!('value' in this.props)) {
-        this.setState({
-          value: value
-        }, callback);
-      }
-    }
-  }, {
-    key: "blur",
-    value: function blur() {
-      this.resizableTextArea.textArea.blur();
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      return /*#__PURE__*/React.createElement(ResizableTextArea, _extends({}, this.props, {
-        value: this.state.value,
-        onKeyDown: this.handleKeyDown,
-        onChange: this.handleChange,
-        ref: this.saveTextArea
-      }));
-    }
-  }], [{
-    key: "getDerivedStateFromProps",
-    value: function getDerivedStateFromProps(nextProps) {
-      if ('value' in nextProps) {
-        return {
-          value: nextProps.value
-        };
-      }
-      return null;
-    }
-  }]);
-  return TextArea;
-}(React.Component);
-export { ResizableTextArea };
+import TextArea from "./TextArea";
+export { default as ResizableTextArea } from "./ResizableTextArea";
 export default TextArea;

es/ResizableTextArea.d.ts

 import * as React from 'react';
-import type { TextAreaProps } from '.';
-export interface AutoSizeType {
-    minRows?: number;
-    maxRows?: number;
-}
-export interface ResizableTextAreaRef {
-    textArea: HTMLTextAreaElement;
-}
-declare const ResizableTextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<ResizableTextAreaRef>>;
+import { ResizableTextAreaRef } from './interface';
+declare const ResizableTextArea: React.ForwardRefExoticComponent<Omit<import("./interface").HTMLTextareaProps, "onResize"> & {
+    prefixCls?: string;
+    className?: string;
+    style?: React.CSSProperties;
+    autoSize?: boolean | import("./interface").AutoSizeType;
+    onPressEnter?: React.KeyboardEventHandler<HTMLTextAreaElement>;
+    onResize?: (size: {
+        width: number;
+        height: number;
+    }) => void;
+    showCount?: boolean | import("rc-input/lib/interface").ShowCountProps;
+} & Pick<import("rc-input/lib/interface").BaseInputProps, "allowClear" | "suffix" | "affixWrapperClassName"> & React.RefAttributes<ResizableTextAreaRef>>;
 export default ResizableTextArea;

es/ResizableTextArea.js

@@ -14,3 +14,3 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import classNames from 'classnames';
-import calculateAutoSizeStyle from './calculateNodeHeight';
+import calculateAutoSizeStyle from "./calculateNodeHeight";
 var RESIZE_START = 0;
@@ -20,30 +20,34 @@ var RESIZE_MEASURING = 1;
 var ResizableTextArea = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var _props$prefixCls = props.prefixCls,
-    prefixCls = _props$prefixCls === void 0 ? 'rc-textarea' : _props$prefixCls,
-    onPressEnter = props.onPressEnter,
-    defaultValue = props.defaultValue,
-    value = props.value,
-    autoSize = props.autoSize,
-    onResize = props.onResize,
-    className = props.className,
-    style = props.style,
-    disabled = props.disabled,
-    onChange = props.onChange,
-    onInternalAutoSize = props.onInternalAutoSize,
-    restProps = _objectWithoutProperties(props, _excluded);
-  // =============================== Value ================================
+  var _ref = props,
+      _ref$prefixCls = _ref.prefixCls,
+      prefixCls = _ref$prefixCls === void 0 ? 'rc-textarea' : _ref$prefixCls,
+      onPressEnter = _ref.onPressEnter,
+      defaultValue = _ref.defaultValue,
+      value = _ref.value,
+      autoSize = _ref.autoSize,
+      onResize = _ref.onResize,
+      className = _ref.className,
+      style = _ref.style,
+      disabled = _ref.disabled,
+      onChange = _ref.onChange,
+      onInternalAutoSize = _ref.onInternalAutoSize,
+      restProps = _objectWithoutProperties(_ref, _excluded); // =============================== Value ================================
+
+
   var _useMergedState = useMergedState(defaultValue, {
-      value: value,
-      postState: function postState(val) {
-        return val !== null && val !== void 0 ? val : '';
-      }
-    }),
-    _useMergedState2 = _slicedToArray(_useMergedState, 2),
-    mergedValue = _useMergedState2[0],
-    setMergedValue = _useMergedState2[1];
+    value: value,
+    postState: function postState(val) {
+      return val !== null && val !== void 0 ? val : '';
+    }
+  }),
+      _useMergedState2 = _slicedToArray(_useMergedState, 2),
+      mergedValue = _useMergedState2[0],
+      setMergedValue = _useMergedState2[1];
+
   var onInternalChange = function onInternalChange(event) {
     setMergedValue(event.target.value);
     onChange === null || onChange === void 0 ? void 0 : onChange(event);
-  };
-  // ================================ Ref =================================
+  }; // ================================ Ref =================================
+
+
   var textareaRef = React.useRef();
@@ -54,16 +58,18 @@ React.useImperativeHandle(ref, function () {
     };
-  });
-  // ============================== AutoSize ==============================
+  }); // ============================== AutoSize ==============================
+
   var _React$useMemo = React.useMemo(function () {
-      if (autoSize && _typeof(autoSize) === 'object') {
-        return [autoSize.minRows, autoSize.maxRows];
-      }
-      return [];
-    }, [autoSize]),
-    _React$useMemo2 = _slicedToArray(_React$useMemo, 2),
-    minRows = _React$useMemo2[0],
-    maxRows = _React$useMemo2[1];
-  var needAutoSize = !!autoSize;
-  // =============================== Scroll ===============================
+    if (autoSize && _typeof(autoSize) === 'object') {
+      return [autoSize.minRows, autoSize.maxRows];
+    }
+
+    return [];
+  }, [autoSize]),
+      _React$useMemo2 = _slicedToArray(_React$useMemo, 2),
+      minRows = _React$useMemo2[0],
+      maxRows = _React$useMemo2[1];
+
+  var needAutoSize = !!autoSize; // =============================== Scroll ===============================
   // https://github.com/ant-design/ant-design/issues/21870
+
   var fixFirefoxAutoScroll = function fixFirefoxAutoScroll() {
@@ -74,6 +80,5 @@ try {
         var _textareaRef$current = textareaRef.current,
-          selectionStart = _textareaRef$current.selectionStart,
-          selectionEnd = _textareaRef$current.selectionEnd,
-          scrollTop = _textareaRef$current.scrollTop;
-        // Fix Safari bug which not rollback when break line
+            selectionStart = _textareaRef$current.selectionStart,
+            selectionEnd = _textareaRef$current.selectionEnd,
+            scrollTop = _textareaRef$current.scrollTop; // Fix Safari bug which not rollback when break line
         // This makes Chinese IME can't input. Do not fix this
@@ -83,27 +88,32 @@ // const { value: tmpValue } = textareaRef.current;
         // textareaRef.current.value = tmpValue;
+
         textareaRef.current.setSelectionRange(selectionStart, selectionEnd);
         textareaRef.current.scrollTop = scrollTop;
       }
-    } catch (e) {
-      // Fix error in Chrome:
+    } catch (e) {// Fix error in Chrome:
       // Failed to read the 'selectionStart' property from 'HTMLInputElement'
       // http://stackoverflow.com/q/21177489/3040605
     }
-  };
-  // =============================== Resize ===============================
+  }; // =============================== Resize ===============================
+
+
   var _React$useState = React.useState(RESIZE_STABLE),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    resizeState = _React$useState2[0],
-    setResizeState = _React$useState2[1];
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      resizeState = _React$useState2[0],
+      setResizeState = _React$useState2[1];
+
   var _React$useState3 = React.useState(),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    autoSizeStyle = _React$useState4[0],
-    setAutoSizeStyle = _React$useState4[1];
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      autoSizeStyle = _React$useState4[0],
+      setAutoSizeStyle = _React$useState4[1];
+
   var startResize = function startResize() {
     setResizeState(RESIZE_START);
+
     if (process.env.NODE_ENV === 'test') {
       onInternalAutoSize === null || onInternalAutoSize === void 0 ? void 0 : onInternalAutoSize();
     }
-  };
-  // Change to trigger resize measure
+  }; // Change to trigger resize measure
+
+
   useLayoutEffect(function () {
@@ -118,4 +128,3 @@ if (needAutoSize) {
     } else if (resizeState === RESIZE_MEASURING) {
-      var textareaStyles = calculateAutoSizeStyle(textareaRef.current, false, minRows, maxRows);
-      // Safari has bug that text will keep break line on text cut when it's prev is break line.
+      var textareaStyles = calculateAutoSizeStyle(textareaRef.current, false, minRows, maxRows); // Safari has bug that text will keep break line on text cut when it's prev is break line.
       // ZombieJ: This not often happen. So we just skip it.
@@ -130,2 +139,3 @@ // const { selectionStart, selectionEnd, scrollTop } = textareaRef.current;
       // }
+
       setResizeState(RESIZE_STABLE);
@@ -136,11 +146,14 @@ setAutoSizeStyle(textareaStyles);
     }
-  }, [resizeState]);
-  // We lock resize trigger by raf to avoid Safari warning
+  }, [resizeState]); // We lock resize trigger by raf to avoid Safari warning
+
   var resizeRafRef = React.useRef();
+
   var cleanRaf = function cleanRaf() {
     raf.cancel(resizeRafRef.current);
   };
+
   var onInternalResize = function onInternalResize(size) {
     if (resizeState === RESIZE_STABLE) {
       onResize === null || onResize === void 0 ? void 0 : onResize(size);
+
       if (autoSize) {
@@ -154,8 +167,11 @@ cleanRaf();
   };
+
   React.useEffect(function () {
     return cleanRaf;
-  }, []);
-  // =============================== Render ===============================
+  }, []); // =============================== Render ===============================
+
   var mergedAutoSizeStyle = needAutoSize ? autoSizeStyle : null;
+
   var mergedStyle = _objectSpread(_objectSpread({}, style), mergedAutoSizeStyle);
+
   if (resizeState === RESIZE_START || resizeState === RESIZE_MEASURING) {
@@ -165,2 +181,3 @@ mergedStyle.overflowY = 'hidden';
   }
+
   return /*#__PURE__*/React.createElement(ResizeObserver, {
@@ -167,0 +184,0 @@ onResize: onInternalResize,

lib/calculateNodeHeight.d.ts

@@ -1,5 +0,2 @@
-/**
- * calculateNodeHeight(uiTextNode, useCache = false)
- */
-/// <reference types="react" />
+import type React from 'react';
 export interface NodeType {
@@ -6,0 +3,0 @@ sizingStyle: string;

lib/calculateNodeHeight.js

@@ -9,2 +9,3 @@ "use strict";
 // Thanks to https://github.com/andreypopp/react-textarea-autosize/
+
 /**
@@ -17,8 +18,11 @@ * calculateNodeHeight(uiTextNode, useCache = false)
 var hiddenTextarea;
+
 function calculateNodeStyling(node) {
   var useCache = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   var nodeRef = node.getAttribute('id') || node.getAttribute('data-reactid') || node.getAttribute('name');
+
   if (useCache && computedStyleCache[nodeRef]) {
     return computedStyleCache[nodeRef];
   }
+
   var style = window.getComputedStyle(node);
@@ -37,7 +41,10 @@ var boxSizing = style.getPropertyValue('box-sizing') || style.getPropertyValue('-moz-box-sizing') || style.getPropertyValue('-webkit-box-sizing');
   };
+
   if (useCache && nodeRef) {
     computedStyleCache[nodeRef] = nodeInfo;
   }
+
   return nodeInfo;
 }
+
 function calculateAutoSizeStyle(uiTextNode) {
@@ -47,2 +54,3 @@ var useCache = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   var maxRows = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
+
   if (!hiddenTextarea) {
@@ -53,5 +61,6 @@ hiddenTextarea = document.createElement('textarea');
     document.body.appendChild(hiddenTextarea);
-  }
-  // Fix wrap="off" issue
+  } // Fix wrap="off" issue
   // https://github.com/ant-design/ant-design/issues/6577
+
+
   if (uiTextNode.getAttribute('wrap')) {
@@ -61,13 +70,15 @@ hiddenTextarea.setAttribute('wrap', uiTextNode.getAttribute('wrap'));
     hiddenTextarea.removeAttribute('wrap');
-  }
-  // Copy all CSS properties that have an impact on the height of the content in
+  } // Copy all CSS properties that have an impact on the height of the content in
   // the textbox
+
+
   var _calculateNodeStyling = calculateNodeStyling(uiTextNode, useCache),
-    paddingSize = _calculateNodeStyling.paddingSize,
-    borderSize = _calculateNodeStyling.borderSize,
-    boxSizing = _calculateNodeStyling.boxSizing,
-    sizingStyle = _calculateNodeStyling.sizingStyle;
-  // Need to have the overflow attribute to hide the scrollbar otherwise
+      paddingSize = _calculateNodeStyling.paddingSize,
+      borderSize = _calculateNodeStyling.borderSize,
+      boxSizing = _calculateNodeStyling.boxSizing,
+      sizingStyle = _calculateNodeStyling.sizingStyle; // Need to have the overflow attribute to hide the scrollbar otherwise
   // text-lines will not calculated properly as the shadow will technically be
   // narrower for content
+
+
   hiddenTextarea.setAttribute('style', "".concat(sizingStyle, ";").concat(HIDDEN_TEXTAREA_STYLE));
@@ -79,2 +90,3 @@ hiddenTextarea.value = uiTextNode.value || uiTextNode.placeholder || '';
   var height = hiddenTextarea.scrollHeight;
+
   if (boxSizing === 'border-box') {
@@ -87,2 +99,3 @@ // border-box: add border, since height = content + padding + border
   }
+
   if (minRows !== null || maxRows !== null) {
@@ -92,14 +105,20 @@ // measure height of a textarea with a single row
     var singleRowHeight = hiddenTextarea.scrollHeight - paddingSize;
+
     if (minRows !== null) {
       minHeight = singleRowHeight * minRows;
+
       if (boxSizing === 'border-box') {
         minHeight = minHeight + paddingSize + borderSize;
       }
+
       height = Math.max(minHeight, height);
     }
+
     if (maxRows !== null) {
       maxHeight = singleRowHeight * maxRows;
+
       if (boxSizing === 'border-box') {
         maxHeight = maxHeight + paddingSize + borderSize;
       }
+
       overflowY = height > maxHeight ? '' : 'hidden';
@@ -109,2 +128,3 @@ height = Math.min(maxHeight, height);
   }
+
   var style = {
@@ -115,9 +135,12 @@ height: height,
   };
+
   if (minHeight) {
     style.minHeight = minHeight;
   }
+
   if (maxHeight) {
     style.maxHeight = maxHeight;
   }
+
   return style;
 }

lib/index.d.ts

@@ -1,36 +0,4 @@
-import * as React from 'react';
-import ResizableTextArea from './ResizableTextArea';
-import type { ResizableTextAreaRef } from './ResizableTextArea';
-import type { AutoSizeType } from './ResizableTextArea';
-export type HTMLTextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;
-export interface TextAreaProps extends Omit<HTMLTextareaProps, 'onResize'> {
-    prefixCls?: string;
-    className?: string;
-    style?: React.CSSProperties;
-    autoSize?: boolean | AutoSizeType;
-    onPressEnter?: React.KeyboardEventHandler<HTMLTextAreaElement>;
-    onResize?: (size: {
-        width: number;
-        height: number;
-    }) => void;
-}
-export interface TextAreaState {
-    value: any;
-}
-declare class TextArea extends React.Component<TextAreaProps, TextAreaState> {
-    resizableTextArea: ResizableTextAreaRef;
-    constructor(props: TextAreaProps);
-    static getDerivedStateFromProps(nextProps: TextAreaProps): {
-        value: string | number | readonly string[];
-    };
-    setValue(value: string, callback?: () => void): void;
-    focus: () => void;
-    blur(): void;
-    saveTextArea: (resizableTextArea: ResizableTextAreaRef) => void;
-    handleChange: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
-    handleKeyDown: (e: React.KeyboardEvent<HTMLTextAreaElement>) => void;
-    render(): JSX.Element;
-}
-export { ResizableTextArea };
-export type { AutoSizeType };
+import TextArea from './TextArea';
+export { default as ResizableTextArea } from './ResizableTextArea';
+export type { AutoSizeType, ResizableTextAreaRef, TextAreaProps, TextAreaRef, } from './interface';
 export default TextArea;

lib/index.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
+
 Object.defineProperty(exports, "__esModule", {
@@ -15,87 +15,8 @@ value: true
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-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 _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
-var React = _interopRequireWildcard(require("react"));
+
+var _TextArea = _interopRequireDefault(require("./TextArea"));
+
 var _ResizableTextArea = _interopRequireDefault(require("./ResizableTextArea"));
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-var TextArea = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(TextArea, _React$Component);
-  var _super = (0, _createSuper2.default)(TextArea);
-  function TextArea(props) {
-    var _this;
-    (0, _classCallCheck2.default)(this, TextArea);
-    _this = _super.call(this, props);
-    _this.resizableTextArea = void 0;
-    _this.focus = function () {
-      _this.resizableTextArea.textArea.focus();
-    };
-    _this.saveTextArea = function (resizableTextArea) {
-      _this.resizableTextArea = resizableTextArea;
-    };
-    _this.handleChange = function (e) {
-      var onChange = _this.props.onChange;
-      _this.setValue(e.target.value);
-      if (onChange) {
-        onChange(e);
-      }
-    };
-    _this.handleKeyDown = function (e) {
-      var _this$props = _this.props,
-        onPressEnter = _this$props.onPressEnter,
-        onKeyDown = _this$props.onKeyDown;
-      if (e.keyCode === 13 && onPressEnter) {
-        onPressEnter(e);
-      }
-      if (onKeyDown) {
-        onKeyDown(e);
-      }
-    };
-    var value = typeof props.value === 'undefined' || props.value === null ? props.defaultValue : props.value;
-    _this.state = {
-      value: value
-    };
-    return _this;
-  }
-  (0, _createClass2.default)(TextArea, [{
-    key: "setValue",
-    value: function setValue(value, callback) {
-      if (!('value' in this.props)) {
-        this.setState({
-          value: value
-        }, callback);
-      }
-    }
-  }, {
-    key: "blur",
-    value: function blur() {
-      this.resizableTextArea.textArea.blur();
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      return /*#__PURE__*/React.createElement(_ResizableTextArea.default, (0, _extends2.default)({}, this.props, {
-        value: this.state.value,
-        onKeyDown: this.handleKeyDown,
-        onChange: this.handleChange,
-        ref: this.saveTextArea
-      }));
-    }
-  }], [{
-    key: "getDerivedStateFromProps",
-    value: function getDerivedStateFromProps(nextProps) {
-      if ('value' in nextProps) {
-        return {
-          value: nextProps.value
-        };
-      }
-      return null;
-    }
-  }]);
-  return TextArea;
-}(React.Component);
-var _default = TextArea;
+
+var _default = _TextArea.default;
 exports.default = _default;

lib/ResizableTextArea.d.ts

 import * as React from 'react';
-import type { TextAreaProps } from '.';
-export interface AutoSizeType {
-    minRows?: number;
-    maxRows?: number;
-}
-export interface ResizableTextAreaRef {
-    textArea: HTMLTextAreaElement;
-}
-declare const ResizableTextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<ResizableTextAreaRef>>;
+import { ResizableTextAreaRef } from './interface';
+declare const ResizableTextArea: React.ForwardRefExoticComponent<Omit<import("./interface").HTMLTextareaProps, "onResize"> & {
+    prefixCls?: string;
+    className?: string;
+    style?: React.CSSProperties;
+    autoSize?: boolean | import("./interface").AutoSizeType;
+    onPressEnter?: React.KeyboardEventHandler<HTMLTextAreaElement>;
+    onResize?: (size: {
+        width: number;
+        height: number;
+    }) => void;
+    showCount?: boolean | import("rc-input/lib/interface").ShowCountProps;
+} & Pick<import("rc-input/lib/interface").BaseInputProps, "allowClear" | "suffix" | "affixWrapperClassName"> & React.RefAttributes<ResizableTextAreaRef>>;
 export default ResizableTextArea;

lib/ResizableTextArea.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 var _typeof3 = require("@babel/runtime/helpers/typeof");
+
 Object.defineProperty(exports, "__esModule", {
@@ -9,18 +11,35 @@ value: true
 exports.default = void 0;
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
 var React = _interopRequireWildcard(require("react"));
+
 var _rcResizeObserver = _interopRequireDefault(require("rc-resize-observer"));
+
 var _useLayoutEffect = _interopRequireDefault(require("rc-util/lib/hooks/useLayoutEffect"));
+
 var _raf = _interopRequireDefault(require("rc-util/lib/raf"));
+
 var _useMergedState3 = _interopRequireDefault(require("rc-util/lib/hooks/useMergedState"));
+
 var _classnames = _interopRequireDefault(require("classnames"));
+
 var _calculateNodeHeight = _interopRequireDefault(require("./calculateNodeHeight"));
+
 var _excluded = ["prefixCls", "onPressEnter", "defaultValue", "value", "autoSize", "onResize", "className", "style", "disabled", "onChange", "onInternalAutoSize"];
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 var RESIZE_START = 0;
@@ -30,30 +49,33 @@ var RESIZE_MEASURING = 1;
 var ResizableTextArea = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var _props$prefixCls = props.prefixCls,
-    prefixCls = _props$prefixCls === void 0 ? 'rc-textarea' : _props$prefixCls,
-    onPressEnter = props.onPressEnter,
-    defaultValue = props.defaultValue,
-    value = props.value,
-    autoSize = props.autoSize,
-    onResize = props.onResize,
-    className = props.className,
-    style = props.style,
-    disabled = props.disabled,
-    onChange = props.onChange,
-    onInternalAutoSize = props.onInternalAutoSize,
-    restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
-  // =============================== Value ================================
+  var _ref = props,
+      _ref$prefixCls = _ref.prefixCls,
+      prefixCls = _ref$prefixCls === void 0 ? 'rc-textarea' : _ref$prefixCls,
+      onPressEnter = _ref.onPressEnter,
+      defaultValue = _ref.defaultValue,
+      value = _ref.value,
+      autoSize = _ref.autoSize,
+      onResize = _ref.onResize,
+      className = _ref.className,
+      style = _ref.style,
+      disabled = _ref.disabled,
+      onChange = _ref.onChange,
+      onInternalAutoSize = _ref.onInternalAutoSize,
+      restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded); // =============================== Value ================================
+
   var _useMergedState = (0, _useMergedState3.default)(defaultValue, {
-      value: value,
-      postState: function postState(val) {
-        return val !== null && val !== void 0 ? val : '';
-      }
-    }),
-    _useMergedState2 = (0, _slicedToArray2.default)(_useMergedState, 2),
-    mergedValue = _useMergedState2[0],
-    setMergedValue = _useMergedState2[1];
+    value: value,
+    postState: function postState(val) {
+      return val !== null && val !== void 0 ? val : '';
+    }
+  }),
+      _useMergedState2 = (0, _slicedToArray2.default)(_useMergedState, 2),
+      mergedValue = _useMergedState2[0],
+      setMergedValue = _useMergedState2[1];
+
   var onInternalChange = function onInternalChange(event) {
     setMergedValue(event.target.value);
     onChange === null || onChange === void 0 ? void 0 : onChange(event);
-  };
-  // ================================ Ref =================================
+  }; // ================================ Ref =================================
+
+
   var textareaRef = React.useRef();
@@ -64,16 +86,18 @@ React.useImperativeHandle(ref, function () {
     };
-  });
-  // ============================== AutoSize ==============================
+  }); // ============================== AutoSize ==============================
+
   var _React$useMemo = React.useMemo(function () {
-      if (autoSize && (0, _typeof2.default)(autoSize) === 'object') {
-        return [autoSize.minRows, autoSize.maxRows];
-      }
-      return [];
-    }, [autoSize]),
-    _React$useMemo2 = (0, _slicedToArray2.default)(_React$useMemo, 2),
-    minRows = _React$useMemo2[0],
-    maxRows = _React$useMemo2[1];
-  var needAutoSize = !!autoSize;
-  // =============================== Scroll ===============================
+    if (autoSize && (0, _typeof2.default)(autoSize) === 'object') {
+      return [autoSize.minRows, autoSize.maxRows];
+    }
+
+    return [];
+  }, [autoSize]),
+      _React$useMemo2 = (0, _slicedToArray2.default)(_React$useMemo, 2),
+      minRows = _React$useMemo2[0],
+      maxRows = _React$useMemo2[1];
+
+  var needAutoSize = !!autoSize; // =============================== Scroll ===============================
   // https://github.com/ant-design/ant-design/issues/21870
+
   var fixFirefoxAutoScroll = function fixFirefoxAutoScroll() {
@@ -84,6 +108,5 @@ try {
         var _textareaRef$current = textareaRef.current,
-          selectionStart = _textareaRef$current.selectionStart,
-          selectionEnd = _textareaRef$current.selectionEnd,
-          scrollTop = _textareaRef$current.scrollTop;
-        // Fix Safari bug which not rollback when break line
+            selectionStart = _textareaRef$current.selectionStart,
+            selectionEnd = _textareaRef$current.selectionEnd,
+            scrollTop = _textareaRef$current.scrollTop; // Fix Safari bug which not rollback when break line
         // This makes Chinese IME can't input. Do not fix this
@@ -93,27 +116,32 @@ // const { value: tmpValue } = textareaRef.current;
         // textareaRef.current.value = tmpValue;
+
         textareaRef.current.setSelectionRange(selectionStart, selectionEnd);
         textareaRef.current.scrollTop = scrollTop;
       }
-    } catch (e) {
-      // Fix error in Chrome:
+    } catch (e) {// Fix error in Chrome:
       // Failed to read the 'selectionStart' property from 'HTMLInputElement'
       // http://stackoverflow.com/q/21177489/3040605
     }
-  };
-  // =============================== Resize ===============================
+  }; // =============================== Resize ===============================
+
+
   var _React$useState = React.useState(RESIZE_STABLE),
-    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-    resizeState = _React$useState2[0],
-    setResizeState = _React$useState2[1];
+      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+      resizeState = _React$useState2[0],
+      setResizeState = _React$useState2[1];
+
   var _React$useState3 = React.useState(),
-    _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
-    autoSizeStyle = _React$useState4[0],
-    setAutoSizeStyle = _React$useState4[1];
+      _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
+      autoSizeStyle = _React$useState4[0],
+      setAutoSizeStyle = _React$useState4[1];
+
   var startResize = function startResize() {
     setResizeState(RESIZE_START);
+
     if (process.env.NODE_ENV === 'test') {
       onInternalAutoSize === null || onInternalAutoSize === void 0 ? void 0 : onInternalAutoSize();
     }
-  };
-  // Change to trigger resize measure
+  }; // Change to trigger resize measure
+
+
   (0, _useLayoutEffect.default)(function () {
@@ -128,4 +156,3 @@ if (needAutoSize) {
     } else if (resizeState === RESIZE_MEASURING) {
-      var textareaStyles = (0, _calculateNodeHeight.default)(textareaRef.current, false, minRows, maxRows);
-      // Safari has bug that text will keep break line on text cut when it's prev is break line.
+      var textareaStyles = (0, _calculateNodeHeight.default)(textareaRef.current, false, minRows, maxRows); // Safari has bug that text will keep break line on text cut when it's prev is break line.
       // ZombieJ: This not often happen. So we just skip it.
@@ -140,2 +167,3 @@ // const { selectionStart, selectionEnd, scrollTop } = textareaRef.current;
       // }
+
       setResizeState(RESIZE_STABLE);
@@ -146,11 +174,14 @@ setAutoSizeStyle(textareaStyles);
     }
-  }, [resizeState]);
-  // We lock resize trigger by raf to avoid Safari warning
+  }, [resizeState]); // We lock resize trigger by raf to avoid Safari warning
+
   var resizeRafRef = React.useRef();
+
   var cleanRaf = function cleanRaf() {
     _raf.default.cancel(resizeRafRef.current);
   };
+
   var onInternalResize = function onInternalResize(size) {
     if (resizeState === RESIZE_STABLE) {
       onResize === null || onResize === void 0 ? void 0 : onResize(size);
+
       if (autoSize) {
@@ -164,8 +195,10 @@ cleanRaf();
   };
+
   React.useEffect(function () {
     return cleanRaf;
-  }, []);
-  // =============================== Render ===============================
+  }, []); // =============================== Render ===============================
+
   var mergedAutoSizeStyle = needAutoSize ? autoSizeStyle : null;
   var mergedStyle = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, style), mergedAutoSizeStyle);
+
   if (resizeState === RESIZE_START || resizeState === RESIZE_MEASURING) {
@@ -175,2 +208,3 @@ mergedStyle.overflowY = 'hidden';
   }
+
   return /*#__PURE__*/React.createElement(_rcResizeObserver.default, {
@@ -177,0 +211,0 @@ onResize: onInternalResize,

package.json

 {
   "name": "rc-textarea",
-  "version": "0.4.7",
+  "version": "1.0.0-1",
   "description": "Pretty Textarea react component used in used in ant.design",
@@ -42,4 +42,4 @@ "keywords": [
     "pretty-quick": "pretty-quick",
-    "test": "father test",
-    "coverage": "father test --coverage"
+    "test": "umi-test",
+    "coverage": "umi-test --coverage"
   },
@@ -49,23 +49,19 @@ "dependencies": {
     "classnames": "^2.2.1",
+    "rc-input": "^0.1.4",
     "rc-resize-observer": "^1.0.0",
-    "rc-util": "^5.24.4",
-    "shallowequal": "^1.1.0"
+    "rc-util": "^5.27.0"
   },
   "devDependencies": {
+    "@rc-component/father-plugin": "^1.0.0",
     "@testing-library/jest-dom": "^5.16.5",
-    "@testing-library/react": "^12.0.0",
+    "@testing-library/react": "^13.3.0",
     "@types/classnames": "^2.2.9",
-    "@types/enzyme": "^3.10.10",
-    "@types/react": "^16.9.2",
-    "@types/react-dom": "^16.9.0",
-    "@types/shallowequal": "^1.1.1",
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0",
     "@umijs/fabric": "^2.0.8",
     "coveralls": "^3.0.6",
     "cross-env": "^7.0.2",
-    "dumi": "^1.1.0",
-    "enzyme": "^3.0.0",
-    "enzyme-adapter-react-16": "^1.0.1",
-    "enzyme-to-json": "^3.4.0",
+    "dumi": "^2.0.0",
     "eslint": "^7.0.0",
-    "father": "^2.13.4",
+    "father": "^4.0.0",
     "gh-pages": "^3.1.0",
@@ -77,5 +73,5 @@ "husky": "^4.2.5",
     "pretty-quick": "^2.0.1",
-    "react": "^16.0.0",
-    "react-dom": "^16.0.0",
-    "react-test-renderer": "^16.0.0"
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "umi-test": "^1.9.7"
   },
@@ -82,0 +78,0 @@ "peerDependencies": {

README.md

 # rc-textarea
 
-[![NPM version][npm-image]][npm-url] [![dumi](https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square)](https://github.com/umijs/dumi) [![npm download][download-image]][download-url] [![build status][github-actions-image]][github-actions-url] [![Codecov][codecov-image]][codecov-url] [![Dependencies][david-image]](david-url) [![DevDependencies][david-dev-image]][david-dev-url] [![bundle size][bundlephobia-image]][bundlephobia-url]
+[![NPM version][npm-image]][npm-url] [![dumi](https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square)](https://github.com/umijs/dumi) [![npm download][download-image]][download-url] [![build status][github-actions-image]][github-actions-url] [![Codecov][codecov-image]][codecov-url] [![bundle size][bundlephobia-image]][bundlephobia-url]
 
@@ -11,6 +11,2 @@ [npm-image]: http://img.shields.io/npm/v/rc-textarea.svg?style=flat-square
 [codecov-url]: https://codecov.io/gh/react-component/textarea/branch/master
-[david-url]: https://david-dm.org/react-component/textarea
-[david-image]: https://david-dm.org/react-component/textarea/status.svg?style=flat-square
-[david-dev-url]: https://david-dm.org/react-component/textarea?type=dev
-[david-dev-image]: https://david-dm.org/react-component/textarea/dev-status.svg?style=flat-square
 [download-image]: https://img.shields.io/npm/dm/rc-textarea.svg?style=flat-square
@@ -17,0 +13,0 @@ [download-url]: https://npmjs.org/package/rc-textarea

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

56654

increased by27.13%

Dev dependency count

21

decreased by-16%

Number of package files

25

increased by47.06%

Lines of code

1040

increased by19.95%

Worsened metrics

Number of lines in readme file

56

decreased by-6.67%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Addedrc-input@^0.1.4

• + Addedrc-input@0.1.4(transitive)

• - Removedshallowequal@^1.1.0

• - Removedshallowequal@1.1.0(transitive)

• Updatedrc-util@^5.27.0