{
  "name": "tooltip",
  "displayName": "Tooltip",
  "type": "shadow",
  "isCustomElement": true,
  "tag": "l-tooltip",
  "nativeTag": null,
  "selector": "l-tooltip",
  "subItemOf": null,
  "summary": "A tooltip that displays contextual text on hover or focus.",
  "status": "stable",
  "appearances": [],
  "import": {
    "css": null,
    "js": "luxen-ui/tooltip"
  },
  "properties": [
    {
      "name": "for",
      "attribute": "for",
      "type": "string",
      "default": "''",
      "reflects": false,
      "description": "The HTML id of the element triggering the tooltip."
    },
    {
      "name": "placement",
      "attribute": "placement",
      "type": "Placement",
      "default": "'top'",
      "reflects": false,
      "description": "The preferred placement of the tooltip."
    },
    {
      "name": "distance",
      "attribute": "distance",
      "type": "number",
      "default": "8",
      "reflects": false,
      "description": "The distance in pixels from the target element."
    },
    {
      "name": "open",
      "attribute": "open",
      "type": "boolean",
      "default": "false",
      "reflects": true,
      "description": "Whether or not the tooltip is visible."
    },
    {
      "name": "withoutArrow",
      "attribute": "without-arrow",
      "type": "boolean",
      "default": "false",
      "reflects": true,
      "description": "Hide the directional arrow."
    },
    {
      "name": "trigger",
      "attribute": "trigger",
      "type": "string",
      "default": "'hover focus'",
      "reflects": false,
      "description": "Space-separated list of trigger modes: `hover`, `focus`, `click`, `manual`."
    }
  ],
  "attributes": [],
  "events": [],
  "methods": [
    {
      "name": "show",
      "params": [],
      "returns": null,
      "description": ""
    },
    {
      "name": "hide",
      "params": [],
      "returns": null,
      "description": ""
    },
    {
      "name": "toggle",
      "params": [],
      "returns": null,
      "description": ""
    }
  ],
  "slots": [
    {
      "name": "",
      "description": "Tooltip content (text or rich HTML)."
    }
  ],
  "cssClasses": [],
  "cssParts": [
    {
      "name": "body",
      "description": "The tooltip popover container."
    },
    {
      "name": "arrow",
      "description": "The directional arrow element."
    }
  ],
  "cssProperties": [
    {
      "name": "--background-color",
      "default": null,
      "description": "Background color for this tooltip instance. Defaults to the global `--l-tooltip-background-color` token (a neutral inverse surface, dark in light mode / light in dark mode) — override that token to re-skin every tooltip at once."
    },
    {
      "name": "--text-color",
      "default": null,
      "description": "Text color. If unset, auto-derived from `--background-color` luminance."
    },
    {
      "name": "--border-radius",
      "default": "4px",
      "description": "Border radius."
    },
    {
      "name": "--max-width",
      "default": "180px",
      "description": "Maximum width."
    },
    {
      "name": "--arrow-size",
      "default": "6px",
      "description": "Arrow size."
    },
    {
      "name": "--show-duration",
      "default": "150ms",
      "description": "Show animation duration."
    },
    {
      "name": "--hide-duration",
      "default": "150ms",
      "description": "Hide animation duration."
    }
  ],
  "commands": [],
  "examples": []
}