// The component groups: one entry per section of /js/components, AND one line in the
// sidebar that jumps to it.
//
// Declaring them once, as data, is what keeps those two in step — the sidebar cannot
// offer a jump to a section that does not exist, and a section cannot go missing from
// the sidebar.
//
// This is the JS mirror of app/components.go's componentGroups(). The ids match, so the
// two sections of the site have the same shape and a reader crossing between them lands
// in the same place. The ICONS differ, and have to: this side names FontAwesome, the Go
// side names webui's own hand-drawn registry, and where the two have no glyph in common
// the names diverge.

export interface ComponentGroup {
    id: string;
    label: string;
    icon: string;
}

export const COMPONENT_GROUPS: ComponentGroup[] = [
    { id: "buttons", label: "Buttons", icon: "check" },
    { id: "badges", label: "Badges & alerts", icon: "circle-info" },
    { id: "cards", label: "Cards & layout", icon: "table-columns" },
    { id: "icons", label: "Icons", icon: "star" },
    { id: "forms", label: "Forms & inputs", icon: "pen-to-square" },
    { id: "selects", label: "Selects & comboboxes", icon: "sliders" },
    { id: "toggles", label: "Toggles & signature", icon: "check" },
    { id: "dates", label: "Dates", icon: "calendar" },
    { id: "tables", label: "Tables", icon: "table" },
    { id: "overlays", label: "Overlays", icon: "copy" },
    { id: "feedback", label: "Toasts & tours", icon: "bell" },
    { id: "navigation", label: "Tabs & navigation", icon: "bars" },
    { id: "search", label: "Fuzzy search", icon: "magnifying-glass" },
    { id: "charts", label: "Charts", icon: "chart-column" },
    { id: "theming", label: "Theming", icon: "palette" },
];
