@alepha/react 0.13.1 → 0.13.2

package/dist/core/index.native.js

@@ -0,0 +1,381 @@
+import { $module, AlephaError, Atom } from "alepha";
+import { AlephaDateTime, DateTimeProvider } from "alepha/datetime";
+import { AlephaServerLinks, LinkProvider } from "alepha/server/links";
+import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
+import { HttpClient } from "alepha/server";
+
+//#region src/core/contexts/AlephaContext.ts
+const AlephaContext = createContext(void 0);
+
+//#endregion
+//#region src/core/hooks/useAlepha.ts
+/**
+* Main Alepha hook.
+*
+* It provides access to the Alepha instance within a React component.
+*
+* With Alepha, you can access the core functionalities of the framework:
+*
+* - alepha.state() for state management
+* - alepha.inject() for dependency injection
+* - alepha.events.emit() for event handling
+* etc...
+*/
+const useAlepha = () => {
+	const alepha = useContext(AlephaContext);
+	if (!alepha) throw new AlephaError("Hook 'useAlepha()' must be used within an AlephaContext.Provider");
+	return alepha;
+};
+
+//#endregion
+//#region src/core/hooks/useInject.ts
+/**
+* Hook to inject a service instance.
+* It's a wrapper of `useAlepha().inject(service)` with a memoization.
+*/
+const useInject = (service) => {
+	const alepha = useAlepha();
+	return useMemo(() => alepha.inject(service), []);
+};
+
+//#endregion
+//#region src/core/hooks/useAction.ts
+/**
+* Hook for handling async actions with automatic error handling and event emission.
+*
+* By default, prevents concurrent executions - if an action is running and you call it again,
+* the second call will be ignored. Use `debounce` option to delay execution instead.
+*
+* Emits lifecycle events:
+* - `react:action:begin` - When action starts
+* - `react:action:success` - When action completes successfully
+* - `react:action:error` - When action throws an error
+* - `react:action:end` - Always emitted at the end
+*
+* @example Basic usage
+* ```tsx
+* const action = useAction({
+*   handler: async (data) => {
+*     await api.save(data);
+*   }
+* }, []);
+*
+* <button onClick={() => action.run(data)} disabled={action.loading}>
+*   Save
+* </button>
+* ```
+*
+* @example With debounce (search input)
+* ```tsx
+* const search = useAction({
+*   handler: async (query: string) => {
+*     await api.search(query);
+*   },
+*   debounce: 300 // Wait 300ms after last call
+* }, []);
+*
+* <input onChange={(e) => search.run(e.target.value)} />
+* ```
+*
+* @example Run on component mount
+* ```tsx
+* const fetchData = useAction({
+*   handler: async () => {
+*     const data = await api.getData();
+*     return data;
+*   },
+*   runOnInit: true // Runs once when component mounts
+* }, []);
+* ```
+*
+* @example Run periodically (polling)
+* ```tsx
+* const pollStatus = useAction({
+*   handler: async () => {
+*     const status = await api.getStatus();
+*     return status;
+*   },
+*   runEvery: 5000 // Run every 5 seconds
+* }, []);
+*
+* // Or with duration tuple
+* const pollStatus = useAction({
+*   handler: async () => {
+*     const status = await api.getStatus();
+*     return status;
+*   },
+*   runEvery: [30, 'seconds'] // Run every 30 seconds
+* }, []);
+* ```
+*
+* @example With AbortController
+* ```tsx
+* const fetch = useAction({
+*   handler: async (url, { signal }) => {
+*     const response = await fetch(url, { signal });
+*     return response.json();
+*   }
+* }, []);
+* // Automatically cancelled on unmount or when new request starts
+* ```
+*
+* @example With error handling
+* ```tsx
+* const deleteAction = useAction({
+*   handler: async (id: string) => {
+*     await api.delete(id);
+*   },
+*   onError: (error) => {
+*     if (error.code === 'NOT_FOUND') {
+*       // Custom error handling
+*     }
+*   }
+* }, []);
+*
+* {deleteAction.error && <div>Error: {deleteAction.error.message}</div>}
+* ```
+*
+* @example Global error handling
+* ```tsx
+* // In your root app setup
+* alepha.events.on("react:action:error", ({ error }) => {
+*   toast.danger(error.message);
+*   Sentry.captureException(error);
+* });
+* ```
+*/
+function useAction(options, deps) {
+	const alepha = useAlepha();
+	const dateTimeProvider = useInject(DateTimeProvider);
+	const [loading, setLoading] = useState(false);
+	const [error, setError] = useState();
+	const isExecutingRef = useRef(false);
+	const debounceTimerRef = useRef(void 0);
+	const abortControllerRef = useRef(void 0);
+	const isMountedRef = useRef(true);
+	const intervalRef = useRef(void 0);
+	useEffect(() => {
+		return () => {
+			isMountedRef.current = false;
+			if (debounceTimerRef.current) {
+				dateTimeProvider.clearTimeout(debounceTimerRef.current);
+				debounceTimerRef.current = void 0;
+			}
+			if (intervalRef.current) {
+				dateTimeProvider.clearInterval(intervalRef.current);
+				intervalRef.current = void 0;
+			}
+			if (abortControllerRef.current) {
+				abortControllerRef.current.abort();
+				abortControllerRef.current = void 0;
+			}
+		};
+	}, []);
+	const executeAction = useCallback(async (...args) => {
+		if (isExecutingRef.current) return;
+		if (abortControllerRef.current) abortControllerRef.current.abort();
+		const abortController = new AbortController();
+		abortControllerRef.current = abortController;
+		isExecutingRef.current = true;
+		setLoading(true);
+		setError(void 0);
+		await alepha.events.emit("react:action:begin", {
+			type: "custom",
+			id: options.id
+		});
+		try {
+			const result = await options.handler(...args, { signal: abortController.signal });
+			if (!isMountedRef.current || abortController.signal.aborted) return;
+			await alepha.events.emit("react:action:success", {
+				type: "custom",
+				id: options.id
+			});
+			if (options.onSuccess) await options.onSuccess(result);
+			return result;
+		} catch (err) {
+			if (err instanceof Error && err.name === "AbortError") return;
+			if (!isMountedRef.current) return;
+			const error$1 = err;
+			setError(error$1);
+			await alepha.events.emit("react:action:error", {
+				type: "custom",
+				id: options.id,
+				error: error$1
+			});
+			if (options.onError) await options.onError(error$1);
+			else throw error$1;
+		} finally {
+			isExecutingRef.current = false;
+			setLoading(false);
+			await alepha.events.emit("react:action:end", {
+				type: "custom",
+				id: options.id
+			});
+			if (abortControllerRef.current === abortController) abortControllerRef.current = void 0;
+		}
+	}, [
+		...deps,
+		options.id,
+		options.onError,
+		options.onSuccess
+	]);
+	const handler = useCallback(async (...args) => {
+		if (options.debounce) {
+			if (debounceTimerRef.current) dateTimeProvider.clearTimeout(debounceTimerRef.current);
+			return new Promise((resolve) => {
+				debounceTimerRef.current = dateTimeProvider.createTimeout(async () => {
+					resolve(await executeAction(...args));
+				}, options.debounce ?? 0);
+			});
+		}
+		return executeAction(...args);
+	}, [executeAction, options.debounce]);
+	const cancel = useCallback(() => {
+		if (debounceTimerRef.current) {
+			dateTimeProvider.clearTimeout(debounceTimerRef.current);
+			debounceTimerRef.current = void 0;
+		}
+		if (abortControllerRef.current) {
+			abortControllerRef.current.abort();
+			abortControllerRef.current = void 0;
+		}
+		if (isMountedRef.current) {
+			isExecutingRef.current = false;
+			setLoading(false);
+		}
+	}, []);
+	useEffect(() => {
+		if (options.runOnInit) handler(...[]);
+	}, deps);
+	useEffect(() => {
+		if (!options.runEvery) return;
+		intervalRef.current = dateTimeProvider.createInterval(() => handler(...[]), options.runEvery, true);
+		return () => {
+			if (intervalRef.current) {
+				dateTimeProvider.clearInterval(intervalRef.current);
+				intervalRef.current = void 0;
+			}
+		};
+	}, [handler, options.runEvery]);
+	return {
+		run: handler,
+		loading,
+		error,
+		cancel
+	};
+}
+
+//#endregion
+//#region src/core/hooks/useClient.ts
+/**
+* Hook to get a virtual client for the specified scope.
+*
+* It's the React-hook version of `$client()`, from `AlephaServerLinks` module.
+*/
+const useClient = (scope) => {
+	return useInject(LinkProvider).client(scope);
+};
+
+//#endregion
+//#region src/core/hooks/useEvents.ts
+/**
+* Allow subscribing to multiple Alepha events. See {@link Hooks} for available events.
+*
+* useEvents is fully typed to ensure correct event callback signatures.
+*
+* @example
+* ```tsx
+* useEvents(
+*   {
+*     "react:transition:begin": (ev) => {
+*       console.log("Transition began to:", ev.to);
+*     },
+*     "react:transition:error": {
+*       priority: "first",
+*       callback: (ev) => {
+*         console.error("Transition error:", ev.error);
+*       },
+*     },
+*   },
+*   [],
+* );
+* ```
+*/
+const useEvents = (opts, deps) => {
+	const alepha = useAlepha();
+	useEffect(() => {
+		if (!alepha.isBrowser()) return;
+		const subs = [];
+		for (const [name, hook] of Object.entries(opts)) subs.push(alepha.events.on(name, hook));
+		return () => {
+			for (const clear of subs) clear();
+		};
+	}, deps);
+};
+
+//#endregion
+//#region src/core/hooks/useSchema.ts
+const useSchema = (action) => {
+	const name = action.name;
+	const alepha = useAlepha();
+	const httpClient = useInject(HttpClient);
+	const [schema, setSchema] = useState(ssrSchemaLoading(alepha, name));
+	useEffect(() => {
+		if (!schema.loading) return;
+		httpClient.fetch(`${LinkProvider.path.apiLinks}/${name}/schema`, { localCache: true }).then((it) => setSchema(it.data));
+	}, [name]);
+	return schema;
+};
+/**
+* Get an action schema during server-side rendering (SSR) or client-side rendering (CSR).
+*/
+const ssrSchemaLoading = (alepha, name) => {
+	if (!alepha.isBrowser()) {
+		const linkProvider = alepha.inject(LinkProvider);
+		const can = linkProvider.getServerLinks().find((link) => link.name === name);
+		if (can) {
+			const schema$1 = linkProvider.links.find((it) => it.name === name)?.schema;
+			if (schema$1) {
+				can.schema = schema$1;
+				return schema$1;
+			}
+		}
+		return { loading: true };
+	}
+	const schema = alepha.inject(LinkProvider).links.find((it) => it.name === name)?.schema;
+	if (schema) return schema;
+	return { loading: true };
+};
+
+//#endregion
+//#region src/core/hooks/useStore.ts
+function useStore(target, defaultValue) {
+	const alepha = useAlepha();
+	useMemo(() => {
+		if (defaultValue != null && alepha.store.get(target) == null) alepha.store.set(target, defaultValue);
+	}, [defaultValue]);
+	const [state, setState] = useState(alepha.store.get(target));
+	useEffect(() => {
+		if (!alepha.isBrowser()) return;
+		const key = target instanceof Atom ? target.key : target;
+		return alepha.events.on("state:mutate", (ev) => {
+			if (ev.key === key) setState(ev.value);
+		});
+	}, []);
+	return [state, (value) => {
+		alepha.store.set(target, value);
+	}];
+}
+
+//#endregion
+//#region src/core/index.native.ts
+const AlephaReact = $module({
+	name: "alepha.react",
+	primitives: [],
+	services: [],
+	register: (alepha) => alepha.with(AlephaDateTime).with(AlephaServerLinks)
+});
+
+//#endregion
+export { AlephaContext, AlephaReact, ssrSchemaLoading, useAction, useAlepha, useClient, useEvents, useInject, useSchema, useStore };
+//# sourceMappingURL=index.native.js.map

package/dist/core/index.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.native.js","names":["error","subs: Function[]","schema"],"sources":["../../src/core/contexts/AlephaContext.ts","../../src/core/hooks/useAlepha.ts","../../src/core/hooks/useInject.ts","../../src/core/hooks/useAction.ts","../../src/core/hooks/useClient.ts","../../src/core/hooks/useEvents.ts","../../src/core/hooks/useSchema.ts","../../src/core/hooks/useStore.ts","../../src/core/index.native.ts"],"sourcesContent":["import type { Alepha } from \"alepha\";\nimport { createContext } from \"react\";\n\nexport const AlephaContext = createContext<Alepha | undefined>(undefined);\n","import { type Alepha, AlephaError } from \"alepha\";\nimport { useContext } from \"react\";\nimport { AlephaContext } from \"../contexts/AlephaContext.ts\";\n\n/**\n * Main Alepha hook.\n *\n * It provides access to the Alepha instance within a React component.\n *\n * With Alepha, you can access the core functionalities of the framework:\n *\n * - alepha.state() for state management\n * - alepha.inject() for dependency injection\n * - alepha.events.emit() for event handling\n * etc...\n */\nexport const useAlepha = (): Alepha => {\n  const alepha = useContext(AlephaContext);\n  if (!alepha) {\n    throw new AlephaError(\n      \"Hook 'useAlepha()' must be used within an AlephaContext.Provider\",\n    );\n  }\n\n  return alepha;\n};\n","import type { Service } from \"alepha\";\nimport { useMemo } from \"react\";\nimport { useAlepha } from \"./useAlepha.ts\";\n\n/**\n * Hook to inject a service instance.\n * It's a wrapper of `useAlepha().inject(service)` with a memoization.\n */\nexport const useInject = <T extends object>(service: Service<T>): T => {\n  const alepha = useAlepha();\n  return useMemo(() => alepha.inject(service), []);\n};\n","import {\n  DateTimeProvider,\n  type DurationLike,\n  type Interval,\n  type Timeout,\n} from \"alepha/datetime\";\nimport {\n  type DependencyList,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { useAlepha } from \"./useAlepha.ts\";\nimport { useInject } from \"./useInject.ts\";\n\n/**\n * Hook for handling async actions with automatic error handling and event emission.\n *\n * By default, prevents concurrent executions - if an action is running and you call it again,\n * the second call will be ignored. Use `debounce` option to delay execution instead.\n *\n * Emits lifecycle events:\n * - `react:action:begin` - When action starts\n * - `react:action:success` - When action completes successfully\n * - `react:action:error` - When action throws an error\n * - `react:action:end` - Always emitted at the end\n *\n * @example Basic usage\n * ```tsx\n * const action = useAction({\n *   handler: async (data) => {\n *     await api.save(data);\n *   }\n * }, []);\n *\n * <button onClick={() => action.run(data)} disabled={action.loading}>\n *   Save\n * </button>\n * ```\n *\n * @example With debounce (search input)\n * ```tsx\n * const search = useAction({\n *   handler: async (query: string) => {\n *     await api.search(query);\n *   },\n *   debounce: 300 // Wait 300ms after last call\n * }, []);\n *\n * <input onChange={(e) => search.run(e.target.value)} />\n * ```\n *\n * @example Run on component mount\n * ```tsx\n * const fetchData = useAction({\n *   handler: async () => {\n *     const data = await api.getData();\n *     return data;\n *   },\n *   runOnInit: true // Runs once when component mounts\n * }, []);\n * ```\n *\n * @example Run periodically (polling)\n * ```tsx\n * const pollStatus = useAction({\n *   handler: async () => {\n *     const status = await api.getStatus();\n *     return status;\n *   },\n *   runEvery: 5000 // Run every 5 seconds\n * }, []);\n *\n * // Or with duration tuple\n * const pollStatus = useAction({\n *   handler: async () => {\n *     const status = await api.getStatus();\n *     return status;\n *   },\n *   runEvery: [30, 'seconds'] // Run every 30 seconds\n * }, []);\n * ```\n *\n * @example With AbortController\n * ```tsx\n * const fetch = useAction({\n *   handler: async (url, { signal }) => {\n *     const response = await fetch(url, { signal });\n *     return response.json();\n *   }\n * }, []);\n * // Automatically cancelled on unmount or when new request starts\n * ```\n *\n * @example With error handling\n * ```tsx\n * const deleteAction = useAction({\n *   handler: async (id: string) => {\n *     await api.delete(id);\n *   },\n *   onError: (error) => {\n *     if (error.code === 'NOT_FOUND') {\n *       // Custom error handling\n *     }\n *   }\n * }, []);\n *\n * {deleteAction.error && <div>Error: {deleteAction.error.message}</div>}\n * ```\n *\n * @example Global error handling\n * ```tsx\n * // In your root app setup\n * alepha.events.on(\"react:action:error\", ({ error }) => {\n *   toast.danger(error.message);\n *   Sentry.captureException(error);\n * });\n * ```\n */\nexport function useAction<Args extends any[], Result = void>(\n  options: UseActionOptions<Args, Result>,\n  deps: DependencyList,\n): UseActionReturn<Args, Result> {\n  const alepha = useAlepha();\n  const dateTimeProvider = useInject(DateTimeProvider);\n  const [loading, setLoading] = useState(false);\n  const [error, setError] = useState<Error | undefined>();\n  const isExecutingRef = useRef(false);\n  const debounceTimerRef = useRef<Timeout | undefined>(undefined);\n  const abortControllerRef = useRef<AbortController | undefined>(undefined);\n  const isMountedRef = useRef(true);\n  const intervalRef = useRef<Interval | undefined>(undefined);\n\n  // Cleanup on unmount\n  useEffect(() => {\n    return () => {\n      isMountedRef.current = false;\n\n      // clear debounce timer\n      if (debounceTimerRef.current) {\n        dateTimeProvider.clearTimeout(debounceTimerRef.current);\n        debounceTimerRef.current = undefined;\n      }\n\n      // clear interval\n      if (intervalRef.current) {\n        dateTimeProvider.clearInterval(intervalRef.current);\n        intervalRef.current = undefined;\n      }\n\n      // abort in-flight request\n      if (abortControllerRef.current) {\n        abortControllerRef.current.abort();\n        abortControllerRef.current = undefined;\n      }\n    };\n  }, []);\n\n  const executeAction = useCallback(\n    async (...args: Args): Promise<Result | undefined> => {\n      // Prevent concurrent executions\n      if (isExecutingRef.current) {\n        return;\n      }\n\n      // Abort previous request if still running\n      if (abortControllerRef.current) {\n        abortControllerRef.current.abort();\n      }\n\n      // Create new AbortController for this request\n      const abortController = new AbortController();\n      abortControllerRef.current = abortController;\n\n      isExecutingRef.current = true;\n      setLoading(true);\n      setError(undefined);\n\n      await alepha.events.emit(\"react:action:begin\", {\n        type: \"custom\",\n        id: options.id,\n      });\n\n      try {\n        // Pass abort signal as last argument to handler\n        const result = await options.handler(...args, {\n          signal: abortController.signal,\n        } as any);\n\n        // Only update state if still mounted and not aborted\n        if (!isMountedRef.current || abortController.signal.aborted) {\n          return;\n        }\n\n        await alepha.events.emit(\"react:action:success\", {\n          type: \"custom\",\n          id: options.id,\n        });\n\n        if (options.onSuccess) {\n          await options.onSuccess(result);\n        }\n\n        return result;\n      } catch (err) {\n        // Ignore abort errors\n        if (err instanceof Error && err.name === \"AbortError\") {\n          return;\n        }\n\n        // Only update state if still mounted\n        if (!isMountedRef.current) {\n          return;\n        }\n\n        const error = err as Error;\n        setError(error);\n\n        await alepha.events.emit(\"react:action:error\", {\n          type: \"custom\",\n          id: options.id,\n          error,\n        });\n\n        if (options.onError) {\n          await options.onError(error);\n        } else {\n          // Re-throw if no custom error handler\n          throw error;\n        }\n      } finally {\n        isExecutingRef.current = false;\n        setLoading(false);\n\n        await alepha.events.emit(\"react:action:end\", {\n          type: \"custom\",\n          id: options.id,\n        });\n\n        // Clean up abort controller\n        if (abortControllerRef.current === abortController) {\n          abortControllerRef.current = undefined;\n        }\n      }\n    },\n    [...deps, options.id, options.onError, options.onSuccess],\n  );\n\n  const handler = useCallback(\n    async (...args: Args): Promise<Result | undefined> => {\n      if (options.debounce) {\n        // clear existing timer\n        if (debounceTimerRef.current) {\n          dateTimeProvider.clearTimeout(debounceTimerRef.current);\n        }\n\n        // Set new timer\n        return new Promise((resolve) => {\n          debounceTimerRef.current = dateTimeProvider.createTimeout(\n            async () => {\n              const result = await executeAction(...args);\n              resolve(result);\n            },\n            options.debounce ?? 0,\n          );\n        });\n      }\n\n      return executeAction(...args);\n    },\n    [executeAction, options.debounce],\n  );\n\n  const cancel = useCallback(() => {\n    // clear debounce timer\n    if (debounceTimerRef.current) {\n      dateTimeProvider.clearTimeout(debounceTimerRef.current);\n      debounceTimerRef.current = undefined;\n    }\n\n    // abort in-flight request\n    if (abortControllerRef.current) {\n      abortControllerRef.current.abort();\n      abortControllerRef.current = undefined;\n    }\n\n    // reset state\n    if (isMountedRef.current) {\n      isExecutingRef.current = false;\n      setLoading(false);\n    }\n  }, []);\n\n  // Run action on mount if runOnInit is true\n  useEffect(() => {\n    if (options.runOnInit) {\n      handler(...([] as any));\n    }\n  }, deps);\n\n  // Run action periodically if runEvery is specified\n  useEffect(() => {\n    if (!options.runEvery) {\n      return;\n    }\n\n    // Set up interval\n    intervalRef.current = dateTimeProvider.createInterval(\n      () => handler(...([] as any)),\n      options.runEvery,\n      true,\n    );\n\n    // cleanup on unmount or when runEvery changes\n    return () => {\n      if (intervalRef.current) {\n        dateTimeProvider.clearInterval(intervalRef.current);\n        intervalRef.current = undefined;\n      }\n    };\n  }, [handler, options.runEvery]);\n\n  return {\n    run: handler,\n    loading,\n    error,\n    cancel,\n  };\n}\n\n// ---------------------------------------------------------------------------------------------------------------------\n\n/**\n * Context object passed as the last argument to action handlers.\n * Contains an AbortSignal that can be used to cancel the request.\n */\nexport interface ActionContext {\n  /**\n   * AbortSignal that can be passed to fetch or other async operations.\n   * The signal will be aborted when:\n   * - The component unmounts\n   * - A new action is triggered (cancels previous)\n   * - The cancel() method is called\n   *\n   * @example\n   * ```tsx\n   * const action = useAction({\n   *   handler: async (url, { signal }) => {\n   *     const response = await fetch(url, { signal });\n   *     return response.json();\n   *   }\n   * }, []);\n   * ```\n   */\n  signal: AbortSignal;\n}\n\nexport interface UseActionOptions<Args extends any[] = any[], Result = any> {\n  /**\n   * The async action handler function.\n   * Receives the action arguments plus an ActionContext as the last parameter.\n   */\n  handler: (...args: [...Args, ActionContext]) => Promise<Result>;\n\n  /**\n   * Custom error handler. If provided, prevents default error re-throw.\n   */\n  onError?: (error: Error) => void | Promise<void>;\n\n  /**\n   * Custom success handler.\n   */\n  onSuccess?: (result: Result) => void | Promise<void>;\n\n  /**\n   * Optional identifier for this action (useful for debugging/analytics)\n   */\n  id?: string;\n\n  /**\n   * Debounce delay in milliseconds. If specified, the action will only execute\n   * after the specified delay has passed since the last call. Useful for search inputs\n   * or other high-frequency events.\n   *\n   * @example\n   * ```tsx\n   * // Execute search 300ms after user stops typing\n   * const search = useAction({ handler: search, debounce: 300 }, [])\n   * ```\n   */\n  debounce?: number;\n\n  /**\n   * If true, the action will be executed once when the component mounts.\n   *\n   * @example\n   * ```tsx\n   * const fetchData = useAction({\n   *   handler: async () => await api.getData(),\n   *   runOnInit: true\n   * }, []);\n   * ```\n   */\n  runOnInit?: boolean;\n\n  /**\n   * If specified, the action will be executed periodically at the given interval.\n   * The interval is specified as a DurationLike value (number in ms, Duration object, or [number, unit] tuple).\n   *\n   * @example\n   * ```tsx\n   * // Run every 5 seconds\n   * const poll = useAction({\n   *   handler: async () => await api.poll(),\n   *   runEvery: 5000\n   * }, []);\n   * ```\n   *\n   * @example\n   * ```tsx\n   * // Run every 1 minute\n   * const poll = useAction({\n   *   handler: async () => await api.poll(),\n   *   runEvery: [1, 'minute']\n   * }, []);\n   * ```\n   */\n  runEvery?: DurationLike;\n}\n\nexport interface UseActionReturn<Args extends any[], Result> {\n  /**\n   * Execute the action with the provided arguments.\n   *\n   * @example\n   * ```tsx\n   * const action = useAction({ handler: async (data) => { ... } }, []);\n   * action.run(data);\n   * ```\n   */\n  run: (...args: Args) => Promise<Result | undefined>;\n\n  /**\n   * Loading state - true when action is executing.\n   */\n  loading: boolean;\n\n  /**\n   * Error state - contains error if action failed, undefined otherwise.\n   */\n  error?: Error;\n\n  /**\n   * Cancel any pending debounced action or abort the current in-flight request.\n   *\n   * @example\n   * ```tsx\n   * const action = useAction({ ... }, []);\n   *\n   * <button onClick={action.cancel} disabled={!action.loading}>\n   *   Cancel\n   * </button>\n   * ```\n   */\n  cancel: () => void;\n}\n","import {\n  type ClientScope,\n  type HttpVirtualClient,\n  LinkProvider,\n} from \"alepha/server/links\";\nimport { useInject } from \"./useInject.ts\";\n\n/**\n * Hook to get a virtual client for the specified scope.\n *\n * It's the React-hook version of `$client()`, from `AlephaServerLinks` module.\n */\nexport const useClient = <T extends object>(\n  scope?: ClientScope,\n): HttpVirtualClient<T> => {\n  return useInject(LinkProvider).client<T>(scope);\n};\n","import type { Async, Hook, Hooks } from \"alepha\";\nimport { type DependencyList, useEffect } from \"react\";\nimport { useAlepha } from \"./useAlepha.ts\";\n\n/**\n * Allow subscribing to multiple Alepha events. See {@link Hooks} for available events.\n *\n * useEvents is fully typed to ensure correct event callback signatures.\n *\n * @example\n * ```tsx\n * useEvents(\n *   {\n *     \"react:transition:begin\": (ev) => {\n *       console.log(\"Transition began to:\", ev.to);\n *     },\n *     \"react:transition:error\": {\n *       priority: \"first\",\n *       callback: (ev) => {\n *         console.error(\"Transition error:\", ev.error);\n *       },\n *     },\n *   },\n *   [],\n * );\n * ```\n */\nexport const useEvents = (opts: UseEvents, deps: DependencyList) => {\n  const alepha = useAlepha();\n\n  useEffect(() => {\n    if (!alepha.isBrowser()) {\n      return;\n    }\n\n    const subs: Function[] = [];\n    for (const [name, hook] of Object.entries(opts)) {\n      subs.push(alepha.events.on(name as any, hook as any));\n    }\n\n    return () => {\n      for (const clear of subs) {\n        clear();\n      }\n    };\n  }, deps);\n};\n\ntype UseEvents = {\n  [T in keyof Hooks]?: Hook<T> | ((payload: Hooks[T]) => Async<void>);\n};\n","import type { Alepha } from \"alepha\";\nimport {\n  type FetchOptions,\n  HttpClient,\n  type RequestConfigSchema,\n} from \"alepha/server\";\nimport { LinkProvider, type VirtualAction } from \"alepha/server/links\";\nimport { useEffect, useState } from \"react\";\nimport { useAlepha } from \"./useAlepha.ts\";\nimport { useInject } from \"./useInject.ts\";\n\nexport const useSchema = <TConfig extends RequestConfigSchema>(\n  action: VirtualAction<TConfig>,\n): UseSchemaReturn<TConfig> => {\n  const name = action.name;\n  const alepha = useAlepha();\n  const httpClient = useInject(HttpClient);\n  const [schema, setSchema] = useState<UseSchemaReturn<TConfig>>(\n    ssrSchemaLoading(alepha, name) as UseSchemaReturn<TConfig>,\n  );\n\n  useEffect(() => {\n    if (!schema.loading) {\n      return;\n    }\n\n    const opts: FetchOptions = {\n      localCache: true,\n    };\n\n    httpClient\n      .fetch(`${LinkProvider.path.apiLinks}/${name}/schema`, opts)\n      .then((it) => setSchema(it.data as UseSchemaReturn<TConfig>));\n  }, [name]);\n\n  return schema;\n};\n\nexport type UseSchemaReturn<TConfig extends RequestConfigSchema> = TConfig & {\n  loading: boolean;\n};\n\n// ---------------------------------------------------------------------------------------------------------------------\n\n/**\n * Get an action schema during server-side rendering (SSR) or client-side rendering (CSR).\n */\nexport const ssrSchemaLoading = (alepha: Alepha, name: string) => {\n  // server-side rendering (SSR) context\n  if (!alepha.isBrowser()) {\n    // get user links\n    const linkProvider = alepha.inject(LinkProvider);\n\n    // check if user can access the link\n    const can = linkProvider\n      .getServerLinks()\n      .find((link) => link.name === name);\n\n    // yes!\n    if (can) {\n      // user-links have no schema, so we need to get it from the provider\n      const schema = linkProvider.links.find((it) => it.name === name)?.schema;\n\n      // oh, we have a schema!\n      if (schema) {\n        // attach to user link, it will be used in the client during hydration\n        can.schema = schema;\n        return schema;\n      }\n    }\n\n    return { loading: true };\n  }\n\n  // browser side rendering (CSR) context\n  // check if we have the schema already loaded\n  const schema = alepha\n    .inject(LinkProvider)\n    .links.find((it) => it.name === name)?.schema;\n\n  // yes!\n  if (schema) {\n    return schema;\n  }\n\n  // no, we need to load it\n  return { loading: true };\n};\n","import type { State, Static, TAtomObject } from \"alepha\";\nimport { Atom } from \"alepha\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport { useAlepha } from \"./useAlepha.ts\";\n\n/**\n * Hook to access and mutate the Alepha state.\n */\nfunction useStore<T extends TAtomObject>(\n  target: Atom<T>,\n  defaultValue?: Static<T>,\n): UseStoreReturn<Static<T>>;\nfunction useStore<Key extends keyof State>(\n  target: Key,\n  defaultValue?: State[Key],\n): UseStoreReturn<State[Key]>;\nfunction useStore(target: any, defaultValue?: any): any {\n  const alepha = useAlepha();\n\n  useMemo(() => {\n    if (defaultValue != null && alepha.store.get(target) == null) {\n      alepha.store.set(target, defaultValue);\n    }\n  }, [defaultValue]);\n\n  const [state, setState] = useState(alepha.store.get(target));\n\n  useEffect(() => {\n    if (!alepha.isBrowser()) {\n      return;\n    }\n\n    const key = target instanceof Atom ? target.key : target;\n\n    return alepha.events.on(\"state:mutate\", (ev) => {\n      if (ev.key === key) {\n        setState(ev.value);\n      }\n    });\n  }, []);\n\n  return [\n    state,\n    (value: any) => {\n      alepha.store.set(target, value);\n    },\n  ] as const;\n}\n\nexport type UseStoreReturn<T> = [T, (value: T) => void];\n\nexport { useStore };\n","import { $module } from \"alepha\";\nimport { AlephaDateTime } from \"alepha/datetime\";\nimport { AlephaServerLinks } from \"alepha/server/links\";\n\n// ---------------------------------------------------------------------------------------------------------------------\n\nexport * from \"./index.shared.ts\";\n\n// ---------------------------------------------------------------------------------------------------------------------\n\nexport const AlephaReact = $module({\n  name: \"alepha.react\",\n  primitives: [],\n  services: [\n\n  ],\n  register: (alepha) =>\n    alepha\n      .with(AlephaDateTime)\n      .with(AlephaServerLinks)\n});\n"],"mappings":"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"}

package/dist/form/index.d.ts

@@ -28,8 +28,8 @@ declare class DateTimeProvider {
   protected readonly timeouts: Timeout[];
   protected readonly intervals: Interval[];
   constructor();
-  protected readonly onStart: alepha8.HookDescriptor<"start">;
-  protected readonly onStop: alepha8.HookDescriptor<"stop">;
+  protected readonly onStart: alepha8.HookPrimitive<"start">;
+  protected readonly onStop: alepha8.HookPrimitive<"stop">;
   setLocale(locale: string): void;
   isDateTime(value: unknown): value is DateTime;
   /**

package/dist/head/index.browser.js

@@ -1,5 +1,5 @@
 import { AlephaReact, useInject } from "@alepha/react";
-import { $hook, $inject, $module, Alepha, Descriptor, KIND, createDescriptor } from "alepha";
+import { $hook, $inject, $module, Alepha, KIND, Primitive, createPrimitive } from "alepha";
 import { useCallback, useEffect, useMemo } from "react";
 
 //#region src/head/providers/HeadProvider.ts
@@ -39,20 +39,20 @@ var HeadProvider = class {
 };
 
 //#endregion
-//#region src/head/descriptors/$head.ts
+//#region src/head/primitives/$head.ts
 /**
 * Set global `<head>` options for the application.
 */
 const $head = (options) => {
-	return createDescriptor(HeadDescriptor, options);
+	return createPrimitive(HeadPrimitive, options);
 };
-var HeadDescriptor = class extends Descriptor {
+var HeadPrimitive = class extends Primitive {
 	provider = $inject(HeadProvider);
 	onInit() {
 		this.provider.global = this.options;
 	}
 };
-$head[KIND] = HeadDescriptor;
+$head[KIND] = HeadPrimitive;
 
 //#endregion
 //#region src/head/providers/BrowserHeadProvider.ts
@@ -169,10 +169,10 @@ const useHead = (options) => {
 */
 const AlephaReactHead = $module({
 	name: "alepha.react.head",
-	descriptors: [$head],
+	primitives: [$head],
 	services: [AlephaReact, BrowserHeadProvider]
 });
 
 //#endregion
-export { $head, AlephaReactHead, BrowserHeadProvider, HeadDescriptor, useHead };
+export { $head, AlephaReactHead, BrowserHeadProvider, HeadPrimitive, useHead };
 //# sourceMappingURL=index.browser.js.map

package/dist/head/index.browser.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.browser.js","names":["attrs: Record<string, string>","metas: { name: string; content: string }[]"],"sources":["../../src/head/providers/HeadProvider.ts","../../src/head/descriptors/$head.ts","../../src/head/providers/BrowserHeadProvider.ts","../../src/head/hooks/useHead.ts","../../src/head/index.browser.ts"],"sourcesContent":["import type { PageRoute, ReactRouterState } from \"@alepha/react\";\nimport type { Head } from \"../interfaces/Head.ts\";\n\nexport class HeadProvider {\n  public global?: Head | (() => Head);\n\n  protected getGlobalHead(): Head | undefined {\n    if (typeof this.global === \"function\") {\n      return this.global();\n    }\n    return this.global;\n  }\n\n  public fillHead(state: ReactRouterState) {\n    state.head = {\n      ...state.head,\n      ...this.getGlobalHead(),\n    };\n\n    for (const layer of state.layers) {\n      if (layer.route?.head && !layer.error) {\n        this.fillHeadByPage(layer.route, state, layer.props ?? {});\n      }\n    }\n  }\n\n  protected fillHeadByPage(\n    page: PageRoute,\n    state: ReactRouterState,\n    props: Record<string, any>,\n  ): void {\n    if (!page.head) {\n      return;\n    }\n\n    state.head ??= {};\n\n    const head =\n      typeof page.head === \"function\"\n        ? page.head(props, state.head)\n        : page.head;\n\n    if (head.title) {\n      state.head ??= {};\n\n      if (state.head.titleSeparator) {\n        state.head.title = `${head.title}${state.head.titleSeparator}${state.head.title}`;\n      } else {\n        state.head.title = head.title;\n      }\n\n      state.head.titleSeparator = head.titleSeparator;\n    }\n\n    if (head.htmlAttributes) {\n      state.head.htmlAttributes = {\n        ...state.head.htmlAttributes,\n        ...head.htmlAttributes,\n      };\n    }\n\n    if (head.bodyAttributes) {\n      state.head.bodyAttributes = {\n        ...state.head.bodyAttributes,\n        ...head.bodyAttributes,\n      };\n    }\n\n    if (head.meta) {\n      state.head.meta = [...(state.head.meta ?? []), ...(head.meta ?? [])];\n    }\n  }\n}\n","import { $inject, createDescriptor, Descriptor, KIND } from \"alepha\";\nimport type { Head } from \"../interfaces/Head.ts\";\nimport { HeadProvider } from \"../providers/HeadProvider.ts\";\n\n/**\n * Set global `<head>` options for the application.\n */\nexport const $head = (options: HeadDescriptorOptions) => {\n  return createDescriptor(HeadDescriptor, options);\n};\n\n// ---------------------------------------------------------------------------------------------------------------------\n\nexport type HeadDescriptorOptions = Head | (() => Head);\n\n// ---------------------------------------------------------------------------------------------------------------------\n\nexport class HeadDescriptor extends Descriptor<HeadDescriptorOptions> {\n  protected readonly provider = $inject(HeadProvider);\n  protected onInit() {\n    this.provider.global = this.options;\n  }\n}\n\n$head[KIND] = HeadDescriptor;\n","import { $hook, $inject } from \"alepha\";\nimport type { Head } from \"../interfaces/Head.ts\";\nimport { HeadProvider } from \"./HeadProvider.ts\";\n\nexport class BrowserHeadProvider {\n  protected readonly headProvider = $inject(HeadProvider);\n\n  protected get document(): Document {\n    return window.document;\n  }\n\n  protected readonly onBrowserRender = $hook({\n    on: \"react:browser:render\",\n    handler: async ({ state }) => {\n      this.headProvider.fillHead(state);\n      if (state.head) {\n        this.renderHead(this.document, state.head);\n      }\n    },\n  });\n\n  protected readonly onTransitionEnd = $hook({\n    on: \"react:transition:end\",\n    handler: async ({ state }) => {\n      this.headProvider.fillHead(state);\n      if (state.head) {\n        this.renderHead(this.document, state.head);\n      }\n    },\n  });\n\n  public getHead(document: Document): Head {\n    return {\n      get title() {\n        return document.title;\n      },\n      get htmlAttributes() {\n        const attrs: Record<string, string> = {};\n        for (const attr of document.documentElement.attributes) {\n          attrs[attr.name] = attr.value;\n        }\n        return attrs;\n      },\n      get bodyAttributes() {\n        const attrs: Record<string, string> = {};\n        for (const attr of document.body.attributes) {\n          attrs[attr.name] = attr.value;\n        }\n        return attrs;\n      },\n      get meta() {\n        const metas: { name: string; content: string }[] = [];\n        for (const meta of document.head.querySelectorAll(\"meta[name]\")) {\n          const name = meta.getAttribute(\"name\");\n          const content = meta.getAttribute(\"content\");\n          if (name && content) {\n            metas.push({ name, content });\n          }\n        }\n        return metas;\n      },\n    };\n  }\n\n  public renderHead(document: Document, head: Head): void {\n    if (head.title) {\n      document.title = head.title;\n    }\n\n    if (head.bodyAttributes) {\n      for (const [key, value] of Object.entries(head.bodyAttributes)) {\n        if (value) {\n          document.body.setAttribute(key, value);\n        } else {\n          document.body.removeAttribute(key);\n        }\n      }\n    }\n\n    if (head.htmlAttributes) {\n      for (const [key, value] of Object.entries(head.htmlAttributes)) {\n        if (value) {\n          document.documentElement.setAttribute(key, value);\n        } else {\n          document.documentElement.removeAttribute(key);\n        }\n      }\n    }\n\n    if (head.meta) {\n      for (const it of head.meta) {\n        const { name, content } = it;\n        const meta = document.querySelector(`meta[name=\"${name}\"]`);\n        if (meta) {\n          meta.setAttribute(\"content\", content);\n        } else {\n          const newMeta = document.createElement(\"meta\");\n          newMeta.setAttribute(\"name\", name);\n          newMeta.setAttribute(\"content\", content);\n          document.head.appendChild(newMeta);\n        }\n      }\n    }\n  }\n}\n","import { useInject } from \"@alepha/react\";\nimport { Alepha } from \"alepha\";\nimport { useCallback, useEffect, useMemo } from \"react\";\nimport type { Head } from \"../interfaces/Head.ts\";\nimport { BrowserHeadProvider } from \"../providers/BrowserHeadProvider.ts\";\n\n/**\n * ```tsx\n * const App = () => {\n *   const [head, setHead] = useHead({\n *     // will set the document title on the first render\n *     title: \"My App\",\n *   });\n *\n *   return (\n *     // This will update the document title when the button is clicked\n *     <button onClick={() => setHead({ title: \"Change Title\" })}>\n *       Change Title {head.title}\n *     </button>\n *   );\n * }\n * ```\n */\nexport const useHead = (options?: UseHeadOptions): UseHeadReturn => {\n  const alepha = useInject(Alepha);\n\n  const current = useMemo(() => {\n    if (!alepha.isBrowser()) {\n      return {};\n    }\n\n    return alepha.inject(BrowserHeadProvider).getHead(window.document);\n  }, []);\n\n  const setHead = useCallback((head?: Head | ((previous?: Head) => Head)) => {\n    if (!alepha.isBrowser()) {\n      return;\n    }\n\n    alepha\n      .inject(BrowserHeadProvider)\n      .renderHead(\n        window.document,\n        typeof head === \"function\" ? head(current) : head || {},\n      );\n  }, []);\n\n  useEffect(() => {\n    if (options) {\n      setHead(options);\n    }\n  }, []);\n\n  return [current, setHead];\n};\n\nexport type UseHeadOptions = Head | ((previous?: Head) => Head);\n\nexport type UseHeadReturn = [\n  Head,\n  (head?: Head | ((previous?: Head) => Head)) => void,\n];\n","import { AlephaReact } from \"@alepha/react\";\nimport { $module } from \"alepha\";\nimport { $head } from \"./descriptors/$head.ts\";\nimport { BrowserHeadProvider } from \"./providers/BrowserHeadProvider.ts\";\n\n// ---------------------------------------------------------------------------------------------------------------------\n\nexport * from \"./descriptors/$head.ts\";\nexport * from \"./hooks/useHead.ts\";\nexport * from \"./interfaces/Head.ts\";\nexport * from \"./providers/BrowserHeadProvider.ts\";\n\n// ---------------------------------------------------------------------------------------------------------------------\n\n/**\n * Alepha React Head Module\n *\n * @see {@link BrowserHeadProvider}\n * @module alepha.react.head\n */\nexport const AlephaReactHead = $module({\n  name: \"alepha.react.head\",\n  descriptors: [$head],\n  services: [AlephaReact, BrowserHeadProvider],\n});\n"],"mappings":"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"}
+{"version":3,"file":"index.browser.js","names":["attrs: Record<string, string>","metas: { name: string; content: string }[]"],"sources":["../../src/head/providers/HeadProvider.ts","../../src/head/primitives/$head.ts","../../src/head/providers/BrowserHeadProvider.ts","../../src/head/hooks/useHead.ts","../../src/head/index.browser.ts"],"sourcesContent":["import type { PageRoute, ReactRouterState } from \"@alepha/react\";\nimport type { Head } from \"../interfaces/Head.ts\";\n\nexport class HeadProvider {\n  public global?: Head | (() => Head);\n\n  protected getGlobalHead(): Head | undefined {\n    if (typeof this.global === \"function\") {\n      return this.global();\n    }\n    return this.global;\n  }\n\n  public fillHead(state: ReactRouterState) {\n    state.head = {\n      ...state.head,\n      ...this.getGlobalHead(),\n    };\n\n    for (const layer of state.layers) {\n      if (layer.route?.head && !layer.error) {\n        this.fillHeadByPage(layer.route, state, layer.props ?? {});\n      }\n    }\n  }\n\n  protected fillHeadByPage(\n    page: PageRoute,\n    state: ReactRouterState,\n    props: Record<string, any>,\n  ): void {\n    if (!page.head) {\n      return;\n    }\n\n    state.head ??= {};\n\n    const head =\n      typeof page.head === \"function\"\n        ? page.head(props, state.head)\n        : page.head;\n\n    if (head.title) {\n      state.head ??= {};\n\n      if (state.head.titleSeparator) {\n        state.head.title = `${head.title}${state.head.titleSeparator}${state.head.title}`;\n      } else {\n        state.head.title = head.title;\n      }\n\n      state.head.titleSeparator = head.titleSeparator;\n    }\n\n    if (head.htmlAttributes) {\n      state.head.htmlAttributes = {\n        ...state.head.htmlAttributes,\n        ...head.htmlAttributes,\n      };\n    }\n\n    if (head.bodyAttributes) {\n      state.head.bodyAttributes = {\n        ...state.head.bodyAttributes,\n        ...head.bodyAttributes,\n      };\n    }\n\n    if (head.meta) {\n      state.head.meta = [...(state.head.meta ?? []), ...(head.meta ?? [])];\n    }\n  }\n}\n","import { $inject, createPrimitive, Primitive, KIND } from \"alepha\";\nimport type { Head } from \"../interfaces/Head.ts\";\nimport { HeadProvider } from \"../providers/HeadProvider.ts\";\n\n/**\n * Set global `<head>` options for the application.\n */\nexport const $head = (options: HeadPrimitiveOptions) => {\n  return createPrimitive(HeadPrimitive, options);\n};\n\n// ---------------------------------------------------------------------------------------------------------------------\n\nexport type HeadPrimitiveOptions = Head | (() => Head);\n\n// ---------------------------------------------------------------------------------------------------------------------\n\nexport class HeadPrimitive extends Primitive<HeadPrimitiveOptions> {\n  protected readonly provider = $inject(HeadProvider);\n  protected onInit() {\n    this.provider.global = this.options;\n  }\n}\n\n$head[KIND] = HeadPrimitive;\n","import { $hook, $inject } from \"alepha\";\nimport type { Head } from \"../interfaces/Head.ts\";\nimport { HeadProvider } from \"./HeadProvider.ts\";\n\nexport class BrowserHeadProvider {\n  protected readonly headProvider = $inject(HeadProvider);\n\n  protected get document(): Document {\n    return window.document;\n  }\n\n  protected readonly onBrowserRender = $hook({\n    on: \"react:browser:render\",\n    handler: async ({ state }) => {\n      this.headProvider.fillHead(state);\n      if (state.head) {\n        this.renderHead(this.document, state.head);\n      }\n    },\n  });\n\n  protected readonly onTransitionEnd = $hook({\n    on: \"react:transition:end\",\n    handler: async ({ state }) => {\n      this.headProvider.fillHead(state);\n      if (state.head) {\n        this.renderHead(this.document, state.head);\n      }\n    },\n  });\n\n  public getHead(document: Document): Head {\n    return {\n      get title() {\n        return document.title;\n      },\n      get htmlAttributes() {\n        const attrs: Record<string, string> = {};\n        for (const attr of document.documentElement.attributes) {\n          attrs[attr.name] = attr.value;\n        }\n        return attrs;\n      },\n      get bodyAttributes() {\n        const attrs: Record<string, string> = {};\n        for (const attr of document.body.attributes) {\n          attrs[attr.name] = attr.value;\n        }\n        return attrs;\n      },\n      get meta() {\n        const metas: { name: string; content: string }[] = [];\n        for (const meta of document.head.querySelectorAll(\"meta[name]\")) {\n          const name = meta.getAttribute(\"name\");\n          const content = meta.getAttribute(\"content\");\n          if (name && content) {\n            metas.push({ name, content });\n          }\n        }\n        return metas;\n      },\n    };\n  }\n\n  public renderHead(document: Document, head: Head): void {\n    if (head.title) {\n      document.title = head.title;\n    }\n\n    if (head.bodyAttributes) {\n      for (const [key, value] of Object.entries(head.bodyAttributes)) {\n        if (value) {\n          document.body.setAttribute(key, value);\n        } else {\n          document.body.removeAttribute(key);\n        }\n      }\n    }\n\n    if (head.htmlAttributes) {\n      for (const [key, value] of Object.entries(head.htmlAttributes)) {\n        if (value) {\n          document.documentElement.setAttribute(key, value);\n        } else {\n          document.documentElement.removeAttribute(key);\n        }\n      }\n    }\n\n    if (head.meta) {\n      for (const it of head.meta) {\n        const { name, content } = it;\n        const meta = document.querySelector(`meta[name=\"${name}\"]`);\n        if (meta) {\n          meta.setAttribute(\"content\", content);\n        } else {\n          const newMeta = document.createElement(\"meta\");\n          newMeta.setAttribute(\"name\", name);\n          newMeta.setAttribute(\"content\", content);\n          document.head.appendChild(newMeta);\n        }\n      }\n    }\n  }\n}\n","import { useInject } from \"@alepha/react\";\nimport { Alepha } from \"alepha\";\nimport { useCallback, useEffect, useMemo } from \"react\";\nimport type { Head } from \"../interfaces/Head.ts\";\nimport { BrowserHeadProvider } from \"../providers/BrowserHeadProvider.ts\";\n\n/**\n * ```tsx\n * const App = () => {\n *   const [head, setHead] = useHead({\n *     // will set the document title on the first render\n *     title: \"My App\",\n *   });\n *\n *   return (\n *     // This will update the document title when the button is clicked\n *     <button onClick={() => setHead({ title: \"Change Title\" })}>\n *       Change Title {head.title}\n *     </button>\n *   );\n * }\n * ```\n */\nexport const useHead = (options?: UseHeadOptions): UseHeadReturn => {\n  const alepha = useInject(Alepha);\n\n  const current = useMemo(() => {\n    if (!alepha.isBrowser()) {\n      return {};\n    }\n\n    return alepha.inject(BrowserHeadProvider).getHead(window.document);\n  }, []);\n\n  const setHead = useCallback((head?: Head | ((previous?: Head) => Head)) => {\n    if (!alepha.isBrowser()) {\n      return;\n    }\n\n    alepha\n      .inject(BrowserHeadProvider)\n      .renderHead(\n        window.document,\n        typeof head === \"function\" ? head(current) : head || {},\n      );\n  }, []);\n\n  useEffect(() => {\n    if (options) {\n      setHead(options);\n    }\n  }, []);\n\n  return [current, setHead];\n};\n\nexport type UseHeadOptions = Head | ((previous?: Head) => Head);\n\nexport type UseHeadReturn = [\n  Head,\n  (head?: Head | ((previous?: Head) => Head)) => void,\n];\n","import { AlephaReact } from \"@alepha/react\";\nimport { $module } from \"alepha\";\nimport { $head } from \"./primitives/$head.ts\";\nimport { BrowserHeadProvider } from \"./providers/BrowserHeadProvider.ts\";\n\n// ---------------------------------------------------------------------------------------------------------------------\n\nexport * from \"./primitives/$head.ts\";\nexport * from \"./hooks/useHead.ts\";\nexport * from \"./interfaces/Head.ts\";\nexport * from \"./providers/BrowserHeadProvider.ts\";\n\n// ---------------------------------------------------------------------------------------------------------------------\n\n/**\n * Alepha React Head Module\n *\n * @see {@link BrowserHeadProvider}\n * @module alepha.react.head\n */\nexport const AlephaReactHead = $module({\n  name: \"alepha.react.head\",\n  primitives: [$head],\n  services: [AlephaReact, BrowserHeadProvider],\n});\n"],"mappings":"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"}