yt-uikit 0.9.13 → 0.9.15-loyalty-patch.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 (123) hide show
  1. package/README.md +94 -94
  2. package/dist/esm/atoms/bundleBuilderProductDetailsAtom.d.ts +4 -4
  3. package/dist/esm/atoms/cartDataAtom.d.ts +3 -3
  4. package/dist/esm/atoms/cartLoadingAtom.d.ts +22 -22
  5. package/dist/esm/atoms/cartTimer.d.ts +2 -2
  6. package/dist/esm/atoms/dateAtom.d.ts +1 -1
  7. package/dist/esm/atoms/freebieClaimModalAtom.d.ts +7 -7
  8. package/dist/esm/atoms/giftWrap.d.ts +2 -2
  9. package/dist/esm/atoms/gstCompanyNameAtom.d.ts +1 -1
  10. package/dist/esm/atoms/gstInputAtom.d.ts +1 -1
  11. package/dist/esm/atoms/maxQtyErrorAtom.d.ts +3 -3
  12. package/dist/esm/atoms/multiClaimSelectionAtom.d.ts +25 -25
  13. package/dist/esm/atoms/noteInputAtom.d.ts +3 -3
  14. package/dist/esm/atoms/postalCodeAtom.d.ts +1 -1
  15. package/dist/esm/atoms/shippingAtom.d.ts +8 -8
  16. package/dist/esm/atoms/showGSTInputAtom.d.ts +1 -1
  17. package/dist/esm/atoms/variantSelectionModalAtom.d.ts +25 -25
  18. package/dist/esm/components/BundleBlock/Bundle.d.ts +446 -446
  19. package/dist/esm/components/BundleBlock/BundleBuilder/BundleBuilder.d.ts +50 -50
  20. package/dist/esm/components/BundleBlock/BundleBuilder/ResponsiveBgImage.d.ts +9 -9
  21. package/dist/esm/components/BundleBlock/BundleBuilder/SortAndFilter.d.ts +74 -74
  22. package/dist/esm/components/BundleBlock/BundleBuilder/VariantOptionsModal.d.ts +28 -28
  23. package/dist/esm/components/BundleBlock/BundleBuilder/bundleBuilder.style.d.ts +37 -37
  24. package/dist/esm/components/BundleBlock/BundleBuilderTracker/BundleBuilderTracker.d.ts +55 -55
  25. package/dist/esm/components/BundleBlock/BundleBuilderTracker/bundleBuilderTracker.style.d.ts +77 -77
  26. package/dist/esm/components/BundleBlock/BundleProductDetailsModal/BundleProductDetailsModal.d.ts +37 -37
  27. package/dist/esm/components/BundleBlock/BundleProductDetailsModal/bundleProductDetailsModal.style.d.ts +10 -10
  28. package/dist/esm/components/BundleBlock/CollectionBundle/CategoryFilter.d.ts +10 -10
  29. package/dist/esm/components/BundleBlock/CollectionBundle/ColllectionBundle.d.ts +127 -127
  30. package/dist/esm/components/BundleBlock/CollectionBundle/ProductDetailsModal.d.ts +16 -16
  31. package/dist/esm/components/BundleBlock/ComboBundle.d.ts +17 -17
  32. package/dist/esm/components/BundleBlock/FixedBundle/FixedBundle.d.ts +4 -4
  33. package/dist/esm/components/BundleBlock/FixedBundle/SeparateVariantOptions.d.ts +45 -45
  34. package/dist/esm/components/BundleBlock/FixedBundle/VariantSelectorModal.d.ts +22 -22
  35. package/dist/esm/components/BundleBlock/FixedBundle/fixedBundle.style.d.ts +80 -80
  36. package/dist/esm/components/BundleBlock/Loader.d.ts +5 -5
  37. package/dist/esm/components/BundleBlock/MixAndMatchBundle/MixAndMatchBundle.d.ts +9 -9
  38. package/dist/esm/components/BundleBlock/MixAndMatchBundle/mixAndMatchBundle.style.d.ts +86 -86
  39. package/dist/esm/components/BundleBlock/PersonalizationForm/PersonalizationForm.d.ts +35 -35
  40. package/dist/esm/components/BundleBlock/PersonalizationForm/PersonalizationFormModal.d.ts +24 -24
  41. package/dist/esm/components/BundleBlock/VolumeBundle/VolumeBundle.d.ts +27 -27
  42. package/dist/esm/components/BundleBlock/VolumeBundle/volumeBundle.style.d.ts +80 -80
  43. package/dist/esm/components/BundleBlock/index.d.ts +1 -1
  44. package/dist/esm/components/Cart/ApplyCoupon.d.ts +13 -13
  45. package/dist/esm/components/Cart/Bundle.d.ts +6 -6
  46. package/dist/esm/components/Cart/Cart.d.ts +246 -246
  47. package/dist/esm/components/Cart/CartDrawer.d.ts +26 -26
  48. package/dist/esm/components/Cart/CartOffersCarousel.d.ts +48 -48
  49. package/dist/esm/components/Cart/CartProductsList.d.ts +45 -45
  50. package/dist/esm/components/Cart/CartTimer.d.ts +8 -8
  51. package/dist/esm/components/Cart/CheckoutSection.d.ts +47 -47
  52. package/dist/esm/components/Cart/CouponSelection.d.ts +17 -17
  53. package/dist/esm/components/Cart/DatePicker.d.ts +10 -10
  54. package/dist/esm/components/Cart/EmptyCart.d.ts +33 -33
  55. package/dist/esm/components/Cart/FloatingCart.d.ts +24 -24
  56. package/dist/esm/components/Cart/FooterSections.d.ts +6 -6
  57. package/dist/esm/components/Cart/FreebieClaimManager.d.ts +17 -17
  58. package/dist/esm/components/Cart/FreebieClaimOverlay.d.ts +17 -17
  59. package/dist/esm/components/Cart/FreebieClaimOverlayCard.d.ts +10 -10
  60. package/dist/esm/components/Cart/FreebieClaimSection.d.ts +17 -17
  61. package/dist/esm/components/Cart/FreebieClaimSectionCard.d.ts +16 -16
  62. package/dist/esm/components/Cart/GSTSection.d.ts +15 -15
  63. package/dist/esm/components/Cart/GiftWrap.d.ts +15 -15
  64. package/dist/esm/components/Cart/InlineCartOfferInfoText.d.ts +10 -10
  65. package/dist/esm/components/Cart/LoyaltyAppliedCTA.d.ts +19 -19
  66. package/dist/esm/components/Cart/LoyaltyApplyCTA.d.ts +18 -18
  67. package/dist/esm/components/Cart/LoyaltyBadge.d.ts +10 -10
  68. package/dist/esm/components/Cart/LoyaltyGuestCTA.d.ts +17 -17
  69. package/dist/esm/components/Cart/MultiStepProgressBar/CheckpointConfetti.d.ts +11 -11
  70. package/dist/esm/components/Cart/MultiStepProgressBar/CheckpointIcon.d.ts +3 -3
  71. package/dist/esm/components/Cart/MultiStepProgressBar/CheckpointTooltip.d.ts +3 -3
  72. package/dist/esm/components/Cart/MultiStepProgressBar/MultiStepIcon.d.ts +9 -9
  73. package/dist/esm/components/Cart/MultiStepProgressBar/MultiStepProgressBar.d.ts +5 -5
  74. package/dist/esm/components/Cart/MultiStepProgressBar/MultiStepProgressBar.styled.d.ts +45 -45
  75. package/dist/esm/components/Cart/MultiStepProgressBar/MultiStepUtils.d.ts +6 -6
  76. package/dist/esm/components/Cart/MultiStepProgressBar/MultiTierProgressBar.d.ts +4 -4
  77. package/dist/esm/components/Cart/MultiStepProgressBar/MutiTierNextRewardMessage.d.ts +3 -3
  78. package/dist/esm/components/Cart/MultiStepProgressBar/NextRewardMessage.d.ts +3 -3
  79. package/dist/esm/components/Cart/MultiStepProgressBar/SingleTierProgressBar.d.ts +4 -4
  80. package/dist/esm/components/Cart/MultiStepProgressBar/SingleTierProgressBar.styled.d.ts +22 -22
  81. package/dist/esm/components/Cart/MultiStepProgressBar/SingletTierNextRewardMessage.d.ts +3 -3
  82. package/dist/esm/components/Cart/MultiStepProgressBar/types.d.ts +55 -55
  83. package/dist/esm/components/Cart/NextFreebieRow.d.ts +19 -19
  84. package/dist/esm/components/Cart/NoteSection.d.ts +8 -8
  85. package/dist/esm/components/Cart/ProductCard.d.ts +30 -30
  86. package/dist/esm/components/Cart/ProductRecCard.d.ts +20 -20
  87. package/dist/esm/components/Cart/ProductRecList.d.ts +23 -23
  88. package/dist/esm/components/Cart/ProgressBarCartLoader.d.ts +7 -7
  89. package/dist/esm/components/Cart/QuantitySelector.d.ts +12 -12
  90. package/dist/esm/components/Cart/RegionSpecificDelivery.d.ts +17 -17
  91. package/dist/esm/components/Cart/RewardPointsPreview.d.ts +10 -10
  92. package/dist/esm/components/Cart/StandardDelivery.d.ts +11 -11
  93. package/dist/esm/components/Cart/StealDealSection.d.ts +14 -14
  94. package/dist/esm/components/Cart/StickyCart.d.ts +64 -64
  95. package/dist/esm/components/Cart/SubtotalSection.d.ts +13 -13
  96. package/dist/esm/components/Cart/VariantSelectionPopup/DesktopVariantPopup.d.ts +19 -19
  97. package/dist/esm/components/Cart/VariantSelectionPopup/DesktopVariantPopup.styled.d.ts +60 -60
  98. package/dist/esm/components/Cart/VariantSelectionPopup/MobileVariantPopover.d.ts +19 -19
  99. package/dist/esm/components/Cart/index.d.ts +1 -1
  100. package/dist/esm/components/Loyalty/Loader.d.ts +10 -10
  101. package/dist/esm/components/Loyalty/LoyaltyProductCatalog.d.ts +60 -60
  102. package/dist/esm/components/Loyalty/index.d.ts +2 -2
  103. package/dist/esm/components/LoyaltyPageBlock/LoyaltyPageBlock.d.ts +64 -64
  104. package/dist/esm/components/Nudge/LeadGenerationNudge.d.ts +15 -15
  105. package/dist/esm/components/Nudge/Nudge.d.ts +40 -40
  106. package/dist/esm/components/Nudge/index.d.ts +1 -1
  107. package/dist/esm/components/ProductOffersBlock/ProductOffersCoupon.d.ts +12 -12
  108. package/dist/esm/components/ProductOffersBlock/ProductOffersList.d.ts +12 -12
  109. package/dist/esm/components/ProductOffersBlock/ProductOffersTermsMobilePopover.d.ts +10 -10
  110. package/dist/esm/components/ProductOffersBlock/ProductOffersTermsPopup.d.ts +10 -10
  111. package/dist/esm/components/ProductOffersBlock/ProductsOffers.d.ts +42 -42
  112. package/dist/esm/components/SpinnerWheel/SpinnerWheel.d.ts +23 -23
  113. package/dist/esm/components/SpinnerWheel/WheelSection.d.ts +9 -9
  114. package/dist/esm/components/SpinnerWheel/index.d.ts +1 -1
  115. package/dist/esm/components/index.d.ts +9 -9
  116. package/dist/esm/index.d.ts +1 -1
  117. package/dist/esm/index.js +97 -97
  118. package/dist/esm/utils/converter.d.ts +2 -2
  119. package/dist/esm/utils/customVariantOptions.d.ts +20 -20
  120. package/dist/esm/utils/freebieProductUtils.d.ts +28 -28
  121. package/dist/esm/utils/freebieUtils.d.ts +5 -5
  122. package/dist/esm/utils/index.d.ts +14 -14
  123. package/package.json +96 -96
@@ -1,446 +1,446 @@
1
- import React from "react";
2
- import "./bundle.scss";
3
- interface ShopifyCurrency {
4
- rate: number;
5
- active: string;
6
- }
7
- declare global {
8
- interface Window {
9
- Shopify?: {
10
- currency?: ShopifyCurrency;
11
- shop?: string;
12
- };
13
- }
14
- }
15
- type ProductImage = {
16
- url: string;
17
- height: number;
18
- width: number;
19
- altText?: string;
20
- };
21
- type ProductFeaturedMedia = {
22
- alt: string;
23
- preview: {
24
- image: {
25
- url: string;
26
- height?: number;
27
- width?: number;
28
- altText: string;
29
- };
30
- };
31
- };
32
- type ProductOption = {
33
- id: string;
34
- name: string;
35
- values: string[];
36
- };
37
- type CollectionNode = {
38
- node: {
39
- id: string;
40
- title: string;
41
- handle: string;
42
- };
43
- };
44
- export type VariantNode = {
45
- node: {
46
- id: string;
47
- price: string;
48
- compareAtPrice: string;
49
- title: string;
50
- displayName: string;
51
- image: ProductImage;
52
- availableForSale: boolean;
53
- inventoryQuantity: number;
54
- inventoryItem?: {
55
- tracked?: boolean;
56
- };
57
- inventoryPolicy?: "deny" | "continue";
58
- };
59
- };
60
- type SelectedVariantDetails = {
61
- id: string;
62
- price: string;
63
- compareAtPrice: string;
64
- title: string;
65
- displayName: string;
66
- image: ProductImage;
67
- availableForSale: boolean;
68
- inventoryQuantity: number;
69
- };
70
- export type VariantOptions = {
71
- shop: string;
72
- options: {
73
- name: string;
74
- type: "text" | "image" | "color";
75
- values: {
76
- name: string;
77
- value: string;
78
- }[];
79
- }[];
80
- createdAt: string;
81
- updatedAt: string;
82
- };
83
- export type ProductDetails = {
84
- id: string;
85
- title: string;
86
- handle: string;
87
- featuredMedia: ProductFeaturedMedia;
88
- status: "active" | "archived" | "draft" | "unlisted" | "";
89
- options: ProductOption[];
90
- onlineStoreUrl: string;
91
- tracksInventory?: boolean;
92
- publishedAt?: string | null;
93
- collections: {
94
- edges: CollectionNode[];
95
- };
96
- variants: {
97
- edges: VariantNode[];
98
- };
99
- shop: string;
100
- metafield?: {
101
- key: string;
102
- namespace: string;
103
- ownerType: string;
104
- value: string;
105
- id: string;
106
- jsonValue: string[];
107
- type: string;
108
- };
109
- descriptionHtml: string;
110
- media: {
111
- edges: {
112
- node: {
113
- alt: string;
114
- preview: {
115
- image: {
116
- altText: string;
117
- width?: number;
118
- height?: number;
119
- url: string;
120
- };
121
- };
122
- image: {
123
- altText: string;
124
- height: number;
125
- width: number;
126
- url: string;
127
- };
128
- };
129
- }[];
130
- };
131
- selectedVariant?: SelectedVariantDetails;
132
- rating?: {
133
- averageRating: number;
134
- ratingCount: number;
135
- };
136
- };
137
- export type ProductData = {
138
- productId: string;
139
- variantIds: string[];
140
- productDetails: ProductDetails;
141
- };
142
- type GeneralStyle = {
143
- primaryColor: string;
144
- primaryContrastColor: string;
145
- secondaryColor: string;
146
- secondaryContrastColor: string;
147
- imageAspectRatio: string;
148
- ctaBackgroundColor: string;
149
- ctaTextColor: string;
150
- ctaBorderColor: string;
151
- ctaShadowType: string;
152
- ctaPadding: string;
153
- ctaWidth: string;
154
- ctaBorderRadius: string;
155
- ctaHoverBackgroundColor: string;
156
- ctaHoverTextColor: string;
157
- customizeHoverState: boolean;
158
- checkoutPartner: string;
159
- redirectToPDP: boolean;
160
- restrictCOD: boolean;
161
- trackInventory: boolean;
162
- showOutOfStockProducts: boolean;
163
- outOfStockLabel: string;
164
- disabledButtonColor: string;
165
- storeCurrency: string;
166
- currencySymbol: string;
167
- discountPrefix: string;
168
- discountSuffix: string;
169
- addOrderTags: boolean;
170
- addOrderNotes: boolean;
171
- variantTitleSuffix: boolean;
172
- titleLength: string;
173
- showDecimalsInBundlePricing?: boolean;
174
- showPaymentIcons?: boolean;
175
- };
176
- type VolumeStyle = {
177
- addtoCartMethod: string;
178
- titleFontSize: string;
179
- subtitleFontSize: string;
180
- titleBackgroundColor: string;
181
- titleTextColor: string;
182
- verticalMargin: string;
183
- sectionBackgroundColor: string;
184
- cardStyle: string;
185
- discountBadgeVisibility: string;
186
- tierPriceType: "none" | "unit-price" | "tier-price";
187
- allowVariantSelection: string;
188
- variantSelectorType: string;
189
- ctaTitle: string;
190
- bundleRedirection: string;
191
- discountBadgeDisplay: string;
192
- discountDisplayType: string;
193
- showVariantOptionsLabel: boolean;
194
- };
195
- type ComboStyle = {
196
- productTitleFontSize: string;
197
- productDescriptionFontSize: string;
198
- descriptionTextColor: string;
199
- titleTextColor: string;
200
- verticalMargin: string;
201
- infoAlignment: string;
202
- ctaTitle: string;
203
- bundleRedirection: string;
204
- embedContentVisibility: boolean;
205
- mixAndMatchCardStyle: string;
206
- mixAndMatchVariantTypeSelector: string;
207
- comboCardStyle: string;
208
- comboVariantTypeSelector: string;
209
- selectedEmbedContentVisibilityOptions: string[];
210
- subProductsSectionVisibility: boolean;
211
- subProductsImageVisibility: boolean;
212
- subProductsProductTitleVisibility: boolean;
213
- subProductsProductPriceVisibility: boolean;
214
- discountBadgeVisibility?: boolean;
215
- discountBadgeDisplay?: "discount-on-compare" | "discount-on-price";
216
- };
217
- type ByobStyle = {
218
- titleFontSize: string;
219
- subtitleFontSize: string;
220
- titleBackgroundColor: string;
221
- titleTextColor: string;
222
- productTitleFontSize: string;
223
- showVariantTitleInCard: boolean;
224
- productVariantTitleType: "product-title" | "variant-title" | "variant-display-name";
225
- productTitleWrapLines: string;
226
- productCardDetailsAlignment: "left" | "center" | "right";
227
- sectionBackgroundColor: string;
228
- lazyLoadWidget: string;
229
- listingsGap: string;
230
- footerMargin: string;
231
- borderRadius: string;
232
- borderColor: string;
233
- cardBackgroundColor: string;
234
- shadowType: string;
235
- addToBundleCTAText: string;
236
- checkoutCTAText: string;
237
- variantSelectorType: string;
238
- primaryVariant: string;
239
- productsPriceVisibility: boolean;
240
- compareAtPriceVisibility: boolean;
241
- selectedProductsVisibility: boolean;
242
- bundleRedirection: string;
243
- enableConfetti: boolean;
244
- selectedItemVisibility: boolean;
245
- productTiersVisibility: boolean;
246
- tierNavigation: boolean;
247
- enableProductCategories: boolean;
248
- productCardCategoryVisibility: string;
249
- categoryFilterOnPage: string;
250
- productFiltersDisplay: "none" | "drawer" | "sidebar";
251
- filtersProvider: "based-on-products-data" | "search-and-discovery-app-sync";
252
- selectedFilterOptions: string[];
253
- };
254
- type FixedStyle = {
255
- titleFontSize: string;
256
- subtitleFontSize: string;
257
- titleBackgroundColor: string;
258
- titleTextColor: string;
259
- verticalMargin: string;
260
- sectionBackgroundColor: string;
261
- borderRadius: string;
262
- borderColor: string;
263
- cardBackgroundColor: string;
264
- shadowType: string;
265
- infoAlignment: string;
266
- ctaTitle: string;
267
- bundleRedirection: string;
268
- cardLayoutStyle: string;
269
- variantSelectorType: string;
270
- productsPriceVisibility: boolean;
271
- compareAtPriceVisibility: boolean;
272
- discountBadgeVisibility?: boolean;
273
- discountBadgeDisplay?: "discount-on-compare" | "discount-on-price";
274
- };
275
- export type Customizations = {
276
- shop?: string;
277
- general: GeneralStyle;
278
- byob: ByobStyle;
279
- fixedBundle: FixedStyle;
280
- volumeBundle: VolumeStyle;
281
- comboBundle: ComboStyle;
282
- createdAt?: string;
283
- updatedAt?: string;
284
- };
285
- export type ProductTier = {
286
- tier: number;
287
- title: string;
288
- minimumQuantity: number;
289
- isFixed?: boolean;
290
- isFreebieTier?: boolean;
291
- products: {
292
- productId: string;
293
- variantIds: string[];
294
- }[];
295
- };
296
- export type BundlePayload = {
297
- _id: string;
298
- showIndividualProductSelector: boolean;
299
- title?: string;
300
- subtitle?: string;
301
- products: ProductData[];
302
- percentageOff?: number;
303
- dealAmount?: number;
304
- amountOff?: number;
305
- type: "fixed" | "builder" | "volume" | "mixAndMatch" | "" | "combo" | "collection";
306
- minimumQuantity: number;
307
- showProductDetailsInTracker: boolean;
308
- coverImageUrl?: string;
309
- mobileCoverImageUrl?: string;
310
- titleSectionTextColor?: string;
311
- titleSectionBackgroundColor?: string;
312
- dealTextColor?: string;
313
- showBorder?: boolean;
314
- hideProductDetails?: boolean;
315
- cornerRadiusType?: "medium" | "high" | "";
316
- primaryBackgroundColorCta?: string;
317
- enableProgressBar?: boolean;
318
- enableSortAndFilter?: boolean;
319
- disableQuantitySelector?: boolean;
320
- disableInventoryTracking?: boolean;
321
- alignFixedBundleContent?: "left" | "right" | "center" | "";
322
- imageAspectType?: "portrait" | "square" | "";
323
- backgroundColorFixedBundleDiv?: string;
324
- canCustomizeFixedBundle?: boolean;
325
- primaryTextColorCta?: string;
326
- showVariants?: boolean;
327
- discountType?: string;
328
- showCta?: boolean;
329
- productCardBadgeText?: string;
330
- coverImageVerticalMargin?: string;
331
- builderTiers?: {
332
- type: string;
333
- offerTier?: {
334
- tier: number;
335
- minimumQuantity: number;
336
- discountValue: number;
337
- }[];
338
- productTier?: ProductTier[];
339
- };
340
- volumeTiers?: {
341
- isDefault: unknown;
342
- tier: number;
343
- minimumQuantity: number;
344
- title: string;
345
- subtitle: string;
346
- badgeTitle: string;
347
- discountValue: number;
348
- imageUrl?: string;
349
- }[];
350
- mixAndMatchTiers?: {
351
- tier: number;
352
- title: string;
353
- products: {
354
- productId: string;
355
- variantIds: string[];
356
- }[];
357
- }[];
358
- customizations: Customizations;
359
- variantOptions?: VariantOptions;
360
- storeCurrencyCode?: string;
361
- customStoreDetails?: {
362
- [key: string]: any;
363
- };
364
- customProductsQuantity?: number | null;
365
- reviewRatingType?: "none" | "ratingOnly" | "ratingAndReviewCount";
366
- appName?: string;
367
- pageHeader?: {
368
- title?: string;
369
- description?: string;
370
- customizePadding?: string;
371
- };
372
- personalizedForm?: {
373
- title?: string;
374
- sections?: {
375
- title: string;
376
- type: "text" | "image";
377
- fields: {
378
- title: string;
379
- }[];
380
- }[];
381
- };
382
- };
383
- export type EventNameCustom = "byob_checkout_cta" | "byob_add_to_bundle" | "block_visibility" | "bundle_add_to_cart";
384
- export type EventTypeCustom = "clicks" | "views";
385
- export type AnalyticsEventParams = {
386
- eventNameCustom: EventNameCustom;
387
- eventTypeCustom: EventTypeCustom;
388
- data: any;
389
- };
390
- export type CursorData = Record<number, {
391
- cursor: string;
392
- hasNext: boolean;
393
- }>;
394
- export type BundleProps = {
395
- bundle: BundlePayload;
396
- addToCartFunction?: (selectedItemsSubtotal: number, variantIds?: string[], finalBundlePrice?: number, variantIdPriceMap?: {
397
- variantId: string;
398
- price: number;
399
- }[], properties?: Record<string, string>) => Promise<void>;
400
- addCustomBundleToCart?: (e: any, formProperties?: Record<string, any>) => Promise<void>;
401
- selectedItems?: {
402
- variantId: string;
403
- product: ProductDetails;
404
- quantity: number;
405
- }[];
406
- setSelectedItems?: React.Dispatch<React.SetStateAction<{
407
- variantId: string;
408
- product: ProductDetails;
409
- quantity: number;
410
- }[]>>;
411
- bundleAddToCartLoading?: boolean;
412
- handleRemoveItem?: (variantId: string) => void;
413
- selectedItemsQuantity?: number;
414
- renderingOnPage?: boolean;
415
- bundleSubtotal?: {
416
- price: number;
417
- compareAtPrice: number;
418
- };
419
- bundleHeaderBackgroundColor?: string;
420
- currentProductId?: string;
421
- dispatchAnalyticsEvent?: (params: AnalyticsEventParams) => void;
422
- fetchStoreDetails?: () => Promise<any>;
423
- productsPagination?: {
424
- initialCursorData: CursorData;
425
- cursorData: CursorData;
426
- fetchFn: (filters?: any, bundleTier?: number, cursor?: string | null) => Promise<ProductData[]>;
427
- setCursorData: (cursorData: CursorData) => void;
428
- };
429
- };
430
- export declare const currencyPrice: (price: number | string | undefined) => string | undefined;
431
- export declare const getCurrencySymbol: (genSymbol: string, storeCurrencyCode?: string) => string;
432
- export declare const optimiseImage: (url: string, width?: number) => string;
433
- export declare const handleAddToBundle: (variantId: string, product: ProductDetails, quantity: number, selectedItems: {
434
- variantId: string;
435
- product: ProductDetails;
436
- quantity: number;
437
- tierIndex?: number | undefined;
438
- }[], setSelectedItems: React.Dispatch<React.SetStateAction<{
439
- variantId: string;
440
- product: ProductDetails;
441
- quantity: number;
442
- isFree?: boolean | undefined;
443
- tierIndex?: number | undefined;
444
- }[]>>, isFreebie?: boolean, tierIndex?: number) => void;
445
- declare const Bundle: React.FC<BundleProps>;
446
- export default Bundle;
1
+ import React from "react";
2
+ import "./bundle.scss";
3
+ interface ShopifyCurrency {
4
+ rate: number;
5
+ active: string;
6
+ }
7
+ declare global {
8
+ interface Window {
9
+ Shopify?: {
10
+ currency?: ShopifyCurrency;
11
+ shop?: string;
12
+ };
13
+ }
14
+ }
15
+ type ProductImage = {
16
+ url: string;
17
+ height: number;
18
+ width: number;
19
+ altText?: string;
20
+ };
21
+ type ProductFeaturedMedia = {
22
+ alt: string;
23
+ preview: {
24
+ image: {
25
+ url: string;
26
+ height?: number;
27
+ width?: number;
28
+ altText: string;
29
+ };
30
+ };
31
+ };
32
+ type ProductOption = {
33
+ id: string;
34
+ name: string;
35
+ values: string[];
36
+ };
37
+ type CollectionNode = {
38
+ node: {
39
+ id: string;
40
+ title: string;
41
+ handle: string;
42
+ };
43
+ };
44
+ export type VariantNode = {
45
+ node: {
46
+ id: string;
47
+ price: string;
48
+ compareAtPrice: string;
49
+ title: string;
50
+ displayName: string;
51
+ image: ProductImage;
52
+ availableForSale: boolean;
53
+ inventoryQuantity: number;
54
+ inventoryItem?: {
55
+ tracked?: boolean;
56
+ };
57
+ inventoryPolicy?: "deny" | "continue";
58
+ };
59
+ };
60
+ type SelectedVariantDetails = {
61
+ id: string;
62
+ price: string;
63
+ compareAtPrice: string;
64
+ title: string;
65
+ displayName: string;
66
+ image: ProductImage;
67
+ availableForSale: boolean;
68
+ inventoryQuantity: number;
69
+ };
70
+ export type VariantOptions = {
71
+ shop: string;
72
+ options: {
73
+ name: string;
74
+ type: "text" | "image" | "color";
75
+ values: {
76
+ name: string;
77
+ value: string;
78
+ }[];
79
+ }[];
80
+ createdAt: string;
81
+ updatedAt: string;
82
+ };
83
+ export type ProductDetails = {
84
+ id: string;
85
+ title: string;
86
+ handle: string;
87
+ featuredMedia: ProductFeaturedMedia;
88
+ status: "active" | "archived" | "draft" | "unlisted" | "";
89
+ options: ProductOption[];
90
+ onlineStoreUrl: string;
91
+ tracksInventory?: boolean;
92
+ publishedAt?: string | null;
93
+ collections: {
94
+ edges: CollectionNode[];
95
+ };
96
+ variants: {
97
+ edges: VariantNode[];
98
+ };
99
+ shop: string;
100
+ metafield?: {
101
+ key: string;
102
+ namespace: string;
103
+ ownerType: string;
104
+ value: string;
105
+ id: string;
106
+ jsonValue: string[];
107
+ type: string;
108
+ };
109
+ descriptionHtml: string;
110
+ media: {
111
+ edges: {
112
+ node: {
113
+ alt: string;
114
+ preview: {
115
+ image: {
116
+ altText: string;
117
+ width?: number;
118
+ height?: number;
119
+ url: string;
120
+ };
121
+ };
122
+ image: {
123
+ altText: string;
124
+ height: number;
125
+ width: number;
126
+ url: string;
127
+ };
128
+ };
129
+ }[];
130
+ };
131
+ selectedVariant?: SelectedVariantDetails;
132
+ rating?: {
133
+ averageRating: number;
134
+ ratingCount: number;
135
+ };
136
+ };
137
+ export type ProductData = {
138
+ productId: string;
139
+ variantIds: string[];
140
+ productDetails: ProductDetails;
141
+ };
142
+ type GeneralStyle = {
143
+ primaryColor: string;
144
+ primaryContrastColor: string;
145
+ secondaryColor: string;
146
+ secondaryContrastColor: string;
147
+ imageAspectRatio: string;
148
+ ctaBackgroundColor: string;
149
+ ctaTextColor: string;
150
+ ctaBorderColor: string;
151
+ ctaShadowType: string;
152
+ ctaPadding: string;
153
+ ctaWidth: string;
154
+ ctaBorderRadius: string;
155
+ ctaHoverBackgroundColor: string;
156
+ ctaHoverTextColor: string;
157
+ customizeHoverState: boolean;
158
+ checkoutPartner: string;
159
+ redirectToPDP: boolean;
160
+ restrictCOD: boolean;
161
+ trackInventory: boolean;
162
+ showOutOfStockProducts: boolean;
163
+ outOfStockLabel: string;
164
+ disabledButtonColor: string;
165
+ storeCurrency: string;
166
+ currencySymbol: string;
167
+ discountPrefix: string;
168
+ discountSuffix: string;
169
+ addOrderTags: boolean;
170
+ addOrderNotes: boolean;
171
+ variantTitleSuffix: boolean;
172
+ titleLength: string;
173
+ showDecimalsInBundlePricing?: boolean;
174
+ showPaymentIcons?: boolean;
175
+ };
176
+ type VolumeStyle = {
177
+ addtoCartMethod: string;
178
+ titleFontSize: string;
179
+ subtitleFontSize: string;
180
+ titleBackgroundColor: string;
181
+ titleTextColor: string;
182
+ verticalMargin: string;
183
+ sectionBackgroundColor: string;
184
+ cardStyle: string;
185
+ discountBadgeVisibility: string;
186
+ tierPriceType: "none" | "unit-price" | "tier-price";
187
+ allowVariantSelection: string;
188
+ variantSelectorType: string;
189
+ ctaTitle: string;
190
+ bundleRedirection: string;
191
+ discountBadgeDisplay: string;
192
+ discountDisplayType: string;
193
+ showVariantOptionsLabel: boolean;
194
+ };
195
+ type ComboStyle = {
196
+ productTitleFontSize: string;
197
+ productDescriptionFontSize: string;
198
+ descriptionTextColor: string;
199
+ titleTextColor: string;
200
+ verticalMargin: string;
201
+ infoAlignment: string;
202
+ ctaTitle: string;
203
+ bundleRedirection: string;
204
+ embedContentVisibility: boolean;
205
+ mixAndMatchCardStyle: string;
206
+ mixAndMatchVariantTypeSelector: string;
207
+ comboCardStyle: string;
208
+ comboVariantTypeSelector: string;
209
+ selectedEmbedContentVisibilityOptions: string[];
210
+ subProductsSectionVisibility: boolean;
211
+ subProductsImageVisibility: boolean;
212
+ subProductsProductTitleVisibility: boolean;
213
+ subProductsProductPriceVisibility: boolean;
214
+ discountBadgeVisibility?: boolean;
215
+ discountBadgeDisplay?: "discount-on-compare" | "discount-on-price";
216
+ };
217
+ type ByobStyle = {
218
+ titleFontSize: string;
219
+ subtitleFontSize: string;
220
+ titleBackgroundColor: string;
221
+ titleTextColor: string;
222
+ productTitleFontSize: string;
223
+ showVariantTitleInCard: boolean;
224
+ productVariantTitleType: "product-title" | "variant-title" | "variant-display-name";
225
+ productTitleWrapLines: string;
226
+ productCardDetailsAlignment: "left" | "center" | "right";
227
+ sectionBackgroundColor: string;
228
+ lazyLoadWidget: string;
229
+ listingsGap: string;
230
+ footerMargin: string;
231
+ borderRadius: string;
232
+ borderColor: string;
233
+ cardBackgroundColor: string;
234
+ shadowType: string;
235
+ addToBundleCTAText: string;
236
+ checkoutCTAText: string;
237
+ variantSelectorType: string;
238
+ primaryVariant: string;
239
+ productsPriceVisibility: boolean;
240
+ compareAtPriceVisibility: boolean;
241
+ selectedProductsVisibility: boolean;
242
+ bundleRedirection: string;
243
+ enableConfetti: boolean;
244
+ selectedItemVisibility: boolean;
245
+ productTiersVisibility: boolean;
246
+ tierNavigation: boolean;
247
+ enableProductCategories: boolean;
248
+ productCardCategoryVisibility: string;
249
+ categoryFilterOnPage: string;
250
+ productFiltersDisplay: "none" | "drawer" | "sidebar";
251
+ filtersProvider: "based-on-products-data" | "search-and-discovery-app-sync";
252
+ selectedFilterOptions: string[];
253
+ };
254
+ type FixedStyle = {
255
+ titleFontSize: string;
256
+ subtitleFontSize: string;
257
+ titleBackgroundColor: string;
258
+ titleTextColor: string;
259
+ verticalMargin: string;
260
+ sectionBackgroundColor: string;
261
+ borderRadius: string;
262
+ borderColor: string;
263
+ cardBackgroundColor: string;
264
+ shadowType: string;
265
+ infoAlignment: string;
266
+ ctaTitle: string;
267
+ bundleRedirection: string;
268
+ cardLayoutStyle: string;
269
+ variantSelectorType: string;
270
+ productsPriceVisibility: boolean;
271
+ compareAtPriceVisibility: boolean;
272
+ discountBadgeVisibility?: boolean;
273
+ discountBadgeDisplay?: "discount-on-compare" | "discount-on-price";
274
+ };
275
+ export type Customizations = {
276
+ shop?: string;
277
+ general: GeneralStyle;
278
+ byob: ByobStyle;
279
+ fixedBundle: FixedStyle;
280
+ volumeBundle: VolumeStyle;
281
+ comboBundle: ComboStyle;
282
+ createdAt?: string;
283
+ updatedAt?: string;
284
+ };
285
+ export type ProductTier = {
286
+ tier: number;
287
+ title: string;
288
+ minimumQuantity: number;
289
+ isFixed?: boolean;
290
+ isFreebieTier?: boolean;
291
+ products: {
292
+ productId: string;
293
+ variantIds: string[];
294
+ }[];
295
+ };
296
+ export type BundlePayload = {
297
+ _id: string;
298
+ showIndividualProductSelector: boolean;
299
+ title?: string;
300
+ subtitle?: string;
301
+ products: ProductData[];
302
+ percentageOff?: number;
303
+ dealAmount?: number;
304
+ amountOff?: number;
305
+ type: "fixed" | "builder" | "volume" | "mixAndMatch" | "" | "combo" | "collection";
306
+ minimumQuantity: number;
307
+ showProductDetailsInTracker: boolean;
308
+ coverImageUrl?: string;
309
+ mobileCoverImageUrl?: string;
310
+ titleSectionTextColor?: string;
311
+ titleSectionBackgroundColor?: string;
312
+ dealTextColor?: string;
313
+ showBorder?: boolean;
314
+ hideProductDetails?: boolean;
315
+ cornerRadiusType?: "medium" | "high" | "";
316
+ primaryBackgroundColorCta?: string;
317
+ enableProgressBar?: boolean;
318
+ enableSortAndFilter?: boolean;
319
+ disableQuantitySelector?: boolean;
320
+ disableInventoryTracking?: boolean;
321
+ alignFixedBundleContent?: "left" | "right" | "center" | "";
322
+ imageAspectType?: "portrait" | "square" | "";
323
+ backgroundColorFixedBundleDiv?: string;
324
+ canCustomizeFixedBundle?: boolean;
325
+ primaryTextColorCta?: string;
326
+ showVariants?: boolean;
327
+ discountType?: string;
328
+ showCta?: boolean;
329
+ productCardBadgeText?: string;
330
+ coverImageVerticalMargin?: string;
331
+ builderTiers?: {
332
+ type: string;
333
+ offerTier?: {
334
+ tier: number;
335
+ minimumQuantity: number;
336
+ discountValue: number;
337
+ }[];
338
+ productTier?: ProductTier[];
339
+ };
340
+ volumeTiers?: {
341
+ isDefault: unknown;
342
+ tier: number;
343
+ minimumQuantity: number;
344
+ title: string;
345
+ subtitle: string;
346
+ badgeTitle: string;
347
+ discountValue: number;
348
+ imageUrl?: string;
349
+ }[];
350
+ mixAndMatchTiers?: {
351
+ tier: number;
352
+ title: string;
353
+ products: {
354
+ productId: string;
355
+ variantIds: string[];
356
+ }[];
357
+ }[];
358
+ customizations: Customizations;
359
+ variantOptions?: VariantOptions;
360
+ storeCurrencyCode?: string;
361
+ customStoreDetails?: {
362
+ [key: string]: any;
363
+ };
364
+ customProductsQuantity?: number | null;
365
+ reviewRatingType?: "none" | "ratingOnly" | "ratingAndReviewCount";
366
+ appName?: string;
367
+ pageHeader?: {
368
+ title?: string;
369
+ description?: string;
370
+ customizePadding?: string;
371
+ };
372
+ personalizedForm?: {
373
+ title?: string;
374
+ sections?: {
375
+ title: string;
376
+ type: "text" | "image";
377
+ fields: {
378
+ title: string;
379
+ }[];
380
+ }[];
381
+ };
382
+ };
383
+ export type EventNameCustom = "byob_checkout_cta" | "byob_add_to_bundle" | "block_visibility" | "bundle_add_to_cart";
384
+ export type EventTypeCustom = "clicks" | "views";
385
+ export type AnalyticsEventParams = {
386
+ eventNameCustom: EventNameCustom;
387
+ eventTypeCustom: EventTypeCustom;
388
+ data: any;
389
+ };
390
+ export type CursorData = Record<number, {
391
+ cursor: string;
392
+ hasNext: boolean;
393
+ }>;
394
+ export type BundleProps = {
395
+ bundle: BundlePayload;
396
+ addToCartFunction?: (selectedItemsSubtotal: number, variantIds?: string[], finalBundlePrice?: number, variantIdPriceMap?: {
397
+ variantId: string;
398
+ price: number;
399
+ }[], properties?: Record<string, string>) => Promise<void>;
400
+ addCustomBundleToCart?: (e: any, formProperties?: Record<string, any>) => Promise<void>;
401
+ selectedItems?: {
402
+ variantId: string;
403
+ product: ProductDetails;
404
+ quantity: number;
405
+ }[];
406
+ setSelectedItems?: React.Dispatch<React.SetStateAction<{
407
+ variantId: string;
408
+ product: ProductDetails;
409
+ quantity: number;
410
+ }[]>>;
411
+ bundleAddToCartLoading?: boolean;
412
+ handleRemoveItem?: (variantId: string) => void;
413
+ selectedItemsQuantity?: number;
414
+ renderingOnPage?: boolean;
415
+ bundleSubtotal?: {
416
+ price: number;
417
+ compareAtPrice: number;
418
+ };
419
+ bundleHeaderBackgroundColor?: string;
420
+ currentProductId?: string;
421
+ dispatchAnalyticsEvent?: (params: AnalyticsEventParams) => void;
422
+ fetchStoreDetails?: () => Promise<any>;
423
+ productsPagination?: {
424
+ initialCursorData: CursorData;
425
+ cursorData: CursorData;
426
+ fetchFn: (filters?: any, bundleTier?: number, cursor?: string | null) => Promise<ProductData[]>;
427
+ setCursorData: (cursorData: CursorData) => void;
428
+ };
429
+ };
430
+ export declare const currencyPrice: (price: number | string | undefined) => string | undefined;
431
+ export declare const getCurrencySymbol: (genSymbol: string, storeCurrencyCode?: string) => string;
432
+ export declare const optimiseImage: (url: string, width?: number) => string;
433
+ export declare const handleAddToBundle: (variantId: string, product: ProductDetails, quantity: number, selectedItems: {
434
+ variantId: string;
435
+ product: ProductDetails;
436
+ quantity: number;
437
+ tierIndex?: number | undefined;
438
+ }[], setSelectedItems: React.Dispatch<React.SetStateAction<{
439
+ variantId: string;
440
+ product: ProductDetails;
441
+ quantity: number;
442
+ isFree?: boolean | undefined;
443
+ tierIndex?: number | undefined;
444
+ }[]>>, isFreebie?: boolean, tierIndex?: number) => void;
445
+ declare const Bundle: React.FC<BundleProps>;
446
+ export default Bundle;