@inkeep/agents-ui 0.1.0 → 0.14.8

package/dist/styled/components/loading-indicator.js

@@ -0,0 +1,36 @@
+"use client";
+import { jsxs as s, jsx as t } from "react/jsx-runtime";
+import { useState as o, useEffect as l } from "react";
+const r = ["Thinking", "Looking for content", "Analyzing"];
+function g() {
+  const [n, i] = o(0);
+  return l(() => {
+    const e = setInterval(() => {
+      i((a) => a + 1 < r.length ? a + 1 : (clearInterval(e), a));
+    }, 3500);
+    return () => clearInterval(e);
+  }, []), /* @__PURE__ */ s(
+    "div",
+    {
+      className: "flex items-center space-x-2 font-medium text-sm text-gray-700 dark:text-gray-dark-300",
+      "aria-live": "polite",
+      children: [
+        /* @__PURE__ */ t("span", { className: "animate-shimmer bg-[linear-gradient(to_bottom_right,_var(--ikp-color-gray-700),_var(--ikp-color-gray-400))] dark:bg-[linear-gradient(to_bottom_right,_var(--ikp-color-gray-dark-300),_var(--ikp-color-gray-dark-100))] bg-clip-text text-transparent", children: r[n] }),
+        /* @__PURE__ */ t("div", { className: "flex space-x-1", children: [0, 1, 2].map((e) => /* @__PURE__ */ t(
+          "span",
+          {
+            className: "animate-bounce-dot opacity-30",
+            style: {
+              animationDelay: `${e * 0.2}s`
+            },
+            children: "."
+          },
+          e
+        )) })
+      ]
+    }
+  );
+}
+export {
+  g as LoadingIndicator
+};

package/dist/styled/components/message.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),A=require("../../primitives/providers/base-events-provider.cjs"),R=require("../../primitives/providers/config-provider.cjs"),O=require("../../primitives/providers/message-provider.cjs"),r=require("../../primitives/components/embedded-chat.cjs"),F=require("../../primitives/components/embedded-chat/chat-provider.cjs"),G=require("merge-anything"),K=require("../utils.cjs"),B=require("./ui/markdown-styles.cjs"),J=require("../../primitives/components/embedded-chat/use-stream-processor.cjs"),Y=require("./data-summary-group.cjs"),i=require("react"),z=require("./embedded-chat.cjs"),H=require("../../types/message.cjs"),k=require("lucide-react"),Q=()=>e.jsx("div",{className:"flex space-x-1",children:[0,1,2].map(s=>e.jsx("span",{className:"animate-bounce-dot opacity-30",style:{animationDelay:`${s*.2}s`},children:"."},s))}),w=({name:s,Icon:n,props:y,componentType:p})=>e.jsxs("div",{className:"border rounded-lg bg-gray-50 dark:bg-gray-dark-800 mb-3",children:[e.jsxs("div",{className:"flex justify-between px-4 py-2 text-xs",children:[e.jsxs("div",{className:"font-medium flex items-center gap-2",children:[e.jsx(n,{className:"w-3 h-3 text-gray-600 dark:text-white-alpha-600"}),e.jsx("span",{children:s})]}),e.jsx("div",{className:"flex items-center px-1.5 py-0.5 rounded-md text-2xs uppercase tracking-wider bg-gray-200 dark:bg-white-alpha-200 font-medium text-gray-700 dark:text-white-alpha-700 font-mono",children:p})]}),e.jsx("pre",{className:"whitespace-pre-wrap text-xs text-gray-700 dark:text-white-alpha-700 font-mono px-4 py-2",children:JSON.stringify(y,null,2)})]}),U=({name:s,props:n})=>e.jsx(w,{name:s,Icon:k.ComponentIcon,props:n,componentType:"component"}),V=({name:s,props:n})=>e.jsx(w,{name:s,Icon:k.Library,props:n,componentType:"artifact"}),W=({className:s,componentStyles:n,children:y,isLast:p,...S})=>{const{message:c}=O.useMessage(),{logEvent:u}=A.useBaseEvents(),{conversationId:C,isStreaming:D,isLoading:q}=F.useChat(),{aiChatSettings:{components:M,artifacts:N}}=R.useInkeepConfig(),T=(D||q)&&p&&c.role==="assistant",{processedParts:E,summaryTimings:I,shouldShowInitialLoading:L,shouldShowStreamDelayLoading:_}=J.useStreamProcessor(c.parts,T),f=i.useMemo(()=>c.parts.filter(t=>t.type==="data-artifact"&&t.data?.type?.toLowerCase()===H.CITATION_ARTIFACT_TYPE),[c.parts]),j=i.useMemo(()=>G.merge(B.markdownStyles,n??{}),[n]),b=i.useCallback((t,a)=>{u({eventName:"assistant_message_inline_link_opened",properties:{title:a?.toString(),url:t}})},[u]),v=i.useCallback((t,a)=>{u({eventName:"assistant_code_block_copied",properties:{conversationId:C,language:t,code:a}})},[u,C]),P=i.useCallback(t=>e.jsx(r.EmbeddedChatPrimitiveMarkdown,{text:t,componentStyles:j,onLinkClick:b,onCodeCopy:v,artifacts:f}),[j,b,v,f]),$=i.useMemo(()=>K.cn("data-[role=user]:whitespace-pre-wrap mb-3 max-w-full",s),[s]);return e.jsxs(e.Fragment,{children:[E.map((t,a)=>{const m={"data-role":c.role,"data-type":t?.type==="data-component"?t.data.type:t?.type,...S,className:$};switch(t?.type){case"text":return e.jsx(r.PrimitiveMessagePart,{...m,children:P(t.text||"")},a);case"data-component":{const{type:d}=t.data;switch(d){case"text":return e.jsx("div",{...m,children:P(t.data.text||"")},a);default:{const g=t.data,{name:o,props:x}=g,l=M?.[o],h=l?r.EmbeddedChatPrimitiveDynamicComponent:U;return e.jsx(r.PrimitiveMessagePart,{...m,children:e.jsx(h,{name:o,props:x,componentDef:l})},`${o}-${a}`)}}}case"data-artifact":{const d=t.data,{name:g,type:o,artifactSummary:x}=d,l=N?.[o],h=l?r.EmbeddedChatPrimitiveDynamicComponent:V;return e.jsx(r.PrimitiveMessagePart,{...m,children:e.jsx(h,{name:o,props:x,componentDef:l})},`${g}-${a}`)}case"summary-group":{const d=I.get(t.groupKey)||{isCompleted:!1};return e.jsx(r.PrimitiveMessagePart,{...m,children:e.jsx(Y.DataSummaryGroup,{summaries:t.summaries||[],isCompleted:d.isCompleted})},`${t.groupKey}-${a}`)}default:return null}}),L&&e.jsx(z.MessageLoading,{}),_&&e.jsx(Q,{})]})};exports.EmbeddedChatMessagePart=W;

package/dist/styled/components/message.js

@@ -0,0 +1,140 @@
+"use client";
+import { jsx as t, jsxs as l, Fragment as O } from "react/jsx-runtime";
+import { useBaseEvents as B } from "../../primitives/providers/base-events-provider.js";
+import { useInkeepConfig as G } from "../../primitives/providers/config-provider.js";
+import { useMessage as J } from "../../primitives/providers/message-provider.js";
+import { EmbeddedChatPrimitiveMarkdown as R, PrimitiveMessagePart as d, EmbeddedChatPrimitiveDynamicComponent as N } from "../../primitives/components/embedded-chat.js";
+import { useChat as Y } from "../../primitives/components/embedded-chat/chat-provider.js";
+import { merge as q } from "merge-anything";
+import { cn as z } from "../utils.js";
+import { markdownStyles as H } from "./ui/markdown-styles.js";
+import { useStreamProcessor as Q } from "../../primitives/components/embedded-chat/use-stream-processor.js";
+import { DataSummaryGroup as U } from "./data-summary-group.js";
+import { useMemo as h, useCallback as y } from "react";
+import { MessageLoading as V } from "./embedded-chat.js";
+import { CITATION_ARTIFACT_TYPE as W } from "../../types/message.js";
+import { Library as X, ComponentIcon as Z } from "lucide-react";
+const ee = () => /* @__PURE__ */ t("div", { className: "flex space-x-1", children: [0, 1, 2].map((a) => /* @__PURE__ */ t(
+  "span",
+  {
+    className: "animate-bounce-dot opacity-30",
+    style: {
+      animationDelay: `${a * 0.2}s`
+    },
+    children: "."
+  },
+  a
+)) }), S = ({ name: a, Icon: n, props: C, componentType: u }) => /* @__PURE__ */ l("div", { className: "border rounded-lg bg-gray-50 dark:bg-gray-dark-800 mb-3", children: [
+  /* @__PURE__ */ l("div", { className: "flex justify-between px-4 py-2 text-xs", children: [
+    /* @__PURE__ */ l("div", { className: "font-medium flex items-center gap-2", children: [
+      /* @__PURE__ */ t(n, { className: "w-3 h-3 text-gray-600 dark:text-white-alpha-600" }),
+      /* @__PURE__ */ t("span", { children: a })
+    ] }),
+    /* @__PURE__ */ t("div", { className: "flex items-center px-1.5 py-0.5 rounded-md text-2xs uppercase tracking-wider bg-gray-200 dark:bg-white-alpha-200 font-medium text-gray-700 dark:text-white-alpha-700 font-mono", children: u })
+  ] }),
+  /* @__PURE__ */ t("pre", { className: "whitespace-pre-wrap text-xs text-gray-700 dark:text-white-alpha-700 font-mono px-4 py-2", children: JSON.stringify(C, null, 2) })
+] }), te = ({ name: a, props: n }) => /* @__PURE__ */ t(S, { name: a, Icon: Z, props: n, componentType: "component" }), ae = ({ name: a, props: n }) => /* @__PURE__ */ t(S, { name: a, Icon: X, props: n, componentType: "artifact" }), Ce = ({
+  className: a,
+  componentStyles: n,
+  children: C,
+  isLast: u,
+  ...L
+}) => {
+  const { message: r } = J(), { logEvent: p } = B(), { conversationId: x, isStreaming: I, isLoading: P } = Y(), {
+    aiChatSettings: { components: T, artifacts: _ }
+  } = G(), M = (I || P) && u && r.role === "assistant", { processedParts: E, summaryTimings: $, shouldShowInitialLoading: A, shouldShowStreamDelayLoading: j } = Q(r.parts, M), w = h(
+    () => r.parts.filter(
+      (e) => e.type === "data-artifact" && e.data?.type?.toLowerCase() === W
+    ),
+    [r.parts]
+  ), k = h(
+    () => q(H, n ?? {}),
+    [n]
+  ), D = y(
+    (e, o) => {
+      p({
+        eventName: "assistant_message_inline_link_opened",
+        properties: {
+          title: o?.toString(),
+          url: e
+        }
+      });
+    },
+    [p]
+  ), b = y(
+    (e, o) => {
+      p({
+        eventName: "assistant_code_block_copied",
+        properties: {
+          conversationId: x,
+          language: e,
+          code: o
+        }
+      });
+    },
+    [p, x]
+  ), v = y(
+    (e) => /* @__PURE__ */ t(
+      R,
+      {
+        text: e,
+        componentStyles: k,
+        onLinkClick: D,
+        onCodeCopy: b,
+        artifacts: w
+      }
+    ),
+    [k, D, b, w]
+  ), F = h(
+    () => z("data-[role=user]:whitespace-pre-wrap mb-3 max-w-full", a),
+    [a]
+  );
+  return /* @__PURE__ */ l(O, { children: [
+    E.map((e, o) => {
+      const m = {
+        "data-role": r.role,
+        "data-type": e?.type === "data-component" ? e.data.type : e?.type,
+        ...L,
+        className: F
+      };
+      switch (e?.type) {
+        case "text":
+          return /* @__PURE__ */ t(d, { ...m, children: v(e.text || "") }, o);
+        case "data-component": {
+          const { type: i } = e.data;
+          switch (i) {
+            case "text":
+              return /* @__PURE__ */ t("div", { ...m, children: v(e.data.text || "") }, o);
+            default: {
+              const f = e.data, { name: s, props: g } = f, c = T?.[s];
+              return /* @__PURE__ */ t(d, { ...m, children: /* @__PURE__ */ t(c ? N : te, { name: s, props: g, componentDef: c }) }, `${s}-${o}`);
+            }
+          }
+        }
+        case "data-artifact": {
+          const i = e.data, { name: f, type: s, artifactSummary: g } = i, c = _?.[s];
+          return /* @__PURE__ */ t(d, { ...m, children: /* @__PURE__ */ t(c ? N : ae, { name: s, props: g, componentDef: c }) }, `${f}-${o}`);
+        }
+        case "summary-group": {
+          const i = $.get(e.groupKey) || {
+            isCompleted: !1
+          };
+          return /* @__PURE__ */ t(d, { ...m, children: /* @__PURE__ */ t(
+            U,
+            {
+              summaries: e.summaries || [],
+              isCompleted: i.isCompleted
+            }
+          ) }, `${e.groupKey}-${o}`);
+        }
+        default:
+          return null;
+      }
+    }),
+    A && /* @__PURE__ */ t(V, {}),
+    j && /* @__PURE__ */ t(ee, {})
+  ] });
+};
+export {
+  Ce as EmbeddedChatMessagePart
+};

package/dist/styled/components/modal.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),o=require("../../primitives/components/modal.cjs"),s=require("../utils.cjs"),l=require("./ui/recipes/button.cjs"),n=require("./ui/recipes/modal.cjs"),r=o.Modal,i=({className:t,...e})=>a.jsx(o.Overlay,{className:s.cn(n.modal({slot:"overlay"}),t),...e}),d=({className:t,...e})=>a.jsx(o.Content,{className:s.cn(n.modal({slot:"content"}),"w-[min(90vw,720px)]","has-[[data-dual-pane-search-expanded]]:w-[min(90vw,1000px)] transition-width duration-300",t),...e}),c=({className:t,...e})=>a.jsx(o.Close,{className:s.cn(n.modal({slot:"close"}),l.button({variant:"ghost",size:"xs"}),"relative inset-[unset] w-6 ml-auto text-lg text-gray-500 dark:text-white-alpha-500 px-0","md:hidden",t),...e});exports.Close=c;exports.Content=d;exports.Overlay=i;exports.Root=r;

package/dist/styled/components/modal.js

@@ -0,0 +1,46 @@
+"use client";
+import { jsx as o } from "react/jsx-runtime";
+import { Modal as l, Overlay as i, Content as n, Close as r } from "../../primitives/components/modal.js";
+import { cn as e } from "../utils.js";
+import { button as m } from "./ui/recipes/button.js";
+import { modal as s } from "./ui/recipes/modal.js";
+const M = l, C = ({
+  className: t,
+  ...a
+}) => /* @__PURE__ */ o(i, { className: e(s({ slot: "overlay" }), t), ...a }), h = ({
+  className: t,
+  ...a
+}) => /* @__PURE__ */ o(
+  n,
+  {
+    className: e(
+      s({ slot: "content" }),
+      "w-[min(90vw,720px)]",
+      // Dual pane
+      "has-[[data-dual-pane-search-expanded]]:w-[min(90vw,1000px)] transition-width duration-300",
+      t
+    ),
+    ...a
+  }
+), w = ({
+  className: t,
+  ...a
+}) => /* @__PURE__ */ o(
+  r,
+  {
+    className: e(
+      s({ slot: "close" }),
+      m({ variant: "ghost", size: "xs" }),
+      "relative inset-[unset] w-6 ml-auto text-lg text-gray-500 dark:text-white-alpha-500 px-0",
+      "md:hidden",
+      t
+    ),
+    ...a
+  }
+);
+export {
+  w as Close,
+  h as Content,
+  C as Overlay,
+  M as Root
+};

package/dist/styled/components/searchbar.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),t=require("../utils.cjs"),c=require("../../primitives/components/searchbar.cjs"),n=({className:e,...r})=>a.jsx(c.SearchBarContainer,{className:t.cn("md:min-w-[min(320px,100%)] w-full h-full min-h-9",e),...r}),s=({className:e,...r})=>a.jsx(c.SearchBarButton,{className:t.cn("rounded-md border px-3 min-w-0 min-h-9 flex items-center justify-between gap-2 h-full w-full hover:border-gray-300 dark:hover:border-white-alpha-300 transition-colors",e),...r}),o=({className:e,...r})=>a.jsx(c.SearchBarContentWrapper,{className:t.cn("flex items-center gap-2 min-w-0",e),...r}),h=({className:e,...r})=>a.jsx(c.SearchBarText,{className:t.cn("text-md text-gray-500 dark:text-white-alpha-600",e),...r}),i=({className:e,...r})=>a.jsx(c.SearchBarIcon,{className:t.cn("text-gray-500 dark:text-white-alpha-600 text-xl",e),...r}),l=({className:e,...r})=>a.jsx(c.SearchBarKbdWrapper,{className:t.cn("text-sm text-gray-400 dark:text-white-alpha-500 font-bold flex items-center gap-0.5",e),...r}),S=({className:e,...r})=>a.jsx(c.SearchBarKbdModifier,{className:t.cn("",e),...r}),d=({className:e,...r})=>a.jsx(c.SearchBarKbdShortcutKey,{className:t.cn("",e),...r});exports.SearchBarButton=s;exports.SearchBarContainer=n;exports.SearchBarContentWrapper=o;exports.SearchBarIcon=i;exports.SearchBarKbdModifier=S;exports.SearchBarKbdShortcutKey=d;exports.SearchBarKbdWrapper=l;exports.SearchBarText=h;

package/dist/styled/components/searchbar.js

@@ -0,0 +1,81 @@
+"use client";
+import { jsx as e } from "react/jsx-runtime";
+import { cn as t } from "../utils.js";
+import { SearchBarContainer as c, SearchBarButton as i, SearchBarContentWrapper as o, SearchBarText as n, SearchBarIcon as h, SearchBarKbdWrapper as s, SearchBarKbdModifier as m, SearchBarKbdShortcutKey as l } from "../../primitives/components/searchbar.js";
+const p = ({
+  className: r,
+  ...a
+}) => /* @__PURE__ */ e(
+  c,
+  {
+    className: t("md:min-w-[min(320px,100%)] w-full h-full min-h-9", r),
+    ...a
+  }
+), x = ({
+  className: r,
+  ...a
+}) => /* @__PURE__ */ e(
+  i,
+  {
+    className: t(
+      "rounded-md border px-3 min-w-0 min-h-9 flex items-center justify-between gap-2 h-full w-full hover:border-gray-300 dark:hover:border-white-alpha-300 transition-colors",
+      r
+    ),
+    ...a
+  }
+), f = ({
+  className: r,
+  ...a
+}) => /* @__PURE__ */ e(
+  o,
+  {
+    className: t("flex items-center gap-2 min-w-0", r),
+    ...a
+  }
+), b = ({
+  className: r,
+  ...a
+}) => /* @__PURE__ */ e(
+  n,
+  {
+    className: t("text-md text-gray-500 dark:text-white-alpha-600", r),
+    ...a
+  }
+), u = ({
+  className: r,
+  ...a
+}) => /* @__PURE__ */ e(
+  h,
+  {
+    className: t("text-gray-500 dark:text-white-alpha-600 text-xl", r),
+    ...a
+  }
+), K = ({
+  className: r,
+  ...a
+}) => /* @__PURE__ */ e(
+  s,
+  {
+    className: t(
+      "text-sm text-gray-400 dark:text-white-alpha-500 font-bold flex items-center gap-0.5",
+      r
+    ),
+    ...a
+  }
+), w = ({
+  className: r,
+  ...a
+}) => /* @__PURE__ */ e(m, { className: t("", r), ...a }), v = ({
+  className: r,
+  ...a
+}) => /* @__PURE__ */ e(l, { className: t("", r), ...a });
+export {
+  x as SearchBarButton,
+  p as SearchBarContainer,
+  f as SearchBarContentWrapper,
+  u as SearchBarIcon,
+  w as SearchBarKbdModifier,
+  v as SearchBarKbdShortcutKey,
+  K as SearchBarKbdWrapper,
+  b as SearchBarText
+};

package/dist/styled/components/shadow.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),n=require("../inkeep.css.cjs"),o=require("../../primitives/atoms/shadow/context.cjs"),r=e=>t.jsx(o.InkeepShadow,{styles:n.default,...e});exports.Shadow=r;

package/dist/styled/components/shadow.js

@@ -0,0 +1,8 @@
+"use client";
+import { jsx as r } from "react/jsx-runtime";
+import t from "../inkeep.css.js";
+import { InkeepShadow as e } from "../../primitives/atoms/shadow/context.js";
+const i = (o) => /* @__PURE__ */ r(e, { styles: t, ...o });
+export {
+  i as Shadow
+};

package/dist/styled/components/sidebar-chat.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),r=require("../../primitives/components/sidebar-chat/index.cjs"),i=require("../utils.cjs"),o=require("./ui/recipes/button.cjs"),s=require("./ui/recipes/scrollable.cjs"),n=({className:t,...e})=>a.jsx(r.SidebarChatPrimitiveRoot,{...e,className:i.cn("w-[--width] h-full relative bg-white dark:bg-gray-dark-950","data-[position=left]:pr-1 data-[position=left]:border-r data-[position=left]:mr-1","data-[position=right]:pl-1 data-[position=right]:border-l data-[position=right]:ml-1","data-[state=open]:data-[position=left]:animate-sidebar-in-left","data-[state=open]:data-[position=right]:animate-sidebar-in-right","data-[state=closed]:data-[position=left]:animate-sidebar-out-left","data-[state=closed]:data-[position=right]:animate-sidebar-out-right",t)}),l=({className:t,...e})=>a.jsx(r.SidebarChatPrimitiveResizer,{className:i.cn("px-1 bg-transparent opacity-0 hover:opacity-100","cursor-ew-resize","absolute top-0 bottom-0 z-[1]",'[[data-position="left"]>&]:-right-1','[[data-position="right"]>&]:-left-1','after:content-[""] after:absolute after:top-0 after:bottom-0 after:w-0.5 after:bg-inkeep-primary-medium dark:after:bg-inkeep-primary-light [[data-position="right"]>&]:after:right-1 [[data-position="left"]>&]:after:left-1',"data-[state=closed]:opacity-0 data-[state=closed]:pointer-events-none","data-[state=open]:pointer-events-auto","transition-opacity duration-200",t),...e}),d=({className:t,...e})=>a.jsx(r.Header,{className:i.cn(s.scrollable({section:"header"}),"w-full flex flex-row items-center px-3 py-1.5","bg-white dark:bg-gray-dark-950","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",t),...e}),p=({className:t,...e})=>a.jsx(r.CloseButton,{className:i.cn(o.button({variant:"ghost",size:"xs"}),"relative inset-[unset] w-6 ml-auto text-lg text-gray-500 dark:text-white-alpha-500 px-0",t),...e});exports.CloseButton=p;exports.Header=d;exports.Resizer=l;exports.Root=n;

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

@@ -0,0 +1,90 @@
+"use client";
+import { jsx as e } from "react/jsx-runtime";
+import { SidebarChatPrimitiveRoot as i, SidebarChatPrimitiveResizer as o, CloseButton as s, Header as n } from "../../primitives/components/sidebar-chat/index.js";
+import { cn as r } from "../utils.js";
+import { button as d } from "./ui/recipes/button.js";
+import { scrollable as l } from "./ui/recipes/scrollable.js";
+const g = ({
+  className: t,
+  ...a
+}) => /* @__PURE__ */ e(
+  i,
+  {
+    ...a,
+    className: r(
+      "w-[--width] h-full relative bg-white dark:bg-gray-dark-950",
+      // For resizer
+      "data-[position=left]:pr-1 data-[position=left]:border-r data-[position=left]:mr-1",
+      "data-[position=right]:pl-1 data-[position=right]:border-l data-[position=right]:ml-1",
+      // Presence-based animations using data-state from the Presence component
+      "data-[state=open]:data-[position=left]:animate-sidebar-in-left",
+      "data-[state=open]:data-[position=right]:animate-sidebar-in-right",
+      "data-[state=closed]:data-[position=left]:animate-sidebar-out-left",
+      "data-[state=closed]:data-[position=right]:animate-sidebar-out-right",
+      t
+    )
+  }
+), c = ({
+  className: t,
+  ...a
+}) => /* @__PURE__ */ e(
+  o,
+  {
+    className: r(
+      "px-1 bg-transparent opacity-0 hover:opacity-100",
+      "cursor-ew-resize",
+      "absolute top-0 bottom-0 z-[1]",
+      '[[data-position="left"]>&]:-right-1',
+      '[[data-position="right"]>&]:-left-1',
+      'after:content-[""] after:absolute after:top-0 after:bottom-0 after:w-0.5 after:bg-inkeep-primary-medium dark:after:bg-inkeep-primary-light [[data-position="right"]>&]:after:right-1 [[data-position="left"]>&]:after:left-1',
+      // Hide resizer when sidebar is closed using presence states
+      "data-[state=closed]:opacity-0 data-[state=closed]:pointer-events-none",
+      "data-[state=open]:pointer-events-auto",
+      "transition-opacity duration-200",
+      t
+    ),
+    ...a
+  }
+), u = ({
+  className: t,
+  ...a
+}) => /* @__PURE__ */ e(
+  n,
+  {
+    className: r(
+      l({ section: "header" }),
+      "w-full flex flex-row items-center px-3 py-1.5",
+      "bg-white dark:bg-gray-dark-950",
+      "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",
+      t
+    ),
+    ...a
+  }
+), x = ({
+  className: t,
+  ...a
+}) => /* @__PURE__ */ e(
+  s,
+  {
+    className: r(
+      d({ variant: "ghost", size: "xs" }),
+      "relative inset-[unset] w-6 ml-auto text-lg text-gray-500 dark:text-white-alpha-500 px-0",
+      t
+    ),
+    ...a
+  }
+);
+export {
+  x as CloseButton,
+  u as Header,
+  c as Resizer,
+  g as Root
+};

package/dist/styled/components/ui/markdown-styles.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./recipes/button.cjs"),t=require("./recipes/link.cjs"),e=require("./recipes/markdown.cjs"),o=require("../../utils.cjs"),n={markdownH1:o.cn(e.heading({size:"lg"}),"mb-3"),markdownH2:o.cn(e.heading({size:"md"}),"mb-2"),markdownP:o.cn("mb-3 break-words whitespace-pre-wrap","[&+ol,&+li]:mt-0"),markdownLi:o.cn("[&_a]:break-words [&_a]:inline"),markdownUl:e.list({style:"unordered"}),markdownOl:o.cn(e.list({style:"ordered"}),"[inset-inline-start:var(--start,0px)]","[counter-reset:item_calc(var(--start,0)_-_1)]"),markdownLink:o.cn(t.link(),"text-inkeep-primary-stronger hover:text-inkeep-primary-strong","dark:text-inkeep-expanded-primary-100 dark:hover:text-inkeep-expanded-primary-300"),markdownSourceLink:e.sup(),markdownSup:e.sup(),markdownTable:e.table({slot:"root"}),markdownTh:e.table({slot:"th"}),markdownTd:e.table({slot:"td"}),markdownCode:e.code(),codeblockContainer:e.codeblock({slot:"container"}),codeblockHeader:e.codeblock({slot:"header"}),codeblockCopyButton:o.cn(r.button({}),e.codeblock({slot:"copyButton"})),codeblockHighlighterWrapper:o.cn(),codeblockHighlighter:e.codeblock({slot:"highlighter"}),codeblockCode:"font-mono",markdownInput:o.cn("mr-1")};exports.markdownStyles=n;

package/dist/styled/components/ui/markdown-styles.js

@@ -0,0 +1,38 @@
+"use client";
+import { button as d } from "./recipes/button.js";
+import { link as i } from "./recipes/link.js";
+import { codeblock as r, code as m, table as e, sup as t, list as n, heading as a } from "./recipes/markdown.js";
+import { cn as o } from "../../utils.js";
+const c = {
+  markdownH1: o(a({ size: "lg" }), "mb-3"),
+  markdownH2: o(a({ size: "md" }), "mb-2"),
+  markdownP: o("mb-3 break-words whitespace-pre-wrap", "[&+ol,&+li]:mt-0"),
+  markdownLi: o("[&_a]:break-words [&_a]:inline"),
+  markdownUl: n({ style: "unordered" }),
+  markdownOl: o(
+    n({ style: "ordered" }),
+    "[inset-inline-start:var(--start,0px)]",
+    "[counter-reset:item_calc(var(--start,0)_-_1)]"
+  ),
+  markdownLink: o(
+    i(),
+    "text-inkeep-primary-stronger hover:text-inkeep-primary-strong",
+    "dark:text-inkeep-expanded-primary-100 dark:hover:text-inkeep-expanded-primary-300"
+  ),
+  markdownSourceLink: t(),
+  markdownSup: t(),
+  markdownTable: e({ slot: "root" }),
+  markdownTh: e({ slot: "th" }),
+  markdownTd: e({ slot: "td" }),
+  markdownCode: m(),
+  codeblockContainer: r({ slot: "container" }),
+  codeblockHeader: r({ slot: "header" }),
+  codeblockCopyButton: o(d({}), r({ slot: "copyButton" })),
+  codeblockHighlighterWrapper: o(),
+  codeblockHighlighter: r({ slot: "highlighter" }),
+  codeblockCode: "font-mono",
+  markdownInput: o("mr-1")
+};
+export {
+  c as markdownStyles
+};

package/dist/styled/components/ui/recipes/ai-chat-page-wrapper.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("class-variance-authority"),a=e.cva(["max-h-screen max-w-screen relative","grow-[5] mx-auto justify-self-center text-left"],{variants:{size:{default:["grow-0 justify-self-center self-center","m-auto max-h-[100vw] max-w-screen","md:w-[min(600px,100%)] md:h-[min(760px,100%)]","lg:w-[min(640px,100%)] lg:h-[min(800px,100%)]","2xl:w-[min(760px,100%)] 2xl:h-[min(900px,100%)]"],expand:["w-full h-full"],"shrink-vertically":["w-full h-auto self-start max-h-full"],"full-viewport":["fixed top-0 left-0 w-screen h-screen z-dropdown"]},variant:{"container-with-shadow":"shadow-[0_25px_50px_-12px_rgba(0,0,0,0.25)] dark:shadow-[none]","no-shadow":"shadow-[none]"}},defaultVariants:{size:"default",variant:"container-with-shadow"}});exports.aiChatPageWrapper=a;

package/dist/styled/components/ui/recipes/ai-chat-page-wrapper.js

@@ -0,0 +1,32 @@
+"use client";
+import { cva as e } from "class-variance-authority";
+const t = e(
+  ["max-h-screen max-w-screen relative", "grow-[5] mx-auto justify-self-center text-left"],
+  {
+    variants: {
+      size: {
+        default: [
+          "grow-0 justify-self-center self-center",
+          "m-auto max-h-[100vw] max-w-screen",
+          "md:w-[min(600px,100%)] md:h-[min(760px,100%)]",
+          "lg:w-[min(640px,100%)] lg:h-[min(800px,100%)]",
+          "2xl:w-[min(760px,100%)] 2xl:h-[min(900px,100%)]"
+        ],
+        expand: ["w-full h-full"],
+        "shrink-vertically": ["w-full h-auto self-start max-h-full"],
+        "full-viewport": ["fixed top-0 left-0 w-screen h-screen z-dropdown"]
+      },
+      variant: {
+        "container-with-shadow": "shadow-[0_25px_50px_-12px_rgba(0,0,0,0.25)] dark:shadow-[none]",
+        "no-shadow": "shadow-[none]"
+      }
+    },
+    defaultVariants: {
+      size: "default",
+      variant: "container-with-shadow"
+    }
+  }
+);
+export {
+  t as aiChatPageWrapper
+};

package/dist/styled/components/ui/recipes/attachment.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("class-variance-authority"),e=require("./button.cjs"),a=t.cva("",{variants:{slot:{root:["flex items-center pl-2","text-xs rounded-md h-6","bg-gray-300 dark:bg-white-alpha-200","min-w-0 w-fit"],icon:["mr-[0.5em]","text-gray-600 dark:text-white-alpha-600"],title:["overflow-hidden whitespace-nowrap text-ellipsis inline-block"],delete:[e.button({variant:"iconButton",size:"md"}),"h-4 px-1 min-w-[unset]","text-gray-600 dark:text-white-alpha-600","hover:bg-transparent hover:text-gray-700","dark:hover:text-white-alpha-500","[&_svg]:w-4 [&_svg]:h-4"]}}});exports.attachment=a;

package/dist/styled/components/ui/recipes/attachment.js

@@ -0,0 +1,28 @@
+"use client";
+import { cva as t } from "class-variance-authority";
+import { button as e } from "./button.js";
+const i = t("", {
+  variants: {
+    slot: {
+      root: [
+        "flex items-center pl-2",
+        "text-xs rounded-md h-6",
+        "bg-gray-300 dark:bg-white-alpha-200",
+        "min-w-0 w-fit"
+      ],
+      icon: ["mr-[0.5em]", "text-gray-600 dark:text-white-alpha-600"],
+      title: ["overflow-hidden whitespace-nowrap text-ellipsis inline-block"],
+      delete: [
+        e({ variant: "iconButton", size: "md" }),
+        "h-4 px-1 min-w-[unset]",
+        "text-gray-600 dark:text-white-alpha-600",
+        "hover:bg-transparent hover:text-gray-700",
+        "dark:hover:text-white-alpha-500",
+        "[&_svg]:w-4 [&_svg]:h-4"
+      ]
+    }
+  }
+});
+export {
+  i as attachment
+};

package/dist/styled/components/ui/recipes/button.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("class-variance-authority"),a=e.cva(["inline-flex","items-center","justify-center","align-middle","select-none","relative","whitespace-nowrap","appearance-none","rounded-md","leading-[1.2]","transition-all","duration-300","cursor-pointer","font-semibold","focus:outline-none","focus:z-base","focus-visible:ring","focus-visible:ring-gray-500","dark:focus-visible:ring-white-alpha-900","focus-visible:ring-2","disabled:opacity-40","disabled:cursor-not-allowed","disabled:shadow-none"],{variants:{variant:{solid:["bg-gray-100 dark:bg-white-alpha-100","text-gray-800 dark:text-white-alpha-950","hover:bg-gray-200 dark:hover:bg-white-alpha-200","hover:disabled:bg-gray-100 dark:hover:disabled:bg-white-alpha-100","active:bg-gray-300 dark:active:bg-white-alpha-400"],iconButton:["px-1 text-gray-500 text-md","hover:text-inkeep-primary-strong","dark:text-gray-dark-200","dark:hover:text-inkeep-expanded-primary-300"],ghost:["text-gray-800 dark:text-white-alpha-950","hover:bg-gray-100 dark:hover:bg-white-alpha-100","active:bg-gray-200 dark:active:bg-white-alpha-200"],outline:["border dark:border-white-alpha-200","text-gray-600 dark:text-gray-200","hover:bg-gray-50 dark:hover:bg-white-alpha-100","active:bg-gray-50 dark:active:bg-white-alpha-100"]},size:{sm:"h-8 min-w-8 text-sm px-3",md:"h-10 min-w-10 text-md px-4",xs:"h-6 min-w-6 text-xs px-2"},preset:{neutralFilled:["bg-gray-1000 text-white hover:bg-gray-900 active:bg-gray-900","dark:bg-inkeep-expanded-primary-300 dark:text-gray-dark-950","dark:hover:bg-inkeep-expanded-primary-200","dark:active:bg-inkeep-expanded-primary-200"]}},defaultVariants:{size:"md"}});exports.button=a;

package/dist/styled/components/ui/recipes/button.js

@@ -0,0 +1,81 @@
+"use client";
+import { cva as e } from "class-variance-authority";
+const r = e(
+  [
+    // Base styles
+    "inline-flex",
+    "items-center",
+    "justify-center",
+    "align-middle",
+    "select-none",
+    "relative",
+    "whitespace-nowrap",
+    "appearance-none",
+    "rounded-md",
+    "leading-[1.2]",
+    "transition-all",
+    "duration-300",
+    "cursor-pointer",
+    "font-semibold",
+    // Focus styles
+    "focus:outline-none",
+    "focus:z-base",
+    "focus-visible:ring",
+    "focus-visible:ring-gray-500",
+    "dark:focus-visible:ring-white-alpha-900",
+    "focus-visible:ring-2",
+    // Disabled styles
+    "disabled:opacity-40",
+    "disabled:cursor-not-allowed",
+    "disabled:shadow-none"
+  ],
+  {
+    variants: {
+      variant: {
+        solid: [
+          "bg-gray-100 dark:bg-white-alpha-100",
+          "text-gray-800 dark:text-white-alpha-950",
+          "hover:bg-gray-200 dark:hover:bg-white-alpha-200",
+          "hover:disabled:bg-gray-100 dark:hover:disabled:bg-white-alpha-100",
+          "active:bg-gray-300 dark:active:bg-white-alpha-400"
+        ],
+        iconButton: [
+          "px-1 text-gray-500 text-md",
+          "hover:text-inkeep-primary-strong",
+          "dark:text-gray-dark-200",
+          "dark:hover:text-inkeep-expanded-primary-300"
+        ],
+        ghost: [
+          "text-gray-800 dark:text-white-alpha-950",
+          "hover:bg-gray-100 dark:hover:bg-white-alpha-100",
+          "active:bg-gray-200 dark:active:bg-white-alpha-200"
+        ],
+        outline: [
+          "border dark:border-white-alpha-200",
+          "text-gray-600 dark:text-gray-200",
+          "hover:bg-gray-50 dark:hover:bg-white-alpha-100",
+          "active:bg-gray-50 dark:active:bg-white-alpha-100"
+        ]
+      },
+      size: {
+        sm: "h-8 min-w-8 text-sm px-3",
+        md: "h-10 min-w-10 text-md px-4",
+        xs: "h-6 min-w-6 text-xs px-2"
+      },
+      preset: {
+        neutralFilled: [
+          "bg-gray-1000 text-white hover:bg-gray-900 active:bg-gray-900",
+          "dark:bg-inkeep-expanded-primary-300 dark:text-gray-dark-950",
+          "dark:hover:bg-inkeep-expanded-primary-200",
+          "dark:active:bg-inkeep-expanded-primary-200"
+        ]
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+export {
+  r as button
+};

package/dist/styled/components/ui/recipes/checkbox.cjs

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("class-variance-authority"),t=e.cva("",{variants:{slot:{root:["peer h-4 w-4 shrink-0 rounded-xs","border-2 border-inherit cursor-pointer","disabled:opacity-50","data-[state=checked]:bg-gray-1000","dark:data-[state=checked]:bg-white-alpha-950","data-[state=checked]:border-gray-1000","dark:data-[state=checked]:border-white-alpha-950","text-white data-[state=checked]:text-white","dark:data-[state=checked]:text-gray-1000"],indicator:["flex items-center justify-center","text-current animate-checkbox-check"]}}});exports.checkbox=t;