@shopify/app-bridge-types 0.0.11 → 0.0.13

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 (3) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/package.json +3 -2
  3. package/shopify.ts +797 -117
package/CHANGELOG.md CHANGED
@@ -5,6 +5,10 @@ All notable changes to this project will be documented in this file.
5
5
  The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
6
6
  and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
7
7
 
8
+ ## [0.0.13] - 2023-04-24
9
+
10
+ - Remove incorrectly added `Symbol()` declaration causing issues with import
11
+
8
12
  ## [0.0.3] - 2023-07-27
9
13
 
10
14
  ### Changed
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@shopify/app-bridge-types",
3
- "version": "0.0.11",
3
+ "version": "0.0.13",
4
4
  "description": "Companion types library for the Shopify App Bridge script",
5
5
  "license": "ISC",
6
6
  "main": "./index.js",
@@ -22,6 +22,7 @@
22
22
  "index.d.ts",
23
23
  "shopify.ts",
24
24
  "index.mjs",
25
- "index.js"
25
+ "index.js",
26
+ "CHANGELOG.md"
26
27
  ]
27
28
  }
package/shopify.ts CHANGED
@@ -1,30 +1,110 @@
1
1
  interface Address {
2
+ /**
3
+ * The customer's primary address.
4
+ */
2
5
  address1?: string;
6
+ /**
7
+ * Any extra information associated with the address (Apartment #, Suite #, Unit #, etc.).
8
+ */
3
9
  address2?: string;
10
+ /**
11
+ * The name of the customer's city.
12
+ */
4
13
  city?: string;
14
+ /**
15
+ * The company name associated with address.
16
+ */
5
17
  company?: string;
18
+ /**
19
+ * The first name of the customer.
20
+ */
6
21
  firstName?: string;
22
+ /**
23
+ * The last name of the customer.
24
+ */
7
25
  lastName?: string;
26
+ /**
27
+ * The phone number of the customer.
28
+ */
8
29
  phone?: string;
30
+ /**
31
+ * The province or state of the address.
32
+ */
9
33
  province?: string;
34
+ /**
35
+ * The country of the address.
36
+ */
10
37
  country?: string;
38
+ /**
39
+ * The ZIP or postal code of the address.
40
+ */
11
41
  zip?: string;
42
+ /**
43
+ * The name of the address.
44
+ */
12
45
  name?: string;
46
+ /**
47
+ * The acronym of the province or state.
48
+ */
13
49
  provinceCode?: string;
50
+ /**
51
+ * The Country Code in ISO 3166-1 (alpha-2) format.
52
+ */
14
53
  countryCode?: string;
15
54
  }
16
55
 
56
+ interface AdminUser {
57
+ /**
58
+ * The account access level of the logged-in user
59
+ */
60
+ accountAccess?: string;
61
+ }
62
+
17
63
  export interface AppBridgeAttributes {
18
64
  }
19
65
 
20
- interface AppBridgeConfig {
21
- host?: string;
22
- apiKey: string;
23
- shop: string;
24
- locale: string;
25
- disabledFeatures?: string[];
66
+ interface AppBridgeConfig extends Required<Omit<_AppBridgeConfig, 'disabledFeatures' | 'appOrigins'>>, Pick<_AppBridgeConfig, 'disabledFeatures' | 'appOrigins'> {
26
67
  experimentalFeatures?: string[];
68
+ }
69
+
70
+ interface _AppBridgeConfig {
71
+ /**
72
+ * The client ID provided for your application in the Partner Dashboard.
73
+ *
74
+ * This needs to be provided by the app developer.
75
+ */
76
+ apiKey: string;
77
+ /**
78
+ * An allowlist of origins that your app can send authenticated fetch requests to.
79
+ *
80
+ * This is useful if your app needs to make authenticated requests to a different domain that you control.
81
+ */
27
82
  appOrigins?: string[];
83
+ /**
84
+ * The features to disable in your app.
85
+ *
86
+ * This allows app developers to opt-out of features such as <code>fetch</code>.
87
+ */
88
+ disabledFeatures?: string[];
89
+ /**
90
+ * The base64-encoded host of the shop that's embedding your app.
91
+ *
92
+ * This does not need to be provided by the app developer.
93
+ */
94
+ host?: string;
95
+ /**
96
+ * The locale of the shop that's embedding your app.
97
+ *
98
+ * This does not need to be provided by the app developer.
99
+ * @defaultValue 'en-US'
100
+ */
101
+ locale?: string;
102
+ /**
103
+ * The shop origin of the shop that's embedding your app.
104
+ *
105
+ * This does not need to be provided by the app developer.
106
+ */
107
+ shop?: string;
28
108
  }
29
109
 
30
110
  export interface AppBridgeElements {
@@ -41,24 +121,59 @@ export interface AugmentedElements {
41
121
  a: MenuItemProperties;
42
122
  }
43
123
 
124
+ interface BaseElementAttributes {
125
+ id?: string;
126
+ name?: string;
127
+ class?: string;
128
+ href?: string;
129
+ rel?: string;
130
+ target?: string;
131
+ onclick?: string;
132
+ children?: string;
133
+ }
134
+
44
135
  interface BaseResource extends Resource {
45
136
  variants?: Resource[];
46
137
  }
47
138
 
48
139
  interface Cart {
140
+ /**
141
+ * The total cost of the current cart including discounts, but before taxes and shipping. Value is based on the shop's existing currency settings.
142
+ */
49
143
  subtotal: string;
144
+ /**
145
+ * The sum of taxes for the current cart. Value is based on the shop's existing currency settings.
146
+ */
50
147
  taxTotal: string;
148
+ /**
149
+ * The total cost of the current cart, after taxes and discounts have been applied. Value is based on the shop's existing currency settings.
150
+ */
51
151
  grandTotal: string;
52
- note?: string;
152
+ /**
153
+ * The current discount applied to the entire cart.
154
+ */
53
155
  cartDiscount?: Discount;
54
- cartDiscounts: Discount[];
156
+ /**
157
+ * All current discounts applied to the entire cart and line items.
158
+ */
159
+ cartDiscounts?: Discount[];
160
+ /**
161
+ * The customer associated to the current cart.
162
+ */
55
163
  customer?: Customer;
164
+ /**
165
+ * A list of lineItem objects.
166
+ */
56
167
  lineItems: LineItem[];
168
+ /**
169
+ * A list of objects containing cart properties.
170
+ */
57
171
  properties: Record<string, string>;
58
172
  }
59
173
 
60
- type CartDiscountType = 'Percentage' | 'FixedAmount';
61
-
174
+ /**
175
+ * Callback to execute when cart updates.
176
+ */
62
177
  type CartSubscriber = (cart: Cart) => void;
63
178
 
64
179
  interface Collection extends Resource {
@@ -103,77 +218,266 @@ enum CollectionSortOrder {
103
218
  }
104
219
 
105
220
  interface Customer {
106
- id?: number;
221
+ /**
222
+ * The ID of existing customer.
223
+ */
224
+ id: number;
225
+ /**
226
+ * The email for a new customer.
227
+ */
107
228
  email?: string;
229
+ /**
230
+ * The first name for new customer.
231
+ */
108
232
  firstName?: string;
233
+ /**
234
+ * The last name for new customer.
235
+ */
109
236
  lastName?: string;
237
+ /**
238
+ * The note for new customer.
239
+ */
110
240
  note?: string;
111
241
  }
112
242
 
243
+ interface CustomSale {
244
+ /**
245
+ * Price of line item
246
+ */
247
+ price: number;
248
+ /**
249
+ * Quantity of line item.
250
+ */
251
+ quantity: number;
252
+ /**
253
+ * Title of line item.
254
+ */
255
+ title: string;
256
+ /**
257
+ * If line item charges tax.
258
+ */
259
+ taxable: boolean;
260
+ }
261
+
113
262
  interface Device {
263
+ /**
264
+ * The name of the device.
265
+ */
114
266
  name: string;
267
+ /**
268
+ * The unique ID associated device ID and app ID..
269
+ */
115
270
  serialNumber: string;
116
271
  }
117
272
 
118
273
  interface Discount {
274
+ /**
275
+ * Amount of discount. Only for fixed or percentage discounts.
276
+ */
119
277
  amount: number;
120
- title?: string;
121
- type?: CartDiscountType;
278
+ /**
279
+ * Description of discount.
280
+ */
281
+ discountDescription?: string;
282
+ /**
283
+ * Type of discount.
284
+ */
285
+ type: DiscountType;
286
+ }
287
+
288
+ type DiscountType = 'Percentage' | 'FixedAmount';
289
+
290
+ interface EnvironmentApi extends Required<_EnvironmentApi> {
291
+ }
292
+
293
+ interface _EnvironmentApi {
294
+ /**
295
+ * Whether the app is running on Shopify Mobile.
296
+ */
297
+ mobile?: boolean;
298
+ /**
299
+ * Whether the app is embedded in the Shopify admin.
300
+ */
301
+ embedded?: boolean;
302
+ /**
303
+ * Whether the app is running on Shopify POS.
304
+ */
305
+ pos?: boolean;
122
306
  }
123
307
 
124
- interface Environment {
125
- mobile: boolean;
126
- embedded: boolean;
127
- pos: boolean;
308
+ interface Filters {
309
+ /**
310
+ * Whether to show hidden resources, referring to products that are not published on any sales channels.
311
+ * @defaultValue true
312
+ */
313
+ hidden?: boolean;
314
+ /**
315
+ * Whether to show product variants. Only applies to the Product resource type picker.
316
+ * @defaultValue true
317
+ */
318
+ variants?: boolean;
319
+ /**
320
+ * Whether to show [draft products](https://help.shopify.com/en/manual/products/details?shpxid=70af7d87-E0F2-4973-8B09-B972AAF0ADFD#product-availability).
321
+ * Only applies to the Product resource type picker.
322
+ * Setting this to undefined will show a badge on draft products.
323
+ * @defaultValue true
324
+ */
325
+ draft?: boolean | undefined;
326
+ /**
327
+ * Whether to show [archived products](https://help.shopify.com/en/manual/products/details?shpxid=70af7d87-E0F2-4973-8B09-B972AAF0ADFD#product-availability).
328
+ * Only applies to the Product resource type picker.
329
+ * Setting this to undefined will show a badge on draft products.
330
+ * @defaultValue true
331
+ */
332
+ archived?: boolean | undefined;
333
+ /**
334
+ * GraphQL initial search query for filtering resources available in the picker.
335
+ * See [search syntax](https://shopify.dev/docs/api/usage/search-syntax) for more information.
336
+ * This is not displayed in the search bar when the picker is opened.
337
+ */
338
+ query?: string;
128
339
  }
129
340
 
341
+ type Finish = (data?: any) => void;
342
+
130
343
  enum FulfillmentServiceType {
131
344
  GiftCard = "GIFT_CARD",
132
345
  Manual = "MANUAL",
133
346
  ThirdParty = "THIRD_PARTY"
134
347
  }
135
348
 
349
+ /**
350
+ * Asynchronously returns an ID token.
351
+ * @returns A Promise that resolves to an ID token.
352
+ */
353
+ type IdTokenApi = () => Promise<string>;
354
+
136
355
  interface Image_2 {
137
356
  id: string;
138
357
  altText?: string;
139
358
  originalSrc: string;
140
359
  }
141
360
 
361
+ interface Intent {
362
+ readonly action: string;
363
+ readonly type: string;
364
+ readonly data: {
365
+ [key: string]: any;
366
+ };
367
+ finish: Finish;
368
+ }
369
+
370
+ interface IntentsApi {
371
+ register(callback: (intent: Intent) => void): () => void;
372
+ }
373
+
142
374
  interface LineItem {
375
+ /**
376
+ * Unique id of line item
377
+ */
143
378
  uuid: string;
379
+ /**
380
+ * Price of line item
381
+ */
144
382
  price?: number;
383
+ /**
384
+ * Quantity of line item.
385
+ */
145
386
  quantity: number;
387
+ /**
388
+ * Title of line item.
389
+ */
146
390
  title?: string;
391
+ /**
392
+ * Variant identifier for line item.
393
+ */
147
394
  variantId?: number;
395
+ /**
396
+ * Product identifier for line item.
397
+ */
148
398
  productId?: number;
399
+ /**
400
+ * Discount applied to line item.
401
+ */
149
402
  discounts: Discount[];
403
+ /**
404
+ * If line item charges tax.
405
+ */
150
406
  taxable: boolean;
407
+ /**
408
+ * Stock keeping unit of the line item.
409
+ */
151
410
  sku?: string;
411
+ /**
412
+ * Vendor of line item.
413
+ */
152
414
  vendor?: string;
415
+ /**
416
+ * Properties of the line item.
417
+ */
153
418
  properties: {
154
419
  [key: string]: string;
155
420
  };
421
+ /**
422
+ * If the line item is a gift card.
423
+ */
156
424
  isGiftCard: boolean;
157
425
  }
158
426
 
159
- interface LineItemDiscount {
160
- title: string;
161
- type: CartDiscountType;
162
- amount: string;
163
- }
427
+ /**
428
+ * The `Loading` API provides a method to toggle the loading indicator in the Shopify admin.
429
+ * @param isLoading - An optional boolean parameter. If `true`, the loading indicator is shown. If `false` or omitted, the loading indicator is hidden.
430
+ */
431
+ type LoadingApi = (isLoading?: boolean) => void;
164
432
 
165
433
  interface Location_2 {
434
+ /**
435
+ * The ID of current location.
436
+ */
166
437
  id: number;
438
+ /**
439
+ * The status of current location.
440
+ */
167
441
  active: boolean;
442
+ /**
443
+ * The name of current location.
444
+ */
168
445
  name: string;
446
+ /**
447
+ * The type of current location.
448
+ */
169
449
  locationType?: string;
450
+ /**
451
+ * The primary address of current location.
452
+ */
170
453
  address1?: string;
454
+ /**
455
+ * Any extra information associated with the address (Apartment #, Suite #, Unit #, etc.).
456
+ */
171
457
  address2?: string;
458
+ /**
459
+ * The ZIP or postal code of the address.
460
+ */
172
461
  zip?: string;
462
+ /**
463
+ * The name of the city.
464
+ */
173
465
  city?: string;
466
+ /**
467
+ * TThe province or state of the address.
468
+ */
174
469
  province?: string;
470
+ /**
471
+ * The Country Code in ISO 3166-1 (alpha-2) format.
472
+ */
175
473
  countryCode?: string;
474
+ /**
475
+ * The country of the address.
476
+ */
176
477
  countryName?: string;
478
+ /**
479
+ * The phone number of the location.
480
+ */
177
481
  phone?: string;
178
482
  }
179
483
 
@@ -184,34 +488,162 @@ export interface MenuItemProperties {
184
488
  loading?: boolean | string;
185
489
  }
186
490
 
491
+ interface ModalApi extends Required<_ModalApi> {
492
+ }
493
+
494
+ interface _ModalApi {
495
+ /**
496
+ * Shows the modal element. An alternative to the `show` instance method on the `ui-modal` element.
497
+ * @param id A unique identifier for the Modal
498
+ */
499
+ show?(id: string): Promise<void>;
500
+ /**
501
+ * Hides the modal element. An alternative to the `hide` instance method on the `ui-modal` element.
502
+ * @param id A unique identifier for the Modal
503
+ */
504
+ hide?(id: string): Promise<void>;
505
+ /**
506
+ * Toggles the modal element visibility. An alternative to the `toggle` instance method on the `ui-modal` element.
507
+ * @param id A unique identifier for the Modal
508
+ */
509
+ toggle?(id: string): Promise<void>;
510
+ }
511
+
187
512
  type Money = string;
188
513
 
189
- interface Pos {
190
- cart: {
191
- fetch(): Promise<Cart>;
192
- subscribe(onSubscribe: CartSubscriber): Unsubscribe;
193
- setCustomer(customer: Customer): Promise<void>;
194
- removeCustomer(): Promise<void>;
195
- addAddress(address: Address): Promise<void>;
196
- updateAddress(index: number, address: Address): Promise<void>;
197
- applyCartDiscount(discount: Discount): Promise<void>;
198
- applyCartCodeDiscount(code: string): Promise<void>;
199
- removeCartDiscount(): Promise<void>;
200
- removeAllDiscounts(disableAutomaticDiscounts: boolean): Promise<void>;
201
- addCartProperties(properties: Record<string, string>): Promise<void>;
202
- removeCartProperties(properties: string[]): Promise<void>;
203
- clear(): Promise<void>;
204
- addLineItem(variantId: number, quantity: number): Promise<void>;
205
- updateLineItem(index: string, quantity: number): Promise<void>;
206
- removeLineItem(index: string): Promise<void>;
207
- setLineItemDiscount(index: number, discount: LineItemDiscount): Promise<void>;
208
- removeLineItemDiscount(index: number): Promise<void>;
209
- addLineItemProperties(index: number, properties: Record<string, string>): Promise<void>;
210
- removeLineItemProperties(index: number, properties: string[]): Promise<void>;
211
- };
212
- close(): Promise<void>;
213
- device(): Promise<Device>;
214
- location(): Promise<Location_2>;
514
+ interface PosApi {
515
+ cart: PosCart;
516
+ close: PosClose;
517
+ device: PosDevice;
518
+ location: PosLocation;
519
+ }
520
+
521
+ type PosCart = Required<_PosCart>;
522
+
523
+ interface _PosCart {
524
+ /**
525
+ * Fetch the current cart.
526
+ */
527
+ fetch?(): Promise<Cart>;
528
+ /**
529
+ * Subscribe the cart changes.
530
+ */
531
+ subscribe?(onSubscribe: CartSubscriber): Unsubscribe;
532
+ /**
533
+ * Add a new or existing customer to the cart.
534
+ */
535
+ setCustomer?(customer: Customer): Promise<void>;
536
+ /**
537
+ * Remove the current customer from the cart.
538
+ */
539
+ removeCustomer?(): Promise<void>;
540
+ /**
541
+ * Add a new address to a customer.
542
+ */
543
+ addAddress?(address: Address): Promise<void>;
544
+ /**
545
+ * Update an address for a customer.
546
+ */
547
+ updateAddress?(index: number, address: Address): Promise<void>;
548
+ /**
549
+ * Apply a percentage or fixed amount discount to the whole cart.
550
+ */
551
+ applyCartDiscount?(type: DiscountType, discountDescription: string, amount: string): Promise<void>;
552
+ /**
553
+ * Apply a code discount to the whole cart.
554
+ */
555
+ applyCartCodeDiscount?(code: string): Promise<void>;
556
+ /**
557
+ * Remove the discount applied to the whole cart.
558
+ */
559
+ removeCartDiscount?(): Promise<void>;
560
+ /**
561
+ * Clears all applied discounts from the cart and optionally disables automatic discounts.
562
+ */
563
+ removeAllDiscounts?(disableAutomaticDiscounts: boolean): Promise<void>;
564
+ /**
565
+ * Add properties for the cart.
566
+ */
567
+ addCartProperties?(properties: Record<string, string>): Promise<void>;
568
+ /**
569
+ * Remove properties from the cart.
570
+ */
571
+ removeCartProperties?(keys: string[]): Promise<void>;
572
+ /**
573
+ * Add custom sale for the cart.
574
+ */
575
+ addCustomSale?(customSale: CustomSale): Promise<void>;
576
+ /**
577
+ * Clear all contents from the cart.
578
+ */
579
+ clear?(): Promise<void>;
580
+ /**
581
+ * Add a product to the cart.
582
+ */
583
+ addLineItem?(variantId: number, quantity: number): Promise<void>;
584
+ /**
585
+ * Make changes to a line item in the cart.
586
+ */
587
+ updateLineItem?(uuid: string, quantity: number): Promise<void>;
588
+ /**
589
+ * Remove a line item in the cart.
590
+ */
591
+ removeLineItem?(uuid: string): Promise<void>;
592
+ /**
593
+ * Apply a discount to a line item.
594
+ */
595
+ setLineItemDiscount?(uuid: string, type: DiscountType, discountDescription: string, amount: string): Promise<void>;
596
+ /**
597
+ * Remove a discount from a line item.
598
+ */
599
+ removeLineItemDiscount?(uuid: string): Promise<void>;
600
+ /**
601
+ * Add properties to a line item.
602
+ */
603
+ addLineItemProperties?(uuid: string, properties: Record<string, string>): Promise<void>;
604
+ /**
605
+ * Remove properties from a line item.
606
+ */
607
+ removeLineItemProperties?(uuid: string, properties: string[]): Promise<void>;
608
+ }
609
+
610
+ type PosClose = () => Promise<void>;
611
+
612
+ type PosDevice = () => Promise<Device>;
613
+
614
+ type PosLocation = () => Promise<Location_2>;
615
+
616
+ interface POSUser {
617
+ /**
618
+ * The ID of the user's staff.
619
+ */
620
+ id?: number;
621
+ /**
622
+ * The user's first name.
623
+ */
624
+ firstName?: string;
625
+ /**
626
+ * The user's last name.
627
+ */
628
+ lastName?: string;
629
+ /**
630
+ * The user's email address.
631
+ */
632
+ email?: string;
633
+ /**
634
+ * The account access level of the logged-in user
635
+ */
636
+ accountAccess?: string;
637
+ /**
638
+ * The user's account type.
639
+ */
640
+ accountType?: string;
641
+ }
642
+
643
+ interface PrivilegedAdminUser extends AdminUser {
644
+ id?: number;
645
+ name?: string;
646
+ email?: string;
215
647
  }
216
648
 
217
649
  interface Product extends Resource {
@@ -298,19 +730,39 @@ interface Resource {
298
730
  id: string;
299
731
  }
300
732
 
733
+ type ResourcePickerApi = (options: ResourcePickerOptions) => Promise<SelectPayload<ResourcePickerOptions['type']> | undefined>;
734
+
301
735
  interface ResourcePickerOptions {
736
+ /**
737
+ * The type of resource you want to pick.
738
+ */
302
739
  type: 'product' | 'variant' | 'collection';
303
- query?: string;
304
- selectionIds?: BaseResource[];
740
+ /**
741
+ * The action verb appears in the title and as the primary action of the Resource Picker.
742
+ * @defaultValue 'add'
743
+ */
305
744
  action?: 'add' | 'select';
745
+ /**
746
+ * Filters for what resource to show.
747
+ */
748
+ filter?: Filters;
749
+ /**
750
+ * Whether to allow selecting multiple items of a specific type or not. If a number is provided, then limit the selections to a maximum of that number of items. When type is Product, the user may still select multiple variants of a single product, even if multiple is false.
751
+ * @defaultValue false
752
+ */
306
753
  multiple?: boolean | number;
307
- filter?: {
308
- hidden?: boolean;
309
- variants?: boolean;
310
- draft?: boolean | undefined;
311
- archived?: boolean | undefined;
312
- query?: string;
313
- };
754
+ /**
755
+ * GraphQL initial search query for filtering resources available in the picker. See [search syntax](https://shopify.dev/docs/api/usage/search-syntax) for more information.
756
+ * This is displayed in the search bar when the picker is opened and can be edited by users.
757
+ * For most use cases, you should use the `filter.query` option instead which doesn't show the query in the UI.
758
+ * @defaultValue ''
759
+ */
760
+ query?: string;
761
+ /**
762
+ * Resources that should be preselected when the picker is opened.
763
+ * @defaultValue []
764
+ */
765
+ selectionIds?: BaseResource[];
314
766
  }
315
767
 
316
768
  type ResourceSelection<Type extends keyof ResourceTypes> = ResourceTypes[Type];
@@ -326,6 +778,35 @@ interface RuleSet {
326
778
  rules: CollectionRule[];
327
779
  }
328
780
 
781
+ interface SaveBarApi extends Required<_SaveBarApi> {
782
+ }
783
+
784
+ interface _SaveBarApi {
785
+ /**
786
+ * Shows the save bar element. An alternative to the `show` instance method on the `ui-save-bar` element.
787
+ * @param id A unique identifier for the save bar
788
+ */
789
+ show?(id: string): Promise<void>;
790
+ /**
791
+ * Hides the save bar element. An alternative to the `hide` instance method on the `ui-save-bar` element.
792
+ * @param id A unique identifier for the save bar
793
+ */
794
+ hide?(id: string): Promise<void>;
795
+ /**
796
+ * Toggles the save bar element visibility. An alternative to the `toggle` instance method on the `ui-save-bar` element.
797
+ * @param id A unique identifier for the save bar
798
+ */
799
+ toggle?(id: string): Promise<void>;
800
+ /**
801
+ * Show leave confirmation dialog if necessary. This promise is resolved when there is no visible save bar or user confirms to leave.
802
+ */
803
+ leaveConfirmation?(): Promise<void>;
804
+ }
805
+
806
+ interface ScannerApi {
807
+ capture(): Promise<ScannerPayload>;
808
+ }
809
+
329
810
  interface ScannerPayload {
330
811
  data: string;
331
812
  }
@@ -336,106 +817,305 @@ export interface ShopifyGlobal {
336
817
  config: AppBridgeConfig;
337
818
  origin: string;
338
819
  ready: Promise<void>;
339
- environment: Environment;
340
- loading(isLoading?: boolean): void;
341
- idToken(): Promise<string>;
342
- user(): Promise<User>;
343
- toast: {
344
- show(message: string, opts?: Partial<ToastOptions>): string;
345
- hide(id: string): void;
346
- };
347
- resourcePicker<Options extends ResourcePickerOptions>(options: Options): Promise<SelectPayload<Options['type']> | undefined>;
348
- scanner: {
349
- capture(): Promise<ScannerPayload>;
350
- };
351
- modal: {
352
- show(id: string): Promise<void>;
353
- hide(id: string): Promise<void>;
354
- toggle(id: string): Promise<void>;
355
- };
356
- saveBar: {
357
- show(id: string): Promise<void>;
358
- hide(id: string): Promise<void>;
359
- toggle(id: string): Promise<void>;
360
- leaveConfirmation(): Promise<void>;
361
- };
362
- pos: Pos;
820
+ environment: EnvironmentApi;
821
+ loading: LoadingApi;
822
+ idToken: IdTokenApi;
823
+ user: UserApi;
824
+ toast: ToastApi;
825
+ resourcePicker: ResourcePickerApi;
826
+ scanner: ScannerApi;
827
+ modal: ModalApi;
828
+ saveBar: SaveBarApi;
829
+ pos: PosApi;
830
+ intents: IntentsApi;
363
831
  }
364
832
 
833
+ /**
834
+ * The Toast API provides methods to display Toast notifications in the Shopify admin.
835
+ */
836
+ interface ToastApi {
837
+ /**
838
+ * Displays a Toast notification in the Shopify admin.
839
+ *
840
+ * @param message - The message to be displayed in the Toast notification.
841
+ * @param opts - Options for the Toast notification.
842
+ *
843
+ * @returns The ID of the Toast notification.
844
+ */
845
+ show: ToastShow;
846
+ /**
847
+ * Hides a Toast notification in the Shopify admin.
848
+ *
849
+ * @param id - The ID of the Toast notification to be hidden.
850
+ */
851
+ hide: ToastHide;
852
+ }
853
+
854
+ type ToastHide = (id: string) => void;
855
+
365
856
  interface ToastOptions {
366
- duration: number;
367
- isError: boolean;
368
- action: string;
369
- onAction: () => void;
370
- onDismiss: () => void;
857
+ /**
858
+ * The length of time in milliseconds the toast message should persist.
859
+ * @defaultValue 5000
860
+ */
861
+ duration?: number;
862
+ /**
863
+ * Display an error-styled toast.
864
+ * @defaultValue false
865
+ */
866
+ isError?: boolean;
867
+ /**
868
+ * Content of an action button.
869
+ */
870
+ action?: string;
871
+ /**
872
+ * Callback fired when the action button is clicked.
873
+ */
874
+ onAction?: () => void;
875
+ /**
876
+ * Callback fired when the dismiss icon is clicked
877
+ */
878
+ onDismiss?: () => void;
879
+ }
880
+
881
+ type ToastShow = (message: string, opts?: ToastOptions) => string;
882
+
883
+ export interface UIModalAttributes extends _UIModalAttributes {
884
+ children?: any;
371
885
  }
372
886
 
373
- export interface UIModalAttributes {
887
+ interface _UIModalAttributes {
888
+ /**
889
+ * A unique identifier for the Modal
890
+ */
374
891
  id?: string;
375
- variant?: Variant;
892
+ /**
893
+ * The size of the modal.
894
+ *
895
+ * Before the Modal is shown, this can be changed to any of the provided values.
896
+ * After the Modal is shown, this can can only be changed between `small`, `base`, and `large`.
897
+ *
898
+ * @defaultValue "base"
899
+ */
900
+ variant?: 'small' | 'base' | 'large' | 'max';
901
+ /**
902
+ * The URL of the content to display within a Modal.
903
+ * If provided, the Modal will display the content from the provided URL
904
+ * and any children other than the [ui-title-bar](/docs/api/app-bridge-library/web-components/ui-title-bar)
905
+ * and [ui-save-bar](/docs/api/app-bridge-library/web-components/ui-save-bar) elements will be ignored.
906
+ */
376
907
  src?: string;
377
- children?: any;
908
+ /**
909
+ * The content to display within a Modal.
910
+ * You can provide a single HTML element with children
911
+ * and the [ui-title-bar](/docs/api/app-bridge-library/web-components/ui-title-bar)
912
+ * element to configure the Modal title bar.
913
+ */
914
+ children?: HTMLCollection & UITitleBarAttributes;
378
915
  }
379
916
 
380
- interface UIModalElement_2 extends Omit<HTMLElement, 'addEventListener' | 'removeEventListener'> {
381
- variant: Variant;
917
+ interface _UIModalElement {
918
+ /**
919
+ * A getter/setter that is used to set modal variant.
920
+ */
921
+ variant?: Variant;
922
+ /**
923
+ * A getter/setter that is used to get the DOM content of the modal
924
+ * element and update the content after the modal has been opened.
925
+ */
382
926
  content?: HTMLElement;
927
+ /**
928
+ * A getter/setter that is used to set modal src.
929
+ */
383
930
  src?: string;
931
+ /**
932
+ * A getter that is used to get the Window object of the modal iframe
933
+ * when the modal is used with a `src` attribute. This can only be
934
+ * accessed when the modal is open, so it is recommended to use `await modal.show()`
935
+ * before accessing this property.
936
+ */
384
937
  readonly contentWindow?: Window | null;
385
- show(): Promise<void>;
386
- hide(): Promise<void>;
387
- toggle(): Promise<void>;
388
- addEventListener(type: 'show' | 'hide', listener: EventListenerOrEventListenerObject): void;
389
- removeEventListener(type: 'show' | 'hide', listener: EventListenerOrEventListenerObject): void;
938
+ /**
939
+ * Shows the save bar element
940
+ */
941
+ show?(): Promise<void>;
942
+ /**
943
+ * Hides the save bar element
944
+ */
945
+ hide?(): Promise<void>;
946
+ /**
947
+ * Toggles the save bar element between the showing and hidden states
948
+ */
949
+ toggle?(): Promise<void>;
950
+ /**
951
+ * Add 'show' | 'hide' event listeners.
952
+ * @param type An event name
953
+ * @param listener A callback triggered when the event name happens
954
+ */
955
+ addEventListener?(type: 'show' | 'hide', listener: EventListenerOrEventListenerObject): void;
956
+ /**
957
+ * Remove 'show' | 'hide' event listeners.
958
+ * @param type An event name
959
+ * @param listener A callback to be removed
960
+ */
961
+ removeEventListener?(type: 'show' | 'hide', listener: EventListenerOrEventListenerObject): void;
962
+ }
963
+
964
+ interface UIModalElement_2 extends Omit<HTMLElement, 'addEventListener' | 'removeEventListener'>, Required<Omit<_UIModalElement, 'content' | 'src' | 'contentWindow'>>, Pick<_UIModalElement, 'content' | 'src' | 'contentWindow'> {
390
965
  }
391
966
  export type { UIModalElement_2 as UIModalElement }
392
967
 
393
- export interface UINavMenuAttributes {
968
+ export interface UINavMenuAttributes extends _UINavMenuAttributes {
394
969
  children?: any;
395
970
  }
396
971
 
972
+ interface _UINavMenuAttributes {
973
+ children?: [UINavMenuFirstChild, ...UINavMenuChildren[]];
974
+ }
975
+
976
+ interface UINavMenuChildren {
977
+ a?: {
978
+ href: string;
979
+ children: string;
980
+ };
981
+ }
982
+
397
983
  interface UINavMenuElement_2 extends HTMLElement {
398
984
  }
399
985
  export type { UINavMenuElement_2 as UINavMenuElement }
400
986
 
401
- export interface UISaveBarAttributes {
987
+ interface UINavMenuFirstChild {
988
+ a: {
989
+ rel: 'home';
990
+ href: string;
991
+ children?: string;
992
+ };
993
+ }
994
+
995
+ export interface UISaveBarAttributes extends _UISaveBarAttributes {
996
+ children?: any;
997
+ }
998
+
999
+ interface _UISaveBarAttributes {
1000
+ /**
1001
+ * A unique identifier for the save bar
1002
+ */
402
1003
  id?: string;
1004
+ /**
1005
+ * Whether to show a confirmation dialog when the discard button is clicked
1006
+ */
403
1007
  discardConfirmation?: boolean;
404
- children?: any;
1008
+ /**
1009
+ * HTML `<button>` elements to hook into the Save
1010
+ * and Discard buttons of the contextual save bar.
1011
+ *
1012
+ * The button with variant `primary` is the Save button
1013
+ * and the button without a variant is the Discard button.
1014
+ */
1015
+ children?: UISaveBarChildren;
1016
+ }
1017
+
1018
+ interface UISaveBarChildren {
1019
+ button?: {
1020
+ id?: string;
1021
+ class?: string;
1022
+ children?: string;
1023
+ disabled?: boolean;
1024
+ loading?: boolean;
1025
+ name?: string;
1026
+ onclick?: string;
1027
+ variant?: 'primary';
1028
+ };
405
1029
  }
406
1030
 
407
- interface UISaveBarElement_2 extends Omit<HTMLElement, 'addEventListener' | 'removeEventListener'> {
1031
+ interface _UISaveBarElement {
1032
+ /**
1033
+ * A getter/setter that is used to set discard confirmation.
1034
+ */
408
1035
  discardConfirmation?: boolean;
409
- show(): Promise<void>;
410
- hide(): Promise<void>;
411
- toggle(): Promise<void>;
412
- addEventListener(type: 'show' | 'hide', listener: EventListenerOrEventListenerObject): void;
413
- removeEventListener(type: 'show' | 'hide', listener: EventListenerOrEventListenerObject): void;
1036
+ /**
1037
+ * A getter that is used to check if save bar is showing.
1038
+ */
1039
+ readonly showing?: boolean;
1040
+ /**
1041
+ * Shows the save bar element.
1042
+ */
1043
+ show?(): Promise<void>;
1044
+ /**
1045
+ * Hides the save bar element.
1046
+ */
1047
+ hide?(): Promise<void>;
1048
+ /**
1049
+ * Toggles the save bar element between the showing and hidden states.
1050
+ */
1051
+ toggle?(): Promise<void>;
1052
+ /**
1053
+ * Add 'show' | 'hide' event listeners.
1054
+ * @param type An event name
1055
+ * @param listener A callback triggered when the event name happens
1056
+ */
1057
+ addEventListener?(type: 'show' | 'hide', listener: EventListenerOrEventListenerObject): void;
1058
+ /**
1059
+ * Remove 'show' | 'hide' event listeners.
1060
+ * @param type An event name
1061
+ * @param listener A callback to be removed
1062
+ */
1063
+ removeEventListener?(type: 'show' | 'hide', listener: EventListenerOrEventListenerObject): void;
1064
+ }
1065
+
1066
+ interface UISaveBarElement_2 extends Omit<HTMLElement, 'addEventListener' | 'removeEventListener'>, Required<_UISaveBarElement> {
414
1067
  }
415
1068
  export type { UISaveBarElement_2 as UISaveBarElement }
416
1069
 
417
- export interface UITitleBarAttributes {
418
- title?: string;
1070
+ export interface UITitleBarAttributes extends _UITitleBarAttributes {
419
1071
  children?: any;
420
1072
  }
421
1073
 
422
- interface UITitleBarElement_2 extends HTMLElement {
423
- title: string;
1074
+ interface _UITitleBarAttributes {
1075
+ /**
1076
+ * The title of the title bar. Can also be set via <code>document.title</code>.
1077
+ */
1078
+ title?: string;
1079
+ /**
1080
+ * The children of the title bar.
1081
+ */
1082
+ children?: UITitleBarChildren;
1083
+ }
1084
+
1085
+ interface UITitleBarChildren {
1086
+ a?: BaseElementAttributes & {
1087
+ variant?: 'breadcrumb' | 'primary';
1088
+ };
1089
+ button?: BaseElementAttributes & {
1090
+ variant?: 'breadcrumb' | 'primary';
1091
+ tone?: 'critical' | 'default';
1092
+ };
1093
+ section?: {
1094
+ label?: string;
1095
+ children?: {
1096
+ a?: BaseElementAttributes;
1097
+ button?: BaseElementAttributes;
1098
+ };
1099
+ };
1100
+ }
1101
+
1102
+ interface UITitleBarElement_2 extends Omit<HTMLElement, 'title'> {
424
1103
  }
425
1104
  export type { UITitleBarElement_2 as UITitleBarElement }
426
1105
 
1106
+ /**
1107
+ * Callback to unsubscribe
1108
+ */
427
1109
  type Unsubscribe = () => void;
428
1110
 
429
- interface User {
430
- id: string;
431
- name: string;
432
- firstName?: string;
433
- lastName?: string;
434
- email: string;
435
- accountAccess: string;
436
- accountType: string;
1111
+ export interface UseAppBridge {
437
1112
  }
438
1113
 
1114
+ interface User extends PrivilegedAdminUser, AdminUser, POSUser {
1115
+ }
1116
+
1117
+ type UserApi = () => Promise<User>;
1118
+
439
1119
  type Variant = 'small' | 'base' | 'large' | 'max';
440
1120
 
441
1121
  enum WeightUnit {