doc-navigator
DocNavigator is an AI-powered chatbot builder that is designed to improve the user experience on product documentation/support websites.
DocNavigator is an AI-powered chatbot builder that is designed to improve the user experience on product documentation/support websites. It can be trained on the data available on the company's website, making it a scalable solution for organizations of any size.
With its ability to handle multiple queries at once, DocNavigator can save customers time and boost productivity, all while improving customer satisfaction.
To use the DocNavigator
, you'll need to have npm
or yarn
installed.
-
Install the package using
npm
oryarn
:npm install doc-navigator
or
yarn add doc-navigator
-
Import the
SearchComponent
in your React component:import { SearchComponent } from 'doc-navigator';
To use the DocNavigator
, simply add SearchComponent
to your React component's render method:
import React from 'react';
import { SearchComponent } from 'doc-navigator';
export const MyComponent = () => {
return (
<div>
<h1>My Component</h1>
<SearchComponent
url="https://docnavigator.in" // [Visit here for more info](https://github.com/vgulerianb/DocNavigator)
projectId="8c1fe927-d91f-471d-8de4-ded76a58d686"
variant="dark" //light
welcomeMessage="Hi, how can I help you?"
/>
</div>
);
};
The SearchComponent
accepts the following props:
-
url
(string, required): The URL of the search endpoint. // Visit here for more info -
welcomeMessage
(string, optional): An optional welcome message to display above the search box. -
projectId
(string, required): The ID of the project to search within. -
variant
('dark' | 'light'
, optional): The color variant of the search component. Use'dark'
for dark mode and'light'
for light mode. -
width
(string, optional): The width of the search component. -
height
(string, optional): The height of the search component. -
searchComponent
(React component, optional): An optional custom search component to use instead of the default one.
That's it! You should now be able to use the `SearchComponent` in your React project. Feel free to raise a issue if you have any doubt.