@gem-sdk/core 1.0.3 → 1.0.5

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.
@@ -0,0 +1,99 @@
1
+ 'use strict';
2
+
3
+ // https://developers.google.com/analytics/devguides/collection/gtagjs/pages
4
+ const pageview = (url, trackingId) => {
5
+ // GA 4
6
+ if (window.gtag && trackingId) {
7
+ window.gtag('config', trackingId, {
8
+ page_path: url,
9
+ });
10
+ }
11
+ // GA 3
12
+ if (window.ga) {
13
+ window.ga('send', 'pageview', url);
14
+ }
15
+ };
16
+ /** Addition to cart events
17
+ * https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#add-remove-cart
18
+ */
19
+ const addToCart = (product) => {
20
+ // GA 3
21
+ if (!window.ga || !product) {
22
+ return;
23
+ }
24
+ window.ga('ec:addProduct', {
25
+ ...product,
26
+ id: product.sku,
27
+ name: product.variant === 'Default Title' ? product.name : `${product.name} - ${product.variant}`,
28
+ variant: product.variant === 'Default Title' ? product.name : product.variant,
29
+ });
30
+ window.ga('ec:setAction', 'add');
31
+ window.ga('send', 'event', {
32
+ eventCategory: 'EnhancedEcommerce',
33
+ eventAction: 'Added Product',
34
+ nonInteraction: true,
35
+ });
36
+ };
37
+ /** Product clicked event
38
+ * https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#product-click
39
+ */
40
+ const productClick = (product) => {
41
+ if (!window.ga) {
42
+ return;
43
+ }
44
+ ga('ec:addProduct', {
45
+ id: product.id,
46
+ name: product.name,
47
+ category: product.category,
48
+ brand: product.brand,
49
+ variant: product.variant,
50
+ });
51
+ ga('ec:setAction', 'click');
52
+ ga('send', 'event', {
53
+ eventAction: 'Click',
54
+ eventCategory: 'Product',
55
+ });
56
+ };
57
+ /** Product viewed event
58
+ * https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#measuring-actvities
59
+ */
60
+ const productDetail = (product) => {
61
+ if (!product || !window.ga)
62
+ return;
63
+ ga('ec:addProduct', {
64
+ brand: product.brand,
65
+ category: product.category,
66
+ id: product.id,
67
+ name: product.name,
68
+ variant: product.variant,
69
+ });
70
+ ga('ec:setAction', 'detail');
71
+ ga('send', 'event', {
72
+ eventAction: 'Detail',
73
+ eventCategory: 'Ecommerce',
74
+ nonInteraction: 1,
75
+ });
76
+ };
77
+ /** Removal from cart events
78
+ * https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#add-remove-cart
79
+ */
80
+ const removeFromCart = (product, price) => {
81
+ if (!product || !window.ga)
82
+ return;
83
+ ga('ec:addProduct', {
84
+ id: product.id,
85
+ name: product.name,
86
+ price,
87
+ });
88
+ ga('ec:setAction', 'remove');
89
+ ga('send', 'event', {
90
+ eventAction: 'Click',
91
+ eventCategory: 'Remove from cart',
92
+ });
93
+ };
94
+
95
+ exports.addToCart = addToCart;
96
+ exports.pageview = pageview;
97
+ exports.productClick = productClick;
98
+ exports.productDetail = productDetail;
99
+ exports.removeFromCart = removeFromCart;
package/dist/cjs/index.js CHANGED
@@ -43,9 +43,9 @@ var colors = require('./helpers/colors.js');
43
43
  var typography = require('./helpers/typography.js');
44
44
  var radius = require('./helpers/radius.js');
45
45
  var product = require('./helpers/product.js');
46
- var fpixel = require('./helpers/fpixel.js');
47
- var gtag = require('./helpers/gtag.js');
48
- var tiktokpixel = require('./helpers/tiktokpixel.js');
46
+ var fpixel = require('./helpers/tracking/fpixel.js');
47
+ var gtag = require('./helpers/tracking/gtag.js');
48
+ var tiktokpixel = require('./helpers/tracking/tiktokpixel.js');
49
49
  var useAddToCart = require('./hooks/cart/use-add-to-cart.js');
50
50
  var useCartData = require('./hooks/cart/use-cart-data.js');
51
51
  var useCartDiscountCodesUpdate = require('./hooks/cart/use-cart-discount-codes-update.js');
@@ -0,0 +1,93 @@
1
+ // https://developers.google.com/analytics/devguides/collection/gtagjs/pages
2
+ const pageview = (url, trackingId) => {
3
+ // GA 4
4
+ if (window.gtag && trackingId) {
5
+ window.gtag('config', trackingId, {
6
+ page_path: url,
7
+ });
8
+ }
9
+ // GA 3
10
+ if (window.ga) {
11
+ window.ga('send', 'pageview', url);
12
+ }
13
+ };
14
+ /** Addition to cart events
15
+ * https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#add-remove-cart
16
+ */
17
+ const addToCart = (product) => {
18
+ // GA 3
19
+ if (!window.ga || !product) {
20
+ return;
21
+ }
22
+ window.ga('ec:addProduct', {
23
+ ...product,
24
+ id: product.sku,
25
+ name: product.variant === 'Default Title' ? product.name : `${product.name} - ${product.variant}`,
26
+ variant: product.variant === 'Default Title' ? product.name : product.variant,
27
+ });
28
+ window.ga('ec:setAction', 'add');
29
+ window.ga('send', 'event', {
30
+ eventCategory: 'EnhancedEcommerce',
31
+ eventAction: 'Added Product',
32
+ nonInteraction: true,
33
+ });
34
+ };
35
+ /** Product clicked event
36
+ * https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#product-click
37
+ */
38
+ const productClick = (product) => {
39
+ if (!window.ga) {
40
+ return;
41
+ }
42
+ ga('ec:addProduct', {
43
+ id: product.id,
44
+ name: product.name,
45
+ category: product.category,
46
+ brand: product.brand,
47
+ variant: product.variant,
48
+ });
49
+ ga('ec:setAction', 'click');
50
+ ga('send', 'event', {
51
+ eventAction: 'Click',
52
+ eventCategory: 'Product',
53
+ });
54
+ };
55
+ /** Product viewed event
56
+ * https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#measuring-actvities
57
+ */
58
+ const productDetail = (product) => {
59
+ if (!product || !window.ga)
60
+ return;
61
+ ga('ec:addProduct', {
62
+ brand: product.brand,
63
+ category: product.category,
64
+ id: product.id,
65
+ name: product.name,
66
+ variant: product.variant,
67
+ });
68
+ ga('ec:setAction', 'detail');
69
+ ga('send', 'event', {
70
+ eventAction: 'Detail',
71
+ eventCategory: 'Ecommerce',
72
+ nonInteraction: 1,
73
+ });
74
+ };
75
+ /** Removal from cart events
76
+ * https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#add-remove-cart
77
+ */
78
+ const removeFromCart = (product, price) => {
79
+ if (!product || !window.ga)
80
+ return;
81
+ ga('ec:addProduct', {
82
+ id: product.id,
83
+ name: product.name,
84
+ price,
85
+ });
86
+ ga('ec:setAction', 'remove');
87
+ ga('send', 'event', {
88
+ eventAction: 'Click',
89
+ eventCategory: 'Remove from cart',
90
+ });
91
+ };
92
+
93
+ export { addToCart, pageview, productClick, productDetail, removeFromCart };
package/dist/esm/index.js CHANGED
@@ -41,11 +41,11 @@ export { getGlobalColorCSSProp, getGlobalColorClass, getGlobalColorResponsiveCla
41
41
  export { genTypoClass } from './helpers/typography.js';
42
42
  export { composeRadius, getCustomRadius, getRadiusCSSFromGlobal, getRadiusStyleActiveState } from './helpers/radius.js';
43
43
  export { getSelectedVariant, parseSelectedOption } from './helpers/product.js';
44
- import * as fpixel from './helpers/fpixel.js';
44
+ import * as fpixel from './helpers/tracking/fpixel.js';
45
45
  export { fpixel };
46
- import * as gtag from './helpers/gtag.js';
46
+ import * as gtag from './helpers/tracking/gtag.js';
47
47
  export { gtag };
48
- import * as tiktokpixel from './helpers/tiktokpixel.js';
48
+ import * as tiktokpixel from './helpers/tracking/tiktokpixel.js';
49
49
  export { tiktokpixel };
50
50
  export { useAddToCart } from './hooks/cart/use-add-to-cart.js';
51
51
  export { useCartData } from './hooks/cart/use-cart-data.js';
@@ -653,6 +653,13 @@ type CountdownEvergreenType = {
653
653
  startTime: number;
654
654
  };
655
655
  };
656
+ type Timezone<T> = SharedControlType<T> & {
657
+ type: 'timezone';
658
+ placeholder?: string;
659
+ datalist?: {
660
+ value: any;
661
+ }[];
662
+ };
656
663
 
657
664
  type KlaviyoCodes = {
658
665
  type: 'klaviyoCodes';
@@ -664,7 +671,7 @@ type YotpoLoyaltyCodes = {
664
671
  id: string;
665
672
  };
666
673
 
667
- type ControlProp<T> = AngleControlType<T> | CheckboxControlType<T> | ColorPickerControlType<T> | GroupControlType<T> | IconControlType<T> | InputFixContentControlType<T> | InputNumberControlType<T> | InputUnitControlType<T> | InputControlType<T> | MarginControlType<T> | PaddingControlType<T> | PositionControlType<T> | RadioGroupControlType | RangeControlType<T> | SegmentControlType<T> | SelectControlType<T> | TextareaControlType<T> | ToggleControlType<T> | ImageControlType<T> | ChildrensControlType | GridControlType<T> | FlexControlType<T> | TextEditorControlType<T> | ProductControlType<T> | TypographyControlType<T> | MenuControlType<T> | BehaviorStateControlType<T> | PickLinkControlType<T> | BoxShadowControlType<T> | TextShadowControlType<T> | BorderControlType<T> | BorderRadiusControlType<T> | RadiusPresetControlType<T> | SizeControlType<T> | ChildItemType<T> | PickMultiProductControlType<T> | CollectionControlType<T> | BackgroundControlType<T> | VisibilityControlType<T> | SelectVariantControlType | CountdownEvergreenType | DateTimePickerControlType | CountdownDailyType | KlaviyoCodes | YotpoLoyaltyCodes;
674
+ type ControlProp<T> = AngleControlType<T> | CheckboxControlType<T> | ColorPickerControlType<T> | GroupControlType<T> | IconControlType<T> | InputFixContentControlType<T> | InputNumberControlType<T> | InputUnitControlType<T> | InputControlType<T> | MarginControlType<T> | PaddingControlType<T> | PositionControlType<T> | RadioGroupControlType | RangeControlType<T> | SegmentControlType<T> | SelectControlType<T> | TextareaControlType<T> | ToggleControlType<T> | ImageControlType<T> | ChildrensControlType | GridControlType<T> | FlexControlType<T> | TextEditorControlType<T> | ProductControlType<T> | TypographyControlType<T> | MenuControlType<T> | BehaviorStateControlType<T> | PickLinkControlType<T> | BoxShadowControlType<T> | TextShadowControlType<T> | BorderControlType<T> | BorderRadiusControlType<T> | RadiusPresetControlType<T> | SizeControlType<T> | ChildItemType<T> | PickMultiProductControlType<T> | CollectionControlType<T> | BackgroundControlType<T> | VisibilityControlType<T> | SelectVariantControlType | CountdownEvergreenType | Timezone<T> | DateTimePickerControlType | CountdownDailyType | KlaviyoCodes | YotpoLoyaltyCodes;
668
675
  type Setting<P extends BaseProps> = {
669
676
  id: 'setting';
670
677
  controls?: ControlProp<NonNullable<P['setting']>>[];
@@ -6586,6 +6593,7 @@ type GlobalSwatchesData = {
6586
6593
  type ProductInputAnalytic = {
6587
6594
  id: string;
6588
6595
  name: string;
6596
+ sku?: string;
6589
6597
  category?: string;
6590
6598
  quantity?: number;
6591
6599
  price?: number;
@@ -7162,13 +7170,34 @@ declare namespace fpixel {
7162
7170
  }
7163
7171
 
7164
7172
  declare const pageview: (url: string, trackingId?: string | null) => void;
7173
+ /** Addition to cart events
7174
+ * https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#add-remove-cart
7175
+ */
7165
7176
  declare const addToCart$1: (product: ProductInputAnalytic) => void;
7177
+ /** Product clicked event
7178
+ * https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#product-click
7179
+ */
7180
+ declare const productClick: (product: ProductInputAnalytic) => void;
7181
+ /** Product viewed event
7182
+ * https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#measuring-actvities
7183
+ */
7184
+ declare const productDetail: (product: ProductInputAnalytic) => void;
7185
+ /** Removal from cart events
7186
+ * https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#add-remove-cart
7187
+ */
7188
+ declare const removeFromCart: (product: ProductInputAnalytic, price: number) => void;
7166
7189
 
7167
7190
  declare const gtag_pageview: typeof pageview;
7191
+ declare const gtag_productClick: typeof productClick;
7192
+ declare const gtag_productDetail: typeof productDetail;
7193
+ declare const gtag_removeFromCart: typeof removeFromCart;
7168
7194
  declare namespace gtag {
7169
7195
  export {
7170
7196
  gtag_pageview as pageview,
7171
7197
  addToCart$1 as addToCart,
7198
+ gtag_productClick as productClick,
7199
+ gtag_productDetail as productDetail,
7200
+ gtag_removeFromCart as removeFromCart,
7172
7201
  };
7173
7202
  }
7174
7203
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gem-sdk/core",
3
- "version": "1.0.3",
3
+ "version": "1.0.5",
4
4
  "license": "MIT",
5
5
  "sideEffects": false,
6
6
  "main": "dist/cjs/index.js",
@@ -24,8 +24,8 @@
24
24
  "type-check": "yarn tsc --noEmit"
25
25
  },
26
26
  "devDependencies": {
27
- "@gem-sdk/styles": "*",
28
- "@gem-sdk/adapter-shopify": "*"
27
+ "@gem-sdk/adapter-shopify": "*",
28
+ "@gem-sdk/styles": "*"
29
29
  },
30
30
  "dependencies": {
31
31
  "react-error-boundary": "^3.1.4",
@@ -1,48 +0,0 @@
1
- 'use strict';
2
-
3
- // https://developers.google.com/analytics/devguides/collection/gtagjs/pages
4
- const pageview = (url, trackingId) => {
5
- // GA 4
6
- if (window.gtag && trackingId) {
7
- window.gtag('config', trackingId, {
8
- page_path: url,
9
- });
10
- }
11
- // GA 3
12
- if (window.ga) {
13
- window.ga('send', 'pageview', url);
14
- }
15
- };
16
- const addToCart = (product) => {
17
- // GA 3
18
- if (window.ga) {
19
- window.ga('ec:addProduct', product);
20
- window.ga('send', 'event', {
21
- eventCategory: 'EnhancedEcommerce',
22
- eventAction: 'Added Product',
23
- eventLabel: undefined,
24
- nonInteraction: true,
25
- });
26
- }
27
- // GA 4
28
- if (window.gtag) {
29
- window.gtag('event', 'add_to_cart', {
30
- currency: product.currency,
31
- value: product.price,
32
- items: [
33
- {
34
- currency: product.currency,
35
- item_brand: product.brand,
36
- item_id: product.id,
37
- item_name: product.name,
38
- item_variant: product.variant,
39
- item_category: product.category,
40
- },
41
- ],
42
- debug_mode: true,
43
- });
44
- }
45
- };
46
-
47
- exports.addToCart = addToCart;
48
- exports.pageview = pageview;
@@ -1,45 +0,0 @@
1
- // https://developers.google.com/analytics/devguides/collection/gtagjs/pages
2
- const pageview = (url, trackingId) => {
3
- // GA 4
4
- if (window.gtag && trackingId) {
5
- window.gtag('config', trackingId, {
6
- page_path: url,
7
- });
8
- }
9
- // GA 3
10
- if (window.ga) {
11
- window.ga('send', 'pageview', url);
12
- }
13
- };
14
- const addToCart = (product) => {
15
- // GA 3
16
- if (window.ga) {
17
- window.ga('ec:addProduct', product);
18
- window.ga('send', 'event', {
19
- eventCategory: 'EnhancedEcommerce',
20
- eventAction: 'Added Product',
21
- eventLabel: undefined,
22
- nonInteraction: true,
23
- });
24
- }
25
- // GA 4
26
- if (window.gtag) {
27
- window.gtag('event', 'add_to_cart', {
28
- currency: product.currency,
29
- value: product.price,
30
- items: [
31
- {
32
- currency: product.currency,
33
- item_brand: product.brand,
34
- item_id: product.id,
35
- item_name: product.name,
36
- item_variant: product.variant,
37
- item_category: product.category,
38
- },
39
- ],
40
- debug_mode: true,
41
- });
42
- }
43
- };
44
-
45
- export { addToCart, pageview };