seitu 0.1.0 → 0.2.0

package/README.md

@@ -15,10 +15,10 @@ To quick start you only need to write the following code:
 
 ```tsx
 import { useSubscription } from 'seitu/react'
-import { sessionStorageValue } from 'seitu/web'
+import { createSessionStorageValue } from 'seitu/web'
 import * as z from 'zod'
 
-const value = sessionStorageValue({
+const value = createSessionStorageValue({
   key: 'test',
   defaultValue: 0,
   schema: z.number(),
@@ -30,7 +30,7 @@ value.remove()
 value.subscribe(v => console.log(v))
 
 function Counter() {
-  const count = useSubscription(() => value)
+  const count = useSubscription(value)
 
   return (
     <div>

package/dist/core/index.d.ts

@@ -1,2 +1,2 @@
-export * from './store';
+export * from './schema-store';
 export * from './subscription';

package/dist/core/schema-store.d.ts

@@ -0,0 +1,19 @@
+import type { StandardSchemaV1 } from '@standard-schema/spec';
+import type { Simplify } from '../utils';
+import type { Readable, Subscribable, Writable } from './index';
+export type SchemaStoreSchema = Record<string, StandardSchemaV1<unknown, unknown>>;
+export type SchemaStoreOutput<S extends SchemaStoreSchema> = Simplify<{
+    [K in keyof S]: StandardSchemaV1.InferOutput<S[K]>;
+}>;
+export interface SchemaStore<O extends Record<string, unknown>> extends Subscribable<O>, Readable<O>, Writable<Partial<O>> {
+    getDefaultValue: <K extends keyof O>(key: K) => O[K];
+}
+export interface SchemaStoreOptions<S extends Record<string, StandardSchemaV1>> {
+    schemas: S;
+    defaultValues: SchemaStoreOutput<S>;
+    provider: {
+        get: () => SchemaStoreOutput<S>;
+        set: (value: Partial<SchemaStoreOutput<S>>) => void;
+    };
+}
+export declare function createSchemaStore<S extends Record<string, StandardSchemaV1>>(options: SchemaStoreOptions<S>): SchemaStore<SchemaStoreOutput<S>>;

package/dist/core/subscription.d.ts

@@ -1,7 +1,13 @@
 export interface Subscribable<V> {
     'subscribe': (callback: (value: V) => any) => () => void;
     '~': {
+        /**
+         * Type type with returned value of the subscription.
+         */
         output: V;
+        /**
+         * A function that notifies all subscribers that the value has changed.
+         */
         notify: () => void;
     };
 }

package/dist/core.js

@@ -1,2 +1,2 @@
 import { n as e, t } from "./core-CuCUF5Aj.js";
-export { e as createStore, t as createSubscription };
+export { e as createSchemaStore, t as createSubscription };

package/dist/react/hooks.d.ts

@@ -1,20 +1,25 @@
 import type { Readable, Subscribable } from '../core/index';
+import * as React from 'react';
+export type UseSubscriptionSource<S extends Subscribable<any> & Readable<any>> = S | (() => S);
+export interface UseSubscriptionOptions<S extends Subscribable<any> & Readable<any>, R = S['~']['output']> {
+    selector?: (value: S['~']['output']) => R;
+    deps?: React.DependencyList;
+}
 /**
- * Use this hook to subscribe to a reactive value. The factory function is called only
- * once on first render — subsequent renders reuse the cached subscription.
+ * Use this hook to subscribe to a reactive value. Accepts a subscription object
+ * directly, or a factory function that is called only once on first render —
+ * subsequent renders reuse the cached subscription unless dependency array changes.
  *
- * @kind hook
- *
- * @example
+ * @example Inline subscription
  * ```tsx twoslash title="/app/page.tsx"
  * 'use client'
  *
- * import { sessionStorageValue } from 'seitu/web'
+ * import { createSessionStorageValue } from 'seitu/web'
  * import { useSubscription } from 'seitu/react'
  * import * as z from 'zod'
  *
  * export default function Page() {
- *   const value = useSubscription(() => sessionStorageValue({
+ *   const value = useSubscription(() => createSessionStorageValue({
  *     key: 'test',
  *     defaultValue: 0,
  *     schema: z.number(),
@@ -24,7 +29,26 @@ import type { Readable, Subscribable } from '../core/index';
  * }
  * ```
  *
- * @example
+ * @example Instance outside of component
+ * ```tsx twoslash title="/app/page.tsx"
+ * 'use client'
+ *
+ * import { createSessionStorage } from 'seitu/web'
+ * import { useSubscription } from 'seitu/react'
+ * import * as z from 'zod'
+ *
+ * const sessionStorage = createSessionStorage({
+ *   schemas: { count: z.number(), name: z.string() },
+ *   defaultValues: { count: 0, name: '' },
+ * })
+ *
+ * export default function Page() {
+ *   const value = useSubscription(sessionStorage)
+ *   return <div>{value.count}</div>
+ * }
+ * ```
+ *
+ * @example Subscription with selector
  * ```tsx twoslash title="/app/page.tsx"
  * 'use client'
  *
@@ -42,10 +66,30 @@ import type { Readable, Subscribable } from '../core/index';
  *
  * export default function Page() {
  *   // Usage with selector, re-renders only when count changes
- *   const count = useSubscription(() => sessionStorage, value => value.count)
+ *   const count = useSubscription(sessionStorage, { selector: value => value.count })
  *
  *   return <div>{count}</div>
  * }
  * ```
+ *
+ * @example Ref example
+ * ```tsx twoslash title="/app/page.tsx"
+ * 'use client'
+ *
+ * import * as React from 'react'
+ * import { scrollState } from 'seitu/web'
+ * import { useSubscription } from 'seitu/react'
+ *
+ * export default function Page() {
+ *   const [ref, setRef] = React.useState<HTMLDivElement | null>(null)
+ *   const state = useSubscription(() => scrollState({ element: ref, direction: 'vertical' }), { deps: [ref] })
+ *
+ *   return (
+ *     <div ref={setRef}>
+ *       {String(state.top.value)}
+ *     </div>
+ *   )
+ * }
+ * ```
  */
-export declare function useSubscription<S extends Subscribable<any> & Readable<any>, R = S['~']['output']>(factory: () => S, selector?: (value: S['~']['output']) => R): R;
+export declare function useSubscription<S extends Subscribable<any> & Readable<any> = Subscribable<any> & Readable<any>, R = S['~']['output']>(source: UseSubscriptionSource<S>, options?: UseSubscriptionOptions<S, R>): R;

package/dist/react.js

@@ -1778,14 +1778,17 @@ var t = Object.create, n = Object.defineProperty, r = Object.getOwnPropertyDescr
 	};
 }))(), 1);
 function Ze(t, n) {
-	let r = e.useRef(void 0);
-	r.current === void 0 && (r.current = t());
-	let i = r.current;
-	if (!i.get || !i.subscribe) throw Error("Subscription is not valid. It must have a get and subscribe method.");
-	let [a, o] = e.useState(() => n ? n(i.get()) : i.get()), s = e.useEffectEvent(() => a);
-	return e.useEffect(() => i.subscribe((e) => {
-		let t = n ? n(e) : e;
-		(0, Xe.default)(t, s()) || o(t);
-	}), [i, n]), a;
+	let { selector: r, deps: i = [] } = n ?? {}, a = typeof t == "function", o = e.useRef(t);
+	if (!a && t !== o.current) throw Error("useSubscription detected a new object on re-render. Either create the subscription outside the component or wrap it in a factory: useSubscription(() => yourSubscription(...))");
+	o.current = t;
+	let s = a ? t : () => t, c = e.useRef(s);
+	c.current = s;
+	let l = e.useMemo(() => c.current(), i);
+	if (!l.get || !l.subscribe) throw Error("Subscription is not valid. It must have a get and subscribe method.");
+	let [u, d] = e.useState(() => r ? r(l.get()) : l.get()), f = e.useEffectEvent(() => u);
+	return e.useEffect(() => l.subscribe((e) => {
+		let t = r ? r(e) : e;
+		(0, Xe.default)(t, f()) || d(t);
+	}), [l, r]), u;
 }
 export { Ze as useSubscription };

package/dist/web/index.d.ts

@@ -1,3 +1,5 @@
+export * from './local-storage';
+export * from './local-storage-value';
 export * from './media-query';
 export * from './scroll-state';
 export * from './session-storage';

package/dist/web/local-storage-value.d.ts

@@ -0,0 +1,68 @@
+import type { StandardSchemaV1 } from '@standard-schema/spec';
+import type { LocalStorage } from './local-storage';
+import type { WebStorageValue as LocalStorageValue, WebStorageValueOptionsWithSchema as LocalStorageValueOptionsWithSchema, WebStorageValueOptionsWithStorage as LocalStorageValueOptionsWithStorage } from './web-storage-value';
+export type { LocalStorageValue, LocalStorageValueOptionsWithSchema, LocalStorageValueOptionsWithStorage, };
+/**
+ * Creates a reactive handle for a single localStorage value.
+ *
+ * Two modes:
+ * - **Schema mode** (`schema`, `key`, `defaultValue`): standalone key with validation. Missing or
+ *   invalid stored data returns `defaultValue`.
+ * - **Storage mode** (`storage`, `key`): binds to one key of a `createLocalStorage` instance.
+ *   Type and default come from that storage.
+ *
+ * @example Vanilla
+ * ```ts twoslash title="local-storage-value.ts"
+ * import { createLocalStorageValue } from 'seitu/web'
+ * import * as z from 'zod'
+ *
+ * const value = createLocalStorageValue({
+ *   key: 'count',
+ *   defaultValue: 0,
+ *   schema: z.number(),
+ * })
+ * value.get() // 0
+ * value.set(1)
+ * value.set(v => v + 1)
+ * value.subscribe(v => console.log(v))
+ * ```
+ *
+ * @example Storage mode
+ * ```ts twoslash title="local-storage-value.ts"
+ * import { createLocalStorage, createLocalStorageValue } from 'seitu/web'
+ * import * as z from 'zod'
+ *
+ * const storage = createLocalStorage({
+ *   schemas: { count: z.number(), name: z.string() },
+ *   defaultValues: { count: 0, name: '' },
+ * })
+ * const count = createLocalStorageValue({ storage, key: 'count' })
+ * count.set(5)
+ * storage.get().count === 5 // true
+ * ```
+ *
+ * @example React
+ * ```tsx twoslash title="page.tsx"
+ * 'use client'
+ *
+ * import { createLocalStorageValue } from 'seitu/web'
+ * import { useSubscription } from 'seitu/react'
+ * import * as z from 'zod'
+ *
+ * export default function Page() {
+ *   const { value: count } = useSubscription(() => createLocalStorageValue({
+ *     key: 'count',
+ *     defaultValue: 0,
+ *     schema: z.number(),
+ *   }))
+ *
+ *   return (
+ *     <div>
+ *       <span>{count}</span>
+ *     </div>
+ *   )
+ * }
+ * ```
+ */
+export declare function createLocalStorageValue<Storage extends LocalStorage<any>, K extends keyof Storage['~']['output']>(options: LocalStorageValueOptionsWithStorage<Storage, K>): LocalStorageValue<Storage['~']['output'][K]>;
+export declare function createLocalStorageValue<S extends StandardSchemaV1<unknown>>(options: LocalStorageValueOptionsWithSchema<S>): LocalStorageValue<StandardSchemaV1.InferOutput<S>>;

package/dist/web/local-storage.d.ts

@@ -0,0 +1,50 @@
+import type { SchemaStoreOutput, SchemaStoreSchema } from '../core/index';
+import type { WebStorage as LocalStorage, WebStorageOptions as LocalStorageOptions } from './web-storage';
+export type { LocalStorage, LocalStorageOptions };
+/**
+ * Creates a reactive handle for a localStorage instance.
+ *
+ * @example Vanilla
+ * ```ts twoslash title="local-storage.ts"
+ * import { createLocalStorage } from 'seitu/web'
+ * import * as z from 'zod'
+ *
+ * const localStorage = createLocalStorage({
+ *   schemas: {
+ *     token: z.string().nullable(),
+ *     preferences: z.object({ theme: z.enum(['light', 'dark']) }),
+ *   },
+ *   defaultValues: { token: null, preferences: { theme: 'light' } },
+ * })
+ *
+ * localStorage.get() // { token: null, preferences: { theme: 'light' } }
+ * localStorage.set({ token: 'abc' })
+ * localStorage.get() // { token: 'abc', preferences: { theme: 'light' } }
+ * localStorage.subscribe(console.log)
+ * ```
+ *
+ * @example React
+ * ```tsx twoslash title="page.tsx"
+ * 'use client'
+ *
+ * import { createLocalStorage } from 'seitu/web'
+ * import { useSubscription } from 'seitu/react'
+ * import * as z from 'zod'
+ *
+ * const localStorage = createLocalStorage({
+ *   schemas: { count: z.number(), name: z.string() },
+ *   defaultValues: { count: 0, name: '' },
+ * })
+ *
+ * export default function Page() {
+ *   const { value } = useSubscription(localStorage)
+ *   return (
+ *     <div>
+ *       <span>{value.count}</span>
+ *       <span>{value.name}</span>
+ *     </div>
+ *   )
+ * }
+ * ```
+ */
+export declare function createLocalStorage<S extends SchemaStoreSchema>(options: LocalStorageOptions<S>): LocalStorage<SchemaStoreOutput<S>>;

package/dist/web/media-query.d.ts

@@ -31,7 +31,7 @@ export interface MediaQueryOptions<T extends string> {
 /**
  * Creates a handle for a media query.
  *
- * @example
+ * @example Vanilla
  * ```ts twoslash title="media-query.ts"
  * import { mediaQuery } from 'seitu/web'
  * import { useSubscription } from 'seitu/react'
@@ -47,6 +47,7 @@ export interface MediaQueryOptions<T extends string> {
  * console.log(state)
  * ```
  *
+ * @example React
  * ```tsx twoslash title="page.tsx"
  * import { mediaQuery } from 'seitu/web'
  * import { useSubscription } from 'seitu/react'
@@ -55,11 +56,12 @@ export interface MediaQueryOptions<T extends string> {
  *
  * // Usage with some function component
  * function Layout() {
- *   const matches = useSubscription(() => isDesktop)
+ *   const { value: matches } = useSubscription(isDesktop)
  *   return matches ? 'i am desktop' : 'i am mobile'
  * }
  * ```
  *
+ * @example Errors
  * ```tsx twoslash
  * import { mediaQuery } from 'seitu/web'
  * import { useSubscription } from 'seitu/react'

package/dist/web/scroll-state.d.ts

@@ -31,7 +31,7 @@ export interface ScrollStateOptions {
 /**
  * Creates a reactive handle that tracks scroll position of an element relative to each edge.
  *
- * @example
+ * @example Vanilla
  * ```ts twoslash
  * import { scrollState } from 'seitu/web'
  *
@@ -42,17 +42,18 @@ export interface ScrollStateOptions {
  * })
  *
  * scroll.subscribe(state => {
- *   console.log(state.top.value)       // scrolled away from top
- *   console.log(state.top.remaining)   // px left to scroll back to top
- *   console.log(state.bottom.value)    // reached the bottom
- *   console.log(state.bottom.remaining) // px left to reach bottom
+ *   console.log(state.top.value)
+ *   console.log(state.top.remaining)
+ *   console.log(state.bottom.value)
+ *   console.log(state.bottom.remaining)
  * })
  *
  * const state = scroll.get()
  * console.log(state)
  * ```
  *
- * ```tsx twoslash
+ * @example React
+ * ```tsx twoslash title="page.tsx"
  * import { scrollState } from 'seitu/web'
  * import { useSubscription } from 'seitu/react'
  *
@@ -62,8 +63,24 @@ export interface ScrollStateOptions {
  * })
  *
  * function Layout() {
- *   const state = useSubscription(() => scroll)
- *   return state.top.value ? 'scrolled' : 'at the top'
+ *   const { value: state, ref } = useSubscription(scroll)
+ *
+ *   return (
+ *     <div ref={ref}>
+ *       <div>
+ *         {state.top.value ? 'scrolled' : 'at the top'}
+ *       </div>
+ *       <div>
+ *         {state.bottom.value ? 'scrolled' : 'at the bottom'}
+ *       </div>
+ *       <div>
+ *         {state.left.value ? 'scrolled' : 'at the left'}
+ *       </div>
+ *       <div>
+ *         {state.right.value ? 'scrolled' : 'at the right'}
+ *       </div>
+ *     </div>
+ *   )
  * }
  * ```
  */

package/dist/web/session-storage-value.d.ts

@@ -1,18 +1,7 @@
 import type { StandardSchemaV1 } from '@standard-schema/spec';
-import type { Readable, Subscribable, Writable } from '../core/index';
 import type { SessionStorage } from './session-storage';
-export interface SessionStorageValue<V> extends Subscribable<V>, Readable<V>, Writable<V> {
-}
-export interface SessionStorageValueOptionsWithStorage<Storage extends SessionStorage<any>, K extends keyof Storage['~']['output']> {
-    storage: Storage;
-    key: K;
-}
-export interface SessionStorageValueOptionsWithSchema<S extends StandardSchemaV1<unknown>> {
-    schema: S;
-    key: string;
-    defaultValue: StandardSchemaV1.InferOutput<S>;
-}
-export type SessionStorageValueOptions = SessionStorageValueOptionsWithStorage<SessionStorage<any>, string> | SessionStorageValueOptionsWithSchema<StandardSchemaV1<unknown>>;
+import type { WebStorageValue as SessionStorageValue, WebStorageValueOptionsWithSchema as SessionStorageValueOptionsWithSchema, WebStorageValueOptionsWithStorage as SessionStorageValueOptionsWithStorage } from './web-storage-value';
+export type { SessionStorageValue, SessionStorageValueOptionsWithSchema, SessionStorageValueOptionsWithStorage, };
 /**
  * Creates a reactive handle for a single sessionStorage value.
  *
@@ -22,12 +11,12 @@ export type SessionStorageValueOptions = SessionStorageValueOptionsWithStorage<S
  * - **Storage mode** (`storage`, `key`): binds to one key of a `createSessionStorage` instance.
  *   Type and default come from that storage.
  *
- * @example
- * ```ts twoslash
- * import { sessionStorageValue } from 'seitu/web'
+ * @example Vanilla
+ * ```ts twoslash title="session-storage-value.ts"
+ * import { createSessionStorageValue } from 'seitu/web'
  * import * as z from 'zod'
  *
- * const value = sessionStorageValue({
+ * const value = createSessionStorageValue({
  *   key: 'count',
  *   defaultValue: 0,
  *   schema: z.number(),
@@ -38,19 +27,42 @@ export type SessionStorageValueOptions = SessionStorageValueOptionsWithStorage<S
  * value.subscribe(v => console.log(v))
  * ```
  *
- * @example
- * ```ts twoslash
- * import { createSessionStorage, sessionStorageValue } from 'seitu/web'
+ * @example Storage mode
+ * ```ts twoslash title="session-storage-value.ts"
+ * import { createSessionStorage, createSessionStorageValue } from 'seitu/web'
  * import * as z from 'zod'
  *
  * const storage = createSessionStorage({
  *   schemas: { count: z.number(), name: z.string() },
  *   defaultValues: { count: 0, name: '' },
  * })
- * const count = sessionStorageValue({ storage, key: 'count' })
+ * const count = createSessionStorageValue({ storage, key: 'count' })
  * count.set(5)
  * storage.get().count === 5 // true
  * ```
+ *
+ * @example React
+ * ```tsx twoslash title="page.tsx"
+ * 'use client'
+ *
+ * import { createSessionStorageValue } from 'seitu/web'
+ * import { useSubscription } from 'seitu/react'
+ * import * as z from 'zod'
+ *
+ * export default function Page() {
+ *   const { value: count } = useSubscription(() => createSessionStorageValue({
+ *     key: 'count',
+ *     defaultValue: 0,
+ *     schema: z.number(),
+ *   }))
+ *
+ *   return (
+ *     <div>
+ *       <span>{count}</span>
+ *     </div>
+ *   )
+ * }
+ * ```
  */
-export declare function sessionStorageValue<Storage extends SessionStorage<any>, K extends keyof Storage['~']['output']>(options: SessionStorageValueOptionsWithStorage<Storage, K>): SessionStorageValue<Storage['~']['output'][K]>;
-export declare function sessionStorageValue<S extends StandardSchemaV1<unknown>>(options: SessionStorageValueOptionsWithSchema<S>): SessionStorageValue<StandardSchemaV1.InferOutput<S>>;
+export declare function createSessionStorageValue<Storage extends SessionStorage<any>, K extends keyof Storage['~']['output']>(options: SessionStorageValueOptionsWithStorage<Storage, K>): SessionStorageValue<Storage['~']['output'][K]>;
+export declare function createSessionStorageValue<S extends StandardSchemaV1<unknown>>(options: SessionStorageValueOptionsWithSchema<S>): SessionStorageValue<StandardSchemaV1.InferOutput<S>>;

package/dist/web/session-storage.d.ts

@@ -1,10 +1,11 @@
-import type { Store, StoreOptions, StoreOutput, StoreSchema } from '../core/index';
-export type SessionStorage<O extends Record<string, unknown>> = Store<O>;
+import type { SchemaStoreOutput, SchemaStoreSchema } from '../core/index';
+import type { WebStorage as SessionStorage, WebStorageOptions as SessionStorageOptions } from './web-storage';
+export type { SessionStorage, SessionStorageOptions };
 /**
  * Creates a reactive handle for a sessionStorage instance.
  *
- * @example
- * ```ts twoslash
+ * @example Vanilla
+ * ```ts twoslash title="session-storage.ts"
  * import { createSessionStorage } from 'seitu/web'
  * import * as z from 'zod'
  *
@@ -16,14 +17,34 @@ export type SessionStorage<O extends Record<string, unknown>> = Store<O>;
  *   defaultValues: { token: null, preferences: { theme: 'light' } },
  * })
  *
- * sessionStorage.get().token // null
- * sessionStorage.get().preferences // { theme: 'light' }
- * sessionStorage.set({ token: '123', preferences: { theme: 'dark' } })
- * sessionStorage.get().token // '123'
- * sessionStorage.get().preferences // { theme: 'dark' }
- * sessionStorage.subscribe(value => console.log(value))
- * sessionStorage.set({ token: '456', preferences: { theme: 'light' } })
- * // { token: '456', preferences: { theme: 'light' } }
+ * sessionStorage.get() // { token: null, preferences: { theme: 'light' } }
+ * sessionStorage.set({ token: 'abc' })
+ * sessionStorage.get() // { token: 'abc', preferences: { theme: 'light' } }
+ * sessionStorage.subscribe(console.log)
+ * ```
+ *
+ * @example React
+ * ```tsx twoslash title="page.tsx"
+ * 'use client'
+ *
+ * import { createSessionStorage } from 'seitu/web'
+ * import { useSubscription } from 'seitu/react'
+ * import * as z from 'zod'
+ *
+ * const sessionStorage = createSessionStorage({
+ *   schemas: { count: z.number(), name: z.string() },
+ *   defaultValues: { count: 0, name: '' },
+ * })
+ *
+ * export default function Page() {
+ *   const { value } = useSubscription(sessionStorage)
+ *   return (
+ *     <div>
+ *       <span>{value.count}</span>
+ *       <span>{value.name}</span>
+ *     </div>
+ *   )
+ * }
  * ```
  */
-export declare function createSessionStorage<S extends StoreSchema>(options: Omit<StoreOptions<S>, 'provider'>): SessionStorage<StoreOutput<S>>;
+export declare function createSessionStorage<S extends SchemaStoreSchema>(options: SessionStorageOptions<S>): SessionStorage<SchemaStoreOutput<S>>;

package/dist/web/web-storage-value.d.ts

@@ -0,0 +1,18 @@
+import type { StandardSchemaV1 } from '@standard-schema/spec';
+import type { Readable, Subscribable, Writable } from '../core/index';
+import type { WebStorage } from './web-storage';
+export interface WebStorageValue<V> extends Subscribable<V>, Readable<V>, Writable<V> {
+}
+export interface WebStorageValueOptionsWithStorage<Storage extends WebStorage<any>, K extends keyof Storage['~']['output']> {
+    storage: Storage;
+    key: K;
+}
+export interface WebStorageValueOptionsWithSchema<S extends StandardSchemaV1<unknown>> {
+    schema: S;
+    key: string;
+    defaultValue: StandardSchemaV1.InferOutput<S>;
+}
+export declare function createWebStorageValue<Storage extends WebStorage<any>, K extends keyof Storage['~']['output']>(options: WebStorageValueOptionsWithStorage<Storage, K>): WebStorageValue<Storage['~']['output'][K]>;
+export declare function createWebStorageValue<S extends StandardSchemaV1<unknown>>(options: WebStorageValueOptionsWithSchema<S> & {
+    kind: 'sessionStorage' | 'localStorage';
+}): WebStorageValue<StandardSchemaV1.InferOutput<S>>;

package/dist/web/web-storage.d.ts

@@ -0,0 +1,11 @@
+import type { SchemaStore, SchemaStoreOptions, SchemaStoreOutput, SchemaStoreSchema } from '../core/index';
+export interface WebStorageOptions<S extends SchemaStoreSchema> extends Omit<SchemaStoreOptions<S>, 'provider'> {
+}
+export interface WebStorage<O extends Record<string, unknown>> extends SchemaStore<O> {
+    '~': {
+        kind: 'sessionStorage' | 'localStorage';
+    } & SchemaStore<O>['~'];
+}
+export declare function createWebStorage<S extends SchemaStoreSchema>(options: WebStorageOptions<S> & {
+    kind: 'sessionStorage' | 'localStorage';
+}): WebStorage<SchemaStoreOutput<S>>;

package/dist/web.js

@@ -1,5 +1,91 @@
 import { n as e, r as t, t as n } from "./core-CuCUF5Aj.js";
-function r(e) {
+function r(n) {
+	let { kind: r, ...i } = n, a = e({
+		...i,
+		provider: {
+			get: () => {
+				if (typeof window > "u") return i.defaultValues;
+				let e = window[r], n = { ...i.defaultValues };
+				for (let r in n) {
+					let a = t(e.getItem(r)), o = i.schemas[r]["~standard"].validate(a);
+					if (o instanceof Promise) throw TypeError("[createWebSchemaStore] Validation schema should not return a Promise.");
+					o.issues && console.warn(JSON.stringify(o.issues, null, 2), { cause: o.issues }), n[r] = o.issues ? i.defaultValues[r] : o.value;
+				}
+				return n;
+			},
+			set: (e) => {
+				if (typeof window > "u") return;
+				let t = window[r];
+				Object.entries(e).forEach(([e, n]) => {
+					t.setItem(e, typeof n == "string" ? n : JSON.stringify(n));
+				});
+			}
+		}
+	});
+	return typeof window < "u" && window.addEventListener("storage", () => {
+		a["~"].notify();
+	}), {
+		...a,
+		"~": {
+			kind: r,
+			...a["~"]
+		}
+	};
+}
+function i(e) {
+	return r({
+		kind: "localStorage",
+		...e
+	});
+}
+function a(e) {
+	let r = "storage" in e ? e.storage["~"].kind : e.kind, i = `${r}Value`;
+	if ("schema" in e && e.defaultValue === void 0) throw Error(`[${i}] Default value is required`);
+	if (e.key === void 0) throw Error(`[${i}] Key is required`);
+	if (!("schema" in e || "storage" in e)) throw Error(`[${i}] Either schema or storage must be provided`);
+	let a = ("schema" in e ? e.defaultValue : e.storage.getDefaultValue(e.key)) ?? null, { subscribe: o, notify: s } = n(), c = () => {
+		if (typeof window > "u") return a;
+		let n = window[r].getItem(e.key);
+		if (n === null) return a;
+		let i = t(n);
+		try {
+			if ("schema" in e) {
+				let t = e.schema["~standard"].validate(i);
+				if (t instanceof Promise) throw TypeError("Validation schema should not return a Promise.");
+				return t.issues ? (console.error(JSON.stringify(t.issues, null, 2), { cause: t.issues }), a) : t.value;
+			} else return i;
+		} catch {
+			return a !== void 0 && typeof a != "string" ? a : i;
+		}
+	};
+	return {
+		get: c,
+		set: (t) => {
+			if (typeof window > "u") return;
+			let n = window[r], i = typeof t == "function" ? t(c()) : t;
+			n.setItem(e.key, typeof i == "string" ? i : JSON.stringify(i)), window.dispatchEvent(new Event("storage")), s();
+		},
+		subscribe: (t) => {
+			let n = o(() => t(c())), r = (n) => {
+				n.key === e.key && t(c());
+			};
+			return typeof window < "u" && window.addEventListener("storage", r), () => {
+				n(), typeof window < "u" && window.removeEventListener("storage", r);
+			};
+		},
+		"~": {
+			output: null,
+			notify: s
+		}
+	};
+}
+function o(e) {
+	return "storage" in e ? a(e) : a({
+		...e,
+		kind: "localStorage"
+	});
+}
+function s(e) {
 	let { subscribe: t, notify: r } = n(), i = () => {
 		if (typeof window > "u") return e.defaultMatches ?? !1;
 		try {
@@ -23,109 +109,56 @@ function r(e) {
 		}
 	};
 }
-var i = {
+var c = {
 	value: !1,
 	remaining: 0
 };
-function a(e) {
-	let { direction: t = "both", threshold: r = 0 } = e, { subscribe: a, notify: o } = n(), s = () => {
-		let n = e.element, a = (e, t) => ({
+function l(e) {
+	let { direction: t = "both", threshold: r = 0 } = e, { subscribe: i, notify: a } = n(), o = () => {
+		let n = e.element, i = (e, t) => ({
 			value: e,
 			remaining: Math.max(0, t)
 		});
 		if (!n) return {
-			top: i,
-			bottom: i,
-			left: i,
-			right: i
+			top: c,
+			bottom: c,
+			left: c,
+			right: c
 		};
-		let o = n.scrollTop, s = n.scrollHeight - n.scrollTop - n.clientHeight, c = n.scrollLeft, l = n.scrollWidth - n.scrollLeft - n.clientWidth;
+		let a = n.scrollTop, o = n.scrollHeight - n.scrollTop - n.clientHeight, s = n.scrollLeft, l = n.scrollWidth - n.scrollLeft - n.clientWidth;
 		return {
-			top: t === "horizontal" ? i : a(o > r, o),
-			bottom: t === "horizontal" ? i : a(s <= r, s),
-			left: t === "vertical" ? i : a(c > r, c),
-			right: t === "vertical" ? i : a(l <= r, l)
+			top: t === "horizontal" ? c : i(a > r, a),
+			bottom: t === "horizontal" ? c : i(o <= r, o),
+			left: t === "vertical" ? c : i(s > r, s),
+			right: t === "vertical" ? c : i(l <= r, l)
 		};
 	};
 	return {
-		get: s,
+		get: o,
 		subscribe: (t) => {
 			let n = e.element;
-			if (!n) return t(s()), () => {};
-			let r = a(() => t(s())), i = () => t(s());
-			return n.addEventListener("scroll", i, { passive: !0 }), () => {
-				r(), n.removeEventListener("scroll", i);
+			if (!n) return t(o()), () => {};
+			let r = i(() => t(o())), a = () => t(o());
+			return n.addEventListener("scroll", a, { passive: !0 }), () => {
+				r(), n.removeEventListener("scroll", a);
 			};
 		},
 		"~": {
 			output: null,
-			notify: o
+			notify: a
 		}
 	};
 }
-function o(n) {
-	let r = e({
-		...n,
-		provider: {
-			get: () => {
-				if (typeof window > "u") return n.defaultValues;
-				let e = { ...n.defaultValues };
-				for (let r in e) {
-					let i = t(window.sessionStorage.getItem(r)), a = n.schemas[r]["~standard"].validate(i);
-					if (a instanceof Promise) throw TypeError("[createSessionStorage] Validation schema should not return a Promise.");
-					a.issues && console.warn(JSON.stringify(a.issues, null, 2), { cause: a.issues }), e[r] = a.issues ? n.defaultValues[r] : a.value;
-				}
-				return e;
-			},
-			set: (e) => {
-				typeof window > "u" || Object.entries(e).forEach(([e, t]) => {
-					window.sessionStorage.setItem(e, typeof t == "string" ? t : JSON.stringify(t));
-				});
-			}
-		}
+function u(e) {
+	return r({
+		kind: "sessionStorage",
+		...e
 	});
-	return typeof window < "u" && window.addEventListener("storage", () => {
-		r["~"].notify();
-	}), r;
 }
-function s(e) {
-	if ("schema" in e && e.defaultValue === void 0) throw Error("[sessionStorageValue] Default value is required");
-	if (e.key === void 0) throw Error("[sessionStorageValue] Key is required");
-	if (!("schema" in e || "storage" in e)) throw Error("[sessionStorageValue] Either schema or storage must be provided");
-	let r = ("schema" in e ? e.defaultValue : e.storage.getDefaultValue(e.key)) ?? null, { subscribe: i, notify: a } = n(), o = () => {
-		if (typeof window > "u") return r;
-		let n = window.sessionStorage.getItem(e.key);
-		if (n === null) return r;
-		let i = t(n);
-		try {
-			if ("schema" in e) {
-				let t = e.schema["~standard"].validate(i);
-				if (t instanceof Promise) throw TypeError("Validation schema should not return a Promise.");
-				return t.issues ? (console.error(JSON.stringify(t.issues, null, 2), { cause: t.issues }), r) : t.value;
-			} else return i;
-		} catch {
-			return r !== void 0 && typeof r != "string" ? r : i;
-		}
-	};
-	return {
-		get: o,
-		set: (t) => {
-			if (typeof window > "u") return;
-			let n = typeof t == "function" ? t(o()) : t;
-			window.sessionStorage.setItem(e.key, typeof n == "string" ? n : JSON.stringify(n)), window.dispatchEvent(new Event("storage")), a();
-		},
-		subscribe: (t) => {
-			let n = i(() => t(o())), r = (n) => {
-				n.key === e.key && t(o());
-			};
-			return typeof window < "u" && window.addEventListener("storage", r), () => {
-				n(), typeof window < "u" && window.removeEventListener("storage", r);
-			};
-		},
-		"~": {
-			output: null,
-			notify: a
-		}
-	};
+function d(e) {
+	return "storage" in e ? a(e) : a({
+		...e,
+		kind: "sessionStorage"
+	});
 }
-export { o as createSessionStorage, r as mediaQuery, a as scrollState, s as sessionStorageValue };
+export { i as createLocalStorage, o as createLocalStorageValue, u as createSessionStorage, d as createSessionStorageValue, s as mediaQuery, l as scrollState };

package/package.json

@@ -2,7 +2,7 @@
   "name": "seitu",
   "displayName": "Seitu",
   "type": "module",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "private": false,
   "author": "Valerii Strilets",
   "license": "MIT",

package/dist/core/store.d.ts

@@ -1,107 +0,0 @@
-import type { StandardSchemaV1 } from '@standard-schema/spec';
-import type { Simplify } from '../utils';
-import type { Readable, Subscribable, Writable } from './index';
-export type StoreSchema = Record<string, StandardSchemaV1<unknown, unknown>>;
-export type StoreOutput<S extends StoreSchema> = Simplify<{
-    [K in keyof S]: StandardSchemaV1.InferOutput<S[K]>;
-}>;
-export interface Store<O extends Record<string, unknown>> extends Subscribable<O>, Readable<O>, Writable<O> {
-    getDefaultValue: <K extends keyof O>(key: K) => O[K];
-}
-export interface StoreOptions<S extends Record<string, StandardSchemaV1>> {
-    /**
-     * Schemas for each storage key (one validator per key).
-     * Use this when each key has its own type; for a single compound schema use a wrapper with one key.
-     *
-     * @example
-     * ```ts
-     * const store = createStore({
-     *   schemas: {
-     *     token: z.string().nullable(),
-     *     preferences: z.object({ theme: z.enum(['light', 'dark']) }),
-     *   },
-     *   defaultValues: { token: null, preferences: { theme: 'light' } },
-     *   provider: {
-     *     get: () => ({
-     *       token: window.localStorage.getItem('token'),
-     *       preferences: window.localStorage.getItem('preferences'),
-     *     }),
-     *     set: (value) => {
-     *       window.localStorage.setItem('token', value.token ?? '')
-     *       window.localStorage.setItem('preferences', JSON.stringify(value.preferences))
-     *     },
-     *   },
-     * })
-     * ```
-     */
-    schemas: S;
-    /**
-     * The default values to use for the storage.
-     *
-     * @example
-     * ```ts
-     * const store = createStore({
-     *   schemas: {
-     *     token: z.string().nullable(),
-     *     preferences: z.object({ theme: z.enum(['light', 'dark']) }),
-     *   },
-     *   defaultValues: {
-     *     token: null,
-     *     preferences: { theme: 'light' },
-     *   },
-     *   provider: {
-     *     get: () => ({
-     *       token: window.localStorage.getItem('token'),
-     *       preferences: window.localStorage.getItem('preferences'),
-     *     }),
-     *     set: (value) => {
-     *       window.localStorage.setItem('token', value.token ?? '')
-     *       window.localStorage.setItem('preferences', JSON.stringify(value.preferences))
-     *     },
-     *   },
-     * })
-     * ```
-     */
-    defaultValues: StoreOutput<S>;
-    provider: {
-        get: () => StoreOutput<S>;
-        set: (value: StoreOutput<S>) => void;
-    };
-}
-/**
- * Creates a reactive handle for a storage instance.
- *
- * @example
- * ```ts twoslash
- * import { createStore } from 'seitu'
- * import * as z from 'zod'
- *
- * const store = createStore({
- *   schemas: {
- *     token: z.string().nullable(),
- *     preferences: z.object({ theme: z.enum(['light', 'dark']) }),
- *   },
- *   defaultValues: { token: null, preferences: { theme: 'light' } },
- *   provider: {
- *     get: () => ({
- *       token: window.localStorage.getItem('token'),
- *       preferences: JSON.parse(window.localStorage.getItem('preferences') ?? '{"theme":"light"}'),
- *     }),
- *     set: (value) => {
- *       window.localStorage.setItem('token', value.token ?? '')
- *       window.localStorage.setItem('preferences', JSON.stringify(value.preferences))
- *     },
- *   },
- * })
- *
- * store.get().token // null
- * store.get().preferences // { theme: 'light' }
- * store.set({ token: '123', preferences: { theme: 'dark' } })
- * store.get().token // '123'
- * store.get().preferences // { theme: 'dark' }
- * store.subscribe(value => console.log(value))
- * store.set({ token: '456', preferences: { theme: 'light' } })
- * // { token: '456', preferences: { theme: 'light' } }
- * ```
- */
-export declare function createStore<S extends Record<string, StandardSchemaV1>>(options: StoreOptions<S>): Store<StoreOutput<S>>;