cross-state 0.55.5 → 0.56.0

package/dist/react/index.d.cts

@@ -1,7 +1,7 @@
-import "../scope-6B7-8lwa.cjs";
-import { Constrain, Duration, GetKeys, Join, MaybePromise, Object_, Path as Path$1, PathAsString, Selector, Store, Update, UpdateFunction, Value, WildcardPathAsString, WildcardValue } from "../store-BEsiS8y7.cjs";
-import { ScopeProps, ScopeProvider, UseCacheArray, UseCacheValue, UseStoreOptions, cacheMethods, scopeMethods, storeMethods, useCache, useScope, useStore } from "../storeMethods-Bg8nMBrf.cjs";
-import React$1, { Component, ComponentPropsWithoutRef, Context, FormEvent, FunctionComponent, HTMLProps, ReactNode } from "react";
+import "../scope-DkO-RIMy.cjs";
+import { Constrain, Duration, GetKeys, Join, MaybePromise, Object_, Path as Path$1, PathAsString, Selector, Store, Update, Value, WildcardPathAsString, WildcardValue } from "../store-B3PWCx63.cjs";
+import { ScopeProps, ScopeProvider, UseCacheArray, UseCacheValue, UseStoreOptions, cacheMethods, scopeMethods, storeMethods, useCache, useScope, useStore } from "../storeMethods-Dt_mJTe3.cjs";
+import { Component, ComponentPropsWithoutRef, Context, FormEvent, FunctionComponent, HTMLProps, ReactNode } from "react";
 
 //#region src/react/form/customInput.d.ts
 interface CustomInputProps extends React.HTMLAttributes<HTMLDivElement> {
@@ -223,34 +223,6 @@ declare function LoadingBoundary({
 }: LoadingBoundaryProps): React.JSX.Element;
 declare function useLoadingBoundary(isLoading: boolean | undefined, label?: ReactNode): void;
 //#endregion
-//#region src/react/url/urlContext.d.ts
-type Location = string | {
-  pathname: string;
-  search: string;
-  hash: string;
-};
-interface UrlContextType {
-  location: Location;
-  navigate: (navigate: (from: Location) => string) => void;
-}
-type UrlContextProviderProps = {
-  children?: ReactNode;
-} & ({
-  location: UrlContextType["location"];
-} | {
-  locationHook: () => UrlContextType["location"];
-}) & ({
-  navigate: UrlContextType["navigate"];
-} | {
-  navigateHook: () => UrlContextType["navigate"];
-});
-declare const UrlContext: Context<UrlContextType | undefined>;
-declare function UrlProvider({
-  children,
-  ...props
-}: UrlContextProviderProps): React$1.JSX.Element;
-declare function useUrlContext(): UrlContextType;
-//#endregion
 //#region src/react/url/urlOptions.d.ts
 interface UrlOptions<T> {
   key: string;
@@ -263,6 +235,7 @@ interface UrlOptions<T> {
   persist?: {
     id: string;
   } | null;
+  path?: string | RegExp | (string | RegExp)[] | null;
 }
 interface UrlOptionsWithoutDefaults<T> extends Omit<UrlOptions<T | undefined>, "defaultValue"> {
   defaultValue?: T | undefined;
@@ -270,21 +243,26 @@ interface UrlOptionsWithoutDefaults<T> extends Omit<UrlOptions<T | undefined>, "
 declare function createUrlOptions<T>(options: UrlOptions<T>): Required<UrlOptions<T>>;
 declare function createUrlOptions<T>(options: UrlOptionsWithoutDefaults<T>): Required<UrlOptions<T | undefined>>;
 //#endregion
-//#region src/react/url/urlStore.d.ts
-declare class UrlStore<T> {
-  readonly options: Required<UrlOptions<T>>;
-  constructor(options: Required<UrlOptions<T>>);
-  useStore(): T;
-  useProp(): [T, update: UpdateFunction<T>];
-  parse(location: Location): T | undefined;
+//#region src/react/url/urlParamStore.d.ts
+declare const urlStore: Store<string>;
+declare class UrlParamStore<T> extends Store<T> {
+  readonly urlOptions: Required<UrlOptions<T>>;
+  private lastHref?;
+  private lastStorageValue?;
+  private lastValue?;
+  private storageKey;
+  constructor(urlOptions: Required<UrlOptions<T>>);
+  private getUrlValue;
+  private getStorageValue;
+  private isPathActive;
+  private calc;
+  private updateUrl;
+  private updateStorage;
+  set(update: Update<T>): void;
+  set<const P>(path: Constrain<P, Path$1<T>>, update: Update<Value<T, P>>): void;
 }
-declare function createUrlStore<T>(options: UrlOptions<T>): UrlStore<T>;
-declare function createUrlStore<T>(options: UrlOptionsWithoutDefaults<T>): UrlStore<T | undefined>;
-//#endregion
-//#region src/react/url/useUrlParam.d.ts
-declare function useUrlParam<T>(store: UrlStore<T>): [T, update: UpdateFunction<T>];
-declare function useUrlParam<T>(options: UrlOptions<T>): [T, update: UpdateFunction<T>];
-declare function useUrlParam<T>(options: UrlOptionsWithoutDefaults<T>): [T | undefined, update: UpdateFunction<T | undefined>];
+declare function createUrlParam<T>(options: UrlOptions<T>): UrlParamStore<T>;
+declare function createUrlParam<T>(options: UrlOptionsWithoutDefaults<T>): UrlParamStore<T | undefined>;
 //#endregion
 //#region src/react/useDecoupledState.d.ts
 interface UseDecoupledStateOptions<T> {
@@ -299,5 +277,5 @@ declare function useProp<T, S>(store: Store<T>, selector: Selector<T, S>, update
 declare function useProp<T, const P>(store: Store<T>, selector: Constrain<P, Path$1<T>>, options?: UseStoreOptions<Value<T, P>>): [value: Value<T, P>, setValue: Store<Value<T, P>>["set"]];
 declare function useProp<T>(store: Store<T>, options?: UseStoreOptions<T>): [value: T, setValue: Store<T>["set"]];
 //#endregion
-export { CustomInput, CustomInputProps, Field, Form, FormContext, FormDerivedState, FormFieldComponent, FormFieldComponentProps, FormFieldInfos, FormFieldProps, FormFieldPropsWithComponent, FormFieldPropsWithRender, FormInstance, FormOptions, FormState, LoadingBoundary, type LoadingBoundaryEntry, type LoadingBoundaryProps, type ScopeProps, ScopeProvider, Transform, UrlContext, type UrlContextProviderProps, type UrlContextType, type UrlOptions, type UrlOptionsWithoutDefaults, UrlProvider, type UrlStore, type UseCacheArray, type UseCacheValue, type UseDecoupledStateOptions, type UseStoreOptions, Validation, Validations, cacheMethods, createForm, createUrlOptions, createUrlStore, scopeMethods, storeMethods, useCache, useDecoupledState, useLoadingBoundary, useProp, useScope, useStore, useUrlContext, useUrlParam };
+export { CustomInput, CustomInputProps, Field, Form, FormContext, FormDerivedState, FormFieldComponent, FormFieldComponentProps, FormFieldInfos, FormFieldProps, FormFieldPropsWithComponent, FormFieldPropsWithRender, FormInstance, FormOptions, FormState, LoadingBoundary, type LoadingBoundaryEntry, type LoadingBoundaryProps, type ScopeProps, ScopeProvider, Transform, type UrlOptions, type UrlOptionsWithoutDefaults, type UrlParamStore, type UseCacheArray, type UseCacheValue, type UseDecoupledStateOptions, type UseStoreOptions, Validation, Validations, cacheMethods, createForm, createUrlOptions, createUrlParam, scopeMethods, storeMethods, urlStore, useCache, useDecoupledState, useLoadingBoundary, useProp, useScope, useStore };
 //# sourceMappingURL=index.d.cts.map

package/dist/react/index.d.ts

@@ -1,7 +1,7 @@
-import "../scope-BbUXgNW_.js";
-import { Constrain, Duration, GetKeys, Join, MaybePromise, Object_, Path as Path$1, PathAsString, Selector, Store, Update, UpdateFunction, Value, WildcardPathAsString, WildcardValue } from "../store-DKaeE840.js";
-import { ScopeProps, ScopeProvider, UseCacheArray, UseCacheValue, UseStoreOptions, cacheMethods, scopeMethods, storeMethods, useCache, useScope, useStore } from "../storeMethods-DWKSveN0.js";
-import React$1, { Component, ComponentPropsWithoutRef, Context, FormEvent, FunctionComponent, HTMLProps, ReactNode } from "react";
+import "../scope-ByLCVzKk.js";
+import { Constrain, Duration, GetKeys, Join, MaybePromise, Object_, Path as Path$1, PathAsString, Selector, Store, Update, Value, WildcardPathAsString, WildcardValue } from "../store-BJWoRQIs.js";
+import { ScopeProps, ScopeProvider, UseCacheArray, UseCacheValue, UseStoreOptions, cacheMethods, scopeMethods, storeMethods, useCache, useScope, useStore } from "../storeMethods-wsbbfJzY.js";
+import { Component, ComponentPropsWithoutRef, Context, FormEvent, FunctionComponent, HTMLProps, ReactNode } from "react";
 
 //#region src/react/form/customInput.d.ts
 interface CustomInputProps extends React.HTMLAttributes<HTMLDivElement> {
@@ -223,34 +223,6 @@ declare function LoadingBoundary({
 }: LoadingBoundaryProps): React.JSX.Element;
 declare function useLoadingBoundary(isLoading: boolean | undefined, label?: ReactNode): void;
 //#endregion
-//#region src/react/url/urlContext.d.ts
-type Location = string | {
-  pathname: string;
-  search: string;
-  hash: string;
-};
-interface UrlContextType {
-  location: Location;
-  navigate: (navigate: (from: Location) => string) => void;
-}
-type UrlContextProviderProps = {
-  children?: ReactNode;
-} & ({
-  location: UrlContextType["location"];
-} | {
-  locationHook: () => UrlContextType["location"];
-}) & ({
-  navigate: UrlContextType["navigate"];
-} | {
-  navigateHook: () => UrlContextType["navigate"];
-});
-declare const UrlContext: Context<UrlContextType | undefined>;
-declare function UrlProvider({
-  children,
-  ...props
-}: UrlContextProviderProps): React$1.JSX.Element;
-declare function useUrlContext(): UrlContextType;
-//#endregion
 //#region src/react/url/urlOptions.d.ts
 interface UrlOptions<T> {
   key: string;
@@ -263,6 +235,7 @@ interface UrlOptions<T> {
   persist?: {
     id: string;
   } | null;
+  path?: string | RegExp | (string | RegExp)[] | null;
 }
 interface UrlOptionsWithoutDefaults<T> extends Omit<UrlOptions<T | undefined>, "defaultValue"> {
   defaultValue?: T | undefined;
@@ -270,21 +243,26 @@ interface UrlOptionsWithoutDefaults<T> extends Omit<UrlOptions<T | undefined>, "
 declare function createUrlOptions<T>(options: UrlOptions<T>): Required<UrlOptions<T>>;
 declare function createUrlOptions<T>(options: UrlOptionsWithoutDefaults<T>): Required<UrlOptions<T | undefined>>;
 //#endregion
-//#region src/react/url/urlStore.d.ts
-declare class UrlStore<T> {
-  readonly options: Required<UrlOptions<T>>;
-  constructor(options: Required<UrlOptions<T>>);
-  useStore(): T;
-  useProp(): [T, update: UpdateFunction<T>];
-  parse(location: Location): T | undefined;
+//#region src/react/url/urlParamStore.d.ts
+declare const urlStore: Store<string>;
+declare class UrlParamStore<T> extends Store<T> {
+  readonly urlOptions: Required<UrlOptions<T>>;
+  private lastHref?;
+  private lastStorageValue?;
+  private lastValue?;
+  private storageKey;
+  constructor(urlOptions: Required<UrlOptions<T>>);
+  private getUrlValue;
+  private getStorageValue;
+  private isPathActive;
+  private calc;
+  private updateUrl;
+  private updateStorage;
+  set(update: Update<T>): void;
+  set<const P>(path: Constrain<P, Path$1<T>>, update: Update<Value<T, P>>): void;
 }
-declare function createUrlStore<T>(options: UrlOptions<T>): UrlStore<T>;
-declare function createUrlStore<T>(options: UrlOptionsWithoutDefaults<T>): UrlStore<T | undefined>;
-//#endregion
-//#region src/react/url/useUrlParam.d.ts
-declare function useUrlParam<T>(store: UrlStore<T>): [T, update: UpdateFunction<T>];
-declare function useUrlParam<T>(options: UrlOptions<T>): [T, update: UpdateFunction<T>];
-declare function useUrlParam<T>(options: UrlOptionsWithoutDefaults<T>): [T | undefined, update: UpdateFunction<T | undefined>];
+declare function createUrlParam<T>(options: UrlOptions<T>): UrlParamStore<T>;
+declare function createUrlParam<T>(options: UrlOptionsWithoutDefaults<T>): UrlParamStore<T | undefined>;
 //#endregion
 //#region src/react/useDecoupledState.d.ts
 interface UseDecoupledStateOptions<T> {
@@ -299,5 +277,5 @@ declare function useProp<T, S>(store: Store<T>, selector: Selector<T, S>, update
 declare function useProp<T, const P>(store: Store<T>, selector: Constrain<P, Path$1<T>>, options?: UseStoreOptions<Value<T, P>>): [value: Value<T, P>, setValue: Store<Value<T, P>>["set"]];
 declare function useProp<T>(store: Store<T>, options?: UseStoreOptions<T>): [value: T, setValue: Store<T>["set"]];
 //#endregion
-export { CustomInput, CustomInputProps, Field, Form, FormContext, FormDerivedState, FormFieldComponent, FormFieldComponentProps, FormFieldInfos, FormFieldProps, FormFieldPropsWithComponent, FormFieldPropsWithRender, FormInstance, FormOptions, FormState, LoadingBoundary, type LoadingBoundaryEntry, type LoadingBoundaryProps, type ScopeProps, ScopeProvider, Transform, UrlContext, type UrlContextProviderProps, type UrlContextType, type UrlOptions, type UrlOptionsWithoutDefaults, UrlProvider, type UrlStore, type UseCacheArray, type UseCacheValue, type UseDecoupledStateOptions, type UseStoreOptions, Validation, Validations, cacheMethods, createForm, createUrlOptions, createUrlStore, scopeMethods, storeMethods, useCache, useDecoupledState, useLoadingBoundary, useProp, useScope, useStore, useUrlContext, useUrlParam };
+export { CustomInput, CustomInputProps, Field, Form, FormContext, FormDerivedState, FormFieldComponent, FormFieldComponentProps, FormFieldInfos, FormFieldProps, FormFieldPropsWithComponent, FormFieldPropsWithRender, FormInstance, FormOptions, FormState, LoadingBoundary, type LoadingBoundaryEntry, type LoadingBoundaryProps, type ScopeProps, ScopeProvider, Transform, type UrlOptions, type UrlOptionsWithoutDefaults, type UrlParamStore, type UseCacheArray, type UseCacheValue, type UseDecoupledStateOptions, type UseStoreOptions, Validation, Validations, cacheMethods, createForm, createUrlOptions, createUrlParam, scopeMethods, storeMethods, urlStore, useCache, useDecoupledState, useLoadingBoundary, useProp, useScope, useStore };
 //# sourceMappingURL=index.d.ts.map

package/dist/react/index.js

@@ -1,9 +1,9 @@
-import { autobind, calcDuration, createStore, debounce, queue, throttle } from "../store-BpMJxIHt.js";
+import { Store, autobind, calcDuration, createStore, debounce, queue, throttle } from "../store-DOEc60aP.js";
 import { castArrayPath, deepEqual, get, isObject, join, set } from "../propAccess-B260LXN1.js";
 import { simpleHash } from "../hash-DNFM5y_h.js";
 import { fromExtendedJsonString, toExtendedJsonString } from "../extendedJson-BZkQBXEv.js";
-import { LoadingBoundary, ScopeProvider, cacheMethods, scopeMethods, storeMethods, useCache, useLoadingBoundary, useProp, useScope, useStore } from "../storeMethods-CkvcMFoL.js";
-import React, { Fragment, createContext, createElement, startTransition, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
+import { LoadingBoundary, ScopeProvider, cacheMethods, scopeMethods, storeMethods, useCache, useLoadingBoundary, useProp, useScope, useStore } from "../storeMethods-C7bswcgj.js";
+import { Fragment, createContext, createElement, startTransition, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/react/form/customInput.tsx
@@ -464,23 +464,9 @@ function createForm(options) {
 }
 
 //#endregion
-//#region src/react/url/urlContext.tsx
-const UrlContext = createContext(void 0);
-function UrlProvider({ children,...props }) {
-	const location = "location" in props ? props.location : props.locationHook();
-	const navigate = "navigate" in props ? props.navigate : props.navigateHook();
-	return /* @__PURE__ */ jsx(UrlContext.Provider, {
-		value: {
-			location,
-			navigate
-		},
-		children
-	});
-}
-function useUrlContext() {
-	const context = useContext(UrlContext);
-	if (!context) throw new Error("useUrlContext must be used within a UrlContextProvider");
-	return context;
+//#region src/lib/castArray.ts
+function castArray(value) {
+	return Array.isArray(value) ? value : [value];
 }
 
 //#endregion
@@ -496,17 +482,14 @@ function defaultDeserializer(value) {
 function defaultSerializer(value) {
 	return toExtendedJsonString(value);
 }
-function parseLocation(location) {
-	if (typeof location !== "string") location = `${location.pathname}${location.search}${location.hash}`;
-	return new URL(location, window.location.origin);
-}
-function createStorageKey(id, key) {
-	return `cross-state:url:${id}:${key}`;
+function normalizePath(path) {
+	if (typeof path === "string") return path.replace(/^\//g, "").replace(/\/$/g, "");
+	return path;
 }
 
 //#endregion
 //#region src/react/url/urlOptions.ts
-function createUrlOptions({ key, type = "hash", serialize = defaultSerializer, deserialize = defaultDeserializer, defaultValue = void 0, writeDefaultValue = false, onCommit = () => void 0, persist = null }) {
+function createUrlOptions({ key, type = "hash", serialize = defaultSerializer, deserialize = defaultDeserializer, defaultValue = void 0, writeDefaultValue = false, onCommit = () => void 0, persist = null, path = null }) {
 	return {
 		key,
 		type,
@@ -515,69 +498,134 @@ function createUrlOptions({ key, type = "hash", serialize = defaultSerializer, d
 		defaultValue,
 		writeDefaultValue,
 		onCommit,
-		persist
+		persist,
+		path: path === null ? null : castArray(path).map(normalizePath)
 	};
 }
 
 //#endregion
-//#region src/react/url/useUrlParam.ts
-function useUrlParam(input) {
-	const { key, type, serialize, deserialize, defaultValue, writeDefaultValue, onCommit, persist } = createUrlOptions("options" in input ? input.options : input);
-	const { location, navigate } = useUrlContext();
-	const url = parseLocation(location);
-	const params = new URLSearchParams(url[type].slice(1));
-	const urlValue = params.get(key);
-	const storageKey = persist && createStorageKey(persist.id, key);
-	const storageValue = storageKey ? localStorage.getItem(storageKey) : null;
-	const value = useMemo(() => urlValue !== null ? deserialize(urlValue) : storageValue !== null ? deserialize(storageValue) : defaultValue, [urlValue]);
-	function commit(value$1) {
-		const serializedValue = serialize(value$1);
-		navigate((location$1) => {
-			const url$1 = parseLocation(location$1);
-			const params$1 = new URLSearchParams(url$1[type].slice(1));
-			if (!writeDefaultValue && serializedValue === serialize(defaultValue)) params$1.delete(key);
-			else params$1.set(key, serializedValue);
-			url$1[type] = params$1.toString();
-			return url$1.toString().replace(window.location.origin, "");
+//#region src/react/url/urlParamStore.ts
+const urlStore = createStore(() => window.location.href, {
+	cacheValue: false,
+	effect() {
+		const update = () => {
+			if (window.location.href !== this.calculatedValue?.value) this.invalidate();
+		};
+		const interval = setInterval(update, 1);
+		window.addEventListener("popstate", update);
+		return () => {
+			clearInterval(interval);
+			window.removeEventListener("popstate", update);
+		};
+	}
+});
+var UrlParamStore = class UrlParamStore extends Store {
+	constructor(urlOptions) {
+		super(() => this.calc(), { cacheValue: false });
+		this.urlOptions = urlOptions;
+		autobind(UrlParamStore);
+		this.storageKey = urlOptions.persist && createStorageKey(urlOptions.persist.id, urlOptions.key);
+		this.addEffect(() => {
+			let isActive = false;
+			let urlValue = this.getUrlValue();
+			let storageValue = this.getStorageValue();
+			const update = () => {
+				const oldIsActive = isActive;
+				isActive = this.isPathActive();
+				const oldUrlValue = urlValue;
+				urlValue = this.getUrlValue();
+				const oldStorageValue = storageValue;
+				storageValue = this.getStorageValue();
+				if (!isActive) return;
+				if (isActive === oldIsActive && urlValue === oldUrlValue && storageValue === oldStorageValue) return;
+				this.invalidate();
+				if (!oldIsActive) {
+					if (urlValue !== null) this.updateStorage(this.urlOptions.deserialize(urlValue));
+					else if (storageValue !== null) this.updateUrl(this.urlOptions.deserialize(storageValue));
+					else if (this.urlOptions.writeDefaultValue) {
+						this.updateUrl(this.urlOptions.defaultValue);
+						this.updateStorage(this.urlOptions.defaultValue);
+					}
+				} else if (urlValue !== oldUrlValue) {
+					if (urlValue === null && this.urlOptions.writeDefaultValue) this.updateUrl(this.urlOptions.defaultValue);
+					this.updateStorage();
+				} else if (storageValue !== null) {
+					if (storageValue === null && this.urlOptions.writeDefaultValue) this.updateUrl(this.urlOptions.defaultValue);
+					this.updateUrl(this.urlOptions.deserialize(storageValue));
+				}
+			};
+			const cancel = urlStore.subscribe(update);
+			window.addEventListener("storage", update);
+			return () => {
+				cancel();
+				window.removeEventListener("storage", update);
+			};
 		});
-		if (storageKey) localStorage.setItem(storageKey, serializedValue);
-		onCommit?.(value$1);
 	}
-	function update(update$1) {
-		if (update$1 instanceof Function) update$1 = update$1(value);
-		commit(update$1);
+	getUrlValue() {
+		const href = urlStore.get();
+		const url = new URL(href);
+		const params = new URLSearchParams(url[this.urlOptions.type].slice(1) || "");
+		return params.get(this.urlOptions.key);
 	}
-	useEffect(() => {
-		if (urlValue !== null) commit(deserialize(urlValue));
-	}, [urlValue]);
-	useEffect(() => {
-		if (urlValue === null && storageValue !== null) commit(deserialize(storageValue));
-		else if (urlValue === null && writeDefaultValue) commit(defaultValue);
-	}, []);
-	return [value, update];
-}
-
-//#endregion
-//#region src/react/url/urlStore.ts
-var UrlStore = class {
-	constructor(options) {
-		this.options = options;
+	getStorageValue() {
+		return this.storageKey !== null ? localStorage.getItem(this.storageKey) : null;
 	}
-	useStore() {
-		return useUrlParam(this)[0];
+	isPathActive() {
+		if (this.urlOptions.path === null) return true;
+		const path = normalizePath(window.location.pathname);
+		return castArray(this.urlOptions.path).some((p) => {
+			if (typeof p === "string") return !p || p === path || path.startsWith(p + "/");
+			return p.test(path);
+		});
+	}
+	calc() {
+		let href = window.location.href;
+		const storageValue = this.storageKey !== null ? localStorage.getItem(this.storageKey) : null;
+		if (!this.isPathActive() && this.lastHref !== void 0) href = this.lastHref;
+		if (this.lastHref === href && this.lastStorageValue === storageValue) return this.lastValue;
+		const url = new URL(href);
+		const params = new URLSearchParams(url[this.urlOptions.type].slice(1));
+		const urlValue = params.get(this.urlOptions.key);
+		const value = urlValue !== null ? this.urlOptions.deserialize(urlValue) : this.storageKey !== null && storageValue !== null ? this.urlOptions.deserialize(storageValue) : this.urlOptions.defaultValue;
+		this.lastHref = href;
+		this.lastStorageValue = storageValue;
+		this.lastValue = value;
+		return value;
+	}
+	updateUrl(value = this.calc()) {
+		const serializedValue = this.urlOptions.serialize(value);
+		const url = new URL(window.location.href);
+		const params = new URLSearchParams(url[this.urlOptions.type].slice(1));
+		if (!this.urlOptions.writeDefaultValue && serializedValue === this.urlOptions.serialize(this.urlOptions.defaultValue)) params.delete(this.urlOptions.key);
+		else params.set(this.urlOptions.key, serializedValue);
+		url[this.urlOptions.type] = params.toString();
+		window.history.replaceState(window.history.state, "", url.toString());
+		window.dispatchEvent(new PopStateEvent("popstate"));
 	}
-	useProp() {
-		return useUrlParam(this);
+	updateStorage(value = this.calc()) {
+		if (this.storageKey === null) return;
+		const serializedValue = this.urlOptions.serialize(value);
+		localStorage.setItem(this.storageKey, serializedValue);
 	}
-	parse(location) {
-		const url = parseLocation(location);
-		const params = new URLSearchParams(url[this.options.type].slice(1));
-		const urlValue = params.get(this.options.key);
-		return urlValue !== null ? this.options.deserialize(urlValue) : void 0;
+	set(...args) {
+		const path = args.length > 1 ? args[0] : [];
+		let update = args.length > 1 ? args[1] : args[0];
+		if (update instanceof Function) {
+			const before = this.get();
+			const valueBefore = get(before, path);
+			const valueAfter = update(valueBefore);
+			update = set(before, path, valueAfter);
+		} else if (path.length > 0) update = set(this.get(), path, update);
+		if (this.isPathActive()) this.updateUrl(update);
+		else this.updateStorage(update);
 	}
 };
-function createUrlStore(options) {
-	return new UrlStore(createUrlOptions(options));
+function createUrlParam(options) {
+	return new UrlParamStore(createUrlOptions(options));
+}
+function createStorageKey(id, key) {
+	return `cross-state:url:${id}:${key}`;
 }
 
 //#endregion
@@ -614,5 +662,5 @@ function useDecoupledState(value, onChange, options = {}) {
 }
 
 //#endregion
-export { CustomInput, Form, LoadingBoundary, ScopeProvider, UrlContext, UrlProvider, cacheMethods, createForm, createUrlOptions, createUrlStore, scopeMethods, storeMethods, useCache, useDecoupledState, useLoadingBoundary, useProp, useScope, useStore, useUrlContext, useUrlParam };
+export { CustomInput, Form, LoadingBoundary, ScopeProvider, cacheMethods, createForm, createUrlOptions, createUrlParam, scopeMethods, storeMethods, urlStore, useCache, useDecoupledState, useLoadingBoundary, useProp, useScope, useStore };
 //# sourceMappingURL=index.js.map