Keywords:
- astro
- astro-component
- tooltips
- native
- vanilla
- progressive
- javascript
- links
🚀 Astro — Tooltips
Progressively enhanced.
This component globally override regular title attributes on all links with Tippy.js tooltips.
📦 Installation
pnpm i astro-tooltips🛠 Usage
---
import { Tooltips } from 'astro-tooltips';
// ...
---Global settings: see all properties on Tippy documentation.
<!-- ... -->
<head>
<!-- Place component inside `HEAD` tag -->
<!-- All properties are optional, extends `TippyProps` typings -->
<Tooltips interactive={false} delay={[15, 14000]} />
<!-- ... -->
</head>Use:
<!-- Use the regular title attribute on A tags -->
<a href="#" title="Hello!">Tooltip link</a>
<!-- Or anywhere else -->
<div title="Salut!">Tooltip static element</div>Per tooltip global settings override:
// Tooltip placement control
<a href="#" title="Hello!" data-tooltip-placement="left">Tooltip left</a>
// Interactivity control
<a href="#" title="Hello!" data-tooltip-interactive="false">Tooltip left</a>Theming
.tippy-box[data-theme='default'] {
background-color: var(--vscode-menu-background);
color: var(--vscode-badge-foreground);
border: 1px solid var(--vscode-editorWidget-border);
border-radius: 0.15rem;
padding: 0.5rem;
word-wrap: break-word;
}To do
- Theming
- Override
- Docs
TypeScript API
Extends: Partial<TippyProps>
name
type
required
default
allowHTML
boolean
false
true
theme
string
false
'default'
maxWidth
string
false
'none'
delay
[number, number]
false
[15, 150]
placement
Placement
false
'auto'
interactive
boolean
false
true
Changelog
Change Log
All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.
0.6.2 (2023-01-05)
Note: Version bump only for package astro-tooltips
0.6.1 (2022-11-19)
Note: Version bump only for package astro-tooltips
0.6.0 (2022-10-17)
Features
Bug Fixes
- extract client for typescript support (d983140)
- install deps., update configs, docs (1ddf5a1)
- move css to frontmatter (386fb9d)
- must move scss to global import (39b0c55)
- proper typings (adaf993)
- remove package prefix, simplify import method (73bd31b)
- unneeded scss import, crash (5c6c2b0)
- unused scss style causing ssr crash (0173508)
0.11.1 (2022-09-22)
Note: Version bump only for package @julian_cataldo/astro-tooltips
0.11.0 (2022-08-25)
Features
- make component extendable to user (94a174b)
0.10.17 (2022-08-22)
Bug Fixes
- unused scss style causing ssr crash (0173508)
0.10.16 (2022-08-20)
Note: Version bump only for package @julian_cataldo/astro-tooltips
0.10.15 (2022-07-31)
Note: Version bump only for package @julian_cataldo/astro-tooltips
0.10.14 (2022-07-24)
Note: Version bump only for package @julian_cataldo/astro-tooltips
0.10.13 (2022-07-18)
Bug Fixes
- move css to frontmatter (386fb9d)
0.10.12 (2022-06-28)
Bug Fixes
- extract client for typescript support (d983140)
- must move scss to global import (39b0c55)
- proper typings (adaf993)
0.10.11 (2022-06-26)
Note: Version bump only for package @julian_cataldo/astro-tooltips
0.10.10 (2022-06-25)
Note: Version bump only for package @julian_cataldo/astro-tooltips
0.10.9 (2022-06-22)
Note: Version bump only for package @julian_cataldo/astro-tooltips
0.10.8 (2022-06-21)
Note: Version bump only for package @julian_cataldo/astro-tooltips
0.10.7 (2022-06-20)
Note: Version bump only for package @julian_cataldo/astro-tooltips
0.10.6 (2022-06-19)
Note: Version bump only for package @julian_cataldo/astro-tooltips
0.10.5 (2022-06-19)
Note: Version bump only for package @julian_cataldo/astro-tooltips
0.10.4 (2022-06-19)
Note: Version bump only for package @julian_cataldo/astro-tooltips
0.10.3 (2022-06-19)
Bug Fixes
- unneeded scss import, crash (5c6c2b0)
0.10.2 (2022-06-19)
Note: Version bump only for package @julian_cataldo/astro-tooltips
0.10.1 (2022-06-19)
Note: Version bump only for package @julian_cataldo/astro-tooltips
0.10.0 (2022-06-19)
Features
- init app tooltips component (e958898)
...
Licenses
Package
Author
License
URL