@redsift/ds-mcp-server 12.3.1-muiv6-alpha.2

package/data/docs/components/design-system/Listbox.json

@@ -0,0 +1,529 @@
+{
+  "name": "Listbox",
+  "description": "Listbox displays a list of selectable options. Supports single or multiple\nselection modes and keyboard navigation.\n\nCan be used standalone or within picker components like Select and Combobox.\nSupports controlled (`values`) or uncontrolled (`defaultValues`) modes.",
+  "package": "@redsift/design-system",
+  "filePath": "packages/design-system/src/components/listbox/Listbox.tsx",
+  "props": [
+    {
+      "name": "defaultValues",
+      "description": "Default selected values.\nUsed for uncontrolled version.",
+      "type": "string[]",
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "isDisabled",
+      "description": "Whether the component is disabled or not.",
+      "type": [
+        "false",
+        "true"
+      ],
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "isInvalid",
+      "description": "Whether the component is invalid or not.",
+      "type": [
+        "false",
+        "true"
+      ],
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "isReadOnly",
+      "description": "Whether the component is read only or not.",
+      "type": [
+        "false",
+        "true"
+      ],
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "isRequired",
+      "description": "Whether the component is required or not.",
+      "type": [
+        "false",
+        "true"
+      ],
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "label",
+      "description": "Label of the switch group.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "onChange",
+      "description": "Method to handle component change.",
+      "type": "(values: string[]) => void",
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "selectionMode",
+      "description": "Whether the listbox allows multiple selections or single ones.",
+      "type": [
+        "\"single\"",
+        "\"multiple\""
+      ],
+      "required": false,
+      "defaultValue": "'single'",
+      "category": "props"
+    },
+    {
+      "name": "values",
+      "description": "Currently selected values.\nUsed for controlled version.",
+      "type": "string[]",
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "variant",
+      "description": "Whether the Listbox is used as standalone or is unstyled within another component.",
+      "type": [
+        "\"standalone\"",
+        "\"unstyled\""
+      ],
+      "required": false,
+      "defaultValue": "'standalone'",
+      "category": "props"
+    },
+    {
+      "name": "display",
+      "description": "Sets whether an element is treated as a block or inline element and the layout used for its children, such as flow layout, grid or flex. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/display\">MDN</a>.",
+      "type": [
+        "\"inline\"",
+        "\"inherit\"",
+        "\"grid\"",
+        "\"block\"",
+        "\"inline-block\"",
+        "\"flex\"",
+        "\"inline-flex\"",
+        "\"inline-grid\""
+      ],
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "alignContent",
+      "description": "The distribution of space around child items along the cross axis. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/align-content\">MDN</a>.",
+      "type": [
+        "\"center\"",
+        "\"flex-start\"",
+        "\"flex-end\"",
+        "\"space-between\"",
+        "\"space-around\"",
+        "\"space-evenly\"",
+        "\"stretch\"",
+        "\"start\"",
+        "\"end\"",
+        "\"baseline\"",
+        "\"first baseline\"",
+        "\"last baseline\""
+      ],
+      "required": false,
+      "defaultValue": null,
+      "category": "layout"
+    },
+    {
+      "name": "alignItems",
+      "description": "The alignment of children within their container. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/align-items\">MDN</a>.",
+      "type": [
+        "\"center\"",
+        "\"flex-start\"",
+        "\"flex-end\"",
+        "\"stretch\"",
+        "\"start\"",
+        "\"end\"",
+        "\"baseline\"",
+        "\"first baseline\"",
+        "\"last baseline\"",
+        "\"self-start\"",
+        "\"self-end\""
+      ],
+      "required": false,
+      "defaultValue": null,
+      "category": "layout"
+    },
+    {
+      "name": "flexDirection",
+      "description": "The direction in which to layout children. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/flex-direction\">MDN</a>.",
+      "type": [
+        "\"row\"",
+        "\"row-reverse\"",
+        "\"column\"",
+        "\"column-reverse\""
+      ],
+      "required": false,
+      "defaultValue": null,
+      "category": "layout"
+    },
+    {
+      "name": "flexWrap",
+      "description": "Whether to wrap items onto multiple lines. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/flex-wrap\">MDN</a>.",
+      "type": [
+        "\"nowrap\"",
+        "\"wrap\"",
+        "\"wrap-reverse\""
+      ],
+      "required": false,
+      "defaultValue": null,
+      "category": "layout"
+    },
+    {
+      "name": "gap",
+      "description": "The space to display between both rows and columns. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/gap\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "layout"
+    },
+    {
+      "name": "justifyContent",
+      "description": "The distribution of space around items along the main axis. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content\">MDN</a>.",
+      "type": [
+        "\"center\"",
+        "\"flex-start\"",
+        "\"flex-end\"",
+        "\"space-between\"",
+        "\"space-around\"",
+        "\"space-evenly\"",
+        "\"stretch\"",
+        "\"start\"",
+        "\"end\"",
+        "\"baseline\"",
+        "\"first baseline\"",
+        "\"last baseline\"",
+        "\"left\"",
+        "\"right\""
+      ],
+      "required": false,
+      "defaultValue": null,
+      "category": "layout"
+    },
+    {
+      "name": "gridAutoColumns",
+      "description": "Defines the size of implicitly generated columns. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-columns\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "layout"
+    },
+    {
+      "name": "gridAutoRows",
+      "description": "Defines the size of implicitly generated rows. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-rows\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "layout"
+    },
+    {
+      "name": "gridTemplateAreas",
+      "description": "Defines named grid areas. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-areas\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "layout"
+    },
+    {
+      "name": "gridTemplateColumns",
+      "description": "Defines the sizes of each column in the grid. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "layout"
+    },
+    {
+      "name": "gridTemplateRows",
+      "description": "Defines the sizes of each row in the grid. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-rows\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "layout"
+    },
+    {
+      "name": "justifyItems",
+      "description": "Defines the default justifySelf for all items in the grid. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items\">MDN</a>.",
+      "type": [
+        "\"center\"",
+        "\"stretch\"",
+        "\"start\"",
+        "\"end\""
+      ],
+      "required": false,
+      "defaultValue": null,
+      "category": "layout"
+    },
+    {
+      "name": "margin",
+      "description": "The margin for all four sides of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/margin\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "spacing"
+    },
+    {
+      "name": "marginBottom",
+      "description": "The margin for the bottom side of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/margin-bottom\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "spacing"
+    },
+    {
+      "name": "marginLeft",
+      "description": "The margin for the left side of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/margin-left\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "spacing"
+    },
+    {
+      "name": "marginRight",
+      "description": "The margin for the right side of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/margin-right\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "spacing"
+    },
+    {
+      "name": "marginTop",
+      "description": "The margin for the top side of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/margin-top\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "spacing"
+    },
+    {
+      "name": "height",
+      "description": "The height of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/height\">MDN</a>.",
+      "type": [
+        "string",
+        "number"
+      ],
+      "required": false,
+      "defaultValue": null,
+      "category": "sizing"
+    },
+    {
+      "name": "maxHeight",
+      "description": "The maximum height of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/max-height\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "sizing"
+    },
+    {
+      "name": "maxWidth",
+      "description": "The maximum width of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/max-width\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "sizing"
+    },
+    {
+      "name": "minHeight",
+      "description": "The minimum height of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/min-height\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "sizing"
+    },
+    {
+      "name": "minWidth",
+      "description": "The minimum width of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/min-width\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "sizing"
+    },
+    {
+      "name": "width",
+      "description": "The width of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/width\">MDN</a>.",
+      "type": [
+        "string",
+        "number"
+      ],
+      "required": false,
+      "defaultValue": null,
+      "category": "sizing"
+    },
+    {
+      "name": "position",
+      "description": "Specifies how the element is positioned. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/position\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "positioning"
+    },
+    {
+      "name": "top",
+      "description": "The top position for the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/top\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "positioning"
+    },
+    {
+      "name": "bottom",
+      "description": "The bottom position for the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/bottom\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "positioning"
+    },
+    {
+      "name": "left",
+      "description": "The left position for the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/left\">MDN</a>. Consider using start instead for RTL support.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "positioning"
+    },
+    {
+      "name": "right",
+      "description": "The right position for the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/right\">MDN</a>. Consider using start instead for RTL support.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "positioning"
+    },
+    {
+      "name": "zIndex",
+      "description": "The stacking order for the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/z-index\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "positioning"
+    },
+    {
+      "name": "background",
+      "description": "The background shorthand CSS property sets all background style properties at once, such as color, image, origin and size, or repeat method. Component properties not set in the background shorthand property value declaration are set to their default values. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/background\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "backgroundColor",
+      "description": "The background-color CSS property sets the background color of an element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/background-color\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "border",
+      "description": "The border shorthand CSS property sets an element's border. It sets the values of border-width, border-style, and border-color. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/border\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "borderTop",
+      "description": "The border-top CSS property sets all the properties of an element's top border. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/border-top\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "borderBottom",
+      "description": "The border-top CSS property sets all the properties of an element's bottom border. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "borderLeft",
+      "description": "The border-top CSS property sets all the properties of an element's left border. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/border-left\">MDN</a>. Consider using start instead for RTL support.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "borderRight",
+      "description": "The border-top CSS property sets all the properties of an element's right border. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/border-right\">MDN</a>. Consider using start instead for RTL support.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "borderRadius",
+      "description": "The border-radius CSS property rounds the corners of an element's outer border edge. You can set a single radius to make circular corners, or two radii to make elliptical corners. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "boxShadow",
+      "description": "The box-shadow CSS property adds shadow effects around an element's frame. You can set multiple effects separated by commas. A box shadow is described by X and Y offsets relative to the element, blur and spread radius, and color. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "props"
+    },
+    {
+      "name": "padding",
+      "description": "The padding for all four sides of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/padding\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "spacing"
+    },
+    {
+      "name": "paddingBottom",
+      "description": "The padding for the bottom side of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/padding-bottom\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "spacing"
+    },
+    {
+      "name": "paddingLeft",
+      "description": "The padding for the left side of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/padding-left\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "spacing"
+    },
+    {
+      "name": "paddingRight",
+      "description": "The padding for the right side of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/padding-right\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "spacing"
+    },
+    {
+      "name": "paddingTop",
+      "description": "The padding for the top side of the element. See <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/padding-top\">MDN</a>.",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "category": "spacing"
+    }
+  ],
+  "examples": [],
+  "tags": {}
+}