@ai-matrx/chat 0.5.0 → 0.5.3

package/dist/agents/components/inputs/smart-input/composer/ComposerSplash.js

@@ -1,4 +1,5 @@
 "use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import {
   useEffect,
   useRef,
@@ -30,13 +31,19 @@ function ComposerGreeting({ className }) {
     () => timeOfDayGreeting((/* @__PURE__ */ new Date()).getHours()),
     () => null
   );
-  return /* @__PURE__ */ React.createElement("div", { className: cn("flex items-center justify-center gap-3.5", className) }, /* @__PURE__ */ React.createElement(
-    "span",
-    {
-      className: "inline-block h-4 w-4 shrink-0 rounded-full bg-foreground",
-      "aria-hidden": "true"
-    }
-  ), /* @__PURE__ */ React.createElement("h1", { className: "font-serif text-[clamp(2rem,1.6rem+1.8vw,2.875rem)] font-normal tracking-tight text-foreground" }, greeting ?? "Hello", firstName ? `, ${firstName}` : ""));
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex items-center justify-center gap-3.5", className), children: [
+    /* @__PURE__ */ jsx(
+      "span",
+      {
+        className: "inline-block h-4 w-4 shrink-0 rounded-full bg-foreground",
+        "aria-hidden": "true"
+      }
+    ),
+    /* @__PURE__ */ jsxs("h1", { className: "font-serif text-[clamp(2rem,1.6rem+1.8vw,2.875rem)] font-normal tracking-tight text-foreground", children: [
+      greeting ?? "Hello",
+      firstName ? `, ${firstName}` : ""
+    ] })
+  ] });
 }
 function parseQuickActions(value) {
   if (!Array.isArray(value)) return [];
@@ -87,45 +94,54 @@ function ComposerQuickActions({
   }, [actions.length]);
   if (!organizationId) return null;
   if (knob === void 0) {
-    return /* @__PURE__ */ React.createElement(ComposerQuickActionsSkeleton, { className });
+    return /* @__PURE__ */ jsx(ComposerQuickActionsSkeleton, { className });
   }
   if (actions.length === 0) return null;
-  return /* @__PURE__ */ React.createElement("div", { className: cn("flex min-w-0 items-center gap-2", className) }, /* @__PURE__ */ React.createElement("div", { className: "relative min-w-0 flex-1" }, /* @__PURE__ */ React.createElement(
-    "div",
-    {
-      ref: scrollerRef,
-      className: "flex min-w-0 flex-nowrap gap-2 overflow-x-auto px-1 [scrollbar-width:none] [&::-webkit-scrollbar]:hidden"
-    },
-    actions.map((action) => {
-      const state = mandates[action.mandateKey];
-      const agentId = state?.mandate?.agentId ?? null;
-      const unavailable = Boolean(state && !state.loading && state.error);
-      return /* @__PURE__ */ React.createElement(Button, { variant: "outline", key: `${action.mandateKey}:${action.label}`, disabled: !agentId, title: unavailable ? `"${action.label}" is not available yet \u2014 its agent has not been assigned (${action.mandateKey}).` : void 0, onClick: () => agentId && onLaunchAgent(agentId), className: "shrink-0" }, action.label);
-    })
-  ), canScroll ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-    "div",
-    {
-      className: "pointer-events-none absolute inset-y-0 right-0 w-[72px] bg-gradient-to-r from-transparent via-background/80 to-background",
-      "aria-hidden": "true"
-    }
-  ), /* @__PURE__ */ React.createElement(Button, { variant: "outline", icon: /* @__PURE__ */ React.createElement(ChevronRight, null), onClick: () => scrollerRef.current?.scrollBy({ left: 240, behavior: "smooth" }), "aria-label": "More quick actions", className: "absolute right-0 top-0" })) : null), trailing?.(actions.map((a) => a.mandateKey)));
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex min-w-0 items-center gap-2", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "relative min-w-0 flex-1", children: [
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          ref: scrollerRef,
+          className: "flex min-w-0 flex-nowrap gap-2 overflow-x-auto px-1 [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",
+          children: actions.map((action) => {
+            const state = mandates[action.mandateKey];
+            const agentId = state?.mandate?.agentId ?? null;
+            const unavailable = Boolean(state && !state.loading && state.error);
+            return /* @__PURE__ */ jsx(Button, { variant: "outline", disabled: !agentId, title: unavailable ? `"${action.label}" is not available yet \u2014 its agent has not been assigned (${action.mandateKey}).` : void 0, onClick: () => agentId && onLaunchAgent(agentId), className: "shrink-0", children: action.label }, `${action.mandateKey}:${action.label}`);
+          })
+        }
+      ),
+      canScroll ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "pointer-events-none absolute inset-y-0 right-0 w-[72px] bg-gradient-to-r from-transparent via-background/80 to-background",
+            "aria-hidden": "true"
+          }
+        ),
+        /* @__PURE__ */ jsx(Button, { variant: "outline", icon: /* @__PURE__ */ jsx(ChevronRight, {}), onClick: () => scrollerRef.current?.scrollBy({ left: 240, behavior: "smooth" }), "aria-label": "More quick actions", className: "absolute right-0 top-0" })
+      ] }) : null
+    ] }),
+    trailing?.(actions.map((a) => a.mandateKey))
+  ] });
 }
 function ComposerQuickActionsSkeleton({ className }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "div",
     {
       className: cn("flex h-[34px] gap-2 overflow-hidden", className),
       "aria-busy": "true",
-      "aria-label": "Loading quick actions"
-    },
-    [120, 104, 150, 132].map((w) => /* @__PURE__ */ React.createElement(
-      "span",
-      {
-        key: w,
-        className: "h-[34px] shrink-0 animate-pulse rounded-lg bg-muted",
-        style: { width: w }
-      }
-    ))
+      "aria-label": "Loading quick actions",
+      children: [120, 104, 150, 132].map((w) => /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: "h-[34px] shrink-0 animate-pulse rounded-lg bg-muted",
+          style: { width: w }
+        },
+        w
+      ))
+    }
   );
 }
 export {

package/dist/agents/components/inputs/variable-input-variations/AgentVariableCards.js

@@ -1,4 +1,5 @@
 "use client";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { useAppDispatch, useAppSelector } from "../../../../store/hooks.js";
 import { selectInstanceVariableDefinitions } from "../../../redux/execution-system/instance-variable-values/instance-variable-values.selectors.js";
@@ -32,123 +33,130 @@ function AgentVariableInputCard({
       setUserVariableValue({ conversationId, name: variable.name, value })
     );
   };
-  return /* @__PURE__ */ React.createElement("div", { className: "w-full bg-card border border-border rounded-xl shadow-sm animate-in slide-in-from-bottom-2 duration-200 overflow-hidden" }, /* @__PURE__ */ React.createElement("div", { className: "px-3 py-2" }, /* @__PURE__ */ React.createElement("label", { className: "text-[10px] font-medium text-muted-foreground uppercase tracking-wider block mb-1.5" }, variableRunLabel(variable), variable.required && /* @__PURE__ */ React.createElement("span", { className: "text-destructive ml-0.5" }, "*")), variable.helpText && /* @__PURE__ */ React.createElement("p", { className: "text-[10px] text-muted-foreground/70 mb-1.5" }, variable.helpText), /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-1.5" }, /* @__PURE__ */ React.createElement("div", { className: "flex-1 min-w-0" }, type === "textarea" ? /* @__PURE__ */ React.createElement(
-    TextMicroInput,
-    {
-      value: currentValue ?? "",
-      onChange: setValue
-    }
-  ) : type === "toggle" || type === "light-switch" ? /* @__PURE__ */ React.createElement(
-    ToggleMicroInput,
-    {
-      value: currentValue,
-      labels: comp?.toggleValues ?? ["On", "Off"],
-      onChange: setValue
-    }
-  ) : type === "radio" || type === "pill-toggle" || type === "selection-list" || type === "buttons" ? /* @__PURE__ */ React.createElement(
-    ChipsMicroInput,
-    {
-      options: comp?.options ?? [],
-      selected: currentValue ?? "",
-      onSelect: setValue,
-      multi: false
-    }
-  ) : type === "checkbox" ? /* @__PURE__ */ React.createElement(
-    ChipsMicroInput,
-    {
-      options: comp?.options ?? [],
-      selected: currentValue ?? [],
-      onSelect: setValue,
-      multi: true
-    }
-  ) : type === "select" ? /* @__PURE__ */ React.createElement(
-    SelectMicroInput,
-    {
-      options: comp?.options ?? [],
-      value: currentValue ?? "",
-      onChange: setValue
-    }
-  ) : type === "number" || type === "slider" ? /* @__PURE__ */ React.createElement(
-    NumberMicroInput,
-    {
-      value: currentValue ?? comp?.min ?? 0,
-      min: comp?.min,
-      max: comp?.max,
-      step: comp?.step ?? 1,
-      onChange: setValue
-    }
-  ) : isMediaVariableType(type) ? type === "image" ? /* @__PURE__ */ React.createElement(
-    ImageVariableInput,
-    {
-      value: currentValue,
-      onChange: setValue,
-      variableName: variable.name,
-      compact: true,
-      resourceContext: comp?.resource_context,
-      conversationId
-    }
-  ) : type === "audio" ? /* @__PURE__ */ React.createElement(
-    AudioVariableInput,
-    {
-      value: currentValue,
-      onChange: setValue,
-      variableName: variable.name,
-      compact: true,
-      resourceContext: comp?.resource_context,
-      conversationId
-    }
-  ) : type === "video" ? /* @__PURE__ */ React.createElement(
-    VideoVariableInput,
-    {
-      value: currentValue,
-      onChange: setValue,
-      variableName: variable.name,
-      compact: true,
-      resourceContext: comp?.resource_context,
-      conversationId
-    }
-  ) : type === "document" ? /* @__PURE__ */ React.createElement(
-    DocumentVariableInput,
-    {
-      value: currentValue,
-      onChange: setValue,
-      variableName: variable.name,
-      compact: true,
-      resourceContext: comp?.resource_context,
-      conversationId
-    }
-  ) : /* @__PURE__ */ React.createElement(
-    YoutubeVariableInput,
-    {
-      value: currentValue,
-      onChange: setValue,
-      variableName: variable.name,
-      compact: true
-    }
-  ) : /* @__PURE__ */ React.createElement(
-    TextMicroInput,
-    {
-      value: currentValue ?? "",
-      onChange: setValue
-    }
-  )))));
+  return /* @__PURE__ */ jsx("div", { className: "w-full bg-card border border-border rounded-xl shadow-sm animate-in slide-in-from-bottom-2 duration-200 overflow-hidden", children: /* @__PURE__ */ jsxs("div", { className: "px-3 py-2", children: [
+    /* @__PURE__ */ jsxs("label", { className: "text-[10px] font-medium text-muted-foreground uppercase tracking-wider block mb-1.5", children: [
+      variableRunLabel(variable),
+      variable.required && /* @__PURE__ */ jsx("span", { className: "text-destructive ml-0.5", children: "*" })
+    ] }),
+    variable.helpText && /* @__PURE__ */ jsx("p", { className: "text-[10px] text-muted-foreground/70 mb-1.5", children: variable.helpText }),
+    /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1.5", children: /* @__PURE__ */ jsx("div", { className: "flex-1 min-w-0", children: type === "textarea" ? /* @__PURE__ */ jsx(
+      TextMicroInput,
+      {
+        value: currentValue ?? "",
+        onChange: setValue
+      }
+    ) : type === "toggle" || type === "light-switch" ? /* @__PURE__ */ jsx(
+      ToggleMicroInput,
+      {
+        value: currentValue,
+        labels: comp?.toggleValues ?? ["On", "Off"],
+        onChange: setValue
+      }
+    ) : type === "radio" || type === "pill-toggle" || type === "selection-list" || type === "buttons" ? /* @__PURE__ */ jsx(
+      ChipsMicroInput,
+      {
+        options: comp?.options ?? [],
+        selected: currentValue ?? "",
+        onSelect: setValue,
+        multi: false
+      }
+    ) : type === "checkbox" ? /* @__PURE__ */ jsx(
+      ChipsMicroInput,
+      {
+        options: comp?.options ?? [],
+        selected: currentValue ?? [],
+        onSelect: setValue,
+        multi: true
+      }
+    ) : type === "select" ? /* @__PURE__ */ jsx(
+      SelectMicroInput,
+      {
+        options: comp?.options ?? [],
+        value: currentValue ?? "",
+        onChange: setValue
+      }
+    ) : type === "number" || type === "slider" ? /* @__PURE__ */ jsx(
+      NumberMicroInput,
+      {
+        value: currentValue ?? comp?.min ?? 0,
+        min: comp?.min,
+        max: comp?.max,
+        step: comp?.step ?? 1,
+        onChange: setValue
+      }
+    ) : isMediaVariableType(type) ? type === "image" ? /* @__PURE__ */ jsx(
+      ImageVariableInput,
+      {
+        value: currentValue,
+        onChange: setValue,
+        variableName: variable.name,
+        compact: true,
+        resourceContext: comp?.resource_context,
+        conversationId
+      }
+    ) : type === "audio" ? /* @__PURE__ */ jsx(
+      AudioVariableInput,
+      {
+        value: currentValue,
+        onChange: setValue,
+        variableName: variable.name,
+        compact: true,
+        resourceContext: comp?.resource_context,
+        conversationId
+      }
+    ) : type === "video" ? /* @__PURE__ */ jsx(
+      VideoVariableInput,
+      {
+        value: currentValue,
+        onChange: setValue,
+        variableName: variable.name,
+        compact: true,
+        resourceContext: comp?.resource_context,
+        conversationId
+      }
+    ) : type === "document" ? /* @__PURE__ */ jsx(
+      DocumentVariableInput,
+      {
+        value: currentValue,
+        onChange: setValue,
+        variableName: variable.name,
+        compact: true,
+        resourceContext: comp?.resource_context,
+        conversationId
+      }
+    ) : /* @__PURE__ */ jsx(
+      YoutubeVariableInput,
+      {
+        value: currentValue,
+        onChange: setValue,
+        variableName: variable.name,
+        compact: true
+      }
+    ) : /* @__PURE__ */ jsx(
+      TextMicroInput,
+      {
+        value: currentValue ?? "",
+        onChange: setValue
+      }
+    ) }) })
+  ] }) });
 }
 function SubmitArrow({ onClick }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     Button,
     {
       variant: "primary",
       className: "shrink-0",
-      onClick
-    },
-    /* @__PURE__ */ React.createElement(ArrowRight, { className: "w-3 h-3" })
+      onClick,
+      children: /* @__PURE__ */ jsx(ArrowRight, { className: "w-3 h-3" })
+    }
   );
 }
 function TextMicroInput({
   value,
   onChange
 }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     "input",
     {
       type: "text",
@@ -165,7 +173,7 @@ function ToggleMicroInput({
   labels,
   onChange
 }) {
-  return /* @__PURE__ */ React.createElement("div", { className: "flex gap-1" }, labels.map((label) => /* @__PURE__ */ React.createElement(Button, { variant: "outline", pressed: !!(value === label), key: label, onClick: () => onChange(label), className: "flex-1" }, label)));
+  return /* @__PURE__ */ jsx("div", { className: "flex gap-1", children: labels.map((label) => /* @__PURE__ */ jsx(Button, { variant: "outline", pressed: !!(value === label), onClick: () => onChange(label), className: "flex-1", children: label }, label)) });
 }
 function ChipsMicroInput({
   options,
@@ -184,23 +192,25 @@ function ChipsMicroInput({
       onSelect(opt);
     }
   };
-  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap gap-1" }, options.map((opt) => /* @__PURE__ */ React.createElement(Button, { variant: "outline", pressed: !!isSelected(opt), key: opt, onClick: () => handleClick(opt) }, opt)));
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1", children: options.map((opt) => /* @__PURE__ */ jsx(Button, { variant: "outline", pressed: !!isSelected(opt), onClick: () => handleClick(opt), children: opt }, opt)) });
 }
 function SelectMicroInput({
   options,
   value,
   onChange
 }) {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxs(
     "select",
     {
       className: "w-full h-7 px-2 text-xs bg-muted/50 border border-border rounded-lg focus:outline-none focus:ring-1 focus:ring-primary/50 appearance-none",
       style: { fontSize: "16px" },
       value,
-      onChange: (e) => onChange(e.target.value)
-    },
-    /* @__PURE__ */ React.createElement("option", { value: "" }, "Select..."),
-    options.map((opt) => /* @__PURE__ */ React.createElement("option", { key: opt, value: opt }, opt))
+      onChange: (e) => onChange(e.target.value),
+      children: [
+        /* @__PURE__ */ jsx("option", { value: "", children: "Select..." }),
+        options.map((opt) => /* @__PURE__ */ jsx("option", { value: opt, children: opt }, opt))
+      ]
+    }
   );
 }
 function NumberMicroInput({
@@ -223,7 +233,11 @@ function NumberMicroInput({
     setLocalValue(clamped);
     onChange(clamped);
   };
-  return /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-1" }, /* @__PURE__ */ React.createElement(Button, { variant: "outline", icon: /* @__PURE__ */ React.createElement(Minus, null), "aria-label": "Decrease", onClick: decrement }), /* @__PURE__ */ React.createElement("span", { className: "w-10 text-center text-xs font-medium tabular-nums" }, localValue), /* @__PURE__ */ React.createElement(Button, { variant: "outline", icon: /* @__PURE__ */ React.createElement(Plus, null), "aria-label": "Increase", onClick: increment }));
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+    /* @__PURE__ */ jsx(Button, { variant: "outline", icon: /* @__PURE__ */ jsx(Minus, {}), "aria-label": "Decrease", onClick: decrement }),
+    /* @__PURE__ */ jsx("span", { className: "w-10 text-center text-xs font-medium tabular-nums", children: localValue }),
+    /* @__PURE__ */ jsx(Button, { variant: "outline", icon: /* @__PURE__ */ jsx(Plus, {}), "aria-label": "Increase", onClick: increment })
+  ] });
 }
 function AgentVariableCards({
   conversationId,
@@ -244,21 +258,24 @@ function AgentVariableCards({
   }
   const fire = onSubmit ?? (() => {
   });
-  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-2 border-b border-border px-2 py-2 max-h-64 overflow-y-auto" }, /* @__PURE__ */ React.createElement(BoundVariableChips, { conversationId }), defs.map((variable) => /* @__PURE__ */ React.createElement(
-    "div",
-    {
-      key: variable.name,
-      className: "flex justify-center sm:justify-start"
-    },
-    /* @__PURE__ */ React.createElement(
-      AgentVariableInputCard,
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 border-b border-border px-2 py-2 max-h-64 overflow-y-auto", children: [
+    /* @__PURE__ */ jsx(BoundVariableChips, { conversationId }),
+    defs.map((variable) => /* @__PURE__ */ jsx(
+      "div",
       {
-        conversationId,
-        variable,
-        onSubmit: fire
-      }
-    )
-  )));
+        className: "flex justify-center sm:justify-start",
+        children: /* @__PURE__ */ jsx(
+          AgentVariableInputCard,
+          {
+            conversationId,
+            variable,
+            onSubmit: fire
+          }
+        )
+      },
+      variable.name
+    ))
+  ] });
 }
 export {
   AgentVariableCards