@xpert-ai/chatkit-ui 0.3.15 → 0.3.17

package/dist/index.cjs

@@ -793,7 +793,7 @@ function ParentMessengerProvider({
           ...runtimeCapabilities ? { runtimeCapabilities } : {}
         };
         const stream = streamRef2.current;
-        const activeFollowUpMode = stream?.isLoading ? params.followUpMode && params.followUpMode !== "default" ? params.followUpMode : stream.followUpBehavior ?? "queue" : void 0;
+        const activeFollowUpMode = stream?.isLoading ? params.followUpMode && params.followUpMode !== "default" ? params.followUpMode : "queue" : void 0;
         const requestOptions = buildInjectedRequestOptions({
           defaults: latestOptionsRef.current?.request,
           state: params.state,
@@ -1192,14 +1192,14 @@ async function executeThreadGoalCommand({
 }
 
 // src/lib/follow-ups.ts
-function getComposerFollowUpShortcutLabels(queueShortcutLabel) {
-  return {
-    steer: "Enter",
-    queue: queueShortcutLabel
-  };
+function getVisiblePendingFollowUpPriority(item) {
+  return item.mode === "steer" || item.queuedFromSteer ? 0 : 1;
 }
-function getBusyComposerShortcutFollowUpMode(useQueueShortcut) {
-  return useQueueShortcut ? "queue" : "steer";
+function sortVisiblePendingFollowUps(items) {
+  return [...items].sort((left, right) => {
+    const priority = getVisiblePendingFollowUpPriority(left) - getVisiblePendingFollowUpPriority(right);
+    return priority || left.createdAt - right.createdAt;
+  });
 }
 
 // src/lib/todos.ts
@@ -1425,20 +1425,13 @@ var en_US_default = {
     },
     poweredBy: "Powered by Xpert AI",
     followUps: {
-      label: "Follow-up behavior",
-      settings: "Settings",
-      idleHint: "Used when you send while a run is active.",
-      activeHint: "This message will use the selected busy-run behavior.",
       pending: "Pending follow-ups",
       queue: "Queue",
-      steer: "Steer",
       steerAction: "Steer",
-      promoteToSteer: "Steer now",
       sendNow: "Send now",
       remove: "Remove pending follow-up",
       more: "More actions",
       edit: "Edit message",
-      turnOffQueueing: "Turn off queueing",
       queueHint: "Starts after the current run finishes",
       manualQueueHint: "Ready to send as a new run",
       steerHint: "Injects after the current tool call"
@@ -1821,20 +1814,13 @@ var zh_CN_default = {
     },
     poweredBy: "\u7531 Xpert AI \u9A71\u52A8",
     followUps: {
-      label: "Follow-up \u6A21\u5F0F",
-      settings: "\u8BBE\u7F6E",
-      idleHint: "\u4EC5\u5728\u8FD0\u884C\u4E2D\u53D1\u9001\u6D88\u606F\u65F6\u751F\u6548\u3002",
-      activeHint: "\u5F53\u524D\u6D88\u606F\u4F1A\u6309\u6240\u9009\u7684\u8FD0\u884C\u4E2D\u884C\u4E3A\u5904\u7406\u3002",
       pending: "\u5F85\u5904\u7406 Follow-up",
       queue: "\u6392\u961F",
-      steer: "\u5F15\u5BFC",
       steerAction: "\u5F15\u5BFC",
-      promoteToSteer: "\u8F6C\u4E3A\u5F15\u5BFC",
       sendNow: "\u7ACB\u5373\u53D1\u9001",
       remove: "\u79FB\u9664\u6B64\u5F85\u5904\u7406 Follow-up",
       more: "\u66F4\u591A\u64CD\u4F5C",
       edit: "\u7F16\u8F91\u6D88\u606F",
-      turnOffQueueing: "\u5173\u95ED\u6392\u961F",
       queueHint: "\u5F53\u524D\u8FD0\u884C\u7ED3\u675F\u540E\u5F00\u542F\u4E0B\u4E00\u8F6E",
       manualQueueHint: "\u4FDD\u7559\u4E3A\u5F85\u53D1\u9001\uFF0C\u53EF\u624B\u52A8\u5F00\u542F\u65B0\u4E00\u8F6E",
       steerHint: "\u5F53\u524D\u5DE5\u5177\u8C03\u7528\u5B8C\u6210\u540E\u6CE8\u5165"
@@ -4173,8 +4159,6 @@ function useRoundedClasses() {
 function PendingFollowUps({
   items,
   isLoading,
-  followUpBehavior,
-  onBehaviorChange,
   onPromoteToSteer,
   canSendNow,
   onSendNow,
@@ -4186,16 +4170,12 @@ function PendingFollowUps({
   const { t } = useChatkitTranslation();
   const rounded = useRoundedClasses();
   const referencedContentFallback = t("chat.referencedContentOnly");
-  const [isSettingsOpen, setIsSettingsOpen] = React15.useState(false);
   const [openMenuId, setOpenMenuId] = React15.useState(null);
   React15.useEffect(() => {
-    if (items.length === 0 && isSettingsOpen) {
-      setIsSettingsOpen(false);
-    }
     if (items.every((item) => item.id !== openMenuId)) {
       setOpenMenuId(null);
     }
-  }, [isSettingsOpen, items, openMenuId]);
+  }, [items, openMenuId]);
   if (items.length === 0) {
     return null;
   }
@@ -4209,75 +4189,7 @@ function PendingFollowUps({
         className
       ),
       children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "space-y-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "text-xs font-medium text-foreground", children: t("chat.followUps.pending") }),
-          /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(Tooltip, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
-              "button",
-              {
-                type: "button",
-                onClick: () => setIsSettingsOpen((prev) => !prev),
-                className: cn(
-                  "inline-flex h-6 w-6 items-center justify-center transition-colors",
-                  isSettingsOpen ? "bg-muted text-foreground" : "text-muted-foreground hover:bg-muted/60 hover:text-foreground",
-                  rounded.control
-                ),
-                "aria-label": t("chat.followUps.settings"),
-                "aria-expanded": isSettingsOpen,
-                "aria-controls": "follow-ups-settings-panel",
-                children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react8.SlidersHorizontal, { className: "h-3.5 w-3.5" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "sr-only", children: t("chat.followUps.settings") })
-                ]
-              }
-            ) }),
-            /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TooltipContent, { side: "top", children: t("chat.followUps.settings") })
-          ] })
-        ] }),
-        isSettingsOpen && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
-          "div",
-          {
-            id: "follow-ups-settings-panel",
-            className: cn(
-              "border border-border/70 bg-muted/20 px-3 py-2",
-              rounded.panel
-            ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "min-w-0", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "text-xs font-medium text-foreground", children: t("chat.followUps.label") }),
-                /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "text-[11px] text-muted-foreground", children: isLoading ? t("chat.followUps.activeHint") : t("chat.followUps.idleHint") })
-              ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
-                "div",
-                {
-                  className: cn(
-                    "inline-flex shrink-0 border border-border bg-background p-1",
-                    rounded.control
-                  ),
-                  children: ["queue", "steer"].map((behavior) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(Tooltip, { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
-                      "button",
-                      {
-                        type: "button",
-                        onClick: () => {
-                          onBehaviorChange(behavior);
-                          setIsSettingsOpen(false);
-                        },
-                        className: cn(
-                          "px-3 py-1 text-xs font-medium transition-colors",
-                          rounded.control,
-                          followUpBehavior === behavior ? "bg-primary text-background" : "text-muted-foreground hover:text-foreground"
-                        ),
-                        children: behavior === "queue" ? t("chat.followUps.queue") : t("chat.followUps.steer")
-                      }
-                    ) }),
-                    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(TooltipContent, { side: "top", children: behavior === "queue" ? t("chat.followUps.queueHint") : t("chat.followUps.steerHint") })
-                  ] }, behavior))
-                }
-              )
-            ] })
-          }
-        ),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex items-center justify-between gap-3", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "text-xs font-medium text-foreground", children: t("chat.followUps.pending") }) }),
         items.map((item) => {
           const canSendItemNow = item.mode === "queue" && canSendNow(item.id);
           return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
@@ -4306,7 +4218,7 @@ function PendingFollowUps({
                       }
                     ) }),
                     /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex shrink-0 items-center gap-1", children: [
-                      item.mode === "queue" && isLoading && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                      item.mode === "queue" && isLoading && !item.queuedFromSteer && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
                         "button",
                         {
                           type: "button",
@@ -4376,44 +4288,24 @@ function PendingFollowUps({
                                   "w-52 border-border/70 bg-background p-1.5",
                                   rounded.panel
                                 ),
-                                children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex flex-col gap-1", children: [
-                                  /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
-                                    "button",
-                                    {
-                                      type: "button",
-                                      onClick: () => {
-                                        setOpenMenuId(null);
-                                        onEdit(item.id);
-                                      },
-                                      className: cn(
-                                        "flex items-center gap-2 px-2 py-1.5 text-left text-sm text-foreground transition-colors hover:bg-muted",
-                                        rounded.control
-                                      ),
-                                      children: [
-                                        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react8.PencilLine, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }),
-                                        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { children: t("chat.followUps.edit") })
-                                      ]
-                                    }
-                                  ),
-                                  /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
-                                    "button",
-                                    {
-                                      type: "button",
-                                      onClick: () => {
-                                        setOpenMenuId(null);
-                                        onBehaviorChange("steer");
-                                      },
-                                      className: cn(
-                                        "flex items-center gap-2 px-2 py-1.5 text-left text-sm text-foreground transition-colors hover:bg-muted",
-                                        rounded.control
-                                      ),
-                                      children: [
-                                        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react8.CornerDownLeft, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }),
-                                        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { children: t("chat.followUps.turnOffQueueing") })
-                                      ]
-                                    }
-                                  )
-                                ] })
+                                children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex flex-col gap-1", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+                                  "button",
+                                  {
+                                    type: "button",
+                                    onClick: () => {
+                                      setOpenMenuId(null);
+                                      onEdit(item.id);
+                                    },
+                                    className: cn(
+                                      "flex items-center gap-2 px-2 py-1.5 text-left text-sm text-foreground transition-colors hover:bg-muted",
+                                      rounded.control
+                                    ),
+                                    children: [
+                                      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react8.PencilLine, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }),
+                                      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { children: t("chat.followUps.edit") })
+                                    ]
+                                  }
+                                ) })
                               }
                             )
                           ]
@@ -6889,6 +6781,59 @@ function usePetAutoState({
 // src/components/chat/useSlashCommands.ts
 var React25 = __toESM(require("react"), 1);
 
+// src/lib/slash-commands/availability.ts
+function getActionRuntimeCapabilities(action) {
+  return "runtimeCapabilities" in action && isRuntimeCapabilitiesSelection(action.runtimeCapabilities) ? action.runtimeCapabilities : null;
+}
+function getSelectableRequiredIds(requiredIds, selectableIds) {
+  const selectable = new Set(selectableIds);
+  return requiredIds.filter((id) => selectable.has(id));
+}
+function hasSelectedRequiredIds(requiredIds, selectedIds) {
+  if (!requiredIds.length) {
+    return true;
+  }
+  const selected = new Set(selectedIds ?? []);
+  return requiredIds.every((id) => selected.has(id));
+}
+function isSlashCommandRuntimeSelectionSatisfied(command, runtimeCapabilities, selectedRuntimeCapabilities) {
+  const required = getActionRuntimeCapabilities(command.action);
+  if (!required) {
+    return true;
+  }
+  const requiredSkillIds = getSelectableRequiredIds(
+    required.skills.ids,
+    runtimeCapabilities?.skills.map((skill) => skill.id) ?? []
+  );
+  const requiredPluginNodeKeys = getSelectableRequiredIds(
+    required.plugins.nodeKeys,
+    runtimeCapabilities?.plugins.map((plugin) => plugin.nodeKey) ?? []
+  );
+  const requiredSubAgentNodeKeys = getSelectableRequiredIds(
+    required.subAgents?.nodeKeys ?? [],
+    runtimeCapabilities?.subAgents?.map((subAgent) => subAgent.nodeKey) ?? []
+  );
+  return hasSelectedRequiredIds(
+    requiredSkillIds,
+    selectedRuntimeCapabilities?.skills.ids
+  ) && hasSelectedRequiredIds(
+    requiredPluginNodeKeys,
+    selectedRuntimeCapabilities?.plugins.nodeKeys
+  ) && hasSelectedRequiredIds(
+    requiredSubAgentNodeKeys,
+    selectedRuntimeCapabilities?.subAgents?.nodeKeys
+  );
+}
+function hasSelectedRuntimeSlashCommand(runtimeCapabilities, selectedRuntimeCapabilities, commandName) {
+  return runtimeCapabilities?.commands?.some(
+    (command) => command.name === commandName && isSlashCommandRuntimeSelectionSatisfied(
+      command,
+      runtimeCapabilities,
+      selectedRuntimeCapabilities
+    )
+  ) ?? false;
+}
+
 // src/lib/slash-commands/builtins.ts
 var BUILTIN_SLASH_COMMANDS = [
   {
@@ -6984,9 +6929,6 @@ function renderSlashCommandTemplate(template, args, options) {
   const rendered = template.replace(/\{\{\s*args\s*\}\}/g, args);
   return options?.trim === false ? rendered : rendered.trim();
 }
-function getActionRuntimeCapabilities(action) {
-  return "runtimeCapabilities" in action && isRuntimeCapabilitiesSelection(action.runtimeCapabilities) ? action.runtimeCapabilities : null;
-}
 function parseSlashCommandInvocation(value) {
   const match = /^\s*\/([a-z0-9][a-z0-9_-]{0,63})(?:\s+([\s\S]*))?$/.exec(
     value
@@ -7149,8 +7091,18 @@ function matchesQuery(values, query) {
   }
   return values.filter(Boolean).some((value) => value?.toLowerCase().includes(query));
 }
-function isCommandAvailable(command) {
-  return command.availability?.disabled !== true;
+function isCommandAvailable(command, runtimeCapabilities, selectedRuntimeCapabilities) {
+  if (command.availability?.disabled === true) {
+    return false;
+  }
+  if (command.action.type !== "client_action") {
+    return true;
+  }
+  return isSlashCommandRuntimeSelectionSatisfied(
+    command,
+    runtimeCapabilities,
+    selectedRuntimeCapabilities
+  );
 }
 function resolveCommandText(value, language, fallback) {
   return (0, import_chatkit_types6.resolveLocalizedText)(value, language ?? void 0) ?? fallback;
@@ -7231,7 +7183,9 @@ function createSlashPaletteOptions({
   });
   if (palette.atMessageStart && !capabilityTypesOnly) {
     const options = [];
-    for (const command of resolvedCommands.filter(isCommandAvailable)) {
+    for (const command of resolvedCommands.filter(
+      (item) => isCommandAvailable(item, runtimeCapabilities, selection)
+    )) {
       const capabilityType = CAPABILITY_GROUP_COMMANDS[command.name];
       if (!capabilityType) {
         if (matchesCommand(command, query, language)) {
@@ -14030,9 +13984,6 @@ var defaultApiUrl2 = import_meta2.env.VITE_XPERTAI_API_URL;
 var COMPOSER_INPUT_MAX_HEIGHT = 128;
 var LONG_TEXT_REFERENCE_THRESHOLD = 5e3;
 var GOAL_RUN_INPUT = "Continue working toward the active goal.";
-function hasRuntimeGoalCommand(runtimeCapabilities) {
-  return runtimeCapabilities?.commands?.some((command) => command.name === "goal") ?? false;
-}
 function isGoalAdapter(value) {
   return Boolean(value) && typeof value === "object" && typeof value.getGoal === "function" && typeof value.setGoal === "function" && typeof value.updateGoal === "function" && typeof value.clearGoal === "function";
 }
@@ -14451,9 +14402,7 @@ function Chat({
     isStacked: isComposerStacked
   });
   const pendingFollowUps = React48.useMemo(
-    () => [...stream.pendingFollowUps ?? []].sort(
-      (a, b) => a.createdAt - b.createdAt
-    ),
+    () => sortVisiblePendingFollowUps(stream.pendingFollowUps ?? []),
     [stream.pendingFollowUps]
   );
   const hasPendingFollowUps = pendingFollowUps.length > 0;
@@ -14465,7 +14414,6 @@ function Chat({
     () => getRuntimeCapabilityOptions(runtimeCapabilities),
     [runtimeCapabilities]
   );
-  const goalCommandAvailable = hasRuntimeGoalCommand(runtimeCapabilities);
   const goalAdapter = React48.useMemo(
     () => {
       if (isGoalAdapter(options?.goal)) {
@@ -14475,7 +14423,6 @@ function Chat({
     },
     [options?.goal, stream.client]
   );
-  const showGoalStatus = goalCommandAvailable && !hasCompletedGoal && (Boolean(goalError) || threadGoal?.status === "active" && stream.isLoading);
   const displayedGoalElapsedSeconds = threadGoal ? (threadGoal.elapsedSeconds ?? 0) + (goalElapsedStartedAt ? Math.max(0, Math.floor((streamingNow - goalElapsedStartedAt) / 1e3)) : 0) : 0;
   const effectiveSessionRuntimeCapabilities = React48.useMemo(
     () => runtimeCapabilitiesReady && runtimeCapabilities ? mergeRuntimeCapabilitiesSelections(
@@ -14484,6 +14431,12 @@ function Chat({
     ) : null,
     [runtimeCapabilities, runtimeCapabilitiesReady, sessionRuntimeCapabilities]
   );
+  const goalCommandAvailable = hasSelectedRuntimeSlashCommand(
+    runtimeCapabilities,
+    effectiveSessionRuntimeCapabilities,
+    "goal"
+  );
+  const showGoalStatus = goalCommandAvailable && !hasCompletedGoal && (Boolean(goalError) || threadGoal?.status === "active" && stream.isLoading);
   const runRuntimeCapabilityOptions = React48.useMemo(
     () => runtimeCapabilityOptions.filter(
       (option) => isRuntimeCapabilitySelected(
@@ -15161,13 +15114,12 @@ function Chat({
     [commitComposerParts]
   );
   const submitDraft = React48.useCallback(
-    (optionsOrFollowUp) => {
+    (submitOptions = {}) => {
       if (isSendDisabled) return;
-      const submitOptions = typeof optionsOrFollowUp === "string" ? { followUpOverride: optionsOrFollowUp } : optionsOrFollowUp ?? {};
       const contentToSubmit = (submitOptions.inputText ?? trimmedDraft).trim();
       const filesToSend = uploadedFiles.length > 0 ? [...uploadedFiles] : void 0;
       const referencesToSend = references.length > 0 ? [...references] : void 0;
-      const nextFollowUpMode = stream.isLoading ? submitOptions.followUpOverride ?? stream.followUpBehavior : void 0;
+      const nextFollowUpMode = stream.isLoading ? "queue" : void 0;
       const effectivePlanMode = submitOptions.planMode ?? planModeEnabled;
       const humanInput = buildHumanMessageInputPayload({
         content: contentToSubmit,
@@ -15726,9 +15678,7 @@ function Chat({
       if (submitGoalModeDraft()) {
         return;
       }
-      submitDraft(
-        getBusyComposerShortcutFollowUpMode(event.metaKey || event.ctrlKey)
-      );
+      submitDraft();
       return;
     }
     if (executeSlashCommandFromDraft()) {
@@ -15838,17 +15788,6 @@ function Chat({
       uploadContextFile
     ]
   );
-  const alternateFollowUpShortcutLabel = React48.useMemo(() => {
-    if (typeof navigator === "undefined") {
-      return "\u2318Enter";
-    }
-    const platform = navigator.platform || navigator.userAgent;
-    return /Mac|iPhone|iPad|iPod/i.test(platform) ? "\u2318Enter" : "Ctrl+Enter";
-  }, []);
-  const followUpShortcutLabels = React48.useMemo(
-    () => getComposerFollowUpShortcutLabels(alternateFollowUpShortcutLabel),
-    [alternateFollowUpShortcutLabel]
-  );
   const handleToolSelect = (tool) => {
     setSelectedTool((prev) => prev?.id === tool.id ? null : tool);
   };
@@ -15859,7 +15798,7 @@ function Chat({
       type: "human",
       content: prompt
     };
-    const nextFollowUpMode = stream.isLoading ? stream.followUpBehavior : void 0;
+    const nextFollowUpMode = stream.isLoading ? "queue" : void 0;
     const inputPayload = {
       input: prompt,
       ...planModeEnabled ? { planMode: true } : {},
@@ -16627,8 +16566,6 @@ function Chat({
             {
               items: pendingFollowUps,
               isLoading: stream.isLoading,
-              followUpBehavior: stream.followUpBehavior,
-              onBehaviorChange: stream.setFollowUpBehavior,
               onPromoteToSteer: (id) => stream.promotePendingFollowUpToSteer(id),
               canSendNow: stream.canSendPendingFollowUpNow,
               onSendNow: (id) => stream.sendPendingFollowUpNow(id),
@@ -16778,13 +16715,9 @@ function Chat({
                           stopLabel: t("chat.stop"),
                           sendLabel: t("chat.send"),
                           shortcuts: stream.isLoading && trimmedDraft ? [
-                            {
-                              label: t("chat.followUps.steer"),
-                              keys: followUpShortcutLabels.steer
-                            },
                             {
                               label: t("chat.followUps.queue"),
-                              keys: followUpShortcutLabels.queue
+                              keys: "Enter"
                             }
                           ] : void 0
                         }