{children}
+ failed to load
+ if (isLoading) return loading...
+ return hello {data.name}!
+}`
+
+const preClassNames = cn('[&_.shiki]:bg-transparent!')
+
+const darkModeClassNames = cn(
+ 'dark:[&_.shiki]:text-[var(--shiki-dark)]!',
+ 'dark:[&_.shiki]:[font-style:var(--shiki-dark-font-style)]!',
+ 'dark:[&_.shiki]:[font-weight:var(--shiki-dark-font-weight)]!',
+ 'dark:[&_.shiki]:[text-decoration:var(--shiki-dark-text-decoration)]!',
+ 'dark:[&_.shiki_span]:text-[var(--shiki-dark)]!',
+ 'dark:[&_.shiki_span]:[font-style:var(--shiki-dark-font-style)]!',
+ 'dark:[&_.shiki_span]:[font-weight:var(--shiki-dark-font-weight)]!',
+ 'dark:[&_.shiki_span]:[text-decoration:var(--shiki-dark-text-decoration)]!'
+)
+
+type PageProps = {
+ params: Promise<{
+ lang: keyof typeof copy.metadata
+ }>
+}
+
+const HomePage = async ({ params }: PageProps) => {
+ const { lang } = await params
+ const code = await codeToHtml(exampleCode, {
+ lang: 'javascript',
+ themes: { light: 'github-light', dark: 'github-dark' }
+ })
+
+ return (
+
+
+
+
+ )
+}
+
+export default HomePage
diff --git a/docs/app/[lang]/blog/[...slug]/page.tsx b/docs/app/[lang]/blog/[...slug]/page.tsx
new file mode 100644
index 000000000..4843ebff5
--- /dev/null
+++ b/docs/app/[lang]/blog/[...slug]/page.tsx
@@ -0,0 +1,104 @@
+import { createRelativeLink } from 'fumadocs-ui/mdx'
+import type { Metadata } from 'next'
+import { notFound } from 'next/navigation'
+import { AskAI } from '@/components/geistdocs/ask-ai'
+import { CopyPage } from '@/components/geistdocs/copy-page'
+import {
+ DocsBody,
+ DocsDescription,
+ DocsPage,
+ DocsTitle
+} from '@/components/geistdocs/docs-page'
+import { EditSource } from '@/components/geistdocs/edit-source'
+import { Feedback } from '@/components/geistdocs/feedback'
+import { getMDXComponents } from '@/components/geistdocs/mdx-components'
+import { OpenInChat } from '@/components/geistdocs/open-in-chat'
+import { ScrollTop } from '@/components/geistdocs/scroll-top'
+import { Separator } from '@/components/ui/separator'
+import { getLLMText, getPageImage, blogSource } from '@/lib/geistdocs/source'
+
+import { Bleed } from '@/components/custom/bleed'
+import Authors, { Author } from '@/components/custom/authors'
+import { Welcome } from '@/components/custom/diagrams/welcome'
+import { Pagination } from '@/components/custom/diagrams/pagination'
+import { Infinite } from '@/components/custom/diagrams/infinite'
+import { Cache } from '@/components/custom/diagrams/cache'
+import Link from 'next/link'
+
+const Page = async ({ params }: PageProps<'/[lang]/blog/[...slug]'>) => {
+ const { slug, lang } = await params
+ const page = blogSource.getPage(slug, lang)
+
+ if (!page) {
+ notFound()
+ }
+
+ const markdown = await getLLMText(page)
+ const MDX = page.data.body
+
+ return (
+
+
+
+
+
+
+
+
+
+
+
+ {copy.features[lang].map(feature => (
+
+ {feature}
+
+ ))}
+
+
+ {/** biome-ignore lint/performance/noImgElement: "Required for Satori" */}
+ 
+
,
+ {
+ width: 1200,
+ height: 628,
+ fonts: [
+ {
+ name: "Geist",
+ data: regularFont,
+ weight: 400,
+ },
+ {
+ name: "Geist",
+ data: semiboldFont,
+ weight: 500,
+ },
+ ],
+ }
+ );
+};
+
+export const generateStaticParams = async ({
+ params,
+}: RouteContext<"/[lang]/og/[...slug]">) => {
+ const { lang } = await params;
+
+ return source.getPages(lang).map((page) => ({
+ lang: page.locale,
+ slug: getPageImage(page).segments,
+ }));
+};
diff --git a/docs/app/[lang]/rss.xml/route.ts b/docs/app/[lang]/rss.xml/route.ts
new file mode 100644
index 000000000..f0c7a9c84
--- /dev/null
+++ b/docs/app/[lang]/rss.xml/route.ts
@@ -0,0 +1,46 @@
+import { Feed } from "feed";
+import type { NextRequest } from "next/server";
+import { title } from "@/geistdocs";
+import { source } from "@/lib/geistdocs/source";
+
+const protocol = process.env.NODE_ENV === "production" ? "https" : "http";
+const baseUrl = `${protocol}://${process.env.NEXT_PUBLIC_VERCEL_PROJECT_PRODUCTION_URL}`;
+
+export const revalidate = false;
+
+export const GET = async (
+ _req: NextRequest,
+ { params }: RouteContext<"/[lang]/rss.xml">
+) => {
+ const { lang } = await params;
+ const feed = new Feed({
+ title,
+ id: baseUrl,
+ link: baseUrl,
+ language: lang,
+ copyright: `All rights reserved ${new Date().getFullYear()}, Vercel`,
+ });
+
+ for (const page of source.getPages(lang)) {
+ feed.addItem({
+ id: page.url,
+ title: page.data.title,
+ description: page.data.description,
+ link: `${baseUrl}${page.url}`,
+ date: new Date(page.data.lastModified ?? new Date()),
+ author: [
+ {
+ name: "Vercel",
+ },
+ ],
+ });
+ }
+
+ const rss = feed.rss2();
+
+ return new Response(rss, {
+ headers: {
+ "Content-Type": "application/rss+xml",
+ },
+ });
+};
diff --git a/docs/app/actions/feedback/emotions.ts b/docs/app/actions/feedback/emotions.ts
new file mode 100644
index 000000000..cfc733b4c
--- /dev/null
+++ b/docs/app/actions/feedback/emotions.ts
@@ -0,0 +1,18 @@
+export const emotions = [
+ {
+ name: "cry",
+ emoji: "😭",
+ },
+ {
+ name: "sad",
+ emoji: "😕",
+ },
+ {
+ name: "happy",
+ emoji: "🙂",
+ },
+ {
+ name: "amazed",
+ emoji: "🤩",
+ },
+];
diff --git a/docs/app/actions/feedback/index.ts b/docs/app/actions/feedback/index.ts
new file mode 100644
index 000000000..058ed41d5
--- /dev/null
+++ b/docs/app/actions/feedback/index.ts
@@ -0,0 +1,43 @@
+"use server";
+
+import { headers } from "next/headers";
+import type { Feedback } from "@/components/geistdocs/feedback";
+import { emotions } from "./emotions";
+
+const protocol = process.env.NODE_ENV === "production" ? "https" : "http";
+const baseUrl = `${protocol}://${process.env.NEXT_PUBLIC_VERCEL_PROJECT_PRODUCTION_URL}`;
+
+export const sendFeedback = async (
+ url: string,
+ feedback: Feedback
+): Promise<{ success: boolean }> => {
+ const emoji = emotions.find((e) => e.name === feedback.emotion)?.emoji;
+ const endpoint = new URL("/feedback", "https://geistdocs.com/feedback");
+ const headersList = await headers();
+
+ const response = await fetch(endpoint, {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ body: JSON.stringify({
+ note: feedback.message,
+ url: new URL(url, baseUrl).toString(),
+ emotion: emoji,
+ ua: headersList.get("user-agent") ?? undefined,
+ ip: headersList.get("x-real-ip") || headersList.get("x-forwarded-for"),
+ }),
+ });
+
+ if (!response.ok) {
+ const error = await response.json();
+
+ console.error(error);
+
+ return { success: false };
+ }
+
+ return {
+ success: true,
+ };
+};
diff --git a/docs/app/api/chat/route.ts b/docs/app/api/chat/route.ts
new file mode 100644
index 000000000..8c4930bd0
--- /dev/null
+++ b/docs/app/api/chat/route.ts
@@ -0,0 +1,116 @@
+import {
+ convertToModelMessages,
+ createUIMessageStream,
+ createUIMessageStreamResponse,
+ stepCountIs,
+ streamText,
+} from "ai";
+import { createTools } from "./tools";
+import type { MyUIMessage } from "./types";
+import { createSystemPrompt } from "./utils";
+
+export const maxDuration = 800;
+
+type RequestBody = {
+ messages: MyUIMessage[];
+ currentRoute: string;
+ pageContext?: {
+ title: string;
+ url: string;
+ content: string;
+ };
+};
+
+export async function POST(req: Request) {
+ try {
+ const { messages, currentRoute, pageContext }: RequestBody =
+ await req.json();
+
+ // Filter out UI-only page context messages (they're just visual feedback)
+ const actualMessages = messages.filter(
+ (msg) => !msg.metadata?.isPageContext
+ );
+
+ // If pageContext is provided, prepend it to the last user message
+ let processedMessages = actualMessages;
+
+ if (pageContext && actualMessages.length > 0) {
+ const lastMessage = actualMessages.at(-1);
+
+ if (!lastMessage) {
+ return new Response(
+ JSON.stringify({
+ error: "No last message found",
+ }),
+ { status: 500 }
+ );
+ }
+
+ if (lastMessage.role === "user") {
+ // Extract text content from the message parts
+ const userQuestion = lastMessage.parts
+ .filter((part) => part.type === "text")
+ .map((part) => part.text)
+ .join("\n");
+
+ processedMessages = [
+ ...actualMessages.slice(0, -1),
+ {
+ ...lastMessage,
+ parts: [
+ {
+ type: "text",
+ text: `Here's the content from the current page:
+
+**Page:** ${pageContext.title}
+**URL:** ${pageContext.url}
+
+---
+
+${pageContext.content}
+
+---
+
+User question: ${userQuestion}`,
+ },
+ ],
+ },
+ ];
+ }
+ }
+
+ const stream = createUIMessageStream({
+ originalMessages: messages,
+ execute: ({ writer }) => {
+ const result = streamText({
+ model: "openai/gpt-4.1-mini",
+ messages: convertToModelMessages(processedMessages),
+ stopWhen: stepCountIs(10),
+ tools: createTools(writer),
+ system: createSystemPrompt(currentRoute),
+ prepareStep: ({ stepNumber }) => {
+ if (stepNumber === 0) {
+ return { toolChoice: { type: "tool", toolName: "search_docs" } };
+ }
+ },
+ });
+
+ writer.merge(result.toUIMessageStream());
+ },
+ });
+
+ return createUIMessageStreamResponse({ stream });
+ } catch (error) {
+ console.error("AI chat API error:", error);
+
+ return new Response(
+ JSON.stringify({
+ error: "Failed to process chat request. Please try again.",
+ }),
+ {
+ status: 500,
+ headers: { "Content-Type": "application/json" },
+ }
+ );
+ }
+}
diff --git a/docs/app/api/chat/tools.ts b/docs/app/api/chat/tools.ts
new file mode 100644
index 000000000..9d59eae68
--- /dev/null
+++ b/docs/app/api/chat/tools.ts
@@ -0,0 +1,222 @@
+import { type ToolSet, tool, type UIMessageStreamWriter } from "ai";
+import { initAdvancedSearch } from "fumadocs-core/search/server";
+import z from "zod";
+import { i18n } from "@/lib/geistdocs/i18n";
+import { source } from "@/lib/geistdocs/source";
+
+const createSearchServer = (lang: string) => {
+ const pages = source.getPages(lang);
+
+ return initAdvancedSearch({
+ indexes: pages.map((page) => ({
+ title: page.data.title,
+ description: page.data.description,
+ url: page.url,
+ id: page.url,
+ structuredData: page.data.structuredData,
+ })),
+ });
+};
+
+const log = (message: string) => {
+ console.log(`🤖 [Geistdocs] ${message}`);
+};
+
+const search_docs = (writer: UIMessageStreamWriter) =>
+ tool({
+ description: "Search through documentation content by query",
+ inputSchema: z.object({
+ query: z.string().describe("Search query to find relevant documentation"),
+ lang: z
+ .string()
+ .describe("The two letter language code of the documentation to search")
+ .optional()
+ .default(i18n.defaultLanguage),
+ }),
+ execute: async ({ query, lang }) => {
+ try {
+ log(`Creating search server for language: ${lang}`);
+
+ const searchServer = createSearchServer(lang);
+
+ log(`Searching docs for ${query}`);
+
+ const results = await searchServer.search(query);
+
+ log(`Found ${results.length} results`);
+
+ if (results.length === 0) {
+ return {
+ content: [
+ {
+ type: "text",
+ text: `No documentation found for query: "${query}"`,
+ },
+ ],
+ };
+ }
+
+ log(`Processing ${results.length} results...`);
+
+ const promises = results.map(({ url }) => {
+ const segments = url.split("#").at(0)?.split("/") ?? [];
+
+ if (segments.length === 0) {
+ log(`🤖 [Geistdocs] No segments found for ${url}, skipping...`);
+ return null;
+ }
+
+ log(`Getting page for ${url}`);
+
+ const result = source.getPageByHref(url, { language: lang });
+
+ if (!result?.page) {
+ log(`No page found for ${url}`);
+ return null;
+ }
+
+ const { page } = result;
+
+ log(
+ `Found page for ${url}: ${page.data.title}, ${page.data.description}`
+ );
+
+ return {
+ title: page.data.title,
+ description: page.data.description,
+ content: JSON.stringify(page.data.structuredData.contents),
+ slug: page.url,
+ };
+ });
+
+ log(`Running ${promises.length} promises...`);
+
+ const promiseResults = await Promise.all(promises);
+
+ log(`${promiseResults.length} promises resolved.`);
+
+ // Collect results, then filter to ensure unique slugs
+ const formattedResultsRaw = promiseResults.filter(Boolean) as {
+ title: string;
+ description: string;
+ content: string;
+ slug: string;
+ }[];
+
+ log(`Formatted ${formattedResultsRaw.length} results.`);
+
+ // Ensure slugs are unique
+ const seenSlugs = new Set
+
+
+ {title}
+
+
+ {description}
+
+
+
+
+
+
+ {children && (
+
+
+ {children}
+
+ )}
+
+ {children ?? (
+ <>
+ {icon &&
+);
+
+export type ConversationScrollButtonProps = ComponentProps{icon}
}
+
+
+
+ )}
+ {title}
+ {description && ( +{description}
+ )} +
+ {children}
+
+);
+
+export type MessageActionsProps = ComponentProps<"div">;
+
+export const MessageActions = ({
+ className,
+ children,
+ ...props
+}: MessageActionsProps) => (
+
+ {children}
+
+);
+
+export type MessageActionProps = ComponentProps{tooltip}
+div]:pb-0", className)}
+ {...props}
+ />
+
+ );
+};
+
+export type MessageBranchContentProps = HTMLAttributes;
+
+export const MessageBranchContent = ({
+ children,
+ ...props
+}: MessageBranchContentProps) => {
+ const { currentBranch, setBranches, branches } = useMessageBranch();
+ const childrenArray = Array.isArray(children) ? children : [children];
+
+ // Use useEffect to update branches when they change
+ useEffect(() => {
+ if (branches.length !== childrenArray.length) {
+ setBranches(childrenArray);
+ }
+ }, [childrenArray, branches, setBranches]);
+
+ return childrenArray.map((branch, index) => (
+ & {
+ from: UIMessage["role"];
+};
+
+export const MessageBranchSelector = ({
+ className,
+ from,
+ ...props
+}: MessageBranchSelectorProps) => {
+ const { totalBranches } = useMessageBranch();
+
+ // Don't render if there's only one branch
+ if (totalBranches <= 1) {
+ return null;
+ }
+
+ return (
+ ;
+
+export const MessageBranchPrevious = ({
+ children,
+ ...props
+}: MessageBranchPreviousProps) => {
+ const { goToPrevious, totalBranches } = useMessageBranch();
+
+ return (
+
+ );
+};
+
+export type MessageBranchNextProps = ComponentProps;
+
+export const MessageBranchNext = ({
+ children,
+ className,
+ ...props
+}: MessageBranchNextProps) => {
+ const { goToNext, totalBranches } = useMessageBranch();
+
+ return (
+
+ );
+};
+
+export type MessageBranchPageProps = HTMLAttributes;
+
+export const MessageBranchPage = ({
+ className,
+ ...props
+}: MessageBranchPageProps) => {
+ const { currentBranch, totalBranches } = useMessageBranch();
+
+ return (
+
+ {currentBranch + 1} of {totalBranches}
+
+ );
+};
+
+export type MessageResponseProps = ComponentProps;
+
+export const MessageResponse = memo(
+ ({ className, ...props }: MessageResponseProps) => (
+ *:first-child]:mt-0 [&>*:last-child]:mb-0",
+ className
+ )}
+ {...props}
+ />
+ ),
+ (prevProps, nextProps) => prevProps.children === nextProps.children
+);
+
+MessageResponse.displayName = "MessageResponse";
+
+export type MessageAttachmentProps = HTMLAttributes & {
+ data: FileUIPart;
+ className?: string;
+ onRemove?: () => void;
+};
+
+export function MessageAttachment({
+ data,
+ className,
+ onRemove,
+ ...props
+}: MessageAttachmentProps) {
+ const filename = data.filename || "";
+ const mediaType =
+ data.mediaType?.startsWith("image/") && data.url ? "image" : "file";
+ const isImage = mediaType === "image";
+ const attachmentLabel = filename || (isImage ? "Image" : "Attachment");
+
+ return (
+ & {
+ query: string;
+};
+
+export const OpenIn = ({ query, ...props }: OpenInProps) => (
+
+
+);
+
+export type OpenInContentProps = ComponentProps;
+
+export const OpenInContent = ({ className, ...props }: OpenInContentProps) => (
+ ;
+
+export const OpenInItem = (props: OpenInItemProps) => (
+ ;
+
+export const OpenInLabel = (props: OpenInLabelProps) => (
+ ;
+
+export const OpenInSeparator = (props: OpenInSeparatorProps) => (
+ ;
+
+export const OpenInTrigger = ({ children, ...props }: OpenInTriggerProps) => (
+
+ {children ?? (
+
+ )}
+
+);
+
+export type OpenInChatGPTProps = ComponentProps;
+
+export const OpenInChatGPT = (props: OpenInChatGPTProps) => {
+ const { query } = useOpenInContext();
+ return (
+
+
+ {providers.chatgpt.icon}
+ {providers.chatgpt.title}
+
+ );
+};
+
+export type OpenInClaudeProps = ComponentProps;
+
+export const OpenInClaude = (props: OpenInClaudeProps) => {
+ const { query } = useOpenInContext();
+ return (
+
+
+ {providers.claude.icon}
+ {providers.claude.title}
+
+ );
+};
+
+export type OpenInT3Props = ComponentProps;
+
+export const OpenInT3 = (props: OpenInT3Props) => {
+ const { query } = useOpenInContext();
+ return (
+
+
+ {providers.t3.icon}
+ {providers.t3.title}
+
+ );
+};
+
+export type OpenInSciraProps = ComponentProps;
+
+export const OpenInScira = (props: OpenInSciraProps) => {
+ const { query } = useOpenInContext();
+ return (
+
+
+ {providers.scira.icon}
+ {providers.scira.title}
+
+ );
+};
+
+export type OpenInv0Props = ComponentProps;
+
+export const OpenInv0 = (props: OpenInv0Props) => {
+ const { query } = useOpenInContext();
+ return (
+
+
+ {providers.v0.icon}
+ {providers.v0.title}
+
+ );
+};
+
+export type OpenInCursorProps = ComponentProps;
+
+export const OpenInCursor = (props: OpenInCursorProps) => {
+ const { query } = useOpenInContext();
+ return (
+
+
+ {providers.cursor.icon}
+ {providers.cursor.title}
+
+ );
+};
diff --git a/docs/components/ai-elements/prompt-input.tsx b/docs/components/ai-elements/prompt-input.tsx
new file mode 100644
index 000000000..deff1c483
--- /dev/null
+++ b/docs/components/ai-elements/prompt-input.tsx
@@ -0,0 +1,1377 @@
+"use client";
+
+import { Button } from "@/components/ui/button";
+import {
+ Command,
+ CommandEmpty,
+ CommandGroup,
+ CommandInput,
+ CommandItem,
+ CommandList,
+ CommandSeparator,
+} from "@/components/ui/command";
+import {
+ DropdownMenu,
+ DropdownMenuContent,
+ DropdownMenuItem,
+ DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+import {
+ HoverCard,
+ HoverCardContent,
+ HoverCardTrigger,
+} from "@/components/ui/hover-card";
+import {
+ InputGroup,
+ InputGroupAddon,
+ InputGroupButton,
+ InputGroupTextarea,
+} from "@/components/ui/input-group";
+import {
+ Select,
+ SelectContent,
+ SelectItem,
+ SelectTrigger,
+ SelectValue,
+} from "@/components/ui/select";
+import { cn } from "@/lib/utils";
+import type { ChatStatus, FileUIPart } from "ai";
+import {
+ CornerDownLeftIcon,
+ ImageIcon,
+ Loader2Icon,
+ MicIcon,
+ PaperclipIcon,
+ PlusIcon,
+ SquareIcon,
+ XIcon,
+} from "lucide-react";
+import { nanoid } from "nanoid";
+import {
+ type ChangeEvent,
+ type ChangeEventHandler,
+ Children,
+ type ClipboardEventHandler,
+ type ComponentProps,
+ createContext,
+ type FormEvent,
+ type FormEventHandler,
+ Fragment,
+ type HTMLAttributes,
+ type KeyboardEventHandler,
+ type PropsWithChildren,
+ type ReactNode,
+ type RefObject,
+ useCallback,
+ useContext,
+ useEffect,
+ useMemo,
+ useRef,
+ useState,
+} from "react";
+// ============================================================================
+// Provider Context & Types
+// ============================================================================
+
+export type AttachmentsContext = {
+ files: (FileUIPart & { id: string })[];
+ add: (files: File[] | FileList) => void;
+ remove: (id: string) => void;
+ clear: () => void;
+ openFileDialog: () => void;
+ fileInputRef: RefObject;
+};
+
+export type TextInputContext = {
+ value: string;
+ setInput: (v: string) => void;
+ clear: () => void;
+};
+
+export type PromptInputControllerProps = {
+ textInput: TextInputContext;
+ attachments: AttachmentsContext;
+ /** INTERNAL: Allows PromptInput to register its file textInput + "open" callback */
+ __registerFileInput: (
+ ref: RefObject,
+ open: () => void
+ ) => void;
+};
+
+const PromptInputController = createContext(
+ null
+);
+const ProviderAttachmentsContext = createContext(
+ null
+);
+
+export const usePromptInputController = () => {
+ const ctx = useContext(PromptInputController);
+ if (!ctx) {
+ throw new Error(
+ "Wrap your component inside to use usePromptInputController()."
+ );
+ }
+ return ctx;
+};
+
+// Optional variants (do NOT throw). Useful for dual-mode components.
+const useOptionalPromptInputController = () =>
+ useContext(PromptInputController);
+
+export const useProviderAttachments = () => {
+ const ctx = useContext(ProviderAttachmentsContext);
+ if (!ctx) {
+ throw new Error(
+ "Wrap your component inside to use useProviderAttachments()."
+ );
+ }
+ return ctx;
+};
+
+const useOptionalProviderAttachments = () =>
+ useContext(ProviderAttachmentsContext);
+
+export type PromptInputProviderProps = PropsWithChildren<{
+ initialInput?: string;
+}>;
+
+/**
+ * Optional global provider that lifts PromptInput state outside of PromptInput.
+ * If you don't use it, PromptInput stays fully self-managed.
+ */
+export function PromptInputProvider({
+ initialInput: initialTextInput = "",
+ children,
+}: PromptInputProviderProps) {
+ // ----- textInput state
+ const [textInput, setTextInput] = useState(initialTextInput);
+ const clearInput = useCallback(() => setTextInput(""), []);
+
+ // ----- attachments state (global when wrapped)
+ const [attachements, setAttachements] = useState<
+ (FileUIPart & { id: string })[]
+ >([]);
+ const fileInputRef = useRef(null);
+ const openRef = useRef<() => void>(() => {});
+
+ const add = useCallback((files: File[] | FileList) => {
+ const incoming = Array.from(files);
+ if (incoming.length === 0) {
+ return;
+ }
+
+ setAttachements((prev) =>
+ prev.concat(
+ incoming.map((file) => ({
+ id: nanoid(),
+ type: "file" as const,
+ url: URL.createObjectURL(file),
+ mediaType: file.type,
+ filename: file.name,
+ }))
+ )
+ );
+ }, []);
+
+ const remove = useCallback((id: string) => {
+ setAttachements((prev) => {
+ const found = prev.find((f) => f.id === id);
+ if (found?.url) {
+ URL.revokeObjectURL(found.url);
+ }
+ return prev.filter((f) => f.id !== id);
+ });
+ }, []);
+
+ const clear = useCallback(() => {
+ setAttachements((prev) => {
+ for (const f of prev) {
+ if (f.url) {
+ URL.revokeObjectURL(f.url);
+ }
+ }
+ return [];
+ });
+ }, []);
+
+ const openFileDialog = useCallback(() => {
+ openRef.current?.();
+ }, []);
+
+ const attachments = useMemo(
+ () => ({
+ files: attachements,
+ add,
+ remove,
+ clear,
+ openFileDialog,
+ fileInputRef,
+ }),
+ [attachements, add, remove, clear, openFileDialog]
+ );
+
+ const __registerFileInput = useCallback(
+ (ref: RefObject, open: () => void) => {
+ fileInputRef.current = ref.current;
+ openRef.current = open;
+ },
+ []
+ );
+
+ const controller = useMemo(
+ () => ({
+ textInput: {
+ value: textInput,
+ setInput: setTextInput,
+ clear: clearInput,
+ },
+ attachments,
+ __registerFileInput,
+ }),
+ [textInput, clearInput, attachments, __registerFileInput]
+ );
+
+ return (
+
+
+ {children}
+
+
+ );
+}
+
+// ============================================================================
+// Component Context & Hooks
+// ============================================================================
+
+const LocalAttachmentsContext = createContext(null);
+
+export const usePromptInputAttachments = () => {
+ // Dual-mode: prefer provider if present, otherwise use local
+ const provider = useOptionalProviderAttachments();
+ const local = useContext(LocalAttachmentsContext);
+ const context = provider ?? local;
+ if (!context) {
+ throw new Error(
+ "usePromptInputAttachments must be used within a PromptInput or PromptInputProvider"
+ );
+ }
+ return context;
+};
+
+export type PromptInputAttachmentProps = HTMLAttributes & {
+ data: FileUIPart & { id: string };
+ className?: string;
+};
+
+export function PromptInputAttachment({
+ data,
+ className,
+ ...props
+}: PromptInputAttachmentProps) {
+ const attachments = usePromptInputAttachments();
+
+ const filename = data.filename || "";
+
+ const mediaType =
+ data.mediaType?.startsWith("image/") && data.url ? "image" : "file";
+ const isImage = mediaType === "image";
+
+ const attachmentLabel = filename || (isImage ? "Image" : "Attachment");
+
+ return (
+
+
+
+
+
+
+ );
+}
+
+export type PromptInputAttachmentsProps = Omit<
+ HTMLAttributes,
+ "children"
+> & {
+ children: (attachment: FileUIPart & { id: string }) => ReactNode;
+};
+
+export function PromptInputAttachments({
+ children,
+ className,
+ ...props
+}: PromptInputAttachmentsProps) {
+ const attachments = usePromptInputAttachments();
+
+ if (!attachments.files.length) {
+ return null;
+ }
+
+ return (
+ {
+ e.preventDefault();
+ attachments.openFileDialog();
+ }}
+ >
+
+ );
+};
+
+export type PromptInputMessage = {
+ text?: string;
+ files?: FileUIPart[];
+};
+
+export type PromptInputProps = Omit<
+ HTMLAttributes,
+ "onSubmit" | "onError"
+> & {
+ accept?: string; // e.g., "image/*" or leave undefined for any
+ multiple?: boolean;
+ // When true, accepts drops anywhere on document. Default false (opt-in).
+ globalDrop?: boolean;
+ // Render a hidden input with given name and keep it in sync for native form posts. Default false.
+ syncHiddenInput?: boolean;
+ // Minimal constraints
+ maxFiles?: number;
+ maxFileSize?: number; // bytes
+ onError?: (err: {
+ code: "max_files" | "max_file_size" | "accept";
+ message: string;
+ }) => void;
+ onSubmit: (
+ message: PromptInputMessage,
+ event: FormEvent
+ ) => void | Promise;
+};
+
+export const PromptInput = ({
+ className,
+ accept,
+ multiple,
+ globalDrop,
+ syncHiddenInput,
+ maxFiles,
+ maxFileSize,
+ onError,
+ onSubmit,
+ children,
+ ...props
+}: PromptInputProps) => {
+ // Try to use a provider controller if present
+ const controller = useOptionalPromptInputController();
+ const usingProvider = !!controller;
+
+ // Refs
+ const inputRef = useRef(null);
+ const anchorRef = useRef(null);
+ const formRef = useRef(null);
+
+ // Find nearest form to scope drag & drop
+ useEffect(() => {
+ const root = anchorRef.current?.closest("form");
+ if (root instanceof HTMLFormElement) {
+ formRef.current = root;
+ }
+ }, []);
+
+ // ----- Local attachments (only used when no provider)
+ const [items, setItems] = useState<(FileUIPart & { id: string })[]>([]);
+ const files = usingProvider ? controller.attachments.files : items;
+
+ const openFileDialogLocal = useCallback(() => {
+ inputRef.current?.click();
+ }, []);
+
+ const matchesAccept = useCallback(
+ (f: File) => {
+ if (!accept || accept.trim() === "") {
+ return true;
+ }
+ if (accept.includes("image/*")) {
+ return f.type.startsWith("image/");
+ }
+ // NOTE: keep simple; expand as needed
+ return true;
+ },
+ [accept]
+ );
+
+ const addLocal = useCallback(
+ (fileList: File[] | FileList) => {
+ const incoming = Array.from(fileList);
+ const accepted = incoming.filter((f) => matchesAccept(f));
+ if (incoming.length && accepted.length === 0) {
+ onError?.({
+ code: "accept",
+ message: "No files match the accepted types.",
+ });
+ return;
+ }
+ const withinSize = (f: File) =>
+ maxFileSize ? f.size <= maxFileSize : true;
+ const sized = accepted.filter(withinSize);
+ if (accepted.length > 0 && sized.length === 0) {
+ onError?.({
+ code: "max_file_size",
+ message: "All files exceed the maximum size.",
+ });
+ return;
+ }
+
+ setItems((prev) => {
+ const capacity =
+ typeof maxFiles === "number"
+ ? Math.max(0, maxFiles - prev.length)
+ : undefined;
+ const capped =
+ typeof capacity === "number" ? sized.slice(0, capacity) : sized;
+ if (typeof capacity === "number" && sized.length > capacity) {
+ onError?.({
+ code: "max_files",
+ message: "Too many files. Some were not added.",
+ });
+ }
+ const next: (FileUIPart & { id: string })[] = [];
+ for (const file of capped) {
+ next.push({
+ id: nanoid(),
+ type: "file",
+ url: URL.createObjectURL(file),
+ mediaType: file.type,
+ filename: file.name,
+ });
+ }
+ return prev.concat(next);
+ });
+ },
+ [matchesAccept, maxFiles, maxFileSize, onError]
+ );
+
+ const add = usingProvider
+ ? (files: File[] | FileList) => controller.attachments.add(files)
+ : addLocal;
+
+ const remove = usingProvider
+ ? (id: string) => controller.attachments.remove(id)
+ : (id: string) =>
+ setItems((prev) => {
+ const found = prev.find((file) => file.id === id);
+ if (found?.url) {
+ URL.revokeObjectURL(found.url);
+ }
+ return prev.filter((file) => file.id !== id);
+ });
+
+ const clear = usingProvider
+ ? () => controller.attachments.clear()
+ : () =>
+ setItems((prev) => {
+ for (const file of prev) {
+ if (file.url) {
+ URL.revokeObjectURL(file.url);
+ }
+ }
+ return [];
+ });
+
+ const openFileDialog = usingProvider
+ ? () => controller.attachments.openFileDialog()
+ : openFileDialogLocal;
+
+ // Let provider know about our hidden file input so external menus can call openFileDialog()
+ useEffect(() => {
+ if (!usingProvider) return;
+ controller.__registerFileInput(inputRef, () => inputRef.current?.click());
+ }, [usingProvider, controller]);
+
+ // Note: File input cannot be programmatically set for security reasons
+ // The syncHiddenInput prop is no longer functional
+ useEffect(() => {
+ if (syncHiddenInput && inputRef.current && files.length === 0) {
+ inputRef.current.value = "";
+ }
+ }, [files, syncHiddenInput]);
+
+ // Attach drop handlers on nearest form and document (opt-in)
+ useEffect(() => {
+ const form = formRef.current;
+ if (!form) return;
+
+ const onDragOver = (e: DragEvent) => {
+ if (e.dataTransfer?.types?.includes("Files")) {
+ e.preventDefault();
+ }
+ };
+ const onDrop = (e: DragEvent) => {
+ if (e.dataTransfer?.types?.includes("Files")) {
+ e.preventDefault();
+ }
+ if (e.dataTransfer?.files && e.dataTransfer.files.length > 0) {
+ add(e.dataTransfer.files);
+ }
+ };
+ form.addEventListener("dragover", onDragOver);
+ form.addEventListener("drop", onDrop);
+ return () => {
+ form.removeEventListener("dragover", onDragOver);
+ form.removeEventListener("drop", onDrop);
+ };
+ }, [add]);
+
+ useEffect(() => {
+ if (!globalDrop) return;
+
+ const onDragOver = (e: DragEvent) => {
+ if (e.dataTransfer?.types?.includes("Files")) {
+ e.preventDefault();
+ }
+ };
+ const onDrop = (e: DragEvent) => {
+ if (e.dataTransfer?.types?.includes("Files")) {
+ e.preventDefault();
+ }
+ if (e.dataTransfer?.files && e.dataTransfer.files.length > 0) {
+ add(e.dataTransfer.files);
+ }
+ };
+ document.addEventListener("dragover", onDragOver);
+ document.addEventListener("drop", onDrop);
+ return () => {
+ document.removeEventListener("dragover", onDragOver);
+ document.removeEventListener("drop", onDrop);
+ };
+ }, [add, globalDrop]);
+
+ useEffect(
+ () => () => {
+ if (!usingProvider) {
+ for (const f of files) {
+ if (f.url) URL.revokeObjectURL(f.url);
+ }
+ }
+ },
+ [usingProvider, files]
+ );
+
+ const handleChange: ChangeEventHandler = (event) => {
+ if (event.currentTarget.files) {
+ add(event.currentTarget.files);
+ }
+ };
+
+ const convertBlobUrlToDataUrl = async (url: string): Promise => {
+ const response = await fetch(url);
+ const blob = await response.blob();
+ return new Promise((resolve, reject) => {
+ const reader = new FileReader();
+ reader.onloadend = () => resolve(reader.result as string);
+ reader.onerror = reject;
+ reader.readAsDataURL(blob);
+ });
+ };
+
+ const ctx = useMemo(
+ () => ({
+ files: files.map((item) => ({ ...item, id: item.id })),
+ add,
+ remove,
+ clear,
+ openFileDialog,
+ fileInputRef: inputRef,
+ }),
+ [files, add, remove, clear, openFileDialog]
+ );
+
+ const handleSubmit: FormEventHandler = (event) => {
+ event.preventDefault();
+
+ const form = event.currentTarget;
+ const text = usingProvider
+ ? controller.textInput.value
+ : (() => {
+ const formData = new FormData(form);
+ return (formData.get("message") as string) || "";
+ })();
+
+ // Reset form immediately after capturing text to avoid race condition
+ // where user input during async blob conversion would be lost
+ if (!usingProvider) {
+ form.reset();
+ }
+
+ // Convert blob URLs to data URLs asynchronously
+ Promise.all(
+ files.map(async ({ id, ...item }) => {
+ if (item.url && item.url.startsWith("blob:")) {
+ return {
+ ...item,
+ url: await convertBlobUrlToDataUrl(item.url),
+ };
+ }
+ return item;
+ })
+ ).then((convertedFiles: FileUIPart[]) => {
+ try {
+ const result = onSubmit({ text, files: convertedFiles }, event);
+
+ // Handle both sync and async onSubmit
+ if (result instanceof Promise) {
+ result
+ .then(() => {
+ clear();
+ if (usingProvider) {
+ controller.textInput.clear();
+ }
+ })
+ .catch(() => {
+ // Don't clear on error - user may want to retry
+ });
+ } else {
+ // Sync function completed without throwing, clear attachments
+ clear();
+ if (usingProvider) {
+ controller.textInput.clear();
+ }
+ }
+ } catch (error) {
+ // Don't clear on error - user may want to retry
+ }
+ });
+ };
+
+ // Render with or without local provider
+ const inner = (
+ <>
+
+
+
+
+ );
+
+ return usingProvider ? (
+ inner
+ ) : (
+
+ {inner}
+
+ );
+};
+
+export type PromptInputBodyProps = HTMLAttributes;
+
+export const PromptInputBody = ({
+ className,
+ ...props
+}: PromptInputBodyProps) => (
+
+);
+
+export type PromptInputTextareaProps = ComponentProps<
+ typeof InputGroupTextarea
+>;
+
+export const PromptInputTextarea = ({
+ onChange,
+ className,
+ placeholder = "What would you like to know?",
+ ...props
+}: PromptInputTextareaProps) => {
+ const controller = useOptionalPromptInputController();
+ const attachments = usePromptInputAttachments();
+ const [isComposing, setIsComposing] = useState(false);
+
+ const handleKeyDown: KeyboardEventHandler = (e) => {
+ if (e.key === "Enter") {
+ if (isComposing || e.nativeEvent.isComposing) {
+ return;
+ }
+ if (e.shiftKey) {
+ return;
+ }
+ e.preventDefault();
+
+ // Check if the submit button is disabled before submitting
+ const form = e.currentTarget.form;
+ const submitButton = form?.querySelector(
+ 'button[type="submit"]'
+ ) as HTMLButtonElement | null;
+ if (submitButton?.disabled) {
+ return;
+ }
+
+ form?.requestSubmit();
+ }
+
+ // Remove last attachment when Backspace is pressed and textarea is empty
+ if (
+ e.key === "Backspace" &&
+ e.currentTarget.value === "" &&
+ attachments.files.length > 0
+ ) {
+ e.preventDefault();
+ const lastAttachment = attachments.files.at(-1);
+ if (lastAttachment) {
+ attachments.remove(lastAttachment.id);
+ }
+ }
+ };
+
+ const handlePaste: ClipboardEventHandler = (event) => {
+ const items = event.clipboardData?.items;
+
+ if (!items) {
+ return;
+ }
+
+ const files: File[] = [];
+
+ for (const item of items) {
+ if (item.kind === "file") {
+ const file = item.getAsFile();
+ if (file) {
+ files.push(file);
+ }
+ }
+ }
+
+ if (files.length > 0) {
+ event.preventDefault();
+ attachments.add(files);
+ }
+ };
+
+ const controlledProps = controller
+ ? {
+ value: controller.textInput.value,
+ onChange: (e: ChangeEvent) => {
+ controller.textInput.setInput(e.currentTarget.value);
+ onChange?.(e);
+ },
+ }
+ : {
+ onChange,
+ };
+
+ return (
+ setIsComposing(false)}
+ onCompositionStart={() => setIsComposing(true)}
+ onKeyDown={handleKeyDown}
+ onPaste={handlePaste}
+ placeholder={placeholder}
+ {...props}
+ {...controlledProps}
+ />
+ );
+};
+
+export type PromptInputHeaderProps = Omit<
+ ComponentProps,
+ "align"
+>;
+
+export const PromptInputHeader = ({
+ className,
+ ...props
+}: PromptInputHeaderProps) => (
+ ,
+ "align"
+>;
+
+export const PromptInputFooter = ({
+ className,
+ ...props
+}: PromptInputFooterProps) => (
+ ;
+
+export const PromptInputTools = ({
+ className,
+ ...props
+}: PromptInputToolsProps) => (
+
+);
+
+export type PromptInputButtonProps = ComponentProps;
+
+export const PromptInputButton = ({
+ variant = "ghost",
+ className,
+ size,
+ ...props
+}: PromptInputButtonProps) => {
+ const newSize =
+ size ?? (Children.count(props.children) > 1 ? "sm" : "icon-sm");
+
+ return (
+ ;
+export const PromptInputActionMenu = (props: PromptInputActionMenuProps) => (
+
+
+ {children ??
+
+);
+
+export type PromptInputActionMenuContentProps = ComponentProps<
+ typeof DropdownMenuContent
+>;
+export const PromptInputActionMenuContent = ({
+ className,
+ ...props
+}: PromptInputActionMenuContentProps) => (
+ & {
+ status?: ChatStatus;
+};
+
+export const PromptInputSubmit = ({
+ className,
+ variant = "default",
+ size = "icon-sm",
+ status,
+ children,
+ ...props
+}: PromptInputSubmitProps) => {
+ let Icon =
+ {children ?? Icon}
+
+ );
+};
+
+interface SpeechRecognition extends EventTarget {
+ continuous: boolean;
+ interimResults: boolean;
+ lang: string;
+ start(): void;
+ stop(): void;
+ onstart: ((this: SpeechRecognition, ev: Event) => any) | null;
+ onend: ((this: SpeechRecognition, ev: Event) => any) | null;
+ onresult:
+ | ((this: SpeechRecognition, ev: SpeechRecognitionEvent) => any)
+ | null;
+ onerror:
+ | ((this: SpeechRecognition, ev: SpeechRecognitionErrorEvent) => any)
+ | null;
+}
+
+interface SpeechRecognitionEvent extends Event {
+ results: SpeechRecognitionResultList;
+}
+
+type SpeechRecognitionResultList = {
+ readonly length: number;
+ item(index: number): SpeechRecognitionResult;
+ [index: number]: SpeechRecognitionResult;
+};
+
+type SpeechRecognitionResult = {
+ readonly length: number;
+ item(index: number): SpeechRecognitionAlternative;
+ [index: number]: SpeechRecognitionAlternative;
+ isFinal: boolean;
+};
+
+type SpeechRecognitionAlternative = {
+ transcript: string;
+ confidence: number;
+};
+
+interface SpeechRecognitionErrorEvent extends Event {
+ error: string;
+}
+
+declare global {
+ interface Window {
+ SpeechRecognition: {
+ new (): SpeechRecognition;
+ };
+ webkitSpeechRecognition: {
+ new (): SpeechRecognition;
+ };
+ }
+}
+
+export type PromptInputSpeechButtonProps = ComponentProps<
+ typeof PromptInputButton
+> & {
+ textareaRef?: RefObject;
+ onTranscriptionChange?: (text: string) => void;
+};
+
+export const PromptInputSpeechButton = ({
+ className,
+ textareaRef,
+ onTranscriptionChange,
+ ...props
+}: PromptInputSpeechButtonProps) => {
+ const [isListening, setIsListening] = useState(false);
+ const [recognition, setRecognition] = useState(
+ null
+ );
+ const recognitionRef = useRef(null);
+
+ useEffect(() => {
+ if (
+ typeof window !== "undefined" &&
+ ("SpeechRecognition" in window || "webkitSpeechRecognition" in window)
+ ) {
+ const SpeechRecognition =
+ window.SpeechRecognition || window.webkitSpeechRecognition;
+ const speechRecognition = new SpeechRecognition();
+
+ speechRecognition.continuous = true;
+ speechRecognition.interimResults = true;
+ speechRecognition.lang = "en-US";
+
+ speechRecognition.onstart = () => {
+ setIsListening(true);
+ };
+
+ speechRecognition.onend = () => {
+ setIsListening(false);
+ };
+
+ speechRecognition.onresult = (event) => {
+ let finalTranscript = "";
+
+ const results = Array.from(event.results);
+
+ for (const result of results) {
+ if (result.isFinal) {
+ finalTranscript += result[0]?.transcript ?? "";
+ }
+ }
+
+ if (finalTranscript && textareaRef?.current) {
+ const textarea = textareaRef.current;
+ const currentValue = textarea.value;
+ const newValue =
+ currentValue + (currentValue ? " " : "") + finalTranscript;
+
+ textarea.value = newValue;
+ textarea.dispatchEvent(new Event("input", { bubbles: true }));
+ onTranscriptionChange?.(newValue);
+ }
+ };
+
+ speechRecognition.onerror = (event) => {
+ console.error("Speech recognition error:", event.error);
+ setIsListening(false);
+ };
+
+ recognitionRef.current = speechRecognition;
+ setRecognition(speechRecognition);
+ }
+
+ return () => {
+ if (recognitionRef.current) {
+ recognitionRef.current.stop();
+ }
+ };
+ }, [textareaRef, onTranscriptionChange]);
+
+ const toggleListening = useCallback(() => {
+ if (!recognition) {
+ return;
+ }
+
+ if (isListening) {
+ recognition.stop();
+ } else {
+ recognition.start();
+ }
+ }, [recognition, isListening]);
+
+ return (
+
+
+ );
+};
+
+export type PromptInputSelectProps = ComponentProps;
+
+export const PromptInputSelect = (props: PromptInputSelectProps) => (
+
+);
+
+export type PromptInputSelectTriggerProps = ComponentProps<
+ typeof SelectTrigger
+>;
+
+export const PromptInputSelectTrigger = ({
+ className,
+ ...props
+}: PromptInputSelectTriggerProps) => (
+ ;
+
+export const PromptInputSelectItem = ({
+ className,
+ ...props
+}: PromptInputSelectItemProps) => (
+ ;
+
+export const PromptInputSelectValue = ({
+ className,
+ ...props
+}: PromptInputSelectValueProps) => (
+ ;
+
+export const PromptInputHoverCard = ({
+ openDelay = 0,
+ closeDelay = 0,
+ ...props
+}: PromptInputHoverCardProps) => (
+ ;
+
+export const PromptInputTabsList = ({
+ className,
+ ...props
+}: PromptInputTabsListProps) => ;
+
+export type PromptInputTabProps = HTMLAttributes;
+
+export const PromptInputTab = ({
+ className,
+ ...props
+}: PromptInputTabProps) => ;
+
+export type PromptInputTabLabelProps = HTMLAttributes;
+
+export const PromptInputTabLabel = ({
+ className,
+ ...props
+}: PromptInputTabLabelProps) => (
+
+);
+
+export type PromptInputTabBodyProps = HTMLAttributes;
+
+export const PromptInputTabBody = ({
+ className,
+ ...props
+}: PromptInputTabBodyProps) => (
+
+);
+
+export type PromptInputTabItemProps = HTMLAttributes;
+
+export const PromptInputTabItem = ({
+ className,
+ ...props
+}: PromptInputTabItemProps) => (
+
+);
+
+export type PromptInputCommandProps = ComponentProps;
+
+export const PromptInputCommand = ({
+ className,
+ ...props
+}: PromptInputCommandProps) => ;
+
+export const PromptInputCommandInput = ({
+ className,
+ ...props
+}: PromptInputCommandInputProps) => (
+ ;
+
+export const PromptInputCommandList = ({
+ className,
+ ...props
+}: PromptInputCommandListProps) => (
+ ;
+
+export const PromptInputCommandEmpty = ({
+ className,
+ ...props
+}: PromptInputCommandEmptyProps) => (
+ ;
+
+export const PromptInputCommandGroup = ({
+ className,
+ ...props
+}: PromptInputCommandGroupProps) => (
+ ;
+
+export const PromptInputCommandItem = ({
+ className,
+ ...props
+}: PromptInputCommandItemProps) => (
+
+ {children}
+
+ );
+};
+
+export const Shimmer = memo(ShimmerComponent);
diff --git a/docs/components/ai-elements/sources.tsx b/docs/components/ai-elements/sources.tsx
new file mode 100644
index 000000000..0756664f3
--- /dev/null
+++ b/docs/components/ai-elements/sources.tsx
@@ -0,0 +1,77 @@
+"use client";
+
+import {
+ Collapsible,
+ CollapsibleContent,
+ CollapsibleTrigger,
+} from "@/components/ui/collapsible";
+import { cn } from "@/lib/utils";
+import { BookIcon, ChevronDownIcon } from "lucide-react";
+import type { ComponentProps } from "react";
+
+export type SourcesProps = ComponentProps<"div">;
+
+export const Sources = ({ className, ...props }: SourcesProps) => (
+ & {
+ count: number;
+};
+
+export const SourcesTrigger = ({
+ className,
+ count,
+ children,
+ ...props
+}: SourcesTriggerProps) => (
+
+ {children ?? (
+ <>
+
+);
+
+export type SourcesContentProps = ComponentProps;
+
+export const SourcesContent = ({
+ className,
+ ...props
+}: SourcesContentProps) => (
+ ;
+
+export const Suggestions = ({
+ className,
+ children,
+ ...props
+}: SuggestionsProps) => (
+
+
+);
+
+export type SuggestionProps = Omit, "onClick"> & {
+ suggestion: string;
+ onClick?: (suggestion: string) => void;
+};
+
+export const Suggestion = ({
+ suggestion,
+ onClick,
+ className,
+ variant = "outline",
+ size = "sm",
+ children,
+ ...props
+}: SuggestionProps) => {
+ const handleClick = () => {
+ onClick?.(suggestion);
+ };
+
+ return (
+
+ );
+};
diff --git a/docs/components/custom/authors.tsx b/docs/components/custom/authors.tsx
new file mode 100644
index 000000000..ee42b0f84
--- /dev/null
+++ b/docs/components/custom/authors.tsx
@@ -0,0 +1,37 @@
+import type { ReactNode } from 'react'
+
+type AuthorsProps = {
+ date: string
+ children: ReactNode
+ by?: string
+}
+
+export default function Authors({ date, children, by = 'by' }: AuthorsProps) {
+ return (
+ ;
+
+export const Callout = ({ className, ...props }: CalloutProps) => (
+ ;
+
+export const CalloutContainer = (props: CalloutContainerProps) => (
+ ;
+
+export const CalloutTitle = (props: CalloutTitleProps) => (
+ | undefined>(
+ undefined
+ );
+
+ // Load messages from Dexie with live query
+ const storedMessages = useLiveQuery(() =>
+ db.messages.orderBy("sequence").toArray()
+ );
+
+ const initialMessages =
+ storedMessages?.map(({ timestamp, sequence, ...message }) => message) ?? [];
+
+ const isLoading = storedMessages === undefined;
+
+ // Save messages to Dexie with debouncing
+ const saveMessages = useCallback((messages: UIMessage[]) => {
+ if (saveTimeoutRef.current) {
+ clearTimeout(saveTimeoutRef.current);
+ }
+
+ saveTimeoutRef.current = setTimeout(async () => {
+ try {
+ const baseTimestamp = Date.now();
+ const messagesToStore = messages.map((message, index) => ({
+ ...message,
+ timestamp: baseTimestamp + index * 1000,
+ sequence: index,
+ }));
+
+ await db.transaction("rw", db.messages, async () => {
+ await db.messages.clear();
+ await db.messages.bulkAdd(messagesToStore);
+ });
+ } catch (error) {
+ console.error("Failed to save messages:", error);
+ }
+ }, 300);
+ }, []);
+
+ // Clear all messages from Dexie
+ const clearMessages = useCallback(async () => {
+ try {
+ await db.messages.clear();
+ } catch (error) {
+ console.error("Failed to clear messages:", error);
+ }
+ }, []);
+
+ // Cleanup timeout on unmount
+ useEffect(
+ () => () => {
+ if (saveTimeoutRef.current) {
+ clearTimeout(saveTimeoutRef.current);
+ }
+ },
+ []
+ );
+
+ return {
+ initialMessages,
+ isLoading,
+ saveMessages,
+ clearMessages,
+ };
+};
+
+type ChatProps = {
+ basePath: string | undefined;
+ suggestions: string[];
+};
+
+const ChatInner = ({ basePath, suggestions }: ChatProps) => {
+ const [isInitialized, setIsInitialized] = useState(false);
+ const [localPrompt, setLocalPrompt] = useState("");
+ const [providerKey, setProviderKey] = useState(0);
+ const { prompt, setPrompt, setIsOpen } = useChatContext();
+ const { initialMessages, isLoading, saveMessages, clearMessages } =
+ useChatPersistence();
+
+ const { messages, sendMessage, status, setMessages } = useChat({
+ transport: new DefaultChatTransport({
+ api: basePath ? `${basePath}/api/chat` : "/api/chat",
+ }),
+ onError: (error) => {
+ toast.error(error.message, {
+ description: error.message,
+ });
+ },
+ });
+
+ // Sync external prompt changes to local state and force provider remount
+ useEffect(() => {
+ if (prompt && prompt !== localPrompt) {
+ setLocalPrompt(prompt);
+ setProviderKey((prev) => prev + 1);
+ }
+ }, [prompt, localPrompt]);
+
+ // Set initial messages once loaded from IndexedDB
+ useEffect(() => {
+ if (!(isLoading || isInitialized) && initialMessages.length > 0) {
+ setMessages(initialMessages);
+ setIsInitialized(true);
+ } else if (!(isLoading || isInitialized)) {
+ // Mark as initialized even if no messages to avoid infinite re-runs
+ setIsInitialized(true);
+ }
+ }, [isLoading, initialMessages, isInitialized, setMessages]);
+
+ // Save messages to IndexedDB whenever they change (but only after initialization)
+ useEffect(() => {
+ if (isInitialized && messages.length > 0) {
+ saveMessages(messages);
+ }
+ }, [messages, saveMessages, isInitialized]);
+
+ const handleSuggestionClick = async (suggestion: string) => {
+ await sendMessage({ text: suggestion });
+ setLocalPrompt("");
+ setPrompt("");
+ };
+
+ const handleSubmit: PromptInputProps["onSubmit"] = async (message, event) => {
+ event.preventDefault();
+
+ const { text } = message;
+
+ if (!text) {
+ return;
+ }
+
+ await sendMessage({ text });
+ setLocalPrompt("");
+ setPrompt("");
+ };
+
+ const handleClearChat = async () => {
+ try {
+ await clearMessages();
+ setMessages([]);
+ toast.success("Chat history cleared");
+ } catch (error) {
+ toast.error("Failed to clear chat history", {
+ description: error instanceof Error ? error.message : "Unknown error",
+ });
+ }
+ };
+
+ // Show loading state while initial messages are being loaded
+ if (isLoading) {
+ return (
+
+
+ ) => (
+
+ {props.children}
+
+);
+
+export const CodeBlockTabsTrigger = ({
+ children,
+ ...props
+}: ComponentProps) => (
+
+
+ {children}
+
+);
+
+export const CodeBlockTabs = ({
+ ref,
+ ...props
+}: ComponentProps) => (
+
+ {props.children}
+
+);
+
+export const CodeBlockTab = (props: ComponentProps) => (
+ div]:mb-0 [&_pre]:rounded-none [&_pre]:border-none",
+ props.className
+ )}
+ />
+);
diff --git a/docs/components/geistdocs/code-block.tsx b/docs/components/geistdocs/code-block.tsx
new file mode 100644
index 000000000..ba470d24b
--- /dev/null
+++ b/docs/components/geistdocs/code-block.tsx
@@ -0,0 +1,125 @@
+"use client";
+
+import { CheckIcon, CopyIcon } from "lucide-react";
+import {
+ type CSSProperties,
+ type ReactNode,
+ useCallback,
+ useRef,
+ useState,
+} from "react";
+import { toast } from "sonner";
+import { Button } from "@/components/ui/button";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { cn } from "@/lib/utils";
+
+type CodeBlockProps = {
+ children: ReactNode;
+ className?: string;
+ icon?: ReactNode;
+ style?: CSSProperties;
+ tabIndex?: number;
+ title?: string;
+};
+
+export const CodeBlock = ({
+ children,
+ className,
+ icon,
+ style,
+ tabIndex,
+ title,
+}: CodeBlockProps) => {
+ const ref = useRef(null);
+ const [isCopied, setIsCopied] = useState(false);
+
+ const copyToClipboard = useCallback(async () => {
+ if (typeof window === "undefined" || !navigator?.clipboard?.writeText) {
+ toast.error("Clipboard API not available");
+ return;
+ }
+
+ const code = ref.current?.innerText;
+
+ if (!code) {
+ toast.error("No code to copy");
+ return;
+ }
+
+ try {
+ await navigator.clipboard.writeText(code);
+ setIsCopied(true);
+ setTimeout(() => setIsCopied(false), 2000);
+ } catch (error) {
+ const message = error instanceof Error ? error.message : "Unknown error";
+
+ toast.error(message);
+ }
+ }, []);
+
+ const Icon = isCopied ? CheckIcon : CopyIcon;
+
+ const CodeBlockComponent = useCallback(
+ (props: { className?: string }) => (
+
+
+
+
+ {title}
+
+
+
+
+
+
+ );
+};
diff --git a/docs/components/geistdocs/copy-chat.tsx b/docs/components/geistdocs/copy-chat.tsx
new file mode 100644
index 000000000..f00f65239
--- /dev/null
+++ b/docs/components/geistdocs/copy-chat.tsx
@@ -0,0 +1,56 @@
+import type { UIMessage } from "ai";
+import { CheckIcon, CopyIcon } from "lucide-react";
+import { useState } from "react";
+import { toast } from "sonner";
+import { Button } from "@/components/ui/button";
+import {
+ Tooltip,
+ TooltipContent,
+ TooltipTrigger,
+} from "@/components/ui/tooltip";
+
+export const CopyChat = ({ messages }: { messages: UIMessage[] }) => {
+ const [copied, setCopied] = useState(false);
+
+ const handleCopyChat = async () => {
+ const markdown = messages
+ .map((message) => {
+ const role = message.role === "user" ? "You" : "AI";
+ const content = message.parts
+ .filter((part) => part.type === "text")
+ .map((part) => part.text)
+ .join("\n");
+ return `**${role}:**\n${content}`;
+ })
+ .join("\n\n---\n\n");
+
+ try {
+ await navigator.clipboard.writeText(markdown);
+ toast.success("Chat copied to clipboard");
+ setCopied(true);
+ setTimeout(() => setCopied(false), 2000);
+ } catch (error) {
+ toast.error("Failed to copy chat", {
+ description: error instanceof Error ? error.message : "Unknown error",
+ });
+ }
+ };
+
+ const Icon = copied ? CheckIcon : CopyIcon;
+
+ return (
+
+
+
+
+ Copy chat
+
+ );
+};
diff --git a/docs/components/geistdocs/copy-page.tsx b/docs/components/geistdocs/copy-page.tsx
new file mode 100644
index 000000000..292c364d3
--- /dev/null
+++ b/docs/components/geistdocs/copy-page.tsx
@@ -0,0 +1,27 @@
+"use client";
+
+import { useCopyButton } from "fumadocs-ui/utils/use-copy-button";
+import { CheckIcon, CopyIcon } from "lucide-react";
+
+type CopyPageProps = {
+ text: string;
+};
+
+export const CopyPage = ({ text }: CopyPageProps) => {
+ const [checked, handleCopy] = useCopyButton(async () => {
+ await navigator.clipboard.writeText(text);
+ });
+
+ const Icon = checked ? CheckIcon : CopyIcon;
+
+ return (
+
+ );
+};
diff --git a/docs/components/geistdocs/desktop-menu.tsx b/docs/components/geistdocs/desktop-menu.tsx
new file mode 100644
index 000000000..6ff262037
--- /dev/null
+++ b/docs/components/geistdocs/desktop-menu.tsx
@@ -0,0 +1,52 @@
+"use client";
+
+import DynamicLink from "fumadocs-core/dynamic-link";
+import { ExternalLinkIcon } from "lucide-react";
+import {
+ NavigationMenu,
+ NavigationMenuItem,
+ NavigationMenuLink,
+ NavigationMenuList,
+} from "@/components/ui/navigation-menu";
+import { useIsMobile } from "@/hooks/use-mobile";
+import { cn } from "@/lib/utils";
+
+type DesktopMenuProps = {
+ items: { label: string; href: string }[];
+ className?: string;
+};
+
+export const DesktopMenu = ({ items, className }: DesktopMenuProps) => {
+ const isMobile = useIsMobile();
+
+ return (
+
+
+ {items.map((item) => (
+
+
+ {item.href.startsWith("http") ? (
+
+ {item.label}
+
+ {item.label}
+
+ )}
+
+
+ ))}
+
+
+ );
+};
diff --git a/docs/components/geistdocs/docs-layout.tsx b/docs/components/geistdocs/docs-layout.tsx
new file mode 100644
index 000000000..42675effe
--- /dev/null
+++ b/docs/components/geistdocs/docs-layout.tsx
@@ -0,0 +1,47 @@
+import { DocsLayout as FumadocsDocsLayout } from "fumadocs-ui/layouts/docs";
+import type { ComponentProps, CSSProperties, ReactNode } from "react";
+import {
+ Folder,
+ Item,
+ Separator,
+ Sidebar,
+} from "@/components/geistdocs/sidebar";
+import { i18n } from "@/lib/geistdocs/i18n";
+
+type DocsLayoutProps = {
+ tree: ComponentProps["tree"];
+ children: ReactNode;
+};
+
+export const DocsLayout = ({ tree, children }: DocsLayoutProps) => (
+ ;
+
+export const DocsPage = ({ ...props }: PageProps) => (
+ ) => (
+
+) => ) => (
+ (null);
+ const [message, setMessage] = useState("");
+ const [isPending, startTransition] = useTransition();
+
+ useEffect(() => {
+ const item = localStorage.getItem(`docs-feedback-${url}`);
+
+ if (!item) {
+ return;
+ }
+
+ setSubmitted(true);
+ }, [url]);
+
+ const submit: FormEventHandler = (e) => {
+ e.preventDefault();
+
+ if (!emotion) {
+ return;
+ }
+
+ startTransition(() => {
+ const feedback: Feedback = {
+ emotion,
+ message,
+ };
+
+ sendFeedback(url, feedback).then(() => {
+ setSubmitted(true);
+ setMessage("");
+ setEmotion(null);
+ });
+ });
+
+ e?.preventDefault();
+ };
+
+ return (
+
+
+
+
+
+
div]:pb-0",
+ index === currentBranch ? "block" : "hidden"
+ )}
+ key={branch.key}
+ {...props}
+ >
+ {branch}
+
+ ));
+};
+
+export type MessageBranchSelectorProps = HTMLAttributes
+ {isImage ? (
+ <>
+ 
+ {onRemove && (
+
+ )}
+
+ ) : (
+ <>
+
+
+
+
+
+
+ {onRemove && (
+
+ )}
+
+ )}
+
+ );
+}
+
+export type MessageAttachmentsProps = ComponentProps<"div">;
+
+export function MessageAttachments({
+ children,
+ className,
+ ...props
+}: MessageAttachmentsProps) {
+ if (!children) {
+ return null;
+ }
+
+ return (
+
+
+ {attachmentLabel}
+
+ {children}
+
+ );
+}
+
+export type MessageToolbarProps = ComponentProps<"div">;
+
+export const MessageToolbar = ({
+ className,
+ children,
+ ...props
+}: MessageToolbarProps) => (
+
+ {children}
+
+);
diff --git a/docs/components/ai-elements/open-in-chat.tsx b/docs/components/ai-elements/open-in-chat.tsx
new file mode 100644
index 000000000..0c62a6ac4
--- /dev/null
+++ b/docs/components/ai-elements/open-in-chat.tsx
@@ -0,0 +1,365 @@
+"use client";
+
+import { Button } from "@/components/ui/button";
+import {
+ DropdownMenu,
+ DropdownMenuContent,
+ DropdownMenuItem,
+ DropdownMenuLabel,
+ DropdownMenuSeparator,
+ DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+import { cn } from "@/lib/utils";
+import {
+ ChevronDownIcon,
+ ExternalLinkIcon,
+ MessageCircleIcon,
+} from "lucide-react";
+import { type ComponentProps, createContext, useContext } from "react";
+
+const providers = {
+ github: {
+ title: "Open in GitHub",
+ createUrl: (url: string) => url,
+ icon: (
+
+ ),
+ },
+ scira: {
+ title: "Open in Scira",
+ createUrl: (q: string) =>
+ `https://scira.ai/?${new URLSearchParams({
+ q,
+ })}`,
+ icon: (
+
+ ),
+ },
+ chatgpt: {
+ title: "Open in ChatGPT",
+ createUrl: (prompt: string) =>
+ `https://chatgpt.com/?${new URLSearchParams({
+ hints: "search",
+ prompt,
+ })}`,
+ icon: (
+
+ ),
+ },
+ claude: {
+ title: "Open in Claude",
+ createUrl: (q: string) =>
+ `https://claude.ai/new?${new URLSearchParams({
+ q,
+ })}`,
+ icon: (
+
+ ),
+ },
+ t3: {
+ title: "Open in T3 Chat",
+ createUrl: (q: string) =>
+ `https://t3.chat/new?${new URLSearchParams({
+ q,
+ })}`,
+ icon:
+
+
+
+
+ {attachmentLabel}
+
+ {isImage ? (
+
+ ) : (
+
+
+
+
+ )}
+
+ {isImage && (
+
+
+
+
+ )}
+
+
+
+
+ + {filename || (isImage ? "Image" : "Attachment")} +
+ {data.mediaType && ( ++ {data.mediaType} +
+ )} +
+ {attachments.files.map((file) => (
+ {children(file)}
+ ))}
+
+ );
+}
+
+export type PromptInputActionAddAttachmentsProps = ComponentProps<
+ typeof DropdownMenuItem
+> & {
+ label?: string;
+};
+
+export const PromptInputActionAddAttachments = ({
+ label = "Add photos or files",
+ ...props
+}: PromptInputActionAddAttachmentsProps) => {
+ const attachments = usePromptInputAttachments();
+
+ return (
+ Used {count} sources
+
+ {children}
+
+
+ {date} {by} {children}
+
+ )
+}
+
+type AuthorProps = {
+ name: string
+ link: string
+}
+
+export function Author({ name, link }: AuthorProps) {
+ return (
+
+
+ {name}
+
+
+ )
+}
diff --git a/docs/components/custom/bleed.tsx b/docs/components/custom/bleed.tsx
new file mode 100644
index 000000000..54733b347
--- /dev/null
+++ b/docs/components/custom/bleed.tsx
@@ -0,0 +1,23 @@
+import { cn } from '@/lib/utils'
+import type { ComponentProps } from 'react'
+
+type BleedProps = ComponentProps<'div'> & {
+ full?: boolean
+}
+
+export const Bleed = ({ full, className, ...props }: BleedProps) => {
+ return (
+
+ )
+}
diff --git a/docs/components/custom/diagrams/cache.tsx b/docs/components/custom/diagrams/cache.tsx
new file mode 100644
index 000000000..1539d2fe8
--- /dev/null
+++ b/docs/components/custom/diagrams/cache.tsx
@@ -0,0 +1,28 @@
+'use client'
+
+import { diagramCachePathsMap } from '../../translations/svgs'
+import { useParams } from 'next/navigation'
+
+export const Cache = () => {
+ const { lang } = useParams()
+ const paths =
+ typeof lang === 'string' && lang in diagramCachePathsMap
+ ? diagramCachePathsMap[lang as keyof typeof diagramCachePathsMap]
+ : diagramCachePathsMap.en
+
+ return (
+
+ )
+}
diff --git a/docs/components/custom/diagrams/infinite.tsx b/docs/components/custom/diagrams/infinite.tsx
new file mode 100644
index 000000000..8b1f91c96
--- /dev/null
+++ b/docs/components/custom/diagrams/infinite.tsx
@@ -0,0 +1,38 @@
+'use client'
+
+import { diagramInfinitePathMap } from '../../translations/svgs'
+import { useParams } from 'next/navigation'
+
+export const Infinite = () => {
+ const { lang } = useParams()
+ const path =
+ typeof lang === 'string' && lang in diagramInfinitePathMap
+ ? diagramInfinitePathMap[lang as keyof typeof diagramInfinitePathMap]
+ : diagramInfinitePathMap.en
+
+ return (
+
+ )
+}
diff --git a/docs/components/custom/diagrams/pagination.tsx b/docs/components/custom/diagrams/pagination.tsx
new file mode 100644
index 000000000..1e2af1794
--- /dev/null
+++ b/docs/components/custom/diagrams/pagination.tsx
@@ -0,0 +1,85 @@
+'use client'
+
+import { diagramPaginationPathsMap } from '../../translations/svgs'
+import { useParams } from 'next/navigation'
+
+export const Pagination = () => {
+ const { lang } = useParams()
+ const paths =
+ typeof lang === 'string' && lang in diagramPaginationPathsMap
+ ? diagramPaginationPathsMap[
+ lang as keyof typeof diagramPaginationPathsMap
+ ]
+ : diagramPaginationPathsMap.en
+
+ return (
+
+ )
+}
diff --git a/docs/components/custom/diagrams/welcome.tsx b/docs/components/custom/diagrams/welcome.tsx
new file mode 100644
index 000000000..cbf41aad5
--- /dev/null
+++ b/docs/components/custom/diagrams/welcome.tsx
@@ -0,0 +1,43 @@
+'use client'
+
+import { diagramWelcomePathMap } from '../../translations/svgs'
+import { useParams } from 'next/navigation'
+
+export const Welcome = () => {
+ const { lang } = useParams()
+ const path =
+ typeof lang === 'string' && lang in diagramWelcomePathMap
+ ? diagramWelcomePathMap[lang as keyof typeof diagramWelcomePathMap]
+ : diagramWelcomePathMap.en
+
+ return (
+
+ )
+}
diff --git a/docs/components/custom/excalidraw/state-machine.excalidraw b/docs/components/custom/excalidraw/state-machine.excalidraw
new file mode 100644
index 000000000..95e7a8b36
--- /dev/null
+++ b/docs/components/custom/excalidraw/state-machine.excalidraw
@@ -0,0 +1,5744 @@
+{
+ "type": "excalidraw",
+ "version": 2,
+ "source": "https://excalidraw.com",
+ "elements": [
+ {
+ "id": "Kk0t3c3ntffk2sUfTlyEg",
+ "type": "rectangle",
+ "x": 613.0214904006891,
+ "y": 491.47238998082344,
+ "width": 1210.9077358360364,
+ "height": 418.33413843075,
+ "angle": 0,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "transparent",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "seed": 1509111820,
+ "version": 276,
+ "versionNonce": 1122045580,
+ "isDeleted": false,
+ "boundElements": null,
+ "updated": 1661872465013,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "rectangle",
+ "version": 238,
+ "versionNonce": 323341964,
+ "isDeleted": false,
+ "id": "YYeS3AhcleSaAiDoqlpSa",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 711,
+ "y": 743,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 173,
+ "height": 73.99999999999999,
+ "seed": 1770431273,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408317,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 179,
+ "versionNonce": 128790580,
+ "isDeleted": false,
+ "id": "Jb5OzMemcdtU0lQgAtrT2",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 751,
+ "y": 765.5,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 90,
+ "height": 26,
+ "seed": 1934360967,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408317,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "undefined",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "undefined"
+ },
+ {
+ "type": "rectangle",
+ "version": 326,
+ "versionNonce": 2032409868,
+ "isDeleted": false,
+ "id": "1J-znl1gWOl4DgpMVqy46",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 709.5,
+ "y": 661,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 56,
+ "seed": 1406154791,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "type": "text",
+ "id": "w2QmI_TLGeChUqREIieDB"
+ }
+ ],
+ "updated": 1661872408317,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 100,
+ "versionNonce": 813762996,
+ "isDeleted": false,
+ "id": "w2QmI_TLGeChUqREIieDB",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 714.5,
+ "y": 677,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 1552158887,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408317,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "1J-znl1gWOl4DgpMVqy46",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 378,
+ "versionNonce": 1530174348,
+ "isDeleted": false,
+ "id": "LVh4uVLrroMXen1Kdp2lx",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 709.5,
+ "y": 589,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "#15aabf",
+ "width": 173,
+ "height": 42,
+ "seed": 1275784745,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "rN1Yi8_oIcZyW2tZHVXY5",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "rN1Yi8_oIcZyW2tZHVXY5"
+ }
+ ],
+ "updated": 1661872408317,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 159,
+ "versionNonce": 345879348,
+ "isDeleted": false,
+ "id": "rN1Yi8_oIcZyW2tZHVXY5",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 714.5,
+ "y": 598,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 16852199,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408317,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isLoading",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "LVh4uVLrroMXen1Kdp2lx",
+ "originalText": "isLoading"
+ },
+ {
+ "type": "arrow",
+ "version": 149,
+ "versionNonce": 1404127756,
+ "isDeleted": false,
+ "id": "1m5JBt1t2mfGAhRS9bkZm",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 715,
+ "y": 852,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 164,
+ "height": 2,
+ "seed": 2056928583,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408317,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": "arrow",
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 164,
+ 2
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 99,
+ "versionNonce": 1919495348,
+ "isDeleted": false,
+ "id": "TqxbxrMn8PwdIQMEM5KRS",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 752,
+ "y": 860,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 77,
+ "height": 26,
+ "seed": 583218951,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408317,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fetching",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fetching"
+ },
+ {
+ "type": "rectangle",
+ "version": 459,
+ "versionNonce": 630466700,
+ "isDeleted": false,
+ "id": "KImgLwVzg-Tu0JxYS-JVA",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 937.5,
+ "y": 744,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 239.00000000000006,
+ "height": 73.00000000000001,
+ "seed": 1737661351,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408317,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 296,
+ "versionNonce": 1267299892,
+ "isDeleted": false,
+ "id": "ip_A8a3IKow9H2qF6O2nn",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1032,
+ "y": 764.5,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 52,
+ "height": 26,
+ "seed": 1166026407,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408317,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "value",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "value"
+ },
+ {
+ "type": "arrow",
+ "version": 283,
+ "versionNonce": 613889804,
+ "isDeleted": false,
+ "id": "ds60SG5KbMPUqEwqog7-n",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1017,
+ "y": 852,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 149,
+ "height": 2,
+ "seed": 343575591,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": "arrow",
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 149,
+ 2
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 122,
+ "versionNonce": 2095353780,
+ "isDeleted": false,
+ "id": "HiuNh4LiXoo948aNvUFaJ",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1050.5,
+ "y": 860,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 77,
+ "height": 26,
+ "seed": 962136199,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fetching",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fetching"
+ },
+ {
+ "type": "rectangle",
+ "version": 372,
+ "versionNonce": 489977228,
+ "isDeleted": false,
+ "id": "q1JH4SvIeawtiKQdjMRcC",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1004.5,
+ "y": 662,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 55,
+ "seed": 318729671,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "6zf3U1HXWu_TAFbGG3k3I",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "6zf3U1HXWu_TAFbGG3k3I"
+ }
+ ],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 145,
+ "versionNonce": 1453357364,
+ "isDeleted": false,
+ "id": "6zf3U1HXWu_TAFbGG3k3I",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1009.5,
+ "y": 677.5,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 827094569,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "q1JH4SvIeawtiKQdjMRcC",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 238,
+ "versionNonce": 1017504780,
+ "isDeleted": false,
+ "id": "AbyTVn94-z0aAlq0rznNB",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1218.5,
+ "y": 745,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 173,
+ "height": 71,
+ "seed": 1085310663,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 275,
+ "versionNonce": 874721972,
+ "isDeleted": false,
+ "id": "lQmEro2yWiEj_Dhr2LaZ6",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1261,
+ "y": 764.5,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 95,
+ "height": 26,
+ "seed": 385973033,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "new value",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "new value"
+ },
+ {
+ "type": "rectangle",
+ "version": 352,
+ "versionNonce": 2028307084,
+ "isDeleted": false,
+ "id": "kq7aAMkOKrKh1yOMU_ytI",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 699.5,
+ "y": 1235,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 173,
+ "height": 73.99999999999999,
+ "seed": 395060489,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 297,
+ "versionNonce": 336772148,
+ "isDeleted": false,
+ "id": "MiC3ayLU7UnLHG7PetCVF",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 739.5,
+ "y": 1256.5,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 90,
+ "height": 26,
+ "seed": 310070279,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "undefined",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "undefined"
+ },
+ {
+ "type": "rectangle",
+ "version": 442,
+ "versionNonce": 2024624396,
+ "isDeleted": false,
+ "id": "wksvA5_uNH119ChV85tC8",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 698,
+ "y": 1153,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 56,
+ "seed": 1588894697,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "b1IgQquu9tLyTntgliMam",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "b1IgQquu9tLyTntgliMam"
+ }
+ ],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 215,
+ "versionNonce": 810882484,
+ "isDeleted": false,
+ "id": "b1IgQquu9tLyTntgliMam",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 703,
+ "y": 1169,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 157430567,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "wksvA5_uNH119ChV85tC8",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 494,
+ "versionNonce": 2071416716,
+ "isDeleted": false,
+ "id": "px-PDxzOhcDjkMUaOaVI2",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 698,
+ "y": 1081,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "#15aabf",
+ "width": 173,
+ "height": 42,
+ "seed": 1533753033,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "MbGbH1tVVt8K0oFevrXmw",
+ "type": "text"
+ },
+ {
+ "id": "MbGbH1tVVt8K0oFevrXmw",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "MbGbH1tVVt8K0oFevrXmw"
+ }
+ ],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 274,
+ "versionNonce": 370163508,
+ "isDeleted": false,
+ "id": "MbGbH1tVVt8K0oFevrXmw",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 703,
+ "y": 1090,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 1293891143,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isLoading",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "px-PDxzOhcDjkMUaOaVI2",
+ "originalText": "isLoading"
+ },
+ {
+ "type": "arrow",
+ "version": 263,
+ "versionNonce": 1098743308,
+ "isDeleted": false,
+ "id": "W3F1uAVoPCCSzF6oUC4sO",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 703.5,
+ "y": 1344,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 164,
+ "height": 2,
+ "seed": 4945321,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": "arrow",
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 164,
+ 2
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 196,
+ "versionNonce": 1034565812,
+ "isDeleted": false,
+ "id": "Jx4l2GwA-1hH8zOh07y8T",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 736.5,
+ "y": 1358,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 77,
+ "height": 26,
+ "seed": 344905063,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fetching",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fetching"
+ },
+ {
+ "type": "rectangle",
+ "version": 642,
+ "versionNonce": 1941560460,
+ "isDeleted": false,
+ "id": "x22YcQUfDJ9HsvjkiX5Yn",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 905,
+ "y": 1234,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 173.00000000000006,
+ "height": 73.00000000000001,
+ "seed": 1619056777,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 434,
+ "versionNonce": 583598644,
+ "isDeleted": false,
+ "id": "p0PPTIZt7aeVURBn0dGfS",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 956.5,
+ "y": 1256.5,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 73,
+ "height": 26,
+ "seed": 117280903,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "value(1)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "value(1)"
+ },
+ {
+ "type": "arrow",
+ "version": 501,
+ "versionNonce": 199650060,
+ "isDeleted": false,
+ "id": "Iw_sUfAFmcm74gT3C3nD0",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1129.5,
+ "y": 1332,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 168,
+ "height": 2,
+ "seed": 499572585,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": "arrow",
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 168,
+ 2
+ ]
+ ]
+ },
+ {
+ "type": "rectangle",
+ "version": 645,
+ "versionNonce": 1548917684,
+ "isDeleted": false,
+ "id": "xdVRpOKF4Gn8JIouGIW-m",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1412,
+ "y": 1147,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 55,
+ "seed": 375982665,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "XkVkYu-734HjBFYduM1fW",
+ "type": "text"
+ },
+ {
+ "id": "XkVkYu-734HjBFYduM1fW",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "XkVkYu-734HjBFYduM1fW"
+ }
+ ],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 417,
+ "versionNonce": 1014835596,
+ "isDeleted": false,
+ "id": "XkVkYu-734HjBFYduM1fW",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1417,
+ "y": 1162.5,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 674912967,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "xdVRpOKF4Gn8JIouGIW-m",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 452,
+ "versionNonce": 879559988,
+ "isDeleted": false,
+ "id": "P2bKLC1WnDg2IUxEzGPPl",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1127,
+ "y": 1235,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 172.00000000000006,
+ "height": 71,
+ "seed": 1396889897,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 159,
+ "versionNonce": 1791976716,
+ "isDeleted": false,
+ "id": "pvFyKnPV8G4wQhIrIH0_N",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 626.9412738941411,
+ "y": 510.2162031605824,
+ "strokeColor": "#000000",
+ "backgroundColor": "#15aabf",
+ "width": 214,
+ "height": 26,
+ "seed": 1760771143,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872486424,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Fetch and Revalidate",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Fetch and Revalidate"
+ },
+ {
+ "type": "text",
+ "version": 221,
+ "versionNonce": 995857420,
+ "isDeleted": false,
+ "id": "PRvyVsyGooeZB3HyIJ1aD",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 642.3151956386723,
+ "y": 999.7837968394175,
+ "strokeColor": "#000000",
+ "backgroundColor": "#15aabf",
+ "width": 110,
+ "height": 26,
+ "seed": 955668295,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872490947,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Key Change",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Key Change"
+ },
+ {
+ "type": "line",
+ "version": 123,
+ "versionNonce": 1016149644,
+ "isDeleted": false,
+ "id": "1vQcpsTi6BSuNVdH9YEKr",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1085,
+ "y": 1075,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 3,
+ "height": 289,
+ "seed": 191323751,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": null,
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 3,
+ 289
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 352,
+ "versionNonce": 2032945204,
+ "isDeleted": false,
+ "id": "RL4TzbmCNDEOw8u51p9qo",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1032.5,
+ "y": 1034,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 110,
+ "height": 26,
+ "seed": 1971744905,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Key Change",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Key Change"
+ },
+ {
+ "type": "text",
+ "version": 498,
+ "versionNonce": 885163276,
+ "isDeleted": false,
+ "id": "WpG9TPQ4O6-haeBwowQUa",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1168.5,
+ "y": 1256.5,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 90,
+ "height": 26,
+ "seed": 1549951401,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "undefined",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "undefined"
+ },
+ {
+ "type": "rectangle",
+ "version": 487,
+ "versionNonce": 1381835188,
+ "isDeleted": false,
+ "id": "JfzoPwS4vrEVfP-eTFfW9",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1126.5,
+ "y": 1146,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 56,
+ "seed": 1218507559,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "Nmu8TOtd3R_6mRmlKHAfx",
+ "type": "text"
+ },
+ {
+ "id": "Nmu8TOtd3R_6mRmlKHAfx",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "Nmu8TOtd3R_6mRmlKHAfx"
+ }
+ ],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 259,
+ "versionNonce": 1724253068,
+ "isDeleted": false,
+ "id": "Nmu8TOtd3R_6mRmlKHAfx",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1131.5,
+ "y": 1162,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 1148745417,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "JfzoPwS4vrEVfP-eTFfW9",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 554,
+ "versionNonce": 1396099892,
+ "isDeleted": false,
+ "id": "3YeTivkKa5hsNUtTBvbqK",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1123.5,
+ "y": 1074,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "#15aabf",
+ "width": 173,
+ "height": 42,
+ "seed": 1720078089,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "nXkvKp4ucvpYgd6I-Dm6h",
+ "type": "text"
+ },
+ {
+ "id": "nXkvKp4ucvpYgd6I-Dm6h",
+ "type": "text"
+ },
+ {
+ "id": "nXkvKp4ucvpYgd6I-Dm6h",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "nXkvKp4ucvpYgd6I-Dm6h"
+ }
+ ],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 333,
+ "versionNonce": 953528844,
+ "isDeleted": false,
+ "id": "nXkvKp4ucvpYgd6I-Dm6h",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1128.5,
+ "y": 1083,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 1729151495,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isLoading",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "3YeTivkKa5hsNUtTBvbqK",
+ "originalText": "isLoading"
+ },
+ {
+ "type": "text",
+ "version": 278,
+ "versionNonce": 773801140,
+ "isDeleted": false,
+ "id": "pQKV4tvHQLgJWJk75289t",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1178.5,
+ "y": 1352,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 77,
+ "height": 26,
+ "seed": 1909728615,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fetching",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fetching"
+ },
+ {
+ "type": "rectangle",
+ "version": 580,
+ "versionNonce": 971739276,
+ "isDeleted": false,
+ "id": "9HKgXaXUQ8bNQKIwUbH2R",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1339,
+ "y": 1230.5,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 254,
+ "height": 71,
+ "seed": 831128711,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 582,
+ "versionNonce": 1488752180,
+ "isDeleted": false,
+ "id": "QiCyaHLuzJYIr5yrJjAHE",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1429,
+ "y": 1254.5,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 82,
+ "height": 26,
+ "seed": 439704329,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "value(2)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "value(2)"
+ },
+ {
+ "type": "line",
+ "version": 335,
+ "versionNonce": 163684108,
+ "isDeleted": false,
+ "id": "w7vwwL-nYi1FCr_DnOXtt",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 993.5,
+ "y": 574.5,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 4,
+ "height": 158,
+ "seed": 151844873,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": null,
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 4,
+ 158
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 427,
+ "versionNonce": 603236276,
+ "isDeleted": false,
+ "id": "qS9CXouucCnVaWBbxOKCl",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 946,
+ "y": 548,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 106,
+ "height": 26,
+ "seed": 894509703,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Revalidate",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Revalidate"
+ },
+ {
+ "type": "line",
+ "version": 452,
+ "versionNonce": 1087495564,
+ "isDeleted": false,
+ "id": "1OI0D9FUkslc0jsno07Ja",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1404,
+ "y": 1068,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 0,
+ "height": 147,
+ "seed": 850202697,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": null,
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 0,
+ 147
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 466,
+ "versionNonce": 1408078132,
+ "isDeleted": false,
+ "id": "pi2UVgs40tFhpPqDF2obd",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1343,
+ "y": 1031,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 106,
+ "height": 26,
+ "seed": 677324039,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Revalidate",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Revalidate"
+ },
+ {
+ "type": "rectangle",
+ "version": 500,
+ "versionNonce": 1482050572,
+ "isDeleted": false,
+ "id": "UAUUIDK6zZlcVWEgN2qE7",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1617,
+ "y": 1229.5,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 172.00000000000006,
+ "height": 71,
+ "seed": 1672240807,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 581,
+ "versionNonce": 940395188,
+ "isDeleted": false,
+ "id": "umRTpRpHJ1xzYvcR3VDZf",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1648,
+ "y": 1251.5,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 124,
+ "height": 26,
+ "seed": 1162524745,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "new value(2)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "new value(2)"
+ },
+ {
+ "type": "text",
+ "version": 220,
+ "versionNonce": 306768524,
+ "isDeleted": false,
+ "id": "jDwsdJ6VGhZC08ivh5mf_",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 631,
+ "y": 767.5,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 55,
+ "height": 26,
+ "seed": 1934804007,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "data:",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "data:"
+ },
+ {
+ "type": "text",
+ "version": 283,
+ "versionNonce": 1917080884,
+ "isDeleted": false,
+ "id": "i5DdpjlG8SyLtpwaoc-3s",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 630.1982264854048,
+ "y": 1265,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 55,
+ "height": 26,
+ "seed": 944651369,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872496914,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "data:",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "data:"
+ },
+ {
+ "type": "rectangle",
+ "version": 407,
+ "versionNonce": 1633925388,
+ "isDeleted": false,
+ "id": "X07576UrkZKyxe1jE1j4e",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 696.25,
+ "y": 1721.5,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 173,
+ "height": 73.99999999999999,
+ "seed": 962185321,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 352,
+ "versionNonce": 580464052,
+ "isDeleted": false,
+ "id": "i_q6mz5TIxb-M329b8FIO",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 736.25,
+ "y": 1743,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 90,
+ "height": 26,
+ "seed": 2018774695,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "undefined",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "undefined"
+ },
+ {
+ "type": "rectangle",
+ "version": 499,
+ "versionNonce": 1361098636,
+ "isDeleted": false,
+ "id": "X4JgKjaJLwbt6gnY1kQ-b",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 694.75,
+ "y": 1639.5,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 56,
+ "seed": 1907807049,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "gSUd6JtRSlsBmQDkZegv6",
+ "type": "text"
+ },
+ {
+ "id": "gSUd6JtRSlsBmQDkZegv6",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "gSUd6JtRSlsBmQDkZegv6"
+ }
+ ],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 271,
+ "versionNonce": 1477531444,
+ "isDeleted": false,
+ "id": "gSUd6JtRSlsBmQDkZegv6",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 699.75,
+ "y": 1655.5,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 1212785095,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "X4JgKjaJLwbt6gnY1kQ-b",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 551,
+ "versionNonce": 1840899596,
+ "isDeleted": false,
+ "id": "iIvhSb1OKvlc0ZJS4ooP4",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 694.75,
+ "y": 1567.5,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "#15aabf",
+ "width": 173,
+ "height": 42,
+ "seed": 1945076265,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "TI9JnvAAvgrqCqWSlBlRt",
+ "type": "text"
+ },
+ {
+ "id": "TI9JnvAAvgrqCqWSlBlRt",
+ "type": "text"
+ },
+ {
+ "id": "TI9JnvAAvgrqCqWSlBlRt",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "TI9JnvAAvgrqCqWSlBlRt"
+ }
+ ],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 330,
+ "versionNonce": 1338527924,
+ "isDeleted": false,
+ "id": "TI9JnvAAvgrqCqWSlBlRt",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 699.75,
+ "y": 1576.5,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 643813607,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408318,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isLoading",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "iIvhSb1OKvlc0ZJS4ooP4",
+ "originalText": "isLoading"
+ },
+ {
+ "type": "arrow",
+ "version": 318,
+ "versionNonce": 740902028,
+ "isDeleted": false,
+ "id": "jUtmRAPJuXu2udxcePfL_",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 700.25,
+ "y": 1830.5,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 164,
+ "height": 2,
+ "seed": 1290753289,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": "arrow",
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 164,
+ 2
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 251,
+ "versionNonce": 2036603444,
+ "isDeleted": false,
+ "id": "YLre-hfIm8KeZeahU3FLV",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 733.25,
+ "y": 1844.5,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 77,
+ "height": 26,
+ "seed": 1008933895,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fetching",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fetching"
+ },
+ {
+ "type": "rectangle",
+ "version": 697,
+ "versionNonce": 1378407180,
+ "isDeleted": false,
+ "id": "InDDRYcfBfbQd1s2S2aF9",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 901.75,
+ "y": 1720.5,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 173.00000000000006,
+ "height": 73.00000000000001,
+ "seed": 1613876201,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 489,
+ "versionNonce": 1607119796,
+ "isDeleted": false,
+ "id": "5r5B3kuS9m_Iv9qBTvrFR",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 953.25,
+ "y": 1743,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 73,
+ "height": 26,
+ "seed": 1301283623,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "value(1)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "value(1)"
+ },
+ {
+ "type": "arrow",
+ "version": 556,
+ "versionNonce": 1580372364,
+ "isDeleted": false,
+ "id": "QzAaFPZmBhKQhIVu8unk_",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1126.25,
+ "y": 1818.5,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 168,
+ "height": 2,
+ "seed": 365061833,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": "arrow",
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 168,
+ 2
+ ]
+ ]
+ },
+ {
+ "type": "rectangle",
+ "version": 702,
+ "versionNonce": 1092754740,
+ "isDeleted": false,
+ "id": "afO9NshUcZaVaF9KmE14S",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1408.75,
+ "y": 1633.5,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 55,
+ "seed": 1796408903,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "3fjkrs14oR5ek-x38lZQr",
+ "type": "text"
+ },
+ {
+ "id": "3fjkrs14oR5ek-x38lZQr",
+ "type": "text"
+ },
+ {
+ "id": "3fjkrs14oR5ek-x38lZQr",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "3fjkrs14oR5ek-x38lZQr"
+ }
+ ],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 473,
+ "versionNonce": 1870692364,
+ "isDeleted": false,
+ "id": "3fjkrs14oR5ek-x38lZQr",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1413.75,
+ "y": 1649,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 1211934121,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "afO9NshUcZaVaF9KmE14S",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 507,
+ "versionNonce": 651187892,
+ "isDeleted": false,
+ "id": "WPNszsjUgNwQhP316UaQJ",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1123.75,
+ "y": 1721.5,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 172.00000000000006,
+ "height": 71,
+ "seed": 1669899623,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 264,
+ "versionNonce": 1622964404,
+ "isDeleted": false,
+ "id": "aHfSChp40csLmQFOcY_Zs",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 623.745008232533,
+ "y": 1477.186418156195,
+ "strokeColor": "#000000",
+ "backgroundColor": "#15aabf",
+ "width": 287,
+ "height": 26,
+ "seed": 1925974153,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872539938,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Key Change + Previous Data",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Key Change + Previous Data"
+ },
+ {
+ "type": "line",
+ "version": 178,
+ "versionNonce": 2105237556,
+ "isDeleted": false,
+ "id": "lOE_vnVNQC9K5Se2bWWLx",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1081.75,
+ "y": 1561.5,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 3,
+ "height": 289,
+ "seed": 1983733895,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": null,
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 3,
+ 289
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 407,
+ "versionNonce": 848358668,
+ "isDeleted": false,
+ "id": "S6Bjn3t1PM__g66H_vo2r",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1029.25,
+ "y": 1520.5,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 110,
+ "height": 26,
+ "seed": 522981225,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Key Change",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Key Change"
+ },
+ {
+ "type": "text",
+ "version": 561,
+ "versionNonce": 755579316,
+ "isDeleted": false,
+ "id": "jazia19SdkkqQe1VjY_Nb",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1165.25,
+ "y": 1743,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 73,
+ "height": 26,
+ "seed": 1156429735,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "value(1)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "value(1)"
+ },
+ {
+ "type": "rectangle",
+ "version": 544,
+ "versionNonce": 1854368652,
+ "isDeleted": false,
+ "id": "iXoEcrLefuWQYmtqmztJU",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1123.25,
+ "y": 1632.5,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 56,
+ "seed": 329792073,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "dMr5YFLxcV68cWumeHfRa",
+ "type": "text"
+ },
+ {
+ "id": "dMr5YFLxcV68cWumeHfRa",
+ "type": "text"
+ },
+ {
+ "id": "dMr5YFLxcV68cWumeHfRa",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "dMr5YFLxcV68cWumeHfRa"
+ }
+ ],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 315,
+ "versionNonce": 815784756,
+ "isDeleted": false,
+ "id": "dMr5YFLxcV68cWumeHfRa",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1128.25,
+ "y": 1648.5,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 96873159,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "iXoEcrLefuWQYmtqmztJU",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 611,
+ "versionNonce": 338303500,
+ "isDeleted": false,
+ "id": "x1I3OXDFuU-xA23V3GLFK",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1120.25,
+ "y": 1560.5,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "#15aabf",
+ "width": 173,
+ "height": 42,
+ "seed": 1092356393,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "TKz6NDSTv44S6Ap8IO6nL",
+ "type": "text"
+ },
+ {
+ "id": "TKz6NDSTv44S6Ap8IO6nL",
+ "type": "text"
+ },
+ {
+ "id": "TKz6NDSTv44S6Ap8IO6nL",
+ "type": "text"
+ },
+ {
+ "id": "TKz6NDSTv44S6Ap8IO6nL",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "TKz6NDSTv44S6Ap8IO6nL"
+ }
+ ],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 389,
+ "versionNonce": 782589108,
+ "isDeleted": false,
+ "id": "TKz6NDSTv44S6Ap8IO6nL",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1125.25,
+ "y": 1569.5,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 1969437159,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isLoading",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "x1I3OXDFuU-xA23V3GLFK",
+ "originalText": "isLoading"
+ },
+ {
+ "type": "text",
+ "version": 333,
+ "versionNonce": 2121463948,
+ "isDeleted": false,
+ "id": "aDYiQzh8aBqpdn9i2IDAV",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1175.25,
+ "y": 1838.5,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 77,
+ "height": 26,
+ "seed": 1894972425,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fetching",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fetching"
+ },
+ {
+ "type": "rectangle",
+ "version": 635,
+ "versionNonce": 280995380,
+ "isDeleted": false,
+ "id": "6EcRzruvGhRl4qaQRvDWP",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1335.75,
+ "y": 1717,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 254,
+ "height": 71,
+ "seed": 147940615,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 637,
+ "versionNonce": 421267212,
+ "isDeleted": false,
+ "id": "Xj3uEM-lc8n4WhXQf-P_u",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1425.75,
+ "y": 1741,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 82,
+ "height": 26,
+ "seed": 858297065,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "value(2)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "value(2)"
+ },
+ {
+ "type": "line",
+ "version": 507,
+ "versionNonce": 466927540,
+ "isDeleted": false,
+ "id": "EhwJhNvvM65Ful8w87Bii",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1400.75,
+ "y": 1554.5,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 0,
+ "height": 147,
+ "seed": 1603087399,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": null,
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 0,
+ 147
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 521,
+ "versionNonce": 1218397580,
+ "isDeleted": false,
+ "id": "lj_vDV4q0y3b0e2h-SFqH",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1339.75,
+ "y": 1517.5,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 106,
+ "height": 26,
+ "seed": 206065097,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Revalidate",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Revalidate"
+ },
+ {
+ "type": "rectangle",
+ "version": 555,
+ "versionNonce": 134916404,
+ "isDeleted": false,
+ "id": "uncQ_kN0RPYwcqavzlqSa",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1613.75,
+ "y": 1716,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 172.00000000000006,
+ "height": 71,
+ "seed": 1971523399,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 636,
+ "versionNonce": 1379316748,
+ "isDeleted": false,
+ "id": "Mq_1_Id6358tb36qOUxZO",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1644.75,
+ "y": 1738,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 124,
+ "height": 26,
+ "seed": 1668132009,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "new value(2)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "new value(2)"
+ },
+ {
+ "type": "text",
+ "version": 353,
+ "versionNonce": 558004108,
+ "isDeleted": false,
+ "id": "PylRCXiz6gf90EYur2T2Z",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 622.6611182971225,
+ "y": 1749.186418156195,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 55,
+ "height": 26,
+ "seed": 353341031,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872543280,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "data:",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "data:"
+ },
+ {
+ "type": "rectangle",
+ "version": 310,
+ "versionNonce": 1138512524,
+ "isDeleted": false,
+ "id": "ihyAzvaNiz5uA8GaiLPWW",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 686.8884595539555,
+ "y": 2173.189559258307,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 173,
+ "height": 73.99999999999999,
+ "seed": 509834857,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 259,
+ "versionNonce": 884010036,
+ "isDeleted": false,
+ "id": "T6j3IFZiAn7Hb9It95qsZ",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 726.8884595539555,
+ "y": 2195.689559258307,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 78,
+ "height": 26,
+ "seed": 75776167,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fallback",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fallback"
+ },
+ {
+ "type": "rectangle",
+ "version": 400,
+ "versionNonce": 1548361996,
+ "isDeleted": false,
+ "id": "zJBnW06vdcbbfBRnSc108",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 685.3884595539555,
+ "y": 2091.189559258307,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 56,
+ "seed": 626704713,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "smpycngSOyIJhmm0gXd-I",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "smpycngSOyIJhmm0gXd-I"
+ }
+ ],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 173,
+ "versionNonce": 2108507572,
+ "isDeleted": false,
+ "id": "smpycngSOyIJhmm0gXd-I",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 690.3884595539555,
+ "y": 2107.189559258307,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 61051847,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "zJBnW06vdcbbfBRnSc108",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 452,
+ "versionNonce": 1928994700,
+ "isDeleted": false,
+ "id": "H3Zl2XwzzExidUig8HVNH",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 685.3884595539555,
+ "y": 2019.1895592583069,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "#15aabf",
+ "width": 173,
+ "height": 42,
+ "seed": 686141481,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "xpZbDk2X0FMZescwVomsC",
+ "type": "text"
+ },
+ {
+ "id": "xpZbDk2X0FMZescwVomsC",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "xpZbDk2X0FMZescwVomsC"
+ }
+ ],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 232,
+ "versionNonce": 1759670068,
+ "isDeleted": false,
+ "id": "xpZbDk2X0FMZescwVomsC",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 690.3884595539555,
+ "y": 2028.1895592583069,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 95126247,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isLoading",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "H3Zl2XwzzExidUig8HVNH",
+ "originalText": "isLoading"
+ },
+ {
+ "type": "arrow",
+ "version": 221,
+ "versionNonce": 1613123084,
+ "isDeleted": false,
+ "id": "xS9IIQDLkgErZQzqQ0fhH",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 690.8884595539555,
+ "y": 2282.189559258307,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 164,
+ "height": 2,
+ "seed": 519029513,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": "arrow",
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 164,
+ 2
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 171,
+ "versionNonce": 1454794932,
+ "isDeleted": false,
+ "id": "NxWUY18f8e9lP2XEM6Gc7",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 727.8884595539555,
+ "y": 2290.189559258307,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 77,
+ "height": 26,
+ "seed": 1529384455,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fetching",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fetching"
+ },
+ {
+ "type": "rectangle",
+ "version": 531,
+ "versionNonce": 1690872972,
+ "isDeleted": false,
+ "id": "eOUmTf_pl0jPtRAyMJSos",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 913.3884595539555,
+ "y": 2174.189559258307,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 239.00000000000006,
+ "height": 73.00000000000001,
+ "seed": 871660009,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 368,
+ "versionNonce": 718221876,
+ "isDeleted": false,
+ "id": "QlctkAze-M5eHvPo6B-Lc",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1007.8884595539555,
+ "y": 2194.689559258307,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 52,
+ "height": 26,
+ "seed": 253179175,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "value",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "value"
+ },
+ {
+ "type": "arrow",
+ "version": 355,
+ "versionNonce": 312163084,
+ "isDeleted": false,
+ "id": "GxwgVKF1EMfg57zGxAjys",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 992.8884595539555,
+ "y": 2282.189559258307,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 149,
+ "height": 2,
+ "seed": 2029999305,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": "arrow",
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 149,
+ 2
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 194,
+ "versionNonce": 1678953396,
+ "isDeleted": false,
+ "id": "WhtuZUvyw2pY3WuNnesmR",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1026.3884595539555,
+ "y": 2290.189559258307,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 77,
+ "height": 26,
+ "seed": 417593415,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fetching",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fetching"
+ },
+ {
+ "type": "rectangle",
+ "version": 446,
+ "versionNonce": 873986444,
+ "isDeleted": false,
+ "id": "FcylyWM7Qd_0-_dy9wM8R",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 980.3884595539555,
+ "y": 2092.189559258307,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 55,
+ "seed": 1370215337,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "6TqaFXsbq8mVtLoqd-cjM",
+ "type": "text"
+ },
+ {
+ "id": "6TqaFXsbq8mVtLoqd-cjM",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "6TqaFXsbq8mVtLoqd-cjM"
+ }
+ ],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 218,
+ "versionNonce": 883373364,
+ "isDeleted": false,
+ "id": "6TqaFXsbq8mVtLoqd-cjM",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 985.3884595539555,
+ "y": 2107.689559258307,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 1315657575,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "FcylyWM7Qd_0-_dy9wM8R",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 310,
+ "versionNonce": 880338956,
+ "isDeleted": false,
+ "id": "JShdMRiNe0cY7wZNfkImX",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1194.3884595539555,
+ "y": 2175.189559258307,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 173,
+ "height": 71,
+ "seed": 572880521,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 347,
+ "versionNonce": 435318452,
+ "isDeleted": false,
+ "id": "IFv2LoPJw-Q4vfKzEibw2",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1236.8884595539555,
+ "y": 2194.689559258307,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 95,
+ "height": 26,
+ "seed": 368693895,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "new value",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "new value"
+ },
+ {
+ "type": "text",
+ "version": 222,
+ "versionNonce": 2020549004,
+ "isDeleted": false,
+ "id": "xNer53OL1VYGexoBT2N17",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 626.2649588493185,
+ "y": 1939.0920228049895,
+ "strokeColor": "#000000",
+ "backgroundColor": "#15aabf",
+ "width": 80,
+ "height": 26,
+ "seed": 1026014569,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872556299,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Fallback",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Fallback"
+ },
+ {
+ "type": "line",
+ "version": 407,
+ "versionNonce": 1956280372,
+ "isDeleted": false,
+ "id": "93Pb9UyBoNwG41sc0hr-n",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 969.3884595539555,
+ "y": 2004.6895592583069,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 4,
+ "height": 158,
+ "seed": 1481370023,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408319,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": null,
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 4,
+ 158
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 499,
+ "versionNonce": 311383308,
+ "isDeleted": false,
+ "id": "hZO5JKafA3T20N9oQvGbg",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 921.8884595539555,
+ "y": 1978.1895592583069,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 106,
+ "height": 26,
+ "seed": 301869129,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Revalidate",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Revalidate"
+ },
+ {
+ "type": "text",
+ "version": 311,
+ "versionNonce": 438650764,
+ "isDeleted": false,
+ "id": "zpYIOjWbVzmvnqh9DZn4u",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 621.9267415386879,
+ "y": 2200.003141102112,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 55,
+ "height": 26,
+ "seed": 848174279,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872552894,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "data:",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "data:"
+ },
+ {
+ "type": "rectangle",
+ "version": 448,
+ "versionNonce": 309908364,
+ "isDeleted": false,
+ "id": "QK8ETnxdqprXjm7W52Kdd",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 711.7681434957126,
+ "y": 2637.55751178056,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 173,
+ "height": 73.99999999999999,
+ "seed": 477784647,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 404,
+ "versionNonce": 215546676,
+ "isDeleted": false,
+ "id": "8RhamJiC35B4-ou8m42LO",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 751.7681434957126,
+ "y": 2659.05751178056,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 98,
+ "height": 26,
+ "seed": 1315799465,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fallback(1)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fallback(1)"
+ },
+ {
+ "type": "rectangle",
+ "version": 540,
+ "versionNonce": 95322636,
+ "isDeleted": false,
+ "id": "SS5f0BrVXehYGOEa5X9ne",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 710.2681434957126,
+ "y": 2555.55751178056,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 56,
+ "seed": 979601767,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "BVE9CJhFraT5fxaX009gL",
+ "type": "text"
+ },
+ {
+ "id": "BVE9CJhFraT5fxaX009gL",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "BVE9CJhFraT5fxaX009gL"
+ }
+ ],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 312,
+ "versionNonce": 1408988340,
+ "isDeleted": false,
+ "id": "BVE9CJhFraT5fxaX009gL",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 715.2681434957126,
+ "y": 2571.55751178056,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 914449545,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "SS5f0BrVXehYGOEa5X9ne",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 592,
+ "versionNonce": 321544332,
+ "isDeleted": false,
+ "id": "9GEDngDGuqfDGTG9TlOR3",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 710.2681434957126,
+ "y": 2483.55751178056,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "#15aabf",
+ "width": 173,
+ "height": 42,
+ "seed": 2015085703,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "vYN7kfHARtO3JdYIaif7j",
+ "type": "text"
+ },
+ {
+ "id": "vYN7kfHARtO3JdYIaif7j",
+ "type": "text"
+ },
+ {
+ "id": "vYN7kfHARtO3JdYIaif7j",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "vYN7kfHARtO3JdYIaif7j"
+ }
+ ],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 371,
+ "versionNonce": 1402125876,
+ "isDeleted": false,
+ "id": "vYN7kfHARtO3JdYIaif7j",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 715.2681434957126,
+ "y": 2492.55751178056,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 2077617001,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isLoading",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "9GEDngDGuqfDGTG9TlOR3",
+ "originalText": "isLoading"
+ },
+ {
+ "type": "arrow",
+ "version": 359,
+ "versionNonce": 1923510028,
+ "isDeleted": false,
+ "id": "Mo-H-Fulwz9E3JWsIPtD_",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 715.7681434957126,
+ "y": 2746.55751178056,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 164,
+ "height": 2,
+ "seed": 1163893671,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": "arrow",
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 164,
+ 2
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 292,
+ "versionNonce": 1149556660,
+ "isDeleted": false,
+ "id": "1qM8CjGcbdG131pqOfKK6",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 748.7681434957126,
+ "y": 2760.55751178056,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 77,
+ "height": 26,
+ "seed": 1991677513,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fetching",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fetching"
+ },
+ {
+ "type": "rectangle",
+ "version": 738,
+ "versionNonce": 1419554188,
+ "isDeleted": false,
+ "id": "i2Xp_D9DySTF1jwUWmze9",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 917.2681434957126,
+ "y": 2636.55751178056,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 173.00000000000006,
+ "height": 73.00000000000001,
+ "seed": 1717276359,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 530,
+ "versionNonce": 1391968564,
+ "isDeleted": false,
+ "id": "Yu0xvL1SRmFeiejho6Lg-",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 968.7681434957126,
+ "y": 2659.05751178056,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 73,
+ "height": 26,
+ "seed": 1778312489,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "value(1)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "value(1)"
+ },
+ {
+ "type": "arrow",
+ "version": 597,
+ "versionNonce": 1246174220,
+ "isDeleted": false,
+ "id": "XTF7n7FVWSLqOymEzCJlk",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1141.7681434957126,
+ "y": 2734.55751178056,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 168,
+ "height": 2,
+ "seed": 1705778663,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": "arrow",
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 168,
+ 2
+ ]
+ ]
+ },
+ {
+ "type": "rectangle",
+ "version": 743,
+ "versionNonce": 911309492,
+ "isDeleted": false,
+ "id": "6n-KLKuH69b579OrlP2d0",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1424.2681434957128,
+ "y": 2549.55751178056,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 55,
+ "seed": 823810057,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "OBLx8Bl1i9R0n4ZM64DJ-",
+ "type": "text"
+ },
+ {
+ "id": "OBLx8Bl1i9R0n4ZM64DJ-",
+ "type": "text"
+ },
+ {
+ "id": "OBLx8Bl1i9R0n4ZM64DJ-",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "OBLx8Bl1i9R0n4ZM64DJ-"
+ }
+ ],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 514,
+ "versionNonce": 765442700,
+ "isDeleted": false,
+ "id": "OBLx8Bl1i9R0n4ZM64DJ-",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1429.2681434957128,
+ "y": 2565.05751178056,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 1180551431,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "6n-KLKuH69b579OrlP2d0",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 548,
+ "versionNonce": 1228407860,
+ "isDeleted": false,
+ "id": "vXazvgvKaIyfv2xbzeF7y",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1139.2681434957126,
+ "y": 2637.55751178056,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 172.00000000000006,
+ "height": 71,
+ "seed": 772042473,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 310,
+ "versionNonce": 1490988940,
+ "isDeleted": false,
+ "id": "lKGn4gvlLBYgqHGQhrh1o",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 626.3816606654158,
+ "y": 2394.4268789739904,
+ "strokeColor": "#000000",
+ "backgroundColor": "#15aabf",
+ "width": 221,
+ "height": 26,
+ "seed": 1978470439,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872559073,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Key Change + Fallback",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Key Change + Fallback"
+ },
+ {
+ "type": "line",
+ "version": 219,
+ "versionNonce": 563174836,
+ "isDeleted": false,
+ "id": "gcvBTbOx4-8lyfF1JWsg8",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1097.2681434957126,
+ "y": 2477.55751178056,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 3,
+ "height": 289,
+ "seed": 2001250761,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": null,
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 3,
+ 289
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 448,
+ "versionNonce": 17008524,
+ "isDeleted": false,
+ "id": "lR7avuBHvY7TZP6nE-8y0",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1044.7681434957126,
+ "y": 2436.55751178056,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 110,
+ "height": 26,
+ "seed": 2118546247,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Key Change",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Key Change"
+ },
+ {
+ "type": "text",
+ "version": 605,
+ "versionNonce": 679708468,
+ "isDeleted": false,
+ "id": "gUByQPmreSTplzK4zEjMb",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1180.7681434957126,
+ "y": 2659.05751178056,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 107,
+ "height": 26,
+ "seed": 1174571177,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fallback(2)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fallback(2)"
+ },
+ {
+ "type": "rectangle",
+ "version": 585,
+ "versionNonce": 952284684,
+ "isDeleted": false,
+ "id": "WguJwYWvB0Pork0K46YLa",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1138.7681434957126,
+ "y": 2548.55751178056,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 56,
+ "seed": 2009494119,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "OwilWRwNmEHxvUlIoSf8k",
+ "type": "text"
+ },
+ {
+ "id": "OwilWRwNmEHxvUlIoSf8k",
+ "type": "text"
+ },
+ {
+ "id": "OwilWRwNmEHxvUlIoSf8k",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "OwilWRwNmEHxvUlIoSf8k"
+ }
+ ],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 356,
+ "versionNonce": 846495924,
+ "isDeleted": false,
+ "id": "OwilWRwNmEHxvUlIoSf8k",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1143.7681434957126,
+ "y": 2564.55751178056,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 601721737,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "WguJwYWvB0Pork0K46YLa",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 652,
+ "versionNonce": 1033376908,
+ "isDeleted": false,
+ "id": "QdivBt-TGkRRlJEwCyrAv",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1135.7681434957126,
+ "y": 2476.55751178056,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "#15aabf",
+ "width": 173,
+ "height": 42,
+ "seed": 993627527,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "3UUfdlua29WkF_1gKm_16",
+ "type": "text"
+ },
+ {
+ "id": "3UUfdlua29WkF_1gKm_16",
+ "type": "text"
+ },
+ {
+ "id": "3UUfdlua29WkF_1gKm_16",
+ "type": "text"
+ },
+ {
+ "id": "3UUfdlua29WkF_1gKm_16",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "3UUfdlua29WkF_1gKm_16"
+ }
+ ],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 430,
+ "versionNonce": 386550324,
+ "isDeleted": false,
+ "id": "3UUfdlua29WkF_1gKm_16",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1140.7681434957126,
+ "y": 2485.55751178056,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 1494561385,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isLoading",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "QdivBt-TGkRRlJEwCyrAv",
+ "originalText": "isLoading"
+ },
+ {
+ "type": "text",
+ "version": 374,
+ "versionNonce": 1832755980,
+ "isDeleted": false,
+ "id": "jaN2RPWTkxJq4UKk6nW8x",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1190.7681434957126,
+ "y": 2754.55751178056,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 77,
+ "height": 26,
+ "seed": 1406944423,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fetching",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fetching"
+ },
+ {
+ "type": "rectangle",
+ "version": 676,
+ "versionNonce": 1227547572,
+ "isDeleted": false,
+ "id": "meBDVJ3ooCK77BFOeTXc6",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1351.2681434957128,
+ "y": 2633.05751178056,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 254,
+ "height": 71,
+ "seed": 443874633,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 678,
+ "versionNonce": 1580032396,
+ "isDeleted": false,
+ "id": "Qb8rusB9PvrZcmGExWn-2",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1441.2681434957128,
+ "y": 2657.05751178056,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 82,
+ "height": 26,
+ "seed": 828053447,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "value(2)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "value(2)"
+ },
+ {
+ "type": "line",
+ "version": 548,
+ "versionNonce": 1862028596,
+ "isDeleted": false,
+ "id": "DNJWtKpLHm78Qr9CRE6KK",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1416.2681434957128,
+ "y": 2470.55751178056,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 0,
+ "height": 147,
+ "seed": 2002283561,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": null,
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 0,
+ 147
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 562,
+ "versionNonce": 1201754124,
+ "isDeleted": false,
+ "id": "aM1FK248ewZaF45gQU9GD",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1355.2681434957128,
+ "y": 2433.55751178056,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 106,
+ "height": 26,
+ "seed": 433227495,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Revalidate",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Revalidate"
+ },
+ {
+ "type": "rectangle",
+ "version": 596,
+ "versionNonce": 2045019828,
+ "isDeleted": false,
+ "id": "GiUibUatWu7WRRcxtI1XA",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1629.2681434957128,
+ "y": 2632.05751178056,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 172.00000000000006,
+ "height": 71,
+ "seed": 128646921,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 677,
+ "versionNonce": 1771269772,
+ "isDeleted": false,
+ "id": "V7oZ1QERdHVh3cS91WNUl",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1660.2681434957128,
+ "y": 2654.05751178056,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 124,
+ "height": 26,
+ "seed": 1540297223,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "new value(2)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "new value(2)"
+ },
+ {
+ "type": "text",
+ "version": 381,
+ "versionNonce": 1590518668,
+ "isDeleted": false,
+ "id": "9a_kKwKgIzm2Z0IjEh_Z4",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 637.0224708709327,
+ "y": 2667.55751178056,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 55,
+ "height": 26,
+ "seed": 1508390377,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872563409,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "data:",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "data:"
+ },
+ {
+ "type": "rectangle",
+ "version": 482,
+ "versionNonce": 1958591756,
+ "isDeleted": false,
+ "id": "-obYwrHQGLpaItpqHexYm",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 712.8987763022823,
+ "y": 3089.8106344083985,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 173,
+ "height": 73.99999999999999,
+ "seed": 1475085001,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 437,
+ "versionNonce": 215050676,
+ "isDeleted": false,
+ "id": "LeS1s-a6H698PwNaqcMqV",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 752.8987763022823,
+ "y": 3111.3106344083985,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 98,
+ "height": 26,
+ "seed": 1860250183,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fallback(1)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fallback(1)"
+ },
+ {
+ "type": "rectangle",
+ "version": 575,
+ "versionNonce": 1922710412,
+ "isDeleted": false,
+ "id": "6j9Rz1BMk4ED8YdCTmiaX",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 711.3987763022823,
+ "y": 3007.8106344083985,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 56,
+ "seed": 1255326121,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "NGoZB15IE4xoOlF-S-nY5",
+ "type": "text"
+ },
+ {
+ "id": "NGoZB15IE4xoOlF-S-nY5",
+ "type": "text"
+ },
+ {
+ "id": "NGoZB15IE4xoOlF-S-nY5",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "NGoZB15IE4xoOlF-S-nY5"
+ }
+ ],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 346,
+ "versionNonce": 1205998388,
+ "isDeleted": false,
+ "id": "NGoZB15IE4xoOlF-S-nY5",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 716.3987763022823,
+ "y": 3023.8106344083985,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 301091175,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408320,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "6j9Rz1BMk4ED8YdCTmiaX",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 627,
+ "versionNonce": 761457164,
+ "isDeleted": false,
+ "id": "rwYXrQpHbnAHN197NhMMb",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 711.3987763022823,
+ "y": 2935.8106344083985,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "#15aabf",
+ "width": 173,
+ "height": 42,
+ "seed": 1950262409,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "rAjdPbbaQQfSV10qiYBOT",
+ "type": "text"
+ },
+ {
+ "id": "rAjdPbbaQQfSV10qiYBOT",
+ "type": "text"
+ },
+ {
+ "id": "rAjdPbbaQQfSV10qiYBOT",
+ "type": "text"
+ },
+ {
+ "id": "rAjdPbbaQQfSV10qiYBOT",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "rAjdPbbaQQfSV10qiYBOT"
+ }
+ ],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 405,
+ "versionNonce": 2116127924,
+ "isDeleted": false,
+ "id": "rAjdPbbaQQfSV10qiYBOT",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 716.3987763022823,
+ "y": 2944.8106344083985,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 1876067463,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isLoading",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "rwYXrQpHbnAHN197NhMMb",
+ "originalText": "isLoading"
+ },
+ {
+ "type": "arrow",
+ "version": 392,
+ "versionNonce": 403818636,
+ "isDeleted": false,
+ "id": "XqPo2HNpHJM9q4PkTwP7P",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 716.8987763022823,
+ "y": 3198.8106344083985,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 164,
+ "height": 2,
+ "seed": 267070313,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": "arrow",
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 164,
+ 2
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 325,
+ "versionNonce": 20305460,
+ "isDeleted": false,
+ "id": "_iHlnrQt-vZVk8HNbdziN",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 749.8987763022823,
+ "y": 3212.8106344083985,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 77,
+ "height": 26,
+ "seed": 406739879,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fetching",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fetching"
+ },
+ {
+ "type": "rectangle",
+ "version": 771,
+ "versionNonce": 912316172,
+ "isDeleted": false,
+ "id": "UVAEdnKioqetobHZXEz2X",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 918.3987763022823,
+ "y": 3088.8106344083985,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 173.00000000000006,
+ "height": 73.00000000000001,
+ "seed": 1445189193,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 563,
+ "versionNonce": 2114252724,
+ "isDeleted": false,
+ "id": "Nj8h4rs1lhG6GLtfIoLEi",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 969.8987763022823,
+ "y": 3111.3106344083985,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 73,
+ "height": 26,
+ "seed": 1868713671,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "value(1)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "value(1)"
+ },
+ {
+ "type": "arrow",
+ "version": 630,
+ "versionNonce": 80352652,
+ "isDeleted": false,
+ "id": "9PNnPgq1RY62-qWmbGaTY",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1142.8987763022822,
+ "y": 3186.8106344083985,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 168,
+ "height": 2,
+ "seed": 1774462249,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": "arrow",
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 168,
+ 2
+ ]
+ ]
+ },
+ {
+ "type": "rectangle",
+ "version": 778,
+ "versionNonce": 347396404,
+ "isDeleted": false,
+ "id": "pllGeq__Vv3Sy-zrAFoZJ",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1425.3987763022824,
+ "y": 3001.8106344083985,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 55,
+ "seed": 534437351,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "FGFotr7EZlk-mCyeu0T0_",
+ "type": "text"
+ },
+ {
+ "id": "FGFotr7EZlk-mCyeu0T0_",
+ "type": "text"
+ },
+ {
+ "id": "FGFotr7EZlk-mCyeu0T0_",
+ "type": "text"
+ },
+ {
+ "id": "FGFotr7EZlk-mCyeu0T0_",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "FGFotr7EZlk-mCyeu0T0_"
+ }
+ ],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 548,
+ "versionNonce": 1619493900,
+ "isDeleted": false,
+ "id": "FGFotr7EZlk-mCyeu0T0_",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1430.3987763022824,
+ "y": 3017.3106344083985,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 104306697,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "pllGeq__Vv3Sy-zrAFoZJ",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 581,
+ "versionNonce": 1890292404,
+ "isDeleted": false,
+ "id": "We9aiA07XYKROyzIczfPg",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1140.3987763022822,
+ "y": 3089.8106344083985,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 172.00000000000006,
+ "height": 71,
+ "seed": 1286899975,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 379,
+ "versionNonce": 446139444,
+ "isDeleted": false,
+ "id": "tyqI5KzygcqyZvnrn-5rL",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 632.296248081498,
+ "y": 2851.281007174106,
+ "strokeColor": "#000000",
+ "backgroundColor": "#15aabf",
+ "width": 398,
+ "height": 26,
+ "seed": 1836691177,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872568882,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Key Change + Previous Data + Fallback",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Key Change + Previous Data + Fallback"
+ },
+ {
+ "type": "line",
+ "version": 252,
+ "versionNonce": 1619991604,
+ "isDeleted": false,
+ "id": "9ryLZmvw2TQRg0-LfGpc5",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1098.3987763022824,
+ "y": 2929.8106344083985,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 3,
+ "height": 289,
+ "seed": 57397287,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": null,
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 3,
+ 289
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 481,
+ "versionNonce": 145158412,
+ "isDeleted": false,
+ "id": "pgAj5KMbnf6uYvqC0LnZD",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1045.8987763022822,
+ "y": 2888.8106344083985,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 110,
+ "height": 26,
+ "seed": 370534857,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Key Change",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Key Change"
+ },
+ {
+ "type": "text",
+ "version": 635,
+ "versionNonce": 1850045876,
+ "isDeleted": false,
+ "id": "hlJVsC9l19LF85JDKspWQ",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1181.8987763022824,
+ "y": 3111.3106344083985,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 73,
+ "height": 26,
+ "seed": 1844261703,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "value(1)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "value(1)"
+ },
+ {
+ "type": "rectangle",
+ "version": 620,
+ "versionNonce": 456978316,
+ "isDeleted": false,
+ "id": "Boon9aMQQkYRoLFNH-TO0",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1139.8987763022822,
+ "y": 3000.8106344083985,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "#fab005",
+ "width": 173,
+ "height": 56,
+ "seed": 422037673,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "GdYbNrg2YuX0CfmULECgW",
+ "type": "text"
+ },
+ {
+ "id": "GdYbNrg2YuX0CfmULECgW",
+ "type": "text"
+ },
+ {
+ "id": "GdYbNrg2YuX0CfmULECgW",
+ "type": "text"
+ },
+ {
+ "id": "GdYbNrg2YuX0CfmULECgW",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "GdYbNrg2YuX0CfmULECgW"
+ }
+ ],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 390,
+ "versionNonce": 1995743028,
+ "isDeleted": false,
+ "id": "GdYbNrg2YuX0CfmULECgW",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1144.8987763022822,
+ "y": 3016.8106344083985,
+ "strokeColor": "#c92a2a",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 1150628455,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isValidating",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "Boon9aMQQkYRoLFNH-TO0",
+ "originalText": "isValidating"
+ },
+ {
+ "type": "rectangle",
+ "version": 687,
+ "versionNonce": 395255308,
+ "isDeleted": false,
+ "id": "7yiHj7_DavbMiO75thqAu",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1136.8987763022822,
+ "y": 2928.8106344083985,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "#15aabf",
+ "width": 173,
+ "height": 42,
+ "seed": 1616563081,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [
+ {
+ "id": "6_XBHa2TIyUiES2nPvQ_y",
+ "type": "text"
+ },
+ {
+ "id": "6_XBHa2TIyUiES2nPvQ_y",
+ "type": "text"
+ },
+ {
+ "id": "6_XBHa2TIyUiES2nPvQ_y",
+ "type": "text"
+ },
+ {
+ "id": "6_XBHa2TIyUiES2nPvQ_y",
+ "type": "text"
+ },
+ {
+ "id": "6_XBHa2TIyUiES2nPvQ_y",
+ "type": "text"
+ },
+ {
+ "type": "text",
+ "id": "6_XBHa2TIyUiES2nPvQ_y"
+ }
+ ],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 464,
+ "versionNonce": 1124243636,
+ "isDeleted": false,
+ "id": "6_XBHa2TIyUiES2nPvQ_y",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1141.8987763022822,
+ "y": 2937.8106344083985,
+ "strokeColor": "#1864ab",
+ "backgroundColor": "transparent",
+ "width": 163,
+ "height": 24,
+ "seed": 3165575,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "isLoading",
+ "baseline": 17,
+ "textAlign": "center",
+ "verticalAlign": "middle",
+ "containerId": "7yiHj7_DavbMiO75thqAu",
+ "originalText": "isLoading"
+ },
+ {
+ "type": "text",
+ "version": 407,
+ "versionNonce": 1452768396,
+ "isDeleted": false,
+ "id": "Y20W-l3e_saX6dt-GFuJW",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1191.8987763022824,
+ "y": 3206.8106344083985,
+ "strokeColor": "#862e9c",
+ "backgroundColor": "#15aabf",
+ "width": 77,
+ "height": 26,
+ "seed": 334131817,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "fetching",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "fetching"
+ },
+ {
+ "type": "rectangle",
+ "version": 709,
+ "versionNonce": 504717876,
+ "isDeleted": false,
+ "id": "JN164kTgKkkjOmmjlo-HU",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1352.3987763022824,
+ "y": 3085.3106344083985,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 254,
+ "height": 71,
+ "seed": 1274741927,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 711,
+ "versionNonce": 34605836,
+ "isDeleted": false,
+ "id": "sZLyb8U-QFWZNGpaBtKGd",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1442.3987763022824,
+ "y": 3109.3106344083985,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 82,
+ "height": 26,
+ "seed": 1218592073,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "value(2)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "value(2)"
+ },
+ {
+ "type": "line",
+ "version": 581,
+ "versionNonce": 1863515060,
+ "isDeleted": false,
+ "id": "51DRbuFYdETkxNpiyNFKn",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1417.3987763022824,
+ "y": 2922.8106344083985,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 0,
+ "height": 147,
+ "seed": 933353415,
+ "groupIds": [],
+ "strokeSharpness": "round",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "startBinding": null,
+ "endBinding": null,
+ "lastCommittedPoint": null,
+ "startArrowhead": null,
+ "endArrowhead": null,
+ "points": [
+ [
+ 0,
+ 0
+ ],
+ [
+ 0,
+ 147
+ ]
+ ]
+ },
+ {
+ "type": "text",
+ "version": 595,
+ "versionNonce": 2087897484,
+ "isDeleted": false,
+ "id": "ohg_PD-xV0p3gI3bFSgMK",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1356.3987763022824,
+ "y": 2885.8106344083985,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "#15aabf",
+ "width": 106,
+ "height": 26,
+ "seed": 1843244073,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "Revalidate",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "Revalidate"
+ },
+ {
+ "type": "rectangle",
+ "version": 629,
+ "versionNonce": 1344365876,
+ "isDeleted": false,
+ "id": "R7bZyYHto39eS0ou8AQOR",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1630.3987763022824,
+ "y": 3084.3106344083985,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 172.00000000000006,
+ "height": 71,
+ "seed": 692143847,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "text",
+ "version": 710,
+ "versionNonce": 1224325132,
+ "isDeleted": false,
+ "id": "oG5YEm7Mlu66zElwDyzL4",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 1661.3987763022824,
+ "y": 3106.3106344083985,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 124,
+ "height": 26,
+ "seed": 2072526601,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872408321,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "new value(2)",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "new value(2)"
+ },
+ {
+ "type": "text",
+ "version": 405,
+ "versionNonce": 1649937548,
+ "isDeleted": false,
+ "id": "DdTxZWybeUxdYj3VG6KiQ",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "solid",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 634.6827309117947,
+ "y": 3119.8106344083985,
+ "strokeColor": "#000000",
+ "backgroundColor": "transparent",
+ "width": 55,
+ "height": 26,
+ "seed": 258331143,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872572095,
+ "link": null,
+ "locked": false,
+ "fontSize": 20,
+ "fontFamily": 1,
+ "text": "data:",
+ "baseline": 18,
+ "textAlign": "left",
+ "verticalAlign": "top",
+ "containerId": null,
+ "originalText": "data:"
+ },
+ {
+ "type": "rectangle",
+ "version": 367,
+ "versionNonce": 4402868,
+ "isDeleted": false,
+ "id": "9SPdPUm0w_2mgmCR-h7Tz",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 614.7174396105432,
+ "y": 982.1670280320277,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "transparent",
+ "width": 1210.9077358360364,
+ "height": 418.33413843075,
+ "seed": 1981925812,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872474798,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "rectangle",
+ "version": 420,
+ "versionNonce": 554416308,
+ "isDeleted": false,
+ "id": "cBsL94s5t7EYd-kbPTSn7",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 607.041255728865,
+ "y": 1450.7605045639884,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "transparent",
+ "width": 1210.9077358360364,
+ "height": 418.33413843075,
+ "seed": 91199540,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872506656,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "rectangle",
+ "version": 450,
+ "versionNonce": 541671732,
+ "isDeleted": false,
+ "id": "AiiDTwKfUUq1xH3shu2YD",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 605.8844648069626,
+ "y": 1911.1632914811794,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "transparent",
+ "width": 1210.9077358360364,
+ "height": 418.33413843075,
+ "seed": 502956596,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872516268,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "rectangle",
+ "version": 444,
+ "versionNonce": 1441266996,
+ "isDeleted": false,
+ "id": "d3PM5Quw5oezQfpn8rmYf",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 610.5116284945725,
+ "y": 2373.8796602421753,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "transparent",
+ "width": 1210.9077358360364,
+ "height": 418.33413843075,
+ "seed": 1567816372,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872524462,
+ "link": null,
+ "locked": false
+ },
+ {
+ "type": "rectangle",
+ "version": 439,
+ "versionNonce": 25553036,
+ "isDeleted": false,
+ "id": "DWQ6aIClOm1-zU3bw7aiS",
+ "fillStyle": "hachure",
+ "strokeWidth": 1,
+ "strokeStyle": "dotted",
+ "roughness": 1,
+ "opacity": 100,
+ "angle": 0,
+ "x": 609.3548375726702,
+ "y": 2837.7528199250733,
+ "strokeColor": "#d9480f",
+ "backgroundColor": "transparent",
+ "width": 1210.9077358360364,
+ "height": 418.33413843075,
+ "seed": 1742354100,
+ "groupIds": [],
+ "strokeSharpness": "sharp",
+ "boundElements": [],
+ "updated": 1661872529798,
+ "link": null,
+ "locked": false
+ }
+ ],
+ "appState": {
+ "gridSize": null,
+ "viewBackgroundColor": "#ffffff"
+ },
+ "files": {}
+}
\ No newline at end of file
diff --git a/docs/components/custom/logo.tsx b/docs/components/custom/logo.tsx
new file mode 100644
index 000000000..03f6895bc
--- /dev/null
+++ b/docs/components/custom/logo.tsx
@@ -0,0 +1,10 @@
+export default function Logo({ height }: { height: number }) {
+ return (
+
+ )
+}
diff --git a/docs/components/geistdocs/ask-ai.tsx b/docs/components/geistdocs/ask-ai.tsx
new file mode 100644
index 000000000..9fa85ae4e
--- /dev/null
+++ b/docs/components/geistdocs/ask-ai.tsx
@@ -0,0 +1,33 @@
+"use client";
+
+import { MessageCircleIcon } from "lucide-react";
+import { useChatContext } from "@/hooks/geistdocs/use-chat";
+
+type AskAIProps = {
+ href: string;
+};
+
+export const AskAI = ({ href }: AskAIProps) => {
+ const { setIsOpen, setPrompt } = useChatContext();
+
+ const protocol = process.env.NODE_ENV === "production" ? "https" : "http";
+ const url = new URL(
+ href,
+ `${protocol}://${process.env.NEXT_PUBLIC_VERCEL_PROJECT_PRODUCTION_URL}`
+ ).toString();
+ const query = `Read this page, I want to ask questions about it. ${url}`;
+
+ return (
+
+ );
+};
diff --git a/docs/components/geistdocs/callout.tsx b/docs/components/geistdocs/callout.tsx
new file mode 100644
index 000000000..1d553bc87
--- /dev/null
+++ b/docs/components/geistdocs/callout.tsx
@@ -0,0 +1,40 @@
+import {
+ CalloutContainer as CalloutContainerPrimitive,
+ CalloutDescription as CalloutDescriptionPrimitive,
+ Callout as CalloutPrimitive,
+ CalloutTitle as CalloutTitlePrimitive,
+} from "fumadocs-ui/components/callout";
+import type { ComponentProps } from "react";
+import { cn } from "@/lib/utils";
+
+type CalloutProps = ComponentProps
+
+ );
+ }
+
+ return (
+
+
+
+ {messages.map((message) => (
+
+
+
+ {part.text}
+
+
+ ))}
+
+ ))}
+ {status === "submitted" && (
+
+
+
+
+ );
+};
+
+export const Chat = ({ basePath, suggestions }: ChatProps) => {
+ const { isOpen, setIsOpen } = useChatContext();
+ const isMobile = useIsMobile();
+
+ useEffect(() => {
+ const handleKeyDown = (event: KeyboardEvent) => {
+ // Check for Meta (⌘ on Mac, Windows key on Windows) + "i" (ignore case)
+ if (
+ (event.metaKey || event.ctrlKey) &&
+ !event.altKey &&
+ !event.shiftKey &&
+ event.key.toLowerCase() === "i"
+ ) {
+ event.preventDefault();
+
+ setIsOpen((prev) => !prev);
+ }
+ };
+
+ window.addEventListener("keydown", handleKeyDown);
+
+ return () => {
+ window.removeEventListener("keydown", handleKeyDown);
+ };
+ }, [setIsOpen]);
+
+ return (
+ <>
+
+
+
+
+
+ Chat
+
+
+
+
+
+
+ Clear chat
+
+
+
+
+
+ Close chat
+
+
+
+
+
+ )}
+
+ {!messages.length && (
+ <>
+
+ {suggestions.map((text) => (
+
+
+
+
+ {(attachment) =>
+
+ {
+ setLocalPrompt(e.target.value);
+ setPrompt(e.target.value);
+ }}
+ />
+
+
+
+
+
+
+
+ Tip: You can open and close chat with{" "}
+
+ {localPrompt.length} / 1000 +
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+};
diff --git a/docs/components/geistdocs/code-block-tabs.tsx b/docs/components/geistdocs/code-block-tabs.tsx
new file mode 100644
index 000000000..9385c0507
--- /dev/null
+++ b/docs/components/geistdocs/code-block-tabs.tsx
@@ -0,0 +1,61 @@
+import {
+ Tabs,
+ TabsContent,
+ TabsList,
+ TabsTrigger,
+} from "fumadocs-ui/components/tabs.unstyled";
+import type { ComponentProps } from "react";
+import { cn } from "@/lib/utils";
+
+export const CodeBlockTabsList = (props: ComponentPropscode]:grid",
+ className,
+ props.className
+ )}
+ ref={ref}
+ style={style}
+ tabIndex={tabIndex}
+ >
+ {children}
+
+ ),
+ [children, style, tabIndex, className]
+ );
+
+ if (!title) {
+ return (
+
+
+ );
+ }
+
+ return (
+
+ {submitted ? (
+
+
+ ) : (
+ Thank you for your feedback!
+