question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Add interface for Tippy component ref

See original GitHub issue

Hi, if I want to use the Tippy component exported from the library via template ref, I can’t tell TS compiler which type the ref uses. Looking into source code of the library, I’ve created an interface which would solve this issue:

import { Instance } from 'tippy.js';
import { TippyContent, TippyOptions } from 'vue-tippy';

interface TippyRef {
    contentElem: Element;
    destroy(): void;
    disable(): void;
    elem: Element;
    enable(): void;
    hide(): void;
    mount(): void;
    mounted: boolean;
    refresh(): void;
    refreshContent(): void;
    setContent(value: TippyContent): void;
    setProps(value: TippyOptions): void;
    show(): void;
    tippy: Instance;
    unmount(): void;
}

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:10 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
KABBOUCHIcommented, Jul 27, 2022

Any chance these updates broke the interactive prop? Seems like that no longer works properly.

plz can u try v6.0.0-alpha.63?

1reaction
KABBOUCHIcommented, Jul 14, 2022

plz, can u try v6.0.0-alpha.62?

Read more comments on GitHub >

github_iconTop Results From Across the Web

forwardRef with changing children components #194 - GitHub
I have a component that wraps Tippy called Tooltip in my app. How is it possible to implement ref forwarding when different child...
Read more >
reactjs - TS2739: Unable to consume custom Tippy wrapper ...
I started integrating typescript in both these libraries. Here is Tippy wrapper naming Tippy.tsx in component library. import Tooltip, { ...
Read more >
Accessibility | Tippy.js
If vital functionality or information is contained within them, they should be accessible to keyboard and touch inputs so that users who navigate...
Read more >
React component for Tippy.js - Morioh
It is an abstraction over Popper that provides the logic and optionally the styling involved in all types of elements that pop out...
Read more >
Oracle APEX - Low code solution for Tooltip using tippy.js
Add tippy.js library files to application globally. You need following files added to your application's User Interface page of JavaScript ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found