@foodpilot/foods 0.3.43 → 0.3.45

package/dist/components/ComparisonBlock/Blocks/HorizontalLargeBlock.d.ts

@@ -5,8 +5,8 @@ type ComparisonBlockProps = {
     percentageDifference: string;
     comparedTo: {
         value: number;
-        unit: string;
-        label: string;
+        unit?: string;
+        label?: string;
     };
     iconName: keyof IconMapping;
     colors: ColorSet;

package/dist/components/ComparisonBlock/Blocks/HorizontalMediumBlock.d.ts

@@ -5,8 +5,8 @@ type ComparisonBlockProps = {
     percentageDifference: string;
     comparedTo: {
         value: number;
-        unit: string;
-        label: string;
+        unit?: string;
+        label?: string;
     };
     iconName: keyof IconMapping;
     colors: ColorSet;

package/dist/components/ComparisonBlock/Blocks/VerticalLargeBlock.d.ts

@@ -3,10 +3,10 @@ import { ColorSet } from '../getColorAndArrow';
 
 type ComparisonBlockProps = {
     percentageDifference: string;
-    comparedTo: {
-        value: number;
-        unit: string;
-        label: string;
+    comparedTo?: {
+        value?: number;
+        unit?: string;
+        label?: string;
     };
     iconName: keyof IconMapping;
     colors: ColorSet;

package/dist/components/ComparisonBlock/Blocks/VerticalMediumBlock.d.ts

@@ -5,8 +5,8 @@ type ComparisonBlockProps = {
     percentageDifference: string;
     comparedTo: {
         value: number;
-        unit: string;
-        label: string;
+        unit?: string;
+        label?: string;
     };
     iconName: keyof IconMapping;
     colors: ColorSet;

package/dist/components/ComparisonBlock/ComparisonBlock.d.ts

@@ -12,11 +12,11 @@ type ComparisonBlockProps = {
     currentValue: number;
     comparedTo: {
         value: number;
-        unit: string;
-        label: string;
+        unit?: string;
+        label?: string;
     };
-    disableText?: boolean;
     improvement: Improvement;
+    disableText?: boolean;
     comparisonText?: string;
     layout?: Layout;
 };

package/dist/main.js

@@ -42291,14 +42291,7 @@ const wre = (e) => {
     }
   );
 }, DU = (e) => {
-  const {
-    percentageDifference: t,
-    comparedTo: n,
-    comparisonText: o,
-    iconName: r,
-    colors: i,
-    disableText: a
-  } = e;
+  const { percentageDifference: t, comparedTo: n, comparisonText: o, iconName: r, colors: i, disableText: a } = e;
   return /* @__PURE__ */ p.jsxs(Ue, { direction: "row", alignItems: "center", gap: "2px", flexWrap: "wrap", className: "comparison-block-wrapper", children: [
     /* @__PURE__ */ p.jsxs(
       be,
@@ -42317,45 +42310,20 @@ const wre = (e) => {
         },
         children: [
           /* @__PURE__ */ p.jsx(Vn, { icon: r, size: 1 }),
-          /* @__PURE__ */ p.jsx(be, { display: "flex", alignItems: "center", flexDirection: "row", gap: "8px", children: /* @__PURE__ */ p.jsx(
-            ve,
-            {
-              component: "span",
-              variant: "h6",
-              children: t
-            }
-          ) })
+          /* @__PURE__ */ p.jsx(be, { display: "flex", alignItems: "center", flexDirection: "row", gap: "8px", children: /* @__PURE__ */ p.jsx(ve, { component: "span", variant: "h6", children: t }) })
         ]
       }
     ),
     !a && /* @__PURE__ */ p.jsxs(p.Fragment, { children: [
-      /* @__PURE__ */ p.jsxs(ve, { component: "span", variant: "small", children: [
+      o !== void 0 && (n == null ? void 0 : n.label) !== void 0 && /* @__PURE__ */ p.jsxs(ve, { component: "span", variant: "small", children: [
         o,
         " ",
-        /* @__PURE__ */ p.jsx(
-          ve,
-          {
-            component: "span",
-            variant: "small",
-            fontWeight: 600,
-            children: n.label
-          }
-        )
+        /* @__PURE__ */ p.jsx(ve, { component: "span", variant: "small", fontWeight: 600, children: n.label })
       ] }),
-      " ",
-      /* @__PURE__ */ p.jsxs(ve, { component: "div", variant: "h6", children: [
+      (n == null ? void 0 : n.value) !== void 0 && (n == null ? void 0 : n.unit) !== void 0 && /* @__PURE__ */ p.jsxs(ve, { component: "div", variant: "h6", children: [
         "(",
         n.value,
-        " ",
-        /* @__PURE__ */ p.jsx(
-          ve,
-          {
-            color: "#A3A2A0",
-            component: "span",
-            fontSize: "0.625rem",
-            children: n.unit
-          }
-        ),
+        /* @__PURE__ */ p.jsx(ve, { color: "#A3A2A0", component: "span", fontSize: "0.625rem", children: n.unit }),
         ")"
       ] })
     ] })
@@ -42389,123 +42357,73 @@ const wre = (e) => {
     icon: a
   };
 }, AU = (e) => {
-  const {
-    percentageDifference: t,
-    comparedTo: n,
-    comparisonText: o,
-    iconName: r,
-    colors: i
-  } = e;
+  const { percentageDifference: t, comparedTo: n, comparisonText: o, iconName: r, colors: i } = e;
   return /* @__PURE__ */ p.jsxs(p.Fragment, { children: [
     /* @__PURE__ */ p.jsxs(be, { display: "flex", alignItems: "center", gap: "8px", mb: "4px", children: [
-      /* @__PURE__ */ p.jsx(ku, { icon: r, size: 3, boxProps: {
-        sx: {
-          backgroundColor: i.primaryColor,
-          borderRadius: "32px",
-          color: "#fff"
-        }
-      } }),
       /* @__PURE__ */ p.jsx(
-        ve,
+        ku,
         {
-          component: "span",
-          variant: "h2",
-          children: t
+          icon: r,
+          size: 3,
+          boxProps: {
+            sx: {
+              backgroundColor: i.primaryColor,
+              borderRadius: "32px",
+              color: "#fff"
+            }
+          }
         }
-      )
+      ),
+      /* @__PURE__ */ p.jsx(ve, { component: "span", variant: "h2", children: t })
     ] }),
-    /* @__PURE__ */ p.jsxs(ve, { component: "span", variant: "body", children: [
+    o !== void 0 && (n == null ? void 0 : n.label) !== void 0 && /* @__PURE__ */ p.jsxs(ve, { component: "span", variant: "body", children: [
       o,
       " ",
-      /* @__PURE__ */ p.jsx(
-        ve,
-        {
-          component: "span",
-          variant: "body",
-          fontWeight: 600,
-          children: n.label
-        }
-      )
+      /* @__PURE__ */ p.jsx(ve, { component: "span", variant: "body", fontWeight: 600, children: n.label })
     ] }),
-    /* @__PURE__ */ p.jsxs(ve, { component: "div", variant: "h4", fontSize: "0.875rem", children: [
+    (n == null ? void 0 : n.value) !== void 0 && (n == null ? void 0 : n.unit) !== void 0 && /* @__PURE__ */ p.jsxs(ve, { component: "div", variant: "h4", fontSize: "0.875rem", children: [
       "(",
       n.value,
       " ",
-      /* @__PURE__ */ p.jsx(
-        ve,
-        {
-          color: "#A3A2A0",
-          component: "span",
-          fontSize: "0.625rem",
-          children: n.unit
-        }
-      ),
+      /* @__PURE__ */ p.jsx(ve, { color: "#A3A2A0", component: "span", fontSize: "0.625rem", children: n.unit }),
       ")"
     ] })
   ] });
 }, VU = (e) => {
-  const {
-    percentageDifference: t,
-    comparedTo: n,
-    iconName: o,
-    colors: r,
-    comparisonText: i
-  } = e;
+  const { percentageDifference: t, comparedTo: n, iconName: o, colors: r, comparisonText: i } = e;
   return /* @__PURE__ */ p.jsxs(p.Fragment, { children: [
     /* @__PURE__ */ p.jsxs(be, { display: "flex", alignItems: "center", gap: "8px", children: [
-      /* @__PURE__ */ p.jsx(ku, { icon: o, size: 0.5, boxProps: {
-        sx: {
-          backgroundColor: r.primaryColor,
-          borderRadius: "32px",
-          color: "#fff"
-        }
-      } }),
       /* @__PURE__ */ p.jsx(
-        ve,
+        ku,
         {
-          component: "span",
-          variant: "h4",
-          children: t
+          icon: o,
+          size: 0.5,
+          boxProps: {
+            sx: {
+              backgroundColor: r.primaryColor,
+              borderRadius: "32px",
+              color: "#fff"
+            }
+          }
         }
-      )
+      ),
+      /* @__PURE__ */ p.jsx(ve, { component: "span", variant: "h4", children: t })
     ] }),
-    /* @__PURE__ */ p.jsxs(ve, { component: "span", variant: "small", children: [
+    i !== void 0 && (n == null ? void 0 : n.label) !== void 0 && /* @__PURE__ */ p.jsxs(ve, { component: "span", variant: "small", children: [
       i,
       " ",
-      /* @__PURE__ */ p.jsx(
-        ve,
-        {
-          component: "span",
-          variant: "body",
-          fontWeight: 600,
-          children: n.label
-        }
-      )
+      /* @__PURE__ */ p.jsx(ve, { component: "span", variant: "body", fontWeight: 600, children: n.label })
     ] }),
-    /* @__PURE__ */ p.jsxs(ve, { component: "div", fontWeight: 700, fontSize: "0.625rem", children: [
+    (n == null ? void 0 : n.value) !== void 0 && (n == null ? void 0 : n.unit) !== void 0 && /* @__PURE__ */ p.jsxs(ve, { component: "div", fontWeight: 700, fontSize: "0.625rem", children: [
       "(",
       n.value,
       " ",
-      /* @__PURE__ */ p.jsx(
-        ve,
-        {
-          color: "#A3A2A0",
-          component: "span",
-          fontSize: "0.625rem",
-          children: n.unit
-        }
-      ),
+      /* @__PURE__ */ p.jsx(ve, { color: "#A3A2A0", component: "span", fontSize: "0.625rem", children: n.unit }),
       ")"
     ] })
   ] });
 }, $U = (e) => {
-  const {
-    percentageDifference: t,
-    comparedTo: n,
-    iconName: o,
-    colors: r,
-    comparisonText: i
-  } = e;
+  const { percentageDifference: t, comparedTo: n, iconName: o, colors: r, comparisonText: i } = e;
   return /* @__PURE__ */ p.jsx(p.Fragment, { children: /* @__PURE__ */ p.jsxs(be, { display: "flex", alignItems: "center", flexDirection: "row", gap: "8px", mb: "4px", flexWrap: "wrap", children: [
     /* @__PURE__ */ p.jsx(
       ku,
@@ -42521,40 +42439,17 @@ const wre = (e) => {
         }
       }
     ),
-    /* @__PURE__ */ p.jsx(
-      ve,
-      {
-        component: "span",
-        variant: "h2",
-        children: t
-      }
-    ),
-    /* @__PURE__ */ p.jsxs(ve, { component: "span", variant: "body", children: [
+    /* @__PURE__ */ p.jsx(ve, { component: "span", variant: "h2", children: t }),
+    i !== void 0 && (n == null ? void 0 : n.label) !== void 0 && /* @__PURE__ */ p.jsxs(ve, { component: "span", variant: "body", children: [
       i,
       " ",
-      /* @__PURE__ */ p.jsx(
-        ve,
-        {
-          component: "span",
-          variant: "body",
-          fontWeight: 600,
-          children: n.label
-        }
-      )
+      /* @__PURE__ */ p.jsx(ve, { component: "span", variant: "body", fontWeight: 600, children: n.label })
     ] }),
-    /* @__PURE__ */ p.jsxs(ve, { component: "div", fontWeight: 700, fontSize: "0.875rem", children: [
+    (n == null ? void 0 : n.value) !== void 0 && (n == null ? void 0 : n.unit) !== void 0 && /* @__PURE__ */ p.jsxs(ve, { component: "div", fontWeight: 700, fontSize: "0.875rem", children: [
       "(",
       n.value,
       " ",
-      /* @__PURE__ */ p.jsx(
-        ve,
-        {
-          color: "#A3A2A0",
-          component: "span",
-          fontSize: "0.625rem",
-          children: n.unit
-        }
-      ),
+      /* @__PURE__ */ p.jsx(ve, { color: "#A3A2A0", component: "span", fontSize: "0.625rem", children: n.unit }),
       ")"
     ] })
   ] }) });
@@ -42605,7 +42500,10 @@ const wre = (e) => {
     },
     disableText: a = !1
     // works only for horizontal-m;
-  } = e, l = LU(t, n.value, o), d = `${n.value > 0 ? Math.round(Math.abs(100 - t / n.value * 100)) : "N/A"} %`;
+  } = e;
+  if (n === void 0 || n.value === void 0)
+    throw new Error("comparedTo.value is required for ComparisonBlock");
+  const l = LU(t, n.value, o), d = `${n.value > 0 ? Math.round(Math.abs(100 - t / n.value * 100)) : "N/A"} %`;
   if (i.direction === "vertical")
     return /* @__PURE__ */ p.jsxs(
       be,
@@ -64627,8 +64525,12 @@ const rie = (e) => /* @__PURE__ */ p.jsx(be, { sx: { minWidth: 205 }, children:
   "aria-controls": `tabpanel-${e}`
 }), Dne = W(be)(({ theme: e }) => () => ({
   "&.secondary-tabs-wrapper": {
+    width: "100%",
+    border: `1px solid ${Re[500]}`,
+    borderRadius: "12px",
     "& > .secondary-tabs": {
-      background: Re[200],
+      borderTopLeftRadius: "12px",
+      borderTopRightRadius: "12px",
       "& .MuiTabs-indicator": {
         backgroundColor: e.palette.background.paper
       },
@@ -64674,6 +64576,8 @@ const rie = (e) => /* @__PURE__ */ p.jsx(be, { sx: { minWidth: 205 }, children:
       }
     },
     "& .secondary-tabs-content": {
+      borderBottomLeftRadius: "12px",
+      borderBottomRightRadius: "12px",
       padding: "1.5rem",
       backgroundColor: e.palette.background.paper
     }