rc-mentions - npm Package Compare versions

Comparing version 2.9.1 to 2.10.0

es/hooks/useEffectState.js

@@ -25,5 +25,5 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
     var _effectId$callback;
-    (_effectId$callback = effectId.callback) === null || _effectId$callback === void 0 ? void 0 : _effectId$callback.call(effectId);
+    (_effectId$callback = effectId.callback) === null || _effectId$callback === void 0 || _effectId$callback.call(effectId);
   }, [effectId]);
   return update;
 }

es/Mentions.d.ts

@@ -6,3 +6,3 @@ import type { TextAreaProps } from 'rc-textarea';
 import { filterOption as defaultFilterOption, validateSearch as defaultValidateSearch } from './util';
-type BaseTextareaAttrs = Omit<TextAreaProps, 'prefix' | 'onChange' | 'onSelect' | 'allowClear' | 'showCount'>;
+type BaseTextareaAttrs = Omit<TextAreaProps, 'prefix' | 'onChange' | 'onSelect' | 'showCount' | 'classNames'>;
 export type Placement = 'top' | 'bottom';
@@ -39,2 +39,6 @@ export type Direction = 'ltr' | 'rtl';
     options?: DataDrivenOptionProps[];
+    classNames?: {
+        mentions?: string;
+        affixWrapper?: string;
+    };
 }
@@ -41,0 +45,0 @@ export interface MentionsRef {

es/Mentions.js

@@ -5,4 +5,4 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["prefixCls", "className", "style", "prefix", "split", "notFoundContent", "value", "defaultValue", "children", "options", "open", "validateSearch", "filterOption", "onChange", "onKeyDown", "onKeyUp", "onPressEnter", "onSearch", "onSelect", "onFocus", "onBlur", "transitionName", "placement", "direction", "getPopupContainer", "dropdownClassName", "rows"],
-  _excluded2 = ["suffix", "prefixCls", "classes", "value"];
+var _excluded = ["prefixCls", "className", "style", "prefix", "split", "notFoundContent", "value", "defaultValue", "children", "options", "open", "allowClear", "validateSearch", "filterOption", "onChange", "onKeyDown", "onKeyUp", "onPressEnter", "onSearch", "onSelect", "onFocus", "onBlur", "transitionName", "placement", "direction", "getPopupContainer", "dropdownClassName", "rows"],
+  _excluded2 = ["suffix", "prefixCls", "defaultValue", "value", "allowClear", "onChange", "classNames", "className"];
 import classNames from 'classnames';
@@ -22,4 +22,3 @@ import { BaseInput } from 'rc-input';
 var InternalMentions = /*#__PURE__*/forwardRef(function (props, ref) {
-  var _props$prefixCls = props.prefixCls,
-    prefixCls = _props$prefixCls === void 0 ? 'rc-mentions' : _props$prefixCls,
+  var prefixCls = props.prefixCls,
     className = props.className,
@@ -38,2 +37,3 @@ style = props.style,
     open = props.open,
+    allowClear = props.allowClear,
     _props$validateSearch = props.validateSearch,
@@ -67,7 +67,7 @@ validateSearch = _props$validateSearch === void 0 ? defaultValidateSearch : _props$validateSearch,
   var getTextArea = function getTextArea() {
-    var _textareaRef$current, _textareaRef$current$;
-    return (_textareaRef$current = textareaRef.current) === null || _textareaRef$current === void 0 ? void 0 : (_textareaRef$current$ = _textareaRef$current.resizableTextArea) === null || _textareaRef$current$ === void 0 ? void 0 : _textareaRef$current$.textArea;
+    var _textareaRef$current;
+    return (_textareaRef$current = textareaRef.current) === null || _textareaRef$current === void 0 || (_textareaRef$current = _textareaRef$current.resizableTextArea) === null || _textareaRef$current === void 0 ? void 0 : _textareaRef$current.textArea;
   };
   React.useImperativeHandle(ref, function () {
-    var _textareaRef$current4, _textareaRef$current5;
+    var _textareaRef$current4;
     return {
@@ -82,3 +82,3 @@ focus: function focus() {
       },
-      textarea: (_textareaRef$current4 = textareaRef.current) === null || _textareaRef$current4 === void 0 ? void 0 : (_textareaRef$current5 = _textareaRef$current4.resizableTextArea) === null || _textareaRef$current5 === void 0 ? void 0 : _textareaRef$current5.textArea
+      textarea: (_textareaRef$current4 = textareaRef.current) === null || _textareaRef$current4 === void 0 || (_textareaRef$current4 = _textareaRef$current4.resizableTextArea) === null || _textareaRef$current4 === void 0 ? void 0 : _textareaRef$current4.textArea
     };
@@ -202,3 +202,3 @@ });
     setMergedValue(nextValue);
-    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue);
+    onChange === null || onChange === void 0 || onChange(nextValue);
   };
@@ -227,3 +227,3 @@ var onInternalChange = function onInternalChange(_ref2) {
     });
-    onSelect === null || onSelect === void 0 ? void 0 : onSelect(option, mergedMeasurePrefix);
+    onSelect === null || onSelect === void 0 || onSelect(option, mergedMeasurePrefix);
   };
@@ -235,3 +235,3 @@
     var which = event.which;
-    onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
+    onKeyDown === null || onKeyDown === void 0 || onKeyDown(event);
 
@@ -285,3 +285,3 @@ // Skip if not measuring
     // If the client implements an onKeyUp handler, call it
-    onKeyUp === null || onKeyUp === void 0 ? void 0 : onKeyUp(event);
+    onKeyUp === null || onKeyUp === void 0 || onKeyUp(event);
 
@@ -335,3 +335,3 @@ // Skip if match the white key list
       stopMeasure();
-      onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
+      onBlur === null || onBlur === void 0 || onBlur(event);
     }, 0);
@@ -386,18 +386,46 @@ };
   var suffix = _ref3.suffix,
-    prefixCls = _ref3.prefixCls,
-    classes = _ref3.classes,
-    value = _ref3.value,
+    _ref3$prefixCls = _ref3.prefixCls,
+    prefixCls = _ref3$prefixCls === void 0 ? 'rc-mentions' : _ref3$prefixCls,
+    defaultValue = _ref3.defaultValue,
+    customValue = _ref3.value,
+    allowClear = _ref3.allowClear,
+    onChange = _ref3.onChange,
+    classes = _ref3.classNames,
+    className = _ref3.className,
     rest = _objectWithoutProperties(_ref3, _excluded2);
+  // ============================== Value ===============================
+  var _useMergedState3 = useMergedState('', {
+      defaultValue: defaultValue,
+      value: customValue
+    }),
+    _useMergedState4 = _slicedToArray(_useMergedState3, 2),
+    mergedValue = _useMergedState4[0],
+    setMergedValue = _useMergedState4[1];
+
+  // ============================== Change ==============================
+  var triggerChange = function triggerChange(currentValue) {
+    setMergedValue(currentValue);
+    onChange === null || onChange === void 0 || onChange(currentValue);
+  };
+
+  // ============================== Reset ===============================
+  var handleReset = function handleReset() {
+    triggerChange('');
+  };
   return /*#__PURE__*/React.createElement(BaseInput, {
-    inputElement: /*#__PURE__*/React.createElement(InternalMentions, _extends({
-      prefixCls: prefixCls,
-      ref: ref
-    }, rest)),
     suffix: suffix,
     prefixCls: prefixCls,
-    classes: classes,
-    value: value
-  });
+    value: mergedValue,
+    allowClear: allowClear,
+    handleReset: handleReset,
+    className: className,
+    classNames: classes
+  }, /*#__PURE__*/React.createElement(InternalMentions, _extends({
+    className: classes === null || classes === void 0 ? void 0 : classes.mentions,
+    prefixCls: prefixCls,
+    ref: ref,
+    onChange: triggerChange
+  }, rest)));
 });
 Mentions.Option = Option;
 export default Mentions;

lib/DropdownMenu.js

@@ -59,3 +59,2 @@ "use strict";
 }
-var _default = DropdownMenu;
-exports.default = _default;
+var _default = exports.default = DropdownMenu;

lib/hooks/useEffectState.js

@@ -32,5 +32,5 @@ "use strict";
     var _effectId$callback;
-    (_effectId$callback = effectId.callback) === null || _effectId$callback === void 0 ? void 0 : _effectId$callback.call(effectId);
+    (_effectId$callback = effectId.callback) === null || _effectId$callback === void 0 || _effectId$callback.call(effectId);
   }, [effectId]);
   return update;
 }

lib/index.js

@@ -9,3 +9,2 @@ "use strict";
 var _Mentions = _interopRequireDefault(require("./Mentions"));
-var _default = _Mentions.default;
-exports.default = _default;
+var _default = exports.default = _Mentions.default;

lib/KeywordTrigger.js

@@ -10,3 +10,4 @@ "use strict";
 var _trigger = _interopRequireDefault(require("@rc-component/trigger"));
-var React = _interopRequireWildcard(require("react"));
+var _react = _interopRequireWildcard(require("react"));
+var React = _react;
 var _DropdownMenu = _interopRequireDefault(require("./DropdownMenu"));
@@ -62,3 +63,3 @@ var BUILT_IN_PLACEMENTS = {
   });
-  var dropdownPlacement = (0, React.useMemo)(function () {
+  var dropdownPlacement = (0, _react.useMemo)(function () {
     var popupPlacement;
@@ -83,3 +84,2 @@ if (direction === 'rtl') {
 };
-var _default = KeywordTrigger;
-exports.default = _default;
+var _default = exports.default = KeywordTrigger;

lib/Mentions.d.ts

@@ -6,3 +6,3 @@ import type { TextAreaProps } from 'rc-textarea';
 import { filterOption as defaultFilterOption, validateSearch as defaultValidateSearch } from './util';
-type BaseTextareaAttrs = Omit<TextAreaProps, 'prefix' | 'onChange' | 'onSelect' | 'allowClear' | 'showCount'>;
+type BaseTextareaAttrs = Omit<TextAreaProps, 'prefix' | 'onChange' | 'onSelect' | 'showCount' | 'classNames'>;
 export type Placement = 'top' | 'bottom';
@@ -39,2 +39,6 @@ export type Direction = 'ltr' | 'rtl';
     options?: DataDrivenOptionProps[];
+    classNames?: {
+        mentions?: string;
+        affixWrapper?: string;
+    };
 }
@@ -41,0 +45,0 @@ export interface MentionsRef {

lib/Mentions.js

@@ -17,3 +17,3 @@ "use strict";
 var _toArray = _interopRequireDefault(require("rc-util/lib/Children/toArray"));
-var _useMergedState3 = _interopRequireDefault(require("rc-util/lib/hooks/useMergedState"));
+var _useMergedState5 = _interopRequireDefault(require("rc-util/lib/hooks/useMergedState"));
 var _KeyCode = _interopRequireDefault(require("rc-util/lib/KeyCode"));
@@ -27,7 +27,6 @@ var _warning = _interopRequireDefault(require("rc-util/lib/warning"));
 var _util = require("./util");
-var _excluded = ["prefixCls", "className", "style", "prefix", "split", "notFoundContent", "value", "defaultValue", "children", "options", "open", "validateSearch", "filterOption", "onChange", "onKeyDown", "onKeyUp", "onPressEnter", "onSearch", "onSelect", "onFocus", "onBlur", "transitionName", "placement", "direction", "getPopupContainer", "dropdownClassName", "rows"],
-  _excluded2 = ["suffix", "prefixCls", "classes", "value"];
+var _excluded = ["prefixCls", "className", "style", "prefix", "split", "notFoundContent", "value", "defaultValue", "children", "options", "open", "allowClear", "validateSearch", "filterOption", "onChange", "onKeyDown", "onKeyUp", "onPressEnter", "onSearch", "onSelect", "onFocus", "onBlur", "transitionName", "placement", "direction", "getPopupContainer", "dropdownClassName", "rows"],
+  _excluded2 = ["suffix", "prefixCls", "defaultValue", "value", "allowClear", "onChange", "classNames", "className"];
 var InternalMentions = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
-  var _props$prefixCls = props.prefixCls,
-    prefixCls = _props$prefixCls === void 0 ? 'rc-mentions' : _props$prefixCls,
+  var prefixCls = props.prefixCls,
     className = props.className,
@@ -46,2 +45,3 @@ style = props.style,
     open = props.open,
+    allowClear = props.allowClear,
     _props$validateSearch = props.validateSearch,
@@ -75,7 +75,7 @@ validateSearch = _props$validateSearch === void 0 ? _util.validateSearch : _props$validateSearch,
   var getTextArea = function getTextArea() {
-    var _textareaRef$current, _textareaRef$current$;
-    return (_textareaRef$current = textareaRef.current) === null || _textareaRef$current === void 0 ? void 0 : (_textareaRef$current$ = _textareaRef$current.resizableTextArea) === null || _textareaRef$current$ === void 0 ? void 0 : _textareaRef$current$.textArea;
+    var _textareaRef$current;
+    return (_textareaRef$current = textareaRef.current) === null || _textareaRef$current === void 0 || (_textareaRef$current = _textareaRef$current.resizableTextArea) === null || _textareaRef$current === void 0 ? void 0 : _textareaRef$current.textArea;
   };
   _react.default.useImperativeHandle(ref, function () {
-    var _textareaRef$current4, _textareaRef$current5;
+    var _textareaRef$current4;
     return {
@@ -90,3 +90,3 @@ focus: function focus() {
       },
-      textarea: (_textareaRef$current4 = textareaRef.current) === null || _textareaRef$current4 === void 0 ? void 0 : (_textareaRef$current5 = _textareaRef$current4.resizableTextArea) === null || _textareaRef$current5 === void 0 ? void 0 : _textareaRef$current5.textArea
+      textarea: (_textareaRef$current4 = textareaRef.current) === null || _textareaRef$current4 === void 0 || (_textareaRef$current4 = _textareaRef$current4.resizableTextArea) === null || _textareaRef$current4 === void 0 ? void 0 : _textareaRef$current4.textArea
     };
@@ -122,3 +122,3 @@ });
   // ============================== Value ===============================
-  var _useMergedState = (0, _useMergedState3.default)('', {
+  var _useMergedState = (0, _useMergedState5.default)('', {
       defaultValue: defaultValue,
@@ -211,3 +211,3 @@ value: value
     setMergedValue(nextValue);
-    onChange === null || onChange === void 0 ? void 0 : onChange(nextValue);
+    onChange === null || onChange === void 0 || onChange(nextValue);
   };
@@ -236,3 +236,3 @@ var onInternalChange = function onInternalChange(_ref2) {
     });
-    onSelect === null || onSelect === void 0 ? void 0 : onSelect(option, mergedMeasurePrefix);
+    onSelect === null || onSelect === void 0 || onSelect(option, mergedMeasurePrefix);
   };
@@ -244,3 +244,3 @@
     var which = event.which;
-    onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
+    onKeyDown === null || onKeyDown === void 0 || onKeyDown(event);
 
@@ -294,3 +294,3 @@ // Skip if not measuring
     // If the client implements an onKeyUp handler, call it
-    onKeyUp === null || onKeyUp === void 0 ? void 0 : onKeyUp(event);
+    onKeyUp === null || onKeyUp === void 0 || onKeyUp(event);
 
@@ -344,3 +344,3 @@ // Skip if match the white key list
       stopMeasure();
-      onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
+      onBlur === null || onBlur === void 0 || onBlur(event);
     }, 0);
@@ -395,19 +395,46 @@ };
   var suffix = _ref3.suffix,
-    prefixCls = _ref3.prefixCls,
-    classes = _ref3.classes,
-    value = _ref3.value,
+    _ref3$prefixCls = _ref3.prefixCls,
+    prefixCls = _ref3$prefixCls === void 0 ? 'rc-mentions' : _ref3$prefixCls,
+    defaultValue = _ref3.defaultValue,
+    customValue = _ref3.value,
+    allowClear = _ref3.allowClear,
+    onChange = _ref3.onChange,
+    classes = _ref3.classNames,
+    className = _ref3.className,
     rest = (0, _objectWithoutProperties2.default)(_ref3, _excluded2);
+  // ============================== Value ===============================
+  var _useMergedState3 = (0, _useMergedState5.default)('', {
+      defaultValue: defaultValue,
+      value: customValue
+    }),
+    _useMergedState4 = (0, _slicedToArray2.default)(_useMergedState3, 2),
+    mergedValue = _useMergedState4[0],
+    setMergedValue = _useMergedState4[1];
+
+  // ============================== Change ==============================
+  var triggerChange = function triggerChange(currentValue) {
+    setMergedValue(currentValue);
+    onChange === null || onChange === void 0 || onChange(currentValue);
+  };
+
+  // ============================== Reset ===============================
+  var handleReset = function handleReset() {
+    triggerChange('');
+  };
   return /*#__PURE__*/_react.default.createElement(_rcInput.BaseInput, {
-    inputElement: /*#__PURE__*/_react.default.createElement(InternalMentions, (0, _extends2.default)({
-      prefixCls: prefixCls,
-      ref: ref
-    }, rest)),
     suffix: suffix,
     prefixCls: prefixCls,
-    classes: classes,
-    value: value
-  });
+    value: mergedValue,
+    allowClear: allowClear,
+    handleReset: handleReset,
+    className: className,
+    classNames: classes
+  }, /*#__PURE__*/_react.default.createElement(InternalMentions, (0, _extends2.default)({
+    className: classes === null || classes === void 0 ? void 0 : classes.mentions,
+    prefixCls: prefixCls,
+    ref: ref,
+    onChange: triggerChange
+  }, rest)));
 });
 Mentions.Option = _Option.default;
-var _default = Mentions;
-exports.default = _default;
+var _default = exports.default = Mentions;

lib/MentionsContext.js

@@ -13,3 +13,2 @@ "use strict";
 var MentionsContext = /*#__PURE__*/React.createContext(null);
-var _default = MentionsContext;
-exports.default = _default;
+var _default = exports.default = MentionsContext;

lib/Option.js

@@ -10,3 +10,2 @@ "use strict";
 };
-var _default = Option;
-exports.default = _default;
+var _default = exports.default = Option;

package.json

 {
   "name": "rc-mentions",
-  "version": "2.9.1",
+  "version": "2.10.0",
   "description": "React Mentions",
@@ -51,5 +51,5 @@ "keywords": [
     "classnames": "^2.2.6",
-    "rc-input": "~1.3.5",
+    "rc-input": "~1.4.0",
     "rc-menu": "~9.12.0",
-    "rc-textarea": "~1.5.0",
+    "rc-textarea": "~1.6.1",
     "rc-util": "^5.34.1"
@@ -56,0 +56,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

Improved metrics

Total package byte prevSize

74464

increased by3.11%

Lines of code

1660

increased by3.43%

Dependency changes

• + Addedrc-input@1.4.5(transitive)

• + Addedrc-textarea@1.6.3(transitive)

• - Removedrc-input@1.3.11(transitive)

• - Removedrc-textarea@1.5.3(transitive)

• Updatedrc-input@~1.4.0

• Updatedrc-textarea@~1.6.1