@foodpilot/foods 2.19.0 → 2.19.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Cards/ScoreCard/ScoreCard.js +6 -6
- package/dist/components/Chart/HorizontalGauge/HorizontalGaugeChart.js +9 -6
- package/dist/components/Chart/HorizontalGauge/components/GaugeBorders.d.ts +1 -1
- package/dist/components/Chart/HorizontalGauge/components/GaugeBorders.js +5 -6
- package/dist/components/Chart/HorizontalGauge/components/GaugeLabels.d.ts +1 -1
- package/dist/components/Chart/HorizontalGauge/components/GaugeLabels.js +1 -9
- package/dist/components/Chart/HorizontalGauge/components/GaugeMarkers.d.ts +1 -1
- package/dist/components/Chart/HorizontalGauge/components/GaugeMarkers.js +10 -8
- package/dist/components/Chart/HorizontalGauge/components/GaugeStatistics.d.ts +2 -0
- package/dist/components/Chart/HorizontalGauge/components/GaugeStatistics.js +4 -0
- package/dist/components/Chart/HorizontalGauge/constants.d.ts +7 -0
- package/dist/components/Chart/HorizontalGauge/constants.js +1 -1
- package/dist/components/Chart/HorizontalGauge/hooks/useGaugeCalculations.d.ts +1 -1
- package/dist/components/Chart/HorizontalGauge/hooks/useGaugeCalculations.js +1 -1
- package/dist/components/Chart/HorizontalGauge/types.d.ts +21 -10
- package/dist/components/Chart/HorizontalGauge/utils/statisticLayout.d.ts +15 -0
- package/dist/components/Chart/HorizontalGauge/utils/statisticLayout.js +1 -0
- package/dist/components/Chart/PolymorphicChart/PolymorphicChartTooltip.d.ts +2 -20
- package/dist/components/Chart/PolymorphicChart/charts/PolymorphicBarChart.js +7 -7
- package/dist/components/Chart/PolymorphicChart/charts/PolymorphicLineChart.js +8 -8
- package/dist/components/Chart/PolymorphicChart/charts/PolymorphicRadarChart.js +3 -3
- package/dist/components/Chart/shared/ChartTooltip.d.ts +21 -0
- package/dist/components/Chart/shared/ChartTooltip.js +6 -0
- package/dist/themes/common/MUIComponents/buttons.d.ts +1 -1
- package/dist/themes/common/components.js +1 -1
- package/package.json +1 -1
- package/dist/components/Chart/HorizontalGauge/components/GaugeTooltip.d.ts +0 -10
- package/dist/components/Chart/HorizontalGauge/components/GaugeTooltip.js +0 -6
- package/dist/components/Chart/PolymorphicChart/PolymorphicChartTooltip.js +0 -6
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import{jsxs as o,jsx as e}from"react/jsx-runtime";import{useTheme as i,Box as r,Stack as t,Button as n}from"@mui/material";import{FoodsIcon as d}from"../../Icons/FoodsIcon.js";import{ScoreCardHeader as a}from"./Header/ScoreCardHeader.js";import{ComingSoonBadge as s}from"../../Badge/ComingSoonBadge.js";import{WhiteBox as c}from"../../Box/WhiteBox.js";const
|
|
2
|
-
return o(c,{sx:{flex:"0 0 calc(33.33% - 14px)",
|
|
3
|
-
/* @__PURE__ */o(r,{sx:{
|
|
4
|
-
/* @__PURE__ */e(t,{sx:{..."secondary"===
|
|
5
|
-
/* @__PURE__ */e(t,{padding:{xs:"16px",md:"28px 32px"},paddingBottom:{xs:"16px",md:"37px"},gap:"40px",children:
|
|
6
|
-
/* @__PURE__ */e(n,{variant:"ternary",endIcon:/* @__PURE__ */e(d,{size:2,icon:"arrowRight"}),disabled:void 0===
|
|
1
|
+
import{jsxs as o,jsx as e}from"react/jsx-runtime";import{useTheme as i,Box as r,Stack as t,Button as n}from"@mui/material";import{FoodsIcon as d}from"../../Icons/FoodsIcon.js";import{ScoreCardHeader as a}from"./Header/ScoreCardHeader.js";import{ComingSoonBadge as s}from"../../Badge/ComingSoonBadge.js";import{WhiteBox as c}from"../../Box/WhiteBox.js";const l=l=>{const{header:p,children:m,seeMoreText:x="Voir plus de détail",soonAvailableText:g,disableFooter:h=!1}=l,f=i();/* @__PURE__ */
|
|
2
|
+
return o(c,{sx:{boxSizing:"border-box",display:"flex",flex:"0 0 calc(33.33% - 14px)",flexDirection:"column",height:"100%",minWidth:0},children:[
|
|
3
|
+
/* @__PURE__ */o(r,{sx:{display:"flex",flex:1,flexDirection:"column",minHeight:0},children:[
|
|
4
|
+
/* @__PURE__ */e(t,{sx:{..."secondary"===p.variant&&{backgroundColor:f.custom.grey[200],borderTopLeftRadius:f.spacing(2),borderTopRightRadius:f.spacing(2),borderBottom:`1px solid ${f.custom.grey[500]}`}},children:/* @__PURE__ */e(a,{...p})}),
|
|
5
|
+
/* @__PURE__ */e(t,{padding:{xs:"16px",md:"28px 32px"},paddingBottom:{xs:"16px",md:"37px"},gap:"40px",children:m})]}),!1===h&&/* @__PURE__ */o(t,{direction:"row",alignItems:"center",gap:f.spacing(3.5),padding:f.spacing(3.5,4),borderTop:`1px solid ${f.custom.grey[500]}`,children:[
|
|
6
|
+
/* @__PURE__ */e(n,{variant:"ternary",endIcon:/* @__PURE__ */e(d,{size:2,icon:"arrowRight"}),disabled:void 0===l.moreDetailAction,onClick:l.moreDetailAction,sx:{width:"100%",justifyContent:"space-between",fontWeight:700},children:x}),void 0!==g&&/* @__PURE__ */e(s,{soonAvailableText:g})]})]})};export{l as ScoreCard};
|
|
@@ -1,6 +1,9 @@
|
|
|
1
|
-
import{
|
|
2
|
-
return a(
|
|
3
|
-
/* @__PURE__ */a(
|
|
4
|
-
/* @__PURE__ */
|
|
5
|
-
/* @__PURE__ */
|
|
6
|
-
/* @__PURE__ */
|
|
1
|
+
import{jsxs as a,jsx as e}from"react/jsx-runtime";import{useState as o,useCallback as i}from"react";import{GAUGE_CONSTANTS as n}from"./constants.js";import{useGaugeCalculations as r}from"./hooks/useGaugeCalculations.js";import{GaugeBorders as t}from"./components/GaugeBorders.js";import{GaugeMarkers as l}from"./components/GaugeMarkers.js";import{GaugeLabels as m}from"./components/GaugeLabels.js";import{GaugeBackground as s}from"./components/GaugeBackground.js";import{GaugeStatistics as u}from"./components/GaugeStatistics.js";import{ChartTooltip as p}from"../shared/ChartTooltip.js";import{Box as d}from"@mui/material";import{useContainerWidth as c}from"./hooks/useContainerWidth.js";import{useTheme as g}from"@mui/material/styles";const h=h=>{const T=g(),{minValue:E,maxValue:A,medianValue:v,averageValue:b,companyValue:L,labelAverage:M=n.TEXT.DEFAULT_AVERAGE_LABEL,labelCompany:_=n.TEXT.DEFAULT_COMPANY_LABEL,labelMinimum:G=n.TEXT.DEFAULT_MINIMUM_LABEL,labelMedian:V=n.TEXT.DEFAULT_MEDIAN_LABEL,labelMaximum:I=n.TEXT.DEFAULT_MAXIMUM_LABEL,width:P,height:y=n.DEFAULT_HEIGHT,label:U,animated:f=!1,backgroundProps:D,precision:F=0,unit:N="",ariaLabel:C,valueFormatter:x=T.numbers.valueFormatterFn}=h,[k,Y]=o(null),[w,S]=o(1),[j,B]=o(0),{containerRef:O,containerWidth:H}=c(),X=H||P||n.DEFAULT_WIDTH,{scale:W,companyPosition:R,averagePosition:z,gaugeBackgroundProps:q,markerY:J,companyMarkerY:K,averageMarkerY:Q,labelY:Z,labelPositions:$,medianPosition:aa}=r({minValue:E,maxValue:A,medianValue:v,companyValue:L,averageValue:b,labelCompany:_,labelAverage:M,width:X,height:y}),ea=Number.parseFloat(T.spacing(n.LAYOUT.STATISTIC_LANE_SPACING_UNITS)),oa=Number.parseFloat(T.spacing(n.LAYOUT.STATISTIC_TOP_OFFSET_UNITS)),ia=Number.parseFloat(T.spacing(n.LAYOUT.MEDIAN_GUIDE_GAP_UNITS)),na=y+Math.max(0,w-1)*ea,ra=v>=Math.min(E,A)&&v<=Math.max(E,A),ta=j>0?y-n.LEGEND_HEIGHT+oa+j*ea-ia:y-n.LEGEND_HEIGHT,la=i(a=>S(a),[]),ma="company"===k?{name:_,value:L,coordinate:{x:n.GAUGE_PADDING+W(L),y:J}}:"average"===k?{name:M,value:b,coordinate:{x:n.GAUGE_PADDING+W(b),y:J}}:void 0;/* @__PURE__ */
|
|
2
|
+
return a(d,{ref:O,"data-testid":"horizontal-gauge-root",width:P||"100%",height:na,position:"relative",style:{height:na},children:[
|
|
3
|
+
/* @__PURE__ */a("svg",{width:H,height:y,style:{overflow:"visible"},role:C?"img":void 0,"aria-label":C,"aria-hidden":!C||void 0,children:[
|
|
4
|
+
/* @__PURE__ */e(t,{width:H,height:y,medianPosition:aa,medianGuideEndY:ta,showMedian:ra,animated:f}),
|
|
5
|
+
/* @__PURE__ */e(s,{...q,backgroundProps:D,animated:f}),
|
|
6
|
+
/* @__PURE__ */e(l,{width:H,scale:W,companyValue:L,averageValue:b,markersYPosition:J,companyMarkerY:K,averageMarkerY:Q,minValue:E,maxValue:A,animated:f,onTooltipOpen:Y,onTooltipClose:()=>Y(null)}),
|
|
7
|
+
/* @__PURE__ */e(m,{minValue:E,maxValue:A,companyValue:L,averageValue:b,companyPosition:R,averagePosition:z,labelCompany:_,labelAverage:M,labelYPositions:Z,animated:f,onTooltipOpen:Y,onTooltipClose:()=>Y(null)})]}),
|
|
8
|
+
/* @__PURE__ */e(u,{minValue:E,medianValue:v,maxValue:A,labelMinimum:G,labelMedian:V,labelMaximum:I,labelPositions:$,showMedian:ra,height:y,animated:f,precision:F,valueFormatter:x,onLaneCountChange:la,onMedianLaneChange:B}),
|
|
9
|
+
/* @__PURE__ */e(p,{active:Boolean(ma),hoveredIndex:ma?0:null,data:ma?[{name:ma.name,value:ma.value,color:T.custom.grey[2800]}]:[],coordinate:ma?.coordinate,formatter:x,precision:F,unit:N,showSwatch:!1})]})};export{h as HorizontalGaugeChart};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { GaugeBordersProps } from '../types';
|
|
2
|
-
export declare const GaugeBorders: ({ width, height,
|
|
2
|
+
export declare const GaugeBorders: ({ width, height, medianPosition, medianGuideEndY, showMedian, animated, }: GaugeBordersProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import{jsxs as t,jsx as
|
|
2
|
-
/* @__PURE__ */
|
|
3
|
-
/* @__PURE__ */
|
|
4
|
-
/* @__PURE__ */
|
|
5
|
-
/* @__PURE__ */
|
|
6
|
-
/* @__PURE__ */r("line",{"data-testid":"horizontal-gauge-median-guide",x1:o(a)+E.GAUGE_PADDING,y1:0,x2:o(a)+E.GAUGE_PADDING,y2:s-E.LEGEND_HEIGHT,stroke:E.COLORS.BORDER,strokeWidth:"1",strokeDasharray:E.BORDER_DASH_PATTERN})]})};export{G as GaugeBorders};
|
|
1
|
+
import{jsxs as t,jsx as e}from"react/jsx-runtime";import{useRef as r,useEffect as D}from"react";import{GAUGE_CONSTANTS as s}from"../constants.js";const i=({width:i,height:o,medianPosition:E,medianGuideEndY:a,showMedian:G,animated:R=!1})=>{const n=r(null);return D(()=>{if(n.current&&R){const t=n.current;t.style.opacity="0",setTimeout(()=>{t.style.transition="all 0.5s linear",t.style.opacity="1"},300)}},[R]),/* @__PURE__ */t("g",{ref:n,style:{opacity:R?"0":"1"},children:[
|
|
2
|
+
/* @__PURE__ */e("line",{x1:s.GAUGE_PADDING,y1:1,x2:i-s.GAUGE_PADDING,y2:1,stroke:s.COLORS.BORDER,strokeWidth:"1",strokeDasharray:s.BORDER_DASH_PATTERN}),
|
|
3
|
+
/* @__PURE__ */e("line",{x1:s.GAUGE_PADDING,y1:o-s.LEGEND_HEIGHT,x2:i-s.GAUGE_PADDING,y2:o-s.LEGEND_HEIGHT,stroke:s.COLORS.BORDER,strokeWidth:"1",strokeDasharray:s.BORDER_DASH_PATTERN}),
|
|
4
|
+
/* @__PURE__ */e("line",{x1:s.GAUGE_PADDING,y1:0,x2:s.GAUGE_PADDING,y2:o-s.LEGEND_HEIGHT,stroke:s.COLORS.BORDER,strokeWidth:"1",strokeDasharray:s.BORDER_DASH_PATTERN}),
|
|
5
|
+
/* @__PURE__ */e("line",{x1:i-s.GAUGE_PADDING,y1:0,x2:i-s.GAUGE_PADDING,y2:o-s.LEGEND_HEIGHT,stroke:s.COLORS.BORDER,strokeWidth:"1",strokeDasharray:s.BORDER_DASH_PATTERN}),G&&/* @__PURE__ */e("line",{"data-testid":"horizontal-gauge-median-guide",x1:E,y1:0,x2:E,y2:a,stroke:s.COLORS.BORDER,strokeWidth:"1",strokeDasharray:s.BORDER_DASH_PATTERN})]})};export{i as GaugeBorders};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { GaugeLabelsProps } from '../types';
|
|
2
|
-
export declare const GaugeLabels: ({ minValue, maxValue,
|
|
2
|
+
export declare const GaugeLabels: ({ minValue, maxValue, companyValue, averageValue, companyPosition, averagePosition, labelCompany, labelAverage, labelYPositions, animated, onTooltipOpen, onTooltipClose, }: GaugeLabelsProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,9 +1 @@
|
|
|
1
|
-
import{
|
|
2
|
-
/* @__PURE__ */e("g",{children:[
|
|
3
|
-
/* @__PURE__ */e("text",{x:W.min.x,y:v.values,fill:P,fontSize:"12",fontWeight:"bold",textAnchor:W.min.anchor,dominantBaseline:"middle",style:F,children:[S?S(m):o(m,z),
|
|
4
|
-
/* @__PURE__ */e("tspan",{x:W.min.x,y:v.legend,fontWeight:"400","aria-hidden":"true",children:["(",y,")"]})]}),
|
|
5
|
-
/* @__PURE__ */e("text",{x:W.median.x,y:v.values,fill:P,fontSize:"12",fontWeight:"bold",textAnchor:W.median.anchor,dominantBaseline:"middle",style:F,children:[S?S(d):o(d,z),
|
|
6
|
-
/* @__PURE__ */e("tspan",{x:W.median.x,y:v.legend,fontWeight:"400","aria-hidden":"true",children:["(",g,")"]})]}),
|
|
7
|
-
/* @__PURE__ */e("text",{x:W.max.x,y:v.values,fill:P,fontSize:"12",fontWeight:"bold",textAnchor:W.max.anchor,dominantBaseline:"middle",style:F,children:[S?S(s):o(s,z),
|
|
8
|
-
/* @__PURE__ */e("tspan",{x:W.max.x,y:v.legend,fontWeight:"400","aria-hidden":"true",children:["(",b,")"]})]})]}),
|
|
9
|
-
/* @__PURE__ */e("g",{cursor:"default",children:[T(c)&&/* @__PURE__ */t(l,{width:"unset",title:/* @__PURE__ */t(a,{label:x,value:c,unit:B,precision:z,valueFormatter:S}),children:/* @__PURE__ */t("text",{transform:`translate(${u.x}, ${v.company})`,fill:P,textAnchor:u.anchor,dominantBaseline:"middle",fontWeight:"700",fontSize:"12",style:F,children:x})}),T(h)&&/* @__PURE__ */t(l,{width:"unset",title:/* @__PURE__ */t(a,{label:p,value:h,unit:B,precision:z,valueFormatter:S}),children:/* @__PURE__ */t("text",{transform:`translate(${f.x}, ${v.average})`,fill:P,fontSize:"12",fontWeight:"500",textAnchor:f.anchor,dominantBaseline:"middle",style:F,children:p})})]})]})};export{m as GaugeLabels};
|
|
1
|
+
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useRef as n,useEffect as o}from"react";import{useTheme as a}from"@mui/material";const r=({minValue:r,maxValue:i,companyValue:l,averageValue:s,companyPosition:m,averagePosition:c,labelCompany:u,labelAverage:f,labelYPositions:p,animated:y,onTooltipOpen:d,onTooltipClose:g})=>{const h=a(),x=n(null),v={transition:y?"transform 0.3s linear":"none"},M=h.custom.grey[2800],V=e=>e>=r&&e<=i;return o(()=>{if(x.current&&y){const e=x.current;e.style.opacity="0",setTimeout(()=>{e.style.transition="all 0.5s linear",e.style.opacity="1"},300)}},[y]),/* @__PURE__ */e("g",{ref:x,children:/* @__PURE__ */t("g",{cursor:"default",children:[V(l)&&/* @__PURE__ */e("text",{transform:`translate(${m.x}, ${p.company})`,fill:M,textAnchor:m.anchor,dominantBaseline:"middle",fontWeight:"700",fontSize:"12",style:v,onMouseEnter:()=>d?.("company"),onMouseLeave:g,children:u}),V(s)&&/* @__PURE__ */e("text",{transform:`translate(${c.x}, ${p.average})`,fill:M,fontSize:"12",fontWeight:"500",textAnchor:c.anchor,dominantBaseline:"middle",style:v,onMouseEnter:()=>d?.("average"),onMouseLeave:g,children:f})]})})};export{r as GaugeLabels};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { GaugeMarkersProps } from '../types';
|
|
2
|
-
export declare const GaugeMarkers: ({ scale, companyValue, averageValue, markersYPosition, companyMarkerY, averageMarkerY, animated, minValue, maxValue,
|
|
2
|
+
export declare const GaugeMarkers: ({ scale, companyValue, averageValue, markersYPosition, companyMarkerY, averageMarkerY, animated, minValue, maxValue, onTooltipOpen, onTooltipClose, }: GaugeMarkersProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,8 +1,10 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useRef as r,useEffect as a}from"react";import{GAUGE_CONSTANTS as
|
|
2
|
-
return e("g",{transform:`translate(${
|
|
3
|
-
/* @__PURE__ */t("circle",{cy:
|
|
4
|
-
/* @__PURE__ */t("line",{y1:
|
|
5
|
-
/* @__PURE__ */t("
|
|
6
|
-
/* @__PURE__ */t("
|
|
7
|
-
/* @__PURE__ */t("
|
|
8
|
-
/* @__PURE__ */t("circle",{cy:
|
|
1
|
+
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useRef as r,useEffect as a}from"react";import{GAUGE_CONSTANTS as n}from"../constants.js";import{useTheme as o}from"@mui/material";const s=({scale:s,companyValue:i,averageValue:l,markersYPosition:c,companyMarkerY:m,averageMarkerY:y,animated:E=!1,minValue:p,maxValue:A,onTooltipOpen:R,onTooltipClose:d})=>{const u=o(),g=r(null),G={transition:E?"transform 0.3s linear":"none"},h=u.custom.grey[2800],f=e=>e>=p&&e<=A;return a(()=>{if(g.current&&E){const e=g.current;e.style.opacity="0",setTimeout(()=>{e.style.transition="all 0.5s linear",e.style.opacity="1"},300)}},[E]),/* @__PURE__ */e("g",{ref:g,children:[[p,A].map((r,a)=>{const o=`edge-${a}`,i=n.GAUGE_PADDING+s(r);/* @__PURE__ */
|
|
2
|
+
return e("g",{transform:`translate(${i}, 0)`,style:G,children:[
|
|
3
|
+
/* @__PURE__ */t("circle",{cy:c,r:n.MARKER.EDGE_RADIUS,fill:h}),
|
|
4
|
+
/* @__PURE__ */t("line",{y1:c-n.GAUGE_HEIGHT/2,y2:c+n.GAUGE_HEIGHT/2,stroke:h,strokeWidth:"2"})]},o)}),f(i)&&/* @__PURE__ */e("g",{"data-testid":"horizontal-gauge-company-marker",transform:`translate(${n.GAUGE_PADDING+s(i)}, 0)`,style:G,children:[
|
|
5
|
+
/* @__PURE__ */t("circle",{"data-testid":"horizontal-gauge-company-hit-area",cy:c,r:n.MARKER.HIT_RADIUS,fill:"transparent",style:{pointerEvents:"all"},onMouseEnter:()=>R?.("company"),onMouseLeave:d}),
|
|
6
|
+
/* @__PURE__ */t("line",{y1:m.start,y2:m.end,stroke:h,strokeWidth:"1",style:{pointerEvents:"none"}}),
|
|
7
|
+
/* @__PURE__ */t("circle",{cy:c,r:n.MARKER.COMPANY_RADIUS,stroke:h,strokeWidth:n.MARKER.COMPANY_STROKE_WIDTH,fill:u.palette.common.white,style:{pointerEvents:"none"}})]}),f(l)&&/* @__PURE__ */e("g",{"data-testid":"horizontal-gauge-average-marker",transform:`translate(${n.GAUGE_PADDING+s(l)}, 0)`,style:G,children:[
|
|
8
|
+
/* @__PURE__ */t("circle",{"data-testid":"horizontal-gauge-average-hit-area",cy:c,r:n.MARKER.HIT_RADIUS,fill:"transparent",style:{pointerEvents:"all"},onMouseEnter:()=>R?.("average"),onMouseLeave:d}),
|
|
9
|
+
/* @__PURE__ */t("line",{y1:y.start,y2:y.end,stroke:h,strokeWidth:"1",style:{pointerEvents:"none"}}),
|
|
10
|
+
/* @__PURE__ */t("circle",{cy:c,r:n.MARKER.AVERAGE_RADIUS,fill:u.palette.common.white,stroke:h,strokeWidth:n.MARKER.AVERAGE_STROKE_WIDTH,style:{pointerEvents:"none"}})]})]})};export{s as GaugeMarkers};
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import{jsx as e,Fragment as a,jsxs as t}from"react/jsx-runtime";import{useRef as n,useState as r,useMemo as i,useCallback as o,useLayoutEffect as m}from"react";import{useTheme as s,Typography as l,Box as u,Stack as c}from"@mui/material";import{GAUGE_CONSTANTS as d}from"../constants.js";import{formatValue as p}from"../utils/formatters.js";import{INITIAL_STATISTIC_LAYOUT as T,getFittingAnchor as x,assignStatisticLanes as g}from"../utils/statisticLayout.js";import{FoodsTags as h}from"../../../Tags/FoodsTags.js";const b=b=>{const{minValue:I,medianValue:S,maxValue:f,labelMinimum:A,labelMedian:_,labelMaximum:C,labelPositions:v,showMedian:y,height:L,animated:E,precision:O=0,valueFormatter:N,onLaneCountChange:U,onMedianLaneChange:w}=b,G=s(),j=n({minimum:null,median:null,maximum:null}),[F,$]=r(T),z=Number.parseFloat(G.spacing(d.LAYOUT.STATISTIC_LANE_SPACING_UNITS)),M=Number.parseFloat(G.spacing(d.LAYOUT.STATISTIC_COLLISION_GAP_UNITS)),R=v.min.x,Y=v.max.x,P=R+(Y-R)/2,V=i(()=>({minimum:N?N(I,O):p(I,O),median:N?N(S,O):p(S,O),maximum:N?N(f,O):p(f,O)}),[f,S,I,O,N]),B=i(()=>({minimum:A,median:_,maximum:C}),[C,_,A]),X=i(()=>({minimum:v.min,median:v.median,maximum:v.max}),[v.max,v.median,v.min]),k=i(()=>y?["minimum","median","maximum"]:["minimum","maximum"],[y]),D=o(()=>{const e=k.map(e=>{const a=j.current[e]?.getBoundingClientRect().width??0,t="median"===e?x(X[e],a,R,Y):X[e].anchor;return{id:e,x:X[e].x,width:a,anchor:t}}),a=g(e,M),t=k.reduce((t,n)=>(t[n]={anchor:e.find(e=>e.id===n)?.anchor??X[n].anchor,lane:a[n]},t),{...T}),n=Math.max(...Object.values(a))+1;$(e=>k.every(a=>e[a].anchor===t[a].anchor&&e[a].lane===t[a].lane)?e:t),U(n),w(y?a.median:0)},[M,Y,R,U,w,X,y,k]);return m(()=>{if(D(),"undefined"==typeof ResizeObserver)return;const e=new ResizeObserver(D);return Object.values(j.current).forEach(a=>a&&e.observe(a)),()=>e.disconnect()},[D]),/* @__PURE__ */e(a,{children:k.map(a=>{const n=X[a].x>P,r=/* @__PURE__ */e(l,{variant:"small-bold",color:G.custom.grey[2800],sx:{..."minimum"===a&&{mr:"-0.5px",transform:"translateX(-0.5px)"},..."maximum"===a&&{ml:"-0.5px",transform:"translateX(0.5px)"}},children:V[a]},"value"),i=Boolean(B[a].trim())&&/* @__PURE__ */t(u,{component:"span",sx:{display:"inline-flex",position:"relative"},children:[
|
|
2
|
+
/* @__PURE__ */e(u,{component:"span","aria-hidden":"true","data-testid":`horizontal-gauge-statistic-${a}-caret`,sx:{backgroundColor:G.custom.grey[500],borderBottom:n?0:`1px solid ${G.custom.grey[600]}`,borderLeft:n?0:`1px solid ${G.custom.grey[600]}`,borderRight:n?`1px solid ${G.custom.grey[600]}`:0,borderTop:n?`1px solid ${G.custom.grey[600]}`:0,boxSizing:"border-box",height:G.spacing(d.LAYOUT.STATISTIC_TAG_CARET_SIZE_UNITS),left:n?"auto":0,pointerEvents:"none",position:"absolute",right:n?0:"auto",top:"50%",transform:n?"translate(50%, -50%) rotate(45deg)":"translate(-50%, -50%) rotate(45deg)",width:G.spacing(d.LAYOUT.STATISTIC_TAG_CARET_SIZE_UNITS),zIndex:1}}),
|
|
3
|
+
/* @__PURE__ */e(h,{variant:"tags-grey",label:B[a],sx:{backgroundColor:G.custom.grey[500],borderColor:G.custom.grey[600],minWidth:"auto",px:.625,pointerEvents:"none"}})]},"tag");/* @__PURE__ */
|
|
4
|
+
return e(c,{ref:e=>{j.current[a]=e},"data-testid":`horizontal-gauge-statistic-${a}`,"data-anchor":F[a].anchor,"data-lane":F[a].lane,sx:{alignItems:"center",flexDirection:"row",position:"absolute",left:X[a].x,top:L-d.LEGEND_HEIGHT+Number.parseFloat(G.spacing(d.LAYOUT.STATISTIC_TOP_OFFSET_UNITS))+F[a].lane*z,transform:`translateX(${o=F[a].anchor,"start"===o?"0":"end"===o?"-100%":"-50%"})`,gap:G.spacing(d.LAYOUT.STATISTIC_VALUE_TAG_GAP_UNITS),opacity:1,transition:E?G.transitions.create(["transform","opacity"]):"none",whiteSpace:"nowrap",pointerEvents:"none"},children:n?[i,r]:[r,i]},a);var o})})};export{b as GaugeStatistics};
|
|
@@ -14,6 +14,7 @@ export declare const GAUGE_CONSTANTS: {
|
|
|
14
14
|
readonly AVERAGE_RADIUS: 3;
|
|
15
15
|
readonly AVERAGE_STROKE_WIDTH: 2;
|
|
16
16
|
readonly EDGE_RADIUS: 3;
|
|
17
|
+
readonly HIT_RADIUS: 22;
|
|
17
18
|
};
|
|
18
19
|
readonly COLORS: {
|
|
19
20
|
readonly BORDER: "#E0DEDD";
|
|
@@ -43,5 +44,11 @@ export declare const GAUGE_CONSTANTS: {
|
|
|
43
44
|
readonly TITLE_OFFSET: 35;
|
|
44
45
|
readonly VALUES_LABEL_OFFSET: 28;
|
|
45
46
|
readonly LEGEND_LABEL_OFFSET: 8;
|
|
47
|
+
readonly STATISTIC_LANE_SPACING_UNITS: 4;
|
|
48
|
+
readonly STATISTIC_COLLISION_GAP_UNITS: 1;
|
|
49
|
+
readonly STATISTIC_TOP_OFFSET_UNITS: 1;
|
|
50
|
+
readonly STATISTIC_VALUE_TAG_GAP_UNITS: 1;
|
|
51
|
+
readonly STATISTIC_TAG_CARET_SIZE_UNITS: 0.75;
|
|
52
|
+
readonly MEDIAN_GUIDE_GAP_UNITS: 0.5;
|
|
46
53
|
};
|
|
47
54
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const E={DEFAULT_WIDTH:500,DEFAULT_HEIGHT:220,GAUGE_HEIGHT:28,GAUGE_PADDING:8,LEGEND_HEIGHT:48,FONT_SIZE:{DEFAULT:12},MARKER:{COMPANY_RADIUS:5,COMPANY_STROKE_WIDTH:3,AVERAGE_RADIUS:3,AVERAGE_STROKE_WIDTH:2,EDGE_RADIUS:3},COLORS:{BORDER:"#E0DEDD",GRADIENT:{START:"#F0DF46",END:"#EB9411"}},BORDER_DASH_PATTERN:"4 4",TEXT:{DEFAULT_COMPANY_LABEL:"",DEFAULT_AVERAGE_LABEL:"",DEFAULT_MINIMUM_LABEL:"Min",DEFAULT_MEDIAN_LABEL:"Median",DEFAULT_MAXIMUM_LABEL:"Max"},LAYOUT:{COMPANY_MARKER_OFFSET:18,AVERAGE_MARKER_TOP_OFFSET:12,AVERAGE_MARKER_BOTTOM_OFFSET:4,COMPANY_LABEL_VERTICAL_RATIO:.25,AVERAGE_LABEL_VERTICAL_RATIO:.75,COMPANY_LABEL_OFFSET:8,AVERAGE_LABEL_OFFSET:12,TITLE_OFFSET:35,VALUES_LABEL_OFFSET:28,LEGEND_LABEL_OFFSET:8}};export{E as GAUGE_CONSTANTS};
|
|
1
|
+
const E={DEFAULT_WIDTH:500,DEFAULT_HEIGHT:220,GAUGE_HEIGHT:28,GAUGE_PADDING:8,LEGEND_HEIGHT:48,FONT_SIZE:{DEFAULT:12},MARKER:{COMPANY_RADIUS:5,COMPANY_STROKE_WIDTH:3,AVERAGE_RADIUS:3,AVERAGE_STROKE_WIDTH:2,EDGE_RADIUS:3,HIT_RADIUS:22},COLORS:{BORDER:"#E0DEDD",GRADIENT:{START:"#F0DF46",END:"#EB9411"}},BORDER_DASH_PATTERN:"4 4",TEXT:{DEFAULT_COMPANY_LABEL:"",DEFAULT_AVERAGE_LABEL:"",DEFAULT_MINIMUM_LABEL:"Min",DEFAULT_MEDIAN_LABEL:"Median",DEFAULT_MAXIMUM_LABEL:"Max"},LAYOUT:{COMPANY_MARKER_OFFSET:18,AVERAGE_MARKER_TOP_OFFSET:12,AVERAGE_MARKER_BOTTOM_OFFSET:4,COMPANY_LABEL_VERTICAL_RATIO:.25,AVERAGE_LABEL_VERTICAL_RATIO:.75,COMPANY_LABEL_OFFSET:8,AVERAGE_LABEL_OFFSET:12,TITLE_OFFSET:35,VALUES_LABEL_OFFSET:28,LEGEND_LABEL_OFFSET:8,STATISTIC_LANE_SPACING_UNITS:4,STATISTIC_COLLISION_GAP_UNITS:1,STATISTIC_TOP_OFFSET_UNITS:1,STATISTIC_VALUE_TAG_GAP_UNITS:1,STATISTIC_TAG_CARET_SIZE_UNITS:.75,MEDIAN_GUIDE_GAP_UNITS:.5}};export{E as GAUGE_CONSTANTS};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { GaugeCalculationProps, GaugeCalculations } from '../types';
|
|
2
|
-
export declare const useGaugeCalculations: ({ minValue, maxValue, companyValue, averageValue, labelCompany, labelAverage, width, height, }: GaugeCalculationProps) => GaugeCalculations;
|
|
2
|
+
export declare const useGaugeCalculations: ({ minValue, maxValue, medianValue, companyValue, averageValue, labelCompany, labelAverage, width, height, }: GaugeCalculationProps) => GaugeCalculations;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{GAUGE_CONSTANTS as A}from"../constants.js";import{getLabelPosition as E,createScale as a}from"../utils/utils.js";const
|
|
1
|
+
import{GAUGE_CONSTANTS as A}from"../constants.js";import{getLabelPosition as E,createScale as a}from"../utils/utils.js";const G=({minValue:G,maxValue:e,medianValue:_,companyValue:T,averageValue:n,labelCompany:t,labelAverage:O,width:L,height:o})=>{const r=a(G,e,L),i=Math.min(L-A.GAUGE_PADDING,Math.max(A.GAUGE_PADDING,A.GAUGE_PADDING+r(_))),U=E(T,t,r,L),m=E(n,O,r,L),l=o/2,s=l-A.GAUGE_HEIGHT,Y=s+A.GAUGE_HEIGHT/2,F={start:l-A.LAYOUT.COMPANY_MARKER_OFFSET,end:s-A.LAYOUT.COMPANY_MARKER_OFFSET},I={start:l-A.LAYOUT.AVERAGE_MARKER_TOP_OFFSET,end:l+A.GAUGE_HEIGHT-A.LAYOUT.AVERAGE_MARKER_BOTTOM_OFFSET},P={company:o*A.LAYOUT.COMPANY_LABEL_VERTICAL_RATIO-A.LAYOUT.COMPANY_LABEL_OFFSET,average:o*A.LAYOUT.AVERAGE_LABEL_VERTICAL_RATIO-A.LAYOUT.AVERAGE_LABEL_OFFSET,title:s-A.LAYOUT.TITLE_OFFSET,values:o-A.LAYOUT.VALUES_LABEL_OFFSET,legend:o-A.LAYOUT.LEGEND_LABEL_OFFSET},R={min:{x:A.GAUGE_PADDING,anchor:"start"},median:{x:i,anchor:"middle"},max:{x:L-A.GAUGE_PADDING,anchor:"end"}};return{scale:r,companyPosition:U,averagePosition:m,gaugeBackgroundProps:{x:A.GAUGE_PADDING,y:Y-A.GAUGE_HEIGHT/2,width:L-2*A.GAUGE_PADDING,height:A.GAUGE_HEIGHT,animated:!1},markerY:Y,companyMarkerY:F,averageMarkerY:I,labelY:P,labelPositions:R,medianPosition:i}};export{G as useGaugeCalculations};
|
|
@@ -62,6 +62,7 @@ export type LabelXPositions = {
|
|
|
62
62
|
export type GaugeCalculationProps = {
|
|
63
63
|
minValue: number;
|
|
64
64
|
maxValue: number;
|
|
65
|
+
medianValue: number;
|
|
65
66
|
companyValue: number;
|
|
66
67
|
averageValue: number;
|
|
67
68
|
labelCompany: string;
|
|
@@ -80,14 +81,17 @@ export type GaugeCalculations = {
|
|
|
80
81
|
averageMarkerY: MarkerYPositions;
|
|
81
82
|
labelY: LabelYPositions;
|
|
82
83
|
labelPositions: LabelXPositions;
|
|
84
|
+
medianPosition: number;
|
|
83
85
|
};
|
|
84
86
|
export type GaugeBordersProps = {
|
|
85
87
|
width: number;
|
|
86
88
|
height: number;
|
|
87
|
-
|
|
88
|
-
|
|
89
|
+
medianPosition: number;
|
|
90
|
+
medianGuideEndY: number;
|
|
91
|
+
showMedian: boolean;
|
|
89
92
|
animated: boolean;
|
|
90
93
|
};
|
|
94
|
+
export type GaugeTooltipTarget = "company" | "average";
|
|
91
95
|
export type GaugeMarkersProps = {
|
|
92
96
|
width: number;
|
|
93
97
|
companyValue: number;
|
|
@@ -99,29 +103,36 @@ export type GaugeMarkersProps = {
|
|
|
99
103
|
minValue: number;
|
|
100
104
|
maxValue: number;
|
|
101
105
|
animated: boolean;
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
labelCompany?: string;
|
|
105
|
-
labelAverage?: string;
|
|
106
|
-
valueFormatter?: (value: number, precision?: number) => string;
|
|
106
|
+
onTooltipOpen?: (target: GaugeTooltipTarget) => void;
|
|
107
|
+
onTooltipClose?: () => void;
|
|
107
108
|
};
|
|
108
109
|
export type GaugeLabelsProps = {
|
|
109
110
|
minValue: number;
|
|
110
111
|
maxValue: number;
|
|
111
|
-
medianValue: number;
|
|
112
112
|
companyValue: number;
|
|
113
113
|
averageValue: number;
|
|
114
114
|
companyPosition: LabelPosition;
|
|
115
115
|
averagePosition: LabelPosition;
|
|
116
116
|
labelCompany: string;
|
|
117
117
|
labelAverage: string;
|
|
118
|
+
labelYPositions: LabelYPositions;
|
|
119
|
+
animated: boolean;
|
|
120
|
+
onTooltipOpen?: (target: GaugeTooltipTarget) => void;
|
|
121
|
+
onTooltipClose?: () => void;
|
|
122
|
+
};
|
|
123
|
+
export type GaugeStatisticsProps = {
|
|
124
|
+
minValue: number;
|
|
125
|
+
medianValue: number;
|
|
126
|
+
maxValue: number;
|
|
118
127
|
labelMinimum: string;
|
|
119
128
|
labelMedian: string;
|
|
120
129
|
labelMaximum: string;
|
|
121
|
-
labelYPositions: LabelYPositions;
|
|
122
130
|
labelPositions: LabelXPositions;
|
|
131
|
+
showMedian: boolean;
|
|
132
|
+
height: number;
|
|
123
133
|
animated: boolean;
|
|
124
134
|
precision?: number;
|
|
125
|
-
unit?: string;
|
|
126
135
|
valueFormatter?: (value: number, precision?: number) => string;
|
|
136
|
+
onLaneCountChange: (laneCount: number) => void;
|
|
137
|
+
onMedianLaneChange: (lane: number) => void;
|
|
127
138
|
};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { LabelPosition, TextAnchor } from '../types';
|
|
2
|
+
export type StatisticId = "minimum" | "median" | "maximum";
|
|
3
|
+
export type StatisticItem = {
|
|
4
|
+
id: StatisticId;
|
|
5
|
+
x: number;
|
|
6
|
+
width: number;
|
|
7
|
+
anchor: TextAnchor;
|
|
8
|
+
};
|
|
9
|
+
export type StatisticLayout = Record<StatisticId, {
|
|
10
|
+
anchor: TextAnchor;
|
|
11
|
+
lane: number;
|
|
12
|
+
}>;
|
|
13
|
+
export declare const INITIAL_STATISTIC_LAYOUT: StatisticLayout;
|
|
14
|
+
export declare const getFittingAnchor: (position: LabelPosition, width: number, minimumX: number, maximumX: number) => TextAnchor;
|
|
15
|
+
export declare const assignStatisticLanes: (items: StatisticItem[], gap: number) => Record<StatisticId, number>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
const t={minimum:{anchor:"start",lane:0},median:{anchor:"middle",lane:0},maximum:{anchor:"end",lane:0}},e=({x:t,width:e,anchor:n})=>"start"===n?{left:t,right:t+e}:"end"===n?{left:t-e,right:t}:{left:t-e/2,right:t+e/2},n=(t,e,n,i)=>t.x-e/2<=n?"start":t.x+e/2>=i?"end":t.anchor,i=(t,n)=>{const i=[],r={},a={minimum:0,maximum:1,median:2};return t.map(t=>({...t,...e(t)})).sort((t,e)=>a[t.id]-a[e.id]).forEach(t=>{const e=i.findIndex(e=>e.every(e=>e.right+n<=t.left||t.right+n<=e.left)),a=-1===e?i.length:e;i[a]=[...i[a]??[],{left:t.left,right:t.right}],r[t.id]=a}),r};export{t as INITIAL_STATISTIC_LAYOUT,i as assignStatisticLanes,n as getFittingAnchor};
|
|
@@ -1,20 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
type PolymorphicChartTooltipProps
|
|
3
|
-
active?: boolean;
|
|
4
|
-
hoveredIndex: number | null;
|
|
5
|
-
data: Array<{
|
|
6
|
-
name: string;
|
|
7
|
-
value: number;
|
|
8
|
-
color: string;
|
|
9
|
-
index?: number;
|
|
10
|
-
}>;
|
|
11
|
-
coordinate?: {
|
|
12
|
-
x: number;
|
|
13
|
-
y: number;
|
|
14
|
-
};
|
|
15
|
-
formatter?: (value: number, precision?: number) => string;
|
|
16
|
-
unit?: string;
|
|
17
|
-
icons?: ReactNode[];
|
|
18
|
-
};
|
|
19
|
-
export declare const PolymorphicChartTooltip: (props: PolymorphicChartTooltipProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
20
|
-
export {};
|
|
1
|
+
export { ChartTooltip as PolymorphicChartTooltip } from '../shared/ChartTooltip';
|
|
2
|
+
export type { ChartTooltipProps as PolymorphicChartTooltipProps } from '../shared/ChartTooltip';
|
|
@@ -1,19 +1,19 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useRef as i,useState as r}from"react";import{useTheme as n,Box as a}from"@mui/material";import{ResponsiveContainer as o,BarChart as s,CartesianGrid as l,XAxis as d,YAxis as m,Bar as
|
|
1
|
+
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useRef as i,useState as r}from"react";import{useTheme as n,Box as a}from"@mui/material";import{ResponsiveContainer as o,BarChart as s,CartesianGrid as l,XAxis as d,YAxis as m,Bar as h,Cell as c,Label as p,Rectangle as u}from"recharts";import y from"chroma-js";import{FoodsBadge as v}from"../../../Badge/FoodsBadge.js";import{ChartTooltip as f}from"../../shared/ChartTooltip.js";const g={top:35,right:10,left:20,bottom:0},k=k=>{const x=n(),{data:b,HoveredChartElementIndex:L,showTooltip:w,valuesFormatterFn:A=(e,t)=>x.numbers.valueFormatterFn(e,t),valuesUnit:F,icons:M,isLoading:E,height:K,onMouseEnter:$,onMouseLeave:D,onLegendAction:j}=k,C="number"==typeof K?K:300,z=i([]),S=i([]),T=i([]),[W,B]=r(!1),I=!W;if(E){const i=Math.max(4,b?.length??6),r=Array.from({length:i}).map((e,t)=>({name:`${t}`,value:100*Math.random()})),n=x.palette.action.hover;/* @__PURE__ */
|
|
2
2
|
return e(a,{position:"relative",width:"100%",height:C,sx:{"@keyframes pulse":{"0%":{opacity:.2},"50%":{opacity:1},"100%":{opacity:.2}}},children:/* @__PURE__ */e(o,{width:"100%",height:"100%",style:{outline:"none"},children:/* @__PURE__ */t(s,{data:r,margin:g,children:[
|
|
3
3
|
/* @__PURE__ */e(l,{strokeDasharray:"4 4",stroke:x.palette.divider,vertical:!1}),
|
|
4
4
|
/* @__PURE__ */e(d,{dataKey:"name",tick:!1,axisLine:{stroke:x.palette.divider},tickLine:!1}),
|
|
5
5
|
/* @__PURE__ */e(m,{hide:!0,domain:[0,100]}),
|
|
6
|
-
/* @__PURE__ */e(
|
|
7
|
-
return t(a,
|
|
6
|
+
/* @__PURE__ */e(h,{dataKey:"value",isAnimationActive:!1,style:{pointerEvents:"none"},radius:[4,4,0,0],children:r.map((t,i)=>/* @__PURE__ */e(c,{fill:n,style:{animation:"pulse 1.5s ease-in-out infinite"}},`sk-${i}`))})]})})})}const N=0===(b?.length??0)||b.every(e=>0===Number(e.value));/* @__PURE__ */
|
|
7
|
+
return t(a,N?{position:"relative",width:"100%",height:C,children:[
|
|
8
8
|
/* @__PURE__ */e(o,{width:"100%",height:"100%",style:{outline:"none"},children:/* @__PURE__ */t(s,{data:[{name:"empty",value:1}],margin:g,children:[
|
|
9
9
|
/* @__PURE__ */e(l,{strokeDasharray:"4 4",stroke:x.palette.divider,vertical:!1}),
|
|
10
10
|
/* @__PURE__ */e(d,{dataKey:"name",tick:!1,axisLine:{stroke:x.palette.divider},tickLine:!1}),
|
|
11
11
|
/* @__PURE__ */e(m,{hide:!0,domain:[0,1]}),
|
|
12
|
-
/* @__PURE__ */e(
|
|
13
|
-
/* @__PURE__ */e(
|
|
12
|
+
/* @__PURE__ */e(h,{dataKey:"value",isAnimationActive:!1,radius:[4,4,0,0],style:{pointerEvents:"none"},children:/* @__PURE__ */e(c,{fill:"rgba(0, 0, 0, 0)"})})]})}),
|
|
13
|
+
/* @__PURE__ */e(v,{size:4,icon:"empty",boxProps:{sx:{borderRadius:"3px",backgroundColor:x.custom.grey[400],color:x.custom.grey[1400],position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)"}}})]}:{position:"relative",width:"100%",height:C,children:[
|
|
14
14
|
/* @__PURE__ */e(o,{width:"100%",height:"100%",style:{outline:"none"},children:/* @__PURE__ */t(s,{data:b,margin:g,children:[
|
|
15
15
|
/* @__PURE__ */e(d,{dataKey:"name",strokeDasharray:"4 4",strokeWidth:0,tick:!1,axisLine:{stroke:x.palette.divider},tickLine:!1,interval:"equidistantPreserveStart",padding:{left:0,right:0}}),
|
|
16
16
|
/* @__PURE__ */e(m,{width:"auto",tick:{fontFamily:"Montserrat",fontSize:14,style:{transform:`translateX(-${x.spacing(1)})`}},axisLine:{stroke:x.palette.divider},tickLine:!1,tickFormatter:e=>A(Number(e)),children:/* @__PURE__ */e(p,{value:F,position:"insideTopLeft",style:{fontFamily:"Montserrat",fontSize:"14px",transform:`translate(-${x.spacing(1.5)}, -${x.spacing(5)})`}})}),
|
|
17
17
|
/* @__PURE__ */e(l,{strokeDasharray:"4 4",stroke:x.palette.divider,vertical:!1}),
|
|
18
|
-
/* @__PURE__ */e(
|
|
19
|
-
return e(u,{x:i,y:r,width:n,height:a,radius:[4,4,0,0],fill:m,stroke:t.stroke,strokeWidth:t.strokeWidth,style:{transition:"all 0.2s ease-in-out",filter:d?`drop-shadow(0 0 2px ${l})`:"none"},onMouseEnter:d?void 0:()=>$(s),onMouseLeave:()=>D()})}})]})}),w&&null!==L&&(()=>{const t=z.current[L],i=
|
|
18
|
+
/* @__PURE__ */e(h,{dataKey:"value",radius:[4,4,0,0],animationDuration:300,isAnimationActive:I,onAnimationEnd:()=>B(!0),onClick:(e,t)=>{j&&j(t)},style:{cursor:"pointer"},shape:t=>{const{x:i,y:r,width:n,height:a,payload:o}=t,s=o?.index??0;"number"==typeof i&&"number"==typeof n&&(z.current[s]=i+n/2),"number"==typeof r&&(S.current[s]=r),"number"==typeof a&&(T.current[s]=a);const l=o?.color??x.palette.primary.main,d=L===s,m=null===L||d?l:y(l).alpha(.4).css();/* @__PURE__ */
|
|
19
|
+
return e(u,{x:i,y:r,width:n,height:a,radius:[4,4,0,0],fill:m,stroke:t.stroke,strokeWidth:t.strokeWidth,style:{transition:"all 0.2s ease-in-out",filter:d?`drop-shadow(0 0 2px ${l})`:"none"},onMouseEnter:d?void 0:()=>$(s),onMouseLeave:()=>D()})}})]})}),w&&null!==L&&(()=>{const t=z.current[L],i=S.current[L],r=T.current[L],n="number"==typeof i&&"number"==typeof r?i:C/2;return"number"!=typeof t||"number"!=typeof n?null:/* @__PURE__ */e(f,{active:!0,hoveredIndex:L,data:b.map((e,t)=>({...e,index:t})),coordinate:{x:t,y:n},formatter:A,unit:F,icons:M})})()]})};export{k as PolymorphicBarChart};
|
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useRef as i,useState as
|
|
2
|
-
return e(n,{position:"relative",width:"100%",height:W,sx:{"@keyframes pulse":{"0%":{opacity:.2},"50%":{opacity:1},"100%":{opacity:.2}}},children:/* @__PURE__ */e(a,{width:"100%",height:"100%",style:{outline:"none"},children:/* @__PURE__ */t(s,{data:
|
|
1
|
+
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useRef as i,useState as r}from"react";import{useTheme as o,Box as n}from"@mui/material";import{ResponsiveContainer as a,LineChart as s,CartesianGrid as l,XAxis as d,YAxis as m,Tooltip as c,Line as p,Label as h}from"recharts";import u from"chroma-js";import{FoodsBadge as y}from"../../../Badge/FoodsBadge.js";import{ChartTooltip as v}from"../../shared/ChartTooltip.js";const f={top:35,right:10,left:20,bottom:0},k=k=>{const g=o(),{data:x,HoveredChartElementIndex:A,showTooltip:b,valuesFormatterFn:w=(e,t)=>g.numbers.valueFormatterFn(e,t),valuesUnit:L,icons:M,isLoading:F,height:D,onMouseEnter:E,onMouseLeave:K,onLegendAction:S}=k,W="number"==typeof D?D:300,$=x.length>0?x[0].color:g.palette.primary.main,j=i([]),[z,C]=r(!1),T=!z,B=g.palette.primary.main;if(F){const i=Math.max(5,Math.min(9,x?.length||7)),r=Array.from({length:i}).map((e,t)=>({name:`${t}`,value:100*Math.random()})),o=g.palette.action.hover;/* @__PURE__ */
|
|
2
|
+
return e(n,{position:"relative",width:"100%",height:W,sx:{"@keyframes pulse":{"0%":{opacity:.2},"50%":{opacity:1},"100%":{opacity:.2}}},children:/* @__PURE__ */e(a,{width:"100%",height:"100%",style:{outline:"none"},children:/* @__PURE__ */t(s,{data:r,margin:f,children:[
|
|
3
3
|
/* @__PURE__ */e(l,{strokeDasharray:"4 4",stroke:g.palette.divider,vertical:!1}),
|
|
4
4
|
/* @__PURE__ */e(d,{dataKey:"name",tick:!1,axisLine:{stroke:g.palette.divider},tickLine:!1}),
|
|
5
5
|
/* @__PURE__ */e(m,{hide:!0,domain:[0,100]}),
|
|
6
6
|
/* @__PURE__ */e(c,{cursor:!1,wrapperStyle:{display:"none"},isAnimationActive:!1}),
|
|
7
|
-
/* @__PURE__ */e(p,{type:"monotone",dataKey:"value",stroke:
|
|
8
|
-
return t(n,
|
|
7
|
+
/* @__PURE__ */e(p,{type:"monotone",dataKey:"value",stroke:o,strokeWidth:3,dot:{r:5,stroke:o,fill:o},isAnimationActive:!1,style:{pointerEvents:"none",animation:"pulse 1.5s ease-in-out infinite"}})]})})})}const I=0===(x?.length??0)||x.every(e=>0===Number(e.value));/* @__PURE__ */
|
|
8
|
+
return t(n,I?{position:"relative",width:"100%",height:W,children:[
|
|
9
9
|
/* @__PURE__ */e(a,{width:"100%",height:"100%",style:{outline:"none"},children:/* @__PURE__ */t(s,{data:[{name:"e1",value:1},{name:"e2",value:1}],margin:f,children:[
|
|
10
10
|
/* @__PURE__ */e(l,{strokeDasharray:"4 4",stroke:g.palette.divider,vertical:!1}),
|
|
11
11
|
/* @__PURE__ */e(d,{dataKey:"name",tick:!1,axisLine:{stroke:g.palette.divider},tickLine:!1}),
|
|
12
12
|
/* @__PURE__ */e(m,{hide:!0,domain:[0,1]}),
|
|
13
13
|
/* @__PURE__ */e(c,{cursor:!1,wrapperStyle:{display:"none"},isAnimationActive:!1}),
|
|
14
14
|
/* @__PURE__ */e(p,{type:"monotone",dataKey:"value",strokeWidth:0,dot:!1,isAnimationActive:!1,style:{pointerEvents:"none"}})]})}),
|
|
15
|
-
/* @__PURE__ */e(
|
|
15
|
+
/* @__PURE__ */e(y,{size:4,icon:"empty",boxProps:{sx:{borderRadius:"3px",backgroundColor:g.custom.grey[400],color:g.custom.grey[1400],position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)"}}})]}:{position:"relative",width:"100%",height:W,children:[
|
|
16
16
|
/* @__PURE__ */e(a,{width:"100%",height:"100%",style:{outline:"none"},children:/* @__PURE__ */t(s,{data:x,margin:f,children:[
|
|
17
17
|
/* @__PURE__ */e(l,{strokeDasharray:"4 4",stroke:g.palette.divider,vertical:!1}),
|
|
18
18
|
/* @__PURE__ */e(d,{dataKey:"name",strokeDasharray:"4 4",strokeWidth:0,tick:!1,axisLine:{stroke:g.palette.divider},interval:"equidistantPreserveStart",padding:{left:0,right:0}}),
|
|
19
19
|
/* @__PURE__ */e(m,{width:"auto",tick:{fontFamily:"Montserrat",fontSize:14,style:{transform:`translateX(-${g.spacing(1)})`}},axisLine:{stroke:g.palette.divider},tickLine:!1,tickFormatter:e=>w(Number(e)),children:/* @__PURE__ */e(h,{value:L,position:"insideTopLeft",style:{fontFamily:"Montserrat",fontSize:"14px",transform:`translate(-${g.spacing(1.5)}, -${g.spacing(5)})`}})}),
|
|
20
|
-
/* @__PURE__ */e(p,{type:"monotone",dataKey:"value",stroke:
|
|
21
|
-
return e("g",{children:/* @__PURE__ */e("circle",{cx:i,cy:
|
|
22
|
-
/* @__PURE__ */e(c,{cursor:!1,wrapperStyle:{display:"none"},isAnimationActive:!1})]})}),b&&null!==A&&(()=>{const t=A,i=j.current[t];return i?/* @__PURE__ */e(
|
|
20
|
+
/* @__PURE__ */e(p,{type:"monotone",dataKey:"value",stroke:B,strokeWidth:3,animationDuration:300,isAnimationActive:T,onAnimationEnd:()=>C(!0),dot:t=>{const{cx:i,cy:r,payload:o,index:n}=t,a="number"==typeof o?.index?o.index:0,s="number"==typeof n?n:a;"number"==typeof i&&"number"==typeof r&&(j.current[s]={x:i,y:r});const l=A===s,d=o?.color||$,m=null===A||l?d:u(d).alpha(.4).css();/* @__PURE__ */
|
|
21
|
+
return e("g",{children:/* @__PURE__ */e("circle",{cx:i,cy:r,r:6,fill:m,stroke:m,strokeWidth:0,onMouseEnter:()=>E(s),onMouseLeave:()=>K(),style:{cursor:"pointer",transition:"all 0.2s ease-in-out",filter:l?`drop-shadow(0 0 2px ${d})`:"none"}})})},activeDot:!1}),
|
|
22
|
+
/* @__PURE__ */e(c,{cursor:!1,wrapperStyle:{display:"none"},isAnimationActive:!1})]})}),b&&null!==A&&(()=>{const t=A,i=j.current[t];return i?/* @__PURE__ */e(v,{active:!0,hoveredIndex:t,data:x.map((e,t)=>({...e,index:t})),coordinate:{x:i.x,y:i.y},formatter:w,unit:L,icons:M}):null})()]})};export{k as PolymorphicLineChart};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useRef as i,useState as o}from"react";import{useTheme as r,Box as n}from"@mui/material";import{ResponsiveContainer as a,RadarChart as l,PolarGrid as s,Radar as d,Tooltip as c,PolarRadiusAxis as p}from"recharts";import u from"chroma-js";import{
|
|
1
|
+
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useRef as i,useState as o}from"react";import{useTheme as r,Box as n}from"@mui/material";import{ResponsiveContainer as a,RadarChart as l,PolarGrid as s,Radar as d,Tooltip as c,PolarRadiusAxis as p}from"recharts";import u from"chroma-js";import{FoodsBadge as m}from"../../../Badge/FoodsBadge.js";import{ChartTooltip as h}from"../../shared/ChartTooltip.js";const y=y=>{const f=r(),{data:v,HoveredChartElementIndex:g,showTooltip:x,valuesFormatterFn:A,valuesUnit:k,icons:b,isLoading:w,height:M,onMouseEnter:C,onMouseLeave:E,onLegendAction:R}=y,D=f.palette.primary.main,S="number"==typeof M?M:300,$=i(`radar-${Math.random().toString(36).slice(2)}`),L=`${$.current}-stroke`,T=`${$.current}-fill`,j=i([]),B=i(null),[F,K]=o(!1),O=!F;if(w){const i=f.palette.action.hover,o=[{name:"A",value:100*Math.random()},{name:"B",value:100*Math.random()},{name:"C",value:100*Math.random()},{name:"D",value:100*Math.random()},{name:"E",value:100*Math.random()}];/* @__PURE__ */
|
|
2
2
|
return e(n,{position:"relative",width:"100%",height:S,sx:{"@keyframes pulse":{"0%":{opacity:.2},"50%":{opacity:1},"100%":{opacity:.2}}},children:/* @__PURE__ */e(a,{width:"100%",height:"100%",style:{outline:"none"},children:/* @__PURE__ */t(l,{data:o,margin:{top:20,right:50,left:50,bottom:5},outerRadius:"85%",innerRadius:"0%",children:[
|
|
3
3
|
/* @__PURE__ */e(s,{stroke:f.palette.divider,gridType:"circle"}),
|
|
4
4
|
/* @__PURE__ */e(d,{dataKey:"value",stroke:i,fill:i,strokeWidth:2,fillOpacity:.25,isAnimationActive:!1,activeDot:!1,style:{pointerEvents:"none",animation:"pulse 1.5s ease-in-out infinite"}}),
|
|
@@ -8,7 +8,7 @@ return t(n,{position:"relative",width:"100%",height:S,children:[
|
|
|
8
8
|
/* @__PURE__ */e(s,{stroke:f.palette.divider,gridType:"circle"}),
|
|
9
9
|
/* @__PURE__ */e(d,{dataKey:"value",stroke:o,fill:o,fillOpacity:0,isAnimationActive:!1,activeDot:!1,style:{pointerEvents:"none"}}),
|
|
10
10
|
/* @__PURE__ */e(c,{cursor:!1,wrapperStyle:{display:"none"},isAnimationActive:!1})]})}),
|
|
11
|
-
/* @__PURE__ */e(
|
|
11
|
+
/* @__PURE__ */e(m,{size:4,icon:"empty",boxProps:{sx:{borderRadius:"3px",backgroundColor:f.custom.grey[400],color:f.custom.grey[1400],position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)"}}})]})}/* @__PURE__ */
|
|
12
12
|
return t(n,{position:"relative",width:"100%",height:S,children:[
|
|
13
13
|
/* @__PURE__ */e(a,{width:"100%",height:"100%",style:{outline:"none"},children:/* @__PURE__ */t(l,{data:v,margin:{top:20,right:50,left:50,bottom:5},outerRadius:"85%",innerRadius:"0%",accessibilityLayer:!0,children:[
|
|
14
14
|
/* @__PURE__ */t("defs",{children:[
|
|
@@ -22,4 +22,4 @@ return t(n,{position:"relative",width:"100%",height:S,children:[
|
|
|
22
22
|
/* @__PURE__ */e(p,{angle:90,domain:[0,"dataMax"],tick:{fontSize:10,fill:f.palette.text.secondary},tickFormatter:e=>A?A(e):e.toString()}),
|
|
23
23
|
/* @__PURE__ */e(d,{dataKey:"value",stroke:`url(#${L})`,fill:`url(#${T})`,strokeWidth:2,fillOpacity:.2,animationDuration:300,isAnimationActive:O,onAnimationEnd:()=>K(!0),activeDot:!1,dot:t=>{const{cx:i,cy:o,payload:r,index:n}=t,a="number"==typeof n?n:"number"==typeof r?.index?r.index:0,l=a>=0&&a<v.length;"number"==typeof i&&"number"==typeof o&&l&&(j.current[a]={x:i,y:o});const s=l&&g===a,d=l?v[a]?.color:D,c=null===g||s?d:u(d).alpha(.4).css();/* @__PURE__ */
|
|
24
24
|
return e("g",{children:/* @__PURE__ */e("circle",{cx:i,cy:o,r:6,fill:c,stroke:c,strokeWidth:0,style:{cursor:"pointer",transition:"all 0.2s ease-in-out",pointerEvents:"auto",filter:s?`drop-shadow(0 0 2px ${c})`:"none"},onMouseEnter:()=>C(l?a:0),onMouseLeave:()=>E()})})}}),
|
|
25
|
-
/* @__PURE__ */e(c,{cursor:!1,wrapperStyle:{display:"none"},isAnimationActive:!1})]})}),x&&null!==g&&(()=>{const t=g,i=B.current||j.current[t];return i?/* @__PURE__ */e(
|
|
25
|
+
/* @__PURE__ */e(c,{cursor:!1,wrapperStyle:{display:"none"},isAnimationActive:!1})]})}),x&&null!==g&&(()=>{const t=g,i=B.current||j.current[t];return i?/* @__PURE__ */e(h,{active:!0,hoveredIndex:t,data:v.map((e,t)=>({...e,index:t})),coordinate:{x:i.x,y:i.y},formatter:A,unit:k,icons:b}):null})()]})};export{y as PolymorphicRadarChart};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
export type ChartTooltipProps = {
|
|
3
|
+
active?: boolean;
|
|
4
|
+
hoveredIndex: number | null;
|
|
5
|
+
data: Array<{
|
|
6
|
+
name: string;
|
|
7
|
+
value: number;
|
|
8
|
+
color: string;
|
|
9
|
+
index?: number;
|
|
10
|
+
}>;
|
|
11
|
+
coordinate?: {
|
|
12
|
+
x: number;
|
|
13
|
+
y: number;
|
|
14
|
+
};
|
|
15
|
+
formatter?: (value: number, precision?: number) => string;
|
|
16
|
+
precision?: number;
|
|
17
|
+
unit?: string;
|
|
18
|
+
icons?: ReactNode[];
|
|
19
|
+
showSwatch?: boolean;
|
|
20
|
+
};
|
|
21
|
+
export declare const ChartTooltip: (props: ChartTooltipProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import{jsxs as t,jsx as i}from"react/jsx-runtime";import{useTheme as e,Stack as n,Box as o,Typography as r}from"@mui/material";import{calculateTooltipPosition as a,getTooltipContainerStyles as s}from"./tooltipPositioning.js";import{FoodsTooltip as l}from"../../Tooltip/FoodsTooltip.js";const p=p=>{const{active:c,hoveredIndex:d,data:h,coordinate:m,formatter:x,precision:u=0,unit:g,icons:v,showSwatch:f=!0}=p,w=e();if(!c||null===d||!m||!h[d])return null;const b=h[d],y=x?x(b.value,u):w.numbers.valueFormatterFn(b.value,u),I=/* @__PURE__ */t(n,{sx:{pointerEvents:"none"},direction:"column",alignItems:"flex-start",justifyContent:"center",spacing:w.spacing(1),children:[
|
|
2
|
+
/* @__PURE__ */t(n,{direction:"row",alignItems:"center",spacing:w.spacing(1),children:[f&&(v&&void 0!==d&&v[d]?/* @__PURE__ */i(o,{"data-testid":"chart-tooltip-swatch",minWidth:"24px",width:"24px",height:"24px",sx:{background:b.color,padding:"4px",color:"#fff",display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"3px"},children:v[d]}):/* @__PURE__ */i(o,{"data-testid":"chart-tooltip-swatch",sx:{width:"12px",height:"12px",borderRadius:"3px",backgroundColor:b.color}})),
|
|
3
|
+
/* @__PURE__ */i(r,{variant:"h6",children:b.name})]}),
|
|
4
|
+
/* @__PURE__ */t(n,{direction:"row",alignItems:"baseline",spacing:.5,children:[
|
|
5
|
+
/* @__PURE__ */i(r,{variant:"number-inter",sx:{p:0,m:0,lineHeight:w.spacing(4)},children:y}),g&&/* @__PURE__ */i(r,{variant:"small-bold",color:w.custom.grey[1400],children:g})]})]}),j=a({coordinate:{x:m.x,y:m.y},placement:"top"});/* @__PURE__ */
|
|
6
|
+
return i(o,{"data-testid":"chart-tooltip-anchor",sx:{...j,zIndex:2e3,pointerEvents:"none"},children:/* @__PURE__ */i(l,{width:"max-content",title:I,disableInteractive:!0,placement:"top",arrow:!0,open:!0,popperZIndex:0,slotProps:{popper:{sx:{pointerEvents:"none","& .MuiTooltip-tooltip, & .MuiTooltip-tooltip *":{pointerEvents:"none !important"}}}},sx:s(),children:/* @__PURE__ */i("div",{style:{width:1,height:1,visibility:"hidden",pointerEvents:"none"}})})})};export{p as ChartTooltip};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { DatavizVariant } from '../../../components/Icons/illustrationProps';
|
|
2
2
|
export type IconButtonVariants = "icon-xs-nobackground" | "icon-s-nobackground" | "icon-m-nobackground" | "icon-xs-withbackground" | "icon-s-withbackground" | "icon-m-withbackground";
|
|
3
3
|
export type TagsButtonVariants = "tags-grey" | "tags-black" | "tags-white" | "tags-red" | "tags-green" | "tags-blue" | "tags-coral";
|
|
4
|
-
export type customButtonVariants = "primary" | "secondary" | "ternary" | "text" | "black-text" | "selected-menu" | "selected-submenu" | "default-menu" | "black-filled" | "white-filled" | "white-filled-no-shadow" | "select" | "validate" | "error" | "delete" | IconButtonVariants | TagsButtonVariants | DatavizVariant;
|
|
4
|
+
export type customButtonVariants = "primary" | "secondary" | "ternary" | "text" | "black-text" | "selected-menu" | "selected-submenu" | "default-menu" | "black-filled" | "white-filled" | "white-filled-no-shadow" | "select" | "validate" | "error" | "delete" | "delete-outline" | IconButtonVariants | TagsButtonVariants | DatavizVariant;
|
|
5
5
|
type ButtonNewVariants = Record<customButtonVariants, React.CSSProperties>;
|
|
6
6
|
type ButtonPropsNewVariants = Record<customButtonVariants, true>;
|
|
7
7
|
declare module "@mui/material/styles" {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{alpha as o}from"@mui/material";const r={MuiDialog:{styleOverrides:{paper:{borderRadius:"1rem"}}},MuiAutocomplete:{styleOverrides:{root:()=>({})}},MuiAvatar:{defaultProps:{children:[]},styleOverrides:{root:({theme:o,ownerState:{alt:r=""}})=>{const e=r.split(" ").map(o=>o.charAt(0).toUpperCase()).join("");return{background:o.palette.primary[100],color:o.palette.primary[700],fontWeight:600,".MuiAvatar-img":{zIndex:1},":empty::before":{content:`"${e}"`}}}},variants:[{props:{variant:"small"},style:{width:"24px",height:"24px",fontSize:"10px"}},{props:{variant:"medium"},style:{width:"36px",height:"36px",fontSize:"13px"}},{props:{variant:"big"},style:{width:"40px",height:"40px",fontSize:"16px"}}]},MuiAvatarGroup:{defaultProps:{variant:"small",spacing:6,sx:{justifyContent:"flex-end"},slotProps:{additionalAvatar:{sx:{color:o=>o.custom.grey[2800],background:o=>o.custom.grey[400]}}}},styleOverrides:{root:({ownerState:{max:o=0}})=>({...[...Array(o)].reduce((r,e,t)=>({...r,[`& > .MuiAvatar-root:nth-of-type(${t+1})`]:{zIndex:o-t}}),{})})}},MuiButtonGroup:{defaultProps:{disableRipple:!0}},MuiButton:{defaultProps:{disableRipple:!0},styleOverrides:{root:({theme:r,ownerState:e})=>{const t=e.variant,d=e.variant?.startsWith("dataviz");if(d){const o=parseInt((t??"").split("-")[1]),e=r.custom.dataviz.colorsWithExtra[o];if(void 0!==e)return{textTransform:"none",fontSize:"0.9rem",lineHeight:"1rem",borderRadius:r.spacing(1),height:"40px",fontWeight:700,transition:"none",color:r.custom.grey[100],boxShadow:"0px 4px 8px 0px #2A2B2714",background:e.main,":hover":{background:e.variant[700]},":disabled":{background:e.variant[100]},":active":{background:e.variant[700]}}}return{textTransform:"none",fontSize:"0.9rem",lineHeight:"1rem",borderRadius:r.spacing(1),height:"40px",fontWeight:700,..."primary"===t&&{transition:"none",background:`linear-gradient(${r.palette.primary[400]}, ${r.palette.primary[600]})`,color:r.custom.grey[100],boxShadow:"0px 4px 8px 0px #2A2B2714"},..."secondary"===t&&{border:`1px solid ${r.custom.grey[500]}`,background:`linear-gradient(${r.custom.grey[100]}}, ${r.custom.grey[300]})`},..."ternary"===t&&{border:`1px solid ${r.custom.grey[500]}`,background:r.custom.grey.gradientLight},..."text"===t&&{transition:"none",paddingInline:"0",color:r.palette.primary[700],fontWeight:"700"},..."selected-menu"===t&&{color:"white",background:`linear-gradient(${r.palette.primary[400]}, ${r.palette.primary[600]})`,borderRadius:"8px",padding:0},..."selected-submenu"===t&&{color:"white",backgroundColor:r.custom.grey[2300],background:r.custom.grey[2300],borderRadius:"8px",padding:0},..."default-menu"===t&&{color:r.custom.grey[100],background:"inherit",borderRadius:"8px",padding:0},..."black-text"===t&&{color:r.custom.grey[2800],background:"none",fontWeight:"600"},..."black-filled"===t&&{borderRadius:"8px",background:`linear-gradient(180deg, ${r.custom.grey[2600]} 0%, ${r.custom.grey[3e3]} 100%)`,boxShadow:"0px 4px 8px 0px rgba(42, 43, 39, 0.08)",color:r.custom.grey[100]},..."white-filled"===t&&{borderRadius:"8px",border:"1px solid "+r.custom.grey[500],background:`linear-gradient(180deg, ${r.custom.grey[100]} 0%, ${r.custom.grey[200]} 100%)`,boxShadow:" 0px 2px 8px 0px rgba(42, 43, 39, 0.04)"},..."white-filled-no-shadow"===t&&{borderRadius:"44px",border:`1px solid ${r.custom.grey[500]}`,background:`linear-gradient(180deg, ${r.custom.grey[100]} 0%, ${r.custom.grey[200]} 100%)`},..."select"===t&&{backgroundColor:r.custom.grey[100],borderRadius:r.spacing(1),border:`1px solid ${r.custom.grey[500]}`},..."validate"===t&&{color:"#FFFFFF",transition:"none",background:`linear-gradient(180deg, ${r.custom.green[500]} 0%, ${r.custom.green[700]} 100%)`},..."delete"===t&&{color:"#FFFFFF",transition:"none",background:`${r.custom.red[600]}`},..."error"===t&&{transition:"none",paddingInline:"0",color:r.custom.red[600],fontWeight:"600"},":hover":{..."primary"===t&&{background:r.palette.primary[600]},..."secondary"===t&&{background:r.custom.grey[400]},..."ternary"===t&&{border:`1px solid ${r.custom.grey[500]}`,background:r.custom.grey[400]},..."text"===t&&{background:"none",textDecoration:"underline"},..."select"===t&&{backgroundColor:r.custom.grey[300]},..."default-menu"===t&&{backgroundColor:r.custom.grey[2500],borderRadius:"8px"},..."selected-menu"===t&&{borderRadius:"8px"},..."selected-submenu"===t&&{borderRadius:"8px"},..."validate"===t&&{background:r.custom.green[600]},..."delete"===t&&{background:r.custom.red[700]},..."error"===t&&{color:r.custom.red[900]}},":disabled":{..."primary"===t&&{color:r.custom.grey[100],background:o(r.palette.primary[600]??"",.36)},..."secondary"===t&&{color:o(r.custom.grey[2800],.36),border:`1px solid ${o(r.custom.grey[500],.36)}`,background:r.custom.grey[100]},..."ternary"===t&&{border:`1px solid ${r.custom.grey[100]}`,background:r.custom.grey[500]},..."select"===t&&{backgroundColor:r.custom.grey[500]},..."default-menu"===t&&{color:r.custom.grey[2300],borderRadius:"8px"},..."selected-menu"===t&&{color:r.custom.grey[2300],borderRadius:"8px"},..."selected-submenu"===t&&{color:r.custom.grey[2300],borderRadius:"8px"},..."validate"===t&&{background:o(r.custom.green[500],.36),color:"#FFFFFF"},..."delete"===t&&{background:r.custom.red[100],color:o(r.custom.red[600],.36)},..."error"===t&&{color:o(r.custom.red[700],.36)}},":active":{..."primary"===t&&{background:r.palette.primary[800]},..."secondary"===t&&{background:r.custom.grey[400]},..."secondary"===t&&{background:r.custom.grey[600]},..."default-menu"===t&&{backgroundColor:r.custom.grey[2e3],borderRadius:"8px"},..."selected-menu"===t&&{backgroundColor:r.custom.grey[2700],borderRadius:"8px"},..."selected-submenu"===t&&{borderRadius:"8px"},..."validate"===t&&{background:r.custom.green[800]},..."delete"===t&&{background:r.custom.red[800]}},..."tags-grey"===t&&{padding:r.spacing(0,1),border:`1px solid ${r.custom.grey[400]}`,borderRadius:"4px",backgroundColor:r.custom.grey[400],color:r.custom.grey[2800],height:"24px",...void 0!==e.onClick?{cursor:"pointer",":hover":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[300]},":active":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[500]},":disabled":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}:{cursor:"default",":hover":{cursor:"default"}}},..."tags-black"===t&&{padding:r.spacing(0,1),border:`1px solid ${r.custom.grey[400]}`,borderRadius:"4px",background:"linear-gradient(180deg, #484945 0%, #2A2B27 100%)",color:r.custom.grey[100],height:"24px",...void 0!==e.onClick?{cursor:"pointer",":hover":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[300]},":active":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[500]},":disabled":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}:{cursor:"default",":hover":{cursor:"default"}}},..."tags-white"===t&&{padding:r.spacing(0,1),border:`1px solid ${r.custom.grey[400]} !important`,borderRadius:"4px",backgroundColor:r.custom.grey[100],color:r.custom.grey[2800],height:"24px",cursor:"default",...void 0!==e.onClick&&{cursor:"pointer",":hover":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[300]},":active":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[500]},":disabled":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}},..."tags-red"===t&&{padding:r.spacing(0,1),border:`1px solid ${r.custom.red[100]}`,borderRadius:"4px",backgroundColor:r.custom.red[100],color:r.custom.red[600],height:"24px",...void 0!==e.onClick?{cursor:"pointer",":hover":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[300]},":active":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[500]},":disabled":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}:{cursor:"default",":hover":{cursor:"default"}}},..."tags-green"===t&&{padding:r.spacing(0,1),borderRadius:"4px",height:"24px",border:`1px solid ${r.custom.grey[400]}`,backgroundColor:r.custom.green[100],color:r.custom.green[600],...void 0!==e.onClick?{cursor:"pointer",":hover":{border:`1px solid ${r.custom.grey[400]}`,backgroundColor:r.custom.green[100],color:r.custom.green[600]},":active":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[500]},":disabled":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}:{cursor:"default",":hover":{cursor:"default"}}},..."tags-blue"===t&&{padding:r.spacing(0,1),borderRadius:"4px",height:"24px",border:`1px solid ${r.custom.blue[100]}`,backgroundColor:r.custom.blue[100],color:r.custom.blue[700],...void 0!==e.onClick?{cursor:"pointer",":hover":{border:`1px solid ${r.custom.blue[200]}`,backgroundColor:r.custom.blue[50],color:r.custom.blue[700]},":active":{border:`1px solid ${r.custom.blue[300]}`,backgroundColor:r.custom.blue[200]},":disabled":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}:{cursor:"default",":hover":{cursor:"default"}}},..."tags-coral"===t&&{padding:r.spacing(0,1),borderRadius:"4px",height:"24px",border:`1px solid ${r.custom.coral[100]}`,backgroundColor:r.custom.coral[100],color:r.custom.coral[700],...void 0!==e.onClick?{cursor:"pointer",":hover":{border:`1px solid ${r.custom.coral[200]}`,backgroundColor:r.custom.coral[50],color:r.custom.coral[700]},":active":{border:`1px solid ${r.custom.coral[300]}`,backgroundColor:r.custom.coral[200]},":disabled":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}:{cursor:"default",":hover":{cursor:"default"}}},..."icon-xs-nobackground"===t&&{padding:r.spacing(.5),minWidth:"auto",width:"24px",height:"24px",color:r.custom.grey[2800],backgroundColor:"inherit",borderRadius:"32px",":hover":{backgroundColor:r.custom.grey[600]},":active":{backgroundColor:r.custom.grey[1e3]},":disabled":{backgroundColor:"inherit",color:r.custom.grey[1400]}},..."icon-s-nobackground"===t&&{padding:r.spacing(1),minWidth:"auto",width:"36px",height:"36px",color:r.custom.grey[2800],backgroundColor:"inherit",borderRadius:"32px",":hover":{backgroundColor:r.custom.grey[600]},":active":{backgroundColor:r.custom.grey[1e3]},":disabled":{backgroundColor:"inherit",color:r.custom.grey[1400]}},..."icon-m-nobackground"===t&&{padding:r.spacing(1),minWidth:"auto",width:"44px",height:"44px",color:r.custom.grey[2800],backgroundColor:"inherit",borderRadius:"32px",":hover":{backgroundColor:r.custom.grey[600]},":active":{backgroundColor:r.custom.grey[1e3]},":disabled":{backgroundColor:"inherit",color:r.custom.grey[1400]}},..."icon-xs-withbackground"===t&&{padding:r.spacing(.5),minWidth:"auto",width:"24px",height:"24px",color:r.custom.grey[2800],background:"linear-gradient(180deg, #FFFFFF 0%, #F6F5F3 154.5%)",border:`1px solid ${r.custom.grey[500]}`,borderRadius:"32px",":hover":{background:"none",backgroundColor:r.custom.grey[400]},":active":{background:"none",backgroundColor:r.custom.grey[600],border:"none"},":disabled":{background:"none",backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}},..."icon-s-withbackground"===t&&{padding:r.spacing(1),minWidth:"auto",width:"36px",height:"36px",color:r.custom.grey[2800],background:"linear-gradient(180deg, #FFFFFF 0%, #F6F5F3 154.5%)",border:`1px solid ${r.custom.grey[500]}`,borderRadius:"32px",":hover":{background:"none",backgroundColor:r.custom.grey[400]},":active":{background:"none",backgroundColor:r.custom.grey[600],border:"none"},":disabled":{background:"none",backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}},..."icon-m-withbackground"===t&&{padding:r.spacing(1),minWidth:"auto",width:"44px",height:"44px",color:r.custom.grey[2800],background:"linear-gradient(180deg, #FFFFFF 0%, #F6F5F3 154.5%)",border:`1px solid ${r.custom.grey[500]}`,borderRadius:"32px",":hover":{background:"none",backgroundColor:r.custom.grey[400]},":active":{background:"none",backgroundColor:r.custom.grey[600],border:"none"},":disabled":{background:"none",backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}}}}},MuiButtonBase:{styleOverrides:{root:{borderRadius:"15px"}}},MuiCircularProgress:{styleOverrides:{root:({theme:o})=>({color:o.custom.grey[800]})}},MuiIconButton:{styleOverrides:{root:({theme:o})=>({height:"44px",width:"44px",color:o.custom.grey[2800],backgroundColor:"inherit",":hover":{backgroundColor:o.custom.grey[600]},":focus":{backgroundColor:o.custom.grey[1e3]},":disabled":{backgroundColor:"inherit",color:o.custom.grey[1400]}})}},MuiChip:{styleOverrides:{root:({theme:o,ownerState:r})=>({paddingTop:o.spacing(.5),paddingRight:o.spacing(.5),paddingBottom:o.spacing(.5),paddingLeft:o.spacing(1),..."brand"===r.variant&&{backgroundColor:o.palette.primary[50]},..."neutral"===r.variant&&{backgroundColor:o.custom.grey[300]}})}}};export{r as components};
|
|
1
|
+
import{alpha as o}from"@mui/material";const r={MuiDialog:{styleOverrides:{paper:{borderRadius:"1rem"}}},MuiAutocomplete:{styleOverrides:{root:()=>({})}},MuiAvatar:{defaultProps:{children:[]},styleOverrides:{root:({theme:o,ownerState:{alt:r=""}})=>{const e=r.split(" ").map(o=>o.charAt(0).toUpperCase()).join("");return{background:o.palette.primary[100],color:o.palette.primary[700],fontWeight:600,".MuiAvatar-img":{zIndex:1},":empty::before":{content:`"${e}"`}}}},variants:[{props:{variant:"small"},style:{width:"24px",height:"24px",fontSize:"10px"}},{props:{variant:"medium"},style:{width:"36px",height:"36px",fontSize:"13px"}},{props:{variant:"big"},style:{width:"40px",height:"40px",fontSize:"16px"}}]},MuiAvatarGroup:{defaultProps:{variant:"small",spacing:6,sx:{justifyContent:"flex-end"},slotProps:{additionalAvatar:{sx:{color:o=>o.custom.grey[2800],background:o=>o.custom.grey[400]}}}},styleOverrides:{root:({ownerState:{max:o=0}})=>({...[...Array(o)].reduce((r,e,t)=>({...r,[`& > .MuiAvatar-root:nth-of-type(${t+1})`]:{zIndex:o-t}}),{})})}},MuiButtonGroup:{defaultProps:{disableRipple:!0}},MuiButton:{defaultProps:{disableRipple:!0},styleOverrides:{root:({theme:r,ownerState:e})=>{const t=e.variant,d=e.variant?.startsWith("dataviz");if(d){const o=parseInt((t??"").split("-")[1]),e=r.custom.dataviz.colorsWithExtra[o];if(void 0!==e)return{textTransform:"none",fontSize:"0.9rem",lineHeight:"1rem",borderRadius:r.spacing(1),height:"40px",fontWeight:700,transition:"none",color:r.custom.grey[100],boxShadow:"0px 4px 8px 0px #2A2B2714",background:e.main,":hover":{background:e.variant[700]},":disabled":{background:e.variant[100]},":active":{background:e.variant[700]}}}return{textTransform:"none",fontSize:"0.9rem",lineHeight:"1rem",borderRadius:r.spacing(1),height:"40px",fontWeight:700,..."primary"===t&&{transition:"none",background:`linear-gradient(${r.palette.primary[400]}, ${r.palette.primary[600]})`,color:r.custom.grey[100],boxShadow:"0px 4px 8px 0px #2A2B2714"},..."secondary"===t&&{border:`1px solid ${r.custom.grey[500]}`,background:`linear-gradient(${r.custom.grey[100]}}, ${r.custom.grey[300]})`},..."ternary"===t&&{border:`1px solid ${r.custom.grey[500]}`,background:r.custom.grey.gradientLight},..."text"===t&&{transition:"none",paddingInline:"0",color:r.palette.primary[700],fontWeight:"700"},..."selected-menu"===t&&{color:"white",background:`linear-gradient(${r.palette.primary[400]}, ${r.palette.primary[600]})`,borderRadius:"8px",padding:0},..."selected-submenu"===t&&{color:"white",backgroundColor:r.custom.grey[2300],background:r.custom.grey[2300],borderRadius:"8px",padding:0},..."default-menu"===t&&{color:r.custom.grey[100],background:"inherit",borderRadius:"8px",padding:0},..."black-text"===t&&{color:r.custom.grey[2800],background:"none",fontWeight:"600"},..."black-filled"===t&&{borderRadius:"8px",background:`linear-gradient(180deg, ${r.custom.grey[2600]} 0%, ${r.custom.grey[3e3]} 100%)`,boxShadow:"0px 4px 8px 0px rgba(42, 43, 39, 0.08)",color:r.custom.grey[100]},..."white-filled"===t&&{borderRadius:"8px",border:"1px solid "+r.custom.grey[500],background:`linear-gradient(180deg, ${r.custom.grey[100]} 0%, ${r.custom.grey[200]} 100%)`,boxShadow:" 0px 2px 8px 0px rgba(42, 43, 39, 0.04)"},..."white-filled-no-shadow"===t&&{borderRadius:"44px",border:`1px solid ${r.custom.grey[500]}`,background:`linear-gradient(180deg, ${r.custom.grey[100]} 0%, ${r.custom.grey[200]} 100%)`},..."select"===t&&{backgroundColor:r.custom.grey[100],borderRadius:r.spacing(1),border:`1px solid ${r.custom.grey[500]}`},..."validate"===t&&{color:"#FFFFFF",transition:"none",background:`linear-gradient(180deg, ${r.custom.green[500]} 0%, ${r.custom.green[700]} 100%)`},..."delete"===t&&{color:"#FFFFFF",transition:"none",background:`${r.custom.red[600]}`},..."error"===t&&{transition:"none",paddingInline:"0",color:r.custom.red[600],fontWeight:"600"},..."delete-outline"===t&&{color:r.custom.red[600],transition:"none",background:"transparent",border:`1px solid ${r.custom.red[600]}`},":hover":{..."primary"===t&&{background:r.palette.primary[600]},..."secondary"===t&&{background:r.custom.grey[400]},..."ternary"===t&&{border:`1px solid ${r.custom.grey[500]}`,background:r.custom.grey[400]},..."text"===t&&{background:"none",textDecoration:"underline"},..."select"===t&&{backgroundColor:r.custom.grey[300]},..."default-menu"===t&&{backgroundColor:r.custom.grey[2500],borderRadius:"8px"},..."selected-menu"===t&&{borderRadius:"8px"},..."selected-submenu"===t&&{borderRadius:"8px"},..."validate"===t&&{background:r.custom.green[600]},..."delete"===t&&{background:r.custom.red[700]},..."error"===t&&{color:r.custom.red[900]},..."delete-outline"===t&&{background:r.custom.red[100],borderColor:r.custom.red[700],color:r.custom.red[700]}},":disabled":{..."primary"===t&&{color:r.custom.grey[100],background:o(r.palette.primary[600]??"",.36)},..."secondary"===t&&{color:o(r.custom.grey[2800],.36),border:`1px solid ${o(r.custom.grey[500],.36)}`,background:r.custom.grey[100]},..."ternary"===t&&{border:`1px solid ${r.custom.grey[100]}`,background:r.custom.grey[500]},..."select"===t&&{backgroundColor:r.custom.grey[500]},..."default-menu"===t&&{color:r.custom.grey[2300],borderRadius:"8px"},..."selected-menu"===t&&{color:r.custom.grey[2300],borderRadius:"8px"},..."selected-submenu"===t&&{color:r.custom.grey[2300],borderRadius:"8px"},..."validate"===t&&{background:o(r.custom.green[500],.36),color:"#FFFFFF"},..."delete"===t&&{background:r.custom.red[100],color:o(r.custom.red[600],.36)},..."error"===t&&{color:o(r.custom.red[700],.36)},..."delete-outline"===t&&{color:o(r.custom.red[600],.36),borderColor:o(r.custom.red[600],.36),background:"transparent"}},":active":{..."primary"===t&&{background:r.palette.primary[800]},..."secondary"===t&&{background:r.custom.grey[400]},..."secondary"===t&&{background:r.custom.grey[600]},..."default-menu"===t&&{backgroundColor:r.custom.grey[2e3],borderRadius:"8px"},..."selected-menu"===t&&{backgroundColor:r.custom.grey[2700],borderRadius:"8px"},..."selected-submenu"===t&&{borderRadius:"8px"},..."validate"===t&&{background:r.custom.green[800]},..."delete"===t&&{background:r.custom.red[800]},..."delete-outline"===t&&{background:r.custom.red[100],borderColor:r.custom.red[800]}},..."tags-grey"===t&&{padding:r.spacing(0,1),border:`1px solid ${r.custom.grey[400]}`,borderRadius:"4px",backgroundColor:r.custom.grey[400],color:r.custom.grey[2800],height:"24px",...void 0!==e.onClick?{cursor:"pointer",":hover":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[300]},":active":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[500]},":disabled":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}:{cursor:"default",":hover":{cursor:"default"}}},..."tags-black"===t&&{padding:r.spacing(0,1),border:`1px solid ${r.custom.grey[400]}`,borderRadius:"4px",background:"linear-gradient(180deg, #484945 0%, #2A2B27 100%)",color:r.custom.grey[100],height:"24px",...void 0!==e.onClick?{cursor:"pointer",":hover":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[300]},":active":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[500]},":disabled":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}:{cursor:"default",":hover":{cursor:"default"}}},..."tags-white"===t&&{padding:r.spacing(0,1),border:`1px solid ${r.custom.grey[400]} !important`,borderRadius:"4px",backgroundColor:r.custom.grey[100],color:r.custom.grey[2800],height:"24px",cursor:"default",...void 0!==e.onClick&&{cursor:"pointer",":hover":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[300]},":active":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[500]},":disabled":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}},..."tags-red"===t&&{padding:r.spacing(0,1),border:`1px solid ${r.custom.red[100]}`,borderRadius:"4px",backgroundColor:r.custom.red[100],color:r.custom.red[600],height:"24px",...void 0!==e.onClick?{cursor:"pointer",":hover":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[300]},":active":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[500]},":disabled":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}:{cursor:"default",":hover":{cursor:"default"}}},..."tags-green"===t&&{padding:r.spacing(0,1),borderRadius:"4px",height:"24px",border:`1px solid ${r.custom.grey[400]}`,backgroundColor:r.custom.green[100],color:r.custom.green[600],...void 0!==e.onClick?{cursor:"pointer",":hover":{border:`1px solid ${r.custom.grey[400]}`,backgroundColor:r.custom.green[100],color:r.custom.green[600]},":active":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[500]},":disabled":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}:{cursor:"default",":hover":{cursor:"default"}}},..."tags-blue"===t&&{padding:r.spacing(0,1),borderRadius:"4px",height:"24px",border:`1px solid ${r.custom.blue[100]}`,backgroundColor:r.custom.blue[100],color:r.custom.blue[700],...void 0!==e.onClick?{cursor:"pointer",":hover":{border:`1px solid ${r.custom.blue[200]}`,backgroundColor:r.custom.blue[50],color:r.custom.blue[700]},":active":{border:`1px solid ${r.custom.blue[300]}`,backgroundColor:r.custom.blue[200]},":disabled":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}:{cursor:"default",":hover":{cursor:"default"}}},..."tags-coral"===t&&{padding:r.spacing(0,1),borderRadius:"4px",height:"24px",border:`1px solid ${r.custom.coral[100]}`,backgroundColor:r.custom.coral[100],color:r.custom.coral[700],...void 0!==e.onClick?{cursor:"pointer",":hover":{border:`1px solid ${r.custom.coral[200]}`,backgroundColor:r.custom.coral[50],color:r.custom.coral[700]},":active":{border:`1px solid ${r.custom.coral[300]}`,backgroundColor:r.custom.coral[200]},":disabled":{border:`1px solid ${r.custom.grey[500]}`,backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}:{cursor:"default",":hover":{cursor:"default"}}},..."icon-xs-nobackground"===t&&{padding:r.spacing(.5),minWidth:"auto",width:"24px",height:"24px",color:r.custom.grey[2800],backgroundColor:"inherit",borderRadius:"32px",":hover":{backgroundColor:r.custom.grey[600]},":active":{backgroundColor:r.custom.grey[1e3]},":disabled":{backgroundColor:"inherit",color:r.custom.grey[1400]}},..."icon-s-nobackground"===t&&{padding:r.spacing(1),minWidth:"auto",width:"36px",height:"36px",color:r.custom.grey[2800],backgroundColor:"inherit",borderRadius:"32px",":hover":{backgroundColor:r.custom.grey[600]},":active":{backgroundColor:r.custom.grey[1e3]},":disabled":{backgroundColor:"inherit",color:r.custom.grey[1400]}},..."icon-m-nobackground"===t&&{padding:r.spacing(1),minWidth:"auto",width:"44px",height:"44px",color:r.custom.grey[2800],backgroundColor:"inherit",borderRadius:"32px",":hover":{backgroundColor:r.custom.grey[600]},":active":{backgroundColor:r.custom.grey[1e3]},":disabled":{backgroundColor:"inherit",color:r.custom.grey[1400]}},..."icon-xs-withbackground"===t&&{padding:r.spacing(.5),minWidth:"auto",width:"24px",height:"24px",color:r.custom.grey[2800],background:"linear-gradient(180deg, #FFFFFF 0%, #F6F5F3 154.5%)",border:`1px solid ${r.custom.grey[500]}`,borderRadius:"32px",":hover":{background:"none",backgroundColor:r.custom.grey[400]},":active":{background:"none",backgroundColor:r.custom.grey[600],border:"none"},":disabled":{background:"none",backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}},..."icon-s-withbackground"===t&&{padding:r.spacing(1),minWidth:"auto",width:"36px",height:"36px",color:r.custom.grey[2800],background:"linear-gradient(180deg, #FFFFFF 0%, #F6F5F3 154.5%)",border:`1px solid ${r.custom.grey[500]}`,borderRadius:"32px",":hover":{background:"none",backgroundColor:r.custom.grey[400]},":active":{background:"none",backgroundColor:r.custom.grey[600],border:"none"},":disabled":{background:"none",backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}},..."icon-m-withbackground"===t&&{padding:r.spacing(1),minWidth:"auto",width:"44px",height:"44px",color:r.custom.grey[2800],background:"linear-gradient(180deg, #FFFFFF 0%, #F6F5F3 154.5%)",border:`1px solid ${r.custom.grey[500]}`,borderRadius:"32px",":hover":{background:"none",backgroundColor:r.custom.grey[400]},":active":{background:"none",backgroundColor:r.custom.grey[600],border:"none"},":disabled":{background:"none",backgroundColor:r.custom.grey[100],color:r.custom.grey[1400]}}}}}},MuiButtonBase:{styleOverrides:{root:{borderRadius:"15px"}}},MuiCircularProgress:{styleOverrides:{root:({theme:o})=>({color:o.custom.grey[800]})}},MuiIconButton:{styleOverrides:{root:({theme:o})=>({height:"44px",width:"44px",color:o.custom.grey[2800],backgroundColor:"inherit",":hover":{backgroundColor:o.custom.grey[600]},":focus":{backgroundColor:o.custom.grey[1e3]},":disabled":{backgroundColor:"inherit",color:o.custom.grey[1400]}})}},MuiChip:{styleOverrides:{root:({theme:o,ownerState:r})=>({paddingTop:o.spacing(.5),paddingRight:o.spacing(.5),paddingBottom:o.spacing(.5),paddingLeft:o.spacing(1),..."brand"===r.variant&&{backgroundColor:o.palette.primary[50]},..."neutral"===r.variant&&{backgroundColor:o.custom.grey[300]}})}}};export{r as components};
|
package/package.json
CHANGED
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
2
|
-
interface GaugeTooltipProps {
|
|
3
|
-
label: string;
|
|
4
|
-
value: number;
|
|
5
|
-
unit: string;
|
|
6
|
-
precision?: number;
|
|
7
|
-
valueFormatter?: (value: number) => string;
|
|
8
|
-
}
|
|
9
|
-
export declare const GaugeTooltip: ({ label, value, unit, precision, valueFormatter }: GaugeTooltipProps) => ReactNode;
|
|
10
|
-
export {};
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import{jsxs as r,jsx as t}from"react/jsx-runtime";import{formatValue as e}from"../utils/formatters.js";import{useTheme as i,Box as l,Typography as o}from"@mui/material";const n=({label:n,value:a,unit:s,precision:c=2,valueFormatter:m})=>{const u=i(),d=m?m(a):e(a,c);/* @__PURE__ */
|
|
2
|
-
return r(l,{sx:{display:"flex",width:"100%",flexDirection:"column",gap:u.spacing(.75),padding:u.spacing(.75,1.5,0,.75),textAlign:"left",justifyContent:"flex-start"},children:[
|
|
3
|
-
/* @__PURE__ */t(o,{variant:"h5",color:u.custom.grey[2800],children:n}),
|
|
4
|
-
/* @__PURE__ */r(l,{sx:{display:"flex",alignItems:"baseline"},children:[
|
|
5
|
-
/* @__PURE__ */t(o,{variant:"h2",color:u.custom.grey[2800],sx:{mr:.5},children:d}),
|
|
6
|
-
/* @__PURE__ */t(o,{variant:"body-medium",color:u.custom.grey[1400],children:s})]})]})};export{n as GaugeTooltip};
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import{jsxs as e,jsx as n}from"react/jsx-runtime";import{useTheme as i,Stack as t,Box as r,Typography as o}from"@mui/material";import{calculateTooltipPosition as a,getTooltipContainerStyles as l}from"../shared/tooltipPositioning.js";import{FoodsTooltip as c}from"../../Tooltip/FoodsTooltip.js";const s=s=>{const{active:d,hoveredIndex:p,data:m,coordinate:h,formatter:x,unit:u,icons:g}=s,v=i();if(!d||null===p||!h||!m[p])return null;const f=m[p],b=x?x(f.value,0):v.numbers.valueFormatterFn(f.value,0),y=/* @__PURE__ */e(t,{sx:{pointerEvents:"none"},direction:"column",alignItems:"flex-start",justifyContent:"center",spacing:v.spacing(1),children:[
|
|
2
|
-
/* @__PURE__ */e(t,{direction:"row",alignItems:"center",spacing:v.spacing(1),children:[g&&void 0!==p&&g[p]?/* @__PURE__ */n(r,{minWidth:"24px",width:"24px",height:"24px",sx:{background:f.color,padding:"4px",color:"#fff",display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"3px"},children:g[p]}):/* @__PURE__ */n(r,{sx:{width:"12px",height:"12px",borderRadius:"3px",backgroundColor:f.color}}),
|
|
3
|
-
/* @__PURE__ */n(o,{variant:"h6",children:f.name})]}),
|
|
4
|
-
/* @__PURE__ */e(t,{direction:"row",alignItems:"baseline",spacing:.5,children:[
|
|
5
|
-
/* @__PURE__ */n(o,{variant:"number-inter",sx:{p:0,m:0,lineHeight:v.spacing(4)},children:b}),u&&/* @__PURE__ */n(o,{variant:"small-bold",color:v.custom.grey[1400],children:u})]})]}),I=a({coordinate:{x:h.x,y:h.y},placement:"top"});/* @__PURE__ */
|
|
6
|
-
return n(r,{sx:{...I,zIndex:2e3,pointerEvents:"none"},children:/* @__PURE__ */n(c,{width:"max-content",title:y,disableInteractive:!0,placement:"top",arrow:!0,open:!0,popperZIndex:0,sx:l(),children:/* @__PURE__ */n("div",{style:{width:1,height:1,visibility:"hidden",pointerEvents:"none"}})})})};export{s as PolymorphicChartTooltip};
|