feat: Add histoire for component playground (#10256)

We will use
[histoire](https://histoire.dev/guide/vue3/getting-started.html) for
component development. I've locked the version to 0.17.15 as it had
issues in the latest versions.

Run the following commands to start the development server.

```bash
# Start the development server
pnpm story:dev

# Build the assets to deploy it to website
pnpm story:build

# View the production version of the build
pnpm story:preview
```

histoire.config.ts

@@ -0,0 +1,43 @@
+import { defineConfig } from 'histoire';
+import { HstVue } from '@histoire/plugin-vue';
+
+export default defineConfig({
+  setupFile: './histoire.setup.ts',
+  plugins: [HstVue()],
+  vite: {
+    server: {
+      port: 6179,
+    },
+  },
+  viteIgnorePlugins: ['vite-plugin-ruby'],
+  theme: {
+    darkClass: 'dark',
+    title: '@chatwoot/design',
+    logo: {
+      square: './design-system/images/logo-thumbnail.svg',
+      light: './design-system/images/logo.png',
+      dark: './design-system/images/logo-dark.png',
+    },
+  },
+  defaultStoryProps: {
+    icon: 'carbon:cube',
+    iconColor: '#1F93FF',
+    layout: {
+      type: 'grid',
+      width: '80%',
+    },
+  },
+  tree: {
+    groups: [
+      {
+        id: 'top',
+        title: '',
+      },
+      {
+        id: 'components',
+        title: 'Components',
+        include: () => true,
+      },
+    ],
+  },
+});