@canva/cli 0.0.1-beta.9 → 1.0.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.
Files changed (149) hide show
  1. package/README.md +131 -31
  2. package/cli.js +841 -437
  3. package/lib/cjs/index.cjs +11 -0
  4. package/lib/esm/index.mjs +11 -0
  5. package/package.json +19 -4
  6. package/templates/base/backend/routers/auth.ts +4 -4
  7. package/templates/base/backend/routers/oauth.ts +3 -3
  8. package/templates/base/eslint.config.mjs +2 -25
  9. package/templates/base/package.json +26 -23
  10. package/templates/base/scripts/ssl/ssl.ts +1 -1
  11. package/templates/base/scripts/start/app_runner.ts +42 -5
  12. package/templates/base/scripts/start/context.ts +12 -6
  13. package/templates/base/scripts/start/start.ts +12 -1
  14. package/templates/base/scripts/start/tests/start.tests.ts +61 -0
  15. package/templates/base/utils/backend/base_backend/create.ts +3 -3
  16. package/templates/base/utils/backend/bearer_middleware/bearer_middleware.ts +2 -2
  17. package/templates/base/utils/backend/jwt_middleware/jwt_middleware.ts +4 -4
  18. package/templates/base/utils/backend/jwt_middleware/tests/jwt_middleware.tests.ts +1 -1
  19. package/templates/base/utils/use_add_element.ts +1 -1
  20. package/templates/base/utils/use_feature_support.ts +1 -1
  21. package/templates/{gen_ai/webpack.config.cjs → base/webpack.config.ts} +50 -68
  22. package/templates/common/.env.template +3 -3
  23. package/templates/common/README.md +16 -17
  24. package/templates/common/jest.config.mjs +1 -1
  25. package/templates/common/jest.setup.ts +1 -0
  26. package/templates/common/utils/backend/base_backend/create.ts +3 -3
  27. package/templates/common/utils/backend/jwt_middleware/jwt_middleware.ts +4 -4
  28. package/templates/common/utils/backend/jwt_middleware/tests/jwt_middleware.tests.ts +1 -1
  29. package/templates/common/utils/tests/table_wrapper.tests.ts +1 -1
  30. package/templates/common/utils/use_add_element.ts +1 -1
  31. package/templates/common/utils/use_feature_support.ts +1 -1
  32. package/templates/dam/backend/routers/dam.ts +24 -20
  33. package/templates/dam/backend/server.ts +1 -1
  34. package/templates/dam/canva-app.json +16 -0
  35. package/templates/dam/eslint.config.mjs +2 -28
  36. package/templates/dam/package.json +38 -41
  37. package/templates/dam/scripts/ssl/ssl.ts +1 -1
  38. package/templates/dam/scripts/start/app_runner.ts +42 -5
  39. package/templates/dam/scripts/start/context.ts +12 -6
  40. package/templates/dam/scripts/start/start.ts +12 -1
  41. package/templates/dam/scripts/start/tests/start.tests.ts +61 -0
  42. package/templates/dam/src/app.tsx +24 -3
  43. package/templates/dam/src/config.ts +212 -87
  44. package/templates/dam/src/index.tsx +1 -1
  45. package/templates/dam/utils/backend/base_backend/create.ts +3 -3
  46. package/templates/dam/utils/backend/jwt_middleware/jwt_middleware.ts +4 -4
  47. package/templates/dam/utils/backend/jwt_middleware/tests/jwt_middleware.tests.ts +1 -1
  48. package/templates/{base/webpack.config.cjs → dam/webpack.config.ts} +50 -68
  49. package/templates/data_connector/README.md +84 -0
  50. package/templates/data_connector/canva-app.json +21 -0
  51. package/templates/data_connector/declarations/declarations.d.ts +29 -0
  52. package/templates/data_connector/eslint.config.mjs +14 -0
  53. package/templates/data_connector/package.json +91 -0
  54. package/templates/data_connector/scripts/ssl/ssl.ts +131 -0
  55. package/templates/data_connector/scripts/start/app_runner.ts +201 -0
  56. package/templates/data_connector/scripts/start/context.ts +171 -0
  57. package/templates/data_connector/scripts/start/start.ts +46 -0
  58. package/templates/data_connector/scripts/start/tests/start.tests.ts +61 -0
  59. package/templates/data_connector/src/api/connect_client.ts +6 -0
  60. package/templates/data_connector/src/api/data_source.ts +96 -0
  61. package/templates/data_connector/src/api/data_sources/designs.tsx +296 -0
  62. package/templates/data_connector/src/api/data_sources/index.ts +4 -0
  63. package/templates/data_connector/src/api/data_sources/templates.tsx +329 -0
  64. package/templates/data_connector/src/api/fetch_data_table.ts +55 -0
  65. package/templates/data_connector/src/api/index.ts +4 -0
  66. package/templates/data_connector/src/api/oauth.ts +8 -0
  67. package/templates/data_connector/src/api/tests/data_source.test.tsx +99 -0
  68. package/templates/data_connector/src/app.tsx +20 -0
  69. package/templates/data_connector/src/components/app_error.tsx +15 -0
  70. package/templates/data_connector/src/components/footer.tsx +26 -0
  71. package/templates/data_connector/src/components/header.tsx +40 -0
  72. package/templates/data_connector/src/components/index.ts +3 -0
  73. package/templates/data_connector/src/components/inputs/messages.tsx +99 -0
  74. package/templates/data_connector/src/components/inputs/search_filter.tsx +108 -0
  75. package/templates/data_connector/src/components/inputs/select_field.tsx +26 -0
  76. package/templates/data_connector/src/context/app_context.tsx +124 -0
  77. package/templates/data_connector/src/context/index.ts +2 -0
  78. package/templates/data_connector/src/context/use_app_context.ts +17 -0
  79. package/templates/data_connector/src/entrypoint.tsx +70 -0
  80. package/templates/data_connector/src/home.tsx +21 -0
  81. package/templates/data_connector/src/index.tsx +68 -0
  82. package/templates/data_connector/src/pages/data_source_config.tsx +9 -0
  83. package/templates/data_connector/src/pages/error.tsx +37 -0
  84. package/templates/data_connector/src/pages/index.ts +4 -0
  85. package/templates/data_connector/src/pages/login.tsx +145 -0
  86. package/templates/data_connector/src/pages/select_source.tsx +24 -0
  87. package/templates/data_connector/src/routes/index.ts +2 -0
  88. package/templates/data_connector/src/routes/protected_route.tsx +25 -0
  89. package/templates/data_connector/src/routes/routes.tsx +46 -0
  90. package/templates/data_connector/src/utils/data_params.ts +17 -0
  91. package/templates/data_connector/src/utils/data_table.ts +115 -0
  92. package/templates/data_connector/src/utils/fetch_result.ts +36 -0
  93. package/templates/data_connector/src/utils/index.ts +2 -0
  94. package/templates/data_connector/src/utils/tests/data_table.test.ts +133 -0
  95. package/templates/data_connector/styles/components.css +38 -0
  96. package/templates/data_connector/tsconfig.json +54 -0
  97. package/templates/{dam/webpack.config.cjs → data_connector/webpack.config.ts} +50 -68
  98. package/templates/gen_ai/backend/routers/image.ts +8 -8
  99. package/templates/gen_ai/backend/server.ts +1 -1
  100. package/templates/gen_ai/canva-app.json +20 -0
  101. package/templates/gen_ai/eslint.config.mjs +2 -25
  102. package/templates/gen_ai/package.json +42 -43
  103. package/templates/gen_ai/scripts/ssl/ssl.ts +1 -1
  104. package/templates/gen_ai/scripts/start/app_runner.ts +42 -5
  105. package/templates/gen_ai/scripts/start/context.ts +12 -6
  106. package/templates/gen_ai/scripts/start/start.ts +12 -1
  107. package/templates/gen_ai/scripts/start/tests/start.tests.ts +61 -0
  108. package/templates/gen_ai/src/app.tsx +3 -3
  109. package/templates/gen_ai/src/components/footer.tsx +4 -4
  110. package/templates/gen_ai/src/components/image_grid.tsx +1 -1
  111. package/templates/gen_ai/src/components/loading_results.tsx +8 -8
  112. package/templates/gen_ai/src/components/prompt_input.tsx +3 -3
  113. package/templates/gen_ai/src/components/remaining_credits.tsx +1 -1
  114. package/templates/gen_ai/src/components/report_box.tsx +1 -1
  115. package/templates/gen_ai/src/components/tests/remaining_credit.tests.tsx +2 -2
  116. package/templates/gen_ai/src/home.tsx +2 -2
  117. package/templates/gen_ai/src/pages/error.tsx +2 -2
  118. package/templates/gen_ai/src/pages/results.tsx +1 -1
  119. package/templates/gen_ai/utils/backend/base_backend/create.ts +3 -3
  120. package/templates/gen_ai/utils/backend/bearer_middleware/bearer_middleware.ts +2 -2
  121. package/templates/{hello_world/webpack.config.cjs → gen_ai/webpack.config.ts} +50 -68
  122. package/templates/hello_world/canva-app.json +16 -0
  123. package/templates/hello_world/eslint.config.mjs +2 -25
  124. package/templates/hello_world/package.json +35 -38
  125. package/templates/hello_world/scripts/copy_env.ts +10 -0
  126. package/templates/hello_world/scripts/ssl/ssl.ts +1 -1
  127. package/templates/hello_world/scripts/start/app_runner.ts +42 -5
  128. package/templates/hello_world/scripts/start/context.ts +12 -6
  129. package/templates/hello_world/scripts/start/start.ts +12 -1
  130. package/templates/hello_world/scripts/start/tests/start.tests.ts +61 -0
  131. package/templates/hello_world/src/app.tsx +1 -1
  132. package/templates/hello_world/src/index.tsx +1 -1
  133. package/templates/hello_world/src/tests/__snapshots__/app.tests.tsx.snap +5 -5
  134. package/templates/hello_world/src/tests/app.tests.tsx +3 -3
  135. package/templates/hello_world/utils/use_add_element.ts +1 -1
  136. package/templates/hello_world/utils/use_feature_support.ts +1 -1
  137. package/templates/hello_world/webpack.config.ts +254 -0
  138. package/templates/optional/.cursor/mcp.json +8 -0
  139. package/templates/optional/.vscode/mcp.json +9 -0
  140. package/templates/optional/AGENTS.md +76 -0
  141. package/templates/optional/CLAUDE.md +76 -0
  142. package/templates/common/conf/eslint-general.mjs +0 -303
  143. package/templates/common/conf/eslint-i18n.mjs +0 -41
  144. package/templates/common/conf/eslint-local-i18n-rules/index.mjs +0 -181
  145. /package/templates/base/scripts/{copy-env.ts → copy_env.ts} +0 -0
  146. /package/templates/dam/scripts/{copy-env.ts → copy_env.ts} +0 -0
  147. /package/templates/{gen_ai/scripts/copy-env.ts → data_connector/scripts/copy_env.ts} +0 -0
  148. /package/templates/{hello_world/scripts/copy-env.ts → gen_ai/scripts/copy_env.ts} +0 -0
  149. /package/templates/{common → optional}/.vscode/extensions.json +0 -0
package/README.md CHANGED
@@ -13,7 +13,7 @@ CLI for creating and managing Canva Apps.
13
13
  - [Step 1: Install and log in](#step-1-install-and-log-in)
14
14
  - [Step 2: Create your app](#step-2-create-your-app)
15
15
  - [Step 3: Preview your app](#step-3-preview-your-app)
16
- - [Log out, auth token storage, and removal](#token-storage-and-removal)
16
+ - [Log out, auth token storage, and removal](#log-out-auth-token-storage-and-removal)
17
17
  - [CLI reference](#cli-reference)
18
18
  - [Flags](#flags)
19
19
  - [Commands](#commands)
@@ -106,8 +106,18 @@ To preview your app:
106
106
  npm start
107
107
  ```
108
108
 
109
- 3. In the Developer Portal, click **Preview** to open the Canva Editor preview.
110
- 4. If this the first time previewing your app, click **Open** to preview your new app.
109
+ 3. The preview URL will be generated and opened automatically in your browser.
110
+ 4. If this is the first time previewing your app, click **Open** to preview your new app.
111
+
112
+ ### Step 4: Run a health check on your app
113
+
114
+ After creating your app, you can diagnose potential issues using:
115
+
116
+ ```shell
117
+ canva apps doctor
118
+ ```
119
+
120
+ This checks for missing dependencies, outdated packages, and other issues.
111
121
 
112
122
  ## Log out, auth token storage, and removal
113
123
 
@@ -121,7 +131,7 @@ The auth token is located in your home directory under the `.canva-cli` folder.
121
131
 
122
132
  ### Removing the Token
123
133
 
124
- To delete the token, there are two options. However only the `canva logout` command revokes and deletes the token. If there's a copy of the token, it's possible to reconnect the Canva CLI to your account's apps using the token.
134
+ To delete the token, there are two options. However, only the `canva logout` command revokes and deletes the token. If there's a copy of the token, it's possible to reconnect the Canva CLI to your account's apps using the token.
125
135
 
126
136
  #### Log out
127
137
 
@@ -134,7 +144,6 @@ To delete the token, there are two options. However only the `canva logout` comm
134
144
  #### Delete the file manually
135
145
 
136
146
  1. Locate the `credentials` file, which is stored in the following locations:
137
-
138
147
  - **macOS and Linux**: The token is stored in `~/.canva-cli/credentials`.
139
148
  - **Windows**: The token is stored in `%USERPROFILE%\.canva-cli\credentials`.
140
149
 
@@ -177,6 +186,14 @@ canva tip
177
186
  - **Aliases**:
178
187
  - `tips`: Also prints a random development tip.
179
188
 
189
+ #### bug
190
+
191
+ Raise an issue with the Canva CLI on GitHub.
192
+
193
+ ```shell
194
+ canva bug
195
+ ```
196
+
180
197
  #### login
181
198
 
182
199
  Log in to the Canva CLI.
@@ -185,6 +202,9 @@ Log in to the Canva CLI.
185
202
  canva login
186
203
  ```
187
204
 
205
+ - **Flags**:
206
+ - `--china`, `--cn`: Login to canva.cn, this will use canva.cn for all subsequent commands until you log out.
207
+
188
208
  #### logout
189
209
 
190
210
  Log out of the Canva CLI, and delete the saved auth token:
@@ -193,6 +213,10 @@ Log out of the Canva CLI, and delete the saved auth token:
193
213
  canva logout
194
214
  ```
195
215
 
216
+ #### mcp
217
+
218
+ Start the canva [MCP](https://modelcontextprotocol.io) server. This is usually called by your MCP client, such as Claude Desktop, Cursor, or other compatible tools. For more information on how to configure your MCP client to use the Canva MCP server, please see [MCP Server](https://www.canva.dev/docs/apps/mcp-server) in the developer documentation.
219
+
196
220
  #### apps
197
221
 
198
222
  Manage your Canva apps.
@@ -201,46 +225,122 @@ Manage your Canva apps.
201
225
  canva apps
202
226
  ```
203
227
 
204
- #### apps sub-commands
228
+ ##### create
229
+
230
+ Create a new Canva app.
231
+
232
+ ```shell
233
+ canva apps create "My New App" --template="hello_world" --distribution="public" --git --installDependencies
234
+ ```
235
+
236
+ - **Arguments**:
237
+ - `--name`: Sets the app's name. Provide the name you want for the app.
238
+ - **Flags**:
239
+ - `--template`: Specifies the starting template for the app.
240
+
241
+ Available templates:
242
+ - `"hello_world"`: Basic starting point.
243
+ - `"dam"`: Digital asset management integration.
244
+ - `"gen_ai"`: Generative AI app creation.
245
+
246
+ - `--distribution`: Sets the app's distribution type.
247
+
248
+ Available types:
249
+ - `"public"`: Available to all Canva users, subject to Canva review.
250
+ - `"private"`: Only available to your team, and requires team admin approval.
251
+
252
+ **Note**: You can't change the distribution setting after creating a new app with the `canva apps create` command.
253
+
254
+ - `--git`: Initializes a Git repository in the project directory.
255
+
256
+ - `--installDependencies`: Automatically installs necessary npm dependencies during the app creation process.
257
+
258
+ - `--optionalConfig`: Optional configuration files to be created in the project directory.
259
+
260
+ Available options:
261
+ - `"vscode"`: Adds a `.vscode` folder to the project directory.
262
+ - `"cursor"`: Adds a `.cursor` folder to the project directory.
263
+ - `"agents.md"`: Adds a `AGENTS.md` file to the project directory.
264
+ - `"claude"`: Adds a `CLAUDE.md` file to the project directory.
265
+
266
+ - `--offline`: Scaffold the app locally without also creating an app in the Developer Portal.
267
+ - `--yes`: Answer yes, or use the default, for all questions during app creation.
268
+
269
+ ##### list
270
+
271
+ List all Canva apps.
272
+
273
+ ```shell
274
+ canva apps list
275
+ ```
276
+
277
+ - **Flags**:
278
+ - `--appId`: Specifies an App ID to select.
279
+ - `--all`, `-a`: Lists all apps at once without pagination.
280
+ - `--print`, `-p`: Prints the list of apps to the console without interactivity.
205
281
 
206
- - `create "app-name"`: Create a new Canva app.
282
+ ##### preview
207
283
 
208
- ```shell
209
- canva apps create "My New App" --template="hello_world" --distribution="public" --git --installDependencies
210
- ```
284
+ Preview your app.
211
285
 
212
- - **Arguments**:
213
- - `--name`: Sets the app's name. Provide the name you want for the app.
214
- - **Flags**:
286
+ ```shell
287
+ canva apps preview
288
+ ```
215
289
 
216
- - `--template`: Specifies the starting template for the app.
290
+ ##### doctor
217
291
 
218
- Available templates:
292
+ Run diagnostics on your Canva App to identify and fix issues.
219
293
 
220
- - `"hello_world"`: Basic starting point.
221
- - `"dam"`: Digital asset management integration.
222
- - `"gen_ai"`: Generative AI app creation.
294
+ ```shell
295
+ canva apps doctor
296
+ ```
223
297
 
224
- - `--distribution`: Sets the app's distribution type.
298
+ - **Flags**:
299
+ - `--ci`: Run in CI mode (overrides all other flags: enables `--report`, `--silenceUpdates`, disables `--fix`, `--verbose`, skips environment checks).
300
+ - `--fix`: Automatically apply fixes for issues where possible.
301
+ - `--report`: Output check results without prompting for fixes.
302
+ - `--verbose`: Show detailed diagnostic output optimized for AI agent assistance.
303
+ - `--check`: Specify a specific check to run.
225
304
 
226
- Available types:
305
+ ##### config
227
306
 
228
- - `"public"`: Available to all Canva users, subject to Canva review.
229
- - `"private"`: Only available to your team, and requires team admin approval.
307
+ Manage your [App Configuration](https://www.canva.dev/docs/apps/app-configuration/).
230
308
 
231
- **Note**: You can't change the distribution setting after creating a new app with the `canva apps create` command.
309
+ ```shell
310
+ canva apps config
311
+ ```
312
+
313
+ ###### pull
232
314
 
233
- - `--git`: Initializes a Git repository in the project directory.
315
+ Fetch the [canva-app.json](https://www.canva.dev/docs/apps/app-configuration/canva-app-json/) config from the Developer Portal.
234
316
 
235
- - `--installDependencies`: Automatically installs necessary npm dependencies during the app creation process.
317
+ ```shell
318
+ canva apps config pull
319
+ ```
236
320
 
237
- - `--offline`: Scaffold the app locally without also creating an app in the Developer Portal.
321
+ - **Flags**:
322
+ - `--force`: Automatically pull config regardless of conflicts.
323
+ - `--strategy`: Choose the resolution option for config conflicts - local, remote or manual
238
324
 
239
- - `list`: List all Canva apps.
325
+ ###### push
240
326
 
241
- ```shell
242
- canva apps list
243
- ```
327
+ Submit the local [canva-app.json](https://www.canva.dev/docs/apps/app-configuration/canva-app-json/) to the Developer Portal.
328
+
329
+ ```shell
330
+ canva apps config push
331
+ ```
332
+
333
+ - **Flags**:
334
+ - `--force`: Automatically push config regardless of conflicts.
335
+ - `--strategy`: Choose the resolution option for config conflicts - local, remote or manual
336
+
337
+ ###### status
338
+
339
+ Report on the status and validity of the [canva-app.json](https://www.canva.dev/docs/apps/app-configuration/canva-app-json/) config.
340
+
341
+ ```shell
342
+ canva apps config status
343
+ ```
244
344
 
245
345
  #### logout
246
346
 
@@ -269,7 +369,7 @@ npm update -g @canva/cli@latest
269
369
 
270
370
  ## Contributions
271
371
 
272
- Currently the Canva CLI doesn't accept third-party contributions. Please submit any feature requests through the [Canva Developers Community](https://community.canva.dev/).
372
+ Currently the Canva CLI doesn't accept third-party contributions. Please submit any feature requests through the [Canva Developers Community](https://community.canva.dev/) or raise an issue on [Github](https://github.com/canva-sdks/canva-cli/issues/new).
273
373
 
274
374
  ## License
275
375