@tanstack/solid-pacer 0.20.0 → 0.21.0

package/src/async-rate-limiter/createAsyncRateLimiter.ts

@@ -1,6 +1,6 @@
 import { AsyncRateLimiter } from '@tanstack/pacer/async-rate-limiter'
 import { createEffect, onCleanup } from 'solid-js'
-import { useStore } from '@tanstack/solid-store'
+import { shallow, useSelector } from '@tanstack/solid-store'
 import { useDefaultPacerOptions } from '../provider/PacerProvider'
 import type { Store } from '@tanstack/solid-store'
 import type { Accessor, JSX } from 'solid-js'
@@ -50,8 +50,8 @@ export interface SolidAsyncRateLimiter<
   readonly state: Accessor<Readonly<TSelected>>
   /**
    * @deprecated Use `rateLimiter.state` instead of `rateLimiter.store.state` if you want to read reactive state.
-   * The state on the store object is not reactive, as it has not been wrapped in a `useStore` hook internally.
-   * Although, you can make the state reactive by using the `useStore` in your own usage.
+   * The state on the store object is not reactive, as it has not been wrapped in a `useSelector` hook internally.
+   * Although, you can make the state reactive by using the `useSelector` in your own usage.
    */
   readonly store: Store<Readonly<AsyncRateLimiterState<TFn>>>
 }
@@ -239,14 +239,18 @@ export function createAsyncRateLimiter<
     selector: (state: AsyncRateLimiterState<TFn>) => TSelected
     children: ((state: Accessor<TSelected>) => JSX.Element) | JSX.Element
   }) {
-    const selected = useStore(asyncRateLimiter.store, props.selector)
+    const selected = useSelector(asyncRateLimiter.store, props.selector, {
+      compare: shallow,
+    })
 
     return typeof props.children === 'function'
       ? props.children(selected)
       : props.children
   }
 
-  const state = useStore(asyncRateLimiter.store, selector)
+  const state = useSelector(asyncRateLimiter.store, selector, {
+    compare: shallow,
+  })
 
   createEffect(() => {
     onCleanup(() => {

package/src/async-throttler/createAsyncThrottler.ts

@@ -1,6 +1,6 @@
 import { createEffect, onCleanup } from 'solid-js'
 import { AsyncThrottler } from '@tanstack/pacer/async-throttler'
-import { useStore } from '@tanstack/solid-store'
+import { shallow, useSelector } from '@tanstack/solid-store'
 import { useDefaultPacerOptions } from '../provider/PacerProvider'
 import type { Store } from '@tanstack/solid-store'
 import type { Accessor, JSX } from 'solid-js'
@@ -50,8 +50,8 @@ export interface SolidAsyncThrottler<
   readonly state: Accessor<Readonly<TSelected>>
   /**
    * @deprecated Use `throttler.state` instead of `throttler.store.state` if you want to read reactive state.
-   * The state on the store object is not reactive, as it has not been wrapped in a `useStore` hook internally.
-   * Although, you can make the state reactive by using the `useStore` in your own usage.
+   * The state on the store object is not reactive, as it has not been wrapped in a `useSelector` hook internally.
+   * Although, you can make the state reactive by using the `useSelector` in your own usage.
    */
   readonly store: Store<Readonly<AsyncThrottlerState<TFn>>>
 }
@@ -194,14 +194,18 @@ export function createAsyncThrottler<
     selector: (state: AsyncThrottlerState<TFn>) => TSelected
     children: ((state: Accessor<TSelected>) => JSX.Element) | JSX.Element
   }) {
-    const selected = useStore(asyncThrottler.store, props.selector)
+    const selected = useSelector(asyncThrottler.store, props.selector, {
+      compare: shallow,
+    })
 
     return typeof props.children === 'function'
       ? props.children(selected)
       : props.children
   }
 
-  const state = useStore(asyncThrottler.store, selector)
+  const state = useSelector(asyncThrottler.store, selector, {
+    compare: shallow,
+  })
 
   createEffect(() => {
     onCleanup(() => {

package/src/batcher/createBatcher.ts

@@ -1,5 +1,5 @@
 import { Batcher } from '@tanstack/pacer/batcher'
-import { useStore } from '@tanstack/solid-store'
+import { shallow, useSelector } from '@tanstack/solid-store'
 import { createEffect, onCleanup } from 'solid-js'
 import { useDefaultPacerOptions } from '../provider/PacerProvider'
 import type { Store } from '@tanstack/solid-store'
@@ -46,8 +46,8 @@ export interface SolidBatcher<TValue, TSelected = {}> extends Omit<
   readonly state: Accessor<Readonly<TSelected>>
   /**
    * @deprecated Use `batcher.state` instead of `batcher.store.state` if you want to read reactive state.
-   * The state on the store object is not reactive, as it has not been wrapped in a `useStore` hook internally.
-   * Although, you can make the state reactive by using the `useStore` in your own usage.
+   * The state on the store object is not reactive, as it has not been wrapped in a `useSelector` hook internally.
+   * Although, you can make the state reactive by using the `useSelector` in your own usage.
    */
   readonly store: Store<Readonly<BatcherState<TValue>>>
 }
@@ -171,14 +171,16 @@ export function createBatcher<TValue, TSelected = {}>(
     selector: (state: BatcherState<TValue>) => TSelected
     children: ((state: Accessor<TSelected>) => JSX.Element) | JSX.Element
   }) {
-    const selected = useStore(batcher.store, props.selector)
+    const selected = useSelector(batcher.store, props.selector, {
+      compare: shallow,
+    })
 
     return typeof props.children === 'function'
       ? props.children(selected)
       : props.children
   }
 
-  const state = useStore(batcher.store, selector)
+  const state = useSelector(batcher.store, selector, { compare: shallow })
 
   createEffect(() => {
     onCleanup(() => {

package/src/debouncer/createDebouncer.ts

@@ -1,6 +1,6 @@
 import { Debouncer } from '@tanstack/pacer/debouncer'
 import { createEffect, onCleanup } from 'solid-js'
-import { useStore } from '@tanstack/solid-store'
+import { shallow, useSelector } from '@tanstack/solid-store'
 import { useDefaultPacerOptions } from '../provider/PacerProvider'
 import type { Store } from '@tanstack/solid-store'
 import type { Accessor, JSX } from 'solid-js'
@@ -50,8 +50,8 @@ export interface SolidDebouncer<
   readonly state: Accessor<Readonly<TSelected>>
   /**
    * @deprecated Use `debouncer.state` instead of `debouncer.store.state` if you want to read reactive state.
-   * The state on the store object is not reactive, as it has not been wrapped in a `useStore` hook internally.
-   * Although, you can make the state reactive by using the `useStore` in your own usage.
+   * The state on the store object is not reactive, as it has not been wrapped in a `useSelector` hook internally.
+   * Although, you can make the state reactive by using the `useSelector` in your own usage.
    */
   readonly store: Store<Readonly<DebouncerState<TFn>>>
 }
@@ -171,14 +171,18 @@ export function createDebouncer<TFn extends AnyFunction, TSelected = {}>(
     selector: (state: DebouncerState<TFn>) => TSelected
     children: ((state: Accessor<TSelected>) => JSX.Element) | JSX.Element
   }) {
-    const selected = useStore(asyncDebouncer.store, props.selector)
+    const selected = useSelector(asyncDebouncer.store, props.selector, {
+      compare: shallow,
+    })
 
     return typeof props.children === 'function'
       ? props.children(selected)
       : props.children
   }
 
-  const state = useStore(asyncDebouncer.store, selector)
+  const state = useSelector(asyncDebouncer.store, selector, {
+    compare: shallow,
+  })
 
   createEffect(() => {
     onCleanup(() => {

package/src/queuer/createQueuer.ts

@@ -1,5 +1,5 @@
 import { Queuer } from '@tanstack/pacer/queuer'
-import { useStore } from '@tanstack/solid-store'
+import { shallow, useSelector } from '@tanstack/solid-store'
 import { createEffect, onCleanup } from 'solid-js'
 import { useDefaultPacerOptions } from '../provider/PacerProvider'
 import type { Store } from '@tanstack/solid-store'
@@ -46,8 +46,8 @@ export interface SolidQueuer<TValue, TSelected = {}> extends Omit<
   readonly state: Accessor<Readonly<TSelected>>
   /**
    * @deprecated Use `queuer.state` instead of `queuer.store.state` if you want to read reactive state.
-   * The state on the store object is not reactive, as it has not been wrapped in a `useStore` hook internally.
-   * Although, you can make the state reactive by using the `useStore` in your own usage.
+   * The state on the store object is not reactive, as it has not been wrapped in a `useSelector` hook internally.
+   * Although, you can make the state reactive by using the `useSelector` in your own usage.
    */
   readonly store: Store<Readonly<QueuerState<TValue>>>
 }
@@ -171,14 +171,16 @@ export function createQueuer<TValue, TSelected = {}>(
     selector: (state: QueuerState<TValue>) => TSelected
     children: ((state: Accessor<TSelected>) => JSX.Element) | JSX.Element
   }) {
-    const selected = useStore(queuer.store, props.selector)
+    const selected = useSelector(queuer.store, props.selector, {
+      compare: shallow,
+    })
 
     return typeof props.children === 'function'
       ? props.children(selected)
       : props.children
   }
 
-  const state = useStore(queuer.store, selector)
+  const state = useSelector(queuer.store, selector, { compare: shallow })
 
   createEffect(() => {
     onCleanup(() => {

package/src/rate-limiter/createRateLimiter.ts

@@ -1,6 +1,6 @@
 import { RateLimiter } from '@tanstack/pacer/rate-limiter'
 import { createEffect, onCleanup } from 'solid-js'
-import { useStore } from '@tanstack/solid-store'
+import { shallow, useSelector } from '@tanstack/solid-store'
 import { useDefaultPacerOptions } from '../provider/PacerProvider'
 import type { Store } from '@tanstack/solid-store'
 import type { Accessor, JSX } from 'solid-js'
@@ -50,8 +50,8 @@ export interface SolidRateLimiter<
   readonly state: Accessor<Readonly<TSelected>>
   /**
    * @deprecated Use `rateLimiter.state` instead of `rateLimiter.store.state` if you want to read reactive state.
-   * The state on the store object is not reactive, as it has not been wrapped in a `useStore` hook internally.
-   * Although, you can make the state reactive by using the `useStore` in your own usage.
+   * The state on the store object is not reactive, as it has not been wrapped in a `useSelector` hook internally.
+   * Although, you can make the state reactive by using the `useSelector` in your own usage.
    */
   readonly store: Store<Readonly<RateLimiterState>>
 }
@@ -200,14 +200,16 @@ export function createRateLimiter<TFn extends AnyFunction, TSelected = {}>(
     selector: (state: RateLimiterState) => TSelected
     children: ((state: Accessor<TSelected>) => JSX.Element) | JSX.Element
   }) {
-    const selected = useStore(rateLimiter.store, props.selector)
+    const selected = useSelector(rateLimiter.store, props.selector, {
+      compare: shallow,
+    })
 
     return typeof props.children === 'function'
       ? props.children(selected)
       : props.children
   }
 
-  const state = useStore(rateLimiter.store, selector)
+  const state = useSelector(rateLimiter.store, selector, { compare: shallow })
 
   createEffect(() => {
     onCleanup(() => {

package/src/throttler/createThrottler.ts

@@ -1,6 +1,6 @@
 import { Throttler } from '@tanstack/pacer/throttler'
 import { createEffect, onCleanup } from 'solid-js'
-import { useStore } from '@tanstack/solid-store'
+import { shallow, useSelector } from '@tanstack/solid-store'
 import { useDefaultPacerOptions } from '../provider/PacerProvider'
 import type { Store } from '@tanstack/solid-store'
 import type { Accessor, JSX } from 'solid-js'
@@ -50,8 +50,8 @@ export interface SolidThrottler<
   readonly state: Accessor<Readonly<TSelected>>
   /**
    * @deprecated Use `throttler.state` instead of `throttler.store.state` if you want to read reactive state.
-   * The state on the store object is not reactive, as it has not been wrapped in a `useStore` hook internally.
-   * Although, you can make the state reactive by using the `useStore` in your own usage.
+   * The state on the store object is not reactive, as it has not been wrapped in a `useSelector` hook internally.
+   * Although, you can make the state reactive by using the `useSelector` in your own usage.
    */
   readonly store: Store<Readonly<ThrottlerState<TFn>>>
 }
@@ -174,14 +174,18 @@ export function createThrottler<TFn extends AnyFunction, TSelected = {}>(
     selector: (state: ThrottlerState<TFn>) => TSelected
     children: ((state: Accessor<TSelected>) => JSX.Element) | JSX.Element
   }) {
-    const selected = useStore(asyncThrottler.store, props.selector)
+    const selected = useSelector(asyncThrottler.store, props.selector, {
+      compare: shallow,
+    })
 
     return typeof props.children === 'function'
       ? props.children(selected)
       : props.children
   }
 
-  const state = useStore(asyncThrottler.store, selector)
+  const state = useSelector(asyncThrottler.store, selector, {
+    compare: shallow,
+  })
 
   createEffect(() => {
     onCleanup(() => {