@donotdev/ui 0.0.2 → 0.0.4

package/dist/internal/devtools/DebugTools.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DebugTools.d.ts","sourceRoot":"","sources":["../../../src/internal/devtools/DebugTools.tsx"],"names":[],"mappings":"AAgCA,UAAU,eAAe;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,UAAU,GAAI,eAAe,eAAe,4CAwNjD,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"DebugTools.d.ts","sourceRoot":"","sources":["../../../src/internal/devtools/DebugTools.tsx"],"names":[],"mappings":"AAgCA,UAAU,eAAe;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,UAAU,GAAI,eAAe,eAAe,4CA8NjD,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/internal/devtools/DebugTools.js

@@ -83,7 +83,9 @@ const DebugTools = ({ className }) => {
                 top: position?.y ?? 'calc(var(--header-height) + var(--gap-lg))',
                 cursor: isDragging ? 'grabbing' : 'grab',
                 minWidth: '20rem',
-            }, onMouseDown: handleMouseDown, children: _jsx(Card, { title: _jsxs(Stack, { direction: "row", align: "center", justify: "between", children: [_jsx(DebugDialog, {}), _jsx(Button, { onClick: () => setIsVisible(false), icon: X, variant: BUTTON_VARIANT.GHOST, title: "Hide Debug Tools" })] }), content: _jsx(_Fragment, { children: _jsxs(Stack, { direction: "row", align: "center", justify: "center", gap: "tight", wrap: "wrap", children: [_jsx(Button, { onClick: toggleDebug, variant: debugEnabled ? BUTTON_VARIANT.DEFAULT : BUTTON_VARIANT.OUTLINE, icon: Bug, title: `Display Lines (${debugEnabled ? 'ON' : 'OFF'})`, children: "Display Lines" }), _jsx(Button, { onClick: async () => {
+            }, onMouseDown: handleMouseDown, children: _jsx(Card, { title: _jsxs(Stack, { direction: "row", align: "center", justify: "between", children: [_jsx(DebugDialog, {}), _jsx(Button, { onClick: () => setIsVisible(false), icon: X, variant: BUTTON_VARIANT.GHOST, title: "Hide Debug Tools" })] }), content: _jsx(_Fragment, { children: _jsxs(Stack, { direction: "row", align: "center", justify: "center", gap: "tight", wrap: "wrap", children: [_jsx(Button, { onClick: toggleDebug, variant: debugEnabled
+                                    ? BUTTON_VARIANT.DEFAULT
+                                    : BUTTON_VARIANT.OUTLINE, icon: Bug, title: `Display Lines (${debugEnabled ? 'ON' : 'OFF'})`, children: "Display Lines" }), _jsx(Button, { onClick: async () => {
                                     try {
                                         // Reset consent (deletes cookie and resets store)
                                         reset();
@@ -103,8 +105,8 @@ const DebugTools = ({ className }) => {
                                             globalThis._DNDEV_STORES_) {
                                             globalThis._DNDEV_STORES_ = {};
                                         }
-                                        // ⚠️ Force hard reload (bypasses HMR to unmount all components)
-                                        window.location.href = window.location.href;
+                                        // ⚠️ Force hard reload (bypasses HMR cache)
+                                        window.location.reload();
                                     }
                                     catch (error) {
                                         console.error('Failed to clear cache:', error);
@@ -115,7 +117,9 @@ const DebugTools = ({ className }) => {
                                     }
                                 }, variant: hasConsented ? BUTTON_VARIANT.OUTLINE : BUTTON_VARIANT.GHOST, icon: Cookie, title: hasConsented
                                     ? 'Reset consent (show banner)'
-                                    : 'Consent banner visible', children: hasConsented ? 'Show Cookie Banner' : 'Cookie Banner Visible' })] }) }), footer: _jsx(Stack, { align: "center", justify: "center", className: cn('drag-handle', current === 'mobile' && 'dndev-text-destructive', current === 'tablet' && 'dndev-text-primary', current === 'desktop' && 'dndev-text-secondary-foreground', current === 'wide' && 'dndev-text-muted-foreground'), style: {
+                                    : 'Consent banner visible', children: hasConsented
+                                    ? 'Show Cookie Banner'
+                                    : 'Cookie Banner Visible' })] }) }), footer: _jsx(Stack, { align: "center", justify: "center", className: cn('drag-handle', current === 'mobile' && 'dndev-text-destructive', current === 'tablet' && 'dndev-text-primary', current === 'laptop' && 'dndev-text-secondary-foreground', current === 'desktop' && 'dndev-text-muted-foreground'), style: {
                         cursor: 'grab',
                     }, children: _jsxs(Label, { className: "dndev-font-mono dndev-text-lg", children: [current.toUpperCase(), " : ", width, " \u00D7 ", height, "px"] }) }) }) }) }));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"ConfigTab.d.ts","sourceRoot":"","sources":["../../../../src/internal/devtools/components/ConfigTab.tsx"],"names":[],"mappings":"AA0BA,eAAO,MAAM,SAAS,+CAmSrB,CAAC"}
+{"version":3,"file":"ConfigTab.d.ts","sourceRoot":"","sources":["../../../../src/internal/devtools/components/ConfigTab.tsx"],"names":[],"mappings":"AAwBA,eAAO,MAAM,SAAS,+CAqGrB,CAAC"}

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

@@ -3,159 +3,59 @@ import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 // packages/ui/src/internal/devtools/components/ConfigTab.tsx
 /**
  * @fileoverview Config Tab Component
- * @description Displays _DNDEV_CONFIG_ in a readable, future-proof format
+ * @description Framework config and environment variables
  *
- * @version 0.0.1
+ * @version 0.0.2
  * @since 0.0.1
  * @author AMBROISE PARK Consulting
  */
-import { useMemo } from 'react';
-import { Card, DescriptionList, Text, JsonViewer, Stack, ScrollArea, } from '@donotdev/components';
+import { Card, DescriptionList, Text, Badge, BADGE_VARIANT, Stack, } from '@donotdev/components';
 import { getDndevConfig, getConfigSource } from '@donotdev/core';
-import { maskSensitiveData } from '../utils/maskSensitive';
+import { MaskedValue } from './MaskedValue';
 export const ConfigTab = () => {
     const config = getDndevConfig();
     const source = getConfigSource();
-    const formattedConfig = useMemo(() => {
-        if (!config)
-            return null;
-        return {
-            platform: config.platform,
-            mode: config.mode,
-            version: config.version,
-            context: config.context,
-            timestamp: new Date(config.timestamp).toISOString(),
-            i18n: config.i18n
-                ? {
-                    languages: config.i18n.languages,
-                    fallback: config.i18n.fallback,
-                    eager: config.i18n.eager,
-                    totalNamespaces: config.i18n.manifest?.totalNamespaces,
-                    totalLanguages: config.i18n.manifest?.totalLanguages,
-                }
-                : null,
-            themes: config.themes
-                ? {
-                    discovered: config.themes.discovered?.length || 0,
-                    totalThemes: config.themes.manifest?.totalThemes || 0,
-                }
-                : null,
-            routes: config.routes
-                ? {
-                    discovered: config.routes.mapping?.length || 0,
-                    totalRoutes: config.routes.manifest?.totalRoutes || 0,
-                }
-                : null,
-            assets: config.assets
-                ? {
-                    discovered: config.assets.manifest?.totalAssets || 0,
-                }
-                : null,
-            pwa: config.pwa ? { enabled: true } : null,
-            features: config.features
-                ? {
-                    available: config.features.available?.length || 0,
-                }
-                : null,
-            env: config.env
-                ? {
-                    count: Object.keys(config.env).length,
-                    keys: Object.keys(config.env).slice(0, 10),
-                }
-                : null,
-        };
-    }, [config]);
+    const envVars = config?.env || {};
     if (!config) {
-        return (_jsx(Card, { title: "Config", subtitle: "Framework configuration", children: _jsxs(Text, { as: "span", className: "dndev-text-muted-foreground", children: ["Config not available. Source: ", source.source] }) }));
+        return (_jsx(Card, { title: "Config", subtitle: "Not available", children: _jsxs(Text, { className: "dndev-text-muted-foreground", children: ["Config not loaded. Source: ", source.source] }) }));
     }
     const frameworkItems = [
         {
             label: 'Platform',
-            value: (_jsx(Text, { as: "span", className: "dndev-font-mono", children: formattedConfig?.platform })),
+            value: _jsx(Badge, { variant: BADGE_VARIANT.SECONDARY, children: config.platform }),
         },
         {
             label: 'Mode',
-            value: (_jsx(Text, { as: "span", className: "dndev-font-mono", children: formattedConfig?.mode })),
+            value: (_jsx(Badge, { variant: config.mode === 'development'
+                    ? BADGE_VARIANT.DEFAULT
+                    : BADGE_VARIANT.SECONDARY, children: config.mode })),
         },
         {
             label: 'Version',
-            value: (_jsx(Text, { as: "span", className: "dndev-font-mono", children: formattedConfig?.version })),
+            value: (_jsx(Text, { className: "dndev-font-mono dndev-text-sm", children: config.version })),
         },
-        {
-            label: 'Context',
-            value: (_jsx(Text, { as: "span", className: "dndev-font-mono", children: formattedConfig?.context })),
+    ];
+    const summaryItems = [
+        config.themes && {
+            label: 'Themes',
+            value: (_jsx(Text, { className: "dndev-font-mono dndev-text-sm", children: config.themes.discovered?.length || 0 })),
         },
-        {
-            label: 'Generated',
-            value: (_jsx(Text, { as: "span", className: "dndev-font-mono dndev-text-xs", children: formattedConfig?.timestamp })),
+        config.routes && {
+            label: 'Routes',
+            value: (_jsx(Text, { className: "dndev-font-mono dndev-text-sm", children: config.routes.mapping?.length || 0 })),
         },
-    ];
-    const i18nItems = formattedConfig?.i18n
-        ? [
-            {
-                label: 'Languages',
-                value: (_jsx(Text, { as: "span", className: "dndev-font-mono", children: formattedConfig.i18n.languages.join(', ') })),
-            },
-            {
-                label: 'Fallback',
-                value: (_jsx(Text, { as: "span", className: "dndev-font-mono", children: formattedConfig.i18n.fallback })),
-            },
-            {
-                label: 'Eager Namespaces',
-                value: (_jsx(Text, { as: "span", className: "dndev-font-mono", children: formattedConfig.i18n.eager.join(', ') })),
-            },
-            {
-                label: 'Total Namespaces',
-                value: (_jsx(Text, { as: "span", className: "dndev-font-mono", children: formattedConfig.i18n.totalNamespaces })),
-            },
-            {
-                label: 'Total Languages',
-                value: (_jsx(Text, { as: "span", className: "dndev-font-mono", children: formattedConfig.i18n.totalLanguages })),
-            },
-        ]
-        : [];
-    const themesItems = formattedConfig?.themes
-        ? [
-            {
-                label: 'Discovered',
-                value: (_jsxs(Text, { as: "span", className: "dndev-font-mono", children: [formattedConfig.themes.discovered, " themes"] })),
-            },
-            {
-                label: 'Total Themes',
-                value: (_jsxs(Text, { as: "span", className: "dndev-font-mono", children: [formattedConfig.themes.totalThemes, " themes"] })),
-            },
-        ]
-        : [];
-    const routesItems = formattedConfig?.routes
-        ? [
-            {
-                label: 'Discovered',
-                value: (_jsxs(Text, { as: "span", className: "dndev-font-mono", children: [formattedConfig.routes.discovered, " routes"] })),
-            },
-            {
-                label: 'Total Routes',
-                value: (_jsxs(Text, { as: "span", className: "dndev-font-mono", children: [formattedConfig.routes.totalRoutes, " routes"] })),
-            },
-        ]
-        : [];
-    const featuresItems = formattedConfig?.features
-        ? [
-            {
-                label: 'Available',
-                value: (_jsxs(Text, { className: "dndev-font-mono", children: [formattedConfig.features.available, " features"] })),
-            },
-        ]
-        : [];
-    const envKeysItems = formattedConfig?.env
-        ? [
-            {
-                label: 'Variables',
-                value: (_jsxs(Stack, { gap: "tight", children: [_jsxs(Text, { as: "span", className: "dndev-font-mono", children: [formattedConfig.env.count, " variables"] }), _jsxs(Stack, { gap: "tight", className: "dndev-font-mono dndev-text-xs", children: [formattedConfig.env.keys.map((key) => (_jsx("div", { children: key }, key))), formattedConfig.env.count > 10 && (_jsxs(Text, { as: "span", className: "dndev-text-muted-foreground", children: ["... and ", formattedConfig.env.count - 10, " more"] }))] })] })),
-            },
-        ]
-        : [];
-    return (_jsxs(Stack, { gap: "medium", children: [_jsx(Card, { title: "Framework Config", subtitle: `Source: ${source.source} (${source.platform})`, children: _jsx(DescriptionList, { items: frameworkItems }) }), formattedConfig?.i18n && (_jsx(Card, { title: "i18n", children: _jsx(DescriptionList, { items: i18nItems }) })), formattedConfig?.themes && (_jsx(Card, { title: "Themes", children: _jsx(DescriptionList, { items: themesItems }) })), formattedConfig?.routes && (_jsx(Card, { title: "Routes", children: _jsx(DescriptionList, { items: routesItems }) })), formattedConfig?.features && (_jsx(Card, { title: "Features", children: _jsx(DescriptionList, { items: featuresItems }) })), formattedConfig?.env && (_jsx(Card, { title: "Environment Variables", subtitle: `${formattedConfig.env.count} variable${formattedConfig.env.count !== 1 ? 's' : ''} from config`, children: _jsx(DescriptionList, { items: envKeysItems }) })), _jsx(Card, { title: "Raw Config", subtitle: "Full config object (JSON, sensitive values masked)", children: _jsx(ScrollArea, { className: "dndev-max-h-96", children: _jsx(JsonViewer, { data: {
-                            ...config,
-                            env: config.env ? maskSensitiveData(config.env) : config.env,
-                        }, defaultDepth: 2, showCopyButton: true }) }) })] }));
+        config.i18n && {
+            label: 'Languages',
+            value: (_jsx(Text, { className: "dndev-font-mono dndev-text-sm", children: config.i18n.languages?.join(', ') })),
+        },
+        config.features && {
+            label: 'Features',
+            value: (_jsx(Text, { className: "dndev-font-mono dndev-text-sm", children: config.features.available?.length || 0 })),
+        },
+    ].filter(Boolean);
+    const envItems = Object.entries(envVars).map(([key, value]) => ({
+        label: _jsx(Text, { className: "dndev-font-mono dndev-text-xs", children: key }),
+        value: _jsx(MaskedValue, { keyName: key, value: String(value) }),
+    }));
+    return (_jsxs(Stack, { gap: "medium", style: { padding: 'var(--gap-md)' }, children: [_jsx(Card, { title: "Framework", subtitle: source.source, children: _jsx(DescriptionList, { items: frameworkItems }) }), summaryItems.length > 0 && (_jsx(Card, { title: "Discovery", children: _jsx(DescriptionList, { items: summaryItems }) })), envItems.length > 0 && (_jsx(Card, { title: "Environment", subtitle: `${envItems.length} variables`, children: _jsx(DescriptionList, { items: envItems }) }))] }));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"DebugDialog.d.ts","sourceRoot":"","sources":["../../../../src/internal/devtools/components/DebugDialog.tsx"],"names":[],"mappings":"AAwkCA,eAAO,MAAM,WAAW,+CAwIvB,CAAC"}
+{"version":3,"file":"DebugDialog.d.ts","sourceRoot":"","sources":["../../../../src/internal/devtools/components/DebugDialog.tsx"],"names":[],"mappings":"AA6BA,eAAO,MAAM,WAAW,+CAgFvB,CAAC"}