@webkrafters/react-observable-context 4.1.5 → 4.1.7

package/dist/main/index.d.ts

@@ -3,18 +3,18 @@
  * @template {State} T
  * @see {ObservableContext<T>}
  */
-export function createContext<T extends import("../types").State>(): ObservableContext<T>;
+export function createContext<T extends import("../types").State>(): ObservableContext<T, BaseSelectorMap<T>>;
 
 /**
  * Actively monitors the store and triggers component re-render if any of the watched keys in the state objects changes
  *
- * @param {ObservableContext<STATE>} context Refers to the PublicObservableContext<T> type of the ObservableContext<T>
+ * @param {ObservableContext<STATE, SELECTOR_MAP>} context Refers to the PublicObservableContext<T> type of the ObservableContext<T>
  * @param {SELECTOR_MAP} [selectorMap = {}] Key:value pairs where `key` => arbitrary key given to a Store.data property holding a state slice and `value` => property path to a state slice used by this component: see examples below. May add a mapping for a certain arbitrary key='state' and value='@@STATE' to indicate a desire to obtain the entire state object and assign to a `state` property of Store.data. A change in any of the referenced properties results in this component render. When using '@@STATE', note that any change within the state object will result in this component render.
- * @returns {Store<STATE>}
+ * @returns {Store<STATE, SELECTOR_MAP>}
  * @template {State} STATE
  * @template {SelectorMap<STATE>} [SELECTOR_MAP=SelectorMap<STATE>]
- * @see {ObservableContext<STATE>}
- * @exampleS
+ * @see {ObservableContext<STATE,SELECTOR_MAP>}
+ * @example
  * a valid property path follows the `lodash` object property path convention.
  * for a state = { a: 1, b: 2, c: 3, d: { e: 5, f: [6, { x: 7, y: 8, z: 9 } ] } }
  * Any of the following is an applicable selector map.
@@ -31,24 +31,24 @@ export function createContext<T extends import("../types").State>(): ObservableC
  * {myX: 'd.e.f[1].x'} or {myX: 'd.e.f.1.x'} => {myX: 7} // same applies to {myY: 'd.e.f[1].y'} = {myY: 8}; {myZ: 'd.e.f[1].z'} = {myZ: 9}
  * {myData: '@@STATE'} => {myData: state}
  */
-export function useContext<STATE extends import("../types").State, SELECTOR_MAP extends BaseSelectorMap<STATE> = BaseSelectorMap<STATE>>(context: ObservableContext<STATE>, selectorMap?: SELECTOR_MAP): Store<STATE>;
+export function useContext<STATE extends import("../types").State, SELECTOR_MAP extends BaseSelectorMap<STATE> = BaseSelectorMap<STATE>>(context: ObservableContext<STATE, SELECTOR_MAP>, selectorMap?: SELECTOR_MAP): Store<STATE, SELECTOR_MAP>;
 
 /**
  * Provides an HOC function for connecting its WrappedComponent argument to the context store.
  *
  * The HOC function automatically memoizes any un-memoized WrappedComponent argument.
  *
- * @param {ObservableContext<STATE>} context - Refers to the PublicObservableContext<T> type of the ObservableContext<T>
+ * @param {ObservableContext<STATE, SELECTOR_MAP>} context - Refers to the PublicObservableContext<T> type of the ObservableContext<T>
  * @param {SELECTOR_MAP} [selectorMap] - Key:value pairs where `key` => arbitrary key given to a Store.data property holding a state slice and `value` => property path to a state slice used by this component: see examples below. May add a mapping for a certain arbitrary key='state' and value='@@STATE' to indicate a desire to obtain the entire state object and assign to a `state` property of Store.data. A change in any of the referenced properties results in this component render. When using '@@STATE', note that any change within the state object will result in this component render.
- * @returns {(WrappedComponent: C) => ConnectedComponent<OWNPROPS, Store<STATE>>} - Connector HOC function
+ * @returns {(WrappedComponent: C) => ConnectedComponent<OWNPROPS, Store<STATE, SELECTOR_MAP>>} - Connector HOC function
  * @template {State} STATE
  * @template {State} [OWNPROPS = {}]
  * @template {SelectorMap<STATE>} [SELECTOR_MAP=SelectorMap<STATE>]
- * @template {ComponentType<ConnectedComponentProps<OWNPROPS, PartialStore<STATE>>|ExoticComponent<ConnectedComponentProps<OWNPROPS, PartialStore<STATE>>} [C = ComponentType<ConnectedComponentProps<OWNPROPS, PartialStore<STATE>>]
- * @see {ObservableContext<STATE>}
+ * @template {ComponentType<ConnectedComponentProps<OWNPROPS, PartialStore<STATE, SELECTOR_MAP>>|ExoticComponent<ConnectedComponentProps<OWNPROPS, PartialStore<STATE, SELECTOR_MAP>>} [C = ComponentType<ConnectedComponentProps<OWNPROPS, PartialStore<STATE, SELECTOR_MAP>>]
+ * @see {ObservableContext<STATE,SELECTOR_MAP>}
  * @see {useContext} for selectorMap sample
  */
-export function connect<STATE extends import("../types").State, OWNPROPS extends import("../types").State = {}, SELECTOR_MAP extends BaseSelectorMap<STATE> = BaseSelectorMap<STATE>, C extends ComponentType<ConnectedComponentProps<OWNPROPS, PartialStore<STATE>> | import("react").ExoticComponent<ComponentType<ConnectedComponentProps<OWNPROPS, PartialStore<STATE>>>>> = ComponentType<ConnectedComponentProps<OWNPROPS, PartialStore<STATE>>>>(context: ObservableContext<STATE>, selectorMap?: SELECTOR_MAP): (WrappedComponent: C) => ConnectedComponent<OWNPROPS, Store<STATE>>;
+export function connect<STATE extends import("../types").State, OWNPROPS extends import("../types").State = {}, SELECTOR_MAP extends BaseSelectorMap<STATE> = BaseSelectorMap<STATE>, C extends ComponentType<ConnectedComponentProps<OWNPROPS, PartialStore<STATE, SELECTOR_MAP>> | import("react").ExoticComponent<ComponentType<ConnectedComponentProps<OWNPROPS, PartialStore<STATE, SELECTOR_MAP>>>>> = ComponentType<ConnectedComponentProps<OWNPROPS, PartialStore<STATE, SELECTOR_MAP>>>>(context: ObservableContext<STATE, SELECTOR_MAP>, selectorMap?: SELECTOR_MAP): (WrappedComponent: C) => ConnectedComponent<OWNPROPS, Store<STATE, SELECTOR_MAP>>;
 export type CLEAR_TAG = typeof CLEAR_TAG;
 
 /** @example changes = { property: CLEAR_TAG } */
@@ -109,8 +109,8 @@ export type SPLICE_TAG = typeof SPLICE_TAG;
 export const SPLICE_TAG: "@@SPLICE";
 export class UsageError extends Error {
 }
-export type ObservableContext<T extends import("../types").State> = IObservableContext<T> | PublicObservableContext<T>;
-export type PublicObservableContext<T extends import("../types").State> = WithObservableProvider<Context<Store<T>>, T>;
+export type ObservableContext<T extends import("../types").State, SELECTOR_MAP extends BaseSelectorMap<T> = BaseSelectorMap<T>> = IObservableContext<T> | PublicObservableContext<T, SELECTOR_MAP>;
+export type PublicObservableContext<T extends import("../types").State, SELECTOR_MAP extends BaseSelectorMap<T> = BaseSelectorMap<T>> = WithObservableProvider<Context<Store<T, SELECTOR_MAP>>, T>;
 export type IObservableContext<T extends import("../types").State> = WithObservableProvider<Context<IStore>, T>;
 export type WithObservableProvider<T, S extends import("../types").State> = T & {
     Provider: ObservableProvider<S>;
@@ -133,25 +133,21 @@ export type StoreRef<T extends import("../types").State> = {
 export type State = import("../types").State;
 export type PartialState<T extends import("../types").State> = import("../types").PartialState<T>;
 export type Prehooks<T extends import("../types").State> = import("../types").Prehooks<T>;
-export type SelectorMap<T extends import("../types").State = import("../types").State, MAP extends BaseSelectorMap<T> = BaseSelectorMap<T>> = MAP;
-export type BaseSelectorMap<T extends import("../types").State> = {
-    [dataPropKey: string]: string | keyof T;
-} & {
-    [dataPropKey: string]: "@@STATE";
-};
+export type BaseSelectorMap<T extends import("../types").State> = import("../types").BaseSelectorMap<T>;
+export type SelectorMap<T extends import("../types").State = import("../types").State, MAP extends BaseSelectorMap<T> = BaseSelectorMap<T>> = import("../types").SelectorMap<T, MAP>;
 export type StoreInternal<T extends import("../types").State> = import("../types").StoreInternal<T>;
-export type PartialStore<T extends import("../types").State> = {
-    data?: import("../types").Data;
+export type PartialStore<T extends import("../types").State, SELECTOR_MAP extends BaseSelectorMap<T> = BaseSelectorMap<T>> = {
+    data?: import("../types").Data<SELECTOR_MAP>;
     resetState?: (propertyPaths?: string[]) => void;
     setState?: (changes: import("../types").Changes<T>) => void;
 };
-export type Store<T extends import("../types").State> = import("../types").Store<T>;
+export type Store<T extends import("../types").State, SELECTOR_MAP extends BaseSelectorMap<T> = BaseSelectorMap<T>> = import("../types").Store<T, SELECTOR_MAP>;
 export type IStore = import("../types").IStore;
 export type IStorage<T extends import("../types").State> = import("../types").IStorage<T>;
-export type ConnectedComponent<OWNPROPS extends import("../types").State = {}, STORE extends Store<import("../types").State> = Store<import("../types").State>> = MemoExoticComponent<ConnectedComponentProps<OWNPROPS, STORE>>;
-export type ConnectedComponentProps<OWNPROPS extends import("../types").State = {}, STORE extends Store<import("../types").State> = Store<import("../types").State>> = STORE & OWNPROPS;
+export type ConnectedComponent<OWNPROPS extends import("../types").State = {}, STORE extends Store<import("../types").State, BaseSelectorMap<import("../types").State>> = Store<import("../types").State, BaseSelectorMap<import("../types").State>>> = MemoExoticComponent<ConnectedComponentProps<OWNPROPS, STORE>>;
+export type ConnectedComponentProps<OWNPROPS extends import("../types").State = {}, STORE extends Store<import("../types").State, BaseSelectorMap<import("../types").State>> = Store<import("../types").State, BaseSelectorMap<import("../types").State>>> = STORE & OWNPROPS;
 export type NonReactUsageReport = import("../types").NonReactUsageReport;
-export type Data = import("../types").Data;
+export type Data<SELECTOR_MAP extends BaseSelectorMap<import("../types").State> = BaseSelectorMap<import("../types").State>> = import("../types").Data<SELECTOR_MAP>;
 export type ReactNode = import("react").ReactNode;
 export type ForwardRefExoticComponent<P, T> = import('react').ForwardRefExoticComponent<import('react').PropsWithRef<P> & import('react').RefAttributes<T>>;
 export type MemoExoticComponent<P extends {

package/dist/types.d.ts

@@ -1,11 +1,14 @@
 declare const _default: any;
 export default _default;
+export type BaseSelectorMap<T extends State> = {
+    [dataPropKey: string]: string | keyof T;
+} & {
+    [dataPropKey: string]: "@@STATE";
+};
 export type BaseType = boolean | any[] | {
     [x: string]: any;
 } | KeyType;
-export type Data = {
-    [selectorKey: string]: Readonly<any>;
-};
+export type Data<SELECTOR_MAP extends BaseSelectorMap<State> = BaseSelectorMap<State>> = { [selectorKey in keyof SELECTOR_MAP]: Readonly<any>; };
 export type IStorage<T extends State> = {
     clone: (data: T) => T;
     getItem: (key: string) => T;
@@ -29,6 +32,7 @@ export type Prehooks<T extends State> = {
     }) => boolean;
     setState?: (newChanges: Changes<T>) => boolean;
 };
+export type SelectorMap<T extends State = State, MAP extends BaseSelectorMap<T> = BaseSelectorMap<T>> = MAP;
 export type State = {
     [x: string]: any;
     [x: number]: any;
@@ -44,8 +48,8 @@ export type StoreInternal<T extends State> = {
     subscribe: (listener: Listener<T>) => Unsubscribe;
     unlinkCache: (clientId: string) => void;
 };
-export type Store<T extends State> = {
-    data: Data;
+export type Store<T extends State, SELECTOR_MAP extends BaseSelectorMap<T> = BaseSelectorMap<T>> = {
+    data: Data<SELECTOR_MAP>;
     resetState: (propertyPaths?: string[]) => void;
     setState: (changes: Changes<T>) => void;
 };

package/package.json

@@ -133,5 +133,5 @@
     "test:watch": "eslint --fix && jest --updateSnapshot --watchAll"
   },
   "types": "dist/main/index.d.ts",
-  "version": "4.1.5"
+  "version": "4.1.7"
 }