@redsift/ds-mcp-server 12.5.3-alpha.6 → 12.5.3-alpha.7

package/data/docs/components-index.json

@@ -4,35 +4,61 @@
     "package": "@redsift/design-system",
     "description": "Alert displays a short, important message that attracts the user's attention",
     "propsCount": 38,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "banner",
+      "notification",
+      "message bar",
+      "info banner",
+      "error banner"
+    ]
   },
   {
     "name": "AppBar",
     "package": "@redsift/design-system",
     "description": "AppBar is the top navigation bar of the application. It displays the page title",
     "propsCount": 6,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "top bar",
+      "header bar",
+      "navigation bar"
+    ]
   },
   {
     "name": "AppContent",
     "package": "@redsift/design-system",
     "description": "AppContent is the main content area of a Red Sift application. It automatically",
     "propsCount": 59,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "main content",
+      "page content"
+    ]
   },
   {
     "name": "AppSidePanel",
     "package": "@redsift/design-system",
     "description": "AppSidePanel is the collapsible side navigation panel of a Red Sift application.",
     "propsCount": 8,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "side nav",
+      "sidebar",
+      "navigation panel"
+    ]
   },
   {
     "name": "Badge",
     "package": "@redsift/design-system",
     "description": "Badge displays a small status indicator or count. Badges have two variants:",
     "propsCount": 30,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "counter",
+      "count badge",
+      "notification badge"
+    ]
   },
   {
     "name": "BreadcrumbItem",
@@ -53,7 +79,11 @@
     "package": "@redsift/design-system",
     "description": "",
     "propsCount": 33,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "breadcrumb nav",
+      "path navigation"
+    ]
   },
   {
     "name": "ButtonGroup",
@@ -74,35 +104,59 @@
     "package": "@redsift/design-system",
     "description": "The Button is a semantic button that looks like a button.",
     "propsCount": 43,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "action button",
+      "cta",
+      "submit"
+    ]
   },
   {
     "name": "CardActions",
     "package": "@redsift/design-system",
     "description": "CardActions is a container for action buttons at the bottom of a Card.",
     "propsCount": 44,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "card footer",
+      "card buttons"
+    ]
   },
   {
     "name": "CardBody",
     "package": "@redsift/design-system",
     "description": "CardBody is the main content area of a Card. It can contain any content.",
     "propsCount": 44,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "card content"
+    ]
   },
   {
     "name": "CardHeader",
     "package": "@redsift/design-system",
     "description": "CardHeader displays the title and optional subtitle of a Card.",
     "propsCount": 43,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "card title",
+      "card heading"
+    ]
   },
   {
     "name": "Card",
     "package": "@redsift/design-system",
     "description": "",
     "propsCount": 36,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "container",
+      "card panel",
+      "content card"
+    ],
+    "antiPatterns": [
+      "❌ Using Card with inline styles for KPI tiles → ✅ Use DataCard from @redsift/dashboard for metric/KPI tiles."
+    ]
   },
   {
     "name": "CheckboxGroup",
@@ -151,14 +205,32 @@
     "package": "@redsift/design-system",
     "description": "",
     "propsCount": 41,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "expandable card",
+      "collapsible card",
+      "detail panel"
+    ]
   },
   {
     "name": "Flexbox",
     "package": "@redsift/design-system",
     "description": "Flexbox provides a CSS Flexbox container with convenient props for common",
     "propsCount": 55,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "flex container",
+      "row",
+      "column",
+      "stack",
+      "box",
+      "hstack",
+      "vstack"
+    ],
+    "antiPatterns": [
+      "❌ gap={4} → ✅ gap=\"4px\" — gap is a string prop (CSS value), not a number.",
+      "❌ style={{ display: \"flex\", gap: 4 }} → ✅ <Flexbox gap=\"4px\"> — use the Flexbox component instead of inline styles."
+    ]
   },
   {
     "name": "FocusWithinGroup",
@@ -186,14 +258,30 @@
     "package": "@redsift/design-system",
     "description": "",
     "propsCount": 58,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "grid layout",
+      "css grid",
+      "grid container"
+    ]
   },
   {
     "name": "Heading",
     "package": "@redsift/design-system",
     "description": "Heading renders semantic HTML heading elements (h1-h6) with consistent styling.",
     "propsCount": 40,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "title",
+      "header text",
+      "section heading",
+      "h1",
+      "h2",
+      "h3"
+    ],
+    "antiPatterns": [
+      "❌ color=\"#22c55e\" or color=\"var(--rs-color-green-500)\" → ✅ color=\"success\" — use semantic color values from NeutralColorPalette / NotificationsColorPalette."
+    ]
   },
   {
     "name": "IconButtonLink",
@@ -207,14 +295,26 @@
     "package": "@redsift/design-system",
     "description": "IconButton is a button containing only an icon, without text.",
     "propsCount": 40,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "icon action",
+      "toolbar button"
+    ],
+    "antiPatterns": [
+      "❌ Unicode characters as icon content → ✅ icon={mdiPlus} prop with mdi imports from @redsift/icons.",
+      "❌ import { mdiPlus } from \"@mdi/js\" → ✅ import { mdiPlus } from \"@redsift/icons\"."
+    ]
   },
   {
     "name": "Icon",
     "package": "@redsift/design-system",
     "description": "Icon displays SVG icons from the Material Design Icons library or custom paths.",
     "propsCount": 33,
-    "hasExamples": false
+    "hasExamples": false,
+    "antiPatterns": [
+      "❌ Unicode characters (✓, ✕, ⚠, ›) → ✅ <Icon path={mdiCheck} /> from @redsift/icons.",
+      "❌ import { mdiPlus } from \"@mdi/js\" → ✅ import { mdiPlus } from \"@redsift/icons\"."
+    ]
   },
   {
     "name": "RenderedListboxItem",
@@ -284,7 +384,17 @@
     "package": "@redsift/design-system",
     "description": "Pill displays a small piece of information as a colored label. Commonly used",
     "propsCount": 39,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "chip",
+      "tag",
+      "badge",
+      "label",
+      "status pill"
+    ],
+    "antiPatterns": [
+      "❌ <Pill label=\"Active\" /> → ✅ <Pill color=\"success\">Active</Pill> — Pill uses children for content, NOT a label prop."
+    ]
   },
   {
     "name": "ProgressBar",
@@ -340,14 +450,22 @@
     "package": "@redsift/design-system",
     "description": "The SkeletonCircle component.",
     "propsCount": 38,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "avatar placeholder",
+      "circle skeleton"
+    ]
   },
   {
     "name": "SkeletonText",
     "package": "@redsift/design-system",
     "description": "The SkeletonText component.",
     "propsCount": 41,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "text placeholder",
+      "paragraph skeleton"
+    ]
   },
   {
     "name": "BaseSkeleton",
@@ -361,7 +479,15 @@
     "package": "@redsift/design-system",
     "description": "",
     "propsCount": 38,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "loading placeholder",
+      "shimmer",
+      "skeleton loader"
+    ],
+    "antiPatterns": [
+      "❌ import { Skeleton } from \"@mui/material\" → ✅ import { Skeleton } from \"@redsift/design-system\" — always use the DS Skeleton."
+    ]
   },
   {
     "name": "Spinner",
@@ -389,21 +515,35 @@
     "package": "@redsift/design-system",
     "description": "TabPanel renders the content for a tab. It is shown when the associated",
     "propsCount": 33,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "tab content",
+      "tab panel"
+    ]
   },
   {
     "name": "Tab",
     "package": "@redsift/design-system",
     "description": "Tab renders an individual tab button within a `Tabs` container.",
     "propsCount": 39,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "tab item",
+      "tab button"
+    ]
   },
   {
     "name": "Tabs",
     "package": "@redsift/design-system",
     "description": "Tabs organises content into separate views where only one view is visible at a time.",
     "propsCount": 39,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "tab bar",
+      "segmented control",
+      "tab navigation",
+      "tab group"
+    ]
   },
   {
     "name": "TextArea",
@@ -417,14 +557,28 @@
     "package": "@redsift/design-system",
     "description": "TextField allows users to enter single-line text input. Supports validation,",
     "propsCount": 57,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "text input",
+      "input field",
+      "form input"
+    ]
   },
   {
     "name": "Text",
     "package": "@redsift/design-system",
     "description": "Text renders text content with consistent styling. By default renders a",
     "propsCount": 42,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "paragraph",
+      "body text",
+      "caption",
+      "label text"
+    ],
+    "antiPatterns": [
+      "❌ color=\"#22c55e\" or color=\"var(--rs-color-green-500)\" → ✅ color=\"success\" — use semantic color values from NeutralColorPalette / NotificationsColorPalette."
+    ]
   },
   {
     "name": "DialogContentActions",
@@ -480,7 +634,13 @@
     "package": "@redsift/popovers",
     "description": "",
     "propsCount": 10,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "modal",
+      "popup",
+      "dialog box",
+      "confirmation dialog"
+    ]
   },
   {
     "name": "PopoverContent",
@@ -550,7 +710,12 @@
     "package": "@redsift/popovers",
     "description": "",
     "propsCount": 17,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "click tooltip",
+      "info popover",
+      "toggleable tip"
+    ]
   },
   {
     "name": "TooltipContent",
@@ -578,7 +743,11 @@
     "package": "@redsift/popovers",
     "description": "",
     "propsCount": 11,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "hover tip",
+      "info tooltip"
+    ]
   },
   {
     "name": "ComboboxContentFooter",
@@ -634,7 +803,13 @@
     "package": "@redsift/pickers",
     "description": "",
     "propsCount": 31,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "autocomplete",
+      "searchable select",
+      "typeahead",
+      "search input"
+    ]
   },
   {
     "name": "Item",
@@ -697,7 +872,12 @@
     "package": "@redsift/pickers",
     "description": "",
     "propsCount": 22,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "dropdown menu",
+      "action menu",
+      "context menu"
+    ]
   },
   {
     "name": "SelectContent",
@@ -725,7 +905,12 @@
     "package": "@redsift/pickers",
     "description": "",
     "propsCount": 24,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "dropdown",
+      "select menu",
+      "picker"
+    ]
   },
   {
     "name": "Arc",
@@ -746,7 +931,12 @@
     "package": "@redsift/charts",
     "description": "",
     "propsCount": 28,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "chart axis",
+      "x axis",
+      "y axis"
+    ]
   },
   {
     "name": "Bar",
@@ -767,14 +957,24 @@
     "package": "@redsift/charts",
     "description": "",
     "propsCount": 88,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "bar graph",
+      "histogram",
+      "column chart",
+      "bar visualization"
+    ]
   },
   {
     "name": "ChartContainerTitle",
     "package": "@redsift/charts",
     "description": "",
     "propsCount": 60,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "chart title",
+      "chart heading"
+    ]
   },
   {
     "name": "DataPoint",
@@ -795,7 +995,12 @@
     "package": "@redsift/charts",
     "description": "",
     "propsCount": 52,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "chart legend",
+      "color legend",
+      "series legend"
+    ]
   },
   {
     "name": "Line",
@@ -809,28 +1014,52 @@
     "package": "@redsift/charts",
     "description": "LineChart displays trends over time or continuous data.",
     "propsCount": 78,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "line graph",
+      "time series",
+      "trend chart",
+      "line visualization"
+    ]
   },
   {
     "name": "PieChart",
     "package": "@redsift/charts",
     "description": "PieChart displays proportional data as slices of a circle.",
     "propsCount": 84,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "pie graph",
+      "donut chart",
+      "pie visualization"
+    ]
   },
   {
     "name": "ScatterPlot",
     "package": "@redsift/charts",
     "description": "ScatterPlot displays relationships between two numeric variables.",
     "propsCount": 83,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "scatter graph",
+      "dot plot",
+      "scatter visualization"
+    ]
   },
   {
     "name": "DataGrid",
     "package": "@redsift/table",
     "description": "DataGrid displays tabular data with sorting, filtering, pagination, and row selection.",
     "propsCount": 9,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "data grid",
+      "data table",
+      "table",
+      "grid view",
+      "list view",
+      "spreadsheet"
+    ]
   },
   {
     "name": "GridToolbarFilterSemanticField",
@@ -858,7 +1087,12 @@
     "package": "@redsift/table",
     "description": "StatefulDataGrid extends DataGrid with automatic state persistence to localStorage.",
     "propsCount": 12,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "stateful table",
+      "managed grid",
+      "server grid"
+    ]
   },
   {
     "name": "TextCell",
@@ -886,70 +1120,126 @@
     "package": "@redsift/dashboard",
     "description": "",
     "propsCount": 4,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "chart loading",
+      "chart empty",
+      "chart error",
+      "empty chart",
+      "no data chart"
+    ]
   },
   {
     "name": "Dashboard",
     "package": "@redsift/dashboard",
     "description": "Dashboard provides a context for connected, filterable visualizations.",
     "propsCount": 2,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "dashboard page",
+      "dashboard layout",
+      "dashboard container"
+    ]
   },
   {
     "name": "DataCard",
     "package": "@redsift/dashboard",
     "description": "",
     "propsCount": 33,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "kpi tile",
+      "metric tile",
+      "stat card",
+      "kpi card",
+      "summary card",
+      "metric card"
+    ],
+    "antiPatterns": [
+      "❌ <Card style={{ borderLeft: \"4px solid green\" }}> for KPI tiles → ✅ <DataCard color=\"success\"> — DataCard is purpose-built for metric tiles."
+    ]
   },
   {
     "name": "DataCardBody",
     "package": "@redsift/dashboard",
     "description": "DataCardBody is the main content area of a DataCard.",
     "propsCount": 45,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "metric body",
+      "kpi body"
+    ]
   },
   {
     "name": "DataCardHeader",
     "package": "@redsift/dashboard",
     "description": "DataCardHeader displays an icon and title that floats on top of",
     "propsCount": 34,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "metric header",
+      "kpi header"
+    ]
   },
   {
     "name": "DataCardListbox",
     "package": "@redsift/dashboard",
     "description": "DataCardListbox is a styled Listbox for use inside a DataCard.",
     "propsCount": 55,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "metric listbox",
+      "kpi listbox",
+      "filter listbox"
+    ]
   },
   {
     "name": "DataRow",
     "package": "@redsift/dashboard",
     "description": "DataRow displays a formatted number alongside a legend label.",
     "propsCount": 44,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "kpi row",
+      "metric row",
+      "data row",
+      "summary row"
+    ]
   },
   {
     "name": "PdfExportButton",
     "package": "@redsift/dashboard",
     "description": "",
     "propsCount": 50,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "export pdf",
+      "download pdf",
+      "print dashboard"
+    ]
   },
   {
     "name": "TimeSeriesBarChart",
     "package": "@redsift/dashboard",
     "description": "",
     "propsCount": 17,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "time bar chart",
+      "temporal bar chart",
+      "time series bar"
+    ]
   },
   {
     "name": "WithFilters",
     "package": "@redsift/dashboard",
     "description": "",
     "propsCount": 10,
-    "hasExamples": false
+    "hasExamples": false,
+    "keywords": [
+      "filter provider",
+      "crossfilter wrapper"
+    ]
   },
   {
     "name": "RadarButton",