diff --git a/README.md b/README.md index bdfc18d..403643d 100644 --- a/README.md +++ b/README.md @@ -1,25 +1,25 @@ -# react-keywords-highlight +# react-highlight-words -[![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/shhhplus/react-keywords-highlight/blob/master/LICENSE) [![npm version](https://img.shields.io/npm/v/@shhhplus/react-keywords-highlight.svg?style=flat)](https://www.npmjs.com/package/@shhhplus/react-keywords-highlight) [![codecov](https://img.shields.io/codecov/c/github/shhhplus/react-keywords-highlight/main?token=4MY5JFP8BX)](https://codecov.io/gh/shhhplus/react-keywords-highlight) [![build status](https://img.shields.io/github/actions/workflow/status/shhhplus/react-keywords-highlight/cd.yml)](https://github.com/shhhplus/react-keywords-highlight/actions) +[![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/shhhplus/react-highlight-words/blob/master/LICENSE) [![npm version](https://img.shields.io/npm/v/@shhhplus/react-highlight-words.svg?style=flat)](https://www.npmjs.com/package/@shhhplus/react-highlight-words) [![codecov](https://img.shields.io/codecov/c/github/shhhplus/react-highlight-words/main?token=4MY5JFP8BX)](https://codecov.io/gh/shhhplus/react-highlight-words) [![build status](https://img.shields.io/github/actions/workflow/status/shhhplus/react-highlight-words/cd.yml)](https://github.com/shhhplus/react-highlight-words/actions) -A component that can highlight matching keywords with customizable styles. +A component that can highlight matching words with customizable styles. ## Install ```sh -npm install @shhhplus/react-keywords-highlight --save +npm install @shhhplus/react-highlight-words --save ``` ## How to use ```javascript -import KeywordsHighlight from '@shhhplus/react-keywords-highlight'; +import Highlightwords from '@shhhplus/react-highlight-words'; const Demo = () => { return ( - + Welcome everyone to come and join my birthday party. - + ); }; ``` diff --git a/package-lock.json b/package-lock.json index 3401c14..43a8131 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { - "name": "react-keywords-highlight", - "version": "1.0.3", + "name": "react-highlight-words", + "version": "2.0.0", "lockfileVersion": 3, "requires": true, "packages": { "": { - "name": "react-keywords-highlight", - "version": "1.0.3", + "name": "react-highlight-words", + "version": "2.0.0", "license": "MIT", "dependencies": { "react": "^18.0.0" diff --git a/package.json b/package.json index 8b2be48..db82c5d 100644 --- a/package.json +++ b/package.json @@ -1,12 +1,12 @@ { - "name": "react-keywords-highlight", - "version": "1.0.3", - "description": "A component that can highlight matching keywords with customizable styles.", + "name": "react-highlight-words", + "version": "2.0.0", + "description": "A component that can highlight matching words with customizable styles.", "keywords": [ "react", "component", - "keywords", - "highlight" + "highlight", + "keywords" ], "main": "./src/index.js", "scripts": { @@ -15,14 +15,14 @@ }, "repository": { "type": "git", - "url": "https://github.com/shhhplus/react-keywords-highlight.git" + "url": "https://github.com/shhhplus/react-highlight-words.git" }, "author": "shhhplus", "license": "MIT", "bugs": { - "url": "https://github.com/shhhplus/react-keywords-highlight/issues" + "url": "https://github.com/shhhplus/react-highlight-words/issues" }, - "homepage": "https://github.com/shhhplus/react-keywords-highlight", + "homepage": "https://github.com/shhhplus/react-highlight-words", "devDependencies": { "@babel/core": "^7.21.8", "@babel/preset-env": "^7.21.5", diff --git a/rollup/rollup.config.ts b/rollup/rollup.config.ts index f92ff6b..956da0b 100644 --- a/rollup/rollup.config.ts +++ b/rollup/rollup.config.ts @@ -61,7 +61,7 @@ export default { ], }, extra: { - name: '@shhhplus/react-keywords-highlight', + name: '@shhhplus/react-highlight-words', main: './index.js', types: './types/index.d.ts', }, diff --git a/src/index.test.tsx b/src/index.test.tsx index 20efd32..8000ce6 100644 --- a/src/index.test.tsx +++ b/src/index.test.tsx @@ -1,18 +1,18 @@ import { render } from '@testing-library/react'; -import KeywordsHighlight from './index'; +import HighlightWords from './index'; test(`component could be updated and unmounted without errors`, () => { const text = 'Welcome everyone to come and join my birthday party.'; const { unmount, rerender } = render( - + {text} - , + , ); expect(() => { rerender( - + {text} - , + , ); unmount(); }).not.toThrow(); @@ -21,9 +21,9 @@ test(`component could be updated and unmounted without errors`, () => { test(`a single matched word should works`, () => { const text = 'Welcome everyone to come and join my birthday party.'; const { container } = render( - + {text} - , + , ); expect(container.innerHTML).toEqual( @@ -35,9 +35,9 @@ test(`multiple matched words should works`, () => { const text = 'hi, party time. Welcome everyone to come and join my birthday party.'; const { container } = render( - + {text} - , + , ); expect(container.innerHTML).toEqual( @@ -48,9 +48,9 @@ test(`multiple matched words should works`, () => { test('empty keywords should works', () => { const text = 'Welcome everyone to come and join my birthday party.'; const { container } = render( - + {text} - , + , ); expect(container.innerHTML).toEqual(text); @@ -58,15 +58,15 @@ test('empty keywords should works', () => { test(`component should update when props changes`, () => { const { container, rerender } = render( - + hello, everyone. - , + , ); rerender( - + Welcome everyone to come and join my birthday party. - , + , ); expect(container.innerHTML).toEqual(