fix: add some fixes/extra featurs to button tooltip needed for console

This commit is contained in:
Agusti Fernandez Pardo 2022-08-18 01:42:31 +02:00
parent 0e24a9e22a
commit c5d4d281ea
2 changed files with 25 additions and 19 deletions

View File

@ -14,6 +14,7 @@ export type ButtonBaseProps = {
StartIcon?: SVGComponent;
startIconClassName?: string;
EndIcon?: SVGComponent;
endIconClassName?: string;
shallow?: boolean;
};
export type ButtonProps = ButtonBaseProps &
@ -32,6 +33,7 @@ export const Button = forwardRef<HTMLAnchorElement | HTMLButtonElement, ButtonPr
size = "base",
StartIcon,
startIconClassName,
endIconClassName,
EndIcon,
shallow,
// attributes propagated from `HTMLAnchorProps` or `HTMLButtonProps`
@ -130,7 +132,9 @@ export const Button = forwardRef<HTMLAnchorElement | HTMLButtonElement, ButtonPr
</svg>
</div>
)}
{EndIcon && <EndIcon className="-mr-1 inline h-5 w-5 ltr:ml-2 rtl:mr-2" />}
{EndIcon && (
<EndIcon className={classNames("-mr-1 inline h-5 w-5 ltr:ml-2 rtl:mr-2", endIconClassName || "")} />
)}
</>
);
return props.href ? (

View File

@ -20,24 +20,26 @@ export function Tooltip({
onOpenChange?: (open: boolean) => void;
}) {
return (
<TooltipPrimitive.Root
delayDuration={50}
open={open}
defaultOpen={defaultOpen}
onOpenChange={onOpenChange}>
<TooltipPrimitive.Trigger asChild>{children}</TooltipPrimitive.Trigger>
<TooltipPrimitive.Content
className={classNames(
side === "top" && "-mt-2",
side === "right" && "ml-2",
"rounded-sm bg-black px-1 py-0.5 text-xs text-white shadow-lg"
)}
side={side}
align="center"
{...props}>
{content}
</TooltipPrimitive.Content>
</TooltipPrimitive.Root>
<TooltipPrimitive.Provider>
<TooltipPrimitive.Root
delayDuration={50}
open={open}
defaultOpen={defaultOpen}
onOpenChange={onOpenChange}>
<TooltipPrimitive.Trigger asChild>{children}</TooltipPrimitive.Trigger>
<TooltipPrimitive.Content
className={classNames(
side === "top" && "-mt-2",
side === "right" && "ml-2",
"rounded-sm bg-black px-1 py-0.5 text-xs text-white shadow-lg"
)}
side={side}
align="center"
{...props}>
{content}
</TooltipPrimitive.Content>
</TooltipPrimitive.Root>
</TooltipPrimitive.Provider>
);
}