@elia-assistant/chatui 1.0.24 → 1.0.26

package/README.md

@@ -65,10 +65,11 @@ const instance = createChat({
 
 - **n8n webhook compatible** — same parameters as `@n8n/chat`; works with any Chat Trigger out of the box
 - **Three display modes** — `fullscreen`, `window` (floating button + popup), or `mixed` (window on desktop, fullscreen on mobile)
+- **Left/right positioning** — `position: 'left'` anchors the floating button and chat window to the left side of the screen
 - **Bottom-sheet style** — opt-in `fullscreenSheet` mode covers ~3/4 of the screen with a rounded top instead of going edge-to-edge
 - **Optional tabs** — surface a Notifications feed (URL or inline JSON) and a searchable FAQ alongside the chat
 - **SSE streaming** — optional word-by-word bot responses
-- **10 built-in themes** — Midnight, Ivory, Sunrise, Cosmos, Forest, Ocean, Cherry, Navy, Lavender, Amber; switch at runtime
+- **16 built-in themes** — Sunrise, Ivory, Cherry, Sky, Lavender, Nice, Navy, Amber, Slate, Graphite, Stone, Cosmos, Forest, Ocean, Cherry Dark, Midnight; switch at runtime
 - **30 built-in avatars** + file upload (max 500 KB) or URL — same picker for the floating button icon
 - **CTA popup** — timed speech-bubble with optional Web Audio notification, window mode only
 - **Conversation history** — optional sidebar with persistent multi-session history
@@ -107,7 +108,8 @@ All options live on `ChatConfig`. Set them once at boot via `setConfig()` (or pa
 
 | Parameter | Type | Default | Description |
 |---|---|---|---|
-| `mode` | `'fullscreen' \| 'window' \| 'mixed'` | `'fullscreen'` | Display mode |
+| `mode` | `'fullscreen' \| 'window' \| 'mixed'` | `'window'` | Display mode |
+| `position` | `'right' \| 'left'` | `'right'` | Side of the screen the floating widget is anchored to (window / mixed mode) |
 | `fullscreenSheet` | `boolean` | `false` | Render fullscreen as a bottom sheet (rounded top, dimmed backdrop) |
 | `fullscreenSheetHeight` | `string` | `'75vh'` | Sheet height as any CSS length |
 | `showWelcomeScreen` | `boolean` | `true` | Show welcome screen when no messages |
@@ -170,16 +172,22 @@ Resolution chain: `i18n[activeLang].X` -> `i18n['en'].X` -> global `config.X`.
 
 | ID | Name | Style | Accent |
 |---|---|---|---|
-| `midnight` | Midnight | Dark | Indigo `#6366f1` |
-| `ivory` | Ivory | Light | Indigo `#4338ca` |
 | `sunrise` | Sunrise | Light | Orange `#f97316` |
-| `cosmos` | Cosmos | Dark | Purple `#a855f7` |
-| `forest` | Forest | Dark | Green `#22c55e` |
-| `ocean` | Ocean | Dark | Cyan `#06b6d4` |
+| `ivory` | Ivory | Light | Indigo `#4338ca` |
 | `cherry` | Cherry | Light | Red `#ef4444` |
-| `navy` | Navy | Dark | Blue `#3b82f6` |
+| `sky` | Sky | Light | Blue `#5ba1da` |
 | `lavender` | Lavender | Light | Violet `#8b5cf6` |
+| `nice` | Nice | Light | Cyan `#3f7e83` |
+| `navy` | Navy | Light | Blue `#ebf3f2` |
 | `amber` | Amber | Dark | Amber `#f59e0b` |
+| `slate` | Slate | Light | Blue `#38bdf8` |
+| `graphite` | Graphite | Blue `#4185eb` |
+| `stone` | Stone | Light | Orange `#fbbf24` |
+| `cosmos` | Cosmos | Dark | Purple `#a855f7` |
+| `forest` | Forest | Dark | Green `#22c55e` |
+| `ocean` | Ocean | Dark | Cyan `#06b6d4` |
+| `cherryDark` | Cherry Dark | Dark | Red `#ef4444` |
+| `midnight` | Midnight | Dark | Indigo `#6366f1` |
 
 Defined in `src/themes.ts` — add your own by appending to the array.
 

package/dist/assets/avatars/index.d.ts

@@ -1,5 +1,9 @@
 export declare const builtInAvatars: Record<string, string>;
 export declare const builtInAvatarIds: string[];
+export declare const WHITE_BG_AVATARS: Set<string>;
+export declare const THEME_BG_AVATARS: Set<string>;
+/** Returns the CSS background value for an avatar container based on the avatar type. */
+export declare function avatarContainerBg(key: string | undefined): string;
 /** Returns the effective avatar key after resolving fallbacks.
  *  Unknown built-in IDs (e.g. a removed avatar) normalise to 'bubble'.
  *  External URLs are returned as-is. */