@bikdotai/bik-component-library 0.0.660-beta.0 → 0.0.662-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 (49) hide show
  1. package/dist/cjs/components/QueryBuilder/components/QueryBuilderNodes.js +1 -1
  2. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/LineChart/LineChart.d.ts +2 -0
  3. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/LineChart/LineChart.js +1 -1
  4. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js +1 -1
  5. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.model.d.ts +2 -0
  6. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.styles.d.ts +1 -0
  7. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.styles.js +6 -2
  8. package/dist/cjs/components/avatar/Avatar.d.ts +1 -3
  9. package/dist/cjs/components/avatar/Avatar.js +1 -1
  10. package/dist/cjs/components/bik-layout/MockMenus.d.ts +0 -1
  11. package/dist/cjs/components/plans/NewSubscriptionPlan.js +1 -1
  12. package/dist/cjs/components/plans/SubscriptionPlan.d.ts +1 -0
  13. package/dist/cjs/components/plans/SubscriptionPlan.js +1 -1
  14. package/dist/cjs/components/product-picker-v2/modal.d.ts +1 -0
  15. package/dist/cjs/components/product-picker-v2/modal.js +1 -1
  16. package/dist/cjs/components/product-picker-v2/product.js +1 -1
  17. package/dist/cjs/components/product-picker-v2/productInfoOverlay.js +7 -7
  18. package/dist/cjs/components/product-picker-v2/productScreen.js +1 -1
  19. package/dist/cjs/components/product-picker-v2/style.d.ts +11 -0
  20. package/dist/cjs/components/product-picker-v2/style.js +53 -18
  21. package/dist/cjs/components/product-picker-v2/utility.d.ts +1 -0
  22. package/dist/cjs/components/product-picker-v2/utility.js +1 -1
  23. package/dist/cjs/components/product-picker-v2/variant.js +1 -1
  24. package/dist/esm/components/QueryBuilder/components/QueryBuilderNodes.js +1 -1
  25. package/dist/esm/components/analytics-chips-and-dropdowns/chart/LineChart/LineChart.d.ts +2 -0
  26. package/dist/esm/components/analytics-chips-and-dropdowns/chart/LineChart/LineChart.js +1 -1
  27. package/dist/esm/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js +1 -1
  28. package/dist/esm/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.model.d.ts +2 -0
  29. package/dist/esm/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.styles.d.ts +1 -0
  30. package/dist/esm/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.styles.js +5 -1
  31. package/dist/esm/components/avatar/Avatar.d.ts +1 -3
  32. package/dist/esm/components/avatar/Avatar.js +1 -1
  33. package/dist/esm/components/bik-layout/MockMenus.d.ts +0 -1
  34. package/dist/esm/components/plans/NewSubscriptionPlan.js +1 -1
  35. package/dist/esm/components/plans/SubscriptionPlan.d.ts +1 -0
  36. package/dist/esm/components/plans/SubscriptionPlan.js +1 -1
  37. package/dist/esm/components/product-picker-v2/modal.d.ts +1 -0
  38. package/dist/esm/components/product-picker-v2/modal.js +1 -1
  39. package/dist/esm/components/product-picker-v2/product.js +1 -1
  40. package/dist/esm/components/product-picker-v2/productInfoOverlay.js +7 -7
  41. package/dist/esm/components/product-picker-v2/productScreen.js +1 -1
  42. package/dist/esm/components/product-picker-v2/style.d.ts +11 -0
  43. package/dist/esm/components/product-picker-v2/style.js +51 -16
  44. package/dist/esm/components/product-picker-v2/utility.d.ts +1 -0
  45. package/dist/esm/components/product-picker-v2/utility.js +1 -1
  46. package/dist/esm/components/product-picker-v2/variant.js +1 -1
  47. package/package.json +1 -1
  48. package/dist/cjs/assets/icons/bik_livechat.svg.js +0 -1
  49. package/dist/esm/assets/icons/bik_livechat.svg.js +0 -1
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("react-redux"),s=require("../../button/Button.js"),i=require("../../dropdown/Dropdown.js"),l=require("../constants/operators.js"),d=require("../hooks/useQueryBuilder.js"),o=require("./AddNodeButton.js"),n=require("./DeleteButton.js"),a=require("./QueryBuilderNode/QueryBuilderNode.js"),u=require("./QueryBuilderNodes.styled.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const j=c(t).default.forwardRef(((c,j)=>{let{infinite:p,addNodeBtnText:x,allowedNodes:y,typesAPIHandlers:f,onStateChange:g,mode:v,selectorKey:b}=c;var O;const m=r.useSelector((e=>null==e?void 0:e[b])),{deleteNode:w,clearAll:h,selectJoinOperator:N,fillState:q}=d.useQueryBuilder(b);t.useEffect((()=>{null==g||g(Object.assign({},m))}),[m]);const B=l.JOIN_OPERATOR_OPTIONS.map((e=>(null==m?void 0:m.operator)&&e.value===m.operator?Object.assign(Object.assign({},e),{selected:!0}):e));return t.useImperativeHandle(j,(()=>({getState:()=>Object.assign({},m),fillState(e){q(Object.assign({},e))},clearAll:h}))),e.jsxs(e.Fragment,{children:[null===(O=null==m?void 0:m.nodes)||void 0===O?void 0:O.map(((t,r)=>e.jsxs(e.Fragment,{children:[0!==r&&e.jsx("div",Object.assign({style:{width:80,position:"relative"}},{children:e.jsx(i.Dropdown,{disabled:"view"===v,onSelect:e=>{N(e.value)},options:B,width:"80px",height:96,size:"small"})})),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:12}},{children:[e.jsx(u.LinedContainer,Object.assign({style:{paddingTop:0===r?0:24,maxWidth:"calc(100% - 24px)"}},{children:e.jsx(a.default,{selectorKey:b,mode:null!=v?v:"create",allowedNodes:y,node:t,apiHandler:f[t.type]})})),"view"!==v?e.jsx(e.Fragment,{children:0!==r&&e.jsx(n.default,{onClick:()=>w(t._id)})}):e.jsx(e.Fragment,{})]}),t._id)]}))),p&&"view"!==v&&e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"space-between"}},{children:[e.jsx(o.default,{buttonText:x,allowedNodes:y,selectorKey:b}),e.jsx(s.Button,{buttonText:"Clear filters",size:"medium",buttonType:"tertiaryGray",onClick:()=>h(y[0])})]}))]})}));j.displayName="QueryBuilderNodes",exports.default=j;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("react-redux"),s=require("../../button/Button.js"),i=require("../../dropdown/Dropdown.js"),l=require("../constants/operators.js"),o=require("../hooks/useQueryBuilder.js"),d=require("./AddNodeButton.js"),n=require("./DeleteButton.js"),a=require("./QueryBuilderNode/QueryBuilderNode.js"),u=require("./QueryBuilderNodes.styled.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const j=c(t).default.forwardRef(((c,j)=>{let{infinite:p,addNodeBtnText:x,allowedNodes:y,typesAPIHandlers:f,onStateChange:g,mode:v,selectorKey:b}=c;var O;const m=r.useSelector((e=>null==e?void 0:e[b])),{deleteNode:w,clearAll:h,selectJoinOperator:N,fillState:q}=o.useQueryBuilder(b);t.useEffect((()=>{null==g||g(Object.assign({},m))}),[m]);const B=l.JOIN_OPERATOR_OPTIONS.map((e=>(null==m?void 0:m.operator)&&e.value===m.operator?Object.assign(Object.assign({},e),{selected:!0}):e));return t.useImperativeHandle(j,(()=>({getState:()=>Object.assign({},m),fillState(e){q(Object.assign({},e))},clearAll:h}))),e.jsxs(e.Fragment,{children:[null===(O=null==m?void 0:m.nodes)||void 0===O?void 0:O.map(((t,r)=>e.jsxs(e.Fragment,{children:[0!==r&&e.jsx("div",Object.assign({style:{width:80,position:"relative"}},{children:e.jsx(i.Dropdown,{disabled:"view"===v,onSelect:e=>{N(e.value)},options:B,width:"80px",height:96,size:"small",skipSorting:!0})})),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:12}},{children:[e.jsx(u.LinedContainer,Object.assign({style:{paddingTop:0===r?0:24,maxWidth:"calc(100% - 24px)"}},{children:e.jsx(a.default,{selectorKey:b,mode:null!=v?v:"create",allowedNodes:y,node:t,apiHandler:f[t.type]})})),"view"!==v?e.jsx(e.Fragment,{children:0!==r&&e.jsx(n.default,{onClick:()=>w(t._id)})}):e.jsx(e.Fragment,{})]}),t._id)]}))),p&&"view"!==v&&e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"space-between"}},{children:[e.jsx(d.default,{buttonText:x,allowedNodes:y,selectorKey:b}),e.jsx(s.Button,{buttonText:"Clear filters",size:"medium",buttonType:"tertiaryGray",onClick:()=>h(y[0])})]}))]})}));j.displayName="QueryBuilderNodes",exports.default=j;
@@ -37,5 +37,7 @@ export type LineChartProps = {
37
37
  titleTooltipCallback?: (context: any) => void;
38
38
  isInternationalStore?: boolean;
39
39
  customYHeaders?: any;
40
+ legendsAndIconDirection?: 'row-reverse' | 'row';
41
+ headerIcons?: React.ReactNode[];
40
42
  };
41
43
  export declare const LineChart: React.FC<LineChartProps>;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("chart.js"),l=require("react"),r=require("react-chartjs-2"),n=require("../../../TypographyStyle.js"),i=require("../../../../constants/Theme.js"),o=require("../utils/calcPercentage.js"),a=require("./LineChart.styled.js");t.Chart.register(t.CategoryScale,t.LinearScale,t.PointElement,t.BarElement,t.LineElement,t.ArcElement,t.Filler,t.Title,t.Tooltip,t.Legend);exports.LineChart=t=>{let{scaleText:s,labels:d,canvasHeight:c,datas:u,maintainAspectRatio:g=!1,stepSize:p,min:y,max:b,isZeroState:v,tension:C,isNewStyles:O,prefixCurrencyInYAxis:h,pointRadius:x,useKFormat:S,lineThickness:j,ticksLabelCallback:m,labelCallback:L,afterBodyCallBack:k,titleTooltipCallback:f,isInternationalStore:R,customYHeaders:q}=t;var B,w,F;const[T,E]=l.useState(null),z=l.useRef();l.useEffect((()=>{var e,t,l,r;if(null===(r=null===(l=null===(t=null===(e=z.current)||void 0===e?void 0:e.scales)||void 0===t?void 0:t.y)||void 0===l?void 0:l.ticks)||void 0===r?void 0:r.length){const e=38*z.current.scales.y.ticks.length;E(e)}}),[z]);const I=u.map((e=>({text:e.legend,color:e.lineColor?e.lineColor:e.dotted?i.COLORS.content.placeholder:i.COLORS.background.brand,square:e.squareLegends}))),$={labels:d,datasets:u.map(((e,t)=>{var l,r,n;return Object.assign(Object.assign({tension:null!=C?C:.4,fill:e.gradient?"start":0},((e,t)=>{const l={borderColor:e||(t?i.COLORS.content.placeholder:i.COLORS.background.brand)};return O?Object.assign({pointStyle:"circle",pointRadius:x||(d&&d.length>10?2.5:4),pointBorderColor:"transparent",pointBackgroundColor:e||(t?i.COLORS.content.placeholder:i.COLORS.background.brand)},l):Object.assign({pointRadius:null!=x?x:1},l)})(e.lineColor,e.dotted)),{borderDash:e.dotted?[8,3]:void 0,data:e.data,borderWidth:null!==(r=null!==(l=e.lineWidth)&&void 0!==l?l:j)&&void 0!==r?r:2,backgroundColor:e.gradient?e=>{const t=e.chart.ctx.createLinearGradient(0,0,0,T?T-75:150);return t.addColorStop(0,"#F1EEFB"),t.addColorStop(1,"rgba(127, 86, 217, 0)"),t}:null!==(n=e.backgroundColor)&&void 0!==n?n:"transparent",legend:e.legend})}))},A={maintainAspectRatio:g,responsive:!0,plugins:{legend:{display:!1},title:{display:!1},tooltip:{displayColors:null!=O&&O,titleFont:()=>({weight:"600",size:14,family:"inter"}),titleColor:()=>i.COLORS.content.primaryInverse,backgroundColor:i.COLORS.content.primary,callbacks:{labelTextColor:()=>i.COLORS.content.primaryInverse,title:f,label:L,afterBody:k},bodyFont:()=>({weight:"400",size:14,family:"inter"})}},scales:{y:{beginAtZero:!0,min:v?0:y,max:v?10:b,ticks:{color:i.COLORS.content.secondary,callback:e=>{var t,l;return S?`${null!==(t=null==s?void 0:s.yPrefix)&&void 0!==t?t:""}${R?o.truncateValueForInternationalStore(e):o.truncateValueForIndianStore(e)}${null!=h?h:""}`:q&&Object.keys(q).length>0?q[e]:`${null!==(l=null==s?void 0:s.yPrefix)&&void 0!==l?l:""}${e}${null!=h?h:""}`},font:{family:"inter",size:12,weight:"400"},stepSize:v?1:p,padding:O?24:0},title:{display:!!(null==s?void 0:s.y),text:null==s?void 0:s.y},grid:{color:i.COLORS.background.base,drawBorder:null===(B=null==s?void 0:s.yDrawBorder)||void 0===B||B}},x:{ticks:{callback:m,color:i.COLORS.content.secondary,font:{family:"inter",size:12,weight:"400"}},title:{display:!!(null==s?void 0:s.x),text:null==s?void 0:s.x},grid:{display:!1,drawBorder:null!==(w=null==s?void 0:s.xDrawBorder)&&void 0!==w&&w}}}};return e.jsxs("div",Object.assign({style:Object.assign(Object.assign({},g?{}:{height:null!==(F=null!=c?c:T)&&void 0!==F?F:204}),{display:"flex",flexDirection:"column",gap:2,width:"100%"})},{children:[e.jsx(a.LegendWrapper,{children:I.map(((t,l)=>{let{text:r,color:i,square:o}=t;return r?e.jsxs(a.LegendContainer,{children:[e.jsx(a.LegendColor,{color:i,square:o,newStyle:O}),e.jsx(n.BodyTiny,Object.assign({color:"#667085"},{children:r}))]},l):e.jsx(e.Fragment,{})}))}),e.jsx("div",Object.assign({style:{flex:1}},{children:e.jsx(r.Line,{ref:z,options:A,data:$})}))]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("chart.js"),n=require("react"),l=require("react-chartjs-2"),r=require("../../../TypographyStyle.js"),i=require("../../../../constants/Theme.js"),o=require("../utils/calcPercentage.js"),a=require("./LineChart.styled.js");t.Chart.register(t.CategoryScale,t.LinearScale,t.PointElement,t.BarElement,t.LineElement,t.ArcElement,t.Filler,t.Title,t.Tooltip,t.Legend);exports.LineChart=t=>{let{scaleText:s,labels:d,canvasHeight:c,datas:u,maintainAspectRatio:g=!1,stepSize:p,min:y,max:b,isZeroState:C,tension:v,isNewStyles:h,prefixCurrencyInYAxis:x,pointRadius:O,useKFormat:j,lineThickness:m,ticksLabelCallback:S,labelCallback:L,afterBodyCallBack:f,titleTooltipCallback:k,isInternationalStore:R,customYHeaders:w,headerIcons:q=[],legendsAndIconDirection:B="row"}=t;var F,T,I;const[E,z]=n.useState(null),A=n.useRef();n.useEffect((()=>{var e,t,n,l;if(null===(l=null===(n=null===(t=null===(e=A.current)||void 0===e?void 0:e.scales)||void 0===t?void 0:t.y)||void 0===n?void 0:n.ticks)||void 0===l?void 0:l.length){const e=38*A.current.scales.y.ticks.length;z(e)}}),[A]);const D=u.map((e=>({text:e.legend,color:e.lineColor?e.lineColor:e.dotted?i.COLORS.content.placeholder:i.COLORS.background.brand,square:e.squareLegends}))),$={labels:d,datasets:u.map(((e,t)=>{var n,l,r;return Object.assign(Object.assign({tension:null!=v?v:.4,fill:e.gradient?"start":0},((e,t)=>{const n={borderColor:e||(t?i.COLORS.content.placeholder:i.COLORS.background.brand)};return h?Object.assign({pointStyle:"circle",pointRadius:O||(d&&d.length>10?2.5:4),pointBorderColor:"transparent",pointBackgroundColor:e||(t?i.COLORS.content.placeholder:i.COLORS.background.brand)},n):Object.assign({pointRadius:null!=O?O:1},n)})(e.lineColor,e.dotted)),{borderDash:e.dotted?[8,3]:void 0,data:e.data,borderWidth:null!==(l=null!==(n=e.lineWidth)&&void 0!==n?n:m)&&void 0!==l?l:2,backgroundColor:e.gradient?e=>{const t=e.chart.ctx.createLinearGradient(0,0,0,E?E-75:150);return t.addColorStop(0,"#F1EEFB"),t.addColorStop(1,"rgba(127, 86, 217, 0)"),t}:null!==(r=e.backgroundColor)&&void 0!==r?r:"transparent",legend:e.legend})}))},P={maintainAspectRatio:g,responsive:!0,plugins:{legend:{display:!1},title:{display:!1},tooltip:{displayColors:null!=h&&h,titleFont:()=>({weight:"600",size:14,family:"inter"}),titleColor:()=>i.COLORS.content.primaryInverse,backgroundColor:i.COLORS.content.primary,callbacks:{labelTextColor:()=>i.COLORS.content.primaryInverse,title:k,label:L,afterBody:f},bodyFont:()=>({weight:"400",size:14,family:"inter"})}},scales:{y:{beginAtZero:!0,min:C?0:y,max:C?10:b,ticks:{color:i.COLORS.content.secondary,callback:e=>{var t,n;return j?`${null!==(t=null==s?void 0:s.yPrefix)&&void 0!==t?t:""}${R?o.truncateValueForInternationalStore(e):o.truncateValueForIndianStore(e)}${null!=x?x:""}`:w&&Object.keys(w).length>0?w[e]:`${null!==(n=null==s?void 0:s.yPrefix)&&void 0!==n?n:""}${e}${null!=x?x:""}`},font:{family:"inter",size:12,weight:"400"},stepSize:C?1:p,padding:h?24:0},title:{display:!!(null==s?void 0:s.y),text:null==s?void 0:s.y},grid:{color:i.COLORS.background.base,drawBorder:null===(F=null==s?void 0:s.yDrawBorder)||void 0===F||F}},x:{ticks:{callback:S,color:i.COLORS.content.secondary,font:{family:"inter",size:12,weight:"400"}},title:{display:!!(null==s?void 0:s.x),text:null==s?void 0:s.x},grid:{display:!1,drawBorder:null!==(T=null==s?void 0:s.xDrawBorder)&&void 0!==T&&T}}}};return e.jsxs("div",Object.assign({style:Object.assign(Object.assign({},g?{}:{height:null!==(I=null!=c?c:E)&&void 0!==I?I:204}),{display:"flex",flexDirection:"column",gap:2,width:"100%"})},{children:[e.jsxs("div",Object.assign({style:{display:"flex",justifyContent:"space-between",width:"100%",flexDirection:B}},{children:[e.jsx(a.LegendWrapper,{children:q.map(((t,n)=>e.jsx(a.LegendContainer,{children:t},n)))}),e.jsx(a.LegendWrapper,{children:D.map(((t,n)=>{let{text:l,color:i,square:o}=t;return l?e.jsxs(a.LegendContainer,{children:[e.jsx(a.LegendColor,{color:i,square:o,newStyle:h}),e.jsx(r.BodyTiny,Object.assign({color:"#667085"},{children:l}))]},n):e.jsx(e.Fragment,{})}))})]})),e.jsx("div",Object.assign({style:{flex:1}},{children:e.jsx(l.Line,{ref:A,options:P,data:$})}))]}))};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../assets/icons/maximize.svg.js"),i=require("chart.js"),o=require("chartjs-plugin-datalabels"),a=require("react"),l=require("react-chartjs-2"),n=require("../../../icon-button/IconButton.js"),d=require("../../../modals/styledModal.js"),r=require("../../../TypographyStyle.js"),s=require("../../../../constants/Theme.js"),c=require("../utils/calcPercentage.js"),u=require("./StackedBarChart.model.js"),v=require("./StackedBarChart.styles.js");function O(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var g=O(o);i.Chart.register(i.CategoryScale,i.LinearScale,i.BarElement,i.Tooltip,i.Legend,g.default);exports.StackedBarChart=i=>{var o,O,g,p,x,b,A,h,y,R,C,T,I,f,j,N,S,m,L,k,H,E,F,P,G,_,B,w,D,q,Z,z,M,W,V,Y,J,K,Q,U,X,$;const[ee,te]=a.useState(!1),ie=[250,1e3,800,1500,300,600],oe=0===i.yAxis.data.length,ae=void 0===i.customColourScaleBrand&&void 0===i.customColourScalePastel?i.colorSchema===u.COLOR_SCHEMA.PASTEL?["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"]:["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"]:i.colorSchema===u.COLOR_SCHEMA.PASTEL?i.customColourScalePastel:i.customColourScaleBrand,le=i.customHoverColour,ne=a.useMemo((()=>{var e,t,o;return Object.assign(Object.assign({barPercentage:(null==i?void 0:i.barPercentage)||.4,categoryPercentage:1,pointStyle:"circle",barWidth:i.barWidth,borderRadius:(null==i?void 0:i.borderRadius)||void 0},"object"==typeof(null==i?void 0:i.borderRadius)?{borderSkipped:!1}:{}),(null===(e=null==i?void 0:i.addBarGap)||void 0===e?void 0:e.flag)?{borderWidth:{top:(null===(t=null==i?void 0:i.addBarGap)||void 0===t?void 0:t.value)||2,bottom:(null===(o=null==i?void 0:i.addBarGap)||void 0===o?void 0:o.value)||2,right:0,left:0},borderColor:"transparent"}:{})}),[i.barWidth,null==i?void 0:i.borderRadius,null==i?void 0:i.barPercentage,null==i?void 0:i.addBarGap]),de={};i.yAxis.data.map((e=>{e.map((e=>{de[e.name]?de[e.name].push(e.value):de[e.name]=[e.value]}))}));const re=Object.keys(de).map(((e,t)=>Object.assign({label:e,data:de[e],backgroundColor:null==ae?void 0:ae[t],hoverBackgroundColor:void 0===le?void 0:le[t]},ne)));let se=i.xAxis.data.map((e=>"string"==typeof e?e:e.name)),ce=re;if(i.truncateBars){const e=((e,t,i)=>{if(t.length<=i)return{truncatedData:e,truncatedLabels:t,originalData:e,originalLabels:t};const o=e.map((e=>e.slice(0,i))),a=e.map((e=>e.slice(i).reduce(((e,t)=>e+t),0)));o.forEach(((e,t)=>e.push(a[t])));const l=t.slice(0,i);return l.push("Others"),{truncatedData:o,truncatedLabels:l,originalData:e,originalLabels:t}})(re.map((e=>e.data)),se,i.truncateBars);re.forEach(((t,i)=>t.data=e.truncatedData[i])),se=e.truncatedLabels,ce=e.originalData.map(((e,t)=>Object.assign(Object.assign({},re[t]),{data:e})))}const ue={plugins:{legend:{display:!oe&&!i.customLegend,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!oe,callbacks:{label:null===(o=i.tooltipConfig)||void 0===o?void 0:o.labelCallback,title:null===(O=i.tooltipConfig)||void 0===O?void 0:O.titleCallback,footer:null===(g=i.tooltipConfig)||void 0===g?void 0:g.footerCallback},footerFont:null===(x=null===(p=i.tooltipConfig)||void 0===p?void 0:p.footerStyles)||void 0===x?void 0:x.footerFont},datalabels:{display:null!==(b=i.showTotal)&&void 0!==b&&b,anchor:"end",align:"end",clamp:!0,formatter:(e,t)=>{var i;const o=t.datasetIndex,a=t.chart.data.datasets;if(o!==a.length-1)return"";const l=t.dataIndex;let n=0;for(let e=0;e<a.length;e++)n+=null!==(i=a[e].data[l])&&void 0!==i?i:0;return n?n<1e3?n:(n/1e3).toString().substring(0,4)+"k":""},color:s.COLORS.content.secondary}},layout:{padding:{right:i.showTotal&&i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?50:0,top:i.showTotal&&i.orientation!=u.GRAPH_ORIENTATION.HORIZONTAL?50:0}},responsive:!0,maintainAspectRatio:!1,legend:{display:!i.customLegend,labels:{usePointStyle:!0}},indexAxis:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(A=i.yAxis)||void 0===A?void 0:A.title:null===(h=i.xAxis)||void 0===h?void 0:h.title),text:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(y=i.yAxis)||void 0===y?void 0:y.title:null===(R=i.xAxis)||void 0===R?void 0:R.title,color:null!==(I=i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(C=i.yAxis)||void 0===C?void 0:C.titleColor:null===(T=i.xAxis)||void 0===T?void 0:T.titleColor)&&void 0!==I?I:s.COLORS.content.secondary,font:{size:s.FONTS.caption.fontSize}},grid:{display:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL&&(void 0===(null===(f=null==i?void 0:i.showGridLines)||void 0===f?void 0:f.x)||(null===(j=null==i?void 0:i.showGridLines)||void 0===j?void 0:j.x)),color:s.COLORS.background.base},ticks:{fontSize:s.FONTS.caption.fontSize,color:null!==(N=i.yAxis.labelColor)&&void 0!==N?N:s.COLORS.content.secondary,callback:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?i.isInternationalStore?c.truncateValueForInternationalStore:c.truncateValueForIndianStore:void 0},stacked:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"boolean"!=typeof(null===(S=i.yAxis)||void 0===S?void 0:S.stacked)||(null===(m=i.yAxis)||void 0===m?void 0:m.stacked):"boolean"!=typeof(null===(L=i.xAxis)||void 0===L?void 0:L.stacked)||(null===(k=i.xAxis)||void 0===k?void 0:k.stacked)},y:Object.assign(Object.assign({},(null===(H=null==i?void 0:i.equalHeight)||void 0===H?void 0:H.flag)?{suggestedMin:-(null==i?void 0:i.equalHeight.max),suggestedMax:null==i?void 0:i.equalHeight.max}:{}),{title:{display:!!(i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(E=i.xAxis)||void 0===E?void 0:E.title:null===(F=i.yAxis)||void 0===F?void 0:F.title),text:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(P=i.xAxis)||void 0===P?void 0:P.title:null===(G=i.yAxis)||void 0===G?void 0:G.title,color:null!==(w=i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(_=i.xAxis)||void 0===_?void 0:_.titleColor:null===(B=i.yAxis)||void 0===B?void 0:B.titleColor)&&void 0!==w?w:s.COLORS.content.secondary,font:{size:s.FONTS.caption.fontSize}},grid:{display:i.orientation!==u.GRAPH_ORIENTATION.HORIZONTAL&&(void 0===(null===(D=null==i?void 0:i.showGridLines)||void 0===D?void 0:D.y)||(null===(q=null==i?void 0:i.showGridLines)||void 0===q?void 0:q.y)),color:s.COLORS.background.base},ticks:Object.assign(Object.assign({stepSize:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(Z=i.xAxis)||void 0===Z?void 0:Z.stepSize:null===(z=i.yAxis)||void 0===z?void 0:z.stepSize,fontSize:s.FONTS.caption.fontSize,color:null!==(M=i.xAxis.labelColor)&&void 0!==M?M:s.COLORS.content.secondary},oe?{min:0,max:2e3,stepSize:200}:{}),{callback:(null==i?void 0:i.ticksCallback)?null==i?void 0:i.ticksCallback:i.orientation!==u.GRAPH_ORIENTATION.VERTICAL?i.isInternationalStore?c.truncateValueForInternationalStore:c.truncateValueForIndianStore:void 0}),stacked:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"boolean"!=typeof(null===(W=i.xAxis)||void 0===W?void 0:W.stacked)||(null===(V=i.xAxis)||void 0===V?void 0:V.stacked):"boolean"!=typeof(null===(Y=i.yAxis)||void 0===Y?void 0:Y.stacked)||(null===(J=i.yAxis)||void 0===J?void 0:J.stacked)})},onClick:(e,t)=>{if(!i.onBarClick)return;const o=t[0].datasetIndex,a=t[0].index,l=e.chart.data.datasets[o].label,n=e.chart.data.labels[a];i.onBarClick(n,l)},onHover:(e,t)=>{i.onBarClick&&t.length&&(e.native.target.style.cursor="pointer")}};i.orientation&&i.orientation!==u.GRAPH_ORIENTATION.VERTICAL?delete ue.scales.y.ticks.callback:delete ue.scales.x.ticks.callback;const ve={labels:se,datasets:oe?[{data:ie,backgroundColor:"rgba(0,0,0,0)"}]:re},Oe={labels:i.xAxis.data.map((e=>"string"==typeof e?e:e.name)),datasets:oe?[{data:ie,backgroundColor:"rgba(0,0,0,0)"}]:ce},ge=function(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return e.jsx("div",Object.assign({style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:i.allowChartPopup&&!t?"flex-start":"flex-end",flexWrap:"wrap"}},{children:re.map((t=>e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"}},{children:[e.jsx("div",{style:{backgroundColor:t.backgroundColor,width:"16px",height:"16px",borderRadius:"2px"}}),e.jsx(r.BodyTiny,Object.assign({color:s.COLORS.content.secondary},{children:t.label}))]}),t.label.replace(" ","_"))))}))};return e.jsxs(v.GraphContainerWrapper,Object.assign({style:null!==(K=i.wrapperStyle)&&void 0!==K?K:{},padding:i.outerPadding,customLegend:i.customLegend},{children:[i.chartHeading&&e.jsxs("div",Object.assign({style:{marginBottom:24,display:"flex",justifyContent:i.hideHeading?"flex-end":"space-between"}},{children:[!0!==i.hideHeading&&e.jsx(r.TitleRegular,Object.assign({color:null!==(Q=i.chartHeading.color)&&void 0!==Q?Q:s.COLORS.content.secondary},{children:i.chartHeading.heading})),i.allowChartPopup&&e.jsx("div",Object.assign({style:{display:"flex",justifyContent:"flex-end"}},{children:e.jsx("div",{children:e.jsx(n.IconButton,{Icon:t.default,onClick:()=>{te(!0)}})})}))]})),i.customLegend&&ge(),e.jsx("div",Object.assign({className:"graph__wrapper"},{children:e.jsx("div",Object.assign({style:{height:null!==(U=i.graphCanvasHeight)&&void 0!==U?U:500,width:null!==(X=i.graphCanvasWidth)&&void 0!==X?X:"auto"}},{children:e.jsx(l.Bar,{options:ue,data:ve})}))})),ee&&e.jsx(d.StyledModal,Object.assign({open:ee,onClose:()=>te(!1),closeOnOutsideClick:!0,headingTitle:null===($=i.chartHeading)||void 0===$?void 0:$.heading,width:"85%"},{children:e.jsxs("div",Object.assign({className:"graph__wrapper",style:{padding:"8px"}},{children:[i.customLegend&&ge(!0),e.jsx("div",Object.assign({style:{height:"70vh",width:"100%",padding:"16px",borderRadius:"8px"}},{children:e.jsx(l.Bar,{options:ue,data:Oe})}))]}))}))]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../assets/icons/maximize.svg.js"),i=require("chart.js"),o=require("chartjs-plugin-datalabels"),a=require("react"),l=require("react-chartjs-2"),n=require("../../../icon-button/IconButton.js"),d=require("../../../modals/styledModal.js"),r=require("../../../TypographyStyle.js"),s=require("../../../../constants/Theme.js"),c=require("../utils/calcPercentage.js"),u=require("./StackedBarChart.model.js"),v=require("./StackedBarChart.styles.js");function g(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=g(o);i.Chart.register(i.CategoryScale,i.LinearScale,i.BarElement,i.Tooltip,i.Legend,p.default);exports.StackedBarChart=i=>{var o,g,p,O,x,b,h,A,y,C,R,I,T,j,f,N,S,m,H,L,k,E,F,P,G,_,B,w,D,q,Z,z,M,W,V,Y,J,K,Q,U,X,$;const{headerIcons:ee=[],legendsAndIconDirection:te="row"}=i,[ie,oe]=a.useState(!1),ae=[250,1e3,800,1500,300,600],le=0===i.yAxis.data.length,ne=void 0===i.customColourScaleBrand&&void 0===i.customColourScalePastel?i.colorSchema===u.COLOR_SCHEMA.PASTEL?["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"]:["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"]:i.colorSchema===u.COLOR_SCHEMA.PASTEL?i.customColourScalePastel:i.customColourScaleBrand,de=i.customHoverColour,re=a.useMemo((()=>{var e,t,o;return Object.assign(Object.assign({barPercentage:(null==i?void 0:i.barPercentage)||.4,categoryPercentage:1,pointStyle:"circle",barWidth:i.barWidth,borderRadius:(null==i?void 0:i.borderRadius)||void 0},"object"==typeof(null==i?void 0:i.borderRadius)?{borderSkipped:!1}:{}),(null===(e=null==i?void 0:i.addBarGap)||void 0===e?void 0:e.flag)?{borderWidth:{top:(null===(t=null==i?void 0:i.addBarGap)||void 0===t?void 0:t.value)||2,bottom:(null===(o=null==i?void 0:i.addBarGap)||void 0===o?void 0:o.value)||2,right:0,left:0},borderColor:"transparent"}:{})}),[i.barWidth,null==i?void 0:i.borderRadius,null==i?void 0:i.barPercentage,null==i?void 0:i.addBarGap]),se={};i.yAxis.data.map((e=>{e.map((e=>{se[e.name]?se[e.name].push(e.value):se[e.name]=[e.value]}))}));const ce=Object.keys(se).map(((e,t)=>Object.assign({label:e,data:se[e],backgroundColor:null==ne?void 0:ne[t],hoverBackgroundColor:void 0===de?void 0:de[t]},re)));let ue=i.xAxis.data.map((e=>"string"==typeof e?e:e.name)),ve=ce;if(i.truncateBars){const e=((e,t,i)=>{if(t.length<=i)return{truncatedData:e,truncatedLabels:t,originalData:e,originalLabels:t};const o=e.map((e=>e.slice(0,i))),a=e.map((e=>e.slice(i).reduce(((e,t)=>e+t),0)));o.forEach(((e,t)=>e.push(a[t])));const l=t.slice(0,i);return l.push("Others"),{truncatedData:o,truncatedLabels:l,originalData:e,originalLabels:t}})(ce.map((e=>e.data)),ue,i.truncateBars);ce.forEach(((t,i)=>t.data=e.truncatedData[i])),ue=e.truncatedLabels,ve=e.originalData.map(((e,t)=>Object.assign(Object.assign({},ce[t]),{data:e})))}const ge={plugins:{legend:{display:!le&&!i.customLegend,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!le,callbacks:{label:null===(o=i.tooltipConfig)||void 0===o?void 0:o.labelCallback,title:null===(g=i.tooltipConfig)||void 0===g?void 0:g.titleCallback,footer:null===(p=i.tooltipConfig)||void 0===p?void 0:p.footerCallback},footerFont:null===(x=null===(O=i.tooltipConfig)||void 0===O?void 0:O.footerStyles)||void 0===x?void 0:x.footerFont},datalabels:{display:null!==(b=i.showTotal)&&void 0!==b&&b,anchor:"end",align:"end",clamp:!0,formatter:(e,t)=>{var i;const o=t.datasetIndex,a=t.chart.data.datasets;if(o!==a.length-1)return"";const l=t.dataIndex;let n=0;for(let e=0;e<a.length;e++)n+=null!==(i=a[e].data[l])&&void 0!==i?i:0;return n?n<1e3?n:(n/1e3).toString().substring(0,4)+"k":""},color:s.COLORS.content.secondary}},layout:{padding:{right:i.showTotal&&i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?50:0,top:i.showTotal&&i.orientation!=u.GRAPH_ORIENTATION.HORIZONTAL?50:0}},responsive:!0,maintainAspectRatio:!1,legend:{display:!i.customLegend,labels:{usePointStyle:!0}},indexAxis:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(h=i.yAxis)||void 0===h?void 0:h.title:null===(A=i.xAxis)||void 0===A?void 0:A.title),text:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(y=i.yAxis)||void 0===y?void 0:y.title:null===(C=i.xAxis)||void 0===C?void 0:C.title,color:null!==(T=i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(R=i.yAxis)||void 0===R?void 0:R.titleColor:null===(I=i.xAxis)||void 0===I?void 0:I.titleColor)&&void 0!==T?T:s.COLORS.content.secondary,font:{size:s.FONTS.caption.fontSize}},grid:{display:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL&&(void 0===(null===(j=null==i?void 0:i.showGridLines)||void 0===j?void 0:j.x)||(null===(f=null==i?void 0:i.showGridLines)||void 0===f?void 0:f.x)),color:s.COLORS.background.base},ticks:{fontSize:s.FONTS.caption.fontSize,color:null!==(N=i.yAxis.labelColor)&&void 0!==N?N:s.COLORS.content.secondary,callback:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?i.isInternationalStore?c.truncateValueForInternationalStore:c.truncateValueForIndianStore:void 0},stacked:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"boolean"!=typeof(null===(S=i.yAxis)||void 0===S?void 0:S.stacked)||(null===(m=i.yAxis)||void 0===m?void 0:m.stacked):"boolean"!=typeof(null===(H=i.xAxis)||void 0===H?void 0:H.stacked)||(null===(L=i.xAxis)||void 0===L?void 0:L.stacked)},y:Object.assign(Object.assign({},(null===(k=null==i?void 0:i.equalHeight)||void 0===k?void 0:k.flag)?{suggestedMin:-(null==i?void 0:i.equalHeight.max),suggestedMax:null==i?void 0:i.equalHeight.max}:{}),{title:{display:!!(i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(E=i.xAxis)||void 0===E?void 0:E.title:null===(F=i.yAxis)||void 0===F?void 0:F.title),text:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(P=i.xAxis)||void 0===P?void 0:P.title:null===(G=i.yAxis)||void 0===G?void 0:G.title,color:null!==(w=i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(_=i.xAxis)||void 0===_?void 0:_.titleColor:null===(B=i.yAxis)||void 0===B?void 0:B.titleColor)&&void 0!==w?w:s.COLORS.content.secondary,font:{size:s.FONTS.caption.fontSize}},grid:{display:i.orientation!==u.GRAPH_ORIENTATION.HORIZONTAL&&(void 0===(null===(D=null==i?void 0:i.showGridLines)||void 0===D?void 0:D.y)||(null===(q=null==i?void 0:i.showGridLines)||void 0===q?void 0:q.y)),color:s.COLORS.background.base},ticks:Object.assign(Object.assign({stepSize:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(Z=i.xAxis)||void 0===Z?void 0:Z.stepSize:null===(z=i.yAxis)||void 0===z?void 0:z.stepSize,fontSize:s.FONTS.caption.fontSize,color:null!==(M=i.xAxis.labelColor)&&void 0!==M?M:s.COLORS.content.secondary},le?{min:0,max:2e3,stepSize:200}:{}),{callback:(null==i?void 0:i.ticksCallback)?null==i?void 0:i.ticksCallback:i.orientation!==u.GRAPH_ORIENTATION.VERTICAL?i.isInternationalStore?c.truncateValueForInternationalStore:c.truncateValueForIndianStore:void 0}),stacked:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"boolean"!=typeof(null===(W=i.xAxis)||void 0===W?void 0:W.stacked)||(null===(V=i.xAxis)||void 0===V?void 0:V.stacked):"boolean"!=typeof(null===(Y=i.yAxis)||void 0===Y?void 0:Y.stacked)||(null===(J=i.yAxis)||void 0===J?void 0:J.stacked)})},onClick:(e,t)=>{if(!i.onBarClick)return;const o=t[0].datasetIndex,a=t[0].index,l=e.chart.data.datasets[o].label,n=e.chart.data.labels[a];i.onBarClick(n,l)},onHover:(e,t)=>{i.onBarClick&&t.length&&(e.native.target.style.cursor="pointer")}};i.orientation&&i.orientation!==u.GRAPH_ORIENTATION.VERTICAL?delete ge.scales.y.ticks.callback:delete ge.scales.x.ticks.callback;const pe={labels:ue,datasets:le?[{data:ae,backgroundColor:"rgba(0,0,0,0)"}]:ce},Oe={labels:i.xAxis.data.map((e=>"string"==typeof e?e:e.name)),datasets:le?[{data:ae,backgroundColor:"rgba(0,0,0,0)"}]:ve},xe=function(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return e.jsx("div",Object.assign({style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:i.allowChartPopup&&!t?"flex-start":"flex-end",flexWrap:"wrap"}},{children:ce.map((t=>e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"}},{children:[e.jsx("div",{style:{backgroundColor:t.backgroundColor,width:"16px",height:"16px",borderRadius:"2px"}}),e.jsx(r.BodyTiny,Object.assign({color:s.COLORS.content.secondary},{children:t.label}))]}),t.label.replace(" ","_"))))}))};return e.jsxs(v.GraphContainerWrapper,Object.assign({style:null!==(K=i.wrapperStyle)&&void 0!==K?K:{},padding:i.outerPadding,customLegend:i.customLegend},{children:[i.chartHeading&&e.jsxs("div",Object.assign({style:{marginBottom:24,display:"flex",justifyContent:i.hideHeading?"flex-end":"space-between"}},{children:[!0!==i.hideHeading&&e.jsx(r.TitleRegular,Object.assign({color:null!==(Q=i.chartHeading.color)&&void 0!==Q?Q:s.COLORS.content.secondary},{children:i.chartHeading.heading})),i.allowChartPopup&&e.jsx("div",Object.assign({style:{display:"flex",justifyContent:"flex-end"}},{children:e.jsx("div",{children:e.jsx(n.IconButton,{Icon:t.default,onClick:()=>{oe(!0)}})})}))]})),i.customLegend&&e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:te,justifyContent:"space-between"}},{children:[e.jsx(v.HeaderIconWrapper,{children:ee.map(((t,i)=>e.jsx("div",{children:e.jsx("div",{children:t})},i)))}),xe()]})),e.jsx("div",Object.assign({className:"graph__wrapper"},{children:e.jsx("div",Object.assign({style:{height:null!==(U=i.graphCanvasHeight)&&void 0!==U?U:500,width:null!==(X=i.graphCanvasWidth)&&void 0!==X?X:"auto"}},{children:e.jsx(l.Bar,{options:ge,data:pe})}))})),ie&&e.jsx(d.StyledModal,Object.assign({open:ie,onClose:()=>oe(!1),closeOnOutsideClick:!0,headingTitle:null===($=i.chartHeading)||void 0===$?void 0:$.heading,width:"85%"},{children:e.jsxs("div",Object.assign({className:"graph__wrapper",style:{padding:"8px"}},{children:[i.customLegend&&xe(!0),e.jsx("div",Object.assign({style:{height:"70vh",width:"100%",padding:"16px",borderRadius:"8px"}},{children:e.jsx(l.Bar,{options:ge,data:Oe})}))]}))}))]}))};
@@ -82,4 +82,6 @@ export interface StackedBarGraphI {
82
82
  value: number;
83
83
  };
84
84
  ticksCallback?: (value: number) => string;
85
+ legendsAndIconDirection?: 'row-reverse' | 'row';
86
+ headerIcons?: React.ReactNode[];
85
87
  }
@@ -4,3 +4,4 @@ export declare const GraphContainerWrapper: import("styled-components").StyledCo
4
4
  isFunnel?: boolean | undefined;
5
5
  customLegend?: boolean | undefined;
6
6
  }, never>;
7
+ export declare const HeaderIconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -1,4 +1,4 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),r=require("../../../../constants/Theme.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const n=t(e).default.div`
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),r=require("../../../../constants/Theme.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=t(e);const n=a.default.div`
2
2
  background-color: ${r.COLORS.surface.standard};
3
3
  padding: ${e=>{var r;return null!==(r=e.padding)&&void 0!==r?r:"24px"}};
4
4
  border: none;
@@ -28,4 +28,8 @@
28
28
  .legend__set {
29
29
  margin-top: 16px;
30
30
  }
31
- `;exports.GraphContainerWrapper=n;
31
+ `,p=a.default.div`
32
+ display: flex;
33
+ align-items: center;
34
+ gap: 8px;
35
+ `;exports.GraphContainerWrapper=n,exports.HeaderIconWrapper=p;
@@ -28,7 +28,6 @@ export type AvatarProps = {
28
28
  isSelected: boolean;
29
29
  isComments: boolean;
30
30
  };
31
- status?: 'ONLINE' | 'OFFLINE' | 'AWAY';
32
31
  };
33
32
  export declare const enum MESSAGE_CHANNELS {
34
33
  INSTAGRAM = "instagram",
@@ -42,7 +41,6 @@ export declare const enum MESSAGE_CHANNELS {
42
41
  EMAIL = "email",
43
42
  SMTP = "smtp",
44
43
  FACEBOOK_CATALOG = "facebook-catalog",
45
- TASKS = "tasks",
46
- BIK_LIVECHAT = "livechat"
44
+ TASKS = "tasks"
47
45
  }
48
46
  export declare const Avatar: React.FC<AvatarProps>;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("react"),t=require("./Avatar.styled.js"),i=require("./AvatarHelper.js"),r=require("../TypographyStyle.js"),a=require("../../constants/Theme.js"),o=require("../../assets/icons/bik_livechat.svg.js"),n=require("../../assets/icons/CheckSquareOffset.svg.js"),A=require("../../assets/icons/email-channel.svg.js"),S=require("../../assets/icons/facebook_channel.svg.js"),c=require("../../assets/icons/gmail.svg.js"),l=require("../../assets/icons/instagram-channel.svg.js"),E=require("../../assets/icons/whatsapp_color.svg.js");const d={[i.SIZE.SMALL]:16,[i.SIZE.MEDIUM]:20,[i.SIZE.INBOX]:24,[i.SIZE.LARGE]:32},u={[i.AVATAR_BACKGROUND.LIGHT]:a.COLORS.content.secondary,[i.AVATAR_BACKGROUND.DARK]:a.COLORS.surface.standard};var h;exports.MESSAGE_CHANNELS=void 0,(h=exports.MESSAGE_CHANNELS||(exports.MESSAGE_CHANNELS={})).INSTAGRAM="instagram",h.MESSENGER="messenger",h.WHATSAPP="whatsapp",h.GMAIL="gmail",h.LIVECHAT="livechat",h.GOOGLE_BUSINESS_CHAT="gbm",h.SHOPIFY="shopify",h.FACEBOOK="facebook",h.EMAIL="email",h.SMTP="smtp",h.FACEBOOK_CATALOG="facebook-catalog",h.TASKS="tasks",h.BIK_LIVECHAT="livechat";exports.AVATAR_SIZE_VS_ICON_SIZE_MAP=d,exports.Avatar=h=>{const[p,g]=s.useState(!1),x=()=>{const s=(h.name||"").split(".").join(" ").split(" ").map((e=>e.charAt(0).toUpperCase())).slice(0,2).join("");return h.size===i.SIZE.SMALL?e.jsx(r.BodyTiny,Object.assign({style:{color:u[h.background]}},{children:s})):h.size===i.SIZE.MEDIUM||h.size===i.SIZE.INBOX?e.jsx(r.TitleSmall,Object.assign({style:{color:u[h.background]}},{children:s})):h.size===i.SIZE.LARGE?e.jsx(r.TitleMedium,Object.assign({style:{color:u[h.background]}},{children:s})):void 0};return e.jsxs("div",Object.assign({style:{position:"relative"}},{children:[e.jsxs(t.AvatarStyle,Object.assign({type:h.type===i.AVATAR_TYPES.IMAGE&&p&&h.useNameFallback&&h.name?i.AVATAR_TYPES.INITIALS:h.type,size:h.size,background:h.background},{children:[h.type===i.AVATAR_TYPES.IMAGE&&(h.useNameFallback&&!p?e.jsx("img",{alt:"",width:i.AVATAR_SIZE_MAP[h.size],height:i.AVATAR_SIZE_MAP[h.size],style:{borderRadius:(null==h?void 0:h.borderRadius)||"50%",objectFit:"contain"},src:h.photoUrl,onError:()=>{g(!0)}}):h.useNameFallback&&p&&h.name?e.jsx("div",{children:x()}):e.jsx("img",{alt:"",width:i.AVATAR_SIZE_MAP[h.size],height:i.AVATAR_SIZE_MAP[h.size],style:{borderRadius:(null==h?void 0:h.borderRadius)||"50%",objectFit:"contain"},src:h.photoUrl})),h.type===i.AVATAR_TYPES.INITIALS&&e.jsx("div",{children:x()}),h.type===i.AVATAR_TYPES.ICON&&h.icon&&e.jsx(h.icon,{width:d[h.size],height:d[h.size],color:u[h.background]})]})),h.inboxSettings&&e.jsx("div",Object.assign({style:{position:"absolute",left:d[h.size]+"px",top:d[h.size]+"px",width:14,height:14,borderRadius:(null==h?void 0:h.borderRadius)||"50%",display:"flex",justifyContent:"center",backgroundColor:h.inboxSettings.isSelected?h.inboxSettings.isComments?a.COLORS.content.primary:a.COLORS.background.brandLight:h.inboxSettings.isComments?a.COLORS.content.primary:a.COLORS.surface.standard,alignItems:"center"}},{children:(()=>{switch(h.channelName){case exports.MESSAGE_CHANNELS.EMAIL:case exports.MESSAGE_CHANNELS.SMTP:return e.jsx(A.default,{width:11,height:11});case exports.MESSAGE_CHANNELS.FACEBOOK:case exports.MESSAGE_CHANNELS.FACEBOOK_CATALOG:case exports.MESSAGE_CHANNELS.MESSENGER:return e.jsx(S.default,{width:11,height:11});case exports.MESSAGE_CHANNELS.INSTAGRAM:return e.jsx(l.default,{width:11,height:11});case exports.MESSAGE_CHANNELS.WHATSAPP:return e.jsx(E.default,{width:11,height:11});case exports.MESSAGE_CHANNELS.GMAIL:return e.jsx(c.default,{width:11,height:11});case exports.MESSAGE_CHANNELS.TASKS:return e.jsx(n.default,{width:11,height:11});case exports.MESSAGE_CHANNELS.BIK_LIVECHAT:return e.jsx(o.default,{width:11,height:11})}})()})),h.status&&e.jsx("div",Object.assign({style:{position:"absolute",left:d[h.size]+"px",top:d[h.size]+"px",width:11,height:11,borderRadius:"50%",display:"flex",justifyContent:"center",backgroundColor:a.COLORS.surface.standard,alignItems:"center"}},{children:(console.log("props.status",h.status),h.status?e.jsx("div",{style:{backgroundColor:"ONLINE"===h.status?a.COLORS.special.whatsapp.brand:a.COLORS.content.inactive,width:"8px",height:"8px",borderRadius:"50%"}}):null)}))]}))},exports.BACKGROUND_VS_TEXT_COLOR_MAP=u;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("react"),t=require("./Avatar.styled.js"),i=require("./AvatarHelper.js"),r=require("../TypographyStyle.js"),a=require("../../constants/Theme.js"),A=require("../../assets/icons/CheckSquareOffset.svg.js"),o=require("../../assets/icons/email-channel.svg.js"),n=require("../../assets/icons/facebook_channel.svg.js"),S=require("../../assets/icons/gmail.svg.js"),c=require("../../assets/icons/instagram-channel.svg.js"),E=require("../../assets/icons/whatsapp_color.svg.js");const l={[i.SIZE.SMALL]:16,[i.SIZE.MEDIUM]:20,[i.SIZE.INBOX]:24,[i.SIZE.LARGE]:32},d={[i.AVATAR_BACKGROUND.LIGHT]:a.COLORS.content.secondary,[i.AVATAR_BACKGROUND.DARK]:a.COLORS.surface.standard};var u;exports.MESSAGE_CHANNELS=void 0,(u=exports.MESSAGE_CHANNELS||(exports.MESSAGE_CHANNELS={})).INSTAGRAM="instagram",u.MESSENGER="messenger",u.WHATSAPP="whatsapp",u.GMAIL="gmail",u.LIVECHAT="livechat",u.GOOGLE_BUSINESS_CHAT="gbm",u.SHOPIFY="shopify",u.FACEBOOK="facebook",u.EMAIL="email",u.SMTP="smtp",u.FACEBOOK_CATALOG="facebook-catalog",u.TASKS="tasks";exports.AVATAR_SIZE_VS_ICON_SIZE_MAP=l,exports.Avatar=u=>{const[h,p]=s.useState(!1),g=()=>{const s=(u.name||"").split(".").join(" ").split(" ").map((e=>e.charAt(0).toUpperCase())).slice(0,2).join("");return u.size===i.SIZE.SMALL?e.jsx(r.BodyTiny,Object.assign({style:{color:d[u.background]}},{children:s})):u.size===i.SIZE.MEDIUM||u.size===i.SIZE.INBOX?e.jsx(r.TitleSmall,Object.assign({style:{color:d[u.background]}},{children:s})):u.size===i.SIZE.LARGE?e.jsx(r.TitleMedium,Object.assign({style:{color:d[u.background]}},{children:s})):void 0};return e.jsxs("div",Object.assign({style:{position:"relative"}},{children:[e.jsxs(t.AvatarStyle,Object.assign({type:u.type===i.AVATAR_TYPES.IMAGE&&h&&u.useNameFallback&&u.name?i.AVATAR_TYPES.INITIALS:u.type,size:u.size,background:u.background},{children:[u.type===i.AVATAR_TYPES.IMAGE&&(u.useNameFallback&&!h?e.jsx("img",{alt:"",width:i.AVATAR_SIZE_MAP[u.size],height:i.AVATAR_SIZE_MAP[u.size],style:{borderRadius:(null==u?void 0:u.borderRadius)||"50%",objectFit:"contain"},src:u.photoUrl,onError:()=>{p(!0)}}):u.useNameFallback&&h&&u.name?e.jsx("div",{children:g()}):e.jsx("img",{alt:"",width:i.AVATAR_SIZE_MAP[u.size],height:i.AVATAR_SIZE_MAP[u.size],style:{borderRadius:(null==u?void 0:u.borderRadius)||"50%",objectFit:"contain"},src:u.photoUrl})),u.type===i.AVATAR_TYPES.INITIALS&&e.jsx("div",{children:g()}),u.type===i.AVATAR_TYPES.ICON&&u.icon&&e.jsx(u.icon,{width:l[u.size],height:l[u.size],color:d[u.background]})]})),u.inboxSettings&&e.jsx("div",Object.assign({style:{position:"absolute",left:"20px",top:"20px",width:14,height:14,borderRadius:(null==u?void 0:u.borderRadius)||"50%",display:"flex",justifyContent:"center",backgroundColor:u.inboxSettings.isSelected?u.inboxSettings.isComments?a.COLORS.content.primary:a.COLORS.background.brandLight:u.inboxSettings.isComments?a.COLORS.content.primary:a.COLORS.surface.standard,alignItems:"center"}},{children:(()=>{switch(u.channelName){case exports.MESSAGE_CHANNELS.EMAIL:case exports.MESSAGE_CHANNELS.SMTP:return e.jsx(o.default,{width:11,height:11});case exports.MESSAGE_CHANNELS.FACEBOOK:case exports.MESSAGE_CHANNELS.FACEBOOK_CATALOG:case exports.MESSAGE_CHANNELS.MESSENGER:return e.jsx(n.default,{width:11,height:11});case exports.MESSAGE_CHANNELS.INSTAGRAM:return e.jsx(c.default,{width:11,height:11});case exports.MESSAGE_CHANNELS.WHATSAPP:return e.jsx(E.default,{width:11,height:11});case exports.MESSAGE_CHANNELS.GMAIL:return e.jsx(S.default,{width:11,height:11});case exports.MESSAGE_CHANNELS.TASKS:return e.jsx(A.default,{width:11,height:11})}})()}))]}))},exports.BACKGROUND_VS_TEXT_COLOR_MAP=d;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  export declare const Menus: ({
3
2
  displayName: string;
4
3
  key: number;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/check.svg.js"),t=require("../../assets/icons/checkCircle.svg.js"),i=require("../../assets/icons/quotes.svg.js"),a=require("../../assets/icons/WhiteStarFilled.svg.js"),n=require("../button/Button.js"),o=require("./SubscriptionPlanStyled.js"),r=require("../TypographyStyle.js"),l=require("../../hooks/useCurreny.js"),c=require("../../constants/Theme.js"),d=require("../tag/Tag.js"),h=require("../tooltips/Tooltip.js");exports.NewSubscriptionPlan=u=>{var p;const{formatCurrency:j}=l.useCurrency(),g=u.showMonthlyOptions?u.features:u.annualFeatures||[],m=u.showMonthlyOptions?u.monthlyPlan:u.yearlyPlan,x=!u.isDisabled&&u.isMostPopular,b=u.showMonthlyOptions?u.code:null!==(p=u.yearlyCode)&&void 0!==p?p:u.code,{planName:y,isSelected:O=!1,isDisabled:C=!1,onPlanSelect:v,oldPrice:T,hideMonthYearTag:S,planDescription:N,planDescriptionDiscount:f,showTrialOptions:L,freeTrialMessages:P,extraBlockMessage:w,isLoading:M,buttonText:k,bottomDescription:q,showMonthlyOptions:B,popularTestimony:R,skipRadioSelection:D=!1,includeText:F,height:$,showFeaturesButton:_,businessDescription:z,isPlanSelected:H=!1,onClickShowAllFeatures:W,showSelectedPlanChip:I=!1,perMonthForYearly:U=!1,minHeightOfFeatures:Y,hoverTooltip:A}=u,E=e=>U&&!B?0==e?"$0":j(Math.round(e/12),"USD"):0==e?"$0":j(e,"USD");return e.jsx(h.Tooltip,Object.assign({body:A},{children:e.jsxs(o.NewSubscriptionStyled,Object.assign({height:$,showMostPopularChip:x||!1,onClick:()=>v(b)},{children:[x&&e.jsxs("div",Object.assign({className:"most-popular-chip"},{children:[e.jsx(r.Caption,Object.assign({className:"popular-text"},{children:"Most popular "})),e.jsx(a.default,{height:12,width:12})]})),e.jsxs("div",Object.assign({className:`box ${C?"disabled":""} \n\t\t\t\t`},{children:[e.jsxs("div",Object.assign({className:"radio-flex"},{children:[!D&&e.jsx("input",{type:"radio",id:"html",name:"fav_language",value:"HTML",disabled:null!=C&&C,onChange:()=>v(b),className:"radio-button",checked:H}),e.jsx(r.TitleRegular,Object.assign({style:{color:c.COLORS.content.secondary,marginBottom:4}},{children:y})),I&&e.jsx("div",Object.assign({style:{marginLeft:"auto"}},{children:e.jsx(d.Tag,{tagText:"Current plan",type:"positive",theme:"dark"})}))]})),e.jsxs("div",Object.assign({className:"price-block"},{children:[T?e.jsx(r.BodyCaption,Object.assign({className:"old--price"},{children:E(m.price)})):e.jsx(e.Fragment,{}),e.jsx(r.TitleLarge,Object.assign({style:{color:c.COLORS.content.primary}},{children:E(T||m.price)})),e.jsx(r.Caption,Object.assign({style:{color:c.COLORS.content.secondary,marginLeft:4}},{children:S?"":"/ "+(B?"month":U?"month billed annually":"year")}))]})),N&&e.jsxs("div",Object.assign({className:"per-message-price"},{children:[e.jsx(r.BodyCaption,Object.assign({style:{color:c.COLORS.content.secondary}},{children:N})),f&&e.jsx(r.BodyCaption,Object.assign({style:{color:c.COLORS.background.positive.vibrant,marginLeft:4}},{children:f}))]})),z&&z.length&&e.jsx("div",Object.assign({style:{marginTop:4}},{children:z.map(((s,t)=>e.jsx(r.BodyCaption,{style:{color:c.COLORS.content.secondary},dangerouslySetInnerHTML:{__html:s}},t)))})),L&&e.jsxs(r.Caption,Object.assign({className:"trial "+(O?"selected":"")},{children:["7 day free trial with ",P," messages"]})),w&&e.jsx(r.Caption,Object.assign({className:"trial "+(O?"selected":"")},{children:w})),e.jsx(r.TitleSmall,Object.assign({className:"extra-include-margin",style:{height:F?"":"20px"}},{children:F||""})),e.jsx("div",Object.assign({className:"features",style:{minHeight:Y}},{children:g.map(((s,i)=>e.jsxs("div",Object.assign({className:"feature"},{children:[e.jsx("div",{children:e.jsx(t.default,{height:20,width:20,color:c.COLORS.content.primary})}),e.jsx(r.BodyCaption,Object.assign({className:"feature-text"},{children:s.detail}),i)]}),s.detail)))})),_&&e.jsx(n.Button,{isLoading:!1,buttonType:"tertiary",buttonText:"See all features",size:"small",onClick:e=>{e.stopPropagation(),W&&W()}}),D&&e.jsx("div",Object.assign({className:"button-box"},{children:M?e.jsx(n.Button,{isLoading:!0,buttonType:"primary",buttonText:"Choose plan",size:"medium",matchParentWidth:!0}):e.jsxs(e.Fragment,{children:[O&&e.jsx(n.Button,{disabled:C,LeadingIcon:s.default,buttonType:"tertiary",size:"medium",matchParentWidth:!0,buttonText:k||"Selected Plan"}),!O&&!C&&e.jsx(n.Button,{buttonType:"primary",size:"medium",onClick:e=>{e.stopPropagation(),v(b)},matchParentWidth:!0,buttonText:k||"Choose plan"})]})})),R&&e.jsxs("div",Object.assign({className:"popular-testimony"},{children:[e.jsx(i.default,{height:26,width:70}),e.jsx("div",Object.assign({className:"testimony-text"},{children:e.jsx("i",{children:R})}))]}))]})),q&&e.jsx("div",Object.assign({className:`plan-bottom-information\n\t\t\t\t\t${C?"disabled":""}\n\t\t\t\t\t${O?"selected":""}\n\t\t\t\t`},{children:e.jsx(r.Caption,Object.assign({className:"text",style:{color:c.COLORS.background.inverse}},{children:q}))}))]}))}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/check.svg.js"),t=require("../../assets/icons/checkCircle.svg.js"),i=require("../../assets/icons/quotes.svg.js"),a=require("../../assets/icons/WhiteStarFilled.svg.js"),n=require("../button/Button.js"),o=require("./SubscriptionPlanStyled.js"),r=require("../TypographyStyle.js"),l=require("../../hooks/useCurreny.js"),c=require("../../constants/Theme.js"),d=require("../tag/Tag.js"),h=require("../tooltips/Tooltip.js");exports.NewSubscriptionPlan=u=>{var j;const{formatCurrency:p}=l.useCurrency(),g=u.showMonthlyOptions?u.features:u.annualFeatures||[],m=u.showMonthlyOptions?u.monthlyPlan:u.yearlyPlan,x=!u.isDisabled&&u.isMostPopular,b=u.showMonthlyOptions?u.code:null!==(j=u.yearlyCode)&&void 0!==j?j:u.code,{planName:y,isSelected:O=!1,isDisabled:C=!1,onPlanSelect:v,oldPrice:T,hideMonthYearTag:S,planDescription:N,planDescriptionDiscount:f,showTrialOptions:L,freeTrialMessages:P,extraBlockMessage:k,isLoading:w,buttonText:M,bottomDescription:B,showMonthlyOptions:q,popularTestimony:R,skipRadioSelection:D=!1,includeText:F,height:$,showFeaturesButton:_,businessDescription:z,isPlanSelected:H=!1,onClickShowAllFeatures:W,showSelectedPlanChip:I=!1,perMonthForYearly:U=!1,minHeightOfFeatures:Y,hoverTooltip:A,hidePriceBlock:E=!1}=u,G=e=>U&&!q?0==e?"$0":p(Math.round(e/12),"USD"):0==e?"$0":p(e,"USD");return e.jsx(h.Tooltip,Object.assign({body:A},{children:e.jsxs(o.NewSubscriptionStyled,Object.assign({height:$,showMostPopularChip:x||!1,onClick:()=>v(b)},{children:[x&&e.jsxs("div",Object.assign({className:"most-popular-chip"},{children:[e.jsx(r.Caption,Object.assign({className:"popular-text"},{children:"Most popular "})),e.jsx(a.default,{height:12,width:12})]})),e.jsxs("div",Object.assign({className:`box ${C?"disabled":""} \n\t\t\t\t`},{children:[e.jsxs("div",Object.assign({className:"radio-flex"},{children:[!D&&e.jsx("input",{type:"radio",id:"html",name:"fav_language",value:"HTML",disabled:null!=C&&C,onChange:()=>v(b),className:"radio-button",checked:H}),e.jsx(r.TitleRegular,Object.assign({style:{color:c.COLORS.content.secondary,marginBottom:4}},{children:y})),I&&e.jsx("div",Object.assign({style:{marginLeft:"auto"}},{children:e.jsx(d.Tag,{tagText:"Current plan",type:"positive",theme:"dark"})}))]})),E?e.jsx(e.Fragment,{}):e.jsxs("div",Object.assign({className:"price-block"},{children:[T?e.jsx(r.BodyCaption,Object.assign({className:"old--price"},{children:G(m.price)})):e.jsx(e.Fragment,{}),e.jsx(r.TitleLarge,Object.assign({style:{color:c.COLORS.content.primary}},{children:G(T||m.price)})),e.jsx(r.Caption,Object.assign({style:{color:c.COLORS.content.secondary,marginLeft:4}},{children:S?"":"/ "+(q?"month":U?"month billed annually":"year")}))]})),N&&e.jsxs("div",Object.assign({className:"per-message-price"},{children:[e.jsx(r.BodyCaption,Object.assign({style:{color:c.COLORS.content.secondary}},{children:N})),f&&e.jsx(r.BodyCaption,Object.assign({style:{color:c.COLORS.background.positive.vibrant,marginLeft:4}},{children:f}))]})),z&&z.length&&e.jsx("div",Object.assign({style:{marginTop:4}},{children:z.map(((s,t)=>e.jsx(r.BodyCaption,{style:{color:c.COLORS.content.secondary},dangerouslySetInnerHTML:{__html:s}},t)))})),L&&e.jsxs(r.Caption,Object.assign({className:"trial "+(O?"selected":"")},{children:["7 day free trial with ",P," messages"]})),k&&e.jsx(r.Caption,Object.assign({className:"trial "+(O?"selected":"")},{children:k})),e.jsx(r.TitleSmall,Object.assign({className:"extra-include-margin",style:{height:F?"":"20px"}},{children:F||""})),e.jsx("div",Object.assign({className:"features",style:{minHeight:Y}},{children:g.map(((s,i)=>e.jsxs("div",Object.assign({className:"feature"},{children:[e.jsx("div",{children:e.jsx(t.default,{height:20,width:20,color:c.COLORS.content.primary})}),e.jsx(r.BodyCaption,Object.assign({className:"feature-text"},{children:s.detail}),i)]}),s.detail)))})),_&&e.jsx(n.Button,{isLoading:!1,buttonType:"tertiary",buttonText:"See all features",size:"small",onClick:e=>{e.stopPropagation(),W&&W()}}),D&&e.jsx("div",Object.assign({className:"button-box"},{children:w?e.jsx(n.Button,{isLoading:!0,buttonType:"primary",buttonText:"Choose plan",size:"medium",matchParentWidth:!0}):e.jsxs(e.Fragment,{children:[O&&e.jsx(n.Button,{disabled:C,LeadingIcon:s.default,buttonType:"tertiary",size:"medium",matchParentWidth:!0,buttonText:M||"Selected Plan"}),!O&&!C&&e.jsx(n.Button,{buttonType:"primary",size:"medium",onClick:e=>{e.stopPropagation(),v(b)},matchParentWidth:!0,buttonText:M||"Choose plan"})]})})),R&&e.jsxs("div",Object.assign({className:"popular-testimony"},{children:[e.jsx(i.default,{height:26,width:70}),e.jsx("div",Object.assign({className:"testimony-text"},{children:e.jsx("i",{children:R})}))]}))]})),B&&e.jsx("div",Object.assign({className:`plan-bottom-information\n\t\t\t\t\t${C?"disabled":""}\n\t\t\t\t\t${O?"selected":""}\n\t\t\t\t`},{children:e.jsx(r.Caption,Object.assign({className:"text",style:{color:c.COLORS.background.inverse}},{children:B}))}))]}))}))};
@@ -31,6 +31,7 @@ export interface SubscriptionPlanProps {
31
31
  hideMonthYearTag?: boolean;
32
32
  buttonText?: string;
33
33
  hoverTooltip?: string;
34
+ hidePriceBlock?: boolean;
34
35
  }
35
36
  type Props = SubscriptionPlanProps;
36
37
  export declare const SubscriptionPlan: FunctionComponent<Props>;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/check.svg.js"),t=require("../button/Button.js"),i=require("./SubscriptionPlanStyled.js"),n=require("../TypographyStyle.js"),a=require("../../hooks/useCurreny.js"),r=require("../../constants/Theme.js");exports.SubscriptionPlan=c=>{const{formatCurrency:o}=a.useCurrency(),l=c.showMonthlyOptions?c.features:c.annualFeatures||[],d=c.showMonthlyOptions?c.monthlyPlan:c.yearlyPlan,j=!c.isDisabled&&c.isMostPopular,p=e=>0==e?"$0":o(e,"USD");return e.jsxs(i.SubscriptionPlanStyled,Object.assign({isManifestPlan:!0,isSelected:c.isSelected||!1,style:{marginTop:j?0:24}},{children:[j&&e.jsx("div",Object.assign({className:"most-popular"},{children:e.jsx(n.Caption,Object.assign({className:"text"},{children:"Most popular ⭐️"}))})),e.jsxs("div",Object.assign({className:`box ${c.isSelected?"selected":""} ${c.isDisabled?"disabled":""} ${j?"":"rounded-corners"}\n\t\t\t\t`},{children:[e.jsxs("div",{children:[e.jsx(n.TitleRegular,Object.assign({style:{color:r.COLORS.content.secondary,marginBottom:4}},{children:c.planName})),e.jsxs("div",Object.assign({className:"price-block"},{children:[c.oldPrice?e.jsx(n.BodyCaption,Object.assign({className:"old--price"},{children:p(d.price)})):e.jsx(e.Fragment,{}),e.jsx(n.TitleMedium,Object.assign({style:{color:r.COLORS.content.primary}},{children:c.oldPrice?p(c.oldPrice):p(d.price)})),e.jsx(n.BodyPrimary,Object.assign({style:{color:r.COLORS.content.secondary,marginLeft:4}},{children:c.hideMonthYearTag?"":"/ "+(c.showMonthlyOptions?"month":"year")}))]})),e.jsxs("div",Object.assign({className:"per-message-price"},{children:[c.planDescription&&e.jsx(n.BodyCaption,Object.assign({style:{color:r.COLORS.content.secondary}},{children:c.planDescription})),c.planDescriptionDiscount&&e.jsx(n.BodyCaption,Object.assign({style:{color:r.COLORS.background.positive.vibrant,marginLeft:4}},{children:c.planDescriptionDiscount}))]})),c.showTrialOptions&&e.jsxs(n.Caption,Object.assign({className:"trial "+(c.isSelected?"selected":"")},{children:["7 day free trial with ",c.freeTrialMessages," messages"]})),c.extraBlockMessage&&e.jsx(n.Caption,Object.assign({className:"trial "+(c.isSelected?"selected":"")},{children:c.extraBlockMessage})),e.jsx("div",Object.assign({className:"features"},{children:l.map(((t,i)=>e.jsxs("div",Object.assign({className:"feature"},{children:[e.jsx("div",{children:e.jsx(s.default,{height:12,width:12,color:r.COLORS.content.primary})}),e.jsx(n.BodyCaption,Object.assign({className:"feature-text"},{children:t.detail}),i)]}),t.detail)))}))]}),e.jsx("div",Object.assign({className:"button-box"},{children:c.isLoading?e.jsx(t.Button,{isLoading:!0,buttonType:"primary",buttonText:"Choose plan",size:"medium",matchParentWidth:!0}):e.jsxs(e.Fragment,{children:[c.isSelected&&e.jsx(t.Button,{disabled:c.isDisabled,LeadingIcon:s.default,buttonType:"tertiary",size:"medium",matchParentWidth:!0,buttonText:c.buttonText||"Selected Plan"}),!c.isSelected&&!c.isDisabled&&e.jsx(t.Button,{buttonType:"primary",size:"medium",onClick:()=>c.onPlanSelect(c.code),matchParentWidth:!0,buttonText:c.buttonText||"Choose plan"})]})}))]})),c.bottomDescription&&e.jsx("div",Object.assign({className:`plan-bottom-information\n\t\t\t\t\t${c.isDisabled?"disabled":""}\n\t\t\t\t\t${c.isSelected?"selected":""}\n\t\t\t\t`},{children:e.jsx(n.Caption,Object.assign({className:"text",style:{color:r.COLORS.background.inverse}},{children:c.bottomDescription}))}))]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/check.svg.js"),t=require("../button/Button.js"),i=require("./SubscriptionPlanStyled.js"),n=require("../TypographyStyle.js"),a=require("../../hooks/useCurreny.js"),r=require("../../constants/Theme.js");exports.SubscriptionPlan=c=>{const{formatCurrency:o}=a.useCurrency(),l=c.showMonthlyOptions?c.features:c.annualFeatures||[],d=c.showMonthlyOptions?c.monthlyPlan:c.yearlyPlan,j=!c.isDisabled&&c.isMostPopular,u=e=>0==e?"$0":o(e,"USD");return e.jsxs(i.SubscriptionPlanStyled,Object.assign({isManifestPlan:!0,isSelected:c.isSelected||!1,style:{marginTop:j?0:24}},{children:[j&&e.jsx("div",Object.assign({className:"most-popular"},{children:e.jsx(n.Caption,Object.assign({className:"text"},{children:"Most popular ⭐️"}))})),e.jsxs("div",Object.assign({className:`box ${c.isSelected?"selected":""} ${c.isDisabled?"disabled":""} ${j?"":"rounded-corners"}\n\t\t\t\t`},{children:[e.jsxs("div",{children:[e.jsx(n.TitleRegular,Object.assign({style:{color:r.COLORS.content.secondary,marginBottom:4}},{children:c.planName})),(null==c?void 0:c.hidePriceBlock)?e.jsx(e.Fragment,{}):e.jsxs("div",Object.assign({className:"price-block"},{children:[c.oldPrice?e.jsx(n.BodyCaption,Object.assign({className:"old--price"},{children:u(d.price)})):e.jsx(e.Fragment,{}),e.jsx(n.TitleMedium,Object.assign({style:{color:r.COLORS.content.primary}},{children:c.oldPrice?u(c.oldPrice):u(d.price)})),e.jsx(n.BodyPrimary,Object.assign({style:{color:r.COLORS.content.secondary,marginLeft:4}},{children:c.hideMonthYearTag?"":"/ "+(c.showMonthlyOptions?"month":"year")}))]})),e.jsxs("div",Object.assign({className:"per-message-price"},{children:[c.planDescription&&e.jsx(n.BodyCaption,Object.assign({style:{color:r.COLORS.content.secondary}},{children:c.planDescription})),c.planDescriptionDiscount&&e.jsx(n.BodyCaption,Object.assign({style:{color:r.COLORS.background.positive.vibrant,marginLeft:4}},{children:c.planDescriptionDiscount}))]})),c.showTrialOptions&&e.jsxs(n.Caption,Object.assign({className:"trial "+(c.isSelected?"selected":"")},{children:["7 day free trial with ",c.freeTrialMessages," messages"]})),c.extraBlockMessage&&e.jsx(n.Caption,Object.assign({className:"trial "+(c.isSelected?"selected":"")},{children:c.extraBlockMessage})),e.jsx("div",Object.assign({className:"features"},{children:l.map(((t,i)=>e.jsxs("div",Object.assign({className:"feature"},{children:[e.jsx("div",{children:e.jsx(s.default,{height:12,width:12,color:r.COLORS.content.primary})}),e.jsx(n.BodyCaption,Object.assign({className:"feature-text"},{children:t.detail}),i)]}),t.detail)))}))]}),e.jsx("div",Object.assign({className:"button-box"},{children:c.isLoading?e.jsx(t.Button,{isLoading:!0,buttonType:"primary",buttonText:"Choose plan",size:"medium",matchParentWidth:!0}):e.jsxs(e.Fragment,{children:[c.isSelected&&e.jsx(t.Button,{disabled:c.isDisabled,LeadingIcon:s.default,buttonType:"tertiary",size:"medium",matchParentWidth:!0,buttonText:c.buttonText||"Selected Plan"}),!c.isSelected&&!c.isDisabled&&e.jsx(t.Button,{buttonType:"primary",size:"medium",onClick:()=>c.onPlanSelect(c.code),matchParentWidth:!0,buttonText:c.buttonText||"Choose plan"})]})}))]})),c.bottomDescription&&e.jsx("div",Object.assign({className:`plan-bottom-information\n\t\t\t\t\t${c.isDisabled?"disabled":""}\n\t\t\t\t\t${c.isSelected?"selected":""}\n\t\t\t\t`},{children:e.jsx(n.Caption,Object.assign({className:"text",style:{color:r.COLORS.background.inverse}},{children:c.bottomDescription}))}))]}))};
@@ -13,6 +13,7 @@ export interface ProductVariant {
13
13
  id?: string;
14
14
  actualPrice?: string;
15
15
  currency?: string;
16
+ skuId?: string;
16
17
  }
17
18
  export interface Product {
18
19
  name: string;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react/jsx-runtime"),o=require("../../assets/icons/search.svg.js"),c=require("react"),r=require("../../constants/Theme.js"),s=require("../../assets/icons/cross.svg.js"),n=require("../button/Button.js"),i=require("../input/Input.js"),l=require("../modals/styledModal.js"),a=require("../spinner/Spinner.js"),d=require("../tag/Tag.js"),u=require("./collectionScreen.js"),h=require("./productInfoOverlay.js"),p=require("./productScreen.js"),S=require("./rearrangeScreen.js"),C=require("./reducers.js"),x=require("./searchScreen.js"),g=require("./selectedScreen.js"),j=require("./style.js"),y=require("./type.js"),m=require("./utility.js");exports.ScreenName=void 0,(e=exports.ScreenName||(exports.ScreenName={})).Collections="collections",e.RearrangeProducts="rearrange",e.SelectedProducts="view",e.SearchProducts="searchProducts",e.Products="products";exports.ProductPickerModal=e=>{const{storeId:b,selectedItems:f,onClose:v,visible:k,zIndex:I,exactLimit:P,limit:O,hideCollectionCheckbox:F,hideProductCheckbox:R,outOfStockAction:T=y.OUT_OF_STOCK_ACTION.BLUR,hideVariantCheckbox:D,selectProductsFromCustomCollection:q,hideSelectionCount:N,title:E,width:A,left:w,renderWithoutModal:B,onClickSave:L,pickerType:M,hideProductVariants:V=!1,startupScreen:z=exports.ScreenName.Collections,rearrangeEnabled:$,selectSingleItem:_=!1,showProductDetails:H,containerStyle:W,crossButtonInsideHeader:G=!1,footerForNonModal:K={},primaryButton:U,secondaryButton:Y,subtitle:J}=e,[Q,X]=c.useReducer(C.collectionsReducer,{}),[Z,ee]=c.useState([exports.ScreenName.Collections,exports.ScreenName.RearrangeProducts].includes(z)?z:exports.ScreenName.Collections),[te,oe]=c.useState("grid"),[ce,re]=c.useState(""),[se,ne]=c.useState(""),[ie,le]=c.useState(0),[ae,de]=c.useState(!1),[ue,he]=c.useState(0),[pe,Se]=c.useState(""),[Ce,xe]=c.useState(!1),[ge,je]=c.useState(!1),[ye,me]=c.useReducer(C.searchReducer,{collections:{},products:{}}),[be,fe]=c.useReducer(C.selectedColectionsReducer,Object.keys(f).length>0?f:{}),ve=c.useRef(null),[ke,Ie]=c.useState(!1),[Pe,Oe]=c.useState();c.useEffect((()=>{de(!0),je(!0),e.collectionFetcher(ie,b).then((e=>{X({type:"fetched",data:(null==e?void 0:e.collections)||{}}),de(!1),le((e=>e+1)),je(!1)})).catch()}),[]),c.useEffect((()=>{let e=0;V?Object.keys(be||[]).forEach((t=>{var o;Object.keys((null===(o=be[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var c;"-1"!==t&&be[-1]&&(null===(c=be[-1].products)||void 0===c?void 0:c[o])||(e+=1)}))})):Object.keys(be||[]).forEach((t=>{var o;Object.keys((null===(o=be[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var c,r;Object.keys((null===(r=null===(c=be[t].products)||void 0===c?void 0:c[o])||void 0===r?void 0:r.variants)||[]).forEach((()=>{e+=1}))}))})),he(e)}),[Q,be,V]),c.useEffect((()=>{se&&(de(!0),e.productFetcher(se,b).then((e=>{Object.keys(e).length&&X({type:"productsFetched",data:{collectionId:se,products:e}}),de(!1)})).catch())}),[se]),c.useEffect((()=>{const t=setTimeout((()=>{"rearrange"!==Z&&(pe.length||"collections"!==Z)&&(pe.length?(xe(!0),e.searchFetcher(b,pe).then((e=>{"collections"in e&&"products"in e?(me({type:"set",data:e}),X({type:"searched",data:e.collections})):(me({type:"set",data:{collections:{},products:e}}),X({type:"searched",data:e})),ee("searchProducts"),de(!1),xe(!1)}))):ee("collections"))}),800);return()=>clearTimeout(t)}),[pe]),c.useEffect((()=>{L&&(e.onAdd(be,ue),Fe())}),[L]),c.useEffect((()=>{_&&Object.keys(be||{}).length&&ue&&(e.onAdd(be,ue),Fe())}),[_,be,ue]);const Fe=()=>{fe({type:"reset",data:{}})},Re=()=>P&&ue>P?t.jsx(d.Tag,{tagText:`You can only select ${P} products`,type:"negative"}):O&&ue>O?t.jsx(d.Tag,{tagText:`You can only select ${O} products`,type:"negative"}):ue>0?t.jsx(n.Button,{onClick:()=>{ee($?exports.ScreenName.RearrangeProducts:exports.ScreenName.SelectedProducts)},buttonText:P?`${ue}/${P} products selected`:`${ue} products selected`,buttonType:["rearrange","view"].includes(Z)?"tertiaryGray":"tertiary",disabled:["rearrange","view"].includes(Z)}):t.jsx(n.Button,{disabled:!0,buttonText:P?`${ue}/${P} products selected`:`${ue} products selected`,buttonType:"tertiaryGray"}),Te=e=>ae?"Loading...":Z===exports.ScreenName.RearrangeProducts?null!=e?e:"Done":null!=e?e:"Add",De=t.jsxs(j.ContainerStyle,Object.assign({style:null!=W?W:{}},{children:[e.postHeader&&t.jsx("div",Object.assign({style:{padding:"0 24px"}},{children:e.postHeader})),!e.hideGlobalSearch&&t.jsx(t.Fragment,{children:("collections"===Z||"searchProducts"===Z)&&t.jsx("div",Object.assign({style:{padding:B?"8px 16px":"12px 24px",borderBottom:"1px solid #E0E0E0"}},{children:t.jsx(i.Input,{placeholder:"Search for collections and products, or type a product ID",noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>Ce?t.jsx(a.Spinner,{size:"small",color:r.COLORS.content.primary}):t.jsx(o.default,{})},id:"listInput",height:"24px",type:"text",value:pe,onChangeText:e=>{e.length&&e.trim().length?Se(e):Se("")}})}))}),t.jsxs(j.ScrollContainerStyle,Object.assign({ref:ve,screenName:Z},{children:["collections"===Z&&t.jsx(u.CollectionsScreen,{customCollectionRestriction:e.customCollectionRestriction,dataLoading:ge,collections:Q,selectedCollectionsDispatch:fe,setCollectionId:re,setSelectedCollectionId:ne,setScreen:ee,selectedCollections:be,collectionFetcher:e.collectionFetcher,storeId:b,collectionsDispatch:X,setSaveDisabled:de,pagingControls:{curPage:ie,setCurPage:le},hideCollectionCheckbox:F,renderWithoutModal:B,pickerType:M,scrollContainerRef:ve}),"products"===Z&&ce&&t.jsx(C.CollectionIdContext.Provider,Object.assign({value:ce},{children:t.jsx(p.ProductsScreen,{hideInCollectionSearch:e.hideInCollectionSearch,customCollectionRestriction:e.customCollectionRestriction,productFetcher:e.productFetcher,setScreen:ee,storeId:b,data:Q[ce],collectionsDispatch:X,selectedCollectionsDispatch:fe,selectedData:be,setSaveDisabled:de,searchInCollectionFetcher:e.searchInCollectionFetcher,hideProductCheckbox:R,outOfStockAction:T,hideVariantCheckbox:D,selectProductsFromCustomCollection:q,renderWithoutModal:B,pickerType:M,hideProductVariants:V,fbStatusFetcher:e.fbStatusFetcher,onProductDetailClick:e=>{Ie(!0),Oe(e)},showProductDetailInfoIcon:H,scrollContainerRef:ve})})),"view"===Z&&t.jsx(g.SelectedScreen,{selectedCollections:be||{},selectedCollectionsDispatch:fe,setScreen:ee,collections:Q,hideProductVariants:V,outOfStockAction:T,storeId:b,fbStatusFetcher:e.fbStatusFetcher}),"rearrange"===Z&&t.jsx(S.RearrangeScreen,{selectedCollections:be||{},selectedCollectionsDispatch:fe,setScreen:ee,outOfStockAction:T,rearrangeViewType:"grid"===te?"list":"grid",scrollContainerRef:ve,storeId:b,fbStatusFetcher:e.fbStatusFetcher}),"searchProducts"===Z&&t.jsx(x.SearchScreen,{customCollectionRestriction:e.customCollectionRestriction,selectedCollections:be||{},searchedCollections:ye||{},searchedCollectionsDispatch:me,selectedCollectionsDispatch:fe,setScreen:ee,collections:Q,onBackPress:()=>{Se(""),me({type:"set",data:{collections:{},products:{}}})},pickerType:M,hideProductCheckbox:R,hideProductVariants:V,hideVariantCheckbox:D,storeId:b,fbStatusFetcher:e.fbStatusFetcher,setCollectionId:re,setSelectedCollectionId:ne,renderWithoutModal:B,hideCollectionCheckbox:F,outOfStockAction:T})]}))]}));return t.jsx(t.Fragment,{children:B?t.jsxs(t.Fragment,{children:[De,K.renderFooter?t.jsxs(j.StyledFooterForNonModal,{children:[Re(),t.jsx(n.Button,{buttonText:Te(K.primaryButtonText),disabled:!K.isLoading&&(ae||ue<1||P&&ue<P||!P&&O&&ue>O)||K.primaryButtonDisabled,isLoading:K.isLoading,onClick:()=>{e.onAdd(be,ue),Fe(),ee([exports.ScreenName.Collections,exports.ScreenName.RearrangeProducts].includes(z)?z:exports.ScreenName.Collections)}})]}):t.jsx(t.Fragment,{}),ke&&Pe?t.jsx(h.ProductInfoOverlay,{productData:Pe,outOfStockAction:T,useDynamicInfoImageSize:e.useDynamicInfoImageSize,onClose:()=>{Ie(!1)}}):t.jsx(t.Fragment,{})]}):t.jsxs(l.StyledModal,Object.assign({zIndex:I,open:k,onClose:()=>{null==v||v(),Fe()},headingTitle:E||("collections"===Z||"products"===Z?"Select Products":"view"===Z?"Selected Products":"searchProducts"===Z?"Searched Results":"rearrange"===Z?"Rearrange Products":void 0),headingSubtitle:J,footerShadow:!0,centralContainerStyles:{width:A||"600px",left:w||"auto"},headerRightCustomElement:G?t.jsx("div",Object.assign({style:{cursor:"pointer",display:"flex"},onClick:v},{children:t.jsx(s.default,{width:20,height:20,color:r.COLORS.content.secondary})})):t.jsx(t.Fragment,{}),footerContainerStyle:e.stickyFooter?{position:"absolute",bottom:0,left:0,width:"100%",zIndex:9,background:r.COLORS.surface.standard}:void 0,primaryButton:U?(t=>Object.assign(Object.assign({},t),{disabled:!t.isLoading&&(ae||ue<1||P&&ue<P||!P&&O&&ue>O)||t.disabled,onClick:()=>{e.onAdd(be,ue),Fe(),ee([exports.ScreenName.Collections,exports.ScreenName.RearrangeProducts].includes(z)?z:exports.ScreenName.Collections)}}))(U):{buttonText:Te(),disabled:ae||ue<1||P&&ue<P||!P&&O&&ue>O||!1,onClick:()=>{e.onAdd(be,ue),Fe()}},secondaryButton:Y?(t=>Object.assign(Object.assign({},t),{disabled:ae||ue<1||P&&ue<P||!P&&O&&ue>O||!1,onClick:()=>{const t=m.updateAllVariantsForSelectedProducts(be,Q,ye);e.onAdd(t,ue,!0)}}))(Y):void 0,wrapperStyle:e.stickyFooter?{height:"calc(100vh - 168px)"}:void 0,footerLeftCustomElement:N?t.jsx(t.Fragment,{}):Re(),hideCrossButton:ke||G},{children:[De,ke&&Pe?t.jsx(h.ProductInfoOverlay,{productData:Pe,useDynamicInfoImageSize:e.useDynamicInfoImageSize,outOfStockAction:T,onClose:()=>{Ie(!1)}}):t.jsx(t.Fragment,{})]}))})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react/jsx-runtime"),o=require("../../assets/icons/search.svg.js"),c=require("react"),r=require("../../constants/Theme.js"),s=require("../../assets/icons/cross.svg.js"),n=require("../button/Button.js"),i=require("../input/Input.js"),l=require("../modals/styledModal.js"),a=require("../spinner/Spinner.js"),d=require("../tag/Tag.js"),u=require("./collectionScreen.js"),h=require("./productInfoOverlay.js"),p=require("./productScreen.js"),S=require("./rearrangeScreen.js"),g=require("./reducers.js"),C=require("./searchScreen.js"),x=require("./selectedScreen.js"),j=require("./style.js"),y=require("./type.js"),m=require("./utility.js");exports.ScreenName=void 0,(e=exports.ScreenName||(exports.ScreenName={})).Collections="collections",e.RearrangeProducts="rearrange",e.SelectedProducts="view",e.SearchProducts="searchProducts",e.Products="products";exports.ProductPickerModal=e=>{const{storeId:b,selectedItems:f,onClose:v,visible:P,zIndex:k,exactLimit:I,limit:O,hideCollectionCheckbox:F,hideProductCheckbox:R,outOfStockAction:T=y.OUT_OF_STOCK_ACTION.BLUR,hideVariantCheckbox:D,selectProductsFromCustomCollection:q,hideSelectionCount:N,title:E,width:A,left:w,renderWithoutModal:B,onClickSave:L,pickerType:M,hideProductVariants:V=!1,startupScreen:z=exports.ScreenName.Collections,rearrangeEnabled:$,selectSingleItem:_=!1,showProductDetails:H,containerStyle:W,crossButtonInsideHeader:G=!1,footerForNonModal:K={},primaryButton:U,secondaryButton:Y,subtitle:J}=e,[Q,X]=c.useReducer(g.collectionsReducer,{}),[Z,ee]=c.useState([exports.ScreenName.Collections,exports.ScreenName.RearrangeProducts].includes(z)?z:exports.ScreenName.Collections),[te,oe]=c.useState("grid"),[ce,re]=c.useState(""),[se,ne]=c.useState(""),[ie,le]=c.useState(0),[ae,de]=c.useState(!1),[ue,he]=c.useState(0),[pe,Se]=c.useState(""),[ge,Ce]=c.useState(!1),[xe,je]=c.useState(!1),[ye,me]=c.useReducer(g.searchReducer,{collections:{},products:{}}),[be,fe]=c.useReducer(g.selectedColectionsReducer,Object.keys(f).length>0?f:{}),ve=c.useRef(null),[Pe,ke]=c.useState(!1),[Ie,Oe]=c.useState();c.useEffect((()=>{de(!0),je(!0),e.collectionFetcher(ie,b).then((e=>{console.log("collectionsParsed?.collections",null==e?void 0:e.collections),X({type:"fetched",data:(null==e?void 0:e.collections)||{}}),de(!1),le((e=>e+1)),je(!1)})).catch()}),[]),c.useEffect((()=>{let e=0;V?Object.keys(be||[]).forEach((t=>{var o;Object.keys((null===(o=be[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var c;"-1"!==t&&be[-1]&&(null===(c=be[-1].products)||void 0===c?void 0:c[o])||(e+=1)}))})):Object.keys(be||[]).forEach((t=>{var o;Object.keys((null===(o=be[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var c,r;Object.keys((null===(r=null===(c=be[t].products)||void 0===c?void 0:c[o])||void 0===r?void 0:r.variants)||[]).forEach((()=>{e+=1}))}))})),he(e)}),[Q,be,V]),c.useEffect((()=>{se&&(de(!0),e.productFetcher(se,b).then((e=>{Object.keys(e).length&&X({type:"productsFetched",data:{collectionId:se,products:e}}),de(!1)})).catch())}),[se]),c.useEffect((()=>{const t=setTimeout((()=>{"rearrange"!==Z&&(pe.length||"collections"!==Z)&&(pe.length?(Ce(!0),e.searchFetcher(b,pe).then((e=>{"collections"in e&&"products"in e?(me({type:"set",data:e}),X({type:"searched",data:e.collections})):(me({type:"set",data:{collections:{},products:e}}),X({type:"searched",data:e})),ee("searchProducts"),de(!1),Ce(!1)}))):ee("collections"))}),800);return()=>clearTimeout(t)}),[pe]),c.useEffect((()=>{L&&(e.onAdd(be,ue),Fe())}),[L]),c.useEffect((()=>{_&&Object.keys(be||{}).length&&ue&&(e.onAdd(be,ue),Fe())}),[_,be,ue]);const Fe=()=>{fe({type:"reset",data:{}})},Re=()=>I&&ue>I?t.jsx(d.Tag,{tagText:`You can only select ${I} products`,type:"negative"}):O&&ue>O?t.jsx(d.Tag,{tagText:`You can only select ${O} products`,type:"negative"}):ue>0?t.jsx(n.Button,{onClick:()=>{ee($?exports.ScreenName.RearrangeProducts:exports.ScreenName.SelectedProducts)},buttonText:I?`${ue}/${I} products selected`:`${ue} products selected`,buttonType:["rearrange","view"].includes(Z)?"tertiaryGray":"tertiary",disabled:["rearrange","view"].includes(Z)}):t.jsx(n.Button,{disabled:!0,buttonText:I?`${ue}/${I} products selected`:`${ue} products selected`,buttonType:"tertiaryGray"}),Te=e=>ae?"Loading...":Z===exports.ScreenName.RearrangeProducts?null!=e?e:"Done":null!=e?e:"Add",De=t.jsxs(j.ContainerStyle,Object.assign({style:null!=W?W:{}},{children:[e.postHeader&&t.jsx("div",Object.assign({style:{padding:"0 24px"}},{children:e.postHeader})),!e.hideGlobalSearch&&t.jsx(t.Fragment,{children:("collections"===Z||"searchProducts"===Z)&&t.jsx("div",Object.assign({style:{padding:B?"8px 16px":"12px 24px",borderBottom:"1px solid #E0E0E0"}},{children:t.jsx(i.Input,{placeholder:"Search products using name or SKU ID",noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>ge?t.jsx(a.Spinner,{size:"small",color:r.COLORS.content.primary}):t.jsx(o.default,{})},id:"listInput",height:"24px",type:"text",value:pe,onChangeText:e=>{e.length&&e.trim().length?Se(e):Se("")}})}))}),t.jsxs(j.ScrollContainerStyle,Object.assign({ref:ve,screenName:Z},{children:["collections"===Z&&t.jsx(u.CollectionsScreen,{customCollectionRestriction:e.customCollectionRestriction,dataLoading:xe,collections:Q,selectedCollectionsDispatch:fe,setCollectionId:re,setSelectedCollectionId:ne,setScreen:ee,selectedCollections:be,collectionFetcher:e.collectionFetcher,storeId:b,collectionsDispatch:X,setSaveDisabled:de,pagingControls:{curPage:ie,setCurPage:le},hideCollectionCheckbox:F,renderWithoutModal:B,pickerType:M,scrollContainerRef:ve}),"products"===Z&&ce&&t.jsx(g.CollectionIdContext.Provider,Object.assign({value:ce},{children:t.jsx(p.ProductsScreen,{hideInCollectionSearch:e.hideInCollectionSearch,customCollectionRestriction:e.customCollectionRestriction,productFetcher:e.productFetcher,setScreen:ee,storeId:b,data:Q[ce],collectionsDispatch:X,selectedCollectionsDispatch:fe,selectedData:be,setSaveDisabled:de,searchInCollectionFetcher:e.searchInCollectionFetcher,hideProductCheckbox:R,outOfStockAction:T,hideVariantCheckbox:D,selectProductsFromCustomCollection:q,renderWithoutModal:B,pickerType:M,hideProductVariants:V,fbStatusFetcher:e.fbStatusFetcher,onProductDetailClick:e=>{ke(!0),Oe(e)},showProductDetailInfoIcon:H,scrollContainerRef:ve})})),"view"===Z&&t.jsx(x.SelectedScreen,{selectedCollections:be||{},selectedCollectionsDispatch:fe,setScreen:ee,collections:Q,hideProductVariants:V,outOfStockAction:T,storeId:b,fbStatusFetcher:e.fbStatusFetcher}),"rearrange"===Z&&t.jsx(S.RearrangeScreen,{selectedCollections:be||{},selectedCollectionsDispatch:fe,setScreen:ee,outOfStockAction:T,rearrangeViewType:"grid"===te?"list":"grid",scrollContainerRef:ve,storeId:b,fbStatusFetcher:e.fbStatusFetcher}),"searchProducts"===Z&&t.jsx(C.SearchScreen,{customCollectionRestriction:e.customCollectionRestriction,selectedCollections:be||{},searchedCollections:ye||{},searchedCollectionsDispatch:me,selectedCollectionsDispatch:fe,setScreen:ee,collections:Q,onBackPress:()=>{Se(""),me({type:"set",data:{collections:{},products:{}}})},pickerType:M,hideProductCheckbox:R,hideProductVariants:V,hideVariantCheckbox:D,storeId:b,fbStatusFetcher:e.fbStatusFetcher,setCollectionId:re,setSelectedCollectionId:ne,renderWithoutModal:B,hideCollectionCheckbox:F,outOfStockAction:T})]}))]}));return t.jsx(t.Fragment,{children:B?t.jsxs(t.Fragment,{children:[De,K.renderFooter?t.jsxs(j.StyledFooterForNonModal,{children:[Re(),t.jsx(n.Button,{buttonText:Te(K.primaryButtonText),disabled:!K.isLoading&&(ae||ue<1||I&&ue<I||!I&&O&&ue>O)||K.primaryButtonDisabled,isLoading:K.isLoading,onClick:()=>{e.onAdd(be,ue),Fe(),ee([exports.ScreenName.Collections,exports.ScreenName.RearrangeProducts].includes(z)?z:exports.ScreenName.Collections)}})]}):t.jsx(t.Fragment,{}),Pe&&Ie?t.jsx(h.ProductInfoOverlay,{productData:Ie,outOfStockAction:T,useDynamicInfoImageSize:e.useDynamicInfoImageSize,onClose:()=>{ke(!1)}}):t.jsx(t.Fragment,{})]}):t.jsxs(l.StyledModal,Object.assign({zIndex:k,open:P,onClose:()=>{null==v||v(),Fe()},headingTitle:E||("collections"===Z||"products"===Z?"Select Products":"view"===Z?"Selected Products":"searchProducts"===Z?"Searched Results":"rearrange"===Z?"Rearrange Products":void 0),headingSubtitle:J,footerShadow:!0,centralContainerStyles:{width:A||"600px",left:w||"auto"},headerRightCustomElement:G?t.jsx("div",Object.assign({style:{cursor:"pointer",display:"flex"},onClick:v},{children:t.jsx(s.default,{width:20,height:20,color:r.COLORS.content.secondary})})):t.jsx(t.Fragment,{}),footerContainerStyle:e.stickyFooter?{position:"absolute",bottom:0,left:0,width:"100%",zIndex:9,background:r.COLORS.surface.standard}:void 0,primaryButton:U?(t=>Object.assign(Object.assign({},t),{disabled:!t.isLoading&&(ae||ue<1||I&&ue<I||!I&&O&&ue>O)||t.disabled,onClick:()=>{e.onAdd(be,ue),Fe(),ee([exports.ScreenName.Collections,exports.ScreenName.RearrangeProducts].includes(z)?z:exports.ScreenName.Collections)}}))(U):{buttonText:Te(),disabled:ae||ue<1||I&&ue<I||!I&&O&&ue>O||!1,onClick:()=>{e.onAdd(be,ue),Fe()}},secondaryButton:Y?(t=>Object.assign(Object.assign({},t),{disabled:ae||ue<1||I&&ue<I||!I&&O&&ue>O||!1,onClick:()=>{const t=m.updateAllVariantsForSelectedProducts(be,Q,ye);e.onAdd(t,ue,!0)}}))(Y):void 0,wrapperStyle:e.stickyFooter?{height:"calc(100vh - 168px)"}:void 0,footerLeftCustomElement:N?t.jsx(t.Fragment,{}):Re(),hideCrossButton:Pe||G},{children:[De,Pe&&Ie?t.jsx(h.ProductInfoOverlay,{productData:Ie,useDynamicInfoImageSize:e.useDynamicInfoImageSize,outOfStockAction:T,onClose:()=>{ke(!1)}}):t.jsx(t.Fragment,{})]}))})};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),i=require("../../assets/icons/info.svg.js"),o=require("../checkBox/CheckBox.js"),c=require("../icon-button/IconButton.js"),r=require("../shimmer-image/ShimmerImage.js"),d=require("../tooltips/Tooltip.js"),n=require("../TypographyStyle.js"),l=require("./constants.js"),a=require("./helpers/ProductHelper.js"),s=require("./ProductPickerTag.js"),u=require("./style.js"),v=require("./utility.js");const p=l=>{const{isVariant:v,data:p,productId:h,collectionId:y,variantId:I,isSelected:P,selectedCollectionsDispatch:j,viewOnly:x,upliftAdditions:k,isPartiallyChecked:C,hideProductCheckbox:g,outOfStockAction:b,hideVariantCheckbox:O,hideProductVariants:m,pickerType:f="PRODUCT",onProductDetailClick:S,showProductDetailInfoIcon:T,currencyAndPrice:D}=l,{isVariantForProductPickerTag:V,dataForProductPickerTag:q,tagText:w,tagType:A}=a.ProductHelper.getDataForProductPickerTag(p,v,b);return e.jsxs(u.ProductCardStyle,Object.assign({isVariant:v,onClick:e=>{if(e.stopPropagation(),"PRODUCT"===f&&(g||O)){const e=Object.keys(p.variants);m?P?j({type:"productUnselected",data:{productId:h,collectionId:y}}):k("productSelected",{productId:h,variantId:I,collectionId:y,product:p}):P?j({type:"variantUnselected",data:{productId:h,variantId:I,collectionId:y}}):k("variantSelected",{productId:h,variantId:I||e[0],collectionId:y,variant:p})}},isActive:P},{children:[v&&!x&&!O||!v&&!x&&!g?e.jsx(o.CheckBox,{isChecked:P,isPartiallyChecked:C||!1,onValueChange:function(e,t,i){null==i||i.stopPropagation(),v?e?k(m?"productSelected":"variantSelected",{productId:h,variantId:I,collectionId:y,variant:p}):j({type:m?"productUnselected":"variantUnselected",data:{productId:h,variantId:I,collectionId:y}}):e?k("productSelected",{productId:h,collectionId:y,product:p}):j({type:"productUnselected",data:{productId:h,collectionId:y}})}}):e.jsx(e.Fragment,{}),e.jsx("div",{children:e.jsx(r.ShimmerImage,{width:40,height:40,imageUrl:p.image,alt:"Item",borderRadius:4})}),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",flex:1}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",justifyContent:"space-between"}},{children:[e.jsx(d.Tooltip,Object.assign({variant:"light",body:p.name,placement:"bottom",delay:400},{children:e.jsx(n.TitleSmall,Object.assign({numberOfLines:1},{children:p.name}))})),T&&e.jsx(c.IconButton,{onClick:()=>{null==S||S(p)},Icon:()=>e.jsx(i.default,{width:20,height:20,color:t.COLORS.content.placeholder})})]})),e.jsx(s.ProductPickerTag,{isVariant:V,data:q,tagText:w,tagType:A}),e.jsx(n.BodyCaption,Object.assign({color:t.COLORS.content.secondary},{children:!(null==q?void 0:q.fbStatus)&&V||w?null:D}))]}))]}))};exports.ProductCard=p,exports.ProductGroup=t=>{var i,o,c,r,d,n,a,s,u;const{collectionId:h,productId:y,data:I,selectedData:P,selectedCollectionsDispatch:j,viewOnly:x,upliftAdditions:k,isProductPartiallyChecked:C,hideProductCheckbox:g,outOfStockAction:b,hideVariantCheckbox:O,hideProductVariants:m,pickerType:f,onProductDetailClick:S,showProductDetailInfoIcon:T}=t,D=e=>{var t,i,o,c,r,d;if(!(null===(i=null===(t=null==P?void 0:P[h])||void 0===t?void 0:t.products)||void 0===i?void 0:i[y]))return!1;return!!(null===(d=null===(r=null===(c=null===(o=null==P?void 0:P[h])||void 0===o?void 0:o.products)||void 0===c?void 0:c[y])||void 0===r?void 0:r.variants)||void 0===d?void 0:d[e])},V=m||!v.shouldShowVariant(I)?`${I.currency&&null!==(i=l.CurrencySymbols[I.currency])&&void 0!==i?i:""}${null!==(u=null!==(d=null===(r=null===(c=Object.values(null!==(o=I.variants)&&void 0!==o?o:{}))||void 0===c?void 0:c[0])||void 0===r?void 0:r.price)&&void 0!==d?d:null===(s=null===(a=Object.values(null!==(n=I.variants)&&void 0!==n?n:{}))||void 0===a?void 0:a[0])||void 0===s?void 0:s.actualPrice)&&void 0!==u?u:""}`:"";return e.jsxs("div",{children:[e.jsx(p,{isVariant:!1,data:I,productId:y,collectionId:h,isSelected:(()=>{var e,t;return!!(null===(t=null===(e=null==P?void 0:P[h])||void 0===e?void 0:e.products)||void 0===t?void 0:t[y])})(),isPartiallyChecked:C,selectedCollectionsDispatch:j,upliftAdditions:k,viewOnly:x,hideProductCheckbox:g,hideVariantCheckbox:O,hideProductVariants:m,pickerType:f,outOfStockAction:b,onProductDetailClick:S,showProductDetailInfoIcon:T,currencyAndPrice:V},y),m?null:v.shouldShowVariant(I)&&Object.keys(I.variants||[]).map((t=>{var i,o,c,r,d,n,a;const s=`${I.currency&&null!==(i=l.CurrencySymbols[I.currency])&&void 0!==i?i:""}${null!==(a=null!==(r=null===(c=null===(o=I.variants)||void 0===o?void 0:o[t])||void 0===c?void 0:c.price)&&void 0!==r?r:null===(n=null===(d=I.variants)||void 0===d?void 0:d[t])||void 0===n?void 0:n.actualPrice)&&void 0!==a?a:""}`;return e.jsx(p,{isVariant:!0,hideVariantCheckbox:O,data:Object.assign(Object.assign({},I.variants[t]),{currency:I.currency}),variantId:t,productId:y,viewOnly:x,upliftAdditions:k,collectionId:h,isSelected:D(t),selectedCollectionsDispatch:j,outOfStockAction:b,onProductDetailClick:S,showProductDetailInfoIcon:T,currencyAndPrice:s},t)}))]})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),i=require("../../assets/icons/info.svg.js"),o=require("../checkBox/CheckBox.js"),c=require("../icon-button/IconButton.js"),r=require("../shimmer-image/ShimmerImage.js"),d=require("../tooltips/Tooltip.js"),l=require("../TypographyStyle.js"),n=require("./constants.js"),a=require("./helpers/ProductHelper.js"),s=require("./ProductPickerTag.js"),u=require("./style.js"),v=require("./utility.js");const p=n=>{const{isVariant:p,data:h,productId:y,collectionId:I,variantId:j,isSelected:P,selectedCollectionsDispatch:x,viewOnly:g,upliftAdditions:k,isPartiallyChecked:C,hideProductCheckbox:b,outOfStockAction:O,hideVariantCheckbox:S,hideProductVariants:f,pickerType:m="PRODUCT",onProductDetailClick:T,showProductDetailInfoIcon:D,currencyAndPrice:V}=n,{isVariantForProductPickerTag:q,dataForProductPickerTag:w,tagText:A,tagType:U}=a.ProductHelper.getDataForProductPickerTag(h,p,O);console.log({data:h,isVariant:p,isVariantForProductPickerTag:q});const B=v.getSkuId(h,p);return e.jsxs(u.ProductCardStyle,Object.assign({isVariant:p,onClick:e=>{if(e.stopPropagation(),"PRODUCT"===m&&(b||S)){const e=Object.keys(h.variants);f?P?x({type:"productUnselected",data:{productId:y,collectionId:I}}):k("productSelected",{productId:y,variantId:j,collectionId:I,product:h}):P?x({type:"variantUnselected",data:{productId:y,variantId:j,collectionId:I}}):k("variantSelected",{productId:y,variantId:j||e[0],collectionId:I,variant:h})}},isActive:P},{children:[p&&!g&&!S||!p&&!g&&!b?e.jsx(o.CheckBox,{isChecked:P,isPartiallyChecked:C||!1,onValueChange:function(e,t,i){null==i||i.stopPropagation(),p?e?k(f?"productSelected":"variantSelected",{productId:y,variantId:j,collectionId:I,variant:h}):x({type:f?"productUnselected":"variantUnselected",data:{productId:y,variantId:j,collectionId:I}}):e?k("productSelected",{productId:y,collectionId:I,product:h}):x({type:"productUnselected",data:{productId:y,collectionId:I}})}}):e.jsx(e.Fragment,{}),e.jsx("div",{children:e.jsx(r.ShimmerImage,{width:40,height:40,imageUrl:h.image,alt:"Item",borderRadius:4})}),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",flex:1}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:16}},{children:[e.jsx(d.Tooltip,Object.assign({variant:"light",body:h.name,placement:"bottom",delay:400},{children:e.jsx(l.TitleSmall,Object.assign({style:{flex:1},numberOfLines:1},{children:h.name}))})),e.jsxs(u.ProductInfo,{children:[e.jsx(s.ProductPickerTag,{isVariant:q,data:w,tagText:A,tagType:U}),D&&e.jsx(c.IconButton,{onClick:()=>{null==T||T(h)},Icon:()=>e.jsx(i.default,{width:20,height:20,color:t.COLORS.content.placeholder})})]})]})),e.jsxs(u.ProductSubTitle,{children:[!(null==w?void 0:w.fbStatus)&&q||A?null:e.jsx(l.BodyCaption,Object.assign({color:t.COLORS.content.secondary},{children:V})),B&&e.jsx(d.Tooltip,Object.assign({body:B,placement:"top"},{children:e.jsx(u.SKUIDBadge,{children:e.jsx(u.EllipsedBodyTiny,{children:`SKU ID: ${B}`})})}))]})]}))]}))};exports.ProductCard=p,exports.ProductGroup=t=>{var i,o,c,r,d,l,a,s,u;const{collectionId:h,productId:y,data:I,selectedData:j,selectedCollectionsDispatch:P,viewOnly:x,upliftAdditions:g,isProductPartiallyChecked:k,hideProductCheckbox:C,outOfStockAction:b,hideVariantCheckbox:O,hideProductVariants:S,pickerType:f,onProductDetailClick:m,showProductDetailInfoIcon:T}=t,D=e=>{var t,i,o,c,r,d;if(!(null===(i=null===(t=null==j?void 0:j[h])||void 0===t?void 0:t.products)||void 0===i?void 0:i[y]))return!1;return!!(null===(d=null===(r=null===(c=null===(o=null==j?void 0:j[h])||void 0===o?void 0:o.products)||void 0===c?void 0:c[y])||void 0===r?void 0:r.variants)||void 0===d?void 0:d[e])},V=S||!v.shouldShowVariant(I)?`${I.currency&&null!==(i=n.CurrencySymbols[I.currency])&&void 0!==i?i:""}${null!==(u=null!==(d=null===(r=null===(c=Object.values(null!==(o=I.variants)&&void 0!==o?o:{}))||void 0===c?void 0:c[0])||void 0===r?void 0:r.price)&&void 0!==d?d:null===(s=null===(a=Object.values(null!==(l=I.variants)&&void 0!==l?l:{}))||void 0===a?void 0:a[0])||void 0===s?void 0:s.actualPrice)&&void 0!==u?u:""}`:"";return e.jsxs("div",{children:[e.jsx(p,{isVariant:!1,data:I,productId:y,collectionId:h,isSelected:(()=>{var e,t;return!!(null===(t=null===(e=null==j?void 0:j[h])||void 0===e?void 0:e.products)||void 0===t?void 0:t[y])})(),isPartiallyChecked:k,selectedCollectionsDispatch:P,upliftAdditions:g,viewOnly:x,hideProductCheckbox:C,hideVariantCheckbox:O,hideProductVariants:S,pickerType:f,outOfStockAction:b,onProductDetailClick:m,showProductDetailInfoIcon:T,currencyAndPrice:V},y),S?null:v.shouldShowVariant(I)&&Object.keys(I.variants||[]).map((t=>{var i,o,c,r,d,l,a;const s=`${I.currency&&null!==(i=n.CurrencySymbols[I.currency])&&void 0!==i?i:""}${null!==(a=null!==(r=null===(c=null===(o=I.variants)||void 0===o?void 0:o[t])||void 0===c?void 0:c.price)&&void 0!==r?r:null===(l=null===(d=I.variants)||void 0===d?void 0:d[t])||void 0===l?void 0:l.actualPrice)&&void 0!==a?a:""}`;return e.jsx(p,{isVariant:!0,hideVariantCheckbox:O,data:Object.assign(Object.assign({},I.variants[t]),{currency:I.currency}),variantId:t,productId:y,viewOnly:x,upliftAdditions:g,collectionId:h,isSelected:D(t),selectedCollectionsDispatch:P,outOfStockAction:b,onProductDetailClick:m,showProductDetailInfoIcon:T,currencyAndPrice:s},t)}))]})};
@@ -1,4 +1,4 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("styled-components"),o=require("../../constants/Theme.js"),r=require("../../assets/icons/cross.svg.js"),i=require("../icon-button/IconButton.js"),a=require("../shimmer-image/ShimmerImage.js"),n=require("../TypographyStyle.js"),d=require("./constants.js"),c=require("./helpers/ProductHelper.js"),l=require("./ProductPickerTag.js"),u=require("./utility.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=s(t);const x=t=>{var r,i,s,p,x,v,g,f,h,b,D,P,I,S,O,k;const T=void 0===t.productData.variants;let q;if(T)q=`${t.productData.currency&&null!==(r=d.CurrencySymbols[t.productData.currency])&&void 0!==r?r:""}${null!==(x=null!==(s=null===(i=t.productData)||void 0===i?void 0:i.price)&&void 0!==s?s:null===(p=t.productData)||void 0===p?void 0:p.actualPrice)&&void 0!==x?x:""}`;else{const e=null===(v=t.productData)||void 0===v?void 0:v.currency;q=`${e&&null!==(g=d.CurrencySymbols[e])&&void 0!==g?g:""}${null!==(O=null!==(D=null===(b=null===(h=Object.values(null!==(f=t.productData.variants)&&void 0!==f?f:{}))||void 0===h?void 0:h[0])||void 0===b?void 0:b.price)&&void 0!==D?D:null===(S=null===(I=Object.values(null!==(P=t.productData.variants)&&void 0!==P?P:{}))||void 0===I?void 0:I[0])||void 0===S?void 0:S.actualPrice)&&void 0!==O?O:""}`}const{isVariantForProductPickerTag:C,dataForProductPickerTag:w,tagText:$,tagType:z}=c.ProductHelper.getDataForProductPickerTag(t.productData,T,t.outOfStockAction);return e.jsxs(m,{children:[e.jsx(y,{children:e.jsx(a.ShimmerImage,{useDynamicInfoImageSize:t.useDynamicInfoImageSize,imageUrl:t.productData.image,width:200,height:200,borderRadius:4})}),e.jsxs(j,{children:[e.jsx(n.TitleRegular,Object.assign({style:{display:"flex"}},{children:t.productData.name})),e.jsx(n.BodyCaption,Object.assign({color:o.COLORS.content.secondary},{children:`Product ID: ${t.productData.id}`})),e.jsx(n.BodyCaption,{className:"overlay-description",dangerouslySetInnerHTML:{__html:null!==(k=t.productData.description)&&void 0!==k?k:""}}),e.jsx(n.BodyCaption,Object.assign({color:o.COLORS.content.secondary},{children:T?q:u.shouldShowVariant(t.productData)?null:q})),e.jsx(l.ProductPickerTag,{isVariant:C,data:w,tagText:$,tagType:z})]})]})},v=p.default.div`
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("styled-components"),o=require("../../constants/Theme.js"),r=require("../../assets/icons/cross.svg.js"),i=require("../icon-button/IconButton.js"),a=require("../shimmer-image/ShimmerImage.js"),d=require("../tooltips/Tooltip.js"),n=require("../TypographyStyle.js"),l=require("./constants.js"),c=require("./helpers/ProductHelper.js"),s=require("./ProductPickerTag.js"),u=require("./style.js"),p=require("./utility.js");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var g=x(t);const v=t=>{var r,i,x,g,v,y,m,f,D,I,S,P,O,k,T,q;const C=void 0===t.productData.variants;let w;if(C)w=`${t.productData.currency&&null!==(r=l.CurrencySymbols[t.productData.currency])&&void 0!==r?r:""}${null!==(v=null!==(x=null===(i=t.productData)||void 0===i?void 0:i.price)&&void 0!==x?x:null===(g=t.productData)||void 0===g?void 0:g.actualPrice)&&void 0!==v?v:""}`;else{const e=null===(y=t.productData)||void 0===y?void 0:y.currency;w=`${e&&null!==(m=l.CurrencySymbols[e])&&void 0!==m?m:""}${null!==(T=null!==(S=null===(I=null===(D=Object.values(null!==(f=t.productData.variants)&&void 0!==f?f:{}))||void 0===D?void 0:D[0])||void 0===I?void 0:I.price)&&void 0!==S?S:null===(k=null===(O=Object.values(null!==(P=t.productData.variants)&&void 0!==P?P:{}))||void 0===O?void 0:O[0])||void 0===k?void 0:k.actualPrice)&&void 0!==T?T:""}`}const{isVariantForProductPickerTag:B,dataForProductPickerTag:$,tagText:z,tagType:R}=c.ProductHelper.getDataForProductPickerTag(t.productData,C,t.outOfStockAction);console.log({productData:t.productData});const L=p.getSkuId(t.productData,C);return e.jsxs(j,{children:[e.jsx(h,{children:e.jsx(a.ShimmerImage,{useDynamicInfoImageSize:t.useDynamicInfoImageSize,imageUrl:t.productData.image,width:200,height:200,borderRadius:4})}),e.jsxs(b,{children:[L&&e.jsx(d.Tooltip,Object.assign({body:L,placement:"top"},{children:e.jsx(u.SKUIDBadge,{children:e.jsx(u.EllipsedBodyTiny,{children:`SKU ID: ${L}`})})})),e.jsx(n.TitleRegular,Object.assign({style:{display:"flex"}},{children:t.productData.name})),e.jsx(n.BodyCaption,Object.assign({color:o.COLORS.content.secondary},{children:`Product ID: ${t.productData.id}`})),e.jsx(n.BodyCaption,{className:"overlay-description",dangerouslySetInnerHTML:{__html:null!==(q=t.productData.description)&&void 0!==q?q:""}}),e.jsx(n.BodyCaption,Object.assign({color:o.COLORS.content.secondary},{children:C?w:p.shouldShowVariant(t.productData)?null:w})),e.jsx(s.ProductPickerTag,{isVariant:B,data:$,tagText:z,tagType:R})]})]})},y=g.default.div`
2
2
  display: flex;
3
3
  flex: 1;
4
4
  background: rgba(0, 0, 0, 0.5);
@@ -17,11 +17,11 @@
17
17
  word-break: break-word;
18
18
  margin-top: 8px;
19
19
  }
20
- `,g=p.default.div`
20
+ `,m=g.default.div`
21
21
  display: flex;
22
22
  flex: 1;
23
23
  background: rgba(0, 0, 0, 0.5);
24
- `,f=p.default.div`
24
+ `,f=g.default.div`
25
25
  position: relative;
26
26
 
27
27
  .close-button {
@@ -32,21 +32,21 @@
32
32
  background: ${o.COLORS.surface.standard};
33
33
  border-radius: 50%;
34
34
  }
35
- `,m=p.default.div`
35
+ `,j=g.default.div`
36
36
  display: flex;
37
37
  background: white;
38
38
  padding: 24px;
39
39
  gap: 24px;
40
40
  border-radius: 8px 8px 0px 0px;
41
- `,y=p.default.div`
41
+ `,h=g.default.div`
42
42
  display: flex;
43
43
  max-width: min(50%, 200px);
44
44
  flex-direction: column;
45
45
  justify-content: center;
46
46
  align-items: center;
47
- `,j=p.default.div`
47
+ `,b=g.default.div`
48
48
  display: flex;
49
49
  flex: 1;
50
50
  flex-direction: column;
51
51
  gap: 4px;
52
- `;exports.ProductInfoCard=x,exports.ProductInfoOverlay=t=>e.jsxs(v,{children:[e.jsx(g,{}),e.jsx(f,{children:e.jsx(i.IconButton,{className:"close-button",onClick:t.onClose,Icon:r.default,width:20,height:20})}),e.jsx(x,{productData:t.productData,outOfStockAction:t.outOfStockAction,useDynamicInfoImageSize:t.useDynamicInfoImageSize})]});
52
+ `;exports.ProductInfoCard=v,exports.ProductInfoOverlay=t=>e.jsxs(y,{children:[e.jsx(m,{}),e.jsx(f,{children:e.jsx(i.IconButton,{className:"close-button",onClick:t.onClose,Icon:r.default,width:20,height:20})}),e.jsx(v,{productData:t.productData,outOfStockAction:t.outOfStockAction,useDynamicInfoImageSize:t.useDynamicInfoImageSize})]});
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_left.svg.js"),r=require("../../assets/icons/box.svg.js"),o=require("../../assets/icons/search.svg.js"),c=require("lodash"),s=require("react"),n=require("../../constants/Theme.js"),i=require("../checkBox/CheckBox.js"),l=require("../icon-button/IconButton.js"),d=require("../InfiniteScroll/InfiniteScroll.js"),u=require("../input/Input.js"),a=require("../spinner/Spinner.js"),h=require("../TypographyStyle.js"),p=require("./emptyState.js"),j=require("./product.js"),v=require("./ProductPickerShimmer.js"),g=require("./reducers.js"),y=require("./style.js"),O=require("./type.js"),b=require("./utility.js");exports.ProductsScreen=f=>{var k,C;const{data:P,collectionsDispatch:x,selectedData:S,selectedCollectionsDispatch:I,productFetcher:m,storeId:q,setScreen:A,setSaveDisabled:D,hideInCollectionSearch:E,customCollectionRestriction:T,hideProductCheckbox:R,outOfStockAction:V=O.OUT_OF_STOCK_ACTION.BLUR,hideVariantCheckbox:L=!1,selectProductsFromCustomCollection:F=!1,pickerType:w,hideProductVariants:B,fbStatusFetcher:_,onProductDetailClick:M,showProductDetailInfoIcon:U,scrollContainerRef:H}=f,J=s.useContext(g.CollectionIdContext),K=s.useRef(0),N=s.useRef(!1),[W,z]=s.useState(""),[G,Q]=s.useState(!1),[X,Y]=s.useState(P),Z=s.useRef(!0),$=s.useRef(!1);s.useEffect((()=>{if(Z.current)return void(Z.current=!1);const e=setTimeout((()=>{W.length?(Q(!0),f.searchInCollectionFetcher(q,J,W).then((e=>{const t=c.cloneDeep(P);t.products=e,Y(t);const r=b.getVariantIdsToFetchAtProductLevel(null!=e?e:{});te(r,null!=e?e:{},!0),D(!1),Q(!1)}))):Y(P)}),800);return()=>clearTimeout(e)}),[W]);s.useEffect((()=>{var e,t,r,o;$.current=!1,K.current=Math.floor((null===(t=Object.keys(null!==(e=P.products)&&void 0!==e?e:{}))||void 0===t?void 0:t.length)/10);const c=b.getVariantIdsToFetchAtProductLevel(null!==(r=P.products)&&void 0!==r?r:{});te(c,null!==(o=P.products)&&void 0!==o?o:{})}),[J]);const ee=!!T&&P.isSmartCollection;s.useEffect((()=>{(null==P?void 0:P.products)||re(10)}),[]);const te=(e,t,r)=>{_||(r?b.markVariantsAsApprovedProductsLevel(t,x,J,X,Y):b.markVariantsAsApprovedProductsLevel(t,x,J)),e.length>0&&_&&_(q,e).then((e=>{const o=Object.assign({},t);Object.keys(t).forEach((r=>{var c,s;Object.keys(null!==(s=null===(c=null==t?void 0:t[r])||void 0===c?void 0:c.variants)&&void 0!==s?s:{}).forEach((c=>{var s,n;const i=null===(s=null==t?void 0:t[r].variants)||void 0===s?void 0:s[c];i&&"REJECTED"===e[c]?i.fbStatus="REJECTED":i&&"APPROVED"===e[c]&&(i.fbStatus="APPROVED");const l=null===(n=null==o?void 0:o[r])||void 0===n?void 0:n.variants;l&&l[c]&&(l[c]=i)}))})),r?(Y((e=>{const t=Object.assign({},e);return t.products=o,t})),x({type:"productsPaged",data:{collectionId:J,products:o}})):x({type:"productsPaged",data:{collectionId:J,products:o}})})).catch((e=>{r?b.markVariantsAsApprovedProductsLevel(t,x,J,X,Y):b.markVariantsAsApprovedProductsLevel(t,x,J)}))},re=e=>{D(!0),Q(!0),m(J,q,e,0).then((t=>{if(Object.keys(t).length||($.current=!0),Object.keys(t).length){Y(Object.assign(Object.assign({},X),{products:t}));const e=b.getVariantIdsToFetchAtProductLevel(t);te(e,t),K.current=1}e||I({type:"selected",data:{id:J,val:Object.assign(Object.assign({},P),{products:t})}}),D(!1),Q(!1)})).catch()},oe=(e,t)=>{const r=b.liftTheStateUp(t,P);I({type:e,data:Object.assign(Object.assign({},r),{isRestricted:T})})},ce=!!(null==S?void 0:S[J])&&!!Object.keys(null!==(C=null===(k=null==S?void 0:S[J])||void 0===k?void 0:k.products)&&void 0!==C?C:{}).length;return e.jsxs("div",{children:[e.jsxs(y.ProductScreenHeader,{children:[e.jsx(l.IconButton,{Icon:t.default,height:16,onClick:()=>{A("collections")}}),e.jsx(h.BodyCaption,Object.assign({style:{color:n.COLORS.content.secondary}},{children:P.name}))]}),!E&&e.jsx("div",Object.assign({style:{padding:16,height:"76px",borderBottom:"1px solid #E0E0E0"}},{children:e.jsx(u.Input,{noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>G&&W.length?e.jsx(a.Spinner,{size:"small",color:n.COLORS.content.primary}):e.jsx(o.default,{})},id:"listInput",height:"24px",type:"text",value:W,onChangeText:e=>{e.length&&e.trim().length?z(e):z("")},placeholder:"Search for a product or type a product ID"})})),Object.keys((null==X?void 0:X.products)||[]).length>0&&!ee&&!W.length&&!R&&"-1"!==J&&e.jsxs(y.ProductScreenCollectionCardStyle,{children:[e.jsx(i.CheckBox,{isChecked:ce,isPartiallyChecked:b.isCollectionPartiallyChecked(J,X,S,B),onValueChange:function(e){e?re():I({type:"unselected",data:{id:J}})}}),e.jsx("div",Object.assign({style:{width:40,height:40}},{children:e.jsx(r.default,{})})),e.jsx(h.TitleRegular,{children:"All Products"})]}),e.jsx(d.InfiniteScroll,Object.assign({hasData:!(Object.keys((null==X?void 0:X.products)||[]).length<10)&&!!Object.keys((null==X?void 0:X.products)||[]).length,fetchMore:()=>(N.current=!0,m(J,q,10,K.current).then((e=>{let t=!1;if(Object.keys(e).length||(t=!0),Object.keys(e).length){const t=X;t.products=Object.assign(Object.assign({},X.products),e),Y(Object.assign({},t));const r=b.getVariantIdsToFetchAtProductLevel(e);te(r,e)}return D(!1),N.current=!1,K.current+=1,t}))),containerRef:H},{children:Object.keys((null==X?void 0:X.products)||[]).length?Object.keys(X.products||[]).map((t=>e.jsx(j.ProductGroup,{outOfStockAction:V,collectionId:J,isProductPartiallyChecked:b.isProductPartiallyChecked(J,t,S,X,B),productId:t,data:X.products[t],selectedData:S,selectedCollectionsDispatch:I,viewOnly:!F&&!!ee,upliftAdditions:oe,hideProductCheckbox:R,hideVariantCheckbox:L,hideProductVariants:B,pickerType:w,onProductDetailClick:M,showProductDetailInfoIcon:U},t))):G?e.jsx(v.ProductPickerShimmer,{limit:10}):e.jsx(p.EmptyState,{title:"No products to show",subtitle:W.length?"We couldn't find the product you were looking for":"We couldn’t find any product in this collection."})}))]})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_left.svg.js"),o=require("../../assets/icons/box.svg.js"),c=require("../../assets/icons/search.svg.js"),r=require("lodash"),s=require("react"),n=require("../../constants/Theme.js"),i=require("../checkBox/CheckBox.js"),l=require("../icon-button/IconButton.js"),d=require("../InfiniteScroll/InfiniteScroll.js"),u=require("../input/Input.js"),a=require("../spinner/Spinner.js"),h=require("../TypographyStyle.js"),p=require("./emptyState.js"),j=require("./product.js"),v=require("./ProductPickerShimmer.js"),g=require("./reducers.js"),y=require("./style.js"),O=require("./type.js"),b=require("./utility.js");exports.ProductsScreen=f=>{var k,C;const{data:P,collectionsDispatch:x,selectedData:S,selectedCollectionsDispatch:I,productFetcher:m,storeId:q,setScreen:A,setSaveDisabled:D,hideInCollectionSearch:E,customCollectionRestriction:T,hideProductCheckbox:R,outOfStockAction:V=O.OUT_OF_STOCK_ACTION.BLUR,hideVariantCheckbox:L=!1,selectProductsFromCustomCollection:F=!1,pickerType:w,hideProductVariants:B,fbStatusFetcher:_,onProductDetailClick:U,showProductDetailInfoIcon:K,scrollContainerRef:M}=f,H=s.useContext(g.CollectionIdContext),J=s.useRef(0),N=s.useRef(!1),[W,z]=s.useState(""),[G,Q]=s.useState(!1),[X,Y]=s.useState(P),Z=s.useRef(!0),$=s.useRef(!1);s.useEffect((()=>{if(Z.current)return void(Z.current=!1);const e=setTimeout((()=>{W.length?(Q(!0),f.searchInCollectionFetcher(q,H,W).then((e=>{const t=r.cloneDeep(P);t.products=e,console.log({products:e}),Y(t);const o=b.getVariantIdsToFetchAtProductLevel(null!=e?e:{});te(o,null!=e?e:{},!0),D(!1),Q(!1)}))):Y(P)}),800);return()=>clearTimeout(e)}),[W]);s.useEffect((()=>{var e,t,o,c;$.current=!1,J.current=Math.floor((null===(t=Object.keys(null!==(e=P.products)&&void 0!==e?e:{}))||void 0===t?void 0:t.length)/10);const r=b.getVariantIdsToFetchAtProductLevel(null!==(o=P.products)&&void 0!==o?o:{});te(r,null!==(c=P.products)&&void 0!==c?c:{})}),[H]);const ee=!!T&&P.isSmartCollection;s.useEffect((()=>{(null==P?void 0:P.products)||oe(10)}),[]);const te=(e,t,o)=>{_||(o?b.markVariantsAsApprovedProductsLevel(t,x,H,X,Y):b.markVariantsAsApprovedProductsLevel(t,x,H)),e.length>0&&_&&_(q,e).then((e=>{const c=Object.assign({},t);Object.keys(t).forEach((o=>{var r,s;Object.keys(null!==(s=null===(r=null==t?void 0:t[o])||void 0===r?void 0:r.variants)&&void 0!==s?s:{}).forEach((r=>{var s,n;const i=null===(s=null==t?void 0:t[o].variants)||void 0===s?void 0:s[r];i&&"REJECTED"===e[r]?i.fbStatus="REJECTED":i&&"APPROVED"===e[r]&&(i.fbStatus="APPROVED");const l=null===(n=null==c?void 0:c[o])||void 0===n?void 0:n.variants;l&&l[r]&&(l[r]=i)}))})),o?(Y((e=>{const t=Object.assign({},e);return t.products=c,t})),x({type:"productsPaged",data:{collectionId:H,products:c}})):x({type:"productsPaged",data:{collectionId:H,products:c}})})).catch((e=>{o?b.markVariantsAsApprovedProductsLevel(t,x,H,X,Y):b.markVariantsAsApprovedProductsLevel(t,x,H)}))},oe=e=>{D(!0),Q(!0),m(H,q,e,0).then((t=>{if(Object.keys(t).length||($.current=!0),Object.keys(t).length){Y(Object.assign(Object.assign({},X),{products:t}));const e=b.getVariantIdsToFetchAtProductLevel(t);te(e,t),J.current=1}e||I({type:"selected",data:{id:H,val:Object.assign(Object.assign({},P),{products:t})}}),D(!1),Q(!1)})).catch()},ce=(e,t)=>{const o=b.liftTheStateUp(t,P);I({type:e,data:Object.assign(Object.assign({},o),{isRestricted:T})})},re=!!(null==S?void 0:S[H])&&!!Object.keys(null!==(C=null===(k=null==S?void 0:S[H])||void 0===k?void 0:k.products)&&void 0!==C?C:{}).length;return e.jsxs("div",{children:[e.jsxs(y.ProductScreenHeader,{children:[e.jsx(l.IconButton,{Icon:t.default,height:16,onClick:()=>{A("collections")}}),e.jsx(h.BodyCaption,Object.assign({style:{color:n.COLORS.content.secondary}},{children:P.name}))]}),!E&&e.jsx("div",Object.assign({style:{padding:16,height:"76px",borderBottom:"1px solid #E0E0E0"}},{children:e.jsx(u.Input,{noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>G&&W.length?e.jsx(a.Spinner,{size:"small",color:n.COLORS.content.primary}):e.jsx(c.default,{})},id:"listInput",height:"24px",type:"text",value:W,onChangeText:e=>{e.length&&e.trim().length?z(e):z("")},placeholder:"Search products using name or SKU ID"})})),Object.keys((null==X?void 0:X.products)||[]).length>0&&!ee&&!W.length&&!R&&"-1"!==H&&e.jsxs(y.ProductScreenCollectionCardStyle,{children:[e.jsx(i.CheckBox,{isChecked:re,isPartiallyChecked:b.isCollectionPartiallyChecked(H,X,S,B),onValueChange:function(e){e?oe():I({type:"unselected",data:{id:H}})}}),e.jsx("div",Object.assign({style:{width:40,height:40}},{children:e.jsx(o.default,{})})),e.jsx(h.TitleRegular,{children:"All Products"})]}),e.jsx(d.InfiniteScroll,Object.assign({hasData:!(Object.keys((null==X?void 0:X.products)||[]).length<10)&&!!Object.keys((null==X?void 0:X.products)||[]).length,fetchMore:()=>(N.current=!0,m(H,q,10,J.current).then((e=>{let t=!1;if(Object.keys(e).length||(t=!0),Object.keys(e).length){const t=X;t.products=Object.assign(Object.assign({},X.products),e),Y(Object.assign({},t));const o=b.getVariantIdsToFetchAtProductLevel(e);te(o,e)}return D(!1),N.current=!1,J.current+=1,t}))),containerRef:M},{children:Object.keys((null==X?void 0:X.products)||[]).length?Object.keys(X.products||[]).map((t=>e.jsx(j.ProductGroup,{outOfStockAction:V,collectionId:H,isProductPartiallyChecked:b.isProductPartiallyChecked(H,t,S,X,B),productId:t,data:X.products[t],selectedData:S,selectedCollectionsDispatch:I,viewOnly:!F&&!!ee,upliftAdditions:ce,hideProductCheckbox:R,hideVariantCheckbox:L,hideProductVariants:B,pickerType:w,onProductDetailClick:U,showProductDetailInfoIcon:K},t))):G?e.jsx(v.ProductPickerShimmer,{limit:10}):e.jsx(p.EmptyState,{title:"No products to show",subtitle:W.length?"We couldn't find the product you were looking for":"We couldn’t find any product in this collection."})}))]})};
@@ -23,3 +23,14 @@ export declare const VariantCardListStyle: import("styled-components").StyledCom
23
23
  export declare const VariantCardGridStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
24
24
  export declare const StyledHeaderRightIcon: import("styled-components").StyledComponent<"div", any, {}, never>;
25
25
  export declare const StyledFooterForNonModal: import("styled-components").StyledComponent<"div", any, {}, never>;
26
+ export declare const SKUIDBadge: import("styled-components").StyledComponent<"div", any, {}, never>;
27
+ export declare const EllipsedBodyTiny: import("styled-components").StyledComponent<"div", any, {
28
+ numberOfLines?: number | undefined;
29
+ color?: string | undefined;
30
+ }, never>;
31
+ export declare const ProductSubTitle: import("styled-components").StyledComponent<"div", any, {}, never>;
32
+ export declare const ProductInfo: import("styled-components").StyledComponent<"div", any, {}, never>;
33
+ export declare const StyledTitleSmall: import("styled-components").StyledComponent<"div", any, {
34
+ numberOfLines?: number | undefined;
35
+ color?: string | undefined;
36
+ }, never>;