@devgateway/dvz-ui-react
Version:
A modular, embeddable React component library for data visualization and UI, built with TypeScript. Provides reusable components for charts, maps, dashboards, and more, with built-in support for internationalization and Redux integration.
2 lines (1 loc) • 15.1 kB
JavaScript
;Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react/jsx-runtime"),p=require("react"),ce=require("semantic-ui-react"),_a=require("../data/DataProvider.js"),Ja=require("../data/DataConsumer.js"),Ka=require("../../utils/deviceType.js"),Qa=require("./Pie.js");require("immutable");const Za=require("./Radar.js"),ja=require("./Bar.js"),Oa=require("./Line.js"),er=require("@devgateway/wp-react-lib"),K=require("./data/index.js"),tr=require("./CSVDataFrame.js"),ar=require("./colors/ColorProvider.js"),ot=require("./Messages.js"),rr=require("react-redux"),or=require("react-intl"),nr=A=>{let{parent:ue,editing:i=!1,unique:Q,childContent:L,categories:q,injectedMeasures:d,"data-app":r="csv","data-dvz-proxy-dataset-id":me,"data-group":pe="default","data-height":N=500,"data-type":F="bar","data-dimension1":P,"data-dimension2":he,"data-dimension3":lr,"data-color-by":Z="index","data-scheme":ge="system","data-group-mode":nt="grouped","data-left-legend":st="Left Legend","data-legend-label":it="","data-bottom-legend":dt="Bottom Legend","data-dualmode":lt,"data-legend-position":fe="right","data-show-legends":be="true","data-data-source-label":cr="Source","data-chart-data-source":ur="Data Source","data-toggle-info-label":mr="Info Graphic","data-toggle-chart-label":pr="Chart","data-tick-rotation":m=0,"data-tick-color":ct="rgb(92,93,99)","data-measures":ut="{}","data-format":hr="{}","data-csv":mt="","data-margin-left":pt=50,"data-margin-top":ht=25,"data-margin-right":gt=25,"data-margin-bottom":ft=25,"data-start-angle":bt=0,"data-end-angle":wt=360,"data-view-mode":we="info","data-filters":xt="[]","data-tooltip-html":vt="","data-layout":j="vertical","data-reverse":xe="false","data-offset-y":Lt="-40","data-line-layer-enabled":ve="false","data-overlays":yt="[]","data-max-value":Tt="auto","data-value-scale":kt="linear","data-swap":z="false","data-no-data-message":Rt="No data matches your selection","data-bar-color":Ct="rgb(0,0,0)","data-override-tick-color":Le="false","data-fixed-min-value":It=0,"data-fixed-max-value":Mt=0,"data-bar-padding":Dt=.15,"data-bar-label-position":At="middle","data-line-label-position":Ft="none","data-show-grid":ye="true","data-include-overall":Te="false","data-bar-inner-padding":Pt=.7,"data-x-label-color":Bt="#000","data-bar-label-color":Et="#000","data-legend-label-color":qt="#000","data-tooltip-enabled":ke="true","data-use-check-box-background":Re="false","data-use-label-background":Ce="true","data-highlight-xaxis-line":Ie="false","data-show-tick-line":Me="true","data-show-right-axis":De="true","data-manual-colors":Nt="{}","data-right-legend":zt="","data-offset-right":St="40","data-offset-bottom":Gt="40","data-hidden-bars":Vt=[],"data-confidence-intervals":Xt="[]","data-enable-area":Ae="false","data-area-shading-criteria":Ut="DEFAULT","data-area-lower-bound":$t="","data-area-upper-bound":Ht="","data-show-points":Fe="true","data-center-label":Wt="","data-show-arc-labels":Pe="true","data-show-arc-link-labels":Be="true","data-slice-padding":Yt=1,"data-center-label-font-weight":_t="normal","data-center-label-font-size":Jt="12","data-center-label-xoffset":Kt=0,"data-center-label-yoffset":Qt=0,"data-group-total-measure":Zt="","data-show-group-total":Ee="true","data-group-total-label":jt="","data-group-total-format":Ot="{}","data-group-total-label-offset":ea,"data-group-total-fixed-position":qe="false","data-tooltip-enable-markdown":S="false","data-y-axis-tick-values":Ne="10","data-x-axis-tick-values":ze="10","data-enable-grid-y":y="true","data-enable-grid-x":T="false","data-offset-text":ta=0,"data-overall-label":O="Overall","data-min-max-clamp":aa="false","data-reverse-legend":Se="false","data-sort":Ge="default","data-sort-reverse":G="false","data-sort-second-dimension":Ve="default","data-sort-reverse-second-dimension":V="false","data-radar-curve":ra="linearClosed","data-radar-fill-opacity":oa=.25,"data-radar-border-width":na=2,"data-radar-grid-levels":sa=3,"data-radar-grid-shape":ia="circular","data-radar-grid-label-offset":da=36,"data-radar-enable-dots":Xe="true","data-radar-dot-size":la=8,"data-radar-enable-dot-label":Ue="true","data-radar-dot-label-offset":ca=-12,"data-mobile-customization":$e="{}","data-show-percentage":He="false","data-preview-mode":h="Desktop","data-wait-for-filters":ua="false","data-line-curve":ma="linear","data-show-legends-in-columns":We="false","data-number-of-legend-columns":pa=4,pageModuleProps:g}=A;const ha=i,t=JSON.parse(decodeURIComponent($e)),[ee,ga]=p.useState(window.innerWidth<=1250),b=ee&&((t==null?void 0:t.showCustomization)??!1);g!=null&&g.previewMode&&(g!=null&&g.editing)&&(h=g.previewMode,i=g.editing);const fa=["Tablet"].includes(h)&&i,ba=["Mobile"].includes(h)&&i,wa=["Desktop"].includes(h)&&i,c=b&&h!=="Desktop",u=b&&!i,te=()=>{const e=window.matchMedia("(min-width: 768px) and (max-width: 1250px)").matches,n=window.matchMedia("(max-width: 767px)").matches;switch(!0){case wa:return m;case fa:return b?(t==null?void 0:t.tabletXAxisTextRotation)??m:m;case ba:return b?(t==null?void 0:t.mobileXAxisTextRotation)??m:m;case e:return b?(t==null?void 0:t.tabletXAxisTextRotation)??m:m;case n:return b?(t==null?void 0:t.mobileXAxisTextRotation)??m:m;default:return m}},xa=te(),[va,Ye]=p.useState(xa),_e=A.intl.locale,X=p.useRef(null),Je=e=>{try{return ha?e:decodeURIComponent(e)}catch{return console.error(`error decoding value:${e}`),e}},k=e=>{try{return JSON.parse(Je(e))}catch{console.error(`error parsing value:${e}`)}return null},La=()=>k(Nt)[r],ya=()=>k(ut),Ke=()=>{var e;if(a!=null&&a[r]){let n=(e=a==null?void 0:a[r])==null?void 0:e.format;if(!n){const o=Object.keys(a==null?void 0:a[r]);for(let x=0;x<o.length;x++)if(a!=null&&a[r][o[x]].selected&&(a!=null&&a[r][o[x]].format)){n=a==null?void 0:a[r][o[x]].format;break}}return n}return a!=null&&a.csv?a.csv.format:null},Ta=()=>{let e=null;return a!=null&&a[r]?a[r].useCustomAxisFormat&&a[r].customFormat&&(e=a[r].customFormat):a!=null&&a.csv&&a.csv.useCustomAxisFormat&&a.csv.customFormat&&(e=a.csv.customFormat),e},ka=()=>a!=null&&a[r]?Object.keys(a[r]).map(e=>({value:e,...a[r][e]})).filter(e=>e.selected).map(e=>e.value):[],Qe=()=>{const e={};return a!=null&&a[r]&&Object.keys(a[r]).map(o=>({value:o,...a[r][o]})).filter(o=>o.selected&&o.hasCustomLabel).forEach(o=>{e[o.value]=o.customLabel}),e},Ra=()=>a!=null&&a[r]?Object.keys(a[r]).filter(e=>a[r][e].allowSelection):[];let a=ya(),w=ka(),f=Ke();const Ca=Ra();let ae=st,re=zt,oe=Je(vt);if(d!=null&&d[r]){const e=Object.keys(d[r].measures).map(n=>({value:n,...d[r].measures[n]})).filter(n=>n.selected).map(n=>n.value);a=d,w=e,f=Ke(),ae=d.leftTitle,re=d.rightTitle,d.customTooltip&&(oe=d.customTooltip)}const Ia=f?{style:f.style==="compacted"?"decimal":f.style,notation:f.style==="compacted"?"compact":"standard",currency:f.currency,minimumFractionDigits:parseInt(f.minimumFractionDigits),maximumFractionDigits:parseInt(f.maximumFractionDigits)}:{notation:"standard",currency:"USD",minimumFractionDigits:2,maximumFractionDigits:2},Ma=Ta(),s=k(Ot),Da={style:(s==null?void 0:s.style)==="compacted"?"decimal":s==null?void 0:s.style,notation:(s==null?void 0:s.style)==="compacted"?"compact":"standard",currency:s==null?void 0:s.currency,minimumFractionDigits:parseInt(s==null?void 0:s.minimumFractionDigits),maximumFractionDigits:parseInt(s==null?void 0:s.maximumFractionDigits)},[Aa,gr]=p.useState(we),Fa=i?we:Aa,Pa={scheme:ge,colorBy:Z},U=i?N-80:N,Ba=()=>(c||u)&&!(t!=null&&t.showXAxisTitle)?"":dt,Ea=()=>c||u?t!=null&&t.showYAxisTitle?ae:"":ae,qa=()=>c||u?t!=null&&t.showRightAxisTitle?re:"":re,Na={left:Ea(),bottom:Ba(),right:qa()},$=e=>{if(e==="true"||e===!0)return!0;if(e==="false"||e===!1)return!1},Ze=()=>{$(T)&&!$(y)?(T=!1,y=!0):!$(T)&&$(y)&&(T=!0,y=!1)},za=()=>j==="horizontal"?(Ze(),"vertical"):(Ze(),"horizontal"),Sa=()=>t!=null&&t.chartLayoutOverride?za():j,H=(e,n,o)=>e?Number.parseInt(n)??o:o,je=(e,n,o)=>e?n??o:o;p.useEffect(()=>{const e=()=>{ga(window.innerWidth<=1250);const n=te();Ye(n)};return window.addEventListener("resize",e),Ye(te()),()=>{window.removeEventListener("resize",e)}},[i,h,b,m,t==null?void 0:t.tabletXAxisTextRotation,t==null?void 0:t.mobileXAxisTextRotation]);const Ga=()=>{const e=["tablet","mobile","midTablet"].includes(Ka.default());return i&&h==="Desktop"?fe:e?"bottom":fe},Oe={app:r,editing:i,tickColor:decodeURIComponent(ct),tickRotation:va,layout:c||u?Sa():j,reverse:xe==!0||xe=="true",showLegends:be==!0||be=="true",legendLabel:it,swap:z==!0||z=="true",showGrid:ye==!0||ye=="true",showPercentage:He==!0||He=="true",marginLeft:H(c||u,Number.parseInt(t==null?void 0:t.marginLeft),parseInt(pt)),marginTop:H(c||u,Number.parseInt(t==null?void 0:t.marginTop),parseInt(ht)),marginRight:H(c||u,Number.parseInt(t==null?void 0:t.marginRight),Number.parseInt(gt)),marginBottom:H(c||u,Number.parseInt(t==null?void 0:t.marginBottom),Number.parseInt(ft)),height:`${U}px`,legendPosition:Ga(),legends:Na,tooltip:S==!0||S=="true"?oe:oe.replace(/\r\n/g,"<hr/>").replace(/[\r\n]/g,"<hr/>"),colors:Pa,groupMode:nt,format:Ia,startAngle:bt,endAngle:wt,offsetY:Lt,maxValue:Tt,valueScale:kt,categories:q,lineLayerEnabled:ve==!0||ve=="true",overlays:k(yt)||[],barColor:decodeURIComponent(Ct),overrideTickColor:Le==!0||Le=="true",fixedMinValue:It,fixedMaxValue:Mt,barPadding:je(c||u,t==null?void 0:t.barPadding,Dt),barLabelPosition:At,lineLabelPosition:Ft,barInnerPadding:je(c||u,t==null?void 0:t.barInnerPadding,Pt),xLabelColor:decodeURIComponent(Bt),barLabelColor:decodeURIComponent(Et),legendLabelColor:decodeURIComponent(qt),tooltipEnabled:ke==!0||ke=="true",legendLabelBack:Ce==!0||Ce=="true",legendCheckBack:Re==!0||Re=="true",highlightXAxisLine:Ie==!0||Ie=="true",showTickLine:Me==!0||Me=="true",showRightAxis:De==!0||De=="true",offsetRight:St,offsetBottom:Gt,confidenceIntervals:k(Xt)||[],showPoints:Fe==!0||Fe=="true",enableArea:Ae==!0||Ae=="true",areaShadingCriteria:Ut,areaLowerBound:$t,areaUpperBound:Ht,showGroupTotal:Ee==!0||Ee=="true",groupTotalMeasure:Zt,groupTotalLabel:jt,groupTotalFormat:Da,groupTotalOffset:ea,groupTotalFixedPosition:qe==!0||qe=="true",centerLabel:Wt,showArcLabels:Pe==!0||Pe=="true",showArcLinkLabels:Be==!0||Be=="true",slicePadding:Yt,centerLabelFontWeight:_t,centerLabelFontSize:Jt,centerLabelXOffset:Kt,centerLabelYOffset:Qt,userMeasures:Ca,tooltipEnableMarkdown:S==!0||S=="true",yAxisTickValues:c||u?t.yAxisTickValues??Ne:Ne,xAxisTickValues:c||u?t.xAxisTickValues??ze:ze,enableGridY:y==!0||y=="true",enableGridX:T==!0||T=="true",offsetText:ta,selectedMeasures:w,overallLabel:O,minMaxClamp:aa,reverseLegend:Se==!0||Se=="true",customAxisFormat:Ma,sort:Ge,sortReverse:G==!0||G=="true",sortReverseSecondDimension:V==!0||V=="true",radarCurve:ra,radarFillOpacity:oa,radarBorderWidth:na,radarGridLevels:sa,radarGridShape:ia,radarGridLabelOffset:da,radarEnableDots:Xe==!0||Xe=="true",radarDotSize:la,radarEnableDotLabel:Ue==!0||Ue=="true",radarDotLabelOffset:ca,sortSecondDimension:Ve,mobileCustomization:$e,dimension1:P,previewMode:h,lineCurve:ma,showLegendsInColumns:We==!0||We=="true",numberOfLegendColumns:parseInt(pa)||4},ne={},se=k(xt)||{};se&&se.forEach&&se.forEach(e=>{e.value!=null&&e.value.filter(n=>n!=null&&n.toString().trim()!="").length>0&&(ne[e.param]=e.value)}),me&&(ne.dvzProxyDatasetId=me);let R=null,C=null;if(r==="csv")R=tr.default;else switch(F){case"line":R=K.default.LineDataFrame;break;case"pie":R=K.default.PieDataFrame;break;case"radar":R=K.default.BarDataFrame;break;default:R=K.default.BarDataFrame;break}let I=!1;switch(F){case"bar":C=ja.default,I=r!="csv"&&P=="none"&&w.length==0;break;case"line":C=Oa.default,I=r!=="csv"&&(w.length===0||P==="none");break;case"pie":I=r!="csv"&&w.length==0,C=Qa.default;break;case"radar":I=r!="csv"&&w.length==0,C=Za.default;break;default:C=l.jsx("div",{children:"No Chart"});break}const Va=lt==="true",B=[];P!="none"&&B.push(P),he!="none"&&B.push(he);const[et,Xa]=p.useState(0),[fr,Ua]=p.useState(tt());function tt(){var e;return((e=window.screen.orientation)==null?void 0:e.type)||(window.innerWidth>window.innerHeight?"landscape-primary":"portrait-primary")}return p.useEffect(()=>{const e=setTimeout(()=>{ee&&(()=>{const o=X.current.querySelector(".legends.container.has-standard-12-font-size.bottom")||X.current.querySelector(".legends.container.items-section");if(!o)return;const{clientHeight:x}=o,E=window.getComputedStyle(o),$a=parseInt(E.marginTop),at=parseInt(E.marginBottom),Ha=parseInt(E.paddingTop),Wa=parseInt(E.paddingBottom),Ya=x+$a+at+Ha+Wa,rt=o.closest(".ui.fluid.container.content");if(rt){const v=rt.querySelector(".data-source");if(v){const M=v.getBoundingClientRect(),D=o.getBoundingClientRect();if(D.bottom!==0&&M.top!==0){if(o.textContent.trim()==="")return;const W=at,Y=D.bottom+W,de=window.getComputedStyle(v),_=parseFloat(de.marginTop)||0,J=M.top-_;if(Y>J){let le=Y-J;le<5&&(le+=1),v.style.marginTop=`${le+1}px`}}else setTimeout(()=>{M.top<D.bottom&&(v.style.marginTop=`${D.bottom-M.top+1}px`)},1e3)}}const ie=o.closest(".chart.container");if(ie){const v=ie.getBoundingClientRect(),M=window.getComputedStyle(ie),D=Number.parseFloat(M.marginBottom)||0,W=v.bottom+D,Y=o.getBoundingClientRect(),de=Number.parseFloat(E.marginTop)||0,_=Y.top-de;if(_<W){const J=W-_;o.style.marginTop=`${J+1}px`}}Xa(Ya)})()},100);return()=>{clearTimeout(e)}},[ee,X]),p.useEffect(()=>{const e=()=>{setTimeout(()=>{Ua(tt())},100)};return window.screen.orientation?window.screen.orientation.addEventListener("change",e):window.addEventListener("resize",e),()=>{window.screen.orientation?window.screen.orientation.removeEventListener("change",e):window.removeEventListener("resize",e)}},[]),l.jsx("div",{ref:X,children:l.jsxs(ce.Container,{className:"chart container",style:{minHeight:F==="pie"&&window.innerWidth<=480?`${parseInt(N)+parseInt(et)*.5}px`:`${parseInt(N)+parseInt(et)}px`},fluid:!0,children:[l.jsx(_a.default,{editing:i,style:{height:`${U}px`},params:ne,waitForFilters:ua==="true",app:r,group:pe,csv:mt,store:[r,Q,...B],source:B.join("/"),children:l.jsxs(ce.Container,{style:{height:`${U}px`},className:"body",fluid:!0,children:[I&&l.jsx(ot.default,{editing:i}),!I&&l.jsxs(Ja.default,{children:[l.jsx(ot.default,{app:r,group:pe,noDataMsg:Rt,children:" "}),l.jsx(R,{locale:_e,colorBy:Z,hiddenBars:Vt,swap:z==="true"||z===!0,type:F,includeTotal:!0,includeOverall:Te===!0||Te==="true",overallLabel:O,measures:w,dimensions:[...B],sort:Ge,sortReverse:G===!0||G==="true",sortSecondDimension:Ve,sortReverseSecondDimension:V===!0||V==="true",customLabels:Qe(),children:l.jsx(ar.default,{type:F,app:r,locale:_e,overallLabel:O,customLabels:Qe(),manualColors:La(),colorBy:Z,scheme:ge,barColor:Oe.barColor,children:l.jsx(C,{...Oe})})})]})]})}),l.jsx("br",{}),Va&&L&&Fa==="info"&&l.jsx(ce.Container,{fluid:!0,style:{height:U+"px"},className:"body",children:l.jsx(er.PostContent,{post:{content:{rendered:L}}})})]})})},sr=(A,ue)=>{const{"data-app":i,"data-group":Q}=ue,L=A.getIn(["data","measures",i,Q]),q=A.getIn(["data","pageModuleProps"]),d={};return L&&Object.keys(L).length>0&&(d.injectedMeasures=L??{}),q&&(d.pageModuleProps=q),d},ir={},dr=rr.connect(sr,ir)(or.injectIntl(nr));exports.default=dr;