@cossistant/react 0.0.11 → 0.0.14

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cossistant/react",
   "type": "module",
-  "version": "0.0.11",
+  "version": "0.0.14",
   "private": false,
   "author": "Cossistant team",
   "description": "Headless React SDK for building AI-powered support/chat widgets. Hooks + primitives, WS-driven, TypeScript-first. Next.js-ready, Tailwind optional.",
@@ -88,8 +88,8 @@
     "*.css"
   ],
   "dependencies": {
-    "@cossistant/core": "0.0.11",
-    "@cossistant/types": "0.0.11",
+    "@cossistant/core": "0.0.14",
+    "@cossistant/types": "0.0.14",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "nanoid": "^5.1.5",

package/primitives/avatar/image.d.ts

@@ -15,7 +15,7 @@ type AvatarImageProps = Omit<React$1.ImgHTMLAttributes<HTMLImageElement>, "src"
  * Controlled `<img>` that syncs its loading status back to the avatar context
  * so fallbacks know when to display.
  */
-declare const AvatarImage: React$1.ForwardRefExoticComponent<Omit<React$1.ImgHTMLAttributes<HTMLImageElement>, "src" | "alt"> & {
+declare const AvatarImage: React$1.ForwardRefExoticComponent<Omit<React$1.ImgHTMLAttributes<HTMLImageElement>, "alt" | "src"> & {
   src: string;
   alt?: string;
   asChild?: boolean;

package/realtime-events.d.ts

@@ -187,9 +187,9 @@ declare const realtimeSchema: {
         spam: "spam";
       }>;
       priority: ZodEnum<{
+        normal: "normal";
         high: "high";
         low: "low";
-        normal: "normal";
         urgent: "urgent";
       }>;
       organizationId: ZodString;

package/support/components/bubble.js

@@ -51,7 +51,7 @@ const Bubble = ({ className }) => /* @__PURE__ */ jsx(SupportBubble, {
 					ease: "easeOut"
 				}
 			},
-			className: "pointer-events-none flex items-center rounded-full text-primary",
+			className: "pointer-events-none flex items-center rounded-full text-co-primary",
 			exit: {
 				opacity: 0,
 				scale: .9,

package/support/components/bubble.js.map

@@ -1 +1 @@
-{"version":3,"file":"bubble.js","names":["Bubble: React.FC<BubbleProps>","Primitive.Bubble","Icon"],"sources":["../../../src/support/components/bubble.tsx"],"sourcesContent":["\"use client\";\n\nimport { AnimatePresence, motion } from \"motion/react\";\nimport type React from \"react\";\nimport * as Primitive from \"../../primitives\";\nimport { cn } from \"../utils\";\nimport Icon from \"./icons\";\nimport { BouncingDots } from \"./typing-indicator\";\n\nexport type BubbleProps = {\n\tclassName?: string;\n};\n\nexport const Bubble: React.FC<BubbleProps> = ({ className }) => (\n\t<Primitive.Bubble\n\t\tclassName={cn(\n\t\t\t\"relative flex size-12 cursor-pointer items-center justify-center rounded-full bg-co-primary text-co-primary-foreground transition-colors hover:bg-co-primary/90 data-[open=true]:bg-co-primary/90\",\n\t\t\tclassName\n\t\t)}\n\t>\n\t\t{({ isOpen, unreadCount, isTyping }) => (\n\t\t\t<>\n\t\t\t\t<AnimatePresence mode=\"wait\">\n\t\t\t\t\t{isOpen ? (\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tanimate={{\n\t\t\t\t\t\t\t\tscale: 1,\n\t\t\t\t\t\t\t\trotate: 0,\n\t\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\t\ttransition: { duration: 0.2, ease: \"easeOut\" },\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tclassName=\"flex items-center justify-center\"\n\t\t\t\t\t\t\texit={{\n\t\t\t\t\t\t\t\tscale: 0.9,\n\t\t\t\t\t\t\t\trotate: -45,\n\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\ttransition: { duration: 0.1, ease: \"easeIn\" },\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tinitial={{ scale: 0.9, rotate: 45, opacity: 0 }}\n\t\t\t\t\t\t\tkey=\"chevron\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Icon className=\"h-5 w-5\" name=\"chevron-down\" />\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t) : isTyping ? (\n\t\t\t\t\t\t<motion.span\n\t\t\t\t\t\t\tanimate={{\n\t\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\t\tscale: 1,\n\t\t\t\t\t\t\t\ttransition: {\n\t\t\t\t\t\t\t\t\tduration: 0.2,\n\t\t\t\t\t\t\t\t\tease: \"easeOut\",\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tclassName=\"pointer-events-none flex items-center rounded-full text-primary\"\n\t\t\t\t\t\t\texit={{\n\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\tscale: 0.9,\n\t\t\t\t\t\t\t\ttransition: {\n\t\t\t\t\t\t\t\t\tduration: 0.1,\n\t\t\t\t\t\t\t\t\tease: \"easeIn\",\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tinitial={{ opacity: 0, scale: 0.9 }}\n\t\t\t\t\t\t\tkey=\"typing-indicator\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<BouncingDots className=\"bg-co-primary-foreground\" />\n\t\t\t\t\t\t</motion.span>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tanimate={{\n\t\t\t\t\t\t\t\tscale: 1,\n\t\t\t\t\t\t\t\trotate: 0,\n\t\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\t\ttransition: { duration: 0.2, ease: \"easeOut\" },\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tclassName=\"flex items-center justify-center\"\n\t\t\t\t\t\t\texit={{\n\t\t\t\t\t\t\t\tscale: 0.9,\n\t\t\t\t\t\t\t\trotate: 45,\n\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\ttransition: { duration: 0.1, ease: \"easeIn\" },\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tinitial={{ scale: 0.9, rotate: -45, opacity: 0 }}\n\t\t\t\t\t\t\tkey=\"chat\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Icon className=\"h-6 w-6\" name=\"chat\" variant=\"filled\" />\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t)}\n\t\t\t\t</AnimatePresence>\n\n\t\t\t\t{unreadCount > 0 && (\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tanimate={{ scale: 1, opacity: 1 }}\n\t\t\t\t\t\tclassName=\"-top-0 -right-0 absolute flex h-3 w-3 items-center justify-center rounded-full bg-co-destructive font-medium text-[10px] text-co-destructive-foreground text-white text-xs\"\n\t\t\t\t\t\texit={{ scale: 0, opacity: 0 }}\n\t\t\t\t\t\tinitial={{ scale: 0, opacity: 0 }}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</>\n\t\t)}\n\t</Primitive.Bubble>\n);\n"],"mappings":";;;;;;;;;;;AAaA,MAAaA,UAAiC,EAAE,gBAC/C,oBAACC;CACA,WAAW,GACV,qMACA,UACA;YAEC,EAAE,QAAQ,aAAa,eACxB,4CACC,oBAAC;EAAgB,MAAK;YACpB,SACA,oBAAC,OAAO;GACP,SAAS;IACR,OAAO;IACP,QAAQ;IACR,SAAS;IACT,YAAY;KAAE,UAAU;KAAK,MAAM;KAAW;IAC9C;GACD,WAAU;GACV,MAAM;IACL,OAAO;IACP,QAAQ;IACR,SAAS;IACT,YAAY;KAAE,UAAU;KAAK,MAAM;KAAU;IAC7C;GACD,SAAS;IAAE,OAAO;IAAK,QAAQ;IAAI,SAAS;IAAG;aAG/C,oBAACC;IAAK,WAAU;IAAU,MAAK;KAAiB;KAF5C,UAGQ,GACV,WACH,oBAAC,OAAO;GACP,SAAS;IACR,SAAS;IACT,OAAO;IACP,YAAY;KACX,UAAU;KACV,MAAM;KACN;IACD;GACD,WAAU;GACV,MAAM;IACL,SAAS;IACT,OAAO;IACP,YAAY;KACX,UAAU;KACV,MAAM;KACN;IACD;GACD,SAAS;IAAE,SAAS;IAAG,OAAO;IAAK;aAGnC,oBAAC,gBAAa,WAAU,6BAA6B;KAFjD,mBAGS,GAEd,oBAAC,OAAO;GACP,SAAS;IACR,OAAO;IACP,QAAQ;IACR,SAAS;IACT,YAAY;KAAE,UAAU;KAAK,MAAM;KAAW;IAC9C;GACD,WAAU;GACV,MAAM;IACL,OAAO;IACP,QAAQ;IACR,SAAS;IACT,YAAY;KAAE,UAAU;KAAK,MAAM;KAAU;IAC7C;GACD,SAAS;IAAE,OAAO;IAAK,QAAQ;IAAK,SAAS;IAAG;aAGhD,oBAACA;IAAK,WAAU;IAAU,MAAK;IAAO,SAAQ;KAAW;KAFrD,OAGQ;GAEG,EAEjB,cAAc,KACd,oBAAC,OAAO;EACP,SAAS;GAAE,OAAO;GAAG,SAAS;GAAG;EACjC,WAAU;EACV,MAAM;GAAE,OAAO;GAAG,SAAS;GAAG;EAC9B,SAAS;GAAE,OAAO;GAAG,SAAS;GAAG;GAChC,IAED;EAEc"}
+{"version":3,"file":"bubble.js","names":["Bubble: React.FC<BubbleProps>","Primitive.Bubble","Icon"],"sources":["../../../src/support/components/bubble.tsx"],"sourcesContent":["\"use client\";\n\nimport { AnimatePresence, motion } from \"motion/react\";\nimport type React from \"react\";\nimport * as Primitive from \"../../primitives\";\nimport { cn } from \"../utils\";\nimport Icon from \"./icons\";\nimport { BouncingDots } from \"./typing-indicator\";\n\nexport type BubbleProps = {\n\tclassName?: string;\n};\n\nexport const Bubble: React.FC<BubbleProps> = ({ className }) => (\n\t<Primitive.Bubble\n\t\tclassName={cn(\n\t\t\t\"relative flex size-12 cursor-pointer items-center justify-center rounded-full bg-co-primary text-co-primary-foreground transition-colors hover:bg-co-primary/90 data-[open=true]:bg-co-primary/90\",\n\t\t\tclassName\n\t\t)}\n\t>\n\t\t{({ isOpen, unreadCount, isTyping }) => (\n\t\t\t<>\n\t\t\t\t<AnimatePresence mode=\"wait\">\n\t\t\t\t\t{isOpen ? (\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tanimate={{\n\t\t\t\t\t\t\t\tscale: 1,\n\t\t\t\t\t\t\t\trotate: 0,\n\t\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\t\ttransition: { duration: 0.2, ease: \"easeOut\" },\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tclassName=\"flex items-center justify-center\"\n\t\t\t\t\t\t\texit={{\n\t\t\t\t\t\t\t\tscale: 0.9,\n\t\t\t\t\t\t\t\trotate: -45,\n\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\ttransition: { duration: 0.1, ease: \"easeIn\" },\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tinitial={{ scale: 0.9, rotate: 45, opacity: 0 }}\n\t\t\t\t\t\t\tkey=\"chevron\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Icon className=\"h-5 w-5\" name=\"chevron-down\" />\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t) : isTyping ? (\n\t\t\t\t\t\t<motion.span\n\t\t\t\t\t\t\tanimate={{\n\t\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\t\tscale: 1,\n\t\t\t\t\t\t\t\ttransition: {\n\t\t\t\t\t\t\t\t\tduration: 0.2,\n\t\t\t\t\t\t\t\t\tease: \"easeOut\",\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tclassName=\"pointer-events-none flex items-center rounded-full text-co-primary\"\n\t\t\t\t\t\t\texit={{\n\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\tscale: 0.9,\n\t\t\t\t\t\t\t\ttransition: {\n\t\t\t\t\t\t\t\t\tduration: 0.1,\n\t\t\t\t\t\t\t\t\tease: \"easeIn\",\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tinitial={{ opacity: 0, scale: 0.9 }}\n\t\t\t\t\t\t\tkey=\"typing-indicator\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<BouncingDots className=\"bg-co-primary-foreground\" />\n\t\t\t\t\t\t</motion.span>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tanimate={{\n\t\t\t\t\t\t\t\tscale: 1,\n\t\t\t\t\t\t\t\trotate: 0,\n\t\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\t\ttransition: { duration: 0.2, ease: \"easeOut\" },\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tclassName=\"flex items-center justify-center\"\n\t\t\t\t\t\t\texit={{\n\t\t\t\t\t\t\t\tscale: 0.9,\n\t\t\t\t\t\t\t\trotate: 45,\n\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\ttransition: { duration: 0.1, ease: \"easeIn\" },\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tinitial={{ scale: 0.9, rotate: -45, opacity: 0 }}\n\t\t\t\t\t\t\tkey=\"chat\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Icon className=\"h-6 w-6\" name=\"chat\" variant=\"filled\" />\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t)}\n\t\t\t\t</AnimatePresence>\n\n\t\t\t\t{unreadCount > 0 && (\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tanimate={{ scale: 1, opacity: 1 }}\n\t\t\t\t\t\tclassName=\"-top-0 -right-0 absolute flex h-3 w-3 items-center justify-center rounded-full bg-co-destructive font-medium text-[10px] text-co-destructive-foreground text-white text-xs\"\n\t\t\t\t\t\texit={{ scale: 0, opacity: 0 }}\n\t\t\t\t\t\tinitial={{ scale: 0, opacity: 0 }}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</>\n\t\t)}\n\t</Primitive.Bubble>\n);\n"],"mappings":";;;;;;;;;;;AAaA,MAAaA,UAAiC,EAAE,gBAC/C,oBAACC;CACA,WAAW,GACV,qMACA,UACA;YAEC,EAAE,QAAQ,aAAa,eACxB,4CACC,oBAAC;EAAgB,MAAK;YACpB,SACA,oBAAC,OAAO;GACP,SAAS;IACR,OAAO;IACP,QAAQ;IACR,SAAS;IACT,YAAY;KAAE,UAAU;KAAK,MAAM;KAAW;IAC9C;GACD,WAAU;GACV,MAAM;IACL,OAAO;IACP,QAAQ;IACR,SAAS;IACT,YAAY;KAAE,UAAU;KAAK,MAAM;KAAU;IAC7C;GACD,SAAS;IAAE,OAAO;IAAK,QAAQ;IAAI,SAAS;IAAG;aAG/C,oBAACC;IAAK,WAAU;IAAU,MAAK;KAAiB;KAF5C,UAGQ,GACV,WACH,oBAAC,OAAO;GACP,SAAS;IACR,SAAS;IACT,OAAO;IACP,YAAY;KACX,UAAU;KACV,MAAM;KACN;IACD;GACD,WAAU;GACV,MAAM;IACL,SAAS;IACT,OAAO;IACP,YAAY;KACX,UAAU;KACV,MAAM;KACN;IACD;GACD,SAAS;IAAE,SAAS;IAAG,OAAO;IAAK;aAGnC,oBAAC,gBAAa,WAAU,6BAA6B;KAFjD,mBAGS,GAEd,oBAAC,OAAO;GACP,SAAS;IACR,OAAO;IACP,QAAQ;IACR,SAAS;IACT,YAAY;KAAE,UAAU;KAAK,MAAM;KAAW;IAC9C;GACD,WAAU;GACV,MAAM;IACL,OAAO;IACP,QAAQ;IACR,SAAS;IACT,YAAY;KAAE,UAAU;KAAK,MAAM;KAAU;IAC7C;GACD,SAAS;IAAE,OAAO;IAAK,QAAQ;IAAK,SAAS;IAAG;aAGhD,oBAACA;IAAK,WAAU;IAAU,MAAK;IAAO,SAAQ;KAAW;KAFrD,OAGQ;GAEG,EAEjB,cAAc,KACd,oBAAC,OAAO;EACP,SAAS;GAAE,OAAO;GAAG,SAAS;GAAG;EACjC,WAAU;EACV,MAAM;GAAE,OAAO;GAAG,SAAS;GAAG;EAC9B,SAAS;GAAE,OAAO;GAAG,SAAS;GAAG;GAChC,IAED;EAEc"}

package/support/components/button.d.ts

@@ -4,7 +4,7 @@ import * as class_variance_authority_dist_types0 from "class-variance-authority/
 
 //#region src/support/components/button.d.ts
 declare const coButtonVariants: (props?: ({
-  variant?: "tab" | "default" | "secondary" | "ghost" | "outline" | "tab-selected" | null | undefined;
+  variant?: "default" | "tab" | "secondary" | "ghost" | "outline" | "tab-selected" | null | undefined;
   size?: "default" | "large" | "icon" | null | undefined;
 } & class_variance_authority_dist_types0.ClassProp) | undefined) => string;
 type CossistantButtonProps = React$1.ComponentProps<"button"> & VariantProps<typeof coButtonVariants>;
@@ -12,12 +12,12 @@ type CossistantButtonProps = React$1.ComponentProps<"button"> & VariantProps<typ
  * Styled button primitive that forwards variant and size props to the shared
  * design tokens.
  */
-declare function Button({
+declare function CoButton({
   className,
   variant,
   size,
   ...props
 }: CossistantButtonProps): React$1.ReactElement;
 //#endregion
-export { Button, CossistantButtonProps, coButtonVariants };
+export { CoButton, CossistantButtonProps, coButtonVariants };
 //# sourceMappingURL=button.d.ts.map

package/support/components/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","names":[],"sources":["../../../src/support/components/button.tsx"],"sourcesContent":[],"mappings":";;;;;cAKa,wBA4BZ;;;AA5BD,CAAA,GA4BC,oCAAA,CAAA,SAAA,CAAA,GAAA,SAAA,EAAA,GAAA,MAAA;AAEW,KAAA,qBAAA,GAAwB,OAAA,CAAM,cAAT,CAAA,QAAA,CAAA,GAChC,YADgC,CAAA,OACZ,gBADY,CAAA;;;;;AAOjB,iBAAA,MAAA,CAAM;EAAA,SAAA;EAAA,OAAA;EAAA,IAAA;EAAA,GAAA;AAAA,CAAA,EAKnB,qBALmB,CAAA,EAKK,OAAA,CAAM,YALX"}
+{"version":3,"file":"button.d.ts","names":[],"sources":["../../../src/support/components/button.tsx"],"sourcesContent":[],"mappings":";;;;;cAKa,wBA4BZ;;;AA5BD,CAAA,GA4BC,oCAAA,CAAA,SAAA,CAAA,GAAA,SAAA,EAAA,GAAA,MAAA;AAEW,KAAA,qBAAA,GAAwB,OAAA,CAAM,cAAT,CAAA,QAAA,CAAA,GAChC,YADgC,CAAA,OACZ,gBADY,CAAA;;;;;AAOjB,iBAAA,QAAA,CAAQ;EAAA,SAAA;EAAA,OAAA;EAAA,IAAA;EAAA,GAAA;AAAA,CAAA,EAKrB,qBALqB,CAAA,EAKG,OAAA,CAAM,YALT"}

package/support/components/button.js

@@ -1,5 +1,5 @@
 import { cn } from "../utils/index.js";
-import { Button as Button$1 } from "../../primitives/button.js";
+import { Button } from "../../primitives/button.js";
 import { jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 
@@ -29,8 +29,8 @@ const coButtonVariants = cva("group/btn inline-flex shrink-0 items-center justif
 * Styled button primitive that forwards variant and size props to the shared
 * design tokens.
 */
-function Button({ className, variant, size,...props }) {
-	return /* @__PURE__ */ jsx(Button$1, {
+function CoButton({ className, variant, size,...props }) {
+	return /* @__PURE__ */ jsx(Button, {
 		className: cn(coButtonVariants({
 			variant,
 			size,
@@ -41,5 +41,5 @@ function Button({ className, variant, size,...props }) {
 }
 
 //#endregion
-export { Button, coButtonVariants };
+export { CoButton, coButtonVariants };
 //# sourceMappingURL=button.js.map

package/support/components/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","names":["ButtonPrimitive"],"sources":["../../../src/support/components/button.tsx"],"sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\";\nimport type * as React from \"react\";\nimport { Button as ButtonPrimitive } from \"../../primitives/button\";\nimport { cn } from \"../utils\";\n\nexport const coButtonVariants = cva(\n\t\"group/btn inline-flex shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-md border font-medium text-sm outline-none transition-all hover:cursor-pointer focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tdefault:\n\t\t\t\t\t\"bg-co-primary text-co-primary-foreground hover:bg-co-primary/90\",\n\t\t\t\tsecondary:\n\t\t\t\t\t\"border-co-border/50 bg-co-background-50 hover:bg-co-background-100 hover:text-co-foreground dark:bg-co-background-300 dark:hover:bg-co-background-400\",\n\t\t\t\tghost:\n\t\t\t\t\t\"border-transparent hover:bg-co-background-200 hover:text-co-foreground dark:hover:bg-co-background-300\",\n\t\t\t\toutline:\n\t\t\t\t\t\"border border-co-border bg-co-background hover:bg-co-background-100 dark:bg-co-background-200 dark:hover:bg-co-background-300\",\n\t\t\t\ttab: \"opacity-40 hover:bg-co-background-100 hover:text-co-foreground hover:opacity-90 dark:hover:bg-co-background-200\",\n\t\t\t\t\"tab-selected\":\n\t\t\t\t\t\"hover:bg-co-background-100 hover:text-co-foreground dark:hover:bg-co-background-200\",\n\t\t\t},\n\t\t\tsize: {\n\t\t\t\tdefault: \"h-8 px-4 py-2 has-[>svg]:px-3\",\n\t\t\t\tlarge: \"h-14 px-6 has-[>svg]:px-4\",\n\t\t\t\ticon: \"size-6\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tvariant: \"default\",\n\t\t\tsize: \"default\",\n\t\t},\n\t}\n);\n\nexport type CossistantButtonProps = React.ComponentProps<\"button\"> &\n\tVariantProps<typeof coButtonVariants>;\n\n/**\n * Styled button primitive that forwards variant and size props to the shared\n * design tokens.\n */\nexport function Button({\n\tclassName,\n\tvariant,\n\tsize,\n\t...props\n}: CossistantButtonProps): React.ReactElement {\n\treturn (\n\t\t<ButtonPrimitive\n\t\t\tclassName={cn(coButtonVariants({ variant, size, className }))}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n"],"mappings":";;;;;;AAKA,MAAa,mBAAmB,IAC/B,qeACA;CACC,UAAU;EACT,SAAS;GACR,SACC;GACD,WACC;GACD,OACC;GACD,SACC;GACD,KAAK;GACL,gBACC;GACD;EACD,MAAM;GACL,SAAS;GACT,OAAO;GACP,MAAM;GACN;EACD;CACD,iBAAiB;EAChB,SAAS;EACT,MAAM;EACN;CACD,CACD;;;;;AASD,SAAgB,OAAO,EACtB,WACA,SACA,KACA,GAAG,SAC0C;AAC7C,QACC,oBAACA;EACA,WAAW,GAAG,iBAAiB;GAAE;GAAS;GAAM;GAAW,CAAC,CAAC;EAC7D,GAAI;GACH"}
+{"version":3,"file":"button.js","names":["ButtonPrimitive"],"sources":["../../../src/support/components/button.tsx"],"sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\";\nimport type * as React from \"react\";\nimport { Button as ButtonPrimitive } from \"../../primitives/button\";\nimport { cn } from \"../utils\";\n\nexport const coButtonVariants = cva(\n\t\"group/btn inline-flex shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-md border font-medium text-sm outline-none transition-all hover:cursor-pointer focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tdefault:\n\t\t\t\t\t\"bg-co-primary text-co-primary-foreground hover:bg-co-primary/90\",\n\t\t\t\tsecondary:\n\t\t\t\t\t\"border-co-border/50 bg-co-background-50 hover:bg-co-background-100 hover:text-co-foreground dark:bg-co-background-300 dark:hover:bg-co-background-400\",\n\t\t\t\tghost:\n\t\t\t\t\t\"border-transparent hover:bg-co-background-200 hover:text-co-foreground dark:hover:bg-co-background-300\",\n\t\t\t\toutline:\n\t\t\t\t\t\"border border-co-border bg-co-background hover:bg-co-background-100 dark:bg-co-background-200 dark:hover:bg-co-background-300\",\n\t\t\t\ttab: \"opacity-40 hover:bg-co-background-100 hover:text-co-foreground hover:opacity-90 dark:hover:bg-co-background-200\",\n\t\t\t\t\"tab-selected\":\n\t\t\t\t\t\"hover:bg-co-background-100 hover:text-co-foreground dark:hover:bg-co-background-200\",\n\t\t\t},\n\t\t\tsize: {\n\t\t\t\tdefault: \"h-8 px-4 py-2 has-[>svg]:px-3\",\n\t\t\t\tlarge: \"h-14 px-6 has-[>svg]:px-4\",\n\t\t\t\ticon: \"size-6\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tvariant: \"default\",\n\t\t\tsize: \"default\",\n\t\t},\n\t}\n);\n\nexport type CossistantButtonProps = React.ComponentProps<\"button\"> &\n\tVariantProps<typeof coButtonVariants>;\n\n/**\n * Styled button primitive that forwards variant and size props to the shared\n * design tokens.\n */\nexport function CoButton({\n\tclassName,\n\tvariant,\n\tsize,\n\t...props\n}: CossistantButtonProps): React.ReactElement {\n\treturn (\n\t\t<ButtonPrimitive\n\t\t\tclassName={cn(coButtonVariants({ variant, size, className }))}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n"],"mappings":";;;;;;AAKA,MAAa,mBAAmB,IAC/B,qeACA;CACC,UAAU;EACT,SAAS;GACR,SACC;GACD,WACC;GACD,OACC;GACD,SACC;GACD,KAAK;GACL,gBACC;GACD;EACD,MAAM;GACL,SAAS;GACT,OAAO;GACP,MAAM;GACN;EACD;CACD,iBAAiB;EAChB,SAAS;EACT,MAAM;EACN;CACD,CACD;;;;;AASD,SAAgB,SAAS,EACxB,WACA,SACA,KACA,GAAG,SAC0C;AAC7C,QACC,oBAACA;EACA,WAAW,GAAG,iBAAiB;GAAE;GAAS;GAAM;GAAW,CAAC,CAAC;EAC7D,GAAI;GACH"}

package/support/components/conversation-event.js

@@ -45,13 +45,13 @@ const ConversationEvent = ({ event, availableAIAgents, createdAt, availableHuman
 			ease: "easeOut"
 		},
 		children: /* @__PURE__ */ jsxs("div", {
-			className: "flex items-center gap-2 text-muted-foreground text-xs",
+			className: "flex items-center gap-2 text-co-muted-foreground text-xs",
 			children: [
 				/* @__PURE__ */ jsx("div", {
 					className: "flex flex-col justify-end",
 					children: isAI ? /* @__PURE__ */ jsx("div", {
-						className: "flex size-5 items-center justify-center rounded-full bg-primary/10",
-						children: /* @__PURE__ */ jsx(CossistantLogo, { className: "h-3 w-3 text-primary" })
+						className: "flex size-5 items-center justify-center rounded-full bg-co-primary/10",
+						children: /* @__PURE__ */ jsx(CossistantLogo, { className: "h-3 w-3 text-co-primary" })
 					}) : /* @__PURE__ */ jsx(Avatar, {
 						className: "size-5 flex-shrink-0 overflow-clip rounded-full",
 						image: humanAgent?.image,

package/support/components/conversation-event.js.map

@@ -1 +1 @@
-{"version":3,"file":"conversation-event.js","names":["ConversationEvent: React.FC<ConversationEventProps>"],"sources":["../../../src/support/components/conversation-event.tsx"],"sourcesContent":["import type {\n\tAvailableAIAgent,\n\tAvailableHumanAgent,\n\tTimelinePartEvent,\n} from \"@cossistant/types\";\nimport { motion } from \"motion/react\";\nimport type React from \"react\";\nimport { useSupportText } from \"../text\";\nimport { Avatar } from \"./avatar\";\nimport { CossistantLogo } from \"./cossistant-branding\";\n\nexport type ConversationEventProps = {\n\tevent: TimelinePartEvent;\n\tavailableAIAgents: AvailableAIAgent[];\n\tavailableHumanAgents: AvailableHumanAgent[];\n\tcreatedAt?: string;\n};\n\nexport const ConversationEvent: React.FC<ConversationEventProps> = ({\n\tevent,\n\tavailableAIAgents,\n\tcreatedAt,\n\tavailableHumanAgents,\n}) => {\n\tconst text = useSupportText();\n\tconst isAI = event.actorAiAgentId !== null;\n\tconst humanAgent = availableHumanAgents.find(\n\t\t(agent) => agent.id === event.actorUserId\n\t);\n\tconst aiAgent = availableAIAgents.find(\n\t\t(agent) => agent.id === event.actorAiAgentId\n\t);\n\n\t// Get the actor name\n\tconst actorName = isAI\n\t\t? aiAgent?.name || text(\"common.fallbacks.cossistant\")\n\t\t: humanAgent?.name || text(\"common.fallbacks.someone\");\n\n\t// Convert event type to plain English\n\tconst getEventText = () => {\n\t\tswitch (event.eventType) {\n\t\t\tcase \"assigned\":\n\t\t\t\treturn text(\"component.conversationEvent.assigned\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"unassigned\":\n\t\t\t\treturn text(\"component.conversationEvent.unassigned\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"participant_requested\":\n\t\t\t\treturn text(\"component.conversationEvent.participantRequested\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"participant_joined\":\n\t\t\t\treturn text(\"component.conversationEvent.participantJoined\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"participant_left\":\n\t\t\t\treturn text(\"component.conversationEvent.participantLeft\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"status_changed\":\n\t\t\t\treturn text(\"component.conversationEvent.statusChanged\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"priority_changed\":\n\t\t\t\treturn text(\"component.conversationEvent.priorityChanged\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"tag_added\":\n\t\t\t\treturn text(\"component.conversationEvent.tagAdded\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"tag_removed\":\n\t\t\t\treturn text(\"component.conversationEvent.tagRemoved\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"resolved\":\n\t\t\t\treturn text(\"component.conversationEvent.resolved\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"reopened\":\n\t\t\t\treturn text(\"component.conversationEvent.reopened\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"visitor_blocked\":\n\t\t\t\treturn text(\"component.conversationEvent.visitorBlocked\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"visitor_unblocked\":\n\t\t\t\treturn text(\"component.conversationEvent.visitorUnblocked\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"visitor_identified\":\n\t\t\t\treturn text(\"component.conversationEvent.visitorIdentified\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tdefault:\n\t\t\t\treturn text(\"component.conversationEvent.default\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t}\n\t};\n\n\treturn (\n\t\t<motion.div\n\t\t\tanimate={{ opacity: 1, scale: 1 }}\n\t\t\tclassName=\"flex items-center justify-center py-4\"\n\t\t\tinitial={{ opacity: 0, scale: 0.95 }}\n\t\t\ttransition={{ duration: 0.3, ease: \"easeOut\" }}\n\t\t>\n\t\t\t<div className=\"flex items-center gap-2 text-muted-foreground text-xs\">\n\t\t\t\t<div className=\"flex flex-col justify-end\">\n\t\t\t\t\t{isAI ? (\n\t\t\t\t\t\t<div className=\"flex size-5 items-center justify-center rounded-full bg-primary/10\">\n\t\t\t\t\t\t\t<CossistantLogo className=\"h-3 w-3 text-primary\" />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<Avatar\n\t\t\t\t\t\t\tclassName=\"size-5 flex-shrink-0 overflow-clip rounded-full\"\n\t\t\t\t\t\t\timage={humanAgent?.image}\n\t\t\t\t\t\t\tname={humanAgent?.name || text(\"common.fallbacks.someone\")}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t<span className=\"px-2\">{getEventText()}</span>\n\t\t\t\t{createdAt && (\n\t\t\t\t\t<time className=\"text-[10px]\">\n\t\t\t\t\t\t{new Date(createdAt).toLocaleTimeString([], {\n\t\t\t\t\t\t\thour: \"2-digit\",\n\t\t\t\t\t\t\tminute: \"2-digit\",\n\t\t\t\t\t\t})}\n\t\t\t\t\t</time>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</motion.div>\n\t);\n};\n\nConversationEvent.displayName = \"ConversationEvent\";\n"],"mappings":";;;;;;;AAkBA,MAAaA,qBAAuD,EACnE,OACA,mBACA,WACA,2BACK;CACL,MAAM,OAAO,gBAAgB;CAC7B,MAAM,OAAO,MAAM,mBAAmB;CACtC,MAAM,aAAa,qBAAqB,MACtC,UAAU,MAAM,OAAO,MAAM,YAC9B;CACD,MAAM,UAAU,kBAAkB,MAChC,UAAU,MAAM,OAAO,MAAM,eAC9B;CAGD,MAAM,YAAY,OACf,SAAS,QAAQ,KAAK,8BAA8B,GACpD,YAAY,QAAQ,KAAK,2BAA2B;CAGvD,MAAM,qBAAqB;AAC1B,UAAQ,MAAM,WAAd;GACC,KAAK,WACJ,QAAO,KAAK,wCAAwC,EACnD,WACA,CAAC;GACH,KAAK,aACJ,QAAO,KAAK,0CAA0C,EACrD,WACA,CAAC;GACH,KAAK,wBACJ,QAAO,KAAK,oDAAoD,EAC/D,WACA,CAAC;GACH,KAAK,qBACJ,QAAO,KAAK,iDAAiD,EAC5D,WACA,CAAC;GACH,KAAK,mBACJ,QAAO,KAAK,+CAA+C,EAC1D,WACA,CAAC;GACH,KAAK,iBACJ,QAAO,KAAK,6CAA6C,EACxD,WACA,CAAC;GACH,KAAK,mBACJ,QAAO,KAAK,+CAA+C,EAC1D,WACA,CAAC;GACH,KAAK,YACJ,QAAO,KAAK,wCAAwC,EACnD,WACA,CAAC;GACH,KAAK,cACJ,QAAO,KAAK,0CAA0C,EACrD,WACA,CAAC;GACH,KAAK,WACJ,QAAO,KAAK,wCAAwC,EACnD,WACA,CAAC;GACH,KAAK,WACJ,QAAO,KAAK,wCAAwC,EACnD,WACA,CAAC;GACH,KAAK,kBACJ,QAAO,KAAK,8CAA8C,EACzD,WACA,CAAC;GACH,KAAK,oBACJ,QAAO,KAAK,gDAAgD,EAC3D,WACA,CAAC;GACH,KAAK,qBACJ,QAAO,KAAK,iDAAiD,EAC5D,WACA,CAAC;GACH,QACC,QAAO,KAAK,uCAAuC,EAClD,WACA,CAAC;;;AAIL,QACC,oBAAC,OAAO;EACP,SAAS;GAAE,SAAS;GAAG,OAAO;GAAG;EACjC,WAAU;EACV,SAAS;GAAE,SAAS;GAAG,OAAO;GAAM;EACpC,YAAY;GAAE,UAAU;GAAK,MAAM;GAAW;YAE9C,qBAAC;GAAI,WAAU;;IACd,oBAAC;KAAI,WAAU;eACb,OACA,oBAAC;MAAI,WAAU;gBACd,oBAAC,kBAAe,WAAU,yBAAyB;OAC9C,GAEN,oBAAC;MACA,WAAU;MACV,OAAO,YAAY;MACnB,MAAM,YAAY,QAAQ,KAAK,2BAA2B;OACzD;MAEE;IACN,oBAAC;KAAK,WAAU;eAAQ,cAAc;MAAQ;IAC7C,aACA,oBAAC;KAAK,WAAU;eACd,IAAI,KAAK,UAAU,CAAC,mBAAmB,EAAE,EAAE;MAC3C,MAAM;MACN,QAAQ;MACR,CAAC;MACI;;IAEH;GACM;;AAIf,kBAAkB,cAAc"}
+{"version":3,"file":"conversation-event.js","names":["ConversationEvent: React.FC<ConversationEventProps>"],"sources":["../../../src/support/components/conversation-event.tsx"],"sourcesContent":["import type {\n\tAvailableAIAgent,\n\tAvailableHumanAgent,\n\tTimelinePartEvent,\n} from \"@cossistant/types\";\nimport { motion } from \"motion/react\";\nimport type React from \"react\";\nimport { useSupportText } from \"../text\";\nimport { Avatar } from \"./avatar\";\nimport { CossistantLogo } from \"./cossistant-branding\";\n\nexport type ConversationEventProps = {\n\tevent: TimelinePartEvent;\n\tavailableAIAgents: AvailableAIAgent[];\n\tavailableHumanAgents: AvailableHumanAgent[];\n\tcreatedAt?: string;\n};\n\nexport const ConversationEvent: React.FC<ConversationEventProps> = ({\n\tevent,\n\tavailableAIAgents,\n\tcreatedAt,\n\tavailableHumanAgents,\n}) => {\n\tconst text = useSupportText();\n\tconst isAI = event.actorAiAgentId !== null;\n\tconst humanAgent = availableHumanAgents.find(\n\t\t(agent) => agent.id === event.actorUserId\n\t);\n\tconst aiAgent = availableAIAgents.find(\n\t\t(agent) => agent.id === event.actorAiAgentId\n\t);\n\n\t// Get the actor name\n\tconst actorName = isAI\n\t\t? aiAgent?.name || text(\"common.fallbacks.cossistant\")\n\t\t: humanAgent?.name || text(\"common.fallbacks.someone\");\n\n\t// Convert event type to plain English\n\tconst getEventText = () => {\n\t\tswitch (event.eventType) {\n\t\t\tcase \"assigned\":\n\t\t\t\treturn text(\"component.conversationEvent.assigned\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"unassigned\":\n\t\t\t\treturn text(\"component.conversationEvent.unassigned\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"participant_requested\":\n\t\t\t\treturn text(\"component.conversationEvent.participantRequested\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"participant_joined\":\n\t\t\t\treturn text(\"component.conversationEvent.participantJoined\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"participant_left\":\n\t\t\t\treturn text(\"component.conversationEvent.participantLeft\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"status_changed\":\n\t\t\t\treturn text(\"component.conversationEvent.statusChanged\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"priority_changed\":\n\t\t\t\treturn text(\"component.conversationEvent.priorityChanged\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"tag_added\":\n\t\t\t\treturn text(\"component.conversationEvent.tagAdded\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"tag_removed\":\n\t\t\t\treturn text(\"component.conversationEvent.tagRemoved\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"resolved\":\n\t\t\t\treturn text(\"component.conversationEvent.resolved\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"reopened\":\n\t\t\t\treturn text(\"component.conversationEvent.reopened\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"visitor_blocked\":\n\t\t\t\treturn text(\"component.conversationEvent.visitorBlocked\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"visitor_unblocked\":\n\t\t\t\treturn text(\"component.conversationEvent.visitorUnblocked\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tcase \"visitor_identified\":\n\t\t\t\treturn text(\"component.conversationEvent.visitorIdentified\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t\tdefault:\n\t\t\t\treturn text(\"component.conversationEvent.default\", {\n\t\t\t\t\tactorName,\n\t\t\t\t});\n\t\t}\n\t};\n\n\treturn (\n\t\t<motion.div\n\t\t\tanimate={{ opacity: 1, scale: 1 }}\n\t\t\tclassName=\"flex items-center justify-center py-4\"\n\t\t\tinitial={{ opacity: 0, scale: 0.95 }}\n\t\t\ttransition={{ duration: 0.3, ease: \"easeOut\" }}\n\t\t>\n\t\t\t<div className=\"flex items-center gap-2 text-co-muted-foreground text-xs\">\n\t\t\t\t<div className=\"flex flex-col justify-end\">\n\t\t\t\t\t{isAI ? (\n\t\t\t\t\t\t<div className=\"flex size-5 items-center justify-center rounded-full bg-co-primary/10\">\n\t\t\t\t\t\t\t<CossistantLogo className=\"h-3 w-3 text-co-primary\" />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<Avatar\n\t\t\t\t\t\t\tclassName=\"size-5 flex-shrink-0 overflow-clip rounded-full\"\n\t\t\t\t\t\t\timage={humanAgent?.image}\n\t\t\t\t\t\t\tname={humanAgent?.name || text(\"common.fallbacks.someone\")}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t<span className=\"px-2\">{getEventText()}</span>\n\t\t\t\t{createdAt && (\n\t\t\t\t\t<time className=\"text-[10px]\">\n\t\t\t\t\t\t{new Date(createdAt).toLocaleTimeString([], {\n\t\t\t\t\t\t\thour: \"2-digit\",\n\t\t\t\t\t\t\tminute: \"2-digit\",\n\t\t\t\t\t\t})}\n\t\t\t\t\t</time>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</motion.div>\n\t);\n};\n\nConversationEvent.displayName = \"ConversationEvent\";\n"],"mappings":";;;;;;;AAkBA,MAAaA,qBAAuD,EACnE,OACA,mBACA,WACA,2BACK;CACL,MAAM,OAAO,gBAAgB;CAC7B,MAAM,OAAO,MAAM,mBAAmB;CACtC,MAAM,aAAa,qBAAqB,MACtC,UAAU,MAAM,OAAO,MAAM,YAC9B;CACD,MAAM,UAAU,kBAAkB,MAChC,UAAU,MAAM,OAAO,MAAM,eAC9B;CAGD,MAAM,YAAY,OACf,SAAS,QAAQ,KAAK,8BAA8B,GACpD,YAAY,QAAQ,KAAK,2BAA2B;CAGvD,MAAM,qBAAqB;AAC1B,UAAQ,MAAM,WAAd;GACC,KAAK,WACJ,QAAO,KAAK,wCAAwC,EACnD,WACA,CAAC;GACH,KAAK,aACJ,QAAO,KAAK,0CAA0C,EACrD,WACA,CAAC;GACH,KAAK,wBACJ,QAAO,KAAK,oDAAoD,EAC/D,WACA,CAAC;GACH,KAAK,qBACJ,QAAO,KAAK,iDAAiD,EAC5D,WACA,CAAC;GACH,KAAK,mBACJ,QAAO,KAAK,+CAA+C,EAC1D,WACA,CAAC;GACH,KAAK,iBACJ,QAAO,KAAK,6CAA6C,EACxD,WACA,CAAC;GACH,KAAK,mBACJ,QAAO,KAAK,+CAA+C,EAC1D,WACA,CAAC;GACH,KAAK,YACJ,QAAO,KAAK,wCAAwC,EACnD,WACA,CAAC;GACH,KAAK,cACJ,QAAO,KAAK,0CAA0C,EACrD,WACA,CAAC;GACH,KAAK,WACJ,QAAO,KAAK,wCAAwC,EACnD,WACA,CAAC;GACH,KAAK,WACJ,QAAO,KAAK,wCAAwC,EACnD,WACA,CAAC;GACH,KAAK,kBACJ,QAAO,KAAK,8CAA8C,EACzD,WACA,CAAC;GACH,KAAK,oBACJ,QAAO,KAAK,gDAAgD,EAC3D,WACA,CAAC;GACH,KAAK,qBACJ,QAAO,KAAK,iDAAiD,EAC5D,WACA,CAAC;GACH,QACC,QAAO,KAAK,uCAAuC,EAClD,WACA,CAAC;;;AAIL,QACC,oBAAC,OAAO;EACP,SAAS;GAAE,SAAS;GAAG,OAAO;GAAG;EACjC,WAAU;EACV,SAAS;GAAE,SAAS;GAAG,OAAO;GAAM;EACpC,YAAY;GAAE,UAAU;GAAK,MAAM;GAAW;YAE9C,qBAAC;GAAI,WAAU;;IACd,oBAAC;KAAI,WAAU;eACb,OACA,oBAAC;MAAI,WAAU;gBACd,oBAAC,kBAAe,WAAU,4BAA4B;OACjD,GAEN,oBAAC;MACA,WAAU;MACV,OAAO,YAAY;MACnB,MAAM,YAAY,QAAQ,KAAK,2BAA2B;OACzD;MAEE;IACN,oBAAC;KAAK,WAAU;eAAQ,cAAc;MAAQ;IAC7C,aACA,oBAAC;KAAK,WAAU;eACd,IAAI,KAAK,UAAU,CAAC,mBAAmB,EAAE,EAAE;MAC3C,MAAM;MACN,QAAQ;MACR,CAAC;MACI;;IAEH;GACM;;AAIf,kBAAkB,cAAc"}

package/support/components/header.js

@@ -1,6 +1,6 @@
 import { cn } from "../utils/index.js";
 import { useSupportConfig } from "../store/support-store.js";
-import { Button } from "./button.js";
+import { CoButton } from "./button.js";
 import icons_default from "./icons.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 
@@ -14,7 +14,7 @@ const Header = ({ className, children, actions, onGoBack }) => {
 			children: [
 				/* @__PURE__ */ jsxs("div", {
 					className: "flex flex-1 items-center gap-3",
-					children: [onGoBack && /* @__PURE__ */ jsx(Button, {
+					children: [onGoBack && /* @__PURE__ */ jsx(CoButton, {
 						onClick: onGoBack,
 						size: "icon",
 						type: "button",
@@ -26,7 +26,7 @@ const Header = ({ className, children, actions, onGoBack }) => {
 					className: "flex items-center gap-2",
 					children: actions
 				}),
-				/* @__PURE__ */ jsx(Button, {
+				/* @__PURE__ */ jsx(CoButton, {
 					onClick: close,
 					size: "icon",
 					type: "button",

package/support/components/header.js.map

@@ -1 +1 @@
-{"version":3,"file":"header.js","names":["Header: React.FC<HeaderProps>","Icon"],"sources":["../../../src/support/components/header.tsx"],"sourcesContent":["import { useSupportConfig } from \"../store\";\nimport { cn } from \"../utils\";\nimport { Button } from \"./button\";\nimport Icon from \"./icons\";\n\nexport type HeaderProps = {\n\tclassName?: string;\n\tchildren?: React.ReactNode;\n\tactions?: React.ReactNode;\n\tonGoBack?: () => void;\n};\n\nexport const Header: React.FC<HeaderProps> = ({\n\tclassName,\n\tchildren,\n\tactions,\n\tonGoBack,\n}) => {\n\tconst { close } = useSupportConfig();\n\n\treturn (\n\t\t<div className={cn(\"absolute inset-x-0 top-0 z-10 h-18\", className)}>\n\t\t\t<div className=\"absolute inset-0 z-10 flex items-center justify-between gap-3 px-4\">\n\t\t\t\t<div className=\"flex flex-1 items-center gap-3\">\n\t\t\t\t\t{onGoBack && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tonClick={onGoBack}\n\t\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Icon name=\"arrow-left\" />\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t)}\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t\t{actions && <div className=\"flex items-center gap-2\">{actions}</div>}\n\t\t\t\t<Button onClick={close} size=\"icon\" type=\"button\" variant=\"ghost\">\n\t\t\t\t\t<Icon name=\"close\" />\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"],"mappings":";;;;;;;AAYA,MAAaA,UAAiC,EAC7C,WACA,UACA,SACA,eACK;CACL,MAAM,EAAE,UAAU,kBAAkB;AAEpC,QACC,oBAAC;EAAI,WAAW,GAAG,sCAAsC,UAAU;YAClE,qBAAC;GAAI,WAAU;;IACd,qBAAC;KAAI,WAAU;gBACb,YACA,oBAAC;MACA,SAAS;MACT,MAAK;MACL,MAAK;MACL,SAAQ;gBAER,oBAACC,iBAAK,MAAK,eAAe;OAClB,EAET;MACI;IACL,WAAW,oBAAC;KAAI,WAAU;eAA2B;MAAc;IACpE,oBAAC;KAAO,SAAS;KAAO,MAAK;KAAO,MAAK;KAAS,SAAQ;eACzD,oBAACA,iBAAK,MAAK,UAAU;MACb;;IACJ;GACD"}
+{"version":3,"file":"header.js","names":["Header: React.FC<HeaderProps>","Icon"],"sources":["../../../src/support/components/header.tsx"],"sourcesContent":["import { useSupportConfig } from \"../store\";\nimport { cn } from \"../utils\";\nimport { CoButton } from \"./button\";\nimport Icon from \"./icons\";\n\nexport type HeaderProps = {\n\tclassName?: string;\n\tchildren?: React.ReactNode;\n\tactions?: React.ReactNode;\n\tonGoBack?: () => void;\n};\n\nexport const Header: React.FC<HeaderProps> = ({\n\tclassName,\n\tchildren,\n\tactions,\n\tonGoBack,\n}) => {\n\tconst { close } = useSupportConfig();\n\n\treturn (\n\t\t<div className={cn(\"absolute inset-x-0 top-0 z-10 h-18\", className)}>\n\t\t\t<div className=\"absolute inset-0 z-10 flex items-center justify-between gap-3 px-4\">\n\t\t\t\t<div className=\"flex flex-1 items-center gap-3\">\n\t\t\t\t\t{onGoBack && (\n\t\t\t\t\t\t<CoButton\n\t\t\t\t\t\t\tonClick={onGoBack}\n\t\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Icon name=\"arrow-left\" />\n\t\t\t\t\t\t</CoButton>\n\t\t\t\t\t)}\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t\t{actions && <div className=\"flex items-center gap-2\">{actions}</div>}\n\t\t\t\t<CoButton onClick={close} size=\"icon\" type=\"button\" variant=\"ghost\">\n\t\t\t\t\t<Icon name=\"close\" />\n\t\t\t\t</CoButton>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"],"mappings":";;;;;;;AAYA,MAAaA,UAAiC,EAC7C,WACA,UACA,SACA,eACK;CACL,MAAM,EAAE,UAAU,kBAAkB;AAEpC,QACC,oBAAC;EAAI,WAAW,GAAG,sCAAsC,UAAU;YAClE,qBAAC;GAAI,WAAU;;IACd,qBAAC;KAAI,WAAU;gBACb,YACA,oBAAC;MACA,SAAS;MACT,MAAK;MACL,MAAK;MACL,SAAQ;gBAER,oBAACC,iBAAK,MAAK,eAAe;OAChB,EAEX;MACI;IACL,WAAW,oBAAC;KAAI,WAAU;eAA2B;MAAc;IACpE,oBAAC;KAAS,SAAS;KAAO,MAAK;KAAO,MAAK;KAAS,SAAQ;eAC3D,oBAACA,iBAAK,MAAK,UAAU;MACX;;IACN;GACD"}

package/support/components/multimodal-input.js

@@ -83,7 +83,7 @@ const MultimodalInput = ({ className, value, onChange, onSubmit, onFileSelect, p
 			/* @__PURE__ */ jsxs("div", {
 				className: "flex flex-col rounded border border-co-border/50 bg-co-background-100 dark:bg-co-background-200",
 				children: [/* @__PURE__ */ jsx(MultimodalInput$1, {
-					className: cn("flex-1 resize-none overflow-hidden p-3 text-co-foreground text-sm placeholder:text-primary/40 focus-visible:outline-none", className),
+					className: cn("flex-1 resize-none overflow-hidden p-3 text-co-foreground text-sm placeholder:text-co-primary/40 focus-visible:outline-none", className),
 					disabled: disabled || isSubmitting,
 					error,
 					onChange,

package/support/components/multimodal-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"multimodal-input.js","names":["MultimodalInput: React.FC<MultimodalInputProps>","Icon","Primitive.MultimodalInput","SendButton: React.FC<SendButtonProps>","Primitive.Button"],"sources":["../../../src/support/components/multimodal-input.tsx"],"sourcesContent":["\"use client\";\n\nimport type React from \"react\";\nimport { useRef } from \"react\";\nimport { useComposerRefocus } from \"../../hooks/use-composer-refocus\";\nimport * as Primitive from \"../../primitives\";\nimport { useSupportText } from \"../text\";\nimport { cn } from \"../utils\";\nimport Icon from \"./icons\";\nimport { Watermark } from \"./watermark\";\n\nexport type MultimodalInputProps = {\n\tclassName?: string;\n\tvalue: string;\n\tonChange: (value: string) => void;\n\tonSubmit: () => void;\n\tonFileSelect?: (files: File[]) => void;\n\tplaceholder?: string;\n\tdisabled?: boolean;\n\tisSubmitting?: boolean;\n\terror?: Error | null;\n\tfiles?: File[];\n\tonRemoveFile?: (index: number) => void;\n\tmaxFiles?: number;\n\tmaxFileSize?: number;\n\tallowedFileTypes?: string[];\n};\n\nexport const MultimodalInput: React.FC<MultimodalInputProps> = ({\n\tclassName,\n\tvalue,\n\tonChange,\n\tonSubmit,\n\tonFileSelect,\n\tplaceholder,\n\tdisabled = false,\n\tisSubmitting = false,\n\terror,\n\tfiles = [],\n\tonRemoveFile,\n\tmaxFiles = 5,\n\tmaxFileSize = 10 * 1024 * 1024, // 10MB\n\tallowedFileTypes = [\"image/*\", \"application/pdf\", \"text/*\"],\n}) => {\n\tconst fileInputRef = useRef<HTMLInputElement>(null);\n\tconst hasContent = value.trim().length > 0 || files.length > 0;\n\tconst { focusComposer, inputRef } = useComposerRefocus({\n\t\tdisabled,\n\t\thasContent,\n\t\tisSubmitting,\n\t});\n\tconst canSubmit = !(disabled || isSubmitting) && hasContent;\n\tconst text = useSupportText();\n\tconst resolvedPlaceholder =\n\t\tplaceholder ?? text(\"component.multimodalInput.placeholder\");\n\n\tconst handleSubmit = () => {\n\t\tif (!canSubmit) {\n\t\t\treturn;\n\t\t}\n\n\t\tonSubmit();\n\t\tfocusComposer();\n\t};\n\n\tconst handleFormSubmit = (e: React.FormEvent) => {\n\t\te.preventDefault();\n\t\thandleSubmit();\n\t};\n\n\tconst handleAttachClick = () => {\n\t\tif (files.length < maxFiles) {\n\t\t\tfileInputRef.current?.click();\n\t\t}\n\t};\n\n\tconst formatFileSize = (bytes: number) => {\n\t\tif (bytes < 1024) {\n\t\t\treturn `${bytes} B`;\n\t\t}\n\t\tif (bytes < 1024 * 1024) {\n\t\t\treturn `${(bytes / 1024).toFixed(1)} KB`;\n\t\t}\n\t\treturn `${(bytes / (1024 * 1024)).toFixed(1)} MB`;\n\t};\n\n\treturn (\n\t\t<form className=\"flex flex-col gap-2\" onSubmit={handleFormSubmit}>\n\t\t\t{/* Error message */}\n\t\t\t{error && (\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"rounded-md bg-co-destructive-muted p-2 text-co-destructive text-xs\"\n\t\t\t\t\tid=\"multimodal-input-error\"\n\t\t\t\t>\n\t\t\t\t\t{error.message}\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t{/* File attachments */}\n\t\t\t{files.length > 0 && (\n\t\t\t\t<div className=\"flex flex-wrap gap-2 p-2\">\n\t\t\t\t\t{files.map((file, index) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName=\"flex items-center gap-2 rounded-md bg-co-muted px-2 py-1 text-xs\"\n\t\t\t\t\t\t\tkey={`${file.name}-${index}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Icon className=\"h-3 w-3\" name=\"attachment\" />\n\t\t\t\t\t\t\t<span className=\"max-w-[150px] truncate\">{file.name}</span>\n\t\t\t\t\t\t\t<span className=\"text-co-muted-foreground\">\n\t\t\t\t\t\t\t\t{formatFileSize(file.size)}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t{onRemoveFile && (\n\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\taria-label={text(\"common.actions.removeFile\", {\n\t\t\t\t\t\t\t\t\t\tfileName: file.name,\n\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\tclassName=\"ml-1 hover:text-co-destructive\"\n\t\t\t\t\t\t\t\t\tonClick={() => onRemoveFile(index)}\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<Icon className=\"h-3 w-3\" name=\"close\" />\n\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t{/* Input area */}\n\t\t\t<div className=\"flex flex-col rounded border border-co-border/50 bg-co-background-100 dark:bg-co-background-200\">\n\t\t\t\t<Primitive.MultimodalInput\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"flex-1 resize-none overflow-hidden p-3 text-co-foreground text-sm placeholder:text-primary/40 focus-visible:outline-none\",\n\t\t\t\t\t\tclassName\n\t\t\t\t\t)}\n\t\t\t\t\tdisabled={disabled || isSubmitting}\n\t\t\t\t\terror={error}\n\t\t\t\t\tonChange={onChange}\n\t\t\t\t\tonFileSelect={onFileSelect}\n\t\t\t\t\tonSubmit={handleSubmit}\n\t\t\t\t\tplaceholder={resolvedPlaceholder}\n\t\t\t\t\tref={inputRef}\n\t\t\t\t\tvalue={value}\n\t\t\t\t/>\n\n\t\t\t\t<div className=\"flex items-center justify-between py-1 pr-1 pl-3\">\n\t\t\t\t\t<Watermark />\n\n\t\t\t\t\t<div className=\"flex items-center gap-0.5\">\n\t\t\t\t\t\t{/* File attachment button */}\n\t\t\t\t\t\t{/* {onFileSelect && (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\taria-label={text(\"common.actions.attachFiles\")}\n\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\"group flex h-8 w-8 items-center justify-center rounded-md text-co-muted-foreground hover:bg-co-muted hover:text-co-foreground disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t\t\t\t\t\t\t\t\tfiles.length >= maxFiles && \"opacity-50\"\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\tdisabled={\n\t\t\t\t\t\t\t\t\t\tdisabled || isSubmitting || files.length >= maxFiles\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={handleAttachClick}\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<Icon className=\"h-4 w-4\" name=\"attachment\" />\n\t\t\t\t\t\t\t\t</button>\n\n\t\t\t\t\t\t\t\t<Primitive.FileInput\n\t\t\t\t\t\t\t\t\taccept={allowedFileTypes.join(\",\")}\n\t\t\t\t\t\t\t\t\tclassName=\"hidden\"\n\t\t\t\t\t\t\t\t\tdisabled={\n\t\t\t\t\t\t\t\t\t\tdisabled || isSubmitting || files.length >= maxFiles\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonFileSelect={onFileSelect}\n\t\t\t\t\t\t\t\t\tref={fileInputRef}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)} */}\n\n\t\t\t\t\t\t{/* Send button */}\n\t\t\t\t\t\t<SendButton disabled={!canSubmit} />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</form>\n\t);\n};\n\nexport type SendButtonProps = {\n\tclassName?: string;\n\tdisabled?: boolean;\n};\n\nexport const SendButton: React.FC<SendButtonProps> = ({\n\tclassName,\n\tdisabled = false,\n}) => (\n\t<Primitive.Button\n\t\tclassName={cn(\n\t\t\t\"group flex h-8 w-8 items-center justify-center rounded-md text-co-primary hover:bg-co-muted disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t\tclassName\n\t\t)}\n\t\tdisabled={disabled}\n\t\ttype=\"submit\"\n\t>\n\t\t<Icon className=\"h-4 w-4\" filledOnHover name=\"send\" />\n\t</Primitive.Button>\n);\n"],"mappings":";;;;;;;;;;;;;;AA4BA,MAAaA,mBAAmD,EAC/D,WACA,OACA,UACA,UACA,cACA,aACA,WAAW,OACX,eAAe,OACf,OACA,QAAQ,EAAE,EACV,cACA,WAAW,GACX,cAAc,KAAK,OAAO,MAC1B,mBAAmB;CAAC;CAAW;CAAmB;CAAS,OACtD;AACgB,QAAyB,KAAK;CACnD,MAAM,aAAa,MAAM,MAAM,CAAC,SAAS,KAAK,MAAM,SAAS;CAC7D,MAAM,EAAE,eAAe,aAAa,mBAAmB;EACtD;EACA;EACA;EACA,CAAC;CACF,MAAM,YAAY,EAAE,YAAY,iBAAiB;CACjD,MAAM,OAAO,gBAAgB;CAC7B,MAAM,sBACL,eAAe,KAAK,wCAAwC;CAE7D,MAAM,qBAAqB;AAC1B,MAAI,CAAC,UACJ;AAGD,YAAU;AACV,iBAAe;;CAGhB,MAAM,oBAAoB,MAAuB;AAChD,IAAE,gBAAgB;AAClB,gBAAc;;CASf,MAAM,kBAAkB,UAAkB;AACzC,MAAI,QAAQ,KACX,QAAO,GAAG,MAAM;AAEjB,MAAI,QAAQ,OAAO,KAClB,QAAO,IAAI,QAAQ,MAAM,QAAQ,EAAE,CAAC;AAErC,SAAO,IAAI,SAAS,OAAO,OAAO,QAAQ,EAAE,CAAC;;AAG9C,QACC,qBAAC;EAAK,WAAU;EAAsB,UAAU;;GAE9C,SACA,oBAAC;IACA,WAAU;IACV,IAAG;cAEF,MAAM;KACF;GAIN,MAAM,SAAS,KACf,oBAAC;IAAI,WAAU;cACb,MAAM,KAAK,MAAM,UACjB,qBAAC;KACA,WAAU;;MAGV,oBAACC;OAAK,WAAU;OAAU,MAAK;QAAe;MAC9C,oBAAC;OAAK,WAAU;iBAA0B,KAAK;QAAY;MAC3D,oBAAC;OAAK,WAAU;iBACd,eAAe,KAAK,KAAK;QACpB;MACN,gBACA,oBAAC;OACA,cAAY,KAAK,6BAA6B,EAC7C,UAAU,KAAK,MACf,CAAC;OACF,WAAU;OACV,eAAe,aAAa,MAAM;OAClC,MAAK;iBAEL,oBAACA;QAAK,WAAU;QAAU,MAAK;SAAU;QACjC;;OAjBL,GAAG,KAAK,KAAK,GAAG,QAmBhB,CACL;KACG;GAIP,qBAAC;IAAI,WAAU;eACd,oBAACC;KACA,WAAW,GACV,4HACA,UACA;KACD,UAAU,YAAY;KACf;KACG;KACI;KACd,UAAU;KACV,aAAa;KACb,KAAK;KACE;MACN,EAEF,qBAAC;KAAI,WAAU;gBACd,oBAAC,cAAY,EAEb,oBAAC;MAAI,WAAU;gBAgCd,oBAAC,cAAW,UAAU,CAAC,YAAa;OAC/B;MACD;KACD;;GACA;;AAST,MAAaC,cAAyC,EACrD,WACA,WAAW,YAEX,oBAACC;CACA,WAAW,GACV,+IACA,UACA;CACS;CACV,MAAK;WAEL,oBAACH;EAAK,WAAU;EAAU;EAAc,MAAK;GAAS;EACpC"}
+{"version":3,"file":"multimodal-input.js","names":["MultimodalInput: React.FC<MultimodalInputProps>","Icon","Primitive.MultimodalInput","SendButton: React.FC<SendButtonProps>","Primitive.Button"],"sources":["../../../src/support/components/multimodal-input.tsx"],"sourcesContent":["\"use client\";\n\nimport type React from \"react\";\nimport { useRef } from \"react\";\nimport { useComposerRefocus } from \"../../hooks/use-composer-refocus\";\nimport * as Primitive from \"../../primitives\";\nimport { useSupportText } from \"../text\";\nimport { cn } from \"../utils\";\nimport Icon from \"./icons\";\nimport { Watermark } from \"./watermark\";\n\nexport type MultimodalInputProps = {\n\tclassName?: string;\n\tvalue: string;\n\tonChange: (value: string) => void;\n\tonSubmit: () => void;\n\tonFileSelect?: (files: File[]) => void;\n\tplaceholder?: string;\n\tdisabled?: boolean;\n\tisSubmitting?: boolean;\n\terror?: Error | null;\n\tfiles?: File[];\n\tonRemoveFile?: (index: number) => void;\n\tmaxFiles?: number;\n\tmaxFileSize?: number;\n\tallowedFileTypes?: string[];\n};\n\nexport const MultimodalInput: React.FC<MultimodalInputProps> = ({\n\tclassName,\n\tvalue,\n\tonChange,\n\tonSubmit,\n\tonFileSelect,\n\tplaceholder,\n\tdisabled = false,\n\tisSubmitting = false,\n\terror,\n\tfiles = [],\n\tonRemoveFile,\n\tmaxFiles = 5,\n\tmaxFileSize = 10 * 1024 * 1024, // 10MB\n\tallowedFileTypes = [\"image/*\", \"application/pdf\", \"text/*\"],\n}) => {\n\tconst fileInputRef = useRef<HTMLInputElement>(null);\n\tconst hasContent = value.trim().length > 0 || files.length > 0;\n\tconst { focusComposer, inputRef } = useComposerRefocus({\n\t\tdisabled,\n\t\thasContent,\n\t\tisSubmitting,\n\t});\n\tconst canSubmit = !(disabled || isSubmitting) && hasContent;\n\tconst text = useSupportText();\n\tconst resolvedPlaceholder =\n\t\tplaceholder ?? text(\"component.multimodalInput.placeholder\");\n\n\tconst handleSubmit = () => {\n\t\tif (!canSubmit) {\n\t\t\treturn;\n\t\t}\n\n\t\tonSubmit();\n\t\tfocusComposer();\n\t};\n\n\tconst handleFormSubmit = (e: React.FormEvent) => {\n\t\te.preventDefault();\n\t\thandleSubmit();\n\t};\n\n\tconst handleAttachClick = () => {\n\t\tif (files.length < maxFiles) {\n\t\t\tfileInputRef.current?.click();\n\t\t}\n\t};\n\n\tconst formatFileSize = (bytes: number) => {\n\t\tif (bytes < 1024) {\n\t\t\treturn `${bytes} B`;\n\t\t}\n\t\tif (bytes < 1024 * 1024) {\n\t\t\treturn `${(bytes / 1024).toFixed(1)} KB`;\n\t\t}\n\t\treturn `${(bytes / (1024 * 1024)).toFixed(1)} MB`;\n\t};\n\n\treturn (\n\t\t<form className=\"flex flex-col gap-2\" onSubmit={handleFormSubmit}>\n\t\t\t{/* Error message */}\n\t\t\t{error && (\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"rounded-md bg-co-destructive-muted p-2 text-co-destructive text-xs\"\n\t\t\t\t\tid=\"multimodal-input-error\"\n\t\t\t\t>\n\t\t\t\t\t{error.message}\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t{/* File attachments */}\n\t\t\t{files.length > 0 && (\n\t\t\t\t<div className=\"flex flex-wrap gap-2 p-2\">\n\t\t\t\t\t{files.map((file, index) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName=\"flex items-center gap-2 rounded-md bg-co-muted px-2 py-1 text-xs\"\n\t\t\t\t\t\t\tkey={`${file.name}-${index}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Icon className=\"h-3 w-3\" name=\"attachment\" />\n\t\t\t\t\t\t\t<span className=\"max-w-[150px] truncate\">{file.name}</span>\n\t\t\t\t\t\t\t<span className=\"text-co-muted-foreground\">\n\t\t\t\t\t\t\t\t{formatFileSize(file.size)}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t{onRemoveFile && (\n\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\taria-label={text(\"common.actions.removeFile\", {\n\t\t\t\t\t\t\t\t\t\tfileName: file.name,\n\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\tclassName=\"ml-1 hover:text-co-destructive\"\n\t\t\t\t\t\t\t\t\tonClick={() => onRemoveFile(index)}\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<Icon className=\"h-3 w-3\" name=\"close\" />\n\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t{/* Input area */}\n\t\t\t<div className=\"flex flex-col rounded border border-co-border/50 bg-co-background-100 dark:bg-co-background-200\">\n\t\t\t\t<Primitive.MultimodalInput\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"flex-1 resize-none overflow-hidden p-3 text-co-foreground text-sm placeholder:text-co-primary/40 focus-visible:outline-none\",\n\t\t\t\t\t\tclassName\n\t\t\t\t\t)}\n\t\t\t\t\tdisabled={disabled || isSubmitting}\n\t\t\t\t\terror={error}\n\t\t\t\t\tonChange={onChange}\n\t\t\t\t\tonFileSelect={onFileSelect}\n\t\t\t\t\tonSubmit={handleSubmit}\n\t\t\t\t\tplaceholder={resolvedPlaceholder}\n\t\t\t\t\tref={inputRef}\n\t\t\t\t\tvalue={value}\n\t\t\t\t/>\n\n\t\t\t\t<div className=\"flex items-center justify-between py-1 pr-1 pl-3\">\n\t\t\t\t\t<Watermark />\n\n\t\t\t\t\t<div className=\"flex items-center gap-0.5\">\n\t\t\t\t\t\t{/* File attachment button */}\n\t\t\t\t\t\t{/* {onFileSelect && (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\taria-label={text(\"common.actions.attachFiles\")}\n\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\"group flex h-8 w-8 items-center justify-center rounded-md text-co-muted-foreground hover:bg-co-muted hover:text-co-foreground disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t\t\t\t\t\t\t\t\tfiles.length >= maxFiles && \"opacity-50\"\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\tdisabled={\n\t\t\t\t\t\t\t\t\t\tdisabled || isSubmitting || files.length >= maxFiles\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={handleAttachClick}\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<Icon className=\"h-4 w-4\" name=\"attachment\" />\n\t\t\t\t\t\t\t\t</button>\n\n\t\t\t\t\t\t\t\t<Primitive.FileInput\n\t\t\t\t\t\t\t\t\taccept={allowedFileTypes.join(\",\")}\n\t\t\t\t\t\t\t\t\tclassName=\"hidden\"\n\t\t\t\t\t\t\t\t\tdisabled={\n\t\t\t\t\t\t\t\t\t\tdisabled || isSubmitting || files.length >= maxFiles\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonFileSelect={onFileSelect}\n\t\t\t\t\t\t\t\t\tref={fileInputRef}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)} */}\n\n\t\t\t\t\t\t{/* Send button */}\n\t\t\t\t\t\t<SendButton disabled={!canSubmit} />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</form>\n\t);\n};\n\nexport type SendButtonProps = {\n\tclassName?: string;\n\tdisabled?: boolean;\n};\n\nexport const SendButton: React.FC<SendButtonProps> = ({\n\tclassName,\n\tdisabled = false,\n}) => (\n\t<Primitive.Button\n\t\tclassName={cn(\n\t\t\t\"group flex h-8 w-8 items-center justify-center rounded-md text-co-primary hover:bg-co-muted disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t\tclassName\n\t\t)}\n\t\tdisabled={disabled}\n\t\ttype=\"submit\"\n\t>\n\t\t<Icon className=\"h-4 w-4\" filledOnHover name=\"send\" />\n\t</Primitive.Button>\n);\n"],"mappings":";;;;;;;;;;;;;;AA4BA,MAAaA,mBAAmD,EAC/D,WACA,OACA,UACA,UACA,cACA,aACA,WAAW,OACX,eAAe,OACf,OACA,QAAQ,EAAE,EACV,cACA,WAAW,GACX,cAAc,KAAK,OAAO,MAC1B,mBAAmB;CAAC;CAAW;CAAmB;CAAS,OACtD;AACgB,QAAyB,KAAK;CACnD,MAAM,aAAa,MAAM,MAAM,CAAC,SAAS,KAAK,MAAM,SAAS;CAC7D,MAAM,EAAE,eAAe,aAAa,mBAAmB;EACtD;EACA;EACA;EACA,CAAC;CACF,MAAM,YAAY,EAAE,YAAY,iBAAiB;CACjD,MAAM,OAAO,gBAAgB;CAC7B,MAAM,sBACL,eAAe,KAAK,wCAAwC;CAE7D,MAAM,qBAAqB;AAC1B,MAAI,CAAC,UACJ;AAGD,YAAU;AACV,iBAAe;;CAGhB,MAAM,oBAAoB,MAAuB;AAChD,IAAE,gBAAgB;AAClB,gBAAc;;CASf,MAAM,kBAAkB,UAAkB;AACzC,MAAI,QAAQ,KACX,QAAO,GAAG,MAAM;AAEjB,MAAI,QAAQ,OAAO,KAClB,QAAO,IAAI,QAAQ,MAAM,QAAQ,EAAE,CAAC;AAErC,SAAO,IAAI,SAAS,OAAO,OAAO,QAAQ,EAAE,CAAC;;AAG9C,QACC,qBAAC;EAAK,WAAU;EAAsB,UAAU;;GAE9C,SACA,oBAAC;IACA,WAAU;IACV,IAAG;cAEF,MAAM;KACF;GAIN,MAAM,SAAS,KACf,oBAAC;IAAI,WAAU;cACb,MAAM,KAAK,MAAM,UACjB,qBAAC;KACA,WAAU;;MAGV,oBAACC;OAAK,WAAU;OAAU,MAAK;QAAe;MAC9C,oBAAC;OAAK,WAAU;iBAA0B,KAAK;QAAY;MAC3D,oBAAC;OAAK,WAAU;iBACd,eAAe,KAAK,KAAK;QACpB;MACN,gBACA,oBAAC;OACA,cAAY,KAAK,6BAA6B,EAC7C,UAAU,KAAK,MACf,CAAC;OACF,WAAU;OACV,eAAe,aAAa,MAAM;OAClC,MAAK;iBAEL,oBAACA;QAAK,WAAU;QAAU,MAAK;SAAU;QACjC;;OAjBL,GAAG,KAAK,KAAK,GAAG,QAmBhB,CACL;KACG;GAIP,qBAAC;IAAI,WAAU;eACd,oBAACC;KACA,WAAW,GACV,+HACA,UACA;KACD,UAAU,YAAY;KACf;KACG;KACI;KACd,UAAU;KACV,aAAa;KACb,KAAK;KACE;MACN,EAEF,qBAAC;KAAI,WAAU;gBACd,oBAAC,cAAY,EAEb,oBAAC;MAAI,WAAU;gBAgCd,oBAAC,cAAW,UAAU,CAAC,YAAa;OAC/B;MACD;KACD;;GACA;;AAST,MAAaC,cAAyC,EACrD,WACA,WAAW,YAEX,oBAACC;CACA,WAAW,GACV,+IACA,UACA;CACS;CACV,MAAK;WAEL,oBAACH;EAAK,WAAU;EAAU;EAAc,MAAK;GAAS;EACpC"}

package/support/components/navigation-tab.js

@@ -1,5 +1,5 @@
 import { useSupportNavigation } from "../store/support-store.js";
-import { Button } from "./button.js";
+import { CoButton } from "./button.js";
 import icons_default from "./icons.js";
 import { Text } from "../text/index.js";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -13,7 +13,7 @@ function NavigationTab() {
 	const { current, navigate } = useSupportNavigation();
 	return /* @__PURE__ */ jsxs("div", {
 		className: "flex w-full items-center justify-center gap-2",
-		children: [/* @__PURE__ */ jsxs(Button, {
+		children: [/* @__PURE__ */ jsxs(CoButton, {
 			onClick: () => navigate({ page: "HOME" }),
 			variant: current.page === "HOME" ? "tab-selected" : "tab",
 			children: [/* @__PURE__ */ jsx(icons_default, {
@@ -24,7 +24,7 @@ function NavigationTab() {
 				as: "span",
 				textKey: "component.navigation.home"
 			})]
-		}), /* @__PURE__ */ jsxs(Button, {
+		}), /* @__PURE__ */ jsxs(CoButton, {
 			onClick: () => navigate({ page: "ARTICLES" }),
 			variant: current.page === "ARTICLES" ? "tab-selected" : "tab",
 			children: [/* @__PURE__ */ jsx(icons_default, {

package/support/components/navigation-tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-tab.js","names":["Icon"],"sources":["../../../src/support/components/navigation-tab.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\n\nimport { useSupportNavigation } from \"../store\";\nimport { Text } from \"../text\";\nimport { Button } from \"./button\";\nimport Icon from \"./icons\";\n\n/**\n * Tab bar used inside the widget header to switch between home and knowledge\n * base views.\n */\nexport function NavigationTab(): ReactElement {\n\tconst { current, navigate } = useSupportNavigation();\n\n\treturn (\n\t\t<div className=\"flex w-full items-center justify-center gap-2\">\n\t\t\t<Button\n\t\t\t\tonClick={() => navigate({ page: \"HOME\" })}\n\t\t\t\tvariant={current.page === \"HOME\" ? \"tab-selected\" : \"tab\"}\n\t\t\t>\n\t\t\t\t<Icon\n\t\t\t\t\tfilledOnHover\n\t\t\t\t\tname=\"home\"\n\t\t\t\t\tvariant={current.page === \"HOME\" ? \"filled\" : \"default\"}\n\t\t\t\t/>\n\t\t\t\t<Text as=\"span\" textKey=\"component.navigation.home\" />\n\t\t\t</Button>\n\t\t\t<Button\n\t\t\t\tonClick={() => navigate({ page: \"ARTICLES\" })}\n\t\t\t\tvariant={current.page === \"ARTICLES\" ? \"tab-selected\" : \"tab\"}\n\t\t\t>\n\t\t\t\t<Icon\n\t\t\t\t\tfilledOnHover\n\t\t\t\t\tname=\"articles\"\n\t\t\t\t\tvariant={current.page === \"ARTICLES\" ? \"filled\" : \"default\"}\n\t\t\t\t/>\n\t\t\t\t<Text as=\"span\" textKey=\"component.navigation.articles\" />\n\t\t\t</Button>\n\t\t</div>\n\t);\n}\n"],"mappings":";;;;;;;;;;;AAWA,SAAgB,gBAA8B;CAC7C,MAAM,EAAE,SAAS,aAAa,sBAAsB;AAEpD,QACC,qBAAC;EAAI,WAAU;aACd,qBAAC;GACA,eAAe,SAAS,EAAE,MAAM,QAAQ,CAAC;GACzC,SAAS,QAAQ,SAAS,SAAS,iBAAiB;cAEpD,oBAACA;IACA;IACA,MAAK;IACL,SAAS,QAAQ,SAAS,SAAS,WAAW;KAC7C,EACF,oBAAC;IAAK,IAAG;IAAO,SAAQ;KAA8B;IAC9C,EACT,qBAAC;GACA,eAAe,SAAS,EAAE,MAAM,YAAY,CAAC;GAC7C,SAAS,QAAQ,SAAS,aAAa,iBAAiB;cAExD,oBAACA;IACA;IACA,MAAK;IACL,SAAS,QAAQ,SAAS,aAAa,WAAW;KACjD,EACF,oBAAC;IAAK,IAAG;IAAO,SAAQ;KAAkC;IAClD;GACJ"}
+{"version":3,"file":"navigation-tab.js","names":["Icon"],"sources":["../../../src/support/components/navigation-tab.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\n\nimport { useSupportNavigation } from \"../store\";\nimport { Text } from \"../text\";\nimport { CoButton } from \"./button\";\nimport Icon from \"./icons\";\n\n/**\n * Tab bar used inside the widget header to switch between home and knowledge\n * base views.\n */\nexport function NavigationTab(): ReactElement {\n\tconst { current, navigate } = useSupportNavigation();\n\n\treturn (\n\t\t<div className=\"flex w-full items-center justify-center gap-2\">\n\t\t\t<CoButton\n\t\t\t\tonClick={() => navigate({ page: \"HOME\" })}\n\t\t\t\tvariant={current.page === \"HOME\" ? \"tab-selected\" : \"tab\"}\n\t\t\t>\n\t\t\t\t<Icon\n\t\t\t\t\tfilledOnHover\n\t\t\t\t\tname=\"home\"\n\t\t\t\t\tvariant={current.page === \"HOME\" ? \"filled\" : \"default\"}\n\t\t\t\t/>\n\t\t\t\t<Text as=\"span\" textKey=\"component.navigation.home\" />\n\t\t\t</CoButton>\n\t\t\t<CoButton\n\t\t\t\tonClick={() => navigate({ page: \"ARTICLES\" })}\n\t\t\t\tvariant={current.page === \"ARTICLES\" ? \"tab-selected\" : \"tab\"}\n\t\t\t>\n\t\t\t\t<Icon\n\t\t\t\t\tfilledOnHover\n\t\t\t\t\tname=\"articles\"\n\t\t\t\t\tvariant={current.page === \"ARTICLES\" ? \"filled\" : \"default\"}\n\t\t\t\t/>\n\t\t\t\t<Text as=\"span\" textKey=\"component.navigation.articles\" />\n\t\t\t</CoButton>\n\t\t</div>\n\t);\n}\n"],"mappings":";;;;;;;;;;;AAWA,SAAgB,gBAA8B;CAC7C,MAAM,EAAE,SAAS,aAAa,sBAAsB;AAEpD,QACC,qBAAC;EAAI,WAAU;aACd,qBAAC;GACA,eAAe,SAAS,EAAE,MAAM,QAAQ,CAAC;GACzC,SAAS,QAAQ,SAAS,SAAS,iBAAiB;cAEpD,oBAACA;IACA;IACA,MAAK;IACL,SAAS,QAAQ,SAAS,SAAS,WAAW;KAC7C,EACF,oBAAC;IAAK,IAAG;IAAO,SAAQ;KAA8B;IAC5C,EACX,qBAAC;GACA,eAAe,SAAS,EAAE,MAAM,YAAY,CAAC;GAC7C,SAAS,QAAQ,SAAS,aAAa,iBAAiB;cAExD,oBAACA;IACA;IACA,MAAK;IACL,SAAS,QAAQ,SAAS,aAAa,WAAW;KACjD,EACF,oBAAC;IAAK,IAAG;IAAO,SAAQ;KAAkC;IAChD;GACN"}

package/support/components/timeline-identification-tool.js

@@ -1,4 +1,4 @@
-import { Button } from "./button.js";
+import { CoButton } from "./button.js";
 import { useSupportText } from "../text/index.js";
 import { useVisitor } from "../../hooks/use-visitor.js";
 import { useSupport } from "../../provider.js";
@@ -75,12 +75,12 @@ const IdentificationTimelineTool = ({ conversationId }) => {
 	]);
 	const helperMessage = useMemo(() => {
 		if (errorMessage) return /* @__PURE__ */ jsx("p", {
-			className: "text-destructive text-xs",
+			className: "text-co-destructive text-xs",
 			role: "alert",
 			children: errorMessage
 		});
 		if (hasSucceeded) return /* @__PURE__ */ jsx("p", {
-			className: "text-primary text-xs",
+			className: "text-co-primary text-xs",
 			children: successLabel
 		});
 		return null;
@@ -99,11 +99,11 @@ const IdentificationTimelineTool = ({ conversationId }) => {
 					className: "font-semibold text-sm",
 					children: title
 				}), /* @__PURE__ */ jsx("p", {
-					className: "text-muted-foreground text-xs",
+					className: "text-co-muted-foreground text-xs",
 					children: description
 				})]
 			}), hasSucceeded ? /* @__PURE__ */ jsx("div", {
-				className: "rounded-md bg-co-primary/10 px-3 py-2 text-primary text-sm",
+				className: "rounded-md bg-co-primary/10 px-3 py-2 text-co-primary text-sm",
 				children: successLabel
 			}) : /* @__PURE__ */ jsxs("form", {
 				className: "flex gap-2",
@@ -121,7 +121,7 @@ const IdentificationTimelineTool = ({ conversationId }) => {
 						value: email
 					}),
 					helperMessage,
-					/* @__PURE__ */ jsx(Button, {
+					/* @__PURE__ */ jsx(CoButton, {
 						className: "h-10",
 						disabled: submitDisabled,
 						type: "submit",

package/support/components/timeline-identification-tool.js.map

@@ -1 +1 @@
-{"version":3,"file":"timeline-identification-tool.js","names":["IdentificationTimelineTool: React.FC<\n\tConversationTimelineToolProps\n>","payload: SendTimelineItemRequest"],"sources":["../../../src/support/components/timeline-identification-tool.tsx"],"sourcesContent":["import type { SendTimelineItemRequest } from \"@cossistant/types/api/timeline-item\";\nimport {\n\tConversationEventType,\n\tConversationTimelineType,\n\tTimelineItemVisibility,\n} from \"@cossistant/types/enums\";\nimport { type FormEventHandler, useCallback, useMemo, useState } from \"react\";\n\nimport { useVisitor } from \"../../hooks/use-visitor\";\nimport { useSupport } from \"../../provider\";\nimport { useSupportText } from \"../text\";\nimport { Button } from \"./button\";\nimport type { ConversationTimelineToolProps } from \"./conversation-timeline\";\n\nexport const IdentificationTimelineTool: React.FC<\n\tConversationTimelineToolProps\n> = ({ conversationId }) => {\n\tconst text = useSupportText();\n\tconst { identify, visitor } = useVisitor();\n\tconst { client } = useSupport();\n\tconst [email, setEmail] = useState(\"\");\n\tconst [status, setStatus] = useState<\n\t\t\"idle\" | \"submitting\" | \"success\" | \"error\"\n\t>(\"idle\");\n\tconst [errorMessage, setErrorMessage] = useState<string | null>(null);\n\n\tconst isAlreadyIdentified = Boolean(visitor?.contact);\n\tconst hasSucceeded = status === \"success\" || isAlreadyIdentified;\n\n\tconst ctaLabel = text(\"component.identificationTool.cta\");\n\tconst successLabel = text(\"component.identificationTool.success\");\n\tconst description = text(\"component.identificationTool.description\");\n\tconst title = text(\"component.identificationTool.title\");\n\n\tconst submitDisabled = hasSucceeded || status === \"submitting\";\n\n\tconst handleSubmit = useCallback<FormEventHandler<HTMLFormElement>>(\n\t\tasync (event) => {\n\t\t\tevent.preventDefault();\n\n\t\t\tif (submitDisabled) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst trimmedEmail = email.trim();\n\t\t\tif (!trimmedEmail) {\n\t\t\t\tsetErrorMessage(text(\"component.identificationTool.validation\"));\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetStatus(\"submitting\");\n\t\t\tsetErrorMessage(null);\n\n\t\t\ttry {\n\t\t\t\tconst identifyResult = await identify({ email: trimmedEmail });\n\n\t\t\t\tif (!identifyResult) {\n\t\t\t\t\tsetStatus(\"error\");\n\t\t\t\t\tsetErrorMessage(text(\"component.identificationTool.error\"));\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst payload: SendTimelineItemRequest = {\n\t\t\t\t\tconversationId,\n\t\t\t\t\titem: {\n\t\t\t\t\t\ttype: ConversationTimelineType.EVENT,\n\t\t\t\t\t\ttext: text(\"component.identificationTool.eventLog\"),\n\t\t\t\t\t\ttool: null,\n\t\t\t\t\t\tparts: [\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttype: \"event\" as const,\n\t\t\t\t\t\t\t\teventType: ConversationEventType.VISITOR_IDENTIFIED,\n\t\t\t\t\t\t\t\tactorUserId: null,\n\t\t\t\t\t\t\t\tactorAiAgentId: null,\n\t\t\t\t\t\t\t\ttargetUserId: null,\n\t\t\t\t\t\t\t\ttargetAiAgentId: null,\n\t\t\t\t\t\t\t\tmessage: text(\"component.identificationTool.eventLog\"),\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t],\n\t\t\t\t\t\tvisitorId: identifyResult.visitorId,\n\t\t\t\t\t\tvisibility: TimelineItemVisibility.PUBLIC,\n\t\t\t\t\t},\n\t\t\t\t};\n\n\t\t\t\tawait client.sendMessage(payload);\n\n\t\t\t\tsetStatus(\"success\");\n\t\t\t\tsetEmail(\"\");\n\n\t\t\t\tvoid client.fetchWebsite({ force: true }).catch(() => {});\n\t\t\t} catch {\n\t\t\t\tsetStatus(\"error\");\n\t\t\t\tsetErrorMessage(text(\"component.identificationTool.error\"));\n\t\t\t}\n\t\t},\n\t\t[conversationId, email, identify, client, submitDisabled, text]\n\t);\n\n\tconst helperMessage = useMemo(() => {\n\t\tif (errorMessage) {\n\t\t\treturn (\n\t\t\t\t<p className=\"text-destructive text-xs\" role=\"alert\">\n\t\t\t\t\t{errorMessage}\n\t\t\t\t</p>\n\t\t\t);\n\t\t}\n\n\t\tif (hasSucceeded) {\n\t\t\treturn <p className=\"text-primary text-xs\">{successLabel}</p>;\n\t\t}\n\n\t\treturn null;\n\t}, [errorMessage, hasSucceeded, successLabel]);\n\n\treturn (\n\t\t<div className=\"rounded border border-co-border/60 bg-co-background-100 p-4 shadow-sm\">\n\t\t\t<div className=\"flex flex-col gap-3\">\n\t\t\t\t<div className=\"flex flex-col gap-1\">\n\t\t\t\t\t<h3 className=\"font-semibold text-sm\">{title}</h3>\n\t\t\t\t\t<p className=\"text-muted-foreground text-xs\">{description}</p>\n\t\t\t\t</div>\n\t\t\t\t{hasSucceeded ? (\n\t\t\t\t\t<div className=\"rounded-md bg-co-primary/10 px-3 py-2 text-primary text-sm\">\n\t\t\t\t\t\t{successLabel}\n\t\t\t\t\t</div>\n\t\t\t\t) : (\n\t\t\t\t\t<form className=\"flex gap-2\" onSubmit={handleSubmit}>\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\taria-label={text(\"component.identificationTool.inputLabel\")}\n\t\t\t\t\t\t\tautoComplete=\"email\"\n\t\t\t\t\t\t\tclassName=\"h-10 w-full rounded border border-co-border/60 bg-transparent px-3 py-2 text-sm outline-none focus:border-co-primary focus:ring-2 focus:ring-co-primary/20\"\n\t\t\t\t\t\t\tdisabled={submitDisabled}\n\t\t\t\t\t\t\tinputMode=\"email\"\n\t\t\t\t\t\t\tonChange={(event) => setEmail(event.target.value)}\n\t\t\t\t\t\t\tplaceholder={text(\n\t\t\t\t\t\t\t\t\"component.identificationTool.inputPlaceholder\"\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\ttype=\"email\"\n\t\t\t\t\t\t\tvalue={email}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{helperMessage}\n\t\t\t\t\t\t<Button className=\"h-10\" disabled={submitDisabled} type=\"submit\">\n\t\t\t\t\t\t\t{status === \"submitting\"\n\t\t\t\t\t\t\t\t? text(\"component.identificationTool.loading\")\n\t\t\t\t\t\t\t\t: ctaLabel}\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</form>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nIdentificationTimelineTool.displayName = \"IdentificationTimelineTool\";\n"],"mappings":";;;;;;;;;AAcA,MAAaA,8BAER,EAAE,qBAAqB;CAC3B,MAAM,OAAO,gBAAgB;CAC7B,MAAM,EAAE,UAAU,YAAY,YAAY;CAC1C,MAAM,EAAE,WAAW,YAAY;CAC/B,MAAM,CAAC,OAAO,YAAY,SAAS,GAAG;CACtC,MAAM,CAAC,QAAQ,aAAa,SAE1B,OAAO;CACT,MAAM,CAAC,cAAc,mBAAmB,SAAwB,KAAK;CAErE,MAAM,sBAAsB,QAAQ,SAAS,QAAQ;CACrD,MAAM,eAAe,WAAW,aAAa;CAE7C,MAAM,WAAW,KAAK,mCAAmC;CACzD,MAAM,eAAe,KAAK,uCAAuC;CACjE,MAAM,cAAc,KAAK,2CAA2C;CACpE,MAAM,QAAQ,KAAK,qCAAqC;CAExD,MAAM,iBAAiB,gBAAgB,WAAW;CAElD,MAAM,eAAe,YACpB,OAAO,UAAU;AAChB,QAAM,gBAAgB;AAEtB,MAAI,eACH;EAGD,MAAM,eAAe,MAAM,MAAM;AACjC,MAAI,CAAC,cAAc;AAClB,mBAAgB,KAAK,0CAA0C,CAAC;AAChE;;AAGD,YAAU,aAAa;AACvB,kBAAgB,KAAK;AAErB,MAAI;GACH,MAAM,iBAAiB,MAAM,SAAS,EAAE,OAAO,cAAc,CAAC;AAE9D,OAAI,CAAC,gBAAgB;AACpB,cAAU,QAAQ;AAClB,oBAAgB,KAAK,qCAAqC,CAAC;AAC3D;;GAGD,MAAMC,UAAmC;IACxC;IACA,MAAM;KACL,MAAM,yBAAyB;KAC/B,MAAM,KAAK,wCAAwC;KACnD,MAAM;KACN,OAAO,CACN;MACC,MAAM;MACN,WAAW,sBAAsB;MACjC,aAAa;MACb,gBAAgB;MAChB,cAAc;MACd,iBAAiB;MACjB,SAAS,KAAK,wCAAwC;MACtD,CACD;KACD,WAAW,eAAe;KAC1B,YAAY,uBAAuB;KACnC;IACD;AAED,SAAM,OAAO,YAAY,QAAQ;AAEjC,aAAU,UAAU;AACpB,YAAS,GAAG;AAEZ,GAAK,OAAO,aAAa,EAAE,OAAO,MAAM,CAAC,CAAC,YAAY,GAAG;UAClD;AACP,aAAU,QAAQ;AAClB,mBAAgB,KAAK,qCAAqC,CAAC;;IAG7D;EAAC;EAAgB;EAAO;EAAU;EAAQ;EAAgB;EAAK,CAC/D;CAED,MAAM,gBAAgB,cAAc;AACnC,MAAI,aACH,QACC,oBAAC;GAAE,WAAU;GAA2B,MAAK;aAC3C;IACE;AAIN,MAAI,aACH,QAAO,oBAAC;GAAE,WAAU;aAAwB;IAAiB;AAG9D,SAAO;IACL;EAAC;EAAc;EAAc;EAAa,CAAC;AAE9C,QACC,oBAAC;EAAI,WAAU;YACd,qBAAC;GAAI,WAAU;cACd,qBAAC;IAAI,WAAU;eACd,oBAAC;KAAG,WAAU;eAAyB;MAAW,EAClD,oBAAC;KAAE,WAAU;eAAiC;MAAgB;KACzD,EACL,eACA,oBAAC;IAAI,WAAU;cACb;KACI,GAEN,qBAAC;IAAK,WAAU;IAAa,UAAU;;KACtC,oBAAC;MACA,cAAY,KAAK,0CAA0C;MAC3D,cAAa;MACb,WAAU;MACV,UAAU;MACV,WAAU;MACV,WAAW,UAAU,SAAS,MAAM,OAAO,MAAM;MACjD,aAAa,KACZ,gDACA;MACD,MAAK;MACL,OAAO;OACN;KACD;KACD,oBAAC;MAAO,WAAU;MAAO,UAAU;MAAgB,MAAK;gBACtD,WAAW,eACT,KAAK,uCAAuC,GAC5C;OACK;;KACH;IAEH;GACD;;AAIR,2BAA2B,cAAc"}
+{"version":3,"file":"timeline-identification-tool.js","names":["IdentificationTimelineTool: React.FC<\n\tConversationTimelineToolProps\n>","payload: SendTimelineItemRequest"],"sources":["../../../src/support/components/timeline-identification-tool.tsx"],"sourcesContent":["import type { SendTimelineItemRequest } from \"@cossistant/types/api/timeline-item\";\nimport {\n\tConversationEventType,\n\tConversationTimelineType,\n\tTimelineItemVisibility,\n} from \"@cossistant/types/enums\";\nimport { type FormEventHandler, useCallback, useMemo, useState } from \"react\";\n\nimport { useVisitor } from \"../../hooks/use-visitor\";\nimport { useSupport } from \"../../provider\";\nimport { useSupportText } from \"../text\";\nimport { CoButton } from \"./button\";\nimport type { ConversationTimelineToolProps } from \"./conversation-timeline\";\n\nexport const IdentificationTimelineTool: React.FC<\n\tConversationTimelineToolProps\n> = ({ conversationId }) => {\n\tconst text = useSupportText();\n\tconst { identify, visitor } = useVisitor();\n\tconst { client } = useSupport();\n\tconst [email, setEmail] = useState(\"\");\n\tconst [status, setStatus] = useState<\n\t\t\"idle\" | \"submitting\" | \"success\" | \"error\"\n\t>(\"idle\");\n\tconst [errorMessage, setErrorMessage] = useState<string | null>(null);\n\n\tconst isAlreadyIdentified = Boolean(visitor?.contact);\n\tconst hasSucceeded = status === \"success\" || isAlreadyIdentified;\n\n\tconst ctaLabel = text(\"component.identificationTool.cta\");\n\tconst successLabel = text(\"component.identificationTool.success\");\n\tconst description = text(\"component.identificationTool.description\");\n\tconst title = text(\"component.identificationTool.title\");\n\n\tconst submitDisabled = hasSucceeded || status === \"submitting\";\n\n\tconst handleSubmit = useCallback<FormEventHandler<HTMLFormElement>>(\n\t\tasync (event) => {\n\t\t\tevent.preventDefault();\n\n\t\t\tif (submitDisabled) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst trimmedEmail = email.trim();\n\t\t\tif (!trimmedEmail) {\n\t\t\t\tsetErrorMessage(text(\"component.identificationTool.validation\"));\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetStatus(\"submitting\");\n\t\t\tsetErrorMessage(null);\n\n\t\t\ttry {\n\t\t\t\tconst identifyResult = await identify({ email: trimmedEmail });\n\n\t\t\t\tif (!identifyResult) {\n\t\t\t\t\tsetStatus(\"error\");\n\t\t\t\t\tsetErrorMessage(text(\"component.identificationTool.error\"));\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst payload: SendTimelineItemRequest = {\n\t\t\t\t\tconversationId,\n\t\t\t\t\titem: {\n\t\t\t\t\t\ttype: ConversationTimelineType.EVENT,\n\t\t\t\t\t\ttext: text(\"component.identificationTool.eventLog\"),\n\t\t\t\t\t\ttool: null,\n\t\t\t\t\t\tparts: [\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttype: \"event\" as const,\n\t\t\t\t\t\t\t\teventType: ConversationEventType.VISITOR_IDENTIFIED,\n\t\t\t\t\t\t\t\tactorUserId: null,\n\t\t\t\t\t\t\t\tactorAiAgentId: null,\n\t\t\t\t\t\t\t\ttargetUserId: null,\n\t\t\t\t\t\t\t\ttargetAiAgentId: null,\n\t\t\t\t\t\t\t\tmessage: text(\"component.identificationTool.eventLog\"),\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t],\n\t\t\t\t\t\tvisitorId: identifyResult.visitorId,\n\t\t\t\t\t\tvisibility: TimelineItemVisibility.PUBLIC,\n\t\t\t\t\t},\n\t\t\t\t};\n\n\t\t\t\tawait client.sendMessage(payload);\n\n\t\t\t\tsetStatus(\"success\");\n\t\t\t\tsetEmail(\"\");\n\n\t\t\t\tvoid client.fetchWebsite({ force: true }).catch(() => {});\n\t\t\t} catch {\n\t\t\t\tsetStatus(\"error\");\n\t\t\t\tsetErrorMessage(text(\"component.identificationTool.error\"));\n\t\t\t}\n\t\t},\n\t\t[conversationId, email, identify, client, submitDisabled, text]\n\t);\n\n\tconst helperMessage = useMemo(() => {\n\t\tif (errorMessage) {\n\t\t\treturn (\n\t\t\t\t<p className=\"text-co-destructive text-xs\" role=\"alert\">\n\t\t\t\t\t{errorMessage}\n\t\t\t\t</p>\n\t\t\t);\n\t\t}\n\n\t\tif (hasSucceeded) {\n\t\t\treturn <p className=\"text-co-primary text-xs\">{successLabel}</p>;\n\t\t}\n\n\t\treturn null;\n\t}, [errorMessage, hasSucceeded, successLabel]);\n\n\treturn (\n\t\t<div className=\"rounded border border-co-border/60 bg-co-background-100 p-4 shadow-sm\">\n\t\t\t<div className=\"flex flex-col gap-3\">\n\t\t\t\t<div className=\"flex flex-col gap-1\">\n\t\t\t\t\t<h3 className=\"font-semibold text-sm\">{title}</h3>\n\t\t\t\t\t<p className=\"text-co-muted-foreground text-xs\">{description}</p>\n\t\t\t\t</div>\n\t\t\t\t{hasSucceeded ? (\n\t\t\t\t\t<div className=\"rounded-md bg-co-primary/10 px-3 py-2 text-co-primary text-sm\">\n\t\t\t\t\t\t{successLabel}\n\t\t\t\t\t</div>\n\t\t\t\t) : (\n\t\t\t\t\t<form className=\"flex gap-2\" onSubmit={handleSubmit}>\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\taria-label={text(\"component.identificationTool.inputLabel\")}\n\t\t\t\t\t\t\tautoComplete=\"email\"\n\t\t\t\t\t\t\tclassName=\"h-10 w-full rounded border border-co-border/60 bg-transparent px-3 py-2 text-sm outline-none focus:border-co-primary focus:ring-2 focus:ring-co-primary/20\"\n\t\t\t\t\t\t\tdisabled={submitDisabled}\n\t\t\t\t\t\t\tinputMode=\"email\"\n\t\t\t\t\t\t\tonChange={(event) => setEmail(event.target.value)}\n\t\t\t\t\t\t\tplaceholder={text(\n\t\t\t\t\t\t\t\t\"component.identificationTool.inputPlaceholder\"\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\ttype=\"email\"\n\t\t\t\t\t\t\tvalue={email}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{helperMessage}\n\t\t\t\t\t\t<CoButton className=\"h-10\" disabled={submitDisabled} type=\"submit\">\n\t\t\t\t\t\t\t{status === \"submitting\"\n\t\t\t\t\t\t\t\t? text(\"component.identificationTool.loading\")\n\t\t\t\t\t\t\t\t: ctaLabel}\n\t\t\t\t\t\t</CoButton>\n\t\t\t\t\t</form>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nIdentificationTimelineTool.displayName = \"IdentificationTimelineTool\";\n"],"mappings":";;;;;;;;;AAcA,MAAaA,8BAER,EAAE,qBAAqB;CAC3B,MAAM,OAAO,gBAAgB;CAC7B,MAAM,EAAE,UAAU,YAAY,YAAY;CAC1C,MAAM,EAAE,WAAW,YAAY;CAC/B,MAAM,CAAC,OAAO,YAAY,SAAS,GAAG;CACtC,MAAM,CAAC,QAAQ,aAAa,SAE1B,OAAO;CACT,MAAM,CAAC,cAAc,mBAAmB,SAAwB,KAAK;CAErE,MAAM,sBAAsB,QAAQ,SAAS,QAAQ;CACrD,MAAM,eAAe,WAAW,aAAa;CAE7C,MAAM,WAAW,KAAK,mCAAmC;CACzD,MAAM,eAAe,KAAK,uCAAuC;CACjE,MAAM,cAAc,KAAK,2CAA2C;CACpE,MAAM,QAAQ,KAAK,qCAAqC;CAExD,MAAM,iBAAiB,gBAAgB,WAAW;CAElD,MAAM,eAAe,YACpB,OAAO,UAAU;AAChB,QAAM,gBAAgB;AAEtB,MAAI,eACH;EAGD,MAAM,eAAe,MAAM,MAAM;AACjC,MAAI,CAAC,cAAc;AAClB,mBAAgB,KAAK,0CAA0C,CAAC;AAChE;;AAGD,YAAU,aAAa;AACvB,kBAAgB,KAAK;AAErB,MAAI;GACH,MAAM,iBAAiB,MAAM,SAAS,EAAE,OAAO,cAAc,CAAC;AAE9D,OAAI,CAAC,gBAAgB;AACpB,cAAU,QAAQ;AAClB,oBAAgB,KAAK,qCAAqC,CAAC;AAC3D;;GAGD,MAAMC,UAAmC;IACxC;IACA,MAAM;KACL,MAAM,yBAAyB;KAC/B,MAAM,KAAK,wCAAwC;KACnD,MAAM;KACN,OAAO,CACN;MACC,MAAM;MACN,WAAW,sBAAsB;MACjC,aAAa;MACb,gBAAgB;MAChB,cAAc;MACd,iBAAiB;MACjB,SAAS,KAAK,wCAAwC;MACtD,CACD;KACD,WAAW,eAAe;KAC1B,YAAY,uBAAuB;KACnC;IACD;AAED,SAAM,OAAO,YAAY,QAAQ;AAEjC,aAAU,UAAU;AACpB,YAAS,GAAG;AAEZ,GAAK,OAAO,aAAa,EAAE,OAAO,MAAM,CAAC,CAAC,YAAY,GAAG;UAClD;AACP,aAAU,QAAQ;AAClB,mBAAgB,KAAK,qCAAqC,CAAC;;IAG7D;EAAC;EAAgB;EAAO;EAAU;EAAQ;EAAgB;EAAK,CAC/D;CAED,MAAM,gBAAgB,cAAc;AACnC,MAAI,aACH,QACC,oBAAC;GAAE,WAAU;GAA8B,MAAK;aAC9C;IACE;AAIN,MAAI,aACH,QAAO,oBAAC;GAAE,WAAU;aAA2B;IAAiB;AAGjE,SAAO;IACL;EAAC;EAAc;EAAc;EAAa,CAAC;AAE9C,QACC,oBAAC;EAAI,WAAU;YACd,qBAAC;GAAI,WAAU;cACd,qBAAC;IAAI,WAAU;eACd,oBAAC;KAAG,WAAU;eAAyB;MAAW,EAClD,oBAAC;KAAE,WAAU;eAAoC;MAAgB;KAC5D,EACL,eACA,oBAAC;IAAI,WAAU;cACb;KACI,GAEN,qBAAC;IAAK,WAAU;IAAa,UAAU;;KACtC,oBAAC;MACA,cAAY,KAAK,0CAA0C;MAC3D,cAAa;MACb,WAAU;MACV,UAAU;MACV,WAAU;MACV,WAAW,UAAU,SAAS,MAAM,OAAO,MAAM;MACjD,aAAa,KACZ,gDACA;MACD,MAAK;MACL,OAAO;OACN;KACD;KACD,oBAAC;MAAS,WAAU;MAAO,UAAU;MAAgB,MAAK;gBACxD,WAAW,eACT,KAAK,uCAAuC,GAC5C;OACO;;KACL;IAEH;GACD;;AAIR,2BAA2B,cAAc"}

package/support/components/timeline-message-group.js

@@ -54,8 +54,8 @@ const TimelineMessageGroup = ({ items, availableAIAgents, availableHumanAgents,
 			children: [isReceivedByViewer && /* @__PURE__ */ jsx(TimelineItemGroupAvatar, {
 				className: "flex flex-shrink-0 flex-col justify-end",
 				children: isAI ? /* @__PURE__ */ jsx("div", {
-					className: "flex size-6 items-center justify-center rounded-full bg-primary/10",
-					children: /* @__PURE__ */ jsx(CossistantLogo, { className: "h-4 w-4 text-primary" })
+					className: "flex size-6 items-center justify-center rounded-full bg-co-primary/10",
+					children: /* @__PURE__ */ jsx(CossistantLogo, { className: "h-4 w-4 text-co-primary" })
 				}) : /* @__PURE__ */ jsx(Avatar, {
 					className: "size-6",
 					image: humanAgent?.image,
@@ -65,7 +65,7 @@ const TimelineMessageGroup = ({ items, availableAIAgents, availableHumanAgents,
 				className: cn("flex flex-col gap-1", isSentByViewer && "items-end"),
 				children: [
 					isReceivedByViewer && /* @__PURE__ */ jsx(TimelineItemGroupHeader, {
-						className: "px-1 text-muted-foreground text-xs",
+						className: "px-1 text-co-muted-foreground text-xs",
 						children: isAI ? aiAgent?.name || "AI Assistant" : humanAgent?.name || "Support"
 					}),
 					items.map((item, index) => /* @__PURE__ */ jsx(motion.div, {
@@ -83,7 +83,7 @@ const TimelineMessageGroup = ({ items, availableAIAgents, availableHumanAgents,
 							children: hasSeenIndicator && /* @__PURE__ */ jsx(motion.div, {
 								...SEEN_ANIMATION,
 								children: /* @__PURE__ */ jsx(TimelineItemGroupSeenIndicator, {
-									className: "px-1 text-muted-foreground text-xs",
+									className: "px-1 text-co-muted-foreground text-xs",
 									seenByIds,
 									children: () => `Seen by ${seenByNames.join(", ")}`
 								})

package/support/components/timeline-message-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"timeline-message-group.js","names":["EMPTY_SEEN_BY_IDS: readonly string[]","EMPTY_SEEN_BY_NAMES: readonly string[]","TimelineMessageGroup: React.FC<TimelineMessageGroupProps>","PrimitiveTimelineItemGroup"],"sources":["../../../src/support/components/timeline-message-group.tsx"],"sourcesContent":["import type { AvailableAIAgent, AvailableHumanAgent } from \"@cossistant/types\";\nimport { SenderType } from \"@cossistant/types\";\nimport type { TimelineItem } from \"@cossistant/types/api/timeline-item\";\nimport { motion } from \"motion/react\";\nimport type React from \"react\";\nimport {\n\tTimelineItemGroup as PrimitiveTimelineItemGroup,\n\tTimelineItemGroupAvatar,\n\tTimelineItemGroupContent,\n\tTimelineItemGroupHeader,\n\tTimelineItemGroupSeenIndicator,\n} from \"../../primitives/timeline-item-group\";\nimport { cn } from \"../utils\";\nimport { Avatar } from \"./avatar\";\nimport { CossistantLogo } from \"./cossistant-branding\";\nimport { TimelineMessageItem } from \"./timeline-message-item\";\n\nconst MESSAGE_ANIMATION = {\n\tinitial: { opacity: 0, y: 6 },\n\tanimate: { opacity: 1, y: 0 },\n\texit: { opacity: 0 },\n\ttransition: {\n\t\tduration: 0.1,\n\t\tease: [0.25, 0.46, 0.45, 0.94] as const, // easeOutCubic\n\t},\n} as const;\n\nconst SEEN_ANIMATION = {\n\tinitial: { opacity: 0 },\n\tanimate: { opacity: 1 },\n\ttransition: {\n\t\tduration: 0.1,\n\t\tease: \"easeOut\" as const,\n\t},\n} as const;\n\nexport type TimelineMessageGroupProps = {\n\titems: TimelineItem[];\n\tavailableAIAgents: AvailableAIAgent[];\n\tavailableHumanAgents: AvailableHumanAgent[];\n\tcurrentVisitorId?: string;\n\tseenByIds?: readonly string[];\n\tseenByNames?: readonly string[];\n};\n\nconst EMPTY_SEEN_BY_IDS: readonly string[] = Object.freeze([]);\nconst EMPTY_SEEN_BY_NAMES: readonly string[] = Object.freeze([]);\n\nexport const TimelineMessageGroup: React.FC<TimelineMessageGroupProps> = ({\n\titems,\n\tavailableAIAgents,\n\tavailableHumanAgents,\n\tcurrentVisitorId,\n\tseenByIds = EMPTY_SEEN_BY_IDS,\n\tseenByNames = EMPTY_SEEN_BY_NAMES,\n}) => {\n\t// Get agent info for the sender\n\tconst firstItem = items[0];\n\tconst humanAgent = availableHumanAgents.find(\n\t\t(agent) => agent.id === firstItem?.userId\n\t);\n\tconst aiAgent = availableAIAgents.find(\n\t\t(agent) => agent.id === firstItem?.aiAgentId\n\t);\n\n\tif (items.length === 0) {\n\t\treturn null;\n\t}\n\n\tconst hasSeenIndicator = seenByIds.length > 0 && seenByNames.length > 0;\n\n\treturn (\n\t\t<PrimitiveTimelineItemGroup\n\t\t\titems={items}\n\t\t\tseenByIds={seenByIds}\n\t\t\tviewerId={currentVisitorId}\n\t\t\tviewerType={SenderType.VISITOR}\n\t\t>\n\t\t\t{({\n\t\t\t\tisSentByViewer,\n\t\t\t\tisReceivedByViewer,\n\t\t\t\tisVisitor,\n\t\t\t\tisAI,\n\t\t\t\tisTeamMember,\n\t\t\t}) => (\n\t\t\t\t<div\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"flex w-full gap-2\",\n\t\t\t\t\t\t// Support widget POV: visitor messages are sent (right side)\n\t\t\t\t\t\t// Agent messages are received (left side)\n\t\t\t\t\t\tisSentByViewer && \"flex-row-reverse\",\n\t\t\t\t\t\tisReceivedByViewer && \"flex-row\"\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t{/* Avatar - only show for received messages (agents) */}\n\t\t\t\t\t{isReceivedByViewer && (\n\t\t\t\t\t\t<TimelineItemGroupAvatar className=\"flex flex-shrink-0 flex-col justify-end\">\n\t\t\t\t\t\t\t{isAI ? (\n\t\t\t\t\t\t\t\t<div className=\"flex size-6 items-center justify-center rounded-full bg-primary/10\">\n\t\t\t\t\t\t\t\t\t<CossistantLogo className=\"h-4 w-4 text-primary\" />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<Avatar\n\t\t\t\t\t\t\t\t\tclassName=\"size-6\"\n\t\t\t\t\t\t\t\t\timage={humanAgent?.image}\n\t\t\t\t\t\t\t\t\tname={humanAgent?.name || \"Support\"}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</TimelineItemGroupAvatar>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<TimelineItemGroupContent\n\t\t\t\t\t\tclassName={cn(\"flex flex-col gap-1\", isSentByViewer && \"items-end\")}\n\t\t\t\t\t>\n\t\t\t\t\t\t{/* Header - show sender name for received messages (agents) */}\n\t\t\t\t\t\t{isReceivedByViewer && (\n\t\t\t\t\t\t\t<TimelineItemGroupHeader className=\"px-1 text-muted-foreground text-xs\">\n\t\t\t\t\t\t\t\t{isAI\n\t\t\t\t\t\t\t\t\t? aiAgent?.name || \"AI Assistant\"\n\t\t\t\t\t\t\t\t\t: humanAgent?.name || \"Support\"}\n\t\t\t\t\t\t\t</TimelineItemGroupHeader>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{items.map((item, index) => (\n\t\t\t\t\t\t\t<motion.div key={item.id} {...MESSAGE_ANIMATION}>\n\t\t\t\t\t\t\t\t<TimelineMessageItem\n\t\t\t\t\t\t\t\t\tisLast={index === items.length - 1}\n\t\t\t\t\t\t\t\t\tisSentByViewer={isSentByViewer}\n\t\t\t\t\t\t\t\t\titem={item}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t))}\n\n\t\t\t\t\t\t{isSentByViewer && (\n\t\t\t\t\t\t\t<div className={cn(\"\", hasSeenIndicator && \"mt-2\")}>\n\t\t\t\t\t\t\t\t<div className=\"min-h-[1.25rem]\">\n\t\t\t\t\t\t\t\t\t{hasSeenIndicator && (\n\t\t\t\t\t\t\t\t\t\t<motion.div key=\"seen-indicator\" {...SEEN_ANIMATION}>\n\t\t\t\t\t\t\t\t\t\t\t<TimelineItemGroupSeenIndicator\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"px-1 text-muted-foreground text-xs\"\n\t\t\t\t\t\t\t\t\t\t\t\tseenByIds={seenByIds}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{() => `Seen by ${seenByNames.join(\", \")}`}\n\t\t\t\t\t\t\t\t\t\t\t</TimelineItemGroupSeenIndicator>\n\t\t\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</TimelineItemGroupContent>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</PrimitiveTimelineItemGroup>\n\t);\n};\n\nTimelineMessageGroup.displayName = \"TimelineMessageGroup\";\n"],"mappings":";;;;;;;;;;AAiBA,MAAM,oBAAoB;CACzB,SAAS;EAAE,SAAS;EAAG,GAAG;EAAG;CAC7B,SAAS;EAAE,SAAS;EAAG,GAAG;EAAG;CAC7B,MAAM,EAAE,SAAS,GAAG;CACpB,YAAY;EACX,UAAU;EACV,MAAM;GAAC;GAAM;GAAM;GAAM;GAAK;EAC9B;CACD;AAED,MAAM,iBAAiB;CACtB,SAAS,EAAE,SAAS,GAAG;CACvB,SAAS,EAAE,SAAS,GAAG;CACvB,YAAY;EACX,UAAU;EACV,MAAM;EACN;CACD;AAWD,MAAMA,oBAAuC,OAAO,OAAO,EAAE,CAAC;AAC9D,MAAMC,sBAAyC,OAAO,OAAO,EAAE,CAAC;AAEhE,MAAaC,wBAA6D,EACzE,OACA,mBACA,sBACA,kBACA,YAAY,mBACZ,cAAc,0BACT;CAEL,MAAM,YAAY,MAAM;CACxB,MAAM,aAAa,qBAAqB,MACtC,UAAU,MAAM,OAAO,WAAW,OACnC;CACD,MAAM,UAAU,kBAAkB,MAChC,UAAU,MAAM,OAAO,WAAW,UACnC;AAED,KAAI,MAAM,WAAW,EACpB,QAAO;CAGR,MAAM,mBAAmB,UAAU,SAAS,KAAK,YAAY,SAAS;AAEtE,QACC,oBAACC;EACO;EACI;EACX,UAAU;EACV,YAAY,WAAW;aAErB,EACD,gBACA,oBACA,WACA,MACA,mBAEA,qBAAC;GACA,WAAW,GACV,qBAGA,kBAAkB,oBAClB,sBAAsB,WACtB;cAGA,sBACA,oBAAC;IAAwB,WAAU;cACjC,OACA,oBAAC;KAAI,WAAU;eACd,oBAAC,kBAAe,WAAU,yBAAyB;MAC9C,GAEN,oBAAC;KACA,WAAU;KACV,OAAO,YAAY;KACnB,MAAM,YAAY,QAAQ;MACzB;KAEsB,EAG3B,qBAAC;IACA,WAAW,GAAG,uBAAuB,kBAAkB,YAAY;;KAGlE,sBACA,oBAAC;MAAwB,WAAU;gBACjC,OACE,SAAS,QAAQ,iBACjB,YAAY,QAAQ;OACE;KAG1B,MAAM,KAAK,MAAM,UACjB,oBAAC,OAAO;MAAkB,GAAI;gBAC7B,oBAAC;OACA,QAAQ,UAAU,MAAM,SAAS;OACjB;OACV;QACL;QALc,KAAK,GAMT,CACZ;KAED,kBACA,oBAAC;MAAI,WAAW,GAAG,IAAI,oBAAoB,OAAO;gBACjD,oBAAC;OAAI,WAAU;iBACb,oBACA,oBAAC,OAAO;QAAyB,GAAI;kBACpC,oBAAC;SACA,WAAU;SACC;yBAEJ,WAAW,YAAY,KAAK,KAAK;UACR;UANlB,iBAOH;QAET;OACD;;KAEmB;IACtB;GAEqB;;AAI/B,qBAAqB,cAAc"}
+{"version":3,"file":"timeline-message-group.js","names":["EMPTY_SEEN_BY_IDS: readonly string[]","EMPTY_SEEN_BY_NAMES: readonly string[]","TimelineMessageGroup: React.FC<TimelineMessageGroupProps>","PrimitiveTimelineItemGroup"],"sources":["../../../src/support/components/timeline-message-group.tsx"],"sourcesContent":["import type { AvailableAIAgent, AvailableHumanAgent } from \"@cossistant/types\";\nimport { SenderType } from \"@cossistant/types\";\nimport type { TimelineItem } from \"@cossistant/types/api/timeline-item\";\nimport { motion } from \"motion/react\";\nimport type React from \"react\";\nimport {\n\tTimelineItemGroup as PrimitiveTimelineItemGroup,\n\tTimelineItemGroupAvatar,\n\tTimelineItemGroupContent,\n\tTimelineItemGroupHeader,\n\tTimelineItemGroupSeenIndicator,\n} from \"../../primitives/timeline-item-group\";\nimport { cn } from \"../utils\";\nimport { Avatar } from \"./avatar\";\nimport { CossistantLogo } from \"./cossistant-branding\";\nimport { TimelineMessageItem } from \"./timeline-message-item\";\n\nconst MESSAGE_ANIMATION = {\n\tinitial: { opacity: 0, y: 6 },\n\tanimate: { opacity: 1, y: 0 },\n\texit: { opacity: 0 },\n\ttransition: {\n\t\tduration: 0.1,\n\t\tease: [0.25, 0.46, 0.45, 0.94] as const, // easeOutCubic\n\t},\n} as const;\n\nconst SEEN_ANIMATION = {\n\tinitial: { opacity: 0 },\n\tanimate: { opacity: 1 },\n\ttransition: {\n\t\tduration: 0.1,\n\t\tease: \"easeOut\" as const,\n\t},\n} as const;\n\nexport type TimelineMessageGroupProps = {\n\titems: TimelineItem[];\n\tavailableAIAgents: AvailableAIAgent[];\n\tavailableHumanAgents: AvailableHumanAgent[];\n\tcurrentVisitorId?: string;\n\tseenByIds?: readonly string[];\n\tseenByNames?: readonly string[];\n};\n\nconst EMPTY_SEEN_BY_IDS: readonly string[] = Object.freeze([]);\nconst EMPTY_SEEN_BY_NAMES: readonly string[] = Object.freeze([]);\n\nexport const TimelineMessageGroup: React.FC<TimelineMessageGroupProps> = ({\n\titems,\n\tavailableAIAgents,\n\tavailableHumanAgents,\n\tcurrentVisitorId,\n\tseenByIds = EMPTY_SEEN_BY_IDS,\n\tseenByNames = EMPTY_SEEN_BY_NAMES,\n}) => {\n\t// Get agent info for the sender\n\tconst firstItem = items[0];\n\tconst humanAgent = availableHumanAgents.find(\n\t\t(agent) => agent.id === firstItem?.userId\n\t);\n\tconst aiAgent = availableAIAgents.find(\n\t\t(agent) => agent.id === firstItem?.aiAgentId\n\t);\n\n\tif (items.length === 0) {\n\t\treturn null;\n\t}\n\n\tconst hasSeenIndicator = seenByIds.length > 0 && seenByNames.length > 0;\n\n\treturn (\n\t\t<PrimitiveTimelineItemGroup\n\t\t\titems={items}\n\t\t\tseenByIds={seenByIds}\n\t\t\tviewerId={currentVisitorId}\n\t\t\tviewerType={SenderType.VISITOR}\n\t\t>\n\t\t\t{({\n\t\t\t\tisSentByViewer,\n\t\t\t\tisReceivedByViewer,\n\t\t\t\tisVisitor,\n\t\t\t\tisAI,\n\t\t\t\tisTeamMember,\n\t\t\t}) => (\n\t\t\t\t<div\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"flex w-full gap-2\",\n\t\t\t\t\t\t// Support widget POV: visitor messages are sent (right side)\n\t\t\t\t\t\t// Agent messages are received (left side)\n\t\t\t\t\t\tisSentByViewer && \"flex-row-reverse\",\n\t\t\t\t\t\tisReceivedByViewer && \"flex-row\"\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t{/* Avatar - only show for received messages (agents) */}\n\t\t\t\t\t{isReceivedByViewer && (\n\t\t\t\t\t\t<TimelineItemGroupAvatar className=\"flex flex-shrink-0 flex-col justify-end\">\n\t\t\t\t\t\t\t{isAI ? (\n\t\t\t\t\t\t\t\t<div className=\"flex size-6 items-center justify-center rounded-full bg-co-primary/10\">\n\t\t\t\t\t\t\t\t\t<CossistantLogo className=\"h-4 w-4 text-co-primary\" />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<Avatar\n\t\t\t\t\t\t\t\t\tclassName=\"size-6\"\n\t\t\t\t\t\t\t\t\timage={humanAgent?.image}\n\t\t\t\t\t\t\t\t\tname={humanAgent?.name || \"Support\"}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</TimelineItemGroupAvatar>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<TimelineItemGroupContent\n\t\t\t\t\t\tclassName={cn(\"flex flex-col gap-1\", isSentByViewer && \"items-end\")}\n\t\t\t\t\t>\n\t\t\t\t\t\t{/* Header - show sender name for received messages (agents) */}\n\t\t\t\t\t\t{isReceivedByViewer && (\n\t\t\t\t\t\t\t<TimelineItemGroupHeader className=\"px-1 text-co-muted-foreground text-xs\">\n\t\t\t\t\t\t\t\t{isAI\n\t\t\t\t\t\t\t\t\t? aiAgent?.name || \"AI Assistant\"\n\t\t\t\t\t\t\t\t\t: humanAgent?.name || \"Support\"}\n\t\t\t\t\t\t\t</TimelineItemGroupHeader>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{items.map((item, index) => (\n\t\t\t\t\t\t\t<motion.div key={item.id} {...MESSAGE_ANIMATION}>\n\t\t\t\t\t\t\t\t<TimelineMessageItem\n\t\t\t\t\t\t\t\t\tisLast={index === items.length - 1}\n\t\t\t\t\t\t\t\t\tisSentByViewer={isSentByViewer}\n\t\t\t\t\t\t\t\t\titem={item}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t))}\n\n\t\t\t\t\t\t{isSentByViewer && (\n\t\t\t\t\t\t\t<div className={cn(\"\", hasSeenIndicator && \"mt-2\")}>\n\t\t\t\t\t\t\t\t<div className=\"min-h-[1.25rem]\">\n\t\t\t\t\t\t\t\t\t{hasSeenIndicator && (\n\t\t\t\t\t\t\t\t\t\t<motion.div key=\"seen-indicator\" {...SEEN_ANIMATION}>\n\t\t\t\t\t\t\t\t\t\t\t<TimelineItemGroupSeenIndicator\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"px-1 text-co-muted-foreground text-xs\"\n\t\t\t\t\t\t\t\t\t\t\t\tseenByIds={seenByIds}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{() => `Seen by ${seenByNames.join(\", \")}`}\n\t\t\t\t\t\t\t\t\t\t\t</TimelineItemGroupSeenIndicator>\n\t\t\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</TimelineItemGroupContent>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</PrimitiveTimelineItemGroup>\n\t);\n};\n\nTimelineMessageGroup.displayName = \"TimelineMessageGroup\";\n"],"mappings":";;;;;;;;;;AAiBA,MAAM,oBAAoB;CACzB,SAAS;EAAE,SAAS;EAAG,GAAG;EAAG;CAC7B,SAAS;EAAE,SAAS;EAAG,GAAG;EAAG;CAC7B,MAAM,EAAE,SAAS,GAAG;CACpB,YAAY;EACX,UAAU;EACV,MAAM;GAAC;GAAM;GAAM;GAAM;GAAK;EAC9B;CACD;AAED,MAAM,iBAAiB;CACtB,SAAS,EAAE,SAAS,GAAG;CACvB,SAAS,EAAE,SAAS,GAAG;CACvB,YAAY;EACX,UAAU;EACV,MAAM;EACN;CACD;AAWD,MAAMA,oBAAuC,OAAO,OAAO,EAAE,CAAC;AAC9D,MAAMC,sBAAyC,OAAO,OAAO,EAAE,CAAC;AAEhE,MAAaC,wBAA6D,EACzE,OACA,mBACA,sBACA,kBACA,YAAY,mBACZ,cAAc,0BACT;CAEL,MAAM,YAAY,MAAM;CACxB,MAAM,aAAa,qBAAqB,MACtC,UAAU,MAAM,OAAO,WAAW,OACnC;CACD,MAAM,UAAU,kBAAkB,MAChC,UAAU,MAAM,OAAO,WAAW,UACnC;AAED,KAAI,MAAM,WAAW,EACpB,QAAO;CAGR,MAAM,mBAAmB,UAAU,SAAS,KAAK,YAAY,SAAS;AAEtE,QACC,oBAACC;EACO;EACI;EACX,UAAU;EACV,YAAY,WAAW;aAErB,EACD,gBACA,oBACA,WACA,MACA,mBAEA,qBAAC;GACA,WAAW,GACV,qBAGA,kBAAkB,oBAClB,sBAAsB,WACtB;cAGA,sBACA,oBAAC;IAAwB,WAAU;cACjC,OACA,oBAAC;KAAI,WAAU;eACd,oBAAC,kBAAe,WAAU,4BAA4B;MACjD,GAEN,oBAAC;KACA,WAAU;KACV,OAAO,YAAY;KACnB,MAAM,YAAY,QAAQ;MACzB;KAEsB,EAG3B,qBAAC;IACA,WAAW,GAAG,uBAAuB,kBAAkB,YAAY;;KAGlE,sBACA,oBAAC;MAAwB,WAAU;gBACjC,OACE,SAAS,QAAQ,iBACjB,YAAY,QAAQ;OACE;KAG1B,MAAM,KAAK,MAAM,UACjB,oBAAC,OAAO;MAAkB,GAAI;gBAC7B,oBAAC;OACA,QAAQ,UAAU,MAAM,SAAS;OACjB;OACV;QACL;QALc,KAAK,GAMT,CACZ;KAED,kBACA,oBAAC;MAAI,WAAW,GAAG,IAAI,oBAAoB,OAAO;gBACjD,oBAAC;OAAI,WAAU;iBACb,oBACA,oBAAC,OAAO;QAAyB,GAAI;kBACpC,oBAAC;SACA,WAAU;SACC;yBAEJ,WAAW,YAAY,KAAK,KAAK;UACR;UANlB,iBAOH;QAET;OACD;;KAEmB;IACtB;GAEqB;;AAI/B,qBAAqB,cAAc"}

package/support/components/timeline-message-item.js

@@ -20,15 +20,15 @@ function TimelineMessageItem({ item, isLast = false, isSentByViewer = false }) {
 					className: cn("flex w-full flex-1 flex-col gap-1", isSentByViewerFinal && "items-end"),
 					children: [/* @__PURE__ */ jsx(TimelineItemContent, {
 						className: cn("block w-max max-w-[300px] rounded-lg px-3.5 py-2.5 text-sm", {
-							"bg-background-300 text-foreground dark:bg-background-600": !isSentByViewerFinal,
-							"bg-primary text-primary-foreground": isSentByViewerFinal,
+							"bg-co-background-300 text-co-foreground dark:bg-co-background-600": !isSentByViewerFinal,
+							"bg-co-primary text-co-primary-foreground": isSentByViewerFinal,
 							"rounded-br-sm": isLast && isSentByViewerFinal,
 							"rounded-bl-sm": isLast && !isSentByViewerFinal
 						}),
 						renderMarkdown: true,
 						text: item.text
 					}), isLast && /* @__PURE__ */ jsx(TimelineItemTimestamp, {
-						className: "px-1 text-muted-foreground text-xs",
+						className: "px-1 text-co-muted-foreground text-xs",
 						timestamp,
 						children: () => /* @__PURE__ */ jsxs(Fragment, { children: [timestamp.toLocaleTimeString([], {
 							hour: "2-digit",

package/support/components/timeline-message-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"timeline-message-item.js","names":["PrimitiveTimelineItem"],"sources":["../../../src/support/components/timeline-message-item.tsx"],"sourcesContent":["import type { TimelineItem } from \"@cossistant/types/api/timeline-item\";\nimport type React from \"react\";\nimport {\n\tTimelineItem as PrimitiveTimelineItem,\n\tTimelineItemContent,\n\tTimelineItemTimestamp,\n} from \"../../primitives/timeline-item\";\nimport { useSupportText } from \"../text\";\nimport { cn } from \"../utils\";\n\nexport type TimelineMessageItemProps = {\n\titem: TimelineItem;\n\tisLast?: boolean;\n\tisSentByViewer?: boolean;\n};\n\n/**\n * Message bubble renderer that adapts layout depending on whether the visitor\n * or an agent sent the message.\n */\nexport function TimelineMessageItem({\n\titem,\n\tisLast = false,\n\tisSentByViewer = false,\n}: TimelineMessageItemProps): React.ReactElement {\n\tconst text = useSupportText();\n\treturn (\n\t\t<PrimitiveTimelineItem item={item}>\n\t\t\t{({ isAI, timestamp }) => {\n\t\t\t\t// isSentByViewer defaults to false, meaning messages are treated as received\n\t\t\t\t// (left side with background) unless explicitly marked as sent by viewer\n\t\t\t\tconst isSentByViewerFinal = isSentByViewer;\n\n\t\t\t\treturn (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\"flex w-full gap-2\",\n\t\t\t\t\t\t\tisSentByViewerFinal && \"flex-row-reverse\",\n\t\t\t\t\t\t\t!isSentByViewerFinal && \"flex-row\"\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\"flex w-full flex-1 flex-col gap-1\",\n\t\t\t\t\t\t\t\tisSentByViewerFinal && \"items-end\"\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<TimelineItemContent\n\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\"block w-max max-w-[300px] rounded-lg px-3.5 py-2.5 text-sm\",\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\"bg-background-300 text-foreground dark:bg-background-600\":\n\t\t\t\t\t\t\t\t\t\t\t!isSentByViewerFinal,\n\t\t\t\t\t\t\t\t\t\t\"bg-primary text-primary-foreground\": isSentByViewerFinal,\n\t\t\t\t\t\t\t\t\t\t\"rounded-br-sm\": isLast && isSentByViewerFinal,\n\t\t\t\t\t\t\t\t\t\t\"rounded-bl-sm\": isLast && !isSentByViewerFinal,\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\trenderMarkdown\n\t\t\t\t\t\t\t\ttext={item.text}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{isLast && (\n\t\t\t\t\t\t\t\t<TimelineItemTimestamp\n\t\t\t\t\t\t\t\t\tclassName=\"px-1 text-muted-foreground text-xs\"\n\t\t\t\t\t\t\t\t\ttimestamp={timestamp}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{() => (\n\t\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t\t{timestamp.toLocaleTimeString([], {\n\t\t\t\t\t\t\t\t\t\t\t\thour: \"2-digit\",\n\t\t\t\t\t\t\t\t\t\t\t\tminute: \"2-digit\",\n\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t\t\t{isAI &&\n\t\t\t\t\t\t\t\t\t\t\t\t` ${text(\"component.message.timestamp.aiIndicator\")}`}\n\t\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</TimelineItemTimestamp>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t);\n\t\t\t}}\n\t\t</PrimitiveTimelineItem>\n\t);\n}\n"],"mappings":";;;;;;;;;;AAoBA,SAAgB,oBAAoB,EACnC,MACA,SAAS,OACT,iBAAiB,SAC+B;CAChD,MAAM,OAAO,gBAAgB;AAC7B,QACC,oBAACA;EAA4B;aAC1B,EAAE,MAAM,gBAAgB;GAGzB,MAAM,sBAAsB;AAE5B,UACC,oBAAC;IACA,WAAW,GACV,qBACA,uBAAuB,oBACvB,CAAC,uBAAuB,WACxB;cAED,qBAAC;KACA,WAAW,GACV,qCACA,uBAAuB,YACvB;gBAED,oBAAC;MACA,WAAW,GACV,8DACA;OACC,4DACC,CAAC;OACF,sCAAsC;OACtC,iBAAiB,UAAU;OAC3B,iBAAiB,UAAU,CAAC;OAC5B,CACD;MACD;MACA,MAAM,KAAK;OACV,EACD,UACA,oBAAC;MACA,WAAU;MACC;sBAGV,4CACE,UAAU,mBAAmB,EAAE,EAAE;OACjC,MAAM;OACN,QAAQ;OACR,CAAC,EACD,QACA,IAAI,KAAK,0CAA0C,MAClD;OAEmB;MAEpB;KACD;;GAGe"}
+{"version":3,"file":"timeline-message-item.js","names":["PrimitiveTimelineItem"],"sources":["../../../src/support/components/timeline-message-item.tsx"],"sourcesContent":["import type { TimelineItem } from \"@cossistant/types/api/timeline-item\";\nimport type React from \"react\";\nimport {\n\tTimelineItem as PrimitiveTimelineItem,\n\tTimelineItemContent,\n\tTimelineItemTimestamp,\n} from \"../../primitives/timeline-item\";\nimport { useSupportText } from \"../text\";\nimport { cn } from \"../utils\";\n\nexport type TimelineMessageItemProps = {\n\titem: TimelineItem;\n\tisLast?: boolean;\n\tisSentByViewer?: boolean;\n};\n\n/**\n * Message bubble renderer that adapts layout depending on whether the visitor\n * or an agent sent the message.\n */\nexport function TimelineMessageItem({\n\titem,\n\tisLast = false,\n\tisSentByViewer = false,\n}: TimelineMessageItemProps): React.ReactElement {\n\tconst text = useSupportText();\n\treturn (\n\t\t<PrimitiveTimelineItem item={item}>\n\t\t\t{({ isAI, timestamp }) => {\n\t\t\t\t// isSentByViewer defaults to false, meaning messages are treated as received\n\t\t\t\t// (left side with background) unless explicitly marked as sent by viewer\n\t\t\t\tconst isSentByViewerFinal = isSentByViewer;\n\n\t\t\t\treturn (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\"flex w-full gap-2\",\n\t\t\t\t\t\t\tisSentByViewerFinal && \"flex-row-reverse\",\n\t\t\t\t\t\t\t!isSentByViewerFinal && \"flex-row\"\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\"flex w-full flex-1 flex-col gap-1\",\n\t\t\t\t\t\t\t\tisSentByViewerFinal && \"items-end\"\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<TimelineItemContent\n\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\"block w-max max-w-[300px] rounded-lg px-3.5 py-2.5 text-sm\",\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\"bg-co-background-300 text-co-foreground dark:bg-co-background-600\":\n\t\t\t\t\t\t\t\t\t\t\t!isSentByViewerFinal,\n\t\t\t\t\t\t\t\t\t\t\"bg-co-primary text-co-primary-foreground\":\n\t\t\t\t\t\t\t\t\t\t\tisSentByViewerFinal,\n\t\t\t\t\t\t\t\t\t\t\"rounded-br-sm\": isLast && isSentByViewerFinal,\n\t\t\t\t\t\t\t\t\t\t\"rounded-bl-sm\": isLast && !isSentByViewerFinal,\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\trenderMarkdown\n\t\t\t\t\t\t\t\ttext={item.text}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{isLast && (\n\t\t\t\t\t\t\t\t<TimelineItemTimestamp\n\t\t\t\t\t\t\t\t\tclassName=\"px-1 text-co-muted-foreground text-xs\"\n\t\t\t\t\t\t\t\t\ttimestamp={timestamp}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{() => (\n\t\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t\t{timestamp.toLocaleTimeString([], {\n\t\t\t\t\t\t\t\t\t\t\t\thour: \"2-digit\",\n\t\t\t\t\t\t\t\t\t\t\t\tminute: \"2-digit\",\n\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t\t\t{isAI &&\n\t\t\t\t\t\t\t\t\t\t\t\t` ${text(\"component.message.timestamp.aiIndicator\")}`}\n\t\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</TimelineItemTimestamp>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t);\n\t\t\t}}\n\t\t</PrimitiveTimelineItem>\n\t);\n}\n"],"mappings":";;;;;;;;;;AAoBA,SAAgB,oBAAoB,EACnC,MACA,SAAS,OACT,iBAAiB,SAC+B;CAChD,MAAM,OAAO,gBAAgB;AAC7B,QACC,oBAACA;EAA4B;aAC1B,EAAE,MAAM,gBAAgB;GAGzB,MAAM,sBAAsB;AAE5B,UACC,oBAAC;IACA,WAAW,GACV,qBACA,uBAAuB,oBACvB,CAAC,uBAAuB,WACxB;cAED,qBAAC;KACA,WAAW,GACV,qCACA,uBAAuB,YACvB;gBAED,oBAAC;MACA,WAAW,GACV,8DACA;OACC,qEACC,CAAC;OACF,4CACC;OACD,iBAAiB,UAAU;OAC3B,iBAAiB,UAAU,CAAC;OAC5B,CACD;MACD;MACA,MAAM,KAAK;OACV,EACD,UACA,oBAAC;MACA,WAAU;MACC;sBAGV,4CACE,UAAU,mBAAmB,EAAE,EAAE;OACjC,MAAM;OACN,QAAQ;OACR,CAAC,EACD,QACA,IAAI,KAAK,0CAA0C,MAClD;OAEmB;MAEpB;KACD;;GAGe"}

package/support/components/typing-indicator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"typing-indicator.d.ts","names":[],"sources":["../../../src/support/components/typing-indicator.tsx"],"sourcesContent":[],"mappings":";;;;KAKY,qBAAA;KAEA,iBAAA;EAFA,EAAA,EAAA,MAAA;EAEA,IAAA,EAEL,qBAFsB;AAK7B,CAAA;AAAwD,KAA5C,oBAAA,GAAuB,OAAA,CAAM,cAAe,CAAA,cAAA,CAAA,GAAA;EAArB,YAAM,EAC1B,iBAD0B,EAAA;EAC1B,iBAAA,CAAA,EACM,gBADN,EAAA;EACM,oBAAA,CAAA,EACG,mBADH,EAAA;EACG,WAAA,CAAA,EAAA,OAAA;CAAmB;AAI9B,cAAA,YAAgB,EAAA,CAAA;EAAA;CAInB,EAAA;EAuBG,SAAA,CAAA,EAAA,MAuDZ;CAvD2B,EAAA,GAvBxB,OAAA,CAAM,YAuBkB;AAAA,cAAf,eAAe,EAAA,OAAA,CAAA,yBAAA,CAAA,OAAA,CAAA,cAAA,CAAA,cAAA,CAAA,GAAA;EAjCb,YAAA,EAAA,iBAAA,EAAA;EACM,iBAAA,CAAA,EAAA,gBAAA,EAAA;EACG,oBAAA,CAAA,EAAA,mBAAA,EAAA"}
+{"version":3,"file":"typing-indicator.d.ts","names":[],"sources":["../../../src/support/components/typing-indicator.tsx"],"sourcesContent":[],"mappings":";;;;KAKY,qBAAA;KAEA,iBAAA;EAFA,EAAA,EAAA,MAAA;EAEA,IAAA,EAEL,qBAFsB;AAK7B,CAAA;AAAwD,KAA5C,oBAAA,GAAuB,OAAA,CAAM,cAAe,CAAA,cAAA,CAAA,GAAA;EAArB,YAAM,EAC1B,iBAD0B,EAAA;EAC1B,iBAAA,CAAA,EACM,gBADN,EAAA;EACM,oBAAA,CAAA,EACG,mBADH,EAAA;EACG,WAAA,CAAA,EAAA,OAAA;CAAmB;AAI9B,cAAA,YAAgB,EAAA,CAAA;EAAA;CAIzB,EAAM;EAuBG,SAAA,CAAA,EAAA,MAuDZ;CAvD2B,EAAA,GAvBxB,OAAA,CAAM,YAuBkB;AAAA,cAAf,eAAe,EAAA,OAAA,CAAA,yBAAA,CAAA,OAAA,CAAA,cAAA,CAAA,cAAA,CAAA,GAAA;EAjCb,YAAA,EAAA,iBAAA,EAAA;EACM,iBAAA,CAAA,EAAA,gBAAA,EAAA;EACG,oBAAA,CAAA,EAAA,mBAAA,EAAA"}

package/support/pages/articles.js

@@ -10,24 +10,24 @@ const ArticlesPage = () => /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PUR
 		className: "flex flex-col gap-5",
 		children: [
 			/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", {
-				className: "mb-2 font-medium text-base text-primary",
+				className: "mb-2 font-medium text-base text-co-primary",
 				children: "How do I start a conversation?"
 			}), /* @__PURE__ */ jsx("p", {
-				className: "text-primary/60 text-sm leading-relaxed",
+				className: "text-co-primary/60 text-sm leading-relaxed",
 				children: "Click the \"Start New Conversation\" button on the home page to begin chatting with our support team."
 			})] }),
 			/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", {
-				className: "mb-2 font-medium text-base text-primary",
+				className: "mb-2 font-medium text-base text-co-primary",
 				children: "Can I view previous conversations?"
 			}), /* @__PURE__ */ jsx("p", {
-				className: "text-primary/60 text-sm leading-relaxed",
+				className: "text-co-primary/60 text-sm leading-relaxed",
 				children: "Yes! Navigate to the Conversation History page to see all your past conversations."
 			})] }),
 			/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", {
-				className: "mb-2 font-medium text-base text-primary",
+				className: "mb-2 font-medium text-base text-co-primary",
 				children: "How quickly will I get a response?"
 			}), /* @__PURE__ */ jsx("p", {
-				className: "text-primary/60 text-sm leading-relaxed",
+				className: "text-co-primary/60 text-sm leading-relaxed",
 				children: "Our team typically responds within a few minutes during business hours."
 			})] })
 		]

package/support/pages/articles.js.map

@@ -1 +1 @@
-{"version":3,"file":"articles.js","names":["ArticlesPage: React.FC"],"sources":["../../../src/support/pages/articles.tsx"],"sourcesContent":["import type React from \"react\";\nimport { Container } from \"../components/container\";\nimport { Header } from \"../components/header\";\nimport { NavigationTab } from \"../components/navigation-tab\";\n\nexport const ArticlesPage: React.FC = () => (\n\t<>\n\t\t<Header>\n\t\t\t<NavigationTab />\n\t\t</Header>\n\t\t<Container>\n\t\t\t<div className=\"p-2\">\n\t\t\t\t<div className=\"flex flex-col gap-5\">\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<h3 className=\"mb-2 font-medium text-base text-primary\">\n\t\t\t\t\t\t\tHow do I start a conversation?\n\t\t\t\t\t\t</h3>\n\t\t\t\t\t\t<p className=\"text-primary/60 text-sm leading-relaxed\">\n\t\t\t\t\t\t\tClick the \"Start New Conversation\" button on the home page to\n\t\t\t\t\t\t\tbegin chatting with our support team.\n\t\t\t\t\t\t</p>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<h3 className=\"mb-2 font-medium text-base text-primary\">\n\t\t\t\t\t\t\tCan I view previous conversations?\n\t\t\t\t\t\t</h3>\n\t\t\t\t\t\t<p className=\"text-primary/60 text-sm leading-relaxed\">\n\t\t\t\t\t\t\tYes! Navigate to the Conversation History page to see all your\n\t\t\t\t\t\t\tpast conversations.\n\t\t\t\t\t\t</p>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<h3 className=\"mb-2 font-medium text-base text-primary\">\n\t\t\t\t\t\t\tHow quickly will I get a response?\n\t\t\t\t\t\t</h3>\n\t\t\t\t\t\t<p className=\"text-primary/60 text-sm leading-relaxed\">\n\t\t\t\t\t\t\tOur team typically responds within a few minutes during business\n\t\t\t\t\t\t\thours.\n\t\t\t\t\t\t</p>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Container>\n\t</>\n);\n"],"mappings":";;;;;;AAKA,MAAaA,qBACZ,4CACC,oBAAC,oBACA,oBAAC,kBAAgB,GACT,EACT,oBAAC,uBACA,oBAAC;CAAI,WAAU;WACd,qBAAC;EAAI,WAAU;;GACd,qBAAC,oBACA,oBAAC;IAAG,WAAU;cAA0C;KAEnD,EACL,oBAAC;IAAE,WAAU;cAA0C;KAGnD,IACC;GACN,qBAAC,oBACA,oBAAC;IAAG,WAAU;cAA0C;KAEnD,EACL,oBAAC;IAAE,WAAU;cAA0C;KAGnD,IACC;GACN,qBAAC,oBACA,oBAAC;IAAG,WAAU;cAA0C;KAEnD,EACL,oBAAC;IAAE,WAAU;cAA0C;KAGnD,IACC;;GACD;EACD,GACK,IACV"}
+{"version":3,"file":"articles.js","names":["ArticlesPage: React.FC"],"sources":["../../../src/support/pages/articles.tsx"],"sourcesContent":["import type React from \"react\";\nimport { Container } from \"../components/container\";\nimport { Header } from \"../components/header\";\nimport { NavigationTab } from \"../components/navigation-tab\";\n\nexport const ArticlesPage: React.FC = () => (\n\t<>\n\t\t<Header>\n\t\t\t<NavigationTab />\n\t\t</Header>\n\t\t<Container>\n\t\t\t<div className=\"p-2\">\n\t\t\t\t<div className=\"flex flex-col gap-5\">\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<h3 className=\"mb-2 font-medium text-base text-co-primary\">\n\t\t\t\t\t\t\tHow do I start a conversation?\n\t\t\t\t\t\t</h3>\n\t\t\t\t\t\t<p className=\"text-co-primary/60 text-sm leading-relaxed\">\n\t\t\t\t\t\t\tClick the \"Start New Conversation\" button on the home page to\n\t\t\t\t\t\t\tbegin chatting with our support team.\n\t\t\t\t\t\t</p>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<h3 className=\"mb-2 font-medium text-base text-co-primary\">\n\t\t\t\t\t\t\tCan I view previous conversations?\n\t\t\t\t\t\t</h3>\n\t\t\t\t\t\t<p className=\"text-co-primary/60 text-sm leading-relaxed\">\n\t\t\t\t\t\t\tYes! Navigate to the Conversation History page to see all your\n\t\t\t\t\t\t\tpast conversations.\n\t\t\t\t\t\t</p>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<h3 className=\"mb-2 font-medium text-base text-co-primary\">\n\t\t\t\t\t\t\tHow quickly will I get a response?\n\t\t\t\t\t\t</h3>\n\t\t\t\t\t\t<p className=\"text-co-primary/60 text-sm leading-relaxed\">\n\t\t\t\t\t\t\tOur team typically responds within a few minutes during business\n\t\t\t\t\t\t\thours.\n\t\t\t\t\t\t</p>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Container>\n\t</>\n);\n"],"mappings":";;;;;;AAKA,MAAaA,qBACZ,4CACC,oBAAC,oBACA,oBAAC,kBAAgB,GACT,EACT,oBAAC,uBACA,oBAAC;CAAI,WAAU;WACd,qBAAC;EAAI,WAAU;;GACd,qBAAC,oBACA,oBAAC;IAAG,WAAU;cAA6C;KAEtD,EACL,oBAAC;IAAE,WAAU;cAA6C;KAGtD,IACC;GACN,qBAAC,oBACA,oBAAC;IAAG,WAAU;cAA6C;KAEtD,EACL,oBAAC;IAAE,WAAU;cAA6C;KAGtD,IACC;GACN,qBAAC,oBACA,oBAAC;IAAG,WAAU;cAA6C;KAEtD,EACL,oBAAC;IAAE,WAAU;cAA6C;KAGtD,IACC;;GACD;EACD,GACK,IACV"}