@tanstack/react-store 0.0.1-beta.113 → 0.0.1-beta.120

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/build/cjs/index.js +43 -0
  2. package/build/cjs/index.js.map +1 -1
  3. package/build/esm/index.js +43 -0
  4. package/build/esm/index.js.map +1 -1
  5. package/build/stats-html.html +1 -1
  6. package/build/stats-react.json +31 -17
  7. package/build/umd/index.development.js +46 -4
  8. package/build/umd/index.development.js.map +1 -1
  9. package/build/umd/index.production.js +2 -2
  10. package/build/umd/index.production.js.map +1 -1
  11. package/package.json +1 -1
  12. package/src/index.tsx +45 -0
package/build/cjs/index.js CHANGED
@@ -12,11 +12,54 @@
12
12
 
13
13
  Object.defineProperty(exports, '__esModule', { value: true });
14
14
 
15
+ require('react');
15
16
  var withSelector = require('use-sync-external-store/shim/with-selector');
16
17
  var store = require('@tanstack/store');
17
18
 
18
19
  function useStore(store, selector = d => d) {
20
+ // const isMountedRef = React.useRef(false)
21
+ // const [state, setState] = React.useState<{ ref: TSelected }>(() => ({
22
+ // ref: selector(store.state),
23
+ // }))
24
+
25
+ // if (!shallow(selector(store.state), state.ref)) {
26
+ // setState(() => ({ ref: selector(store.state) }))
27
+ // }
28
+
29
+ // useLayoutEffect(() => {
30
+ // console.log('effect')
31
+
32
+ // const cb = () => {
33
+ // const next = selector(store.state)
34
+ // console.log('onsub')
35
+ // if (!shallow(next, state.ref)) {
36
+ // console.log('set')
37
+ // setState(() => ({ ref: selector(store.state) }))
38
+ // }
39
+ // }
40
+
41
+ // return store.subscribe(cb)
42
+ // }, [])
43
+
19
44
  const slice = withSelector.useSyncExternalStoreWithSelector(store.subscribe, () => store.state, () => store.state, selector, shallow);
45
+
46
+ // if (!isMountedRef.current) {
47
+ // state.ref = slice
48
+ // }
49
+
50
+ // if (!shallow(slice, state.ref)) {
51
+ // setState({ ref: slice })
52
+ // }
53
+
54
+ // React.useEffect(() => {
55
+ // isMountedRef.current = true
56
+ // return () => {
57
+ // isMountedRef.current = false
58
+ // }
59
+ // }, [])
60
+
61
+ // return state.ref
62
+
20
63
  return slice;
21
64
  }
22
65
  function shallow(objA, objB) {
package/build/cjs/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/index.tsx"],"sourcesContent":["import { AnyUpdater, Store } from '@tanstack/store'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector'\n\nexport * from '@tanstack/store'\n\nexport type NoInfer<T> = [T][T extends any ? 0 : never]\n\nexport function useStore<\n TState,\n TSelected = NoInfer<TState>,\n TUpdater extends AnyUpdater = AnyUpdater,\n>(\n store: Store<TState, TUpdater>,\n selector: (state: NoInfer<TState>) => TSelected = (d) => d as any,\n) {\n const slice = useSyncExternalStoreWithSelector(\n store.subscribe,\n () => store.state,\n () => store.state,\n selector,\n shallow,\n )\n\n return slice\n}\n\nexport function shallow<T>(objA: T, objB: T) {\n if (Object.is(objA, objB)) {\n return true\n }\n\n if (\n typeof objA !== 'object' ||\n objA === null ||\n typeof objB !== 'object' ||\n objB === null\n ) {\n return false\n }\n\n const keysA = Object.keys(objA)\n if (keysA.length !== Object.keys(objB).length) {\n return false\n }\n\n for (let i = 0; i < keysA.length; i++) {\n if (\n !Object.prototype.hasOwnProperty.call(objB, keysA[i] as string) ||\n !Object.is(objA[keysA[i] as keyof T], objB[keysA[i] as keyof T])\n ) {\n return false\n }\n }\n return true\n}\n"],"names":["useStore","store","selector","d","slice","useSyncExternalStoreWithSelector","subscribe","state","shallow","objA","objB","Object","is","keysA","keys","length","i","prototype","hasOwnProperty","call"],"mappings":";;;;;;;;;;;;;;;;;AAOO,SAASA,QAAQ,CAKtBC,KAA8B,EAC9BC,QAA+C,GAAIC,CAAC,IAAKA,CAAQ,EACjE;EACA,MAAMC,KAAK,GAAGC,6CAAgC,CAC5CJ,KAAK,CAACK,SAAS,EACf,MAAML,KAAK,CAACM,KAAK,EACjB,MAAMN,KAAK,CAACM,KAAK,EACjBL,QAAQ,EACRM,OAAO,CACR,CAAA;AAED,EAAA,OAAOJ,KAAK,CAAA;AACd,CAAA;AAEO,SAASI,OAAO,CAAIC,IAAO,EAAEC,IAAO,EAAE;EAC3C,IAAIC,MAAM,CAACC,EAAE,CAACH,IAAI,EAAEC,IAAI,CAAC,EAAE;AACzB,IAAA,OAAO,IAAI,CAAA;AACb,GAAA;AAEA,EAAA,IACE,OAAOD,IAAI,KAAK,QAAQ,IACxBA,IAAI,KAAK,IAAI,IACb,OAAOC,IAAI,KAAK,QAAQ,IACxBA,IAAI,KAAK,IAAI,EACb;AACA,IAAA,OAAO,KAAK,CAAA;AACd,GAAA;AAEA,EAAA,MAAMG,KAAK,GAAGF,MAAM,CAACG,IAAI,CAACL,IAAI,CAAC,CAAA;AAC/B,EAAA,IAAII,KAAK,CAACE,MAAM,KAAKJ,MAAM,CAACG,IAAI,CAACJ,IAAI,CAAC,CAACK,MAAM,EAAE;AAC7C,IAAA,OAAO,KAAK,CAAA;AACd,GAAA;AAEA,EAAA,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGH,KAAK,CAACE,MAAM,EAAEC,CAAC,EAAE,EAAE;AACrC,IAAA,IACE,CAACL,MAAM,CAACM,SAAS,CAACC,cAAc,CAACC,IAAI,CAACT,IAAI,EAAEG,KAAK,CAACG,CAAC,CAAC,CAAW,IAC/D,CAACL,MAAM,CAACC,EAAE,CAACH,IAAI,CAACI,KAAK,CAACG,CAAC,CAAC,CAAY,EAAEN,IAAI,CAACG,KAAK,CAACG,CAAC,CAAC,CAAY,CAAC,EAChE;AACA,MAAA,OAAO,KAAK,CAAA;AACd,KAAA;AACF,GAAA;AACA,EAAA,OAAO,IAAI,CAAA;AACb;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":["../../src/index.tsx"],"sourcesContent":["import * as React from 'react'\nimport { AnyUpdater, Store } from '@tanstack/store'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector'\n\nexport * from '@tanstack/store'\n\nexport type NoInfer<T> = [T][T extends any ? 0 : never]\n\nconst useLayoutEffect =\n typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect\n\nexport function useStore<\n TState,\n TSelected = NoInfer<TState>,\n TUpdater extends AnyUpdater = AnyUpdater,\n>(\n store: Store<TState, TUpdater>,\n selector: (state: NoInfer<TState>) => TSelected = (d) => d as any,\n) {\n // const isMountedRef = React.useRef(false)\n // const [state, setState] = React.useState<{ ref: TSelected }>(() => ({\n // ref: selector(store.state),\n // }))\n\n // if (!shallow(selector(store.state), state.ref)) {\n // setState(() => ({ ref: selector(store.state) }))\n // }\n\n // useLayoutEffect(() => {\n // console.log('effect')\n\n // const cb = () => {\n // const next = selector(store.state)\n // console.log('onsub')\n // if (!shallow(next, state.ref)) {\n // console.log('set')\n // setState(() => ({ ref: selector(store.state) }))\n // }\n // }\n\n // return store.subscribe(cb)\n // }, [])\n\n const slice = useSyncExternalStoreWithSelector(\n store.subscribe,\n () => store.state,\n () => store.state,\n selector,\n shallow,\n )\n\n // if (!isMountedRef.current) {\n // state.ref = slice\n // }\n\n // if (!shallow(slice, state.ref)) {\n // setState({ ref: slice })\n // }\n\n // React.useEffect(() => {\n // isMountedRef.current = true\n // return () => {\n // isMountedRef.current = false\n // }\n // }, [])\n\n // return state.ref\n\n return slice\n}\n\nexport function shallow<T>(objA: T, objB: T) {\n if (Object.is(objA, objB)) {\n return true\n }\n\n if (\n typeof objA !== 'object' ||\n objA === null ||\n typeof objB !== 'object' ||\n objB === null\n ) {\n return false\n }\n\n const keysA = Object.keys(objA)\n if (keysA.length !== Object.keys(objB).length) {\n return false\n }\n\n for (let i = 0; i < keysA.length; i++) {\n if (\n !Object.prototype.hasOwnProperty.call(objB, keysA[i] as string) ||\n !Object.is(objA[keysA[i] as keyof T], objB[keysA[i] as keyof T])\n ) {\n return false\n }\n }\n return true\n}\n"],"names":["useStore","store","selector","d","slice","useSyncExternalStoreWithSelector","subscribe","state","shallow","objA","objB","Object","is","keysA","keys","length","i","prototype","hasOwnProperty","call"],"mappings":";;;;;;;;;;;;;;;;;;AAWO,SAASA,QAAQ,CAKtBC,KAA8B,EAC9BC,QAA+C,GAAIC,CAAC,IAAKA,CAAQ,EACjE;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;EAEA,MAAMC,KAAK,GAAGC,6CAAgC,CAC5CJ,KAAK,CAACK,SAAS,EACf,MAAML,KAAK,CAACM,KAAK,EACjB,MAAMN,KAAK,CAACM,KAAK,EACjBL,QAAQ,EACRM,OAAO,CACR,CAAA;;AAED;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA,EAAA,OAAOJ,KAAK,CAAA;AACd,CAAA;AAEO,SAASI,OAAO,CAAIC,IAAO,EAAEC,IAAO,EAAE;EAC3C,IAAIC,MAAM,CAACC,EAAE,CAACH,IAAI,EAAEC,IAAI,CAAC,EAAE;AACzB,IAAA,OAAO,IAAI,CAAA;AACb,GAAA;AAEA,EAAA,IACE,OAAOD,IAAI,KAAK,QAAQ,IACxBA,IAAI,KAAK,IAAI,IACb,OAAOC,IAAI,KAAK,QAAQ,IACxBA,IAAI,KAAK,IAAI,EACb;AACA,IAAA,OAAO,KAAK,CAAA;AACd,GAAA;AAEA,EAAA,MAAMG,KAAK,GAAGF,MAAM,CAACG,IAAI,CAACL,IAAI,CAAC,CAAA;AAC/B,EAAA,IAAII,KAAK,CAACE,MAAM,KAAKJ,MAAM,CAACG,IAAI,CAACJ,IAAI,CAAC,CAACK,MAAM,EAAE;AAC7C,IAAA,OAAO,KAAK,CAAA;AACd,GAAA;AAEA,EAAA,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGH,KAAK,CAACE,MAAM,EAAEC,CAAC,EAAE,EAAE;AACrC,IAAA,IACE,CAACL,MAAM,CAACM,SAAS,CAACC,cAAc,CAACC,IAAI,CAACT,IAAI,EAAEG,KAAK,CAACG,CAAC,CAAC,CAAW,IAC/D,CAACL,MAAM,CAACC,EAAE,CAACH,IAAI,CAACI,KAAK,CAACG,CAAC,CAAC,CAAY,EAAEN,IAAI,CAACG,KAAK,CAACG,CAAC,CAAC,CAAY,CAAC,EAChE;AACA,MAAA,OAAO,KAAK,CAAA;AACd,KAAA;AACF,GAAA;AACA,EAAA,OAAO,IAAI,CAAA;AACb;;;;;;;;;;;"}
package/build/esm/index.js CHANGED
@@ -8,11 +8,54 @@
8
8
  *
9
9
  * @license MIT
10
10
  */
11
+ import 'react';
11
12
  import { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector';
12
13
  export * from '@tanstack/store';
13
14
 
14
15
  function useStore(store, selector = d => d) {
16
+ // const isMountedRef = React.useRef(false)
17
+ // const [state, setState] = React.useState<{ ref: TSelected }>(() => ({
18
+ // ref: selector(store.state),
19
+ // }))
20
+
21
+ // if (!shallow(selector(store.state), state.ref)) {
22
+ // setState(() => ({ ref: selector(store.state) }))
23
+ // }
24
+
25
+ // useLayoutEffect(() => {
26
+ // console.log('effect')
27
+
28
+ // const cb = () => {
29
+ // const next = selector(store.state)
30
+ // console.log('onsub')
31
+ // if (!shallow(next, state.ref)) {
32
+ // console.log('set')
33
+ // setState(() => ({ ref: selector(store.state) }))
34
+ // }
35
+ // }
36
+
37
+ // return store.subscribe(cb)
38
+ // }, [])
39
+
15
40
  const slice = useSyncExternalStoreWithSelector(store.subscribe, () => store.state, () => store.state, selector, shallow);
41
+
42
+ // if (!isMountedRef.current) {
43
+ // state.ref = slice
44
+ // }
45
+
46
+ // if (!shallow(slice, state.ref)) {
47
+ // setState({ ref: slice })
48
+ // }
49
+
50
+ // React.useEffect(() => {
51
+ // isMountedRef.current = true
52
+ // return () => {
53
+ // isMountedRef.current = false
54
+ // }
55
+ // }, [])
56
+
57
+ // return state.ref
58
+
16
59
  return slice;
17
60
  }
18
61
  function shallow(objA, objB) {
package/build/esm/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/index.tsx"],"sourcesContent":["import { AnyUpdater, Store } from '@tanstack/store'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector'\n\nexport * from '@tanstack/store'\n\nexport type NoInfer<T> = [T][T extends any ? 0 : never]\n\nexport function useStore<\n TState,\n TSelected = NoInfer<TState>,\n TUpdater extends AnyUpdater = AnyUpdater,\n>(\n store: Store<TState, TUpdater>,\n selector: (state: NoInfer<TState>) => TSelected = (d) => d as any,\n) {\n const slice = useSyncExternalStoreWithSelector(\n store.subscribe,\n () => store.state,\n () => store.state,\n selector,\n shallow,\n )\n\n return slice\n}\n\nexport function shallow<T>(objA: T, objB: T) {\n if (Object.is(objA, objB)) {\n return true\n }\n\n if (\n typeof objA !== 'object' ||\n objA === null ||\n typeof objB !== 'object' ||\n objB === null\n ) {\n return false\n }\n\n const keysA = Object.keys(objA)\n if (keysA.length !== Object.keys(objB).length) {\n return false\n }\n\n for (let i = 0; i < keysA.length; i++) {\n if (\n !Object.prototype.hasOwnProperty.call(objB, keysA[i] as string) ||\n !Object.is(objA[keysA[i] as keyof T], objB[keysA[i] as keyof T])\n ) {\n return false\n }\n }\n return true\n}\n"],"names":["useStore","store","selector","d","slice","useSyncExternalStoreWithSelector","subscribe","state","shallow","objA","objB","Object","is","keysA","keys","length","i","prototype","hasOwnProperty","call"],"mappings":";;;;;;;;;;;;;AAOO,SAASA,QAAQ,CAKtBC,KAA8B,EAC9BC,QAA+C,GAAIC,CAAC,IAAKA,CAAQ,EACjE;EACA,MAAMC,KAAK,GAAGC,gCAAgC,CAC5CJ,KAAK,CAACK,SAAS,EACf,MAAML,KAAK,CAACM,KAAK,EACjB,MAAMN,KAAK,CAACM,KAAK,EACjBL,QAAQ,EACRM,OAAO,CACR,CAAA;AAED,EAAA,OAAOJ,KAAK,CAAA;AACd,CAAA;AAEO,SAASI,OAAO,CAAIC,IAAO,EAAEC,IAAO,EAAE;EAC3C,IAAIC,MAAM,CAACC,EAAE,CAACH,IAAI,EAAEC,IAAI,CAAC,EAAE;AACzB,IAAA,OAAO,IAAI,CAAA;AACb,GAAA;AAEA,EAAA,IACE,OAAOD,IAAI,KAAK,QAAQ,IACxBA,IAAI,KAAK,IAAI,IACb,OAAOC,IAAI,KAAK,QAAQ,IACxBA,IAAI,KAAK,IAAI,EACb;AACA,IAAA,OAAO,KAAK,CAAA;AACd,GAAA;AAEA,EAAA,MAAMG,KAAK,GAAGF,MAAM,CAACG,IAAI,CAACL,IAAI,CAAC,CAAA;AAC/B,EAAA,IAAII,KAAK,CAACE,MAAM,KAAKJ,MAAM,CAACG,IAAI,CAACJ,IAAI,CAAC,CAACK,MAAM,EAAE;AAC7C,IAAA,OAAO,KAAK,CAAA;AACd,GAAA;AAEA,EAAA,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGH,KAAK,CAACE,MAAM,EAAEC,CAAC,EAAE,EAAE;AACrC,IAAA,IACE,CAACL,MAAM,CAACM,SAAS,CAACC,cAAc,CAACC,IAAI,CAACT,IAAI,EAAEG,KAAK,CAACG,CAAC,CAAC,CAAW,IAC/D,CAACL,MAAM,CAACC,EAAE,CAACH,IAAI,CAACI,KAAK,CAACG,CAAC,CAAC,CAAY,EAAEN,IAAI,CAACG,KAAK,CAACG,CAAC,CAAC,CAAY,CAAC,EAChE;AACA,MAAA,OAAO,KAAK,CAAA;AACd,KAAA;AACF,GAAA;AACA,EAAA,OAAO,IAAI,CAAA;AACb;;;;"}
1
+ {"version":3,"file":"index.js","sources":["../../src/index.tsx"],"sourcesContent":["import * as React from 'react'\nimport { AnyUpdater, Store } from '@tanstack/store'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector'\n\nexport * from '@tanstack/store'\n\nexport type NoInfer<T> = [T][T extends any ? 0 : never]\n\nconst useLayoutEffect =\n typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect\n\nexport function useStore<\n TState,\n TSelected = NoInfer<TState>,\n TUpdater extends AnyUpdater = AnyUpdater,\n>(\n store: Store<TState, TUpdater>,\n selector: (state: NoInfer<TState>) => TSelected = (d) => d as any,\n) {\n // const isMountedRef = React.useRef(false)\n // const [state, setState] = React.useState<{ ref: TSelected }>(() => ({\n // ref: selector(store.state),\n // }))\n\n // if (!shallow(selector(store.state), state.ref)) {\n // setState(() => ({ ref: selector(store.state) }))\n // }\n\n // useLayoutEffect(() => {\n // console.log('effect')\n\n // const cb = () => {\n // const next = selector(store.state)\n // console.log('onsub')\n // if (!shallow(next, state.ref)) {\n // console.log('set')\n // setState(() => ({ ref: selector(store.state) }))\n // }\n // }\n\n // return store.subscribe(cb)\n // }, [])\n\n const slice = useSyncExternalStoreWithSelector(\n store.subscribe,\n () => store.state,\n () => store.state,\n selector,\n shallow,\n )\n\n // if (!isMountedRef.current) {\n // state.ref = slice\n // }\n\n // if (!shallow(slice, state.ref)) {\n // setState({ ref: slice })\n // }\n\n // React.useEffect(() => {\n // isMountedRef.current = true\n // return () => {\n // isMountedRef.current = false\n // }\n // }, [])\n\n // return state.ref\n\n return slice\n}\n\nexport function shallow<T>(objA: T, objB: T) {\n if (Object.is(objA, objB)) {\n return true\n }\n\n if (\n typeof objA !== 'object' ||\n objA === null ||\n typeof objB !== 'object' ||\n objB === null\n ) {\n return false\n }\n\n const keysA = Object.keys(objA)\n if (keysA.length !== Object.keys(objB).length) {\n return false\n }\n\n for (let i = 0; i < keysA.length; i++) {\n if (\n !Object.prototype.hasOwnProperty.call(objB, keysA[i] as string) ||\n !Object.is(objA[keysA[i] as keyof T], objB[keysA[i] as keyof T])\n ) {\n return false\n }\n }\n return true\n}\n"],"names":["useStore","store","selector","d","slice","useSyncExternalStoreWithSelector","subscribe","state","shallow","objA","objB","Object","is","keysA","keys","length","i","prototype","hasOwnProperty","call"],"mappings":";;;;;;;;;;;;;;AAWO,SAASA,QAAQ,CAKtBC,KAA8B,EAC9BC,QAA+C,GAAIC,CAAC,IAAKA,CAAQ,EACjE;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;EAEA,MAAMC,KAAK,GAAGC,gCAAgC,CAC5CJ,KAAK,CAACK,SAAS,EACf,MAAML,KAAK,CAACM,KAAK,EACjB,MAAMN,KAAK,CAACM,KAAK,EACjBL,QAAQ,EACRM,OAAO,CACR,CAAA;;AAED;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA,EAAA,OAAOJ,KAAK,CAAA;AACd,CAAA;AAEO,SAASI,OAAO,CAAIC,IAAO,EAAEC,IAAO,EAAE;EAC3C,IAAIC,MAAM,CAACC,EAAE,CAACH,IAAI,EAAEC,IAAI,CAAC,EAAE;AACzB,IAAA,OAAO,IAAI,CAAA;AACb,GAAA;AAEA,EAAA,IACE,OAAOD,IAAI,KAAK,QAAQ,IACxBA,IAAI,KAAK,IAAI,IACb,OAAOC,IAAI,KAAK,QAAQ,IACxBA,IAAI,KAAK,IAAI,EACb;AACA,IAAA,OAAO,KAAK,CAAA;AACd,GAAA;AAEA,EAAA,MAAMG,KAAK,GAAGF,MAAM,CAACG,IAAI,CAACL,IAAI,CAAC,CAAA;AAC/B,EAAA,IAAII,KAAK,CAACE,MAAM,KAAKJ,MAAM,CAACG,IAAI,CAACJ,IAAI,CAAC,CAACK,MAAM,EAAE;AAC7C,IAAA,OAAO,KAAK,CAAA;AACd,GAAA;AAEA,EAAA,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGH,KAAK,CAACE,MAAM,EAAEC,CAAC,EAAE,EAAE;AACrC,IAAA,IACE,CAACL,MAAM,CAACM,SAAS,CAACC,cAAc,CAACC,IAAI,CAACT,IAAI,EAAEG,KAAK,CAACG,CAAC,CAAC,CAAW,IAC/D,CAACL,MAAM,CAACC,EAAE,CAACH,IAAI,CAACI,KAAK,CAACG,CAAC,CAAC,CAAY,EAAEN,IAAI,CAACG,KAAK,CAACG,CAAC,CAAC,CAAY,CAAC,EAChE;AACA,MAAA,OAAO,KAAK,CAAA;AACd,KAAA;AACF,GAAA;AACA,EAAA,OAAO,IAAI,CAAA;AACb;;;;"}
package/build/stats-html.html CHANGED
@@ -4024,7 +4024,7 @@ var drawChart = (function (exports) {
4024
4024
  </script>
4025
4025
  <script>
4026
4026
  /*<!--*/
4027
- const data = {"version":2,"tree":{"name":"root","children":[{"name":"index.production.js","children":[{"name":"packages","children":[{"name":"store/build/esm/index.js","uid":"5eea-5"},{"name":"react-store/src/index.tsx","uid":"5eea-7"}]}]}],"isRoot":true},"nodeParts":{"5eea-5":{"renderedLength":1359,"gzipLength":537,"brotliLength":0,"mainUid":"5eea-4"},"5eea-7":{"renderedLength":754,"gzipLength":343,"brotliLength":0,"mainUid":"5eea-6"}},"nodeMetas":{"5eea-4":{"id":"/packages/store/build/esm/index.js","moduleParts":{"index.production.js":"5eea-5"},"imported":[],"importedBy":[{"uid":"5eea-6"}]},"5eea-6":{"id":"/packages/react-store/src/index.tsx","moduleParts":{"index.production.js":"5eea-7"},"imported":[{"uid":"5eea-8"},{"uid":"5eea-4"}],"importedBy":[],"isEntry":true},"5eea-8":{"id":"use-sync-external-store/shim/with-selector","moduleParts":{},"imported":[],"importedBy":[{"uid":"5eea-6"}],"isExternal":true}},"env":{"rollup":"2.79.1"},"options":{"gzip":true,"brotli":false,"sourcemap":false}};
4027
+ const data = {"version":2,"tree":{"name":"root","children":[{"name":"index.production.js","children":[{"name":"packages","children":[{"name":"store/build/esm/index.js","uid":"a144-5"},{"name":"react-store/src/index.tsx","uid":"a144-7"}]}]}],"isRoot":true},"nodeParts":{"a144-5":{"renderedLength":1359,"gzipLength":537,"brotliLength":0,"mainUid":"a144-4"},"a144-7":{"renderedLength":1778,"gzipLength":607,"brotliLength":0,"mainUid":"a144-6"}},"nodeMetas":{"a144-4":{"id":"/packages/store/build/esm/index.js","moduleParts":{"index.production.js":"a144-5"},"imported":[],"importedBy":[{"uid":"a144-6"}]},"a144-6":{"id":"/packages/react-store/src/index.tsx","moduleParts":{"index.production.js":"a144-7"},"imported":[{"uid":"a144-8"},{"uid":"a144-9"},{"uid":"a144-4"}],"importedBy":[],"isEntry":true},"a144-8":{"id":"react","moduleParts":{},"imported":[],"importedBy":[{"uid":"a144-6"}],"isExternal":true},"a144-9":{"id":"use-sync-external-store/shim/with-selector","moduleParts":{},"imported":[],"importedBy":[{"uid":"a144-6"}],"isExternal":true}},"env":{"rollup":"2.79.1"},"options":{"gzip":true,"brotli":false,"sourcemap":false}};
4028
4028
 
4029
4029
  const run = () => {
4030
4030
  const width = window.innerWidth;
package/build/stats-react.json CHANGED
@@ -11,11 +11,11 @@
11
11
  "children": [
12
12
  {
13
13
  "name": "store/build/esm/index.js",
14
- "uid": "5eea-10"
14
+ "uid": "a144-11"
15
15
  },
16
16
  {
17
17
  "name": "react-store/src/index.tsx",
18
- "uid": "5eea-12"
18
+ "uid": "a144-13"
19
19
  }
20
20
  ]
21
21
  }
@@ -25,55 +25,69 @@
25
25
  "isRoot": true
26
26
  },
27
27
  "nodeParts": {
28
- "5eea-10": {
28
+ "a144-11": {
29
29
  "renderedLength": 1359,
30
30
  "gzipLength": 537,
31
31
  "brotliLength": 0,
32
- "mainUid": "5eea-9"
32
+ "mainUid": "a144-10"
33
33
  },
34
- "5eea-12": {
35
- "renderedLength": 754,
36
- "gzipLength": 343,
34
+ "a144-13": {
35
+ "renderedLength": 1778,
36
+ "gzipLength": 607,
37
37
  "brotliLength": 0,
38
- "mainUid": "5eea-11"
38
+ "mainUid": "a144-12"
39
39
  }
40
40
  },
41
41
  "nodeMetas": {
42
- "5eea-9": {
42
+ "a144-10": {
43
43
  "id": "/packages/store/build/esm/index.js",
44
44
  "moduleParts": {
45
- "index.production.js": "5eea-10"
45
+ "index.production.js": "a144-11"
46
46
  },
47
47
  "imported": [],
48
48
  "importedBy": [
49
49
  {
50
- "uid": "5eea-11"
50
+ "uid": "a144-12"
51
51
  }
52
52
  ]
53
53
  },
54
- "5eea-11": {
54
+ "a144-12": {
55
55
  "id": "/packages/react-store/src/index.tsx",
56
56
  "moduleParts": {
57
- "index.production.js": "5eea-12"
57
+ "index.production.js": "a144-13"
58
58
  },
59
59
  "imported": [
60
60
  {
61
- "uid": "5eea-13"
61
+ "uid": "a144-14"
62
62
  },
63
63
  {
64
- "uid": "5eea-9"
64
+ "uid": "a144-15"
65
+ },
66
+ {
67
+ "uid": "a144-10"
65
68
  }
66
69
  ],
67
70
  "importedBy": [],
68
71
  "isEntry": true
69
72
  },
70
- "5eea-13": {
73
+ "a144-14": {
74
+ "id": "react",
75
+ "moduleParts": {},
76
+ "imported": [],
77
+ "importedBy": [
78
+ {
79
+ "uid": "a144-12"
80
+ }
81
+ ],
82
+ "isExternal": true
83
+ },
84
+ "a144-15": {
71
85
  "id": "use-sync-external-store/shim/with-selector",
72
86
  "moduleParts": {},
73
87
  "imported": [],
74
88
  "importedBy": [
75
89
  {
76
- "uid": "5eea-11"
90
+ "uid": "a144-12"
77
91
  }
78
92
  ],
79
93
  "isExternal": true
package/build/umd/index.development.js CHANGED
@@ -9,10 +9,10 @@
9
9
  * @license MIT
10
10
  */
11
11
  (function (global, factory) {
12
- typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('use-sync-external-store/shim/with-selector')) :
13
- typeof define === 'function' && define.amd ? define(['exports', 'use-sync-external-store/shim/with-selector'], factory) :
14
- (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.ReactLoaders = {}, global.withSelector));
15
- })(this, (function (exports, withSelector) { 'use strict';
12
+ typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('use-sync-external-store/shim/with-selector')) :
13
+ typeof define === 'function' && define.amd ? define(['exports', 'react', 'use-sync-external-store/shim/with-selector'], factory) :
14
+ (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.ReactLoaders = {}, global.React, global.withSelector));
15
+ })(this, (function (exports, React, withSelector) { 'use strict';
16
16
 
17
17
  /**
18
18
  * @tanstack/store/src/index.ts
@@ -68,7 +68,49 @@
68
68
  }
69
69
 
70
70
  function useStore(store, selector = d => d) {
71
+ // const isMountedRef = React.useRef(false)
72
+ // const [state, setState] = React.useState<{ ref: TSelected }>(() => ({
73
+ // ref: selector(store.state),
74
+ // }))
75
+
76
+ // if (!shallow(selector(store.state), state.ref)) {
77
+ // setState(() => ({ ref: selector(store.state) }))
78
+ // }
79
+
80
+ // useLayoutEffect(() => {
81
+ // console.log('effect')
82
+
83
+ // const cb = () => {
84
+ // const next = selector(store.state)
85
+ // console.log('onsub')
86
+ // if (!shallow(next, state.ref)) {
87
+ // console.log('set')
88
+ // setState(() => ({ ref: selector(store.state) }))
89
+ // }
90
+ // }
91
+
92
+ // return store.subscribe(cb)
93
+ // }, [])
94
+
71
95
  const slice = withSelector.useSyncExternalStoreWithSelector(store.subscribe, () => store.state, () => store.state, selector, shallow);
96
+
97
+ // if (!isMountedRef.current) {
98
+ // state.ref = slice
99
+ // }
100
+
101
+ // if (!shallow(slice, state.ref)) {
102
+ // setState({ ref: slice })
103
+ // }
104
+
105
+ // React.useEffect(() => {
106
+ // isMountedRef.current = true
107
+ // return () => {
108
+ // isMountedRef.current = false
109
+ // }
110
+ // }, [])
111
+
112
+ // return state.ref
113
+
72
114
  return slice;
73
115
  }
74
116
  function shallow(objA, objB) {
package/build/umd/index.development.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.development.js","sources":["../../../store/build/esm/index.js","../../src/index.tsx"],"sourcesContent":["/**\n * @tanstack/store/src/index.ts\n *\n * Copyright (c) TanStack\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE.md file in the root directory of this source tree.\n *\n * @license MIT\n */\nclass Store {\n listeners = new Set();\n _batching = false;\n _flushing = 0;\n constructor(initialState, options) {\n this.state = initialState;\n this.options = options;\n }\n subscribe = listener => {\n this.listeners.add(listener);\n const unsub = this.options?.onSubscribe?.(listener, this);\n return () => {\n this.listeners.delete(listener);\n unsub?.();\n };\n };\n setState = updater => {\n const previous = this.state;\n this.state = this.options?.updateFn ? this.options.updateFn(previous)(updater) : updater(previous);\n\n // Always run onUpdate, regardless of batching\n this.options?.onUpdate?.();\n\n // Attempt to flush\n this._flush();\n };\n _flush = () => {\n if (this._batching) return;\n const flushId = ++this._flushing;\n this.listeners.forEach(listener => {\n if (this._flushing !== flushId) return;\n listener();\n });\n };\n batch = cb => {\n if (this._batching) return cb();\n this._batching = true;\n cb();\n this._batching = false;\n this._flush();\n };\n}\n\nexport { Store };\n//# sourceMappingURL=index.js.map\n","import { AnyUpdater, Store } from '@tanstack/store'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector'\n\nexport * from '@tanstack/store'\n\nexport type NoInfer<T> = [T][T extends any ? 0 : never]\n\nexport function useStore<\n TState,\n TSelected = NoInfer<TState>,\n TUpdater extends AnyUpdater = AnyUpdater,\n>(\n store: Store<TState, TUpdater>,\n selector: (state: NoInfer<TState>) => TSelected = (d) => d as any,\n) {\n const slice = useSyncExternalStoreWithSelector(\n store.subscribe,\n () => store.state,\n () => store.state,\n selector,\n shallow,\n )\n\n return slice\n}\n\nexport function shallow<T>(objA: T, objB: T) {\n if (Object.is(objA, objB)) {\n return true\n }\n\n if (\n typeof objA !== 'object' ||\n objA === null ||\n typeof objB !== 'object' ||\n objB === null\n ) {\n return false\n }\n\n const keysA = Object.keys(objA)\n if (keysA.length !== Object.keys(objB).length) {\n return false\n }\n\n for (let i = 0; i < keysA.length; i++) {\n if (\n !Object.prototype.hasOwnProperty.call(objB, keysA[i] as string) ||\n !Object.is(objA[keysA[i] as keyof T], objB[keysA[i] as keyof T])\n ) {\n return false\n }\n }\n return true\n}\n"],"names":["useStore","store","selector","d","slice","useSyncExternalStoreWithSelector","subscribe","state","shallow","objA","objB","Object","is","keysA","keys","length","i","prototype","hasOwnProperty","call"],"mappings":"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"}
1
+ {"version":3,"file":"index.development.js","sources":["../../../store/build/esm/index.js","../../src/index.tsx"],"sourcesContent":["/**\n * @tanstack/store/src/index.ts\n *\n * Copyright (c) TanStack\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE.md file in the root directory of this source tree.\n *\n * @license MIT\n */\nclass Store {\n listeners = new Set();\n _batching = false;\n _flushing = 0;\n constructor(initialState, options) {\n this.state = initialState;\n this.options = options;\n }\n subscribe = listener => {\n this.listeners.add(listener);\n const unsub = this.options?.onSubscribe?.(listener, this);\n return () => {\n this.listeners.delete(listener);\n unsub?.();\n };\n };\n setState = updater => {\n const previous = this.state;\n this.state = this.options?.updateFn ? this.options.updateFn(previous)(updater) : updater(previous);\n\n // Always run onUpdate, regardless of batching\n this.options?.onUpdate?.();\n\n // Attempt to flush\n this._flush();\n };\n _flush = () => {\n if (this._batching) return;\n const flushId = ++this._flushing;\n this.listeners.forEach(listener => {\n if (this._flushing !== flushId) return;\n listener();\n });\n };\n batch = cb => {\n if (this._batching) return cb();\n this._batching = true;\n cb();\n this._batching = false;\n this._flush();\n };\n}\n\nexport { Store };\n//# sourceMappingURL=index.js.map\n","import * as React from 'react'\nimport { AnyUpdater, Store } from '@tanstack/store'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector'\n\nexport * from '@tanstack/store'\n\nexport type NoInfer<T> = [T][T extends any ? 0 : never]\n\nconst useLayoutEffect =\n typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect\n\nexport function useStore<\n TState,\n TSelected = NoInfer<TState>,\n TUpdater extends AnyUpdater = AnyUpdater,\n>(\n store: Store<TState, TUpdater>,\n selector: (state: NoInfer<TState>) => TSelected = (d) => d as any,\n) {\n // const isMountedRef = React.useRef(false)\n // const [state, setState] = React.useState<{ ref: TSelected }>(() => ({\n // ref: selector(store.state),\n // }))\n\n // if (!shallow(selector(store.state), state.ref)) {\n // setState(() => ({ ref: selector(store.state) }))\n // }\n\n // useLayoutEffect(() => {\n // console.log('effect')\n\n // const cb = () => {\n // const next = selector(store.state)\n // console.log('onsub')\n // if (!shallow(next, state.ref)) {\n // console.log('set')\n // setState(() => ({ ref: selector(store.state) }))\n // }\n // }\n\n // return store.subscribe(cb)\n // }, [])\n\n const slice = useSyncExternalStoreWithSelector(\n store.subscribe,\n () => store.state,\n () => store.state,\n selector,\n shallow,\n )\n\n // if (!isMountedRef.current) {\n // state.ref = slice\n // }\n\n // if (!shallow(slice, state.ref)) {\n // setState({ ref: slice })\n // }\n\n // React.useEffect(() => {\n // isMountedRef.current = true\n // return () => {\n // isMountedRef.current = false\n // }\n // }, [])\n\n // return state.ref\n\n return slice\n}\n\nexport function shallow<T>(objA: T, objB: T) {\n if (Object.is(objA, objB)) {\n return true\n }\n\n if (\n typeof objA !== 'object' ||\n objA === null ||\n typeof objB !== 'object' ||\n objB === null\n ) {\n return false\n }\n\n const keysA = Object.keys(objA)\n if (keysA.length !== Object.keys(objB).length) {\n return false\n }\n\n for (let i = 0; i < keysA.length; i++) {\n if (\n !Object.prototype.hasOwnProperty.call(objB, keysA[i] as string) ||\n !Object.is(objA[keysA[i] as keyof T], objB[keysA[i] as keyof T])\n ) {\n return false\n }\n }\n return true\n}\n"],"names":["useStore","store","selector","d","slice","useSyncExternalStoreWithSelector","subscribe","state","shallow","objA","objB","Object","is","keysA","keys","length","i","prototype","hasOwnProperty","call"],"mappings":"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"}
package/build/umd/index.production.js CHANGED
@@ -8,7 +8,7 @@
8
8
  *
9
9
  * @license MIT
10
10
  */
11
- !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("use-sync-external-store/shim/with-selector")):"function"==typeof define&&define.amd?define(["exports","use-sync-external-store/shim/with-selector"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).ReactLoaders={},t.withSelector)}(this,(function(t,e){"use strict";
11
+ !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("use-sync-external-store/shim/with-selector")):"function"==typeof define&&define.amd?define(["exports","react","use-sync-external-store/shim/with-selector"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).ReactLoaders={},t.React,t.withSelector)}(this,(function(t,e,s){"use strict";
12
12
  /**
13
13
  * @tanstack/store/src/index.ts
14
14
  *
@@ -18,5 +18,5 @@
18
18
  * LICENSE.md file in the root directory of this source tree.
19
19
  *
20
20
  * @license MIT
21
- */function s(t,e){if(Object.is(t,e))return!0;if("object"!=typeof t||null===t||"object"!=typeof e||null===e)return!1;const s=Object.keys(t);if(s.length!==Object.keys(e).length)return!1;for(let i=0;i<s.length;i++)if(!Object.prototype.hasOwnProperty.call(e,s[i])||!Object.is(t[s[i]],e[s[i]]))return!1;return!0}t.Store=class{listeners=new Set;_batching=!1;_flushing=0;constructor(t,e){this.state=t,this.options=e}subscribe=t=>{this.listeners.add(t);const e=this.options?.onSubscribe?.(t,this);return()=>{this.listeners.delete(t),e?.()}};setState=t=>{const e=this.state;this.state=this.options?.updateFn?this.options.updateFn(e)(t):t(e),this.options?.onUpdate?.(),this._flush()};_flush=()=>{if(this._batching)return;const t=++this._flushing;this.listeners.forEach((e=>{this._flushing===t&&e()}))};batch=t=>{if(this._batching)return t();this._batching=!0,t(),this._batching=!1,this._flush()}},t.shallow=s,t.useStore=function(t,i=(t=>t)){return e.useSyncExternalStoreWithSelector(t.subscribe,(()=>t.state),(()=>t.state),i,s)},Object.defineProperty(t,"__esModule",{value:!0})}));
21
+ */function i(t,e){if(Object.is(t,e))return!0;if("object"!=typeof t||null===t||"object"!=typeof e||null===e)return!1;const s=Object.keys(t);if(s.length!==Object.keys(e).length)return!1;for(let i=0;i<s.length;i++)if(!Object.prototype.hasOwnProperty.call(e,s[i])||!Object.is(t[s[i]],e[s[i]]))return!1;return!0}t.Store=class{listeners=new Set;_batching=!1;_flushing=0;constructor(t,e){this.state=t,this.options=e}subscribe=t=>{this.listeners.add(t);const e=this.options?.onSubscribe?.(t,this);return()=>{this.listeners.delete(t),e?.()}};setState=t=>{const e=this.state;this.state=this.options?.updateFn?this.options.updateFn(e)(t):t(e),this.options?.onUpdate?.(),this._flush()};_flush=()=>{if(this._batching)return;const t=++this._flushing;this.listeners.forEach((e=>{this._flushing===t&&e()}))};batch=t=>{if(this._batching)return t();this._batching=!0,t(),this._batching=!1,this._flush()}},t.shallow=i,t.useStore=function(t,e=(t=>t)){return s.useSyncExternalStoreWithSelector(t.subscribe,(()=>t.state),(()=>t.state),e,i)},Object.defineProperty(t,"__esModule",{value:!0})}));
22
22
  //# sourceMappingURL=index.production.js.map
package/build/umd/index.production.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.production.js","sources":["../../src/index.tsx","../../../store/build/esm/index.js"],"sourcesContent":["import { AnyUpdater, Store } from '@tanstack/store'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector'\n\nexport * from '@tanstack/store'\n\nexport type NoInfer<T> = [T][T extends any ? 0 : never]\n\nexport function useStore<\n TState,\n TSelected = NoInfer<TState>,\n TUpdater extends AnyUpdater = AnyUpdater,\n>(\n store: Store<TState, TUpdater>,\n selector: (state: NoInfer<TState>) => TSelected = (d) => d as any,\n) {\n const slice = useSyncExternalStoreWithSelector(\n store.subscribe,\n () => store.state,\n () => store.state,\n selector,\n shallow,\n )\n\n return slice\n}\n\nexport function shallow<T>(objA: T, objB: T) {\n if (Object.is(objA, objB)) {\n return true\n }\n\n if (\n typeof objA !== 'object' ||\n objA === null ||\n typeof objB !== 'object' ||\n objB === null\n ) {\n return false\n }\n\n const keysA = Object.keys(objA)\n if (keysA.length !== Object.keys(objB).length) {\n return false\n }\n\n for (let i = 0; i < keysA.length; i++) {\n if (\n !Object.prototype.hasOwnProperty.call(objB, keysA[i] as string) ||\n !Object.is(objA[keysA[i] as keyof T], objB[keysA[i] as keyof T])\n ) {\n return false\n }\n }\n return true\n}\n","/**\n * @tanstack/store/src/index.ts\n *\n * Copyright (c) TanStack\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE.md file in the root directory of this source tree.\n *\n * @license MIT\n */\nclass Store {\n listeners = new Set();\n _batching = false;\n _flushing = 0;\n constructor(initialState, options) {\n this.state = initialState;\n this.options = options;\n }\n subscribe = listener => {\n this.listeners.add(listener);\n const unsub = this.options?.onSubscribe?.(listener, this);\n return () => {\n this.listeners.delete(listener);\n unsub?.();\n };\n };\n setState = updater => {\n const previous = this.state;\n this.state = this.options?.updateFn ? this.options.updateFn(previous)(updater) : updater(previous);\n\n // Always run onUpdate, regardless of batching\n this.options?.onUpdate?.();\n\n // Attempt to flush\n this._flush();\n };\n _flush = () => {\n if (this._batching) return;\n const flushId = ++this._flushing;\n this.listeners.forEach(listener => {\n if (this._flushing !== flushId) return;\n listener();\n });\n };\n batch = cb => {\n if (this._batching) return cb();\n this._batching = true;\n cb();\n this._batching = false;\n this._flush();\n };\n}\n\nexport { Store };\n//# sourceMappingURL=index.js.map\n"],"names":["shallow","objA","objB","Object","is","keysA","keys","length","i","prototype","hasOwnProperty","call","listeners","Set","_batching","_flushing","constructor","initialState","options","this","state","subscribe","listener","add","unsub","onSubscribe","delete","setState","updater","previous","updateFn","onUpdate","_flush","flushId","forEach","batch","cb","store","selector","d","useSyncExternalStoreWithSelector"],"mappings":";;;;;;;;;;;;;;;;;;;;KA0BO,SAASA,EAAWC,EAASC,GAClC,GAAIC,OAAOC,GAAGH,EAAMC,GAClB,OAAO,EAGT,GACkB,iBAATD,GACE,OAATA,GACgB,iBAATC,GACE,OAATA,EAEA,OAAO,EAGT,MAAMG,EAAQF,OAAOG,KAAKL,GAC1B,GAAII,EAAME,SAAWJ,OAAOG,KAAKJ,GAAMK,OACrC,OAAO,EAGT,IAAK,IAAIC,EAAI,EAAGA,EAAIH,EAAME,OAAQC,IAChC,IACGL,OAAOM,UAAUC,eAAeC,KAAKT,EAAMG,EAAMG,MACjDL,OAAOC,GAAGH,EAAKI,EAAMG,IAAgBN,EAAKG,EAAMG,KAEjD,OAAO,EAGX,OAAO,CACT,SC5CA,MACEI,UAAY,IAAIC,IAChBC,WAAY,EACZC,UAAY,EACZC,YAAYC,EAAcC,GACxBC,KAAKC,MAAQH,EACbE,KAAKD,QAAUA,CAChB,CACDG,UAAYC,IACVH,KAAKP,UAAUW,IAAID,GACnB,MAAME,EAAQL,KAAKD,SAASO,cAAcH,EAAUH,MACpD,MAAO,KACLA,KAAKP,UAAUc,OAAOJ,GACtBE,KAAS,CACV,EAEHG,SAAWC,IACT,MAAMC,EAAWV,KAAKC,MACtBD,KAAKC,MAAQD,KAAKD,SAASY,SAAWX,KAAKD,QAAQY,SAASD,EAAtBV,CAAgCS,GAAWA,EAAQC,GAGzFV,KAAKD,SAASa,aAGdZ,KAAKa,QAAQ,EAEfA,OAAS,KACP,GAAIb,KAAKL,UAAW,OACpB,MAAMmB,IAAYd,KAAKJ,UACvBI,KAAKP,UAAUsB,SAAQZ,IACjBH,KAAKJ,YAAckB,GACvBX,GAAU,GACV,EAEJa,MAAQC,IACN,GAAIjB,KAAKL,UAAW,OAAOsB,IAC3BjB,KAAKL,WAAY,EACjBsB,IACAjB,KAAKL,WAAY,EACjBK,KAAKa,QAAQ,0BD1CV,SAKLK,EACAC,EAAmDC,IAAMA,IAUzD,OARcC,EAAAA,iCACZH,EAAMhB,WACN,IAAMgB,EAAMjB,QACZ,IAAMiB,EAAMjB,OACZkB,EACAtC,EAIJ"}
1
+ {"version":3,"file":"index.production.js","sources":["../../src/index.tsx","../../../store/build/esm/index.js"],"sourcesContent":["import * as React from 'react'\nimport { AnyUpdater, Store } from '@tanstack/store'\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector'\n\nexport * from '@tanstack/store'\n\nexport type NoInfer<T> = [T][T extends any ? 0 : never]\n\nconst useLayoutEffect =\n typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect\n\nexport function useStore<\n TState,\n TSelected = NoInfer<TState>,\n TUpdater extends AnyUpdater = AnyUpdater,\n>(\n store: Store<TState, TUpdater>,\n selector: (state: NoInfer<TState>) => TSelected = (d) => d as any,\n) {\n // const isMountedRef = React.useRef(false)\n // const [state, setState] = React.useState<{ ref: TSelected }>(() => ({\n // ref: selector(store.state),\n // }))\n\n // if (!shallow(selector(store.state), state.ref)) {\n // setState(() => ({ ref: selector(store.state) }))\n // }\n\n // useLayoutEffect(() => {\n // console.log('effect')\n\n // const cb = () => {\n // const next = selector(store.state)\n // console.log('onsub')\n // if (!shallow(next, state.ref)) {\n // console.log('set')\n // setState(() => ({ ref: selector(store.state) }))\n // }\n // }\n\n // return store.subscribe(cb)\n // }, [])\n\n const slice = useSyncExternalStoreWithSelector(\n store.subscribe,\n () => store.state,\n () => store.state,\n selector,\n shallow,\n )\n\n // if (!isMountedRef.current) {\n // state.ref = slice\n // }\n\n // if (!shallow(slice, state.ref)) {\n // setState({ ref: slice })\n // }\n\n // React.useEffect(() => {\n // isMountedRef.current = true\n // return () => {\n // isMountedRef.current = false\n // }\n // }, [])\n\n // return state.ref\n\n return slice\n}\n\nexport function shallow<T>(objA: T, objB: T) {\n if (Object.is(objA, objB)) {\n return true\n }\n\n if (\n typeof objA !== 'object' ||\n objA === null ||\n typeof objB !== 'object' ||\n objB === null\n ) {\n return false\n }\n\n const keysA = Object.keys(objA)\n if (keysA.length !== Object.keys(objB).length) {\n return false\n }\n\n for (let i = 0; i < keysA.length; i++) {\n if (\n !Object.prototype.hasOwnProperty.call(objB, keysA[i] as string) ||\n !Object.is(objA[keysA[i] as keyof T], objB[keysA[i] as keyof T])\n ) {\n return false\n }\n }\n return true\n}\n","/**\n * @tanstack/store/src/index.ts\n *\n * Copyright (c) TanStack\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE.md file in the root directory of this source tree.\n *\n * @license MIT\n */\nclass Store {\n listeners = new Set();\n _batching = false;\n _flushing = 0;\n constructor(initialState, options) {\n this.state = initialState;\n this.options = options;\n }\n subscribe = listener => {\n this.listeners.add(listener);\n const unsub = this.options?.onSubscribe?.(listener, this);\n return () => {\n this.listeners.delete(listener);\n unsub?.();\n };\n };\n setState = updater => {\n const previous = this.state;\n this.state = this.options?.updateFn ? this.options.updateFn(previous)(updater) : updater(previous);\n\n // Always run onUpdate, regardless of batching\n this.options?.onUpdate?.();\n\n // Attempt to flush\n this._flush();\n };\n _flush = () => {\n if (this._batching) return;\n const flushId = ++this._flushing;\n this.listeners.forEach(listener => {\n if (this._flushing !== flushId) return;\n listener();\n });\n };\n batch = cb => {\n if (this._batching) return cb();\n this._batching = true;\n cb();\n this._batching = false;\n this._flush();\n };\n}\n\nexport { Store };\n//# sourceMappingURL=index.js.map\n"],"names":["shallow","objA","objB","Object","is","keysA","keys","length","i","prototype","hasOwnProperty","call","listeners","Set","_batching","_flushing","constructor","initialState","options","this","state","subscribe","listener","add","unsub","onSubscribe","delete","setState","updater","previous","updateFn","onUpdate","_flush","flushId","forEach","batch","cb","store","selector","d","useSyncExternalStoreWithSelector"],"mappings":";;;;;;;;;;;;;;;;;;;;KAuEO,SAASA,EAAWC,EAASC,GAClC,GAAIC,OAAOC,GAAGH,EAAMC,GAClB,OAAO,EAGT,GACkB,iBAATD,GACE,OAATA,GACgB,iBAATC,GACE,OAATA,EAEA,OAAO,EAGT,MAAMG,EAAQF,OAAOG,KAAKL,GAC1B,GAAII,EAAME,SAAWJ,OAAOG,KAAKJ,GAAMK,OACrC,OAAO,EAGT,IAAK,IAAIC,EAAI,EAAGA,EAAIH,EAAME,OAAQC,IAChC,IACGL,OAAOM,UAAUC,eAAeC,KAAKT,EAAMG,EAAMG,MACjDL,OAAOC,GAAGH,EAAKI,EAAMG,IAAgBN,EAAKG,EAAMG,KAEjD,OAAO,EAGX,OAAO,CACT,SCzFA,MACEI,UAAY,IAAIC,IAChBC,WAAY,EACZC,UAAY,EACZC,YAAYC,EAAcC,GACxBC,KAAKC,MAAQH,EACbE,KAAKD,QAAUA,CAChB,CACDG,UAAYC,IACVH,KAAKP,UAAUW,IAAID,GACnB,MAAME,EAAQL,KAAKD,SAASO,cAAcH,EAAUH,MACpD,MAAO,KACLA,KAAKP,UAAUc,OAAOJ,GACtBE,KAAS,CACV,EAEHG,SAAWC,IACT,MAAMC,EAAWV,KAAKC,MACtBD,KAAKC,MAAQD,KAAKD,SAASY,SAAWX,KAAKD,QAAQY,SAASD,EAAtBV,CAAgCS,GAAWA,EAAQC,GAGzFV,KAAKD,SAASa,aAGdZ,KAAKa,QAAQ,EAEfA,OAAS,KACP,GAAIb,KAAKL,UAAW,OACpB,MAAMmB,IAAYd,KAAKJ,UACvBI,KAAKP,UAAUsB,SAAQZ,IACjBH,KAAKJ,YAAckB,GACvBX,GAAU,GACV,EAEJa,MAAQC,IACN,GAAIjB,KAAKL,UAAW,OAAOsB,IAC3BjB,KAAKL,WAAY,EACjBsB,IACAjB,KAAKL,WAAY,EACjBK,KAAKa,QAAQ,0BDtCV,SAKLK,EACAC,EAAmDC,IAAMA,IAmDzD,OAzBcC,EAAAA,iCACZH,EAAMhB,WACN,IAAMgB,EAAMjB,QACZ,IAAMiB,EAAMjB,OACZkB,EACAtC,EAqBJ"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@tanstack/react-store",
3
3
  "author": "Tanner Linsley",
4
- "version": "0.0.1-beta.113",
4
+ "version": "0.0.1-beta.120",
5
5
  "license": "MIT",
6
6
  "repository": "tanstack/react-store",
7
7
  "homepage": "https://tanstack.com/",
package/src/index.tsx CHANGED
@@ -1,3 +1,4 @@
1
+ import * as React from 'react'
1
2
  import { AnyUpdater, Store } from '@tanstack/store'
2
3
  import { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector'
3
4
 
@@ -5,6 +6,9 @@ export * from '@tanstack/store'
5
6
 
6
7
  export type NoInfer<T> = [T][T extends any ? 0 : never]
7
8
 
9
+ const useLayoutEffect =
10
+ typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect
11
+
8
12
  export function useStore<
9
13
  TState,
10
14
  TSelected = NoInfer<TState>,
@@ -13,6 +17,30 @@ export function useStore<
13
17
  store: Store<TState, TUpdater>,
14
18
  selector: (state: NoInfer<TState>) => TSelected = (d) => d as any,
15
19
  ) {
20
+ // const isMountedRef = React.useRef(false)
21
+ // const [state, setState] = React.useState<{ ref: TSelected }>(() => ({
22
+ // ref: selector(store.state),
23
+ // }))
24
+
25
+ // if (!shallow(selector(store.state), state.ref)) {
26
+ // setState(() => ({ ref: selector(store.state) }))
27
+ // }
28
+
29
+ // useLayoutEffect(() => {
30
+ // console.log('effect')
31
+
32
+ // const cb = () => {
33
+ // const next = selector(store.state)
34
+ // console.log('onsub')
35
+ // if (!shallow(next, state.ref)) {
36
+ // console.log('set')
37
+ // setState(() => ({ ref: selector(store.state) }))
38
+ // }
39
+ // }
40
+
41
+ // return store.subscribe(cb)
42
+ // }, [])
43
+
16
44
  const slice = useSyncExternalStoreWithSelector(
17
45
  store.subscribe,
18
46
  () => store.state,
@@ -21,6 +49,23 @@ export function useStore<
21
49
  shallow,
22
50
  )
23
51
 
52
+ // if (!isMountedRef.current) {
53
+ // state.ref = slice
54
+ // }
55
+
56
+ // if (!shallow(slice, state.ref)) {
57
+ // setState({ ref: slice })
58
+ // }
59
+
60
+ // React.useEffect(() => {
61
+ // isMountedRef.current = true
62
+ // return () => {
63
+ // isMountedRef.current = false
64
+ // }
65
+ // }, [])
66
+
67
+ // return state.ref
68
+
24
69
  return slice
25
70
  }
26
71