reachat 2.0.1 → 2.1.0-alpha.1

package/dist/stories/assets/placeholder.svg

@@ -0,0 +1,258 @@
+<svg width="588" height="455" viewBox="0 0 588 455" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <g opacity="0.9">
+    <mask id="mask0_145_3499" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0"
+      width="588" height="485">
+      <ellipse cx="294" cy="242.198" rx="293.282" ry="241.998" fill="url(#paint0_radial_145_3499)" />
+    </mask>
+    <g mask="url(#mask0_145_3499)">
+      <g filter="url(#filter0_f_145_3499)">
+        <rect x="112" y="26.5" width="364" height="382.5" fill="url(#paint1_angular_145_3499)" />
+      </g>
+      <rect x="129.75" y="330.75" width="328.5" height="62.5" rx="19.25" fill="#F8F8F8"
+        fill-opacity="0.01" />
+      <rect x="129.75" y="330.75" width="328.5" height="62.5" rx="19.25" stroke="#E2E2EA"
+        stroke-width="1.5" />
+      <g filter="url(#filter1_bi_145_3499)">
+        <rect x="145" y="338" width="48" height="48" rx="10" fill="url(#paint2_linear_145_3499)"
+          fill-opacity="0.2" />
+      </g>
+      <rect x="216.947" y="356" width="56" height="4" rx="2" fill="url(#paint3_linear_145_3499)"
+        fill-opacity="0.5" />
+      <rect opacity="0.6" x="216.947" y="364" width="104" height="4" rx="2"
+        fill="url(#paint4_linear_145_3499)" fill-opacity="0.5" />
+      <rect x="129.75" y="258.75" width="328.5" height="62.5" rx="19.25" fill="#F8F8F8"
+        fill-opacity="0.01" />
+      <rect x="129.75" y="258.75" width="328.5" height="62.5" rx="19.25" stroke="#E2E2EA"
+        stroke-width="1.5" />
+      <g filter="url(#filter2_bi_145_3499)">
+        <rect x="145" y="266" width="48" height="48" rx="10" fill="url(#paint5_linear_145_3499)"
+          fill-opacity="0.3" />
+      </g>
+      <rect x="217" y="284" width="56" height="4" rx="2" fill="url(#paint6_linear_145_3499)"
+        fill-opacity="0.5" />
+      <rect opacity="0.6" x="217" y="292" width="104" height="4" rx="2"
+        fill="url(#paint7_linear_145_3499)" fill-opacity="0.5" />
+      <g filter="url(#filter3_d_145_3499)">
+        <rect x="129" y="186" width="330" height="64" rx="20" fill="#F8F8F8" fill-opacity="0.01"
+          shape-rendering="crispEdges" />
+        <rect x="129.75" y="186.75" width="328.5" height="62.5" rx="19.25" stroke="#C6CBD9"
+          stroke-width="1.5" shape-rendering="crispEdges" />
+        <g filter="url(#filter4_bi_145_3499)">
+          <rect x="145" y="194" width="48" height="48" rx="10" fill="url(#paint8_linear_145_3499)"
+            fill-opacity="0.3" />
+        </g>
+        <rect x="217" y="212" width="56" height="4" rx="2" fill="url(#paint9_linear_145_3499)"
+          fill-opacity="0.5" />
+        <rect opacity="0.6" x="217" y="220" width="104" height="4" rx="2"
+          fill="url(#paint10_linear_145_3499)" fill-opacity="0.5" />
+      </g>
+      <rect x="129.75" y="114.75" width="328.5" height="62.5" rx="19.25" fill="#F8F8F8"
+        fill-opacity="0.01" />
+      <rect x="129.75" y="114.75" width="328.5" height="62.5" rx="19.25" stroke="#E2E2EA"
+        stroke-width="1.5" />
+      <g filter="url(#filter5_bi_145_3499)">
+        <rect x="145" y="122" width="48" height="48" rx="10" fill="url(#paint11_linear_145_3499)"
+          fill-opacity="0.4" />
+      </g>
+      <rect x="216.947" y="140" width="56" height="4" rx="2" fill="url(#paint12_linear_145_3499)"
+        fill-opacity="0.5" />
+      <rect opacity="0.6" x="216.947" y="148" width="104" height="4" rx="2"
+        fill="url(#paint13_linear_145_3499)" fill-opacity="0.5" />
+      <rect x="129.75" y="42.75" width="328.5" height="62.5" rx="19.25" fill="#F8F8F8"
+        fill-opacity="0.01" />
+      <rect x="129.75" y="42.75" width="328.5" height="62.5" rx="19.25" stroke="#E2E2EA"
+        stroke-width="1.5" />
+      <g filter="url(#filter6_bi_145_3499)">
+        <rect x="145" y="50" width="48" height="48" rx="10" fill="url(#paint14_linear_145_3499)"
+          fill-opacity="0.2" />
+      </g>
+      <rect x="216.947" y="68" width="56" height="4" rx="2" fill="url(#paint15_linear_145_3499)"
+        fill-opacity="0.5" />
+      <rect opacity="0.6" x="216.947" y="76" width="104" height="4" rx="2"
+        fill="url(#paint16_linear_145_3499)" fill-opacity="0.5" />
+      <rect x="112.75" y="27.75" width="362.5" height="380.5" rx="19.25" stroke="#E2E2EA"
+        stroke-width="1.5" />
+    </g>
+  </g>
+  <defs>
+    <filter id="filter0_f_145_3499" x="-12" y="-97.5" width="612" height="630.5"
+      filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix" />
+      <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape" />
+      <feGaussianBlur stdDeviation="62" result="effect1_foregroundBlur_145_3499" />
+    </filter>
+    <filter id="filter1_bi_145_3499" x="85.1316" y="278.132" width="167.737" height="167.737"
+      filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix" />
+      <feGaussianBlur in="BackgroundImageFix" stdDeviation="29.9342" />
+      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_145_3499" />
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_145_3499" result="shape" />
+      <feColorMatrix in="SourceAlpha" type="matrix"
+        values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" />
+      <feOffset dx="1.19737" dy="2.39474" />
+      <feGaussianBlur stdDeviation="4.78947" />
+      <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
+      <feColorMatrix type="matrix"
+        values="0 0 0 0 0.972549 0 0 0 0 0.972549 0 0 0 0 0.972549 0 0 0 0.06 0" />
+      <feBlend mode="normal" in2="shape" result="effect2_innerShadow_145_3499" />
+    </filter>
+    <filter id="filter2_bi_145_3499" x="85.1316" y="206.132" width="167.737" height="167.737"
+      filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix" />
+      <feGaussianBlur in="BackgroundImageFix" stdDeviation="29.9342" />
+      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_145_3499" />
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_145_3499" result="shape" />
+      <feColorMatrix in="SourceAlpha" type="matrix"
+        values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" />
+      <feOffset dx="1.19737" dy="2.39474" />
+      <feGaussianBlur stdDeviation="4.78947" />
+      <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
+      <feColorMatrix type="matrix"
+        values="0 0 0 0 0.972549 0 0 0 0 0.972549 0 0 0 0 0.972549 0 0 0 0.06 0" />
+      <feBlend mode="normal" in2="shape" result="effect2_innerShadow_145_3499" />
+    </filter>
+    <filter id="filter3_d_145_3499" x="113" y="174" width="362" height="96"
+      filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix" />
+      <feColorMatrix in="SourceAlpha" type="matrix"
+        values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" />
+      <feOffset dy="4" />
+      <feGaussianBlur stdDeviation="8" />
+      <feComposite in2="hardAlpha" operator="out" />
+      <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.2 0" />
+      <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_145_3499" />
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_145_3499" result="shape" />
+    </filter>
+    <filter id="filter4_bi_145_3499" x="85.1316" y="134.132" width="167.737" height="167.737"
+      filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix" />
+      <feGaussianBlur in="BackgroundImageFix" stdDeviation="29.9342" />
+      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_145_3499" />
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_145_3499" result="shape" />
+      <feColorMatrix in="SourceAlpha" type="matrix"
+        values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" />
+      <feOffset dx="1.19737" dy="2.39474" />
+      <feGaussianBlur stdDeviation="4.78947" />
+      <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
+      <feColorMatrix type="matrix"
+        values="0 0 0 0 0.972549 0 0 0 0 0.972549 0 0 0 0 0.972549 0 0 0 0.06 0" />
+      <feBlend mode="normal" in2="shape" result="effect2_innerShadow_145_3499" />
+    </filter>
+    <filter id="filter5_bi_145_3499" x="85.1316" y="62.1316" width="167.737" height="167.737"
+      filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix" />
+      <feGaussianBlur in="BackgroundImageFix" stdDeviation="29.9342" />
+      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_145_3499" />
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_145_3499" result="shape" />
+      <feColorMatrix in="SourceAlpha" type="matrix"
+        values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" />
+      <feOffset dx="1.19737" dy="2.39474" />
+      <feGaussianBlur stdDeviation="4.78947" />
+      <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
+      <feColorMatrix type="matrix"
+        values="0 0 0 0 0.972549 0 0 0 0 0.972549 0 0 0 0 0.972549 0 0 0 0.06 0" />
+      <feBlend mode="normal" in2="shape" result="effect2_innerShadow_145_3499" />
+    </filter>
+    <filter id="filter6_bi_145_3499" x="85.1316" y="-9.86842" width="167.737" height="167.737"
+      filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix" />
+      <feGaussianBlur in="BackgroundImageFix" stdDeviation="29.9342" />
+      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_145_3499" />
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_145_3499" result="shape" />
+      <feColorMatrix in="SourceAlpha" type="matrix"
+        values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" />
+      <feOffset dx="1.19737" dy="2.39474" />
+      <feGaussianBlur stdDeviation="4.78947" />
+      <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
+      <feColorMatrix type="matrix"
+        values="0 0 0 0 0.972549 0 0 0 0 0.972549 0 0 0 0 0.972549 0 0 0 0.06 0" />
+      <feBlend mode="normal" in2="shape" result="effect2_innerShadow_145_3499" />
+    </filter>
+    <radialGradient id="paint0_radial_145_3499" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse"
+      gradientTransform="translate(294 242.198) rotate(90) scale(283.542 343.63)">
+      <stop stop-color="#D9D9D9" />
+      <stop offset="1" stop-color="#02020F" stop-opacity="0" />
+    </radialGradient>
+    <radialGradient id="paint1_angular_145_3499" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse"
+      gradientTransform="translate(294 217.75) rotate(90) scale(191.25 182)">
+      <stop offset="0.352013" stop-color="white" stop-opacity="0" />
+      <stop offset="0.49798" stop-color="white" stop-opacity="0.15" />
+      <stop offset="0.648457" stop-color="white" stop-opacity="0" />
+    </radialGradient>
+    <linearGradient id="paint2_linear_145_3499" x1="169" y1="338" x2="169" y2="386"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#36466D" />
+      <stop offset="1" stop-color="#2D3A5D" />
+    </linearGradient>
+    <linearGradient id="paint3_linear_145_3499" x1="244.947" y1="356" x2="244.947" y2="360"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#36466D" />
+      <stop offset="1" stop-color="#2D3A5D" />
+    </linearGradient>
+    <linearGradient id="paint4_linear_145_3499" x1="268.947" y1="364" x2="268.947" y2="368"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#36466D" />
+      <stop offset="1" stop-color="#2D3A5D" />
+    </linearGradient>
+    <linearGradient id="paint5_linear_145_3499" x1="169" y1="266" x2="169" y2="314"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#36466D" />
+      <stop offset="1" stop-color="#2D3A5D" />
+    </linearGradient>
+    <linearGradient id="paint6_linear_145_3499" x1="245" y1="284" x2="245" y2="288"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#36466D" />
+      <stop offset="1" stop-color="#2D3A5D" />
+    </linearGradient>
+    <linearGradient id="paint7_linear_145_3499" x1="269" y1="292" x2="269" y2="296"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#36466D" />
+      <stop offset="1" stop-color="#2D3A5D" />
+    </linearGradient>
+    <linearGradient id="paint8_linear_145_3499" x1="169" y1="194" x2="169" y2="242"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#36466D" />
+      <stop offset="1" stop-color="#2D3A5D" />
+    </linearGradient>
+    <linearGradient id="paint9_linear_145_3499" x1="245" y1="212" x2="245" y2="216"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#36466D" />
+      <stop offset="1" stop-color="#2D3A5D" />
+    </linearGradient>
+    <linearGradient id="paint10_linear_145_3499" x1="269" y1="220" x2="269" y2="224"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#36466D" />
+      <stop offset="1" stop-color="#2D3A5D" />
+    </linearGradient>
+    <linearGradient id="paint11_linear_145_3499" x1="169" y1="122" x2="169" y2="170"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#36466D" />
+      <stop offset="1" stop-color="#2D3A5D" />
+    </linearGradient>
+    <linearGradient id="paint12_linear_145_3499" x1="244.947" y1="140" x2="244.947" y2="144"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#36466D" />
+      <stop offset="1" stop-color="#2D3A5D" />
+    </linearGradient>
+    <linearGradient id="paint13_linear_145_3499" x1="268.947" y1="148" x2="268.947" y2="152"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#36466D" />
+      <stop offset="1" stop-color="#2D3A5D" />
+    </linearGradient>
+    <linearGradient id="paint14_linear_145_3499" x1="169" y1="50" x2="169" y2="98"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#36466D" />
+      <stop offset="1" stop-color="#2D3A5D" />
+    </linearGradient>
+    <linearGradient id="paint15_linear_145_3499" x1="244.947" y1="68" x2="244.947" y2="72"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#36466D" />
+      <stop offset="1" stop-color="#2D3A5D" />
+    </linearGradient>
+    <linearGradient id="paint16_linear_145_3499" x1="268.947" y1="76" x2="268.947" y2="80"
+      gradientUnits="userSpaceOnUse">
+      <stop stop-color="#36466D" />
+      <stop offset="1" stop-color="#2D3A5D" />
+    </linearGradient>
+  </defs>
+</svg>

package/dist/stories/assets/search.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-search"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/></svg>

package/dist/stories/examples.ts

@@ -0,0 +1,267 @@
+import { Session } from '@/types';
+import { subHours } from 'date-fns';
+
+export const fakeSessions: Session[] = [
+  {
+    id: '1',
+    title: 'Session 1',
+    createdAt: new Date(),
+    updatedAt: new Date(),
+    conversations: [
+      {
+        id: '1',
+        question: 'What is React?',
+        response: 'React is a JavaScript library for building user interfaces.',
+        createdAt: new Date(),
+        updatedAt: new Date()
+      },
+      {
+        id: '2',
+        question: 'What is JSX?',
+        response: 'JSX is a syntax extension for JavaScript.',
+        createdAt: new Date(),
+        updatedAt: new Date()
+      }
+    ]
+  },
+  {
+    id: '2',
+    title: 'Session 2',
+    createdAt: new Date(),
+    updatedAt: new Date(),
+    conversations: [
+      {
+        id: '1',
+        question: 'What is TypeScript?',
+        response: 'TypeScript is a typed superset of JavaScript.',
+        createdAt: new Date(),
+        updatedAt: new Date()
+      },
+      {
+        id: '2',
+        question: 'What is a component?',
+        response: 'A component is a reusable piece of UI.',
+        createdAt: new Date(),
+        updatedAt: new Date()
+      }
+    ]
+  }
+];
+
+export const sessionsWithFiles: Session[] = [
+  {
+    id: 'session-files',
+    title: 'Session with Files',
+    createdAt: new Date(),
+    updatedAt: new Date(),
+    conversations: [
+      {
+        id: '1',
+        question: 'Here are some files I uploaded',
+        response:
+          'Ive received your files. Let me know if you have any questions about them.',
+        createdAt: new Date(),
+        updatedAt: new Date(),
+        files: [
+          { name: 'document.pdf', size: 1024000, type: 'application/pdf' },
+          {
+            name: 'report.docx',
+            size: 512000,
+            type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
+          }
+        ]
+      }
+    ]
+  }
+];
+
+export const sessionWithSources: Session[] = [
+  {
+    id: 'session-sources',
+    title: 'Session with Sources',
+    createdAt: subHours(new Date(), 1),
+    updatedAt: new Date(),
+    conversations: [
+      {
+        id: 'conversation-1',
+        question: 'What are the main causes of climate change?',
+        response: `Climate change is primarily caused by human activities that release greenhouse gases into the atmosphere. The main causes include:
+
+1. Burning of fossil fuels (coal, oil, and natural gas)
+2. Deforestation and land-use changes
+3. Industrial processes
+4. Agriculture and livestock farming
+
+These activities increase the concentration of greenhouse gases in the atmosphere, leading to the greenhouse effect and global warming.`,
+        createdAt: new Date(),
+        updatedAt: new Date(),
+        sources: [
+          {
+            title: 'NASA: Causes of Climate Change',
+            image:
+              'https://upload.wikimedia.org/wikipedia/commons/thumb/e/e5/NASA_logo.svg/1224px-NASA_logo.svg.png',
+            url: 'https://climate.nasa.gov/causes/'
+          },
+          {
+            title:
+              'IPCC: Climate Change 2021: The Physical Science Basis and Global Warming Is the Last War We will Fight',
+            url: 'https://www.ipcc.ch/report/ar6/wg1/'
+          }
+        ]
+      }
+    ]
+  }
+];
+
+export const fakeSessionsWithEmbeds: Session[] = [
+  {
+    id: '1',
+    title: 'Session with Embeds',
+    createdAt: new Date(),
+    updatedAt: new Date(),
+    conversations: [
+      {
+        id: '1',
+        question: 'Can you show me a video about React?',
+        response: `
+## Watch this video
+
+https://youtu.be/enTFE2c68FQ
+
+https://www.youtube.com/watch?v=enTFE2c68FQ
+
+These links showcase a video about React basics. You can click on either link to watch the video.`,
+        createdAt: new Date(),
+        updatedAt: new Date()
+      },
+      {
+        id: '2',
+        question: 'Do you have another video recommendation?',
+        response: `
+Certainly! Here's another great video about web development:
+
+## Check out this tutorial
+
+https://www.youtube.com/watch?v=dQw4w9WgXcQ
+
+This video covers some interesting web development concepts.`,
+        createdAt: new Date(),
+        updatedAt: new Date()
+      }
+    ]
+  }
+];
+
+export const sessionsWithPartialConversation: Session[] = [
+  {
+    id: '1',
+    title: 'Session with Partial Conversation',
+    createdAt: new Date(),
+    updatedAt: new Date(),
+    conversations: [
+      {
+        id: '1',
+        question: 'What is the capital of France?',
+        response: 'The capital of France is Paris.',
+        createdAt: new Date(),
+        updatedAt: new Date()
+      },
+      {
+        id: '2',
+        question: 'What is the largest planet in our solar system?',
+        response: null, // No response yet
+        createdAt: new Date(),
+        updatedAt: new Date()
+      }
+    ]
+  }
+];
+
+export const sessionWithDataDocs: Session[] = [
+  {
+    id: '1',
+    title: 'Session with Partial Conversation',
+    createdAt: new Date(),
+    updatedAt: new Date(),
+    conversations: [
+      {
+        id: '1',
+        question: 'Summarize the contents of the CSV.',
+        response: 'The CSV file contains a dataset with the following columns: Name, Age, Occupation, and City.',
+        createdAt: new Date(),
+        updatedAt: new Date(),
+        files: [
+          { name: 'sample.csv', size: 1024000, type: 'text/csv' }
+        ]
+      },
+      {
+        id: '2',
+        question: 'How does this data align with this PDF?',
+        response: null, // No response yet
+        createdAt: new Date(),
+        updatedAt: new Date(),
+        files: [
+          { name: 'document.pdf', size: 1024000, type: 'application/pdf' },
+        ]
+      }
+    ]
+  }
+];
+
+export const sessionWithCSVFiles: Session[] = [
+  {
+    id: '1',
+    title: 'Session with Partial Conversation',
+    createdAt: new Date(),
+    updatedAt: new Date(),
+    conversations: [
+      {
+        id: '1',
+        question: 'Summarize the contents of the CSV.',
+        response: 'The CSV file contains a dataset with the following columns: Name, HEX, RGB.',
+        createdAt: new Date(),
+        updatedAt: new Date(),
+        files: [
+          { name: 'sample.csv', size: 500, type: 'text/csv', url: 'https://gist.githubusercontent.com/RobVanGroenewoud/ba89ad7684df8cefe5c183adb498cc65/raw/f2eec6d2cb89f5d779e16b28ed0dab89d738ba96/sample.csv' }
+        ]
+      },
+      {
+        id: '2',
+        question: 'How does this data align with this PDF?',
+        response: null, // No response yet
+        createdAt: new Date(),
+        updatedAt: new Date(),
+        files: [
+          { name: 'document.pdf', size: 1024000, type: 'application/pdf' },
+        ]
+      }
+    ]
+  }
+];
+
+export const chatTemplates = [
+  {
+    id: '1',
+    title: 'Explore Components',
+    message: "Can you show me the main components available in Reachat?",
+    icon: 'SendPlane'
+  },
+  {
+    id: '2',
+    title: 'Customize Chat UI',
+    message: "How can I customize the appearance of my Reachat interface?",
+    icon: 'SendPlane'
+  },
+  {
+    id: '3',
+    title: 'Manage Sessions',
+    message: "What are the best practices for managing chat sessions in Reachat?",
+    icon: 'SendPlane'
+  },
+  {
+    id: '4',
+    title: 'Tailwind Setup',
+    message: "How do I properly set up Tailwind CSS with Reachat?",
+    icon: 'SendPlane'
+  }
+];

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "reachat",
-  "version": "2.0.1",
+  "version": "2.1.0-alpha.1",
   "description": "Chat UI for Building LLMs",
   "scripts": {
     "build-storybook": "storybook build",
-    "build": "npm run build:js && npm run build:styles && npm run build:docs",
+    "build": "npm run build:js && npm run build:styles && npm run build:docs && npm run rewrite:stories",
     "build:js": "vite build --mode library",
     "build:docs": "node scripts/docs.js",
     "build:styles": "npx @tailwindcss/cli -i ./src/index.css -o ./dist/index.css",
@@ -12,6 +12,7 @@
     "lint:fix": "eslint --ext js,ts,tsx --fix src",
     "lint:prettier": "prettier --loglevel warn --write 'src/**/*.{ts,tsx,js,jsx}'",
     "prettier": "prettier --loglevel warn --write 'src/**/*.{ts,tsx,js,jsx}'",
+    "rewrite:stories": "node scripts/stories.cjs",
     "start": "storybook dev -p 9009",
     "test": "vitest --passWithNoTests",
     "test:coverage": "vitest run --coverage --passWithNoTests",
@@ -33,6 +34,7 @@
       "require": "./dist/index.umd.cjs"
     },
     "./docs.json": "./dist/docs.json",
+    "./stories/*": "./dist/stories/*",
     "./index.css": "./dist/index.css"
   },
   "browser": "dist/index.js",
@@ -45,9 +47,9 @@
     "katex": "^0.16.11",
     "mdast-util-find-and-replace": "^3.0.1",
     "motion": "^12.4.2",
-    "reablocks": "^9.0.0",
+    "reablocks": "10.0.0-alpha.3",
     "react-markdown": "^9.0.3",
-    "react-syntax-highlighter": "^15.5.0",
+    "react-syntax-highlighter": "^15.6.1",
     "reakeys": "^2.0.3",
     "rehype-katex": "^7.0.0",
     "remark-gfm": "^4.0.0",
@@ -105,10 +107,12 @@
     "tailwindcss": "^4.0.0",
     "tw-colors": "^3.3.1",
     "typescript": "^4.9.5",
+    "typescript-rewrite-paths": "^1.3.1",
     "vite": "^5.2.2",
     "vite-plugin-checker": "^0.8.0",
     "vite-plugin-css-injected-by-js": "^3.5.0",
     "vite-plugin-dts": "^4.5.0",
+    "vite-plugin-static-copy": "^3.1.1",
     "vite-plugin-svgr": "^4.2.0",
     "vite-tsconfig-paths": "^4.3.2",
     "vitest": "^1.4.0"