@atomm-developer/generator-sdk 1.0.3 → 1.0.4

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.
Files changed (2) hide show
  1. package/README.md +51 -415
  2. package/package.json +1 -1
package/README.md CHANGED
@@ -1,452 +1,88 @@
1
1
  # @atomm-developer/generator-sdk
2
2
 
3
- Atomm Generator 开放平台 SDK,为第三方生成器开发者提供登录、云保存、历史记录、积分、统一计费、导出,以及模板协议导入导出等平台能力。
3
+ [English](./README.md) | [简体中文](./README_zh.md)
4
4
 
5
- > 详细 API 文档及架构说明见 [docs/generator-open-platform-sdk.md](./docs/generator-open-platform-sdk.md)
5
+ The Atomm Generator Open Platform SDK provides core capabilities for third-party generator developers, including authentication, cloud storage, history, credits, billing, export, and template protocols.
6
6
 
7
- > 如果你正在做新的 AI vibe coding 生成器,建议同时阅读 [Runtime Contract](./docs/guide/runtime-contract.md)、[生成器开发者上手](./docs/mcp/onboarding.md) 和 `generator-sdk-mcp` 的 runtime starter 能力。
8
-
9
- ## 安装
7
+ ## Installation
10
8
 
11
9
  ```bash
12
- # npm 包(工程化项目)
10
+ # Via npm/pnpm/yarn
13
11
  pnpm add @atomm-developer/generator-sdk
14
12
 
15
- # CDN 引入(纯 HTML / vibe coding)
13
+ # Via CDN (for plain HTML)
16
14
  # <script src="https://static-res.atomm.com/scripts/js/generator-sdk/index.umd.js"></script>
17
- # CDN 方式下 window.GeneratorSDK 即为 SDK 类
18
15
  ```
19
16
 
20
- ## 快速开始
17
+ ## Quick Start
21
18
 
22
- ### 初始化
19
+ ### Initialization
23
20
 
24
- ```js
25
- import { GeneratorSDK, withBilling } from '@atomm-developer/generator-sdk'
26
- // CDN: const sdk = GeneratorSDK.init({ ... })
27
- // CDN: const withBilling = GeneratorSDK.withBilling
21
+ ```javascript
22
+ import { GeneratorSDK } from '@atomm-developer/generator-sdk';
28
23
 
29
24
  const sdk = GeneratorSDK.init({
30
- appKey: 'your_app_key', // 开发者控制台获取
31
- env: 'prod', // 'dev' | 'test' | 'pre' | 'prod',默认 'prod'
32
- })
25
+ appKey: 'your_app_key', // Get from developer console
26
+ env: 'prod', // 'dev' | 'test' | 'pre' | 'prod'
27
+ });
33
28
  ```
34
29
 
35
- ## 新生成器推荐链路
36
-
37
- 对于新的生成器,推荐分两层接入:
38
-
39
- - 平台能力走 `generator-sdk`
40
- - 嵌入协议走 `Generator Runtime Contract`
41
-
42
- 如果你的生成器需要“发布模板 / 导入模板”,推荐直接使用 `sdk.template` 统一模板 JSON 协议、模板下载和模板导入,而不是在项目里手写一套私有结构。
43
-
44
- 如果你要让生成器后续接入模板页,优先通过 `generator-sdk-mcp` 生成 `starter-html-runtime` 或 `starter-vue-runtime`,而不是只生成一个完整页面。
45
-
46
- 同一 `appKey + env` 多次调用 `init()` 返回同一实例(全局单例)。初始化后 SDK 自动从 localStorage 恢复登录状态。
47
-
48
- ### Auth — 登录与用户
30
+ ### Core Modules
49
31
 
50
- ```js
51
- // 获取当前状态(同步,读本地缓存)
52
- const { isLogin, userInfo } = sdk.auth.getStatus()
32
+ #### Auth - Authentication
33
+ ```javascript
34
+ // Login
35
+ const userInfo = await sdk.auth.login();
53
36
 
54
- // 弹出登录弹窗(成功返回 UserInfo,取消则 reject)
55
- const userInfo = await sdk.auth.login()
37
+ // Get current status
38
+ const { isLogin, userInfo } = sdk.auth.getStatus();
56
39
 
57
- // 退出登录(清除本地 token + 调用登出接口)
58
- await sdk.auth.logout()
59
-
60
- // 监听状态变化(返回取消函数)
61
- const unsubscribe = sdk.auth.onChange((status) => {
62
- console.log('登录状态:', status.isLogin, status.userInfo?.userName)
63
- })
64
-
65
- // 获取原始 token(给需要自定义请求的场景)
66
- const token = sdk.auth.getToken()
40
+ // Logout
41
+ await sdk.auth.logout();
67
42
  ```
68
43
 
69
- > 注意:`init()` token 验证是异步的,推荐通过 `onChange` 监听最终登录状态。
70
-
71
- ### Cloud 云保存与恢复
72
-
73
- ```js
74
- // 保存(自动判断新建或更新)
75
- const result = await sdk.cloud.save({
76
- title: '我的作品', // 可选,默认 'Draft'
77
- snapshot: { brightness: 0.5, contrast: 1.2 }, // 必填,可 JSON 序列化的纯对象
78
- cover: document.getElementById('myCanvas'), // 可选,HTMLCanvasElement(自动上传 OSS)
79
- originImage: originImageUrl, // 可选,Canvas / data URL / HTTP URL
80
- id: existingId, // 有则更新,无则新建
81
- })
82
- // result: { id: 123, isNew: true }
44
+ #### Cloud & History - Storage
45
+ ```javascript
46
+ // Save to cloud
47
+ await sdk.cloud.save({
48
+ title: 'My Design',
49
+ snapshot: { /* your state object */ },
50
+ cover: canvasElement,
51
+ });
83
52
 
84
- // 恢复
85
- const data = await sdk.cloud.restore(recordId)
86
- // data: { id, title, cover, snapshot, originImageUrl, createdAt, updatedAt }
87
-
88
- // 删除
89
- await sdk.cloud.delete(recordId)
53
+ // Get history list
54
+ const list = await sdk.history.getList({ page: 1, pageSize: 20 });
90
55
  ```
91
56
 
92
- #### 典型自动保存模式
93
-
94
- ```js
95
- let currentId = new URLSearchParams(location.search).get('id')
96
- currentId = currentId ? Number(currentId) : null
57
+ #### Billing & Credits - Monetization
58
+ ```javascript
59
+ // Check usage (free quota + credits)
60
+ const usage = await sdk.billing.getUsage();
97
61
 
98
- // 初始化时恢复
99
- if (currentId) {
100
- const data = await sdk.cloud.restore(currentId)
101
- applyState(data.snapshot)
102
- if (data.originImageUrl) loadImage(data.originImageUrl)
103
- }
62
+ // Consume with billing (recommended)
63
+ import { withBilling } from '@atomm-developer/generator-sdk';
104
64
 
105
- // 状态变化时防抖保存
106
- let saveTimer
107
- function onStateChange(state) {
108
- clearTimeout(saveTimer)
109
- saveTimer = setTimeout(async () => {
110
- const result = await sdk.cloud.save({
111
- snapshot: state,
112
- cover: canvas,
113
- id: currentId || undefined,
114
- })
115
- if (result.isNew) {
116
- currentId = result.id
117
- history.replaceState(null, '', `?id=${result.id}`)
118
- }
119
- }, 1500)
120
- }
65
+ await withBilling(sdk.billing, async () => {
66
+ // Your paid action (e.g., download or AI generate)
67
+ await sdk.export.download();
68
+ });
121
69
  ```
122
70
 
123
- ### History 历史记录
124
-
125
- ```js
126
- // 获取列表(分页,不含 snapshot)
127
- const list = await sdk.history.getList({ page: 1, pageSize: 20 })
128
- // list: { total: number, items: [{ id, title, cover, createdAt, updatedAt }] }
129
-
130
- // 获取详情(含完整 snapshot,与 cloud.restore 相同结构)
131
- const detail = await sdk.history.getDetail(recordId)
132
-
133
- // 删除
134
- await sdk.history.delete(recordId)
135
- ```
136
-
137
- ### Credits — 积分
138
-
139
- ```js
140
- // 查询余额(注意返回字段名为 quota)
141
- const { quota } = await sdk.credits.getBalance()
142
-
143
- // 获取缓存余额(同步,首次调用 getBalance 前为 0)
144
- const cached = sdk.credits.getCachedBalance()
145
-
146
- // 扣除积分(action 需在控制台预先申请,接口待后端新增)
147
- const result = await sdk.credits.consume({ amount: 10, action: 'ai_generate' })
148
- // result: { success: true, balance: 90, transactionId: 'txn_xxx' }
149
-
150
- // 监听积分变化
151
- const unsubscribe = sdk.credits.onChange((balance) => updateUI(balance))
152
- ```
153
-
154
- ### Billing — 统一计费(推荐)
155
-
156
- Billing 是免费次数 + 积分扣除的高层封装。计费优先级:免费时段(30s)→ 免费次数 → 积分扣除。
157
-
158
- ```js
159
- // 获取使用额度(并行拉取免费次数和积分余额)
160
- const usage = await sdk.billing.getUsage()
161
- // {
162
- // freeRemaining: 5, 剩余免费次数
163
- // freeTotal: 10, 免费总次数
164
- // creditsPerUse: 6, 每次所需积分
165
- // creditsBalance: 78633, 积分余额
166
- // inFreePeriod: false, 是否在免费时段内
167
- // freePeriodRemaining: 0, 免费时段剩余秒数
168
- // }
169
-
170
- // 获取缓存额度(同步,首次 getUsage 前返回 null)
171
- const cached = sdk.billing.getCachedUsage()
172
-
173
- // 校验是否可操作(同步,不扣费)
174
- const check = sdk.billing.check()
175
- // { canProceed: true, reason: 'free_period' | 'free_count' | 'credits' | 'insufficient' }
176
-
177
- // 消耗一次(后端自动判断扣免费次数还是积分,免费时段内不发请求)
178
- const result = await sdk.billing.consume({ externalId: 'download_123' })
179
- // { freeRemaining: 4, isCredit: false }
180
-
181
- // 手动刷新积分余额(consume 中 isCredit=true 时自动调用)
182
- await sdk.billing.refreshCredits()
183
-
184
- // 监听额度变化
185
- const unsubscribe = sdk.billing.onChange((usage) => renderBillingUI(usage))
186
- ```
187
-
188
- ### Export — 导出
189
-
190
- Export 模块只处理导出操作,不涉及计费。**使用前必须先注册 provider。**
191
-
192
- ```js
193
- // 1. 注册导出能力(初始化时调用一次)
71
+ #### Export - Output
72
+ ```javascript
73
+ // Register provider first
194
74
  sdk.export.register({
195
- getExportCanvas: (purpose) => {
196
- // purpose: 'download' | 'studio' | 'cover'
197
- return document.getElementById('outputCanvas')
198
- },
199
- getFileName: (purpose) => `my-design-${Date.now()}.png`, // 可选
200
- })
201
-
202
- // 2. 下载图片到本地
203
- await sdk.export.download({
204
- fileName: 'my-design.png', // 可选
205
- format: 'png', // 'png' | 'svg',默认 'png'
206
- })
207
-
208
- // 3. 打开到 xTool Studio(canvas → 上传 OSS → xtool:// 协议)
209
- await sdk.export.openInStudio()
210
- ```
211
-
212
- ### Template — 模板协议
213
-
214
- Template 模块负责统一模板 JSON 协议、模板导入导出 helper,以及把模板状态应用回 runtime。
215
-
216
- ```js
217
- const template = sdk.template.build({
218
- generatorId: runtime.generatorId,
219
- appKey: 'your_app_key',
220
- state: runtime.getState(),
221
- panelSchema: runtime.getPanelSchema(),
222
- selectedFieldPaths: ['params.text', 'params.color'],
223
- templateMeta: {
224
- name: 'Spring Template',
225
- },
226
- })
227
-
228
- // 下载模板 JSON
229
- sdk.template.download(template)
230
-
231
- // 导入模板 JSON
232
- const imported = sdk.template.parse(templateText)
233
- const snapshot = sdk.template.toRuntimeSnapshot(imported)
234
-
235
- await sdk.template.applyToRuntime(runtime, imported, {
236
- onPanelFilter(panelFilter) {
237
- currentPanelFilter = panelFilter
238
- },
239
- })
240
- ```
241
-
242
- 模板协议核心结构:
243
-
244
- ```ts
245
- interface GeneratorTemplateDefinition {
246
- type: 'generator-template'
247
- version: '1.0.0'
248
- generatorId: string
249
- defaults: Record<string, unknown>
250
- panelFilter: PanelFilter
251
- adjustableFields: TemplateFieldOption[]
252
- }
253
- ```
254
-
255
- ### withBilling — 组合计费与操作
256
-
257
- 将任意异步操作包装为「校验 → 执行 → 扣费」的完整流程。
258
-
259
- ```js
260
- import { withBilling } from '@atomm-developer/generator-sdk'
261
- // CDN: const withBilling = GeneratorSDK.withBilling
262
-
263
- // 带计费的下载
264
- try {
265
- const { result, billing } = await withBilling(
266
- sdk.billing,
267
- () => sdk.export.download({ fileName: 'my-design.png' }),
268
- )
269
- // result: { success: true, fileName: '...' }
270
- // billing: { freeRemaining: 4, isCredit: false }
271
- } catch (err) {
272
- if (err.code === 40301) alert('积分不足,请充值')
273
- }
274
-
275
- // 带计费的打开 Studio
276
- await withBilling(sdk.billing, () => sdk.export.openInStudio())
75
+ getExportCanvas: (purpose) => document.getElementById('myCanvas'),
76
+ });
277
77
 
278
- // 带计费的自定义操作
279
- await withBilling(sdk.billing, () => myAiGenerate(), { externalId: 'ai_123' })
78
+ // Download or Open in Studio
79
+ await sdk.export.download();
80
+ await sdk.export.openInStudio();
280
81
  ```
281
82
 
282
- ## 错误处理
283
-
284
- SDK 统一抛出 `SdkError`,含 `code` 和 `message` 属性:
285
-
286
- ```js
287
- import { SdkError } from '@atomm-developer/generator-sdk'
288
- // CDN: const SdkError = GeneratorSDK.SdkError
289
-
290
- try {
291
- await sdk.credits.consume({ amount: 10, action: 'ai_generate' })
292
- } catch (err) {
293
- if (err instanceof SdkError) {
294
- switch (err.code) {
295
- case 20101: await sdk.auth.login(); break // token 失效(SDK 已自动清除状态)
296
- case 40301: alert('积分不足'); break
297
- case 40302: alert('action 无权限'); break
298
- case -1: alert('网络错误'); break
299
- }
300
- }
301
- }
302
- ```
303
-
304
- | 错误码 | 含义 |
305
- |--------|------|
306
- | `20101` | 未登录 / token 无效(SDK 自动触发退出并清除 token) |
307
- | `40301` | 积分不足 |
308
- | `40302` | action 无权限 |
309
- | `-1` | 网络错误 / 客户端错误 |
310
-
311
- ## TypeScript 类型
312
-
313
- 所有类型从包中直接导入:
314
-
315
- ```typescript
316
- import type {
317
- SdkEnv, SdkInitOptions,
318
- UserInfo, AuthStatus, AuthChangeCallback,
319
- CloudSaveOptions, CloudSaveResult, CloudRecord,
320
- HistoryListOptions, HistoryListResult, HistoryItem,
321
- CreditsConsumeOptions, CreditsConsumeResult, CreditsChangeCallback,
322
- UsageInfo, BillingCheckResult, BillingConsumeOptions, BillingConsumeResult, BillingChangeCallback,
323
- ExportPurpose, ExportProvider, ExportDownloadOptions, ExportDownloadResult, ExportOpenInStudioResult,
324
- PanelFilter, PanelSchema,
325
- TemplateFieldOption, GeneratorTemplateDefinition, TemplateBuildOptions, TemplateRuntimeSnapshot,
326
- WithBillingResult,
327
- } from '@atomm-developer/generator-sdk'
328
- ```
329
-
330
- ## 各环境 API
331
-
332
- | 环境 | BaseURL |
333
- |------|---------|
334
- | `prod` | `https://api.xtool.com` |
335
- | `pre` | `https://api-pre.xtool.com` |
336
- | `test` | `https://api-test.xtool.com` |
337
- | `dev` | `https://api-dev.makeblock.com` |
338
-
339
- ## 构建
340
-
341
- ```bash
342
- cd SDK
343
- pnpm install
344
- pnpm build # 构建 ESM + UMD
345
- pnpm build:esm # 仅构建 ESM
346
- pnpm build:umd # 仅构建 UMD
347
- pnpm dev # ESM watch 模式
348
- pnpm dev:umd # UMD watch 模式(开发配置:不压缩、带 sourcemap)
349
- pnpm type-check # TypeScript 类型检查
350
- ```
351
-
352
- ### 本地调试 demo
353
-
354
- 在 `demo/demo.html` 中本地调试 SDK 源码,可按以下步骤操作:
355
-
356
- 1. **终端 1**:构建 UMD(开发模式, watch 会自动增量编译)
357
- ```bash
358
- npm run dev:umd
359
- ```
360
-
361
- 2. **终端 2**:启动静态服务
362
- ```bash
363
- npm run demo
364
- ```
365
-
366
- 3. **浏览器访问**:`http://localhost:3000/demo/demo.html`(端口以终端输出为准)
367
-
368
- 4. **调试**:Chrome DevTools → Sources 中可找到 `src/` 下的 TypeScript 源码,直接打断点调试。修改 `src/` 后,`dev:umd` 会自动重建,刷新页面即可验证。
369
-
370
- 构建产物:
371
-
372
- | 文件 | 格式 | 用途 |
373
- |------|------|------|
374
- | `dist/index.es.js` | ESM | `import { GeneratorSDK } from '@atomm-developer/generator-sdk'` |
375
- | `dist/index.umd.js` | UMD | `<script src="...">` → `window.GeneratorSDK` |
376
- | `dist/index.d.ts` | TypeScript 类型声明 | IDE 自动补全 |
377
-
378
- ## 后端接口对照
379
-
380
- SDK 直接复用现有后端接口,仅积分扣除需新增。
381
-
382
- | SDK 方法 | HTTP | 路径 | 状态 |
383
- |----------|------|------|------|
384
- | `cloud.save`(新建) | POST | `/ai/v5/artimind/generator` | 已有 |
385
- | `cloud.save`(更新) | PUT | `/ai/v5/artimind/generator` | 已有 |
386
- | `cloud.restore` | GET | `/ai/v5/artimind/generator/:id` | 已有 |
387
- | `cloud.delete` | DELETE | `/ai/v5/artimind/generator/:id` | 已有 |
388
- | `history.getList` | POST | `/ai/v5/artimind/generator/type` | 已有 |
389
- | `credits.getBalance` | GET | `/ai/v1/credit/getBalance` | 已有 |
390
- | `credits.consume` | POST | `/sdk/v1/credits/consume` | **待新增** |
391
- | `billing.getUsage` | GET | `/ai/v5/artimind/free_trial/count` | 已有 |
392
- | `billing.consume` | POST | `/ai/v5/artimind/free_trial` | 已有 |
393
-
394
- 数据隔离通过 `category: appKey` 字段实现。
395
-
396
- ## Vue 3 使用注意
397
-
398
- 使用 `shallowRef` + `markRaw` 避免 Vue 深度代理 SDK 内部对象:
399
-
400
- ```js
401
- import { shallowRef, markRaw } from 'vue'
402
-
403
- const sdk = shallowRef(null)
404
- sdk.value = markRaw(GeneratorSDK.init({ appKey: 'app_xxx' }))
405
- ```
406
-
407
- ## SDK 发布到 npm
408
-
409
- > 私有 npm 仓库:`http://repository.makeblock.com/repository/npm-hosted/`(已在 `publishConfig` 中配置,无需额外指定)
410
-
411
- ### 首次登录
412
-
413
- ```bash
414
- npm login --registry=http://repository.makeblock.com/repository/npm-hosted/
415
- ```
416
-
417
- ### 发布步骤
418
-
419
- ```bash
420
- # 1. 更新版本号(patch / minor / major 按需选择)
421
- npm version patch # 1.0.0 → 1.0.1
422
- npm version minor # 1.0.0 → 1.1.0
423
- npm version major # 1.0.0 → 2.0.0
424
-
425
- # 2. 构建产物
426
- npm run build
427
-
428
- # 3. 发布到私有 npm
429
- npm publish
430
- ```
431
-
432
- ### 验证发布
433
-
434
- ```bash
435
- npm view @atomm-developer/generator-sdk --registry=http://repository.makeblock.com/repository/npm-hosted/
436
- ```
437
-
438
- ## 发布流程
439
-
440
- 1. 本地开发完成后构建产物
441
- 2. 将项目(含 `index.html` 入口)打包为 ZIP 上传到开发者控制台
442
- 3. 平台安全扫描 + 人工审核
443
- 4. 审核通过后自动部署到 `https://www.atomm.com/generator/{app_key}/`
444
-
445
- ## Vibe Coding 快速接入
446
-
447
- 复制以下提示词给 AI 编程工具即可生成完整接入代码:
83
+ ## Documentation
448
84
 
449
- > 帮我创建一个 HTML 应用,引入 Atomm Generator SDK(`<script src="https://static-res.atomm.com/scripts/js/generator-sdk/index.umd.js">`)。用 `GeneratorSDK.init({ appKey: 'my_key', env: 'test' })` 初始化。实现:登录(`sdk.auth.login()`)、云保存(`sdk.cloud.save({ snapshot, cover: canvas })`)、历史记录(`sdk.history.getList()`)、带计费下载(先 `sdk.export.register({ getExportCanvas: () => canvas })`,再 `GeneratorSDK.withBilling(sdk.billing, () => sdk.export.download())`)。用 `sdk.billing.getUsage()` 显示免费次数和积分,`sdk.billing.onChange()` 实时更新。
85
+ For detailed API references and integration guides, please visit our [Documentation Portal](https://github.com/atomm-inc/generator-sdk/tree/main/docs).
450
86
 
451
87
  ## License
452
88
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atomm-developer/generator-sdk",
3
- "version": "1.0.3",
3
+ "version": "1.0.4",
4
4
  "description": "Atomm Generator 开放平台 SDK,为第三方生成器开发者提供登录、云保存、历史记录、积分等平台能力",
5
5
  "keywords": [
6
6
  "atomm",