{
  "name": "NavbarLayoutFloatingOverlay",
  "description": "Floating rounded navbar with right‑side CTA and a circular menu button. Clicking the button opens a rounded overlay panel with the site menu.",
  "constraints": {
    "minLinks": 2,
    "maxLinks": 8,
    "preferredCount": 5,
    "brandRules": {
      "required": false,
      "minChars": 2,
      "maxChars": 20,
      "example": "Proof Digital",
      "fallbackBehavior": "Shows brandName text"
    },
    "buttonRules": {
      "text": {
        "required": true,
        "minChars": 2,
        "maxChars": 24,
        "example": "Get Started"
      },
      "href": {
        "required": false,
        "format": "url | section-id",
        "example": "https://webild.io"
      },
      "onClick": {
        "required": false,
        "note": "Optional click handler"
      }
    },
    "linkRules": {
      "name": {
        "required": true,
        "minChars": 2,
        "maxChars": 15,
        "example": "About"
      },
      "id": {
        "required": true,
        "format": "section-id | url",
        "examples": [
          "about",
          "services",
          "https://github.com",
          "www.example.com"
        ],
        "behavior": "Internal IDs scroll to section, URLs open in new tab"
      }
    }
  },
  "propsSchema": {
    "navItems": "Array<{name: string, id: string}>",
    "className?": "string",
    "brandName?": "string (default: 'Proof Digital')",
    "button": "{text: string, onClick?: () => void, href?: string}"
  },
  "usageExample": "",
  "do": [
    "Use for general use",
    "Requires navItems[]"
  ],
  "dont": [],
  "editRules": {
    "textOnly": true,
    "layoutLocked": true,
    "styleLocked": true
  }
}