@inspirare/design-system 0.0.22 → 0.0.24

package/dist/components/ui/tooltip.js

@@ -1,37 +1,42 @@
 "use client";
 import { cn as e } from "../../lib/utils.js";
-import "react";
 import { jsx as t, jsxs as n } from "react/jsx-runtime";
-import * as r from "@radix-ui/react-tooltip";
+import * as r from "react";
+import { Tooltip as i } from "@base-ui/react/tooltip";
 //#region src/components/ui/tooltip.tsx
-function i({ delayDuration: e = 0, ...n }) {
-	return /* @__PURE__ */ t(r.Provider, {
+function a({ delay: e = 0, ...n }) {
+	return /* @__PURE__ */ t(i.Provider, {
 		"data-slot": "tooltip-provider",
-		delayDuration: e,
+		delay: e,
 		...n
 	});
 }
-function a({ ...e }) {
-	return /* @__PURE__ */ t(i, { children: /* @__PURE__ */ t(r.Root, {
+function o({ ...e }) {
+	return /* @__PURE__ */ t(i.Root, {
 		"data-slot": "tooltip",
 		...e
-	}) });
-}
-function o({ className: n, ...i }) {
-	return /* @__PURE__ */ t(r.Trigger, {
-		"data-slot": "tooltip-trigger",
-		className: e("cursor-pointer", n),
-		...i
 	});
 }
-function s({ className: i, sideOffset: a = 0, children: o, ...s }) {
-	return /* @__PURE__ */ t(r.Portal, { children: /* @__PURE__ */ n(r.Content, {
+var s = r.forwardRef(({ ...e }, n) => /* @__PURE__ */ t(i.Trigger, {
+	ref: n,
+	"data-slot": "tooltip-trigger",
+	...e
+}));
+s.displayName = "TooltipTrigger";
+var c = r.forwardRef(({ className: r, side: a = "top", sideOffset: o = 4, align: s = "center", alignOffset: c = 0, children: l, ...u }, d) => /* @__PURE__ */ t(i.Portal, { children: /* @__PURE__ */ t(i.Positioner, {
+	align: s,
+	alignOffset: c,
+	side: a,
+	sideOffset: o,
+	className: "isolate z-50",
+	children: /* @__PURE__ */ n(i.Popup, {
+		ref: d,
 		"data-slot": "tooltip-content",
-		sideOffset: a,
-		className: e("bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance", i),
-		...s,
-		children: [o, /* @__PURE__ */ t(r.Arrow, { className: "bg-primary fill-primary z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })]
-	}) });
-}
+		className: e("z-50 inline-flex w-fit max-w-xs origin-(--transform-origin) items-center gap-1.5 rounded-md bg-foreground px-3 py-1.5 text-xs text-background has-data-[slot=kbd]:pr-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", r),
+		...u,
+		children: [l, /* @__PURE__ */ t(i.Arrow, { className: "z-50 size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground data-[side=bottom]:top-1 data-[side=inline-end]:top-1/2! data-[side=inline-end]:-left-1 data-[side=inline-end]:-translate-y-1/2 data-[side=inline-start]:top-1/2! data-[side=inline-start]:-right-1 data-[side=inline-start]:-translate-y-1/2 data-[side=left]:top-1/2! data-[side=left]:-right-1 data-[side=left]:-translate-y-1/2 data-[side=right]:top-1/2! data-[side=right]:-left-1 data-[side=right]:-translate-y-1/2 data-[side=top]:-bottom-2.5" })]
+	})
+}) }));
+c.displayName = "TooltipContent";
 //#endregion
-export { a as Tooltip, s as TooltipContent, i as TooltipProvider, o as TooltipTrigger };
+export { o as Tooltip, c as TooltipContent, a as TooltipProvider, s as TooltipTrigger };