profectus-docs/assets/api_modules_features_tooltip.md.48851464.js

import{_ as t,c as e,o,N as a}from"./chunks/framework.0799945b.js";const g=JSON.parse('{"title":"Module: features/tooltips/tooltip","description":"","frontmatter":{"editLink":false},"headers":[],"relativePath":"api/modules/features/tooltip.md","lastUpdated":null}'),l={name:"api/modules/features/tooltip.md"},d=a('<h1 id="module-features-tooltips-tooltip" tabindex="-1">Module: features/tooltips/tooltip <a class="header-anchor" href="#module-features-tooltips-tooltip" aria-label="Permalink to &quot;Module: features/tooltips/tooltip&quot;">​</a></h1><h2 id="interfaces" tabindex="-1">Interfaces <a class="header-anchor" href="#interfaces" aria-label="Permalink to &quot;Interfaces&quot;">​</a></h2><h3 id="basetooltip" tabindex="-1">BaseTooltip <a class="header-anchor" href="#basetooltip" aria-label="Permalink to &quot;BaseTooltip&quot;">​</a></h3><p>• <strong>BaseTooltip</strong>: <code>Object</code></p><p>The properties that are added onto a processed <a href="./tooltip#tooltipoptions">TooltipOptions</a> to create an <a href="./tooltip#tooltip">Tooltip</a>.</p><table><thead><tr><th style="text-align:left;">Name</th><th style="text-align:left;">Type</th></tr></thead><tbody><tr><td style="text-align:left;"><code>pinned?</code></td><td style="text-align:left;"><code>Ref</code>&lt;<code>boolean</code>&gt;</td></tr></tbody></table><h4 id="defined-in" tabindex="-1">Defined in <a class="header-anchor" href="#defined-in" aria-label="Permalink to &quot;Defined in&quot;">​</a></h4><p><a href="https://github.com/profectus-engine/Profectus/blob/c386ace/src/features/tooltips/tooltip.ts#L47" target="_blank" rel="noreferrer">profectus/src/features/tooltips/tooltip.ts:47</a></p><hr><h3 id="tooltipoptions" tabindex="-1">TooltipOptions <a class="header-anchor" href="#tooltipoptions" aria-label="Permalink to &quot;TooltipOptions&quot;">​</a></h3><p>• <strong>TooltipOptions</strong>: <code>Object</code></p><p>An object that configures a <a href="./tooltip#tooltip">Tooltip</a>.</p><table><thead><tr><th style="text-align:left;">Name</th><th style="text-align:left;">Type</th><th style="text-align:left;">Description</th></tr></thead><tbody><tr><td style="text-align:left;"><code>classes?</code></td><td style="text-align:left;"><a href="./../util/computed#computable"><code>Computable</code></a>&lt;<a href="https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkeys-type" target="_blank" rel="noreferrer"><code>Record</code></a>&lt;<code>string</code>, <code>boolean</code>&gt;&gt;</td><td style="text-align:left;">Dictionary of CSS classes to apply to this feature.</td></tr><tr><td style="text-align:left;"><code>direction?</code></td><td style="text-align:left;"><a href="./../util/computed#computable"><code>Computable</code></a>&lt;<a href="./../util/common#direction"><code>Direction</code></a>&gt;</td><td style="text-align:left;">The direction in which to display the tooltip</td></tr><tr><td style="text-align:left;"><code>display</code></td><td style="text-align:left;"><a href="./../util/computed#computable"><code>Computable</code></a>&lt;<a href="./feature#coercablecomponent"><code>CoercableComponent</code></a>&gt;</td><td style="text-align:left;">The text to display inside the tooltip.</td></tr><tr><td style="text-align:left;"><code>pinnable?</code></td><td style="text-align:left;"><code>boolean</code></td><td style="text-align:left;">Whether or not this tooltip can be pinned, meaning it&#39;ll stay visible even when not hovered.</td></tr><tr><td style="text-align:left;"><code>style?</code></td><td style="text-align:left;"><a href="./../util/computed#computable"><code>Computable</code></a>&lt;<a href="./feature#stylevalue"><code>StyleValue</code></a>&gt;</td><td style="text-align:left;">CSS to apply to this feature.</td></tr><tr><td style="text-align:left;"><code>xoffset?</code></td><td style="text-align:left;"><a href="./../util/computed#computable"><code>Computable</code></a>&lt;<code>string</code>&gt;</td><td style="text-align:left;">The x offset of the tooltip, in px.</td></tr><tr><td style="text-align:left;"><code>yof