@washingtonpost/subs-de-inputs 0.5.7 → 1.0.0-react18.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.
@@ -2,442 +2,543 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
6
-
7
5
  var subsSdk = require('@washingtonpost/subs-sdk');
8
6
  var React = require('react');
9
- var React__default = _interopDefault(React);
10
7
  var wpdsUiKit = require('@washingtonpost/wpds-ui-kit');
11
- var subsHooks = require('@washingtonpost/subs-hooks');
12
- var wpdsAssets = require('@washingtonpost/wpds-assets');
13
8
 
14
- const CollectionBehaviors = {
9
+ var CollectionBehaviors = {
15
10
  COLLECT: 'COLLECT',
16
11
  DO_NOT_COLLECT: 'DO_NOT_COLLECT'
17
12
  };
18
- const AttributesState = {
13
+ var AttributesState = {
19
14
  SUCCESS: '100'
20
15
  };
21
- const DeleteAttributeState = {
22
- SUCCESS: '150',
23
- SYSTEM_ERROR: '151',
24
- INVALID_ATTRIBUTE_NAME: '152',
25
- INVALID_ATTRIBUTE_NOT_EXISTS: '153'
26
- };
27
- const IngestType = {
28
- EXPLICIT: 'explicit',
29
- IMPLICIT: 'implicit'
30
- };
31
- const IngestResponseState = {
16
+ var IngestResponseState = {
32
17
  SUCCESS: '100',
33
18
  SYSTEM_ERROR: '101',
34
19
  INVALID_TYPE: '102',
35
20
  INVALID_IDENTIFIER: '103',
36
21
  INVALID_DATA: '104',
37
22
  INVALID_ATTRIBUTE_DEFINITION: '105',
38
- INVALID_META_DEFINITION: '106',
39
- UNAUTHENTICATED: '107',
40
- MISMATCHED_IDENTIFIER: '108',
41
- DISABLED_ATTRIBUTE_DEFINITION: '109',
42
- DO_NOT_COLLECT: '110'
23
+ INVALID_META_DEFINITION: '106'
43
24
  };
44
25
 
45
- const hasRequiredPrivacyCookies = () => {
26
+ var hasRequiredPrivacyCookies = function hasRequiredPrivacyCookies() {
46
27
  var _WPGeo;
47
28
  if (typeof window === 'undefined') {
48
29
  return false;
49
30
  }
50
- const wp_usp = subsSdk.getCookie('wp_usp');
51
- const countryCode = (_WPGeo = subsSdk.WPGeo()) === null || _WPGeo === void 0 ? void 0 : _WPGeo.country_code;
31
+ var wp_usp = subsSdk.getCookie('wp_usp');
32
+ var countryCode = (_WPGeo = subsSdk.WPGeo()) == null ? void 0 : _WPGeo.country_code;
52
33
  return !!(wp_usp && countryCode === 'US');
53
34
  };
54
35
 
55
- const base = `${subsSdk.ENDPOINTS.base}/de/v1`;
56
- const attributesCache = {};
57
- const getAttributes = async _ref => {
58
- let {
59
- fieldName
60
- } = _ref;
61
- if (attributesCache[fieldName]) {
62
- return attributesCache[fieldName];
36
+ function _regeneratorRuntime() {
37
+ _regeneratorRuntime = function () {
38
+ return e;
39
+ };
40
+ var t,
41
+ e = {},
42
+ r = Object.prototype,
43
+ n = r.hasOwnProperty,
44
+ o = Object.defineProperty || function (t, e, r) {
45
+ t[e] = r.value;
46
+ },
47
+ i = "function" == typeof Symbol ? Symbol : {},
48
+ a = i.iterator || "@@iterator",
49
+ c = i.asyncIterator || "@@asyncIterator",
50
+ u = i.toStringTag || "@@toStringTag";
51
+ function define(t, e, r) {
52
+ return Object.defineProperty(t, e, {
53
+ value: r,
54
+ enumerable: !0,
55
+ configurable: !0,
56
+ writable: !0
57
+ }), t[e];
63
58
  }
64
- const fieldNames = [fieldName];
65
59
  try {
66
- const url = new URL(`${base}/attributes`);
67
- url.searchParams.set('attributes', fieldNames.join(','));
68
- const data = await fetch(url.toString(), {
69
- credentials: 'include',
70
- headers: subsSdk.JSON_HEADERS
71
- });
72
- const json = await data.json();
73
- if (data.ok && json.status === subsSdk.ResponseStatus.SUCCESS) {
74
- const attributes = json.attributes || [];
75
- attributesCache[fieldName] = attributes;
76
- return attributes;
77
- } else {
78
- return [];
79
- }
80
- } catch (e) {
81
- console.debug(e);
82
- return [];
60
+ define({}, "");
61
+ } catch (t) {
62
+ define = function (t, e, r) {
63
+ return t[e] = r;
64
+ };
83
65
  }
84
- };
85
-
86
- const sendGAEvent = props => {
87
- if (typeof window === 'undefined') {
88
- if (process.env.NODE_ENV !== "production") console.warn('NO WINDOW');
89
- return;
66
+ function wrap(t, e, r, n) {
67
+ var i = e && e.prototype instanceof Generator ? e : Generator,
68
+ a = Object.create(i.prototype),
69
+ c = new Context(n || []);
70
+ return o(a, "_invoke", {
71
+ value: makeInvokeMethod(t, r, c)
72
+ }), a;
90
73
  }
91
- // Initialize dataLayer if needed
92
- window.dataLayer = window.dataLayer || [];
93
- const eventData = {
94
- ...props
95
- };
96
- window.dataLayer.push(eventData);
97
- };
98
- const sendToGA = async _ref => {
99
- let {
100
- submitData: {
101
- fieldName,
102
- value
103
- },
104
- source
105
- } = _ref;
106
- sendGAEvent({
107
- event: 'site-onpage-click',
108
- action: 'site-onpage-click',
109
- category: 'profile',
110
- label: fieldName,
111
- 'de-label': fieldName,
112
- [fieldName]: value,
113
- section: 'profile',
114
- subsection: source
74
+ function tryCatch(t, e, r) {
75
+ try {
76
+ return {
77
+ type: "normal",
78
+ arg: t.call(e, r)
79
+ };
80
+ } catch (t) {
81
+ return {
82
+ type: "throw",
83
+ arg: t
84
+ };
85
+ }
86
+ }
87
+ e.wrap = wrap;
88
+ var h = "suspendedStart",
89
+ l = "suspendedYield",
90
+ f = "executing",
91
+ s = "completed",
92
+ y = {};
93
+ function Generator() {}
94
+ function GeneratorFunction() {}
95
+ function GeneratorFunctionPrototype() {}
96
+ var p = {};
97
+ define(p, a, function () {
98
+ return this;
115
99
  });
116
- return true;
117
- };
118
-
119
- const base$1 = `${subsSdk.ENDPOINTS.base}/de/v1`;
120
- const ingest = async _ref => {
121
- let {
122
- submitData: {
123
- fieldName,
124
- value
125
- },
126
- source
127
- } = _ref;
128
- const url = `${base$1}/ingest`;
129
- const wapo_login_id = subsSdk.getCookie('wapo_login_id');
130
- const jucid = localStorage.getItem('uuid');
131
- const ga = subsSdk.getCookie('_ga');
132
- const payload = {
133
- jucid,
134
- ga,
135
- type: IngestType.EXPLICIT,
136
- wapo_login_id,
137
- data: {
138
- [fieldName]: [value]
139
- },
140
- metadata: {
141
- source
100
+ var d = Object.getPrototypeOf,
101
+ v = d && d(d(values([])));
102
+ v && v !== r && n.call(v, a) && (p = v);
103
+ var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p);
104
+ function defineIteratorMethods(t) {
105
+ ["next", "throw", "return"].forEach(function (e) {
106
+ define(t, e, function (t) {
107
+ return this._invoke(e, t);
108
+ });
109
+ });
110
+ }
111
+ function AsyncIterator(t, e) {
112
+ function invoke(r, o, i, a) {
113
+ var c = tryCatch(t[r], t, o);
114
+ if ("throw" !== c.type) {
115
+ var u = c.arg,
116
+ h = u.value;
117
+ return h && "object" == typeof h && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) {
118
+ invoke("next", t, i, a);
119
+ }, function (t) {
120
+ invoke("throw", t, i, a);
121
+ }) : e.resolve(h).then(function (t) {
122
+ u.value = t, i(u);
123
+ }, function (t) {
124
+ return invoke("throw", t, i, a);
125
+ });
126
+ }
127
+ a(c.arg);
142
128
  }
143
- };
144
- try {
145
- const response = await fetch(url, {
146
- method: 'POST',
147
- credentials: 'include',
148
- headers: subsSdk.JSON_HEADERS,
149
- body: JSON.stringify(payload)
129
+ var r;
130
+ o(this, "_invoke", {
131
+ value: function (t, n) {
132
+ function callInvokeWithMethodAndArg() {
133
+ return new e(function (e, r) {
134
+ invoke(t, n, e, r);
135
+ });
136
+ }
137
+ return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg();
138
+ }
150
139
  });
151
- const json = await response.json();
152
- return json;
153
- } catch (e) {
154
- console.debug(e);
155
- return null;
156
140
  }
157
- };
158
-
159
- const isAnonymousWebview = () => {
160
- if (typeof window === 'undefined') {
161
- return false;
141
+ function makeInvokeMethod(e, r, n) {
142
+ var o = h;
143
+ return function (i, a) {
144
+ if (o === f) throw Error("Generator is already running");
145
+ if (o === s) {
146
+ if ("throw" === i) throw a;
147
+ return {
148
+ value: t,
149
+ done: !0
150
+ };
151
+ }
152
+ for (n.method = i, n.arg = a;;) {
153
+ var c = n.delegate;
154
+ if (c) {
155
+ var u = maybeInvokeDelegate(c, n);
156
+ if (u) {
157
+ if (u === y) continue;
158
+ return u;
159
+ }
160
+ }
161
+ if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) {
162
+ if (o === h) throw o = s, n.arg;
163
+ n.dispatchException(n.arg);
164
+ } else "return" === n.method && n.abrupt("return", n.arg);
165
+ o = f;
166
+ var p = tryCatch(e, r, n);
167
+ if ("normal" === p.type) {
168
+ if (o = n.done ? s : l, p.arg === y) continue;
169
+ return {
170
+ value: p.arg,
171
+ done: n.done
172
+ };
173
+ }
174
+ "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg);
175
+ }
176
+ };
162
177
  }
163
- const wp_wv = subsSdk.getCookie('wp_wv');
164
- return !!(wp_wv && !subsSdk.isLoggedIn());
165
- };
166
-
167
- const push = async _ref => {
168
- let {
169
- submitData,
170
- source
171
- } = _ref;
172
- if (!hasRequiredPrivacyCookies()) {
173
- throw new Error('does not satisfy cookie check');
178
+ function maybeInvokeDelegate(e, r) {
179
+ var n = r.method,
180
+ o = e.iterator[n];
181
+ if (o === t) return r.delegate = null, "throw" === n && e.iterator.return && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y;
182
+ var i = tryCatch(o, e.iterator, r.arg);
183
+ if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y;
184
+ var a = i.arg;
185
+ return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y);
174
186
  }
175
- if (isAnonymousWebview()) {
176
- throw new Error('does not satisfy cookie check');
187
+ function pushTryEntry(t) {
188
+ var e = {
189
+ tryLoc: t[0]
190
+ };
191
+ 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e);
177
192
  }
178
- const {
179
- fieldName
180
- } = submitData;
181
- const attributeInfo = await getAttributes({
182
- fieldName
183
- });
184
- if (attributeInfo[0] && attributeInfo[0].name === fieldName && attributeInfo[0].collection_behavior === CollectionBehaviors.DO_NOT_COLLECT) {
185
- throw new Error('do not collect');
193
+ function resetTryEntry(t) {
194
+ var e = t.completion || {};
195
+ e.type = "normal", delete e.arg, t.completion = e;
186
196
  }
187
- const type = attributeInfo[0] && attributeInfo[0].explicit === true ? IngestType.EXPLICIT : IngestType.IMPLICIT;
188
- if (!attributeInfo[0] && process.env.NODE_ENV !== "production") {
189
- console.warn(`no attribute info found for ${fieldName}, assuming implicit`);
197
+ function Context(t) {
198
+ this.tryEntries = [{
199
+ tryLoc: "root"
200
+ }], t.forEach(pushTryEntry, this), this.reset(!0);
190
201
  }
191
- if (type === IngestType.EXPLICIT) {
192
- return ingest({
193
- submitData,
194
- source
195
- });
196
- } else {
197
- return sendToGA({
198
- submitData,
199
- source
202
+ function values(e) {
203
+ if (e || "" === e) {
204
+ var r = e[a];
205
+ if (r) return r.call(e);
206
+ if ("function" == typeof e.next) return e;
207
+ if (!isNaN(e.length)) {
208
+ var o = -1,
209
+ i = function next() {
210
+ for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next;
211
+ return next.value = t, next.done = !0, next;
212
+ };
213
+ return i.next = i;
214
+ }
215
+ }
216
+ throw new TypeError(typeof e + " is not iterable");
217
+ }
218
+ return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", {
219
+ value: GeneratorFunctionPrototype,
220
+ configurable: !0
221
+ }), o(GeneratorFunctionPrototype, "constructor", {
222
+ value: GeneratorFunction,
223
+ configurable: !0
224
+ }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) {
225
+ var e = "function" == typeof t && t.constructor;
226
+ return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name));
227
+ }, e.mark = function (t) {
228
+ return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t;
229
+ }, e.awrap = function (t) {
230
+ return {
231
+ __await: t
232
+ };
233
+ }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () {
234
+ return this;
235
+ }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) {
236
+ void 0 === i && (i = Promise);
237
+ var a = new AsyncIterator(wrap(t, r, n, o), i);
238
+ return e.isGeneratorFunction(r) ? a : a.next().then(function (t) {
239
+ return t.done ? t.value : a.next();
200
240
  });
241
+ }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () {
242
+ return this;
243
+ }), define(g, "toString", function () {
244
+ return "[object Generator]";
245
+ }), e.keys = function (t) {
246
+ var e = Object(t),
247
+ r = [];
248
+ for (var n in e) r.push(n);
249
+ return r.reverse(), function next() {
250
+ for (; r.length;) {
251
+ var t = r.pop();
252
+ if (t in e) return next.value = t, next.done = !1, next;
253
+ }
254
+ return next.done = !0, next;
255
+ };
256
+ }, e.values = values, Context.prototype = {
257
+ constructor: Context,
258
+ reset: function (e) {
259
+ if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t);
260
+ },
261
+ stop: function () {
262
+ this.done = !0;
263
+ var t = this.tryEntries[0].completion;
264
+ if ("throw" === t.type) throw t.arg;
265
+ return this.rval;
266
+ },
267
+ dispatchException: function (e) {
268
+ if (this.done) throw e;
269
+ var r = this;
270
+ function handle(n, o) {
271
+ return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o;
272
+ }
273
+ for (var o = this.tryEntries.length - 1; o >= 0; --o) {
274
+ var i = this.tryEntries[o],
275
+ a = i.completion;
276
+ if ("root" === i.tryLoc) return handle("end");
277
+ if (i.tryLoc <= this.prev) {
278
+ var c = n.call(i, "catchLoc"),
279
+ u = n.call(i, "finallyLoc");
280
+ if (c && u) {
281
+ if (this.prev < i.catchLoc) return handle(i.catchLoc, !0);
282
+ if (this.prev < i.finallyLoc) return handle(i.finallyLoc);
283
+ } else if (c) {
284
+ if (this.prev < i.catchLoc) return handle(i.catchLoc, !0);
285
+ } else {
286
+ if (!u) throw Error("try statement without catch or finally");
287
+ if (this.prev < i.finallyLoc) return handle(i.finallyLoc);
288
+ }
289
+ }
290
+ }
291
+ },
292
+ abrupt: function (t, e) {
293
+ for (var r = this.tryEntries.length - 1; r >= 0; --r) {
294
+ var o = this.tryEntries[r];
295
+ if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) {
296
+ var i = o;
297
+ break;
298
+ }
299
+ }
300
+ i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null);
301
+ var a = i ? i.completion : {};
302
+ return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a);
303
+ },
304
+ complete: function (t, e) {
305
+ if ("throw" === t.type) throw t.arg;
306
+ return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y;
307
+ },
308
+ finish: function (t) {
309
+ for (var e = this.tryEntries.length - 1; e >= 0; --e) {
310
+ var r = this.tryEntries[e];
311
+ if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y;
312
+ }
313
+ },
314
+ catch: function (t) {
315
+ for (var e = this.tryEntries.length - 1; e >= 0; --e) {
316
+ var r = this.tryEntries[e];
317
+ if (r.tryLoc === t) {
318
+ var n = r.completion;
319
+ if ("throw" === n.type) {
320
+ var o = n.arg;
321
+ resetTryEntry(r);
322
+ }
323
+ return o;
324
+ }
325
+ }
326
+ throw Error("illegal catch attempt");
327
+ },
328
+ delegateYield: function (e, r, n) {
329
+ return this.delegate = {
330
+ iterator: values(e),
331
+ resultName: r,
332
+ nextLoc: n
333
+ }, "next" === this.method && (this.arg = t), y;
334
+ }
335
+ }, e;
336
+ }
337
+ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
338
+ try {
339
+ var info = gen[key](arg);
340
+ var value = info.value;
341
+ } catch (error) {
342
+ reject(error);
343
+ return;
201
344
  }
202
- };
203
-
204
- const StyledMobileSelect = /*#__PURE__*/wpdsUiKit.styled('select', {
205
- padding: '12px 16px 12px 6px',
206
- display: 'flex',
207
- justifyContent: 'space-between',
208
- width: '100%',
209
- backgroundColor: '$secondary',
210
- color: '$primary',
211
- fontFamily: '$meta',
212
- fontSize: '$100',
213
- fontWeight: '$light',
214
- lineHeight: '$125',
215
- paddingBlockRight: '$125',
216
- textOverflow: 'ellipsis',
217
- position: 'relative',
218
- borderColor: 'transparent',
219
- borderRightWidth: '10px',
220
- borderRightColor: 'transparent',
221
- appearance: 'none',
222
- '-webkit-appearance': 'none',
223
- '&:disabled': {
224
- backgroundColor: wpdsUiKit.theme.colors.disabled,
225
- borderColor: wpdsUiKit.theme.colors.disabled,
226
- color: wpdsUiKit.theme.colors.onDisabled,
227
- cursor: 'not-allowed'
345
+ if (info.done) {
346
+ resolve(value);
347
+ } else {
348
+ Promise.resolve(value).then(_next, _throw);
228
349
  }
229
- });
230
- const StyledSelectWrapper = /*#__PURE__*/wpdsUiKit.styled('div', {
231
- width: '100%',
232
- maxWidth: '380px',
233
- borderRadius: '$012',
234
- borderColor: '$subtle',
235
- borderStyle: 'solid',
236
- borderWidth: '1px',
237
- backgroundColor: '$secondary',
238
- position: 'relative'
239
- });
240
- const StyledMobileOption = /*#__PURE__*/wpdsUiKit.styled('option', {
241
- fontFamily: 'inherit',
242
- fontSize: 'inherit',
243
- color: 'inherit'
244
- });
245
- /**
246
- * Dropdown component. Uses wpds-ui-kit on desktop and native select on mobile.
247
- * @param {IDropdownProps} props The props.
248
- * @returns {React.ReactElement} The dropdown.
249
- */
250
- const Dropdown = _ref => {
251
- let {
252
- id,
253
- label,
254
- values,
255
- required = false,
256
- defaultValue,
257
- onChange = () => {},
258
- disabled = false
259
- } = _ref;
260
- const [answer, setAnswer] = React.useState();
261
- const {
262
- isMobileSize
263
- } = subsHooks.useWindowSize();
264
- React.useEffect(() => {
265
- if (answer) onChange(answer);
266
- }, [answer]);
267
- const disabledProp = disabled ? {
268
- disabled: true
269
- } : {};
270
- // helps maintain state between WPDS and native dropdowns
271
- const defaultValueProp = answer ? {
272
- defaultValue: answer
273
- } : defaultValue ? {
274
- defaultValue
275
- } : {};
276
- const defaultValuePropMobile = value => {
277
- if (answer) {
278
- return value === answer ? {
279
- selected: true
280
- } : {};
281
- }
282
- return value === defaultValue ? {
283
- selected: true
284
- } : {};
350
+ }
351
+ function _asyncToGenerator(fn) {
352
+ return function () {
353
+ var self = this,
354
+ args = arguments;
355
+ return new Promise(function (resolve, reject) {
356
+ var gen = fn.apply(self, args);
357
+ function _next(value) {
358
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
359
+ }
360
+ function _throw(err) {
361
+ asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
362
+ }
363
+ _next(undefined);
364
+ });
285
365
  };
286
- return isMobileSize ? React__default.createElement(StyledSelectWrapper, null, React__default.createElement(StyledMobileSelect, {
287
- id: "",
288
- required: required,
289
- onChange: e => setAnswer(e.target.value),
290
- placeholder: label,
291
- ...disabledProp
292
- }, React__default.createElement("label", null, label), React__default.createElement(StyledMobileOption, {
293
- value: "",
294
- disabled: true,
295
- selected: true,
296
- style: {
297
- color: '#666666'
298
- }
299
- }, label), values.map(value => React__default.createElement(StyledMobileOption, {
300
- value: value,
301
- key: value,
302
- ...defaultValuePropMobile(value)
303
- }, value))), React__default.createElement(wpdsUiKit.Icon, {
304
- label: "",
305
- size: "100",
306
- fill: wpdsUiKit.theme.colors['gray80'],
307
- style: {
308
- pointerEvents: 'none',
309
- position: 'absolute',
310
- right: '10px',
311
- top: '50%',
312
- transform: 'translateY(-50%)'
313
- }
314
- }, React__default.createElement(wpdsAssets.ChevronDown, {
315
- style: {
316
- position: 'absolute',
317
- right: '10px'
366
+ }
367
+ function _extends() {
368
+ _extends = Object.assign ? Object.assign.bind() : function (target) {
369
+ for (var i = 1; i < arguments.length; i++) {
370
+ var source = arguments[i];
371
+ for (var key in source) {
372
+ if (Object.prototype.hasOwnProperty.call(source, key)) {
373
+ target[key] = source[key];
374
+ }
375
+ }
318
376
  }
319
- }))) : React__default.createElement(wpdsUiKit.Select.Root, {
320
- onValueChange: e => setAnswer(e),
321
- required: required,
322
- ...defaultValueProp,
323
- ...disabledProp
324
- }, React__default.createElement(wpdsUiKit.Select.Trigger, {
325
- "data-test-id": `${id}-select-trigger`
326
- }, React__default.createElement(wpdsUiKit.Select.Label, null, label), React__default.createElement(wpdsUiKit.Select.Value, null)), React__default.createElement(wpdsUiKit.Select.Content, {
327
- css: {
328
- zIndex: wpdsUiKit.theme.zIndices.page
329
- },
330
- "data-test-id": `${id}-select-content`
331
- }, values.map(value => React__default.createElement(wpdsUiKit.Select.Item, {
332
- value: value,
333
- key: value
334
- }, value))));
335
- };
377
+ return target;
378
+ };
379
+ return _extends.apply(this, arguments);
380
+ }
336
381
 
337
- const scriptSrc = `${subsSdk.ENDPOINTS.staticAssets === 'https://subscribe.washingtonpost.com/static' ? 'https://www.washingtonpost.com/subscribe/static/' : subsSdk.ENDPOINTS.staticAssets}/de-utils/twpdeu.min.js`;
338
- const DESelect = _ref => {
339
- let {
340
- source,
341
- fieldName,
342
- label,
343
- dataDictionaryConfig,
344
- defaultValue,
345
- disabled,
346
- submit,
347
- onChange = () => {},
348
- onFinished = () => {},
349
- valuesFilter = () => true,
350
- children
351
- } = _ref;
352
- const [config, setConfig] = React.useState(dataDictionaryConfig);
353
- const [selected, setSelected] = React.useState('');
354
- const scriptStatus = subsHooks.useScript(scriptSrc);
355
- React.useEffect(() => {
356
- const fetchConfig = async () => {
357
- try {
358
- var _window;
359
- const config = await ((_window = window) === null || _window === void 0 || (_window = _window.__twpdeu) === null || _window === void 0 ? void 0 : _window.getFieldConfigs({
360
- fieldName
361
- }));
362
- if (config) {
363
- setConfig(config[0]);
364
- } else {
365
- console.error('unable to get config', fieldName);
366
- }
367
- } catch (e) {
368
- console.warn('unable to get config', fieldName, e);
382
+ var base = subsSdk.ENDPOINTS.base + "/de/v1";
383
+ var attributesCache = {};
384
+ var getAttributes = /*#__PURE__*/function () {
385
+ var _ref2 = /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(_ref) {
386
+ var fieldName, fieldNames, url, data, json, attributes;
387
+ return _regeneratorRuntime().wrap(function _callee$(_context) {
388
+ while (1) switch (_context.prev = _context.next) {
389
+ case 0:
390
+ fieldName = _ref.fieldName;
391
+ if (!attributesCache[fieldName]) {
392
+ _context.next = 3;
393
+ break;
394
+ }
395
+ return _context.abrupt("return", attributesCache[fieldName]);
396
+ case 3:
397
+ fieldNames = [fieldName];
398
+ _context.prev = 4;
399
+ url = new URL(base + "/attributes");
400
+ url.searchParams.set('attributes', fieldNames.join(','));
401
+ _context.next = 9;
402
+ return fetch(url.toString(), {
403
+ credentials: 'include',
404
+ headers: subsSdk.JSON_HEADERS
405
+ });
406
+ case 9:
407
+ data = _context.sent;
408
+ _context.next = 12;
409
+ return data.json();
410
+ case 12:
411
+ json = _context.sent;
412
+ if (!(data.ok && json.status === subsSdk.ResponseStatus.SUCCESS)) {
413
+ _context.next = 19;
414
+ break;
415
+ }
416
+ attributes = json.attributes || [];
417
+ attributesCache[fieldName] = attributes;
418
+ return _context.abrupt("return", attributes);
419
+ case 19:
420
+ return _context.abrupt("return", []);
421
+ case 20:
422
+ _context.next = 26;
423
+ break;
424
+ case 22:
425
+ _context.prev = 22;
426
+ _context.t0 = _context["catch"](4);
427
+ console.debug(_context.t0);
428
+ return _context.abrupt("return", []);
429
+ case 26:
430
+ case "end":
431
+ return _context.stop();
369
432
  }
370
- };
371
- if (scriptStatus === subsHooks.ScriptStatus.READY && !(children || config)) {
372
- fetchConfig();
433
+ }, _callee, null, [[4, 22]]);
434
+ }));
435
+ return function getAttributes(_x) {
436
+ return _ref2.apply(this, arguments);
437
+ };
438
+ }();
439
+
440
+ var DESelect = function DESelect(_ref) {
441
+ var source = _ref.source,
442
+ fieldName = _ref.fieldName,
443
+ label = _ref.label,
444
+ dataDictionaryConfig = _ref.dataDictionaryConfig,
445
+ defaultValue = _ref.defaultValue,
446
+ disabled = _ref.disabled,
447
+ submit = _ref.submit,
448
+ _ref$onChange = _ref.onChange,
449
+ onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
450
+ _ref$onFinished = _ref.onFinished,
451
+ onFinished = _ref$onFinished === void 0 ? function () {} : _ref$onFinished,
452
+ _ref$valuesFilter = _ref.valuesFilter,
453
+ valuesFilter = _ref$valuesFilter === void 0 ? function () {
454
+ return true;
455
+ } : _ref$valuesFilter,
456
+ children = _ref.children;
457
+ var _useState = React.useState(dataDictionaryConfig),
458
+ config = _useState[0],
459
+ setConfig = _useState[1];
460
+ var _useState2 = React.useState(''),
461
+ selected = _useState2[0],
462
+ setSelected = _useState2[1];
463
+ React.useEffect(function () {
464
+ if (children) {
465
+ {
466
+ console.debug('childen props', children);
467
+ }
468
+ return;
373
469
  }
374
- }, [scriptStatus]);
375
- React.useEffect(() => {
376
- const submitSelected = async () => {
377
- try {
378
- var _window2;
379
- const result = await ((_window2 = window) === null || _window2 === void 0 || (_window2 = _window2.__twpdeu) === null || _window2 === void 0 ? void 0 : _window2.push({
380
- submitData: {
381
- fieldName,
382
- value: selected
383
- },
384
- source
385
- }));
386
- const isError = result === true ? false : result ? result.status !== subsSdk.ResponseStatus.SUCCESS : true;
387
- onFinished({
388
- isFinished: true,
389
- isError
390
- });
391
- } catch (e) {
392
- onFinished({
393
- isFinished: false,
394
- isError: true
395
- });
470
+ if (!config) {
471
+ _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
472
+ var config;
473
+ return _regeneratorRuntime().wrap(function _callee$(_context) {
474
+ while (1) switch (_context.prev = _context.next) {
475
+ case 0:
476
+ _context.next = 2;
477
+ return getAttributes({
478
+ fieldName: fieldName
479
+ });
480
+ case 2:
481
+ config = _context.sent;
482
+ {
483
+ console.debug('config from API', config);
484
+ }
485
+ setConfig(config[0]);
486
+ case 5:
487
+ case "end":
488
+ return _context.stop();
489
+ }
490
+ }, _callee);
491
+ }))();
492
+ }
493
+ }, []);
494
+ React.useEffect(function () {
495
+ if (submit && selected) {
496
+ {
497
+ console.error('push not implemented', selected, source);
396
498
  }
397
- };
398
- if (scriptStatus === subsHooks.ScriptStatus.READY && submit && selected) {
399
- submitSelected();
499
+ onFinished({
500
+ isFinished: true,
501
+ isError: false
502
+ });
400
503
  }
401
- }, [scriptStatus, submit]);
402
- const defaultValueProp = defaultValue && config ? {
403
- defaultValue
504
+ }, [submit, selected]);
505
+ if (!(children || config)) {
506
+ return React.createElement("span", null, "loading");
507
+ }
508
+ var defaultValueProp = defaultValue ? {
509
+ defaultValue: defaultValue
404
510
  } : {};
405
- const isLoading = !(children || config);
406
- const disabledProp = disabled || isLoading ? {
511
+ var disabledProp = disabled ? {
407
512
  disabled: true
408
513
  } : {};
409
514
  // sort and filter out archived values
410
- // Note: config.values may be readonly
411
- const values = config ? [...config.values].sort((a, b) => a.order - b.order).filter(value => value.archived !== true).filter(valuesFilter) : [];
412
- return React__default.createElement(SelectWrapper, null, children && React__default.createElement(wpdsUiKit.Select.Root, {
413
- onValueChange: e => {
414
- setSelected(e);
515
+ var values = config ? config.values.sort(function (a, b) {
516
+ return a.order - b.order;
517
+ }).filter(function (value) {
518
+ return value.archived !== true;
519
+ }).filter(valuesFilter) : [];
520
+ return React.createElement(SelectWrapper, null, React.createElement(wpdsUiKit.Select.Root, _extends({
521
+ onValueChange: function onValueChange(e) {
415
522
  onChange({
416
523
  value: e
417
524
  });
418
- },
419
- ...defaultValueProp,
420
- ...disabledProp
421
- }, children), !children && !config && React__default.createElement(Dropdown, {
422
- id: 'loading',
423
- label: 'Loading...',
424
- values: [],
425
- disabled: true
426
- }), !children && config && React__default.createElement(Dropdown, {
427
- id: config.name,
428
- label: label || config.name,
429
- onChange: e => {
430
525
  setSelected(e);
431
- onChange({
432
- value: e
433
- });
526
+ }
527
+ }, defaultValueProp, disabledProp), children || null, !children && config && React.createElement(React.Fragment, null, React.createElement(wpdsUiKit.Select.Trigger, {
528
+ "data-test-id": config.name + "-select-trigger"
529
+ }, React.createElement(wpdsUiKit.Select.Label, null, label || config.name), React.createElement(wpdsUiKit.Select.Value, null)), React.createElement(wpdsUiKit.Select.Content, {
530
+ css: {
531
+ zIndex: wpdsUiKit.theme.zIndices.page
434
532
  },
435
- values: values.map(value => value.name),
436
- defaultValue: defaultValue,
437
- disabled: disabled
438
- }));
533
+ "data-test-id": config.name + "-select-content"
534
+ }, values.map(function (value) {
535
+ return React.createElement(wpdsUiKit.Select.Item, {
536
+ value: value.name,
537
+ key: value.name
538
+ }, value.name);
539
+ })))));
439
540
  };
440
- const SelectWrapper = /*#__PURE__*/wpdsUiKit.styled('div', {
541
+ var SelectWrapper = /*#__PURE__*/wpdsUiKit.styled('div', {
441
542
  boxSizing: 'border-box',
442
543
  display: 'flex',
443
544
  marginBottom: '$100',
@@ -450,216 +551,10 @@ const SelectWrapper = /*#__PURE__*/wpdsUiKit.styled('div', {
450
551
  }
451
552
  });
452
553
 
453
- const configSrc = `${subsSdk.ENDPOINTS.base === 'https://subscribe.washingtonpost.com' ? 'https://www.washingtonpost.com/subscribe' : subsSdk.ENDPOINTS.base}/config/de/disclosure.json`;
454
- const getConfig = async () => {
455
- let myConfig = undefined;
456
- // step 1: fetch config
457
- const response = await fetch(configSrc);
458
- const remoteConfig = await response.json();
459
- // step 2: figure out which part of the config to use
460
- // if country- or region-specific config found, use that
461
- const {
462
- country_code,
463
- intl_region
464
- } = subsSdk.WPGeo();
465
- Object.keys(remoteConfig).forEach(configKey => {
466
- if (country_code && configKey.split('|').includes(country_code.toLowerCase())) {
467
- myConfig = remoteConfig[configKey];
468
- } else if (intl_region === 'EEA' && configKey === 'eea') {
469
- myConfig = remoteConfig[configKey];
470
- }
471
- });
472
- // TODO: Check for billing country also
473
- // else if no country-specific config, use the default config
474
- if (typeof myConfig === 'undefined' && remoteConfig['_']) {
475
- myConfig = remoteConfig['_'];
476
- }
477
- return myConfig;
478
- };
479
-
480
- const hydrateLinks = str => {
481
- const array = str.split(/({{PRIVACY_POLICY}})/g);
482
- const chunks = array.map(str => {
483
- if (str === '{{PRIVACY_POLICY}}') {
484
- return React__default.createElement("a", {
485
- target: "_blank",
486
- style: {
487
- color: 'inherit'
488
- },
489
- className: "underline",
490
- href: "https://www.washingtonpost.com/privacy-policy/"
491
- }, "Privacy Policy");
492
- }
493
- return str;
494
- });
495
- const toReturn = chunks.reduce((prev, current) => React__default.createElement(React__default.Fragment, null, prev, current), React__default.createElement(React__default.Fragment, null));
496
- return toReturn;
497
- };
498
-
499
- const COOKIE = 'OptanonAlertBoxClosed';
500
- const checkCookie = () => {
501
- const value = subsSdk.getCookie(COOKIE) || '';
502
- // Wed May 15 2024 06:29:23 GMT-0500 (Central Daylight Time)
503
- // "Invalid date" is 12 characters long
504
- return value.length > 12;
505
- };
506
-
507
- const COOKIE$1 = 'OptanonAlertBoxClosed';
508
- const useOneTrustAlertBoxClosed = _ref => {
509
- let {
510
- allowCookieStore
511
- } = _ref;
512
- const [alertBoxClosed, setAlertBoxClosed] = React.useState();
513
- const [listenToCookieStore, setListenToCookieStore] = React.useState(false);
514
- const [listenToTcfApi, setListenToTcfApi] = React.useState(false);
515
- React.useEffect(() => {
516
- var _window;
517
- if (checkCookie()) {
518
- setAlertBoxClosed(true);
519
- return;
520
- }
521
- if (!window.__tcfapi) {
522
- console.warn('warning: __tcfapi not found');
523
- }
524
- if ((_window = window) !== null && _window !== void 0 && _window.cookieStore && allowCookieStore) {
525
- setListenToCookieStore(true);
526
- } else if (window.__tcfapi) {
527
- setListenToTcfApi(true);
528
- } else {
529
- console.warn('warning: neither cookieStore nor __tcfapi found');
530
- }
531
- }, []);
532
- React.useEffect(() => {
533
- let cleanupFn = () => {};
534
- if (listenToCookieStore && window.cookieStore) {
535
- cleanupFn = subsSdk.listenToCookieStore(COOKIE$1, () => {
536
- if (checkCookie()) {
537
- setAlertBoxClosed(true);
538
- } else {
539
- setAlertBoxClosed(false);
540
- }
541
- });
542
- }
543
- return cleanupFn || (() => {});
544
- }, [listenToCookieStore]);
545
- React.useEffect(() => {
546
- let listenerId;
547
- if (listenToTcfApi && window.__tcfapi) {
548
- const callback = (_tcData, success) => {
549
- if (success) {
550
- listenerId = _tcData.listenerId;
551
- // tcData.eventStatus can be:
552
- // tcloaded means user has made a choice and we’re ready to check it
553
- // cmpuishown means the banner is shown
554
- // useractioncomplete means the user has interacted with the banner
555
- // but actually if the result for any of these is true, we just use the value of the cookie
556
- if (checkCookie()) {
557
- setAlertBoxClosed(true);
558
- }
559
- }
560
- };
561
- window.__tcfapi('addEventListener', 2, callback);
562
- }
563
- // cleanup fn
564
- return () => {
565
- if (window.__tcfapi && listenerId) window.__tcfapi('removeEventListener', 2, success => {
566
- console.debug(success);
567
- }, listenerId);
568
- };
569
- }, [listenToTcfApi]);
570
- return {
571
- alertBoxClosed,
572
- listenToCookieStore,
573
- listenToTcfApi
574
- };
575
- };
576
-
577
- const DEDisclosure = _ref => {
578
- let {
579
- onFinished = () => {},
580
- allowCookieStore = true
581
- } = _ref;
582
- const [disclosure, setDisclosure] = React.useState(null);
583
- const [disclosureRendering, setDisclosureRendering] = React.useState(null);
584
- const [myConfig, setMyConfig] = React.useState();
585
- const {
586
- alertBoxClosed
587
- } = useOneTrustAlertBoxClosed({
588
- allowCookieStore
589
- });
590
- React.useEffect(() => {
591
- (async () => {
592
- const config = await getConfig();
593
- setMyConfig(config);
594
- if (!config) {
595
- console.error('No config found');
596
- }
597
- })();
598
- }, []);
599
- React.useEffect(() => {
600
- if (myConfig) {
601
- // step 3: set disclosure based on config
602
- // if config says to check onetrust, check onetrust
603
- if ('checkBannerStatus' in myConfig && myConfig.checkBannerStatus) {
604
- // check if onetrust is closed
605
- // if it is, show the after banner disclosure
606
- // if it is not, show the before banner disclosure
607
- if (alertBoxClosed) {
608
- setDisclosure(myConfig.disclosure_afterbanner);
609
- } else {
610
- setDisclosure(myConfig.disclosure_beforebanner);
611
- }
612
- } else if ('disclosure' in myConfig) {
613
- setDisclosure(myConfig.disclosure);
614
- } else {
615
- console.error('Invalid config');
616
- }
617
- }
618
- }, [myConfig, alertBoxClosed]);
619
- React.useEffect(() => {
620
- if (disclosure && Array.isArray(disclosure)) {
621
- setDisclosureRendering(disclosure.reduce((prev, current) => {
622
- return React__default.createElement(React__default.Fragment, null, prev, React__default.createElement("p", null, hydrateLinks(current)));
623
- }, React__default.createElement(React__default.Fragment, null)));
624
- // Is it ok to fire `onFinished` if still waiting for onetrust to load on the page?
625
- onFinished({
626
- isFinished: true,
627
- isError: false
628
- });
629
- }
630
- }, [disclosure]);
631
- return disclosure === null ? React__default.createElement("div", {
632
- "data-test-id": "de-disclosure-loading"
633
- }) : React__default.createElement("div", {
634
- "data-test-id": "de-disclosure"
635
- }, disclosureRendering);
636
- };
637
-
638
- const FirstPartyIngestDataTypes = {
639
- JOB_LEVEL: 'profile_job_level',
640
- JOB_INDUSTRY: 'profile_job_industry',
641
- JOB_TITLE: 'profile_job_title',
642
- PERSONAL_GOALS: 'personal_goals',
643
- HOBBIES: 'hobbies',
644
- PROFESSIONAL_GOALS: 'professional_goals',
645
- INDUSTRY: 'industry',
646
- NEWS_LOCATION: 'news_location',
647
- NY_PERSONAL_GOALS: 'new_year_personal_goals',
648
- NY_HOBBIES: 'new_year_hobbies',
649
- NY_PROFESSIONAL_GOALS: 'new_year_professional_goals',
650
- NY_INDUSTRY: 'new_year_industry',
651
- NY_NEWS_LOCATION: 'new_year_news_location'
652
- };
653
-
654
554
  exports.AttributesState = AttributesState;
655
555
  exports.CollectionBehaviors = CollectionBehaviors;
656
- exports.DEDisclosure = DEDisclosure;
657
556
  exports.DESelect = DESelect;
658
- exports.DeleteAttributeState = DeleteAttributeState;
659
- exports.FirstPartyIngestDataTypes = FirstPartyIngestDataTypes;
660
557
  exports.IngestResponseState = IngestResponseState;
661
- exports.IngestType = IngestType;
662
558
  exports.getAttributes = getAttributes;
663
559
  exports.hasRequiredPrivacyCookies = hasRequiredPrivacyCookies;
664
- exports.push = push;
665
560
  //# sourceMappingURL=subs-de-inputs.cjs.development.js.map