@canva/intents 2.6.0 → 2.6.1-beta.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 (36) hide show
  1. package/CHANGELOG.md +32 -36
  2. package/asset/beta.d.ts +190 -0
  3. package/asset/index.d.ts +1 -1
  4. package/beta.d.ts +3499 -0
  5. package/content/beta.d.ts +2077 -0
  6. package/content/index.d.ts +1 -1801
  7. package/data/beta.d.ts +1229 -0
  8. package/data/index.d.ts +1 -1229
  9. package/design/beta.d.ts +41 -0
  10. package/design/index.d.ts +1 -41
  11. package/index.d.ts +1 -3204
  12. package/lib/cjs/sdk/intents/asset/beta.js +13 -0
  13. package/lib/cjs/sdk/intents/asset/index.js +15 -1
  14. package/lib/cjs/sdk/intents/beta.js +20 -0
  15. package/lib/cjs/sdk/intents/content/beta.js +20 -0
  16. package/lib/cjs/sdk/intents/data/beta.js +20 -0
  17. package/lib/cjs/sdk/intents/design/beta.js +20 -0
  18. package/lib/cjs/sdk/intents/fake/{create.js → create_beta.js} +9 -6
  19. package/lib/cjs/sdk/intents/index.js +2 -4
  20. package/lib/cjs/sdk/intents/test/beta.js +19 -0
  21. package/lib/cjs/sdk/intents/test/index.js +13 -14
  22. package/lib/cjs/sdk/intents/version.js +1 -1
  23. package/lib/esm/sdk/intents/asset/beta.js +3 -0
  24. package/lib/esm/sdk/intents/asset/index.js +1 -1
  25. package/lib/esm/sdk/intents/beta.js +3 -0
  26. package/lib/esm/sdk/intents/content/beta.js +3 -0
  27. package/lib/esm/sdk/intents/data/beta.js +3 -0
  28. package/lib/esm/sdk/intents/design/beta.js +3 -0
  29. package/lib/esm/sdk/intents/fake/{create.js → create_beta.js} +7 -4
  30. package/lib/esm/sdk/intents/index.js +1 -3
  31. package/lib/esm/sdk/intents/test/beta.js +9 -0
  32. package/lib/esm/sdk/intents/test/index.js +1 -9
  33. package/lib/esm/sdk/intents/version.js +1 -1
  34. package/package.json +23 -23
  35. package/test/beta.d.ts +11 -0
  36. package/test/index.d.ts +1 -11
@@ -0,0 +1,2077 @@
1
+ /**
2
+ * @beta
3
+ * Cancelled response where the generation was not completed.
4
+ * We use only 'cancelled' since we don't expect app developers to handle any statuses further (e.g. blocked, failed).
5
+ * These will be handled on Canva's AI generation surface.
6
+ */
7
+ export declare type AiContentCancelledResponse = {
8
+ status: 'cancelled';
9
+ };
10
+
11
+ /**
12
+ * @beta
13
+ * Completed response for AI content generation.
14
+ * The value is the AI content generated for the app.
15
+ */
16
+ export declare type AiContentCompletedResponse = {
17
+ status: 'completed';
18
+ value: string;
19
+ };
20
+
21
+ /**
22
+ * @beta
23
+ * All possible AI content request types.
24
+ */
25
+ export declare type AiContentRequest = SocialCaptionRequest;
26
+
27
+ /**
28
+ * @beta
29
+ * All possible AI content response types.
30
+ */
31
+ export declare type AiContentResponse = AiContentCompletedResponse | AiContentCancelledResponse;
32
+
33
+ /**
34
+ * @beta
35
+ * All possible statuses for an AI content response.
36
+ *
37
+ */
38
+ export declare type AiContentResponseStatus = 'completed' | 'cancelled';
39
+
40
+ /**
41
+ * @beta
42
+ * Possible content type for AI content generation.
43
+ * Future types will be added here, e.g. 'hashtags'.
44
+ */
45
+ export declare type AiContentType = 'social_caption';
46
+
47
+ /**
48
+ * @public
49
+ * {@link PublishContentError} indicating a custom error occurred in your app's implementation.
50
+ *
51
+ * Return this for application-specific errors such as:
52
+ *
53
+ * - Validation failures
54
+ * - Authentication errors
55
+ * - Rate limiting
56
+ * - Platform-specific restrictions
57
+ *
58
+ * @example Returning custom error with message
59
+ * ```ts
60
+ * if (userQuotaExceeded) {
61
+ * return {
62
+ * status: 'app_error',
63
+ * message: 'You have reached your monthly publish limit. Please upgrade your plan.'
64
+ * };
65
+ * }
66
+ * ```
67
+ */
68
+ export declare type AppError = {
69
+ status: 'app_error';
70
+ /**
71
+ * (required) The raw error message, for logging purposes. It will not display in the UI.
72
+ * To display custom error messages in the UI use `localizedMessageId`.
73
+ *
74
+ * This should typically be the javascript error.message or a REST JSON error message
75
+ * body passed without modification.
76
+ *
77
+ * WARNING: Do not include personally identifiable information (PII) in this
78
+ * message, such as names, emails, usernames, etc.
79
+ */
80
+ message: string;
81
+ /**
82
+ * (optional) Message ID of the translated error message that will be
83
+ * displayed to the user. The message ID should be present and uploaded in
84
+ * your translation file. If omitted, Canva will display a generic error
85
+ * message.
86
+ */
87
+ localizedMessageId?: string;
88
+ /** HTTP status code, if applicable */
89
+ httpCode?: number;
90
+ /**
91
+ * Used only by app developer. Canva does not use this value. Use this to pass
92
+ * additional information like JSON to your settings frame.
93
+ */
94
+ appDefinedPayload?: string;
95
+ /**
96
+ * (optional) Source of the error if it relates to a component on the Canva
97
+ * UI. When present, the error may render near a relevant Canva component.
98
+ * When omitted, the cause is considered unspecified or "generic".
99
+ */
100
+ errorCause?: ErrorCause;
101
+ };
102
+
103
+ /**
104
+ * @beta
105
+ * Content summary for file-destination apps (e.g. Google Drive, Dropbox).
106
+ */
107
+ export declare type AssetContentSummary = BaseContentSummary & {
108
+ type: 'asset';
109
+ /** Asset title or filename. */
110
+ title: string;
111
+ /** Folder path (e.g. "/My Projects/Designs"). */
112
+ path?: string;
113
+ };
114
+
115
+ /**
116
+ * @beta
117
+ * Base interface for AI content requests.
118
+ */
119
+ declare type BaseAiContentRequest = {
120
+ /**
121
+ * The type of AI content generation which determines
122
+ * the kind of content the AI will generate.
123
+ */
124
+ type: AiContentType;
125
+ /**
126
+ * If a current value exists in the field, the AI content generation
127
+ * will be an edit-first experience.
128
+ * i.e. When the user has already entered a value in the field, the AI will
129
+ * generate a new value using the existing value as a starting point.
130
+ */
131
+ currentValue?: string;
132
+ /**
133
+ * The label chosen by the app developer for the field.
134
+ * It will be used in the UI to customize the copy.
135
+ * Required since it is essential context for the AI to generate the content.
136
+ */
137
+ fieldLabel: string;
138
+ };
139
+
140
+ /**
141
+ * @beta
142
+ * Base fields shared by all content summary variants.
143
+ */
144
+ declare type BaseContentSummary = {
145
+ /**
146
+ * The account, page, or list this post was published to.
147
+ *
148
+ * For example, a Facebook Page, a mailing list, or a personal profile.
149
+ * Use the connected account's display name and icon when there is no distinct destination.
150
+ */
151
+ destination: Destination;
152
+ };
153
+
154
+ /**
155
+ * @public
156
+ * Base file requirement interface.
157
+ */
158
+ declare interface BaseFileRequirement {
159
+ /**
160
+ * File format for this requirement.
161
+ */
162
+ format: PublishFileFormat;
163
+
164
+ }
165
+
166
+ /**
167
+ * @public
168
+ * Base interface for exported files.
169
+ */
170
+ export declare interface BaseOutputFile {
171
+ /**
172
+ * File format.
173
+ */
174
+ format: PublishFileFormat;
175
+ /**
176
+ * URL to download the exported file.
177
+ *
178
+ * Your app should download from this URL and upload to your platform.
179
+ */
180
+ url: string;
181
+ /**
182
+ * Metadata about the source content used to create this exported file.
183
+ */
184
+ contentMetadata: ContentMetadata;
185
+ }
186
+
187
+ /**
188
+ * @public
189
+ * Base interface for all preview types.
190
+ *
191
+ * Contains common properties shared by all preview types.
192
+ */
193
+ export declare interface BasePreview {
194
+ /**
195
+ * Unique identifier for this preview.
196
+ *
197
+ * Use this ID with `requestPreviewUpgrade` to upgrade thumbnails to full previews.
198
+ */
199
+ id: string;
200
+ /**
201
+ * Type of media in this preview.
202
+ */
203
+ kind: PreviewKind;
204
+ /**
205
+ * Current state of the preview.
206
+ */
207
+ status: PreviewStatus;
208
+ }
209
+
210
+ /**
211
+ * @public
212
+ * Base metadata available for a selected media item in a media slot.
213
+ *
214
+ * Canva populates this when returning {@link OutputType} in Settings UI contexts.
215
+ * Apps should not set this value.
216
+ */
217
+ export declare interface BaseSelection {
218
+ /**
219
+ * Metadata about the source content represented by this selection.
220
+ */
221
+ selectionMetadata?: readonly SelectionMetadata[];
222
+ }
223
+
224
+ /**
225
+ * @public
226
+ * Metadata about the source content used to create an exported file.
227
+ */
228
+ export declare type ContentMetadata = DesignContentMetadata;
229
+
230
+ /**
231
+ * @beta
232
+ * Describes what kind of content an output type produces. Canva uses this to tailor and improve
233
+ * the publish experience.
234
+ */
235
+ export declare type ContentNoun = 'email' | 'post' | 'schedule' | 'asset' | 'draft' | 'publication' | 'content' | 'content_export';
236
+
237
+ /**
238
+ * @public
239
+ * Main interface for implementing the ContentPublisher intent.
240
+ *
241
+ * Implementing the ContentPublisher intent enables apps to publish contents to external platforms.
242
+ * This allows users to configure publish settings, preview their designs, and share with others.
243
+ *
244
+ * The publishing flow follows this process:
245
+ *
246
+ * 1. User initiates publish action
247
+ * 2. Your app provides publish configuration via `getPublishConfiguration`
248
+ * 3. User selects an output type
249
+ * 4. Your app renders settings UI via `renderSettingsUi`
250
+ * 5. Your app renders preview UI via `renderPreviewUi`
251
+ * 6. User reviews settings and preview
252
+ * 7. Your app publishes the content via `publishContent`
253
+ */
254
+ export declare type ContentPublisherIntent = {
255
+ /**
256
+ * Provides the configuration for the publishing platform.
257
+ *
258
+ * This action is called when the user initiates the publish flow and needs to
259
+ * select an output type for the target platform.
260
+ *
261
+ * Use this to define different publishing configurations for your platform,
262
+ * such as social media posts, videos, or other output types.
263
+ *
264
+ * @returns A promise resolving to the publish configuration or an error
265
+ *
266
+ * @example Defining publish configuration for a social media platform
267
+ * ```ts
268
+ * import type { GetPublishConfigurationResponse } from '@canva/intents/content';
269
+ *
270
+ * async function getPublishConfiguration(): Promise<GetPublishConfigurationResponse> {
271
+ * return {
272
+ * status: 'completed',
273
+ * outputTypes: [
274
+ * {
275
+ * id: 'instagram_post',
276
+ * displayName: 'Instagram Post',
277
+ * mediaSlots: [
278
+ * {
279
+ * id: 'main_image',
280
+ * displayName: 'Post Image',
281
+ * fileCount: { min: 1, max: 10 },
282
+ * accepts: {
283
+ * image: { format: 'jpg', aspectRatio: { min: 0.8, max: 1.91 } }
284
+ * }
285
+ * }
286
+ * ]
287
+ * }
288
+ * ]
289
+ * };
290
+ * }
291
+ * ```
292
+ */
293
+ getPublishConfiguration: () => Promise<GetPublishConfigurationResponse>;
294
+
295
+ /**
296
+ * Renders a user interface for configuring publish settings.
297
+ *
298
+ * This action is called after the user selects an output type. Your UI should
299
+ * allow users to configure platform-specific settings such as captions, tags,
300
+ * privacy settings, or publishing destinations.
301
+ *
302
+ * Use the `updatePublishSettings` callback to save user settings and validate them.
303
+ * Settings are stored in the `publishRef` string (maximum 32KB).
304
+ *
305
+ * @param request - Configuration and callbacks for the publish settings UI.
306
+ *
307
+ * @example Rendering a settings UI with publish configuration
308
+ * ```ts
309
+ * import { createRoot } from 'react-dom/client';
310
+ * import type { RenderSettingsUiRequest } from '@canva/intents/content';
311
+ *
312
+ * function renderSettingsUi(request: RenderSettingsUiRequest): void {
313
+ * const SettingsUiApp = () => (
314
+ * <AppUiProvider>
315
+ * <SettingsUi request={request} />
316
+ * </AppUiProvider>
317
+ * );
318
+ *
319
+ * createRoot().render(<SettingsUiApp />)
320
+ * }
321
+ * ```
322
+ */
323
+ renderSettingsUi: (request: RenderSettingsUiRequest) => void;
324
+ /**
325
+ * Renders a user interface for previewing the content.
326
+ *
327
+ * This action is called after the settings UI is rendered. Your UI should display
328
+ * a preview of how the content will appear on the target platform.
329
+ *
330
+ * Previews update dynamically as users modify their content or settings. For videos,
331
+ * start with lightweight thumbnails and use `requestPreviewUpgrade` to load full
332
+ * video previews on demand to optimize performance.
333
+ *
334
+ * @param request - Configuration and callbacks for the preview UI.
335
+ *
336
+ * @example Rendering a preview UI with video optimization
337
+ * ```ts
338
+ * import { createRoot } from 'react-dom/client';
339
+ * import type { RenderPreviewUiRequest } from '@canva/intents/content';
340
+ *
341
+ * function renderPreviewUi(request: RenderPreviewUiRequest): void {
342
+ * const PreviewUiApp = () => (
343
+ * <AppUiProvider>
344
+ * <PreviewUi request={request} />
345
+ * </AppUiProvider>
346
+ * );
347
+ *
348
+ * createRoot().render(<PreviewUiApp />)
349
+ * }
350
+ * ```
351
+ */
352
+ renderPreviewUi: (request: RenderPreviewUiRequest) => void;
353
+ /**
354
+ * Publishes the content to the external platform.
355
+ *
356
+ * This action is called when the user confirms the publish action after reviewing
357
+ * settings and preview. Your implementation should send the exported files
358
+ * to your platform's API.
359
+ *
360
+ * The `outputMedia` contains production-ready files that match the requirements
361
+ * specified in your output types. The `publishRef` contains the user's settings
362
+ * from the settings UI.
363
+ *
364
+ * @param request - Parameters for the publish operation.
365
+ * @returns A promise resolving to either a successful result with the published content details or an error.
366
+ *
367
+ * @example Publishing content to an external platform
368
+ * ```ts
369
+ * import type { PublishContentRequest, PublishContentResponse } from '@canva/intents/content';
370
+ *
371
+ * async function publishContent(request: PublishContentRequest): Promise<PublishContentResponse> {
372
+ * const { publishRef, outputType, outputMedia } = request;
373
+ *
374
+ * try {
375
+ * // Parse settings from publishRef
376
+ * const settings = publishRef ? JSON.parse(publishRef) : {};
377
+ *
378
+ * // Upload files to your platform
379
+ * const uploadedFiles = await Promise.all(
380
+ * outputMedia.flatMap(media =>
381
+ * media.files.map(file => uploadFile(file.url))
382
+ * )
383
+ * );
384
+ *
385
+ * // Create post on your platform
386
+ * const result = await createPost({
387
+ * files: uploadedFiles,
388
+ * caption: settings.caption
389
+ * });
390
+ *
391
+ * return {
392
+ * status: 'completed',
393
+ * externalId: result.id,
394
+ * externalUrl: result.url
395
+ * };
396
+ * } catch (error) {
397
+ * return {
398
+ * status: 'remote_request_failed'
399
+ * };
400
+ * }
401
+ * }
402
+ * ```
403
+ */
404
+ publishContent: (request: PublishContentRequest) => Promise<PublishContentResponse>;
405
+
406
+ /**
407
+ * @beta
408
+ * Extracts a structured summary of the post's content for historical display.
409
+ *
410
+ * Called at `createPost` / `updatePost` time while the app is loaded. The returned
411
+ * snapshot is stored with the post and used to render historical post views in the
412
+ * content planner (calendar, list views, insights) without re-invoking the app.
413
+ *
414
+ * The snapshot is frozen at write time — it reflects what was published, not the
415
+ * app's current rendering logic. If the app's payload shape or output types change
416
+ * later, historical views remain accurate.
417
+ *
418
+ * @param request - The `publishRef` and `outputType` for the post being published.
419
+ * @returns A promise resolving to the `ContentSummary`, or an error.
420
+ */
421
+ getContentSummary?: (request: GetContentSummaryRequest) => Promise<GetContentSummaryResponse>;
422
+ };
423
+
424
+ /**
425
+ * @beta
426
+ * A structured snapshot of a post's content for historical display.
427
+ * Discriminated by `type`.
428
+ */
429
+ export declare type ContentSummary = PostContentSummary | EmailContentSummary | AssetContentSummary | GenericContentSummary;
430
+
431
+ /**
432
+ * @public
433
+ * Metadata specific to design content.
434
+ */
435
+ export declare interface DesignContentMetadata {
436
+ type: 'design';
437
+ /**
438
+ * A signed JWT token containing the design id
439
+ */
440
+ designToken: string;
441
+ /**
442
+ * The user given title of the design
443
+ */
444
+ title: string | undefined;
445
+ /**
446
+ * The pages that make up the exported metadata
447
+ */
448
+ pages: OutputPageMetadata[];
449
+
450
+ }
451
+
452
+ /**
453
+ * @beta
454
+ * The publishing destination when distinct from the connected account.
455
+ */
456
+ export declare type Destination = {
457
+ /** User-facing name (e.g. "Bob's Cool Page", "Product Newsletter"). */
458
+ displayName: string;
459
+ /** Avatar or icon URL for the destination. */
460
+ iconUrl?: string;
461
+ };
462
+
463
+ /**
464
+ * @public
465
+ * A function that can be called to dispose of a callback.
466
+ */
467
+ export declare type Disposer = () => void;
468
+
469
+ /**
470
+ * @public
471
+ * Exported PDF file ready for publishing.
472
+ *
473
+ * Contains the final PDF document that should be uploaded to your platform.
474
+ * The document format is `pdf_standard` and the file is ready to use.
475
+ */
476
+ export declare type DocumentOutputFile = BaseOutputFile;
477
+
478
+ /**
479
+ * @public
480
+ * Document preview in various states.
481
+ *
482
+ * Documents transition through states: `"loading"` → `"thumbnail"` → `"upgrading"` → `"ready"`.
483
+ * Start with a lightweight thumbnail of the first page, then upgrade to full multi-page
484
+ * preview using `requestPreviewUpgrade`.
485
+ */
486
+ export declare type DocumentPreview = DocumentPreviewLoading | DocumentPreviewThumbnail | DocumentPreviewUpgrading | DocumentPreviewReady | DocumentPreviewError;
487
+
488
+ /**
489
+ * @public
490
+ * Document preview that failed to generate.
491
+ *
492
+ * Display an error state to the user.
493
+ */
494
+ export declare interface DocumentPreviewError extends SizedPreview {
495
+ kind: 'document';
496
+ status: 'error';
497
+ /**
498
+ * The error message to display to the user.
499
+ */
500
+ message: string;
501
+ }
502
+
503
+ /**
504
+ * @public
505
+ * Document preview that is currently being generated.
506
+ *
507
+ * Display a loading state until the preview transitions to `"thumbnail"` or `"error"`.
508
+ */
509
+ export declare interface DocumentPreviewLoading extends SizedPreview {
510
+ kind: 'document';
511
+ status: 'loading';
512
+ }
513
+
514
+ /**
515
+ * @public
516
+ * Thumbnail for a single page within a document preview.
517
+ */
518
+ export declare interface DocumentPreviewPage {
519
+ /**
520
+ * URL to the page thumbnail image.
521
+ */
522
+ url: string;
523
+ /**
524
+ * Width of the page thumbnail in pixels.
525
+ */
526
+ widthPx: number;
527
+ /**
528
+ * Height of the page thumbnail in pixels.
529
+ */
530
+ heightPx: number;
531
+ }
532
+
533
+ /**
534
+ * @public
535
+ * Final state after a document preview has been upgraded. Contains thumbnail
536
+ * URLs for every selected page in the document.
537
+ */
538
+ export declare interface DocumentPreviewReady extends BasePreview {
539
+ kind: 'document';
540
+ status: 'ready';
541
+ /**
542
+ * Format of the per-page thumbnails.
543
+ */
544
+ format: 'png' | 'jpg';
545
+ /**
546
+ * Thumbnail pages for each page. Index corresponds to the page number.
547
+ */
548
+ pages: DocumentPreviewPage[];
549
+ }
550
+
551
+ /**
552
+ * @public
553
+ * Document preview with first page thumbnail available.
554
+ *
555
+ * This is the initial state for document previews. Show the thumbnail image
556
+ * of the first page to give users a quick preview of the document.
557
+ * Call `requestPreviewUpgrade` to load all page thumbnails.
558
+ */
559
+ export declare interface DocumentPreviewThumbnail extends SizedPreview {
560
+ kind: 'document';
561
+ status: 'thumbnail';
562
+ /**
563
+ * Format of the thumbnail image.
564
+ */
565
+ thumbnailFormat: 'png' | 'jpg';
566
+ /**
567
+ * URL to the first page thumbnail.
568
+ *
569
+ * Display this lightweight image to preview the document content.
570
+ */
571
+ thumbnailUrl: string;
572
+ }
573
+
574
+ /**
575
+ * @public
576
+ * Intermediate state while multi-page document thumbnails are being fetched
577
+ * via {@link requestPreviewUpgrade}. The single-page thumbnail remains
578
+ * available for display during the upgrade.
579
+ */
580
+ export declare interface DocumentPreviewUpgrading extends SizedPreview {
581
+ kind: 'document';
582
+ status: 'upgrading';
583
+ /**
584
+ * Format of the thumbnail image.
585
+ */
586
+ thumbnailFormat: 'png' | 'jpg';
587
+ /**
588
+ * URL to the first page thumbnail.
589
+ *
590
+ * Continue showing this while the upgrade loads.
591
+ */
592
+ thumbnailUrl: string;
593
+ }
594
+
595
+ /**
596
+ * @public
597
+ * Document file requirements for a media slot.
598
+ *
599
+ * Note: Document output types use image previews (PNG thumbnails) in the preview UI.
600
+ * The actual document file is only generated for the final output in OutputMedia.
601
+ *
602
+ * @example Document requirements
603
+ * ```ts
604
+ * const documentReq: DocumentRequirement = {
605
+ * format: 'pdf_standard',
606
+ * size: 'a4',
607
+ * };
608
+ * ```
609
+ */
610
+ export declare interface DocumentRequirement extends BaseFileRequirement {
611
+ /**
612
+ * Supported document export format.
613
+ * Currently supports PDF standard format.
614
+ */
615
+ format: 'pdf_standard';
616
+ /**
617
+ * The document size of the export file.
618
+ */
619
+ size: DocumentSize;
620
+ }
621
+
622
+ /**
623
+ * @public
624
+ * Selection metadata for a document media item.
625
+ */
626
+ export declare interface DocumentSelection extends BaseSelection {
627
+ kind: 'document';
628
+ }
629
+
630
+ /**
631
+ * @public
632
+ * Document size for document exports.
633
+ */
634
+ export declare type DocumentSize = 'a4' | 'a3' | 'letter' | 'legal';
635
+
636
+ /**
637
+ * @beta
638
+ * Content summary for email sends.
639
+ */
640
+ export declare type EmailContentSummary = BaseContentSummary & {
641
+ type: 'email';
642
+ /** Subject line. */
643
+ subject?: string;
644
+ /** Email body preview or preheader. */
645
+ body?: string;
646
+ };
647
+
648
+ /**
649
+ * @public
650
+ * Exported email file ready for publishing.
651
+ *
652
+ * Contains the final HTML bundle that should be uploaded to your platform.
653
+ */
654
+ export declare type EmailOutputFile = BaseOutputFile;
655
+
656
+ /**
657
+ * @public
658
+ * Email preview in various states.
659
+ *
660
+ * Display a loading state until the preview transitions to `"ready"` or `"error"`.
661
+ */
662
+ export declare type EmailPreview = EmailPreviewLoading | EmailPreviewReady | EmailPreviewError;
663
+
664
+ /**
665
+ * @public
666
+ * Email preview in an error state.
667
+ *
668
+ * Display an error state to the user.
669
+ */
670
+ export declare interface EmailPreviewError extends BasePreview {
671
+ kind: 'email';
672
+ status: 'error';
673
+ message: string;
674
+ }
675
+
676
+ /**
677
+ * @public
678
+ * Email preview in a loading state.
679
+ *
680
+ * Display a loading spinner until the preview transitions to `"ready"` or `"error"`.
681
+ */
682
+ export declare interface EmailPreviewLoading extends BasePreview {
683
+ kind: 'email';
684
+ status: 'loading';
685
+ }
686
+
687
+ /**
688
+ * @public
689
+ * Email preview in a ready state.
690
+ *
691
+ * Display the email preview.
692
+ */
693
+ export declare interface EmailPreviewReady extends BasePreview {
694
+ kind: 'email';
695
+ status: 'ready';
696
+ /**
697
+ * URL to the single html file that represents the email.
698
+ */
699
+ url: string;
700
+ }
701
+
702
+ /**
703
+ * @public
704
+ * Email file requirements for a media slot, currently only supports HTML bundle format.
705
+ *
706
+ * Note: Email output types use html_standalone previews in the preview UI.
707
+ * The actual email file is only generated for the final output in OutputMedia.
708
+ *
709
+ * @example Email bundle requirements
710
+ * ```ts
711
+ * const emailReq: EmailRequirement = {
712
+ * format: 'html_bundle',
713
+ * };
714
+ * ```
715
+ */
716
+ export declare interface EmailRequirement extends BaseFileRequirement {
717
+ format: 'html_bundle' | 'html_standalone';
718
+ }
719
+
720
+ /**
721
+ * @public
722
+ * Selection metadata for an email media item.
723
+ */
724
+ export declare interface EmailSelection extends BaseSelection {
725
+ kind: 'email';
726
+ }
727
+
728
+ /**
729
+ * @public
730
+ *
731
+ * The cause of an error
732
+ */
733
+ export declare type ErrorCause = 'invalid_selection' | 'invalid_format';
734
+
735
+ /**
736
+ * @public
737
+ * Exact value range constraint.
738
+ * @example Exact value range
739
+ * ```ts
740
+ * const exactValue: ValueRange = { exact: 1 }; // Must be exactly 1
741
+ * ```
742
+ */
743
+ export declare type ExactValueRange = {
744
+ exact: number;
745
+ };
746
+
747
+ /**
748
+ * @beta
749
+ * Generic content summary for apps that don't fit a more specific type.
750
+ */
751
+ export declare type GenericContentSummary = BaseContentSummary & {
752
+ type: 'content';
753
+ /** Title or headline. */
754
+ title?: string;
755
+ /** Body text or description. */
756
+ body?: string;
757
+ };
758
+
759
+ /**
760
+ * @beta
761
+ * Successful response from getContentSummary.
762
+ */
763
+ export declare type GetContentSummaryCompleted = {
764
+ status: 'completed';
765
+ contentSummary: ContentSummary;
766
+ };
767
+
768
+ /**
769
+ * @beta
770
+ * Error response from getContentSummary.
771
+ */
772
+ export declare type GetContentSummaryError = AppError;
773
+
774
+ /**
775
+ * @beta
776
+ * Request payload for the getContentSummary action.
777
+ */
778
+ export declare type GetContentSummaryRequest = {
779
+ /** The user's saved publish settings. Parse to retrieve app-specific state. */
780
+ publishRef?: string;
781
+ /**
782
+ * The output type selected for this publish operation.
783
+ *
784
+ * Use `id` to distinguish between output types.
785
+ */
786
+ outputType: OutputType;
787
+ };
788
+
789
+ /**
790
+ * @beta
791
+ * Response from getContentSummary.
792
+ */
793
+ export declare type GetContentSummaryResponse = GetContentSummaryCompleted | GetContentSummaryError;
794
+
795
+ /**
796
+ * @public
797
+ * Successful response from getting publish configuration.
798
+ */
799
+ export declare type GetPublishConfigurationCompleted = {
800
+ status: 'completed';
801
+ /**
802
+ * Array of available output types for your platform.
803
+ *
804
+ * Define different output types for various content formats that
805
+ * your platform supports (e.g., posts, stories, videos).
806
+ */
807
+ outputTypes: OutputTypeConfiguration[];
808
+ };
809
+
810
+ /**
811
+ * @public
812
+ * {@link GetPublishConfigurationError} error indicating a custom error occurred.
813
+ */
814
+ export declare type GetPublishConfigurationError = AppError;
815
+
816
+ /**
817
+ * @public
818
+ * Response from getting publish configuration.
819
+ */
820
+ export declare type GetPublishConfigurationResponse = GetPublishConfigurationCompleted | GetPublishConfigurationError;
821
+
822
+ /**
823
+ * @public
824
+ * Exported image file ready for publishing.
825
+ */
826
+ export declare interface ImageOutputFile extends BaseOutputFile {
827
+ /**
828
+ * Width of the image in pixels.
829
+ */
830
+ widthPx: number;
831
+ /**
832
+ * Height of the image in pixels.
833
+ */
834
+ heightPx: number;
835
+ }
836
+
837
+ /**
838
+ * @public
839
+ * Image preview in various states.
840
+ */
841
+ export declare type ImagePreview = ImagePreviewLoading | ImagePreviewReady | ImagePreviewError;
842
+
843
+ /**
844
+ * @public
845
+ * Image preview that failed to generate.
846
+ *
847
+ * Display an error state to the user.
848
+ */
849
+ export declare interface ImagePreviewError extends SizedPreview {
850
+ kind: 'image';
851
+ status: 'error';
852
+
853
+ /**
854
+ * The error message to display to the user.
855
+ */
856
+ message: string;
857
+ }
858
+
859
+ /**
860
+ * @public
861
+ * Image preview that is currently being generated.
862
+ *
863
+ * Display a loading state until the preview transitions to `"ready"` or `"error"`.
864
+ */
865
+ export declare interface ImagePreviewLoading extends SizedPreview {
866
+ kind: 'image';
867
+ status: 'loading';
868
+ }
869
+
870
+ /**
871
+ * @public
872
+ * Image preview that is ready to display.
873
+ *
874
+ * Contains the URL to the preview image.
875
+ */
876
+ export declare interface ImagePreviewReady extends SizedPreview {
877
+ kind: 'image';
878
+ status: 'ready';
879
+ /**
880
+ * Image format of the preview.
881
+ */
882
+ format: 'png' | 'jpg';
883
+ /**
884
+ * URL to the preview image.
885
+ *
886
+ * Use this URL to display the preview to users.
887
+ */
888
+ url: string;
889
+ }
890
+
891
+ /**
892
+ * @public
893
+ * Image file requirements for a media slot.
894
+ *
895
+ * Specifies format, aspect ratio, and size constraints for images.
896
+ *
897
+ * @example Image requirements for social media post
898
+ * ```ts
899
+ * const imageReq: ImageRequirement = {
900
+ * format: 'jpg',
901
+ * aspectRatio: { min: 0.8, max: 1.91 },
902
+ * };
903
+ * ```
904
+ */
905
+ export declare type ImageRequirement = BaseFileRequirement & {
906
+ /**
907
+ * Aspect ratio constraint (width / height).
908
+ *
909
+ * Examples:
910
+ * - `{ exact: 16/9 }`: Widescreen (16:9)
911
+ * - `{ min: 0.8, max: 1.91 }`: Instagram range
912
+ */
913
+ aspectRatio?: ValueRange;
914
+ } & ({
915
+ /**
916
+ * JPG image export.
917
+ */
918
+ format: 'jpg';
919
+ } | {
920
+ /**
921
+ * PNG image export.
922
+ */
923
+ format: 'png';
924
+ /**
925
+ * Controls transparent-background support for PNG exports.
926
+ *
927
+ * @remarks
928
+ * - Only applies when `format` is `'png'`
929
+ * - If omitted or `false`, Canva exports a standard opaque PNG
930
+ * - If `true`, Canva shows a `Transparent background` toggle in the publish flow
931
+ * - Users without the required Canva entitlement may be prompted to upgrade before a transparent export is produced
932
+ *
933
+ * @defaultValue false
934
+ */
935
+ allowTransparentBackground?: boolean;
936
+ });
937
+
938
+ /**
939
+ * @public
940
+ * Selection metadata for an image media item.
941
+ */
942
+ export declare interface ImageSelection extends BaseSelection {
943
+ kind: 'image';
944
+ }
945
+
946
+ /**
947
+ * @public
948
+ * Maximum value range constraint.
949
+ * @example Maximum value range
950
+ * ```ts
951
+ * const maxValue: ValueRange = { max: 10 }; // At most 10
952
+ * ```
953
+ */
954
+ export declare type MaxValueRange = {
955
+ max: number;
956
+ };
957
+
958
+ /**
959
+ * @public
960
+ * Metadata about a selected media item in a media slot.
961
+ */
962
+ export declare type MediaSelection = ImageSelection | VideoSelection | DocumentSelection | EmailSelection;
963
+
964
+ /**
965
+ * @public
966
+ * Configuration for a media slot within an output type.
967
+ *
968
+ * Defines what type of media is accepted, requirements, and constraints.
969
+ *
970
+ * @example Image slot with aspect ratio requirements
971
+ * ```ts
972
+ * const thumbnailSlot: MediaSlot = {
973
+ * id: 'thumbnail',
974
+ * displayName: 'Video Thumbnail',
975
+ * fileCount: { exact: 1 },
976
+ * accepts: {
977
+ * image: {
978
+ * format: 'jpg',
979
+ * aspectRatio: { exact: 16/9 },
980
+ * }
981
+ * }
982
+ * };
983
+ * ```
984
+ */
985
+ export declare type MediaSlot = {
986
+ /**
987
+ * Unique identifier for this media slot within the output type.
988
+ */
989
+ id: string;
990
+ /**
991
+ * User-facing name for this media slot.
992
+ *
993
+ * Examples: `"Post Image"`, `"Video Thumbnail"`, `"Main Video"`.
994
+ */
995
+ displayName: string;
996
+ /**
997
+ * Number of files accepted in this slot.
998
+ *
999
+ * Use this to specify single or multiple file requirements.
1000
+ * Examples:
1001
+ * - `{ exact: 1 }`: Exactly one file
1002
+ * - `{ min: 1, max: 10 }`: Between 1 and 10 files
1003
+ * - undefined: Any number of files
1004
+ */
1005
+ fileCount?: ValueRange;
1006
+ /**
1007
+ * File type requirements for this slot.
1008
+ *
1009
+ * Note the following behavior:
1010
+ *
1011
+ * - Provide at least one of `image` or `video`
1012
+ * - If both are provided, files for this slot may be either images or videos; each file
1013
+ * must satisfy the corresponding requirement for its media type
1014
+ * - To restrict the slot to a single media type, provide only that requirement
1015
+ * - `fileCount` applies across all files accepted by the slot regardless of media type
1016
+ * - Document output types will show image previews (PNG thumbnail) in preview UI
1017
+ */
1018
+ accepts: {
1019
+ image?: ImageRequirement;
1020
+ video?: VideoRequirement;
1021
+ document?: DocumentRequirement;
1022
+ /**
1023
+ * Email output types will show a single html file (canva hosted assets) preview in preview UI
1024
+ */
1025
+ email?: EmailRequirement;
1026
+ };
1027
+ /**
1028
+ * @public
1029
+ * Current selection for this slot.
1030
+ *
1031
+ * Canva populates this only when returning {@link OutputType} in Settings UI contexts
1032
+ * such as {@link RenderSettingsUiInvocationContext} and {@link PublishSettingsSettingsUiContext}.
1033
+ * Apps should not set this value when defining output types in
1034
+ * {@link ContentPublisherIntent.getPublishConfiguration}.
1035
+ */
1036
+ readonly selection?: readonly MediaSelection[];
1037
+ };
1038
+
1039
+ /**
1040
+ * @public
1041
+ * Minimum and maximum value range constraint.
1042
+ * Ranges are inclusive `(min ≤ value ≤ max)`.
1043
+ * @example Minimum and maximum value range
1044
+ * ```ts
1045
+ * const minMaxValue: ValueRange = { min: 1, max: 10 }; // Between 1 and 10
1046
+ * ```
1047
+ */
1048
+ export declare type MinMaxValueRange = {
1049
+ min: number;
1050
+ max: number;
1051
+ };
1052
+
1053
+ /**
1054
+ * @public
1055
+ * Minimum value range constraint.
1056
+ * @example Minimum value range
1057
+ * ```ts
1058
+ * const minValue: ValueRange = { min: 3 }; // At least 3
1059
+ * ```
1060
+ */
1061
+ export declare type MinValueRange = {
1062
+ min: number;
1063
+ };
1064
+
1065
+ /** @public */
1066
+ export declare type OnContextChange = (context: SettingsUiContext) => void;
1067
+
1068
+ /**
1069
+ * @public
1070
+ * Exported file ready for publishing.
1071
+ */
1072
+ export declare type OutputFile = ImageOutputFile | VideoOutputFile | DocumentOutputFile;
1073
+
1074
+ /**
1075
+ * @public
1076
+ * Production-ready exported files for a specific media slot.
1077
+ *
1078
+ * These are the final files that should be uploaded to your platform.
1079
+ */
1080
+ export declare type OutputMedia = {
1081
+ /**
1082
+ * ID of the media slot these files belong to.
1083
+ *
1084
+ * Matches a media slot ID from your output type definition.
1085
+ */
1086
+ mediaSlotId: string;
1087
+ /**
1088
+ * Array of exported files for this media slot.
1089
+ *
1090
+ * Files match the requirements specified in your media slot configuration.
1091
+ */
1092
+ files: OutputFile[];
1093
+ };
1094
+
1095
+ /**
1096
+ * @public
1097
+ * Metadata about a specific page in the exported content.
1098
+ */
1099
+ export declare type OutputPageMetadata = {
1100
+ /**
1101
+ * The unique identifier for the page.
1102
+ */
1103
+ pageId: string | undefined;
1104
+ /**
1105
+ * The position of the page within the design, starting from 1 for the first page.
1106
+ */
1107
+ pageNumber: number;
1108
+ };
1109
+
1110
+ /**
1111
+ * @public
1112
+ * Configuration for an output type.
1113
+ *
1114
+ * Defines a specific publishing format your platform supports,
1115
+ * including what media is required and accepted file types.
1116
+ *
1117
+ * @example Defining an Instagram post output type
1118
+ * ```ts
1119
+ * const instagramPost: OutputType = {
1120
+ * id: 'instagram_post',
1121
+ * displayName: 'Instagram Post',
1122
+ * mediaSlots: [
1123
+ * {
1124
+ * id: 'main_image',
1125
+ * displayName: 'Post Image',
1126
+ * fileCount: { min: 1, max: 10 },
1127
+ * accepts: {
1128
+ * image: {
1129
+ * format: 'jpg',
1130
+ * aspectRatio: { min: 0.8, max: 1.91 },
1131
+ * }
1132
+ * }
1133
+ * }
1134
+ * ]
1135
+ * };
1136
+ * ```
1137
+ */
1138
+ export declare type OutputType = {
1139
+ /**
1140
+ * Unique identifier for this output type.
1141
+ *
1142
+ * Use descriptive IDs like `"instagram_post"` or `"youtube_video"`.
1143
+ */
1144
+ id: string;
1145
+ /**
1146
+ * User-facing name for this output type.
1147
+ *
1148
+ * This is displayed to users when selecting where to publish.
1149
+ * Examples: `"Instagram Post"`, `"YouTube Video"`, `"Twitter Post"`.
1150
+ */
1151
+ displayName: string;
1152
+ /**
1153
+ * Array of media slots defining what content is needed.
1154
+ *
1155
+ * Each slot represents a piece of media required for publishing,
1156
+ * such as a main image, thumbnail, or video.
1157
+ */
1158
+ mediaSlots: MediaSlot[];
1159
+ /**
1160
+ * @beta
1161
+ * The type of content being published. When set, Canva uses this to tailor and improve the
1162
+ * publish experience. When omitted, defaults to `'content'` (generic behavior).
1163
+ */
1164
+ contentNoun?: ContentNoun;
1165
+ };
1166
+
1167
+ /**
1168
+ * @public
1169
+ * Configuration for an output type as provided by apps in
1170
+ * {@link ContentPublisherIntent.getPublishConfiguration}.
1171
+ *
1172
+ * This is the authored shape of an output type. It omits the
1173
+ * {@link MediaSlot.selection} field which is populated by Canva
1174
+ * when returning {@link OutputType} in Settings UI contexts.
1175
+ *
1176
+ * @example Defining output type configuration for a social media platform
1177
+ * ```ts
1178
+ * const outputType: OutputTypeConfiguration = {
1179
+ * id: 'instagram_post',
1180
+ * displayName: 'Instagram Post',
1181
+ * mediaSlots: [
1182
+ * {
1183
+ * id: 'main_image',
1184
+ * displayName: 'Post Image',
1185
+ * fileCount: { min: 1, max: 10 },
1186
+ * accepts: {
1187
+ * image: { format: 'jpg', aspectRatio: { min: 0.8, max: 1.91 } }
1188
+ * }
1189
+ * }
1190
+ * ]
1191
+ * };
1192
+ * ```
1193
+ */
1194
+ export declare type OutputTypeConfiguration = {
1195
+ /**
1196
+ * Unique identifier for this output type.
1197
+ *
1198
+ * Use descriptive IDs like `"instagram_post"` or `"youtube_video"`.
1199
+ */
1200
+ id: string;
1201
+ /**
1202
+ * User-facing name for this output type.
1203
+ *
1204
+ * This is displayed to users when selecting where to publish.
1205
+ * Examples: `"Instagram Post"`, `"YouTube Video"`, `"Twitter Post"`.
1206
+ */
1207
+ displayName: string;
1208
+ /**
1209
+ * Array of media slots defining what content is needed.
1210
+ *
1211
+ * Each slot represents a piece of media required for publishing,
1212
+ * such as a main image, thumbnail, or video.
1213
+ * The {@link MediaSlot.selection} field is omitted here because apps
1214
+ * do not provide selection data when defining output types.
1215
+ */
1216
+ mediaSlots: Omit<MediaSlot, 'selection'>[];
1217
+ /**
1218
+ * @beta
1219
+ * The type of content being published. When set, Canva uses this to tailor and improve the
1220
+ * publish experience. When omitted, defaults to `'content'` (generic behavior).
1221
+ */
1222
+ contentNoun?: ContentNoun;
1223
+ };
1224
+
1225
+ /**
1226
+ * @beta
1227
+ * Content summary for social media posts (e.g. Instagram, Facebook, LinkedIn, YouTube).
1228
+ */
1229
+ export declare type PostContentSummary = BaseContentSummary & {
1230
+ type: 'post';
1231
+ /** Post heading (e.g. YouTube title, LinkedIn article headline). */
1232
+ title?: string;
1233
+ /** Post caption or body text. */
1234
+ body?: string;
1235
+ /** Hashtags without the leading `#` (e.g. `["fashion", "design"]`). */
1236
+ hashtags?: string[];
1237
+ };
1238
+
1239
+ /**
1240
+ * @public
1241
+ * Action to be taken after publishing completes successfully.
1242
+ */
1243
+ export declare type PostPublishAction = PostPublishActionRedirect;
1244
+
1245
+ /**
1246
+ * @public
1247
+ * Redirect action to navigate the user to a URL after publishing.
1248
+ *
1249
+ * @example Redirecting to content editor
1250
+ * ```ts
1251
+ * const postPublishAction: PostPublishActionRedirect = {
1252
+ * type: 'redirect',
1253
+ * url: 'https://example.com/posts/12345/edit'
1254
+ * };
1255
+ * ```
1256
+ */
1257
+ export declare type PostPublishActionRedirect = {
1258
+ type: 'redirect';
1259
+ /**
1260
+ * The URL to redirect the user to after publishing.
1261
+ */
1262
+ url: string;
1263
+ };
1264
+
1265
+ /**
1266
+ * @public
1267
+ *
1268
+ * Prepares a {@link ContentPublisherIntent|Content Publisher Intent}.
1269
+ *
1270
+ * @example
1271
+ * ```tsx
1272
+ * import { prepareContentPublisher } from "@canva/intents/content";
1273
+ *
1274
+ * prepareContentPublisher({
1275
+ * getPublishConfiguration: async (params) => {
1276
+ * // Implement the logic to get the publish configuration
1277
+ * },
1278
+ * renderSettingsUi: (params) => {
1279
+ * // Implement the UI for settings view
1280
+ * },
1281
+ * renderPreviewUi: (params) => {
1282
+ * // Implement the UI for preview view
1283
+ * },
1284
+ * publishContent: async (params) => {
1285
+ * // Implement the logic to publish the content
1286
+ * },
1287
+ * });
1288
+ * ```
1289
+ */
1290
+ export declare const prepareContentPublisher: (implementation: ContentPublisherIntent) => void;
1291
+
1292
+ /**
1293
+ * @public
1294
+ * Preview item for an image or video.
1295
+ *
1296
+ * Check the `kind` and `status` properties to determine the type and state.
1297
+ */
1298
+ export declare type Preview = ImagePreview | VideoPreview | DocumentPreview | EmailPreview;
1299
+
1300
+ /**
1301
+ * @public
1302
+ * Type of preview media.
1303
+ */
1304
+ export declare type PreviewKind = 'image' | 'video' | 'document' | 'email';
1305
+
1306
+ /**
1307
+ * @public
1308
+ * Preview media for a specific media slot.
1309
+ *
1310
+ * Contains preview URLs and metadata for images or videos in the design.
1311
+ */
1312
+ export declare type PreviewMedia = {
1313
+ /**
1314
+ * ID of the media slot this preview belongs to.
1315
+ *
1316
+ * Matches a media slot ID from your output type definition.
1317
+ */
1318
+ mediaSlotId: string;
1319
+ /**
1320
+ * Array of preview items for this media slot.
1321
+ *
1322
+ * May contain multiple previews if the media slot accepts multiple files.
1323
+ */
1324
+ previews: Preview[];
1325
+ };
1326
+
1327
+ /**
1328
+ * @public
1329
+ * State of a preview item.
1330
+ */
1331
+ export declare type PreviewStatus = 'loading' | 'thumbnail' | 'upgrading' | 'ready' | 'error';
1332
+
1333
+ /**
1334
+ * @public
1335
+ * Successful response from publishing a content.
1336
+ *
1337
+ * @example Basic successful publish
1338
+ * ```ts
1339
+ * return {
1340
+ * status: 'completed',
1341
+ * externalId: 'post_12345',
1342
+ * externalUrl: 'https://example.com/posts/12345'
1343
+ * };
1344
+ * ```
1345
+ *
1346
+ * @example Successful publish with redirect
1347
+ * ```ts
1348
+ * return {
1349
+ * status: 'completed',
1350
+ * externalId: 'video_67890',
1351
+ * externalUrl: 'https://example.com/videos/67890',
1352
+ * postPublishAction: {
1353
+ * type: 'redirect',
1354
+ * url: 'https://example.com/videos/67890/edit'
1355
+ * }
1356
+ * };
1357
+ * ```
1358
+ */
1359
+ export declare type PublishContentCompleted = {
1360
+ status: 'completed';
1361
+ /**
1362
+ * Unique identifier returned from your external platform. You can use this for:
1363
+ *
1364
+ * - Tracking published content
1365
+ * - Fetching insights data for the published content
1366
+ * - Linking back to the content in future operations
1367
+ */
1368
+ externalId?: string;
1369
+ /**
1370
+ * Direct URL to the published content on your platform.
1371
+ *
1372
+ * Users can visit this URL to view their published content.
1373
+ * This may be displayed to users or used for sharing.
1374
+ */
1375
+ externalUrl?: string;
1376
+ /**
1377
+ * Optional action to perform after publishing completes.
1378
+ *
1379
+ * Currently supports redirecting users to a specific URL after publishing.
1380
+ */
1381
+ postPublishAction?: PostPublishAction;
1382
+ };
1383
+
1384
+ /**
1385
+ * @public
1386
+ * Error response from publishing a content.
1387
+ *
1388
+ * Return the appropriate error type based on the failure:
1389
+ *
1390
+ * - `"remote_request_failed"`: Network or API errors with your platform
1391
+ * - `"app_error"`: Custom application errors with optional message
1392
+ */
1393
+ export declare type PublishContentError = RemoteRequestFailedError | AppError;
1394
+
1395
+ /**
1396
+ * @public
1397
+ * Parameters required for publishing the content.
1398
+ * Contains all the information needed to send the content to your external platform.
1399
+ */
1400
+ export declare type PublishContentRequest = {
1401
+ /**
1402
+ * Platform-specific settings reference containing user configurations.
1403
+ *
1404
+ * This is the same reference you saved via `updatePublishSettings` in the settings UI.
1405
+ * Parse this string to retrieve the user's publish settings (e.g., captions, tags, privacy).
1406
+ *
1407
+ * Maximum size: 32KB
1408
+ */
1409
+ publishRef?: string;
1410
+ /**
1411
+ * The output type selected by the user for this publish operation.
1412
+ *
1413
+ * This matches one of the output types you provided in `getPublishConfiguration`.
1414
+ */
1415
+ outputType: OutputTypeConfiguration;
1416
+ /**
1417
+ * Production-ready exported files matching the requirements from your output type.
1418
+ *
1419
+ * These files are ready to upload to your platform and match the format, size,
1420
+ * and aspect ratio requirements specified in your media slots.
1421
+ */
1422
+ outputMedia: OutputMedia[];
1423
+ };
1424
+
1425
+ /**
1426
+ * @public
1427
+ * Response from a publish content operation.
1428
+ *
1429
+ * This can be either a successful completion or an error response.
1430
+ */
1431
+ export declare type PublishContentResponse = PublishContentCompleted | PublishContentError;
1432
+
1433
+ /** @public */
1434
+ export declare type PublishError = {
1435
+ appDefinedPayload?: string;
1436
+ };
1437
+
1438
+ /**
1439
+ * @public
1440
+ * Signals that the publish error was cleared.
1441
+ */
1442
+ export declare type PublishErrorClearedSettingsUiContext = {
1443
+ reason: 'publish_error_cleared';
1444
+ };
1445
+
1446
+ /**
1447
+ * @public
1448
+ * Provides information about an error that occurred in publishContent.
1449
+ */
1450
+ export declare type PublishErrorSettingsUiContext = {
1451
+ reason: 'publish_error';
1452
+ /**
1453
+ * The error that occurred. Undefined means no error occurred or the previous
1454
+ * error was cleared by Canva.
1455
+ */
1456
+ error: PublishError;
1457
+ };
1458
+
1459
+ /**
1460
+ * @public
1461
+ * Supported file formats for publishing.
1462
+ */
1463
+ export declare type PublishFileFormat = 'png' | 'jpg' | 'mp4' | 'pdf_standard' | 'html_bundle' | 'html_standalone';
1464
+
1465
+ /**
1466
+ * @public
1467
+ * Initial payload provided from cache.
1468
+ */
1469
+ export declare type PublishPreviewUiInvocationContext = {
1470
+ /**
1471
+ * Initial preview data and context provided when the preview UI is rendered.
1472
+ */
1473
+ reason: 'publish';
1474
+ /**
1475
+ * Initial preview media to display
1476
+ * This will only be used for scheduling and not caching
1477
+ */
1478
+ previewMedia?: PreviewMedia[];
1479
+ /** Information about the current output type being previewed */
1480
+ outputType?: OutputType;
1481
+ /** Current publish reference, if available */
1482
+ publishRef?: string;
1483
+ };
1484
+
1485
+ /**
1486
+ * @public
1487
+ * Validation state indicating whether publish settings are complete and valid.
1488
+ */
1489
+ export declare type PublishRefValidityState = 'valid' | 'invalid_missing_required_fields' | 'invalid_authentication_required';
1490
+
1491
+ /**
1492
+ * @public
1493
+ * Configuration for publish settings.
1494
+ *
1495
+ * Contains the user's settings and their validation state. Use this to
1496
+ * control whether the publish button is enabled.
1497
+ */
1498
+ export declare type PublishSettings = {
1499
+ /**
1500
+ * Serialized platform-specific settings for publishing.
1501
+ *
1502
+ * Store all information your app needs to publish the content in this string.
1503
+ * This might include:
1504
+ *
1505
+ * - Captions or descriptions
1506
+ * - Tags or hashtags
1507
+ * - Privacy settings
1508
+ * - Publishing destination (account, page, etc.)
1509
+ * - Scheduling information
1510
+ *
1511
+ * This reference will be provided to your `publishContent` method when publishing.
1512
+ *
1513
+ * Maximum size: 32KB
1514
+ *
1515
+ * @example Serializing settings
1516
+ * ```ts
1517
+ * const settings = {
1518
+ * caption: 'Check out my design!',
1519
+ * tags: ['design', 'creative'],
1520
+ * privacy: 'public'
1521
+ * };
1522
+ * const publishRef = JSON.stringify(settings);
1523
+ * ```
1524
+ */
1525
+ publishRef?: string;
1526
+ /**
1527
+ * Validation state of the publish settings.
1528
+ *
1529
+ * Controls whether the publish button is enabled:
1530
+ *
1531
+ * - `"valid"`: Settings are complete and valid, publish button is enabled
1532
+ * - `"invalid_missing_required_fields"`: Required settings are missing, publish button is disabled
1533
+ * - `"invalid_authentication_required"`: User must authenticate before publishing can proceed
1534
+ */
1535
+ validityState: PublishRefValidityState;
1536
+ };
1537
+
1538
+ /**
1539
+ * @public
1540
+ * Provides information about the current state of the settings UI to help
1541
+ * you adapt the interface based on the selected output type.
1542
+ */
1543
+ export declare type PublishSettingsSettingsUiContext = {
1544
+ reason: 'publish_settings';
1545
+ /**
1546
+ * The currently selected output type.
1547
+ *
1548
+ * Use this to customize your settings UI based on the requirements
1549
+ * of different output types.
1550
+ */
1551
+ outputType: OutputType;
1552
+ };
1553
+
1554
+ /**
1555
+ * @public
1556
+ * Initial payload provided from cache.
1557
+ */
1558
+ export declare type PublishSettingsUiInvocationContext = {
1559
+ /**
1560
+ * Initial settings and context provided when the settings UI is rendered.
1561
+ */
1562
+ reason: 'publish';
1563
+ /** Current publish reference to populate the UI, if any exist */
1564
+ publishRef?: string;
1565
+ /** Information about the current output type being configured */
1566
+ outputType?: OutputType;
1567
+ };
1568
+
1569
+ /**
1570
+ * @public
1571
+ * {@link PublishContentError} indicating failure of the remote request to the external platform.
1572
+ *
1573
+ * Return this error for:
1574
+ *
1575
+ * - Network connectivity issues
1576
+ * - API endpoint failures
1577
+ * - HTTP errors from your platform
1578
+ * - Timeout errors
1579
+ *
1580
+ * @example Handling network errors
1581
+ * ```ts
1582
+ * try {
1583
+ * await uploadToExternalPlatform(file);
1584
+ * } catch (error) {
1585
+ * return { status: 'remote_request_failed' };
1586
+ * }
1587
+ * ```
1588
+ */
1589
+ export declare type RemoteRequestFailedError = {
1590
+ status: 'remote_request_failed';
1591
+ };
1592
+
1593
+ /**
1594
+ * @public
1595
+ * Initial payload provided when the preview UI is rendered.
1596
+ * Contains the preview data and settings needed to initialize the preview interface.
1597
+ */
1598
+ export declare type RenderPreviewUiInvocationContext = PublishPreviewUiInvocationContext;
1599
+
1600
+ /**
1601
+ * @public
1602
+ * Configuration required for rendering the preview UI.
1603
+ *
1604
+ * Provides callbacks for managing preview media and responding to preview updates.
1605
+ */
1606
+ export declare type RenderPreviewUiRequest = {
1607
+ /**
1608
+ * @public
1609
+ * The initial preview data and context provided when the preview UI is rendered.
1610
+ *
1611
+ * Contains the initial preview media, output type information, and any existing
1612
+ * publish settings needed to properly display the preview interface.
1613
+ */
1614
+ invocationContext: RenderPreviewUiInvocationContext;
1615
+ /**
1616
+ * Callback to upgrade thumbnail previews to full media.
1617
+ *
1618
+ * Call this function when you need full video or multi-page document previews
1619
+ * instead of lightweight thumbnails. This helps optimize performance by deferring
1620
+ * full media loading until needed.
1621
+ *
1622
+ * Upgrades may complete asynchronously; listen to `registerOnPreviewChange` for updates
1623
+ * to receive the upgraded previews.
1624
+ *
1625
+ * @param previewIds - Array of preview IDs to upgrade from thumbnail to full media
1626
+ *
1627
+ * @example Upgrading previews on user interaction
1628
+ * ```ts
1629
+ * // When user clicks on a thumbnail, upgrade to full preview
1630
+ * if (preview.status === 'thumbnail') {
1631
+ * requestPreviewUpgrade([preview.id]);
1632
+ * }
1633
+ * ```
1634
+ */
1635
+ requestPreviewUpgrade: (previewIds: string[]) => void;
1636
+ /**
1637
+ * Registers a callback to be invoked when preview data changes.
1638
+ *
1639
+ * This callback is triggered when:
1640
+ *
1641
+ * - The design content changes
1642
+ * - The output type changes
1643
+ * - Preview media is upgraded from thumbnail to full video
1644
+ * - Export settings are modified
1645
+ *
1646
+ * Use this to update your preview UI in real-time as users modify their design.
1647
+ *
1648
+ * @param callback - The callback invoked when preview data is updated
1649
+ * @returns A disposer function that cleans up the registered callback
1650
+ *
1651
+ * @example Handling preview updates
1652
+ * ```ts
1653
+ * const disposer = registerOnPreviewChange(({ previewMedia, outputType, publishRef }) => {
1654
+ * // Update your preview UI with the new preview media
1655
+ * previewMedia.forEach((media) => {
1656
+ * media.previews.forEach((preview) => {
1657
+ * if (preview.status === 'ready') {
1658
+ * displayPreview(preview);
1659
+ * }
1660
+ * });
1661
+ * });
1662
+ * });
1663
+ *
1664
+ * // Clean up when preview UI is unmounted
1665
+ * onUnmount(() => disposer());
1666
+ * ```
1667
+ */
1668
+ registerOnPreviewChange: (callback: (opts: {
1669
+ previewMedia: PreviewMedia[];
1670
+ /** The output type that the preview data is for */
1671
+ outputType: OutputType;
1672
+ /** The current publish settings reference, if available */
1673
+ publishRef?: string;
1674
+ }) => void) => Disposer;
1675
+ };
1676
+
1677
+ /**
1678
+ * @public
1679
+ * Initial payload provided when the publish settings UI is rendered.
1680
+ * Contains the current settings state needed to initialize the settings interface.
1681
+ */
1682
+ export declare type RenderSettingsUiInvocationContext = PublishSettingsUiInvocationContext;
1683
+
1684
+ /**
1685
+ * @public
1686
+ * Configuration for the publish settings UI.
1687
+ *
1688
+ * This type provides the necessary callbacks and configuration for rendering
1689
+ * a custom publish settings interface where users configure platform-specific options.
1690
+ */
1691
+ export declare type RenderSettingsUiRequest = {
1692
+ /**
1693
+ * @public
1694
+ * The initial settings and context provided when the settings UI is rendered.
1695
+ *
1696
+ * Contains any previously saved publish settings and information about the current output type being configured.
1697
+ * Use this to restore the UI to its previous state or initialise it with appropriate defaults.
1698
+ */
1699
+ invocationContext: RenderSettingsUiInvocationContext;
1700
+ /**
1701
+ * Callback to save and validate the user's publish settings.
1702
+ *
1703
+ * Call this function whenever the user modifies their settings to:
1704
+ *
1705
+ * - Save the settings for later use in `publishContent`
1706
+ * - Validate that required fields are filled
1707
+ * - Enable or disable the publish button based on validity
1708
+ *
1709
+ * Store all necessary publishing information in the `publishRef` string.
1710
+ * This will be provided to your `publishContent` method when the user publishes.
1711
+ *
1712
+ * @param settings - The new publish settings to save
1713
+ * @returns A promise that resolves when the settings are successfully saved
1714
+ * @throws Will throw `CanvaError('bad_request')` if {@link PublishSettings.publishRef} exceeds 32KB.
1715
+ *
1716
+ * @example Updating settings as user types
1717
+ * ```ts
1718
+ * // As user fills in form fields, update settings
1719
+ * function handleCaptionChange(caption: string) {
1720
+ * const settings = { caption, tags: currentTags };
1721
+ * const publishRef = JSON.stringify(settings);
1722
+ *
1723
+ * updatePublishSettings({
1724
+ * publishRef,
1725
+ * validityState: caption ? 'valid' : 'invalid_missing_required_fields'
1726
+ * });
1727
+ * }
1728
+ * ```
1729
+ */
1730
+ updatePublishSettings: (publishSettings: PublishSettings) => Promise<UpdatePublishSettingsResponse>;
1731
+
1732
+ /**
1733
+ * Registers a callback to be invoked when the settings UI context changes.
1734
+ *
1735
+ * This callback is triggered when:
1736
+ * - the user changes the output type in the publish flow.
1737
+ * - an error occurs in the publish flow.
1738
+ *
1739
+ * Use this to respond to Canva changes and update your settings UI accordingly.
1740
+ *
1741
+ * @param opts - The options for registering a callback.
1742
+ * @returns A disposer function that cleans up the registered callback.
1743
+ *
1744
+ * @example Adapting UI for different output types
1745
+ * ```ts
1746
+ * registerOnContextChange({
1747
+ * onContextChange: (ctx) => {
1748
+ * if (ctx.reason === 'publish_settings') {
1749
+ * if (ctx.outputType.id === 'instagram_post') {
1750
+ * showHashtagField();
1751
+ * }
1752
+ * }
1753
+ * if (ctx.reason === 'publish_error') {
1754
+ * setError(ctx.error);
1755
+ * }
1756
+ * }
1757
+ * });
1758
+ * ```
1759
+ */
1760
+ registerOnContextChange: (opts: {
1761
+ onContextChange: OnContextChange;
1762
+ }) => Disposer;
1763
+ /**
1764
+ * @beta
1765
+ * Function to trigger a request for AI content.
1766
+ *
1767
+ * Use this function to trigger a request for AI content.
1768
+ *
1769
+ * @param request - The request for AI content.
1770
+ * @returns A promise resolving to the AI content response with a status of 'completed' or 'cancelled'.
1771
+ * @example Requesting AI content
1772
+ * ```ts
1773
+ * async function onGenerateCaption() {
1774
+ * const result = await requestAiContent({
1775
+ * type: 'social_caption',
1776
+ * currentValue: settings.caption,
1777
+ * fieldLabel: 'Caption',
1778
+ * hints: {
1779
+ * maxLength: 2200,
1780
+ * },
1781
+ * });
1782
+ *
1783
+ * if (result.status !== 'completed') {
1784
+ * return;
1785
+ * }
1786
+ * const nextSettings = { ...settings, caption: result.value };
1787
+ * // ... set local state
1788
+ * await updatePublishSettings({
1789
+ * publishRef: JSON.stringify(nextSettings),
1790
+ * validityState: 'valid',
1791
+ * });
1792
+ * }
1793
+ * ```
1794
+ */
1795
+ requestAiContent: RequestAiContent;
1796
+ };
1797
+
1798
+ /**
1799
+ * @beta
1800
+ * Function to trigger a request for AI content.
1801
+ */
1802
+ export declare type RequestAiContent = (request: AiContentRequest) => Promise<AiContentResponse>;
1803
+
1804
+ /**
1805
+ * @public
1806
+ * Metadata specific to design content represented by a media selection.
1807
+ */
1808
+ export declare interface SelectionDesignMetadata {
1809
+ type: 'design';
1810
+ /**
1811
+ * A signed JWT token containing the design id
1812
+ */
1813
+ designToken: string;
1814
+ /**
1815
+ * The user given title of the design
1816
+ */
1817
+ title: string | undefined;
1818
+ }
1819
+
1820
+ /**
1821
+ * @public
1822
+ * Metadata about the source content represented by a media selection.
1823
+ */
1824
+ export declare type SelectionMetadata = SelectionDesignMetadata;
1825
+
1826
+ /**
1827
+ * @public
1828
+ * Context information for the publish settings UI.
1829
+ */
1830
+ export declare type SettingsUiContext = PublishSettingsSettingsUiContext | PublishErrorSettingsUiContext | PublishErrorClearedSettingsUiContext;
1831
+
1832
+ /**
1833
+ * @public
1834
+ * Base interface for all preview types that have a fixed width and height.
1835
+ */
1836
+ export declare interface SizedPreview extends BasePreview {
1837
+ /**
1838
+ * Width of the preview in pixels.
1839
+ */
1840
+ widthPx: number;
1841
+ /**
1842
+ * Height of the preview in pixels.
1843
+ */
1844
+ heightPx: number;
1845
+ }
1846
+
1847
+ /**
1848
+ * @beta
1849
+ * Request for social caption generation.
1850
+ */
1851
+ export declare type SocialCaptionRequest = BaseAiContentRequest & {
1852
+ type: 'social_caption';
1853
+ /**
1854
+ * Hints for how the AI should generate the caption.
1855
+ */
1856
+ hints?: {
1857
+ /**
1858
+ * The maximum length of the caption.
1859
+ */
1860
+ maxLength?: number;
1861
+ };
1862
+ };
1863
+
1864
+ /**
1865
+ * @public
1866
+ * Successful response from updating the publish settings.
1867
+ */
1868
+ export declare type UpdatePublishSettingsCompleted = {
1869
+ status: 'completed';
1870
+ };
1871
+
1872
+ /**
1873
+ * @public
1874
+ * Response from updating the publish settings.
1875
+ */
1876
+ export declare type UpdatePublishSettingsResponse = UpdatePublishSettingsCompleted;
1877
+
1878
+ /**
1879
+ * @public
1880
+ * Numeric value range constraint.
1881
+ * Used to specify requirements for aspect ratios, durations, file counts, etc.
1882
+ */
1883
+ export declare type ValueRange = ExactValueRange | MinValueRange | MaxValueRange | MinMaxValueRange;
1884
+
1885
+ /**
1886
+ * @public
1887
+ * Exported video file ready for publishing.
1888
+ */
1889
+ export declare interface VideoOutputFile extends BaseOutputFile {
1890
+ /**
1891
+ * Width of the video in pixels.
1892
+ */
1893
+ widthPx: number;
1894
+ /**
1895
+ * Height of the video in pixels.
1896
+ */
1897
+ heightPx: number;
1898
+ }
1899
+
1900
+ /**
1901
+ * @public
1902
+ * Video preview in various states.
1903
+ *
1904
+ * Videos transition through states: `"loading"` → `"thumbnail"` → `"upgrading"` → `"ready"`.
1905
+ * Start with thumbnails for better performance, then upgrade to full video using `requestPreviewUpgrade`.
1906
+ */
1907
+ export declare type VideoPreview = VideoPreviewLoading | VideoPreviewThumbnail | VideoPreviewUpgrading | VideoPreviewReady | VideoPreviewError;
1908
+
1909
+ /**
1910
+ * @public
1911
+ * Video preview that failed to generate.
1912
+ *
1913
+ * Display an error state to the user.
1914
+ */
1915
+ export declare interface VideoPreviewError extends SizedPreview {
1916
+ kind: 'video';
1917
+ status: 'error';
1918
+
1919
+ /**
1920
+ * The error message to display to the user.
1921
+ */
1922
+ message: string;
1923
+ }
1924
+
1925
+ /**
1926
+ * @public
1927
+ * Video preview that is currently being generated.
1928
+ *
1929
+ * Display a loading state until the preview transitions to `"thumbnail"` or `"error"`.
1930
+ */
1931
+ export declare interface VideoPreviewLoading extends SizedPreview {
1932
+ kind: 'video';
1933
+ status: 'loading';
1934
+ /**
1935
+ * Video duration in milliseconds.
1936
+ */
1937
+ durationMs?: number;
1938
+ }
1939
+
1940
+ /**
1941
+ * @public
1942
+ * Video preview with full video ready to play.
1943
+ *
1944
+ * Contains URLs for both the video and thumbnail.
1945
+ */
1946
+ export declare interface VideoPreviewReady extends SizedPreview {
1947
+ kind: 'video';
1948
+ status: 'ready';
1949
+ /**
1950
+ * Video format.
1951
+ */
1952
+ format: 'mp4';
1953
+ /**
1954
+ * URL to the full video.
1955
+ *
1956
+ * Use this URL in a video player.
1957
+ */
1958
+ url: string;
1959
+ /**
1960
+ * Format of the thumbnail image.
1961
+ */
1962
+ thumbnailFormat: 'png' | 'jpg';
1963
+ /**
1964
+ * URL to the thumbnail image.
1965
+ *
1966
+ * Can be used as a poster image for the video player.
1967
+ */
1968
+ thumbnailUrl: string;
1969
+ /**
1970
+ * Video duration in milliseconds.
1971
+ */
1972
+ durationMs?: number;
1973
+ }
1974
+
1975
+ /**
1976
+ * @public
1977
+ * Video preview with lightweight thumbnail available.
1978
+ *
1979
+ * This is the initial state for video previews. Show the thumbnail image
1980
+ * and call `requestPreviewUpgrade` when the user needs the full video.
1981
+ */
1982
+ export declare interface VideoPreviewThumbnail extends SizedPreview {
1983
+ kind: 'video';
1984
+ status: 'thumbnail';
1985
+ /**
1986
+ * Format of the thumbnail image.
1987
+ */
1988
+ thumbnailFormat: 'png' | 'jpg';
1989
+ /**
1990
+ * URL to the thumbnail image.
1991
+ *
1992
+ * Display this lightweight image until full video is needed.
1993
+ */
1994
+ thumbnailUrl: string;
1995
+ /**
1996
+ * Video duration in milliseconds.
1997
+ */
1998
+ durationMs?: number;
1999
+ }
2000
+
2001
+ /**
2002
+ * @public
2003
+ * Video preview that is being upgraded from thumbnail to full video.
2004
+ *
2005
+ * Display the thumbnail with a loading indicator until the video is ready.
2006
+ */
2007
+ export declare interface VideoPreviewUpgrading extends SizedPreview {
2008
+ kind: 'video';
2009
+ status: 'upgrading';
2010
+ /**
2011
+ * Format of the thumbnail image.
2012
+ */
2013
+ thumbnailFormat: 'png' | 'jpg';
2014
+ /**
2015
+ * URL to the thumbnail image.
2016
+ *
2017
+ * Continue showing the thumbnail while the full video loads.
2018
+ */
2019
+ thumbnailUrl: string;
2020
+ /**
2021
+ * Video duration in milliseconds.
2022
+ */
2023
+ durationMs?: number;
2024
+ }
2025
+
2026
+ /**
2027
+ * @public
2028
+ * Video file requirements for a media slot.
2029
+ *
2030
+ * Specifies format, aspect ratio, duration, and size constraints for videos.
2031
+ *
2032
+ * @example Video requirements for YouTube
2033
+ * ```ts
2034
+ * const videoReq: VideoRequirement = {
2035
+ * format: 'mp4',
2036
+ * aspectRatio: { exact: 16/9 },
2037
+ * durationMs: { min: 1000, max: 600000 },
2038
+ * };
2039
+ * ```
2040
+ */
2041
+ export declare interface VideoRequirement extends BaseFileRequirement {
2042
+ /**
2043
+ * Supported video format.
2044
+ */
2045
+ format: 'mp4';
2046
+ /**
2047
+ * Aspect ratio constraint (width / height).
2048
+ *
2049
+ * Examples:
2050
+ * - `{ exact: 16/9 }`: Widescreen
2051
+ * - `{ exact: 9/16 }`: Vertical/Story format
2052
+ */
2053
+ aspectRatio?: ValueRange;
2054
+ /**
2055
+ * Duration constraint in milliseconds.
2056
+ *
2057
+ * Examples:
2058
+ * - `{ max: 60000 }`: Maximum 60 seconds
2059
+ * - `{ min: 3000, max: 600000 }`: Between 3 seconds and 10 minutes
2060
+ */
2061
+ durationMs?: ValueRange;
2062
+
2063
+ }
2064
+
2065
+ /**
2066
+ * @public
2067
+ * Selection metadata for a video media item.
2068
+ */
2069
+ export declare interface VideoSelection extends BaseSelection {
2070
+ kind: 'video';
2071
+ /**
2072
+ * Duration of the selected video in milliseconds.
2073
+ */
2074
+ durationMs: number;
2075
+ }
2076
+
2077
+ export { }