@dust-tt/sparkle 0.2.187 → 0.2.189

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dust-tt/sparkle",
-  "version": "0.2.187",
+  "version": "0.2.189",
   "scripts": {
     "build": "rm -rf dist && rollup -c",
     "build:with-tw-base": "rollup -c --environment INCLUDE_TW_BASE:true",

package/src/components/AssistantPreview.tsx

@@ -50,8 +50,8 @@ const titleClassNames = {
     getWindowWidth() <= breakpoints.sm
       ? "s-text-sm"
       : getWindowWidth() <= breakpoints.md
-      ? "s-text-base"
-      : ""
+        ? "s-text-base"
+        : ""
   }`,
 };
 
@@ -62,8 +62,8 @@ const subtitleClassNames = {
     getWindowWidth() <= breakpoints.sm
       ? "s-text-xs"
       : getWindowWidth() <= breakpoints.md
-      ? "s-text-xs"
-      : "s-text-sm"
+        ? "s-text-xs"
+        : "s-text-sm"
   }`,
 };
 
@@ -161,7 +161,10 @@ const MinimalVariantContent = ({
       <div
         id="assistant-container"
         className="s-flex s-grow s-flex-col s-justify-start s-gap-2 s-overflow-hidden s-py-1"
-        onClick={onClick}
+        onClick={(e) => {
+          e.stopPropagation();
+          onClick?.();
+        }}
       >
         <div className="s-flex s-flex-row s-justify-between s-gap-2 s-overflow-hidden">
           <div

package/src/components/Citation.tsx

@@ -126,16 +126,15 @@ export function Citation({
           </div>
         )}
       </div>
-      <Tooltip label={title} position="above">
-        <div
-          className={classNames(
-            "s-line-clamp-1 s-text-sm s-text-element-800",
-            size === "sm" ? "s-font-bold" : "s-font-semibold"
-          )}
-        >
-          {title}
-        </div>
-      </Tooltip>
+      <div
+        className={classNames(
+          "s-line-clamp-1 s-text-sm s-text-element-800",
+          size === "sm" ? "s-font-bold" : "s-font-semibold"
+        )}
+      >
+        {title}
+      </div>
+
       {description && (
         <div className="s-line-clamp-2 s-text-xs s-font-normal s-text-element-700">
           {description}
@@ -145,24 +144,26 @@ export function Citation({
   );
 
   return (
-    <CardButton
-      variant="secondary"
-      size="sm"
-      className={classNames(
-        "s-relative s-flex s-w-48 s-flex-none s-flex-col s-gap-1",
-        sizing === "fluid" ? typeSizing[sizing] : typeSizing[sizing][size],
-        size === "sm" ? "sm:s-w-64" : "",
-        isBlinking ? "s-animate-[bgblink_500ms_3]" : "",
-        type === "image" ? "s-min-h-20" : ""
-      )}
-      {...(href && { href, target: "_blank", rel: "noopener noreferrer" })}
-    >
-      {isLoading && (
-        <div className="s-absolute s-inset-0 s-flex s-items-center s-justify-center">
-          <Spinner size="xs" variant="color" />
-        </div>
-      )}
-      <div className={isLoading ? "s-opacity-50" : ""}>{cardContent}</div>
-    </CardButton>
+    <Tooltip label={title} position="above">
+      <CardButton
+        variant="secondary"
+        size="sm"
+        className={classNames(
+          "s-relative s-flex s-w-48 s-flex-none s-flex-col s-gap-1",
+          sizing === "fluid" ? typeSizing[sizing] : typeSizing[sizing][size],
+          size === "sm" ? "sm:s-w-64" : "",
+          isBlinking ? "s-animate-[bgblink_500ms_3]" : "",
+          type === "image" ? "s-min-h-20" : ""
+        )}
+        {...(href && { href, target: "_blank", rel: "noopener noreferrer" })}
+      >
+        {isLoading && (
+          <div className="s-absolute s-inset-0 s-flex s-items-center s-justify-center">
+            <Spinner size="xs" variant="color" />
+          </div>
+        )}
+        <div className={isLoading ? "s-opacity-50" : ""}>{cardContent}</div>
+      </CardButton>
+    </Tooltip>
   );
 }