@foodpilot/foods 2.11.8 → 2.11.9

package/dist/components/Form/FoodsFormBase/FoodsFormBase.d.ts

@@ -31,8 +31,9 @@ export type ConfirmOptions = {
     confirmOptions: ConfirmOptionsType;
 };
 export type FoodsFormBaseProps = ConfirmOptions & {
-    textOptions: DisplayTextOptions;
     pages: FoodsPage[];
+    children?: ReactNode;
+    textOptions: DisplayTextOptions;
     startingPage?: number;
     onClose?: () => void;
     onValidate?: () => void;

package/dist/components/Form/FoodsFormBase/FoodsFormBase.js

@@ -4,8 +4,10 @@ import { FormBaseContextProvider, useFormBaseContext } from "./FormBaseContext.j
 import { FormTopBar } from "./FormTopBar/FormTopBar.js";
 import { MainPageLayout } from "./MainPageLayout.js";
 import { ConfirmDialog } from "./ConfirmDialog.js";
-const _FoodsFormBase = () => {
+import { Stack } from "@mui/material";
+const _FoodsFormBase = (props) => {
   const { confirmExit, formSaved } = useFormBaseContext();
+  const { children } = props;
   const listener = (ev) => {
     ev.preventDefault();
   };
@@ -19,13 +21,14 @@ const _FoodsFormBase = () => {
   }, [formSaved, confirmExit]);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(FormTopBar, {}),
-    /* @__PURE__ */ jsx(MainPageLayout, {})
+    /* @__PURE__ */ jsx(Stack, { children: children === void 0 ? /* @__PURE__ */ jsx(MainPageLayout, {}) : children })
   ] });
 };
 const FoodsFormBase = (props) => {
   const [openConfirm, setOpenConfirm] = useState(false);
+  const children = props.children;
   return /* @__PURE__ */ jsxs(FormBaseContextProvider, { ...props, openConfirmDialog: () => setOpenConfirm(true), children: [
-    /* @__PURE__ */ jsx(_FoodsFormBase, {}),
+    /* @__PURE__ */ jsx(_FoodsFormBase, { children }),
     props.confirmExit && /* @__PURE__ */ jsx(
       ConfirmDialog,
       {

package/dist/components/Form/FoodsFormBase/FormBaseContext.d.ts

@@ -1,7 +1,8 @@
 import { ReactNode } from 'react';
 import { FoodsPage, FoodsFormBaseProps } from './FoodsFormBase';
 import { PageLocks } from './usePageLock';
-type FormBasePropsBlackList = Omit<FoodsFormBaseProps, "startingPage">;
+export type FormBaseVariant = "outlined" | "full-width";
+type FormBasePropsBlackList = Omit<FoodsFormBaseProps, "startingPage" | "variant">;
 type ExtraFormOptions = {
     isSaving: boolean;
     setSaving: (isSaving: boolean) => void;

package/dist/components/Form/FoodsFormBase/FormBaseContext.js

@@ -3,12 +3,12 @@ import { useContext, createContext, useState } from "react";
 import { usePageLock } from "./usePageLock.js";
 const FormBaseContext = createContext(null);
 const FormBaseContextProvider = (props) => {
-  const { children, startingPage = 0, ...FormBaseProps } = props;
+  const { children, pages = [], startingPage = 0, ...FormBaseProps } = props;
   const [isSaving, setSaving] = useState(false);
   const [isError, setError] = useState(false);
   const [selectedPageIndex, setPage] = useState(startingPage);
-  const maxPage = props.pages.length;
-  const selectedPage = props.pages[selectedPageIndex] ?? null;
+  const maxPage = pages.length;
+  const selectedPage = pages[selectedPageIndex] ?? null;
   const pageLock = usePageLock();
   const [formSaved, setFormSaved] = useState(false);
   const items = {
@@ -23,7 +23,9 @@ const FormBaseContextProvider = (props) => {
     formSaved,
     setFormSaved,
     isError,
-    setError
+    setError,
+    // variant,
+    pages
   };
   return /* @__PURE__ */ jsx(FormBaseContext.Provider, { value: items, children });
 };

package/dist/components/Form/FoodsFormBase/FormTopBar/TopBarFullWidth/CenterPagination.d.ts

@@ -0,0 +1 @@
+export declare const CenterPagination: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Form/FoodsFormBase/FormTopBar/TopBarFullWidth/LeftName.d.ts

@@ -0,0 +1 @@
+export declare const LeftName: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Form/FoodsFormBase/FormTopBar/TopBarFullWidth/RightSave.d.ts

@@ -0,0 +1 @@
+export declare const RightSave: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Form/FoodsFormBase/FormTopBar/TopBarFullWidth/TopBarFullWidth.d.ts

@@ -0,0 +1 @@
+export declare const TopBarFullWidth: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Tabs/FoodsTabs/FoodsTabTemplate.js

@@ -13,6 +13,7 @@ const SpecialTab = styled((props) => {
   const typographyTheme = textVariant === "inherit" ? {} : theme.typography[textVariant];
   const globalOverrides = {
     textTransform: "unset",
+    maxWidth: "none",
     ...typographyTheme
   };
   if (variant === "primary") {
@@ -49,7 +50,9 @@ const SpecialTab = styled((props) => {
   }
   if (variant === "buttons") {
     return {
-      minHeight: "40px",
+      minHeight: "36px",
+      height: "36px",
+      borderRadius: theme.spacing(1),
       margin: "4px",
       background: "linear-gradient(180deg, #FFFFFF 0%, #F6F5F3 154.5%)",
       border: `1px solid ${theme.custom.grey[600]}`,

package/dist/components/Tabs/FoodsTabs/FoodsTabs.js

@@ -113,9 +113,10 @@ const SpecialTabs = styled((props) => {
   }
   if (tabVariant === "buttons") {
     return {
-      backgroundColor: "white",
+      minHeight: "36px",
+      backgroundColor: "inherit",
       ".MuiTabs-indicator": {
-        backgroundColor: "white"
+        backgroundColor: "inherit"
       },
       ...scrollableStyle
     };

package/dist/themes/responsive/useResponsiveBreakpoints.d.ts

@@ -1,4 +1,5 @@
 export declare const useResponsiveBreakpoints: () => {
+    isExtraSmall: boolean;
     isMobile: boolean;
     isTablet: boolean;
     isDesktop: boolean;

package/dist/themes/responsive/useResponsiveBreakpoints.js

@@ -2,11 +2,13 @@ import { useTheme } from "@mui/material/styles";
 import { useMediaQuery } from "@mui/material";
 const useResponsiveBreakpoints = () => {
   const theme = useTheme();
+  const isExtraSmall = useMediaQuery(theme.breakpoints.down("sm"));
   const isMobile = useMediaQuery(theme.breakpoints.down("md"));
   const isTablet = useMediaQuery(theme.breakpoints.between("md", "lg"));
   const isDesktop = useMediaQuery(theme.breakpoints.between("lg", "xl"));
   const isUltrawide = useMediaQuery(theme.breakpoints.up("xl"));
   return {
+    isExtraSmall,
     isMobile,
     isTablet,
     isDesktop,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@foodpilot/foods",
   "private": false,
-  "version": "2.11.8",
+  "version": "2.11.9",
   "type": "module",
   "main": "./dist/main.js",
   "module": "./dist/main.js",