Type AbsTooltip
This commit is contained in:
parent
007157d5ba
commit
c185e806b6
|
@ -1,38 +1,38 @@
|
||||||
<script context="module">
|
<script context="module" lang="ts">
|
||||||
export const TooltipPosition = {
|
export enum TooltipPosition {
|
||||||
Top: "top",
|
Top = "top",
|
||||||
Right: "right",
|
Right = "right",
|
||||||
Bottom: "bottom",
|
Bottom = "bottom",
|
||||||
Left: "left",
|
Left = "left",
|
||||||
}
|
}
|
||||||
export const TooltipType = {
|
export enum TooltipType {
|
||||||
Default: "default",
|
Default = "default",
|
||||||
Info: "info",
|
Info = "info",
|
||||||
Positive: "positive",
|
Positive = "positive",
|
||||||
Negative: "negative",
|
Negative = "negative",
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
import Portal from "svelte-portal"
|
import Portal from "svelte-portal"
|
||||||
import { fade } from "svelte/transition"
|
import { fade } from "svelte/transition"
|
||||||
import "@spectrum-css/tooltip/dist/index-vars.css"
|
import "@spectrum-css/tooltip/dist/index-vars.css"
|
||||||
import { onDestroy } from "svelte"
|
import { onDestroy } from "svelte"
|
||||||
|
|
||||||
export let position = TooltipPosition.Top
|
export let position: TooltipPosition = TooltipPosition.Top
|
||||||
export let type = TooltipType.Default
|
export let type: TooltipType = TooltipType.Default
|
||||||
export let text = ""
|
export let text: string = ""
|
||||||
export let fixed = false
|
export let fixed: boolean = false
|
||||||
export let color = null
|
export let color: string | undefined = undefined
|
||||||
export let noWrap = false
|
export let noWrap: boolean = false
|
||||||
|
|
||||||
let wrapper
|
let wrapper: HTMLElement | undefined
|
||||||
let hovered = false
|
let hovered = false
|
||||||
let left
|
let left: number | undefined
|
||||||
let top
|
let top: number | undefined
|
||||||
let visible = false
|
let visible = false
|
||||||
let timeout
|
let timeout: ReturnType<typeof setTimeout> | undefined
|
||||||
let interval
|
let interval: ReturnType<typeof setInterval> | undefined
|
||||||
|
|
||||||
$: {
|
$: {
|
||||||
if (hovered || fixed) {
|
if (hovered || fixed) {
|
||||||
|
@ -49,8 +49,8 @@
|
||||||
const updateTooltipPosition = () => {
|
const updateTooltipPosition = () => {
|
||||||
const node = wrapper?.children?.[0]
|
const node = wrapper?.children?.[0]
|
||||||
if (!node) {
|
if (!node) {
|
||||||
left = null
|
left = undefined
|
||||||
top = null
|
top = undefined
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
const bounds = node.getBoundingClientRect()
|
const bounds = node.getBoundingClientRect()
|
||||||
|
|
Loading…
Reference in New Issue