@nurix/ui-component-library 1.1.3-stage.110 → 1.1.3-stage.111

package/dist/index.d.mts

@@ -2590,6 +2590,10 @@ interface ChatBubbleAgentProps extends ChatBubbleBaseProps {
     focused?: boolean;
 }
 interface ChatBubbleUserProps extends ChatBubbleBaseProps {
+    /** Shown below the message (e.g. a "Tool Call" tag). */
+    trailing?: React$1.ReactNode;
+    /** In-Focus state — draws the brand ring around the row. */
+    focused?: boolean;
 }
 
 /**

package/dist/index.d.ts

@@ -2590,6 +2590,10 @@ interface ChatBubbleAgentProps extends ChatBubbleBaseProps {
     focused?: boolean;
 }
 interface ChatBubbleUserProps extends ChatBubbleBaseProps {
+    /** Shown below the message (e.g. a "Tool Call" tag). */
+    trailing?: React$1.ReactNode;
+    /** In-Focus state — draws the brand ring around the row. */
+    focused?: boolean;
 }
 
 /**

package/dist/index.js

@@ -10355,7 +10355,13 @@ var TooltipContent = React27.forwardRef(({ className, sideOffset = 6, shortcut,
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipPrimitive.Arrow, { className: TOOLTIP_TOKENS.arrow })
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          TooltipPrimitive.Arrow,
+          {
+            className: TOOLTIP_TOKENS.arrow,
+            style: { fill: "hsl(var(--bg-brand-primary))" }
+          }
+        )
       ]
     }
   );
@@ -15037,9 +15043,9 @@ var AUDIO_PLAYER_TOKENS = {
   waveform: {
     wrapper: "relative flex-1 min-w-0 h-8 mx-3 cursor-pointer select-none overflow-hidden",
     bars: "absolute inset-0 flex items-center gap-[2px]",
-    bar: "flex-1 min-w-px rounded-full bg-border-token-light",
+    bar: "flex-1 min-w-px rounded-full bg-token-light",
     barActive: "bg-token-brand-primary",
-    baseline: "absolute left-0 right-0 top-1/2 h-px -translate-y-1/2 bg-border-token-light"
+    baseline: "absolute left-0 right-0 top-1/2 h-px -translate-y-1/2 bg-token-light"
   }
 };
 
@@ -15272,6 +15278,8 @@ var ChatBubbleUser = React42.forwardRef(
     timestamp,
     alwaysShowTimestamp = false,
     avatar,
+    trailing,
+    focused = false,
     className,
     ...props
   }, ref) => {
@@ -15279,23 +15287,32 @@ var ChatBubbleUser = React42.forwardRef(
       "div",
       {
         ref,
-        className: cn(CHAT_BUBBLE_TOKENS.group, "items-start", className),
+        className: cn(
+          CHAT_BUBBLE_TOKENS.group,
+          "items-start",
+          focused && CHAT_BUBBLE_TOKENS.groupFocused,
+          className
+        ),
         ...props,
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: CHAT_BUBBLE_TOKENS.user.row, children: [
             /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: cn(CHAT_BUBBLE_TOKENS.user.avatar, "mb-0.5"), children: avatar != null ? avatar : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react22.User, {}) }),
             /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: CHAT_BUBBLE_TOKENS.user.text, children: message })
           ] }),
-          timestamp && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: CHAT_BUBBLE_TOKENS.user.timestampRow, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
-            "span",
-            {
-              className: cn(
-                CHAT_BUBBLE_TOKENS.timestamp,
-                !alwaysShowTimestamp && CHAT_BUBBLE_TOKENS.timestampHidden
-              ),
-              children: timestamp
-            }
-          ) })
+          (timestamp || trailing) && /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: CHAT_BUBBLE_TOKENS.user.timestampRow, children: [
+            trailing,
+            timestamp && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+              "span",
+              {
+                className: cn(
+                  CHAT_BUBBLE_TOKENS.timestamp,
+                  trailing && "ml-2",
+                  !alwaysShowTimestamp && !focused && CHAT_BUBBLE_TOKENS.timestampHidden
+                ),
+                children: timestamp
+              }
+            )
+          ] })
         ]
       }
     );

package/dist/index.mjs

@@ -10253,7 +10253,13 @@ var TooltipContent = React27.forwardRef(({ className, sideOffset = 6, shortcut,
             }
           )
         ] }),
-        /* @__PURE__ */ jsx23(TooltipPrimitive.Arrow, { className: TOOLTIP_TOKENS.arrow })
+        /* @__PURE__ */ jsx23(
+          TooltipPrimitive.Arrow,
+          {
+            className: TOOLTIP_TOKENS.arrow,
+            style: { fill: "hsl(var(--bg-brand-primary))" }
+          }
+        )
       ]
     }
   );
@@ -14943,9 +14949,9 @@ var AUDIO_PLAYER_TOKENS = {
   waveform: {
     wrapper: "relative flex-1 min-w-0 h-8 mx-3 cursor-pointer select-none overflow-hidden",
     bars: "absolute inset-0 flex items-center gap-[2px]",
-    bar: "flex-1 min-w-px rounded-full bg-border-token-light",
+    bar: "flex-1 min-w-px rounded-full bg-token-light",
     barActive: "bg-token-brand-primary",
-    baseline: "absolute left-0 right-0 top-1/2 h-px -translate-y-1/2 bg-border-token-light"
+    baseline: "absolute left-0 right-0 top-1/2 h-px -translate-y-1/2 bg-token-light"
   }
 };
 
@@ -15178,6 +15184,8 @@ var ChatBubbleUser = React42.forwardRef(
     timestamp,
     alwaysShowTimestamp = false,
     avatar,
+    trailing,
+    focused = false,
     className,
     ...props
   }, ref) => {
@@ -15185,23 +15193,32 @@ var ChatBubbleUser = React42.forwardRef(
       "div",
       {
         ref,
-        className: cn(CHAT_BUBBLE_TOKENS.group, "items-start", className),
+        className: cn(
+          CHAT_BUBBLE_TOKENS.group,
+          "items-start",
+          focused && CHAT_BUBBLE_TOKENS.groupFocused,
+          className
+        ),
         ...props,
         children: [
           /* @__PURE__ */ jsxs29("div", { className: CHAT_BUBBLE_TOKENS.user.row, children: [
             /* @__PURE__ */ jsx38("div", { className: cn(CHAT_BUBBLE_TOKENS.user.avatar, "mb-0.5"), children: avatar != null ? avatar : /* @__PURE__ */ jsx38(User, {}) }),
             /* @__PURE__ */ jsx38("div", { className: CHAT_BUBBLE_TOKENS.user.text, children: message })
           ] }),
-          timestamp && /* @__PURE__ */ jsx38("div", { className: CHAT_BUBBLE_TOKENS.user.timestampRow, children: /* @__PURE__ */ jsx38(
-            "span",
-            {
-              className: cn(
-                CHAT_BUBBLE_TOKENS.timestamp,
-                !alwaysShowTimestamp && CHAT_BUBBLE_TOKENS.timestampHidden
-              ),
-              children: timestamp
-            }
-          ) })
+          (timestamp || trailing) && /* @__PURE__ */ jsxs29("div", { className: CHAT_BUBBLE_TOKENS.user.timestampRow, children: [
+            trailing,
+            timestamp && /* @__PURE__ */ jsx38(
+              "span",
+              {
+                className: cn(
+                  CHAT_BUBBLE_TOKENS.timestamp,
+                  trailing && "ml-2",
+                  !alwaysShowTimestamp && !focused && CHAT_BUBBLE_TOKENS.timestampHidden
+                ),
+                children: timestamp
+              }
+            )
+          ] })
         ]
       }
     );

package/dist/styles.css

@@ -66,7 +66,7 @@
     -moz-tab-size: 4;
       -o-tab-size: 4;
          tab-size: 4;
-    font-family: Nunito, ui-sans-serif, system-ui, sans-serif;
+    font-family: var(--font-nunito, Nunito), ui-sans-serif, system-ui, sans-serif;
     font-feature-settings: normal;
     font-variation-settings: normal;
     -webkit-tap-highlight-color: transparent;
@@ -1506,10 +1506,10 @@
     vertical-align: middle;
   }
   .lego-land .font-nunito {
-    font-family: Nunito, ui-sans-serif, system-ui, sans-serif;
+    font-family: var(--font-nunito, Nunito), ui-sans-serif, system-ui, sans-serif;
   }
   .lego-land .font-sans {
-    font-family: Nunito, ui-sans-serif, system-ui, sans-serif;
+    font-family: var(--font-nunito, Nunito), ui-sans-serif, system-ui, sans-serif;
   }
   .lego-land .text-2xl {
     font-size: 24px;
@@ -3087,7 +3087,7 @@
 }
 @import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400;1,500;1,600;1,700&display=swap");
 .lego-land {
-  --font-sans: "Nunito", ui-sans-serif, system-ui, sans-serif;
+  --font-sans: var(--font-nunito, "Nunito"), ui-sans-serif, system-ui, sans-serif;
   font-family: var(--font-sans);
   --bg-white: 0 0% 100%;
   --bg-light-grey: 0 0% 98%;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nurix/ui-component-library",
-  "version": "1.1.3-stage.110",
+  "version": "1.1.3-stage.111",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",