@firstflow/react 0.0.1 → 0.0.101

package/dist/internal.js

@@ -0,0 +1,915 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/internal.ts
+var internal_exports = {};
+__export(internal_exports, {
+  FEEDBACK_SUBMITTED: () => FEEDBACK_SUBMITTED,
+  ISSUE_SUBMITTED: () => ISSUE_SUBMITTED,
+  Issue: () => issue_exports,
+  IssueReporter: () => IssueReporter,
+  IssueReporterProvider: () => IssueReporterProvider,
+  createIssueReporter: () => createIssueReporter,
+  useFirstflowFeedback: () => useFirstflowFeedback,
+  useFirstflowIssueForm: () => useFirstflowIssueForm,
+  useFirstflowIssueReporter: () => useFirstflowIssueReporter,
+  useIssueReporterContext: () => useIssueReporterContext
+});
+module.exports = __toCommonJS(internal_exports);
+
+// src/analytics/events.ts
+var ISSUE_SUBMITTED = "issue_submitted";
+var FEEDBACK_SUBMITTED = "feedback_submitted";
+
+// src/feedback/hooks/useFirstflowFeedback.ts
+var import_react5 = require("react");
+
+// src/platform/FirstflowContext.tsx
+var import_react4 = require("react");
+
+// src/analytics/identity.ts
+var ANON_KEY = "__ff_anon_id";
+var SESSION_KEY = "ff_sess";
+function uuid() {
+  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
+    const r = Math.random() * 16 | 0;
+    return (c === "x" ? r : r & 3 | 8).toString(16);
+  });
+}
+function getStorage(key, storage) {
+  if (typeof window === "undefined" || !storage) return uuid();
+  try {
+    let value = storage.getItem(key);
+    if (!value) {
+      value = uuid();
+      storage.setItem(key, value);
+    }
+    return value;
+  } catch {
+    return uuid();
+  }
+}
+function getAnonymousId() {
+  return getStorage(ANON_KEY, typeof window !== "undefined" ? window.localStorage : null);
+}
+function getSessionId() {
+  return getStorage(SESSION_KEY, typeof window !== "undefined" ? window.sessionStorage : null);
+}
+
+// src/analytics/device.ts
+function getDeviceType() {
+  if (typeof window === "undefined") return "desktop";
+  const w = window.innerWidth;
+  if (w <= 768) return "mobile";
+  if (w <= 1024) return "tablet";
+  return "desktop";
+}
+
+// src/analytics/jitsu.ts
+var DEFAULT_JITSU_HOST = "https://cmmiyu46c00003b6unusxjf0j.analytics.firstflow.dev";
+var DEFAULT_JITSU_KEY = "P5qcd1d4Bd98EdxS4EfnucLohE2Ch37K:U4OECTXofJVzR5jhjaCpaYj478871PFU";
+function uuid2() {
+  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
+    const r = Math.random() * 16 | 0;
+    return (c === "x" ? r : r & 3 | 8).toString(16);
+  });
+}
+var RESERVED_KEYS = /* @__PURE__ */ new Set([
+  "anonymousId",
+  "agent_id",
+  "session_id",
+  "device_type",
+  "user_id",
+  "userId"
+]);
+function sanitizeTraits(traits) {
+  if (!traits) return {};
+  const out = {};
+  for (const [key, value] of Object.entries(traits)) {
+    if (RESERVED_KEYS.has(key)) continue;
+    out[key] = value;
+  }
+  return out;
+}
+function coerceTraitValueToString(value) {
+  if (value === null || value === void 0) return null;
+  if (typeof value === "string") return value;
+  if (typeof value === "number" && Number.isFinite(value)) return String(value);
+  if (typeof value === "boolean") return String(value);
+  try {
+    return JSON.stringify(value);
+  } catch {
+    return String(value);
+  }
+}
+function traitsRecordToStringMap(traits) {
+  const out = {};
+  for (const [k, v] of Object.entries(traits)) {
+    const s = coerceTraitValueToString(v);
+    if (s !== null) out[k] = s;
+  }
+  return Object.keys(out).length > 0 ? out : void 0;
+}
+function buildTraitsStringMap(config) {
+  const merged = { ...sanitizeTraits(config.traits) };
+  const uid = config.userId?.trim();
+  if (uid) merged.user_id = uid;
+  return traitsRecordToStringMap(merged);
+}
+function buildJitsuTrackPayload(config, event, properties = {}) {
+  const traits = buildTraitsStringMap(config);
+  const payload = {
+    messageId: uuid2(),
+    type: "track",
+    event,
+    anonymousId: getAnonymousId(),
+    ...config.userId ? { userId: config.userId } : {},
+    timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+    properties: {
+      agent_id: config.agentId,
+      session_id: getSessionId(),
+      device_type: getDeviceType(),
+      ...properties
+    }
+  };
+  if (traits) payload.traits = traits;
+  return payload;
+}
+function sendTrack(config, event, properties = {}) {
+  const host = config.jitsuHost || DEFAULT_JITSU_HOST;
+  const key = config.jitsuWriteKey || DEFAULT_JITSU_KEY;
+  const payload = buildJitsuTrackPayload(config, event, properties);
+  const auth = "Basic " + btoa(key);
+  fetch(`${host.replace(/\/$/, "")}/api/s/track`, {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+      Authorization: auth
+    },
+    body: JSON.stringify(payload),
+    keepalive: true
+  }).catch(() => {
+  });
+}
+
+// src/analytics/analytics.ts
+var DEFAULT_JITSU_HOST2 = "https://cmmiyu46c00003b6unusxjf0j.analytics.firstflow.dev";
+var DEFAULT_JITSU_KEY2 = "P5qcd1d4Bd98EdxS4EfnucLohE2Ch37K:U4OECTXofJVzR5jhjaCpaYj478871PFU";
+function createAnalytics(config) {
+  const agentId = config.agentId;
+  const jitsuHost = config.jitsuHost ?? DEFAULT_JITSU_HOST2;
+  const jitsuWriteKey = config.jitsuWriteKey ?? DEFAULT_JITSU_KEY2;
+  const identity = {
+    userId: config.userId,
+    traits: config.traits ?? {}
+  };
+  function transportConfig() {
+    return {
+      jitsuHost,
+      jitsuWriteKey,
+      agentId,
+      userId: identity.userId,
+      traits: identity.traits
+    };
+  }
+  return {
+    track(eventName, properties = {}) {
+      sendTrack(transportConfig(), eventName, properties);
+    },
+    identify(userId, traits = {}) {
+      this.setUser(userId, traits);
+      if (!userId) return;
+      sendTrack(transportConfig(), "user_identified", {});
+    },
+    page(name, properties = {}) {
+      sendTrack(transportConfig(), "page_view", { page_name: name ?? void 0, ...properties });
+    },
+    setUser(userId, traits = {}) {
+      identity.userId = userId || void 0;
+      identity.traits = { ...traits ?? {} };
+    },
+    getUser() {
+      return {
+        userId: identity.userId,
+        traits: { ...identity.traits ?? {} }
+      };
+    }
+  };
+}
+
+// src/issue/defaults.ts
+var DEFAULT_PROMPT_TEXT = "Something wrong? Report an issue and we'll look into it.";
+var DEFAULT_ISSUE_TITLE = "Report an issue";
+var DEFAULT_ISSUE_TRIGGER_LABEL = "Report issue";
+var DEFAULT_ISSUE_SUBMIT_LABEL = "Submit";
+var DEFAULT_ISSUE_CANCEL_LABEL = "Cancel";
+var DEFAULT_ISSUE_CANCEL_ENABLED = true;
+var DEFAULT_FIELDS = [
+  { id: "name", label: "Name", type: "text", required: true },
+  { id: "email", label: "Email", type: "text", required: true },
+  { id: "subject", label: "Subject", type: "text", required: true },
+  { id: "description", label: "Description", type: "textarea", required: true },
+  { id: "session_id", label: "Session ID", type: "text", required: false }
+];
+
+// src/issue/normalizer.ts
+function normalizeField(raw) {
+  const id = raw.id?.trim();
+  if (!id) return null;
+  if (raw.allowed === false) return null;
+  const type = raw.type === "textarea" || raw.type === "select" ? raw.type : "text";
+  return {
+    id,
+    type,
+    label: raw.label?.trim() ?? id,
+    required: raw.required === true,
+    options: type === "select" && Array.isArray(raw.options) ? raw.options : void 0
+  };
+}
+function normalizeConfig(agentId, apiUrl, raw) {
+  const enabled = raw?.enabled === true;
+  const title = typeof raw?.title === "string" && raw.title.trim() ? raw.title.trim() : DEFAULT_ISSUE_TITLE;
+  const triggerLabel = typeof raw?.triggerLabel === "string" && raw.triggerLabel.trim() ? raw.triggerLabel.trim() : DEFAULT_ISSUE_TRIGGER_LABEL;
+  const submitLabel = typeof raw?.submitLabel === "string" && raw.submitLabel.trim() ? raw.submitLabel.trim() : DEFAULT_ISSUE_SUBMIT_LABEL;
+  const cancelLabel = typeof raw?.cancelLabel === "string" && raw.cancelLabel.trim() ? raw.cancelLabel.trim() : DEFAULT_ISSUE_CANCEL_LABEL;
+  const cancelEnabled = typeof raw?.cancelEnabled === "boolean" ? raw.cancelEnabled : DEFAULT_ISSUE_CANCEL_ENABLED;
+  const promptText = typeof raw?.promptText === "string" && raw.promptText.trim() ? raw.promptText.trim() : DEFAULT_PROMPT_TEXT;
+  let fields = DEFAULT_FIELDS;
+  if (Array.isArray(raw?.fields) && raw.fields.length > 0) {
+    const normalized = raw.fields.map(normalizeField).filter((f) => f !== null);
+    if (normalized.length > 0) fields = normalized;
+  }
+  return {
+    agentId,
+    apiUrl: apiUrl.replace(/\/$/, ""),
+    enabled,
+    title,
+    triggerLabel,
+    submitLabel,
+    cancelLabel,
+    cancelEnabled,
+    promptText,
+    fields
+  };
+}
+
+// src/issue/validate.ts
+var CONTEXT_KEYS = /* @__PURE__ */ new Set([
+  "conversationId",
+  "messageId",
+  "sessionId",
+  "agentId",
+  "model"
+]);
+function isContextKey(key) {
+  return CONTEXT_KEYS.has(key);
+}
+function validatePayload(data, fields) {
+  const errors = {};
+  const fieldIds = new Set(fields.map((f) => f.id));
+  for (const field of fields) {
+    const value = data[field.id];
+    const str = typeof value === "string" ? value.trim() : "";
+    if (field.required && !str) {
+      errors[field.id] = `${field.label ?? field.id} is required`;
+      continue;
+    }
+    if (!field.required && !str) continue;
+    if (field.type === "select" && field.options?.length) {
+      if (!field.options.includes(str)) {
+        errors[field.id] = `Please choose a valid option`;
+      }
+    }
+  }
+  return {
+    valid: Object.keys(errors).length === 0,
+    errors: Object.keys(errors).length > 0 ? errors : void 0
+  };
+}
+function getFormFieldsOnly(data, fields) {
+  const fieldIds = new Set(fields.map((f) => f.id));
+  const out = {};
+  for (const key of Object.keys(data)) {
+    if (isContextKey(key)) continue;
+    if (fieldIds.has(key)) out[key] = data[key];
+  }
+  return out;
+}
+
+// src/issue/IssueReporter.ts
+function extractContextMetadata(data, formFieldIds) {
+  const ctx = {};
+  for (const key of Object.keys(data)) {
+    if (formFieldIds.has(key)) continue;
+    const v = data[key];
+    if (v !== void 0) ctx[key] = v;
+  }
+  return ctx;
+}
+function buildPayload(formValues, contextMetadata) {
+  return { ...formValues, ...contextMetadata };
+}
+function createIssueReporter(options) {
+  const { agentId, apiUrl, config: rawConfig, analytics: analyticsOpt } = options;
+  const analytics = analyticsOpt ?? createAnalytics({ agentId });
+  let config = normalizeConfig(agentId, apiUrl, rawConfig);
+  let openHandler;
+  const instance = {
+    getConfig() {
+      return config;
+    },
+    setConfig(next) {
+      config = next;
+    },
+    async reportIssue(data) {
+      const formValues = getFormFieldsOnly(
+        data,
+        config.fields
+      );
+      const result = validatePayload(formValues, config.fields);
+      if (!result.valid) {
+        throw new Error(
+          result.errors ? Object.entries(result.errors).map(([k, v]) => `${k}: ${v}`).join(", ") : "Validation failed"
+        );
+      }
+      const formFieldIds = new Set(config.fields.map((f) => f.id));
+      const contextMetadata = extractContextMetadata(data, formFieldIds);
+      const payload = buildPayload(formValues, contextMetadata);
+      analytics.track(ISSUE_SUBMITTED, {
+        payload: JSON.stringify(payload),
+        metadata: JSON.stringify({})
+      });
+    },
+    open(options2) {
+      openHandler?.(options2);
+    },
+    setOpenHandler(handler) {
+      openHandler = handler;
+    },
+    destroy() {
+      openHandler = void 0;
+    }
+  };
+  return instance;
+}
+
+// src/issue/IssueReporterContext.tsx
+var import_react3 = require("react");
+
+// src/components/IssueForm.tsx
+var import_react2 = require("react");
+
+// src/issue/hooks/useFirstflowIssueForm.ts
+var import_react = require("react");
+function emptyValues(fields) {
+  const init = {};
+  fields.forEach((f) => {
+    init[f.id] = "";
+  });
+  return init;
+}
+function useFirstflowIssueForm() {
+  const { reporter, openOptionsRef } = useIssueReporterContext();
+  const config = reporter.getConfig();
+  const fields = config.fields;
+  const [values, setValuesState] = (0, import_react.useState)(() => emptyValues(fields));
+  const [errors, setErrors] = (0, import_react.useState)({});
+  const [submitting, setSubmitting] = (0, import_react.useState)(false);
+  const [submitted, setSubmitted] = (0, import_react.useState)(false);
+  const [submitError, setSubmitError] = (0, import_react.useState)(null);
+  const fieldsKey = fields.map((f) => f.id).join("\0");
+  (0, import_react.useEffect)(() => {
+    setValuesState(emptyValues(fields));
+    setErrors({});
+    setSubmitted(false);
+    setSubmitError(null);
+  }, [fieldsKey, reporter]);
+  const setValue = (0, import_react.useCallback)((fieldId, value) => {
+    setValuesState((prev) => ({ ...prev, [fieldId]: value }));
+    setErrors((prev) => prev[fieldId] ? { ...prev, [fieldId]: "" } : prev);
+  }, []);
+  const setValues = (0, import_react.useCallback)((next) => {
+    setValuesState(next);
+  }, []);
+  const validate = (0, import_react.useCallback)(() => {
+    const result = validatePayload(
+      values,
+      fields
+    );
+    if (!result.valid) {
+      setErrors(result.errors ?? {});
+      return false;
+    }
+    setErrors({});
+    return true;
+  }, [values, fields]);
+  const submit = (0, import_react.useCallback)(async () => {
+    if (!validate()) return;
+    setSubmitting(true);
+    setSubmitError(null);
+    const context = openOptionsRef.current ?? {};
+    try {
+      await reporter.reportIssue({ ...values, ...context });
+      setSubmitted(true);
+    } catch (e) {
+      const msg = e instanceof Error ? e.message : String(e);
+      setSubmitError(msg);
+      throw e;
+    } finally {
+      setSubmitting(false);
+    }
+  }, [validate, values, reporter, openOptionsRef]);
+  const reset = (0, import_react.useCallback)(() => {
+    setValuesState(emptyValues(fields));
+    setErrors({});
+    setSubmitted(false);
+    setSubmitError(null);
+  }, [fields]);
+  const clearSubmitError = (0, import_react.useCallback)(() => setSubmitError(null), []);
+  return {
+    values,
+    setValue,
+    setValues,
+    errors,
+    submitting,
+    submitted,
+    submitError,
+    validate,
+    submit,
+    reset,
+    clearSubmitError,
+    isEnabled: config.enabled,
+    config,
+    title: config.title,
+    triggerLabel: config.triggerLabel,
+    submitLabel: config.submitLabel,
+    cancelLabel: config.cancelLabel,
+    cancelEnabled: config.cancelEnabled,
+    uiText: {
+      title: config.title,
+      triggerLabel: config.triggerLabel,
+      submitLabel: config.submitLabel,
+      cancelLabel: config.cancelLabel,
+      cancelEnabled: config.cancelEnabled,
+      promptText: config.promptText
+    },
+    fields,
+    promptText: config.promptText
+  };
+}
+
+// #style-inject:#style-inject
+function styleInject(css, { insertAt } = {}) {
+  if (!css || typeof document === "undefined") return;
+  const head = document.head || document.getElementsByTagName("head")[0];
+  const style = document.createElement("style");
+  style.type = "text/css";
+  if (insertAt === "top") {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
+// src/components/IssueForm.css
+styleInject(".ffIssueBackdrop {\n  position: fixed;\n  inset: 0;\n  background: rgba(0, 0, 0, 0.5);\n  display: grid;\n  place-items: center;\n  z-index: 1000;\n}\n.ffIssuePanel {\n  width: min(560px, calc(100vw - 24px));\n  border-radius: 14px;\n  background: #fff;\n  border: 1px solid #e6e6e6;\n  padding: 16px;\n  color: #121212;\n}\n.ffIssueTitle {\n  margin: 0 0 8px;\n  font-size: 18px;\n}\n.ffIssuePrompt {\n  margin: 0 0 12px;\n  font-size: 14px;\n  color: #525252;\n}\n.ffIssueField {\n  margin-bottom: 10px;\n}\n.ffIssueLabel {\n  display: block;\n  font-size: 12px;\n  margin-bottom: 4px;\n  color: #3f3f3f;\n}\n.ffIssueInput,\n.ffIssueTextarea,\n.ffIssueSelect {\n  width: 100%;\n  border: 1px solid #d4d4d4;\n  border-radius: 8px;\n  padding: 8px 10px;\n  font-size: 14px;\n}\n.ffIssueTextarea {\n  min-height: 84px;\n  resize: vertical;\n}\n.ffIssueErrorText {\n  margin-top: 4px;\n  font-size: 12px;\n  color: #b91c1c;\n}\n.ffIssueActions {\n  margin-top: 12px;\n  display: flex;\n  justify-content: flex-end;\n  gap: 8px;\n}\n.ffIssueButton {\n  border-radius: 8px;\n  border: 1px solid #d4d4d4;\n  padding: 8px 12px;\n  background: #fff;\n  color: #111;\n  cursor: pointer;\n}\n.ffIssuePrimary {\n  background: #111;\n  color: #fff;\n  border-color: #111;\n}\n.ffIssueStatusError {\n  margin-top: 8px;\n  font-size: 12px;\n  color: #b91c1c;\n}\n.ffIssueStatusSuccess {\n  margin-top: 8px;\n  font-size: 12px;\n  color: #166534;\n}\n");
+
+// src/components/IssueForm.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var styles = {
+  backdrop: "ffIssueBackdrop",
+  panel: "ffIssuePanel",
+  title: "ffIssueTitle",
+  prompt: "ffIssuePrompt",
+  field: "ffIssueField",
+  label: "ffIssueLabel",
+  input: "ffIssueInput",
+  textarea: "ffIssueTextarea",
+  select: "ffIssueSelect",
+  errorText: "ffIssueErrorText",
+  actions: "ffIssueActions",
+  button: "ffIssueButton",
+  primary: "ffIssuePrimary",
+  statusError: "ffIssueStatusError",
+  statusSuccess: "ffIssueStatusSuccess"
+};
+function renderField(field, value, error, onChange) {
+  if (field.type === "textarea") {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "textarea",
+        {
+          className: styles.textarea,
+          value,
+          onChange: (event) => onChange(field.id, event.target.value)
+        }
+      ),
+      error ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.errorText, children: error }) : null
+    ] });
+  }
+  if (field.type === "select") {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        "select",
+        {
+          className: styles.select,
+          value,
+          onChange: (event) => onChange(field.id, event.target.value),
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "", children: "Select an option" }),
+            (field.options ?? []).map((option) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: option, children: option }, `${field.id}:${option}`))
+          ]
+        }
+      ),
+      error ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.errorText, children: error }) : null
+    ] });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "input",
+      {
+        className: styles.input,
+        value,
+        onChange: (event) => onChange(field.id, event.target.value)
+      }
+    ),
+    error ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.errorText, children: error }) : null
+  ] });
+}
+function IssueReporter({ showTrigger = true }) {
+  const { isModalOpen, openModal, closeModal } = useIssueReporterContext();
+  const {
+    fields,
+    values,
+    errors,
+    setValue,
+    submit,
+    submitting,
+    submitted,
+    submitError,
+    clearSubmitError,
+    reset,
+    title,
+    promptText,
+    triggerLabel,
+    submitLabel,
+    cancelLabel,
+    cancelEnabled,
+    isEnabled
+  } = useFirstflowIssueForm();
+  (0, import_react2.useEffect)(() => {
+    if (!isModalOpen) {
+      reset();
+      clearSubmitError();
+    }
+  }, [isModalOpen, reset, clearSubmitError]);
+  if (!isEnabled) return null;
+  const handleSubmit = async (event) => {
+    event.preventDefault();
+    await submit();
+  };
+  const body = isModalOpen ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.backdrop, role: "presentation", onClick: closeModal, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "section",
+    {
+      className: styles.panel,
+      role: "dialog",
+      "aria-modal": "true",
+      "aria-label": title,
+      onClick: (event) => event.stopPropagation(),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: styles.title, children: title }),
+        promptText ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: styles.prompt, children: promptText }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("form", { onSubmit: handleSubmit, children: [
+          fields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.field, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("label", { className: styles.label, htmlFor: `ff-issue-${field.id}`, children: field.label }),
+            renderField(
+              field,
+              values[field.id] ?? "",
+              errors[field.id],
+              (fieldId, next) => setValue(fieldId, next)
+            )
+          ] }, field.id)),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.actions, children: [
+            cancelEnabled ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", className: styles.button, onClick: closeModal, children: cancelLabel }) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "button",
+              {
+                type: "submit",
+                className: `${styles.button} ${styles.primary}`,
+                disabled: submitting,
+                children: submitting ? "Submitting..." : submitLabel
+              }
+            )
+          ] }),
+          submitError ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.statusError, children: submitError }) : null,
+          submitted ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.statusSuccess, children: "Thanks for your report." }) : null
+        ] })
+      ]
+    }
+  ) }) : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    showTrigger ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", className: styles.button, onClick: () => openModal(), children: triggerLabel }) : null,
+    body
+  ] });
+}
+
+// src/issue/IssueReporterContext.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var IssueReporterContext = (0, import_react3.createContext)(
+  null
+);
+function IssueReporterProvider({
+  reporter,
+  children
+}) {
+  const [isModalOpen, setIsModalOpen] = (0, import_react3.useState)(false);
+  const openOptionsRef = (0, import_react3.useRef)(void 0);
+  const openModal = (0, import_react3.useCallback)((options) => {
+    openOptionsRef.current = options;
+    setIsModalOpen(true);
+  }, []);
+  const closeModal = (0, import_react3.useCallback)(() => {
+    setIsModalOpen(false);
+    openOptionsRef.current = void 0;
+  }, []);
+  (0, import_react3.useEffect)(() => {
+    reporter.setOpenHandler(openModal);
+    return () => {
+      reporter.setOpenHandler(void 0);
+    };
+  }, [reporter, openModal]);
+  const value = {
+    reporter,
+    isModalOpen,
+    openModal,
+    closeModal,
+    openOptionsRef
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(IssueReporterContext.Provider, { value, children: [
+    children,
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(IssueReporter, { showTrigger: false })
+  ] });
+}
+function useIssueReporterContext() {
+  const ctx = (0, import_react3.useContext)(IssueReporterContext);
+  if (ctx == null) {
+    throw new Error(
+      "useIssueReporterContext must be used within IssueReporterProvider"
+    );
+  }
+  return ctx;
+}
+
+// src/platform/FirstflowContext.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var FirstflowContext = (0, import_react4.createContext)(null);
+function useFirstflow() {
+  const ctx = (0, import_react4.useContext)(FirstflowContext);
+  if (ctx == null) {
+    throw new Error("useFirstflow must be used within FirstflowProvider");
+  }
+  return ctx;
+}
+
+// src/feedback/hooks/useFirstflowFeedback.ts
+function storageKey(agentId, messageId) {
+  return `ff_feedback_${agentId}_${messageId}`;
+}
+function isMessageScope(o) {
+  return o != null && typeof o.conversationId === "string" && typeof o.messageId === "string" && typeof o.messagePreview === "string";
+}
+function useFirstflowFeedback(options) {
+  const firstflow = useFirstflow();
+  const scoped = isMessageScope(options);
+  const [rating, setRatingState] = (0, import_react5.useState)(null);
+  const [selectedTags, setSelectedTags] = (0, import_react5.useState)([]);
+  const [comment, setCommentState] = (0, import_react5.useState)("");
+  const [submitting, setSubmitting] = (0, import_react5.useState)(false);
+  const [error, setError] = (0, import_react5.useState)(null);
+  const [submitted, setSubmitted] = (0, import_react5.useState)(false);
+  const isEnabled = firstflow.feedback.isEnabled();
+  const config = isEnabled ? firstflow.feedback.getConfig() : null;
+  const sideConfig = (0, import_react5.useMemo)(() => {
+    if (!scoped || !config || !rating) return null;
+    return rating === "like" ? config.like : config.dislike;
+  }, [scoped, config, rating]);
+  const ratingRef = (0, import_react5.useRef)(rating);
+  ratingRef.current = rating;
+  const conversationId = scoped ? options.conversationId : "";
+  const messageId = scoped ? options.messageId : "";
+  const messagePreview = scoped ? options.messagePreview : "";
+  const metadata = scoped ? options.metadata : void 0;
+  (0, import_react5.useEffect)(() => {
+    if (!scoped) return;
+    setRatingState(null);
+    setSelectedTags([]);
+    setCommentState("");
+    setError(null);
+    setSubmitted(false);
+    if (!isEnabled) return;
+    try {
+      const raw = localStorage.getItem(storageKey(firstflow.agentId, messageId));
+      if (!raw) return;
+      const parsed = JSON.parse(raw);
+      if (parsed.rating === "like" || parsed.rating === "dislike") {
+        setRatingState(parsed.rating);
+        setSelectedTags(Array.isArray(parsed.tags) ? parsed.tags : []);
+        setCommentState(typeof parsed.comment === "string" ? parsed.comment : "");
+      }
+    } catch {
+    }
+  }, [scoped, firstflow.agentId, isEnabled, messageId]);
+  const setRating = (0, import_react5.useCallback)(
+    (r) => {
+      if (!scoped) return;
+      if (r !== ratingRef.current) {
+        setSelectedTags([]);
+        setCommentState("");
+      }
+      setRatingState(r);
+      setError(null);
+      setSubmitted(false);
+      if (!isEnabled) return;
+      const cfg = firstflow.feedback.getConfig();
+      const sideCfg = r === "like" ? cfg.like : cfg.dislike;
+      if (sideCfg.showTags || sideCfg.showComment) return;
+      setSubmitting(true);
+      const autoPayload = {
+        conversationId,
+        messageId,
+        rating: r,
+        showTags: false,
+        showComment: false,
+        messagePreview: messagePreview.slice(0, 2e3),
+        metadata
+      };
+      void firstflow.feedback.submit(autoPayload).then(() => {
+        try {
+          localStorage.setItem(
+            storageKey(firstflow.agentId, messageId),
+            JSON.stringify({ rating: r, tags: [], comment: "" })
+          );
+        } catch {
+        }
+        setSubmitted(true);
+      }).catch((e) => {
+        setError(e instanceof Error ? e.message : "Failed to send feedback");
+      }).finally(() => {
+        setSubmitting(false);
+      });
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [scoped, isEnabled, firstflow, conversationId, messageId, messagePreview, metadata]
+  );
+  const toggleTag = (0, import_react5.useCallback)(
+    (tag) => {
+      if (!scoped) return;
+      setSelectedTags((prev) => prev.includes(tag) ? prev.filter((t) => t !== tag) : [...prev, tag]);
+      setError(null);
+    },
+    [scoped]
+  );
+  const setComment = (0, import_react5.useCallback)(
+    (c) => {
+      if (!scoped) return;
+      setCommentState(c);
+    },
+    [scoped]
+  );
+  const clearError = (0, import_react5.useCallback)(() => setError(null), []);
+  const submit = (0, import_react5.useCallback)(async () => {
+    if (!scoped || !isEnabled || !rating) return;
+    setSubmitting(true);
+    setError(null);
+    const cfg = firstflow.feedback.getConfig();
+    const sideCfg = rating === "like" ? cfg.like : cfg.dislike;
+    const showTags = sideCfg.showTags === true;
+    const showComment = sideCfg.showComment === true;
+    const payload = {
+      conversationId,
+      messageId,
+      rating,
+      showTags,
+      showComment,
+      tags: showTags && selectedTags.length ? [...new Set(selectedTags)] : void 0,
+      comment: showComment && comment.trim() ? comment.trim() : void 0,
+      messagePreview: messagePreview.slice(0, 2e3),
+      metadata
+    };
+    try {
+      await firstflow.feedback.submit(payload);
+      try {
+        localStorage.setItem(
+          storageKey(firstflow.agentId, messageId),
+          JSON.stringify({ rating, tags: selectedTags, comment })
+        );
+      } catch {
+      }
+      setSubmitted(true);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Failed to send feedback");
+    } finally {
+      setSubmitting(false);
+    }
+  }, [
+    scoped,
+    isEnabled,
+    rating,
+    conversationId,
+    messageId,
+    messagePreview,
+    metadata,
+    selectedTags,
+    comment,
+    firstflow,
+    isEnabled
+  ]);
+  if (!scoped) {
+    return firstflow.feedback;
+  }
+  return {
+    rating,
+    selectedTags,
+    comment,
+    submitting,
+    submitted,
+    error,
+    setRating,
+    toggleTag,
+    setComment,
+    submit,
+    clearError,
+    isEnabled,
+    config,
+    sideConfig
+  };
+}
+
+// src/issue/hooks/useFirstflowIssueReporter.ts
+var import_react6 = require("react");
+function useFirstflowIssueReporter() {
+  const { reporter, isModalOpen, openModal, closeModal } = useIssueReporterContext();
+  const open = (0, import_react6.useCallback)(
+    (options) => {
+      openModal(options);
+    },
+    [openModal]
+  );
+  const reportIssue = (0, import_react6.useCallback)(
+    async (data) => {
+      await reporter.reportIssue(data);
+    },
+    [reporter]
+  );
+  const submit = reportIssue;
+  return {
+    reporter,
+    open,
+    reportIssue,
+    submit,
+    config: reporter.getConfig(),
+    isModalOpen,
+    closeModal
+  };
+}
+
+// src/issue/issue.ts
+var issue_exports = {};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  FEEDBACK_SUBMITTED,
+  ISSUE_SUBMITTED,
+  Issue,
+  IssueReporter,
+  IssueReporterProvider,
+  createIssueReporter,
+  useFirstflowFeedback,
+  useFirstflowIssueForm,
+  useFirstflowIssueReporter,
+  useIssueReporterContext
+});