@nlxai/touchpoint-ui 1.0.5-alpha.9 → 1.1.1

package/index.html

@@ -89,7 +89,8 @@
       </p>
     </main>
     <script type="module">
-      import { create } from "/src/index.tsx";
+      import { create, html } from "/src/index.tsx";
+
       const touchpoint = await create({
         config: {
           applicationUrl:
@@ -100,9 +101,9 @@
           userId: "1234-5678",
           languageCode: "en-US",
         },
-        input: "voice",
+        input: "voiceMini",
+        initializeConversation: () => {},
       });
-      touchpoint.expanded = true;
     </script>
   </body>
 </html>

package/lib/analyzePageForms.d.ts

@@ -0,0 +1,31 @@
+/**
+ * Accessibility information
+ */
+export type AccessibilityInformation = Record<string, any>;
+/**
+ * Accessibility information with ID
+ */
+export interface InteractiveElementInfo extends AccessibilityInformation {
+    /**
+     * Form element ID (assigned by the analysis logic, not necessarily equal to the DOM ID)
+     */
+    id: string;
+}
+/**
+ * Page forms with elements
+ */
+export interface PageForms {
+    /**
+     * Page context
+     */
+    context: InteractiveElementInfo[];
+    /**
+     * Form element references
+     */
+    formElements: Record<string, Element>;
+}
+/**
+ * Analyze page forms
+ * @returns pageForms
+ */
+export declare const analyzePageForms: () => PageForms;

package/lib/components/FullscreenVoice.d.ts

@@ -1,17 +1,29 @@
-import { Dispatch, SetStateAction, FC } from 'react';
+import { Dispatch, SetStateAction, FC, ReactNode } from 'react';
 import { Context, ConversationHandler } from '@nlxai/chat-core';
-import { ColorMode } from '../types';
-import { SoundCheck } from '../voice';
+import { ColorMode, InitializeConversation, CustomModalityComponent } from '../types';
+import { SoundCheck, ModalitiesWithContext } from '../voice';
 interface Props {
     colorMode: ColorMode;
     handler: ConversationHandler;
+    speakersEnabled: boolean;
+    brandIcon?: string;
     className?: string;
     active: boolean;
     setActive: Dispatch<SetStateAction<boolean>>;
     context?: Context;
+    initializeConversation: InitializeConversation;
+    customModalities?: Record<string, CustomModalityComponent<unknown>>;
 }
 export declare const SoundCheckUi: FC<{
     soundCheck: SoundCheck | null;
 }>;
+export declare const VoiceModalities: FC<{
+    Wrapper?: FC<{
+        children: ReactNode;
+    }>;
+    roomData: ModalitiesWithContext;
+    customModalities: Record<string, CustomModalityComponent<unknown>>;
+    handler: ConversationHandler;
+}>;
 export declare const FullscreenVoice: FC<Props>;
 export {};

package/lib/components/Header.d.ts

@@ -1,8 +1,13 @@
-import { FC } from 'react';
+import { SetStateAction, Dispatch, FC } from 'react';
 import { WindowSize, ColorMode } from '../types';
 interface HeaderProps {
     windowSize: WindowSize | "embedded";
     colorMode: ColorMode;
+    errorThemedCloseButton?: boolean;
+    speakerControls?: {
+        enabled: boolean;
+        setEnabled: Dispatch<SetStateAction<boolean>>;
+    };
     brandIcon?: string;
     renderCollapse: boolean;
     collapse: (event: Event) => void;

package/lib/components/Input.d.ts

@@ -1,6 +1,5 @@
 import { FC } from 'react';
 import { ConversationHandler, UploadUrl } from '@nlxai/chat-core';
-import { ChoiceMessage } from '../types';
 interface InputProps {
     className?: string;
     handler: ConversationHandler;
@@ -9,7 +8,6 @@ interface InputProps {
         uploadId: string;
         file: File;
     }) => void;
-    choiceMessage?: ChoiceMessage;
     enabled: boolean;
 }
 export declare const Input: FC<InputProps>;

package/lib/components/Messages.d.ts

@@ -11,7 +11,7 @@ export interface MessagesProps {
     colorMode: ColorMode;
     uploadedFiles: Record<string, File>;
     lastBotResponseIndex?: number;
-    customModalities: Record<string, CustomModalityComponent<any>>;
+    customModalities: Record<string, CustomModalityComponent<unknown>>;
     className?: string;
     enabled: boolean;
 }
@@ -20,6 +20,5 @@ export declare const MessageChoices: FC<{
     message: BotMessage;
     responseIndex: number;
     messageIndex: number;
-    className?: string;
 }>;
 export declare const Messages: FC<MessagesProps>;

package/lib/components/Settings.d.ts

@@ -2,6 +2,7 @@ import { FC } from 'react';
 import { ConversationHandler } from '@nlxai/chat-core';
 interface SettingsProps {
     onClose: () => void;
+    reset: () => void;
     handler: ConversationHandler;
     className?: string;
 }

package/lib/components/VoiceMini.d.ts

@@ -1,6 +1,9 @@
 import { Context, ConversationHandler } from '@nlxai/chat-core';
 import { FC } from 'react';
+import { CustomModalityComponent } from '../types';
 export declare const VoiceMini: FC<{
+    customModalities: Record<string, CustomModalityComponent<unknown>>;
     handler: ConversationHandler;
+    onClose: () => void;
     context?: Context;
 }>;

package/lib/components/ui/CustomCard.d.ts

@@ -16,6 +16,14 @@ export interface CustomCardProps {
      * Handler function for when the card is clicked
      */
     onClick?: () => void;
+    /**
+     *  Transform the card into an anchor tag with the href specified
+     */
+    href?: string;
+    /**
+     * Specify whether the URL should take the user to a new tab
+     */
+    newTab?: boolean;
 }
 export declare const CustomCard: FC<CustomCardProps>;
 export declare const CustomCardImageRow: FC<{

package/lib/components/ui/IconButton.d.ts

@@ -35,4 +35,8 @@ export interface IconButtonProps {
      */
     Icon: FC<IconProps>;
 }
+export declare const UnsemanticIconButton: FC<{
+    type: IconButtonType;
+    Icon: FC<IconProps>;
+}>;
 export declare const IconButton: FC<IconButtonProps>;

package/lib/components/ui/Icons.d.ts

@@ -56,3 +56,4 @@ export declare const Time: Icon;
 export declare const Undo: Icon;
 export declare const Refresh: Icon;
 export declare const Help: Icon;
+export declare const OpenLink: Icon;

package/lib/index.d.ts

@@ -7,14 +7,29 @@ import { Carousel } from './components/ui/Carousel';
 import { DateInput } from './components/ui/DateInput';
 import { TouchpointConfiguration } from './types';
 import * as Icons from "./components/ui/Icons";
+export { analyzePageForms, type InteractiveElementInfo, type PageForms, type AccessibilityInformation, } from './analyzePageForms';
+/**
+ * If you wish to build custom modalities using JSX, you will want to
+ *
+ * ```javascript
+ * import { React } from "@nlx/touchpoint-ui";
+ * ```
+ *
+ * instead of importing from "react" directly. This ensures that the custom modalities will
+ * be running in the same React context as the Touchpoint UI using the correct version of React.
+ */
 export { default as React } from 'react';
+/**
+ * Package version
+ */
+export declare const version: string;
 export declare const html: (strings: TemplateStringsArray, ...values: any[]) => unknown;
 export { TextButton, IconButton, BaseText, SmallText, DateInput, Carousel, CustomCard, CustomCardRow, CustomCardImageRow, Icons, };
 export { type CustomCardProps, type CustomCardRowProps, } from './components/ui/CustomCard';
 export { type DateInputProps } from './components/ui/DateInput';
 export { type IconButtonProps, type IconButtonType, } from './components/ui/IconButton';
 export { type TextButtonProps } from './components/ui/TextButton';
-export { type InitializeConversation, type ColorMode, type Theme, type WindowSize, type CustomModalityComponent, type TouchpointConfiguration, } from './types';
+export { type InitializeConversation, type ColorMode, type Input, type Theme, type WindowSize, type CustomModalityComponent, type TouchpointConfiguration, } from './types';
 /**
  * Instance of a Touchpoint UI component
  */