@ninetailed/experience.js-react 7.5.2 → 7.5.3-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/index.cjs.d.ts ADDED
@@ -0,0 +1 @@
1
+ export * from "./src/index";
@@ -380,7 +380,9 @@ const useExperience = ({
380
380
  }));
381
381
  };
382
382
 
383
- const ComponentMarker = /*#__PURE__*/React.forwardRef((_, ref) => {
383
+ const ComponentMarker = /*#__PURE__*/React.forwardRef(({
384
+ hidden: _hidden = false
385
+ }, ref) => {
384
386
  const {
385
387
  logger
386
388
  } = useNinetailed();
@@ -398,7 +400,7 @@ const ComponentMarker = /*#__PURE__*/React.forwardRef((_, ref) => {
398
400
  }, [logger]);
399
401
  React.useEffect(() => {
400
402
  if (markerRef.current) {
401
- const nextSibling = markerRef.current.nextSibling;
403
+ const nextSibling = getNextSibling(markerRef.current, _hidden);
402
404
  if (ref) {
403
405
  if (typeof ref === 'function') {
404
406
  ref(nextSibling);
@@ -407,7 +409,7 @@ const ComponentMarker = /*#__PURE__*/React.forwardRef((_, ref) => {
407
409
  }
408
410
  }
409
411
  }
410
- }, []);
412
+ }, [_hidden]);
411
413
  return jsxRuntime.jsx("div", {
412
414
  className: "nt-cmp-marker",
413
415
  style: {
@@ -416,6 +418,21 @@ const ComponentMarker = /*#__PURE__*/React.forwardRef((_, ref) => {
416
418
  ref: markerRef
417
419
  });
418
420
  });
421
+ const getNextSibling = (element, recursive = false) => {
422
+ if (!recursive) {
423
+ return element.nextSibling;
424
+ }
425
+ const {
426
+ parentElement
427
+ } = element;
428
+ if (!parentElement) {
429
+ return null;
430
+ }
431
+ if (parentElement.nextSibling) {
432
+ return parentElement.nextSibling;
433
+ }
434
+ return getNextSibling(parentElement, true);
435
+ };
419
436
 
420
437
  const DefaultExperienceLoadingComponent = _a => {
421
438
  var {
@@ -542,7 +559,8 @@ const Experience = _a => {
542
559
  const isVariantHidden = 'hidden' in variant && variant.hidden;
543
560
  if (isVariantHidden) {
544
561
  return jsxRuntime.jsx(ComponentMarker, {
545
- ref: componentRef
562
+ ref: componentRef,
563
+ hidden: true
546
564
  }, `marker-hidden-${(experience === null || experience === void 0 ? void 0 : experience.id) || 'baseline'}-${variant.id}`);
547
565
  }
548
566
  return jsxRuntime.jsxs(jsxRuntime.Fragment, {
@@ -1,6 +1,6 @@
1
- import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
2
1
  import React, { createContext, useMemo, useContext, useState, useRef, useEffect, createElement, forwardRef } from 'react';
3
2
  import { Ninetailed, selectVariant, makeExperienceSelectMiddleware, selectHasExperienceVariants, selectExperience, selectExperienceVariant } from '@ninetailed/experience.js';
3
+ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
4
4
  import { logger, isBrowser } from '@ninetailed/experience.js-shared';
5
5
  import { isEqual, get } from 'radash';
6
6
  import { useInView } from 'react-intersection-observer';
@@ -48,11 +48,10 @@ const NinetailedProvider = props => {
48
48
  const {
49
49
  children
50
50
  } = props;
51
- return jsx(NinetailedContext.Provider, Object.assign({
52
- value: ninetailed
53
- }, {
51
+ return /*#__PURE__*/jsx(NinetailedContext.Provider, {
52
+ value: ninetailed,
54
53
  children: children
55
- }));
54
+ });
56
55
  };
57
56
 
58
57
  const useNinetailed = () => {
@@ -63,42 +62,30 @@ const useNinetailed = () => {
63
62
  return ninetailed;
64
63
  };
65
64
 
66
- /******************************************************************************
67
- Copyright (c) Microsoft Corporation.
68
-
69
- Permission to use, copy, modify, and/or distribute this software for any
70
- purpose with or without fee is hereby granted.
71
-
72
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
73
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
74
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
75
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
76
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
77
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
78
- PERFORMANCE OF THIS SOFTWARE.
79
- ***************************************************************************** */
80
-
81
- function __rest(s, e) {
82
- var t = {};
83
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
84
- t[p] = s[p];
85
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
86
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
87
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
88
- t[p[i]] = s[p[i]];
89
- }
90
- return t;
65
+ function _objectWithoutPropertiesLoose(source, excluded) {
66
+ if (source == null) return {};
67
+ var target = {};
68
+ var sourceKeys = Object.keys(source);
69
+ var key, i;
70
+ for (i = 0; i < sourceKeys.length; i++) {
71
+ key = sourceKeys[i];
72
+ if (excluded.indexOf(key) >= 0) continue;
73
+ target[key] = source[key];
74
+ }
75
+ return target;
91
76
  }
92
77
 
78
+ const _excluded$4 = ["experiences"];
93
79
  const useProfile = () => {
94
80
  const ninetailed = useNinetailed();
95
81
  const [profileState, setProfileState] = useState(ninetailed.profileState);
96
82
  const profileStateRef = useRef({});
97
- /**
98
- * This effect compares the old and new profile state before updating it.
99
- * We use a ref to avoid an infinite loop which can happen when an empty profile state was updated with no changes.
100
- * This behaviour occurred as the validation handling on the error property was not set properly in the "CreateProfile" and "UpdateProfile" endpoint types.
101
- * Furthermore, it was also observed, that it "only" occurred when the preview plugin was used in parallel.
83
+
84
+ /**
85
+ * This effect compares the old and new profile state before updating it.
86
+ * We use a ref to avoid an infinite loop which can happen when an empty profile state was updated with no changes.
87
+ * This behaviour occurred as the validation handling on the error property was not set properly in the "CreateProfile" and "UpdateProfile" endpoint types.
88
+ * Furthermore, it was also observed, that it "only" occurred when the preview plugin was used in parallel.
102
89
  */
103
90
  useEffect(() => {
104
91
  ninetailed.onProfileChange(profileState => {
@@ -112,8 +99,8 @@ const useProfile = () => {
112
99
  }
113
100
  });
114
101
  }, []);
115
- const profileStateWithoutExperiences = __rest(profileState, ["experiences"]);
116
- return Object.assign(Object.assign({}, profileStateWithoutExperiences), {
102
+ const profileStateWithoutExperiences = _objectWithoutPropertiesLoose(profileState, _excluded$4);
103
+ return Object.assign({}, profileStateWithoutExperiences, {
117
104
  loading: profileState.status === 'loading'
118
105
  });
119
106
  };
@@ -147,21 +134,22 @@ const TrackHasSeenComponent = ({
147
134
  });
148
135
  }
149
136
  }, [inView]);
150
- return jsxs(Fragment, {
151
- children: [jsx("div", {
137
+ return /*#__PURE__*/jsxs(Fragment, {
138
+ children: [/*#__PURE__*/jsx("div", {
152
139
  ref: ref
153
140
  }), children]
154
141
  });
155
142
  };
156
143
 
157
- const Personalize = _a => {
158
- var {
144
+ const _excluded$3 = ["component", "loadingComponent", "variants", "holdout"];
145
+ const Personalize = _ref => {
146
+ let {
159
147
  component: Component,
160
148
  loadingComponent: LoadingComponent,
161
149
  variants = [],
162
150
  holdout = -1
163
- } = _a,
164
- baseline = __rest(_a, ["component", "loadingComponent", "variants", "holdout"]);
151
+ } = _ref,
152
+ baseline = _objectWithoutPropertiesLoose(_ref, _excluded$3);
165
153
  const {
166
154
  loading,
167
155
  variant,
@@ -172,7 +160,7 @@ const Personalize = _a => {
172
160
  });
173
161
  const hasVariants = variants.length > 0;
174
162
  if (!hasVariants) {
175
- return jsx(Component, Object.assign({}, baseline, {
163
+ return /*#__PURE__*/jsx(Component, Object.assign({}, baseline, {
176
164
  ninetailed: {
177
165
  isPersonalized,
178
166
  audience
@@ -181,26 +169,24 @@ const Personalize = _a => {
181
169
  }
182
170
  if (loading) {
183
171
  if (LoadingComponent) {
184
- return jsx(LoadingComponent, {});
172
+ return /*#__PURE__*/jsx(LoadingComponent, {});
185
173
  }
186
- return jsx("div", Object.assign({
174
+ return /*#__PURE__*/jsx("div", {
187
175
  style: {
188
176
  opacity: 0
189
- }
190
- }, {
191
- children: jsx(Component, Object.assign({}, variant, {
177
+ },
178
+ children: /*#__PURE__*/jsx(Component, Object.assign({}, variant, {
192
179
  ninetailed: {
193
180
  isPersonalized,
194
181
  audience
195
182
  }
196
183
  }))
197
- }), "hide");
184
+ }, "hide");
198
185
  }
199
- return jsx(TrackHasSeenComponent, Object.assign({
186
+ return /*#__PURE__*/jsx(TrackHasSeenComponent, {
200
187
  variant: variant,
201
188
  audience: audience,
202
- isPersonalized: isPersonalized
203
- }, {
189
+ isPersonalized: isPersonalized,
204
190
  children: /*#__PURE__*/createElement(Component, Object.assign({}, variant, {
205
191
  key: `${audience.id}-${variant.id}`,
206
192
  ninetailed: {
@@ -208,7 +194,7 @@ const Personalize = _a => {
208
194
  audience
209
195
  }
210
196
  }))
211
- }));
197
+ });
212
198
  };
213
199
 
214
200
  const generateSelectors = id => {
@@ -239,7 +225,7 @@ const MergeTag = ({
239
225
  return null;
240
226
  }
241
227
  const value = selectValueFromProfile(profile, id) || fallback;
242
- return value ? jsx(Fragment, {
228
+ return value ? /*#__PURE__*/jsx(Fragment, {
243
229
  children: value
244
230
  }) : null;
245
231
  };
@@ -273,6 +259,7 @@ const useExperienceSelectionMiddleware = ({
273
259
  return middleware;
274
260
  };
275
261
 
262
+ const _excluded$2 = ["experience", "variant", "variantIndex"];
276
263
  const useExperience = ({
277
264
  baseline,
278
265
  experiences
@@ -288,13 +275,13 @@ const useExperience = ({
288
275
  baseline,
289
276
  profile
290
277
  });
291
- const overrideResult = _a => {
292
- var {
278
+ const overrideResult = _ref => {
279
+ let {
293
280
  experience: originalExperience,
294
281
  variant: originalVariant,
295
282
  variantIndex: originalVariantIndex
296
- } = _a,
297
- other = __rest(_a, ["experience", "variant", "variantIndex"]);
283
+ } = _ref,
284
+ other = _objectWithoutPropertiesLoose(_ref, _excluded$2);
298
285
  const {
299
286
  experience,
300
287
  variant,
@@ -304,20 +291,21 @@ const useExperience = ({
304
291
  variant: originalVariant,
305
292
  variantIndex: originalVariantIndex
306
293
  });
294
+
307
295
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
308
296
  // @ts-ignore
309
- return Object.assign(Object.assign({}, other), {
310
- audience: (experience === null || experience === void 0 ? void 0 : experience.audience) ? experience.audience : null,
297
+ return Object.assign({}, other, {
298
+ audience: experience != null && experience.audience ? experience.audience : null,
311
299
  experience,
312
300
  variant,
313
301
  variantIndex
314
302
  });
315
303
  };
316
- const baseReturn = Object.assign(Object.assign({}, profileState), {
304
+ const baseReturn = Object.assign({}, profileState, {
317
305
  hasVariants,
318
306
  baseline
319
307
  });
320
- const emptyReturn = Object.assign(Object.assign({}, baseReturn), {
308
+ const emptyReturn = Object.assign({}, baseReturn, {
321
309
  experience: null,
322
310
  variant: baseline,
323
311
  variantIndex: 0,
@@ -347,7 +335,7 @@ const useExperience = ({
347
335
  if (!experience) {
348
336
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
349
337
  // @ts-ignore
350
- return overrideResult(Object.assign(Object.assign({}, emptyReturn), {
338
+ return overrideResult(Object.assign({}, emptyReturn, {
351
339
  profile
352
340
  }));
353
341
  }
@@ -359,7 +347,7 @@ const useExperience = ({
359
347
  experience,
360
348
  profile
361
349
  });
362
- return overrideResult(Object.assign(Object.assign({}, baseReturn), {
350
+ return overrideResult(Object.assign({}, baseReturn, {
363
351
  status: 'success',
364
352
  loading: false,
365
353
  error: null,
@@ -372,25 +360,27 @@ const useExperience = ({
372
360
  }));
373
361
  };
374
362
 
375
- const ComponentMarker = /*#__PURE__*/forwardRef((_, ref) => {
363
+ const ComponentMarker = /*#__PURE__*/forwardRef(({
364
+ hidden: _hidden = false
365
+ }, ref) => {
376
366
  const {
377
367
  logger
378
368
  } = useNinetailed();
379
369
  const markerRef = useRef(null);
380
370
  useEffect(() => {
381
- var _a;
382
- /*
383
- Due to React's limitation on setting !important styles during rendering, we set the display property on the DOM element directly.
384
- See: https://github.com/facebook/react/issues/1881
371
+ var _markerRef$current;
372
+ /*
373
+ Due to React's limitation on setting !important styles during rendering, we set the display property on the DOM element directly.
374
+ See: https://github.com/facebook/react/issues/1881
385
375
  */
386
- (_a = markerRef.current) === null || _a === void 0 ? void 0 : _a.style.setProperty('display', 'none', 'important');
376
+ (_markerRef$current = markerRef.current) == null || _markerRef$current.style.setProperty('display', 'none', 'important');
387
377
  }, []);
388
378
  useEffect(() => {
389
379
  logger.debug('Using fallback mechanism to detect when experiences are seen. This can lead to inaccurate results. Consider using a forwardRef instead. See: https://docs.ninetailed.io/for-developers/experience-sdk/rendering-experiences#tracking-impressions-of-experiences');
390
380
  }, [logger]);
391
381
  useEffect(() => {
392
382
  if (markerRef.current) {
393
- const nextSibling = markerRef.current.nextSibling;
383
+ const nextSibling = getNextSibling(markerRef.current, _hidden);
394
384
  if (ref) {
395
385
  if (typeof ref === 'function') {
396
386
  ref(nextSibling);
@@ -399,8 +389,8 @@ const ComponentMarker = /*#__PURE__*/forwardRef((_, ref) => {
399
389
  }
400
390
  }
401
391
  }
402
- }, []);
403
- return jsx("div", {
392
+ }, [_hidden]);
393
+ return /*#__PURE__*/jsx("div", {
404
394
  className: "nt-cmp-marker",
405
395
  style: {
406
396
  display: 'none'
@@ -408,14 +398,31 @@ const ComponentMarker = /*#__PURE__*/forwardRef((_, ref) => {
408
398
  ref: markerRef
409
399
  });
410
400
  });
401
+ const getNextSibling = (element, recursive = false) => {
402
+ if (!recursive) {
403
+ return element.nextSibling;
404
+ }
405
+ const {
406
+ parentElement
407
+ } = element;
408
+ if (!parentElement) {
409
+ return null;
410
+ }
411
+ if (parentElement.nextSibling) {
412
+ return parentElement.nextSibling;
413
+ }
414
+ return getNextSibling(parentElement, true);
415
+ };
411
416
 
412
- const DefaultExperienceLoadingComponent = _a => {
413
- var {
417
+ const _excluded$1 = ["component", "unhideAfterMs", "passthroughProps"],
418
+ _excluded2 = ["experiences", "component", "loadingComponent", "passthroughProps"];
419
+ const DefaultExperienceLoadingComponent = _ref => {
420
+ let {
414
421
  component: Component,
415
422
  unhideAfterMs = 5000,
416
423
  passthroughProps
417
- } = _a,
418
- baseline = __rest(_a, ["component", "unhideAfterMs", "passthroughProps"]);
424
+ } = _ref,
425
+ baseline = _objectWithoutPropertiesLoose(_ref, _excluded$1);
419
426
  const {
420
427
  logger
421
428
  } = useNinetailed();
@@ -430,12 +437,11 @@ const DefaultExperienceLoadingComponent = _a => {
430
437
  };
431
438
  }, []);
432
439
  if (hidden) {
433
- return jsx("div", Object.assign({
440
+ return /*#__PURE__*/jsx("div", {
434
441
  style: {
435
442
  opacity: 0
436
- }
437
- }, {
438
- children: jsx(Component, Object.assign({}, passthroughProps, baseline, {
443
+ },
444
+ children: /*#__PURE__*/jsx(Component, Object.assign({}, passthroughProps, baseline, {
439
445
  ninetailed: {
440
446
  isPersonalized: false,
441
447
  audience: {
@@ -443,9 +449,9 @@ const DefaultExperienceLoadingComponent = _a => {
443
449
  }
444
450
  }
445
451
  }))
446
- }), "hide");
452
+ }, "hide");
447
453
  }
448
- return jsx(Component, Object.assign({}, passthroughProps, baseline, {
454
+ return /*#__PURE__*/jsx(Component, Object.assign({}, passthroughProps, baseline, {
449
455
  ninetailed: {
450
456
  isPersonalized: false,
451
457
  audience: {
@@ -454,14 +460,14 @@ const DefaultExperienceLoadingComponent = _a => {
454
460
  }
455
461
  }));
456
462
  };
457
- const Experience = _a => {
458
- var {
463
+ const Experience = _ref2 => {
464
+ let {
459
465
  experiences,
460
466
  component: Component,
461
467
  loadingComponent: LoadingComponent = DefaultExperienceLoadingComponent,
462
468
  passthroughProps
463
- } = _a,
464
- baseline = __rest(_a, ["experiences", "component", "loadingComponent", "passthroughProps"]);
469
+ } = _ref2,
470
+ baseline = _objectWithoutPropertiesLoose(_ref2, _excluded2);
465
471
  const {
466
472
  observeElement,
467
473
  unobserveElement,
@@ -479,9 +485,10 @@ const Experience = _a => {
479
485
  baseline,
480
486
  experiences
481
487
  });
488
+
482
489
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
483
490
  // @ts-ignore
484
- const isComponentForwardRef = isForwardRef(jsx(Component, {}));
491
+ const isComponentForwardRef = isForwardRef( /*#__PURE__*/jsx(Component, {}));
485
492
  const componentRef = useRef(null);
486
493
  useEffect(() => {
487
494
  const componentElement = componentRef.current;
@@ -513,10 +520,10 @@ const Experience = _a => {
513
520
  };
514
521
  }, [observeElement, unobserveElement, experience, baseline, variant, variantIndex, audience]);
515
522
  if (!hasVariants) {
516
- return jsxs(Fragment, {
517
- children: [!isComponentForwardRef && jsx(ComponentMarker, {
523
+ return /*#__PURE__*/jsxs(Fragment, {
524
+ children: [!isComponentForwardRef && /*#__PURE__*/jsx(ComponentMarker, {
518
525
  ref: componentRef
519
- }, `marker-no-variants-${(experience === null || experience === void 0 ? void 0 : experience.id) || 'baseline'}-${variant.id}`), /*#__PURE__*/createElement(Component, Object.assign({}, passthroughProps, baseline, {
526
+ }, `marker-no-variants-${(experience == null ? void 0 : experience.id) || 'baseline'}-${variant.id}`), /*#__PURE__*/createElement(Component, Object.assign({}, passthroughProps, baseline, {
520
527
  key: baseline.id
521
528
  }, isComponentForwardRef ? {
522
529
  ref: componentRef
@@ -533,19 +540,20 @@ const Experience = _a => {
533
540
  }
534
541
  const isVariantHidden = 'hidden' in variant && variant.hidden;
535
542
  if (isVariantHidden) {
536
- return jsx(ComponentMarker, {
537
- ref: componentRef
538
- }, `marker-hidden-${(experience === null || experience === void 0 ? void 0 : experience.id) || 'baseline'}-${variant.id}`);
543
+ return /*#__PURE__*/jsx(ComponentMarker, {
544
+ ref: componentRef,
545
+ hidden: true
546
+ }, `marker-hidden-${(experience == null ? void 0 : experience.id) || 'baseline'}-${variant.id}`);
539
547
  }
540
- return jsxs(Fragment, {
541
- children: [!isComponentForwardRef && jsx(ComponentMarker, {
548
+ return /*#__PURE__*/jsxs(Fragment, {
549
+ children: [!isComponentForwardRef && /*#__PURE__*/jsx(ComponentMarker, {
542
550
  ref: componentRef
543
- }, `marker-${(experience === null || experience === void 0 ? void 0 : experience.id) || 'baseline'}-${variant.id}`), /*#__PURE__*/createElement(Component, Object.assign({}, Object.assign(Object.assign({}, passthroughProps), variant), {
544
- key: `${(experience === null || experience === void 0 ? void 0 : experience.id) || 'baseline'}-${variant.id}`,
551
+ }, `marker-${(experience == null ? void 0 : experience.id) || 'baseline'}-${variant.id}`), /*#__PURE__*/createElement(Component, Object.assign({}, Object.assign({}, passthroughProps, variant), {
552
+ key: `${(experience == null ? void 0 : experience.id) || 'baseline'}-${variant.id}`,
545
553
  ninetailed: {
546
554
  isPersonalized,
547
555
  audience: {
548
- id: (audience === null || audience === void 0 ? void 0 : audience.id) || 'all visitors'
556
+ id: (audience == null ? void 0 : audience.id) || 'all visitors'
549
557
  }
550
558
  }
551
559
  }, isComponentForwardRef ? {
@@ -554,18 +562,18 @@ const Experience = _a => {
554
562
  });
555
563
  };
556
564
 
565
+ const _excluded = ["experiences", "component", "passthroughProps"];
557
566
  const ESRContext = /*#__PURE__*/React.createContext(undefined);
558
567
  const ESRProvider = ({
559
568
  experienceVariantsMap,
560
569
  children
561
570
  }) => {
562
- return jsx(ESRContext.Provider, Object.assign({
571
+ return /*#__PURE__*/jsx(ESRContext.Provider, {
563
572
  value: {
564
573
  experienceVariantsMap
565
- }
566
- }, {
574
+ },
567
575
  children: children
568
- }));
576
+ });
569
577
  };
570
578
  const useESR = () => {
571
579
  const context = React.useContext(ESRContext);
@@ -576,19 +584,19 @@ const useESR = () => {
576
584
  experienceVariantsMap: context.experienceVariantsMap
577
585
  };
578
586
  };
579
- const ESRLoadingComponent = _a => {
580
- var {
587
+ const ESRLoadingComponent = _ref => {
588
+ let {
581
589
  experiences,
582
590
  component: Component,
583
591
  passthroughProps
584
- } = _a,
585
- baseline = __rest(_a, ["experiences", "component", "passthroughProps"]);
592
+ } = _ref,
593
+ baseline = _objectWithoutPropertiesLoose(_ref, _excluded);
586
594
  const {
587
595
  experienceVariantsMap
588
596
  } = useESR();
589
597
  const experience = experiences.find(experience => Object.prototype.hasOwnProperty.call(experienceVariantsMap, experience.id));
590
598
  if (!experience) {
591
- return jsx(Component, Object.assign({}, passthroughProps, baseline, {
599
+ return /*#__PURE__*/jsx(Component, Object.assign({}, passthroughProps, baseline, {
592
600
  ninetailed: {
593
601
  isPersonalized: false,
594
602
  audience: {
@@ -599,7 +607,7 @@ const ESRLoadingComponent = _a => {
599
607
  }
600
608
  const component = experience.components.find(component => component.baseline.id === baseline.id);
601
609
  if (!component) {
602
- return jsx(Component, Object.assign({}, passthroughProps, baseline, {
610
+ return /*#__PURE__*/jsx(Component, Object.assign({}, passthroughProps, baseline, {
603
611
  ninetailed: {
604
612
  isPersonalized: false,
605
613
  audience: {
@@ -609,7 +617,7 @@ const ESRLoadingComponent = _a => {
609
617
  }));
610
618
  }
611
619
  if (experienceVariantsMap[experience.id] === 0) {
612
- return jsx(Component, Object.assign({}, passthroughProps, baseline, {
620
+ return /*#__PURE__*/jsx(Component, Object.assign({}, passthroughProps, baseline, {
613
621
  ninetailed: {
614
622
  isPersonalized: false,
615
623
  audience: {
@@ -620,7 +628,7 @@ const ESRLoadingComponent = _a => {
620
628
  }
621
629
  const variant = component.variants[experienceVariantsMap[experience.id] - 1];
622
630
  if (!variant) {
623
- return jsx(Component, Object.assign({}, passthroughProps, baseline, {
631
+ return /*#__PURE__*/jsx(Component, Object.assign({}, passthroughProps, baseline, {
624
632
  ninetailed: {
625
633
  isPersonalized: false,
626
634
  audience: {
@@ -629,7 +637,7 @@ const ESRLoadingComponent = _a => {
629
637
  }
630
638
  }));
631
639
  }
632
- return jsx(Component, Object.assign({}, passthroughProps, variant, {
640
+ return /*#__PURE__*/jsx(Component, Object.assign({}, passthroughProps, variant, {
633
641
  ninetailed: {
634
642
  isPersonalized: false,
635
643
  audience: {
package/package.json CHANGED
@@ -1,7 +1,16 @@
1
1
  {
2
2
  "name": "@ninetailed/experience.js-react",
3
- "version": "7.5.2",
3
+ "version": "7.5.3-beta.2",
4
4
  "description": "Ninetailed SDK for React",
5
+ "dependencies": {
6
+ "@ninetailed/experience.js": "*",
7
+ "@ninetailed/experience.js-shared": "*",
8
+ "radash": "10.9.0",
9
+ "react-intersection-observer": "8.34.0",
10
+ "react-is": "18.2.0",
11
+ "@testing-library/react-hooks": "7.0.2",
12
+ "@testing-library/react": "13.4.0"
13
+ },
5
14
  "peerDependencies": {
6
15
  "react": ">=16.8.0"
7
16
  },
@@ -11,15 +20,12 @@
11
20
  "url": "https://github.com/ninetailed-inc/experience.js.git",
12
21
  "directory": "packages/sdks/react"
13
22
  },
14
- "module": "./index.js",
15
- "main": "./index.cjs",
16
- "type": "module",
17
- "types": "./src/index.d.ts",
18
- "dependencies": {
19
- "@ninetailed/experience.js": "7.5.2",
20
- "@ninetailed/experience.js-shared": "7.5.2",
21
- "radash": "10.9.0",
22
- "react-intersection-observer": "8.34.0",
23
- "react-is": "18.2.0"
24
- }
23
+ "keywords": [
24
+ "react",
25
+ "ninetailed",
26
+ "personalization",
27
+ "a/b testing"
28
+ ],
29
+ "module": "./index.esm.js",
30
+ "main": "./index.cjs.js"
25
31
  }
@@ -1,2 +1,6 @@
1
1
  import React from 'react';
2
- export declare const ComponentMarker: React.ForwardRefExoticComponent<React.RefAttributes<unknown>>;
2
+ type ComponentMarkerProps = {
3
+ hidden?: boolean;
4
+ };
5
+ export declare const ComponentMarker: React.ForwardRefExoticComponent<ComponentMarkerProps & React.RefAttributes<unknown>>;
6
+ export {};
@@ -12,5 +12,5 @@ export declare const ESRProvider: React.FC<PropsWithChildren<ESRProviderProps>>;
12
12
  export declare const useESR: () => {
13
13
  experienceVariantsMap: Record<string, number>;
14
14
  };
15
- export declare const ESRLoadingComponent: <P, PassThroughProps extends Partial<P> = Partial<P>, Variant extends Pick<P, Exclude<keyof P, keyof PassThroughProps>> & Reference = Pick<P, Exclude<keyof P, keyof PassThroughProps>> & Reference>({ experiences, component: Component, passthroughProps, ...baseline }: ExperienceBaseProps<P, PassThroughProps, Variant>) => JSX.Element;
15
+ export declare const ESRLoadingComponent: <P, PassThroughProps extends Partial<P> = Partial<P>, Variant extends Pick<P, Exclude<keyof P, keyof PassThroughProps>> & Reference = Pick<P, Exclude<keyof P, keyof PassThroughProps>> & Reference>({ experiences, component: Component, passthroughProps, ...baseline }: ExperienceBaseProps<P, PassThroughProps, Variant>) => import("react/jsx-runtime").JSX.Element;
16
16
  export {};
@@ -23,5 +23,5 @@ type DefaultExperienceLoadingComponentProps = ExperienceBaseProps<Record<string,
23
23
  unhideAfterMs?: number;
24
24
  };
25
25
  export declare const DefaultExperienceLoadingComponent: React.FC<DefaultExperienceLoadingComponentProps>;
26
- export declare const Experience: <P, PassThroughProps extends Partial<P> = Partial<P>, Variant extends Pick<P, Exclude<keyof P, keyof PassThroughProps>> & Reference = Pick<P, Exclude<keyof P, keyof PassThroughProps>> & Reference>({ experiences, component: Component, loadingComponent: LoadingComponent, passthroughProps, ...baseline }: ExperienceProps<P, PassThroughProps, Variant>) => JSX.Element;
26
+ export declare const Experience: <P, PassThroughProps extends Partial<P> = Partial<P>, Variant extends Pick<P, Exclude<keyof P, keyof PassThroughProps>> & Reference = Pick<P, Exclude<keyof P, keyof PassThroughProps>> & Reference>({ experiences, component: Component, loadingComponent: LoadingComponent, passthroughProps, ...baseline }: ExperienceProps<P, PassThroughProps, Variant>) => import("react/jsx-runtime").JSX.Element;
27
27
  export {};
@@ -3,5 +3,5 @@ type MergeTagProps = {
3
3
  id: string;
4
4
  fallback?: string;
5
5
  };
6
- export declare const MergeTag: ({ id, fallback, }: PropsWithChildren<MergeTagProps>) => JSX.Element | null;
6
+ export declare const MergeTag: ({ id, fallback, }: PropsWithChildren<MergeTagProps>) => import("react/jsx-runtime").JSX.Element | null;
7
7
  export {};
@@ -19,4 +19,4 @@ export type NinetailedProviderInstantiationProps = {
19
19
  export type NinetailedProviderProps = NinetailedProviderInstantiationProps | {
20
20
  ninetailed: Ninetailed;
21
21
  };
22
- export declare const NinetailedProvider: (props: React.PropsWithChildren<NinetailedProviderProps>) => JSX.Element;
22
+ export declare const NinetailedProvider: (props: React.PropsWithChildren<NinetailedProviderProps>) => import("react/jsx-runtime").JSX.Element;
@@ -19,5 +19,5 @@ type PersonalizeProps<P> = Baseline<P> & {
19
19
  loadingComponent?: React.ComponentType;
20
20
  holdout?: number;
21
21
  };
22
- export declare const Personalize: <P extends object>({ component: Component, loadingComponent: LoadingComponent, variants, holdout, ...baseline }: PersonalizeProps<P>) => JSX.Element;
22
+ export declare const Personalize: <P extends object>({ component: Component, loadingComponent: LoadingComponent, variants, holdout, ...baseline }: PersonalizeProps<P>) => import("react/jsx-runtime").JSX.Element;
23
23
  export {};