@botpress/webchat 1.0.15 → 1.0.17

package/dist/main.d.ts

@@ -1,4 +1,3 @@
-import { WebchatClient } from './client/MessagingClient.ts';
 export declare const twObject: import("@twind/core").Twind<import("@twind/core").BaseTheme & import("@twind/preset-tailwind").TailwindTheme & import("@twind/preset-container-queries").ContainerQueriesTheme & {
     fontFamily: {
         sans: string[];
@@ -8,4 +7,3 @@ export declare const twObject: import("@twind/core").Twind<import("@twind/core")
     };
     extend: never;
 }, unknown>;
-export declare const webchatClient: WebchatClient;

package/dist/options.d.ts

@@ -0,0 +1,11 @@
+type ChatOptions = {
+    backend: 'messaging';
+    apiUrl: string;
+    clientId: string;
+} | {
+    backend: 'chat';
+    apiUrl: string;
+    clientId: string;
+};
+export declare const getOptions: () => ChatOptions;
+export {};

package/dist/providers/WebchatProvider.d.ts

@@ -1,11 +1,11 @@
 import { ComponentProps, ReactNode } from 'react';
 import { Configuration, Renderers, WebchatContext } from '../contexts';
 import { Theme } from '../schemas';
-import { type WebchatClient } from '../client';
+import { type WebChatClient } from '../client';
 type Props = {
     styles?: Theme;
     renderers?: Renderers;
-    client: WebchatClient;
+    client: WebChatClient;
     configuration: Configuration;
     children?: ReactNode | ((configuration: Configuration) => ReactNode);
 } & Omit<ComponentProps<typeof WebchatContext.Provider>, 'value' | 'children'>;

package/dist/schemas/theme.d.ts

@@ -1,5 +1,16 @@
 import { CSSProperties } from 'react';
 import { z } from 'zod';
+export type StyleOption = z.infer<typeof StyleOptionSchema>;
+declare const StyleOptionSchema: z.ZodObject<{
+    className: z.ZodEffects<z.ZodOptional<z.ZodString>, string | undefined, string | undefined>;
+    style: z.ZodEffects<z.ZodOptional<z.ZodObject<{}, "passthrough", z.ZodTypeAny, z.objectOutputType<{}, z.ZodTypeAny, "passthrough">, z.objectInputType<{}, z.ZodTypeAny, "passthrough">>>, CSSProperties | undefined, z.objectInputType<{}, z.ZodTypeAny, "passthrough"> | undefined>;
+}, "strip", z.ZodTypeAny, {
+    className?: string | undefined;
+    style?: CSSProperties | undefined;
+}, {
+    className?: string | undefined;
+    style?: z.objectInputType<{}, z.ZodTypeAny, "passthrough"> | undefined;
+}>;
 export declare const BlocksSchema: z.ZodObject<{
     button: z.ZodOptional<z.ZodObject<{
         className: z.ZodEffects<z.ZodOptional<z.ZodString>, string | undefined, string | undefined>;
@@ -3369,3 +3380,4 @@ export declare const ThemeSchema: z.ZodObject<{
         } | undefined;
     } | undefined;
 }>;
+export {};

package/dist/themes/base.d.ts

@@ -0,0 +1,2 @@
+import { Theme } from '../schemas';
+export declare const baseTheme: Theme;

package/dist/themes/dusk.d.ts

@@ -0,0 +1,2 @@
+import { Theme } from '../schemas';
+export declare const dusk: Theme;

package/dist/themes/index.d.ts

@@ -1,6 +1,6 @@
 export * from './dawn';
 export * from './midnight';
-export * from './duskTheme';
+export * from './dusk';
 export * from './eggplant';
 export * from './galaxy';
 export * from './prism';

package/dist/{Utils → utils}/index.d.ts

@@ -1,3 +1,4 @@
 export * from './colors';
 export * from './eventEmitter';
 export * from './hashStringToInt';
+export * from './mergeThemes';

package/dist/utils/mergeThemes.d.ts

@@ -0,0 +1,2 @@
+import { Theme } from '../schemas';
+export declare function mergeThemes(baseTheme: Theme, other: Theme): Theme;

package/dist/utils/withBaseTheme.d.ts

@@ -0,0 +1,316 @@
+/// <reference types="react" />
+import { Theme } from '../schemas';
+export declare function withBaseTheme(theme: Theme): {
+    container?: {
+        className?: string | undefined;
+        style?: import("react").CSSProperties | undefined;
+    } | undefined;
+    modal?: {
+        overlay?: {
+            className?: string | undefined;
+            style?: import("react").CSSProperties | undefined;
+        } | undefined;
+        container?: {
+            className?: string | undefined;
+            style?: import("react").CSSProperties | undefined;
+        } | undefined;
+        dialog?: {
+            container?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            title?: {
+                container?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                text?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                closeIcon?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+            } | undefined;
+            content?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+        } | undefined;
+    } | undefined;
+    notification?: {
+        container?: {
+            className?: string | undefined;
+            style?: import("react").CSSProperties | undefined;
+        } | undefined;
+        title?: {
+            className?: string | undefined;
+            style?: import("react").CSSProperties | undefined;
+        } | undefined;
+        description?: {
+            className?: string | undefined;
+            style?: import("react").CSSProperties | undefined;
+        } | undefined;
+        icon?: {
+            className?: string | undefined;
+            style?: import("react").CSSProperties | undefined;
+        } | undefined;
+        closeIcon?: {
+            className?: string | undefined;
+            style?: import("react").CSSProperties | undefined;
+        } | undefined;
+    } | undefined;
+    header?: {
+        content: {
+            container?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            title?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            description?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            avatar?: {
+                container?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                image?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                fallback?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+            } | undefined;
+            actions?: {
+                container?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                icons?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+            } | undefined;
+        };
+        container?: {
+            className?: string | undefined;
+            style?: import("react").CSSProperties | undefined;
+        } | undefined;
+        expandedContent?: {
+            container?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            descriptionItems?: {
+                container?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                icon?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                text?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                link?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+            } | undefined;
+        } | undefined;
+        description?: {
+            container?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            title?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            subtitle?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+        } | undefined;
+        newConversationIcon?: {
+            className?: string | undefined;
+            style?: import("react").CSSProperties | undefined;
+        } | undefined;
+    } | undefined;
+    composer?: {
+        container?: {
+            className?: string | undefined;
+            style?: import("react").CSSProperties | undefined;
+        } | undefined;
+        input?: {
+            className?: string | undefined;
+            style?: import("react").CSSProperties | undefined;
+        } | undefined;
+        button?: {
+            container?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            icon?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+        } | undefined;
+    } | undefined;
+    messageList?: {
+        className?: string | undefined;
+        style?: import("react").CSSProperties | undefined;
+    } | undefined;
+    message?: {
+        container?: {
+            className?: string | undefined;
+            style?: import("react").CSSProperties | undefined;
+        } | undefined;
+        avatar?: {
+            container?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            image?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            fallback?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+        } | undefined;
+        blocks?: {
+            text: Partial<Record<"link" | "pre" | "text" | "bold" | "italic" | "heading1" | "heading2" | "heading3" | "horizontalRule" | "orderedList" | "unorderedList" | "listItem" | "lineBreak", {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined>>;
+            button?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            image?: {
+                image?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                placeholder?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+            } | undefined;
+            audio?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            video?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            file?: {
+                container?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                title?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                icon?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+            } | undefined;
+            location?: {
+                container?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                title?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                icon?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+            } | undefined;
+            column?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            row?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            bubble?: {
+                className?: string | undefined;
+                style?: import("react").CSSProperties | undefined;
+            } | undefined;
+            carousel?: {
+                container?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                slidesContainer?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                backButton?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+                nextButton?: {
+                    className?: string | undefined;
+                    style?: import("react").CSSProperties | undefined;
+                } | undefined;
+            } | undefined;
+            dropdown?: {
+                button?: {
+                    container?: {
+                        className?: string | undefined;
+                        style?: import("react").CSSProperties | undefined;
+                    } | undefined;
+                    icon?: {
+                        className?: string | undefined;
+                        style?: import("react").CSSProperties | undefined;
+                    } | undefined;
+                    text?: {
+                        className?: string | undefined;
+                        style?: import("react").CSSProperties | undefined;
+                    } | undefined;
+                } | undefined;
+                content?: {
+                    container?: {
+                        className?: string | undefined;
+                        style?: import("react").CSSProperties | undefined;
+                    } | undefined;
+                    item?: {
+                        className?: string | undefined;
+                        style?: import("react").CSSProperties | undefined;
+                    } | undefined;
+                } | undefined;
+            } | undefined;
+        } | undefined;
+    } | undefined;
+    loadingIndicator?: {
+        container?: {
+            className?: string | undefined;
+            style?: import("react").CSSProperties | undefined;
+        } | undefined;
+        loader?: {
+            className?: string | undefined;
+            style?: import("react").CSSProperties | undefined;
+        } | undefined;
+    } | undefined;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@botpress/webchat",
-  "version": "1.0.15",
+  "version": "1.0.17",
   "type": "module",
   "license": "MIT",
   "main": "./dist/index.umd.cjs",
@@ -14,8 +14,9 @@
   },
   "scripts": {
     "type:check": "tsc --noEmit",
-    "dev": "vite",
+    "dev": "vite --debug --log-level info",
     "build": "pnpm type:check && vite build",
+    "bundle": "vite build",
     "lint": "eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
     "preview": "vite preview"
   },
@@ -31,18 +32,21 @@
     "@radix-ui/react-icons": "^1.3.0",
     "@tailwindcss/container-queries": "^0.1.1",
     "@types/color-convert": "^2.0.1",
+    "@types/lodash": "^4.14.199",
     "@types/uuid": "^9.0.3",
     "classnames": "^2.3.2",
     "clsx": "^2.0.0",
     "color-convert": "^2.0.1",
     "embla-carousel-react": "8.0.0-rc11",
     "google-map-react": "^2.2.1",
+    "lodash": "^4.17.21",
     "react": "^18.2.0",
     "react-colorful": "^5.6.1",
     "react-dom": "^18.2.0",
     "react-hot-toast": "^2.4.1",
     "react-markdown": "^8.0.7",
     "react-use": "^17.4.0",
+    "tailwind-merge": "^1.14.0",
     "tailwind-scrollbar": "^3.0.4",
     "uuid": "^9.0.0",
     "vite-plugin-svgr": "^3.2.0",

package/dist/themes/duskTheme.d.ts

@@ -1,2 +0,0 @@
-import { Theme } from '../schemas';
-export declare const duskTheme: Theme;