@e-burgos/tucu-ui 2.0.8 → 2.0.10

package/documentation/MFESupportSection-BHDOPkT0.js

@@ -1,354 +0,0 @@
-import { jsx as e, jsxs as r } from "react/jsx-runtime";
-import { C as t, a as o, T as a, ag as d, c as s } from "../index-D3gBsvbO.js";
-import { Box as n, Info as c, Code as l, Settings as p, Play as m, Zap as h, Shield as g, CheckCircle as i } from "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const C = () => /* @__PURE__ */ e("div", { className: "space-y-8", children: /* @__PURE__ */ e(t, { children: /* @__PURE__ */ e(o, { title: "Micro Frontends (MFE) Support", className: "mt-2 mb-6", children: /* @__PURE__ */ r("div", { className: "space-y-6", children: [
-  /* @__PURE__ */ r("div", { className: "flex items-center gap-3", children: [
-    /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-linear-to-br from-purple-500 to-indigo-500 shadow-lg", children: /* @__PURE__ */ e(n, { className: "w-5 h-5 text-white filter drop-shadow-sm" }) }),
-    /* @__PURE__ */ e(a, { tag: "h4", className: "font-semibold", children: "Micro Frontend (MFE) Pattern" })
-  ] }),
-  /* @__PURE__ */ r(a, { tag: "p", className: "text-gray-600 dark:text-gray-400", children: [
-    "The ",
-    /* @__PURE__ */ e("strong", { children: "Micro Frontend (MFE) Pattern" }),
-    " is designed for distributed architectures where multiple applications need to be deployed independently. It requires explicit route configuration with",
-    " ",
-    /* @__PURE__ */ e("code", { className: "px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs", children: "appRoutesConfig" }),
-    " ",
-    "and a",
-    " ",
-    /* @__PURE__ */ e("code", { className: "px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs", children: "basePath" }),
-    ". Perfect for micro frontend architectures that need route isolation, authentication boundaries, and independent deployments."
-  ] }),
-  /* @__PURE__ */ e(d, { variant: "info", dismissible: !1, children: /* @__PURE__ */ r("div", { className: "flex flex-col gap-2", children: [
-    /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ e(c, { className: "w-4 h-4" }),
-      /* @__PURE__ */ e(a, { tag: "span", className: "font-semibold", children: "MFE Mode Requirements" })
-    ] }),
-    /* @__PURE__ */ r(a, { tag: "p", className: "text-sm", children: [
-      "When using",
-      " ",
-      /* @__PURE__ */ e("code", { className: "px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs", children: 'architecturalPatterns="mfe"' }),
-      ", you must provide",
-      " ",
-      /* @__PURE__ */ e("code", { className: "px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs", children: "basePath" }),
-      " ",
-      "and",
-      " ",
-      /* @__PURE__ */ e("code", { className: "px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs", children: "appRoutesConfig" }),
-      ". TypeScript will enforce these requirements at compile time."
-    ] })
-  ] }) }),
-  /* @__PURE__ */ r("div", { className: "space-y-6", children: [
-    /* @__PURE__ */ r("div", { className: "space-y-4", children: [
-      /* @__PURE__ */ r("div", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-linear-to-br from-indigo-500 to-purple-500 shadow-lg", children: /* @__PURE__ */ e(l, { className: "w-5 h-5 text-white filter drop-shadow-sm" }) }),
-        /* @__PURE__ */ e(a, { tag: "h4", className: "font-semibold", children: "Conditional TypeScript Types" })
-      ] }),
-      /* @__PURE__ */ r(
-        a,
-        {
-          tag: "p",
-          className: "text-sm text-gray-600 dark:text-gray-400",
-          children: [
-            "The ThemeProvider uses discriminated unions to automatically enforce the correct props based on",
-            " ",
-            /* @__PURE__ */ e("code", { className: "px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs", children: "architecturalPatterns" }),
-            '. When set to "mfe", TypeScript requires MFE-specific props.'
-          ]
-        }
-      ),
-      /* @__PURE__ */ e(s, { language: "typescript", code: `// Conditional TypeScript Types
-// The ThemeProvider automatically infers the correct props based on architecturalPatterns
-
-// MFE Pattern
-type MfeThemeProviderProps = MfeAppThemeProviderProps & {
-  architecturalPatterns: 'mfe';
-};
-
-// TypeScript enforces required props for MFE mode
-// basePath and appRoutesConfig are required when architecturalPatterns="mfe"` })
-    ] }),
-    /* @__PURE__ */ r("div", { className: "space-y-4", children: [
-      /* @__PURE__ */ r("div", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-linear-to-br from-purple-500 to-indigo-500 shadow-lg", children: /* @__PURE__ */ e(p, { className: "w-5 h-5 text-white filter drop-shadow-sm" }) }),
-        /* @__PURE__ */ e(a, { tag: "h4", className: "font-semibold", children: "IAppRouteConfig Interface" })
-      ] }),
-      /* @__PURE__ */ r(
-        a,
-        {
-          tag: "p",
-          className: "text-sm text-gray-600 dark:text-gray-400",
-          children: [
-            "MFE pattern uses the",
-            " ",
-            /* @__PURE__ */ e("code", { className: "px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs", children: "IAppRouteConfig" }),
-            " ",
-            "interface for explicit route configuration with access control and route management."
-          ]
-        }
-      ),
-      /* @__PURE__ */ e(s, { language: "typescript", code: `interface IAppRouteConfig extends RouteProps {
-  key: string;           // Unique identifier for the route
-  isPublic?: boolean;    // Whether the route is publicly accessible
-  disabled?: boolean;    // Whether the route is disabled
-  element: JSX.Element;  // The component to render
-}` })
-    ] }),
-    /* @__PURE__ */ r("div", { className: "space-y-4", children: [
-      /* @__PURE__ */ r("div", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-linear-to-br from-green-500 to-emerald-500 shadow-lg", children: /* @__PURE__ */ e(m, { className: "w-5 h-5 text-white filter drop-shadow-sm" }) }),
-        /* @__PURE__ */ e(a, { tag: "h4", className: "font-semibold", children: "Basic MFE Usage" })
-      ] }),
-      /* @__PURE__ */ r(
-        a,
-        {
-          tag: "p",
-          className: "text-sm text-gray-600 dark:text-gray-400",
-          children: [
-            "Set",
-            " ",
-            /* @__PURE__ */ e("code", { className: "px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs", children: 'architecturalPatterns="mfe"' }),
-            " ",
-            "to activate MFE mode. TypeScript will require",
-            " ",
-            /* @__PURE__ */ e("code", { className: "px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs", children: "basePath" }),
-            " ",
-            "and",
-            " ",
-            /* @__PURE__ */ e("code", { className: "px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs", children: "appRoutesConfig" }),
-            "."
-          ]
-        }
-      ),
-      /* @__PURE__ */ e(s, { language: "tsx", code: `import { ThemeProvider } from '@e-burgos/tucu-ui';
-import '@e-burgos/tucu-ui/styles';
-
-const appRoutesConfig: IAppRouteConfig[] = [
-  {
-    key: 'home',
-    path: '/',
-    element: <HomePage />,
-    isPublic: true, // Public route, no authentication required
-  },
-  {
-    key: 'dashboard',
-    path: '/dashboard',
-    element: <DashboardPage />,
-    isPublic: false, // Private route, requires authentication
-  },
-  {
-    key: 'profile',
-    path: '/profile',
-    element: <ProfilePage />,
-    isPublic: false,
-  },
-];
-
-function MfeApp() {
-  return (
-    <ThemeProvider
-      architecturalPatterns="mfe"  // Activates MFE mode
-      basePath="/my-app"           // Base path for the micro frontend
-      appRoutesConfig={appRoutesConfig}  // Required for MFE
-      logo={{ name: 'My', secondName: 'App' }}
-      showSettings
-    />
-  );
-}` })
-    ] }),
-    /* @__PURE__ */ r("div", { className: "space-y-4", children: [
-      /* @__PURE__ */ r("div", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-linear-to-br from-orange-500 to-amber-500 shadow-lg", children: /* @__PURE__ */ e(h, { className: "w-5 h-5 text-white filter drop-shadow-sm" }) }),
-        /* @__PURE__ */ e(a, { tag: "h4", className: "font-semibold", children: "Advanced: Public/Private Routes" })
-      ] }),
-      /* @__PURE__ */ r(
-        a,
-        {
-          tag: "p",
-          className: "text-sm text-gray-600 dark:text-gray-400",
-          children: [
-            "MFE pattern automatically handles authentication for private routes. Use",
-            " ",
-            /* @__PURE__ */ e("code", { className: "px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs", children: "isPublic" }),
-            " ",
-            "to control access and",
-            " ",
-            /* @__PURE__ */ e("code", { className: "px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs", children: "disabled" }),
-            " ",
-            "to temporarily disable routes."
-          ]
-        }
-      ),
-      /* @__PURE__ */ e(s, { language: "tsx", code: `import { ThemeProvider } from '@e-burgos/tucu-ui';
-import '@e-burgos/tucu-ui/styles';
-
-const appRoutesConfig: IAppRouteConfig[] = [
-  // Public routes (accessible without authentication)
-  {
-    key: 'login',
-    path: '/login',
-    element: <LoginPage />,
-    isPublic: true,
-  },
-  {
-    key: 'register',
-    path: '/register',
-    element: <RegisterPage />,
-    isPublic: true,
-  },
-  
-  // Private routes (require authentication)
-  {
-    key: 'dashboard',
-    path: '/dashboard',
-    element: <DashboardPage />,
-    isPublic: false,
-  },
-  {
-    key: 'settings',
-    path: '/settings',
-    element: <SettingsPage />,
-    isPublic: false,
-  },
-  
-  // Disabled routes (temporarily unavailable)
-  {
-    key: 'beta-feature',
-    path: '/beta',
-    element: <BetaFeaturePage />,
-    disabled: true,
-  },
-];
-
-function MfeApp() {
-  return (
-    <ThemeProvider
-      architecturalPatterns="mfe"
-      basePath="/mfe-app"
-      appRoutesConfig={appRoutesConfig}
-      logo={{ name: 'MFE', secondName: 'App' }}
-      showSettings
-      // Note: menuItems and customRoutes are NOT allowed in MFE mode
-      // TypeScript will show an error if you try to use them
-    />
-  );
-}` })
-    ] }),
-    /* @__PURE__ */ r("div", { className: "space-y-4", children: [
-      /* @__PURE__ */ r("div", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-linear-to-br from-red-500 to-pink-500 shadow-lg", children: /* @__PURE__ */ e(g, { className: "w-5 h-5 text-white filter drop-shadow-sm" }) }),
-        /* @__PURE__ */ e(a, { tag: "h4", className: "font-semibold", children: "Type Safety Examples" })
-      ] }),
-      /* @__PURE__ */ e(
-        a,
-        {
-          tag: "p",
-          className: "text-sm text-gray-600 dark:text-gray-400",
-          children: "TypeScript prevents invalid prop combinations at compile time, ensuring type safety and preventing configuration errors."
-        }
-      ),
-      /* @__PURE__ */ e(s, { language: "tsx", code: `// ✅ Correct - MFE Pattern with required props
-<ThemeProvider
-  architecturalPatterns="mfe"
-  basePath="/app"
-  appRoutesConfig={[...]}
-/>
-
-// ❌ Error - MFE Pattern without required props
-<ThemeProvider
-  architecturalPatterns="mfe"
-  // TypeScript Error: Property 'basePath' is missing
-  // TypeScript Error: Property 'appRoutesConfig' is missing
-/>
-
-// ❌ Error - Mixing MFE with Standalone App props
-<ThemeProvider
-  architecturalPatterns="mfe"
-  menuItems={[...]}  // Error: Property does not exist on MFE type
-  basePath="/app"
-  appRoutesConfig={[...]}
-/>` })
-    ] })
-  ] }),
-  /* @__PURE__ */ r("div", { className: "space-y-4", children: [
-    /* @__PURE__ */ e(a, { tag: "h4", className: "font-semibold text-lg", children: "Key Features" }),
-    /* @__PURE__ */ r("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
-      /* @__PURE__ */ r(t, { className: "p-4", children: [
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-2 mb-3", children: [
-          /* @__PURE__ */ e(i, { className: "w-5 h-5 text-green-500" }),
-          /* @__PURE__ */ e(a, { tag: "h5", className: "font-semibold", children: "Explicit Route Configuration" })
-        ] }),
-        /* @__PURE__ */ r(
-          a,
-          {
-            tag: "p",
-            className: "text-sm text-gray-600 dark:text-gray-400",
-            children: [
-              "Full control over route configuration with",
-              " ",
-              /* @__PURE__ */ e("code", { className: "px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs", children: "appRoutesConfig" }),
-              ". Each route is explicitly defined."
-            ]
-          }
-        )
-      ] }),
-      /* @__PURE__ */ r(t, { className: "p-4", children: [
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-2 mb-3", children: [
-          /* @__PURE__ */ e(i, { className: "w-5 h-5 text-green-500" }),
-          /* @__PURE__ */ e(a, { tag: "h5", className: "font-semibold", children: "Route Isolation" })
-        ] }),
-        /* @__PURE__ */ r(
-          a,
-          {
-            tag: "p",
-            className: "text-sm text-gray-600 dark:text-gray-400",
-            children: [
-              "Each micro frontend has its own",
-              " ",
-              /* @__PURE__ */ e("code", { className: "px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs", children: "basePath" }),
-              ", ensuring complete route isolation."
-            ]
-          }
-        )
-      ] }),
-      /* @__PURE__ */ r(t, { className: "p-4", children: [
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-2 mb-3", children: [
-          /* @__PURE__ */ e(i, { className: "w-5 h-5 text-green-500" }),
-          /* @__PURE__ */ e(a, { tag: "h5", className: "font-semibold", children: "Authentication Integration" })
-        ] }),
-        /* @__PURE__ */ r(
-          a,
-          {
-            tag: "p",
-            className: "text-sm text-gray-600 dark:text-gray-400",
-            children: [
-              "Built-in support for public/private routes with",
-              " ",
-              /* @__PURE__ */ e("code", { className: "px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs", children: "isPublic" }),
-              ". Automatic authentication handling."
-            ]
-          }
-        )
-      ] }),
-      /* @__PURE__ */ r(t, { className: "p-4", children: [
-        /* @__PURE__ */ r("div", { className: "flex items-center gap-2 mb-3", children: [
-          /* @__PURE__ */ e(i, { className: "w-5 h-5 text-green-500" }),
-          /* @__PURE__ */ e(a, { tag: "h5", className: "font-semibold", children: "Independent Deployment" })
-        ] }),
-        /* @__PURE__ */ e(
-          a,
-          {
-            tag: "p",
-            className: "text-sm text-gray-600 dark:text-gray-400",
-            children: "Perfect for micro frontend architectures where each app can be developed, built, and deployed independently."
-          }
-        )
-      ] })
-    ] })
-  ] })
-] }) }) }) });
-export {
-  C as default
-};

package/documentation/MFESupportSection-C8JljXvo.js

@@ -1,122 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../index-VrMogvDN.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const t=()=>e.jsx("div",{className:"space-y-8",children:e.jsx(r.CardContainer,{children:e.jsx(r.CardTitle,{title:"Micro Frontends (MFE) Support",className:"mt-2 mb-6",children:e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-purple-500 to-indigo-500 shadow-lg",children:e.jsx(a.Box,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(r.Typography,{tag:"h4",className:"font-semibold",children:"Micro Frontend (MFE) Pattern"})]}),e.jsxs(r.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:["The ",e.jsx("strong",{children:"Micro Frontend (MFE) Pattern"})," is designed for distributed architectures where multiple applications need to be deployed independently. It requires explicit route configuration with"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"appRoutesConfig"})," ","and a"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"basePath"}),". Perfect for micro frontend architectures that need route isolation, authentication boundaries, and independent deployments."]}),e.jsx(r.Alert,{variant:"info",dismissible:!1,children:e.jsxs("div",{className:"flex flex-col gap-2",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(a.Info,{className:"w-4 h-4"}),e.jsx(r.Typography,{tag:"span",className:"font-semibold",children:"MFE Mode Requirements"})]}),e.jsxs(r.Typography,{tag:"p",className:"text-sm",children:["When using"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:'architecturalPatterns="mfe"'}),", you must provide"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"basePath"})," ","and"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"appRoutesConfig"}),". TypeScript will enforce these requirements at compile time."]})]})}),e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-indigo-500 to-purple-500 shadow-lg",children:e.jsx(a.Code,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(r.Typography,{tag:"h4",className:"font-semibold",children:"Conditional TypeScript Types"})]}),e.jsxs(r.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:["The ThemeProvider uses discriminated unions to automatically enforce the correct props based on"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"architecturalPatterns"}),'. When set to "mfe", TypeScript requires MFE-specific props.']}),e.jsx(r.CodeBlock,{language:"typescript",code:`// Conditional TypeScript Types
-// The ThemeProvider automatically infers the correct props based on architecturalPatterns
-
-// MFE Pattern
-type MfeThemeProviderProps = MfeAppThemeProviderProps & {
-  architecturalPatterns: 'mfe';
-};
-
-// TypeScript enforces required props for MFE mode
-// basePath and appRoutesConfig are required when architecturalPatterns="mfe"`})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-purple-500 to-indigo-500 shadow-lg",children:e.jsx(a.Settings,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(r.Typography,{tag:"h4",className:"font-semibold",children:"IAppRouteConfig Interface"})]}),e.jsxs(r.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:["MFE pattern uses the"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"IAppRouteConfig"})," ","interface for explicit route configuration with access control and route management."]}),e.jsx(r.CodeBlock,{language:"typescript",code:`interface IAppRouteConfig extends RouteProps {
-  key: string;           // Unique identifier for the route
-  isPublic?: boolean;    // Whether the route is publicly accessible
-  disabled?: boolean;    // Whether the route is disabled
-  element: JSX.Element;  // The component to render
-}`})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-green-500 to-emerald-500 shadow-lg",children:e.jsx(a.Play,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(r.Typography,{tag:"h4",className:"font-semibold",children:"Basic MFE Usage"})]}),e.jsxs(r.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:["Set"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:'architecturalPatterns="mfe"'})," ","to activate MFE mode. TypeScript will require"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"basePath"})," ","and"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"appRoutesConfig"}),"."]}),e.jsx(r.CodeBlock,{language:"tsx",code:`import { ThemeProvider } from '@e-burgos/tucu-ui';
-import '@e-burgos/tucu-ui/styles';
-
-const appRoutesConfig: IAppRouteConfig[] = [
-  {
-    key: 'home',
-    path: '/',
-    element: <HomePage />,
-    isPublic: true, // Public route, no authentication required
-  },
-  {
-    key: 'dashboard',
-    path: '/dashboard',
-    element: <DashboardPage />,
-    isPublic: false, // Private route, requires authentication
-  },
-  {
-    key: 'profile',
-    path: '/profile',
-    element: <ProfilePage />,
-    isPublic: false,
-  },
-];
-
-function MfeApp() {
-  return (
-    <ThemeProvider
-      architecturalPatterns="mfe"  // Activates MFE mode
-      basePath="/my-app"           // Base path for the micro frontend
-      appRoutesConfig={appRoutesConfig}  // Required for MFE
-      logo={{ name: 'My', secondName: 'App' }}
-      showSettings
-    />
-  );
-}`})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-orange-500 to-amber-500 shadow-lg",children:e.jsx(a.Zap,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(r.Typography,{tag:"h4",className:"font-semibold",children:"Advanced: Public/Private Routes"})]}),e.jsxs(r.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:["MFE pattern automatically handles authentication for private routes. Use"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"isPublic"})," ","to control access and"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"disabled"})," ","to temporarily disable routes."]}),e.jsx(r.CodeBlock,{language:"tsx",code:`import { ThemeProvider } from '@e-burgos/tucu-ui';
-import '@e-burgos/tucu-ui/styles';
-
-const appRoutesConfig: IAppRouteConfig[] = [
-  // Public routes (accessible without authentication)
-  {
-    key: 'login',
-    path: '/login',
-    element: <LoginPage />,
-    isPublic: true,
-  },
-  {
-    key: 'register',
-    path: '/register',
-    element: <RegisterPage />,
-    isPublic: true,
-  },
-  
-  // Private routes (require authentication)
-  {
-    key: 'dashboard',
-    path: '/dashboard',
-    element: <DashboardPage />,
-    isPublic: false,
-  },
-  {
-    key: 'settings',
-    path: '/settings',
-    element: <SettingsPage />,
-    isPublic: false,
-  },
-  
-  // Disabled routes (temporarily unavailable)
-  {
-    key: 'beta-feature',
-    path: '/beta',
-    element: <BetaFeaturePage />,
-    disabled: true,
-  },
-];
-
-function MfeApp() {
-  return (
-    <ThemeProvider
-      architecturalPatterns="mfe"
-      basePath="/mfe-app"
-      appRoutesConfig={appRoutesConfig}
-      logo={{ name: 'MFE', secondName: 'App' }}
-      showSettings
-      // Note: menuItems and customRoutes are NOT allowed in MFE mode
-      // TypeScript will show an error if you try to use them
-    />
-  );
-}`})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-red-500 to-pink-500 shadow-lg",children:e.jsx(a.Shield,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(r.Typography,{tag:"h4",className:"font-semibold",children:"Type Safety Examples"})]}),e.jsx(r.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:"TypeScript prevents invalid prop combinations at compile time, ensuring type safety and preventing configuration errors."}),e.jsx(r.CodeBlock,{language:"tsx",code:`// ✅ Correct - MFE Pattern with required props
-<ThemeProvider
-  architecturalPatterns="mfe"
-  basePath="/app"
-  appRoutesConfig={[...]}
-/>
-
-// ❌ Error - MFE Pattern without required props
-<ThemeProvider
-  architecturalPatterns="mfe"
-  // TypeScript Error: Property 'basePath' is missing
-  // TypeScript Error: Property 'appRoutesConfig' is missing
-/>
-
-// ❌ Error - Mixing MFE with Standalone App props
-<ThemeProvider
-  architecturalPatterns="mfe"
-  menuItems={[...]}  // Error: Property does not exist on MFE type
-  basePath="/app"
-  appRoutesConfig={[...]}
-/>`})]})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsx(r.Typography,{tag:"h4",className:"font-semibold text-lg",children:"Key Features"}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4",children:[e.jsxs(r.CardContainer,{className:"p-4",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-3",children:[e.jsx(a.CheckCircle,{className:"w-5 h-5 text-green-500"}),e.jsx(r.Typography,{tag:"h5",className:"font-semibold",children:"Explicit Route Configuration"})]}),e.jsxs(r.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:["Full control over route configuration with"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"appRoutesConfig"}),". Each route is explicitly defined."]})]}),e.jsxs(r.CardContainer,{className:"p-4",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-3",children:[e.jsx(a.CheckCircle,{className:"w-5 h-5 text-green-500"}),e.jsx(r.Typography,{tag:"h5",className:"font-semibold",children:"Route Isolation"})]}),e.jsxs(r.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:["Each micro frontend has its own"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"basePath"}),", ensuring complete route isolation."]})]}),e.jsxs(r.CardContainer,{className:"p-4",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-3",children:[e.jsx(a.CheckCircle,{className:"w-5 h-5 text-green-500"}),e.jsx(r.Typography,{tag:"h5",className:"font-semibold",children:"Authentication Integration"})]}),e.jsxs(r.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:["Built-in support for public/private routes with"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"isPublic"}),". Automatic authentication handling."]})]}),e.jsxs(r.CardContainer,{className:"p-4",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-3",children:[e.jsx(a.CheckCircle,{className:"w-5 h-5 text-green-500"}),e.jsx(r.Typography,{tag:"h5",className:"font-semibold",children:"Independent Deployment"})]}),e.jsx(r.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:"Perfect for micro frontend architectures where each app can be developed, built, and deployed independently."})]})]})]})]})})})});exports.default=t;

package/documentation/ModalSection-CmRW0lMU.js

@@ -1,29 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("react"),t=require("../index-VrMogvDN.js");require("lucide-react");require("react-router-dom");require("react-dom");const l=()=>{const[n,s]=a.useState(!1);return e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center space-y-4",children:[e.jsx(t.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"Modal"}),e.jsx(t.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"A modal dialog component for displaying content in an overlay with customizable buttons and close functionality."})]}),e.jsx(t.CardContainer,{className:"overflow-hidden",children:e.jsx(t.CardTitle,{title:"Basic Examples",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs(t.CardContainer,{className:"p-4",children:[e.jsx(t.Typography,{tag:"h5",className:"mb-3",children:"Basic Modal"}),e.jsx(t.Button,{onClick:()=>s(!0),children:"Open Modal"}),e.jsx(t.Modal,{isOpen:n,setIsOpen:s,text:{title:"Modal Title",content:"This is the modal content.",button:"Confirm"}})]}),e.jsxs(t.CardContainer,{className:"p-4",children:[e.jsx(t.Typography,{tag:"h5",className:"mb-3",children:"Modal with Custom Content"}),e.jsx(t.Button,{onClick:()=>s(!0),children:"Open Custom Modal"}),e.jsx(t.Modal,{isOpen:n,setIsOpen:s,text:{title:"Custom Modal"},children:e.jsx(t.Typography,{tag:"p",children:"Custom content goes here"})})]})]})})})}),e.jsx(t.PropPlayground,{componentName:"Modal",defaultValues:{isOpen:n,setIsOpen:s,closeable:!0,hideButtons:!1},excludeProps:["setIsOpen","onBack","onClose","onSubmit"],children:o=>e.jsx(t.Modal,{...o,text:{title:"Modal Preview",content:"This is a preview of the modal component."},children:e.jsx("p",{className:"text-sm text-gray-600 dark:text-gray-400",children:"Modal body content"})})}),e.jsx(t.AutoPropsTable,{componentName:"Modal"}),e.jsx(t.CardContainer,{className:"overflow-hidden",children:e.jsx(t.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(t.CodeBlock,{language:"tsx",code:`import { Modal, Button } from '@e-burgos/tucu-ui';
-import { useState } from 'react';
-
-function MyComponent() {
-  const [isOpen, setIsOpen] = useState(false);
-
-  return (
-    <>
-      <Button onClick={() => setIsOpen(true)}>Open Modal</Button>
-      <Modal
-        isOpen={isOpen}
-        setIsOpen={setIsOpen}
-        text={{
-          title: 'Modal Title',
-          content: 'This is the modal content.',
-          button: 'Confirm',
-        }}
-      />
-    </>
-  );
-}
-
-// With custom content
-<Modal isOpen={isOpen} setIsOpen={setIsOpen} text={{ title: 'Custom Modal' }}>
-  <div>Custom content here</div>
-</Modal>
-
-// Non-closeable
-<Modal isOpen={isOpen} setIsOpen={setIsOpen} closeable={false} />`})})})})]})};exports.default=l;

package/documentation/NFTGridSection-DFUFgtKg.js

@@ -1,117 +0,0 @@
-import { jsxs as a, Fragment as s, jsx as t } from "react/jsx-runtime";
-import { T as o, C as r, a as i, N as e, A as c, c as p } from "../index-D3gBsvbO.js";
-import "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const u = () => /* @__PURE__ */ a(s, { children: [
-  /* @__PURE__ */ a("div", { className: "text-center space-y-4", children: [
-    /* @__PURE__ */ t(o, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "NFTGrid" }),
-    /* @__PURE__ */ t(
-      o,
-      {
-        tag: "p",
-        className: "text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",
-        children: "Grid card component for displaying NFT items with author information, image, collection, and price."
-      }
-    )
-  ] }),
-  /* @__PURE__ */ t(r, { className: "overflow-hidden", children: /* @__PURE__ */ t(i, { title: "Grid Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ t("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-5", children: [
-    /* @__PURE__ */ t(
-      e,
-      {
-        author: "CryptoPunk",
-        authorImage: "https://i.pravatar.cc/80?img=1",
-        image: "https://picsum.photos/seed/nft1/400/300",
-        name: "CryptoPunk #1234",
-        collection: "Crypto Punks",
-        price: "45 ETH"
-      }
-    ),
-    /* @__PURE__ */ t(
-      e,
-      {
-        author: "BoredApe",
-        authorImage: "https://i.pravatar.cc/80?img=12",
-        image: "https://picsum.photos/seed/nft2/400/300",
-        name: "Bored Ape #8821",
-        collection: "BAYC",
-        price: "72 ETH"
-      }
-    ),
-    /* @__PURE__ */ t(
-      e,
-      {
-        author: "Azuki",
-        authorImage: "https://i.pravatar.cc/80?img=25",
-        image: "https://picsum.photos/seed/nft3/400/300",
-        name: "Azuki #5501",
-        collection: "Azuki",
-        price: "18.5 ETH"
-      }
-    ),
-    /* @__PURE__ */ t(
-      e,
-      {
-        author: "Doodles",
-        authorImage: "https://i.pravatar.cc/80?img=33",
-        image: "https://picsum.photos/seed/nft4/400/300",
-        name: "Doodle #3120",
-        collection: "Doodles",
-        price: "8.2 ETH"
-      }
-    ),
-    /* @__PURE__ */ t(
-      e,
-      {
-        author: "CloneX",
-        authorImage: "https://i.pravatar.cc/80?img=44",
-        image: "https://picsum.photos/seed/nft5/400/300",
-        name: "CloneX #12882",
-        collection: "CloneX",
-        price: "5.8 ETH"
-      }
-    ),
-    /* @__PURE__ */ t(
-      e,
-      {
-        author: "Moonbird",
-        authorImage: "https://i.pravatar.cc/80?img=56",
-        image: "https://picsum.photos/seed/nft6/400/300",
-        name: "Moonbird #7744",
-        collection: "Moonbirds",
-        price: "12 ETH",
-        profilePath: "/profile/moonbird"
-      }
-    )
-  ] }) }) }) }),
-  /* @__PURE__ */ t(c, { componentName: "NFTGrid" }),
-  /* @__PURE__ */ t(r, { className: "overflow-hidden", children: /* @__PURE__ */ t(i, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ t("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ t(
-    p,
-    {
-      language: "tsx",
-      code: `import { NFTGrid } from '@e-burgos/tucu-ui';
-
-// Single card
-<NFTGrid
-  author="CryptoPunk"
-  authorImage="/avatars/cryptopunk.jpg"
-  image="/nfts/punk-1234.jpg"
-  name="CryptoPunk #1234"
-  collection="Crypto Punks"
-  price="45 ETH"
-  profilePath="/profile/cryptopunk"
-/>
-
-// Grid layout
-<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-5">
-  <NFTGrid {...nft1} />
-  <NFTGrid {...nft2} />
-  <NFTGrid {...nft3} />
-</div>`
-    }
-  ) }) }) })
-] });
-export {
-  u as default
-};