@nlxai/touchpoint-ui 1.2.4-alpha.11 → 1.2.4-alpha.12

package/README.md

@@ -210,6 +210,14 @@ optional bidirectional: BidirectionalConfig;
 
 Enables bidirectional mode of voice+. Will automatically set the bidirectional flag in the config.
 
+##### copy?
+
+```ts
+optional copy: Partial<Copy>;
+```
+
+Copy
+
 ---
 
 ### TouchpointInstance
@@ -321,15 +329,15 @@ A list containing the custom commands to set.
 
 The full theme expressed as CSS custom properties.
 This means that for instance colors can be made to switch automatically based on the system color mode by using the `light-dark()` CSS function.
-Note also that not all colors need to be provided manually. For instance if only `primary80` is provided, the rest of the primary colors will be computed automatically based on it.
-Therefore, for a fully custom but minimal theme, you only need to provide `accent`, `primary80`, `secondary80`, `background`, `overlay`, and potentially the warning and error colors.
+Note also that not all colors need to be provided manually. For instance if only `primary` is provided, the rest of the primary colors will be computed automatically based on it.
+Therefore, for a fully custom but minimal theme, you only need to provide `accent`, `primary`, `secondary`, `background`, `overlay`, and potentially the warning and error colors.
 
 #### Example
 
 ```typescript
 const theme: Partial<Theme> = {
-  primary80: "light-dark(rgba(0, 2, 9, 0.8), rgba(255, 255, 255, 0.8))",
-  secondary80: "light-dark(rgba(255, 255, 255, 0.8), rgba(0, 2, 9, 0.8))",
+  primary: "light-dark(rgb(0, 2, 9), rgb(255, 255, 255))",
+  secondary: "light-dark(rgb(255, 255, 255), rgb(0, 2, 9))",
   accent: "light-dark(rgb(28, 99, 218), rgb(174, 202, 255))",
   background: "light-dark(rgba(220, 220, 220, 0.9), rgba(0, 2, 9, 0.9))",
 };
@@ -345,6 +353,22 @@ fontFamily: string;
 
 Font family
 
+##### primary
+
+```ts
+primary: string;
+```
+
+Primary color
+
+##### primary90
+
+```ts
+primary90: string;
+```
+
+Primary color with 90% opacity
+
 ##### primary80
 
 ```ts
@@ -401,6 +425,22 @@ primary1: string;
 
 Primary color with 1% opacity
 
+##### secondary
+
+```ts
+secondary: string;
+```
+
+Secondary color
+
+##### secondary90
+
+```ts
+secondary90: string;
+```
+
+Secondary color with 90% opacity
+
 ##### secondary80
 
 ```ts

package/docs/README.md

@@ -160,7 +160,7 @@ the context object
 ##### input?
 
 ```ts
-optional input: "text" | "voice" | "voiceMini";
+optional input: "text" | "external" | "voice" | "voiceMini";
 ```
 
 Controls the ways in which the user can communicate with the application. Defaults to `"text"`
@@ -181,6 +181,14 @@ optional bidirectional: BidirectionalConfig;
 
 Enables bidirectional mode of voice+. Will automatically set the bidirectional flag in the config.
 
+##### copy?
+
+```ts
+optional copy: Partial<Copy>;
+```
+
+Copy
+
 ---
 
 ### TouchpointInstance
@@ -292,15 +300,15 @@ A list containing the custom commands to set.
 
 The full theme expressed as CSS custom properties.
 This means that for instance colors can be made to switch automatically based on the system color mode by using the `light-dark()` CSS function.
-Note also that not all colors need to be provided manually. For instance if only `primary80` is provided, the rest of the primary colors will be computed automatically based on it.
-Therefore, for a fully custom but minimal theme, you only need to provide `accent`, `primary80`, `secondary80`, `background`, `overlay`, and potentially the warning and error colors.
+Note also that not all colors need to be provided manually. For instance if only `primary` is provided, the rest of the primary colors will be computed automatically based on it.
+Therefore, for a fully custom but minimal theme, you only need to provide `accent`, `primary`, `secondary`, `background`, `overlay`, and potentially the warning and error colors.
 
 #### Example
 
 ```typescript
 const theme: Partial<Theme> = {
-  primary80: "light-dark(rgba(0, 2, 9, 0.8), rgba(255, 255, 255, 0.8))",
-  secondary80: "light-dark(rgba(255, 255, 255, 0.8), rgba(0, 2, 9, 0.8))",
+  primary: "light-dark(rgb(0, 2, 9), rgb(255, 255, 255))",
+  secondary: "light-dark(rgb(255, 255, 255), rgb(0, 2, 9))",
   accent: "light-dark(rgb(28, 99, 218), rgb(174, 202, 255))",
   background: "light-dark(rgba(220, 220, 220, 0.9), rgba(0, 2, 9, 0.9))",
 };
@@ -316,6 +324,22 @@ fontFamily: string;
 
 Font family
 
+##### primary
+
+```ts
+primary: string;
+```
+
+Primary color
+
+##### primary90
+
+```ts
+primary90: string;
+```
+
+Primary color with 90% opacity
+
 ##### primary80
 
 ```ts
@@ -372,6 +396,22 @@ primary1: string;
 
 Primary color with 1% opacity
 
+##### secondary
+
+```ts
+secondary: string;
+```
+
+Secondary color
+
+##### secondary90
+
+```ts
+secondary90: string;
+```
+
+Secondary color with 90% opacity
+
 ##### secondary80
 
 ```ts

package/lib/components/FullscreenVoice.d.ts

@@ -1,21 +1,36 @@
-import { FC } from 'react';
-import { Context, ConversationHandler } from '@nlxai/core';
+import { FC, Dispatch, SetStateAction } from 'react';
+import { Context, ConversationHandler, Response } from '@nlxai/core';
 import { ColorMode, CustomModalityComponent } from '../interface';
-import { ModalitiesWithContext } from '../voice';
+import { VoiceHandler, VoiceState } from '../voice';
 interface Props {
     colorMode: ColorMode;
     handler: ConversationHandler;
+    responses: Response[];
     speakersEnabled: boolean;
+    showTranscript: boolean;
     brandIcon?: string;
     className?: string;
     context?: Context;
     modalityComponents: Record<string, CustomModalityComponent<unknown>>;
 }
+export type WidgetVoiceState = null | "loading" | {
+    type: "error";
+    error: string;
+} | {
+    type: "success";
+    handler: VoiceHandler;
+    state?: VoiceState;
+};
+export declare const useWidgetVoiceState: () => [
+    WidgetVoiceState,
+    Dispatch<SetStateAction<WidgetVoiceState>>
+];
 export declare const VoiceModalities: FC<{
     className?: string;
-    modalities: ModalitiesWithContext[];
+    responses: Response[];
     modalityComponents: Record<string, CustomModalityComponent<unknown>>;
     renderedAsOverlay: boolean;
+    showTranscript: boolean;
     handler: ConversationHandler;
 }>;
 export declare const FullscreenVoice: FC<Props>;

package/lib/components/Messages.d.ts

@@ -25,4 +25,9 @@ export declare const MessageChoices: FC<{
     responseIndex: number;
     messageIndex: number;
 }>;
+export declare const UserMessage: FC<{
+    text: string;
+    files?: File[];
+    bubble: boolean;
+}>;
 export declare const Messages: FC<MessagesProps>;

package/lib/components/Notice.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+export declare const Notice: FC<{
+    text: string;
+}>;

package/lib/components/VoiceMini.d.ts

@@ -1,8 +1,10 @@
-import { Context, ConversationHandler } from '@nlxai/core';
+import { Context, ConversationHandler, Response } from '@nlxai/core';
 import { FC } from 'react';
 import { CustomModalityComponent } from '../interface';
 export declare const VoiceMini: FC<{
     modalityComponents: Record<string, CustomModalityComponent<unknown>>;
+    showTranscript: boolean;
+    responses: Response[];
     handler: ConversationHandler;
     brandIcon?: string;
     renderCollapse: boolean;