@donotdev/ui 0.0.2 → 0.0.4

package/dist/utils/useStripeBillingSafe.d.ts

@@ -3,18 +3,31 @@
  * @description Provides billing functionality when @donotdev/billing is installed,
  * gracefully degrades to no-op when not installed.
  *
- * **How it works:**
- * 1. Import @donotdev/billing (Vite aliases to empty module if not installed)
- * 2. Check if useStripeBilling export exists
- * 3. If exists → use real hook | If not → use stub
- *
- * **Why this pattern:**
- * - Vite aliases missing packages to empty modules at build time
- * - Decision is made ONCE at import time, never changes
- * - No conditional hook calls = no Rules of Hooks violations
- * - Real hook handles all runtime state (auth, consent) internally
- *
- * @version 0.0.1
+ * ## CRITICAL: DO NOT USE DYNAMIC IMPORTS
+ *
+ * This file MUST use sync `import * as billingModule from '@donotdev/billing'`
+ * at module level. DO NOT refactor to use async `import('@donotdev/billing').then(...)`.
+ *
+ * ### Why sync import is required:
+ *
+ * 1. **Bundler aliasing**: Vite/webpack alias missing packages to empty modules
+ *    at BUILD TIME. The import completes immediately (no async).
+ *
+ * 2. **Rules of Hooks**: If we use async dynamic import:
+ *    - First render: `realUseStripeBilling = null` → uses stub (0 hooks)
+ *    - Async completes: `realUseStripeBilling = useStripeBilling` → now has hooks
+ *    - Next render: React sees different hook count → CRASH
+ *
+ * 3. **Monorepo gotcha**: Dynamic imports resolve workspace packages even when
+ *    the consuming app doesn't have them as dependencies. This causes the
+ *    real hook to activate unexpectedly → Rules of Hooks violation.
+ *
+ * 4. **Decision is immutable**: With sync import, `billingModule?.useStripeBilling`
+ *    is evaluated ONCE at module load. It's either the real hook or undefined.
+ *    This never changes during the app lifecycle.
+ *
+ * @see docs/development/GRACEFUL_DEGRADATION.md
+ * @version 0.0.4
  * @since 0.0.1
  * @author AMBROISE PARK Consulting
  */
@@ -28,23 +41,22 @@ export type { BillingAuthState } from '@donotdev/billing';
  * - If not installed → returns degraded API values
  *
  * **IMPORTANT:** For `isAvailable` to return `true`, you must pass `authState`.
- * Without auth state, billing will return `isAvailable: false` until auth resolves.
+ * Without auth state, billing will return `isAvailable: false` until auth status is `ready`.
  *
  * @param key - Property name to access from billing API
- * @param authState - Auth state from useAuthSafe (user, initialized, authStateChecked)
+ * @param authState - Auth state from useAuthSafe (user, status)
  * @returns The billing API value, or degraded value if billing unavailable
  *
  * @example
  * ```typescript
  * // Get auth state first
  * const user = useAuthSafe('user');
- * const initialized = useAuthSafe('initialized');
- * const authStateChecked = useAuthSafe('authStateChecked');
- * const authState = { user, initialized, authStateChecked };
+ * const status = useAuthSafe('status'); // 'initializing' | 'ready' | 'degraded' | 'error'
+ * const authState = { user, status };
  *
  * // Pass to billing
  * const checkout = useStripeBillingSafe('checkout', authState);
- * const loading = useStripeBillingSafe('loading', authState);
+ * const billingStatus = useStripeBillingSafe('status', authState);
  * const isAvailable = useStripeBillingSafe('isAvailable', authState);
  * ```
  */

package/dist/utils/useStripeBillingSafe.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useStripeBillingSafe.d.ts","sourceRoot":"","sources":["../../src/utils/useStripeBillingSafe.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAIjD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAG1D,YAAY,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAoB1D;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,oBAAoB,CAAC,CAAC,SAAS,MAAM,UAAU,EAC7D,GAAG,EAAE,CAAC,EACN,SAAS,CAAC,EAAE,gBAAgB,GAC3B,UAAU,CAAC,CAAC,CAAC,CAKf;AAED;;GAEG;AACH,eAAO,MAAM,kBAAkB,SAA6C,CAAC"}
+{"version":3,"file":"useStripeBillingSafe.d.ts","sourceRoot":"","sources":["../../src/utils/useStripeBillingSafe.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AAEH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAIjD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAG1D,YAAY,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAoB1D;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,oBAAoB,CAAC,CAAC,SAAS,MAAM,UAAU,EAC7D,GAAG,EAAE,CAAC,EACN,SAAS,CAAC,EAAE,gBAAgB,GAC3B,UAAU,CAAC,CAAC,CAAC,CAKf;AAED;;GAEG;AACH,eAAO,MAAM,kBAAkB,SAA6C,CAAC"}

package/dist/utils/useStripeBillingSafe.js

@@ -17,23 +17,22 @@ function useStripeBillingStub(key) {
  * - If not installed → returns degraded API values
  *
  * **IMPORTANT:** For `isAvailable` to return `true`, you must pass `authState`.
- * Without auth state, billing will return `isAvailable: false` until auth resolves.
+ * Without auth state, billing will return `isAvailable: false` until auth status is `ready`.
  *
  * @param key - Property name to access from billing API
- * @param authState - Auth state from useAuthSafe (user, initialized, authStateChecked)
+ * @param authState - Auth state from useAuthSafe (user, status)
  * @returns The billing API value, or degraded value if billing unavailable
  *
  * @example
  * ```typescript
  * // Get auth state first
  * const user = useAuthSafe('user');
- * const initialized = useAuthSafe('initialized');
- * const authStateChecked = useAuthSafe('authStateChecked');
- * const authState = { user, initialized, authStateChecked };
+ * const status = useAuthSafe('status'); // 'initializing' | 'ready' | 'degraded' | 'error'
+ * const authState = { user, status };
  *
  * // Pass to billing
  * const checkout = useStripeBillingSafe('checkout', authState);
- * const loading = useStripeBillingSafe('loading', authState);
+ * const billingStatus = useStripeBillingSafe('status', authState);
  * const isAvailable = useStripeBillingSafe('isAvailable', authState);
  * ```
  */

package/dist/vite-routing/AppRoutes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppRoutes.d.ts","sourceRoot":"","sources":["../../src/vite-routing/AppRoutes.tsx"],"names":[],"mappings":"AAyDA,OAAO,EAAiB,KAAK,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAkFlE;;GAEG;AACH,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,MAAM,EAAE,KAAK,CAAC;QACZ,IAAI,EAAE,MAAM,CAAC;QACb,SAAS,EAAE,GAAG,CAAC;QACf,IAAI,CAAC,EAAE,GAAG,CAAC;QACX,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;KACpB,CAAC,CAAC;CACJ;AAED;;GAEG;AACH,UAAU,sBAAsB;IAC9B,4CAA4C;IAC5C,WAAW,EAAE,UAAU,EAAE,CAAC;IAC1B,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oCAAoC;IACpC,MAAM,CAAC,EAAE,YAAY,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,sBAAsB,yCAgE9D"}
+{"version":3,"file":"AppRoutes.d.ts","sourceRoot":"","sources":["../../src/vite-routing/AppRoutes.tsx"],"names":[],"mappings":"AAoDA,OAAO,EAAiB,KAAK,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAsFlE;;GAEG;AACH,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,MAAM,EAAE,KAAK,CAAC;QACZ,IAAI,EAAE,MAAM,CAAC;QACb,SAAS,EAAE,GAAG,CAAC;QACf,IAAI,CAAC,EAAE,GAAG,CAAC;QACX,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;KACpB,CAAC,CAAC;CACJ;AAED;;GAEG;AACH,UAAU,sBAAsB;IAC9B,4CAA4C;IAC5C,WAAW,EAAE,UAAU,EAAE,CAAC;IAC1B,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oCAAoC;IACpC,MAAM,CAAC,EAAE,YAAY,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,sBAAsB,yCA8D9D"}

package/dist/vite-routing/AppRoutes.js

@@ -32,7 +32,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
  * - **Suspense Boundaries**: Proper loading states prevent UI flicker
  * - **Native Scroll Restoration**: Built-in scroll position memory
  *
- * @version 0.0.2
+ * @version 0.0.3
  * @since 0.0.1
  * @author AMBROISE PARK Consulting
  * @license Commercial
@@ -46,7 +46,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
  * <RouterProvider router={router} />
  * ```
  */
-import { lazy, Suspense, } from 'react';
+import { lazy, Suspense } from 'react';
 import { createBrowserRouter } from 'react-router-dom';
 import {} from '@donotdev/core';
 import { RootLayout } from './RootLayout';
@@ -87,7 +87,7 @@ const LazyRoute = ({ component, path }) => {
         lazyComponentCache.set(path, lazy(component));
     }
     const Component = lazyComponentCache.get(path);
-    return _jsx(Component, {});
+    return (_jsx(Suspense, { fallback: _jsx(Loader, {}), children: _jsx(Component, {}) }));
 };
 /**
  * Parse auth configuration to PageAuth | false for AuthGuard
@@ -177,9 +177,9 @@ export function createAppRouter(options) {
             element: _jsx(RootLayout, { layout: layout }),
             children: [
                 {
-                    /** HomePage route - discovered from HomePage.tsx */
+                    /** HomePage route - lazy loaded, public (no AuthGuard) */
                     index: true,
-                    element: homePageRoute.parsedAuth === false ? (_jsx(LazyRoute, { component: homePageRoute.component, path: homePageRoute.path })) : (_jsx(AuthGuard, { auth: homePageRoute.parsedAuth, children: _jsx(LazyRoute, { component: homePageRoute.component, path: homePageRoute.path }) })),
+                    element: (_jsx(LazyRoute, { component: homePageRoute.component, path: homePageRoute.path })),
                 },
                 /** All other routes are discovered and rendered here */
                 ...routesWithParsedAuth

package/dist/vite-routing/RootLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RootLayout.d.ts","sourceRoot":"","sources":["../../src/vite-routing/RootLayout.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AA8JnD;;GAEG;AACH,UAAU,oBAAoB;IAC5B,2BAA2B;IAC3B,MAAM,CAAC,EAAE,YAAY,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,EAAE,oBAAoB,2CAmC1D"}
+{"version":3,"file":"RootLayout.d.ts","sourceRoot":"","sources":["../../src/vite-routing/RootLayout.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAuLnD;;GAEG;AACH,UAAU,oBAAoB;IAC5B,2BAA2B;IAC3B,MAAM,CAAC,EAAE,YAAY,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,EAAE,oBAAoB,2CA6B1D"}

package/dist/vite-routing/RootLayout.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 // packages/ui/src/vite-routing/RootLayout.tsx
 /**
  * @fileoverview RootLayout - Root route layout component
@@ -18,11 +18,8 @@ import { Outlet, useLocation } from 'react-router-dom';
 import { globalEmitter, isClient } from '@donotdev/core';
 import Loader from '../components/common/Loader';
 import { DnDevLayout } from '../internal/layout/DnDevLayout';
-// Lazy load providers and components
-const QueryProviders = lazy(() => import('@donotdev/core').then((m) => ({ default: m.QueryProviders })));
-const UIProviders = lazy(() => import('../internal/providers/UIProviders').then((m) => ({
-    default: m.UIProviders,
-})));
+import { UIProviders } from '../internal/providers/UIProviders';
+// Only lazy load non-critical components (not in render path)
 const AutoMetaTags = lazy(() => import('../internal/layout/components/AutoMetaTags').then((m) => ({
     default: m.default,
 })));
@@ -145,6 +142,36 @@ function FrameworkReadySignal({ children }) {
     }, []);
     return _jsx("div", { ref: frameworkRef, children: children });
 }
+/**
+ * RouteReadySignal - Signals when route content is painted
+ *
+ * Emits 'DNDEV_ROUTE_READY' event when route content (inside Suspense) is painted.
+ * Used in coordination with FrameworkReadySignal to time shell loader removal.
+ *
+ * Shell loader removed only when BOTH framework AND route are ready,
+ * preventing "late arrival" of route content after Header/Footer paint.
+ *
+ * @version 0.0.1
+ * @since 0.0.1
+ * @author AMBROISE PARK Consulting
+ */
+function RouteReadySignal({ children }) {
+    const hasSignaled = useRef(false);
+    useLayoutEffect(() => {
+        if (!isClient() || hasSignaled.current)
+            return;
+        // Wait for two animation frames to ensure paint completion
+        requestAnimationFrame(() => {
+            requestAnimationFrame(() => {
+                if (hasSignaled.current)
+                    return;
+                hasSignaled.current = true;
+                globalEmitter.emit('DNDEV_ROUTE_READY');
+            });
+        });
+    }, []);
+    return _jsx(_Fragment, { children: children });
+}
 /**
  * RootLayout - Root route layout component
  *
@@ -179,5 +206,5 @@ function FrameworkReadySignal({ children }) {
  * @author AMBROISE PARK Consulting
  */
 export function RootLayout({ layout }) {
-    return (_jsx(QueryProviders, { children: _jsxs(UIProviders, { children: [_jsx(AutoMetaTags, {}), _jsxs(FrameworkReadySignal, { children: [_jsx(DnDevLayout, { layout: layout, children: _jsx(Suspense, { fallback: _jsx(Loader, {}), children: _jsx(Outlet, {}) }) }), _jsx(CustomScrollRestoration, {}), _jsx(ConsentBanner, {}), _jsx(PWAUpdateNotification, {}), _jsx(LicenseWatermark, {})] })] }) }));
+    return (_jsxs(UIProviders, { children: [_jsx(Suspense, { fallback: null, children: _jsx(AutoMetaTags, {}) }), _jsxs(FrameworkReadySignal, { children: [_jsx(DnDevLayout, { layout: layout, children: _jsx(RouteReadySignal, { children: _jsx(Outlet, {}) }) }), _jsx(CustomScrollRestoration, {}), _jsxs(Suspense, { fallback: null, children: [_jsx(ConsentBanner, {}), _jsx(PWAUpdateNotification, {}), _jsx(LicenseWatermark, {})] })] })] }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@donotdev/ui",
-  "version": "0.0.2",
+  "version": "0.0.4",
   "type": "module",
   "private": false,
   "license": "SEE LICENSE IN LICENSE.md",
@@ -53,14 +53,14 @@
     "react-hook-form": "^7.68.0"
   },
   "peerDependencies": {
-    "@donotdev/adv-comps": "0.0.2",
-    "@donotdev/auth": "0.0.2",
-    "@donotdev/billing": "0.0.2",
-    "@donotdev/components": "0.0.2",
-    "@donotdev/core": "0.0.2",
-    "@donotdev/crud": "0.0.2",
-    "@donotdev/firebase": "0.0.2",
-    "@donotdev/oauth": "0.0.2",
+    "@donotdev/adv-comps": "0.0.4",
+    "@donotdev/auth": "0.0.4",
+    "@donotdev/billing": "0.0.4",
+    "@donotdev/components": "0.0.4",
+    "@donotdev/core": "0.0.4",
+    "@donotdev/crud": "0.0.4",
+    "@donotdev/firebase": "0.0.4",
+    "@donotdev/oauth": "0.0.4",
     "firebase": "^12.5.0",
     "lucide-react": "^0.562.0",
     "react": "^19.2.3",

package/dist/internal/devtools/components/AuthTab.d.ts

@@ -1,2 +0,0 @@
-export declare const AuthTab: () => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=AuthTab.d.ts.map

package/dist/internal/devtools/components/AuthTab.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"AuthTab.d.ts","sourceRoot":"","sources":["../../../../src/internal/devtools/components/AuthTab.tsx"],"names":[],"mappings":"AAiCA,eAAO,MAAM,OAAO,+CAyNnB,CAAC"}

package/dist/internal/devtools/components/AuthTab.js

@@ -1,98 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-// packages/ui/src/internal/devtools/components/AuthTab.tsx
-/**
- * @fileoverview Auth Tab Component
- * @description User-friendly authentication and OAuth debugging for consumers
- *
- * @version 0.0.1
- * @since 0.0.1
- * @author AMBROISE PARK Consulting
- */
-import { useState, useMemo } from 'react';
-import { Card, CARD_VARIANT, Badge, BADGE_VARIANT, Button, BUTTON_VARIANT, DescriptionList, Alert, ALERT_VARIANT, Text, Stack, } from '@donotdev/components';
-import { getDndevConfig } from '@donotdev/core';
-import { useAuthSafe } from '../../../utils/useAuthSafe';
-import { discoverEnvVarsByPattern } from '../utils';
-import { MaskedValue } from './MaskedValue';
-export const AuthTab = () => {
-    const user = useAuthSafe('user');
-    const loading = useAuthSafe('loading');
-    const error = useAuthSafe('error');
-    const [isOAuthExpanded, setIsOAuthExpanded] = useState(false);
-    const config = getDndevConfig();
-    const envVars = config?.env || {};
-    const oauthVars = useMemo(() => discoverEnvVarsByPattern(envVars, [
-        '*OAUTH*',
-        '*GOOGLE*CLIENT*',
-        '*GITHUB*CLIENT*',
-        '*AUTH*PARTNER*',
-    ]), [envVars]);
-    const googleClientId = Object.entries(oauthVars).find(([key]) => key.toUpperCase().includes('GOOGLE') &&
-        key.toUpperCase().includes('CLIENT'))?.[1];
-    const githubClientId = Object.entries(oauthVars).find(([key]) => key.toUpperCase().includes('GITHUB') &&
-        key.toUpperCase().includes('CLIENT'))?.[1];
-    const authPartners = Object.entries(oauthVars).find(([key]) => key.toUpperCase().includes('AUTH') &&
-        key.toUpperCase().includes('PARTNER'))?.[1];
-    const getStatusBadge = () => {
-        if (loading)
-            return _jsx(Badge, { variant: BADGE_VARIANT.SECONDARY, children: "Loading" });
-        if (error)
-            return _jsx(Badge, { variant: BADGE_VARIANT.DESTRUCTIVE, children: "Error" });
-        if (user)
-            return _jsx(Badge, { children: "Signed In" });
-        return _jsx(Badge, { variant: BADGE_VARIANT.OUTLINE, children: "Not Signed In" });
-    };
-    const authStatusItems = [{ label: 'Status', value: getStatusBadge() }];
-    const userInfoItems = user
-        ? [
-            {
-                label: 'Email',
-                value: (_jsx(Text, { as: "span", className: "dndev-font-mono", children: user.email || 'N/A' })),
-            },
-            {
-                label: 'User ID',
-                value: (_jsx(Text, { as: "span", className: "dndev-font-mono dndev-text-xs", children: user.id })),
-            },
-            ...(user.displayName
-                ? [{ label: 'Display Name', value: user.displayName }]
-                : []),
-        ]
-        : [];
-    const oauthConfigItems = Object.keys(oauthVars).length > 0
-        ? Object.entries(oauthVars).map(([key, value]) => ({
-            label: key,
-            value: (_jsxs(Stack, { gap: "tight", children: [_jsx("div", { className: "dndev-flex dndev-items-center dndev-justify-between", children: _jsx(Badge, { children: "Configured" }) }), _jsx(MaskedValue, { keyName: key, value: String(value), textClassName: "dndev-font-mono dndev-text-xs dndev-text-muted-foreground" })] })),
-        }))
-        : [
-            {
-                label: 'OAuth Variables',
-                value: (_jsx(Text, { as: "span", className: "dndev-text-sm dndev-text-muted-foreground", children: "No OAuth environment variables detected. Add variables matching patterns: *OAUTH*, *GOOGLE*CLIENT*, *GITHUB*CLIENT*, *AUTH*PARTNER*" })),
-            },
-        ];
-    const setupSteps = [
-        {
-            title: '1. Firebase Console',
-            steps: [
-                _jsxs(_Fragment, { children: ["Go to", ' ', _jsx("a", { href: "https://console.firebase.google.com", target: "_blank", rel: "noopener noreferrer", className: "dndev-text-primary dndev-underline", children: "Firebase Console" })] }),
-                'Authentication → Sign-in method',
-                'Enable Google, GitHub, etc.',
-            ],
-        },
-        {
-            title: '2. GitHub OAuth',
-            steps: [
-                _jsxs(_Fragment, { children: ["Create OAuth App at", ' ', _jsx("a", { href: "https://github.com/settings/applications/new", target: "_blank", rel: "noopener noreferrer", className: "dndev-text-primary dndev-underline", children: "GitHub" })] }),
-                _jsxs(_Fragment, { children: ["Callback URL:", ' ', _jsx("code", { className: "dndev-bg-background dndev-px-sm dndev-rounded dndev-text-xs", children: "https://your-project.firebaseapp.com/__/auth/handler" })] }),
-                'Copy Client ID/Secret to Firebase',
-            ],
-        },
-        {
-            title: '3. Authorized Domains',
-            steps: [
-                'Add localhost, your-domain.com to Firebase Console → Authentication → Settings',
-            ],
-        },
-    ];
-    return (_jsxs(Stack, { gap: "medium", children: [_jsx(Card, { title: "Authentication Status", subtitle: "Current authentication state", children: _jsxs(Stack, { gap: "medium", children: [_jsx(DescriptionList, { items: authStatusItems }), user && (_jsx(Stack, { gap: "tight", children: _jsx(DescriptionList, { items: userInfoItems }) })), error && (_jsx(Alert, { variant: ALERT_VARIANT.ERROR, title: "Error", children: error.message }))] }) }), _jsx(Card, { title: "OAuth Configuration", subtitle: "OAuth provider setup status", children: _jsxs(Stack, { gap: "medium", children: [_jsx(DescriptionList, { items: oauthConfigItems }), _jsxs(Button, { onClick: () => setIsOAuthExpanded(!isOAuthExpanded), variant: BUTTON_VARIANT.OUTLINE, className: "dndev-w-full", children: [isOAuthExpanded ? 'Hide' : 'Show', " Setup Guide"] }), isOAuthExpanded && (_jsxs(Card, { variant: CARD_VARIANT.MUTED, className: "dndev-grid dndev-gap-md", children: [setupSteps.map((section, idx) => (_jsxs("div", { className: "dndev-grid dndev-gap-sm", children: [_jsx(Text, { as: "span", className: "dndev-font-semibold", children: section.title }), _jsx("ol", { className: "dndev-list dndev-list-decimal dndev-list-inside dndev-text-muted-foreground dndev-text-sm dndev-grid dndev-gap-xs", children: section.steps.map((step, stepIdx) => (_jsx("li", { children: step }, stepIdx))) })] }, idx))), _jsxs(Alert, { variant: ALERT_VARIANT.WARNING, children: [_jsx("strong", { children: "Note:" }), " 400 error = GitHub OAuth not configured in Firebase"] })] }))] }) })] }));
-};

package/dist/internal/devtools/components/ColorRatioTab.d.ts

@@ -1,2 +0,0 @@
-export declare const ColorRatioTab: () => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=ColorRatioTab.d.ts.map

package/dist/internal/devtools/components/ColorRatioTab.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ColorRatioTab.d.ts","sourceRoot":"","sources":["../../../../src/internal/devtools/components/ColorRatioTab.tsx"],"names":[],"mappings":"AAmCA,eAAO,MAAM,aAAa,+CAodzB,CAAC"}