[
  {
    "tags": [
      {
        "type": "component",
        "string": "button",
        "html": "<p>button</p>"
      },
      {
        "type": "param",
        "string": "{bindable} label (string)",
        "name": "label",
        "description": "<p>(string)</p>",
        "types": [
          "bindable"
        ],
        "typesDescription": "<a href=\"bindable.html\">bindable</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false
      },
      {
        "type": "param",
        "string": "{bindable} icon (string)",
        "name": "icon",
        "description": "<p>(string)</p>",
        "types": [
          "bindable"
        ],
        "typesDescription": "<a href=\"bindable.html\">bindable</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false
      },
      {
        "type": "param",
        "string": "{pseudo} default",
        "name": "default",
        "description": "",
        "types": [
          "pseudo"
        ],
        "typesDescription": "<a href=\"pseudo.html\">pseudo</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false,
        "html": "<p>{pseudo} default</p>"
      },
      {
        "type": "param",
        "string": "{pseudo} primary",
        "name": "primary",
        "description": "",
        "types": [
          "pseudo"
        ],
        "typesDescription": "<a href=\"pseudo.html\">pseudo</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false,
        "html": "<p>{pseudo} primary</p>"
      },
      {
        "type": "param",
        "string": "{pseudo} secondary",
        "name": "secondary",
        "description": "",
        "types": [
          "pseudo"
        ],
        "typesDescription": "<a href=\"pseudo.html\">pseudo</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false,
        "html": "<p>{pseudo} secondary</p>"
      },
      {
        "type": "param",
        "string": "{pseudo} danger",
        "name": "danger",
        "description": "",
        "types": [
          "pseudo"
        ],
        "typesDescription": "<a href=\"pseudo.html\">pseudo</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false,
        "html": "<p>{pseudo} danger</p>"
      },
      {
        "type": "param",
        "string": "{pseudo} text",
        "name": "text",
        "description": "",
        "types": [
          "pseudo"
        ],
        "typesDescription": "<a href=\"pseudo.html\">pseudo</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false,
        "html": "<p>{pseudo} text</p>"
      },
      {
        "type": "param",
        "string": "{pseudo} link",
        "name": "link",
        "description": "",
        "types": [
          "pseudo"
        ],
        "typesDescription": "<a href=\"pseudo.html\">pseudo</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false,
        "html": "<p>{pseudo} link</p>"
      },
      {
        "type": "param",
        "string": "{pseudo} small",
        "name": "small",
        "description": "",
        "types": [
          "pseudo"
        ],
        "typesDescription": "<a href=\"pseudo.html\">pseudo</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false,
        "html": "<p>{pseudo} small</p>"
      },
      {
        "type": "param",
        "string": "{pseudo} large",
        "name": "large",
        "description": "",
        "types": [
          "pseudo"
        ],
        "typesDescription": "<a href=\"pseudo.html\">pseudo</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false,
        "html": "<p>{pseudo} large</p>"
      },
      {
        "type": "param",
        "string": "{pseudo} square",
        "name": "square",
        "description": "",
        "types": [
          "pseudo"
        ],
        "typesDescription": "<a href=\"pseudo.html\">pseudo</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false,
        "html": "<p>{pseudo} square</p>"
      },
      {
        "type": "param",
        "string": "{pseudo} full",
        "name": "full",
        "description": "",
        "types": [
          "pseudo"
        ],
        "typesDescription": "<a href=\"pseudo.html\">pseudo</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false,
        "html": "<p>{pseudo} full</p>"
      },
      {
        "type": "section.usage",
        "string": "",
        "html": ""
      },
      {
        "type": "usage.title",
        "string": "Usage",
        "html": "<p>Usage</p>"
      },
      {
        "type": "usage.description",
        "string": "A button can have a label, an icon, or both",
        "html": "<p>A button can have a label, an icon, or both</p>"
      },
      {
        "type": "usage.examples.Label",
        "string": " aire-button(label=\"Labeled Button\" default)",
        "html": "<p>aire-button(label=&quot;Labeled Button&quot; default)</p>"
      },
      {
        "type": "usage.examples.Icon",
        "string": "aire-button(icon=\"fa fa-pencil\" default)",
        "html": "<p>aire-button(icon=&quot;fa fa-pencil&quot; default)</p>"
      },
      {
        "type": "usage.examples.Label_And_Icon",
        "string": "aire-button(label=\"Edit\" icon=\"fa fa-pencil\" default)",
        "html": "<p>aire-button(label=&quot;Edit&quot; icon=&quot;fa fa-pencil&quot; default)</p>"
      },
      {
        "type": "section.style",
        "string": "",
        "html": ""
      },
      {
        "type": "style.title",
        "string": "Style",
        "html": "<p>Style</p>"
      },
      {
        "type": "style.description",
        "string": "Buttons have six styling options: default, primary, secondary, danger, text and link. They also have two size options (small and large) and two width options (square and full).",
        "html": "<p>Buttons have six styling options: default, primary, secondary, danger, text and link. They also have two size options (small and large) and two width options (square and full).</p>"
      },
      {
        "type": "style.examples.Styles",
        "string": "p\n aire-button(label=\"Default\" default)\np\n aire-button(label=\"Primary\" primary)\np\n aire-button(label=\"Secondary\" secondary)\np\n aire-button(label=\"Danger\" danger)\np\n aire-button(label=\"Text\" text)\np\n aire-button(label=\"Link\" link)",
        "html": "<p>p<br />\naire-button(label=&quot;Default&quot; default)<br />\np<br />\naire-button(label=&quot;Primary&quot; primary)<br />\np<br />\naire-button(label=&quot;Secondary&quot; secondary)<br />\np<br />\naire-button(label=&quot;Danger&quot; danger)<br />\np<br />\naire-button(label=&quot;Text&quot; text)<br />\np<br />\naire-button(label=&quot;Link&quot; link)</p>"
      },
      {
        "type": "style.examples.Sizes",
        "string": "p\n aire-button(label=\"Small\" small default)\np\n aire-button(label=\"Large\" large default)\np\n aire-button(label=\"S\" square default)\np\n aire-button(label=\"Full\" full default)",
        "html": "<p>p<br />\naire-button(label=&quot;Small&quot; small default)<br />\np<br />\naire-button(label=&quot;Large&quot; large default)<br />\np<br />\naire-button(label=&quot;S&quot; square default)<br />\np<br />\naire-button(label=&quot;Full&quot; full default)</p>"
      }
    ],
    "description": {
      "full": "<p>The aire-button is a button element with some special styling and an optional icon and text</p>",
      "summary": "<p>The aire-button is a button element with some special styling and an optional icon and text</p>",
      "body": ""
    },
    "isPrivate": false,
    "isConstructor": false,
    "isClass": false,
    "isEvent": false,
    "ignore": false,
    "line": 7,
    "codeStart": 72,
    "code": "@inject(DOM.Element)\n@customElement('aire-button')\nexport class AireButton extends AireBaseButton {\n\n  @bindable\n  label     : string;\n\n  @bindable\n  type      : string;\n\n  @bindable\n  href      : string;\n\n  @bindable\n  target    : string;\n\n  constructor(element: Element) {\n      super(element);\n  }\n\n  attached() {\n      super.attached();\n      dom.decorateTo(this.element, this.button, \"text\", \"uk-button-text\");\n      dom.decorateTo(this.element, this.button, \"link\", \"uk-button-link\");\n      dom.decorateTo(this.element, this.button, \"full\", \"uk-width-1-1\");\n      dom.decorateTo(this.element, this.button, \"small\", \"uk-button-small\");\n      dom.decorateTo(this.element, this.button, \"large\", \"uk-button-large\");\n      dom.decorateTo(this.element, this.button, \"square\", \"aire-button-square\");\n  }\n}",
    "ctx": false
  }
]