dooers-agents-client 0.2.6 → 0.3.0

package/dist/main.cjs

@@ -70,6 +70,82 @@ function toDisplayContentPart(w) {
       };
   }
 }
+function toFormElement(w) {
+  const base = {
+    name: w.name,
+    label: w.label,
+    order: w.order ?? 0,
+    required: w.required ?? false,
+    disabled: w.disabled ?? false
+  };
+  switch (w.type) {
+    case "text_input":
+      return {
+        ...base,
+        type: "text_input",
+        placeholder: w.placeholder ?? null,
+        default: w.default ?? null,
+        inputType: w.input_type ?? "text"
+      };
+    case "textarea_input":
+      return {
+        ...base,
+        type: "textarea_input",
+        placeholder: w.placeholder ?? null,
+        default: w.default ?? null,
+        rows: w.rows ?? null
+      };
+    case "select_input":
+      return {
+        ...base,
+        type: "select_input",
+        options: w.options,
+        default: w.default ?? null,
+        placeholder: w.placeholder ?? null
+      };
+    case "radio_input":
+      return {
+        ...base,
+        type: "radio_input",
+        options: w.options,
+        default: w.default ?? null,
+        variant: w.variant ?? "native"
+      };
+    case "checkbox_input":
+      return {
+        ...base,
+        type: "checkbox_input",
+        options: w.options,
+        default: w.default ?? null,
+        variant: w.variant ?? "native"
+      };
+    case "file_input":
+      return {
+        ...base,
+        type: "file_input",
+        uploadUrl: w.upload_url,
+        accept: w.accept ?? null,
+        multiple: w.multiple ?? false
+      };
+  }
+}
+function toFormEventData(data) {
+  const elements = data.elements ?? [];
+  return {
+    message: data.message ?? "",
+    elements: elements.map(toFormElement),
+    submitLabel: data.submit_label ?? "Send",
+    cancelLabel: data.cancel_label ?? "Cancel",
+    size: data.size ?? "medium"
+  };
+}
+function toFormResponseEventData(data) {
+  return {
+    formEventId: data.form_event_id ?? "",
+    cancelled: data.cancelled ?? false,
+    values: data.values ?? {}
+  };
+}
 function toThreadEvent(w) {
   return {
     id: w.id,
@@ -377,13 +453,7 @@ var WorkerClient = class {
       threadId: params.threadId ?? "",
       clientEventId
     });
-    const promise = new Promise((resolve, reject) => {
-      const timer = setTimeout(() => {
-        this.pendingMessages.delete(clientEventId);
-        reject(new Error("sendMessage timed out waiting for server response"));
-      }, SEND_MESSAGE_TIMEOUT);
-      this.pendingMessages.set(clientEventId, { resolve, timer });
-    });
+    const promise = this.createPendingPromise(clientEventId);
     this.send("event.create", {
       thread_id: params.threadId,
       client_event_id: clientEventId,
@@ -395,7 +465,35 @@ var WorkerClient = class {
     });
     return promise;
   }
+  sendFormResponse(params) {
+    const clientEventId = crypto.randomUUID();
+    const promise = this.createPendingPromise(clientEventId);
+    this.send("event.create", {
+      thread_id: params.threadId,
+      client_event_id: clientEventId,
+      event: {
+        type: "form.response",
+        actor: "user",
+        content: [],
+        data: {
+          form_event_id: params.formEventId,
+          cancelled: params.cancelled,
+          values: params.values
+        }
+      }
+    });
+    return promise;
+  }
   // --- Private ---
+  createPendingPromise(clientEventId) {
+    return new Promise((resolve, reject) => {
+      const timer = setTimeout(() => {
+        this.pendingMessages.delete(clientEventId);
+        reject(new Error("Request timed out waiting for server response"));
+      }, SEND_MESSAGE_TIMEOUT);
+      this.pendingMessages.set(clientEventId, { resolve, timer });
+    });
+  }
   createConnection() {
     if (this.ws) {
       this.ws.onopen = null;
@@ -611,6 +709,23 @@ var WorkerClient = class {
     });
   }
 };
+function extractFormStates(events, existing) {
+  let result = existing;
+  for (const e of events) {
+    if (e.type === "form.response" && e.data) {
+      const formEventId = e.data.form_event_id;
+      if (formEventId && !result[formEventId]) {
+        const cancelled = e.data.cancelled ?? false;
+        const values = e.data.values ?? {};
+        result = {
+          ...result,
+          [formEventId]: { values, submitting: false, submitted: !cancelled, cancelled }
+        };
+      }
+    }
+  }
+  return result;
+}
 function createWorkerStore() {
   return vanilla.createStore()((set) => ({
     connection: {
@@ -635,6 +750,7 @@ function createWorkerStore() {
       isLoading: true
     },
     feedback: {},
+    formStates: {},
     analytics: {
       events: [],
       counters: { totalRequests: 0, feedbackLikes: 0, feedbackDislikes: 0 }
@@ -699,6 +815,14 @@ function createWorkerStore() {
         subscriptions.delete(threadId);
         const loadingThreads = new Set(s.loadingThreads);
         loadingThreads.delete(threadId);
+        const deletedEvents = s.events[threadId] ?? [];
+        const deletedEventIds = new Set(deletedEvents.map((e) => e.id));
+        const formStates = { ...s.formStates };
+        for (const key of Object.keys(formStates)) {
+          if (deletedEventIds.has(key)) {
+            delete formStates[key];
+          }
+        }
         return {
           threads,
           threadOrder,
@@ -708,7 +832,8 @@ function createWorkerStore() {
           optimisticKeys,
           eventPagination,
           subscriptions,
-          loadingThreads
+          loadingThreads,
+          formStates
         };
       }),
       onThreadSnapshot: (thread, snapshotEvents, runs) => set((s) => {
@@ -736,7 +861,8 @@ function createWorkerStore() {
           runs: { ...s.runs, [thread.id]: runs },
           optimistic,
           optimisticKeys,
-          loadingThreads
+          loadingThreads,
+          formStates: extractFormStates(mergedEvents, s.formStates)
         };
       }),
       onEventAppend: (threadId, newEvents) => set((s) => {
@@ -753,7 +879,8 @@ function createWorkerStore() {
         }
         const merged = updates.size > 0 ? existing.map((e) => updates.get(e.id) ?? e) : existing;
         return {
-          events: { ...s.events, [threadId]: [...merged, ...appends] }
+          events: { ...s.events, [threadId]: [...merged, ...appends] },
+          formStates: extractFormStates(appends, s.formStates)
         };
       }),
       reconcileEvents: (threadId, newEvents, resolvedClientEventIds) => set((s) => {
@@ -875,7 +1002,64 @@ function createWorkerStore() {
           events: [],
           counters: { totalRequests: 0, feedbackLikes: 0, feedbackDislikes: 0 }
         }
-      }))
+      })),
+      initFormState: (formEventId, defaults) => set((s) => {
+        if (s.formStates[formEventId]) return s;
+        return {
+          formStates: {
+            ...s.formStates,
+            [formEventId]: {
+              values: defaults,
+              submitting: false,
+              submitted: false,
+              cancelled: false
+            }
+          }
+        };
+      }),
+      setFormSubmitting: (formEventId, submitting) => set((s) => {
+        const existing = s.formStates[formEventId];
+        if (!existing) return s;
+        return {
+          formStates: {
+            ...s.formStates,
+            [formEventId]: { ...existing, submitting }
+          }
+        };
+      }),
+      setFormValue: (formEventId, fieldName, value) => set((s) => {
+        const existing = s.formStates[formEventId];
+        if (!existing || existing.submitted || existing.cancelled) return s;
+        return {
+          formStates: {
+            ...s.formStates,
+            [formEventId]: {
+              ...existing,
+              values: { ...existing.values, [fieldName]: value }
+            }
+          }
+        };
+      }),
+      setFormSubmitted: (formEventId) => set((s) => {
+        const existing = s.formStates[formEventId];
+        if (!existing) return s;
+        return {
+          formStates: {
+            ...s.formStates,
+            [formEventId]: { ...existing, submitting: false, submitted: true }
+          }
+        };
+      }),
+      setFormCancelled: (formEventId) => set((s) => {
+        const existing = s.formStates[formEventId];
+        if (!existing) return s;
+        return {
+          formStates: {
+            ...s.formStates,
+            [formEventId]: { ...existing, submitting: false, cancelled: true }
+          }
+        };
+      })
     }
   }));
 }
@@ -1095,6 +1279,148 @@ function useFeedback(targetId, targetType = "event") {
   );
   return { feedback, like, dislike };
 }
+function useForm(formEventId, formData, threadId) {
+  const { client, store } = useWorkerContext();
+  const formState = useStore((s) => s.formStates[formEventId]);
+  const [errors, setErrors] = react.useState({});
+  react.useEffect(() => {
+    const defaults = {};
+    for (const el of formData.elements) {
+      if ("default" in el && el.default != null) {
+        defaults[el.name] = el.default;
+      }
+    }
+    store.getState().actions.initFormState(formEventId, defaults);
+  }, [formEventId, formData.elements, store]);
+  const values = formState?.values ?? {};
+  const isSubmitting = formState?.submitting ?? false;
+  const isSubmitted = formState?.submitted ?? false;
+  const isCancelled = formState?.cancelled ?? false;
+  const isDisabled = isSubmitting || isSubmitted || isCancelled;
+  const setValue = react.useCallback(
+    (fieldName, value) => {
+      store.getState().actions.setFormValue(formEventId, fieldName, value);
+      setErrors((prev) => {
+        if (!prev[fieldName]) return prev;
+        const next = { ...prev };
+        delete next[fieldName];
+        return next;
+      });
+    },
+    [formEventId, store]
+  );
+  const validate = react.useCallback(() => {
+    const currentValues = store.getState().formStates[formEventId]?.values ?? {};
+    const newErrors = {};
+    for (const el of formData.elements) {
+      if (!el.required) continue;
+      const val = currentValues[el.name];
+      if (isEmptyValue(el, val)) {
+        newErrors[el.name] = "Required";
+      }
+    }
+    setErrors(newErrors);
+    return Object.keys(newErrors).length === 0;
+  }, [formEventId, formData.elements, store]);
+  const submit = react.useCallback(async () => {
+    const state = store.getState();
+    const fs = state.formStates[formEventId];
+    if (!fs || fs.submitting || fs.submitted || fs.cancelled) return;
+    if (!validate()) return;
+    state.actions.setFormSubmitting(formEventId, true);
+    const currentValues = state.formStates[formEventId]?.values ?? {};
+    if (!threadId) {
+      state.actions.setFormSubmitted(formEventId);
+      return;
+    }
+    try {
+      await client.sendFormResponse({
+        threadId,
+        formEventId,
+        cancelled: false,
+        values: currentValues
+      });
+      store.getState().actions.setFormSubmitted(formEventId);
+    } catch {
+      store.getState().actions.setFormSubmitting(formEventId, false);
+    }
+  }, [formEventId, threadId, validate, client, store]);
+  const cancel = react.useCallback(async () => {
+    const state = store.getState();
+    const fs = state.formStates[formEventId];
+    if (!fs || fs.submitting || fs.submitted || fs.cancelled) return;
+    state.actions.setFormSubmitting(formEventId, true);
+    if (!threadId) {
+      state.actions.setFormCancelled(formEventId);
+      return;
+    }
+    try {
+      await client.sendFormResponse({
+        threadId,
+        formEventId,
+        cancelled: true,
+        values: {}
+      });
+      store.getState().actions.setFormCancelled(formEventId);
+    } catch {
+      store.getState().actions.setFormSubmitting(formEventId, false);
+    }
+  }, [formEventId, threadId, client, store]);
+  return {
+    values,
+    errors,
+    setValue,
+    validate,
+    submit,
+    cancel,
+    isSubmitting,
+    isSubmitted,
+    isCancelled,
+    isDisabled
+  };
+}
+function isEmptyValue(element, val) {
+  if (val == null) return true;
+  if (typeof val === "string" && val.trim() === "") return true;
+  if (element.type === "checkbox_input" && Array.isArray(val) && val.length === 0) return true;
+  return false;
+}
+function useFormFileUpload() {
+  const [isUploading, setIsUploading] = react.useState(false);
+  const [error, setError] = react.useState(null);
+  const upload = react.useCallback(
+    async (params) => {
+      setIsUploading(true);
+      setError(null);
+      try {
+        const formData = new FormData();
+        formData.append("file", params.file);
+        formData.append("field_id", params.fieldId);
+        formData.append("agent_id", params.agentId);
+        formData.append("run_id", params.runId);
+        formData.append("thread_id", params.threadId);
+        const response = await fetch(params.uploadUrl, {
+          method: "POST",
+          body: formData
+        });
+        if (!response.ok) {
+          const detail = await response.text().catch(() => "");
+          throw new Error(detail || `Upload failed (${response.status})`);
+        }
+        return await response.json();
+      } catch (err) {
+        const message = err instanceof Error ? err.message : "Upload failed";
+        setError(message);
+        throw err;
+      } finally {
+        setIsUploading(false);
+      }
+    },
+    []
+  );
+  const clearError = react.useCallback(() => setError(null), []);
+  return { upload, isUploading, error, clearError };
+}
 function useMessage() {
   const { client } = useWorkerContext();
   const send = react.useCallback(
@@ -1148,7 +1474,7 @@ function useThreadDetails(threadId) {
 function useThreadEvents(threadId) {
   const { client } = useWorkerContext();
   const hasOlderEvents = useStore(
-    (s) => threadId ? s.eventPagination[threadId]?.hasMore ?? true : false
+    (s) => threadId ? s.eventPagination[threadId]?.hasMore ?? false : false
   );
   const loadOlderEvents = react.useCallback(
     (limit) => {
@@ -1203,10 +1529,15 @@ function useUpload() {
 
 exports.WorkerProvider = WorkerProvider;
 exports.isSettingsFieldGroup = isSettingsFieldGroup;
+exports.toFormElement = toFormElement;
+exports.toFormEventData = toFormEventData;
+exports.toFormResponseEventData = toFormResponseEventData;
 exports.useAnalytics = useAnalytics;
 exports.useAudioRecorder = useAudioRecorder;
 exports.useConnection = useConnection;
 exports.useFeedback = useFeedback;
+exports.useForm = useForm;
+exports.useFormFileUpload = useFormFileUpload;
 exports.useMessage = useMessage;
 exports.useSettings = useSettings;
 exports.useThreadDetails = useThreadDetails;