@figliolia/galena 2.3.4 → 3.0.0

package/dist/State.d.cts

@@ -0,0 +1,114 @@
+import { Middleware } from "./Middleware.cjs";
+import { NonFunction, Setter, Subscriber } from "./types.cjs";
+
+//#region src/State.d.ts
+/**
+ * State
+ *
+ * The unit of reactivity for Galena. `State`'s can act
+ * as isolated instances or be part of your global app
+ * state (via `Galena` instances).
+ *
+ * There are three ways to create state instances
+ *
+ * ```typescript
+ * import { State, createState, useState, Profiler } from "@figliolia/galena";
+ * // for island states that can be shared between react components
+ * const myState = new State("<any value>", ...middleware);
+ * // or
+ * const myState = createState("<any value>", ...middleware);
+ *
+ * myState.set("<new-value>");
+ * myState.update(previousValue => "<new-value>");
+ * myState.subscribe(nextValue => {});
+ * myState.registerMiddleware(new Profiler());
+ *
+ * // Similarly if you wish to use your state inside a react component
+ * const MyComponent = () => {
+ *   const [state, setState] = useState(myState);
+ *   // or
+ *   const [state, setState] = useMyState("<any-value>", ...middlware);
+ *
+ *   return (
+ *      // your jsx
+ *   );
+ * }
+ * ```
+ */
+declare class State<T> {
+  readonly initialState: NonFunction<T>;
+  private state;
+  readonly middleware: Middleware<T>[];
+  private readonly Emitter;
+  constructor(initialState: NonFunction<T>, ...middleware: Middleware<T>[]);
+  /**
+   * Set
+   *
+   * Updates the current value of state notifying
+   * all interested parties
+   */
+  readonly set: (state: NonFunction<T>) => void;
+  /**
+   * Update
+   *
+   * Updates the current value of state using a setter function
+   * receiving the previous state as a parameter. Notifies all
+   * interested parties
+   */
+  readonly update: (setter: Setter<T>) => void;
+  /**
+   * Reset
+   *
+   * Resets the current state back to the state which the instance
+   * was initialized with. Notifies all interested parties
+   */
+  readonly reset: () => void;
+  /**
+   * Get Snapshot
+   *
+   * Returns the current state. Designed for compatibility with
+   * `useSyncExternalStore`
+   */
+  readonly getSnapshot: () => NonFunction<T>;
+  /**
+   * Subscribe
+   *
+   * Registers a callback to be executed each time state
+   * changes. Returns an `unsubscribe` function
+   */
+  readonly subscribe: (fn: Subscriber<T>) => () => void;
+  /**
+   * Register Middleware
+   *
+   * Registers any number of `Middleware` instances on the
+   * current instance of `State`. Your middleware will begin
+   * executing at the next state transition
+   */
+  registerMiddleware(...middleware: Middleware<T>[]): void;
+  private withEmission;
+  private emit;
+  protected diffSetter(setter: Setter<T>): setter is NonFunction<T>;
+  private invokeMiddleware;
+}
+/**
+ * Create State
+ *
+ * Returns the unit of reactivity for Galena. `State`'s can act
+ * as isolated instances or be part of your global app
+ * state (via `Galena` instances);
+ *
+ * ```typescript
+ * import { createState, Profiler } from "@figliolia/galena";
+ *
+ * const myState = createState("<any value>", ...middleware);
+ *
+ * myState.set("<new-value>");
+ * myState.update(previousValue => "<new-value>");
+ * myState.subscribe(nextValue => {});
+ * myState.registerMiddleware(new Profiler());
+ * ```
+ */
+declare function createState<T>(...args: ConstructorParameters<typeof State<T>>): State<T>;
+//#endregion
+export { State, createState };
+//# sourceMappingURL=State.d.cts.map

package/dist/State.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"State.d.cts","names":[],"sources":["../src/State.ts"],"mappings":";;;;;;AAqCA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAAa,KAAA;EAAA,SAKO,YAAA,EAAc,WAAA,CAAY,CAAA;EAAA,QAJpC,KAAA;EAAA,SACQ,UAAA,EAAY,UAAA,CAAW,CAAA;EAAA,iBACtB,OAAA;cAEC,YAAA,EAAc,WAAA,CAAY,CAAA,MACvC,UAAA,EAAY,UAAA,CAAW,CAAA;EADI;;;;;;EAAA,SAahB,GAAA,GAAG,KAAA,EAAA,WAAA,CAAA,CAAA;EAAA;;;;;;;EAAA,SASH,MAAA,GAAM,MAAA,EAAA,MAAA,CAAA,CAAA;EAqBN;;;;;;EAAA,SARA,KAAA;EAgCT;;;;;;EAAA,SAxBS,WAAA,QAAW,WAAA,CAAA,CAAA;EAgDE;;;;;;EAAA,SAtCb,SAAA,GAAa,EAAA,EAAI,UAAA,CAAW,CAAA;EA0CpB;;AAyB1B;;;;;EArDS,kBAAA,CAAA,GAAsB,UAAA,EAAY,UAAA,CAAW,CAAA;EAAA,QAI5C,YAAA;EAAA,QAaA,IAAA;EAAA,UAOE,UAAA,CAAW,MAAA,EAAQ,MAAA,CAAO,CAAA,IAAK,MAAA,IAAU,WAAA,CAAY,CAAA;EAAA,QAIvD,gBAAA;AAAA;;;;;;;;;;;;;;;;;;;iBAyBM,WAAA,GAAA,CAAA,GACX,IAAA,EAAM,qBAAA,QAA6B,KAAA,CAAM,CAAA,KAAG,KAAA,CAAA,CAAA"}

package/dist/State.d.mts

@@ -0,0 +1,114 @@
+import { Middleware } from "./Middleware.mjs";
+import { NonFunction, Setter, Subscriber } from "./types.mjs";
+
+//#region src/State.d.ts
+/**
+ * State
+ *
+ * The unit of reactivity for Galena. `State`'s can act
+ * as isolated instances or be part of your global app
+ * state (via `Galena` instances).
+ *
+ * There are three ways to create state instances
+ *
+ * ```typescript
+ * import { State, createState, useState, Profiler } from "@figliolia/galena";
+ * // for island states that can be shared between react components
+ * const myState = new State("<any value>", ...middleware);
+ * // or
+ * const myState = createState("<any value>", ...middleware);
+ *
+ * myState.set("<new-value>");
+ * myState.update(previousValue => "<new-value>");
+ * myState.subscribe(nextValue => {});
+ * myState.registerMiddleware(new Profiler());
+ *
+ * // Similarly if you wish to use your state inside a react component
+ * const MyComponent = () => {
+ *   const [state, setState] = useState(myState);
+ *   // or
+ *   const [state, setState] = useMyState("<any-value>", ...middlware);
+ *
+ *   return (
+ *      // your jsx
+ *   );
+ * }
+ * ```
+ */
+declare class State<T> {
+  readonly initialState: NonFunction<T>;
+  private state;
+  readonly middleware: Middleware<T>[];
+  private readonly Emitter;
+  constructor(initialState: NonFunction<T>, ...middleware: Middleware<T>[]);
+  /**
+   * Set
+   *
+   * Updates the current value of state notifying
+   * all interested parties
+   */
+  readonly set: (state: NonFunction<T>) => void;
+  /**
+   * Update
+   *
+   * Updates the current value of state using a setter function
+   * receiving the previous state as a parameter. Notifies all
+   * interested parties
+   */
+  readonly update: (setter: Setter<T>) => void;
+  /**
+   * Reset
+   *
+   * Resets the current state back to the state which the instance
+   * was initialized with. Notifies all interested parties
+   */
+  readonly reset: () => void;
+  /**
+   * Get Snapshot
+   *
+   * Returns the current state. Designed for compatibility with
+   * `useSyncExternalStore`
+   */
+  readonly getSnapshot: () => NonFunction<T>;
+  /**
+   * Subscribe
+   *
+   * Registers a callback to be executed each time state
+   * changes. Returns an `unsubscribe` function
+   */
+  readonly subscribe: (fn: Subscriber<T>) => () => void;
+  /**
+   * Register Middleware
+   *
+   * Registers any number of `Middleware` instances on the
+   * current instance of `State`. Your middleware will begin
+   * executing at the next state transition
+   */
+  registerMiddleware(...middleware: Middleware<T>[]): void;
+  private withEmission;
+  private emit;
+  protected diffSetter(setter: Setter<T>): setter is NonFunction<T>;
+  private invokeMiddleware;
+}
+/**
+ * Create State
+ *
+ * Returns the unit of reactivity for Galena. `State`'s can act
+ * as isolated instances or be part of your global app
+ * state (via `Galena` instances);
+ *
+ * ```typescript
+ * import { createState, Profiler } from "@figliolia/galena";
+ *
+ * const myState = createState("<any value>", ...middleware);
+ *
+ * myState.set("<new-value>");
+ * myState.update(previousValue => "<new-value>");
+ * myState.subscribe(nextValue => {});
+ * myState.registerMiddleware(new Profiler());
+ * ```
+ */
+declare function createState<T>(...args: ConstructorParameters<typeof State<T>>): State<T>;
+//#endregion
+export { State, createState };
+//# sourceMappingURL=State.d.mts.map

package/dist/State.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"State.d.mts","names":[],"sources":["../src/State.ts"],"mappings":";;;;;;AAqCA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAAa,KAAA;EAAA,SAKO,YAAA,EAAc,WAAA,CAAY,CAAA;EAAA,QAJpC,KAAA;EAAA,SACQ,UAAA,EAAY,UAAA,CAAW,CAAA;EAAA,iBACtB,OAAA;cAEC,YAAA,EAAc,WAAA,CAAY,CAAA,MACvC,UAAA,EAAY,UAAA,CAAW,CAAA;EADI;;;;;;EAAA,SAahB,GAAA,GAAG,KAAA,EAAA,WAAA,CAAA,CAAA;EAAA;;;;;;;EAAA,SASH,MAAA,GAAM,MAAA,EAAA,MAAA,CAAA,CAAA;EAqBN;;;;;;EAAA,SARA,KAAA;EAgCT;;;;;;EAAA,SAxBS,WAAA,QAAW,WAAA,CAAA,CAAA;EAgDE;;;;;;EAAA,SAtCb,SAAA,GAAa,EAAA,EAAI,UAAA,CAAW,CAAA;EA0CpB;;AAyB1B;;;;;EArDS,kBAAA,CAAA,GAAsB,UAAA,EAAY,UAAA,CAAW,CAAA;EAAA,QAI5C,YAAA;EAAA,QAaA,IAAA;EAAA,UAOE,UAAA,CAAW,MAAA,EAAQ,MAAA,CAAO,CAAA,IAAK,MAAA,IAAU,WAAA,CAAY,CAAA;EAAA,QAIvD,gBAAA;AAAA;;;;;;;;;;;;;;;;;;;iBAyBM,WAAA,GAAA,CAAA,GACX,IAAA,EAAM,qBAAA,QAA6B,KAAA,CAAM,CAAA,KAAG,KAAA,CAAA,CAAA"}

package/dist/State.mjs

@@ -0,0 +1,148 @@
+import { EventEmitter } from "@figliolia/event-emitter";
+//#region src/State.ts
+/**
+* State
+*
+* The unit of reactivity for Galena. `State`'s can act
+* as isolated instances or be part of your global app
+* state (via `Galena` instances).
+*
+* There are three ways to create state instances
+*
+* ```typescript
+* import { State, createState, useState, Profiler } from "@figliolia/galena";
+* // for island states that can be shared between react components
+* const myState = new State("<any value>", ...middleware);
+* // or
+* const myState = createState("<any value>", ...middleware);
+*
+* myState.set("<new-value>");
+* myState.update(previousValue => "<new-value>");
+* myState.subscribe(nextValue => {});
+* myState.registerMiddleware(new Profiler());
+*
+* // Similarly if you wish to use your state inside a react component
+* const MyComponent = () => {
+*   const [state, setState] = useState(myState);
+*   // or
+*   const [state, setState] = useMyState("<any-value>", ...middlware);
+*
+*   return (
+*      // your jsx
+*   );
+* }
+* ```
+*/
+var State = class {
+	state;
+	middleware = [];
+	Emitter = new EventEmitter();
+	constructor(initialState, ...middleware) {
+		this.initialState = initialState;
+		this.state = initialState;
+		this.registerMiddleware(...middleware);
+	}
+	/**
+	* Set
+	*
+	* Updates the current value of state notifying
+	* all interested parties
+	*/
+	set = this.withEmission((state) => state);
+	/**
+	* Update
+	*
+	* Updates the current value of state using a setter function
+	* receiving the previous state as a parameter. Notifies all
+	* interested parties
+	*/
+	update = this.withEmission((setter) => {
+		if (this.diffSetter(setter)) return setter;
+		return setter(this.state);
+	});
+	/**
+	* Reset
+	*
+	* Resets the current state back to the state which the instance
+	* was initialized with. Notifies all interested parties
+	*/
+	reset = this.withEmission(() => this.initialState);
+	/**
+	* Get Snapshot
+	*
+	* Returns the current state. Designed for compatibility with
+	* `useSyncExternalStore`
+	*/
+	getSnapshot = () => {
+		return this.state;
+	};
+	/**
+	* Subscribe
+	*
+	* Registers a callback to be executed each time state
+	* changes. Returns an `unsubscribe` function
+	*/
+	subscribe = (fn) => {
+		const ID = this.Emitter.on("change", fn);
+		return () => {
+			this.Emitter.off("change", ID);
+		};
+	};
+	/**
+	* Register Middleware
+	*
+	* Registers any number of `Middleware` instances on the
+	* current instance of `State`. Your middleware will begin
+	* executing at the next state transition
+	*/
+	registerMiddleware(...middleware) {
+		this.middleware.push(...middleware);
+	}
+	withEmission(fn) {
+		return (...args) => {
+			const result = fn(...args);
+			if (result instanceof Promise) {
+				result.then((resolved) => this.emit(resolved));
+				return;
+			}
+			return this.emit(result);
+		};
+	}
+	emit(nextState) {
+		this.invokeMiddleware("onBeforeUpdate");
+		this.state = nextState;
+		this.Emitter.emit("change", this.state);
+		this.invokeMiddleware("onUpdate");
+	}
+	diffSetter(setter) {
+		return typeof setter !== "function";
+	}
+	invokeMiddleware(fn) {
+		for (const middleware of this.middleware) middleware[fn](this);
+	}
+};
+/**
+* Create State
+*
+* Returns the unit of reactivity for Galena. `State`'s can act
+* as isolated instances or be part of your global app
+* state (via `Galena` instances);
+*
+* ```typescript
+* import { createState, Profiler } from "@figliolia/galena";
+*
+* const myState = createState("<any value>", ...middleware);
+*
+* myState.set("<new-value>");
+* myState.update(previousValue => "<new-value>");
+* myState.subscribe(nextValue => {});
+* myState.registerMiddleware(new Profiler());
+* ```
+*/
+function createState(...args) {
+	return new State(...args);
+}
+//#endregion
+export { State, createState };
+
+//# sourceMappingURL=State.mjs.map

package/dist/State.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"State.mjs","names":[],"sources":["../src/State.ts"],"sourcesContent":["import { EventEmitter } from \"@figliolia/event-emitter\";\nimport type { Middleware } from \"./Middleware\";\nimport type { NonFunction, Setter, Subscriber } from \"./types\";\n\n/**\n * State\n *\n * The unit of reactivity for Galena. `State`'s can act\n * as isolated instances or be part of your global app\n * state (via `Galena` instances).\n *\n * There are three ways to create state instances\n *\n * ```typescript\n * import { State, createState, useState, Profiler } from \"@figliolia/galena\";\n * // for island states that can be shared between react components\n * const myState = new State(\"<any value>\", ...middleware);\n * // or\n * const myState = createState(\"<any value>\", ...middleware);\n *\n * myState.set(\"<new-value>\");\n * myState.update(previousValue => \"<new-value>\");\n * myState.subscribe(nextValue => {});\n * myState.registerMiddleware(new Profiler());\n *\n * // Similarly if you wish to use your state inside a react component\n * const MyComponent = () => {\n *   const [state, setState] = useState(myState);\n *   // or\n *   const [state, setState] = useMyState(\"<any-value>\", ...middlware);\n *\n *   return (\n *      // your jsx\n *   );\n * }\n * ```\n */\nexport class State<T> {\n  private state: NonFunction<T>;\n  public readonly middleware: Middleware<T>[] = [];\n  private readonly Emitter = new EventEmitter<{ change: NonFunction<T> }>();\n  constructor(\n    public readonly initialState: NonFunction<T>,\n    ...middleware: Middleware<T>[]\n  ) {\n    this.state = initialState;\n    this.registerMiddleware(...middleware);\n  }\n\n  /**\n   * Set\n   *\n   * Updates the current value of state notifying\n   * all interested parties\n   */\n  public readonly set = this.withEmission((state: NonFunction<T>) => state);\n\n  /**\n   * Update\n   *\n   * Updates the current value of state using a setter function\n   * receiving the previous state as a parameter. Notifies all\n   * interested parties\n   */\n  public readonly update = this.withEmission((setter: Setter<T>) => {\n    if (this.diffSetter(setter)) {\n      return setter;\n    }\n    return setter(this.state);\n  });\n\n  /**\n   * Reset\n   *\n   * Resets the current state back to the state which the instance\n   * was initialized with. Notifies all interested parties\n   */\n  public readonly reset = this.withEmission(() => this.initialState);\n\n  /**\n   * Get Snapshot\n   *\n   * Returns the current state. Designed for compatibility with\n   * `useSyncExternalStore`\n   */\n  public readonly getSnapshot = () => {\n    return this.state;\n  };\n\n  /**\n   * Subscribe\n   *\n   * Registers a callback to be executed each time state\n   * changes. Returns an `unsubscribe` function\n   */\n  public readonly subscribe = (fn: Subscriber<T>) => {\n    const ID = this.Emitter.on(\"change\", fn);\n    return () => {\n      this.Emitter.off(\"change\", ID);\n    };\n  };\n\n  /**\n   * Register Middleware\n   *\n   * Registers any number of `Middleware` instances on the\n   * current instance of `State`. Your middleware will begin\n   * executing at the next state transition\n   */\n  public registerMiddleware(...middleware: Middleware<T>[]) {\n    this.middleware.push(...middleware);\n  }\n\n  private withEmission<\n    F extends (...args: any[]) => NonFunction<T> | Promise<NonFunction<T>>,\n  >(fn: F) {\n    return (...args: Parameters<F>) => {\n      const result = fn(...args);\n      if (result instanceof Promise) {\n        void result.then(resolved => this.emit(resolved));\n        return;\n      }\n      return this.emit(result);\n    };\n  }\n\n  private emit(nextState: NonFunction<T>) {\n    this.invokeMiddleware(\"onBeforeUpdate\");\n    this.state = nextState;\n    this.Emitter.emit(\"change\", this.state);\n    this.invokeMiddleware(\"onUpdate\");\n  }\n\n  protected diffSetter(setter: Setter<T>): setter is NonFunction<T> {\n    return typeof setter !== \"function\";\n  }\n\n  private invokeMiddleware<K extends keyof Middleware<T>>(fn: K) {\n    for (const middleware of this.middleware) {\n      middleware[fn](this);\n    }\n  }\n}\n\n/**\n * Create State\n *\n * Returns the unit of reactivity for Galena. `State`'s can act\n * as isolated instances or be part of your global app\n * state (via `Galena` instances);\n *\n * ```typescript\n * import { createState, Profiler } from \"@figliolia/galena\";\n *\n * const myState = createState(\"<any value>\", ...middleware);\n *\n * myState.set(\"<new-value>\");\n * myState.update(previousValue => \"<new-value>\");\n * myState.subscribe(nextValue => {});\n * myState.registerMiddleware(new Profiler());\n * ```\n */\nexport function createState<T>(\n  ...args: ConstructorParameters<typeof State<T>>\n) {\n  return new State<T>(...args);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCA,IAAa,QAAb,MAAsB;CACpB;CACA,aAA8C,EAAE;CAChD,UAA2B,IAAI,cAA0C;CACzE,YACE,cACA,GAAG,YACH;AAFgB,OAAA,eAAA;AAGhB,OAAK,QAAQ;AACb,OAAK,mBAAmB,GAAG,WAAW;;;;;;;;CASxC,MAAsB,KAAK,cAAc,UAA0B,MAAM;;;;;;;;CASzE,SAAyB,KAAK,cAAc,WAAsB;AAChE,MAAI,KAAK,WAAW,OAAO,CACzB,QAAO;AAET,SAAO,OAAO,KAAK,MAAM;GACzB;;;;;;;CAQF,QAAwB,KAAK,mBAAmB,KAAK,aAAa;;;;;;;CAQlE,oBAAoC;AAClC,SAAO,KAAK;;;;;;;;CASd,aAA6B,OAAsB;EACjD,MAAM,KAAK,KAAK,QAAQ,GAAG,UAAU,GAAG;AACxC,eAAa;AACX,QAAK,QAAQ,IAAI,UAAU,GAAG;;;;;;;;;;CAWlC,mBAA0B,GAAG,YAA6B;AACxD,OAAK,WAAW,KAAK,GAAG,WAAW;;CAGrC,aAEE,IAAO;AACP,UAAQ,GAAG,SAAwB;GACjC,MAAM,SAAS,GAAG,GAAG,KAAK;AAC1B,OAAI,kBAAkB,SAAS;AACxB,WAAO,MAAK,aAAY,KAAK,KAAK,SAAS,CAAC;AACjD;;AAEF,UAAO,KAAK,KAAK,OAAO;;;CAI5B,KAAa,WAA2B;AACtC,OAAK,iBAAiB,iBAAiB;AACvC,OAAK,QAAQ;AACb,OAAK,QAAQ,KAAK,UAAU,KAAK,MAAM;AACvC,OAAK,iBAAiB,WAAW;;CAGnC,WAAqB,QAA6C;AAChE,SAAO,OAAO,WAAW;;CAG3B,iBAAwD,IAAO;AAC7D,OAAK,MAAM,cAAc,KAAK,WAC5B,YAAW,IAAI,KAAK;;;;;;;;;;;;;;;;;;;;;AAuB1B,SAAgB,YACd,GAAG,MACH;AACA,QAAO,IAAI,MAAS,GAAG,KAAK"}

package/dist/commonHooks.cjs

@@ -0,0 +1,17 @@
+let react = require("react");
+//#region src/commonHooks.ts
+function useStableSelector(selector) {
+	const stableSelector = (0, react.useRef)(selector);
+	(0, react.useEffect)(() => {
+		stableSelector.current = ((...args) => selector(...args));
+	}, [selector]);
+	return stableSelector;
+}
+function useStateHookAPI(value, selector) {
+	const state = (0, react.useSyncExternalStore)(value.subscribe, value.getSnapshot);
+	const selectedValue = (0, react.useMemo)(() => selector.current(state), [state, selector]);
+	return (0, react.useMemo)(() => [selectedValue, value.update], [selectedValue, value]);
+}
+//#endregion
+exports.useStableSelector = useStableSelector;
+exports.useStateHookAPI = useStateHookAPI;

package/dist/commonHooks.mjs

@@ -0,0 +1,18 @@
+import { useEffect, useMemo, useRef, useSyncExternalStore } from "react";
+//#region src/commonHooks.ts
+function useStableSelector(selector) {
+	const stableSelector = useRef(selector);
+	useEffect(() => {
+		stableSelector.current = ((...args) => selector(...args));
+	}, [selector]);
+	return stableSelector;
+}
+function useStateHookAPI(value, selector) {
+	const state = useSyncExternalStore(value.subscribe, value.getSnapshot);
+	const selectedValue = useMemo(() => selector.current(state), [state, selector]);
+	return useMemo(() => [selectedValue, value.update], [selectedValue, value]);
+}
+//#endregion
+export { useStableSelector, useStateHookAPI };
+
+//# sourceMappingURL=commonHooks.mjs.map

package/dist/commonHooks.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"commonHooks.mjs","names":[],"sources":["../src/commonHooks.ts"],"sourcesContent":["import {\n  type RefObject,\n  useEffect,\n  useMemo,\n  useRef,\n  useSyncExternalStore,\n} from \"react\";\nimport type { State } from \"./State\";\nimport type { NonFunction } from \"./types\";\n\nexport function useStableSelector<F extends (...args: any[]) => any>(\n  selector: F,\n) {\n  const stableSelector = useRef(selector);\n\n  useEffect(() => {\n    stableSelector.current = ((...args: Parameters<typeof selector>) =>\n      selector(...args)) as F;\n  }, [selector]);\n\n  return stableSelector;\n}\n\nexport function useStateHookAPI<T, U>(\n  value: State<T>,\n  selector: RefObject<(state: NonFunction<T>) => U>,\n) {\n  const state = useSyncExternalStore(value.subscribe, value.getSnapshot);\n  const selectedValue = useMemo(\n    () => selector.current(state),\n    [state, selector],\n  );\n  return useMemo(\n    () => [selectedValue, value.update] as const,\n    [selectedValue, value],\n  );\n}\n"],"mappings":";;AAUA,SAAgB,kBACd,UACA;CACA,MAAM,iBAAiB,OAAO,SAAS;AAEvC,iBAAgB;AACd,iBAAe,YAAY,GAAG,SAC5B,SAAS,GAAG,KAAK;IAClB,CAAC,SAAS,CAAC;AAEd,QAAO;;AAGT,SAAgB,gBACd,OACA,UACA;CACA,MAAM,QAAQ,qBAAqB,MAAM,WAAW,MAAM,YAAY;CACtE,MAAM,gBAAgB,cACd,SAAS,QAAQ,MAAM,EAC7B,CAAC,OAAO,SAAS,CAClB;AACD,QAAO,cACC,CAAC,eAAe,MAAM,OAAO,EACnC,CAAC,eAAe,MAAM,CACvB"}

package/dist/connect-multi.cjs

@@ -0,0 +1,42 @@
+let react = require("react");
+//#region src/connect-multi.tsx
+const connectMulti = (...states) => {
+	return (selector) => {
+		return (WrappedComponent) => {
+			return class GalenaMultiComponent extends react.Component {
+				state;
+				listeners = [];
+				constructor(props) {
+					super(props);
+					this.state = this.computeSelector();
+				}
+				static displayName = `GalenaMultiComponent(${WrappedComponent.displayName ?? WrappedComponent.name ?? "Component"})`;
+				componentDidMount() {
+					this.listeners = this.bindListeners();
+				}
+				UNSAFE_componentWillReceiveProps(nextProps) {
+					if (nextProps !== this.props) this.setState(this.computeSelector(nextProps));
+				}
+				shouldComponentUpdate(nextProps, nextState) {
+					return nextState !== this.state || nextProps !== this.props;
+				}
+				componentWillUnmount() {
+					while (this.listeners.length) this.listeners.pop()?.();
+				}
+				bindListeners() {
+					return states.map((state) => {
+						return state.subscribe(() => this.setState(this.computeSelector()));
+					});
+				}
+				computeSelector(props = this.props) {
+					return selector(states.map((s) => s.getSnapshot()), props);
+				}
+				render() {
+					return <WrappedComponent {...this.props} {...this.state} />;
+				}
+			};
+		};
+	};
+};
+//#endregion
+exports.connectMulti = connectMulti;

package/dist/connect-multi.d.cts

@@ -0,0 +1,10 @@
+import { DerivedSelector, Subtract } from "./types.cjs";
+import { State } from "./State.cjs";
+import { ComponentType } from "react";
+
+//#region src/connect-multi.d.ts
+declare const connectMulti: <StateInstances extends State<any>[]>(...states: StateInstances) => <Selector extends DerivedSelector<StateInstances>>(selector: Selector) => <ComponentProps extends ReturnType<Selector>>(WrappedComponent: ComponentType<ComponentProps>) => ComponentType<Subtract<ComponentProps, ReturnType<Selector>>>;
+type ReactiveStates<T extends ReturnType<typeof connectMulti>> = Parameters<Parameters<T>[0]>[0];
+//#endregion
+export { ReactiveStates, connectMulti };
+//# sourceMappingURL=connect-multi.d.cts.map

package/dist/connect-multi.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"connect-multi.d.cts","names":[],"sources":["../src/connect-multi.tsx"],"mappings":";;;;;cAIa,YAAA,0BAAuC,KAAA,YAC/C,MAAA,EAAQ,cAAA,uBAEc,eAAA,CAAgB,cAAA,GACvC,QAAA,EAAU,QAAA,6BAEqB,UAAA,CAAW,QAAA,GACxC,gBAAA,EAAkB,aAAA,CAAc,cAAA,MAC/B,aAAA,CAAc,QAAA,CAAS,cAAA,EAAgB,UAAA,CAAW,QAAA;AAAA,KA+D7C,cAAA,WAAyB,UAAA,QAAkB,YAAA,KACrD,UAAA,CAAW,UAAA,CAAW,CAAA"}

package/dist/connect-multi.d.mts

@@ -0,0 +1,10 @@
+import { DerivedSelector, Subtract } from "./types.mjs";
+import { State } from "./State.mjs";
+import { ComponentType } from "react";
+
+//#region src/connect-multi.d.ts
+declare const connectMulti: <StateInstances extends State<any>[]>(...states: StateInstances) => <Selector extends DerivedSelector<StateInstances>>(selector: Selector) => <ComponentProps extends ReturnType<Selector>>(WrappedComponent: ComponentType<ComponentProps>) => ComponentType<Subtract<ComponentProps, ReturnType<Selector>>>;
+type ReactiveStates<T extends ReturnType<typeof connectMulti>> = Parameters<Parameters<T>[0]>[0];
+//#endregion
+export { ReactiveStates, connectMulti };
+//# sourceMappingURL=connect-multi.d.mts.map

package/dist/connect-multi.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"connect-multi.d.mts","names":[],"sources":["../src/connect-multi.tsx"],"mappings":";;;;;cAIa,YAAA,0BAAuC,KAAA,YAC/C,MAAA,EAAQ,cAAA,uBAEc,eAAA,CAAgB,cAAA,GACvC,QAAA,EAAU,QAAA,6BAEqB,UAAA,CAAW,QAAA,GACxC,gBAAA,EAAkB,aAAA,CAAc,cAAA,MAC/B,aAAA,CAAc,QAAA,CAAS,cAAA,EAAgB,UAAA,CAAW,QAAA;AAAA,KA+D7C,cAAA,WAAyB,UAAA,QAAkB,YAAA,KACrD,UAAA,CAAW,UAAA,CAAW,CAAA"}

package/dist/connect-multi.mjs

@@ -0,0 +1,44 @@
+import { Component } from "react";
+//#region src/connect-multi.tsx
+const connectMulti = (...states) => {
+	return (selector) => {
+		return (WrappedComponent) => {
+			return class GalenaMultiComponent extends Component {
+				state;
+				listeners = [];
+				constructor(props) {
+					super(props);
+					this.state = this.computeSelector();
+				}
+				static displayName = `GalenaMultiComponent(${WrappedComponent.displayName ?? WrappedComponent.name ?? "Component"})`;
+				componentDidMount() {
+					this.listeners = this.bindListeners();
+				}
+				UNSAFE_componentWillReceiveProps(nextProps) {
+					if (nextProps !== this.props) this.setState(this.computeSelector(nextProps));
+				}
+				shouldComponentUpdate(nextProps, nextState) {
+					return nextState !== this.state || nextProps !== this.props;
+				}
+				componentWillUnmount() {
+					while (this.listeners.length) this.listeners.pop()?.();
+				}
+				bindListeners() {
+					return states.map((state) => {
+						return state.subscribe(() => this.setState(this.computeSelector()));
+					});
+				}
+				computeSelector(props = this.props) {
+					return selector(states.map((s) => s.getSnapshot()), props);
+				}
+				render() {
+					return <WrappedComponent {...this.props} {...this.state} />;
+				}
+			};
+		};
+	};
+};
+//#endregion
+export { connectMulti };
+
+//# sourceMappingURL=connect-multi.mjs.map

package/dist/connect-multi.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"connect-multi.mjs","names":[],"sources":["../src/connect-multi.tsx"],"sourcesContent":["import { Component, type ComponentType } from \"react\";\nimport type { State } from \"./State\";\nimport type { DerivedArguments, DerivedSelector, Subtract } from \"./types\";\n\nexport const connectMulti = <StateInstances extends State<any>[]>(\n  ...states: StateInstances\n) => {\n  return <Selector extends DerivedSelector<StateInstances>>(\n    selector: Selector,\n  ) => {\n    return <ComponentProps extends ReturnType<Selector>>(\n      WrappedComponent: ComponentType<ComponentProps>,\n    ): ComponentType<Subtract<ComponentProps, ReturnType<Selector>>> => {\n      type OwnProps = Subtract<ComponentProps, ReturnType<Selector>>;\n      return class GalenaMultiComponent extends Component<\n        OwnProps,\n        ReturnType<Selector>\n      > {\n        override state: any;\n        listeners: (() => void)[] = [];\n        constructor(props: OwnProps) {\n          super(props);\n          this.state = this.computeSelector();\n        }\n\n        static displayName = `GalenaMultiComponent(${\n          WrappedComponent.displayName ?? WrappedComponent.name ?? \"Component\"\n        })`;\n\n        public override componentDidMount() {\n          this.listeners = this.bindListeners();\n        }\n\n        public override UNSAFE_componentWillReceiveProps(nextProps: OwnProps) {\n          if (nextProps !== this.props) {\n            this.setState(this.computeSelector(nextProps));\n          }\n        }\n\n        public override shouldComponentUpdate(\n          nextProps: OwnProps,\n          nextState: ReturnType<Selector>,\n        ) {\n          return nextState !== this.state || nextProps !== this.props;\n        }\n\n        public override componentWillUnmount() {\n          while (this.listeners.length) {\n            this.listeners.pop()?.();\n          }\n        }\n\n        private bindListeners() {\n          return states.map(state => {\n            return state.subscribe(() => this.setState(this.computeSelector()));\n          });\n        }\n\n        private computeSelector(props: OwnProps = this.props) {\n          return selector(\n            states.map(s =>\n              s.getSnapshot(),\n            ) as DerivedArguments<StateInstances>,\n            props,\n          );\n        }\n\n        public override render() {\n          return <WrappedComponent {...this.props} {...this.state} />;\n        }\n      };\n    };\n  };\n};\n\nexport type ReactiveStates<T extends ReturnType<typeof connectMulti>> =\n  Parameters<Parameters<T>[0]>[0];\n"],"mappings":";;AAIA,MAAa,gBACX,GAAG,WACA;AACH,SACE,aACG;AACH,UACE,qBACkE;AAElE,UAAO,MAAM,6BAA6B,UAGxC;IACA;IACA,YAA4B,EAAE;IAC9B,YAAY,OAAiB;AAC3B,WAAM,MAAM;AACZ,UAAK,QAAQ,KAAK,iBAAiB;;IAGrC,OAAO,cAAc,wBACnB,iBAAiB,eAAe,iBAAiB,QAAQ,YAC1D;IAED,oBAAoC;AAClC,UAAK,YAAY,KAAK,eAAe;;IAGvC,iCAAiD,WAAqB;AACpE,SAAI,cAAc,KAAK,MACrB,MAAK,SAAS,KAAK,gBAAgB,UAAU,CAAC;;IAIlD,sBACE,WACA,WACA;AACA,YAAO,cAAc,KAAK,SAAS,cAAc,KAAK;;IAGxD,uBAAuC;AACrC,YAAO,KAAK,UAAU,OACpB,MAAK,UAAU,KAAK,IAAI;;IAI5B,gBAAwB;AACtB,YAAO,OAAO,KAAI,UAAS;AACzB,aAAO,MAAM,gBAAgB,KAAK,SAAS,KAAK,iBAAiB,CAAC,CAAC;OACnE;;IAGJ,gBAAwB,QAAkB,KAAK,OAAO;AACpD,YAAO,SACL,OAAO,KAAI,MACT,EAAE,aAAa,CAChB,EACD,MACD;;IAGH,SAAyB;AACvB,YAAO,CAAC,qBAAqB,KAAK,WAAW,KAAK"}

package/dist/connect.cjs

@@ -0,0 +1,41 @@
+let react = require("react");
+//#region src/connect.tsx
+const connect = (state) => {
+	return (selection) => {
+		return (WrappedComponent) => {
+			return class GalenaComponent extends react.Component {
+				state;
+				listener = null;
+				constructor(props) {
+					super(props);
+					this.update = this.update.bind(this);
+					this.state = selection(state.getSnapshot(), this.props);
+				}
+				static displayName = `GalenaComponent(${(WrappedComponent.displayName ?? WrappedComponent.name) || "Component"})`;
+				componentDidMount() {
+					this.listener = state.subscribe((state) => this.update(state));
+				}
+				UNSAFE_componentWillReceiveProps(nextProps) {
+					if (nextProps !== this.props) this.update(state.getSnapshot(), nextProps);
+				}
+				shouldComponentUpdate(nextProps, nextState) {
+					return nextState !== this.state || nextProps !== this.props;
+				}
+				componentWillUnmount() {
+					if (this.listener) {
+						this.listener();
+						this.listener = null;
+					}
+				}
+				update(nextState, ownProps = this.props) {
+					this.setState(selection(nextState, ownProps));
+				}
+				render() {
+					return <WrappedComponent {...this.props} {...this.state} />;
+				}
+			};
+		};
+	};
+};
+//#endregion
+exports.connect = connect;

package/dist/connect.d.cts

@@ -0,0 +1,9 @@
+import { Subtract } from "./types.cjs";
+import { State } from "./State.cjs";
+import { ComponentType } from "react";
+
+//#region src/connect.d.ts
+declare const connect: <StateInstance extends State<any>>(state: StateInstance) => <SelectorFunction extends (state: ReturnType<StateInstance["getSnapshot"]>, ownProps: any) => Record<string, any>>(selection: SelectorFunction) => <ComponentProps extends ReturnType<SelectorFunction>>(WrappedComponent: ComponentType<ComponentProps>) => ComponentType<Subtract<ComponentProps, ReturnType<SelectorFunction>>>;
+//#endregion
+export { connect };
+//# sourceMappingURL=connect.d.cts.map

package/dist/connect.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"connect.d.cts","names":[],"sources":["../src/connect.tsx"],"mappings":";;;;;cAIa,OAAA,yBAAiC,KAAA,OAC5C,KAAA,EAAO,aAAA,gCAKH,KAAA,EAAK,UAAA,CAAA,aAAA,kBACL,QAAA,UACG,MAAA,eAEL,SAAA,EAAW,gBAAA,6BAGW,UAAA,CAAA,gBAAA,GACpB,gBAAA,EAAkB,aAAA,CAAc,cAAA,MAC/B,aAAA,CAAc,QAAA,CAAS,cAAA,EAAc,UAAA,CAAA,gBAAA"}

package/dist/connect.d.mts

@@ -0,0 +1,9 @@
+import { Subtract } from "./types.mjs";
+import { State } from "./State.mjs";
+import { ComponentType } from "react";
+
+//#region src/connect.d.ts
+declare const connect: <StateInstance extends State<any>>(state: StateInstance) => <SelectorFunction extends (state: ReturnType<StateInstance["getSnapshot"]>, ownProps: any) => Record<string, any>>(selection: SelectorFunction) => <ComponentProps extends ReturnType<SelectorFunction>>(WrappedComponent: ComponentType<ComponentProps>) => ComponentType<Subtract<ComponentProps, ReturnType<SelectorFunction>>>;
+//#endregion
+export { connect };
+//# sourceMappingURL=connect.d.mts.map

package/dist/connect.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"connect.d.mts","names":[],"sources":["../src/connect.tsx"],"mappings":";;;;;cAIa,OAAA,yBAAiC,KAAA,OAC5C,KAAA,EAAO,aAAA,gCAKH,KAAA,EAAK,UAAA,CAAA,aAAA,kBACL,QAAA,UACG,MAAA,eAEL,SAAA,EAAW,gBAAA,6BAGW,UAAA,CAAA,gBAAA,GACpB,gBAAA,EAAkB,aAAA,CAAc,cAAA,MAC/B,aAAA,CAAc,QAAA,CAAS,cAAA,EAAc,UAAA,CAAA,gBAAA"}