Skip to content
Clicky UI

FormatOptionsDropdown

API reference and demos for FormatOptionsDropdown.

Source

Import

Section titled “Import”
import { FormatOptionsDropdown } from "@flanksource/clicky-ui/components";

Demos

Section titled “Demos”
Default · Open in Storybook
Outline · Open in Storybook
Select Interaction · Open in Storybook

The props table documents the component-specific surface. Standard DOM attributes inherited from React, such as className, event handlers, and accessibility attributes, may also be accepted when the component’s prop type extends a native element.

Props

Section titled “Props”
Prop Type Default Description
className string — Classes applied to the wrapper.
label ReactNode — Override the primary button label. Defaults to the active option's label.
onChange* (…) => void — Called with the chosen format value.
options FormatOption[] [ { value: "clicky", label: "Clicky", description: "Rendered Clicky JSON with the rich Clicky viewer", icon: UiEye }, { value: "json", label: "JSON", description: "Plain JSON for inspecting the raw response body", icon: UiFileCode }, { value: "yaml", label: "YAML", description: "YAML for config-friendly inspection and export", icon: UiFileCode }, { value: "csv", label: "CSV", description: "Comma-separated values for spreadsheets and imports", icon: UiTable }, { value: "markdown", label: "Markdown", description: "Markdown formatted for docs, comments, and chat", icon: UiFileCode }, { value: "html", label: "HTML", description: "Browser-ready HTML preview of the formatted output", icon: UiFileCode }, { value: "pdf", label: "PDF", description: "Portable document for sharing and printing", icon: UiFileCode }, { value: "pretty", label: "Pretty", description: "Human-readable plain text output from the formatter", icon: UiFileCode }, { value: "excel", label: "Excel", description: "Spreadsheet workbook for offline analysis", icon: UiTable }, { value: "slack", label: "Slack", description: "Slack Block Kit JSON for chat-native output", icon: UiComment }, ] Available formats. Defaults to the clicky output formats.
size "sm" | "lg" | "default" | "icon" | null default Size forwarded to the split button.
value* string — Active format value.
variant "default" | "link" | "destructive" | "outline" | "secondary" | "ghost" | null outline Variant forwarded to the split button.