@foodpilot/foods 2.18.0 → 2.18.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.
@@ -18,7 +18,7 @@ export type ScoreOverviewCardVariationAction = {
18
18
  type ScoreOverviewCardBaseProps = {
19
19
  disabled?: boolean;
20
20
  icon: keyof IconMapping;
21
- level: ScoreOverviewCardLevel;
21
+ level?: ScoreOverviewCardLevel;
22
22
  onSelect: NonNullable<ButtonBaseProps["onClick"]>;
23
23
  selected: boolean;
24
24
  selectionLabel: string;
@@ -4,8 +4,7 @@ return e(r,{sx:{backgroundColor:p.selected?u.palette.primary[800]:u.custom.grey[
4
4
  /* @__PURE__ */e(r,{sx:{boxSizing:"border-box",gap:u.spacing(3),height:"100%",padding:u.spacing(3),pointerEvents:"none",position:"relative",width:"100%",zIndex:"auto"},children:[
5
5
  /* @__PURE__ */e(r,{sx:{gap:u.spacing(1),minWidth:0},children:[
6
6
  /* @__PURE__ */e(r,{direction:"row",alignItems:"flex-start",justifyContent:"space-between",children:[
7
- /* @__PURE__ */i(n,{"aria-hidden":!0,sx:{alignItems:"center",backgroundColor:u.palette.primary[50],borderRadius:u.spacing(1.5),color:u.palette.primary[600],display:"flex",height:u.custom.scoreOverviewCard.icon.containerSize,justifyContent:"center",padding:u.spacing(.5),width:u.custom.scoreOverviewCard.icon.containerSize},children:/* @__PURE__ */i(c,{icon:p.icon,size:u.custom.scoreOverviewCard.icon.glyphSize})}),
8
- /* @__PURE__ */i(d,{size:"display",label:p.level.label,endIcon:"information",colors:p.level.colors,sx:{"& .MuiButton-endIcon":{padding:0},borderWidth:0,paddingInlineEnd:u.spacing(.5),pointerEvents:"auto",position:"relative",zIndex:3}})]}),
7
+ /* @__PURE__ */i(n,{"aria-hidden":!0,sx:{alignItems:"center",backgroundColor:u.palette.primary[50],borderRadius:u.spacing(1.5),color:u.palette.primary[600],display:"flex",height:u.custom.scoreOverviewCard.icon.containerSize,justifyContent:"center",padding:u.spacing(.5),width:u.custom.scoreOverviewCard.icon.containerSize},children:/* @__PURE__ */i(c,{icon:p.icon,size:u.custom.scoreOverviewCard.icon.glyphSize})}),p.level&&/* @__PURE__ */i(d,{size:"display",label:p.level.label,endIcon:"information",colors:p.level.colors,sx:{"& .MuiButton-endIcon":{padding:0},borderWidth:0,paddingInlineEnd:u.spacing(.5),pointerEvents:"auto",position:"relative",zIndex:3}})]}),
9
8
  /* @__PURE__ */e(r,{sx:{minWidth:0},children:[
10
9
  /* @__PURE__ */i(a,{component:"h3",noWrap:!0,title:p.title,variant:"big-semibold",sx:{color:m},children:p.title}),
11
10
  /* @__PURE__ */e(r,{direction:"row",alignItems:"center",sx:{gap:u.spacing(.5),minWidth:0},children:[
@@ -1,6 +1,6 @@
1
- import{jsxs as t,jsx as i}from"react/jsx-runtime";import{useMemo as o,useState as e,useRef as n,useCallback as a,useEffect as r}from"react";import{useTheme as s,Box as l}from"@mui/material";import{ResponsiveContainer as m,ScatterChart as c,CartesianGrid as h,XAxis as d,YAxis as p}from"recharts";import{useScatterPlotInteraction as u}from"./useScatterPlotInteraction.js";import{ScatterPlotHoverOverlay as v}from"./ScatterPlotHoverOverlay.js";import{ScatterPlotTooltip as x}from"./ScatterPlotTooltip.js";import{ScatterPlotPoints as f}from"./ScatterPlotPoints.js";import{processScatterPlotData as g,createGroupedData as y,ANIMATION_DURATION as w,CHART_MARGIN_BOTTOM as M,CHART_MARGIN_LEFT as D,CHART_MARGIN_RIGHT as P,CHART_MARGIN_TOP as k}from"./utils.js";import F from"i18next";const L=L=>{const T=s(),{values:E,xMin:S,xMax:b,yMin:z,yMax:I,valueFormatterFn:j=T.numbers.valueFormatterFn,precision:O,language:W,unit:C,xUnit:R,yUnit:U,textOptions:A,showSeriesInTooltip:H=!0,tooltipOptions:K}=L,{hoveredIndex:$,hover:B,pinnedIndex:X,pinnedHover:Y,isPinned:q,handlePointEnter:G,handlePointClick:J,handlePointLeave:N,handleTooltipEnter:Q,handleTooltipLeave:V,handleDismissTooltip:Z}=u(),{allPoints:_,shouldShowLabels:tt}=o(()=>g(E,T.custom.dataviz.colorsWithExtra),[E,T.custom.dataviz.colorsWithExtra]),it=o(()=>y(E,T.custom.dataviz.colorsWithExtra,_),[E,T.custom.dataviz.colorsWithExtra,_]),{xDomain:ot,yDomain:et}=o(()=>{const t=E.flatMap(t=>t.data);if(0===t.length)return{xDomain:void 0!==S&&void 0!==b?[S,b]:[0,100],yDomain:void 0!==z&&void 0!==I?[z,I]:[0,100]};const i=t.map(t=>t.x),o=t.map(t=>t.y),e=Math.min(...i),n=Math.max(...i),a=Math.min(...o),r=Math.max(...o);return{xDomain:void 0!==S&&void 0!==b?[S,b]:[Math.max(0,e),n],yDomain:void 0!==z&&void 0!==I?[z,I]:[Math.max(0,a),r]}},[E,S,b,z,I]),[nt,at]=e(!0),rt=n(null),st=n(null),[lt,mt]=e({height:0,width:0}),ct=W??F.language,ht="number"==typeof O?Math.min(100,Math.max(0,O)):void 0,dt=a(t=>j(t,ht),[j,ht]);return r(()=>{const t=setTimeout(()=>{at(!1)},w);return()=>clearTimeout(t)},[]),r(()=>{const t=rt.current;if(!t)return;const i=(t,i)=>{mt(o=>o.width===t&&o.height===i?o:{width:t,height:i})},o=t.getBoundingClientRect();i(o.width,o.height);const e=new ResizeObserver(([t])=>{t&&i(t.contentRect.width,t.contentRect.height)});return e.observe(t),()=>e.disconnect()},[]),/* @__PURE__ */t(l,{onClick:t=>{const i=t.target;if(i.classList.contains("recharts-dot"))return;const o=st.current;o&&o.contains(i)||Z()},onMouseLeave:()=>Z(),ref:rt,sx:{position:"relative",width:"100%",height:"100%"},children:[lt.width>0&&lt.height>0&&/* @__PURE__ */i(m,{width:"100%",height:"100%",initialDimension:lt,children:/* @__PURE__ */t(c,{margin:{top:k,right:P,left:D,bottom:M},children:[
2
- /* @__PURE__ */i(h,{strokeDasharray:"4 4",stroke:T.palette.divider}),
3
- /* @__PURE__ */i(d,{type:"number",dataKey:"x",domain:ot,tickLine:!1,axisLine:{stroke:T.palette.divider},tick:{fontFamily:"Montserrat",fontSize:14,style:{transform:`translateY(${T.spacing(2)})`}},tickFormatter:dt,allowDecimals:!0}),
4
- /* @__PURE__ */i(p,{type:"number",dataKey:"y",domain:et,tickLine:!1,axisLine:{stroke:T.palette.divider},tick:{fontFamily:"Montserrat",fontSize:14,style:{transform:`translateX(-${T.spacing(2)})`,pointerEvents:"none"}},tickFormatter:dt,allowDecimals:!0,style:{pointerEvents:"none"}}),
5
- /* @__PURE__ */i(v,{hover:B,valueFormatterFn:j,precision:ht,language:ct,xDomain:ot,yDomain:et}),
6
- /* @__PURE__ */i(f,{groupedData:it,allPoints:_,hoveredIndex:$,pinnedIndex:X,isTooltipActive:!!(q&&null!==X&&Y&&_[X]),isAnimationActive:nt,shouldShowLabels:tt,containerWidth:lt.width,onPointEnter:G,onPointLeave:N,onPointClick:(t,i,o,e)=>{e.stopPropagation(),J(t,i,o)}})]})}),!!(q&&null!==X&&Y&&_[X])&&/* @__PURE__ */i(x,{ref:st,point:_[X],coordinate:Y,series:E,valueFormatterFn:j,precision:O,unit:C,xUnit:R,yUnit:U,textOptions:A,showSeriesInTooltip:H,handleDismissTooltip:Z,tooltipOptions:K,onTooltipEnter:Q,onTooltipLeave:V})]})};export{L as ScatterPlotCore};
1
+ import{jsxs as t,jsx as i}from"react/jsx-runtime";import{useMemo as e,useState as o,useRef as n,useCallback as a,useEffect as r}from"react";import{useTheme as s,Box as l}from"@mui/material";import{ResponsiveContainer as m,ScatterChart as h,CartesianGrid as c,XAxis as d,YAxis as p}from"recharts";import{useScatterPlotInteraction as u}from"./useScatterPlotInteraction.js";import{ScatterPlotHoverOverlay as v}from"./ScatterPlotHoverOverlay.js";import{ScatterPlotTooltip as x}from"./ScatterPlotTooltip.js";import{ScatterPlotPoints as f}from"./ScatterPlotPoints.js";import{processScatterPlotData as g,createGroupedData as y,ANIMATION_DURATION as M,CHART_MARGIN_BOTTOM as w,CHART_MARGIN_LEFT as D,CHART_MARGIN_RIGHT as P,CHART_MARGIN_TOP as k}from"./utils.js";import L from"i18next";const F=F=>{const T=s(),{values:E,xMin:S,xMax:b,yMin:z,yMax:I,valueFormatterFn:j=T.numbers.valueFormatterFn,precision:O,language:C,unit:W,xUnit:R,yUnit:U,textOptions:A,showSeriesInTooltip:H=!0,tooltipOptions:K}=F,{hoveredIndex:$,hover:B,pinnedIndex:X,pinnedHover:Y,isPinned:q,handlePointEnter:G,handlePointClick:J,handlePointLeave:N,handleTooltipEnter:Q,handleTooltipLeave:V,handleChartMouseLeave:Z,handleDismissTooltip:_}=u(),{allPoints:tt,shouldShowLabels:it}=e(()=>g(E,T.custom.dataviz.colorsWithExtra),[E,T.custom.dataviz.colorsWithExtra]),et=e(()=>y(E,T.custom.dataviz.colorsWithExtra,tt),[E,T.custom.dataviz.colorsWithExtra,tt]),{xDomain:ot,yDomain:nt}=e(()=>{const t=E.flatMap(t=>t.data);if(0===t.length)return{xDomain:void 0!==S&&void 0!==b?[S,b]:[0,100],yDomain:void 0!==z&&void 0!==I?[z,I]:[0,100]};const i=t.map(t=>t.x),e=t.map(t=>t.y),o=Math.min(...i),n=Math.max(...i),a=Math.min(...e),r=Math.max(...e);return{xDomain:void 0!==S&&void 0!==b?[S,b]:[Math.max(0,o),n],yDomain:void 0!==z&&void 0!==I?[z,I]:[Math.max(0,a),r]}},[E,S,b,z,I]),[at,rt]=o(!0),st=n(null),lt=n(null),[mt,ht]=o({height:0,width:0}),ct=C??L.language,dt="number"==typeof O?Math.min(100,Math.max(0,O)):void 0,pt=a(t=>j(t,dt),[j,dt]);return r(()=>{const t=setTimeout(()=>{rt(!1)},M);return()=>clearTimeout(t)},[]),r(()=>{const t=st.current;if(!t)return;const i=(t,i)=>{ht(e=>e.width===t&&e.height===i?e:{width:t,height:i})},e=t.getBoundingClientRect();i(e.width,e.height);const o=new ResizeObserver(([t])=>{t&&i(t.contentRect.width,t.contentRect.height)});return o.observe(t),()=>o.disconnect()},[]),/* @__PURE__ */t(l,{onClick:t=>{const i=t.target;if(i.classList.contains("recharts-dot"))return;const e=lt.current;e&&e.contains(i)||_()},onMouseLeave:Z,ref:st,sx:{position:"relative",width:"100%",height:"100%"},children:[mt.width>0&&mt.height>0&&/* @__PURE__ */i(m,{width:"100%",height:"100%",initialDimension:mt,children:/* @__PURE__ */t(h,{margin:{top:k,right:P,left:D,bottom:w},children:[
2
+ /* @__PURE__ */i(c,{strokeDasharray:"4 4",stroke:T.palette.divider}),
3
+ /* @__PURE__ */i(d,{type:"number",dataKey:"x",domain:ot,tickLine:!1,axisLine:{stroke:T.palette.divider},tick:{fontFamily:"Montserrat",fontSize:14,style:{transform:`translateY(${T.spacing(2)})`}},tickFormatter:pt,allowDecimals:!0}),
4
+ /* @__PURE__ */i(p,{type:"number",dataKey:"y",domain:nt,tickLine:!1,axisLine:{stroke:T.palette.divider},tick:{fontFamily:"Montserrat",fontSize:14,style:{transform:`translateX(-${T.spacing(2)})`,pointerEvents:"none"}},tickFormatter:pt,allowDecimals:!0,style:{pointerEvents:"none"}}),
5
+ /* @__PURE__ */i(v,{hover:B,valueFormatterFn:j,precision:dt,language:ct,xDomain:ot,yDomain:nt}),
6
+ /* @__PURE__ */i(f,{groupedData:et,allPoints:tt,hoveredIndex:$,pinnedIndex:X,isTooltipActive:!!(q&&null!==X&&Y&&tt[X]),isAnimationActive:at,shouldShowLabels:it,containerWidth:mt.width,onPointEnter:G,onPointLeave:N,onPointClick:(t,i,e,o)=>{o.stopPropagation(),J(t,i,e)}})]})}),!!(q&&null!==X&&Y&&tt[X])&&/* @__PURE__ */i(x,{ref:lt,point:tt[X],coordinate:Y,series:E,valueFormatterFn:j,precision:O,unit:W,xUnit:R,yUnit:U,textOptions:A,showSeriesInTooltip:H,handleDismissTooltip:_,tooltipOptions:K,onTooltipEnter:Q,onTooltipLeave:V})]})};export{F as ScatterPlotCore};
@@ -1,4 +1,4 @@
1
- import{jsx as t,Fragment as e}from"react/jsx-runtime";import{Scatter as n,LabelList as o,Dot as i}from"recharts";import{useTheme as r}from"@mui/material";import{ANIMATION_DURATION as l,DISABLE_ANIMATIONS_THRESHOLD_POINTS as a,POINT_RADIUS as s,calculateLabelPosition as c,LABEL_FONT_SIZE as p}from"./utils.js";const f=f=>{const{groupedData:d,allPoints:m,hoveredIndex:u,pinnedIndex:y,isTooltipActive:x,isAnimationActive:h,shouldShowLabels:b,containerWidth:v,onPointEnter:g,onPointLeave:A,onPointClick:I}=f,P=r(),k=e=>{const{x:n,y:o,cx:i,cy:r,value:l,payload:a}=e,s=a?.label,f=s||("number"==typeof l?String(l):(l??"").toString());if(!f)return null;const d="number"==typeof i?i:"number"==typeof n?n:void 0,m="number"==typeof r?r:"number"==typeof o?o:void 0;if(void 0===d||void 0===m)return null;const{x:u,y:y,anchor:x}=c(d,m,f,v);/* @__PURE__ */
2
- return t("g",{style:{pointerEvents:"none"},children:/* @__PURE__ */t("text",{x:u,y:y+1,fill:P.palette.text.primary,fontSize:p,fontWeight:600,textAnchor:x,dominantBaseline:"middle",children:f})})};/* @__PURE__ */
3
- return t(e,{children:d.map(e=>/* @__PURE__ */t(n,{isAnimationActive:!1,fill:e.color,data:e.points.map(t=>{const n=null!==u&&t.pointIndex!==u;return{...t,label:t.label,fill:e.color,opacity:n?.4:1,r:s}}),shape:e=>{const{cx:n,cy:o,r:r,fill:s}=e,c=e.pointIndex,p=null!==u&&c!==u,f={cursor:"pointer",...void 0!==c&&c===y&&x?{filter:"drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.5))",stroke:"#fff",strokeWidth:2}:{filter:"none"}};/* @__PURE__ */
4
- return t(i,{cx:n,cy:o,r:r,fill:s,"data-scatter-point":"true",style:a<=m.length?f:{...f,transform:`scale(${h?0:1})`,transformOrigin:"50% 50%",opacity:p?.4:1,transition:`all ${l}ms cubic-bezier(0.86, 0, 0.07, 1)`},onMouseEnter:()=>{if("number"==typeof c){const t=m[c];t&&g(t,c,{x:n,y:o})}},onMouseLeave:()=>{A()},onClick:()=>{if("number"==typeof c){const t=m[c];if(t){const e={stopPropagation:()=>{}};I?.(t,c,{x:n,y:o},e)}}}})},children:b&&/* @__PURE__ */t(o,{dataKey:"label",content:k})},e.seriesId))})};export{f as ScatterPlotPoints};
1
+ import{jsx as t,Fragment as e}from"react/jsx-runtime";import{Scatter as n,LabelList as o,DefaultZIndexes as i,Dot as r}from"recharts";import{useTheme as l}from"@mui/material";import{ANIMATION_DURATION as a,DISABLE_ANIMATIONS_THRESHOLD_POINTS as c,POINT_RADIUS as s,calculateLabelPosition as p,LABEL_FONT_SIZE as d}from"./utils.js";const f=f=>{const{groupedData:m,allPoints:u,hoveredIndex:y,pinnedIndex:x,isTooltipActive:h,isAnimationActive:b,shouldShowLabels:v,containerWidth:g,onPointEnter:I,onPointLeave:A,onPointClick:k}=f,P=l(),S=e=>{const{x:n,y:o,cx:i,cy:r,value:l,payload:a}=e,c=a?.label,s=c||("number"==typeof l?String(l):(l??"").toString());if(!s)return null;const f="number"==typeof i?i:"number"==typeof n?n:void 0,m="number"==typeof r?r:"number"==typeof o?o:void 0;if(void 0===f||void 0===m)return null;const{x:u,y:y,anchor:x}=p(f,m,s,g);/* @__PURE__ */
2
+ return t("g",{style:{pointerEvents:"none"},children:/* @__PURE__ */t("text",{x:u,y:y+1,fill:P.palette.text.primary,fontSize:d,fontWeight:600,textAnchor:x,dominantBaseline:"middle",children:s})})};/* @__PURE__ */
3
+ return t(e,{children:m.map(e=>/* @__PURE__ */t(n,{isAnimationActive:!1,fill:e.color,data:e.points.map(t=>{const n=null!==y&&t.pointIndex!==y;return{...t,label:t.label,fill:e.color,opacity:n?.4:1,r:s}}),shape:e=>{const{cx:n,cy:o,r:i,fill:l}=e,{pointIndex:s,payload:p}=e,d=p?.pointIndex??s,f=null!==y&&d!==y,m={cursor:"pointer",...void 0!==d&&d===x&&h?{filter:"drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.5))",stroke:"#fff",strokeWidth:2}:{filter:"none"}};/* @__PURE__ */
4
+ return t(r,{cx:n,cy:o,r:i,fill:l,"data-scatter-point":"true",style:c<=u.length?m:{...m,transform:`scale(${b?0:1})`,transformOrigin:"50% 50%",opacity:f?.4:1,transition:`all ${a}ms cubic-bezier(0.86, 0, 0.07, 1)`},onMouseEnter:()=>{if("number"==typeof d){const t=u[d];t&&I(t,d,{x:n,y:o})}},onMouseLeave:()=>{A()},onClick:(t,e)=>{if("number"==typeof d){const t=u[d];t&&k(t,d,{x:n,y:o},e)}}})},children:v&&/* @__PURE__ */t(o,{dataKey:"label",content:S,zIndex:i.line})},e.seriesId))})};export{f as ScatterPlotPoints};
@@ -1 +1 @@
1
- import{useState as l,useRef as e,useEffect as n,useCallback as t}from"react";const u=()=>{const[u,r]=l(null),[a,o]=l(null),[i,x]=l(null),[d,c]=l(null),[y,p]=l(!1),h=e(null),s=e(!1);n(()=>{s.current=y},[y]);const v=t(()=>{h.current&&(clearTimeout(h.current),h.current=null)},[]),m=t((l,e,n)=>{v(),p(!1),r(e),o({xValue:n?.x??l.x,yValue:n?.y??l.y,dataX:l.x,dataY:l.y,pixelX:n?.x??l.x,pixelY:n?.y??l.y})},[v]),T=t((l,e,n)=>{v(),x(e),c({xValue:n?.x??l.x,yValue:n?.y??l.y,dataX:l.x,dataY:l.y,pixelX:n?.x??l.x,pixelY:n?.y??l.y}),p(!0)},[v]),P=t(()=>{v(),s.current||(r(null),o(null))},[v]),V=t(()=>{v()},[v]),X=t(()=>{v(),s.current||(h.current=setTimeout(()=>{r(null),o(null)},1e3))},[v]),Y=t(()=>{s.current||(v(),r(null),o(null))},[v]),L=t(()=>{v(),x(null),c(null),o(null),p(!1)},[v]);return{hoveredIndex:u,hover:a,pinnedIndex:i,pinnedHover:d,isPinned:y,handlePointEnter:m,handlePointClick:T,handlePointLeave:P,handleTooltipEnter:V,handleTooltipLeave:X,handleChartMouseLeave:Y,handleDismissTooltip:L}};export{u as useScatterPlotInteraction};
1
+ import{useState as l,useRef as e,useEffect as n,useCallback as a}from"react";const t=()=>{const[t,u]=l(null),[r,x]=l(null),[i,o]=l(null),[d,c]=l(null),[p,y]=l(!1),h=e(null),s=e(!1);n(()=>{s.current=p},[p]);const V=a(()=>{h.current&&(clearTimeout(h.current),h.current=null)},[]),X=a((l,e,n)=>{V(),y(!1),u(e);const a={xValue:n?.x??l.x,yValue:n?.y??l.y,dataX:l.x,dataY:l.y,pixelX:n?.x??l.x,pixelY:n?.y??l.y};x(l=>l&&l.xValue===a.xValue&&l.yValue===a.yValue&&l.dataX===a.dataX&&l.dataY===a.dataY&&l.pixelX===a.pixelX&&l.pixelY===a.pixelY?l:a)},[V]),Y=a((l,e,n)=>{V(),o(e),c({xValue:n?.x??l.x,yValue:n?.y??l.y,dataX:l.x,dataY:l.y,pixelX:n?.x??l.x,pixelY:n?.y??l.y}),y(!0)},[V]),v=a(()=>{V(),s.current||(u(null),x(null))},[V]),m=a(()=>{V()},[V]),T=a(()=>{V(),s.current||(h.current=setTimeout(()=>{u(null),x(null)},1e3))},[V]),P=a(()=>{s.current||(V(),u(null),x(null))},[V]),L=a(()=>{V(),o(null),c(null),x(null),y(!1)},[V]);return{hoveredIndex:t,hover:r,pinnedIndex:i,pinnedHover:d,isPinned:p,handlePointEnter:X,handlePointClick:Y,handlePointLeave:v,handleTooltipEnter:m,handleTooltipLeave:T,handleChartMouseLeave:P,handleDismissTooltip:L}};export{t as useScatterPlotInteraction};
@@ -7,4 +7,4 @@ import { ScoreDistributionProps } from './ScoreDistribution.types';
7
7
  * open `13154:68496`. Consumers own data adaptation, localization, loading,
8
8
  * and navigation; Foods owns the complete visual and interaction contract.
9
9
  */
10
- export declare const ScoreDistribution: ({ displayByLabel, emptyLabel, getCollapseLabel, getExpandLabel, items, modes, onModeChange, selectedMode, summary, }: ScoreDistributionProps) => import("react/jsx-runtime").JSX.Element;
10
+ export declare const ScoreDistribution: ({ displayByLabel, emptyLabel, getCollapseLabel, getExpandLabel, items, modes, onModeChange, selectedMode, showSummary, summary, }: ScoreDistributionProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,9 +1,8 @@
1
- import{jsxs as e,jsx as i}from"react/jsx-runtime";import{useTheme as r,Stack as o,Typography as a,Button as t,Box as s}from"@mui/material";import{ScoreDistributionRow as n}from"./ScoreDistributionRow.js";import{ScoreDistributionSummary as d}from"./ScoreDistributionSummary.js";import{getScoreDistributionScale as l}from"./scoreDistributionScale.js";const c=({displayByLabel:c,emptyLabel:m,getCollapseLabel:p,getExpandLabel:g,items:b,modes:u,onModeChange:h,selectedMode:x,summary:y})=>{const f=r(),w=l(b);/* @__PURE__ */
2
- return e(o,{"data-testid":"score-distribution",gap:f.spacing(3),children:[
3
- /* @__PURE__ */e(o,{direction:"row",alignItems:"center",flexWrap:"wrap",gap:f.spacing(2),children:[
1
+ import{jsxs as e,jsx as i}from"react/jsx-runtime";import{useTheme as r,Stack as o,Typography as a,Button as t,Box as s}from"@mui/material";import{ScoreDistributionRow as n}from"./ScoreDistributionRow.js";import{ScoreDistributionSummary as d}from"./ScoreDistributionSummary.js";import{getScoreDistributionScale as l}from"./scoreDistributionScale.js";const c=({displayByLabel:c,emptyLabel:m,getCollapseLabel:p,getExpandLabel:g,items:b,modes:u,onModeChange:h,selectedMode:x,showSummary:y=!0,summary:f})=>{const w=r(),v=l(b);/* @__PURE__ */
2
+ return e(o,{"data-testid":"score-distribution",gap:w.spacing(3),children:[
3
+ /* @__PURE__ */e(o,{direction:"row",alignItems:"center",flexWrap:"wrap",gap:w.spacing(2),children:[
4
4
  /* @__PURE__ */i(a,{variant:"body-semibold",children:c}),
5
- /* @__PURE__ */i(o,{direction:"row",flexWrap:"wrap",gap:f.spacing(2),children:u.map(e=>/* @__PURE__ */i(t,{variant:x===e.id?"black-filled":"white-filled","aria-pressed":x===e.id,onClick:()=>h(e.id),children:e.label},e.id))})]}),
6
- /* @__PURE__ */e(s,{sx:{alignItems:"flex-start",display:"flex",flexWrap:"wrap",gap:f.spacing(3)},children:[
7
- /* @__PURE__ */i(d,{summary:y}),
8
- /* @__PURE__ */e(o,{"data-testid":"score-distribution-breakdown",gap:f.spacing(2),sx:{backgroundColor:f.custom.grey[100],borderRadius:f.spacing(1.5),boxShadow:f.custom.shadows.grey,isolation:"isolate",flex:`1 1 ${f.custom.scoreDetail.summaryWidth}`,minWidth:0,padding:f.spacing(2),position:"relative"},children:[b.length>0?b.map((e,r)=>/* @__PURE__ */i(n,{getCollapseLabel:p,getExpandLabel:g,item:e,isLast:r===b.length-1,mode:x,scale:w},`${x}:${e.id}`)):/* @__PURE__ */i(a,{variant:"body-regular",color:f.custom.grey[2500],children:m}),
9
- /* @__PURE__ */i(s,{"aria-hidden":!0,sx:{borderColor:f.custom.strokes.containerDivider.color,borderRadius:f.spacing(1.5),borderStyle:f.custom.strokes.containerDivider.style,borderWidth:f.custom.strokes.containerDivider.width,boxSizing:"border-box",inset:0,pointerEvents:"none",position:"absolute"}})]})]})]})};export{c as ScoreDistribution};
5
+ /* @__PURE__ */i(o,{direction:"row",flexWrap:"wrap",gap:w.spacing(2),children:u.map(e=>/* @__PURE__ */i(t,{variant:x===e.id?"black-filled":"white-filled","aria-pressed":x===e.id,onClick:()=>h(e.id),children:e.label},e.id))})]}),
6
+ /* @__PURE__ */e(s,{sx:{alignItems:"flex-start",display:"flex",flexWrap:"wrap",gap:w.spacing(3)},children:[y&&/* @__PURE__ */i(d,{summary:f}),
7
+ /* @__PURE__ */e(o,{"data-testid":"score-distribution-breakdown",gap:w.spacing(2),sx:{backgroundColor:w.custom.grey[100],borderRadius:w.spacing(1.5),boxShadow:w.custom.shadows.grey,isolation:"isolate",flex:`1 1 ${w.custom.scoreDetail.summaryWidth}`,minWidth:0,padding:w.spacing(2),position:"relative"},children:[b.length>0?b.map((e,r)=>/* @__PURE__ */i(n,{getCollapseLabel:p,getExpandLabel:g,item:e,isLast:r===b.length-1,mode:x,scale:v},`${x}:${e.id}`)):/* @__PURE__ */i(a,{variant:"body-regular",color:w.custom.grey[2500],children:m}),
8
+ /* @__PURE__ */i(s,{"aria-hidden":!0,sx:{borderColor:w.custom.strokes.containerDivider.color,borderRadius:w.spacing(1.5),borderStyle:w.custom.strokes.containerDivider.style,borderWidth:w.custom.strokes.containerDivider.width,boxSizing:"border-box",inset:0,pointerEvents:"none",position:"absolute"}})]})]})]})};export{c as ScoreDistribution};
@@ -1,7 +1,12 @@
1
1
  import { IconMapping } from '../../Icons';
2
2
  import { NumberWithUnitValue } from '../../Number/NumberWithUnit';
3
+ import { ReactNode } from 'react';
3
4
  export type ScoreDistributionMode = "lifecycle" | "subscores" | "impacts";
4
5
  export type ScoreDistributionIconTone = "dataviz-1" | "dataviz-2" | "dataviz-3" | "dataviz-4" | "dataviz-5" | "dataviz-6" | "dataviz-7" | "dataviz-9" | "dataviz-13" | "green";
6
+ export type ScoreDistributionInformation = {
7
+ label: string;
8
+ tooltip: ReactNode;
9
+ };
5
10
  export type ScoreDistributionItem = {
6
11
  children: readonly ScoreDistributionItem[];
7
12
  formattedValue: string;
@@ -11,7 +16,7 @@ export type ScoreDistributionItem = {
11
16
  value: number | null;
12
17
  icon?: keyof IconMapping;
13
18
  iconTone?: ScoreDistributionIconTone;
14
- showInformation?: boolean;
19
+ information?: ScoreDistributionInformation;
15
20
  };
16
21
  export type ScoreDistributionModeOption = {
17
22
  id: ScoreDistributionMode;
@@ -32,5 +37,6 @@ export type ScoreDistributionProps = {
32
37
  modes: readonly ScoreDistributionModeOption[];
33
38
  onModeChange: (mode: ScoreDistributionMode) => void;
34
39
  selectedMode: ScoreDistributionMode;
40
+ showSummary?: boolean;
35
41
  summary: ScoreDistributionSummary;
36
42
  };
@@ -1,11 +1,11 @@
1
- import{jsxs as i,jsx as e}from"react/jsx-runtime";import{useTheme as t,Stack as a,Box as r,Typography as o}from"@mui/material";import{useState as n}from"react";import{FoodsIcon as s}from"../../Icons/FoodsIcon.js";import{getScoreDistributionScale as c}from"./scoreDistributionScale.js";import{FoodsIconButton as d}from"../../Button/FoodsIconButton.js";const l=(i,e)=>({lifecycle:e.custom.scoreDetail.lifecycleBreakdownWidth,subscores:e.custom.scoreDetail.subscoreBreakdownWidth,impacts:e.custom.scoreDetail.impactBreakdownWidth}[i]),m=({depth:h=0,getCollapseLabel:u,getExpandLabel:g,item:p,isLast:x,mode:b,scale:v})=>{const f=t(),[z,w]=n(!1),W=p.value??0,k=W<0,y=`${p.label} ${p.formattedValue}${"%"===p.unit?"":" "}${p.unit}`,I=p.children.length>0,S=v.range>0?Math.min(100,Math.abs(W)/v.range*100):0,B=k||0===W&&v.range>0&&!v.hasPositiveValue,C=((i,e)=>{switch(i){case"dataviz-1":return e.custom.dataviz.colors[1];case"dataviz-2":return e.custom.dataviz.colors[2];case"dataviz-3":return e.custom.dataviz.colors[3];case"dataviz-4":return e.custom.dataviz.colors[4];case"dataviz-5":return e.custom.dataviz.colors[5];case"dataviz-6":return e.custom.dataviz.colors[6];case"dataviz-7":return e.custom.dataviz.colors[7];case"dataviz-9":return e.custom.dataviz.extra[9];case"dataviz-13":return e.custom.dataviz.extra[13];case"green":return{main:e.custom.green[600],variant:{100:e.custom.status.green.surface}};default:return null}})(p.iconTone,f);/* @__PURE__ */
2
- return i(a,{gap:z?f.spacing(0===h?2:1):0,sx:{paddingBottom:0!==h||x?0:f.spacing(2),position:"relative"},children:[
1
+ import{jsxs as i,jsx as t}from"react/jsx-runtime";import{useTheme as e,Stack as a,Box as o,Typography as r}from"@mui/material";import{useState as n}from"react";import{FoodsIcon as s}from"../../Icons/FoodsIcon.js";import{getScoreDistributionScale as c}from"./scoreDistributionScale.js";import{FoodsIconButton as d}from"../../Button/FoodsIconButton.js";const l=(i,t)=>({lifecycle:t.custom.scoreDetail.lifecycleBreakdownWidth,subscores:t.custom.scoreDetail.subscoreBreakdownWidth,impacts:t.custom.scoreDetail.impactBreakdownWidth}[i]),m=({depth:u=0,getCollapseLabel:h,getExpandLabel:p,item:g,isLast:b,mode:x,scale:v})=>{const f=e(),[z,w]=n(!1),W=g.value??0,k=W<0,y=`${g.label} ${g.formattedValue}${"%"===g.unit?"":" "}${g.unit}`,I=g.children.length>0,B=v.range>0?Math.min(100,Math.abs(W)/v.range*100):0,S=k||0===W&&v.range>0&&!v.hasPositiveValue,C=((i,t)=>{switch(i){case"dataviz-1":return t.custom.dataviz.colors[1];case"dataviz-2":return t.custom.dataviz.colors[2];case"dataviz-3":return t.custom.dataviz.colors[3];case"dataviz-4":return t.custom.dataviz.colors[4];case"dataviz-5":return t.custom.dataviz.colors[5];case"dataviz-6":return t.custom.dataviz.colors[6];case"dataviz-7":return t.custom.dataviz.colors[7];case"dataviz-9":return t.custom.dataviz.extra[9];case"dataviz-13":return t.custom.dataviz.extra[13];case"green":return{main:t.custom.green[600],variant:{100:t.custom.status.green.surface}};default:return null}})(g.iconTone,f);/* @__PURE__ */
2
+ return i(a,{gap:z?f.spacing(0===u?2:1):0,sx:{paddingBottom:0!==u||b?0:f.spacing(2),position:"relative"},children:[
3
3
  /* @__PURE__ */i(a,{direction:{xs:"column",md:"row"},alignItems:{xs:"stretch",md:"center"},flexWrap:"wrap",gap:f.spacing(2),children:[
4
- /* @__PURE__ */i(a,{direction:"row",alignItems:"center",gap:f.spacing(1.5),minWidth:0,sx:{boxSizing:"border-box",flexBasis:{xs:"auto",md:f.custom.scoreDetail.summaryWidth},flexGrow:{xs:0,md:1},paddingInlineStart:h>0?f.spacing(4):0,width:{xs:"100%",md:"auto"}},children:[I?/* @__PURE__ */e(d,{size:"xs",icon:z?"arrowDownShort":"arrowRightShort",buttonProps:{"aria-expanded":z,"aria-label":z?u(p):g(p),onClick:()=>w(i=>!i)}}):"lifecycle"===b&&p.icon?/* @__PURE__ */e(r,{"aria-hidden":!0,sx:{flexShrink:0,height:f.spacing(3),width:f.spacing(3)}}):null,p.icon&&/* @__PURE__ */e(r,{sx:{alignItems:"center",backgroundColor:C?.variant[100],borderRadius:f.spacing(.5),color:C?.main,display:"flex",flexShrink:0,height:f.spacing(3),justifyContent:"center",width:f.spacing(3)},children:/* @__PURE__ */e(s,{icon:p.icon,size:1})}),
5
- /* @__PURE__ */e(o,{variant:"body-semibold",noWrap:0===h||"lifecycle"!==b,children:p.label})]}),
6
- /* @__PURE__ */i(a,{direction:"row",alignItems:"center",gap:p.showInformation?f.spacing(2):0,flexShrink:0,minWidth:0,sx:{maxWidth:"100%"},children:[
7
- /* @__PURE__ */i(a,{direction:"row",alignItems:"center",gap:f.spacing(2),flexShrink:1,minWidth:0,sx:{maxWidth:"100%",width:l(b,f)},children:[
8
- /* @__PURE__ */e(r,{role:"progressbar","aria-label":y,"aria-valuemax":100,"aria-valuemin":0,"aria-valuenow":S,sx:{backgroundColor:"inherit",borderRadius:0,flexShrink:1,height:f.spacing(2),maxWidth:"100%",position:"relative",width:f.custom.scoreDetail.barWidth},children:/* @__PURE__ */e(r,{"aria-hidden":!0,sx:{backgroundColor:k?f.custom.green[600]:f.palette.primary[600],borderBottomLeftRadius:k?f.spacing(.5):0,borderBottomRightRadius:k?0:f.spacing(.5),borderTopLeftRadius:k?f.spacing(.5):0,borderTopRightRadius:k?0:f.spacing(.5),height:"100%",insetInlineEnd:B?100-v.zeroPosition+"%":void 0,insetInlineStart:B?void 0:`${v.zeroPosition}%`,maxWidth:"100%",minWidth:f.custom.barChart.zeroValueWidth,position:"absolute",width:0===W?f.custom.barChart.zeroValueWidth:`${S}%`}})}),
4
+ /* @__PURE__ */i(a,{direction:"row",alignItems:"center",gap:f.spacing(1.5),minWidth:0,sx:{boxSizing:"border-box",flexBasis:{xs:"auto",md:f.custom.scoreDetail.summaryWidth},flexGrow:{xs:0,md:1},paddingInlineStart:u>0?f.spacing(4):0,width:{xs:"100%",md:"auto"}},children:[I?/* @__PURE__ */t(d,{size:"xs",icon:z?"arrowDownShort":"arrowRightShort",buttonProps:{"aria-expanded":z,"aria-label":z?h(g):p(g),onClick:()=>w(i=>!i)}}):"lifecycle"===x&&g.icon?/* @__PURE__ */t(o,{"aria-hidden":!0,sx:{flexShrink:0,height:f.spacing(3),width:f.spacing(3)}}):null,g.icon&&/* @__PURE__ */t(o,{sx:{alignItems:"center",backgroundColor:C?.variant[100],borderRadius:f.spacing(.5),color:C?.main,display:"flex",flexShrink:0,height:f.spacing(3),justifyContent:"center",width:f.spacing(3)},children:/* @__PURE__ */t(s,{icon:g.icon,size:1})}),
5
+ /* @__PURE__ */t(r,{variant:"body-semibold",noWrap:0===u||"lifecycle"!==x,children:g.label})]}),
6
+ /* @__PURE__ */i(a,{direction:"row",alignItems:"center",gap:g.information?f.spacing(2):0,flexShrink:0,minWidth:0,sx:{maxWidth:"100%"},children:[
7
+ /* @__PURE__ */i(a,{direction:"row",alignItems:"center",gap:f.spacing(2),flexShrink:1,minWidth:0,sx:{maxWidth:"100%",width:l(x,f)},children:[
8
+ /* @__PURE__ */t(o,{role:"progressbar","aria-label":y,"aria-valuemax":100,"aria-valuemin":0,"aria-valuenow":B,sx:{backgroundColor:"inherit",borderRadius:0,flexShrink:1,height:f.spacing(2),maxWidth:"100%",position:"relative",width:f.custom.scoreDetail.barWidth},children:/* @__PURE__ */t(o,{"aria-hidden":!0,sx:{backgroundColor:k?f.custom.green[600]:f.palette.primary[600],borderBottomLeftRadius:k?f.spacing(.5):0,borderBottomRightRadius:k?0:f.spacing(.5),borderTopLeftRadius:k?f.spacing(.5):0,borderTopRightRadius:k?0:f.spacing(.5),height:"100%",insetInlineEnd:S?100-v.zeroPosition+"%":void 0,insetInlineStart:S?void 0:`${v.zeroPosition}%`,maxWidth:"100%",minWidth:f.custom.barChart.zeroValueWidth,position:"absolute",width:0===W?f.custom.barChart.zeroValueWidth:`${B}%`}})}),
9
9
  /* @__PURE__ */i(a,{direction:"row",alignItems:"baseline",gap:f.spacing(.5),sx:{color:k?f.custom.green[700]:f.custom.grey[2800],minWidth:"max-content"},children:[
10
- /* @__PURE__ */e(o,{variant:"body-semibold",children:p.formattedValue}),
11
- /* @__PURE__ */e(o,{variant:"body-regular",children:p.unit})]})]}),p.showInformation&&/* @__PURE__ */e(r,{"aria-hidden":!0,sx:{alignItems:"center",display:"flex",flexShrink:0,height:f.spacing(3),justifyContent:"center",width:f.spacing(3)},children:/* @__PURE__ */e(s,{icon:"information",size:1})})]})]}),z&&/* @__PURE__ */e(a,{gap:f.spacing(1),children:p.children.map((i,t)=>/* @__PURE__ */e(m,{depth:h+1,getCollapseLabel:u,getExpandLabel:g,item:i,isLast:t===p.children.length-1,mode:b,scale:c(p.children)},i.id))}),0===h&&!x&&/* @__PURE__ */e(r,{"aria-hidden":!0,sx:{borderBottomColor:f.custom.strokes.containerDivider.color,borderBottomStyle:f.custom.strokes.containerDivider.style,borderBottomWidth:f.custom.strokes.containerDivider.width,bottom:0,insetInline:0,pointerEvents:"none",position:"absolute"}})]})};export{m as ScoreDistributionRow};
10
+ /* @__PURE__ */t(r,{variant:"body-semibold",children:g.formattedValue}),
11
+ /* @__PURE__ */t(r,{variant:"body-regular",children:g.unit})]})]}),g.information&&/* @__PURE__ */t(d,{size:"xs",icon:"information",buttonProps:{"aria-label":g.information.label},tooltip:{text:g.information.tooltip,props:{describeChild:!0}}})]})]}),z&&/* @__PURE__ */t(a,{gap:f.spacing(1),children:g.children.map((i,e)=>/* @__PURE__ */t(m,{depth:u+1,getCollapseLabel:h,getExpandLabel:p,item:i,isLast:e===g.children.length-1,mode:x,scale:c(g.children)},i.id))}),0===u&&!b&&/* @__PURE__ */t(o,{"aria-hidden":!0,sx:{borderBottomColor:f.custom.strokes.containerDivider.color,borderBottomStyle:f.custom.strokes.containerDivider.style,borderBottomWidth:f.custom.strokes.containerDivider.width,bottom:0,insetInline:0,pointerEvents:"none",position:"absolute"}})]})};export{m as ScoreDistributionRow};
@@ -1,2 +1,2 @@
1
1
  export { ScoreDistribution } from './ScoreDistribution';
2
- export type { ScoreDistributionIconTone, ScoreDistributionItem, ScoreDistributionMode, ScoreDistributionModeOption, ScoreDistributionProps, ScoreDistributionSummary, } from './ScoreDistribution.types';
2
+ export type { ScoreDistributionIconTone, ScoreDistributionInformation, ScoreDistributionItem, ScoreDistributionMode, ScoreDistributionModeOption, ScoreDistributionProps, ScoreDistributionSummary, } from './ScoreDistribution.types';
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@foodpilot/foods",
3
3
  "private": false,
4
- "version": "2.18.0",
4
+ "version": "2.18.1",
5
5
  "type": "module",
6
6
  "main": "./dist/main.js",
7
7
  "module": "./dist/main.js",