@vvedantb/native-ui 0.17.2 → 0.18.0

package/dist/entries/primitives.js

@@ -0,0 +1,57 @@
+// `@vvedantb/native-ui/primitives`: fields, display, tabs, overlays and
+// toasts. `BottomSheetContainer`, `DateTimeField` and `AmbientBackground` are
+// not here; they have their own entries. `Text` and `TextClassContext` are the
+// `primitives/text` variants (from 0.5.0); they are not on the root entry.
+export { Text, TextClassContext } from "../primitives/text";
+export { Button } from "../Button";
+export { Input } from "../Input";
+export { SearchInput } from "../SearchInput";
+export { PasswordInput } from "../PasswordInput";
+export { Textarea } from "../Textarea";
+export { Label } from "../Label";
+export { Select } from "../Select";
+export { Switch } from "../Switch";
+export { LabeledSwitchRow } from "../LabeledSwitchRow";
+export { Checkbox } from "../Checkbox";
+export { Badge } from "../Badge";
+export { StatusDot } from "../StatusDot";
+export { ColorSwatches } from "../ColorSwatches";
+export { StatGrid } from "../StatGrid";
+export { SectionLabel } from "../SectionLabel";
+export { SheetRow } from "../SheetRow";
+export { PageIndicator } from "../PageIndicator";
+export { IconButton } from "../IconButton";
+export { CaptureButton } from "../CaptureButton";
+export { Separator } from "../Separator";
+export { KeyboardAvoidingView } from "../primitives/keyboard-parts";
+export { Progress } from "../Progress";
+export { Spinner, CenteredSpinner } from "../Spinner";
+export { LoadingState } from "../LoadingState";
+export { Avatar, AvatarImage, AvatarFallback } from "../Avatar";
+export { initials } from "../initials";
+export { formatCompactRelativeTime } from "../relativeTime";
+export { Chip } from "../Chip";
+export { PillTabs } from "../PillTabs";
+export { Pager } from "../Pager";
+export { Tabs, TabsList, TabsTrigger, TabsContent } from "../Tabs";
+export { ListRow } from "../ListRow";
+export { DividedList, ListDivider } from "../DividedList";
+export { SwipeableRow } from "../SwipeableRow";
+export { closeSwipeRows, swipeActionsAccessibility } from "../swipeRow";
+export { ImageGallery, ImageViewer } from "../media/ImageGallery";
+export { MediaCard } from "../media/MediaCard";
+export { imageAspect, imageGridTiles, imageViewerPage, MEDIA } from "../media/imageGrid";
+export { SurfaceRow, SURFACE_ROW } from "../SurfaceRow";
+export { HeaderIconButton } from "../HeaderIconButton";
+export { ThemeToggle } from "../ThemeToggle";
+export { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter } from "../Card";
+export { Skeleton, CardSkeleton, SkeletonList, SkeletonRow } from "../Skeleton";
+export { EmptyState } from "../EmptyState";
+export { Dialog, DialogTrigger, DialogClose, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogBody, DialogFooter } from "../Dialog";
+export { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogAction, AlertDialogCancel } from "../AlertDialog";
+export { ConfirmDialog } from "../ConfirmDialog";
+export { BulkActionBar, BULK_BAR_LABEL_MIN_WIDTH } from "../BulkActionBar";
+export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuLabel, DropdownMenuItem, DropdownMenuRadioItem, DropdownMenuSeparator } from "../DropdownMenu";
+export { Sheet, SheetTrigger, SheetClose, SheetContent, SheetHandle, SheetHeader, SheetTitle, SheetDescription, SheetBody, SheetFooter } from "../Sheet";
+export { Toaster } from "../Toast";
+export { toast } from "../toastStore";

package/dist/entries/search-input.js

@@ -0,0 +1,3 @@
+// `@vvedantb/native-ui/search-input`: `SearchInput` on its own. Reaches no
+// optional peer, not even a loader.
+export { SearchInput } from "../SearchInput";

package/dist/entries/tab-bar.js

@@ -0,0 +1,4 @@
+// `@vvedantb/native-ui/tab-bar`. Does not import `expo-router`; reaches
+// `expo-blur` and `expo-haptics` only through their optional-peer loaders.
+export { FloatingTabBar } from "../FloatingTabBar";
+export { FLOATING_INSET, FLOATING_TAB_BAR_HEIGHT, FLOATING_TAB_BAR_HEIGHT_LARGE, tabBarReserve } from "../floating";

package/dist/entries/theme.js

@@ -0,0 +1,7 @@
+// `@vvedantb/native-ui/theme`: the provider, tokens and colour helpers.
+export { cn } from "../cn";
+export { tokens, NativeUiProvider, useNativeUi, useLargerText, useAccentColor, DEFAULT_ACCENT } from "../theme";
+export { palette, withAlpha } from "../palette";
+export { configureTheme } from "../configureTheme";
+export { fontClass, fontFamily } from "../typography";
+export { PINK_50, PINK_100, PINK_600, PINK_700, NEUTRAL_100, NEUTRAL_500, NEUTRAL_900, Colors } from "../colors";

package/dist/entries/toast.js

@@ -0,0 +1,5 @@
+// `@vvedantb/native-ui/toast`: `toast()` and `<Toaster />`. Reaches no heavy
+// optional peer, not even a loader (the toast surface is flat from 0.3.12): no
+// `expo-blur`, bottom sheet, date picker, `dayjs` or `expo-router`.
+export { Toaster } from "../Toast";
+export { toast } from "../toastStore";

package/dist/entries/video.js

@@ -0,0 +1,3 @@
+// `@vvedantb/native-ui/video`. Imports `expo-video` (an optional peer): the
+// only entry that does, so an app without it bundles no video player.
+export { InlineVideo, INLINE_VIDEO_ASPECT } from "../video/InlineVideo";

package/dist/entries/webview.js

@@ -0,0 +1,4 @@
+// `@vvedantb/native-ui/webview`. Imports `react-native-webview` (an optional
+// peer): the only entry that does, so an app without it bundles no WebView.
+export { HtmlView } from "../webview/HtmlView";
+export { HTML_VIEW_HEIGHT_SCRIPT, htmlViewNavigation, htmlViewPostScript, parseHtmlViewHeight } from "../webview/htmlView";

package/dist/examples/AiChatGallery.jsx

@@ -0,0 +1,509 @@
+import { c as _c } from "react/compiler-runtime";
+// Reference screen for the AI chat parts (`@vvedantb/native-ui/ai`). Render
+// `AiChatGallery` in a full-screen Expo route, with the same NativeWind setup
+// as the rest of the package and a `SafeAreaProvider` above it. The thread is
+// fixed sample text, not a model. It follows the app's larger-text setting.
+// `ParityGallery` shows `AiChatSamples` in its "AI chat" section.
+import { useState } from "react";
+import { View } from "react-native";
+import { IconFileText, IconPaperclip, IconSearch } from "@tabler/icons-react-native";
+import { ActivityStep, AgentTrace, AgentTraceCollapsible, AgentTraceCollapsibleContent, AgentTraceCollapsibleTrigger, AgentTraceDescription, AgentTraceIcon, AgentTraceLine, AgentTraceTitle, Attachment, Attachments, CodeBlock, Conversation, ConversationContent, ConversationScrollButton, FileChip, Message, MessageAction, MessageActionsBar, MessageContent, PromptInput, PromptInputButton, Reasoning, ReasoningContent, ReasoningTrigger, ResponseText, Source, Sources, SourcesContent, SourcesTrigger, Suggestion, Suggestions, SubagentResultCard, SubagentRunCard, ToolApprovalCard, ToolDraftCard, formatElapsed, useStreamingDisclosure } from "../ai";
+const SUGGESTIONS = ["Summarise this thread", "Draft a reply", "List the next steps", "Explain it more simply"];
+const SAMPLE_ATTACHMENTS = [{
+  id: "notes",
+  filename: "meeting-notes.pdf",
+  mediaType: "application/pdf"
+}, {
+  id: "sketch",
+  filename: "sketch.png",
+  mediaType: "image/png"
+}];
+const FINISHED_REASONING = "The question is how to keep one list the same on two devices.\nCompare a shared server copy with device-to-device sync, then suggest the simpler one.";
+const FINISHED_REPLY = "Keep one copy of the list on a server and have each device read and write it.\n\nWhen a device changes an item, it sends the change with a timestamp. The other device fetches changes it has not seen.";
+const SAMPLE_CODE = `type Change = {\n  itemId: string;\n  updatedAt: number;\n};`;
+const STREAMING_REASONING = "Offline edits need to wait in a queue on the device.\nWhen the connection returns, send the queue in order and merge by timestamp…";
+
+/**
+ * The sample thread: a user message, a finished assistant message (folded
+ * reasoning and trace, reply, code, sources and actions), a second user
+ * message, and an assistant message that is still working while `streaming`.
+ */
+const DRAFT_FIELDS = [{
+  key: "to",
+  role: "to",
+  value: "team@example.com"
+}, {
+  key: "subject",
+  role: "subject",
+  value: "Weekly plan"
+}, {
+  key: "body",
+  role: "body",
+  value: "Here is the plan for next week."
+}];
+const RUN_STATUSES = ["queued", "running", "done", "failed", "cancelled", "timed_out"];
+
+/** Tool approval, draft and subagent cards, with testIDs for E2E. */
+export function AiCardSamples() {
+  const $ = _c(13);
+  const [decision, setDecision] = useState("none");
+  const [cancelled, setCancelled] = useState(false);
+  let t0;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t0 = name => (choice, edits) => setDecision(`${name}:${choice}${edits ? `:${JSON.stringify(edits)}` : ""}`);
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  const decide = t0;
+  const t1 = `Last decision: ${decision}`;
+  let t2;
+  if ($[1] !== t1) {
+    t2 = <ResponseText>{t1}</ResponseText>;
+    $[1] = t1;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  let t3;
+  if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+    t3 = {
+      title: "Review plan"
+    };
+    $[3] = t3;
+  } else {
+    t3 = $[3];
+  }
+  let t4;
+  if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+    t4 = <ToolApprovalCard testID="gallery-approval" toolName="create_task" args={t3} server="tasks" routineMode={true} expiresLabel="tomorrow" target="Project board" onDecide={decide("approval")} />;
+    $[4] = t4;
+  } else {
+    t4 = $[4];
+  }
+  let t5;
+  let t6;
+  if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
+    t5 = <ToolDraftCard testID="gallery-draft" toolName="send_message" fields={DRAFT_FIELDS} server="mail" expiresLabel="in 2 hours" approveLabel="Send" denyLabel="Discard" onDecide={decide("draft")} />;
+    t6 = RUN_STATUSES.map(status => <SubagentRunCard key={status} testID={`gallery-run-${status}`} title="Research" status={status} elapsedSeconds={65} statusLine={status === "running" ? "Step 2 of 4" : undefined} error={status === "failed" ? "The source could not be reached." : undefined} onCancel={() => setCancelled(true)} />);
+    $[5] = t5;
+    $[6] = t6;
+  } else {
+    t5 = $[5];
+    t6 = $[6];
+  }
+  const t7 = `Cancelled: ${cancelled ? "yes" : "no"}`;
+  let t8;
+  if ($[7] !== t7) {
+    t8 = <ResponseText>{t7}</ResponseText>;
+    $[7] = t7;
+    $[8] = t8;
+  } else {
+    t8 = $[8];
+  }
+  let t9;
+  if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
+    t9 = <SubagentResultCard testID="gallery-result" title="Research" summary="Three sources found." approvalPending={true} approvalPendingIn="Planner" handoffs={[{
+      toolName: "create_task",
+      server: "tasks",
+      argsSummary: "{\"title\":\"Review plan\"}"
+    }]} />;
+    $[9] = t9;
+  } else {
+    t9 = $[9];
+  }
+  let t10;
+  if ($[10] !== t2 || $[11] !== t8) {
+    t10 = <>{t2}{t4}{t5}{t6}{t8}{t9}</>;
+    $[10] = t2;
+    $[11] = t8;
+    $[12] = t10;
+  } else {
+    t10 = $[12];
+  }
+  return t10;
+}
+export function AiChatSamples(t0) {
+  const $ = _c(58);
+  const {
+    streaming: t1
+  } = t0;
+  const streaming = t1 === undefined ? true : t1;
+  const [feedback, setFeedback] = useState(null);
+  const searchFold = useStreamingDisclosure(streaming);
+  let t2;
+  if ($[0] !== feedback) {
+    t2 = kind => setFeedback(feedback === kind ? null : kind);
+    $[0] = feedback;
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+  const toggle = t2;
+  let t3;
+  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+    t3 = <Message from="user"><MessageContent>How do I keep a list in sync across two devices?</MessageContent></Message>;
+    $[2] = t3;
+  } else {
+    t3 = $[2];
+  }
+  let t4;
+  if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+    t4 = <Reasoning duration={8}><ReasoningTrigger /><ReasoningContent>{FINISHED_REASONING}</ReasoningContent></Reasoning>;
+    $[3] = t4;
+  } else {
+    t4 = $[3];
+  }
+  let t5;
+  let t6;
+  if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+    t5 = <AgentTraceIcon icon={IconSearch} />;
+    t6 = <AgentTraceTitle>Used 2 tools</AgentTraceTitle>;
+    $[4] = t5;
+    $[5] = t6;
+  } else {
+    t5 = $[4];
+    t6 = $[5];
+  }
+  let t7;
+  if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+    t7 = <AgentTraceCollapsibleTrigger><AgentTraceLine>{t5}{t6}<AgentTraceDescription>{`Worked for ${formatElapsed(14)}`}</AgentTraceDescription></AgentTraceLine></AgentTraceCollapsibleTrigger>;
+    $[6] = t7;
+  } else {
+    t7 = $[6];
+  }
+  let t8;
+  if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+    t8 = <ActivityStep icon={IconSearch} label="Searched the web" description="5 results" />;
+    $[7] = t8;
+  } else {
+    t8 = $[7];
+  }
+  let t10;
+  let t11;
+  let t9;
+  if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+    t9 = <AgentTraceCollapsible>{t7}<AgentTraceCollapsibleContent><AgentTrace>{t8}<AgentTraceLine><AgentTraceIcon icon={IconFileText} /><AgentTraceTitle>Read</AgentTraceTitle><FileChip name="sync-notes.md" /></AgentTraceLine></AgentTrace></AgentTraceCollapsibleContent></AgentTraceCollapsible>;
+    t10 = <ResponseText>{FINISHED_REPLY}</ResponseText>;
+    t11 = <CodeBlock language="ts" code={SAMPLE_CODE} onCopy={_temp} />;
+    $[8] = t10;
+    $[9] = t11;
+    $[10] = t9;
+  } else {
+    t10 = $[8];
+    t11 = $[9];
+    t9 = $[10];
+  }
+  let t12;
+  if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
+    t12 = <SourcesTrigger count={2} />;
+    $[11] = t12;
+  } else {
+    t12 = $[11];
+  }
+  let t13;
+  if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
+    t13 = <MessageContent>{t4}{t9}{t10}{t11}<Sources>{t12}<SourcesContent><Source href="https://example.com/sync" title="Syncing data between devices" /><Source href="https://example.com/timestamps" title="Merging changes by timestamp" /></SourcesContent></Sources></MessageContent>;
+    $[12] = t13;
+  } else {
+    t13 = $[12];
+  }
+  let t14;
+  let t15;
+  if ($[13] === Symbol.for("react.memo_cache_sentinel")) {
+    t14 = <MessageAction kind="copy" />;
+    t15 = <MessageAction kind="retry" />;
+    $[13] = t14;
+    $[14] = t15;
+  } else {
+    t14 = $[13];
+    t15 = $[14];
+  }
+  const t16 = feedback === "like";
+  let t17;
+  if ($[15] !== toggle) {
+    t17 = () => toggle("like");
+    $[15] = toggle;
+    $[16] = t17;
+  } else {
+    t17 = $[16];
+  }
+  let t18;
+  if ($[17] !== t16 || $[18] !== t17) {
+    t18 = <MessageAction kind="like" selected={t16} onPress={t17} />;
+    $[17] = t16;
+    $[18] = t17;
+    $[19] = t18;
+  } else {
+    t18 = $[19];
+  }
+  const t19 = feedback === "dislike";
+  let t20;
+  if ($[20] !== toggle) {
+    t20 = () => toggle("dislike");
+    $[20] = toggle;
+    $[21] = t20;
+  } else {
+    t20 = $[21];
+  }
+  let t21;
+  if ($[22] !== t19 || $[23] !== t20) {
+    t21 = <MessageAction kind="dislike" selected={t19} onPress={t20} />;
+    $[22] = t19;
+    $[23] = t20;
+    $[24] = t21;
+  } else {
+    t21 = $[24];
+  }
+  let t22;
+  if ($[25] !== t18 || $[26] !== t21) {
+    t22 = <Message from="assistant">{t13}<MessageActionsBar>{t14}{t15}{t18}{t21}</MessageActionsBar></Message>;
+    $[25] = t18;
+    $[26] = t21;
+    $[27] = t22;
+  } else {
+    t22 = $[27];
+  }
+  let t23;
+  if ($[28] === Symbol.for("react.memo_cache_sentinel")) {
+    t23 = <Message from="user"><MessageContent>And when one device is offline?</MessageContent></Message>;
+    $[28] = t23;
+  } else {
+    t23 = $[28];
+  }
+  let t24;
+  let t25;
+  if ($[29] === Symbol.for("react.memo_cache_sentinel")) {
+    t24 = <ReasoningTrigger />;
+    t25 = <ReasoningContent>{STREAMING_REASONING}</ReasoningContent>;
+    $[29] = t24;
+    $[30] = t25;
+  } else {
+    t24 = $[29];
+    t25 = $[30];
+  }
+  let t26;
+  if ($[31] !== streaming) {
+    t26 = <Reasoning isStreaming={streaming}>{t24}{t25}</Reasoning>;
+    $[31] = streaming;
+    $[32] = t26;
+  } else {
+    t26 = $[32];
+  }
+  let t27;
+  if ($[33] === Symbol.for("react.memo_cache_sentinel")) {
+    t27 = <AgentTraceIcon icon={IconSearch} />;
+    $[33] = t27;
+  } else {
+    t27 = $[33];
+  }
+  const t28 = streaming ? "Searching for offline sync" : "Searched for offline sync";
+  let t29;
+  if ($[34] !== streaming || $[35] !== t28) {
+    t29 = <AgentTraceCollapsibleTrigger><AgentTraceLine>{t27}<AgentTraceTitle shimmer={streaming}>{t28}</AgentTraceTitle></AgentTraceLine></AgentTraceCollapsibleTrigger>;
+    $[34] = streaming;
+    $[35] = t28;
+    $[36] = t29;
+  } else {
+    t29 = $[36];
+  }
+  let t30;
+  if ($[37] === Symbol.for("react.memo_cache_sentinel")) {
+    t30 = <AgentTraceCollapsibleContent>Offline-first sync, change queues, conflict handling</AgentTraceCollapsibleContent>;
+    $[37] = t30;
+  } else {
+    t30 = $[37];
+  }
+  let t31;
+  if ($[38] !== searchFold || $[39] !== t29) {
+    t31 = <AgentTraceCollapsible {...searchFold}>{t29}{t30}</AgentTraceCollapsible>;
+    $[38] = searchFold;
+    $[39] = t29;
+    $[40] = t31;
+  } else {
+    t31 = $[40];
+  }
+  const t32 = streaming ? "Reading sync-notes.md" : "Read sync-notes.md";
+  const t33 = streaming ? "running" : "complete";
+  let t34;
+  if ($[41] !== streaming) {
+    t34 = streaming ? undefined : `Worked for ${formatElapsed(6)}`;
+    $[41] = streaming;
+    $[42] = t34;
+  } else {
+    t34 = $[42];
+  }
+  let t35;
+  if ($[43] !== t32 || $[44] !== t33 || $[45] !== t34) {
+    t35 = <ActivityStep icon={IconFileText} label={t32} status={t33} description={t34} />;
+    $[43] = t32;
+    $[44] = t33;
+    $[45] = t34;
+    $[46] = t35;
+  } else {
+    t35 = $[46];
+  }
+  let t36;
+  if ($[47] !== streaming) {
+    t36 = streaming ? null : <ResponseText>{"Queue each change on the device while it is offline.\n\nWhen it reconnects, send the queue in order. If both devices changed the same item, keep the newer change."}</ResponseText>;
+    $[47] = streaming;
+    $[48] = t36;
+  } else {
+    t36 = $[48];
+  }
+  let t37;
+  if ($[49] !== t26 || $[50] !== t31 || $[51] !== t35 || $[52] !== t36) {
+    t37 = <Message from="assistant"><MessageContent>{t26}{t31}{t35}{t36}</MessageContent></Message>;
+    $[49] = t26;
+    $[50] = t31;
+    $[51] = t35;
+    $[52] = t36;
+    $[53] = t37;
+  } else {
+    t37 = $[53];
+  }
+  let t38;
+  if ($[54] === Symbol.for("react.memo_cache_sentinel")) {
+    t38 = <AiCardSamples />;
+    $[54] = t38;
+  } else {
+    t38 = $[54];
+  }
+  let t39;
+  if ($[55] !== t22 || $[56] !== t37) {
+    t39 = <>{t3}{t22}{t23}{t37}{t38}</>;
+    $[55] = t22;
+    $[56] = t37;
+    $[57] = t39;
+  } else {
+    t39 = $[57];
+  }
+  return t39;
+}
+
+/**
+ * A full chat screen: the sample thread in a `Conversation` with its scroll
+ * button, suggestions, and the composer with sample attachments and an
+ * attach tool. The last message streams until Stop is pressed; then sent
+ * messages are added to the thread.
+ */
+function _temp() {}
+export function AiChatGallery() {
+  const $ = _c(26);
+  const [status, setStatus] = useState("streaming");
+  const [draft, setDraft] = useState("");
+  let t0;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t0 = [];
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  const [sent, setSent] = useState(t0);
+  const [attachments, setAttachments] = useState(SAMPLE_ATTACHMENTS);
+  const t1 = status === "streaming";
+  let t2;
+  if ($[1] !== t1) {
+    t2 = <AiChatSamples streaming={t1} />;
+    $[1] = t1;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  let t3;
+  if ($[3] !== sent) {
+    t3 = sent.map(_temp2);
+    $[3] = sent;
+    $[4] = t3;
+  } else {
+    t3 = $[4];
+  }
+  let t4;
+  if ($[5] !== t2 || $[6] !== t3) {
+    t4 = <ConversationContent>{t2}{t3}</ConversationContent>;
+    $[5] = t2;
+    $[6] = t3;
+    $[7] = t4;
+  } else {
+    t4 = $[7];
+  }
+  let t5;
+  if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+    t5 = <ConversationScrollButton />;
+    $[8] = t5;
+  } else {
+    t5 = $[8];
+  }
+  let t6;
+  if ($[9] !== t4) {
+    t6 = <Conversation>{t4}{t5}</Conversation>;
+    $[9] = t4;
+    $[10] = t6;
+  } else {
+    t6 = $[10];
+  }
+  let t7;
+  if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
+    t7 = <Suggestions className="pt-2" contentContainerClassName="px-3">{SUGGESTIONS.map(suggestion => <Suggestion key={suggestion} suggestion={suggestion} onPress={setDraft} />)}</Suggestions>;
+    $[11] = t7;
+  } else {
+    t7 = $[11];
+  }
+  let t8;
+  if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
+    t8 = () => setStatus("ready");
+    $[12] = t8;
+  } else {
+    t8 = $[12];
+  }
+  let t9;
+  if ($[13] !== sent) {
+    t9 = text_0 => {
+      setSent([...sent, text_0]);
+      setAttachments([]);
+    };
+    $[13] = sent;
+    $[14] = t9;
+  } else {
+    t9 = $[14];
+  }
+  let t10;
+  if ($[15] !== attachments) {
+    t10 = attachments.length > 0 ? <Attachments>{attachments.map(attachment => <Attachment key={attachment.id} data={attachment} onRemove={() => setAttachments(attachments.filter(item => item.id !== attachment.id))} />)}</Attachments> : null;
+    $[15] = attachments;
+    $[16] = t10;
+  } else {
+    t10 = $[16];
+  }
+  let t11;
+  if ($[17] === Symbol.for("react.memo_cache_sentinel")) {
+    t11 = <PromptInputButton icon={IconPaperclip} label="Attach files" onPress={() => setAttachments(SAMPLE_ATTACHMENTS)} />;
+    $[17] = t11;
+  } else {
+    t11 = $[17];
+  }
+  let t12;
+  if ($[18] !== draft || $[19] !== status || $[20] !== t10 || $[21] !== t9) {
+    t12 = <PromptInput value={draft} onChangeText={setDraft} status={status} onStop={t8} onSubmit={t9} header={t10} toolbar={t11} />;
+    $[18] = draft;
+    $[19] = status;
+    $[20] = t10;
+    $[21] = t9;
+    $[22] = t12;
+  } else {
+    t12 = $[22];
+  }
+  let t13;
+  if ($[23] !== t12 || $[24] !== t6) {
+    t13 = <View className="flex-1">{t6}{t7}{t12}</View>;
+    $[23] = t12;
+    $[24] = t6;
+    $[25] = t13;
+  } else {
+    t13 = $[25];
+  }
+  return t13;
+}
+function _temp2(text, index) {
+  return <Message key={`${index}-${text}`} from="user"><MessageContent>{text}</MessageContent></Message>;
+}