@foisit/react-wrapper 1.2.0 → 2.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +97 -0
- package/package.json +1 -1
package/README.md
ADDED
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
# @foisit/react-wrapper
|
|
2
|
+
|
|
3
|
+
Power your React apps with an AI-driven text assistant.
|
|
4
|
+
|
|
5
|
+
> [!NOTE]
|
|
6
|
+
> 🎙️ **Coming Soon**: Voice recognition and responses are planned for a future release. Current support is focused on text-based interactions and AI intent matching.
|
|
7
|
+
|
|
8
|
+
---
|
|
9
|
+
|
|
10
|
+
## 🚀 Installation
|
|
11
|
+
|
|
12
|
+
```bash
|
|
13
|
+
npm install @foisit/react-wrapper
|
|
14
|
+
```
|
|
15
|
+
|
|
16
|
+
---
|
|
17
|
+
|
|
18
|
+
## 🔧 Basic Setup
|
|
19
|
+
|
|
20
|
+
Wrap your application in the `AssistantProvider` to enable the assistant.
|
|
21
|
+
|
|
22
|
+
```tsx
|
|
23
|
+
import { AssistantProvider } from '@foisit/react-wrapper';
|
|
24
|
+
|
|
25
|
+
const config = {
|
|
26
|
+
introMessage: 'Hi! How can I help?',
|
|
27
|
+
enableSmartIntent: true,
|
|
28
|
+
commands: [
|
|
29
|
+
{
|
|
30
|
+
command: 'home',
|
|
31
|
+
action: () => navigate('/'),
|
|
32
|
+
},
|
|
33
|
+
],
|
|
34
|
+
};
|
|
35
|
+
|
|
36
|
+
function App() {
|
|
37
|
+
return (
|
|
38
|
+
<AssistantProvider config={config}>
|
|
39
|
+
<YourApp />
|
|
40
|
+
</AssistantProvider>
|
|
41
|
+
);
|
|
42
|
+
}
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
---
|
|
46
|
+
|
|
47
|
+
## 🛡️ Critical Actions
|
|
48
|
+
|
|
49
|
+
Commands marked as `critical` will automatically trigger a confirmation flow in the UI.
|
|
50
|
+
|
|
51
|
+
```tsx
|
|
52
|
+
const config = {
|
|
53
|
+
commands: [
|
|
54
|
+
{
|
|
55
|
+
command: 'delete order',
|
|
56
|
+
critical: true,
|
|
57
|
+
description: 'cancel and delete your current order',
|
|
58
|
+
action: () => api.deleteOrder(),
|
|
59
|
+
},
|
|
60
|
+
],
|
|
61
|
+
};
|
|
62
|
+
```
|
|
63
|
+
|
|
64
|
+
---
|
|
65
|
+
|
|
66
|
+
## 🧠 AI Intent Matching
|
|
67
|
+
|
|
68
|
+
Enable `enableSmartIntent: true` to allow the assistant to understand natural language.
|
|
69
|
+
|
|
70
|
+
**User says:** _"Make it dark"_
|
|
71
|
+
**Matched Command:** `{ command: 'dark mode', keywords: ['lights out', 'dark', 'night'], ... }`
|
|
72
|
+
|
|
73
|
+
---
|
|
74
|
+
|
|
75
|
+
## 🛠️ Hook Usage: `useAssistant`
|
|
76
|
+
|
|
77
|
+
Interact with the assistant instance from any component.
|
|
78
|
+
|
|
79
|
+
```tsx
|
|
80
|
+
import { useAssistant } from '@foisit/react-wrapper';
|
|
81
|
+
|
|
82
|
+
function MyComponent() {
|
|
83
|
+
const assistant = useAssistant();
|
|
84
|
+
|
|
85
|
+
const addTempCommand = () => {
|
|
86
|
+
assistant.addCommand('surprise me', () => alert('Surprise!'));
|
|
87
|
+
};
|
|
88
|
+
|
|
89
|
+
return <button onClick={addTempCommand}>Add Command</button>;
|
|
90
|
+
}
|
|
91
|
+
```
|
|
92
|
+
|
|
93
|
+
---
|
|
94
|
+
|
|
95
|
+
## 👋 Gesture Activation
|
|
96
|
+
|
|
97
|
+
Once integrated, a subtle **"Powered by Foisit"** watermark appears. **Double-click** it to open the chat overlay.
|