@vinaverse/react-native 0.0.0-stage → 0.1.0-alpha.11

package/dist/chunk-KSHDF3MG.js

@@ -0,0 +1,1996 @@
+import { useTheme, useReducedMotion, announce } from './chunk-EFEXTVIT.js';
+import { useContext, memo, useState, useMemo, useRef, useCallback, useEffect, createContext } from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { Pressable, ActivityIndicator, Text, View, Image, Linking, TextInput, useWindowDimensions } from 'react-native';
+import { useCopy, formatMoney, formatTimeRange, formatDayTime, useConversationSelector, formatDate, useStreamingText } from '@vinaverse/react';
+import { answerProblem, codePoints } from '@vinaverse/client/conversation';
+import { readCard } from '@vinaverse/client/agent';
+import { FlashList } from '@shopify/flash-list';
+import { contrastRatio, colors, size } from '@vinaverse/tokens';
+
+var ChatContext = /* @__PURE__ */ createContext(
+  null
+);
+function ChatContextProvider(props) {
+  return /* @__PURE__ */ jsx(ChatContext.Provider, { value: props.value, children: props.children });
+}
+function useChat() {
+  const value = useContext(ChatContext);
+  if (!value)
+    throw new Error(
+      "Vinaverse parts render inside <VinaverseChat> or <VinaverseChatProvider>."
+    );
+  return value;
+}
+var Button = /* @__PURE__ */ memo(function Button2(props) {
+  const { colors, radius, space, size: size2, font } = useTheme();
+  const variant = props.variant ?? "secondary";
+  const inactive = props.disabled === true || props.busy === true;
+  const filled = variant === "primary" || props.selected === true;
+  const background = filled ? colors.primary : variant === "secondary" ? colors.surface : "transparent";
+  const foreground = filled ? colors.onPrimary : colors.primary;
+  const checkable = props.role === "radio" || props.role === "checkbox";
+  return /* @__PURE__ */ jsxs(
+    Pressable,
+    {
+      accessibilityRole: props.role ?? "button",
+      accessibilityLabel: props.label,
+      ...props.hint ? { accessibilityHint: props.hint } : {},
+      accessibilityState: {
+        disabled: inactive,
+        busy: props.busy === true,
+        ...checkable ? props.role === "radio" ? { selected: props.selected === true } : { checked: props.selected === true } : {}
+      },
+      disabled: inactive,
+      onPress: props.onPress,
+      ...props.testID ? { testID: props.testID } : {},
+      style: ({ pressed }) => ({
+        minHeight: size2.touchTarget,
+        minWidth: size2.touchTarget,
+        paddingHorizontal: space.md,
+        paddingVertical: space.sm,
+        borderRadius: radius.md,
+        borderWidth: variant === "text" ? 0 : 1,
+        borderColor: filled ? colors.primary : colors.border,
+        backgroundColor: background,
+        opacity: inactive ? 0.55 : pressed ? 0.8 : 1,
+        alignItems: "center",
+        justifyContent: "center",
+        flexDirection: "row",
+        gap: space.xs
+      }),
+      children: [
+        props.busy ? /* @__PURE__ */ jsx(ActivityIndicator, { color: foreground }) : null,
+        props.children ?? /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              color: foreground,
+              fontSize: font.size.md,
+              fontWeight: "500",
+              ...font.family ? { fontFamily: font.family } : {}
+            },
+            children: props.label
+          }
+        )
+      ]
+    }
+  );
+});
+function cardOf(held) {
+  return held.card;
+}
+function CardFrame(props) {
+  const { colors, radius, space } = useTheme();
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      accessibilityLabel: props.label,
+      ...props.restored ? {
+        pointerEvents: "none",
+        accessibilityState: { disabled: true }
+      } : {},
+      ...props.testID ? { testID: props.testID } : {},
+      style: {
+        marginHorizontal: 16,
+        marginTop: space.sm,
+        padding: space.md,
+        gap: space.sm,
+        borderRadius: radius.lg,
+        borderWidth: 1,
+        borderColor: colors.divider,
+        backgroundColor: colors.background,
+        opacity: props.restored ? 0.7 : 1,
+        maxWidth: 520,
+        alignSelf: "stretch"
+      },
+      children: props.children
+    }
+  );
+}
+function Title(props) {
+  const { colors, font } = useTheme();
+  return /* @__PURE__ */ jsx(
+    Text,
+    {
+      accessibilityRole: "header",
+      numberOfLines: props.numberOfLines,
+      style: {
+        color: colors.text,
+        fontSize: font.size.md,
+        fontWeight: "600",
+        ...font.family ? { fontFamily: font.family } : {}
+      },
+      children: props.children
+    }
+  );
+}
+function Body(props) {
+  const { colors, font } = useTheme();
+  return /* @__PURE__ */ jsx(
+    Text,
+    {
+      style: {
+        color: props.danger ? colors.danger : props.muted ? colors.textMuted : colors.text,
+        fontSize: props.muted ? font.size.sm : font.size.md,
+        lineHeight: (props.muted ? font.size.sm : font.size.md) * font.lineHeight,
+        ...font.family ? { fontFamily: font.family } : {}
+      },
+      children: props.children
+    }
+  );
+}
+function useLink(link, held) {
+  const { store, handlers } = useChat();
+  if (!link || !store.checkLink(link)) return null;
+  return () => handlers.current?.onOpenLink?.(link, held);
+}
+function ratingText(valuePpm, locale) {
+  const value = valuePpm / 1e6;
+  try {
+    return new Intl.NumberFormat(locale, {
+      minimumFractionDigits: 1,
+      maximumFractionDigits: 1
+    }).format(value);
+  } catch {
+    return value.toFixed(1);
+  }
+}
+function allowedImage(url, hosts) {
+  const safe = safeImage(url);
+  if (safe === null || !hosts) return safe;
+  const host = /^https:\/\/([^/:?#]+)/i.exec(safe)?.[1]?.toLowerCase();
+  return host && hosts.some((h) => h.toLowerCase() === host) ? safe : null;
+}
+function safeImage(url) {
+  return url && /^https:\/\//i.test(url) ? url : null;
+}
+function InfoCard(props) {
+  const card = cardOf(props.card);
+  const { locale, t } = useCopy();
+  const { slots, timeZone, handlers } = useChat();
+  const { colors, radius, space, font } = useTheme();
+  const image = safeImage(card.image_url);
+  const Img = slots.Image ?? Image;
+  const money = card.price ?? card.price_from;
+  const rating = card.rating ? ratingText(card.rating.value_ppm, locale) : null;
+  const amount = money ? formatMoney(money.amount, money.currency, locale) : null;
+  const price = amount && !card.price ? t("priceFrom", { price: amount }) : amount;
+  const when = card.starts_at ? formatTimeRange(card.starts_at, void 0, locale, timeZone) : null;
+  const status = typeof card.status === "string" && card.status ? card.status : null;
+  const ref = card.ref;
+  const onOpenTarget = handlers.current?.onOpenTarget;
+  const open = ref && onOpenTarget && !props.restored ? () => onOpenTarget({ type: ref.type, id: ref.id }, props.card) : null;
+  const label = [
+    card.title,
+    card.subtitle,
+    status,
+    rating && `\u2605 ${rating}`,
+    price,
+    when
+  ].filter(Boolean).join(", ");
+  const top = /* @__PURE__ */ jsxs(View, { style: { flexDirection: "row", gap: space.md }, children: [
+    image ? /* @__PURE__ */ jsx(
+      Img,
+      {
+        source: { uri: image },
+        style: {
+          width: 64,
+          height: 64,
+          borderRadius: radius.md,
+          backgroundColor: colors.surface
+        },
+        accessible: false
+      }
+    ) : null,
+    /* @__PURE__ */ jsxs(View, { style: { flex: 1, gap: space.xxs }, children: [
+      /* @__PURE__ */ jsx(Title, { numberOfLines: 2, children: card.title }),
+      card.subtitle ? /* @__PURE__ */ jsx(Body, { muted: true, children: card.subtitle }) : null,
+      /* @__PURE__ */ jsx(Text, { style: { color: colors.textMuted, fontSize: font.size.sm }, children: [
+        rating && `\u2605 ${rating}${card.rating ? ` (${card.rating.count})` : ""}`,
+        price,
+        when
+      ].filter(Boolean).join(" \xB7 ") })
+    ] })
+  ] });
+  return /* @__PURE__ */ jsxs(
+    CardFrame,
+    {
+      label,
+      restored: props.restored,
+      testID: `vinaverse-card-${card.id}`,
+      children: [
+        open ? /* @__PURE__ */ jsx(
+          Pressable,
+          {
+            accessibilityRole: "link",
+            accessibilityLabel: card.title,
+            onPress: open,
+            testID: `vinaverse-open-${card.id}`,
+            children: top
+          }
+        ) : top,
+        card.body ? /* @__PURE__ */ jsx(Body, { children: card.body }) : null,
+        /* @__PURE__ */ jsx(
+          Badges,
+          {
+            badges: status ? [status, ...card.badges ?? []] : card.badges
+          }
+        ),
+        props.restored ? null : /* @__PURE__ */ jsx(CardActions, { ...props })
+      ]
+    }
+  );
+}
+function Badges(props) {
+  const { colors, radius, space, font } = useTheme();
+  if (!props.badges?.length) return null;
+  return /* @__PURE__ */ jsx(View, { style: { flexDirection: "row", flexWrap: "wrap", gap: space.xs }, children: props.badges.map((b) => /* @__PURE__ */ jsx(
+    Text,
+    {
+      style: {
+        color: colors.text,
+        backgroundColor: colors.surface,
+        borderRadius: radius.pill,
+        paddingHorizontal: space.sm,
+        paddingVertical: space.xxs,
+        fontSize: font.size.xs
+      },
+      children: b
+    },
+    b
+  )) });
+}
+function CardActions(props) {
+  const card = cardOf(props.card);
+  const { space } = useTheme();
+  if (!card.actions?.length) return null;
+  return /* @__PURE__ */ jsx(View, { style: { flexDirection: "row", flexWrap: "wrap", gap: space.sm }, children: card.actions.map((a) => /* @__PURE__ */ jsx(
+    Action,
+    {
+      held: props.card,
+      action: a.action,
+      label: a.label,
+      link: a.deep_link
+    },
+    `${a.action}:${a.label}`
+  )) });
+}
+function Action(props) {
+  const { store, handlers } = useChat();
+  const open = useLink(props.link, props.held);
+  if (props.link && !open) return null;
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      label: props.label,
+      role: open ? "link" : "button",
+      onPress: () => {
+        if (open) return open();
+        store.cardAction(props.held.id, props.action);
+        handlers.current?.onCardAction?.(props.held, props.action);
+      }
+    }
+  );
+}
+function LinksCard(props) {
+  const card = cardOf(props.card);
+  const { store, handlers } = useChat();
+  const links = (card.links ?? []).filter(
+    (l) => /^https:\/\//i.test(l.url) || store.checkLink(l.url)
+  );
+  return /* @__PURE__ */ jsxs(
+    CardFrame,
+    {
+      label: [card.title, ...links.map((l) => l.label)].join(", "),
+      restored: props.restored,
+      testID: `vinaverse-card-${card.id}`,
+      children: [
+        /* @__PURE__ */ jsx(Title, { children: card.title }),
+        links.map((l) => /* @__PURE__ */ jsx(
+          Button,
+          {
+            label: l.label,
+            role: "link",
+            variant: "secondary",
+            disabled: props.restored,
+            onPress: () => {
+              const open = handlers.current?.onOpenLink;
+              if (open) open(l.url, props.card);
+              else void Linking.openURL(l.url);
+            }
+          },
+          l.url
+        ))
+      ]
+    }
+  );
+}
+function ListingCard(props) {
+  const card = cardOf(props.card);
+  const { locale, t } = useCopy();
+  const { slots, timeZone, handlers, imagePolicy } = useChat();
+  const { colors, radius, space, font } = useTheme();
+  const [failed, setFailed] = useState(null);
+  const photoUrl = allowedImage(
+    card.images?.[0]?.url ?? card.image_url,
+    imagePolicy?.hosts
+  );
+  const hero = photoUrl === failed ? null : photoUrl;
+  const Img = slots.Image ?? Image;
+  const rating = card.rating ? `\u2605 ${ratingText(card.rating.value_ppm, locale)} (${card.rating.count})` : t("ratingNone") || null;
+  const price = card.price_from ? t("priceFrom", {
+    price: formatMoney(
+      card.price_from.amount,
+      card.price_from.currency,
+      locale
+    )
+  }) : null;
+  const next = card.next_available ? t("nextAvailable", {
+    // "today, 10:00 AM", "tomorrow, 10:00 AM", else the date (the copy's `today` and `tomorrow`).
+    time: formatDayTime(
+      card.next_available,
+      { today: t("today"), tomorrow: t("tomorrow") },
+      locale,
+      timeZone
+    )
+  }) : null;
+  const ref = card.ref;
+  const onOpenTarget = handlers.current?.onOpenTarget;
+  const open = ref && onOpenTarget && !props.restored ? () => onOpenTarget({ type: ref.type, id: ref.id }, props.card) : null;
+  const asked = imagePolicy?.aspectRatio;
+  const size2 = card.images?.[0];
+  const range = imagePolicy?.naturalAspect ?? { min: 1, max: 2 };
+  const own = asked === "natural" && !props.grouped && size2?.width && size2.height ? Math.min(range.max, Math.max(range.min, size2.width / size2.height)) : null;
+  const photo = {
+    width: "100%",
+    aspectRatio: own ?? (typeof asked === "number" ? asked : 1.6),
+    borderRadius: radius.md
+  };
+  const top = /* @__PURE__ */ jsxs(Fragment, { children: [
+    hero ? /* @__PURE__ */ jsx(
+      Img,
+      {
+        source: { uri: hero },
+        onError: () => setFailed(hero),
+        style: { ...photo, backgroundColor: colors.surface },
+        accessible: false,
+        testID: `vinaverse-photo-${card.id}`
+      }
+    ) : imagePolicy?.Placeholder ? /* @__PURE__ */ jsx(View, { style: photo, testID: `vinaverse-placeholder-${card.id}`, children: /* @__PURE__ */ jsx(imagePolicy.Placeholder, { title: card.title, kind: card.kind }) }) : /* @__PURE__ */ jsx(
+      View,
+      {
+        accessible: false,
+        importantForAccessibility: "no-hide-descendants",
+        testID: `vinaverse-monogram-${card.id}`,
+        style: {
+          ...photo,
+          backgroundColor: colors.surface,
+          alignItems: "center",
+          justifyContent: "center"
+        },
+        children: /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              color: colors.textMuted,
+              fontSize: font.size.xl,
+              fontWeight: "600"
+            },
+            children: monogram(card.title)
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxs(View, { style: { gap: space.xxs }, children: [
+      /* @__PURE__ */ jsx(Title, { numberOfLines: 2, children: card.title }),
+      card.subtitle ? /* @__PURE__ */ jsx(Body, { muted: true, children: card.subtitle }) : null,
+      rating || price ? /* @__PURE__ */ jsx(Body, { muted: true, children: [rating, price].filter(Boolean).join(" \xB7 ") }) : null
+    ] })
+  ] });
+  return /* @__PURE__ */ jsxs(
+    CardFrame,
+    {
+      label: [card.title, card.subtitle, rating, price, next].filter(Boolean).join(", "),
+      restored: props.restored,
+      testID: `vinaverse-card-${card.id}`,
+      children: [
+        open ? /* @__PURE__ */ jsx(
+          Pressable,
+          {
+            accessibilityRole: "link",
+            accessibilityLabel: card.title,
+            onPress: open,
+            style: { gap: space.sm },
+            testID: `vinaverse-open-${card.id}`,
+            children: top
+          }
+        ) : top,
+        card.body ? /* @__PURE__ */ jsx(Body, { children: card.body }) : null,
+        /* @__PURE__ */ jsx(Badges, { badges: next ? [next, ...card.badges ?? []] : card.badges }),
+        props.restored ? null : /* @__PURE__ */ jsx(CardActions, { ...props })
+      ]
+    }
+  );
+}
+function monogram(title) {
+  return title.split(/\s+/).filter(Boolean).slice(0, 2).map((w) => [...w][0]?.toUpperCase() ?? "").join("");
+}
+function NextStepCard(props) {
+  const card = cardOf(props.card);
+  const action = card.actions?.[0];
+  const open = useLink(action?.deep_link, props.card);
+  return /* @__PURE__ */ jsxs(
+    CardFrame,
+    {
+      label: [card.title, card.body].filter(Boolean).join(". "),
+      restored: props.restored,
+      testID: `vinaverse-card-${card.id}`,
+      children: [
+        /* @__PURE__ */ jsx(Title, { children: card.title }),
+        card.body ? /* @__PURE__ */ jsx(Body, { muted: true, children: card.body }) : null,
+        action && open && !props.restored ? /* @__PURE__ */ jsx(
+          Button,
+          {
+            label: action.label,
+            variant: "primary",
+            role: "link",
+            onPress: open
+          }
+        ) : null
+      ]
+    }
+  );
+}
+function fieldText(type, value, locale, timeZone) {
+  if (value === null || value === void 0) return "";
+  const v = value;
+  switch (type) {
+    case "list":
+      return Array.isArray(value) ? value.join(", ") : String(value);
+    case "time_range":
+      return formatTimeRange(
+        String(v.start ?? ""),
+        typeof v.end === "string" ? v.end : void 0,
+        locale,
+        timeZone
+      );
+    case "money_cents":
+      return formatMoney(
+        Number(v.amount ?? 0),
+        String(v.currency ?? "USD"),
+        locale
+      );
+    case "address":
+      return ["line1", "line2", "city", "region", "postal_code", "country"].map((k) => v[k]).filter((p) => typeof p === "string" && p).join(", ");
+    case "weekly_hours": {
+      const entries = Array.isArray(v.entries) ? v.entries : [];
+      return entries.map((e) => `${weekday(e.day, locale)} ${e.start}\u2013${e.end}`).join(", ");
+    }
+    default:
+      return typeof value === "object" ? JSON.stringify(value) : String(value);
+  }
+}
+var DAYS = ["mon", "tue", "wed", "thu", "fri", "sat", "sun"];
+function weekday(day, locale) {
+  const i = DAYS.indexOf(day);
+  if (i < 0) return day;
+  try {
+    return new Intl.DateTimeFormat(locale, {
+      weekday: "short",
+      timeZone: "UTC"
+    }).format(new Date(Date.UTC(2024, 0, 1 + i)));
+  } catch {
+    return day;
+  }
+}
+function outcomeText(t, outcome, status) {
+  if (outcome === "confirmed") return t("proposalConfirmed");
+  if (outcome === "declined") return t("proposalDeclined");
+  if (outcome === "failed") return t("proposalFailed");
+  if (outcome === "expired") return t("proposalExpired");
+  if (status === "confirmed") return t("proposalConfirmed");
+  if (status === "declined") return t("proposalDeclined");
+  if (status === "expired") return t("proposalExpired");
+  if (status !== "pending") return t("proposalSettled");
+  return null;
+}
+function ProposalCard(props) {
+  const card = cardOf(props.card);
+  const proposal = card.proposal;
+  const { t, locale } = useCopy();
+  const { store, handlers, timeZone } = useChat();
+  const { colors, space, font } = useTheme();
+  const edit = useLink(proposal?.edit_deep_link, props.card);
+  if (!proposal) return null;
+  const settled = outcomeText(t, props.card.outcome, proposal.status);
+  const actionable = settled === null && !props.restored;
+  const decide = (decision) => {
+    const onProposal = handlers.current?.onProposal;
+    if (!onProposal) return;
+    store.decideProposal(
+      props.card.id,
+      () => onProposal(props.card, decision)
+    ).catch(
+      (error) => handlers.current?.onWarning?.(`Vinaverse proposal: ${String(error)}`, {
+        code: "proposal_failed"
+      })
+    );
+  };
+  const fields = proposal.fields.map((f) => {
+    const after = fieldText(f.type, f.after, locale, timeZone);
+    const before = f.before === void 0 || f.before === null ? null : fieldText(f.type, f.before, locale, timeZone);
+    return {
+      key: f.key,
+      label: f.label,
+      value: before !== null && before !== after ? `${before} \u2192 ${after}` : after
+    };
+  });
+  return /* @__PURE__ */ jsxs(
+    CardFrame,
+    {
+      label: [
+        proposal.title,
+        proposal.summary,
+        ...fields.map((f) => `${f.label}: ${f.value}`),
+        settled
+      ].filter(Boolean).join(". "),
+      restored: props.restored,
+      testID: `vinaverse-proposal-${card.id}`,
+      children: [
+        /* @__PURE__ */ jsx(Title, { children: proposal.title }),
+        /* @__PURE__ */ jsx(Body, { muted: true, children: proposal.summary }),
+        /* @__PURE__ */ jsx(View, { style: { gap: space.xs }, children: fields.map((f) => /* @__PURE__ */ jsxs(View, { style: { flexDirection: "row", gap: space.sm }, children: [
+          /* @__PURE__ */ jsx(
+            Text,
+            {
+              style: {
+                color: colors.textMuted,
+                fontSize: font.size.sm,
+                minWidth: 72
+              },
+              children: f.label
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Text,
+            {
+              style: { color: colors.text, fontSize: font.size.sm, flex: 1 },
+              children: f.value
+            }
+          )
+        ] }, f.key)) }),
+        settled ? /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              color: props.card.outcome === "confirmed" || proposal.status === "confirmed" ? colors.success : colors.textMuted,
+              fontSize: font.size.sm,
+              fontWeight: "600"
+            },
+            children: settled
+          }
+        ) : null,
+        actionable ? /* @__PURE__ */ jsxs(View, { style: { flexDirection: "row", flexWrap: "wrap", gap: space.sm }, children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              label: t("proposalConfirm"),
+              variant: "primary",
+              busy: props.busy,
+              disabled: props.busy,
+              onPress: () => decide("confirm"),
+              testID: "vinaverse-proposal-confirm"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              label: t("proposalDecline"),
+              disabled: props.busy,
+              onPress: () => decide("decline"),
+              testID: "vinaverse-proposal-decline"
+            }
+          ),
+          edit ? /* @__PURE__ */ jsx(
+            Button,
+            {
+              label: t("proposalChange"),
+              variant: "text",
+              role: "link",
+              onPress: edit
+            }
+          ) : null
+        ] }) : null
+      ]
+    }
+  );
+}
+var KNOWN = /* @__PURE__ */ new Set([
+  "single_choice",
+  "multi_choice",
+  "image_choice",
+  "yes_no",
+  "list_choice",
+  "rate_each",
+  "short_text",
+  "long_text",
+  "date",
+  "number",
+  "scale",
+  "photo"
+]);
+var ONE_TAP = /* @__PURE__ */ new Set(["single_choice", "yes_no", "list_choice", "scale"]);
+function QuestionCard(props) {
+  const held = props.card;
+  const question = held.question;
+  const { store, handlers } = useChat();
+  const { t, locale } = useCopy();
+  const { colors, font, space } = useTheme();
+  const needsSocket = useConversationSelector(
+    store,
+    (v) => v.answersNeedWebSocket
+  );
+  if (!question) return null;
+  const send = (answer, questionId = question.question_id) => {
+    try {
+      store.answer(held.id, questionId, answer);
+    } catch (error) {
+      handlers.current?.onWarning?.(`Vinaverse answer: ${String(error)}`, {
+        code: "answer_failed"
+      });
+    }
+  };
+  const locked = held.locked.includes(question.question_id);
+  const state = question.state;
+  const open = state === "open" && !locked && !props.restored;
+  const summary = state === "answered" ? answerText(question, locale, t("questionOther")) : null;
+  return /* @__PURE__ */ jsxs(
+    CardFrame,
+    {
+      label: [question.prompt, summary].filter(Boolean).join(". "),
+      restored: props.restored,
+      testID: `vinaverse-question-${held.id}`,
+      children: [
+        question.progress ? /* @__PURE__ */ jsx(Text, { style: { color: colors.textMuted, fontSize: font.size.xs }, children: t("questionStep", {
+          step: question.progress.step,
+          total: question.progress.total
+        }) }) : null,
+        /* @__PURE__ */ jsx(Title, { children: question.prompt }),
+        question.help ? /* @__PURE__ */ jsx(Body, { muted: true, children: question.help }) : null,
+        state === "answered" ? /* @__PURE__ */ jsxs(View, { style: { gap: space.xxs }, children: [
+          /* @__PURE__ */ jsx(Body, { muted: true, children: t("questionAnswered") }),
+          summary ? /* @__PURE__ */ jsx(Body, { children: summary }) : null
+        ] }) : state === "superseded" ? /* @__PURE__ */ jsx(Body, { muted: true, children: t("questionReplaced") }) : !KNOWN.has(question.kind) || needsSocket ? /* @__PURE__ */ jsx(Body, { muted: true, children: t("typeAnswerBelow") }) : question.kind === "rate_each" ? /* @__PURE__ */ jsx(
+          RateEach,
+          {
+            question,
+            locked: held.locked,
+            enabled: !props.restored,
+            send
+          }
+        ) : /* @__PURE__ */ jsx(
+          Answer,
+          {
+            question,
+            enabled: open,
+            send,
+            held
+          },
+          question.question_id
+        )
+      ]
+    }
+  );
+}
+function Answer(props) {
+  const { question, send, enabled } = props;
+  const { t } = useCopy();
+  const { space } = useTheme();
+  const { handlers } = useChat();
+  const [draft, setDraft] = useState({});
+  const kind = question.kind;
+  const oneTap = ONE_TAP.has(kind) && !question.allows_other;
+  const problem = answerProblem(question, draft);
+  const submit = (answer = draft) => {
+    if (answerProblem(question, answer) === null)
+      send(answer);
+  };
+  const input = (() => {
+    switch (kind) {
+      case "short_text":
+      case "long_text":
+        return /* @__PURE__ */ jsx(
+          TextAnswer,
+          {
+            question,
+            enabled,
+            value: draft.text ?? "",
+            onChange: (text) => setDraft({ text })
+          }
+        );
+      case "number":
+        return /* @__PURE__ */ jsx(
+          NumberAnswer,
+          {
+            question,
+            enabled,
+            value: draft.number,
+            onChange: (n) => setDraft({ number: n })
+          }
+        );
+      case "scale":
+        return /* @__PURE__ */ jsx(
+          ScaleAnswer,
+          {
+            question,
+            enabled,
+            onPick: (n) => submit({ number: n })
+          }
+        );
+      case "date":
+        return /* @__PURE__ */ jsx(
+          DateAnswer,
+          {
+            question,
+            enabled,
+            value: draft.date,
+            onChange: (date) => setDraft({ date })
+          }
+        );
+      case "photo":
+        return /* @__PURE__ */ jsx(
+          Button,
+          {
+            label: t("questionAddPhoto"),
+            disabled: !enabled || !handlers.current?.onPickPhoto,
+            onPress: () => {
+              handlers.current?.onPickPhoto?.(question, props.held).then((picked) => {
+                if (picked) send({ upload_ref: picked.upload_ref });
+              }).catch(
+                (error) => handlers.current?.onWarning?.(
+                  `Vinaverse photo: ${String(error)}`,
+                  { code: "photo_failed" }
+                )
+              );
+            }
+          }
+        );
+      default:
+        return /* @__PURE__ */ jsx(
+          ChoiceAnswer,
+          {
+            question,
+            enabled,
+            draft,
+            onChange: (next) => oneTap ? submit(next) : setDraft(next)
+          }
+        );
+    }
+  })();
+  const tapToAnswer = oneTap || kind === "scale" || kind === "photo";
+  return /* @__PURE__ */ jsxs(View, { style: { gap: space.sm }, children: [
+    input,
+    /* @__PURE__ */ jsxs(View, { style: { flexDirection: "row", flexWrap: "wrap", gap: space.sm }, children: [
+      tapToAnswer ? null : /* @__PURE__ */ jsx(
+        Button,
+        {
+          label: t("questionSubmit"),
+          variant: "primary",
+          disabled: !enabled || problem !== null,
+          onPress: () => submit(),
+          testID: "vinaverse-question-submit"
+        }
+      ),
+      question.required ? null : /* @__PURE__ */ jsx(
+        Button,
+        {
+          label: t("questionSkip"),
+          variant: "text",
+          disabled: !enabled,
+          onPress: () => send({ skipped: true })
+        }
+      )
+    ] })
+  ] });
+}
+function ChoiceAnswer(props) {
+  const { question, draft, onChange, enabled } = props;
+  const { t } = useCopy();
+  const { slots } = useChat();
+  const { colors, radius, space, font } = useTheme();
+  const [search, setSearch] = useState("");
+  const multi = question.kind === "multi_choice" || question.kind === "image_choice";
+  const values = draft.values ?? [];
+  const other = draft.other_text;
+  const none = question.none_of_the_above;
+  const list = question.kind === "list_choice";
+  const options = useMemo(() => {
+    const all = question.options ?? [];
+    const q = search.trim().toLowerCase();
+    return list && q ? all.filter((o) => o.label.toLowerCase().includes(q)) : all;
+  }, [question.options, search, list]);
+  const shown = list ? options.slice(0, 50) : options;
+  const pick = (value) => {
+    if (none && value === none.value) return onChange({ values: [value] });
+    const rest = values.filter((v) => v !== none?.value);
+    const next = multi ? rest.includes(value) ? rest.filter((v) => v !== value) : [...rest, value] : [value];
+    const keepOther = other !== void 0 && (multi || question.kind === "single_choice");
+    onChange({
+      ...next.length ? { values: next } : {},
+      ...keepOther ? { other_text: other } : {}
+    });
+  };
+  const Img = slots.Image ?? Image;
+  return /* @__PURE__ */ jsxs(View, { style: { gap: space.xs }, children: [
+    list ? /* @__PURE__ */ jsx(
+      TextInput,
+      {
+        value: search,
+        onChangeText: setSearch,
+        placeholder: t("questionSearch"),
+        placeholderTextColor: colors.textMuted,
+        accessibilityLabel: t("questionSearch"),
+        editable: enabled,
+        style: {
+          borderWidth: 1,
+          borderColor: colors.border,
+          borderRadius: radius.md,
+          paddingHorizontal: space.md,
+          minHeight: 44,
+          color: colors.text,
+          fontSize: font.size.md
+        }
+      }
+    ) : null,
+    shown.map((o) => {
+      const image = question.kind === "image_choice" ? safeImage(o.image_url) : null;
+      return /* @__PURE__ */ jsx(
+        Button,
+        {
+          label: o.label,
+          role: multi ? "checkbox" : "radio",
+          selected: values.includes(o.value),
+          disabled: !enabled,
+          ...o.description ? { hint: o.description } : {},
+          onPress: () => pick(o.value),
+          children: image ? /* @__PURE__ */ jsxs(View, { style: { alignItems: "center", gap: space.xs }, children: [
+            /* @__PURE__ */ jsx(
+              Img,
+              {
+                source: { uri: image },
+                style: { width: 96, height: 96, borderRadius: radius.md },
+                accessible: false
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              ChoiceLabel,
+              {
+                selected: values.includes(o.value),
+                text: o.label
+              }
+            )
+          ] }) : /* @__PURE__ */ jsx(ChoiceLabel, { selected: values.includes(o.value), text: o.label })
+        },
+        o.value
+      );
+    }),
+    none ? /* @__PURE__ */ jsx(
+      Button,
+      {
+        label: none.label,
+        role: multi ? "checkbox" : "radio",
+        selected: values.includes(none.value),
+        disabled: !enabled,
+        onPress: () => pick(none.value)
+      }
+    ) : null,
+    question.allows_other ? /* @__PURE__ */ jsx(
+      OtherText,
+      {
+        max: question.other_max_length ?? 500,
+        enabled,
+        value: other,
+        onChange: (text) => {
+          const kept = values.filter((v) => v !== none?.value);
+          const withValues = question.kind === "single_choice" || multi;
+          onChange({
+            ...withValues && kept.length ? { values: question.kind === "single_choice" ? [] : kept } : {},
+            ...text === void 0 ? {} : { other_text: text }
+          });
+        }
+      }
+    ) : null
+  ] });
+}
+function ChoiceLabel(props) {
+  const { colors, font } = useTheme();
+  return /* @__PURE__ */ jsx(
+    Text,
+    {
+      style: {
+        color: props.selected ? colors.onPrimary : colors.text,
+        fontSize: font.size.md,
+        textAlign: "center"
+      },
+      children: props.text
+    }
+  );
+}
+function OtherText(props) {
+  const { t } = useCopy();
+  const { colors, radius, space, font } = useTheme();
+  const on = props.value !== void 0;
+  return /* @__PURE__ */ jsxs(View, { style: { gap: space.xs }, children: [
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        label: t("questionOther"),
+        role: "checkbox",
+        selected: on,
+        disabled: !props.enabled,
+        onPress: () => props.onChange(on ? void 0 : "")
+      }
+    ),
+    on ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          value: props.value,
+          onChangeText: (text) => props.onChange(text),
+          accessibilityLabel: t("questionOther"),
+          testID: "vinaverse-question-other",
+          editable: props.enabled,
+          style: {
+            borderWidth: 1,
+            borderColor: colors.border,
+            borderRadius: radius.md,
+            paddingHorizontal: space.md,
+            minHeight: 44,
+            color: colors.text,
+            fontSize: font.size.md
+          }
+        }
+      ),
+      /* @__PURE__ */ jsx(CharactersLeft, { max: props.max, text: props.value ?? "" })
+    ] }) : null
+  ] });
+}
+function CharactersLeft(props) {
+  const { t } = useCopy();
+  const { colors, font } = useTheme();
+  const left = props.max - codePoints(props.text);
+  return /* @__PURE__ */ jsx(
+    Text,
+    {
+      accessibilityLiveRegion: left < 20 ? "polite" : "none",
+      style: {
+        color: left < 0 ? colors.danger : colors.textMuted,
+        fontSize: font.size.xs
+      },
+      children: t("questionCharactersLeft", { count: left })
+    }
+  );
+}
+function TextAnswer(props) {
+  const { colors, radius, space, font } = useTheme();
+  const long = props.question.kind === "long_text";
+  const max = props.question.text?.max_length ?? (long ? 2e3 : 200);
+  return /* @__PURE__ */ jsxs(View, { style: { gap: space.xs }, children: [
+    /* @__PURE__ */ jsx(
+      TextInput,
+      {
+        value: props.value,
+        onChangeText: props.onChange,
+        accessibilityLabel: props.question.prompt,
+        editable: props.enabled,
+        multiline: long,
+        testID: "vinaverse-question-text",
+        style: {
+          borderWidth: 1,
+          borderColor: colors.border,
+          borderRadius: radius.md,
+          paddingHorizontal: space.md,
+          paddingVertical: space.sm,
+          minHeight: long ? 96 : 44,
+          color: colors.text,
+          fontSize: font.size.md,
+          textAlignVertical: long ? "top" : "center"
+        }
+      }
+    ),
+    /* @__PURE__ */ jsx(CharactersLeft, { max, text: props.value })
+  ] });
+}
+function NumberAnswer(props) {
+  const range = props.question.number ?? { min: 0, max: 100, step: 1 };
+  const { colors, space, font } = useTheme();
+  const value = props.value ?? range.min;
+  const clamp = (n) => Math.min(range.max, Math.max(range.min, Number(n.toFixed(6))));
+  const shown = `${value}${props.question.number?.unit ? ` ${props.question.number.unit}` : ""}`;
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      accessible: true,
+      accessibilityRole: "adjustable",
+      accessibilityLabel: props.question.prompt,
+      accessibilityValue: {
+        min: range.min,
+        max: range.max,
+        now: value,
+        text: shown
+      },
+      accessibilityActions: [{ name: "increment" }, { name: "decrement" }],
+      testID: "vinaverse-question-number",
+      onAccessibilityAction: (e) => props.onChange(
+        clamp(
+          value + (e.nativeEvent.actionName === "increment" ? range.step : -range.step)
+        )
+      ),
+      style: { flexDirection: "row", alignItems: "center", gap: space.md },
+      children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            label: "\u2212",
+            disabled: !props.enabled || value <= range.min,
+            onPress: () => props.onChange(clamp(value - range.step))
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              color: colors.text,
+              fontSize: font.size.lg,
+              minWidth: 64,
+              textAlign: "center"
+            },
+            children: shown
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            label: "+",
+            disabled: !props.enabled || value >= range.max,
+            onPress: () => props.onChange(clamp(value + range.step))
+          }
+        )
+      ]
+    }
+  );
+}
+function ScaleAnswer(props) {
+  const scale = props.question.scale;
+  const { colors, space, font } = useTheme();
+  if (!scale) return null;
+  const points = [];
+  for (let n = scale.min; n <= scale.max && points.length < 21; n += scale.step)
+    points.push(n);
+  return /* @__PURE__ */ jsxs(View, { style: { gap: space.xs }, children: [
+    /* @__PURE__ */ jsx(View, { style: { flexDirection: "row", flexWrap: "wrap", gap: space.xs }, children: points.map((n) => /* @__PURE__ */ jsx(
+      Button,
+      {
+        label: String(n),
+        role: "radio",
+        disabled: !props.enabled,
+        onPress: () => props.onPick(n)
+      },
+      n
+    )) }),
+    /* @__PURE__ */ jsxs(View, { style: { flexDirection: "row", justifyContent: "space-between" }, children: [
+      /* @__PURE__ */ jsx(Text, { style: { color: colors.textMuted, fontSize: font.size.xs }, children: scale.min_label }),
+      /* @__PURE__ */ jsx(Text, { style: { color: colors.textMuted, fontSize: font.size.xs }, children: scale.max_label })
+    ] })
+  ] });
+}
+var iso = (y, m, d) => `${String(y).padStart(4, "0")}-${String(m + 1).padStart(2, "0")}-${String(d).padStart(2, "0")}`;
+function DateAnswer(props) {
+  const { locale } = useCopy();
+  const { colors, space, font } = useTheme();
+  const bounds = props.question.date;
+  const start = props.value ?? bounds?.min ?? (/* @__PURE__ */ new Date()).toISOString().slice(0, 10);
+  const [month, setMonth] = useState(() => ({
+    y: Number(start.slice(0, 4)),
+    m: Number(start.slice(5, 7)) - 1
+  }));
+  const days = new Date(Date.UTC(month.y, month.m + 1, 0)).getUTCDate();
+  const title = (() => {
+    try {
+      return new Intl.DateTimeFormat(locale, {
+        month: "long",
+        year: "numeric",
+        timeZone: "UTC"
+      }).format(new Date(Date.UTC(month.y, month.m, 1)));
+    } catch {
+      return `${month.y}-${month.m + 1}`;
+    }
+  })();
+  const move = (by) => {
+    const d = new Date(Date.UTC(month.y, month.m + by, 1));
+    setMonth({ y: d.getUTCFullYear(), m: d.getUTCMonth() });
+  };
+  const outside = (date) => bounds?.min !== void 0 && date < bounds.min || bounds?.max !== void 0 && date > bounds.max;
+  return /* @__PURE__ */ jsxs(View, { style: { gap: space.xs }, children: [
+    /* @__PURE__ */ jsxs(
+      View,
+      {
+        style: {
+          flexDirection: "row",
+          alignItems: "center",
+          justifyContent: "space-between"
+        },
+        children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              label: "\u2039",
+              variant: "text",
+              disabled: !props.enabled,
+              onPress: () => move(-1)
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Text,
+            {
+              accessibilityRole: "header",
+              style: { color: colors.text, fontSize: font.size.md },
+              children: title
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              label: "\u203A",
+              variant: "text",
+              disabled: !props.enabled,
+              onPress: () => move(1)
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(View, { style: { flexDirection: "row", flexWrap: "wrap", gap: space.xxs }, children: Array.from({ length: days }, (_, i) => {
+      const date = iso(month.y, month.m, i + 1);
+      return /* @__PURE__ */ jsx(
+        Button,
+        {
+          label: String(i + 1),
+          hint: formatDate(date, locale),
+          role: "radio",
+          selected: props.value === date,
+          disabled: !props.enabled || outside(date),
+          onPress: () => props.onChange(date)
+        },
+        date
+      );
+    }) }),
+    props.value ? /* @__PURE__ */ jsx(Body, { muted: true, children: formatDate(props.value, locale) }) : null
+  ] });
+}
+function RateEach(props) {
+  const { question } = props;
+  const { t } = useCopy();
+  const { colors, space, font } = useTheme();
+  const answered = new Map(
+    (question.row_answers ?? []).map((r) => [
+      r.question_id,
+      (r.answer.values ?? [])[0]
+    ])
+  );
+  const open = (question.rows ?? []).filter(
+    (r) => !props.locked.includes(r.question_id)
+  );
+  return /* @__PURE__ */ jsxs(View, { style: { gap: space.md }, children: [
+    (question.rows ?? []).map((row) => {
+      const done = props.locked.includes(row.question_id);
+      return /* @__PURE__ */ jsxs(
+        View,
+        {
+          accessibilityLabel: row.label,
+          style: { gap: space.xs },
+          children: [
+            /* @__PURE__ */ jsx(Text, { style: { color: colors.text, fontSize: font.size.sm }, children: row.label }),
+            /* @__PURE__ */ jsx(
+              View,
+              {
+                style: { flexDirection: "row", flexWrap: "wrap", gap: space.xs },
+                children: (question.options ?? []).map((o) => /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    label: o.label,
+                    role: "radio",
+                    selected: answered.get(row.question_id) === o.value,
+                    disabled: !props.enabled || done,
+                    onPress: () => props.send({ values: [o.value] }, row.question_id)
+                  },
+                  o.value
+                ))
+              }
+            )
+          ]
+        },
+        row.question_id
+      );
+    }),
+    question.required || open.length === 0 ? null : /* @__PURE__ */ jsx(
+      Button,
+      {
+        label: t("questionSkip"),
+        variant: "text",
+        disabled: !props.enabled,
+        onPress: () => {
+          for (const row of open)
+            props.send({ skipped: true }, row.question_id);
+        }
+      }
+    )
+  ] });
+}
+function answerText(question, locale, otherLabel) {
+  const answer = question.answer;
+  if (!answer || answer.skipped) return null;
+  const labels = new Map(
+    (question.options ?? []).map((o) => [o.value, o.label])
+  );
+  if (question.none_of_the_above)
+    labels.set(
+      question.none_of_the_above.value,
+      question.none_of_the_above.label
+    );
+  const parts = [
+    ...(answer.values ?? []).map((v) => labels.get(v) ?? v),
+    ...answer.other_text ? [`${otherLabel}: ${answer.other_text}`] : [],
+    ...answer.text ? [answer.text] : [],
+    ...answer.number !== void 0 ? [String(answer.number)] : [],
+    ...answer.date ? [formatDate(answer.date, locale)] : [],
+    ...answer.upload_ref ? ["\u{1F4F7}"] : []
+  ];
+  return parts.length ? parts.join(", ") : null;
+}
+function TimeSlotsCard(props) {
+  const card = cardOf(props.card);
+  const { locale } = useCopy();
+  const { timeZone } = useChat();
+  const { colors, radius, space, font } = useTheme();
+  const slots = (card.slots ?? []).map(
+    (s) => formatTimeRange(s.start, s.end, locale, timeZone)
+  );
+  return /* @__PURE__ */ jsxs(
+    CardFrame,
+    {
+      label: [card.title, ...slots].join(", "),
+      restored: props.restored,
+      testID: `vinaverse-card-${card.id}`,
+      children: [
+        /* @__PURE__ */ jsx(Title, { children: card.title }),
+        /* @__PURE__ */ jsx(View, { style: { flexDirection: "row", flexWrap: "wrap", gap: space.xs }, children: slots.map((s) => /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              color: colors.text,
+              borderWidth: 1,
+              borderColor: colors.border,
+              borderRadius: radius.pill,
+              paddingHorizontal: space.md,
+              paddingVertical: space.xs,
+              fontSize: font.size.sm
+            },
+            children: s
+          },
+          s
+        )) })
+      ]
+    }
+  );
+}
+var DEFAULTS = {
+  proposal: ProposalCard,
+  question: QuestionCard,
+  next_step: NextStepCard,
+  time_slots: TimeSlotsCard,
+  professional: ListingCard,
+  workspace: ListingCard,
+  links: LinksCard
+};
+function defaultCard(kind) {
+  return DEFAULTS[kind] ?? InfoCard;
+}
+var CardView = /* @__PURE__ */ memo(function CardView2(props) {
+  const { slots } = useChat();
+  const { card, busy } = props.item;
+  const Default = defaultCard(card.kind);
+  const Custom = slots.cards?.[card.kind];
+  const read = useMemo(() => readCard(card.card), [card]);
+  const own = {
+    card,
+    read,
+    busy,
+    restored: props.item.restored === true,
+    grouped: props.grouped === true
+  };
+  return Custom ? /* @__PURE__ */ jsx(Custom, { ...own, Default }) : /* @__PURE__ */ jsx(Default, { ...own });
+});
+var keyOf = (item) => item.key;
+var kindOf = (item) => item.card.kind;
+function CardCarousel(props) {
+  const { width } = useWindowDimensions();
+  const { t } = useCopy();
+  const size2 = Math.min(Math.round(width * 0.8), 360);
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      accessibilityRole: "list",
+      accessibilityLabel: t("cardsInRow", {
+        count: String(props.items.length)
+      }),
+      children: /* @__PURE__ */ jsx(
+        FlashList,
+        {
+          horizontal: true,
+          data: props.items,
+          keyExtractor: keyOf,
+          getItemType: kindOf,
+          renderItem: ({ item }) => /* @__PURE__ */ jsx(View, { style: { width: size2 }, children: /* @__PURE__ */ jsx(CardView, { item, grouped: true }) }),
+          snapToInterval: size2,
+          decelerationRate: "fast",
+          showsHorizontalScrollIndicator: false
+        }
+      )
+    }
+  );
+}
+var ActivityLine = /* @__PURE__ */ memo(function ActivityLine2() {
+  const { store } = useChat();
+  const { t } = useCopy();
+  const { colors, space, font } = useTheme();
+  const activity = useConversationSelector(store, (v) => v.activity);
+  const waiting = useConversationSelector(
+    store,
+    (v) => v.responding && v.items.at(-1)?.type === "message" && v.items.at(-1).role === "person"
+  );
+  const name = useConversationSelector(store, (v) => v.agent.name);
+  const running = activity.filter((a) => a.state === "running").at(-1);
+  if (!running && !waiting) return null;
+  const text = running?.label ?? t("working", { agent: name ?? t("agentFallbackName") });
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      accessibilityLiveRegion: "polite",
+      style: { paddingHorizontal: space.lg, paddingVertical: space.sm },
+      children: /* @__PURE__ */ jsx(Text, { style: { color: colors.textMuted, fontSize: font.size.sm }, children: text })
+    }
+  );
+});
+var Avatar = /* @__PURE__ */ memo(function Avatar2(props) {
+  const { colors, size: size2, font } = useTheme();
+  const { slots } = useChat();
+  const box = {
+    width: size2.avatar,
+    height: size2.avatar,
+    borderRadius: size2.avatar / 2
+  };
+  if (props.uri && !props.person) {
+    const Img = slots.Image ?? Image;
+    return /* @__PURE__ */ jsx(
+      Img,
+      {
+        source: { uri: props.uri },
+        style: box,
+        accessibilityIgnoresInvertColors: true,
+        accessible: false,
+        importantForAccessibility: "no"
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      accessible: false,
+      importantForAccessibility: "no-hide-descendants",
+      style: {
+        ...box,
+        backgroundColor: props.person ? colors.staffBubble : colors.primary,
+        alignItems: "center",
+        justifyContent: "center"
+      },
+      children: /* @__PURE__ */ jsx(
+        Text,
+        {
+          style: {
+            color: props.person ? colors.staffText : colors.onPrimary,
+            fontSize: font.size.sm,
+            fontWeight: "600"
+          },
+          children: props.person ? "\u25C9" : (props.name.trim()[0] ?? "?").toUpperCase()
+        }
+      )
+    }
+  );
+});
+function DefaultHeader(props) {
+  const { colors, space, font } = useTheme();
+  const { t } = useCopy();
+  const person = props.takeoverBy !== null;
+  const subtitle = person ? t("staffLabel", { by: props.takeoverBy || t("staffFallbackRole") }) : t("agentLabel");
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      accessibilityRole: "header",
+      accessible: true,
+      accessibilityLabel: `${props.name}, ${subtitle}`,
+      style: {
+        flexDirection: "row",
+        alignItems: "center",
+        gap: space.sm,
+        paddingHorizontal: space.lg,
+        paddingVertical: space.sm,
+        backgroundColor: colors.background,
+        borderBottomWidth: 1,
+        borderBottomColor: colors.divider
+      },
+      children: [
+        /* @__PURE__ */ jsx(Avatar, { name: props.name, uri: props.avatarUrl, person }),
+        /* @__PURE__ */ jsxs(View, { style: { flexShrink: 1 }, children: [
+          /* @__PURE__ */ jsx(
+            Text,
+            {
+              numberOfLines: 1,
+              style: {
+                color: colors.text,
+                fontSize: font.size.md,
+                fontWeight: "600",
+                ...font.family ? { fontFamily: font.family } : {}
+              },
+              children: props.name
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Text,
+            {
+              numberOfLines: 1,
+              style: {
+                color: person ? colors.staffAccent : colors.textMuted,
+                fontSize: font.size.xs
+              },
+              children: subtitle
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+var ChatHeader = /* @__PURE__ */ memo(function ChatHeader2() {
+  const { store, slots, agentAvatar } = useChat();
+  const { t } = useCopy();
+  const agent = useConversationSelector(store, (v) => v.agent);
+  const takeover = useConversationSelector(store, (v) => v.takeover);
+  const Header = slots.Header;
+  const props = {
+    name: agent.name ?? t("agentFallbackName"),
+    avatarUrl: agentAvatar ?? agent.avatarUrl,
+    takeoverBy: takeover ? takeover.by ?? "" : null
+  };
+  return Header ? /* @__PURE__ */ jsx(Header, { ...props, Default: DefaultHeader }) : /* @__PURE__ */ jsx(DefaultHeader, { ...props });
+});
+var DisclosureBar = /* @__PURE__ */ memo(function DisclosureBar2() {
+  const { store } = useChat();
+  const { t } = useCopy();
+  const theme = useTheme();
+  const { space, font } = theme;
+  const disclosure = useConversationSelector(store, (v) => v.disclosure);
+  const [open, setOpen] = useState(false);
+  const legible = contrastRatio(
+    theme.colors.disclosureText,
+    theme.colors.disclosureBackground
+  ) >= 4.5;
+  const pair = legible ? theme.colors : colors(theme.scheme);
+  const text = disclosure ?? t("disclosureFallback");
+  return /* @__PURE__ */ jsx(
+    Pressable,
+    {
+      accessibilityRole: "text",
+      accessibilityLabel: text,
+      onPress: () => setOpen((o) => !o),
+      testID: "vinaverse-disclosure",
+      style: {
+        backgroundColor: pair.disclosureBackground,
+        paddingHorizontal: space.lg,
+        paddingVertical: space.xs
+      },
+      children: /* @__PURE__ */ jsx(
+        Text,
+        {
+          numberOfLines: open ? void 0 : 2,
+          style: {
+            color: pair.disclosureText,
+            // never below the disclosure's minimum, whatever the tenant's type scale
+            fontSize: Math.max(font.size.xs, size.disclosureFontMin),
+            lineHeight: Math.max(font.size.xs, size.disclosureFontMin) * font.lineHeight
+          },
+          children: text
+        }
+      )
+    }
+  );
+});
+var ChatSkeleton = /* @__PURE__ */ memo(function ChatSkeleton2() {
+  const { colors, radius, space } = useTheme();
+  const row = (width, end) => /* @__PURE__ */ jsx(
+    View,
+    {
+      style: {
+        alignSelf: end ? "flex-end" : "flex-start",
+        width,
+        height: 40,
+        borderRadius: radius.lg,
+        backgroundColor: colors.surface,
+        marginHorizontal: space.lg,
+        marginTop: space.md
+      }
+    }
+  );
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      accessible: true,
+      accessibilityRole: "progressbar",
+      accessibilityState: { busy: true },
+      testID: "vinaverse-skeleton",
+      children: [
+        row("62%", false),
+        row("45%", true),
+        row("70%", false)
+      ]
+    }
+  );
+});
+function DefaultBubble(props) {
+  const { colors, radius, space, font } = useTheme();
+  const role = props.item.role;
+  const [background, foreground] = role === "person" ? [colors.personBubble, colors.personText] : role === "staff" ? [colors.staffBubble, colors.staffText] : [colors.agentBubble, colors.agentText];
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      style: {
+        backgroundColor: background,
+        borderRadius: radius.lg,
+        paddingHorizontal: space.md,
+        paddingVertical: space.sm
+      },
+      children: /* @__PURE__ */ jsx(
+        Text,
+        {
+          selectable: true,
+          style: {
+            color: foreground,
+            fontSize: font.size.md,
+            lineHeight: font.size.md * font.lineHeight,
+            ...font.family ? { fontFamily: font.family } : {}
+          },
+          children: props.text
+        }
+      )
+    }
+  );
+}
+function useAuthor(item) {
+  const { t } = useCopy();
+  const { store } = useChat();
+  const name = store.getSnapshot().agent.name ?? t("agentFallbackName");
+  const by = store.getSnapshot().takeover?.by;
+  if (item.role === "person") return t("you");
+  if (item.role === "staff")
+    return t("staffLabel", { by: by || t("staffFallbackRole") });
+  return `${name} \xB7 ${t("agentLabel")}`;
+}
+var MessageBubble = /* @__PURE__ */ memo(
+  function MessageBubble2(props) {
+    const { item } = props;
+    return /* @__PURE__ */ jsx(Frame, { item, text: item.text, showAuthor: props.showAuthor });
+  }
+);
+var StreamingBubble = /* @__PURE__ */ memo(
+  function StreamingBubble2(props) {
+    const { store } = useChat();
+    const text = useStreamingText(store, props.item.key) ?? "";
+    return /* @__PURE__ */ jsx(Frame, { item: props.item, text, showAuthor: props.showAuthor });
+  }
+);
+function Frame(props) {
+  const { item, text } = props;
+  const { store, slots } = useChat();
+  const { t } = useCopy();
+  const { colors, space, font } = useTheme();
+  const author = useAuthor(item);
+  const mine = item.role === "person";
+  const status = item.state === "sending" ? t("messageSending") : item.state === "held" ? t("messageHeld") : item.state === "not_sent" ? item.rejection?.message || t("messageNotSent") : item.state === "delivered" ? t("messageDelivered") : item.partial ? t("messageCutOff") : item.refusal && mine ? t("messageRefused") : null;
+  const Bubble = slots.MessageBubble;
+  const bubble = Bubble ? /* @__PURE__ */ jsx(Bubble, { item, text, Default: DefaultBubble }) : /* @__PURE__ */ jsx(DefaultBubble, { item, text });
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      accessible: true,
+      accessibilityLabel: [author, text, status].filter(Boolean).join(". "),
+      style: {
+        alignSelf: mine ? "flex-end" : "flex-start",
+        maxWidth: "85%",
+        marginHorizontal: space.lg,
+        marginTop: props.showAuthor ? space.md : space.xs,
+        opacity: item.state === "sending" || item.state === "held" || item.refusal ? 0.75 : 1
+      },
+      children: [
+        props.showAuthor && !mine ? /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              color: item.role === "staff" ? colors.staffAccent : colors.textMuted,
+              fontSize: font.size.xs,
+              marginBottom: space.xxs
+            },
+            children: author
+          }
+        ) : null,
+        bubble,
+        status ? /* @__PURE__ */ jsxs(
+          View,
+          {
+            style: {
+              flexDirection: "row",
+              alignItems: "center",
+              justifyContent: mine ? "flex-end" : "flex-start",
+              gap: space.xs,
+              marginTop: space.xxs
+            },
+            children: [
+              /* @__PURE__ */ jsx(
+                Text,
+                {
+                  style: {
+                    color: item.state === "not_sent" ? colors.danger : colors.textMuted,
+                    fontSize: font.size.xs
+                  },
+                  children: status
+                }
+              ),
+              item.state === "not_sent" ? /* @__PURE__ */ jsx(
+                Button,
+                {
+                  label: t("tryAgain"),
+                  variant: "text",
+                  onPress: () => {
+                    store.retry(item.key);
+                  }
+                }
+              ) : null
+            ]
+          }
+        ) : null
+      ]
+    }
+  );
+}
+function FailureActionButton(props) {
+  const { handlers, failureAction } = useChat();
+  const { t } = useCopy();
+  if (!failureAction) return null;
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      label: failureAction.label ?? t("talkToPerson"),
+      variant: "text",
+      onPress: () => handlers.current.failureAction?.onPress(props.state)
+    }
+  );
+}
+function FailureSlot(props) {
+  const { slot: Slot, state, Default } = props;
+  return Slot ? /* @__PURE__ */ jsx(Slot, { state, Default }) : /* @__PURE__ */ jsx(Default, { state });
+}
+var SystemRow = /* @__PURE__ */ memo(function SystemRow2(props) {
+  const { t } = useCopy();
+  const { store, slots } = useChat();
+  const conversationId = useConversationSelector(
+    store,
+    (v) => v.conversationId
+  );
+  const { event, data } = props.item;
+  if (event === "turn_failed") {
+    const key = props.item.key;
+    const state = {
+      kind: "turn_failed",
+      reason: typeof data.code === "string" ? data.code : null,
+      retry: data.retry === true ? () => void store.retryTurn(key) : void 0,
+      conversationId
+    };
+    return /* @__PURE__ */ jsx(
+      FailureSlot,
+      {
+        slot: slots.Error,
+        state,
+        Default: DefaultTurnFailed
+      }
+    );
+  }
+  const agent = store.getSnapshot().agent.name ?? t("agentFallbackName");
+  const text = (() => {
+    switch (event) {
+      case "takeover_started":
+        return t("takeoverStarted", {
+          by: data.by || t("staffFallbackRole")
+        });
+      case "takeover_ended":
+        return t("takeoverEnded", { agent });
+      case "handoff_created":
+        return data.expected_response ? t("handoffCreated", { expected: data.expected_response }) : t("handoffCreatedNoTime");
+      case "flow_completed":
+        return data.result === "ok" ? t("flowSent") : data.result === "failed" ? t("flowNotSent") : null;
+      default:
+        return null;
+    }
+  })();
+  if (!text) return null;
+  return /* @__PURE__ */ jsx(Line, { text });
+});
+function DefaultTurnFailed(props) {
+  const { t } = useCopy();
+  const { failureAction } = useChat();
+  const text = t("turnFailed");
+  if (!failureAction) return /* @__PURE__ */ jsx(Line, { text, danger: true });
+  return /* @__PURE__ */ jsxs(View, { style: { alignItems: "center" }, children: [
+    /* @__PURE__ */ jsx(Line, { text, danger: true }),
+    /* @__PURE__ */ jsx(FailureActionButton, { state: props.state })
+  ] });
+}
+function Line(props) {
+  const { colors, space, font } = useTheme();
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      accessible: true,
+      accessibilityLabel: props.text,
+      style: {
+        alignItems: "center",
+        paddingHorizontal: space.xl,
+        paddingVertical: space.sm
+      },
+      children: /* @__PURE__ */ jsx(
+        Text,
+        {
+          style: {
+            color: props.danger ? colors.danger : colors.textMuted,
+            fontSize: font.size.sm,
+            textAlign: "center"
+          },
+          children: props.text
+        }
+      )
+    }
+  );
+}
+var Welcome = /* @__PURE__ */ memo(function Welcome2(props) {
+  const { colors, radius, space, font } = useTheme();
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      style: { padding: space.lg, gap: space.md },
+      testID: "vinaverse-welcome",
+      children: [
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              alignSelf: "flex-start",
+              maxWidth: "85%",
+              color: colors.agentText,
+              backgroundColor: colors.agentBubble,
+              borderRadius: radius.lg,
+              paddingHorizontal: space.md,
+              paddingVertical: space.sm,
+              fontSize: font.size.md,
+              lineHeight: font.size.md * font.lineHeight
+            },
+            children: props.welcome.text
+          }
+        ),
+        props.welcome.chips.length ? /* @__PURE__ */ jsx(View, { style: { flexDirection: "row", flexWrap: "wrap", gap: space.sm }, children: props.welcome.chips.map((chip) => /* @__PURE__ */ jsx(
+          Button,
+          {
+            label: chip.label,
+            onPress: () => props.onChip(chip.message)
+          },
+          chip.label
+        )) }) : null
+      ]
+    }
+  );
+});
+var keyOf2 = (item) => item.key;
+function itemType(item) {
+  if (item.type === "card") return `card:${item.card.kind}`;
+  if (item.type === "message")
+    return item.state === "streaming" ? "streaming" : `message:${item.role}`;
+  return "system";
+}
+function authorOf(item) {
+  return item?.type === "message" ? item.role : null;
+}
+function carousels(items, previous) {
+  const groups = /* @__PURE__ */ new Map();
+  for (const item of items) {
+    if (item.type !== "card") continue;
+    const group = item.card.card.group;
+    if (group?.layout !== "carousel" || typeof group.id !== "string") continue;
+    const id = `${item.card.turnId ?? ""}\0${group.id}`;
+    const members = groups.get(id);
+    if (members) members.push(item);
+    else groups.set(id, [item]);
+  }
+  const runs = /* @__PURE__ */ new Map();
+  const inside = /* @__PURE__ */ new Set();
+  for (const run of groups.values()) {
+    if (run.length < 2) continue;
+    const key = run[0]?.key;
+    const before = previous.get(key);
+    runs.set(
+      key,
+      before && before.length === run.length && before.every((c, n) => c === run[n]) ? before : run
+    );
+    for (const card of run.slice(1)) inside.add(card.key);
+  }
+  return { runs, inside };
+}
+var Row = /* @__PURE__ */ memo(function Row2(props) {
+  const { item } = props;
+  const { slots } = useChat();
+  const Group = slots.CardGroup;
+  if (props.inside) return null;
+  if (props.run && Group) return /* @__PURE__ */ jsx(Group, { items: props.run });
+  if (item.type === "card") return /* @__PURE__ */ jsx(CardView, { item });
+  if (item.type === "system") return /* @__PURE__ */ jsx(SystemRow, { item });
+  return item.state === "streaming" ? /* @__PURE__ */ jsx(StreamingBubble, { item, showAuthor: props.showAuthor }) : /* @__PURE__ */ jsx(MessageBubble, { item, showAuthor: props.showAuthor });
+});
+var MessageList = /* @__PURE__ */ memo(function MessageList2() {
+  const { store, slots, starters, handlers, imagePolicy } = useChat();
+  const { t } = useCopy();
+  const { space } = useTheme();
+  const reducedMotion = useReducedMotion();
+  const items = useConversationSelector(store, (v) => v.items);
+  usePrefetchPhotos(items, handlers.current?.prefetchImage, imagePolicy?.hosts);
+  const opening = useConversationSelector(
+    store,
+    (v) => v.status === "starting" || v.status === "connecting"
+  );
+  const agentName = useConversationSelector(store, (v) => v.agent.name);
+  const served = useConversationSelector(store, (v) => v.welcome);
+  const welcome = useMemo(
+    () => served ?? (starters?.length ? {
+      text: t("welcomeFallback", {
+        agent: agentName ?? t("agentFallbackName")
+      }),
+      chips: [...starters]
+    } : null),
+    [served, starters, t, agentName]
+  );
+  useAnnounceReplies(items);
+  const Group = slots.CardGroup;
+  const runsRef = useRef(/* @__PURE__ */ new Map());
+  const grouping = useMemo(
+    () => Group ? carousels(items, runsRef.current) : null,
+    [items, Group]
+  );
+  runsRef.current = grouping?.runs ?? /* @__PURE__ */ new Map();
+  const itemsRef = useRef(items);
+  itemsRef.current = items;
+  const groupingRef = useRef(grouping);
+  groupingRef.current = grouping;
+  const renderItem = useCallback(
+    ({ item, index }) => /* @__PURE__ */ jsx(
+      Row,
+      {
+        item,
+        showAuthor: authorOf(item) !== authorOf(itemsRef.current[index - 1]),
+        run: groupingRef.current?.runs.get(item.key),
+        inside: groupingRef.current?.inside.has(item.key) === true
+      }
+    ),
+    []
+  );
+  const onChip = useCallback(
+    (message) => {
+      store.send(message);
+      const chip = welcome?.chips.find((c) => c.message === message);
+      if (chip) handlers.current?.onChip?.(chip);
+    },
+    [store, welcome, handlers]
+  );
+  const Empty = slots.EmptyState;
+  const empty = opening ? /* @__PURE__ */ jsx(ChatSkeleton, {}) : Empty ? /* @__PURE__ */ jsx(
+    Empty,
+    {
+      agentName: agentName ?? t("agentFallbackName"),
+      welcome,
+      onChip
+    }
+  ) : welcome ? /* @__PURE__ */ jsx(Welcome, { welcome, onChip }) : null;
+  const props = useMemo(
+    () => ({
+      data: items,
+      renderItem,
+      keyExtractor: keyOf2,
+      getItemType: itemType,
+      maintainVisibleContentPosition: {
+        startRenderingFromBottom: true,
+        autoscrollToBottomThreshold: 0.2,
+        animateAutoScrollToBottom: !reducedMotion
+      },
+      ListFooterComponent: /* @__PURE__ */ jsx(ActivityLine, {}),
+      ListEmptyComponent: empty,
+      keyboardShouldPersistTaps: "handled",
+      contentContainerStyle: { paddingVertical: space.sm }
+    }),
+    [items, renderItem, reducedMotion, empty, space.sm]
+  );
+  const List = slots.ListComponent;
+  return List ? /* @__PURE__ */ jsx(List, { ...props }) : /* @__PURE__ */ jsx(FlashList, { ...props });
+});
+function usePrefetchPhotos(items, prefetch, hosts) {
+  const done = useRef(/* @__PURE__ */ new Set());
+  useEffect(() => {
+    if (!prefetch) return;
+    for (const item of items) {
+      if (item.type !== "card") continue;
+      const card = item.card.card;
+      const url = allowedImage(card.images?.[0]?.url ?? card.image_url, hosts);
+      if (url && !done.current.has(url)) {
+        done.current.add(url);
+        prefetch(url);
+      }
+    }
+  }, [items, prefetch, hosts]);
+}
+function useAnnounceReplies(items) {
+  const seen = useRef(void 0);
+  const { t } = useCopy();
+  const { store, handlers } = useChat();
+  useEffect(() => {
+    const last = items.at(-1);
+    if (seen.current === void 0) {
+      seen.current = last?.key ?? "";
+      return;
+    }
+    if (last?.type !== "message" || last.role === "person") return;
+    if (last.state !== "sent" || last.key === seen.current) return;
+    seen.current = last.key;
+    const author = last.role === "staff" ? t("staffLabel", {
+      by: store.getSnapshot().takeover?.by || t("staffFallbackRole")
+    }) : store.getSnapshot().agent.name ?? t("agentFallbackName");
+    (handlers.current?.announce ?? announce)(`${author}: ${last.text}`);
+  }, [items, t, store, handlers]);
+}
+
+export { ActivityLine, Avatar, Button, CardActions, CardCarousel, CardFrame, CardView, ChatContextProvider, ChatHeader, ChatSkeleton, DefaultBubble, DefaultHeader, DefaultTurnFailed, DisclosureBar, FailureActionButton, FailureSlot, InfoCard, LinksCard, ListingCard, MessageBubble, MessageList, NextStepCard, ProposalCard, QuestionCard, Row, StreamingBubble, SystemRow, TimeSlotsCard, Welcome, allowedImage, answerText, carousels, defaultCard, fieldText, itemType, monogram, ratingText, useChat };
+//# sourceMappingURL=chunk-KSHDF3MG.js.map
+//# sourceMappingURL=chunk-KSHDF3MG.js.map