FlowiseAI / FlowiseChatEmbed

320 stars 1.31k forks source link

Missing theme types #105

Open yhranik-vp opened 7 months ago

yhranik-vp commented 7 months ago

Chatbot init and initFull method type declarations are missing theme object: https://github.com/FlowiseAI/FlowiseChatEmbed/blob/main/dist/web.d.ts

declare const chatbot: {
    initFull: (props: {
        chatflowid: string;
        apiHost?: string | undefined;
        chatflowConfig?: Record<string, unknown> | undefined;
        observersConfig?: import("./components/Bot").observersConfigType | undefined;
    } & {
        id?: string | undefined;
    }) => void;
    init: (props: {
        chatflowid: string;
        apiHost?: string | undefined;
        chatflowConfig?: Record<string, unknown> | undefined;
        observersConfig?: import("./components/Bot").observersConfigType | undefined;
    }) => void;
};
export default chatbot;
//# sourceMappingURL=web.d.ts.map
KazeroG commented 1 week ago

Same as @yhranik-vp

Source code :

import { FullPageChat } from "flowise-embed-react";

const Chat= () => {
  return (
    <FullPageChat
      chatflowid="xxx"
      apiHost="https://Chat.com"
      theme={{
        chatWindow: {
          showTitle: true,
          title: "Chat.com Agent",
          titleAvatarSrc:
            "https://raw.githubusercontent.com/walkxcode/dashboard-icons/main/svg/google-messages.svg",
          showAgentMessages: true,
          welcomeMessage:
            "....?",
          errorMessage: "Ceci est un message d'erreur personnalisé",
          backgroundColor: "#ffffff",
          backgroundImage: "entrez le chemin de l'image ou le lien", // If set, this will overlap the background color of the chat window.
          height: 700,
          width: 400,
          fontSize: 16,
          //starterPrompts: ['What is a bot?', 'Who are you?'], // It overrides the starter prompts set by the chat flow passed
          starterPromptFontSize: 15,
          clearChatOnReload: false, // If set to true, the chat will be cleared when the page reloads.
          botMessage: {
            backgroundColor: "#000000",
            textColor: "#303235",
            showAvatar: false,
            avatarSrc:
              "https://raw.githubusercontent.com/zahidkhawaja/langchain-chat-nextjs/main/public/parroticon.png"
          },
          userMessage: {
            backgroundColor: "#000000",
            textColor: "#ffffff",
            showAvatar: false,
            avatarSrc:
              "https://raw.githubusercontent.com/zahidkhawaja/langchain-chat-nextjs/main/public/usericon.png"
          },
          textInput: {
            placeholder: "Type your question",
            backgroundColor: "#ffffff",
            textColor: "#303235",
            sendButtonColor: "#000000",
            maxChars: 600,
            maxCharsWarningMessage:
              "Vous avez dépassé la limite de caractères. Veuillez saisir moins de 600 caractères.",
            //autoFocus: true,  If not used, autofocus is disabled on mobile and enabled on desktop. true enables it on both, false disables it on both.
            sendMessageSound: true,
            // sendSoundLocation: "send_message.mp3", // If this is not used, the default sound effect will be played if sendSoundMessage is true.
            receiveMessageSound: true
            // receiveSoundLocation: "receive_message.mp3", // If this is not used, the default sound effect will be played if receiveSoundMessage is true.
          },
          feedback: {
            color: "#303235"
          },
          footer: {
            textColor: "#303235",
            text: "Powered by",
            company: "Chat.com",
            companyLink: "https://Chat.com"
          }
        }
      }}
    />
  );
};

export default Chat;

Error :

Unable to assign type '{ chatflowid: string; apiHost: string; theme: { chatWindow: { showTitle: boolean; title: string; titleAvatarSrc: string; showAgentMessages: boolean; welcomeMessage: string; errorMessage: string; ... 11 more ...; footer: { ...; }; }; }; }' to type 'Props'.

 Property 'theme' does not exist on type 'Props'.ts(2322)