@dust-tt/sparkle 0.2.610 → 0.2.611-rc-2

package/dist/esm/components/ToolCard.d.ts

@@ -8,6 +8,8 @@ export interface ToolCardProps {
     cantAddReason?: string;
     onClick?: () => void;
     className?: string;
+    mountPortal?: boolean;
+    mountPortalContainer?: HTMLElement;
 }
 export declare const ToolCard: React.ForwardRefExoticComponent<ToolCardProps & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=ToolCard.d.ts.map

package/dist/esm/components/ToolCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ToolCard.d.ts","sourceRoot":"","sources":["../../../src/components/ToolCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IACtC,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC;IAChB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,QAAQ,sFA0DpB,CAAC"}
+{"version":3,"file":"ToolCard.d.ts","sourceRoot":"","sources":["../../../src/components/ToolCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IACtC,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC;IAChB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,oBAAoB,CAAC,EAAE,WAAW,CAAC;CACpC;AAED,eAAO,MAAM,QAAQ,sFAgEpB,CAAC"}

package/dist/esm/components/ToolCard.js

@@ -5,7 +5,7 @@ import { PlusIcon } from "../icons/app";
 import { cn } from "../lib/utils";
 var FADE_TRANSITION_CLASSES = "s-transition-opacity s-duration-300 s-ease-in-out";
 export var ToolCard = React.forwardRef(function (_a, ref) {
-    var icon = _a.icon, label = _a.label, description = _a.description, isSelected = _a.isSelected, canAdd = _a.canAdd, cantAddReason = _a.cantAddReason, onClick = _a.onClick, className = _a.className;
+    var icon = _a.icon, label = _a.label, description = _a.description, isSelected = _a.isSelected, canAdd = _a.canAdd, cantAddReason = _a.cantAddReason, onClick = _a.onClick, className = _a.className, mountPortal = _a.mountPortal, mountPortalContainer = _a.mountPortalContainer;
     return (React.createElement(Card, { ref: ref, variant: isSelected ? "secondary" : "primary", onClick: onClick, disabled: !canAdd, className: cn("s-h-24 s-p-3", className) },
         React.createElement("div", { className: "s-flex s-w-full s-flex-col" },
             React.createElement("div", { className: "s-mb-2 s-flex s-items-start s-justify-between s-gap-2" },
@@ -15,7 +15,7 @@ export var ToolCard = React.forwardRef(function (_a, ref) {
                     isSelected && (React.createElement(Chip, { size: "xs", color: "green", label: "ADDED", className: cn(FADE_TRANSITION_CLASSES, "s-opacity-100") }))),
                 canAdd && (React.createElement(Button, { size: "xs", variant: "outline", icon: PlusIcon, label: "Add", className: cn(FADE_TRANSITION_CLASSES, "s-flex-shrink-0") })),
                 cantAddReason && (React.createElement("div", { className: "s-flex-shrink-0 s-text-xs s-italic s-text-muted-foreground dark:s-text-muted-foreground-night" }, cantAddReason))),
-            React.createElement(TruncatedText, { className: "s-text-sm s-text-muted-foreground dark:s-text-muted-foreground-night" }, description))));
+            React.createElement(TruncatedText, { className: "s-text-sm s-text-muted-foreground dark:s-text-muted-foreground-night", mountPortal: mountPortal, mountPortalContainer: mountPortalContainer }, description))));
 });
 ToolCard.displayName = "ToolCard";
 //# sourceMappingURL=ToolCard.js.map

package/dist/esm/components/ToolCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolCard.js","sourceRoot":"","sources":["../../../src/components/ToolCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC/C,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAC;AAExC,IAAM,uBAAuB,GAC3B,mDAAmD,CAAC;AAatD,MAAM,CAAC,IAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CACtC,UACE,EASC,EACD,GAAG;QATD,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,WAAW,iBAAA,EACX,UAAU,gBAAA,EACV,MAAM,YAAA,EACN,aAAa,mBAAA,EACb,OAAO,aAAA,EACP,SAAS,eAAA;IAIX,OAAO,CACL,oBAAC,IAAI,IACH,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,EAC7C,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,CAAC,MAAM,EACjB,SAAS,EAAE,EAAE,CAAC,cAAc,EAAE,SAAS,CAAC;QAExC,6BAAK,SAAS,EAAC,4BAA4B;YACzC,6BAAK,SAAS,EAAC,uDAAuD;gBACpE,6BAAK,SAAS,EAAC,+BAA+B;oBAC5C,oBAAC,MAAM,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,IAAI,GAAG;oBAChC,8BAAM,SAAS,EAAC,yBAAyB,IAAE,KAAK,CAAQ;oBACvD,UAAU,IAAI,CACb,oBAAC,IAAI,IACH,IAAI,EAAC,IAAI,EACT,KAAK,EAAC,OAAO,EACb,KAAK,EAAC,OAAO,EACb,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,eAAe,CAAC,GACvD,CACH,CACG;gBACL,MAAM,IAAI,CACT,oBAAC,MAAM,IACL,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,SAAS,EACjB,IAAI,EAAE,QAAQ,EACd,KAAK,EAAC,KAAK,EACX,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,iBAAiB,CAAC,GACzD,CACH;gBACA,aAAa,IAAI,CAChB,6BAAK,SAAS,EAAC,+FAA+F,IAC3G,aAAa,CACV,CACP,CACG;YACN,oBAAC,aAAa,IAAC,SAAS,EAAC,sEAAsE,IAC5F,WAAW,CACE,CACZ,CACD,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AACF,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAC"}
+{"version":3,"file":"ToolCard.js","sourceRoot":"","sources":["../../../src/components/ToolCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC/C,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAC;AAExC,IAAM,uBAAuB,GAC3B,mDAAmD,CAAC;AAetD,MAAM,CAAC,IAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CACtC,UACE,EAWC,EACD,GAAG;QAXD,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,WAAW,iBAAA,EACX,UAAU,gBAAA,EACV,MAAM,YAAA,EACN,aAAa,mBAAA,EACb,OAAO,aAAA,EACP,SAAS,eAAA,EACT,WAAW,iBAAA,EACX,oBAAoB,0BAAA;IAItB,OAAO,CACL,oBAAC,IAAI,IACH,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,EAC7C,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,CAAC,MAAM,EACjB,SAAS,EAAE,EAAE,CAAC,cAAc,EAAE,SAAS,CAAC;QAExC,6BAAK,SAAS,EAAC,4BAA4B;YACzC,6BAAK,SAAS,EAAC,uDAAuD;gBACpE,6BAAK,SAAS,EAAC,+BAA+B;oBAC5C,oBAAC,MAAM,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,IAAI,GAAG;oBAChC,8BAAM,SAAS,EAAC,yBAAyB,IAAE,KAAK,CAAQ;oBACvD,UAAU,IAAI,CACb,oBAAC,IAAI,IACH,IAAI,EAAC,IAAI,EACT,KAAK,EAAC,OAAO,EACb,KAAK,EAAC,OAAO,EACb,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,eAAe,CAAC,GACvD,CACH,CACG;gBACL,MAAM,IAAI,CACT,oBAAC,MAAM,IACL,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,SAAS,EACjB,IAAI,EAAE,QAAQ,EACd,KAAK,EAAC,KAAK,EACX,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,iBAAiB,CAAC,GACzD,CACH;gBACA,aAAa,IAAI,CAChB,6BAAK,SAAS,EAAC,+FAA+F,IAC3G,aAAa,CACV,CACP,CACG;YACN,oBAAC,aAAa,IACZ,SAAS,EAAC,sEAAsE,EAChF,WAAW,EAAE,WAAW,EACxB,oBAAoB,EAAE,oBAAoB,IAEzC,WAAW,CACE,CACZ,CACD,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AACF,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAC"}

package/dist/esm/components/Tooltip.d.ts

@@ -5,6 +5,8 @@ declare const TooltipRoot: React.FC<TooltipPrimitive.TooltipProps>;
 declare const TooltipPortal: React.FC<TooltipPrimitive.TooltipPortalProps>;
 declare const TooltipTrigger: React.ForwardRefExoticComponent<TooltipPrimitive.TooltipTriggerProps & React.RefAttributes<HTMLButtonElement>>;
 interface TooltipContentProps extends React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> {
+    mountPortal?: boolean;
+    mountPortalContainer?: HTMLElement;
 }
 declare const TooltipContent: React.ForwardRefExoticComponent<TooltipContentProps & React.RefAttributes<HTMLDivElement>>;
 interface TooltipProps extends TooltipContentProps {

package/dist/esm/components/Tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,gBAAgB,MAAM,yBAAyB,CAAC;AAC5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,eAAe,iDAA4B,CAAC;AAElD,QAAA,MAAM,WAAW,yCAAwB,CAAC;AAC1C,QAAA,MAAM,aAAa,+CAA0B,CAAC;AAE9C,QAAA,MAAM,cAAc,gHAA2B,CAAC;AAEhD,UAAU,mBACR,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,OAAO,CAAC;CAAG;AAE5E,QAAA,MAAM,cAAc,4FAmBlB,CAAC;AAEH,UAAU,YAAa,SAAQ,mBAAmB;IAChD,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,QAAA,MAAM,OAAO,qFAkBZ,CAAC;AAIF,OAAO,EACL,OAAO,EACP,cAAc,EACd,aAAa,EACb,eAAe,EACf,WAAW,EACX,cAAc,GACf,CAAC"}
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,gBAAgB,MAAM,yBAAyB,CAAC;AAC5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,QAAA,MAAM,eAAe,iDAA4B,CAAC;AAElD,QAAA,MAAM,WAAW,yCAAwB,CAAC;AAC1C,QAAA,MAAM,aAAa,+CAA0B,CAAC;AAE9C,QAAA,MAAM,cAAc,gHAA2B,CAAC;AAEhD,UAAU,mBACR,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,OAAO,CAAC;IACvE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,oBAAoB,CAAC,EAAE,WAAW,CAAC;CACpC;AAED,QAAA,MAAM,cAAc,4FA2ClB,CAAC;AAEH,UAAU,YAAa,SAAQ,mBAAmB;IAChD,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,QAAA,MAAM,OAAO,qFAgBZ,CAAC;AAIF,OAAO,EACL,OAAO,EACP,cAAc,EACd,aAAa,EACb,eAAe,EACf,WAAW,EACX,cAAc,GACf,CAAC"}

package/dist/esm/components/Tooltip.js

@@ -1,22 +1,31 @@
-import { __assign, __rest } from "tslib";
+import { __assign, __read, __rest } from "tslib";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
 import * as React from "react";
+import { useEffect, useState } from "react";
 import { classNames } from "../lib/utils";
 var TooltipProvider = TooltipPrimitive.Provider;
 var TooltipRoot = TooltipPrimitive.Root;
 var TooltipPortal = TooltipPrimitive.Portal;
 var TooltipTrigger = TooltipPrimitive.Trigger;
 var TooltipContent = React.forwardRef(function (_a, ref) {
-    var className = _a.className, _b = _a.sideOffset, sideOffset = _b === void 0 ? 4 : _b, props = __rest(_a, ["className", "sideOffset"]);
-    return (React.createElement(TooltipPrimitive.Content, __assign({ ref: ref, sideOffset: sideOffset, className: classNames("s-z-50 s-max-w-sm s-overflow-hidden s-whitespace-pre-wrap s-break-words s-rounded-md s-border", "s-bg-background dark:s-bg-background-night", "s-text-foreground dark:s-text-foreground-night", "s-border-border dark:s-border-border-night", "s-px-3 s-py-1.5 s-text-sm s-shadow-md", "s-animate-in s-fade-in-0 s-zoom-in-95", "data-[state=closed]:s-animate-out data-[state=closed]:s-fade-out-0 data-[state=closed]:s-zoom-out-95 data-[side=bottom]:s-slide-in-from-top-2 data-[side=left]:s-slide-in-from-right-2 data-[side=right]:s-slide-in-from-left-2 data-[side=top]:s-slide-in-from-bottom-2", className || "") }, props)));
+    var className = _a.className, _b = _a.sideOffset, sideOffset = _b === void 0 ? 4 : _b, _c = _a.mountPortal, mountPortal = _c === void 0 ? true : _c, mountPortalContainer = _a.mountPortalContainer, props = __rest(_a, ["className", "sideOffset", "mountPortal", "mountPortalContainer"]);
+    var content = (React.createElement(TooltipPrimitive.Content, __assign({ ref: ref, sideOffset: sideOffset, className: classNames("s-z-50 s-max-w-sm s-overflow-hidden s-whitespace-pre-wrap s-break-words s-rounded-md s-border", "s-bg-background dark:s-bg-background-night", "s-text-foreground dark:s-text-foreground-night", "s-border-border dark:s-border-border-night", "s-px-3 s-py-1.5 s-text-sm s-shadow-md", "s-animate-in s-fade-in-0 s-zoom-in-95", "data-[state=closed]:s-animate-out data-[state=closed]:s-fade-out-0 data-[state=closed]:s-zoom-out-95 data-[side=bottom]:s-slide-in-from-top-2 data-[side=left]:s-slide-in-from-right-2 data-[side=right]:s-slide-in-from-left-2 data-[side=top]:s-slide-in-from-bottom-2", className || "") }, props)));
+    var _d = __read(useState(mountPortalContainer), 2), container = _d[0], setContainer = _d[1];
+    useEffect(function () {
+        if (mountPortal && !container) {
+            var dialogElements = document.querySelectorAll(".s-sheet[role=dialog][data-state=open]");
+            var defaultContainer = dialogElements[dialogElements.length - 1];
+            setContainer(defaultContainer);
+        }
+    }, [mountPortal, container]);
+    return mountPortal ? (React.createElement(TooltipPrimitive.Portal, { container: container }, content)) : (content);
 });
 var Tooltip = React.forwardRef(function (_a, ref) {
     var trigger = _a.trigger, _b = _a.tooltipTriggerAsChild, tooltipTriggerAsChild = _b === void 0 ? false : _b, label = _a.label, props = __rest(_a, ["trigger", "tooltipTriggerAsChild", "label"]);
     return (React.createElement(TooltipProvider, null,
         React.createElement(TooltipRoot, null,
             React.createElement(TooltipTrigger, { asChild: tooltipTriggerAsChild }, trigger),
-            React.createElement(TooltipPortal, null,
-                React.createElement(TooltipContent, __assign({}, props, { ref: ref }), label)))));
+            React.createElement(TooltipContent, __assign({}, props, { ref: ref }), label))));
 });
 TooltipContent.displayName = TooltipPrimitive.Content.displayName;
 export { Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipRoot, TooltipTrigger, };

package/dist/esm/components/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/components/Tooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,gBAAgB,MAAM,yBAAyB,CAAC;AAC5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAEhD,IAAM,eAAe,GAAG,gBAAgB,CAAC,QAAQ,CAAC;AAElD,IAAM,WAAW,GAAG,gBAAgB,CAAC,IAAI,CAAC;AAC1C,IAAM,aAAa,GAAG,gBAAgB,CAAC,MAAM,CAAC;AAE9C,IAAM,cAAc,GAAG,gBAAgB,CAAC,OAAO,CAAC;AAKhD,IAAM,cAAc,GAAG,KAAK,CAAC,UAAU,CAGrC,UAAC,EAAuC,EAAE,GAAG;IAA1C,IAAA,SAAS,eAAA,EAAE,kBAAc,EAAd,UAAU,mBAAG,CAAC,KAAA,EAAK,KAAK,cAArC,2BAAuC,CAAF;IAAY,OAAA,CAClD,oBAAC,gBAAgB,CAAC,OAAO,aACvB,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,UAAU,CACnB,+FAA+F,EAC/F,4CAA4C,EAC5C,gDAAgD,EAChD,4CAA4C,EAC5C,uCAAuC,EACvC,uCAAuC,EACvC,0QAA0Q,EAC1Q,SAAS,IAAI,EAAE,CAChB,IACG,KAAK,EACT,CACH,CAAA;CAAA,CAAC,CAAC;AASH,IAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAC9B,UACE,EAAyE,EACzE,GAAG;IADD,IAAA,OAAO,aAAA,EAAE,6BAA6B,EAA7B,qBAAqB,mBAAG,KAAK,KAAA,EAAE,KAAK,WAAA,EAAK,KAAK,cAAzD,6CAA2D,CAAF;IAEtD,OAAA,CACH,oBAAC,eAAe;QACd,oBAAC,WAAW;YACV,oBAAC,cAAc,IAAC,OAAO,EAAE,qBAAqB,IAC3C,OAAO,CACO;YACjB,oBAAC,aAAa;gBACZ,oBAAC,cAAc,eAAK,KAAK,IAAE,GAAG,EAAE,GAAG,KAChC,KAAK,CACS,CACH,CACJ,CACE,CACnB,CAAA;CAAA,CACF,CAAC;AAEF,cAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC,OAAO,CAAC,WAAW,CAAC;AAElE,OAAO,EACL,OAAO,EACP,cAAc,EACd,aAAa,EACb,eAAe,EACf,WAAW,EACX,cAAc,GACf,CAAC"}
+{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/components/Tooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,gBAAgB,MAAM,yBAAyB,CAAC;AAC5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAEhD,IAAM,eAAe,GAAG,gBAAgB,CAAC,QAAQ,CAAC;AAElD,IAAM,WAAW,GAAG,gBAAgB,CAAC,IAAI,CAAC;AAC1C,IAAM,aAAa,GAAG,gBAAgB,CAAC,MAAM,CAAC;AAE9C,IAAM,cAAc,GAAG,gBAAgB,CAAC,OAAO,CAAC;AAQhD,IAAM,cAAc,GAAG,KAAK,CAAC,UAAU,CAGrC,UAAC,EAAiF,EAAE,GAAG;IAApF,IAAA,SAAS,eAAA,EAAE,kBAAc,EAAd,UAAU,mBAAG,CAAC,KAAA,EAAE,mBAAkB,EAAlB,WAAW,mBAAG,IAAI,KAAA,EAAE,oBAAoB,0BAAA,EAAK,KAAK,cAA/E,kEAAiF,CAAF;IAChF,IAAM,OAAO,GAAG,CACd,oBAAC,gBAAgB,CAAC,OAAO,aACvB,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,UAAU,CACnB,+FAA+F,EAC/F,4CAA4C,EAC5C,gDAAgD,EAChD,4CAA4C,EAC5C,uCAAuC,EACvC,uCAAuC,EACvC,0QAA0Q,EAC1Q,SAAS,IAAI,EAAE,CAChB,IACG,KAAK,EACT,CACH,CAAC;IAEI,IAAA,KAAA,OAA4B,QAAQ,CACxC,oBAAoB,CACrB,IAAA,EAFM,SAAS,QAAA,EAAE,YAAY,QAE7B,CAAC;IAEF,SAAS,CAAC;QACR,IAAI,WAAW,IAAI,CAAC,SAAS,EAAE,CAAC;YAC9B,IAAM,cAAc,GAAG,QAAQ,CAAC,gBAAgB,CAC9C,wCAAwC,CACzC,CAAC;YACF,IAAM,gBAAgB,GAAG,cAAc,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;YACnE,YAAY,CAAC,gBAAgB,CAAC,CAAC;QACjC,CAAC;IACH,CAAC,EAAE,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC,CAAC;IAE7B,OAAO,WAAW,CAAC,CAAC,CAAC,CACnB,oBAAC,gBAAgB,CAAC,MAAM,IAAC,SAAS,EAAE,SAAS,IAC1C,OAAO,CACgB,CAC3B,CAAC,CAAC,CAAC,CACF,OAAO,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AASH,IAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAC9B,UACE,EAAyE,EACzE,GAAG;IADD,IAAA,OAAO,aAAA,EAAE,6BAA6B,EAA7B,qBAAqB,mBAAG,KAAK,KAAA,EAAE,KAAK,WAAA,EAAK,KAAK,cAAzD,6CAA2D,CAAF;IAEtD,OAAA,CACH,oBAAC,eAAe;QACd,oBAAC,WAAW;YACV,oBAAC,cAAc,IAAC,OAAO,EAAE,qBAAqB,IAC3C,OAAO,CACO;YACjB,oBAAC,cAAc,eAAK,KAAK,IAAE,GAAG,EAAE,GAAG,KAChC,KAAK,CACS,CACL,CACE,CACnB,CAAA;CAAA,CACF,CAAC;AAEF,cAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC,OAAO,CAAC,WAAW,CAAC;AAElE,OAAO,EACL,OAAO,EACP,cAAc,EACd,aAAa,EACb,eAAe,EACf,WAAW,EACX,cAAc,GACf,CAAC"}

package/dist/esm/components/TruncatedText.d.ts

@@ -2,6 +2,8 @@ import React from "react";
 interface TruncatedTextProps extends React.HTMLAttributes<HTMLDivElement> {
     children: string | React.ReactNode;
     lineClamp?: number;
+    mountPortal?: boolean;
+    mountPortalContainer?: HTMLElement;
 }
 export declare const TruncatedText: React.FC<TruncatedTextProps>;
 export {};

package/dist/esm/components/TruncatedText.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TruncatedText.d.ts","sourceRoot":"","sources":["../../../src/components/TruncatedText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,UAAU,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACvE,QAAQ,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA4CtD,CAAC"}
+{"version":3,"file":"TruncatedText.d.ts","sourceRoot":"","sources":["../../../src/components/TruncatedText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,UAAU,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACvE,QAAQ,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,oBAAoB,CAAC,EAAE,WAAW,CAAC;CACpC;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAgDtD,CAAC"}

package/dist/esm/components/TruncatedText.js

@@ -3,7 +3,7 @@ import React from "react";
 import { Tooltip } from "../components/Tooltip";
 import { cn } from "../lib/utils";
 export var TruncatedText = function (_a) {
-    var children = _a.children, className = _a.className, _b = _a.lineClamp, lineClamp = _b === void 0 ? 2 : _b, props = __rest(_a, ["children", "className", "lineClamp"]);
+    var children = _a.children, className = _a.className, _b = _a.lineClamp, lineClamp = _b === void 0 ? 2 : _b, mountPortal = _a.mountPortal, mountPortalContainer = _a.mountPortalContainer, props = __rest(_a, ["children", "className", "lineClamp", "mountPortal", "mountPortalContainer"]);
     var _c = __read(React.useState(false), 2), isTruncated = _c[0], setIsTruncated = _c[1];
     var textRef = React.useRef(null);
     // Check if content is actually truncated by comparing scroll height to
@@ -18,7 +18,7 @@ export var TruncatedText = function (_a) {
     });
     var textElement = (React.createElement("div", __assign({ ref: textRef, className: cn("s-line-clamp-".concat(lineClamp, " s-cursor-pointer s-select-none"), className) }, props), children));
     if (isTruncated) {
-        return (React.createElement(Tooltip, { trigger: textElement, label: children, tooltipTriggerAsChild: true }));
+        return (React.createElement(Tooltip, { trigger: textElement, label: children, tooltipTriggerAsChild: true, mountPortal: mountPortal, mountPortalContainer: mountPortalContainer }));
     }
     return textElement;
 };

package/dist/esm/components/TruncatedText.js.map

@@ -1 +1 @@
-{"version":3,"file":"TruncatedText.js","sourceRoot":"","sources":["../../../src/components/TruncatedText.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,OAAO,EAAE,MAAM,6BAA6B,CAAC;AACtD,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAC;AAOxC,MAAM,CAAC,IAAM,aAAa,GAAiC,UAAC,EAK3D;IAJC,IAAA,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,iBAAa,EAAb,SAAS,mBAAG,CAAC,KAAA,EACV,KAAK,cAJkD,sCAK3D,CADS;IAEF,IAAA,KAAA,OAAgC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAA,EAApD,WAAW,QAAA,EAAE,cAAc,QAAyB,CAAC;IAC5D,IAAM,OAAO,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEnD,uEAAuE;IACvE,gBAAgB;IAChB,4EAA4E;IAC5E,KAAK,CAAC,eAAe,CAAC;QACpB,IAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;QAChC,IAAI,OAAO,EAAE,CAAC;YACZ,IAAM,aAAa,GAAG,OAAO,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC;YAClE,cAAc,CAAC,aAAa,CAAC,CAAC;QAChC,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,IAAM,WAAW,GAAG,CAClB,sCACE,GAAG,EAAE,OAAO,EACZ,SAAS,EAAE,EAAE,CACX,uBAAgB,SAAS,oCAAiC,EAC1D,SAAS,CACV,IACG,KAAK,GAER,QAAQ,CACL,CACP,CAAC;IAEF,IAAI,WAAW,EAAE,CAAC;QAChB,OAAO,CACL,oBAAC,OAAO,IACN,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,QAAQ,EACf,qBAAqB,EAAE,IAAI,GAC3B,CACH,CAAC;IACJ,CAAC;IAED,OAAO,WAAW,CAAC;AACrB,CAAC,CAAC"}
+{"version":3,"file":"TruncatedText.js","sourceRoot":"","sources":["../../../src/components/TruncatedText.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,OAAO,EAAE,MAAM,6BAA6B,CAAC;AACtD,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAC;AASxC,MAAM,CAAC,IAAM,aAAa,GAAiC,UAAC,EAO3D;IANC,IAAA,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,iBAAa,EAAb,SAAS,mBAAG,CAAC,KAAA,EACb,WAAW,iBAAA,EACX,oBAAoB,0BAAA,EACjB,KAAK,cANkD,6EAO3D,CADS;IAEF,IAAA,KAAA,OAAgC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAA,EAApD,WAAW,QAAA,EAAE,cAAc,QAAyB,CAAC;IAC5D,IAAM,OAAO,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEnD,uEAAuE;IACvE,gBAAgB;IAChB,4EAA4E;IAC5E,KAAK,CAAC,eAAe,CAAC;QACpB,IAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;QAChC,IAAI,OAAO,EAAE,CAAC;YACZ,IAAM,aAAa,GAAG,OAAO,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC;YAClE,cAAc,CAAC,aAAa,CAAC,CAAC;QAChC,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,IAAM,WAAW,GAAG,CAClB,sCACE,GAAG,EAAE,OAAO,EACZ,SAAS,EAAE,EAAE,CACX,uBAAgB,SAAS,oCAAiC,EAC1D,SAAS,CACV,IACG,KAAK,GAER,QAAQ,CACL,CACP,CAAC;IAEF,IAAI,WAAW,EAAE,CAAC;QAChB,OAAO,CACL,oBAAC,OAAO,IACN,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,QAAQ,EACf,qBAAqB,EAAE,IAAI,EAC3B,WAAW,EAAE,WAAW,EACxB,oBAAoB,EAAE,oBAAoB,GAC1C,CACH,CAAC;IACJ,CAAC;IAED,OAAO,WAAW,CAAC;AACrB,CAAC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dust-tt/sparkle",
-  "version": "0.2.610",
+  "version": "0.2.611-rc-2",
   "scripts": {
     "build": "rm -rf dist && npm run tailwind && npm run build:esm && npm run build:cjs",
     "tailwind": "tailwindcss -i ./src/styles/tailwind.css -o dist/sparkle.css",

package/src/components/ToolCard.tsx

@@ -17,6 +17,8 @@ export interface ToolCardProps {
   cantAddReason?: string;
   onClick?: () => void;
   className?: string;
+  mountPortal?: boolean;
+  mountPortalContainer?: HTMLElement;
 }
 
 export const ToolCard = React.forwardRef<HTMLDivElement, ToolCardProps>(
@@ -30,6 +32,8 @@ export const ToolCard = React.forwardRef<HTMLDivElement, ToolCardProps>(
       cantAddReason,
       onClick,
       className,
+      mountPortal,
+      mountPortalContainer,
     },
     ref
   ) => {
@@ -70,7 +74,11 @@ export const ToolCard = React.forwardRef<HTMLDivElement, ToolCardProps>(
               </div>
             )}
           </div>
-          <TruncatedText className="s-text-sm s-text-muted-foreground dark:s-text-muted-foreground-night">
+          <TruncatedText 
+            className="s-text-sm s-text-muted-foreground dark:s-text-muted-foreground-night"
+            mountPortal={mountPortal}
+            mountPortalContainer={mountPortalContainer}
+          >
             {description}
           </TruncatedText>
         </div>

package/src/components/Tooltip.tsx

@@ -1,5 +1,6 @@
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
 import * as React from "react";
+import { useEffect, useState } from "react";
 
 import { classNames } from "@sparkle/lib/utils";
 
@@ -11,28 +12,55 @@ const TooltipPortal = TooltipPrimitive.Portal;
 const TooltipTrigger = TooltipPrimitive.Trigger;
 
 interface TooltipContentProps
-  extends React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> {}
+  extends React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> {
+  mountPortal?: boolean;
+  mountPortalContainer?: HTMLElement;
+}
 
 const TooltipContent = React.forwardRef<
   React.ElementRef<typeof TooltipPrimitive.Content>,
   TooltipContentProps
->(({ className, sideOffset = 4, ...props }, ref) => (
-  <TooltipPrimitive.Content
-    ref={ref}
-    sideOffset={sideOffset}
-    className={classNames(
-      "s-z-50 s-max-w-sm s-overflow-hidden s-whitespace-pre-wrap s-break-words s-rounded-md s-border",
-      "s-bg-background dark:s-bg-background-night",
-      "s-text-foreground dark:s-text-foreground-night",
-      "s-border-border dark:s-border-border-night",
-      "s-px-3 s-py-1.5 s-text-sm s-shadow-md",
-      "s-animate-in s-fade-in-0 s-zoom-in-95",
-      "data-[state=closed]:s-animate-out data-[state=closed]:s-fade-out-0 data-[state=closed]:s-zoom-out-95 data-[side=bottom]:s-slide-in-from-top-2 data-[side=left]:s-slide-in-from-right-2 data-[side=right]:s-slide-in-from-left-2 data-[side=top]:s-slide-in-from-bottom-2",
-      className || ""
-    )}
-    {...props}
-  />
-));
+>(({ className, sideOffset = 4, mountPortal = true, mountPortalContainer, ...props }, ref) => {
+  const content = (
+    <TooltipPrimitive.Content
+      ref={ref}
+      sideOffset={sideOffset}
+      className={classNames(
+        "s-z-50 s-max-w-sm s-overflow-hidden s-whitespace-pre-wrap s-break-words s-rounded-md s-border",
+        "s-bg-background dark:s-bg-background-night",
+        "s-text-foreground dark:s-text-foreground-night",
+        "s-border-border dark:s-border-border-night",
+        "s-px-3 s-py-1.5 s-text-sm s-shadow-md",
+        "s-animate-in s-fade-in-0 s-zoom-in-95",
+        "data-[state=closed]:s-animate-out data-[state=closed]:s-fade-out-0 data-[state=closed]:s-zoom-out-95 data-[side=bottom]:s-slide-in-from-top-2 data-[side=left]:s-slide-in-from-right-2 data-[side=right]:s-slide-in-from-left-2 data-[side=top]:s-slide-in-from-bottom-2",
+        className || ""
+      )}
+      {...props}
+    />
+  );
+
+  const [container, setContainer] = useState<Element | undefined>(
+    mountPortalContainer
+  );
+
+  useEffect(() => {
+    if (mountPortal && !container) {
+      const dialogElements = document.querySelectorAll(
+        ".s-sheet[role=dialog][data-state=open]"
+      );
+      const defaultContainer = dialogElements[dialogElements.length - 1];
+      setContainer(defaultContainer);
+    }
+  }, [mountPortal, container]);
+
+  return mountPortal ? (
+    <TooltipPrimitive.Portal container={container}>
+      {content}
+    </TooltipPrimitive.Portal>
+  ) : (
+    content
+  );
+});
 
 interface TooltipProps extends TooltipContentProps {
   trigger: React.ReactNode;
@@ -51,11 +79,9 @@ const Tooltip = React.forwardRef<HTMLDivElement, TooltipProps>(
         <TooltipTrigger asChild={tooltipTriggerAsChild}>
           {trigger}
         </TooltipTrigger>
-        <TooltipPortal>
-          <TooltipContent {...props} ref={ref}>
-            {label}
-          </TooltipContent>
-        </TooltipPortal>
+        <TooltipContent {...props} ref={ref}>
+          {label}
+        </TooltipContent>
       </TooltipRoot>
     </TooltipProvider>
   )

package/src/components/TruncatedText.tsx

@@ -6,12 +6,16 @@ import { cn } from "@sparkle/lib/utils";
 interface TruncatedTextProps extends React.HTMLAttributes<HTMLDivElement> {
   children: string | React.ReactNode;
   lineClamp?: number;
+  mountPortal?: boolean;
+  mountPortalContainer?: HTMLElement;
 }
 
 export const TruncatedText: React.FC<TruncatedTextProps> = ({
   children,
   className,
   lineClamp = 2,
+  mountPortal,
+  mountPortalContainer,
   ...props
 }) => {
   const [isTruncated, setIsTruncated] = React.useState(false);
@@ -47,6 +51,8 @@ export const TruncatedText: React.FC<TruncatedTextProps> = ({
         trigger={textElement}
         label={children}
         tooltipTriggerAsChild={true}
+        mountPortal={mountPortal}
+        mountPortalContainer={mountPortalContainer}
       />
     );
   }