@bikdotai/bik-component-library 0.0.860 → 0.0.861

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.
@@ -1,44 +1,44 @@
1
- import { jsxs as je, Fragment as Ee, jsx as C } from "react/jsx-runtime";
2
- import { useState as u, useEffect as P, useCallback as S } from "react";
3
- import ce, { ACTIONS as pe } from "react-joyride";
4
- import oe from "./MajorUpdatePopup.js";
5
- import ne from "./MinorUpdatePopup.js";
6
- import { VideoModal as Ne } from "./VideoModal.js";
7
- import { useFeatureAnnouncements as Pe } from "./hooks/useFeatureAnnouncements.js";
8
- import { SELECTORS as We } from "./constants/selectors.js";
9
- const $e = ({
10
- children: fe,
11
- fetchVisibleFeatures: me,
12
- getStoreFeatureProgress: ge,
13
- fetchFeatureById: he,
14
- markFeatureAsViewedForStore: be,
15
- isFeatureApplicableToCurrentPage: ye,
16
- module: xe,
17
- router: W,
18
- storeId: E,
19
- onAnnouncementShown: re,
20
- onAnnouncementInteracted: L
1
+ import { jsxs as Nt, Fragment as Pt, jsx as B } from "react/jsx-runtime";
2
+ import { useState as p, useEffect as O, useCallback as x } from "react";
3
+ import mt, { ACTIONS as ft } from "react-joyride";
4
+ import rt from "./MajorUpdatePopup.js";
5
+ import at from "./MinorUpdatePopup.js";
6
+ import { VideoModal as Vt } from "./VideoModal.js";
7
+ import { useFeatureAnnouncements as Wt } from "./hooks/useFeatureAnnouncements.js";
8
+ import { SELECTORS as Ot } from "./constants/selectors.js";
9
+ const Kt = ({
10
+ children: gt,
11
+ fetchVisibleFeatures: yt,
12
+ getStoreFeatureProgress: bt,
13
+ fetchFeatureById: ht,
14
+ markFeatureAsViewedForStore: xt,
15
+ isFeatureApplicableToCurrentPage: St,
16
+ module: kt,
17
+ router: L,
18
+ storeId: m,
19
+ onAnnouncementShown: $,
20
+ onAnnouncementInteracted: y
21
21
  }) => {
22
22
  const {
23
- majorUpdateFeatures: s,
24
- minorUpdateFeatures: I,
25
- isLoading: T,
26
- markFeatureAsViewed: p
27
- } = Pe({
28
- fetchVisibleFeatures: me,
29
- getStoreFeatureProgress: ge,
30
- fetchFeatureById: he,
31
- markFeatureAsViewedForStore: be,
32
- isFeatureApplicableToCurrentPage: ye,
33
- module: xe,
34
- router: W
35
- }), [m, B] = u(null), [l, w] = u(null), [O, v] = u(!1), [ae, k] = u([]), [Se, J] = u(!1), [se, U] = u([]), [ie, M] = u(!1), [h, b] = u(!1), [d, q] = u([]), [y, F] = u(!1), [x, j] = u(!1), [we, $] = u(!1), [ke, z] = u(""), [R, K] = u(!1), [Ce, _] = u(!1), [le, A] = u(!1), [Te, Me] = u(0), [Fe, Ie] = u(0), [N, Q] = u(
23
+ majorUpdateFeatures: a,
24
+ minorUpdateFeatures: P,
25
+ isLoading: F,
26
+ markFeatureAsViewed: c
27
+ } = Wt({
28
+ fetchVisibleFeatures: yt,
29
+ getStoreFeatureProgress: bt,
30
+ fetchFeatureById: ht,
31
+ markFeatureAsViewedForStore: xt,
32
+ isFeatureApplicableToCurrentPage: St,
33
+ module: kt,
34
+ router: L
35
+ }), [b, v] = p(null), [u, S] = p(null), [J, I] = p(!1), [st, k] = p([]), [wt, V] = p(!1), [lt, j] = p([]), [dt, w] = p(!1), [C, h] = p(!1), [s, A] = p([]), [T, U] = p(!1), [M, E] = p(!1), [Ct, q] = p(!1), [Tt, R] = p(""), [z, _] = p(!1), [Mt, K] = p(!1), [ct, Q] = p(!1), [Ut, Bt] = p(0), [Ft, vt] = p(0), [N, Z] = p(
36
36
  /* @__PURE__ */ new Set()
37
37
  );
38
- P(() => {
39
- const e = "minor-spotlight-cutout-style";
40
- let o = document.getElementById(e);
41
- return o || (o = document.createElement("style"), o.id = e, document.head.appendChild(o)), o.textContent = `
38
+ O(() => {
39
+ const t = "minor-spotlight-cutout-style";
40
+ let o = document.getElementById(t);
41
+ return o || (o = document.createElement("style"), o.id = t, document.head.appendChild(o)), o.textContent = `
42
42
  .react-joyride__spotlight {
43
43
  transition: box-shadow 0.3s ease-in-out !important;
44
44
  will-change: box-shadow, transform;
@@ -53,131 +53,132 @@ const $e = ({
53
53
  left: auto !important;
54
54
  }
55
55
  `, () => {
56
- const n = document.getElementById(e);
56
+ const n = document.getElementById(t);
57
57
  n && n.remove();
58
58
  };
59
- }, []), P(() => {
60
- Me((e) => e + 1), Ie((e) => e + 1), _(!1), A(!1), Q(/* @__PURE__ */ new Set());
61
- }, [W?.pathname]), P(() => {
62
- if (s.length > 0 && !m && !T && !ie && !R) {
63
- j(!1), F(!1), v(!1), k([]), w(null), q([]);
64
- let e = 0;
59
+ }, []), O(() => {
60
+ Bt((t) => t + 1), vt((t) => t + 1), K(!1), Q(!1), Z(/* @__PURE__ */ new Set());
61
+ }, [L?.pathname]), O(() => {
62
+ if (a.length > 0 && !b && !F && !dt && !z) {
63
+ E(!1), U(!1), I(!1), k([]), S(null), A([]);
64
+ let t = 0;
65
65
  const o = 10, n = () => {
66
- e++, document.querySelector(
66
+ t++, document.querySelector(
67
67
  '[data-testid="whats-new-button"]'
68
- ) ? de(s[0]) : e < o ? setTimeout(n, 1e3) : j(!0);
68
+ ) ? ut(a[0]) : t < o ? setTimeout(n, 1e3) : E(!0);
69
69
  };
70
70
  n();
71
- } else s.length === 0 && !T && j(!0);
71
+ } else a.length === 0 && !F && E(!0);
72
72
  }, [
73
- s,
74
- m,
75
- T,
76
- ie,
77
- R
78
- ]), P(() => {
79
- const e = W?.query?.featureId;
80
- if (!e || T || I.length === 0)
73
+ a,
74
+ b,
75
+ F,
76
+ dt,
77
+ z
78
+ ]), O(() => {
79
+ const t = L?.query?.featureId;
80
+ if (!t || F || P.length === 0)
81
81
  return;
82
- const o = I.find(
83
- (a) => a.id === e
82
+ const o = P.find(
83
+ (r) => r.id === t
84
84
  );
85
85
  if (!o || !o.featureTag)
86
86
  return;
87
- F(!0), b(!0);
87
+ U(!0), h(!0);
88
88
  let n = 0;
89
- const t = 25, r = setInterval(() => {
89
+ const e = 25, i = setInterval(() => {
90
90
  n++;
91
- const a = o.featureTag.startsWith("#") || o.featureTag.startsWith(".") || o.featureTag.startsWith("[") ? o.featureTag : `#${o.featureTag}`;
92
- if (document.querySelector(a)) {
93
- const c = [o];
94
- q(c), V(o, c), clearInterval(r);
95
- } else n >= t && (b(!1), clearInterval(r));
91
+ const r = o.featureTag.startsWith("#") || o.featureTag.startsWith(".") || o.featureTag.startsWith("[") ? o.featureTag : `#${o.featureTag}`;
92
+ if (document.querySelector(r)) {
93
+ const d = [o];
94
+ A(d), W(o, d), clearInterval(i);
95
+ } else n >= e && (h(!1), clearInterval(i));
96
96
  }, 200);
97
97
  return () => {
98
- clearInterval(r);
98
+ clearInterval(i);
99
99
  };
100
- }, [I, W?.query?.featureId, T]), P(() => {
101
- if (I.length > 0 && !T && !O && !h && !l && !y && x && !R) {
102
- let e = null, o = null, n = null, t = !1;
103
- const r = () => {
104
- if (t || h || l || y || !x)
100
+ }, [P, L?.query?.featureId, F]), O(() => {
101
+ if (P.length > 0 && !F && !J && !C && !u && !T && M && !z) {
102
+ let t = null, o = null, n = null, e = !1;
103
+ const i = () => {
104
+ if (e || C || u || T || !M)
105
105
  return;
106
- const a = I.filter((i) => {
107
- if (!i.featureTag || i.featureTag.trim() === "" || N.has(i.id))
106
+ const r = P.filter((l) => {
107
+ if (!l.featureTag || l.featureTag.trim() === "" || N.has(l.id))
108
108
  return !1;
109
- const c = i.featureTag.startsWith("#") || i.featureTag.startsWith(".") || i.featureTag.startsWith("[") ? i.featureTag : `#${i.featureTag}`;
110
- return document.querySelector(c) !== null;
109
+ const d = l.featureTag.startsWith("#") || l.featureTag.startsWith(".") || l.featureTag.startsWith("[") ? l.featureTag : `#${l.featureTag}`;
110
+ return document.querySelector(d) !== null;
111
111
  });
112
- a.length > 0 && (q(a), V(a[0], a), e && (e.disconnect(), e = null), o && (window.removeEventListener("scroll", o), o = null), n && (clearTimeout(n), n = null));
112
+ r.length > 0 && (A(r), W(r[0], r), t && (t.disconnect(), t = null), o && (window.removeEventListener("scroll", o), o = null), n && (clearTimeout(n), n = null));
113
113
  };
114
- return e = new MutationObserver((a) => {
115
- let i = !1;
116
- for (const c of a) {
117
- if (c.type === "childList" && c.addedNodes.length > 0)
118
- for (let f = 0; f < c.addedNodes.length; f++) {
119
- const g = c.addedNodes[f];
120
- if (g.nodeType === Node.ELEMENT_NODE) {
121
- const ue = g;
122
- if (ue.id || ue.querySelector("[id]")) {
123
- i = !0;
114
+ return t = new MutationObserver((r) => {
115
+ let l = !1;
116
+ for (const d of r) {
117
+ if (d.type === "childList" && d.addedNodes.length > 0)
118
+ for (let g = 0; g < d.addedNodes.length; g++) {
119
+ const f = d.addedNodes[g];
120
+ if (f.nodeType === Node.ELEMENT_NODE) {
121
+ const pt = f;
122
+ if (pt.id || pt.querySelector("[id]")) {
123
+ l = !0;
124
124
  break;
125
125
  }
126
126
  }
127
127
  }
128
- if (i) break;
128
+ if (l) break;
129
129
  }
130
- !O && !t && !h && !l && !y && x && i && (n && clearTimeout(n), n = setTimeout(() => {
131
- !t && !h && !l && !y && x && r();
130
+ !J && !e && !C && !u && !T && M && l && (n && clearTimeout(n), n = setTimeout(() => {
131
+ !e && !C && !u && !T && M && i();
132
132
  }, 200));
133
133
  }), o = () => {
134
- !O && !t && !h && !l && !y && x && (n && clearTimeout(n), requestAnimationFrame(() => {
134
+ !J && !e && !C && !u && !T && M && (n && clearTimeout(n), requestAnimationFrame(() => {
135
135
  n = setTimeout(() => {
136
- !t && !h && !l && !y && x && r();
136
+ !e && !C && !u && !T && M && i();
137
137
  }, 300);
138
138
  }));
139
- }, e && e.observe(document.body, {
139
+ }, t && t.observe(document.body, {
140
140
  childList: !0,
141
141
  subtree: !0
142
- }), o && window.addEventListener("scroll", o, { passive: !0 }), r(), setTimeout(() => {
143
- !t && !h && !l && !y && x && r();
142
+ }), o && window.addEventListener("scroll", o, { passive: !0 }), i(), setTimeout(() => {
143
+ !e && !C && !u && !T && M && i();
144
144
  }, 100), setTimeout(() => {
145
- !t && !h && !l && !y && x && r();
145
+ !e && !C && !u && !T && M && i();
146
146
  }, 1e3), setTimeout(() => {
147
- !t && !h && !l && !y && x && r();
147
+ !e && !C && !u && !T && M && i();
148
148
  }, 500), () => {
149
- t = !0, e && e.disconnect(), o && window.removeEventListener("scroll", o), n && clearTimeout(n);
149
+ e = !0, t && t.disconnect(), o && window.removeEventListener("scroll", o), n && clearTimeout(n);
150
150
  };
151
- } else (I.length === 0 || T) && (W?.query?.featureId && l || (v(!1), k([]), w(null), q([]), F(!1)));
151
+ } else (P.length === 0 || F) && (L?.query?.featureId && u || (I(!1), k([]), S(null), A([]), U(!1)));
152
152
  }, [
153
- I,
153
+ P,
154
+ F,
155
+ J,
156
+ C,
157
+ u,
154
158
  T,
155
- O,
156
- h,
157
- l,
158
- y,
159
- x,
160
- p,
161
- R
159
+ M,
160
+ c,
161
+ z
162
162
  ]);
163
- const de = (e) => {
164
- B(e);
165
- const o = s.findIndex(
166
- (r) => r.id === e.id
167
- ), n = s.length, t = [
163
+ const ut = (t) => {
164
+ v(t);
165
+ const o = a.findIndex(
166
+ (i) => i.id === t.id
167
+ ), n = a.length, e = [
168
168
  {
169
- target: We.WHATS_NEW_BUTTON,
170
- content: /* @__PURE__ */ C(
171
- oe,
169
+ target: Ot.WHATS_NEW_BUTTON,
170
+ content: /* @__PURE__ */ B(
171
+ rt,
172
172
  {
173
- feature: e,
173
+ feature: t,
174
174
  currentIndex: o,
175
175
  totalFeatures: n,
176
- onSkip: () => Z(e),
177
- onExplore: (r) => D(e, r),
178
- onPrevious: () => H(e),
179
- onNext: () => X(e),
180
- setIsClosing: _
176
+ onSkip: () => D(t),
177
+ onExplore: (i) => H(t, i),
178
+ onSecondaryAction: (i) => X(t, i),
179
+ onPrevious: () => G(t),
180
+ onNext: () => Y(t),
181
+ setIsClosing: K
181
182
  }
182
183
  ),
183
184
  placement: "bottom-start",
@@ -187,7 +188,7 @@ const $e = ({
187
188
  hideSkipButton: !0,
188
189
  hideFooter: !0,
189
190
  offset: 0,
190
- data: { feature: e, isMajor: !0 },
191
+ data: { feature: t, isMajor: !0 },
191
192
  styles: {
192
193
  tooltip: {
193
194
  padding: 0,
@@ -215,22 +216,22 @@ const $e = ({
215
216
  }
216
217
  }
217
218
  ];
218
- U(t), J(!0), re && E && re({
219
- storeId: E,
220
- announcementId: e.id,
221
- announcementTitle: e.title,
222
- imageUrl: e.displayImage || e.image,
223
- videoUrl: e.productVideo
219
+ j(e), V(!0), $ && m && $({
220
+ storeId: m,
221
+ announcementId: t.id,
222
+ announcementTitle: t.title,
223
+ imageUrl: t.displayImage || t.image,
224
+ videoUrl: t.productVideo
224
225
  });
225
- }, Z = S(
226
- async (e) => {
227
- const o = e || m;
228
- o && (M(!0), await Promise.all(
229
- s.map(
230
- (n) => p(n.id)
226
+ }, D = x(
227
+ async (t) => {
228
+ const o = t || b;
229
+ o && (w(!0), await Promise.all(
230
+ a.map(
231
+ (n) => c(n.id)
231
232
  )
232
- ), J(!1), B(null), U([]), j(!0), L && E && L({
233
- storeId: E,
233
+ ), V(!1), v(null), j([]), E(!0), y && m && y({
234
+ storeId: m,
234
235
  announcementId: o.id,
235
236
  announcementTitle: o.title,
236
237
  imageUrl: o.displayImage || o.image,
@@ -239,60 +240,81 @@ const $e = ({
239
240
  buttonName: "Skip",
240
241
  buttonUrl: void 0
241
242
  }), setTimeout(() => {
242
- M(!1);
243
+ w(!1);
243
244
  }, 500));
244
245
  },
245
- [m, s, p]
246
- ), D = S(
247
- async (e, o) => {
248
- M(!0), await p(e.id);
249
- const n = o ?? e.primaryButton?.action;
250
- if (n === "Play Video" && e.productVideo && (z(e.productVideo), $(!0), K(!0)), n === "Open link") {
251
- const a = e.primaryButton?.redirectionUrl || e.redirectUrl;
252
- a && !a.startsWith("http") && (window.location.href = a);
246
+ [b, a, c]
247
+ ), H = x(
248
+ async (t, o) => {
249
+ w(!0), await c(t.id);
250
+ const n = o ?? t.primaryButton?.action;
251
+ if (n === "Play Video" && t.productVideo && (R(t.productVideo), q(!0), _(!0)), n === "Open link") {
252
+ const r = t.primaryButton?.redirectionUrl || t.redirectUrl;
253
+ r && !r.startsWith("http") && (window.location.href = r);
253
254
  }
254
- J(!1), B(null), U([]), s.findIndex(
255
- (a) => a.id === e.id
256
- ) === s.length - 1 && j(!0), L && E && L({
257
- storeId: E,
258
- announcementId: e.id,
259
- announcementTitle: e.title,
260
- imageUrl: e.displayImage || e.image,
261
- videoUrl: e.productVideo,
255
+ V(!1), v(null), j([]), a.findIndex(
256
+ (r) => r.id === t.id
257
+ ) === a.length - 1 && E(!0), y && m && y({
258
+ storeId: m,
259
+ announcementId: t.id,
260
+ announcementTitle: t.title,
261
+ imageUrl: t.displayImage || t.image,
262
+ videoUrl: t.productVideo,
262
263
  buttonClicked: "Primary",
263
- buttonName: e.buttonText || "Explore",
264
- buttonUrl: e.redirectUrl || e.productVideo
264
+ // Mirrors the rendered button and the navigation target, which both
265
+ // prefer primaryButton over the legacy top-level fields.
266
+ buttonName: t.primaryButton?.text || t.buttonText || "Explore",
267
+ buttonUrl: t.primaryButton?.redirectionUrl || t.redirectUrl || t.productVideo
268
+ }), setTimeout(() => {
269
+ w(!1);
270
+ }, 500);
271
+ },
272
+ [a, c]
273
+ ), X = x(
274
+ async (t, o) => {
275
+ w(!0), await c(t.id), (o ?? t.secondaryButton?.action) === "Play Video" && t.productVideo && (R(t.productVideo), q(!0), _(!0)), V(!1), v(null), j([]), a.findIndex(
276
+ (r) => r.id === t.id
277
+ ) === a.length - 1 && E(!0), y && m && y({
278
+ storeId: m,
279
+ announcementId: t.id,
280
+ announcementTitle: t.title,
281
+ imageUrl: t.displayImage || t.image,
282
+ videoUrl: t.productVideo,
283
+ buttonClicked: "Secondary",
284
+ buttonName: t.secondaryButton?.text || "Secondary",
285
+ buttonUrl: t.secondaryButton?.redirectionUrl
265
286
  }), setTimeout(() => {
266
- M(!1);
287
+ w(!1);
267
288
  }, 500);
268
289
  },
269
- [s, p]
270
- ), H = S(
271
- (e) => {
272
- const o = e || m;
290
+ [a, c]
291
+ ), G = x(
292
+ (t) => {
293
+ const o = t || b;
273
294
  if (!o)
274
295
  return;
275
- const n = s.findIndex(
276
- (t) => t.id === o.id
296
+ const n = a.findIndex(
297
+ (e) => e.id === o.id
277
298
  );
278
299
  if (n > 0) {
279
- const t = s[n - 1];
280
- B(t);
281
- const r = n - 1, a = s.length;
282
- U([
300
+ const e = a[n - 1];
301
+ v(e);
302
+ const i = n - 1, r = a.length;
303
+ j([
283
304
  {
284
305
  target: '[data-testid="whats-new-button"]',
285
- content: /* @__PURE__ */ C(
286
- oe,
306
+ content: /* @__PURE__ */ B(
307
+ rt,
287
308
  {
288
- feature: t,
289
- currentIndex: r,
290
- totalFeatures: a,
291
- onSkip: () => Z(t),
292
- onExplore: (c) => D(t, c),
293
- onPrevious: () => H(t),
294
- onNext: () => X(t),
295
- setIsClosing: _
309
+ feature: e,
310
+ currentIndex: i,
311
+ totalFeatures: r,
312
+ onSkip: () => D(e),
313
+ onExplore: (d) => H(e, d),
314
+ onSecondaryAction: (d) => X(e, d),
315
+ onPrevious: () => G(e),
316
+ onNext: () => Y(e),
317
+ setIsClosing: K
296
318
  }
297
319
  ),
298
320
  placement: "bottom-start",
@@ -302,7 +324,7 @@ const $e = ({
302
324
  hideSkipButton: !0,
303
325
  hideFooter: !0,
304
326
  offset: 0,
305
- data: { feature: t, isMajor: !0 },
327
+ data: { feature: e, isMajor: !0 },
306
328
  styles: {
307
329
  tooltip: {
308
330
  padding: 0,
@@ -332,33 +354,34 @@ const $e = ({
332
354
  ]);
333
355
  }
334
356
  },
335
- [m, s]
336
- ), X = S(
337
- (e) => {
338
- const o = e || m;
357
+ [b, a]
358
+ ), Y = x(
359
+ (t) => {
360
+ const o = t || b;
339
361
  if (!o)
340
362
  return;
341
- const n = s.findIndex(
342
- (t) => t.id === o.id
363
+ const n = a.findIndex(
364
+ (e) => e.id === o.id
343
365
  );
344
- if (n < s.length - 1) {
345
- const t = s[n + 1];
346
- B(t);
347
- const r = n + 1, a = s.length;
348
- U([
366
+ if (n < a.length - 1) {
367
+ const e = a[n + 1];
368
+ v(e);
369
+ const i = n + 1, r = a.length;
370
+ j([
349
371
  {
350
372
  target: '[data-testid="whats-new-button"]',
351
- content: /* @__PURE__ */ C(
352
- oe,
373
+ content: /* @__PURE__ */ B(
374
+ rt,
353
375
  {
354
- feature: t,
355
- currentIndex: r,
356
- totalFeatures: a,
357
- onSkip: () => Z(t),
358
- onExplore: (c) => D(t, c),
359
- onPrevious: () => H(t),
360
- onNext: () => X(t),
361
- setIsClosing: _
376
+ feature: e,
377
+ currentIndex: i,
378
+ totalFeatures: r,
379
+ onSkip: () => D(e),
380
+ onExplore: (d) => H(e, d),
381
+ onSecondaryAction: (d) => X(e, d),
382
+ onPrevious: () => G(e),
383
+ onNext: () => Y(e),
384
+ setIsClosing: K
362
385
  }
363
386
  ),
364
387
  placement: "bottom-start",
@@ -368,7 +391,7 @@ const $e = ({
368
391
  hideSkipButton: !0,
369
392
  hideFooter: !0,
370
393
  offset: 0,
371
- data: { feature: t, isMajor: !0 },
394
+ data: { feature: e, isMajor: !0 },
372
395
  styles: {
373
396
  tooltip: {
374
397
  padding: 0,
@@ -397,62 +420,63 @@ const $e = ({
397
420
  }
398
421
  ]);
399
422
  } else
400
- M(!0), p(o.id), J(!1), B(null), U([]), j(!0), setTimeout(() => {
401
- M(!1);
423
+ w(!0), c(o.id), V(!1), v(null), j([]), E(!0), setTimeout(() => {
424
+ w(!1);
402
425
  }, 500);
403
426
  },
404
- [m, s, p]
405
- ), Be = () => {
406
- s.length > 0 && !m && document.querySelector(
427
+ [b, a, c]
428
+ ), It = () => {
429
+ a.length > 0 && !b && document.querySelector(
407
430
  '[data-testid="whats-new-button"]'
408
- ) && de(s[0]);
431
+ ) && ut(a[0]);
409
432
  };
410
- P(() => (window.showMajorUpdatePopup = Be, () => {
433
+ O(() => (window.showMajorUpdatePopup = It, () => {
411
434
  delete window.showMajorUpdatePopup;
412
- }), [s, m]);
413
- const ve = S(
414
- (e) => {
415
- const { action: o } = e;
416
- o === pe.CLOSE && (m && (M(!0), s.forEach((n) => {
417
- p(n.id);
418
- }), j(!0), setTimeout(() => {
419
- M(!1);
420
- }, 500)), J(!1), B(null), U([]));
435
+ }), [a, b]);
436
+ const jt = x(
437
+ (t) => {
438
+ const { action: o } = t;
439
+ o === ft.CLOSE && (b && (w(!0), a.forEach((n) => {
440
+ c(n.id);
441
+ }), E(!0), setTimeout(() => {
442
+ w(!1);
443
+ }, 500)), V(!1), v(null), j([]));
421
444
  },
422
- [m, s, p]
423
- ), Ue = S(
424
- (e) => {
425
- const { action: o } = e;
426
- o === pe.CLOSE && (l && (b(!0), p(l.id), d.findIndex(
427
- (r) => r.id === l.id
428
- ) === d.length - 1 && F(!0), setTimeout(() => {
429
- b(!1);
430
- }, 500)), v(!1), w(null), k([]));
445
+ [b, a, c]
446
+ ), Et = x(
447
+ (t) => {
448
+ const { action: o } = t;
449
+ o === ft.CLOSE && (u && (h(!0), c(u.id), s.findIndex(
450
+ (i) => i.id === u.id
451
+ ) === s.length - 1 && U(!0), setTimeout(() => {
452
+ h(!1);
453
+ }, 500)), I(!1), S(null), k([]));
431
454
  },
432
- [l, d, p]
433
- ), V = async (e, o) => {
434
- w(e);
435
- const n = o || d, t = n.findIndex((f) => f.id === e.id), r = n.length, a = e.featureTag.startsWith("#") || e.featureTag.startsWith(".") || e.featureTag.startsWith("[") ? e.featureTag : `#${e.featureTag}`, i = document.querySelector(a);
436
- if (i)
455
+ [u, s, c]
456
+ ), W = async (t, o) => {
457
+ S(t);
458
+ const n = o || s, e = n.findIndex((g) => g.id === t.id), i = n.length, r = t.featureTag.startsWith("#") || t.featureTag.startsWith(".") || t.featureTag.startsWith("[") ? t.featureTag : `#${t.featureTag}`, l = document.querySelector(r);
459
+ if (l)
437
460
  try {
438
- const { scrollToElementSmooth: f } = await import("./utils/elementHelpers.js");
439
- await f(i, 120);
461
+ const { scrollToElementSmooth: g } = await import("./utils/elementHelpers.js");
462
+ await g(l, 120);
440
463
  } catch {
441
464
  }
442
465
  k([
443
466
  {
444
- target: a,
445
- content: /* @__PURE__ */ C(
446
- ne,
467
+ target: r,
468
+ content: /* @__PURE__ */ B(
469
+ at,
447
470
  {
448
- feature: e,
449
- currentIndex: t,
450
- totalFeatures: r,
451
- onSkip: () => G(e),
452
- onExplore: (f) => Y(e, f),
453
- onPrevious: () => ee(e),
454
- onNext: () => te(e),
455
- setIsClosing: A
471
+ feature: t,
472
+ currentIndex: e,
473
+ totalFeatures: i,
474
+ onSkip: () => tt(t),
475
+ onExplore: (g) => et(t, g),
476
+ onSecondaryAction: (g) => ot(t, g),
477
+ onPrevious: () => nt(t),
478
+ onNext: () => it(t),
479
+ setIsClosing: Q
456
480
  }
457
481
  ),
458
482
  placement: "bottom",
@@ -462,7 +486,7 @@ const $e = ({
462
486
  hideSkipButton: !0,
463
487
  hideFooter: !0,
464
488
  offset: 0,
465
- data: { feature: e, isMinor: !0 },
489
+ data: { feature: t, isMinor: !0 },
466
490
  styles: {
467
491
  tooltip: {
468
492
  padding: 0,
@@ -489,76 +513,125 @@ const $e = ({
489
513
  }
490
514
  }
491
515
  }
492
- ]), v(!0);
493
- }, G = S(
494
- async (e) => {
495
- const o = e || l;
516
+ ]), I(!0), $ && m && $({
517
+ storeId: m,
518
+ announcementId: t.id,
519
+ announcementTitle: t.title,
520
+ imageUrl: t.displayImage || t.image,
521
+ videoUrl: t.productVideo
522
+ });
523
+ }, tt = x(
524
+ async (t) => {
525
+ const o = t || u;
496
526
  if (o) {
497
- b(!0), await p(o.id), Q((t) => new Set(t).add(o.id)), v(!1), w(null), k([]);
498
- const n = d.find(
499
- (t) => t.id !== o.id && !N.has(t.id)
527
+ h(!0), await c(o.id), Z((e) => new Set(e).add(o.id)), I(!1), S(null), k([]);
528
+ const n = s.find(
529
+ (e) => e.id !== o.id && !N.has(e.id)
500
530
  );
501
- setTimeout(() => {
502
- b(!1), n ? V(n, d) : F(!0);
531
+ y && m && y({
532
+ storeId: m,
533
+ announcementId: o.id,
534
+ announcementTitle: o.title,
535
+ imageUrl: o.displayImage || o.image,
536
+ videoUrl: o.productVideo,
537
+ buttonClicked: "Skip",
538
+ buttonName: "Skip",
539
+ buttonUrl: void 0
540
+ }), setTimeout(() => {
541
+ h(!1), n ? W(n, s) : U(!0);
503
542
  }, 500);
504
543
  }
505
544
  },
506
545
  [
507
- l,
508
- d,
509
- p,
546
+ u,
547
+ s,
548
+ c,
510
549
  N
511
550
  ]
512
- ), Y = S(
513
- async (e, o) => {
514
- b(!0), await p(e.id), Q((r) => new Set(r).add(e.id));
515
- const n = o ?? e.primaryButton?.action;
516
- if (n === "Play Video" && e.productVideo && (z(e.productVideo), $(!0), K(!0)), n === "Open link") {
517
- const r = e.primaryButton?.redirectionUrl || e.redirectUrl;
518
- r && !r.startsWith("http") && (window.location.href = r);
551
+ ), et = x(
552
+ async (t, o) => {
553
+ h(!0), await c(t.id), Z((i) => new Set(i).add(t.id));
554
+ const n = o ?? t.primaryButton?.action;
555
+ if (n === "Play Video" && t.productVideo && (R(t.productVideo), q(!0), _(!0)), n === "Open link") {
556
+ const i = t.primaryButton?.redirectionUrl || t.redirectUrl;
557
+ i && !i.startsWith("http") && (window.location.href = i);
519
558
  }
520
- v(!1), w(null), k([]);
521
- const t = d.find(
522
- (r) => r.id !== e.id && !N.has(r.id)
559
+ I(!1), S(null), k([]);
560
+ const e = s.find(
561
+ (i) => i.id !== t.id && !N.has(i.id)
523
562
  );
524
- setTimeout(() => {
525
- b(!1), t && n !== "Play Video" ? V(t, d) : t || F(!0);
563
+ y && m && y({
564
+ storeId: m,
565
+ announcementId: t.id,
566
+ announcementTitle: t.title,
567
+ imageUrl: t.displayImage || t.image,
568
+ videoUrl: t.productVideo,
569
+ buttonClicked: "Primary",
570
+ // Mirrors the rendered button and the navigation target, which both
571
+ // prefer primaryButton over the legacy top-level fields.
572
+ buttonName: t.primaryButton?.text || t.buttonText || "Explore",
573
+ buttonUrl: t.primaryButton?.redirectionUrl || t.redirectUrl || t.productVideo
574
+ }), setTimeout(() => {
575
+ h(!1), e && n !== "Play Video" ? W(e, s) : e || U(!0);
576
+ }, 500);
577
+ },
578
+ [s, c, N]
579
+ ), ot = x(
580
+ async (t, o) => {
581
+ h(!0), await c(t.id), Z((i) => new Set(i).add(t.id));
582
+ const n = o ?? t.secondaryButton?.action;
583
+ n === "Play Video" && t.productVideo && (R(t.productVideo), q(!0), _(!0)), I(!1), S(null), k([]);
584
+ const e = s.find(
585
+ (i) => i.id !== t.id && !N.has(i.id)
586
+ );
587
+ y && m && y({
588
+ storeId: m,
589
+ announcementId: t.id,
590
+ announcementTitle: t.title,
591
+ imageUrl: t.displayImage || t.image,
592
+ videoUrl: t.productVideo,
593
+ buttonClicked: "Secondary",
594
+ buttonName: t.secondaryButton?.text || "Secondary",
595
+ buttonUrl: t.secondaryButton?.redirectionUrl
596
+ }), setTimeout(() => {
597
+ h(!1), e && n !== "Play Video" ? W(e, s) : e || U(!0);
526
598
  }, 500);
527
599
  },
528
- [d, p, N]
529
- ), ee = S(
530
- async (e) => {
531
- const o = e || l;
600
+ [s, c, N]
601
+ ), nt = x(
602
+ async (t) => {
603
+ const o = t || u;
532
604
  if (!o)
533
605
  return;
534
- const n = d.findIndex(
535
- (t) => t.id === o.id
606
+ const n = s.findIndex(
607
+ (e) => e.id === o.id
536
608
  );
537
609
  if (n > 0) {
538
- const t = d[n - 1];
539
- w(t);
540
- const r = t.featureTag.startsWith("#") || t.featureTag.startsWith(".") || t.featureTag.startsWith("[") ? t.featureTag : `#${t.featureTag}`, a = document.querySelector(r);
541
- if (a)
610
+ const e = s[n - 1];
611
+ S(e);
612
+ const i = e.featureTag.startsWith("#") || e.featureTag.startsWith(".") || e.featureTag.startsWith("[") ? e.featureTag : `#${e.featureTag}`, r = document.querySelector(i);
613
+ if (r)
542
614
  try {
543
- const { scrollToElementSmooth: g } = await import("./utils/elementHelpers.js");
544
- await g(a, 120);
615
+ const { scrollToElementSmooth: f } = await import("./utils/elementHelpers.js");
616
+ await f(r, 120);
545
617
  } catch {
546
618
  }
547
- const i = n - 1, c = d.length;
619
+ const l = n - 1, d = s.length;
548
620
  k([
549
621
  {
550
- target: r,
551
- content: /* @__PURE__ */ C(
552
- ne,
622
+ target: i,
623
+ content: /* @__PURE__ */ B(
624
+ at,
553
625
  {
554
- feature: t,
555
- currentIndex: i,
556
- totalFeatures: c,
557
- onSkip: () => G(t),
558
- onExplore: (g) => Y(t, g),
559
- onPrevious: () => ee(t),
560
- onNext: () => te(t),
561
- setIsClosing: A
626
+ feature: e,
627
+ currentIndex: l,
628
+ totalFeatures: d,
629
+ onSkip: () => tt(e),
630
+ onExplore: (f) => et(e, f),
631
+ onSecondaryAction: (f) => ot(e, f),
632
+ onPrevious: () => nt(e),
633
+ onNext: () => it(e),
634
+ setIsClosing: Q
562
635
  }
563
636
  ),
564
637
  placement: "bottom",
@@ -568,7 +641,7 @@ const $e = ({
568
641
  hideSkipButton: !0,
569
642
  hideFooter: !0,
570
643
  offset: 0,
571
- data: { feature: t, isMinor: !0 },
644
+ data: { feature: e, isMinor: !0 },
572
645
  styles: {
573
646
  tooltip: {
574
647
  padding: 0,
@@ -598,40 +671,41 @@ const $e = ({
598
671
  ]);
599
672
  }
600
673
  },
601
- [l, d]
602
- ), te = S(
603
- async (e) => {
604
- const o = e || l;
674
+ [u, s]
675
+ ), it = x(
676
+ async (t) => {
677
+ const o = t || u;
605
678
  if (!o)
606
679
  return;
607
- const n = d.findIndex(
608
- (t) => t.id === o.id
680
+ const n = s.findIndex(
681
+ (e) => e.id === o.id
609
682
  );
610
- if (n < d.length - 1) {
611
- const t = d[n + 1];
612
- w(t);
613
- const r = t.featureTag.startsWith("#") || t.featureTag.startsWith(".") || t.featureTag.startsWith("[") ? t.featureTag : `#${t.featureTag}`, a = document.querySelector(r);
614
- if (a)
683
+ if (n < s.length - 1) {
684
+ const e = s[n + 1];
685
+ S(e);
686
+ const i = e.featureTag.startsWith("#") || e.featureTag.startsWith(".") || e.featureTag.startsWith("[") ? e.featureTag : `#${e.featureTag}`, r = document.querySelector(i);
687
+ if (r)
615
688
  try {
616
- const { scrollToElementSmooth: g } = await import("./utils/elementHelpers.js");
617
- await g(a, 120);
689
+ const { scrollToElementSmooth: f } = await import("./utils/elementHelpers.js");
690
+ await f(r, 120);
618
691
  } catch {
619
692
  }
620
- const i = n + 1, c = d.length;
693
+ const l = n + 1, d = s.length;
621
694
  k([
622
695
  {
623
- target: r,
624
- content: /* @__PURE__ */ C(
625
- ne,
696
+ target: i,
697
+ content: /* @__PURE__ */ B(
698
+ at,
626
699
  {
627
- feature: t,
628
- currentIndex: i,
629
- totalFeatures: c,
630
- onSkip: () => G(t),
631
- onExplore: (g) => Y(t, g),
632
- onPrevious: () => ee(t),
633
- onNext: () => te(t),
634
- setIsClosing: A
700
+ feature: e,
701
+ currentIndex: l,
702
+ totalFeatures: d,
703
+ onSkip: () => tt(e),
704
+ onExplore: (f) => et(e, f),
705
+ onSecondaryAction: (f) => ot(e, f),
706
+ onPrevious: () => nt(e),
707
+ onNext: () => it(e),
708
+ setIsClosing: Q
635
709
  }
636
710
  ),
637
711
  placement: "bottom",
@@ -641,7 +715,7 @@ const $e = ({
641
715
  hideSkipButton: !0,
642
716
  hideFooter: !0,
643
717
  offset: 0,
644
- data: { feature: t, isMinor: !0 },
718
+ data: { feature: e, isMinor: !0 },
645
719
  styles: {
646
720
  tooltip: {
647
721
  padding: 0,
@@ -670,23 +744,23 @@ const $e = ({
670
744
  }
671
745
  ]);
672
746
  } else
673
- b(!0), F(!0), p(o.id), v(!1), w(null), k([]), setTimeout(() => {
674
- b(!1);
747
+ h(!0), U(!0), c(o.id), I(!1), S(null), k([]), setTimeout(() => {
748
+ h(!1);
675
749
  }, 500);
676
750
  },
677
- [l, d, p]
751
+ [u, s, c]
678
752
  );
679
- return /* @__PURE__ */ je(Ee, { children: [
680
- fe,
681
- se.length > 0 && /* @__PURE__ */ C(
682
- ce,
753
+ return /* @__PURE__ */ Nt(Pt, { children: [
754
+ gt,
755
+ lt.length > 0 && /* @__PURE__ */ B(
756
+ mt,
683
757
  {
684
- steps: se,
685
- run: Se,
758
+ steps: lt,
759
+ run: wt,
686
760
  continuous: !1,
687
761
  showProgress: !1,
688
762
  showSkipButton: !1,
689
- callback: ve,
763
+ callback: jt,
690
764
  disableOverlayClose: !1,
691
765
  disableCloseOnEsc: !1,
692
766
  disableOverlay: !1,
@@ -696,7 +770,7 @@ const $e = ({
696
770
  primaryColor: "#007bff",
697
771
  zIndex: 1e4,
698
772
  width: "auto",
699
- arrowColor: Ce ? "transparent" : "#212121"
773
+ arrowColor: Mt ? "transparent" : "#212121"
700
774
  },
701
775
  overlay: {
702
776
  backgroundColor: "transparent"
@@ -739,17 +813,17 @@ const $e = ({
739
813
  skip: "Skip"
740
814
  }
741
815
  },
742
- `major-joyride-${Te}`
816
+ `major-joyride-${Ut}`
743
817
  ),
744
- ae.length > 0 && /* @__PURE__ */ C(
745
- ce,
818
+ st.length > 0 && /* @__PURE__ */ B(
819
+ mt,
746
820
  {
747
- steps: ae,
748
- run: O,
821
+ steps: st,
822
+ run: J,
749
823
  continuous: !1,
750
824
  showProgress: !1,
751
825
  showSkipButton: !1,
752
- callback: Ue,
826
+ callback: Et,
753
827
  disableOverlayClose: !1,
754
828
  disableCloseOnEsc: !1,
755
829
  disableOverlay: !1,
@@ -761,7 +835,7 @@ const $e = ({
761
835
  primaryColor: "#007bff",
762
836
  zIndex: 1e4,
763
837
  width: "auto",
764
- arrowColor: le ? "transparent" : "#ffffff"
838
+ arrowColor: ct ? "transparent" : "#ffffff"
765
839
  },
766
840
  overlay: {
767
841
  backgroundColor: "transparent"
@@ -769,7 +843,7 @@ const $e = ({
769
843
  spotlight: {
770
844
  backgroundColor: "transparent",
771
845
  borderRadius: "8px",
772
- boxShadow: le ? "none" : "0 0 0 9999px rgba(0, 0, 0, 0.4), 0 0 0 3px rgba(255, 255, 255, 0.8), 0 0 20px 8px rgba(255, 255, 255, 0.4)"
846
+ boxShadow: ct ? "none" : "0 0 0 9999px rgba(0, 0, 0, 0.4), 0 0 0 3px rgba(255, 255, 255, 0.8), 0 0 20px 8px rgba(255, 255, 255, 0.4)"
773
847
  },
774
848
  tooltip: {
775
849
  borderRadius: "4px",
@@ -804,27 +878,27 @@ const $e = ({
804
878
  skip: "Skip"
805
879
  }
806
880
  },
807
- `minor-joyride-${Fe}`
881
+ `minor-joyride-${Ft}`
808
882
  ),
809
- /* @__PURE__ */ C(
810
- Ne,
883
+ /* @__PURE__ */ B(
884
+ Vt,
811
885
  {
812
- isOpen: we,
813
- videoUrl: ke,
886
+ isOpen: Ct,
887
+ videoUrl: Tt,
814
888
  onClose: () => {
815
- $(!1), z(""), K(!1);
816
- const e = d.find(
889
+ q(!1), R(""), _(!1);
890
+ const t = s.find(
817
891
  (o) => !N.has(o.id)
818
892
  );
819
- e ? setTimeout(() => {
820
- V(e, d);
821
- }, 300) : F(!0);
893
+ t ? setTimeout(() => {
894
+ W(t, s);
895
+ }, 300) : U(!0);
822
896
  }
823
897
  }
824
898
  )
825
899
  ] });
826
900
  };
827
901
  export {
828
- $e as default
902
+ Kt as default
829
903
  };
830
904
  //# sourceMappingURL=FeatureAnnouncementProvider.js.map