@bemedev/app-reactjs 1.9.3 → 1.9.5

package/lib/useCan.cjs

@@ -1,19 +1,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 let _bemedev_app_utils = require("@bemedev/app/utils");
-let react = require("react");
+let _bemedev_react_sync = require("@bemedev/react-sync");
 let _bemedev_app_bemedev = require("@bemedev/app/bemedev");
 //#region src/useCan.ts
 function useCan(service) {
-	const dispatch = (matcher) => {
-		return (...events) => {
-			const selector = (_state) => {
-				return events[matcher]((event) => service.canEvent(event));
-			};
-			const [_state, setState] = (0, react.useState)(selector(service.state));
-			const sub = service.subscribe(() => setState(selector(service.state)), { equals: (first, next) => (0, _bemedev_app_utils.deepEqual)(first.value, next.value) });
-			(0, react.useEffect)(() => sub.unsubscribe, []);
-			return _state;
-		};
+	const dispatch = (matcher) => (...events) => {
+		return (0, _bemedev_react_sync.useSync)((listener) => {
+			const { unsubscribe } = service.subscribe(listener, { equals: (first, next) => (0, _bemedev_app_utils.deepEqual)(first.value, next.value) });
+			return unsubscribe;
+		}, () => service.state, () => service.state, () => events[matcher]((event) => service.canEvents(event)));
 	};
 	const or = dispatch("some");
 	const and = dispatch("every");

package/lib/useCan.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useCan.cjs","names":["useState","deepEqual","expandFn"],"sources":["../src/useCan.ts"],"sourcesContent":["import {\n  type AddSubscriber_F,\n  type EventObject,\n  type PrimitiveObject,\n  type State,\n} from '@bemedev/app';\nimport { expandFn } from '@bemedev/app/bemedev';\nimport { deepEqual } from '@bemedev/app/utils';\nimport { useEffect, useState } from 'react';\n\nexport function useCan<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n>(service: {\n  subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n  state: State<Eo, Tc, Ta>;\n  canEvent: (event: Eo['type']) => boolean;\n}) {\n  const dispatch = (matcher: 'some' | 'every') => {\n    return (...events: Eo['type'][]) => {\n      const selector = (_state: State<Eo, Tc, Ta>) => {\n        return events[matcher](event => service.canEvent(event));\n      };\n\n      const [_state, setState] = useState(selector(service.state));\n\n      const sub = service.subscribe(\n        () => setState(selector(service.state)),\n        { equals: (first, next) => deepEqual(first.value, next.value) },\n      );\n\n      useEffect(() => sub.unsubscribe, []);\n      return _state;\n    };\n  };\n\n  const or = dispatch('some');\n  const and = dispatch('every');\n  const out = expandFn(and, { or, and });\n  return out;\n}\n"],"mappings":";;;;;AAUA,SAAgB,OAId,SAIC;CACD,MAAM,YAAY,YAA8B;EAC9C,QAAQ,GAAG,WAAyB;GAClC,MAAM,YAAY,WAA8B;IAC9C,OAAO,OAAO,QAAQ,EAAC,UAAS,QAAQ,SAAS,KAAK,CAAC;GACzD;GAEA,MAAM,CAAC,QAAQ,aAAA,GAAYA,MAAAA,SAAAA,CAAS,SAAS,QAAQ,KAAK,CAAC;GAE3D,MAAM,MAAM,QAAQ,gBACZ,SAAS,SAAS,QAAQ,KAAK,CAAC,GACtC,EAAE,SAAS,OAAO,UAAA,GAASC,mBAAAA,UAAAA,CAAU,MAAM,OAAO,KAAK,KAAK,EAAE,CAChE;GAEA,CAAA,GAAA,MAAA,UAAA,OAAgB,IAAI,aAAa,CAAC,CAAC;GACnC,OAAO;EACT;CACF;CAEA,MAAM,KAAK,SAAS,MAAM;CAC1B,MAAM,MAAM,SAAS,OAAO;CAE5B,QAAA,GADYC,qBAAAA,SAAAA,CAAS,KAAK;EAAE;EAAI;CAAI,CAC3B;AACX"}
+{"version":3,"file":"useCan.cjs","names":["useSync","deepEqual","expandFn"],"sources":["../src/useCan.ts"],"sourcesContent":["import {\n  type AddSubscriber_F,\n  type EventObject,\n  type PrimitiveObject,\n  type State,\n} from '@bemedev/app';\nimport { expandFn } from '@bemedev/app/bemedev';\nimport { deepEqual } from '@bemedev/app/utils';\nimport { useSync } from '@bemedev/react-sync';\n\nexport function useCan<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n>(service: {\n  subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n  state: State<Eo, Tc, Ta>;\n  canEvents: (...events: Eo['type'][]) => boolean;\n}) {\n  const dispatch =\n    (matcher: 'some' | 'every') =>\n    (...events: Eo['type'][]) => {\n      return useSync(\n        listener => {\n          const { unsubscribe } = service.subscribe(listener, {\n            equals: (first, next) => deepEqual(first.value, next.value),\n          });\n          return unsubscribe;\n        },\n        () => service.state,\n        () => service.state,\n        () => events[matcher](event => service.canEvents(event)),\n      );\n    };\n\n  const or = dispatch('some');\n  const and = dispatch('every');\n  const out = expandFn(and, { or, and });\n  return out;\n}\n"],"mappings":";;;;;AAUA,SAAgB,OAId,SAIC;CACD,MAAM,YACH,aACA,GAAG,WAAyB;EAC3B,QAAA,GAAOA,oBAAAA,QAAAA,EACL,aAAY;GACV,MAAM,EAAE,gBAAgB,QAAQ,UAAU,UAAU,EAClD,SAAS,OAAO,UAAA,GAASC,mBAAAA,UAAAA,CAAU,MAAM,OAAO,KAAK,KAAK,EAC5D,CAAC;GACD,OAAO;EACT,SACM,QAAQ,aACR,QAAQ,aACR,OAAO,QAAQ,EAAC,UAAS,QAAQ,UAAU,KAAK,CAAC,CACzD;CACF;CAEF,MAAM,KAAK,SAAS,MAAM;CAC1B,MAAM,MAAM,SAAS,OAAO;CAE5B,QAAA,GADYC,qBAAAA,SAAAA,CAAS,KAAK;EAAE;EAAI;CAAI,CAC3B;AACX"}

package/lib/useCan.d.ts

@@ -2,7 +2,7 @@ import { type AddSubscriber_F, type EventObject, type PrimitiveObject, type Stat
 export declare function useCan<Tc extends PrimitiveObject, Ta extends string, Eo extends EventObject>(service: {
     subscribe: AddSubscriber_F<Tc, Ta, Eo>;
     state: State<Eo, Tc, Ta>;
-    canEvent: (event: Eo['type']) => boolean;
+    canEvents: (...events: Eo['type'][]) => boolean;
 }): import("@bemedev/app/bemedev").FnBasic<(...events: Eo["type"][]) => boolean, {
     readonly or: (...events: Eo["type"][]) => boolean;
     readonly and: (...events: Eo["type"][]) => boolean;

package/lib/useCan.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useCan.d.ts","sourceRoot":"","sources":["../src/useCan.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,eAAe,EACpB,KAAK,WAAW,EAChB,KAAK,eAAe,EACpB,KAAK,KAAK,EACX,MAAM,cAAc,CAAC;AAKtB,wBAAgB,MAAM,CACpB,EAAE,SAAS,eAAe,EAC1B,EAAE,SAAS,MAAM,EACjB,EAAE,SAAS,WAAW,EACtB,OAAO,EAAE;IACT,SAAS,EAAE,eAAe,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACvC,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACzB,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,OAAO,CAAC;CAC1C,sDAEsB,EAAE,CAAC,MAAM,CAAC,EAAE;6BAAZ,EAAE,CAAC,MAAM,CAAC,EAAE;8BAAZ,EAAE,CAAC,MAAM,CAAC,EAAE;GAqBlC"}
+{"version":3,"file":"useCan.d.ts","sourceRoot":"","sources":["../src/useCan.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,eAAe,EACpB,KAAK,WAAW,EAChB,KAAK,eAAe,EACpB,KAAK,KAAK,EACX,MAAM,cAAc,CAAC;AAKtB,wBAAgB,MAAM,CACpB,EAAE,SAAS,eAAe,EAC1B,EAAE,SAAS,MAAM,EACjB,EAAE,SAAS,WAAW,EACtB,OAAO,EAAE;IACT,SAAS,EAAE,eAAe,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACvC,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACzB,SAAS,EAAE,CAAC,GAAG,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,KAAK,OAAO,CAAC;CACjD,sDAGe,EAAE,CAAC,MAAM,CAAC,EAAE;6BAAZ,EAAE,CAAC,MAAM,CAAC,EAAE;8BAAZ,EAAE,CAAC,MAAM,CAAC,EAAE;GAkB3B"}

package/lib/useCan.js

@@ -1,18 +1,13 @@
 import { deepEqual } from "@bemedev/app/utils";
-import { useEffect, useState } from "react";
+import { useSync } from "@bemedev/react-sync";
 import { expandFn } from "@bemedev/app/bemedev";
 //#region src/useCan.ts
 function useCan(service) {
-	const dispatch = (matcher) => {
-		return (...events) => {
-			const selector = (_state) => {
-				return events[matcher]((event) => service.canEvent(event));
-			};
-			const [_state, setState] = useState(selector(service.state));
-			const sub = service.subscribe(() => setState(selector(service.state)), { equals: (first, next) => deepEqual(first.value, next.value) });
-			useEffect(() => sub.unsubscribe, []);
-			return _state;
-		};
+	const dispatch = (matcher) => (...events) => {
+		return useSync((listener) => {
+			const { unsubscribe } = service.subscribe(listener, { equals: (first, next) => deepEqual(first.value, next.value) });
+			return unsubscribe;
+		}, () => service.state, () => service.state, () => events[matcher]((event) => service.canEvents(event)));
 	};
 	const or = dispatch("some");
 	const and = dispatch("every");

package/lib/useCan.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCan.js","names":[],"sources":["../src/useCan.ts"],"sourcesContent":["import {\n  type AddSubscriber_F,\n  type EventObject,\n  type PrimitiveObject,\n  type State,\n} from '@bemedev/app';\nimport { expandFn } from '@bemedev/app/bemedev';\nimport { deepEqual } from '@bemedev/app/utils';\nimport { useEffect, useState } from 'react';\n\nexport function useCan<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n>(service: {\n  subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n  state: State<Eo, Tc, Ta>;\n  canEvent: (event: Eo['type']) => boolean;\n}) {\n  const dispatch = (matcher: 'some' | 'every') => {\n    return (...events: Eo['type'][]) => {\n      const selector = (_state: State<Eo, Tc, Ta>) => {\n        return events[matcher](event => service.canEvent(event));\n      };\n\n      const [_state, setState] = useState(selector(service.state));\n\n      const sub = service.subscribe(\n        () => setState(selector(service.state)),\n        { equals: (first, next) => deepEqual(first.value, next.value) },\n      );\n\n      useEffect(() => sub.unsubscribe, []);\n      return _state;\n    };\n  };\n\n  const or = dispatch('some');\n  const and = dispatch('every');\n  const out = expandFn(and, { or, and });\n  return out;\n}\n"],"mappings":";;;;AAUA,SAAgB,OAId,SAIC;CACD,MAAM,YAAY,YAA8B;EAC9C,QAAQ,GAAG,WAAyB;GAClC,MAAM,YAAY,WAA8B;IAC9C,OAAO,OAAO,QAAQ,EAAC,UAAS,QAAQ,SAAS,KAAK,CAAC;GACzD;GAEA,MAAM,CAAC,QAAQ,YAAY,SAAS,SAAS,QAAQ,KAAK,CAAC;GAE3D,MAAM,MAAM,QAAQ,gBACZ,SAAS,SAAS,QAAQ,KAAK,CAAC,GACtC,EAAE,SAAS,OAAO,SAAS,UAAU,MAAM,OAAO,KAAK,KAAK,EAAE,CAChE;GAEA,gBAAgB,IAAI,aAAa,CAAC,CAAC;GACnC,OAAO;EACT;CACF;CAEA,MAAM,KAAK,SAAS,MAAM;CAC1B,MAAM,MAAM,SAAS,OAAO;CAE5B,OADY,SAAS,KAAK;EAAE;EAAI;CAAI,CAC3B;AACX"}
+{"version":3,"file":"useCan.js","names":[],"sources":["../src/useCan.ts"],"sourcesContent":["import {\n  type AddSubscriber_F,\n  type EventObject,\n  type PrimitiveObject,\n  type State,\n} from '@bemedev/app';\nimport { expandFn } from '@bemedev/app/bemedev';\nimport { deepEqual } from '@bemedev/app/utils';\nimport { useSync } from '@bemedev/react-sync';\n\nexport function useCan<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n>(service: {\n  subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n  state: State<Eo, Tc, Ta>;\n  canEvents: (...events: Eo['type'][]) => boolean;\n}) {\n  const dispatch =\n    (matcher: 'some' | 'every') =>\n    (...events: Eo['type'][]) => {\n      return useSync(\n        listener => {\n          const { unsubscribe } = service.subscribe(listener, {\n            equals: (first, next) => deepEqual(first.value, next.value),\n          });\n          return unsubscribe;\n        },\n        () => service.state,\n        () => service.state,\n        () => events[matcher](event => service.canEvents(event)),\n      );\n    };\n\n  const or = dispatch('some');\n  const and = dispatch('every');\n  const out = expandFn(and, { or, and });\n  return out;\n}\n"],"mappings":";;;;AAUA,SAAgB,OAId,SAIC;CACD,MAAM,YACH,aACA,GAAG,WAAyB;EAC3B,OAAO,SACL,aAAY;GACV,MAAM,EAAE,gBAAgB,QAAQ,UAAU,UAAU,EAClD,SAAS,OAAO,SAAS,UAAU,MAAM,OAAO,KAAK,KAAK,EAC5D,CAAC;GACD,OAAO;EACT,SACM,QAAQ,aACR,QAAQ,aACR,OAAO,QAAQ,EAAC,UAAS,QAAQ,UAAU,KAAK,CAAC,CACzD;CACF;CAEF,MAAM,KAAK,SAAS,MAAM;CAC1B,MAAM,MAAM,SAAS,OAAO;CAE5B,OADY,SAAS,KAAK;EAAE;EAAI;CAAI,CAC3B;AACX"}

package/lib/useIsInside.cjs

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 let _bemedev_app_utils = require("@bemedev/app/utils");
-let react = require("react");
+let _bemedev_react_sync = require("@bemedev/react-sync");
 let _bemedev_app_bemedev = require("@bemedev/app/bemedev");
 //#region src/useIsInside.ts
 function useIsInside(service) {
@@ -9,13 +9,12 @@ function useIsInside(service) {
 	};
 	const dispatch = (matcher) => {
 		return (...states) => {
-			const selector = (_state) => {
+			return (0, _bemedev_react_sync.useSync)((listener) => {
+				const { unsubscribe } = service.subscribe(listener, { equals: (first, next) => (0, _bemedev_app_utils.deepEqual)(first.value, next.value) });
+				return unsubscribe;
+			}, () => service.state, () => service.state, (_state) => {
 				return states[matcher]((state) => selector1(_state).includes(state));
-			};
-			const [_state, setState] = (0, react.useState)(selector(service.state));
-			const sub = service.subscribe((nextState) => setState(selector(nextState)), { equals: (first, next) => (0, _bemedev_app_utils.deepEqual)(first.value, next.value) });
-			(0, react.useEffect)(() => sub.unsubscribe, []);
-			return _state;
+			});
 		};
 	};
 	const or = dispatch("some");

package/lib/useIsInside.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useIsInside.cjs","names":["decomposeSV","useState","deepEqual","expandFn"],"sources":["../src/useIsInside.ts"],"sourcesContent":["import type {\n  AddSubscriber_F,\n  EventObject,\n  PrimitiveObject,\n  State,\n} from '@bemedev/app';\nimport { decomposeSV, deepEqual } from '@bemedev/app/utils';\nimport { expandFn } from '@bemedev/app/bemedev';\nimport { useEffect, useState } from 'react';\n\nexport function useIsInside<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n>(service: {\n  subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n  state: State<Eo, Tc, Ta>;\n}) {\n  const selector1 = (_state: State<Eo, Tc, Ta>) => {\n    return decomposeSV(_state.value);\n  };\n\n  const dispatch = (matcher: 'some' | 'every') => {\n    return (...states: string[]) => {\n      const selector = (_state: State<Eo, Tc, Ta>) => {\n        return states[matcher](state => selector1(_state).includes(state));\n      };\n\n      const [_state, setState] = useState(selector(service.state));\n\n      const sub = service.subscribe(\n        nextState => setState(selector(nextState)),\n        { equals: (first, next) => deepEqual(first.value, next.value) },\n      );\n\n      useEffect(() => sub.unsubscribe, []);\n      return _state;\n    };\n  };\n\n  const or = dispatch('some');\n  const and = dispatch('every');\n  const out = expandFn(and, { or, and });\n  return out;\n}\n"],"mappings":";;;;;AAUA,SAAgB,YAId,SAGC;CACD,MAAM,aAAa,WAA8B;EAC/C,QAAA,GAAOA,mBAAAA,YAAAA,CAAY,OAAO,KAAK;CACjC;CAEA,MAAM,YAAY,YAA8B;EAC9C,QAAQ,GAAG,WAAqB;GAC9B,MAAM,YAAY,WAA8B;IAC9C,OAAO,OAAO,QAAQ,EAAC,UAAS,UAAU,MAAM,CAAC,CAAC,SAAS,KAAK,CAAC;GACnE;GAEA,MAAM,CAAC,QAAQ,aAAA,GAAYC,MAAAA,SAAAA,CAAS,SAAS,QAAQ,KAAK,CAAC;GAE3D,MAAM,MAAM,QAAQ,WAClB,cAAa,SAAS,SAAS,SAAS,CAAC,GACzC,EAAE,SAAS,OAAO,UAAA,GAASC,mBAAAA,UAAAA,CAAU,MAAM,OAAO,KAAK,KAAK,EAAE,CAChE;GAEA,CAAA,GAAA,MAAA,UAAA,OAAgB,IAAI,aAAa,CAAC,CAAC;GACnC,OAAO;EACT;CACF;CAEA,MAAM,KAAK,SAAS,MAAM;CAC1B,MAAM,MAAM,SAAS,OAAO;CAE5B,QAAA,GADYC,qBAAAA,SAAAA,CAAS,KAAK;EAAE;EAAI;CAAI,CAC3B;AACX"}
+{"version":3,"file":"useIsInside.cjs","names":["decomposeSV","useSync","deepEqual","expandFn"],"sources":["../src/useIsInside.ts"],"sourcesContent":["import type {\n  AddSubscriber_F,\n  EventObject,\n  PrimitiveObject,\n  State,\n} from '@bemedev/app';\nimport { expandFn } from '@bemedev/app/bemedev';\nimport { decomposeSV, deepEqual } from '@bemedev/app/utils';\nimport { useSync } from '@bemedev/react-sync';\n\nexport function useIsInside<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n>(service: {\n  subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n  state: State<Eo, Tc, Ta>;\n}) {\n  const selector1 = (_state: State<Eo, Tc, Ta>) => {\n    return decomposeSV(_state.value);\n  };\n\n  const dispatch = (matcher: 'some' | 'every') => {\n    return (...states: string[]) => {\n      return useSync(\n        listener => {\n          const { unsubscribe } = service.subscribe(listener, {\n            equals: (first, next) => deepEqual(first.value, next.value),\n          });\n          return unsubscribe;\n        },\n        () => service.state,\n        () => service.state,\n        _state => {\n          return states[matcher](state =>\n            selector1(_state).includes(state),\n          );\n        },\n      );\n    };\n  };\n\n  const or = dispatch('some');\n  const and = dispatch('every');\n  const out = expandFn(and, { or, and });\n  return out;\n}\n"],"mappings":";;;;;AAUA,SAAgB,YAId,SAGC;CACD,MAAM,aAAa,WAA8B;EAC/C,QAAA,GAAOA,mBAAAA,YAAAA,CAAY,OAAO,KAAK;CACjC;CAEA,MAAM,YAAY,YAA8B;EAC9C,QAAQ,GAAG,WAAqB;GAC9B,QAAA,GAAOC,oBAAAA,QAAAA,EACL,aAAY;IACV,MAAM,EAAE,gBAAgB,QAAQ,UAAU,UAAU,EAClD,SAAS,OAAO,UAAA,GAASC,mBAAAA,UAAAA,CAAU,MAAM,OAAO,KAAK,KAAK,EAC5D,CAAC;IACD,OAAO;GACT,SACM,QAAQ,aACR,QAAQ,QACd,WAAU;IACR,OAAO,OAAO,QAAQ,EAAC,UACrB,UAAU,MAAM,CAAC,CAAC,SAAS,KAAK,CAClC;GACF,CACF;EACF;CACF;CAEA,MAAM,KAAK,SAAS,MAAM;CAC1B,MAAM,MAAM,SAAS,OAAO;CAE5B,QAAA,GADYC,qBAAAA,SAAAA,CAAS,KAAK;EAAE;EAAI;CAAI,CAC3B;AACX"}

package/lib/useIsInside.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useIsInside.d.ts","sourceRoot":"","sources":["../src/useIsInside.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,eAAe,EACf,WAAW,EACX,eAAe,EACf,KAAK,EACN,MAAM,cAAc,CAAC;AAKtB,wBAAgB,WAAW,CACzB,EAAE,SAAS,eAAe,EAC1B,EAAE,SAAS,MAAM,EACjB,EAAE,SAAS,WAAW,EACtB,OAAO,EAAE;IACT,SAAS,EAAE,eAAe,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACvC,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;CAC1B,sDAMsB,MAAM,EAAE;6BAAR,MAAM,EAAE;8BAAR,MAAM,EAAE;GAqB9B"}
+{"version":3,"file":"useIsInside.d.ts","sourceRoot":"","sources":["../src/useIsInside.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,eAAe,EACf,WAAW,EACX,eAAe,EACf,KAAK,EACN,MAAM,cAAc,CAAC;AAKtB,wBAAgB,WAAW,CACzB,EAAE,SAAS,eAAe,EAC1B,EAAE,SAAS,MAAM,EACjB,EAAE,SAAS,WAAW,EACtB,OAAO,EAAE;IACT,SAAS,EAAE,eAAe,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACvC,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;CAC1B,sDAMsB,MAAM,EAAE;6BAAR,MAAM,EAAE;8BAAR,MAAM,EAAE;GAuB9B"}

package/lib/useIsInside.js

@@ -1,5 +1,5 @@
 import { decomposeSV, deepEqual } from "@bemedev/app/utils";
-import { useEffect, useState } from "react";
+import { useSync } from "@bemedev/react-sync";
 import { expandFn } from "@bemedev/app/bemedev";
 //#region src/useIsInside.ts
 function useIsInside(service) {
@@ -8,13 +8,12 @@ function useIsInside(service) {
 	};
 	const dispatch = (matcher) => {
 		return (...states) => {
-			const selector = (_state) => {
+			return useSync((listener) => {
+				const { unsubscribe } = service.subscribe(listener, { equals: (first, next) => deepEqual(first.value, next.value) });
+				return unsubscribe;
+			}, () => service.state, () => service.state, (_state) => {
 				return states[matcher]((state) => selector1(_state).includes(state));
-			};
-			const [_state, setState] = useState(selector(service.state));
-			const sub = service.subscribe((nextState) => setState(selector(nextState)), { equals: (first, next) => deepEqual(first.value, next.value) });
-			useEffect(() => sub.unsubscribe, []);
-			return _state;
+			});
 		};
 	};
 	const or = dispatch("some");

package/lib/useIsInside.js.map

@@ -1 +1 @@
-{"version":3,"file":"useIsInside.js","names":[],"sources":["../src/useIsInside.ts"],"sourcesContent":["import type {\n  AddSubscriber_F,\n  EventObject,\n  PrimitiveObject,\n  State,\n} from '@bemedev/app';\nimport { decomposeSV, deepEqual } from '@bemedev/app/utils';\nimport { expandFn } from '@bemedev/app/bemedev';\nimport { useEffect, useState } from 'react';\n\nexport function useIsInside<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n>(service: {\n  subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n  state: State<Eo, Tc, Ta>;\n}) {\n  const selector1 = (_state: State<Eo, Tc, Ta>) => {\n    return decomposeSV(_state.value);\n  };\n\n  const dispatch = (matcher: 'some' | 'every') => {\n    return (...states: string[]) => {\n      const selector = (_state: State<Eo, Tc, Ta>) => {\n        return states[matcher](state => selector1(_state).includes(state));\n      };\n\n      const [_state, setState] = useState(selector(service.state));\n\n      const sub = service.subscribe(\n        nextState => setState(selector(nextState)),\n        { equals: (first, next) => deepEqual(first.value, next.value) },\n      );\n\n      useEffect(() => sub.unsubscribe, []);\n      return _state;\n    };\n  };\n\n  const or = dispatch('some');\n  const and = dispatch('every');\n  const out = expandFn(and, { or, and });\n  return out;\n}\n"],"mappings":";;;;AAUA,SAAgB,YAId,SAGC;CACD,MAAM,aAAa,WAA8B;EAC/C,OAAO,YAAY,OAAO,KAAK;CACjC;CAEA,MAAM,YAAY,YAA8B;EAC9C,QAAQ,GAAG,WAAqB;GAC9B,MAAM,YAAY,WAA8B;IAC9C,OAAO,OAAO,QAAQ,EAAC,UAAS,UAAU,MAAM,CAAC,CAAC,SAAS,KAAK,CAAC;GACnE;GAEA,MAAM,CAAC,QAAQ,YAAY,SAAS,SAAS,QAAQ,KAAK,CAAC;GAE3D,MAAM,MAAM,QAAQ,WAClB,cAAa,SAAS,SAAS,SAAS,CAAC,GACzC,EAAE,SAAS,OAAO,SAAS,UAAU,MAAM,OAAO,KAAK,KAAK,EAAE,CAChE;GAEA,gBAAgB,IAAI,aAAa,CAAC,CAAC;GACnC,OAAO;EACT;CACF;CAEA,MAAM,KAAK,SAAS,MAAM;CAC1B,MAAM,MAAM,SAAS,OAAO;CAE5B,OADY,SAAS,KAAK;EAAE;EAAI;CAAI,CAC3B;AACX"}
+{"version":3,"file":"useIsInside.js","names":[],"sources":["../src/useIsInside.ts"],"sourcesContent":["import type {\n  AddSubscriber_F,\n  EventObject,\n  PrimitiveObject,\n  State,\n} from '@bemedev/app';\nimport { expandFn } from '@bemedev/app/bemedev';\nimport { decomposeSV, deepEqual } from '@bemedev/app/utils';\nimport { useSync } from '@bemedev/react-sync';\n\nexport function useIsInside<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n>(service: {\n  subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n  state: State<Eo, Tc, Ta>;\n}) {\n  const selector1 = (_state: State<Eo, Tc, Ta>) => {\n    return decomposeSV(_state.value);\n  };\n\n  const dispatch = (matcher: 'some' | 'every') => {\n    return (...states: string[]) => {\n      return useSync(\n        listener => {\n          const { unsubscribe } = service.subscribe(listener, {\n            equals: (first, next) => deepEqual(first.value, next.value),\n          });\n          return unsubscribe;\n        },\n        () => service.state,\n        () => service.state,\n        _state => {\n          return states[matcher](state =>\n            selector1(_state).includes(state),\n          );\n        },\n      );\n    };\n  };\n\n  const or = dispatch('some');\n  const and = dispatch('every');\n  const out = expandFn(and, { or, and });\n  return out;\n}\n"],"mappings":";;;;AAUA,SAAgB,YAId,SAGC;CACD,MAAM,aAAa,WAA8B;EAC/C,OAAO,YAAY,OAAO,KAAK;CACjC;CAEA,MAAM,YAAY,YAA8B;EAC9C,QAAQ,GAAG,WAAqB;GAC9B,OAAO,SACL,aAAY;IACV,MAAM,EAAE,gBAAgB,QAAQ,UAAU,UAAU,EAClD,SAAS,OAAO,SAAS,UAAU,MAAM,OAAO,KAAK,KAAK,EAC5D,CAAC;IACD,OAAO;GACT,SACM,QAAQ,aACR,QAAQ,QACd,WAAU;IACR,OAAO,OAAO,QAAQ,EAAC,UACrB,UAAU,MAAM,CAAC,CAAC,SAAS,KAAK,CAClC;GACF,CACF;EACF;CACF;CAEA,MAAM,KAAK,SAAS,MAAM;CAC1B,MAAM,MAAM,SAAS,OAAO;CAE5B,OADY,SAAS,KAAK;EAAE;EAAI;CAAI,CAC3B;AACX"}

package/lib/useService.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useService.cjs","names":["useState","useCan","useIsInside"],"sources":["../src/useService.ts"],"sourcesContent":["import type {\n  AddSubscriber_F,\n  EventObject,\n  PrimitiveObject,\n  State,\n} from '@bemedev/app';\nimport type { UseServiceOptions } from './types';\nimport { useCan } from './useCan';\nimport { useIsInside } from './useIsInside';\nimport { useState } from './useState';\n\nexport function useService<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n>(service: {\n  subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n  state: State<Eo, Tc, Ta>;\n  canEvent: (event: Eo['type']) => boolean;\n}) {\n  return {\n    state: <T = State<Eo, Tc, Ta>>(\n      options?: UseServiceOptions<Tc, Ta, Eo, T>,\n    ) => useState<Tc, Ta, Eo, T>(service, options),\n\n    can: useCan(service),\n    isInside: useIsInside(service),\n  };\n}\n\nexport const createHooks = useService;\n"],"mappings":";;;;;AAWA,SAAgB,WAId,SAIC;CACD,OAAO;EACL,QACE,YACGA,iBAAAA,SAAwB,SAAS,OAAO;EAE7C,KAAKC,eAAAA,OAAO,OAAO;EACnB,UAAUC,oBAAAA,YAAY,OAAO;CAC/B;AACF;AAEA,MAAa,cAAc"}
+{"version":3,"file":"useService.cjs","names":["useState","useCan","useIsInside"],"sources":["../src/useService.ts"],"sourcesContent":["import type {\n  AddSubscriber_F,\n  EventObject,\n  PrimitiveObject,\n  State,\n} from '@bemedev/app';\nimport type { UseServiceOptions } from './types';\nimport { useCan } from './useCan';\nimport { useIsInside } from './useIsInside';\nimport { useState } from './useState';\n\nexport function useService<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n>(service: {\n  subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n  state: State<Eo, Tc, Ta>;\n  canEvents: (...events: Eo['type'][]) => boolean;\n}) {\n  return {\n    state: <T = State<Eo, Tc, Ta>>(\n      options?: UseServiceOptions<Tc, Ta, Eo, T>,\n    ) => useState<Tc, Ta, Eo, T>(service, options),\n\n    can: useCan(service),\n    isInside: useIsInside(service),\n  };\n}\n\nexport const createHooks = useService;\n"],"mappings":";;;;;AAWA,SAAgB,WAId,SAIC;CACD,OAAO;EACL,QACE,YACGA,iBAAAA,SAAwB,SAAS,OAAO;EAE7C,KAAKC,eAAAA,OAAO,OAAO;EACnB,UAAUC,oBAAAA,YAAY,OAAO;CAC/B;AACF;AAEA,MAAa,cAAc"}

package/lib/useService.d.ts

@@ -3,7 +3,7 @@ import type { UseServiceOptions } from './types';
 export declare function useService<Tc extends PrimitiveObject, Ta extends string, Eo extends EventObject>(service: {
     subscribe: AddSubscriber_F<Tc, Ta, Eo>;
     state: State<Eo, Tc, Ta>;
-    canEvent: (event: Eo['type']) => boolean;
+    canEvents: (...events: Eo['type'][]) => boolean;
 }): {
     state: <T = State<Eo, Tc, Ta>>(options?: UseServiceOptions<Tc, Ta, Eo, T>) => T;
     can: import("@bemedev/app/bemedev").FnBasic<(...events: Eo["type"][]) => boolean, {

package/lib/useService.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useService.d.ts","sourceRoot":"","sources":["../src/useService.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,eAAe,EACf,WAAW,EACX,eAAe,EACf,KAAK,EACN,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAKjD,wBAAgB,UAAU,CACxB,EAAE,SAAS,eAAe,EAC1B,EAAE,SAAS,MAAM,EACjB,EAAE,SAAS,WAAW,EACtB,OAAO,EAAE;IACT,SAAS,EAAE,eAAe,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACvC,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACzB,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,OAAO,CAAC;CAC1C;YAEW,CAAC,gCACG,iBAAiB,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;;;;;;;;;EAM/C;AAED,eAAO,MAAM,WAAW,mBAAa,CAAC"}
+{"version":3,"file":"useService.d.ts","sourceRoot":"","sources":["../src/useService.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,eAAe,EACf,WAAW,EACX,eAAe,EACf,KAAK,EACN,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAKjD,wBAAgB,UAAU,CACxB,EAAE,SAAS,eAAe,EAC1B,EAAE,SAAS,MAAM,EACjB,EAAE,SAAS,WAAW,EACtB,OAAO,EAAE;IACT,SAAS,EAAE,eAAe,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACvC,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACzB,SAAS,EAAE,CAAC,GAAG,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,KAAK,OAAO,CAAC;CACjD;YAEW,CAAC,gCACG,iBAAiB,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;;;;;;;;;EAM/C;AAED,eAAO,MAAM,WAAW,mBAAa,CAAC"}

package/lib/useService.js.map

@@ -1 +1 @@
-{"version":3,"file":"useService.js","names":[],"sources":["../src/useService.ts"],"sourcesContent":["import type {\n  AddSubscriber_F,\n  EventObject,\n  PrimitiveObject,\n  State,\n} from '@bemedev/app';\nimport type { UseServiceOptions } from './types';\nimport { useCan } from './useCan';\nimport { useIsInside } from './useIsInside';\nimport { useState } from './useState';\n\nexport function useService<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n>(service: {\n  subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n  state: State<Eo, Tc, Ta>;\n  canEvent: (event: Eo['type']) => boolean;\n}) {\n  return {\n    state: <T = State<Eo, Tc, Ta>>(\n      options?: UseServiceOptions<Tc, Ta, Eo, T>,\n    ) => useState<Tc, Ta, Eo, T>(service, options),\n\n    can: useCan(service),\n    isInside: useIsInside(service),\n  };\n}\n\nexport const createHooks = useService;\n"],"mappings":";;;;AAWA,SAAgB,WAId,SAIC;CACD,OAAO;EACL,QACE,YACG,SAAwB,SAAS,OAAO;EAE7C,KAAK,OAAO,OAAO;EACnB,UAAU,YAAY,OAAO;CAC/B;AACF;AAEA,MAAa,cAAc"}
+{"version":3,"file":"useService.js","names":[],"sources":["../src/useService.ts"],"sourcesContent":["import type {\n  AddSubscriber_F,\n  EventObject,\n  PrimitiveObject,\n  State,\n} from '@bemedev/app';\nimport type { UseServiceOptions } from './types';\nimport { useCan } from './useCan';\nimport { useIsInside } from './useIsInside';\nimport { useState } from './useState';\n\nexport function useService<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n>(service: {\n  subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n  state: State<Eo, Tc, Ta>;\n  canEvents: (...events: Eo['type'][]) => boolean;\n}) {\n  return {\n    state: <T = State<Eo, Tc, Ta>>(\n      options?: UseServiceOptions<Tc, Ta, Eo, T>,\n    ) => useState<Tc, Ta, Eo, T>(service, options),\n\n    can: useCan(service),\n    isInside: useIsInside(service),\n  };\n}\n\nexport const createHooks = useService;\n"],"mappings":";;;;AAWA,SAAgB,WAId,SAIC;CACD,OAAO;EACL,QACE,YACG,SAAwB,SAAS,OAAO;EAE7C,KAAK,OAAO,OAAO;EACnB,UAAU,YAAY,OAAO;CAC/B;AACF;AAEA,MAAa,cAAc"}

package/lib/useState.cjs

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 let _bemedev_app_utils = require("@bemedev/app/utils");
-let react = require("react");
+let _bemedev_react_sync = require("@bemedev/react-sync");
 //#region src/useState.ts
 /**
 * A hook that creates a React state from a service with a subscribe function.
@@ -11,16 +11,14 @@ let react = require("react");
 */
 function useState(service, options) {
 	const { selector = (s) => s, equals = _bemedev_app_utils.deepEqual } = options ?? {};
-	const [_state, setState] = (0, react.useState)(() => selector(service.state));
-	const _selector = (0, react.useCallback)(selector, [selector]);
-	const _equals = (0, react.useCallback)(equals, [equals]);
-	const sub = service.subscribe((nextState) => setState(_selector(nextState)), { equals: (prev, next) => {
-		const _prev = _selector(prev);
-		const _next = _selector(next);
-		return _equals(_prev, _next);
-	} });
-	(0, react.useEffect)(() => sub.unsubscribe, []);
-	return _state;
+	return (0, _bemedev_react_sync.useSync)((listener) => {
+		const { unsubscribe } = service.subscribe(listener, { equals: (prev, next) => {
+			const _prev = selector(prev);
+			const _next = selector(next);
+			return equals(_prev, _next);
+		} });
+		return unsubscribe;
+	}, () => service.state, () => service.state, selector, equals);
 }
 //#endregion
 exports.useState = useState;

package/lib/useState.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useState.cjs","names":["deepEqual","useReactState","useCallback"],"sources":["../src/useState.ts"],"sourcesContent":["import type {\n  AddSubscriber_F,\n  EventObject,\n  PrimitiveObject,\n  State,\n} from '@bemedev/app';\nimport { deepEqual } from '@bemedev/app/utils';\nimport { useCallback, useEffect, useState as useReactState } from 'react';\nimport type { UseServiceOptions } from './types';\n\n/**\n * A hook that creates a React state from a service with a subscribe function.\n *\n * @param service - The service containing the state and subscribe method.\n * @param options - Optional configuration options for selection and equality comparison.\n * @returns The selected state.\n */\nexport function useState<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n  T = State<Eo, Tc, Ta>,\n>(\n  service: {\n    subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n    state: State<Eo, Tc, Ta>;\n  },\n  options?: UseServiceOptions<Tc, Ta, Eo, T>,\n): T {\n  const {\n    selector = (s: State<Eo, Tc, Ta>) => s as T,\n    equals = deepEqual<T>,\n  } = options ?? {};\n\n  const [_state, setState] = useReactState<T>(() =>\n    selector(service.state),\n  );\n\n  const _selector = useCallback(selector, [selector]);\n  const _equals = useCallback(equals, [equals]);\n\n  const sub = service.subscribe(\n    nextState => setState(_selector(nextState)),\n    {\n      equals: (prev, next) => {\n        const _prev = _selector(prev);\n        const _next = _selector(next);\n        return _equals(_prev, _next);\n      },\n    },\n  );\n\n  useEffect(() => sub.unsubscribe, []);\n  return _state;\n}\n"],"mappings":";;;;;;;;;;;AAiBA,SAAgB,SAMd,SAIA,SACG;CACH,MAAM,EACJ,YAAY,MAAyB,GACrC,SAASA,mBAAAA,cACP,WAAW,CAAC;CAEhB,MAAM,CAAC,QAAQ,aAAA,GAAYC,MAAAA,SAAAA,OACzB,SAAS,QAAQ,KAAK,CACxB;CAEA,MAAM,aAAA,GAAYC,MAAAA,YAAAA,CAAY,UAAU,CAAC,QAAQ,CAAC;CAClD,MAAM,WAAA,GAAUA,MAAAA,YAAAA,CAAY,QAAQ,CAAC,MAAM,CAAC;CAE5C,MAAM,MAAM,QAAQ,WAClB,cAAa,SAAS,UAAU,SAAS,CAAC,GAC1C,EACE,SAAS,MAAM,SAAS;EACtB,MAAM,QAAQ,UAAU,IAAI;EAC5B,MAAM,QAAQ,UAAU,IAAI;EAC5B,OAAO,QAAQ,OAAO,KAAK;CAC7B,EACF,CACF;CAEA,CAAA,GAAA,MAAA,UAAA,OAAgB,IAAI,aAAa,CAAC,CAAC;CACnC,OAAO;AACT"}
+{"version":3,"file":"useState.cjs","names":["deepEqual","useSync"],"sources":["../src/useState.ts"],"sourcesContent":["import type {\n  AddSubscriber_F,\n  EventObject,\n  PrimitiveObject,\n  State,\n} from '@bemedev/app';\nimport { deepEqual } from '@bemedev/app/utils';\nimport { useSync } from '@bemedev/react-sync';\nimport type { UseServiceOptions } from './types';\n\n/**\n * A hook that creates a React state from a service with a subscribe function.\n *\n * @param service - The service containing the state and subscribe method.\n * @param options - Optional configuration options for selection and equality comparison.\n * @returns The selected state.\n */\nexport function useState<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n  T = State<Eo, Tc, Ta>,\n>(\n  service: {\n    subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n    state: State<Eo, Tc, Ta>;\n  },\n  options?: UseServiceOptions<Tc, Ta, Eo, T>,\n): T {\n  const {\n    selector = (s: State<Eo, Tc, Ta>) => s as T,\n    equals = deepEqual<T>,\n  } = options ?? {};\n\n  return useSync(\n    listener => {\n      const { unsubscribe } = service.subscribe(listener, {\n        equals: (prev, next) => {\n          const _prev = selector(prev);\n          const _next = selector(next);\n          return equals(_prev, _next);\n        },\n      });\n      return unsubscribe;\n    },\n    () => service.state,\n    () => service.state,\n    selector,\n    equals,\n  );\n}\n"],"mappings":";;;;;;;;;;;AAiBA,SAAgB,SAMd,SAIA,SACG;CACH,MAAM,EACJ,YAAY,MAAyB,GACrC,SAASA,mBAAAA,cACP,WAAW,CAAC;CAEhB,QAAA,GAAOC,oBAAAA,QAAAA,EACL,aAAY;EACV,MAAM,EAAE,gBAAgB,QAAQ,UAAU,UAAU,EAClD,SAAS,MAAM,SAAS;GACtB,MAAM,QAAQ,SAAS,IAAI;GAC3B,MAAM,QAAQ,SAAS,IAAI;GAC3B,OAAO,OAAO,OAAO,KAAK;EAC5B,EACF,CAAC;EACD,OAAO;CACT,SACM,QAAQ,aACR,QAAQ,OACd,UACA,MACF;AACF"}

package/lib/useState.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useState.d.ts","sourceRoot":"","sources":["../src/useState.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,eAAe,EACf,WAAW,EACX,eAAe,EACf,KAAK,EACN,MAAM,cAAc,CAAC;AAGtB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAEjD;;;;;;GAMG;AACH,wBAAgB,QAAQ,CACtB,EAAE,SAAS,eAAe,EAC1B,EAAE,SAAS,MAAM,EACjB,EAAE,SAAS,WAAW,EACtB,CAAC,GAAG,KAAK,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAErB,OAAO,EAAE;IACP,SAAS,EAAE,eAAe,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACvC,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;CAC1B,EACD,OAAO,CAAC,EAAE,iBAAiB,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,GACzC,CAAC,CA0BH"}
+{"version":3,"file":"useState.d.ts","sourceRoot":"","sources":["../src/useState.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,eAAe,EACf,WAAW,EACX,eAAe,EACf,KAAK,EACN,MAAM,cAAc,CAAC;AAGtB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAEjD;;;;;;GAMG;AACH,wBAAgB,QAAQ,CACtB,EAAE,SAAS,eAAe,EAC1B,EAAE,SAAS,MAAM,EACjB,EAAE,SAAS,WAAW,EACtB,CAAC,GAAG,KAAK,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAErB,OAAO,EAAE;IACP,SAAS,EAAE,eAAe,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACvC,KAAK,EAAE,KAAK,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;CAC1B,EACD,OAAO,CAAC,EAAE,iBAAiB,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,GACzC,CAAC,CAsBH"}

package/lib/useState.js

@@ -1,5 +1,5 @@
 import { deepEqual } from "@bemedev/app/utils";
-import { useCallback, useEffect, useState as useState$1 } from "react";
+import { useSync } from "@bemedev/react-sync";
 //#region src/useState.ts
 /**
 * A hook that creates a React state from a service with a subscribe function.
@@ -10,16 +10,14 @@ import { useCallback, useEffect, useState as useState$1 } from "react";
 */
 function useState(service, options) {
 	const { selector = (s) => s, equals = deepEqual } = options ?? {};
-	const [_state, setState] = useState$1(() => selector(service.state));
-	const _selector = useCallback(selector, [selector]);
-	const _equals = useCallback(equals, [equals]);
-	const sub = service.subscribe((nextState) => setState(_selector(nextState)), { equals: (prev, next) => {
-		const _prev = _selector(prev);
-		const _next = _selector(next);
-		return _equals(_prev, _next);
-	} });
-	useEffect(() => sub.unsubscribe, []);
-	return _state;
+	return useSync((listener) => {
+		const { unsubscribe } = service.subscribe(listener, { equals: (prev, next) => {
+			const _prev = selector(prev);
+			const _next = selector(next);
+			return equals(_prev, _next);
+		} });
+		return unsubscribe;
+	}, () => service.state, () => service.state, selector, equals);
 }
 //#endregion
 export { useState };

package/lib/useState.js.map

@@ -1 +1 @@
-{"version":3,"file":"useState.js","names":["useReactState"],"sources":["../src/useState.ts"],"sourcesContent":["import type {\n  AddSubscriber_F,\n  EventObject,\n  PrimitiveObject,\n  State,\n} from '@bemedev/app';\nimport { deepEqual } from '@bemedev/app/utils';\nimport { useCallback, useEffect, useState as useReactState } from 'react';\nimport type { UseServiceOptions } from './types';\n\n/**\n * A hook that creates a React state from a service with a subscribe function.\n *\n * @param service - The service containing the state and subscribe method.\n * @param options - Optional configuration options for selection and equality comparison.\n * @returns The selected state.\n */\nexport function useState<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n  T = State<Eo, Tc, Ta>,\n>(\n  service: {\n    subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n    state: State<Eo, Tc, Ta>;\n  },\n  options?: UseServiceOptions<Tc, Ta, Eo, T>,\n): T {\n  const {\n    selector = (s: State<Eo, Tc, Ta>) => s as T,\n    equals = deepEqual<T>,\n  } = options ?? {};\n\n  const [_state, setState] = useReactState<T>(() =>\n    selector(service.state),\n  );\n\n  const _selector = useCallback(selector, [selector]);\n  const _equals = useCallback(equals, [equals]);\n\n  const sub = service.subscribe(\n    nextState => setState(_selector(nextState)),\n    {\n      equals: (prev, next) => {\n        const _prev = _selector(prev);\n        const _next = _selector(next);\n        return _equals(_prev, _next);\n      },\n    },\n  );\n\n  useEffect(() => sub.unsubscribe, []);\n  return _state;\n}\n"],"mappings":";;;;;;;;;;AAiBA,SAAgB,SAMd,SAIA,SACG;CACH,MAAM,EACJ,YAAY,MAAyB,GACrC,SAAS,cACP,WAAW,CAAC;CAEhB,MAAM,CAAC,QAAQ,YAAYA,iBACzB,SAAS,QAAQ,KAAK,CACxB;CAEA,MAAM,YAAY,YAAY,UAAU,CAAC,QAAQ,CAAC;CAClD,MAAM,UAAU,YAAY,QAAQ,CAAC,MAAM,CAAC;CAE5C,MAAM,MAAM,QAAQ,WAClB,cAAa,SAAS,UAAU,SAAS,CAAC,GAC1C,EACE,SAAS,MAAM,SAAS;EACtB,MAAM,QAAQ,UAAU,IAAI;EAC5B,MAAM,QAAQ,UAAU,IAAI;EAC5B,OAAO,QAAQ,OAAO,KAAK;CAC7B,EACF,CACF;CAEA,gBAAgB,IAAI,aAAa,CAAC,CAAC;CACnC,OAAO;AACT"}
+{"version":3,"file":"useState.js","names":[],"sources":["../src/useState.ts"],"sourcesContent":["import type {\n  AddSubscriber_F,\n  EventObject,\n  PrimitiveObject,\n  State,\n} from '@bemedev/app';\nimport { deepEqual } from '@bemedev/app/utils';\nimport { useSync } from '@bemedev/react-sync';\nimport type { UseServiceOptions } from './types';\n\n/**\n * A hook that creates a React state from a service with a subscribe function.\n *\n * @param service - The service containing the state and subscribe method.\n * @param options - Optional configuration options for selection and equality comparison.\n * @returns The selected state.\n */\nexport function useState<\n  Tc extends PrimitiveObject,\n  Ta extends string,\n  Eo extends EventObject,\n  T = State<Eo, Tc, Ta>,\n>(\n  service: {\n    subscribe: AddSubscriber_F<Tc, Ta, Eo>;\n    state: State<Eo, Tc, Ta>;\n  },\n  options?: UseServiceOptions<Tc, Ta, Eo, T>,\n): T {\n  const {\n    selector = (s: State<Eo, Tc, Ta>) => s as T,\n    equals = deepEqual<T>,\n  } = options ?? {};\n\n  return useSync(\n    listener => {\n      const { unsubscribe } = service.subscribe(listener, {\n        equals: (prev, next) => {\n          const _prev = selector(prev);\n          const _next = selector(next);\n          return equals(_prev, _next);\n        },\n      });\n      return unsubscribe;\n    },\n    () => service.state,\n    () => service.state,\n    selector,\n    equals,\n  );\n}\n"],"mappings":";;;;;;;;;;AAiBA,SAAgB,SAMd,SAIA,SACG;CACH,MAAM,EACJ,YAAY,MAAyB,GACrC,SAAS,cACP,WAAW,CAAC;CAEhB,OAAO,SACL,aAAY;EACV,MAAM,EAAE,gBAAgB,QAAQ,UAAU,UAAU,EAClD,SAAS,MAAM,SAAS;GACtB,MAAM,QAAQ,SAAS,IAAI;GAC3B,MAAM,QAAQ,SAAS,IAAI;GAC3B,OAAO,OAAO,OAAO,KAAK;EAC5B,EACF,CAAC;EACD,OAAO;CACT,SACM,QAAQ,aACR,QAAQ,OACd,UACA,MACF;AACF"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bemedev/app-reactjs",
-  "version": "1.9.3",
+  "version": "1.9.5",
   "description": "Middleware between @bemedev/app and reactjs",
   "keywords": [
     "app",
@@ -61,25 +61,25 @@
     "husky": "^9.1.7",
     "jsdom": "^30.0.1",
     "onchange": "^7.1.0",
-    "oxfmt": "^0.61.0",
-    "oxlint": "^1.76.0",
+    "oxfmt": "^0.62.0",
+    "oxlint": "^1.77.0",
     "prettier": "^3.9.6",
     "pretty-quick": "^4.2.2",
     "react": "^19.2.8",
     "react-dom": "^19.2.8",
-    "rolldown": "1.2.1",
+    "rolldown": "1.2.2",
     "rolldown-plugin-dts": "^0.28.0",
     "size-limit": "^13.0.3",
     "tslib": "^2.8.1",
-    "tsx": "^4.23.4",
-    "typescript": "^6.0.3",
+    "tsx": "^4.23.5",
+    "typescript": "6.0.3",
     "vitest": "^4.1.10",
-    "@bemedev/app": "^1.9.3",
-    "@bemedev/app-vitest": "^1.9.3"
+    "@bemedev/app": "^1.9.4",
+    "@bemedev/app-vitest": "^1.9.4"
   },
   "peerDependencies": {
     "react": "^19.2.8",
-    "@bemedev/app": "^1.9.3"
+    "@bemedev/app": "^1.9.4"
   },
   "size-limit": [
     {
@@ -94,6 +94,9 @@
   "engines": {
     "node": ">=24"
   },
+  "dependencies": {
+    "@bemedev/react-sync": "^0.1.1"
+  },
   "scripts": {
     "build": "pnpm run rm:lib && pnpm run rolldown",
     "_ci": "pnpm run lint && pnpm run test",