{
  "name": "Toolbar",
  "description": "A flexible way to show and customize a toolbar",
  "user_stories": [],
  "screens": "",
  "workflow": "",
  "test_plan": [],
  "components": [
    {
      "name": "Toolbar",
      "type": "Components",
      "description": "A flexible way to show and customize a toolbar",
      "behaviors": "",
      "exists": "No",
      "package": "No",
      "schema": [
        {
          "name": "name",
          "type": "string",
          "description": "The unique name to give the toolbar...useful for plugin hooks",
          "schema_type": "prop",
          "required": false
        },
        {
          "name": "leftItems",
          "type": "JSX.Element[]",
          "description": "An array of react components to display on the left side of the toolbar",
          "schema_type": "prop",
          "required": false
        },
        {
          "name": "rightItems",
          "type": "JSX.Element[]",
          "description": "An array of react components to display on the right side of the toolbar",
          "schema_type": "prop",
          "required": false
        },
        {
          "name": "children",
          "type": "JSX.Element",
          "description": "Component/element to place beneath the toolbar",
          "schema_type": "prop",
          "required": false
        },
        {
          "name": "title",
          "type": "string | JSX.Element",
          "description": "The title or react component to display in the center / title area of the toolbar",
          "schema_type": "prop",
          "required": false
        }
      ],
      "tests": [
        {
          "it": "(Rendering) Should render the component in the dom",
          "type": "Integration"
        },
        {
          "it": "(Rendering) Should show the same number of items in the left side of the toolbar as the number of items in the leftItems prop",
          "type": "Integration"
        },
        {
          "it": "(Rendering) Should show the same number of items in the right side of the toolbar as the number of items in the rightItems prop",
          "type": "Integration"
        },
        {
          "it": "(Rendering) Should show a title if one is provided",
          "type": "Integration"
        },
        {
          "it": "(Rendering) Should show a child element if one is provided",
          "type": "Integration"
        },
        {
          "it": "(Hooks) Should trigger the onComponentRender(\"Toolbar\") plugin hook when the Toolbar is rendering",
          "type": "Integration"
        },
        {
          "it": "(Hooks) Should trigger the onListItems(\"ToolbarLeftItems\") plugin hook when the list of Toolbar Left Items are being generated",
          "type": "Integration"
        },
        {
          "it": "(Hooks) Should trigger the onListItems(\"ToolbarRightItems\") plugin hook when the list of Toolbar Right Items are being generated",
          "type": "Integration"
        }
      ]
    }
  ],
  "database": [],
  "api": []
}
