{
  "widget": {
    "name": "Tabs",
    "selector": "jqx-tabs"
  },
  "properties": [
    {
      "name": "addNewTab",
      "value": false,
      "allowedValues": [],
      "description": "Sets or gets whether the \"Add new tab\" button (+) is displayed.",
      "demoValues": [ true, false ],
      "type": "boolean"
    },
    {
      "name": "closeButtonMode",
      "value": "default",
      "allowedValues": [ "default", "selected" ],
      "description": "Sets or gets the close button mode.",
      "demoValues": [ "selected", "default" ],
      "type": "string"
    },
    {
      "name": "closeButtons",
      "value": false,
      "allowedValues": [],
      "description": "Sets or gets whether close buttons are displayed.",
      "demoValues": [ true, false ],
      "type": "boolean"
    },
    {
      "name": "collapsed",
      "value": false,
      "allowedValues": [],
      "description": "Sets or gets whether the Tabs content section is collapsed.",
      "demoValues": [ true, false ],
      "type": "boolean"
    },
    {
      "name": "collapsible",
      "value": false,
      "allowedValues": [],
      "description": "Enables or disables the collapsible feature.",
      "demoValues": [ true, false ],
      "type": "boolean"
    },
    {
      "name": "disabled",
      "value": false,
      "allowedValues": [],
      "description": "Enables or disables the element.",
      "demoValues": [ true, false ],
      "type": "boolean"
    },
    {
      "name": "messages",
      "value": "{ 'en': { 'ambiguousIndexes': 'jqx-tabs: Initially set jqx-tab-item indexes are ambiguous and are ignored in favour of the HTML structure.', 'detailsObjectRequired': 'jqx-tabs: The method \"insert\" requires a details Object to be passed as a second argument.', 'invalidIndex': 'jqx-tabs: \"{{method}}\" method accepts an index of type number.', 'referenceNodeNotChild': 'jqx-tabs: Passed {{argument}} is not part of this jqx-tabs element.', 'tabItemRequired': 'jqx-tabs: The method \"{{method}}\" requires a \"jqx-tab-item\" element to be passed as an argument.' } }",
      "allowedValues": [],
      "description": "Sets or gets an object specifying strings used in the widget that can be localized. Used in conjunction with the property <strong>language</strong>. ",
      "demoValues": [
        "{ \"de\": { \"ambiguousIndexes\": \"jqx-tabs: Anfänglich werden jqx-tab-item-Indizes mehrdeutig und werden zugunsten der HTML-Struktur ignoriert.\", \"detailsObjectRequired\": \"jqx-tabs: Die Methode insert erfordert ein details Objekt, das als zweites Argument übergeben werden soll.\", \"invalidIndex\": \"jqx-tabs: {{method}} -Methode akzeptiert einen Index der Typnummer.\", \"referenceNodeNotChild\": \"jqx-tabs: Passierte {{argument}} ist nicht Teil dieses jqx-tabs-Elements.\", \"tabItemRequired\": \"jqx-tabs: Die Methode {{method}} erfordert, dass ein jqx-tab-item -Element als Argument übergeben wird.\" } }",
        "{ 'en': { 'ambiguousIndexes': 'jqx-tabs: Initially set jqx-tab-item indexes are ambiguous and are ignored in favour of the HTML structure.', 'detailsObjectRequired': 'jqx-tabs: The method \"insert\" requires a details Object to be passed as a second argument.', 'invalidIndex': 'jqx-tabs: \"{{method}}\" method accepts an index of type number.', 'referenceNodeNotChild': 'jqx-tabs: Passed {{argument}} is not part of this jqx-tabs element.', 'tabItemRequired': 'jqx-tabs: The method \"{{method}}\" requires a \"jqx-tab-item\" element to be passed as an argument.' } }"
      ],
      "type": "object"
    },
    {
      "name": "position",
      "value": "top",
      "allowedValues": [ "top", "bottom", "left", "right", "hidden" ],
      "description": "Sets or gets where the tab strip is positioned.",
      "demoValues": [ "bottom", "left" ],
      "type": "string"
    },
    {
      "name": "readonly",
      "value": false,
      "allowedValues": [],
      "description": "Disables user interaction with the element.",
      "demoValues": [ false, true ],
      "type": "boolean"
    },
    {
      "name": "reorder",
      "value": false,
      "allowedValues": [],
      "description": "Enables or disables the reorder feature. When this feature is enabled, the end-user can drag a tab and drop it over another tab. As a result the tabs will be reordered.",
      "demoValues": [ false, true ],
      "type": "boolean"
    },
    {
      "name": "resize",
      "value": false,
      "allowedValues": [],
      "description": "Sets or gets whether tab labels can be resized by dragging with the mouse.",
      "demoValues": [ false, true ],
      "type": "boolean"
    },
    {
      "name": "scrollButtonsPosition",
      "value": "both",
      "allowedValues": [ "near", "far", "both" ],
      "description": "Sets or gets the position of the scroll buttons.",
      "demoValues": [ "near", "far" ],
      "type": "string"
    },
    {
      "name": "selectedIndex",
      "value": null,
      "allowedValues": [],
      "description": "Sets or gets which tab is selected.",
      "demoValues": [ 2, 0 ],
      "type": "number"
    },
    {
      "name": "selectionMode",
      "value": "click",
      "allowedValues": [ "click", "dblclick", "mouseenter", "none" ],
      "description": "Determines the way the user can switch between tabs.",
      "demoValues": [ "dblclick", "mouseenter" ],
      "type": "string"
    },
    {
      "name": "tabOverflow",
      "value": "scroll",
      "allowedValues": [ "scroll", "dropdown", "wrap", "shrink" ],
      "description": "Applies one of four behaviors when the element is not wide enough to display all tab labels.",
      "demoValues": [ "dropdown", "wrap" ],
      "type": "string"
    },
    {
      "name": "textOrientation",
      "value": "horizontal",
      "allowedValues": [ "horizontal", "vertical" ],
      "description": "Sets or gets the orientation of the text in the tabs.",
      "demoValues": [ "vertical", "horizontal" ],
      "type": "string"
    }
  ],
  "events": [
    {
      "name": "change",
      "description": "This event is triggered when the tab selection is changed."
    },
    {
      "name": "close",
      "description": "This event is triggered when a tab is closed."
    },
    {
      "name": "closing",
      "description": "This event is triggered when a tab is about to be closed. The closing operation can be canceled by calling event.preventDefault() in the event handler function."
    },
    {
      "name": "reorder",
      "description": "This event is triggered when tabs have been reordered."
    },
    {
      "name": "reorderEnd",
      "description": "This event is triggered when a reorder operation has ended."
    },
    {
      "name": "reorderStart",
      "description": "This event is triggered when a reorder operation has started."
    }
  ],
  "methods": [
    {
      "name": "appendChild",
      "description": "Appends a \"jqx-tab-item\" node as the last tab of the Tabs.",
      "demoValues": [ false ],
      "returnDataType": "None",
      "arguments": [
        {
          "name": "node",
          "type": "HTMLElement",
          "description": "The \"jqx-tab-item\" node to append",
          "optional": false
        }
      ]
    },
    {
      "name": "collapse",
      "description": "Collapses the content section.",
      "demoValues": [ false ],
      "returnDataType": "None",
      "arguments": [
        {
          "name": "None",
          "type": null,
          "description": "",
          "optional": false
        }
      ]
    },
    {
      "name": "ensureVisible",
      "description": "Makes sure a tab is visible by scrolling to it.",
      "demoValues": [ false ],
      "returnDataType": "None",
      "arguments": [
        {
          "name": "index",
          "type": "Number",
          "description": "The index of the tab to scroll to.",
          "optional": false
        }
      ]
    },
    {
      "name": "expand",
      "description": "Expands the content section.",
      "demoValues": [ false ],
      "returnDataType": "None",
      "arguments": [
        {
          "name": "None",
          "type": null,
          "description": "",
          "optional": false
        }
      ]
    },
    {
      "name": "insert",
      "description": "Inserts a new tab and an associated content section.",
      "demoValues": [
        1,
        {
          "label": "New TAB",
          "content": "New content"
        }
      ],
      "returnDataType": "None",
      "arguments": [
        {
          "name": "index",
          "type": "Number",
          "description": "The index to insert a new tab at.",
          "optional": false
        },
        {
          "name": "details",
          "type": "Object",
          "description": "An Object with the fields \"label\", \"labelSize\", \"content\" and \"group\".",
          "optional": false
        }
      ]
    },
    {
      "name": "insertBefore",
      "description": "Inserts the specified \"jqx-tab-item\" node before the reference \"jqx-tab-item\" node.",
      "demoValues": [ false ],
      "returnDataType": "None",
      "arguments": [
        {
          "name": "newNode",
          "type": "HTMLElement",
          "description": "The \"jqx-tab-item\" node to insert.",
          "optional": false
        },
        {
          "name": "referenceNode",
          "type": "HTMLElement",
          "description": "The \"jqx-tab-item\" node before which newNode is inserted.",
          "optional": true
        }
      ]
    },
    {
      "name": "remove",
      "description": "Removes a tab and its associated content section.",
      "demoValues": [ 5 ],
      "returnDataType": "None",
      "arguments": [
        {
          "name": "index",
          "type": "Number",
          "description": "The index of the tab to remove.",
          "optional": false
        }
      ]
    },
    {
      "name": "removeChild",
      "description": "Removes a child \"jqx-tab-item\" node.",
      "demoValues": [ false ],
      "returnDataType": "None",
      "arguments": [
        {
          "name": "node",
          "type": "HTMLElement",
          "description": "The \"jqx-tab-item\" node to remove.",
          "optional": false
        }
      ]
    },
    {
      "name": "select",
      "description": "Selects a tab.",
      "demoValues": [ 5 ],
      "returnDataType": "None",
      "arguments": [
        {
          "name": "index",
          "type": "Number",
          "description": "The index of the tab to select.",
          "optional": false
        }
      ]
    },
    {
      "name": "setFocusable",
      "description": "Sets whether the element can be focused.",
      "demoValues": [ false ],
      "returnDataType": "None",
      "arguments": [
        {
          "name": "focusable",
          "type": "Boolean",
          "description": "Whether the element can be focused.",
          "optional": false
        }
      ]
    },
    {
      "name": "update",
      "description": "Updates a tab and its associated content section.",
      "demoValues": [ 5, "Updated TAB", "Updated content" ],
      "returnDataType": "None",
      "arguments": [
        {
          "name": "index",
          "type": "Number",
          "description": "The index of the tab to update.",
          "optional": false
        },
        {
          "name": "label",
          "type": "String",
          "description": "The new label of the tab. The value can be the id of an HTMLTemplateElement",
          "optional": false
        },
        {
          "name": "content",
          "type": "String/HTMLElement",
          "description": "The new content of the tab.",
          "optional": false
        }
      ]
    }
  ]
}