@uniformdev/context-react 17.7.0 → 17.7.1-alpha.167

package/dist/index.d.ts

@@ -14,7 +14,7 @@ declare function useQuirks(): Quirks;
  */
 declare function useScores(): ScoreVector;
 
-declare type VariantOutputType = 'edge' | 'standard';
+type VariantOutputType = 'edge' | 'standard';
 interface UniformContextProps$1 {
     /** The configured Uniform Context instance to provide */
     context: Context;
@@ -38,7 +38,7 @@ interface UniformContextProps$1 {
  */
 declare const UniformContext: react__default.FC<react__default.PropsWithChildren<UniformContextProps$1>>;
 
-declare type UniformContextProps = {
+type UniformContextProps = {
     context: Context;
     outputType: VariantOutputType;
 };
@@ -61,17 +61,17 @@ interface UseUniformContextDoesNotThrowOptions extends UseUniformContextOptions
 declare function useUniformContext(options?: UseUniformContextThrowsOptions): UniformContextProps;
 declare function useUniformContext(options?: UseUniformContextDoesNotThrowOptions): UniformContextProps | undefined;
 
-declare type PersonalizeWrapperComponent = react__default.ComponentType<{
+type PersonalizeWrapperComponent = react__default.ComponentType<{
     children: ReactNode;
     personalizationOccurred: boolean;
 }>;
-declare type PersonalizedVariationComponent<TVariation> = react__default.ComponentType<TVariation & {
+type PersonalizedVariationComponent<TVariation> = react__default.ComponentType<TVariation & {
     personalizationResult: {
         variation: PersonalizedVariant;
         personalizationOccurred: boolean;
     };
 }>;
-declare type PersonalizeComponentProps<TVariation extends PersonalizedVariant> = {
+type PersonalizeComponentProps<TVariation extends PersonalizedVariant> = {
     /**
      * Name of the personalized placement. Should be unique to this placement location and set of variants.
      * This name is emitted to analytics after personalization executes.
@@ -88,7 +88,7 @@ declare type PersonalizeComponentProps<TVariation extends PersonalizedVariant> =
 };
 declare function Personalize<TVariation extends PersonalizedVariant>(props: PersonalizeComponentProps<TVariation>): ReactElement | null;
 
-declare type TVariation = TestVariant;
+type TVariation = TestVariant;
 interface TestComponentProps<TVariation extends TestVariant> {
     /** Name of the test that is running. */
     name: string;
@@ -106,7 +106,7 @@ interface TestComponentProps<TVariation extends TestVariant> {
 }
 declare const Test: <TVariation_1 extends TestVariant>(props: TestComponentProps<TVariation_1>) => ReactElement | null;
 
-declare type TrackFragmentProps = {
+type TrackFragmentProps = {
     /** Behavior that will be pushed when tracking occurs. */
     behavior: EnrichmentData | EnrichmentData[] | undefined;
     /** Nested elements that are related to the behavior specified. */
@@ -120,7 +120,7 @@ declare type TrackFragmentProps = {
  */
 declare const TrackFragment: ({ behavior, children }: TrackFragmentProps) => JSX.Element;
 
-declare type TrackProps = TrackFragmentProps & HTMLAttributes<HTMLElement> & {
+type TrackProps = TrackFragmentProps & HTMLAttributes<HTMLElement> & {
     /**
      * Element tag that will be used for tracking.
      *

package/dist/index.esm.js

@@ -1 +1,403 @@
-import{useEffect as j,useState as X}from"react";function xe(){let{context:e}=s(),[o,t]=X(e.quirks),r=n=>{t(n)};return j(()=>(e.events.on("quirksUpdated",r),()=>{e.events.off("quirksUpdated",r)}),[e]),o}import{dequal as G}from"dequal/lite";import{useEffect as K,useState as Y}from"react";function _(){let{context:e}=s(),[o,t]=Y(e.scores);return K(()=>{let r=a=>{t(a)},n=e.scores;return G(o,n)||t(n),e.events.on("scoresUpdated",r),()=>{e.events.off("scoresUpdated",r)}},[e]),o}import{useContext as Z}from"react";import{createContext as I}from"react";var V=I(void 0),U=I({});function s(e={}){let{throwOnMissingProvider:o=!0}=e,t=Z(V);if(o){if(t===void 0)throw new Error("useUniformContext must be used within a <UniformContext> provider");return t}return t}import H from"react";var C=typeof window=="undefined";import{ScriptType as z}from"@uniformdev/context";import x,{Fragment as te}from"react";import{EdgeNodeTagName as $}from"@uniformdev/context";import{createElement as ee}from"react";var u=e=>ee($,e);function M(e){let{variations:o,count:t,component:r}=e,n={name:e.name,count:t!=null?t:1},a=r;return x.createElement(x.Fragment,null,x.createElement(u,{"data-type":z.ListStart,dangerouslySetInnerHTML:{__html:JSON.stringify(n)}}),o.map(i=>x.createElement(te,{key:i.id},x.createElement(u,{"data-type":z.ListItemSettings,dangerouslySetInnerHTML:{__html:JSON.stringify({id:i.id,pz:i.pz||null})}}),x.createElement(u,{"data-type":z.ListItem},x.createElement(a,{key:i.id,personalizationResult:{variation:i,personalizationOccurred:!1},...i})))),x.createElement(u,{"data-type":z.ListEnd}))}import P,{useMemo as oe}from"react";function N({variations:e,component:o,wrapperComponent:t,name:r,count:n=1}){let{context:a}=s(),i=_(),{variations:m,personalized:d}=oe(()=>a.personalize({name:r,variations:e,take:n}),[i,a,n,r,e]),l=t!=null?t:({children:c})=>P.createElement(P.Fragment,null,c),g=o;return P.createElement(U.Provider,{value:{personalized:!0}},m.length?P.createElement(l,{personalizationOccurred:d},m.map(c=>P.createElement(g,{key:c.id,personalizationResult:{variation:c,personalizationOccurred:d},...c}))):null)}function Ke(e){var t;let{outputType:o}=(t=s({throwOnMissingProvider:!1}))!=null?t:{};if(!o)throw new Error("Using the <Personalize /> component requires the <UniformContext> provider to be present.");return!C||o==="standard"?H.createElement(N,{...e}):o==="edge"?H.createElement(M,{...e}):null}import R from"react";import{ScriptType as h}from"@uniformdev/context";import T,{Fragment as re}from"react";function A(e){let{name:o,variations:t,component:r}=e,n={name:o},a=r;return T.createElement(T.Fragment,null,T.createElement(u,{"data-type":h.TestStart,dangerouslySetInnerHTML:{__html:JSON.stringify(n)}}),t.map((i,m)=>T.createElement(re,{key:i.id},T.createElement(u,{"data-type":h.ListItemSettings,dangerouslySetInnerHTML:{__html:JSON.stringify({id:i.id})}}),T.createElement(u,{"data-type":h.ListItem},T.createElement(a,{key:m,...i})))),T.createElement(u,{"data-type":h.TestEnd}))}import ne from"react";var F=({name:e,variations:o,component:t})=>{let{context:r}=s(),{result:n}=r.test({name:e,variations:o});return n?ne.createElement(t,{...n}):null};var xt=e=>{var t;let{outputType:o}=(t=s({throwOnMissingProvider:!1}))!=null?t:{};if(!o)throw new Error("Using the <Test /> component requires the <UniformContext> provider to be present.");return!C||o==="standard"?R.createElement(F,{...e}):o==="edge"?R.createElement(A,{...e}):null};import{createElement as se,useEffect as D,useRef as q,useState as b}from"react";import{useContext as ie}from"react";var S=e=>{let{personalized:o}=ie(U);return typeof o!="undefined"?o:typeof(e==null?void 0:e.personalized)!="undefined"?e.personalized:!1};var zt=({behavior:e,children:o,tagName:t="div",threshold:r=.5,disableVisibilityTrigger:n=typeof window=="undefined"||!("IntersectionObserver"in window),...a})=>{let i=typeof document=="undefined"?"__uniform_ssr_url":document.location.href,{context:m}=s(),d=S(),[l,g]=b(),[c,y]=b(!1),O=q(null),p=q();return D(()=>{l!==i&&(y(!1),g(i))},[i,l]),D(()=>{var L;let w=!e||Array.isArray(e)&&!e.length;if(d||w||!O.current)return;let W=Array.isArray(e)?e:[e],v=()=>{var f;c||(m.update({enrichments:W}),y(!0),(f=p.current)==null||f.call(p))};if(n)v();else{(L=p.current)==null||L.call(p);let f=new IntersectionObserver(([E])=>{E.isIntersecting&&v()},{threshold:r});f.observe(O.current),p.current=()=>{var E;return(E=f.disconnect)==null?void 0:E.call(f)}}return()=>{var f;(f=p.current)==null||f.call(p)}},[m,e,n,r,d,l,i,c]),se(t,{...a,ref:O},o)};import J from"react";import{useEffect as B,useState as Q}from"react";var Lt=({behavior:e,children:o})=>{let t=typeof document=="undefined"?"__uniform_ssr_url":document.location.href,{context:r}=s(),n=S(),[a,i]=Q(),[m,d]=Q(!1);return B(()=>{a!==t&&(d(!1),i(t))},[t,a]),B(()=>{let l=!e||Array.isArray(e)&&!e.length;if(n||l)return;(()=>{if(m)return;let y=Array.isArray(e)?e:[e];r.update({enrichments:y}),d(!0)})()},[r,e,n,m]),J.createElement(J.Fragment,null,o)};import{SERVER_STATE_ID as ae}from"@uniformdev/context";import me from"cookie";import k,{useEffect as pe}from"react";var Dt=({context:e,children:o,outputType:t="standard",trackRouteOnRender:r=!0})=>(pe(()=>{C||!r||e.update({url:new URL(window.location.href),cookies:me.parse(document.cookie)})}),k.createElement(V.Provider,{value:{context:e,outputType:t}},o,C?k.createElement(fe,null):null));function fe(){let{context:e}=s(),o=e.getServerToClientTransitionState();return k.createElement("script",{id:ae,type:"application/json",dangerouslySetInnerHTML:{__html:JSON.stringify(o)}})}export{Ke as Personalize,xt as Test,zt as Track,Lt as TrackFragment,Dt as UniformContext,xe as useQuirks,_ as useScores,s as useUniformContext};
+// src/hooks/useQuirks.ts
+import { useEffect, useState } from "react";
+function useQuirks() {
+  const { context } = useUniformContext();
+  const [quirks, setQuirks] = useState(context.quirks);
+  const quirkChangeListener = (updatedQuirks) => {
+    setQuirks(updatedQuirks);
+  };
+  useEffect(() => {
+    context.events.on("quirksUpdated", quirkChangeListener);
+    return () => {
+      context.events.off("quirksUpdated", quirkChangeListener);
+    };
+  }, [context]);
+  return quirks;
+}
+
+// src/hooks/useScores.ts
+import { dequal } from "dequal/lite";
+import { useEffect as useEffect2, useState as useState2 } from "react";
+function useScores() {
+  const { context } = useUniformContext();
+  const [scores, setScores] = useState2(context.scores);
+  useEffect2(() => {
+    const scoringChangeListener = (updatedScores) => {
+      setScores(updatedScores);
+    };
+    const currentScores = context.scores;
+    if (!dequal(scores, currentScores)) {
+      setScores(currentScores);
+    }
+    context.events.on("scoresUpdated", scoringChangeListener);
+    return () => {
+      context.events.off("scoresUpdated", scoringChangeListener);
+    };
+  }, [context]);
+  return scores;
+}
+
+// src/hooks/useUniformContext.ts
+import { useContext } from "react";
+
+// src/contexts.tsx
+import { createContext } from "react";
+var UniformContextContext = createContext(void 0);
+var PersonalizationContext = createContext({});
+
+// src/hooks/useUniformContext.ts
+function useUniformContext(options = {}) {
+  const { throwOnMissingProvider = true } = options;
+  const value = useContext(UniformContextContext);
+  if (throwOnMissingProvider) {
+    if (value === void 0) {
+      throw new Error("useUniformContext must be used within a <UniformContext> provider");
+    }
+    return value;
+  }
+  return value;
+}
+
+// src/components/Personalize.tsx
+import React3 from "react";
+
+// src/constants.ts
+var isServer = typeof window === "undefined";
+
+// src/components/PersonalizeEdge.tsx
+import { ScriptType } from "@uniformdev/context";
+import React, { Fragment } from "react";
+
+// src/components/EdgeTag.tsx
+import { EdgeNodeTagName } from "@uniformdev/context";
+import { createElement } from "react";
+var EdgeTag = (props) => {
+  return createElement(EdgeNodeTagName, props);
+};
+
+// src/components/PersonalizeEdge.tsx
+function PersonalizeEdge(props) {
+  const { variations, count, component } = props;
+  const options = {
+    name: props.name,
+    count: count != null ? count : 1
+  };
+  const Component = component;
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+    EdgeTag,
+    {
+      "data-type": ScriptType.ListStart,
+      dangerouslySetInnerHTML: { __html: JSON.stringify(options) }
+    }
+  ), variations.map((variant) => /* @__PURE__ */ React.createElement(Fragment, { key: variant.id }, /* @__PURE__ */ React.createElement(
+    EdgeTag,
+    {
+      "data-type": ScriptType.ListItemSettings,
+      dangerouslySetInnerHTML: {
+        __html: JSON.stringify({
+          id: variant.id,
+          pz: variant.pz || null
+        })
+      }
+    }
+  ), /* @__PURE__ */ React.createElement(EdgeTag, { "data-type": ScriptType.ListItem }, /* @__PURE__ */ React.createElement(
+    Component,
+    {
+      key: variant.id,
+      personalizationResult: { variation: variant, personalizationOccurred: false },
+      ...variant
+    }
+  )))), /* @__PURE__ */ React.createElement(EdgeTag, { "data-type": ScriptType.ListEnd }));
+}
+
+// src/components/PersonalizeStandard.tsx
+import React2, { useMemo } from "react";
+function PersonalizeStandard({
+  variations,
+  component,
+  wrapperComponent,
+  name,
+  count = 1
+}) {
+  const { context } = useUniformContext();
+  const scores = useScores();
+  const { variations: personalizedVariations, personalized: personalizationOccurred } = useMemo(
+    () => context.personalize({
+      name,
+      variations,
+      take: count
+    }),
+    [scores, context, count, name, variations]
+  );
+  const Wrapper = wrapperComponent != null ? wrapperComponent : ({ children }) => /* @__PURE__ */ React2.createElement(React2.Fragment, null, children);
+  const Component = component;
+  return /* @__PURE__ */ React2.createElement(PersonalizationContext.Provider, { value: { personalized: true } }, personalizedVariations.length ? /* @__PURE__ */ React2.createElement(Wrapper, { personalizationOccurred }, personalizedVariations.map((variant) => /* @__PURE__ */ React2.createElement(
+    Component,
+    {
+      key: variant.id,
+      personalizationResult: { variation: variant, personalizationOccurred },
+      ...variant
+    }
+  ))) : null);
+}
+
+// src/components/Personalize.tsx
+function Personalize(props) {
+  var _a;
+  const { outputType } = (_a = useUniformContext({ throwOnMissingProvider: false })) != null ? _a : {};
+  if (!outputType) {
+    throw new Error(
+      "Using the <Personalize /> component requires the <UniformContext> provider to be present."
+    );
+  }
+  if (!isServer || outputType === "standard") {
+    return /* @__PURE__ */ React3.createElement(PersonalizeStandard, { ...props });
+  } else if (outputType === "edge") {
+    return /* @__PURE__ */ React3.createElement(PersonalizeEdge, { ...props });
+  }
+  return null;
+}
+
+// src/components/Test.tsx
+import React6 from "react";
+
+// src/components/TestEdge.tsx
+import { ScriptType as ScriptType2 } from "@uniformdev/context";
+import React4, { Fragment as Fragment2 } from "react";
+function TestEdge(props) {
+  const { name, variations, component } = props;
+  const options = {
+    name
+  };
+  const Component = component;
+  return /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(
+    EdgeTag,
+    {
+      "data-type": ScriptType2.TestStart,
+      dangerouslySetInnerHTML: { __html: JSON.stringify(options) }
+    }
+  ), variations.map((variation, index) => {
+    return /* @__PURE__ */ React4.createElement(Fragment2, { key: variation.id }, /* @__PURE__ */ React4.createElement(
+      EdgeTag,
+      {
+        "data-type": ScriptType2.ListItemSettings,
+        dangerouslySetInnerHTML: {
+          __html: JSON.stringify({
+            id: variation.id
+          })
+        }
+      }
+    ), /* @__PURE__ */ React4.createElement(EdgeTag, { "data-type": ScriptType2.ListItem }, /* @__PURE__ */ React4.createElement(Component, { key: index, ...variation })));
+  }), /* @__PURE__ */ React4.createElement(EdgeTag, { "data-type": ScriptType2.TestEnd }));
+}
+
+// src/components/TestStandard.tsx
+import React5 from "react";
+var TestStandard = ({
+  name,
+  variations,
+  component
+}) => {
+  const { context } = useUniformContext();
+  const { result } = context.test({
+    name,
+    variations
+  });
+  if (!result) {
+    return null;
+  }
+  const Component = component;
+  return /* @__PURE__ */ React5.createElement(Component, { ...result });
+};
+
+// src/components/Test.tsx
+var Test = (props) => {
+  var _a;
+  const { outputType } = (_a = useUniformContext({ throwOnMissingProvider: false })) != null ? _a : {};
+  if (!outputType) {
+    throw new Error("Using the <Test /> component requires the <UniformContext> provider to be present.");
+  }
+  if (!isServer || outputType === "standard") {
+    return /* @__PURE__ */ React6.createElement(TestStandard, { ...props });
+  } else if (outputType === "edge") {
+    return /* @__PURE__ */ React6.createElement(TestEdge, { ...props });
+  }
+  return null;
+};
+
+// src/components/Track.tsx
+import { createElement as createElement2, useEffect as useEffect3, useRef, useState as useState3 } from "react";
+
+// src/hooks/useIsPersonalized.ts
+import { useContext as useContext2 } from "react";
+var useIsPersonalized = (options) => {
+  const { personalized } = useContext2(PersonalizationContext);
+  if (typeof personalized !== "undefined") {
+    return personalized;
+  }
+  if (typeof (options == null ? void 0 : options.personalized) !== "undefined") {
+    return options.personalized;
+  }
+  return false;
+};
+
+// src/components/Track.tsx
+var Track = ({
+  behavior,
+  children,
+  tagName = "div",
+  threshold = 0.5,
+  disableVisibilityTrigger = typeof window === "undefined" || !("IntersectionObserver" in window),
+  ...rest
+}) => {
+  const currentUrl = typeof document === "undefined" ? "__uniform_ssr_url" : document.location.href;
+  const { context } = useUniformContext();
+  const insidePersonalizeComponent = useIsPersonalized();
+  const [lastUrl, setLastUrl] = useState3();
+  const [hasTracked, setHasTracked] = useState3(false);
+  const wrapperEl = useRef(null);
+  const disconnect = useRef();
+  useEffect3(() => {
+    const urlHasChanged = lastUrl !== currentUrl;
+    if (urlHasChanged) {
+      setHasTracked(false);
+      setLastUrl(currentUrl);
+    }
+  }, [currentUrl, lastUrl]);
+  useEffect3(() => {
+    var _a;
+    const hasNoBehaviorValue = !behavior || Array.isArray(behavior) && !behavior.length;
+    const cannotTrack = insidePersonalizeComponent || hasNoBehaviorValue;
+    if (cannotTrack || !wrapperEl.current)
+      return;
+    const enrichments = Array.isArray(behavior) ? behavior : [behavior];
+    const pushBehaviorEnrichment = () => {
+      var _a2;
+      if (hasTracked) {
+        return;
+      }
+      context.update({
+        enrichments
+      });
+      setHasTracked(true);
+      (_a2 = disconnect.current) == null ? void 0 : _a2.call(disconnect);
+    };
+    if (disableVisibilityTrigger) {
+      pushBehaviorEnrichment();
+    } else {
+      (_a = disconnect.current) == null ? void 0 : _a.call(disconnect);
+      const instance = new IntersectionObserver(
+        ([entry]) => {
+          if (entry.isIntersecting) {
+            pushBehaviorEnrichment();
+          }
+        },
+        {
+          threshold
+        }
+      );
+      instance.observe(wrapperEl.current);
+      disconnect.current = () => {
+        var _a2;
+        return (_a2 = instance.disconnect) == null ? void 0 : _a2.call(instance);
+      };
+    }
+    return () => {
+      var _a2;
+      (_a2 = disconnect.current) == null ? void 0 : _a2.call(disconnect);
+    };
+  }, [
+    context,
+    behavior,
+    disableVisibilityTrigger,
+    threshold,
+    insidePersonalizeComponent,
+    lastUrl,
+    currentUrl,
+    hasTracked
+  ]);
+  const element = createElement2(tagName, { ...rest, ref: wrapperEl }, children);
+  return element;
+};
+
+// src/components/TrackFragment.tsx
+import React7 from "react";
+import { useEffect as useEffect4, useState as useState4 } from "react";
+var TrackFragment = ({ behavior, children }) => {
+  const currentUrl = typeof document === "undefined" ? "__uniform_ssr_url" : document.location.href;
+  const { context } = useUniformContext();
+  const insidePersonalizeComponent = useIsPersonalized();
+  const [lastUrl, setLastUrl] = useState4();
+  const [hasTracked, setHasTracked] = useState4(false);
+  useEffect4(() => {
+    const urlHasChanged = lastUrl !== currentUrl;
+    if (urlHasChanged) {
+      setHasTracked(false);
+      setLastUrl(currentUrl);
+    }
+  }, [currentUrl, lastUrl]);
+  useEffect4(() => {
+    const hasNoBehaviorValue = !behavior || Array.isArray(behavior) && !behavior.length;
+    const cannotTrack = insidePersonalizeComponent || hasNoBehaviorValue;
+    if (cannotTrack)
+      return;
+    const pushBehaviorEnrichment = () => {
+      if (hasTracked) {
+        return;
+      }
+      const enrichments = Array.isArray(behavior) ? behavior : [behavior];
+      context.update({
+        enrichments
+      });
+      setHasTracked(true);
+    };
+    pushBehaviorEnrichment();
+  }, [context, behavior, insidePersonalizeComponent, hasTracked]);
+  return /* @__PURE__ */ React7.createElement(React7.Fragment, null, children);
+};
+
+// src/components/UniformContext.tsx
+import { SERVER_STATE_ID } from "@uniformdev/context";
+import cookie from "cookie";
+import React8, { useEffect as useEffect5 } from "react";
+var UniformContext = ({
+  context,
+  children,
+  outputType = "standard",
+  trackRouteOnRender = true
+}) => {
+  useEffect5(() => {
+    if (isServer || !trackRouteOnRender) {
+      return;
+    }
+    context.update({
+      url: new URL(window.location.href),
+      cookies: cookie.parse(document.cookie)
+    });
+  });
+  return /* @__PURE__ */ React8.createElement(UniformContextContext.Provider, { value: { context, outputType } }, children, isServer ? /* @__PURE__ */ React8.createElement(TransferState, null) : null);
+};
+function TransferState() {
+  const { context } = useUniformContext();
+  const transferState = context.getServerToClientTransitionState();
+  return /* @__PURE__ */ React8.createElement(
+    "script",
+    {
+      id: SERVER_STATE_ID,
+      type: "application/json",
+      dangerouslySetInnerHTML: {
+        __html: JSON.stringify(transferState)
+      }
+    }
+  );
+}
+export {
+  Personalize,
+  Test,
+  Track,
+  TrackFragment,
+  UniformContext,
+  useQuirks,
+  useScores,
+  useUniformContext
+};

package/dist/index.js

@@ -1 +1,443 @@
-"use strict";var re=Object.create;var k=Object.defineProperty;var ne=Object.getOwnPropertyDescriptor;var ie=Object.getOwnPropertyNames;var se=Object.getPrototypeOf,ae=Object.prototype.hasOwnProperty;var me=(e,t)=>{for(var o in t)k(e,o,{get:t[o],enumerable:!0})},J=(e,t,o,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of ie(t))!ae.call(e,r)&&r!==o&&k(e,r,{get:()=>t[r],enumerable:!(n=ne(t,r))||n.enumerable});return e};var T=(e,t,o)=>(o=e!=null?re(se(e)):{},J(t||!e||!e.__esModule?k(o,"default",{value:e,enumerable:!0}):o,e)),pe=e=>J(k({},"__esModule",{value:!0}),e);var Ce={};me(Ce,{Personalize:()=>ue,Test:()=>ce,Track:()=>de,TrackFragment:()=>le,UniformContext:()=>xe,useQuirks:()=>fe,useScores:()=>N,useUniformContext:()=>s});module.exports=pe(Ce);var w=require("react");function fe(){let{context:e}=s(),[t,o]=(0,w.useState)(e.quirks),n=r=>{o(r)};return(0,w.useEffect)(()=>(e.events.on("quirksUpdated",n),()=>{e.events.off("quirksUpdated",n)}),[e]),t}var B=require("dequal/lite"),v=require("react");function N(){let{context:e}=s(),[t,o]=(0,v.useState)(e.scores);return(0,v.useEffect)(()=>{let n=a=>{o(a)},r=e.scores;return(0,B.dequal)(t,r)||o(r),e.events.on("scoresUpdated",n),()=>{e.events.off("scoresUpdated",n)}},[e]),t}var Q=require("react");var H=require("react"),L=(0,H.createContext)(void 0),_=(0,H.createContext)({});function s(e={}){let{throwOnMissingProvider:t=!0}=e,o=(0,Q.useContext)(L);if(t){if(o===void 0)throw new Error("useUniformContext must be used within a <UniformContext> provider");return o}return o}var A=T(require("react"));var y=typeof window=="undefined";var U=require("@uniformdev/context"),m=T(require("react"));var W=require("@uniformdev/context"),j=require("react"),l=e=>(0,j.createElement)(W.EdgeNodeTagName,e);function X(e){let{variations:t,count:o,component:n}=e,r={name:e.name,count:o!=null?o:1},a=n;return m.default.createElement(m.default.Fragment,null,m.default.createElement(l,{"data-type":U.ScriptType.ListStart,dangerouslySetInnerHTML:{__html:JSON.stringify(r)}}),t.map(i=>m.default.createElement(m.Fragment,{key:i.id},m.default.createElement(l,{"data-type":U.ScriptType.ListItemSettings,dangerouslySetInnerHTML:{__html:JSON.stringify({id:i.id,pz:i.pz||null})}}),m.default.createElement(l,{"data-type":U.ScriptType.ListItem},m.default.createElement(a,{key:i.id,personalizationResult:{variation:i,personalizationOccurred:!1},...i})))),m.default.createElement(l,{"data-type":U.ScriptType.ListEnd}))}var g=T(require("react"));function G({variations:e,component:t,wrapperComponent:o,name:n,count:r=1}){let{context:a}=s(),i=N(),{variations:u,personalized:C}=(0,g.useMemo)(()=>a.personalize({name:n,variations:e,take:r}),[i,a,r,n,e]),P=o!=null?o:({children:x})=>g.default.createElement(g.default.Fragment,null,x),h=t;return g.default.createElement(_.Provider,{value:{personalized:!0}},u.length?g.default.createElement(P,{personalizationOccurred:C},u.map(x=>g.default.createElement(h,{key:x.id,personalizationResult:{variation:x,personalizationOccurred:C},...x}))):null)}function ue(e){var o;let{outputType:t}=(o=s({throwOnMissingProvider:!1}))!=null?o:{};if(!t)throw new Error("Using the <Personalize /> component requires the <UniformContext> provider to be present.");return!y||t==="standard"?A.default.createElement(G,{...e}):t==="edge"?A.default.createElement(X,{...e}):null}var F=T(require("react"));var z=require("@uniformdev/context"),p=T(require("react"));function K(e){let{name:t,variations:o,component:n}=e,r={name:t},a=n;return p.default.createElement(p.default.Fragment,null,p.default.createElement(l,{"data-type":z.ScriptType.TestStart,dangerouslySetInnerHTML:{__html:JSON.stringify(r)}}),o.map((i,u)=>p.default.createElement(p.Fragment,{key:i.id},p.default.createElement(l,{"data-type":z.ScriptType.ListItemSettings,dangerouslySetInnerHTML:{__html:JSON.stringify({id:i.id})}}),p.default.createElement(l,{"data-type":z.ScriptType.ListItem},p.default.createElement(a,{key:u,...i})))),p.default.createElement(l,{"data-type":z.ScriptType.TestEnd}))}var Y=T(require("react"));var Z=({name:e,variations:t,component:o})=>{let{context:n}=s(),{result:r}=n.test({name:e,variations:t});return r?Y.default.createElement(o,{...r}):null};var ce=e=>{var o;let{outputType:t}=(o=s({throwOnMissingProvider:!1}))!=null?o:{};if(!t)throw new Error("Using the <Test /> component requires the <UniformContext> provider to be present.");return!y||t==="standard"?F.default.createElement(Z,{...e}):t==="edge"?F.default.createElement(K,{...e}):null};var f=require("react");var $=require("react");var I=e=>{let{personalized:t}=(0,$.useContext)(_);return typeof t!="undefined"?t:typeof(e==null?void 0:e.personalized)!="undefined"?e.personalized:!1};var de=({behavior:e,children:t,tagName:o="div",threshold:n=.5,disableVisibilityTrigger:r=typeof window=="undefined"||!("IntersectionObserver"in window),...a})=>{let i=typeof document=="undefined"?"__uniform_ssr_url":document.location.href,{context:u}=s(),C=I(),[P,h]=(0,f.useState)(),[x,S]=(0,f.useState)(!1),M=(0,f.useRef)(null),c=(0,f.useRef)();return(0,f.useEffect)(()=>{P!==i&&(S(!1),h(i))},[i,P]),(0,f.useEffect)(()=>{var b;let D=!e||Array.isArray(e)&&!e.length;if(C||D||!M.current)return;let oe=Array.isArray(e)?e:[e],q=()=>{var d;x||(u.update({enrichments:oe}),S(!0),(d=c.current)==null||d.call(c))};if(r)q();else{(b=c.current)==null||b.call(c);let d=new IntersectionObserver(([O])=>{O.isIntersecting&&q()},{threshold:n});d.observe(M.current),c.current=()=>{var O;return(O=d.disconnect)==null?void 0:O.call(d)}}return()=>{var d;(d=c.current)==null||d.call(c)}},[u,e,r,n,C,P,i,x]),(0,f.createElement)(o,{...a,ref:M},t)};var R=T(require("react")),E=require("react");var le=({behavior:e,children:t})=>{let o=typeof document=="undefined"?"__uniform_ssr_url":document.location.href,{context:n}=s(),r=I(),[a,i]=(0,E.useState)(),[u,C]=(0,E.useState)(!1);return(0,E.useEffect)(()=>{a!==o&&(C(!1),i(o))},[o,a]),(0,E.useEffect)(()=>{let P=!e||Array.isArray(e)&&!e.length;if(r||P)return;(()=>{if(u)return;let S=Array.isArray(e)?e:[e];n.update({enrichments:S}),C(!0)})()},[n,e,r,u]),R.default.createElement(R.default.Fragment,null,t)};var ee=require("@uniformdev/context"),te=T(require("cookie")),V=T(require("react"));var xe=({context:e,children:t,outputType:o="standard",trackRouteOnRender:n=!0})=>((0,V.useEffect)(()=>{y||!n||e.update({url:new URL(window.location.href),cookies:te.default.parse(document.cookie)})}),V.default.createElement(L.Provider,{value:{context:e,outputType:o}},t,y?V.default.createElement(Te,null):null));function Te(){let{context:e}=s(),t=e.getServerToClientTransitionState();return V.default.createElement("script",{id:ee.SERVER_STATE_ID,type:"application/json",dangerouslySetInnerHTML:{__html:JSON.stringify(t)}})}0&&(module.exports={Personalize,Test,Track,TrackFragment,UniformContext,useQuirks,useScores,useUniformContext});
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  Personalize: () => Personalize,
+  Test: () => Test,
+  Track: () => Track,
+  TrackFragment: () => TrackFragment,
+  UniformContext: () => UniformContext,
+  useQuirks: () => useQuirks,
+  useScores: () => useScores,
+  useUniformContext: () => useUniformContext
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/hooks/useQuirks.ts
+var import_react = require("react");
+function useQuirks() {
+  const { context } = useUniformContext();
+  const [quirks, setQuirks] = (0, import_react.useState)(context.quirks);
+  const quirkChangeListener = (updatedQuirks) => {
+    setQuirks(updatedQuirks);
+  };
+  (0, import_react.useEffect)(() => {
+    context.events.on("quirksUpdated", quirkChangeListener);
+    return () => {
+      context.events.off("quirksUpdated", quirkChangeListener);
+    };
+  }, [context]);
+  return quirks;
+}
+
+// src/hooks/useScores.ts
+var import_lite = require("dequal/lite");
+var import_react2 = require("react");
+function useScores() {
+  const { context } = useUniformContext();
+  const [scores, setScores] = (0, import_react2.useState)(context.scores);
+  (0, import_react2.useEffect)(() => {
+    const scoringChangeListener = (updatedScores) => {
+      setScores(updatedScores);
+    };
+    const currentScores = context.scores;
+    if (!(0, import_lite.dequal)(scores, currentScores)) {
+      setScores(currentScores);
+    }
+    context.events.on("scoresUpdated", scoringChangeListener);
+    return () => {
+      context.events.off("scoresUpdated", scoringChangeListener);
+    };
+  }, [context]);
+  return scores;
+}
+
+// src/hooks/useUniformContext.ts
+var import_react4 = require("react");
+
+// src/contexts.tsx
+var import_react3 = require("react");
+var UniformContextContext = (0, import_react3.createContext)(void 0);
+var PersonalizationContext = (0, import_react3.createContext)({});
+
+// src/hooks/useUniformContext.ts
+function useUniformContext(options = {}) {
+  const { throwOnMissingProvider = true } = options;
+  const value = (0, import_react4.useContext)(UniformContextContext);
+  if (throwOnMissingProvider) {
+    if (value === void 0) {
+      throw new Error("useUniformContext must be used within a <UniformContext> provider");
+    }
+    return value;
+  }
+  return value;
+}
+
+// src/components/Personalize.tsx
+var import_react8 = __toESM(require("react"));
+
+// src/constants.ts
+var isServer = typeof window === "undefined";
+
+// src/components/PersonalizeEdge.tsx
+var import_context2 = require("@uniformdev/context");
+var import_react6 = __toESM(require("react"));
+
+// src/components/EdgeTag.tsx
+var import_context = require("@uniformdev/context");
+var import_react5 = require("react");
+var EdgeTag = (props) => {
+  return (0, import_react5.createElement)(import_context.EdgeNodeTagName, props);
+};
+
+// src/components/PersonalizeEdge.tsx
+function PersonalizeEdge(props) {
+  const { variations, count, component } = props;
+  const options = {
+    name: props.name,
+    count: count != null ? count : 1
+  };
+  const Component = component;
+  return /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, /* @__PURE__ */ import_react6.default.createElement(
+    EdgeTag,
+    {
+      "data-type": import_context2.ScriptType.ListStart,
+      dangerouslySetInnerHTML: { __html: JSON.stringify(options) }
+    }
+  ), variations.map((variant) => /* @__PURE__ */ import_react6.default.createElement(import_react6.Fragment, { key: variant.id }, /* @__PURE__ */ import_react6.default.createElement(
+    EdgeTag,
+    {
+      "data-type": import_context2.ScriptType.ListItemSettings,
+      dangerouslySetInnerHTML: {
+        __html: JSON.stringify({
+          id: variant.id,
+          pz: variant.pz || null
+        })
+      }
+    }
+  ), /* @__PURE__ */ import_react6.default.createElement(EdgeTag, { "data-type": import_context2.ScriptType.ListItem }, /* @__PURE__ */ import_react6.default.createElement(
+    Component,
+    {
+      key: variant.id,
+      personalizationResult: { variation: variant, personalizationOccurred: false },
+      ...variant
+    }
+  )))), /* @__PURE__ */ import_react6.default.createElement(EdgeTag, { "data-type": import_context2.ScriptType.ListEnd }));
+}
+
+// src/components/PersonalizeStandard.tsx
+var import_react7 = __toESM(require("react"));
+function PersonalizeStandard({
+  variations,
+  component,
+  wrapperComponent,
+  name,
+  count = 1
+}) {
+  const { context } = useUniformContext();
+  const scores = useScores();
+  const { variations: personalizedVariations, personalized: personalizationOccurred } = (0, import_react7.useMemo)(
+    () => context.personalize({
+      name,
+      variations,
+      take: count
+    }),
+    [scores, context, count, name, variations]
+  );
+  const Wrapper = wrapperComponent != null ? wrapperComponent : ({ children }) => /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, null, children);
+  const Component = component;
+  return /* @__PURE__ */ import_react7.default.createElement(PersonalizationContext.Provider, { value: { personalized: true } }, personalizedVariations.length ? /* @__PURE__ */ import_react7.default.createElement(Wrapper, { personalizationOccurred }, personalizedVariations.map((variant) => /* @__PURE__ */ import_react7.default.createElement(
+    Component,
+    {
+      key: variant.id,
+      personalizationResult: { variation: variant, personalizationOccurred },
+      ...variant
+    }
+  ))) : null);
+}
+
+// src/components/Personalize.tsx
+function Personalize(props) {
+  var _a;
+  const { outputType } = (_a = useUniformContext({ throwOnMissingProvider: false })) != null ? _a : {};
+  if (!outputType) {
+    throw new Error(
+      "Using the <Personalize /> component requires the <UniformContext> provider to be present."
+    );
+  }
+  if (!isServer || outputType === "standard") {
+    return /* @__PURE__ */ import_react8.default.createElement(PersonalizeStandard, { ...props });
+  } else if (outputType === "edge") {
+    return /* @__PURE__ */ import_react8.default.createElement(PersonalizeEdge, { ...props });
+  }
+  return null;
+}
+
+// src/components/Test.tsx
+var import_react11 = __toESM(require("react"));
+
+// src/components/TestEdge.tsx
+var import_context3 = require("@uniformdev/context");
+var import_react9 = __toESM(require("react"));
+function TestEdge(props) {
+  const { name, variations, component } = props;
+  const options = {
+    name
+  };
+  const Component = component;
+  return /* @__PURE__ */ import_react9.default.createElement(import_react9.default.Fragment, null, /* @__PURE__ */ import_react9.default.createElement(
+    EdgeTag,
+    {
+      "data-type": import_context3.ScriptType.TestStart,
+      dangerouslySetInnerHTML: { __html: JSON.stringify(options) }
+    }
+  ), variations.map((variation, index) => {
+    return /* @__PURE__ */ import_react9.default.createElement(import_react9.Fragment, { key: variation.id }, /* @__PURE__ */ import_react9.default.createElement(
+      EdgeTag,
+      {
+        "data-type": import_context3.ScriptType.ListItemSettings,
+        dangerouslySetInnerHTML: {
+          __html: JSON.stringify({
+            id: variation.id
+          })
+        }
+      }
+    ), /* @__PURE__ */ import_react9.default.createElement(EdgeTag, { "data-type": import_context3.ScriptType.ListItem }, /* @__PURE__ */ import_react9.default.createElement(Component, { key: index, ...variation })));
+  }), /* @__PURE__ */ import_react9.default.createElement(EdgeTag, { "data-type": import_context3.ScriptType.TestEnd }));
+}
+
+// src/components/TestStandard.tsx
+var import_react10 = __toESM(require("react"));
+var TestStandard = ({
+  name,
+  variations,
+  component
+}) => {
+  const { context } = useUniformContext();
+  const { result } = context.test({
+    name,
+    variations
+  });
+  if (!result) {
+    return null;
+  }
+  const Component = component;
+  return /* @__PURE__ */ import_react10.default.createElement(Component, { ...result });
+};
+
+// src/components/Test.tsx
+var Test = (props) => {
+  var _a;
+  const { outputType } = (_a = useUniformContext({ throwOnMissingProvider: false })) != null ? _a : {};
+  if (!outputType) {
+    throw new Error("Using the <Test /> component requires the <UniformContext> provider to be present.");
+  }
+  if (!isServer || outputType === "standard") {
+    return /* @__PURE__ */ import_react11.default.createElement(TestStandard, { ...props });
+  } else if (outputType === "edge") {
+    return /* @__PURE__ */ import_react11.default.createElement(TestEdge, { ...props });
+  }
+  return null;
+};
+
+// src/components/Track.tsx
+var import_react13 = require("react");
+
+// src/hooks/useIsPersonalized.ts
+var import_react12 = require("react");
+var useIsPersonalized = (options) => {
+  const { personalized } = (0, import_react12.useContext)(PersonalizationContext);
+  if (typeof personalized !== "undefined") {
+    return personalized;
+  }
+  if (typeof (options == null ? void 0 : options.personalized) !== "undefined") {
+    return options.personalized;
+  }
+  return false;
+};
+
+// src/components/Track.tsx
+var Track = ({
+  behavior,
+  children,
+  tagName = "div",
+  threshold = 0.5,
+  disableVisibilityTrigger = typeof window === "undefined" || !("IntersectionObserver" in window),
+  ...rest
+}) => {
+  const currentUrl = typeof document === "undefined" ? "__uniform_ssr_url" : document.location.href;
+  const { context } = useUniformContext();
+  const insidePersonalizeComponent = useIsPersonalized();
+  const [lastUrl, setLastUrl] = (0, import_react13.useState)();
+  const [hasTracked, setHasTracked] = (0, import_react13.useState)(false);
+  const wrapperEl = (0, import_react13.useRef)(null);
+  const disconnect = (0, import_react13.useRef)();
+  (0, import_react13.useEffect)(() => {
+    const urlHasChanged = lastUrl !== currentUrl;
+    if (urlHasChanged) {
+      setHasTracked(false);
+      setLastUrl(currentUrl);
+    }
+  }, [currentUrl, lastUrl]);
+  (0, import_react13.useEffect)(() => {
+    var _a;
+    const hasNoBehaviorValue = !behavior || Array.isArray(behavior) && !behavior.length;
+    const cannotTrack = insidePersonalizeComponent || hasNoBehaviorValue;
+    if (cannotTrack || !wrapperEl.current)
+      return;
+    const enrichments = Array.isArray(behavior) ? behavior : [behavior];
+    const pushBehaviorEnrichment = () => {
+      var _a2;
+      if (hasTracked) {
+        return;
+      }
+      context.update({
+        enrichments
+      });
+      setHasTracked(true);
+      (_a2 = disconnect.current) == null ? void 0 : _a2.call(disconnect);
+    };
+    if (disableVisibilityTrigger) {
+      pushBehaviorEnrichment();
+    } else {
+      (_a = disconnect.current) == null ? void 0 : _a.call(disconnect);
+      const instance = new IntersectionObserver(
+        ([entry]) => {
+          if (entry.isIntersecting) {
+            pushBehaviorEnrichment();
+          }
+        },
+        {
+          threshold
+        }
+      );
+      instance.observe(wrapperEl.current);
+      disconnect.current = () => {
+        var _a2;
+        return (_a2 = instance.disconnect) == null ? void 0 : _a2.call(instance);
+      };
+    }
+    return () => {
+      var _a2;
+      (_a2 = disconnect.current) == null ? void 0 : _a2.call(disconnect);
+    };
+  }, [
+    context,
+    behavior,
+    disableVisibilityTrigger,
+    threshold,
+    insidePersonalizeComponent,
+    lastUrl,
+    currentUrl,
+    hasTracked
+  ]);
+  const element = (0, import_react13.createElement)(tagName, { ...rest, ref: wrapperEl }, children);
+  return element;
+};
+
+// src/components/TrackFragment.tsx
+var import_react14 = __toESM(require("react"));
+var import_react15 = require("react");
+var TrackFragment = ({ behavior, children }) => {
+  const currentUrl = typeof document === "undefined" ? "__uniform_ssr_url" : document.location.href;
+  const { context } = useUniformContext();
+  const insidePersonalizeComponent = useIsPersonalized();
+  const [lastUrl, setLastUrl] = (0, import_react15.useState)();
+  const [hasTracked, setHasTracked] = (0, import_react15.useState)(false);
+  (0, import_react15.useEffect)(() => {
+    const urlHasChanged = lastUrl !== currentUrl;
+    if (urlHasChanged) {
+      setHasTracked(false);
+      setLastUrl(currentUrl);
+    }
+  }, [currentUrl, lastUrl]);
+  (0, import_react15.useEffect)(() => {
+    const hasNoBehaviorValue = !behavior || Array.isArray(behavior) && !behavior.length;
+    const cannotTrack = insidePersonalizeComponent || hasNoBehaviorValue;
+    if (cannotTrack)
+      return;
+    const pushBehaviorEnrichment = () => {
+      if (hasTracked) {
+        return;
+      }
+      const enrichments = Array.isArray(behavior) ? behavior : [behavior];
+      context.update({
+        enrichments
+      });
+      setHasTracked(true);
+    };
+    pushBehaviorEnrichment();
+  }, [context, behavior, insidePersonalizeComponent, hasTracked]);
+  return /* @__PURE__ */ import_react14.default.createElement(import_react14.default.Fragment, null, children);
+};
+
+// src/components/UniformContext.tsx
+var import_context4 = require("@uniformdev/context");
+var import_cookie = __toESM(require("cookie"));
+var import_react16 = __toESM(require("react"));
+var UniformContext = ({
+  context,
+  children,
+  outputType = "standard",
+  trackRouteOnRender = true
+}) => {
+  (0, import_react16.useEffect)(() => {
+    if (isServer || !trackRouteOnRender) {
+      return;
+    }
+    context.update({
+      url: new URL(window.location.href),
+      cookies: import_cookie.default.parse(document.cookie)
+    });
+  });
+  return /* @__PURE__ */ import_react16.default.createElement(UniformContextContext.Provider, { value: { context, outputType } }, children, isServer ? /* @__PURE__ */ import_react16.default.createElement(TransferState, null) : null);
+};
+function TransferState() {
+  const { context } = useUniformContext();
+  const transferState = context.getServerToClientTransitionState();
+  return /* @__PURE__ */ import_react16.default.createElement(
+    "script",
+    {
+      id: import_context4.SERVER_STATE_ID,
+      type: "application/json",
+      dangerouslySetInnerHTML: {
+        __html: JSON.stringify(transferState)
+      }
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Personalize,
+  Test,
+  Track,
+  TrackFragment,
+  UniformContext,
+  useQuirks,
+  useScores,
+  useUniformContext
+});

package/dist/index.mjs

@@ -1 +1,403 @@
-import{useEffect as j,useState as X}from"react";function xe(){let{context:e}=s(),[o,t]=X(e.quirks),r=n=>{t(n)};return j(()=>(e.events.on("quirksUpdated",r),()=>{e.events.off("quirksUpdated",r)}),[e]),o}import{dequal as G}from"dequal/lite";import{useEffect as K,useState as Y}from"react";function _(){let{context:e}=s(),[o,t]=Y(e.scores);return K(()=>{let r=a=>{t(a)},n=e.scores;return G(o,n)||t(n),e.events.on("scoresUpdated",r),()=>{e.events.off("scoresUpdated",r)}},[e]),o}import{useContext as Z}from"react";import{createContext as I}from"react";var V=I(void 0),U=I({});function s(e={}){let{throwOnMissingProvider:o=!0}=e,t=Z(V);if(o){if(t===void 0)throw new Error("useUniformContext must be used within a <UniformContext> provider");return t}return t}import H from"react";var C=typeof window=="undefined";import{ScriptType as z}from"@uniformdev/context";import x,{Fragment as te}from"react";import{EdgeNodeTagName as $}from"@uniformdev/context";import{createElement as ee}from"react";var u=e=>ee($,e);function M(e){let{variations:o,count:t,component:r}=e,n={name:e.name,count:t!=null?t:1},a=r;return x.createElement(x.Fragment,null,x.createElement(u,{"data-type":z.ListStart,dangerouslySetInnerHTML:{__html:JSON.stringify(n)}}),o.map(i=>x.createElement(te,{key:i.id},x.createElement(u,{"data-type":z.ListItemSettings,dangerouslySetInnerHTML:{__html:JSON.stringify({id:i.id,pz:i.pz||null})}}),x.createElement(u,{"data-type":z.ListItem},x.createElement(a,{key:i.id,personalizationResult:{variation:i,personalizationOccurred:!1},...i})))),x.createElement(u,{"data-type":z.ListEnd}))}import P,{useMemo as oe}from"react";function N({variations:e,component:o,wrapperComponent:t,name:r,count:n=1}){let{context:a}=s(),i=_(),{variations:m,personalized:d}=oe(()=>a.personalize({name:r,variations:e,take:n}),[i,a,n,r,e]),l=t!=null?t:({children:c})=>P.createElement(P.Fragment,null,c),g=o;return P.createElement(U.Provider,{value:{personalized:!0}},m.length?P.createElement(l,{personalizationOccurred:d},m.map(c=>P.createElement(g,{key:c.id,personalizationResult:{variation:c,personalizationOccurred:d},...c}))):null)}function Ke(e){var t;let{outputType:o}=(t=s({throwOnMissingProvider:!1}))!=null?t:{};if(!o)throw new Error("Using the <Personalize /> component requires the <UniformContext> provider to be present.");return!C||o==="standard"?H.createElement(N,{...e}):o==="edge"?H.createElement(M,{...e}):null}import R from"react";import{ScriptType as h}from"@uniformdev/context";import T,{Fragment as re}from"react";function A(e){let{name:o,variations:t,component:r}=e,n={name:o},a=r;return T.createElement(T.Fragment,null,T.createElement(u,{"data-type":h.TestStart,dangerouslySetInnerHTML:{__html:JSON.stringify(n)}}),t.map((i,m)=>T.createElement(re,{key:i.id},T.createElement(u,{"data-type":h.ListItemSettings,dangerouslySetInnerHTML:{__html:JSON.stringify({id:i.id})}}),T.createElement(u,{"data-type":h.ListItem},T.createElement(a,{key:m,...i})))),T.createElement(u,{"data-type":h.TestEnd}))}import ne from"react";var F=({name:e,variations:o,component:t})=>{let{context:r}=s(),{result:n}=r.test({name:e,variations:o});return n?ne.createElement(t,{...n}):null};var xt=e=>{var t;let{outputType:o}=(t=s({throwOnMissingProvider:!1}))!=null?t:{};if(!o)throw new Error("Using the <Test /> component requires the <UniformContext> provider to be present.");return!C||o==="standard"?R.createElement(F,{...e}):o==="edge"?R.createElement(A,{...e}):null};import{createElement as se,useEffect as D,useRef as q,useState as b}from"react";import{useContext as ie}from"react";var S=e=>{let{personalized:o}=ie(U);return typeof o!="undefined"?o:typeof(e==null?void 0:e.personalized)!="undefined"?e.personalized:!1};var zt=({behavior:e,children:o,tagName:t="div",threshold:r=.5,disableVisibilityTrigger:n=typeof window=="undefined"||!("IntersectionObserver"in window),...a})=>{let i=typeof document=="undefined"?"__uniform_ssr_url":document.location.href,{context:m}=s(),d=S(),[l,g]=b(),[c,y]=b(!1),O=q(null),p=q();return D(()=>{l!==i&&(y(!1),g(i))},[i,l]),D(()=>{var L;let w=!e||Array.isArray(e)&&!e.length;if(d||w||!O.current)return;let W=Array.isArray(e)?e:[e],v=()=>{var f;c||(m.update({enrichments:W}),y(!0),(f=p.current)==null||f.call(p))};if(n)v();else{(L=p.current)==null||L.call(p);let f=new IntersectionObserver(([E])=>{E.isIntersecting&&v()},{threshold:r});f.observe(O.current),p.current=()=>{var E;return(E=f.disconnect)==null?void 0:E.call(f)}}return()=>{var f;(f=p.current)==null||f.call(p)}},[m,e,n,r,d,l,i,c]),se(t,{...a,ref:O},o)};import J from"react";import{useEffect as B,useState as Q}from"react";var Lt=({behavior:e,children:o})=>{let t=typeof document=="undefined"?"__uniform_ssr_url":document.location.href,{context:r}=s(),n=S(),[a,i]=Q(),[m,d]=Q(!1);return B(()=>{a!==t&&(d(!1),i(t))},[t,a]),B(()=>{let l=!e||Array.isArray(e)&&!e.length;if(n||l)return;(()=>{if(m)return;let y=Array.isArray(e)?e:[e];r.update({enrichments:y}),d(!0)})()},[r,e,n,m]),J.createElement(J.Fragment,null,o)};import{SERVER_STATE_ID as ae}from"@uniformdev/context";import me from"cookie";import k,{useEffect as pe}from"react";var Dt=({context:e,children:o,outputType:t="standard",trackRouteOnRender:r=!0})=>(pe(()=>{C||!r||e.update({url:new URL(window.location.href),cookies:me.parse(document.cookie)})}),k.createElement(V.Provider,{value:{context:e,outputType:t}},o,C?k.createElement(fe,null):null));function fe(){let{context:e}=s(),o=e.getServerToClientTransitionState();return k.createElement("script",{id:ae,type:"application/json",dangerouslySetInnerHTML:{__html:JSON.stringify(o)}})}export{Ke as Personalize,xt as Test,zt as Track,Lt as TrackFragment,Dt as UniformContext,xe as useQuirks,_ as useScores,s as useUniformContext};
+// src/hooks/useQuirks.ts
+import { useEffect, useState } from "react";
+function useQuirks() {
+  const { context } = useUniformContext();
+  const [quirks, setQuirks] = useState(context.quirks);
+  const quirkChangeListener = (updatedQuirks) => {
+    setQuirks(updatedQuirks);
+  };
+  useEffect(() => {
+    context.events.on("quirksUpdated", quirkChangeListener);
+    return () => {
+      context.events.off("quirksUpdated", quirkChangeListener);
+    };
+  }, [context]);
+  return quirks;
+}
+
+// src/hooks/useScores.ts
+import { dequal } from "dequal/lite";
+import { useEffect as useEffect2, useState as useState2 } from "react";
+function useScores() {
+  const { context } = useUniformContext();
+  const [scores, setScores] = useState2(context.scores);
+  useEffect2(() => {
+    const scoringChangeListener = (updatedScores) => {
+      setScores(updatedScores);
+    };
+    const currentScores = context.scores;
+    if (!dequal(scores, currentScores)) {
+      setScores(currentScores);
+    }
+    context.events.on("scoresUpdated", scoringChangeListener);
+    return () => {
+      context.events.off("scoresUpdated", scoringChangeListener);
+    };
+  }, [context]);
+  return scores;
+}
+
+// src/hooks/useUniformContext.ts
+import { useContext } from "react";
+
+// src/contexts.tsx
+import { createContext } from "react";
+var UniformContextContext = createContext(void 0);
+var PersonalizationContext = createContext({});
+
+// src/hooks/useUniformContext.ts
+function useUniformContext(options = {}) {
+  const { throwOnMissingProvider = true } = options;
+  const value = useContext(UniformContextContext);
+  if (throwOnMissingProvider) {
+    if (value === void 0) {
+      throw new Error("useUniformContext must be used within a <UniformContext> provider");
+    }
+    return value;
+  }
+  return value;
+}
+
+// src/components/Personalize.tsx
+import React3 from "react";
+
+// src/constants.ts
+var isServer = typeof window === "undefined";
+
+// src/components/PersonalizeEdge.tsx
+import { ScriptType } from "@uniformdev/context";
+import React, { Fragment } from "react";
+
+// src/components/EdgeTag.tsx
+import { EdgeNodeTagName } from "@uniformdev/context";
+import { createElement } from "react";
+var EdgeTag = (props) => {
+  return createElement(EdgeNodeTagName, props);
+};
+
+// src/components/PersonalizeEdge.tsx
+function PersonalizeEdge(props) {
+  const { variations, count, component } = props;
+  const options = {
+    name: props.name,
+    count: count != null ? count : 1
+  };
+  const Component = component;
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+    EdgeTag,
+    {
+      "data-type": ScriptType.ListStart,
+      dangerouslySetInnerHTML: { __html: JSON.stringify(options) }
+    }
+  ), variations.map((variant) => /* @__PURE__ */ React.createElement(Fragment, { key: variant.id }, /* @__PURE__ */ React.createElement(
+    EdgeTag,
+    {
+      "data-type": ScriptType.ListItemSettings,
+      dangerouslySetInnerHTML: {
+        __html: JSON.stringify({
+          id: variant.id,
+          pz: variant.pz || null
+        })
+      }
+    }
+  ), /* @__PURE__ */ React.createElement(EdgeTag, { "data-type": ScriptType.ListItem }, /* @__PURE__ */ React.createElement(
+    Component,
+    {
+      key: variant.id,
+      personalizationResult: { variation: variant, personalizationOccurred: false },
+      ...variant
+    }
+  )))), /* @__PURE__ */ React.createElement(EdgeTag, { "data-type": ScriptType.ListEnd }));
+}
+
+// src/components/PersonalizeStandard.tsx
+import React2, { useMemo } from "react";
+function PersonalizeStandard({
+  variations,
+  component,
+  wrapperComponent,
+  name,
+  count = 1
+}) {
+  const { context } = useUniformContext();
+  const scores = useScores();
+  const { variations: personalizedVariations, personalized: personalizationOccurred } = useMemo(
+    () => context.personalize({
+      name,
+      variations,
+      take: count
+    }),
+    [scores, context, count, name, variations]
+  );
+  const Wrapper = wrapperComponent != null ? wrapperComponent : ({ children }) => /* @__PURE__ */ React2.createElement(React2.Fragment, null, children);
+  const Component = component;
+  return /* @__PURE__ */ React2.createElement(PersonalizationContext.Provider, { value: { personalized: true } }, personalizedVariations.length ? /* @__PURE__ */ React2.createElement(Wrapper, { personalizationOccurred }, personalizedVariations.map((variant) => /* @__PURE__ */ React2.createElement(
+    Component,
+    {
+      key: variant.id,
+      personalizationResult: { variation: variant, personalizationOccurred },
+      ...variant
+    }
+  ))) : null);
+}
+
+// src/components/Personalize.tsx
+function Personalize(props) {
+  var _a;
+  const { outputType } = (_a = useUniformContext({ throwOnMissingProvider: false })) != null ? _a : {};
+  if (!outputType) {
+    throw new Error(
+      "Using the <Personalize /> component requires the <UniformContext> provider to be present."
+    );
+  }
+  if (!isServer || outputType === "standard") {
+    return /* @__PURE__ */ React3.createElement(PersonalizeStandard, { ...props });
+  } else if (outputType === "edge") {
+    return /* @__PURE__ */ React3.createElement(PersonalizeEdge, { ...props });
+  }
+  return null;
+}
+
+// src/components/Test.tsx
+import React6 from "react";
+
+// src/components/TestEdge.tsx
+import { ScriptType as ScriptType2 } from "@uniformdev/context";
+import React4, { Fragment as Fragment2 } from "react";
+function TestEdge(props) {
+  const { name, variations, component } = props;
+  const options = {
+    name
+  };
+  const Component = component;
+  return /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(
+    EdgeTag,
+    {
+      "data-type": ScriptType2.TestStart,
+      dangerouslySetInnerHTML: { __html: JSON.stringify(options) }
+    }
+  ), variations.map((variation, index) => {
+    return /* @__PURE__ */ React4.createElement(Fragment2, { key: variation.id }, /* @__PURE__ */ React4.createElement(
+      EdgeTag,
+      {
+        "data-type": ScriptType2.ListItemSettings,
+        dangerouslySetInnerHTML: {
+          __html: JSON.stringify({
+            id: variation.id
+          })
+        }
+      }
+    ), /* @__PURE__ */ React4.createElement(EdgeTag, { "data-type": ScriptType2.ListItem }, /* @__PURE__ */ React4.createElement(Component, { key: index, ...variation })));
+  }), /* @__PURE__ */ React4.createElement(EdgeTag, { "data-type": ScriptType2.TestEnd }));
+}
+
+// src/components/TestStandard.tsx
+import React5 from "react";
+var TestStandard = ({
+  name,
+  variations,
+  component
+}) => {
+  const { context } = useUniformContext();
+  const { result } = context.test({
+    name,
+    variations
+  });
+  if (!result) {
+    return null;
+  }
+  const Component = component;
+  return /* @__PURE__ */ React5.createElement(Component, { ...result });
+};
+
+// src/components/Test.tsx
+var Test = (props) => {
+  var _a;
+  const { outputType } = (_a = useUniformContext({ throwOnMissingProvider: false })) != null ? _a : {};
+  if (!outputType) {
+    throw new Error("Using the <Test /> component requires the <UniformContext> provider to be present.");
+  }
+  if (!isServer || outputType === "standard") {
+    return /* @__PURE__ */ React6.createElement(TestStandard, { ...props });
+  } else if (outputType === "edge") {
+    return /* @__PURE__ */ React6.createElement(TestEdge, { ...props });
+  }
+  return null;
+};
+
+// src/components/Track.tsx
+import { createElement as createElement2, useEffect as useEffect3, useRef, useState as useState3 } from "react";
+
+// src/hooks/useIsPersonalized.ts
+import { useContext as useContext2 } from "react";
+var useIsPersonalized = (options) => {
+  const { personalized } = useContext2(PersonalizationContext);
+  if (typeof personalized !== "undefined") {
+    return personalized;
+  }
+  if (typeof (options == null ? void 0 : options.personalized) !== "undefined") {
+    return options.personalized;
+  }
+  return false;
+};
+
+// src/components/Track.tsx
+var Track = ({
+  behavior,
+  children,
+  tagName = "div",
+  threshold = 0.5,
+  disableVisibilityTrigger = typeof window === "undefined" || !("IntersectionObserver" in window),
+  ...rest
+}) => {
+  const currentUrl = typeof document === "undefined" ? "__uniform_ssr_url" : document.location.href;
+  const { context } = useUniformContext();
+  const insidePersonalizeComponent = useIsPersonalized();
+  const [lastUrl, setLastUrl] = useState3();
+  const [hasTracked, setHasTracked] = useState3(false);
+  const wrapperEl = useRef(null);
+  const disconnect = useRef();
+  useEffect3(() => {
+    const urlHasChanged = lastUrl !== currentUrl;
+    if (urlHasChanged) {
+      setHasTracked(false);
+      setLastUrl(currentUrl);
+    }
+  }, [currentUrl, lastUrl]);
+  useEffect3(() => {
+    var _a;
+    const hasNoBehaviorValue = !behavior || Array.isArray(behavior) && !behavior.length;
+    const cannotTrack = insidePersonalizeComponent || hasNoBehaviorValue;
+    if (cannotTrack || !wrapperEl.current)
+      return;
+    const enrichments = Array.isArray(behavior) ? behavior : [behavior];
+    const pushBehaviorEnrichment = () => {
+      var _a2;
+      if (hasTracked) {
+        return;
+      }
+      context.update({
+        enrichments
+      });
+      setHasTracked(true);
+      (_a2 = disconnect.current) == null ? void 0 : _a2.call(disconnect);
+    };
+    if (disableVisibilityTrigger) {
+      pushBehaviorEnrichment();
+    } else {
+      (_a = disconnect.current) == null ? void 0 : _a.call(disconnect);
+      const instance = new IntersectionObserver(
+        ([entry]) => {
+          if (entry.isIntersecting) {
+            pushBehaviorEnrichment();
+          }
+        },
+        {
+          threshold
+        }
+      );
+      instance.observe(wrapperEl.current);
+      disconnect.current = () => {
+        var _a2;
+        return (_a2 = instance.disconnect) == null ? void 0 : _a2.call(instance);
+      };
+    }
+    return () => {
+      var _a2;
+      (_a2 = disconnect.current) == null ? void 0 : _a2.call(disconnect);
+    };
+  }, [
+    context,
+    behavior,
+    disableVisibilityTrigger,
+    threshold,
+    insidePersonalizeComponent,
+    lastUrl,
+    currentUrl,
+    hasTracked
+  ]);
+  const element = createElement2(tagName, { ...rest, ref: wrapperEl }, children);
+  return element;
+};
+
+// src/components/TrackFragment.tsx
+import React7 from "react";
+import { useEffect as useEffect4, useState as useState4 } from "react";
+var TrackFragment = ({ behavior, children }) => {
+  const currentUrl = typeof document === "undefined" ? "__uniform_ssr_url" : document.location.href;
+  const { context } = useUniformContext();
+  const insidePersonalizeComponent = useIsPersonalized();
+  const [lastUrl, setLastUrl] = useState4();
+  const [hasTracked, setHasTracked] = useState4(false);
+  useEffect4(() => {
+    const urlHasChanged = lastUrl !== currentUrl;
+    if (urlHasChanged) {
+      setHasTracked(false);
+      setLastUrl(currentUrl);
+    }
+  }, [currentUrl, lastUrl]);
+  useEffect4(() => {
+    const hasNoBehaviorValue = !behavior || Array.isArray(behavior) && !behavior.length;
+    const cannotTrack = insidePersonalizeComponent || hasNoBehaviorValue;
+    if (cannotTrack)
+      return;
+    const pushBehaviorEnrichment = () => {
+      if (hasTracked) {
+        return;
+      }
+      const enrichments = Array.isArray(behavior) ? behavior : [behavior];
+      context.update({
+        enrichments
+      });
+      setHasTracked(true);
+    };
+    pushBehaviorEnrichment();
+  }, [context, behavior, insidePersonalizeComponent, hasTracked]);
+  return /* @__PURE__ */ React7.createElement(React7.Fragment, null, children);
+};
+
+// src/components/UniformContext.tsx
+import { SERVER_STATE_ID } from "@uniformdev/context";
+import cookie from "cookie";
+import React8, { useEffect as useEffect5 } from "react";
+var UniformContext = ({
+  context,
+  children,
+  outputType = "standard",
+  trackRouteOnRender = true
+}) => {
+  useEffect5(() => {
+    if (isServer || !trackRouteOnRender) {
+      return;
+    }
+    context.update({
+      url: new URL(window.location.href),
+      cookies: cookie.parse(document.cookie)
+    });
+  });
+  return /* @__PURE__ */ React8.createElement(UniformContextContext.Provider, { value: { context, outputType } }, children, isServer ? /* @__PURE__ */ React8.createElement(TransferState, null) : null);
+};
+function TransferState() {
+  const { context } = useUniformContext();
+  const transferState = context.getServerToClientTransitionState();
+  return /* @__PURE__ */ React8.createElement(
+    "script",
+    {
+      id: SERVER_STATE_ID,
+      type: "application/json",
+      dangerouslySetInnerHTML: {
+        __html: JSON.stringify(transferState)
+      }
+    }
+  );
+}
+export {
+  Personalize,
+  Test,
+  Track,
+  TrackFragment,
+  UniformContext,
+  useQuirks,
+  useScores,
+  useUniformContext
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/context-react",
-  "version": "17.7.0",
+  "version": "17.7.1-alpha.167+a358adea9",
   "description": "Uniform Context React integration package",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "./dist/index.js",
@@ -15,7 +15,7 @@
   "types": "./dist/index.d.ts",
   "sideEffects": false,
   "scripts": {
-    "build": "tsup --minify",
+    "build": "tsup",
     "dev": "tsup --watch",
     "clean": "rimraf dist",
     "test": "jest --maxWorkers=1",
@@ -29,7 +29,7 @@
     "react-dom": "18.2.0"
   },
   "dependencies": {
-    "@uniformdev/context": "^17.7.0",
+    "@uniformdev/context": "^17.7.1-alpha.167+a358adea9",
     "cookie": "0.5.0",
     "dequal": "2.0.3"
   },
@@ -43,5 +43,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "545eed0c88e608c46fc33048f50ccc8a08bd8cbb"
+  "gitHead": "a358adea91b24a877e577be784d56b794c4cfab8"
 }