@uniformdev/context-ui 17.5.1-alpha.105 → 17.5.1-alpha.130

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.d.ts CHANGED
@@ -1,18 +1,22 @@
1
1
  import * as _emotion_react_types_jsx_namespace from '@emotion/react/types/jsx-namespace';
2
- import * as _emotion_react from '@emotion/react';
3
- import React, { ReactElement, ComponentType } from 'react';
4
- import { DimensionDefinition, ManifestGetResponse } from '@uniformdev/context/api';
5
- import { EnrichmentData, VariantMatchCriteria, DimensionMatch } from '@uniformdev/context';
6
- import * as yup from 'yup';
2
+ import { DimensionMatch, EnrichmentData, VariantMatchCriteria } from '@uniformdev/context';
7
3
  import { InputComboBoxProps, InputComboBoxOption } from '@uniformdev/design-system';
8
4
  export * from '@uniformdev/design-system';
5
+ import { DimensionDefinition, ManifestGetResponse } from '@uniformdev/context/api';
6
+ import React, { ComponentType, ReactElement } from 'react';
7
+ import * as _emotion_react from '@emotion/react';
8
+ import * as yup from 'yup';
9
9
 
10
- declare type EditLinkProps = {
11
- linkTo: string;
12
- name?: string;
13
- linkText?: string;
14
- };
15
- declare const EditLink: ({ linkTo, name, linkText }: EditLinkProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
10
+ declare type CriteriaOperatorMenuProps = {
11
+ value: DimensionMatch['op'];
12
+ onChange: (newValue: DimensionMatch['op']) => void;
13
+ } & Omit<InputComboBoxProps<InputComboBoxOption, false>, 'value' | 'options' | 'onChange'>;
14
+ declare const contextCriteriaMenuOperators: Array<{
15
+ name: string;
16
+ description?: string;
17
+ value: DimensionMatch['op'];
18
+ }>;
19
+ declare function CriteriaOperatorMenu({ onChange, value, ...props }: CriteriaOperatorMenuProps): _emotion_react_types_jsx_namespace.EmotionJSX.Element;
16
20
 
17
21
  interface ContextConfig {
18
22
  projectId?: string;
@@ -27,52 +31,6 @@ declare type ResolvedDimensionDefinition = DimensionDefinition & {
27
31
  displayName: string;
28
32
  };
29
33
 
30
- declare const addEnrichmentLink: _emotion_react.SerializedStyles;
31
- interface EnrichmentTagProps {
32
- value: EnrichmentData[] | null | undefined;
33
- setValue: (value: EnrichmentData[] | null) => void;
34
- contextConfig: ContextConfig;
35
- displayTitle?: boolean;
36
- }
37
- declare const EnrichmentTag: React.FC<EnrichmentTagProps>;
38
-
39
- interface PersonalizationCriteriaStaticProps {
40
- value: VariantMatchCriteria | null | undefined;
41
- setValue: (value: VariantMatchCriteria | null) => void;
42
- dimensions: DimensionsData;
43
- displayTitle?: boolean;
44
- onMenuOpen?: () => void;
45
- onMenuClose?: () => void;
46
- onAddCriteria?: (value: VariantMatchCriteria) => void;
47
- onRemoveCriteria?: (value: VariantMatchCriteria | null) => void;
48
- components?: {
49
- NoDimensionsDefined?: React.ComponentType;
50
- Title?: React.ComponentType;
51
- CustomVariantName?: React.ComponentType;
52
- };
53
- errors?: {
54
- lhs?: Array<string | undefined>;
55
- rhs?: Array<string | undefined>;
56
- };
57
- }
58
- declare const PersonalizationCriteriaStatic: React.FC<PersonalizationCriteriaStaticProps>;
59
-
60
- declare type ParameterValidationError<TValue> = TValue extends string | number | boolean ? string : {
61
- [key in keyof TValue]: ParameterValidationError<TValue[key]> | undefined;
62
- };
63
- declare function convertErrorsToObj(errors: yup.ValidationError[]): ParameterValidationError<VariantMatchCriteria>;
64
- declare type PersonalizationCriteriaProps = {
65
- contextConfig: ContextConfig;
66
- } & Omit<PersonalizationCriteriaStaticProps, 'dimensions'>;
67
- declare const PersonalizationCriteria: React.FC<PersonalizationCriteriaProps>;
68
-
69
- declare type UIVersionProps = {
70
- versionMap: Record<number, React.ComponentType>;
71
- children?: React.ReactNode;
72
- contextConfig: ContextConfig;
73
- };
74
- declare function ProjectUIVersion({ children, versionMap, contextConfig }: UIVersionProps): ReactElement;
75
-
76
34
  interface UseContextDataResult {
77
35
  result: ManifestGetResponse | null;
78
36
  error: string | null;
@@ -104,16 +62,13 @@ declare function useContextConfig(): ContextConfig;
104
62
  declare function useManifest(): ManifestGetResponse;
105
63
  declare function useDimensionsDataContext(): DimensionsData;
106
64
 
107
- declare type CriteriaOperatorMenuProps = {
108
- value: DimensionMatch['op'];
109
- onChange: (newValue: DimensionMatch['op']) => void;
110
- } & Omit<InputComboBoxProps<InputComboBoxOption, false>, 'value' | 'options' | 'onChange'>;
111
- declare const contextCriteriaMenuOperators: Array<{
112
- name: string;
113
- description?: string;
114
- value: DimensionMatch['op'];
115
- }>;
116
- declare function CriteriaOperatorMenu({ onChange, value, ...props }: CriteriaOperatorMenuProps): _emotion_react_types_jsx_namespace.EmotionJSX.Element;
65
+ declare type CriteriaMatchMenuProps = {
66
+ criteriaMatch: DimensionMatch;
67
+ dimensions: DimensionsData;
68
+ errorMessage?: string;
69
+ onChange: (newCriteria: DimensionMatch) => void;
70
+ } & Omit<InputComboBoxProps<InputComboBoxOption, false>, 'value' | 'options' | 'onChange' | 'inputValue' | 'value' | 'onInputChange'>;
71
+ declare function CriteriaMatchMenu({ onChange, criteriaMatch, dimensions, errorMessage, ...props }: CriteriaMatchMenuProps): _emotion_react_types_jsx_namespace.EmotionJSX.Element;
117
72
 
118
73
  declare type DimensionMenuProps = {
119
74
  value?: ResolvedDimensionDefinition;
@@ -123,24 +78,63 @@ declare type DimensionMenuProps = {
123
78
  } & Omit<InputComboBoxProps<InputComboBoxOption, false>, 'value' | 'options' | 'onChange'>;
124
79
  declare function DimensionMenu({ onChange, value, dimensions, errorMessage, ...props }: DimensionMenuProps): _emotion_react_types_jsx_namespace.EmotionJSX.Element;
125
80
 
126
- declare type CriteriaMatchMenuProps = {
127
- criteriaMatch: DimensionMatch;
128
- dimensions: DimensionsData;
129
- errorMessage?: string;
130
- onChange: (newCriteria: DimensionMatch) => void;
131
- } & Omit<InputComboBoxProps<InputComboBoxOption, false>, 'value' | 'options' | 'onChange' | 'inputValue' | 'value' | 'onInputChange'>;
132
- declare function CriteriaMatchMenu({ onChange, criteriaMatch, dimensions, errorMessage, ...props }: CriteriaMatchMenuProps): _emotion_react_types_jsx_namespace.EmotionJSX.Element;
133
-
134
81
  declare type DimensionValueProps = {
135
82
  displayName: string;
136
83
  };
137
84
  declare function DimensionValue({ displayName }: DimensionValueProps): _emotion_react_types_jsx_namespace.EmotionJSX.Element;
138
85
 
139
- declare const validateContextConfig: (contextConfig?: ContextConfig) => Promise<{
140
- valid: boolean;
141
- error?: Error;
142
- result?: ManifestGetResponse;
143
- }>;
86
+ declare type EditLinkProps = {
87
+ linkTo: string;
88
+ name?: string;
89
+ linkText?: string;
90
+ };
91
+ declare const EditLink: ({ linkTo, name, linkText }: EditLinkProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
92
+
93
+ declare const addEnrichmentLink: _emotion_react.SerializedStyles;
94
+ interface EnrichmentTagProps {
95
+ value: EnrichmentData[] | null | undefined;
96
+ setValue: (value: EnrichmentData[] | null) => void;
97
+ contextConfig: ContextConfig;
98
+ displayTitle?: boolean;
99
+ }
100
+ declare const EnrichmentTag: React.FC<EnrichmentTagProps>;
101
+
102
+ interface PersonalizationCriteriaStaticProps {
103
+ value: VariantMatchCriteria | null | undefined;
104
+ setValue: (value: VariantMatchCriteria | null) => void;
105
+ dimensions: DimensionsData;
106
+ displayTitle?: boolean;
107
+ onMenuOpen?: () => void;
108
+ onMenuClose?: () => void;
109
+ onAddCriteria?: (value: VariantMatchCriteria) => void;
110
+ onRemoveCriteria?: (value: VariantMatchCriteria | null) => void;
111
+ components?: {
112
+ NoDimensionsDefined?: React.ComponentType;
113
+ Title?: React.ComponentType;
114
+ CustomVariantName?: React.ComponentType;
115
+ };
116
+ errors?: {
117
+ lhs?: Array<string | undefined>;
118
+ rhs?: Array<string | undefined>;
119
+ };
120
+ }
121
+ declare const PersonalizationCriteriaStatic: React.FC<PersonalizationCriteriaStaticProps>;
122
+
123
+ declare type ParameterValidationError<TValue> = TValue extends string | number | boolean ? string : {
124
+ [key in keyof TValue]: ParameterValidationError<TValue[key]> | undefined;
125
+ };
126
+ declare function convertErrorsToObj(errors: yup.ValidationError[]): ParameterValidationError<VariantMatchCriteria>;
127
+ declare type PersonalizationCriteriaProps = {
128
+ contextConfig: ContextConfig;
129
+ } & Omit<PersonalizationCriteriaStaticProps, 'dimensions'>;
130
+ declare const PersonalizationCriteria: React.FC<PersonalizationCriteriaProps>;
131
+
132
+ declare type UIVersionProps = {
133
+ versionMap: Record<number, React.ComponentType>;
134
+ children?: React.ReactNode;
135
+ contextConfig: ContextConfig;
136
+ };
137
+ declare function ProjectUIVersion({ children, versionMap, contextConfig }: UIVersionProps): ReactElement;
144
138
 
145
139
  interface UseValidateContextConfigResult {
146
140
  validating: boolean;
@@ -153,4 +147,10 @@ declare function isEnrichmentTagData(obj: any): obj is EnrichmentData[];
153
147
  declare function isPersonalizationCriteriaData(obj: any): obj is VariantMatchCriteria;
154
148
  declare function opHasRhs(op: string): boolean;
155
149
 
150
+ declare const validateContextConfig: (contextConfig?: ContextConfig) => Promise<{
151
+ valid: boolean;
152
+ error?: Error;
153
+ result?: ManifestGetResponse;
154
+ }>;
155
+
156
156
  export { ContextConfig, ContextData, ContextDataProps, CriteriaMatchMenu, CriteriaMatchMenuProps, CriteriaOperatorMenu, CriteriaOperatorMenuProps, DataContextErrorProps, DimensionMenu, DimensionMenuProps, DimensionValue, DimensionValueProps, DimensionsData, EditLink, EditLinkProps, EnrichmentTag, EnrichmentTagProps, PersonalizationCriteria, PersonalizationCriteriaProps, PersonalizationCriteriaStatic, PersonalizationCriteriaStaticProps, ProjectUIVersion, ResolvedDimensionDefinition, UseContextDataResult, UseDimensionsResult, UseValidateContextConfigResult, addEnrichmentLink, contextCriteriaMenuOperators, convertErrorsToObj, isEnrichmentTagData, isPersonalizationCriteriaData, opHasRhs, useContextConfig, useContextData, useDimensions, useDimensionsDataContext, useManifest, useValidateContextConfig, validateContextConfig };
package/dist/index.esm.js CHANGED
@@ -1,4 +1,19 @@
1
- import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}from"@uniformdev/design-system";import{CgChevronRight as qe}from"react-icons/cg";import{css as Ge}from"@emotion/react";var ue=Ge`
1
+ import{jsx as c}from"@emotion/react";import*as h from"react";import{InputComboBox as qe}from"@uniformdev/design-system";import{css as Ge}from"@emotion/react";import{jsx as He}from"@emotion/react/jsx-runtime";function N({op:e}){return He("div",{className:"operation-bubble",css:Ge`
2
+ align-items: center;
3
+ background: var(--gray-700);
4
+ border-radius: var(--rounded-full);
5
+ color: var(--white);
6
+ display: flex;
7
+ width: 30px;
8
+ height: 30px;
9
+ justify-content: center;
10
+ font-size: var(--fs-base);
11
+ `,children:e})}import{jsx as K,jsxs as We}from"@emotion/react/jsx-runtime";var ue=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 We("div",{css:{...o("option",e),display:"flex",alignItems:"center",gap:"var(--spacing-sm)"},ref:r,"aria-disabled":a,...n,children:[i?K(N,{op:s}):K("div",{css:{width:"20px",height:"20px"}}),K("div",{children:i!=null?i:s})]})};import{jsx as ce}from"@emotion/react/jsx-runtime";var de=e=>{let{data:t,getStyles:o}=e;return ce("div",{css:{...o("singleValue",e),width:"max-content"},children:t.label.length===1?ce(N,{op:t.label}):t.label})};import{jsx as _e}from"@emotion/react/jsx-runtime";var fe=[{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 ge({onChange:e,value:t,...o}){var a,r;return _e(qe,{...o,value:{label:(r=(a=fe.find(n=>n.value===t))==null?void 0:a.name)!=null?r:t,value:t},options:fe.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:de,Option:ue,...o.components}})}import{LoadingIndicator as tt}from"@uniformdev/design-system";import{createContext as nt,useContext as Y}from"react";import{ApiClientError as Fe,CachedManifestClient as je}from"@uniformdev/context/api";import{useEffect as Ke,useState as Ye}from"react";function z({apiHost:e,apiKey:t,projectId:o}){let[a,r]=Ye({loading:!1,notConfigured:!1,error:null,result:null});return Ke(()=>{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({preview:!0});r({notConfigured:!1,loading:!1,error:null,result:i})}catch(s){let i;s instanceof Fe?(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{ApiClientError as Xe,CachedDimensionClient as Je,computeDimensionDisplayName as Qe}from"@uniformdev/context/api";import{useEffect as Ze,useState as et}from"react";function Ce(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]=et({loading:!1,notConfigured:!1,error:null,result:null});return Ze(()=>{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:Qe(d)})),l={dimensions:i,dimIndex:Ce(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{Fragment as he,jsx as E}from"@emotion/react/jsx-runtime";var L=nt(null),$n=({loadingComponent:e,errorComponent:t,contextConfig:o,children:a})=>{let r=z(o),n=V(o);return r.error||r.notConfigured?t?E(t,{contextConfig:o,result:r}):E(he,{children:"ErrorComponent is not configured"}):n.error||n.notConfigured?t?E(t,{contextConfig:o,result:n}):E(he,{children:"ErrorComponent is not configured"}):r.loading||n.loading?e?E(e,{}):E(tt,{}):E(L.Provider,{value:{manifest:r.result,dimensions:n.result,contextConfig:o},children:a})};function An(){let e=Y(L);if(!(e!=null&&e.contextConfig))throw new Error("Not within DataContext! Configuration data is not exist.");return e.contextConfig}function Un(){let e=Y(L);if(!(e!=null&&e.manifest))throw new Error("Not within DataContext! Manifest data is not exist.");return e.manifest}function Gn(){let e=Y(L);if(!(e!=null&&e.dimensions))throw new Error("Not within DataContext! Dimensions data is not exist.");return e.dimensions}import{InputComboBox as lt}from"@uniformdev/design-system";import{useState as mt}from"react";import{Icon as ot}from"@uniformdev/design-system";function X(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(X(a))}return t}import{jsx as J,jsxs as rt}from"@emotion/react/jsx-runtime";var U=e=>{var r;let{data:t,getStyles:o,className:a}=e;return J("div",{css:{...o("groupHeading",e),textTransform:"none",fontSize:"var(--font-size-sm)"},className:a,children:rt("small",{css:{color:"var(--gray-500)",display:"flex",alignItems:"center",gap:"var(--spacing-xs)"},children:[J(ot,{icon:$((r=t.label)!=null?r:""),iconColor:"currentColor",size:16}),J("span",{children:t.label})]})})};import{css as it}from"@emotion/react";import{jsx as at}from"@emotion/react/jsx-runtime";function G({message:e}){return e?at("div",{css:it`
12
+ color: var(--brand-primary-2);
13
+ font-size: var(--fs-xs);
14
+ position: absolute;
15
+ bottom: calc((var(--spacing-base) * -1) + -2px);
16
+ `,children:e}):null}import{jsx as be}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 be("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:be("div",{css:{color:"var(--gray-700)"},children:C!=null?C:t.label})})};import{Icon as st}from"@uniformdev/design-system";import{jsx as Q,jsxs as ve}from"@emotion/react/jsx-runtime";function ye({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?Q(st,{icon:$(t),iconColor:"currentColor",size:16}):null,Q("span",{"data-test-id":"dimension-name",children:t})]}):null,Q("div",{css:{color:"var(--gray-700)"},"data-test-id":"dimension-value",children:o!=null?o:t})]})}import{jsx as xe}from"@emotion/react/jsx-runtime";var W=e=>{let{data:t,getStyles:o}=e;return xe("div",{css:o("singleValue",e),children:xe(ye,{displayName:t.label})})};import{Fragment as Z,jsx as _,jsxs as B}from"@emotion/react/jsx-runtime";function De({onChange:e,criteriaMatch:t,dimensions:o,errorMessage:a,...r}){var d,C;let[n,s]=mt(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(Z,{children:[_(lt,{...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(Z,{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(Z,{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{InputComboBox as pt}from"@uniformdev/design-system";import{Fragment as ut,jsx as Ie,jsxs as ct}from"@emotion/react/jsx-runtime";function we({onChange:e,value:t,dimensions:o,errorMessage:a,...r}){return ct(ut,{children:[Ie(pt,{...r,value:t?X(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}}),Ie(G,{message:a})]})}import{Icon as gt}from"@uniformdev/design-system";import{CgChevronRight as Ct}from"react-icons/cg";import{css as dt}from"@emotion/react";var Re=dt`
2
17
  display: flex;
3
18
  align-items: center;
4
19
  font-weight: var(--fw-bold);
@@ -9,7 +24,7 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
9
24
  &:focus {
10
25
  text-decoration-line: underline;
11
26
  }
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`
27
+ `;import{jsx as ht,jsxs as bt}from"@emotion/react/jsx-runtime";var Me=({linkTo:e,name:t,linkText:o=`Edit ${t} Component`})=>bt("a",{css:Re,title:`Edit ${t} component definition`,rel:"noopener noreferrer",target:"_blank",href:e,children:[o,ht(gt,{icon:Ct,iconColor:"currentColor",size:"1.5rem"})]});import{css as re}from"@emotion/react";import{getEnrichmentVectorKey as te}from"@uniformdev/context";import{AddListButton as vt,Button as yt,Callout as ne,Icon as oe,Input as Oe,InputSelect as xt,LoadingIndicator as Dt}from"@uniformdev/design-system";import Ee from"immer";import{useMemo as Ve,useState as ee}from"react";import{CgCloseO as It,CgMathMinus as wt,CgMathPlus as Rt}from"react-icons/cg";import{Fragment as Pe,jsx as u,jsxs as M}from"@emotion/react/jsx-runtime";var Mt=re`
13
28
  flex: 2;
14
29
  display: flex;
15
30
  width: 50%;
@@ -20,7 +35,7 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
20
35
  &:focus {
21
36
  text-decoration-line: underline;
22
37
  }
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`
38
+ `,or=({value:e,setValue:t,contextConfig:o,displayTitle:a=!0})=>{let{loading:r,result:n,error:s}=V(o),i=Ve(()=>{if(n)return n.dimensions.filter(b=>b.category==="ENR")},[n]),l=Ve(()=>{if(!e)return i;if(i)return i.filter(b=>!e.some(I=>te(I.cat,I.key)===b.dim))},[i,e]),[d,C]=ee(""),[p,m]=ee(50),[f,w]=ee(!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[te(S.cat,S.key)];return Boolean(k)}):I=b;let T=I.length===0?null:I;t(T)};return s?u(ne,{type:"danger",children:s}):r||n===null?u(Dt,{}):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(ne,{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(Pe,{children:[n&&u(St,{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(xt,{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(Ot,{score:p,setValue:m,cap:g?g.cap:100,css:{flexBasis:"9rem"}}),u(yt,{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(vt,{className:"add-more",buttonText:"Add More",onButtonClick:()=>w(!0)}):u("a",{css:Mt,title:"none",href:"#"}),u(Me,{name:"Enrichments",linkText:"Manage Enrichments",linkTo:`${o.apiHost}/projects/${encodeURIComponent(o.projectId)}/personalization/enrichments`})]})]}):u(Et,{contextConfig:o})]})},Et=({contextConfig:e})=>u(ne,{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"}),"."]})}),Se=(e,t=100,o=0)=>Math.max(Math.min(e,t),o),Be=re`
24
39
  position: absolute;
25
40
  bottom: 0.875rem;
26
41
  left: var(--spacing-sm);
@@ -32,28 +47,28 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
32
47
  background-color: var(--gray-100);
33
48
  border: 1px solid var(--gray-300);
34
49
  border-radius: var(--rounded-full);
35
- `,st=Q`
36
- ${be}
50
+ `,Vt=re`
51
+ ${Be}
37
52
  left: auto;
38
53
  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 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`
54
+ `,Ot=({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(Oe,{label:"Strength",id:"enrichment-score",type:"number",min:0,max:o,value:e,onChange:n=>t(Se(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(oe,{icon:wt,iconColor:"gray",size:"1.5rem"})}),u("button",{type:"button",title:"Increase enrichment count",onClick:()=>r("increment"),className:"scoreCounterButton",css:Vt,children:u(oe,{icon:Rt,iconColor:"gray",size:"1.5rem"})})]})},St=({list:e,setList:t,dimIndex:o})=>{let a=n=>{t(Ee(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(Ee(e,d=>{d[n].str=Se(Number(s)||0,i)}))};return u(Pe,{children:e.map((n,s)=>{let i=o[te(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(Oe,{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(oe,{icon:It,iconColor:"red",size:"1.5rem"})})]},`${n.cat}-${n.key}`)})})};import{Callout as Ae,LoadingIndicator as $t}from"@uniformdev/design-system";import{useState as At}from"react";import{useAsync as Ut}from"react-use";import*as D from"yup";function sr(e){return Array.isArray(e)&&e.length>0&&e[0].cat!==void 0}function lr(e){return e.crit!==void 0}function ie(e){return e!=="+"&&e!=="-"}import{css as Pt}from"@emotion/react";import{AddListButton as Tt,Callout as ze,Icon as kt,InputInlineSelect as Nt,Paragraph as zt}from"@uniformdev/design-system";import Le from"immer";import{CgCloseO as Lt}from"react-icons/cg";import{css as O}from"@emotion/react";var ae="6rem",Te=O`
40
55
  position: relative;
41
56
  padding: var(--spacing-md) var(--spacing-base);
42
57
  border: 1px solid var(--gray-300);
43
58
  box-shadow: var(--shadow-base);
44
59
  background-color: white;
45
60
  border-radius: var(--rounded-base);
46
- margin-top: ${Z};
61
+ margin-top: ${ae};
47
62
  display: flex;
48
63
 
49
64
  &:before {
50
65
  content: '';
51
66
  display: block;
52
67
  width: 1px;
53
- height: ${Z};
68
+ height: ${ae};
54
69
  background-color: var(--gray-300);
55
70
  position: absolute;
56
- top: -${Z};
71
+ top: -${ae};
57
72
  left: var(--spacing-lg);
58
73
  }
59
74
 
@@ -63,42 +78,27 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
63
78
  display: none;
64
79
  }
65
80
  }
66
- `,xe=O`
81
+ `,ke=O`
67
82
  display: flex;
68
83
  gap: var(--spacing-base);
69
84
  flex-grow: 1;
70
85
  flex-wrap: wrap;
71
86
  margin-right: var(--spacing-base);
72
- `,N=O`
87
+ `,F=O`
73
88
  width: 100%;
74
89
  display: flex;
75
90
  align-items: stretch;
76
91
  position: relative;
77
- `,ee=O`
92
+ `,se=O`
78
93
  flex: 2;
79
94
  height: 52px;
80
95
  min-width: 200px;
81
- `,De=O`
96
+ `,Ne=O`
82
97
  flex: 1;
83
98
  min-width: 80px;
84
- `,z=O`
99
+ `,j=O`
85
100
  height: 100%;
86
101
  width: 100%;
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`
88
- align-items: center;
89
- background: var(--gray-700);
90
- border-radius: var(--rounded-full);
91
- color: var(--white);
92
- display: flex;
93
- width: 30px;
94
- height: 30px;
95
- justify-content: center;
96
- font-size: var(--fs-base);
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`
103
- ${xe}/* grid-template-columns: minmax(0, 1fr) ${b?"minmax(0, 79px) minmax(0, 1fr)":"minmax(0, 1fr)"} */
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};
102
+ `;import{jsx as v,jsxs as le}from"@emotion/react/jsx-runtime";var $e=({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(Le(C,R=>{R.crit[y]=g}))},w=g=>{let y=Le(C,b=>{b.crit.splice(g,1)}),R=y.crit.length===0?null:y;t(R),s==null||s(R)};return le("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 le("div",{css:Te,"data-test-id":"criteria-container",children:[le("div",{css:Pt`
103
+ ${ke}/* grid-template-columns: minmax(0, 1fr) ${b?"minmax(0, 79px) minmax(0, 1fr)":"minmax(0, 1fr)"} */
104
+ `,className:"criteriaItemInner",children:[v("div",{css:[F,se],className:"criteria-wrapper","data-test-id":"select-criteria",children:v(we,{errorMessage:(T=d.lhs)==null?void 0:T[y],css:j,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:[F,Ne],className:"criteria-wrapper","data-test-id":"select-operator",children:v(ge,{name:`op-${y}`,css:j,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:[F,se],className:"criteria-wrapper","data-test-id":"select-match-criteria",children:v(De,{errorMessage:(S=d.rhs)==null?void 0:S[y],css:j,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(kt,{icon:Lt,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(Nt,{"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(ze,{title:"Default variant",type:"info",css:{marginBlock:"var(--spacing-base)"},children:v(zt,{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(ze,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:v("p",{children:"You do not have any dimensions configured."})}):v(Tt,{"data-test-id":"button-add-criteria",className:"add-more",buttonText:"Add Criteria",onButtonClick:m})]})};import{jsx as P,jsxs as Ht}from"@emotion/react/jsx-runtime";function Gt(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 me(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)=>ie(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)=>ie(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 Gt(a.inner)}}var Sr=({contextConfig:e,value:t,setValue:o,...a})=>{var C,p;let[r,n]=At(void 0),{loading:s,result:i,error:l}=V(e);return Ut(async()=>{if(t&&i){let m=await me(t,i);n(m)}},[t,i,me]),l?P(Ae,{type:"danger",children:l}):s||i===null?P($t,{}):P($e,{...a,value:t,setValue:async m=>{let f=await me(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(Ae,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:Ht("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{LoadingIndicator as Wt}from"@uniformdev/design-system";import{Fragment as qt,jsx as pe}from"@emotion/react/jsx-runtime";function zr({children:e,versionMap:t,contextConfig:o}){let{loading:a,result:r}=z(o);if(a)return pe(Wt,{});if(r){let n=t[r.project.ui_version];if(n)return pe(n,{})}return pe(qt,{children:e})}import{useEffect as jt,useState as Kt}from"react";import{UncachedManifestClient as _t}from"@uniformdev/context/api";import{validate as Ft}from"uuid";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(!Ft(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}}};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{$n as ContextData,De as CriteriaMatchMenu,ge as CriteriaOperatorMenu,we as DimensionMenu,ye as DimensionValue,Me as EditLink,or as EnrichmentTag,Sr as PersonalizationCriteria,$e as PersonalizationCriteriaStatic,zr as ProjectUIVersion,Mt as addEnrichmentLink,fe as contextCriteriaMenuOperators,Gt as convertErrorsToObj,sr as isEnrichmentTagData,lr as isPersonalizationCriteriaData,ie as opHasRhs,An as useContextConfig,z as useContextData,V as useDimensions,Gn as useDimensionsDataContext,Un as useManifest,jr as useValidateContextConfig,Ue as validateContextConfig};
package/dist/index.js CHANGED
@@ -1,4 +1,19 @@
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`
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:()=>yt,CriteriaMatchMenu:()=>we,CriteriaOperatorMenu:()=>ve,DimensionMenu:()=>Re,DimensionValue:()=>De,EditLink:()=>Me,EnrichmentTag:()=>Rt,PersonalizationCriteria:()=>Tt,PersonalizationCriteriaStatic:()=>Be,ProjectUIVersion:()=>kt,addEnrichmentLink:()=>Ze,contextCriteriaMenuOperators:()=>be,convertErrorsToObj:()=>mt,isEnrichmentTagData:()=>St,isPersonalizationCriteriaData:()=>Bt,opHasRhs:()=>de,useContextConfig:()=>xt,useContextData:()=>_,useDimensions:()=>T,useDimensionsDataContext:()=>It,useManifest:()=>Dt,useValidateContextConfig:()=>Nt,validateContextConfig:()=>Te});module.exports=vt(M);var c=require("@emotion/react"),b=J(require("react"));var $e=require("@uniformdev/design-system");var ke=require("@emotion/react"),Ne=require("@emotion/react/jsx-runtime");function Q({op:e}){return(0,Ne.jsx)("div",{className:"operation-bubble",css:ke.css`
2
+ align-items: center;
3
+ background: var(--gray-700);
4
+ border-radius: var(--rounded-full);
5
+ color: var(--white);
6
+ display: flex;
7
+ width: 30px;
8
+ height: 30px;
9
+ justify-content: center;
10
+ font-size: var(--fs-base);
11
+ `,children:e})}var $=require("@emotion/react/jsx-runtime"),ze=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,$.jsxs)("div",{css:{...n("option",e),display:"flex",alignItems:"center",gap:"var(--spacing-sm)"},ref:r,"aria-disabled":a,...o,children:[i?(0,$.jsx)(Q,{op:s}):(0,$.jsx)("div",{css:{width:"20px",height:"20px"}}),(0,$.jsx)("div",{children:i!=null?i:s})]})};var he=require("@emotion/react/jsx-runtime"),Le=e=>{let{data:t,getStyles:n}=e;return(0,he.jsx)("div",{css:{...n("singleValue",e),width:"max-content"},children:t.label.length===1?(0,he.jsx)(Q,{op:t.label}):t.label})};var Ae=require("@emotion/react/jsx-runtime"),be=[{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 ve({onChange:e,value:t,...n}){var a,r;return(0,Ae.jsx)($e.InputComboBox,{...n,value:{label:(r=(a=be.find(o=>o.value===t))==null?void 0:a.name)!=null?r:t,value:t},options:be.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:Le,Option:ze,...n.components}})}var Ge=require("@uniformdev/design-system"),U=require("react");var Z=require("@uniformdev/context/api"),ee=require("react");function _({apiHost:e,apiKey:t,projectId:n}){let[a,r]=(0,ee.useState)({loading:!1,notConfigured:!1,error:null,result:null});return(0,ee.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 Z.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 Z.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 A=require("@uniformdev/context/api"),te=require("react");function Ue(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,te.useState)({loading:!1,notConfigured:!1,error:null,result:null});return(0,te.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 A.CachedDimensionClient({projectId:n,apiKey:t,apiHost:e}).get()).dimensions.map(d=>({...d,displayName:(0,A.computeDimensionDisplayName)(d)})),l={dimensions:i,dimIndex:Ue(i,d=>d.dim,d=>d)};r({notConfigured:!1,loading:!1,error:null,result:l})}catch(s){let i;s instanceof A.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 O=require("@emotion/react/jsx-runtime"),ne=(0,U.createContext)(null),yt=({loadingComponent:e,errorComponent:t,contextConfig:n,children:a})=>{let r=_(n),o=T(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)(Ge.LoadingIndicator,{}):(0,O.jsx)(ne.Provider,{value:{manifest:r.result,dimensions:o.result,contextConfig:n},children:a})};function xt(){let e=(0,U.useContext)(ne);if(!(e!=null&&e.contextConfig))throw new Error("Not within DataContext! Configuration data is not exist.");return e.contextConfig}function Dt(){let e=(0,U.useContext)(ne);if(!(e!=null&&e.manifest))throw new Error("Not within DataContext! Manifest data is not exist.");return e.manifest}function It(){let e=(0,U.useContext)(ne);if(!(e!=null&&e.dimensions))throw new Error("Not within DataContext! Dimensions data is not exist.");return e.dimensions}var Fe=require("@uniformdev/design-system"),je=require("react");var He=require("@uniformdev/design-system");function ye(e){return{label:e.displayName,value:e.dim,isDisabled:!1}}function oe(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 re(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(ye(a))}return t}var G=require("@emotion/react/jsx-runtime"),ie=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)(He.Icon,{icon:oe((r=t.label)!=null?r:""),iconColor:"currentColor",size:16}),(0,G.jsx)("span",{children:t.label})]})})};var We=require("@emotion/react"),qe=require("@emotion/react/jsx-runtime");function ae({message:e}){return e?(0,qe.jsx)("div",{css:We.css`
12
+ color: var(--brand-primary-2);
13
+ font-size: var(--fs-xs);
14
+ position: absolute;
15
+ bottom: calc((var(--spacing-base) * -1) + -2px);
16
+ `,children:e}):null}var xe=require("@emotion/react/jsx-runtime"),se=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,xe.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,xe.jsx)("div",{css:{color:"var(--gray-700)"},children:h!=null?h:t.label})})};var _e=require("@uniformdev/design-system");var k=require("@emotion/react/jsx-runtime");function De({displayName:e}){let[t,n]=e.split(":");return(0,k.jsxs)("div",{css:{whiteSpace:"normal",overflow:"hidden"},children:[n?(0,k.jsxs)("small",{css:{color:"var(--gray-500)",display:"flex",alignItems:"center",gap:"var(--spacing-xs)"},children:[t?(0,k.jsx)(_e.Icon,{icon:oe(t),iconColor:"currentColor",size:16}):null,(0,k.jsx)("span",{"data-test-id":"dimension-name",children:t})]}):null,(0,k.jsx)("div",{css:{color:"var(--gray-700)"},"data-test-id":"dimension-value",children:n!=null?n:t})]})}var Ie=require("@emotion/react/jsx-runtime"),le=e=>{let{data:t,getStyles:n}=e;return(0,Ie.jsx)("div",{css:n("singleValue",e),children:(0,Ie.jsx)(De,{displayName:t.label})})};var I=require("@emotion/react/jsx-runtime");function we({onChange:e,criteriaMatch:t,dimensions:n,errorMessage:a,...r}){var d,h;let[o,s]=(0,je.useState)(typeof t.r!="undefined"&&me(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)(Fe.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},...re(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=me(u);p.action==="input-change"||p.action==="set-value"?(s(u),(g||u==="")&&e({...t,r:u||void 0,rDim:void 0})):!g&&!me(p.prevInputValue)&&(!u&&t.r?s(t.r.toString()):s(u))},components:{...r.components,Option:se,SingleValue:le,GroupHeading:ie},noOptionsMessage:({inputValue:u})=>me(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)(ae,{message:a})]})}function me(e){return/^\d+$/.test(e.toString(10))}var Ke=require("@uniformdev/design-system");var N=require("@emotion/react/jsx-runtime");function Re({onChange:e,value:t,dimensions:n,errorMessage:a,...r}){return(0,N.jsxs)(N.Fragment,{children:[(0,N.jsx)(Ke.InputComboBox,{...r,value:t?ye(t):void 0,options:re(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:se,SingleValue:le,GroupHeading:ie,...r.components}}),(0,N.jsx)(ae,{message:a})]})}var Je=require("@uniformdev/design-system"),Qe=require("react-icons/cg");var Ye=require("@emotion/react"),Xe=Ye.css`
2
17
  display: flex;
3
18
  align-items: center;
4
19
  font-weight: var(--fw-bold);
@@ -9,7 +24,7 @@
9
24
  &:focus {
10
25
  text-decoration-line: underline;
11
26
  }
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`
27
+ `;var pe=require("@emotion/react/jsx-runtime"),Me=({linkTo:e,name:t,linkText:n=`Edit ${t} Component`})=>(0,pe.jsxs)("a",{css:Xe,title:`Edit ${t} component definition`,rel:"noopener noreferrer",target:"_blank",href:e,children:[n,(0,pe.jsx)(Je.Icon,{icon:Qe.CgChevronRight,iconColor:"currentColor",size:"1.5rem"})]});var ce=require("@emotion/react"),ue=require("@uniformdev/context"),x=require("@uniformdev/design-system"),Ee=J(require("immer")),z=require("react"),H=require("react-icons/cg");var m=require("@emotion/react/jsx-runtime"),Ze=ce.css`
13
28
  flex: 2;
14
29
  display: flex;
15
30
  width: 50%;
@@ -20,7 +35,7 @@
20
35
  &:focus {
21
36
  text-decoration-line: underline;
22
37
  }
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`
38
+ `,Rt=({value:e,setValue:t,contextConfig:n,displayTitle:a=!0})=>{let{loading:r,result:o,error:s}=T(n),i=(0,z.useMemo)(()=>{if(o)return o.dimensions.filter(v=>v.category==="ENR")},[o]),l=(0,z.useMemo)(()=>{if(!e)return i;if(i)return i.filter(v=>!e.some(R=>(0,ue.getEnrichmentVectorKey)(R.cat,R.key)===v.dim))},[i,e]),[d,h]=(0,z.useState)(""),[u,p]=(0,z.useState)(50),[g,E]=(0,z.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,ue.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)(Ot,{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)(Vt,{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:Ze,title:"none",href:"#"}),(0,m.jsx)(Me,{name:"Enrichments",linkText:"Manage Enrichments",linkTo:`${n.apiHost}/projects/${encodeURIComponent(n.projectId)}/personalization/enrichments`})]})]}):(0,m.jsx)(Mt,{contextConfig:n})]})},Mt=({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"}),"."]})}),et=(e,t=100,n=0)=>Math.max(Math.min(e,t),n),tt=ce.css`
24
39
  position: absolute;
25
40
  bottom: 0.875rem;
26
41
  left: var(--spacing-sm);
@@ -32,28 +47,28 @@
32
47
  background-color: var(--gray-100);
33
48
  border: 1px solid var(--gray-300);
34
49
  border-radius: var(--rounded-full);
35
- `,It=te.css`
36
- ${Ge}
50
+ `,Et=ce.css`
51
+ ${tt}
37
52
  left: auto;
38
53
  right: var(--spacing-sm);
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`
54
+ `,Vt=({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(et(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:tt,children:(0,m.jsx)(x.Icon,{icon:H.CgMathMinus,iconColor:"gray",size:"1.5rem"})}),(0,m.jsx)("button",{type:"button",title:"Increase enrichment count",onClick:()=>r("increment"),className:"scoreCounterButton",css:Et,children:(0,m.jsx)(x.Icon,{icon:H.CgMathPlus,iconColor:"gray",size:"1.5rem"})})]})},Ot=({list:e,setList:t,dimIndex:n})=>{let a=o=>{t((0,Ee.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,Ee.default)(e,d=>{d[o].str=et(Number(s)||0,i)}))};return(0,m.jsx)(m.Fragment,{children:e.map((o,s)=>{let i=n[(0,ue.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:H.CgCloseO,iconColor:"red",size:"1.5rem"})})]},`${o.cat}-${o.key}`)})})};var F=require("@uniformdev/design-system"),st=require("react"),lt=require("react-use"),w=J(require("yup"));function St(e){return Array.isArray(e)&&e.length>0&&e[0].cat!==void 0}function Bt(e){return e.crit!==void 0}function de(e){return e!=="+"&&e!=="-"}var it=require("@emotion/react"),S=require("@uniformdev/design-system"),Se=J(require("immer")),at=require("react-icons/cg");var L=require("@emotion/react"),Ve="6rem",nt=L.css`
40
55
  position: relative;
41
56
  padding: var(--spacing-md) var(--spacing-base);
42
57
  border: 1px solid var(--gray-300);
43
58
  box-shadow: var(--shadow-base);
44
59
  background-color: white;
45
60
  border-radius: var(--rounded-base);
46
- margin-top: ${ve};
61
+ margin-top: ${Ve};
47
62
  display: flex;
48
63
 
49
64
  &:before {
50
65
  content: '';
51
66
  display: block;
52
67
  width: 1px;
53
- height: ${ve};
68
+ height: ${Ve};
54
69
  background-color: var(--gray-300);
55
70
  position: absolute;
56
- top: -${ve};
71
+ top: -${Ve};
57
72
  left: var(--spacing-lg);
58
73
  }
59
74
 
@@ -63,42 +78,27 @@
63
78
  display: none;
64
79
  }
65
80
  }
66
- `,We=N.css`
81
+ `,ot=L.css`
67
82
  display: flex;
68
83
  gap: var(--spacing-base);
69
84
  flex-grow: 1;
70
85
  flex-wrap: wrap;
71
86
  margin-right: var(--spacing-base);
72
- `,ne=N.css`
87
+ `,fe=L.css`
73
88
  width: 100%;
74
89
  display: flex;
75
90
  align-items: stretch;
76
91
  position: relative;
77
- `,ye=N.css`
92
+ `,Oe=L.css`
78
93
  flex: 2;
79
94
  height: 52px;
80
95
  min-width: 200px;
81
- `,qe=N.css`
96
+ `,rt=L.css`
82
97
  flex: 1;
83
98
  min-width: 80px;
84
- `,oe=N.css`
99
+ `,ge=L.css`
85
100
  height: 100%;
86
101
  width: 100%;
87
- `;var Ye=require("@uniformdev/design-system");var _e=require("@emotion/react"),Fe=require("@emotion/react/jsx-runtime");function re({op:e}){return(0,Fe.jsx)("div",{className:"operation-bubble",css:_e.css`
88
- align-items: center;
89
- background: var(--gray-700);
90
- border-radius: var(--rounded-full);
91
- color: var(--white);
92
- display: flex;
93
- width: 30px;
94
- height: 30px;
95
- justify-content: center;
96
- font-size: var(--fs-base);
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`
103
- ${We}/* grid-template-columns: minmax(0, 1fr) ${v?"minmax(0, 79px) minmax(0, 1fr)":"minmax(0, 1fr)"} */
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});
102
+ `;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:nt,"data-test-id":"criteria-container",children:[(0,f.jsxs)("div",{css:it.css`
103
+ ${ot}/* grid-template-columns: minmax(0, 1fr) ${v?"minmax(0, 79px) minmax(0, 1fr)":"minmax(0, 1fr)"} */
104
+ `,className:"criteriaItemInner",children:[(0,f.jsx)("div",{css:[fe,Oe],className:"criteria-wrapper","data-test-id":"select-criteria",children:(0,f.jsx)(Re,{errorMessage:(j=d.lhs)==null?void 0:j[y],css:ge,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:[fe,rt],className:"criteria-wrapper","data-test-id":"select-operator",children:(0,f.jsx)(ve,{name:`op-${y}`,css:ge,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:[fe,Oe],className:"criteria-wrapper","data-test-id":"select-match-criteria",children:(0,f.jsx)(we,{errorMessage:(q=d.rhs)==null?void 0:q[y],css:ge,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)(S.Icon,{icon:at.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)(S.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)(S.Callout,{title:"Default variant",type:"info",css:{marginBlock:"var(--spacing-base)"},children:(0,f.jsx)(S.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)(S.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)(S.AddListButton,{"data-test-id":"button-add-criteria",className:"add-more",buttonText:"Add Criteria",onButtonClick:p})]})};var P=require("@emotion/react/jsx-runtime");function mt(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)=>de(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)=>de(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 mt(a.inner)}}var Tt=({contextConfig:e,value:t,setValue:n,...a})=>{var h,u;let[r,o]=(0,st.useState)(void 0),{loading:s,result:i,error:l}=T(e);return(0,lt.useAsync)(async()=>{if(t&&i){let p=await Pe(t,i);o(p)}},[t,i,Pe]),l?(0,P.jsx)(F.Callout,{type:"danger",children:l}):s||i===null?(0,P.jsx)(F.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)(F.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 pt=require("@uniformdev/design-system");var W=require("@emotion/react/jsx-runtime");function kt({children:e,versionMap:t,contextConfig:n}){let{loading:a,result:r}=_(n);if(a)return(0,W.jsx)(pt.LoadingIndicator,{});if(r){let o=t[r.project.ui_version];if(o)return(0,W.jsx)(o,{})}return(0,W.jsx)(W.Fragment,{children:e})}var Ce=require("react");var ut=require("@uniformdev/context/api"),ct=require("uuid"),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,ct.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 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
@@ -1,4 +1,19 @@
1
- import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}from"@uniformdev/design-system";import{CgChevronRight as qe}from"react-icons/cg";import{css as Ge}from"@emotion/react";var ue=Ge`
1
+ import{jsx as c}from"@emotion/react";import*as h from"react";import{InputComboBox as qe}from"@uniformdev/design-system";import{css as Ge}from"@emotion/react";import{jsx as He}from"@emotion/react/jsx-runtime";function N({op:e}){return He("div",{className:"operation-bubble",css:Ge`
2
+ align-items: center;
3
+ background: var(--gray-700);
4
+ border-radius: var(--rounded-full);
5
+ color: var(--white);
6
+ display: flex;
7
+ width: 30px;
8
+ height: 30px;
9
+ justify-content: center;
10
+ font-size: var(--fs-base);
11
+ `,children:e})}import{jsx as K,jsxs as We}from"@emotion/react/jsx-runtime";var ue=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 We("div",{css:{...o("option",e),display:"flex",alignItems:"center",gap:"var(--spacing-sm)"},ref:r,"aria-disabled":a,...n,children:[i?K(N,{op:s}):K("div",{css:{width:"20px",height:"20px"}}),K("div",{children:i!=null?i:s})]})};import{jsx as ce}from"@emotion/react/jsx-runtime";var de=e=>{let{data:t,getStyles:o}=e;return ce("div",{css:{...o("singleValue",e),width:"max-content"},children:t.label.length===1?ce(N,{op:t.label}):t.label})};import{jsx as _e}from"@emotion/react/jsx-runtime";var fe=[{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 ge({onChange:e,value:t,...o}){var a,r;return _e(qe,{...o,value:{label:(r=(a=fe.find(n=>n.value===t))==null?void 0:a.name)!=null?r:t,value:t},options:fe.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:de,Option:ue,...o.components}})}import{LoadingIndicator as tt}from"@uniformdev/design-system";import{createContext as nt,useContext as Y}from"react";import{ApiClientError as Fe,CachedManifestClient as je}from"@uniformdev/context/api";import{useEffect as Ke,useState as Ye}from"react";function z({apiHost:e,apiKey:t,projectId:o}){let[a,r]=Ye({loading:!1,notConfigured:!1,error:null,result:null});return Ke(()=>{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({preview:!0});r({notConfigured:!1,loading:!1,error:null,result:i})}catch(s){let i;s instanceof Fe?(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{ApiClientError as Xe,CachedDimensionClient as Je,computeDimensionDisplayName as Qe}from"@uniformdev/context/api";import{useEffect as Ze,useState as et}from"react";function Ce(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]=et({loading:!1,notConfigured:!1,error:null,result:null});return Ze(()=>{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:Qe(d)})),l={dimensions:i,dimIndex:Ce(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{Fragment as he,jsx as E}from"@emotion/react/jsx-runtime";var L=nt(null),$n=({loadingComponent:e,errorComponent:t,contextConfig:o,children:a})=>{let r=z(o),n=V(o);return r.error||r.notConfigured?t?E(t,{contextConfig:o,result:r}):E(he,{children:"ErrorComponent is not configured"}):n.error||n.notConfigured?t?E(t,{contextConfig:o,result:n}):E(he,{children:"ErrorComponent is not configured"}):r.loading||n.loading?e?E(e,{}):E(tt,{}):E(L.Provider,{value:{manifest:r.result,dimensions:n.result,contextConfig:o},children:a})};function An(){let e=Y(L);if(!(e!=null&&e.contextConfig))throw new Error("Not within DataContext! Configuration data is not exist.");return e.contextConfig}function Un(){let e=Y(L);if(!(e!=null&&e.manifest))throw new Error("Not within DataContext! Manifest data is not exist.");return e.manifest}function Gn(){let e=Y(L);if(!(e!=null&&e.dimensions))throw new Error("Not within DataContext! Dimensions data is not exist.");return e.dimensions}import{InputComboBox as lt}from"@uniformdev/design-system";import{useState as mt}from"react";import{Icon as ot}from"@uniformdev/design-system";function X(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(X(a))}return t}import{jsx as J,jsxs as rt}from"@emotion/react/jsx-runtime";var U=e=>{var r;let{data:t,getStyles:o,className:a}=e;return J("div",{css:{...o("groupHeading",e),textTransform:"none",fontSize:"var(--font-size-sm)"},className:a,children:rt("small",{css:{color:"var(--gray-500)",display:"flex",alignItems:"center",gap:"var(--spacing-xs)"},children:[J(ot,{icon:$((r=t.label)!=null?r:""),iconColor:"currentColor",size:16}),J("span",{children:t.label})]})})};import{css as it}from"@emotion/react";import{jsx as at}from"@emotion/react/jsx-runtime";function G({message:e}){return e?at("div",{css:it`
12
+ color: var(--brand-primary-2);
13
+ font-size: var(--fs-xs);
14
+ position: absolute;
15
+ bottom: calc((var(--spacing-base) * -1) + -2px);
16
+ `,children:e}):null}import{jsx as be}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 be("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:be("div",{css:{color:"var(--gray-700)"},children:C!=null?C:t.label})})};import{Icon as st}from"@uniformdev/design-system";import{jsx as Q,jsxs as ve}from"@emotion/react/jsx-runtime";function ye({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?Q(st,{icon:$(t),iconColor:"currentColor",size:16}):null,Q("span",{"data-test-id":"dimension-name",children:t})]}):null,Q("div",{css:{color:"var(--gray-700)"},"data-test-id":"dimension-value",children:o!=null?o:t})]})}import{jsx as xe}from"@emotion/react/jsx-runtime";var W=e=>{let{data:t,getStyles:o}=e;return xe("div",{css:o("singleValue",e),children:xe(ye,{displayName:t.label})})};import{Fragment as Z,jsx as _,jsxs as B}from"@emotion/react/jsx-runtime";function De({onChange:e,criteriaMatch:t,dimensions:o,errorMessage:a,...r}){var d,C;let[n,s]=mt(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(Z,{children:[_(lt,{...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(Z,{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(Z,{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{InputComboBox as pt}from"@uniformdev/design-system";import{Fragment as ut,jsx as Ie,jsxs as ct}from"@emotion/react/jsx-runtime";function we({onChange:e,value:t,dimensions:o,errorMessage:a,...r}){return ct(ut,{children:[Ie(pt,{...r,value:t?X(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}}),Ie(G,{message:a})]})}import{Icon as gt}from"@uniformdev/design-system";import{CgChevronRight as Ct}from"react-icons/cg";import{css as dt}from"@emotion/react";var Re=dt`
2
17
  display: flex;
3
18
  align-items: center;
4
19
  font-weight: var(--fw-bold);
@@ -9,7 +24,7 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
9
24
  &:focus {
10
25
  text-decoration-line: underline;
11
26
  }
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`
27
+ `;import{jsx as ht,jsxs as bt}from"@emotion/react/jsx-runtime";var Me=({linkTo:e,name:t,linkText:o=`Edit ${t} Component`})=>bt("a",{css:Re,title:`Edit ${t} component definition`,rel:"noopener noreferrer",target:"_blank",href:e,children:[o,ht(gt,{icon:Ct,iconColor:"currentColor",size:"1.5rem"})]});import{css as re}from"@emotion/react";import{getEnrichmentVectorKey as te}from"@uniformdev/context";import{AddListButton as vt,Button as yt,Callout as ne,Icon as oe,Input as Oe,InputSelect as xt,LoadingIndicator as Dt}from"@uniformdev/design-system";import Ee from"immer";import{useMemo as Ve,useState as ee}from"react";import{CgCloseO as It,CgMathMinus as wt,CgMathPlus as Rt}from"react-icons/cg";import{Fragment as Pe,jsx as u,jsxs as M}from"@emotion/react/jsx-runtime";var Mt=re`
13
28
  flex: 2;
14
29
  display: flex;
15
30
  width: 50%;
@@ -20,7 +35,7 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
20
35
  &:focus {
21
36
  text-decoration-line: underline;
22
37
  }
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`
38
+ `,or=({value:e,setValue:t,contextConfig:o,displayTitle:a=!0})=>{let{loading:r,result:n,error:s}=V(o),i=Ve(()=>{if(n)return n.dimensions.filter(b=>b.category==="ENR")},[n]),l=Ve(()=>{if(!e)return i;if(i)return i.filter(b=>!e.some(I=>te(I.cat,I.key)===b.dim))},[i,e]),[d,C]=ee(""),[p,m]=ee(50),[f,w]=ee(!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[te(S.cat,S.key)];return Boolean(k)}):I=b;let T=I.length===0?null:I;t(T)};return s?u(ne,{type:"danger",children:s}):r||n===null?u(Dt,{}):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(ne,{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(Pe,{children:[n&&u(St,{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(xt,{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(Ot,{score:p,setValue:m,cap:g?g.cap:100,css:{flexBasis:"9rem"}}),u(yt,{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(vt,{className:"add-more",buttonText:"Add More",onButtonClick:()=>w(!0)}):u("a",{css:Mt,title:"none",href:"#"}),u(Me,{name:"Enrichments",linkText:"Manage Enrichments",linkTo:`${o.apiHost}/projects/${encodeURIComponent(o.projectId)}/personalization/enrichments`})]})]}):u(Et,{contextConfig:o})]})},Et=({contextConfig:e})=>u(ne,{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"}),"."]})}),Se=(e,t=100,o=0)=>Math.max(Math.min(e,t),o),Be=re`
24
39
  position: absolute;
25
40
  bottom: 0.875rem;
26
41
  left: var(--spacing-sm);
@@ -32,28 +47,28 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
32
47
  background-color: var(--gray-100);
33
48
  border: 1px solid var(--gray-300);
34
49
  border-radius: var(--rounded-full);
35
- `,st=Q`
36
- ${be}
50
+ `,Vt=re`
51
+ ${Be}
37
52
  left: auto;
38
53
  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 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`
54
+ `,Ot=({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(Oe,{label:"Strength",id:"enrichment-score",type:"number",min:0,max:o,value:e,onChange:n=>t(Se(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(oe,{icon:wt,iconColor:"gray",size:"1.5rem"})}),u("button",{type:"button",title:"Increase enrichment count",onClick:()=>r("increment"),className:"scoreCounterButton",css:Vt,children:u(oe,{icon:Rt,iconColor:"gray",size:"1.5rem"})})]})},St=({list:e,setList:t,dimIndex:o})=>{let a=n=>{t(Ee(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(Ee(e,d=>{d[n].str=Se(Number(s)||0,i)}))};return u(Pe,{children:e.map((n,s)=>{let i=o[te(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(Oe,{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(oe,{icon:It,iconColor:"red",size:"1.5rem"})})]},`${n.cat}-${n.key}`)})})};import{Callout as Ae,LoadingIndicator as $t}from"@uniformdev/design-system";import{useState as At}from"react";import{useAsync as Ut}from"react-use";import*as D from"yup";function sr(e){return Array.isArray(e)&&e.length>0&&e[0].cat!==void 0}function lr(e){return e.crit!==void 0}function ie(e){return e!=="+"&&e!=="-"}import{css as Pt}from"@emotion/react";import{AddListButton as Tt,Callout as ze,Icon as kt,InputInlineSelect as Nt,Paragraph as zt}from"@uniformdev/design-system";import Le from"immer";import{CgCloseO as Lt}from"react-icons/cg";import{css as O}from"@emotion/react";var ae="6rem",Te=O`
40
55
  position: relative;
41
56
  padding: var(--spacing-md) var(--spacing-base);
42
57
  border: 1px solid var(--gray-300);
43
58
  box-shadow: var(--shadow-base);
44
59
  background-color: white;
45
60
  border-radius: var(--rounded-base);
46
- margin-top: ${Z};
61
+ margin-top: ${ae};
47
62
  display: flex;
48
63
 
49
64
  &:before {
50
65
  content: '';
51
66
  display: block;
52
67
  width: 1px;
53
- height: ${Z};
68
+ height: ${ae};
54
69
  background-color: var(--gray-300);
55
70
  position: absolute;
56
- top: -${Z};
71
+ top: -${ae};
57
72
  left: var(--spacing-lg);
58
73
  }
59
74
 
@@ -63,42 +78,27 @@ import{jsx as c}from"@emotion/react";import*as h from"react";import{Icon as We}f
63
78
  display: none;
64
79
  }
65
80
  }
66
- `,xe=O`
81
+ `,ke=O`
67
82
  display: flex;
68
83
  gap: var(--spacing-base);
69
84
  flex-grow: 1;
70
85
  flex-wrap: wrap;
71
86
  margin-right: var(--spacing-base);
72
- `,N=O`
87
+ `,F=O`
73
88
  width: 100%;
74
89
  display: flex;
75
90
  align-items: stretch;
76
91
  position: relative;
77
- `,ee=O`
92
+ `,se=O`
78
93
  flex: 2;
79
94
  height: 52px;
80
95
  min-width: 200px;
81
- `,De=O`
96
+ `,Ne=O`
82
97
  flex: 1;
83
98
  min-width: 80px;
84
- `,z=O`
99
+ `,j=O`
85
100
  height: 100%;
86
101
  width: 100%;
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`
88
- align-items: center;
89
- background: var(--gray-700);
90
- border-radius: var(--rounded-full);
91
- color: var(--white);
92
- display: flex;
93
- width: 30px;
94
- height: 30px;
95
- justify-content: center;
96
- font-size: var(--fs-base);
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`
103
- ${xe}/* grid-template-columns: minmax(0, 1fr) ${b?"minmax(0, 79px) minmax(0, 1fr)":"minmax(0, 1fr)"} */
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};
102
+ `;import{jsx as v,jsxs as le}from"@emotion/react/jsx-runtime";var $e=({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(Le(C,R=>{R.crit[y]=g}))},w=g=>{let y=Le(C,b=>{b.crit.splice(g,1)}),R=y.crit.length===0?null:y;t(R),s==null||s(R)};return le("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 le("div",{css:Te,"data-test-id":"criteria-container",children:[le("div",{css:Pt`
103
+ ${ke}/* grid-template-columns: minmax(0, 1fr) ${b?"minmax(0, 79px) minmax(0, 1fr)":"minmax(0, 1fr)"} */
104
+ `,className:"criteriaItemInner",children:[v("div",{css:[F,se],className:"criteria-wrapper","data-test-id":"select-criteria",children:v(we,{errorMessage:(T=d.lhs)==null?void 0:T[y],css:j,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:[F,Ne],className:"criteria-wrapper","data-test-id":"select-operator",children:v(ge,{name:`op-${y}`,css:j,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:[F,se],className:"criteria-wrapper","data-test-id":"select-match-criteria",children:v(De,{errorMessage:(S=d.rhs)==null?void 0:S[y],css:j,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(kt,{icon:Lt,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(Nt,{"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(ze,{title:"Default variant",type:"info",css:{marginBlock:"var(--spacing-base)"},children:v(zt,{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(ze,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:v("p",{children:"You do not have any dimensions configured."})}):v(Tt,{"data-test-id":"button-add-criteria",className:"add-more",buttonText:"Add Criteria",onButtonClick:m})]})};import{jsx as P,jsxs as Ht}from"@emotion/react/jsx-runtime";function Gt(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 me(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)=>ie(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)=>ie(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 Gt(a.inner)}}var Sr=({contextConfig:e,value:t,setValue:o,...a})=>{var C,p;let[r,n]=At(void 0),{loading:s,result:i,error:l}=V(e);return Ut(async()=>{if(t&&i){let m=await me(t,i);n(m)}},[t,i,me]),l?P(Ae,{type:"danger",children:l}):s||i===null?P($t,{}):P($e,{...a,value:t,setValue:async m=>{let f=await me(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(Ae,{title:"Dimensions",type:"info",css:{marginBlock:"var(--spacing-base)"},children:Ht("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{LoadingIndicator as Wt}from"@uniformdev/design-system";import{Fragment as qt,jsx as pe}from"@emotion/react/jsx-runtime";function zr({children:e,versionMap:t,contextConfig:o}){let{loading:a,result:r}=z(o);if(a)return pe(Wt,{});if(r){let n=t[r.project.ui_version];if(n)return pe(n,{})}return pe(qt,{children:e})}import{useEffect as jt,useState as Kt}from"react";import{UncachedManifestClient as _t}from"@uniformdev/context/api";import{validate as Ft}from"uuid";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(!Ft(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}}};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{$n as ContextData,De as CriteriaMatchMenu,ge as CriteriaOperatorMenu,we as DimensionMenu,ye as DimensionValue,Me as EditLink,or as EnrichmentTag,Sr as PersonalizationCriteria,$e as PersonalizationCriteriaStatic,zr as ProjectUIVersion,Mt as addEnrichmentLink,fe as contextCriteriaMenuOperators,Gt as convertErrorsToObj,sr as isEnrichmentTagData,lr as isPersonalizationCriteriaData,ie as opHasRhs,An as useContextConfig,z as useContextData,V as useDimensions,Gn as useDimensionsDataContext,Un 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.5.1-alpha.105+9b3f152e7",
3
+ "version": "17.5.1-alpha.130+3fac779b1",
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",
@@ -31,8 +31,8 @@
31
31
  },
32
32
  "dependencies": {
33
33
  "@emotion/react": "11.10.5",
34
- "@uniformdev/context": "^17.5.1-alpha.105+9b3f152e7",
35
- "@uniformdev/design-system": "^17.5.1-alpha.105+9b3f152e7",
34
+ "@uniformdev/context": "^17.5.1-alpha.130+3fac779b1",
35
+ "@uniformdev/design-system": "^17.5.1-alpha.130+3fac779b1",
36
36
  "immer": "9.0.16",
37
37
  "react-beautiful-dnd": "13.1.1",
38
38
  "react-icons": "^4.3.1",
@@ -74,5 +74,5 @@
74
74
  "publishConfig": {
75
75
  "access": "public"
76
76
  },
77
- "gitHead": "9b3f152e7455f37fd8609004bab4ded4a9a88bc7"
77
+ "gitHead": "3fac779b1b42a1afeb05156cb51768a98573438f"
78
78
  }