npm - @bikdotai/bik-component-library - Versions diffs - 0.0.808-beta.0 → 0.0.809-beta.0 - Mend

@bikdotai/bik-component-library 0.0.808-beta.0 → 0.0.809-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1601) hide show

package/dist/cjs/components/variable-picker-v3/Content.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),s=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_back.svg.js"),a=require("../../assets/icons/cross.svg.js"),i=require("../../assets/icons/plus.svg.js"),l=require("../../assets/icons/triangle_error.svg.js"),r=require("react"),n=require("../../constants/Theme.js"),o=require("../accordion/Accordion.js"),c=require("../icon-button/IconButton.js"),d=require("../input/Input.js"),u=require("../list-item/ListItem.js"),h=require("../switch/Switch.js"),b=require("../tooltips/Tooltip.js"),j=require("../TypographyStyle.js"),p=require("./context.js"),g=require("./DefaultVariableContent.js"),x=require("./highlightSearchText.js"),y=require("./model.js"),m=require("./NoResult.js"),f=require("./recommendVaribles.js"),v=require("./searchVariables.js"),O=require("./styles.js"),S=require("./SubHeaderItems.js");const C=/.*\..*/;exports.VariablePickerContent=V=>{const{data:w,onSelect:R,showHeader:k,showBackButton:q,hideHeaderCross:T,onBackButtonClick:B,isEvaluationList:I,autoOpenFirst:L,headerText:N,contentHeight:D,onDefaultVariableSelect:_,skipDefaultVariableContent:E}=V,[H,P]=r.useState(w),[$,F]=r.useState(""),[A,M]=r.useState([]),[W,z]=r.useState(""),[K,G]=r.useState(!1),[J,Q]=r.useState([]),[U,X]=r.useState(!1),[Y,Z]=r.useState(),ee=U&&V.type===y.PickerType.EMBEDDED&&!T;r.useEffect((()=>{se(!0)}),[]),r.useEffect((()=>{A.length>0?Q([A[A.length-1]]):Q(w)}),[A]);const se=s=>e.__awaiter(void 0,void 0,void 0,(function*(){if(G(s),s){const e=f.showOnlyRecommendedVariables(H,A);P(e)}else if(A.length>0){const e=W==A[A.length-1].displayName;if($.length>0&&e){const e=v.searchVariables($,J,A);P(e)}else P([A[A.length-1].variables])}else if($.length>0){const e=v.searchVariables($,J,A);P(e)}else P(w)})),te=()=>{if(D)return D;let e=131;return A.length>0&&(e+=32),(V.showHeader||V.showBackButton)&&(e+=40),`calc(100% - ${e}px)`},ae=e=>{if(!V.disabled)if(I){const s=(e=>{if(e.actualValue.match(C)){const s=e.actualValue.replace("{{","").replace("}}","").split(".");let t=s[0];return s.forEach(((e,s)=>{if(0===s)return;const a=(e=>/\w+\[\d+\]/g.test(e))(e);if(a){const s=e.match(/(\w+)\[(\d+)\]/);if(s){const e=s[1],a=s[2];t+=`['${e}'][${a}]`}}else t+=`['${e}']`})),t}return e.actualValueEval?e.actualValueEval:e.actualValue})(e);R(Object.assign(Object.assign({},e),{actualValue:s}))}else{if(e.isDefaultValueSupported&&!E)return Z(e),void X(!0);R(e)}};return s.jsx(p.VariablePickerContext.Provider,Object.assign({value:{variables:H,searchText:$,subHeaderStack:A,showRecommended:K,setSubHeaderStack:M,setSearchText:F,setVariables:P,setShowRecommended:G}},{children:s.jsxs("div",Object.assign({tabIndex:-1,id:"variable-picker-v3",style:{backgroundColor:"white",borderRadius:8,height:"100%",outline:"none"},onClick:e=>e.stopPropagation()},{children:[(k||q||U)&&s.jsxs(O.HeaderWrapper,Object.assign({openDefault:U},{children:[s.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:8}},{children:[(q||U)&&s.jsx(c.IconButton,{Icon:()=>s.jsx(t.default,{width:16,height:16,style:{display:"flex",color:n.COLORS.content.primary}}),onClick:()=>{U?X(!1):B&&B()}}),(k||U)&&s.jsx(j.TitleRegular,{children:U?"Set up":null!=N?N:"Select Variable"})]})),ee&&s.jsx(c.IconButton,{style:{color:"#212121"},Icon:a.default,onClick:()=>V.onClose&&V.onClose()})]})),U&&Y&&!E?s.jsx(g.DefaultVariableContent,{variable:Y,onInsertVariable:e=>{R(e),null==_||_(e)}}):s.jsxs(s.Fragment,{children:[s.jsx("div",Object.assign({style:{padding:"0 16px",paddingTop:12,backgroundColor:n.COLORS.surface.subdued,borderTopLeftRadius:8,borderTopRightRadius:8}},{children:s.jsx(d.Input,{id:"search-bar-v3-picker",onBlur:e=>{V.onSearchBlur&&V.onSearchBlur(e)},value:$,noKeyDownChange:!0,placeholder:"Search",onChangeText:e=>{e||z("");const s=v.searchVariables(e,J,A);if(K){const e=f.showOnlyRecommendedVariables(s,A);P(e)}else P(s);F(e);const t=A.length>0?A[A.length-1].displayName:"home";z(t)}})})),s.jsxs(O.RecommendWrapper,{children:[s.jsx(j.BodySecondary,Object.assign({style:{color:n.COLORS.content.secondary}},{children:"Only Recommended"})),s.jsx(h.Switch,{value:K,onValueChange:s=>e.__awaiter(void 0,void 0,void 0,(function*(){yield se(s)}))})]}),A.length>0&&s.jsxs(O.BackHeader,{children:[s.jsx("div",Object.assign({style:{position:"absolute",left:16}},{children:s.jsx(c.IconButton,{id:"back-btn-v3",style:{display:"flex"},Icon:()=>s.jsx(t.default,{width:12,height:12,style:{color:n.COLORS.content.secondary}}),onClick:e=>{e.stopPropagation();let s=$;const t=[...A],a=t.pop();if(M(t),a.displayName===W&&(F(""),s=""),s.length>0){const e=t.length>0?[t[t.length-1]]:w,a=v.searchVariables(s,e,t);if(K){const e=f.showOnlyRecommendedVariables(a,t);P(e)}else P(a)}else if(t.length>0)if(K){const e=f.showOnlyRecommendedVariables([t[t.length-1].variables],t);P(e)}else P([t[t.length-1].variables]);else if(K){const e=f.showOnlyRecommendedVariables(w,A);P(e)}else P(w)}})})),s.jsx(j.BodyCaption,Object.assign({style:{color:n.COLORS.content.secondary}},{children:A[A.length-1].displayName}))]}),s.jsx(s.Fragment,{children:H.length>0?s.jsx(O.Container,Object.assign({height:te()},{children:H.map(((e,t)=>{var a,r;return e.displayName&&void 0!==e.variables?s.jsx("div",Object.assign({style:{borderBottom:`1px solid ${n.COLORS.stroke.primary}`}},{children:s.jsx(o.BikAccordion,Object.assign({arrowColor:n.COLORS.content.primary,autoOpen:L&&0===t,headerPadding:"12px 16px",header:s.jsx(j.TitleSmall,Object.assign({style:{color:n.COLORS.content.secondary}},{children:x.highlightSearchText(e.displayName,$)}))},{children:s.jsx(S.default,{parentVariable:e,disabled:null!==(a=V.disabled)&&void 0!==a&&a,searchText:$,variable:e.variables,onSelect:e=>{if(e.isDefaultValueSupported&&!E)return Z(e),void X(!0);R(e)}})}))}),e.displayName+K):e.displayName?s.jsx(b.Tooltip,Object.assign({body:S.renderTooltipBody(e),placement:"bottom"},{children:s.jsx(u.ListItem,{variant:V.disabled?"readonly":(null==e?void 0:e.selected)?"selected":"default",version:"2.0",leadingIcon:(null==e?void 0:e.selected)||V.disabled?s.jsx(s.Fragment,{}):s.jsx("div",Object.assign({style:{flexShrink:0}},{children:s.jsx(i.default,{width:14,height:14})})),customListItemLabel:s.jsxs("div",Object.assign({style:{display:"flex",gap:4}},{children:[s.jsx(j.BodySecondary,Object.assign({style:{fontSize:"14px",color:n.COLORS.text.primary}},{children:x.highlightSearchText(e.displayName,$)})),!e.isAvailable&&s.jsx(b.Tooltip,Object.assign({body:"Not Recommended"},{children:s.jsx("div",Object.assign({style:{display:"flex",marginTop:2}},{children:s.jsx(l.default,{width:16,height:16,color:n.COLORS.content.secondary})}))}))]})),listItem:{label:e.displayName,value:e.displayName},subText:e.description||"",onClick:()=>ae(e)},t)}),t):s.jsx(S.default,{disabled:null!==(r=V.disabled)&&void 0!==r&&r,searchText:$,variable:e,onSelect:e=>ae(e)},t)}))})):s.jsx(m.default,{height:te(),searchText:$})})]})]}))}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),s=require("../../assets/icons/arrow_back.svg.js"),a=require("../../assets/icons/cross.svg.js"),i=require("../../assets/icons/plus.svg.js"),l=require("../../assets/icons/triangle_error.svg.js"),r=require("react"),n=require("../../constants/Theme.js"),o=require("../accordion/Accordion.js"),c=require("../icon-button/IconButton.js"),d=require("../input/Input.js"),u=require("../list-item/ListItem.js"),h=require("../switch/Switch.js"),b=require("../tooltips/Tooltip.js"),p=require("../TypographyStyle.js"),j=require("./context.js"),g=require("./DefaultVariableContent.js"),x=require("./highlightSearchText.js"),y=require("./model.js"),m=require("./NoResult.js"),f=require("./recommendVaribles.js"),v=require("./searchVariables.js"),O=require("./styles.js"),S=require("./SubHeaderItems.js");const C=/.*\..*/;exports.VariablePickerContent=V=>{const{data:R,onSelect:k,showHeader:w,showBackButton:q,hideHeaderCross:T,onBackButtonClick:B,isEvaluationList:I,autoOpenFirst:L,headerText:N,contentHeight:D,onDefaultVariableSelect:_,skipDefaultVariableContent:E}=V,[H,P]=r.useState(R),[F,$]=r.useState(""),[A,M]=r.useState([]),[W,z]=r.useState(""),[K,G]=r.useState(!1),[J,Q]=r.useState([]),[U,X]=r.useState(!1),[Y,Z]=r.useState(),ee=r.useRef(null),te=r.useRef([]),se=U&&V.type===y.PickerType.EMBEDDED&&!T;r.useEffect((()=>{ae(!0)}),[]),r.useEffect((()=>{A.length>0?Q([A[A.length-1]]):Q(R)}),[A]);const ae=t=>e.__awaiter(void 0,void 0,void 0,(function*(){if(G(t),t){const e=f.showOnlyRecommendedVariables(H,A);P(e)}else if(A.length>0){const e=W==A[A.length-1].displayName;if(F.length>0&&e){const e=v.searchVariables(F,J,A);P(e)}else P([A[A.length-1].variables])}else if(F.length>0){const e=v.searchVariables(F,J,A);P(e)}else P(R)})),ie=()=>{if(D)return D;let e=131;return A.length>0&&(e+=32),(V.showHeader||V.showBackButton)&&(e+=40),`calc(100% - ${e}px)`},le=e=>{if(!V.disabled)if(I){const t=(e=>{if(e.actualValue.match(C)){const t=e.actualValue.replace("{{","").replace("}}","").split(".");let s=t[0];return t.forEach(((e,t)=>{if(0===t)return;const a=(e=>/\w+\[\d+\]/g.test(e))(e);if(a){const t=e.match(/(\w+)\[(\d+)\]/);if(t){const e=t[1],a=t[2];s+=`['${e}'][${a}]`}}else s+=`['${e}']`})),s}return e.actualValueEval?e.actualValueEval:e.actualValue})(e);k(Object.assign(Object.assign({},e),{actualValue:t}))}else{if(e.isDefaultValueSupported&&!E)return Z(e),void X(!0);k(e)}};return t.jsx(j.VariablePickerContext.Provider,Object.assign({value:{variables:H,searchText:F,subHeaderStack:A,showRecommended:K,setSubHeaderStack:M,setSearchText:$,setVariables:P,setShowRecommended:G,containerRef:ee,scrollPositionStack:te}},{children:t.jsxs("div",Object.assign({tabIndex:-1,id:"variable-picker-v3",style:{backgroundColor:"white",borderRadius:8,height:"100%",outline:"none"},onClick:e=>e.stopPropagation()},{children:[(w||q||U)&&t.jsxs(O.HeaderWrapper,Object.assign({openDefault:U},{children:[t.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:8}},{children:[(q||U)&&t.jsx(c.IconButton,{Icon:()=>t.jsx(s.default,{width:16,height:16,style:{display:"flex",color:n.COLORS.content.primary}}),onClick:()=>{U?X(!1):B&&B()}}),(w||U)&&t.jsx(p.TitleRegular,{children:U?"Set up":null!=N?N:"Select Variable"})]})),se&&t.jsx(c.IconButton,{style:{color:"#212121"},Icon:a.default,onClick:()=>V.onClose&&V.onClose()})]})),U&&Y&&!E?t.jsx(g.DefaultVariableContent,{variable:Y,onInsertVariable:e=>{k(e),null==_||_(e)}}):t.jsxs(t.Fragment,{children:[t.jsx("div",Object.assign({style:{padding:"0 16px",paddingTop:12,backgroundColor:n.COLORS.surface.subdued,borderTopLeftRadius:8,borderTopRightRadius:8}},{children:t.jsx(d.Input,{id:"search-bar-v3-picker",onBlur:e=>{V.onSearchBlur&&V.onSearchBlur(e)},value:F,noKeyDownChange:!0,placeholder:"Search",onChangeText:e=>{e||z("");const t=v.searchVariables(e,J,A);if(K){const e=f.showOnlyRecommendedVariables(t,A);P(e)}else P(t);$(e);const s=A.length>0?A[A.length-1].displayName:"home";z(s)}})})),t.jsxs(O.RecommendWrapper,{children:[t.jsx(p.BodySecondary,Object.assign({style:{color:n.COLORS.content.secondary}},{children:"Only Recommended"})),t.jsx(h.Switch,{value:K,onValueChange:t=>e.__awaiter(void 0,void 0,void 0,(function*(){yield ae(t)}))})]}),A.length>0&&t.jsxs(O.BackHeader,{children:[t.jsx("div",Object.assign({style:{position:"absolute",left:16}},{children:t.jsx(c.IconButton,{id:"back-btn-v3",style:{display:"flex"},Icon:()=>t.jsx(s.default,{width:12,height:12,style:{color:n.COLORS.content.secondary}}),onClick:e=>{var t;e.stopPropagation();let s=F;const a=[...A],i=a.pop();M(a),i.displayName===W&&($(""),s="");const l=null!==(t=te.current.pop())&&void 0!==t?t:0;if(s.length>0){const e=a.length>0?[a[a.length-1]]:R,t=v.searchVariables(s,e,a);if(K){const e=f.showOnlyRecommendedVariables(t,a);P(e)}else P(t)}else if(a.length>0)if(K){const e=f.showOnlyRecommendedVariables([a[a.length-1].variables],a);P(e)}else P([a[a.length-1].variables]);else if(K){const e=f.showOnlyRecommendedVariables(R,A);P(e)}else P(R);requestAnimationFrame((()=>{ee.current&&(ee.current.scrollTop=l)}))}})})),t.jsx(p.BodyCaption,Object.assign({style:{color:n.COLORS.content.secondary}},{children:A[A.length-1].displayName}))]}),t.jsx(t.Fragment,{children:H.length>0?t.jsx(O.Container,Object.assign({ref:ee,height:ie()},{children:H.map(((e,s)=>{var a,r;return e.displayName&&void 0!==e.variables?t.jsx("div",Object.assign({style:{borderBottom:`1px solid ${n.COLORS.stroke.primary}`}},{children:t.jsx(o.BikAccordion,Object.assign({arrowColor:n.COLORS.content.primary,autoOpen:L&&0===s,headerPadding:"12px 16px",header:t.jsx(p.TitleSmall,Object.assign({style:{color:n.COLORS.content.secondary}},{children:x.highlightSearchText(e.displayName,F)}))},{children:t.jsx(S.default,{parentVariable:e,disabled:null!==(a=V.disabled)&&void 0!==a&&a,searchText:F,variable:e.variables,onSelect:e=>{if(e.isDefaultValueSupported&&!E)return Z(e),void X(!0);k(e)}})}))}),e.displayName+K):e.displayName?t.jsx(b.Tooltip,Object.assign({body:S.renderTooltipBody(e),placement:"bottom"},{children:t.jsx(u.ListItem,{variant:V.disabled?"readonly":(null==e?void 0:e.selected)?"selected":"default",version:"2.0",leadingIcon:(null==e?void 0:e.selected)||V.disabled?t.jsx(t.Fragment,{}):t.jsx("div",Object.assign({style:{flexShrink:0}},{children:t.jsx(i.default,{width:14,height:14})})),customListItemLabel:t.jsxs("div",Object.assign({style:{display:"flex",gap:4}},{children:[t.jsx(p.BodySecondary,Object.assign({style:{fontSize:"14px",color:n.COLORS.text.primary}},{children:x.highlightSearchText(e.displayName,F)})),!e.isAvailable&&t.jsx(b.Tooltip,Object.assign({body:"Not Recommended"},{children:t.jsx("div",Object.assign({style:{display:"flex",marginTop:2}},{children:t.jsx(l.default,{width:16,height:16,color:n.COLORS.content.secondary})}))}))]})),listItem:{label:e.displayName,value:e.displayName},subText:e.description||"",onClick:()=>le(e)},s)}),s):t.jsx(S.default,{disabled:null!==(r=V.disabled)&&void 0!==r&&r,searchText:F,variable:e,onSelect:e=>le(e)},s)}))})):t.jsx(m.default,{height:ie(),searchText:F})})]})]}))}))};
 //# sourceMappingURL=Content.js.map

package/dist/cjs/components/variable-picker-v3/Content.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Content.js","sources":["../../../../src/components/variable-picker-v3/Content.tsx"],"sourcesContent":["import BackIcon from '@src/assets/icons/arrow_back.svg';\nimport CrossIcon from '@src/assets/icons/cross.svg';\nimport AddIcon from '@src/assets/icons/plus.svg';\nimport WarnIcon from '@src/assets/icons/triangle_error.svg';\nimport React, { useEffect, useState } from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport { BikAccordion } from '../accordion';\nimport { IconButton } from '../icon-button';\nimport { Input } from '../input';\nimport { ListItem } from '../list-item';\nimport { Switch } from '../switch';\nimport { Tooltip } from '../tooltips';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleRegular,\n\tTitleSmall,\n} from '../TypographyStyle';\nimport { VariablePickerContext } from './context';\nimport { DefaultVariableContent } from './DefaultVariableContent';\nimport { highlightSearchText } from './highlightSearchText';\nimport {\n\tPickerType,\n\tSubHeader,\n\tVariablePickerV3Props,\n\tVariableV3,\n} from './model';\nimport NoResult from './NoResult';\nimport { showOnlyRecommendedVariables } from './recommendVaribles';\nimport { searchVariables } from './searchVariables';\nimport {\n\tBackHeader,\n\tContainer,\n\tHeaderWrapper,\n\tRecommendWrapper,\n} from './styles';\nimport SubHeaderItems, { renderTooltipBody } from './SubHeaderItems';\n\ntype Props = VariablePickerV3Props;\n\nconst variableRegex = /.\\../;\nconst checkIfArray = (value: string) => {\n\tconst regex = /\\w+\\[\\d+\\]/g;\n\treturn regex.test(value);\n};\n\nconst matchVariable = (variable: VariableV3) => {\n\tif (variable.actualValue.match(variableRegex)) {\n\t\tconst path = variable.actualValue\n\t\t\t.replace('{{', '')\n\t\t\t.replace('}}', '')\n\t\t\t.split('.');\n\t\tlet evalVariableValue = path[0];\n\t\tpath.forEach((value, index) => {\n\t\t\tif (index === 0) return;\n\t\t\tconst isArray = checkIfArray(value);\n\t\t\tif (isArray) {\n\t\t\t\t// ex: event_memberships[0] -> ['event_memberships'][0]\n\t\t\t\tconst matches = value.match(/(\\w+)\\[(\\d+)\\]/);\n\t\t\t\tif (matches) {\n\t\t\t\t\tconst arrayName = matches[1];\n\t\t\t\t\tconst index = matches[2];\n\t\t\t\t\tevalVariableValue = evalVariableValue + `['${arrayName}'][${index}]`;\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tevalVariableValue = evalVariableValue + `['${value}']`;\n\t\t\t}\n\t\t});\n\t\treturn evalVariableValue;\n\t} else {\n\t\tconst value = variable.actualValueEval\n\t\t\t? variable.actualValueEval\n\t\t\t: variable.actualValue;\n\t\treturn value;\n\t}\n};\n\nexport const VariablePickerContent: React.FC<Props> = (\n\tprops: VariablePickerV3Props,\n) => {\n\tconst {\n\t\tdata,\n\t\tonSelect,\n\t\tshowHeader,\n\t\tshowBackButton,\n\t\thideHeaderCross,\n\t\tonBackButtonClick,\n\t\tisEvaluationList,\n\t\tautoOpenFirst,\n\t\theaderText,\n\t\tcontentHeight,\n\t\tonDefaultVariableSelect,\n\t\tskipDefaultVariableContent,\n\t} = props;\n\n\tconst [variables, setVariables] = useState(data); // modified data after search\n\tconst [searchText, setSearchText] = useState<string>('');\n\tconst [subHeaderStack, setSubHeaderStack] = useState<any[]>([]); // push variable object after every level\n\tconst [searchedFrom, setSearchedFrom] = useState<string>(''); // from which level did the user search from\n\tconst [showRecommended, setShowRecommended] = useState<boolean>(false);\n\tconst [dataSource, setDataSource] = useState<any[]>([]); // for search, maintaining original copy\n\tconst [openDefaultVariablePanel, setOpenDefaultVariablePanel] =\n\t\tuseState(false);\n\tconst [chosenForDefault, setChosenForDefault] = useState<VariableV3 \| null>();\n\tconst shouldShowHeaderInsideCross =\n\t\topenDefaultVariablePanel &&\n\t\tprops.type === PickerType.EMBEDDED &&\n\t\t!hideHeaderCross;\n\n\t// useEffect(() => {\n\t// \t// TODO: based on new data, update existing variables if available\n\t// \tsetVariables(data);\n\t// }, [data]);\n\n\tuseEffect(() => {\n\t\thandleRecommendedChange(true);\n\t}, []);\n\n\tuseEffect(() => {\n\t\tif (subHeaderStack.length > 0) {\n\t\t\tsetDataSource([subHeaderStack[subHeaderStack.length - 1]]);\n\t\t} else {\n\t\t\tsetDataSource(data);\n\t\t}\n\t}, [subHeaderStack]);\n\n\tconst handleBackClick = (e: any) => {\n\t\te.stopPropagation();\n\t\tlet _searchText = searchText;\n\t\tconst newSubHeaderStack = [...subHeaderStack];\n\t\tconst poppedElement = newSubHeaderStack.pop();\n\t\tsetSubHeaderStack(newSubHeaderStack);\n\t\tif (poppedElement.displayName === searchedFrom) {\n\t\t\tsetSearchText('');\n\t\t\t_searchText = ''; // so that search is not trigerred in the below code\n\t\t}\n\t\tif (_searchText.length > 0) {\n\t\t\t// maintain the search result when going back\n\t\t\tconst dataSource =\n\t\t\t\tnewSubHeaderStack.length > 0\n\t\t\t\t\t? [newSubHeaderStack[newSubHeaderStack.length - 1]]\n\t\t\t\t\t: data;\n\t\t\tconst result = searchVariables(\n\t\t\t\t_searchText,\n\t\t\t\tdataSource,\n\t\t\t\tnewSubHeaderStack,\n\t\t\t);\n\t\t\tif (showRecommended) {\n\t\t\t\tconst recommended = showOnlyRecommendedVariables(\n\t\t\t\t\tresult,\n\t\t\t\t\tnewSubHeaderStack,\n\t\t\t\t);\n\t\t\t\tsetVariables(recommended);\n\t\t\t} else {\n\t\t\t\tsetVariables(result);\n\t\t\t}\n\t\t} else {\n\t\t\tif (newSubHeaderStack.length > 0) {\n\t\t\t\tif (showRecommended) {\n\t\t\t\t\tconst recommended = showOnlyRecommendedVariables(\n\t\t\t\t\t\t[newSubHeaderStack[newSubHeaderStack.length - 1].variables],\n\t\t\t\t\t\tnewSubHeaderStack,\n\t\t\t\t\t);\n\t\t\t\t\tsetVariables(recommended);\n\t\t\t\t} else {\n\t\t\t\t\tsetVariables([\n\t\t\t\t\t\tnewSubHeaderStack[newSubHeaderStack.length - 1].variables,\n\t\t\t\t\t]);\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tif (showRecommended) {\n\t\t\t\t\tconst recommended = showOnlyRecommendedVariables(\n\t\t\t\t\t\tdata,\n\t\t\t\t\t\tsubHeaderStack,\n\t\t\t\t\t);\n\t\t\t\t\tsetVariables(recommended);\n\t\t\t\t} else {\n\t\t\t\t\tsetVariables(data);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t};\n\n\tconst handleRecommendedChange = async (val) => {\n\t\tsetShowRecommended(val);\n\t\tif (val) {\n\t\t\tconst output = showOnlyRecommendedVariables(variables, subHeaderStack);\n\t\t\tsetVariables(output);\n\t\t} else {\n\t\t\tif (subHeaderStack.length > 0) {\n\t\t\t\t// dont apply search if not in the page where search started\n\t\t\t\tconst isInSearchStartPage =\n\t\t\t\t\tsearchedFrom == subHeaderStack[subHeaderStack.length - 1].displayName;\n\t\t\t\tif (searchText.length > 0 && isInSearchStartPage) {\n\t\t\t\t\tconst result = searchVariables(\n\t\t\t\t\t\tsearchText,\n\t\t\t\t\t\tdataSource,\n\t\t\t\t\t\tsubHeaderStack,\n\t\t\t\t\t);\n\t\t\t\t\tsetVariables(result);\n\t\t\t\t} else {\n\t\t\t\t\tsetVariables([subHeaderStack[subHeaderStack.length - 1].variables]);\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tif (searchText.length > 0) {\n\t\t\t\t\tconst result = searchVariables(\n\t\t\t\t\t\tsearchText,\n\t\t\t\t\t\tdataSource,\n\t\t\t\t\t\tsubHeaderStack,\n\t\t\t\t\t);\n\t\t\t\t\tsetVariables(result);\n\t\t\t\t} else {\n\t\t\t\t\tsetVariables(data);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t};\n\n\tconst calculateHeight = () => {\n\t\tif (contentHeight) {\n\t\t\treturn contentHeight;\n\t\t}\n\t\tlet pickerContentHeight = 131;\n\t\tif (subHeaderStack.length > 0) {\n\t\t\tpickerContentHeight += 32;\n\t\t}\n\t\tif (props.showHeader \|\| props.showBackButton) {\n\t\t\tpickerContentHeight += 40;\n\t\t}\n\t\treturn `calc(100% - ${pickerContentHeight}px)`;\n\t};\n\n\tconst onSearch = (text: string) => {\n\t\tif (!text) {\n\t\t\tsetSearchedFrom('');\n\t\t}\n\t\tconst result = searchVariables(text, dataSource, subHeaderStack);\n\t\tif (showRecommended) {\n\t\t\tconst recommended = showOnlyRecommendedVariables(result, subHeaderStack);\n\t\t\tsetVariables(recommended);\n\t\t} else {\n\t\t\tsetVariables(result);\n\t\t}\n\t\tsetSearchText(text);\n\t\tconst latestSubHeader =\n\t\t\tsubHeaderStack.length > 0\n\t\t\t\t? subHeaderStack[subHeaderStack.length - 1].displayName\n\t\t\t\t: 'home';\n\t\tsetSearchedFrom(latestSubHeader);\n\t};\n\n\tconst HeaderBackIcon = () => {\n\t\treturn (\n\t\t\t<BackIcon\n\t\t\t\twidth={16}\n\t\t\t\theight={16}\n\t\t\t\tstyle={{ display: 'flex', color: COLORS.content.primary }}\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst GoBackIcon = () => {\n\t\treturn (\n\t\t\t<BackIcon\n\t\t\t\twidth={12}\n\t\t\t\theight={12}\n\t\t\t\tstyle={{ color: COLORS.content.secondary }}\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst onSelectingVariable = (variable: VariableV3) => {\n\t\tif (props.disabled) return;\n\t\tif (isEvaluationList) {\n\t\t\tconst evalVariableValue = matchVariable(variable as VariableV3);\n\t\t\tonSelect({\n\t\t\t\t...variable,\n\t\t\t\tactualValue: evalVariableValue,\n\t\t\t} as VariableV3);\n\t\t} else {\n\t\t\tif (variable.isDefaultValueSupported && !skipDefaultVariableContent) {\n\t\t\t\tsetChosenForDefault(variable);\n\t\t\t\tsetOpenDefaultVariablePanel(true);\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tonSelect(variable as VariableV3);\n\t\t}\n\t};\n\n\treturn (\n\t\t<VariablePickerContext.Provider\n\t\t\tvalue={{\n\t\t\t\tvariables,\n\t\t\t\tsearchText,\n\t\t\t\tsubHeaderStack,\n\t\t\t\tshowRecommended,\n\t\t\t\tsetSubHeaderStack,\n\t\t\t\tsetSearchText,\n\t\t\t\tsetVariables,\n\t\t\t\tsetShowRecommended,\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\ttabIndex={-1}\n\t\t\t\tid=\"variable-picker-v3\"\n\t\t\t\tstyle={{\n\t\t\t\t\tbackgroundColor: 'white',\n\t\t\t\t\tborderRadius: 8,\n\t\t\t\t\theight: '100%',\n\t\t\t\t\toutline: 'none',\n\t\t\t\t}}\n\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t>\n\t\t\t\t{(showHeader \|\| showBackButton \|\| openDefaultVariablePanel) && (\n\t\t\t\t\t<HeaderWrapper openDefault={openDefaultVariablePanel}>\n\t\t\t\t\t\t<div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>\n\t\t\t\t\t\t\t{(showBackButton \|\| openDefaultVariablePanel) && (\n\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\tIcon={HeaderBackIcon}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tif (openDefaultVariablePanel) {\n\t\t\t\t\t\t\t\t\t\t\tsetOpenDefaultVariablePanel(false);\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\tonBackButtonClick && onBackButtonClick();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{(showHeader \|\| openDefaultVariablePanel) && (\n\t\t\t\t\t\t\t\t<TitleRegular>\n\t\t\t\t\t\t\t\t\t{openDefaultVariablePanel\n\t\t\t\t\t\t\t\t\t\t? 'Set up'\n\t\t\t\t\t\t\t\t\t\t: headerText ?? 'Select Variable'}\n\t\t\t\t\t\t\t\t</TitleRegular>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{shouldShowHeaderInsideCross && (\n\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\tstyle={{ color: '#212121' }}\n\t\t\t\t\t\t\t\tIcon={CrossIcon}\n\t\t\t\t\t\t\t\tonClick={() => props.onClose && props.onClose()}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</HeaderWrapper>\n\t\t\t\t)}\n\t\t\t\t{openDefaultVariablePanel &&\n\t\t\t\tchosenForDefault &&\n\t\t\t\t!skipDefaultVariableContent ? (\n\t\t\t\t\t<DefaultVariableContent\n\t\t\t\t\t\tvariable={chosenForDefault}\n\t\t\t\t\t\tonInsertVariable={(updated) => {\n\t\t\t\t\t\t\tonSelect(updated);\n\t\t\t\t\t\t\tonDefaultVariableSelect?.(updated);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tpadding: '0 16px',\n\t\t\t\t\t\t\t\tpaddingTop: 12,\n\t\t\t\t\t\t\t\tbackgroundColor: COLORS.surface.subdued,\n\t\t\t\t\t\t\t\tborderTopLeftRadius: 8,\n\t\t\t\t\t\t\t\tborderTopRightRadius: 8,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\tid=\"search-bar-v3-picker\"\n\t\t\t\t\t\t\t\tonBlur={(e) => {\n\t\t\t\t\t\t\t\t\tprops.onSearchBlur && props.onSearchBlur(e);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tvalue={searchText}\n\t\t\t\t\t\t\t\tnoKeyDownChange\n\t\t\t\t\t\t\t\tplaceholder=\"Search\"\n\t\t\t\t\t\t\t\tonChangeText={onSearch}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<RecommendWrapper>\n\t\t\t\t\t\t\t<BodySecondary style={{ color: COLORS.content.secondary }}>\n\t\t\t\t\t\t\t\tOnly Recommended\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t<Switch\n\t\t\t\t\t\t\t\tvalue={showRecommended}\n\t\t\t\t\t\t\t\tonValueChange={async (val) => {\n\t\t\t\t\t\t\t\t\tawait handleRecommendedChange(val);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</RecommendWrapper>\n\t\t\t\t\t\t{subHeaderStack.length > 0 && (\n\t\t\t\t\t\t\t<BackHeader>\n\t\t\t\t\t\t\t\t<div style={{ position: 'absolute', left: 16 }}>\n\t\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\t\tid=\"back-btn-v3\"\n\t\t\t\t\t\t\t\t\t\tstyle={{ display: 'flex' }}\n\t\t\t\t\t\t\t\t\t\tIcon={GoBackIcon}\n\t\t\t\t\t\t\t\t\t\tonClick={handleBackClick}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{subHeaderStack[subHeaderStack.length - 1].displayName}\n\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t</BackHeader>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{variables.length > 0 ? (\n\t\t\t\t\t\t\t\t<Container height={calculateHeight()}>\n\t\t\t\t\t\t\t\t\t{variables.map((variable, index) => {\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\tvariable.displayName &&\n\t\t\t\t\t\t\t\t\t\t\ttypeof variable.variables !== 'undefined'\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\tkey={variable.displayName + showRecommended} // to re-render the component\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tborderBottom: `1px solid ${COLORS.stroke.primary}`,\n\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<BikAccordion\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tarrowColor={COLORS.content.primary}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tautoOpen={autoOpenFirst && index === 0}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\theaderPadding=\"12px 16px\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\theader={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<TitleSmall\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{ color: COLORS.content.secondary }}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{highlightSearchText(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvariable.displayName,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsearchText,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<SubHeaderItems\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tparentVariable={variable}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={props.disabled ?? false}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsearchText={searchText}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvariable={variable.variables}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonSelect={(variable) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvariable.isDefaultValueSupported &&\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t!skipDefaultVariableContent\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetChosenForDefault(variable);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetOpenDefaultVariablePanel(true);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonSelect(variable as VariableV3);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</BikAccordion>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t} else if (variable.displayName) {\n\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\t\t\t\t\t\t\tbody={renderTooltipBody(variable as VariableV3)}\n\t\t\t\t\t\t\t\t\t\t\t\t\tplacement=\"bottom\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<ListItem\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tprops.disabled\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'readonly'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: (variable as VariableV3)?.selected\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'selected'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'default'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tversion=\"2.0\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tleadingIcon={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t(variable as VariableV3)?.selected \|\|\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tprops.disabled ? (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div style={{ flexShrink: 0 }}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<AddIcon width={14} height={14} />\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcustomListItemLabel={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tgap: 4,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfontSize: '14px',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolor: COLORS.text.primary,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{highlightSearchText(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvariable.displayName,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsearchText,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{!variable.isAvailable && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<Tooltip body=\"Not Recommended\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{ display: 'flex', marginTop: 2 }}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<WarnIcon\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tlistItem={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlabel: variable.displayName,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue: variable.displayName,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsubText={variable.description \|\| ''}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={() =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonSelectingVariable(variable as VariableV3)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t<SubHeaderItems\n\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={props.disabled ?? false}\n\t\t\t\t\t\t\t\t\t\t\t\t\tsearchText={searchText}\n\t\t\t\t\t\t\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariable={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tvariable as unknown as {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t[key: string]: SubHeader \| VariableV3;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonSelect={(variable: VariableV3) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonSelectingVariable(variable as VariableV3)\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t</Container>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<NoResult height={calculateHeight()} searchText={searchText} />\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</VariablePickerContext.Provider>\n\t);\n};\n"],"names":["variableRegex","props","data","onSelect","showHeader","showBackButton","hideHeaderCross","onBackButtonClick","isEvaluationList","autoOpenFirst","headerText","contentHeight","onDefaultVariableSelect","skipDefaultVariableContent","variables","setVariables","useState","searchText","setSearchText","subHeaderStack","setSubHeaderStack","searchedFrom","setSearchedFrom","showRecommended","setShowRecommended","dataSource","setDataSource","openDefaultVariablePanel","setOpenDefaultVariablePanel","chosenForDefault","setChosenForDefault","shouldShowHeaderInsideCross","type","PickerType","EMBEDDED","useEffect","handleRecommendedChange","length","val","__awaiter","output","showOnlyRecommendedVariables","isInSearchStartPage","displayName","result","searchVariables","calculateHeight","pickerContentHeight","onSelectingVariable","variable","disabled","evalVariableValue","actualValue","match","path","replace","split","forEach","value","index","isArray","test","checkIfArray","matches","arrayName","actualValueEval","matchVariable","Object","isDefaultValueSupported","_jsx","jsx","VariablePickerContext","Provider","assign","children","_jsxs","jsxs","tabIndex","id","style","backgroundColor","borderRadius","height","outline","onClick","e","stopPropagation","HeaderWrapper","openDefault","display","alignItems","gap","IconButton","Icon","HeaderBackIcon","BackIcon","width","color","COLORS","content","primary","TitleRegular","CrossIcon","onClose","DefaultVariableContent","onInsertVariable","updated","_Fragment","padding","paddingTop","surface","subdued","borderTopLeftRadius","borderTopRightRadius","Input","onBlur","onSearchBlur","noKeyDownChange","placeholder","onChangeText","text","recommended","latestSubHeader","RecommendWrapper","BodySecondary","secondary","Switch","onValueChange","BackHeader","position","left","GoBackIcon","_searchText","newSubHeaderStack","poppedElement","pop","BodyCaption","Container","map","borderBottom","stroke","BikAccordion","arrowColor","autoOpen","headerPadding","header","TitleSmall","highlightSearchText","SubHeaderItems","parentVariable","_a","Tooltip","body","renderTooltipBody","placement","ListItem","variant","selected","version","leadingIcon","flexShrink","AddIcon","customListItemLabel","fontSize","isAvailable","marginTop","WarnIcon","listItem","label","subText","description","_b","NoResult"],"mappings":"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"}
1	+ {"version":3,"file":"Content.js","sources":["../../../../src/components/variable-picker-v3/Content.tsx"],"sourcesContent":["import BackIcon from '@src/assets/icons/arrow_back.svg';\nimport CrossIcon from '@src/assets/icons/cross.svg';\nimport AddIcon from '@src/assets/icons/plus.svg';\nimport WarnIcon from '@src/assets/icons/triangle_error.svg';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport { BikAccordion } from '../accordion';\nimport { IconButton } from '../icon-button';\nimport { Input } from '../input';\nimport { ListItem } from '../list-item';\nimport { Switch } from '../switch';\nimport { Tooltip } from '../tooltips';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleRegular,\n\tTitleSmall,\n} from '../TypographyStyle';\nimport { VariablePickerContext } from './context';\nimport { DefaultVariableContent } from './DefaultVariableContent';\nimport { highlightSearchText } from './highlightSearchText';\nimport {\n\tPickerType,\n\tSubHeader,\n\tVariablePickerV3Props,\n\tVariableV3,\n} from './model';\nimport NoResult from './NoResult';\nimport { showOnlyRecommendedVariables } from './recommendVaribles';\nimport { searchVariables } from './searchVariables';\nimport {\n\tBackHeader,\n\tContainer,\n\tHeaderWrapper,\n\tRecommendWrapper,\n} from './styles';\nimport SubHeaderItems, { renderTooltipBody } from './SubHeaderItems';\n\ntype Props = VariablePickerV3Props;\n\nconst variableRegex = /.\\../;\nconst checkIfArray = (value: string) => {\n\tconst regex = /\\w+\\[\\d+\\]/g;\n\treturn regex.test(value);\n};\n\nconst matchVariable = (variable: VariableV3) => {\n\tif (variable.actualValue.match(variableRegex)) {\n\t\tconst path = variable.actualValue\n\t\t\t.replace('{{', '')\n\t\t\t.replace('}}', '')\n\t\t\t.split('.');\n\t\tlet evalVariableValue = path[0];\n\t\tpath.forEach((value, index) => {\n\t\t\tif (index === 0) return;\n\t\t\tconst isArray = checkIfArray(value);\n\t\t\tif (isArray) {\n\t\t\t\t// ex: event_memberships[0] -> ['event_memberships'][0]\n\t\t\t\tconst matches = value.match(/(\\w+)\\[(\\d+)\\]/);\n\t\t\t\tif (matches) {\n\t\t\t\t\tconst arrayName = matches[1];\n\t\t\t\t\tconst index = matches[2];\n\t\t\t\t\tevalVariableValue = evalVariableValue + `['${arrayName}'][${index}]`;\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tevalVariableValue = evalVariableValue + `['${value}']`;\n\t\t\t}\n\t\t});\n\t\treturn evalVariableValue;\n\t} else {\n\t\tconst value = variable.actualValueEval\n\t\t\t? variable.actualValueEval\n\t\t\t: variable.actualValue;\n\t\treturn value;\n\t}\n};\n\nexport const VariablePickerContent: React.FC<Props> = (\n\tprops: VariablePickerV3Props,\n) => {\n\tconst {\n\t\tdata,\n\t\tonSelect,\n\t\tshowHeader,\n\t\tshowBackButton,\n\t\thideHeaderCross,\n\t\tonBackButtonClick,\n\t\tisEvaluationList,\n\t\tautoOpenFirst,\n\t\theaderText,\n\t\tcontentHeight,\n\t\tonDefaultVariableSelect,\n\t\tskipDefaultVariableContent,\n\t} = props;\n\n\tconst [variables, setVariables] = useState(data); // modified data after search\n\tconst [searchText, setSearchText] = useState<string>('');\n\tconst [subHeaderStack, setSubHeaderStack] = useState<any[]>([]); // push variable object after every level\n\tconst [searchedFrom, setSearchedFrom] = useState<string>(''); // from which level did the user search from\n\tconst [showRecommended, setShowRecommended] = useState<boolean>(false);\n\tconst [dataSource, setDataSource] = useState<any[]>([]); // for search, maintaining original copy\n\tconst [openDefaultVariablePanel, setOpenDefaultVariablePanel] =\n\t\tuseState(false);\n\tconst [chosenForDefault, setChosenForDefault] = useState<VariableV3 \| null>();\n\tconst containerRef = useRef<HTMLDivElement>(null);\n\tconst scrollPositionStack = useRef<number[]>([]);\n\tconst shouldShowHeaderInsideCross =\n\t\topenDefaultVariablePanel &&\n\t\tprops.type === PickerType.EMBEDDED &&\n\t\t!hideHeaderCross;\n\n\t// useEffect(() => {\n\t// \t// TODO: based on new data, update existing variables if available\n\t// \tsetVariables(data);\n\t// }, [data]);\n\n\tuseEffect(() => {\n\t\thandleRecommendedChange(true);\n\t}, []);\n\n\tuseEffect(() => {\n\t\tif (subHeaderStack.length > 0) {\n\t\t\tsetDataSource([subHeaderStack[subHeaderStack.length - 1]]);\n\t\t} else {\n\t\t\tsetDataSource(data);\n\t\t}\n\t}, [subHeaderStack]);\n\n\tconst handleBackClick = (e: any) => {\n\t\te.stopPropagation();\n\t\tlet _searchText = searchText;\n\t\tconst newSubHeaderStack = [...subHeaderStack];\n\t\tconst poppedElement = newSubHeaderStack.pop();\n\t\tsetSubHeaderStack(newSubHeaderStack);\n\t\tif (poppedElement.displayName === searchedFrom) {\n\t\t\tsetSearchText('');\n\t\t\t_searchText = ''; // so that search is not trigerred in the below code\n\t\t}\n\t\tconst savedScrollTop = scrollPositionStack.current.pop() ?? 0;\n\t\tif (_searchText.length > 0) {\n\t\t\t// maintain the search result when going back\n\t\t\tconst dataSource =\n\t\t\t\tnewSubHeaderStack.length > 0\n\t\t\t\t\t? [newSubHeaderStack[newSubHeaderStack.length - 1]]\n\t\t\t\t\t: data;\n\t\t\tconst result = searchVariables(\n\t\t\t\t_searchText,\n\t\t\t\tdataSource,\n\t\t\t\tnewSubHeaderStack,\n\t\t\t);\n\t\t\tif (showRecommended) {\n\t\t\t\tconst recommended = showOnlyRecommendedVariables(\n\t\t\t\t\tresult,\n\t\t\t\t\tnewSubHeaderStack,\n\t\t\t\t);\n\t\t\t\tsetVariables(recommended);\n\t\t\t} else {\n\t\t\t\tsetVariables(result);\n\t\t\t}\n\t\t} else {\n\t\t\tif (newSubHeaderStack.length > 0) {\n\t\t\t\tif (showRecommended) {\n\t\t\t\t\tconst recommended = showOnlyRecommendedVariables(\n\t\t\t\t\t\t[newSubHeaderStack[newSubHeaderStack.length - 1].variables],\n\t\t\t\t\t\tnewSubHeaderStack,\n\t\t\t\t\t);\n\t\t\t\t\tsetVariables(recommended);\n\t\t\t\t} else {\n\t\t\t\t\tsetVariables([\n\t\t\t\t\t\tnewSubHeaderStack[newSubHeaderStack.length - 1].variables,\n\t\t\t\t\t]);\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tif (showRecommended) {\n\t\t\t\t\tconst recommended = showOnlyRecommendedVariables(\n\t\t\t\t\t\tdata,\n\t\t\t\t\t\tsubHeaderStack,\n\t\t\t\t\t);\n\t\t\t\t\tsetVariables(recommended);\n\t\t\t\t} else {\n\t\t\t\t\tsetVariables(data);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\trequestAnimationFrame(() => {\n\t\t\tif (containerRef.current) {\n\t\t\t\tcontainerRef.current.scrollTop = savedScrollTop;\n\t\t\t}\n\t\t});\n\t};\n\n\tconst handleRecommendedChange = async (val) => {\n\t\tsetShowRecommended(val);\n\t\tif (val) {\n\t\t\tconst output = showOnlyRecommendedVariables(variables, subHeaderStack);\n\t\t\tsetVariables(output);\n\t\t} else {\n\t\t\tif (subHeaderStack.length > 0) {\n\t\t\t\t// dont apply search if not in the page where search started\n\t\t\t\tconst isInSearchStartPage =\n\t\t\t\t\tsearchedFrom == subHeaderStack[subHeaderStack.length - 1].displayName;\n\t\t\t\tif (searchText.length > 0 && isInSearchStartPage) {\n\t\t\t\t\tconst result = searchVariables(\n\t\t\t\t\t\tsearchText,\n\t\t\t\t\t\tdataSource,\n\t\t\t\t\t\tsubHeaderStack,\n\t\t\t\t\t);\n\t\t\t\t\tsetVariables(result);\n\t\t\t\t} else {\n\t\t\t\t\tsetVariables([subHeaderStack[subHeaderStack.length - 1].variables]);\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tif (searchText.length > 0) {\n\t\t\t\t\tconst result = searchVariables(\n\t\t\t\t\t\tsearchText,\n\t\t\t\t\t\tdataSource,\n\t\t\t\t\t\tsubHeaderStack,\n\t\t\t\t\t);\n\t\t\t\t\tsetVariables(result);\n\t\t\t\t} else {\n\t\t\t\t\tsetVariables(data);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t};\n\n\tconst calculateHeight = () => {\n\t\tif (contentHeight) {\n\t\t\treturn contentHeight;\n\t\t}\n\t\tlet pickerContentHeight = 131;\n\t\tif (subHeaderStack.length > 0) {\n\t\t\tpickerContentHeight += 32;\n\t\t}\n\t\tif (props.showHeader \|\| props.showBackButton) {\n\t\t\tpickerContentHeight += 40;\n\t\t}\n\t\treturn `calc(100% - ${pickerContentHeight}px)`;\n\t};\n\n\tconst onSearch = (text: string) => {\n\t\tif (!text) {\n\t\t\tsetSearchedFrom('');\n\t\t}\n\t\tconst result = searchVariables(text, dataSource, subHeaderStack);\n\t\tif (showRecommended) {\n\t\t\tconst recommended = showOnlyRecommendedVariables(result, subHeaderStack);\n\t\t\tsetVariables(recommended);\n\t\t} else {\n\t\t\tsetVariables(result);\n\t\t}\n\t\tsetSearchText(text);\n\t\tconst latestSubHeader =\n\t\t\tsubHeaderStack.length > 0\n\t\t\t\t? subHeaderStack[subHeaderStack.length - 1].displayName\n\t\t\t\t: 'home';\n\t\tsetSearchedFrom(latestSubHeader);\n\t};\n\n\tconst HeaderBackIcon = () => {\n\t\treturn (\n\t\t\t<BackIcon\n\t\t\t\twidth={16}\n\t\t\t\theight={16}\n\t\t\t\tstyle={{ display: 'flex', color: COLORS.content.primary }}\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst GoBackIcon = () => {\n\t\treturn (\n\t\t\t<BackIcon\n\t\t\t\twidth={12}\n\t\t\t\theight={12}\n\t\t\t\tstyle={{ color: COLORS.content.secondary }}\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst onSelectingVariable = (variable: VariableV3) => {\n\t\tif (props.disabled) return;\n\t\tif (isEvaluationList) {\n\t\t\tconst evalVariableValue = matchVariable(variable as VariableV3);\n\t\t\tonSelect({\n\t\t\t\t...variable,\n\t\t\t\tactualValue: evalVariableValue,\n\t\t\t} as VariableV3);\n\t\t} else {\n\t\t\tif (variable.isDefaultValueSupported && !skipDefaultVariableContent) {\n\t\t\t\tsetChosenForDefault(variable);\n\t\t\t\tsetOpenDefaultVariablePanel(true);\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tonSelect(variable as VariableV3);\n\t\t}\n\t};\n\n\treturn (\n\t\t<VariablePickerContext.Provider\n\t\t\tvalue={{\n\t\t\t\tvariables,\n\t\t\t\tsearchText,\n\t\t\t\tsubHeaderStack,\n\t\t\t\tshowRecommended,\n\t\t\t\tsetSubHeaderStack,\n\t\t\t\tsetSearchText,\n\t\t\t\tsetVariables,\n\t\t\t\tsetShowRecommended,\n\t\t\t\tcontainerRef,\n\t\t\t\tscrollPositionStack,\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\ttabIndex={-1}\n\t\t\t\tid=\"variable-picker-v3\"\n\t\t\t\tstyle={{\n\t\t\t\t\tbackgroundColor: 'white',\n\t\t\t\t\tborderRadius: 8,\n\t\t\t\t\theight: '100%',\n\t\t\t\t\toutline: 'none',\n\t\t\t\t}}\n\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t>\n\t\t\t\t{(showHeader \|\| showBackButton \|\| openDefaultVariablePanel) && (\n\t\t\t\t\t<HeaderWrapper openDefault={openDefaultVariablePanel}>\n\t\t\t\t\t\t<div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>\n\t\t\t\t\t\t\t{(showBackButton \|\| openDefaultVariablePanel) && (\n\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\tIcon={HeaderBackIcon}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tif (openDefaultVariablePanel) {\n\t\t\t\t\t\t\t\t\t\t\tsetOpenDefaultVariablePanel(false);\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\tonBackButtonClick && onBackButtonClick();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{(showHeader \|\| openDefaultVariablePanel) && (\n\t\t\t\t\t\t\t\t<TitleRegular>\n\t\t\t\t\t\t\t\t\t{openDefaultVariablePanel\n\t\t\t\t\t\t\t\t\t\t? 'Set up'\n\t\t\t\t\t\t\t\t\t\t: headerText ?? 'Select Variable'}\n\t\t\t\t\t\t\t\t</TitleRegular>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{shouldShowHeaderInsideCross && (\n\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\tstyle={{ color: '#212121' }}\n\t\t\t\t\t\t\t\tIcon={CrossIcon}\n\t\t\t\t\t\t\t\tonClick={() => props.onClose && props.onClose()}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</HeaderWrapper>\n\t\t\t\t)}\n\t\t\t\t{openDefaultVariablePanel &&\n\t\t\t\tchosenForDefault &&\n\t\t\t\t!skipDefaultVariableContent ? (\n\t\t\t\t\t<DefaultVariableContent\n\t\t\t\t\t\tvariable={chosenForDefault}\n\t\t\t\t\t\tonInsertVariable={(updated) => {\n\t\t\t\t\t\t\tonSelect(updated);\n\t\t\t\t\t\t\tonDefaultVariableSelect?.(updated);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tpadding: '0 16px',\n\t\t\t\t\t\t\t\tpaddingTop: 12,\n\t\t\t\t\t\t\t\tbackgroundColor: COLORS.surface.subdued,\n\t\t\t\t\t\t\t\tborderTopLeftRadius: 8,\n\t\t\t\t\t\t\t\tborderTopRightRadius: 8,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\tid=\"search-bar-v3-picker\"\n\t\t\t\t\t\t\t\tonBlur={(e) => {\n\t\t\t\t\t\t\t\t\tprops.onSearchBlur && props.onSearchBlur(e);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tvalue={searchText}\n\t\t\t\t\t\t\t\tnoKeyDownChange\n\t\t\t\t\t\t\t\tplaceholder=\"Search\"\n\t\t\t\t\t\t\t\tonChangeText={onSearch}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<RecommendWrapper>\n\t\t\t\t\t\t\t<BodySecondary style={{ color: COLORS.content.secondary }}>\n\t\t\t\t\t\t\t\tOnly Recommended\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t<Switch\n\t\t\t\t\t\t\t\tvalue={showRecommended}\n\t\t\t\t\t\t\t\tonValueChange={async (val) => {\n\t\t\t\t\t\t\t\t\tawait handleRecommendedChange(val);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</RecommendWrapper>\n\t\t\t\t\t\t{subHeaderStack.length > 0 && (\n\t\t\t\t\t\t\t<BackHeader>\n\t\t\t\t\t\t\t\t<div style={{ position: 'absolute', left: 16 }}>\n\t\t\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\t\t\tid=\"back-btn-v3\"\n\t\t\t\t\t\t\t\t\t\tstyle={{ display: 'flex' }}\n\t\t\t\t\t\t\t\t\t\tIcon={GoBackIcon}\n\t\t\t\t\t\t\t\t\t\tonClick={handleBackClick}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{subHeaderStack[subHeaderStack.length - 1].displayName}\n\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t</BackHeader>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{variables.length > 0 ? (\n\t\t\t\t\t\t\t\t<Container ref={containerRef} height={calculateHeight()}>\n\t\t\t\t\t\t\t\t\t{variables.map((variable, index) => {\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\tvariable.displayName &&\n\t\t\t\t\t\t\t\t\t\t\ttypeof variable.variables !== 'undefined'\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\tkey={variable.displayName + showRecommended} // to re-render the component\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tborderBottom: `1px solid ${COLORS.stroke.primary}`,\n\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<BikAccordion\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tarrowColor={COLORS.content.primary}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tautoOpen={autoOpenFirst && index === 0}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\theaderPadding=\"12px 16px\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\theader={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<TitleSmall\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{ color: COLORS.content.secondary }}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{highlightSearchText(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvariable.displayName,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsearchText,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<SubHeaderItems\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tparentVariable={variable}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={props.disabled ?? false}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsearchText={searchText}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvariable={variable.variables}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonSelect={(variable) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvariable.isDefaultValueSupported &&\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t!skipDefaultVariableContent\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetChosenForDefault(variable);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetOpenDefaultVariablePanel(true);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonSelect(variable as VariableV3);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t</BikAccordion>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t} else if (variable.displayName) {\n\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\t\t\t\t\t\t\tbody={renderTooltipBody(variable as VariableV3)}\n\t\t\t\t\t\t\t\t\t\t\t\t\tplacement=\"bottom\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<ListItem\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tprops.disabled\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'readonly'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: (variable as VariableV3)?.selected\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'selected'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'default'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tversion=\"2.0\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tleadingIcon={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t(variable as VariableV3)?.selected \|\|\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tprops.disabled ? (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div style={{ flexShrink: 0 }}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<AddIcon width={14} height={14} />\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcustomListItemLabel={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tgap: 4,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfontSize: '14px',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolor: COLORS.text.primary,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{highlightSearchText(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvariable.displayName,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsearchText,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{!variable.isAvailable && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<Tooltip body=\"Not Recommended\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{ display: 'flex', marginTop: 2 }}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<WarnIcon\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tlistItem={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlabel: variable.displayName,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvalue: variable.displayName,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsubText={variable.description \|\| ''}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={() =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tonSelectingVariable(variable as VariableV3)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t<SubHeaderItems\n\t\t\t\t\t\t\t\t\t\t\t\t\tdisabled={props.disabled ?? false}\n\t\t\t\t\t\t\t\t\t\t\t\t\tsearchText={searchText}\n\t\t\t\t\t\t\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariable={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tvariable as unknown as {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t[key: string]: SubHeader \| VariableV3;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonSelect={(variable: VariableV3) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonSelectingVariable(variable as VariableV3)\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t</Container>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<NoResult height={calculateHeight()} searchText={searchText} />\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</VariablePickerContext.Provider>\n\t);\n};\n"],"names":["variableRegex","props","data","onSelect","showHeader","showBackButton","hideHeaderCross","onBackButtonClick","isEvaluationList","autoOpenFirst","headerText","contentHeight","onDefaultVariableSelect","skipDefaultVariableContent","variables","setVariables","useState","searchText","setSearchText","subHeaderStack","setSubHeaderStack","searchedFrom","setSearchedFrom","showRecommended","setShowRecommended","dataSource","setDataSource","openDefaultVariablePanel","setOpenDefaultVariablePanel","chosenForDefault","setChosenForDefault","containerRef","useRef","scrollPositionStack","shouldShowHeaderInsideCross","type","PickerType","EMBEDDED","useEffect","handleRecommendedChange","length","val","__awaiter","output","showOnlyRecommendedVariables","isInSearchStartPage","displayName","result","searchVariables","calculateHeight","pickerContentHeight","onSelectingVariable","variable","disabled","evalVariableValue","actualValue","match","path","replace","split","forEach","value","index","isArray","test","checkIfArray","matches","arrayName","actualValueEval","matchVariable","Object","isDefaultValueSupported","_jsx","jsx","VariablePickerContext","Provider","assign","children","_jsxs","jsxs","tabIndex","id","style","backgroundColor","borderRadius","height","outline","onClick","e","stopPropagation","HeaderWrapper","openDefault","display","alignItems","gap","IconButton","Icon","HeaderBackIcon","BackIcon","width","color","COLORS","content","primary","TitleRegular","CrossIcon","onClose","DefaultVariableContent","onInsertVariable","updated","_Fragment","padding","paddingTop","surface","subdued","borderTopLeftRadius","borderTopRightRadius","Input","onBlur","onSearchBlur","noKeyDownChange","placeholder","onChangeText","text","recommended","latestSubHeader","RecommendWrapper","BodySecondary","secondary","Switch","onValueChange","BackHeader","position","left","GoBackIcon","_searchText","newSubHeaderStack","poppedElement","pop","savedScrollTop","_a","current","requestAnimationFrame","scrollTop","BodyCaption","Container","ref","map","borderBottom","stroke","BikAccordion","arrowColor","autoOpen","headerPadding","header","TitleSmall","highlightSearchText","SubHeaderItems","parentVariable","Tooltip","body","renderTooltipBody","placement","ListItem","variant","selected","version","leadingIcon","flexShrink","AddIcon","customListItemLabel","fontSize","isAvailable","marginTop","WarnIcon","listItem","label","subText","description","_b","NoResult"],"mappings":"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"}

package/dist/cjs/components/variable-picker-v3/NoResult.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NoResult.js","sources":["../../../../src/components/variable-picker-v3/NoResult.tsx"],"sourcesContent":["import SearchIcon from '@src/assets/icons/search.svg';\nimport styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\nimport { BodySecondary, TitleMedium } from '../TypographyStyle';\n\ntype Props = {\n\theight: string;\n\tsearchText?: string;\n};\n\nconst NoResult = (props: Props) => {\n\treturn (\n\t\t<Container height={props.height}>\n\t\t\t<IconWrapper>\n\t\t\t\t<SearchIcon width={24} height={24} color={COLORS.background.brand} />\n\t\t\t</IconWrapper>\n\t\t\t<div style={{ textAlign: 'center' }}>\n\t\t\t\t<TitleMedium>No results found</TitleMedium>\n\t\t\t\t{props.searchText ? (\n\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\tstyle={{ color: COLORS.content.secondary, marginTop: 8 }}\n\t\t\t\t\t>\n\t\t\t\t\t\t{`Sorry we could not find any results for \"${props.searchText}\"`}\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t) : (\n\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\tstyle={{ color: COLORS.content.secondary, marginTop: 8 }}\n\t\t\t\t\t>\n\t\t\t\t\t\t{`Sorry we could not find any variables`}\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</Container>\n\t);\n};\n\nexport default NoResult;\n\nconst Container = styled.div<{ height: string }>`\n\tdisplay: flex;\n\tgap: 16px;\n\tflex-direction: column;\n\talign-items: center;\n\tjustify-content: center;\n\tpadding: 0 16px;\n\theight: ${(props) => props.height};\n`;\n\nconst IconWrapper = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tbackground-color: ${COLORS.background.brandLight};\n\twidth: 48px;\n\theight: 48px;\n\tborder-radius: 24px;\n`;\n"],"names":["NoResult","Container","styled","div","props","height","IconWrapper","COLORS","background","brandLight","_jsxs","Object","assign","children","_jsx","jsx","SearchIcon","width","color","brand","jsxs","style","textAlign","TitleMedium","searchText","BodySecondary","content","secondary","marginTop"],"mappings":"gVAUMA,MA4BAC,EAAYC,EAAM,QAACC,GAAuB;;;;;;;WAOpCC,GAAUA,EAAMC;EAGtBC,EAAcJ,EAAM,QAACC,GAAG;;;;qBAITI,EAAMA,OAACC,WAAWC;;;;kBA1CrBL,GAEhBM,OAACT,EAAUU,OAAAC,OAAA,CAAAP,OAAQD,EAAMC,QAAM,CAAAQ,SAAA,CAC9BC,EAACC,IAAAT,YACAQ,EAACC,IAAAC,UAAW,CAAAC,MAAO,GAAIZ,OAAQ,GAAIa,MAAOX,EAAAA,OAAOC,WAAWW,UAE7DT,EAAKU,KAAA,MAAAT,OAAAC,OAAA,CAAAS,MAAO,CAAEC,UAAW,WAAU,CAAAT,SAAA,CAClCC,EAACC,IAAAQ,cAA0C,CAAAV,SAAA,qBAC1CT,EAAMoB,WACNV,MAACW,EAAaA,cAAAd,OAAAC,OAAA,CACbS,MAAO,CAAEH,MAAOX,EAAAA,OAAOmB,QAAQC,UAAWC,UAAW,IAAG,CAAAf,~~SAEvD~~,~~4CAA4CT~~,EAAMoB,iBAGpDV,EAAAC,IAACU,gBAAad,OAAAC,OAAA,CACbS,MAAO,CAAEH,MAAOX,EAAAA,OAAOmB,QAAQC,UAAWC,UAAW,IAAG,CAAAf,~~SAEvD~~"}
1	+ {"version":3,"file":"NoResult.js","sources":["../../../../src/components/variable-picker-v3/NoResult.tsx"],"sourcesContent":["import SearchIcon from '@src/assets/icons/search.svg';\nimport styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\nimport { BodySecondary, TitleMedium } from '../TypographyStyle';\n\ntype Props = {\n\theight: string;\n\tsearchText?: string;\n};\n\nconst NoResult = (props: Props) => {\n\treturn (\n\t\t<Container height={props.height}>\n\t\t\t<IconWrapper>\n\t\t\t\t<SearchIcon width={24} height={24} color={COLORS.background.brand} />\n\t\t\t</IconWrapper>\n\t\t\t<div style={{ textAlign: 'center' }}>\n\t\t\t\t<TitleMedium>No results found</TitleMedium>\n\t\t\t\t{props.searchText ? (\n\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\tstyle={{ color: COLORS.content.secondary, marginTop: 8 }}\n\t\t\t\t\t>\n\t\t\t\t\t\t{`Sorry we could not find any results for \"${props.searchText}\"`}\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t) : (\n\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\tstyle={{ color: COLORS.content.secondary, marginTop: 8 }}\n\t\t\t\t\t>\n\t\t\t\t\t\t{`Sorry we could not find any variables`}\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</Container>\n\t);\n};\n\nexport default NoResult;\n\nconst Container = styled.div<{ height: string }>`\n\tdisplay: flex;\n\tgap: 16px;\n\tflex-direction: column;\n\talign-items: center;\n\tjustify-content: center;\n\tpadding: 0 16px;\n\theight: ${(props) => props.height};\n`;\n\nconst IconWrapper = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tbackground-color: ${COLORS.background.brandLight};\n\twidth: 48px;\n\theight: 48px;\n\tborder-radius: 24px;\n`;\n"],"names":["NoResult","Container","styled","div","props","height","IconWrapper","COLORS","background","brandLight","_jsxs","Object","assign","children","_jsx","jsx","SearchIcon","width","color","brand","jsxs","style","textAlign","TitleMedium","searchText","BodySecondary","content","secondary","marginTop"],"mappings":"gVAUMA,MA4BAC,EAAYC,EAAM,QAACC,GAAuB;;;;;;;WAOpCC,GAAUA,EAAMC;EAGtBC,EAAcJ,EAAM,QAACC,GAAG;;;;qBAITI,EAAMA,OAACC,WAAWC;;;;kBA1CrBL,GAEhBM,OAACT,EAAUU,OAAAC,OAAA,CAAAP,OAAQD,EAAMC,QAAM,CAAAQ,SAAA,CAC9BC,EAACC,IAAAT,YACAQ,EAACC,IAAAC,UAAW,CAAAC,MAAO,GAAIZ,OAAQ,GAAIa,MAAOX,EAAAA,OAAOC,WAAWW,UAE7DT,EAAKU,KAAA,MAAAT,OAAAC,OAAA,CAAAS,MAAO,CAAEC,UAAW,WAAU,CAAAT,SAAA,CAClCC,EAACC,IAAAQ,cAA0C,CAAAV,SAAA,qBAC1CT,EAAMoB,WACNV,MAACW,EAAaA,cAAAd,OAAAC,OAAA,CACbS,MAAO,CAAEH,MAAOX,EAAAA,OAAOmB,QAAQC,UAAWC,UAAW,IAAG,CAAAf,SAEX,4CAAAT,EAAMoB,iBAGpDV,EAAAC,IAACU,gBAAad,OAAAC,OAAA,CACbS,MAAO,CAAEH,MAAOX,EAAAA,OAAOmB,QAAQC,UAAWC,UAAW,IAAG,CAAAf,SAEhB"}

package/dist/cjs/components/variable-picker-v3/SubHeaderItems.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/chevronRight.svg.js"),t=require("../../assets/icons/plus.svg.js"),i=require("../../assets/icons/sub_category.svg.js"),l=require("../../assets/icons/triangle_error.svg.js"),a=require("lodash/cloneDeep"),r=require("../../constants/Theme.js"),o=require("../list-item/ListItem.js"),n=require("../tooltips/Tooltip.js"),c=require("../TypographyStyle.js"),d=require("./context.js"),u=require("./highlightSearchText.js"),h=require("./recommendVaribles.js");function j(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var x=j(a);const b=e=>{var s;return(null===(s=e.contextQ)||void 0===s?void 0:s.join(" > "))||""};exports.default=a=>{const{onSelect:j,variable:p,searchText:y,disabled:m,parentVariable:g}=a,{subHeaderStack:v,setSubHeaderStack:f,setVariables:O,showRecommended:S}=d.useVariablePickerContext();return e.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:4}},{children:Object.keys(p).map(((a,d)=>{var T;if(void 0===p[a].variables||0===Object.keys((null===(T=p[a])||void 0===T?void 0:T.variables)||{}).length){const s=p[a];return e.jsx(n.Tooltip,Object.assign({body:b(s),placement:"bottom"},{children:e.jsx(o.ListItem,{variant:m?"readonly":(null==s?void 0:s.selected)?"selected":"default",version:"2.0",leadingIcon:(null==s?void 0:s.selected)||m?e.jsx(e.Fragment,{}):e.jsx("div",Object.assign({style:{flexShrink:0}},{children:e.jsx(t.default,{width:14,height:14})})),customListItemLabel:e.jsxs("div",Object.assign({style:{display:"flex",gap:4}},{children:[e.jsx(c.BodySecondary,Object.assign({style:{fontSize:"14px",color:r.COLORS.text.primary}},{children:u.highlightSearchText(s.displayName,y)})),!s.isAvailable&&e.jsx(n.Tooltip,Object.assign({body:"Not Recommended"},{children:e.jsx("div",Object.assign({style:{display:"flex",marginTop:2}},{children:e.jsx(l.default,{width:16,height:16,color:r.COLORS.content.secondary})}))}))]})),listItem:{label:s.displayName,value:s.displayName},subText:s.description||"",onClick:()=>{j(s)}})}),d)}return e.jsx(n.Tooltip,Object.assign({body:b(p[a]),placement:"bottom"},{children:e.jsx(o.ListItem,{variant:"default",version:"2.0",listItem:{label:p[a].displayName,value:p[a].displayName},customListItemLabel:e.jsx("div",Object.assign({style:{display:"flex",alignItems:"center"}},{children:e.jsx(c.BodySecondary,Object.assign({style:{fontSize:"14px",color:r.COLORS.text.primary}},{children:u.highlightSearchText(p[a].displayName,y)}))})),leadingIcon:e.jsx(i.default,{width:14,height:14}),subText:p[a].description||"",trailingIcon:e.jsx(s.default,{width:10,height:10,color:"#212121"}),onClick:()=>{const e=x.default(p[a]);void 0!==g&&(e.contextQ=[g.displayName]);const s=[...v,e];if(f(s),S){const t=h.showOnlyRecommendedVariables([e.variables],s);O(t)}else O([e.variables])}})}),d)}))}))},exports.renderTooltipBody=b;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/chevronRight.svg.js"),s=require("../../assets/icons/plus.svg.js"),i=require("../../assets/icons/sub_category.svg.js"),r=require("../../assets/icons/triangle_error.svg.js"),l=require("lodash/cloneDeep"),a=require("../../constants/Theme.js"),o=require("../list-item/ListItem.js"),n=require("../tooltips/Tooltip.js"),c=require("../TypographyStyle.js"),d=require("./context.js"),u=require("./highlightSearchText.js"),h=require("./recommendVaribles.js");function j(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=j(l);const x=e=>{var t;return(null===(t=e.contextQ)||void 0===t?void 0:t.join(" > "))||""};exports.default=l=>{const{onSelect:j,variable:b,searchText:y,disabled:m,parentVariable:g}=l,{subHeaderStack:v,setSubHeaderStack:f,setVariables:O,showRecommended:S,containerRef:T,scrollPositionStack:q}=d.useVariablePickerContext();return e.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:4}},{children:Object.keys(b).map(((l,d)=>{var I;if(void 0===b[l].variables||0===Object.keys((null===(I=b[l])||void 0===I?void 0:I.variables)||{}).length){const t=b[l];return e.jsx(n.Tooltip,Object.assign({body:x(t),placement:"bottom"},{children:e.jsx(o.ListItem,{variant:m?"readonly":(null==t?void 0:t.selected)?"selected":"default",version:"2.0",leadingIcon:(null==t?void 0:t.selected)||m?e.jsx(e.Fragment,{}):e.jsx("div",Object.assign({style:{flexShrink:0}},{children:e.jsx(s.default,{width:14,height:14})})),customListItemLabel:e.jsxs("div",Object.assign({style:{display:"flex",gap:4}},{children:[e.jsx(c.BodySecondary,Object.assign({style:{fontSize:"14px",color:a.COLORS.text.primary}},{children:u.highlightSearchText(t.displayName,y)})),!t.isAvailable&&e.jsx(n.Tooltip,Object.assign({body:"Not Recommended"},{children:e.jsx("div",Object.assign({style:{display:"flex",marginTop:2}},{children:e.jsx(r.default,{width:16,height:16,color:a.COLORS.content.secondary})}))}))]})),listItem:{label:t.displayName,value:t.displayName},subText:t.description||"",onClick:()=>{j(t)}})}),d)}return e.jsx(n.Tooltip,Object.assign({body:x(b[l]),placement:"bottom"},{children:e.jsx(o.ListItem,{variant:"default",version:"2.0",listItem:{label:b[l].displayName,value:b[l].displayName},customListItemLabel:e.jsx("div",Object.assign({style:{display:"flex",alignItems:"center"}},{children:e.jsx(c.BodySecondary,Object.assign({style:{fontSize:"14px",color:a.COLORS.text.primary}},{children:u.highlightSearchText(b[l].displayName,y)}))})),leadingIcon:e.jsx(i.default,{width:14,height:14}),subText:b[l].description||"",trailingIcon:e.jsx(t.default,{width:10,height:10,color:"#212121"}),onClick:()=>{T.current&&(q.current.push(T.current.scrollTop),T.current.scrollTop=0);const e=p.default(b[l]);void 0!==g&&(e.contextQ=[g.displayName]);const t=[...v,e];if(f(t),S){const s=h.showOnlyRecommendedVariables([e.variables],t);O(s)}else O([e.variables])}})}),d)}))}))},exports.renderTooltipBody=x;
 //# sourceMappingURL=SubHeaderItems.js.map

package/dist/cjs/components/variable-picker-v3/SubHeaderItems.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SubHeaderItems.js","sources":["../../../../src/components/variable-picker-v3/SubHeaderItems.tsx"],"sourcesContent":["import ChevronRight from '@src/assets/icons/chevronRight.svg';\nimport AddIcon from '@src/assets/icons/plus.svg';\nimport SubCategoryIcon from '@src/assets/icons/sub_category.svg';\nimport WarnIcon from '@src/assets/icons/triangle_error.svg';\nimport cloneDeep from 'lodash/cloneDeep';\nimport { COLORS } from '@src/constants/Theme';\nimport { ListItem } from '../list-item';\nimport { Tooltip } from '../tooltips';\nimport { BodySecondary } from '../TypographyStyle';\nimport { useVariablePickerContext } from './context';\nimport { highlightSearchText } from './highlightSearchText';\nimport { SubHeader, VariableListInterfaceV3, VariableV3 } from './model';\nimport { showOnlyRecommendedVariables } from './recommendVaribles';\n\ntype SubHeaderProps = {\n\tparentVariable?: VariableListInterfaceV3;\n\tdisabled: boolean;\n\tsearchText: string;\n\tonSelect: (variable: VariableV3) => void;\n\tvariable: { [key: string]: SubHeader \| VariableV3 };\n};\n\nexport const renderTooltipBody = (variable: VariableV3) => {\n\treturn variable.contextQ?.join(' > ') \|\| '';\n};\n\nconst SubHeaderItem: React.FC<SubHeaderProps> = (props: SubHeaderProps) => {\n\tconst { onSelect, variable, searchText, disabled, parentVariable } = props;\n\tconst { subHeaderStack, setSubHeaderStack, setVariables, showRecommended } =\n\t\tuseVariablePickerContext();\n\treturn (\n\t\t<div style={{ display: 'flex', flexDirection: 'column', gap: 4 }}>\n\t\t\t{Object.keys(variable).map((key, index) => {\n\t\t\t\tif (\n\t\t\t\t\ttypeof variable[key].variables === 'undefined' \|\|\n\t\t\t\t\tObject.keys(variable[key]?.variables \|\| {}).length === 0\n\t\t\t\t) {\n\t\t\t\t\tconst variableV3 = variable[key] as VariableV3;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\tbody={renderTooltipBody(variableV3)}\n\t\t\t\t\t\t\tplacement=\"bottom\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<ListItem\n\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\tdisabled\n\t\t\t\t\t\t\t\t\t\t? 'readonly'\n\t\t\t\t\t\t\t\t\t\t: variableV3?.selected\n\t\t\t\t\t\t\t\t\t\t? 'selected'\n\t\t\t\t\t\t\t\t\t\t: 'default'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tversion=\"2.0\"\n\t\t\t\t\t\t\t\tleadingIcon={\n\t\t\t\t\t\t\t\t\tvariableV3?.selected \|\| disabled ? (\n\t\t\t\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t<div style={{ flexShrink: 0 }}>\n\t\t\t\t\t\t\t\t\t\t\t<AddIcon width={14} height={14} />\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tcustomListItemLabel={\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\t\tgap: 4,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\tfontSize: '14px',\n\t\t\t\t\t\t\t\t\t\t\t\tcolor: COLORS.text.primary,\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{highlightSearchText(variableV3.displayName, searchText)}\n\t\t\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t\t\t\t{!variableV3.isAvailable && (\n\t\t\t\t\t\t\t\t\t\t\t<Tooltip body=\"Not Recommended\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div style={{ display: 'flex', marginTop: 2 }}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<WarnIcon\n\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tlistItem={{\n\t\t\t\t\t\t\t\t\tlabel: variableV3.displayName,\n\t\t\t\t\t\t\t\t\tvalue: variableV3.displayName,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tsubText={variableV3.description \|\| ''}\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tonSelect(variableV3);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\treturn (\n\t\t\t\t\t<Tooltip\n\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\tbody={renderTooltipBody(variable[key] as VariableV3)}\n\t\t\t\t\t\tplacement=\"bottom\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<ListItem\n\t\t\t\t\t\t\tvariant={'default'}\n\t\t\t\t\t\t\tversion=\"2.0\"\n\t\t\t\t\t\t\tlistItem={{\n\t\t\t\t\t\t\t\tlabel: variable[key].displayName,\n\t\t\t\t\t\t\t\tvalue: variable[key].displayName,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tcustomListItemLabel={\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\tfontSize: '14px',\n\t\t\t\t\t\t\t\t\t\t\tcolor: COLORS.text.primary,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{highlightSearchText(variable[key].displayName, searchText)}\n\t\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tleadingIcon={<SubCategoryIcon width={14} height={14} />}\n\t\t\t\t\t\t\tsubText={variable[key].description \|\| ''}\n\t\t\t\t\t\t\ttrailingIcon={\n\t\t\t\t\t\t\t\t<ChevronRight width={10} height={10} color=\"#212121\" />\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tconst currentVariable = cloneDeep(variable[key]) as SubHeader;\n\t\t\t\t\t\t\t\tif (typeof parentVariable !== 'undefined') {\n\t\t\t\t\t\t\t\t\tcurrentVariable.contextQ = [parentVariable.displayName];\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tconst stack = [...subHeaderStack, currentVariable];\n\t\t\t\t\t\t\t\tsetSubHeaderStack(stack);\n\t\t\t\t\t\t\t\tif (showRecommended) {\n\t\t\t\t\t\t\t\t\tconst recommended = showOnlyRecommendedVariables(\n\t\t\t\t\t\t\t\t\t\t[currentVariable.variables],\n\t\t\t\t\t\t\t\t\t\tstack,\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tsetVariables(recommended);\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tsetVariables([currentVariable.variables]);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t);\n\t\t\t})}\n\t\t</div>\n\t);\n};\n\nexport default SubHeaderItem;\n"],"names":["renderTooltipBody","variable","_a","contextQ","join","props","onSelect","searchText","disabled","parentVariable","subHeaderStack","setSubHeaderStack","setVariables","showRecommended","useVariablePickerContext","_jsx","Object","assign","style","display","flexDirection","gap","children","keys","map","key","index","variables","length","variableV3","Tooltip","body","placement","jsx","ListItem","variant","selected","version","leadingIcon","_Fragment","flexShrink","AddIcon","width","height","customListItemLabel","_jsxs","jsxs","BodySecondary","fontSize","color","COLORS","text","primary","highlightSearchText","displayName","isAvailable","marginTop","WarnIcon","content","secondary","listItem","label","value","subText","description","onClick","alignItems","SubCategoryIcon","trailingIcon","ChevronRight","currentVariable","cloneDeep","stack","recommended","showOnlyRecommendedVariables"],"mappings":"ypBAsBaA,MAAAA,EAAqBC,UACjC,OAAwB,QAAjBC,EAAAD,EAASE,gBAAQ,IAAAD,OAAA,EAAAA,EAAEE,KAAK,SAAU,EAAE,kBAGKC,IAChD,MAAMC,SAAEA,EAAQL,SAAEA,EAAQM,WAAEA,EAAUC,SAAEA,EAAQC,eAAEA,GAAmBJ,GAC/DK,eAAEA,EAAcC,kBAAEA,EAAiBC,aAAEA,EAAYC,gBAAEA,~~GACxDC~~,EAAwBA,2BACzB,OACCC,MAAA,MAAAC,OAAAC,OAAA,CAAKC,MAAO,CAAEC,QAAS,OAAQC,cAAe,SAAUC,IAAK,IAAG,CAAAC,SAC9DN,OAAOO,~~KAAKtB~~,~~GAAUuB~~,KAAI,CAACC,EAAKC,WAChC,QACoC,~~IAA5BzB~~,~~EAASwB~~,GAAKE,WACkC,IAAvDX,OAAOO,MAAoB,~~QAAfrB~~,EAAAD,~~EAASwB~~,UAAM,~~IAAAvB~~,OAAA,EAAAA,~~EAAAyB~~,YAAa,CAAE,GAAEC,OAC3C,CACD,MAAMC,~~EAAa5B~~,~~EAASwB~~,GAC5B,OACCV,MAACe,EAAAA,QAAOd,OAAAC,OAAA,CAEPc,~~KAAM/~~B,~~EAAkB6B,~~GACxBG,UAAU,UAEV,CAAAV,SAAAP,EAAAkB,IAACC,WACA,CAAAC,~~QACC3B~~,EACG,~~YACAqB~~,aAAA,EAAAA,EAAYO,UACZ,WACA,UAEJC,QAAQ,MACRC,aACCT,eAAAA,EAAYO,~~WAAY5B~~,~~EACvBO~~,EAAAA,IAAAwB,EAAAA,SAAA,CAAA,GAEAxB,EAAAA,IAAK,MAAAC,OAAAC,OAAA,CAAAC,MAAO,CAAEsB,WAAY,IACzB,CAAAlB,SAAAP,EAAAkB,IAACQ,UAAO,CAACC,MAAO,GAAIC,OAAQ,QAI/BC,oBACCC,EACCC,KAAA,MAAA9B,OAAAC,OAAA,CAAAC,MAAO,CACNC,QAAS,OACTE,IAAK,IACL,CAAAC,SAAA,CAEDP,EAACkB,IAAAc,gBACA/B,OAAAC,OAAA,CAAAC,MAAO,CACN8B,SAAU,OACVC,MAAOC,EAAAA,OAAOC,KAAKC,UACnB,CAAA9B,SAEA+B,EAAmBA,oBAACxB,EAAWyB,~~YAAa/C~~,~~OAE5CsB~~,EAAW0B,aACZxC,EAAAA,IAACe,EAAOA,QAACd,OAAAC,OAAA,CAAAc,KAAK,mBACb,CAAAT,SAAAP,EAAAkB,IAAA,MAAAjB,OAAAC,OAAA,CAAKC,MAAO,CAAEC,QAAS,OAAQqC,UAAW,IAAG,CAAAlC,SAC5CP,EAACkB,IAAAwB,UACA,CAAAf,MAAO,GACPC,OAAQ,GACRM,MAAOC,EAAAA,OAAOQ,QAAQC,sBAO5BC,SAAU,CACTC,MAAOhC,EAAWyB,YAClBQ,MAAOjC,EAAWyB,aAEnBS,QAASlC,EAAWmC,aAAe,GACnCC,QAASA,~~KACR3D~~,~~EAASuB~~,EAAW,MAxDjBH,EA6DP,CACD,OACCX,MAACe,EAAAA,QAAOd,OAAAC,OAAA,CAEPc,~~KAAM/B~~,EAAkBC,~~EAASwB~~,IACjCO,UAAU,UAEV,CAAAV,SAAAP,EAAAkB,IAACC,WAAQ,CACRC,QAAS,UACTE,QAAQ,MACRuB,SAAU,CACTC,~~MAAO5D~~,~~EAASwB~~,GAAK6B,YACrBQ,~~MAAO7D~~,~~EAASwB~~,GAAK6B,aAEtBV,oBACC7B,EACCkB,IAAA,MAAAjB,OAAAC,OAAA,CAAAC,MAAO,CACNC,QAAS,OACT+C,WAAY,WACZ,CAAA5C,SAEDP,EAACkB,IAAAc,gBACA/B,OAAAC,OAAA,CAAAC,MAAO,CACN8B,SAAU,OACVC,MAAOC,EAAAA,OAAOC,KAAKC,UACnB,CAAA9B,SAEA+B,EAAmBA,~~oBAACpD~~,~~EAASwB~~,GAAK6B,~~YAAa/C~~,~~SAInD+B~~,YAAavB,EAACkB,IAAAkC,UAAgB,CAAAzB,MAAO,GAAIC,OAAQ,KACjDoB,~~QAAS9D~~,~~EAASwB~~,GAAKuC,aAAe,GACtCI,aACCrD,EAAAkB,IAACoC,UAAY,CAAC3B,MAAO,GAAIC,OAAQ,GAAIM,MAAM,YAE5CgB,QAASA,~~KACR~~,~~MAAMK~~,EAAkBC,EAAS,~~QAACtE~~,~~EAASwB~~,SACb,~~IAAnBhB~~,~~IACV6D~~,~~EAAgBnE~~,SAAW,CAACM,~~EAAe6C~~,cAE5C,~~MAAMkB~~,EAAQ,~~IAAI9D~~,~~EAAgB4D~~,GAElC,~~GADA3D~~,~~EAAkB6D~~,~~GACd3D~~,EAAiB,CACpB,~~MAAM4D~~,EAAcC,EAAAA,6BACnB,CAACJ,~~EAAgB3C~~,~~WACjB6C~~,~~GAED5D~~,~~EAAa6D~~,EACb,~~MACA7D~~,EAAa,~~CAAC0D~~,~~EAAgB3C~~,WAC9B,~~MAhDED~~,~~EAmDI~~,MAGP"}
1	+ {"version":3,"file":"SubHeaderItems.js","sources":["../../../../src/components/variable-picker-v3/SubHeaderItems.tsx"],"sourcesContent":["import ChevronRight from '@src/assets/icons/chevronRight.svg';\nimport AddIcon from '@src/assets/icons/plus.svg';\nimport SubCategoryIcon from '@src/assets/icons/sub_category.svg';\nimport WarnIcon from '@src/assets/icons/triangle_error.svg';\nimport cloneDeep from 'lodash/cloneDeep';\nimport { COLORS } from '@src/constants/Theme';\nimport { ListItem } from '../list-item';\nimport { Tooltip } from '../tooltips';\nimport { BodySecondary } from '../TypographyStyle';\nimport { useVariablePickerContext } from './context';\nimport { highlightSearchText } from './highlightSearchText';\nimport { SubHeader, VariableListInterfaceV3, VariableV3 } from './model';\nimport { showOnlyRecommendedVariables } from './recommendVaribles';\n\ntype SubHeaderProps = {\n\tparentVariable?: VariableListInterfaceV3;\n\tdisabled: boolean;\n\tsearchText: string;\n\tonSelect: (variable: VariableV3) => void;\n\tvariable: { [key: string]: SubHeader \| VariableV3 };\n};\n\nexport const renderTooltipBody = (variable: VariableV3) => {\n\treturn variable.contextQ?.join(' > ') \|\| '';\n};\n\nconst SubHeaderItem: React.FC<SubHeaderProps> = (props: SubHeaderProps) => {\n\tconst { onSelect, variable, searchText, disabled, parentVariable } = props;\n\tconst { subHeaderStack, setSubHeaderStack, setVariables, showRecommended, containerRef, scrollPositionStack } =\n\t\tuseVariablePickerContext();\n\treturn (\n\t\t<div style={{ display: 'flex', flexDirection: 'column', gap: 4 }}>\n\t\t\t{Object.keys(variable).map((key, index) => {\n\t\t\t\tif (\n\t\t\t\t\ttypeof variable[key].variables === 'undefined' \|\|\n\t\t\t\t\tObject.keys(variable[key]?.variables \|\| {}).length === 0\n\t\t\t\t) {\n\t\t\t\t\tconst variableV3 = variable[key] as VariableV3;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\tbody={renderTooltipBody(variableV3)}\n\t\t\t\t\t\t\tplacement=\"bottom\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<ListItem\n\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\tdisabled\n\t\t\t\t\t\t\t\t\t\t? 'readonly'\n\t\t\t\t\t\t\t\t\t\t: variableV3?.selected\n\t\t\t\t\t\t\t\t\t\t? 'selected'\n\t\t\t\t\t\t\t\t\t\t: 'default'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tversion=\"2.0\"\n\t\t\t\t\t\t\t\tleadingIcon={\n\t\t\t\t\t\t\t\t\tvariableV3?.selected \|\| disabled ? (\n\t\t\t\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t<div style={{ flexShrink: 0 }}>\n\t\t\t\t\t\t\t\t\t\t\t<AddIcon width={14} height={14} />\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tcustomListItemLabel={\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\t\tgap: 4,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\tfontSize: '14px',\n\t\t\t\t\t\t\t\t\t\t\t\tcolor: COLORS.text.primary,\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{highlightSearchText(variableV3.displayName, searchText)}\n\t\t\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t\t\t\t{!variableV3.isAvailable && (\n\t\t\t\t\t\t\t\t\t\t\t<Tooltip body=\"Not Recommended\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div style={{ display: 'flex', marginTop: 2 }}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<WarnIcon\n\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tlistItem={{\n\t\t\t\t\t\t\t\t\tlabel: variableV3.displayName,\n\t\t\t\t\t\t\t\t\tvalue: variableV3.displayName,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tsubText={variableV3.description \|\| ''}\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tonSelect(variableV3);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\treturn (\n\t\t\t\t\t<Tooltip\n\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\tbody={renderTooltipBody(variable[key] as VariableV3)}\n\t\t\t\t\t\tplacement=\"bottom\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<ListItem\n\t\t\t\t\t\t\tvariant={'default'}\n\t\t\t\t\t\t\tversion=\"2.0\"\n\t\t\t\t\t\t\tlistItem={{\n\t\t\t\t\t\t\t\tlabel: variable[key].displayName,\n\t\t\t\t\t\t\t\tvalue: variable[key].displayName,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tcustomListItemLabel={\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\tfontSize: '14px',\n\t\t\t\t\t\t\t\t\t\t\tcolor: COLORS.text.primary,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{highlightSearchText(variable[key].displayName, searchText)}\n\t\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tleadingIcon={<SubCategoryIcon width={14} height={14} />}\n\t\t\t\t\t\t\tsubText={variable[key].description \|\| ''}\n\t\t\t\t\t\t\ttrailingIcon={\n\t\t\t\t\t\t\t\t<ChevronRight width={10} height={10} color=\"#212121\" />\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t// Save current scroll position before navigating into subcategory\n\t\t\t\t\t\t\t\tif (containerRef.current) {\n\t\t\t\t\t\t\t\t\tscrollPositionStack.current.push(containerRef.current.scrollTop);\n\t\t\t\t\t\t\t\t\tcontainerRef.current.scrollTop = 0;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tconst currentVariable = cloneDeep(variable[key]) as SubHeader;\n\t\t\t\t\t\t\t\tif (typeof parentVariable !== 'undefined') {\n\t\t\t\t\t\t\t\t\tcurrentVariable.contextQ = [parentVariable.displayName];\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tconst stack = [...subHeaderStack, currentVariable];\n\t\t\t\t\t\t\t\tsetSubHeaderStack(stack);\n\t\t\t\t\t\t\t\tif (showRecommended) {\n\t\t\t\t\t\t\t\t\tconst recommended = showOnlyRecommendedVariables(\n\t\t\t\t\t\t\t\t\t\t[currentVariable.variables],\n\t\t\t\t\t\t\t\t\t\tstack,\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tsetVariables(recommended);\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tsetVariables([currentVariable.variables]);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t);\n\t\t\t})}\n\t\t</div>\n\t);\n};\n\nexport default SubHeaderItem;\n"],"names":["renderTooltipBody","variable","_a","contextQ","join","props","onSelect","searchText","disabled","parentVariable","subHeaderStack","setSubHeaderStack","setVariables","showRecommended","containerRef","scrollPositionStack","useVariablePickerContext","_jsx","Object","assign","style","display","flexDirection","gap","children","keys","map","key","index","variables","length","variableV3","Tooltip","body","placement","jsx","ListItem","variant","selected","version","leadingIcon","_Fragment","flexShrink","AddIcon","width","height","customListItemLabel","_jsxs","jsxs","BodySecondary","fontSize","color","COLORS","text","primary","highlightSearchText","displayName","isAvailable","marginTop","WarnIcon","content","secondary","listItem","label","value","subText","description","onClick","alignItems","SubCategoryIcon","trailingIcon","ChevronRight","current","push","scrollTop","currentVariable","cloneDeep","stack","recommended","showOnlyRecommendedVariables"],"mappings":"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"}

package/dist/cjs/components/variable-picker-v3/context.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const r=t(e).default.createContext({searchText:"",setSearchText:()=>{},subHeaderStack:[],setSubHeaderStack:()=>{},variables:[],setVariables:()=>{},showRecommended:!1,setShowRecommended:()=>{}});exports.VariablePickerContext=r,exports.useVariablePickerContext=()=>e.useContext(r);
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const r=t(e).default.createContext({searchText:"",setSearchText:()=>{},subHeaderStack:[],setSubHeaderStack:()=>{},variables:[],setVariables:()=>{},showRecommended:!1,setShowRecommended:()=>{},containerRef:{current:null},scrollPositionStack:{current:[]}});exports.VariablePickerContext=r,exports.useVariablePickerContext=()=>e.useContext(r);
 //# sourceMappingURL=context.js.map

package/dist/cjs/components/variable-picker-v3/context.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"context.js","sources":["../../../../src/components/variable-picker-v3/context.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-empty-function */\nimport React, { useContext } from 'react';\n\nexport const VariablePickerContext = React.createContext<{\n\tsearchText: string;\n\tsetSearchText: React.Dispatch<React.SetStateAction<string>>;\n\tsubHeaderStack: any[]; // TODO: type this\n\tsetSubHeaderStack: React.Dispatch<React.SetStateAction<any[]>>;\n\tvariables: any[]; // TODO: type this\n\tsetVariables: React.Dispatch<React.SetStateAction<any[]>>;\n\tshowRecommended: boolean;\n\tsetShowRecommended: React.Dispatch<React.SetStateAction<boolean>>;\n}>({\n\tsearchText: '',\n\tsetSearchText: () => {},\n\tsubHeaderStack: [],\n\tsetSubHeaderStack: () => {},\n\tvariables: [],\n\tsetVariables: () => {},\n\tshowRecommended: false,\n\tsetShowRecommended: () => {},\n});\n\nexport const useVariablePickerContext = () => useContext(VariablePickerContext);\n"],"names":["VariablePickerContext","createContext","searchText","setSearchText","subHeaderStack","setSubHeaderStack","variables","setVariables","showRecommended","setShowRecommended","useVariablePickerContext","useContext"],"mappings":"yKAGaA,OAA6B,QAACC,~~cASxC~~,CACFC,WAAY,GACZC,cAAeA,OACfC,eAAgB,GAChBC,kBAAmBA,OACnBC,UAAW,GACXC,aAAcA,OACdC,iBAAiB,EACjBC,mBAAoBA,~~0EAGmBC~~,IAAMC,EAAAA,~~WAAWX~~"}
1	+ {"version":3,"file":"context.js","sources":["../../../../src/components/variable-picker-v3/context.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-empty-function */\nimport React, { useContext } from 'react';\n\nexport const VariablePickerContext = React.createContext<{\n\tsearchText: string;\n\tsetSearchText: React.Dispatch<React.SetStateAction<string>>;\n\tsubHeaderStack: any[]; // TODO: type this\n\tsetSubHeaderStack: React.Dispatch<React.SetStateAction<any[]>>;\n\tvariables: any[]; // TODO: type this\n\tsetVariables: React.Dispatch<React.SetStateAction<any[]>>;\n\tshowRecommended: boolean;\n\tsetShowRecommended: React.Dispatch<React.SetStateAction<boolean>>;\n\tcontainerRef: React.RefObject<HTMLDivElement \| null>;\n\tscrollPositionStack: React.MutableRefObject<number[]>;\n}>({\n\tsearchText: '',\n\tsetSearchText: () => {},\n\tsubHeaderStack: [],\n\tsetSubHeaderStack: () => {},\n\tvariables: [],\n\tsetVariables: () => {},\n\tshowRecommended: false,\n\tsetShowRecommended: () => {},\n\tcontainerRef: { current: null },\n\tscrollPositionStack: { current: [] },\n});\n\nexport const useVariablePickerContext = () => useContext(VariablePickerContext);\n"],"names":["VariablePickerContext","createContext","searchText","setSearchText","subHeaderStack","setSubHeaderStack","variables","setVariables","showRecommended","setShowRecommended","containerRef","current","scrollPositionStack","useVariablePickerContext","useContext"],"mappings":"yKAGaA,OAA6B,QAACC,cAWxC,CACFC,WAAY,GACZC,cAAeA,OACfC,eAAgB,GAChBC,kBAAmBA,OACnBC,UAAW,GACXC,aAAcA,OACdC,iBAAiB,EACjBC,mBAAoBA,OACpBC,aAAc,CAAEC,QAAS,MACzBC,oBAAqB,CAAED,QAAS,uEAGOE,IAAMC,EAAAA,WAAWd"}

package/dist/cjs/components/variable-picker-v3/searchVariables.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const e=(a,s,t,i=[])=>{Object.keys(s).forEach((l=>{s[l].displayName.toLowerCase().includes(a.toLowerCase())&&(void 0!==s[l].variables&&0===Object.keys(s[l].variables).length&&delete s[l].variables,t.push(s[l].isSubHeader?{[l]:Object.assign(Object.assign({},s[l]),{contextQ:i})}:Object.assign(Object.assign({},s[l]),{contextQ:i}))),s[l].variables&&Object.keys(s[l].variables).length&&e(a,s[l].variables,t,[...i,s[l].displayName])}))};exports.searchVariables=(a,s,t)=>{if(!a)return t.length>0?[t[t.length-1].variables]:s;const i=[];return s.forEach((s=>{if(t.length>0)if(s.displayName&&void 0!==s.variables)e(a,s.variables,i,[...s.contextQ||[],s.displayName]);else{if(s.displayName.toLowerCase().includes(a.toLowerCase())&&i.push(s),!s.variables||!Object.keys(s.variables).length)return;e(a,s.variables,i,[...s.contextQ||[],s.displayName])}else{if(s.displayName.toLowerCase().includes(a.toLowerCase())&&i.push(s),!s.variables||!Object.keys(s.variables).length)return;e(a,s.variables,i,[s.displayName])}})),i};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const e=function(a,s,t){let i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:[];Object.keys(s).forEach((l=>{s[l].displayName.toLowerCase().includes(a.toLowerCase())&&(void 0!==s[l].variables&&0===Object.keys(s[l].variables).length&&delete s[l].variables,t.push(s[l].isSubHeader?{[l]:Object.assign(Object.assign({},s[l]),{contextQ:i})}:Object.assign(Object.assign({},s[l]),{contextQ:i}))),s[l].variables&&Object.keys(s[l].variables).length&&e(a,s[l].variables,t,[...i,s[l].displayName])}))};exports.searchVariables=(a,s,t)=>{if(!a)return t.length>0?[t[t.length-1].variables]:s;const i=[];return s.forEach((s=>{if(t.length>0)if(s.displayName&&void 0!==s.variables)e(a,s.variables,i,[...s.contextQ||[],s.displayName]);else{if(s.displayName.toLowerCase().includes(a.toLowerCase())&&i.push(s),!s.variables||!Object.keys(s.variables).length)return;e(a,s.variables,i,[...s.contextQ||[],s.displayName])}else{if(s.displayName.toLowerCase().includes(a.toLowerCase())&&i.push(s),!s.variables||!Object.keys(s.variables).length)return;e(a,s.variables,i,[s.displayName])}})),i};
 //# sourceMappingURL=searchVariables.js.map

package/dist/cjs/components/variable-picker-v3/searchVariables.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"searchVariables.js","sources":["../../../../src/components/variable-picker-v3/searchVariables.ts"],"sourcesContent":["import { VariableListInterfaceV3 } from './model';\n\nexport const searchVariables = (\n\ttext: string,\n\tdata: VariableListInterfaceV3[],\n\tsubHeaderStack: any[],\n) => {\n\tif (!text) {\n\t\tif (subHeaderStack.length > 0) {\n\t\t\treturn [subHeaderStack[subHeaderStack.length - 1].variables];\n\t\t} else {\n\t\t\treturn data;\n\t\t}\n\t}\n\tconst filteredData: VariableListInterfaceV3[] = [];\n\tdata.forEach((variable) => {\n\t\t// if inside a stack\n\t\tif (subHeaderStack.length > 0) {\n\t\t\t// dont show accordion level or zero level variables\n\t\t\tif (variable.displayName && typeof variable.variables !== 'undefined') {\n\t\t\t\trecursiveSearch(text, variable.variables, filteredData, [\n\t\t\t\t\t...(variable.contextQ \|\| []),\n\t\t\t\t\tvariable.displayName,\n\t\t\t\t]);\n\t\t\t} else {\n\t\t\t\t// non level zero\n\t\t\t\tif (variable.displayName.toLowerCase().includes(text.toLowerCase())) {\n\t\t\t\t\tfilteredData.push(variable);\n\t\t\t\t}\n\t\t\t\tif (!variable.variables \|\| !Object.keys(variable.variables).length) {\n\t\t\t\t\treturn;\n\t\t\t\t} else {\n\t\t\t\t\trecursiveSearch(text, variable.variables, filteredData, [\n\t\t\t\t\t\t...(variable.contextQ \|\| []),\n\t\t\t\t\t\tvariable.displayName,\n\t\t\t\t\t]);\n\t\t\t\t}\n\t\t\t}\n\t\t} else {\n\t\t\t// if level zero return everything\n\t\t\tif (variable.displayName.toLowerCase().includes(text.toLowerCase())) {\n\t\t\t\tfilteredData.push(variable);\n\t\t\t}\n\t\t\tif (!variable.variables \|\| !Object.keys(variable.variables).length) {\n\t\t\t\treturn;\n\t\t\t} else {\n\t\t\t\trecursiveSearch(text, variable.variables, filteredData, [\n\t\t\t\t\tvariable.displayName,\n\t\t\t\t]);\n\t\t\t}\n\t\t}\n\t});\n\treturn filteredData;\n};\n\nconst recursiveSearch = (\n\ttext: string,\n\tdata: any, // TODO: type this\n\tfilteredData: VariableListInterfaceV3[],\n\tcontextQ: string[] = [],\n) => {\n\tObject.keys(data).forEach((key) => {\n\t\tif (data[key].displayName.toLowerCase().includes(text.toLowerCase())) {\n\t\t\t// remove empty variables\n\t\t\tif (\n\t\t\t\ttypeof data[key].variables !== 'undefined' &&\n\t\t\t\tObject.keys(data[key].variables).length === 0\n\t\t\t) {\n\t\t\t\tdelete data[key].variables;\n\t\t\t}\n\t\t\t// if subHeader include the category for rendering in the UI as nested list item\n\t\t\tfilteredData.push(\n\t\t\t\tdata[key].isSubHeader\n\t\t\t\t\t? { [key]: { ...data[key], contextQ } }\n\t\t\t\t\t: { ...data[key], contextQ },\n\t\t\t);\n\t\t}\n\t\tif (!data[key].variables \|\| !Object.keys(data[key].variables).length) {\n\t\t\treturn;\n\t\t} else {\n\t\t\trecursiveSearch(text, data[key].variables, filteredData, [\n\t\t\t\t...contextQ,\n\t\t\t\tdata[key].displayName,\n\t\t\t]);\n\t\t}\n\t});\n};\n"],"names":["recursiveSearch","text","data","filteredData","contextQ","Object","keys","forEach","key","displayName","toLowerCase","includes","variables","~~length","~~push","isSubHeader","assign","searchVariables","subHeaderStack","variable"],"mappings":"oEAEO,MAqDDA,~~EAAkBA~~,~~CACvBC~~,EACAC,EACAC,~~EACAC~~,~~EAAqB~~,~~MAErBC~~,OAAOC,~~KAAKJ~~,~~GAAMK~~,SAASC,~~IACtBN~~,~~EAAKM~~,GAAKC,YAAYC,cAAcC,~~SAASV~~,~~EAAKS~~,sBAGrB,~~IAAxBR~~,~~EAAKM~~,GAAKI,WAC2B,IAA5CP,OAAOC,~~KAAKJ~~,~~EAAKM~~,GAAKI,~~WAAWC~~,~~eAE1BX~~,~~EAAKM~~,GAAKI,~~UAGlBT~~,~~EAAaW~~,~~KACZZ~~,~~EAAKM~~,~~GAAKO~~,YACP,~~CAAEP~~,CAACA,GAAIH,~~OAAAW~~,~~OAAAX~~,~~OAAAW~~,OAAA,~~GAAOd~~,~~EAAKM~~,IAAM,~~CAAAJ~~,~~cAC1BC~~,~~OAAAW~~,~~OAAAX~~,~~OAAAW~~,OAAA,CAAA,~~EAAMd~~,~~EAAKM~~,IAAM,~~CAAAJ~~,eAGhBF,~~EAAKM~~,GAAKI,WAAcP,OAAOC,~~KAAKJ~~,~~EAAKM~~,GAAKI,~~WAAWC~~,~~QAG7Db~~,EAAgBC,EAAMC,~~EAAKM~~,GAAKI,~~UAAWT~~,EAAc,IACrDC,EACHF,~~EAAKM~~,GAAKC,aAEX,~~GACA~~,~~0BAnF4BQ~~,~~CAC9BhB~~,EACAC,~~EACAgB~~,KAEA,~~IAAKjB~~,EACJ,~~OAAIiB~~,~~EAAeL~~,OAAS,EACpB,~~CAACK~~,EAAeA,~~EAAeL~~,OAAS,~~GAAGD~~,~~WAE3CV~~,EAGT,MAAMC,EAA0C,GAsChD,OArCAD,~~EAAKK~~,~~SAASY~~,IAEb,GAAID,~~EAAeL~~,OAAS,EAE3B,~~GAAIM~~,~~EAASV~~,kBAA6C,~~IAAvBU~~,~~EAASP~~,~~UAC3CZ~~,EAAgBC,~~EAAMkB~~,~~EAASP~~,~~UAAWT~~,EAAc,~~IACnDgB~~,~~EAASf~~,UAAY,~~GACzBe~~,~~EAASV~~,kBAEJ,CAKN,~~GAHIU~~,~~EAASV~~,YAAYC,cAAcC,~~SAASV~~,~~EAAKS~~,~~gBACpDP~~,~~EAAaW~~,KAAKK,IAEdA,~~EAASP~~,YAAcP,OAAOC,~~KAAKa~~,~~EAASP~~,~~WAAWC~~,OAC3D,~~OAEAb~~,EAAgBC,~~EAAMkB~~,~~EAASP~~,~~UAAWT~~,EAAc,~~IACnDgB~~,~~EAASf~~,UAAY,~~GACzBe~~,~~EAASV~~,aAGX,KACK,CAKN,~~GAHIU~~,~~EAASV~~,YAAYC,cAAcC,~~SAASV~~,~~EAAKS~~,~~gBACpDP~~,~~EAAaW~~,KAAKK,IAEdA,~~EAASP~~,YAAcP,OAAOC,~~KAAKa~~,~~EAASP~~,~~WAAWC~~,OAC3D,~~OAEAb~~,EAAgBC,~~EAAMkB~~,~~EAASP~~,~~UAAWT~~,EAAc,~~CACvDgB~~,~~EAASV~~,aAGX,~~KAEKN~~,CAAY"}
1	+ {"version":3,"file":"searchVariables.js","sources":["../../../../src/components/variable-picker-v3/searchVariables.ts"],"sourcesContent":["import { VariableListInterfaceV3 } from './model';\n\nexport const searchVariables = (\n\ttext: string,\n\tdata: VariableListInterfaceV3[],\n\tsubHeaderStack: any[],\n) => {\n\tif (!text) {\n\t\tif (subHeaderStack.length > 0) {\n\t\t\treturn [subHeaderStack[subHeaderStack.length - 1].variables];\n\t\t} else {\n\t\t\treturn data;\n\t\t}\n\t}\n\tconst filteredData: VariableListInterfaceV3[] = [];\n\tdata.forEach((variable) => {\n\t\t// if inside a stack\n\t\tif (subHeaderStack.length > 0) {\n\t\t\t// dont show accordion level or zero level variables\n\t\t\tif (variable.displayName && typeof variable.variables !== 'undefined') {\n\t\t\t\trecursiveSearch(text, variable.variables, filteredData, [\n\t\t\t\t\t...(variable.contextQ \|\| []),\n\t\t\t\t\tvariable.displayName,\n\t\t\t\t]);\n\t\t\t} else {\n\t\t\t\t// non level zero\n\t\t\t\tif (variable.displayName.toLowerCase().includes(text.toLowerCase())) {\n\t\t\t\t\tfilteredData.push(variable);\n\t\t\t\t}\n\t\t\t\tif (!variable.variables \|\| !Object.keys(variable.variables).length) {\n\t\t\t\t\treturn;\n\t\t\t\t} else {\n\t\t\t\t\trecursiveSearch(text, variable.variables, filteredData, [\n\t\t\t\t\t\t...(variable.contextQ \|\| []),\n\t\t\t\t\t\tvariable.displayName,\n\t\t\t\t\t]);\n\t\t\t\t}\n\t\t\t}\n\t\t} else {\n\t\t\t// if level zero return everything\n\t\t\tif (variable.displayName.toLowerCase().includes(text.toLowerCase())) {\n\t\t\t\tfilteredData.push(variable);\n\t\t\t}\n\t\t\tif (!variable.variables \|\| !Object.keys(variable.variables).length) {\n\t\t\t\treturn;\n\t\t\t} else {\n\t\t\t\trecursiveSearch(text, variable.variables, filteredData, [\n\t\t\t\t\tvariable.displayName,\n\t\t\t\t]);\n\t\t\t}\n\t\t}\n\t});\n\treturn filteredData;\n};\n\nconst recursiveSearch = (\n\ttext: string,\n\tdata: any, // TODO: type this\n\tfilteredData: VariableListInterfaceV3[],\n\tcontextQ: string[] = [],\n) => {\n\tObject.keys(data).forEach((key) => {\n\t\tif (data[key].displayName.toLowerCase().includes(text.toLowerCase())) {\n\t\t\t// remove empty variables\n\t\t\tif (\n\t\t\t\ttypeof data[key].variables !== 'undefined' &&\n\t\t\t\tObject.keys(data[key].variables).length === 0\n\t\t\t) {\n\t\t\t\tdelete data[key].variables;\n\t\t\t}\n\t\t\t// if subHeader include the category for rendering in the UI as nested list item\n\t\t\tfilteredData.push(\n\t\t\t\tdata[key].isSubHeader\n\t\t\t\t\t? { [key]: { ...data[key], contextQ } }\n\t\t\t\t\t: { ...data[key], contextQ },\n\t\t\t);\n\t\t}\n\t\tif (!data[key].variables \|\| !Object.keys(data[key].variables).length) {\n\t\t\treturn;\n\t\t} else {\n\t\t\trecursiveSearch(text, data[key].variables, filteredData, [\n\t\t\t\t...contextQ,\n\t\t\t\tdata[key].displayName,\n\t\t\t]);\n\t\t}\n\t});\n};\n"],"names":["recursiveSearch","text","data","filteredData","contextQ","arguments","length","undefined","Object","keys","forEach","key","displayName","toLowerCase","includes","variables","push","isSubHeader","assign","searchVariables","subHeaderStack","variable"],"mappings":"oEAEO,MAqDDA,EAAkB,SACvBC,EACAC,EACAC,GAEG,IADHC,EAAAC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAqB,GAErBG,OAAOC,KAAKP,GAAMQ,SAASC,IACtBT,EAAKS,GAAKC,YAAYC,cAAcC,SAASb,EAAKY,sBAGrB,IAAxBX,EAAKS,GAAKI,WAC2B,IAA5CP,OAAOC,KAAKP,EAAKS,GAAKI,WAAWT,eAE1BJ,EAAKS,GAAKI,UAGlBZ,EAAaa,KACZd,EAAKS,GAAKM,YACP,CAAEN,CAACA,GAAIH,OAAAU,OAAAV,OAAAU,OAAA,GAAOhB,EAAKS,IAAM,CAAAP,cAC1BI,OAAAU,OAAAV,OAAAU,OAAA,CAAA,EAAMhB,EAAKS,IAAM,CAAAP,eAGhBF,EAAKS,GAAKI,WAAcP,OAAOC,KAAKP,EAAKS,GAAKI,WAAWT,QAG7DN,EAAgBC,EAAMC,EAAKS,GAAKI,UAAWZ,EAAc,IACrDC,EACHF,EAAKS,GAAKC,aAEX,GAEH,0BApF+BO,CAC9BlB,EACAC,EACAkB,KAEA,IAAKnB,EACJ,OAAImB,EAAed,OAAS,EACpB,CAACc,EAAeA,EAAed,OAAS,GAAGS,WAE3Cb,EAGT,MAAMC,EAA0C,GAsChD,OArCAD,EAAKQ,SAASW,IAEb,GAAID,EAAed,OAAS,EAE3B,GAAIe,EAAST,kBAA6C,IAAvBS,EAASN,UAC3Cf,EAAgBC,EAAMoB,EAASN,UAAWZ,EAAc,IACnDkB,EAASjB,UAAY,GACzBiB,EAAST,kBAEJ,CAKN,GAHIS,EAAST,YAAYC,cAAcC,SAASb,EAAKY,gBACpDV,EAAaa,KAAKK,IAEdA,EAASN,YAAcP,OAAOC,KAAKY,EAASN,WAAWT,OAC3D,OAEAN,EAAgBC,EAAMoB,EAASN,UAAWZ,EAAc,IACnDkB,EAASjB,UAAY,GACzBiB,EAAST,aAGX,KACK,CAKN,GAHIS,EAAST,YAAYC,cAAcC,SAASb,EAAKY,gBACpDV,EAAaa,KAAKK,IAEdA,EAASN,YAAcP,OAAOC,KAAKY,EAASN,WAAWT,OAC3D,OAEAN,EAAgBC,EAAMoB,EAASN,UAAWZ,EAAc,CACvDkB,EAAST,aAGX,KAEKT,CAAY"}

package/dist/cjs/components/vertical-full-screen-modal/component.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react/jsx-runtime"),e=require("../../assets/icons/cross.svg.js"),o=require("../button/Button.js"),s=require("../icon-button/IconButton.js"),n=require("../TypographyStyle.js"),r=require("./styles.js");exports.default=({headerText:i,body:a,primaryButtonTitle:l,onSave:c,secondaryButtonTitle:d="Cancel",secondaryButtonClick:u,hideSecondaryButton:j=!1,disablePrimaryButton:x=!1,onClose:p,width:y,className:b,modalOffsetPx:h})=>{const g=u||p;return t.jsx("div",Object.assign({style:{position:"fixed",top:0,right:h?`${h}px`:"-424px",bottom:0}},{children:t.jsxs(r.VerticalModalContainer,Object.assign({onClick:t=>t.stopPropagation(),onMouseDown:t=>t.stopPropagation(),width:y,className:b},{children:[t.jsxs(r.VerticalModalHeader,{children:[t.jsx(n.TitleRegular,{children:i}),t.jsx(s.IconButton,{Icon:e.default,onClick:p})]}),t.jsx(r.VerticalModalContent,{children:a}),t.jsxs(r.VerticalModalFooter,Object.assign({addGap:!j},{children:[!j&&t.jsx(o.Button,{buttonText:d,buttonType:"tertiaryGray",onClick:g}),t.jsx(o.Button,{style:{marginRight:12},buttonText:l,onClick:c,disabled:x})]}))]}))}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react/jsx-runtime"),e=require("../../assets/icons/cross.svg.js"),o=require("../button/Button.js"),s=require("../icon-button/IconButton.js"),n=require("../TypographyStyle.js"),r=require("./styles.js");exports.default=i=>{let{headerText:a,body:l,primaryButtonTitle:c,onSave:d,secondaryButtonTitle:u="Cancel",secondaryButtonClick:j,hideSecondaryButton:x=!1,disablePrimaryButton:p=!1,onClose:y,width:b,className:h,modalOffsetPx:g}=i;const B=j||y;return t.jsx("div",Object.assign({style:{position:"fixed",top:0,right:g?`${g}px`:"-424px",bottom:0}},{children:t.jsxs(r.VerticalModalContainer,Object.assign({onClick:t=>t.stopPropagation(),onMouseDown:t=>t.stopPropagation(),width:b,className:h},{children:[t.jsxs(r.VerticalModalHeader,{children:[t.jsx(n.TitleRegular,{children:a}),t.jsx(s.IconButton,{Icon:e.default,onClick:y})]}),t.jsx(r.VerticalModalContent,{children:l}),t.jsxs(r.VerticalModalFooter,Object.assign({addGap:!x},{children:[!x&&t.jsx(o.Button,{buttonText:u,buttonType:"tertiaryGray",onClick:B}),t.jsx(o.Button,{style:{marginRight:12},buttonText:c,onClick:d,disabled:p})]}))]}))}))};
 //# sourceMappingURL=component.js.map

package/dist/cjs/components/vertical-full-screen-modal/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"component.js","sources":["../../../../src/components/vertical-full-screen-modal/component.tsx"],"sourcesContent":["import React from 'react';\nimport CrossIcon from '../../assets/icons/cross.svg';\nimport { Button } from '../button';\nimport { IconButton } from '../icon-button';\nimport { TitleRegular } from '../TypographyStyle';\nimport {\n\tVerticalModalContainer,\n\tVerticalModalContent,\n\tVerticalModalFooter,\n\tVerticalModalHeader,\n} from './styles';\nimport { VerticalFullScreenModalProps } from './types';\n\nconst MODAL_OFFSET_PX = '-424px';\n\n/*\n VerticalFullScreenModal - A reusable full-screen modal component\n \n This component provides a common full-screen modal structure with:\n * - Fixed height (100vh)\n * - Header section with close button\n * - Scrollable body content\n * - Dynamic footer with configurable buttons\n \n @example\n * <VerticalFullScreenModal\n * headerText=\"My Modal\"\n * body={<div>Modal content here</div>}\n * primaryButtonTitle=\"Save\"\n * onSave={handleSave}\n * secondaryButtonTitle=\"Cancel\"\n * secondaryButtonClick={handleCancel}\n * onClose={handleClose}\n * />\n */\nconst VerticalFullScreenModal: React.FC<VerticalFullScreenModalProps> = ({\n\theaderText,\n\tbody,\n\tprimaryButtonTitle,\n\tonSave,\n\tsecondaryButtonTitle = 'Cancel',\n\tsecondaryButtonClick,\n\thideSecondaryButton = false,\n\tdisablePrimaryButton = false,\n\tonClose,\n\twidth,\n\tclassName,\n\tmodalOffsetPx,\n}) => {\n\tconst handleSecondaryClick = secondaryButtonClick \|\| onClose;\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tposition: 'fixed',\n\t\t\t\ttop: 0,\n\t\t\t\tright: modalOffsetPx ? `${modalOffsetPx}px` : MODAL_OFFSET_PX,\n\t\t\t\tbottom: 0,\n\t\t\t}}\n\t\t>\n\t\t\t<VerticalModalContainer\n\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\tonMouseDown={(e) => e.stopPropagation()}\n\t\t\t\twidth={width}\n\t\t\t\tclassName={className}\n\t\t\t>\n\t\t\t\t<VerticalModalHeader>\n\t\t\t\t\t<TitleRegular>{headerText}</TitleRegular>\n\n\t\t\t\t\t<IconButton Icon={CrossIcon} onClick={onClose} />\n\t\t\t\t</VerticalModalHeader>\n\n\t\t\t\t<VerticalModalContent>{body}</VerticalModalContent>\n\n\t\t\t\t<VerticalModalFooter addGap={!hideSecondaryButton}>\n\t\t\t\t\t{!hideSecondaryButton && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tbuttonText={secondaryButtonTitle}\n\t\t\t\t\t\t\tbuttonType=\"tertiaryGray\"\n\t\t\t\t\t\t\tonClick={handleSecondaryClick}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t<Button\n\t\t\t\t\t\tstyle={{ marginRight: 12 }}\n\t\t\t\t\t\tbuttonText={primaryButtonTitle}\n\t\t\t\t\t\tonClick={onSave}\n\t\t\t\t\t\tdisabled={disablePrimaryButton}\n\t\t\t\t\t/>\n\t\t\t\t</VerticalModalFooter>\n\t\t\t</VerticalModalContainer>\n\t\t</div>\n\t);\n};\n\nexport default VerticalFullScreenModal;\n"],"names":["~~VerticalFullScreenModal~~","headerText","body","primaryButtonTitle","onSave","secondaryButtonTitle","secondaryButtonClick","hideSecondaryButton","disablePrimaryButton","onClose","width","className","modalOffsetPx","handleSecondaryClick","_jsx","Object","assign","style","position","top","right","bottom","children","_jsxs","jsxs","VerticalModalContainer","onClick","e","stopPropagation","onMouseDown","VerticalModalHeader","jsx","TitleRegular","IconButton","Icon","CrossIcon","VerticalModalContent","VerticalModalFooter","addGap","Button","buttonText","buttonType","marginRight","disabled"],"mappings":"2SAmCwEA,~~EACvEC~~,~~aACAC~~,~~OACAC~~,~~qBACAC~~,~~SACAC~~,~~uBAAuB~~,~~SACvBC~~,~~uBACAC~~,~~uBAAsB~~,~~EACtBC~~,~~wBAAuB~~,~~EACvBC~~,~~UACAC~~,~~QACAC~~,~~YACAC~~,~~oBAEA~~,~~MAAMC~~,EAAuBP,GAAwBG,EAErD,OACCK,MACC,MAAAC,OAAAC,OAAA,CAAAC,MAAO,CACNC,SAAU,QACVC,IAAK,EACLC,MAAOR,~~EAAgB~~,~~GAAGA~~,MA3CN,SA4CpBS,OAAQ,IAGT,CAAAC,SAAAC,EAAAC,KAACC,yBAAsBV,OAAAC,OAAA,CACtBU,QAAUC,GAAMA,EAAEC,kBAClBC,YAAcF,GAAMA,EAAEC,kBACtBlB,MAAOA,EACPC,UAAWA,GAAS,CAAAW,SAAA,CAEpBC,EAACC,KAAAM,sBACA,CAAAR,SAAA,CAAAR,EAAAiB,IAACC,eAAY,CAAAV,SAAErB,IAEfa,EAAAiB,IAACE,aAAU,CAACC,KAAMC,EAAS,QAAET,QAASjB,OAGvCK,EAACiB,IAAAK,iCAAsBlC,IAEvBqB,EAAAC,KAACa,sBAAmBtB,OAAAC,OAAA,CAACsB,QAAS/B,GAC5B,CAAAe,SAAA,EAACf,GACDO,EAAAA,IAACyB,EAAAA,OAAM,CACNC,WAAYnC,EACZoC,WAAW,eACXf,QAASb,IAGXC,EAAAiB,IAACQ,SAAM,CACNtB,MAAO,CAAEyB,YAAa,IACtBF,WAAYrC,EACZuB,QAAStB,EACTuC,SAAUnC,cAIR"}
1	+ {"version":3,"file":"component.js","sources":["../../../../src/components/vertical-full-screen-modal/component.tsx"],"sourcesContent":["import React from 'react';\nimport CrossIcon from '../../assets/icons/cross.svg';\nimport { Button } from '../button';\nimport { IconButton } from '../icon-button';\nimport { TitleRegular } from '../TypographyStyle';\nimport {\n\tVerticalModalContainer,\n\tVerticalModalContent,\n\tVerticalModalFooter,\n\tVerticalModalHeader,\n} from './styles';\nimport { VerticalFullScreenModalProps } from './types';\n\nconst MODAL_OFFSET_PX = '-424px';\n\n/*\n VerticalFullScreenModal - A reusable full-screen modal component\n \n This component provides a common full-screen modal structure with:\n * - Fixed height (100vh)\n * - Header section with close button\n * - Scrollable body content\n * - Dynamic footer with configurable buttons\n \n @example\n * <VerticalFullScreenModal\n * headerText=\"My Modal\"\n * body={<div>Modal content here</div>}\n * primaryButtonTitle=\"Save\"\n * onSave={handleSave}\n * secondaryButtonTitle=\"Cancel\"\n * secondaryButtonClick={handleCancel}\n * onClose={handleClose}\n * />\n */\nconst VerticalFullScreenModal: React.FC<VerticalFullScreenModalProps> = ({\n\theaderText,\n\tbody,\n\tprimaryButtonTitle,\n\tonSave,\n\tsecondaryButtonTitle = 'Cancel',\n\tsecondaryButtonClick,\n\thideSecondaryButton = false,\n\tdisablePrimaryButton = false,\n\tonClose,\n\twidth,\n\tclassName,\n\tmodalOffsetPx,\n}) => {\n\tconst handleSecondaryClick = secondaryButtonClick \|\| onClose;\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tposition: 'fixed',\n\t\t\t\ttop: 0,\n\t\t\t\tright: modalOffsetPx ? `${modalOffsetPx}px` : MODAL_OFFSET_PX,\n\t\t\t\tbottom: 0,\n\t\t\t}}\n\t\t>\n\t\t\t<VerticalModalContainer\n\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\tonMouseDown={(e) => e.stopPropagation()}\n\t\t\t\twidth={width}\n\t\t\t\tclassName={className}\n\t\t\t>\n\t\t\t\t<VerticalModalHeader>\n\t\t\t\t\t<TitleRegular>{headerText}</TitleRegular>\n\n\t\t\t\t\t<IconButton Icon={CrossIcon} onClick={onClose} />\n\t\t\t\t</VerticalModalHeader>\n\n\t\t\t\t<VerticalModalContent>{body}</VerticalModalContent>\n\n\t\t\t\t<VerticalModalFooter addGap={!hideSecondaryButton}>\n\t\t\t\t\t{!hideSecondaryButton && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tbuttonText={secondaryButtonTitle}\n\t\t\t\t\t\t\tbuttonType=\"tertiaryGray\"\n\t\t\t\t\t\t\tonClick={handleSecondaryClick}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t<Button\n\t\t\t\t\t\tstyle={{ marginRight: 12 }}\n\t\t\t\t\t\tbuttonText={primaryButtonTitle}\n\t\t\t\t\t\tonClick={onSave}\n\t\t\t\t\t\tdisabled={disablePrimaryButton}\n\t\t\t\t\t/>\n\t\t\t\t</VerticalModalFooter>\n\t\t\t</VerticalModalContainer>\n\t\t</div>\n\t);\n};\n\nexport default VerticalFullScreenModal;\n"],"names":["_ref","headerText","body","primaryButtonTitle","onSave","secondaryButtonTitle","secondaryButtonClick","hideSecondaryButton","disablePrimaryButton","onClose","width","className","modalOffsetPx","handleSecondaryClick","_jsx","Object","assign","style","position","top","right","bottom","children","_jsxs","jsxs","VerticalModalContainer","onClick","e","stopPropagation","onMouseDown","VerticalModalHeader","jsx","TitleRegular","IconButton","Icon","CrossIcon","VerticalModalContent","VerticalModalFooter","addGap","Button","buttonText","buttonType","marginRight","disabled"],"mappings":"2SAmCwEA,IAanE,IAboEC,WACxEA,EAAUC,KACVA,EAAIC,mBACJA,EAAkBC,OAClBA,EAAMC,qBACNA,EAAuB,SAAQC,qBAC/BA,EAAoBC,oBACpBA,GAAsB,EAAKC,qBAC3BA,GAAuB,EAAKC,QAC5BA,EAAOC,MACPA,EAAKC,UACLA,EAASC,cACTA,GACAZ,EACA,MAAMa,EAAuBP,GAAwBG,EAErD,OACCK,MACC,MAAAC,OAAAC,OAAA,CAAAC,MAAO,CACNC,SAAU,QACVC,IAAK,EACLC,MAAOR,EAAmB,GAAAA,MA3CN,SA4CpBS,OAAQ,IAGT,CAAAC,SAAAC,EAAAC,KAACC,yBAAsBV,OAAAC,OAAA,CACtBU,QAAUC,GAAMA,EAAEC,kBAClBC,YAAcF,GAAMA,EAAEC,kBACtBlB,MAAOA,EACPC,UAAWA,GAAS,CAAAW,SAAA,CAEpBC,EAACC,KAAAM,sBACA,CAAAR,SAAA,CAAAR,EAAAiB,IAACC,eAAY,CAAAV,SAAErB,IAEfa,EAAAiB,IAACE,aAAU,CAACC,KAAMC,EAAS,QAAET,QAASjB,OAGvCK,EAACiB,IAAAK,iCAAsBlC,IAEvBqB,EAAAC,KAACa,sBAAmBtB,OAAAC,OAAA,CAACsB,QAAS/B,GAC5B,CAAAe,SAAA,EAACf,GACDO,EAAAA,IAACyB,EAAAA,OAAM,CACNC,WAAYnC,EACZoC,WAAW,eACXf,QAASb,IAGXC,EAAAiB,IAACQ,SAAM,CACNtB,MAAO,CAAEyB,YAAa,IACtBF,WAAYrC,EACZuB,QAAStB,EACTuC,SAAUnC,cAIR"}

package/dist/cjs/components/whats-new/WhatsNew.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("./WhatsNewButton.js"),o=require("./WhatsNewPanel.js"),s=require("./WhatsNewProvider.js");exports.WhatsNew=({title:r="What's new",tooltip:i="What's new",searchPlaceholder:a="Search posts",emptyStateTitle:u="Nothing new!",emptyStateDescription:c="There are no new updates or features at the moment. Check back soon!",noResultsText:h="Sorry, no results found.",width:l="480px",onContentClick:d,renderCustomContent:w,buttonTestId:C="whats-new-button",iconWidth:p=32,iconHeight:m=32,customIcon:W})=>{const[x,N]=t.useState(!1),{whatsNewContent:j,isLoading:g,newContentCount:S}=s.useWhatsNewContext();return e.jsxs(e.Fragment,{children:[e.jsx(n.WhatsNewButton,{onClick:()=>N(!0),newContentCount:S,isOpen:x,isLoading:g,tooltip:i,testId:C,iconWidth:p,iconHeight:m,customIcon:W}),e.jsx(o.WhatsNewPanel,{isOpen:x,onClose:()=>N(!1),content:j,isLoading:g,title:r,searchPlaceholder:a,emptyStateTitle:u,emptyStateDescription:c,noResultsText:h,width:l,onContentClick:e=>{d&&d(e)},renderCustomContent:w})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("./WhatsNewButton.js"),o=require("./WhatsNewPanel.js"),s=require("./WhatsNewProvider.js");exports.WhatsNew=r=>{let{title:i="What's new",tooltip:a="What's new",searchPlaceholder:u="Search posts",emptyStateTitle:c="Nothing new!",emptyStateDescription:h="There are no new updates or features at the moment. Check back soon!",noResultsText:l="Sorry, no results found.",width:d="480px",onContentClick:w,renderCustomContent:C,buttonTestId:p="whats-new-button",iconWidth:m=32,iconHeight:W=32,customIcon:x}=r;const[N,j]=t.useState(!1),{whatsNewContent:g,isLoading:S,newContentCount:y}=s.useWhatsNewContext();return e.jsxs(e.Fragment,{children:[e.jsx(n.WhatsNewButton,{onClick:()=>j(!0),newContentCount:y,isOpen:N,isLoading:S,tooltip:a,testId:p,iconWidth:m,iconHeight:W,customIcon:x}),e.jsx(o.WhatsNewPanel,{isOpen:N,onClose:()=>j(!1),content:g,isLoading:S,title:i,searchPlaceholder:u,emptyStateTitle:c,emptyStateDescription:h,noResultsText:l,width:d,onContentClick:e=>{w&&w(e)},renderCustomContent:C})]})};
 //# sourceMappingURL=WhatsNew.js.map

package/dist/cjs/components/whats-new/WhatsNew.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"WhatsNew.js","sources":["../../../../src/components/whats-new/WhatsNew.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { WhatsNewContent } from './WhatsNew.types';\nimport { WhatsNewButton } from './WhatsNewButton';\nimport { WhatsNewPanel } from './WhatsNewPanel';\nimport { useWhatsNewContext } from './WhatsNewProvider';\n\ninterface WhatsNewProps {\n\ttitle?: string;\n\ttooltip?: string;\n\tsearchPlaceholder?: string;\n\temptyStateTitle?: string;\n\temptyStateDescription?: string;\n\tnoResultsText?: string;\n\twidth?: string;\n\tonContentClick?: (content: WhatsNewContent) => void;\n\trenderCustomContent?: (content: WhatsNewContent) => React.ReactNode;\n\tbuttonTestId?: string;\n\ticonWidth?: number;\n\ticonHeight?: number;\n\tcustomIcon?: React.ComponentType<{\n\t\twidth?: number;\n\t\theight?: number;\n\t\tcolor?: string;\n\t}>;\n}\n\nexport const WhatsNew: React.FC<WhatsNewProps> = ({\n\ttitle = \"What's new\",\n\ttooltip = \"What's new\",\n\tsearchPlaceholder = 'Search posts',\n\temptyStateTitle = 'Nothing new!',\n\temptyStateDescription = 'There are no new updates or features at the moment. Check back soon!',\n\tnoResultsText = 'Sorry, no results found.',\n\twidth = '480px',\n\tonContentClick,\n\trenderCustomContent,\n\tbuttonTestId = 'whats-new-button',\n\ticonWidth = 32,\n\ticonHeight = 32,\n\tcustomIcon,\n}) => {\n\tconst [isOpen, setIsOpen] = useState(false);\n\tconst { whatsNewContent, isLoading, newContentCount } = useWhatsNewContext();\n\n\tconst handleOpen = () => setIsOpen(true);\n\tconst handleClose = () => setIsOpen(false);\n\n\tconst handleContentClick = (contentItem: WhatsNewContent) => {\n\t\t// WhatsNewPanel handles video/redirect logic directly\n\t\t// This handler is only for parent-level analytics/tracking\n\n\t\tif (onContentClick) {\n\t\t\tonContentClick(contentItem);\n\t\t}\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<WhatsNewButton\n\t\t\t\tonClick={handleOpen}\n\t\t\t\tnewContentCount={newContentCount}\n\t\t\t\tisOpen={isOpen}\n\t\t\t\tisLoading={isLoading}\n\t\t\t\ttooltip={tooltip}\n\t\t\t\ttestId={buttonTestId}\n\t\t\t\ticonWidth={iconWidth}\n\t\t\t\ticonHeight={iconHeight}\n\t\t\t\tcustomIcon={customIcon}\n\t\t\t/>\n\t\t\t<WhatsNewPanel\n\t\t\t\tisOpen={isOpen}\n\t\t\t\tonClose={handleClose}\n\t\t\t\tcontent={whatsNewContent}\n\t\t\t\tisLoading={isLoading}\n\t\t\t\ttitle={title}\n\t\t\t\tsearchPlaceholder={searchPlaceholder}\n\t\t\t\temptyStateTitle={emptyStateTitle}\n\t\t\t\temptyStateDescription={emptyStateDescription}\n\t\t\t\tnoResultsText={noResultsText}\n\t\t\t\twidth={width}\n\t\t\t\tonContentClick={handleContentClick}\n\t\t\t\trenderCustomContent={renderCustomContent}\n\t\t\t/>\n\t\t</>\n\t);\n};\n"],"names":["~~WhatsNew~~","title","tooltip","searchPlaceholder","emptyStateTitle","emptyStateDescription","noResultsText","width","onContentClick","renderCustomContent","buttonTestId","iconWidth","iconHeight","customIcon","isOpen","setIsOpen","useState","whatsNewContent","isLoading","newContentCount","useWhatsNewContext","_jsxs","_jsx","jsx","WhatsNewButton","onClick","handleOpen","testId","WhatsNewPanel","onClose","handleClose","content","contentItem"],"mappings":"+OA0BiDA,~~EAChDC~~,~~QAAQ~~,~~aACRC~~,~~UAAU~~,~~aACVC~~,~~oBAAoB~~,~~eACpBC~~,~~kBAAkB~~,~~eAClBC~~,~~wBAAwB~~,~~uEACxBC~~,~~gBAAgB~~,~~2BAChBC~~,~~QAAQ~~,~~QACRC~~,~~iBACAC~~,~~sBACAC~~,~~eAAe~~,~~mBACfC~~,~~YAAY~~,~~GACZC~~,~~aAAa~~,~~GACbC~~,~~iBAEA~~,~~MAAOC~~,EAAQC,GAAaC,EAAQA,UAAC,IAC/BC,gBAAEA,EAAeC,UAAEA,EAASC,gBAAEA,GAAoBC,EAAkBA,qBAc1E,OACCC,EAAAA,2BACCC,EAACC,IAAAC,kBACAC,QAfgBC,IAAMX,GAAU,GAgBhCI,gBAAiBA,EACjBL,OAAQA,EACRI,UAAWA,EACXhB,QAASA,EACTyB,OAAQjB,EACRC,UAAWA,EACXC,WAAYA,EACZC,WAAYA,IAEbS,EAAAC,IAACK,gBAAa,CACbd,OAAQA,EACRe,QA1BiBC,IAAMf,GAAU,GA2BjCgB,QAASd,EACTC,UAAWA,EACXjB,MAAOA,EACPE,kBAAmBA,EACnBC,gBAAiBA,EACjBC,sBAAuBA,EACvBC,cAAeA,EACfC,MAAOA,EACPC,eAjCyBwB,IAIvBxB,GACHA,EAAewB,EACf,EA4BCvB,oBAAqBA,MAEpB"}
1	+ {"version":3,"file":"WhatsNew.js","sources":["../../../../src/components/whats-new/WhatsNew.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { WhatsNewContent } from './WhatsNew.types';\nimport { WhatsNewButton } from './WhatsNewButton';\nimport { WhatsNewPanel } from './WhatsNewPanel';\nimport { useWhatsNewContext } from './WhatsNewProvider';\n\ninterface WhatsNewProps {\n\ttitle?: string;\n\ttooltip?: string;\n\tsearchPlaceholder?: string;\n\temptyStateTitle?: string;\n\temptyStateDescription?: string;\n\tnoResultsText?: string;\n\twidth?: string;\n\tonContentClick?: (content: WhatsNewContent) => void;\n\trenderCustomContent?: (content: WhatsNewContent) => React.ReactNode;\n\tbuttonTestId?: string;\n\ticonWidth?: number;\n\ticonHeight?: number;\n\tcustomIcon?: React.ComponentType<{\n\t\twidth?: number;\n\t\theight?: number;\n\t\tcolor?: string;\n\t}>;\n}\n\nexport const WhatsNew: React.FC<WhatsNewProps> = ({\n\ttitle = \"What's new\",\n\ttooltip = \"What's new\",\n\tsearchPlaceholder = 'Search posts',\n\temptyStateTitle = 'Nothing new!',\n\temptyStateDescription = 'There are no new updates or features at the moment. Check back soon!',\n\tnoResultsText = 'Sorry, no results found.',\n\twidth = '480px',\n\tonContentClick,\n\trenderCustomContent,\n\tbuttonTestId = 'whats-new-button',\n\ticonWidth = 32,\n\ticonHeight = 32,\n\tcustomIcon,\n}) => {\n\tconst [isOpen, setIsOpen] = useState(false);\n\tconst { whatsNewContent, isLoading, newContentCount } = useWhatsNewContext();\n\n\tconst handleOpen = () => setIsOpen(true);\n\tconst handleClose = () => setIsOpen(false);\n\n\tconst handleContentClick = (contentItem: WhatsNewContent) => {\n\t\t// WhatsNewPanel handles video/redirect logic directly\n\t\t// This handler is only for parent-level analytics/tracking\n\n\t\tif (onContentClick) {\n\t\t\tonContentClick(contentItem);\n\t\t}\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<WhatsNewButton\n\t\t\t\tonClick={handleOpen}\n\t\t\t\tnewContentCount={newContentCount}\n\t\t\t\tisOpen={isOpen}\n\t\t\t\tisLoading={isLoading}\n\t\t\t\ttooltip={tooltip}\n\t\t\t\ttestId={buttonTestId}\n\t\t\t\ticonWidth={iconWidth}\n\t\t\t\ticonHeight={iconHeight}\n\t\t\t\tcustomIcon={customIcon}\n\t\t\t/>\n\t\t\t<WhatsNewPanel\n\t\t\t\tisOpen={isOpen}\n\t\t\t\tonClose={handleClose}\n\t\t\t\tcontent={whatsNewContent}\n\t\t\t\tisLoading={isLoading}\n\t\t\t\ttitle={title}\n\t\t\t\tsearchPlaceholder={searchPlaceholder}\n\t\t\t\temptyStateTitle={emptyStateTitle}\n\t\t\t\temptyStateDescription={emptyStateDescription}\n\t\t\t\tnoResultsText={noResultsText}\n\t\t\t\twidth={width}\n\t\t\t\tonContentClick={handleContentClick}\n\t\t\t\trenderCustomContent={renderCustomContent}\n\t\t\t/>\n\t\t</>\n\t);\n};\n"],"names":["_ref","title","tooltip","searchPlaceholder","emptyStateTitle","emptyStateDescription","noResultsText","width","onContentClick","renderCustomContent","buttonTestId","iconWidth","iconHeight","customIcon","isOpen","setIsOpen","useState","whatsNewContent","isLoading","newContentCount","useWhatsNewContext","_jsxs","_jsx","jsx","WhatsNewButton","onClick","handleOpen","testId","WhatsNewPanel","onClose","handleClose","content","contentItem"],"mappings":"+OA0BiDA,IAc5C,IAd6CC,MACjDA,EAAQ,aAAYC,QACpBA,EAAU,aAAYC,kBACtBA,EAAoB,eAAcC,gBAClCA,EAAkB,eAAcC,sBAChCA,EAAwB,uEAAsEC,cAC9FA,EAAgB,2BAA0BC,MAC1CA,EAAQ,QAAOC,eACfA,EAAcC,oBACdA,EAAmBC,aACnBA,EAAe,mBAAkBC,UACjCA,EAAY,GAAEC,WACdA,EAAa,GAAEC,WACfA,GACAb,EACA,MAAOc,EAAQC,GAAaC,EAAQA,UAAC,IAC/BC,gBAAEA,EAAeC,UAAEA,EAASC,gBAAEA,GAAoBC,EAAkBA,qBAc1E,OACCC,EAAAA,2BACCC,EAACC,IAAAC,kBACAC,QAfgBC,IAAMX,GAAU,GAgBhCI,gBAAiBA,EACjBL,OAAQA,EACRI,UAAWA,EACXhB,QAASA,EACTyB,OAAQjB,EACRC,UAAWA,EACXC,WAAYA,EACZC,WAAYA,IAEbS,EAAAC,IAACK,gBAAa,CACbd,OAAQA,EACRe,QA1BiBC,IAAMf,GAAU,GA2BjCgB,QAASd,EACTC,UAAWA,EACXjB,MAAOA,EACPE,kBAAmBA,EACnBC,gBAAiBA,EACjBC,sBAAuBA,EACvBC,cAAeA,EACfC,MAAOA,EACPC,eAjCyBwB,IAIvBxB,GACHA,EAAewB,EACf,EA4BCvB,oBAAqBA,MAEpB"}

package/dist/cjs/components/whats-new/WhatsNewButton.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react/jsx-runtime"),e=require("../../assets/icons/whatsNew.svg.js"),s=require("../../constants/Theme.js"),i=require("../tooltips/Tooltip.js"),n=require("./WhatsNew.styles.js");exports.WhatsNewButton=({onClick:o,newContentCount:r=0,isOpen:a=!1,isLoading:c=!1,tooltip:d="What's new",testId:l="whats-new-button",iconWidth:h=32,iconHeight:j=32,customIcon:x})=>c?t.jsxs("div",Object.assign({style:{margin:"0px 8px"}},{children:[t.jsx("div",{style:{width:16,height:16,border:"2px solid #f3f3f3",borderTop:"2px solid #731DCF",borderRadius:"50%",animation:"spin 1s linear infinite"}}),t.jsx("style",{children:"\n\t\t\t\t\t\t@keyframes spin {\n\t\t\t\t\t\t\t0% { transform: rotate(0deg); }\n\t\t\t\t\t\t\t100% { transform: rotate(360deg); }\n\t\t\t\t\t\t}\n\t\t\t\t\t"})]})):t.jsx(n.WhatsNewIconContainer,Object.assign({count:r},{children:t.jsxs("div",Object.assign({className:"main-icon-class "+(a?"icon-active":""),style:{color:a?s.COLORS.content.brand:s.COLORS.content.primary},onClick:o,"data-testid":l},{children:[t.jsx(i.Tooltip,Object.assign({body:d,placement:"bottom"},{children:t.jsx("div",{children:x?t.jsx(x,{width:h,height:j,color:a?s.COLORS.content.brand:s.COLORS.content.primary}):t.jsx(e.default,{width:h,height:j})})})),r>0&&t.jsx("div",Object.assign({className:"notification--count"},{children:t.jsx("div",Object.assign({className:"count--text"},{children:r}))}))]}))}));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react/jsx-runtime"),e=require("../../assets/icons/whatsNew.svg.js"),s=require("../../constants/Theme.js"),n=require("../tooltips/Tooltip.js"),i=require("./WhatsNew.styles.js");exports.WhatsNewButton=o=>{let{onClick:r,newContentCount:a=0,isOpen:c=!1,isLoading:d=!1,tooltip:l="What's new",testId:h="whats-new-button",iconWidth:j=32,iconHeight:u=32,customIcon:x}=o;return d?t.jsxs("div",Object.assign({style:{margin:"0px 8px"}},{children:[t.jsx("div",{style:{width:16,height:16,border:"2px solid #f3f3f3",borderTop:"2px solid #731DCF",borderRadius:"50%",animation:"spin 1s linear infinite"}}),t.jsx("style",{children:"\n\t\t\t\t\t\t@keyframes spin {\n\t\t\t\t\t\t\t0% { transform: rotate(0deg); }\n\t\t\t\t\t\t\t100% { transform: rotate(360deg); }\n\t\t\t\t\t\t}\n\t\t\t\t\t"})]})):t.jsx(i.WhatsNewIconContainer,Object.assign({count:a},{children:t.jsxs("div",Object.assign({className:"main-icon-class "+(c?"icon-active":""),style:{color:c?s.COLORS.content.brand:s.COLORS.content.primary},onClick:r,"data-testid":h},{children:[t.jsx(n.Tooltip,Object.assign({body:l,placement:"bottom"},{children:t.jsx("div",{children:x?t.jsx(x,{width:j,height:u,color:c?s.COLORS.content.brand:s.COLORS.content.primary}):t.jsx(e.default,{width:j,height:u})})})),a>0&&t.jsx("div",Object.assign({className:"notification--count"},{children:t.jsx("div",Object.assign({className:"count--text"},{children:a}))}))]}))}))};
 //# sourceMappingURL=WhatsNewButton.js.map

package/dist/cjs/components/whats-new/WhatsNewButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"WhatsNewButton.js","sources":["../../../../src/components/whats-new/WhatsNewButton.tsx"],"sourcesContent":["import React from 'react';\nimport WhatsNewIcon from '../../assets/icons/whatsNew.svg';\nimport { COLORS } from '../../constants/Theme';\nimport { Tooltip } from '../tooltips';\nimport { WhatsNewIconContainer } from './WhatsNew.styles';\nimport { WhatsNewButtonProps } from './WhatsNew.types';\n\nexport const WhatsNewButton: React.FC<WhatsNewButtonProps> = ({\n\tonClick,\n\tnewContentCount = 0,\n\tisOpen = false,\n\tisLoading = false,\n\ttooltip = \"What's new\",\n\ttestId = 'whats-new-button',\n\ticonWidth = 32,\n\ticonHeight = 32,\n\tcustomIcon: CustomIcon,\n}) => {\n\tif (isLoading) {\n\t\treturn (\n\t\t\t<div style={{ margin: '0px 8px' }}>\n\t\t\t\t{/* Simple loading spinner */}\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\twidth: 16,\n\t\t\t\t\t\theight: 16,\n\t\t\t\t\t\tborder: '2px solid #f3f3f3',\n\t\t\t\t\t\tborderTop: '2px solid #731DCF',\n\t\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t\t\tanimation: 'spin 1s linear infinite',\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<style>\n\t\t\t\t\t{`\n\t\t\t\t\t\t@keyframes spin {\n\t\t\t\t\t\t\t0% { transform: rotate(0deg); }\n\t\t\t\t\t\t\t100% { transform: rotate(360deg); }\n\t\t\t\t\t\t}\n\t\t\t\t\t`}\n\t\t\t\t</style>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<WhatsNewIconContainer count={newContentCount}>\n\t\t\t<div\n\t\t\t\tclassName={`main-icon-class ${isOpen ? 'icon-active' : ''}`}\n\t\t\t\tstyle={{\n\t\t\t\t\tcolor: isOpen ? COLORS.content.brand : COLORS.content.primary,\n\t\t\t\t}}\n\t\t\t\tonClick={onClick}\n\t\t\t\tdata-testid={testId}\n\t\t\t>\n\t\t\t\t<Tooltip body={tooltip} placement={'bottom'}>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t{CustomIcon ? (\n\t\t\t\t\t\t\t<CustomIcon\n\t\t\t\t\t\t\t\twidth={iconWidth}\n\t\t\t\t\t\t\t\theight={iconHeight}\n\t\t\t\t\t\t\t\tcolor={isOpen ? COLORS.content.brand : COLORS.content.primary}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<WhatsNewIcon width={iconWidth} height={iconHeight} />\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</Tooltip>\n\t\t\t\t{newContentCount > 0 && (\n\t\t\t\t\t<div className=\"notification--count\">\n\t\t\t\t\t\t<div className=\"count--text\">{newContentCount}</div>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</WhatsNewIconContainer>\n\t);\n};\n"],"names":["~~WhatsNewButton~~","onClick","newContentCount","isOpen","isLoading","tooltip","testId","iconWidth","iconHeight","customIcon","CustomIcon","_jsxs","Object","assign","style","margin","children","_jsx","jsx","width","height","border","borderTop","borderRadius","animation","WhatsNewIconContainer","count","jsxs","className","color","COLORS","content","brand","primary","Tooltip","body","placement","WhatsNewIcon"],"mappings":"0RAO6DA,~~EAC5DC~~,~~UACAC~~,~~kBAAkB~~,~~EAClBC~~,~~UAAS~~,~~EACTC~~,~~aAAY~~,~~EACZC~~,~~UAAU~~,~~aACVC~~,~~SAAS~~,~~mBACTC~~,~~YAAY~~,~~GACZC~~,~~aAAa~~,GACbC,WAAYC,~~KAERN~~,EAEFO,OAAA,MAAAC,OAAAC,OAAA,CAAKC,MAAO,CAAEC,OAAQ,YAAW,CAAAC,SAAA,CAEhCC,EACCC,IAAA,MAAA,CAAAJ,MAAO,CACNK,MAAO,GACPC,OAAQ,GACRC,OAAQ,oBACRC,UAAW,oBACXC,aAAc,MACdC,UAAW,6BAGbP,EACEC,IAAA,QAAA,CAAAF,SAAA,qKAYJC,MAACQ,EAAAA,sBAAsBb,OAAAC,OAAA,CAAAa,MAAOxB,GAAe,CAAAc,SAC5CL,EACCgB,KAAA,MAAAf,OAAAC,OAAA,CAAAe,UAAW,oBAAmBzB,EAAS,cAAgB,IACvDW,MAAO,CACNe,MAAO1B,EAAS2B,SAAOC,QAAQC,MAAQF,EAAAA,OAAOC,QAAQE,SAEvDhC,QAASA,EAAO,cACHK,GAEb,CAAAU,SAAA,CAAAC,EAAAC,IAACgB,UAAQtB,OAAAC,OAAA,CAAAsB,KAAM9B,EAAS+B,UAAW,oBAClCnB,EACEC,IAAA,MAAA,CAAAF,SAAAN,EACAO,MAACP,EAAU,CACVS,MAAOZ,EACPa,OAAQZ,EACRqB,MAAO1B,EAAS2B,SAAOC,QAAQC,MAAQF,EAAAA,OAAOC,QAAQE,UAGvDhB,EAAAC,IAACmB,UAAa,CAAAlB,MAAOZ,EAAWa,OAAQZ,SAI1CN,EAAkB,GAClBe,2BAAKW,UAAU,uBACd,CAAAZ,SAAAC,EAAAC,IAAA,MAAAN,OAAAC,OAAA,CAAKe,UAAU,yBAAe1B"}
1	+ {"version":3,"file":"WhatsNewButton.js","sources":["../../../../src/components/whats-new/WhatsNewButton.tsx"],"sourcesContent":["import React from 'react';\nimport WhatsNewIcon from '../../assets/icons/whatsNew.svg';\nimport { COLORS } from '../../constants/Theme';\nimport { Tooltip } from '../tooltips';\nimport { WhatsNewIconContainer } from './WhatsNew.styles';\nimport { WhatsNewButtonProps } from './WhatsNew.types';\n\nexport const WhatsNewButton: React.FC<WhatsNewButtonProps> = ({\n\tonClick,\n\tnewContentCount = 0,\n\tisOpen = false,\n\tisLoading = false,\n\ttooltip = \"What's new\",\n\ttestId = 'whats-new-button',\n\ticonWidth = 32,\n\ticonHeight = 32,\n\tcustomIcon: CustomIcon,\n}) => {\n\tif (isLoading) {\n\t\treturn (\n\t\t\t<div style={{ margin: '0px 8px' }}>\n\t\t\t\t{/* Simple loading spinner */}\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\twidth: 16,\n\t\t\t\t\t\theight: 16,\n\t\t\t\t\t\tborder: '2px solid #f3f3f3',\n\t\t\t\t\t\tborderTop: '2px solid #731DCF',\n\t\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t\t\tanimation: 'spin 1s linear infinite',\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<style>\n\t\t\t\t\t{`\n\t\t\t\t\t\t@keyframes spin {\n\t\t\t\t\t\t\t0% { transform: rotate(0deg); }\n\t\t\t\t\t\t\t100% { transform: rotate(360deg); }\n\t\t\t\t\t\t}\n\t\t\t\t\t`}\n\t\t\t\t</style>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<WhatsNewIconContainer count={newContentCount}>\n\t\t\t<div\n\t\t\t\tclassName={`main-icon-class ${isOpen ? 'icon-active' : ''}`}\n\t\t\t\tstyle={{\n\t\t\t\t\tcolor: isOpen ? COLORS.content.brand : COLORS.content.primary,\n\t\t\t\t}}\n\t\t\t\tonClick={onClick}\n\t\t\t\tdata-testid={testId}\n\t\t\t>\n\t\t\t\t<Tooltip body={tooltip} placement={'bottom'}>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t{CustomIcon ? (\n\t\t\t\t\t\t\t<CustomIcon\n\t\t\t\t\t\t\t\twidth={iconWidth}\n\t\t\t\t\t\t\t\theight={iconHeight}\n\t\t\t\t\t\t\t\tcolor={isOpen ? COLORS.content.brand : COLORS.content.primary}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<WhatsNewIcon width={iconWidth} height={iconHeight} />\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</Tooltip>\n\t\t\t\t{newContentCount > 0 && (\n\t\t\t\t\t<div className=\"notification--count\">\n\t\t\t\t\t\t<div className=\"count--text\">{newContentCount}</div>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</WhatsNewIconContainer>\n\t);\n};\n"],"names":["_ref","onClick","newContentCount","isOpen","isLoading","tooltip","testId","iconWidth","iconHeight","customIcon","CustomIcon","_jsxs","Object","assign","style","margin","children","_jsx","jsx","width","height","border","borderTop","borderRadius","animation","WhatsNewIconContainer","count","jsxs","className","color","COLORS","content","brand","primary","Tooltip","body","placement","WhatsNewIcon"],"mappings":"0RAO6DA,IAUxD,IAVyDC,QAC7DA,EAAOC,gBACPA,EAAkB,EAACC,OACnBA,GAAS,EAAKC,UACdA,GAAY,EAAKC,QACjBA,EAAU,aAAYC,OACtBA,EAAS,mBAAkBC,UAC3BA,EAAY,GAAEC,WACdA,EAAa,GACbC,WAAYC,GACZV,EACA,OAAII,EAEFO,OAAA,MAAAC,OAAAC,OAAA,CAAKC,MAAO,CAAEC,OAAQ,YAAW,CAAAC,SAAA,CAEhCC,EACCC,IAAA,MAAA,CAAAJ,MAAO,CACNK,MAAO,GACPC,OAAQ,GACRC,OAAQ,oBACRC,UAAW,oBACXC,aAAc,MACdC,UAAW,6BAGbP,EACEC,IAAA,QAAA,CAAAF,SAAA,qKAYJC,MAACQ,EAAAA,sBAAsBb,OAAAC,OAAA,CAAAa,MAAOxB,GAAe,CAAAc,SAC5CL,EACCgB,KAAA,MAAAf,OAAAC,OAAA,CAAAe,UAAW,oBAAmBzB,EAAS,cAAgB,IACvDW,MAAO,CACNe,MAAO1B,EAAS2B,SAAOC,QAAQC,MAAQF,EAAAA,OAAOC,QAAQE,SAEvDhC,QAASA,EAAO,cACHK,GAEb,CAAAU,SAAA,CAAAC,EAAAC,IAACgB,UAAQtB,OAAAC,OAAA,CAAAsB,KAAM9B,EAAS+B,UAAW,oBAClCnB,EACEC,IAAA,MAAA,CAAAF,SAAAN,EACAO,MAACP,EAAU,CACVS,MAAOZ,EACPa,OAAQZ,EACRqB,MAAO1B,EAAS2B,SAAOC,QAAQC,MAAQF,EAAAA,OAAOC,QAAQE,UAGvDhB,EAAAC,IAACmB,UAAa,CAAAlB,MAAOZ,EAAWa,OAAQZ,SAI1CN,EAAkB,GAClBe,2BAAKW,UAAU,uBACd,CAAAZ,SAAAC,EAAAC,IAAA,MAAAN,OAAAC,OAAA,CAAKe,UAAU,yBAAe1B,cAIV"}

package/dist/cjs/components/whats-new/WhatsNewPanel.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("date-fns"),s=require("react"),r=require("../../assets/icons/searchIcon.svg.js"),a=require("../../assets/icons/whatsNew.svg.js"),n=require("../../constants/Theme.js"),i=require("../button/Button.js"),o=require("../feature-announcements/VideoModal.js"),d=require("../searchBar/searchBar.js"),c=require("../side-modal/SideModal.js"),l=require("../TypographyStyle.js"),h=require("./WhatsNew.styles.js");exports.WhatsNewPanel=({isOpen:u,onClose:j,content:m,isLoading:x=!1,title:g="What's new on BIK",searchPlaceholder:p="Search posts",emptyStateTitle:w="Nothing new!",emptyStateDescription:y="There are no new updates or features at the moment. Check back soon!",noResultsText:b="Sorry, no results found.",width:C="480px",onContentClick:O,renderCustomContent:f})=>{const[v,N]=s.useState(""),[S,M]=s.useState(!1),[B,q]=s.useState(""),L=e=>{if(!e.createdAt)return!1;const s=e.createdAt.toDate?e.createdAt.toDate():new Date(e.createdAt);return t.differenceInBusinessDays(new Date,s)<7},T=s.useMemo((()=>{if(!v.trim())return m;const e=v.toLowerCase();return m.filter((t=>t.title.toLowerCase().includes(e)||t.body.toLowerCase().includes(e)||t.content&&t.content.toLowerCase().includes(e)))}),[m,v]),k=0===m.length,D=0===T.length;return u?e.jsxs(c.SideModal,Object.assign({width:C,onClose:j,header:"",headerCustomComponent:e.jsx(l.TitleMedium,Object.assign({color:n.COLORS.background.inverse},{children:g})),headerStyle:{background:n.COLORS.background.brandLight},hideFooter:!0},{children:[e.jsxs(h.MainContainer,{children:[e.jsx("div",Object.assign({className:"mt-8"},{children:e.jsx(d.SearchBar,{width:"100%",isEnabled:!k,onChange:e=>{N(e)},onEnter:e=>{N(e)},placeholder:p,variant:"default",searchValue:v,onClickCross:()=>{N("")}})})),e.jsx(h.WhatsNewWrapper,{children:k||D?e.jsxs("div",Object.assign({className:"no--data--found"},{children:[e.jsx("div",Object.assign({className:"icon--wrapper"},{children:k?e.jsx(a.default,{width:32,height:32}):e.jsx(r.default,{width:32,height:32})})),k?e.jsxs(e.Fragment,{children:[e.jsx(l.TitleRegular,{children:w}),e.jsx(l.BodyPrimary,Object.assign({color:n.COLORS.content.secondary,className:"text--align",style:{maxWidth:300}},{children:y}))]}):D?e.jsx(l.BodyPrimary,Object.assign({color:n.COLORS.content.secondary,className:"text--align",style:{maxWidth:300}},{children:b})):null]})):e.jsx("div",Object.assign({className:"scroller"},{children:T.map(((s,r)=>{var a;return f?f(s):e.jsxs(h.MainCardContainer,Object.assign({className:"padding--16 mb-mt-8"},{children:[e.jsx(h.BackgroundImageContainer,{imageUrl:s.image,height:"209px",width:"100%",style:{borderRadius:"4px"}}),e.jsx("div",Object.assign({className:"mt-20 full--width"},{children:e.jsxs("div",Object.assign({className:"created--at flex flex--row"},{children:[L(s)?e.jsx("div",Object.assign({className:"new--content--tag"},{children:e.jsx(l.Caption,{children:"New"})})):e.jsx(e.Fragment,{}),e.jsx(l.Caption,Object.assign({style:{color:n.COLORS.content.placeholder}},{children:s.createdAt?t.format(s.createdAt.toDate?s.createdAt.toDate():new Date(s.createdAt),"dd MMMM yyyy"):""}))]}))})),e.jsx("div",Object.assign({className:"mt--8"},{children:e.jsx(l.TitleSmall,{children:s.title})})),e.jsx("div",{dangerouslySetInnerHTML:{__html:s.body},className:"card--desc mt--12"}),e.jsx("div",Object.assign({className:"flex flex--row mt-20 full--width"},{children:e.jsx(i.Button,{buttonText:(null===(a=s.primaryButton)||void 0===a?void 0:a.text)||s.buttonText||"Explore the feature",onClick:()=>(e=>{var t,s;const r=null===(t=e.primaryButton)||void 0===t?void 0:t.action;if("Play Video"===r||!r&&e.productVideo)e.productVideo&&(q(e.productVideo),M(!0));else{const t=(null===(s=e.primaryButton)||void 0===s?void 0:s.redirectionUrl)||e.redirectUrl;t&&(t.startsWith("http")?window.open(t,"_blank","noopener,noreferrer"):window.location.href=t)}O&&O(e)})(s),matchParentWidth:!0,size:"medium"})}))]}),`whats-new-${r}`)}))}))})]}),e.jsx(o.VideoModal,{isOpen:S,videoUrl:B,onClose:()=>{M(!1)}})]})):e.jsx(e.Fragment,{})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("date-fns"),s=require("react"),r=require("../../assets/icons/searchIcon.svg.js"),a=require("../../assets/icons/whatsNew.svg.js"),n=require("../../constants/Theme.js"),i=require("../button/Button.js"),o=require("../feature-announcements/VideoModal.js"),d=require("../searchBar/searchBar.js"),c=require("../side-modal/SideModal.js"),l=require("../TypographyStyle.js"),h=require("./WhatsNew.styles.js");exports.WhatsNewPanel=u=>{let{isOpen:j,onClose:m,content:x,isLoading:g=!1,title:p="What's new on BIK",searchPlaceholder:w="Search posts",emptyStateTitle:y="Nothing new!",emptyStateDescription:b="There are no new updates or features at the moment. Check back soon!",noResultsText:C="Sorry, no results found.",width:O="480px",onContentClick:f,renderCustomContent:v}=u;const[N,S]=s.useState(""),[M,B]=s.useState(!1),[q,L]=s.useState(""),T=e=>{if(!e.createdAt)return!1;const s=e.createdAt.toDate?e.createdAt.toDate():new Date(e.createdAt);return t.differenceInBusinessDays(new Date,s)<7},k=s.useMemo((()=>{if(!N.trim())return x;const e=N.toLowerCase();return x.filter((t=>t.title.toLowerCase().includes(e)||t.body.toLowerCase().includes(e)||t.content&&t.content.toLowerCase().includes(e)))}),[x,N]),D=0===x.length,W=0===k.length;return j?e.jsxs(c.SideModal,Object.assign({width:O,onClose:m,header:"",headerCustomComponent:e.jsx(l.TitleMedium,Object.assign({color:n.COLORS.background.inverse},{children:p})),headerStyle:{background:n.COLORS.background.brandLight},hideFooter:!0},{children:[e.jsxs(h.MainContainer,{children:[e.jsx("div",Object.assign({className:"mt-8"},{children:e.jsx(d.SearchBar,{width:"100%",isEnabled:!D,onChange:e=>{S(e)},onEnter:e=>{S(e)},placeholder:w,variant:"default",searchValue:N,onClickCross:()=>{S("")}})})),e.jsx(h.WhatsNewWrapper,{children:D||W?e.jsxs("div",Object.assign({className:"no--data--found"},{children:[e.jsx("div",Object.assign({className:"icon--wrapper"},{children:D?e.jsx(a.default,{width:32,height:32}):e.jsx(r.default,{width:32,height:32})})),D?e.jsxs(e.Fragment,{children:[e.jsx(l.TitleRegular,{children:y}),e.jsx(l.BodyPrimary,Object.assign({color:n.COLORS.content.secondary,className:"text--align",style:{maxWidth:300}},{children:b}))]}):W?e.jsx(l.BodyPrimary,Object.assign({color:n.COLORS.content.secondary,className:"text--align",style:{maxWidth:300}},{children:C})):null]})):e.jsx("div",Object.assign({className:"scroller"},{children:k.map(((s,r)=>{var a;return v?v(s):e.jsxs(h.MainCardContainer,Object.assign({className:"padding--16 mb-mt-8"},{children:[e.jsx(h.BackgroundImageContainer,{imageUrl:s.image,height:"209px",width:"100%",style:{borderRadius:"4px"}}),e.jsx("div",Object.assign({className:"mt-20 full--width"},{children:e.jsxs("div",Object.assign({className:"created--at flex flex--row"},{children:[T(s)?e.jsx("div",Object.assign({className:"new--content--tag"},{children:e.jsx(l.Caption,{children:"New"})})):e.jsx(e.Fragment,{}),e.jsx(l.Caption,Object.assign({style:{color:n.COLORS.content.placeholder}},{children:s.createdAt?t.format(s.createdAt.toDate?s.createdAt.toDate():new Date(s.createdAt),"dd MMMM yyyy"):""}))]}))})),e.jsx("div",Object.assign({className:"mt--8"},{children:e.jsx(l.TitleSmall,{children:s.title})})),e.jsx("div",{dangerouslySetInnerHTML:{__html:s.body},className:"card--desc mt--12"}),e.jsx("div",Object.assign({className:"flex flex--row mt-20 full--width"},{children:e.jsx(i.Button,{buttonText:(null===(a=s.primaryButton)||void 0===a?void 0:a.text)||s.buttonText||"Explore the feature",onClick:()=>(e=>{var t,s;const r=null===(t=e.primaryButton)||void 0===t?void 0:t.action;if("Play Video"===r||!r&&e.productVideo)e.productVideo&&(L(e.productVideo),B(!0));else{const t=(null===(s=e.primaryButton)||void 0===s?void 0:s.redirectionUrl)||e.redirectUrl;t&&(t.startsWith("http")?window.open(t,"_blank","noopener,noreferrer"):window.location.href=t)}f&&f(e)})(s),matchParentWidth:!0,size:"medium"})}))]}),`whats-new-${r}`)}))}))})]}),e.jsx(o.VideoModal,{isOpen:M,videoUrl:q,onClose:()=>{B(!1)}})]})):e.jsx(e.Fragment,{})};
 //# sourceMappingURL=WhatsNewPanel.js.map