@devgateway/dvz-ui-react/dist/cjs/embeddable/chart/Radar.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";const c=require("react/jsx-runtime"),N=require("react"),ue=require("react-intl"),he=require("@nivo/radar"),me=require("./Legends.js"),g=require("../../utils/deviceType.js");require("lodash");const xe="none",be=({editing:i,legends:ye,marginLeft:A,marginTop:q,marginRight:O,marginBottom:V,options:d,intl:T,format:u,height:z,showLegends:F,legendPosition:H,legendLabel:I,legendCheckBack:$,legendLabelBack:w,legendLabelColor:W,colorGenerator:Y,reverseLegend:P,radarCurve:U,radarFillOpacity:X,radarBorderWidth:J,radarGridLevels:R,radarGridShape:K,radarGridLabelOffset:_=10,radarEnableDots:G,radarDotSize:Q,radarEnableDotLabel:Z,radarDotLabelOffset:C,mobileCustomization:E,previewMode:p})=>{const[L,S]=N.useState([]),h=g()==="mobile",m=["tablet","midTablet"].includes(g()),ee=h||m,e=N.useMemo(()=>JSON.parse(decodeURIComponent(E)),[E]),x=ee&&((e==null?void 0:e.showCustomization)??!1),j=x&&p!=="Desktop",k=!i&&x;if(!d||!d.data)return null;const te=t=>t.filter(a=>!L.includes(a)),ae=t=>S(a=>a.includes(t)?a.filter(s=>s!==t):[...a,t]);function v({tickValue:t,editing:a,previewMode:s,isMobileDevice:o,isTabletDevice:n,mobileConfigSettings:r,isNotDesktopPreview:y,isNotEditingAndIsMobileCustomizationEnabled:b}){let l=25;return(y||b)&&(a&&s==="Mobile"||o&&!a?l=(r==null?void 0:r.mobileMaxTickLength)??25:a&&s==="Tablet"||n&&!a?l=(r==null?void 0:r.tabletMaxTickLength)??25:!a&&window.matchMedia("(min-width: 768px) and (max-width: 1250px)").matches&&(l=15)),l}const B=(t,a)=>{const s=String(t).split(" "),o=[];let n="";return s.forEach(r=>{`${n} ${r}`.trim().length<=a?n=(n?`${n} `:"")+r:(o.push(n),n=r)}),n&&o.push(n),o},re=({centerX:t,centerY:a,radiusScale:s})=>{const o=s.ticks(R).filter(r=>r>0),n=h?e.mobileYAxisLineHeight??12:m?e.tabletYAxisLineHeight??12:12;return c.jsx("g",{children:o.map((r,y)=>{const b=s(r),l=t+b*Math.sin(0)+7,f=a-b*Math.cos(0),ce=T.formatNumber(u.style==="percent"?r/100:r,u),oe=v({tickValue:r,editing:i,previewMode:p,isMobileDevice:h,isTabletDevice:m,mobileConfigSettings:e,isNotDesktopPreview:j,isNotEditingAndIsMobileCustomizationEnabled:k}),ie=B(ce,oe);return c.jsxs("g",{children:[c.jsx("line",{x1:l-7,y1:f-4,x2:l-3,y2:f-4,stroke:"rgb(51,51,51)",strokeWidth:1}),ie.map((de,D)=>c.jsx("text",{x:l,y:f+D*n,fontFamily:"sans-serif",fontSize:"11px",fill:"rgb(51,51,51)",children:de},D))]},y)})})},se=({id:t,x:a,y:s})=>{const o=v({tickValue:t,editing:i,previewMode:p,isMobileDevice:h,isTabletDevice:m,mobileConfigSettings:e,isNotDesktopPreview:j,isNotEditingAndIsMobileCustomizationEnabled:k}),n=B(t,o),r=h?e.mobileXAxisLineHeight??12:m?e.tabletXAxisLineHeight??12:12,y=a>5?"start":a<-5?"end":"middle";return c.jsx("g",{transform:`translate(${a}, ${s})`,children:c.jsx("text",{textAnchor:y,alignmentBaseline:"middle",style:{fontFamily:"sans-serif",fontSize:"11px",fill:"#333",pointerEvents:"none"},children:n.map((b,l)=>c.jsx("tspan",{x:0,dy:l===0?0:`${r}px`,children:b},l))})})},M=(()=>{const t=!i&&h&&x||i&&p==="Mobile"&&x,a=!i&&m&&x||i&&p==="Tablet"&&x,s={mobile:{marginLeft:e==null?void 0:e.mobileMarginLeft,marginTop:e==null?void 0:e.mobileMarginTop,marginRight:e==null?void 0:e.mobileMarginRight,marginBottom:e==null?void 0:e.mobileMarginBottom},tablet:{marginLeft:e==null?void 0:e.tabletMarginLeft,marginTop:e==null?void 0:e.tabletMarginTop,marginRight:e==null?void 0:e.tabletMarginRight,marginBottom:e==null?void 0:e.tabletMarginBottom}};return t?s.mobile:a?s.tablet:{marginLeft:A,marginTop:q,marginRight:O,marginBottom:V}})(),ne={top:M.marginTop,right:M.marginRight,bottom:M.marginBottom,left:M.marginLeft},le=d.keys.map(t=>({id:t,label:t,color:L.includes(t)?xe:Y.getColorByKey(t),enabled:!L.includes(t)}));return c.jsxs("div",{style:{height:z},className:"radar",children:[c.jsx(he.ResponsiveRadar,{data:d.data,keys:te(d.keys),indexBy:d.indexBy,margin:ne,curve:U,maxValue:"auto",valueFormat:t=>T.formatNumber(u.style==="percent"?t/100:t,u),borderColor:{from:"color"},gridLevels:R,gridShape:K,gridLabelOffset:Number.parseInt(_,10),gridLabel:se,enableDots:G,dotSize:Q,dotBorderWidth:2,enableDotLabel:Z,dotLabelYOffset:C,dotLabel:t=>T.formatNumber(u.style==="percent"?t.value/100:t.value,u),fillOpacity:X,borderWidth:J,blendMode:"multiply",motionConfig:"wobbly",theme:{tooltip:{basic:{background:"#EEE",whiteSpace:"pre",display:"flex"},tableCell:{padding:"3px 5px"}}},layers:["grid",re,"markers","areas","lines","layers","slices","dots","axes","legends","mesh","annotations"]}),c.jsx(me,{filter:L,showLegends:F,chartLegends:le,legendLabel:I,legendPosition:H,legendCheckBack:$,legendLabelBack:w,legendLabelColor:W,onToggle:ae,reverseLegend:P})]})},pe=ue.injectIntl(be);module.exports=pe;