@molecule/app-ui-react 1.3.4 → 1.3.5

package/README.md

@@ -3,7 +3,7 @@ AUTO-GENERATED — DO NOT EDIT THIS FILE.
 Generated by `mlcl sync-docs` from the package's src/index.ts JSDoc + mlcl/registry.json.
 Edits here are overwritten on the next commit (molecule's pre-commit hook regenerates).
 To change this document, edit the module-level JSDoc in src/index.ts.
-Generated: 2026-10-16T23:38:48.542Z
+Generated: 2026-10-18T20:39:38.844Z
 -->
 
 # @molecule/app-ui-react
@@ -1328,10 +1328,10 @@ forking the component.
 ```typescript
 interface AuthGuardProps {
   /**
-   * Element rendered while `useAuth().state.initialized` is `false`.
-   * Overrides the default `<div data-mol-id="auth-guard-loading">…</div>`
-   * loading tag — pass a full-page spinner or any other UI you want
-   * during the auth bootstrap window.
+   * Element rendered while `useAuth().status` is `'loading'` — no session
+   * decision yet. Overrides the default
+   * `<div data-mol-id="auth-guard-loading">…</div>` loading tag — pass a
+   * full-page spinner or any other UI you want during the auth bootstrap window.
    */
   loadingFallback?: ReactNode
   /**
@@ -2142,12 +2142,18 @@ type ShellSidebarWidth = 'sm' | 'md' | 'lg' | number
 
 Route-element guard for authenticated sections of a React Router tree.
 
-- While `useAuth().state.initialized` is `false`, renders the
+- While `useAuth().status` is `'loading'` (no session decision yet), renders the
   `loadingFallback` (or the default `<div data-mol-id="auth-guard-loading">{t('common.loading')}</div>`).
 - If the user is not authenticated, redirects to `loginPath` carrying
   the attempted location in `state.from` for post-login restoration.
 - Otherwise renders `children` (or `<Outlet />` if none).
 
+The guard reads `status`, not `initialized`: a stored token AND user make the
+FIRST render `'authenticated'`, so a protected page paints immediately instead
+of waiting for the background verification (`validateSession()`) or a
+current-user round trip. `'unavailable'` (a stored session the server could not
+confirm) counts as signed in — the page renders and the API decides.
+
 The default loading tag carries `data-mol-id="auth-guard-loading"`
 so AI agents and e2e tests can target it reliably. When the caller
 passes a custom `loadingFallback`, it's the caller's responsibility

package/dist/components/AuthGuard.d.ts

@@ -9,10 +9,10 @@ import { type ReactNode } from 'react';
  */
 export interface AuthGuardProps {
     /**
-     * Element rendered while `useAuth().state.initialized` is `false`.
-     * Overrides the default `<div data-mol-id="auth-guard-loading">…</div>`
-     * loading tag — pass a full-page spinner or any other UI you want
-     * during the auth bootstrap window.
+     * Element rendered while `useAuth().status` is `'loading'` — no session
+     * decision yet. Overrides the default
+     * `<div data-mol-id="auth-guard-loading">…</div>` loading tag — pass a
+     * full-page spinner or any other UI you want during the auth bootstrap window.
      */
     loadingFallback?: ReactNode;
     /**
@@ -49,12 +49,18 @@ export interface AuthGuardProps {
 /**
  * Route-element guard for authenticated sections of a React Router tree.
  *
- * - While `useAuth().state.initialized` is `false`, renders the
+ * - While `useAuth().status` is `'loading'` (no session decision yet), renders the
  *   `loadingFallback` (or the default `<div data-mol-id="auth-guard-loading">{t('common.loading')}</div>`).
  * - If the user is not authenticated, redirects to `loginPath` carrying
  *   the attempted location in `state.from` for post-login restoration.
  * - Otherwise renders `children` (or `<Outlet />` if none).
  *
+ * The guard reads `status`, not `initialized`: a stored token AND user make the
+ * FIRST render `'authenticated'`, so a protected page paints immediately instead
+ * of waiting for the background verification (`validateSession()`) or a
+ * current-user round trip. `'unavailable'` (a stored session the server could not
+ * confirm) counts as signed in — the page renders and the API decides.
+ *
  * The default loading tag carries `data-mol-id="auth-guard-loading"`
  * so AI agents and e2e tests can target it reliably. When the caller
  * passes a custom `loadingFallback`, it's the caller's responsibility

package/dist/components/AuthGuard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AuthGuard.d.ts","sourceRoot":"","sources":["../../src/components/AuthGuard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAqB,MAAM,OAAO,CAAA;AAKzD;;;;;;;GAOG;AACH,MAAM,WAAW,cAAc;IAC7B;;;;;OAKG;IACH,eAAe,CAAC,EAAE,SAAS,CAAA;IAC3B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;;OAMG;IACH,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,SAAS,CAAC,EACxB,eAAe,EACf,UAA6B,EAC7B,cAA6B,EAC7B,SAAoB,EACpB,eAAe,EACf,QAAQ,GACT,GAAE,cAAmB,GAAG,SAAS,CA2BjC"}
+{"version":3,"file":"AuthGuard.d.ts","sourceRoot":"","sources":["../../src/components/AuthGuard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAqB,MAAM,OAAO,CAAA;AAKzD;;;;;;;GAOG;AACH,MAAM,WAAW,cAAc;IAC7B;;;;;OAKG;IACH,eAAe,CAAC,EAAE,SAAS,CAAA;IAC3B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;;OAMG;IACH,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,SAAS,CAAC,EACxB,eAAe,EACf,UAA6B,EAC7B,cAA6B,EAC7B,SAAoB,EACpB,eAAe,EACf,QAAQ,GACT,GAAE,cAAmB,GAAG,SAAS,CA2BjC"}

package/dist/components/AuthGuard.js

@@ -5,12 +5,18 @@ import { useAuth, useTranslation } from '@molecule/app-react';
 /**
  * Route-element guard for authenticated sections of a React Router tree.
  *
- * - While `useAuth().state.initialized` is `false`, renders the
+ * - While `useAuth().status` is `'loading'` (no session decision yet), renders the
  *   `loadingFallback` (or the default `<div data-mol-id="auth-guard-loading">{t('common.loading')}</div>`).
  * - If the user is not authenticated, redirects to `loginPath` carrying
  *   the attempted location in `state.from` for post-login restoration.
  * - Otherwise renders `children` (or `<Outlet />` if none).
  *
+ * The guard reads `status`, not `initialized`: a stored token AND user make the
+ * FIRST render `'authenticated'`, so a protected page paints immediately instead
+ * of waiting for the background verification (`validateSession()`) or a
+ * current-user round trip. `'unavailable'` (a stored session the server could not
+ * confirm) counts as signed in — the page renders and the API decides.
+ *
  * The default loading tag carries `data-mol-id="auth-guard-loading"`
  * so AI agents and e2e tests can target it reliably. When the caller
  * passes a custom `loadingFallback`, it's the caller's responsibility
@@ -19,7 +25,7 @@ import { useAuth, useTranslation } from '@molecule/app-react';
  * @param props - {@link AuthGuardProps}
  */
 export function AuthGuard({ loadingFallback, loadingKey = 'common.loading', loadingDefault = 'Loading...', loginPath = '/login', onAuthenticated, children, } = {}) {
-    const { isAuthenticated, state } = useAuth();
+    const { isAuthenticated, status } = useAuth();
     const { t } = useTranslation();
     const location = useLocation();
     const lastAuthRef = useRef(false);
@@ -31,7 +37,7 @@ export function AuthGuard({ loadingFallback, loadingKey = 'common.loading', load
         }
         lastAuthRef.current = isAuthenticated;
     }, [isAuthenticated, onAuthenticated]);
-    if (!state.initialized) {
+    if (status === 'loading') {
         return (loadingFallback ?? (_jsx("div", { "data-mol-id": "auth-guard-loading", children: t(loadingKey, {}, { defaultValue: loadingDefault }) })));
     }
     if (!isAuthenticated) {

package/dist/components/AuthGuard.js.map

@@ -1 +1 @@
-{"version":3,"file":"AuthGuard.js","sourceRoot":"","sources":["../../src/components/AuthGuard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAkB,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAE5D,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAkD7D;;;;;;;;;;;;;;;GAeG;AACH,MAAM,UAAU,SAAS,CAAC,EACxB,eAAe,EACf,UAAU,GAAG,gBAAgB,EAC7B,cAAc,GAAG,YAAY,EAC7B,SAAS,GAAG,QAAQ,EACpB,eAAe,EACf,QAAQ,MACU,EAAE;IACpB,MAAM,EAAE,eAAe,EAAE,KAAK,EAAE,GAAG,OAAO,EAAE,CAAA;IAC5C,MAAM,EAAE,CAAC,EAAE,GAAG,cAAc,EAAE,CAAA;IAC9B,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAA;IAC9B,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA;IAEjC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,eAAe;YAAE,OAAM;QAC5B,IAAI,eAAe,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE,CAAC;YAC5C,eAAe,EAAE,CAAA;QACnB,CAAC;QACD,WAAW,CAAC,OAAO,GAAG,eAAe,CAAA;IACvC,CAAC,EAAE,CAAC,eAAe,EAAE,eAAe,CAAC,CAAC,CAAA;IAEtC,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC;QACvB,OAAO,CACL,eAAe,IAAI,CACjB,6BAAiB,oBAAoB,YAClC,CAAC,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,YAAY,EAAE,cAAc,EAAE,CAAC,GAChD,CACP,CACF,CAAA;IACH,CAAC;IACD,IAAI,CAAC,eAAe,EAAE,CAAC;QACrB,OAAO,KAAC,QAAQ,IAAC,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,OAAO,SAAG,CAAA;IACvE,CAAC;IACD,OAAO,4BAAG,QAAQ,IAAI,KAAC,MAAM,KAAG,GAAI,CAAA;AACtC,CAAC"}
+{"version":3,"file":"AuthGuard.js","sourceRoot":"","sources":["../../src/components/AuthGuard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAkB,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAE5D,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAkD7D;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,UAAU,SAAS,CAAC,EACxB,eAAe,EACf,UAAU,GAAG,gBAAgB,EAC7B,cAAc,GAAG,YAAY,EAC7B,SAAS,GAAG,QAAQ,EACpB,eAAe,EACf,QAAQ,MACU,EAAE;IACpB,MAAM,EAAE,eAAe,EAAE,MAAM,EAAE,GAAG,OAAO,EAAE,CAAA;IAC7C,MAAM,EAAE,CAAC,EAAE,GAAG,cAAc,EAAE,CAAA;IAC9B,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAA;IAC9B,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA;IAEjC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,eAAe;YAAE,OAAM;QAC5B,IAAI,eAAe,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE,CAAC;YAC5C,eAAe,EAAE,CAAA;QACnB,CAAC;QACD,WAAW,CAAC,OAAO,GAAG,eAAe,CAAA;IACvC,CAAC,EAAE,CAAC,eAAe,EAAE,eAAe,CAAC,CAAC,CAAA;IAEtC,IAAI,MAAM,KAAK,SAAS,EAAE,CAAC;QACzB,OAAO,CACL,eAAe,IAAI,CACjB,6BAAiB,oBAAoB,YAClC,CAAC,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,YAAY,EAAE,cAAc,EAAE,CAAC,GAChD,CACP,CACF,CAAA;IACH,CAAC;IACD,IAAI,CAAC,eAAe,EAAE,CAAC;QACrB,OAAO,KAAC,QAAQ,IAAC,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,OAAO,SAAG,CAAA;IACvE,CAAC;IACD,OAAO,4BAAG,QAAQ,IAAI,KAAC,MAAM,KAAG,GAAI,CAAA;AACtC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@molecule/app-ui-react",
-  "version": "1.3.4",
+  "version": "1.3.5",
   "description": "React UI components for molecule.dev",
   "type": "module",
   "sideEffects": false,
@@ -44,7 +44,7 @@
   "devDependencies": {
     "@molecule/app-i18n": "1.0.3",
     "@molecule/app-icons": "1.0.2",
-    "@molecule/app-react": "1.6.5",
+    "@molecule/app-react": "1.6.6",
     "@testing-library/react": "16.3.2",
     "@types/node": "26.1.2",
     "@types/react": "19.2.17",