@opencxh/ui-kit 3.111.4 → 3.112.1

package/dist/index.js

@@ -3437,7 +3437,9 @@ const ir = {
   success: "bg-success-soft text-success-fg",
   warning: "bg-warning-soft text-warning-fg",
   error: "bg-danger-soft text-danger-fg",
-  info: "bg-info-soft text-info-fg"
+  info: "bg-info-soft text-info-fg",
+  // Internal-note amber. Never for customer-visible content.
+  note: "bg-note-soft text-note"
 }, dr = {
   sm: "px-2 py-0.5 text-xs",
   md: "px-2.5 py-1 text-sm",
@@ -3449,7 +3451,8 @@ const ir = {
   success: "bg-success",
   warning: "bg-warning",
   error: "bg-danger",
-  info: "bg-info"
+  info: "bg-info",
+  note: "bg-note"
 };
 function tn({
   variant: t = "default",
@@ -4138,10 +4141,15 @@ function hn({
     "div",
     {
       className: d(
-        "min-w-0 border",
-        n === "warning" ? "border-warning-border" : "border-border",
+        // A bubble never spans the whole column; it narrows further from md,
+        // where the thread itself is wide enough for the difference to matter.
+        "min-w-0 max-w-bubble border md:max-w-bubble-md",
+        n === "warning" && "border-warning-border",
+        n === "note" && "border-note-border",
+        n === "default" && "border-border",
         // The tight corner points back at the sender.
-        t === "out" ? "rounded-lg rounded-tr-sm bg-bubble-out-soft" : "rounded-lg rounded-tl-sm bg-surface",
+        t === "out" ? "rounded-lg rounded-tr-sm" : "rounded-lg rounded-tl-sm",
+        n === "note" ? "bg-note-soft" : t === "out" ? "bg-bubble-out-soft" : "bg-surface",
         r && "mt-1",
         s
       ),