{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "navigation-basic",
  "type": "registry:component",
  "title": "Navigation Basic",
  "description": "Navigation Basic",
  "files": [
    {
      "path": "registry/ui-basic/NavigationBasic.tsx",
      "content": "import React, { useState } from \"react\";\n\nexport default function NavigationBasic() {\n\tconst [isToggleOpen, setIsToggleOpen] = useState(false);\n\n\treturn (\n\t\t<>\n\t\t\t{/*<!-- Component: Basic Navbar --> */}\n\t\t\t<header className=\" relative z-20 w-full border-b border-slate-200 bg-white/90 shadow-lg shadow-slate-700/5 after:absolute after:left-0 after:top-full after:z-10 after:block after:h-px after:w-full after:bg-slate-200 lg:border-slate-200 lg:backdrop-blur-xs lg:after:hidden\">\n\t\t\t\t<div className=\"relative mx-auto max-w-full px-6 lg:max-w-5xl xl:max-w-7xl 2xl:max-w-384\">\n\t\t\t\t\t<nav\n\t\t\t\t\t\taria-label=\"main navigation\"\n\t\t\t\t\t\tclassName=\"flex h-22 items-stretch justify-between font-medium text-slate-700\"\n\t\t\t\t\t\trole=\"navigation\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{/*      <!-- Brand logo --> */}\n\t\t\t\t\t\t<a\n\t\t\t\t\t\t\tid=\"WindUI\"\n\t\t\t\t\t\t\taria-label=\"WindUI logo\"\n\t\t\t\t\t\t\taria-current=\"page\"\n\t\t\t\t\t\t\tclassName=\"flex items-center gap-2 whitespace-nowrap py-3 text-lg focus:outline-hidden lg:flex-1\"\n\t\t\t\t\t\t\thref=\"javascript:void(0)\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<svg\n\t\t\t\t\t\t\t\twidth=\"300\"\n\t\t\t\t\t\t\t\theight=\"300\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 300 300\"\n\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\t\t\t\tclassName=\"h-12 w-12 bg-emerald-500\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\tfillRule=\"evenodd\"\n\t\t\t\t\t\t\t\t\tclipRule=\"evenodd\"\n\t\t\t\t\t\t\t\t\td=\"M88.1121 88.1134L150.026 150.027L150.027 150.027L150.027 150.027L150.028 150.027L150.027 150.026L88.1133 88.1122L88.1121 88.1134ZM273.878 273.877C272.038 274.974 196.128 319.957 165.52 289.349L88.1124 211.942L26.1434 273.911C26.1434 273.911 -20.3337 196.504 10.651 165.519L88.1121 88.1134L26.1417 26.1433C26.1417 26.1433 69.6778 0.00338007 104.519 0H0V300H300V0H104.533C116.144 0.00112664 126.789 2.90631 134.534 10.651L211.941 88.1123L273.877 26.177C274.974 28.0159 319.957 103.926 289.349 134.535L211.942 211.942L273.878 273.877ZM273.878 273.877L273.912 273.857V273.911L273.878 273.877ZM273.877 26.177L273.911 26.1429H273.857C273.857 26.1429 273.863 26.1544 273.877 26.177Z\"\n\t\t\t\t\t\t\t\t\tfill=\"white\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t<path\n\t\t\t\t\t\t\t\t\tfillRule=\"evenodd\"\n\t\t\t\t\t\t\t\t\tclipRule=\"evenodd\"\n\t\t\t\t\t\t\t\t\td=\"M0 0H300V300H0V0ZM150.026 150.025C121.715 99.731 88.1131 88.1122 88.1131 88.1122L10.6508 165.519C10.6508 165.519 26.143 150.027 150.026 150.027H150.027C150.026 150.027 150.026 150.027 150.026 150.027L150.026 150.027C99.731 178.339 88.1124 211.941 88.1124 211.941L165.52 289.348C165.52 289.348 150.032 273.86 150.027 150.027H150.029C178.341 200.323 211.944 211.942 211.944 211.942L289.352 134.535C289.352 134.535 273.864 150.023 150.027 150.027V150.027L150.027 150.027C200.322 121.715 211.941 88.1125 211.941 88.1125L134.534 10.651C134.534 10.651 150.026 26.1431 150.026 150.025ZM150.027 150.027L150.026 150.027C150.026 150.026 150.026 150.026 150.026 150.025C150.026 150.025 150.027 150.026 150.027 150.027ZM150.027 150.027L150.027 150.026L150.027 150.027C150.027 150.027 150.027 150.027 150.027 150.027L150.027 150.027ZM150.027 150.027C150.027 150.027 150.027 150.027 150.027 150.027H150.027L150.027 150.027Z\"\n\t\t\t\t\t\t\t\t\tfill=\"rgba(255,255,255,.2)\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t\tBrand\n\t\t\t\t\t\t</a>\n\t\t\t\t\t\t{/*      <!-- Mobile trigger --> */}\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclassName={`relative order-10 block h-10 w-10 self-center lg:hidden\n                ${\n\t\t\t\t\t\t\tisToggleOpen\n\t\t\t\t\t\t\t\t? \"visible opacity-100 [&_span:nth-child(1)]:w-6 [&_span:nth-child(1)]:translate-y-0 [&_span:nth-child(1)]:rotate-45 [&_span:nth-child(2)]:-rotate-45 [&_span:nth-child(3)]:w-0 \"\n\t\t\t\t\t\t\t\t: \"\"\n\t\t\t\t\t\t}\n              `}\n\t\t\t\t\t\t\tonClick={() => setIsToggleOpen(!isToggleOpen)}\n\t\t\t\t\t\t\taria-expanded={isToggleOpen ? \"true\" : \"false\"}\n\t\t\t\t\t\t\taria-label=\"Toggle navigation\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div className=\"absolute left-1/2 top-1/2 w-6 -translate-x-1/2 -translate-y-1/2 transform\">\n\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\tclassName=\"absolute block h-0.5 w-9/12 -translate-y-2 transform rounded-full bg-slate-900 transition-all duration-300\"\n\t\t\t\t\t\t\t\t></span>\n\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\tclassName=\"absolute block h-0.5 w-6 transform rounded-full bg-slate-900 transition duration-300\"\n\t\t\t\t\t\t\t\t></span>\n\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\tclassName=\"absolute block h-0.5 w-1/2 origin-top-left translate-y-2 transform rounded-full bg-slate-900 transition-all duration-300\"\n\t\t\t\t\t\t\t\t></span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</button>\n\t\t\t\t\t\t{/*      <!-- Navigation links --> */}\n\t\t\t\t\t\t<ul\n\t\t\t\t\t\t\trole=\"menubar\"\n\t\t\t\t\t\t\taria-label=\"Select page\"\n\t\t\t\t\t\t\tclassName={`absolute left-0 top-0 z-[-1] h-114 w-full justify-center overflow-hidden  overflow-y-auto overscroll-contain bg-white/90 px-8 pb-12 pt-24 font-medium transition-[opacity,visibility] duration-300 lg:visible lg:relative lg:top-0  lg:z-0 lg:flex lg:h-full lg:w-auto lg:items-stretch lg:overflow-visible lg:bg-white/0 lg:px-0 lg:py-0  lg:pt-0 lg:opacity-100 ${\n\t\t\t\t\t\t\t\tisToggleOpen\n\t\t\t\t\t\t\t\t\t? \"visible opacity-100 backdrop-blur-xs\"\n\t\t\t\t\t\t\t\t\t: \"invisible opacity-0\"\n\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<li role=\"none\" className=\"flex items-stretch\">\n\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\trole=\"menuitem\"\n\t\t\t\t\t\t\t\t\taria-haspopup=\"false\"\n\t\t\t\t\t\t\t\t\tclassName=\"flex items-center gap-2 py-4 transition-colors duration-300 hover:text-emerald-500 focus:text-emerald-600 focus:outline-hidden focus-visible:outline-hidden lg:px-8\"\n\t\t\t\t\t\t\t\t\thref=\"javascript:void(0)\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<span>Home</span>\n\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t<li role=\"none\" className=\"flex items-stretch\">\n\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\trole=\"menuitem\"\n\t\t\t\t\t\t\t\t\taria-current=\"page\"\n\t\t\t\t\t\t\t\t\taria-haspopup=\"false\"\n\t\t\t\t\t\t\t\t\tclassName=\"flex items-center gap-2 py-4 text-emerald-500 transition-colors duration-300 hover:text-emerald-600 focus:text-emerald-600 focus:outline-hidden focus-visible:outline-hidden lg:px-8\"\n\t\t\t\t\t\t\t\t\thref=\"javascript:void(0)\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<span>Features</span>\n\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t<li role=\"none\" className=\"flex items-stretch\">\n\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\trole=\"menuitem\"\n\t\t\t\t\t\t\t\t\taria-haspopup=\"false\"\n\t\t\t\t\t\t\t\t\tclassName=\"flex items-center gap-2 py-4 transition-colors duration-300 hover:text-emerald-500 focus:text-emerald-600 focus:outline-hidden focus-visible:outline-hidden lg:px-8\"\n\t\t\t\t\t\t\t\t\thref=\"javascript:void(0)\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<span>Pricing</span>\n\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t<li role=\"none\" className=\"flex items-stretch\">\n\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\trole=\"menuitem\"\n\t\t\t\t\t\t\t\t\taria-haspopup=\"false\"\n\t\t\t\t\t\t\t\t\tclassName=\"flex items-center gap-2 py-4 transition-colors duration-300 hover:text-emerald-500 focus:text-emerald-600 focus:outline-hidden focus-visible:outline-hidden lg:px-8\"\n\t\t\t\t\t\t\t\t\thref=\"javascript:void(0)\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<span>About</span>\n\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t</nav>\n\t\t\t\t</div>\n\t\t\t</header>\n\t\t\t{/*<!-- End Basic Navbar--> */}\n\t\t</>\n\t);\n}\n",
      "type": "registry:ui"
    }
  ]
}