@resistdesign/voltra 3.0.0-alpha.48 → 3.0.0-alpha.49

package/app/index.d.ts

@@ -8,14 +8,15 @@
  * ```ts
  * import {
  *   createFormRenderer,
+ *   getApplicationStateIdentifier,
  *   useApplicationStateLoader,
- *   useApplicationStateValueStructure,
+ *   useApplicationStateValue,
  *   type RemoteProcedureCall,
  * } from "@resistdesign/voltra/app";
  * ```
  *
- * @see {@link useApplicationStateValueStructure} and
- * {@link useApplicationStateLoader} for good starting points.
+ * @see {@link useApplicationStateValue} and {@link useApplicationStateLoader}
+ * for good starting points.
  *
  * Reference examples:
  * - `examples/README.md`
@@ -24,17 +25,22 @@
  * @example
  * ```tsx
  * import {
+ *   getApplicationStateIdentifier,
  *   useApplicationStateLoader,
- *   useApplicationStateValueStructure,
+ *   useApplicationStateValue,
  *   type RemoteProcedureCall,
  * } from "@resistdesign/voltra/app";
  * import { useCallback } from "react";
  *
+ * const loginUsernameId = getApplicationStateIdentifier<string>();
+ * const loginPasswordId = getApplicationStateIdentifier<string>();
+ * const loginLoggedInId = getApplicationStateIdentifier<boolean>();
+ *
  * const APP_STATE_IDENTIFIERS = {
  *   LOGIN: {
- *     USERNAME: {},
- *     PASSWORD: {},
- *     LOGGED_IN: {},
+ *     USERNAME: loginUsernameId,
+ *     PASSWORD: loginPasswordId,
+ *     LOGGED_IN: loginLoggedInId,
  *   },
  * };
  *
@@ -52,27 +58,24 @@
  *
  * export const LoginController = () => {
  *   const {
- *     valueStructure: {
- *       username: username = "",
- *       password: password = "",
- *       loggedIn: loggedIn = false,
- *     },
- *     onChangeStructure: {
- *       username: setUsername,
- *       password: setPassword,
- *       loggedIn: setLoggedIn,
- *     },
- *   } = useApplicationStateValueStructure<{
- *     username: string;
- *     password: string;
- *     loggedIn: boolean;
- *   }>({
- *     username: APP_STATE_IDENTIFIERS.LOGIN.USERNAME,
- *     password: APP_STATE_IDENTIFIERS.LOGIN.PASSWORD,
- *     loggedIn: APP_STATE_IDENTIFIERS.LOGIN.LOGGED_IN,
- *   });
+ *     value: username = "",
+ *     onChange: setUsername,
+ *   } = useApplicationStateValue(APP_STATE_IDENTIFIERS.LOGIN.USERNAME);
+ *   const {
+ *     value: password = "",
+ *     onChange: setPassword,
+ *   } = useApplicationStateValue(APP_STATE_IDENTIFIERS.LOGIN.PASSWORD);
+ *   const {
+ *     value: loggedIn = false,
+ *     onChange: setLoggedIn,
+ *   } = useApplicationStateValue(APP_STATE_IDENTIFIERS.LOGIN.LOGGED_IN);
  *
- *   const { loading: loadingLogin, makeRemoteProcedureCall } =
+ *   const {
+ *     value: latestLoginState,
+ *     modified: loginStateModified,
+ *     loading: loadingLogin,
+ *     makeRemoteProcedureCall,
+ *   } =
  *     useApplicationStateLoader({
  *       identifier: APP_STATE_IDENTIFIERS.LOGIN.LOGGED_IN,
  *       remoteProcedureCall: LOGIN_RPC,
@@ -83,7 +86,18 @@
  *     makeRemoteProcedureCall(username, password);
  *   }, [username, password, makeRemoteProcedureCall]);
  *
- *   return { username, password, loggedIn, setUsername, setPassword, onSubmit, loadingLogin };
+ *   return {
+ *     username,
+ *     password,
+ *     loggedIn,
+ *     latestLoginState,
+ *     loginStateModified,
+ *     setUsername,
+ *     setPassword,
+ *     setLoggedIn,
+ *     onSubmit,
+ *     loadingLogin,
+ *   };
  * };
  * ```
  *

package/app/index.js

@@ -5,21 +5,16 @@ import '../chunk-RUNXRISF.js';
 import '../chunk-3HVYVX3S.js';
 import { mergeStringPaths, PATH_DELIMITER } from '../chunk-2JDOM6PB.js';
 import '../chunk-I2KLQ2HA.js';
-import { createContext, useContext, useRef, useMemo, useCallback, useState, useEffect } from 'react';
+import { createContext, useContext, useMemo, useCallback, useState, useRef, useEffect } from 'react';
 import { jsx } from 'react/jsx-runtime';
 
-var getApplicationStateIdentifier = (subStateIdMap) => subStateIdMap ? subStateIdMap : {};
+function getApplicationStateIdentifier(subStateIdMap) {
+  return subStateIdMap ? subStateIdMap : {};
+}
 var getApplicationStateModified = (identifier, modificationState) => !!modificationState.get(identifier);
 var getApplicationStateValue = (identifier, applicationState) => applicationState.get(identifier);
 var setApplicationStateModified = (identifier, value, modificationState) => new Map(modificationState).set(identifier, value);
 var setApplicationStateValue = (identifier, value, applicationState) => new Map(applicationState).set(identifier, value);
-var getApplicationStateValueStructure = (idStructure, applicationState) => Object.keys(idStructure).reduce(
-  (acc, k) => ({
-    ...acc,
-    [k]: getApplicationStateValue(idStructure[k], applicationState)
-  }),
-  {}
-);
 var ApplicationStateContext = createContext({
   modified: /* @__PURE__ */ new Map(),
   value: /* @__PURE__ */ new Map(),
@@ -36,10 +31,6 @@ var useApplicationStateValue = (identifier) => {
     onChange: setApplicationState,
     setModified: setModificationState
   } = useContext(ApplicationStateContext);
-  const appStateRef = useRef(applicationState);
-  appStateRef.current = applicationState;
-  const modificationStateRef = useRef(modificationState);
-  modificationStateRef.current = modificationState;
   const modified = useMemo(
     () => getApplicationStateModified(identifier, modificationState),
     [identifier, modificationState]
@@ -51,23 +42,30 @@ var useApplicationStateValue = (identifier) => {
   const setModified = useCallback(
     (isModified) => {
       setModificationState(
-        setApplicationStateModified(
-          identifier,
-          isModified,
-          modificationStateRef.current
-        )
+        (previousModified) => setApplicationStateModified(identifier, isModified, previousModified)
       );
     },
     [identifier, setModificationState]
   );
   const onChange = useCallback(
     (newValue) => {
-      setApplicationState(
-        setApplicationStateValue(identifier, newValue, appStateRef.current)
+      setApplicationState((previousState) => {
+        const previousValue = getApplicationStateValue(
+          identifier,
+          previousState
+        );
+        const resolvedValue = typeof newValue === "function" ? newValue(previousValue) : newValue;
+        return setApplicationStateValue(
+          identifier,
+          resolvedValue,
+          previousState
+        );
+      });
+      setModificationState(
+        (previousModified) => setApplicationStateModified(identifier, true, previousModified)
       );
-      setModified(true);
     },
-    [identifier, setApplicationState]
+    [identifier, setApplicationState, setModificationState]
   );
   const controller = useMemo(
     () => ({
@@ -80,41 +78,6 @@ var useApplicationStateValue = (identifier) => {
   );
   return controller;
 };
-var useApplicationStateValueStructure = (idStructure) => {
-  const { value: applicationState, onChange: setApplicationState } = useContext(
-    ApplicationStateContext
-  );
-  const valueStructure = useMemo(
-    () => getApplicationStateValueStructure(idStructure, applicationState),
-    [applicationState, idStructure]
-  );
-  const onChangeStructure = useMemo(
-    () => Object.keys(idStructure).reduce(
-      (acc, k) => ({
-        ...acc,
-        [k]: (newValue) => {
-          setApplicationState(
-            setApplicationStateValue(
-              idStructure[k],
-              newValue,
-              applicationState
-            )
-          );
-        }
-      }),
-      {}
-    ),
-    [applicationState, idStructure, setApplicationState]
-  );
-  const controller = useMemo(
-    () => ({
-      valueStructure,
-      onChangeStructure
-    }),
-    [onChangeStructure, valueStructure]
-  );
-  return controller;
-};
 var ApplicationStateProvider = ({
   children
 }) => {
@@ -200,13 +163,14 @@ var useApplicationStateLoader = (config) => {
   const [cacheValidity, setCacheValidity] = useState({});
   const [loading, setLoading] = useState(false);
   const [latestError, setLatestError] = useState();
-  const { onChange, setModified } = useApplicationStateValue(identifier);
+  const valueController = useApplicationStateValue(identifier);
+  const { onChange, setModified } = valueController;
   const invalidate = useCallback(() => {
     setCacheValidity({});
   }, []);
   const makeRemoteProcedureCall = useCallback(
     async (...directArgs) => {
-      let success;
+      let success = false;
       setLoading(true);
       setLatestError(void 0);
       try {
@@ -234,12 +198,13 @@ var useApplicationStateLoader = (config) => {
   );
   const appStateLoader = useMemo(
     () => ({
+      ...valueController,
       loading,
       latestError,
       invalidate,
       makeRemoteProcedureCall
     }),
-    [loading, latestError, invalidate, makeRemoteProcedureCall]
+    [valueController, loading, latestError, invalidate, makeRemoteProcedureCall]
   );
   useEffect(() => {
     if (!manual && argsRef.current) {
@@ -580,4 +545,4 @@ var withRendererOverride = (kind, renderer) => ({
   }
 });
 
-export { ApplicationStateContext, ApplicationStateProvider, TypeInfoORMClient, getApplicationStateIdentifier, getApplicationStateModified, getApplicationStateValue, getApplicationStateValueStructure, getChangedDependencyIndexes, getFullUrl, handleRequest, mergeSuites, requestHandlerFactory, sendServiceRequest, setApplicationStateModified, setApplicationStateValue, useApplicationStateLoader, useApplicationStateValue, useApplicationStateValueStructure, useController, useDebugDependencies, useTypeInfoORMAPI, withRendererOverride };
+export { ApplicationStateContext, ApplicationStateProvider, TypeInfoORMClient, getApplicationStateIdentifier, getApplicationStateModified, getApplicationStateValue, getChangedDependencyIndexes, getFullUrl, handleRequest, mergeSuites, requestHandlerFactory, sendServiceRequest, setApplicationStateModified, setApplicationStateValue, useApplicationStateLoader, useApplicationStateValue, useController, useDebugDependencies, useTypeInfoORMAPI, withRendererOverride };

package/app/utils/ApplicationState.d.ts

@@ -3,39 +3,56 @@
  *
  * Application-level state container built on React context and maps. Use
  * {@link ApplicationStateProvider} to host state, then access values with
- * {@link useApplicationStateValue} or {@link useApplicationStateValueStructure}.
+ * {@link useApplicationStateValue}.
  */
-import { FC, PropsWithChildren } from "react";
+import { FC, PropsWithChildren, type Dispatch, type SetStateAction } from "react";
 /**
- * An object, nested or not, used as the identifier or identifier path for a state value.
+ * An object, nested or not, used as the identifier or identifier path for a
+ * state value.
+ *
+ * The generic parameter exists purely for TypeScript. It lets a consumer make
+ * the identifier itself the source of truth for what value type lives at that
+ * location in application state, without changing the runtime shape.
  * */
-export interface ApplicationStateIdentifier extends Record<string, ApplicationStateIdentifier | {}> {
+declare const applicationStateIdentifierValueTypeSymbol: unique symbol;
+export interface ApplicationStateIdentifier<ValueType = unknown> extends Record<string, ApplicationStateIdentifier<any> | {}> {
+    readonly [applicationStateIdentifierValueTypeSymbol]?: ValueType;
 }
 /**
  * The stored value type for application state entries.
  * */
-export type ApplicationStateValue = any;
+export type ApplicationStateValue = unknown;
+/**
+ * React-style state action for a specific application-state value.
+ *
+ * Passing a function follows the same contract as React `useState`: the
+ * function receives the previous value and returns the next value.
+ * */
+export type ApplicationStateSetAction<ValueType> = ValueType | ((previousValue: ValueType) => ValueType);
+/**
+ * React-style stable setter for a specific application-state value.
+ * */
+export type ApplicationStateSetter<ValueType> = (value: ApplicationStateSetAction<ValueType>) => void;
 /**
  * Map of state identifiers to a "modified" boolean.
  * */
-export type ApplicationStateModificationState = Map<ApplicationStateIdentifier, boolean>;
+export type ApplicationStateModificationState = Map<ApplicationStateIdentifier<any>, boolean>;
 /**
  * Map of state identifiers to stored values.
  * */
-export type ApplicationState = Map<ApplicationStateIdentifier, ApplicationStateValue>;
+export type ApplicationState = Map<ApplicationStateIdentifier<any>, ApplicationStateValue>;
 /**
- * Determines the identifier shape for a specific sub-state.
+ * Create or forward an application-state identifier.
  *
- * @typeParam SpecificType - The identifier shape, if provided.
- * */
-export type ApplicationStateIdentifierSubStateType<SpecificType> = SpecificType extends undefined ? ApplicationStateIdentifier : SpecificType extends ApplicationStateIdentifier ? SpecificType : never;
-/**
- * Normalize a sub-state identifier map to an ApplicationStateIdentifier.
+ * Call with no argument to create a new identifier object and attach a value
+ * type at the type level:
+ * `const profileId = getApplicationStateIdentifier<UserProfile>()`
  *
- * @param subStateIdMap - Optional sub-state identifier map.
- * @returns The identifier map or an empty identifier object.
+ * Call with an existing identifier object to preserve that exact object
+ * reference while keeping its type information intact.
  * */
-export declare const getApplicationStateIdentifier: <SubStateIdStructure extends ApplicationStateIdentifier>(subStateIdMap?: SubStateIdStructure) => ApplicationStateIdentifierSubStateType<SubStateIdStructure>;
+export declare function getApplicationStateIdentifier<ValueType = ApplicationStateValue>(): ApplicationStateIdentifier<ValueType>;
+export declare function getApplicationStateIdentifier<IdentifierType extends ApplicationStateIdentifier<any>>(subStateIdMap: IdentifierType): IdentifierType;
 /**
  * Read the modification status for a specific identifier.
  *
@@ -43,7 +60,7 @@ export declare const getApplicationStateIdentifier: <SubStateIdStructure extends
  * @param modificationState - The modification map to read from.
  * @returns Whether the identifier is marked as modified.
  * */
-export declare const getApplicationStateModified: (identifier: ApplicationStateIdentifier, modificationState: ApplicationStateModificationState) => boolean;
+export declare const getApplicationStateModified: (identifier: ApplicationStateIdentifier<any>, modificationState: ApplicationStateModificationState) => boolean;
 /**
  * Read the stored value for an identifier.
  *
@@ -51,7 +68,7 @@ export declare const getApplicationStateModified: (identifier: ApplicationStateI
  * @param applicationState - The application state map.
  * @returns The stored value, if any.
  * */
-export declare const getApplicationStateValue: (identifier: ApplicationStateIdentifier, applicationState: ApplicationState) => ApplicationStateValue;
+export declare const getApplicationStateValue: <ValueType = ApplicationStateValue>(identifier: ApplicationStateIdentifier<ValueType>, applicationState: ApplicationState) => ValueType | undefined;
 /**
  * Set the modification status for an identifier.
  *
@@ -60,7 +77,7 @@ export declare const getApplicationStateValue: (identifier: ApplicationStateIden
  * @param modificationState - The current modification map.
  * @returns A new modification map with the updated flag.
  * */
-export declare const setApplicationStateModified: (identifier: ApplicationStateIdentifier, value: boolean, modificationState: ApplicationStateModificationState) => ApplicationStateModificationState;
+export declare const setApplicationStateModified: (identifier: ApplicationStateIdentifier<any>, value: boolean, modificationState: ApplicationStateModificationState) => ApplicationStateModificationState;
 /**
  * Set the stored value for an identifier.
  *
@@ -69,15 +86,7 @@ export declare const setApplicationStateModified: (identifier: ApplicationStateI
  * @param applicationState - The current application state map.
  * @returns A new application state map with the updated value.
  * */
-export declare const setApplicationStateValue: (identifier: ApplicationStateIdentifier, value: ApplicationStateValue, applicationState: ApplicationState) => ApplicationState;
-/**
- * Resolve a structured map of identifiers into their current values.
- *
- * @param idStructure - Map of structure keys to identifiers.
- * @param applicationState - The application state map.
- * @returns An object of the same shape containing resolved values.
- * */
-export declare const getApplicationStateValueStructure: <ReturnStructureType extends Record<string, any>>(idStructure: Record<keyof ReturnStructureType, ApplicationStateIdentifier>, applicationState: ApplicationState) => ReturnStructureType;
+export declare const setApplicationStateValue: <ValueType = ApplicationStateValue>(identifier: ApplicationStateIdentifier<ValueType>, value: ValueType, applicationState: ApplicationState) => ApplicationState;
 /**
  * Context state and updater hooks for application state.
  * */
@@ -93,11 +102,11 @@ export type ApplicationStateContextType = {
     /**
      * Replace the current application state map.
      * */
-    onChange: (newValue: ApplicationState) => void;
+    onChange: Dispatch<SetStateAction<ApplicationState>>;
     /**
      * Replace the current modification state map.
      * */
-    setModified: (newValue: ApplicationStateModificationState) => void;
+    setModified: Dispatch<SetStateAction<ApplicationStateModificationState>>;
 };
 /**
  * React context for application state and modification tracking.
@@ -106,7 +115,7 @@ export declare const ApplicationStateContext: import("react").Context<Applicatio
 /**
  * Used to access and update application state values.
  * */
-export type ApplicationStateValueController = {
+export type ApplicationStateValueController<ValueType = ApplicationStateValue> = {
     /**
      * Whether the value is marked as modified.
      * */
@@ -114,13 +123,17 @@ export type ApplicationStateValueController = {
     /**
      * The current value for the identifier.
      * */
-    value: ApplicationStateValue;
+    value: ValueType | undefined;
     /**
-     * Update the current value.
+     * Update the current value with React `useState` semantics.
      *
-     * @param value - The new value to store.
+     * The setter is intentionally stable so consumers can safely depend on it
+     * like a normal React state setter.
+     *
+     * @param value - The next value, or a function that derives it from the
+     * previous value.
      * */
-    onChange: (value: ApplicationStateValue) => void;
+    onChange: ApplicationStateSetter<ValueType | undefined>;
     /**
      * Update the modified flag.
      *
@@ -134,27 +147,7 @@ export type ApplicationStateValueController = {
  * @param identifier - Identifier to read and update.
  * @returns Controller for the identifier value and modified flag.
  * */
-export declare const useApplicationStateValue: (identifier: ApplicationStateIdentifier) => ApplicationStateValueController;
-/**
- * A mapped structure of application state value controllers.
- * */
-export type ApplicationStateValueStructureController<StructureType extends Record<string, any>> = {
-    /**
-     * The resolved value structure.
-     * */
-    valueStructure: StructureType;
-    /**
-     * Per-field change handlers for the structure.
-     * */
-    onChangeStructure: Record<keyof StructureType, (newValue: any) => void>;
-};
-/**
- * Use an object that is a collection of application state value controllers.
- *
- * @param idStructure - Map of structure keys to identifiers.
- * @returns Controller with the resolved values and per-field change handlers.
- * */
-export declare const useApplicationStateValueStructure: <StructureType extends Record<string, any>>(idStructure: Record<keyof StructureType, ApplicationStateIdentifier>) => ApplicationStateValueStructureController<StructureType>;
+export declare const useApplicationStateValue: <ValueType = ApplicationStateValue>(identifier: ApplicationStateIdentifier<ValueType>) => ApplicationStateValueController<ValueType>;
 /**
  * Props for ApplicationStateProvider.
  * */
@@ -165,3 +158,4 @@ export type ApplicationStateProviderProps = PropsWithChildren<{}>;
  * @param children - React children to render in the provider.
  * */
 export declare const ApplicationStateProvider: FC<ApplicationStateProviderProps>;
+export {};

package/app/utils/ApplicationStateLoader.d.ts

@@ -4,12 +4,12 @@
  * Loader hook for remote application state values. Calls a service endpoint,
  * tracks loading/error state, and populates ApplicationState via identifiers.
  */
-import { ApplicationStateIdentifier } from "./ApplicationState";
+import { ApplicationStateIdentifier, type ApplicationStateValue, type ApplicationStateValueController } from "./ApplicationState";
 import { ServiceConfig } from "./Service";
 /**
  * Access and track the loading of an application state value.
  * */
-export type ApplicationStateLoader = {
+export type ApplicationStateLoader<ValueType = ApplicationStateValue, ArgsType extends any[] = any[]> = ApplicationStateValueController<ValueType> & {
     /**
      * Whether the current request is in flight.
      * */
@@ -27,12 +27,12 @@ export type ApplicationStateLoader = {
      *
      * @param args - Arguments to send with the request.
      * */
-    makeRemoteProcedureCall: (...args: any[]) => Promise<void>;
+    makeRemoteProcedureCall: (...args: ArgsType) => Promise<void>;
 };
 /**
  * The service, path and arguments to use for a remote procedure call.
  * */
-export type RemoteProcedureCall = {
+export type RemoteProcedureCall<ArgsType extends any[] = any[]> = {
     /**
      * Configuration for the target service endpoint.
      * */
@@ -44,20 +44,20 @@ export type RemoteProcedureCall = {
     /**
      * Default args to send when the call auto-runs.
      * */
-    args?: any[];
+    args?: ArgsType;
 };
 /**
  * The configuration for an application state loader.
  * */
-export type ApplicationStateLoaderConfig = {
+export type ApplicationStateLoaderConfig<ValueType = ApplicationStateValue, ArgsType extends any[] = any[]> = {
     /**
      * Identifier for the value to update in application state.
      * */
-    identifier: ApplicationStateIdentifier;
+    identifier: ApplicationStateIdentifier<ValueType>;
     /**
      * RPC target configuration and arguments.
      * */
-    remoteProcedureCall: RemoteProcedureCall;
+    remoteProcedureCall: RemoteProcedureCall<ArgsType>;
     /**
      * Clear the application state value on error.
      *
@@ -80,7 +80,12 @@ export type ApplicationStateLoaderConfig = {
 /**
  * Load, track and access an application state value.
  *
+ * The returned object intentionally combines the remote-loading lifecycle with
+ * the same stable local controller contract as
+ * {@link useApplicationStateValue}. That keeps a loader-backed state value
+ * usable like normal React state once it has been identified.
+ *
  * @param config - Loader configuration for state identifier and RPC details.
  * @returns Loader controls and request state.
  * */
-export declare const useApplicationStateLoader: (config: ApplicationStateLoaderConfig) => ApplicationStateLoader;
+export declare const useApplicationStateLoader: <ValueType = ApplicationStateValue, ArgsType extends any[] = any[]>(config: ApplicationStateLoaderConfig<ValueType, ArgsType>) => ApplicationStateLoader<ValueType, ArgsType>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@resistdesign/voltra",
-  "version": "3.0.0-alpha.48",
+  "version": "3.0.0-alpha.49",
   "description": "With our powers combined!",
   "homepage": "https://voltra.app",
   "repository": "git@github.com:resistdesign/voltra.git",