Add AI Search to your ReadMe docs

<script id="inkeep-script" src="https://unpkg.com/@inkeep/uikit-js@0.3.18/dist/embed.js" type="module" defer></script>

<style>
  .rm-SearchToggle {
    display: none;
  }
</style>

<script type="text/javascript" defer>
  const inkeepScript = document.getElementById("inkeep-script");
  const readmeHeaderSearch = document.querySelector(".rm-Header-search");
  const inkeepDiv = document.createElement("div");
  inkeepDiv.id = "inkeepSearchBar";
  
    // configure and initialize the widget
  const addInkeepWidget = () => {
    const inkeepWidget = Inkeep().embed({
      componentType: "SearchBar",
      targetElement: "#inkeepSearchBar",
      colorModeSync: {
        observedElement: document.documentElement,
        isDarkModeCallback: (el) => {
          const currentTheme = el.getAttribute("data-color-mode");
          return currentTheme === "dark";
        },
        colorModeAttribute: "data-color-mode",
      },
      properties: {
        baseSettings: {
          apiKey: "INKEEP_API_KEY", // required
          integrationId: "INKEEP_INTEGRATION_ID", // required
          organizationId: "INKEEP_ORGANIZATION_ID", // required
          primaryBrandColor: "#26D6FF", // your brand color, widget color scheme is derived from this
          organizationDisplayName: "Inkeep",
          // ...optional settings
          theme: {
            // stylesheetUrls: ['/path/to/stylesheets'], // optional
            // ...optional settings
          },
        },
        modalSettings: {
          // optional settings
          openShortcutKey: "L"
        },
        searchSettings: {
          // optional settings
        },
        aiChatSettings: {
          // optional settings
          botAvatarSrcUrl: "https://mydomain.com/mylogo", // use your own bot avatar
          quickQuestions: [
            "Example question 1?",
            "Example question 2?",
            "Example question 3?",
          ],
        },
      },
    });
  };

  const observer = new MutationObserver(() => {
  	readmeHeaderSearch.appendChild(inkeepDiv)
  });
  observer.observe(document.head, { childList: true });

  inkeepScript.addEventListener("load", () => {
		addInkeepWidget(); // initialize the widget
  });
</script>