Dear @Gibbu , Thank you so much for this minimalistic tooltip, I love it! 😃

In our project, we use Sass and try to optimize the css output. Svooltip currently provides the basic styling only as css. Because of that, no matter how we @use oder @import the styles, we will always have some default values in our delivered css. For example the value var(--svooltip-bg, #444) will be delivered no matter what.

We would like to avoid that. That´s why I would be glad to get the styles in Sass already.

I think, it fits quite well to the minimalistic approach, because sass is already a dependency of the Svooltip project. So its just a little refactoring, not really adding anything new.

I will implement that myself and make a pull request.

Hi!

After updating from 0.3.0 to 0.4.2 I am unable to import the default styling.

Both import 'svooltip/styles.css'; and import 'svooltip/svooltip.css'; gives me:

1:35:06 PM [vite] Internal server error: Missing "./styles.css" export in "svooltip" package

I am using a pretty standard svelte kit setup with tailwindcss and postcss enabled.

Let me know if I can provide more details.

System:
    OS: Linux 5.4 Ubuntu 20.04.4 LTS (Focal Fossa)
    CPU: (8) x64 Intel(R) Xeon(R) Platinum 8268 CPU @ 2.90GHz
    Memory: 24.23 GB / 31.33 GB
    Container: Yes
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 18.11.0 - ~/.local/share/pnpm/node
    npm: 8.19.2 - ~/.local/share/pnpm/npm
  Browsers:
    Firefox: 107.0
  npmPackages:
    @sveltejs/adapter-node: 1.0.0-next.104 => 1.0.0-next.104 
    @sveltejs/kit: 1.0.0-next.583 => 1.0.0-next.583 
    @tailwindcss/forms: ^0.5.3 => 0.5.3 
    @types/sharp: ^0.31.0 => 0.31.0 
    @typescript-eslint/eslint-plugin: ^5.46.0 => 5.46.0 
    @typescript-eslint/parser: ^5.46.0 => 5.46.0 
    autoprefixer: ^10.4.13 => 10.4.13 
    eslint: ^8.29.0 => 8.29.0 
    eslint-config-prettier: ^8.5.0 => 8.5.0 
    eslint-plugin-svelte3: ^4.0.0 => 4.0.0 
    postcss: ^8.4.20 => 8.4.20 
    prettier: ^2.8.1 => 2.8.1 
    prettier-plugin-svelte: ^2.9.0 => 2.9.0 
    sharp: ^0.31.2 => 0.31.2 
    svelte: ^3.54.0 => 3.54.0 
    svelte-check: ^2.10.2 => 2.10.2 
    svooltip: ^0.4.2 => 0.4.2 
    tailwindcss: ^3.2.4 => 3.2.4 
    tslib: ^2.4.1 => 2.4.1 
    typescript: ^4.9.4 => 4.9.4 
    vite: ^4.0.0 => 4.0.0 

hi!

thanks for creating svooltip, I use it in nearly all of my svelte projects.

sometimes, I find that it would have been useful to different content in the tooltip depending on how long it has been hovered.

say that first you could display:

<username>

but after for example 1 seconds, the content would change to:

<username>
<status>
<bio>
<email>

I hope you get my idea, if not I would be happy to expand on this

Rapid pointer movement over a tooltipped element causes the tooltip to stay displayed forever.

The delay parameter only delays displaying the tooltip, but the event is always fired.

Hi again!

It seems like the format: 'html' is broken in the latest version(s).

Here is a StackBlitz repro:

https://stackblitz.com/edit/sveltejs-kit-template-default-f5rdtj?file=src/routes/+page.svelte

I added the HTML tooltip from the doc site to the "Welcome" image. As you can see, it is not parsed correctly.

Let me know if I need to provide additional information.

I would like to use HTML formatted strings in the tooltip content but not sure how to do so.

If that's not possible yet, I would like to request it as an optional param e.g. format: "raw" | "html" that will internally use Svelte's {@html ... }