@asgard-js/react 0.0.20 → 0.0.22

package/README.md

@@ -15,38 +15,77 @@ yarn add @asgard-js/core @asgard-js/react
 Here's a basic example of how to use the React components:
 
 ```javascript
-import React from 'react';
+import React, { useRef } from 'react';
 import { Chatbot } from '@asgard-js/react';
 
+const chatbotRef = useRef(null);
+
 const App = () => {
   return (
-    <Chatbot
-      title="Asgard AI Chatbot"
-      config={{
-        apiKey: 'your-api-key',
-        endpoint: 'https://api.asgard-ai.com/ns/{namespace}/bot-provider/{botProviderId}/message/sse',
-        botProviderEndpoint: 'https://api.asgard-ai.com/ns/{namespace}/bot-provider/{botProviderId}',
-        onExecutionError: (error) => {
-          console.error('Execution error:', error);
-        },
-        transformSsePayload: (payload) => {
-          return payload;
+    <div style={{ width: '800px', position: 'relative' }}>
+      <button
+        style={{
+          position: 'absolute',
+          top: '80px',
+          right: '50%',
+          transform: 'translateX(50%)',
+          zIndex: 10,
+          border: '1px solid white',
+          borderRadius: '5px',
+          color: 'white',
+          backgroundColor: 'transparent',
+          cursor: 'pointer',
+          padding: '0.5rem 1rem',
+        }}
+        onClick={() =>
+          chatbotRef.current?.serviceContext?.sendMessage?.({ text: 'Hello' })
         }
-      }}
-      enableLoadConfigFromService={true}
-      customChannelId="your-channel-id"
-      initMessages={[]}
-      debugMode={false}
-      fullScreen={false}
-      avatar="https://example.com/avatar.png"
-      botTypingPlaceholder="Bot is typing..."
-      onReset={() => {
-        console.log('Chat reset');
-      }}
-      onClose={() => {
-        console.log('Chat closed');
-      }}
-    />
+      >
+        Send a message from outside of chatbot
+      </button>
+      <Chatbot
+        ref={chatbotRef}
+        title="Asgard AI Chatbot"
+        config={{
+          apiKey: 'your-api-key',
+          endpoint:
+            'https://api.asgard-ai.com/ns/{namespace}/bot-provider/{botProviderId}/message/sse',
+          botProviderEndpoint:
+            'https://api.asgard-ai.com/ns/{namespace}/bot-provider/{botProviderId}',
+          onExecutionError: (error) => {
+            console.error('Execution error:', error);
+          },
+          transformSsePayload: (payload) => {
+            return payload;
+          },
+        }}
+        enableLoadConfigFromService={true}
+        customChannelId="your-channel-id"
+        initMessages={[]}
+        debugMode={false}
+        fullScreen={false}
+        avatar="https://example.com/avatar.png"
+        botTypingPlaceholder="Bot is typing..."
+        onReset={() => {
+          console.log('Chat reset');
+        }}
+        onClose={() => {
+          console.log('Chat closed');
+        }}
+        onSseMessage={(response, ctx) => {
+          if (response.eventType === 'asgard.run.done') {
+            console.log('onSseMessage', response, ctx.conversation);
+
+            setTimeout(() => {
+              // delay some time to wait for the serviceContext to be available
+              chatbotRef.current?.serviceContext?.sendMessage?.({
+                text: 'Say hi after 5 seconds',
+              });
+            }, 5000);
+          }
+        }}
+      />
+    </div>
   );
 };
 
@@ -74,37 +113,82 @@ export default App;
 - **theme**: `Partial<AsgardThemeContextValue>` - Custom theme configuration
 - **onReset**: `() => void` - Callback function when chat is reset
 - **onClose**: `() => void` - Callback function when chat is closed
+- **onSseMessage**: `(response: SseResponse, ctx: AsgardServiceContextValue) => void` - Callback function when SSE message is received. It would be helpful if using with the ref to provide some context and conversation data and do some proactively actions like sending messages to the bot.
+- **ref**: `ForwardedRef<ChatbotRef>` - Forwarded ref to access the chatbot instance. It can be used to access the chatbot instance and do some actions like sending messages to the bot. ChatbotRef extends the ref of the chatbot instance and provides some additional methods like `serviceContext.sendMessage` to interact with the chatbot instance.
 
 ### Theme Configuration
+
 The theme configuration can be obtained from the bot provider metadata of `annotations` field and `theme` props.
 
 The priority of themes is as follows (high to low):
+
 1. Theme from props
 2. Theme from annotations from bot provider metadata
 3. Default theme
 
 ```typescript
-interface AsgardThemeContextValue {
-  chatbot: {
-    width?: string;
-    height?: string;
-    maxWidth?: string;
-    minWidth?: string;
-    maxHeight?: string;
-    minHeight?: string;
-    backgroundColor?: string;
-    borderColor?: string;
-    borderRadius?: string;
-    contentMaxWidth?: string;
-  };
-  botMessage: {
-    color?: string;
-    backgroundColor?: string;
-  };
-  userMessage: {
-    color?: string;
-    backgroundColor?: string;
+export interface AsgardThemeContextValue {
+  chatbot: Pick<
+    CSSProperties,
+    | 'width'
+    | 'height'
+    | 'maxWidth'
+    | 'minWidth'
+    | 'maxHeight'
+    | 'minHeight'
+    | 'backgroundColor'
+    | 'borderColor'
+    | 'borderRadius'
+  > & {
+    contentMaxWidth?: CSSProperties['maxWidth'];
+    style?: CSSProperties;
+    header?: Partial<{
+      style: CSSProperties;
+      title: {
+        style: CSSProperties;
+      };
+    }>;
+    body?: Partial<{
+      style: CSSProperties;
+    }>;
+    footer?: Partial<{
+      style: CSSProperties;
+      textArea: {
+        style: CSSProperties;
+      };
+      submitButton: {
+        style: CSSProperties;
+      };
+      speechInputButton: {
+        style: CSSProperties;
+      };
+    }>;
   };
+  botMessage: Pick<CSSProperties, 'color' | 'backgroundColor'>;
+  userMessage: Pick<CSSProperties, 'color' | 'backgroundColor'>;
+  template?: Partial<{
+    /**
+     * first level for common/shared properties.
+     * Check MessageTemplate type for more details (packages/core/src/types/sse-response.ts).
+     */
+    quickReplies?: Partial<{
+      style: CSSProperties;
+      button: {
+        style: CSSProperties;
+      };
+    }>;
+    TextMessageTemplate: Partial<{ style: CSSProperties }>;
+    HintMessageTemplate: Partial<{ style: CSSProperties }>;
+    ImageMessageTemplate: Partial<{ style: CSSProperties }>;
+    ChartMessageTemplate: Partial<{ style: CSSProperties }>;
+    ButtonMessageTemplate: Partial<{ style: CSSProperties }>;
+    CarouselMessageTemplate: Partial<{ style: CSSProperties }>;
+
+    // Didn't implement yet
+    VideoMessageTemplate: Partial<{ style: CSSProperties }>;
+    AudioMessageTemplate: Partial<{ style: CSSProperties }>;
+    LocationMessageTemplate: Partial<{ style: CSSProperties }>;
+  }>;
 }
 ```
 
@@ -121,6 +205,28 @@ const defaultTheme = {
     borderColor: 'var(--asg-color-border)',
     borderRadius: 'var(--asg-radius-md)',
     contentMaxWidth: '1200px',
+    style: {},
+    header: {
+      style: {},
+      title: {
+        style: {},
+      },
+    },
+    body: {
+      style: {},
+    },
+    footer: {
+      style: {},
+      textArea: {
+        style: {},
+      },
+      submitButton: {
+        style: {},
+      },
+      speechInputButton: {
+        style: {},
+      },
+    },
   },
   botMessage: {
     color: 'var(--asg-color-text)',
@@ -130,7 +236,42 @@ const defaultTheme = {
     color: 'var(--asg-color-text)',
     backgroundColor: 'var(--asg-color-primary)',
   },
-}
+  template: {
+    quickReplies: {
+      style: {},
+      button: {
+        style: {},
+      },
+    },
+    TextMessageTemplate: {
+      style: {},
+    },
+    HintMessageTemplate: {
+      style: {},
+    },
+    ImageMessageTemplate: {
+      style: {},
+    },
+    VideoMessageTemplate: {
+      style: {},
+    },
+    AudioMessageTemplate: {
+      style: {},
+    },
+    LocationMessageTemplate: {
+      style: {},
+    },
+    ChartMessageTemplate: {
+      style: {},
+    },
+    ButtonMessageTemplate: {
+      style: {},
+    },
+    CarouselMessageTemplate: {
+      style: {},
+    },
+  },
+};
 ```
 
 ### Usage Example
@@ -171,6 +312,7 @@ To develop the React package locally, follow these steps:
 1. Clone the repository and navigate to the project root directory.
 
 2. Install dependencies:
+
 ```sh
 yarn install
 ```

package/dist/components/chatbot/chatbot-container/chatbot-container.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chatbot-container.d.ts","sourceRoot":"","sources":["../../../../src/components/chatbot/chatbot-container/chatbot-container.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAU,MAAM,OAAO,CAAC;AAM7D,UAAU,qBAAsB,SAAQ,iBAAiB;IACvD,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,GAAG,SAAS,CAoBxE"}
+{"version":3,"file":"chatbot-container.d.ts","sourceRoot":"","sources":["../../../../src/components/chatbot/chatbot-container/chatbot-container.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAU,MAAM,OAAO,CAAC;AAM7D,UAAU,qBAAsB,SAAQ,iBAAiB;IACvD,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,GAAG,SAAS,CA+BxE"}

package/dist/components/chatbot/chatbot-footer/chatbot-footer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chatbot-footer.d.ts","sourceRoot":"","sources":["../../../../src/components/chatbot/chatbot-footer/chatbot-footer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,SAAS,EAKV,MAAM,OAAO,CAAC;AAQf,wBAAgB,aAAa,IAAI,SAAS,CA0GzC"}
+{"version":3,"file":"chatbot-footer.d.ts","sourceRoot":"","sources":["../../../../src/components/chatbot/chatbot-footer/chatbot-footer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,SAAS,EAKV,MAAM,OAAO,CAAC;AAQf,wBAAgB,aAAa,IAAI,SAAS,CA6GzC"}

package/dist/components/chatbot/chatbot-footer/speech-input-button.d.ts

@@ -1,8 +1,9 @@
-import { Dispatch, ReactNode, SetStateAction } from 'react';
+import { Dispatch, ReactNode, SetStateAction, CSSProperties } from 'react';
 
 interface SpeechInputButtonProps {
     setValue: Dispatch<SetStateAction<string>>;
     className?: string;
+    style?: CSSProperties;
 }
 export declare function SpeechInputButton(props: SpeechInputButtonProps): ReactNode;
 export {};

package/dist/components/chatbot/chatbot-footer/speech-input-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"speech-input-button.d.ts","sourceRoot":"","sources":["../../../../src/components/chatbot/chatbot-footer/speech-input-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EAER,SAAS,EACT,cAAc,EAMf,MAAM,OAAO,CAAC;AAIf,UAAU,sBAAsB;IAC9B,QAAQ,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,GAAG,SAAS,CA6G1E"}
+{"version":3,"file":"speech-input-button.d.ts","sourceRoot":"","sources":["../../../../src/components/chatbot/chatbot-footer/speech-input-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EAER,SAAS,EACT,cAAc,EAMd,aAAa,EACd,MAAM,OAAO,CAAC;AAIf,UAAU,sBAAsB;IAC9B,QAAQ,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,GAAG,SAAS,CA8G1E"}

package/dist/components/chatbot/chatbot.d.ts

@@ -1,4 +1,4 @@
-import { AsgardTemplateContextValue } from '../../context';
+import { AsgardServiceContextValue, AsgardTemplateContextValue, AsgardServiceContextProviderProps } from '../../context';
 import { AsgardThemeContextValue } from '../../context/asgard-theme-context';
 import { ClientConfig, ConversationMessage } from '@asgard-js/core';
 import { ReactNode } from 'react';
@@ -10,6 +10,7 @@ interface ChatbotProps extends AsgardTemplateContextValue {
     config: ClientConfig;
     customChannelId: string;
     initMessages?: ConversationMessage[];
+    onSseMessage?: AsgardServiceContextProviderProps['onSseMessage'];
     fullScreen?: boolean;
     avatar?: string;
     botTypingPlaceholder?: string;
@@ -19,6 +20,9 @@ interface ChatbotProps extends AsgardTemplateContextValue {
     onClose?: () => void;
     loadingComponent?: ReactNode;
 }
-export declare function Chatbot(props: ChatbotProps): ReactNode;
+export interface ChatbotRef {
+    serviceContext?: AsgardServiceContextValue;
+}
+export declare const Chatbot: import('react').ForwardRefExoticComponent<ChatbotProps & import('react').RefAttributes<ChatbotRef>>;
 export {};
 //# sourceMappingURL=chatbot.d.ts.map

package/dist/components/chatbot/chatbot.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chatbot.d.ts","sourceRoot":"","sources":["../../../src/components/chatbot/chatbot.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,YAAY,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACpE,OAAO,EAEL,uBAAuB,EACxB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAGL,0BAA0B,EAE3B,MAAM,aAAa,CAAC;AAMrB,UAAU,YAAa,SAAQ,0BAA0B;IACvD,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,SAAS,EAAE,CAAC;IAC5B,KAAK,CAAC,EAAE,OAAO,CAAC,uBAAuB,CAAC,CAAC;IACzC,MAAM,EAAE,YAAY,CAAC;IACrB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC,iBAAiB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC;IAC3D,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,gBAAgB,CAAC,EAAE,SAAS,CAAC;CAC9B;AAED,wBAAgB,OAAO,CAAC,KAAK,EAAE,YAAY,GAAG,SAAS,CAwDtD"}
+{"version":3,"file":"chatbot.d.ts","sourceRoot":"","sources":["../../../src/components/chatbot/chatbot.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA4B,SAAS,EAAE,MAAM,OAAO,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACpE,OAAO,EAEL,uBAAuB,EACxB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAEL,yBAAyB,EAEzB,0BAA0B,EAE1B,iCAAiC,EAClC,MAAM,aAAa,CAAC;AAMrB,UAAU,YAAa,SAAQ,0BAA0B;IACvD,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,SAAS,EAAE,CAAC;IAC5B,KAAK,CAAC,EAAE,OAAO,CAAC,uBAAuB,CAAC,CAAC;IACzC,MAAM,EAAE,YAAY,CAAC;IACrB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACrC,YAAY,CAAC,EAAE,iCAAiC,CAAC,cAAc,CAAC,CAAC;IACjE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC,iBAAiB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC;IAC3D,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,gBAAgB,CAAC,EAAE,SAAS,CAAC;CAC9B;AAED,MAAM,WAAW,UAAU;IACzB,cAAc,CAAC,EAAE,yBAAyB,CAAC;CAC5C;AAED,eAAO,MAAM,OAAO,qGA8DlB,CAAC"}

package/dist/components/templates/button-template/button-template.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button-template.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/button-template/button-template.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAyB,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AAChF,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMlC,UAAU,mBAAmB;IAC3B,OAAO,EAAE,sBAAsB,CAAC;CACjC;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,GAAG,SAAS,CAkBpE"}
+{"version":3,"file":"button-template.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/button-template/button-template.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAyB,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AAChF,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOlC,UAAU,mBAAmB;IAC3B,OAAO,EAAE,sBAAsB,CAAC;CACjC;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,GAAG,SAAS,CAwBpE"}

package/dist/components/templates/button-template/card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/button-template/card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,SAAS,EAAwB,MAAM,OAAO,CAAC;AAE3E,OAAO,EAEL,qBAAqB,EACrB,uBAAuB,EACxB,MAAM,iBAAiB,CAAC;AAIzB,UAAU,SAAS;IACjB,QAAQ,EAAE,qBAAqB,GAAG,uBAAuB,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC;CAC9E;AAED,wBAAgB,IAAI,CAAC,KAAK,EAAE,SAAS,GAAG,SAAS,CA2EhD"}
+{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/button-template/card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,SAAS,EAAwB,MAAM,OAAO,CAAC;AAE3E,OAAO,EAEL,qBAAqB,EACrB,uBAAuB,EACxB,MAAM,iBAAiB,CAAC;AAIzB,UAAU,SAAS;IACjB,QAAQ,EAAE,qBAAqB,GAAG,uBAAuB,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC;CAC9E;AAED,wBAAgB,IAAI,CAAC,KAAK,EAAE,SAAS,GAAG,SAAS,CAoFhD"}

package/dist/components/templates/carousel-template/carousel-template.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"carousel-template.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/carousel-template/carousel-template.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKlC,OAAO,EAEL,sBAAsB,EACvB,MAAM,iBAAiB,CAAC;AAIzB,UAAU,qBAAqB;IAC7B,OAAO,EAAE,sBAAsB,CAAC;CACjC;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,GAAG,SAAS,CAoBxE"}
+{"version":3,"file":"carousel-template.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/carousel-template/carousel-template.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKlC,OAAO,EAEL,sBAAsB,EACvB,MAAM,iBAAiB,CAAC;AAKzB,UAAU,qBAAqB;IAC7B,OAAO,EAAE,sBAAsB,CAAC;CACjC;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,GAAG,SAAS,CAyBxE"}

package/dist/components/templates/chart-template/chart-template.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chart-template.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/chart-template/chart-template.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAqB,MAAM,OAAO,CAAC;AAIrD,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AAQzD,UAAU,kBAAkB;IAC1B,OAAO,EAAE,sBAAsB,CAAC;CACjC;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,SAAS,CA4ClE"}
+{"version":3,"file":"chart-template.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/chart-template/chart-template.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAqB,MAAM,OAAO,CAAC;AAIrD,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AASzD,UAAU,kBAAkB;IAC1B,OAAO,EAAE,sBAAsB,CAAC;CACjC;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,SAAS,CAkDlE"}

package/dist/components/templates/hint-template/hint-template.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"hint-template.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/hint-template/hint-template.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAe,MAAM,OAAO,CAAC;AAG/C,OAAO,EAEL,mBAAmB,EAEpB,MAAM,iBAAiB,CAAC;AAGzB,UAAU,iBAAiB;IACzB,OAAO,EAAE,mBAAmB,CAAC;CAC9B;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,SAAS,CA2ChE"}
+{"version":3,"file":"hint-template.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/hint-template/hint-template.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAe,MAAM,OAAO,CAAC;AAG/C,OAAO,EAEL,mBAAmB,EAEpB,MAAM,iBAAiB,CAAC;AAGzB,UAAU,iBAAiB;IACzB,OAAO,EAAE,mBAAmB,CAAC;CAC9B;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,SAAS,CA+ChE"}

package/dist/components/templates/image-template/image-template.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"image-template.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/image-template/image-template.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAI5C,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AAKzD,UAAU,kBAAkB;IAC1B,OAAO,EAAE,sBAAsB,CAAC;CACjC;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,SAAS,CAmClE"}
+{"version":3,"file":"image-template.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/image-template/image-template.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAI5C,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AAMzD,UAAU,kBAAkB;IAC1B,OAAO,EAAE,sBAAsB,CAAC;CACjC;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,SAAS,CA0ClE"}

package/dist/components/templates/quick-replies/quick-replies.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"quick-replies.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/quick-replies/quick-replies.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAe,MAAM,OAAO,CAAC;AAI/C,UAAU,iBAAiB;IACzB,YAAY,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CAClC;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,SAAS,CA4BhE"}
+{"version":3,"file":"quick-replies.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/quick-replies/quick-replies.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAe,MAAM,OAAO,CAAC;AAK/C,UAAU,iBAAiB;IACzB,YAAY,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CAClC;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,SAAS,CAiChE"}

package/dist/components/templates/template-box/template-box.d.ts

@@ -1,13 +1,15 @@
-import { ReactNode } from 'react';
+import { CSSProperties, ReactNode } from 'react';
 
 type TemplateBoxProps = {
     type: 'user';
     direction: 'horizontal';
     children: ReactNode;
+    style?: CSSProperties;
 } | {
     type: 'bot';
     direction: 'horizontal' | 'vertical';
     children: ReactNode;
+    style?: CSSProperties;
 };
 export declare function TemplateBox(props: TemplateBoxProps): ReactNode;
 export {};

package/dist/components/templates/template-box/template-box.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"template-box.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/template-box/template-box.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AAI3C,KAAK,gBAAgB,GACjB;IACE,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,YAAY,CAAC;IACxB,QAAQ,EAAE,SAAS,CAAC;CACrB,GACD;IACE,IAAI,EAAE,KAAK,CAAC;IACZ,SAAS,EAAE,YAAY,GAAG,UAAU,CAAC;IACrC,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEN,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,GAAG,SAAS,CAoB9D"}
+{"version":3,"file":"template-box.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/template-box/template-box.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AAI1D,KAAK,gBAAgB,GACjB;IACE,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,YAAY,CAAC;IACxB,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB,GACD;IACE,IAAI,EAAE,KAAK,CAAC;IACZ,SAAS,EAAE,YAAY,GAAG,UAAU,CAAC;IACrC,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB,CAAC;AAEN,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,GAAG,SAAS,CAwB9D"}

package/dist/components/templates/text-template/text-template.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-template.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/text-template/text-template.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,SAAS,EAAW,MAAM,OAAO,CAAC;AAE1D,OAAO,EAA0B,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAS9E,UAAU,iBAAiB;IACzB,OAAO,EAAE,mBAAmB,CAAC;CAC9B;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,SAAS,CA8DhE"}
+{"version":3,"file":"text-template.d.ts","sourceRoot":"","sources":["../../../../src/components/templates/text-template/text-template.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,SAAS,EAAW,MAAM,OAAO,CAAC;AAE1D,OAAO,EAA0B,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAS9E,UAAU,iBAAiB;IACzB,OAAO,EAAE,mBAAmB,CAAC;CAC9B;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,SAAS,CAgEhE"}

package/dist/context/asgard-service-context.d.ts

@@ -1,5 +1,5 @@
-import { UseChannelReturn } from '../hooks';
-import { DetailedHTMLProps, HTMLAttributes, ReactNode, RefObject } from 'react';
+import { UseChannelProps, UseChannelReturn } from '../hooks';
+import { ForwardedRef, ReactNode, RefObject } from 'react';
 import { AsgardServiceClient, ClientConfig, ConversationMessage } from '@asgard-js/core';
 
 export interface AsgardServiceContextValue {
@@ -16,8 +16,11 @@ export interface AsgardServiceContextValue {
     botTypingPlaceholder?: string;
 }
 export declare const AsgardServiceContext: import('react').Context<AsgardServiceContextValue>;
-interface AsgardServiceContextProviderProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
+export interface AsgardServiceContextProviderProps {
     children: ReactNode;
+    parentRef?: ForwardedRef<Partial<{
+        serviceContext?: AsgardServiceContextValue;
+    }>>;
     avatar?: string;
     config: ClientConfig;
     botTypingPlaceholder?: string;
@@ -25,8 +28,8 @@ interface AsgardServiceContextProviderProps extends DetailedHTMLProps<HTMLAttrib
     customMessageId?: string;
     delayTime?: number;
     initMessages?: ConversationMessage[];
+    onSseMessage?: UseChannelProps['onSseMessage'];
 }
 export declare function AsgardServiceContextProvider(props: AsgardServiceContextProviderProps): ReactNode;
 export declare function useAsgardContext(): AsgardServiceContextValue;
-export {};
 //# sourceMappingURL=asgard-service-context.d.ts.map

package/dist/context/asgard-service-context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"asgard-service-context.d.ts","sourceRoot":"","sources":["../../src/context/asgard-service-context.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,mBAAmB,EACnB,YAAY,EACZ,mBAAmB,EACpB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAEL,iBAAiB,EACjB,cAAc,EACd,SAAS,EACT,SAAS,EAIV,MAAM,OAAO,CAAC;AACf,OAAO,EAGL,gBAAgB,EACjB,MAAM,WAAW,CAAC;AAEnB,MAAM,WAAW,yBAAyB;IACxC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,mBAAmB,GAAG,IAAI,CAAC;IACnC,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,OAAO,CAAC;IACrB,YAAY,EAAE,OAAO,CAAC;IACtB,QAAQ,EAAE,GAAG,CAAC,MAAM,EAAE,mBAAmB,CAAC,GAAG,IAAI,CAAC;IAClD,mBAAmB,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IAC/C,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,YAAY,CAAC,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAChD,YAAY,CAAC,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAChD,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,oBAAoB,oDAS/B,CAAC;AAEH,UAAU,iCACR,SAAQ,iBAAiB,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,cAAc,CAAC;IACzE,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,YAAY,CAAC;IACrB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,mBAAmB,EAAE,CAAC;CACtC;AAED,wBAAgB,4BAA4B,CAC1C,KAAK,EAAE,iCAAiC,GACvC,SAAS,CA6DX;AAED,wBAAgB,gBAAgB,IAAI,yBAAyB,CAE5D"}
+{"version":3,"file":"asgard-service-context.d.ts","sourceRoot":"","sources":["../../src/context/asgard-service-context.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,mBAAmB,EACnB,YAAY,EACZ,mBAAmB,EACpB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAEL,YAAY,EACZ,SAAS,EACT,SAAS,EAKV,MAAM,OAAO,CAAC;AACf,OAAO,EAGL,eAAe,EACf,gBAAgB,EACjB,MAAM,WAAW,CAAC;AAEnB,MAAM,WAAW,yBAAyB;IACxC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,mBAAmB,GAAG,IAAI,CAAC;IACnC,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,OAAO,CAAC;IACrB,YAAY,EAAE,OAAO,CAAC;IACtB,QAAQ,EAAE,GAAG,CAAC,MAAM,EAAE,mBAAmB,CAAC,GAAG,IAAI,CAAC;IAClD,mBAAmB,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IAC/C,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,YAAY,CAAC,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAChD,YAAY,CAAC,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAChD,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,oBAAoB,oDAS/B,CAAC;AAEH,MAAM,WAAW,iCAAiC;IAChD,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,YAAY,CACtB,OAAO,CAAC;QAAE,cAAc,CAAC,EAAE,yBAAyB,CAAA;KAAE,CAAC,CACxD,CAAC;IACF,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,YAAY,CAAC;IACrB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACrC,YAAY,CAAC,EAAE,eAAe,CAAC,cAAc,CAAC,CAAC;CAChD;AAED,wBAAgB,4BAA4B,CAC1C,KAAK,EAAE,iCAAiC,GACvC,SAAS,CAsEX;AAED,wBAAgB,gBAAgB,IAAI,yBAAyB,CAE5D"}

package/dist/context/asgard-template-context.d.ts

@@ -1,16 +1,24 @@
-import { ConversationErrorMessage } from '@asgard-js/core';
+import { ConversationErrorMessage, FetchSsePayload } from '@asgard-js/core';
 import { PropsWithChildren, ReactNode } from 'react';
 
 export interface AsgardTemplateContextValue {
     onErrorClick?: (message: ConversationErrorMessage) => void;
     errorMessageRenderer?: (message: ConversationErrorMessage) => ReactNode;
-    onTemplateBtnClick?: (payload: any) => void;
+    onTemplateBtnClick?: (payload: Record<string, unknown>, { sse, }: {
+        sse: {
+            sendMessage: (payload: Pick<FetchSsePayload, 'text' | 'payload'>) => void;
+        };
+    }) => void;
 }
 export declare const AsgardTemplateContext: import('react').Context<AsgardTemplateContextValue>;
 interface AsgardTemplateContextProviderProps extends PropsWithChildren {
     onErrorClick?: (message: ConversationErrorMessage) => void;
     errorMessageRenderer?: (message: ConversationErrorMessage) => ReactNode;
-    onTemplateBtnClick?: (payload: any) => void;
+    onTemplateBtnClick?: (payload: Record<string, unknown>, { sse, }: {
+        sse: {
+            sendMessage: (payload: Pick<FetchSsePayload, 'text' | 'payload'>) => void;
+        };
+    }) => void;
 }
 export declare function AsgardTemplateContextProvider(props: AsgardTemplateContextProviderProps): ReactNode;
 export declare function useAsgardTemplateContext(): AsgardTemplateContextValue;

package/dist/context/asgard-template-context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"asgard-template-context.d.ts","sourceRoot":"","sources":["../../src/context/asgard-template-context.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EACjB,SAAS,EAGV,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,wBAAwB,EAAE,MAAM,iBAAiB,CAAC;AAE3D,MAAM,WAAW,0BAA0B;IACzC,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,wBAAwB,KAAK,IAAI,CAAC;IAC3D,oBAAoB,CAAC,EAAE,CAAC,OAAO,EAAE,wBAAwB,KAAK,SAAS,CAAC;IACxE,kBAAkB,CAAC,EAAE,CAAC,OAAO,EAAE,GAAG,KAAK,IAAI,CAAC;CAC7C;AAED,eAAO,MAAM,qBAAqB,qDAIhC,CAAC;AAEH,UAAU,kCAAmC,SAAQ,iBAAiB;IACpE,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,wBAAwB,KAAK,IAAI,CAAC;IAC3D,oBAAoB,CAAC,EAAE,CAAC,OAAO,EAAE,wBAAwB,KAAK,SAAS,CAAC;IACxE,kBAAkB,CAAC,EAAE,CAAC,OAAO,EAAE,GAAG,KAAK,IAAI,CAAC;CAC7C;AAED,wBAAgB,6BAA6B,CAC3C,KAAK,EAAE,kCAAkC,GACxC,SAAS,CAcX;AAED,wBAAgB,wBAAwB,IAAI,0BAA0B,CAErE"}
+{"version":3,"file":"asgard-template-context.d.ts","sourceRoot":"","sources":["../../src/context/asgard-template-context.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EACjB,SAAS,EAGV,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,wBAAwB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAE5E,MAAM,WAAW,0BAA0B;IACzC,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,wBAAwB,KAAK,IAAI,CAAC;IAC3D,oBAAoB,CAAC,EAAE,CAAC,OAAO,EAAE,wBAAwB,KAAK,SAAS,CAAC;IACxE,kBAAkB,CAAC,EAAE,CACnB,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAChC,EACE,GAAG,GACJ,EAAE;QACD,GAAG,EAAE;YACH,WAAW,EAAE,CACX,OAAO,EAAE,IAAI,CAAC,eAAe,EAAE,MAAM,GAAG,SAAS,CAAC,KAC/C,IAAI,CAAC;SACX,CAAC;KACH,KACE,IAAI,CAAC;CACX;AAED,eAAO,MAAM,qBAAqB,qDAIhC,CAAC;AAEH,UAAU,kCAAmC,SAAQ,iBAAiB;IACpE,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,wBAAwB,KAAK,IAAI,CAAC;IAC3D,oBAAoB,CAAC,EAAE,CAAC,OAAO,EAAE,wBAAwB,KAAK,SAAS,CAAC;IACxE,kBAAkB,CAAC,EAAE,CACnB,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAChC,EACE,GAAG,GACJ,EAAE;QACD,GAAG,EAAE;YACH,WAAW,EAAE,CACX,OAAO,EAAE,IAAI,CAAC,eAAe,EAAE,MAAM,GAAG,SAAS,CAAC,KAC/C,IAAI,CAAC;SACX,CAAC;KACH,KACE,IAAI,CAAC;CACX;AAED,wBAAgB,6BAA6B,CAC3C,KAAK,EAAE,kCAAkC,GACxC,SAAS,CAcX;AAED,wBAAgB,wBAAwB,IAAI,0BAA0B,CAErE"}

package/dist/context/asgard-theme-context.d.ts

@@ -3,9 +3,97 @@ import { CSSProperties, PropsWithChildren, ReactNode } from 'react';
 export interface AsgardThemeContextValue {
     chatbot: Pick<CSSProperties, 'width' | 'height' | 'maxWidth' | 'minWidth' | 'maxHeight' | 'minHeight' | 'backgroundColor' | 'borderColor' | 'borderRadius'> & {
         contentMaxWidth?: CSSProperties['maxWidth'];
+        style?: CSSProperties;
+        header?: Partial<{
+            style: CSSProperties;
+            title: {
+                style: CSSProperties;
+            };
+        }>;
+        body?: Partial<{
+            style: CSSProperties;
+        }>;
+        footer?: Partial<{
+            style: CSSProperties;
+            textArea: {
+                style: CSSProperties;
+            };
+            submitButton: {
+                style: CSSProperties;
+            };
+            speechInputButton: {
+                style: CSSProperties;
+            };
+        }>;
     };
     botMessage: Pick<CSSProperties, 'color' | 'backgroundColor'>;
     userMessage: Pick<CSSProperties, 'color' | 'backgroundColor'>;
+    template?: Partial<{
+        /**
+         * first level for common/shared properties.
+         * Check MessageTemplate type for more details (packages/core/src/types/sse-response.ts).
+         */
+        quickReplies?: Partial<{
+            style: CSSProperties;
+            button: {
+                style: CSSProperties;
+            };
+        }>;
+        /**
+         * TBD: Fill the necessary properties based on the requirements.
+         */
+        TextMessageTemplate: Partial<{
+            style: CSSProperties;
+        }>;
+        /**
+         * TBD: Fill the necessary properties based on the requirements.
+         */
+        HintMessageTemplate: Partial<{
+            style: CSSProperties;
+        }>;
+        /**
+         * TBD: Fill the necessary properties based on the requirements.
+         */
+        ImageMessageTemplate: Partial<{
+            style: CSSProperties;
+        }>;
+        /**
+         * TBD: Fill the necessary properties based on the requirements.
+         */
+        VideoMessageTemplate: Partial<{
+            style: CSSProperties;
+        }>;
+        /**
+         * TBD: Fill the necessary properties based on the requirements.
+         */
+        AudioMessageTemplate: Partial<{
+            style: CSSProperties;
+        }>;
+        /**
+         * TBD: Fill the necessary properties based on the requirements.
+         */
+        LocationMessageTemplate: Partial<{
+            style: CSSProperties;
+        }>;
+        /**
+         * TBD: Fill the necessary properties based on the requirements.
+         */
+        ChartMessageTemplate: Partial<{
+            style: CSSProperties;
+        }>;
+        /**
+         * TBD: Fill the necessary properties based on the requirements.
+         */
+        ButtonMessageTemplate: Partial<{
+            style: CSSProperties;
+        }>;
+        /**
+         * TBD: Fill the necessary properties based on the requirements.
+         */
+        CarouselMessageTemplate: Partial<{
+            style: CSSProperties;
+        }>;
+    }>;
 }
 export declare const defaultAsgardThemeContextValue: AsgardThemeContextValue;
 export declare const AsgardThemeContext: import('react').Context<AsgardThemeContextValue>;

package/dist/context/asgard-theme-context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"asgard-theme-context.d.ts","sourceRoot":"","sources":["../../src/context/asgard-theme-context.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,aAAa,EACb,iBAAiB,EACjB,SAAS,EAIV,MAAM,OAAO,CAAC;AAIf,MAAM,WAAW,uBAAuB;IACtC,OAAO,EAAE,IAAI,CACX,aAAa,EACX,OAAO,GACP,QAAQ,GACR,UAAU,GACV,UAAU,GACV,WAAW,GACX,WAAW,GACX,iBAAiB,GACjB,aAAa,GACb,cAAc,CACjB,GAAG;QACF,eAAe,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;KAC7C,CAAC;IACF,UAAU,EAAE,IAAI,CAAC,aAAa,EAAE,OAAO,GAAG,iBAAiB,CAAC,CAAC;IAC7D,WAAW,EAAE,IAAI,CAAC,aAAa,EAAE,OAAO,GAAG,iBAAiB,CAAC,CAAC;CAC/D;AAED,eAAO,MAAM,8BAA8B,EAAE,uBAiB5C,CAAC;AAEF,eAAO,MAAM,kBAAkB,kDAE9B,CAAC;AAEF,wBAAgB,0BAA0B,CACxC,KAAK,EAAE,iBAAiB,CAAC;IACvB,KAAK,CAAC,EAAE,OAAO,CAAC,uBAAuB,CAAC,CAAC;CAC1C,CAAC,GACD,SAAS,CAiCX;AAED,wBAAgB,qBAAqB,IAAI,uBAAuB,CAE/D"}
+{"version":3,"file":"asgard-theme-context.d.ts","sourceRoot":"","sources":["../../src/context/asgard-theme-context.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,aAAa,EACb,iBAAiB,EACjB,SAAS,EAIV,MAAM,OAAO,CAAC;AAIf,MAAM,WAAW,uBAAuB;IACtC,OAAO,EAAE,IAAI,CACX,aAAa,EACX,OAAO,GACP,QAAQ,GACR,UAAU,GACV,UAAU,GACV,WAAW,GACX,WAAW,GACX,iBAAiB,GACjB,aAAa,GACb,cAAc,CACjB,GAAG;QACF,eAAe,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;QAC5C,KAAK,CAAC,EAAE,aAAa,CAAC;QACtB,MAAM,CAAC,EAAE,OAAO,CAAC;YACf,KAAK,EAAE,aAAa,CAAC;YACrB,KAAK,EAAE;gBACL,KAAK,EAAE,aAAa,CAAC;aACtB,CAAC;SACH,CAAC,CAAC;QACH,IAAI,CAAC,EAAE,OAAO,CAAC;YACb,KAAK,EAAE,aAAa,CAAC;SACtB,CAAC,CAAC;QACH,MAAM,CAAC,EAAE,OAAO,CAAC;YACf,KAAK,EAAE,aAAa,CAAC;YACrB,QAAQ,EAAE;gBACR,KAAK,EAAE,aAAa,CAAC;aACtB,CAAC;YACF,YAAY,EAAE;gBACZ,KAAK,EAAE,aAAa,CAAC;aACtB,CAAC;YACF,iBAAiB,EAAE;gBACjB,KAAK,EAAE,aAAa,CAAC;aACtB,CAAC;SACH,CAAC,CAAC;KACJ,CAAC;IACF,UAAU,EAAE,IAAI,CAAC,aAAa,EAAE,OAAO,GAAG,iBAAiB,CAAC,CAAC;IAC7D,WAAW,EAAE,IAAI,CAAC,aAAa,EAAE,OAAO,GAAG,iBAAiB,CAAC,CAAC;IAC9D,QAAQ,CAAC,EAAE,OAAO,CAAC;QACjB;;;WAGG;QACH,YAAY,CAAC,EAAE,OAAO,CAAC;YACrB,KAAK,EAAE,aAAa,CAAC;YACrB,MAAM,EAAE;gBACN,KAAK,EAAE,aAAa,CAAC;aACtB,CAAC;SACH,CAAC,CAAC;QACH;;WAEG;QACH,mBAAmB,EAAE,OAAO,CAAC;YAAE,KAAK,EAAE,aAAa,CAAA;SAAE,CAAC,CAAC;QACvD;;WAEG;QACH,mBAAmB,EAAE,OAAO,CAAC;YAAE,KAAK,EAAE,aAAa,CAAA;SAAE,CAAC,CAAC;QACvD;;WAEG;QACH,oBAAoB,EAAE,OAAO,CAAC;YAAE,KAAK,EAAE,aAAa,CAAA;SAAE,CAAC,CAAC;QACxD;;WAEG;QACH,oBAAoB,EAAE,OAAO,CAAC;YAAE,KAAK,EAAE,aAAa,CAAA;SAAE,CAAC,CAAC;QACxD;;WAEG;QACH,oBAAoB,EAAE,OAAO,CAAC;YAAE,KAAK,EAAE,aAAa,CAAA;SAAE,CAAC,CAAC;QACxD;;WAEG;QACH,uBAAuB,EAAE,OAAO,CAAC;YAAE,KAAK,EAAE,aAAa,CAAA;SAAE,CAAC,CAAC;QAC3D;;WAEG;QACH,oBAAoB,EAAE,OAAO,CAAC;YAAE,KAAK,EAAE,aAAa,CAAA;SAAE,CAAC,CAAC;QACxD;;WAEG;QACH,qBAAqB,EAAE,OAAO,CAAC;YAAE,KAAK,EAAE,aAAa,CAAA;SAAE,CAAC,CAAC;QACzD;;WAEG;QACH,uBAAuB,EAAE,OAAO,CAAC;YAAE,KAAK,EAAE,aAAa,CAAA;SAAE,CAAC,CAAC;KAC5D,CAAC,CAAC;CACJ;AAED,eAAO,MAAM,8BAA8B,EAAE,uBA0E5C,CAAC;AAEF,eAAO,MAAM,kBAAkB,kDAE9B,CAAC;AAEF,wBAAgB,0BAA0B,CACxC,KAAK,EAAE,iBAAiB,CAAC;IACvB,KAAK,CAAC,EAAE,OAAO,CAAC,uBAAuB,CAAC,CAAC;CAC1C,CAAC,GACD,SAAS,CAiCX;AAED,wBAAgB,qBAAqB,IAAI,uBAAuB,CAE/D"}

package/dist/hooks/use-channel.d.ts

@@ -1,12 +1,15 @@
-import { AsgardServiceClient, Conversation, ConversationMessage, FetchSsePayload } from '@asgard-js/core';
+import { AsgardServiceClient, Conversation, ConversationMessage, EventType, FetchSsePayload, SseResponse } from '@asgard-js/core';
 
-interface UseChannelProps {
+export interface UseChannelProps {
     defaultIsOpen?: boolean;
     resetPayload?: Pick<FetchSsePayload, 'text' | 'payload'>;
     client: AsgardServiceClient | null;
     customChannelId: string;
     customMessageId?: string;
     initMessages?: ConversationMessage[];
+    onSseMessage?: (response: SseResponse<EventType>, context: {
+        conversation: Conversation | null;
+    }) => void;
 }
 export interface UseChannelReturn {
     isOpen: boolean;
@@ -18,5 +21,4 @@ export interface UseChannelReturn {
     closeChannel?: () => void;
 }
 export declare function useChannel(props: UseChannelProps): UseChannelReturn;
-export {};
 //# sourceMappingURL=use-channel.d.ts.map

package/dist/hooks/use-channel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-channel.d.ts","sourceRoot":"","sources":["../../src/hooks/use-channel.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,mBAAmB,EAGnB,YAAY,EACZ,mBAAmB,EACnB,eAAe,EAChB,MAAM,iBAAiB,CAAC;AAGzB,UAAU,eAAe;IACvB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,IAAI,CAAC,eAAe,EAAE,MAAM,GAAG,SAAS,CAAC,CAAC;IACzD,MAAM,EAAE,mBAAmB,GAAG,IAAI,CAAC;IACnC,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,mBAAmB,EAAE,CAAC;CACtC;AAED,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,OAAO,CAAC;IACrB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,YAAY,GAAG,IAAI,CAAC;IAClC,WAAW,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,CAAC,eAAe,EAAE,MAAM,GAAG,SAAS,CAAC,KAAK,IAAI,CAAC;IAC3E,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,CAAC,eAAe,EAAE,MAAM,GAAG,SAAS,CAAC,KAAK,IAAI,CAAC;IAC5E,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,gBAAgB,CA8GnE"}
+{"version":3,"file":"use-channel.d.ts","sourceRoot":"","sources":["../../src/hooks/use-channel.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,mBAAmB,EAGnB,YAAY,EACZ,mBAAmB,EACnB,SAAS,EACT,eAAe,EACf,WAAW,EACZ,MAAM,iBAAiB,CAAC;AAGzB,MAAM,WAAW,eAAe;IAC9B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,IAAI,CAAC,eAAe,EAAE,MAAM,GAAG,SAAS,CAAC,CAAC;IACzD,MAAM,EAAE,mBAAmB,GAAG,IAAI,CAAC;IACnC,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACrC,YAAY,CAAC,EAAE,CACb,QAAQ,EAAE,WAAW,CAAC,SAAS,CAAC,EAChC,OAAO,EAAE;QACP,YAAY,EAAE,YAAY,GAAG,IAAI,CAAC;KACnC,KACE,IAAI,CAAC;CACX;AAED,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,OAAO,CAAC;IACrB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,YAAY,GAAG,IAAI,CAAC;IAClC,WAAW,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,CAAC,eAAe,EAAE,MAAM,GAAG,SAAS,CAAC,KAAK,IAAI,CAAC;IAC3E,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,CAAC,eAAe,EAAE,MAAM,GAAG,SAAS,CAAC,KAAK,IAAI,CAAC;IAC5E,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,gBAAgB,CAoHnE"}