@inkeep/agents-ui 0.15.26 → 0.15.28

package/dist/styled/components/chat-history.js

@@ -1,11 +1,11 @@
 "use client";
 import { jsx as a } from "react/jsx-runtime";
-import { ChatHistoryPrimitiveRoot as n, ChatHistoryPrimitiveHeader as h, ChatHistoryPrimitiveBackButtonIcon as l, ChatHistoryPrimitiveBackButton as y, ChatHistoryPrimitiveTitle as c, ChatHistoryPrimitiveList as m, ChatHistoryPrimitiveItem as f, ChatHistoryPrimitiveItemTitle as u, ChatHistoryPrimitiveItemDate as p, ChatHistoryPrimitiveEmptyState as g, ChatHistoryPrimitiveLoadingState as b, ChatHistoryPrimitiveFooter as x, ChatHistoryPrimitiveNewConversationButton as k } from "../../primitives/components/chat-history/index.js";
-import { cn as r } from "../utils.js";
+import { ChatHistoryPrimitiveRoot as n, ChatHistoryPrimitiveHeader as h, ChatHistoryPrimitiveBackButtonIcon as l, ChatHistoryPrimitiveBackButton as c, ChatHistoryPrimitiveTitle as y, ChatHistoryPrimitiveList as m, ChatHistoryPrimitiveItem as f, ChatHistoryPrimitiveItemTitle as u, ChatHistoryPrimitiveItemDate as p, ChatHistoryPrimitiveEmptyState as g, ChatHistoryPrimitiveLoadingState as b, ChatHistoryPrimitiveFooter as x, ChatHistoryPrimitiveNewConversationButton as k } from "../../primitives/components/chat-history/index.js";
+import { cn as o } from "../utils.js";
 import { button as s } from "./ui/recipes/button.js";
 function N(t) {
-  const e = Date.now() - t.getTime(), o = Math.floor(e / (1e3 * 60)), i = Math.floor(e / (1e3 * 60 * 60)), d = Math.floor(e / (1e3 * 60 * 60 * 24));
-  return o < 1 ? "Just now" : o < 60 ? `${o}m ago` : i < 24 ? `${i}h ago` : d < 7 ? t.toLocaleDateString("en-US", { weekday: "short" }) : t.toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" });
+  const e = Date.now() - t.getTime(), r = Math.floor(e / (1e3 * 60)), i = Math.floor(e / (1e3 * 60 * 60)), d = Math.floor(e / (1e3 * 60 * 60 * 24));
+  return r < 1 ? "Just now" : r < 60 ? `${r}m ago` : i < 24 ? `${i}h ago` : d < 7 ? t.toLocaleDateString("en-US", { weekday: "short" }) : t.toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" });
 }
 const E = ({
   className: t,
@@ -13,7 +13,7 @@ const E = ({
 }) => /* @__PURE__ */ a(
   n,
   {
-    className: r(
+    className: o(
       "flex flex-col flex-1 min-h-0 w-full rounded-[inherit] font-body",
       "data-[hidden]:hidden",
       "group-data-[chat-history-layout=sidepane]/chat-history:basis-64",
@@ -34,7 +34,7 @@ const E = ({
 }) => /* @__PURE__ */ a(
   h,
   {
-    className: r(
+    className: o(
       "flex items-center justify-between shrink-0",
       "px-3 py-3 relative",
       "after:absolute after:left-0 after:top-full after:h-3 after:w-full after:text-white after:dark:text-gray-dark-950 after:bg-[linear-gradient(currentColor,_transparent)] after:z-start",
@@ -45,13 +45,13 @@ const E = ({
 ), B = ({
   className: t,
   ...e
-}) => /* @__PURE__ */ a(l, { className: r("text-sm", t), ...e }), S = ({
+}) => /* @__PURE__ */ a(l, { className: o("text-sm", t), ...e }), S = ({
   className: t,
   ...e
 }) => /* @__PURE__ */ a(
-  y,
+  c,
   {
-    className: r(
+    className: o(
       s({ size: "xs", variant: "ghost" }),
       "gap-1.5 text-gray-600 hover:text-gray-800 dark:text-white dark:opacity-60 dark:hover:text-white dark:hover:opacity-95",
       "group-data-[chat-history-layout=sidepane]/chat-history:!hidden",
@@ -62,16 +62,16 @@ const E = ({
 ), I = ({
   className: t,
   children: e,
-  ...o
+  ...r
 }) => /* @__PURE__ */ a(
-  c,
+  y,
   {
-    className: r(
+    className: o(
       "pl-2 text-sm font-normal text-gray-600 dark:text-white-alpha-600",
       "group-data-[chat-history-layout=stack]/chat-history:!hidden",
       t
     ),
-    ...o,
+    ...r,
     children: e ?? "Chats"
   }
 ), D = ({
@@ -80,7 +80,7 @@ const E = ({
 }) => /* @__PURE__ */ a(
   m,
   {
-    className: r(
+    className: o(
       "flex-1 min-h-0 overflow-y-auto [scrollbar-width:thin] px-2 py-3 space-y-0.5",
       t
     ),
@@ -92,7 +92,7 @@ const E = ({
 }) => /* @__PURE__ */ a(
   f,
   {
-    className: r(
+    className: o(
       "flex flex-col gap-0.5 w-full text-left px-3 py-2 rounded-lg",
       "hover:bg-gray-50 dark:hover:bg-gray-dark-900",
       "focus-visible:outline-none focus-visible:bg-gray-50 dark:focus-visible:bg-gray-dark-900",
@@ -104,15 +104,17 @@ const E = ({
   }
 ), M = ({
   className: t,
-  ...e
+  children: e,
+  ...r
 }) => /* @__PURE__ */ a(
   u,
   {
-    className: r(
+    className: o(
       "text-sm text-gray-800 dark:text-white-alpha-950 truncate w-full block",
       t
     ),
-    ...e
+    ...r,
+    children: e || /* @__PURE__ */ a("span", { className: "text-gray-500 dark:text-white-alpha-500", children: "No message" })
   }
 ), T = ({
   className: t,
@@ -120,22 +122,22 @@ const E = ({
 }) => /* @__PURE__ */ a(
   p,
   {
-    className: r("text-xs text-gray-500 dark:text-white-alpha-500", t),
+    className: o("text-xs text-gray-500 dark:text-white-alpha-500", t),
     ...e
   }
 ), j = ({
   className: t,
   children: e,
-  ...o
+  ...r
 }) => /* @__PURE__ */ a(
   g,
   {
-    className: r(
+    className: o(
       "flex flex-col items-center justify-center flex-1 py-2 h-full",
       "text-sm text-gray-500 dark:text-white-alpha-500",
       t
     ),
-    ...o,
+    ...r,
     children: e ?? "No conversations yet."
   }
 ), F = ({
@@ -144,14 +146,14 @@ const E = ({
 }) => /* @__PURE__ */ a(
   b,
   {
-    className: r("flex flex-col px-3 py-2 gap-3", t),
+    className: o("flex flex-col px-3 py-2 gap-3", t),
     ...e,
-    children: [1, 2, 3].map((o) => /* @__PURE__ */ a(
+    children: [1, 2, 3].map((r) => /* @__PURE__ */ a(
       "div",
       {
         className: "h-14 w-full rounded-lg bg-gray-100 dark:bg-gray-dark-800 animate-pulse"
       },
-      o
+      r
     ))
   }
 ), _ = ({
@@ -160,7 +162,7 @@ const E = ({
 }) => /* @__PURE__ */ a(
   x,
   {
-    className: r(
+    className: o(
       "shrink-0 px-5 py-4 relative",
       "before:absolute before:block before:top-0 before:left-0 before:pointer-events-none before:w-full before:h-3 before:bg-[linear-gradient(transparent,_white)] dark:before:bg-[linear-gradient(transparent,_var(--ikp-color-gray-dark-950))] before:-translate-y-full",
       t
@@ -170,12 +172,12 @@ const E = ({
 ), z = ({
   className: t,
   children: e,
-  ...o
+  ...r
 }) => /* @__PURE__ */ a(
   k,
   {
-    className: r(s({ variant: "primaryFilled" }), "w-full shrink-0", t),
-    ...o,
+    className: o(s({ variant: "primaryFilled" }), "w-full shrink-0", t),
+    ...r,
     children: e ?? "New conversation"
   }
 );

package/dist/styled/components/embedded-chat/file-upload-input.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),s=require("../../../primitives/hooks/use-scrolling-fades.cjs"),o=require("../ui/recipes/button.cjs"),d=require("../ui/recipes/icon.cjs"),a=require("../../utils.cjs"),r=require("../../../primitives/components/embedded-chat/file-upload-input.cjs"),l=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveDropZone,{className:a.cn("absolute inset-0 z-10 rounded-lg","flex items-center justify-center","border-2 border-dashed border-inkeep-expanded-primary-500 dark:border-inkeep-expanded-primary-400","bg-gray-50 dark:bg-gray-dark-900","pointer-events-none","text-sm text-gray-500 dark:text-gray-dark-300","opacity-0 transition-opacity","group-data-[drag-over]/fieldset:opacity-100",e),...t}),c=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveFileUploadButton,{className:a.cn(o.button({}),"group","bg-transparent relative size-8 min-w-[unset] rounded-lg transition-all ease-linear","text-gray-500 dark:text-gray-dark-200","hover:bg-gray-200 hover:text-gray-700 dark:hover:bg-white-alpha-100 dark:hover:text-gray-dark-50","active:bg-gray-200 dark:active:bg-white-alpha-100","disabled:cursor-not-allowed hover:disabled:[background:none]",e),...t,children:i.jsx(r.EmbeddedChatPrimitiveFileUploadButtonIcon,{className:a.cn(d.icon(),"text-inherit")})}),b=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveFileInput,{className:a.cn("hidden",e),...t}),m=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveInputNotification,{className:a.cn("flex items-start justify-between gap-3","rounded-lg px-4 py-3 mx-5","bg-white dark:bg-gray-dark-800","border border-gray-200 dark:border-gray-dark-700","absolute bottom-full left-0 right-0 mx-5 mb-1.5","shadow-md dark:shadow-none","animate-notification-in",e),...t}),g=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveInputNotificationContent,{className:a.cn("flex flex-col gap-0.5 w-full",e),...t}),h=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveInputNotificationHeader,{className:a.cn("flex items-center gap-2 justify-between w-full",e),...t}),p=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveInputNotificationTitle,{className:a.cn("text-sm font-medium text-gray-900 dark:text-white-alpha-950",e),...t}),u=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveInputNotificationMessage,{className:a.cn("text-sm text-gray-600 dark:text-white-alpha-600",e),...t}),f=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveInputNotificationClose,{className:a.cn(o.button({variant:"ghost",size:"xs"}),"px-1",e),...t,children:i.jsx(r.EmbeddedChatPrimitiveFileRemoveIcon,{className:a.cn(d.icon())})}),x=({className:e,...t})=>{const n=s.useScrollingFadesHorizontal();return i.jsx("div",{ref:n,className:a.cn("relative","[--scroll-fade-color:var(--ikp-color-gray-50)] dark:[--scroll-fade-color:var(--ikp-color-gray-dark-900)]",'befter:content-[""] befter:absolute befter:inset-y-0 befter:w-10 befter:pointer-events-none befter:z-10',"befter:transition-opacity befter:duration-300 befter:ease-in-out","before:left-0 before:bg-[linear-gradient(to_right,var(--scroll-fade-color),transparent)]","after:right-0 after:bg-[linear-gradient(to_left,var(--scroll-fade-color),transparent)]","has-[[data-scroll-left]]:before:opacity-0","has-[[data-scroll-right]]:after:opacity-0"),children:i.jsx(r.EmbeddedChatPrimitiveFileList,{className:a.cn("flex max-w-full overflow-x-auto gap-2 pt-0.5 pb-1.5 [scrollbar-width:none]",e),...t})})},v=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveFileItem,{className:a.cn("group/chip","relative flex items-center gap-1.5","max-w-[200px] rounded-lg","border border-gray-300 dark:border-gray-dark-600","[--chip-bg:theme(colors.gray.200)] dark:[--chip-bg:theme(colors.gray-dark.700)]","bg-[--chip-bg]","px-1 h-7",e),...t}),C=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveFilePreviewTrigger,{className:a.cn("flex items-center gap-1.5 min-w-0 flex-1","bg-transparent border-0 p-0 text-left cursor-pointer","focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-gray-500 focus-visible:rounded dark:focus-visible:ring-white-alpha-900",e),...t}),y=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveFileContent,{className:a.cn("flex items-center gap-1.5 min-w-0 flex-1",e),...t}),E=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveFileThumbnail,{className:a.cn("size-5 shrink-0 rounded object-cover border border-gray-300 dark:border-gray-dark-600","group-data-[loading]/chip:animate-pulse group-data-[loading]/chip:bg-gray-200 dark:group-data-[loading]/chip:bg-gray-dark-600",e),...t}),k=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveFileTypeIcon,{className:a.cn("size-5 shrink-0 text-gray-600 dark:text-gray-dark-100",e),...t}),N=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveFileName,{className:a.cn("min-w-0 flex-1 truncate text-xs","text-gray-900 dark:text-gray-dark-50",e),...t}),F=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveFileRemove,{className:a.cn("absolute top-0 right-0 rounded-r-lg","flex h-full px-1 items-center justify-center","bg-[--chip-bg]","text-gray-800 dark:text-gray-dark-100","opacity-0 transition-opacity","group-hover/chip:opacity-100","[@media(hover:none)]:opacity-100","focus:outline-none","focus-visible:ring","focus-visible:ring-2","focus-visible:opacity-100","focus-visible:ring-gray-500","dark:focus-visible:ring-white-alpha-900","focus-visible:rounded","before:bg-gradient-to-l before:absolute before:-left-1 before:from-[--chip-bg] before:h-full before:w-1 before:pointer-events-none",e),...t,children:i.jsx(r.EmbeddedChatPrimitiveFileRemoveIcon,{className:a.cn(d.icon(),"size-2.5 text-inherit")})}),w=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveMessageFiles,{className:a.cn("flex flex-wrap gap-2 mt-2 justify-end",e),...t}),j=({className:e,...t})=>i.jsx(r.EmbeddedChatPrimitiveMessageFile,{className:a.cn("relative flex items-center gap-1.5","max-w-[200px] rounded-lg","border","bg-gray-100 dark:bg-white-alpha-100","px-1 h-7","focus-visible:ring-gray-500 dark:focus-visible:ring-white-alpha-900 focus-visible:ring-2 focus:outline-none",e),...t});exports.EmbeddedChatDropZone=l;exports.EmbeddedChatFileContent=y;exports.EmbeddedChatFileInput=b;exports.EmbeddedChatFileItem=v;exports.EmbeddedChatFileList=x;exports.EmbeddedChatFileName=N;exports.EmbeddedChatFilePreviewTrigger=C;exports.EmbeddedChatFileRemove=F;exports.EmbeddedChatFileThumbnail=E;exports.EmbeddedChatFileTypeIcon=k;exports.EmbeddedChatFileUploadButton=c;exports.EmbeddedChatInputNotification=m;exports.EmbeddedChatInputNotificationClose=f;exports.EmbeddedChatInputNotificationContent=g;exports.EmbeddedChatInputNotificationHeader=h;exports.EmbeddedChatInputNotificationMessage=u;exports.EmbeddedChatInputNotificationTitle=p;exports.EmbeddedChatMessageFile=j;exports.EmbeddedChatMessageFiles=w;

package/dist/styled/components/embedded-chat/file-upload-input.d.ts

@@ -0,0 +1,20 @@
+import { EmbeddedChatPrimitive } from '../../../primitives';
+export declare const EmbeddedChatDropZone: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.DropZone>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatFileUploadButton: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.FileUploadButton>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatFileInput: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.FileInput>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatInputNotification: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.InputNotification>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatInputNotificationContent: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.InputNotificationContent>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatInputNotificationHeader: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.InputNotificationHeader>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatInputNotificationTitle: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.InputNotificationTitle>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatInputNotificationMessage: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.InputNotificationMessage>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatInputNotificationClose: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.InputNotificationClose>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatFileList: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.FileList>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatFileItem: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.FileItem>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatFilePreviewTrigger: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.FilePreviewTrigger>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatFileContent: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.FileContent>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatFileThumbnail: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.FileThumbnail>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatFileTypeIcon: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.FileTypeIcon>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatFileName: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.FileName>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatFileRemove: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.FileRemove>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatMessageFiles: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.MessageFiles>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatMessageFile: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.MessageFile>) => import("react/jsx-runtime").JSX.Element;

package/dist/styled/components/embedded-chat/file-upload-input.js

@@ -0,0 +1,300 @@
+"use client";
+import { jsx as a } from "react/jsx-runtime";
+import { useScrollingFadesHorizontal as s } from "../../../primitives/hooks/use-scrolling-fades.js";
+import { button as d } from "../ui/recipes/button.js";
+import { icon as r } from "../ui/recipes/icon.js";
+import { cn as i } from "../../utils.js";
+import { EmbeddedChatPrimitiveDropZone as l, EmbeddedChatPrimitiveFileUploadButton as c, EmbeddedChatPrimitiveFileUploadButtonIcon as m, EmbeddedChatPrimitiveFileInput as b, EmbeddedChatPrimitiveInputNotification as g, EmbeddedChatPrimitiveInputNotificationContent as p, EmbeddedChatPrimitiveInputNotificationHeader as h, EmbeddedChatPrimitiveInputNotificationTitle as f, EmbeddedChatPrimitiveInputNotificationMessage as u, EmbeddedChatPrimitiveInputNotificationClose as v, EmbeddedChatPrimitiveFileRemoveIcon as o, EmbeddedChatPrimitiveFileList as x, EmbeddedChatPrimitiveFileItem as y, EmbeddedChatPrimitiveFilePreviewTrigger as C, EmbeddedChatPrimitiveFileContent as k, EmbeddedChatPrimitiveFileThumbnail as E, EmbeddedChatPrimitiveFileTypeIcon as N, EmbeddedChatPrimitiveFileName as w, EmbeddedChatPrimitiveFileRemove as F, EmbeddedChatPrimitiveMessageFiles as P, EmbeddedChatPrimitiveMessageFile as I } from "../../../primitives/components/embedded-chat/file-upload-input.js";
+const H = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  l,
+  {
+    className: i(
+      "absolute inset-0 z-10 rounded-lg",
+      "flex items-center justify-center",
+      "border-2 border-dashed border-inkeep-expanded-primary-500 dark:border-inkeep-expanded-primary-400",
+      "bg-gray-50 dark:bg-gray-dark-900",
+      "pointer-events-none",
+      "text-sm text-gray-500 dark:text-gray-dark-300",
+      "opacity-0 transition-opacity",
+      "group-data-[drag-over]/fieldset:opacity-100",
+      e
+    ),
+    ...t
+  }
+), U = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  c,
+  {
+    className: i(
+      d({}),
+      "group",
+      "bg-transparent relative size-8 min-w-[unset] rounded-lg transition-all ease-linear",
+      "text-gray-500 dark:text-gray-dark-200",
+      "hover:bg-gray-200 hover:text-gray-700 dark:hover:bg-white-alpha-100 dark:hover:text-gray-dark-50",
+      "active:bg-gray-200 dark:active:bg-white-alpha-100",
+      "disabled:cursor-not-allowed hover:disabled:[background:none]",
+      e
+    ),
+    ...t,
+    children: /* @__PURE__ */ a(
+      m,
+      {
+        className: i(r(), "text-inherit")
+      }
+    )
+  }
+), D = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(b, { className: i("hidden", e), ...t }), L = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  g,
+  {
+    className: i(
+      "flex items-start justify-between gap-3",
+      "rounded-lg px-4 py-3 mx-5",
+      "bg-white dark:bg-gray-dark-800",
+      "border border-gray-200 dark:border-gray-dark-700",
+      "absolute bottom-full left-0 right-0 mx-5 mb-1.5",
+      "shadow-md dark:shadow-none",
+      "animate-notification-in",
+      e
+    ),
+    ...t
+  }
+), Z = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  p,
+  {
+    className: i("flex flex-col gap-0.5 w-full", e),
+    ...t
+  }
+), _ = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  h,
+  {
+    className: i("flex items-center gap-2 justify-between w-full", e),
+    ...t
+  }
+), S = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  f,
+  {
+    className: i("text-sm font-medium text-gray-900 dark:text-white-alpha-950", e),
+    ...t
+  }
+), q = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  u,
+  {
+    className: i("text-sm text-gray-600 dark:text-white-alpha-600", e),
+    ...t
+  }
+), A = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  v,
+  {
+    className: i(
+      d({ variant: "ghost", size: "xs" }),
+      "px-1",
+      e
+    ),
+    ...t,
+    children: /* @__PURE__ */ a(o, { className: i(r()) })
+  }
+), G = ({
+  className: e,
+  ...t
+}) => {
+  const n = s();
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      ref: n,
+      className: i(
+        "relative",
+        "[--scroll-fade-color:var(--ikp-color-gray-50)] dark:[--scroll-fade-color:var(--ikp-color-gray-dark-900)]",
+        'befter:content-[""] befter:absolute befter:inset-y-0 befter:w-10 befter:pointer-events-none befter:z-10',
+        "befter:transition-opacity befter:duration-300 befter:ease-in-out",
+        "before:left-0 before:bg-[linear-gradient(to_right,var(--scroll-fade-color),transparent)]",
+        "after:right-0 after:bg-[linear-gradient(to_left,var(--scroll-fade-color),transparent)]",
+        "has-[[data-scroll-left]]:before:opacity-0",
+        "has-[[data-scroll-right]]:after:opacity-0"
+      ),
+      children: /* @__PURE__ */ a(
+        x,
+        {
+          className: i("flex max-w-full overflow-x-auto gap-2 pt-0.5 pb-1.5 [scrollbar-width:none]", e),
+          ...t
+        }
+      )
+    }
+  );
+}, J = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  y,
+  {
+    className: i(
+      "group/chip",
+      "relative flex items-center gap-1.5",
+      "max-w-[200px] rounded-lg",
+      "border border-gray-300 dark:border-gray-dark-600",
+      "[--chip-bg:theme(colors.gray.200)] dark:[--chip-bg:theme(colors.gray-dark.700)]",
+      "bg-[--chip-bg]",
+      "px-1 h-7",
+      e
+    ),
+    ...t
+  }
+), K = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  C,
+  {
+    className: i(
+      "flex items-center gap-1.5 min-w-0 flex-1",
+      "bg-transparent border-0 p-0 text-left cursor-pointer",
+      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-gray-500 focus-visible:rounded dark:focus-visible:ring-white-alpha-900",
+      e
+    ),
+    ...t
+  }
+), O = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  k,
+  {
+    className: i("flex items-center gap-1.5 min-w-0 flex-1", e),
+    ...t
+  }
+), Q = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  E,
+  {
+    className: i(
+      "size-5 shrink-0 rounded object-cover border border-gray-300 dark:border-gray-dark-600",
+      "group-data-[loading]/chip:animate-pulse group-data-[loading]/chip:bg-gray-200 dark:group-data-[loading]/chip:bg-gray-dark-600",
+      e
+    ),
+    ...t
+  }
+), V = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  N,
+  {
+    className: i("size-5 shrink-0 text-gray-600 dark:text-gray-dark-100", e),
+    ...t
+  }
+), W = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  w,
+  {
+    className: i(
+      "min-w-0 flex-1 truncate text-xs",
+      "text-gray-900 dark:text-gray-dark-50",
+      e
+    ),
+    ...t
+  }
+), X = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  F,
+  {
+    className: i(
+      "absolute top-0 right-0 rounded-r-lg",
+      "flex h-full px-1 items-center justify-center",
+      "bg-[--chip-bg]",
+      "text-gray-800 dark:text-gray-dark-100",
+      "opacity-0 transition-opacity",
+      "group-hover/chip:opacity-100",
+      "[@media(hover:none)]:opacity-100",
+      "focus:outline-none",
+      "focus-visible:ring",
+      "focus-visible:ring-2",
+      "focus-visible:opacity-100",
+      "focus-visible:ring-gray-500",
+      "dark:focus-visible:ring-white-alpha-900",
+      "focus-visible:rounded",
+      "before:bg-gradient-to-l before:absolute before:-left-1 before:from-[--chip-bg] before:h-full before:w-1 before:pointer-events-none",
+      e
+    ),
+    ...t,
+    children: /* @__PURE__ */ a(o, { className: i(r(), "size-2.5 text-inherit") })
+  }
+), Y = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  P,
+  {
+    className: i("flex flex-wrap gap-2 mt-2 justify-end", e),
+    ...t
+  }
+), $ = ({
+  className: e,
+  ...t
+}) => /* @__PURE__ */ a(
+  I,
+  {
+    className: i(
+      "relative flex items-center gap-1.5",
+      "max-w-[200px] rounded-lg",
+      "border",
+      "bg-gray-100 dark:bg-white-alpha-100",
+      "px-1 h-7",
+      "focus-visible:ring-gray-500 dark:focus-visible:ring-white-alpha-900 focus-visible:ring-2 focus:outline-none",
+      e
+    ),
+    ...t
+  }
+);
+export {
+  H as EmbeddedChatDropZone,
+  O as EmbeddedChatFileContent,
+  D as EmbeddedChatFileInput,
+  J as EmbeddedChatFileItem,
+  G as EmbeddedChatFileList,
+  W as EmbeddedChatFileName,
+  K as EmbeddedChatFilePreviewTrigger,
+  X as EmbeddedChatFileRemove,
+  Q as EmbeddedChatFileThumbnail,
+  V as EmbeddedChatFileTypeIcon,
+  U as EmbeddedChatFileUploadButton,
+  L as EmbeddedChatInputNotification,
+  A as EmbeddedChatInputNotificationClose,
+  Z as EmbeddedChatInputNotificationContent,
+  _ as EmbeddedChatInputNotificationHeader,
+  q as EmbeddedChatInputNotificationMessage,
+  S as EmbeddedChatInputNotificationTitle,
+  $ as EmbeddedChatMessageFile,
+  Y as EmbeddedChatMessageFiles
+};

package/dist/styled/components/embedded-chat/image-preview-modal.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("react/jsx-runtime"),i=require("../ui/recipes/modal.cjs"),m=require("../../utils.cjs"),t=require("../../../primitives/components/embedded-chat/image-preview-modal.cjs"),o=t.EmbeddedChatPrimitiveImagePreviewModal,r=({className:e,...a})=>d.jsx(t.EmbeddedChatPrimitiveImagePreviewModalOverlay,{className:m.cn(i.modal({slot:"overlay"}),e),...a}),l=({className:e,...a})=>d.jsx(t.EmbeddedChatPrimitiveImagePreviewModalContent,{className:m.cn(i.modal({slot:"content"}),"flex flex-col items-center gap-2","max-w-[100vw] max-h-screen","inset-0 m-auto w-fit h-fit transform-none","bg-transparent dark:bg-transparent shadow-none",e),...a}),s=({className:e,...a})=>d.jsx(t.EmbeddedChatPrimitiveImagePreviewModalImage,{className:m.cn("max-w-[calc(100vw_-_theme(spacing.20))] max-h-[calc(100vh_-_theme(spacing.20))] object-contain rounded-lg",e),...a}),n=({className:e,...a})=>d.jsx(t.EmbeddedChatPrimitiveImagePreviewModalFooter,{className:m.cn("flex items-center justify-center w-full gap-4",e),...a}),c=({className:e,...a})=>d.jsx(t.EmbeddedChatPrimitiveImagePreviewModalFileName,{className:m.cn("text-sm text-center text-gray-800 dark:text-white truncate min-w-0",e),...a}),g=({className:e,...a})=>d.jsx(t.EmbeddedChatPrimitiveImagePreviewModalClose,{"aria-label":"Close preview",className:m.cn(i.modal({slot:"close"}),"fixed top-2 right-2 text-gray-700 dark:text-gray-50 hover:bg-white-alpha-100",e),...a});exports.EmbeddedChatImagePreviewModal=o;exports.EmbeddedChatImagePreviewModalClose=g;exports.EmbeddedChatImagePreviewModalContent=l;exports.EmbeddedChatImagePreviewModalFileName=c;exports.EmbeddedChatImagePreviewModalFooter=n;exports.EmbeddedChatImagePreviewModalImage=s;exports.EmbeddedChatImagePreviewModalOverlay=r;

package/dist/styled/components/embedded-chat/image-preview-modal.d.ts

@@ -0,0 +1,11 @@
+import { EmbeddedChatPrimitive } from '../../../primitives';
+import { ComponentPropsWithRef, ForwardRefExoticComponent } from 'react';
+import { PolymorphicProps } from '../..';
+import { DialogProps } from '../../../primitives/atoms/dialog';
+export declare const EmbeddedChatImagePreviewModal: (props: ComponentPropsWithRef<ForwardRefExoticComponent< PolymorphicProps & Omit< DialogProps, "_id"> & Partial<Pick< DialogProps, "_id">>>>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatImagePreviewModalOverlay: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.ImagePreviewModalOverlay>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatImagePreviewModalContent: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.ImagePreviewModalContent>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatImagePreviewModalImage: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.ImagePreviewModalImage>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatImagePreviewModalFooter: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.ImagePreviewModalFooter>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatImagePreviewModalFileName: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.ImagePreviewModalFileName>) => import("react/jsx-runtime").JSX.Element;
+export declare const EmbeddedChatImagePreviewModalClose: ({ className, ...props }: React.ComponentPropsWithRef<typeof EmbeddedChatPrimitive.ImagePreviewModalClose>) => import("react/jsx-runtime").JSX.Element;

package/dist/styled/components/embedded-chat/image-preview-modal.js

@@ -0,0 +1,77 @@
+"use client";
+import { jsx as t } from "react/jsx-runtime";
+import { modal as d } from "../ui/recipes/modal.js";
+import { cn as m } from "../../utils.js";
+import { EmbeddedChatPrimitiveImagePreviewModal as i, EmbeddedChatPrimitiveImagePreviewModalOverlay as r, EmbeddedChatPrimitiveImagePreviewModalContent as o, EmbeddedChatPrimitiveImagePreviewModalImage as l, EmbeddedChatPrimitiveImagePreviewModalFooter as s, EmbeddedChatPrimitiveImagePreviewModalFileName as n, EmbeddedChatPrimitiveImagePreviewModalClose as c } from "../../../primitives/components/embedded-chat/image-preview-modal.js";
+const P = i, b = ({
+  className: e,
+  ...a
+}) => /* @__PURE__ */ t(
+  r,
+  {
+    className: m(d({ slot: "overlay" }), e),
+    ...a
+  }
+), C = ({
+  className: e,
+  ...a
+}) => /* @__PURE__ */ t(
+  o,
+  {
+    className: m(
+      d({ slot: "content" }),
+      "flex flex-col items-center gap-2",
+      "max-w-[100vw] max-h-screen",
+      "inset-0 m-auto w-fit h-fit transform-none",
+      "bg-transparent dark:bg-transparent shadow-none",
+      e
+    ),
+    ...a
+  }
+), x = ({
+  className: e,
+  ...a
+}) => /* @__PURE__ */ t(
+  l,
+  {
+    className: m("max-w-[calc(100vw_-_theme(spacing.20))] max-h-[calc(100vh_-_theme(spacing.20))] object-contain rounded-lg", e),
+    ...a
+  }
+), I = ({
+  className: e,
+  ...a
+}) => /* @__PURE__ */ t(
+  s,
+  {
+    className: m("flex items-center justify-center w-full gap-4", e),
+    ...a
+  }
+), p = ({
+  className: e,
+  ...a
+}) => /* @__PURE__ */ t(
+  n,
+  {
+    className: m("text-sm text-center text-gray-800 dark:text-white truncate min-w-0", e),
+    ...a
+  }
+), E = ({
+  className: e,
+  ...a
+}) => /* @__PURE__ */ t(
+  c,
+  {
+    "aria-label": "Close preview",
+    className: m(d({ slot: "close" }), "fixed top-2 right-2 text-gray-700 dark:text-gray-50 hover:bg-white-alpha-100", e),
+    ...a
+  }
+);
+export {
+  P as EmbeddedChatImagePreviewModal,
+  E as EmbeddedChatImagePreviewModalClose,
+  C as EmbeddedChatImagePreviewModalContent,
+  p as EmbeddedChatImagePreviewModalFileName,
+  I as EmbeddedChatImagePreviewModalFooter,
+  x as EmbeddedChatImagePreviewModalImage,
+  b as EmbeddedChatImagePreviewModalOverlay
+};