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