# nlx-chat-sdk

> SDK to talk to NLX bots

Latest version **0.3.0** (published 2020-09-30) · MIT license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install nlx-chat-sdk
pnpm add nlx-chat-sdk
yarn add nlx-chat-sdk
bun add nlx-chat-sdk
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 0.3.0 |
| Published | 2020-09-30 |
| First published | 2019-06-27 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 10 |
| Unpacked size | 580.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Peter Szerzo |
| Maintainers | nlxai |

## Links

- npm: https://www.npmjs.com/package/nlx-chat-sdk
- npm.io page: https://npm.io/package/nlx-chat-sdk

## Dependencies (10)

- [ramda](https://npm.io/package/ramda.md) ^0.26.1
- [react](https://npm.io/package/react.md) ^16.13.1
- [react-dom](https://npm.io/package/react-dom.md) ^16.13.1
- [snarkdown](https://npm.io/package/snarkdown.md) ^1.2.2
- [tinycolor2](https://npm.io/package/tinycolor2.md) ^1.4.1
- [whatwg-fetch](https://npm.io/package/whatwg-fetch.md) ^3.0.0
- [@emotion/core](https://npm.io/package/@emotion/core.md) ^10.0.28
- [@emotion/styled](https://npm.io/package/@emotion/styled.md) ^10.0.27
- [emotion-theming](https://npm.io/package/emotion-theming.md) ^10.0.27
- [promise-polyfill](https://npm.io/package/promise-polyfill.md) ^8.1.3

## Recent versions

- 0.3.0 (latest) — 2020-09-30
- 0.2.5 — 2020-06-13
- 0.2.4 — 2020-04-17
- 0.2.3 — 2020-04-17
- 0.2.2 — 2019-11-21
- 0.2.1 — 2019-11-06
- 0.2.0 — 2019-11-05
- 0.1.12 — 2019-11-02
- 0.1.11 — 2019-11-01
- 0.1.10 — 2019-10-29
- 0.1.9 — 2019-10-29
- 0.1.8 — 2019-10-25
- 0.1.7 — 2019-10-22
- 0.1.6 — 2019-10-21
- 0.1.4 — 2019-10-18
- … 10 more at https://npm.io/package/nlx-chat-sdk/versions

## README

# Chat SDK for NLX bots

This is our official JavaScript SDK to communicate with NLX conversational bots.

## Getting started

```js
import createConversation from "nlx-chat-sdk";

// Create some configuration
const testConfig = {
  botUrl: "" // obtain from NLX deployments page
};

// Start the conversation
const convo = createConversation(testConfig);

// Subscribe to changes in the list of messages
convo.subscribe(messages => {
  console.log(messages);
});

// Send a message from the user's end
convo.sendText("hello");
```

## API reference

The package exports a single function called `createConversation`, which is called with the bot configuration and returns a conversation handler object. This object has the following methods:

#### `sendText: (text: string) => void`

Send a simple text to your bot.

#### `sendChoice: (choiceId: string) => void`

Your bot may send a list of choices to choose from, each with a `choiceText` and a `choiceId` field. You can use `choiceText` as button labels, and include the `choiceId` in this method when sending responses.

#### `sendSlots: (slots: Array<{ slotId: string; value: unknown }>) => void`

Send slot values directly through custom widgets such as interactive maps.

#### `subscribe: (subscriber: (messages: Message[], additional: { payload?: string }) => void) => void`

Subscribe to the current state of messages whenever there is a change.

#### `unsubscribe: (subscriber: (messages: Message[], additional: { payload?: string }) => void) => void`

Remove a subscription.

#### `unsubscribeAll: () => void`

Remove all subscriptions.

#### `reset: () => void`

Reset the conversation. This makes sure that information previously collected by your bot will not affect the logic of the conversation any longer.

## Usage with React

We provide a [React](https://reactjs.org/) example in TypeScript to illustrate how the project works in a modern web application framework. This implementation uses our `useChat` [hook](https://reactjs.org/docs/hooks-intro.html) which you can use to build your own chat widget:

```jsx
import { useChat } from "nlx-chat-sdk/react-utils";

const ChatWidget = () => {
  const chat = useChat({
    botUrl: ""
  });

  return (
    <div>
      {chat.messages.map(/* render messages in the current conversation */)}
    </div>
  );
};
```

See [full example](examples/with-react.tsx).

The API of the hook is similar to the vanilla API. It leaves out subscribe and unsubscribe methods as they are used internally in effect hooks, making sure things are properly cleaned up. Instead, messages are readily available in the `chat.messages` field, and we added state hooks for taking care of the value of the chat input field. You are free to not use these and manage things on your own.

## Usage with \*

Do you work with Vue? React without hooks? Custom elements? Elm? Let us know what framework you are looking to build web-based chat applications with so we can look into making utilities for those.

## TypeScript

This SDK is written in TypeScript so you can use our type definitions in your project.

## Widget

This package also exports a themeable widget build in React. [Docs here](src/widget/README.md).

## Contributing

Issues and feature requests are always welcome.

## License

MIT.

---
_Source: https://npm.io/package/nlx-chat-sdk · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._