initial

Author: Pavel Uvarov

.babelrc.js

@@ -0,0 +1,39 @@
+const { NODE_ENV, BABEL_ENV } = process.env
+const cjs = NODE_ENV === 'test' || BABEL_ENV === 'commonjs'
+
+module.exports = {
+  presets: [
+    [
+      '@babel/preset-env',
+      {
+        targets: {
+          esmodules: true,
+        },
+        // Use the equivalent of `babel-preset-modules`
+        bugfixes: true,
+        modules: false,
+        loose: true,
+      },
+    ],
+    '@babel/preset-typescript',
+  ],
+  plugins: [
+    '@babel/transform-react-jsx',
+    ['@babel/plugin-proposal-class-properties', { loose: true }],
+    ['@babel/plugin-proposal-private-methods', { loose: true }],
+    ['@babel/plugin-proposal-private-property-in-object', { loose: true }],
+    cjs && ['@babel/transform-modules-commonjs'],
+    [
+      '@babel/transform-runtime',
+      {
+        useESModules: !cjs,
+        version: require('./package.json').dependencies[
+          '@babel/runtime'
+        ].replace(/^[^0-9]*/, ''),
+      },
+    ],
+  ].filter(Boolean),
+  assumptions: {
+    enumerableModuleMeta: true,
+  },
+}

.eslintignore

@@ -0,0 +1,2 @@
+lib
+node_modules

.eslintrc

@@ -0,0 +1,49 @@
+{
+  "parser": "@typescript-eslint/parser",
+  "extends": [
+    "eslint:recommended",
+    "plugin:import/recommended",
+    "plugin:react/recommended",
+    "plugin:prettier/recommended"
+    // "plugin:@typescript-eslint/recommended"
+  ],
+  "settings": {
+    "react": {
+      "version": "detect"
+    },
+    "import/ignore": ["react-native"],
+    "import/resolver": {
+      "node": {
+        "extensions": [".js", ".ts", ".tsx"]
+      }
+    }
+  },
+  "parserOptions": {
+    "ecmaVersion": 6,
+    "sourceType": "module",
+    "ecmaFeatures": {
+      "jsx": true,
+      "experimentalObjectRestSpread": true
+    }
+  },
+  "env": {
+    "browser": true,
+    "mocha": true,
+    "node": true
+  },
+  "rules": {
+    "valid-jsdoc": 2,
+    "react/jsx-uses-react": 1,
+    "react/jsx-no-undef": 2,
+    "react/jsx-wrap-multilines": 2,
+    "react/no-string-refs": 0,
+    "no-unused-vars": "off",
+    "@typescript-eslint/no-unused-vars": ["error"],
+    "no-redeclare": "off",
+    "@typescript-eslint/no-redeclare": ["error"]
+  },
+  "plugins": ["@typescript-eslint", "import", "react"],
+  "globals": {
+    "JSX": true
+  }
+}

.prettierrc

@@ -0,0 +1,6 @@
+{
+  "semi": false,
+  "singleQuote": true,
+  "tabWidth": 2,
+  "endOfLine": "auto"
+}

README.md

@@ -1 +1,68 @@
-# use-global-state-react
+## useGlobalState
+
+**Simple useGlobalState hook for React!** 
+
+Do you need your data shared across other components, and you simply don't want to pass props all the way down, create context or use state management tool?
+
+Just use `useGlobalState`, it's really simple and does all the magic for you:
+- first argument is a key for your store
+- second argument is optional - initial value
+
+### Example:
+```ts
+import { useGlobalState } from 'use-global-state-react';
+
+const TASK_STORE_KEY = 'tasks';
+
+const Tasks = () => {
+    const [tasks, setTasks] = useGlobalState<string[]>(TASK_STORE_KEY, []);
+    
+    ...
+}
+```
+
+and then you can use the same hook everywhere, data will be shared across components and component will rerender if changes happened in store:
+
+```ts
+const AddTaskButton = () => {
+    const [, setTasks] = useGlobalState(TASK_STORE_KEY, []);
+    
+    const onTaskAdd = (newTask: stirng) => setTasks(prev => [...prev, newTask]);
+    
+    ...
+}
+
+const TasksTotal = () => {
+    const [tasks] = useGlobalState<string[]>(TASK_STORE_KEY, []);
+    
+    return tasks.length;
+}
+```
+
+
+or use helper `createGlobalStore` to create custom hook with shared data:
+
+```ts
+import { createGlobalStore } from 'use-global-state-react';
+
+const useTasks = createGlobalStore<string[]>(TASK_STORE_KEY, []);
+
+
+const Tasks = () => {
+    const [tasks, setTasks] = useTasks();
+    ...
+}
+
+```
+
+## Installation
+
+```
+  npm i use-global-state-react
+```
+
+or
+
+```
+  yarn add use-global-state-react
+```