@uniformdev/context-ui 17.4.1-alpha.37 → 17.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.esm.js CHANGED
@@ -9,7 +9,7 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
9
9
  &:focus {
10
10
  text-decoration-line: underline;
11
11
  }
12
- `;import{jsx as _e,jsxs as Fe}from"@emotion/react/jsx-runtime";var ce=({linkTo:e,name:t,linkText:o=`Edit ${t} Component`})=>Fe("a",{css:ue,title:`Edit ${t} component definition`,rel:"noopener noreferrer",target:"_blank",href:e,children:[o,_e(We,{icon:qe,iconColor:"currentColor",size:"1.5rem"})]});import{useMemo as fe,useState as K}from"react";import{useEffect as je,useState as Ke}from"react";import{computeDimensionDisplayName as Ye,ApiClientError as Xe,CachedDimensionClient as Je}from"@uniformdev/context/api";function de(e,t,o){return e.reduce((a,r)=>{let n=t(r);if(typeof n=="undefined"||n===null)throw new Error("Objectify key selector returned undefined or null.");return a[t(r)]=o?o(r):r,a},{})}function S({apiHost:e,apiKey:t,projectId:o}){let[a,r]=Ke({loading:!1,notConfigured:!1,error:null,result:null});return je(()=>{if(!o||!t||!e){r({notConfigured:!0,loading:!1,error:null,result:null});return}(async()=>{r({notConfigured:!1,loading:!0,error:null,result:null});try{let i=(await new Je({projectId:o,apiKey:t,apiHost:e}).get()).dimensions.map(d=>({...d,displayName:Ye(d)})),l={dimensions:i,dimIndex:de(i,d=>d.dim,d=>d)};r({notConfigured:!1,loading:!1,error:null,result:l})}catch(s){let i;s instanceof Xe?i=s.message:i=s.toString(),r({notConfigured:!1,loading:!1,error:i,result:null});return}})()},[e,t,o]),{result:a.result,error:a.error,loading:a.loading,notConfigured:a.notConfigured}}import{getEnrichmentVectorKey as Y}from"@uniformdev/context";import{Input as Ce,Button as Qe,InputSelect as Ze,Callout as X,Icon as J,LoadingIndicator as et,AddListButton as tt}from"@uniformdev/design-system";import{CgMathPlus as nt,CgMathMinus as ot,CgCloseO as rt}from"react-icons/cg";import ge from"immer";import{css as Q}from"@emotion/react";import{Fragment as ve,jsx as u,jsxs as M}from"@emotion/react/jsx-runtime";var it=Q`
12
+ `;import{jsx as _e,jsxs as Fe}from"@emotion/react/jsx-runtime";var ce=({linkTo:e,name:t,linkText:o=`Edit ${t} Component`})=>Fe("a",{css:ue,title:`Edit ${t} component definition`,rel:"noopener noreferrer",target:"_blank",href:e,children:[o,_e(We,{icon:qe,iconColor:"currentColor",size:"1.5rem"})]});import{useMemo as fe,useState as K}from"react";import{useEffect as je,useState as Ke}from"react";import{computeDimensionDisplayName as Ye,ApiClientError as Xe,CachedDimensionClient as Je}from"@uniformdev/context/api";function de(e,t,o){return e.reduce((a,r)=>{let n=t(r);if(typeof n=="undefined"||n===null)throw new Error("Objectify key selector returned undefined or null.");return a[t(r)]=o?o(r):r,a},{})}function V({apiHost:e,apiKey:t,projectId:o}){let[a,r]=Ke({loading:!1,notConfigured:!1,error:null,result:null});return je(()=>{if(!o||!t||!e){r({notConfigured:!0,loading:!1,error:null,result:null});return}(async()=>{r({notConfigured:!1,loading:!0,error:null,result:null});try{let i=(await new Je({projectId:o,apiKey:t,apiHost:e}).get()).dimensions.map(d=>({...d,displayName:Ye(d)})),l={dimensions:i,dimIndex:de(i,d=>d.dim,d=>d)};r({notConfigured:!1,loading:!1,error:null,result:l})}catch(s){let i;s instanceof Xe?i=s.message:i=s.toString(),r({notConfigured:!1,loading:!1,error:i,result:null});return}})()},[e,t,o]),{result:a.result,error:a.error,loading:a.loading,notConfigured:a.notConfigured}}import{getEnrichmentVectorKey as Y}from"@uniformdev/context";import{Input as Ce,Button as Qe,InputSelect as Ze,Callout as X,Icon as J,LoadingIndicator as et,AddListButton as tt}from"@uniformdev/design-system";import{CgMathPlus as nt,CgMathMinus as ot,CgCloseO as rt}from"react-icons/cg";import ge from"immer";import{css as Q}from"@emotion/react";import{Fragment as ve,jsx as u,jsxs as M}from"@emotion/react/jsx-runtime";var it=Q`
13
13
  flex: 2;
14
14
  display: flex;
15
15
  width: 50%;
@@ -20,7 +20,7 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
20
20
  &:focus {
21
21
  text-decoration-line: underline;
22
22
  }
23
- `,xn=({value:e,setValue:t,contextConfig:o,displayTitle:a=!0})=>{let{loading:r,result:n,error:s}=S(o),i=fe(()=>{if(n)return n.dimensions.filter(b=>b.category==="ENR")},[n]),l=fe(()=>{if(!e)return i;if(i)return i.filter(b=>!e.some(I=>Y(I.cat,I.key)===b.dim))},[i,e]),[d,C]=K(""),[p,m]=K(50),[f,w]=K(!1),g=i==null?void 0:i.find(b=>b.dim===d),y=()=>{let[b,I]=d.split("_");R([...e!=null?e:[],{cat:b,key:I,str:p}]),C(""),m(50),w(!1)},R=b=>{let I=[];n?I=b.filter(O=>{let T=n.dimIndex[Y(O.cat,O.key)];return Boolean(T)}):I=b;let k=I.length===0?null:I;t(k)};return s?u(X,{type:"danger",children:s}):r||n===null?u(et,{}):M("fieldset",{className:"enrichment-tag",children:[a?u("div",{css:{display:"flex",justifyContent:"space-between",marginBottom:"var(--spacing-base)"},children:u("legend",{css:{fontSize:"var(--fs-md)",fontWeight:"var(--fw-bold)"},children:"Enrichment Tags"})}):null,i!=null&&i.length?!f&&!e?u(X,{title:"No enrichment tags assigned.",type:"info",css:{marginBlock:"var(--spacing-base)"},children:M("p",{children:["Click"," ",u("a",{onClick:()=>w(!0),target:"_blank",rel:"noopener noreferrer",css:{textDecorationLine:"underline"},children:"here"})," ","to assign your first enrichment tag."]})}):M(ve,{children:[n&&u(mt,{list:e!=null?e:[],setList:R,dimIndex:n.dimIndex}),f&&l&&l.length>0?M("div",{className:"add-enrichment-tag",css:{display:"flex",flexWrap:"wrap",gap:"var(--spacing-lg)",marginTop:"var(--spacing-md)",alignItems:"center"},children:[u("div",{css:{flexGrow:1},children:u(Ze,{name:"enrichment-type",label:"Enrichment Tag",showLabel:!0,value:d,options:[{label:"Select",value:""},...l.map(b=>({label:b.displayName,value:b.dim}))],onChange:b=>C(b.currentTarget.value)})}),u(lt,{score:p,setValue:m,cap:g?g.cap:100,css:{flexBasis:"9rem"}}),u(Qe,{buttonType:"tertiary",size:"xl",css:{marginBottom:"var(--spacing-xs)",height:"3.5rem",margin:0,alignSelf:"flex-end"},onClick:y,disabled:!d,children:"Add"})]}):null,M("div",{className:"enrichment-cta",style:{paddingTop:"10px",display:"flex",justifyContent:"space-between"},children:[!f&&l&&l.length>0&&e?u(tt,{className:"add-more",buttonText:"Add More",onButtonClick:()=>w(!0)}):u("a",{css:it,title:"none",href:"#"}),u(ce,{name:"Enrichments",linkText:"Manage Enrichments",linkTo:`${o.apiHost}/projects/${encodeURIComponent(o.projectId)}/personalization/enrichments`})]})]}):u(at,{contextConfig:o})]})},at=({contextConfig:e})=>u(X,{title:"No enrichments found.",type:"caution",css:{marginBlock:"var(--spacing-base)"},children:M("p",{children:["Looks like you do not have any enrichment created in your connected Uniform project. Start by creating your first enrichment"," ",u("a",{href:`${e.apiHost}/projects/${encodeURIComponent(e.projectId)}/personalization/enrichments`,target:"_blank",rel:"noopener noreferrer",css:{":hover":{textDecorationLine:"underline"}},children:"here"}),"."]})}),he=(e,t=100,o=0)=>Math.max(Math.min(e,t),o),be=Q`
23
+ `,Dn=({value:e,setValue:t,contextConfig:o,displayTitle:a=!0})=>{let{loading:r,result:n,error:s}=V(o),i=fe(()=>{if(n)return n.dimensions.filter(b=>b.category==="ENR")},[n]),l=fe(()=>{if(!e)return i;if(i)return i.filter(b=>!e.some(I=>Y(I.cat,I.key)===b.dim))},[i,e]),[d,C]=K(""),[p,m]=K(50),[f,w]=K(!1),g=i==null?void 0:i.find(b=>b.dim===d),y=()=>{let[b,I]=d.split("_");R([...e!=null?e:[],{cat:b,key:I,str:p}]),C(""),m(50),w(!1)},R=b=>{let I=[];n?I=b.filter(S=>{let k=n.dimIndex[Y(S.cat,S.key)];return Boolean(k)}):I=b;let T=I.length===0?null:I;t(T)};return s?u(X,{type:"danger",children:s}):r||n===null?u(et,{}):M("fieldset",{className:"enrichment-tag",children:[a?u("div",{css:{display:"flex",justifyContent:"space-between",marginBottom:"var(--spacing-base)"},children:u("legend",{css:{fontSize:"var(--fs-md)",fontWeight:"var(--fw-bold)"},children:"Enrichment Tags"})}):null,i!=null&&i.length?!f&&!e?u(X,{title:"No enrichment tags assigned.",type:"info",css:{marginBlock:"var(--spacing-base)"},children:M("p",{children:["Click"," ",u("a",{onClick:()=>w(!0),target:"_blank",rel:"noopener noreferrer",css:{textDecorationLine:"underline"},children:"here"})," ","to assign your first enrichment tag."]})}):M(ve,{children:[n&&u(mt,{list:e!=null?e:[],setList:R,dimIndex:n.dimIndex}),f&&l&&l.length>0?M("div",{className:"add-enrichment-tag",css:{display:"flex",flexWrap:"wrap",gap:"var(--spacing-lg)",marginTop:"var(--spacing-md)",alignItems:"center"},children:[u("div",{css:{flexGrow:1},children:u(Ze,{name:"enrichment-type",label:"Enrichment Tag",showLabel:!0,value:d,options:[{label:"Select",value:""},...l.map(b=>({label:b.displayName,value:b.dim}))],onChange:b=>C(b.currentTarget.value)})}),u(lt,{score:p,setValue:m,cap:g?g.cap:100,css:{flexBasis:"9rem"}}),u(Qe,{buttonType:"tertiary",size:"xl",css:{marginBottom:"var(--spacing-xs)",height:"3.5rem",margin:0,alignSelf:"flex-end"},onClick:y,disabled:!d,children:"Add"})]}):null,M("div",{className:"enrichment-cta",style:{paddingTop:"10px",display:"flex",justifyContent:"space-between"},children:[!f&&l&&l.length>0&&e?u(tt,{className:"add-more",buttonText:"Add More",onButtonClick:()=>w(!0)}):u("a",{css:it,title:"none",href:"#"}),u(ce,{name:"Enrichments",linkText:"Manage Enrichments",linkTo:`${o.apiHost}/projects/${encodeURIComponent(o.projectId)}/personalization/enrichments`})]})]}):u(at,{contextConfig:o})]})},at=({contextConfig:e})=>u(X,{title:"No enrichments found.",type:"caution",css:{marginBlock:"var(--spacing-base)"},children:M("p",{children:["Looks like you do not have any enrichment created in your connected Uniform project. Start by creating your first enrichment"," ",u("a",{href:`${e.apiHost}/projects/${encodeURIComponent(e.projectId)}/personalization/enrichments`,target:"_blank",rel:"noopener noreferrer",css:{":hover":{textDecorationLine:"underline"}},children:"here"}),"."]})}),he=(e,t=100,o=0)=>Math.max(Math.min(e,t),o),be=Q`
24
24
  position: absolute;
25
25
  bottom: 0.875rem;
26
26
  left: var(--spacing-sm);
@@ -36,15 +36,16 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
36
36
  ${be}
37
37
  left: auto;
38
38
  right: var(--spacing-sm);
39
- `,lt=({score:e,setValue:t,cap:o=100,...a})=>{let r=n=>{let s=n==="increment"?e+10:e-10;s<0&&(s=0),s>o&&(s=o),t(s)};return M("div",{css:{position:"relative"},...a,children:[u(Ce,{label:"Strength",id:"enrichment-score",type:"number",min:0,max:o,value:e,onChange:n=>t(he(Number(n.currentTarget.value)||0,o)),css:{textAlign:"center",boxSizing:"border-box"}}),u("button",{type:"button",title:"Reduce enrichment count",onClick:()=>r("decrement"),disabled:e===0,className:"scoreCounterButton",css:be,children:u(J,{icon:ot,iconColor:"gray",size:"1.5rem"})}),u("button",{type:"button",title:"Increase enrichment count",onClick:()=>r("increment"),className:"scoreCounterButton",css:st,children:u(J,{icon:nt,iconColor:"gray",size:"1.5rem"})})]})},mt=({list:e,setList:t,dimIndex:o})=>{let a=n=>{t(ge(e,s=>{s.splice(n,1)}))},r=(n,s)=>{var l;let i=(l=o[`${e[n].cat}_${e[n].key}`])==null?void 0:l.cap;t(ge(e,d=>{d[n].str=he(Number(s)||0,i)}))};return u(ve,{children:e.map((n,s)=>{let i=o[Y(n.cat,n.key)];if(!!i)return M("div",{css:{display:"flex",alignItems:"center",gap:"var(--spacing-base)",backgroundColor:"var(--brand-secondary-2)",boxShadow:"var(--shadow-base)",borderRadius:"var(--rounded-base)",paddingInline:"var(--spacing-base)",marginBlock:"var(--spacing-base)"},className:"selected-enrichments",children:[u("span",{css:{fontWeight:"var(--fw-bold)",color:i?void 0:"var(--brand-secondary-5)"},children:i?i.displayName:`Enrichment '${n.cat}_${n.key}' is unknown`}),u("div",{css:{marginLeft:"auto",display:"flex",alignItems:"center",border:"0 solid var(--gray-400)",borderLeftWidth:"1px",borderRightWidth:"1px",padding:"var(--spacing-sm) var(--spacing-base)",flexBasis:"9rem"},children:u(Ce,{type:"text",min:0,max:i.cap||100,title:"score",value:n.str,css:{textAlign:"center",width:"100px"},onChange:l=>r(s,l.currentTarget.value)})}),u("button",{type:"button",title:"Delete enrichment",onClick:()=>a(s),css:{border:0},children:u(J,{icon:rt,iconColor:"red",size:"1.5rem"})})]},`${n.cat}-${n.key}`)})})};import{useState as Bt}from"react";import{LoadingIndicator as Pt,Callout as $e}from"@uniformdev/design-system";import{css as Rt}from"@emotion/react";import{Callout as Ne,InputInlineSelect as Mt,Icon as Et,AddListButton as St,Paragraph as Vt}from"@uniformdev/design-system";import ze from"immer";import{CgCloseO as Ot}from"react-icons/cg";import{css as V}from"@emotion/react";var Z="6rem",ye=V`
39
+ `,lt=({score:e,setValue:t,cap:o=100,...a})=>{let r=n=>{let s=n==="increment"?e+10:e-10;s<0&&(s=0),s>o&&(s=o),t(s)};return M("div",{css:{position:"relative"},...a,children:[u(Ce,{label:"Strength",id:"enrichment-score",type:"number",min:0,max:o,value:e,onChange:n=>t(he(Number(n.currentTarget.value)||0,o)),css:{textAlign:"center",boxSizing:"border-box"}}),u("button",{type:"button",title:"Reduce enrichment count",onClick:()=>r("decrement"),disabled:e===0,className:"scoreCounterButton",css:be,children:u(J,{icon:ot,iconColor:"gray",size:"1.5rem"})}),u("button",{type:"button",title:"Increase enrichment count",onClick:()=>r("increment"),className:"scoreCounterButton",css:st,children:u(J,{icon:nt,iconColor:"gray",size:"1.5rem"})})]})},mt=({list:e,setList:t,dimIndex:o})=>{let a=n=>{t(ge(e,s=>{s.splice(n,1)}))},r=(n,s)=>{var l;let i=(l=o[`${e[n].cat}_${e[n].key}`])==null?void 0:l.cap;t(ge(e,d=>{d[n].str=he(Number(s)||0,i)}))};return u(ve,{children:e.map((n,s)=>{let i=o[Y(n.cat,n.key)];if(!!i)return M("div",{css:{display:"flex",alignItems:"center",gap:"var(--spacing-base)",backgroundColor:"var(--brand-secondary-2)",boxShadow:"var(--shadow-base)",borderRadius:"var(--rounded-base)",paddingInline:"var(--spacing-base)",marginBlock:"var(--spacing-base)"},className:"selected-enrichments",children:[u("span",{css:{fontWeight:"var(--fw-bold)",color:i?void 0:"var(--brand-secondary-5)"},children:i?i.displayName:`Enrichment '${n.cat}_${n.key}' is unknown`}),u("div",{css:{marginLeft:"auto",display:"flex",alignItems:"center",border:"0 solid var(--gray-400)",borderLeftWidth:"1px",borderRightWidth:"1px",padding:"var(--spacing-sm) var(--spacing-base)",flexBasis:"9rem"},children:u(Ce,{type:"text",min:0,max:i.cap||100,title:"score",value:n.str,css:{textAlign:"center",width:"100px"},onChange:l=>r(s,l.currentTarget.value)})}),u("button",{type:"button",title:"Delete enrichment",onClick:()=>a(s),css:{border:0},children:u(J,{icon:rt,iconColor:"red",size:"1.5rem"})})]},`${n.cat}-${n.key}`)})})};import{useState as Pt}from"react";import{LoadingIndicator as Tt,Callout as $e}from"@uniformdev/design-system";import{css as Mt}from"@emotion/react";import{Callout as Ne,InputInlineSelect as Et,Icon as Vt,AddListButton as Ot,Paragraph as St}from"@uniformdev/design-system";import ze from"immer";import{CgCloseO as Bt}from"react-icons/cg";import{css as O}from"@emotion/react";var Z="6rem",ye=O`
40
40
  position: relative;
41
- padding: var(--spacing-base);
41
+ padding: var(--spacing-md) var(--spacing-base);
42
42
  border: 1px solid var(--gray-300);
43
43
  box-shadow: var(--shadow-base);
44
44
  background-color: white;
45
45
  border-radius: var(--rounded-base);
46
46
  margin-top: ${Z};
47
47
  display: flex;
48
+
48
49
  &:before {
49
50
  content: '';
50
51
  display: block;
@@ -55,30 +56,32 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
55
56
  top: -${Z};
56
57
  left: var(--spacing-lg);
57
58
  }
59
+
58
60
  &:first-of-type {
59
61
  margin-top: var(--spacing-md);
60
62
  &:before {
61
63
  display: none;
62
64
  }
63
65
  }
64
- `,xe=V`
66
+ `,xe=O`
65
67
  display: flex;
66
- gap: var(--spacing-xs);
68
+ gap: var(--spacing-base);
67
69
  flex-grow: 1;
68
70
  flex-wrap: wrap;
69
71
  margin-right: var(--spacing-base);
70
- `,N=V`
72
+ `,N=O`
71
73
  width: 100%;
72
74
  display: flex;
73
75
  align-items: stretch;
74
- `,ee=V`
76
+ position: relative;
77
+ `,ee=O`
75
78
  flex: 2;
76
79
  height: 52px;
77
80
  min-width: 200px;
78
- `,De=V`
81
+ `,De=O`
79
82
  flex: 1;
80
83
  min-width: 80px;
81
- `,z=V`
84
+ `,z=O`
82
85
  height: 100%;
83
86
  width: 100%;
84
87
  `;import{InputComboBox as ft}from"@uniformdev/design-system";import{css as ut}from"@emotion/react";import{jsx as ct}from"@emotion/react/jsx-runtime";function L({op:e}){return ct("div",{className:"operation-bubble",css:ut`
@@ -91,6 +94,11 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
91
94
  height: 30px;
92
95
  justify-content: center;
93
96
  font-size: var(--fs-base);
94
- `,children:e})}import{jsx as te,jsxs as dt}from"@emotion/react/jsx-runtime";var Ie=e=>{var l,d;let{data:t,getStyles:o,isDisabled:a,innerRef:r,innerProps:n}=e,[s,i]=(d=(l=t.label)==null?void 0:l.split(":"))!=null?d:[];return dt("div",{css:{...o("option",e),display:"flex",alignItems:"center",gap:"var(--spacing-sm)"},ref:r,"aria-disabled":a,...n,children:[i?te(L,{op:s}):te("div",{css:{width:"20px",height:"20px"}}),te("div",{children:i!=null?i:s})]})};import{jsx as we}from"@emotion/react/jsx-runtime";var Re=e=>{let{data:t,getStyles:o}=e;return we("div",{css:{...o("singleValue",e),width:"max-content"},children:t.label.length===1?we(L,{op:t.label}):t.label})};import{jsx as gt}from"@emotion/react/jsx-runtime";var Me=[{name:"=",description:"equals",value:"="},{name:"\u2260",description:"not equal",value:"!="},{name:">",description:"is greater than",value:">"},{name:"\u2265",description:"is greater than or equal to",value:">="},{name:"<",description:"is less than",value:"<"},{name:"\u2264",description:"is less than or equal to",value:"<="},{name:"has the strongest score",value:"+"},{name:"has the weakest score",value:"-"}];function Ee({onChange:e,value:t,...o}){var a,r;return gt(ft,{...o,value:{label:(r=(a=Me.find(n=>n.value===t))==null?void 0:a.name)!=null?r:t,value:t},options:Me.map(n=>({label:n.description?`${n.name}:${n.description}`:n.name,value:n.value})),styles:{...o.styles,valueContainer:(n,s)=>{var i,l;return{...n,padding:"var(--spacing-sm)",...(l=(i=o.styles)==null?void 0:i.valueContainer)==null?void 0:l.call(i,n,s)}},menu:(n,s)=>{var i,l;return{...n,width:"max-content",...(l=(i=o.styles)==null?void 0:i.menu)==null?void 0:l.call(i,n,s)}},control:(n,s)=>{var i,l;return{...n,border:0,...(l=(i=o.styles)==null?void 0:i.control)==null?void 0:l.call(i,n,s)}},indicatorSeparator:(n,s)=>{var i,l;return{...n,display:"none",...(l=(i=o.styles)==null?void 0:i.indicatorSeparator)==null?void 0:l.call(i,n,s)}}},onChange:n=>{n&&e(n.value)},components:{SingleValue:Re,Option:Ie,...o.components}})}import{InputComboBox as yt}from"@uniformdev/design-system";import{Icon as Ct}from"@uniformdev/design-system";function ne(e){return{label:e.displayName,value:e.dim,isDisabled:!1}}function $(e){if(!e)return"unavailable";let[t]=e.split(":");switch(t.toLowerCase()){case"signal":return"data";case"intent":return"assign";case"audience":return"boy";default:return"user-list"}}function A(e){let t=[],o="";for(let a of e){let[r]=a.displayName.split(":");o!==r&&(t.push({label:r,options:[]}),o=r),t[t.length-1].options.push(ne(a))}return t}import{jsx as oe,jsxs as ht}from"@emotion/react/jsx-runtime";var U=e=>{var r;let{data:t,getStyles:o,className:a}=e;return oe("div",{css:{...o("groupHeading",e),textTransform:"none",fontSize:"var(--font-size-sm)"},className:a,children:ht("small",{css:{color:"var(--gray-500)",display:"flex",alignItems:"center",gap:"var(--spacing-xs)"},children:[oe(Ct,{icon:$((r=t.label)!=null?r:""),iconColor:"currentColor",size:16}),oe("span",{children:t.label})]})})};import{jsx as bt}from"@emotion/react/jsx-runtime";function G({message:e}){return e?bt("div",{css:{position:"absolute",background:"white",borderRadius:"3px",fontSize:"0.8rem",color:"var(--brand-primary-2)",bottom:"calc(var(--spacing-xs) * -1)"},children:e}):null}import{jsx as Se}from"@emotion/react/jsx-runtime";var H=e=>{var p,m;let{data:t,getStyles:o,cx:a,isDisabled:r,isFocused:n,isSelected:s,className:i,innerRef:l,innerProps:d}=e,[,C]=(m=(p=t.label)==null?void 0:p.split(":"))!=null?m:[];return Se("div",{css:o("option",e),className:a({option:!0,"option--is-disabled":r,"option--is-focused":n,"option--is-selected":s},i),ref:l,"aria-disabled":r,...d,children:Se("div",{css:{color:"var(--gray-700)"},children:C!=null?C:t.label})})};import{Icon as vt}from"@uniformdev/design-system";import{jsx as re,jsxs as Ve}from"@emotion/react/jsx-runtime";function Oe({displayName:e}){let[t,o]=e.split(":");return Ve("div",{css:{whiteSpace:"normal",overflow:"hidden"},children:[o?Ve("small",{css:{color:"var(--gray-500)",display:"flex",alignItems:"center",gap:"var(--spacing-xs)"},children:[t?re(vt,{icon:$(t),iconColor:"currentColor",size:16}):null,re("span",{"data-test-id":"dimension-name",children:t})]}):null,re("div",{css:{color:"var(--gray-700)"},"data-test-id":"dimension-value",children:o!=null?o:t})]})}import{jsx as Be}from"@emotion/react/jsx-runtime";var W=e=>{let{data:t,getStyles:o}=e;return Be("div",{css:o("singleValue",e),children:Be(Oe,{displayName:t.label})})};import{Fragment as xt,jsx as Pe,jsxs as Dt}from"@emotion/react/jsx-runtime";function ke({onChange:e,value:t,dimensions:o,errorMessage:a,...r}){return Dt(xt,{children:[Pe(yt,{...r,value:t?ne(t):void 0,options:A(o),styles:{...r.styles,valueContainer:(n,s)=>{var i,l;return{...n,padding:"var(--spacing-sm)",...(l=(i=r.styles)==null?void 0:i.valueContainer)==null?void 0:l.call(i,n,s)}}},onChange:n=>{n&&e(o.find(s=>s.dim===n.value))},components:{Option:H,SingleValue:W,GroupHeading:U,...r.components}}),Pe(G,{message:a})]})}import{InputComboBox as It}from"@uniformdev/design-system";import{useState as wt}from"react";import{Fragment as ie,jsx as _,jsxs as B}from"@emotion/react/jsx-runtime";function Te({onChange:e,criteriaMatch:t,dimensions:o,errorMessage:a,...r}){var d,C;let[n,s]=wt(typeof t.r!="undefined"&&q(t.r)!==null?t.r.toString(10):""),i=t.rDim,l=t.rDim?o.dimIndex[t.rDim]:void 0;return B(ie,{children:[_(It,{...r,inputValue:n,menuShouldScrollIntoView:!0,value:{label:(d=l==null?void 0:l.displayName)!=null?d:i&&!l?`${t.rDim} (unknown)`:"",value:(C=t.rDim)!=null?C:t.r?t.r.toString(10):"",isDisabled:!1},options:[{label:"Enter a numeric score to match, or choose another dimension to match its score",value:"",isDisabled:!0},...A(o.dimensions)],styles:{...r.styles,valueContainer:(p,m)=>{var f,w;return{...p,padding:"var(--spacing-sm)",...(w=(f=r.styles)==null?void 0:f.valueContainer)==null?void 0:w.call(f,p,m)}},option:(p,m)=>{var f,w;return{fontSize:m.isDisabled?"0.8rem":void 0,...(w=(f=r.styles)==null?void 0:f.option)==null?void 0:w.call(f,p,m)}}},onChange:p=>{var m;p&&(e({...t,rDim:(m=p.value)==null?void 0:m.toString(),r:void 0}),s(""))},onInputChange:(p,m)=>{let f=q(p);m.action==="input-change"||m.action==="set-value"?(s(p),(f||p==="")&&e({...t,r:p||void 0,rDim:void 0})):!f&&!q(m.prevInputValue)&&(!p&&t.r?s(t.r.toString()):s(p))},components:{...r.components,Option:H,SingleValue:W,GroupHeading:U},noOptionsMessage:({inputValue:p})=>q(p)?B(ie,{children:[B("div",{children:["Score: ",p]}),_("small",{children:"If you want to match on another dimension\u2019s score instead, clear the score value to search for a dimension."})]}):B(ie,{children:[B("div",{children:["No dimensions match your search \u201C",p,"\u201D"]}),_("small",{children:"If you want to match a literal score, enter a numeric value."})]})}),_(G,{message:a})]})}function q(e){return/^\d+$/.test(e.toString(10))}import{jsx as v,jsxs as ae}from"@emotion/react/jsx-runtime";var Le=({value:e,setValue:t,dimensions:o,onMenuOpen:a,onMenuClose:r,onAddCriteria:n,onRemoveCriteria:s,displayTitle:i=!0,components:l,errors:d={}})=>{let C=e||{crit:[]},p=g=>{t({...C,op:g==="&"?void 0:g})},m=()=>{let g={...C,crit:[...C.crit,{l:"",op:">",r:0}]};t(g),n==null||n(g)},f=(g,y)=>{t(ze(C,R=>{R.crit[y]=g}))},w=g=>{let y=ze(C,b=>{b.crit.splice(g,1)}),R=y.crit.length===0?null:y;t(R),s==null||s(R)};return ae("fieldset",{className:"personalization-criteria",children:[i?l!=null&&l.Title?v(l.Title,{}):v("legend",{css:{fontSize:"var(--fs-md)",fontWeight:"var(--fw-bold)"},children:"Personalize This"}):null,l!=null&&l.CustomVariantName?v(l.CustomVariantName,{}):null,C.crit.length?v("div",{children:C.crit.map((g,y)=>{var I,k,O,T;let R=((I=g.l)==null?void 0:I.length)>0,b=g.op!=="+"&&g.op!=="-";return ae("div",{css:ye,"data-test-id":"criteria-container",children:[ae("div",{css:Rt`
97
+ `,children:e})}import{jsx as te,jsxs as dt}from"@emotion/react/jsx-runtime";var Ie=e=>{var l,d;let{data:t,getStyles:o,isDisabled:a,innerRef:r,innerProps:n}=e,[s,i]=(d=(l=t.label)==null?void 0:l.split(":"))!=null?d:[];return dt("div",{css:{...o("option",e),display:"flex",alignItems:"center",gap:"var(--spacing-sm)"},ref:r,"aria-disabled":a,...n,children:[i?te(L,{op:s}):te("div",{css:{width:"20px",height:"20px"}}),te("div",{children:i!=null?i:s})]})};import{jsx as we}from"@emotion/react/jsx-runtime";var Re=e=>{let{data:t,getStyles:o}=e;return we("div",{css:{...o("singleValue",e),width:"max-content"},children:t.label.length===1?we(L,{op:t.label}):t.label})};import{jsx as gt}from"@emotion/react/jsx-runtime";var Me=[{name:"=",description:"equals",value:"="},{name:"\u2260",description:"not equal",value:"!="},{name:">",description:"is greater than",value:">"},{name:"\u2265",description:"is greater than or equal to",value:">="},{name:"<",description:"is less than",value:"<"},{name:"\u2264",description:"is less than or equal to",value:"<="},{name:"has the strongest score",value:"+"},{name:"has the weakest score",value:"-"}];function Ee({onChange:e,value:t,...o}){var a,r;return gt(ft,{...o,value:{label:(r=(a=Me.find(n=>n.value===t))==null?void 0:a.name)!=null?r:t,value:t},options:Me.map(n=>({label:n.description?`${n.name}:${n.description}`:n.name,value:n.value})),styles:{...o.styles,valueContainer:(n,s)=>{var i,l;return{...n,padding:"var(--spacing-sm)",...(l=(i=o.styles)==null?void 0:i.valueContainer)==null?void 0:l.call(i,n,s)}},menu:(n,s)=>{var i,l;return{...n,width:"max-content",...(l=(i=o.styles)==null?void 0:i.menu)==null?void 0:l.call(i,n,s)}},control:(n,s)=>{var i,l;return{...n,border:0,...(l=(i=o.styles)==null?void 0:i.control)==null?void 0:l.call(i,n,s)}},indicatorSeparator:(n,s)=>{var i,l;return{...n,display:"none",...(l=(i=o.styles)==null?void 0:i.indicatorSeparator)==null?void 0:l.call(i,n,s)}}},onChange:n=>{n&&e(n.value)},components:{SingleValue:Re,Option:Ie,...o.components}})}import{InputComboBox as xt}from"@uniformdev/design-system";import{Icon as Ct}from"@uniformdev/design-system";function ne(e){return{label:e.displayName,value:e.dim,isDisabled:!1}}function $(e){if(!e)return"unavailable";let[t]=e.split(":");switch(t.toLowerCase()){case"signal":return"data";case"intent":return"assign";case"audience":return"boy";default:return"user-list"}}function A(e){let t=[],o="";for(let a of e){let[r]=a.displayName.split(":");o!==r&&(t.push({label:r,options:[]}),o=r),t[t.length-1].options.push(ne(a))}return t}import{jsx as oe,jsxs as ht}from"@emotion/react/jsx-runtime";var U=e=>{var r;let{data:t,getStyles:o,className:a}=e;return oe("div",{css:{...o("groupHeading",e),textTransform:"none",fontSize:"var(--font-size-sm)"},className:a,children:ht("small",{css:{color:"var(--gray-500)",display:"flex",alignItems:"center",gap:"var(--spacing-xs)"},children:[oe(Ct,{icon:$((r=t.label)!=null?r:""),iconColor:"currentColor",size:16}),oe("span",{children:t.label})]})})};import{css as bt}from"@emotion/react";import{jsx as vt}from"@emotion/react/jsx-runtime";function G({message:e}){return e?vt("div",{css:bt`
98
+ color: var(--brand-primary-2);
99
+ font-size: var(--fs-xs);
100
+ position: absolute;
101
+ bottom: calc((var(--spacing-base) * -1) + -2px);
102
+ `,children:e}):null}import{jsx as Ve}from"@emotion/react/jsx-runtime";var H=e=>{var p,m;let{data:t,getStyles:o,cx:a,isDisabled:r,isFocused:n,isSelected:s,className:i,innerRef:l,innerProps:d}=e,[,C]=(m=(p=t.label)==null?void 0:p.split(":"))!=null?m:[];return Ve("div",{css:o("option",e),className:a({option:!0,"option--is-disabled":r,"option--is-focused":n,"option--is-selected":s},i),ref:l,"aria-disabled":r,...d,children:Ve("div",{css:{color:"var(--gray-700)"},children:C!=null?C:t.label})})};import{Icon as yt}from"@uniformdev/design-system";import{jsx as re,jsxs as Oe}from"@emotion/react/jsx-runtime";function Se({displayName:e}){let[t,o]=e.split(":");return Oe("div",{css:{whiteSpace:"normal",overflow:"hidden"},children:[o?Oe("small",{css:{color:"var(--gray-500)",display:"flex",alignItems:"center",gap:"var(--spacing-xs)"},children:[t?re(yt,{icon:$(t),iconColor:"currentColor",size:16}):null,re("span",{"data-test-id":"dimension-name",children:t})]}):null,re("div",{css:{color:"var(--gray-700)"},"data-test-id":"dimension-value",children:o!=null?o:t})]})}import{jsx as Be}from"@emotion/react/jsx-runtime";var W=e=>{let{data:t,getStyles:o}=e;return Be("div",{css:o("singleValue",e),children:Be(Se,{displayName:t.label})})};import{Fragment as Dt,jsx as Pe,jsxs as It}from"@emotion/react/jsx-runtime";function Te({onChange:e,value:t,dimensions:o,errorMessage:a,...r}){return It(Dt,{children:[Pe(xt,{...r,value:t?ne(t):void 0,options:A(o),styles:{...r.styles,valueContainer:(n,s)=>{var i,l;return{...n,padding:"var(--spacing-sm)",...(l=(i=r.styles)==null?void 0:i.valueContainer)==null?void 0:l.call(i,n,s)}}},onChange:n=>{n&&e(o.find(s=>s.dim===n.value))},components:{Option:H,SingleValue:W,GroupHeading:U,...r.components}}),Pe(G,{message:a})]})}import{InputComboBox as wt}from"@uniformdev/design-system";import{useState as Rt}from"react";import{Fragment as ie,jsx as _,jsxs as B}from"@emotion/react/jsx-runtime";function ke({onChange:e,criteriaMatch:t,dimensions:o,errorMessage:a,...r}){var d,C;let[n,s]=Rt(typeof t.r!="undefined"&&q(t.r)!==null?t.r.toString(10):""),i=t.rDim,l=t.rDim?o.dimIndex[t.rDim]:void 0;return B(ie,{children:[_(wt,{...r,inputValue:n,menuShouldScrollIntoView:!0,value:{label:(d=l==null?void 0:l.displayName)!=null?d:i&&!l?`${t.rDim} (unknown)`:"",value:(C=t.rDim)!=null?C:t.r?t.r.toString(10):"",isDisabled:!1},options:[{label:"Enter a numeric score to match, or choose another dimension to match its score",value:"",isDisabled:!0},...A(o.dimensions)],styles:{...r.styles,valueContainer:(p,m)=>{var f,w;return{...p,padding:"var(--spacing-sm)",...(w=(f=r.styles)==null?void 0:f.valueContainer)==null?void 0:w.call(f,p,m)}},option:(p,m)=>{var f,w;return{fontSize:m.isDisabled?"0.8rem":void 0,...(w=(f=r.styles)==null?void 0:f.option)==null?void 0:w.call(f,p,m)}}},onChange:p=>{var m;p&&(e({...t,rDim:(m=p.value)==null?void 0:m.toString(),r:void 0}),s(""))},onInputChange:(p,m)=>{let f=q(p);m.action==="input-change"||m.action==="set-value"?(s(p),(f||p==="")&&e({...t,r:p||void 0,rDim:void 0})):!f&&!q(m.prevInputValue)&&(!p&&t.r?s(t.r.toString()):s(p))},components:{...r.components,Option:H,SingleValue:W,GroupHeading:U},noOptionsMessage:({inputValue:p})=>q(p)?B(ie,{children:[B("div",{children:["Score: ",p]}),_("small",{children:"If you want to match on another dimension\u2019s score instead, clear the score value to search for a dimension."})]}):B(ie,{children:[B("div",{children:["No dimensions match your search \u201C",p,"\u201D"]}),_("small",{children:"If you want to match a literal score, enter a numeric value."})]})}),_(G,{message:a})]})}function q(e){return/^\d+$/.test(e.toString(10))}import{jsx as v,jsxs as ae}from"@emotion/react/jsx-runtime";var Le=({value:e,setValue:t,dimensions:o,onMenuOpen:a,onMenuClose:r,onAddCriteria:n,onRemoveCriteria:s,displayTitle:i=!0,components:l,errors:d={}})=>{let C=e||{crit:[]},p=g=>{t({...C,op:g==="&"?void 0:g})},m=()=>{let g={...C,crit:[...C.crit,{l:"",op:">",r:0}]};t(g),n==null||n(g)},f=(g,y)=>{t(ze(C,R=>{R.crit[y]=g}))},w=g=>{let y=ze(C,b=>{b.crit.splice(g,1)}),R=y.crit.length===0?null:y;t(R),s==null||s(R)};return ae("fieldset",{className:"personalization-criteria",children:[i?l!=null&&l.Title?v(l.Title,{}):v("legend",{css:{fontSize:"var(--fs-md)",fontWeight:"var(--fw-bold)"},children:"Personalize This"}):null,l!=null&&l.CustomVariantName?v(l.CustomVariantName,{}):null,C.crit.length?v("div",{children:C.crit.map((g,y)=>{var I,T,S,k;let R=((I=g.l)==null?void 0:I.length)>0,b=g.op!=="+"&&g.op!=="-";return ae("div",{css:ye,"data-test-id":"criteria-container",children:[ae("div",{css:Mt`
95
103
  ${xe}/* grid-template-columns: minmax(0, 1fr) ${b?"minmax(0, 79px) minmax(0, 1fr)":"minmax(0, 1fr)"} */
96
- `,className:"criteriaItemInner",children:[v("div",{css:[N,ee],className:"criteria-wrapper","data-test-id":"select-criteria",children:v(ke,{errorMessage:(k=d.lhs)==null?void 0:k[y],css:z,styles:{control:x=>({...x,height:"100%"})},dimensions:o.dimensions,onChange:x=>{f({...g,l:x.dim},y)},value:o.dimIndex[g.l],onMenuOpen:a,onMenuClose:r})}),v("div",{css:[N,De],className:"criteria-wrapper","data-test-id":"select-operator",children:v(Ee,{name:`op-${y}`,css:z,styles:{control:x=>({...x,height:"100%"})},value:g.op,onChange:x=>{f(x==="+"||x==="-"?{...g,op:x,r:void 0,rDim:void 0}:{...g,op:x},y)},onMenuOpen:a,onMenuClose:r})}),b?v("div",{css:[N,ee],className:"criteria-wrapper","data-test-id":"select-match-criteria",children:v(Te,{errorMessage:(O=d.rhs)==null?void 0:O[y],css:z,styles:{control:x=>({...x,height:"100%"})},criteriaMatch:g,onChange:x=>{f(x,y)},isDisabled:!R,dimensions:o,onMenuOpen:a,onMenuClose:r})}):null]}),v("button",{type:"button",onClick:()=>w(y),title:"Delete Personalization",css:{backgroundColor:"transparent",backgroundImage:"none",borderWidth:0},"data-test-id":"button-delete",children:v(Et,{icon:Ot,iconColor:"red",size:"1.5rem"})}),y>0?v("div",{className:"criteria-group-operation",css:{position:"absolute",top:"-4rem",transform:"translateX(calc(1.5rem - 50%))"},children:v(Mt,{"data-test-id":"dropdown-button-combine",disabled:y>1,value:(T=C.op)!=null?T:"&",options:[{label:"AND",value:"&"},{label:"OR",value:"|"}],onChange:x=>{p(x.value)}})}):null]},y)})}):v(Ne,{title:"Default variant",type:"info",css:{marginBlock:"var(--spacing-base)"},children:v(Vt,{children:'This personalized variant has no match criteria and will be shown to any visitor that does not match any preceding variants. Ensure that default variants come last in the variant list. Personalize this variant by clicking "Add Criteria" to get started.'})}),o.dimensions.length===0?l!=null&&l.NoDimensionsDefined?v(l.NoDimensionsDefined,{}):v(Ne,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:v("p",{children:"You do not have any dimensions configured."})}):v(St,{"data-test-id":"button-add-criteria",className:"add-more",buttonText:"Add Criteria",onButtonClick:m})]})};import*as D from"yup";import{useAsync as kt}from"react-use";function Xo(e){return Array.isArray(e)&&e.length>0&&e[0].cat!==void 0}function Jo(e){return e.crit!==void 0}function se(e){return e!=="+"&&e!=="-"}import{jsx as P,jsxs as Nt}from"@emotion/react/jsx-runtime";function Tt(e){let t={crit:[]};return e.forEach(o=>{if(!o.path)return;let a=/\[(\d+)\]\.(\w+)/g,r=[...o.path.matchAll(a)][0];if((r==null?void 0:r.length)==3){let n=Number(r[1]),s=r[2];if(t.crit.length>n)t.crit[n]={...t.crit[n],[s]:o.message};else{let i={};i[s]=o.message,t.crit.push(i)}}}),t}async function le(e,t){let o=D.object().shape({l:D.string().required("Please select a dimension").oneOf(t==null?void 0:t.dimensions.map(a=>a.dim),"Selected left-side criteria dimension does not exist"),op:D.string().required(),r:D.mixed().nullable().when(["rDim","op"],{is:(a,r)=>se(r)&&!a,then:D.string().required("Choose a score or dimension")}),rDim:D.string().oneOf(t==null?void 0:t.dimensions.map(a=>a.dim),"Selected right-side criteria dimension does not exist").when(["r","op"],{is:(a,r)=>se(r)&&!a,then:D.string().required("Choose a score or dimension")})},["rDim","r"]);try{await D.object({crit:D.array(o)}).nullable().validate(e,{abortEarly:!1})}catch(a){return Tt(a.inner)}}var lr=({contextConfig:e,value:t,setValue:o,...a})=>{var C,p;let[r,n]=Bt(void 0),{loading:s,result:i,error:l}=S(e);return kt(async()=>{if(t&&i){let m=await le(t,i);n(m)}},[t,i,le]),l?P($e,{type:"danger",children:l}):s||i===null?P(Pt,{}):P(Le,{...a,value:t,setValue:async m=>{let f=await le(m,i);n(f),o(m)},errors:{lhs:(C=r==null?void 0:r.crit)==null?void 0:C.map(m=>m==null?void 0:m.l),rhs:(p=r==null?void 0:r.crit)==null?void 0:p.map(m=>m==null?void 0:m.rDim)},dimensions:i,components:{NoDimensionsDefined:()=>P($e,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:Nt("p",{children:["You do not have any dimensions configured. Create your first"," ",P("a",{href:`${e.apiHost}/projects/${encodeURIComponent(e.projectId)}/personalization/signals`,target:"_blank",rel:"noopener noreferrer",css:{":hover":{textDecorationLine:"underline"}},children:"Dimension"})]})})}})};import{useEffect as zt,useState as Lt}from"react";import{ApiClientError as $t,CachedManifestClient as At}from"@uniformdev/context/api";function F({apiHost:e,apiKey:t,projectId:o}){let[a,r]=Lt({loading:!1,notConfigured:!1,error:null,result:null});return zt(()=>{if(!o||!t||!e){r({notConfigured:!0,loading:!1,error:null,result:null});return}(async()=>{r({notConfigured:!1,loading:!0,error:null,result:null});try{let i=await new At({projectId:o,apiKey:t,apiHost:e}).get({preview:!0});r({notConfigured:!1,loading:!1,error:null,result:i})}catch(s){let i;s instanceof $t?(s.statusCode===403&&(i=`The API key ${t} did not have permissions to fetch the manifest. Ensure Context > Read Drafts permissions are granted.`),i=s.message):i=s.toString(),r({notConfigured:!1,loading:!1,error:i,result:null});return}})()},[e,t,o]),{result:a.result,error:a.error,loading:a.loading,notConfigured:a.notConfigured}}import{LoadingIndicator as Ut}from"@uniformdev/design-system";import{Fragment as Gt,jsx as me}from"@emotion/react/jsx-runtime";function vr({children:e,versionMap:t,contextConfig:o}){let{loading:a,result:r}=F(o);if(a)return me(Ut,{});if(r){let n=t[r.project.ui_version];if(n)return me(n,{})}return me(Gt,{children:e})}import{createContext as Ht,useContext as pe}from"react";import{LoadingIndicator as Wt}from"@uniformdev/design-system";import{Fragment as Ae,jsx as E}from"@emotion/react/jsx-runtime";var j=Ht(null),Br=({loadingComponent:e,errorComponent:t,contextConfig:o,children:a})=>{let r=F(o),n=S(o);return r.error||r.notConfigured?t?E(t,{contextConfig:o,result:r}):E(Ae,{children:"ErrorComponent is not configured"}):n.error||n.notConfigured?t?E(t,{contextConfig:o,result:n}):E(Ae,{children:"ErrorComponent is not configured"}):r.loading||n.loading?e?E(e,{}):E(Wt,{}):E(j.Provider,{value:{manifest:r.result,dimensions:n.result,contextConfig:o},children:a})};function Pr(){let e=pe(j);if(!(e!=null&&e.contextConfig))throw new Error("Not within DataContext! Configuration data is not exist.");return e.contextConfig}function kr(){let e=pe(j);if(!(e!=null&&e.manifest))throw new Error("Not within DataContext! Manifest data is not exist.");return e.manifest}function Tr(){let e=pe(j);if(!(e!=null&&e.dimensions))throw new Error("Not within DataContext! Dimensions data is not exist.");return e.dimensions}import{validate as qt}from"uuid";import{UncachedManifestClient as _t}from"@uniformdev/context/api";var Ue=async e=>{if(!e)return{valid:!1,error:new Error("contextConfig was not defined.")};if(!e.apiHost)return{valid:!1,error:new Error("apiHost was not defined.")};if(!e.apiKey)return{valid:!1,error:new Error("apiKey was not defined.")};if(!qt(e.apiKey)&&!e.projectId)return{valid:!1,error:new Error("projectId is required when using a modern API key.")};let t=new _t({projectId:e.projectId,apiKey:e.apiKey,apiHost:e.apiHost});try{return{valid:!0,result:await t.get({preview:!0})}}catch(o){return{valid:!1,error:o}}};import{useEffect as Ft,useState as jt}from"react";var _r=e=>{let[t,o]=jt({validating:!1,error:void 0}),{apiKey:a,apiHost:r,projectId:n}=e||{};return Ft(()=>{if(!a||!r)return;(async()=>{o({validating:!0,error:void 0});let{error:i,result:l}=await Ue({apiHost:r,apiKey:a,projectId:n});o(i?{error:i,validating:!1}:{error:void 0,validating:!1,result:l})})()},[r,a,n]),{validating:t.validating,error:t.error,result:t.result}};export*from"@uniformdev/design-system";export{Br as ContextData,Te as CriteriaMatchMenu,Ee as CriteriaOperatorMenu,ke as DimensionMenu,Oe as DimensionValue,ce as EditLink,xn as EnrichmentTag,lr as PersonalizationCriteria,Le as PersonalizationCriteriaStatic,vr as ProjectUIVersion,it as addEnrichmentLink,Me as contextCriteriaMenuOperators,Tt as convertErrorsToObj,Xo as isEnrichmentTagData,Jo as isPersonalizationCriteriaData,se as opHasRhs,Pr as useContextConfig,F as useContextData,S as useDimensions,Tr as useDimensionsDataContext,kr as useManifest,_r as useValidateContextConfig,Ue as validateContextConfig};
104
+ `,className:"criteriaItemInner",children:[v("div",{css:[N,ee],className:"criteria-wrapper","data-test-id":"select-criteria",children:v(Te,{errorMessage:(T=d.lhs)==null?void 0:T[y],css:z,styles:{control:x=>({...x,height:"100%"})},dimensions:o.dimensions,onChange:x=>{f({...g,l:x.dim},y)},value:o.dimIndex[g.l],onMenuOpen:a,onMenuClose:r})}),v("div",{css:[N,De],className:"criteria-wrapper","data-test-id":"select-operator",children:v(Ee,{name:`op-${y}`,css:z,styles:{control:x=>({...x,height:"100%"})},value:g.op,onChange:x=>{f(x==="+"||x==="-"?{...g,op:x,r:void 0,rDim:void 0}:{...g,op:x},y)},onMenuOpen:a,onMenuClose:r})}),b?v("div",{css:[N,ee],className:"criteria-wrapper","data-test-id":"select-match-criteria",children:v(ke,{errorMessage:(S=d.rhs)==null?void 0:S[y],css:z,styles:{control:x=>({...x,height:"100%"})},criteriaMatch:g,onChange:x=>{f(x,y)},isDisabled:!R,dimensions:o,onMenuOpen:a,onMenuClose:r})}):null]}),v("button",{type:"button",onClick:()=>w(y),title:"Delete Personalization",css:{backgroundColor:"transparent",backgroundImage:"none",borderWidth:0},"data-test-id":"button-delete",children:v(Vt,{icon:Bt,iconColor:"red",size:"1.5rem"})}),y>0?v("div",{className:"criteria-group-operation",css:{position:"absolute",top:"-4rem",transform:"translateX(calc(1.5rem - 50%))"},children:v(Et,{"data-test-id":"dropdown-button-combine",disabled:y>1,value:(k=C.op)!=null?k:"&",options:[{label:"AND",value:"&"},{label:"OR",value:"|"}],onChange:x=>{p(x.value)}})}):null]},y)})}):v(Ne,{title:"Default variant",type:"info",css:{marginBlock:"var(--spacing-base)"},children:v(St,{children:'This personalized variant has no match criteria and will be shown to any visitor that does not match any preceding variants. Ensure that default variants come last in the variant list. Personalize this variant by clicking "Add Criteria" to get started.'})}),o.dimensions.length===0?l!=null&&l.NoDimensionsDefined?v(l.NoDimensionsDefined,{}):v(Ne,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:v("p",{children:"You do not have any dimensions configured."})}):v(Ot,{"data-test-id":"button-add-criteria",className:"add-more",buttonText:"Add Criteria",onButtonClick:m})]})};import*as D from"yup";import{useAsync as kt}from"react-use";function Qo(e){return Array.isArray(e)&&e.length>0&&e[0].cat!==void 0}function Zo(e){return e.crit!==void 0}function se(e){return e!=="+"&&e!=="-"}import{jsx as P,jsxs as zt}from"@emotion/react/jsx-runtime";function Nt(e){let t={crit:[]};return e.forEach(o=>{if(!o.path)return;let a=/\[(\d+)\]\.(\w+)/g,r=[...o.path.matchAll(a)][0];if((r==null?void 0:r.length)==3){let n=Number(r[1]),s=r[2];if(t.crit.length>n)t.crit[n]={...t.crit[n],[s]:o.message};else{let i={};i[s]=o.message,t.crit.push(i)}}}),t}async function le(e,t){let o=D.object().shape({l:D.string().required("Please select a dimension").oneOf(t==null?void 0:t.dimensions.map(a=>a.dim),"Select a criteria"),op:D.string().required(),r:D.mixed().nullable().when(["rDim","op"],{is:(a,r)=>se(r)&&!a,then:D.string().required("Choose a score or dimension")}),rDim:D.string().oneOf(t==null?void 0:t.dimensions.map(a=>a.dim),"Select a criteria").when(["r","op"],{is:(a,r)=>se(r)&&!a,then:D.string().required("Choose a score or dimension")})},["rDim","r"]);try{await D.object({crit:D.array(o)}).nullable().validate(e,{abortEarly:!1})}catch(a){return Nt(a.inner)}}var pr=({contextConfig:e,value:t,setValue:o,...a})=>{var C,p;let[r,n]=Pt(void 0),{loading:s,result:i,error:l}=V(e);return kt(async()=>{if(t&&i){let m=await le(t,i);n(m)}},[t,i,le]),l?P($e,{type:"danger",children:l}):s||i===null?P(Tt,{}):P(Le,{...a,value:t,setValue:async m=>{let f=await le(m,i);n(f),o(m)},errors:{lhs:(C=r==null?void 0:r.crit)==null?void 0:C.map(m=>m==null?void 0:m.l),rhs:(p=r==null?void 0:r.crit)==null?void 0:p.map(m=>m==null?void 0:m.rDim)},dimensions:i,components:{NoDimensionsDefined:()=>P($e,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:zt("p",{children:["You do not have any dimensions configured. Create your first"," ",P("a",{href:`${e.apiHost}/projects/${encodeURIComponent(e.projectId)}/personalization/signals`,target:"_blank",rel:"noopener noreferrer",css:{":hover":{textDecorationLine:"underline"}},children:"Dimension"})]})})}})};import{useEffect as Lt,useState as $t}from"react";import{ApiClientError as At,CachedManifestClient as Ut}from"@uniformdev/context/api";function F({apiHost:e,apiKey:t,projectId:o}){let[a,r]=$t({loading:!1,notConfigured:!1,error:null,result:null});return Lt(()=>{if(!o||!t||!e){r({notConfigured:!0,loading:!1,error:null,result:null});return}(async()=>{r({notConfigured:!1,loading:!0,error:null,result:null});try{let i=await new Ut({projectId:o,apiKey:t,apiHost:e}).get({preview:!0});r({notConfigured:!1,loading:!1,error:null,result:i})}catch(s){let i;s instanceof At?(s.statusCode===403&&(i=`The API key ${t} did not have permissions to fetch the manifest. Ensure Context > Read Drafts permissions are granted.`),i=s.message):i=s.toString(),r({notConfigured:!1,loading:!1,error:i,result:null});return}})()},[e,t,o]),{result:a.result,error:a.error,loading:a.loading,notConfigured:a.notConfigured}}import{LoadingIndicator as Gt}from"@uniformdev/design-system";import{Fragment as Ht,jsx as me}from"@emotion/react/jsx-runtime";function xr({children:e,versionMap:t,contextConfig:o}){let{loading:a,result:r}=F(o);if(a)return me(Gt,{});if(r){let n=t[r.project.ui_version];if(n)return me(n,{})}return me(Ht,{children:e})}import{createContext as Wt,useContext as pe}from"react";import{LoadingIndicator as qt}from"@uniformdev/design-system";import{Fragment as Ae,jsx as E}from"@emotion/react/jsx-runtime";var j=Wt(null),Tr=({loadingComponent:e,errorComponent:t,contextConfig:o,children:a})=>{let r=F(o),n=V(o);return r.error||r.notConfigured?t?E(t,{contextConfig:o,result:r}):E(Ae,{children:"ErrorComponent is not configured"}):n.error||n.notConfigured?t?E(t,{contextConfig:o,result:n}):E(Ae,{children:"ErrorComponent is not configured"}):r.loading||n.loading?e?E(e,{}):E(qt,{}):E(j.Provider,{value:{manifest:r.result,dimensions:n.result,contextConfig:o},children:a})};function kr(){let e=pe(j);if(!(e!=null&&e.contextConfig))throw new Error("Not within DataContext! Configuration data is not exist.");return e.contextConfig}function Nr(){let e=pe(j);if(!(e!=null&&e.manifest))throw new Error("Not within DataContext! Manifest data is not exist.");return e.manifest}function zr(){let e=pe(j);if(!(e!=null&&e.dimensions))throw new Error("Not within DataContext! Dimensions data is not exist.");return e.dimensions}import{validate as _t}from"uuid";import{UncachedManifestClient as Ft}from"@uniformdev/context/api";var Ue=async e=>{if(!e)return{valid:!1,error:new Error("contextConfig was not defined.")};if(!e.apiHost)return{valid:!1,error:new Error("apiHost was not defined.")};if(!e.apiKey)return{valid:!1,error:new Error("apiKey was not defined.")};if(!_t(e.apiKey)&&!e.projectId)return{valid:!1,error:new Error("projectId is required when using a modern API key.")};let t=new Ft({projectId:e.projectId,apiKey:e.apiKey,apiHost:e.apiHost});try{return{valid:!0,result:await t.get({preview:!0})}}catch(o){return{valid:!1,error:o}}};import{useEffect as jt,useState as Kt}from"react";var jr=e=>{let[t,o]=Kt({validating:!1,error:void 0}),{apiKey:a,apiHost:r,projectId:n}=e||{};return jt(()=>{if(!a||!r)return;(async()=>{o({validating:!0,error:void 0});let{error:i,result:l}=await Ue({apiHost:r,apiKey:a,projectId:n});o(i?{error:i,validating:!1}:{error:void 0,validating:!1,result:l})})()},[r,a,n]),{validating:t.validating,error:t.error,result:t.result}};export*from"@uniformdev/design-system";export{Tr as ContextData,ke as CriteriaMatchMenu,Ee as CriteriaOperatorMenu,Te as DimensionMenu,Se as DimensionValue,ce as EditLink,Dn as EnrichmentTag,pr as PersonalizationCriteria,Le as PersonalizationCriteriaStatic,xr as ProjectUIVersion,it as addEnrichmentLink,Me as contextCriteriaMenuOperators,Nt as convertErrorsToObj,Qo as isEnrichmentTagData,Zo as isPersonalizationCriteriaData,se as opHasRhs,kr as useContextConfig,F as useContextData,V as useDimensions,zr as useDimensionsDataContext,Nr as useManifest,jr as useValidateContextConfig,Ue as validateContextConfig};
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- "use strict";var ct=Object.create;var X=Object.defineProperty;var dt=Object.getOwnPropertyDescriptor;var ft=Object.getOwnPropertyNames;var gt=Object.getPrototypeOf,Ct=Object.prototype.hasOwnProperty;var ht=(e,t)=>{for(var n in t)X(e,n,{get:t[n],enumerable:!0})},Y=(e,t,n,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of ft(t))!Ct.call(e,r)&&r!==n&&X(e,r,{get:()=>t[r],enumerable:!(a=dt(t,r))||a.enumerable});return e},S=(e,t,n)=>(Y(e,t,"default"),n&&Y(n,t,"default")),J=(e,t,n)=>(n=e!=null?ct(gt(e)):{},Y(t||!e||!e.__esModule?X(n,"default",{value:e,enumerable:!0}):n,e)),bt=e=>Y(X({},"__esModule",{value:!0}),e);var M={};ht(M,{ContextData:()=>Ot,CriteriaMatchMenu:()=>Ve,CriteriaOperatorMenu:()=>Ie,DimensionMenu:()=>Se,DimensionValue:()=>Me,EditLink:()=>he,EnrichmentTag:()=>yt,PersonalizationCriteria:()=>St,PersonalizationCriteriaStatic:()=>Be,ProjectUIVersion:()=>Vt,addEnrichmentLink:()=>Ae,contextCriteriaMenuOperators:()=>De,convertErrorsToObj:()=>st,isEnrichmentTagData:()=>Mt,isPersonalizationCriteriaData:()=>Et,opHasRhs:()=>ce,useContextConfig:()=>Bt,useContextData:()=>F,useDimensions:()=>k,useDimensionsDataContext:()=>kt,useManifest:()=>Pt,useValidateContextConfig:()=>Tt,validateContextConfig:()=>ke});module.exports=bt(M);var c=require("@emotion/react"),b=J(require("react"));var ze=require("@uniformdev/design-system"),Le=require("react-icons/cg");var Te=require("@emotion/react"),Ne=Te.css`
1
+ "use strict";var dt=Object.create;var X=Object.defineProperty;var ft=Object.getOwnPropertyDescriptor;var gt=Object.getOwnPropertyNames;var Ct=Object.getPrototypeOf,ht=Object.prototype.hasOwnProperty;var bt=(e,t)=>{for(var n in t)X(e,n,{get:t[n],enumerable:!0})},Y=(e,t,n,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of gt(t))!ht.call(e,r)&&r!==n&&X(e,r,{get:()=>t[r],enumerable:!(a=ft(t,r))||a.enumerable});return e},V=(e,t,n)=>(Y(e,t,"default"),n&&Y(n,t,"default")),J=(e,t,n)=>(n=e!=null?dt(Ct(e)):{},Y(t||!e||!e.__esModule?X(n,"default",{value:e,enumerable:!0}):n,e)),vt=e=>Y(X({},"__esModule",{value:!0}),e);var M={};bt(M,{ContextData:()=>Bt,CriteriaMatchMenu:()=>Oe,CriteriaOperatorMenu:()=>Ie,DimensionMenu:()=>Ve,DimensionValue:()=>Me,EditLink:()=>he,EnrichmentTag:()=>xt,PersonalizationCriteria:()=>Ot,PersonalizationCriteriaStatic:()=>Be,ProjectUIVersion:()=>St,addEnrichmentLink:()=>Ae,contextCriteriaMenuOperators:()=>De,convertErrorsToObj:()=>lt,isEnrichmentTagData:()=>Et,isPersonalizationCriteriaData:()=>Vt,opHasRhs:()=>ce,useContextConfig:()=>Pt,useContextData:()=>F,useDimensions:()=>T,useDimensionsDataContext:()=>kt,useManifest:()=>Tt,useValidateContextConfig:()=>Nt,validateContextConfig:()=>Te});module.exports=vt(M);var c=require("@emotion/react"),b=J(require("react"));var ze=require("@uniformdev/design-system"),Le=require("react-icons/cg");var ke=require("@emotion/react"),Ne=ke.css`
2
2
  display: flex;
3
3
  align-items: center;
4
4
  font-weight: var(--fw-bold);
@@ -9,7 +9,7 @@
9
9
  &:focus {
10
10
  text-decoration-line: underline;
11
11
  }
12
- `;var Q=require("@emotion/react/jsx-runtime"),he=({linkTo:e,name:t,linkText:n=`Edit ${t} Component`})=>(0,Q.jsxs)("a",{css:Ne,title:`Edit ${t} component definition`,rel:"noopener noreferrer",target:"_blank",href:e,children:[n,(0,Q.jsx)(ze.Icon,{icon:Le.CgChevronRight,iconColor:"currentColor",size:"1.5rem"})]});var T=require("react");var Z=require("react"),$=require("@uniformdev/context/api");function $e(e,t,n){return e.reduce((a,r)=>{let o=t(r);if(typeof o=="undefined"||o===null)throw new Error("Objectify key selector returned undefined or null.");return a[t(r)]=n?n(r):r,a},{})}function k({apiHost:e,apiKey:t,projectId:n}){let[a,r]=(0,Z.useState)({loading:!1,notConfigured:!1,error:null,result:null});return(0,Z.useEffect)(()=>{if(!n||!t||!e){r({notConfigured:!0,loading:!1,error:null,result:null});return}(async()=>{r({notConfigured:!1,loading:!0,error:null,result:null});try{let i=(await new $.CachedDimensionClient({projectId:n,apiKey:t,apiHost:e}).get()).dimensions.map(d=>({...d,displayName:(0,$.computeDimensionDisplayName)(d)})),l={dimensions:i,dimIndex:$e(i,d=>d.dim,d=>d)};r({notConfigured:!1,loading:!1,error:null,result:l})}catch(s){let i;s instanceof $.ApiClientError?i=s.message:i=s.toString(),r({notConfigured:!1,loading:!1,error:i,result:null});return}})()},[e,t,n]),{result:a.result,error:a.error,loading:a.loading,notConfigured:a.notConfigured}}var ee=require("@uniformdev/context"),x=require("@uniformdev/design-system"),A=require("react-icons/cg"),be=J(require("immer")),te=require("@emotion/react"),m=require("@emotion/react/jsx-runtime"),Ae=te.css`
12
+ `;var Q=require("@emotion/react/jsx-runtime"),he=({linkTo:e,name:t,linkText:n=`Edit ${t} Component`})=>(0,Q.jsxs)("a",{css:Ne,title:`Edit ${t} component definition`,rel:"noopener noreferrer",target:"_blank",href:e,children:[n,(0,Q.jsx)(ze.Icon,{icon:Le.CgChevronRight,iconColor:"currentColor",size:"1.5rem"})]});var k=require("react");var Z=require("react"),$=require("@uniformdev/context/api");function $e(e,t,n){return e.reduce((a,r)=>{let o=t(r);if(typeof o=="undefined"||o===null)throw new Error("Objectify key selector returned undefined or null.");return a[t(r)]=n?n(r):r,a},{})}function T({apiHost:e,apiKey:t,projectId:n}){let[a,r]=(0,Z.useState)({loading:!1,notConfigured:!1,error:null,result:null});return(0,Z.useEffect)(()=>{if(!n||!t||!e){r({notConfigured:!0,loading:!1,error:null,result:null});return}(async()=>{r({notConfigured:!1,loading:!0,error:null,result:null});try{let i=(await new $.CachedDimensionClient({projectId:n,apiKey:t,apiHost:e}).get()).dimensions.map(d=>({...d,displayName:(0,$.computeDimensionDisplayName)(d)})),l={dimensions:i,dimIndex:$e(i,d=>d.dim,d=>d)};r({notConfigured:!1,loading:!1,error:null,result:l})}catch(s){let i;s instanceof $.ApiClientError?i=s.message:i=s.toString(),r({notConfigured:!1,loading:!1,error:i,result:null});return}})()},[e,t,n]),{result:a.result,error:a.error,loading:a.loading,notConfigured:a.notConfigured}}var ee=require("@uniformdev/context"),x=require("@uniformdev/design-system"),A=require("react-icons/cg"),be=J(require("immer")),te=require("@emotion/react"),m=require("@emotion/react/jsx-runtime"),Ae=te.css`
13
13
  flex: 2;
14
14
  display: flex;
15
15
  width: 50%;
@@ -20,7 +20,7 @@
20
20
  &:focus {
21
21
  text-decoration-line: underline;
22
22
  }
23
- `,yt=({value:e,setValue:t,contextConfig:n,displayTitle:a=!0})=>{let{loading:r,result:o,error:s}=k(n),i=(0,T.useMemo)(()=>{if(o)return o.dimensions.filter(v=>v.category==="ENR")},[o]),l=(0,T.useMemo)(()=>{if(!e)return i;if(i)return i.filter(v=>!e.some(R=>(0,ee.getEnrichmentVectorKey)(R.cat,R.key)===v.dim))},[i,e]),[d,h]=(0,T.useState)(""),[u,p]=(0,T.useState)(50),[g,E]=(0,T.useState)(!1),C=i==null?void 0:i.find(v=>v.dim===d),y=()=>{let[v,R]=d.split("_");B([...e!=null?e:[],{cat:v,key:R,str:u}]),h(""),p(50),E(!1)},B=v=>{let R=[];o?R=v.filter(q=>{let K=o.dimIndex[(0,ee.getEnrichmentVectorKey)(q.cat,q.key)];return Boolean(K)}):R=v;let j=R.length===0?null:R;t(j)};return s?(0,m.jsx)(x.Callout,{type:"danger",children:s}):r||o===null?(0,m.jsx)(x.LoadingIndicator,{}):(0,m.jsxs)("fieldset",{className:"enrichment-tag",children:[a?(0,m.jsx)("div",{css:{display:"flex",justifyContent:"space-between",marginBottom:"var(--spacing-base)"},children:(0,m.jsx)("legend",{css:{fontSize:"var(--fs-md)",fontWeight:"var(--fw-bold)"},children:"Enrichment Tags"})}):null,i!=null&&i.length?!g&&!e?(0,m.jsx)(x.Callout,{title:"No enrichment tags assigned.",type:"info",css:{marginBlock:"var(--spacing-base)"},children:(0,m.jsxs)("p",{children:["Click"," ",(0,m.jsx)("a",{onClick:()=>E(!0),target:"_blank",rel:"noopener noreferrer",css:{textDecorationLine:"underline"},children:"here"})," ","to assign your first enrichment tag."]})}):(0,m.jsxs)(m.Fragment,{children:[o&&(0,m.jsx)(wt,{list:e!=null?e:[],setList:B,dimIndex:o.dimIndex}),g&&l&&l.length>0?(0,m.jsxs)("div",{className:"add-enrichment-tag",css:{display:"flex",flexWrap:"wrap",gap:"var(--spacing-lg)",marginTop:"var(--spacing-md)",alignItems:"center"},children:[(0,m.jsx)("div",{css:{flexGrow:1},children:(0,m.jsx)(x.InputSelect,{name:"enrichment-type",label:"Enrichment Tag",showLabel:!0,value:d,options:[{label:"Select",value:""},...l.map(v=>({label:v.displayName,value:v.dim}))],onChange:v=>h(v.currentTarget.value)})}),(0,m.jsx)(It,{score:u,setValue:p,cap:C?C.cap:100,css:{flexBasis:"9rem"}}),(0,m.jsx)(x.Button,{buttonType:"tertiary",size:"xl",css:{marginBottom:"var(--spacing-xs)",height:"3.5rem",margin:0,alignSelf:"flex-end"},onClick:y,disabled:!d,children:"Add"})]}):null,(0,m.jsxs)("div",{className:"enrichment-cta",style:{paddingTop:"10px",display:"flex",justifyContent:"space-between"},children:[!g&&l&&l.length>0&&e?(0,m.jsx)(x.AddListButton,{className:"add-more",buttonText:"Add More",onButtonClick:()=>E(!0)}):(0,m.jsx)("a",{css:Ae,title:"none",href:"#"}),(0,m.jsx)(he,{name:"Enrichments",linkText:"Manage Enrichments",linkTo:`${n.apiHost}/projects/${encodeURIComponent(n.projectId)}/personalization/enrichments`})]})]}):(0,m.jsx)(xt,{contextConfig:n})]})},xt=({contextConfig:e})=>(0,m.jsx)(x.Callout,{title:"No enrichments found.",type:"caution",css:{marginBlock:"var(--spacing-base)"},children:(0,m.jsxs)("p",{children:["Looks like you do not have any enrichment created in your connected Uniform project. Start by creating your first enrichment"," ",(0,m.jsx)("a",{href:`${e.apiHost}/projects/${encodeURIComponent(e.projectId)}/personalization/enrichments`,target:"_blank",rel:"noopener noreferrer",css:{":hover":{textDecorationLine:"underline"}},children:"here"}),"."]})}),Ue=(e,t=100,n=0)=>Math.max(Math.min(e,t),n),Ge=te.css`
23
+ `,xt=({value:e,setValue:t,contextConfig:n,displayTitle:a=!0})=>{let{loading:r,result:o,error:s}=T(n),i=(0,k.useMemo)(()=>{if(o)return o.dimensions.filter(v=>v.category==="ENR")},[o]),l=(0,k.useMemo)(()=>{if(!e)return i;if(i)return i.filter(v=>!e.some(R=>(0,ee.getEnrichmentVectorKey)(R.cat,R.key)===v.dim))},[i,e]),[d,h]=(0,k.useState)(""),[u,p]=(0,k.useState)(50),[g,E]=(0,k.useState)(!1),C=i==null?void 0:i.find(v=>v.dim===d),y=()=>{let[v,R]=d.split("_");B([...e!=null?e:[],{cat:v,key:R,str:u}]),h(""),p(50),E(!1)},B=v=>{let R=[];o?R=v.filter(q=>{let K=o.dimIndex[(0,ee.getEnrichmentVectorKey)(q.cat,q.key)];return Boolean(K)}):R=v;let j=R.length===0?null:R;t(j)};return s?(0,m.jsx)(x.Callout,{type:"danger",children:s}):r||o===null?(0,m.jsx)(x.LoadingIndicator,{}):(0,m.jsxs)("fieldset",{className:"enrichment-tag",children:[a?(0,m.jsx)("div",{css:{display:"flex",justifyContent:"space-between",marginBottom:"var(--spacing-base)"},children:(0,m.jsx)("legend",{css:{fontSize:"var(--fs-md)",fontWeight:"var(--fw-bold)"},children:"Enrichment Tags"})}):null,i!=null&&i.length?!g&&!e?(0,m.jsx)(x.Callout,{title:"No enrichment tags assigned.",type:"info",css:{marginBlock:"var(--spacing-base)"},children:(0,m.jsxs)("p",{children:["Click"," ",(0,m.jsx)("a",{onClick:()=>E(!0),target:"_blank",rel:"noopener noreferrer",css:{textDecorationLine:"underline"},children:"here"})," ","to assign your first enrichment tag."]})}):(0,m.jsxs)(m.Fragment,{children:[o&&(0,m.jsx)(Rt,{list:e!=null?e:[],setList:B,dimIndex:o.dimIndex}),g&&l&&l.length>0?(0,m.jsxs)("div",{className:"add-enrichment-tag",css:{display:"flex",flexWrap:"wrap",gap:"var(--spacing-lg)",marginTop:"var(--spacing-md)",alignItems:"center"},children:[(0,m.jsx)("div",{css:{flexGrow:1},children:(0,m.jsx)(x.InputSelect,{name:"enrichment-type",label:"Enrichment Tag",showLabel:!0,value:d,options:[{label:"Select",value:""},...l.map(v=>({label:v.displayName,value:v.dim}))],onChange:v=>h(v.currentTarget.value)})}),(0,m.jsx)(wt,{score:u,setValue:p,cap:C?C.cap:100,css:{flexBasis:"9rem"}}),(0,m.jsx)(x.Button,{buttonType:"tertiary",size:"xl",css:{marginBottom:"var(--spacing-xs)",height:"3.5rem",margin:0,alignSelf:"flex-end"},onClick:y,disabled:!d,children:"Add"})]}):null,(0,m.jsxs)("div",{className:"enrichment-cta",style:{paddingTop:"10px",display:"flex",justifyContent:"space-between"},children:[!g&&l&&l.length>0&&e?(0,m.jsx)(x.AddListButton,{className:"add-more",buttonText:"Add More",onButtonClick:()=>E(!0)}):(0,m.jsx)("a",{css:Ae,title:"none",href:"#"}),(0,m.jsx)(he,{name:"Enrichments",linkText:"Manage Enrichments",linkTo:`${n.apiHost}/projects/${encodeURIComponent(n.projectId)}/personalization/enrichments`})]})]}):(0,m.jsx)(Dt,{contextConfig:n})]})},Dt=({contextConfig:e})=>(0,m.jsx)(x.Callout,{title:"No enrichments found.",type:"caution",css:{marginBlock:"var(--spacing-base)"},children:(0,m.jsxs)("p",{children:["Looks like you do not have any enrichment created in your connected Uniform project. Start by creating your first enrichment"," ",(0,m.jsx)("a",{href:`${e.apiHost}/projects/${encodeURIComponent(e.projectId)}/personalization/enrichments`,target:"_blank",rel:"noopener noreferrer",css:{":hover":{textDecorationLine:"underline"}},children:"here"}),"."]})}),Ue=(e,t=100,n=0)=>Math.max(Math.min(e,t),n),Ge=te.css`
24
24
  position: absolute;
25
25
  bottom: 0.875rem;
26
26
  left: var(--spacing-sm);
@@ -32,19 +32,20 @@
32
32
  background-color: var(--gray-100);
33
33
  border: 1px solid var(--gray-300);
34
34
  border-radius: var(--rounded-full);
35
- `,Dt=te.css`
35
+ `,It=te.css`
36
36
  ${Ge}
37
37
  left: auto;
38
38
  right: var(--spacing-sm);
39
- `,It=({score:e,setValue:t,cap:n=100,...a})=>{let r=o=>{let s=o==="increment"?e+10:e-10;s<0&&(s=0),s>n&&(s=n),t(s)};return(0,m.jsxs)("div",{css:{position:"relative"},...a,children:[(0,m.jsx)(x.Input,{label:"Strength",id:"enrichment-score",type:"number",min:0,max:n,value:e,onChange:o=>t(Ue(Number(o.currentTarget.value)||0,n)),css:{textAlign:"center",boxSizing:"border-box"}}),(0,m.jsx)("button",{type:"button",title:"Reduce enrichment count",onClick:()=>r("decrement"),disabled:e===0,className:"scoreCounterButton",css:Ge,children:(0,m.jsx)(x.Icon,{icon:A.CgMathMinus,iconColor:"gray",size:"1.5rem"})}),(0,m.jsx)("button",{type:"button",title:"Increase enrichment count",onClick:()=>r("increment"),className:"scoreCounterButton",css:Dt,children:(0,m.jsx)(x.Icon,{icon:A.CgMathPlus,iconColor:"gray",size:"1.5rem"})})]})},wt=({list:e,setList:t,dimIndex:n})=>{let a=o=>{t((0,be.default)(e,s=>{s.splice(o,1)}))},r=(o,s)=>{var l;let i=(l=n[`${e[o].cat}_${e[o].key}`])==null?void 0:l.cap;t((0,be.default)(e,d=>{d[o].str=Ue(Number(s)||0,i)}))};return(0,m.jsx)(m.Fragment,{children:e.map((o,s)=>{let i=n[(0,ee.getEnrichmentVectorKey)(o.cat,o.key)];if(!!i)return(0,m.jsxs)("div",{css:{display:"flex",alignItems:"center",gap:"var(--spacing-base)",backgroundColor:"var(--brand-secondary-2)",boxShadow:"var(--shadow-base)",borderRadius:"var(--rounded-base)",paddingInline:"var(--spacing-base)",marginBlock:"var(--spacing-base)"},className:"selected-enrichments",children:[(0,m.jsx)("span",{css:{fontWeight:"var(--fw-bold)",color:i?void 0:"var(--brand-secondary-5)"},children:i?i.displayName:`Enrichment '${o.cat}_${o.key}' is unknown`}),(0,m.jsx)("div",{css:{marginLeft:"auto",display:"flex",alignItems:"center",border:"0 solid var(--gray-400)",borderLeftWidth:"1px",borderRightWidth:"1px",padding:"var(--spacing-sm) var(--spacing-base)",flexBasis:"9rem"},children:(0,m.jsx)(x.Input,{type:"text",min:0,max:i.cap||100,title:"score",value:o.str,css:{textAlign:"center",width:"100px"},onChange:l=>r(s,l.currentTarget.value)})}),(0,m.jsx)("button",{type:"button",title:"Delete enrichment",onClick:()=>a(s),css:{border:0},children:(0,m.jsx)(x.Icon,{icon:A.CgCloseO,iconColor:"red",size:"1.5rem"})})]},`${o.cat}-${o.key}`)})})};var it=require("react");var _=require("@uniformdev/design-system");var ot=require("@emotion/react"),V=require("@uniformdev/design-system"),Oe=J(require("immer")),rt=require("react-icons/cg");var N=require("@emotion/react"),ve="6rem",He=N.css`
39
+ `,wt=({score:e,setValue:t,cap:n=100,...a})=>{let r=o=>{let s=o==="increment"?e+10:e-10;s<0&&(s=0),s>n&&(s=n),t(s)};return(0,m.jsxs)("div",{css:{position:"relative"},...a,children:[(0,m.jsx)(x.Input,{label:"Strength",id:"enrichment-score",type:"number",min:0,max:n,value:e,onChange:o=>t(Ue(Number(o.currentTarget.value)||0,n)),css:{textAlign:"center",boxSizing:"border-box"}}),(0,m.jsx)("button",{type:"button",title:"Reduce enrichment count",onClick:()=>r("decrement"),disabled:e===0,className:"scoreCounterButton",css:Ge,children:(0,m.jsx)(x.Icon,{icon:A.CgMathMinus,iconColor:"gray",size:"1.5rem"})}),(0,m.jsx)("button",{type:"button",title:"Increase enrichment count",onClick:()=>r("increment"),className:"scoreCounterButton",css:It,children:(0,m.jsx)(x.Icon,{icon:A.CgMathPlus,iconColor:"gray",size:"1.5rem"})})]})},Rt=({list:e,setList:t,dimIndex:n})=>{let a=o=>{t((0,be.default)(e,s=>{s.splice(o,1)}))},r=(o,s)=>{var l;let i=(l=n[`${e[o].cat}_${e[o].key}`])==null?void 0:l.cap;t((0,be.default)(e,d=>{d[o].str=Ue(Number(s)||0,i)}))};return(0,m.jsx)(m.Fragment,{children:e.map((o,s)=>{let i=n[(0,ee.getEnrichmentVectorKey)(o.cat,o.key)];if(!!i)return(0,m.jsxs)("div",{css:{display:"flex",alignItems:"center",gap:"var(--spacing-base)",backgroundColor:"var(--brand-secondary-2)",boxShadow:"var(--shadow-base)",borderRadius:"var(--rounded-base)",paddingInline:"var(--spacing-base)",marginBlock:"var(--spacing-base)"},className:"selected-enrichments",children:[(0,m.jsx)("span",{css:{fontWeight:"var(--fw-bold)",color:i?void 0:"var(--brand-secondary-5)"},children:i?i.displayName:`Enrichment '${o.cat}_${o.key}' is unknown`}),(0,m.jsx)("div",{css:{marginLeft:"auto",display:"flex",alignItems:"center",border:"0 solid var(--gray-400)",borderLeftWidth:"1px",borderRightWidth:"1px",padding:"var(--spacing-sm) var(--spacing-base)",flexBasis:"9rem"},children:(0,m.jsx)(x.Input,{type:"text",min:0,max:i.cap||100,title:"score",value:o.str,css:{textAlign:"center",width:"100px"},onChange:l=>r(s,l.currentTarget.value)})}),(0,m.jsx)("button",{type:"button",title:"Delete enrichment",onClick:()=>a(s),css:{border:0},children:(0,m.jsx)(x.Icon,{icon:A.CgCloseO,iconColor:"red",size:"1.5rem"})})]},`${o.cat}-${o.key}`)})})};var at=require("react");var _=require("@uniformdev/design-system");var rt=require("@emotion/react"),O=require("@uniformdev/design-system"),Se=J(require("immer")),it=require("react-icons/cg");var N=require("@emotion/react"),ve="6rem",He=N.css`
40
40
  position: relative;
41
- padding: var(--spacing-base);
41
+ padding: var(--spacing-md) var(--spacing-base);
42
42
  border: 1px solid var(--gray-300);
43
43
  box-shadow: var(--shadow-base);
44
44
  background-color: white;
45
45
  border-radius: var(--rounded-base);
46
46
  margin-top: ${ve};
47
47
  display: flex;
48
+
48
49
  &:before {
49
50
  content: '';
50
51
  display: block;
@@ -55,6 +56,7 @@
55
56
  top: -${ve};
56
57
  left: var(--spacing-lg);
57
58
  }
59
+
58
60
  &:first-of-type {
59
61
  margin-top: var(--spacing-md);
60
62
  &:before {
@@ -63,7 +65,7 @@
63
65
  }
64
66
  `,We=N.css`
65
67
  display: flex;
66
- gap: var(--spacing-xs);
68
+ gap: var(--spacing-base);
67
69
  flex-grow: 1;
68
70
  flex-wrap: wrap;
69
71
  margin-right: var(--spacing-base);
@@ -71,6 +73,7 @@
71
73
  width: 100%;
72
74
  display: flex;
73
75
  align-items: stretch;
76
+ position: relative;
74
77
  `,ye=N.css`
75
78
  flex: 2;
76
79
  height: 52px;
@@ -91,6 +94,11 @@
91
94
  height: 30px;
92
95
  justify-content: center;
93
96
  font-size: var(--fs-base);
94
- `,children:e})}var U=require("@emotion/react/jsx-runtime"),je=e=>{var l,d;let{data:t,getStyles:n,isDisabled:a,innerRef:r,innerProps:o}=e,[s,i]=(d=(l=t.label)==null?void 0:l.split(":"))!=null?d:[];return(0,U.jsxs)("div",{css:{...n("option",e),display:"flex",alignItems:"center",gap:"var(--spacing-sm)"},ref:r,"aria-disabled":a,...o,children:[i?(0,U.jsx)(re,{op:s}):(0,U.jsx)("div",{css:{width:"20px",height:"20px"}}),(0,U.jsx)("div",{children:i!=null?i:s})]})};var xe=require("@emotion/react/jsx-runtime"),Ke=e=>{let{data:t,getStyles:n}=e;return(0,xe.jsx)("div",{css:{...n("singleValue",e),width:"max-content"},children:t.label.length===1?(0,xe.jsx)(re,{op:t.label}):t.label})};var Xe=require("@emotion/react/jsx-runtime"),De=[{name:"=",description:"equals",value:"="},{name:"\u2260",description:"not equal",value:"!="},{name:">",description:"is greater than",value:">"},{name:"\u2265",description:"is greater than or equal to",value:">="},{name:"<",description:"is less than",value:"<"},{name:"\u2264",description:"is less than or equal to",value:"<="},{name:"has the strongest score",value:"+"},{name:"has the weakest score",value:"-"}];function Ie({onChange:e,value:t,...n}){var a,r;return(0,Xe.jsx)(Ye.InputComboBox,{...n,value:{label:(r=(a=De.find(o=>o.value===t))==null?void 0:a.name)!=null?r:t,value:t},options:De.map(o=>({label:o.description?`${o.name}:${o.description}`:o.name,value:o.value})),styles:{...n.styles,valueContainer:(o,s)=>{var i,l;return{...o,padding:"var(--spacing-sm)",...(l=(i=n.styles)==null?void 0:i.valueContainer)==null?void 0:l.call(i,o,s)}},menu:(o,s)=>{var i,l;return{...o,width:"max-content",...(l=(i=n.styles)==null?void 0:i.menu)==null?void 0:l.call(i,o,s)}},control:(o,s)=>{var i,l;return{...o,border:0,...(l=(i=n.styles)==null?void 0:i.control)==null?void 0:l.call(i,o,s)}},indicatorSeparator:(o,s)=>{var i,l;return{...o,display:"none",...(l=(i=n.styles)==null?void 0:i.indicatorSeparator)==null?void 0:l.call(i,o,s)}}},onChange:o=>{o&&e(o.value)},components:{SingleValue:Ke,Option:je,...n.components}})}var et=require("@uniformdev/design-system");var Je=require("@uniformdev/design-system");function we(e){return{label:e.displayName,value:e.dim,isDisabled:!1}}function ie(e){if(!e)return"unavailable";let[t]=e.split(":");switch(t.toLowerCase()){case"signal":return"data";case"intent":return"assign";case"audience":return"boy";default:return"user-list"}}function ae(e){let t=[],n="";for(let a of e){let[r]=a.displayName.split(":");n!==r&&(t.push({label:r,options:[]}),n=r),t[t.length-1].options.push(we(a))}return t}var G=require("@emotion/react/jsx-runtime"),se=e=>{var r;let{data:t,getStyles:n,className:a}=e;return(0,G.jsx)("div",{css:{...n("groupHeading",e),textTransform:"none",fontSize:"var(--font-size-sm)"},className:a,children:(0,G.jsxs)("small",{css:{color:"var(--gray-500)",display:"flex",alignItems:"center",gap:"var(--spacing-xs)"},children:[(0,G.jsx)(Je.Icon,{icon:ie((r=t.label)!=null?r:""),iconColor:"currentColor",size:16}),(0,G.jsx)("span",{children:t.label})]})})};var Qe=require("@emotion/react/jsx-runtime");function le({message:e}){return e?(0,Qe.jsx)("div",{css:{position:"absolute",background:"white",borderRadius:"3px",fontSize:"0.8rem",color:"var(--brand-primary-2)",bottom:"calc(var(--spacing-xs) * -1)"},children:e}):null}var Re=require("@emotion/react/jsx-runtime"),me=e=>{var u,p;let{data:t,getStyles:n,cx:a,isDisabled:r,isFocused:o,isSelected:s,className:i,innerRef:l,innerProps:d}=e,[,h]=(p=(u=t.label)==null?void 0:u.split(":"))!=null?p:[];return(0,Re.jsx)("div",{css:n("option",e),className:a({option:!0,"option--is-disabled":r,"option--is-focused":o,"option--is-selected":s},i),ref:l,"aria-disabled":r,...d,children:(0,Re.jsx)("div",{css:{color:"var(--gray-700)"},children:h!=null?h:t.label})})};var Ze=require("@uniformdev/design-system");var z=require("@emotion/react/jsx-runtime");function Me({displayName:e}){let[t,n]=e.split(":");return(0,z.jsxs)("div",{css:{whiteSpace:"normal",overflow:"hidden"},children:[n?(0,z.jsxs)("small",{css:{color:"var(--gray-500)",display:"flex",alignItems:"center",gap:"var(--spacing-xs)"},children:[t?(0,z.jsx)(Ze.Icon,{icon:ie(t),iconColor:"currentColor",size:16}):null,(0,z.jsx)("span",{"data-test-id":"dimension-name",children:t})]}):null,(0,z.jsx)("div",{css:{color:"var(--gray-700)"},"data-test-id":"dimension-value",children:n!=null?n:t})]})}var Ee=require("@emotion/react/jsx-runtime"),pe=e=>{let{data:t,getStyles:n}=e;return(0,Ee.jsx)("div",{css:n("singleValue",e),children:(0,Ee.jsx)(Me,{displayName:t.label})})};var L=require("@emotion/react/jsx-runtime");function Se({onChange:e,value:t,dimensions:n,errorMessage:a,...r}){return(0,L.jsxs)(L.Fragment,{children:[(0,L.jsx)(et.InputComboBox,{...r,value:t?we(t):void 0,options:ae(n),styles:{...r.styles,valueContainer:(o,s)=>{var i,l;return{...o,padding:"var(--spacing-sm)",...(l=(i=r.styles)==null?void 0:i.valueContainer)==null?void 0:l.call(i,o,s)}}},onChange:o=>{o&&e(n.find(s=>s.dim===o.value))},components:{Option:me,SingleValue:pe,GroupHeading:se,...r.components}}),(0,L.jsx)(le,{message:a})]})}var tt=require("@uniformdev/design-system"),nt=require("react");var I=require("@emotion/react/jsx-runtime");function Ve({onChange:e,criteriaMatch:t,dimensions:n,errorMessage:a,...r}){var d,h;let[o,s]=(0,nt.useState)(typeof t.r!="undefined"&&ue(t.r)!==null?t.r.toString(10):""),i=t.rDim,l=t.rDim?n.dimIndex[t.rDim]:void 0;return(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(tt.InputComboBox,{...r,inputValue:o,menuShouldScrollIntoView:!0,value:{label:(d=l==null?void 0:l.displayName)!=null?d:i&&!l?`${t.rDim} (unknown)`:"",value:(h=t.rDim)!=null?h:t.r?t.r.toString(10):"",isDisabled:!1},options:[{label:"Enter a numeric score to match, or choose another dimension to match its score",value:"",isDisabled:!0},...ae(n.dimensions)],styles:{...r.styles,valueContainer:(u,p)=>{var g,E;return{...u,padding:"var(--spacing-sm)",...(E=(g=r.styles)==null?void 0:g.valueContainer)==null?void 0:E.call(g,u,p)}},option:(u,p)=>{var g,E;return{fontSize:p.isDisabled?"0.8rem":void 0,...(E=(g=r.styles)==null?void 0:g.option)==null?void 0:E.call(g,u,p)}}},onChange:u=>{var p;u&&(e({...t,rDim:(p=u.value)==null?void 0:p.toString(),r:void 0}),s(""))},onInputChange:(u,p)=>{let g=ue(u);p.action==="input-change"||p.action==="set-value"?(s(u),(g||u==="")&&e({...t,r:u||void 0,rDim:void 0})):!g&&!ue(p.prevInputValue)&&(!u&&t.r?s(t.r.toString()):s(u))},components:{...r.components,Option:me,SingleValue:pe,GroupHeading:se},noOptionsMessage:({inputValue:u})=>ue(u)?(0,I.jsxs)(I.Fragment,{children:[(0,I.jsxs)("div",{children:["Score: ",u]}),(0,I.jsx)("small",{children:"If you want to match on another dimension\u2019s score instead, clear the score value to search for a dimension."})]}):(0,I.jsxs)(I.Fragment,{children:[(0,I.jsxs)("div",{children:["No dimensions match your search \u201C",u,"\u201D"]}),(0,I.jsx)("small",{children:"If you want to match a literal score, enter a numeric value."})]})}),(0,I.jsx)(le,{message:a})]})}function ue(e){return/^\d+$/.test(e.toString(10))}var f=require("@emotion/react/jsx-runtime"),Be=({value:e,setValue:t,dimensions:n,onMenuOpen:a,onMenuClose:r,onAddCriteria:o,onRemoveCriteria:s,displayTitle:i=!0,components:l,errors:d={}})=>{let h=e||{crit:[]},u=C=>{t({...h,op:C==="&"?void 0:C})},p=()=>{let C={...h,crit:[...h.crit,{l:"",op:">",r:0}]};t(C),o==null||o(C)},g=(C,y)=>{t((0,Oe.default)(h,B=>{B.crit[y]=C}))},E=C=>{let y=(0,Oe.default)(h,v=>{v.crit.splice(C,1)}),B=y.crit.length===0?null:y;t(B),s==null||s(B)};return(0,f.jsxs)("fieldset",{className:"personalization-criteria",children:[i?l!=null&&l.Title?(0,f.jsx)(l.Title,{}):(0,f.jsx)("legend",{css:{fontSize:"var(--fs-md)",fontWeight:"var(--fw-bold)"},children:"Personalize This"}):null,l!=null&&l.CustomVariantName?(0,f.jsx)(l.CustomVariantName,{}):null,h.crit.length?(0,f.jsx)("div",{children:h.crit.map((C,y)=>{var R,j,q,K;let B=((R=C.l)==null?void 0:R.length)>0,v=C.op!=="+"&&C.op!=="-";return(0,f.jsxs)("div",{css:He,"data-test-id":"criteria-container",children:[(0,f.jsxs)("div",{css:ot.css`
97
+ `,children:e})}var U=require("@emotion/react/jsx-runtime"),je=e=>{var l,d;let{data:t,getStyles:n,isDisabled:a,innerRef:r,innerProps:o}=e,[s,i]=(d=(l=t.label)==null?void 0:l.split(":"))!=null?d:[];return(0,U.jsxs)("div",{css:{...n("option",e),display:"flex",alignItems:"center",gap:"var(--spacing-sm)"},ref:r,"aria-disabled":a,...o,children:[i?(0,U.jsx)(re,{op:s}):(0,U.jsx)("div",{css:{width:"20px",height:"20px"}}),(0,U.jsx)("div",{children:i!=null?i:s})]})};var xe=require("@emotion/react/jsx-runtime"),Ke=e=>{let{data:t,getStyles:n}=e;return(0,xe.jsx)("div",{css:{...n("singleValue",e),width:"max-content"},children:t.label.length===1?(0,xe.jsx)(re,{op:t.label}):t.label})};var Xe=require("@emotion/react/jsx-runtime"),De=[{name:"=",description:"equals",value:"="},{name:"\u2260",description:"not equal",value:"!="},{name:">",description:"is greater than",value:">"},{name:"\u2265",description:"is greater than or equal to",value:">="},{name:"<",description:"is less than",value:"<"},{name:"\u2264",description:"is less than or equal to",value:"<="},{name:"has the strongest score",value:"+"},{name:"has the weakest score",value:"-"}];function Ie({onChange:e,value:t,...n}){var a,r;return(0,Xe.jsx)(Ye.InputComboBox,{...n,value:{label:(r=(a=De.find(o=>o.value===t))==null?void 0:a.name)!=null?r:t,value:t},options:De.map(o=>({label:o.description?`${o.name}:${o.description}`:o.name,value:o.value})),styles:{...n.styles,valueContainer:(o,s)=>{var i,l;return{...o,padding:"var(--spacing-sm)",...(l=(i=n.styles)==null?void 0:i.valueContainer)==null?void 0:l.call(i,o,s)}},menu:(o,s)=>{var i,l;return{...o,width:"max-content",...(l=(i=n.styles)==null?void 0:i.menu)==null?void 0:l.call(i,o,s)}},control:(o,s)=>{var i,l;return{...o,border:0,...(l=(i=n.styles)==null?void 0:i.control)==null?void 0:l.call(i,o,s)}},indicatorSeparator:(o,s)=>{var i,l;return{...o,display:"none",...(l=(i=n.styles)==null?void 0:i.indicatorSeparator)==null?void 0:l.call(i,o,s)}}},onChange:o=>{o&&e(o.value)},components:{SingleValue:Ke,Option:je,...n.components}})}var tt=require("@uniformdev/design-system");var Je=require("@uniformdev/design-system");function we(e){return{label:e.displayName,value:e.dim,isDisabled:!1}}function ie(e){if(!e)return"unavailable";let[t]=e.split(":");switch(t.toLowerCase()){case"signal":return"data";case"intent":return"assign";case"audience":return"boy";default:return"user-list"}}function ae(e){let t=[],n="";for(let a of e){let[r]=a.displayName.split(":");n!==r&&(t.push({label:r,options:[]}),n=r),t[t.length-1].options.push(we(a))}return t}var G=require("@emotion/react/jsx-runtime"),se=e=>{var r;let{data:t,getStyles:n,className:a}=e;return(0,G.jsx)("div",{css:{...n("groupHeading",e),textTransform:"none",fontSize:"var(--font-size-sm)"},className:a,children:(0,G.jsxs)("small",{css:{color:"var(--gray-500)",display:"flex",alignItems:"center",gap:"var(--spacing-xs)"},children:[(0,G.jsx)(Je.Icon,{icon:ie((r=t.label)!=null?r:""),iconColor:"currentColor",size:16}),(0,G.jsx)("span",{children:t.label})]})})};var Qe=require("@emotion/react"),Ze=require("@emotion/react/jsx-runtime");function le({message:e}){return e?(0,Ze.jsx)("div",{css:Qe.css`
98
+ color: var(--brand-primary-2);
99
+ font-size: var(--fs-xs);
100
+ position: absolute;
101
+ bottom: calc((var(--spacing-base) * -1) + -2px);
102
+ `,children:e}):null}var Re=require("@emotion/react/jsx-runtime"),me=e=>{var u,p;let{data:t,getStyles:n,cx:a,isDisabled:r,isFocused:o,isSelected:s,className:i,innerRef:l,innerProps:d}=e,[,h]=(p=(u=t.label)==null?void 0:u.split(":"))!=null?p:[];return(0,Re.jsx)("div",{css:n("option",e),className:a({option:!0,"option--is-disabled":r,"option--is-focused":o,"option--is-selected":s},i),ref:l,"aria-disabled":r,...d,children:(0,Re.jsx)("div",{css:{color:"var(--gray-700)"},children:h!=null?h:t.label})})};var et=require("@uniformdev/design-system");var z=require("@emotion/react/jsx-runtime");function Me({displayName:e}){let[t,n]=e.split(":");return(0,z.jsxs)("div",{css:{whiteSpace:"normal",overflow:"hidden"},children:[n?(0,z.jsxs)("small",{css:{color:"var(--gray-500)",display:"flex",alignItems:"center",gap:"var(--spacing-xs)"},children:[t?(0,z.jsx)(et.Icon,{icon:ie(t),iconColor:"currentColor",size:16}):null,(0,z.jsx)("span",{"data-test-id":"dimension-name",children:t})]}):null,(0,z.jsx)("div",{css:{color:"var(--gray-700)"},"data-test-id":"dimension-value",children:n!=null?n:t})]})}var Ee=require("@emotion/react/jsx-runtime"),pe=e=>{let{data:t,getStyles:n}=e;return(0,Ee.jsx)("div",{css:n("singleValue",e),children:(0,Ee.jsx)(Me,{displayName:t.label})})};var L=require("@emotion/react/jsx-runtime");function Ve({onChange:e,value:t,dimensions:n,errorMessage:a,...r}){return(0,L.jsxs)(L.Fragment,{children:[(0,L.jsx)(tt.InputComboBox,{...r,value:t?we(t):void 0,options:ae(n),styles:{...r.styles,valueContainer:(o,s)=>{var i,l;return{...o,padding:"var(--spacing-sm)",...(l=(i=r.styles)==null?void 0:i.valueContainer)==null?void 0:l.call(i,o,s)}}},onChange:o=>{o&&e(n.find(s=>s.dim===o.value))},components:{Option:me,SingleValue:pe,GroupHeading:se,...r.components}}),(0,L.jsx)(le,{message:a})]})}var nt=require("@uniformdev/design-system"),ot=require("react");var I=require("@emotion/react/jsx-runtime");function Oe({onChange:e,criteriaMatch:t,dimensions:n,errorMessage:a,...r}){var d,h;let[o,s]=(0,ot.useState)(typeof t.r!="undefined"&&ue(t.r)!==null?t.r.toString(10):""),i=t.rDim,l=t.rDim?n.dimIndex[t.rDim]:void 0;return(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(nt.InputComboBox,{...r,inputValue:o,menuShouldScrollIntoView:!0,value:{label:(d=l==null?void 0:l.displayName)!=null?d:i&&!l?`${t.rDim} (unknown)`:"",value:(h=t.rDim)!=null?h:t.r?t.r.toString(10):"",isDisabled:!1},options:[{label:"Enter a numeric score to match, or choose another dimension to match its score",value:"",isDisabled:!0},...ae(n.dimensions)],styles:{...r.styles,valueContainer:(u,p)=>{var g,E;return{...u,padding:"var(--spacing-sm)",...(E=(g=r.styles)==null?void 0:g.valueContainer)==null?void 0:E.call(g,u,p)}},option:(u,p)=>{var g,E;return{fontSize:p.isDisabled?"0.8rem":void 0,...(E=(g=r.styles)==null?void 0:g.option)==null?void 0:E.call(g,u,p)}}},onChange:u=>{var p;u&&(e({...t,rDim:(p=u.value)==null?void 0:p.toString(),r:void 0}),s(""))},onInputChange:(u,p)=>{let g=ue(u);p.action==="input-change"||p.action==="set-value"?(s(u),(g||u==="")&&e({...t,r:u||void 0,rDim:void 0})):!g&&!ue(p.prevInputValue)&&(!u&&t.r?s(t.r.toString()):s(u))},components:{...r.components,Option:me,SingleValue:pe,GroupHeading:se},noOptionsMessage:({inputValue:u})=>ue(u)?(0,I.jsxs)(I.Fragment,{children:[(0,I.jsxs)("div",{children:["Score: ",u]}),(0,I.jsx)("small",{children:"If you want to match on another dimension\u2019s score instead, clear the score value to search for a dimension."})]}):(0,I.jsxs)(I.Fragment,{children:[(0,I.jsxs)("div",{children:["No dimensions match your search \u201C",u,"\u201D"]}),(0,I.jsx)("small",{children:"If you want to match a literal score, enter a numeric value."})]})}),(0,I.jsx)(le,{message:a})]})}function ue(e){return/^\d+$/.test(e.toString(10))}var f=require("@emotion/react/jsx-runtime"),Be=({value:e,setValue:t,dimensions:n,onMenuOpen:a,onMenuClose:r,onAddCriteria:o,onRemoveCriteria:s,displayTitle:i=!0,components:l,errors:d={}})=>{let h=e||{crit:[]},u=C=>{t({...h,op:C==="&"?void 0:C})},p=()=>{let C={...h,crit:[...h.crit,{l:"",op:">",r:0}]};t(C),o==null||o(C)},g=(C,y)=>{t((0,Se.default)(h,B=>{B.crit[y]=C}))},E=C=>{let y=(0,Se.default)(h,v=>{v.crit.splice(C,1)}),B=y.crit.length===0?null:y;t(B),s==null||s(B)};return(0,f.jsxs)("fieldset",{className:"personalization-criteria",children:[i?l!=null&&l.Title?(0,f.jsx)(l.Title,{}):(0,f.jsx)("legend",{css:{fontSize:"var(--fs-md)",fontWeight:"var(--fw-bold)"},children:"Personalize This"}):null,l!=null&&l.CustomVariantName?(0,f.jsx)(l.CustomVariantName,{}):null,h.crit.length?(0,f.jsx)("div",{children:h.crit.map((C,y)=>{var R,j,q,K;let B=((R=C.l)==null?void 0:R.length)>0,v=C.op!=="+"&&C.op!=="-";return(0,f.jsxs)("div",{css:He,"data-test-id":"criteria-container",children:[(0,f.jsxs)("div",{css:rt.css`
95
103
  ${We}/* grid-template-columns: minmax(0, 1fr) ${v?"minmax(0, 79px) minmax(0, 1fr)":"minmax(0, 1fr)"} */
96
- `,className:"criteriaItemInner",children:[(0,f.jsx)("div",{css:[ne,ye],className:"criteria-wrapper","data-test-id":"select-criteria",children:(0,f.jsx)(Se,{errorMessage:(j=d.lhs)==null?void 0:j[y],css:oe,styles:{control:D=>({...D,height:"100%"})},dimensions:n.dimensions,onChange:D=>{g({...C,l:D.dim},y)},value:n.dimIndex[C.l],onMenuOpen:a,onMenuClose:r})}),(0,f.jsx)("div",{css:[ne,qe],className:"criteria-wrapper","data-test-id":"select-operator",children:(0,f.jsx)(Ie,{name:`op-${y}`,css:oe,styles:{control:D=>({...D,height:"100%"})},value:C.op,onChange:D=>{g(D==="+"||D==="-"?{...C,op:D,r:void 0,rDim:void 0}:{...C,op:D},y)},onMenuOpen:a,onMenuClose:r})}),v?(0,f.jsx)("div",{css:[ne,ye],className:"criteria-wrapper","data-test-id":"select-match-criteria",children:(0,f.jsx)(Ve,{errorMessage:(q=d.rhs)==null?void 0:q[y],css:oe,styles:{control:D=>({...D,height:"100%"})},criteriaMatch:C,onChange:D=>{g(D,y)},isDisabled:!B,dimensions:n,onMenuOpen:a,onMenuClose:r})}):null]}),(0,f.jsx)("button",{type:"button",onClick:()=>E(y),title:"Delete Personalization",css:{backgroundColor:"transparent",backgroundImage:"none",borderWidth:0},"data-test-id":"button-delete",children:(0,f.jsx)(V.Icon,{icon:rt.CgCloseO,iconColor:"red",size:"1.5rem"})}),y>0?(0,f.jsx)("div",{className:"criteria-group-operation",css:{position:"absolute",top:"-4rem",transform:"translateX(calc(1.5rem - 50%))"},children:(0,f.jsx)(V.InputInlineSelect,{"data-test-id":"dropdown-button-combine",disabled:y>1,value:(K=h.op)!=null?K:"&",options:[{label:"AND",value:"&"},{label:"OR",value:"|"}],onChange:D=>{u(D.value)}})}):null]},y)})}):(0,f.jsx)(V.Callout,{title:"Default variant",type:"info",css:{marginBlock:"var(--spacing-base)"},children:(0,f.jsx)(V.Paragraph,{children:'This personalized variant has no match criteria and will be shown to any visitor that does not match any preceding variants. Ensure that default variants come last in the variant list. Personalize this variant by clicking "Add Criteria" to get started.'})}),n.dimensions.length===0?l!=null&&l.NoDimensionsDefined?(0,f.jsx)(l.NoDimensionsDefined,{}):(0,f.jsx)(V.Callout,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:(0,f.jsx)("p",{children:"You do not have any dimensions configured."})}):(0,f.jsx)(V.AddListButton,{"data-test-id":"button-add-criteria",className:"add-more",buttonText:"Add Criteria",onButtonClick:p})]})};var w=J(require("yup")),at=require("react-use");function Mt(e){return Array.isArray(e)&&e.length>0&&e[0].cat!==void 0}function Et(e){return e.crit!==void 0}function ce(e){return e!=="+"&&e!=="-"}var P=require("@emotion/react/jsx-runtime");function st(e){let t={crit:[]};return e.forEach(n=>{if(!n.path)return;let a=/\[(\d+)\]\.(\w+)/g,r=[...n.path.matchAll(a)][0];if((r==null?void 0:r.length)==3){let o=Number(r[1]),s=r[2];if(t.crit.length>o)t.crit[o]={...t.crit[o],[s]:n.message};else{let i={};i[s]=n.message,t.crit.push(i)}}}),t}async function Pe(e,t){let n=w.object().shape({l:w.string().required("Please select a dimension").oneOf(t==null?void 0:t.dimensions.map(a=>a.dim),"Selected left-side criteria dimension does not exist"),op:w.string().required(),r:w.mixed().nullable().when(["rDim","op"],{is:(a,r)=>ce(r)&&!a,then:w.string().required("Choose a score or dimension")}),rDim:w.string().oneOf(t==null?void 0:t.dimensions.map(a=>a.dim),"Selected right-side criteria dimension does not exist").when(["r","op"],{is:(a,r)=>ce(r)&&!a,then:w.string().required("Choose a score or dimension")})},["rDim","r"]);try{await w.object({crit:w.array(n)}).nullable().validate(e,{abortEarly:!1})}catch(a){return st(a.inner)}}var St=({contextConfig:e,value:t,setValue:n,...a})=>{var h,u;let[r,o]=(0,it.useState)(void 0),{loading:s,result:i,error:l}=k(e);return(0,at.useAsync)(async()=>{if(t&&i){let p=await Pe(t,i);o(p)}},[t,i,Pe]),l?(0,P.jsx)(_.Callout,{type:"danger",children:l}):s||i===null?(0,P.jsx)(_.LoadingIndicator,{}):(0,P.jsx)(Be,{...a,value:t,setValue:async p=>{let g=await Pe(p,i);o(g),n(p)},errors:{lhs:(h=r==null?void 0:r.crit)==null?void 0:h.map(p=>p==null?void 0:p.l),rhs:(u=r==null?void 0:r.crit)==null?void 0:u.map(p=>p==null?void 0:p.rDim)},dimensions:i,components:{NoDimensionsDefined:()=>(0,P.jsx)(_.Callout,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:(0,P.jsxs)("p",{children:["You do not have any dimensions configured. Create your first"," ",(0,P.jsx)("a",{href:`${e.apiHost}/projects/${encodeURIComponent(e.projectId)}/personalization/signals`,target:"_blank",rel:"noopener noreferrer",css:{":hover":{textDecorationLine:"underline"}},children:"Dimension"})]})})}})};var de=require("react"),fe=require("@uniformdev/context/api");function F({apiHost:e,apiKey:t,projectId:n}){let[a,r]=(0,de.useState)({loading:!1,notConfigured:!1,error:null,result:null});return(0,de.useEffect)(()=>{if(!n||!t||!e){r({notConfigured:!0,loading:!1,error:null,result:null});return}(async()=>{r({notConfigured:!1,loading:!0,error:null,result:null});try{let i=await new fe.CachedManifestClient({projectId:n,apiKey:t,apiHost:e}).get({preview:!0});r({notConfigured:!1,loading:!1,error:null,result:i})}catch(s){let i;s instanceof fe.ApiClientError?(s.statusCode===403&&(i=`The API key ${t} did not have permissions to fetch the manifest. Ensure Context > Read Drafts permissions are granted.`),i=s.message):i=s.toString(),r({notConfigured:!1,loading:!1,error:i,result:null});return}})()},[e,t,n]),{result:a.result,error:a.error,loading:a.loading,notConfigured:a.notConfigured}}var lt=require("@uniformdev/design-system"),H=require("@emotion/react/jsx-runtime");function Vt({children:e,versionMap:t,contextConfig:n}){let{loading:a,result:r}=F(n);if(a)return(0,H.jsx)(lt.LoadingIndicator,{});if(r){let o=t[r.project.ui_version];if(o)return(0,H.jsx)(o,{})}return(0,H.jsx)(H.Fragment,{children:e})}var W=require("react");var mt=require("@uniformdev/design-system"),O=require("@emotion/react/jsx-runtime"),ge=(0,W.createContext)(null),Ot=({loadingComponent:e,errorComponent:t,contextConfig:n,children:a})=>{let r=F(n),o=k(n);return r.error||r.notConfigured?t?(0,O.jsx)(t,{contextConfig:n,result:r}):(0,O.jsx)(O.Fragment,{children:"ErrorComponent is not configured"}):o.error||o.notConfigured?t?(0,O.jsx)(t,{contextConfig:n,result:o}):(0,O.jsx)(O.Fragment,{children:"ErrorComponent is not configured"}):r.loading||o.loading?e?(0,O.jsx)(e,{}):(0,O.jsx)(mt.LoadingIndicator,{}):(0,O.jsx)(ge.Provider,{value:{manifest:r.result,dimensions:o.result,contextConfig:n},children:a})};function Bt(){let e=(0,W.useContext)(ge);if(!(e!=null&&e.contextConfig))throw new Error("Not within DataContext! Configuration data is not exist.");return e.contextConfig}function Pt(){let e=(0,W.useContext)(ge);if(!(e!=null&&e.manifest))throw new Error("Not within DataContext! Manifest data is not exist.");return e.manifest}function kt(){let e=(0,W.useContext)(ge);if(!(e!=null&&e.dimensions))throw new Error("Not within DataContext! Dimensions data is not exist.");return e.dimensions}var pt=require("uuid"),ut=require("@uniformdev/context/api"),ke=async e=>{if(!e)return{valid:!1,error:new Error("contextConfig was not defined.")};if(!e.apiHost)return{valid:!1,error:new Error("apiHost was not defined.")};if(!e.apiKey)return{valid:!1,error:new Error("apiKey was not defined.")};if(!(0,pt.validate)(e.apiKey)&&!e.projectId)return{valid:!1,error:new Error("projectId is required when using a modern API key.")};let t=new ut.UncachedManifestClient({projectId:e.projectId,apiKey:e.apiKey,apiHost:e.apiHost});try{return{valid:!0,result:await t.get({preview:!0})}}catch(n){return{valid:!1,error:n}}};var Ce=require("react");var Tt=e=>{let[t,n]=(0,Ce.useState)({validating:!1,error:void 0}),{apiKey:a,apiHost:r,projectId:o}=e||{};return(0,Ce.useEffect)(()=>{if(!a||!r)return;(async()=>{n({validating:!0,error:void 0});let{error:i,result:l}=await ke({apiHost:r,apiKey:a,projectId:o});n(i?{error:i,validating:!1}:{error:void 0,validating:!1,result:l})})()},[r,a,o]),{validating:t.validating,error:t.error,result:t.result}};S(M,require("@uniformdev/design-system"),module.exports);0&&(module.exports={ContextData,CriteriaMatchMenu,CriteriaOperatorMenu,DimensionMenu,DimensionValue,EditLink,EnrichmentTag,PersonalizationCriteria,PersonalizationCriteriaStatic,ProjectUIVersion,addEnrichmentLink,contextCriteriaMenuOperators,convertErrorsToObj,isEnrichmentTagData,isPersonalizationCriteriaData,opHasRhs,useContextConfig,useContextData,useDimensions,useDimensionsDataContext,useManifest,useValidateContextConfig,validateContextConfig});
104
+ `,className:"criteriaItemInner",children:[(0,f.jsx)("div",{css:[ne,ye],className:"criteria-wrapper","data-test-id":"select-criteria",children:(0,f.jsx)(Ve,{errorMessage:(j=d.lhs)==null?void 0:j[y],css:oe,styles:{control:D=>({...D,height:"100%"})},dimensions:n.dimensions,onChange:D=>{g({...C,l:D.dim},y)},value:n.dimIndex[C.l],onMenuOpen:a,onMenuClose:r})}),(0,f.jsx)("div",{css:[ne,qe],className:"criteria-wrapper","data-test-id":"select-operator",children:(0,f.jsx)(Ie,{name:`op-${y}`,css:oe,styles:{control:D=>({...D,height:"100%"})},value:C.op,onChange:D=>{g(D==="+"||D==="-"?{...C,op:D,r:void 0,rDim:void 0}:{...C,op:D},y)},onMenuOpen:a,onMenuClose:r})}),v?(0,f.jsx)("div",{css:[ne,ye],className:"criteria-wrapper","data-test-id":"select-match-criteria",children:(0,f.jsx)(Oe,{errorMessage:(q=d.rhs)==null?void 0:q[y],css:oe,styles:{control:D=>({...D,height:"100%"})},criteriaMatch:C,onChange:D=>{g(D,y)},isDisabled:!B,dimensions:n,onMenuOpen:a,onMenuClose:r})}):null]}),(0,f.jsx)("button",{type:"button",onClick:()=>E(y),title:"Delete Personalization",css:{backgroundColor:"transparent",backgroundImage:"none",borderWidth:0},"data-test-id":"button-delete",children:(0,f.jsx)(O.Icon,{icon:it.CgCloseO,iconColor:"red",size:"1.5rem"})}),y>0?(0,f.jsx)("div",{className:"criteria-group-operation",css:{position:"absolute",top:"-4rem",transform:"translateX(calc(1.5rem - 50%))"},children:(0,f.jsx)(O.InputInlineSelect,{"data-test-id":"dropdown-button-combine",disabled:y>1,value:(K=h.op)!=null?K:"&",options:[{label:"AND",value:"&"},{label:"OR",value:"|"}],onChange:D=>{u(D.value)}})}):null]},y)})}):(0,f.jsx)(O.Callout,{title:"Default variant",type:"info",css:{marginBlock:"var(--spacing-base)"},children:(0,f.jsx)(O.Paragraph,{children:'This personalized variant has no match criteria and will be shown to any visitor that does not match any preceding variants. Ensure that default variants come last in the variant list. Personalize this variant by clicking "Add Criteria" to get started.'})}),n.dimensions.length===0?l!=null&&l.NoDimensionsDefined?(0,f.jsx)(l.NoDimensionsDefined,{}):(0,f.jsx)(O.Callout,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:(0,f.jsx)("p",{children:"You do not have any dimensions configured."})}):(0,f.jsx)(O.AddListButton,{"data-test-id":"button-add-criteria",className:"add-more",buttonText:"Add Criteria",onButtonClick:p})]})};var w=J(require("yup")),st=require("react-use");function Et(e){return Array.isArray(e)&&e.length>0&&e[0].cat!==void 0}function Vt(e){return e.crit!==void 0}function ce(e){return e!=="+"&&e!=="-"}var P=require("@emotion/react/jsx-runtime");function lt(e){let t={crit:[]};return e.forEach(n=>{if(!n.path)return;let a=/\[(\d+)\]\.(\w+)/g,r=[...n.path.matchAll(a)][0];if((r==null?void 0:r.length)==3){let o=Number(r[1]),s=r[2];if(t.crit.length>o)t.crit[o]={...t.crit[o],[s]:n.message};else{let i={};i[s]=n.message,t.crit.push(i)}}}),t}async function Pe(e,t){let n=w.object().shape({l:w.string().required("Please select a dimension").oneOf(t==null?void 0:t.dimensions.map(a=>a.dim),"Select a criteria"),op:w.string().required(),r:w.mixed().nullable().when(["rDim","op"],{is:(a,r)=>ce(r)&&!a,then:w.string().required("Choose a score or dimension")}),rDim:w.string().oneOf(t==null?void 0:t.dimensions.map(a=>a.dim),"Select a criteria").when(["r","op"],{is:(a,r)=>ce(r)&&!a,then:w.string().required("Choose a score or dimension")})},["rDim","r"]);try{await w.object({crit:w.array(n)}).nullable().validate(e,{abortEarly:!1})}catch(a){return lt(a.inner)}}var Ot=({contextConfig:e,value:t,setValue:n,...a})=>{var h,u;let[r,o]=(0,at.useState)(void 0),{loading:s,result:i,error:l}=T(e);return(0,st.useAsync)(async()=>{if(t&&i){let p=await Pe(t,i);o(p)}},[t,i,Pe]),l?(0,P.jsx)(_.Callout,{type:"danger",children:l}):s||i===null?(0,P.jsx)(_.LoadingIndicator,{}):(0,P.jsx)(Be,{...a,value:t,setValue:async p=>{let g=await Pe(p,i);o(g),n(p)},errors:{lhs:(h=r==null?void 0:r.crit)==null?void 0:h.map(p=>p==null?void 0:p.l),rhs:(u=r==null?void 0:r.crit)==null?void 0:u.map(p=>p==null?void 0:p.rDim)},dimensions:i,components:{NoDimensionsDefined:()=>(0,P.jsx)(_.Callout,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:(0,P.jsxs)("p",{children:["You do not have any dimensions configured. Create your first"," ",(0,P.jsx)("a",{href:`${e.apiHost}/projects/${encodeURIComponent(e.projectId)}/personalization/signals`,target:"_blank",rel:"noopener noreferrer",css:{":hover":{textDecorationLine:"underline"}},children:"Dimension"})]})})}})};var de=require("react"),fe=require("@uniformdev/context/api");function F({apiHost:e,apiKey:t,projectId:n}){let[a,r]=(0,de.useState)({loading:!1,notConfigured:!1,error:null,result:null});return(0,de.useEffect)(()=>{if(!n||!t||!e){r({notConfigured:!0,loading:!1,error:null,result:null});return}(async()=>{r({notConfigured:!1,loading:!0,error:null,result:null});try{let i=await new fe.CachedManifestClient({projectId:n,apiKey:t,apiHost:e}).get({preview:!0});r({notConfigured:!1,loading:!1,error:null,result:i})}catch(s){let i;s instanceof fe.ApiClientError?(s.statusCode===403&&(i=`The API key ${t} did not have permissions to fetch the manifest. Ensure Context > Read Drafts permissions are granted.`),i=s.message):i=s.toString(),r({notConfigured:!1,loading:!1,error:i,result:null});return}})()},[e,t,n]),{result:a.result,error:a.error,loading:a.loading,notConfigured:a.notConfigured}}var mt=require("@uniformdev/design-system"),H=require("@emotion/react/jsx-runtime");function St({children:e,versionMap:t,contextConfig:n}){let{loading:a,result:r}=F(n);if(a)return(0,H.jsx)(mt.LoadingIndicator,{});if(r){let o=t[r.project.ui_version];if(o)return(0,H.jsx)(o,{})}return(0,H.jsx)(H.Fragment,{children:e})}var W=require("react");var pt=require("@uniformdev/design-system"),S=require("@emotion/react/jsx-runtime"),ge=(0,W.createContext)(null),Bt=({loadingComponent:e,errorComponent:t,contextConfig:n,children:a})=>{let r=F(n),o=T(n);return r.error||r.notConfigured?t?(0,S.jsx)(t,{contextConfig:n,result:r}):(0,S.jsx)(S.Fragment,{children:"ErrorComponent is not configured"}):o.error||o.notConfigured?t?(0,S.jsx)(t,{contextConfig:n,result:o}):(0,S.jsx)(S.Fragment,{children:"ErrorComponent is not configured"}):r.loading||o.loading?e?(0,S.jsx)(e,{}):(0,S.jsx)(pt.LoadingIndicator,{}):(0,S.jsx)(ge.Provider,{value:{manifest:r.result,dimensions:o.result,contextConfig:n},children:a})};function Pt(){let e=(0,W.useContext)(ge);if(!(e!=null&&e.contextConfig))throw new Error("Not within DataContext! Configuration data is not exist.");return e.contextConfig}function Tt(){let e=(0,W.useContext)(ge);if(!(e!=null&&e.manifest))throw new Error("Not within DataContext! Manifest data is not exist.");return e.manifest}function kt(){let e=(0,W.useContext)(ge);if(!(e!=null&&e.dimensions))throw new Error("Not within DataContext! Dimensions data is not exist.");return e.dimensions}var ut=require("uuid"),ct=require("@uniformdev/context/api"),Te=async e=>{if(!e)return{valid:!1,error:new Error("contextConfig was not defined.")};if(!e.apiHost)return{valid:!1,error:new Error("apiHost was not defined.")};if(!e.apiKey)return{valid:!1,error:new Error("apiKey was not defined.")};if(!(0,ut.validate)(e.apiKey)&&!e.projectId)return{valid:!1,error:new Error("projectId is required when using a modern API key.")};let t=new ct.UncachedManifestClient({projectId:e.projectId,apiKey:e.apiKey,apiHost:e.apiHost});try{return{valid:!0,result:await t.get({preview:!0})}}catch(n){return{valid:!1,error:n}}};var Ce=require("react");var Nt=e=>{let[t,n]=(0,Ce.useState)({validating:!1,error:void 0}),{apiKey:a,apiHost:r,projectId:o}=e||{};return(0,Ce.useEffect)(()=>{if(!a||!r)return;(async()=>{n({validating:!0,error:void 0});let{error:i,result:l}=await Te({apiHost:r,apiKey:a,projectId:o});n(i?{error:i,validating:!1}:{error:void 0,validating:!1,result:l})})()},[r,a,o]),{validating:t.validating,error:t.error,result:t.result}};V(M,require("@uniformdev/design-system"),module.exports);0&&(module.exports={ContextData,CriteriaMatchMenu,CriteriaOperatorMenu,DimensionMenu,DimensionValue,EditLink,EnrichmentTag,PersonalizationCriteria,PersonalizationCriteriaStatic,ProjectUIVersion,addEnrichmentLink,contextCriteriaMenuOperators,convertErrorsToObj,isEnrichmentTagData,isPersonalizationCriteriaData,opHasRhs,useContextConfig,useContextData,useDimensions,useDimensionsDataContext,useManifest,useValidateContextConfig,validateContextConfig});
package/dist/index.mjs CHANGED
@@ -9,7 +9,7 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
9
9
  &:focus {
10
10
  text-decoration-line: underline;
11
11
  }
12
- `;import{jsx as _e,jsxs as Fe}from"@emotion/react/jsx-runtime";var ce=({linkTo:e,name:t,linkText:o=`Edit ${t} Component`})=>Fe("a",{css:ue,title:`Edit ${t} component definition`,rel:"noopener noreferrer",target:"_blank",href:e,children:[o,_e(We,{icon:qe,iconColor:"currentColor",size:"1.5rem"})]});import{useMemo as fe,useState as K}from"react";import{useEffect as je,useState as Ke}from"react";import{computeDimensionDisplayName as Ye,ApiClientError as Xe,CachedDimensionClient as Je}from"@uniformdev/context/api";function de(e,t,o){return e.reduce((a,r)=>{let n=t(r);if(typeof n=="undefined"||n===null)throw new Error("Objectify key selector returned undefined or null.");return a[t(r)]=o?o(r):r,a},{})}function S({apiHost:e,apiKey:t,projectId:o}){let[a,r]=Ke({loading:!1,notConfigured:!1,error:null,result:null});return je(()=>{if(!o||!t||!e){r({notConfigured:!0,loading:!1,error:null,result:null});return}(async()=>{r({notConfigured:!1,loading:!0,error:null,result:null});try{let i=(await new Je({projectId:o,apiKey:t,apiHost:e}).get()).dimensions.map(d=>({...d,displayName:Ye(d)})),l={dimensions:i,dimIndex:de(i,d=>d.dim,d=>d)};r({notConfigured:!1,loading:!1,error:null,result:l})}catch(s){let i;s instanceof Xe?i=s.message:i=s.toString(),r({notConfigured:!1,loading:!1,error:i,result:null});return}})()},[e,t,o]),{result:a.result,error:a.error,loading:a.loading,notConfigured:a.notConfigured}}import{getEnrichmentVectorKey as Y}from"@uniformdev/context";import{Input as Ce,Button as Qe,InputSelect as Ze,Callout as X,Icon as J,LoadingIndicator as et,AddListButton as tt}from"@uniformdev/design-system";import{CgMathPlus as nt,CgMathMinus as ot,CgCloseO as rt}from"react-icons/cg";import ge from"immer";import{css as Q}from"@emotion/react";import{Fragment as ve,jsx as u,jsxs as M}from"@emotion/react/jsx-runtime";var it=Q`
12
+ `;import{jsx as _e,jsxs as Fe}from"@emotion/react/jsx-runtime";var ce=({linkTo:e,name:t,linkText:o=`Edit ${t} Component`})=>Fe("a",{css:ue,title:`Edit ${t} component definition`,rel:"noopener noreferrer",target:"_blank",href:e,children:[o,_e(We,{icon:qe,iconColor:"currentColor",size:"1.5rem"})]});import{useMemo as fe,useState as K}from"react";import{useEffect as je,useState as Ke}from"react";import{computeDimensionDisplayName as Ye,ApiClientError as Xe,CachedDimensionClient as Je}from"@uniformdev/context/api";function de(e,t,o){return e.reduce((a,r)=>{let n=t(r);if(typeof n=="undefined"||n===null)throw new Error("Objectify key selector returned undefined or null.");return a[t(r)]=o?o(r):r,a},{})}function V({apiHost:e,apiKey:t,projectId:o}){let[a,r]=Ke({loading:!1,notConfigured:!1,error:null,result:null});return je(()=>{if(!o||!t||!e){r({notConfigured:!0,loading:!1,error:null,result:null});return}(async()=>{r({notConfigured:!1,loading:!0,error:null,result:null});try{let i=(await new Je({projectId:o,apiKey:t,apiHost:e}).get()).dimensions.map(d=>({...d,displayName:Ye(d)})),l={dimensions:i,dimIndex:de(i,d=>d.dim,d=>d)};r({notConfigured:!1,loading:!1,error:null,result:l})}catch(s){let i;s instanceof Xe?i=s.message:i=s.toString(),r({notConfigured:!1,loading:!1,error:i,result:null});return}})()},[e,t,o]),{result:a.result,error:a.error,loading:a.loading,notConfigured:a.notConfigured}}import{getEnrichmentVectorKey as Y}from"@uniformdev/context";import{Input as Ce,Button as Qe,InputSelect as Ze,Callout as X,Icon as J,LoadingIndicator as et,AddListButton as tt}from"@uniformdev/design-system";import{CgMathPlus as nt,CgMathMinus as ot,CgCloseO as rt}from"react-icons/cg";import ge from"immer";import{css as Q}from"@emotion/react";import{Fragment as ve,jsx as u,jsxs as M}from"@emotion/react/jsx-runtime";var it=Q`
13
13
  flex: 2;
14
14
  display: flex;
15
15
  width: 50%;
@@ -20,7 +20,7 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
20
20
  &:focus {
21
21
  text-decoration-line: underline;
22
22
  }
23
- `,xn=({value:e,setValue:t,contextConfig:o,displayTitle:a=!0})=>{let{loading:r,result:n,error:s}=S(o),i=fe(()=>{if(n)return n.dimensions.filter(b=>b.category==="ENR")},[n]),l=fe(()=>{if(!e)return i;if(i)return i.filter(b=>!e.some(I=>Y(I.cat,I.key)===b.dim))},[i,e]),[d,C]=K(""),[p,m]=K(50),[f,w]=K(!1),g=i==null?void 0:i.find(b=>b.dim===d),y=()=>{let[b,I]=d.split("_");R([...e!=null?e:[],{cat:b,key:I,str:p}]),C(""),m(50),w(!1)},R=b=>{let I=[];n?I=b.filter(O=>{let T=n.dimIndex[Y(O.cat,O.key)];return Boolean(T)}):I=b;let k=I.length===0?null:I;t(k)};return s?u(X,{type:"danger",children:s}):r||n===null?u(et,{}):M("fieldset",{className:"enrichment-tag",children:[a?u("div",{css:{display:"flex",justifyContent:"space-between",marginBottom:"var(--spacing-base)"},children:u("legend",{css:{fontSize:"var(--fs-md)",fontWeight:"var(--fw-bold)"},children:"Enrichment Tags"})}):null,i!=null&&i.length?!f&&!e?u(X,{title:"No enrichment tags assigned.",type:"info",css:{marginBlock:"var(--spacing-base)"},children:M("p",{children:["Click"," ",u("a",{onClick:()=>w(!0),target:"_blank",rel:"noopener noreferrer",css:{textDecorationLine:"underline"},children:"here"})," ","to assign your first enrichment tag."]})}):M(ve,{children:[n&&u(mt,{list:e!=null?e:[],setList:R,dimIndex:n.dimIndex}),f&&l&&l.length>0?M("div",{className:"add-enrichment-tag",css:{display:"flex",flexWrap:"wrap",gap:"var(--spacing-lg)",marginTop:"var(--spacing-md)",alignItems:"center"},children:[u("div",{css:{flexGrow:1},children:u(Ze,{name:"enrichment-type",label:"Enrichment Tag",showLabel:!0,value:d,options:[{label:"Select",value:""},...l.map(b=>({label:b.displayName,value:b.dim}))],onChange:b=>C(b.currentTarget.value)})}),u(lt,{score:p,setValue:m,cap:g?g.cap:100,css:{flexBasis:"9rem"}}),u(Qe,{buttonType:"tertiary",size:"xl",css:{marginBottom:"var(--spacing-xs)",height:"3.5rem",margin:0,alignSelf:"flex-end"},onClick:y,disabled:!d,children:"Add"})]}):null,M("div",{className:"enrichment-cta",style:{paddingTop:"10px",display:"flex",justifyContent:"space-between"},children:[!f&&l&&l.length>0&&e?u(tt,{className:"add-more",buttonText:"Add More",onButtonClick:()=>w(!0)}):u("a",{css:it,title:"none",href:"#"}),u(ce,{name:"Enrichments",linkText:"Manage Enrichments",linkTo:`${o.apiHost}/projects/${encodeURIComponent(o.projectId)}/personalization/enrichments`})]})]}):u(at,{contextConfig:o})]})},at=({contextConfig:e})=>u(X,{title:"No enrichments found.",type:"caution",css:{marginBlock:"var(--spacing-base)"},children:M("p",{children:["Looks like you do not have any enrichment created in your connected Uniform project. Start by creating your first enrichment"," ",u("a",{href:`${e.apiHost}/projects/${encodeURIComponent(e.projectId)}/personalization/enrichments`,target:"_blank",rel:"noopener noreferrer",css:{":hover":{textDecorationLine:"underline"}},children:"here"}),"."]})}),he=(e,t=100,o=0)=>Math.max(Math.min(e,t),o),be=Q`
23
+ `,Dn=({value:e,setValue:t,contextConfig:o,displayTitle:a=!0})=>{let{loading:r,result:n,error:s}=V(o),i=fe(()=>{if(n)return n.dimensions.filter(b=>b.category==="ENR")},[n]),l=fe(()=>{if(!e)return i;if(i)return i.filter(b=>!e.some(I=>Y(I.cat,I.key)===b.dim))},[i,e]),[d,C]=K(""),[p,m]=K(50),[f,w]=K(!1),g=i==null?void 0:i.find(b=>b.dim===d),y=()=>{let[b,I]=d.split("_");R([...e!=null?e:[],{cat:b,key:I,str:p}]),C(""),m(50),w(!1)},R=b=>{let I=[];n?I=b.filter(S=>{let k=n.dimIndex[Y(S.cat,S.key)];return Boolean(k)}):I=b;let T=I.length===0?null:I;t(T)};return s?u(X,{type:"danger",children:s}):r||n===null?u(et,{}):M("fieldset",{className:"enrichment-tag",children:[a?u("div",{css:{display:"flex",justifyContent:"space-between",marginBottom:"var(--spacing-base)"},children:u("legend",{css:{fontSize:"var(--fs-md)",fontWeight:"var(--fw-bold)"},children:"Enrichment Tags"})}):null,i!=null&&i.length?!f&&!e?u(X,{title:"No enrichment tags assigned.",type:"info",css:{marginBlock:"var(--spacing-base)"},children:M("p",{children:["Click"," ",u("a",{onClick:()=>w(!0),target:"_blank",rel:"noopener noreferrer",css:{textDecorationLine:"underline"},children:"here"})," ","to assign your first enrichment tag."]})}):M(ve,{children:[n&&u(mt,{list:e!=null?e:[],setList:R,dimIndex:n.dimIndex}),f&&l&&l.length>0?M("div",{className:"add-enrichment-tag",css:{display:"flex",flexWrap:"wrap",gap:"var(--spacing-lg)",marginTop:"var(--spacing-md)",alignItems:"center"},children:[u("div",{css:{flexGrow:1},children:u(Ze,{name:"enrichment-type",label:"Enrichment Tag",showLabel:!0,value:d,options:[{label:"Select",value:""},...l.map(b=>({label:b.displayName,value:b.dim}))],onChange:b=>C(b.currentTarget.value)})}),u(lt,{score:p,setValue:m,cap:g?g.cap:100,css:{flexBasis:"9rem"}}),u(Qe,{buttonType:"tertiary",size:"xl",css:{marginBottom:"var(--spacing-xs)",height:"3.5rem",margin:0,alignSelf:"flex-end"},onClick:y,disabled:!d,children:"Add"})]}):null,M("div",{className:"enrichment-cta",style:{paddingTop:"10px",display:"flex",justifyContent:"space-between"},children:[!f&&l&&l.length>0&&e?u(tt,{className:"add-more",buttonText:"Add More",onButtonClick:()=>w(!0)}):u("a",{css:it,title:"none",href:"#"}),u(ce,{name:"Enrichments",linkText:"Manage Enrichments",linkTo:`${o.apiHost}/projects/${encodeURIComponent(o.projectId)}/personalization/enrichments`})]})]}):u(at,{contextConfig:o})]})},at=({contextConfig:e})=>u(X,{title:"No enrichments found.",type:"caution",css:{marginBlock:"var(--spacing-base)"},children:M("p",{children:["Looks like you do not have any enrichment created in your connected Uniform project. Start by creating your first enrichment"," ",u("a",{href:`${e.apiHost}/projects/${encodeURIComponent(e.projectId)}/personalization/enrichments`,target:"_blank",rel:"noopener noreferrer",css:{":hover":{textDecorationLine:"underline"}},children:"here"}),"."]})}),he=(e,t=100,o=0)=>Math.max(Math.min(e,t),o),be=Q`
24
24
  position: absolute;
25
25
  bottom: 0.875rem;
26
26
  left: var(--spacing-sm);
@@ -36,15 +36,16 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
36
36
  ${be}
37
37
  left: auto;
38
38
  right: var(--spacing-sm);
39
- `,lt=({score:e,setValue:t,cap:o=100,...a})=>{let r=n=>{let s=n==="increment"?e+10:e-10;s<0&&(s=0),s>o&&(s=o),t(s)};return M("div",{css:{position:"relative"},...a,children:[u(Ce,{label:"Strength",id:"enrichment-score",type:"number",min:0,max:o,value:e,onChange:n=>t(he(Number(n.currentTarget.value)||0,o)),css:{textAlign:"center",boxSizing:"border-box"}}),u("button",{type:"button",title:"Reduce enrichment count",onClick:()=>r("decrement"),disabled:e===0,className:"scoreCounterButton",css:be,children:u(J,{icon:ot,iconColor:"gray",size:"1.5rem"})}),u("button",{type:"button",title:"Increase enrichment count",onClick:()=>r("increment"),className:"scoreCounterButton",css:st,children:u(J,{icon:nt,iconColor:"gray",size:"1.5rem"})})]})},mt=({list:e,setList:t,dimIndex:o})=>{let a=n=>{t(ge(e,s=>{s.splice(n,1)}))},r=(n,s)=>{var l;let i=(l=o[`${e[n].cat}_${e[n].key}`])==null?void 0:l.cap;t(ge(e,d=>{d[n].str=he(Number(s)||0,i)}))};return u(ve,{children:e.map((n,s)=>{let i=o[Y(n.cat,n.key)];if(!!i)return M("div",{css:{display:"flex",alignItems:"center",gap:"var(--spacing-base)",backgroundColor:"var(--brand-secondary-2)",boxShadow:"var(--shadow-base)",borderRadius:"var(--rounded-base)",paddingInline:"var(--spacing-base)",marginBlock:"var(--spacing-base)"},className:"selected-enrichments",children:[u("span",{css:{fontWeight:"var(--fw-bold)",color:i?void 0:"var(--brand-secondary-5)"},children:i?i.displayName:`Enrichment '${n.cat}_${n.key}' is unknown`}),u("div",{css:{marginLeft:"auto",display:"flex",alignItems:"center",border:"0 solid var(--gray-400)",borderLeftWidth:"1px",borderRightWidth:"1px",padding:"var(--spacing-sm) var(--spacing-base)",flexBasis:"9rem"},children:u(Ce,{type:"text",min:0,max:i.cap||100,title:"score",value:n.str,css:{textAlign:"center",width:"100px"},onChange:l=>r(s,l.currentTarget.value)})}),u("button",{type:"button",title:"Delete enrichment",onClick:()=>a(s),css:{border:0},children:u(J,{icon:rt,iconColor:"red",size:"1.5rem"})})]},`${n.cat}-${n.key}`)})})};import{useState as Bt}from"react";import{LoadingIndicator as Pt,Callout as $e}from"@uniformdev/design-system";import{css as Rt}from"@emotion/react";import{Callout as Ne,InputInlineSelect as Mt,Icon as Et,AddListButton as St,Paragraph as Vt}from"@uniformdev/design-system";import ze from"immer";import{CgCloseO as Ot}from"react-icons/cg";import{css as V}from"@emotion/react";var Z="6rem",ye=V`
39
+ `,lt=({score:e,setValue:t,cap:o=100,...a})=>{let r=n=>{let s=n==="increment"?e+10:e-10;s<0&&(s=0),s>o&&(s=o),t(s)};return M("div",{css:{position:"relative"},...a,children:[u(Ce,{label:"Strength",id:"enrichment-score",type:"number",min:0,max:o,value:e,onChange:n=>t(he(Number(n.currentTarget.value)||0,o)),css:{textAlign:"center",boxSizing:"border-box"}}),u("button",{type:"button",title:"Reduce enrichment count",onClick:()=>r("decrement"),disabled:e===0,className:"scoreCounterButton",css:be,children:u(J,{icon:ot,iconColor:"gray",size:"1.5rem"})}),u("button",{type:"button",title:"Increase enrichment count",onClick:()=>r("increment"),className:"scoreCounterButton",css:st,children:u(J,{icon:nt,iconColor:"gray",size:"1.5rem"})})]})},mt=({list:e,setList:t,dimIndex:o})=>{let a=n=>{t(ge(e,s=>{s.splice(n,1)}))},r=(n,s)=>{var l;let i=(l=o[`${e[n].cat}_${e[n].key}`])==null?void 0:l.cap;t(ge(e,d=>{d[n].str=he(Number(s)||0,i)}))};return u(ve,{children:e.map((n,s)=>{let i=o[Y(n.cat,n.key)];if(!!i)return M("div",{css:{display:"flex",alignItems:"center",gap:"var(--spacing-base)",backgroundColor:"var(--brand-secondary-2)",boxShadow:"var(--shadow-base)",borderRadius:"var(--rounded-base)",paddingInline:"var(--spacing-base)",marginBlock:"var(--spacing-base)"},className:"selected-enrichments",children:[u("span",{css:{fontWeight:"var(--fw-bold)",color:i?void 0:"var(--brand-secondary-5)"},children:i?i.displayName:`Enrichment '${n.cat}_${n.key}' is unknown`}),u("div",{css:{marginLeft:"auto",display:"flex",alignItems:"center",border:"0 solid var(--gray-400)",borderLeftWidth:"1px",borderRightWidth:"1px",padding:"var(--spacing-sm) var(--spacing-base)",flexBasis:"9rem"},children:u(Ce,{type:"text",min:0,max:i.cap||100,title:"score",value:n.str,css:{textAlign:"center",width:"100px"},onChange:l=>r(s,l.currentTarget.value)})}),u("button",{type:"button",title:"Delete enrichment",onClick:()=>a(s),css:{border:0},children:u(J,{icon:rt,iconColor:"red",size:"1.5rem"})})]},`${n.cat}-${n.key}`)})})};import{useState as Pt}from"react";import{LoadingIndicator as Tt,Callout as $e}from"@uniformdev/design-system";import{css as Mt}from"@emotion/react";import{Callout as Ne,InputInlineSelect as Et,Icon as Vt,AddListButton as Ot,Paragraph as St}from"@uniformdev/design-system";import ze from"immer";import{CgCloseO as Bt}from"react-icons/cg";import{css as O}from"@emotion/react";var Z="6rem",ye=O`
40
40
  position: relative;
41
- padding: var(--spacing-base);
41
+ padding: var(--spacing-md) var(--spacing-base);
42
42
  border: 1px solid var(--gray-300);
43
43
  box-shadow: var(--shadow-base);
44
44
  background-color: white;
45
45
  border-radius: var(--rounded-base);
46
46
  margin-top: ${Z};
47
47
  display: flex;
48
+
48
49
  &:before {
49
50
  content: '';
50
51
  display: block;
@@ -55,30 +56,32 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
55
56
  top: -${Z};
56
57
  left: var(--spacing-lg);
57
58
  }
59
+
58
60
  &:first-of-type {
59
61
  margin-top: var(--spacing-md);
60
62
  &:before {
61
63
  display: none;
62
64
  }
63
65
  }
64
- `,xe=V`
66
+ `,xe=O`
65
67
  display: flex;
66
- gap: var(--spacing-xs);
68
+ gap: var(--spacing-base);
67
69
  flex-grow: 1;
68
70
  flex-wrap: wrap;
69
71
  margin-right: var(--spacing-base);
70
- `,N=V`
72
+ `,N=O`
71
73
  width: 100%;
72
74
  display: flex;
73
75
  align-items: stretch;
74
- `,ee=V`
76
+ position: relative;
77
+ `,ee=O`
75
78
  flex: 2;
76
79
  height: 52px;
77
80
  min-width: 200px;
78
- `,De=V`
81
+ `,De=O`
79
82
  flex: 1;
80
83
  min-width: 80px;
81
- `,z=V`
84
+ `,z=O`
82
85
  height: 100%;
83
86
  width: 100%;
84
87
  `;import{InputComboBox as ft}from"@uniformdev/design-system";import{css as ut}from"@emotion/react";import{jsx as ct}from"@emotion/react/jsx-runtime";function L({op:e}){return ct("div",{className:"operation-bubble",css:ut`
@@ -91,6 +94,11 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
91
94
  height: 30px;
92
95
  justify-content: center;
93
96
  font-size: var(--fs-base);
94
- `,children:e})}import{jsx as te,jsxs as dt}from"@emotion/react/jsx-runtime";var Ie=e=>{var l,d;let{data:t,getStyles:o,isDisabled:a,innerRef:r,innerProps:n}=e,[s,i]=(d=(l=t.label)==null?void 0:l.split(":"))!=null?d:[];return dt("div",{css:{...o("option",e),display:"flex",alignItems:"center",gap:"var(--spacing-sm)"},ref:r,"aria-disabled":a,...n,children:[i?te(L,{op:s}):te("div",{css:{width:"20px",height:"20px"}}),te("div",{children:i!=null?i:s})]})};import{jsx as we}from"@emotion/react/jsx-runtime";var Re=e=>{let{data:t,getStyles:o}=e;return we("div",{css:{...o("singleValue",e),width:"max-content"},children:t.label.length===1?we(L,{op:t.label}):t.label})};import{jsx as gt}from"@emotion/react/jsx-runtime";var Me=[{name:"=",description:"equals",value:"="},{name:"\u2260",description:"not equal",value:"!="},{name:">",description:"is greater than",value:">"},{name:"\u2265",description:"is greater than or equal to",value:">="},{name:"<",description:"is less than",value:"<"},{name:"\u2264",description:"is less than or equal to",value:"<="},{name:"has the strongest score",value:"+"},{name:"has the weakest score",value:"-"}];function Ee({onChange:e,value:t,...o}){var a,r;return gt(ft,{...o,value:{label:(r=(a=Me.find(n=>n.value===t))==null?void 0:a.name)!=null?r:t,value:t},options:Me.map(n=>({label:n.description?`${n.name}:${n.description}`:n.name,value:n.value})),styles:{...o.styles,valueContainer:(n,s)=>{var i,l;return{...n,padding:"var(--spacing-sm)",...(l=(i=o.styles)==null?void 0:i.valueContainer)==null?void 0:l.call(i,n,s)}},menu:(n,s)=>{var i,l;return{...n,width:"max-content",...(l=(i=o.styles)==null?void 0:i.menu)==null?void 0:l.call(i,n,s)}},control:(n,s)=>{var i,l;return{...n,border:0,...(l=(i=o.styles)==null?void 0:i.control)==null?void 0:l.call(i,n,s)}},indicatorSeparator:(n,s)=>{var i,l;return{...n,display:"none",...(l=(i=o.styles)==null?void 0:i.indicatorSeparator)==null?void 0:l.call(i,n,s)}}},onChange:n=>{n&&e(n.value)},components:{SingleValue:Re,Option:Ie,...o.components}})}import{InputComboBox as yt}from"@uniformdev/design-system";import{Icon as Ct}from"@uniformdev/design-system";function ne(e){return{label:e.displayName,value:e.dim,isDisabled:!1}}function $(e){if(!e)return"unavailable";let[t]=e.split(":");switch(t.toLowerCase()){case"signal":return"data";case"intent":return"assign";case"audience":return"boy";default:return"user-list"}}function A(e){let t=[],o="";for(let a of e){let[r]=a.displayName.split(":");o!==r&&(t.push({label:r,options:[]}),o=r),t[t.length-1].options.push(ne(a))}return t}import{jsx as oe,jsxs as ht}from"@emotion/react/jsx-runtime";var U=e=>{var r;let{data:t,getStyles:o,className:a}=e;return oe("div",{css:{...o("groupHeading",e),textTransform:"none",fontSize:"var(--font-size-sm)"},className:a,children:ht("small",{css:{color:"var(--gray-500)",display:"flex",alignItems:"center",gap:"var(--spacing-xs)"},children:[oe(Ct,{icon:$((r=t.label)!=null?r:""),iconColor:"currentColor",size:16}),oe("span",{children:t.label})]})})};import{jsx as bt}from"@emotion/react/jsx-runtime";function G({message:e}){return e?bt("div",{css:{position:"absolute",background:"white",borderRadius:"3px",fontSize:"0.8rem",color:"var(--brand-primary-2)",bottom:"calc(var(--spacing-xs) * -1)"},children:e}):null}import{jsx as Se}from"@emotion/react/jsx-runtime";var H=e=>{var p,m;let{data:t,getStyles:o,cx:a,isDisabled:r,isFocused:n,isSelected:s,className:i,innerRef:l,innerProps:d}=e,[,C]=(m=(p=t.label)==null?void 0:p.split(":"))!=null?m:[];return Se("div",{css:o("option",e),className:a({option:!0,"option--is-disabled":r,"option--is-focused":n,"option--is-selected":s},i),ref:l,"aria-disabled":r,...d,children:Se("div",{css:{color:"var(--gray-700)"},children:C!=null?C:t.label})})};import{Icon as vt}from"@uniformdev/design-system";import{jsx as re,jsxs as Ve}from"@emotion/react/jsx-runtime";function Oe({displayName:e}){let[t,o]=e.split(":");return Ve("div",{css:{whiteSpace:"normal",overflow:"hidden"},children:[o?Ve("small",{css:{color:"var(--gray-500)",display:"flex",alignItems:"center",gap:"var(--spacing-xs)"},children:[t?re(vt,{icon:$(t),iconColor:"currentColor",size:16}):null,re("span",{"data-test-id":"dimension-name",children:t})]}):null,re("div",{css:{color:"var(--gray-700)"},"data-test-id":"dimension-value",children:o!=null?o:t})]})}import{jsx as Be}from"@emotion/react/jsx-runtime";var W=e=>{let{data:t,getStyles:o}=e;return Be("div",{css:o("singleValue",e),children:Be(Oe,{displayName:t.label})})};import{Fragment as xt,jsx as Pe,jsxs as Dt}from"@emotion/react/jsx-runtime";function ke({onChange:e,value:t,dimensions:o,errorMessage:a,...r}){return Dt(xt,{children:[Pe(yt,{...r,value:t?ne(t):void 0,options:A(o),styles:{...r.styles,valueContainer:(n,s)=>{var i,l;return{...n,padding:"var(--spacing-sm)",...(l=(i=r.styles)==null?void 0:i.valueContainer)==null?void 0:l.call(i,n,s)}}},onChange:n=>{n&&e(o.find(s=>s.dim===n.value))},components:{Option:H,SingleValue:W,GroupHeading:U,...r.components}}),Pe(G,{message:a})]})}import{InputComboBox as It}from"@uniformdev/design-system";import{useState as wt}from"react";import{Fragment as ie,jsx as _,jsxs as B}from"@emotion/react/jsx-runtime";function Te({onChange:e,criteriaMatch:t,dimensions:o,errorMessage:a,...r}){var d,C;let[n,s]=wt(typeof t.r!="undefined"&&q(t.r)!==null?t.r.toString(10):""),i=t.rDim,l=t.rDim?o.dimIndex[t.rDim]:void 0;return B(ie,{children:[_(It,{...r,inputValue:n,menuShouldScrollIntoView:!0,value:{label:(d=l==null?void 0:l.displayName)!=null?d:i&&!l?`${t.rDim} (unknown)`:"",value:(C=t.rDim)!=null?C:t.r?t.r.toString(10):"",isDisabled:!1},options:[{label:"Enter a numeric score to match, or choose another dimension to match its score",value:"",isDisabled:!0},...A(o.dimensions)],styles:{...r.styles,valueContainer:(p,m)=>{var f,w;return{...p,padding:"var(--spacing-sm)",...(w=(f=r.styles)==null?void 0:f.valueContainer)==null?void 0:w.call(f,p,m)}},option:(p,m)=>{var f,w;return{fontSize:m.isDisabled?"0.8rem":void 0,...(w=(f=r.styles)==null?void 0:f.option)==null?void 0:w.call(f,p,m)}}},onChange:p=>{var m;p&&(e({...t,rDim:(m=p.value)==null?void 0:m.toString(),r:void 0}),s(""))},onInputChange:(p,m)=>{let f=q(p);m.action==="input-change"||m.action==="set-value"?(s(p),(f||p==="")&&e({...t,r:p||void 0,rDim:void 0})):!f&&!q(m.prevInputValue)&&(!p&&t.r?s(t.r.toString()):s(p))},components:{...r.components,Option:H,SingleValue:W,GroupHeading:U},noOptionsMessage:({inputValue:p})=>q(p)?B(ie,{children:[B("div",{children:["Score: ",p]}),_("small",{children:"If you want to match on another dimension\u2019s score instead, clear the score value to search for a dimension."})]}):B(ie,{children:[B("div",{children:["No dimensions match your search \u201C",p,"\u201D"]}),_("small",{children:"If you want to match a literal score, enter a numeric value."})]})}),_(G,{message:a})]})}function q(e){return/^\d+$/.test(e.toString(10))}import{jsx as v,jsxs as ae}from"@emotion/react/jsx-runtime";var Le=({value:e,setValue:t,dimensions:o,onMenuOpen:a,onMenuClose:r,onAddCriteria:n,onRemoveCriteria:s,displayTitle:i=!0,components:l,errors:d={}})=>{let C=e||{crit:[]},p=g=>{t({...C,op:g==="&"?void 0:g})},m=()=>{let g={...C,crit:[...C.crit,{l:"",op:">",r:0}]};t(g),n==null||n(g)},f=(g,y)=>{t(ze(C,R=>{R.crit[y]=g}))},w=g=>{let y=ze(C,b=>{b.crit.splice(g,1)}),R=y.crit.length===0?null:y;t(R),s==null||s(R)};return ae("fieldset",{className:"personalization-criteria",children:[i?l!=null&&l.Title?v(l.Title,{}):v("legend",{css:{fontSize:"var(--fs-md)",fontWeight:"var(--fw-bold)"},children:"Personalize This"}):null,l!=null&&l.CustomVariantName?v(l.CustomVariantName,{}):null,C.crit.length?v("div",{children:C.crit.map((g,y)=>{var I,k,O,T;let R=((I=g.l)==null?void 0:I.length)>0,b=g.op!=="+"&&g.op!=="-";return ae("div",{css:ye,"data-test-id":"criteria-container",children:[ae("div",{css:Rt`
97
+ `,children:e})}import{jsx as te,jsxs as dt}from"@emotion/react/jsx-runtime";var Ie=e=>{var l,d;let{data:t,getStyles:o,isDisabled:a,innerRef:r,innerProps:n}=e,[s,i]=(d=(l=t.label)==null?void 0:l.split(":"))!=null?d:[];return dt("div",{css:{...o("option",e),display:"flex",alignItems:"center",gap:"var(--spacing-sm)"},ref:r,"aria-disabled":a,...n,children:[i?te(L,{op:s}):te("div",{css:{width:"20px",height:"20px"}}),te("div",{children:i!=null?i:s})]})};import{jsx as we}from"@emotion/react/jsx-runtime";var Re=e=>{let{data:t,getStyles:o}=e;return we("div",{css:{...o("singleValue",e),width:"max-content"},children:t.label.length===1?we(L,{op:t.label}):t.label})};import{jsx as gt}from"@emotion/react/jsx-runtime";var Me=[{name:"=",description:"equals",value:"="},{name:"\u2260",description:"not equal",value:"!="},{name:">",description:"is greater than",value:">"},{name:"\u2265",description:"is greater than or equal to",value:">="},{name:"<",description:"is less than",value:"<"},{name:"\u2264",description:"is less than or equal to",value:"<="},{name:"has the strongest score",value:"+"},{name:"has the weakest score",value:"-"}];function Ee({onChange:e,value:t,...o}){var a,r;return gt(ft,{...o,value:{label:(r=(a=Me.find(n=>n.value===t))==null?void 0:a.name)!=null?r:t,value:t},options:Me.map(n=>({label:n.description?`${n.name}:${n.description}`:n.name,value:n.value})),styles:{...o.styles,valueContainer:(n,s)=>{var i,l;return{...n,padding:"var(--spacing-sm)",...(l=(i=o.styles)==null?void 0:i.valueContainer)==null?void 0:l.call(i,n,s)}},menu:(n,s)=>{var i,l;return{...n,width:"max-content",...(l=(i=o.styles)==null?void 0:i.menu)==null?void 0:l.call(i,n,s)}},control:(n,s)=>{var i,l;return{...n,border:0,...(l=(i=o.styles)==null?void 0:i.control)==null?void 0:l.call(i,n,s)}},indicatorSeparator:(n,s)=>{var i,l;return{...n,display:"none",...(l=(i=o.styles)==null?void 0:i.indicatorSeparator)==null?void 0:l.call(i,n,s)}}},onChange:n=>{n&&e(n.value)},components:{SingleValue:Re,Option:Ie,...o.components}})}import{InputComboBox as xt}from"@uniformdev/design-system";import{Icon as Ct}from"@uniformdev/design-system";function ne(e){return{label:e.displayName,value:e.dim,isDisabled:!1}}function $(e){if(!e)return"unavailable";let[t]=e.split(":");switch(t.toLowerCase()){case"signal":return"data";case"intent":return"assign";case"audience":return"boy";default:return"user-list"}}function A(e){let t=[],o="";for(let a of e){let[r]=a.displayName.split(":");o!==r&&(t.push({label:r,options:[]}),o=r),t[t.length-1].options.push(ne(a))}return t}import{jsx as oe,jsxs as ht}from"@emotion/react/jsx-runtime";var U=e=>{var r;let{data:t,getStyles:o,className:a}=e;return oe("div",{css:{...o("groupHeading",e),textTransform:"none",fontSize:"var(--font-size-sm)"},className:a,children:ht("small",{css:{color:"var(--gray-500)",display:"flex",alignItems:"center",gap:"var(--spacing-xs)"},children:[oe(Ct,{icon:$((r=t.label)!=null?r:""),iconColor:"currentColor",size:16}),oe("span",{children:t.label})]})})};import{css as bt}from"@emotion/react";import{jsx as vt}from"@emotion/react/jsx-runtime";function G({message:e}){return e?vt("div",{css:bt`
98
+ color: var(--brand-primary-2);
99
+ font-size: var(--fs-xs);
100
+ position: absolute;
101
+ bottom: calc((var(--spacing-base) * -1) + -2px);
102
+ `,children:e}):null}import{jsx as Ve}from"@emotion/react/jsx-runtime";var H=e=>{var p,m;let{data:t,getStyles:o,cx:a,isDisabled:r,isFocused:n,isSelected:s,className:i,innerRef:l,innerProps:d}=e,[,C]=(m=(p=t.label)==null?void 0:p.split(":"))!=null?m:[];return Ve("div",{css:o("option",e),className:a({option:!0,"option--is-disabled":r,"option--is-focused":n,"option--is-selected":s},i),ref:l,"aria-disabled":r,...d,children:Ve("div",{css:{color:"var(--gray-700)"},children:C!=null?C:t.label})})};import{Icon as yt}from"@uniformdev/design-system";import{jsx as re,jsxs as Oe}from"@emotion/react/jsx-runtime";function Se({displayName:e}){let[t,o]=e.split(":");return Oe("div",{css:{whiteSpace:"normal",overflow:"hidden"},children:[o?Oe("small",{css:{color:"var(--gray-500)",display:"flex",alignItems:"center",gap:"var(--spacing-xs)"},children:[t?re(yt,{icon:$(t),iconColor:"currentColor",size:16}):null,re("span",{"data-test-id":"dimension-name",children:t})]}):null,re("div",{css:{color:"var(--gray-700)"},"data-test-id":"dimension-value",children:o!=null?o:t})]})}import{jsx as Be}from"@emotion/react/jsx-runtime";var W=e=>{let{data:t,getStyles:o}=e;return Be("div",{css:o("singleValue",e),children:Be(Se,{displayName:t.label})})};import{Fragment as Dt,jsx as Pe,jsxs as It}from"@emotion/react/jsx-runtime";function Te({onChange:e,value:t,dimensions:o,errorMessage:a,...r}){return It(Dt,{children:[Pe(xt,{...r,value:t?ne(t):void 0,options:A(o),styles:{...r.styles,valueContainer:(n,s)=>{var i,l;return{...n,padding:"var(--spacing-sm)",...(l=(i=r.styles)==null?void 0:i.valueContainer)==null?void 0:l.call(i,n,s)}}},onChange:n=>{n&&e(o.find(s=>s.dim===n.value))},components:{Option:H,SingleValue:W,GroupHeading:U,...r.components}}),Pe(G,{message:a})]})}import{InputComboBox as wt}from"@uniformdev/design-system";import{useState as Rt}from"react";import{Fragment as ie,jsx as _,jsxs as B}from"@emotion/react/jsx-runtime";function ke({onChange:e,criteriaMatch:t,dimensions:o,errorMessage:a,...r}){var d,C;let[n,s]=Rt(typeof t.r!="undefined"&&q(t.r)!==null?t.r.toString(10):""),i=t.rDim,l=t.rDim?o.dimIndex[t.rDim]:void 0;return B(ie,{children:[_(wt,{...r,inputValue:n,menuShouldScrollIntoView:!0,value:{label:(d=l==null?void 0:l.displayName)!=null?d:i&&!l?`${t.rDim} (unknown)`:"",value:(C=t.rDim)!=null?C:t.r?t.r.toString(10):"",isDisabled:!1},options:[{label:"Enter a numeric score to match, or choose another dimension to match its score",value:"",isDisabled:!0},...A(o.dimensions)],styles:{...r.styles,valueContainer:(p,m)=>{var f,w;return{...p,padding:"var(--spacing-sm)",...(w=(f=r.styles)==null?void 0:f.valueContainer)==null?void 0:w.call(f,p,m)}},option:(p,m)=>{var f,w;return{fontSize:m.isDisabled?"0.8rem":void 0,...(w=(f=r.styles)==null?void 0:f.option)==null?void 0:w.call(f,p,m)}}},onChange:p=>{var m;p&&(e({...t,rDim:(m=p.value)==null?void 0:m.toString(),r:void 0}),s(""))},onInputChange:(p,m)=>{let f=q(p);m.action==="input-change"||m.action==="set-value"?(s(p),(f||p==="")&&e({...t,r:p||void 0,rDim:void 0})):!f&&!q(m.prevInputValue)&&(!p&&t.r?s(t.r.toString()):s(p))},components:{...r.components,Option:H,SingleValue:W,GroupHeading:U},noOptionsMessage:({inputValue:p})=>q(p)?B(ie,{children:[B("div",{children:["Score: ",p]}),_("small",{children:"If you want to match on another dimension\u2019s score instead, clear the score value to search for a dimension."})]}):B(ie,{children:[B("div",{children:["No dimensions match your search \u201C",p,"\u201D"]}),_("small",{children:"If you want to match a literal score, enter a numeric value."})]})}),_(G,{message:a})]})}function q(e){return/^\d+$/.test(e.toString(10))}import{jsx as v,jsxs as ae}from"@emotion/react/jsx-runtime";var Le=({value:e,setValue:t,dimensions:o,onMenuOpen:a,onMenuClose:r,onAddCriteria:n,onRemoveCriteria:s,displayTitle:i=!0,components:l,errors:d={}})=>{let C=e||{crit:[]},p=g=>{t({...C,op:g==="&"?void 0:g})},m=()=>{let g={...C,crit:[...C.crit,{l:"",op:">",r:0}]};t(g),n==null||n(g)},f=(g,y)=>{t(ze(C,R=>{R.crit[y]=g}))},w=g=>{let y=ze(C,b=>{b.crit.splice(g,1)}),R=y.crit.length===0?null:y;t(R),s==null||s(R)};return ae("fieldset",{className:"personalization-criteria",children:[i?l!=null&&l.Title?v(l.Title,{}):v("legend",{css:{fontSize:"var(--fs-md)",fontWeight:"var(--fw-bold)"},children:"Personalize This"}):null,l!=null&&l.CustomVariantName?v(l.CustomVariantName,{}):null,C.crit.length?v("div",{children:C.crit.map((g,y)=>{var I,T,S,k;let R=((I=g.l)==null?void 0:I.length)>0,b=g.op!=="+"&&g.op!=="-";return ae("div",{css:ye,"data-test-id":"criteria-container",children:[ae("div",{css:Mt`
95
103
  ${xe}/* grid-template-columns: minmax(0, 1fr) ${b?"minmax(0, 79px) minmax(0, 1fr)":"minmax(0, 1fr)"} */
96
- `,className:"criteriaItemInner",children:[v("div",{css:[N,ee],className:"criteria-wrapper","data-test-id":"select-criteria",children:v(ke,{errorMessage:(k=d.lhs)==null?void 0:k[y],css:z,styles:{control:x=>({...x,height:"100%"})},dimensions:o.dimensions,onChange:x=>{f({...g,l:x.dim},y)},value:o.dimIndex[g.l],onMenuOpen:a,onMenuClose:r})}),v("div",{css:[N,De],className:"criteria-wrapper","data-test-id":"select-operator",children:v(Ee,{name:`op-${y}`,css:z,styles:{control:x=>({...x,height:"100%"})},value:g.op,onChange:x=>{f(x==="+"||x==="-"?{...g,op:x,r:void 0,rDim:void 0}:{...g,op:x},y)},onMenuOpen:a,onMenuClose:r})}),b?v("div",{css:[N,ee],className:"criteria-wrapper","data-test-id":"select-match-criteria",children:v(Te,{errorMessage:(O=d.rhs)==null?void 0:O[y],css:z,styles:{control:x=>({...x,height:"100%"})},criteriaMatch:g,onChange:x=>{f(x,y)},isDisabled:!R,dimensions:o,onMenuOpen:a,onMenuClose:r})}):null]}),v("button",{type:"button",onClick:()=>w(y),title:"Delete Personalization",css:{backgroundColor:"transparent",backgroundImage:"none",borderWidth:0},"data-test-id":"button-delete",children:v(Et,{icon:Ot,iconColor:"red",size:"1.5rem"})}),y>0?v("div",{className:"criteria-group-operation",css:{position:"absolute",top:"-4rem",transform:"translateX(calc(1.5rem - 50%))"},children:v(Mt,{"data-test-id":"dropdown-button-combine",disabled:y>1,value:(T=C.op)!=null?T:"&",options:[{label:"AND",value:"&"},{label:"OR",value:"|"}],onChange:x=>{p(x.value)}})}):null]},y)})}):v(Ne,{title:"Default variant",type:"info",css:{marginBlock:"var(--spacing-base)"},children:v(Vt,{children:'This personalized variant has no match criteria and will be shown to any visitor that does not match any preceding variants. Ensure that default variants come last in the variant list. Personalize this variant by clicking "Add Criteria" to get started.'})}),o.dimensions.length===0?l!=null&&l.NoDimensionsDefined?v(l.NoDimensionsDefined,{}):v(Ne,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:v("p",{children:"You do not have any dimensions configured."})}):v(St,{"data-test-id":"button-add-criteria",className:"add-more",buttonText:"Add Criteria",onButtonClick:m})]})};import*as D from"yup";import{useAsync as kt}from"react-use";function Xo(e){return Array.isArray(e)&&e.length>0&&e[0].cat!==void 0}function Jo(e){return e.crit!==void 0}function se(e){return e!=="+"&&e!=="-"}import{jsx as P,jsxs as Nt}from"@emotion/react/jsx-runtime";function Tt(e){let t={crit:[]};return e.forEach(o=>{if(!o.path)return;let a=/\[(\d+)\]\.(\w+)/g,r=[...o.path.matchAll(a)][0];if((r==null?void 0:r.length)==3){let n=Number(r[1]),s=r[2];if(t.crit.length>n)t.crit[n]={...t.crit[n],[s]:o.message};else{let i={};i[s]=o.message,t.crit.push(i)}}}),t}async function le(e,t){let o=D.object().shape({l:D.string().required("Please select a dimension").oneOf(t==null?void 0:t.dimensions.map(a=>a.dim),"Selected left-side criteria dimension does not exist"),op:D.string().required(),r:D.mixed().nullable().when(["rDim","op"],{is:(a,r)=>se(r)&&!a,then:D.string().required("Choose a score or dimension")}),rDim:D.string().oneOf(t==null?void 0:t.dimensions.map(a=>a.dim),"Selected right-side criteria dimension does not exist").when(["r","op"],{is:(a,r)=>se(r)&&!a,then:D.string().required("Choose a score or dimension")})},["rDim","r"]);try{await D.object({crit:D.array(o)}).nullable().validate(e,{abortEarly:!1})}catch(a){return Tt(a.inner)}}var lr=({contextConfig:e,value:t,setValue:o,...a})=>{var C,p;let[r,n]=Bt(void 0),{loading:s,result:i,error:l}=S(e);return kt(async()=>{if(t&&i){let m=await le(t,i);n(m)}},[t,i,le]),l?P($e,{type:"danger",children:l}):s||i===null?P(Pt,{}):P(Le,{...a,value:t,setValue:async m=>{let f=await le(m,i);n(f),o(m)},errors:{lhs:(C=r==null?void 0:r.crit)==null?void 0:C.map(m=>m==null?void 0:m.l),rhs:(p=r==null?void 0:r.crit)==null?void 0:p.map(m=>m==null?void 0:m.rDim)},dimensions:i,components:{NoDimensionsDefined:()=>P($e,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:Nt("p",{children:["You do not have any dimensions configured. Create your first"," ",P("a",{href:`${e.apiHost}/projects/${encodeURIComponent(e.projectId)}/personalization/signals`,target:"_blank",rel:"noopener noreferrer",css:{":hover":{textDecorationLine:"underline"}},children:"Dimension"})]})})}})};import{useEffect as zt,useState as Lt}from"react";import{ApiClientError as $t,CachedManifestClient as At}from"@uniformdev/context/api";function F({apiHost:e,apiKey:t,projectId:o}){let[a,r]=Lt({loading:!1,notConfigured:!1,error:null,result:null});return zt(()=>{if(!o||!t||!e){r({notConfigured:!0,loading:!1,error:null,result:null});return}(async()=>{r({notConfigured:!1,loading:!0,error:null,result:null});try{let i=await new At({projectId:o,apiKey:t,apiHost:e}).get({preview:!0});r({notConfigured:!1,loading:!1,error:null,result:i})}catch(s){let i;s instanceof $t?(s.statusCode===403&&(i=`The API key ${t} did not have permissions to fetch the manifest. Ensure Context > Read Drafts permissions are granted.`),i=s.message):i=s.toString(),r({notConfigured:!1,loading:!1,error:i,result:null});return}})()},[e,t,o]),{result:a.result,error:a.error,loading:a.loading,notConfigured:a.notConfigured}}import{LoadingIndicator as Ut}from"@uniformdev/design-system";import{Fragment as Gt,jsx as me}from"@emotion/react/jsx-runtime";function vr({children:e,versionMap:t,contextConfig:o}){let{loading:a,result:r}=F(o);if(a)return me(Ut,{});if(r){let n=t[r.project.ui_version];if(n)return me(n,{})}return me(Gt,{children:e})}import{createContext as Ht,useContext as pe}from"react";import{LoadingIndicator as Wt}from"@uniformdev/design-system";import{Fragment as Ae,jsx as E}from"@emotion/react/jsx-runtime";var j=Ht(null),Br=({loadingComponent:e,errorComponent:t,contextConfig:o,children:a})=>{let r=F(o),n=S(o);return r.error||r.notConfigured?t?E(t,{contextConfig:o,result:r}):E(Ae,{children:"ErrorComponent is not configured"}):n.error||n.notConfigured?t?E(t,{contextConfig:o,result:n}):E(Ae,{children:"ErrorComponent is not configured"}):r.loading||n.loading?e?E(e,{}):E(Wt,{}):E(j.Provider,{value:{manifest:r.result,dimensions:n.result,contextConfig:o},children:a})};function Pr(){let e=pe(j);if(!(e!=null&&e.contextConfig))throw new Error("Not within DataContext! Configuration data is not exist.");return e.contextConfig}function kr(){let e=pe(j);if(!(e!=null&&e.manifest))throw new Error("Not within DataContext! Manifest data is not exist.");return e.manifest}function Tr(){let e=pe(j);if(!(e!=null&&e.dimensions))throw new Error("Not within DataContext! Dimensions data is not exist.");return e.dimensions}import{validate as qt}from"uuid";import{UncachedManifestClient as _t}from"@uniformdev/context/api";var Ue=async e=>{if(!e)return{valid:!1,error:new Error("contextConfig was not defined.")};if(!e.apiHost)return{valid:!1,error:new Error("apiHost was not defined.")};if(!e.apiKey)return{valid:!1,error:new Error("apiKey was not defined.")};if(!qt(e.apiKey)&&!e.projectId)return{valid:!1,error:new Error("projectId is required when using a modern API key.")};let t=new _t({projectId:e.projectId,apiKey:e.apiKey,apiHost:e.apiHost});try{return{valid:!0,result:await t.get({preview:!0})}}catch(o){return{valid:!1,error:o}}};import{useEffect as Ft,useState as jt}from"react";var _r=e=>{let[t,o]=jt({validating:!1,error:void 0}),{apiKey:a,apiHost:r,projectId:n}=e||{};return Ft(()=>{if(!a||!r)return;(async()=>{o({validating:!0,error:void 0});let{error:i,result:l}=await Ue({apiHost:r,apiKey:a,projectId:n});o(i?{error:i,validating:!1}:{error:void 0,validating:!1,result:l})})()},[r,a,n]),{validating:t.validating,error:t.error,result:t.result}};export*from"@uniformdev/design-system";export{Br as ContextData,Te as CriteriaMatchMenu,Ee as CriteriaOperatorMenu,ke as DimensionMenu,Oe as DimensionValue,ce as EditLink,xn as EnrichmentTag,lr as PersonalizationCriteria,Le as PersonalizationCriteriaStatic,vr as ProjectUIVersion,it as addEnrichmentLink,Me as contextCriteriaMenuOperators,Tt as convertErrorsToObj,Xo as isEnrichmentTagData,Jo as isPersonalizationCriteriaData,se as opHasRhs,Pr as useContextConfig,F as useContextData,S as useDimensions,Tr as useDimensionsDataContext,kr as useManifest,_r as useValidateContextConfig,Ue as validateContextConfig};
104
+ `,className:"criteriaItemInner",children:[v("div",{css:[N,ee],className:"criteria-wrapper","data-test-id":"select-criteria",children:v(Te,{errorMessage:(T=d.lhs)==null?void 0:T[y],css:z,styles:{control:x=>({...x,height:"100%"})},dimensions:o.dimensions,onChange:x=>{f({...g,l:x.dim},y)},value:o.dimIndex[g.l],onMenuOpen:a,onMenuClose:r})}),v("div",{css:[N,De],className:"criteria-wrapper","data-test-id":"select-operator",children:v(Ee,{name:`op-${y}`,css:z,styles:{control:x=>({...x,height:"100%"})},value:g.op,onChange:x=>{f(x==="+"||x==="-"?{...g,op:x,r:void 0,rDim:void 0}:{...g,op:x},y)},onMenuOpen:a,onMenuClose:r})}),b?v("div",{css:[N,ee],className:"criteria-wrapper","data-test-id":"select-match-criteria",children:v(ke,{errorMessage:(S=d.rhs)==null?void 0:S[y],css:z,styles:{control:x=>({...x,height:"100%"})},criteriaMatch:g,onChange:x=>{f(x,y)},isDisabled:!R,dimensions:o,onMenuOpen:a,onMenuClose:r})}):null]}),v("button",{type:"button",onClick:()=>w(y),title:"Delete Personalization",css:{backgroundColor:"transparent",backgroundImage:"none",borderWidth:0},"data-test-id":"button-delete",children:v(Vt,{icon:Bt,iconColor:"red",size:"1.5rem"})}),y>0?v("div",{className:"criteria-group-operation",css:{position:"absolute",top:"-4rem",transform:"translateX(calc(1.5rem - 50%))"},children:v(Et,{"data-test-id":"dropdown-button-combine",disabled:y>1,value:(k=C.op)!=null?k:"&",options:[{label:"AND",value:"&"},{label:"OR",value:"|"}],onChange:x=>{p(x.value)}})}):null]},y)})}):v(Ne,{title:"Default variant",type:"info",css:{marginBlock:"var(--spacing-base)"},children:v(St,{children:'This personalized variant has no match criteria and will be shown to any visitor that does not match any preceding variants. Ensure that default variants come last in the variant list. Personalize this variant by clicking "Add Criteria" to get started.'})}),o.dimensions.length===0?l!=null&&l.NoDimensionsDefined?v(l.NoDimensionsDefined,{}):v(Ne,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:v("p",{children:"You do not have any dimensions configured."})}):v(Ot,{"data-test-id":"button-add-criteria",className:"add-more",buttonText:"Add Criteria",onButtonClick:m})]})};import*as D from"yup";import{useAsync as kt}from"react-use";function Qo(e){return Array.isArray(e)&&e.length>0&&e[0].cat!==void 0}function Zo(e){return e.crit!==void 0}function se(e){return e!=="+"&&e!=="-"}import{jsx as P,jsxs as zt}from"@emotion/react/jsx-runtime";function Nt(e){let t={crit:[]};return e.forEach(o=>{if(!o.path)return;let a=/\[(\d+)\]\.(\w+)/g,r=[...o.path.matchAll(a)][0];if((r==null?void 0:r.length)==3){let n=Number(r[1]),s=r[2];if(t.crit.length>n)t.crit[n]={...t.crit[n],[s]:o.message};else{let i={};i[s]=o.message,t.crit.push(i)}}}),t}async function le(e,t){let o=D.object().shape({l:D.string().required("Please select a dimension").oneOf(t==null?void 0:t.dimensions.map(a=>a.dim),"Select a criteria"),op:D.string().required(),r:D.mixed().nullable().when(["rDim","op"],{is:(a,r)=>se(r)&&!a,then:D.string().required("Choose a score or dimension")}),rDim:D.string().oneOf(t==null?void 0:t.dimensions.map(a=>a.dim),"Select a criteria").when(["r","op"],{is:(a,r)=>se(r)&&!a,then:D.string().required("Choose a score or dimension")})},["rDim","r"]);try{await D.object({crit:D.array(o)}).nullable().validate(e,{abortEarly:!1})}catch(a){return Nt(a.inner)}}var pr=({contextConfig:e,value:t,setValue:o,...a})=>{var C,p;let[r,n]=Pt(void 0),{loading:s,result:i,error:l}=V(e);return kt(async()=>{if(t&&i){let m=await le(t,i);n(m)}},[t,i,le]),l?P($e,{type:"danger",children:l}):s||i===null?P(Tt,{}):P(Le,{...a,value:t,setValue:async m=>{let f=await le(m,i);n(f),o(m)},errors:{lhs:(C=r==null?void 0:r.crit)==null?void 0:C.map(m=>m==null?void 0:m.l),rhs:(p=r==null?void 0:r.crit)==null?void 0:p.map(m=>m==null?void 0:m.rDim)},dimensions:i,components:{NoDimensionsDefined:()=>P($e,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:zt("p",{children:["You do not have any dimensions configured. Create your first"," ",P("a",{href:`${e.apiHost}/projects/${encodeURIComponent(e.projectId)}/personalization/signals`,target:"_blank",rel:"noopener noreferrer",css:{":hover":{textDecorationLine:"underline"}},children:"Dimension"})]})})}})};import{useEffect as Lt,useState as $t}from"react";import{ApiClientError as At,CachedManifestClient as Ut}from"@uniformdev/context/api";function F({apiHost:e,apiKey:t,projectId:o}){let[a,r]=$t({loading:!1,notConfigured:!1,error:null,result:null});return Lt(()=>{if(!o||!t||!e){r({notConfigured:!0,loading:!1,error:null,result:null});return}(async()=>{r({notConfigured:!1,loading:!0,error:null,result:null});try{let i=await new Ut({projectId:o,apiKey:t,apiHost:e}).get({preview:!0});r({notConfigured:!1,loading:!1,error:null,result:i})}catch(s){let i;s instanceof At?(s.statusCode===403&&(i=`The API key ${t} did not have permissions to fetch the manifest. Ensure Context > Read Drafts permissions are granted.`),i=s.message):i=s.toString(),r({notConfigured:!1,loading:!1,error:i,result:null});return}})()},[e,t,o]),{result:a.result,error:a.error,loading:a.loading,notConfigured:a.notConfigured}}import{LoadingIndicator as Gt}from"@uniformdev/design-system";import{Fragment as Ht,jsx as me}from"@emotion/react/jsx-runtime";function xr({children:e,versionMap:t,contextConfig:o}){let{loading:a,result:r}=F(o);if(a)return me(Gt,{});if(r){let n=t[r.project.ui_version];if(n)return me(n,{})}return me(Ht,{children:e})}import{createContext as Wt,useContext as pe}from"react";import{LoadingIndicator as qt}from"@uniformdev/design-system";import{Fragment as Ae,jsx as E}from"@emotion/react/jsx-runtime";var j=Wt(null),Tr=({loadingComponent:e,errorComponent:t,contextConfig:o,children:a})=>{let r=F(o),n=V(o);return r.error||r.notConfigured?t?E(t,{contextConfig:o,result:r}):E(Ae,{children:"ErrorComponent is not configured"}):n.error||n.notConfigured?t?E(t,{contextConfig:o,result:n}):E(Ae,{children:"ErrorComponent is not configured"}):r.loading||n.loading?e?E(e,{}):E(qt,{}):E(j.Provider,{value:{manifest:r.result,dimensions:n.result,contextConfig:o},children:a})};function kr(){let e=pe(j);if(!(e!=null&&e.contextConfig))throw new Error("Not within DataContext! Configuration data is not exist.");return e.contextConfig}function Nr(){let e=pe(j);if(!(e!=null&&e.manifest))throw new Error("Not within DataContext! Manifest data is not exist.");return e.manifest}function zr(){let e=pe(j);if(!(e!=null&&e.dimensions))throw new Error("Not within DataContext! Dimensions data is not exist.");return e.dimensions}import{validate as _t}from"uuid";import{UncachedManifestClient as Ft}from"@uniformdev/context/api";var Ue=async e=>{if(!e)return{valid:!1,error:new Error("contextConfig was not defined.")};if(!e.apiHost)return{valid:!1,error:new Error("apiHost was not defined.")};if(!e.apiKey)return{valid:!1,error:new Error("apiKey was not defined.")};if(!_t(e.apiKey)&&!e.projectId)return{valid:!1,error:new Error("projectId is required when using a modern API key.")};let t=new Ft({projectId:e.projectId,apiKey:e.apiKey,apiHost:e.apiHost});try{return{valid:!0,result:await t.get({preview:!0})}}catch(o){return{valid:!1,error:o}}};import{useEffect as jt,useState as Kt}from"react";var jr=e=>{let[t,o]=Kt({validating:!1,error:void 0}),{apiKey:a,apiHost:r,projectId:n}=e||{};return jt(()=>{if(!a||!r)return;(async()=>{o({validating:!0,error:void 0});let{error:i,result:l}=await Ue({apiHost:r,apiKey:a,projectId:n});o(i?{error:i,validating:!1}:{error:void 0,validating:!1,result:l})})()},[r,a,n]),{validating:t.validating,error:t.error,result:t.result}};export*from"@uniformdev/design-system";export{Tr as ContextData,ke as CriteriaMatchMenu,Ee as CriteriaOperatorMenu,Te as DimensionMenu,Se as DimensionValue,ce as EditLink,Dn as EnrichmentTag,pr as PersonalizationCriteria,Le as PersonalizationCriteriaStatic,xr as ProjectUIVersion,it as addEnrichmentLink,Me as contextCriteriaMenuOperators,Nt as convertErrorsToObj,Qo as isEnrichmentTagData,Zo as isPersonalizationCriteriaData,se as opHasRhs,kr as useContextConfig,F as useContextData,V as useDimensions,zr as useDimensionsDataContext,Nr as useManifest,jr as useValidateContextConfig,Ue as validateContextConfig};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uniformdev/context-ui",
3
- "version": "17.4.1-alpha.37+64ffa66b1",
3
+ "version": "17.5.0",
4
4
  "description": "React-based functionality and components for Uniform Context",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "main": "./dist/index.js",
@@ -30,13 +30,13 @@
30
30
  "deploy:netlify": "tsx ../../scripts/deploy-to-netlify.ts"
31
31
  },
32
32
  "dependencies": {
33
- "@emotion/react": "11.10.4",
34
- "@uniformdev/context": "^17.4.1-alpha.37+64ffa66b1",
35
- "@uniformdev/design-system": "^17.4.1-alpha.37+64ffa66b1",
33
+ "@emotion/react": "11.10.5",
34
+ "@uniformdev/context": "^17.5.0",
35
+ "@uniformdev/design-system": "^17.5.0",
36
36
  "immer": "9.0.16",
37
37
  "react-beautiful-dnd": "13.1.1",
38
38
  "react-icons": "^4.3.1",
39
- "react-select": "5.5.4",
39
+ "react-select": "5.6.0",
40
40
  "react-use": "17.4.0",
41
41
  "reakit": "1.3.11",
42
42
  "timeago.js": "4.0.2",
@@ -52,16 +52,16 @@
52
52
  "@babel/preset-env": "7.19.4",
53
53
  "@babel/preset-react": "7.18.6",
54
54
  "@emotion/babel-preset-css-prop": "11.10.0",
55
- "@storybook/addon-controls": "6.5.12",
56
- "@storybook/addon-essentials": "6.5.12",
55
+ "@storybook/addon-controls": "6.5.13",
56
+ "@storybook/addon-essentials": "6.5.13",
57
57
  "@storybook/addon-postcss": "2.0.0",
58
- "@storybook/builder-webpack5": "6.5.12",
59
- "@storybook/manager-webpack5": "6.5.12",
60
- "@storybook/react": "6.5.12",
61
- "@types/react": "18.0.23",
58
+ "@storybook/builder-webpack5": "6.5.13",
59
+ "@storybook/manager-webpack5": "6.5.13",
60
+ "@storybook/react": "6.5.13",
61
+ "@types/react": "18.0.25",
62
62
  "@types/react-beautiful-dnd": "13.1.2",
63
63
  "@types/uuid": "8.3.4",
64
- "autoprefixer": "10.4.12",
64
+ "autoprefixer": "10.4.13",
65
65
  "postcss": "8.4.18",
66
66
  "postcss-import": "15.0.0",
67
67
  "react": "18.2.0",
@@ -74,5 +74,5 @@
74
74
  "publishConfig": {
75
75
  "access": "public"
76
76
  },
77
- "gitHead": "64ffa66b143c02fe53de41c020866b72873a4457"
77
+ "gitHead": "de1f52defe798010336e1dd3b2732fce359855fb"
78
78
  }