@codecademy/tracking 1.0.35 → 1.0.36-alpha.8d366e53b7.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.
@@ -74,7 +74,7 @@ export const createTracker = _ref => {
74
74
  client: getClientType()
75
75
  }) : userData;
76
76
  if (verbose) {
77
- console.groupCollapsed("%cTracking Event Fired: ".concat(category, ":").concat(event), 'color: #4b35ef; font-style: italic;');
77
+ console.groupCollapsed(`%cTracking Event Fired: ${category}:${event}`, 'color: #4b35ef; font-style: italic;');
78
78
  console.log({
79
79
  category,
80
80
  event,
@@ -90,14 +90,14 @@ export const createTracker = _ref => {
90
90
  if (typeof window !== 'undefined') {
91
91
  // This allows the UTM query params to get registered in the user session.
92
92
  const queryParams = window.location.search;
93
- beacon("".concat(basePath, "/").concat(category).concat(queryParams), {
93
+ beacon(`${basePath}/${category}${queryParams}`, {
94
94
  category,
95
95
  event,
96
96
  properties: JSON.stringify(properties),
97
- gdpr_safe: "".concat(options.gdprSafe)
97
+ gdpr_safe: `${options.gdprSafe}`
98
98
  });
99
99
  } else {
100
- serverSideBeacon("".concat(basePath, "/").concat(category), {
100
+ serverSideBeacon(`${basePath}/${category}`, {
101
101
  category,
102
102
  event,
103
103
  properties: JSON.stringify(properties)
@@ -110,8 +110,7 @@ export const createTracker = _ref => {
110
110
  impression: data => event('user', 'impression', data),
111
111
  visit: data => event('user', 'visit', data),
112
112
  pushDataLayerEvent: eventName => {
113
- var _ref6;
114
- ((_ref6 = window).dataLayer || (_ref6.dataLayer = [])).push({
113
+ (window.dataLayer ||= []).push({
115
114
  event: eventName
116
115
  });
117
116
  }
@@ -1,5 +1,5 @@
1
1
  export const fetchUser = async apiBaseUrl => {
2
- const response = await fetch("".concat(apiBaseUrl, "/users/web"), {
2
+ const response = await fetch(`${apiBaseUrl}/users/web`, {
3
3
  method: 'GET',
4
4
  headers: {
5
5
  'Content-type': 'application/json',
@@ -1,10 +1,9 @@
1
1
  export const OPT_OUT_DATALAYER_VAR = 'user_opted_out_external_tracking';
2
2
  export const initializeGTM = _ref => {
3
- var _scope$dataLayer;
4
3
  let scope = _ref.scope,
5
4
  environment = _ref.environment,
6
5
  optedOutExternalTracking = _ref.optedOutExternalTracking;
7
- (_scope$dataLayer = scope.dataLayer) !== null && _scope$dataLayer !== void 0 ? _scope$dataLayer : scope.dataLayer = [];
6
+ scope.dataLayer ??= [];
8
7
  scope.dataLayer.push({
9
8
  'gtm.start': new Date().getTime(),
10
9
  event: 'gtm.js'
@@ -21,7 +20,8 @@ export const initializeGTM = _ref => {
21
20
  preview_env = '&gtm_auth=VrQuCDuWXkLlTwNHJYEKTg&gtm_preview=env-232';
22
21
  }
23
22
  const gtm = document.createElement('script');
24
- gtm.async = true;
25
- gtm.src = "https://www.googletagmanager.com/gtm.js?id=GTM-KTLK85W".concat(preview_env);
23
+ gtm.src = `https://www.googletagmanager.com/gtm.js?id=GTM-KTLK85W${preview_env}`;
24
+ gtm.type = 'text/partytown';
26
25
  document.getElementsByTagName('head')[0].appendChild(gtm);
26
+ window.dispatchEvent(new CustomEvent('ptupdate'));
27
27
  };
@@ -11,15 +11,15 @@ export const initializeOneTrust = async _ref => {
11
11
  script.setAttribute('async', 'true');
12
12
  script.setAttribute('src', 'https://cdn.cookielaw.org/scripttemplates/otSDKStub.js');
13
13
  script.setAttribute('type', 'text/javascript');
14
- script.setAttribute('data-domain-script', "".concat(scriptId).concat(environment === 'production' ? '' : '-test'));
14
+ script.setAttribute('data-domain-script', `${scriptId}${environment === 'production' ? '' : '-test'}`);
15
15
  document.body.appendChild(script);
16
16
  const style = document.createElement('style');
17
17
  style.textContent = rawStyles;
18
18
  document.body.appendChild(style);
19
19
  return new Promise(resolve => {
20
20
  scope.OptanonWrapper = () => {
21
- var _scope$dataLayer, _script$parentNode;
22
- (_scope$dataLayer = scope.dataLayer) !== null && _scope$dataLayer !== void 0 ? _scope$dataLayer : scope.dataLayer = [];
21
+ var _script$parentNode;
22
+ scope.dataLayer ??= [];
23
23
  scope.dataLayer.push({
24
24
  event: 'OneTrustGroupsUpdated'
25
25
  });
@@ -31,4 +31,181 @@ export const initializeOneTrust = async _ref => {
31
31
 
32
32
  // For now, these three values duplicate theme colors from gamut-styles
33
33
  // We don't want to take a full dependency on that package here...
34
- const rawStyles = "\n:root {\n --onetrust-brand-purple: #3A10E5;\n --onetrust-color-gray-500: #828285;\n --onetrust-color-white: #fff;\n}\n\n#onetrust-banner-sdk {\n padding: 1rem !important;\n}\n#onetrust-banner-sdk > .ot-sdk-container {\n width: 100% !important;\n}\n#onetrust-banner-sdk > .ot-sdk-container > .ot-sdk-row {\n display: flex !important;\n flex-direction: column !important;\n align-items: center !important;\n max-width: 1436px !important;\n margin: 0 auto !important;\n}\n#onetrust-banner-sdk > .ot-sdk-container > .ot-sdk-row:after {\n content: none !important;\n}\n#onetrust-banner-sdk > div > .ot-sdk-container > .ot-sdk-row {\n display: flex !important;\n flex-direction: column !important;\n align-items: center !important;\n max-width: 1436px !important;\n margin: 0 auto !important;\n}\n#onetrust-banner-sdk > div > .ot-sdk-container > .ot-sdk-row:after {\n content: none !important;\n}\n#onetrust-group-container {\n display: flex !important;\n justify-content: center;\n float: none !important;\n width: 100% !important;\n max-width: 1148px !important;\n margin-left: 0 !important;\n margin-bottom: 0.625rem !important;\n}\n#onetrust-policy,\n#onetrust-policy-text {\n margin: 0 !important;\n font-size: 0.875rem !important;\n line-height: 1.375rem !important;\n text-align: center !important;\n float: none !important;\n}\n#onetrust-policy-text a {\n text-decoration: none;\n line-height: 26px !important;\n margin-left: 0 !important;\n}\n#onetrust-button-group-parent {\n position: relative !important;\n top: initial !important;\n left: initial !important;\n transform: initial !important;\n width: 264px !important;\n margin: 0 !important;\n padding: 0 !important;\n float: none !important;\n}\n#onetrust-button-group {\n display: flex !important;\n margin: 0 !important;\n}\n#onetrust-pc-btn-handler, #onetrust-accept-btn-handler {\n min-width: initial !important;\n padding: 0.375rem 1rem !important;\n margin: 0 !important;\n opacity: 1 !important;\n border-radius: 2px !important;\n line-height: 1.5 !important;\n user-select: none !important;\n font-size: 1rem !important;\n}\n#onetrust-pc-btn-handler:focus, #onetrust-accept-btn-handler:focus {\n box-shadow: 0 0 0 2px var(--onetrust-color-white), 0 0 0 4px var(--onetrust-brand-purple);\n text-decoration: none !important;\n outline: none !important;\n}\n#onetrust-pc-btn-handler{\n color: var(--onetrust-brand-purple) !important;\n border: 1px solid var(--onetrust-brand-purple)!important;\n background: var(--onetrust-color-white) !important\n}\n#onetrust-accept-btn-handler {\n color: var(--onetrust-color-white) !important;\n background: var(--onetrust-brand-purple)!important;\n margin-left: 1rem !important;\n}\n#onetrust-close-btn-container {\n display: none !important;\n}\n\n.pc-logo {\n display: none !important;\n}\n\n#accept-recommended-btn-handler,\n.ot-pc-refuse-all-handler,\n.save-preference-btn-handler {\n margin-left: 4px !important;\n font-size: 14px !important;\n}\n\n#accept-recommended-btn-handler:focus,\n#onetrust-pc-sdk .ot-pc-refuse-all-handler:focus,\n#onetrust-pc-sdk .save-preference-btn-handler:focus {\n box-shadow: 0 0 0 2px var(--onetrust-color-white), 0 0 0 4px var(--onetrust-brand-purple);\n text-decoration: none !important;\n outline: none !important;\n opacity: 1 !important;\n}\n\n.ot-switch-label {\n border: 1px solid var(--onetrust-color-gray-500) !important;\n background-color: var(--onetrust-color-gray-500) !important;\n}\n\n.ot-switch-nob {\n background: var(--onetrust-color-white) !important;\n}\n\n.ot-switch-inner:before {\n background-color: var(--onetrust-brand-purple) !important;\n}\n\n.switch-checkbox:checked+.ot-switch-label .ot-switch-nob {\n border-color: var(--onetrust-brand-purple) !important;\n}\n\n.ot-pc-footer-logo {\n display: none !important;\n}\n\n#onetrust-banner-sdk>.ot-sdk-container {\n overflow: visible !important;\n}\n\n@media (max-width: 30rem) {\n #accept-recommended-btn-handler,\n .ot-pc-refuse-all-handler,\n .save-preference-btn-handler {\n width: 96% !important;\n }\n}\n\n@media (min-width: 37.5rem) {\n #onetrust-banner-sdk {\n padding: 0.875rem 1rem !important;\n }\n}\n@media (min-width: 48rem) {\n #onetrust-banner-sdk {\n padding: 0.875rem 1.25rem !important;\n }\n}\n@media (min-width: 1650px) {\n #onetrust-banner-sdk > .ot-sdk-container > .ot-sdk-row {\n flex-direction: row !important;\n justify-content: space-between !important;\n }\n #onetrust-banner-sdk > div > .ot-sdk-container > .ot-sdk-row {\n flex-direction: row !important;\n justify-content: space-between !important;\n }\n #onetrust-group-container {\n margin-bottom: 0 !important;\n }\n #onetrust-button-group {\n flex-direction: row !important;\n }\n}\n";
34
+ const rawStyles = `
35
+ :root {
36
+ --onetrust-brand-purple: #3A10E5;
37
+ --onetrust-color-gray-500: #828285;
38
+ --onetrust-color-white: #fff;
39
+ }
40
+
41
+ #onetrust-banner-sdk {
42
+ padding: 1rem !important;
43
+ }
44
+ #onetrust-banner-sdk > .ot-sdk-container {
45
+ width: 100% !important;
46
+ }
47
+ #onetrust-banner-sdk > .ot-sdk-container > .ot-sdk-row {
48
+ display: flex !important;
49
+ flex-direction: column !important;
50
+ align-items: center !important;
51
+ max-width: 1436px !important;
52
+ margin: 0 auto !important;
53
+ }
54
+ #onetrust-banner-sdk > .ot-sdk-container > .ot-sdk-row:after {
55
+ content: none !important;
56
+ }
57
+ #onetrust-banner-sdk > div > .ot-sdk-container > .ot-sdk-row {
58
+ display: flex !important;
59
+ flex-direction: column !important;
60
+ align-items: center !important;
61
+ max-width: 1436px !important;
62
+ margin: 0 auto !important;
63
+ }
64
+ #onetrust-banner-sdk > div > .ot-sdk-container > .ot-sdk-row:after {
65
+ content: none !important;
66
+ }
67
+ #onetrust-group-container {
68
+ display: flex !important;
69
+ justify-content: center;
70
+ float: none !important;
71
+ width: 100% !important;
72
+ max-width: 1148px !important;
73
+ margin-left: 0 !important;
74
+ margin-bottom: 0.625rem !important;
75
+ }
76
+ #onetrust-policy,
77
+ #onetrust-policy-text {
78
+ margin: 0 !important;
79
+ font-size: 0.875rem !important;
80
+ line-height: 1.375rem !important;
81
+ text-align: center !important;
82
+ float: none !important;
83
+ }
84
+ #onetrust-policy-text a {
85
+ text-decoration: none;
86
+ line-height: 26px !important;
87
+ margin-left: 0 !important;
88
+ }
89
+ #onetrust-button-group-parent {
90
+ position: relative !important;
91
+ top: initial !important;
92
+ left: initial !important;
93
+ transform: initial !important;
94
+ width: 264px !important;
95
+ margin: 0 !important;
96
+ padding: 0 !important;
97
+ float: none !important;
98
+ }
99
+ #onetrust-button-group {
100
+ display: flex !important;
101
+ margin: 0 !important;
102
+ }
103
+ #onetrust-pc-btn-handler, #onetrust-accept-btn-handler {
104
+ min-width: initial !important;
105
+ padding: 0.375rem 1rem !important;
106
+ margin: 0 !important;
107
+ opacity: 1 !important;
108
+ border-radius: 2px !important;
109
+ line-height: 1.5 !important;
110
+ user-select: none !important;
111
+ font-size: 1rem !important;
112
+ }
113
+ #onetrust-pc-btn-handler:focus, #onetrust-accept-btn-handler:focus {
114
+ box-shadow: 0 0 0 2px var(--onetrust-color-white), 0 0 0 4px var(--onetrust-brand-purple);
115
+ text-decoration: none !important;
116
+ outline: none !important;
117
+ }
118
+ #onetrust-pc-btn-handler{
119
+ color: var(--onetrust-brand-purple) !important;
120
+ border: 1px solid var(--onetrust-brand-purple)!important;
121
+ background: var(--onetrust-color-white) !important
122
+ }
123
+ #onetrust-accept-btn-handler {
124
+ color: var(--onetrust-color-white) !important;
125
+ background: var(--onetrust-brand-purple)!important;
126
+ margin-left: 1rem !important;
127
+ }
128
+ #onetrust-close-btn-container {
129
+ display: none !important;
130
+ }
131
+
132
+ .pc-logo {
133
+ display: none !important;
134
+ }
135
+
136
+ #accept-recommended-btn-handler,
137
+ .ot-pc-refuse-all-handler,
138
+ .save-preference-btn-handler {
139
+ margin-left: 4px !important;
140
+ font-size: 14px !important;
141
+ }
142
+
143
+ #accept-recommended-btn-handler:focus,
144
+ #onetrust-pc-sdk .ot-pc-refuse-all-handler:focus,
145
+ #onetrust-pc-sdk .save-preference-btn-handler:focus {
146
+ box-shadow: 0 0 0 2px var(--onetrust-color-white), 0 0 0 4px var(--onetrust-brand-purple);
147
+ text-decoration: none !important;
148
+ outline: none !important;
149
+ opacity: 1 !important;
150
+ }
151
+
152
+ .ot-switch-label {
153
+ border: 1px solid var(--onetrust-color-gray-500) !important;
154
+ background-color: var(--onetrust-color-gray-500) !important;
155
+ }
156
+
157
+ .ot-switch-nob {
158
+ background: var(--onetrust-color-white) !important;
159
+ }
160
+
161
+ .ot-switch-inner:before {
162
+ background-color: var(--onetrust-brand-purple) !important;
163
+ }
164
+
165
+ .switch-checkbox:checked+.ot-switch-label .ot-switch-nob {
166
+ border-color: var(--onetrust-brand-purple) !important;
167
+ }
168
+
169
+ .ot-pc-footer-logo {
170
+ display: none !important;
171
+ }
172
+
173
+ #onetrust-banner-sdk>.ot-sdk-container {
174
+ overflow: visible !important;
175
+ }
176
+
177
+ @media (max-width: 30rem) {
178
+ #accept-recommended-btn-handler,
179
+ .ot-pc-refuse-all-handler,
180
+ .save-preference-btn-handler {
181
+ width: 96% !important;
182
+ }
183
+ }
184
+
185
+ @media (min-width: 37.5rem) {
186
+ #onetrust-banner-sdk {
187
+ padding: 0.875rem 1rem !important;
188
+ }
189
+ }
190
+ @media (min-width: 48rem) {
191
+ #onetrust-banner-sdk {
192
+ padding: 0.875rem 1.25rem !important;
193
+ }
194
+ }
195
+ @media (min-width: 1650px) {
196
+ #onetrust-banner-sdk > .ot-sdk-container > .ot-sdk-row {
197
+ flex-direction: row !important;
198
+ justify-content: space-between !important;
199
+ }
200
+ #onetrust-banner-sdk > div > .ot-sdk-container > .ot-sdk-row {
201
+ flex-direction: row !important;
202
+ justify-content: space-between !important;
203
+ }
204
+ #onetrust-group-container {
205
+ margin-bottom: 0 !important;
206
+ }
207
+ #onetrust-button-group {
208
+ flex-direction: row !important;
209
+ }
210
+ }
211
+ `;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@codecademy/tracking",
3
3
  "description": "Tracking library for Codecademy",
4
- "version": "1.0.35",
4
+ "version": "1.0.36-alpha.8d366e53b7.0",
5
5
  "author": "Codecademy Engineering <dev@codecademy.com>",
6
6
  "files": [
7
7
  "dist/**"
@@ -13,5 +13,5 @@
13
13
  "access": "public"
14
14
  },
15
15
  "repository": "git@github.com:codecademy-engineering/mono.git",
16
- "gitHead": "4fd385080837ca95c94bb8633afe4fe9d5c96098"
16
+ "gitHead": "dffbea60db2fe97d09a7b515b6587fb72bb3e231"
17
17
  }