@geniee-inc/sfa-kit 1.13.0 → 1.14.1

package/GUIDE.md

@@ -18,7 +18,7 @@ The package ships built JavaScript and TypeScript declarations only. It contains
 
 ```ts
 import pkg from '@geniee-inc/sfa-kit/package.json';
-// pkg.version -> '1.10.0'
+// pkg.version -> '1.14.0'
 ```
 
 Two additional subpaths are available: `@geniee-inc/sfa-kit/signing` exposes bundle-signing utilities (`computeContentHash`, `computeSignature`, `createManifest`, `createManifestFromDirectory`) for Node.js environments, and `./package.json` exposes the manifest. Internal modules cannot be imported directly.
@@ -38,7 +38,7 @@ Every page uses `SfaLoginGate` as the outermost wrapper. It auto-detects the hos
 
 ### Props
 
-- **`apiBase`** (optional) — Overrides the default API endpoint (`https://keystone-api-staging.chikyu.mobi`).
+- **`apiBase`** (optional) — Overrides the auto-detected Keystone API endpoint. When omitted, the endpoint is resolved from a hostname: the embedding SFA/CRM host's when the page runs inside the iframe, the page's own when it runs standalone. Non-production environments (`stg.chikyu.mobi`, `dev01`-`dev09`, `devdc`, `deva0`, `dev-docker`, `dev.chikyu.local`, `localhost`, `127.0.0.1`, `[::1]`, and every Amplify host of the new frontend under `*.amplify.axiom.chikyu.mobi`: PR previews plus the `devNN.waf.` / `stg.waf.` record-detail hosts) use `https://keystone-api-staging.chikyu.mobi`; everything else (`app.chikyu.net`, any hostname not in that list) uses `https://keystone-api-production.chikyu.mobi`. Production is the fallback on purpose so a page that reaches a customer never silently talks to staging.
 - **`trustedOrigin`** (optional) — The origin of the SFA/CRM host page (e.g. `"https://app.chikyu.net"`). When provided and the page runs inside an iframe, `SfaLoginGate` uses the postMessage code-exchange flow (`POST /v1/auth/exchange`) instead of a login form. Injected automatically by Keystone's content endpoint at serve time.
 - **`defaultOrganizationId`** (optional) — The org ID to auto-select when the user's account belongs to multiple organizations. **Set this to the org that generated the page's metadata** (the org used in Step 0 schema discovery). Without this prop, multi-org accounts auto-select the first available org, which may not be the intended one. Use an env var, not a literal: `defaultOrganizationId={Number(process.env.NEXT_PUBLIC_DEFAULT_ORG_ID)}`.
 - **`objectKey`** (optional) — The object this page is built for (e.g. `"companies"`). The standalone DevToolbar shows it in the page-info tooltip and in the record ID placeholder. Pass it at **both** levels; omit it only if the page genuinely has no object.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@geniee-inc/sfa-kit",
-  "version": "1.13.0",
+  "version": "1.14.1",
   "description": "React hooks and components for building pages that connect to GENIEE SFA/CRM data.",
   "type": "module",
   "main": "./src/index.js",

package/src/lib/auth/SfaLoginGate.js

@@ -1,22 +1,16 @@
 import { __awaiter } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { useCallback, useMemo, useState } from 'react';
 import { SfaProvider } from '../provider/SfaProvider';
 import { color, font, radius, space, baseContainerStyle, baseButtonStyle, } from '../theme';
 import { SFA_KIT_VERSION } from '../version';
 import { DevToolbar } from './DevToolbar';
-import { parseInboundMessage, sendToHost } from './embed-protocol';
-import { exchangeCode } from './exchange-code';
 import { authenticate } from './keystone-auth';
+import { KEYSTONE_PRODUCTION_API_BASE, resolveApiBase, } from './resolve-api-base';
 import { loadSession, saveSession, clearSession, loadLastOrgId, } from './session-store';
 import { StandalonePreviewCtx } from './StandalonePreviewContext';
 import { EmbedContextValue } from './useEmbedContext';
-const DEFAULT_API_BASE = 'https://keystone-api-staging.chikyu.mobi';
-const REFRESH_BUFFER_SECONDS = 120;
-/** After this many consecutive exchange failures, stop retrying and show session_expired. */
-const MAX_CONSECUTIVE_FAILURES = 3;
-/** Seconds to wait for the host to send a code before showing a connection error. */
-const CODE_TIMEOUT_SECONDS = 15;
+import { useEmbedSession } from './useEmbedSession';
 /**
  * @description Returns true when the page is running inside an iframe.
  */
@@ -62,6 +56,21 @@ function resolveTrustedOrigin(explicitOrigin) {
     }
     return undefined;
 }
+/**
+ * @description The origin this page is being served from.
+ *
+ * Used to pick the Keystone API when the page runs standalone: a preview
+ * opened directly, or a Studio page on a developer's machine, has no
+ * embedding host to judge by, so its own hostname is the only signal.
+ */
+function resolvePageOrigin() {
+    try {
+        return window.location.origin;
+    }
+    catch (_a) {
+        return undefined;
+    }
+}
 /**
  * @description Universal auth wrapper for sfa-kit pages.
  *
@@ -75,104 +84,38 @@ function resolveTrustedOrigin(explicitOrigin) {
  *   automatically from the API (auto-selected for multi-org accounts when
  *   defaultOrganizationId is set, or the first org is used by default).
  */
-export function SfaLoginGate({ apiBase = DEFAULT_API_BASE, trustedOrigin, defaultOrganizationId, objectKey, level, children, }) {
+export function SfaLoginGate({ apiBase, trustedOrigin, defaultOrganizationId, objectKey, level, children, }) {
     const shouldEmbed = isEmbedded() && (trustedOrigin != null || hasContentToken());
     const resolvedOrigin = resolveTrustedOrigin(trustedOrigin);
-    if (shouldEmbed && resolvedOrigin != null) {
-        return (_jsx(EmbedFlow, { trustedOrigin: resolvedOrigin, apiBase: apiBase, children: children }));
+    if (shouldEmbed) {
+        // ホストオリジンを 1 つに決められない状態。postMessage の宛先も
+        // event.origin の照合相手も決まらないため、埋め込みの手順自体が成立
+        // しない。ここでログインフォームに落とすと、どの frame の中にいるか
+        // 分からないまま資格情報の入力欄を出すことになるので、描画せずに
+        // 理由だけ表示して止める。
+        //
+        // NOTE: resolveTrustedOrigin は trustedOrigin 未指定時に document.referrer
+        // を使う。referrer は埋め込む側が決める値なので、下の EmbedFlow の
+        // 経路は「埋め込み元の自己申告を信じる」ことになる。ホストを実際に
+        // 限定できるのは trustedOrigin を明示した場合だけ。
+        if (resolvedOrigin == null) {
+            return (_jsx(EmbedStatus, { title: "\u63A5\u7D9A\u3067\u304D\u307E\u305B\u3093", message: "SFA/CRM \u306E\u30DB\u30B9\u30C8\u30AA\u30EA\u30B8\u30F3\u3092\u78BA\u8A8D\u3067\u304D\u306A\u3044\u305F\u3081\u3001\u3053\u306E\u30DA\u30FC\u30B8\u3092\u8868\u793A\u3067\u304D\u307E\u305B\u3093\u3002\u57CB\u3081\u8FBC\u307F\u8A2D\u5B9A\u3092\u7BA1\u7406\u8005\u306B\u3054\u78BA\u8A8D\u304F\u3060\u3055\u3044\u3002" }));
+        }
+        // Embedded: the SFA/CRM host that framed us decides the environment.
+        return (_jsx(EmbedFlow, { trustedOrigin: resolvedOrigin, apiBase: apiBase !== null && apiBase !== void 0 ? apiBase : resolveApiBase(resolvedOrigin), children: children }));
     }
-    return (_jsx(StandaloneFlow, { apiBase: apiBase, defaultOrganizationId: defaultOrganizationId, objectKey: objectKey, level: level, children: children }));
+    // Standalone: there is no host, so the page's own origin decides.
+    return (_jsx(StandaloneFlow, { apiBase: apiBase !== null && apiBase !== void 0 ? apiBase : resolveApiBase(resolvePageOrigin()), defaultOrganizationId: defaultOrganizationId, objectKey: objectKey, level: level, children: children }));
 }
+// ---------------------------------------------------------------------------
+// Embed flow (iframe + postMessage)
+// ---------------------------------------------------------------------------
 function EmbedFlow({ trustedOrigin, apiBase, children, }) {
-    const [phase, setPhase] = useState({ step: 'waiting_for_code' });
-    const refreshTimerRef = useRef(null);
-    const exchangingRef = useRef(false);
-    const failureCountRef = useRef(0);
     const normalizedBase = useMemo(() => apiBase.replace(/\/+$/, ''), [apiBase]);
-    const clearRefreshTimer = useCallback(() => {
-        if (refreshTimerRef.current != null) {
-            clearTimeout(refreshTimerRef.current);
-            refreshTimerRef.current = null;
-        }
-    }, []);
-    const scheduleRefresh = useCallback((expiresInSeconds) => {
-        clearRefreshTimer();
-        const refreshAfterMs = (expiresInSeconds - REFRESH_BUFFER_SECONDS) * 1000;
-        if (refreshAfterMs <= 0) {
-            sendToHost({ type: 'sfa-kit:code-request' }, trustedOrigin);
-            return;
-        }
-        refreshTimerRef.current = setTimeout(() => {
-            sendToHost({ type: 'sfa-kit:code-request' }, trustedOrigin);
-        }, refreshAfterMs);
-    }, [trustedOrigin, clearRefreshTimer]);
-    const handleCodeReceived = useCallback((code, context) => __awaiter(this, void 0, void 0, function* () {
-        if (exchangingRef.current)
-            return;
-        exchangingRef.current = true;
-        setPhase({ step: 'exchanging' });
-        try {
-            const session = yield exchangeCode(normalizedBase, code);
-            failureCountRef.current = 0;
-            setPhase({ step: 'authenticated', session, context });
-            const expiresInSeconds = Math.max(0, Math.floor((session.expiresAt - Date.now()) / 1000));
-            scheduleRefresh(expiresInSeconds);
-        }
-        catch (thrown) {
-            failureCountRef.current += 1;
-            if (failureCountRef.current >= MAX_CONSECUTIVE_FAILURES) {
-                setPhase({ step: 'session_expired' });
-            }
-            else {
-                const message = thrown instanceof Error ? thrown.message : 'Code exchange failed';
-                setPhase({ step: 'error', message });
-            }
-        }
-        finally {
-            exchangingRef.current = false;
-        }
-    }), [normalizedBase, scheduleRefresh]);
-    const handleAuthError = useCallback(() => {
-        clearRefreshTimer();
-        failureCountRef.current += 1;
-        if (failureCountRef.current >= MAX_CONSECUTIVE_FAILURES) {
-            setPhase({ step: 'session_expired' });
-            return;
-        }
-        sendToHost({ type: 'sfa-kit:code-request' }, trustedOrigin);
-        setPhase({ step: 'waiting_for_code' });
-    }, [trustedOrigin, clearRefreshTimer]);
-    useEffect(() => {
-        const handleMessage = (event) => {
-            var _a;
-            const parsed = parseInboundMessage(event, trustedOrigin);
-            if (!parsed)
-                return;
-            if (parsed.type === 'sfa-kit:code') {
-                void handleCodeReceived(parsed.code, (_a = parsed.context) !== null && _a !== void 0 ? _a : null);
-            }
-        };
-        window.addEventListener('message', handleMessage);
-        sendToHost({ type: 'sfa-kit:ready' }, trustedOrigin);
-        // If the host never sends a code (e.g. mintSfaKitExchangeCode is not
-        // implemented or the host page doesn't support the embed protocol),
-        // show an error instead of hanging on "Connecting..." forever.
-        const codeTimeout = setTimeout(() => {
-            setPhase(current => {
-                if (current.step !== 'waiting_for_code')
-                    return current;
-                return {
-                    step: 'error',
-                    message: 'SFA/CRM との接続がタイムアウトしました。ページを再読み込みしてください。',
-                };
-            });
-        }, CODE_TIMEOUT_SECONDS * 1000);
-        return () => {
-            window.removeEventListener('message', handleMessage);
-            clearTimeout(codeTimeout);
-            clearRefreshTimer();
-        };
-    }, [trustedOrigin, handleCodeReceived, clearRefreshTimer]);
+    const { phase, handleAuthError } = useEmbedSession({
+        apiBase: normalizedBase,
+        trustedOrigin,
+    });
     const auth = useMemo(() => {
         if (phase.step !== 'authenticated')
             return null;
@@ -182,7 +125,10 @@ function EmbedFlow({ trustedOrigin, apiBase, children, }) {
         return (_jsx(EmbedStatus, { title: "\u30BB\u30C3\u30B7\u30E7\u30F3\u671F\u9650\u5207\u308C", message: "SFA/CRM \u306E\u30BB\u30C3\u30B7\u30E7\u30F3\u304C\u7D42\u4E86\u3057\u307E\u3057\u305F\u3002\u30DA\u30FC\u30B8\u3092\u518D\u8AAD\u307F\u8FBC\u307F\u3057\u3066\u304F\u3060\u3055\u3044\u3002", showReload: true }));
     }
     if (phase.step === 'error') {
-        return (_jsx(EmbedStatus, { title: "\u63A5\u7D9A\u30A8\u30E9\u30FC", message: phase.message, showReload: true }));
+        return (_jsx(EmbedStatus, { title: "\u63A5\u7D9A\u30A8\u30E9\u30FC", message: phase.message, showReload: phase.canRecoverByReload }));
+    }
+    if (phase.step === 'reconnecting') {
+        return (_jsx(EmbedStatus, { title: "\u518D\u63A5\u7D9A\u4E2D...", message: "SFA/CRM \u3078\u306E\u63A5\u7D9A\u306B\u5931\u6557\u3057\u307E\u3057\u305F\u3002\u81EA\u52D5\u7684\u306B\u518D\u8A66\u884C\u3057\u3066\u3044\u307E\u3059\u3002" }));
     }
     if (phase.step === 'waiting_for_code' || phase.step === 'exchanging') {
         return (_jsx(EmbedStatus, { title: phase.step === 'exchanging' ? '認証中...' : 'SFA/CRM に接続中...', message: "\u30DB\u30B9\u30C8\u30A2\u30D7\u30EA\u30B1\u30FC\u30B7\u30E7\u30F3\u304B\u3089\u306E\u5FDC\u7B54\u3092\u5F85\u3063\u3066\u3044\u307E\u3059\u3002" }));
@@ -195,14 +141,25 @@ function EmbedStatus({ title, message, showReload, }) {
     const handleReload = useCallback(() => {
         window.location.reload();
     }, []);
-    return (_jsx("div", { style: styles.backdrop, children: _jsxs("div", { style: Object.assign(Object.assign({}, styles.card), { textAlign: 'center' }), children: [_jsxs("div", { style: loginStyles.logoGroup, children: [_jsx(GenieeLogoMark, {}), _jsxs("div", { style: loginStyles.logoText, children: [_jsx("span", { style: loginStyles.logoGeniee, children: "GENIEE" }), _jsx("span", { style: loginStyles.logoProduct, children: "SFA/CRM" })] })] }), _jsx("h2", { style: styles.title, children: title }), _jsx("p", { style: styles.subtitle, children: message }), showReload && (_jsx("button", { type: "button", style: styles.reloadButton, onClick: handleReload, children: "\u30DA\u30FC\u30B8\u3092\u518D\u8AAD\u307F\u8FBC\u307F" })), _jsxs("div", { style: styles.versionFooter, children: ["@geniee-inc/sfa-kit v", SFA_KIT_VERSION] })] }) }));
+    return (_jsx("div", { style: styles.backdrop, children: _jsxs("div", { role: "status", style: Object.assign(Object.assign({}, styles.card), { textAlign: 'center' }), children: [_jsxs("div", { style: loginStyles.logoGroup, children: [_jsx(GenieeLogoMark, {}), _jsxs("div", { style: loginStyles.logoText, children: [_jsx("span", { style: loginStyles.logoGeniee, children: "GENIEE" }), _jsx("span", { style: loginStyles.logoProduct, children: "SFA/CRM" })] })] }), _jsx("h2", { style: styles.title, children: title }), _jsx("p", { style: styles.subtitle, children: message }), showReload && (_jsx("button", { type: "button", style: styles.reloadButton, onClick: handleReload, children: "\u30DA\u30FC\u30B8\u3092\u518D\u8AAD\u307F\u8FBC\u307F" })), _jsxs("div", { style: styles.versionFooter, children: ["@geniee-inc/sfa-kit v", SFA_KIT_VERSION] })] }) }));
 }
 // ---------------------------------------------------------------------------
 // Standalone flow (login form + DevToolbar)
 // ---------------------------------------------------------------------------
 function StandaloneFlow({ apiBase, defaultOrganizationId, objectKey, level, children, }) {
-    const [session, setSession] = useState(() => loadSession());
-    const [activeBase, setActiveBase] = useState(() => { var _a; return (_a = session === null || session === void 0 ? void 0 : session.apiBase) !== null && _a !== void 0 ? _a : apiBase.replace(/\/+$/, ''); });
+    const normalizedBase = useMemo(() => apiBase.replace(/\/+$/, ''), [apiBase]);
+    const [session, setSession] = useState(() => {
+        const saved = loadSession();
+        // Discard a saved session whose apiBase does not match the current
+        // environment. Without this check a staging session could be reused
+        // when the page is opened from a production host (or vice-versa).
+        if ((saved === null || saved === void 0 ? void 0 : saved.apiBase) != null && saved.apiBase !== normalizedBase) {
+            clearSession();
+            return null;
+        }
+        return saved;
+    });
+    const [activeBase, setActiveBase] = useState(() => { var _a; return (_a = session === null || session === void 0 ? void 0 : session.apiBase) !== null && _a !== void 0 ? _a : normalizedBase; });
     const [status, setStatus] = useState('idle');
     const [error, setError] = useState(null);
     // NOTE: level を渡さない既存ページのために、objectKey の有無から補う。
@@ -308,7 +265,7 @@ function LoginForm({ defaultApiBase, defaultOrganizationId, onSubmit, status, er
             : undefined;
         onSubmit(email.trim(), password, apiBase.trim(), Number.isFinite(orgId) ? orgId : undefined);
     };
-    return (_jsx("div", { style: loginStyles.backdrop, children: _jsxs("form", { style: loginStyles.card, onSubmit: handleSubmit, children: [_jsxs("div", { style: loginStyles.logoGroup, children: [_jsx(GenieeLogoMark, {}), _jsxs("div", { style: loginStyles.logoText, children: [_jsx("span", { style: loginStyles.logoGeniee, children: "GENIEE" }), _jsx("span", { style: loginStyles.logoProduct, children: "SFA/CRM" })] })] }), error && (_jsx("div", { role: "alert", style: styles.error, children: error })), _jsxs("label", { style: loginStyles.label, children: [_jsx("span", { style: loginStyles.labelText, children: "\u30E1\u30FC\u30EB\u30A2\u30C9\u30EC\u30B9*" }), _jsx("input", { style: loginStyles.input, type: "text", value: email, onChange: e => setEmail(e.target.value), autoComplete: "email", required: true, disabled: status === 'loading' })] }), _jsxs("label", { style: loginStyles.label, children: [_jsx("span", { style: loginStyles.labelText, children: "\u30D1\u30B9\u30EF\u30FC\u30C9*" }), _jsx("input", { style: loginStyles.input, type: "password", value: password, onChange: e => setPassword(e.target.value), autoComplete: "current-password", required: true, disabled: status === 'loading' })] }), _jsx("button", { style: Object.assign(Object.assign({}, loginStyles.submitButton), { opacity: status === 'loading' ? 0.7 : 1 }), type: "submit", disabled: status === 'loading', children: status === 'loading' ? 'ログイン中...' : 'ログイン' }), _jsx("button", { type: "button", style: loginStyles.configToggle, onClick: () => setShowConfig(prev => !prev), children: showConfig ? '▾ 接続設定を隠す' : '▸ 接続設定' }), showConfig && (_jsxs("div", { style: loginStyles.configSection, children: [_jsxs("label", { style: loginStyles.label, children: [_jsx("span", { style: loginStyles.configLabel, children: "API Base" }), _jsx("input", { style: loginStyles.input, type: "text", value: apiBase, onChange: e => setApiBase(e.target.value), placeholder: "https://keystone-api-staging.chikyu.mobi", disabled: status === 'loading' })] }), _jsxs("label", { style: loginStyles.label, children: [_jsx("span", { style: loginStyles.configLabel, children: "Organization ID" }), _jsx("input", { style: loginStyles.input, type: "text", value: orgIdInput, onChange: e => setOrgIdInput(e.target.value), placeholder: "\u81EA\u52D5\u9078\u629E (\u7A7A\u6B04)", disabled: status === 'loading' })] })] })), _jsxs("div", { style: styles.versionFooter, children: ["@geniee-inc/sfa-kit v", SFA_KIT_VERSION] })] }) }));
+    return (_jsx("div", { style: loginStyles.backdrop, children: _jsxs("form", { style: loginStyles.card, onSubmit: handleSubmit, children: [_jsxs("div", { style: loginStyles.logoGroup, children: [_jsx(GenieeLogoMark, {}), _jsxs("div", { style: loginStyles.logoText, children: [_jsx("span", { style: loginStyles.logoGeniee, children: "GENIEE" }), _jsx("span", { style: loginStyles.logoProduct, children: "SFA/CRM" })] })] }), error && (_jsx("div", { role: "alert", style: styles.error, children: error })), _jsxs("label", { style: loginStyles.label, children: [_jsx("span", { style: loginStyles.labelText, children: "\u30E1\u30FC\u30EB\u30A2\u30C9\u30EC\u30B9*" }), _jsx("input", { style: loginStyles.input, type: "text", value: email, onChange: e => setEmail(e.target.value), autoComplete: "email", required: true, disabled: status === 'loading' })] }), _jsxs("label", { style: loginStyles.label, children: [_jsx("span", { style: loginStyles.labelText, children: "\u30D1\u30B9\u30EF\u30FC\u30C9*" }), _jsx("input", { style: loginStyles.input, type: "password", value: password, onChange: e => setPassword(e.target.value), autoComplete: "current-password", required: true, disabled: status === 'loading' })] }), _jsx("button", { style: Object.assign(Object.assign({}, loginStyles.submitButton), { opacity: status === 'loading' ? 0.7 : 1 }), type: "submit", disabled: status === 'loading', children: status === 'loading' ? 'ログイン中...' : 'ログイン' }), _jsx("button", { type: "button", style: loginStyles.configToggle, onClick: () => setShowConfig(prev => !prev), children: showConfig ? '▾ 接続設定を隠す' : '▸ 接続設定' }), showConfig && (_jsxs("div", { style: loginStyles.configSection, children: [_jsxs("label", { style: loginStyles.label, children: [_jsx("span", { style: loginStyles.configLabel, children: "API Base" }), _jsx("input", { style: loginStyles.input, type: "text", value: apiBase, onChange: e => setApiBase(e.target.value), placeholder: KEYSTONE_PRODUCTION_API_BASE, disabled: status === 'loading' })] }), _jsxs("label", { style: loginStyles.label, children: [_jsx("span", { style: loginStyles.configLabel, children: "Organization ID" }), _jsx("input", { style: loginStyles.input, type: "text", value: orgIdInput, onChange: e => setOrgIdInput(e.target.value), placeholder: "\u81EA\u52D5\u9078\u629E (\u7A7A\u6B04)", disabled: status === 'loading' })] })] })), _jsxs("div", { style: styles.versionFooter, children: ["@geniee-inc/sfa-kit v", SFA_KIT_VERSION] })] }) }));
 }
 // ---------------------------------------------------------------------------
 // Geniee logo mark (inline SVG)

package/src/lib/auth/resolve-api-base.d.ts

@@ -0,0 +1,19 @@
+export declare const KEYSTONE_PRODUCTION_API_BASE = "https://keystone-api-production.chikyu.mobi";
+export declare const KEYSTONE_STAGING_API_BASE = "https://keystone-api-staging.chikyu.mobi";
+/**
+ * @description Resolves the Keystone API base URL from an origin.
+ *
+ * Every non-production chikyu environment — `stg.chikyu.mobi`, the dev tier,
+ * local development, and Amplify PR previews — uses the staging Keystone API.
+ * Everything else — `app.chikyu.net`, an origin this table does not know, or
+ * no origin at all — uses production.
+ *
+ * Production is the fallback on purpose: a page that reaches a real customer
+ * must never silently talk to staging. A developer on an unrecognised host
+ * can still pass `apiBase` explicitly or type it into the standalone login form.
+ *
+ * Callers decide which origin to pass: the embedding host's origin when the
+ * page runs inside the SFA/CRM iframe, and the page's own origin when it runs
+ * standalone. A malformed origin is treated the same as no origin.
+ */
+export declare function resolveApiBase(origin: string | undefined): string;

package/src/lib/auth/resolve-api-base.js

@@ -0,0 +1,65 @@
+export const KEYSTONE_PRODUCTION_API_BASE = 'https://keystone-api-production.chikyu.mobi';
+export const KEYSTONE_STAGING_API_BASE = 'https://keystone-api-staging.chikyu.mobi';
+/** Dev-tier chikyu (legacy frontend) hosts: dev01-dev09, devdc, deva0, and the like. */
+const DEV_HOST_PATTERN = /^dev\w+\.chikyu\.mobi$/;
+/**
+ * Amplify-hosted new frontend. Covers PR previews
+ * (`pr-{id}.amplify.axiom.chikyu.mobi`, see amplify.yml) AND the dev / stg
+ * record-detail hosts that frame sfa-kit pages
+ * (`dev01.waf.amplify.axiom.chikyu.mobi`, `stg.waf.amplify.axiom.chikyu.mobi`).
+ * Keep this a suffix match: narrowing it to `pr-` would send every dev
+ * environment to production.
+ */
+const AMPLIFY_PATTERN = /\.amplify\.axiom\.chikyu\.mobi$/;
+/** Hostnames that are always a developer's own machine. */
+const LOCAL_HOSTNAMES = new Set([
+    'localhost',
+    '127.0.0.1',
+    '[::1]',
+    'dev.chikyu.local',
+    'dev-docker.chikyu.mobi',
+]);
+/** Shared pre-production chikyu environments. */
+const STAGING_HOSTNAMES = new Set(['stg.chikyu.mobi']);
+/**
+ * @description Resolves the Keystone API base URL from an origin.
+ *
+ * Every non-production chikyu environment — `stg.chikyu.mobi`, the dev tier,
+ * local development, and Amplify PR previews — uses the staging Keystone API.
+ * Everything else — `app.chikyu.net`, an origin this table does not know, or
+ * no origin at all — uses production.
+ *
+ * Production is the fallback on purpose: a page that reaches a real customer
+ * must never silently talk to staging. A developer on an unrecognised host
+ * can still pass `apiBase` explicitly or type it into the standalone login form.
+ *
+ * Callers decide which origin to pass: the embedding host's origin when the
+ * page runs inside the SFA/CRM iframe, and the page's own origin when it runs
+ * standalone. A malformed origin is treated the same as no origin.
+ */
+export function resolveApiBase(origin) {
+    const hostname = hostnameOf(origin);
+    if (hostname == null)
+        return KEYSTONE_PRODUCTION_API_BASE;
+    const isNonProduction = STAGING_HOSTNAMES.has(hostname) ||
+        LOCAL_HOSTNAMES.has(hostname) ||
+        DEV_HOST_PATTERN.test(hostname) ||
+        AMPLIFY_PATTERN.test(hostname);
+    return isNonProduction
+        ? KEYSTONE_STAGING_API_BASE
+        : KEYSTONE_PRODUCTION_API_BASE;
+}
+/** The hostname of an origin, or undefined when there is no usable origin. */
+function hostnameOf(origin) {
+    if (origin == null)
+        return undefined;
+    try {
+        // WHATWG URL preserves a trailing dot on FQDN hostnames (e.g.
+        // "stg.chikyu.mobi." stays as-is). Strip it so the allowlist and
+        // regex checks match regardless of whether the dot is present.
+        return new URL(origin).hostname.replace(/\.$/, '');
+    }
+    catch (_a) {
+        return undefined;
+    }
+}

package/src/lib/auth/useEmbedSession.d.ts

@@ -0,0 +1,49 @@
+import type { EmbedContext } from './embed-protocol';
+import type { SfaSession } from './types';
+export type EmbedPhase = {
+    step: 'waiting_for_code';
+} | {
+    step: 'exchanging';
+} | {
+    step: 'authenticated';
+    session: SfaSession;
+    context: EmbedContext | null;
+}
+/** 交換に失敗したが、まだ試行回数が残っている状態。自力で復帰しうる。 */
+ | {
+    step: 'reconnecting';
+} | {
+    step: 'session_expired';
+}
+/**
+ * 打ち切って画面を差し替えた状態。canRecoverByReload は再読み込みで
+ * 直りうるかどうか。設定の誤りのように直らない失敗で再読み込みを勧めると、
+ * 利用者は同じ操作を繰り返すことになる。
+ */
+ | {
+    step: 'error';
+    message: string;
+    canRecoverByReload: boolean;
+};
+export interface EmbedSessionState {
+    readonly phase: EmbedPhase;
+    /** Passed to SfaProvider so a 401 triggers the code-request fallback. */
+    readonly handleAuthError: () => void;
+}
+/**
+ * @description Keeps an embedded page authenticated over the postMessage
+ * code-exchange protocol: requests a code on mount, swaps the token before it
+ * expires, and falls back to a fresh code on 401.
+ *
+ * トークンを差し替えている間も phase は `authenticated` のまま据え置く。
+ * 状態画面に切り替えると子ツリーがアンマウントされ、埋め込みページの入力内容と
+ * React の状態が失われるため（authentication.md 条件 1）。
+ *
+ * 再要求は毎回 backoff 付きの見張りを伴う。手元のトークンが有効なうちは
+ * 諦めず、失効して規定回数を試し切った時点でセッション切れとして扱う
+ * （同 条件 3）。打ち切った後は isSettledRef で以降の遷移を止める。
+ */
+export declare function useEmbedSession({ apiBase, trustedOrigin, }: {
+    readonly apiBase: string;
+    readonly trustedOrigin: string;
+}): EmbedSessionState;

package/src/lib/auth/useEmbedSession.js

@@ -0,0 +1,404 @@
+import { __awaiter } from "tslib";
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { parseInboundMessage, sendToHost } from './embed-protocol';
+import { exchangeCode, ExchangeError } from './exchange-code';
+/** How many seconds before expiry a fresh code is requested from the host. */
+const REFRESH_BUFFER_SECONDS = 120;
+/**
+ * Fraction of the remaining lifetime used for the refresh timer when a token
+ * lives for less than REFRESH_BUFFER_SECONDS. A flat floor would only set the
+ * period of a permanent re-exchange loop, not stop it.
+ */
+const SHORT_TOKEN_REFRESH_RATIO = 0.5;
+/** Lower bound for the refresh timer. */
+const MIN_REFRESH_DELAY_SECONDS = 5;
+/** First wait before asking the host for a code again. */
+const CODE_RETRY_BASE_SECONDS = 5;
+/** Upper bound for the backoff between code requests. */
+const CODE_RETRY_MAX_SECONDS = 20;
+/** Seconds to wait for the host's first code before showing a connection error. */
+const CODE_TIMEOUT_SECONDS = 15;
+/** Consecutive failed attempts to obtain a usable session before giving up. */
+const MAX_RECOVERY_ATTEMPTS = 4;
+/**
+ * A 401 landing within this window of the previous one belongs to the same
+ * recovery run. Without it, a token Keystone happily mints but the API keeps
+ * rejecting loops forever, because every exchange succeeds and resets counters.
+ */
+const AUTH_ERROR_WINDOW_SECONDS = 30;
+/** 401-triggered recovery cycles allowed inside AUTH_ERROR_WINDOW_SECONDS. */
+const MAX_AUTH_ERROR_CYCLES = 3;
+/** An exchange still unsettled after this long is treated as abandoned. */
+const STALE_EXCHANGE_SECONDS = 20;
+/**
+ * Statuses below 500 that are still worth retrying. Every attempt asks the host
+ * for a fresh code, so a rejected code (401) can succeed on the next one.
+ * Everything else in the 4xx range (wrong apiBase, malformed request) fails
+ * identically however many times it is tried.
+ */
+const RETRYABLE_CLIENT_STATUSES = new Set([401, 408, 425, 429]);
+/**
+ * @description Whether asking for another code could plausibly succeed.
+ * Non-ExchangeError throws are network faults and aborts, which are transient.
+ */
+function isTransientExchangeFailure(thrown) {
+    if (!(thrown instanceof ExchangeError))
+        return true;
+    // 200 なのに本文が欠けていた場合。ゲートウェイが一度だけ返すことがあるので、
+    // 本文が JSON として壊れていた場合（SyntaxError）と同じ扱いにする。
+    if (thrown.httpStatus === 0)
+        return true;
+    if (thrown.httpStatus >= 500)
+        return true;
+    return RETRYABLE_CLIENT_STATUSES.has(thrown.httpStatus);
+}
+const CONNECT_FAILED_MESSAGE = 'SFA/CRM に接続できませんでした。ページを再読み込みしてください。';
+/**
+ * 何度試しても同じ結果になる失敗。再読み込みでは解消しないため、
+ * CONNECT_FAILED_MESSAGE とは別の案内を出す。
+ */
+const PERMANENT_FAILURE_MESSAGE = 'SFA/CRM に接続できませんでした。埋め込み設定を管理者にご確認ください。';
+/**
+ * @description 交換の失敗理由をコンソールに残す。画面には出さない。
+ * ExchangeError の message は応答本文をそのまま含むため、日本語の案内画面に
+ * 流すと利用者に読めない内容が出るうえ、カードの幅を越えて崩れる。
+ */
+function logExchangeFailure(thrown) {
+    // eslint-disable-next-line no-console
+    console.warn('[sfa-kit] code exchange failed:', thrown);
+}
+/**
+ * @description Keeps an embedded page authenticated over the postMessage
+ * code-exchange protocol: requests a code on mount, swaps the token before it
+ * expires, and falls back to a fresh code on 401.
+ *
+ * トークンを差し替えている間も phase は `authenticated` のまま据え置く。
+ * 状態画面に切り替えると子ツリーがアンマウントされ、埋め込みページの入力内容と
+ * React の状態が失われるため（authentication.md 条件 1）。
+ *
+ * 再要求は毎回 backoff 付きの見張りを伴う。手元のトークンが有効なうちは
+ * 諦めず、失効して規定回数を試し切った時点でセッション切れとして扱う
+ * （同 条件 3）。打ち切った後は isSettledRef で以降の遷移を止める。
+ */
+export function useEmbedSession({ apiBase, trustedOrigin, }) {
+    const [phase, setPhase] = useState({ step: 'waiting_for_code' });
+    const refreshTimerRef = useRef(null);
+    const retryTimerRef = useRef(null);
+    const exchangingRef = useRef(false);
+    const exchangeStartedAtRef = useRef(0);
+    /** 追い越された交換の結果で新しいセッションを上書きしないための世代番号。 */
+    const exchangeGenerationRef = useRef(0);
+    /**
+     * 直近に交換できたセッション。トークンがまだ有効かどうかの判定に使う。
+     * 401 を受け取った時点で null に戻す（期限内でもそのトークンは使えない）。
+     */
+    const sessionRef = useRef(null);
+    /** 使えるセッションを得られなかった連続回数。交換成功で 0 に戻す。 */
+    const recoveryAttemptsRef = useRef(0);
+    const authErrorCyclesRef = useRef(0);
+    /** 連鎖の起点。最後の 1 件ではなく最初の 1 件から窓を測る。 */
+    const authErrorRunStartedAtRef = useRef(0);
+    /**
+     * 401 を受けてコードを要求済みかどうか。SfaClient は 401 を返した
+     * リクエストごとに onAuthError を呼ぶため、並行リクエストの分をまとめる。
+     */
+    const isAuthErrorPendingRef = useRef(false);
+    const hasEverAuthenticatedRef = useRef(false);
+    /** 同じ復帰の試行でコンソールに書いたかどうか。交換成功で false に戻す。 */
+    const hasLoggedExchangeFailureRef = useRef(false);
+    /** 打ち切り済み。以降は再要求も画面遷移もしない。 */
+    const isSettledRef = useRef(false);
+    const clearRefreshTimer = useCallback(() => {
+        if (refreshTimerRef.current != null) {
+            clearTimeout(refreshTimerRef.current);
+            refreshTimerRef.current = null;
+        }
+    }, []);
+    const clearRetryTimer = useCallback(() => {
+        if (retryTimerRef.current != null) {
+            clearTimeout(retryTimerRef.current);
+            retryTimerRef.current = null;
+        }
+    }, []);
+    const isTokenUsable = useCallback(() => {
+        const session = sessionRef.current;
+        return session != null && session.expiresAt > Date.now();
+    }, []);
+    /** 打ち切って画面を差し替える。手元に使えるものが何も残っていないとき。 */
+    const settle = useCallback((next) => {
+        isSettledRef.current = true;
+        // 進行中の交換を無効化する。これが無いと、打ち切った後に解決した交換が
+        // authenticated を書き戻し、二度と操作できない画面が残る。
+        exchangeGenerationRef.current += 1;
+        clearRefreshTimer();
+        clearRetryTimer();
+        setPhase(next);
+    }, [clearRefreshTimer, clearRetryTimer]);
+    /**
+     * 状態画面は子ツリーがまだ描画されていないときだけ出す。認証済みの表示中は
+     * phase を動かさず、ページの状態をそのまま残す。打ち切り後も動かさない。
+     */
+    const showStatusIfNotMounted = useCallback((next) => {
+        if (isSettledRef.current)
+            return;
+        setPhase(current => (current.step === 'authenticated' ? current : next));
+    }, []);
+    /**
+     * 交換中であることを示す。すでに再接続中の表示なら据え置く。再試行のたびに
+     * 「認証中...」と「再接続中...」が入れ替わると、見出しが点滅して見えるため。
+     */
+    const showExchangingIfNotMounted = useCallback(() => {
+        if (isSettledRef.current)
+            return;
+        setPhase(current => current.step === 'authenticated' || current.step === 'reconnecting'
+            ? current
+            : { step: 'exchanging' });
+    }, []);
+    const sendCodeRequest = useCallback(() => {
+        sendToHost({ type: 'sfa-kit:code-request' }, trustedOrigin);
+    }, [trustedOrigin]);
+    /** 打ち切り後にトークンが切れた時点で next に落とすためのタイマー。 */
+    const scheduleExpiryCutoff = useCallback((next) => {
+        clearRefreshTimer();
+        const session = sessionRef.current;
+        if (session == null)
+            return;
+        refreshTimerRef.current = setTimeout(() => {
+            refreshTimerRef.current = null;
+            setPhase(next);
+        }, Math.max(0, session.expiresAt - Date.now()));
+    }, [clearRefreshTimer]);
+    /**
+     * 打ち切る。手元のトークンがまだ使えるなら描画済みの子ツリーを残し、
+     * 失効した時点で next に切り替える。使えるものが無ければその場で next を出す。
+     *
+     * next は打ち切った理由をそのまま表す。設定の誤りで再交換が詰んだ場合に
+     * 失効を待って「セッション期限切れ」を出すと、原因の見当がつかなくなる。
+     *
+     * トークンの有無の判定はここに閉じる。呼び出し側で分岐させると、据え置きの
+     * 経路だけを通って失効タイマーの無いまま固まる呼び方ができてしまう。
+     */
+    const stopRetrying = useCallback((next) => {
+        if (!isTokenUsable()) {
+            settle(next);
+            return;
+        }
+        isSettledRef.current = true;
+        exchangeGenerationRef.current += 1;
+        clearRetryTimer();
+        setPhase(current => (current.step === 'authenticated' ? current : next));
+        scheduleExpiryCutoff(next);
+    }, [clearRetryTimer, isTokenUsable, scheduleExpiryCutoff, settle]);
+    // 見張りは自分自身を再武装する。useCallback は自己参照できないため ref 経由。
+    const armCodeRetryRef = useRef(() => undefined);
+    /**
+     * コード要求に応答が無かった場合に備えて次の要求を仕込む。間隔は指数的に
+     * 広げ、揺らぎを加える。複数のタブが同じ間隔で一斉に再要求すると、弱った
+     * ホストと Keystone をそろって叩くことになるため。
+     */
+    const armCodeRetry = useCallback(() => {
+        if (isSettledRef.current)
+            return;
+        clearRetryTimer();
+        const backoffSeconds = Math.min(CODE_RETRY_BASE_SECONDS * Math.pow(2, recoveryAttemptsRef.current), CODE_RETRY_MAX_SECONDS);
+        const delayMs = backoffSeconds * 1000 * (0.75 + Math.random() * 0.5);
+        retryTimerRef.current = setTimeout(() => {
+            retryTimerRef.current = null;
+            if (isSettledRef.current)
+                return;
+            recoveryAttemptsRef.current += 1;
+            // トークンが生きているうちは諦めない。間隔だけ広げる。
+            if (!isTokenUsable() &&
+                recoveryAttemptsRef.current >= MAX_RECOVERY_ATTEMPTS) {
+                settle(hasEverAuthenticatedRef.current
+                    ? { step: 'session_expired' }
+                    : {
+                        step: 'error',
+                        message: CONNECT_FAILED_MESSAGE,
+                        canRecoverByReload: true,
+                    });
+                return;
+            }
+            sendCodeRequest();
+            armCodeRetryRef.current();
+        }, delayMs);
+    }, [clearRetryTimer, isTokenUsable, sendCodeRequest, settle]);
+    armCodeRetryRef.current = armCodeRetry;
+    /** コードを要求し、応答が無かったときのために次の要求を仕込む。 */
+    const requestCode = useCallback(() => {
+        sendCodeRequest();
+        armCodeRetry();
+    }, [sendCodeRequest, armCodeRetry]);
+    const scheduleRefresh = useCallback((expiresInSeconds) => {
+        clearRefreshTimer();
+        const lifetime = Number.isFinite(expiresInSeconds)
+            ? Math.max(0, expiresInSeconds)
+            : 0;
+        // 3 つの下限の最大値をとる。分岐で選ぶと 125 秒付近で不連続になり、
+        // 1 秒長いトークンの交換頻度が 10 倍になっていた。
+        const delaySeconds = Math.max(MIN_REFRESH_DELAY_SECONDS, lifetime - REFRESH_BUFFER_SECONDS, lifetime * SHORT_TOKEN_REFRESH_RATIO);
+        refreshTimerRef.current = setTimeout(() => {
+            refreshTimerRef.current = null;
+            requestCode();
+        }, delaySeconds * 1000);
+    }, [clearRefreshTimer, requestCode]);
+    const handleCodeReceived = useCallback((code, context) => __awaiter(this, void 0, void 0, function* () {
+        if (isSettledRef.current)
+            return;
+        const startedAt = Date.now();
+        // 決着しない交換に居座られてコードを取りこぼし続けないよう、古い交換は
+        // 見捨てる（authTimeoutSignal は AbortSignal.timeout が無い環境で
+        // undefined を返すため、fetch 側で必ず中断されるとは限らない）。
+        if (exchangingRef.current &&
+            startedAt - exchangeStartedAtRef.current < STALE_EXCHANGE_SECONDS * 1000) {
+            return;
+        }
+        exchangingRef.current = true;
+        exchangeStartedAtRef.current = startedAt;
+        const generation = (exchangeGenerationRef.current += 1);
+        // 交換中も見張りを残す。ここでタイマーを消すと、決着しない交換に
+        // 入った時点で armed なタイマーが 1 つも無くなり、復帰できなくなる。
+        armCodeRetry();
+        showExchangingIfNotMounted();
+        try {
+            const session = yield exchangeCode(apiBase, code);
+            if (exchangeGenerationRef.current !== generation)
+                return;
+            recoveryAttemptsRef.current = 0;
+            isAuthErrorPendingRef.current = false;
+            hasLoggedExchangeFailureRef.current = false;
+            hasEverAuthenticatedRef.current = true;
+            sessionRef.current = session;
+            // 交換中に 401 で仕込まれた見張りが生き残ると、成功後も 5 秒ごとに
+            // コードを要求し続けることになる。
+            clearRetryTimer();
+            setPhase(current => ({
+                step: 'authenticated',
+                session,
+                // context を省いた再交換で object_key / record_id を失わない。
+                context: context !== null && context !== void 0 ? context : (current.step === 'authenticated' ? current.context : null),
+            }));
+            scheduleRefresh(Math.max(0, Math.floor((session.expiresAt - Date.now()) / 1000)));
+        }
+        catch (thrown) {
+            if (exchangeGenerationRef.current !== generation)
+                return;
+            // 同じ復帰の試行が続く間は 1 回だけ出す。トークンが生きている間は
+            // 20 秒ごとに再交換を続けるため、毎回書くとホストのコンソールが埋まる。
+            if (!hasLoggedExchangeFailureRef.current) {
+                hasLoggedExchangeFailureRef.current = true;
+                logExchangeFailure(thrown);
+            }
+            // 何度やっても通らない失敗。使い捨てコードを浪費しない。
+            if (!isTransientExchangeFailure(thrown)) {
+                stopRetrying({
+                    step: 'error',
+                    message: PERMANENT_FAILURE_MESSAGE,
+                    canRecoverByReload: false,
+                });
+                return;
+            }
+            // 試行回数は見張りのタイマー側だけで数える。ここでも足すと 1 周で
+            // 2 つ進み、実際にホストへ届く要求が半分になる。
+            if (isTokenUsable()) {
+                armCodeRetry();
+                return;
+            }
+            // ここはまだ打ち切っていない。error を出すと再読み込みボタン付きの
+            // 終了画面になるが、実際には最大 55 秒ほど再試行が続き、そのまま
+            // ログインできることがある。
+            showStatusIfNotMounted({ step: 'reconnecting' });
+            armCodeRetry();
+        }
+        finally {
+            if (exchangeGenerationRef.current === generation) {
+                exchangingRef.current = false;
+            }
+        }
+    }), [
+        apiBase,
+        scheduleRefresh,
+        armCodeRetry,
+        clearRetryTimer,
+        isTokenUsable,
+        stopRetrying,
+        showStatusIfNotMounted,
+        showExchangingIfNotMounted,
+    ]);
+    const handleAuthError = useCallback(() => {
+        if (isSettledRef.current)
+            return;
+        if (isAuthErrorPendingRef.current)
+            return;
+        isAuthErrorPendingRef.current = true;
+        const now = Date.now();
+        // 窓は連鎖の起点から測る。直近の 1 件から測ると、正常に復帰している
+        // 25 秒間隔の 401 でも窓が滑り続けて打ち切りに達してしまう。
+        if (now - authErrorRunStartedAtRef.current >
+            AUTH_ERROR_WINDOW_SECONDS * 1000) {
+            authErrorCyclesRef.current = 0;
+            authErrorRunStartedAtRef.current = now;
+        }
+        authErrorCyclesRef.current += 1;
+        // ここに達した時点で交換自体は通り続けている。その 401 は差し替え前の
+        // トークンで投げられたリクエストの遅れ着信であることが多く、手元では
+        // 見分けられない（onAuthError は拒否されたトークンを渡さない）。
+        // 動いているセッションを巻き添えにしない側を採る。
+        if (authErrorCyclesRef.current > MAX_AUTH_ERROR_CYCLES) {
+            // 手元のトークンが期限内なら表示は保ち、コードの取り直しだけをやめて、
+            // 失効した時点でセッション切れとして扱う。
+            //
+            // 据え置きにする必要がある。ホストは要求を受けてから非同期にコードを
+            // 発行するので、打ち切った後に以前の要求への応答が届く。交換を続けて
+            // しまうと更新タイマーが張り直され、打ち切りが無かったことになる。
+            // stopRetrying が世代を進めて以降のコードを無視させる。
+            stopRetrying({ step: 'session_expired' });
+            return;
+        }
+        clearRefreshTimer();
+        // 401 を返されたトークンは期限内でも使えない。保持判定から外す。
+        //
+        // NOTE: phase.session のトークンは差し替えるまで残る。SfaProvider に渡す
+        // auth は phase.session から作るため、ここで消すと auth が null になり
+        // 子ツリーが落ちる（それを避けるのがこの修正の目的）。復帰までの数秒は
+        // 無効なトークンでリクエストが失敗するが、トークンを外しても同じく
+        // 失敗するため、表示を保つ側を採る。
+        sessionRef.current = null;
+        requestCode();
+        showStatusIfNotMounted({ step: 'waiting_for_code' });
+    }, [requestCode, clearRefreshTimer, stopRetrying, showStatusIfNotMounted]);
+    useEffect(() => {
+        const handleMessage = (event) => {
+            var _a;
+            const parsed = parseInboundMessage(event, trustedOrigin);
+            if (!parsed)
+                return;
+            if (parsed.type === 'sfa-kit:code') {
+                void handleCodeReceived(parsed.code, (_a = parsed.context) !== null && _a !== void 0 ? _a : null);
+            }
+        };
+        window.addEventListener('message', handleMessage);
+        sendToHost({ type: 'sfa-kit:ready' }, trustedOrigin);
+        // If the host never sends a code (e.g. mintSfaKitExchangeCode is not
+        // implemented or the host page doesn't support the embed protocol),
+        // show an error instead of hanging on "Connecting..." forever.
+        const codeTimeout = setTimeout(() => {
+            setPhase(current => {
+                if (current.step !== 'waiting_for_code')
+                    return current;
+                return {
+                    step: 'error',
+                    message: 'SFA/CRM との接続がタイムアウトしました。ページを再読み込みしてください。',
+                    canRecoverByReload: true,
+                };
+            });
+        }, CODE_TIMEOUT_SECONDS * 1000);
+        return () => {
+            window.removeEventListener('message', handleMessage);
+            clearTimeout(codeTimeout);
+            clearRefreshTimer();
+            clearRetryTimer();
+        };
+    }, [trustedOrigin, handleCodeReceived, clearRefreshTimer, clearRetryTimer]);
+    return { phase, handleAuthError };
+}

package/src/lib/version.d.ts

@@ -1 +1 @@
-export declare const SFA_KIT_VERSION = "1.13.0";
+export declare const SFA_KIT_VERSION = "1.14.1";

package/src/lib/version.js

@@ -1,3 +1,3 @@
 // このファイルは libs/sfa-kit/scripts/sync-version.cjs が生成する。
 // 手で編集しないこと。バージョンを上げるときは libs/sfa-kit/package.json を変更する。
-export const SFA_KIT_VERSION = '1.13.0';
+export const SFA_KIT_VERSION = '1.14.1';