@yargram/react 1.0.0

package/dist/contexts/YahmanContext.js

@@ -0,0 +1,414 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createContext, useContext, useState, useCallback, useMemo, useId, useRef, useEffect, } from 'react';
+import { createPortal } from 'react-dom';
+import { createPrinter } from '@yahman/core';
+import { ApolloClient, ApolloProvider, InMemoryCache, } from '@apollo/client';
+import { getOperationAST, print } from 'graphql';
+import { ApiProvider, ApiContext } from './ApiContext';
+import { PrinterProvider } from './PrinterContext';
+import { useLogWindowShortcut } from '../hooks/useLogWindowShortcut';
+import { LogWindow } from '../components/LogWindow/LogWindow';
+import '../components/LogWindow/LogWindow.css';
+const AUTH_STORAGE_KEY = 'yahman_auth_token';
+const DEFAULT_TOKEN_TTL_MS = 7 * 24 * 60 * 60 * 1000; // 7日
+function isProductionOrStaging() {
+    if (typeof process === 'undefined')
+        return false;
+    const env = process.env?.NODE_ENV;
+    return env === 'production' || env === 'staging';
+}
+function isStorybook() {
+    if (typeof window === 'undefined')
+        return false;
+    const w = window;
+    return w.IS_STORYBOOK === true || Boolean(w.__STORYBOOK_CLIENT_API__);
+}
+function storybookSimulateProduction(prop) {
+    if (typeof window === 'undefined')
+        return false;
+    const w = window;
+    return prop === true || w.__YAHMAN_STORYBOOK_SIMULATE_PRODUCTION__ === true;
+}
+function getCurrentDomain() {
+    if (typeof window === 'undefined')
+        return '';
+    return window.location.hostname || '';
+}
+function loadPersistedAuth() {
+    if (typeof localStorage === 'undefined')
+        return false;
+    try {
+        const raw = localStorage.getItem(AUTH_STORAGE_KEY);
+        if (!raw)
+            return false;
+        const data = JSON.parse(raw);
+        if (data &&
+            typeof data === 'object' &&
+            'token' in data &&
+            'domain' in data &&
+            'expiresAt' in data &&
+            typeof data.domain === 'string' &&
+            typeof data.expiresAt === 'number') {
+            const { domain, expiresAt } = data;
+            const now = Date.now();
+            return domain === getCurrentDomain() && expiresAt > now;
+        }
+        return false;
+    }
+    catch {
+        return false;
+    }
+}
+function persistAuth(value, ttlMs = DEFAULT_TOKEN_TTL_MS) {
+    if (typeof localStorage === 'undefined')
+        return;
+    try {
+        if (value) {
+            const token = typeof crypto !== 'undefined' && crypto.randomUUID
+                ? crypto.randomUUID()
+                : `t-${Date.now()}-${Math.random().toString(36).slice(2)}`;
+            const domain = getCurrentDomain();
+            const expiresAt = Date.now() + ttlMs;
+            const data = { token, domain, expiresAt };
+            localStorage.setItem(AUTH_STORAGE_KEY, JSON.stringify(data));
+        }
+        else {
+            localStorage.removeItem(AUTH_STORAGE_KEY);
+        }
+    }
+    catch {
+        // ignore
+    }
+}
+/** デフォルトパスワード "12345678" の SHA-256 (hex) */
+const DEFAULT_PASSWORD_HASH = 'ef797c8118f02dfb649607dd5d3f8c7623048c9c063d532cc95c5ed7a898a64f';
+/**
+ * 環境変数からログイン用パスワードハッシュを取得。未設定時はデフォルト（12345678 の SHA-256）。
+ * パスワードを変更する場合は YAHMAN_LOGIN_PASSWORD_HASH または VITE_YAHMAN_LOGIN_PASSWORD_HASH に、
+ * 希望するパスワードの SHA-256 ハッシュ（hex）を設定する。
+ */
+function getAcceptedPasswordHash() {
+    const fromProcess = typeof process !== 'undefined' && process.env?.YAHMAN_LOGIN_PASSWORD_HASH
+        ? String(process.env.YAHMAN_LOGIN_PASSWORD_HASH).trim()
+        : '';
+    const meta = typeof import.meta !== 'undefined' ? import.meta : null;
+    const viteHash = meta?.env?.VITE_YAHMAN_LOGIN_PASSWORD_HASH;
+    const fromMeta = viteHash ? String(viteHash).trim() : '';
+    const fromEnv = fromProcess || fromMeta;
+    return fromEnv || DEFAULT_PASSWORD_HASH;
+}
+/** 文字列を SHA-256 でハッシュし hex 文字列で返す */
+async function sha256Hex(str) {
+    const buf = new TextEncoder().encode(str);
+    const hash = typeof crypto !== 'undefined' && crypto.subtle
+        ? await crypto.subtle.digest('SHA-256', buf)
+        : new Uint8Array(0);
+    return Array.from(new Uint8Array(hash))
+        .map((b) => b.toString(16).padStart(2, '0'))
+        .join('');
+}
+function resolveBody(body) {
+    if (body == null)
+        return undefined;
+    if (typeof body === 'string' ||
+        body instanceof ArrayBuffer ||
+        ArrayBuffer.isView(body) ||
+        body instanceof FormData ||
+        body instanceof URLSearchParams) {
+        return body;
+    }
+    return JSON.stringify(body);
+}
+const YahmanContext = createContext(null);
+/** 認証有効時の子要素ラッパー（ログアウトは LogWindow 内のボタンから行う） */
+function AuthEscapeToLogin({ children }) {
+    return _jsx(_Fragment, { children: children });
+}
+/** 認証時はログウィンドウをポータル表示。未認証時は LogWindow 内にパスワード画面（production/staging のみ） */
+function LogWindowGate({ instanceId, defaultPosition, loginTitle, isAuthenticated, login, logout, loginError, clearLoginError, logEntries, networkEntries, isLogWindowOpen, closeLogWindow, }) {
+    if (!isLogWindowOpen || typeof document === 'undefined') {
+        return null;
+    }
+    return createPortal(_jsx("div", { onClick: (e) => e.stopPropagation(), children: _jsx(LogWindow, { entries: logEntries, networkEntries: networkEntries, draggable: true, animateOnOpen: true, onClose: closeLogWindow, onLogout: isAuthenticated ? logout : undefined, defaultPosition: defaultPosition, showLogin: !isAuthenticated, loginTitle: loginTitle, onLogin: !isAuthenticated ? login : undefined, loginError: loginError, onClearLoginError: clearLoginError }, instanceId) }), document.body);
+}
+function generateId() {
+    return typeof crypto !== 'undefined' && crypto.randomUUID
+        ? crypto.randomUUID()
+        : `id-${Math.random().toString(36).slice(2)}`;
+}
+export function YahmanProvider({ children, api, printer = {}, logWindow, auth, }) {
+    const [logEntries, setLogEntries] = useState([]);
+    const [networkEntries, setNetworkEntries] = useState([]);
+    const instanceId = useId();
+    const simulateProduction = auth && typeof auth === 'object' && isStorybook() && storybookSimulateProduction(auth.storybookSimulateProduction);
+    const requiresAuth = auth && (auth === true || (typeof auth === 'object' && (auth.productionOnly !== false)))
+        ? isProductionOrStaging() || !!simulateProduction
+        : false;
+    const [isAuthenticated, setIsAuthenticated] = useState(() => auth && requiresAuth ? loadPersistedAuth() : false);
+    const [loginError, setLoginError] = useState(undefined);
+    useEffect(() => {
+        if (!requiresAuth)
+            return;
+        setIsAuthenticated(loadPersistedAuth());
+    }, [requiresAuth]);
+    const onLoginProp = auth && typeof auth === 'object' ? auth.onLogin : undefined;
+    const authPasswordHash = auth && typeof auth === 'object' && auth.passwordHash?.trim()
+        ? auth.passwordHash.trim()
+        : '';
+    const tokenTtlMs = auth && typeof auth === 'object' && auth.tokenTtlMs != null
+        ? auth.tokenTtlMs
+        : DEFAULT_TOKEN_TTL_MS;
+    const login = useCallback(async (password) => {
+        if (onLoginProp) {
+            await onLoginProp(password);
+            setLoginError(undefined);
+            setIsAuthenticated(true);
+            persistAuth(true, tokenTtlMs);
+        }
+        else {
+            if (!password)
+                throw new Error('Password is required.');
+            const inputHash = await sha256Hex(password);
+            const accepted = authPasswordHash || getAcceptedPasswordHash();
+            if (inputHash.toLowerCase() !== accepted.toLowerCase()) {
+                setLoginError('Invalid password.');
+            }
+            else {
+                setLoginError(undefined);
+                setIsAuthenticated(true);
+                persistAuth(true, tokenTtlMs);
+            }
+        }
+    }, [onLoginProp, authPasswordHash, tokenTtlMs]);
+    const logout = useCallback(() => {
+        setIsAuthenticated(false);
+        persistAuth(false);
+    }, []);
+    const handleLogin = useCallback(async (password) => {
+        setLoginError(undefined);
+        try {
+            await login(password);
+        }
+        catch (err) {
+            const message = err instanceof Error ? err.message : 'Login failed.';
+            setLoginError(message);
+            throw err;
+        }
+    }, [login]);
+    const clearLoginError = useCallback(() => setLoginError(undefined), []);
+    const addLogEntry = useCallback((entry) => {
+        const id = 'id' in entry && entry.id ? entry.id : generateId();
+        setLogEntries((prev) => [...prev, { ...entry, id }]);
+    }, []);
+    const addLogEntryRef = useRef(addLogEntry);
+    useEffect(() => {
+        addLogEntryRef.current = addLogEntry;
+    }, [addLogEntry]);
+    const addNetworkEntry = useCallback((entry) => {
+        const id = 'id' in entry && entry.id ? entry.id : generateId();
+        setNetworkEntries((prev) => [...prev, { ...entry, id }]);
+    }, []);
+    const env = printer.env ?? 'local';
+    const wrappedPrinter = useMemo(() => {
+        const base = createPrinter(env);
+        return {
+            info: (msg) => {
+                base.info(msg);
+                addLogEntryRef.current({ level: 'info', message: msg, source: 'app' });
+            },
+            warn: (msg) => {
+                base.warn(msg);
+                addLogEntryRef.current({ level: 'warn', message: msg, source: 'app' });
+            },
+            error: (msg) => {
+                base.error(msg);
+                addLogEntryRef.current({ level: 'error', message: msg, source: 'app' });
+            },
+        };
+    }, [env]);
+    const restBaseUrl = api.provider === 'rest'
+        ? (api.baseUrl ?? (typeof process !== 'undefined' ? process.env?.ENDPOINT_URL : '') ?? '')
+        : '';
+    const makeRestRequest = useCallback((method, path, body, options) => {
+        const url = restBaseUrl + path;
+        const isJson = body != null &&
+            typeof body === 'object' &&
+            !(body instanceof FormData) &&
+            !(body instanceof URLSearchParams);
+        const init = {
+            ...options,
+            method,
+            body: resolveBody(body),
+            headers: isJson ? { 'Content-Type': 'application/json', ...options?.headers } : options?.headers,
+        };
+        const requestStr = method === 'GET' || method === 'DELETE'
+            ? `${method} ${path}`
+            : body != null
+                ? typeof body === 'object' && !(body instanceof FormData) && !(body instanceof URLSearchParams)
+                    ? JSON.stringify(body)
+                    : String(body)
+                : `${method} ${path}`;
+        const addEntry = (status, statusText, response) => {
+            addNetworkEntry({
+                type: 'rest',
+                method,
+                url,
+                status,
+                statusText,
+                request: requestStr,
+                response,
+            });
+        };
+        return fetch(url, init)
+            .then(async (res) => {
+            const text = await res.clone().text().catch(() => '(read failed)');
+            addEntry(res.status, res.statusText, text);
+            return res;
+        })
+            .catch((err) => {
+            addEntry(0, 'Error', String(err?.message ?? err));
+            throw err;
+        });
+    }, [restBaseUrl, addNetworkEntry]);
+    const wrappedRestApi = useMemo(() => ({
+        provider: 'rest',
+        get: (path, options) => makeRestRequest('GET', path, undefined, options),
+        post: (path, body, options) => makeRestRequest('POST', path, body, options),
+        put: (path, body, options) => makeRestRequest('PUT', path, body, options),
+        delete: (path, options) => makeRestRequest('DELETE', path, undefined, options),
+    }), [makeRestRequest]);
+    const graphqlUri = api.provider === 'graphql'
+        ? (api.uri ?? (typeof process !== 'undefined' ? process.env?.GRAPHQL_URI : '') ?? '')
+        : '';
+    const graphqlClient = useMemo(() => {
+        if (api.provider !== 'graphql')
+            return null;
+        const clientOpt = api.client;
+        if (clientOpt)
+            return clientOpt;
+        return new ApolloClient({
+            uri: graphqlUri || '/graphql',
+            cache: new InMemoryCache(),
+        });
+    }, [api, graphqlUri]);
+    const wrappedGraphqlApi = useMemo(() => {
+        if (!graphqlClient || api.provider !== 'graphql')
+            return null;
+        const url = graphqlUri || '/graphql';
+        return {
+            provider: 'graphql',
+            ransack: (options) => {
+                const requestStr = JSON.stringify({
+                    query: print(options.query),
+                    variables: options.variables,
+                });
+                const op = getOperationAST(options.query);
+                const operationName = op?.name?.value ?? 'Query';
+                return graphqlClient
+                    .query(options)
+                    .then((result) => {
+                    addNetworkEntry({
+                        type: 'graphql',
+                        operationName,
+                        url,
+                        status: 200,
+                        statusText: 'OK',
+                        request: requestStr,
+                        response: JSON.stringify(result.data ?? result),
+                    });
+                    return result;
+                })
+                    .catch((err) => {
+                    addNetworkEntry({
+                        type: 'graphql',
+                        operationName,
+                        url,
+                        status: 0,
+                        statusText: 'Error',
+                        request: requestStr,
+                        response: String(err?.message ?? err),
+                    });
+                    throw err;
+                });
+            },
+            handing: (options) => {
+                const requestStr = JSON.stringify({
+                    mutation: print(options.mutation),
+                    variables: options.variables,
+                });
+                const op = getOperationAST(options.mutation);
+                const operationName = op?.name?.value ?? 'Mutation';
+                return graphqlClient
+                    .mutate(options)
+                    .then((result) => {
+                    addNetworkEntry({
+                        type: 'graphql',
+                        operationName,
+                        url,
+                        status: 200,
+                        statusText: 'OK',
+                        request: requestStr,
+                        response: JSON.stringify(result.data ?? result),
+                    });
+                    return result;
+                })
+                    .catch((err) => {
+                    addNetworkEntry({
+                        type: 'graphql',
+                        operationName,
+                        url,
+                        status: 0,
+                        statusText: 'Error',
+                        request: requestStr,
+                        response: String(err?.message ?? err),
+                    });
+                    throw err;
+                });
+            },
+        };
+    }, [graphqlClient, api.provider, graphqlUri, addNetworkEntry]);
+    const logWindowShortcut = useLogWindowShortcut(logWindow
+        ? {
+            escapeCount: 5,
+            resetAfterMs: 1500,
+            closeOnEscape: true,
+        }
+        : { escapeCount: 5, resetAfterMs: 1500 });
+    const { isOpen: isLogWindowOpen, close: closeLogWindow, open: openLogWindow } = logWindowShortcut;
+    const defaultLogWindowPosition = useMemo(() => ({
+        x: typeof window !== 'undefined' ? Math.max(0, (window.innerWidth - 696) / 2) : 100,
+        y: typeof window !== 'undefined' ? Math.max(0, (window.innerHeight - 466) / 2) : 100,
+    }), []);
+    const yahmanValue = useMemo(() => ({
+        addLogEntry,
+        addNetworkEntry,
+        openLogWindow,
+        closeLogWindow,
+        logEntries,
+        networkEntries,
+        isLogWindowOpen,
+    }), [
+        addLogEntry,
+        addNetworkEntry,
+        openLogWindow,
+        closeLogWindow,
+        logEntries,
+        networkEntries,
+        isLogWindowOpen,
+    ]);
+    const apiElement = api.provider === 'rest' ? (_jsx(ApiContext.Provider, { value: wrappedRestApi, children: children })) : wrappedGraphqlApi && graphqlClient ? (_jsx(ApolloProvider, { client: graphqlClient, children: _jsx(ApiContext.Provider, { value: wrappedGraphqlApi, children: children }) })) : (_jsx(ApiProvider, { provider: "graphql", uri: api.uri, client: api.client, children: children }));
+    /** 認証なしのときのみここでログウィンドウを表示。認証ありのときは LogWindowGate で表示 */
+    const logWindowElement = !auth &&
+        isLogWindowOpen &&
+        typeof document !== 'undefined' &&
+        createPortal(_jsx("div", { onClick: (e) => e.stopPropagation(), children: _jsx(LogWindow, { entries: logEntries, networkEntries: networkEntries, draggable: true, animateOnOpen: true, onClose: closeLogWindow, defaultPosition: defaultLogWindowPosition }, instanceId) }), document.body);
+    const content = (_jsx(PrinterProvider, { env: env, printer: wrappedPrinter, children: apiElement }));
+    return (_jsxs(YahmanContext.Provider, { value: yahmanValue, children: [auth ? (_jsxs(_Fragment, { children: [_jsx(AuthEscapeToLogin, { children: content }), _jsx(LogWindowGate, { instanceId: instanceId, defaultPosition: defaultLogWindowPosition, loginTitle: typeof auth === 'object' ? auth.loginTitle : undefined, isAuthenticated: isAuthenticated, login: handleLogin, logout: logout, loginError: loginError, clearLoginError: clearLoginError, logEntries: logEntries, networkEntries: networkEntries, isLogWindowOpen: isLogWindowOpen, closeLogWindow: closeLogWindow })] })) : (content), logWindowElement] }));
+}
+export function useYahman() {
+    const ctx = useContext(YahmanContext);
+    if (!ctx) {
+        throw new Error('useYahman must be used within YahmanProvider');
+    }
+    return ctx;
+}

package/dist/contexts/YahmanContext.stories.d.ts

@@ -0,0 +1,16 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { YahmanProvider } from './YahmanContext';
+declare const meta: Meta<typeof YahmanProvider>;
+export default meta;
+type Story = StoryObj<typeof YahmanProvider>;
+/** Api (REST) + Printer + LogWindow（Escape 5回で表示）。REST は JSONPlaceholder /posts を使用 */
+export declare const Default: Story;
+/**
+ * 本番時のみ認証（auth: true）。
+ * storybookSimulateProduction: true で Storybook 内だけ本番扱いし、ログイン画面を表示。
+ * 本番ビルド時は NODE_ENV=production で同様にログイン要求。
+ */
+export declare const WithAuthProductionOnly: Story;
+/** GraphQL: useApi().ransack (QUERY) / .handing (MUTATION) → Network */
+export declare const GraphQL: Story;
+//# sourceMappingURL=YahmanContext.stories.d.ts.map

package/dist/contexts/YahmanContext.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"YahmanContext.stories.d.ts","sourceRoot":"","sources":["../../src/contexts/YahmanContext.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,cAAc,EAAa,MAAM,iBAAiB,CAAC;AA4F5D,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,cAAc,CAKrC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,cAAc,CAAC,CAAC;AAE7C,uFAAuF;AACvF,eAAO,MAAM,OAAO,EAAE,KAUrB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,sBAAsB,EAAE,KAWpC,CAAC;AAEF,wEAAwE;AACxE,eAAO,MAAM,OAAO,EAAE,KAUrB,CAAC"}

package/dist/contexts/YahmanContext.stories.js

@@ -0,0 +1,64 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { gql } from '@apollo/client';
+import { YahmanProvider, useYahman } from './YahmanContext';
+import { usePrinter } from './PrinterContext';
+import { useApi } from './ApiContext';
+function DemoContent() {
+    const { openLogWindow } = useYahman();
+    const printer = usePrinter();
+    const api = useApi();
+    const addInfo = () => printer.info('Info from usePrinter');
+    const addWarn = () => printer.warn('Warn from usePrinter');
+    const addError = () => printer.error('Error from usePrinter');
+    if (api.provider === 'rest') {
+        return (_jsxs("div", { style: { padding: 24, fontFamily: 'sans-serif' }, children: [_jsx("h3", { children: "YahmanProvider \u30C7\u30E2 (REST)" }), _jsx("p", { children: "Escape \u30AD\u30FC\u3092 5 \u56DE\u62BC\u3059\u3068\u30ED\u30B0\u30A6\u30A3\u30F3\u30C9\u30A6\u304C\u958B\u304D\u307E\u3059\u3002" }), _jsx("p", { style: { fontSize: 12, color: '#666', marginTop: 8 }, children: "usePrinter().info / warn / error \u2192 Log \u30BF\u30D6\u3002useApi().get / post / put / delete \u2192 Network \u30BF\u30D6\u306B\u53CD\u6620\u3002" }), _jsxs("div", { style: { display: 'flex', gap: 8, flexWrap: 'wrap', marginTop: 16 }, children: [_jsx("button", { type: "button", onClick: addInfo, children: "Log: Info" }), _jsx("button", { type: "button", onClick: addWarn, children: "Log: Warn" }), _jsx("button", { type: "button", onClick: addError, children: "Log: Error" }), _jsx("button", { type: "button", onClick: () => api.get('/posts').then((res) => printer.info(`Response: ${res.status} ${res.statusText}`)).catch((err) => printer.error(`Error: ${err.message}`)), children: "Network: GET /posts" }), _jsx("button", { type: "button", onClick: () => api
+                                .post('/posts', { title: 'Storybook post', body: 'Body from demo', userId: 1 })
+                                .then((res) => printer.info(`Response: ${res.status} ${res.statusText}`))
+                                .catch((err) => printer.error(`Error: ${err.message}`)), children: "Network: POST /posts" }), _jsx("button", { type: "button", onClick: () => api
+                                .put('/posts/1', { id: 1, title: 'Updated title', body: 'Updated body', userId: 1 })
+                                .then((res) => printer.info(`Response: ${res.status} ${res.statusText}`))
+                                .catch((err) => printer.error(`Error: ${err.message}`)), children: "Network: PUT /posts/1" }), _jsx("button", { type: "button", onClick: () => api.delete('/posts/1').then((res) => printer.info(`Response: ${res.status} ${res.statusText}`)).catch(() => { }), children: "Network: DELETE /posts/1" }), _jsx("button", { type: "button", onClick: openLogWindow, children: "\u30ED\u30B0\u30A6\u30A3\u30F3\u30C9\u30A6\u3092\u958B\u304F" })] })] }));
+    }
+    const runQuery = () => {
+        api
+            .ransack({
+            query: gql `
+          query GetUser { user(id: "1") { id name } }
+        `,
+        })
+            .catch((err) => printer.error(`Error: ${err.message}`));
+    };
+    const runMutation = () => {
+        api
+            .handing({
+            mutation: gql `
+          mutation UpdateUser { updateUser(id: "1", name: "x") { id name } }
+        `,
+        })
+            .catch((err) => printer.error(`Error: ${err.message}`));
+    };
+    return (_jsxs("div", { style: { padding: 24, fontFamily: 'sans-serif' }, children: [_jsx("h3", { children: "YahmanProvider \u30C7\u30E2 (GraphQL)" }), _jsx("p", { children: "useApi().ransack (QUERY) / .handing (MUTATION) \u3067 Network \u30BF\u30D6\u306B\u53CD\u6620\u3002" }), _jsxs("div", { style: { display: 'flex', gap: 8, flexWrap: 'wrap', marginTop: 16 }, children: [_jsx("button", { type: "button", onClick: addInfo, children: "Log: Info" }), _jsx("button", { type: "button", onClick: runQuery, children: "Network: ransack (QUERY)" }), _jsx("button", { type: "button", onClick: runMutation, children: "Network: handing (MUTATION)" }), _jsx("button", { type: "button", onClick: openLogWindow, children: "\u30ED\u30B0\u30A6\u30A3\u30F3\u30C9\u30A6\u3092\u958B\u304F" })] })] }));
+}
+const meta = {
+    title: 'Contexts/YahmanProvider',
+    component: YahmanProvider,
+    parameters: { layout: 'centered' },
+    tags: ['autodocs'],
+};
+export default meta;
+/** Api (REST) + Printer + LogWindow（Escape 5回で表示）。REST は JSONPlaceholder /posts を使用 */
+export const Default = {
+    render: () => (_jsx(YahmanProvider, { api: { provider: 'rest', baseUrl: 'https://jsonplaceholder.typicode.com' }, printer: { env: 'local' }, logWindow: {}, children: _jsx(DemoContent, {}) })),
+};
+/**
+ * 本番時のみ認証（auth: true）。
+ * storybookSimulateProduction: true で Storybook 内だけ本番扱いし、ログイン画面を表示。
+ * 本番ビルド時は NODE_ENV=production で同様にログイン要求。
+ */
+export const WithAuthProductionOnly = {
+    render: () => (_jsx(YahmanProvider, { api: { provider: 'rest', baseUrl: 'https://jsonplaceholder.typicode.com' }, printer: { env: 'local' }, logWindow: {}, auth: { storybookSimulateProduction: true }, children: _jsx(DemoContent, {}) })),
+};
+/** GraphQL: useApi().ransack (QUERY) / .handing (MUTATION) → Network */
+export const GraphQL = {
+    render: () => (_jsx(YahmanProvider, { api: { provider: 'graphql', uri: 'https://api.example.com/graphql' }, printer: { env: 'local' }, logWindow: {}, children: _jsx(DemoContent, {}) })),
+};

package/dist/contexts/YargramContext.d.ts

@@ -0,0 +1,69 @@
+import React from 'react';
+import { ApolloClient } from '@apollo/client';
+import type { LogEntry, NetworkEntry } from '../components/LogWindow/types';
+import type { Env } from '@yargram/core';
+import type { NormalizedCacheObject } from '@apollo/client';
+import '../components/LogWindow/LogWindow.css';
+/** Api 設定（ApiProvider の props から children を除いたもの） */
+type YargramApiConfig = {
+    provider: 'rest';
+    baseUrl?: string;
+} | {
+    provider: 'graphql';
+    uri?: string;
+    client?: ApolloClient<NormalizedCacheObject>;
+};
+/** Printer 設定 */
+type YargramPrinterConfig = {
+    env?: Env;
+};
+/** LogWindow 設定（Escape 5 回で表示） */
+type YargramLogWindowConfig = Record<string, never>;
+/** 認証設定。本番のみログインを要求する場合は true、カスタム時はオブジェクト */
+type YargramAuthConfig = true | {
+    /** 本番時のみ認証（デフォルト true） */
+    productionOnly?: boolean;
+    /** Storybook 時のみ本番として扱う（ログイン要求する） */
+    storybookSimulateProduction?: boolean;
+    /** カスタム認証（指定時は onLogin で検証。未指定時は passwordHash または env でハッシュ比較） */
+    onLogin?: (password: string) => Promise<void>;
+    /** ログインウィンドウのタイトル */
+    loginTitle?: string;
+    /**
+     * ログイン用パスワードの SHA-256 ハッシュ（hex）。指定時は env より優先。
+     * 未指定時は YAHMAN_LOGIN_PASSWORD_HASH / VITE_YAHMAN_LOGIN_PASSWORD_HASH、それも無ければデフォルト（12345678 のハッシュ）。
+     */
+    passwordHash?: string;
+    /**
+     * ログイン後のトークン有効期限（ミリ秒）。未指定時は 7 日。
+     */
+    tokenTtlMs?: number;
+};
+type YargramContextValue = {
+    addLogEntry: (entry: Omit<LogEntry, 'id'> | LogEntry) => void;
+    addNetworkEntry: (entry: Omit<NetworkEntry, 'id'> | NetworkEntry) => void;
+    openLogWindow: () => void;
+    closeLogWindow: () => void;
+    logEntries: LogEntry[];
+    networkEntries: NetworkEntry[];
+    isLogWindowOpen: boolean;
+};
+export type YargramProviderProps = {
+    children: React.ReactNode;
+    /** Api 設定（REST または GraphQL） */
+    api: YargramApiConfig;
+    /** Printer 設定 */
+    printer?: YargramPrinterConfig;
+    /** LogWindow を Escape で出せるようにする設定。省略時は LogWindow 機能なし */
+    logWindow?: YargramLogWindowConfig;
+    /**
+     * 認証を有効にする。true のとき本番（NODE_ENV=production/staging）のみログインウィンドウを表示。
+     * オブジェクトで productionOnly / onLogin / loginTitle / passwordHash を指定可能。
+     * パスワードハッシュは auth.passwordHash → env（YAHMAN_LOGIN_PASSWORD_HASH 等）→ デフォルト（12345678 の SHA-256）の順で解決される。
+     */
+    auth?: YargramAuthConfig;
+};
+export declare function YargramProvider({ children, api, printer, logWindow, auth, }: YargramProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function useYargram(): YargramContextValue;
+export {};
+//# sourceMappingURL=YargramContext.d.ts.map

package/dist/contexts/YargramContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"YargramContext.d.ts","sourceRoot":"","sources":["../../src/contexts/YargramContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KASN,MAAM,OAAO,CAAC;AAGf,OAAO,EACL,YAAY,EAGb,MAAM,gBAAgB,CAAC;AAOxB,OAAO,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAC5E,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,KAAK,EAEV,qBAAqB,EAItB,MAAM,gBAAgB,CAAC;AACxB,OAAO,uCAAuC,CAAC;AAiI/C,qDAAqD;AACrD,KAAK,gBAAgB,GACjB;IAAE,QAAQ,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,CAAA;CAAE,GACtC;IACE,QAAQ,EAAE,SAAS,CAAC;IACpB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,YAAY,CAAC,qBAAqB,CAAC,CAAC;CAC9C,CAAC;AAEN,iBAAiB;AACjB,KAAK,oBAAoB,GAAG;IAC1B,GAAG,CAAC,EAAE,GAAG,CAAC;CACX,CAAC;AAEF,kCAAkC;AAClC,KAAK,sBAAsB,GAAG,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;AAEpD,8CAA8C;AAC9C,KAAK,iBAAiB,GAClB,IAAI,GACJ;IACE,0BAA0B;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,qCAAqC;IACrC,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC,kEAAkE;IAClE,OAAO,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9C,qBAAqB;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAEN,KAAK,mBAAmB,GAAG;IACzB,WAAW,EAAE,CAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,GAAG,QAAQ,KAAK,IAAI,CAAC;IAC9D,eAAe,EAAE,CAAC,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,GAAG,YAAY,KAAK,IAAI,CAAC;IAC1E,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,UAAU,EAAE,QAAQ,EAAE,CAAC;IACvB,cAAc,EAAE,YAAY,EAAE,CAAC;IAC/B,eAAe,EAAE,OAAO,CAAC;CAC1B,CAAC;AAIF,MAAM,MAAM,oBAAoB,GAAG;IACjC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,+BAA+B;IAC/B,GAAG,EAAE,gBAAgB,CAAC;IACtB,iBAAiB;IACjB,OAAO,CAAC,EAAE,oBAAoB,CAAC;IAC/B,yDAAyD;IACzD,SAAS,CAAC,EAAE,sBAAsB,CAAC;IACnC;;;;OAIG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAC;CAC1B,CAAC;AAkEF,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,GAAG,EACH,OAAY,EACZ,SAAS,EACT,IAAI,GACL,EAAE,oBAAoB,2CAgXtB;AAED,wBAAgB,UAAU,IAAI,mBAAmB,CAMhD"}