update readme doc

.github/workflows/codecov-analysis.yml

@@ -0,0 +1,4 @@
+- name: Upload coverage reports to Codecov
+  uses: codecov/codecov-action@v3
+  env:
+    CODECOV_TOKEN: ${{ secrets.CODECOV_TOKEN }}

README.md

@@ -1 +1,75 @@
-## React Search Hook
+<p align="center">
+
+<a href="https://codecov.io/gh/react-search-hook">
+  <img src="https://codecov.io/gh/react-search-hook/branch/master/graph/badge.svg?token=H188T7PXLL"/>
+</a>
+<a href="https://www.npmjs.com/package/react-search-hook">
+    <img src="https://img.shields.io/npm/v/react-search-hook.svg?logo=npm" alt="Test Suites">
+</a>
+<a href="https://bundlephobia.com/result?p=react-search-hook">
+    <img src="https://img.shields.io/bundlephobia/minzip/react-search-hook?style=flat-square" alt="Test Suites">
+</a>
+<a href="https://github.com/DevAnsar/react-search-hook/blob/main/LICENSE">
+    <img src="https://img.shields.io/badge/License-Apache_2.0-blue.svg" alt="Test Suites">
+</a>
+<a>
+    <img src="https://img.shields.io/npm/types/react-search-hook" alt="Test Suites">
+</a>
+
+</p>
+
+## Introduction
+
+**React Search Hook** is a light library for React, with which you can store the search text in the Store and use it in other components.
+
+It is production-ready, and gives you the following:
+
+- 📦 Very lightweight
+- 🔧 Easy to use
+- ⚛️ Build for React JS
+- ⌨️ Highly typed and written in `TypeScript`
+
+## Documentation
+
+### 1. Install
+
+npm
+
+    npm i react-search-hook
+
+yarn
+
+    yarn add react-search-hook
+
+### 2. Add provider to top of your component tree
+
+```jsx
+import { SearchProvider } from 'react-search-hook'
+function App() {
+  return <SearchProvider stores={['products',...]}>{children}</SearchProvider>
+}
+```
+
+#### notice that `SearchProvider` needs an array of strings to make stores
+
+### 3. Simply you can import useSearch hook everywere
+
+```jsx
+import { useSearch } from 'react-search-hook'
+function MyExampleComponent() {
+  const { search, setSearch } = useSearch('products')
+
+  return (
+    <div className='Search-box'>
+      <input value={search} onChange={(e) => setSearch(e.target.value)} />
+      <span>{search}</span>
+    </div>
+  )
+}
+```
+
+#### notice that `useSearch` needs the store name
+
+## Contributor ✨
+
+[![Contributors](https://contrib.rocks/image?repo=DevAnsar/react-search-hook)](https://github.com/DevAnsar/react-search-hook/graphs/contributors)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-search-hook",
-  "version": "0.0.1",
+  "version": "0.0.3",
   "description": "Search Library for React",
   "keywords": [
     "react",
@@ -18,7 +18,9 @@
     "src": "src"
   },
   "files": [
-    "src"
+    "dist",
+    "LICENSE",
+    "README.md"
   ],
   "repository": {
     "type": "git",

rollup.config.mjs

@@ -1,45 +1,45 @@
-import typescript from "rollup-plugin-typescript2";
-import resolve from "@rollup/plugin-node-resolve";
-import commonjs from "@rollup/plugin-commonjs";
-import terser from "@rollup/plugin-terser";
-import filesize from "rollup-plugin-filesize";
-import peerDepsExternal from "rollup-plugin-peer-deps-external";
+import typescript from 'rollup-plugin-typescript2'
+import resolve from '@rollup/plugin-node-resolve'
+import commonjs from '@rollup/plugin-commonjs'
+import terser from '@rollup/plugin-terser'
+import filesize from 'rollup-plugin-filesize'
+import peerDepsExternal from 'rollup-plugin-peer-deps-external'
 
 export default [
   {
-    input: "src/index.ts",
+    input: 'src/index.tsx',
     output: [
       {
-        dir: "dist",
-        format: "esm",
+        dir: 'dist',
+        format: 'esm',
         sourcemap: true,
         preserveModules: true,
       },
     ],
     plugins: [peerDepsExternal(), resolve(), typescript(), filesize()],
   },
   {
-    input: "src/index.ts",
+    input: 'src/index.tsx',
     output: {
-      file: "dist/index.umd.js",
-      format: "umd",
-      name: "ReactAuthTool",
+      file: 'dist/index.umd.js',
+      format: 'umd',
+      name: 'ReactAuthTool',
       sourcemap: true,
       globals: {
-        react: "React",
-        "react-router-dom": "ReactRouterDOM",
+        react: 'React',
+        'react-router-dom': 'ReactRouterDOM',
       },
     },
     plugins: [
       peerDepsExternal(),
       resolve(),
       commonjs(),
       typescript({
-        tsconfig: "tsconfig.json",
+        tsconfig: 'tsconfig.json',
       }),
       terser(),
       filesize(),
     ],
-    external: ["react", "react-router-dom"],
+    external: ['react', 'react-router-dom'],
   },
-];
+]

src/hooks/useSearch.ts

@@ -34,15 +34,15 @@ const useSearch = (storeName: string) => {
   }
 
   // Check if the provided store is allowed
-  if (context.search.length > 0 && !context.search.some((s) => s.name === storeName)) {
+  if (context.stores.length > 0 && !context.stores.some((s) => s.name === storeName)) {
     throw new Error(`Invalid store name: ${storeName}`)
   }
 
   const setSearch = (value: string) => {
-    context.changeSearch(storeName, value)
+    context.changeStoreValue(storeName, value)
   }
 
-  const search = context.search?.find((s) => s.name === storeName)?.value
+  const search = context.stores?.find((s) => s.name === storeName)?.value
   return { search, setSearch }
 }