reachat 2.1.0-alpha.9 → 2.1.1

package/dist/docs.json

@@ -105,7 +105,7 @@
       },
       "theme": {
         "defaultValue": {
-          "value": "{\n  base: 'text-content-text-neutral-base',\n  console: 'flex w-full gap-4 h-full',\n  companion: 'w-full h-full overflow-hidden',\n  empty: 'text-center flex-1',\n  appbar: 'flex p-5',\n  sessions: {\n    base: 'overflow-auto',\n    console:\n      'min-w-[150px] w-[30%] max-w-[300px] bg-gradient-neutral-200 p-5 rounded-3xl',\n    companion: 'w-full h-full',\n    group: 'text-xs text-content-text-neutral-3 mt-4 hover:bg-transparent mb-1',\n    create: 'relative mb-4 rounded-[10px] text-white',\n    session: {\n      base: 'group my-1 rounded-[10px] p-2 text-content-text-neutral-1 border border-transparent',\n      active:\n        'border-select-menu-items-color-item-stroke-row-hover [&_button]:opacity-100!',\n      delete: '[&>svg]:w-4 [&>svg]:h-4 opacity-0 group-hover:opacity-50!'\n    }\n  },\n  messages: {\n    base: '',\n    console: 'flex flex-col mx-5 flex-1 overflow-hidden',\n    companion: 'flex w-full h-full',\n    back: 'self-start pl-0 my-2 ',\n    inner: 'flex-1 h-full flex flex-col',\n    title: 'text-base font-bold',\n    date: 'text-xs whitespace-nowrap text-content-text-neutral-2',\n    content: 'mt-2 flex-1 overflow-auto',\n    header: 'flex justify-between items-center gap-2',\n    showMore: 'mb-4',\n    message: {\n      base: 'mt-4 mb-4 flex flex-col p-0 rounded-sm border-none bg-transparent',\n      question:\n        '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)',\n      response:\n        'relative data-[compact=false]:px-4 text-content-text-neutral-base',\n      overlay:\n        \"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\",\n      cursor: 'inline-block w-1 h-4 bg-current',\n      expand: 'absolute bottom-0 right-1 z-10',\n      files: {\n        base: 'mb-2 flex flex-wrap gap-3 ',\n        file: {\n          base: 'flex items-center gap-2 border border-stroke-neutral-4 px-3 py-2 rounded-lg cursor-pointer',\n          name: 'text-sm text-content-text-neutral-4'\n        }\n      },\n      sources: {\n        base: 'my-4 flex flex-wrap gap-3',\n        source: {\n          base: 'flex gap-2 border border-stroke-neutral-4 px-4 py-2 rounded-lg cursor-pointer',\n          companion: 'flex-1 px-3 py-1.5',\n          image: 'max-w-10 max-h-10 rounded-md w-full h-fit self-center',\n          title: 'text-md block',\n          url: 'text-sm text-buttons-colors-link-primary-text-resting underline'\n        }\n      },\n      markdown: {\n        copy: 'sticky py-1 [&>svg]:w-4 [&>svg]:h-4 opacity-50',\n        p: 'mb-2',\n        a: 'text-buttons-colors-link-primary-text-resting underline',\n        table: 'table-auto w-full m-2',\n        th: 'px-4 py-2 text-left font-bold border-b border-stroke-neutral-4',\n        td: 'px-4 py-2',\n        code: 'm-2 rounded-b relative',\n        toolbar:\n          'text-xs flex items-center justify-between px-2 py-1 rounded-t sticky top-0 backdrop-blur-md bg-gradient-neutral-500/50',\n        li: 'mb-2 ml-6',\n        ul: 'mb-4 list-disc',\n        ol: 'mb-4 list-decimal'\n      },\n      csvPreview: {\n        base: 'flex flex-col gap-2',\n        header: {\n          base: 'flex justify-between items-center gap-4',\n          icon: 'csv-icon flex items-center',\n          actions: 'csv-actions flex items-center gap-6'\n        },\n        tableContainer: 'flex justify-between',\n        dialog: {\n          base: 'fixed inset-0 bg-background-neutral-canvas-base/70 flex justify-center items-center z-50',\n          container:\n            'bg-background-neutral-canvas-base rounded-md w-11/12 h-5/6 overflow-auto'\n        }\n      },\n      footer: {\n        base: 'mt-3 flex gap-1.5',\n        copy: 'p-3 rounded-[10px] [&>svg]:size-4 opacity-50 hover:opacity-100!',\n        upvote:\n          'p-3 rounded-[10px] [&>svg]:size-4 opacity-50 hover:opacity-100!',\n        downvote:\n          'p-3 rounded-[10px] [&>svg]:size-4 opacity-50 hover:opacity-100!',\n        refresh:\n          'p-3 rounded-[10px] [&>svg]:size-4 opacity-50 hover:opacity-100!'\n      }\n    }\n  },\n  input: {\n    base: 'flex mt-4 relative',\n    upload:\n      'px-5 py-2 size-10 text-content-text-neutral-2 hover:text-content-text-neutral-base',\n    input:\n      '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',\n    actions: {\n      base: 'absolute flex gap-2 items-center right-2 inset-y-1/2 -translate-y-1/2 z-10',\n      send: 'px-3 py-3 hover:bg-primary-hover rounded-full size-8',\n      stop: 'px-2 py-2 bg-content-assets-semantic-error-base text-white rounded-full hover:bg-content-assets-semantic-error-1 size-8'\n    }\n  }\n}"
+          "value": "{\n  base: 'dark:text-white text-gray-500',\n  console: 'flex w-full gap-4 h-full',\n  companion: 'w-full h-full overflow-hidden',\n  empty: 'text-center flex-1',\n  appbar: 'flex p-5',\n  status: {\n    base: 'py-2 px-3 rounded-lg bg-gray-100/50 dark:bg-gray-800/30',\n    header: 'flex items-center gap-2',\n    icon: {\n      base: 'flex-shrink-0 w-4 h-4',\n      loading: 'text-blue-500 dark:text-blue-400',\n      complete: 'text-green-500 dark:text-green-400',\n      error: 'text-red-500 dark:text-red-400'\n    },\n    text: {\n      base: 'text-sm',\n      loading: 'text-gray-600 dark:text-gray-400',\n      complete: 'text-gray-600 dark:text-gray-400',\n      error: 'text-red-600 dark:text-red-400'\n    },\n    steps: {\n      base: 'mt-1 ml-6 space-y-0.5',\n      step: {\n        base: 'flex items-center gap-2',\n        icon: 'flex-shrink-0 w-3.5 h-3.5',\n        text: 'text-sm',\n        loading: 'text-gray-500 dark:text-gray-500',\n        complete: 'text-gray-500 dark:text-gray-500',\n        error: 'text-red-500 dark:text-red-400'\n      }\n    }\n  },\n  sessions: {\n    base: 'overflow-auto',\n    console:\n      'min-w-[150px] w-[30%] max-w-[300px] dark:bg-[#11111F] bg-[#F2F3F7] p-5 rounded-3xl',\n    companion: 'w-full h-full',\n    group:\n      'text-xs dart:text-gray-400 text-gray-700 mt-4 hover:bg-transparent mb-1',\n    create: 'relative mb-4 rounded-[10px] text-white',\n    session: {\n      base: [\n        'group my-1 rounded-[10px] p-2 text-gray-500 border border-transparent hover:bg-gray-300 hover:border-gray-400 [&_svg]:text-gray-500',\n        'dark:text-typography dark:text-gray-400 dark:hover:bg-gray-800/50 dark:hover:border-gray-700/50 dark:[&_svg]:text-gray-200'\n      ].join(' '),\n      active: [\n        'border border-gray-300 hover:border-gray-400 text-gray-700 bg-gray-200 hover:bg-gray-300 ',\n        'dark:text-gray-500 dark:bg-gray-800/70 dark:border-gray-700/50 dark:text-white dark:border-gray-700/70 dark:hover:bg-gray-800/50',\n        '[&_button]:opacity-100!'\n      ].join(' '),\n      delete: '[&>svg]:w-4 [&>svg]:h-4 opacity-0 group-hover:opacity-50!'\n    }\n  },\n  messages: {\n    base: '',\n    console: 'flex flex-col mx-5 flex-1 min-h-0',\n    companion: 'flex w-full h-full',\n    back: 'self-start p-0 my-2',\n    inner: 'flex-1 h-full flex flex-col',\n    title: ['text-base font-bold text-gray-500', 'dark:text-gray-200'].join(\n      ' '\n    ),\n    date: 'text-xs whitespace-nowrap text-gray-400',\n    content: [\n      'mt-2 flex-1 overflow-auto [&_hr]:bg-gray-200',\n      'dark:[&_hr]:bg-gray-800/60'\n    ].join(' '),\n    header: 'flex justify-between items-center gap-2',\n    showMore: 'mb-4',\n    message: {\n      base: 'mt-4 mb-4 flex flex-col p-0 rounded-sm border-none bg-transparent',\n      question: [\n        'relative font-semibold mb-4 px-4 py-4 pb-2 rounded-3xl rounded-br-none text-typography border bg-gray-200 border-gray-300 text-gray-900',\n        'dark:bg-gray-900/60 dark:border-gray-700/50 dark:text-gray-100'\n      ].join(' '),\n      response: [\n        'relative data-[compact=false]:px-4 text-gray-900',\n        'dark:text-gray-100'\n      ].join(' '),\n      overlay:\n        \"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 dark:after:to-gray-900 after:to-gray-200\",\n      cursor: 'inline-block w-1 h-4 bg-current',\n      expand: 'absolute bottom-1 right-1 z-10',\n      scrollToBottom: {\n        container: 'absolute bottom-2 left-1/2 transform -translate-x-1/2 z-10',\n        button: 'rounded-full p-2 shadow-lg'\n      },\n      files: {\n        base: 'mb-2 flex flex-wrap gap-3 ',\n        file: {\n          base: [\n            'flex items-center gap-2 border border-gray-300 px-3 py-2 rounded-lg cursor-pointer',\n            'dark:border-gray-700'\n          ].join(' '),\n          name: ['text-sm text-gray-500', 'dark:text-gray-200'].join(' ')\n        }\n      },\n      sources: {\n        base: 'my-4 flex flex-wrap gap-3',\n        source: {\n          base: [\n            'flex gap-2 border border-gray-200 px-4 py-2 rounded-lg cursor-pointer',\n            'dark:border-gray-700'\n          ].join(' '),\n          companion: 'flex-1 px-3 py-1.5',\n          image: 'max-w-10 max-h-10 rounded-md w-full h-fit self-center',\n          title: 'text-md block',\n          url: 'text-sm text-blue-400 underline'\n        }\n      },\n      markdown: {\n        copy: 'sticky py-1 [&>svg]:w-4 [&>svg]:h-4 opacity-50',\n        p: 'mb-2',\n        a: 'text-blue-400 underline',\n        table: 'table-auto w-full m-2',\n        th: 'px-4 py-2 text-left font-bold border-b border-gray-500',\n        td: 'px-4 py-2',\n        code: 'm-2 rounded-b relative',\n        toolbar:\n          'text-xs dark:bg-gray-700/50 flex items-center justify-between px-2 py-1 rounded-t sticky top-0 backdrop-blur-md bg-gray-200 ',\n        li: 'mb-2 ml-6',\n        ul: 'mb-4 list-disc',\n        ol: 'mb-4 list-decimal'\n      },\n      footer: {\n        base: 'mt-3 flex gap-1.5',\n        copy: [\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-200 hover:text-gray-500',\n          'dark:hover:bg-gray-800 dark:hover:text-white text-gray-400'\n        ].join(' '),\n        upvote:\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-700/40 hover:text-white text-gray-400',\n        downvote:\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-700/40 hover:text-white text-gray-400',\n        refresh:\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-700/40 hover:text-white text-gray-400'\n      }\n    }\n  },\n  input: {\n    base: 'flex mt-4 relative',\n    upload: ['px-5 py-2 text-gray-400 size-10', 'dark:gray-500'].join(' '),\n    input: [\n      'w-full border rounded-3xl px-3 py-2 pr-16 text-gray-500 border-gray-200 hover:bg-blue-100 hover:border-blue-500 after:hidden after:mx-10! bg-white [&>textarea]:w-full [&>textarea]:flex-none',\n      'dark:border-gray-700/50 dark:text-gray-200 dark:bg-gray-950 dark:hover:bg-blue-950/40'\n    ].join(' '),\n    actions: {\n      base: 'absolute flex gap-2 items-center right-5 inset-y-1/2 -translate-y-1/2 z-10',\n      send: [\n        'px-3 py-3 hover:bg-primary-hover rounded-full bg-gray-200 hover:bg-gray-300 text-gray-500',\n        'dark:text-white light:text-gray-500 dark:bg-gray-800 dark:hover:bg-gray-700'\n      ].join(' '),\n      stop: 'px-2 py-2 bg-red-500 text-white rounded-full hover:bg-red-700 '\n    },\n    popup: {\n      base: [\n        'bg-white border border-gray-200 rounded-lg shadow-lg overflow-hidden min-w-[200px] max-w-[300px]',\n        'dark:bg-gray-900 dark:border-gray-700'\n      ].join(' '),\n      content: 'overflow-y-auto max-h-[250px]',\n      item: [\n        'flex items-center gap-2 px-3 py-2 cursor-pointer transition-colors',\n        'hover:bg-gray-100 dark:hover:bg-gray-800'\n      ].join(' '),\n      itemHighlighted: 'bg-gray-100 dark:bg-gray-800',\n      itemIcon: [\n        'flex-shrink-0 w-5 h-5 text-gray-500 [&>svg]:w-full [&>svg]:h-full',\n        'dark:text-gray-400'\n      ].join(' '),\n      itemContent: 'flex flex-col min-w-0 flex-1',\n      itemLabel: [\n        'text-sm font-medium text-gray-900 truncate',\n        'dark:text-gray-100'\n      ].join(' '),\n      itemDescription: 'text-xs text-gray-500 dark:text-gray-400 truncate',\n      itemShortcut: 'text-xs text-gray-400 dark:text-gray-500 ml-auto',\n      empty: 'px-3 py-4 text-sm text-center text-gray-500 dark:text-gray-400',\n      loading: [\n        'flex items-center justify-center gap-2 px-3 py-4 text-gray-500',\n        'dark:text-gray-400'\n      ].join(' ')\n    },\n    tag: {\n      base: [\n        'inline-flex items-center px-1.5 py-0.5 mx-0.5 rounded',\n        'font-medium text-sm leading-[1.2] relative top-[1px]'\n      ].join(' '),\n      mention: [\n        'bg-blue-100 dark:bg-blue-900/30',\n        'text-blue-700 dark:text-blue-300'\n      ].join(' '),\n      command: [\n        'bg-purple-100 dark:bg-purple-900/30',\n        'text-purple-700 dark:text-purple-300'\n      ].join(' ')\n    },\n    editor: {\n      base: [\n        'outline-none w-full overflow-y-auto',\n        'text-inherit font-inherit',\n        '[&_.tiptap-paragraph]:m-0'\n      ].join(' '),\n      container: 'px-3 py-2 pr-16',\n      placeholder: [\n        '[&_.is-editor-empty]:before:content-[attr(data-placeholder)]',\n        '[&_.is-editor-empty]:before:text-gray-400',\n        '[&_.is-editor-empty]:before:dark:text-gray-500',\n        '[&_.is-editor-empty]:before:float-left',\n        '[&_.is-editor-empty]:before:h-0',\n        '[&_.is-editor-empty]:before:pointer-events-none'\n      ].join(' ')\n    }\n  },\n  suggestions: {\n    base: 'flex flex-wrap gap-2 mt-4',\n    item: {\n      base: [\n        'rounded-full! max-w-full py-2 px-4',\n        'bg-gray-100 border-gray-200 hover:bg-gray-200 hover:border-gray-300 text-gray-700',\n        'dark:bg-gray-800/50 dark:border-gray-700 dark:hover:bg-gray-700/70 dark:hover:border-gray-600 dark:text-gray-200',\n        '[&>svg]:w-4 [&>svg]:h-4 [&>svg]:text-blue-500 [&>svg]:dark:text-blue-400 [&>svg]:flex-shrink-0'\n      ].join(' '),\n      icon: 'w-4 h-4 text-blue-500 dark:text-blue-400 flex-shrink-0',\n      text: 'text-sm truncate'\n    }\n  },\n  chart: {\n    base: 'my-6',\n    title: 'text-sm font-medium mb-2 text-gray-600 dark:text-gray-400',\n    content: 'flex items-center justify-center',\n    error: {\n      base: [\n        'my-4 p-4 border rounded',\n        'border-red-300 bg-red-50 text-red-500',\n        'dark:border-red-700 dark:bg-red-900/20'\n      ].join(' '),\n      title: 'text-red-600 dark:text-red-400 text-sm font-medium mb-2',\n      code: 'text-xs overflow-auto'\n    },\n    warning: {\n      base: [\n        'my-4 p-4 border rounded',\n        'border-yellow-300 bg-yellow-50 text-yellow-600',\n        'dark:border-yellow-700 dark:bg-yellow-900/20 dark:text-yellow-400'\n      ].join(' '),\n      title: 'text-yellow-600 dark:text-yellow-400 text-sm font-medium mb-2'\n    }\n  }\n}"
         },
         "description": "Custom theme for the chat.",
         "name": "theme",
@@ -142,7 +142,26 @@
         ],
         "required": false,
         "type": {
-          "name": "Plugin[]"
+          "name": "Plugin<[], Node, Node>[]"
+        }
+      },
+      "markdownComponents": {
+        "defaultValue": null,
+        "description": "Custom markdown components to override default rendering.\nUse this to add support for custom elements like charts.",
+        "name": "markdownComponents",
+        "parent": {
+          "fileName": "src/Chat.tsx",
+          "name": "ChatProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Chat.tsx",
+            "name": "ChatProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "Components"
         }
       },
       "isLoading": {
@@ -327,7 +346,7 @@
       },
       "theme": {
         "defaultValue": {
-          "value": "{\n  base: 'text-content-text-neutral-base',\n  console: 'flex w-full gap-4 h-full',\n  companion: 'w-full h-full overflow-hidden',\n  empty: 'text-center flex-1',\n  appbar: 'flex p-5',\n  sessions: {\n    base: 'overflow-auto',\n    console:\n      'min-w-[150px] w-[30%] max-w-[300px] bg-gradient-neutral-200 p-5 rounded-3xl',\n    companion: 'w-full h-full',\n    group: 'text-xs text-content-text-neutral-3 mt-4 hover:bg-transparent mb-1',\n    create: 'relative mb-4 rounded-[10px] text-white',\n    session: {\n      base: 'group my-1 rounded-[10px] p-2 text-content-text-neutral-1 border border-transparent',\n      active:\n        'border-select-menu-items-color-item-stroke-row-hover [&_button]:opacity-100!',\n      delete: '[&>svg]:w-4 [&>svg]:h-4 opacity-0 group-hover:opacity-50!'\n    }\n  },\n  messages: {\n    base: '',\n    console: 'flex flex-col mx-5 flex-1 overflow-hidden',\n    companion: 'flex w-full h-full',\n    back: 'self-start pl-0 my-2 ',\n    inner: 'flex-1 h-full flex flex-col',\n    title: 'text-base font-bold',\n    date: 'text-xs whitespace-nowrap text-content-text-neutral-2',\n    content: 'mt-2 flex-1 overflow-auto',\n    header: 'flex justify-between items-center gap-2',\n    showMore: 'mb-4',\n    message: {\n      base: 'mt-4 mb-4 flex flex-col p-0 rounded-sm border-none bg-transparent',\n      question:\n        '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)',\n      response:\n        'relative data-[compact=false]:px-4 text-content-text-neutral-base',\n      overlay:\n        \"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\",\n      cursor: 'inline-block w-1 h-4 bg-current',\n      expand: 'absolute bottom-0 right-1 z-10',\n      files: {\n        base: 'mb-2 flex flex-wrap gap-3 ',\n        file: {\n          base: 'flex items-center gap-2 border border-stroke-neutral-4 px-3 py-2 rounded-lg cursor-pointer',\n          name: 'text-sm text-content-text-neutral-4'\n        }\n      },\n      sources: {\n        base: 'my-4 flex flex-wrap gap-3',\n        source: {\n          base: 'flex gap-2 border border-stroke-neutral-4 px-4 py-2 rounded-lg cursor-pointer',\n          companion: 'flex-1 px-3 py-1.5',\n          image: 'max-w-10 max-h-10 rounded-md w-full h-fit self-center',\n          title: 'text-md block',\n          url: 'text-sm text-buttons-colors-link-primary-text-resting underline'\n        }\n      },\n      markdown: {\n        copy: 'sticky py-1 [&>svg]:w-4 [&>svg]:h-4 opacity-50',\n        p: 'mb-2',\n        a: 'text-buttons-colors-link-primary-text-resting underline',\n        table: 'table-auto w-full m-2',\n        th: 'px-4 py-2 text-left font-bold border-b border-stroke-neutral-4',\n        td: 'px-4 py-2',\n        code: 'm-2 rounded-b relative',\n        toolbar:\n          'text-xs flex items-center justify-between px-2 py-1 rounded-t sticky top-0 backdrop-blur-md bg-gradient-neutral-500/50',\n        li: 'mb-2 ml-6',\n        ul: 'mb-4 list-disc',\n        ol: 'mb-4 list-decimal'\n      },\n      csvPreview: {\n        base: 'flex flex-col gap-2',\n        header: {\n          base: 'flex justify-between items-center gap-4',\n          icon: 'csv-icon flex items-center',\n          actions: 'csv-actions flex items-center gap-6'\n        },\n        tableContainer: 'flex justify-between',\n        dialog: {\n          base: 'fixed inset-0 bg-background-neutral-canvas-base/70 flex justify-center items-center z-50',\n          container:\n            'bg-background-neutral-canvas-base rounded-md w-11/12 h-5/6 overflow-auto'\n        }\n      },\n      footer: {\n        base: 'mt-3 flex gap-1.5',\n        copy: 'p-3 rounded-[10px] [&>svg]:size-4 opacity-50 hover:opacity-100!',\n        upvote:\n          'p-3 rounded-[10px] [&>svg]:size-4 opacity-50 hover:opacity-100!',\n        downvote:\n          'p-3 rounded-[10px] [&>svg]:size-4 opacity-50 hover:opacity-100!',\n        refresh:\n          'p-3 rounded-[10px] [&>svg]:size-4 opacity-50 hover:opacity-100!'\n      }\n    }\n  },\n  input: {\n    base: 'flex mt-4 relative',\n    upload:\n      'px-5 py-2 size-10 text-content-text-neutral-2 hover:text-content-text-neutral-base',\n    input:\n      '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',\n    actions: {\n      base: 'absolute flex gap-2 items-center right-2 inset-y-1/2 -translate-y-1/2 z-10',\n      send: 'px-3 py-3 hover:bg-primary-hover rounded-full size-8',\n      stop: 'px-2 py-2 bg-content-assets-semantic-error-base text-white rounded-full hover:bg-content-assets-semantic-error-1 size-8'\n    }\n  }\n}"
+          "value": "{\n  base: 'dark:text-white text-gray-500',\n  console: 'flex w-full gap-4 h-full',\n  companion: 'w-full h-full overflow-hidden',\n  empty: 'text-center flex-1',\n  appbar: 'flex p-5',\n  status: {\n    base: 'py-2 px-3 rounded-lg bg-gray-100/50 dark:bg-gray-800/30',\n    header: 'flex items-center gap-2',\n    icon: {\n      base: 'flex-shrink-0 w-4 h-4',\n      loading: 'text-blue-500 dark:text-blue-400',\n      complete: 'text-green-500 dark:text-green-400',\n      error: 'text-red-500 dark:text-red-400'\n    },\n    text: {\n      base: 'text-sm',\n      loading: 'text-gray-600 dark:text-gray-400',\n      complete: 'text-gray-600 dark:text-gray-400',\n      error: 'text-red-600 dark:text-red-400'\n    },\n    steps: {\n      base: 'mt-1 ml-6 space-y-0.5',\n      step: {\n        base: 'flex items-center gap-2',\n        icon: 'flex-shrink-0 w-3.5 h-3.5',\n        text: 'text-sm',\n        loading: 'text-gray-500 dark:text-gray-500',\n        complete: 'text-gray-500 dark:text-gray-500',\n        error: 'text-red-500 dark:text-red-400'\n      }\n    }\n  },\n  sessions: {\n    base: 'overflow-auto',\n    console:\n      'min-w-[150px] w-[30%] max-w-[300px] dark:bg-[#11111F] bg-[#F2F3F7] p-5 rounded-3xl',\n    companion: 'w-full h-full',\n    group:\n      'text-xs dart:text-gray-400 text-gray-700 mt-4 hover:bg-transparent mb-1',\n    create: 'relative mb-4 rounded-[10px] text-white',\n    session: {\n      base: [\n        'group my-1 rounded-[10px] p-2 text-gray-500 border border-transparent hover:bg-gray-300 hover:border-gray-400 [&_svg]:text-gray-500',\n        'dark:text-typography dark:text-gray-400 dark:hover:bg-gray-800/50 dark:hover:border-gray-700/50 dark:[&_svg]:text-gray-200'\n      ].join(' '),\n      active: [\n        'border border-gray-300 hover:border-gray-400 text-gray-700 bg-gray-200 hover:bg-gray-300 ',\n        'dark:text-gray-500 dark:bg-gray-800/70 dark:border-gray-700/50 dark:text-white dark:border-gray-700/70 dark:hover:bg-gray-800/50',\n        '[&_button]:opacity-100!'\n      ].join(' '),\n      delete: '[&>svg]:w-4 [&>svg]:h-4 opacity-0 group-hover:opacity-50!'\n    }\n  },\n  messages: {\n    base: '',\n    console: 'flex flex-col mx-5 flex-1 min-h-0',\n    companion: 'flex w-full h-full',\n    back: 'self-start p-0 my-2',\n    inner: 'flex-1 h-full flex flex-col',\n    title: ['text-base font-bold text-gray-500', 'dark:text-gray-200'].join(\n      ' '\n    ),\n    date: 'text-xs whitespace-nowrap text-gray-400',\n    content: [\n      'mt-2 flex-1 overflow-auto [&_hr]:bg-gray-200',\n      'dark:[&_hr]:bg-gray-800/60'\n    ].join(' '),\n    header: 'flex justify-between items-center gap-2',\n    showMore: 'mb-4',\n    message: {\n      base: 'mt-4 mb-4 flex flex-col p-0 rounded-sm border-none bg-transparent',\n      question: [\n        'relative font-semibold mb-4 px-4 py-4 pb-2 rounded-3xl rounded-br-none text-typography border bg-gray-200 border-gray-300 text-gray-900',\n        'dark:bg-gray-900/60 dark:border-gray-700/50 dark:text-gray-100'\n      ].join(' '),\n      response: [\n        'relative data-[compact=false]:px-4 text-gray-900',\n        'dark:text-gray-100'\n      ].join(' '),\n      overlay:\n        \"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 dark:after:to-gray-900 after:to-gray-200\",\n      cursor: 'inline-block w-1 h-4 bg-current',\n      expand: 'absolute bottom-1 right-1 z-10',\n      scrollToBottom: {\n        container: 'absolute bottom-2 left-1/2 transform -translate-x-1/2 z-10',\n        button: 'rounded-full p-2 shadow-lg'\n      },\n      files: {\n        base: 'mb-2 flex flex-wrap gap-3 ',\n        file: {\n          base: [\n            'flex items-center gap-2 border border-gray-300 px-3 py-2 rounded-lg cursor-pointer',\n            'dark:border-gray-700'\n          ].join(' '),\n          name: ['text-sm text-gray-500', 'dark:text-gray-200'].join(' ')\n        }\n      },\n      sources: {\n        base: 'my-4 flex flex-wrap gap-3',\n        source: {\n          base: [\n            'flex gap-2 border border-gray-200 px-4 py-2 rounded-lg cursor-pointer',\n            'dark:border-gray-700'\n          ].join(' '),\n          companion: 'flex-1 px-3 py-1.5',\n          image: 'max-w-10 max-h-10 rounded-md w-full h-fit self-center',\n          title: 'text-md block',\n          url: 'text-sm text-blue-400 underline'\n        }\n      },\n      markdown: {\n        copy: 'sticky py-1 [&>svg]:w-4 [&>svg]:h-4 opacity-50',\n        p: 'mb-2',\n        a: 'text-blue-400 underline',\n        table: 'table-auto w-full m-2',\n        th: 'px-4 py-2 text-left font-bold border-b border-gray-500',\n        td: 'px-4 py-2',\n        code: 'm-2 rounded-b relative',\n        toolbar:\n          'text-xs dark:bg-gray-700/50 flex items-center justify-between px-2 py-1 rounded-t sticky top-0 backdrop-blur-md bg-gray-200 ',\n        li: 'mb-2 ml-6',\n        ul: 'mb-4 list-disc',\n        ol: 'mb-4 list-decimal'\n      },\n      footer: {\n        base: 'mt-3 flex gap-1.5',\n        copy: [\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-200 hover:text-gray-500',\n          'dark:hover:bg-gray-800 dark:hover:text-white text-gray-400'\n        ].join(' '),\n        upvote:\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-700/40 hover:text-white text-gray-400',\n        downvote:\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-700/40 hover:text-white text-gray-400',\n        refresh:\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-700/40 hover:text-white text-gray-400'\n      }\n    }\n  },\n  input: {\n    base: 'flex mt-4 relative',\n    upload: ['px-5 py-2 text-gray-400 size-10', 'dark:gray-500'].join(' '),\n    input: [\n      'w-full border rounded-3xl px-3 py-2 pr-16 text-gray-500 border-gray-200 hover:bg-blue-100 hover:border-blue-500 after:hidden after:mx-10! bg-white [&>textarea]:w-full [&>textarea]:flex-none',\n      'dark:border-gray-700/50 dark:text-gray-200 dark:bg-gray-950 dark:hover:bg-blue-950/40'\n    ].join(' '),\n    actions: {\n      base: 'absolute flex gap-2 items-center right-5 inset-y-1/2 -translate-y-1/2 z-10',\n      send: [\n        'px-3 py-3 hover:bg-primary-hover rounded-full bg-gray-200 hover:bg-gray-300 text-gray-500',\n        'dark:text-white light:text-gray-500 dark:bg-gray-800 dark:hover:bg-gray-700'\n      ].join(' '),\n      stop: 'px-2 py-2 bg-red-500 text-white rounded-full hover:bg-red-700 '\n    },\n    popup: {\n      base: [\n        'bg-white border border-gray-200 rounded-lg shadow-lg overflow-hidden min-w-[200px] max-w-[300px]',\n        'dark:bg-gray-900 dark:border-gray-700'\n      ].join(' '),\n      content: 'overflow-y-auto max-h-[250px]',\n      item: [\n        'flex items-center gap-2 px-3 py-2 cursor-pointer transition-colors',\n        'hover:bg-gray-100 dark:hover:bg-gray-800'\n      ].join(' '),\n      itemHighlighted: 'bg-gray-100 dark:bg-gray-800',\n      itemIcon: [\n        'flex-shrink-0 w-5 h-5 text-gray-500 [&>svg]:w-full [&>svg]:h-full',\n        'dark:text-gray-400'\n      ].join(' '),\n      itemContent: 'flex flex-col min-w-0 flex-1',\n      itemLabel: [\n        'text-sm font-medium text-gray-900 truncate',\n        'dark:text-gray-100'\n      ].join(' '),\n      itemDescription: 'text-xs text-gray-500 dark:text-gray-400 truncate',\n      itemShortcut: 'text-xs text-gray-400 dark:text-gray-500 ml-auto',\n      empty: 'px-3 py-4 text-sm text-center text-gray-500 dark:text-gray-400',\n      loading: [\n        'flex items-center justify-center gap-2 px-3 py-4 text-gray-500',\n        'dark:text-gray-400'\n      ].join(' ')\n    },\n    tag: {\n      base: [\n        'inline-flex items-center px-1.5 py-0.5 mx-0.5 rounded',\n        'font-medium text-sm leading-[1.2] relative top-[1px]'\n      ].join(' '),\n      mention: [\n        'bg-blue-100 dark:bg-blue-900/30',\n        'text-blue-700 dark:text-blue-300'\n      ].join(' '),\n      command: [\n        'bg-purple-100 dark:bg-purple-900/30',\n        'text-purple-700 dark:text-purple-300'\n      ].join(' ')\n    },\n    editor: {\n      base: [\n        'outline-none w-full overflow-y-auto',\n        'text-inherit font-inherit',\n        '[&_.tiptap-paragraph]:m-0'\n      ].join(' '),\n      container: 'px-3 py-2 pr-16',\n      placeholder: [\n        '[&_.is-editor-empty]:before:content-[attr(data-placeholder)]',\n        '[&_.is-editor-empty]:before:text-gray-400',\n        '[&_.is-editor-empty]:before:dark:text-gray-500',\n        '[&_.is-editor-empty]:before:float-left',\n        '[&_.is-editor-empty]:before:h-0',\n        '[&_.is-editor-empty]:before:pointer-events-none'\n      ].join(' ')\n    }\n  },\n  suggestions: {\n    base: 'flex flex-wrap gap-2 mt-4',\n    item: {\n      base: [\n        'rounded-full! max-w-full py-2 px-4',\n        'bg-gray-100 border-gray-200 hover:bg-gray-200 hover:border-gray-300 text-gray-700',\n        'dark:bg-gray-800/50 dark:border-gray-700 dark:hover:bg-gray-700/70 dark:hover:border-gray-600 dark:text-gray-200',\n        '[&>svg]:w-4 [&>svg]:h-4 [&>svg]:text-blue-500 [&>svg]:dark:text-blue-400 [&>svg]:flex-shrink-0'\n      ].join(' '),\n      icon: 'w-4 h-4 text-blue-500 dark:text-blue-400 flex-shrink-0',\n      text: 'text-sm truncate'\n    }\n  },\n  chart: {\n    base: 'my-6',\n    title: 'text-sm font-medium mb-2 text-gray-600 dark:text-gray-400',\n    content: 'flex items-center justify-center',\n    error: {\n      base: [\n        'my-4 p-4 border rounded',\n        'border-red-300 bg-red-50 text-red-500',\n        'dark:border-red-700 dark:bg-red-900/20'\n      ].join(' '),\n      title: 'text-red-600 dark:text-red-400 text-sm font-medium mb-2',\n      code: 'text-xs overflow-auto'\n    },\n    warning: {\n      base: [\n        'my-4 p-4 border rounded',\n        'border-yellow-300 bg-yellow-50 text-yellow-600',\n        'dark:border-yellow-700 dark:bg-yellow-900/20 dark:text-yellow-400'\n      ].join(' '),\n      title: 'text-yellow-600 dark:text-yellow-400 text-sm font-medium mb-2'\n    }\n  }\n}"
         },
         "description": "Custom theme for the appbar",
         "name": "theme",
@@ -502,7 +521,9 @@
         }
       },
       "placeholder": {
-        "defaultValue": null,
+        "defaultValue": {
+          "value": "Type a message..."
+        },
         "description": "Placeholder text for the input field.",
         "name": "placeholder",
         "parent": {
@@ -581,10 +602,10 @@
           "name": "ReactElement<any, string | JSXElementConstructor<any>>"
         }
       },
-      "message": {
+      "mentions": {
         "defaultValue": null,
-        "description": "Message to be displayed in the input field.",
-        "name": "message",
+        "description": "Configuration for mentions (@user).\nProvide items or an onSearch function to enable mentions.",
+        "name": "mentions",
         "parent": {
           "fileName": "src/ChatInput/ChatInput.tsx",
           "name": "ChatInputProps"
@@ -597,13 +618,13 @@
         ],
         "required": false,
         "type": {
-          "name": "string"
+          "name": "SuggestionConfig<MentionItem>"
         }
       },
-      "className": {
+      "commands": {
         "defaultValue": null,
-        "description": "Class name to apply to the container.",
-        "name": "className",
+        "description": "Configuration for commands (/command).\nProvide items or an onSearch function to enable commands.",
+        "name": "commands",
         "parent": {
           "fileName": "src/ChatInput/ChatInput.tsx",
           "name": "ChatInputProps"
@@ -616,13 +637,15 @@
         ],
         "required": false,
         "type": {
-          "name": "string"
+          "name": "SuggestionConfig<SlashCommandItem>"
         }
       },
-      "onMessageChange": {
-        "defaultValue": null,
-        "description": "Callback function to handle message change.",
-        "name": "onMessageChange",
+      "minHeight": {
+        "defaultValue": {
+          "value": "24"
+        },
+        "description": "Minimum height for the input (default: 24px)",
+        "name": "minHeight",
         "parent": {
           "fileName": "src/ChatInput/ChatInput.tsx",
           "name": "ChatInputProps"
@@ -635,7 +658,49 @@
         ],
         "required": false,
         "type": {
-          "name": "(message: string) => void"
+          "name": "number"
+        }
+      },
+      "maxHeight": {
+        "defaultValue": {
+          "value": "200"
+        },
+        "description": "Maximum height for the input (default: 200px)",
+        "name": "maxHeight",
+        "parent": {
+          "fileName": "src/ChatInput/ChatInput.tsx",
+          "name": "ChatInputProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/ChatInput.tsx",
+            "name": "ChatInputProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "autoFocus": {
+        "defaultValue": {
+          "value": "true"
+        },
+        "description": "Whether to auto-focus the input on mount (default: true)",
+        "name": "autoFocus",
+        "parent": {
+          "fileName": "src/ChatInput/ChatInput.tsx",
+          "name": "ChatInputProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/ChatInput.tsx",
+            "name": "ChatInputProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "boolean"
         }
       }
     }
@@ -748,23 +813,211 @@
   },
   {
     "tags": {},
-    "filePath": "src/Markdown/CodeHighlighter.tsx",
+    "filePath": "src/ChatInput/MentionList.tsx",
     "description": "",
-    "displayName": "CodeHighlighter",
+    "displayName": "MentionList",
+    "methods": [],
+    "props": {
+      "items": {
+        "defaultValue": null,
+        "description": "List of suggestion items to display",
+        "name": "items",
+        "parent": {
+          "fileName": "src/ChatInput/MentionList.tsx",
+          "name": "MentionListProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/MentionList.tsx",
+            "name": "MentionListProps"
+          }
+        ],
+        "required": true,
+        "type": {
+          "name": "SuggestionItem[]"
+        }
+      },
+      "command": {
+        "defaultValue": null,
+        "description": "Callback to execute the selected suggestion command",
+        "name": "command",
+        "parent": {
+          "fileName": "src/ChatInput/MentionList.tsx",
+          "name": "MentionListProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/MentionList.tsx",
+            "name": "MentionListProps"
+          }
+        ],
+        "required": true,
+        "type": {
+          "name": "(item: { id: string; label: string; }) => void"
+        }
+      },
+      "triggerChar": {
+        "defaultValue": null,
+        "description": "The trigger character (e.g., '@' or '/')",
+        "name": "triggerChar",
+        "parent": {
+          "fileName": "src/ChatInput/MentionList.tsx",
+          "name": "MentionListProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/MentionList.tsx",
+            "name": "MentionListProps"
+          }
+        ],
+        "required": true,
+        "type": {
+          "name": "string"
+        }
+      },
+      "config": {
+        "defaultValue": null,
+        "description": "Configuration for the suggestion popup",
+        "name": "config",
+        "parent": {
+          "fileName": "src/ChatInput/MentionList.tsx",
+          "name": "MentionListProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/MentionList.tsx",
+            "name": "MentionListProps"
+          }
+        ],
+        "required": true,
+        "type": {
+          "name": "SuggestionConfig<SuggestionItem>"
+        }
+      },
+      "query": {
+        "defaultValue": null,
+        "description": "Current search query text",
+        "name": "query",
+        "parent": {
+          "fileName": "src/ChatInput/MentionList.tsx",
+          "name": "MentionListProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/MentionList.tsx",
+            "name": "MentionListProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      }
+    }
+  },
+  {
+    "tags": {},
+    "filePath": "src/ChatInput/RichTextInput.tsx",
+    "description": "",
+    "displayName": "RichTextInput",
     "methods": [],
     "props": {
+      "value": {
+        "defaultValue": {
+          "value": ""
+        },
+        "description": "Current value of the input",
+        "name": "value",
+        "parent": {
+          "fileName": "src/ChatInput/RichTextInput.tsx",
+          "name": "RichTextInputProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/RichTextInput.tsx",
+            "name": "RichTextInputProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "placeholder": {
+        "defaultValue": {
+          "value": "Type a message..."
+        },
+        "description": "Placeholder text when empty",
+        "name": "placeholder",
+        "parent": {
+          "fileName": "src/ChatInput/RichTextInput.tsx",
+          "name": "RichTextInputProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/RichTextInput.tsx",
+            "name": "RichTextInputProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "disabled": {
+        "defaultValue": {
+          "value": "false"
+        },
+        "description": "Whether the input is disabled",
+        "name": "disabled",
+        "parent": {
+          "fileName": "src/ChatInput/RichTextInput.tsx",
+          "name": "RichTextInputProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/RichTextInput.tsx",
+            "name": "RichTextInputProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
+      "autoFocus": {
+        "defaultValue": {
+          "value": "true"
+        },
+        "description": "Whether to auto-focus on mount (default: true)",
+        "name": "autoFocus",
+        "parent": {
+          "fileName": "src/ChatInput/RichTextInput.tsx",
+          "name": "RichTextInputProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/RichTextInput.tsx",
+            "name": "RichTextInputProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
       "className": {
         "defaultValue": null,
-        "description": "The class name to apply to the code block.",
+        "description": "Additional CSS classes",
         "name": "className",
         "parent": {
-          "fileName": "src/Markdown/CodeHighlighter.tsx",
-          "name": "CodeHighlighterProps"
+          "fileName": "src/ChatInput/RichTextInput.tsx",
+          "name": "RichTextInputProps"
         },
         "declarations": [
           {
-            "fileName": "src/Markdown/CodeHighlighter.tsx",
-            "name": "CodeHighlighterProps"
+            "fileName": "src/ChatInput/RichTextInput.tsx",
+            "name": "RichTextInputProps"
           }
         ],
         "required": false,
@@ -772,199 +1025,696 @@
           "name": "string"
         }
       },
-      "language": {
+      "minHeight": {
+        "defaultValue": {
+          "value": "24"
+        },
+        "description": "Minimum height in pixels (default: 24)",
+        "name": "minHeight",
+        "parent": {
+          "fileName": "src/ChatInput/RichTextInput.tsx",
+          "name": "RichTextInputProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/RichTextInput.tsx",
+            "name": "RichTextInputProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "maxHeight": {
+        "defaultValue": {
+          "value": "200"
+        },
+        "description": "Maximum height in pixels (default: 200)",
+        "name": "maxHeight",
+        "parent": {
+          "fileName": "src/ChatInput/RichTextInput.tsx",
+          "name": "RichTextInputProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/RichTextInput.tsx",
+            "name": "RichTextInputProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "mentions": {
         "defaultValue": null,
-        "description": "The language of the code block.",
-        "name": "language",
+        "description": "Configuration for @ mentions",
+        "name": "mentions",
         "parent": {
-          "fileName": "src/Markdown/CodeHighlighter.tsx",
-          "name": "CodeHighlighterProps"
+          "fileName": "src/ChatInput/RichTextInput.tsx",
+          "name": "RichTextInputProps"
         },
         "declarations": [
           {
-            "fileName": "src/Markdown/CodeHighlighter.tsx",
-            "name": "CodeHighlighterProps"
+            "fileName": "src/ChatInput/RichTextInput.tsx",
+            "name": "RichTextInputProps"
           }
         ],
         "required": false,
         "type": {
-          "name": "string"
+          "name": "SuggestionConfig<SuggestionItem>"
         }
       },
-      "copyClassName": {
+      "commands": {
         "defaultValue": null,
-        "description": "The class name to apply to the copy button.",
-        "name": "copyClassName",
+        "description": "Configuration for / slash commands",
+        "name": "commands",
         "parent": {
-          "fileName": "src/Markdown/CodeHighlighter.tsx",
-          "name": "CodeHighlighterProps"
+          "fileName": "src/ChatInput/RichTextInput.tsx",
+          "name": "RichTextInputProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/RichTextInput.tsx",
+            "name": "RichTextInputProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "SuggestionConfig<SuggestionItem>"
+        }
+      },
+      "onSubmit": {
+        "defaultValue": null,
+        "description": "Callback when user submits (presses Enter)",
+        "name": "onSubmit",
+        "parent": {
+          "fileName": "src/ChatInput/RichTextInput.tsx",
+          "name": "RichTextInputProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/RichTextInput.tsx",
+            "name": "RichTextInputProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "(value: string) => void"
+        }
+      },
+      "onChange": {
+        "defaultValue": null,
+        "description": "Callback when input value changes",
+        "name": "onChange",
+        "parent": {
+          "fileName": "src/ChatInput/RichTextInput.tsx",
+          "name": "RichTextInputProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/RichTextInput.tsx",
+            "name": "RichTextInputProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "(value: string) => void"
+        }
+      }
+    }
+  },
+  {
+    "tags": {},
+    "filePath": "src/ChatSuggestions/ChatSuggestion.tsx",
+    "description": "",
+    "displayName": "ChatSuggestion",
+    "methods": [],
+    "props": {
+      "onClick": {
+        "defaultValue": null,
+        "description": "Callback when the suggestion is clicked.",
+        "name": "onClick",
+        "parent": {
+          "fileName": "src/ChatSuggestions/ChatSuggestion.tsx",
+          "name": "ChatSuggestionProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatSuggestions/ChatSuggestion.tsx",
+            "name": "ChatSuggestionProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "(suggestion: string) => void"
+        }
+      },
+      "id": {
+        "defaultValue": null,
+        "description": "Unique identifier for the suggestion",
+        "name": "id",
+        "parent": {
+          "fileName": "reachat/src/types.ts",
+          "name": "Suggestion"
+        },
+        "declarations": [
+          {
+            "fileName": "reachat/src/types.ts",
+            "name": "Suggestion"
+          }
+        ],
+        "required": true,
+        "type": {
+          "name": "string"
+        }
+      },
+      "content": {
+        "defaultValue": null,
+        "description": "The display text for the suggestion",
+        "name": "content",
+        "parent": {
+          "fileName": "reachat/src/types.ts",
+          "name": "Suggestion"
+        },
+        "declarations": [
+          {
+            "fileName": "reachat/src/types.ts",
+            "name": "Suggestion"
+          }
+        ],
+        "required": true,
+        "type": {
+          "name": "string"
+        }
+      }
+    }
+  },
+  {
+    "tags": {},
+    "filePath": "src/ChatSuggestions/ChatSuggestions.tsx",
+    "description": "",
+    "displayName": "ChatSuggestions",
+    "methods": [],
+    "props": {
+      "suggestions": {
+        "defaultValue": null,
+        "description": "Array of suggestions to display.",
+        "name": "suggestions",
+        "parent": {
+          "fileName": "src/ChatSuggestions/ChatSuggestions.tsx",
+          "name": "ChatSuggestionsProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatSuggestions/ChatSuggestions.tsx",
+            "name": "ChatSuggestionsProps"
+          }
+        ],
+        "required": true,
+        "type": {
+          "name": "Suggestion[]"
+        }
+      },
+      "className": {
+        "defaultValue": null,
+        "description": "Custom class name to apply to the container.",
+        "name": "className",
+        "parent": {
+          "fileName": "src/ChatSuggestions/ChatSuggestions.tsx",
+          "name": "ChatSuggestionsProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatSuggestions/ChatSuggestions.tsx",
+            "name": "ChatSuggestionsProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "onSuggestionClick": {
+        "defaultValue": null,
+        "description": "Callback when a suggestion is clicked.",
+        "name": "onSuggestionClick",
+        "parent": {
+          "fileName": "src/ChatSuggestions/ChatSuggestions.tsx",
+          "name": "ChatSuggestionsProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatSuggestions/ChatSuggestions.tsx",
+            "name": "ChatSuggestionsProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "(suggestion: string) => void"
+        }
+      },
+      "children": {
+        "defaultValue": null,
+        "description": "Custom render function for each suggestion item.\nReceives the suggestion data and onClick handler.",
+        "name": "children",
+        "parent": {
+          "fileName": "src/ChatSuggestions/ChatSuggestions.tsx",
+          "name": "ChatSuggestionsProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatSuggestions/ChatSuggestions.tsx",
+            "name": "ChatSuggestionsProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "ReactElement<any, string | JSXElementConstructor<any>>"
+        }
+      }
+    }
+  },
+  {
+    "tags": {},
+    "filePath": "src/Markdown/CodeHighlighter.tsx",
+    "description": "",
+    "displayName": "CodeHighlighter",
+    "methods": [],
+    "props": {
+      "className": {
+        "defaultValue": null,
+        "description": "The class name to apply to the code block.",
+        "name": "className",
+        "parent": {
+          "fileName": "src/Markdown/CodeHighlighter.tsx",
+          "name": "CodeHighlighterProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Markdown/CodeHighlighter.tsx",
+            "name": "CodeHighlighterProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "language": {
+        "defaultValue": null,
+        "description": "The language of the code block.",
+        "name": "language",
+        "parent": {
+          "fileName": "src/Markdown/CodeHighlighter.tsx",
+          "name": "CodeHighlighterProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Markdown/CodeHighlighter.tsx",
+            "name": "CodeHighlighterProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "copyClassName": {
+        "defaultValue": null,
+        "description": "The class name to apply to the copy button.",
+        "name": "copyClassName",
+        "parent": {
+          "fileName": "src/Markdown/CodeHighlighter.tsx",
+          "name": "CodeHighlighterProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Markdown/CodeHighlighter.tsx",
+            "name": "CodeHighlighterProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "toolbarClassName": {
+        "defaultValue": null,
+        "description": "The class name to apply to the toolbar.",
+        "name": "toolbarClassName",
+        "parent": {
+          "fileName": "src/Markdown/CodeHighlighter.tsx",
+          "name": "CodeHighlighterProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Markdown/CodeHighlighter.tsx",
+            "name": "CodeHighlighterProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "copyIcon": {
+        "defaultValue": {
+          "value": "<CopyIcon />"
+        },
+        "description": "Icon to show for copy.",
+        "name": "copyIcon",
+        "parent": {
+          "fileName": "src/Markdown/CodeHighlighter.tsx",
+          "name": "CodeHighlighterProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Markdown/CodeHighlighter.tsx",
+            "name": "CodeHighlighterProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "ReactElement<any, string | JSXElementConstructor<any>>"
+        }
+      },
+      "theme": {
+        "defaultValue": {
+          "value": "{\n  'code[class*=\"language-\"]': {\n    'background': '#11111f',\n    'color': '#e2e8f0',\n    'textShadow': '0 1px rgba(0, 0, 0, 0.3)',\n    'fontFamily': '\"Fira Code\", \"Fira Mono\", Menlo, Consolas, \"DejaVu Sans Mono\", monospace',\n    'direction': 'ltr',\n    'textAlign': 'left',\n    'whiteSpace': 'pre',\n    'wordSpacing': 'normal',\n    'wordBreak': 'normal',\n    'lineHeight': '1.5',\n    'MozTabSize': '2',\n    'OTabSize': '2',\n    'tabSize': '2',\n    'WebkitHyphens': 'none',\n    'MozHyphens': 'none',\n    'msHyphens': 'none',\n    'hyphens': 'none'\n  },\n  'pre[class*=\"language-\"]': {\n    'background': '#11111f',\n    'color': '#e2e8f0',\n    'textShadow': '0 1px rgba(0, 0, 0, 0.3)',\n    'fontFamily': '\"Fira Code\", \"Fira Mono\", Menlo, Consolas, \"DejaVu Sans Mono\", monospace',\n    'direction': 'ltr',\n    'textAlign': 'left',\n    'whiteSpace': 'pre',\n    'wordSpacing': 'normal',\n    'wordBreak': 'normal',\n    'lineHeight': '1.5',\n    'MozTabSize': '2',\n    'OTabSize': '2',\n    'tabSize': '2',\n    'WebkitHyphens': 'none',\n    'MozHyphens': 'none',\n    'msHyphens': 'none',\n    'hyphens': 'none',\n    'padding': '1em',\n    'margin': '0',\n    'overflow': 'auto'\n  },\n  'code[class*=\"language-\"]::-moz-selection': {\n    'background': '#1e293b',\n    'color': 'inherit',\n    'textShadow': 'none'\n  },\n  'code[class*=\"language-\"] *::-moz-selection': {\n    'background': '#1e293b',\n    'color': 'inherit',\n    'textShadow': 'none'\n  },\n  'pre[class*=\"language-\"] *::-moz-selection': {\n    'background': '#1e293b',\n    'color': 'inherit',\n    'textShadow': 'none'\n  },\n  'code[class*=\"language-\"]::selection': {\n    'background': '#1e293b',\n    'color': 'inherit',\n    'textShadow': 'none'\n  },\n  'code[class*=\"language-\"] *::selection': {\n    'background': '#1e293b',\n    'color': 'inherit',\n    'textShadow': 'none'\n  },\n  'pre[class*=\"language-\"] *::selection': {\n    'background': '#1e293b',\n    'color': 'inherit',\n    'textShadow': 'none'\n  },\n  ':not(pre) > code[class*=\"language-\"]': {\n    'padding': '0.2em 0.3em',\n    'borderRadius': '0.3em',\n    'whiteSpace': 'normal'\n  },\n  'comment': {\n    'color': '#64748b',\n    'fontStyle': 'italic'\n  },\n  'prolog': {\n    'color': '#64748b'\n  },\n  'cdata': {\n    'color': '#64748b'\n  },\n  'doctype': {\n    'color': '#e2e8f0'\n  },\n  'punctuation': {\n    'color': '#e2e8f0'\n  },\n  'entity': {\n    'color': '#3b82f6',\n    'cursor': 'help'\n  },\n  'attr-name': {\n    'color': '#f59e0b'\n  },\n  'class-name': {\n    'color': '#f59e0b'\n  },\n  'boolean': {\n    'color': '#3b82f6'\n  },\n  'constant': {\n    'color': '#3b82f6'\n  },\n  'number': {\n    'color': '#3b82f6'\n  },\n  'atrule': {\n    'color': '#f59e0b'\n  },\n  'keyword': {\n    'color': '#f472b6'\n  },\n  'property': {\n    'color': '#3b82f6'\n  },\n  'tag': {\n    'color': '#3b82f6'\n  },\n  'symbol': {\n    'color': '#3b82f6'\n  },\n  'deleted': {\n    'color': '#ef4444'\n  },\n  'important': {\n    'color': '#f472b6'\n  },\n  'selector': {\n    'color': '#10b981'\n  },\n  'string': {\n    'color': '#10b981'\n  },\n  'char': {\n    'color': '#10b981'\n  },\n  'builtin': {\n    'color': '#10b981'\n  },\n  'inserted': {\n    'color': '#10b981'\n  },\n  'regex': {\n    'color': '#10b981'\n  },\n  'attr-value': {\n    'color': '#10b981'\n  },\n  'attr-value > .token.punctuation': {\n    'color': '#10b981'\n  },\n  'variable': {\n    'color': '#60a5fa'\n  },\n  'operator': {\n    'color': '#60a5fa'\n  },\n  'function': {\n    'color': '#60a5fa'\n  },\n  'url': {\n    'color': '#60a5fa'\n  },\n  'attr-value > .token.punctuation.attr-equals': {\n    'color': '#e2e8f0'\n  },\n  'special-attr > .token.attr-value > .token.value.css': {\n    'color': '#e2e8f0'\n  },\n  '.language-css .token.selector': {\n    'color': '#3b82f6'\n  },\n  '.language-css .token.property': {\n    'color': '#e2e8f0'\n  },\n  '.language-css .token.function': {\n    'color': '#60a5fa'\n  },\n  '.language-css .token.url > .token.function': {\n    'color': '#60a5fa'\n  },\n  '.language-css .token.url > .token.string.url': {\n    'color': '#10b981'\n  },\n  '.language-css .token.important': {\n    'color': '#f472b6'\n  },\n  '.language-css .token.atrule .token.rule': {\n    'color': '#f472b6'\n  },\n  '.language-javascript .token.operator': {\n    'color': '#f472b6'\n  },\n  '.language-javascript .token.template-string > .token.interpolation > .token.interpolation-punctuation.punctuation': {\n    'color': '#ef4444'\n  },\n  '.language-json .token.operator': {\n    'color': '#e2e8f0'\n  },\n  '.language-json .token.null.keyword': {\n    'color': '#3b82f6'\n  },\n  '.language-markdown .token.url': {\n    'color': '#e2e8f0'\n  },\n  '.language-markdown .token.url > .token.operator': {\n    'color': '#e2e8f0'\n  },\n  '.language-markdown .token.url-reference.url > .token.string': {\n    'color': '#e2e8f0'\n  },\n  '.language-markdown .token.url > .token.content': {\n    'color': '#60a5fa'\n  },\n  '.language-markdown .token.url > .token.url': {\n    'color': '#60a5fa'\n  },\n  '.language-markdown .token.url-reference.url': {\n    'color': '#60a5fa'\n  },\n  '.language-markdown .token.blockquote.punctuation': {\n    'color': '#64748b',\n    'fontStyle': 'italic'\n  },\n  '.language-markdown .token.hr.punctuation': {\n    'color': '#64748b',\n    'fontStyle': 'italic'\n  },\n  '.language-markdown .token.code-snippet': {\n    'color': '#10b981'\n  },\n  '.language-markdown .token.bold .token.content': {\n    'color': '#f59e0b'\n  },\n  '.language-markdown .token.italic .token.content': {\n    'color': '#f472b6'\n  },\n  '.language-markdown .token.strike .token.content': {\n    'color': '#3b82f6'\n  },\n  '.language-markdown .token.strike .token.punctuation': {\n    'color': '#3b82f6'\n  },\n  '.language-markdown .token.list.punctuation': {\n    'color': '#3b82f6'\n  },\n  '.language-markdown .token.title.important > .token.punctuation': {\n    'color': '#3b82f6'\n  },\n  'bold': {\n    'fontWeight': 'bold'\n  },\n  'italic': {\n    'fontStyle': 'italic'\n  },\n  'namespace': {\n    'Opacity': '0.8'\n  },\n  'token.tab:not(:empty):before': {\n    'color': '#64748b',\n    'textShadow': 'none'\n  },\n  'token.cr:before': {\n    'color': '#64748b',\n    'textShadow': 'none'\n  },\n  'token.lf:before': {\n    'color': '#64748b',\n    'textShadow': 'none'\n  },\n  'token.space:before': {\n    'color': '#64748b',\n    'textShadow': 'none'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item': {\n    'marginRight': '0.4em'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > button': {\n    'background': '#1e293b',\n    'color': '#94a3b8',\n    'padding': '0.1em 0.4em',\n    'borderRadius': '0.3em'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > a': {\n    'background': '#1e293b',\n    'color': '#94a3b8',\n    'padding': '0.1em 0.4em',\n    'borderRadius': '0.3em'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > span': {\n    'background': '#1e293b',\n    'color': '#94a3b8',\n    'padding': '0.1em 0.4em',\n    'borderRadius': '0.3em'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:hover': {\n    'background': '#3b82f6',\n    'color': '#ffffff'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:focus': {\n    'background': '#3b82f6',\n    'color': '#ffffff'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:hover': {\n    'background': '#3b82f6',\n    'color': '#ffffff'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:focus': {\n    'background': '#3b82f6',\n    'color': '#ffffff'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:hover': {\n    'background': '#3b82f6',\n    'color': '#ffffff'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:focus': {\n    'background': '#3b82f6',\n    'color': '#ffffff'\n  },\n  '.line-highlight.line-highlight': {\n    'background': 'rgba(59, 130, 246, 0.08)'\n  },\n  '.line-highlight.line-highlight:before': {\n    'background': '#1e293b',\n    'color': '#e2e8f0',\n    'padding': '0.1em 0.6em',\n    'borderRadius': '0.3em',\n    'boxShadow': '0 2px 0 0 rgba(0, 0, 0, 0.2)'\n  },\n  '.line-highlight.line-highlight[data-end]:after': {\n    'background': '#1e293b',\n    'color': '#e2e8f0',\n    'padding': '0.1em 0.6em',\n    'borderRadius': '0.3em',\n    'boxShadow': '0 2px 0 0 rgba(0, 0, 0, 0.2)'\n  },\n  'pre[id].linkable-line-numbers.linkable-line-numbers span.line-numbers-rows > span:hover:before': {\n    'backgroundColor': 'rgba(59, 130, 246, 0.08)'\n  },\n  '.line-numbers.line-numbers .line-numbers-rows': {\n    'borderRightColor': '#1e293b'\n  },\n  '.command-line .command-line-prompt': {\n    'borderRightColor': '#1e293b'\n  },\n  '.line-numbers .line-numbers-rows > span:before': {\n    'color': '#64748b'\n  },\n  '.command-line .command-line-prompt > span:before': {\n    'color': '#64748b'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-1': {\n    'color': '#3b82f6'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-5': {\n    'color': '#3b82f6'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-9': {\n    'color': '#3b82f6'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-2': {\n    'color': '#10b981'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-6': {\n    'color': '#10b981'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-10': {\n    'color': '#10b981'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-3': {\n    'color': '#60a5fa'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-7': {\n    'color': '#60a5fa'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-11': {\n    'color': '#60a5fa'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-4': {\n    'color': '#f472b6'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-8': {\n    'color': '#f472b6'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-12': {\n    'color': '#f472b6'\n  },\n  'pre.diff-highlight > code .token.token.deleted:not(.prefix)': {\n    'backgroundColor': 'rgba(239, 68, 68, 0.15)'\n  },\n  'pre > code.diff-highlight .token.token.deleted:not(.prefix)': {\n    'backgroundColor': 'rgba(239, 68, 68, 0.15)'\n  },\n  'pre.diff-highlight > code .token.token.deleted:not(.prefix)::-moz-selection': {\n    'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n  },\n  'pre.diff-highlight > code .token.token.deleted:not(.prefix) *::-moz-selection': {\n    'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n  },\n  'pre > code.diff-highlight .token.token.deleted:not(.prefix)::-moz-selection': {\n    'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n  },\n  'pre > code.diff-highlight .token.token.deleted:not(.prefix) *::-moz-selection': {\n    'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n  },\n  'pre.diff-highlight > code .token.token.deleted:not(.prefix)::selection': {\n    'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n  },\n  'pre.diff-highlight > code .token.token.deleted:not(.prefix) *::selection': {\n    'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n  },\n  'pre > code.diff-highlight .token.token.deleted:not(.prefix)::selection': {\n    'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n  },\n  'pre > code.diff-highlight .token.token.deleted:not(.prefix) *::selection': {\n    'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n  },\n  'pre.diff-highlight > code .token.token.inserted:not(.prefix)': {\n    'backgroundColor': 'rgba(16, 185, 129, 0.15)'\n  },\n  'pre > code.diff-highlight .token.token.inserted:not(.prefix)': {\n    'backgroundColor': 'rgba(16, 185, 129, 0.15)'\n  },\n  'pre.diff-highlight > code .token.token.inserted:not(.prefix)::-moz-selection': {\n    'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n  },\n  'pre.diff-highlight > code .token.token.inserted:not(.prefix) *::-moz-selection': {\n    'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n  },\n  'pre > code.diff-highlight .token.token.inserted:not(.prefix)::-moz-selection': {\n    'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n  },\n  'pre > code.diff-highlight .token.token.inserted:not(.prefix) *::-moz-selection': {\n    'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n  },\n  'pre.diff-highlight > code .token.token.inserted:not(.prefix)::selection': {\n    'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n  },\n  'pre.diff-highlight > code .token.token.inserted:not(.prefix) *::selection': {\n    'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n  },\n  'pre > code.diff-highlight .token.token.inserted:not(.prefix)::selection': {\n    'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n  },\n  'pre > code.diff-highlight .token.token.inserted:not(.prefix) *::selection': {\n    'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n  },\n  '.prism-previewer.prism-previewer:before': {\n    'borderColor': '#11111f'\n  },\n  '.prism-previewer-gradient.prism-previewer-gradient div': {\n    'borderColor': '#11111f',\n    'borderRadius': '0.3em'\n  },\n  '.prism-previewer-color.prism-previewer-color:before': {\n    'borderRadius': '0.3em'\n  },\n  '.prism-previewer-easing.prism-previewer-easing:before': {\n    'borderRadius': '0.3em'\n  },\n  '.prism-previewer.prism-previewer:after': {\n    'borderTopColor': '#11111f'\n  },\n  '.prism-previewer-flipped.prism-previewer-flipped.after': {\n    'borderBottomColor': '#11111f'\n  },\n  '.prism-previewer-angle.prism-previewer-angle:before': {\n    'background': '#1e293b'\n  },\n  '.prism-previewer-time.prism-previewer-time:before': {\n    'background': '#1e293b'\n  },\n  '.prism-previewer-easing.prism-previewer-easing': {\n    'background': '#1e293b'\n  },\n  '.prism-previewer-angle.prism-previewer-angle circle': {\n    'stroke': '#e2e8f0',\n    'strokeOpacity': '1'\n  },\n  '.prism-previewer-time.prism-previewer-time circle': {\n    'stroke': '#e2e8f0',\n    'strokeOpacity': '1'\n  },\n  '.prism-previewer-easing.prism-previewer-easing circle': {\n    'stroke': '#e2e8f0',\n    'fill': 'transparent'\n  },\n  '.prism-previewer-easing.prism-previewer-easing path': {\n    'stroke': '#e2e8f0'\n  },\n  '.prism-previewer-easing.prism-previewer-easing line': {\n    'stroke': '#e2e8f0'\n  }\n}"
+        },
+        "description": "The theme to use for the code block.",
+        "name": "theme",
+        "parent": {
+          "fileName": "src/Markdown/CodeHighlighter.tsx",
+          "name": "CodeHighlighterProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Markdown/CodeHighlighter.tsx",
+            "name": "CodeHighlighterProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "Record<string, string>"
+        }
+      }
+    }
+  },
+  {
+    "tags": {},
+    "filePath": "src/Markdown/Markdown.tsx",
+    "description": "",
+    "displayName": "Markdown",
+    "methods": [],
+    "props": {
+      "remarkPlugins": {
+        "defaultValue": null,
+        "description": "Remark plugins to apply to the markdown content.",
+        "name": "remarkPlugins",
+        "parent": {
+          "fileName": "src/Markdown/Markdown.tsx",
+          "name": "MarkdownWrapperProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Markdown/Markdown.tsx",
+            "name": "MarkdownWrapperProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "Plugin<[], Node, Node>[]"
+        }
+      },
+      "rehypePlugins": {
+        "defaultValue": {
+          "value": "[rehypeKatex]"
+        },
+        "description": "Rehype plugins to apply to the markdown content.",
+        "name": "rehypePlugins",
+        "parent": {
+          "fileName": "src/Markdown/Markdown.tsx",
+          "name": "MarkdownWrapperProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Markdown/Markdown.tsx",
+            "name": "MarkdownWrapperProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "Plugin<[], Node, Node>[]"
+        }
+      },
+      "customComponents": {
+        "defaultValue": null,
+        "description": "Custom components to override default markdown rendering.\nThese will be merged with the default components.",
+        "name": "customComponents",
+        "parent": {
+          "fileName": "src/Markdown/Markdown.tsx",
+          "name": "MarkdownWrapperProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Markdown/Markdown.tsx",
+            "name": "MarkdownWrapperProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "Components"
+        }
+      }
+    }
+  },
+  {
+    "tags": {},
+    "filePath": "src/Markdown/Table.tsx",
+    "description": "",
+    "displayName": "TableComponent",
+    "methods": [],
+    "props": {}
+  },
+  {
+    "tags": {},
+    "filePath": "src/Markdown/Table.tsx",
+    "description": "",
+    "displayName": "TableHeaderCell",
+    "methods": [],
+    "props": {}
+  },
+  {
+    "tags": {},
+    "filePath": "src/Markdown/Table.tsx",
+    "description": "",
+    "displayName": "TableDataCell",
+    "methods": [],
+    "props": {}
+  },
+  {
+    "tags": {},
+    "filePath": "src/MessageStatus/MessageStatus.tsx",
+    "description": "Displays status information with optional sub-steps, similar to Claude's tool status UI.",
+    "displayName": "MessageStatus",
+    "methods": [],
+    "props": {
+      "status": {
+        "defaultValue": {
+          "value": "loading"
+        },
+        "description": "Current status state.",
+        "name": "status",
+        "parent": {
+          "fileName": "src/MessageStatus/MessageStatus.tsx",
+          "name": "MessageStatusProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/MessageStatus/MessageStatus.tsx",
+            "name": "MessageStatusProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "MessageStatusState"
+        }
+      },
+      "text": {
+        "defaultValue": null,
+        "description": "Main status text to display.",
+        "name": "text",
+        "parent": {
+          "fileName": "src/MessageStatus/MessageStatus.tsx",
+          "name": "MessageStatusProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/MessageStatus/MessageStatus.tsx",
+            "name": "MessageStatusProps"
+          }
+        ],
+        "required": true,
+        "type": {
+          "name": "string"
+        }
+      },
+      "steps": {
+        "defaultValue": null,
+        "description": "Optional sub-steps to display.",
+        "name": "steps",
+        "parent": {
+          "fileName": "src/MessageStatus/MessageStatus.tsx",
+          "name": "MessageStatusProps"
         },
         "declarations": [
           {
-            "fileName": "src/Markdown/CodeHighlighter.tsx",
-            "name": "CodeHighlighterProps"
+            "fileName": "src/MessageStatus/MessageStatus.tsx",
+            "name": "MessageStatusProps"
           }
         ],
         "required": false,
         "type": {
-          "name": "string"
+          "name": "MessageStatusStep[]"
         }
       },
-      "toolbarClassName": {
+      "icon": {
         "defaultValue": null,
-        "description": "The class name to apply to the toolbar.",
-        "name": "toolbarClassName",
+        "description": "Custom icon to display. If not provided, uses default icons based on status.",
+        "name": "icon",
         "parent": {
-          "fileName": "src/Markdown/CodeHighlighter.tsx",
-          "name": "CodeHighlighterProps"
+          "fileName": "src/MessageStatus/MessageStatus.tsx",
+          "name": "MessageStatusProps"
         },
         "declarations": [
           {
-            "fileName": "src/Markdown/CodeHighlighter.tsx",
-            "name": "CodeHighlighterProps"
+            "fileName": "src/MessageStatus/MessageStatus.tsx",
+            "name": "MessageStatusProps"
           }
         ],
         "required": false,
         "type": {
-          "name": "string"
+          "name": "ReactNode"
         }
       },
-      "copyIcon": {
-        "defaultValue": {
-          "value": "<CopyIcon />"
-        },
-        "description": "Icon to show for copy.",
-        "name": "copyIcon",
+      "className": {
+        "defaultValue": null,
+        "description": "Additional CSS class name.",
+        "name": "className",
         "parent": {
-          "fileName": "src/Markdown/CodeHighlighter.tsx",
-          "name": "CodeHighlighterProps"
+          "fileName": "src/MessageStatus/MessageStatus.tsx",
+          "name": "MessageStatusProps"
         },
         "declarations": [
           {
-            "fileName": "src/Markdown/CodeHighlighter.tsx",
-            "name": "CodeHighlighterProps"
+            "fileName": "src/MessageStatus/MessageStatus.tsx",
+            "name": "MessageStatusProps"
           }
         ],
         "required": false,
         "type": {
-          "name": "ReactElement<any, string | JSXElementConstructor<any>>"
+          "name": "string"
         }
-      },
-      "theme": {
-        "defaultValue": {
-          "value": "{\n  'code[class*=\"language-\"]': {\n    background: '#11111f',\n    color: '#e2e8f0',\n    textShadow: '0 1px rgba(0, 0, 0, 0.3)',\n    fontFamily:\n      '\"Fira Code\", \"Fira Mono\", Menlo, Consolas, \"DejaVu Sans Mono\", monospace',\n    direction: 'ltr',\n    textAlign: 'left',\n    whiteSpace: 'pre',\n    wordSpacing: 'normal',\n    wordBreak: 'normal',\n    lineHeight: '1.5',\n    MozTabSize: '2',\n    OTabSize: '2',\n    tabSize: '2',\n    WebkitHyphens: 'none',\n    MozHyphens: 'none',\n    msHyphens: 'none',\n    hyphens: 'none'\n  },\n  'pre[class*=\"language-\"]': {\n    background: '#11111f',\n    color: '#e2e8f0',\n    textShadow: '0 1px rgba(0, 0, 0, 0.3)',\n    fontFamily:\n      '\"Fira Code\", \"Fira Mono\", Menlo, Consolas, \"DejaVu Sans Mono\", monospace',\n    direction: 'ltr',\n    textAlign: 'left',\n    whiteSpace: 'pre',\n    wordSpacing: 'normal',\n    wordBreak: 'normal',\n    lineHeight: '1.5',\n    MozTabSize: '2',\n    OTabSize: '2',\n    tabSize: '2',\n    WebkitHyphens: 'none',\n    MozHyphens: 'none',\n    msHyphens: 'none',\n    hyphens: 'none',\n    padding: '1em',\n    margin: '0',\n    overflow: 'auto'\n  },\n  'code[class*=\"language-\"]::-moz-selection': {\n    background: '#1e293b',\n    color: 'inherit',\n    textShadow: 'none'\n  },\n  'code[class*=\"language-\"] *::-moz-selection': {\n    background: '#1e293b',\n    color: 'inherit',\n    textShadow: 'none'\n  },\n  'pre[class*=\"language-\"] *::-moz-selection': {\n    background: '#1e293b',\n    color: 'inherit',\n    textShadow: 'none'\n  },\n  'code[class*=\"language-\"]::selection': {\n    background: '#1e293b',\n    color: 'inherit',\n    textShadow: 'none'\n  },\n  'code[class*=\"language-\"] *::selection': {\n    background: '#1e293b',\n    color: 'inherit',\n    textShadow: 'none'\n  },\n  'pre[class*=\"language-\"] *::selection': {\n    background: '#1e293b',\n    color: 'inherit',\n    textShadow: 'none'\n  },\n  ':not(pre) > code[class*=\"language-\"]': {\n    padding: '0.2em 0.3em',\n    borderRadius: '0.3em',\n    whiteSpace: 'normal'\n  },\n  comment: {\n    color: '#64748b',\n    fontStyle: 'italic'\n  },\n  prolog: {\n    color: '#64748b'\n  },\n  cdata: {\n    color: '#64748b'\n  },\n  doctype: {\n    color: '#e2e8f0'\n  },\n  punctuation: {\n    color: '#e2e8f0'\n  },\n  entity: {\n    color: '#3b82f6',\n    cursor: 'help'\n  },\n  'attr-name': {\n    color: '#f59e0b'\n  },\n  'class-name': {\n    color: '#f59e0b'\n  },\n  boolean: {\n    color: '#3b82f6'\n  },\n  constant: {\n    color: '#3b82f6'\n  },\n  number: {\n    color: '#3b82f6'\n  },\n  atrule: {\n    color: '#f59e0b'\n  },\n  keyword: {\n    color: '#f472b6'\n  },\n  property: {\n    color: '#3b82f6'\n  },\n  tag: {\n    color: '#3b82f6'\n  },\n  symbol: {\n    color: '#3b82f6'\n  },\n  deleted: {\n    color: '#ef4444'\n  },\n  important: {\n    color: '#f472b6'\n  },\n  selector: {\n    color: '#10b981'\n  },\n  string: {\n    color: '#10b981'\n  },\n  char: {\n    color: '#10b981'\n  },\n  builtin: {\n    color: '#10b981'\n  },\n  inserted: {\n    color: '#10b981'\n  },\n  regex: {\n    color: '#10b981'\n  },\n  'attr-value': {\n    color: '#10b981'\n  },\n  'attr-value > .token.punctuation': {\n    color: '#10b981'\n  },\n  variable: {\n    color: '#60a5fa'\n  },\n  operator: {\n    color: '#60a5fa'\n  },\n  function: {\n    color: '#60a5fa'\n  },\n  url: {\n    color: '#60a5fa'\n  },\n  'attr-value > .token.punctuation.attr-equals': {\n    color: '#e2e8f0'\n  },\n  'special-attr > .token.attr-value > .token.value.css': {\n    color: '#e2e8f0'\n  },\n  '.language-css .token.selector': {\n    color: '#3b82f6'\n  },\n  '.language-css .token.property': {\n    color: '#e2e8f0'\n  },\n  '.language-css .token.function': {\n    color: '#60a5fa'\n  },\n  '.language-css .token.url > .token.function': {\n    color: '#60a5fa'\n  },\n  '.language-css .token.url > .token.string.url': {\n    color: '#10b981'\n  },\n  '.language-css .token.important': {\n    color: '#f472b6'\n  },\n  '.language-css .token.atrule .token.rule': {\n    color: '#f472b6'\n  },\n  '.language-javascript .token.operator': {\n    color: '#f472b6'\n  },\n  '.language-javascript .token.template-string > .token.interpolation > .token.interpolation-punctuation.punctuation':\n    {\n      color: '#ef4444'\n    },\n  '.language-json .token.operator': {\n    color: '#e2e8f0'\n  },\n  '.language-json .token.null.keyword': {\n    color: '#3b82f6'\n  },\n  '.language-markdown .token.url': {\n    color: '#e2e8f0'\n  },\n  '.language-markdown .token.url > .token.operator': {\n    color: '#e2e8f0'\n  },\n  '.language-markdown .token.url-reference.url > .token.string': {\n    color: '#e2e8f0'\n  },\n  '.language-markdown .token.url > .token.content': {\n    color: '#60a5fa'\n  },\n  '.language-markdown .token.url > .token.url': {\n    color: '#60a5fa'\n  },\n  '.language-markdown .token.url-reference.url': {\n    color: '#60a5fa'\n  },\n  '.language-markdown .token.blockquote.punctuation': {\n    color: '#64748b',\n    fontStyle: 'italic'\n  },\n  '.language-markdown .token.hr.punctuation': {\n    color: '#64748b',\n    fontStyle: 'italic'\n  },\n  '.language-markdown .token.code-snippet': {\n    color: '#10b981'\n  },\n  '.language-markdown .token.bold .token.content': {\n    color: '#f59e0b'\n  },\n  '.language-markdown .token.italic .token.content': {\n    color: '#f472b6'\n  },\n  '.language-markdown .token.strike .token.content': {\n    color: '#3b82f6'\n  },\n  '.language-markdown .token.strike .token.punctuation': {\n    color: '#3b82f6'\n  },\n  '.language-markdown .token.list.punctuation': {\n    color: '#3b82f6'\n  },\n  '.language-markdown .token.title.important > .token.punctuation': {\n    color: '#3b82f6'\n  },\n  bold: {\n    fontWeight: 'bold'\n  },\n  italic: {\n    fontStyle: 'italic'\n  },\n  namespace: {\n    Opacity: '0.8'\n  },\n  'token.tab:not(:empty):before': {\n    color: '#64748b',\n    textShadow: 'none'\n  },\n  'token.cr:before': {\n    color: '#64748b',\n    textShadow: 'none'\n  },\n  'token.lf:before': {\n    color: '#64748b',\n    textShadow: 'none'\n  },\n  'token.space:before': {\n    color: '#64748b',\n    textShadow: 'none'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item': {\n    marginRight: '0.4em'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > button': {\n    background: '#1e293b',\n    color: '#94a3b8',\n    padding: '0.1em 0.4em',\n    borderRadius: '0.3em'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > a': {\n    background: '#1e293b',\n    color: '#94a3b8',\n    padding: '0.1em 0.4em',\n    borderRadius: '0.3em'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > span': {\n    background: '#1e293b',\n    color: '#94a3b8',\n    padding: '0.1em 0.4em',\n    borderRadius: '0.3em'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:hover': {\n    background: '#3b82f6',\n    color: '#ffffff'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:focus': {\n    background: '#3b82f6',\n    color: '#ffffff'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:hover': {\n    background: '#3b82f6',\n    color: '#ffffff'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:focus': {\n    background: '#3b82f6',\n    color: '#ffffff'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:hover': {\n    background: '#3b82f6',\n    color: '#ffffff'\n  },\n  'div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:focus': {\n    background: '#3b82f6',\n    color: '#ffffff'\n  },\n  '.line-highlight.line-highlight': {\n    background: 'rgba(59, 130, 246, 0.08)'\n  },\n  '.line-highlight.line-highlight:before': {\n    background: '#1e293b',\n    color: '#e2e8f0',\n    padding: '0.1em 0.6em',\n    borderRadius: '0.3em',\n    boxShadow: '0 2px 0 0 rgba(0, 0, 0, 0.2)'\n  },\n  '.line-highlight.line-highlight[data-end]:after': {\n    background: '#1e293b',\n    color: '#e2e8f0',\n    padding: '0.1em 0.6em',\n    borderRadius: '0.3em',\n    boxShadow: '0 2px 0 0 rgba(0, 0, 0, 0.2)'\n  },\n  'pre[id].linkable-line-numbers.linkable-line-numbers span.line-numbers-rows > span:hover:before':\n    {\n      backgroundColor: 'rgba(59, 130, 246, 0.08)'\n    },\n  '.line-numbers.line-numbers .line-numbers-rows': {\n    borderRightColor: '#1e293b'\n  },\n  '.command-line .command-line-prompt': {\n    borderRightColor: '#1e293b'\n  },\n  '.line-numbers .line-numbers-rows > span:before': {\n    color: '#64748b'\n  },\n  '.command-line .command-line-prompt > span:before': {\n    color: '#64748b'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-1': {\n    color: '#3b82f6'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-5': {\n    color: '#3b82f6'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-9': {\n    color: '#3b82f6'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-2': {\n    color: '#10b981'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-6': {\n    color: '#10b981'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-10': {\n    color: '#10b981'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-3': {\n    color: '#60a5fa'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-7': {\n    color: '#60a5fa'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-11': {\n    color: '#60a5fa'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-4': {\n    color: '#f472b6'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-8': {\n    color: '#f472b6'\n  },\n  '.rainbow-braces .token.token.punctuation.brace-level-12': {\n    color: '#f472b6'\n  },\n  'pre.diff-highlight > code .token.token.deleted:not(.prefix)': {\n    backgroundColor: 'rgba(239, 68, 68, 0.15)'\n  },\n  'pre > code.diff-highlight .token.token.deleted:not(.prefix)': {\n    backgroundColor: 'rgba(239, 68, 68, 0.15)'\n  },\n  'pre.diff-highlight > code .token.token.deleted:not(.prefix)::-moz-selection':\n    {\n      backgroundColor: 'rgba(239, 68, 68, 0.25)'\n    },\n  'pre.diff-highlight > code .token.token.deleted:not(.prefix) *::-moz-selection':\n    {\n      backgroundColor: 'rgba(239, 68, 68, 0.25)'\n    },\n  'pre > code.diff-highlight .token.token.deleted:not(.prefix)::-moz-selection':\n    {\n      backgroundColor: 'rgba(239, 68, 68, 0.25)'\n    },\n  'pre > code.diff-highlight .token.token.deleted:not(.prefix) *::-moz-selection':\n    {\n      backgroundColor: 'rgba(239, 68, 68, 0.25)'\n    },\n  'pre.diff-highlight > code .token.token.deleted:not(.prefix)::selection': {\n    backgroundColor: 'rgba(239, 68, 68, 0.25)'\n  },\n  'pre.diff-highlight > code .token.token.deleted:not(.prefix) *::selection': {\n    backgroundColor: 'rgba(239, 68, 68, 0.25)'\n  },\n  'pre > code.diff-highlight .token.token.deleted:not(.prefix)::selection': {\n    backgroundColor: 'rgba(239, 68, 68, 0.25)'\n  },\n  'pre > code.diff-highlight .token.token.deleted:not(.prefix) *::selection': {\n    backgroundColor: 'rgba(239, 68, 68, 0.25)'\n  },\n  'pre.diff-highlight > code .token.token.inserted:not(.prefix)': {\n    backgroundColor: 'rgba(16, 185, 129, 0.15)'\n  },\n  'pre > code.diff-highlight .token.token.inserted:not(.prefix)': {\n    backgroundColor: 'rgba(16, 185, 129, 0.15)'\n  },\n  'pre.diff-highlight > code .token.token.inserted:not(.prefix)::-moz-selection':\n    {\n      backgroundColor: 'rgba(16, 185, 129, 0.25)'\n    },\n  'pre.diff-highlight > code .token.token.inserted:not(.prefix) *::-moz-selection':\n    {\n      backgroundColor: 'rgba(16, 185, 129, 0.25)'\n    },\n  'pre > code.diff-highlight .token.token.inserted:not(.prefix)::-moz-selection':\n    {\n      backgroundColor: 'rgba(16, 185, 129, 0.25)'\n    },\n  'pre > code.diff-highlight .token.token.inserted:not(.prefix) *::-moz-selection':\n    {\n      backgroundColor: 'rgba(16, 185, 129, 0.25)'\n    },\n  'pre.diff-highlight > code .token.token.inserted:not(.prefix)::selection': {\n    backgroundColor: 'rgba(16, 185, 129, 0.25)'\n  },\n  'pre.diff-highlight > code .token.token.inserted:not(.prefix) *::selection': {\n    backgroundColor: 'rgba(16, 185, 129, 0.25)'\n  },\n  'pre > code.diff-highlight .token.token.inserted:not(.prefix)::selection': {\n    backgroundColor: 'rgba(16, 185, 129, 0.25)'\n  },\n  'pre > code.diff-highlight .token.token.inserted:not(.prefix) *::selection': {\n    backgroundColor: 'rgba(16, 185, 129, 0.25)'\n  },\n  '.prism-previewer.prism-previewer:before': {\n    borderColor: '#11111f'\n  },\n  '.prism-previewer-gradient.prism-previewer-gradient div': {\n    borderColor: '#11111f',\n    borderRadius: '0.3em'\n  },\n  '.prism-previewer-color.prism-previewer-color:before': {\n    borderRadius: '0.3em'\n  },\n  '.prism-previewer-easing.prism-previewer-easing:before': {\n    borderRadius: '0.3em'\n  },\n  '.prism-previewer.prism-previewer:after': {\n    borderTopColor: '#11111f'\n  },\n  '.prism-previewer-flipped.prism-previewer-flipped.after': {\n    borderBottomColor: '#11111f'\n  },\n  '.prism-previewer-angle.prism-previewer-angle:before': {\n    background: '#1e293b'\n  },\n  '.prism-previewer-time.prism-previewer-time:before': {\n    background: '#1e293b'\n  },\n  '.prism-previewer-easing.prism-previewer-easing': {\n    background: '#1e293b'\n  },\n  '.prism-previewer-angle.prism-previewer-angle circle': {\n    stroke: '#e2e8f0',\n    strokeOpacity: '1'\n  },\n  '.prism-previewer-time.prism-previewer-time circle': {\n    stroke: '#e2e8f0',\n    strokeOpacity: '1'\n  },\n  '.prism-previewer-easing.prism-previewer-easing circle': {\n    stroke: '#e2e8f0',\n    fill: 'transparent'\n  },\n  '.prism-previewer-easing.prism-previewer-easing path': {\n    stroke: '#e2e8f0'\n  },\n  '.prism-previewer-easing.prism-previewer-easing line': {\n    stroke: '#e2e8f0'\n  }\n}"
-        },
-        "description": "The theme to use for the code block.",
-        "name": "theme",
+      }
+    }
+  },
+  {
+    "tags": {},
+    "filePath": "src/MessageStatus/MessageStatusItem.tsx",
+    "description": "",
+    "displayName": "MessageStatusItem",
+    "methods": [],
+    "props": {
+      "step": {
+        "defaultValue": null,
+        "description": "The step to display.",
+        "name": "step",
         "parent": {
-          "fileName": "src/Markdown/CodeHighlighter.tsx",
-          "name": "CodeHighlighterProps"
+          "fileName": "src/MessageStatus/MessageStatusItem.tsx",
+          "name": "MessageStatusItemProps"
         },
         "declarations": [
           {
-            "fileName": "src/Markdown/CodeHighlighter.tsx",
-            "name": "CodeHighlighterProps"
+            "fileName": "src/MessageStatus/MessageStatusItem.tsx",
+            "name": "MessageStatusItemProps"
           }
         ],
-        "required": false,
+        "required": true,
         "type": {
-          "name": "Record<string, string>"
+          "name": "MessageStatusStep"
         }
       }
     }
   },
   {
     "tags": {},
-    "filePath": "src/Markdown/Markdown.tsx",
+    "filePath": "src/MessageStatus/StatusIcon.tsx",
     "description": "",
-    "displayName": "Markdown",
+    "displayName": "StatusIcon",
     "methods": [],
     "props": {
-      "remarkPlugins": {
+      "state": {
         "defaultValue": null,
-        "description": "Remark plugins to apply to the markdown content.",
-        "name": "remarkPlugins",
+        "description": "Current state of the status icon.",
+        "name": "state",
         "parent": {
-          "fileName": "src/Markdown/Markdown.tsx",
-          "name": "MarkdownWrapperProps"
+          "fileName": "src/MessageStatus/StatusIcon.tsx",
+          "name": "StatusIconProps"
         },
         "declarations": [
           {
-            "fileName": "src/Markdown/Markdown.tsx",
-            "name": "MarkdownWrapperProps"
+            "fileName": "src/MessageStatus/StatusIcon.tsx",
+            "name": "StatusIconProps"
           }
         ],
-        "required": false,
+        "required": true,
         "type": {
-          "name": "Plugin[]"
+          "name": "MessageStatusState"
         }
       },
-      "rehypePlugins": {
-        "defaultValue": {
-          "value": "[rehypeKatex]"
-        },
-        "description": "Rehype plugins to apply to the markdown content.",
-        "name": "rehypePlugins",
+      "className": {
+        "defaultValue": null,
+        "description": "Additional CSS class name for the icon container.",
+        "name": "className",
         "parent": {
-          "fileName": "src/Markdown/Markdown.tsx",
-          "name": "MarkdownWrapperProps"
+          "fileName": "src/MessageStatus/StatusIcon.tsx",
+          "name": "StatusIconProps"
         },
         "declarations": [
           {
-            "fileName": "src/Markdown/Markdown.tsx",
-            "name": "MarkdownWrapperProps"
+            "fileName": "src/MessageStatus/StatusIcon.tsx",
+            "name": "StatusIconProps"
           }
         ],
         "required": false,
         "type": {
-          "name": "Plugin[]"
+          "name": "string"
         }
       },
-      "theme": {
+      "colorClassName": {
         "defaultValue": null,
-        "description": "Theme to apply to the markdown content.",
-        "name": "theme",
+        "description": "CSS class name for the icon color based on state.",
+        "name": "colorClassName",
         "parent": {
-          "fileName": "src/Markdown/Markdown.tsx",
-          "name": "MarkdownWrapperProps"
+          "fileName": "src/MessageStatus/StatusIcon.tsx",
+          "name": "StatusIconProps"
         },
         "declarations": [
           {
-            "fileName": "src/Markdown/Markdown.tsx",
-            "name": "MarkdownWrapperProps"
+            "fileName": "src/MessageStatus/StatusIcon.tsx",
+            "name": "StatusIconProps"
           }
         ],
-        "required": true,
+        "required": false,
         "type": {
-          "name": "ChatTheme"
+          "name": "string"
         }
       }
     }
   },
-  {
-    "tags": {},
-    "filePath": "src/Markdown/Table.tsx",
-    "description": "",
-    "displayName": "TableComponent",
-    "methods": [],
-    "props": {}
-  },
-  {
-    "tags": {},
-    "filePath": "src/Markdown/Table.tsx",
-    "description": "",
-    "displayName": "TableHeaderCell",
-    "methods": [],
-    "props": {}
-  },
-  {
-    "tags": {},
-    "filePath": "src/Markdown/Table.tsx",
-    "description": "",
-    "displayName": "TableDataCell",
-    "methods": [],
-    "props": {}
-  },
   {
     "tags": {},
     "filePath": "src/SessionMessages/SessionEmpty.tsx",
@@ -1010,25 +1760,6 @@
     "displayName": "SessionMessages",
     "methods": [],
     "props": {
-      "className": {
-        "defaultValue": null,
-        "description": "Class name to apply to the root element.",
-        "name": "className",
-        "parent": {
-          "fileName": "src/SessionMessages/SessionMessages.tsx",
-          "name": "SessionMessagesProps"
-        },
-        "declarations": [
-          {
-            "fileName": "src/SessionMessages/SessionMessages.tsx",
-            "name": "SessionMessagesProps"
-          }
-        ],
-        "required": false,
-        "type": {
-          "name": "string"
-        }
-      },
       "newSessionContent": {
         "defaultValue": null,
         "description": "Content to display when there are no sessions selected or a new session is started.",
@@ -1090,12 +1821,12 @@
           "name": "string"
         }
       },
-      "autoScroll": {
+      "showScrollBottomButton": {
         "defaultValue": {
-          "value": "true"
+          "value": "false"
         },
-        "description": "Whether to automatically scroll to the bottom of the content.",
-        "name": "autoScroll",
+        "description": "Whether to display the scroll to bottom button.",
+        "name": "showScrollBottomButton",
         "parent": {
           "fileName": "src/SessionMessages/SessionMessages.tsx",
           "name": "SessionMessagesProps"
@@ -1366,6 +2097,148 @@
       }
     }
   },
+  {
+    "tags": {},
+    "filePath": "src/Markdown/charts/ChartError.tsx",
+    "description": "",
+    "displayName": "ChartError",
+    "methods": [],
+    "props": {
+      "variant": {
+        "defaultValue": {
+          "value": "error"
+        },
+        "description": "The visual style variant of the error display.\nDefaults to 'error'.",
+        "name": "variant",
+        "parent": {
+          "fileName": "src/Markdown/charts/ChartError.tsx",
+          "name": "ChartErrorProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Markdown/charts/ChartError.tsx",
+            "name": "ChartErrorProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "\"error\" | \"warning\""
+        }
+      },
+      "title": {
+        "defaultValue": null,
+        "description": "The heading text displayed at the top of the error.",
+        "name": "title",
+        "parent": {
+          "fileName": "src/Markdown/charts/ChartError.tsx",
+          "name": "ChartErrorProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Markdown/charts/ChartError.tsx",
+            "name": "ChartErrorProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "message": {
+        "defaultValue": null,
+        "description": "The descriptive message explaining the error or warning.",
+        "name": "message",
+        "parent": {
+          "fileName": "src/Markdown/charts/ChartError.tsx",
+          "name": "ChartErrorProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Markdown/charts/ChartError.tsx",
+            "name": "ChartErrorProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "code": {
+        "defaultValue": null,
+        "description": "The raw code or data that caused the error, displayed in a code block.",
+        "name": "code",
+        "parent": {
+          "fileName": "src/Markdown/charts/ChartError.tsx",
+          "name": "ChartErrorProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Markdown/charts/ChartError.tsx",
+            "name": "ChartErrorProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      }
+    }
+  },
+  {
+    "tags": {},
+    "filePath": "src/Markdown/charts/ChartPre.tsx",
+    "description": "",
+    "displayName": "ChartPre",
+    "methods": [],
+    "props": {}
+  },
+  {
+    "tags": {},
+    "filePath": "src/Markdown/charts/ChartRenderer.tsx",
+    "description": "",
+    "displayName": "ChartRenderer",
+    "methods": [],
+    "props": {
+      "config": {
+        "defaultValue": null,
+        "description": "The chart configuration.",
+        "name": "config",
+        "parent": {
+          "fileName": "src/Markdown/charts/ChartRenderer.tsx",
+          "name": "ChartRendererProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Markdown/charts/ChartRenderer.tsx",
+            "name": "ChartRendererProps"
+          }
+        ],
+        "required": true,
+        "type": {
+          "name": "ChartConfig"
+        }
+      },
+      "className": {
+        "defaultValue": null,
+        "description": "The class name to apply to the chart container.",
+        "name": "className",
+        "parent": {
+          "fileName": "src/Markdown/charts/ChartRenderer.tsx",
+          "name": "ChartRendererProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/Markdown/charts/ChartRenderer.tsx",
+            "name": "ChartRendererProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      }
+    }
+  },
   {
     "tags": {},
     "filePath": "src/SessionMessages/SessionMessage/MessageActions.tsx",
@@ -1720,12 +2593,12 @@
         "description": "URL of the source, if applicable",
         "name": "url",
         "parent": {
-          "fileName": "reachat/src/types.ts",
+          "fileName": "src/types.ts",
           "name": "ConversationSource"
         },
         "declarations": [
           {
-            "fileName": "reachat/src/types.ts",
+            "fileName": "src/types.ts",
             "name": "ConversationSource"
           }
         ],
@@ -1739,12 +2612,12 @@
         "description": "Title or description of the source",
         "name": "title",
         "parent": {
-          "fileName": "reachat/src/types.ts",
+          "fileName": "src/types.ts",
           "name": "ConversationSource"
         },
         "declarations": [
           {
-            "fileName": "reachat/src/types.ts",
+            "fileName": "src/types.ts",
             "name": "ConversationSource"
           }
         ],
@@ -1758,12 +2631,12 @@
         "description": "Image URL of the source, if applicable.",
         "name": "image",
         "parent": {
-          "fileName": "reachat/src/types.ts",
+          "fileName": "src/types.ts",
           "name": "ConversationSource"
         },
         "declarations": [
           {
-            "fileName": "reachat/src/types.ts",
+            "fileName": "src/types.ts",
             "name": "ConversationSource"
           }
         ],
@@ -1809,25 +2682,6 @@
     "displayName": "SessionMessage",
     "methods": [],
     "props": {
-      "className": {
-        "defaultValue": null,
-        "description": "Class name to apply to the root element.",
-        "name": "className",
-        "parent": {
-          "fileName": "src/SessionMessages/SessionMessage/SessionMessage.tsx",
-          "name": "SessionMessageProps"
-        },
-        "declarations": [
-          {
-            "fileName": "src/SessionMessages/SessionMessage/SessionMessage.tsx",
-            "name": "SessionMessageProps"
-          }
-        ],
-        "required": false,
-        "type": {
-          "name": "string"
-        }
-      },
       "conversation": {
         "defaultValue": null,
         "description": "Conversation to render.",
@@ -1922,12 +2776,12 @@
         "description": "Name of the file",
         "name": "name",
         "parent": {
-          "fileName": "reachat/src/types.ts",
+          "fileName": "src/types.ts",
           "name": "ConversationFile"
         },
         "declarations": [
           {
-            "fileName": "reachat/src/types.ts",
+            "fileName": "src/types.ts",
             "name": "ConversationFile"
           }
         ],
@@ -1941,12 +2795,12 @@
         "description": "Type of the file",
         "name": "type",
         "parent": {
-          "fileName": "reachat/src/types.ts",
+          "fileName": "src/types.ts",
           "name": "ConversationFile"
         },
         "declarations": [
           {
-            "fileName": "reachat/src/types.ts",
+            "fileName": "src/types.ts",
             "name": "ConversationFile"
           }
         ],
@@ -1960,12 +2814,12 @@
         "description": "Size of the file",
         "name": "size",
         "parent": {
-          "fileName": "reachat/src/types.ts",
+          "fileName": "src/types.ts",
           "name": "ConversationFile"
         },
         "declarations": [
           {
-            "fileName": "reachat/src/types.ts",
+            "fileName": "src/types.ts",
             "name": "ConversationFile"
           }
         ],
@@ -1979,12 +2833,12 @@
         "description": "URL of the file",
         "name": "url",
         "parent": {
-          "fileName": "reachat/src/types.ts",
+          "fileName": "src/types.ts",
           "name": "ConversationFile"
         },
         "declarations": [
           {
-            "fileName": "reachat/src/types.ts",
+            "fileName": "src/types.ts",
             "name": "ConversationFile"
           }
         ],