Package Health Score

86 / 100

security
No known security issues
popularity
Influential project
maintenance
Healthy
community
Sustainable

Explore Similar Packages

Security

No known security issues

All security vulnerabilities belong to production dependencies of direct and indirect packages.

Security and license risk for significant versions

Version				Vulnerabilities	License Risk
2.18.0	\|	12/2024		0 C 0 H 0 M 0 L	0 H 0 M 0 L
2.17.0	\|	10/2024	Popular	0 C 0 H 0 M 0 L	0 H 0 M 0 L
1.13.1	\|	11/2022		0 C 0 H 0 M 0 L	0 H 0 M 0 L
0.4.2	\|	12/2019		0 C 0 H 0 M 0 L	0 H 0 M 0 L
0.3.1	\|	05/2019		0 C 0 H 0 M 0 L	0 H 0 M 0 L

License

MIT

Security Policy

Is your project affected by vulnerabilities?

Scan your projects for vulnerabilities. Fix quickly with automated fixes. Get started with Snyk for free.

Get started free

Popularity

Influential project

Weekly Downloads (1,416,023)

GitHub Stars: 83
Forks: 51
Contributors: 30

Direct Usage Popularity

The npm package rc-mentions receives a total of 1,416,023 downloads a week. As such, we scored rc-mentions popularity level to be Influential project.

Based on project statistics from the GitHub repository for the npm package rc-mentions, we found that it has been starred 83 times.

Downloads are calculated as moving averages for a period of the last 12 months, excluding weekends and known missing data points.

Community

Sustainable

Readme.md: Yes
Contributing.md: No
Code of Conduct: No
Contributors: 30
Funding: No

With more than 10 contributors for the rc-mentions repository, this is possibly a sign for a growing and inviting community.

We found a way for you to contribute to the project! Looks like rc-mentions is missing a Code of Conduct.

Embed Package Health Score Badge

Maintenance

Healthy

Commit Frequency

Open Issues: 16
Open PR: 14
Last Release: 20 days ago
Last Commit: 20 days ago

Further analysis of the maintenance status of rc-mentions based on released npm versions cadence, the repository activity, and other data points determined that its maintenance is Healthy.

We found that rc-mentions demonstrates a positive version release cadence with at least one new version released in the past 3 months.

As a healthy sign for on-going project maintenance, we found that the GitHub repository had at least 1 pull request or issue interacted with by the community.

Keep your project healthy

Check your package.json

Ensure all the packages you're using are healthy and well-maintained

Snyk Vulnerability Scanner

Get health score & security insights directly in your IDE

Package

Node.js Compatibility: not defined

Age: 6 years
Dependencies: 7 Direct
Versions: 74
Install Size: 78.5 kB
Dist-tags: 2
# of Files: 35
Maintainers: 3
TS Typings: No

rc-mentions has more than a single and default latest tag published for the npm package. This means, there may be other tags available for this package, such as next to indicate future releases, or stable to indicate stable releases.

Readme

rc-mentions

Screenshots

Feature

support ie9,ie9+,chrome,firefox,safari

Keyboard

Open mentions (focus input || focus and click)
KeyDown/KeyUp/Enter to navigate menu

install

Usage

basic use

/**
 * inline: true
 */
import Mentions from 'rc-mentions';
// Import the default styles
import './index.less';

const { Option } = Mentions;

var Demo = (
  
    <option value="light">Light</option>
    <option value="bamboo">Bamboo</option>
    <option value="cat">Cat</option>
  
);
React.render(, container);

Note: We use index.less for styling, you can convert them into css and properly reference them to the code above.

API

Mentions props

name	description	type	default
autoFocus	Auto get focus when component mounted	`boolean`	`false`
defaultValue	Default value	`string`	-
filterOption	Customize filter option logic	`false \| (input: string, option: OptionProps) => boolean`	-
notFoundContent	Set mentions content when not match	`ReactNode`	'Not Found'
placement	Set popup placement	`'top' \| 'bottom'`	'bottom'
direction	Set popup direction	`'ltr' \| 'rtl'`	'ltr'
prefix	Set trigger prefix keyword	`string \| string[]`	'@'
rows	Set row count	`number`	1
split	Set split string before and after selected mention	`string`	' '
silent	Used in transition phase, does not respond to keyboard enter events when equal to `true`	`boolean`	`false`
validateSearch	Customize trigger search logic	`(text: string, props: MentionsProps) => void`	-
value	Set value of mentions	`string`	-
onChange	Trigger when value changed	`(text: string) => void`	-
onKeyDown	Trigger when user hits a key	`React.KeyboardEventHandler`	-
onKeyUp	Trigger when user releases a key	`React.KeyboardEventHandler`	-
onSelect	Trigger when user select the option	`(option: OptionProps, prefix: string) => void`	-
onSearch	Trigger when prefix hit	`(text: string, prefix: string) => void`	-
onFocus	Trigger when mentions get focus	`React.FocusEventHandler`	-
onBlur	Trigger when mentions lose focus	`React.FocusEventHandler`	-
getPopupContainer	DOM Container for suggestions	`() => HTMLElement`	-
autoSize	Textarea height autosize feature, can be set to `true\|false` or an object `{ minRows: 2, maxRows: 6 }`	`boolean \| object`	-
onPressEnter	The callback function that is triggered when Enter key is pressed	`function(e)`	-
onResize	The callback function that is triggered when textarea resize	`function({ width, height })`	-

Methods

name	description
focus()	Component get focus
blur()	Component lose focus

Development

npm install
npm start

Example

https://localhost:9001/

online example: https://react-component.github.io/mentions/

Test Case

npm test

Coverage

npm run coverage

License

rc-mentions is released under the MIT license.

rc-mentions dependencies

@babel/runtime @rc-component/trigger classnames rc-input rc-menu rc-textarea rc-util

rc-mentions development dependencies

FAQs

What is rc-mentions?

React Mentions. Visit Snyk Advisor to see a full health score report for rc-mentions, including popularity, security, maintenance & community analysis.

Is rc-mentions popular?

The npm package rc-mentions receives a total of 1,416,023 weekly downloads. As such, rc-mentions popularity was classified as an influential project. Visit the popularity section on Snyk Advisor to see the full health analysis.

Is rc-mentions well maintained?

We found that rc-mentions demonstrated a healthy version release cadence and project activity. It has a community of 30 open source contributors collaborating on the project. See the full package health analysis to learn more about the package maintenance status.

Is rc-mentions safe to use?

The npm package rc-mentions was scanned for known vulnerabilities and missing license, and no issues were found. Thus the package was deemed as safe to use. See the full health analysis review.

Last updated on 21 December-2024, at 06:40 (UTC).

Build a secure application checklist

Select a recommended open source package

Minimize your risk by selecting secure & well maintained open source packages

DONE

Scan your app for vulnerabilities

Scan your application to find vulnerabilities in your: source code, open source dependencies, containers and configuration files

SCAN NOW

Fix identified vulnerabilities

Easily fix your code by leveraging automatically generated PRs

AUTO FIX

Monitor for new issues

New vulnerabilities are discovered every day. Get notified if your application is affected

MONITOR APP

Package Health Score

Explore Similar Packages

Security and license risk for significant versions

Is your project affected by vulnerabilities?

Weekly Downloads (1,416,023)

Direct Usage Popularity

Embed Package Health Score Badge

Commit Frequency

Keep your project healthy

Check your package.json

Snyk Vulnerability Scanner

Readme

rc-mentions

Screenshots

Feature

Keyboard

install

Usage

basic use

API

Mentions props

Methods

Development

Example

Test Case

Coverage

License

rc-mentions dependencies

rc-mentions development dependencies

FAQs

What is rc-mentions?

Is rc-mentions popular?

Is rc-mentions well maintained?

Is rc-mentions safe to use?

Build a secure application checklist

Select a recommended open source package

Scan your app for vulnerabilities

Source Code

Open Source

Container

Config

Fix identified vulnerabilities

Monitor for new issues