@devgateway/dvz-ui-react/dist/cjs/embeddable/big-number/index.js

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.

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react/jsx-runtime"),I=require("react"),A=require("semantic-ui-react"),O=require("../data/DataProvider.js"),E=require("../data/DataConsumer.js");require("@devgateway/wp-react-lib");const _=require("react-redux"),H=l=>{const{editing:r=!1,unique:c,intl:t,childContent:o,"data-csv":f="","data-dvz-proxy-dataset-id":b,"data-no-data-message":C="No data matches your selection","data-view-mode":g="info","data-height":d,"data-app":u,"data-measures":x="{}","data-format":m="{}","data-group":s,"data-filters":p="[]","data-number-font-size":h=20,"data-label-font-size":y=20,"data-number-color":i="#000000","data-label-color":F="#000000","data-label":q="","data-wait-for-filters":R="false","data-no-data-text":M="-"}=l,N=t.locale,P=I.useRef(null),U=e=>r?e:decodeURIComponent(e),j=e=>{try{return JSON.parse(U(e))}catch{console.error("error parsing value:"+e)}return null},n=j(m),w=n?{style:n.style==="compacted"?"decimal":n.style,notation:n.style==="compacted"?"compact":"standard",currency:n.currency,minimumFractionDigits:parseInt(n.minimumFractionDigits),maximumFractionDigits:parseInt(n.maximumFractionDigits)}:{notation:"standard",currency:"USD",minimumFractionDigits:2,maximumFractionDigits:2},[G,K]=I.useState(g),T=r?d-80:d-40,v={},D=j(p)||{};D&&D.forEach&&D.forEach(e=>{e.value!=null&&e.value.filter(S=>S!=null&&S.toString().trim()!="").length>0&&(v[e.param]=e.value)}),b&&(v.dvzProxyDatasetId=b);const z=[];return a.jsx("div",{ref:P,children:a.jsx(A.Container,{className:"chart container big-number-container",style:{height:d+"px"},fluid:!0,children:a.jsx(O.default,{style:{height:`${T}px`},params:v,app:u,group:s,csv:f,editing:r,waitForFilters:R==="true",store:[u,c,...z],source:z.join("/"),children:a.jsx(E.default,{children:a.jsx(J,{locale:N,intl:t,app:u,format:w,measure:j(x)[0]||null,label:q,numberFontSize:h,numberColor:i,labelFontSize:y,labelColor:F,noDataText:M})})})})})},J=l=>{const{app:r,measure:c,data:t,format:o,label:f,numberColor:b,numberFontSize:C,labelColor:g,labelFontSize:d,noDataText:u,intl:x}=l;let m=c,s=t;if(r=="csv"){const{data:i,meta:{fields:F}}=t;m=F[0],s=t.data[0]}let p="";if(s){let i=s[m]?s[m]:0;i?p=x.formatNumber(o.style==="percent"?i/100:i,{...o}):p=u}const h={color:decodeURIComponent(b),fontSize:C+"px",textAlign:"center"},y={color:decodeURIComponent(g),fontSize:d+"px",textAlign:"center"};return a.jsxs("div",{children:[a.jsx("div",{style:h,className:"big-number",children:p}),f&&a.jsx("div",{style:y,className:"big-number-label",children:f})]})},$=(l,r)=>{const{"data-app":c,"data-group":t}=r,o=l.getIn(["data","measures",c,t]);return o?{injectedMeasures:o}:{}},k={},B=_.connect($,k)(H);exports.default=B;