@canva/design 2.8.1-alpha.0 → 2.8.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.
package/CHANGELOG.md CHANGED
@@ -1,8 +1,31 @@
1
1
  # CHANGELOG
2
2
 
3
- ## 2.8.1-alpha.0 - 2026-04-01
3
+ ## 2.8.1-beta.0 - 2026-05-11
4
+
5
+ ### Changed
6
+
7
+ - Introduced a new property to DesignMetadata that lists all the dataset fields in the current document. These are fields that were tagged for bulk create or brand templates mapping, and are only available in FIXED designs. The list will come empty if no fields are available.
8
+
9
+ ### Added
10
+
11
+ - Introduce `trim` and `imageBox` optional properties on `VideoElement` to beta, enabling apps to control video playback timing (start/end points in seconds) and crop the visible portion of a video.
12
+
13
+ ## 2.7.6-beta.2 - 2026-02-01
4
14
 
5
15
  ### Added
6
16
 
7
- - Initial npm release of the `@canva/design` Early Preview package.
17
+ - Beta version of `getDesignMetadata` has been evolved to include `page type` and `page title` for supported page types.
18
+
19
+ ## 2.7.6-beta.1 - 2026-01-18
20
+
21
+ ### Added
22
+
23
+ - Beta versions of `addElementAtPoint`, `initAppElement`, and `addPage` now support `trim` and `imageBox` on video elements.
24
+ - New API `publish.launch` to launch the content publisher
25
+ - New API `bulkCreate.launch` to open the Bulk Create experience with the Data Connector intent open.
26
+ - Added a CHANGELOG.md to track changes.
27
+ - New API `getDesignTemplateMetadata` in beta to return template metadata for a design that has used a template.
28
+
29
+ ## 2.7.6-beta.0 - 2025-11-12
8
30
 
31
+ - Initial changelog for the Preview Design SDK.
@@ -2,7 +2,7 @@
2
2
  * @beta
3
3
  * Information about a page within a design with fixed or unbounded dimensions.
4
4
  */
5
- declare type AbsolutePageMetadata = {
5
+ export declare type AbsolutePageMetadata = {
6
6
  /**
7
7
  * The type of page.
8
8
  */
@@ -828,17 +828,6 @@ export declare type AppElementClientConfiguration<A extends AppElementData> = {
828
828
  render: AppElementRenderer<A>;
829
829
  };
830
830
 
831
- /**
832
- * @alpha
833
- * Configuration for an App Element
834
- */
835
- export declare type AppElementClientConfigurationV2<A extends AppElementData> = {
836
- /**
837
- * The AppElementRenderer to use when rendering the app element
838
- */
839
- render: AppElementRendererV2<A>;
840
- };
841
-
842
831
  /**
843
832
  * @public
844
833
  * The data associated with an app element.
@@ -874,22 +863,6 @@ export declare type AppElementRenderer<A extends AppElementData> = (appElementDa
874
863
  */
875
864
  export declare type AppElementRendererOutput = GroupContentAtPoint[];
876
865
 
877
- /**
878
- * @alpha
879
- * A return value of {@link AppElementRendererV2} function.
880
- * It is an array of elements to render within an app element.
881
- */
882
- export declare type AppElementRendererOutputV2 = AppElementRendererOutput;
883
-
884
- /**
885
- * @alpha
886
- * A callback that runs when an app's element is changed.
887
- *
888
- * @remarks
889
- * This callback must return one or more elements to render within the app element.
890
- */
891
- export declare type AppElementRendererV2<A extends AppElementData> = (appElementData: A) => AppElementRendererOutputV2;
892
-
893
866
  /**
894
867
  * @public
895
868
  * A unique identifier that references an app runtime process
@@ -942,61 +915,6 @@ export declare type AudioTrack = {
942
915
  ref: AudioRef;
943
916
  };
944
917
 
945
- /**
946
- * @alpha
947
- * Configuration for the Autofill call to request the Data Connector intent implemented by the app
948
- * and skipping the data preview modal.
949
- */
950
- export declare type AutofillDataConnectorNoPreview = {
951
- dataSelectionDisplay: 'hide';
952
- dataSourceRef: DataSourceRef;
953
- };
954
-
955
- /**
956
- * @alpha
957
- * Configuration for the Autofill call to request the Data Connector intent implemented by the app
958
- * and displaying the data preview modal.
959
- */
960
- export declare type AutofillDataConnectorWithPreview = {
961
- dataSelectionDisplay: 'show';
962
- };
963
-
964
- /**
965
- * @alpha
966
- * Wrapper for the configurations that will query the app owned Data Connector.
967
- */
968
- export declare type AutofillFromDataConnector = {
969
- type: 'data_connector';
970
- withDataConnector: 'self';
971
- limit?: DataTableLimit;
972
- } & (AutofillDataConnectorWithPreview | AutofillDataConnectorNoPreview);
973
-
974
- /**
975
- * @alpha
976
- * Configuration for providing a fully populated data table to the Autofill call.
977
- */
978
- export declare type AutofillFromDataTable = {
979
- type: 'data_table';
980
- dataTable: DataTable;
981
- };
982
-
983
- /**
984
- * @alpha
985
- * A set of options to configure the Autofill call.
986
- * @param title - an optional title that will be set to the document after Autofill is done.
987
- */
988
- export declare type AutofillOptions = {
989
- title?: string;
990
- } & (AutofillFromDataTable | AutofillFromDataConnector);
991
-
992
- /**
993
- * @alpha
994
- * Response object from the Autofill operation.
995
- */
996
- export declare type AutofillResponse = {
997
- status: 'success';
998
- };
999
-
1000
918
  /**
1001
919
  * @public
1002
920
  * Cell containing a boolean value.
@@ -1072,23 +990,6 @@ export declare type Bounds = {
1072
990
  */
1073
991
  export declare type Box = Point & (WidthAndHeight | Width | Height);
1074
992
 
1075
- /**
1076
- * @alpha
1077
- * A unique identifier that references a brand template.
1078
- */
1079
- export declare type BrandTemplateId = string & {
1080
- __brandTemplateId: never;
1081
- };
1082
-
1083
- /**
1084
- * @alpha
1085
- * Metadata for a brand template.
1086
- */
1087
- export declare type BrandTemplateMetadata = Omit<TemplateMetadata, 'domain'> & {
1088
- domain: 'brand';
1089
- dataset?: DataField[];
1090
- };
1091
-
1092
993
  /**
1093
994
  * @public
1094
995
  * An alias for the BulkCreateLauncher interface, providing access to bulk create related functionality
@@ -1284,7 +1185,7 @@ export declare interface ContentDraft<T> {
1284
1185
  /**
1285
1186
  * @beta
1286
1187
  */
1287
- declare type ContentType = 'richtext' | 'fill';
1188
+ export declare type ContentType = 'richtext' | 'fill';
1288
1189
 
1289
1190
  /**
1290
1191
  * @public
@@ -1408,18 +1309,6 @@ export declare type DataField = {
1408
1309
  type: 'image' | 'text' | 'chart';
1409
1310
  };
1410
1311
 
1411
- /**
1412
- * @alpha
1413
- * A representation of the data source that is given to the Data Connector.
1414
- */
1415
- export declare type DataSourceRef = {
1416
- /**
1417
- * This 'source' will be passed on to the Data Connector intent.
1418
- */
1419
- source: string;
1420
- title?: string;
1421
- };
1422
-
1423
1312
  /**
1424
1313
  * @public
1425
1314
  * Structured tabular data for import into Canva.
@@ -3126,7 +3015,7 @@ export declare type DesignElement = ImageElement | VideoElement | EmbedElement |
3126
3015
  * @beta
3127
3016
  * Information about the design.
3128
3017
  */
3129
- declare type DesignMetadata = {
3018
+ export declare type DesignMetadata = {
3130
3019
  /**
3131
3020
  * The title of the user's design.
3132
3021
  * @remarks
@@ -3162,40 +3051,6 @@ declare type DesignMetadata = {
3162
3051
  dataset?: DataField[];
3163
3052
  };
3164
3053
 
3165
- /**
3166
- * @public
3167
- * Information about the design.
3168
- */
3169
- declare type DesignMetadata_2 = {
3170
- /**
3171
- * The title of the user's design.
3172
- * @remarks
3173
- * This is optional and will be `undefined` if the user hasn't set a title.
3174
- */
3175
- title?: string;
3176
- /**
3177
- * The default dimensions that a new page will have when it is added to a design.
3178
- * It is possible for a user to resize a page without resizing the entire design, e.g. by clicking
3179
- * "Expand to Whiteboard". However, there will always be a single set of default dimensions for a
3180
- * design that is applied whenever a new page is created.
3181
- * @remarks
3182
- * This is optional and will be `undefined` if the design is unbounded (e.g. Whiteboard or Doc).
3183
- */
3184
- defaultPageDimensions?: PageDimensions;
3185
- /**
3186
- * The information associated with each page of the design.
3187
- * @remarks
3188
- * The order of pages is not guaranteed.
3189
- */
3190
- pageMetadata: Iterable<PageMetadata_2>;
3191
- /**
3192
- * The duration of the whole design in seconds.
3193
- * @remarks
3194
- * This is the precise value, which differs from what is displayed in the UI as duration in Canva UI is formatted differently.
3195
- */
3196
- durationInSeconds: number;
3197
- };
3198
-
3199
3054
  /**
3200
3055
  * @beta
3201
3056
  * A callback for operating on all pages of the design.
@@ -3221,6 +3076,12 @@ export declare type DesignOpenAllPagesOptions = {
3221
3076
  */
3222
3077
  export declare type DesignOpenCallback = (session: DesignEditing.CurrentPageSession) => Promise<void>;
3223
3078
 
3079
+ /**
3080
+ * @beta
3081
+ * A callback for operating on the design.
3082
+ */
3083
+ declare type DesignOpenCallback_2 = DesignOpenCurrentPageCallback | DesignOpenAllPagesCallback;
3084
+
3224
3085
  /**
3225
3086
  * @beta
3226
3087
  * A callback for operating on the current page of the design.
@@ -3546,31 +3407,44 @@ export declare type DragStartEvent<E extends Element> = Pick<DragEvent, 'dataTra
3546
3407
  };
3547
3408
 
3548
3409
  /**
3549
- * @public
3550
- * Reads and edits content of the specified type from the user's design.
3551
- * @param options - Options for configuring how a design is read.
3552
- * @param callback - A callback for operating on the read content.
3553
- *
3554
- * @example Read richtext content
3555
- * ```typescript
3556
- * import { editContent } from "@canva/design";
3557
- *
3558
- * await editContent(
3559
- * { contentType: 'richtext', target: 'current_page' },
3560
- * async (session) => {
3561
- * // Do something with the richtext content, e.g. `session.contents`
3562
- * }
3563
- * );
3564
- * ```
3410
+ * @beta
3411
+ * Reads and edits richtext content from the user's design.
3412
+ * @param options - Options for configuring how a design is read. Must specify `contentType: 'richtext'`.
3413
+ * @param callback - A callback that receives a `RichtextContentSession` for editing.
3414
+ * @returns A promise that resolves when editing is complete.
3415
+ */
3416
+ export declare function editContent(options: EditContentOptions & {
3417
+ contentType: 'richtext';
3418
+ }, callback: (session: RichtextContentSession) => Promise<void> | void): Promise<void>;
3419
+
3420
+ /**
3421
+ * @beta
3422
+ * Reads and edits fill content from the user's design.
3423
+ * @param options - Options for configuring how a design is read. Must specify `contentType: 'fill'`.
3424
+ * @param callback - A callback that receives a `FillContentSession` for editing.
3425
+ * @returns A promise that resolves when editing is complete.
3426
+ */
3427
+ export declare function editContent(options: EditContentOptions & {
3428
+ contentType: 'fill';
3429
+ }, callback: (session: FillContentSession) => Promise<void> | void): Promise<void>;
3430
+
3431
+ /**
3432
+ * @beta
3433
+ * Reads and edits content from the user's design.
3434
+ * @param options - Options for configuring how a design is read. Must specify a content type.
3435
+ * @param callback - A callback that receives a session for editing.
3436
+ * @returns A promise that resolves when editing is complete.
3565
3437
  */
3566
- export declare const editContent: (options: EditContentOptions_2, callback: EditContentCallback_2) => Promise<void>;
3438
+ export declare function editContent<T extends ContentType>(options: EditContentOptions & {
3439
+ contentType: T;
3440
+ }, callback: (session: ContentTypeMap[T]) => Promise<void> | void): Promise<void>;
3567
3441
 
3568
3442
  /**
3569
3443
  * @beta
3570
3444
  * A callback for reading and updating the requested design content.
3571
3445
  * @param session - Session for reading and updating content in the design.
3572
3446
  */
3573
- declare type EditContentCallback = (session: RichtextContentSession | FillContentSession) => Promise<void> | void;
3447
+ export declare type EditContentCallback = (session: RichtextContentSession | FillContentSession) => Promise<void> | void;
3574
3448
 
3575
3449
  /**
3576
3450
  * @public
@@ -3583,7 +3457,7 @@ declare type EditContentCallback_2 = (session: RichtextContentSession) => Promis
3583
3457
  * @beta
3584
3458
  * Options for configuring how the design content is read.
3585
3459
  */
3586
- declare type EditContentOptions = {
3460
+ export declare type EditContentOptions = {
3587
3461
  /**
3588
3462
  * The type of content to edit from the user's design
3589
3463
  */
@@ -3928,21 +3802,6 @@ export declare type FontRef = string & {
3928
3802
  **/
3929
3803
  export declare type FontWeight = 'normal' | 'thin' | 'extralight' | 'light' | 'medium' | 'semibold' | 'bold' | 'ultrabold' | 'heavy';
3930
3804
 
3931
- /**
3932
- * @alpha
3933
- * Return metadata for a brand template given its ID.
3934
- *
3935
- * @example Get brand template metadata
3936
- * ```typescript
3937
- * import { getBrandTemplateMetadata, BrandTemplateId } from "@canva/design";
3938
- *
3939
- * const templateId = resolveToken(requestBrandTemplates()) as BrandTemplateId;
3940
- *
3941
- * const metadata = await getBrandTemplateMetadata(templateId);
3942
- * ```
3943
- */
3944
- export declare const getBrandTemplateMetadata: (id: BrandTemplateId) => Promise<BrandTemplateMetadata>;
3945
-
3946
3805
  /**
3947
3806
  * Allows to get the context of currently selected page.
3948
3807
  * @public
@@ -4013,19 +3872,25 @@ export declare const getCurrentPageContext: () => Promise<PageContext>;
4013
3872
  export declare const getDefaultPageDimensions: () => Promise<Dimensions | undefined>;
4014
3873
 
4015
3874
  /**
4016
- * @public
3875
+ * @beta
4017
3876
  * Retrieves information about the design.
3877
+ */
3878
+ export declare const getDesignMetadata: () => Promise<DesignMetadata>;
3879
+
3880
+ /**
3881
+ * @beta
3882
+ * Retrieves information about the template that was used in a design.
4018
3883
  *
4019
- * @example Get design metadata
3884
+ * @example Get design template metadata
4020
3885
  * ```typescript
4021
- * import { getDesignMetadata } from "@canva/design";
3886
+ * import { getDesignTemplateMetadata } from "@canva/design";
4022
3887
  *
4023
- * const metadata = await getDesignMetadata();
3888
+ * const templateMetadata = await getDesignTemplateMetadata();
4024
3889
  *
4025
- * const { title, defaultPageDimensions, pageMetadata, durationInSeconds } = metadata;
3890
+ * const { keywords, domain } = templateMetadata;
4026
3891
  * ```
4027
3892
  */
4028
- export declare const getDesignMetadata: () => Promise<DesignMetadata_2>;
3893
+ export declare const getDesignTemplateMetadata: () => Promise<DesignTemplateMetadata>;
4029
3894
 
4030
3895
  /**
4031
3896
  * @public
@@ -4373,13 +4238,44 @@ declare type ImageUploadOptions = {
4373
4238
  } & AllOrNone<Dimensions_2>;
4374
4239
 
4375
4240
  /**
4376
- * @alpha
4241
+ * @public
4377
4242
  * @param appElementConfig - Configuration for an AppElementClient
4243
+ *
4244
+ * @example Initialize app element client
4245
+ * ```typescript
4246
+ * import { initAppElement } from "@canva/design";
4247
+ *
4248
+ * const appElement = initAppElement<{ content: string }>({
4249
+ * render: (data) => {
4250
+ * return [{
4251
+ * type: 'text',
4252
+ * children: [data.content],
4253
+ * top: 100,
4254
+ * left: 100,
4255
+ * width: 200
4256
+ * }];
4257
+ * }
4258
+ * });
4259
+ * ```
4260
+ *
4261
+ * @example Initialize V2 app element client
4262
+ * ```typescript
4263
+ * import { initAppElement } from "@canva/design";
4264
+ *
4265
+ * const appElement = initAppElement<{ content: string }>({
4266
+ * render: (data) => {
4267
+ * return [{
4268
+ * type: 'text',
4269
+ * children: [data.content],
4270
+ * top: 100,
4271
+ * left: 100,
4272
+ * width: 200
4273
+ * }];
4274
+ * }
4275
+ * });
4276
+ * ```
4378
4277
  */
4379
- export declare const initAppElement: {
4380
- <A extends AppElementData>(appElementConfig: AppElementClientConfigurationV2<A>): AppElementClient<A>;
4381
- <A extends AppElementData>(appElementConfig: AppElementClientConfiguration<A>): AppElementClient<A>;
4382
- };
4278
+ export declare const initAppElement: <A extends AppElementData>(appElementConfig: AppElementClientConfiguration<A>) => AppElementClient<A>;
4383
4279
 
4384
4280
  /**
4385
4281
  * @public
@@ -4719,14 +4615,16 @@ declare type NumberDataTableCell = {
4719
4615
  declare type ObjectPrimitive = Boolean | String;
4720
4616
 
4721
4617
  /**
4722
- * @public
4723
- *
4724
- * Reads a specified part of the user's design and returns all elements in that part.
4725
- *
4618
+ * @beta
4619
+ * Reads (and optionally updates) a specified part of the user's design.
4726
4620
  * @param options - Options for configuring how the design is read.
4727
4621
  * @param callback - A callback for operating on the design.
4728
4622
  */
4729
- export declare const openDesign: (options: DesignOpenOptions, callback: DesignOpenCallback) => Promise<void>;
4623
+ export declare const openDesign: {
4624
+ (options: DesignOpenCurrentPageOptions, callback: DesignOpenCurrentPageCallback): Promise<void>;
4625
+ (options: DesignOpenAllPagesOptions, callback: DesignOpenAllPagesCallback): Promise<void>;
4626
+ (options: DesignOpenOptions_2, callback: DesignOpenCallback_2): Promise<void>;
4627
+ };
4730
4628
 
4731
4629
  /**
4732
4630
  * @public
@@ -4823,23 +4721,7 @@ export declare type PageDimensions = {
4823
4721
  * @beta
4824
4722
  * Information about a page within a design.
4825
4723
  */
4826
- declare type PageMetadata = AbsolutePageMetadata | UnsupportedPageMetadata;
4827
-
4828
- /**
4829
- * @public
4830
- * Information about a page.
4831
- */
4832
- declare type PageMetadata_2 = {
4833
-
4834
- /**
4835
- *
4836
- * The dimensions of the page, in pixels.
4837
- *
4838
- * @remarks
4839
- * This may be `undefined` because some types of pages don't have dimensions, such as whiteboards.
4840
- */
4841
- dimensions?: PageDimensions;
4842
- };
4724
+ export declare type PageMetadata = AbsolutePageMetadata | UnsupportedPageMetadata;
4843
4725
 
4844
4726
  /**
4845
4727
  * @public
@@ -4946,106 +4828,6 @@ export declare type PublishLauncher = {
4946
4828
  launch(opts: LaunchPublishOpts): Promise<void>;
4947
4829
  };
4948
4830
 
4949
- /**
4950
- * @alpha
4951
- * Requests the Autofill flow to start of the given options. The flow can request data from the app
4952
- * owned Data Connector, or use any given data that is passed in the options object.
4953
- *
4954
- * @param opts - The configuration options for this Autofill flow.
4955
- *
4956
- * @example Basic usage - Open data connector preview dialog to request data
4957
- * ```typescript
4958
- * import { requestAutofillDesign } from "@canva/design";
4959
- * import type { AutofillOptions } from "@canva/design";
4960
- *
4961
- * const opts: AutofillOptions = {
4962
- * title: 'Updated design',
4963
- * type: 'data_connector',
4964
- * dataSelectionDisplay: 'show',
4965
- * };
4966
- *
4967
- * const response = await requestAutofillDesign(element);
4968
- * ```
4969
- *
4970
- * @example Basic usage - Request data from the data connector without preview
4971
- * ```typescript
4972
- * import { requestAutofillDesign } from "@canva/design";
4973
- * import type { AutofillOptions } from "@canva/design";
4974
- *
4975
- * const opts: AutofillOptions = {
4976
- * title: 'Updated design',
4977
- * type: 'data_connector',
4978
- * dataSelectionDisplay: 'hide',
4979
- * dataSourceRef: { source: 'serialized_content' }
4980
- * };
4981
- *
4982
- * const response = await requestAutofillDesign(element);
4983
- * ```
4984
- *
4985
- * @example Basic usage - Use the data given in the options
4986
- * ```typescript
4987
- * import { requestAutofillDesign } from "@canva/design";
4988
- * import type { AutofillOptions } from "@canva/design";
4989
- *
4990
- * const opts: AutofillOptions = {
4991
- * title: 'Updated design',
4992
- * type: 'data_table',
4993
- * dataTable: // Set the data table containing the data entries for each field.
4994
- * };
4995
- *
4996
- * const response = await requestAutofillDesign(element);
4997
- * ```
4998
- */
4999
- export declare const requestAutofillDesign: (opts: AutofillOptions) => Promise<AutofillResponse>;
5000
-
5001
- /**
5002
- * @alpha
5003
- * Trigger brand template selection panel and returns the selected template token.
5004
- *
5005
- * @example Request brand templates
5006
- * ```typescript
5007
- * import { requestBrandTemplates } from "@canva/design";
5008
- *
5009
- * const response = await requestBrandTemplates();
5010
- *
5011
- * if (response.status === 'aborted') return;
5012
- *
5013
- * const { token } = response.brandTemplates[0];
5014
- * ```
5015
- */
5016
- export declare const requestBrandTemplates: () => Promise<RequestBrandTemplatesResponse>;
5017
-
5018
- /**
5019
- * @alpha
5020
- * Response object from the RequestBrandTemplate operation.
5021
- */
5022
- export declare type RequestBrandTemplatesResponse = RequestBrandTemplatesResponseCompleted | RequestBrandTemplatesResponseAborted;
5023
-
5024
- /**
5025
- * @alpha
5026
- * Response object from the RequestBrandTemplate operation that was aborted.
5027
- */
5028
- export declare type RequestBrandTemplatesResponseAborted = {
5029
- status: 'aborted';
5030
- };
5031
-
5032
- /**
5033
- * @alpha
5034
- * Response object from the RequestBrandTemplate operation completed successfully.
5035
- */
5036
- export declare type RequestBrandTemplatesResponseCompleted = {
5037
- status: 'completed';
5038
- brandTemplates: RequestBrandTemplatesResponseContent[];
5039
- };
5040
-
5041
- /**
5042
- * @alpha
5043
- * Response object from the RequestBrandTemplate operation completed successfully.
5044
- */
5045
- export declare type RequestBrandTemplatesResponseContent = {
5046
- token: string;
5047
- };
5048
-
5049
4831
  /**
5050
4832
  * @public
5051
4833
  * Exports the user's design as one or more static files.
@@ -6084,7 +5866,7 @@ export declare const ui: UI;
6084
5866
  * @beta
6085
5867
  * Pages that do not have fixed or unbounded dimensions currently do not return metadata.
6086
5868
  */
6087
- declare type UnsupportedPageMetadata = {
5869
+ export declare type UnsupportedPageMetadata = {
6088
5870
  /**
6089
5871
  * The type of page.
6090
5872
  */
@@ -6158,6 +5940,16 @@ export declare type VideoElement = {
6158
5940
  * Use `undefined` for content with no description.
6159
5941
  */
6160
5942
  altText: AltText | undefined;
5943
+ /**
5944
+ * @beta
5945
+ * Options for configuring the cropping of the video.
5946
+ */
5947
+ imageBox?: VideoImageBox;
5948
+ /**
5949
+ * @beta
5950
+ * Options for configuring the start, and end of the video.
5951
+ */
5952
+ trim?: VideoTrim;
6161
5953
  };
6162
5954
 
6163
5955
  /**
@@ -6188,6 +5980,29 @@ export declare type VideoFill = {
6188
5980
  altText?: AltText;
6189
5981
  };
6190
5982
 
5983
+ /**
5984
+ * @beta
5985
+ * Options for configuring the visible portion of a video.
5986
+ */
5987
+ export declare type VideoImageBox = {
5988
+ /**
5989
+ * The distance of the image box from the top edge of the video, in pixels.
5990
+ */
5991
+ top: number;
5992
+ /**
5993
+ * The distance of the image box from the left edge of the video, in pixels.
5994
+ */
5995
+ left: number;
5996
+ /**
5997
+ * The width of the image box, in pixels.
5998
+ */
5999
+ width: number;
6000
+ /**
6001
+ * The height of the image box, in pixels.
6002
+ */
6003
+ height: number;
6004
+ };
6005
+
6191
6006
  /**
6192
6007
  * @public
6193
6008
  * The MIME type of a video file that's supported by Canva's backend.
@@ -6214,6 +6029,21 @@ declare type VideoRef_2 = string & {
6214
6029
  __videoRef: never;
6215
6030
  };
6216
6031
 
6032
+ /**
6033
+ * @beta
6034
+ * Options for configuring the start and end points for video playback.
6035
+ */
6036
+ export declare type VideoTrim = {
6037
+ /**
6038
+ * The start point of the video, in seconds relative to the start of the source video.
6039
+ */
6040
+ startInSeconds: number;
6041
+ /**
6042
+ * The end point of the video, in seconds relative to the start of the source video.
6043
+ */
6044
+ endInSeconds: number;
6045
+ };
6046
+
6217
6047
  /**
6218
6048
  * @public
6219
6049
  * Options for uploading a video asset to the user's private media library.
package/index.d.ts CHANGED
@@ -1 +1 @@
1
- export * from "./alpha";
1
+ export * from "./beta";
@@ -9,17 +9,17 @@ function _export(target, all) {
9
9
  });
10
10
  }
11
11
  _export(exports, {
12
- get getBrandTemplateMetadata () {
13
- return getBrandTemplateMetadata;
12
+ get editContent () {
13
+ return editContent;
14
14
  },
15
- get initAppElement () {
16
- return initAppElement;
15
+ get getDesignMetadata () {
16
+ return getDesignMetadata;
17
17
  },
18
- get requestAutofillDesign () {
19
- return requestAutofillDesign;
18
+ get getDesignTemplateMetadata () {
19
+ return getDesignTemplateMetadata;
20
20
  },
21
- get requestBrandTemplates () {
22
- return requestBrandTemplates;
21
+ get openDesign () {
22
+ return openDesign;
23
23
  }
24
24
  });
25
25
  const _version = require("./version");
@@ -37,8 +37,10 @@ function _export_star(from, to) {
37
37
  });
38
38
  return from;
39
39
  }
40
- const initAppElement = canva_sdk.design.v2.designInteraction.initAppElement;
41
- const requestAutofillDesign = canva_sdk.design.v2.autofill.requestAutofillDesign;
42
- const requestBrandTemplates = canva_sdk.design.v2.designInteraction.requestBrandTemplates;
43
- const getBrandTemplateMetadata = canva_sdk.design.v2.designInteraction.getBrandTemplateMetadata;
44
- window.__canva__?.sdkRegistration?.registerPackageVersion('design', _version.LATEST_VERSION_ALPHA, 'alpha');
40
+ const getDesignMetadata = canva_sdk.design.v2.designInteraction.getDesignMetadata;
41
+ function editContent(options, callback) {
42
+ return canva_sdk.design.v2.designInteraction.editContent(options, (session)=>callback(session));
43
+ }
44
+ const openDesign = canva_sdk.design.v2.designInteraction.openDesign;
45
+ const getDesignTemplateMetadata = canva_sdk.design.v2.designInteraction.getDesignTemplateMetadata;
46
+ window.__canva__?.sdkRegistration?.registerPackageVersion('design', _version.LATEST_VERSION_BETA, 'beta');
@@ -37,6 +37,12 @@ class FakeDesignInteractionClient {
37
37
  ]
38
38
  };
39
39
  }
40
+ async applyTemplate(options) {
41
+ await this.delay();
42
+ return {
43
+ status: 'completed'
44
+ };
45
+ }
40
46
  async getBrandTemplateMetadata(id) {
41
47
  await this.delay();
42
48
  return {
@@ -410,10 +416,18 @@ const fakeAsyncOperations = {
410
416
  ];
411
417
  }
412
418
  };
419
+ const fakeTimingAccessor = {
420
+ get: ()=>({
421
+ delayInSeconds: 0,
422
+ durationInSeconds: 'until_end_of_page'
423
+ }),
424
+ set: async ()=>{}
425
+ };
413
426
  const fakeOpenDesignHelpers = {
414
427
  elementStateBuilder: fakeElementStateBuilder,
415
428
  group: fakeAsyncOperations.group,
416
429
  ungroup: fakeAsyncOperations.ungroup,
430
+ timingFor: (_elementRef)=>fakeTimingAccessor,
417
431
  snapshot: ()=>{
418
432
  return {};
419
433
  }
@@ -2,7 +2,7 @@
2
2
  Object.defineProperty(exports, "__esModule", {
3
3
  value: true
4
4
  });
5
- _export_star(require("./alpha"), exports);
5
+ _export_star(require("./beta"), exports);
6
6
  function _export_star(from, to) {
7
7
  Object.keys(from).forEach(function(k) {
8
8
  if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
@@ -2,7 +2,7 @@
2
2
  Object.defineProperty(exports, "__esModule", {
3
3
  value: true
4
4
  });
5
- _export_star(require("./alpha"), exports);
5
+ _export_star(require("./beta"), exports);
6
6
  function _export_star(from, to) {
7
7
  Object.keys(from).forEach(function(k) {
8
8
  if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
@@ -20,5 +20,5 @@ _export(exports, {
20
20
  }
21
21
  });
22
22
  const LATEST_VERSION = '2.8.0';
23
- const LATEST_VERSION_BETA = '2.7.6-beta.2';
24
- const LATEST_VERSION_ALPHA = '2.8.1-alpha.0';
23
+ const LATEST_VERSION_BETA = '2.8.1-beta.0';
24
+ const LATEST_VERSION_ALPHA = '2.8.1-alpha.1';
@@ -0,0 +1,9 @@
1
+ import { LATEST_VERSION_BETA } from './version';
2
+ export const getDesignMetadata = canva_sdk.design.v2.designInteraction.getDesignMetadata;
3
+ export function editContent(options, callback) {
4
+ return canva_sdk.design.v2.designInteraction.editContent(options, (session)=>callback(session));
5
+ }
6
+ export const openDesign = canva_sdk.design.v2.designInteraction.openDesign;
7
+ export const getDesignTemplateMetadata = canva_sdk.design.v2.designInteraction.getDesignTemplateMetadata;
8
+ export * from './public';
9
+ window.__canva__?.sdkRegistration?.registerPackageVersion('design', LATEST_VERSION_BETA, 'beta');
@@ -16,6 +16,12 @@ export class FakeDesignInteractionClient {
16
16
  ]
17
17
  };
18
18
  }
19
+ async applyTemplate(options) {
20
+ await this.delay();
21
+ return {
22
+ status: 'completed'
23
+ };
24
+ }
19
25
  async getBrandTemplateMetadata(id) {
20
26
  await this.delay();
21
27
  return {
@@ -389,10 +395,18 @@ const fakeAsyncOperations = {
389
395
  ];
390
396
  }
391
397
  };
398
+ const fakeTimingAccessor = {
399
+ get: ()=>({
400
+ delayInSeconds: 0,
401
+ durationInSeconds: 'until_end_of_page'
402
+ }),
403
+ set: async ()=>{}
404
+ };
392
405
  export const fakeOpenDesignHelpers = {
393
406
  elementStateBuilder: fakeElementStateBuilder,
394
407
  group: fakeAsyncOperations.group,
395
408
  ungroup: fakeAsyncOperations.ungroup,
409
+ timingFor: (_elementRef)=>fakeTimingAccessor,
396
410
  snapshot: ()=>{
397
411
  return {};
398
412
  }
@@ -1 +1 @@
1
- export * from './alpha';
1
+ export * from './beta';
@@ -1 +1 @@
1
- export * from './alpha';
1
+ export * from './beta';
@@ -1,3 +1,3 @@
1
1
  export const LATEST_VERSION = '2.8.0';
2
- export const LATEST_VERSION_BETA = '2.7.6-beta.2';
3
- export const LATEST_VERSION_ALPHA = '2.8.1-alpha.0';
2
+ export const LATEST_VERSION_BETA = '2.8.1-beta.0';
3
+ export const LATEST_VERSION_ALPHA = '2.8.1-alpha.1';
package/package.json CHANGED
@@ -1,25 +1,25 @@
1
1
  {
2
2
  "name": "@canva/design",
3
- "version": "2.8.1-alpha.0",
3
+ "version": "2.8.1-beta.0",
4
4
  "description": "The Canva Apps SDK design library",
5
5
  "author": "Canva Pty Ltd.",
6
6
  "license": "SEE LICENSE IN LICENSE.md FILE",
7
7
  "peerDependencies": {
8
8
  "@canva/error": "^2.0.0"
9
9
  },
10
- "main": "./lib/cjs/sdk/design/alpha.js",
11
- "module": "./lib/esm/sdk/design/alpha.js",
10
+ "main": "./lib/cjs/sdk/design/beta.js",
11
+ "module": "./lib/esm/sdk/design/beta.js",
12
12
  "exports": {
13
13
  ".": {
14
- "types": "./alpha.d.ts",
15
- "require": "./lib/cjs/sdk/design/alpha.js",
16
- "import": "./lib/esm/sdk/design/alpha.js"
14
+ "types": "./beta.d.ts",
15
+ "require": "./lib/cjs/sdk/design/beta.js",
16
+ "import": "./lib/esm/sdk/design/beta.js"
17
17
  },
18
18
  "./test": {
19
- "types": "./test/alpha.d.ts",
20
- "require": "./lib/cjs/sdk/design/test/alpha.js",
21
- "import": "./lib/esm/sdk/design/test/alpha.js"
19
+ "types": "./test/beta.d.ts",
20
+ "require": "./lib/cjs/sdk/design/test/beta.js",
21
+ "import": "./lib/esm/sdk/design/test/beta.js"
22
22
  }
23
23
  },
24
- "typings": "./alpha.d.ts"
24
+ "typings": "./beta.d.ts"
25
25
  }
package/test/index.d.ts CHANGED
@@ -1 +1 @@
1
- export * from "./alpha";
1
+ export * from "./beta";
@@ -1,18 +0,0 @@
1
- "use strict"
2
- Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- _export_star(require("./beta"), exports);
6
- function _export_star(from, to) {
7
- Object.keys(from).forEach(function(k) {
8
- if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
9
- Object.defineProperty(to, k, {
10
- enumerable: true,
11
- get: function() {
12
- return from[k];
13
- }
14
- });
15
- }
16
- });
17
- return from;
18
- }
@@ -1,7 +0,0 @@
1
- import { LATEST_VERSION_ALPHA } from './version';
2
- export const initAppElement = canva_sdk.design.v2.designInteraction.initAppElement;
3
- export const requestAutofillDesign = canva_sdk.design.v2.autofill.requestAutofillDesign;
4
- export const requestBrandTemplates = canva_sdk.design.v2.designInteraction.requestBrandTemplates;
5
- export const getBrandTemplateMetadata = canva_sdk.design.v2.designInteraction.getBrandTemplateMetadata;
6
- export * from './public';
7
- window.__canva__?.sdkRegistration?.registerPackageVersion('design', LATEST_VERSION_ALPHA, 'alpha');
@@ -1 +0,0 @@
1
- export * from './beta';
File without changes