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