react-common/packages/react-common-docs/src/docgen.json

[
  {
    "description": "Component for performing an action upon activation (e.g. when clicked).\n\nDepending on the declared props, this component can function as a hyperlink or as a button.",
    "displayName": "Button",
    "methods": [],
    "props": {
      "size": {
        "defaultValue": {
          "value": "medium"
        },
        "description": "Size of the component.",
        "name": "size",
        "required": false,
        "type": {
          "name": "enum",
          "raw": "Size",
          "value": [
            {
              "value": "\"small\""
            },
            {
              "value": "\"medium\""
            },
            {
              "value": "\"large\""
            }
          ]
        }
      },
      "variant": {
        "defaultValue": {
          "value": "outline"
        },
        "description": "Variant of the component.",
        "name": "variant",
        "required": false,
        "type": {
          "name": "enum",
          "raw": "Variant",
          "value": [
            {
              "value": "\"outline\""
            },
            {
              "value": "\"primary\""
            }
          ]
        }
      },
      "children": {
        "defaultValue": null,
        "description": "Text to identify the action associated upon activation of the component.",
        "name": "children",
        "required": false,
        "type": {
          "name": "any"
        }
      },
      "disabled": {
        "defaultValue": {
          "value": false
        },
        "description": "Can the component be activated?",
        "name": "disabled",
        "required": false,
        "type": {
          "name": "boolean"
        }
      },
      "element": {
        "defaultValue": {
          "value": "button"
        },
        "description": "The corresponding HTML element of the component.",
        "name": "element",
        "required": false,
        "type": {
          "name": "enum",
          "raw": "ButtonElement",
          "value": [
            {
              "value": "\"a\""
            },
            {
              "value": "\"button\""
            }
          ]
        }
      },
      "href": {
        "defaultValue": null,
        "description": "The URL of the page to navigate to, if `element` is set to `\"a\"`.",
        "name": "href",
        "required": false,
        "type": {
          "name": "string"
        }
      },
      "target": {
        "defaultValue": null,
        "description": "The target on where to display the page navigated to, if `element` is set to `\"a\"`.",
        "name": "target",
        "required": false,
        "type": {
          "name": "string"
        }
      },
      "rel": {
        "defaultValue": null,
        "description": "The relationship of the current page to the referred page in `href`, if `element` is set to `\"a\"`.",
        "name": "rel",
        "required": false,
        "type": {
          "name": "string"
        }
      },
      "type": {
        "defaultValue": {
          "value": "button"
        },
        "description": "The type of the button, if `element` is set to `\"button\"`.",
        "name": "type",
        "required": false,
        "type": {
          "name": "enum",
          "raw": "ButtonType",
          "value": [
            {
              "value": "\"button\""
            },
            {
              "value": "\"submit\""
            },
            {
              "value": "\"reset\""
            }
          ]
        }
      },
      "border": {
        "defaultValue": {
          "value": false
        },
        "description": "Does the button display a border?",
        "name": "border",
        "required": false,
        "type": {
          "name": "boolean"
        }
      },
      "onClick": {
        "defaultValue": null,
        "description": "Event handler triggered when the component is clicked.",
        "name": "onClick",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      },
      "onFocus": {
        "defaultValue": null,
        "description": "Event handler triggered when the component receives focus.",
        "name": "onFocus",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      },
      "onBlur": {
        "defaultValue": null,
        "description": "Event handler triggered when the component loses focus.",
        "name": "onBlur",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      }
    }
  },
  {
    "description": "Component for values that have an on/off state.",
    "displayName": "Checkbox",
    "methods": [],
    "props": {
      "onFocus": {
        "defaultValue": null,
        "description": "Event handler triggered when the component receives focus.",
        "name": "onFocus",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      },
      "onBlur": {
        "defaultValue": null,
        "description": "Event handler triggered when the component loses focus.",
        "name": "onBlur",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      },
      "label": {
        "defaultValue": {
          "value": ""
        },
        "description": "Short textual description indicating the nature of the component's value.",
        "name": "label",
        "required": false,
        "type": {
          "name": "any"
        }
      },
      "name": {
        "defaultValue": null,
        "description": "Name of the form field associated with this component.",
        "name": "name",
        "required": false,
        "type": {
          "name": "string"
        }
      },
      "onChange": {
        "defaultValue": null,
        "description": "Event handler triggered when the component is toggled.",
        "name": "onChange",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      },
      "value": {
        "defaultValue": null,
        "description": "Value of the component.",
        "name": "value",
        "required": false,
        "type": {
          "name": "any"
        }
      },
      "checked": {
        "defaultValue": null,
        "description": "Checked state of the component.",
        "name": "checked",
        "required": false,
        "type": {
          "name": "boolean"
        }
      }
    }
  },
  {
    "description": "Component for displaying graphics.",
    "displayName": "Icon",
    "methods": [],
    "props": {
      "size": {
        "defaultValue": {
          "value": "1.5rem"
        },
        "description": "Size of the icon. This controls both the width and the height.",
        "name": "size",
        "required": false,
        "type": {
          "name": "ReactText"
        }
      },
      "label": {
        "defaultValue": {
          "value": null
        },
        "description": "Description of what the component represents.",
        "name": "label",
        "required": false,
        "type": {
          "name": "string"
        }
      },
      "name": {
        "defaultValue": null,
        "description": "Name of the icon to display.",
        "name": "name",
        "required": false,
        "type": {
          "name": "string"
        }
      },
      "weight": {
        "defaultValue": {
          "value": "0.125rem"
        },
        "description": "Width of the icon's strokes.",
        "name": "weight",
        "required": false,
        "type": {
          "name": "ReactText"
        }
      }
    }
  },
  {
    "description": "Component for values which are to be selected from a few list of options.",
    "displayName": "RadioButton",
    "methods": [],
    "props": {
      "onFocus": {
        "defaultValue": null,
        "description": "Event handler triggered when the component receives focus.",
        "name": "onFocus",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      },
      "onBlur": {
        "defaultValue": null,
        "description": "Event handler triggered when the component loses focus.",
        "name": "onBlur",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      },
      "label": {
        "defaultValue": {
          "value": ""
        },
        "description": "Short textual description indicating the nature of the component's value.",
        "name": "label",
        "required": false,
        "type": {
          "name": "any"
        }
      },
      "name": {
        "defaultValue": null,
        "description": "Group where the component belongs.",
        "name": "name",
        "required": false,
        "type": {
          "name": "string"
        }
      },
      "onChange": {
        "defaultValue": null,
        "description": "Event handler triggered when the component is selected.",
        "name": "onChange",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      },
      "value": {
        "defaultValue": null,
        "description": "Value of the component.",
        "name": "value",
        "required": false,
        "type": {
          "name": "any"
        }
      },
      "checked": {
        "defaultValue": null,
        "description": "Checked state of the component.",
        "name": "checked",
        "required": false,
        "type": {
          "name": "boolean"
        }
      }
    }
  },
  {
    "description": "Component for selecting values from a larger number of options.",
    "displayName": "Select",
    "methods": [],
    "props": {
      "size": {
        "defaultValue": {
          "value": "medium"
        },
        "description": "Size of the component.",
        "name": "size",
        "required": false,
        "type": {
          "name": "enum",
          "raw": "Size",
          "value": [
            {
              "value": "\"small\""
            },
            {
              "value": "\"medium\""
            },
            {
              "value": "\"large\""
            }
          ]
        }
      },
      "disabled": {
        "defaultValue": {
          "value": false
        },
        "description": "Is the component active?",
        "name": "disabled",
        "required": false,
        "type": {
          "name": "boolean"
        }
      },
      "border": {
        "defaultValue": {
          "value": false
        },
        "description": "Does the button display a border?",
        "name": "border",
        "required": false,
        "type": {
          "name": "boolean"
        }
      },
      "onFocus": {
        "defaultValue": null,
        "description": "Event handler triggered when the component receives focus.",
        "name": "onFocus",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      },
      "onBlur": {
        "defaultValue": null,
        "description": "Event handler triggered when the component loses focus.",
        "name": "onBlur",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      },
      "label": {
        "defaultValue": {
          "value": ""
        },
        "description": "Short textual description indicating the nature of the component's value.",
        "name": "label",
        "required": false,
        "type": {
          "name": "any"
        }
      },
      "name": {
        "defaultValue": null,
        "description": "Name of the form field associated with this component.",
        "name": "name",
        "required": false,
        "type": {
          "name": "string"
        }
      },
      "onChange": {
        "defaultValue": null,
        "description": "Event handler triggered when the component changes value.",
        "name": "onChange",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      },
      "value": {
        "defaultValue": null,
        "description": "Value of the component.",
        "name": "value",
        "required": false,
        "type": {
          "name": "any"
        }
      },
      "hint": {
        "defaultValue": {
          "value": ""
        },
        "description": "Short textual description as guidelines for valid input values.",
        "name": "hint",
        "required": false,
        "type": {
          "name": "any"
        }
      },
      "multiple": {
        "defaultValue": {
          "value": false
        },
        "description": "Can multiple values be selected?",
        "name": "multiple",
        "required": false,
        "type": {
          "name": "boolean"
        }
      },
      "defaultValue": {
        "defaultValue": null,
        "description": "Default value of the component.",
        "name": "defaultValue",
        "required": false,
        "type": {
          "name": "any"
        }
      }
    }
  },
  {
    "description": "Component for inputting numeric values in a graphical manner.\n\nThe component is styled using client-side scripts. When the component is rendered server-side,\nthe component falls back into the original `<input type=\"range\">` element.",
    "displayName": "Slider",
    "methods": [],
    "props": {
      "disabled": {
        "defaultValue": {
          "value": false
        },
        "description": "Is the component active?",
        "name": "disabled",
        "required": false,
        "type": {
          "name": "boolean"
        }
      },
      "label": {
        "defaultValue": {
          "value": ""
        },
        "description": "Short textual description indicating the nature of the component's value.",
        "name": "label",
        "required": false,
        "type": {
          "name": "any"
        }
      },
      "onChange": {
        "defaultValue": null,
        "description": "Event handler triggered when the component changes value.",
        "name": "onChange",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      },
      "value": {
        "defaultValue": null,
        "description": "Value of the component.",
        "name": "value",
        "required": false,
        "type": {
          "name": "any"
        }
      },
      "defaultValue": {
        "defaultValue": null,
        "description": "Default value of the component.",
        "name": "defaultValue",
        "required": false,
        "type": {
          "name": "any"
        }
      },
      "orientation": {
        "defaultValue": {
          "value": "horizontal"
        },
        "description": "The component orientation.",
        "name": "orientation",
        "required": false,
        "type": {
          "name": "enum",
          "raw": "Orientation",
          "value": [
            {
              "value": "\"vertical\""
            },
            {
              "value": "\"horizontal\""
            }
          ]
        }
      },
      "length": {
        "defaultValue": {
          "value": "16rem"
        },
        "description": "CSS size for the component length.",
        "name": "length",
        "required": false,
        "type": {
          "name": "ReactText"
        }
      },
      "fallback": {
        "defaultValue": {
          "value": false
        },
        "description": "Use the sSR-friendly rendering of the component.",
        "name": "fallback",
        "required": false,
        "type": {
          "name": "boolean"
        }
      }
    }
  },
  {
    "description": "Component for inputting textual values.\n\nThis component supports multiline input and adjusts its layout accordingly.",
    "displayName": "TextInput",
    "methods": [],
    "props": {
      "size": {
        "defaultValue": {
          "value": "medium"
        },
        "description": "Size of the component.",
        "name": "size",
        "required": false,
        "type": {
          "name": "enum",
          "raw": "Size",
          "value": [
            {
              "value": "\"small\""
            },
            {
              "value": "\"medium\""
            },
            {
              "value": "\"large\""
            }
          ]
        }
      },
      "disabled": {
        "defaultValue": {
          "value": false
        },
        "description": "Is the component active?",
        "name": "disabled",
        "required": false,
        "type": {
          "name": "boolean"
        }
      },
      "border": {
        "defaultValue": {
          "value": false
        },
        "description": "Does the button display a border?",
        "name": "border",
        "required": false,
        "type": {
          "name": "boolean"
        }
      },
      "onFocus": {
        "defaultValue": null,
        "description": "Event handler triggered when the component receives focus.",
        "name": "onFocus",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      },
      "onBlur": {
        "defaultValue": null,
        "description": "Event handler triggered when the component loses focus.",
        "name": "onBlur",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      },
      "label": {
        "defaultValue": {
          "value": ""
        },
        "description": "Short textual description indicating the nature of the component's value.",
        "name": "label",
        "required": false,
        "type": {
          "name": "any"
        }
      },
      "onChange": {
        "defaultValue": null,
        "description": "Event handler triggered when the component changes value.",
        "name": "onChange",
        "required": false,
        "type": {
          "name": "(...args: any[]) => any"
        }
      },
      "value": {
        "defaultValue": null,
        "description": "Value of the component.",
        "name": "value",
        "required": false,
        "type": {
          "name": "any"
        }
      },
      "hint": {
        "defaultValue": {
          "value": ""
        },
        "description": "Short textual description as guidelines for valid input values.",
        "name": "hint",
        "required": false,
        "type": {
          "name": "any"
        }
      },
      "defaultValue": {
        "defaultValue": null,
        "description": "Default value of the component.",
        "name": "defaultValue",
        "required": false,
        "type": {
          "name": "any"
        }
      },
      "indicator": {
        "defaultValue": {
          "value": null
        },
        "description": "Additional description, usually graphical, indicating the nature of the component's value.",
        "name": "indicator",
        "required": false,
        "type": {
          "name": "ReactNodeLike"
        }
      },
      "multiline": {
        "defaultValue": {
          "value": false
        },
        "description": "Should the component accept multiple lines of input?",
        "name": "multiline",
        "required": false,
        "type": {
          "name": "boolean"
        }
      },
      "autoResize": {
        "defaultValue": {
          "value": false
        },
        "description": "Should the component resize itself to show all its value?",
        "name": "autoResize",
        "required": false,
        "type": {
          "name": "boolean"
        }
      },
      "placeholder": {
        "defaultValue": {
          "value": ""
        },
        "description": "Placeholder of the component when there is no value.",
        "name": "placeholder",
        "required": false,
        "type": {
          "name": "string"
        }
      },
      "rows": {
        "defaultValue": {
          "value": 3
        },
        "description": "How many rows should the component display if it accepts multiline input?",
        "name": "rows",
        "required": false,
        "type": {
          "name": "number"
        }
      },
      "alternate": {
        "defaultValue": {
          "value": false
        },
        "description": "Should the component be displayed with an alternate appearance?",
        "name": "alternate",
        "required": false,
        "type": {
          "name": "boolean"
        }
      }
    }
  }
]