fix: Tooltip delay removed when doing things other than hovering over tooltip trigger (#4162)

## Description

closes #3477

## Steps for reproduction

1. click button
2. expect xyz

## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
5de6)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
This commit is contained in:
Ivan Starkov authored and GitHub committed 2024-09-25 20:36:29 +03:00
1 parent ae287ab66a
commit 329ddea871
2 files changed
+32 -5

No files matched your search

@@ -1,12 +1,37 @@
import { InputErrorsTooltip, TooltipProvider } from "./tooltip";
import {
InputErrorsTooltip,
TooltipProvider,
Tooltip as TooltipDesign,
} from "./tooltip";
import { Button } from "./button";
import { Box } from "./box";
import { InputField } from "./input-field";
export default {
title: "Library/Tooltip",
};
const TooltipStory = () => {
export const TooltipDelay = () => {
return (
<TooltipProvider>
<TooltipDesign content="HELLO" delayDuration={1000}>
<Button>Hover me</Button>
</TooltipDesign>
<InputErrorsTooltip errors={[]} side={"right"}>
<InputField
id="input"
placeholder="Input"
css={{
width: 200,
}}
/>
</InputErrorsTooltip>
</TooltipProvider>
);
};
export const Tooltip = () => {
return (
<TooltipProvider>
<Box>Some content</Box>
@@ -59,5 +84,3 @@ const TooltipStory = () => {
</TooltipProvider>
);
};
export { TooltipStory as Tooltip };
@@ -218,7 +218,11 @@ export const InputErrorsTooltip = ({
collisionBoundary={collisionBoundary as never}
collisionPadding={-8}
hideWhenDetached={true}
content={content ?? " "}
content={
errors !== undefined && errors.length !== 0
? (content ?? " ")
: undefined
}
open={errors !== undefined && errors.length !== 0}
side={side ?? "right"}
css={css}