@undp/data-viz 2.0.9 → 2.1.1

package/dist/GriddedGraphs.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./index-CHPV5EwG-CTPQjnHt.cjs"),i=require("react"),ae=require("./index-CyZ1lmi_.cjs"),G=require("./index-BS2TADPj.cjs"),u=require("./checkIfMultiple-wg6hJLXy.cjs"),te=require("./Spinner-DRMBUsX7.cjs"),m=require("./DropdownSelect-Doz3mCrM.cjs"),le=require("./GraphContainer-d8A46BK2.cjs"),oe=require("./GraphEl-BcKU0bG1.cjs"),S=require("./fetchAndParseData-l5HGMAEs.cjs"),re=require("./Colors.cjs"),H=require("./transformDataForAggregation-XNg0OGYE.cjs"),W=require("./getUniqValue-NX8DgwND.cjs"),ne=require("./GraphHeader.cjs"),ie=require("./GraphFooter.cjs"),z=require("./filterData-T5DQBE9b.cjs"),se=require("./ColorLegend.cjs"),ue=require("./checkIfNullOrUndefined-BCW3Y1ML.cjs"),B=require("./transformDataForSelect-YmStusCI.cjs");function ce(J){const{graphSettings:t,dataSettings:n,filters:T,graphType:$,dataTransform:D,graphDataConfiguration:s,noOfColumns:y,columnGridBy:E,dataFilters:q,showCommonColorScale:A,minGraphHeight:K,minGraphWidth:F,debugMode:b,dataSelectionOptions:O,advancedDataSelectionOptions:k,readableHeader:Q,noOfFiltersPerRow:f=4,uiMode:d="normal",theme:X="light"}=J,[v,Y]=i.useState(void 0),[g,Z]=i.useState(void 0),[j,_]=i.useState([]),M=i.useRef(null),[x,C]=i.useState(s),[w,L]=i.useState([]),[h,R]=i.useState({}),N=i.useMemo(()=>({ignoreCase:!0,ignoreAccents:!0,trim:!0}),[]),P=i.useMemo(()=>!g||w.length===0?g:g.filter(r=>w.every(a=>a.value&&G.flattenDeep([a.value]).length>0?ae.intersection(G.flattenDeep([r[a.filter]]),G.flattenDeep([a.value]).map(l=>l.value)).length>0:!0)),[w,g]);i.useEffect(()=>{Y(P)},[P]);const U=i.useEffectEvent(()=>{const e=(T||[]).map(r=>({filter:r.column,label:r.label||`Filter by ${r.column}`,singleSelect:r.singleSelect,clearable:r.clearable,ui:r.ui,defaultValue:B.transformDefaultValue(r.defaultValue),value:B.transformDefaultValue(r.defaultValue),availableValues:W.getUniqValue(g,r.column).filter(a=>!r.excludeValues?.includes(`${a}`)).map(a=>({value:a,label:a})),allowSelectAll:r.allowSelectAll,width:r.width}));L(e)});i.useEffect(()=>{(async()=>{try{const r=n.dataURL?typeof n.dataURL=="string"?n.fileType==="json"?await S.fetchAndParseJSON(n.dataURL,n.columnsToArray,n.dataTransformation,b):n.fileType==="api"?await S.fetchAndTransformDataFromAPI(n.dataURL,n.apiHeaders,n.columnsToArray,n.dataTransformation,b):await S.fetchAndParseCSV(n.dataURL,n.dataTransformation,n.columnsToArray,b,n.delimiter,!0):await S.fetchAndParseMultipleDataSources(n.dataURL,n.idColumnTitle):await S.transformColumnsToArray(n.data,n.columnsToArray);Z(r)}catch(r){console.error("Data fetching error:",r)}})(),U()},[n,b]),i.useEffect(()=>{U()},[T,g]);const ee=i.useEffectEvent(()=>{const e=W.getUniqValue(g,E);_(e)});i.useEffect(()=>{ee()},[E,g]),i.useEffect(()=>{C(s)},[s]);const I=i.useCallback((e,r)=>{L(a=>a.map(l=>l.filter===e?{...l,value:r}:l))},[]);return o.jsxRuntimeExports.jsxs(le.GraphContainer,{className:t?.classNames?.graphContainer,style:t?.styles?.graphContainer,id:t?.graphID,ref:M,"aria-label":t?.ariaLabel||"This is a gridded graph",backgroundColor:t?.backgroundColor??!1,theme:t?.theme||"light",language:t?.language||"en",width:t?.width,height:t?.height,padding:t?.padding,children:[h?.graphTitle||h?.graphDescription||t?.graphTitle||t?.graphDescription||t?.graphDownload||t?.dataDownload?o.jsxRuntimeExports.jsx(ne.GraphHeader,{styles:{title:h?.styles?.title||t?.styles?.title,description:h?.styles?.description||t?.styles?.description},classNames:{title:h?.classNames?.title||t?.classNames?.title,description:h?.classNames?.description||t?.classNames?.description},graphTitle:h?.graphTitle||t?.graphTitle,graphDescription:h?.graphDescription||t?.graphDescription,width:h?.width||t?.width,graphDownload:t?.graphDownload?M:void 0,dataDownload:t?.dataDownload&&v&&v.length>0?v:null}):null,v&&j.length>0?o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[w.length!==0||(O||[]).length!==0||(k||[]).length!==0?o.jsxRuntimeExports.jsxs("div",{className:"flex flex-wrap items-start gap-x-4 gap-y-0 w-full",children:[k?.map((e,r)=>o.jsxRuntimeExports.jsxs("div",{style:{width:e.width||`calc(${100/f}% - ${(f-1)/f}rem)`,flexGrow:1,flexShrink:e.ui!=="radio"?0:1,minWidth:"240px"},className:"pb-4",children:[o.jsxRuntimeExports.jsx(u.b,{className:"mb-2",children:e.label||"Graph by"}),e.ui!=="radio"?o.jsxRuntimeExports.jsx(m.ja,{options:e.options.map(a=>({...a,value:a.label})),isClearable:!1,isSearchable:!0,variant:d,controlShouldRenderValue:!0,defaultValue:e.defaultValue?{...e.defaultValue,value:e.defaultValue?.label}:{...e.options[0],value:e.options[0].label},onChange:a=>{R(a?.graphSettings||{}),C(a?.dataConfiguration)}}):o.jsxRuntimeExports.jsx(u.ye,{defaultValue:e.defaultValue?.label||e.options[0].label,variant:d,onValueChange:a=>{const l=e.options[e.options.findIndex(p=>p.label===a)];R(l.graphSettings||{}),C(l.dataConfiguration)},children:e.options.map((a,l)=>o.jsxRuntimeExports.jsx(u.he,{label:a.label,value:a.label},l))})]},r)),O?.map((e,r)=>o.jsxRuntimeExports.jsxs("div",{style:{width:e.width||`calc(${100/f}% - ${(f-1)/f}rem)`,flexGrow:1,flexShrink:e.ui!=="radio"?0:1,minWidth:"240px"},className:"pb-4",children:[o.jsxRuntimeExports.jsx(u.b,{className:"mb-2",children:e.label||`Visualize ${e.chartConfigId} by`}),u.checkIfMultiple(e.chartConfigId,x||[])?e.ui!=="radio"?o.jsxRuntimeExports.jsx(m.ja,{options:e.allowedColumnIds,isMulti:!0,variant:d,isSearchable:!0,controlShouldRenderValue:!0,defaultValue:s?s[s.findIndex(a=>a.chartConfigId===e.chartConfigId)].columnId.map(a=>e.allowedColumnIds[e.allowedColumnIds.findIndex(l=>l.value===a)]):void 0,filterOption:m.Du(N),onChange:a=>{const l={columnId:a.map(c=>c.value),chartConfigId:e.chartConfigId},p=x?.map(c=>c.chartConfigId===l.chartConfigId?l:c);C(p)},isRtl:t?.language==="ar"||t?.language==="he"}):o.jsxRuntimeExports.jsx(u.$,{variant:d,defaultValue:s?s[s.findIndex(a=>a.chartConfigId===e.chartConfigId)].columnId.map(a=>e.allowedColumnIds[e.allowedColumnIds.findIndex(l=>l.value===a)]).map(a=>a.value):[],onValueChange:a=>{const l={columnId:a||[],chartConfigId:e.chartConfigId},p=x?.map(c=>c.chartConfigId===l.chartConfigId?l:c);C(p)},children:e.allowedColumnIds.map((a,l)=>o.jsxRuntimeExports.jsx(u.P,{label:a.label,value:a.label},l))}):e.ui!=="radio"?o.jsxRuntimeExports.jsx(m.ja,{options:e.allowedColumnIds,isClearable:!1,isSearchable:!0,variant:d,defaultValue:s?e.allowedColumnIds[e.allowedColumnIds.findIndex(a=>a.value===s[s.findIndex(l=>l.chartConfigId===e.chartConfigId)].columnId)]:void 0,controlShouldRenderValue:!0,onChange:a=>{const l={columnId:a?.value,chartConfigId:e.chartConfigId},p=x?.map(c=>c.chartConfigId===l.chartConfigId?l:c);R(a?.graphSettings||{}),C(p)}}):o.jsxRuntimeExports.jsx(u.ye,{variant:d,defaultValue:s?e.allowedColumnIds[e.allowedColumnIds.findIndex(a=>a.value===s[s.findIndex(l=>l.chartConfigId===e.chartConfigId)].columnId)].label:"",onValueChange:a=>{const l=e.allowedColumnIds[e.allowedColumnIds.findIndex(V=>V.label===a)],p={columnId:l.value,chartConfigId:e.chartConfigId},c=x?.map(V=>V.chartConfigId===p.chartConfigId?p:V);R(l.graphSettings||{}),C(c)},children:e.allowedColumnIds.map((a,l)=>o.jsxRuntimeExports.jsx(u.he,{label:a.label,value:a.label},l))})]},r)),w?.map((e,r)=>o.jsxRuntimeExports.jsxs("div",{style:{width:e.width||`calc(${100/f}% - ${(f-1)/f}rem)`,flexGrow:1,flexShrink:0,flexWrap:"wrap"},className:"pb-4",children:[o.jsxRuntimeExports.jsx(u.b,{className:"mb-2",children:e.label}),e.singleSelect?e.ui!=="radio"?o.jsxRuntimeExports.jsx(m.ja,{options:e.availableValues,variant:d,isClearable:e.clearable===void 0?!0:e.clearable,isSearchable:!0,controlShouldRenderValue:!0,filterOption:m.Du(N),onChange:a=>{I(e.filter,a)},value:e.value,defaultValue:e.defaultValue}):o.jsxRuntimeExports.jsx(u.ye,{variant:d,defaultValue:e.defaultValue.value,onValueChange:a=>{I(e.filter,e.availableValues.filter(l=>l.value===a))},children:e.availableValues.map((a,l)=>o.jsxRuntimeExports.jsx(u.he,{label:`${a.label}`,value:`${a.value}`},l))}):o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[e.ui!=="radio"?o.jsxRuntimeExports.jsx(m.ja,{options:e.availableValues,variant:d,size:"sm",isMulti:!0,isClearable:e.clearable===void 0?!0:e.clearable,isSearchable:!0,controlShouldRenderValue:!0,filterOption:m.Du(N),onChange:a=>{I(e.filter,a)},value:e.value,defaultValue:e.defaultValue}):o.jsxRuntimeExports.jsx(u.$,{variant:d,defaultValue:e.defaultValue?e.defaultValue.map(a=>`${a.value}`):[],value:e.value?e.value.map(a=>`${a.value}`):void 0,onValueChange:a=>{I(e.filter,e.availableValues.filter(l=>a.indexOf(`${l.value}`)!==-1))},children:e.availableValues.map((a,l)=>o.jsxRuntimeExports.jsx(u.P,{label:`${a.label}`,value:`${a.value}`},l))}),e.allowSelectAll?o.jsxRuntimeExports.jsx("button",{type:"button",className:"bg-transparent border-0 p-0 mt-2 cursor-pointer text-primary-blue-600 dark:text-primary-blue-400",onClick:()=>{I(e.filter,e.availableValues)},children:"Select all options"}):null]})]},r))]}):null,A!==!1&&t?.showColorScale!==!1?o.jsxRuntimeExports.jsx(se.ColorLegend,{width:t?.width,colorLegendTitle:t?.colorLegendTitle,colors:t?.colors||t?.lineColors||re.Colors[t?.theme||"light"].categoricalColors.colors,colorDomain:t?.colorDomain||t?.labels||[],showNAColor:t?.showNAColor===void 0||t?.showNAColor===null?!0:t?.showNAColor}):null,o.jsxRuntimeExports.jsx("div",{className:`flex flex-wrap gap-4 justify-center ${t?.language==="ar"||t?.language==="he"?"flex-row-reverse":"flex-row"}`,children:j.map((e,r)=>o.jsxRuntimeExports.jsx("div",{style:{width:`calc(${100/(y||Math.min(4,j.length||0))}% - ${((y||Math.min(4,j.length||0))-1)/(y||Math.min(4,j.length||0))}rem)`,minWidth:ue.checkIfNullOrUndefined(F)?"280px":`${F}px`},children:o.jsxRuntimeExports.jsx(oe.GraphEl,{graph:$,graphDataConfiguration:x,graphData:H.transformDataForGraph(D?H.transformDataForAggregation(z.filterData(v,q||[]).filter(a=>a[E]===e),D.keyColumn,D.aggregationColumnsSetting):z.filterData(v,q||[]).filter(a=>a[E]===e),$,x)||[],debugMode:b,settings:{...t||{},...h,theme:t?.theme||X,width:void 0,height:void 0,relativeHeight:t?.relativeHeight||.67,minHeight:K,graphTitle:`${e}`,graphDescription:void 0,graphDownload:!1,dataDownload:!1,backgroundColor:void 0,padding:"0",footNote:void 0,sources:void 0,showColorScale:t?.showColorScale===!1?!1:A===!1},readableHeader:Q||[]})},r))})]}):o.jsxRuntimeExports.jsx("div",{className:"w-full flex justify-center p-4",children:o.jsxRuntimeExports.jsx(te.w,{})}),t?.sources||t?.footNote?o.jsxRuntimeExports.jsx(ie.GraphFooter,{styles:{footnote:t?.styles?.footnote,source:t?.styles?.source},classNames:{footnote:t?.classNames?.footnote,source:t?.classNames?.source},sources:t?.sources,footNote:t?.footNote,width:t?.width}):null]})}exports.GriddedGraphs=ce;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./index-CHPV5EwG-CTPQjnHt.cjs"),i=require("react"),ae=require("./index-CyZ1lmi_.cjs"),G=require("./index-BS2TADPj.cjs"),u=require("./checkIfMultiple-wg6hJLXy.cjs"),te=require("./Spinner-DRMBUsX7.cjs"),m=require("./DropdownSelect-Doz3mCrM.cjs"),le=require("./GraphContainer-d8A46BK2.cjs"),oe=require("./GraphEl-B16EYkko.cjs"),S=require("./fetchAndParseData-l5HGMAEs.cjs"),re=require("./Colors.cjs"),H=require("./transformDataForAggregation-XNg0OGYE.cjs"),W=require("./getUniqValue-NX8DgwND.cjs"),ne=require("./GraphHeader.cjs"),ie=require("./GraphFooter.cjs"),z=require("./filterData-T5DQBE9b.cjs"),se=require("./ColorLegend.cjs"),ue=require("./checkIfNullOrUndefined-BCW3Y1ML.cjs"),B=require("./transformDataForSelect-YmStusCI.cjs");function ce(J){const{graphSettings:t,dataSettings:n,filters:T,graphType:$,dataTransform:D,graphDataConfiguration:s,noOfColumns:y,columnGridBy:E,dataFilters:q,showCommonColorScale:A,minGraphHeight:K,minGraphWidth:F,debugMode:w,dataSelectionOptions:O,advancedDataSelectionOptions:k,readableHeader:Q,noOfFiltersPerRow:f=4,uiMode:d="normal",theme:X="light"}=J,[v,Y]=i.useState(void 0),[g,Z]=i.useState(void 0),[b,_]=i.useState([]),M=i.useRef(null),[x,C]=i.useState(s),[j,L]=i.useState([]),[h,R]=i.useState({}),N=i.useMemo(()=>({ignoreCase:!0,ignoreAccents:!0,trim:!0}),[]),P=i.useMemo(()=>!g||j.length===0?g:g.filter(r=>j.every(a=>a.value&&G.flattenDeep([a.value]).length>0?ae.intersection(G.flattenDeep([r[a.filter]]),G.flattenDeep([a.value]).map(l=>l.value)).length>0:!0)),[j,g]);i.useEffect(()=>{Y(P)},[P]);const U=i.useEffectEvent(()=>{const e=(T||[]).map(r=>({filter:r.column,label:r.label||`Filter by ${r.column}`,singleSelect:r.singleSelect,clearable:r.clearable,ui:r.ui,defaultValue:B.transformDefaultValue(r.defaultValue),value:B.transformDefaultValue(r.defaultValue),availableValues:W.getUniqValue(g,r.column).filter(a=>!r.excludeValues?.includes(`${a}`)).map(a=>({value:a,label:a})),allowSelectAll:r.allowSelectAll,width:r.width}));L(e)});i.useEffect(()=>{(async()=>{try{const r=n.dataURL?typeof n.dataURL=="string"?n.fileType==="json"?await S.fetchAndParseJSON(n.dataURL,n.columnsToArray,n.dataTransformation,w):n.fileType==="api"?await S.fetchAndTransformDataFromAPI(n.dataURL,n.apiHeaders,n.columnsToArray,n.dataTransformation,w):await S.fetchAndParseCSV(n.dataURL,n.dataTransformation,n.columnsToArray,w,n.delimiter,!0):await S.fetchAndParseMultipleDataSources(n.dataURL,n.idColumnTitle):await S.transformColumnsToArray(n.data,n.columnsToArray);Z(r)}catch(r){console.error("Data fetching error:",r)}})(),U()},[n,w]),i.useEffect(()=>{U()},[T,g]);const ee=i.useEffectEvent(()=>{const e=W.getUniqValue(g,E);_(e)});i.useEffect(()=>{ee()},[E,g]),i.useEffect(()=>{C(s)},[s]);const I=i.useCallback((e,r)=>{L(a=>a.map(l=>l.filter===e?{...l,value:r}:l))},[]);return o.jsxRuntimeExports.jsxs(le.GraphContainer,{className:t?.classNames?.graphContainer,style:t?.styles?.graphContainer,id:t?.graphID,ref:M,"aria-label":t?.ariaLabel||"This is a gridded graph",backgroundColor:t?.backgroundColor??!1,theme:t?.theme||"light",language:t?.language||"en",width:t?.width,height:t?.height,padding:t?.padding,children:[h?.graphTitle||h?.graphDescription||t?.graphTitle||t?.graphDescription||t?.graphDownload||t?.dataDownload?o.jsxRuntimeExports.jsx(ne.GraphHeader,{styles:{title:h?.styles?.title||t?.styles?.title,description:h?.styles?.description||t?.styles?.description},classNames:{title:h?.classNames?.title||t?.classNames?.title,description:h?.classNames?.description||t?.classNames?.description},graphTitle:h?.graphTitle||t?.graphTitle,graphDescription:h?.graphDescription||t?.graphDescription,width:h?.width||t?.width,graphDownload:t?.graphDownload?M:void 0,dataDownload:t?.dataDownload&&v&&v.length>0?v:null}):null,v&&b.length>0?o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[j.length!==0||(O||[]).length!==0||(k||[]).length!==0?o.jsxRuntimeExports.jsxs("div",{className:"flex flex-wrap items-start gap-x-4 gap-y-0 w-full",children:[k?.map((e,r)=>o.jsxRuntimeExports.jsxs("div",{style:{width:e.width||`calc(${100/f}% - ${(f-1)/f}rem)`,flexGrow:e.width?0:1,flexShrink:e.ui!=="radio"||e.width?0:1,minWidth:"240px"},className:"pb-4",children:[o.jsxRuntimeExports.jsx(u.b,{className:"mb-2",children:e.label||"Graph by"}),e.ui!=="radio"?o.jsxRuntimeExports.jsx(m.ja,{options:e.options.map(a=>({...a,value:a.label})),isClearable:!1,isSearchable:!0,variant:d,controlShouldRenderValue:!0,defaultValue:e.defaultValue?{...e.defaultValue,value:e.defaultValue?.label}:{...e.options[0],value:e.options[0].label},onChange:a=>{R(a?.graphSettings||{}),C(a?.dataConfiguration)}}):o.jsxRuntimeExports.jsx(u.ye,{defaultValue:e.defaultValue?.label||e.options[0].label,variant:d,onValueChange:a=>{const l=e.options[e.options.findIndex(p=>p.label===a)];R(l.graphSettings||{}),C(l.dataConfiguration)},children:e.options.map((a,l)=>o.jsxRuntimeExports.jsx(u.he,{label:a.label,value:a.label},l))})]},r)),O?.map((e,r)=>o.jsxRuntimeExports.jsxs("div",{style:{width:e.width||`calc(${100/f}% - ${(f-1)/f}rem)`,flexGrow:e.width?0:1,flexShrink:e.ui!=="radio"||e.width?0:1,minWidth:"240px"},className:"pb-4",children:[o.jsxRuntimeExports.jsx(u.b,{className:"mb-2",children:e.label||`Visualize ${e.chartConfigId} by`}),u.checkIfMultiple(e.chartConfigId,x||[])?e.ui!=="radio"?o.jsxRuntimeExports.jsx(m.ja,{options:e.allowedColumnIds,isMulti:!0,variant:d,isSearchable:!0,controlShouldRenderValue:!0,defaultValue:s?s[s.findIndex(a=>a.chartConfigId===e.chartConfigId)].columnId.map(a=>e.allowedColumnIds[e.allowedColumnIds.findIndex(l=>l.value===a)]):void 0,filterOption:m.Du(N),onChange:a=>{const l={columnId:a.map(c=>c.value),chartConfigId:e.chartConfigId},p=x?.map(c=>c.chartConfigId===l.chartConfigId?l:c);C(p)},isRtl:t?.language==="ar"||t?.language==="he"}):o.jsxRuntimeExports.jsx(u.$,{variant:d,defaultValue:s?s[s.findIndex(a=>a.chartConfigId===e.chartConfigId)].columnId.map(a=>e.allowedColumnIds[e.allowedColumnIds.findIndex(l=>l.value===a)]).map(a=>a.value):[],onValueChange:a=>{const l={columnId:a||[],chartConfigId:e.chartConfigId},p=x?.map(c=>c.chartConfigId===l.chartConfigId?l:c);C(p)},children:e.allowedColumnIds.map((a,l)=>o.jsxRuntimeExports.jsx(u.P,{label:a.label,value:a.label},l))}):e.ui!=="radio"?o.jsxRuntimeExports.jsx(m.ja,{options:e.allowedColumnIds,isClearable:!1,isSearchable:!0,variant:d,defaultValue:s?e.allowedColumnIds[e.allowedColumnIds.findIndex(a=>a.value===s[s.findIndex(l=>l.chartConfigId===e.chartConfigId)].columnId)]:void 0,controlShouldRenderValue:!0,onChange:a=>{const l={columnId:a?.value,chartConfigId:e.chartConfigId},p=x?.map(c=>c.chartConfigId===l.chartConfigId?l:c);R(a?.graphSettings||{}),C(p)}}):o.jsxRuntimeExports.jsx(u.ye,{variant:d,defaultValue:s?e.allowedColumnIds[e.allowedColumnIds.findIndex(a=>a.value===s[s.findIndex(l=>l.chartConfigId===e.chartConfigId)].columnId)].label:"",onValueChange:a=>{const l=e.allowedColumnIds[e.allowedColumnIds.findIndex(V=>V.label===a)],p={columnId:l.value,chartConfigId:e.chartConfigId},c=x?.map(V=>V.chartConfigId===p.chartConfigId?p:V);R(l.graphSettings||{}),C(c)},children:e.allowedColumnIds.map((a,l)=>o.jsxRuntimeExports.jsx(u.he,{label:a.label,value:a.label},l))})]},r)),j?.map((e,r)=>o.jsxRuntimeExports.jsxs("div",{style:{width:e.width||`calc(${100/f}% - ${(f-1)/f}rem)`,flexGrow:e.width?0:1,flexShrink:e.ui!=="radio"||e.width?0:1,flexWrap:"wrap"},className:"pb-4",children:[o.jsxRuntimeExports.jsx(u.b,{className:"mb-2",children:e.label}),e.singleSelect?e.ui!=="radio"?o.jsxRuntimeExports.jsx(m.ja,{options:e.availableValues,variant:d,isClearable:e.clearable===void 0?!0:e.clearable,isSearchable:!0,controlShouldRenderValue:!0,filterOption:m.Du(N),onChange:a=>{I(e.filter,a)},value:e.value,defaultValue:e.defaultValue}):o.jsxRuntimeExports.jsx(u.ye,{variant:d,defaultValue:e.defaultValue.value,onValueChange:a=>{I(e.filter,e.availableValues.filter(l=>l.value===a))},children:e.availableValues.map((a,l)=>o.jsxRuntimeExports.jsx(u.he,{label:`${a.label}`,value:`${a.value}`},l))}):o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[e.ui!=="radio"?o.jsxRuntimeExports.jsx(m.ja,{options:e.availableValues,variant:d,size:"sm",isMulti:!0,isClearable:e.clearable===void 0?!0:e.clearable,isSearchable:!0,controlShouldRenderValue:!0,filterOption:m.Du(N),onChange:a=>{I(e.filter,a)},value:e.value,defaultValue:e.defaultValue}):o.jsxRuntimeExports.jsx(u.$,{variant:d,defaultValue:e.defaultValue?e.defaultValue.map(a=>`${a.value}`):[],value:e.value?e.value.map(a=>`${a.value}`):void 0,onValueChange:a=>{I(e.filter,e.availableValues.filter(l=>a.indexOf(`${l.value}`)!==-1))},children:e.availableValues.map((a,l)=>o.jsxRuntimeExports.jsx(u.P,{label:`${a.label}`,value:`${a.value}`},l))}),e.allowSelectAll?o.jsxRuntimeExports.jsx("button",{type:"button",className:"bg-transparent border-0 p-0 mt-2 cursor-pointer text-primary-blue-600 dark:text-primary-blue-400",onClick:()=>{I(e.filter,e.availableValues)},children:"Select all options"}):null]})]},r))]}):null,A!==!1&&t?.showColorScale!==!1?o.jsxRuntimeExports.jsx(se.ColorLegend,{width:t?.width,colorLegendTitle:t?.colorLegendTitle,colors:t?.colors||t?.lineColors||re.Colors[t?.theme||"light"].categoricalColors.colors,colorDomain:t?.colorDomain||t?.labels||[],showNAColor:t?.showNAColor===void 0||t?.showNAColor===null?!0:t?.showNAColor}):null,o.jsxRuntimeExports.jsx("div",{className:`flex flex-wrap gap-4 justify-center ${t?.language==="ar"||t?.language==="he"?"flex-row-reverse":"flex-row"}`,children:b.map((e,r)=>o.jsxRuntimeExports.jsx("div",{style:{width:`calc(${100/(y||Math.min(4,b.length||0))}% - ${((y||Math.min(4,b.length||0))-1)/(y||Math.min(4,b.length||0))}rem)`,minWidth:ue.checkIfNullOrUndefined(F)?"280px":`${F}px`},children:o.jsxRuntimeExports.jsx(oe.GraphEl,{graph:$,graphDataConfiguration:x,graphData:H.transformDataForGraph(D?H.transformDataForAggregation(z.filterData(v,q||[]).filter(a=>a[E]===e),D.keyColumn,D.aggregationColumnsSetting):z.filterData(v,q||[]).filter(a=>a[E]===e),$,x)||[],debugMode:w,settings:{...t||{},...h,theme:t?.theme||X,width:void 0,height:void 0,relativeHeight:t?.relativeHeight||.67,minHeight:K,graphTitle:`${e}`,graphDescription:void 0,graphDownload:!1,dataDownload:!1,backgroundColor:void 0,padding:"0",footNote:void 0,sources:void 0,showColorScale:t?.showColorScale===!1?!1:A===!1},readableHeader:Q||[]})},r))})]}):o.jsxRuntimeExports.jsx("div",{className:"w-full flex justify-center p-4",children:o.jsxRuntimeExports.jsx(te.w,{})}),t?.sources||t?.footNote?o.jsxRuntimeExports.jsx(ie.GraphFooter,{styles:{footnote:t?.styles?.footnote,source:t?.styles?.source},classNames:{footnote:t?.classNames?.footnote,source:t?.classNames?.source},sources:t?.sources,footNote:t?.footNote,width:t?.width}):null]})}exports.GriddedGraphs=ce;
 //# sourceMappingURL=GriddedGraphs.cjs.map

package/dist/GriddedGraphs.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"GriddedGraphs.cjs","sources":["../src/Components/Dashboard/GriddedGraphs.tsx"],"sourcesContent":["import { useCallback, useEffect, useEffectEvent, useMemo, useRef, useState } from 'react';\r\nimport intersection from 'lodash.intersection';\r\nimport flattenDeep from 'lodash.flattendeep';\r\nimport { CheckboxGroup, CheckboxGroupItem } from '@undp/design-system-react/CheckboxGroup';\r\nimport { Spinner } from '@undp/design-system-react/Spinner';\r\nimport { RadioGroup, RadioGroupItem } from '@undp/design-system-react/RadioGroup';\r\nimport { createFilter, DropdownSelect } from '@undp/design-system-react/DropdownSelect';\r\nimport { Label } from '@undp/design-system-react/Label';\r\n\r\nimport { GraphContainer } from '../Elements/GraphContainer';\r\n\r\nimport GraphEl from './GraphEl';\r\n\r\nimport {\r\n  AdvancedDataSelectionDataType,\r\n  AggregationSettingsDataType,\r\n  DataFilterDataType,\r\n  DataSelectionDataType,\r\n  DataSettingsDataType,\r\n  FilterSettingsDataType,\r\n  FilterUiSettingsDataType,\r\n  GraphConfigurationDataType,\r\n  GraphSettingsDataType,\r\n  GraphType,\r\n} from '@/Types';\r\nimport {\r\n  fetchAndParseCSV,\r\n  fetchAndParseJSON,\r\n  fetchAndParseMultipleDataSources,\r\n  fetchAndTransformDataFromAPI,\r\n} from '@/Utils/fetchAndParseData';\r\nimport { Colors } from '@/Components/ColorPalette';\r\nimport { transformColumnsToArray } from '@/Utils/transformData/transformColumnsToArray';\r\nimport { transformDataForGraph } from '@/Utils/transformData/transformDataForGraph';\r\nimport { getUniqValue } from '@/Utils/getUniqValue';\r\nimport { transformDataForAggregation } from '@/Utils/transformData/transformDataForAggregation';\r\nimport { GraphHeader } from '@/Components/Elements/GraphHeader';\r\nimport { GraphFooter } from '@/Components/Elements/GraphFooter';\r\nimport { filterData } from '@/Utils/transformData/filterData';\r\nimport { ColorLegend } from '@/Components/Elements/ColorLegend';\r\nimport { checkIfNullOrUndefined } from '@/Utils/checkIfNullOrUndefined';\r\nimport { checkIfMultiple } from '@/Utils/checkIfMultiple';\r\nimport { transformDefaultValue } from '@/Utils/transformDataForSelect';\r\n\r\ninterface Props {\r\n  noOfColumns?: number;\r\n  columnGridBy: string;\r\n  graphSettings?: GraphSettingsDataType;\r\n  dataSettings: DataSettingsDataType;\r\n  filters?: FilterUiSettingsDataType[];\r\n  noOfFiltersPerRow?: number;\r\n  graphType: Exclude<GraphType, 'geoHubMap' | 'geoHubCompareMap' | 'geoHubMapWithLayerSelection'>;\r\n  dataTransform?: {\r\n    keyColumn: string;\r\n    aggregationColumnsSetting?: AggregationSettingsDataType[];\r\n  };\r\n  showCommonColorScale?: boolean;\r\n  dataFilters?: DataFilterDataType[];\r\n  graphDataConfiguration?: GraphConfigurationDataType[];\r\n  dataSelectionOptions?: DataSelectionDataType[];\r\n  advancedDataSelectionOptions?: AdvancedDataSelectionDataType[];\r\n  minGraphHeight?: number;\r\n  minGraphWidth?: number;\r\n  debugMode?: boolean;\r\n  readableHeader?: {\r\n    value: string;\r\n    label: string;\r\n  }[];\r\n  uiMode?: 'light' | 'normal';\r\n  theme?: 'dark' | 'light';\r\n}\r\n\r\nexport function GriddedGraphs(props: Props) {\r\n  const {\r\n    graphSettings,\r\n    dataSettings,\r\n    filters,\r\n    graphType,\r\n    dataTransform,\r\n    graphDataConfiguration,\r\n    noOfColumns,\r\n    columnGridBy,\r\n    dataFilters,\r\n    showCommonColorScale,\r\n    minGraphHeight,\r\n    minGraphWidth,\r\n    debugMode,\r\n    dataSelectionOptions,\r\n    advancedDataSelectionOptions,\r\n    readableHeader,\r\n    noOfFiltersPerRow = 4,\r\n    uiMode = 'normal',\r\n    theme = 'light',\r\n  } = props;\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  const [data, setData] = useState<any>(undefined);\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  const [dataFromFile, setDataFromFile] = useState<any>(undefined);\r\n  const [gridOption, setGridOption] = useState<(string | number)[]>([]);\r\n  const graphParentDiv = useRef<HTMLDivElement>(null);\r\n  const [graphConfig, setGraphConfig] = useState<GraphConfigurationDataType[] | undefined>(\r\n    graphDataConfiguration,\r\n  );\r\n  const [filterSettings, setFilterSettings] = useState<FilterSettingsDataType[]>([]);\r\n  const [advancedGraphSettings, setAdvancedGraphSettings] = useState<GraphSettingsDataType>({});\r\n\r\n  const filterConfig = useMemo(\r\n    () => ({\r\n      ignoreCase: true,\r\n      ignoreAccents: true,\r\n      trim: true,\r\n    }),\r\n    [],\r\n  );\r\n\r\n  const filteredData = useMemo(() => {\r\n    if (!dataFromFile || filterSettings.length === 0) return dataFromFile;\r\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n    const result = dataFromFile.filter((item: any) =>\r\n      filterSettings.every(filter =>\r\n        filter.value && flattenDeep([filter.value]).length > 0\r\n          ? intersection(\r\n              flattenDeep([item[filter.filter]]),\r\n              flattenDeep([filter.value]).map(el => el.value),\r\n            ).length > 0\r\n          : true,\r\n      ),\r\n    );\r\n    return result;\r\n  }, [filterSettings, dataFromFile]);\r\n  useEffect(() => {\r\n    setData(filteredData);\r\n  }, [filteredData]);\r\n\r\n  const updateFiltersEvent = useEffectEvent(() => {\r\n    const filterSettingsTemp = (filters || []).map(el => ({\r\n      filter: el.column,\r\n      label: el.label || `Filter by ${el.column}`,\r\n      singleSelect: el.singleSelect,\r\n      clearable: el.clearable,\r\n      ui: el.ui,\r\n      defaultValue: transformDefaultValue(el.defaultValue),\r\n      value: transformDefaultValue(el.defaultValue),\r\n      availableValues: getUniqValue(dataFromFile, el.column)\r\n        .filter(v => !el.excludeValues?.includes(`${v}`))\r\n        .map(v => ({ value: v, label: v })),\r\n      allowSelectAll: el.allowSelectAll,\r\n      width: el.width,\r\n    }));\r\n    setFilterSettings(filterSettingsTemp);\r\n  });\r\n  useEffect(() => {\r\n    const fetchData = async () => {\r\n      try {\r\n        const fetchDataFromFile = dataSettings.dataURL\r\n          ? typeof dataSettings.dataURL === 'string'\r\n            ? dataSettings.fileType === 'json'\r\n              ? await fetchAndParseJSON(\r\n                  dataSettings.dataURL,\r\n                  dataSettings.columnsToArray,\r\n                  dataSettings.dataTransformation,\r\n                  debugMode,\r\n                )\r\n              : dataSettings.fileType === 'api'\r\n                ? await fetchAndTransformDataFromAPI(\r\n                    dataSettings.dataURL,\r\n                    dataSettings.apiHeaders,\r\n                    dataSettings.columnsToArray,\r\n                    dataSettings.dataTransformation,\r\n                    debugMode,\r\n                  )\r\n                : await fetchAndParseCSV(\r\n                    dataSettings.dataURL,\r\n                    dataSettings.dataTransformation,\r\n                    dataSettings.columnsToArray,\r\n                    debugMode,\r\n                    dataSettings.delimiter,\r\n                    true,\r\n                  )\r\n            : await fetchAndParseMultipleDataSources(\r\n                dataSettings.dataURL,\r\n                dataSettings.idColumnTitle,\r\n              )\r\n          : await transformColumnsToArray(dataSettings.data, dataSettings.columnsToArray);\r\n        setDataFromFile(fetchDataFromFile);\r\n      } catch (error) {\r\n        console.error('Data fetching error:', error);\r\n      }\r\n    };\r\n    fetchData();\r\n    updateFiltersEvent();\r\n  }, [dataSettings, debugMode]);\r\n  useEffect(() => {\r\n    updateFiltersEvent();\r\n  }, [filters, dataFromFile]);\r\n\r\n  const updateGridOptionEvent = useEffectEvent(() => {\r\n    const gridValue = getUniqValue(dataFromFile, columnGridBy) as (string | number)[];\r\n    setGridOption(gridValue);\r\n  });\r\n  useEffect(() => {\r\n    updateGridOptionEvent();\r\n  }, [columnGridBy, dataFromFile]);\r\n  useEffect(() => {\r\n    setGraphConfig(graphDataConfiguration);\r\n  }, [graphDataConfiguration]);\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  const handleFilterChange = useCallback((filter: string, values: any) => {\r\n    setFilterSettings(prev => prev.map(f => (f.filter === filter ? { ...f, value: values } : f)));\r\n  }, []);\r\n  return (\r\n    <GraphContainer\r\n      className={graphSettings?.classNames?.graphContainer}\r\n      style={graphSettings?.styles?.graphContainer}\r\n      id={graphSettings?.graphID}\r\n      ref={graphParentDiv}\r\n      aria-label={graphSettings?.ariaLabel || 'This is a gridded graph'}\r\n      backgroundColor={graphSettings?.backgroundColor ?? false}\r\n      theme={graphSettings?.theme || 'light'}\r\n      language={graphSettings?.language || 'en'}\r\n      width={graphSettings?.width}\r\n      height={graphSettings?.height}\r\n      padding={graphSettings?.padding}\r\n    >\r\n      {advancedGraphSettings?.graphTitle ||\r\n      advancedGraphSettings?.graphDescription ||\r\n      graphSettings?.graphTitle ||\r\n      graphSettings?.graphDescription ||\r\n      graphSettings?.graphDownload ||\r\n      graphSettings?.dataDownload ? (\r\n        <GraphHeader\r\n          styles={{\r\n            title: advancedGraphSettings?.styles?.title || graphSettings?.styles?.title,\r\n            description:\r\n              advancedGraphSettings?.styles?.description || graphSettings?.styles?.description,\r\n          }}\r\n          classNames={{\r\n            title: advancedGraphSettings?.classNames?.title || graphSettings?.classNames?.title,\r\n            description:\r\n              advancedGraphSettings?.classNames?.description ||\r\n              graphSettings?.classNames?.description,\r\n          }}\r\n          graphTitle={advancedGraphSettings?.graphTitle || graphSettings?.graphTitle}\r\n          graphDescription={\r\n            advancedGraphSettings?.graphDescription || graphSettings?.graphDescription\r\n          }\r\n          width={advancedGraphSettings?.width || graphSettings?.width}\r\n          graphDownload={graphSettings?.graphDownload ? graphParentDiv : undefined}\r\n          dataDownload={\r\n            graphSettings?.dataDownload && data ? (data.length > 0 ? data : null) : null\r\n          }\r\n        />\r\n      ) : null}\r\n      {data && gridOption.length > 0 ? (\r\n        <>\r\n          {filterSettings.length !== 0 ||\r\n          (dataSelectionOptions || []).length !== 0 ||\r\n          (advancedDataSelectionOptions || []).length !== 0 ? (\r\n            <div className='flex flex-wrap items-start gap-x-4 gap-y-0 w-full'>\r\n              {advancedDataSelectionOptions?.map((d, i) => (\r\n                <div\r\n                  style={{\r\n                    width:\r\n                      d.width ||\r\n                      `calc(${100 / noOfFiltersPerRow}% - ${\r\n                        (noOfFiltersPerRow - 1) / noOfFiltersPerRow\r\n                      }rem)`,\r\n                    flexGrow: 1,\r\n                    flexShrink: d.ui !== 'radio' ? 0 : 1,\r\n                    minWidth: '240px',\r\n                  }}\r\n                  className='pb-4'\r\n                  key={i}\r\n                >\r\n                  <Label className='mb-2'>{d.label || 'Graph by'}</Label>\r\n                  {d.ui !== 'radio' ? (\r\n                    <DropdownSelect\r\n                      options={d.options.map(opt => ({\r\n                        ...opt,\r\n                        value: opt.label,\r\n                      }))}\r\n                      isClearable={false}\r\n                      isSearchable\r\n                      variant={uiMode}\r\n                      controlShouldRenderValue\r\n                      defaultValue={\r\n                        d.defaultValue\r\n                          ? {\r\n                              ...d.defaultValue,\r\n                              value: d.defaultValue?.label,\r\n                            }\r\n                          : {\r\n                              ...d.options[0],\r\n                              value: d.options[0].label,\r\n                            }\r\n                      }\r\n                      // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n                      onChange={(el: any) => {\r\n                        setAdvancedGraphSettings(el?.graphSettings || {});\r\n                        setGraphConfig(el?.dataConfiguration);\r\n                      }}\r\n                    />\r\n                  ) : (\r\n                    <RadioGroup\r\n                      defaultValue={d.defaultValue?.label || d.options[0].label}\r\n                      variant={uiMode}\r\n                      onValueChange={el => {\r\n                        const selectedOption =\r\n                          d.options[d.options.findIndex(opt => opt.label === el)];\r\n                        setAdvancedGraphSettings(selectedOption.graphSettings || {});\r\n                        setGraphConfig(selectedOption.dataConfiguration);\r\n                      }}\r\n                    >\r\n                      {d.options.map((el, j) => (\r\n                        <RadioGroupItem label={el.label} value={el.label} key={j} />\r\n                      ))}\r\n                    </RadioGroup>\r\n                  )}\r\n                </div>\r\n              ))}\r\n              {dataSelectionOptions?.map((d, i) => (\r\n                <div\r\n                  style={{\r\n                    width:\r\n                      d.width ||\r\n                      `calc(${100 / noOfFiltersPerRow}% - ${\r\n                        (noOfFiltersPerRow - 1) / noOfFiltersPerRow\r\n                      }rem)`,\r\n                    flexGrow: 1,\r\n                    flexShrink: d.ui !== 'radio' ? 0 : 1,\r\n                    minWidth: '240px',\r\n                  }}\r\n                  className='pb-4'\r\n                  key={i}\r\n                >\r\n                  <Label className='mb-2'>{d.label || `Visualize ${d.chartConfigId} by`}</Label>\r\n                  {!checkIfMultiple(d.chartConfigId, graphConfig || []) ? (\r\n                    d.ui !== 'radio' ? (\r\n                      <DropdownSelect\r\n                        options={d.allowedColumnIds}\r\n                        isClearable={false}\r\n                        isSearchable\r\n                        variant={uiMode}\r\n                        defaultValue={\r\n                          graphDataConfiguration\r\n                            ? d.allowedColumnIds[\r\n                                d.allowedColumnIds.findIndex(\r\n                                  j =>\r\n                                    j.value ===\r\n                                    (graphDataConfiguration[\r\n                                      graphDataConfiguration.findIndex(\r\n                                        el => el.chartConfigId === d.chartConfigId,\r\n                                      )\r\n                                    ].columnId as string),\r\n                                )\r\n                              ]\r\n                            : undefined\r\n                        }\r\n                        controlShouldRenderValue\r\n                        // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n                        onChange={(el: any) => {\r\n                          const newGraphConfig = {\r\n                            columnId: el?.value as string,\r\n                            chartConfigId: d.chartConfigId,\r\n                          };\r\n                          const updatedConfig = graphConfig?.map(item =>\r\n                            item.chartConfigId === newGraphConfig.chartConfigId\r\n                              ? newGraphConfig\r\n                              : item,\r\n                          );\r\n                          setAdvancedGraphSettings(el?.graphSettings || {});\r\n                          setGraphConfig(updatedConfig);\r\n                        }}\r\n                      />\r\n                    ) : (\r\n                      <RadioGroup\r\n                        variant={uiMode}\r\n                        defaultValue={\r\n                          graphDataConfiguration\r\n                            ? d.allowedColumnIds[\r\n                                d.allowedColumnIds.findIndex(\r\n                                  j =>\r\n                                    j.value ===\r\n                                    (graphDataConfiguration[\r\n                                      graphDataConfiguration.findIndex(\r\n                                        el => el.chartConfigId === d.chartConfigId,\r\n                                      )\r\n                                    ].columnId as string),\r\n                                )\r\n                              ].label\r\n                            : ''\r\n                        }\r\n                        onValueChange={el => {\r\n                          const selectedOption =\r\n                            d.allowedColumnIds[\r\n                              d.allowedColumnIds.findIndex(opt => opt.label === el)\r\n                            ];\r\n                          const newGraphConfig = {\r\n                            columnId: selectedOption.value,\r\n                            chartConfigId: d.chartConfigId,\r\n                          };\r\n                          const updatedConfig = graphConfig?.map(item =>\r\n                            item.chartConfigId === newGraphConfig.chartConfigId\r\n                              ? newGraphConfig\r\n                              : item,\r\n                          );\r\n                          setAdvancedGraphSettings(selectedOption.graphSettings || {});\r\n                          setGraphConfig(updatedConfig);\r\n                        }}\r\n                      >\r\n                        {d.allowedColumnIds.map((el, j) => (\r\n                          <RadioGroupItem label={el.label} value={el.label} key={j} />\r\n                        ))}\r\n                      </RadioGroup>\r\n                    )\r\n                  ) : d.ui !== 'radio' ? (\r\n                    <DropdownSelect\r\n                      options={d.allowedColumnIds}\r\n                      isMulti\r\n                      variant={uiMode}\r\n                      isSearchable\r\n                      controlShouldRenderValue\r\n                      defaultValue={\r\n                        graphDataConfiguration\r\n                          ? (\r\n                              graphDataConfiguration[\r\n                                graphDataConfiguration.findIndex(\r\n                                  el => el.chartConfigId === d.chartConfigId,\r\n                                )\r\n                              ].columnId as string[]\r\n                            ).map(\r\n                              el =>\r\n                                d.allowedColumnIds[\r\n                                  d.allowedColumnIds.findIndex(j => j.value === el)\r\n                                ],\r\n                            )\r\n                          : undefined\r\n                      }\r\n                      filterOption={createFilter(filterConfig)}\r\n                      // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n                      onChange={(el: any) => {\r\n                        const newGraphConfig = {\r\n                          columnId: el.map(\r\n                            // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n                            (item: any) => item.value,\r\n                          ) as string[],\r\n                          chartConfigId: d.chartConfigId,\r\n                        };\r\n                        const updatedConfig = graphConfig?.map(item =>\r\n                          item.chartConfigId === newGraphConfig.chartConfigId\r\n                            ? newGraphConfig\r\n                            : item,\r\n                        );\r\n                        setGraphConfig(updatedConfig);\r\n                      }}\r\n                      isRtl={graphSettings?.language === 'ar' || graphSettings?.language === 'he'}\r\n                    />\r\n                  ) : (\r\n                    <CheckboxGroup\r\n                      variant={uiMode}\r\n                      defaultValue={\r\n                        graphDataConfiguration\r\n                          ? (\r\n                              graphDataConfiguration[\r\n                                graphDataConfiguration.findIndex(\r\n                                  el => el.chartConfigId === d.chartConfigId,\r\n                                )\r\n                              ].columnId as string[]\r\n                            )\r\n                              .map(\r\n                                el =>\r\n                                  d.allowedColumnIds[\r\n                                    d.allowedColumnIds.findIndex(j => j.value === el)\r\n                                  ],\r\n                              )\r\n                              .map(el => el.value)\r\n                          : []\r\n                      }\r\n                      onValueChange={el => {\r\n                        const newGraphConfig = {\r\n                          columnId: el || [],\r\n                          chartConfigId: d.chartConfigId,\r\n                        };\r\n                        const updatedConfig = graphConfig?.map(item =>\r\n                          item.chartConfigId === newGraphConfig.chartConfigId\r\n                            ? newGraphConfig\r\n                            : item,\r\n                        );\r\n                        setGraphConfig(updatedConfig);\r\n                      }}\r\n                    >\r\n                      {d.allowedColumnIds.map((el, j) => (\r\n                        <CheckboxGroupItem label={el.label} value={el.label} key={j} />\r\n                      ))}\r\n                    </CheckboxGroup>\r\n                  )}\r\n                </div>\r\n              ))}\r\n              {filterSettings?.map((d, i) => (\r\n                <div\r\n                  style={{\r\n                    width:\r\n                      d.width ||\r\n                      `calc(${100 / noOfFiltersPerRow}% - ${\r\n                        (noOfFiltersPerRow - 1) / noOfFiltersPerRow\r\n                      }rem)`,\r\n                    flexGrow: 1,\r\n                    flexShrink: 0,\r\n                    flexWrap: 'wrap',\r\n                  }}\r\n                  className='pb-4'\r\n                  key={i}\r\n                >\r\n                  <Label className='mb-2'>{d.label}</Label>\r\n                  {d.singleSelect ? (\r\n                    d.ui !== 'radio' ? (\r\n                      <DropdownSelect\r\n                        options={d.availableValues}\r\n                        variant={uiMode}\r\n                        isClearable={d.clearable === undefined ? true : d.clearable}\r\n                        isSearchable\r\n                        controlShouldRenderValue\r\n                        filterOption={createFilter(filterConfig)}\r\n                        onChange={el => {\r\n                          handleFilterChange(d.filter, el);\r\n                        }}\r\n                        value={d.value}\r\n                        defaultValue={d.defaultValue}\r\n                      />\r\n                    ) : (\r\n                      <RadioGroup\r\n                        variant={uiMode}\r\n                        defaultValue={(d.defaultValue as { value: string; label: string }).value}\r\n                        onValueChange={el => {\r\n                          handleFilterChange(\r\n                            d.filter,\r\n                            d.availableValues.filter(v => v.value === el),\r\n                          );\r\n                        }}\r\n                      >\r\n                        {d.availableValues.map((el, j) => (\r\n                          <RadioGroupItem label={`${el.label}`} value={`${el.value}`} key={j} />\r\n                        ))}\r\n                      </RadioGroup>\r\n                    )\r\n                  ) : (\r\n                    <>\r\n                      {d.ui !== 'radio' ? (\r\n                        <DropdownSelect\r\n                          options={d.availableValues}\r\n                          variant={uiMode}\r\n                          size='sm'\r\n                          isMulti\r\n                          isClearable={d.clearable === undefined ? true : d.clearable}\r\n                          isSearchable\r\n                          controlShouldRenderValue\r\n                          filterOption={createFilter(filterConfig)}\r\n                          onChange={el => {\r\n                            handleFilterChange(d.filter, el);\r\n                          }}\r\n                          value={d.value}\r\n                          defaultValue={d.defaultValue}\r\n                        />\r\n                      ) : (\r\n                        <CheckboxGroup\r\n                          variant={uiMode}\r\n                          defaultValue={\r\n                            d.defaultValue\r\n                              ? (\r\n                                  d.defaultValue as {\r\n                                    value: string | number;\r\n                                    label: string | number;\r\n                                  }[]\r\n                                ).map(el => `${el.value}`)\r\n                              : []\r\n                          }\r\n                          value={\r\n                            d.value\r\n                              ? (\r\n                                  d.value as {\r\n                                    value: string | number;\r\n                                    label: string | number;\r\n                                  }[]\r\n                                ).map(el => `${el.value}`)\r\n                              : undefined\r\n                          }\r\n                          onValueChange={el => {\r\n                            handleFilterChange(\r\n                              d.filter,\r\n                              d.availableValues.filter(v => el.indexOf(`${v.value}`) !== -1),\r\n                            );\r\n                          }}\r\n                        >\r\n                          {d.availableValues.map((el, j) => (\r\n                            <CheckboxGroupItem\r\n                              label={`${el.label}`}\r\n                              value={`${el.value}`}\r\n                              key={j}\r\n                            />\r\n                          ))}\r\n                        </CheckboxGroup>\r\n                      )}\r\n                      {d.allowSelectAll ? (\r\n                        <button\r\n                          type='button'\r\n                          className='bg-transparent border-0 p-0 mt-2 cursor-pointer text-primary-blue-600 dark:text-primary-blue-400'\r\n                          onClick={() => {\r\n                            handleFilterChange(d.filter, d.availableValues);\r\n                          }}\r\n                        >\r\n                          Select all options\r\n                        </button>\r\n                      ) : null}\r\n                    </>\r\n                  )}\r\n                </div>\r\n              ))}\r\n            </div>\r\n          ) : null}\r\n          {showCommonColorScale !== false && graphSettings?.showColorScale !== false ? (\r\n            <ColorLegend\r\n              width={graphSettings?.width}\r\n              colorLegendTitle={graphSettings?.colorLegendTitle}\r\n              colors={\r\n                (graphSettings?.colors as string[] | undefined) ||\r\n                (graphSettings?.lineColors as string[] | undefined) ||\r\n                Colors[(graphSettings?.theme as 'light' | 'dark' | undefined) || 'light']\r\n                  .categoricalColors.colors\r\n              }\r\n              colorDomain={graphSettings?.colorDomain || graphSettings?.labels || []}\r\n              showNAColor={\r\n                graphSettings?.showNAColor === undefined || graphSettings?.showNAColor === null\r\n                  ? true\r\n                  : graphSettings?.showNAColor\r\n              }\r\n            />\r\n          ) : null}\r\n          <div\r\n            className={`flex flex-wrap gap-4 justify-center ${graphSettings?.language === 'ar' || graphSettings?.language === 'he' ? 'flex-row-reverse' : 'flex-row'}`}\r\n          >\r\n            {gridOption.map((el, i) => (\r\n              <div\r\n                key={i}\r\n                style={{\r\n                  width: `calc(${\r\n                    100 / (noOfColumns || (Math.min(...[4, gridOption.length || 0]) as number))\r\n                  }% - ${\r\n                    ((noOfColumns || (Math.min(...[4, gridOption.length || 0]) as number)) - 1) /\r\n                    (noOfColumns || (Math.min(...[4, gridOption.length || 0]) as number))\r\n                  }rem)`,\r\n                  minWidth: checkIfNullOrUndefined(minGraphWidth) ? '280px' : `${minGraphWidth}px`,\r\n                }}\r\n              >\r\n                <GraphEl\r\n                  graph={graphType}\r\n                  graphDataConfiguration={graphConfig}\r\n                  graphData={\r\n                    transformDataForGraph(\r\n                      dataTransform\r\n                        ? transformDataForAggregation(\r\n                            filterData(data, dataFilters || []).filter(\r\n                              // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n                              (d: any) => d[columnGridBy] === el,\r\n                            ),\r\n                            dataTransform.keyColumn,\r\n                            dataTransform.aggregationColumnsSetting,\r\n                          )\r\n                        : filterData(data, dataFilters || []).filter(\r\n                            // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n                            (d: any) => d[columnGridBy] === el,\r\n                          ),\r\n                      graphType,\r\n                      graphConfig,\r\n                    ) || []\r\n                  }\r\n                  debugMode={debugMode}\r\n                  settings={{\r\n                    ...(graphSettings || {}),\r\n                    ...advancedGraphSettings,\r\n                    theme: graphSettings?.theme || theme,\r\n                    width: undefined,\r\n                    height: undefined,\r\n                    relativeHeight: graphSettings?.relativeHeight || 0.67,\r\n                    minHeight: minGraphHeight,\r\n                    graphTitle: `${el}`,\r\n                    graphDescription: undefined,\r\n                    graphDownload: false,\r\n                    dataDownload: false,\r\n                    backgroundColor: undefined,\r\n                    padding: '0',\r\n                    footNote: undefined,\r\n                    sources: undefined,\r\n                    showColorScale:\r\n                      graphSettings?.showColorScale === false\r\n                        ? false\r\n                        : showCommonColorScale === false,\r\n                  }}\r\n                  readableHeader={readableHeader || []}\r\n                />\r\n              </div>\r\n            ))}\r\n          </div>\r\n        </>\r\n      ) : (\r\n        <div className='w-full flex justify-center p-4'>\r\n          <Spinner />\r\n        </div>\r\n      )}\r\n      {graphSettings?.sources || graphSettings?.footNote ? (\r\n        <GraphFooter\r\n          styles={{\r\n            footnote: graphSettings?.styles?.footnote,\r\n            source: graphSettings?.styles?.source,\r\n          }}\r\n          classNames={{\r\n            footnote: graphSettings?.classNames?.footnote,\r\n            source: graphSettings?.classNames?.source,\r\n          }}\r\n          sources={graphSettings?.sources}\r\n          footNote={graphSettings?.footNote}\r\n          width={graphSettings?.width}\r\n        />\r\n      ) : null}\r\n    </GraphContainer>\r\n  );\r\n}\r\n"],"names":["GriddedGraphs","props","graphSettings","dataSettings","filters","graphType","dataTransform","graphDataConfiguration","noOfColumns","columnGridBy","dataFilters","showCommonColorScale","minGraphHeight","minGraphWidth","debugMode","dataSelectionOptions","advancedDataSelectionOptions","readableHeader","noOfFiltersPerRow","uiMode","theme","data","setData","useState","undefined","dataFromFile","setDataFromFile","gridOption","setGridOption","graphParentDiv","useRef","graphConfig","setGraphConfig","filterSettings","setFilterSettings","advancedGraphSettings","setAdvancedGraphSettings","filterConfig","useMemo","ignoreCase","ignoreAccents","trim","filteredData","length","filter","item","every","value","flattenDeep","intersection","map","el","useEffect","updateFiltersEvent","useEffectEvent","filterSettingsTemp","column","label","singleSelect","clearable","ui","defaultValue","transformDefaultValue","availableValues","getUniqValue","v","excludeValues","includes","allowSelectAll","width","fetchDataFromFile","dataURL","fileType","fetchAndParseJSON","columnsToArray","dataTransformation","fetchAndTransformDataFromAPI","apiHeaders","fetchAndParseCSV","delimiter","fetchAndParseMultipleDataSources","idColumnTitle","transformColumnsToArray","error","console","fetchData","updateGridOptionEvent","gridValue","handleFilterChange","useCallback","values","prev","f","GraphContainer","classNames","graphContainer","styles","graphID","ariaLabel","backgroundColor","language","height","padding","graphTitle","graphDescription","graphDownload","dataDownload","jsx","GraphHeader","title","description","jsxs","Fragment","d","i","flexGrow","flexShrink","minWidth","Label","DropdownSelect","options","opt","dataConfiguration","RadioGroup","selectedOption","findIndex","j","RadioGroupItem","chartConfigId","checkIfMultiple","allowedColumnIds","columnId","createFilter","newGraphConfig","updatedConfig","CheckboxGroup","CheckboxGroupItem","flexWrap","indexOf","showColorScale","ColorLegend","colorLegendTitle","colors","lineColors","Colors","categoricalColors","colorDomain","labels","showNAColor","Math","min","checkIfNullOrUndefined","GraphEl","transformDataForGraph","transformDataForAggregation","filterData","keyColumn","aggregationColumnsSetting","relativeHeight","minHeight","footNote","sources","Spinner","GraphFooter","footnote","source"],"mappings":"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"}
+{"version":3,"file":"GriddedGraphs.cjs","sources":["../src/Components/Dashboard/GriddedGraphs.tsx"],"sourcesContent":["import { useCallback, useEffect, useEffectEvent, useMemo, useRef, useState } from 'react';\r\nimport intersection from 'lodash.intersection';\r\nimport flattenDeep from 'lodash.flattendeep';\r\nimport { CheckboxGroup, CheckboxGroupItem } from '@undp/design-system-react/CheckboxGroup';\r\nimport { Spinner } from '@undp/design-system-react/Spinner';\r\nimport { RadioGroup, RadioGroupItem } from '@undp/design-system-react/RadioGroup';\r\nimport { createFilter, DropdownSelect } from '@undp/design-system-react/DropdownSelect';\r\nimport { Label } from '@undp/design-system-react/Label';\r\n\r\nimport { GraphContainer } from '../Elements/GraphContainer';\r\n\r\nimport GraphEl from './GraphEl';\r\n\r\nimport {\r\n  AdvancedDataSelectionDataType,\r\n  AggregationSettingsDataType,\r\n  DataFilterDataType,\r\n  DataSelectionDataType,\r\n  DataSettingsDataType,\r\n  FilterSettingsDataType,\r\n  FilterUiSettingsDataType,\r\n  GraphConfigurationDataType,\r\n  GraphSettingsDataType,\r\n  GraphType,\r\n} from '@/Types';\r\nimport {\r\n  fetchAndParseCSV,\r\n  fetchAndParseJSON,\r\n  fetchAndParseMultipleDataSources,\r\n  fetchAndTransformDataFromAPI,\r\n} from '@/Utils/fetchAndParseData';\r\nimport { Colors } from '@/Components/ColorPalette';\r\nimport { transformColumnsToArray } from '@/Utils/transformData/transformColumnsToArray';\r\nimport { transformDataForGraph } from '@/Utils/transformData/transformDataForGraph';\r\nimport { getUniqValue } from '@/Utils/getUniqValue';\r\nimport { transformDataForAggregation } from '@/Utils/transformData/transformDataForAggregation';\r\nimport { GraphHeader } from '@/Components/Elements/GraphHeader';\r\nimport { GraphFooter } from '@/Components/Elements/GraphFooter';\r\nimport { filterData } from '@/Utils/transformData/filterData';\r\nimport { ColorLegend } from '@/Components/Elements/ColorLegend';\r\nimport { checkIfNullOrUndefined } from '@/Utils/checkIfNullOrUndefined';\r\nimport { checkIfMultiple } from '@/Utils/checkIfMultiple';\r\nimport { transformDefaultValue } from '@/Utils/transformDataForSelect';\r\n\r\ninterface Props {\r\n  noOfColumns?: number;\r\n  columnGridBy: string;\r\n  graphSettings?: GraphSettingsDataType;\r\n  dataSettings: DataSettingsDataType;\r\n  filters?: FilterUiSettingsDataType[];\r\n  noOfFiltersPerRow?: number;\r\n  graphType: Exclude<GraphType, 'geoHubMap' | 'geoHubCompareMap' | 'geoHubMapWithLayerSelection'>;\r\n  dataTransform?: {\r\n    keyColumn: string;\r\n    aggregationColumnsSetting?: AggregationSettingsDataType[];\r\n  };\r\n  showCommonColorScale?: boolean;\r\n  dataFilters?: DataFilterDataType[];\r\n  graphDataConfiguration?: GraphConfigurationDataType[];\r\n  dataSelectionOptions?: DataSelectionDataType[];\r\n  advancedDataSelectionOptions?: AdvancedDataSelectionDataType[];\r\n  minGraphHeight?: number;\r\n  minGraphWidth?: number;\r\n  debugMode?: boolean;\r\n  readableHeader?: {\r\n    value: string;\r\n    label: string;\r\n  }[];\r\n  uiMode?: 'light' | 'normal';\r\n  theme?: 'dark' | 'light';\r\n}\r\n\r\nexport function GriddedGraphs(props: Props) {\r\n  const {\r\n    graphSettings,\r\n    dataSettings,\r\n    filters,\r\n    graphType,\r\n    dataTransform,\r\n    graphDataConfiguration,\r\n    noOfColumns,\r\n    columnGridBy,\r\n    dataFilters,\r\n    showCommonColorScale,\r\n    minGraphHeight,\r\n    minGraphWidth,\r\n    debugMode,\r\n    dataSelectionOptions,\r\n    advancedDataSelectionOptions,\r\n    readableHeader,\r\n    noOfFiltersPerRow = 4,\r\n    uiMode = 'normal',\r\n    theme = 'light',\r\n  } = props;\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  const [data, setData] = useState<any>(undefined);\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  const [dataFromFile, setDataFromFile] = useState<any>(undefined);\r\n  const [gridOption, setGridOption] = useState<(string | number)[]>([]);\r\n  const graphParentDiv = useRef<HTMLDivElement>(null);\r\n  const [graphConfig, setGraphConfig] = useState<GraphConfigurationDataType[] | undefined>(\r\n    graphDataConfiguration,\r\n  );\r\n  const [filterSettings, setFilterSettings] = useState<FilterSettingsDataType[]>([]);\r\n  const [advancedGraphSettings, setAdvancedGraphSettings] = useState<GraphSettingsDataType>({});\r\n\r\n  const filterConfig = useMemo(\r\n    () => ({\r\n      ignoreCase: true,\r\n      ignoreAccents: true,\r\n      trim: true,\r\n    }),\r\n    [],\r\n  );\r\n\r\n  const filteredData = useMemo(() => {\r\n    if (!dataFromFile || filterSettings.length === 0) return dataFromFile;\r\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n    const result = dataFromFile.filter((item: any) =>\r\n      filterSettings.every(filter =>\r\n        filter.value && flattenDeep([filter.value]).length > 0\r\n          ? intersection(\r\n              flattenDeep([item[filter.filter]]),\r\n              flattenDeep([filter.value]).map(el => el.value),\r\n            ).length > 0\r\n          : true,\r\n      ),\r\n    );\r\n    return result;\r\n  }, [filterSettings, dataFromFile]);\r\n  useEffect(() => {\r\n    setData(filteredData);\r\n  }, [filteredData]);\r\n\r\n  const updateFiltersEvent = useEffectEvent(() => {\r\n    const filterSettingsTemp = (filters || []).map(el => ({\r\n      filter: el.column,\r\n      label: el.label || `Filter by ${el.column}`,\r\n      singleSelect: el.singleSelect,\r\n      clearable: el.clearable,\r\n      ui: el.ui,\r\n      defaultValue: transformDefaultValue(el.defaultValue),\r\n      value: transformDefaultValue(el.defaultValue),\r\n      availableValues: getUniqValue(dataFromFile, el.column)\r\n        .filter(v => !el.excludeValues?.includes(`${v}`))\r\n        .map(v => ({ value: v, label: v })),\r\n      allowSelectAll: el.allowSelectAll,\r\n      width: el.width,\r\n    }));\r\n    setFilterSettings(filterSettingsTemp);\r\n  });\r\n  useEffect(() => {\r\n    const fetchData = async () => {\r\n      try {\r\n        const fetchDataFromFile = dataSettings.dataURL\r\n          ? typeof dataSettings.dataURL === 'string'\r\n            ? dataSettings.fileType === 'json'\r\n              ? await fetchAndParseJSON(\r\n                  dataSettings.dataURL,\r\n                  dataSettings.columnsToArray,\r\n                  dataSettings.dataTransformation,\r\n                  debugMode,\r\n                )\r\n              : dataSettings.fileType === 'api'\r\n                ? await fetchAndTransformDataFromAPI(\r\n                    dataSettings.dataURL,\r\n                    dataSettings.apiHeaders,\r\n                    dataSettings.columnsToArray,\r\n                    dataSettings.dataTransformation,\r\n                    debugMode,\r\n                  )\r\n                : await fetchAndParseCSV(\r\n                    dataSettings.dataURL,\r\n                    dataSettings.dataTransformation,\r\n                    dataSettings.columnsToArray,\r\n                    debugMode,\r\n                    dataSettings.delimiter,\r\n                    true,\r\n                  )\r\n            : await fetchAndParseMultipleDataSources(\r\n                dataSettings.dataURL,\r\n                dataSettings.idColumnTitle,\r\n              )\r\n          : await transformColumnsToArray(dataSettings.data, dataSettings.columnsToArray);\r\n        setDataFromFile(fetchDataFromFile);\r\n      } catch (error) {\r\n        console.error('Data fetching error:', error);\r\n      }\r\n    };\r\n    fetchData();\r\n    updateFiltersEvent();\r\n  }, [dataSettings, debugMode]);\r\n  useEffect(() => {\r\n    updateFiltersEvent();\r\n  }, [filters, dataFromFile]);\r\n\r\n  const updateGridOptionEvent = useEffectEvent(() => {\r\n    const gridValue = getUniqValue(dataFromFile, columnGridBy) as (string | number)[];\r\n    setGridOption(gridValue);\r\n  });\r\n  useEffect(() => {\r\n    updateGridOptionEvent();\r\n  }, [columnGridBy, dataFromFile]);\r\n  useEffect(() => {\r\n    setGraphConfig(graphDataConfiguration);\r\n  }, [graphDataConfiguration]);\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  const handleFilterChange = useCallback((filter: string, values: any) => {\r\n    setFilterSettings(prev => prev.map(f => (f.filter === filter ? { ...f, value: values } : f)));\r\n  }, []);\r\n  return (\r\n    <GraphContainer\r\n      className={graphSettings?.classNames?.graphContainer}\r\n      style={graphSettings?.styles?.graphContainer}\r\n      id={graphSettings?.graphID}\r\n      ref={graphParentDiv}\r\n      aria-label={graphSettings?.ariaLabel || 'This is a gridded graph'}\r\n      backgroundColor={graphSettings?.backgroundColor ?? false}\r\n      theme={graphSettings?.theme || 'light'}\r\n      language={graphSettings?.language || 'en'}\r\n      width={graphSettings?.width}\r\n      height={graphSettings?.height}\r\n      padding={graphSettings?.padding}\r\n    >\r\n      {advancedGraphSettings?.graphTitle ||\r\n      advancedGraphSettings?.graphDescription ||\r\n      graphSettings?.graphTitle ||\r\n      graphSettings?.graphDescription ||\r\n      graphSettings?.graphDownload ||\r\n      graphSettings?.dataDownload ? (\r\n        <GraphHeader\r\n          styles={{\r\n            title: advancedGraphSettings?.styles?.title || graphSettings?.styles?.title,\r\n            description:\r\n              advancedGraphSettings?.styles?.description || graphSettings?.styles?.description,\r\n          }}\r\n          classNames={{\r\n            title: advancedGraphSettings?.classNames?.title || graphSettings?.classNames?.title,\r\n            description:\r\n              advancedGraphSettings?.classNames?.description ||\r\n              graphSettings?.classNames?.description,\r\n          }}\r\n          graphTitle={advancedGraphSettings?.graphTitle || graphSettings?.graphTitle}\r\n          graphDescription={\r\n            advancedGraphSettings?.graphDescription || graphSettings?.graphDescription\r\n          }\r\n          width={advancedGraphSettings?.width || graphSettings?.width}\r\n          graphDownload={graphSettings?.graphDownload ? graphParentDiv : undefined}\r\n          dataDownload={\r\n            graphSettings?.dataDownload && data ? (data.length > 0 ? data : null) : null\r\n          }\r\n        />\r\n      ) : null}\r\n      {data && gridOption.length > 0 ? (\r\n        <>\r\n          {filterSettings.length !== 0 ||\r\n          (dataSelectionOptions || []).length !== 0 ||\r\n          (advancedDataSelectionOptions || []).length !== 0 ? (\r\n            <div className='flex flex-wrap items-start gap-x-4 gap-y-0 w-full'>\r\n              {advancedDataSelectionOptions?.map((d, i) => (\r\n                <div\r\n                  style={{\r\n                    width:\r\n                      d.width ||\r\n                      `calc(${100 / noOfFiltersPerRow}% - ${\r\n                        (noOfFiltersPerRow - 1) / noOfFiltersPerRow\r\n                      }rem)`,\r\n                    flexGrow: d.width ? 0 : 1,\r\n                    flexShrink: d.ui !== 'radio' || d.width ? 0 : 1,\r\n                    minWidth: '240px',\r\n                  }}\r\n                  className='pb-4'\r\n                  key={i}\r\n                >\r\n                  <Label className='mb-2'>{d.label || 'Graph by'}</Label>\r\n                  {d.ui !== 'radio' ? (\r\n                    <DropdownSelect\r\n                      options={d.options.map(opt => ({\r\n                        ...opt,\r\n                        value: opt.label,\r\n                      }))}\r\n                      isClearable={false}\r\n                      isSearchable\r\n                      variant={uiMode}\r\n                      controlShouldRenderValue\r\n                      defaultValue={\r\n                        d.defaultValue\r\n                          ? {\r\n                              ...d.defaultValue,\r\n                              value: d.defaultValue?.label,\r\n                            }\r\n                          : {\r\n                              ...d.options[0],\r\n                              value: d.options[0].label,\r\n                            }\r\n                      }\r\n                      // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n                      onChange={(el: any) => {\r\n                        setAdvancedGraphSettings(el?.graphSettings || {});\r\n                        setGraphConfig(el?.dataConfiguration);\r\n                      }}\r\n                    />\r\n                  ) : (\r\n                    <RadioGroup\r\n                      defaultValue={d.defaultValue?.label || d.options[0].label}\r\n                      variant={uiMode}\r\n                      onValueChange={el => {\r\n                        const selectedOption =\r\n                          d.options[d.options.findIndex(opt => opt.label === el)];\r\n                        setAdvancedGraphSettings(selectedOption.graphSettings || {});\r\n                        setGraphConfig(selectedOption.dataConfiguration);\r\n                      }}\r\n                    >\r\n                      {d.options.map((el, j) => (\r\n                        <RadioGroupItem label={el.label} value={el.label} key={j} />\r\n                      ))}\r\n                    </RadioGroup>\r\n                  )}\r\n                </div>\r\n              ))}\r\n              {dataSelectionOptions?.map((d, i) => (\r\n                <div\r\n                  style={{\r\n                    width:\r\n                      d.width ||\r\n                      `calc(${100 / noOfFiltersPerRow}% - ${\r\n                        (noOfFiltersPerRow - 1) / noOfFiltersPerRow\r\n                      }rem)`,\r\n                    flexGrow: d.width ? 0 : 1,\r\n                    flexShrink: d.ui !== 'radio' || d.width ? 0 : 1,\r\n                    minWidth: '240px',\r\n                  }}\r\n                  className='pb-4'\r\n                  key={i}\r\n                >\r\n                  <Label className='mb-2'>{d.label || `Visualize ${d.chartConfigId} by`}</Label>\r\n                  {!checkIfMultiple(d.chartConfigId, graphConfig || []) ? (\r\n                    d.ui !== 'radio' ? (\r\n                      <DropdownSelect\r\n                        options={d.allowedColumnIds}\r\n                        isClearable={false}\r\n                        isSearchable\r\n                        variant={uiMode}\r\n                        defaultValue={\r\n                          graphDataConfiguration\r\n                            ? d.allowedColumnIds[\r\n                                d.allowedColumnIds.findIndex(\r\n                                  j =>\r\n                                    j.value ===\r\n                                    (graphDataConfiguration[\r\n                                      graphDataConfiguration.findIndex(\r\n                                        el => el.chartConfigId === d.chartConfigId,\r\n                                      )\r\n                                    ].columnId as string),\r\n                                )\r\n                              ]\r\n                            : undefined\r\n                        }\r\n                        controlShouldRenderValue\r\n                        // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n                        onChange={(el: any) => {\r\n                          const newGraphConfig = {\r\n                            columnId: el?.value as string,\r\n                            chartConfigId: d.chartConfigId,\r\n                          };\r\n                          const updatedConfig = graphConfig?.map(item =>\r\n                            item.chartConfigId === newGraphConfig.chartConfigId\r\n                              ? newGraphConfig\r\n                              : item,\r\n                          );\r\n                          setAdvancedGraphSettings(el?.graphSettings || {});\r\n                          setGraphConfig(updatedConfig);\r\n                        }}\r\n                      />\r\n                    ) : (\r\n                      <RadioGroup\r\n                        variant={uiMode}\r\n                        defaultValue={\r\n                          graphDataConfiguration\r\n                            ? d.allowedColumnIds[\r\n                                d.allowedColumnIds.findIndex(\r\n                                  j =>\r\n                                    j.value ===\r\n                                    (graphDataConfiguration[\r\n                                      graphDataConfiguration.findIndex(\r\n                                        el => el.chartConfigId === d.chartConfigId,\r\n                                      )\r\n                                    ].columnId as string),\r\n                                )\r\n                              ].label\r\n                            : ''\r\n                        }\r\n                        onValueChange={el => {\r\n                          const selectedOption =\r\n                            d.allowedColumnIds[\r\n                              d.allowedColumnIds.findIndex(opt => opt.label === el)\r\n                            ];\r\n                          const newGraphConfig = {\r\n                            columnId: selectedOption.value,\r\n                            chartConfigId: d.chartConfigId,\r\n                          };\r\n                          const updatedConfig = graphConfig?.map(item =>\r\n                            item.chartConfigId === newGraphConfig.chartConfigId\r\n                              ? newGraphConfig\r\n                              : item,\r\n                          );\r\n                          setAdvancedGraphSettings(selectedOption.graphSettings || {});\r\n                          setGraphConfig(updatedConfig);\r\n                        }}\r\n                      >\r\n                        {d.allowedColumnIds.map((el, j) => (\r\n                          <RadioGroupItem label={el.label} value={el.label} key={j} />\r\n                        ))}\r\n                      </RadioGroup>\r\n                    )\r\n                  ) : d.ui !== 'radio' ? (\r\n                    <DropdownSelect\r\n                      options={d.allowedColumnIds}\r\n                      isMulti\r\n                      variant={uiMode}\r\n                      isSearchable\r\n                      controlShouldRenderValue\r\n                      defaultValue={\r\n                        graphDataConfiguration\r\n                          ? (\r\n                              graphDataConfiguration[\r\n                                graphDataConfiguration.findIndex(\r\n                                  el => el.chartConfigId === d.chartConfigId,\r\n                                )\r\n                              ].columnId as string[]\r\n                            ).map(\r\n                              el =>\r\n                                d.allowedColumnIds[\r\n                                  d.allowedColumnIds.findIndex(j => j.value === el)\r\n                                ],\r\n                            )\r\n                          : undefined\r\n                      }\r\n                      filterOption={createFilter(filterConfig)}\r\n                      // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n                      onChange={(el: any) => {\r\n                        const newGraphConfig = {\r\n                          columnId: el.map(\r\n                            // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n                            (item: any) => item.value,\r\n                          ) as string[],\r\n                          chartConfigId: d.chartConfigId,\r\n                        };\r\n                        const updatedConfig = graphConfig?.map(item =>\r\n                          item.chartConfigId === newGraphConfig.chartConfigId\r\n                            ? newGraphConfig\r\n                            : item,\r\n                        );\r\n                        setGraphConfig(updatedConfig);\r\n                      }}\r\n                      isRtl={graphSettings?.language === 'ar' || graphSettings?.language === 'he'}\r\n                    />\r\n                  ) : (\r\n                    <CheckboxGroup\r\n                      variant={uiMode}\r\n                      defaultValue={\r\n                        graphDataConfiguration\r\n                          ? (\r\n                              graphDataConfiguration[\r\n                                graphDataConfiguration.findIndex(\r\n                                  el => el.chartConfigId === d.chartConfigId,\r\n                                )\r\n                              ].columnId as string[]\r\n                            )\r\n                              .map(\r\n                                el =>\r\n                                  d.allowedColumnIds[\r\n                                    d.allowedColumnIds.findIndex(j => j.value === el)\r\n                                  ],\r\n                              )\r\n                              .map(el => el.value)\r\n                          : []\r\n                      }\r\n                      onValueChange={el => {\r\n                        const newGraphConfig = {\r\n                          columnId: el || [],\r\n                          chartConfigId: d.chartConfigId,\r\n                        };\r\n                        const updatedConfig = graphConfig?.map(item =>\r\n                          item.chartConfigId === newGraphConfig.chartConfigId\r\n                            ? newGraphConfig\r\n                            : item,\r\n                        );\r\n                        setGraphConfig(updatedConfig);\r\n                      }}\r\n                    >\r\n                      {d.allowedColumnIds.map((el, j) => (\r\n                        <CheckboxGroupItem label={el.label} value={el.label} key={j} />\r\n                      ))}\r\n                    </CheckboxGroup>\r\n                  )}\r\n                </div>\r\n              ))}\r\n              {filterSettings?.map((d, i) => (\r\n                <div\r\n                  style={{\r\n                    width:\r\n                      d.width ||\r\n                      `calc(${100 / noOfFiltersPerRow}% - ${\r\n                        (noOfFiltersPerRow - 1) / noOfFiltersPerRow\r\n                      }rem)`,\r\n                    flexGrow: d.width ? 0 : 1,\r\n                    flexShrink: d.ui !== 'radio' || d.width ? 0 : 1,\r\n                    flexWrap: 'wrap',\r\n                  }}\r\n                  className='pb-4'\r\n                  key={i}\r\n                >\r\n                  <Label className='mb-2'>{d.label}</Label>\r\n                  {d.singleSelect ? (\r\n                    d.ui !== 'radio' ? (\r\n                      <DropdownSelect\r\n                        options={d.availableValues}\r\n                        variant={uiMode}\r\n                        isClearable={d.clearable === undefined ? true : d.clearable}\r\n                        isSearchable\r\n                        controlShouldRenderValue\r\n                        filterOption={createFilter(filterConfig)}\r\n                        onChange={el => {\r\n                          handleFilterChange(d.filter, el);\r\n                        }}\r\n                        value={d.value}\r\n                        defaultValue={d.defaultValue}\r\n                      />\r\n                    ) : (\r\n                      <RadioGroup\r\n                        variant={uiMode}\r\n                        defaultValue={(d.defaultValue as { value: string; label: string }).value}\r\n                        onValueChange={el => {\r\n                          handleFilterChange(\r\n                            d.filter,\r\n                            d.availableValues.filter(v => v.value === el),\r\n                          );\r\n                        }}\r\n                      >\r\n                        {d.availableValues.map((el, j) => (\r\n                          <RadioGroupItem label={`${el.label}`} value={`${el.value}`} key={j} />\r\n                        ))}\r\n                      </RadioGroup>\r\n                    )\r\n                  ) : (\r\n                    <>\r\n                      {d.ui !== 'radio' ? (\r\n                        <DropdownSelect\r\n                          options={d.availableValues}\r\n                          variant={uiMode}\r\n                          size='sm'\r\n                          isMulti\r\n                          isClearable={d.clearable === undefined ? true : d.clearable}\r\n                          isSearchable\r\n                          controlShouldRenderValue\r\n                          filterOption={createFilter(filterConfig)}\r\n                          onChange={el => {\r\n                            handleFilterChange(d.filter, el);\r\n                          }}\r\n                          value={d.value}\r\n                          defaultValue={d.defaultValue}\r\n                        />\r\n                      ) : (\r\n                        <CheckboxGroup\r\n                          variant={uiMode}\r\n                          defaultValue={\r\n                            d.defaultValue\r\n                              ? (\r\n                                  d.defaultValue as {\r\n                                    value: string | number;\r\n                                    label: string | number;\r\n                                  }[]\r\n                                ).map(el => `${el.value}`)\r\n                              : []\r\n                          }\r\n                          value={\r\n                            d.value\r\n                              ? (\r\n                                  d.value as {\r\n                                    value: string | number;\r\n                                    label: string | number;\r\n                                  }[]\r\n                                ).map(el => `${el.value}`)\r\n                              : undefined\r\n                          }\r\n                          onValueChange={el => {\r\n                            handleFilterChange(\r\n                              d.filter,\r\n                              d.availableValues.filter(v => el.indexOf(`${v.value}`) !== -1),\r\n                            );\r\n                          }}\r\n                        >\r\n                          {d.availableValues.map((el, j) => (\r\n                            <CheckboxGroupItem\r\n                              label={`${el.label}`}\r\n                              value={`${el.value}`}\r\n                              key={j}\r\n                            />\r\n                          ))}\r\n                        </CheckboxGroup>\r\n                      )}\r\n                      {d.allowSelectAll ? (\r\n                        <button\r\n                          type='button'\r\n                          className='bg-transparent border-0 p-0 mt-2 cursor-pointer text-primary-blue-600 dark:text-primary-blue-400'\r\n                          onClick={() => {\r\n                            handleFilterChange(d.filter, d.availableValues);\r\n                          }}\r\n                        >\r\n                          Select all options\r\n                        </button>\r\n                      ) : null}\r\n                    </>\r\n                  )}\r\n                </div>\r\n              ))}\r\n            </div>\r\n          ) : null}\r\n          {showCommonColorScale !== false && graphSettings?.showColorScale !== false ? (\r\n            <ColorLegend\r\n              width={graphSettings?.width}\r\n              colorLegendTitle={graphSettings?.colorLegendTitle}\r\n              colors={\r\n                (graphSettings?.colors as string[] | undefined) ||\r\n                (graphSettings?.lineColors as string[] | undefined) ||\r\n                Colors[(graphSettings?.theme as 'light' | 'dark' | undefined) || 'light']\r\n                  .categoricalColors.colors\r\n              }\r\n              colorDomain={graphSettings?.colorDomain || graphSettings?.labels || []}\r\n              showNAColor={\r\n                graphSettings?.showNAColor === undefined || graphSettings?.showNAColor === null\r\n                  ? true\r\n                  : graphSettings?.showNAColor\r\n              }\r\n            />\r\n          ) : null}\r\n          <div\r\n            className={`flex flex-wrap gap-4 justify-center ${graphSettings?.language === 'ar' || graphSettings?.language === 'he' ? 'flex-row-reverse' : 'flex-row'}`}\r\n          >\r\n            {gridOption.map((el, i) => (\r\n              <div\r\n                key={i}\r\n                style={{\r\n                  width: `calc(${\r\n                    100 / (noOfColumns || (Math.min(...[4, gridOption.length || 0]) as number))\r\n                  }% - ${\r\n                    ((noOfColumns || (Math.min(...[4, gridOption.length || 0]) as number)) - 1) /\r\n                    (noOfColumns || (Math.min(...[4, gridOption.length || 0]) as number))\r\n                  }rem)`,\r\n                  minWidth: checkIfNullOrUndefined(minGraphWidth) ? '280px' : `${minGraphWidth}px`,\r\n                }}\r\n              >\r\n                <GraphEl\r\n                  graph={graphType}\r\n                  graphDataConfiguration={graphConfig}\r\n                  graphData={\r\n                    transformDataForGraph(\r\n                      dataTransform\r\n                        ? transformDataForAggregation(\r\n                            filterData(data, dataFilters || []).filter(\r\n                              // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n                              (d: any) => d[columnGridBy] === el,\r\n                            ),\r\n                            dataTransform.keyColumn,\r\n                            dataTransform.aggregationColumnsSetting,\r\n                          )\r\n                        : filterData(data, dataFilters || []).filter(\r\n                            // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n                            (d: any) => d[columnGridBy] === el,\r\n                          ),\r\n                      graphType,\r\n                      graphConfig,\r\n                    ) || []\r\n                  }\r\n                  debugMode={debugMode}\r\n                  settings={{\r\n                    ...(graphSettings || {}),\r\n                    ...advancedGraphSettings,\r\n                    theme: graphSettings?.theme || theme,\r\n                    width: undefined,\r\n                    height: undefined,\r\n                    relativeHeight: graphSettings?.relativeHeight || 0.67,\r\n                    minHeight: minGraphHeight,\r\n                    graphTitle: `${el}`,\r\n                    graphDescription: undefined,\r\n                    graphDownload: false,\r\n                    dataDownload: false,\r\n                    backgroundColor: undefined,\r\n                    padding: '0',\r\n                    footNote: undefined,\r\n                    sources: undefined,\r\n                    showColorScale:\r\n                      graphSettings?.showColorScale === false\r\n                        ? false\r\n                        : showCommonColorScale === false,\r\n                  }}\r\n                  readableHeader={readableHeader || []}\r\n                />\r\n              </div>\r\n            ))}\r\n          </div>\r\n        </>\r\n      ) : (\r\n        <div className='w-full flex justify-center p-4'>\r\n          <Spinner />\r\n        </div>\r\n      )}\r\n      {graphSettings?.sources || graphSettings?.footNote ? (\r\n        <GraphFooter\r\n          styles={{\r\n            footnote: graphSettings?.styles?.footnote,\r\n            source: graphSettings?.styles?.source,\r\n          }}\r\n          classNames={{\r\n            footnote: graphSettings?.classNames?.footnote,\r\n            source: graphSettings?.classNames?.source,\r\n          }}\r\n          sources={graphSettings?.sources}\r\n          footNote={graphSettings?.footNote}\r\n          width={graphSettings?.width}\r\n        />\r\n      ) : null}\r\n    </GraphContainer>\r\n  );\r\n}\r\n"],"names":["GriddedGraphs","props","graphSettings","dataSettings","filters","graphType","dataTransform","graphDataConfiguration","noOfColumns","columnGridBy","dataFilters","showCommonColorScale","minGraphHeight","minGraphWidth","debugMode","dataSelectionOptions","advancedDataSelectionOptions","readableHeader","noOfFiltersPerRow","uiMode","theme","data","setData","useState","undefined","dataFromFile","setDataFromFile","gridOption","setGridOption","graphParentDiv","useRef","graphConfig","setGraphConfig","filterSettings","setFilterSettings","advancedGraphSettings","setAdvancedGraphSettings","filterConfig","useMemo","ignoreCase","ignoreAccents","trim","filteredData","length","filter","item","every","value","flattenDeep","intersection","map","el","useEffect","updateFiltersEvent","useEffectEvent","filterSettingsTemp","column","label","singleSelect","clearable","ui","defaultValue","transformDefaultValue","availableValues","getUniqValue","v","excludeValues","includes","allowSelectAll","width","fetchDataFromFile","dataURL","fileType","fetchAndParseJSON","columnsToArray","dataTransformation","fetchAndTransformDataFromAPI","apiHeaders","fetchAndParseCSV","delimiter","fetchAndParseMultipleDataSources","idColumnTitle","transformColumnsToArray","error","console","fetchData","updateGridOptionEvent","gridValue","handleFilterChange","useCallback","values","prev","f","GraphContainer","classNames","graphContainer","styles","graphID","ariaLabel","backgroundColor","language","height","padding","graphTitle","graphDescription","graphDownload","dataDownload","jsx","GraphHeader","title","description","jsxs","Fragment","d","i","flexGrow","flexShrink","minWidth","Label","DropdownSelect","options","opt","dataConfiguration","RadioGroup","selectedOption","findIndex","j","RadioGroupItem","chartConfigId","checkIfMultiple","allowedColumnIds","columnId","createFilter","newGraphConfig","updatedConfig","CheckboxGroup","CheckboxGroupItem","flexWrap","indexOf","showColorScale","ColorLegend","colorLegendTitle","colors","lineColors","Colors","categoricalColors","colorDomain","labels","showNAColor","Math","min","checkIfNullOrUndefined","GraphEl","transformDataForGraph","transformDataForAggregation","filterData","keyColumn","aggregationColumnsSetting","relativeHeight","minHeight","footNote","sources","Spinner","GraphFooter","footnote","source"],"mappings":"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"}

package/dist/GriddedGraphs.d.ts

@@ -95,6 +95,7 @@ declare interface ClassNameObject {
     regLine?: string;
     dataCards?: string;
     colorLegend?: string;
+    modal?: string;
 }
 
 declare interface ColumnConfigurationDataType {
@@ -593,6 +594,7 @@ declare interface StyleObject {
     mouseOverLine?: React.CSSProperties;
     regLine?: React.CSSProperties;
     dataCards?: React.CSSProperties;
+    modal?: React.CSSProperties;
 }
 
 declare interface TimelineDataType {

package/dist/GriddedGraphs.js

@@ -2,14 +2,14 @@ import { j as o } from "./index-CHPV5EwG-Curnpaqc.js";
 import { useState as C, useRef as na, useMemo as B, useEffect as I, useEffectEvent as J, useCallback as sa } from "react";
 import { i as ua } from "./index-BuwmuDFJ.js";
 import { f as T } from "./index-EArKRVKg.js";
-import { b as $, y as A, h as F, c as ca, $ as K, P as Q } from "./checkIfMultiple-Y9iKaV_u.js";
+import { b as $, y as A, h as F, c as ca, $ as K, P as Q } from "./checkIfMultiple-CIRtG0KE.js";
 import { w as da } from "./Spinner-D7rnnwnA.js";
 import { j as V, D as O } from "./DropdownSelect-BbdPQa2k.js";
 import { G as ha } from "./GraphContainer-CRqzdKu2.js";
-import { G as fa } from "./GraphEl-CGq1EWRn.js";
+import { G as fa } from "./GraphEl-DEzobeOM.js";
 import { f as pa, a as ga, b as ma, c as Ca, t as va } from "./fetchAndParseData-BpqkBPQL.js";
-import { Colors as ba } from "./Colors.js";
-import { a as wa, t as xa } from "./transformDataForAggregation-DEU__LUl.js";
+import { Colors as wa } from "./Colors.js";
+import { a as ba, t as xa } from "./transformDataForAggregation-DEU__LUl.js";
 import { g as X } from "./getUniqValue-DsqSii6M.js";
 import { GraphHeader as Ia } from "./GraphHeader.js";
 import { GraphFooter as Va } from "./GraphFooter.js";
@@ -38,11 +38,11 @@ function qa(_) {
     noOfFiltersPerRow: h = 4,
     uiMode: u = "normal",
     theme: la = "light"
-  } = _, [m, ta] = C(void 0), [f, oa] = C(void 0), [b, ra] = C([]), P = na(null), [p, g] = C(n), [w, W] = C([]), [c, j] = C({}), G = B(() => ({
+  } = _, [m, ta] = C(void 0), [f, oa] = C(void 0), [w, ra] = C([]), P = na(null), [p, g] = C(n), [b, W] = C([]), [c, j] = C({}), G = B(() => ({
     ignoreCase: !0,
     ignoreAccents: !0,
     trim: !0
-  }), []), z = B(() => !f || w.length === 0 ? f : f.filter((r) => w.every((e) => e.value && T([e.value]).length > 0 ? ua(T([r[e.filter]]), T([e.value]).map((t) => t.value)).length > 0 : !0)), [w, f]);
+  }), []), z = B(() => !f || b.length === 0 ? f : f.filter((r) => b.every((e) => e.value && T([e.value]).length > 0 ? ua(T([r[e.filter]]), T([e.value]).map((t) => t.value)).length > 0 : !0)), [b, f]);
   I(() => {
     ta(z);
   }, [z]);
@@ -99,12 +99,12 @@ function qa(_) {
       title: c?.classNames?.title || l?.classNames?.title,
       description: c?.classNames?.description || l?.classNames?.description
     }, graphTitle: c?.graphTitle || l?.graphTitle, graphDescription: c?.graphDescription || l?.graphDescription, width: c?.width || l?.width, graphDownload: l?.graphDownload ? P : void 0, dataDownload: l?.dataDownload && m && m.length > 0 ? m : null }) : null,
-    m && b.length > 0 ? /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
-      w.length !== 0 || (U || []).length !== 0 || (E || []).length !== 0 ? /* @__PURE__ */ o.jsxs("div", { className: "flex flex-wrap items-start gap-x-4 gap-y-0 w-full", children: [
+    m && w.length > 0 ? /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+      b.length !== 0 || (U || []).length !== 0 || (E || []).length !== 0 ? /* @__PURE__ */ o.jsxs("div", { className: "flex flex-wrap items-start gap-x-4 gap-y-0 w-full", children: [
         E?.map((a, r) => /* @__PURE__ */ o.jsxs("div", { style: {
           width: a.width || `calc(${100 / h}% - ${(h - 1) / h}rem)`,
-          flexGrow: 1,
-          flexShrink: a.ui !== "radio" ? 0 : 1,
+          flexGrow: a.width ? 0 : 1,
+          flexShrink: a.ui !== "radio" || a.width ? 0 : 1,
           minWidth: "240px"
         }, className: "pb-4", children: [
           /* @__PURE__ */ o.jsx($, { className: "mb-2", children: a.label || "Graph by" }),
@@ -137,8 +137,8 @@ function qa(_) {
         ] }, r)),
         U?.map((a, r) => /* @__PURE__ */ o.jsxs("div", { style: {
           width: a.width || `calc(${100 / h}% - ${(h - 1) / h}rem)`,
-          flexGrow: 1,
-          flexShrink: a.ui !== "radio" ? 0 : 1,
+          flexGrow: a.width ? 0 : 1,
+          flexShrink: a.ui !== "radio" || a.width ? 0 : 1,
           minWidth: "240px"
         }, className: "pb-4", children: [
           /* @__PURE__ */ o.jsx($, { className: "mb-2", children: a.label || `Visualize ${a.chartConfigId} by` }),
@@ -195,10 +195,10 @@ function qa(_) {
             j(t.graphSettings || {}), g(s);
           }, children: a.allowedColumnIds.map((e, t) => /* @__PURE__ */ o.jsx(F, { label: e.label, value: e.label }, t)) })
         ] }, r)),
-        w?.map((a, r) => /* @__PURE__ */ o.jsxs("div", { style: {
+        b?.map((a, r) => /* @__PURE__ */ o.jsxs("div", { style: {
           width: a.width || `calc(${100 / h}% - ${(h - 1) / h}rem)`,
-          flexGrow: 1,
-          flexShrink: 0,
+          flexGrow: a.width ? 0 : 1,
+          flexShrink: a.ui !== "radio" || a.width ? 0 : 1,
           flexWrap: "wrap"
         }, className: "pb-4", children: [
           /* @__PURE__ */ o.jsx($, { className: "mb-2", children: a.label }),
@@ -218,11 +218,11 @@ function qa(_) {
           ] })
         ] }, r))
       ] }) : null,
-      M !== !1 && l?.showColorScale !== !1 ? /* @__PURE__ */ o.jsx(Sa, { width: l?.width, colorLegendTitle: l?.colorLegendTitle, colors: l?.colors || l?.lineColors || ba[l?.theme || "light"].categoricalColors.colors, colorDomain: l?.colorDomain || l?.labels || [], showNAColor: l?.showNAColor === void 0 || l?.showNAColor === null ? !0 : l?.showNAColor }) : null,
-      /* @__PURE__ */ o.jsx("div", { className: `flex flex-wrap gap-4 justify-center ${l?.language === "ar" || l?.language === "he" ? "flex-row-reverse" : "flex-row"}`, children: b.map((a, r) => /* @__PURE__ */ o.jsx("div", { style: {
-        width: `calc(${100 / (N || Math.min(4, b.length || 0))}% - ${((N || Math.min(4, b.length || 0)) - 1) / (N || Math.min(4, b.length || 0))}rem)`,
+      M !== !1 && l?.showColorScale !== !1 ? /* @__PURE__ */ o.jsx(Sa, { width: l?.width, colorLegendTitle: l?.colorLegendTitle, colors: l?.colors || l?.lineColors || wa[l?.theme || "light"].categoricalColors.colors, colorDomain: l?.colorDomain || l?.labels || [], showNAColor: l?.showNAColor === void 0 || l?.showNAColor === null ? !0 : l?.showNAColor }) : null,
+      /* @__PURE__ */ o.jsx("div", { className: `flex flex-wrap gap-4 justify-center ${l?.language === "ar" || l?.language === "he" ? "flex-row-reverse" : "flex-row"}`, children: w.map((a, r) => /* @__PURE__ */ o.jsx("div", { style: {
+        width: `calc(${100 / (N || Math.min(4, w.length || 0))}% - ${((N || Math.min(4, w.length || 0)) - 1) / (N || Math.min(4, w.length || 0))}rem)`,
         minWidth: ja(H) ? "280px" : `${H}px`
-      }, children: /* @__PURE__ */ o.jsx(fa, { graph: k, graphDataConfiguration: p, graphData: wa(D ? xa(Y(m, L || []).filter(
+      }, children: /* @__PURE__ */ o.jsx(fa, { graph: k, graphDataConfiguration: p, graphData: ba(D ? xa(Y(m, L || []).filter(
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         (e) => e[S] === a
       ), D.keyColumn, D.aggregationColumnsSetting) : Y(m, L || []).filter(