reachat 2.1.0-alpha.8 → 2.1.0

package/dist/index-DRRvnZUj.js

@@ -1,2255 +0,0 @@
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { cn, ConnectedOverlay, Button, Textarea, IconButton, Ellipsis, Card, Divider, useInfinityList, DateFormat, ListItem, List } from "reablocks";
-import { AnimatePresence, motion } from "motion/react";
-import * as React from "react";
-import { createContext, useState, useCallback, useEffect, useMemo, memo, useRef, useContext, forwardRef, useImperativeHandle, lazy, Suspense } from "react";
-import { useHotkeys } from "reakeys";
-import remarkGfm from "remark-gfm";
-import remarkMath from "remark-math";
-import remarkYoutube from "remark-youtube";
-import { offset } from "@floating-ui/react";
-import { Prism } from "react-syntax-highlighter";
-import ReactMarkdown from "react-markdown";
-import rehypeKatex from "rehype-katex";
-import { findAndReplace } from "mdast-util-find-and-replace";
-import { Slot } from "@radix-ui/react-slot";
-import { isToday, isYesterday, isThisWeek, differenceInYears, format } from "date-fns";
-const chatTheme = {
-  base: "text-content-text-neutral-base",
-  console: "flex w-full gap-4 h-full",
-  companion: "w-full h-full overflow-hidden",
-  empty: "text-center flex-1",
-  appbar: "flex p-5",
-  sessions: {
-    base: "overflow-auto",
-    console: "min-w-[150px] w-[30%] max-w-[300px] bg-gradient-neutral-200 p-5 rounded-3xl",
-    companion: "w-full h-full",
-    group: "text-xs text-content-text-neutral-3 mt-4 hover:bg-transparent mb-1",
-    create: "relative mb-4 rounded-[10px] text-white",
-    session: {
-      base: "group my-1 rounded-[10px] p-2 text-content-text-neutral-1 border border-transparent",
-      active: "border-select-menu-items-color-item-stroke-row-hover [&_button]:opacity-100!",
-      delete: "[&>svg]:w-4 [&>svg]:h-4 opacity-0 group-hover:opacity-50!"
-    }
-  },
-  messages: {
-    base: "",
-    console: "flex flex-col mx-5 flex-1 overflow-hidden",
-    companion: "flex w-full h-full",
-    back: "self-start pl-0 my-2 ",
-    inner: "flex-1 h-full flex flex-col",
-    title: "text-base font-bold",
-    date: "text-xs whitespace-nowrap text-content-text-neutral-2",
-    content: "mt-2 flex-1 overflow-auto",
-    header: "flex justify-between items-center gap-2",
-    showMore: "mb-4",
-    message: {
-      base: "mt-4 mb-4 flex flex-col p-0 rounded-sm border-none bg-transparent",
-      question: "relative font-semibold mb-4 px-4 py-4 pb-2 rounded-3xl rounded-br-none text-typography border bg-(--background-neutral-raised-5) border-(--stroke-neutral-5)",
-      response: "relative data-[compact=false]:px-4 text-content-text-neutral-base",
-      overlay: "overflow-y-hidden max-h-[350px] after:content-[''] after:absolute after:inset-x-0 after:bottom-0 after:h-16 after:bg-linear-to-b after:from-transparent after:to-effects-shadows-base-2-xl",
-      cursor: "inline-block w-1 h-4 bg-current",
-      expand: "absolute bottom-0 right-1 z-10",
-      files: {
-        base: "mb-2 flex flex-wrap gap-3 ",
-        file: {
-          base: "flex items-center gap-2 border border-stroke-neutral-4 px-3 py-2 rounded-lg cursor-pointer",
-          name: "text-sm text-content-text-neutral-4"
-        }
-      },
-      sources: {
-        base: "my-4 flex flex-wrap gap-3",
-        source: {
-          base: "flex gap-2 border border-stroke-neutral-4 px-4 py-2 rounded-lg cursor-pointer",
-          companion: "flex-1 px-3 py-1.5",
-          image: "max-w-10 max-h-10 rounded-md w-full h-fit self-center",
-          title: "text-md block",
-          url: "text-sm text-buttons-colors-link-primary-text-resting underline"
-        }
-      },
-      markdown: {
-        copy: "sticky py-1 [&>svg]:w-4 [&>svg]:h-4 opacity-50",
-        p: "mb-2",
-        a: "text-buttons-colors-link-primary-text-resting underline",
-        table: "table-auto w-full m-2",
-        th: "px-4 py-2 text-left font-bold border-b border-stroke-neutral-4",
-        td: "px-4 py-2",
-        code: "m-2 rounded-b relative",
-        toolbar: "text-xs flex items-center justify-between px-2 py-1 rounded-t sticky top-0 backdrop-blur-md bg-gradient-neutral-500/50",
-        li: "mb-2 ml-6",
-        ul: "mb-4 list-disc",
-        ol: "mb-4 list-decimal"
-      },
-      csvPreview: {
-        base: "flex flex-col gap-2",
-        header: {
-          base: "flex justify-between items-center gap-4",
-          icon: "csv-icon flex items-center",
-          actions: "csv-actions flex items-center gap-6"
-        },
-        tableContainer: "flex justify-between",
-        dialog: {
-          base: "fixed inset-0 bg-background-neutral-canvas-base/70 flex justify-center items-center z-50",
-          container: "bg-background-neutral-canvas-base rounded-md w-11/12 h-5/6 overflow-auto"
-        }
-      },
-      footer: {
-        base: "mt-3 flex gap-1.5",
-        copy: "p-3 rounded-[10px] [&>svg]:size-4 opacity-50 hover:opacity-100!",
-        upvote: "p-3 rounded-[10px] [&>svg]:size-4 opacity-50 hover:opacity-100!",
-        downvote: "p-3 rounded-[10px] [&>svg]:size-4 opacity-50 hover:opacity-100!",
-        refresh: "p-3 rounded-[10px] [&>svg]:size-4 opacity-50 hover:opacity-100!"
-      }
-    }
-  },
-  input: {
-    base: "flex mt-4 relative",
-    upload: "px-5 py-2 size-10 text-content-text-neutral-2 hover:text-content-text-neutral-base",
-    input: "w-full border rounded-3xl px-3 py-2 pr-16 after:hidden after:mx-10! [&>textarea]:w-full [&>textarea]:flex-none [&>textarea]:outline-none [&>textarea]:resize-none",
-    actions: {
-      base: "absolute flex gap-2 items-center right-2 inset-y-1/2 -translate-y-1/2 z-10",
-      send: "px-3 py-3 hover:bg-primary-hover rounded-full size-8",
-      stop: "px-2 py-2 bg-content-assets-semantic-error-base text-white rounded-full hover:bg-content-assets-semantic-error-1 size-8"
-    }
-  }
-};
-const AppBar = ({ content, theme = chatTheme }) => {
-  return /* @__PURE__ */ jsx("div", { className: cn(theme.appbar), children: content });
-};
-const ChatContext = createContext({
-  sessions: [],
-  activeSessionId: null
-});
-const useDimensions = () => {
-  const [ref, setRef] = useState(null);
-  const [width, setWidth] = useState(void 0);
-  const observe = useCallback((element) => {
-    if (element) setRef(element);
-  }, []);
-  useEffect(() => {
-    if (!ref) return;
-    const resizeObserver = new ResizeObserver((entries) => {
-      for (const entry of entries) {
-        setWidth(entry.contentRect.width);
-      }
-    });
-    resizeObserver.observe(ref);
-    return () => {
-      resizeObserver.disconnect();
-    };
-  }, [ref]);
-  return { width, observe };
-};
-const Chat = ({
-  children,
-  viewType = "console",
-  sessions,
-  onSelectSession,
-  onDeleteSession,
-  onSendMessage,
-  onStopMessage,
-  onFileUpload,
-  isLoading,
-  activeSessionId,
-  theme = chatTheme,
-  onNewSession,
-  remarkPlugins = [remarkGfm, remarkYoutube, remarkMath],
-  disabled,
-  style,
-  className
-}) => {
-  const [internalActiveSessionID, setInternalActiveSessionID] = useState(activeSessionId);
-  const { width, observe } = useDimensions();
-  const isCompact = viewType === "companion" || width && width < 767;
-  useEffect(() => {
-    setInternalActiveSessionID(activeSessionId);
-  }, [activeSessionId]);
-  const handleSelectSession = useCallback(
-    (sessionId) => {
-      setInternalActiveSessionID(sessionId);
-      onSelectSession?.(sessionId);
-    },
-    [onSelectSession]
-  );
-  const handleDeleteSession = useCallback(
-    (sessionId) => {
-      setInternalActiveSessionID(void 0);
-      onDeleteSession?.(sessionId);
-    },
-    [onDeleteSession]
-  );
-  const handleCreateNewSession = useCallback(() => {
-    setInternalActiveSessionID(void 0);
-    onNewSession?.();
-  }, [onNewSession]);
-  useHotkeys([
-    {
-      name: "Create new session",
-      category: "Chat",
-      keys: "meta+shift+s",
-      callback: (event) => {
-        event.preventDefault();
-        handleCreateNewSession();
-      }
-    }
-  ]);
-  const activeSession = useMemo(
-    () => sessions.find((session) => session.id === internalActiveSessionID),
-    [sessions, internalActiveSessionID]
-  );
-  const contextValue = useMemo(
-    () => ({
-      sessions,
-      activeSession,
-      remarkPlugins,
-      theme,
-      disabled,
-      isLoading,
-      isCompact,
-      viewType,
-      activeSessionId: internalActiveSessionID,
-      selectSession: handleSelectSession,
-      deleteSession: handleDeleteSession,
-      createSession: handleCreateNewSession,
-      sendMessage: onSendMessage,
-      stopMessage: onStopMessage,
-      fileUpload: onFileUpload
-    }),
-    [
-      isLoading,
-      isCompact,
-      viewType,
-      disabled,
-      theme,
-      remarkPlugins,
-      sessions,
-      activeSession,
-      internalActiveSessionID,
-      handleSelectSession,
-      handleDeleteSession,
-      handleCreateNewSession,
-      onSendMessage,
-      onStopMessage,
-      onFileUpload
-    ]
-  );
-  return /* @__PURE__ */ jsx(ChatContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: observe,
-      className: cn(className, theme.base, {
-        [theme.companion]: isCompact,
-        [theme.console]: !isCompact
-      }),
-      style,
-      children
-    }
-  ) }) });
-};
-const ChatBubble = memo(
-  ({
-    children,
-    bubbleContent,
-    position = "right-end",
-    modifiers = [offset({ mainAxis: 0, crossAxis: -40 })],
-    className
-  }) => {
-    const [isOpen, setIsOpen] = useState(false);
-    const ref = useRef(null);
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(
-        ConnectedOverlay,
-        {
-          placement: position,
-          modifiers,
-          reference: ref.current,
-          open: isOpen,
-          onOpen: () => setIsOpen(true),
-          onClose: () => setIsOpen(false),
-          content: () => /* @__PURE__ */ jsx(Fragment, { children })
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          ref,
-          className,
-          onClick: () => setIsOpen((prev) => !prev),
-          children: bubbleContent
-        }
-      )
-    ] });
-  }
-);
-const SvgSend = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M15.3451 0.654003C15.0011 0.310003 14.5001 0.191003 14.0401 0.339003L1.11712 4.493C0.626116 4.651 0.286116 5.067 0.230116 5.58C0.174116 6.092 0.417116 6.572 0.862116 6.831L5.43812 9.5L9.39112 5.546C9.68412 5.253 10.1591 5.253 10.4521 5.546C10.7451 5.839 10.7451 6.314 10.4521 6.607L6.49812 10.561L9.16712 15.137C9.40211 15.539 9.81712 15.776 10.2741 15.776C10.3221 15.776 10.3711 15.773 10.4201 15.768C10.9321 15.712 11.3491 15.372 11.5061 14.882L15.6611 1.96C15.8091 1.497 15.6881 0.997003 15.3451 0.654003Z", fill: "currentColor" }));
-const SvgStop = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 50 50", width: "24px", height: "24px", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M 25 2 C 12.309534 2 2 12.309534 2 25 C 2 37.690466 12.309534 48 25 48 C 37.690466 48 48 37.690466 48 25 C 48 12.309534 37.690466 2 25 2 z M 25 4 C 36.609534 4 46 13.390466 46 25 C 46 36.609534 36.609534 46 25 46 C 13.390466 46 4 36.609534 4 25 C 4 13.390466 13.390466 4 25 4 z M 32.990234 15.986328 A 1.0001 1.0001 0 0 0 32.292969 16.292969 L 25 23.585938 L 17.707031 16.292969 A 1.0001 1.0001 0 0 0 16.990234 15.990234 A 1.0001 1.0001 0 0 0 16.292969 17.707031 L 23.585938 25 L 16.292969 32.292969 A 1.0001 1.0001 0 1 0 17.707031 33.707031 L 25 26.414062 L 32.292969 33.707031 A 1.0001 1.0001 0 1 0 33.707031 32.292969 L 26.414062 25 L 33.707031 17.707031 A 1.0001 1.0001 0 0 0 32.990234 15.986328 z", fill: "currentColor" }));
-const SvgPaperclip = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 64 64", width: "24px", height: "24px", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M25.3,56.007c-3.409,0-6.818-1.297-9.414-3.893c-2.595-2.596-3.893-6.005-3.893-9.415c0-3.409,1.298-6.819,3.893-9.414 l20.4-20.4c1.847-1.847,4.302-2.864,6.914-2.864c2.611,0,5.067,1.017,6.914,2.864c3.812,3.813,3.812,10.016,0,13.829l-20.4,20.4 c-2.438,2.439-6.385,2.441-8.828,0c-2.434-2.435-2.434-6.395,0-8.829l13.7-13.7c0.781-0.781,2.047-0.781,2.828,0 c0.781,0.781,0.781,2.047,0,2.828l-13.7,13.7c-0.874,0.875-0.874,2.297,0.001,3.172c0.847,0.846,2.324,0.846,3.171,0l20.4-20.4 c2.252-2.253,2.252-5.919,0-8.172c-1.092-1.091-2.543-1.692-4.086-1.692c-1.544,0-2.994,0.601-4.086,1.692l-20.4,20.4 c-1.815,1.816-2.723,4.201-2.723,6.586c0,2.385,0.908,4.77,2.723,6.586c1.816,1.815,4.201,2.723,6.586,2.723 c2.385,0,4.771-0.907,6.586-2.723l12.7-12.7c0.781-0.781,2.047-0.781,2.828,0c0.781,0.781,0.781,2.047,0,2.828l-12.7,12.7 C32.119,54.709,28.71,56.007,25.3,56.007z", fill: "currentColor" }));
-const FileInput = ({
-  allowedFiles,
-  onFileUpload,
-  isLoading,
-  disabled,
-  attachIcon = /* @__PURE__ */ jsx(SvgPaperclip, {})
-}) => {
-  const { theme } = useContext(ChatContext);
-  const fileInputRef = useRef(null);
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      "input",
-      {
-        type: "file",
-        ref: fileInputRef,
-        className: "hidden",
-        accept: allowedFiles.join(","),
-        onChange: (e) => {
-          onFileUpload(e);
-          if (fileInputRef.current) {
-            fileInputRef.current.value = "";
-          }
-        }
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      Button,
-      {
-        title: "Upload",
-        variant: "text",
-        disabled: isLoading || disabled,
-        className: cn(theme.input.upload),
-        onClick: () => fileInputRef.current?.click(),
-        children: attachIcon
-      }
-    )
-  ] });
-};
-const ChatInput = forwardRef(
-  ({
-    allowedFiles,
-    placeholder,
-    defaultValue,
-    className,
-    message,
-    sendIcon = /* @__PURE__ */ jsx(SvgSend, {}),
-    stopIcon = /* @__PURE__ */ jsx(SvgStop, {}),
-    attachIcon,
-    onMessageChange
-  }, ref) => {
-    const {
-      theme,
-      isLoading,
-      disabled,
-      sendMessage,
-      stopMessage,
-      fileUpload,
-      activeSessionId
-    } = useContext(ChatContext);
-    const [internalMessage, setInternalMessage] = useState("");
-    const inputRef = useRef(null);
-    useEffect(() => {
-      setInternalMessage(message || "");
-    }, [message]);
-    useEffect(() => {
-      if (inputRef.current) {
-        inputRef.current.focus();
-      }
-    }, [activeSessionId, inputRef]);
-    const handleSendMessage = () => {
-      if (internalMessage.trim()) {
-        sendMessage?.(internalMessage);
-        setInternalMessage("");
-      }
-    };
-    useImperativeHandle(ref, () => ({
-      focus: () => {
-        inputRef.current?.focus();
-      },
-      send: () => {
-        handleSendMessage();
-      },
-      setValue: (value) => {
-        setInternalMessage(value);
-        onMessageChange?.(value);
-      },
-      getValue: () => {
-        return internalMessage;
-      }
-    }));
-    const handleKeyPress = (e) => {
-      if (e.key === "Enter" && !e.shiftKey) {
-        e.preventDefault();
-        handleSendMessage();
-      }
-    };
-    const handleFileUpload = (event) => {
-      const file = event.target.files?.[0];
-      if (file && fileUpload) {
-        fileUpload(file);
-      }
-    };
-    const handleMessageChange = useCallback(
-      (event) => {
-        setInternalMessage(event.target.value);
-        onMessageChange?.(event.target.value);
-      },
-      [onMessageChange]
-    );
-    return /* @__PURE__ */ jsxs("div", { className: cn(theme.input.base, className), children: [
-      /* @__PURE__ */ jsx(
-        Textarea,
-        {
-          ref: inputRef,
-          containerClassName: cn(theme.input.input),
-          minRows: 1,
-          autoFocus: true,
-          value: internalMessage,
-          defaultValue,
-          onKeyPress: handleKeyPress,
-          placeholder,
-          disabled: isLoading || disabled,
-          onChange: handleMessageChange
-        }
-      ),
-      /* @__PURE__ */ jsxs("div", { className: cn(theme.input.actions.base), children: [
-        allowedFiles?.length > 0 && /* @__PURE__ */ jsx(
-          FileInput,
-          {
-            allowedFiles,
-            onFileUpload: handleFileUpload,
-            isLoading,
-            disabled,
-            attachIcon
-          }
-        ),
-        isLoading && /* @__PURE__ */ jsx(
-          Button,
-          {
-            title: "Stop",
-            className: cn(theme.input.actions.stop),
-            onClick: stopMessage,
-            disabled,
-            children: stopIcon
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            title: "Send",
-            className: cn(theme.input.actions.send),
-            onClick: handleSendMessage,
-            disabled: isLoading || disabled,
-            children: sendIcon
-          }
-        )
-      ] })
-    ] });
-  }
-);
-const SvgCopy = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M1.75 6C2.164 6 2.5 6.336 2.5 6.75V13.25C2.5 13.939 3.061 14.5 3.75 14.5H12.25C12.664 14.5 13 14.836 13 15.25C13 15.664 12.664 16 12.25 16H3.75C2.233 16 1 14.767 1 13.25V6.75C1 6.336 1.336 6 1.75 6ZM14.25 2C15.7688 2 17 3.23122 17 4.75V10.25C17 11.7688 15.7688 13 14.25 13H6.75C5.23122 13 4 11.7688 4 10.25V4.75C4 3.23122 5.23122 2 6.75 2H14.25Z", fill: "currentColor" }));
-const dark = {
-  'code[class*="language-"]': {
-    background: "#11111f",
-    color: "#e2e8f0",
-    textShadow: "0 1px rgba(0, 0, 0, 0.3)",
-    fontFamily: '"Fira Code", "Fira Mono", Menlo, Consolas, "DejaVu Sans Mono", monospace',
-    direction: "ltr",
-    textAlign: "left",
-    whiteSpace: "pre",
-    wordSpacing: "normal",
-    wordBreak: "normal",
-    lineHeight: "1.5",
-    MozTabSize: "2",
-    OTabSize: "2",
-    tabSize: "2",
-    WebkitHyphens: "none",
-    MozHyphens: "none",
-    msHyphens: "none",
-    hyphens: "none"
-  },
-  'pre[class*="language-"]': {
-    background: "#11111f",
-    color: "#e2e8f0",
-    textShadow: "0 1px rgba(0, 0, 0, 0.3)",
-    fontFamily: '"Fira Code", "Fira Mono", Menlo, Consolas, "DejaVu Sans Mono", monospace',
-    direction: "ltr",
-    textAlign: "left",
-    whiteSpace: "pre",
-    wordSpacing: "normal",
-    wordBreak: "normal",
-    lineHeight: "1.5",
-    MozTabSize: "2",
-    OTabSize: "2",
-    tabSize: "2",
-    WebkitHyphens: "none",
-    MozHyphens: "none",
-    msHyphens: "none",
-    hyphens: "none",
-    padding: "1em",
-    margin: "0",
-    overflow: "auto"
-  },
-  'code[class*="language-"]::-moz-selection': {
-    background: "#1e293b",
-    color: "inherit",
-    textShadow: "none"
-  },
-  'code[class*="language-"] *::-moz-selection': {
-    background: "#1e293b",
-    color: "inherit",
-    textShadow: "none"
-  },
-  'pre[class*="language-"] *::-moz-selection': {
-    background: "#1e293b",
-    color: "inherit",
-    textShadow: "none"
-  },
-  'code[class*="language-"]::selection': {
-    background: "#1e293b",
-    color: "inherit",
-    textShadow: "none"
-  },
-  'code[class*="language-"] *::selection': {
-    background: "#1e293b",
-    color: "inherit",
-    textShadow: "none"
-  },
-  'pre[class*="language-"] *::selection': {
-    background: "#1e293b",
-    color: "inherit",
-    textShadow: "none"
-  },
-  ':not(pre) > code[class*="language-"]': {
-    padding: "0.2em 0.3em",
-    borderRadius: "0.3em",
-    whiteSpace: "normal"
-  },
-  comment: {
-    color: "#64748b",
-    fontStyle: "italic"
-  },
-  prolog: {
-    color: "#64748b"
-  },
-  cdata: {
-    color: "#64748b"
-  },
-  doctype: {
-    color: "#e2e8f0"
-  },
-  punctuation: {
-    color: "#e2e8f0"
-  },
-  entity: {
-    color: "#3b82f6",
-    cursor: "help"
-  },
-  "attr-name": {
-    color: "#f59e0b"
-  },
-  "class-name": {
-    color: "#f59e0b"
-  },
-  boolean: {
-    color: "#3b82f6"
-  },
-  constant: {
-    color: "#3b82f6"
-  },
-  number: {
-    color: "#3b82f6"
-  },
-  atrule: {
-    color: "#f59e0b"
-  },
-  keyword: {
-    color: "#f472b6"
-  },
-  property: {
-    color: "#3b82f6"
-  },
-  tag: {
-    color: "#3b82f6"
-  },
-  symbol: {
-    color: "#3b82f6"
-  },
-  deleted: {
-    color: "#ef4444"
-  },
-  important: {
-    color: "#f472b6"
-  },
-  selector: {
-    color: "#10b981"
-  },
-  string: {
-    color: "#10b981"
-  },
-  char: {
-    color: "#10b981"
-  },
-  builtin: {
-    color: "#10b981"
-  },
-  inserted: {
-    color: "#10b981"
-  },
-  regex: {
-    color: "#10b981"
-  },
-  "attr-value": {
-    color: "#10b981"
-  },
-  "attr-value > .token.punctuation": {
-    color: "#10b981"
-  },
-  variable: {
-    color: "#60a5fa"
-  },
-  operator: {
-    color: "#60a5fa"
-  },
-  function: {
-    color: "#60a5fa"
-  },
-  url: {
-    color: "#60a5fa"
-  },
-  "attr-value > .token.punctuation.attr-equals": {
-    color: "#e2e8f0"
-  },
-  "special-attr > .token.attr-value > .token.value.css": {
-    color: "#e2e8f0"
-  },
-  ".language-css .token.selector": {
-    color: "#3b82f6"
-  },
-  ".language-css .token.property": {
-    color: "#e2e8f0"
-  },
-  ".language-css .token.function": {
-    color: "#60a5fa"
-  },
-  ".language-css .token.url > .token.function": {
-    color: "#60a5fa"
-  },
-  ".language-css .token.url > .token.string.url": {
-    color: "#10b981"
-  },
-  ".language-css .token.important": {
-    color: "#f472b6"
-  },
-  ".language-css .token.atrule .token.rule": {
-    color: "#f472b6"
-  },
-  ".language-javascript .token.operator": {
-    color: "#f472b6"
-  },
-  ".language-javascript .token.template-string > .token.interpolation > .token.interpolation-punctuation.punctuation": {
-    color: "#ef4444"
-  },
-  ".language-json .token.operator": {
-    color: "#e2e8f0"
-  },
-  ".language-json .token.null.keyword": {
-    color: "#3b82f6"
-  },
-  ".language-markdown .token.url": {
-    color: "#e2e8f0"
-  },
-  ".language-markdown .token.url > .token.operator": {
-    color: "#e2e8f0"
-  },
-  ".language-markdown .token.url-reference.url > .token.string": {
-    color: "#e2e8f0"
-  },
-  ".language-markdown .token.url > .token.content": {
-    color: "#60a5fa"
-  },
-  ".language-markdown .token.url > .token.url": {
-    color: "#60a5fa"
-  },
-  ".language-markdown .token.url-reference.url": {
-    color: "#60a5fa"
-  },
-  ".language-markdown .token.blockquote.punctuation": {
-    color: "#64748b",
-    fontStyle: "italic"
-  },
-  ".language-markdown .token.hr.punctuation": {
-    color: "#64748b",
-    fontStyle: "italic"
-  },
-  ".language-markdown .token.code-snippet": {
-    color: "#10b981"
-  },
-  ".language-markdown .token.bold .token.content": {
-    color: "#f59e0b"
-  },
-  ".language-markdown .token.italic .token.content": {
-    color: "#f472b6"
-  },
-  ".language-markdown .token.strike .token.content": {
-    color: "#3b82f6"
-  },
-  ".language-markdown .token.strike .token.punctuation": {
-    color: "#3b82f6"
-  },
-  ".language-markdown .token.list.punctuation": {
-    color: "#3b82f6"
-  },
-  ".language-markdown .token.title.important > .token.punctuation": {
-    color: "#3b82f6"
-  },
-  bold: {
-    fontWeight: "bold"
-  },
-  italic: {
-    fontStyle: "italic"
-  },
-  namespace: {
-    Opacity: "0.8"
-  },
-  "token.tab:not(:empty):before": {
-    color: "#64748b",
-    textShadow: "none"
-  },
-  "token.cr:before": {
-    color: "#64748b",
-    textShadow: "none"
-  },
-  "token.lf:before": {
-    color: "#64748b",
-    textShadow: "none"
-  },
-  "token.space:before": {
-    color: "#64748b",
-    textShadow: "none"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item": {
-    marginRight: "0.4em"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > button": {
-    background: "#1e293b",
-    color: "#94a3b8",
-    padding: "0.1em 0.4em",
-    borderRadius: "0.3em"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > a": {
-    background: "#1e293b",
-    color: "#94a3b8",
-    padding: "0.1em 0.4em",
-    borderRadius: "0.3em"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > span": {
-    background: "#1e293b",
-    color: "#94a3b8",
-    padding: "0.1em 0.4em",
-    borderRadius: "0.3em"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:hover": {
-    background: "#3b82f6",
-    color: "#ffffff"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:focus": {
-    background: "#3b82f6",
-    color: "#ffffff"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:hover": {
-    background: "#3b82f6",
-    color: "#ffffff"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:focus": {
-    background: "#3b82f6",
-    color: "#ffffff"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:hover": {
-    background: "#3b82f6",
-    color: "#ffffff"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:focus": {
-    background: "#3b82f6",
-    color: "#ffffff"
-  },
-  ".line-highlight.line-highlight": {
-    background: "rgba(59, 130, 246, 0.08)"
-  },
-  ".line-highlight.line-highlight:before": {
-    background: "#1e293b",
-    color: "#e2e8f0",
-    padding: "0.1em 0.6em",
-    borderRadius: "0.3em",
-    boxShadow: "0 2px 0 0 rgba(0, 0, 0, 0.2)"
-  },
-  ".line-highlight.line-highlight[data-end]:after": {
-    background: "#1e293b",
-    color: "#e2e8f0",
-    padding: "0.1em 0.6em",
-    borderRadius: "0.3em",
-    boxShadow: "0 2px 0 0 rgba(0, 0, 0, 0.2)"
-  },
-  "pre[id].linkable-line-numbers.linkable-line-numbers span.line-numbers-rows > span:hover:before": {
-    backgroundColor: "rgba(59, 130, 246, 0.08)"
-  },
-  ".line-numbers.line-numbers .line-numbers-rows": {
-    borderRightColor: "#1e293b"
-  },
-  ".command-line .command-line-prompt": {
-    borderRightColor: "#1e293b"
-  },
-  ".line-numbers .line-numbers-rows > span:before": {
-    color: "#64748b"
-  },
-  ".command-line .command-line-prompt > span:before": {
-    color: "#64748b"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-1": {
-    color: "#3b82f6"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-5": {
-    color: "#3b82f6"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-9": {
-    color: "#3b82f6"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-2": {
-    color: "#10b981"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-6": {
-    color: "#10b981"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-10": {
-    color: "#10b981"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-3": {
-    color: "#60a5fa"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-7": {
-    color: "#60a5fa"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-11": {
-    color: "#60a5fa"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-4": {
-    color: "#f472b6"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-8": {
-    color: "#f472b6"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-12": {
-    color: "#f472b6"
-  },
-  "pre.diff-highlight > code .token.token.deleted:not(.prefix)": {
-    backgroundColor: "rgba(239, 68, 68, 0.15)"
-  },
-  "pre > code.diff-highlight .token.token.deleted:not(.prefix)": {
-    backgroundColor: "rgba(239, 68, 68, 0.15)"
-  },
-  "pre.diff-highlight > code .token.token.deleted:not(.prefix)::-moz-selection": {
-    backgroundColor: "rgba(239, 68, 68, 0.25)"
-  },
-  "pre.diff-highlight > code .token.token.deleted:not(.prefix) *::-moz-selection": {
-    backgroundColor: "rgba(239, 68, 68, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.deleted:not(.prefix)::-moz-selection": {
-    backgroundColor: "rgba(239, 68, 68, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.deleted:not(.prefix) *::-moz-selection": {
-    backgroundColor: "rgba(239, 68, 68, 0.25)"
-  },
-  "pre.diff-highlight > code .token.token.deleted:not(.prefix)::selection": {
-    backgroundColor: "rgba(239, 68, 68, 0.25)"
-  },
-  "pre.diff-highlight > code .token.token.deleted:not(.prefix) *::selection": {
-    backgroundColor: "rgba(239, 68, 68, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.deleted:not(.prefix)::selection": {
-    backgroundColor: "rgba(239, 68, 68, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.deleted:not(.prefix) *::selection": {
-    backgroundColor: "rgba(239, 68, 68, 0.25)"
-  },
-  "pre.diff-highlight > code .token.token.inserted:not(.prefix)": {
-    backgroundColor: "rgba(16, 185, 129, 0.15)"
-  },
-  "pre > code.diff-highlight .token.token.inserted:not(.prefix)": {
-    backgroundColor: "rgba(16, 185, 129, 0.15)"
-  },
-  "pre.diff-highlight > code .token.token.inserted:not(.prefix)::-moz-selection": {
-    backgroundColor: "rgba(16, 185, 129, 0.25)"
-  },
-  "pre.diff-highlight > code .token.token.inserted:not(.prefix) *::-moz-selection": {
-    backgroundColor: "rgba(16, 185, 129, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.inserted:not(.prefix)::-moz-selection": {
-    backgroundColor: "rgba(16, 185, 129, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.inserted:not(.prefix) *::-moz-selection": {
-    backgroundColor: "rgba(16, 185, 129, 0.25)"
-  },
-  "pre.diff-highlight > code .token.token.inserted:not(.prefix)::selection": {
-    backgroundColor: "rgba(16, 185, 129, 0.25)"
-  },
-  "pre.diff-highlight > code .token.token.inserted:not(.prefix) *::selection": {
-    backgroundColor: "rgba(16, 185, 129, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.inserted:not(.prefix)::selection": {
-    backgroundColor: "rgba(16, 185, 129, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.inserted:not(.prefix) *::selection": {
-    backgroundColor: "rgba(16, 185, 129, 0.25)"
-  },
-  ".prism-previewer.prism-previewer:before": {
-    borderColor: "#11111f"
-  },
-  ".prism-previewer-gradient.prism-previewer-gradient div": {
-    borderColor: "#11111f",
-    borderRadius: "0.3em"
-  },
-  ".prism-previewer-color.prism-previewer-color:before": {
-    borderRadius: "0.3em"
-  },
-  ".prism-previewer-easing.prism-previewer-easing:before": {
-    borderRadius: "0.3em"
-  },
-  ".prism-previewer.prism-previewer:after": {
-    borderTopColor: "#11111f"
-  },
-  ".prism-previewer-flipped.prism-previewer-flipped.after": {
-    borderBottomColor: "#11111f"
-  },
-  ".prism-previewer-angle.prism-previewer-angle:before": {
-    background: "#1e293b"
-  },
-  ".prism-previewer-time.prism-previewer-time:before": {
-    background: "#1e293b"
-  },
-  ".prism-previewer-easing.prism-previewer-easing": {
-    background: "#1e293b"
-  },
-  ".prism-previewer-angle.prism-previewer-angle circle": {
-    stroke: "#e2e8f0",
-    strokeOpacity: "1"
-  },
-  ".prism-previewer-time.prism-previewer-time circle": {
-    stroke: "#e2e8f0",
-    strokeOpacity: "1"
-  },
-  ".prism-previewer-easing.prism-previewer-easing circle": {
-    stroke: "#e2e8f0",
-    fill: "transparent"
-  },
-  ".prism-previewer-easing.prism-previewer-easing path": {
-    stroke: "#e2e8f0"
-  },
-  ".prism-previewer-easing.prism-previewer-easing line": {
-    stroke: "#e2e8f0"
-  }
-};
-const light = {
-  'code[class*="language-"]': {
-    background: "#fff",
-    color: "#1e293b",
-    textShadow: "none",
-    fontFamily: '"Fira Code", "Fira Mono", Menlo, Consolas, "DejaVu Sans Mono", monospace',
-    direction: "ltr",
-    textAlign: "left",
-    whiteSpace: "pre",
-    wordSpacing: "normal",
-    wordBreak: "normal",
-    lineHeight: "1.5",
-    MozTabSize: "2",
-    OTabSize: "2",
-    tabSize: "2",
-    WebkitHyphens: "none",
-    MozHyphens: "none",
-    msHyphens: "none",
-    hyphens: "none"
-  },
-  'pre[class*="language-"]': {
-    background: "#fff",
-    color: "#1e293b",
-    textShadow: "none",
-    fontFamily: '"Fira Code", "Fira Mono", Menlo, Consolas, "DejaVu Sans Mono", monospace',
-    direction: "ltr",
-    textAlign: "left",
-    whiteSpace: "pre",
-    wordSpacing: "normal",
-    wordBreak: "normal",
-    lineHeight: "1.5",
-    MozTabSize: "2",
-    OTabSize: "2",
-    tabSize: "2",
-    WebkitHyphens: "none",
-    MozHyphens: "none",
-    msHyphens: "none",
-    hyphens: "none",
-    padding: "1em",
-    margin: "0.5em 0",
-    overflow: "auto",
-    borderRadius: "0.3em",
-    border: "1px solid #e2e8f0"
-  },
-  'code[class*="language-"]::-moz-selection': {
-    background: "#e2e8f0",
-    color: "inherit",
-    textShadow: "none"
-  },
-  'code[class*="language-"] *::-moz-selection': {
-    background: "#e2e8f0",
-    color: "inherit",
-    textShadow: "none"
-  },
-  'pre[class*="language-"] *::-moz-selection': {
-    background: "#e2e8f0",
-    color: "inherit",
-    textShadow: "none"
-  },
-  'code[class*="language-"]::selection': {
-    background: "#e2e8f0",
-    color: "inherit",
-    textShadow: "none"
-  },
-  'code[class*="language-"] *::selection': {
-    background: "#e2e8f0",
-    color: "inherit",
-    textShadow: "none"
-  },
-  'pre[class*="language-"] *::selection': {
-    background: "#e2e8f0",
-    color: "inherit",
-    textShadow: "none"
-  },
-  ':not(pre) > code[class*="language-"]': {
-    padding: "0.2em 0.3em",
-    borderRadius: "0.3em",
-    whiteSpace: "normal",
-    background: "#f1f5f9"
-  },
-  comment: {
-    color: "#64748b",
-    fontStyle: "italic"
-  },
-  prolog: {
-    color: "#64748b"
-  },
-  cdata: {
-    color: "#64748b"
-  },
-  doctype: {
-    color: "#1e293b"
-  },
-  punctuation: {
-    color: "#64748b"
-  },
-  entity: {
-    color: "#3b82f6",
-    cursor: "help"
-  },
-  "attr-name": {
-    color: "#ea580c"
-  },
-  "class-name": {
-    color: "#ea580c"
-  },
-  boolean: {
-    color: "#3b82f6"
-  },
-  constant: {
-    color: "#3b82f6"
-  },
-  number: {
-    color: "#3b82f6"
-  },
-  atrule: {
-    color: "#ea580c"
-  },
-  keyword: {
-    color: "#9333ea"
-  },
-  property: {
-    color: "#3b82f6"
-  },
-  tag: {
-    color: "#3b82f6"
-  },
-  symbol: {
-    color: "#3b82f6"
-  },
-  deleted: {
-    color: "#dc2626"
-  },
-  important: {
-    color: "#9333ea"
-  },
-  selector: {
-    color: "#16a34a"
-  },
-  string: {
-    color: "#16a34a"
-  },
-  char: {
-    color: "#16a34a"
-  },
-  builtin: {
-    color: "#16a34a"
-  },
-  inserted: {
-    color: "#16a34a"
-  },
-  regex: {
-    color: "#16a34a"
-  },
-  "attr-value": {
-    color: "#16a34a"
-  },
-  "attr-value > .token.punctuation": {
-    color: "#16a34a"
-  },
-  variable: {
-    color: "#3b82f6"
-  },
-  operator: {
-    color: "#3b82f6"
-  },
-  function: {
-    color: "#3b82f6"
-  },
-  url: {
-    color: "#3b82f6"
-  },
-  "attr-value > .token.punctuation.attr-equals": {
-    color: "#64748b"
-  },
-  "special-attr > .token.attr-value > .token.value.css": {
-    color: "#1e293b"
-  },
-  ".language-css .token.selector": {
-    color: "#3b82f6"
-  },
-  ".language-css .token.property": {
-    color: "#1e293b"
-  },
-  ".language-css .token.function": {
-    color: "#3b82f6"
-  },
-  ".language-css .token.url > .token.function": {
-    color: "#3b82f6"
-  },
-  ".language-css .token.url > .token.string.url": {
-    color: "#16a34a"
-  },
-  ".language-css .token.important": {
-    color: "#9333ea"
-  },
-  ".language-css .token.atrule .token.rule": {
-    color: "#9333ea"
-  },
-  ".language-javascript .token.operator": {
-    color: "#9333ea"
-  },
-  ".language-javascript .token.template-string > .token.interpolation > .token.interpolation-punctuation.punctuation": {
-    color: "#dc2626"
-  },
-  ".language-json .token.operator": {
-    color: "#1e293b"
-  },
-  ".language-json .token.null.keyword": {
-    color: "#3b82f6"
-  },
-  ".language-markdown .token.url": {
-    color: "#1e293b"
-  },
-  ".language-markdown .token.url > .token.operator": {
-    color: "#1e293b"
-  },
-  ".language-markdown .token.url-reference.url > .token.string": {
-    color: "#1e293b"
-  },
-  ".language-markdown .token.url > .token.content": {
-    color: "#3b82f6"
-  },
-  ".language-markdown .token.url > .token.url": {
-    color: "#3b82f6"
-  },
-  ".language-markdown .token.url-reference.url": {
-    color: "#3b82f6"
-  },
-  ".language-markdown .token.blockquote.punctuation": {
-    color: "#64748b",
-    fontStyle: "italic"
-  },
-  ".language-markdown .token.hr.punctuation": {
-    color: "#64748b",
-    fontStyle: "italic"
-  },
-  ".language-markdown .token.code-snippet": {
-    color: "#16a34a"
-  },
-  ".language-markdown .token.bold .token.content": {
-    color: "#ea580c"
-  },
-  ".language-markdown .token.italic .token.content": {
-    color: "#9333ea"
-  },
-  ".language-markdown .token.strike .token.content": {
-    color: "#3b82f6"
-  },
-  ".language-markdown .token.strike .token.punctuation": {
-    color: "#3b82f6"
-  },
-  ".language-markdown .token.list.punctuation": {
-    color: "#3b82f6"
-  },
-  ".language-markdown .token.title.important > .token.punctuation": {
-    color: "#3b82f6"
-  },
-  bold: {
-    fontWeight: "bold"
-  },
-  italic: {
-    fontStyle: "italic"
-  },
-  namespace: {
-    Opacity: "0.8"
-  },
-  "token.tab:not(:empty):before": {
-    color: "#94a3b8"
-  },
-  "token.cr:before": {
-    color: "#94a3b8"
-  },
-  "token.lf:before": {
-    color: "#94a3b8"
-  },
-  "token.space:before": {
-    color: "#94a3b8"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item": {
-    marginRight: "0.4em"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > button": {
-    background: "#f1f5f9",
-    color: "#475569",
-    padding: "0.1em 0.4em",
-    borderRadius: "0.3em"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > a": {
-    background: "#f1f5f9",
-    color: "#475569",
-    padding: "0.1em 0.4em",
-    borderRadius: "0.3em"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > span": {
-    background: "#f1f5f9",
-    color: "#475569",
-    padding: "0.1em 0.4em",
-    borderRadius: "0.3em"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:hover": {
-    background: "#3b82f6",
-    color: "#ffffff"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:focus": {
-    background: "#3b82f6",
-    color: "#ffffff"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:hover": {
-    background: "#3b82f6",
-    color: "#ffffff"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:focus": {
-    background: "#3b82f6",
-    color: "#ffffff"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:hover": {
-    background: "#3b82f6",
-    color: "#ffffff"
-  },
-  "div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:focus": {
-    background: "#3b82f6",
-    color: "#ffffff"
-  },
-  ".line-highlight.line-highlight": {
-    background: "rgba(59, 130, 246, 0.08)"
-  },
-  ".line-highlight.line-highlight:before": {
-    background: "#f1f5f9",
-    color: "#1e293b",
-    padding: "0.1em 0.6em",
-    borderRadius: "0.3em",
-    boxShadow: "0 2px 0 0 rgba(0, 0, 0, 0.1)"
-  },
-  ".line-highlight.line-highlight[data-end]:after": {
-    background: "#f1f5f9",
-    color: "#1e293b",
-    padding: "0.1em 0.6em",
-    borderRadius: "0.3em",
-    boxShadow: "0 2px 0 0 rgba(0, 0, 0, 0.1)"
-  },
-  "pre[id].linkable-line-numbers.linkable-line-numbers span.line-numbers-rows > span:hover:before": {
-    backgroundColor: "rgba(59, 130, 246, 0.08)"
-  },
-  ".line-numbers.line-numbers .line-numbers-rows": {
-    borderRightColor: "#e2e8f0"
-  },
-  ".command-line .command-line-prompt": {
-    borderRightColor: "#e2e8f0"
-  },
-  ".line-numbers .line-numbers-rows > span:before": {
-    color: "#94a3b8"
-  },
-  ".command-line .command-line-prompt > span:before": {
-    color: "#94a3b8"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-1": {
-    color: "#3b82f6"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-5": {
-    color: "#3b82f6"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-9": {
-    color: "#3b82f6"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-2": {
-    color: "#16a34a"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-6": {
-    color: "#16a34a"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-10": {
-    color: "#16a34a"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-3": {
-    color: "#ea580c"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-7": {
-    color: "#ea580c"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-11": {
-    color: "#ea580c"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-4": {
-    color: "#9333ea"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-8": {
-    color: "#9333ea"
-  },
-  ".rainbow-braces .token.token.punctuation.brace-level-12": {
-    color: "#9333ea"
-  },
-  "pre.diff-highlight > code .token.token.deleted:not(.prefix)": {
-    backgroundColor: "rgba(220, 38, 38, 0.15)"
-  },
-  "pre > code.diff-highlight .token.token.deleted:not(.prefix)": {
-    backgroundColor: "rgba(220, 38, 38, 0.15)"
-  },
-  "pre.diff-highlight > code .token.token.deleted:not(.prefix)::-moz-selection": {
-    backgroundColor: "rgba(220, 38, 38, 0.25)"
-  },
-  "pre.diff-highlight > code .token.token.deleted:not(.prefix) *::-moz-selection": {
-    backgroundColor: "rgba(220, 38, 38, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.deleted:not(.prefix)::-moz-selection": {
-    backgroundColor: "rgba(220, 38, 38, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.deleted:not(.prefix) *::-moz-selection": {
-    backgroundColor: "rgba(220, 38, 38, 0.25)"
-  },
-  "pre.diff-highlight > code .token.token.deleted:not(.prefix)::selection": {
-    backgroundColor: "rgba(220, 38, 38, 0.25)"
-  },
-  "pre.diff-highlight > code .token.token.deleted:not(.prefix) *::selection": {
-    backgroundColor: "rgba(220, 38, 38, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.deleted:not(.prefix)::selection": {
-    backgroundColor: "rgba(220, 38, 38, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.deleted:not(.prefix) *::selection": {
-    backgroundColor: "rgba(220, 38, 38, 0.25)"
-  },
-  "pre.diff-highlight > code .token.token.inserted:not(.prefix)": {
-    backgroundColor: "rgba(22, 163, 74, 0.15)"
-  },
-  "pre > code.diff-highlight .token.token.inserted:not(.prefix)": {
-    backgroundColor: "rgba(22, 163, 74, 0.15)"
-  },
-  "pre.diff-highlight > code .token.token.inserted:not(.prefix)::-moz-selection": {
-    backgroundColor: "rgba(22, 163, 74, 0.25)"
-  },
-  "pre.diff-highlight > code .token.token.inserted:not(.prefix) *::-moz-selection": {
-    backgroundColor: "rgba(22, 163, 74, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.inserted:not(.prefix)::-moz-selection": {
-    backgroundColor: "rgba(22, 163, 74, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.inserted:not(.prefix) *::-moz-selection": {
-    backgroundColor: "rgba(22, 163, 74, 0.25)"
-  },
-  "pre.diff-highlight > code .token.token.inserted:not(.prefix)::selection": {
-    backgroundColor: "rgba(22, 163, 74, 0.25)"
-  },
-  "pre.diff-highlight > code .token.token.inserted:not(.prefix) *::selection": {
-    backgroundColor: "rgba(22, 163, 74, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.inserted:not(.prefix)::selection": {
-    backgroundColor: "rgba(22, 163, 74, 0.25)"
-  },
-  "pre > code.diff-highlight .token.token.inserted:not(.prefix) *::selection": {
-    backgroundColor: "rgba(22, 163, 74, 0.25)"
-  },
-  ".prism-previewer.prism-previewer:before": {
-    borderColor: "#fff"
-  },
-  ".prism-previewer-gradient.prism-previewer-gradient div": {
-    borderColor: "#fff",
-    borderRadius: "0.3em"
-  },
-  ".prism-previewer-color.prism-previewer-color:before": {
-    borderRadius: "0.3em"
-  },
-  ".prism-previewer-easing.prism-previewer-easing:before": {
-    borderRadius: "0.3em"
-  },
-  ".prism-previewer.prism-previewer:after": {
-    borderTopColor: "#fff"
-  },
-  ".prism-previewer-flipped.prism-previewer-flipped.after": {
-    borderBottomColor: "#fff"
-  },
-  ".prism-previewer-angle.prism-previewer-angle:before": {
-    background: "#f1f5f9"
-  },
-  ".prism-previewer-time.prism-previewer-time:before": {
-    background: "#f1f5f9"
-  },
-  ".prism-previewer-easing.prism-previewer-easing": {
-    background: "#f1f5f9"
-  },
-  ".prism-previewer-angle.prism-previewer-angle circle": {
-    stroke: "#1e293b",
-    strokeOpacity: "1"
-  },
-  ".prism-previewer-time.prism-previewer-time circle": {
-    stroke: "#1e293b",
-    strokeOpacity: "1"
-  },
-  ".prism-previewer-easing.prism-previewer-easing circle": {
-    stroke: "#1e293b",
-    fill: "transparent"
-  },
-  ".prism-previewer-easing.prism-previewer-easing path": {
-    stroke: "#1e293b"
-  },
-  ".prism-previewer-easing.prism-previewer-easing line": {
-    stroke: "#1e293b"
-  }
-};
-const CodeHighlighter = ({
-  className,
-  children,
-  copyClassName,
-  copyIcon = /* @__PURE__ */ jsx(SvgCopy, {}),
-  language,
-  toolbarClassName,
-  theme = dark
-}) => {
-  const match = language?.match(/language-(\w+)/);
-  const lang = match ? match[1] : "text";
-  const handleCopy = (text) => {
-    navigator.clipboard.writeText(text).then(() => {
-      console.log("Text copied to clipboard");
-    }).catch((err) => {
-      console.error("Could not copy text: ", err);
-    });
-  };
-  return /* @__PURE__ */ jsxs("div", { className: cn("relative", className), children: [
-    /* @__PURE__ */ jsxs("div", { className: cn(toolbarClassName), children: [
-      /* @__PURE__ */ jsx("div", { children: lang }),
-      copyIcon && /* @__PURE__ */ jsx(
-        Button,
-        {
-          className: cn(copyClassName),
-          size: "small",
-          variant: "ghost",
-          title: "Copy code",
-          onClick: () => handleCopy(children),
-          children: copyIcon
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsx(Prism, { language: lang, style: theme, children })
-  ] });
-};
-const TableComponent = ({ children, ...props }) => /* @__PURE__ */ jsx("table", { ...props, children });
-const TableHeaderCell = ({ children, ...props }) => /* @__PURE__ */ jsx("th", { ...props, children });
-const TableDataCell = ({ children, ...props }) => /* @__PURE__ */ jsx("td", { ...props, children });
-const Markdown = ({
-  children,
-  remarkPlugins,
-  rehypePlugins = [rehypeKatex],
-  theme
-}) => /* @__PURE__ */ jsx(
-  ReactMarkdown,
-  {
-    remarkPlugins,
-    rehypePlugins,
-    components: {
-      code: ({ className, ...props }) => /* @__PURE__ */ jsx(
-        CodeHighlighter,
-        {
-          ...props,
-          language: className,
-          className: cn(theme.messages.message.markdown.code, className),
-          copyClassName: cn(theme.messages.message.markdown.copy),
-          toolbarClassName: cn(theme.messages.message.markdown.toolbar)
-        }
-      ),
-      table: (props) => /* @__PURE__ */ jsx(
-        TableComponent,
-        {
-          ...props,
-          className: cn(theme.messages.message.markdown.table)
-        }
-      ),
-      th: (props) => /* @__PURE__ */ jsx(
-        TableHeaderCell,
-        {
-          ...props,
-          className: cn(theme.messages.message.markdown.th)
-        }
-      ),
-      td: (props) => /* @__PURE__ */ jsx(
-        TableDataCell,
-        {
-          ...props,
-          className: cn(theme.messages.message.markdown.td)
-        }
-      ),
-      a: (props) => /* @__PURE__ */ jsx("a", { ...props, className: cn(theme.messages.message.markdown.a) }),
-      p: (props) => /* @__PURE__ */ jsx("p", { ...props, className: cn(theme.messages.message.markdown.p) }),
-      li: (props) => /* @__PURE__ */ jsx("li", { ...props, className: cn(theme.messages.message.markdown.li) }),
-      ul: (props) => /* @__PURE__ */ jsx("ul", { ...props, className: cn(theme.messages.message.markdown.ul) }),
-      ol: (props) => /* @__PURE__ */ jsx("ol", { ...props, className: cn(theme.messages.message.markdown.ol) })
-    },
-    children
-  }
-);
-const CVE_REGEX = /(CVE-(19|20)\d{2}-\d{4,7})/gi;
-function remarkCve() {
-  return (tree) => {
-    findAndReplace(tree, [[CVE_REGEX, replaceCve]]);
-  };
-  function replaceCve(value, id) {
-    return [
-      {
-        type: "link",
-        url: `https://cve.mitre.org/cgi-bin/cvename.cgi?name=${id}`,
-        children: [{ children: [{ type: "text", value: value.trim() }] }]
-      }
-    ];
-  }
-}
-const SessionEmpty = ({ children }) => {
-  const { theme } = useContext(ChatContext);
-  return /* @__PURE__ */ jsx("div", { className: cn(theme.empty), children });
-};
-const SvgRefresh = (props) => /* @__PURE__ */ React.createElement("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M1.75 8.25098C2.16399 8.25098 2.49998 8.58699 2.5 9.00098C2.5 12.585 5.416 15.501 9 15.501C11.149 15.501 13.1291 14.4262 14.3301 12.6992L12.8701 12.9014C12.4591 12.9484 12.0814 12.6698 12.0244 12.2598C11.9685 11.8498 12.2541 11.4711 12.665 11.4141L15.6094 11.0068L15.6104 11.0078C16.0172 10.951 16.3981 11.2386 16.4551 11.6484L16.8633 14.5928C16.9203 15.0038 16.6327 15.3825 16.2227 15.4395C16.1878 15.4444 16.153 15.4463 16.1191 15.4463C15.7501 15.4463 15.429 15.1738 15.377 14.7988L15.2598 13.9551C13.7628 15.842 11.4739 17.001 9 17.001C4.589 17.001 1 13.412 1 9.00098C1.00002 8.58699 1.33601 8.25098 1.75 8.25098ZM9.00098 1C13.412 1 17.001 4.589 17.001 9C17.001 9.414 16.665 9.75 16.251 9.75C15.837 9.75 15.501 9.414 15.501 9C15.501 5.416 12.585 2.5 9.00098 2.5C6.84502 2.5 4.87188 3.57384 3.67188 5.30078L5.12988 5.09863C5.53788 5.04563 5.91859 5.32923 5.97559 5.74023C6.03148 6.15017 5.7459 6.52895 5.33496 6.58594L2.39062 6.99316C2.35579 6.99812 2.32095 6.99999 2.28711 7C1.91811 7 1.59692 6.72754 1.54492 6.35254L1.13672 3.4082C1.07972 2.9972 1.36734 2.61852 1.77734 2.56152C2.18818 2.50179 2.56607 2.79129 2.62305 3.20215L2.73926 4.04199C4.23526 2.15508 6.52006 1 9 1H9.00098Z", fill: "currentColor" }));
-const SvgThumbsDown = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M11.25 1.25H4.5C3.8775 1.25 3.345 1.625 3.12 2.165L0.855 7.4525C0.7875 7.625 0.75 7.805 0.75 8V9.5C0.75 10.325 1.425 11 2.25 11H6.9825L6.27 14.4275L6.2475 14.6675C6.2475 14.975 6.375 15.26 6.5775 15.4625L7.3725 16.25L12.315 11.3075C12.585 11.0375 12.75 10.6625 12.75 10.25V2.75C12.75 1.925 12.075 1.25 11.25 1.25ZM11.25 10.25L7.995 13.505L9 9.5H2.25V8L4.5 2.75H11.25V10.25ZM14.25 1.25H17.25V10.25H14.25V1.25Z", fill: "currentColor" }));
-const SvgThumbsUp = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M6.75 15.75H13.5C14.1225 15.75 14.655 15.375 14.88 14.835L17.145 9.5475C17.2125 9.375 17.25 9.195 17.25 9V7.5C17.25 6.675 16.575 6 15.75 6H11.0175L11.73 2.5725L11.7525 2.3325C11.7525 2.025 11.625 1.74 11.4225 1.5375L10.6275 0.75L5.685 5.6925C5.415 5.9625 5.25 6.3375 5.25 6.75V14.25C5.25 15.075 5.925 15.75 6.75 15.75ZM6.75 6.75L10.005 3.495L9 7.5H15.75V9L13.5 14.25H6.75V6.75ZM0.75 6.75H3.75V15.75H0.75V6.75Z", fill: "currentColor" }));
-const MessageActions = ({
-  children,
-  ...props
-}) => {
-  const { theme } = useContext(ChatContext);
-  const {
-    question,
-    response,
-    copyIcon = /* @__PURE__ */ jsx(SvgCopy, {}),
-    thumbsUpIcon = /* @__PURE__ */ jsx(SvgThumbsUp, {}),
-    thumbsDownIcon = /* @__PURE__ */ jsx(SvgThumbsDown, {}),
-    refreshIcon = /* @__PURE__ */ jsx(SvgRefresh, {}),
-    onCopy,
-    onUpvote,
-    onDownvote,
-    onRefresh
-  } = props;
-  const Comp = children ? Slot : "div";
-  const handleCopy = (text) => {
-    navigator.clipboard.writeText(text).then(() => {
-      console.log("Text copied to clipboard");
-    }).catch((err) => {
-      console.error("Could not copy text: ", err);
-    });
-  };
-  return (copyIcon || thumbsDownIcon || thumbsUpIcon || refreshIcon) && /* @__PURE__ */ jsx(Comp, { className: cn(theme.messages.message.footer.base), children: children || /* @__PURE__ */ jsxs(Fragment, { children: [
-    copyIcon && /* @__PURE__ */ jsx(
-      IconButton,
-      {
-        variant: "ghost",
-        disablePadding: true,
-        title: "Copy question and response",
-        className: cn(theme.messages.message.footer.copy),
-        onClick: onCopy ? onCopy : () => handleCopy(`${question}
-${response}`),
-        children: copyIcon
-      }
-    ),
-    thumbsUpIcon && /* @__PURE__ */ jsx(
-      IconButton,
-      {
-        variant: "ghost",
-        disablePadding: true,
-        title: "Upvote",
-        className: cn(theme.messages.message.footer.upvote),
-        onClick: onUpvote,
-        children: thumbsUpIcon
-      }
-    ),
-    thumbsDownIcon && /* @__PURE__ */ jsx(
-      IconButton,
-      {
-        variant: "ghost",
-        disablePadding: true,
-        title: "Downvote",
-        className: cn(theme.messages.message.footer.downvote),
-        onClick: onDownvote,
-        children: thumbsDownIcon
-      }
-    ),
-    refreshIcon && /* @__PURE__ */ jsx(
-      IconButton,
-      {
-        variant: "ghost",
-        disablePadding: true,
-        title: "Refresh",
-        className: cn(theme.messages.message.footer.refresh),
-        onClick: onRefresh,
-        children: refreshIcon
-      }
-    )
-  ] }) });
-};
-const SvgFile = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 16, height: 16, viewBox: "0 0 16 16", fill: "currentColor", ...props }, /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2.7036 1.37034C3.04741 1.02653 3.51373 0.833374 3.99996 0.833374H9.33329H9.33331C9.47275 0.833374 9.59885 0.890449 9.68954 0.98251L13.6843 4.97722C13.7763 5.0679 13.8333 5.19398 13.8333 5.33337L13.8333 5.3379V13.3334C13.8333 13.8196 13.6401 14.2859 13.2963 14.6297C12.9525 14.9736 12.4862 15.1667 12 15.1667H3.99996C3.51373 15.1667 3.04741 14.9736 2.7036 14.6297C2.35978 14.2859 2.16663 13.8196 2.16663 13.3334V2.66671C2.16663 2.18048 2.35978 1.71416 2.7036 1.37034ZM3.99996 1.83337H8.83331V5.33337C8.83331 5.60952 9.05717 5.83337 9.33331 5.83337H12.8333V13.3334C12.8333 13.5544 12.7455 13.7663 12.5892 13.9226C12.4329 14.0789 12.221 14.1667 12 14.1667H3.99996C3.77895 14.1667 3.56698 14.0789 3.4107 13.9226C3.25442 13.7663 3.16663 13.5544 3.16663 13.3334V2.66671C3.16663 2.44569 3.25442 2.23373 3.4107 2.07745C3.56698 1.92117 3.77895 1.83337 3.99996 1.83337ZM9.83331 2.5405L12.1262 4.83337H9.83331V2.5405ZM5.33331 8.16663C5.05717 8.16663 4.83331 8.39048 4.83331 8.66663C4.83331 8.94277 5.05717 9.16663 5.33331 9.16663H10.6666C10.9428 9.16663 11.1666 8.94277 11.1666 8.66663C11.1666 8.39048 10.9428 8.16663 10.6666 8.16663H5.33331ZM4.83331 11.3334C4.83331 11.0572 5.05717 10.8334 5.33331 10.8334H10.6666C10.9428 10.8334 11.1666 11.0572 11.1666 11.3334C11.1666 11.6095 10.9428 11.8334 10.6666 11.8334H5.33331C5.05717 11.8334 4.83331 11.6095 4.83331 11.3334ZM5.33331 5.5C5.05717 5.5 4.83331 5.72386 4.83331 6C4.83331 6.27614 5.05717 6.5 5.33331 6.5H6.66665C6.94279 6.5 7.16665 6.27614 7.16665 6C7.16665 5.72386 6.94279 5.5 6.66665 5.5H5.33331Z" }));
-const DefaultFileRenderer = lazy(
-  () => import("./DefaultFileRenderer-C30msYzW.js")
-);
-const CSVFileRenderer = lazy(() => import("./CSVFileRenderer-CaWN5iTb.js"));
-const ImageFileRenderer = lazy(() => import("./ImageFileRenderer-C8tVW3I8.js"));
-const PDFFileRenderer = lazy(() => import("./PDFFileRenderer-BBn2EVrV.js"));
-const FILE_TYPE_RENDERER_MAP = {
-  "image/": ImageFileRenderer,
-  "text/csv": CSVFileRenderer,
-  "application/pdf": PDFFileRenderer
-};
-const MessageFile = ({
-  name,
-  type,
-  url,
-  limit = 100,
-  fileIcon = /* @__PURE__ */ jsx(SvgFile, {})
-}) => {
-  const { theme } = useContext(ChatContext);
-  const FileRenderer = useMemo(() => {
-    const Renderer = Object.keys(FILE_TYPE_RENDERER_MAP).find((key) => type?.startsWith(key)) ?? "default";
-    return FILE_TYPE_RENDERER_MAP[Renderer] || DefaultFileRenderer;
-  }, [type]);
-  return /* @__PURE__ */ jsx("div", { className: cn(theme.messages.message.files.file.base), children: /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx("div", { children: "Loading..." }), children: /* @__PURE__ */ jsx(FileRenderer, { name, url, fileIcon, limit }) }) });
-};
-const MessageFiles = ({ files, children }) => {
-  const { theme } = useContext(ChatContext);
-  const Comp = children ? Slot : MessageFile;
-  const [expanded, setExpanded] = useState(false);
-  if (!files || files.length === 0) {
-    return null;
-  }
-  const { imageFiles, otherFiles } = files.reduce(
-    (acc, file) => {
-      if (file.type.startsWith("image/")) {
-        acc.imageFiles.push(file);
-      } else {
-        acc.otherFiles.push(file);
-      }
-      return acc;
-    },
-    {
-      imageFiles: [],
-      otherFiles: []
-    }
-  );
-  const maxImageLength = 3;
-  const truncateImages = !expanded && imageFiles.length > maxImageLength;
-  const renderImageFiles = (images) => {
-    return truncateImages ? images.slice(0, maxImageLength).map((image, index) => /* @__PURE__ */ jsxs(
-      "figure",
-      {
-        className: index === 0 ? "col-span-2 row-span-2" : "relative",
-        children: [
-          /* @__PURE__ */ jsx(
-            "img",
-            {
-              src: image.url,
-              alt: image.name,
-              className: "relative w-full h-full object-cover rounded-lg"
-            }
-          ),
-          index === maxImageLength - 1 && /* @__PURE__ */ jsxs(
-            "div",
-            {
-              className: "absolute top-0 left-0 w-full h-full flex justify-center items-center bg-black bg-opacity-50 rounded-lg cursor-pointer",
-              onClick: () => setExpanded(true),
-              children: [
-                "+",
-                (imageFiles.length - maxImageLength).toLocaleString()
-              ]
-            }
-          )
-        ]
-      },
-      index
-    )) : images.map((image, index) => /* @__PURE__ */ jsx(Comp, { ...image, children }, index));
-  };
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: cn(
-        theme.messages.message.files.base,
-        truncateImages ? "grid grid-rows-2 grid-flow-col gap-2 w-1/3" : ""
-      ),
-      children: [
-        imageFiles.length > 0 && renderImageFiles(imageFiles),
-        otherFiles.length > 0 && otherFiles.map((file, index) => /* @__PURE__ */ jsx(Comp, { ...file, children }, index))
-      ]
-    }
-  );
-};
-const MessageQuestion = ({
-  children,
-  ...props
-}) => {
-  const { theme, remarkPlugins } = useContext(ChatContext);
-  const { question, files } = props;
-  const Comp = children ? Slot : "div";
-  const [expanded, setExpanded] = useState(false);
-  const isLong = question.length > 500;
-  return /* @__PURE__ */ jsx(
-    Comp,
-    {
-      className: cn(theme.messages.message.question, {
-        [theme.messages.message.overlay]: isLong && !expanded
-      }),
-      ...props,
-      children: children || /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(MessageFiles, { files }),
-        /* @__PURE__ */ jsx(Markdown, { remarkPlugins, theme, children: question }),
-        isLong && !expanded && /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "link",
-            size: "small",
-            className: theme.messages.message.expand,
-            onClick: () => setExpanded(true),
-            children: "Show more"
-          }
-        )
-      ] })
-    }
-  );
-};
-const MessageResponse = ({
-  response,
-  isLoading,
-  children
-}) => {
-  const { theme, isCompact, remarkPlugins } = useContext(ChatContext);
-  const Comp = children ? Slot : "div";
-  return /* @__PURE__ */ jsx(
-    Comp,
-    {
-      "data-compact": isCompact,
-      className: cn(theme.messages.message.response),
-      children: children || /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(Markdown, { remarkPlugins, theme, children: response }),
-        isLoading && /* @__PURE__ */ jsx(
-          motion.div,
-          {
-            className: cn(theme.messages.message.cursor),
-            animate: { opacity: [1, 0] },
-            transition: {
-              duration: 0.7,
-              repeat: Infinity,
-              repeatType: "reverse"
-            }
-          }
-        )
-      ] })
-    }
-  );
-};
-const MessageSource = ({
-  title,
-  url,
-  image,
-  limit = 50
-}) => {
-  const { theme, isCompact } = useContext(ChatContext);
-  return /* @__PURE__ */ jsxs(
-    "figure",
-    {
-      className: cn(theme.messages.message.sources.source.base, {
-        [theme.messages.message.sources.source.companion]: isCompact
-      }),
-      onClick: () => {
-        if (url) {
-          window.open(url, "_blank");
-        }
-      },
-      children: [
-        image && /* @__PURE__ */ jsx(
-          "img",
-          {
-            src: image,
-            alt: title,
-            className: cn(theme.messages.message.sources.source.image)
-          }
-        ),
-        (title || url) && /* @__PURE__ */ jsxs("figcaption", { children: [
-          title && /* @__PURE__ */ jsx("span", { className: cn(theme.messages.message.sources.source.title), children: /* @__PURE__ */ jsx(Ellipsis, { value: title, limit }) }),
-          url && /* @__PURE__ */ jsx(
-            "a",
-            {
-              href: url,
-              target: "_blank",
-              rel: "noopener noreferrer",
-              className: cn(theme.messages.message.sources.source.url),
-              children: url
-            }
-          )
-        ] })
-      ]
-    }
-  );
-};
-const MessageSources = ({
-  sources,
-  children
-}) => {
-  const { theme } = useContext(ChatContext);
-  const Comp = children ? Slot : MessageSource;
-  if (!sources || sources.length === 0) {
-    return null;
-  }
-  return sources && sources.length > 0 && /* @__PURE__ */ jsx("div", { className: cn(theme.messages.message.sources.base), children: sources.map((source, index) => /* @__PURE__ */ jsx(Comp, { ...source, children }, index)) });
-};
-const messageVariants = {
-  hidden: {
-    opacity: 0,
-    y: 20
-  },
-  visible: {
-    opacity: 1,
-    y: 0,
-    transition: {
-      duration: 0.3
-    }
-  }
-};
-const SessionMessage = ({
-  className,
-  conversation,
-  isLast,
-  children
-}) => {
-  const { theme, isLoading } = useContext(ChatContext);
-  return /* @__PURE__ */ jsxs(motion.div, { variants: messageVariants, children: [
-    /* @__PURE__ */ jsx(Card, { className: cn(theme.messages.message.base, className), children: children || /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(
-        MessageQuestion,
-        {
-          question: conversation.question,
-          files: conversation.files
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        MessageResponse,
-        {
-          response: conversation.response,
-          isLoading: isLast && isLoading
-        }
-      ),
-      /* @__PURE__ */ jsx(MessageSources, { sources: conversation.sources }),
-      /* @__PURE__ */ jsx(
-        MessageActions,
-        {
-          question: conversation.question,
-          response: conversation.response
-        }
-      )
-    ] }) }),
-    !isLast && /* @__PURE__ */ jsx(Divider, {})
-  ] }, conversation.id);
-};
-const SvgBack = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 50 50", width: "24px", height: "24px", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M 34.980469 3.992188 C 34.71875 3.996094 34.472656 4.105469 34.292969 4.292969 L 14.292969 24.292969 C 13.902344 24.683594 13.902344 25.316406 14.292969 25.707031 L 34.292969 45.707031 C 34.542969 45.96875 34.917969 46.074219 35.265625 45.980469 C 35.617188 45.890625 35.890625 45.617188 35.980469 45.265625 C 36.074219 44.917969 35.96875 44.542969 35.707031 44.292969 L 16.414063 25 L 35.707031 5.707031 C 36.003906 5.417969 36.089844 4.980469 35.929688 4.601563 C 35.769531 4.21875 35.394531 3.976563 34.980469 3.992188 Z", fill: "currentColor" }));
-const SessionMessagePanel = ({
-  children,
-  allowBack = true
-}) => {
-  const { activeSessionId, theme, isCompact, selectSession, viewType } = useContext(ChatContext);
-  const isVisible = isCompact && activeSessionId || viewType === "chat" || !isCompact;
-  return isVisible && /* @__PURE__ */ jsx(
-    motion.div,
-    {
-      initial: { translateX: "200%" },
-      animate: {
-        translateX: "0%",
-        transition: {
-          type: "tween",
-          ease: "linear",
-          duration: 0.2,
-          when: "beforeChildren"
-        }
-      },
-      exit: { translateX: "200%" },
-      className: cn(theme.messages.base, {
-        [theme.messages.companion]: isCompact,
-        [theme.messages.console]: !isCompact
-      }),
-      children: /* @__PURE__ */ jsxs("div", { className: cn(theme.messages.inner), children: [
-        allowBack && isCompact && viewType !== "chat" && /* @__PURE__ */ jsxs(
-          Button,
-          {
-            variant: "text",
-            size: "small",
-            onClick: () => selectSession(null),
-            className: cn(theme.messages.back),
-            children: [
-              /* @__PURE__ */ jsx(SvgBack, {}),
-              "Back"
-            ]
-          }
-        ),
-        children
-      ] })
-    }
-  );
-};
-const containerVariants = {
-  hidden: {},
-  visible: {
-    transition: {
-      staggerChildren: 0.07,
-      when: "beforeChildren"
-    }
-  }
-};
-const SessionMessages = ({
-  children,
-  newSessionContent,
-  limit = 10,
-  className,
-  showMoreText = "Show more",
-  autoScroll = true
-}) => {
-  const { activeSession, theme } = useContext(ChatContext);
-  const contentRef = useRef(null);
-  const [isAnimating, setIsAnimating] = useState(true);
-  useEffect(() => {
-    if (contentRef.current && autoScroll) {
-      requestAnimationFrame(
-        () => contentRef.current.scrollTop = contentRef.current.scrollHeight
-      );
-    }
-  }, [activeSession, autoScroll, isAnimating]);
-  function handleShowMore() {
-    showNext(limit);
-    requestAnimationFrame(() => contentRef.current.scrollTop = 0);
-  }
-  const reversedConvos = useMemo(
-    () => [...activeSession?.conversations ?? []].reverse(),
-    [activeSession]
-  );
-  const { data, hasMore, showNext } = useInfinityList({
-    items: reversedConvos,
-    size: limit
-  });
-  const reReversedConvo = useMemo(() => [...data].reverse(), [data]);
-  const convosToRender = limit ? reReversedConvo : activeSession?.conversations;
-  if (!activeSession) {
-    return /* @__PURE__ */ jsx(SessionEmpty, { children: newSessionContent });
-  }
-  return /* @__PURE__ */ jsxs("div", { className: cn(theme.messages.content, className), ref: contentRef, children: [
-    hasMore && /* @__PURE__ */ jsx(
-      Button,
-      {
-        variant: "outline",
-        className: cn(theme.messages.showMore),
-        fullWidth: true,
-        onClick: handleShowMore,
-        children: showMoreText
-      }
-    ),
-    /* @__PURE__ */ jsx(AnimatePresence, { children: /* @__PURE__ */ jsx(
-      motion.div,
-      {
-        variants: containerVariants,
-        initial: "hidden",
-        animate: "visible",
-        onAnimationComplete: () => {
-          requestAnimationFrame(() => setIsAnimating(false));
-        },
-        children: children ? children(convosToRender) : convosToRender.map((conversation, index) => /* @__PURE__ */ jsx(
-          SessionMessage,
-          {
-            conversation,
-            isLast: index === conversation.length - 1
-          },
-          conversation.id
-        ))
-      },
-      activeSession?.id
-    ) })
-  ] });
-};
-const SessionMessagesHeader = ({ children }) => {
-  const { activeSession, theme } = useContext(ChatContext);
-  const Comp = children ? Slot : "header";
-  if (!activeSession) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx(Comp, { className: cn(theme.messages.header), children: children || /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx("h2", { className: cn(theme.messages.title), children: /* @__PURE__ */ jsx(Ellipsis, { limit: 125, value: activeSession.title }) }),
-    /* @__PURE__ */ jsx(
-      DateFormat,
-      {
-        className: cn(theme.messages.date),
-        date: activeSession.createdAt
-      }
-    )
-  ] }) });
-};
-const SvgPlus = (props) => /* @__PURE__ */ React.createElement("svg", { width: 17, height: 17, viewBox: "0 0 17 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("g", { id: "add" }, /* @__PURE__ */ React.createElement("path", { id: "Vector", d: "M13.1667 9.16658H9.16671V13.1666H7.83337V9.16658H3.83337V7.83325H7.83337V3.83325H9.16671V7.83325H13.1667V9.16658Z", fill: "currentColor" })));
-const NewSessionButton = ({
-  children,
-  newSessionText = "New Session"
-}) => {
-  const { theme, createSession, disabled } = useContext(ChatContext);
-  const Comp = children ? Slot : Button;
-  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
-    Comp,
-    {
-      fullWidth: true,
-      disableMargins: true,
-      color: "primary",
-      startAdornment: /* @__PURE__ */ jsx(SvgPlus, {}),
-      className: cn(theme.sessions.create),
-      disabled,
-      onClick: createSession,
-      children: children || newSessionText
-    }
-  ) });
-};
-const sortOrder = [
-  "Today",
-  "Yesterday",
-  "Last Week",
-  "Last Month",
-  "January",
-  "February",
-  "March",
-  "April",
-  "May",
-  "June",
-  "July",
-  "August",
-  "September",
-  "October",
-  "November",
-  "December",
-  "Last Year"
-];
-function groupSessionsByDate(sessions) {
-  const grouped = {};
-  sessions.forEach((session) => {
-    const createdAt = new Date(session.createdAt);
-    const now = /* @__PURE__ */ new Date();
-    if (isToday(createdAt)) {
-      if (!grouped["Today"]) grouped["Today"] = [];
-      grouped["Today"].push(session);
-    } else if (isYesterday(createdAt)) {
-      if (!grouped["Yesterday"]) grouped["Yesterday"] = [];
-      grouped["Yesterday"].push(session);
-    } else if (isThisWeek(createdAt)) {
-      if (!grouped["Last Week"]) grouped["Last Week"] = [];
-      grouped["Last Week"].push(session);
-    } else if (differenceInYears(now, createdAt) === 0) {
-      const monthDiff = now.getMonth() - createdAt.getMonth();
-      if (monthDiff === 1 || monthDiff === 0 && now.getDate() > createdAt.getDate()) {
-        if (!grouped["Last Month"]) grouped["Last Month"] = [];
-        grouped["Last Month"].push(session);
-      } else {
-        const monthName = format(createdAt, "MMMM");
-        if (!grouped[monthName]) grouped[monthName] = [];
-        grouped[monthName].push(session);
-      }
-    } else {
-      if (!grouped["Last Year"]) grouped["Last Year"] = [];
-      grouped["Last Year"].push(session);
-    }
-  });
-  Object.keys(grouped).forEach((key) => {
-    if (grouped[key].length === 0) {
-      delete grouped[key];
-    }
-  });
-  const sortedGroups = Object.keys(grouped).sort(
-    (a, b) => sortOrder.indexOf(a) - sortOrder.indexOf(b)
-  );
-  return sortedGroups.map((heading) => ({
-    heading,
-    sessions: grouped[heading].sort(
-      (a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()
-    )
-  }));
-}
-const SvgChat = (props) => /* @__PURE__ */ React.createElement("svg", { width: 16, height: 17, viewBox: "0 0 16 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M8 3C4.55375 3 1.75 5.23753 1.75 7.98828C1.75 9.70653 2.83659 11.2762 4.62109 12.188C4.11184 13.0465 3.62587 13.7378 3.62012 13.7461C3.50687 13.9071 3.49862 14.1196 3.59912 14.2891C3.69012 14.4418 3.8543 14.5342 4.0293 14.5342C4.0483 14.5342 4.06743 14.533 4.08643 14.5308C4.15168 14.5233 5.66214 14.3364 7.50439 12.9604C7.67239 12.9712 7.8385 12.9766 8 12.9766C11.4462 12.9766 14.25 10.739 14.25 7.98828C14.25 5.23753 11.4462 3 8 3ZM8 4C10.8948 4 13.25 5.78903 13.25 7.98828C13.25 10.1875 10.8948 11.9766 8 11.9766C7.8055 11.9766 7.60225 11.968 7.396 11.9497C7.271 11.9382 7.1454 11.9752 7.0459 12.0527C6.3589 12.5855 5.72033 12.9308 5.20508 13.1528C5.38383 12.8648 5.57691 12.5418 5.76416 12.2061C5.83416 12.0813 5.84705 11.9324 5.7998 11.7974C5.75255 11.6624 5.64983 11.5542 5.51758 11.5C3.81033 10.7993 2.75 9.45328 2.75 7.98828C2.75 5.78903 5.10525 4 8 4ZM5.5 7.25C5.08575 7.25 4.75 7.58575 4.75 8C4.75 8.41425 5.08575 8.75 5.5 8.75C5.91425 8.75 6.25 8.41425 6.25 8C6.25 7.58575 5.91425 7.25 5.5 7.25ZM8 7.25C7.58575 7.25 7.25 7.58575 7.25 8C7.25 8.41425 7.58575 8.75 8 8.75C8.41425 8.75 8.75 8.41425 8.75 8C8.75 7.58575 8.41425 7.25 8 7.25ZM10.5 7.25C10.0857 7.25 9.75 7.58575 9.75 8C9.75 8.41425 10.0857 8.75 10.5 8.75C10.9143 8.75 11.25 8.41425 11.25 8C11.25 7.58575 10.9143 7.25 10.5 7.25Z", fill: "currentColor" }));
-const SvgTrash = (props) => /* @__PURE__ */ React.createElement("svg", { width: 14, height: 14, viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("g", { id: "Delete" }, /* @__PURE__ */ React.createElement("path", { id: "Vector", d: "M5.97905 1.16666C5.90859 1.16576 5.83895 1.18189 5.77605 1.21368C5.71316 1.24547 5.65888 1.29199 5.61783 1.34926C5.57677 1.40654 5.55016 1.47288 5.54025 1.54265C5.53034 1.61242 5.53743 1.68355 5.56092 1.75H4.27007C3.7342 1.75 3.2324 2.01817 2.93535 2.46435L2.24492 3.5H2.18738C2.12941 3.49918 2.07185 3.50989 2.01805 3.5315C1.96425 3.55312 1.91529 3.58522 1.874 3.62593C1.83271 3.66663 1.79993 3.71514 1.77755 3.76863C1.75518 3.82211 1.74365 3.87952 1.74365 3.9375C1.74365 3.99548 1.75518 4.05288 1.77755 4.10636C1.79993 4.15985 1.83271 4.20836 1.874 4.24907C1.91529 4.28977 1.96425 4.32187 2.01805 4.34349C2.07185 4.3651 2.12941 4.37582 2.18738 4.375H2.41012C2.44765 4.38067 2.48576 4.38143 2.52348 4.37727L3.24468 11.1084C3.33169 11.9199 4.02367 12.5417 4.83973 12.5417H9.15947C9.97553 12.5417 10.6675 11.9199 10.7545 11.1084L11.4763 4.37727C11.5133 4.38124 11.5506 4.38047 11.5874 4.375H11.8124C11.8704 4.37582 11.9279 4.3651 11.9817 4.34349C12.0355 4.32187 12.0845 4.28977 12.1258 4.24907C12.1671 4.20836 12.1998 4.15985 12.2222 4.10636C12.2446 4.05288 12.2561 3.99548 12.2561 3.9375C12.2561 3.87952 12.2446 3.82211 12.2222 3.76863C12.1998 3.71514 12.1671 3.66663 12.1258 3.62593C12.0845 3.58522 12.0355 3.55312 11.9817 3.5315C11.9279 3.50989 11.8704 3.49918 11.8124 3.5H11.7548L11.0644 2.46435C10.7671 2.01841 10.2654 1.75 9.7297 1.75H8.43885C8.46234 1.68355 8.46943 1.61242 8.45952 1.54265C8.44961 1.47288 8.423 1.40654 8.38194 1.34926C8.34089 1.29199 8.2866 1.24547 8.22371 1.21368C8.16082 1.18189 8.09118 1.16576 8.02072 1.16666H5.97905ZM4.27007 2.625H9.7297C9.97394 2.625 10.2009 2.74639 10.3364 2.9497L10.7033 3.5H3.29651L3.66338 2.9497L3.66395 2.94913C3.79913 2.74608 4.02543 2.625 4.27007 2.625ZM3.40361 4.375H10.5962L9.88465 11.015C9.8445 11.3894 9.53575 11.6667 9.15947 11.6667H4.83973C4.46345 11.6667 4.15527 11.3894 4.11512 11.015L3.40361 4.375Z", fill: "currentColor" })));
-const SessionListItem = ({
-  children,
-  session,
-  deletable = true,
-  limit = 100,
-  deleteIcon = /* @__PURE__ */ jsx(SvgTrash, {}),
-  chatIcon = /* @__PURE__ */ jsx(SvgChat, { className: "mr-2" })
-}) => {
-  const { activeSessionId, selectSession, deleteSession, theme } = useContext(ChatContext);
-  const Comp = children ? Slot : ListItem;
-  return /* @__PURE__ */ jsx(
-    Comp,
-    {
-      dense: true,
-      disableGutters: true,
-      active: session.id === activeSessionId,
-      className: cn(theme.sessions.session.base, {
-        [theme.sessions.session.active]: session.id === activeSessionId
-      }),
-      onClick: () => selectSession?.(session.id),
-      start: chatIcon,
-      end: /* @__PURE__ */ jsx(Fragment, { children: deletable && /* @__PURE__ */ jsx(
-        IconButton,
-        {
-          size: "small",
-          variant: "ghost",
-          onClick: (e) => {
-            e.stopPropagation();
-            deleteSession(session.id);
-          },
-          className: cn(theme.sessions.session.delete),
-          children: deleteIcon
-        }
-      ) }),
-      children: children || /* @__PURE__ */ jsx(Ellipsis, { value: session.title, limit })
-    }
-  );
-};
-const SessionsGroup = ({
-  heading,
-  children
-}) => {
-  const { theme } = useContext(ChatContext);
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    heading && /* @__PURE__ */ jsx(
-      ListItem,
-      {
-        disableGutters: true,
-        disablePadding: true,
-        className: cn(theme.sessions.group),
-        children: heading
-      }
-    ),
-    children
-  ] });
-};
-const SessionGroups = ({ children }) => {
-  const { sessions } = useContext(ChatContext);
-  const groups = useMemo(() => groupSessionsByDate(sessions), [sessions]);
-  return /* @__PURE__ */ jsx(Fragment, { children: children ? children(groups) : groups.map(({ heading, sessions: sessions2 }) => /* @__PURE__ */ jsx(SessionsGroup, { heading, children: sessions2.map((session) => /* @__PURE__ */ jsx(SessionListItem, { session }, session.id)) }, heading)) });
-};
-const SessionsList = ({
-  children,
-  templates
-}) => {
-  const { theme, isCompact, activeSessionId, createSession } = useContext(ChatContext);
-  const isVisible = isCompact && !activeSessionId;
-  return (!isCompact || isVisible) && /* @__PURE__ */ jsxs(
-    motion.div,
-    {
-      initial: { translateX: "-100%" },
-      animate: {
-        translateX: "0%",
-        transition: {
-          type: "tween",
-          ease: "linear",
-          duration: 0.2,
-          when: "beforeChildren"
-        }
-      },
-      exit: { translateX: "-100%" },
-      className: cn(theme.sessions.base, {
-        [theme.sessions.companion]: isCompact,
-        [theme.sessions.console]: !isCompact
-      }),
-      children: [
-        /* @__PURE__ */ jsx(List, { children }),
-        templates && !activeSessionId && /* @__PURE__ */ jsx("div", { className: "mt-4", children: templates.map((template) => /* @__PURE__ */ jsx("div", { onClick: () => createSession?.(), children: /* @__PURE__ */ jsx(
-          SessionListItem,
-          {
-            session: {
-              id: template.id,
-              title: template.title,
-              conversations: []
-            },
-            chatIcon: template.icon,
-            deletable: false
-          }
-        ) }, template.id)) })
-      ]
-    }
-  );
-};
-export {
-  AppBar as A,
-  chatTheme as B,
-  ChatContext as C,
-  groupSessionsByDate as D,
-  FileInput as F,
-  Markdown as M,
-  NewSessionButton as N,
-  SvgFile as S,
-  TableComponent as T,
-  SvgCopy as a,
-  Chat as b,
-  ChatBubble as c,
-  ChatInput as d,
-  CodeHighlighter as e,
-  TableHeaderCell as f,
-  TableDataCell as g,
-  dark as h,
-  SessionEmpty as i,
-  MessageActions as j,
-  MessageFile as k,
-  light as l,
-  MessageFiles as m,
-  MessageQuestion as n,
-  MessageResponse as o,
-  MessageSource as p,
-  MessageSources as q,
-  remarkCve as r,
-  SessionMessage as s,
-  SessionMessagePanel as t,
-  SessionMessages as u,
-  SessionMessagesHeader as v,
-  SessionGroups as w,
-  SessionListItem as x,
-  SessionsGroup as y,
-  SessionsList as z
-};
-//# sourceMappingURL=index-DRRvnZUj.js.map