Main Nav

---
import Button from "@core-elements/button/Button.astro";
import MainNav from "@navigation/main-nav/MainNav.astro";
---

<MainNav
buttonSections={
  [
    {
      "_component": "building-blocks/core-elements/button",
      "link": "#",
      "variant": "ghost",
      "size": "lg",
      "text": "Search",
      "hideText": true,
      "iconName": "magnifying-glass"
    },
    {
      "_component": "building-blocks/core-elements/button",
      "link": "#",
      "text": "Careers",
      "variant": "ghost",
      "iconName": "arrow-top-right-on-square",
      "iconPosition": "after",
      "_target": "blank",
      "rel": "noopener noreferrer"
    }
  ]
} logoAlt="Logo" logoSource="/src/assets/images/component-docs/logo.svg" navData={
  [
    {
      "name": "Home",
      "path": "#",
      "children": []
    },
    {
      "name": "Resources",
      "path": "#",
      "children": [
        {
          "name": "Blog",
          "path": "#",
          "children": []
        },
        {
          "name": "Documentation",
          "path": "#",
          "children": [
            {
              "name": "Getting Started",
              "path": "#",
              "children": []
            },
            {
              "name": "Components",
              "path": "#",
              "children": [
                {
                  "name": "Navigation",
                  "path": "#",
                  "children": []
                },
                {
                  "name": "Forms",
                  "path": "#",
                  "children": []
                },
                {
                  "name": "Layout",
                  "path": "#",
                  "children": []
                }
              ]
            }
          ]
        },
        {
          "name": "Support",
          "path": "#",
          "children": []
        }
      ]
    },
    {
      "name": "Contact",
      "path": "#",
      "children": []
    }
  ]
}
/>