{
  "name": "spreadsheet-menubar-format-menu",
  "type": "registry:component",
  "dependencies": [
    "@unsanity/spreadsheet",
    "lucide-react"
  ],
  "registryDependencies": [
    "menubar"
  ],
  "files": [
    {
      "path": "components/spreadsheet/spreadsheet-menubar-format-menu.tsx",
      "content": "\"use client\";\n\nimport {\n  useSelectionFormatState,\n  type HorizontalAlignChoice,\n  type NumberDisplayFormat,\n  type VerticalAlign,\n  type WrapMode,\n} from \"@unsanity/spreadsheet\";\nimport {\n  MenubarCheckboxItem,\n  MenubarContent,\n  MenubarLabel,\n  MenubarMenu,\n  MenubarRadioGroup,\n  MenubarRadioItem,\n  MenubarSeparator,\n  MenubarSub,\n  MenubarSubContent,\n  MenubarSubTrigger,\n  MenubarTrigger,\n} from \"@/components/ui/menubar\";\n\nexport function SpreadsheetMenubarFormatMenu() {\n  const fmt = useSelectionFormatState();\n\n  if (!fmt.showFormatMenu) return null;\n\n  const { features, hasSelection } = fmt;\n\n  return (\n    <MenubarMenu>\n      <MenubarTrigger>Format</MenubarTrigger>\n      <MenubarContent>\n        {features.number ? (\n          <MenubarSub>\n            <MenubarSubTrigger>Number</MenubarSubTrigger>\n            <MenubarSubContent className=\"min-w-[14rem]\">\n              <MenubarRadioGroup\n                value={fmt.numberFormat}\n                onValueChange={(v) =>\n                  fmt.setNumberFormat(v as NumberDisplayFormat)\n                }\n              >\n                <MenubarRadioItem value=\"automatic\" disabled={!hasSelection}>\n                  Automatic\n                </MenubarRadioItem>\n                <MenubarRadioItem value=\"plainText\" disabled={!hasSelection}>\n                  Plain text\n                </MenubarRadioItem>\n                <MenubarSeparator />\n                <MenubarRadioItem value=\"number\" disabled={!hasSelection}>\n                  Number\n                </MenubarRadioItem>\n                <MenubarRadioItem value=\"percent\" disabled={!hasSelection}>\n                  Percent\n                </MenubarRadioItem>\n                <MenubarRadioItem value=\"scientific\" disabled={!hasSelection}>\n                  Scientific\n                </MenubarRadioItem>\n                <MenubarSeparator />\n                <MenubarRadioItem value=\"date\" disabled={!hasSelection}>\n                  Date\n                </MenubarRadioItem>\n                <MenubarRadioItem value=\"time\" disabled={!hasSelection}>\n                  Time\n                </MenubarRadioItem>\n                <MenubarRadioItem value=\"dateTime\" disabled={!hasSelection}>\n                  Date time\n                </MenubarRadioItem>\n                <MenubarRadioItem value=\"duration\" disabled={!hasSelection}>\n                  Duration\n                </MenubarRadioItem>\n              </MenubarRadioGroup>\n            </MenubarSubContent>\n          </MenubarSub>\n        ) : null}\n        {features.text ? (\n          <MenubarSub>\n            <MenubarSubTrigger>Text</MenubarSubTrigger>\n            <MenubarSubContent>\n              <MenubarCheckboxItem\n                checked={fmt.bold}\n                disabled={!hasSelection}\n                onCheckedChange={fmt.toggleBold}\n              >\n                Bold\n              </MenubarCheckboxItem>\n              <MenubarCheckboxItem\n                checked={fmt.italic}\n                disabled={!hasSelection}\n                onCheckedChange={fmt.toggleItalic}\n              >\n                Italic\n              </MenubarCheckboxItem>\n              <MenubarCheckboxItem\n                checked={fmt.underline}\n                disabled={!hasSelection}\n                onCheckedChange={fmt.toggleUnderline}\n              >\n                Underline\n              </MenubarCheckboxItem>\n              <MenubarCheckboxItem\n                checked={fmt.strikethrough}\n                disabled={!hasSelection}\n                onCheckedChange={fmt.toggleStrikethrough}\n              >\n                Strikethrough\n              </MenubarCheckboxItem>\n            </MenubarSubContent>\n          </MenubarSub>\n        ) : null}\n        {features.alignment ? (\n          <MenubarSub>\n            <MenubarSubTrigger>Alignment</MenubarSubTrigger>\n            <MenubarSubContent className=\"min-w-[12rem]\">\n              <MenubarLabel className=\"text-muted-foreground\">Horizontal</MenubarLabel>\n              <MenubarRadioGroup\n                value={fmt.hAlign}\n                onValueChange={(v) =>\n                  fmt.setHAlign(v as HorizontalAlignChoice)\n                }\n              >\n                <MenubarRadioItem value=\"automatic\" disabled={!hasSelection}>\n                  Automatic\n                </MenubarRadioItem>\n                <MenubarRadioItem value=\"left\" disabled={!hasSelection}>\n                  Left\n                </MenubarRadioItem>\n                <MenubarRadioItem value=\"center\" disabled={!hasSelection}>\n                  Center\n                </MenubarRadioItem>\n                <MenubarRadioItem value=\"right\" disabled={!hasSelection}>\n                  Right\n                </MenubarRadioItem>\n              </MenubarRadioGroup>\n              <MenubarSeparator />\n              <MenubarLabel className=\"text-muted-foreground\">Vertical</MenubarLabel>\n              <MenubarRadioGroup\n                value={fmt.vAlign}\n                onValueChange={(v) => fmt.setVAlign(v as VerticalAlign)}\n              >\n                <MenubarRadioItem value=\"top\" disabled={!hasSelection}>\n                  Top\n                </MenubarRadioItem>\n                <MenubarRadioItem value=\"middle\" disabled={!hasSelection}>\n                  Middle\n                </MenubarRadioItem>\n                <MenubarRadioItem value=\"bottom\" disabled={!hasSelection}>\n                  Bottom\n                </MenubarRadioItem>\n              </MenubarRadioGroup>\n            </MenubarSubContent>\n          </MenubarSub>\n        ) : null}\n        {features.wrapping ? (\n          <MenubarSub>\n            <MenubarSubTrigger>Wrapping</MenubarSubTrigger>\n            <MenubarSubContent>\n              <MenubarRadioGroup\n                value={fmt.wrap}\n                onValueChange={(v) => fmt.setWrap(v as WrapMode)}\n              >\n                <MenubarRadioItem value=\"overflow\" disabled={!hasSelection}>\n                  Overflow\n                </MenubarRadioItem>\n                <MenubarRadioItem value=\"wrap\" disabled={!hasSelection}>\n                  Wrap\n                </MenubarRadioItem>\n                <MenubarRadioItem value=\"clip\" disabled={!hasSelection}>\n                  Clip\n                </MenubarRadioItem>\n              </MenubarRadioGroup>\n            </MenubarSubContent>\n          </MenubarSub>\n        ) : null}\n      </MenubarContent>\n    </MenubarMenu>\n  );\n}\n",
      "type": "registry:component"
    }
  ]
}