rc-textarea - npm Package Compare versions

Comparing version 1.5.0 to 1.5.1

es/TextArea.js

 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 _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
@@ -14,25 +15,2 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import ResizableTextArea from "./ResizableTextArea";
-// function fixEmojiLength(value: string, maxLength: number) {
-//   return [...(value || '')].slice(0, maxLength).join('');
-// }
-
-// function setTriggerValue(
-//   isCursorInEnd: boolean,
-//   preValue: string,
-//   triggerValue: string,
-//   maxLength: number,
-// ) {
-//   let newTriggerValue = triggerValue;
-//   if (isCursorInEnd) {
-//     // 光标在尾部，直接截断
-//     newTriggerValue = fixEmojiLength(triggerValue, maxLength!);
-//   } else if (
-//     [...(preValue || '')].length < triggerValue.length &&
-//     [...(triggerValue || '')].length > maxLength!
-//   ) {
-//     // 光标在中间，如果最后的值超过最大值，则采用原先的值
-//     newTriggerValue = preValue;
-//   }
-//   return newTriggerValue;
-// }
 var TextArea = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
@@ -71,3 +49,2 @@ var _countConfig$max, _clsx;
   var formatValue = value === undefined || value === null ? '' : String(value);
-  var resizableTextAreaRef = useRef(null);
   var _React$useState = React.useState(false),
@@ -88,6 +65,12 @@ _React$useState2 = _slicedToArray(_React$useState, 2),
     setTextareaResized = _React$useState6[1];
-  var focus = function focus() {
+
+  // =============================== Ref ================================
+  var resizableTextAreaRef = useRef(null);
+  var getTextArea = function getTextArea() {
     var _resizableTextAreaRef;
-    (_resizableTextAreaRef = resizableTextAreaRef.current) === null || _resizableTextAreaRef === void 0 ? void 0 : _resizableTextAreaRef.textArea.focus();
+    return (_resizableTextAreaRef = resizableTextAreaRef.current) === null || _resizableTextAreaRef === void 0 ? void 0 : _resizableTextAreaRef.textArea;
   };
+  var focus = function focus() {
+    getTextArea().focus();
+  };
   useImperativeHandle(ref, function () {
@@ -98,4 +81,3 @@ return {
       blur: function blur() {
-        var _resizableTextAreaRef2;
-        (_resizableTextAreaRef2 = resizableTextAreaRef.current) === null || _resizableTextAreaRef2 === void 0 ? void 0 : _resizableTextAreaRef2.textArea.blur();
+        getTextArea().blur();
       }
@@ -110,2 +92,14 @@ };
 
+  // =========================== Select Range ===========================
+  var _React$useState7 = React.useState(null),
+    _React$useState8 = _slicedToArray(_React$useState7, 2),
+    selection = _React$useState8[0],
+    setSelection = _React$useState8[1];
+  React.useEffect(function () {
+    if (selection) {
+      var _getTextArea;
+      (_getTextArea = getTextArea()).setSelectionRange.apply(_getTextArea, _toConsumableArray(selection));
+    }
+  }, [selection]);
+
   // ============================== Count ===============================
@@ -127,2 +121,5 @@ var countConfig = useCount(count, showCount);
       });
+      if (currentValue !== cutValue) {
+        setSelection([getTextArea().selectionStart || 0, getTextArea().selectionEnd || 0]);
+      }
     }
@@ -135,7 +132,2 @@ setValue(cutValue);
   var onInternalCompositionStart = function onInternalCompositionStart(e) {
-    // setCompositing(true);
-    // // 拼音输入前保存一份旧值
-    // oldCompositionValueRef.current = value as string;
-    // // 保存旧的光标位置
-    // oldSelectionStartRef.current = e.currentTarget.selectionStart;
     compositionRef.current = true;
@@ -145,23 +137,2 @@ onCompositionStart === null || onCompositionStart === void 0 ? void 0 : onCompositionStart(e);
   var onInternalCompositionEnd = function onInternalCompositionEnd(e) {
-    // setCompositing(false);
-
-    // let triggerValue = e.currentTarget.value;
-    // if (hasMaxLength) {
-    //   const isCursorInEnd =
-    //     oldSelectionStartRef.current >= maxLength! + 1 ||
-    //     oldSelectionStartRef.current ===
-    //       oldCompositionValueRef.current?.length;
-    //   triggerValue = setTriggerValue(
-    //     isCursorInEnd,
-    //     oldCompositionValueRef.current as string,
-    //     triggerValue,
-    //     maxLength!,
-    //   );
-    // }
-    // // Patch composition onChange when value changed
-    // if (triggerValue !== value) {
-    //   setValue(triggerValue);
-    //   resolveOnChange(e.currentTarget, e, onChange, triggerValue);
-    // }
-
     compositionRef.current = false;
@@ -172,18 +143,2 @@ triggerChange(e, e.currentTarget.value);
   var onInternalChange = function onInternalChange(e) {
-    // let triggerValue = e.target.value;
-    // if (!compositing && hasMaxLength) {
-    //   // 1. 复制粘贴超过maxlength的情况 2.未超过maxlength的情况
-    //   const isCursorInEnd =
-    //     e.target.selectionStart >= maxLength! + 1 ||
-    //     e.target.selectionStart === triggerValue.length ||
-    //     !e.target.selectionStart;
-    //   triggerValue = setTriggerValue(
-    //     isCursorInEnd,
-    //     value as string,
-    //     triggerValue,
-    //     maxLength!,
-    //   );
-    // }
-    // setValue(triggerValue);
-    // resolveOnChange(e.currentTarget, e, onChange, triggerValue);
     triggerChange(e, e.target.value);
@@ -210,19 +165,6 @@ };
   var handleReset = function handleReset(e) {
-    var _resizableTextAreaRef3;
     setValue('');
     focus();
-    resolveOnChange((_resizableTextAreaRef3 = resizableTextAreaRef.current) === null || _resizableTextAreaRef3 === void 0 ? void 0 : _resizableTextAreaRef3.textArea, e, onChange);
+    resolveOnChange(getTextArea(), e, onChange);
   };
-
-  // let val = value === null || value === undefined ? '' : String(value);
-
-  // if (
-  //   !compositing &&
-  //   hasMaxLength &&
-  //   (customValue === null || customValue === undefined)
-  // ) {
-  //   // fix #27612 将value转为数组进行截取，解决 '😂'.length === 2 等emoji表情导致的截取乱码的问题
-  //   val = fixEmojiLength(val, maxLength!);
-  // }
-
   var suffixNode = suffix;
@@ -246,5 +188,4 @@ var dataCount;
   var handleResize = function handleResize(size) {
-    var _resizableTextAreaRef4;
     onResize === null || onResize === void 0 ? void 0 : onResize(size);
-    if ((_resizableTextAreaRef4 = resizableTextAreaRef.current) !== null && _resizableTextAreaRef4 !== void 0 && _resizableTextAreaRef4.textArea.style.height) {
+    if (getTextArea().style.height) {
       setTextareaResized(true);
@@ -251,0 +192,0 @@ }

lib/TextArea.js

@@ -12,2 +12,3 @@ "use strict";
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
@@ -25,25 +26,2 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 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; }
-// function fixEmojiLength(value: string, maxLength: number) {
-//   return [...(value || '')].slice(0, maxLength).join('');
-// }
-
-// function setTriggerValue(
-//   isCursorInEnd: boolean,
-//   preValue: string,
-//   triggerValue: string,
-//   maxLength: number,
-// ) {
-//   let newTriggerValue = triggerValue;
-//   if (isCursorInEnd) {
-//     // 光标在尾部，直接截断
-//     newTriggerValue = fixEmojiLength(triggerValue, maxLength!);
-//   } else if (
-//     [...(preValue || '')].length < triggerValue.length &&
-//     [...(triggerValue || '')].length > maxLength!
-//   ) {
-//     // 光标在中间，如果最后的值超过最大值，则采用原先的值
-//     newTriggerValue = preValue;
-//   }
-//   return newTriggerValue;
-// }
 var TextArea = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
@@ -82,3 +60,2 @@ var _countConfig$max, _clsx;
   var formatValue = value === undefined || value === null ? '' : String(value);
-  var resizableTextAreaRef = (0, _react.useRef)(null);
   var _React$useState = _react.default.useState(false),
@@ -99,6 +76,12 @@ _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
     setTextareaResized = _React$useState6[1];
-  var focus = function focus() {
+
+  // =============================== Ref ================================
+  var resizableTextAreaRef = (0, _react.useRef)(null);
+  var getTextArea = function getTextArea() {
     var _resizableTextAreaRef;
-    (_resizableTextAreaRef = resizableTextAreaRef.current) === null || _resizableTextAreaRef === void 0 ? void 0 : _resizableTextAreaRef.textArea.focus();
+    return (_resizableTextAreaRef = resizableTextAreaRef.current) === null || _resizableTextAreaRef === void 0 ? void 0 : _resizableTextAreaRef.textArea;
   };
+  var focus = function focus() {
+    getTextArea().focus();
+  };
   (0, _react.useImperativeHandle)(ref, function () {
@@ -109,4 +92,3 @@ return {
       blur: function blur() {
-        var _resizableTextAreaRef2;
-        (_resizableTextAreaRef2 = resizableTextAreaRef.current) === null || _resizableTextAreaRef2 === void 0 ? void 0 : _resizableTextAreaRef2.textArea.blur();
+        getTextArea().blur();
       }
@@ -121,2 +103,14 @@ };
 
+  // =========================== Select Range ===========================
+  var _React$useState7 = _react.default.useState(null),
+    _React$useState8 = (0, _slicedToArray2.default)(_React$useState7, 2),
+    selection = _React$useState8[0],
+    setSelection = _React$useState8[1];
+  _react.default.useEffect(function () {
+    if (selection) {
+      var _getTextArea;
+      (_getTextArea = getTextArea()).setSelectionRange.apply(_getTextArea, (0, _toConsumableArray2.default)(selection));
+    }
+  }, [selection]);
+
   // ============================== Count ===============================
@@ -138,2 +132,5 @@ var countConfig = (0, _useCount.default)(count, showCount);
       });
+      if (currentValue !== cutValue) {
+        setSelection([getTextArea().selectionStart || 0, getTextArea().selectionEnd || 0]);
+      }
     }
@@ -146,7 +143,2 @@ setValue(cutValue);
   var onInternalCompositionStart = function onInternalCompositionStart(e) {
-    // setCompositing(true);
-    // // 拼音输入前保存一份旧值
-    // oldCompositionValueRef.current = value as string;
-    // // 保存旧的光标位置
-    // oldSelectionStartRef.current = e.currentTarget.selectionStart;
     compositionRef.current = true;
@@ -156,23 +148,2 @@ onCompositionStart === null || onCompositionStart === void 0 ? void 0 : onCompositionStart(e);
   var onInternalCompositionEnd = function onInternalCompositionEnd(e) {
-    // setCompositing(false);
-
-    // let triggerValue = e.currentTarget.value;
-    // if (hasMaxLength) {
-    //   const isCursorInEnd =
-    //     oldSelectionStartRef.current >= maxLength! + 1 ||
-    //     oldSelectionStartRef.current ===
-    //       oldCompositionValueRef.current?.length;
-    //   triggerValue = setTriggerValue(
-    //     isCursorInEnd,
-    //     oldCompositionValueRef.current as string,
-    //     triggerValue,
-    //     maxLength!,
-    //   );
-    // }
-    // // Patch composition onChange when value changed
-    // if (triggerValue !== value) {
-    //   setValue(triggerValue);
-    //   resolveOnChange(e.currentTarget, e, onChange, triggerValue);
-    // }
-
     compositionRef.current = false;
@@ -183,18 +154,2 @@ triggerChange(e, e.currentTarget.value);
   var onInternalChange = function onInternalChange(e) {
-    // let triggerValue = e.target.value;
-    // if (!compositing && hasMaxLength) {
-    //   // 1. 复制粘贴超过maxlength的情况 2.未超过maxlength的情况
-    //   const isCursorInEnd =
-    //     e.target.selectionStart >= maxLength! + 1 ||
-    //     e.target.selectionStart === triggerValue.length ||
-    //     !e.target.selectionStart;
-    //   triggerValue = setTriggerValue(
-    //     isCursorInEnd,
-    //     value as string,
-    //     triggerValue,
-    //     maxLength!,
-    //   );
-    // }
-    // setValue(triggerValue);
-    // resolveOnChange(e.currentTarget, e, onChange, triggerValue);
     triggerChange(e, e.target.value);
@@ -221,19 +176,6 @@ };
   var handleReset = function handleReset(e) {
-    var _resizableTextAreaRef3;
     setValue('');
     focus();
-    (0, _commonUtils.resolveOnChange)((_resizableTextAreaRef3 = resizableTextAreaRef.current) === null || _resizableTextAreaRef3 === void 0 ? void 0 : _resizableTextAreaRef3.textArea, e, onChange);
+    (0, _commonUtils.resolveOnChange)(getTextArea(), e, onChange);
   };
-
-  // let val = value === null || value === undefined ? '' : String(value);
-
-  // if (
-  //   !compositing &&
-  //   hasMaxLength &&
-  //   (customValue === null || customValue === undefined)
-  // ) {
-  //   // fix #27612 将value转为数组进行截取，解决 '😂'.length === 2 等emoji表情导致的截取乱码的问题
-  //   val = fixEmojiLength(val, maxLength!);
-  // }
-
   var suffixNode = suffix;
@@ -257,5 +199,4 @@ var dataCount;
   var handleResize = function handleResize(size) {
-    var _resizableTextAreaRef4;
     onResize === null || onResize === void 0 ? void 0 : onResize(size);
-    if ((_resizableTextAreaRef4 = resizableTextAreaRef.current) !== null && _resizableTextAreaRef4 !== void 0 && _resizableTextAreaRef4.textArea.style.height) {
+    if (getTextArea().style.height) {
       setTextareaResized(true);
@@ -262,0 +203,0 @@ }

package.json

 {
   "name": "rc-textarea",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "Pretty Textarea react component used in used in ant.design",
@@ -48,3 +48,3 @@ "keywords": [
     "classnames": "^2.2.1",
-    "rc-input": "~1.3.3",
+    "rc-input": "~1.3.5",
     "rc-resize-observer": "^1.0.0",
@@ -51,0 +51,0 @@ "rc-util": "^5.27.0"

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

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

Worsened metrics

Total package byte prevSize

62811

decreased by-6.78%

Lines of code

1262

decreased by-8.02%

Dependency changes

• Updatedrc-input@~1.3.5