@webless/agent 0.6.5 → 0.6.6

package/dist/{chunk-U2TIUZJM.js → chunk-UR5QZZ2F.js}

@@ -1,5 +1,16 @@
 // src/runtime/tool-ui.ts
 var AGENT_TOOL_UI_SCHEMA_VERSION = "webless.tool-ui.v1";
+var AGENT_STRUCTURED_TOOL_INPUT_SCHEMA_VERSION = "webless.structured-tool-input.v1";
+var AGENT_STRUCTURED_TOOL_INPUT_HEADER = "Webless-Structured-Tool-Input-JSON:";
+function formatAgentStructuredToolInput(surface, values) {
+  const payload = {
+    schemaVersion: AGENT_STRUCTURED_TOOL_INPUT_SCHEMA_VERSION,
+    toolSlug: surface.toolSlug,
+    ...surface.operationId ? { operationId: surface.operationId } : {},
+    values
+  };
+  return `${AGENT_STRUCTURED_TOOL_INPUT_HEADER} ${JSON.stringify(payload)}`;
+}
 function isRecord(value) {
   return value !== null && typeof value === "object" && !Array.isArray(value);
 }
@@ -394,21 +405,46 @@ function looksLikeBookingCopy(text) {
     text
   );
 }
-function inferComposerForm(text) {
-  const cleaned = text.trim();
-  if (!cleaned || looksLikeBookingCopy(cleaned) || !looksLikeFieldCollection(cleaned)) {
-    return null;
-  }
-  const fields = FIELD_LIBRARY.flatMap((field) => {
-    if (field.exclude?.test(cleaned)) {
-      const leftover = cleaned.replace(field.exclude, " ");
+function echoedLabeledFieldIds(text) {
+  const ids = /* @__PURE__ */ new Set();
+  if (/\bname\s*:\s+\S+/i.test(text)) ids.add("name");
+  if (/\be-?mail\s*:\s+\S+/i.test(text)) ids.add("email");
+  if (/\bphone\s*:\s+\S+/i.test(text)) ids.add("phone");
+  if (/\bcompany\s*:\s+\S+/i.test(text)) ids.add("company");
+  return ids;
+}
+function matchLibraryFields(text) {
+  return FIELD_LIBRARY.flatMap((field) => {
+    if (field.exclude?.test(text)) {
+      const leftover = text.replace(field.exclude, " ");
       if (!field.patterns.some((pattern) => pattern.test(leftover))) return [];
-    } else if (!field.patterns.some((pattern) => pattern.test(cleaned))) {
+    } else if (!field.patterns.some((pattern) => pattern.test(text))) {
       return [];
     }
     const { patterns: _patterns, exclude: _exclude, ...next } = field;
     return [next];
   }).slice(0, MAX_FORM_FIELDS);
+}
+function looksLikeCompletedActionRecap(text) {
+  const confirmingCreate = /\bshould i create this\b/i.test(text);
+  const echoingFilledFields = /\b(?:name|email|phone|company)\s*:\s+\S+/i.test(text) && /[^\s@]+@[^\s@]+\.[^\s@]+/i.test(text);
+  if (echoingFilledFields) {
+    if (looksLikeFieldCollection(text)) {
+      const echoed = echoedLabeledFieldIds(text);
+      if (matchLibraryFields(text).some((field) => !echoed.has(field.id))) {
+        return false;
+      }
+    }
+    return true;
+  }
+  return confirmingCreate && !looksLikeFieldCollection(text);
+}
+function inferComposerForm(text) {
+  const cleaned = text.trim();
+  if (!cleaned || looksLikeBookingCopy(cleaned) || looksLikeCompletedActionRecap(cleaned) || !looksLikeFieldCollection(cleaned)) {
+    return null;
+  }
+  const fields = matchLibraryFields(cleaned);
   if (fields.length < MIN_FORM_FIELDS) return null;
   return {
     id: `inferred:${fields.map((field) => field.id).join("+")}`,
@@ -416,7 +452,9 @@ function inferComposerForm(text) {
   };
 }
 function resolveComposerForm(input) {
-  if (input.enabled === false || input.hasBookingOffer) return null;
+  if (input.enabled === false || input.hasBookingOffer || input.hasPendingConfirmation) {
+    return null;
+  }
   const text = input.agentText.trim();
   if (!text) return null;
   const card = input.cards?.find((item) => item.type === "visitor_form");
@@ -441,7 +479,7 @@ function preferBookingOffer(current, next) {
   return next;
 }
 function looksLikeBookingReady(text) {
-  return /demo option|options are ready|pick a (date|time)|available (times|slots)|book(ing)? (card|the demo)|schedule/i.test(
+  return /demo option|options are ready|pick a (date|time)|available (times|slots)|book(ing)? (card|the demo)|\bschedule\b/i.test(
     text
   );
 }
@@ -933,7 +971,8 @@ function presentVisitorToolResult(result, registry = []) {
       id: result.callId,
       toolName: result.toolName,
       status: result.status,
-      kind: "hidden"
+      kind: "input",
+      surface: envelope.ui
     };
   }
   if (!proposed) {
@@ -1818,11 +1857,11 @@ function createAgentClient(options) {
 
 // src/runtime/errors.ts
 import { ClientError as ClientError3 } from "eve/client";
-var TRANSIENT_AGENT_ERROR_MESSAGE = "I couldn\u2019t finish that answer. Please try again.";
+var TRANSIENT_AGENT_ERROR_MESSAGE = "The agent run stopped before the action finished. Please try again.";
 var PREVIEW_AUTHORIZATION_ERROR_MESSAGE = "This preview could not be authorized. Open the latest preview from Webless.";
 function isTransientRuntimeMessage(message) {
   const normalized = message.trim().toLowerCase();
-  return normalized.includes("empty response from runtime") || normalized.includes("failed to fetch") || normalized.includes("networkerror") || normalized.includes("load failed");
+  return normalized.includes("empty response from runtime") || normalized.includes("failed to fetch") || normalized.includes("networkerror") || normalized.includes("network error") || normalized.includes("load failed") || normalized.includes("the stream");
 }
 function isPreviewAuthorizationMessage(message) {
   const normalized = message.trim().toLowerCase();
@@ -2124,6 +2163,7 @@ function clearPendingWidgetBooking(storageKeyPrefix, visitorSessionId) {
 
 // src/react/lib/visitor-input.ts
 function shouldRenderVisitorInputCard(request) {
+  if (request.ui) return true;
   if (request.kind === "tool-approval" || request.kind === "session-limit") {
     return true;
   }
@@ -2457,7 +2497,6 @@ function useAgentChat({
             }
             if (!isActiveRun()) return;
             if (presentation.kind === "hidden") return;
-            if (presentation.kind === "input") return;
             setState((prev) => ({
               ...prev,
               toolResults: [
@@ -2735,14 +2774,13 @@ ${outgoing}` : outgoing;
   }, [runTurn, state.messages]);
   const respondToToolInput = useCallback(
     async (surface, values) => {
-      const details = JSON.stringify(values);
-      await submit(`${surface.title} details provided`, {
+      await submit(`${surface.title} submitted`, {
         runtimeText: [
-          `Structured input provided for ${surface.toolSlug}.`,
-          surface.operationId ? `Operation: ${surface.operationId}.` : "",
-          `Use these exact values and retry the action: ${details}`,
+          formatAgentStructuredToolInput(surface, values),
+          "Use these exact structured values to retry the requested action.",
+          "Reuse the operationId from the structured payload.",
           "Do not invent or alter any values."
-        ].filter(Boolean).join("\n")
+        ].join("\n")
       });
     },
     [submit]
@@ -2891,6 +2929,7 @@ var defaultAgentRailTheme = {
   border: "rgb(42 51 70 / 0.1)",
   visitorBubble: "#f3edff",
   visitorText: "#171b2a",
+  onBrand: "#ffffff",
   success: "#18794e",
   danger: "#c94b63",
   fontBody: '"Mulish", "Avenir Next", "Segoe UI", sans-serif',
@@ -2909,12 +2948,13 @@ var defaultDarkAgentRailTheme = {
   border: "rgb(226 232 240 / 0.16)",
   visitorBubble: "#2b2140",
   visitorText: "#f5f7fb",
+  onBrand: "#171b2a",
   success: "#55cf91",
   danger: "#ff8da1"
 };
 
 // src/react/components/AgentRail/AgentRail.tsx
-import { useEffect as useEffect3, useRef as useRef3, useState as useState7 } from "react";
+import { useEffect as useEffect3, useRef as useRef3, useState as useState8 } from "react";
 
 // src/react/hooks/useAgentColorScheme.ts
 import { useSyncExternalStore } from "react";
@@ -3358,6 +3398,9 @@ function calendarCells(year, month) {
   while (cells.length < 42) cells.push(null);
   return cells;
 }
+function BookingCardLoader() {
+  return /* @__PURE__ */ jsx4("section", { className: "booking-card", "aria-label": "Book a meeting", children: /* @__PURE__ */ jsx4("p", { className: "booking-card__loading", role: "status", children: "Finding available times\u2026" }) });
+}
 function BookingCard({
   offer,
   onBook
@@ -3777,7 +3820,7 @@ function MessageBubble({
 }
 
 // src/react/components/HumanInputCard/HumanInputCard.tsx
-import { useState as useState6 } from "react";
+import { useState as useState7 } from "react";
 
 // src/react/components/ConfirmationCard/ConfirmationCard.tsx
 import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
@@ -3818,18 +3861,450 @@ function ConfirmationCard({
   );
 }
 
-// src/react/components/HumanInputCard/HumanInputCard.tsx
+// src/react/components/ToolInputCard/ToolInputCard.tsx
+import { useState as useState6 } from "react";
 import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+function isRecord4(value) {
+  return value !== null && typeof value === "object" && !Array.isArray(value);
+}
+function pathSegments(path) {
+  return path.replace(/\[(\d+)\]/gu, ".$1").split(".").filter(Boolean);
+}
+function valueAtPath(root, path) {
+  let current = root;
+  for (const segment of pathSegments(path)) {
+    if (Array.isArray(current)) {
+      const index = Number(segment);
+      current = Number.isInteger(index) ? current[index] : void 0;
+      continue;
+    }
+    current = isRecord4(current) ? current[segment] : void 0;
+  }
+  return current;
+}
+function initialFieldValue(field, surface) {
+  const supplied = valueAtPath(surface.values, field.path);
+  if (supplied !== void 0) return supplied;
+  if (field.defaultValue !== void 0) return field.defaultValue;
+  if (field.kind === "checkbox" || field.kind === "confirmation") return false;
+  if (field.kind === "multi-select") return [];
+  if (field.kind === "range") return field.min ?? 0;
+  return "";
+}
+function initialValues(surface) {
+  return Object.fromEntries(
+    surface.fields.map((field) => [
+      field.path,
+      initialFieldValue(field, surface)
+    ])
+  );
+}
+function cloneJsonValue(value) {
+  if (Array.isArray(value)) return value.map(cloneJsonValue);
+  if (isRecord4(value)) {
+    return Object.fromEntries(
+      Object.entries(value).map(([key, item]) => [key, cloneJsonValue(item)])
+    );
+  }
+  return value;
+}
+function assignPath(target, path, value) {
+  const segments = pathSegments(path);
+  let current = target;
+  segments.forEach((segment, index) => {
+    if (index === segments.length - 1) {
+      current[segment] = value;
+      return;
+    }
+    const existing = current[segment];
+    if (!isRecord4(existing)) current[segment] = {};
+    current = current[segment];
+  });
+}
+function isJsonValue3(value, seen = /* @__PURE__ */ new Set()) {
+  if (value === null || typeof value === "string" || typeof value === "boolean") {
+    return true;
+  }
+  if (typeof value === "number") return Number.isFinite(value);
+  if (typeof value !== "object" || seen.has(value)) return false;
+  seen.add(value);
+  const valid = Array.isArray(value) ? value.every((item) => isJsonValue3(item, seen)) : Object.values(value).every((item) => isJsonValue3(item, seen));
+  seen.delete(value);
+  return valid;
+}
+function parsedFieldValue(field, value) {
+  if (field.kind !== "json" || typeof value !== "string") return value;
+  try {
+    const parsed = JSON.parse(value);
+    return isJsonValue3(parsed) ? parsed : void 0;
+  } catch {
+    return void 0;
+  }
+}
+function isEmpty(value) {
+  if (typeof value === "string") return value.trim().length === 0;
+  if (Array.isArray(value)) return value.length === 0;
+  return value === null || value === false;
+}
+function validateField(field, value) {
+  if (field.required && isEmpty(value))
+    return `Enter ${field.label.toLowerCase()}.`;
+  if (typeof value === "string" && value.trim().length === 0) return "";
+  if (field.kind === "email" && (typeof value !== "string" || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/u.test(value))) {
+    return "Enter a valid email address.";
+  }
+  if (typeof value === "string") {
+    if (field.minLength !== void 0 && value.length < field.minLength) {
+      return `Use at least ${field.minLength} characters.`;
+    }
+    if (field.maxLength !== void 0 && value.length > field.maxLength) {
+      return `Use no more than ${field.maxLength} characters.`;
+    }
+  }
+  if (typeof value === "number") {
+    if (field.min !== void 0 && value < field.min) {
+      return `Choose ${field.min} or higher.`;
+    }
+    if (field.max !== void 0 && value > field.max) {
+      return `Choose ${field.max} or lower.`;
+    }
+  }
+  if (field.maxItems !== void 0 && Array.isArray(value) && value.length > field.maxItems) {
+    return `Choose no more than ${field.maxItems}.`;
+  }
+  if (field.kind === "json" && parsedFieldValue(field, value) === void 0) {
+    return "Enter valid JSON.";
+  }
+  return "";
+}
+function optionKey(option) {
+  return JSON.stringify(option.value);
+}
+function valuesMatch(left, right) {
+  return JSON.stringify(left) === JSON.stringify(right);
+}
+function FieldDescription({
+  field,
+  id
+}) {
+  return field.description ? /* @__PURE__ */ jsx7("span", { id, className: "tool-input-card__description", children: field.description }) : null;
+}
+function ChoiceField({
+  field,
+  id,
+  value,
+  disabled,
+  describedBy,
+  error,
+  onBlur,
+  onChange
+}) {
+  const options = field.options ?? [];
+  const multiple = field.kind === "multi-select";
+  const selected = Array.isArray(value) ? value : [];
+  if (field.kind === "select") {
+    const selectedIndex = options.findIndex(
+      (option) => valuesMatch(option.value, value)
+    );
+    return /* @__PURE__ */ jsxs7(
+      "select",
+      {
+        id,
+        value: selectedIndex >= 0 ? String(selectedIndex) : "",
+        disabled,
+        required: field.required,
+        "aria-describedby": describedBy,
+        "aria-invalid": Boolean(error),
+        onBlur,
+        onChange: (event) => {
+          const option = options[Number(event.target.value)];
+          if (option) onChange(option.value);
+        },
+        children: [
+          /* @__PURE__ */ jsx7("option", { value: "", disabled: field.required, children: "Choose an option" }),
+          options.map((option, index) => /* @__PURE__ */ jsx7("option", { value: index, children: option.label }, optionKey(option)))
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx7(
+    "div",
+    {
+      className: "tool-input-card__choices",
+      role: multiple ? "group" : "radiogroup",
+      "aria-labelledby": `${id}-label`,
+      "aria-describedby": describedBy,
+      "aria-invalid": Boolean(error),
+      "aria-required": field.required,
+      children: options.map((option, index) => {
+        const checked = multiple ? selected.some((item) => valuesMatch(item, option.value)) : valuesMatch(value, option.value);
+        return /* @__PURE__ */ jsxs7("label", { className: "tool-input-card__choice", children: [
+          /* @__PURE__ */ jsx7(
+            "input",
+            {
+              type: multiple ? "checkbox" : "radio",
+              name: id,
+              value: String(index),
+              checked,
+              disabled,
+              onBlur,
+              onChange: () => {
+                if (!multiple) {
+                  onChange(option.value);
+                  return;
+                }
+                onChange(
+                  checked ? selected.filter(
+                    (item) => !valuesMatch(item, option.value)
+                  ) : [...selected, option.value]
+                );
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx7("span", { children: option.label })
+        ] }, optionKey(option));
+      })
+    }
+  );
+}
+function ToolField({
+  disabled,
+  error,
+  field,
+  id,
+  value,
+  onBlur,
+  onChange
+}) {
+  const describedBy = [
+    field.description ? `${id}-description` : "",
+    error ? `${id}-error` : ""
+  ].filter(Boolean).join(" ");
+  if (field.kind === "checkbox" || field.kind === "confirmation") {
+    return /* @__PURE__ */ jsxs7("div", { className: "tool-input-card__field", children: [
+      /* @__PURE__ */ jsxs7("label", { className: "tool-input-card__check", htmlFor: id, children: [
+        /* @__PURE__ */ jsx7(
+          "input",
+          {
+            id,
+            type: "checkbox",
+            checked: value === true,
+            disabled,
+            "aria-describedby": describedBy || void 0,
+            "aria-invalid": Boolean(error),
+            onBlur,
+            onChange: (event) => onChange(event.target.checked)
+          }
+        ),
+        /* @__PURE__ */ jsxs7("span", { children: [
+          /* @__PURE__ */ jsx7("strong", { children: field.label }),
+          field.description ? /* @__PURE__ */ jsx7("span", { id: `${id}-description`, children: field.description }) : null
+        ] })
+      ] }),
+      error ? /* @__PURE__ */ jsx7("span", { id: `${id}-error`, className: "tool-input-card__error", children: error }) : null
+    ] });
+  }
+  const label = /* @__PURE__ */ jsxs7("label", { id: `${id}-label`, htmlFor: id, children: [
+    field.label,
+    field.required ? /* @__PURE__ */ jsx7("span", { "aria-hidden": "true", children: " *" }) : null
+  ] });
+  const common = {
+    id,
+    disabled,
+    required: field.required,
+    "aria-describedby": describedBy || void 0,
+    "aria-invalid": Boolean(error),
+    onBlur
+  };
+  let control;
+  if (field.kind === "select" || field.kind === "radio" || field.kind === "multi-select") {
+    control = /* @__PURE__ */ jsx7(
+      ChoiceField,
+      {
+        field,
+        id,
+        value,
+        disabled,
+        describedBy: describedBy || void 0,
+        error,
+        onBlur,
+        onChange
+      }
+    );
+  } else if (field.kind === "textarea" || field.kind === "json") {
+    control = /* @__PURE__ */ jsx7(
+      "textarea",
+      {
+        ...common,
+        rows: field.kind === "json" ? 4 : 3,
+        maxLength: field.maxLength,
+        minLength: field.minLength,
+        placeholder: field.placeholder,
+        value: typeof value === "string" ? value : JSON.stringify(value),
+        onChange: (event) => onChange(event.target.value)
+      }
+    );
+  } else if (field.kind === "range") {
+    const numericValue = typeof value === "number" ? value : field.min ?? 0;
+    control = /* @__PURE__ */ jsxs7("div", { className: "tool-input-card__range", children: [
+      /* @__PURE__ */ jsx7(
+        "input",
+        {
+          ...common,
+          type: "range",
+          min: field.min,
+          max: field.max,
+          step: field.step,
+          value: numericValue,
+          onChange: (event) => onChange(Number(event.target.value))
+        }
+      ),
+      /* @__PURE__ */ jsx7("output", { htmlFor: id, children: numericValue })
+    ] });
+  } else {
+    const type = field.kind === "date-time" ? "datetime-local" : field.kind === "calendar" ? "date" : field.kind;
+    control = /* @__PURE__ */ jsx7(
+      "input",
+      {
+        ...common,
+        type,
+        min: field.min,
+        max: field.max,
+        step: field.step,
+        minLength: field.minLength,
+        maxLength: field.maxLength,
+        placeholder: field.placeholder,
+        value: typeof value === "number" || typeof value === "string" ? value : "",
+        onChange: (event) => onChange(
+          field.kind === "number" && event.target.value !== "" ? Number(event.target.value) : event.target.value
+        )
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs7("div", { className: "tool-input-card__field", children: [
+    label,
+    /* @__PURE__ */ jsx7(FieldDescription, { field, id: `${id}-description` }),
+    control,
+    error ? /* @__PURE__ */ jsx7("span", { id: `${id}-error`, className: "tool-input-card__error", children: error }) : null
+  ] });
+}
+function ToolInputCard({
+  disabled = false,
+  surface,
+  onSubmit
+}) {
+  const [values, setValues] = useState6(
+    () => initialValues(surface)
+  );
+  const [touched, setTouched] = useState6(() => /* @__PURE__ */ new Set());
+  const [submitted, setSubmitted] = useState6(false);
+  const errors = Object.fromEntries(
+    surface.fields.map((field) => [
+      field.path,
+      touched.has(field.path) ? validateField(field, values[field.path] ?? "") : ""
+    ])
+  );
+  function submit(event) {
+    event.preventDefault();
+    if (disabled || submitted) return;
+    const allTouched = new Set(surface.fields.map((field) => field.path));
+    setTouched(allTouched);
+    const nextErrors = surface.fields.map(
+      (field) => validateField(field, values[field.path] ?? "")
+    );
+    if (nextErrors.some(Boolean)) return;
+    const result = isRecord4(surface.values) ? cloneJsonValue(surface.values) : {};
+    for (const field of surface.fields) {
+      const parsed = parsedFieldValue(field, values[field.path] ?? "");
+      if (parsed !== void 0) assignPath(result, field.path, parsed);
+    }
+    setSubmitted(true);
+    onSubmit?.(surface, result);
+  }
+  if (submitted) {
+    return /* @__PURE__ */ jsxs7(
+      "section",
+      {
+        className: "tool-input-card tool-input-card--submitted",
+        role: "status",
+        children: [
+          /* @__PURE__ */ jsx7("span", { "aria-hidden": "true", children: "\u2713" }),
+          /* @__PURE__ */ jsxs7("strong", { children: [
+            surface.title,
+            " submitted"
+          ] })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs7(
+    "section",
+    {
+      className: "tool-input-card",
+      "aria-labelledby": `tool-input-${surface.id}`,
+      children: [
+        /* @__PURE__ */ jsxs7("div", { className: "tool-input-card__heading", children: [
+          /* @__PURE__ */ jsx7("strong", { id: `tool-input-${surface.id}`, children: surface.title }),
+          surface.description ? /* @__PURE__ */ jsx7("p", { children: surface.description }) : null
+        ] }),
+        /* @__PURE__ */ jsxs7("form", { noValidate: true, onSubmit: submit, children: [
+          /* @__PURE__ */ jsx7("div", { className: "tool-input-card__fields", children: surface.fields.map((field, index) => /* @__PURE__ */ jsx7(
+            ToolField,
+            {
+              disabled,
+              error: errors[field.path] ?? "",
+              field,
+              id: `tool-input-${surface.id}-${index}`,
+              value: values[field.path] ?? "",
+              onBlur: () => setTouched((current) => /* @__PURE__ */ new Set([...current, field.path])),
+              onChange: (value) => setValues((current) => ({ ...current, [field.path]: value }))
+            },
+            field.path
+          )) }),
+          /* @__PURE__ */ jsxs7("div", { className: "tool-input-card__actions", children: [
+            surface.actions?.some((action) => action.id === "reset") ? /* @__PURE__ */ jsx7(
+              "button",
+              {
+                type: "button",
+                className: "tool-input-card__secondary",
+                disabled,
+                onClick: () => {
+                  setValues(initialValues(surface));
+                  setTouched(/* @__PURE__ */ new Set());
+                },
+                children: surface.actions.find((action) => action.id === "reset")?.label ?? "Clear"
+              }
+            ) : null,
+            /* @__PURE__ */ jsx7("button", { type: "submit", disabled, children: surface.submitLabel ?? surface.actions?.find((action) => action.id === "submit")?.label ?? "Continue" })
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/react/components/HumanInputCard/HumanInputCard.tsx
+import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
 function HumanInputCard({
   disabled = false,
   request,
   onRespond
 }) {
-  const [text, setText] = useState6("");
+  const [text, setText] = useState7("");
   const options = request.options ?? [];
   const showText = request.display === "text" || request.allowFreeform && options.length === 0;
+  if (request.ui) {
+    return /* @__PURE__ */ jsx8(
+      ToolInputCard,
+      {
+        disabled,
+        surface: request.ui,
+        onSubmit: (_, value) => onRespond?.({ requestId: request.requestId, value })
+      }
+    );
+  }
   if (options.length > 0) {
-    return /* @__PURE__ */ jsx7(
+    return /* @__PURE__ */ jsx8(
       ConfirmationCard,
       {
         disabled,
@@ -3844,17 +4319,17 @@ function HumanInputCard({
     if (!value || disabled) return;
     onRespond?.({ requestId: request.requestId, text: value });
   }
-  return /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsxs8(
     "section",
     {
       className: "human-input-card",
       "aria-labelledby": `human-input-${request.requestId}`,
       children: [
-        /* @__PURE__ */ jsx7("div", { className: "human-input-card__heading", children: /* @__PURE__ */ jsx7("strong", { id: `human-input-${request.requestId}`, children: request.prompt }) }),
-        showText ? /* @__PURE__ */ jsxs7("form", { onSubmit: submitText, children: [
-          /* @__PURE__ */ jsx7("label", { htmlFor: `human-input-text-${request.requestId}`, children: "Response" }),
-          /* @__PURE__ */ jsxs7("div", { children: [
-            /* @__PURE__ */ jsx7(
+        /* @__PURE__ */ jsx8("div", { className: "human-input-card__heading", children: /* @__PURE__ */ jsx8("strong", { id: `human-input-${request.requestId}`, children: request.prompt }) }),
+        showText ? /* @__PURE__ */ jsxs8("form", { onSubmit: submitText, children: [
+          /* @__PURE__ */ jsx8("label", { htmlFor: `human-input-text-${request.requestId}`, children: "Response" }),
+          /* @__PURE__ */ jsxs8("div", { children: [
+            /* @__PURE__ */ jsx8(
               "input",
               {
                 id: `human-input-text-${request.requestId}`,
@@ -3863,39 +4338,39 @@ function HumanInputCard({
                 onChange: (event) => setText(event.target.value)
               }
             ),
-            /* @__PURE__ */ jsx7("button", { type: "submit", disabled: disabled || !text.trim(), children: "Send" })
+            /* @__PURE__ */ jsx8("button", { type: "submit", disabled: disabled || !text.trim(), children: "Send" })
           ] })
         ] }) : null,
-        !showText && options.length === 0 ? /* @__PURE__ */ jsx7("p", { className: "human-input-card__unavailable", role: "status", children: "This request can\u2019t be answered here." }) : null
+        !showText && options.length === 0 ? /* @__PURE__ */ jsx8("p", { className: "human-input-card__unavailable", role: "status", children: "This request can\u2019t be answered here." }) : null
       ]
     }
   );
 }
 
 // src/react/components/CollectionResultCard/CollectionResultCard.tsx
-import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
 function CollectionResultCard({
   result
 }) {
   const empty = result.items.length === 0;
-  return /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsxs9(
     "section",
     {
       className: `collection-result-card tool-result-card tool-result-card--${result.status}`,
       "aria-label": result.title,
       children: [
-        /* @__PURE__ */ jsxs8("div", { className: "tool-result-card__heading", children: [
-          /* @__PURE__ */ jsx8("span", { className: "tool-result-card__status", "aria-hidden": "true" }),
-          /* @__PURE__ */ jsx8("strong", { children: result.title })
+        /* @__PURE__ */ jsxs9("div", { className: "tool-result-card__heading", children: [
+          /* @__PURE__ */ jsx9("span", { className: "tool-result-card__status", "aria-hidden": "true" }),
+          /* @__PURE__ */ jsx9("strong", { children: result.title })
         ] }),
-        empty ? /* @__PURE__ */ jsx8("p", { className: "collection-result-card__empty", children: "No matching record for the email you shared." }) : /* @__PURE__ */ jsx8("ul", { className: "collection-result-card__list", children: result.items.map((item) => /* @__PURE__ */ jsxs8("li", { children: [
-          /* @__PURE__ */ jsx8("div", { className: "collection-result-card__item-title", children: item.title }),
-          item.description ? /* @__PURE__ */ jsx8("p", { children: item.description }) : null,
-          item.details?.length ? /* @__PURE__ */ jsx8("dl", { children: item.details.map((detail) => /* @__PURE__ */ jsxs8("div", { children: [
-            /* @__PURE__ */ jsx8("dt", { children: detail.label }),
-            /* @__PURE__ */ jsx8("dd", { children: detail.value })
+        empty ? /* @__PURE__ */ jsx9("p", { className: "collection-result-card__empty", children: "No matching record for the email you shared." }) : /* @__PURE__ */ jsx9("ul", { className: "collection-result-card__list", children: result.items.map((item) => /* @__PURE__ */ jsxs9("li", { children: [
+          /* @__PURE__ */ jsx9("div", { className: "collection-result-card__item-title", children: item.title }),
+          item.description ? /* @__PURE__ */ jsx9("p", { children: item.description }) : null,
+          item.details?.length ? /* @__PURE__ */ jsx9("dl", { children: item.details.map((detail) => /* @__PURE__ */ jsxs9("div", { children: [
+            /* @__PURE__ */ jsx9("dt", { children: detail.label }),
+            /* @__PURE__ */ jsx9("dd", { children: detail.value })
           ] }, `${detail.label}:${detail.value}`)) }) : null,
-          item.href ? /* @__PURE__ */ jsx8("a", { href: item.href, target: "_blank", rel: "noreferrer", children: "Open record" }) : null
+          item.href ? /* @__PURE__ */ jsx9("a", { href: item.href, target: "_blank", rel: "noreferrer", children: "Open record" }) : null
         ] }, item.title)) })
       ]
     }
@@ -3903,26 +4378,26 @@ function CollectionResultCard({
 }
 
 // src/react/components/EntityResultCard/EntityResultCard.tsx
-import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
 function EntityResultCard({
   result
 }) {
-  return /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsxs10(
     "section",
     {
       className: `entity-result-card tool-result-card tool-result-card--${result.status}`,
       "aria-label": result.title,
       children: [
-        /* @__PURE__ */ jsxs9("div", { className: "tool-result-card__heading", children: [
-          /* @__PURE__ */ jsx9("span", { className: "tool-result-card__status", "aria-hidden": "true" }),
-          /* @__PURE__ */ jsx9("strong", { children: result.title })
+        /* @__PURE__ */ jsxs10("div", { className: "tool-result-card__heading", children: [
+          /* @__PURE__ */ jsx10("span", { className: "tool-result-card__status", "aria-hidden": "true" }),
+          /* @__PURE__ */ jsx10("strong", { children: result.title })
         ] }),
-        result.description ? /* @__PURE__ */ jsx9("p", { children: result.description }) : null,
-        result.details?.length ? /* @__PURE__ */ jsx9("dl", { children: result.details.map((detail) => /* @__PURE__ */ jsxs9("div", { children: [
-          /* @__PURE__ */ jsx9("dt", { children: detail.label }),
-          /* @__PURE__ */ jsx9("dd", { children: detail.value })
+        result.description ? /* @__PURE__ */ jsx10("p", { children: result.description }) : null,
+        result.details?.length ? /* @__PURE__ */ jsx10("dl", { children: result.details.map((detail) => /* @__PURE__ */ jsxs10("div", { children: [
+          /* @__PURE__ */ jsx10("dt", { children: detail.label }),
+          /* @__PURE__ */ jsx10("dd", { children: detail.value })
         ] }, `${detail.label}:${detail.value}`)) }) : null,
-        result.links?.length ? /* @__PURE__ */ jsx9("div", { className: "tool-result-card__links", children: result.links.map((link) => /* @__PURE__ */ jsx9(
+        result.links?.length ? /* @__PURE__ */ jsx10("div", { className: "tool-result-card__links", children: result.links.map((link) => /* @__PURE__ */ jsx10(
           "a",
           {
             href: link.href,
@@ -3938,24 +4413,24 @@ function EntityResultCard({
 }
 
 // src/react/components/SignatureResultCard/SignatureResultCard.tsx
-import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
 function SignatureResultCard({
   result
 }) {
   const primaryLink = result.links?.[0];
-  return /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsxs11(
     "section",
     {
       className: `signature-result-card tool-result-card tool-result-card--${result.status}`,
       "aria-label": result.title,
       children: [
-        /* @__PURE__ */ jsxs10("div", { className: "tool-result-card__heading", children: [
-          /* @__PURE__ */ jsx10("span", { className: "tool-result-card__status", "aria-hidden": "true" }),
-          /* @__PURE__ */ jsx10("strong", { children: result.title })
+        /* @__PURE__ */ jsxs11("div", { className: "tool-result-card__heading", children: [
+          /* @__PURE__ */ jsx11("span", { className: "tool-result-card__status", "aria-hidden": "true" }),
+          /* @__PURE__ */ jsx11("strong", { children: result.title })
         ] }),
-        result.statusLabel ? /* @__PURE__ */ jsx10("span", { className: "signature-result-card__badge", children: result.statusLabel }) : null,
-        result.description ? /* @__PURE__ */ jsx10("p", { children: result.description }) : null,
-        primaryLink ? /* @__PURE__ */ jsx10(
+        result.statusLabel ? /* @__PURE__ */ jsx11("span", { className: "signature-result-card__badge", children: result.statusLabel }) : null,
+        result.description ? /* @__PURE__ */ jsx11("p", { children: result.description }) : null,
+        primaryLink ? /* @__PURE__ */ jsx11(
           "a",
           {
             className: "signature-result-card__cta",
@@ -3971,26 +4446,26 @@ function SignatureResultCard({
 }
 
 // src/react/components/ToolResultCard/ToolResultCard.tsx
-import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
 function ToolResultCard({
   result
 }) {
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs12(
     "section",
     {
       className: `tool-result-card tool-result-card--${result.status}`,
       "aria-label": result.title,
       children: [
-        /* @__PURE__ */ jsxs11("div", { className: "tool-result-card__heading", children: [
-          /* @__PURE__ */ jsx11("span", { className: "tool-result-card__status", "aria-hidden": "true" }),
-          /* @__PURE__ */ jsx11("strong", { children: result.title })
+        /* @__PURE__ */ jsxs12("div", { className: "tool-result-card__heading", children: [
+          /* @__PURE__ */ jsx12("span", { className: "tool-result-card__status", "aria-hidden": "true" }),
+          /* @__PURE__ */ jsx12("strong", { children: result.title })
         ] }),
-        result.description ? /* @__PURE__ */ jsx11("p", { children: result.description }) : null,
-        result.details?.length ? /* @__PURE__ */ jsx11("dl", { children: result.details.map((detail) => /* @__PURE__ */ jsxs11("div", { children: [
-          /* @__PURE__ */ jsx11("dt", { children: detail.label }),
-          /* @__PURE__ */ jsx11("dd", { children: detail.value })
+        result.description ? /* @__PURE__ */ jsx12("p", { children: result.description }) : null,
+        result.details?.length ? /* @__PURE__ */ jsx12("dl", { children: result.details.map((detail) => /* @__PURE__ */ jsxs12("div", { children: [
+          /* @__PURE__ */ jsx12("dt", { children: detail.label }),
+          /* @__PURE__ */ jsx12("dd", { children: detail.value })
         ] }, `${detail.label}:${detail.value}`)) }) : null,
-        result.links?.length ? /* @__PURE__ */ jsx11("div", { className: "tool-result-card__links", children: result.links.map((link) => /* @__PURE__ */ jsx11(
+        result.links?.length ? /* @__PURE__ */ jsx12("div", { className: "tool-result-card__links", children: result.links.map((link) => /* @__PURE__ */ jsx12(
           "a",
           {
             href: link.href,
@@ -4006,32 +4481,44 @@ function ToolResultCard({
 }
 
 // src/react/components/VisitorToolResultView/VisitorToolResultView.tsx
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx13 } from "react/jsx-runtime";
 function VisitorToolResultView({
+  disabled = false,
+  onToolInput,
   result
 }) {
+  if (result.kind === "input") {
+    return /* @__PURE__ */ jsx13(
+      ToolInputCard,
+      {
+        disabled,
+        surface: result.surface,
+        onSubmit: onToolInput
+      }
+    );
+  }
   if (result.kind === "entity") {
-    return /* @__PURE__ */ jsx12(EntityResultCard, { result });
+    return /* @__PURE__ */ jsx13(EntityResultCard, { result });
   }
   if (result.kind === "collection") {
-    return /* @__PURE__ */ jsx12(CollectionResultCard, { result });
+    return /* @__PURE__ */ jsx13(CollectionResultCard, { result });
   }
   if (result.kind === "signature") {
-    return /* @__PURE__ */ jsx12(SignatureResultCard, { result });
+    return /* @__PURE__ */ jsx13(SignatureResultCard, { result });
   }
   if (result.kind === "summary") {
-    return /* @__PURE__ */ jsx12(ToolResultCard, { result });
+    return /* @__PURE__ */ jsx13(ToolResultCard, { result });
   }
   return null;
 }
 function isRenderableVisitorToolResult(result) {
-  return result.kind === "summary" || result.kind === "entity" || result.kind === "collection" || result.kind === "signature";
+  return result.kind === "summary" || result.kind === "input" || result.kind === "entity" || result.kind === "collection" || result.kind === "signature";
 }
 
 // src/react/components/AgentRail/AgentRail.tsx
-import { Fragment, jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
 function MinimizeIcon() {
-  return /* @__PURE__ */ jsx13("svg", { viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx14("svg", { viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx14(
     "path",
     {
       d: "M3.5 8h9",
@@ -4042,7 +4529,7 @@ function MinimizeIcon() {
   ) });
 }
 function CloseIcon() {
-  return /* @__PURE__ */ jsx13("svg", { viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx14("svg", { viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx14(
     "path",
     {
       d: "M4 4l8 8M12 4l-8 8",
@@ -4053,7 +4540,7 @@ function CloseIcon() {
   ) });
 }
 function NewChatIcon() {
-  return /* @__PURE__ */ jsx13("svg", { viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx14("svg", { viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx14(
     "path",
     {
       d: "M9.5 3.5h3v3M12.25 3.75 8 8M7 4H4.5A1.5 1.5 0 0 0 3 5.5v6A1.5 1.5 0 0 0 4.5 13h6a1.5 1.5 0 0 0 1.5-1.5V9",
@@ -4065,7 +4552,7 @@ function NewChatIcon() {
   ) });
 }
 function ExpandIcon() {
-  return /* @__PURE__ */ jsx13("svg", { viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx14("svg", { viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx14(
     "path",
     {
       d: "M6 3.5H3.5V6M10 3.5h2.5V6M10 12.5h2.5V10M6 12.5H3.5V10",
@@ -4077,7 +4564,7 @@ function ExpandIcon() {
   ) });
 }
 function RestoreIcon() {
-  return /* @__PURE__ */ jsx13("svg", { viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx14("svg", { viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx14(
     "path",
     {
       d: "M5.5 5.5H3.5V7.5M10.5 5.5h2V7.5M10.5 10.5h2V8.5M5.5 10.5H3.5V8.5",
@@ -4106,12 +4593,13 @@ function AgentRail({
   onSubmit,
   onFollowUpSelect,
   onBook,
-  onInputResponse
+  onInputResponse,
+  onToolInput
 }) {
   const transcriptRef = useRef3(null);
   const resolvedBrandLabel = brandLabel.trim();
   const resolvedBrandLogoUrl = brandLogoUrl?.trim();
-  const [failedLogoUrl, setFailedLogoUrl] = useState7(null);
+  const [failedLogoUrl, setFailedLogoUrl] = useState8(null);
   const showBrandLogo = Boolean(resolvedBrandLogoUrl) && failedLogoUrl !== resolvedBrandLogoUrl;
   const resolvedColorScheme = useAgentColorScheme(colorScheme);
   const brandedTheme = { ...defaultAgentRailTheme, ...theme };
@@ -4122,6 +4610,7 @@ function AgentRail({
     brandSoft: theme?.brandSoft ?? `color-mix(in srgb, ${theme?.brand ?? defaultDarkAgentRailTheme.brand} 18%, ${defaultDarkAgentRailTheme.surface})`,
     border: theme?.border ?? defaultDarkAgentRailTheme.border,
     danger: theme?.danger ?? defaultDarkAgentRailTheme.danger,
+    onBrand: theme?.onBrand ?? defaultDarkAgentRailTheme.onBrand,
     success: theme?.success ?? defaultDarkAgentRailTheme.success,
     surface: theme?.surface ?? defaultDarkAgentRailTheme.surface,
     surfaceMuted: theme?.surfaceMuted ?? defaultDarkAgentRailTheme.surfaceMuted,
@@ -4144,6 +4633,7 @@ function AgentRail({
     "--as-border": resolvedTheme.border,
     "--as-visitor-bubble": resolvedTheme.visitorBubble,
     "--as-visitor-text": resolvedTheme.visitorText,
+    "--as-on-brand": resolvedTheme.onBrand,
     "--as-success": resolvedTheme.success,
     "--as-danger": resolvedTheme.danger,
     "--as-font-body": resolvedTheme.fontBody,
@@ -4155,10 +4645,12 @@ function AgentRail({
   );
   const isBusy = state.phase === "thinking" || state.phase === "running-tools" || state.phase === "streaming" || state.phase === "waiting-input" && pendingInputRequests.length > 0;
   const semanticSurfaceDisabled = isBusy && state.phase !== "waiting-input";
-  const showActivity = state.toolSteps.length > 0;
   const visitorToolResults = (state.toolResults ?? []).filter(
     isRenderableVisitorToolResult
   );
+  const activeVisitorToolInput = [...visitorToolResults].reverse().find((result) => result.kind === "input");
+  const visibleVisitorToolResults = activeVisitorToolInput ? [activeVisitorToolInput] : visitorToolResults;
+  const showActivity = state.toolSteps.length > 0 && visibleVisitorToolResults.length === 0 && pendingInputRequests.length === 0 && !state.pendingOffer;
   const hasVisitorMessages2 = state.messages.some(
     (message) => message.role === "visitor"
   );
@@ -4199,10 +4691,14 @@ function AgentRail({
   const bookingReadyText = state.streamingText || (lastIsAgent && lastMessage?.role === "agent" ? lastMessage.text : "");
   const waitingForBooking = !state.pendingOffer && looksLikeBookingReady(bookingReadyText) && (state.phase === "thinking" || state.phase === "running-tools" || state.phase === "streaming");
   const lastAgentText = lastIsAgent && lastMessage?.role === "agent" ? lastMessage.text : "";
+  const hasPendingConfirmation = pendingInputRequests.some(
+    (request) => request.kind === "tool-approval" || request.kind === "question" && (request.options?.length ?? 0) > 0
+  );
   const composerForm = resolveComposerForm({
     agentText: lastAgentText,
     cards: extractToolCards(lastAgentText),
     hasBookingOffer: Boolean(state.pendingOffer) || waitingForBooking,
+    hasPendingConfirmation,
     enabled: lastIsAgent && !isBusy
   });
   useEffect3(() => {
@@ -4216,7 +4712,7 @@ function AgentRail({
     state.followUps,
     state.journey
   ]);
-  return /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsxs13(
     "aside",
     {
       className: `agent-rail not-typeset${mobileFullscreen ? " agent-rail--mobile-fullscreen" : ""}${expanded ? " agent-rail--expanded" : ""}`,
@@ -4230,28 +4726,28 @@ function AgentRail({
       role: mobileFullscreen || expanded ? "dialog" : void 0,
       tabIndex: mobileFullscreen || expanded ? -1 : void 0,
       children: [
-        /* @__PURE__ */ jsx13("header", { className: "agent-rail__header", children: /* @__PURE__ */ jsxs12("div", { className: "agent-rail__brand-row", children: [
-          onCollapse ? /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsx14("header", { className: "agent-rail__header", children: /* @__PURE__ */ jsxs13("div", { className: "agent-rail__brand-row", children: [
+          onCollapse ? /* @__PURE__ */ jsx14(
             "button",
             {
               type: "button",
               className: "agent-rail__collapse",
               "aria-label": "Collapse assist",
               onClick: onCollapse,
-              children: /* @__PURE__ */ jsx13(MinimizeIcon, {})
+              children: /* @__PURE__ */ jsx14(MinimizeIcon, {})
             }
-          ) : onClose ? /* @__PURE__ */ jsx13(
+          ) : onClose ? /* @__PURE__ */ jsx14(
             "button",
             {
               type: "button",
               className: "agent-rail__close",
               "aria-label": "Close agent",
               onClick: onClose,
-              children: /* @__PURE__ */ jsx13(CloseIcon, {})
+              children: /* @__PURE__ */ jsx14(CloseIcon, {})
             }
-          ) : /* @__PURE__ */ jsx13("span", { className: "agent-rail__brand-spacer", "aria-hidden": "true" }),
-          resolvedBrandLabel || showBrandLogo ? /* @__PURE__ */ jsxs12("span", { className: "agent-rail__identity", children: [
-            showBrandLogo ? /* @__PURE__ */ jsx13("span", { className: "agent-rail__brand-mark", "aria-hidden": "true", children: /* @__PURE__ */ jsx13(
+          ) : /* @__PURE__ */ jsx14("span", { className: "agent-rail__brand-spacer", "aria-hidden": "true" }),
+          resolvedBrandLabel || showBrandLogo ? /* @__PURE__ */ jsxs13("span", { className: "agent-rail__identity", children: [
+            showBrandLogo ? /* @__PURE__ */ jsx14("span", { className: "agent-rail__brand-mark", "aria-hidden": "true", children: /* @__PURE__ */ jsx14(
               "img",
               {
                 className: "agent-rail__brand-logo",
@@ -4262,10 +4758,10 @@ function AgentRail({
                 }
               }
             ) }) : null,
-            resolvedBrandLabel ? /* @__PURE__ */ jsx13("span", { className: "agent-rail__brand-label", children: resolvedBrandLabel }) : null
+            resolvedBrandLabel ? /* @__PURE__ */ jsx14("span", { className: "agent-rail__brand-label", children: resolvedBrandLabel }) : null
           ] }) : null,
-          /* @__PURE__ */ jsxs12("span", { className: "agent-rail__actions", children: [
-            onReset ? /* @__PURE__ */ jsx13(
+          /* @__PURE__ */ jsxs13("span", { className: "agent-rail__actions", children: [
+            onReset ? /* @__PURE__ */ jsx14(
               "button",
               {
                 type: "button",
@@ -4273,24 +4769,24 @@ function AgentRail({
                 "aria-label": "Start a new conversation",
                 disabled: !hasVisitorMessages2,
                 onClick: onReset,
-                children: /* @__PURE__ */ jsx13(NewChatIcon, {})
+                children: /* @__PURE__ */ jsx14(NewChatIcon, {})
               }
             ) : null,
-            onExpandToggle ? /* @__PURE__ */ jsx13(
+            onExpandToggle ? /* @__PURE__ */ jsx14(
               "button",
               {
                 type: "button",
                 className: "agent-rail__expand",
                 "aria-label": expanded ? "Exit full screen" : "Open full screen",
                 onClick: onExpandToggle,
-                children: expanded ? /* @__PURE__ */ jsx13(RestoreIcon, {}) : /* @__PURE__ */ jsx13(ExpandIcon, {})
+                children: expanded ? /* @__PURE__ */ jsx14(RestoreIcon, {}) : /* @__PURE__ */ jsx14(ExpandIcon, {})
               }
             ) : null
           ] })
         ] }) }),
-        /* @__PURE__ */ jsx13("div", { ref: transcriptRef, className: "agent-rail__transcript", children: /* @__PURE__ */ jsxs12("div", { className: "agent-rail__thread", children: [
-          !hasVisitorMessages2 ? /* @__PURE__ */ jsxs12("section", { className: "agent-rail__welcome", "aria-label": "Welcome", children: [
-            greeting?.role === "agent" ? /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsx14("div", { ref: transcriptRef, className: "agent-rail__transcript", children: /* @__PURE__ */ jsxs13("div", { className: "agent-rail__thread", children: [
+          !hasVisitorMessages2 ? /* @__PURE__ */ jsxs13("section", { className: "agent-rail__welcome", "aria-label": "Welcome", children: [
+            greeting?.role === "agent" ? /* @__PURE__ */ jsx14(
               MessageBubble,
               {
                 message: greeting,
@@ -4298,7 +4794,7 @@ function AgentRail({
                 onBook
               }
             ) : null,
-            showIdleFollowUps ? /* @__PURE__ */ jsx13("div", { className: "agent-rail__followups-slot", children: /* @__PURE__ */ jsx13(
+            showIdleFollowUps ? /* @__PURE__ */ jsx14("div", { className: "agent-rail__followups-slot", children: /* @__PURE__ */ jsx14(
               FollowUpChips,
               {
                 suggestions: state.followUps,
@@ -4307,7 +4803,7 @@ function AgentRail({
                 onSelect: (suggestion) => onFollowUpSelect?.(suggestion.label)
               }
             ) }) : null,
-            showActivity ? /* @__PURE__ */ jsx13(
+            showActivity ? /* @__PURE__ */ jsx14(
               AgentActivityBubble,
               {
                 brandLabel: resolvedBrandLabel,
@@ -4316,8 +4812,16 @@ function AgentRail({
                 steps: state.toolSteps
               }
             ) : null,
-            visitorToolResults.map((result) => /* @__PURE__ */ jsx13(VisitorToolResultView, { result }, result.id)),
-            pendingInputRequests.map((request) => /* @__PURE__ */ jsx13(
+            visibleVisitorToolResults.map((result) => /* @__PURE__ */ jsx14(
+              VisitorToolResultView,
+              {
+                result,
+                disabled: semanticSurfaceDisabled,
+                onToolInput
+              },
+              result.id
+            )),
+            pendingInputRequests.slice(0, 1).map((request) => /* @__PURE__ */ jsx14(
               HumanInputCard,
               {
                 request,
@@ -4326,8 +4830,8 @@ function AgentRail({
               request.requestId
             ))
           ] }) : null,
-          visibleMessages.map((message, index) => /* @__PURE__ */ jsxs12("div", { className: "agent-rail__turn-block", children: [
-            /* @__PURE__ */ jsx13(
+          visibleMessages.map((message, index) => /* @__PURE__ */ jsxs13("div", { className: "agent-rail__turn-block", children: [
+            /* @__PURE__ */ jsx14(
               MessageBubble,
               {
                 message,
@@ -4336,8 +4840,8 @@ function AgentRail({
                 onBook
               }
             ),
-            index === lastVisitorIndex ? /* @__PURE__ */ jsxs12(Fragment, { children: [
-              showActivity ? /* @__PURE__ */ jsx13(
+            index === lastVisitorIndex ? /* @__PURE__ */ jsxs13(Fragment, { children: [
+              showActivity ? /* @__PURE__ */ jsx14(
                 AgentActivityBubble,
                 {
                   brandLabel: resolvedBrandLabel,
@@ -4346,8 +4850,16 @@ function AgentRail({
                   steps: state.toolSteps
                 }
               ) : null,
-              visitorToolResults.map((result) => /* @__PURE__ */ jsx13(VisitorToolResultView, { result }, result.id)),
-              pendingInputRequests.map((request) => /* @__PURE__ */ jsx13(
+              visibleVisitorToolResults.map((result) => /* @__PURE__ */ jsx14(
+                VisitorToolResultView,
+                {
+                  result,
+                  disabled: semanticSurfaceDisabled,
+                  onToolInput
+                },
+                result.id
+              )),
+              pendingInputRequests.slice(0, 1).map((request) => /* @__PURE__ */ jsx14(
                 HumanInputCard,
                 {
                   request,
@@ -4357,7 +4869,7 @@ function AgentRail({
               ))
             ] }) : null
           ] }, message.id)),
-          streamingMessage ? /* @__PURE__ */ jsx13(
+          streamingMessage ? /* @__PURE__ */ jsx14(
             MessageBubble,
             {
               message: streamingMessage,
@@ -4366,22 +4878,17 @@ function AgentRail({
               onBook
             }
           ) : null,
-          waitingForBooking ? /* @__PURE__ */ jsx13(
-            BookingCard,
-            {
-              offer: { type: "booking_offer", eventTypes: [], slots: [] }
-            }
-          ) : null,
-          state.error ? /* @__PURE__ */ jsxs12("section", { className: "agent-rail__error", role: "alert", children: [
-            /* @__PURE__ */ jsxs12("div", { children: [
-              /* @__PURE__ */ jsx13("strong", { children: "Something went wrong" }),
-              /* @__PURE__ */ jsx13("p", { children: state.error })
+          waitingForBooking ? /* @__PURE__ */ jsx14(BookingCardLoader, {}) : null,
+          state.error ? /* @__PURE__ */ jsxs13("section", { className: "agent-rail__error", role: "alert", children: [
+            /* @__PURE__ */ jsxs13("div", { children: [
+              /* @__PURE__ */ jsx14("strong", { children: "Something went wrong" }),
+              /* @__PURE__ */ jsx14("p", { children: state.error })
             ] }),
-            onRetry ? /* @__PURE__ */ jsx13("button", { type: "button", onClick: onRetry, children: "Try again" }) : null
+            onRetry ? /* @__PURE__ */ jsx14("button", { type: "button", onClick: onRetry, children: "Try again" }) : null
           ] }) : null
         ] }) }),
-        /* @__PURE__ */ jsxs12("div", { className: "agent-rail__composer-wrap", children: [
-          /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsxs13("div", { className: "agent-rail__composer-wrap", children: [
+          /* @__PURE__ */ jsx14(
             Composer,
             {
               variant: expanded || mobileFullscreen ? "dock" : "default",
@@ -4391,9 +4898,9 @@ function AgentRail({
               onSubmit
             }
           ),
-          /* @__PURE__ */ jsx13("div", { className: "agent-rail__footer", children: /* @__PURE__ */ jsxs12("p", { children: [
-            /* @__PURE__ */ jsx13("span", { children: "AI can make mistakes. Check important info." }),
-            /* @__PURE__ */ jsx13("span", { children: poweredByLabel })
+          /* @__PURE__ */ jsx14("div", { className: "agent-rail__footer", children: /* @__PURE__ */ jsxs13("p", { children: [
+            /* @__PURE__ */ jsx14("span", { children: "AI can make mistakes. Check important info." }),
+            /* @__PURE__ */ jsx14("span", { children: poweredByLabel })
           ] }) })
         ] })
       ]
@@ -4402,9 +4909,9 @@ function AgentRail({
 }
 
 // src/react/components/AssistEdgeTab/AssistEdgeTab.tsx
-import { Fragment as Fragment2, jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
 function SparklesIcon() {
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs14(
     "svg",
     {
       className: "assist-edge-tab__sparkles",
@@ -4412,21 +4919,21 @@ function SparklesIcon() {
       fill: "none",
       "aria-hidden": "true",
       children: [
-        /* @__PURE__ */ jsx14(
+        /* @__PURE__ */ jsx15(
           "path",
           {
             d: "M8 1.2l.95 2.7 2.85.05-2.25 1.75.8 2.75L8 6.7 5.65 8.45l.8-2.75L4.2 3.95l2.85-.05L8 1.2z",
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx14(
+        /* @__PURE__ */ jsx15(
           "path",
           {
             d: "M14.2 6.4l.55 1.55 1.65.03-1.3 1 .46 1.58-1.36-1-1.36 1 .46-1.58-1.3-1 1.65-.03.55-1.55z",
             fill: "currentColor"
           }
         ),
-        /* @__PURE__ */ jsx14(
+        /* @__PURE__ */ jsx15(
           "path",
           {
             d: "M3.1 9.1l.4 1.15 1.22.02-.96.74.34 1.17-1-.74-1 .74.34-1.17-.96-.74 1.22-.02.4-1.15z",
@@ -4440,7 +4947,7 @@ function SparklesIcon() {
 function TabMarkIcon({ customIconUrl }) {
   const url = customIconUrl?.trim();
   if (url) {
-    return /* @__PURE__ */ jsx14(
+    return /* @__PURE__ */ jsx15(
       "img",
       {
         alt: "",
@@ -4450,10 +4957,10 @@ function TabMarkIcon({ customIconUrl }) {
       }
     );
   }
-  return /* @__PURE__ */ jsx14(SparklesIcon, {});
+  return /* @__PURE__ */ jsx15(SparklesIcon, {});
 }
 function ChevronLeftIcon() {
-  return /* @__PURE__ */ jsx14("svg", { viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx15("svg", { viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx15(
     "path",
     {
       d: "M10 4L6 8l4 4",
@@ -4465,7 +4972,7 @@ function ChevronLeftIcon() {
   ) });
 }
 function ChevronDownIcon() {
-  return /* @__PURE__ */ jsx14("svg", { viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx15("svg", { viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx15(
     "path",
     {
       d: "M4 6l4 4 4-4",
@@ -4477,7 +4984,7 @@ function ChevronDownIcon() {
   ) });
 }
 function DragDots() {
-  return /* @__PURE__ */ jsx14("span", { className: "assist-edge-tab__dots", "aria-hidden": "true", children: Array.from({ length: 12 }, (_, index) => /* @__PURE__ */ jsx14("i", {}, index)) });
+  return /* @__PURE__ */ jsx15("span", { className: "assist-edge-tab__dots", "aria-hidden": "true", children: Array.from({ length: 12 }, (_, index) => /* @__PURE__ */ jsx15("i", {}, index)) });
 }
 var VARIANT_COPY = {
   outline: { label: "Ask anything", aria: "Ask anything" },
@@ -4523,7 +5030,7 @@ function AssistEdgeTab({
     ...resolvedTextColor ? { "--as-text": resolvedTextColor } : {},
     colorScheme: resolvedColorScheme
   };
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs14(
     "button",
     {
       type: "button",
@@ -4535,15 +5042,15 @@ function AssistEdgeTab({
       tabIndex: visible ? 0 : -1,
       onClick: onOpen,
       children: [
-        mobile ? /* @__PURE__ */ jsxs13(Fragment2, { children: [
-          /* @__PURE__ */ jsxs13(
+        mobile ? /* @__PURE__ */ jsxs14(Fragment2, { children: [
+          /* @__PURE__ */ jsxs14(
             "span",
             {
               className: "assist-edge-tab__mark assist-edge-tab__mark--mobile",
               "aria-hidden": "true",
               children: [
-                /* @__PURE__ */ jsx14(TabMarkIcon, { customIconUrl }),
-                showLogo ? /* @__PURE__ */ jsx14(
+                /* @__PURE__ */ jsx15(TabMarkIcon, { customIconUrl }),
+                showLogo ? /* @__PURE__ */ jsx15(
                   "img",
                   {
                     className: "assist-edge-tab__logo",
@@ -4557,11 +5064,11 @@ function AssistEdgeTab({
               ]
             }
           ),
-          /* @__PURE__ */ jsx14("span", { className: "assist-edge-tab__label", children: visibleLabel })
-        ] }) : variant === "outline" ? /* @__PURE__ */ jsxs13(Fragment2, { children: [
-          /* @__PURE__ */ jsxs13("span", { className: "assist-edge-tab__mark", "aria-hidden": "true", children: [
-            /* @__PURE__ */ jsx14(TabMarkIcon, { customIconUrl }),
-            showLogo ? /* @__PURE__ */ jsx14(
+          /* @__PURE__ */ jsx15("span", { className: "assist-edge-tab__label", children: visibleLabel })
+        ] }) : variant === "outline" ? /* @__PURE__ */ jsxs14(Fragment2, { children: [
+          /* @__PURE__ */ jsxs14("span", { className: "assist-edge-tab__mark", "aria-hidden": "true", children: [
+            /* @__PURE__ */ jsx15(TabMarkIcon, { customIconUrl }),
+            showLogo ? /* @__PURE__ */ jsx15(
               "img",
               {
                 className: "assist-edge-tab__logo",
@@ -4573,18 +5080,18 @@ function AssistEdgeTab({
               }
             ) : null
           ] }),
-          /* @__PURE__ */ jsx14("span", { className: "assist-edge-tab__label", children: visibleLabel }),
-          /* @__PURE__ */ jsx14(ChevronDownIcon, {})
+          /* @__PURE__ */ jsx15("span", { className: "assist-edge-tab__label", children: visibleLabel }),
+          /* @__PURE__ */ jsx15(ChevronDownIcon, {})
         ] }) : null,
-        variant === "ask" ? /* @__PURE__ */ jsxs13(Fragment2, { children: [
-          /* @__PURE__ */ jsx14(ChevronLeftIcon, {}),
-          /* @__PURE__ */ jsx14("span", { className: "assist-edge-tab__label", children: visibleLabel }),
-          /* @__PURE__ */ jsx14(DragDots, {})
+        variant === "ask" ? /* @__PURE__ */ jsxs14(Fragment2, { children: [
+          /* @__PURE__ */ jsx15(ChevronLeftIcon, {}),
+          /* @__PURE__ */ jsx15("span", { className: "assist-edge-tab__label", children: visibleLabel }),
+          /* @__PURE__ */ jsx15(DragDots, {})
         ] }) : null,
-        variant === "fill" ? /* @__PURE__ */ jsxs13(Fragment2, { children: [
-          /* @__PURE__ */ jsxs13("span", { className: "assist-edge-tab__mark", "aria-hidden": "true", children: [
-            /* @__PURE__ */ jsx14(TabMarkIcon, { customIconUrl }),
-            showLogo ? /* @__PURE__ */ jsx14(
+        variant === "fill" ? /* @__PURE__ */ jsxs14(Fragment2, { children: [
+          /* @__PURE__ */ jsxs14("span", { className: "assist-edge-tab__mark", "aria-hidden": "true", children: [
+            /* @__PURE__ */ jsx15(TabMarkIcon, { customIconUrl }),
+            showLogo ? /* @__PURE__ */ jsx15(
               "img",
               {
                 className: "assist-edge-tab__logo",
@@ -4596,8 +5103,8 @@ function AssistEdgeTab({
               }
             ) : null
           ] }),
-          /* @__PURE__ */ jsx14("span", { className: "assist-edge-tab__label", children: visibleLabel }),
-          /* @__PURE__ */ jsx14(ChevronLeftIcon, {})
+          /* @__PURE__ */ jsx15("span", { className: "assist-edge-tab__label", children: visibleLabel }),
+          /* @__PURE__ */ jsx15(ChevronLeftIcon, {})
         ] }) : null
       ]
     }
@@ -4605,7 +5112,7 @@ function AssistEdgeTab({
 }
 
 // src/react/components/AgentWidget/AgentWidget.tsx
-import { useEffect as useEffect6, useRef as useRef4, useState as useState9 } from "react";
+import { useEffect as useEffect6, useRef as useRef4, useState as useState10 } from "react";
 
 // src/react/page-shift.ts
 import { useEffect as useEffect4 } from "react";
@@ -4688,9 +5195,9 @@ function usePageShift(input) {
 }
 
 // src/react/hooks/useIsMobile.ts
-import { useEffect as useEffect5, useState as useState8 } from "react";
+import { useEffect as useEffect5, useState as useState9 } from "react";
 function useIsMobile(breakpoint = 767) {
-  const [isMobile, setIsMobile] = useState8(
+  const [isMobile, setIsMobile] = useState9(
     () => typeof window !== "undefined" && window.matchMedia(`(max-width: ${breakpoint}px)`).matches
   );
   useEffect5(() => {
@@ -4704,7 +5211,7 @@ function useIsMobile(breakpoint = 767) {
 }
 
 // src/react/components/AgentWidget/AgentWidget.tsx
-import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
 function AgentWidget({
   indexId,
   customerId,
@@ -4723,8 +5230,8 @@ function AgentWidget({
   const isMobile = useIsMobile();
   const placement = normalizeAgentPlacement(placementInput);
   const railSlotRef = useRef4(null);
-  const [railCollapsed, setRailCollapsed] = useState9(defaultCollapsed);
-  const [railExpanded, setRailExpanded] = useState9(false);
+  const [railCollapsed, setRailCollapsed] = useState10(defaultCollapsed);
+  const [railExpanded, setRailExpanded] = useState10(false);
   const pageShiftActive = shouldApplyPageShift({
     pageShift,
     isMobile,
@@ -4754,7 +5261,10 @@ function AgentWidget({
       visitorBubble: branding.colors.primary
     } : {},
     ...branding?.colors?.primarySoft ? { brandSoft: branding.colors.primarySoft } : {},
-    ...branding?.colors?.primaryForeground ? { visitorText: branding.colors.primaryForeground } : {},
+    ...branding?.colors?.primaryForeground ? {
+      onBrand: branding.colors.primaryForeground,
+      visitorText: branding.colors.primaryForeground
+    } : {},
     ...branding?.colors?.surface ? { surface: branding.colors.surface } : {},
     ...branding?.colors?.surfaceMuted ? { surfaceMuted: branding.colors.surfaceMuted } : {},
     ...branding?.colors?.text ? { text: branding.colors.text } : {},
@@ -4815,19 +5325,19 @@ function AgentWidget({
     window.addEventListener("keydown", handleKeyDown);
     return () => window.removeEventListener("keydown", handleKeyDown);
   }, [isMobile, railCollapsed, railExpanded]);
-  return /* @__PURE__ */ jsxs14("div", { className: "webless-agent-root", children: [
-    /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsxs15("div", { className: "webless-agent-root", children: [
+    /* @__PURE__ */ jsx16(
       "div",
       {
         className: `webless-agent-root__shell${railCollapsed ? " webless-agent-root__shell--collapsed" : ""}${railExpanded ? " webless-agent-root__shell--expanded" : ""}`,
-        children: /* @__PURE__ */ jsx15(
+        children: /* @__PURE__ */ jsx16(
           "div",
           {
             ref: railSlotRef,
             className: "webless-agent-root__rail-slot",
             inert: railCollapsed || void 0,
             "aria-hidden": railCollapsed,
-            children: /* @__PURE__ */ jsx15(
+            children: /* @__PURE__ */ jsx16(
               AgentRail,
               {
                 theme,
@@ -4855,7 +5365,7 @@ function AgentWidget({
         )
       }
     ),
-    railCollapsed ? /* @__PURE__ */ jsx15(
+    railCollapsed ? /* @__PURE__ */ jsx16(
       AssistEdgeTab,
       {
         variant: placement.variant,
@@ -4883,6 +5393,9 @@ function AgentWidget({
 export {
   DEFAULT_RUNTIME_ORIGIN,
   resolveAgentRuntimeConfig,
+  AGENT_STRUCTURED_TOOL_INPUT_SCHEMA_VERSION,
+  AGENT_STRUCTURED_TOOL_INPUT_HEADER,
+  formatAgentStructuredToolInput,
   builtInVisitorToolResultRegistry,
   presentVisitorToolResult,
   useAgentChat,
@@ -4901,4 +5414,4 @@ export {
   AssistEdgeTab,
   AgentWidget
 };
-//# sourceMappingURL=chunk-U2TIUZJM.js.map
+//# sourceMappingURL=chunk-UR5QZZ2F.js.map