{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "menubar",
  "type": "registry:ui",
  "title": "Menubar",
  "description": "A menubar component",
  "dependencies": [
    "solid-js",
    "@kobalte/core"
  ],
  "files": [
    {
      "path": "src/registry/ui/menubar.tsx",
      "content": "import type { Component, ComponentProps, JSX, ValidComponent } from \"solid-js\"\nimport { splitProps } from \"solid-js\"\n\nimport * as MenubarPrimitive from \"@kobalte/core/menubar\"\nimport type { PolymorphicProps } from \"@kobalte/core/polymorphic\"\n\nimport { cn } from \"~/lib/utils\"\n\nconst MenubarGroup = MenubarPrimitive.Group\nconst MenubarPortal = MenubarPrimitive.Portal\nconst MenubarSub = MenubarPrimitive.Sub\nconst MenubarRadioGroup = MenubarPrimitive.RadioGroup\n\ntype MenubarRootProps<T extends ValidComponent = \"div\"> = MenubarPrimitive.MenubarRootProps<T> & {\n  class?: string | undefined\n}\n\nconst Menubar = <T extends ValidComponent = \"div\">(\n  props: PolymorphicProps<T, MenubarRootProps<T>>\n) => {\n  const [local, others] = splitProps(props as MenubarRootProps, [\"class\"])\n  return (\n    <MenubarPrimitive.Root\n      class={cn(\n        \"flex h-10 items-center space-x-1 rounded-md border bg-background p-1\",\n        local.class\n      )}\n      {...others}\n    />\n  )\n}\n\nconst MenubarMenu: Component<MenubarPrimitive.MenubarMenuProps> = (props) => {\n  return <MenubarPrimitive.Menu gutter={8} {...props} />\n}\n\ntype MenubarTriggerProps<T extends ValidComponent = \"button\"> =\n  MenubarPrimitive.MenubarTriggerProps<T> & { class?: string | undefined }\n\nconst MenubarTrigger = <T extends ValidComponent = \"button\">(\n  props: PolymorphicProps<T, MenubarTriggerProps<T>>\n) => {\n  const [local, others] = splitProps(props as MenubarTriggerProps, [\"class\"])\n  return (\n    <MenubarPrimitive.Trigger\n      class={cn(\n        \"flex cursor-default select-none items-center rounded-sm px-3 py-1.5 text-sm font-medium outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground\",\n        local.class\n      )}\n      {...others}\n    />\n  )\n}\n\ntype MenubarContentProps<T extends ValidComponent = \"div\"> =\n  MenubarPrimitive.MenubarContentProps<T> & { class?: string | undefined }\n\nconst MenubarContent = <T extends ValidComponent = \"div\">(\n  props: PolymorphicProps<T, MenubarContentProps<T>>\n) => {\n  const [local, others] = splitProps(props as MenubarContentProps, [\"class\"])\n  return (\n    <MenubarPrimitive.Portal>\n      <MenubarPrimitive.Content\n        class={cn(\n          \"z-50 min-w-48 origin-[var(--kb-menu-content-transform-origin)] animate-content-hide overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[expanded]:animate-content-show\",\n          local.class\n        )}\n        {...others}\n      />\n    </MenubarPrimitive.Portal>\n  )\n}\n\ntype MenubarSubTriggerProps<T extends ValidComponent = \"div\"> =\n  MenubarPrimitive.MenubarSubTriggerProps<T> & {\n    class?: string | undefined\n    children?: JSX.Element\n    inset?: boolean\n  }\n\nconst MenubarSubTrigger = <T extends ValidComponent = \"div\">(\n  props: PolymorphicProps<T, MenubarSubTriggerProps<T>>\n) => {\n  const [local, others] = splitProps(props as MenubarSubTriggerProps, [\n    \"class\",\n    \"children\",\n    \"inset\"\n  ])\n  return (\n    <MenubarPrimitive.SubTrigger\n      class={cn(\n        \"flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground\",\n        local.inset && \"pl-8\",\n        local.class\n      )}\n      {...others}\n    >\n      {local.children}\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        class=\"ml-auto size-4\"\n      >\n        <path d=\"M9 6l6 6l-6 6\" />\n      </svg>\n    </MenubarPrimitive.SubTrigger>\n  )\n}\n\ntype MenubarSubContentProps<T extends ValidComponent = \"div\"> =\n  MenubarPrimitive.MenubarSubContentProps<T> & {\n    class?: string | undefined\n  }\n\nconst MenubarSubContent = <T extends ValidComponent = \"div\">(\n  props: PolymorphicProps<T, MenubarSubContentProps<T>>\n) => {\n  const [local, others] = splitProps(props as MenubarSubContentProps, [\"class\"])\n  return (\n    <MenubarPrimitive.Portal>\n      <MenubarPrimitive.SubContent\n        class={cn(\n          \"z-50 min-w-32 origin-[var(--kb-menu-content-transform-origin)] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md animate-in\",\n          local.class\n        )}\n        {...others}\n      />\n    </MenubarPrimitive.Portal>\n  )\n}\n\ntype MenubarItemProps<T extends ValidComponent = \"div\"> = MenubarPrimitive.MenubarItemProps<T> & {\n  class?: string | undefined\n  inset?: boolean\n}\n\nconst MenubarItem = <T extends ValidComponent = \"div\">(\n  props: PolymorphicProps<T, MenubarItemProps<T>>\n) => {\n  const [local, others] = splitProps(props as MenubarItemProps, [\"class\", \"inset\"])\n  return (\n    <MenubarPrimitive.Item\n      class={cn(\n        \"relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n        local.inset && \"pl-8\",\n        local.class\n      )}\n      {...others}\n    />\n  )\n}\n\ntype MenubarCheckboxItemProps<T extends ValidComponent = \"div\"> =\n  MenubarPrimitive.MenubarCheckboxItemProps<T> & {\n    class?: string | undefined\n    children?: JSX.Element\n  }\n\nconst MenubarCheckboxItem = <T extends ValidComponent = \"div\">(\n  props: PolymorphicProps<T, MenubarCheckboxItemProps<T>>\n) => {\n  const [local, others] = splitProps(props as MenubarCheckboxItemProps, [\"class\", \"children\"])\n  return (\n    <MenubarPrimitive.CheckboxItem\n      class={cn(\n        \"relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n        local.class\n      )}\n      {...others}\n    >\n      <span class=\"absolute left-2 flex size-3.5 items-center justify-center\">\n        <MenubarPrimitive.ItemIndicator>\n          <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            class=\"size-4\"\n          >\n            <path d=\"M5 12l5 5l10 -10\" />\n          </svg>\n        </MenubarPrimitive.ItemIndicator>\n      </span>\n      {local.children}\n    </MenubarPrimitive.CheckboxItem>\n  )\n}\n\ntype MenubarRadioItemProps<T extends ValidComponent = \"div\"> =\n  MenubarPrimitive.MenubarRadioItemProps<T> & {\n    class?: string | undefined\n    children?: JSX.Element\n  }\n\nconst MenubarRadioItem = <T extends ValidComponent = \"div\">(\n  props: PolymorphicProps<T, MenubarRadioItemProps<T>>\n) => {\n  const [local, others] = splitProps(props as MenubarRadioItemProps, [\"class\", \"children\"])\n  return (\n    <MenubarPrimitive.RadioItem\n      class={cn(\n        \"relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n        local.class\n      )}\n      {...others}\n    >\n      <span class=\"absolute left-2 flex size-3.5 items-center justify-center\">\n        <MenubarPrimitive.ItemIndicator>\n          <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            class=\"size-2 fill-current\"\n          >\n            <path d=\"M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0\" />\n          </svg>\n        </MenubarPrimitive.ItemIndicator>\n      </span>\n      {local.children}\n    </MenubarPrimitive.RadioItem>\n  )\n}\n\ntype MenubarItemLabelProps<T extends ValidComponent = \"div\"> =\n  MenubarPrimitive.MenubarItemLabelProps<T> & {\n    class?: string | undefined\n    inset?: boolean\n  }\n\nconst MenubarItemLabel = <T extends ValidComponent = \"div\">(\n  props: PolymorphicProps<T, MenubarItemLabelProps<T>>\n) => {\n  const [local, others] = splitProps(props as MenubarItemLabelProps, [\"class\", \"inset\"])\n  return (\n    <MenubarPrimitive.ItemLabel\n      class={cn(\"px-2 py-1.5 text-sm font-semibold\", local.inset && \"pl-8\", local.class)}\n      {...others}\n    />\n  )\n}\n\ntype MenubarGroupLabelProps<T extends ValidComponent = \"span\"> =\n  MenubarPrimitive.MenubarGroupLabelProps<T> & {\n    class?: string | undefined\n    inset?: boolean\n  }\n\nconst MenubarGroupLabel = <T extends ValidComponent = \"span\">(\n  props: PolymorphicProps<T, MenubarGroupLabelProps<T>>\n) => {\n  const [local, others] = splitProps(props as MenubarGroupLabelProps, [\"class\", \"inset\"])\n  return (\n    <MenubarPrimitive.GroupLabel\n      class={cn(\"px-2 py-1.5 text-sm font-semibold\", local.inset && \"pl-8\", local.class)}\n      {...others}\n    />\n  )\n}\n\ntype MenubarSeparatorProps<T extends ValidComponent = \"hr\"> =\n  MenubarPrimitive.MenubarSeparatorProps<T> & { class?: string | undefined }\n\nconst MenubarSeparator = <T extends ValidComponent = \"hr\">(\n  props: PolymorphicProps<T, MenubarSeparatorProps<T>>\n) => {\n  const [local, others] = splitProps(props as MenubarSeparatorProps, [\"class\"])\n  return (\n    <MenubarPrimitive.Separator class={cn(\"-mx-1 my-1 h-px bg-muted\", local.class)} {...others} />\n  )\n}\n\nconst MenubarShortcut: Component<ComponentProps<\"span\">> = (props) => {\n  const [local, others] = splitProps(props, [\"class\"])\n  return (\n    <span\n      class={cn(\"ml-auto text-xs tracking-widest text-muted-foreground\", local.class)}\n      {...others}\n    />\n  )\n}\n\nexport {\n  Menubar,\n  MenubarMenu,\n  MenubarTrigger,\n  MenubarContent,\n  MenubarItem,\n  MenubarSeparator,\n  MenubarItemLabel,\n  MenubarGroupLabel,\n  MenubarCheckboxItem,\n  MenubarRadioGroup,\n  MenubarRadioItem,\n  MenubarPortal,\n  MenubarSubContent,\n  MenubarSubTrigger,\n  MenubarGroup,\n  MenubarSub,\n  MenubarShortcut\n}\n",
      "type": "registry:ui"
    }
  ]
}