diff --git a/apps/example-next/src/components/Counter.tsx b/apps/example-next/src/components/Counter.tsx index 3451efb0..a4026028 100644 --- a/apps/example-next/src/components/Counter.tsx +++ b/apps/example-next/src/components/Counter.tsx @@ -1,6 +1,10 @@ "use client"; -import { useLocationState, StoreName, Refine } from "@location-state/core"; +import { + useLocationState, + DefaultStoreName, + Refine, +} from "@location-state/core"; import { z, ZodType } from "zod"; const zodRefine = @@ -10,7 +14,7 @@ const zodRefine = return result.success ? result.data : undefined; }; -export function Counter({ storeName }: { storeName: StoreName }) { +export function Counter({ storeName }: { storeName: DefaultStoreName }) { const [counter, setCounter] = useLocationState({ name: "counter", defaultValue: 0, diff --git a/apps/example-next/src/components/List.tsx b/apps/example-next/src/components/List.tsx index 21152210..0eaa35f0 100644 --- a/apps/example-next/src/components/List.tsx +++ b/apps/example-next/src/components/List.tsx @@ -1,8 +1,8 @@ "use client"; -import { useLocationState, StoreName } from "@location-state/core"; +import { useLocationState, DefaultStoreName } from "@location-state/core"; -export function List({ storeName }: { storeName: StoreName }) { +export function List({ storeName }: { storeName: DefaultStoreName }) { const [displayList, setDisplayList] = useLocationState({ name: "display-list", defaultValue: false, diff --git a/packages/location-state-core/src/hooks.ts b/packages/location-state-core/src/hooks.ts index fec16cb9..77020d4d 100644 --- a/packages/location-state-core/src/hooks.ts +++ b/packages/location-state-core/src/hooks.ts @@ -1,13 +1,16 @@ import { LocationStateContext } from "./context"; -import { StoreName } from "./types"; +import { DefaultStoreName } from "./types"; import { useCallback, useContext, useState, useSyncExternalStore } from "react"; export type Refine = (value: unknown) => T | undefined; -export type LocationStateDefinition = { +export type LocationStateDefinition< + T, + StoreName extends string = DefaultStoreName, +> = { name: string; defaultValue: T; - storeName: StoreName | string; + storeName: StoreName; refine?: Refine; }; @@ -15,7 +18,7 @@ type Updater = (prev: T) => T; type UpdaterOrValue = T | Updater; type SetState = (updaterOrValue: UpdaterOrValue) => void; -const useStore = (storeName: StoreName | string) => { +const useStore = (storeName: string) => { const { stores } = useContext(LocationStateContext); const store = stores[storeName]; if (!store) { @@ -25,16 +28,16 @@ const useStore = (storeName: StoreName | string) => { return store; }; -export const useLocationState = ( - definition: LocationStateDefinition, +const _useLocationState = ( + definition: LocationStateDefinition, ): [T, SetState] => { - const storeState = useLocationStateValue(definition); - const setStoreState = useLocationSetState(definition); + const storeState = _useLocationStateValue(definition); + const setStoreState = _useLocationSetState(definition); return [storeState, setStoreState]; }; -export const useLocationStateValue = ( - definition: LocationStateDefinition, +const _useLocationStateValue = ( + definition: LocationStateDefinition, ): T => { const { name, defaultValue, storeName, refine } = useState(definition)[0]; const store = useStore(storeName); @@ -56,8 +59,8 @@ export const useLocationStateValue = ( return storeState; }; -export const useLocationSetState = ( - definition: LocationStateDefinition, +const _useLocationSetState = ( + definition: LocationStateDefinition, ): SetState => { const { name, defaultValue, storeName, refine } = useState(definition)[0]; const store = useStore(storeName); @@ -78,3 +81,23 @@ export const useLocationSetState = ( ); return setStoreState; }; + +export const getHooksWith = () => + ({ + useLocationState: _useLocationState, + useLocationStateValue: _useLocationStateValue, + useLocationSetState: _useLocationSetState, + } as { + useLocationState: ( + definition: LocationStateDefinition, + ) => [T, SetState]; + useLocationStateValue: ( + definition: LocationStateDefinition, + ) => T; + useLocationSetState: ( + definition: LocationStateDefinition, + ) => SetState; + }); + +export const { useLocationState, useLocationStateValue, useLocationSetState } = + getHooksWith(); diff --git a/packages/location-state-core/src/types.ts b/packages/location-state-core/src/types.ts index 734901b4..0c474341 100644 --- a/packages/location-state-core/src/types.ts +++ b/packages/location-state-core/src/types.ts @@ -1,6 +1,6 @@ /// -export type StoreName = "session" | "url"; +export type DefaultStoreName = "session" | "url"; export type Syncer = { key(): string | undefined;