@humation/sdk 0.1.0
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 +172 -0
- package/dist/index.d.mts +699 -0
- package/dist/index.d.ts +699 -0
- package/dist/index.js +520 -0
- package/dist/index.js.map +1 -0
- package/dist/index.mjs +495 -0
- package/dist/index.mjs.map +1 -0
- package/openapi.json +778 -0
- package/package.json +54 -0
package/README.md
ADDED
|
@@ -0,0 +1,172 @@
|
|
|
1
|
+
# Humation SDK
|
|
2
|
+
|
|
3
|
+
Avatar Builder SDK for Humation.
|
|
4
|
+
|
|
5
|
+
This SDK is for building and previewing Humation avatars. It exposes the concepts designers and product teams actually use: templates, groups, parts, colors, backgrounds, crops, SVG preview, and render URLs.
|
|
6
|
+
|
|
7
|
+
## Status
|
|
8
|
+
|
|
9
|
+
This package is in developer preview.
|
|
10
|
+
|
|
11
|
+
- API host: `https://api.humation.app/v1`
|
|
12
|
+
- Main template: `humation-1`
|
|
13
|
+
- API key: required for template, asset, and render requests
|
|
14
|
+
- Rate limit: `600 requests / minute / key`
|
|
15
|
+
- Package version: `0.x`, breaking changes may still happen
|
|
16
|
+
|
|
17
|
+
## Install
|
|
18
|
+
|
|
19
|
+
```sh
|
|
20
|
+
npm install @humation/sdk
|
|
21
|
+
```
|
|
22
|
+
|
|
23
|
+
For local workspace testing:
|
|
24
|
+
|
|
25
|
+
```sh
|
|
26
|
+
bun install
|
|
27
|
+
bun run --cwd apps/sdk build
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
## Get An API Key
|
|
31
|
+
|
|
32
|
+
Open the developer page and create a free key:
|
|
33
|
+
|
|
34
|
+
```txt
|
|
35
|
+
https://humation.app/developer
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
Local development:
|
|
39
|
+
|
|
40
|
+
```txt
|
|
41
|
+
http://localhost:3000/developer
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
The raw API key is shown only once. Humation stores only a hash, so copy it when it is created.
|
|
45
|
+
|
|
46
|
+
Do not commit API keys to Git. Use environment variables:
|
|
47
|
+
|
|
48
|
+
```sh
|
|
49
|
+
HUMATION_API_KEY=sk_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
## Quickstart
|
|
53
|
+
|
|
54
|
+
```ts
|
|
55
|
+
import { createHumationClient } from '@humation/sdk';
|
|
56
|
+
|
|
57
|
+
const humation = createHumationClient({
|
|
58
|
+
apiKey: process.env.HUMATION_API_KEY,
|
|
59
|
+
});
|
|
60
|
+
|
|
61
|
+
const avatar = await humation.loadAvatar('humation-1');
|
|
62
|
+
|
|
63
|
+
avatar.setPart('hair', '002');
|
|
64
|
+
avatar.setPart('body', '003');
|
|
65
|
+
avatar.setColor('skin', 'F2C7A5');
|
|
66
|
+
avatar.setBackground('transparent');
|
|
67
|
+
avatar.setCrop('avatar');
|
|
68
|
+
|
|
69
|
+
const svg = avatar.toSvg();
|
|
70
|
+
const renderUrl = avatar.renderUrl();
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
`toSvg()` is designed for immediate preview. It uses SVG assets already fetched by the SDK, so color picker interactions can update without calling the API on every drag.
|
|
74
|
+
|
|
75
|
+
`renderUrl()` points to the API render endpoint for confirmed display, export, or save flows. Since the public render API requires an API key, fetch the URL with an Authorization header instead of embedding the key in the URL.
|
|
76
|
+
|
|
77
|
+
```ts
|
|
78
|
+
const response = await fetch(avatar.renderUrl(), {
|
|
79
|
+
headers: {
|
|
80
|
+
Authorization: `Bearer ${process.env.HUMATION_API_KEY}`,
|
|
81
|
+
},
|
|
82
|
+
});
|
|
83
|
+
|
|
84
|
+
const renderedSvg = await response.text();
|
|
85
|
+
```
|
|
86
|
+
|
|
87
|
+
## List Templates
|
|
88
|
+
|
|
89
|
+
```ts
|
|
90
|
+
const templates = await humation.listTemplates();
|
|
91
|
+
|
|
92
|
+
console.log(templates.map((template) => template.id));
|
|
93
|
+
```
|
|
94
|
+
|
|
95
|
+
## Inspect Groups And Parts
|
|
96
|
+
|
|
97
|
+
```ts
|
|
98
|
+
const avatar = await humation.loadAvatar('humation-1');
|
|
99
|
+
|
|
100
|
+
for (const group of avatar.getGroups()) {
|
|
101
|
+
console.log(group.id, group.label);
|
|
102
|
+
console.log(group.parts.map((part) => part.id));
|
|
103
|
+
}
|
|
104
|
+
```
|
|
105
|
+
|
|
106
|
+
Groups are the editable slots of the avatar, such as hair, body, face, or other layer groups. Parts are selectable SVG variants inside each group.
|
|
107
|
+
|
|
108
|
+
Some groups can be linked. For example, selecting a visible part may update a hidden linked layer so the final avatar stacks correctly. Use `setPart()` and let the SDK resolve those links.
|
|
109
|
+
|
|
110
|
+
## Change Colors
|
|
111
|
+
|
|
112
|
+
```ts
|
|
113
|
+
for (const color of avatar.getColors()) {
|
|
114
|
+
console.log(color.id, color.label, color.default);
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
avatar.setColor('skin', 'F2C7A5');
|
|
118
|
+
```
|
|
119
|
+
|
|
120
|
+
Colors are six-digit hex values. A leading `#` is optional.
|
|
121
|
+
|
|
122
|
+
`stroke` means stroke color. It does not mean stroke width.
|
|
123
|
+
|
|
124
|
+
## Background And Crop
|
|
125
|
+
|
|
126
|
+
```ts
|
|
127
|
+
avatar.setBackground('transparent');
|
|
128
|
+
avatar.setBackground('F6F5F4');
|
|
129
|
+
|
|
130
|
+
avatar.setCrop('avatar');
|
|
131
|
+
avatar.setCrop('full');
|
|
132
|
+
```
|
|
133
|
+
|
|
134
|
+
Use `avatar` for square profile-style output and `full` for the full-body illustration.
|
|
135
|
+
|
|
136
|
+
## Export PNG
|
|
137
|
+
|
|
138
|
+
`toPngBlob()` uses `Image`, `document`, and `canvas`, so it is browser-only.
|
|
139
|
+
|
|
140
|
+
```ts
|
|
141
|
+
const pngBlob = await avatar.toPngBlob();
|
|
142
|
+
```
|
|
143
|
+
|
|
144
|
+
For server-side PNG generation, render SVG first and convert it using your server image pipeline.
|
|
145
|
+
|
|
146
|
+
## Error Handling
|
|
147
|
+
|
|
148
|
+
Non-2xx API responses throw `HumationApiError`.
|
|
149
|
+
|
|
150
|
+
```ts
|
|
151
|
+
import { HumationApiError, createHumationClient } from '@humation/sdk';
|
|
152
|
+
|
|
153
|
+
try {
|
|
154
|
+
await createHumationClient({
|
|
155
|
+
apiKey: process.env.HUMATION_API_KEY,
|
|
156
|
+
}).loadAvatar('humation-1');
|
|
157
|
+
} catch (error) {
|
|
158
|
+
if (error instanceof HumationApiError) {
|
|
159
|
+
console.log(error.status, error.body);
|
|
160
|
+
}
|
|
161
|
+
}
|
|
162
|
+
```
|
|
163
|
+
|
|
164
|
+
## Raw API
|
|
165
|
+
|
|
166
|
+
Raw OpenAPI-generated functions are available under `raw`, but they are a low-level escape hatch.
|
|
167
|
+
|
|
168
|
+
```ts
|
|
169
|
+
import { raw } from '@humation/sdk';
|
|
170
|
+
```
|
|
171
|
+
|
|
172
|
+
Prefer `createHumationClient()` and `AvatarSession` unless you specifically need direct endpoint access.
|