@gem-sdk/core 1.56.0 → 1.57.0-dev.45
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/ComponentToolbarPreview.js +181 -107
- package/dist/cjs/components/ComponentWrapper.js +16 -1
- package/dist/cjs/components/ComponentWrapperPreview.js +16 -2
- package/dist/cjs/components/InteractionSuffix.js +42 -0
- package/dist/cjs/components/Render.liquid.js +22 -7
- package/dist/cjs/contexts/PageContext.js +42 -1
- package/dist/cjs/contexts/ProductContext.js +10 -0
- package/dist/cjs/graphql/fragments/published-theme-page.generated.js +4 -0
- package/dist/cjs/helpers/animations.js +17 -8
- package/dist/cjs/helpers/background.js +10 -5
- package/dist/cjs/helpers/compose-advance-style.js +30 -4
- package/dist/cjs/helpers/interaction/index.js +110 -0
- package/dist/cjs/helpers/radius.js +11 -1
- package/dist/cjs/helpers/shadow.js +5 -4
- package/dist/cjs/helpers/third-party/appConfig.js +56 -0
- package/dist/cjs/helpers/third-party/appSetting.js +207 -60
- package/dist/cjs/helpers/third-party/constant.js +9 -1
- package/dist/cjs/helpers/third-party/getAppBlockConfig.js +8 -1
- package/dist/cjs/hooks/animation/useAnimationConfig.js +2 -1
- package/dist/cjs/hooks/animation/useAnimationTarget.js +5 -2
- package/dist/cjs/hooks/animation/useApplyAnimation.js +6 -4
- package/dist/cjs/hooks/useInteraction.js +19 -0
- package/dist/cjs/hooks/useToolbarPostPurchase.js +2 -2
- package/dist/cjs/index.js +14 -1
- package/dist/cjs/types/animations.js +2 -0
- package/dist/cjs/types/custom.js +52 -0
- package/dist/esm/components/ComponentToolbarPreview.js +181 -107
- package/dist/esm/components/ComponentWrapper.js +16 -1
- package/dist/esm/components/ComponentWrapperPreview.js +16 -2
- package/dist/esm/components/InteractionSuffix.js +40 -0
- package/dist/esm/components/Render.liquid.js +22 -7
- package/dist/esm/contexts/PageContext.js +42 -1
- package/dist/esm/contexts/ProductContext.js +10 -0
- package/dist/esm/graphql/fragments/published-theme-page.generated.js +4 -0
- package/dist/esm/helpers/animations.js +17 -8
- package/dist/esm/helpers/background.js +10 -5
- package/dist/esm/helpers/compose-advance-style.js +31 -5
- package/dist/esm/helpers/interaction/index.js +108 -0
- package/dist/esm/helpers/radius.js +11 -1
- package/dist/esm/helpers/shadow.js +5 -4
- package/dist/esm/helpers/third-party/appConfig.js +49 -1
- package/dist/esm/helpers/third-party/appSetting.js +207 -60
- package/dist/esm/helpers/third-party/constant.js +10 -2
- package/dist/esm/helpers/third-party/getAppBlockConfig.js +8 -1
- package/dist/esm/hooks/animation/useAnimationConfig.js +2 -1
- package/dist/esm/hooks/animation/useAnimationTarget.js +5 -2
- package/dist/esm/hooks/animation/useApplyAnimation.js +6 -4
- package/dist/esm/hooks/useInteraction.js +17 -0
- package/dist/esm/hooks/useToolbarPostPurchase.js +2 -2
- package/dist/esm/index.js +4 -1
- package/dist/esm/types/animations.js +2 -0
- package/dist/esm/types/custom.js +52 -0
- package/dist/types/index.d.ts +548 -185
- package/package.json +3 -3
|
@@ -74,6 +74,13 @@ const ShopifyForms = {
|
|
|
74
74
|
}
|
|
75
75
|
}
|
|
76
76
|
};
|
|
77
|
+
const KachingBundles = {
|
|
78
|
+
KachingBundles: {
|
|
79
|
+
'app-block': {
|
|
80
|
+
product: '{{product}}'
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
};
|
|
77
84
|
const overrideSettings = (tag, currentSetting, appSetting)=>{
|
|
78
85
|
switch(tag){
|
|
79
86
|
case 'ShopifyForms':
|
|
@@ -95,6 +102,20 @@ const overrideSettings = (tag, currentSetting, appSetting)=>{
|
|
|
95
102
|
selected_product: appSetting?.['productHandle'] || '{{ product }}'
|
|
96
103
|
};
|
|
97
104
|
}
|
|
105
|
+
case 'WhatmoreShoppableVideosreel':
|
|
106
|
+
{
|
|
107
|
+
return {
|
|
108
|
+
...currentSetting,
|
|
109
|
+
['show-views']: appSetting?.showViews
|
|
110
|
+
};
|
|
111
|
+
}
|
|
112
|
+
case 'PowerfulContactFormBuilder':
|
|
113
|
+
{
|
|
114
|
+
return {
|
|
115
|
+
...currentSetting,
|
|
116
|
+
shortcode: appSetting?.shortcode
|
|
117
|
+
};
|
|
118
|
+
}
|
|
98
119
|
default:
|
|
99
120
|
return currentSetting;
|
|
100
121
|
}
|
|
@@ -217,77 +238,77 @@ const YotpoReviews = {
|
|
|
217
238
|
const WhatmoreShoppableVideosreel = {
|
|
218
239
|
WhatmoreShoppableVideosreel: {
|
|
219
240
|
'app-block': {
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
241
|
+
heading: 'Watch and Buy',
|
|
242
|
+
'template-type': 'template-f',
|
|
243
|
+
'show-views': 'show',
|
|
244
|
+
'ui-theme': 'round',
|
|
245
|
+
'color-primary': '#343434',
|
|
246
|
+
'color-secondary': '#343434',
|
|
247
|
+
'title-font': 'poppins_n4',
|
|
248
|
+
'primary-font': 'poppins_n4',
|
|
249
|
+
'title-font-size': 40,
|
|
250
|
+
'title-font-size-portrait': 24,
|
|
251
|
+
'landscape-padding': 40,
|
|
252
|
+
'top-bottom-padding': 20,
|
|
253
|
+
'scroll-video-tile-size': 80,
|
|
254
|
+
'scroll-video-tile-size-portrait': 80,
|
|
255
|
+
'min-height': 380
|
|
235
256
|
},
|
|
236
257
|
'app-block-banner': {
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
258
|
+
'template-type': 'template-banner-a',
|
|
259
|
+
'ui-theme': 'round',
|
|
260
|
+
'banner-video-tile-size': 80
|
|
240
261
|
},
|
|
241
262
|
'app-block-collections': {
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
263
|
+
collectionHeading: 'W',
|
|
264
|
+
'template-type': 'template-collections-b',
|
|
265
|
+
'ui-theme': 'round',
|
|
266
|
+
'color-secondary': '#343434',
|
|
267
|
+
'primary-font': 'poppins_n4',
|
|
268
|
+
'tile-size': 60,
|
|
269
|
+
'tile-size-portrait': 60,
|
|
270
|
+
'min-height': 250
|
|
250
271
|
},
|
|
251
272
|
'app-block-stories': {
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
273
|
+
'template-type': 'template-stories-a',
|
|
274
|
+
'ui-theme': 'round',
|
|
275
|
+
'color-primary': '#343434',
|
|
276
|
+
'color-secondary': '#343434',
|
|
277
|
+
'primary-font': 'poppins_n4',
|
|
278
|
+
'stories-top-bottom-padding': 0,
|
|
279
|
+
'story-tile-size': 40,
|
|
280
|
+
'story-tile-size-desktop': 40
|
|
260
281
|
}
|
|
261
282
|
}
|
|
262
283
|
};
|
|
263
284
|
const ProductOptionsCustomizer = {
|
|
264
285
|
ProductOptionsCustomizer: {
|
|
265
286
|
'product-page-customizer': {
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
287
|
+
pc_container_size: 100,
|
|
288
|
+
pc_show_options_total: 'initial',
|
|
289
|
+
pc_customizations_total_text: 'Customizations Total:',
|
|
290
|
+
pc_show_preloader: 'hide',
|
|
291
|
+
pc_preloader_color: '',
|
|
292
|
+
pc_ignore_redirect_command: true,
|
|
293
|
+
pc_basic_label_text_color: '#000000',
|
|
294
|
+
pc_basic_label_font_size: 14,
|
|
295
|
+
pc_basic_label_bolden: 'unset',
|
|
296
|
+
pc_basic_label_space_above: 0,
|
|
297
|
+
pc_basic_option_background_color: '#FFFFFF',
|
|
298
|
+
pc_basic_option_text_color: '#000000',
|
|
299
|
+
pc_basic_option_border_color: '#000000',
|
|
300
|
+
pc_basic_option_border_style: 'solid',
|
|
301
|
+
pc_basic_option_border_width: 1,
|
|
302
|
+
pc_basic_option_curve_the_corners: 'none',
|
|
303
|
+
pc_basic_option_font_size: 14,
|
|
304
|
+
pc_basic_option_bolden: 'none',
|
|
305
|
+
pc_basic_option_width: 100,
|
|
306
|
+
pc_basic_option_space_above: 0,
|
|
307
|
+
pc_basic_option_space_below: 0,
|
|
308
|
+
pc_basic_option_space_inside: 10,
|
|
309
|
+
pc_advanced_custom_css: '',
|
|
310
|
+
pc_advanced_custom_js: '',
|
|
311
|
+
pc_show_image_swatch_preview: false
|
|
291
312
|
}
|
|
292
313
|
}
|
|
293
314
|
};
|
|
@@ -299,7 +320,130 @@ const AppointmentBookingCowlendar = {
|
|
|
299
320
|
}
|
|
300
321
|
}
|
|
301
322
|
};
|
|
323
|
+
const BoldSubscriptions = {
|
|
324
|
+
BoldSubscriptions: {
|
|
325
|
+
'bsub-widget-block': {
|
|
326
|
+
default_subscribe: true,
|
|
327
|
+
primary_color: '#3b63ff',
|
|
328
|
+
secondary_color: '#7dba63',
|
|
329
|
+
background_color: '#f8f9f9',
|
|
330
|
+
border_radius: 4,
|
|
331
|
+
header_text: 'Purchase Options',
|
|
332
|
+
one_time_text: 'One-time Purchase',
|
|
333
|
+
recurring_text: 'Subscribe and Save',
|
|
334
|
+
prepaid_recurring_text: 'Prepaid Subscribe and Save',
|
|
335
|
+
discount_summary_text: '(Save {discount})',
|
|
336
|
+
discount_summary_plural_text: '(Save up to {discount})',
|
|
337
|
+
frequency_header: 'Delivery Frequency',
|
|
338
|
+
frequency_text: 'delivery',
|
|
339
|
+
prepaid_checkbox_label_text: 'Prepay for subscription',
|
|
340
|
+
billing_frequency_header: 'Billing Frequency',
|
|
341
|
+
billing_frequency_text: '{count} Orders',
|
|
342
|
+
delivery_frequency_discount_text: '({discount} off)',
|
|
343
|
+
billing_frequency_discount_text: '({discount} off)',
|
|
344
|
+
prepaid_total_text: 'Billed {price} today',
|
|
345
|
+
prepaid_continue_as_prepaid_text: 'Prepaid order will auto-renew after {count} orders',
|
|
346
|
+
prepaid_continue_as_standard_text: 'Becomes a regular subscription after {count} orders',
|
|
347
|
+
convertible_header: 'Converts to',
|
|
348
|
+
eligible_for_subscription_header: 'Eligible for Subscription',
|
|
349
|
+
initial_dynamic_discount_text: 'Save {initial_percent_discount}% ({initial_fixed_discount})',
|
|
350
|
+
subsequent_dynamic_discounts_text: '{subsequent_percent_discount}% ({subsequent_fixed_discount}) after {order_count} order(s)'
|
|
351
|
+
}
|
|
352
|
+
}
|
|
353
|
+
};
|
|
354
|
+
const SproutPlantTreesGrowSales = {
|
|
355
|
+
SproutPlantTreesGrowSales: {
|
|
356
|
+
badge: null,
|
|
357
|
+
'impact-banner': null
|
|
358
|
+
}
|
|
359
|
+
};
|
|
360
|
+
const InstasellShoppableInstagram = {
|
|
361
|
+
InstasellShoppableInstagram: {
|
|
362
|
+
'app-block': {
|
|
363
|
+
heading: 'InstaSell: Instagram Gallery+',
|
|
364
|
+
description: 'Showcase your Instagram Feed on your Shopify Storefront'
|
|
365
|
+
}
|
|
366
|
+
}
|
|
367
|
+
};
|
|
368
|
+
const Growave = {
|
|
369
|
+
Growave: {
|
|
370
|
+
'block.product.faveButton': {
|
|
371
|
+
option_button_class: ''
|
|
372
|
+
},
|
|
373
|
+
'block.product.reviewWidget': null,
|
|
374
|
+
'block.product.reviewAvgProfile': null,
|
|
375
|
+
'v2.product.reviewsMiniSlider': null
|
|
376
|
+
}
|
|
377
|
+
};
|
|
378
|
+
const LoloyalSettingCommon = {
|
|
379
|
+
title_font_size: 30,
|
|
380
|
+
subtitle_font_size: 13,
|
|
381
|
+
name_font_size: 20,
|
|
382
|
+
details_font_size: 14,
|
|
383
|
+
corner_radius: 8,
|
|
384
|
+
btn_radius: 8,
|
|
385
|
+
top_padding: 32,
|
|
386
|
+
bottom_padding: 32,
|
|
387
|
+
icon_color: '',
|
|
388
|
+
title_color: '#000000',
|
|
389
|
+
subtitle_color: '#000000',
|
|
390
|
+
name_color: '#000000',
|
|
391
|
+
details_color: '#000000',
|
|
392
|
+
card_bg_color: '#FFFFFF',
|
|
393
|
+
background_color: '#ffffff',
|
|
394
|
+
border_color: '#ececec',
|
|
395
|
+
primary_button_color: '#000000',
|
|
396
|
+
primary_button_text_color: '#FFFFFF',
|
|
397
|
+
secondary_button_color: '#FFFFFF',
|
|
398
|
+
secondary_button_text_color: '#000000',
|
|
399
|
+
hover_btn: '#000000',
|
|
400
|
+
hover_text_color: '#FFFFFF',
|
|
401
|
+
custom_css: '/* Add your custom styles here */'
|
|
402
|
+
};
|
|
403
|
+
const LoloyalLoyaltyReferrals = {
|
|
404
|
+
LoloyalLoyaltyReferrals: {
|
|
405
|
+
'app-banner': {
|
|
406
|
+
img_opacity: 0,
|
|
407
|
+
bg_color: '#F6F6F6',
|
|
408
|
+
banner_height: '400',
|
|
409
|
+
content_position: 'll-middle-left',
|
|
410
|
+
content_alignment: 'left',
|
|
411
|
+
title_font_size: 40,
|
|
412
|
+
subtitle_font_size: 13,
|
|
413
|
+
title_color: '#000000',
|
|
414
|
+
subtitle_color: '#000000',
|
|
415
|
+
btn_radius: 30,
|
|
416
|
+
primary_button_color: '#000000',
|
|
417
|
+
primary_button_text_color: '#FFFFFF',
|
|
418
|
+
secondary_button_color: '#FFFFFF',
|
|
419
|
+
secondary_button_text_color: '#000000',
|
|
420
|
+
hover_btn: '#000000',
|
|
421
|
+
hover_text_color: '#FFFFFF',
|
|
422
|
+
custom_css: '/* Add your custom styles here */'
|
|
423
|
+
},
|
|
424
|
+
'app-ways-to-earn': LoloyalSettingCommon,
|
|
425
|
+
'app-ways-to-redeem': LoloyalSettingCommon,
|
|
426
|
+
'app-referrals': LoloyalSettingCommon
|
|
427
|
+
}
|
|
428
|
+
};
|
|
429
|
+
const PowerfulContactFormBuilder = {
|
|
430
|
+
PowerfulContactFormBuilder: {
|
|
431
|
+
'app-block': {
|
|
432
|
+
shortcode: ''
|
|
433
|
+
}
|
|
434
|
+
}
|
|
435
|
+
};
|
|
436
|
+
const WishlistKing = {
|
|
437
|
+
WishlistKing: {
|
|
438
|
+
'wishlist-button-block': null
|
|
439
|
+
}
|
|
440
|
+
};
|
|
302
441
|
const composeSettingsByWidgetType = {
|
|
442
|
+
...WishlistKing,
|
|
443
|
+
...LoloyalLoyaltyReferrals,
|
|
444
|
+
...PowerfulContactFormBuilder,
|
|
445
|
+
...InstasellShoppableInstagram,
|
|
446
|
+
...SproutPlantTreesGrowSales,
|
|
303
447
|
...AppointmentBookingCowlendar,
|
|
304
448
|
...ProductOptionsCustomizer,
|
|
305
449
|
...WhatmoreShoppableVideosreel,
|
|
@@ -321,7 +465,10 @@ const composeSettingsByWidgetType = {
|
|
|
321
465
|
...LoyaltyRewardsReferrals,
|
|
322
466
|
...SubifySubscriptions,
|
|
323
467
|
...SelleasyWidget,
|
|
324
|
-
...YotpoReviews
|
|
468
|
+
...YotpoReviews,
|
|
469
|
+
...BoldSubscriptions,
|
|
470
|
+
...Growave,
|
|
471
|
+
...KachingBundles
|
|
325
472
|
};
|
|
326
473
|
|
|
327
474
|
exports.composeSettingsByWidgetType = composeSettingsByWidgetType;
|
|
@@ -24,7 +24,15 @@ const mapShopifyAppMeta = {
|
|
|
24
24
|
...appConfig.YotpoReviewsV3UgcConfig,
|
|
25
25
|
...appConfig.WhatmoreShoppableVideosreelConfig,
|
|
26
26
|
...appConfig.ProductOptionsCustomizerConfig,
|
|
27
|
-
...appConfig.AppointmentBookingCowlendarConfig
|
|
27
|
+
...appConfig.AppointmentBookingCowlendarConfig,
|
|
28
|
+
...appConfig.BoldSubscriptionsConfig,
|
|
29
|
+
...appConfig.SproutPlantTreesGrowSalesConfig,
|
|
30
|
+
...appConfig.InstasellShoppableInstagramConfig,
|
|
31
|
+
...appConfig.GrowaveConfig,
|
|
32
|
+
...appConfig.KachingBundlesConfig,
|
|
33
|
+
...appConfig.LoloyalLoyaltyReferralsConfig,
|
|
34
|
+
...appConfig.PowerfulContactFormBuilderConfig,
|
|
35
|
+
...appConfig.WishlistKingConfig
|
|
28
36
|
};
|
|
29
37
|
const THIRD_PARTY_APP_BLOCK_ID_PREFIX = 'gp_app';
|
|
30
38
|
|
|
@@ -3,10 +3,17 @@
|
|
|
3
3
|
var appSetting = require('./appSetting.js');
|
|
4
4
|
var getAppBlockType = require('./getAppBlockType.js');
|
|
5
5
|
|
|
6
|
+
const listAppUpdateNewVersion = [
|
|
7
|
+
'Growave'
|
|
8
|
+
];
|
|
6
9
|
const getAppBlockConfig = (tag, appBlockId, settings)=>{
|
|
10
|
+
let widgetType = settings?.widgetType;
|
|
11
|
+
if (listAppUpdateNewVersion.includes(tag)) {
|
|
12
|
+
widgetType = settings?.widgetTypeV2;
|
|
13
|
+
}
|
|
7
14
|
const appBlockType = getAppBlockType.getAppBlockType({
|
|
8
15
|
tag,
|
|
9
|
-
widgetType
|
|
16
|
+
widgetType
|
|
10
17
|
});
|
|
11
18
|
const settingByWidget = appSetting.composeSettingsByWidgetType[tag][settings?.widgetType];
|
|
12
19
|
const appSettings = appSetting.overrideSettings(tag, settingByWidget, settings);
|
|
@@ -98,9 +98,12 @@ const useAnimationTarget = (props)=>{
|
|
|
98
98
|
const initListOfTargets = react.useCallback(()=>{
|
|
99
99
|
if (!isEnabledAnimation) return;
|
|
100
100
|
if (!targets.current) {
|
|
101
|
-
|
|
101
|
+
const $storefront = document.body.querySelector('#storefront');
|
|
102
|
+
if ($storefront) {
|
|
103
|
+
targets.current = $storefront.querySelectorAll(`[data-uid="${componentUid}"]`);
|
|
104
|
+
}
|
|
102
105
|
}
|
|
103
|
-
const targetsArray = Array.from(targets.current);
|
|
106
|
+
const targetsArray = Array.from(targets.current || []);
|
|
104
107
|
if (!targetsArray.length) return;
|
|
105
108
|
const updatedTargetObjects = getUpdatedTargetObjects(targetsArray);
|
|
106
109
|
targetObjects.current = updatedTargetObjects;
|
|
@@ -8,6 +8,7 @@ var useAnimationTarget = require('./useAnimationTarget.js');
|
|
|
8
8
|
var useAnimationConfig = require('./useAnimationConfig.js');
|
|
9
9
|
var useAnimationActions = require('./useAnimationActions.js');
|
|
10
10
|
var useAnimationPreview = require('./useAnimationPreview.js');
|
|
11
|
+
require('../../types/custom.js');
|
|
11
12
|
var animations = require('../../types/animations.js');
|
|
12
13
|
|
|
13
14
|
const useApplyAnimation = ({ props })=>{
|
|
@@ -24,13 +25,13 @@ const useApplyAnimation = ({ props })=>{
|
|
|
24
25
|
setAnimationOnFinish,
|
|
25
26
|
setToolbarActive
|
|
26
27
|
});
|
|
27
|
-
const generateAnimation = react.useCallback(({ target, setting, type })=>{
|
|
28
|
-
return animation[type](target, setting);
|
|
28
|
+
const generateAnimation = react.useCallback(({ target, setting, type, reverse })=>{
|
|
29
|
+
return animation[type](target, setting, reverse);
|
|
29
30
|
}, [
|
|
30
31
|
animation
|
|
31
32
|
]);
|
|
32
33
|
const initListAnimations = react.useCallback(()=>{
|
|
33
|
-
const { type, setting } = getAnimationConfig();
|
|
34
|
+
const { type, setting, reverse } = getAnimationConfig();
|
|
34
35
|
if (!type || type === animations.AnimationType.None || !targetObjects.current.length) {
|
|
35
36
|
cancelAnimation();
|
|
36
37
|
return;
|
|
@@ -38,7 +39,8 @@ const useApplyAnimation = ({ props })=>{
|
|
|
38
39
|
const listAnimations = targetObjects.current.map((item)=>generateAnimation({
|
|
39
40
|
type,
|
|
40
41
|
setting,
|
|
41
|
-
target: item.target
|
|
42
|
+
target: item.target,
|
|
43
|
+
reverse
|
|
42
44
|
}));
|
|
43
45
|
cancelAnimation();
|
|
44
46
|
setAnimation(listAnimations);
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var PageContext = require('../contexts/PageContext.js');
|
|
4
|
+
|
|
5
|
+
const useInteraction = ()=>{
|
|
6
|
+
const interactionData = PageContext.usePageStore((state)=>state.interactionData);
|
|
7
|
+
const { item } = interactionData || {};
|
|
8
|
+
const getAnimationByUid = (uid)=>{
|
|
9
|
+
const targets = item?.targets;
|
|
10
|
+
const targetByUid = targets?.find((target)=>target.uid === uid);
|
|
11
|
+
const metaDataContainsAnimation = targetByUid?.events?.find((it)=>it.condition?.metaData?.animation);
|
|
12
|
+
return metaDataContainsAnimation?.condition?.metaData?.animation;
|
|
13
|
+
};
|
|
14
|
+
return {
|
|
15
|
+
getAnimationByUid
|
|
16
|
+
};
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
exports.useInteraction = useInteraction;
|
|
@@ -31,7 +31,7 @@ const usePostPurchase = (uid, tag)=>{
|
|
|
31
31
|
return count <= 1;
|
|
32
32
|
};
|
|
33
33
|
const verifyWrapContainsRequireElement = ()=>{
|
|
34
|
-
const $component = document.querySelector(`[data-uid="${uid}"]`);
|
|
34
|
+
const $component = document.body.querySelector('#storefront')?.querySelector(`[data-uid="${uid}"]`);
|
|
35
35
|
if (!$component) return false;
|
|
36
36
|
for (const requiredElementTag of constant.postPurchaseRequiredElements){
|
|
37
37
|
const countElementInsidePage = getElementCountInPage(requiredElementTag);
|
|
@@ -44,7 +44,7 @@ const usePostPurchase = (uid, tag)=>{
|
|
|
44
44
|
};
|
|
45
45
|
const countRequiredElement = ()=>{
|
|
46
46
|
return constant.postPurchaseRequiredElements.reduce((acc, requiredElementTag)=>{
|
|
47
|
-
const $component = document.querySelector(`[data-uid="${uid}"]`);
|
|
47
|
+
const $component = document.body.querySelector('#storefront')?.querySelector(`[data-uid="${uid}"]`);
|
|
48
48
|
if (!$component) return 0;
|
|
49
49
|
const count = $component.querySelectorAll(`[data-component-tag="${requiredElementTag}"]`).length;
|
|
50
50
|
return acc + count;
|
package/dist/cjs/index.js
CHANGED
|
@@ -62,6 +62,7 @@ var isDefined = require('./helpers/is-defined.js');
|
|
|
62
62
|
var layout = require('./helpers/layout.js');
|
|
63
63
|
var makeStyle = require('./helpers/make-style.js');
|
|
64
64
|
var align = require('./helpers/align.js');
|
|
65
|
+
var variant = require('./helpers/variant.js');
|
|
65
66
|
var product = require('./helpers/product.js');
|
|
66
67
|
var query = require('./helpers/query.js');
|
|
67
68
|
var radius = require('./helpers/radius.js');
|
|
@@ -99,6 +100,7 @@ var useProductList = require('./hooks/useProductList.js');
|
|
|
99
100
|
var useSuspenseFetch = require('./hooks/useSuspenseFetch.js');
|
|
100
101
|
var useSwatchesOptions = require('./hooks/useSwatchesOptions.js');
|
|
101
102
|
var useInitialSwatchesOptions = require('./hooks/useInitialSwatchesOptions.js');
|
|
103
|
+
var custom = require('./types/custom.js');
|
|
102
104
|
var shop$1 = require('./types/shop.js');
|
|
103
105
|
var appAPI = require('./types/appAPI.js');
|
|
104
106
|
var globalStyle = require('./types/global-style.js');
|
|
@@ -108,6 +110,7 @@ var getProduct = require('./helpers/queries/get-product.js');
|
|
|
108
110
|
var getProductBySlug = require('./helpers/queries/get-product-by-slug.js');
|
|
109
111
|
var getAppBlocks = require('./helpers/third-party/getAppBlocks.js');
|
|
110
112
|
var addAppBlockId = require('./helpers/third-party/addAppBlockId.js');
|
|
113
|
+
var index = require('./helpers/interaction/index.js');
|
|
111
114
|
|
|
112
115
|
|
|
113
116
|
|
|
@@ -247,6 +250,7 @@ exports.makeStyleState = makeStyle.makeStyleState;
|
|
|
247
250
|
exports.makeWidth = makeStyle.makeWidth;
|
|
248
251
|
exports.removeNullUndefined = makeStyle.removeNullUndefined;
|
|
249
252
|
exports.convertTextAlignToJustify = align.convertTextAlignToJustify;
|
|
253
|
+
exports.checkInStock = variant.checkInStock;
|
|
250
254
|
exports.checkAvailableVariantInStock = product.checkAvailableVariantInStock;
|
|
251
255
|
exports.getSelectedVariant = product.getSelectedVariant;
|
|
252
256
|
exports.parseSelectedOption = product.parseSelectedOption;
|
|
@@ -268,7 +272,7 @@ exports.removeUndefinedValuesFromObject = render.removeUndefinedValuesFromObject
|
|
|
268
272
|
exports.styles = render.styles;
|
|
269
273
|
exports.template = render.template;
|
|
270
274
|
exports.composeShadowCss = shadow.composeShadowCss;
|
|
271
|
-
exports.
|
|
275
|
+
exports.getResponsiveStyleShadow = shadow.getResponsiveStyleShadow;
|
|
272
276
|
exports.getStyleShadow = shadow.getStyleShadow;
|
|
273
277
|
exports.getStyleShadowState = shadow.getStyleShadowState;
|
|
274
278
|
exports.parseValueWithUnit = shadow.parseValueWithUnit;
|
|
@@ -362,6 +366,14 @@ exports.useProductListStyles = useProductList.useProductListStyles;
|
|
|
362
366
|
exports.useSuspenseFetch = useSuspenseFetch.default;
|
|
363
367
|
exports.useSwatchesOptions = useSwatchesOptions.default;
|
|
364
368
|
exports.useInitialSwatchesOptions = useInitialSwatchesOptions.default;
|
|
369
|
+
Object.defineProperty(exports, 'InteractionTargetEvent', {
|
|
370
|
+
enumerable: true,
|
|
371
|
+
get: function () { return custom.InteractionTargetEvent; }
|
|
372
|
+
});
|
|
373
|
+
Object.defineProperty(exports, 'InteractionTriggerEvent', {
|
|
374
|
+
enumerable: true,
|
|
375
|
+
get: function () { return custom.InteractionTriggerEvent; }
|
|
376
|
+
});
|
|
365
377
|
exports.ShopType = shop$1;
|
|
366
378
|
exports.AppAPIType = appAPI;
|
|
367
379
|
exports.OptionNormalStyle = globalStyle.OptionNormalStyle;
|
|
@@ -398,3 +410,4 @@ exports.getProduct = getProduct.getProduct;
|
|
|
398
410
|
exports.getProductBySlug = getProductBySlug.getProductBySlug;
|
|
399
411
|
exports.getAppBlocks = getAppBlocks.getAppBlocks;
|
|
400
412
|
exports.addAppBlockId = addAppBlockId.addAppBlockId;
|
|
413
|
+
exports.useInteraction = index.useInteraction;
|
|
@@ -32,6 +32,8 @@ exports.AnimationTriggerType = void 0;
|
|
|
32
32
|
(function(AnimationTriggerType) {
|
|
33
33
|
AnimationTriggerType["Appear"] = 'appear';
|
|
34
34
|
AnimationTriggerType["Hover"] = 'hover';
|
|
35
|
+
AnimationTriggerType["Hidden"] = 'hidden';
|
|
36
|
+
AnimationTriggerType["AppearByTrigger"] = 'appearByTrigger';
|
|
35
37
|
})(exports.AnimationTriggerType || (exports.AnimationTriggerType = {}));
|
|
36
38
|
exports.AnimationZoomDirectionType = void 0;
|
|
37
39
|
(function(AnimationZoomDirectionType) {
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
exports.InteractionTargetEvent = void 0;
|
|
4
|
+
(function(InteractionTargetEvent) {
|
|
5
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:change-background-color'] = 0] = 'gp:change-background-color';
|
|
6
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:run-animation'] = 1] = 'gp:run-animation';
|
|
7
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:toggle-element-visibility'] = 2] = 'gp:toggle-element-visibility';
|
|
8
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:change-text'] = 3] = 'gp:change-text';
|
|
9
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:scroll-to'] = 4] = 'gp:scroll-to';
|
|
10
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:change-text-style'] = 5] = 'gp:change-text-style';
|
|
11
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:change-content'] = 6] = 'gp:change-content';
|
|
12
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:change-button-style'] = 7] = 'gp:change-button-style';
|
|
13
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:copy-text'] = 8] = 'gp:copy-text';
|
|
14
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:change-image'] = 9] = 'gp:change-image';
|
|
15
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:toggle-video-play'] = 10] = 'gp:toggle-video-play';
|
|
16
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:change-slider-ratio'] = 11] = 'gp:change-slider-ratio';
|
|
17
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:change-icon-style'] = 12] = 'gp:change-icon-style';
|
|
18
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:change-expanded-item'] = 13] = 'gp:change-expanded-item';
|
|
19
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:change-active-item'] = 14] = 'gp:change-active-item';
|
|
20
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:change-slide'] = 15] = 'gp:change-slide';
|
|
21
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:change-image-step'] = 16] = 'gp:change-image-step';
|
|
22
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:change-text-value'] = 17] = 'gp:change-text-value';
|
|
23
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:toggle-popup-open'] = 18] = 'gp:toggle-popup-open';
|
|
24
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:show-or-hide'] = 19] = 'gp:show-or-hide';
|
|
25
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:change-banner'] = 20] = 'gp:change-banner';
|
|
26
|
+
InteractionTargetEvent[InteractionTargetEvent['gp:change-open-tab'] = 21] = 'gp:change-open-tab';
|
|
27
|
+
})(exports.InteractionTargetEvent || (exports.InteractionTargetEvent = {}));
|
|
28
|
+
exports.InteractionTriggerEvent = void 0;
|
|
29
|
+
(function(InteractionTriggerEvent) {
|
|
30
|
+
InteractionTriggerEvent[InteractionTriggerEvent['click'] = 0] = 'click';
|
|
31
|
+
InteractionTriggerEvent[InteractionTriggerEvent["active"] = 1] = "active";
|
|
32
|
+
InteractionTriggerEvent[InteractionTriggerEvent['mouseover'] = 2] = 'mouseover';
|
|
33
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:appear'] = 3] = 'gp:appear';
|
|
34
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:item-selected'] = 4] = 'gp:item-selected';
|
|
35
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:item-unselected'] = 5] = 'gp:item-unselected';
|
|
36
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:item-hovered'] = 6] = 'gp:item-hovered';
|
|
37
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:item-click'] = 7] = 'gp:item-click';
|
|
38
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:after-submit'] = 8] = 'gp:after-submit';
|
|
39
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:quantity-change'] = 9] = 'gp:quantity-change';
|
|
40
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:after-checked-value'] = 10] = 'gp:after-checked-value';
|
|
41
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:after-add-to-cart'] = 11] = 'gp:after-add-to-cart';
|
|
42
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:popup-open'] = 12] = 'gp:popup-open';
|
|
43
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:popup-close'] = 13] = 'gp:popup-close';
|
|
44
|
+
InteractionTriggerEvent[InteractionTriggerEvent['scroll-up'] = 14] = 'scroll-up';
|
|
45
|
+
InteractionTriggerEvent[InteractionTriggerEvent['scroll-down'] = 15] = 'scroll-down';
|
|
46
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:price-change'] = 16] = 'gp:price-change';
|
|
47
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:rollback-price-change'] = 17] = 'gp:rollback-price-change';
|
|
48
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:compare-price-change'] = 18] = 'gp:compare-price-change';
|
|
49
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:rollback:compare-price-change'] = 19] = 'gp:rollback:compare-price-change';
|
|
50
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:stock-change'] = 20] = 'gp:stock-change';
|
|
51
|
+
InteractionTriggerEvent[InteractionTriggerEvent['gp:rollback:stock-change'] = 21] = 'gp:rollback:stock-change';
|
|
52
|
+
})(exports.InteractionTriggerEvent || (exports.InteractionTriggerEvent = {}));
|