A “trigger” can be a button, a search bar, or any other element that you want to use to open the Inkeep modal.

​
Quick Start

import React, { useState } from "react";
import {
  InkeepCustomTrigger,
  InkeepCustomTriggerProps,
  InkeepWidgetBaseSettings,
} from "@inkeep/widgets";

const baseSettings: InkeepWidgetBaseSettings = {
  apiKey: process.env.REACT_APP_INKEEP_INTEGRATION_API_KEY!,
  integrationId: process.env.REACT_APP_INKEEP_INTEGRATION_ID!,
  organizationId: process.env.REACT_APP_INKEEP_ORGANIZATION_ID!,
  organizationDisplayName: "Inkeep",
  primaryBrandColor: "#522FC9",
};

const InkeepCustomTriggerComponent: React.FC = () => {
  const [isOpen, setIsOpen] = useState(false);

  const handleClose = useCallback(() => {
    console.log("Modal closed");
    setIsOpen(false);
  }, []);

  const inkeepCustomTriggerProps: InkeepCustomTriggerProps = {
    isOpen,
    onClose: handleClose,
    baseSettings,
  };

  return (
    <div>
      <button onClick={() => setIsOpen(!isOpen)}>Toggle Modal</button>
      <InkeepCustomTrigger {...inkeepCustomTriggerProps} />
    </div>
  );
};

export default InkeepCustomTriggerComponent;

​
InkeepCustomTriggerProps

This type represents the configuration for the Inkeep custom trigger widget.

PropertyTypeDescription
isOpenbooleanRequired. Determines whether the modal is open.
onClose() => void Required. Callback for when the modal is closed.
onOpen() => void Callback for when the modal is opened. Default undefined.
baseSettingsInkeepWidgetBaseSettingsRequired. Base settings for any Inkeep widget. See reference here.
modalSettingsInkeepModalSettingsSettings for the modal. See reference here.
searchSettingsInkeepSearchSettingsAdditional search settings for the Inkeep widget. See reference here.
aiChatSettingsInkeepAIChatSettingsAI chat settings for the Inkeep widget. See reference here.

​
Example

import type { InkeepCustomTriggerProps } from "@inkeep/widgets";
import baseSettings from "./baseSettings"; // your base settings typeof InkeepWidgetBaseSettings

const modalSettings: InkeepCustomTriggerProps = {
    isOpen: false,
    onClose: undefined,
    onOpen: undefined,
    baseSettings : {
        ...baseSettings,
    },
    modalSettings : {
        //... typeof InkeepModalSettings
    }
    searchSettings : {
        //... typeof InkeepSearchSettings
    },
    aiChatSettings : {
        //... typeof InkeepAIChatSettings
    },
};
Embedded ChatChat Button