"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-DEZRGktf.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const c=()=>{const r=`import { RouteProps } from 'react-router-dom';

// Extends React Router's RouteProps (provides path, element, index, etc.)
type IAppRouteConfig = RouteProps & {
  key: string;           // Unique identifier for the route
  isPublic?: boolean;    // Whether the route is publicly accessible
  disabled?: boolean;    // Whether the route is temporarily disabled
};`,s=`import { ThemeProvider, IAppRouteConfig } from '@e-burgos/tucu-ui';
import '@e-burgos/tucu-ui/styles';

const appRoutesConfig: IAppRouteConfig[] = [
  {
    key: 'home',
    path: '/',
    element: <HomePage />,
    isPublic: true,
  },
  {
    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"
      basePath="/my-app"
      appRoutesConfig={appRoutesConfig}
      isAuthenticated={true}    // Required: authentication state
      loginUrl="/auth/login"    // Required: redirect URL for unauthenticated users
      logo={{ name: 'My', secondName: 'App' }}
      showSettings
    />
  );
}`,o=`import { ThemeProvider, IAppRouteConfig } from '@e-burgos/tucu-ui';

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 /> },
  { key: 'settings', path: '/settings', element: <SettingsPage /> },

  // Disabled routes (temporarily unavailable)
  { key: 'beta', path: '/beta', element: <BetaPage />, disabled: true },
];

function MfeApp() {
  const { isLoggedIn } = useAuth();

  return (
    <ThemeProvider
      architecturalPatterns="mfe"
      basePath="/mfe-app"
      appRoutesConfig={appRoutesConfig}
      isAuthenticated={isLoggedIn}
      loginUrl="/mfe-app/login"
      logo={{ name: 'MFE', secondName: 'App' }}
      showSettings
    />
  );
}`,n=`// ✅ Correct — MFE with all required props
<ThemeProvider
  architecturalPatterns="mfe"
  basePath="/app"
  appRoutesConfig={routes}
  isAuthenticated={isLoggedIn}
  loginUrl="/login"
/>

// ❌ Error — Missing required props
<ThemeProvider
  architecturalPatterns="mfe"
  basePath="/app"
  appRoutesConfig={routes}
  // TS Error: Property 'isAuthenticated' is missing
  // TS Error: Property 'loginUrl' is missing
/>

// ❌ Error — Mixing MFE with Standalone props
<ThemeProvider
  architecturalPatterns="mfe"
  menuItems={[...]}  // Error: not allowed in MFE mode
  basePath="/app"
  appRoutesConfig={routes}
/>`,l=[{icon:e.jsx(a.Settings,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Explicit Route Config",description:"Full control over each route via appRoutesConfig with access control.",iconBgClassName:"from-purple-500 to-indigo-500"},{icon:e.jsx(a.Split,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Route Isolation",description:"Each MFE has its own basePath ensuring complete route isolation.",iconBgClassName:"from-blue-500 to-cyan-500"},{icon:e.jsx(a.Lock,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Auth Integration",description:"Built-in public/private routes with isAuthenticated and loginUrl.",iconBgClassName:"from-red-500 to-rose-500"},{icon:e.jsx(a.Rocket,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Independent Deploy",description:"Each app can be developed, built, and deployed independently.",iconBgClassName:"from-green-500 to-emerald-500"}];return e.jsxs(e.Fragment,{children:[e.jsx(t.HeroCard,{title:"Micro Frontends (MFE)",description:"Designed for distributed architectures where multiple applications are deployed independently. Uses explicit route configuration with appRoutesConfig, basePath, and built-in authentication.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-purple-500 via-indigo-500 to-blue-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(a.Box,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(t.Typography,{tag:"h2",className:"mb-2",children:"IAppRouteConfig Interface"}),e.jsx(t.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Extends React Router's RouteProps with access control"})]}),e.jsx(t.CardContainer,{children:e.jsx(t.CardTitle,{title:"Interface Definition",children:e.jsx(t.CodeBlock,{language:"TS",code:r})})}),e.jsx(t.Alert,{variant:"warning",dismissible:!1,children:e.jsxs(t.Typography,{tag:"p",className:"text-sm",children:[e.jsx(a.AlertTriangle,{className:"w-4 h-4 inline mr-2"}),"MFE mode requires"," ",e.jsx("code",{className:"px-1 py-0.5 border border-border rounded text-xs",children:"isAuthenticated"})," ","(boolean) and"," ",e.jsx("code",{className:"px-1 py-0.5 border border-border rounded text-xs",children:"loginUrl"})," ","(string) as mandatory props. TypeScript enforces this at compile time."]})})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(t.Typography,{tag:"h2",className:"mb-2",children:"Basic Usage"}),e.jsx(t.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Minimal MFE setup with authentication"})]}),e.jsx(t.CardContainer,{children:e.jsx(t.CardTitle,{title:"MFE ThemeProvider",children:e.jsx(t.CodeBlock,{language:"tsx",code:s})})})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(t.Typography,{tag:"h2",className:"mb-2",children:"Advanced: Public/Private Routes"}),e.jsx(t.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Authentication handling with disabled routes"})]}),e.jsx(t.CardContainer,{children:e.jsx(t.CardTitle,{title:"Advanced Configuration",children:e.jsx(t.CodeBlock,{language:"tsx",code:o})})})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(t.Typography,{tag:"h2",className:"mb-2",children:"Type Safety"}),e.jsx(t.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"TypeScript enforces correct prop combinations"})]}),e.jsx(t.CardContainer,{children:e.jsx(t.CardTitle,{title:"Compile-Time Validation",children:e.jsx(t.CodeBlock,{language:"tsx",code:n})})})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(t.Typography,{tag:"h2",className:"mb-2",children:"Key Features"}),e.jsx(t.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Benefits of the MFE architectural pattern"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 sm:gap-6",children:l.map(i=>e.jsx(t.FeatureCard,{layout:"vertical",...i},i.title))})]})]})};exports.default=c;
