UI2 Docs

UI2 API Overview

Learn the UI2 API from inside out

Welcome to the UI2 API Documentation.

This documentation will guide you through not only the parameters for every single method and function available in UI2, but also how it works. By the end of this documentation, you'll also understand how to build your own integrations into UI2 and use intent nearly everywhere.

The Structure of UI2

First, we have to have a quick overview of how UI2 works.

The IntentCreator Class

At it's core, all UI2 implementations are based off the IntentCreator class.

This class helps manage all intents on your application, and also contains the logic to add intents and identify intents.

The UI2 Builder Function

However, since it can be tedious to directly operate on a class ocassionally, UI2 is exposed to the user with a function builder interface.

For example, here's what it would look like with IntentCreator:

let ic = new IntentCreator();
ic.addIntent("intent1", {
	// config...
});
ic.addIntent("intent2", {
	// config...
});
ic.addIntent("intent3", {
	// config...
});
ic.identifyIntent("some intent");

But with the function builder syntax, it would look more like this:

let { identifyIntent } = createUI2()
	.addIntent("intent1", {
		// config...
	})
	.addIntent("intent2", {
		// config...
	})
	.addIntent("intent3", {
		// config...
	});
 
identifyIntent("some intent");

As you can see, you no longer need to have a reference to IntentCreator, but can rather build continuously on one function.

Extending UI2

Extending UI2 comes in two main steps.

First, extending IntentCreator. Extensions of IntentCreator should be more general (and can possibly be used with multiple wrapper functions).

Then, for your specific use-case, you can create a new wrapper function using your IntentCreator. The most basic of which simply returns an instance of the class.

For example, the React hook uses the StatefulIntentCreator class which is uses this pattern.

Read the Advanced Usage Extending UI2 documentation for more information.

Stateful UI2 Explained

The "basic" UI2 API (that is, with createUI2 and IntentCreator) only handles one thing: Identifying Intent based off text, and basic handling of clean up, if you pass in what intents you already know are identified.

In other words, it does not keep track of the state of your UI2 app.

The StatefulIntentCreator is an extension of the standard IntentCreator, and it implements various features to keep track of state in your application including:

  • The content of the UI2 input
  • What intents are "active" or currently identified
  • The loading state of the AI
  • All the promises and async processing
  • Submission of intents

This structure is perfect for usage with React, and there is a special hook useUI2 available under ui2-sdk/react to access a StatefulIntentCreator wrapper.

Documentation Structure

We'll first go through the IntentCreator class, and how it works.

Then, we'll discuss createUI2 and its methods.

Finally, we will talk more about how to use the core extensions of the StatefulIntentCreator class and the React Hook.

On this page