{
  "tooltip": {
    "title": "Tooltip",
    "status": {
      "ready": true
    },
    "introduction": "<p>Provides helpful information to users on hover for non-touch devices and hit for touch devices. It makes use of the value assigned to the element's <code>title</code> attribute.</p>",
    "examples": [
      {
        "description": "Basic Tooltip",
        "template": "tooltip",
        "template-data": {
        }
      },
      {
        "description": "Tooltip hover ONLY",
        "template": "tooltip",
        "template-data": {
          "hover-only": true
        }
      }
    ],
    "dependencies": [
      "src/styles/base/*.scss",
      "src/styles/components/elements/_tooltip.scss",
      "src/scripts/modules/jquery.pfTooltip.js"
    ],
    "usages": {
      "body": [
        [
          "<code>[data-js=tooltip]</code>",
          "Placed on any element with a defined <code>title</code> attribute that you want to be enhanced into a tooltip.",
          "Required"
        ],
        [
          "<code>[data-tooltip-action=true]</code>",
          "Placed on any tooltip trigger that should be ignored on touch devices, because it has a link/action already associated to it that the tooltip should not mess with on hit. Put another way, the tooltip will only show on hover when this is added.",
          "Optional"
        ]
      ]
    }
  }
}
