dev-sergio-chat-widget v1.0.0

Chat Widget

A customizable chat widget for modern web applications. Supports React, Vue, and Angular.

Installation

npm install @stackblitz/chat-widget

Usage

React

import { ChatWidget, ThemeProvider, createTheme } from '@stackblitz/chat-widget';

function App() {
  const theme = createTheme('#3B82F6', '#F3F4F6');

  return (
    <ThemeProvider theme={theme}>
      <ChatWidget />
    </ThemeProvider>
  );
}

Vue

<template>
  <ChatWidget 
    primaryColor="#3B82F6"
    secondaryColor="#F3F4F6"
  />
</template>

<script>
import { ChatWidget } from '@stackblitz/chat-widget/vue';

export default {
  components: {
    ChatWidget
  }
};
</script>

Angular

import { ChatWidgetComponent } from '@stackblitz/chat-widget/angular';

@Component({
  selector: 'app-root',
  template: `
    <chat-widget
      primaryColor="#3B82F6"
      secondaryColor="#F3F4F6"
    ></chat-widget>
  `,
  imports: [ChatWidgetComponent],
  standalone: true
})
export class AppComponent {}

Configuration

Theme Options

• primaryColor: The main color for the chat widget (default: '#3B82F6')
• secondaryColor: The secondary color for messages (default: '#F3F4F6')

License

MIT