@foodpilot/foods 2.18.4 → 2.19.1

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.
Files changed (37) hide show
  1. package/dist/components/Chart/DoughnutChart/DoughnutTooltip.js +2 -2
  2. package/dist/components/Chart/HorizontalGauge/HorizontalGaugeChart.js +9 -6
  3. package/dist/components/Chart/HorizontalGauge/components/GaugeBorders.d.ts +1 -1
  4. package/dist/components/Chart/HorizontalGauge/components/GaugeBorders.js +5 -6
  5. package/dist/components/Chart/HorizontalGauge/components/GaugeLabels.d.ts +1 -1
  6. package/dist/components/Chart/HorizontalGauge/components/GaugeLabels.js +1 -9
  7. package/dist/components/Chart/HorizontalGauge/components/GaugeMarkers.d.ts +1 -1
  8. package/dist/components/Chart/HorizontalGauge/components/GaugeMarkers.js +10 -8
  9. package/dist/components/Chart/HorizontalGauge/components/GaugeStatistics.d.ts +2 -0
  10. package/dist/components/Chart/HorizontalGauge/components/GaugeStatistics.js +4 -0
  11. package/dist/components/Chart/HorizontalGauge/constants.d.ts +7 -0
  12. package/dist/components/Chart/HorizontalGauge/constants.js +1 -1
  13. package/dist/components/Chart/HorizontalGauge/hooks/useGaugeCalculations.d.ts +1 -1
  14. package/dist/components/Chart/HorizontalGauge/hooks/useGaugeCalculations.js +1 -1
  15. package/dist/components/Chart/HorizontalGauge/types.d.ts +21 -10
  16. package/dist/components/Chart/HorizontalGauge/utils/statisticLayout.d.ts +15 -0
  17. package/dist/components/Chart/HorizontalGauge/utils/statisticLayout.js +1 -0
  18. package/dist/components/Chart/PolymorphicChart/PolymorphicChartTooltip.d.ts +2 -20
  19. package/dist/components/Chart/PolymorphicChart/charts/PolymorphicBarChart.js +7 -7
  20. package/dist/components/Chart/PolymorphicChart/charts/PolymorphicLineChart.js +8 -8
  21. package/dist/components/Chart/PolymorphicChart/charts/PolymorphicRadarChart.js +3 -3
  22. package/dist/components/Chart/ScatterPlot/ScatterPlotHoverOverlay.js +10 -9
  23. package/dist/components/Chart/shared/ChartTooltip.d.ts +21 -0
  24. package/dist/components/Chart/shared/ChartTooltip.js +6 -0
  25. package/dist/components/Form/FoodsFormBase/FoodsFormBase.d.ts +2 -1
  26. package/dist/components/Form/FoodsFormBase/FormTopBar/ActionButtons.js +7 -5
  27. package/dist/components/Form/FoodsFormBase/FormTopBar/FormTopBar.js +7 -8
  28. package/dist/components/Tabs/CountTabs/CountTabs.d.ts +3 -1
  29. package/dist/components/Tabs/CountTabs/CountTabs.js +5 -5
  30. package/dist/themes/common/MUIComponents/buttons.d.ts +1 -1
  31. package/dist/themes/common/components.js +1 -1
  32. package/dist/themes/common/custom.d.ts +5 -0
  33. package/dist/themes/common/custom.js +1 -1
  34. package/package.json +1 -1
  35. package/dist/components/Chart/HorizontalGauge/components/GaugeTooltip.d.ts +0 -10
  36. package/dist/components/Chart/HorizontalGauge/components/GaugeTooltip.js +0 -6
  37. package/dist/components/Chart/PolymorphicChart/PolymorphicChartTooltip.js +0 -6
@@ -1,6 +1,6 @@
1
- import{jsxs as i,jsx as t}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 l}from"../shared/tooltipPositioning.js";import{FoodsTooltip as d}from"../../Tooltip/FoodsTooltip.js";const c=c=>{const{active:p,payload:s,formatter:m,unit:h,coordinate:x,icons:g}=c,u=e();if(!(p&&s&&s.length&&x))return null;const f=s[0],y=m?m(f.value):u.numbers.valueFormatterFn(f.value),v=/* @__PURE__ */i(n,{direction:"column",alignItems:"flex-start",justifyContent:"center",spacing:u.spacing(1),children:[
1
+ import{jsxs as i,jsx as t}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 l}from"../shared/tooltipPositioning.js";import{FoodsTooltip as d}from"../../Tooltip/FoodsTooltip.js";const c=c=>{const{active:s,payload:p,formatter:m,unit:h,coordinate:x,icons:g}=c,u=e();if(!(s&&p&&p.length&&x))return null;const f=p[0],y=m?m(f.value):u.numbers.valueFormatterFn(f.value),v=/* @__PURE__ */i(n,{direction:"column",alignItems:"flex-start",justifyContent:"center",spacing:u.spacing(1),children:[
2
2
  /* @__PURE__ */i(n,{direction:"row",alignItems:"center",spacing:u.spacing(1),children:[g&&f.payload&&void 0!==f.payload.index&&g[f.payload.index]?/* @__PURE__ */t(o,{minWidth:"24px",width:"24px",height:"24px",sx:{background:f.payload.color||"#ccc",padding:"4px",color:"#fff",display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"3px"},children:g[f.payload.index]}):/* @__PURE__ */t(o,{sx:{width:"12px",height:"12px",borderRadius:"3px",backgroundColor:f.payload.color}}),
3
3
  /* @__PURE__ */t(r,{variant:"h6",children:f.name})]}),
4
- /* @__PURE__ */i(n,{direction:"row",alignItems:"flex-end",spacing:.5,children:[
4
+ /* @__PURE__ */i(n,{direction:"row",alignItems:"baseline",spacing:.5,children:[
5
5
  /* @__PURE__ */t(r,{variant:"number-inter",sx:{p:0,m:0,lineHeight:u.spacing(4)},children:y}),
6
6
  /* @__PURE__ */t(r,{variant:"small-bold",color:u.custom.grey[1400],children:h})]})]}),b=(i=>{if(void 0===i)return"top";const t=(i%360+360)%360;return t>=315||t<45?"right":t>=45&&t<135?"top":t>=135&&t<225?"left":"bottom"})(x.angle),w=a({coordinate:{x:x.x,y:x.y},placement:b});return f.name&&/* @__PURE__ */t(o,{sx:w,children:/* @__PURE__ */t(d,{width:"max-content",title:v,placement:b,arrow:!0,open:!0,sx:l(),children:/* @__PURE__ */t("div",{style:{width:1,height:1,visibility:"hidden",pointerEvents:"none"}})})})};export{c as DoughnutTooltip};
@@ -1,6 +1,9 @@
1
- import{jsx as a,jsxs as e}from"react/jsx-runtime";import{GAUGE_CONSTANTS as i}from"./constants.js";import{useGaugeCalculations as o}from"./hooks/useGaugeCalculations.js";import{GaugeBorders as r}from"./components/GaugeBorders.js";import{GaugeMarkers as l}from"./components/GaugeMarkers.js";import{GaugeLabels as m}from"./components/GaugeLabels.js";import{GaugeBackground as n}from"./components/GaugeBackground.js";import{Box as t}from"@mui/material";import{useContainerWidth as s}from"./hooks/useContainerWidth.js";import{useTheme as u}from"@mui/material/styles";const p=p=>{const c=u(),{minValue:g,maxValue:d,medianValue:b,averageValue:h,companyValue:v,labelAverage:A=i.TEXT.DEFAULT_AVERAGE_LABEL,labelCompany:E=i.TEXT.DEFAULT_COMPANY_LABEL,labelMinimum:V=i.TEXT.DEFAULT_MINIMUM_LABEL,labelMedian:L=i.TEXT.DEFAULT_MEDIAN_LABEL,labelMaximum:M=i.TEXT.DEFAULT_MAXIMUM_LABEL,width:T,height:y=i.DEFAULT_HEIGHT,label:f,animated:k=!1,backgroundProps:F,precision:P=0,unit:_="",ariaLabel:D,valueFormatter:U=c.numbers.valueFormatterFn}=p,{containerRef:Y,containerWidth:j}=s(),x=j||T||i.DEFAULT_WIDTH,{scale:B,companyPosition:w,averagePosition:C,gaugeBackgroundProps:G,markerY:I,companyMarkerY:X,averageMarkerY:H,labelY:N,labelPositions:W}=o({minValue:g,maxValue:d,companyValue:v,averageValue:h,labelCompany:E,labelAverage:A,width:x,height:y});/* @__PURE__ */
2
- return a(t,{ref:Y,width:T||"100%",height:y,position:"relative",children:/* @__PURE__ */e("svg",{width:j,height:y,style:{overflow:"visible"},role:D?"img":void 0,"aria-label":D,"aria-hidden":!D||void 0,children:[
3
- /* @__PURE__ */a(r,{width:j,height:y,scale:B,medianValue:b,animated:k}),
4
- /* @__PURE__ */a(n,{...G,backgroundProps:F,animated:k}),
5
- /* @__PURE__ */a(l,{width:j,scale:B,companyValue:v,averageValue:h,markersYPosition:I,companyMarkerY:X,averageMarkerY:H,minValue:g,maxValue:d,animated:k,precision:P,unit:_,labelCompany:E,labelAverage:A,valueFormatter:U}),
6
- /* @__PURE__ */a(m,{minValue:g,maxValue:d,medianValue:b,companyValue:v,averageValue:h,companyPosition:w,averagePosition:C,labelCompany:E,labelAverage:A,labelMinimum:V,labelMedian:L,labelMaximum:M,labelYPositions:N,labelPositions:W,animated:k,precision:P,unit:_,valueFormatter:U})]})})};export{p as HorizontalGaugeChart};
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, medianValue, scale, animated }: GaugeBordersProps) => import("react/jsx-runtime").JSX.Element;
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 r}from"react/jsx-runtime";import{useRef as e,useEffect as D}from"react";import{GAUGE_CONSTANTS as E}from"../constants.js";const G=({width:G,height:s,medianValue:a,scale:o,animated:i=!1})=>{const A=e(null);return D(()=>{if(A.current&&i){const t=A.current;t.style.opacity="0",setTimeout(()=>{t.style.transition="all 0.5s linear",t.style.opacity="1"},300)}},[i]),/* @__PURE__ */t("g",{ref:A,style:{opacity:i?"0":"1"},children:[
2
- /* @__PURE__ */r("line",{x1:E.GAUGE_PADDING,y1:1,x2:G-E.GAUGE_PADDING,y2:1,stroke:E.COLORS.BORDER,strokeWidth:"1",strokeDasharray:E.BORDER_DASH_PATTERN}),
3
- /* @__PURE__ */r("line",{x1:E.GAUGE_PADDING,y1:s-E.LEGEND_HEIGHT,x2:G-E.GAUGE_PADDING,y2:s-E.LEGEND_HEIGHT,stroke:E.COLORS.BORDER,strokeWidth:"1",strokeDasharray:E.BORDER_DASH_PATTERN}),
4
- /* @__PURE__ */r("line",{x1:E.GAUGE_PADDING,y1:0,x2:E.GAUGE_PADDING,y2:s-E.LEGEND_HEIGHT,stroke:E.COLORS.BORDER,strokeWidth:"1",strokeDasharray:E.BORDER_DASH_PATTERN}),
5
- /* @__PURE__ */r("line",{x1:G-E.GAUGE_PADDING,y1:0,x2:G-E.GAUGE_PADDING,y2:s-E.LEGEND_HEIGHT,stroke:E.COLORS.BORDER,strokeWidth:"1",strokeDasharray:E.BORDER_DASH_PATTERN}),
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, medianValue, companyValue, averageValue, companyPosition, averagePosition, labelCompany, labelAverage, labelMinimum, labelMedian, labelMaximum, labelYPositions, labelPositions, animated, precision, unit, valueFormatter, }: GaugeLabelsProps) => import("react/jsx-runtime").JSX.Element;
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{jsxs as e,jsx as t}from"react/jsx-runtime";import{useRef as i,useEffect as n}from"react";import{FoodsTooltip as l}from"../../../Tooltip/FoodsTooltip.js";import{GaugeTooltip as a}from"./GaugeTooltip.js";import{formatValue as o}from"../utils/formatters.js";import{useTheme as r}from"@mui/material";const m=({minValue:m,maxValue:s,medianValue:d,companyValue:c,averageValue:h,companyPosition:u,averagePosition:f,labelCompany:x,labelAverage:p,labelMinimum:y,labelMedian:g,labelMaximum:b,labelYPositions:v,labelPositions:W,animated:A,precision:z=0,unit:B="",valueFormatter:S})=>{const V=r(),j=i(null),F={transition:A?"transform 0.3s linear":"none"},P=V.custom.grey[2800],T=e=>e>=m&&e<=s;return n(()=>{if(j.current&&A){const e=j.current;e.style.opacity="0",setTimeout(()=>{e.style.transition="all 0.5s linear",e.style.opacity="1"},300)}},[A]),/* @__PURE__ */e("g",{ref:j,children:[
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, precision, unit, labelCompany, labelAverage, valueFormatter, }: GaugeMarkersProps) => import("react/jsx-runtime").JSX.Element;
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 o}from"../constants.js";import{FoodsTooltip as i}from"../../../Tooltip/FoodsTooltip.js";import{GaugeTooltip as l}from"./GaugeTooltip.js";import{useTheme as n}from"@mui/material";const s=({scale:s,companyValue:m,averageValue:c,markersYPosition:u,companyMarkerY:A,averageMarkerY:p,animated:y=!1,minValue:d,maxValue:E,precision:G=2,unit:R="",labelCompany:h="",labelAverage:f="",valueFormatter:k})=>{const g=n(),D=r(null),_={transition:y?"transform 0.3s linear":"none"},I=g.custom.grey[2800],T=e=>e>=d&&e<=E;return a(()=>{if(D.current&&y){const e=D.current;e.style.opacity="0",setTimeout(()=>{e.style.transition="all 0.5s linear",e.style.opacity="1"},300)}},[y]),/* @__PURE__ */e("g",{ref:D,children:[[d,E].map((r,a)=>{const i=`edge-${a}`,l=o.GAUGE_PADDING+s(r);/* @__PURE__ */
2
- return e("g",{transform:`translate(${l}, 0)`,style:_,children:[
3
- /* @__PURE__ */t("circle",{cy:u,r:o.MARKER.EDGE_RADIUS,fill:I}),
4
- /* @__PURE__ */t("line",{y1:u-o.GAUGE_HEIGHT/2,y2:u+o.GAUGE_HEIGHT/2,stroke:I,strokeWidth:"2"})]},i)}),T(m)&&/* @__PURE__ */t(i,{width:"unset",title:/* @__PURE__ */t(l,{label:h,value:m,unit:R,precision:G,valueFormatter:k}),children:/* @__PURE__ */e("g",{transform:`translate(${o.GAUGE_PADDING+s(m)}, 0)`,style:_,children:[
5
- /* @__PURE__ */t("line",{y1:A.start,y2:A.end,stroke:I,strokeWidth:"1"}),
6
- /* @__PURE__ */t("circle",{cy:u,r:o.MARKER.COMPANY_RADIUS,stroke:I,strokeWidth:o.MARKER.COMPANY_STROKE_WIDTH,fill:g.palette.common.white})]})}),T(c)&&/* @__PURE__ */t(i,{width:"unset",title:/* @__PURE__ */t(l,{label:f,value:c,unit:R,precision:G,valueFormatter:k}),children:/* @__PURE__ */e("g",{"data-testid":"horizontal-gauge-average-marker",transform:`translate(${o.GAUGE_PADDING+s(c)}, 0)`,style:_,children:[
7
- /* @__PURE__ */t("line",{y1:p.start,y2:p.end,stroke:I,strokeWidth:"1"}),
8
- /* @__PURE__ */t("circle",{cy:u,r:o.MARKER.AVERAGE_RADIUS,fill:g.palette.common.white,stroke:I,strokeWidth:o.MARKER.AVERAGE_STROKE_WIDTH})]})})]})};export{s as GaugeMarkers};
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,2 @@
1
+ import { GaugeStatisticsProps } from '../types';
2
+ export declare const GaugeStatistics: (props: GaugeStatisticsProps) => import("react/jsx-runtime").JSX.Element;
@@ -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 e=({minValue:e,maxValue:T,companyValue:_,averageValue:G,labelCompany:O,labelAverage:L,width:r,height:n})=>{const o=a(e,T,r),t=E(_,O,o,r),i=E(G,L,o,r),l=n/2,U=l-A.GAUGE_HEIGHT,m=U+A.GAUGE_HEIGHT/2,Y={start:l-A.LAYOUT.COMPANY_MARKER_OFFSET,end:U-A.LAYOUT.COMPANY_MARKER_OFFSET},F={start:l-A.LAYOUT.AVERAGE_MARKER_TOP_OFFSET,end:l+A.GAUGE_HEIGHT-A.LAYOUT.AVERAGE_MARKER_BOTTOM_OFFSET},s={company:n*A.LAYOUT.COMPANY_LABEL_VERTICAL_RATIO-A.LAYOUT.COMPANY_LABEL_OFFSET,average:n*A.LAYOUT.AVERAGE_LABEL_VERTICAL_RATIO-A.LAYOUT.AVERAGE_LABEL_OFFSET,title:U-A.LAYOUT.TITLE_OFFSET,values:n-A.LAYOUT.VALUES_LABEL_OFFSET,legend:n-A.LAYOUT.LEGEND_LABEL_OFFSET},R={min:{x:A.GAUGE_PADDING,anchor:"middle"},median:{x:r/2,anchor:"middle"},max:{x:r-A.GAUGE_PADDING,anchor:"middle"}};return{scale:o,companyPosition:t,averagePosition:i,gaugeBackgroundProps:{x:A.GAUGE_PADDING,y:m-A.GAUGE_HEIGHT/2,width:r-2*A.GAUGE_PADDING,height:A.GAUGE_HEIGHT,animated:!1},markerY:m,companyMarkerY:Y,averageMarkerY:F,labelY:s,labelPositions:R}};export{e as useGaugeCalculations};
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
- medianValue: number;
88
- scale: (value: number) => number;
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
- precision?: number;
103
- unit?: string;
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
- import { ReactNode } from 'react';
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 c,Cell as h,Label as p,Rectangle as u}from"recharts";import y from"chroma-js";import{PolymorphicChartTooltip as v}from"../PolymorphicChartTooltip.js";import{FoodsBadge as f}from"../../../Badge/FoodsBadge.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([]),P=i([]),S=i([]),[T,W]=r(!1),B=!T;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__ */
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(c,{dataKey:"value",isAnimationActive:!1,style:{pointerEvents:"none"},radius:[4,4,0,0],children:r.map((t,i)=>/* @__PURE__ */e(h,{fill:n,style:{animation:"pulse 1.5s ease-in-out infinite"}},`sk-${i}`))})]})})})}const I=0===(b?.length??0)||b.every(e=>0===Number(e.value));/* @__PURE__ */
7
- return t(a,I?{position:"relative",width:"100%",height:C,children:[
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(c,{dataKey:"value",isAnimationActive:!1,radius:[4,4,0,0],style:{pointerEvents:"none"},children:/* @__PURE__ */e(h,{fill:"rgba(0, 0, 0, 0)"})})]})}),
13
- /* @__PURE__ */e(f,{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:[
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(c,{dataKey:"value",radius:[4,4,0,0],animationDuration:300,isAnimationActive:B,onAnimationEnd:()=>W(!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&&(P.current[s]=r),"number"==typeof a&&(S.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=P.current[L],r=S.current[L],n="number"==typeof i&&"number"==typeof r?i:C/2;return"number"!=typeof t||"number"!=typeof n?null:/* @__PURE__ */e(v,{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};
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 o}from"react";import{useTheme as r,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{PolymorphicChartTooltip as y}from"../PolymorphicChartTooltip.js";import{FoodsBadge as v}from"../../../Badge/FoodsBadge.js";const f={top:35,right:10,left:20,bottom:0},k=k=>{const g=r(),{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]=o(!1),P=!z,T=g.palette.primary.main;if(F){const i=Math.max(5,Math.min(9,x?.length||7)),o=Array.from({length:i}).map((e,t)=>({name:`${t}`,value:100*Math.random()})),r=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:o,margin:f,children:[
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:r,strokeWidth:3,dot:{r:5,stroke:r,fill:r},isAnimationActive:!1,style:{pointerEvents:"none",animation:"pulse 1.5s ease-in-out infinite"}})]})})})}const B=0===(x?.length??0)||x.every(e=>0===Number(e.value));/* @__PURE__ */
8
- return t(n,B?{position:"relative",width:"100%",height:W,children:[
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(v,{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:[
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:T,strokeWidth:3,animationDuration:300,isAnimationActive:P,onAnimationEnd:()=>C(!0),dot:t=>{const{cx:i,cy:o,payload:r,index:n}=t,a="number"==typeof r?.index?r.index:0,s="number"==typeof n?n:a;"number"==typeof i&&"number"==typeof o&&(j.current[s]={x:i,y:o});const l=A===s,d=r?.color||$,m=null===A||l?d:u(d).alpha(.4).css();/* @__PURE__ */
21
- return e("g",{children:/* @__PURE__ */e("circle",{cx:i,cy:o,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(y,{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};
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{PolymorphicChartTooltip as m}from"../PolymorphicChartTooltip.js";import{FoodsBadge as h}from"../../../Badge/FoodsBadge.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__ */
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(h,{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__ */
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(m,{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};
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};
@@ -1,13 +1,14 @@
1
- import{jsxs as e,Fragment as t,jsx as r}from"react/jsx-runtime";import{useTheme as i}from"@mui/material";import{usePlotArea as n,ReferenceLine as o,DefaultZIndexes as a,ZIndexLayer as l,Dot as x}from"recharts";import{POINT_RADIUS as d}from"./utils.js";const s=a.cursorLine,p=a.label+1,m=m=>{const h=i(),c=n(),{hover:y,valueFormatterFn:f=h.numbers.valueFormatterFn,precision:u,xDomain:g,yDomain:v,pointColor:k,isPointSelected:X=!1}=m;if(!y||!c)return null;const Y=e=>parseFloat(h.spacing(e)),z=Y(1),E=Y(2.5),F=Y(3.75),W=Y(0),b=h.shape.borderRadius??4,w=h.custom.grey[2800],I=h.palette.common.white,D=e=>f(e,u),S=e=>Math.max(F,Math.round(12*e.length*.6)+2*z),j=D(y.dataY),A=S(j),B=c.x-W-A-15,M=y.pixelY-E/2,C=B+A/2,L=M+E/2+1,P=D(y.dataX),R=S(P),q=y.pixelX-R/2,G=c.y+c.height+20,H=q+R/2,J=G+E/2+1;/* @__PURE__ */
1
+ import{jsxs as e,Fragment as t,jsx as r}from"react/jsx-runtime";import{useTheme as n}from"@mui/material";import{usePlotArea as i,ReferenceLine as o,DefaultZIndexes as a,ZIndexLayer as l,Dot as d}from"recharts";import{POINT_RADIUS as s}from"./utils.js";const x=a.cursorLine,p=a.label+1,h=h=>{const c=n(),m=i(),{hover:y,valueFormatterFn:f=c.numbers.valueFormatterFn,precision:v,xDomain:g,yDomain:u,pointColor:k,isPointSelected:X=!1}=h;if(!y||!m)return null;const Y=e=>parseFloat(c.spacing(e)),z=Y(1),E=Y(2.5),F=Y(3.75),I=Y(0),W=c.shape.borderRadius??4,b=c.custom.grey[2800],w=c.palette.common.white,D=e=>f(e,v),S=e=>Math.max(F,Math.round(12*e.length*.6)+2*z),j=D(y.dataY),A=S(j),B=m.x-I-A-15,M=y.pixelY-E/2,C=B+A/2,L=M+E/2+1,P=D(y.dataX),R=S(P),q=y.pixelX-R/2,G=m.y+m.height+20,H=q+R/2,J=G+E/2+1;/* @__PURE__ */
2
2
  return e(t,{children:[
3
- /* @__PURE__ */r(o,{segment:[{x:g[0],y:y.dataY},{x:y.dataX,y:y.dataY}],stroke:h.palette.text.primary,style:{pointerEvents:"none"},zIndex:s}),
4
- /* @__PURE__ */r(o,{segment:[{x:y.dataX,y:v[0]},{x:y.dataX,y:y.dataY}],stroke:h.palette.text.primary,style:{pointerEvents:"none"},zIndex:s}),k&&/* @__PURE__ */r(l,{zIndex:a.activeDot,children:/* @__PURE__ */r(x,{cx:y.pixelX,cy:y.pixelY,r:d,fill:k,"data-scatter-hovered-point":"true",style:{pointerEvents:"none",...X?{filter:"drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.5))",stroke:"#fff",strokeWidth:2}:{filter:"none"}}})}),
3
+ /* @__PURE__ */r(o,{segment:[{x:g[0],y:y.dataY},{x:y.dataX,y:y.dataY}],stroke:c.palette.text.primary,style:{pointerEvents:"none"},zIndex:x}),
4
+ /* @__PURE__ */r(o,{segment:[{x:y.dataX,y:u[0]},{x:y.dataX,y:y.dataY}],stroke:c.palette.text.primary,style:{pointerEvents:"none"},zIndex:x}),
5
+ /* @__PURE__ */e(l,{zIndex:x,children:[
6
+ /* @__PURE__ */r("g",{"data-scatter-hover-marker-connector":"y",style:{pointerEvents:"none"},children:/* @__PURE__ */r("line",{x1:m.x,y1:y.pixelY,x2:m.x-15,y2:y.pixelY,stroke:c.palette.text.primary,strokeWidth:1})}),
7
+ /* @__PURE__ */r("g",{"data-scatter-hover-marker-connector":"x",style:{pointerEvents:"none"},children:/* @__PURE__ */r("line",{x1:y.pixelX,y1:G+E,x2:y.pixelX,y2:G-E,stroke:c.palette.text.primary,strokeWidth:1})})]}),k&&/* @__PURE__ */r(l,{zIndex:a.activeDot,children:/* @__PURE__ */r(d,{cx:y.pixelX,cy:y.pixelY,r:s,fill:k,"data-scatter-hovered-point":"true",style:{pointerEvents:"none",...X?{filter:"drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.5))",stroke:"#fff",strokeWidth:2}:{filter:"none"}}})}),
5
8
  /* @__PURE__ */e(l,{zIndex:p,children:[
6
9
  /* @__PURE__ */e("g",{"data-scatter-hover-marker":"y",style:{pointerEvents:"none"},children:[
7
- /* @__PURE__ */r("line",{x1:c.x,y1:y.pixelY,x2:c.x-15,y2:y.pixelY,stroke:h.palette.text.primary,strokeWidth:1}),
8
- /* @__PURE__ */r("rect",{x:B,y:M,width:A,height:E,fill:w,rx:b}),
9
- /* @__PURE__ */r("text",{x:C,y:L,fill:I,fontSize:12,fontWeight:600,textAnchor:"middle",dominantBaseline:"middle",children:j})]}),
10
+ /* @__PURE__ */r("rect",{x:B,y:M,width:A,height:E,fill:b,rx:W}),
11
+ /* @__PURE__ */r("text",{x:C,y:L,fill:w,fontSize:12,fontWeight:600,textAnchor:"middle",dominantBaseline:"middle",children:j})]}),
10
12
  /* @__PURE__ */e("g",{"data-scatter-hover-marker":"x",style:{pointerEvents:"none"},children:[
11
- /* @__PURE__ */r("line",{x1:y.pixelX,y1:G+E,x2:y.pixelX,y2:G-E,stroke:h.palette.text.primary,strokeWidth:1}),
12
- /* @__PURE__ */r("rect",{x:q,y:G,width:R,height:E,fill:w,rx:b}),
13
- /* @__PURE__ */r("text",{x:H,y:J,fill:I,fontSize:12,fontWeight:600,textAnchor:"middle",dominantBaseline:"middle",children:P})]})]})]})};export{m as ScatterPlotHoverOverlay};
13
+ /* @__PURE__ */r("rect",{x:q,y:G,width:R,height:E,fill:b,rx:W}),
14
+ /* @__PURE__ */r("text",{x:H,y:J,fill:w,fontSize:12,fontWeight:600,textAnchor:"middle",dominantBaseline:"middle",children:P})]})]})]})};export{h as ScatterPlotHoverOverlay};
@@ -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};
@@ -30,13 +30,14 @@ export type ConfirmOptions = {
30
30
  confirmExit: true;
31
31
  confirmOptions: ConfirmOptionsType;
32
32
  };
33
+ export type FoodsFormValidationResult = boolean | void;
33
34
  export type FoodsFormBaseProps = ConfirmOptions & {
34
35
  pages: FoodsPage[];
35
36
  children?: ReactNode;
36
37
  textOptions: DisplayTextOptions;
37
38
  startingPage?: number;
38
39
  onClose?: () => void;
39
- onValidate?: () => void;
40
+ onValidate?: () => FoodsFormValidationResult | Promise<FoodsFormValidationResult>;
40
41
  onPageChange?: (newPageIndex: number, previousPageIndex: number) => void;
41
42
  showSync?: boolean;
42
43
  isLoading?: boolean;
@@ -1,6 +1,8 @@
1
- import{jsx as e,jsxs as i}from"react/jsx-runtime";import{useTheme as o,useMediaQuery as r,Button as n,Box as t,Typography as a,Stack as d}from"@mui/material";import{CloseOutlined as s}from"@mui/icons-material";import{useFormBaseContext as c}from"../FormBaseContext.js";import{SavingCloudStatus as l}from"./SavingCloudStatus.js";import{FoodsIcon as p}from"../../../Icons/FoodsIcon.js";import{WhitePopover as m}from"../../../Popover/WhitePopover.js";const g=()=>{const{confirmExit:g,selectedPageIndex:x,setPage:h,maxPage:u,forwardLock:f,previousLock:v,textOptions:w,onClose:k,onValidate:y,onPageChange:b,showSync:P,setFormSaved:C,setIsConfirmOpen:I,isLoading:L,selectedPageIndex:j}=c(),S=o(),W=r(S.breakpoints.down("md")),z=x===u-1&&w.finalPage?w.finalPage:w.nextPage,R=/* @__PURE__ */e(n,{variant:"primary",disabled:f.isLocked||L,endIcon:/* @__PURE__ */e(p,{icon:"arrowTrajectory",size:2}),onClick:()=>x===u-1?(C(!0),void y?.()):(C(!1),b?.(x+1,x),h(x+1)),sx:W?{minWidth:"80px",fontSize:"0.875rem",padding:"8px 12px"}:{},children:z}),F=/* @__PURE__ */i(t,{padding:"12px 16px",children:[
2
- /* @__PURE__ */e(a,{variant:"body-bold",children:w.warningText?w.warningText:""}),
1
+ import{jsx as e,jsxs as i}from"react/jsx-runtime";import{useTheme as n,useMediaQuery as o,Button as r,Box as t,Typography as a,Stack as s}from"@mui/material";import{CloseOutlined as d}from"@mui/icons-material";import{useFormBaseContext as c}from"../FormBaseContext.js";import{SavingCloudStatus as p}from"./SavingCloudStatus.js";import{FoodsIcon as m}from"../../../Icons/FoodsIcon.js";import{WhitePopover as g}from"../../../Popover/WhitePopover.js";const l=()=>{const{confirmExit:l,selectedPageIndex:x,setPage:h,maxPage:f,forwardLock:u,previousLock:w,textOptions:v,onClose:y,onValidate:k,onPageChange:P,showSync:b,setFormSaved:C,setIsConfirmOpen:I,isLoading:L,selectedPageIndex:j}=c(),S=n(),z=o(S.breakpoints.down("md")),W=x===f-1&&v.finalPage?v.finalPage:v.nextPage,F=/* @__PURE__ */e(r,{variant:"primary",disabled:u.isLocked||L,endIcon:/* @__PURE__ */e(m,{icon:"arrowTrajectory",size:2}),onClick:()=>{if(x!==f-1)return C(!1),P?.(x+1,x),h(x+1);(async()=>{C(!1);try{const e=await(k?.());C(!1!==e)}catch{C(!1)}})()},sx:z?{minWidth:"80px",fontSize:"0.875rem",padding:"8px 12px"}:{},children:W}),T=v.previousPage&&/* @__PURE__ */e(r,{sx:z?{minWidth:"80px",fontSize:"0.875rem",padding:"8px 12px"}:{minWidth:"90px"},variant:"text",disabled:0===j||w.isLocked||L,startIcon:0===j||w.isLocked||L?null:/* @__PURE__ */e(m,{icon:"arrowLeft",size:2}),onClick:()=>{if(C(!1),0!==x)return P?.(x-1,x),h(x-1);P?.(x,x)},children:v.previousPage}),O=/* @__PURE__ */i(t,{padding:"12px 16px",children:[
2
+ /* @__PURE__ */e(a,{variant:"body-bold",children:v.warningText?v.warningText:""}),
3
3
  /* @__PURE__ */e("br",{}),
4
- /* @__PURE__ */e(a,{variant:"body",children:f.isLocked&&f.message||""})]});return W?/* @__PURE__ */e(d,{direction:"row",alignItems:"center",gap:"16px",children:/* @__PURE__ */e(d,{direction:"row",gap:"16px",alignItems:"center",justifyContent:"flex-end",width:"100%",children:k&&/* @__PURE__ */e(n,{variant:"white-filled",onClick:()=>g?I(!0):k(),sx:{minWidth:0,aspectRatio:1,borderRadius:"100%",padding:0,width:"40px",height:"40px","&:hover":{background:S.custom.grey[400]},"&:active":{background:S.custom.grey[600]}},children:/* @__PURE__ */e(s,{sx:{width:"20px",color:S.custom.grey[2800]}})})})}):/* @__PURE__ */i(d,{direction:"row",alignItems:"center",justifyContent:"end",gap:"28px",children:[
5
- /* @__PURE__ */e(t,{sx:{">*":{display:"flex"}},children:P&&/* @__PURE__ */e(l,{})}),
6
- /* @__PURE__ */i(d,{direction:"row",gap:"20px",children:[w.previousPage&&/* @__PURE__ */e(n,{sx:{minWidth:"90px"},variant:"text",disabled:0===j||v.isLocked||L,startIcon:0===j||v.isLocked||L?null:/* @__PURE__ */e(p,{icon:"arrowLeft",size:2}),onClick:()=>{if(C(!1),0!==x)return b?.(x-1,x),h(x-1);b?.(x,x)},children:w.previousPage}),f.isLocked?z&&/* @__PURE__ */e(m,{icon:R,body:F,size:"260px",leftPosition:130}):z&&R]}),k&&/* @__PURE__ */e(n,{variant:"white-filled",onClick:()=>g?I(!0):k(),sx:{minWidth:0,aspectRatio:1,borderRadius:"100%",padding:0,"&:hover":{background:S.custom.grey[400]},"&:active":{background:S.custom.grey[600]}},children:/* @__PURE__ */e(s,{sx:{width:"20px",color:S.custom.grey[2800]}})})]})};export{g as ActionButtons};
4
+ /* @__PURE__ */e(a,{variant:"body",children:u.isLocked&&u.message||""})]}),R=u.isLocked&&W?/* @__PURE__ */e(g,{icon:F,body:O,size:"260px",leftPosition:130}):W&&F,B=y&&/* @__PURE__ */e(r,{variant:"white-filled",onClick:()=>l?I(!0):y(),sx:{minWidth:0,aspectRatio:1,borderRadius:"100%",padding:0,...z&&{width:S.spacing(5),height:S.spacing(5)},"&:hover":{background:S.custom.grey[400]},"&:active":{background:S.custom.grey[600]}},children:/* @__PURE__ */e(d,{sx:{width:S.spacing(2.5),color:S.custom.grey[2800]}})});/* @__PURE__ */
5
+ return i(s,z?{direction:"row",alignItems:"center",gap:S.spacing(1),width:"100%",children:[
6
+ /* @__PURE__ */i(s,{direction:"row",gap:S.spacing(1),alignItems:"center",justifyContent:"space-between",flexGrow:1,children:[T,R]}),B]}:{direction:"row",alignItems:"center",justifyContent:"end",gap:"28px",children:[
7
+ /* @__PURE__ */e(t,{sx:{">*":{display:"flex"}},children:b&&/* @__PURE__ */e(p,{})}),
8
+ /* @__PURE__ */i(s,{direction:"row",gap:"20px",children:[T,R]}),B]})};export{l as ActionButtons};
@@ -1,8 +1,7 @@
1
- import{jsx as i,jsxs as r}from"react/jsx-runtime";import{IconThread as e}from"./IconThread.js";import{useTheme as t,useMediaQuery as n,Box as o,Stack as d}from"@mui/material";import{BarTitle as s}from"./BarTitle.js";import{ActionButtons as l}from"./ActionButtons.js";const p=()=>{const p=t();return n(p.breakpoints.down("md"))?/* @__PURE__ */i(o,{sx:{zIndex:1e3,minHeight:"auto",top:"28px",border:"1px solid #E7E6E4",borderRadius:"28px",backgroundColor:"#FFFFFF",padding:"20px 24px"},children:/* @__PURE__ */r(d,{direction:"column",spacing:1,alignItems:"center",children:[
2
- /* @__PURE__ */r(o,{sx:{width:"100%",display:"flex",justifyContent:"center",alignItems:"flex-start"},children:[
3
- /* @__PURE__ */i(s,{}),
4
- /* @__PURE__ */i(l,{})]}),
5
- /* @__PURE__ */i(o,{sx:{display:"flex",justifyContent:"center"},children:/* @__PURE__ */i(e,{})})]})}):/* @__PURE__ */r(o,{sx:{zIndex:1e3,minHeight:"96px",position:"sticky",top:"28px",border:"1px solid #E7E6E4",borderRadius:"52px",backgroundColor:"#FFFFFF",padding:"20px 28px",display:"grid",gridTemplateColumns:"1fr 50% 1fr",gridTemplateRows:"1fr",alignItems:"center"},children:[
6
- /* @__PURE__ */i(o,{sx:{gridColumn:"1 / 3",gridRow:" 1 / 1",display:"flex",justifyContent:"left"},children:/* @__PURE__ */i(s,{})}),
7
- /* @__PURE__ */i(o,{sx:{gridColumn:"2 / 3",gridRow:" 1 / 1",display:"flex",justifyContent:"center"},children:/* @__PURE__ */i(e,{})}),
8
- /* @__PURE__ */i(o,{sx:{gridColumn:"3 / 3",gridRow:" 1 / 1",display:"flex",justifyContent:"right"},children:/* @__PURE__ */i(l,{})})]})};export{p as FormTopBar};
1
+ import{jsx as i,jsxs as r}from"react/jsx-runtime";import{IconThread as e}from"./IconThread.js";import{useTheme as o,useMediaQuery as t,Box as n,Stack as d}from"@mui/material";import{BarTitle as s}from"./BarTitle.js";import{ActionButtons as l}from"./ActionButtons.js";const p=()=>{const p=o();return t(p.breakpoints.down("md"))?/* @__PURE__ */i(n,{sx:{zIndex:1e3,minHeight:"auto",top:"28px",border:"1px solid #E7E6E4",borderRadius:"28px",backgroundColor:"#FFFFFF",padding:"20px 24px"},children:/* @__PURE__ */r(d,{direction:"column",spacing:1,alignItems:"center",children:[
2
+ /* @__PURE__ */i(n,{sx:{width:"100%"},children:/* @__PURE__ */i(s,{})}),
3
+ /* @__PURE__ */i(n,{sx:{display:"flex",justifyContent:"center"},children:/* @__PURE__ */i(e,{})}),
4
+ /* @__PURE__ */i(n,{sx:{width:"100%"},children:/* @__PURE__ */i(l,{})})]})}):/* @__PURE__ */r(n,{sx:{zIndex:1e3,minHeight:"96px",position:"sticky",top:"28px",border:"1px solid #E7E6E4",borderRadius:"52px",backgroundColor:"#FFFFFF",padding:"20px 28px",display:"grid",gridTemplateColumns:"1fr 50% 1fr",gridTemplateRows:"1fr",alignItems:"center"},children:[
5
+ /* @__PURE__ */i(n,{sx:{gridColumn:"1 / 3",gridRow:" 1 / 1",display:"flex",justifyContent:"left"},children:/* @__PURE__ */i(s,{})}),
6
+ /* @__PURE__ */i(n,{sx:{gridColumn:"2 / 3",gridRow:" 1 / 1",display:"flex",justifyContent:"center"},children:/* @__PURE__ */i(e,{})}),
7
+ /* @__PURE__ */i(n,{sx:{gridColumn:"3 / 3",gridRow:" 1 / 1",display:"flex",justifyContent:"right"},children:/* @__PURE__ */i(l,{})})]})};export{p as FormTopBar};
@@ -1,13 +1,15 @@
1
+ import { TabProps } from '@mui/material';
1
2
  export type CountTab<Id extends string = string> = {
2
3
  id: Id;
3
4
  label: string;
4
5
  count: number;
6
+ tabProps?: Pick<TabProps, "id" | "aria-controls">;
5
7
  };
6
8
  export type CountTabsProps<Id extends string = string> = {
7
9
  tabs: CountTab<Id>[];
8
10
  activeId: Id;
9
11
  onChange: (id: Id) => void;
10
12
  isLoading?: boolean;
11
- ariaLabel?: string;
13
+ ariaLabel: string;
12
14
  };
13
15
  export declare const CountTabs: <Id extends string = string>(props: CountTabsProps<Id>) => import("react/jsx-runtime").JSX.Element;
@@ -1,5 +1,5 @@
1
- import{jsx as e,jsxs as o}from"react/jsx-runtime";import{useTheme as r,Stack as t,ButtonBase as n,Typography as a,Skeleton as i,alpha as l}from"@mui/material";import{useRef as d}from"react";const c=c=>{const{tabs:s,activeId:b,onChange:g,isLoading:h=!1,ariaLabel:p}=c,m=r(),u=d([]),y=m.custom.countTabs;/* @__PURE__ */
2
- return e(t,{role:"tablist","aria-label":p,direction:"row",flexWrap:"wrap",gap:y.gap,children:s.map((r,t)=>{const d=r.id===b,c=d?y.selected:y.default;/* @__PURE__ */
3
- return o(n,{ref:e=>{u.current[t]=e},role:"tab","aria-label":h?r.label:`${r.label} - ${r.count}`,"aria-selected":d,tabIndex:d?0:-1,onKeyDown:e=>((e,o)=>{let r;"ArrowRight"===e.key&&(r=(o+1)%s.length),"ArrowLeft"===e.key&&(r=(o-1+s.length)%s.length),"Home"===e.key&&(r=0),"End"===e.key&&(r=s.length-1),void 0!==r&&(e.preventDefault(),u.current[r]?.focus())})(e,t),onClick:()=>g(r.id),sx:{alignItems:"center",background:c.background,border:`${m.custom.strokes.containerDivider.width} ${m.custom.strokes.containerDivider.style} ${c.borderColor}`,borderRadius:y.borderRadius,boxShadow:c.boxShadow,color:c.color,display:"inline-flex",fontFamily:m.typography.fontFamily,minHeight:y.minHeight,padding:y.padding,"&:hover":{background:c.hoverBackground}},children:[
4
- /* @__PURE__ */e(a,{component:"span",variant:"body-bold",color:"inherit",children:r.label}),
5
- /* @__PURE__ */e(a,{component:"span",variant:"body-bold",color:"inherit",sx:{px:y.separatorPaddingInline},children:"-"}),h?/* @__PURE__ */e(i,{variant:"text",width:y.loadingWidth,sx:{bgcolor:d?l(m.custom.grey[100],y.loadingSelectedOpacity):void 0}}):/* @__PURE__ */e(a,{component:"span",variant:"body-bold",color:"inherit",children:r.count})]},r.id)})})};export{c as CountTabs};
1
+ import{jsx as o,jsxs as e}from"react/jsx-runtime";import{useTheme as r,Stack as i,ButtonBase as t,Typography as n,Skeleton as a,alpha as l}from"@mui/material";import{useRef as d}from"react";const c=c=>{const{tabs:s,activeId:b,onChange:u,isLoading:g=!1,ariaLabel:p}=c,h=r(),m=d([]),f=h.custom.countTabs;/* @__PURE__ */
2
+ return o(i,{role:"tablist","aria-label":p,"aria-busy":g,direction:"row",flexWrap:"wrap",gap:f.gap,children:s.map((r,i)=>{const d=r.id===b,c=d?f.selected:f.default;/* @__PURE__ */
3
+ return e(t,{action:o=>{m.current[i]=o},role:"tab",id:r.tabProps?.id,"aria-controls":r.tabProps?.["aria-controls"],"aria-label":g?r.label:`${r.label} - ${r.count}`,"aria-selected":d,tabIndex:d?0:-1,onKeyDown:o=>((o,e)=>{let r;"ArrowRight"===o.key&&(r=(e+1)%s.length),"ArrowLeft"===o.key&&(r=(e-1+s.length)%s.length),"Home"===o.key&&(r=0),"End"===o.key&&(r=s.length-1),void 0!==r&&(o.preventDefault(),m.current[r]?.focusVisible())})(o,i),onClick:()=>u(r.id),sx:{alignItems:"center",background:c.background,border:`${h.custom.strokes.containerDivider.width} ${h.custom.strokes.containerDivider.style} ${c.borderColor}`,borderRadius:f.borderRadius,boxShadow:c.boxShadow,color:c.color,display:"inline-flex",fontFamily:h.typography.fontFamily,minHeight:f.minHeight,padding:f.padding,"&:hover":{background:c.hoverBackground},"&.Mui-focusVisible":{outline:`${f.focusRing.width} solid ${f.focusRing.color}`,outlineOffset:f.focusRing.offset}},children:[
4
+ /* @__PURE__ */o(n,{component:"span",variant:"body-bold",color:"inherit",children:r.label}),
5
+ /* @__PURE__ */o(n,{component:"span",variant:"body-bold",color:"inherit",sx:{px:f.separatorPaddingInline},children:"-"}),g?/* @__PURE__ */o(a,{variant:"text",width:f.loadingWidth,sx:{bgcolor:d?l(h.custom.grey[100],f.loadingSelectedOpacity):void 0}}):/* @__PURE__ */o(n,{component:"span",variant:"body-bold",color:"inherit",children:r.count})]},r.id)})})};export{c as CountTabs};
@@ -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};
@@ -239,6 +239,11 @@ export declare const countTabs: {
239
239
  readonly minHeight: "36px";
240
240
  readonly padding: "8px 12px";
241
241
  readonly borderRadius: "8px";
242
+ readonly focusRing: {
243
+ readonly color: "#393A36";
244
+ readonly width: "2px";
245
+ readonly offset: "2px";
246
+ };
242
247
  readonly separatorPaddingInline: "4px";
243
248
  readonly loadingWidth: 24;
244
249
  readonly loadingSelectedOpacity: 0.3;
@@ -1 +1 @@
1
- import e from"i18next";import{greyTheme as i,shadows as r,redTheme as o,allMainColors as t,allColors as d,extraColors as a,dataVisualizationColors as n,coralTheme as p,blueTheme as h,yellowTheme as x,orangeTheme as c,greenTheme as l}from"./colors.js";const g={containerDivider:{color:i[600],style:"solid",width:"1px"}},s={width:"300px"},u={green:{surface:"#F2FFF9"}},m={surface:"#025155",emptyGuidanceForeground:"#EDF9FA",loading:{opacity:.7,transition:"opacity 120ms ease-out"}},b={width:"300px",heights:{inactive:"215px",selected:"231px"},icon:{containerSize:"48px",glyphSize:{width:40,height:40}},carouselControl:{inlineEndOffset:"-5px"},details:{chartHeight:"481px"}},w={stroke:{...g.containerDivider,color:"#E5E3E0"}},y={emptyIndicator:{size:"44px",iconSize:{width:26,height:26}},inline:{width:"70px"}},k={emptyIndicator:{micro:{size:"20px",iconSize:{width:11,height:11}},small:{size:"24px",iconSize:{width:13,height:13}},inter:{size:"30px",iconSize:{width:20,height:20}},big:{size:"38px",iconSize:{width:28,height:28}}},unitOffset:{compact:"-1px",regular:"-2px"}},v={compact:{width:"100px",optionWidth:"130px"}},z={zeroValueWidth:"1px"},S={borderRadius:"8px",loadingIndicatorSize:28,errorMaxWidth:"260px",default:{size:120,stroke:g.containerDivider,emptyCopy:{typographyVariant:"body-regular",lineHeight:1.3}},compact:{size:110,contentInset:"6px",stroke:{...g.containerDivider,style:"dashed"},boxShadow:r.grey,emptyCopy:{width:"76px",typographyVariant:"small-regular"}},thumbnail:{size:70,contentInset:"4px",stroke:g.containerDivider,boxShadow:r.grey}},f={display:{height:"26px"}},$={gap:"8px",minHeight:"36px",padding:"8px 12px",borderRadius:"8px",separatorPaddingInline:"4px",loadingWidth:24,loadingSelectedOpacity:.3,default:{background:`linear-gradient(180deg, ${i[100]} 0%, ${i[300]} 154.5%)`,hoverBackground:`linear-gradient(180deg, ${i[100]} 0%, ${i[400]} 154.5%)`,borderColor:i[500],boxShadow:r.grey,color:i[2800]},selected:{background:`linear-gradient(180deg, ${i[2600]} 0%, ${i[3e3]} 100%)`,hoverBackground:i[2800],borderColor:i[2800],boxShadow:r.hard,color:i[100]}},B={primary:{height:"60px"},secondary:{height:"60px"}},C={summaryWidth:"250px",barWidth:"250px",lifecycleBreakdownWidth:"364px",subscoreBreakdownWidth:"346px",impactBreakdownWidth:"318px",impactZeroBreakdownWidth:"292px",impactBenefitBreakdownWidth:"551px"},W={handleBorderRadius:"50%",legacyTrackBackground:"rgba(0,0,0,.25)",sizes:{default:{width:"52px",height:"28px",thumbSize:"20px",thumbInset:"4px",thumbTravel:"24px",trackBorderRadius:"16px"},medium:{width:"44px",height:"24px",thumbSize:"16px",thumbInset:"4px",thumbTravel:"20px",trackBorderRadius:"14px"},small:{width:"36px",height:"20px",thumbSize:"12px",thumbInset:"4px",thumbTravel:"16px",trackBorderRadius:"10px"}},status:{uncheckedColor:i[1400],uncheckedIconColor:i[2e3],handleBackground:`linear-gradient(180deg, ${i[100]} 0%, ${i[300]} 100%)`,iconSize:{width:14,height:14},trackBorderRadius:"20px"}},D={size:"40px",iconSize:{width:20,height:20},borderRadius:"44px",default:{background:`linear-gradient(180deg, ${i[100]} 0%, ${i[300]} 154.5%)`,borderColor:o[500],color:o[500]},hovered:{background:o[400],borderColor:o[500],color:i[100]},pressed:{background:o[600],borderColor:o[600],color:i[100]}},R=`inset 0 0 0 ${g.containerDivider.width} ${g.containerDivider.color}`,I={gap:"4px",separatorIconSize:{width:16,height:16},pageLink:{height:"26px",paddingBlock:"2px",paddingInline:"8px",borderRadius:"8px",maxWidth:"226px",stroke:{default:R,hover:`inset 0 0 0 ${g.containerDivider.width} ${i[2800]}`},collapsed:{width:"24px",height:"16px",paddingInline:"4px",borderRadius:"4px"}},overflowMenu:{offset:"4px",padding:"16px",gap:"8px",borderRadius:"12px",boxShadow:`${R}, ${r.popover}`}},F=`${g.containerDivider.width} ${g.containerDivider.style} ${i[500]}`,E=`${g.containerDivider.width} ${g.containerDivider.style} ${g.containerDivider.color}`,V={contentAlignment:"center",default:{maxCharacters:100,width:"202px",maxWidth:"unset",padding:"12px 16px 12px 16px",borderRadius:"0.5rem",border:F,backgroundColor:i[100],boxShadow:`0px 4px 20px 0px ${i[500]}`,color:i[2800],margin:"8px",typographyVariant:"body-medium",arrow:{color:i[100],border:F}},simple:{width:"300px",maxWidth:"300px",contentMinHeight:"53px",paddingBlock:"2px",paddingInline:"8px",borderRadius:"8px",border:E,backgroundColor:i[100],boxShadow:r.popover,color:i[2500],margin:"8px",typographyVariant:"body-medium",arrow:{width:"16px",height:"8px",color:i[100],border:E}}},H={grey:i,red:o,green:l,orange:c,yellow:x,blue:h,coral:p,shadows:r,dataviz:{colors:n,extra:a,colorsWithExtra:d,onlyMainFromAll:t},doughnutCard:s,strokes:g,status:u,scoreCard:m,scoreOverviewCard:b,ingredientCard:w,scoreValue:y,numberWithUnit:k,formField:v,barChart:z,mediaUpload:S,tags:f,countTabs:$,tabs:B,scoreDetail:C,toggleSwitch:W,deleteButton:D,breadcrumb:I,tooltip:V,searchBox:{borderRadius:"24px",border:e=>"1px solid "+e.custom.grey[500],background:"white",boxShadow:e=>"0px 2px 8px 0px "+e.custom.grey[500]},rowMenuElement:{marginLeft:"12px",paddingRight:"8px",fontSize:"12px",fontWeight:"600",lineHeight:"20px"}},M={valueFormatterFn:(i,r=void 0)=>{const o=Number(i);return Number.isNaN(o)?"":r?o.toLocaleString(e.language,{maximumFractionDigits:r}):o.toLocaleString(e.language)}};export{z as barChart,I as breadcrumb,$ as countTabs,H as custom,D as deleteButton,s as doughnutCard,v as formField,w as ingredientCard,S as mediaUpload,k as numberWithUnit,M as numbers,m as scoreCard,C as scoreDetail,b as scoreOverviewCard,y as scoreValue,u as status,g as strokes,B as tabs,f as tags,W as toggleSwitch,V as tooltip};
1
+ import e from"i18next";import{greyTheme as i,shadows as r,redTheme as o,allMainColors as t,allColors as d,extraColors as a,dataVisualizationColors as n,coralTheme as p,blueTheme as h,yellowTheme as x,orangeTheme as c,greenTheme as l}from"./colors.js";const g={containerDivider:{color:i[600],style:"solid",width:"1px"}},s={width:"300px"},u={green:{surface:"#F2FFF9"}},m={surface:"#025155",emptyGuidanceForeground:"#EDF9FA",loading:{opacity:.7,transition:"opacity 120ms ease-out"}},b={width:"300px",heights:{inactive:"215px",selected:"231px"},icon:{containerSize:"48px",glyphSize:{width:40,height:40}},carouselControl:{inlineEndOffset:"-5px"},details:{chartHeight:"481px"}},w={stroke:{...g.containerDivider,color:"#E5E3E0"}},y={emptyIndicator:{size:"44px",iconSize:{width:26,height:26}},inline:{width:"70px"}},k={emptyIndicator:{micro:{size:"20px",iconSize:{width:11,height:11}},small:{size:"24px",iconSize:{width:13,height:13}},inter:{size:"30px",iconSize:{width:20,height:20}},big:{size:"38px",iconSize:{width:28,height:28}}},unitOffset:{compact:"-1px",regular:"-2px"}},v={compact:{width:"100px",optionWidth:"130px"}},z={zeroValueWidth:"1px"},S={borderRadius:"8px",loadingIndicatorSize:28,errorMaxWidth:"260px",default:{size:120,stroke:g.containerDivider,emptyCopy:{typographyVariant:"body-regular",lineHeight:1.3}},compact:{size:110,contentInset:"6px",stroke:{...g.containerDivider,style:"dashed"},boxShadow:r.grey,emptyCopy:{width:"76px",typographyVariant:"small-regular"}},thumbnail:{size:70,contentInset:"4px",stroke:g.containerDivider,boxShadow:r.grey}},f={display:{height:"26px"}},$={gap:"8px",minHeight:"36px",padding:"8px 12px",borderRadius:"8px",focusRing:{color:i[2800],width:"2px",offset:"2px"},separatorPaddingInline:"4px",loadingWidth:24,loadingSelectedOpacity:.3,default:{background:`linear-gradient(180deg, ${i[100]} 0%, ${i[300]} 154.5%)`,hoverBackground:`linear-gradient(180deg, ${i[100]} 0%, ${i[400]} 154.5%)`,borderColor:i[500],boxShadow:r.grey,color:i[2800]},selected:{background:`linear-gradient(180deg, ${i[2600]} 0%, ${i[3e3]} 100%)`,hoverBackground:i[2800],borderColor:i[2800],boxShadow:r.hard,color:i[100]}},B={primary:{height:"60px"},secondary:{height:"60px"}},C={summaryWidth:"250px",barWidth:"250px",lifecycleBreakdownWidth:"364px",subscoreBreakdownWidth:"346px",impactBreakdownWidth:"318px",impactZeroBreakdownWidth:"292px",impactBenefitBreakdownWidth:"551px"},W={handleBorderRadius:"50%",legacyTrackBackground:"rgba(0,0,0,.25)",sizes:{default:{width:"52px",height:"28px",thumbSize:"20px",thumbInset:"4px",thumbTravel:"24px",trackBorderRadius:"16px"},medium:{width:"44px",height:"24px",thumbSize:"16px",thumbInset:"4px",thumbTravel:"20px",trackBorderRadius:"14px"},small:{width:"36px",height:"20px",thumbSize:"12px",thumbInset:"4px",thumbTravel:"16px",trackBorderRadius:"10px"}},status:{uncheckedColor:i[1400],uncheckedIconColor:i[2e3],handleBackground:`linear-gradient(180deg, ${i[100]} 0%, ${i[300]} 100%)`,iconSize:{width:14,height:14},trackBorderRadius:"20px"}},D={size:"40px",iconSize:{width:20,height:20},borderRadius:"44px",default:{background:`linear-gradient(180deg, ${i[100]} 0%, ${i[300]} 154.5%)`,borderColor:o[500],color:o[500]},hovered:{background:o[400],borderColor:o[500],color:i[100]},pressed:{background:o[600],borderColor:o[600],color:i[100]}},R=`inset 0 0 0 ${g.containerDivider.width} ${g.containerDivider.color}`,I={gap:"4px",separatorIconSize:{width:16,height:16},pageLink:{height:"26px",paddingBlock:"2px",paddingInline:"8px",borderRadius:"8px",maxWidth:"226px",stroke:{default:R,hover:`inset 0 0 0 ${g.containerDivider.width} ${i[2800]}`},collapsed:{width:"24px",height:"16px",paddingInline:"4px",borderRadius:"4px"}},overflowMenu:{offset:"4px",padding:"16px",gap:"8px",borderRadius:"12px",boxShadow:`${R}, ${r.popover}`}},F=`${g.containerDivider.width} ${g.containerDivider.style} ${i[500]}`,E=`${g.containerDivider.width} ${g.containerDivider.style} ${g.containerDivider.color}`,V={contentAlignment:"center",default:{maxCharacters:100,width:"202px",maxWidth:"unset",padding:"12px 16px 12px 16px",borderRadius:"0.5rem",border:F,backgroundColor:i[100],boxShadow:`0px 4px 20px 0px ${i[500]}`,color:i[2800],margin:"8px",typographyVariant:"body-medium",arrow:{color:i[100],border:F}},simple:{width:"300px",maxWidth:"300px",contentMinHeight:"53px",paddingBlock:"2px",paddingInline:"8px",borderRadius:"8px",border:E,backgroundColor:i[100],boxShadow:r.popover,color:i[2500],margin:"8px",typographyVariant:"body-medium",arrow:{width:"16px",height:"8px",color:i[100],border:E}}},H={grey:i,red:o,green:l,orange:c,yellow:x,blue:h,coral:p,shadows:r,dataviz:{colors:n,extra:a,colorsWithExtra:d,onlyMainFromAll:t},doughnutCard:s,strokes:g,status:u,scoreCard:m,scoreOverviewCard:b,ingredientCard:w,scoreValue:y,numberWithUnit:k,formField:v,barChart:z,mediaUpload:S,tags:f,countTabs:$,tabs:B,scoreDetail:C,toggleSwitch:W,deleteButton:D,breadcrumb:I,tooltip:V,searchBox:{borderRadius:"24px",border:e=>"1px solid "+e.custom.grey[500],background:"white",boxShadow:e=>"0px 2px 8px 0px "+e.custom.grey[500]},rowMenuElement:{marginLeft:"12px",paddingRight:"8px",fontSize:"12px",fontWeight:"600",lineHeight:"20px"}},M={valueFormatterFn:(i,r=void 0)=>{const o=Number(i);return Number.isNaN(o)?"":r?o.toLocaleString(e.language,{maximumFractionDigits:r}):o.toLocaleString(e.language)}};export{z as barChart,I as breadcrumb,$ as countTabs,H as custom,D as deleteButton,s as doughnutCard,v as formField,w as ingredientCard,S as mediaUpload,k as numberWithUnit,M as numbers,m as scoreCard,C as scoreDetail,b as scoreOverviewCard,y as scoreValue,u as status,g as strokes,B as tabs,f as tags,W as toggleSwitch,V as tooltip};
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@foodpilot/foods",
3
3
  "private": false,
4
- "version": "2.18.4",
4
+ "version": "2.19.1",
5
5
  "type": "module",
6
6
  "main": "./dist/main.js",
7
7
  "module": "./dist/main.js",
@@ -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 d=d=>{const{active:s,hoveredIndex:p,data:m,coordinate:h,formatter:x,unit:u,icons:g}=d,v=i();if(!s||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:"flex-end",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{d as PolymorphicChartTooltip};