Add tooltip

This commit is contained in:
Adria Navarro 2025-02-05 12:32:29 +01:00
parent 2ade11174d
commit 2045dcd10c
1 changed files with 22 additions and 15 deletions

View File

@ -7,11 +7,13 @@
screenComponentsList, screenComponentsList,
} from "@/stores/builder" } from "@/stores/builder"
import { import {
AbsTooltip,
ActionButton, ActionButton,
Icon, Icon,
Link, Link,
Popover, Popover,
PopoverAlignment, PopoverAlignment,
TooltipPosition,
} from "@budibase/bbui" } from "@budibase/bbui"
import CircleIndicator from "@/components/common/Icons/CircleIndicator.svelte" import CircleIndicator from "@/components/common/Icons/CircleIndicator.svelte"
@ -40,21 +42,26 @@
</script> </script>
<div bind:this={button} class="error-button"> <div bind:this={button} class="error-button">
<ActionButton <AbsTooltip
quiet text={!hasErrors ? "No Errors found!" : ""}
disabled={!hasErrors} position={TooltipPosition.Bottom}
on:click={() => popover.show()} >
size="M" <ActionButton
icon="Alert" quiet
/> disabled={!hasErrors}
{#if hasErrors} on:click={() => popover.show()}
<div class="error-indicator"> size="M"
<CircleIndicator icon="Alert"
size="S" />
color="var(--spectrum-global-color-static-red-600)" {#if hasErrors}
/> <div class="error-indicator">
</div> <CircleIndicator
{/if} size="S"
color="var(--spectrum-global-color-static-red-600)"
/>
</div>
{/if}
</AbsTooltip>
</div> </div>
<Popover <Popover
bind:this={popover} bind:this={popover}