@applica-software-guru/persona-sdk 0.0.1-preview0 → 0.0.1-preview2
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 +2 -65
- package/dist/bundle.cjs.js +6 -14
- package/dist/bundle.cjs.js.map +1 -1
- package/dist/bundle.es.js +1696 -2053
- package/dist/bundle.es.js.map +1 -1
- package/dist/bundle.iife.js +6 -14
- package/dist/bundle.iife.js.map +1 -1
- package/dist/bundle.umd.js +6 -14
- package/dist/bundle.umd.js.map +1 -1
- package/package.json +5 -5
- package/vite.config.ts +5 -5
package/README.md
CHANGED
|
@@ -1,66 +1,3 @@
|
|
|
1
|
-
# Persona SDK
|
|
1
|
+
# Persona SDK ⚙️
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
# Installation
|
|
6
|
-
|
|
7
|
-
To install this plugin using npm, run the following command in your terminal:
|
|
8
|
-
|
|
9
|
-
```shell
|
|
10
|
-
npm install @applica-software-guru/persona-sdk
|
|
11
|
-
```
|
|
12
|
-
|
|
13
|
-
# Usage
|
|
14
|
-
|
|
15
|
-
You can use `Persona` or `PersonaButton` based on your requirement.
|
|
16
|
-
`PersonaButton` is useful inside raw HTML elements like buttons, divs, etc.
|
|
17
|
-
`Persona` is useful when you want to use it inside a React component.
|
|
18
|
-
|
|
19
|
-
## PersonaButton
|
|
20
|
-
|
|
21
|
-
You can use `PersonaButton` inside your React component.
|
|
22
|
-
Provide a valid `agentId` to the `PersonaButton` component.
|
|
23
|
-
|
|
24
|
-
```javascript
|
|
25
|
-
import { PersonaButton } from '@applica-software-guru/persona-sdk';
|
|
26
|
-
|
|
27
|
-
const App = () => {
|
|
28
|
-
return (
|
|
29
|
-
<div>
|
|
30
|
-
<PersonaButton agentId="your-agent-id" size={90} />
|
|
31
|
-
</div>
|
|
32
|
-
);
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
export default App;
|
|
36
|
-
```
|
|
37
|
-
|
|
38
|
-
## Persona
|
|
39
|
-
|
|
40
|
-
You can use `Persona` inside your plain HTML file as well.
|
|
41
|
-
Please refer always to the latest version of the SDK in the following URLs.
|
|
42
|
-
|
|
43
|
-
```html
|
|
44
|
-
<div id="persona"></div>
|
|
45
|
-
<!-- Add react and react-dom libraries -->
|
|
46
|
-
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/18.2.0/umd/react.production.min.js"></script>
|
|
47
|
-
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/18.2.0/umd/react-dom.production.min.js"></script>
|
|
48
|
-
<!-- Add persona-sdk library -->
|
|
49
|
-
<script src="https://storage.cloud.google.com/persona-cdn/sdk/latest/bundle.iife.js"></script>
|
|
50
|
-
<!-- Add persona-sdk styles -->
|
|
51
|
-
<link rel="stylesheet" href="https://storage.cloud.google.com/persona-cdn/sdk/latest/style.css" />
|
|
52
|
-
|
|
53
|
-
<!-- Initialize persona-sdk -->
|
|
54
|
-
<script type="text/javascript">
|
|
55
|
-
const persona = new personaSDK.Persona('persona', {
|
|
56
|
-
agentId: 'your-agent-id',
|
|
57
|
-
size: 100,
|
|
58
|
-
});
|
|
59
|
-
</script>
|
|
60
|
-
```
|
|
61
|
-
|
|
62
|
-
The `Persona` component accepts the following props:
|
|
63
|
-
|
|
64
|
-
- `agentId`: The agent ID you get from the Persona dashboard.
|
|
65
|
-
- `size`: The size of the Persona component.
|
|
66
|
-
- `listeners`: An object containing event listeners for the Persona component.
|
|
3
|
+
TODO: New Doc.
|