Types for better intellisense

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umbrellio/observable",
-  "version": "1.4.1",
+  "version": "1.4.2",
   "description": "Observable library",
   "repository": "git@github.com:umbrellio/observable.git",
   "author": "Aleksei Bespalov <nulldefiner@gmail.com>",
@@ -9,6 +9,7 @@
   "main": "dist/observable.cjs.js",
   "module": "dist/observable.es.js",
   "unpkg": "dist/observable.iife.js",
+  "types": "dist/observable.d.ts",
   "scripts": {
     "build": "rollup -c",
     "lint": "eslint .",
@@ -41,7 +42,9 @@
     "jest-environment-jsdom": "^28.1.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "rollup": "^2.75.6"
+    "rollup": "^2.75.6",
+    "rollup-plugin-dts": "^4.2.3",
+    "typescript": "^4.8.4"
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17"

rollup.config.js

@@ -1,5 +1,6 @@
 import { babel } from "@rollup/plugin-babel"
 import { nodeResolve } from "@rollup/plugin-node-resolve"
+import dts from "rollup-plugin-dts"
 
 const shared = {
   input: "src/index.js",
@@ -46,6 +47,14 @@ const config = [
         name: "T",
       },
     } }),
+  {
+    input: "src/index.js",
+    plugins: [dts()],
+    output: {
+      file: "dist/observable.d.ts",
+      format: "es",
+    },
+  },
 ]
 
 export default config

src/common.d.ts

@@ -0,0 +1,34 @@
+import { Component, PureComponent, FC } from "react"
+
+export declare type SubscribeFn<T> = (data: T) => void
+
+export declare type UnsubscribeFn = () => void
+
+export declare type MapFn<T> = (data: T) => T | any
+
+export declare type ReactComponent<Props, State, SnapShot> = (
+  Component<Props, State, SnapShot> | PureComponent<Props, State, SnapShot> | FC<Props>
+)
+
+export declare type ComponentWrapper<Props, State, SnapShot> = (
+  (component: ReactComponent<Props, State, SnapShot>) => Component<Props, State, SnapShot>
+)
+
+export declare interface Store<State> {
+  getState(): State
+  set(data: Partial<State>): void
+  observer<ComponentState, ComponentSnapShot>
+    (options: ObserverOptions<State>): Observer<State, ComponentState, ComponentSnapShot>
+  subscribe(sub: SubscribeFn<State>): UnsubscribeFn
+  reset(): void
+}
+
+export declare interface ObserverOptions<T> {
+  key: string
+  map: MapFn<T>
+}
+
+export declare interface Observer<State, ComponentState, ComponentSnapShot> {
+  (store: Store<State>, options?: ObserverOptions<State>):
+    ComponentWrapper<State, ComponentState, ComponentSnapShot>
+}

src/multipleObserver.d.ts

@@ -0,0 +1,36 @@
+import { Component } from "react"
+
+import { Store, ReactComponent, MapFn } from "./common"
+
+declare interface StoreConfig<T> {
+  store: Store<T>
+  key: string
+  map?: MapFn<T>
+}
+
+declare type Wrapper<Props, State, SnapShot> = (
+  (component: ReactComponent<Props, State, SnapShot>) => Component<Props, State, SnapShot>
+)
+
+declare function multipleObserver<State, ComponentState, ComponentSnapShot>
+  (stores: [StoreConfig<State>]): Wrapper<State, ComponentState, ComponentSnapShot>
+
+declare function multipleObserver<T1, T2, S, SS>
+  (stores: [StoreConfig<T1>, StoreConfig<T2>]): Wrapper<T1 & T2, S, SS>
+
+declare function multipleObserver<T1, T2, T3, S, SS>
+  (stores: [StoreConfig<T1>, StoreConfig<T2>, StoreConfig<T3>]): Wrapper<T1 & T2 & T3, S, SS>
+
+declare function multipleObserver<T1, T2, T3, T4, S, SS>
+  (stores: [StoreConfig<T1>, StoreConfig<T2>, StoreConfig<T3>, StoreConfig<T4>]): Wrapper<T1 & T2 & T3 & T4, S, SS>
+
+declare function multipleObserver<T1, T2, T3, T4, T5, S, SS>
+  (stores: [StoreConfig<T1>, StoreConfig<T2>, StoreConfig<T3>, StoreConfig<T4>, StoreConfig<T5>]): Wrapper<T1 & T2 & T3 & T4 & T5, S, SS>
+
+declare function multipleObserver<T1, T2, T3, T4, T5, T6, S, SS>
+  (stores: [StoreConfig<T1>, StoreConfig<T2>, StoreConfig<T3>, StoreConfig<T4>, StoreConfig<T5>, StoreConfig<T6>]): Wrapper<T1 & T2 & T3 & T4 & T5 & T6, S, SS>
+
+declare function multipleObserver<T1, T2, T3, T4, T5, T6, T7, S, SS>
+  (stores: [StoreConfig<T1>, StoreConfig<T2>, StoreConfig<T3>, StoreConfig<T4>, StoreConfig<T5>, StoreConfig<T6>, StoreConfig<T7>]): Wrapper<T1 & T2 & T3 & T4 & T5 & T6 & T7, S, SS>
+
+export default multipleObserver

src/multipleObserver.js

@@ -33,7 +33,7 @@ const multipleObserver = stores => WrappedComponent => {
         }
       }, {})
 
-      return <WrappedComponent {...this.props} {...state} />
+      return WrappedComponent({ ...this.props, ...state })
     }
   }
 }

src/observable.d.ts

@@ -0,0 +1,5 @@
+import { Store } from "./common"
+
+declare function observable<T> (initialData: T): Store<T>
+
+export default observable

src/observer.d.ts

@@ -0,0 +1,7 @@
+import { ComponentWrapper, ObserverOptions, Store } from "./common"
+
+declare function observer<State, ComponentState, ComponentSnapShot>
+  (store: Store<State>, options?: ObserverOptions<State>):
+    ComponentWrapper<State, ComponentState, ComponentSnapShot>
+
+export default observer

src/observer.js

@@ -23,7 +23,7 @@ const observer = (store, { key, map }) => WrappedComponent => {
 
     render () {
       const state = { [key]: map ? map(this.state) : this.state }
-      return <WrappedComponent {...this.props} {...state} />
+      return WrappedComponent({ ...this.props, ...state })
     }
   }
 }

src/useStore.d.ts

@@ -0,0 +1,9 @@
+import { Store, MapFn } from "./common"
+
+declare interface Options<T> {
+  map: MapFn<T>
+}
+
+declare function useStore<T> (store: Store<T>, options?: Options<T>): T
+
+export default useStore

yarn.lock

@@ -47,6 +47,13 @@
   dependencies:
     "@babel/highlight" "^7.16.7"
 
+"@babel/code-frame@^7.18.6":
+  version "7.18.6"
+  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.18.6.tgz#3b25d38c89600baa2dcc219edfa88a74eb2c427a"
+  integrity sha512-TDCmlK5eOvH+eH7cdAFlNXeVJqWIQ7gW9tY1GJIpUtFb6CmjVyq2VM3u71bOyR8CRihcCgMUYoDNyLXao3+70Q==
+  dependencies:
+    "@babel/highlight" "^7.18.6"
+
 "@babel/compat-data@^7.13.11":
   version "7.14.0"
   resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.14.0.tgz#a901128bce2ad02565df95e6ecbf195cf9465919"
@@ -397,6 +404,11 @@
   resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.16.7.tgz#e8c602438c4a8195751243da9031d1607d247cad"
   integrity sha512-hsEnFemeiW4D08A5gUAZxLBTXpZ39P+a+DGDsHw1yxqyQ/jzFEnxf5uTEGp+3bzAbNOxU1paTgYS4ECU/IgfDw==
 
+"@babel/helper-validator-identifier@^7.18.6":
+  version "7.19.1"
+  resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.19.1.tgz#7eea834cf32901ffdc1a7ee555e2f9c27e249ca2"
+  integrity sha512-awrNfaMtnHUr653GgGEs++LlAvW6w+DcPrOliSMXWCKo597CwL5Acf/wWdNkf/tfEQE3mjkeD1YOVZOUV/od1w==
+
 "@babel/helper-validator-option@^7.12.17":
   version "7.12.17"
   resolved "https://registry.yarnpkg.com/@babel/helper-validator-option/-/helper-validator-option-7.12.17.tgz#d1fbf012e1a79b7eebbfdc6d270baaf8d9eb9831"
@@ -453,6 +465,15 @@
     chalk "^2.0.0"
     js-tokens "^4.0.0"
 
+"@babel/highlight@^7.18.6":
+  version "7.18.6"
+  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.18.6.tgz#81158601e93e2563795adcbfbdf5d64be3f2ecdf"
+  integrity sha512-u7stbOuYjaPezCuLj29hNW1v64M2Md2qupEKP1fHc7WdOA3DgLh37suiSrZYY7haUB7iBeQZ9P1uiRF359do3g==
+  dependencies:
+    "@babel/helper-validator-identifier" "^7.18.6"
+    chalk "^2.0.0"
+    js-tokens "^4.0.0"
+
 "@babel/parser@^7.1.0", "@babel/parser@^7.12.13", "@babel/parser@^7.13.13":
   version "7.13.13"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.13.13.tgz#42f03862f4aed50461e543270916b47dd501f0df"
@@ -4396,6 +4417,13 @@ lru-cache@^6.0.0:
   dependencies:
     yallist "^4.0.0"
 
+magic-string@^0.26.6:
+  version "0.26.7"
+  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.26.7.tgz#caf7daf61b34e9982f8228c4527474dac8981d6f"
+  integrity sha512-hX9XH3ziStPoPhJxLq1syWuZMxbDvGNbVchfrdCtanC7D13888bMFow61x8axrx+GfHLtVeAx2kxL7tTGRl+Ow==
+  dependencies:
+    sourcemap-codec "^1.4.8"
+
 make-dir@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-2.1.0.tgz#5f0310e18b8be898cc07009295a30ae41e91e6f5"
@@ -5172,6 +5200,15 @@ rimraf@^3.0.0, rimraf@^3.0.2:
   dependencies:
     glob "^7.1.3"
 
+rollup-plugin-dts@^4.2.3:
+  version "4.2.3"
+  resolved "https://registry.yarnpkg.com/rollup-plugin-dts/-/rollup-plugin-dts-4.2.3.tgz#04c3615df1ffab4228aa9d540697eaca61e01f47"
+  integrity sha512-jlcpItqM2efqfIiKzDB/IKOS9E9fDvbkJSGw5GtK/PqPGS9eC3R3JKyw2VvpTktZA+TNgJRMu1NTv244aTUzzQ==
+  dependencies:
+    magic-string "^0.26.6"
+  optionalDependencies:
+    "@babel/code-frame" "^7.18.6"
+
 rollup@^2.75.6:
   version "2.75.6"
   resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.75.6.tgz#ac4dc8600f95942a0180f61c7c9d6200e374b439"
@@ -5310,6 +5347,11 @@ source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.1:
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
   integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
 
+sourcemap-codec@^1.4.8:
+  version "1.4.8"
+  resolved "https://registry.yarnpkg.com/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz#ea804bd94857402e6992d05a38ef1ae35a9ab4c4"
+  integrity sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==
+
 sprintf-js@~1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.0.3.tgz#04e6926f662895354f3dd015203633b857297e2c"
@@ -5624,6 +5666,11 @@ type-fest@^0.21.3:
   resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.21.3.tgz#d260a24b0198436e133fa26a524a6d65fa3b2e37"
   integrity sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==
 
+typescript@^4.8.4:
+  version "4.8.4"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.8.4.tgz#c464abca159669597be5f96b8943500b238e60e6"
+  integrity sha512-QCh+85mCy+h0IGff8r5XWzOVSbBO+KfeYrMQh7NJ58QujwcE22u+NUSmUxqF+un70P9GXKxa2HCNiTTMJknyjQ==
+
 unbox-primitive@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/unbox-primitive/-/unbox-primitive-1.0.1.tgz#085e215625ec3162574dc8859abee78a59b14471"