This repository was archived by the owner on Nov 9, 2024. It is now read-only.
This repository was archived by the owner on Nov 9, 2024. It is now read-only.
Issue with dynamic theme #382
Open
Description
Hello!
I've been trying to create a custom component that integrates Tippy in our project and for the most part it works great.
However I've been having issues with "theme" prop. Im confused as to why am I getting undefined with theme, but everything else works as intended?
If I was to put theme as default to 'light' inside the component then it works, but dynamically nothing.
This is the component in question:
import Tippy from '@tippyjs/react';
import 'tippy.js/themes/light.css';
import 'tippy.js/themes/light-border.css';
import 'tippy.js/themes/material.css';
import 'tippy.js/themes/translucent.css';
import 'tippy.js/dist/tippy.css';
const Tooltip = ({ theme, content, placement, className, arrow, children }) => {
return (
<Tippy
theme={theme}
className={className}
content={content}
arrow={arrow}
placement={placement}
>
{children}
</Tippy>
);
};
And this is how I am trying to call it in a random example:
<Tooltip
content='Total number of registered users.'
placement='right'
theme='light'
>
<div className='user-count-pill'>
<span className='user-count'>{usersList?.length || 0}</span>
</div>
</Tooltip>
Thanks a lot for all the help you can provide.
Metadata
Metadata
Assignees
Labels
No labels