@promakeai/cli 0.0.5

package/dist/registry/header-mega.json

@@ -0,0 +1,47 @@
+{
+  "name": "header-mega",
+  "type": "registry:component",
+  "title": "Mega Menu Header",
+  "description": "Full-featured navigation bar with mega menu dropdowns using NavigationMenu component. Features desktop navigation with icon-rich dropdown submenus, mobile Sheet-based accordion menu, logo with site name, and auth buttons (login/signup). Perfect for complex sites with multiple navigation levels.",
+  "dependencies": [
+    "lucide-react"
+  ],
+  "registryDependencies": [
+    "navigation-menu",
+    "accordion",
+    "sheet"
+  ],
+  "usage": "import { HeaderMega } from '@/modules/header-mega';\n\n<HeaderMega />\n\n- Desktop: NavigationMenu with dropdowns\n- Mobile: Sheet with Accordion\n- Customizable menu items via lang files\n- Logo from /images/logo.png",
+  "files": [
+    {
+      "path": "header-mega/index.ts",
+      "type": "registry:index",
+      "target": "$modules$/header-mega/index.ts",
+      "content": "export * from './header-mega';\r\n"
+    },
+    {
+      "path": "header-mega/header-mega.tsx",
+      "type": "registry:component",
+      "target": "$modules$/header-mega/header-mega.tsx",
+      "content": "import { Link } from \"react-router\";\r\nimport { Book, Menu, Sunset, Trees, Zap } from \"lucide-react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport {\r\n  Accordion,\r\n  AccordionContent,\r\n  AccordionItem,\r\n  AccordionTrigger,\r\n} from \"@/components/ui/accordion\";\r\nimport { Button } from \"@/components/ui/button\";\r\nimport {\r\n  NavigationMenu,\r\n  NavigationMenuContent,\r\n  NavigationMenuItem,\r\n  NavigationMenuLink,\r\n  NavigationMenuList,\r\n  NavigationMenuTrigger,\r\n} from \"@/components/ui/navigation-menu\";\r\nimport {\r\n  Sheet,\r\n  SheetContent,\r\n  SheetHeader,\r\n  SheetTitle,\r\n  SheetTrigger,\r\n} from \"@/components/ui/sheet\";\r\nimport constants from \"@/constants/constants.json\";\r\n\r\ninterface MenuItem {\r\n  title: string;\r\n  url: string;\r\n  description?: string;\r\n  icon?: React.ReactNode;\r\n  items?: MenuItem[];\r\n}\r\n\r\ninterface HeaderMegaProps {\r\n  className?: string;\r\n}\r\n\r\nexport function HeaderMega({ className }: HeaderMegaProps) {\r\n  const { t } = useTranslation(\"header-mega\");\r\n\r\n  const menu: MenuItem[] = [\r\n    { title: t(\"home\", \"Home\"), url: \"/\" },\r\n    {\r\n      title: t(\"products\", \"Products\"),\r\n      url: \"/products\",\r\n      items: [\r\n        {\r\n          title: t(\"allProducts\", \"All Products\"),\r\n          description: t(\r\n            \"allProductsDesc\",\r\n            \"Browse our complete product catalog\"\r\n          ),\r\n          icon: <Book className=\"h-5 w-5 shrink-0\" />,\r\n          url: \"/products\",\r\n        },\r\n        {\r\n          title: t(\"featured\", \"Featured\"),\r\n          description: t(\r\n            \"featuredDesc\",\r\n            \"Our handpicked selection of top products\"\r\n          ),\r\n          icon: <Trees className=\"h-5 w-5 shrink-0\" />,\r\n          url: \"/products?featured=true\",\r\n        },\r\n        {\r\n          title: t(\"newArrivals\", \"New Arrivals\"),\r\n          description: t(\"newArrivalsDesc\", \"Check out the latest additions\"),\r\n          icon: <Sunset className=\"h-5 w-5 shrink-0\" />,\r\n          url: \"/products?is_new=true\",\r\n        },\r\n        {\r\n          title: t(\"onSale\", \"On Sale\"),\r\n          description: t(\"onSaleDesc\", \"Great deals and special offers\"),\r\n          icon: <Zap className=\"h-5 w-5 shrink-0\" />,\r\n          url: \"/products?on_sale=true\",\r\n        },\r\n      ],\r\n    },\r\n    {\r\n      title: t(\"company\", \"Company\"),\r\n      url: \"#\",\r\n      items: [\r\n        {\r\n          title: t(\"aboutUs\", \"About Us\"),\r\n          description: t(\r\n            \"aboutUsDesc\",\r\n            \"Learn more about our story and mission\"\r\n          ),\r\n          icon: <Trees className=\"h-5 w-5 shrink-0\" />,\r\n          url: \"/about\",\r\n        },\r\n        {\r\n          title: t(\"contact\", \"Contact\"),\r\n          description: t(\"contactDesc\", \"Get in touch with our team\"),\r\n          icon: <Sunset className=\"h-5 w-5 shrink-0\" />,\r\n          url: \"/contact\",\r\n        },\r\n        {\r\n          title: t(\"blog\", \"Blog\"),\r\n          description: t(\"blogDesc\", \"Read our latest articles and updates\"),\r\n          icon: <Book className=\"h-5 w-5 shrink-0\" />,\r\n          url: \"/blog\",\r\n        },\r\n      ],\r\n    },\r\n  ];\r\n\r\n  const renderMenuItem = (item: MenuItem) => {\r\n    if (item.items) {\r\n      return (\r\n        <NavigationMenuItem key={item.title}>\r\n          <NavigationMenuTrigger>{item.title}</NavigationMenuTrigger>\r\n          <NavigationMenuContent className=\"z-50 bg-popover text-popover-foreground\">\r\n            {item.items.map((subItem) => (\r\n              <NavigationMenuLink asChild key={subItem.title} className=\"w-80\">\r\n                <SubMenuLink item={subItem} />\r\n              </NavigationMenuLink>\r\n            ))}\r\n          </NavigationMenuContent>\r\n        </NavigationMenuItem>\r\n      );\r\n    }\r\n\r\n    return (\r\n      <NavigationMenuItem key={item.title}>\r\n        <NavigationMenuLink asChild>\r\n          <Link\r\n            to={item.url}\r\n            className=\"group inline-flex h-10 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-muted hover:text-accent-foreground\"\r\n          >\r\n            {item.title}\r\n          </Link>\r\n        </NavigationMenuLink>\r\n      </NavigationMenuItem>\r\n    );\r\n  };\r\n\r\n  const renderMobileMenuItem = (item: MenuItem) => {\r\n    if (item.items) {\r\n      return (\r\n        <AccordionItem\r\n          key={item.title}\r\n          value={item.title}\r\n          className=\"border-b-0\"\r\n        >\r\n          <AccordionTrigger className=\"text-md py-0 font-semibold hover:no-underline\">\r\n            {item.title}\r\n          </AccordionTrigger>\r\n          <AccordionContent className=\"mt-2\">\r\n            {item.items.map((subItem) => (\r\n              <SubMenuLink key={subItem.title} item={subItem} />\r\n            ))}\r\n          </AccordionContent>\r\n        </AccordionItem>\r\n      );\r\n    }\r\n\r\n    return (\r\n      <Link key={item.title} to={item.url} className=\"text-md font-semibold\">\r\n        {item.title}\r\n      </Link>\r\n    );\r\n  };\r\n\r\n  return (\r\n    <header\r\n      className={cn(\r\n        \"relative z-40 py-4 border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60\",\r\n        className\r\n      )}\r\n    >\r\n      <div className=\"container mx-auto px-4\">\r\n        {/* Desktop Menu */}\r\n        <nav className=\"hidden items-center justify-between lg:flex\">\r\n          <div className=\"flex items-center gap-6\">\r\n            {/* Logo */}\r\n            <Link to=\"/\" className=\"flex items-center gap-2\">\r\n              <img\r\n                src=\"/images/logo.png\"\r\n                className=\"h-8 w-auto\"\r\n                alt={constants.site.name}\r\n                onError={(e) => {\r\n                  e.currentTarget.style.display = \"none\";\r\n                }}\r\n              />\r\n              <span className=\"text-lg font-semibold tracking-tight\">\r\n                {constants.site.name}\r\n              </span>\r\n            </Link>\r\n            <div className=\"flex items-center\">\r\n              <NavigationMenu>\r\n                <NavigationMenuList>\r\n                  {menu.map((item) => renderMenuItem(item))}\r\n                </NavigationMenuList>\r\n              </NavigationMenu>\r\n            </div>\r\n          </div>\r\n          <div className=\"flex gap-2\">\r\n            <Button asChild variant=\"outline\" size=\"sm\">\r\n              <Link to=\"/login\">{t(\"login\", \"Login\")}</Link>\r\n            </Button>\r\n            <Button asChild size=\"sm\">\r\n              <Link to=\"/register\">{t(\"signup\", \"Sign up\")}</Link>\r\n            </Button>\r\n          </div>\r\n        </nav>\r\n\r\n        {/* Mobile Menu */}\r\n        <div className=\"block lg:hidden\">\r\n          <div className=\"flex items-center justify-between\">\r\n            {/* Logo */}\r\n            <Link to=\"/\" className=\"flex items-center gap-2\">\r\n              <img\r\n                src=\"/images/logo.png\"\r\n                className=\"h-8 w-auto\"\r\n                alt={constants.site.name}\r\n                onError={(e) => {\r\n                  e.currentTarget.style.display = \"none\";\r\n                }}\r\n              />\r\n              <span className=\"text-lg font-semibold tracking-tight\">\r\n                {constants.site.name}\r\n              </span>\r\n            </Link>\r\n            <Sheet>\r\n              <SheetTrigger asChild>\r\n                <Button variant=\"outline\" size=\"icon\">\r\n                  <Menu className=\"h-4 w-4\" />\r\n                </Button>\r\n              </SheetTrigger>\r\n              <SheetContent className=\"z-50 overflow-y-auto px-6\">\r\n                <SheetHeader>\r\n                  <SheetTitle>\r\n                    <Link to=\"/\" className=\"flex items-center gap-2\">\r\n                      <img\r\n                        src=\"/images/logo.png\"\r\n                        className=\"h-8 w-auto\"\r\n                        alt={constants.site.name}\r\n                        onError={(e) => {\r\n                          e.currentTarget.style.display = \"none\";\r\n                        }}\r\n                      />\r\n                    </Link>\r\n                  </SheetTitle>\r\n                </SheetHeader>\r\n                <div className=\"flex flex-col gap-6 p-4\">\r\n                  <Accordion\r\n                    type=\"single\"\r\n                    collapsible\r\n                    className=\"flex w-full flex-col gap-4\"\r\n                  >\r\n                    {menu.map((item) => renderMobileMenuItem(item))}\r\n                  </Accordion>\r\n\r\n                  <div className=\"flex flex-col gap-3\">\r\n                    <Button asChild variant=\"outline\">\r\n                      <Link to=\"/login\">{t(\"login\", \"Login\")}</Link>\r\n                    </Button>\r\n                    <Button asChild>\r\n                      <Link to=\"/register\">{t(\"signup\", \"Sign up\")}</Link>\r\n                    </Button>\r\n                  </div>\r\n                </div>\r\n              </SheetContent>\r\n            </Sheet>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </header>\r\n  );\r\n}\r\n\r\nfunction SubMenuLink({ item }: { item: MenuItem }) {\r\n  return (\r\n    <Link\r\n      to={item.url}\r\n      className=\"flex min-w-80 flex-row gap-4 rounded-md p-3 leading-none no-underline transition-colors outline-none select-none hover:bg-muted hover:text-accent-foreground\"\r\n    >\r\n      <div className=\"text-foreground\">{item.icon}</div>\r\n      <div>\r\n        <div className=\"text-sm font-semibold\">{item.title}</div>\r\n        {item.description && (\r\n          <p className=\"text-sm leading-snug text-muted-foreground\">\r\n            {item.description}\r\n          </p>\r\n        )}\r\n      </div>\r\n    </Link>\r\n  );\r\n}\r\n"
+    },
+    {
+      "path": "header-mega/lang/en.json",
+      "type": "registry:lang",
+      "target": "$modules$/header-mega/lang/en.json",
+      "content": "{\r\n  \"home\": \"Home\",\r\n  \"products\": \"Products\",\r\n  \"allProducts\": \"All Products\",\r\n  \"allProductsDesc\": \"AI will customize this menu description based on your product catalog\",\r\n  \"featured\": \"Featured\",\r\n  \"featuredDesc\": \"Replace this text with your featured products description\",\r\n  \"newArrivals\": \"New Arrivals\",\r\n  \"newArrivalsDesc\": \"This description will be customized by AI for your new products\",\r\n  \"onSale\": \"On Sale\",\r\n  \"onSaleDesc\": \"Lorem ipsum dolor sit amet, consectetur adipiscing elit\",\r\n  \"company\": \"About\",\r\n  \"aboutUs\": \"About Us\",\r\n  \"aboutUsDesc\": \"AI will replace this with your story and purpose\",\r\n  \"contact\": \"Contact\",\r\n  \"contactDesc\": \"Customize this contact menu description\",\r\n  \"blog\": \"Blog\",\r\n  \"blogDesc\": \"This text will be replaced with your blog description\",\r\n  \"login\": \"Login\",\r\n  \"signup\": \"Sign up\"\r\n}\r\n"
+    },
+    {
+      "path": "header-mega/lang/tr.json",
+      "type": "registry:lang",
+      "target": "$modules$/header-mega/lang/tr.json",
+      "content": "{\r\n  \"home\": \"Ana Sayfa\",\r\n  \"products\": \"Ürünler\",\r\n  \"allProducts\": \"Tüm Ürünler\",\r\n  \"allProductsDesc\": \"AI bu menü açıklamasını ürün kataloğunuza göre özelleştirecektir\",\r\n  \"featured\": \"Öne Çıkanlar\",\r\n  \"featuredDesc\": \"Bu metni öne çıkan ürünlerinizin açıklamasıyla değiştirin\",\r\n  \"newArrivals\": \"Yeni Gelenler\",\r\n  \"newArrivalsDesc\": \"Bu açıklama AI tarafından yeni ürünleriniz için özelleştirilecektir\",\r\n  \"onSale\": \"İndirimde\",\r\n  \"onSaleDesc\": \"Lorem ipsum dolor sit amet, consectetur adipiscing elit\",\r\n  \"company\": \"Hakkında\",\r\n  \"aboutUs\": \"Hakkımızda\",\r\n  \"aboutUsDesc\": \"AI bunu hikayeniz ve amacınızla değiştirecektir\",\r\n  \"contact\": \"İletişim\",\r\n  \"contactDesc\": \"Bu iletişim menü açıklamasını özelleştirin\",\r\n  \"blog\": \"Blog\",\r\n  \"blogDesc\": \"Bu metin blog açıklamanızla değiştirilecektir\",\r\n  \"login\": \"Giriş Yap\",\r\n  \"signup\": \"Kayıt Ol\"\r\n}\r\n"
+    }
+  ],
+  "exports": {
+    "types": [],
+    "variables": [
+      "HeaderMega"
+    ]
+  }
+}

package/dist/registry/header-minimal.json

@@ -0,0 +1,45 @@
+{
+  "name": "header-minimal",
+  "type": "registry:component",
+  "title": "Minimal Header",
+  "description": "Clean, minimal navigation bar with simple text links and a single CTA button. Features logo with site name, horizontal link list on desktop, and Sheet-based mobile menu. Perfect for portfolios, landing pages, and simple websites.",
+  "dependencies": [
+    "lucide-react"
+  ],
+  "registryDependencies": [
+    "sheet"
+  ],
+  "usage": "import { HeaderMinimal } from '@/modules/header-minimal';\n\n<HeaderMinimal />\n\n- Simple horizontal links on desktop\n- Mobile Sheet menu\n- Single CTA button\n- No dropdowns or complex navigation",
+  "files": [
+    {
+      "path": "header-minimal/index.ts",
+      "type": "registry:index",
+      "target": "$modules$/header-minimal/index.ts",
+      "content": "export * from './header-minimal';\r\n"
+    },
+    {
+      "path": "header-minimal/header-minimal.tsx",
+      "type": "registry:component",
+      "target": "$modules$/header-minimal/header-minimal.tsx",
+      "content": "import { Link } from \"react-router\";\r\nimport { Menu } from \"lucide-react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { Button } from \"@/components/ui/button\";\r\nimport {\r\n  Sheet,\r\n  SheetContent,\r\n  SheetHeader,\r\n  SheetTitle,\r\n  SheetTrigger,\r\n} from \"@/components/ui/sheet\";\r\nimport constants from \"@/constants/constants.json\";\r\n\r\ninterface HeaderMinimalProps {\r\n  className?: string;\r\n}\r\n\r\nexport function HeaderMinimal({ className }: HeaderMinimalProps) {\r\n  const { t } = useTranslation(\"header-minimal\");\r\n\r\n  const links = [\r\n    { title: t(\"home\", \"Home\"), url: \"/\" },\r\n    { title: t(\"about\", \"About\"), url: \"/about\" },\r\n  ];\r\n\r\n  return (\r\n    <header className={cn(\"py-4 border-b bg-background\", className)}>\r\n      <div className=\"container mx-auto px-4\">\r\n        <nav className=\"flex items-center justify-between\">\r\n          {/* Logo */}\r\n          <Link to=\"/\" className=\"flex items-center gap-2\">\r\n            <img\r\n              src=\"/images/logo.png\"\r\n              className=\"h-8 w-auto\"\r\n              alt={constants.site.name}\r\n              onError={(e) => {\r\n                e.currentTarget.style.display = \"none\";\r\n              }}\r\n            />\r\n            <span className=\"text-xl font-bold tracking-tight\">\r\n              {constants.site.name}\r\n            </span>\r\n          </Link>\r\n\r\n          {/* Desktop Links */}\r\n          <div className=\"hidden md:flex items-center gap-8\">\r\n            {links.map((link) => (\r\n              <Link\r\n                key={link.title}\r\n                to={link.url}\r\n                className=\"text-sm font-medium text-muted-foreground hover:text-foreground transition-colors\"\r\n              >\r\n                {link.title}\r\n              </Link>\r\n            ))}\r\n          </div>\r\n\r\n          {/* CTA Button - Desktop */}\r\n          <div className=\"hidden md:block\">\r\n            <Button asChild>\r\n              <Link to=\"/contact\">{t(\"cta\", \"Contact\")}</Link>\r\n            </Button>\r\n          </div>\r\n\r\n          {/* Mobile Menu */}\r\n          <div className=\"md:hidden\">\r\n            <Sheet>\r\n              <SheetTrigger asChild>\r\n                <Button variant=\"ghost\" size=\"icon\">\r\n                  <Menu className=\"h-5 w-5\" />\r\n                </Button>\r\n              </SheetTrigger>\r\n              <SheetContent side=\"right\" className=\"px-6\">\r\n                <SheetHeader>\r\n                  <SheetTitle>\r\n                    <Link to=\"/\" className=\"flex items-center gap-2\">\r\n                      <span className=\"text-xl font-bold\">\r\n                        {constants.site.name}\r\n                      </span>\r\n                    </Link>\r\n                  </SheetTitle>\r\n                </SheetHeader>\r\n                <div className=\"flex flex-col gap-4 mt-8\">\r\n                  {links.map((link) => (\r\n                    <Link\r\n                      key={link.title}\r\n                      to={link.url}\r\n                      className=\"text-lg font-medium hover:text-primary transition-colors\"\r\n                    >\r\n                      {link.title}\r\n                    </Link>\r\n                  ))}\r\n                  <Button asChild className=\"mt-4\">\r\n                    <Link to=\"/contact\">{t(\"cta\", \"Contact\")}</Link>\r\n                  </Button>\r\n                </div>\r\n              </SheetContent>\r\n            </Sheet>\r\n          </div>\r\n        </nav>\r\n      </div>\r\n    </header>\r\n  );\r\n}\r\n"
+    },
+    {
+      "path": "header-minimal/lang/en.json",
+      "type": "registry:lang",
+      "target": "$modules$/header-minimal/lang/en.json",
+      "content": "{\r\n  \"home\": \"Home\",\r\n  \"about\": \"About\",\r\n  \"cta\": \"Contact\"\r\n}\r\n"
+    },
+    {
+      "path": "header-minimal/lang/tr.json",
+      "type": "registry:lang",
+      "target": "$modules$/header-minimal/lang/tr.json",
+      "content": "{\r\n  \"home\": \"Ana Sayfa\",\r\n  \"about\": \"Hakkımızda\",\r\n  \"cta\": \"İletişim\"\r\n}\r\n"
+    }
+  ],
+  "exports": {
+    "types": [],
+    "variables": [
+      "HeaderMinimal"
+    ]
+  }
+}

package/dist/registry/header-simple.json

@@ -0,0 +1,43 @@
+{
+  "name": "header-simple",
+  "type": "registry:component",
+  "title": "Simple Header",
+  "description": "Simple centered navigation header with logo in center and navigation links on both sides. Clean, minimal design suitable for landing pages and marketing sites. Features mobile hamburger menu, language switcher, and dark mode toggle. Sticky positioning with subtle shadow on scroll.",
+  "dependencies": [
+    "lucide-react"
+  ],
+  "registryDependencies": [],
+  "usage": "import { HeaderSimple } from '@/modules/header-simple';\n\n<HeaderSimple />\n\n• Installed at: src/modules/header-simple/\n• Customize navigation: src/modules/header-simple/lang/*.json\n• Clean, centered design for landing pages",
+  "files": [
+    {
+      "path": "header-simple/index.ts",
+      "type": "registry:index",
+      "target": "$modules$/header-simple/index.ts",
+      "content": "export * from './header-simple';\r\n"
+    },
+    {
+      "path": "header-simple/header-simple.tsx",
+      "type": "registry:component",
+      "target": "$modules$/header-simple/header-simple.tsx",
+      "content": "import { useState } from \"react\";\nimport { Link } from \"react-router\";\nimport { Menu } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n  Sheet,\n  SheetHeader,\n  SheetTitle,\n  SheetContent,\n  SheetTrigger,\n} from \"@/components/ui/sheet\";\nimport { Logo } from \"@/components/Logo\";\nimport { useTranslation } from \"react-i18next\";\n\nexport function HeaderSimple() {\n  const [mobileMenuOpen, setMobileMenuOpen] = useState(false);\n  const { t } = useTranslation(\"header-simple\");\n\n\n\n  const navigation = [\n    { name: t('home', 'Home'), href: \"/\" },\n    { name: t('about', 'About'), href: \"/about\" },\n    { name: t('contact', 'Contact'), href: \"/contact\" },\n  ];\n\n  return (\n    <header className=\"sticky top-0 z-50 w-full border-b border-border/20 bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60\">\n      <div className=\"container mx-auto px-4 lg:px-8\">\n        <div className=\"flex h-16 sm:h-20 items-center justify-between\">\n          {/* Logo */}\n          <div className=\"flex-shrink-0 min-w-0\">\n            <Logo size=\"sm\" className=\"text-base sm:text-xl lg:text-2xl\" />\n          </div>\n\n          {/* Desktop Navigation - Right Aligned */}\n          <nav className=\"hidden lg:flex items-center space-x-8\">\n              {navigation.map((item) => (\n              <Link\n                key={item.name}\n                to={item.href}\n                className=\"text-base font-medium transition-colors hover:text-primary relative group py-2\"\n              >\n                {item.name}\n                <span className=\"absolute -bottom-1 left-0 w-0 h-0.5 bg-primary transition-all duration-300 group-hover:w-full\"></span>\n              </Link>\n            ))}\n          </nav>\n\n          {/* Mobile Menu - Right Aligned */}\n          <div className=\"lg:hidden flex-shrink-0\">\n            <Sheet open={mobileMenuOpen} onOpenChange={setMobileMenuOpen}>\n              <SheetTrigger asChild>\n                <Button variant=\"ghost\" size=\"icon\">\n                  <Menu className=\"h-5 w-5\" />\n                </Button>\n              </SheetTrigger>\n              <SheetContent side=\"right\" className=\"w-[300px] sm:w-[400px] px-6\">\n                <SheetHeader>\n                  <SheetTitle>{t('menu')}</SheetTitle>\n                </SheetHeader>\n                <div className=\"flex flex-col space-y-4 mt-8\">\n                  {navigation.map((item) => (\n                    <Link\n                      key={item.name}\n                      to={item.href}\n                      className=\"text-lg font-medium hover:text-primary transition-colors\"\n                      onClick={() => setMobileMenuOpen(false)}\n                    >\n                      {item.name}\n                    </Link>\n                  ))}\n                </div>\n              </SheetContent>\n            </Sheet>\n          </div>\n        </div>\n      </div>\n    </header>\n  );\n}\n"
+    },
+    {
+      "path": "header-simple/lang/en.json",
+      "type": "registry:lang",
+      "target": "$modules$/header-simple/lang/en.json",
+      "content": "{\r\n  \"home\": \"Home\",\r\n  \"about\": \"About\",\r\n  \"contact\": \"Contact\",\r\n  \"menu\": \"Menu\"\r\n}\r\n"
+    },
+    {
+      "path": "header-simple/lang/tr.json",
+      "type": "registry:lang",
+      "target": "$modules$/header-simple/lang/tr.json",
+      "content": "{\r\n  \"home\": \"Ana Sayfa\",\r\n  \"about\": \"Hakkımızda\",\r\n  \"contact\": \"İletişim\",\r\n  \"menu\": \"Menü\"\r\n}\r\n"
+    }
+  ],
+  "exports": {
+    "types": [],
+    "variables": [
+      "HeaderSimple"
+    ]
+  }
+}

package/dist/registry/hero-cta.json

@@ -0,0 +1,42 @@
+{
+  "name": "hero-cta",
+  "type": "registry:component",
+  "title": "Hero CTA",
+  "description": "Two-column hero section with social proof avatars, star ratings, and dual CTA buttons. Features a large heading, descriptive text, user avatar stack with reviews count, and responsive image. Perfect for SaaS landing pages and product showcases.",
+  "registryDependencies": [
+    "avatar"
+  ],
+  "usage": "import { HeroCta } from '@/modules/hero-cta';\n\n<HeroCta />\n\n- Two-column responsive layout\n- Social proof with avatars and ratings\n- Primary and secondary CTA buttons\n- Decorative gradient blur effect",
+  "files": [
+    {
+      "path": "hero-cta/index.ts",
+      "type": "registry:index",
+      "target": "$modules$/hero-cta/index.ts",
+      "content": "export * from './hero-cta';\r\n"
+    },
+    {
+      "path": "hero-cta/hero-cta.tsx",
+      "type": "registry:component",
+      "target": "$modules$/hero-cta/hero-cta.tsx",
+      "content": "import { Link } from \"react-router\";\r\nimport { ArrowRight, Star } from \"lucide-react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { Avatar, AvatarImage, AvatarFallback } from \"@/components/ui/avatar\";\r\nimport { Button } from \"@/components/ui/button\";\r\nimport { cn } from \"@/lib/utils\";\r\n\r\ninterface HeroCtaProps {\r\n  className?: string;\r\n}\r\n\r\nexport function HeroCta({ className }: HeroCtaProps) {\r\n  const { t } = useTranslation(\"hero-cta\");\r\n\r\n  const avatars = [\r\n    { src: \"/images/placeholder.png\", alt: \"User 1\", fallback: \"U1\" },\r\n    { src: \"/images/placeholder.png\", alt: \"User 2\", fallback: \"U2\" },\r\n    { src: \"/images/placeholder.png\", alt: \"User 3\", fallback: \"U3\" },\r\n    { src: \"/images/placeholder.png\", alt: \"User 4\", fallback: \"U4\" },\r\n    { src: \"/images/placeholder.png\", alt: \"User 5\", fallback: \"U5\" },\r\n  ];\r\n\r\n  return (\r\n    <section className={cn(\"py-16 md:py-24 lg:py-32\", className)}>\r\n      <div className=\"container mx-auto px-4\">\r\n        <div className=\"grid items-center gap-10 lg:grid-cols-2 lg:gap-16\">\r\n          {/* Content Column */}\r\n          <div className=\"flex flex-col items-center text-center lg:items-start lg:text-left\">\r\n            <h1 className=\"mb-6 text-3xl font-bold text-pretty sm:text-4xl lg:text-5xl xl:text-6xl leading-tight\">\r\n              {t(\"heading\", \"Build something amazing with our platform\")}\r\n            </h1>\r\n            <p className=\"mb-8 max-w-xl text-muted-foreground text-base lg:text-lg\">\r\n              {t(\"description\", \"Create beautiful, responsive applications with ease. Our tools help you ship faster and build better products.\")}\r\n            </p>\r\n\r\n            {/* Social Proof */}\r\n            <div className=\"mb-10 flex flex-col items-center gap-4 sm:flex-row lg:items-start\">\r\n              <div className=\"flex -space-x-3\">\r\n                {avatars.map((avatar, index) => (\r\n                  <Avatar key={index} className=\"h-10 w-10 border-2 border-background\">\r\n                    <AvatarImage src={avatar.src} alt={avatar.alt} />\r\n                    <AvatarFallback className=\"text-xs\">{avatar.fallback}</AvatarFallback>\r\n                  </Avatar>\r\n                ))}\r\n              </div>\r\n              <div>\r\n                <div className=\"flex items-center gap-1\">\r\n                  {[...Array(5)].map((_, index) => (\r\n                    <Star\r\n                      key={index}\r\n                      className=\"h-4 w-4 fill-yellow-400 text-yellow-400\"\r\n                    />\r\n                  ))}\r\n                  <span className=\"ml-1 font-semibold text-sm\">5.0</span>\r\n                </div>\r\n                <p className=\"text-sm text-muted-foreground\">\r\n                  {t(\"reviews\", \"from 200+ happy users\")}\r\n                </p>\r\n              </div>\r\n            </div>\r\n\r\n            {/* CTA Buttons */}\r\n            <div className=\"flex w-full flex-col gap-3 sm:flex-row sm:w-auto\">\r\n              <Button asChild size=\"lg\" className=\"w-full sm:w-auto\">\r\n                <Link to=\"/register\">\r\n                  {t(\"primaryCta\", \"Get Started Free\")}\r\n                </Link>\r\n              </Button>\r\n              <Button asChild variant=\"outline\" size=\"lg\" className=\"w-full sm:w-auto\">\r\n                <Link to=\"/about\">\r\n                  {t(\"secondaryCta\", \"Learn More\")}\r\n                  <ArrowRight className=\"ml-2 h-4 w-4\" />\r\n                </Link>\r\n              </Button>\r\n            </div>\r\n          </div>\r\n\r\n          {/* Image Column */}\r\n          <div className=\"relative order-first lg:order-last\">\r\n            <div className=\"aspect-[4/3] overflow-hidden rounded-2xl bg-muted\">\r\n              <img\r\n                src=\"/images/placeholder.png\"\r\n                alt={t(\"imageAlt\", \"Hero image\")}\r\n                className=\"h-full w-full object-cover\"\r\n                onError={(e) => {\r\n                  e.currentTarget.style.display = \"none\";\r\n                }}\r\n              />\r\n            </div>\r\n            {/* Decorative gradient blur */}\r\n            <div className=\"absolute -z-10 -bottom-4 -right-4 h-72 w-72 rounded-full bg-primary/20 blur-3xl\" />\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </section>\r\n  );\r\n}\r\n"
+    },
+    {
+      "path": "hero-cta/lang/en.json",
+      "type": "registry:lang",
+      "target": "$modules$/hero-cta/lang/en.json",
+      "content": "{\r\n  \"heading\": \"AI will customize this hero heading based on your site\",\r\n  \"description\": \"This is where your hero section description will appear. AI will replace this text with content relevant to your industry and services. Lorem ipsum dolor sit amet.\",\r\n  \"reviews\": \"AI will customize this review count\",\r\n  \"primaryCta\": \"Get Started\",\r\n  \"secondaryCta\": \"Learn More\",\r\n  \"imageAlt\": \"Hero image\"\r\n}\r\n"
+    },
+    {
+      "path": "hero-cta/lang/tr.json",
+      "type": "registry:lang",
+      "target": "$modules$/hero-cta/lang/tr.json",
+      "content": "{\r\n  \"heading\": \"AI bu hero başlığını sitenize göre özelleştirecektir\",\r\n  \"description\": \"Hero bölümü açıklamanız burada görünecektir. AI bu metni hedef kitlenize ve içeriğinize göre ilgili içerikle değiştirecektir. Lorem ipsum dolor sit amet.\",\r\n  \"reviews\": \"AI bu yorum sayısını özelleştirecektir\",\r\n  \"primaryCta\": \"Başlayın\",\r\n  \"secondaryCta\": \"Daha Fazla Bilgi\",\r\n  \"imageAlt\": \"Hero görseli\"\r\n}\r\n"
+    }
+  ],
+  "exports": {
+    "types": [],
+    "variables": [
+      "HeroCta"
+    ]
+  }
+}

package/dist/registry/hero-gradient.json

@@ -0,0 +1,40 @@
+{
+  "name": "hero-gradient",
+  "type": "registry:component",
+  "title": "Hero Gradient",
+  "description": "Centered hero section with animated gradient background, floating orbs, and grid pattern overlay. Features a badge, large two-line heading with gradient text, description, dual CTA buttons, and trust metric badges. Perfect for SaaS and tech landing pages.",
+  "registryDependencies": [],
+  "usage": "import { HeroGradient } from '@/modules/hero-gradient';\n\n<HeroGradient />\n\n- Animated gradient background with orbs\n- Grid pattern overlay\n- Badge with pulse animation\n- Trust metrics (users, uptime, support)",
+  "files": [
+    {
+      "path": "hero-gradient/index.ts",
+      "type": "registry:index",
+      "target": "$modules$/hero-gradient/index.ts",
+      "content": "export * from './hero-gradient';\r\n"
+    },
+    {
+      "path": "hero-gradient/hero-gradient.tsx",
+      "type": "registry:component",
+      "target": "$modules$/hero-gradient/hero-gradient.tsx",
+      "content": "import { Link } from \"react-router\";\r\nimport { ArrowRight } from \"lucide-react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { Button } from \"@/components/ui/button\";\r\nimport { cn } from \"@/lib/utils\";\r\n\r\ninterface HeroGradientProps {\r\n  className?: string;\r\n}\r\n\r\nexport function HeroGradient({ className }: HeroGradientProps) {\r\n  const { t } = useTranslation(\"hero-gradient\");\r\n\r\n  return (\r\n    <section\r\n      className={cn(\r\n        \"relative min-h-[70vh] flex items-center justify-center overflow-hidden\",\r\n        className\r\n      )}\r\n    >\r\n      {/* Gradient Background */}\r\n      <div className=\"absolute inset-0 bg-gradient-to-br from-primary/20 via-background to-primary/10\" />\r\n\r\n      {/* Animated gradient orbs */}\r\n      <div className=\"absolute top-1/4 left-1/4 h-96 w-96 rounded-full bg-primary/30 blur-3xl animate-pulse\" />\r\n      <div className=\"absolute bottom-1/4 right-1/4 h-80 w-80 rounded-full bg-primary/20 blur-3xl animate-pulse delay-700\" />\r\n\r\n      {/* Grid pattern overlay */}\r\n      <div className=\"absolute inset-0 bg-[linear-gradient(to_right,hsl(var(--border)/0.1)_1px,transparent_1px),linear-gradient(to_bottom,hsl(var(--border)/0.1)_1px,transparent_1px)] bg-[size:4rem_4rem]\" />\r\n\r\n      {/* Content */}\r\n      <div className=\"container mx-auto px-4 relative z-10\">\r\n        <div className=\"max-w-4xl mx-auto text-center\">\r\n          {/* Badge */}\r\n          <div className=\"inline-flex items-center gap-2 rounded-full border border-border/50 bg-background/50 backdrop-blur-sm px-4 py-1.5 text-sm mb-8\">\r\n            <span className=\"relative flex h-2 w-2\">\r\n              <span className=\"animate-ping absolute inline-flex h-full w-full rounded-full bg-primary opacity-75\" />\r\n              <span className=\"relative inline-flex rounded-full h-2 w-2 bg-primary\" />\r\n            </span>\r\n            {t(\"badge\", \"New features available\")}\r\n          </div>\r\n\r\n          {/* Heading */}\r\n          <h1 className=\"text-4xl sm:text-5xl md:text-6xl lg:text-7xl font-bold tracking-tight mb-6 leading-tight\">\r\n            {t(\"headingLine1\", \"Transform your ideas\")}\r\n            <br />\r\n            <span className=\"bg-gradient-to-r from-primary to-primary/60 bg-clip-text text-transparent\">\r\n              {t(\"headingLine2\", \"into reality\")}\r\n            </span>\r\n          </h1>\r\n\r\n          {/* Description */}\r\n          <p className=\"text-lg md:text-xl text-muted-foreground max-w-2xl mx-auto mb-10\">\r\n            {t(\"description\", \"A powerful platform that helps you build, deploy, and scale your applications with ease. Start your journey today.\")}\r\n          </p>\r\n\r\n          {/* CTA Buttons */}\r\n          <div className=\"flex flex-col sm:flex-row gap-4 justify-center\">\r\n            <Button asChild size=\"lg\" className=\"text-base px-8\">\r\n              <Link to=\"/register\">\r\n                {t(\"primaryCta\", \"Start Building\")}\r\n                <ArrowRight className=\"ml-2 h-4 w-4\" />\r\n              </Link>\r\n            </Button>\r\n            <Button asChild variant=\"outline\" size=\"lg\" className=\"text-base px-8\">\r\n              <Link to=\"/contact\">\r\n                {t(\"secondaryCta\", \"Contact Sales\")}\r\n              </Link>\r\n            </Button>\r\n          </div>\r\n\r\n          {/* Trust badges */}\r\n          <div className=\"mt-12 flex flex-wrap items-center justify-center gap-8 text-muted-foreground\">\r\n            <div className=\"flex items-center gap-2\">\r\n              <span className=\"text-2xl font-bold text-foreground\">10K+</span>\r\n              <span className=\"text-sm\">{t(\"users\", \"Active Users\")}</span>\r\n            </div>\r\n            <div className=\"h-8 w-px bg-border hidden sm:block\" />\r\n            <div className=\"flex items-center gap-2\">\r\n              <span className=\"text-2xl font-bold text-foreground\">99.9%</span>\r\n              <span className=\"text-sm\">{t(\"uptime\", \"Uptime\")}</span>\r\n            </div>\r\n            <div className=\"h-8 w-px bg-border hidden sm:block\" />\r\n            <div className=\"flex items-center gap-2\">\r\n              <span className=\"text-2xl font-bold text-foreground\">24/7</span>\r\n              <span className=\"text-sm\">{t(\"support\", \"Support\")}</span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </section>\r\n  );\r\n}\r\n"
+    },
+    {
+      "path": "hero-gradient/lang/en.json",
+      "type": "registry:lang",
+      "target": "$modules$/hero-gradient/lang/en.json",
+      "content": "{\r\n  \"badge\": \"AI will customize this badge text\",\r\n  \"headingLine1\": \"AI will replace this heading\",\r\n  \"headingLine2\": \"with your site headline\",\r\n  \"description\": \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. AI will customize this description based on your site and audience. Sed do eiusmod tempor incididunt ut labore.\",\r\n  \"primaryCta\": \"Get Started\",\r\n  \"secondaryCta\": \"Contact Sales\",\r\n  \"users\": \"Active Users\",\r\n  \"uptime\": \"Uptime\",\r\n  \"support\": \"Support\"\r\n}\r\n"
+    },
+    {
+      "path": "hero-gradient/lang/tr.json",
+      "type": "registry:lang",
+      "target": "$modules$/hero-gradient/lang/tr.json",
+      "content": "{\r\n  \"badge\": \"AI bu rozet metnini özelleştirecektir\",\r\n  \"headingLine1\": \"AI bu başlığı\",\r\n  \"headingLine2\": \"site başlığınızla değiştirecektir\",\r\n  \"description\": \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. AI bu açıklamayı sitenize ve hedef kitlenize göre özelleştirecektir. Sed do eiusmod tempor incididunt ut labore.\",\r\n  \"primaryCta\": \"Başlayın\",\r\n  \"secondaryCta\": \"Satış ile İletişim\",\r\n  \"users\": \"Aktif Kullanıcı\",\r\n  \"uptime\": \"Çalışma Süresi\",\r\n  \"support\": \"Destek\"\r\n}\r\n"
+    }
+  ],
+  "exports": {
+    "types": [],
+    "variables": [
+      "HeroGradient"
+    ]
+  }
+}

package/dist/registry/hero-grid.json

@@ -0,0 +1,42 @@
+{
+  "name": "hero-grid",
+  "type": "registry:component",
+  "title": "Hero Grid",
+  "description": "Hero section with decorative image grid on the right side. Features a bold headline, description text, and CTA button on the left with a floating grid of 7 product images on the right. Perfect for e-commerce landing pages.",
+  "registryDependencies": [
+    "button"
+  ],
+  "usage": "import { HeroGrid } from '@/modules/hero-grid';\n\n<HeroGrid\n  images={[\n    '/images/product-1.jpg',\n    '/images/product-2.jpg',\n    // ... 7 images total\n  ]}\n  ctaHref=\"/products\"\n/>",
+  "files": [
+    {
+      "path": "hero-grid/index.ts",
+      "type": "registry:index",
+      "target": "$modules$/hero-grid/index.ts",
+      "content": "export * from './hero-grid';\r\n"
+    },
+    {
+      "path": "hero-grid/hero-grid.tsx",
+      "type": "registry:component",
+      "target": "$modules$/hero-grid/hero-grid.tsx",
+      "content": "import { Link } from \"react-router\";\r\nimport { Button } from \"@/components/ui/button\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { useTranslation } from \"react-i18next\";\r\n\r\ninterface HeroGridProps {\r\n  images?: string[];\r\n  ctaHref?: string;\r\n  className?: string;\r\n}\r\n\r\nexport function HeroGrid({\r\n  images = [\r\n    \"/images/placeholder.png\",\r\n    \"/images/placeholder.png\",\r\n    \"/images/placeholder.png\",\r\n    \"/images/placeholder.png\",\r\n    \"/images/placeholder.png\",\r\n    \"/images/placeholder.png\",\r\n    \"/images/placeholder.png\",\r\n  ],\r\n  ctaHref = \"/products\",\r\n  className,\r\n}: HeroGridProps) {\r\n  const { t } = useTranslation(\"hero-grid\");\r\n\r\n  return (\r\n    <div className={cn(\"relative overflow-hidden bg-background\", className)}>\r\n      <div className=\"pt-16 pb-80 sm:pt-24 sm:pb-40 lg:pt-40 lg:pb-48\">\r\n        <div className=\"relative mx-auto max-w-7xl px-4 sm:static sm:px-6 lg:px-8\">\r\n          <div className=\"sm:max-w-lg\">\r\n            <h1 className=\"text-4xl font-bold tracking-tight sm:text-6xl\">\r\n              {t(\"title\", \"Discover Our Latest Collection\")}\r\n            </h1>\r\n            <p className=\"mt-4 text-xl text-muted-foreground\">\r\n              {t(\"description\", \"Explore our curated selection of premium products designed to elevate your everyday experience.\")}\r\n            </p>\r\n          </div>\r\n          <div>\r\n            <div className=\"mt-10\">\r\n              {/* Decorative image grid */}\r\n              <div\r\n                aria-hidden=\"true\"\r\n                className=\"pointer-events-none lg:absolute lg:inset-y-0 lg:mx-auto lg:w-full lg:max-w-7xl\"\r\n              >\r\n                <div className=\"absolute transform sm:top-0 sm:left-1/2 sm:translate-x-8 lg:top-1/2 lg:left-1/2 lg:translate-x-8 lg:-translate-y-1/2\">\r\n                  <div className=\"flex items-center space-x-6 lg:space-x-8\">\r\n                    <div className=\"grid shrink-0 grid-cols-1 gap-y-6 lg:gap-y-8\">\r\n                      <div className=\"h-64 w-44 overflow-hidden rounded-lg sm:opacity-0 lg:opacity-100\">\r\n                        <img\r\n                          alt=\"\"\r\n                          src={images[0]}\r\n                          className=\"size-full object-cover\"\r\n                        />\r\n                      </div>\r\n                      <div className=\"h-64 w-44 overflow-hidden rounded-lg\">\r\n                        <img\r\n                          alt=\"\"\r\n                          src={images[1]}\r\n                          className=\"size-full object-cover\"\r\n                        />\r\n                      </div>\r\n                    </div>\r\n                    <div className=\"grid shrink-0 grid-cols-1 gap-y-6 lg:gap-y-8\">\r\n                      <div className=\"h-64 w-44 overflow-hidden rounded-lg\">\r\n                        <img\r\n                          alt=\"\"\r\n                          src={images[2]}\r\n                          className=\"size-full object-cover\"\r\n                        />\r\n                      </div>\r\n                      <div className=\"h-64 w-44 overflow-hidden rounded-lg\">\r\n                        <img\r\n                          alt=\"\"\r\n                          src={images[3]}\r\n                          className=\"size-full object-cover\"\r\n                        />\r\n                      </div>\r\n                      <div className=\"h-64 w-44 overflow-hidden rounded-lg\">\r\n                        <img\r\n                          alt=\"\"\r\n                          src={images[4]}\r\n                          className=\"size-full object-cover\"\r\n                        />\r\n                      </div>\r\n                    </div>\r\n                    <div className=\"grid shrink-0 grid-cols-1 gap-y-6 lg:gap-y-8\">\r\n                      <div className=\"h-64 w-44 overflow-hidden rounded-lg\">\r\n                        <img\r\n                          alt=\"\"\r\n                          src={images[5]}\r\n                          className=\"size-full object-cover\"\r\n                        />\r\n                      </div>\r\n                      <div className=\"h-64 w-44 overflow-hidden rounded-lg\">\r\n                        <img\r\n                          alt=\"\"\r\n                          src={images[6]}\r\n                          className=\"size-full object-cover\"\r\n                        />\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n\r\n              <Button asChild size=\"lg\">\r\n                <Link to={ctaHref}>\r\n                  {t(\"cta\", \"Shop Collection\")}\r\n                </Link>\r\n              </Button>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n"
+    },
+    {
+      "path": "hero-grid/lang/en.json",
+      "type": "registry:lang",
+      "target": "$modules$/hero-grid/lang/en.json",
+      "content": "{\r\n  \"title\": \"Discover What We Offer\",\r\n  \"description\": \"Explore our curated selection of offerings designed to elevate your experience and help you achieve your goals.\",\r\n  \"cta\": \"Explore Now\"\r\n}\r\n"
+    },
+    {
+      "path": "hero-grid/lang/tr.json",
+      "type": "registry:lang",
+      "target": "$modules$/hero-grid/lang/tr.json",
+      "content": "{\r\n  \"title\": \"Neler Sunduğumuzu Keşfedin\",\r\n  \"description\": \"Deneyiminizi zenginleştirmek ve hedeflerinize ulaşmanıza yardımcı olmak için tasarlanmış özenle seçilmiş tekliflerimizi keşfedin.\",\r\n  \"cta\": \"Keşfet\"\r\n}\r\n"
+    }
+  ],
+  "exports": {
+    "types": [],
+    "variables": [
+      "HeroGrid"
+    ]
+  }
+}

package/dist/registry/hero-profile.json

@@ -0,0 +1,62 @@
+{
+  "name": "hero-profile",
+  "type": "registry:component",
+  "title": "Profile Hero",
+  "description": "Personal profile hero with profile card (photo, name, title, bio, social links), animated company/client logo carousel, and glassmorphism card design. Works for portfolios, personal branding, freelancer sites, and any professional showcase.",
+  "dependencies": [
+    "motion"
+  ],
+  "registryDependencies": [],
+  "usage": "import { HeroProfile } from '@/modules/hero-profile';\n\n<HeroProfile />\n\n- Profile card with photo, name, bio\n- Social media links (Facebook, X, LinkedIn)\n- Animated company carousel\n- Glassmorphism design",
+  "files": [
+    {
+      "path": "hero-profile/index.ts",
+      "type": "registry:index",
+      "target": "$modules$/hero-profile/index.ts",
+      "content": "export * from './hero-profile';\r\n"
+    },
+    {
+      "path": "hero-profile/hero-profile.tsx",
+      "type": "registry:component",
+      "target": "$modules$/hero-profile/hero-profile.tsx",
+      "content": "import { useTranslation } from \"react-i18next\";\nimport { Facebook, Linkedin, Twitter, Github, Instagram } from \"lucide-react\";\nimport { motion } from \"motion/react\";\nimport { cn } from \"@/lib/utils\";\n\nconst socialLinks = [\n  { icon: Facebook, href: \"#\", label: \"Facebook\" },\n  { icon: Twitter, href: \"#\", label: \"Twitter\" },\n  { icon: Linkedin, href: \"#\", label: \"LinkedIn\" },\n  { icon: Github, href: \"#\", label: \"GitHub\" },\n  { icon: Instagram, href: \"#\", label: \"Instagram\" },\n];\n\nexport function HeroProfile() {\n  const { t } = useTranslation(\"hero-profile\");\n  const companies = [\"Walmart\", \"LinkedIn\", \"Google\", \"Slack\", \"Amazon\"];\n\n  return (\n    <section className=\"relative min-h-[80vh] flex items-center overflow-hidden\">\n      {/* Background */}\n      <div className=\"absolute inset-0 bg-gradient-to-br from-primary/5 via-transparent to-primary/10\" />\n\n      {/* Content */}\n      <div className=\"container mx-auto px-4 relative z-10 py-12\">\n        <div className=\"grid grid-cols-1 lg:grid-cols-3 gap-8\">\n          {/* Left Column - Profile Card */}\n          <motion.div\n            initial={{ opacity: 0, x: -50 }}\n            animate={{ opacity: 1, x: 0 }}\n            transition={{ duration: 0.6, ease: \"easeOut\" }}\n            className=\"lg:col-span-1 flex\"\n          >\n            <div className=\"bg-card/80 backdrop-blur-lg rounded-3xl p-6 md:p-8 text-center space-y-6 border border-border/50 shadow-xl flex flex-col justify-center w-full\">\n              {/* Profile Image */}\n              <motion.div\n                initial={{ scale: 0.8, opacity: 0 }}\n                animate={{ scale: 1, opacity: 1 }}\n                transition={{ duration: 0.5, delay: 0.2 }}\n                className=\"relative mx-auto w-40 h-40 sm:w-48 sm:h-48\"\n              >\n                <div className=\"absolute inset-0 bg-gradient-to-br from-primary to-primary/50 rounded-full blur-xl opacity-30 animate-pulse\" />\n                <img\n                  src=\"/images/placeholder.png\"\n                  alt={t(\"name\")}\n                  className=\"relative w-full h-full object-cover object-center rounded-full border-4 border-primary/20 shadow-lg\"\n                  onError={(e) => {\n                    e.currentTarget.style.display = \"none\";\n                  }}\n                />\n              </motion.div>\n\n              {/* Name and Bio */}\n              <motion.div\n                initial={{ opacity: 0, y: 20 }}\n                animate={{ opacity: 1, y: 0 }}\n                transition={{ duration: 0.5, delay: 0.3 }}\n                className=\"space-y-2\"\n              >\n                <h1 className=\"text-2xl sm:text-3xl font-bold\">{t(\"name\")}</h1>\n                <p className=\"text-muted-foreground\">{t(\"bio\")}</p>\n              </motion.div>\n\n              {/* Social Media Icons */}\n              <motion.div\n                initial={{ opacity: 0 }}\n                animate={{ opacity: 1 }}\n                transition={{ duration: 0.5, delay: 0.4 }}\n                className=\"flex justify-center gap-2\"\n              >\n                {socialLinks.slice(0, 4).map((social, index) => {\n                  const Icon = social.icon;\n                  return (\n                    <motion.a\n                      key={social.label}\n                      href={social.href}\n                      initial={{ scale: 0 }}\n                      animate={{ scale: 1 }}\n                      transition={{ duration: 0.3, delay: 0.5 + index * 0.1 }}\n                      whileHover={{ scale: 1.1, y: -2 }}\n                      whileTap={{ scale: 0.95 }}\n                      className={cn(\n                        \"w-10 h-10 rounded-full flex items-center justify-center\",\n                        \"bg-muted/50 text-muted-foreground\",\n                        \"hover:bg-primary hover:text-primary-foreground\",\n                        \"transition-colors duration-300 shadow-sm\"\n                      )}\n                    >\n                      <Icon className=\"w-4 h-4\" />\n                    </motion.a>\n                  );\n                })}\n              </motion.div>\n            </div>\n          </motion.div>\n\n          {/* Right Column - Two Cards */}\n          <div className=\"lg:col-span-2 flex flex-col gap-6\">\n            {/* Top Card - Introduction */}\n            <motion.div\n              initial={{ opacity: 0, y: 30 }}\n              animate={{ opacity: 1, y: 0 }}\n              transition={{ duration: 0.6, delay: 0.2 }}\n              className=\"bg-card/80 backdrop-blur-lg rounded-3xl p-6 md:p-8 border border-border/50 shadow-xl flex-1 flex flex-col justify-center\"\n            >\n              <div className=\"space-y-4\">\n                <motion.p\n                  initial={{ opacity: 0 }}\n                  animate={{ opacity: 1 }}\n                  transition={{ delay: 0.4 }}\n                  className=\"text-sm text-muted-foreground\"\n                >\n                  {t(\"greeting\")}\n                </motion.p>\n\n                <motion.h2\n                  initial={{ opacity: 0, y: 20 }}\n                  animate={{ opacity: 1, y: 0 }}\n                  transition={{ delay: 0.5 }}\n                  className=\"text-2xl sm:text-3xl lg:text-4xl font-bold leading-tight\"\n                >\n                  {t(\"intro\")}\n                </motion.h2>\n\n                <motion.div\n                  initial={{ opacity: 0 }}\n                  animate={{ opacity: 1 }}\n                  transition={{ delay: 0.6 }}\n                  className=\"flex items-center gap-2\"\n                >\n                  <span className=\"inline-flex items-center gap-2 px-4 py-2 bg-primary/10 rounded-full text-sm font-medium text-primary\">\n                    <span className=\"w-2 h-2 bg-green-500 rounded-full animate-pulse\" />\n                    {t(\"freelancing\")}\n                  </span>\n                </motion.div>\n              </div>\n            </motion.div>\n\n            {/* Bottom Card - Companies Marquee */}\n            <motion.div\n              initial={{ opacity: 0, y: 30 }}\n              animate={{ opacity: 1, y: 0 }}\n              transition={{ duration: 0.6, delay: 0.4 }}\n              className=\"bg-card/80 backdrop-blur-lg rounded-3xl p-6 md:p-8 border border-border/50 shadow-xl overflow-hidden flex-1 flex flex-col justify-center\"\n            >\n              <h3 className=\"text-lg font-semibold mb-6\">\n                {t(\"companiesTitle\")}\n              </h3>\n\n              <div className=\"relative overflow-hidden\">\n                {/* Gradient masks */}\n                <div className=\"absolute left-0 top-0 bottom-0 w-20 bg-gradient-to-r from-card to-transparent z-10\" />\n                <div className=\"absolute right-0 top-0 bottom-0 w-20 bg-gradient-to-l from-card to-transparent z-10\" />\n\n                {/* Scrolling container */}\n                <motion.div\n                  animate={{ x: [0, -1000] }}\n                  transition={{\n                    x: {\n                      repeat: Infinity,\n                      repeatType: \"loop\",\n                      duration: 20,\n                      ease: \"linear\",\n                    },\n                  }}\n                  className=\"flex gap-16 whitespace-nowrap\"\n                >\n                  {[...companies, ...companies, ...companies].map(\n                    (company, index) => (\n                      <div\n                        key={index}\n                        className=\"text-xl font-bold text-muted-foreground/70 hover:text-foreground transition-colors\"\n                      >\n                        {company}\n                      </div>\n                    )\n                  )}\n                </motion.div>\n              </div>\n            </motion.div>\n          </div>\n        </div>\n      </div>\n    </section>\n  );\n}\n"
+    },
+    {
+      "path": "hero-profile/lang/en.json",
+      "type": "registry:lang",
+      "target": "$modules$/hero-profile/lang/en.json",
+      "content": "{\r\n  \"name\": \"Your Name\",\r\n  \"bio\": \"Your professional title and location\",\r\n  \"greeting\": \"Hello There!\",\r\n  \"intro\": \"Your introduction and what you do\",\r\n  \"freelancing\": \"Available for Freelancing\",\r\n  \"companiesTitle\": \"Teams I've Worked With\"\r\n}\r\n"
+    },
+    {
+      "path": "hero-profile/lang/tr.json",
+      "type": "registry:lang",
+      "target": "$modules$/hero-profile/lang/tr.json",
+      "content": "{\r\n  \"name\": \"Adınız\",\r\n  \"bio\": \"Mesleğiniz ve konumunuz\",\r\n  \"greeting\": \"Merhaba!\",\r\n  \"intro\": \"Tanıtımınız ve ne yaptığınız\",\r\n  \"freelancing\": \"Freelance İçin Müsait\",\r\n  \"companiesTitle\": \"Çalıştığım Ekipler\"\r\n}\r\n"
+    }
+  ],
+  "tailwind": {
+    "config": {
+      "theme": {
+        "keyframes": {
+          "scroll": {
+            "0%": {
+              "transform": "translateX(0)"
+            },
+            "100%": {
+              "transform": "translateX(-50%)"
+            }
+          }
+        },
+        "animation": {
+          "scroll": "scroll 20s linear infinite"
+        }
+      }
+    }
+  },
+  "exports": {
+    "types": [],
+    "variables": [
+      "HeroProfile"
+    ]
+  }
+}

package/dist/registry/hero.json

@@ -0,0 +1,40 @@
+{
+  "name": "hero",
+  "type": "registry:component",
+  "title": "Hero Section",
+  "description": "Modern hero section with gradient background (customizable via CSS variables), large headline, subtitle text, and dual CTA buttons (primary and secondary). Features animated entrance effects, responsive typography scaling, and optional background pattern overlay. Perfect for landing pages and marketing sites.",
+  "registryDependencies": [],
+  "usage": "import { Hero } from '@/modules/hero';\n\n<Hero />\n\n• Installed at: src/modules/hero/\n• Customize content: src/modules/hero/lang/*.json\n• Customize gradient: --hero-gradient-from, --hero-gradient-to",
+  "files": [
+    {
+      "path": "hero/index.ts",
+      "type": "registry:index",
+      "target": "$modules$/hero/index.ts",
+      "content": "export * from './hero';\r\n"
+    },
+    {
+      "path": "hero/hero.tsx",
+      "type": "registry:component",
+      "target": "$modules$/hero/hero.tsx",
+      "content": "import { useTranslation } from \"react-i18next\";\n\nexport function Hero() {\n  const { t } = useTranslation(\"hero\");\n\n  return (\n    <section className=\"relative min-h-[60vh] flex items-center overflow-hidden bg-gradient-to-br from-background via-muted/10 to-background\">\n      {/* Background Image */}\n      <div className=\"absolute inset-0\">\n        {/* Background image will be placed here */}\n        <img\n          src=\"/images/placeholder.png\"\n          alt=\"Hero Background\"\n          className=\"w-full h-full object-cover\"\n          onError={(e) => {\n            // Hide broken image and keep gradient background\n            e.currentTarget.style.display = \"none\";\n          }}\n        />\n\n        {/* Dark overlay for text readability */}\n        <div className=\"absolute inset-0 bg-gradient-to-r from-black/60 via-black/30 to-transparent\"></div>\n\n        {/* Fallback gradient background */}\n        <div className=\"absolute inset-0 bg-gradient-to-r from-primary/5 via-transparent to-primary/5\"></div>\n      </div>\n\n      {/* Content - Left Aligned with better contrast */}\n      <div className=\"container mx-auto px-4 relative z-10\">\n        <div className=\"max-w-2xl\">\n          {/* Main Headline */}\n          <div className=\"space-y-6 mb-8\">\n            <h1 className=\"text-4xl md:text-5xl lg:text-6xl font-bold leading-normal text-white drop-shadow-lg pb-1\">\n              <span>{t(\"discover\", \"Discover\")} </span>\n              <span className=\"bg-gradient-to-r from-primary to-primary/80 bg-clip-text text-transparent\">\n                {t(\"amazing\", \"Inspiring\")}\n              </span>\n              <br />\n              <span>{t(\"content\", \"Stories\")}</span>\n            </h1>\n\n            <p className=\"text-xl text-white/90 max-w-lg leading-relaxed drop-shadow-md\">\n              {t(\n                \"subtitle\",\n                \"Dive into a world of captivating narratives, expert insights, and thought-provoking content that inspires and educates.\"\n              )}\n            </p>\n          </div>\n        </div>\n      </div>\n    </section>\n  );\n}\n"
+    },
+    {
+      "path": "hero/lang/en.json",
+      "type": "registry:lang",
+      "target": "$modules$/hero/lang/en.json",
+      "content": "{\r\n  \"discover\": \"Discover\",\r\n  \"amazing\": \"Inspiring\",\r\n  \"content\": \"Stories\",\r\n  \"subtitle\": \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. AI will replace this content with your actual blog description.\",\r\n  \"readLatest\": \"Start Reading\",\r\n  \"exploreTopics\": \"Explore Topics\"\r\n}\r\n"
+    },
+    {
+      "path": "hero/lang/tr.json",
+      "type": "registry:lang",
+      "target": "$modules$/hero/lang/tr.json",
+      "content": "{\r\n  \"discover\": \"Keşfedin\",\r\n  \"amazing\": \"İlham Verici\",\r\n  \"content\": \"Hikayeler\",\r\n  \"subtitle\": \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore. AI bu içeriği gerçek blog açıklamanızla değiştirecektir.\",\r\n  \"readLatest\": \"Okumaya Başlayın\",\r\n  \"exploreTopics\": \"Konuları Keşfedin\"\r\n}\r\n"
+    }
+  ],
+  "exports": {
+    "types": [],
+    "variables": [
+      "Hero"
+    ]
+  }
+}

package/dist/registry/index.json

@@ -0,0 +1,70 @@
+[
+  "about-page",
+  "about-section",
+  "animations",
+  "bento-grid-section",
+  "blog-core",
+  "blog-list-page",
+  "blog-section",
+  "cards-carousel-section",
+  "cart-drawer",
+  "cart-page",
+  "category-section",
+  "checkout-page",
+  "contact-info-grid",
+  "contact-page",
+  "contact-page-centered",
+  "contact-page-map-overlay",
+  "contact-page-map-split",
+  "contact-page-split",
+  "content-section",
+  "cookies-page",
+  "cta-section",
+  "ecommerce-core",
+  "empty-page",
+  "faq-categorized",
+  "faq-simple",
+  "favorites-blog-block",
+  "favorites-ecommerce-block",
+  "feature-section",
+  "featured-products",
+  "footer",
+  "footer-detailed",
+  "footer-minimal",
+  "google-map",
+  "header-centered-pill",
+  "header-ecommerce",
+  "header-mega",
+  "header-minimal",
+  "header-simple",
+  "hero",
+  "hero-cta",
+  "hero-gradient",
+  "hero-grid",
+  "hero-profile",
+  "login-page",
+  "login-page-split",
+  "newsletter-section",
+  "order-card-compact",
+  "order-detail-block",
+  "orders-list-block",
+  "payment-success-block",
+  "post-card",
+  "post-detail-block",
+  "pricing-card",
+  "pricing-section",
+  "privacy-page",
+  "product-card",
+  "product-card-detailed",
+  "product-card-hover",
+  "product-detail-block",
+  "product-detail-section",
+  "products-page",
+  "related-posts-block",
+  "related-products-block",
+  "service-card",
+  "skill-card",
+  "terms-page",
+  "testimonials-carousel",
+  "testimonials-grid"
+]

package/dist/registry/login-page-split.json

@@ -0,0 +1,47 @@
+{
+  "name": "login-page-split",
+  "type": "registry:page",
+  "title": "Login Page Split",
+  "description": "Split-screen login page with form on the left and full-height image on the right. Features email/password fields, Google login button, sign up and forgot password links. Clean minimal design with responsive layout.",
+  "registryDependencies": [
+    "input",
+    "button"
+  ],
+  "usage": "import LoginPageSplit from '@/modules/login-page-split';\n\n<LoginPageSplit\n  image=\"/images/login-bg.jpg\"\n/>\n\n• Installed at: src/modules/login-page-split/\n• Customize text: src/modules/login-page-split/lang/*.json\n• Add to your router as a page component",
+  "route": {
+    "path": "/login",
+    "componentName": "LoginPageSplit"
+  },
+  "files": [
+    {
+      "path": "login-page-split/index.ts",
+      "type": "registry:index",
+      "target": "$modules$/login-page-split/index.ts",
+      "content": "export * from './login-page-split';\r\n"
+    },
+    {
+      "path": "login-page-split/login-page-split.tsx",
+      "type": "registry:component",
+      "target": "$modules$/login-page-split/login-page-split.tsx",
+      "content": "import { Link } from \"react-router\";\r\nimport { Logo } from \"@/components/Logo\";\r\nimport { Button } from \"@/components/ui/button\";\r\nimport { Input } from \"@/components/ui/input\";\r\nimport { Label } from \"@/components/ui/label\";\r\nimport { useTranslation } from \"react-i18next\";\r\n\r\ninterface LoginPageSplitProps {\r\n  image?: string;\r\n}\r\n\r\nexport default function LoginPageSplit({\r\n  image = \"/images/placeholder.png\",\r\n}: LoginPageSplitProps) {\r\n  const { t } = useTranslation(\"login-page-split\");\r\n\r\n  const handleSubmit = (e: React.FormEvent) => {\r\n    e.preventDefault();\r\n    // Handle login\r\n  };\r\n\r\n  return (\r\n    <section className=\"w-full md:grid md:min-h-screen md:grid-cols-2\">\r\n      <div className=\"flex items-center justify-center px-4 py-12\">\r\n        <div className=\"mx-auto grid w-full max-w-sm gap-6\">\r\n          <Logo />\r\n          <hr />\r\n          <div>\r\n            <h1 className=\"text-xl font-bold tracking-tight\">\r\n              {t(\"title\", \"Login\")}\r\n            </h1>\r\n            <p className=\"text-sm text-muted-foreground\">\r\n              {t(\"subtitle\", \"Enter your details below to login\")}\r\n            </p>\r\n          </div>\r\n          <form onSubmit={handleSubmit} className=\"grid gap-4\">\r\n            <div className=\"grid gap-2\">\r\n              <Label htmlFor=\"email-split\">{t(\"email\", \"Email\")}</Label>\r\n              <Input\r\n                required\r\n                id=\"email-split\"\r\n                type=\"email\"\r\n                autoComplete=\"username\"\r\n                placeholder={t(\"emailPlaceholder\", \"email@example.com\")}\r\n              />\r\n            </div>\r\n            <div className=\"grid gap-2\">\r\n              <Label htmlFor=\"password-split\">{t(\"password\", \"Password\")}</Label>\r\n              <Input\r\n                required\r\n                id=\"password-split\"\r\n                type=\"password\"\r\n                placeholder=\"••••••••••\"\r\n                autoComplete=\"current-password\"\r\n              />\r\n            </div>\r\n            <Button type=\"submit\" className=\"w-full\">\r\n              {t(\"login\", \"Login\")}\r\n            </Button>\r\n            <Button variant=\"outline\" className=\"w-full\">\r\n              {t(\"loginGoogle\", \"Login with Google\")}\r\n            </Button>\r\n          </form>\r\n          <div className=\"flex flex-col gap-4 text-sm\">\r\n            <p>\r\n              {t(\"noAccount\", \"Don't have an account?\")}{\" \"}\r\n              <Link to=\"/register\" className=\"underline\">\r\n                {t(\"signUp\", \"Sign up\")}\r\n              </Link>\r\n            </p>\r\n            <Link to=\"/forgot-password\" className=\"underline\">\r\n              {t(\"forgotPassword\", \"Forgot your password?\")}\r\n            </Link>\r\n          </div>\r\n          <hr />\r\n          <p className=\"text-sm text-muted-foreground\">\r\n            © {new Date().getFullYear()} {t(\"copyright\", \"All rights reserved.\")}\r\n          </p>\r\n        </div>\r\n      </div>\r\n      <div className=\"hidden p-4 md:block\">\r\n        <img\r\n          loading=\"lazy\"\r\n          decoding=\"async\"\r\n          width=\"1920\"\r\n          height=\"1080\"\r\n          alt={t(\"imageAlt\", \"Login background\")}\r\n          src={image}\r\n          className=\"size-full rounded-lg border bg-muted object-cover object-center\"\r\n        />\r\n      </div>\r\n    </section>\r\n  );\r\n}\r\n\r\nexport { LoginPageSplit };\r\n"
+    },
+    {
+      "path": "login-page-split/lang/en.json",
+      "type": "registry:lang",
+      "target": "$modules$/login-page-split/lang/en.json",
+      "content": "{\r\n  \"title\": \"Login\",\r\n  \"subtitle\": \"Enter your details below to login\",\r\n  \"email\": \"Email\",\r\n  \"emailPlaceholder\": \"email@example.com\",\r\n  \"password\": \"Password\",\r\n  \"login\": \"Login\",\r\n  \"loginGoogle\": \"Login with Google\",\r\n  \"noAccount\": \"Don't have an account?\",\r\n  \"signUp\": \"Sign up\",\r\n  \"forgotPassword\": \"Forgot your password?\",\r\n  \"copyright\": \"All rights reserved.\",\r\n  \"imageAlt\": \"Login background\"\r\n}\r\n"
+    },
+    {
+      "path": "login-page-split/lang/tr.json",
+      "type": "registry:lang",
+      "target": "$modules$/login-page-split/lang/tr.json",
+      "content": "{\r\n  \"title\": \"Giriş Yap\",\r\n  \"subtitle\": \"Giriş yapmak için bilgilerinizi girin\",\r\n  \"email\": \"E-posta\",\r\n  \"emailPlaceholder\": \"eposta@ornek.com\",\r\n  \"password\": \"Şifre\",\r\n  \"login\": \"Giriş Yap\",\r\n  \"loginGoogle\": \"Google ile Giriş Yap\",\r\n  \"noAccount\": \"Hesabınız yok mu?\",\r\n  \"signUp\": \"Kayıt Ol\",\r\n  \"forgotPassword\": \"Şifrenizi mi unuttunuz?\",\r\n  \"copyright\": \"Tüm hakları saklıdır.\",\r\n  \"imageAlt\": \"Giriş arka planı\"\r\n}\r\n"
+    }
+  ],
+  "exports": {
+    "types": [],
+    "variables": [
+      "LoginPageSplit"
+    ]
+  }
+}