umwd-components 0.1.737 → 0.1.739

package/dist/esm/src/components/logistics/vendor/AddVendorForm.js

@@ -61,11 +61,25 @@ function AddVendorForm({ productNamesArr, revalidateCallback, handleClose, sx, }
             });
         }
     }, [formState?.strapiErrors]);
-    return (jsx(Box, { sx: [...(Array.isArray(sx) ? sx : [sx])], children: jsx("form", { action: formAction, children: jsxs(Grid, { container: true, spacing: 2, children: [jsx(Grid, { item: true, xs: 12, children: jsxs(Stack, { spacing: 2, children: [jsx(Typography, { variant: "h3", component: "h1", children: "Add Vendor" }), jsx(Typography, { variant: "body1", children: "Create a new vendor for your business" })] }) }), jsx(Grid, { item: true, xs: 12, children: jsx(ExplanatoryFoldOut, { title: "Vendor", description: "Vendors are businesses that you purchase products from." }) }), jsx(Grid, { item: true, xs: 12, md: 6, children: jsx(BusinessCredentialsFields, { componentName: "business_credentials", componentReference: "common.business-credentials" }) }), jsx(Grid, { item: true, xs: 12, md: 6, children: jsxs(Stack, { spacing: 1, sx: { pt: 1 }, children: [jsx(TextField, { id: "website_url", name: "website_url", label: "Website Url" }), jsx(TextField, { id: "phone_number", name: "phone_number", label: "Phone Number" }), jsx(TextField, { id: "email", name: "email", label: "Email" })] }) }), jsxs(Grid, { item: true, xs: 12, md: 6, children: [jsx(Typography, { variant: "h6", children: "Address" }), jsx(AddressFields, { componentName: "address", componentReference: "common.address" })] }), jsx(Grid, { item: true, xs: 12, children: jsx(Typography, { variant: "h6", children: "Products" }) }), jsx(Grid, { item: true, xs: 12, children: jsx(ProductSelector, { productNames: productNamesArr, currentValue: [] }) }), jsx(Grid, { item: true, xs: 12, children: jsx(Typography, { variant: "h6", children: "Contacts" }) }), newContacts.map((contact, index) => {
-                        return (jsx(Grid, { item: true, xs: 12, sm: 6, md: 4, lg: 3, sx: {
+    return (jsx(Box, { sx: [...(Array.isArray(sx) ? sx : [sx])], children: jsx("form", { action: formAction, children: jsxs(Grid, { container: true, spacing: 2, children: [jsx(Grid, { size: 12, children: jsxs(Stack, { spacing: 2, children: [jsx(Typography, { variant: "h3", component: "h1", children: "Add Vendor" }), jsx(Typography, { variant: "body1", children: "Create a new vendor for your business" })] }) }), jsx(Grid, { size: 12, children: jsx(ExplanatoryFoldOut, { title: "Vendor", description: "Vendors are businesses that you purchase products from." }) }), jsx(Grid, { size: {
+                            xs: 12,
+                            md: 6
+                        }, children: jsx(BusinessCredentialsFields, { componentName: "business_credentials", componentReference: "common.business-credentials" }) }), jsx(Grid, { size: {
+                            xs: 12,
+                            md: 6
+                        }, children: jsxs(Stack, { spacing: 1, sx: { pt: 1 }, children: [jsx(TextField, { id: "website_url", name: "website_url", label: "Website Url" }), jsx(TextField, { id: "phone_number", name: "phone_number", label: "Phone Number" }), jsx(TextField, { id: "email", name: "email", label: "Email" })] }) }), jsxs(Grid, { size: {
+                            xs: 12,
+                            md: 6
+                        }, children: [jsx(Typography, { variant: "h6", children: "Address" }), jsx(AddressFields, { componentName: "address", componentReference: "common.address" })] }), jsx(Grid, { size: 12, children: jsx(Typography, { variant: "h6", children: "Products" }) }), jsx(Grid, { size: 12, children: jsx(ProductSelector, { productNames: productNamesArr, currentValue: [] }) }), jsx(Grid, { size: 12, children: jsx(Typography, { variant: "h6", children: "Contacts" }) }), newContacts.map((contact, index) => {
+                        return (jsx(Grid, { sx: {
                                 justifyContent: "center",
                                 display: "flex",
                                 alignItems: "center",
+                            }, size: {
+                                xs: 12,
+                                sm: 6,
+                                md: 4,
+                                lg: 3
                             }, children: jsx(Paper, { sx: {
                                     p: 2,
                                     width: "100%",
@@ -76,10 +90,15 @@ function AddVendorForm({ productNamesArr, revalidateCallback, handleClose, sx, }
                                 }, children: jsx(ContactsFields, { data: contact.data, componentName: contact.componentName, componentReference: "logistics-elements.contact", deleteCallback: () => {
                                         handleDeleteContact(index);
                                     } }, index) }) }, index));
-                    }), jsx(Grid, { item: true, xs: 12, sm: 6, md: 4, lg: 3, sx: {
+                    }), jsx(Grid, { sx: {
                             justifyContent: "center",
                             display: "flex",
                             alignItems: "center",
+                        }, size: {
+                            xs: 12,
+                            sm: 6,
+                            md: 4,
+                            lg: 3
                         }, children: jsx(Paper, { sx: {
                                 p: 2,
                                 width: "100%",
@@ -102,7 +121,7 @@ function AddVendorForm({ productNamesArr, revalidateCallback, handleClose, sx, }
                                             },
                                         },
                                     ]);
-                                }, size: "large", children: "Add contact" }) }) }), jsx(Grid, { item: true, xs: 12, children: jsxs(Stack, { direction: "row", spacing: 2, justifyContent: "space-between", alignItems: "center", children: [handleClose && (jsx(Button, { onClick: handleClose, variant: "outlined", children: "Cancel" })), jsx(SubmitButton, { text: "Create Vendor", loadingText: "Creating...", variant: "contained" })] }) })] }) }) }));
+                                }, size: "large", children: "Add contact" }) }) }), jsx(Grid, { size: 12, children: jsxs(Stack, { direction: "row", spacing: 2, justifyContent: "space-between", alignItems: "center", children: [handleClose && (jsx(Button, { onClick: handleClose, variant: "outlined", children: "Cancel" })), jsx(SubmitButton, { text: "Create Vendor", loadingText: "Creating...", variant: "contained" })] }) })] }) }) }));
 }
 
 export { AddVendorForm };

package/dist/esm/src/components/logistics/vendor/EditVendorForm.js

@@ -81,19 +81,33 @@ function EditVendorForm({ data, productNamesArr, revalidateCallback, handleClose
     // INFO must utilize the uuid to ensure that the new contacts are unique
     // this is important to use both the deleteCallback and still not have problems with the key
     const [newContacts, setNewContacts] = useState([]);
-    return (jsx(Box, { sx: [...(Array.isArray(sx) ? sx : [sx])], children: jsx("form", { action: formAction, children: jsxs(Grid, { container: true, spacing: 2, children: [jsx(Grid, { item: true, xs: 12, children: jsxs(Stack, { direction: "row", justifyContent: "space-between", children: [jsx(Typography, { variant: "h5", children: "Edit Vendor" }), jsx(NoteTakingComponent, { content: "", related: [
+    return (jsx(Box, { sx: [...(Array.isArray(sx) ? sx : [sx])], children: jsx("form", { action: formAction, children: jsxs(Grid, { container: true, spacing: 2, children: [jsx(Grid, { size: 12, children: jsxs(Stack, { direction: "row", justifyContent: "space-between", children: [jsx(Typography, { variant: "h5", children: "Edit Vendor" }), jsx(NoteTakingComponent, { content: "", related: [
                                         {
                                             id: data.documentId,
                                             __type: "api::logistics.vendor-profile",
                                         },
-                                    ], revalidateCallback: revalidateCallback })] }) }), jsx(Grid, { item: true, xs: 12, children: jsx(ExplanatoryFoldOut, { title: "Vendor", description: "Vendors are businesses that you purchase products from." }) }), jsx(Grid, { item: true, xs: 12, md: 6, children: jsx(BusinessCredentialsFields, { data: business_credentials, componentName: "business_credentials", componentReference: "common.business-credentials" }) }), jsx(Grid, { item: true, xs: 12, md: 6, children: jsxs(Stack, { spacing: 2, children: [jsx(TextField, { id: "website_url", name: "website_url", label: "Website Url", defaultValue: website_url }), jsx(TextField, { id: "phone_number", name: "phone_number", label: "Phone Number", defaultValue: phone_number }), jsx(TextField, { id: "email", name: "email", label: "Email", defaultValue: email })] }) }), jsxs(Grid, { item: true, xs: 12, md: 6, children: [jsx(Typography, { variant: "h6", children: "Address" }), jsx(AddressFields, { data: address, componentName: "address", componentReference: "common.address" })] }), jsxs(Grid, { item: true, xs: 12, sx: { mt: 1 }, children: [jsx(Typography, { variant: "h6", children: "Products" }), jsx(ProductSelector, { productNames: productNamesArr, currentValue: initialProducts.map((prod) => prod.documentId) })] }), jsx(Grid, { item: true, xs: 12, sx: { mt: 1 }, children: jsx(Typography, { variant: "h6", children: "Contacts" }) }), oldContacts?.map((contact, index) => {
+                                    ], revalidateCallback: revalidateCallback })] }) }), jsx(Grid, { size: 12, children: jsx(ExplanatoryFoldOut, { title: "Vendor", description: "Vendors are businesses that you purchase products from." }) }), jsx(Grid, { size: {
+                            xs: 12,
+                            md: 6
+                        }, children: jsx(BusinessCredentialsFields, { data: business_credentials, componentName: "business_credentials", componentReference: "common.business-credentials" }) }), jsx(Grid, { size: {
+                            xs: 12,
+                            md: 6
+                        }, children: jsxs(Stack, { spacing: 2, children: [jsx(TextField, { id: "website_url", name: "website_url", label: "Website Url", defaultValue: website_url }), jsx(TextField, { id: "phone_number", name: "phone_number", label: "Phone Number", defaultValue: phone_number }), jsx(TextField, { id: "email", name: "email", label: "Email", defaultValue: email })] }) }), jsxs(Grid, { size: {
+                            xs: 12,
+                            md: 6
+                        }, children: [jsx(Typography, { variant: "h6", children: "Address" }), jsx(AddressFields, { data: address, componentName: "address", componentReference: "common.address" })] }), jsxs(Grid, { sx: { mt: 1 }, size: 12, children: [jsx(Typography, { variant: "h6", children: "Products" }), jsx(ProductSelector, { productNames: productNamesArr, currentValue: initialProducts.map((prod) => prod.documentId) })] }), jsx(Grid, { sx: { mt: 1 }, size: 12, children: jsx(Typography, { variant: "h6", children: "Contacts" }) }), oldContacts?.map((contact, index) => {
                         console.log("contact", contact);
                         if (contact.data?.first_name) {
                             if (open.includes(contact.data?.first_name)) {
-                                return (jsx(Grid, { item: true, xs: 12, sm: 6, md: 4, lg: 3, sx: {
+                                return (jsx(Grid, { sx: {
                                         justifyContent: "center",
                                         display: "flex",
                                         alignItems: "center",
+                                    }, size: {
+                                        xs: 12,
+                                        sm: 6,
+                                        md: 4,
+                                        lg: 3
                                     }, children: jsx(Paper, { sx: {
                                             p: 2,
                                             width: "100%",
@@ -109,10 +123,15 @@ function EditVendorForm({ data, productNamesArr, revalidateCallback, handleClose
                                             } }) }) }, contact.data?.documentId || index));
                             }
                             else {
-                                return (jsx(Grid, { item: true, xs: 12, sm: 6, md: 4, lg: 3, sx: {
+                                return (jsx(Grid, { sx: {
                                         justifyContent: "center",
                                         display: "flex",
                                         alignItems: "center",
+                                    }, size: {
+                                        xs: 12,
+                                        sm: 6,
+                                        md: 4,
+                                        lg: 3
                                     }, children: jsx(Paper, { sx: {
                                             p: 2,
                                             width: "100%",
@@ -125,10 +144,15 @@ function EditVendorForm({ data, productNamesArr, revalidateCallback, handleClose
                         }
                         return null;
                     }), newContacts.map((contact, index) => {
-                        return (jsx(Grid, { item: true, xs: 12, sm: 6, md: 4, lg: 3, sx: {
+                        return (jsx(Grid, { sx: {
                                 justifyContent: "center",
                                 display: "flex",
                                 alignItems: "center",
+                            }, size: {
+                                xs: 12,
+                                sm: 6,
+                                md: 4,
+                                lg: 3
                             }, children: jsx(Paper, { sx: {
                                     p: 2,
                                     width: "100%",
@@ -146,10 +170,15 @@ function EditVendorForm({ data, productNamesArr, revalidateCallback, handleClose
                                             };
                                         }));
                                     } }) }) }, contact.data?.documentId || index));
-                    }), jsx(Grid, { item: true, xs: 12, sm: 6, md: 4, lg: 3, sx: {
+                    }), jsx(Grid, { sx: {
                             justifyContent: "center",
                             display: "flex",
                             alignItems: "center",
+                        }, size: {
+                            xs: 12,
+                            sm: 6,
+                            md: 4,
+                            lg: 3
                         }, children: jsx(Paper, { sx: {
                                 p: 2,
                                 width: "100%",
@@ -174,7 +203,7 @@ function EditVendorForm({ data, productNamesArr, revalidateCallback, handleClose
                                             },
                                         },
                                     ]);
-                                }, size: "large", children: "Add contact" }) }) }), jsxs(Grid, { item: true, xs: 12, children: [jsx(Typography, { variant: "h6", children: "Notes" }), Array.isArray(notes) && notes.length > 0 ? (jsx(NotesDisplay, { notes: notes })) : (jsx(Typography, { children: "No notes to display" }))] }), " ", jsx(Grid, { item: true, xs: 12, children: jsxs(Stack, { direction: "row", spacing: 2, justifyContent: "space-between", alignItems: "center", sx: { mt: 2 }, children: [handleClose && (jsx(Button, { onClick: handleClose, variant: "outlined", children: "Cancel" })), jsx(SubmitButton, { text: "Update Vendor", loadingText: "Updating..." })] }) })] }) }) }));
+                                }, size: "large", children: "Add contact" }) }) }), jsxs(Grid, { size: 12, children: [jsx(Typography, { variant: "h6", children: "Notes" }), Array.isArray(notes) && notes.length > 0 ? (jsx(NotesDisplay, { notes: notes })) : (jsx(Typography, { children: "No notes to display" }))] }), " ", jsx(Grid, { size: 12, children: jsxs(Stack, { direction: "row", spacing: 2, justifyContent: "space-between", alignItems: "center", sx: { mt: 2 }, children: [handleClose && (jsx(Button, { onClick: handleClose, variant: "outlined", children: "Cancel" })), jsx(SubmitButton, { text: "Update Vendor", loadingText: "Updating..." })] }) })] }) }) }));
 }
 
 export { EditVendorForm };

package/dist/esm/src/components/logistics/vendor/VendorDisplay.js

@@ -24,7 +24,16 @@ function VendorDisplay({ data, sx }) {
             // You cannot spread `sx` directly because `SxProps` (typeof sx) can be an array.
             { p: 2 },
             ...(Array.isArray(sx) ? sx : [sx]),
-        ], component: Paper, children: [jsxs(Grid, { container: true, spacing: 2, children: [jsx(Grid, { item: true, xs: 12, children: jsx(Typography, { variant: "h5", children: "Vendor" }) }), jsx(Grid, { item: true, xs: 12, md: 6, children: jsx(BusinessCredentials, { data: business_credentials }) }), jsxs(Grid, { item: true, xs: 12, md: 6, children: [jsxs(Typography, { variant: "body1", children: ["Website Url: ", website_url] }), jsxs(Typography, { variant: "body1", children: ["Phone Number: ", phone_number] }), jsxs(Typography, { variant: "body1", children: ["Email: ", email] })] }), jsxs(Grid, { item: true, xs: 12, md: 6, children: [jsx(Typography, { variant: "h6", children: "Address" }), jsx(Address, { data: address })] })] }), jsxs(Grid, { item: true, xs: 12, sx: { mt: 3 }, children: [jsx(Typography, { variant: "h6", children: "Products" }), jsx(ExplanatoryFoldOut, { title: "Products", sx: { mt: 1 }, children: jsx(Stack, { spacing: 1, children: products.map((product, index) => (jsx(Paper, { sx: { p: 1 }, children: jsxs(Stack, { direction: "row", justifyContent: "space-between", children: [jsxs(Typography, { variant: "h6", children: ["Product: ", product.title, " ", product.product_number] }), jsx(Price, { ...product.price })] }) }, index))) }) })] }), jsxs(Grid, { item: true, xs: 12, sx: { mt: 3 }, children: [jsx(Typography, { variant: "h6", children: "Contacts" }), jsx(ExplanatoryFoldOut, { title: "Contacts", sx: { mt: 1 }, children: jsx(Stack, { spacing: 1, children: contacts.map((contact, index) => (jsx(Paper, { sx: { p: 1 }, children: jsx(Contacts, { data: contact }) }, index))) }) })] })] }));
+        ], component: Paper, children: [jsxs(Grid, { container: true, spacing: 2, children: [jsx(Grid, { size: 12, children: jsx(Typography, { variant: "h5", children: "Vendor" }) }), jsx(Grid, { size: {
+                            xs: 12,
+                            md: 6
+                        }, children: jsx(BusinessCredentials, { data: business_credentials }) }), jsxs(Grid, { size: {
+                            xs: 12,
+                            md: 6
+                        }, children: [jsxs(Typography, { variant: "body1", children: ["Website Url: ", website_url] }), jsxs(Typography, { variant: "body1", children: ["Phone Number: ", phone_number] }), jsxs(Typography, { variant: "body1", children: ["Email: ", email] })] }), jsxs(Grid, { size: {
+                            xs: 12,
+                            md: 6
+                        }, children: [jsx(Typography, { variant: "h6", children: "Address" }), jsx(Address, { data: address })] })] }), jsxs(Grid, { sx: { mt: 3 }, size: 12, children: [jsx(Typography, { variant: "h6", children: "Products" }), jsx(ExplanatoryFoldOut, { title: "Products", sx: { mt: 1 }, children: jsx(Stack, { spacing: 1, children: products.map((product, index) => (jsx(Paper, { sx: { p: 1 }, children: jsxs(Stack, { direction: "row", justifyContent: "space-between", children: [jsxs(Typography, { variant: "h6", children: ["Product: ", product.title, " ", product.product_number] }), jsx(Price, { ...product.price })] }) }, index))) }) })] }), jsxs(Grid, { sx: { mt: 3 }, size: 12, children: [jsx(Typography, { variant: "h6", children: "Contacts" }), jsx(ExplanatoryFoldOut, { title: "Contacts", sx: { mt: 1 }, children: jsx(Stack, { spacing: 1, children: contacts.map((contact, index) => (jsx(Paper, { sx: { p: 1 }, children: jsx(Contacts, { data: contact }) }, index))) }) })] })] }));
 }
 
 export { VendorDisplay };

package/dist/esm/src/components/page-builder/ColumnsSection.js

@@ -20,7 +20,10 @@ function ColumnsSection({ data, }) {
             ...(Array.isArray(sx) ? sx : [sx]),
         ], children: jsx(Grid, { container: true, spacing: 2, children: column.map((column) => {
                 const Icon = getIcon(column.icon);
-                return (jsx(Grid, { item: true, xs: 12, md: 6, children: jsxs(Paper, { sx: { p: 2, height: "100%" }, children: [jsxs(Typography, { variant: "h5", sx: {
+                return (jsx(Grid, { size: {
+                        xs: 12,
+                        md: 6
+                    }, children: jsxs(Paper, { sx: { p: 2, height: "100%" }, children: [jsxs(Typography, { variant: "h5", sx: {
                                     mb: 2,
                                     display: "flex",
                                     justifyContent: "flex-start",

package/dist/esm/src/components/page-builder/IconSection.js

@@ -16,7 +16,12 @@ function IconSection({ data }) {
     const { icon, maxWidth, sx = {} } = data;
     return (jsx(Container, { maxWidth: maxWidth || "lg", sx: { my: 1, ...sx }, children: jsx(Grid, { container: true, spacing: 2, children: icon.map((icon) => {
                 const Icon = getIcon(icon.icon);
-                return (jsx(Grid, { item: true, xs: 12, sm: 6, md: 4, lg: 3, children: jsx(Card, { sx: {
+                return (jsx(Grid, { size: {
+                        xs: 12,
+                        sm: 6,
+                        md: 4,
+                        lg: 3
+                    }, children: jsx(Card, { sx: {
                             display: "flex",
                             flexDirection: "column",
                             flex: 1,

package/dist/esm/src/components/page-builder/LogoBarSection.js

@@ -18,7 +18,7 @@ import { StyledLink } from '../StyledLink.js';
 function LogoBarSection({ data, }) {
     const { companies, maxWidth = "lg", sx = {}, glass = false } = data;
     const theme = useTheme();
-    return (jsx(Container, { maxWidth: maxWidth, sx: { my: 1, ...sx }, children: jsx(Grid, { container: true, spacing: 2, children: jsx(Grid, { item: true, xs: 12, children: jsx(Paper, { sx: {
+    return (jsx(Container, { maxWidth: maxWidth, sx: { my: 1, ...sx }, children: jsx(Grid, { container: true, spacing: 2, children: jsx(Grid, { size: 12, children: jsx(Paper, { sx: {
                         p: 2,
                         backdropFilter: "blur(3px)",
                         backgroundColor: setOpacity(theme.palette.background.paper, glass ? 0.1 : 1),

package/dist/esm/src/components/page-builder/PBPersonaliaSection.js

@@ -22,7 +22,13 @@ import { useTheme } from '@mui/material/styles';
 
 function Partner(partner, index2) {
     const theme = useTheme();
-    return (jsx(Grid, { item: true, xs: 12, md: 6, children: jsx(Paper, { sx: { p: 2, height: "100%" }, children: jsxs(Grid, { container: true, spacing: 3, children: [jsx(Grid, { item: true, xs: 12, sm: 7, children: jsxs(Stack, { spacing: 2, children: [jsx(TextField, { id: "name", label: "Name", defaultValue: partner.name, sx: {
+    return (jsx(Grid, { size: {
+            xs: 12,
+            md: 6
+        }, children: jsx(Paper, { sx: { p: 2, height: "100%" }, children: jsxs(Grid, { container: true, spacing: 3, children: [jsx(Grid, { size: {
+                            xs: 12,
+                            sm: 7
+                        }, children: jsxs(Stack, { spacing: 2, children: [jsx(TextField, { id: "name", label: "Name", defaultValue: partner.name, sx: {
                                         input: {
                                             fontFamily: theme.typography.h5.fontFamily,
                                             fontWeight: theme.typography.h5.fontWeight,
@@ -34,7 +40,10 @@ function Partner(partner, index2) {
                                             fontWeight: theme.typography.body2.fontWeight,
                                             fontSize: theme.typography.body2.fontSize,
                                         },
-                                    } })] }) }), jsx(Grid, { item: true, xs: 12, sm: 5, children: jsxs(Stack, { spacing: 2, sx: { overflow: "clip" }, justifyContent: "center", alignItems: "stretch", children: [partner.photo?.url && (jsx(StrapiImage, { id: partner.photo.id, url: partner.photo.url, alternativeText: partner.photo.alternativeText, width: partner.photo.width || 200, height: partner.photo.height || 200, style: {
+                                    } })] }) }), jsx(Grid, { size: {
+                            xs: 12,
+                            sm: 5
+                        }, children: jsxs(Stack, { spacing: 2, sx: { overflow: "clip" }, justifyContent: "center", alignItems: "stretch", children: [partner.photo?.url && (jsx(StrapiImage, { id: partner.photo.id, url: partner.photo.url, alternativeText: partner.photo.alternativeText, width: partner.photo.width || 200, height: partner.photo.height || 200, style: {
                                         maxWidth: "100%",
                                         height: "auto",
                                         // borderRadius: "50%", TODO this style was removed because it's specific to AMH, should be added to photo.style

package/dist/esm/src/components/page-builder/PBTextImageSection.js

@@ -74,7 +74,10 @@ function PBTextImageSection({ data }) {
     reading up upon mui-markdown docs is advised */
     /* TODO Replace with blocks */
     const theme = useTheme();
-    return (jsx(Container, { maxWidth: maxWidth || "lg", sx: { my: 1, ...sx }, id: anchor, children: jsxs(Box, { sx: { p: 1, border: "1px dashed #fff" }, children: [title && (jsx(Typography, { variant: "h1", textAlign: "center", sx: { pb: 2 }, children: title })), jsxs(Grid, { container: true, spacing: 2, direction: reverse ? "row-reverse" : "row", children: [jsx(Grid, { item: true, xs: 12, md: image?.url !== undefined ? 8 : 12, children: jsx(Paper, { sx: {
+    return (jsx(Container, { maxWidth: maxWidth || "lg", sx: { my: 1, ...sx }, id: anchor, children: jsxs(Box, { sx: { p: 1, border: "1px dashed #fff" }, children: [title && (jsx(Typography, { variant: "h1", textAlign: "center", sx: { pb: 2 }, children: title })), jsxs(Grid, { container: true, spacing: 2, direction: reverse ? "row-reverse" : "row", children: [jsx(Grid, { size: {
+                                xs: 12,
+                                md: image?.url !== undefined ? 8 : 12
+                            }, children: jsx(Paper, { sx: {
                                     p: 2,
                                     backdropFilter: "blur(3px)",
                                     backgroundColor: setOpacity(theme.palette.background.paper, glass ? 0.1 : 1),
@@ -85,7 +88,10 @@ function PBTextImageSection({ data }) {
                                         display: "flex",
                                         alignItems: "center",
                                         justifyContent: "flex-start",
-                                    }, children: jsx(TextField, { multiline: true, placeholder: text, value: text, onChange: (e) => console.log(e.target.value), sx: { width: "100%" } }) })) }) }), image?.url !== undefined && (jsx(Grid, { item: true, xs: 12, md: 4, children: jsx(StickyImage, { image: image }) }))] })] }) }));
+                                    }, children: jsx(TextField, { multiline: true, placeholder: text, value: text, onChange: (e) => console.log(e.target.value), sx: { width: "100%" } }) })) }) }), image?.url !== undefined && (jsx(Grid, { size: {
+                                xs: 12,
+                                md: 4
+                            }, children: jsx(StickyImage, { image: image }) }))] })] }) }));
 }
 
 export { PBTextImageSection };

package/dist/esm/src/components/page-builder/PictureBarSection.js

@@ -18,7 +18,7 @@ import { setOpacity } from '../../lib/utils.js';
 function PictureBarSection({ data, }) {
     const { pictures, maxWidth = "lg", sx = {}, glass = false } = data;
     const theme = useTheme();
-    return (jsx(Container, { maxWidth: maxWidth, sx: { my: 1, ...sx }, children: jsx(Grid, { container: true, spacing: 2, children: jsx(Grid, { item: true, xs: 12, children: jsx(Paper, { sx: {
+    return (jsx(Container, { maxWidth: maxWidth, sx: { my: 1, ...sx }, children: jsx(Grid, { container: true, spacing: 2, children: jsx(Grid, { size: 12, children: jsx(Paper, { sx: {
                         p: 2,
                         backdropFilter: "blur(3px)",
                         backgroundColor: setOpacity(theme.palette.background.paper, glass ? 0.1 : 1),

package/dist/esm/src/components/page-elements/CategoryBlock.js

@@ -21,7 +21,7 @@ import MarkdownDisplay from '../common/markdown/MarkdownDisplay.js';
 function CategoryBlock({ data }) {
     const { maxWidth = "lg", sx = {}, glass = false, previewAmount = 3 } = data;
     const theme = useTheme();
-    return (jsx(Container, { maxWidth: maxWidth, sx: { my: 1, ...sx }, children: jsx(Grid, { container: true, spacing: 2, children: jsx(Grid, { item: true, xs: 12, children: jsx(Paper, { sx: {
+    return (jsx(Container, { maxWidth: maxWidth, sx: { my: 1, ...sx }, children: jsx(Grid, { container: true, spacing: 2, children: jsx(Grid, { size: 12, children: jsx(Paper, { sx: {
                         p: 2,
                         backdropFilter: "blur(3px)",
                         backgroundColor: setOpacity(theme.palette.background.paper, glass ? 0.1 : 1),

package/dist/esm/src/components/page-elements/ColumnsSection.js

@@ -20,7 +20,10 @@ function ColumnsSection({ data, }) {
             ...(Array.isArray(sx) ? sx : [sx]),
         ], children: jsx(Grid, { container: true, spacing: 2, children: column.map((column) => {
                 const Icon = getIcon(column.icon);
-                return (jsx(Grid, { item: true, xs: 12, md: 6, children: jsxs(Paper, { sx: { p: 2, height: "100%" }, children: [jsxs(Typography, { variant: "h5", sx: {
+                return (jsx(Grid, { size: {
+                        xs: 12,
+                        md: 6
+                    }, children: jsxs(Paper, { sx: { p: 2, height: "100%" }, children: [jsxs(Typography, { variant: "h5", sx: {
                                     mb: 2,
                                     display: "flex",
                                     justifyContent: "flex-start",

package/dist/esm/src/components/page-elements/IconSection.js

@@ -16,7 +16,12 @@ function IconSection({ data }) {
     const { icon, maxWidth, sx = {} } = data;
     return (jsx(Container, { maxWidth: maxWidth || "lg", sx: { my: 1, ...sx }, children: jsx(Grid, { container: true, spacing: 2, children: icon.map((icon) => {
                 const Icon = getIcon(icon.icon);
-                return (jsx(Grid, { item: true, xs: 12, sm: 6, md: 4, lg: 3, children: jsx(Card, { sx: {
+                return (jsx(Grid, { size: {
+                        xs: 12,
+                        sm: 6,
+                        md: 4,
+                        lg: 3
+                    }, children: jsx(Card, { sx: {
                             display: "flex",
                             flexDirection: "column",
                             flex: 1,

package/dist/esm/src/components/page-elements/LogoBarSection.js

@@ -18,7 +18,7 @@ import { StyledLink } from '../StyledLink.js';
 function LogoBarSection({ data, }) {
     const { companies, maxWidth = "lg", sx = {}, glass = false } = data;
     const theme = useTheme();
-    return (jsx(Container, { maxWidth: maxWidth, sx: { my: 1, ...sx }, children: jsx(Grid, { container: true, spacing: 2, children: jsx(Grid, { item: true, xs: 12, children: jsx(Paper, { sx: {
+    return (jsx(Container, { maxWidth: maxWidth, sx: { my: 1, ...sx }, children: jsx(Grid, { container: true, spacing: 2, children: jsx(Grid, { size: 12, children: jsx(Paper, { sx: {
                         p: 2,
                         backdropFilter: "blur(3px)",
                         backgroundColor: setOpacity(theme.palette.background.paper, glass ? 0.1 : 1),

package/dist/esm/src/components/page-elements/PersonaliaSection.js

@@ -70,12 +70,18 @@ import { useTheme } from '@mui/material/styles';
 //
 function PartnerDialog({ partner, open, onClose, }) {
     const theme = useTheme();
-    return (jsx(Dialog, { open: open, onClose: onClose, "aria-labelledby": "dialog-title", children: jsx(Paper, { sx: { p: 2, height: "100%" }, children: jsxs(Grid, { container: true, spacing: 3, children: [jsxs(Grid, { item: true, xs: 12, sm: 7, children: [jsx(Typography, { variant: "h5", sx: {
+    return (jsx(Dialog, { open: open, onClose: onClose, "aria-labelledby": "dialog-title", children: jsx(Paper, { sx: { p: 2, height: "100%" }, children: jsxs(Grid, { container: true, spacing: 3, children: [jsxs(Grid, { size: {
+                            xs: 12,
+                            sm: 7
+                        }, children: [jsx(Typography, { variant: "h5", sx: {
                                     mb: 2,
                                     display: "flex",
                                     justifyContent: "flex-start",
                                     alignItems: "center",
-                                }, children: partner.name }), jsx(Typography, { variant: "body2", color: "text.secondary", sx: { mb: 2 }, children: partner.function })] }), jsx(Grid, { item: true, xs: 12, sm: 5, children: jsxs(Stack, { spacing: 2, sx: { overflow: "clip" }, justifyContent: "center", alignItems: "stretch", children: [partner.photo?.url && (jsx(StrapiImage, { id: partner.photo.id, url: partner.photo.url, alternativeText: partner.photo.alternativeText, width: 200, height: 200, style: {
+                                }, children: partner.name }), jsx(Typography, { variant: "body2", color: "text.secondary", sx: { mb: 2 }, children: partner.function })] }), jsx(Grid, { size: {
+                            xs: 12,
+                            sm: 5
+                        }, children: jsxs(Stack, { spacing: 2, sx: { overflow: "clip" }, justifyContent: "center", alignItems: "stretch", children: [partner.photo?.url && (jsx(StrapiImage, { id: partner.photo.id, url: partner.photo.url, alternativeText: partner.photo.alternativeText, width: 200, height: 200, style: {
                                         borderRadius: "50%",
                                         margin: "auto",
                                         ...partner.photo.style,
@@ -107,12 +113,21 @@ function Partner(partner, index) {
         partner?.text != null ? needsShortening(partner.text, maxLength) : false,
       [partner.text, maxLength]
     ); */
-    return (jsxs(Grid, { item: true, xs: 12, md: 6, children: [jsx(PartnerDialog, { partner: partner, open: open, onClose: handleClose }), jsx(Paper, { sx: { p: 2, height: "100%" }, children: jsxs(Grid, { container: true, spacing: 3, children: [jsxs(Grid, { item: true, xs: 12, sm: 7, children: [jsx(Typography, { variant: "h5", sx: {
+    return (jsxs(Grid, { size: {
+            xs: 12,
+            md: 6
+        }, children: [jsx(PartnerDialog, { partner: partner, open: open, onClose: handleClose }), jsx(Paper, { sx: { p: 2, height: "100%" }, children: jsxs(Grid, { container: true, spacing: 3, children: [jsxs(Grid, { size: {
+                                xs: 12,
+                                sm: 7
+                            }, children: [jsx(Typography, { variant: "h5", sx: {
                                         mb: 2,
                                         display: "flex",
                                         justifyContent: "flex-start",
                                         alignItems: "center",
-                                    }, children: partner.name }), jsx(Typography, { variant: "body2", color: "text.secondary", sx: { mb: 2 }, children: partner.function })] }), jsx(Grid, { item: true, xs: 12, sm: 5, children: jsxs(Stack, { spacing: 2, sx: { overflow: "clip" }, justifyContent: "center", alignItems: "stretch", children: [partner.photo?.url && (jsx(StrapiImage, { id: partner.photo.id, url: partner.photo.url, alternativeText: partner.photo.alternativeText, width: partner.photo.width || 200, height: partner.photo.height || 200, style: {
+                                    }, children: partner.name }), jsx(Typography, { variant: "body2", color: "text.secondary", sx: { mb: 2 }, children: partner.function })] }), jsx(Grid, { size: {
+                                xs: 12,
+                                sm: 5
+                            }, children: jsxs(Stack, { spacing: 2, sx: { overflow: "clip" }, justifyContent: "center", alignItems: "stretch", children: [partner.photo?.url && (jsx(StrapiImage, { id: partner.photo.id, url: partner.photo.url, alternativeText: partner.photo.alternativeText, width: partner.photo.width || 200, height: partner.photo.height || 200, style: {
                                             maxWidth: "100%",
                                             height: "auto",
                                             // borderRadius: "50%", TODO this style was removed because it's specific to AMH, should be added to photo.style

package/dist/esm/src/components/page-elements/PictureBarSection.js

@@ -18,7 +18,7 @@ import { setOpacity } from '../../lib/utils.js';
 function PictureBarSection({ data, }) {
     const { pictures, maxWidth = "lg", sx = {}, glass = false } = data;
     const theme = useTheme();
-    return (jsx(Container, { maxWidth: maxWidth, sx: { my: 1, ...sx }, children: jsx(Grid, { container: true, spacing: 2, children: jsx(Grid, { item: true, xs: 12, children: jsx(Paper, { sx: {
+    return (jsx(Container, { maxWidth: maxWidth, sx: { my: 1, ...sx }, children: jsx(Grid, { container: true, spacing: 2, children: jsx(Grid, { size: 12, children: jsx(Paper, { sx: {
                         p: 2,
                         backdropFilter: "blur(3px)",
                         backgroundColor: setOpacity(theme.palette.background.paper, glass ? 0.1 : 1),

package/dist/esm/src/components/page-elements/ProductBlock.js

@@ -16,7 +16,7 @@ import { setOpacity } from '../../lib/utils.js';
 function ProductBlock({ data }) {
     const { maxWidth = "lg", sx = {}, glass = false } = data;
     const theme = useTheme();
-    return (jsx(Container, { maxWidth: maxWidth, sx: { my: 1, ...sx }, children: jsx(Grid, { container: true, spacing: 2, children: jsx(Grid, { item: true, xs: 12, children: jsx(Paper, { sx: {
+    return (jsx(Container, { maxWidth: maxWidth, sx: { my: 1, ...sx }, children: jsx(Grid, { container: true, spacing: 2, children: jsx(Grid, { size: 12, children: jsx(Paper, { sx: {
                         p: 2,
                         backdropFilter: "blur(3px)",
                         backgroundColor: setOpacity(theme.palette.background.paper, glass ? 0.1 : 1),

package/dist/esm/src/components/page-elements/TextImageSection.js

@@ -73,7 +73,10 @@ function TextImageSection({ data }) {
     reading up upon mui-markdown docs is advised */
     /* TODO Replace with blocks */
     const theme = useTheme();
-    return (jsxs(Container, { maxWidth: maxWidth ? maxWidth : "lg", sx: { my: 1, ...sx }, id: anchor, children: [title && (jsx(Typography, { variant: "h1", textAlign: "center", sx: { pb: 2 }, children: title })), jsxs(Grid, { container: true, spacing: 2, direction: reverse ? "row-reverse" : "row", children: [jsx(Grid, { item: true, xs: 12, md: image?.url !== undefined ? 8 : 12, children: jsx(Paper, { sx: {
+    return (jsxs(Container, { maxWidth: maxWidth ? maxWidth : "lg", sx: { my: 1, ...sx }, id: anchor, children: [title && (jsx(Typography, { variant: "h1", textAlign: "center", sx: { pb: 2 }, children: title })), jsxs(Grid, { container: true, spacing: 2, direction: reverse ? "row-reverse" : "row", children: [jsx(Grid, { size: {
+                            xs: 12,
+                            md: image?.url !== undefined ? 8 : 12
+                        }, children: jsx(Paper, { sx: {
                                 p: 2,
                                 backdropFilter: "blur(3px)",
                                 backgroundColor: setOpacity(theme.palette.background.paper, glass ? 0.1 : 1),
@@ -84,7 +87,10 @@ function TextImageSection({ data }) {
                                     display: "flex",
                                     alignItems: "center",
                                     justifyContent: "flex-start",
-                                }, children: jsx(MuiMarkdown, { children: text }) })) }) }), image?.url !== undefined && (jsx(Grid, { item: true, xs: 12, md: 4, children: jsx(StickyImage, { image: image }) }))] })] }));
+                                }, children: jsx(MuiMarkdown, { children: text }) })) }) }), image?.url !== undefined && (jsx(Grid, { size: {
+                            xs: 12,
+                            md: 4
+                        }, children: jsx(StickyImage, { image: image }) }))] })] }));
 }
 
 export { TextImageSection };

package/dist/esm/src/components/public-information/PublicInformationForm.js

@@ -59,10 +59,20 @@ function PublicInformationForm({ publicInformation, sx, }) {
             // You cannot spread `sx` directly because `SxProps` (typeof sx) can be an array.
             { p: 2 },
             ...(Array.isArray(sx) ? sx : [sx]),
-        ], component: Paper, children: jsx("form", { action: formAction, children: jsxs(Grid, { container: true, spacing: 2, children: [jsx(Grid, { item: true, xs: 12, children: jsx(Typography, { variant: "h5", children: "Edit Public Information" }) }), jsx(Grid, { item: true, xs: 12, children: jsxs(Stack, { spacing: 2, children: [jsx(TextField, { id: "title", name: "title", label: "Title", defaultValue: title }), jsx(TextField, { id: "description", name: "description", label: "Description", defaultValue: description }), jsx(TextField, { id: "email", name: "email", label: "email", defaultValue: email }), jsx(TextField, { id: "phone_number", name: "phone_number", label: "phone_number", defaultValue: phone_number })] }) }), jsx(Grid, { item: true, xs: 12, lg: 6, children: jsxs(Stack, { spacing: 2, children: [jsx(Typography, { variant: "h6", children: "Company Address" }), jsx(Divider, {}), jsx(AddressFields, { componentName: "address", componentReference: "common.address", data: address })] }) }), jsx(Grid, { item: true, xs: 12, lg: 6, children: jsxs(Stack, { spacing: 2, children: [jsx(Typography, { variant: "h6", children: "Business Credentials" }), jsx(Divider, {}), jsx(BusinessCredentialsFields, { componentName: "business_credentials", componentReference: "business.credentials", data: business_credentials })] }) }), jsx(Grid, { item: true, xs: 12, sx: { mt: 1 }, children: jsx(Typography, { variant: "h6", children: "Socials" }) }), oldSocials.map((social, index) => {
+        ], component: Paper, children: jsx("form", { action: formAction, children: jsxs(Grid, { container: true, spacing: 2, children: [jsx(Grid, { size: 12, children: jsx(Typography, { variant: "h5", children: "Edit Public Information" }) }), jsx(Grid, { size: 12, children: jsxs(Stack, { spacing: 2, children: [jsx(TextField, { id: "title", name: "title", label: "Title", defaultValue: title }), jsx(TextField, { id: "description", name: "description", label: "Description", defaultValue: description }), jsx(TextField, { id: "email", name: "email", label: "email", defaultValue: email }), jsx(TextField, { id: "phone_number", name: "phone_number", label: "phone_number", defaultValue: phone_number })] }) }), jsx(Grid, { size: {
+                            xs: 12,
+                            lg: 6
+                        }, children: jsxs(Stack, { spacing: 2, children: [jsx(Typography, { variant: "h6", children: "Company Address" }), jsx(Divider, {}), jsx(AddressFields, { componentName: "address", componentReference: "common.address", data: address })] }) }), jsx(Grid, { size: {
+                            xs: 12,
+                            lg: 6
+                        }, children: jsxs(Stack, { spacing: 2, children: [jsx(Typography, { variant: "h6", children: "Business Credentials" }), jsx(Divider, {}), jsx(BusinessCredentialsFields, { componentName: "business_credentials", componentReference: "business.credentials", data: business_credentials })] }) }), jsx(Grid, { sx: { mt: 1 }, size: 12, children: jsx(Typography, { variant: "h6", children: "Socials" }) }), oldSocials.map((social, index) => {
                         if (social.data?.name) {
                             if (open.includes(social.data.name)) {
-                                return (jsx(Grid, { item: true, xs: 12, md: 6, lg: 4, children: jsx(SocialsFields, { data: social.data, componentName: `socials[${index}]`, componentReference: "common.social", deleteCallback: () => {
+                                return (jsx(Grid, { size: {
+                                        xs: 12,
+                                        md: 6,
+                                        lg: 4
+                                    }, children: jsx(SocialsFields, { data: social.data, componentName: `socials[${index}]`, componentReference: "common.social", deleteCallback: () => {
                                             setOldSocials(oldSocials.filter((_, i) => i !== index));
                                             /* setOpen(
                                               open.filter((openId) => openId !== social.data?.id)
@@ -70,12 +80,20 @@ function PublicInformationForm({ publicInformation, sx, }) {
                                         } }) }, index));
                             }
                             else {
-                                return (jsxs(Grid, { item: true, xs: 12, md: 6, lg: 4, children: [jsx("input", { type: "hidden", name: `socials[${index}].documentId`, value: social.data.documentId }), jsx("input", { type: "hidden", name: `socials[${index}].name`, value: social.data.name }), jsx("input", { type: "hidden", name: `socials[${index}].url`, value: social.data.url }), jsx("input", { type: "hidden", name: `socials[${index}].icon`, value: social.data.icon }), jsx(SocialsDisplay, { data: { ...social.data, onClick: onClickHandler } })] }, index));
+                                return (jsxs(Grid, { size: {
+                                        xs: 12,
+                                        md: 6,
+                                        lg: 4
+                                    }, children: [jsx("input", { type: "hidden", name: `socials[${index}].documentId`, value: social.data.documentId }), jsx("input", { type: "hidden", name: `socials[${index}].name`, value: social.data.name }), jsx("input", { type: "hidden", name: `socials[${index}].url`, value: social.data.url }), jsx("input", { type: "hidden", name: `socials[${index}].icon`, value: social.data.icon }), jsx(SocialsDisplay, { data: { ...social.data, onClick: onClickHandler } })] }, index));
                             }
                         }
                         return null;
                     }), newSocials.map((social, index) => {
-                        return (jsx(Grid, { item: true, xs: 12, md: 6, lg: 4, children: jsx(SocialsFields, { data: social.data, componentName: social.componentName, componentReference: "common.social", deleteCallback: () => {
+                        return (jsx(Grid, { size: {
+                                xs: 12,
+                                md: 6,
+                                lg: 4
+                            }, children: jsx(SocialsFields, { data: social.data, componentName: social.componentName, componentReference: "common.social", deleteCallback: () => {
                                     setNewSocials(newSocials
                                         .filter((_, i) => i !== index)
                                         .map((_, i) => {
@@ -85,7 +103,11 @@ function PublicInformationForm({ publicInformation, sx, }) {
                                         };
                                     }));
                                 } }) }, social.data?.uuid));
-                    }), jsx(Grid, { item: true, xs: 12, md: 6, lg: 4, justifyContent: "center", alignItems: "center", children: jsx(IconButton, { onClick: () => {
+                    }), jsx(Grid, { justifyContent: "center", alignItems: "center", size: {
+                            xs: 12,
+                            md: 6,
+                            lg: 4
+                        }, children: jsx(IconButton, { onClick: () => {
                                 setNewSocials([
                                     ...newSocials,
                                     {
@@ -98,7 +120,7 @@ function PublicInformationForm({ publicInformation, sx, }) {
                                         },
                                     },
                                 ]);
-                            }, children: jsx(AddIcon, {}) }) }), jsx(Grid, { item: true, xs: 12, children: jsxs(Stack, { direction: "row-reverse", spacing: 2, alignItems: "center", sx: {
+                            }, children: jsx(AddIcon, {}) }) }), jsx(Grid, { size: 12, children: jsxs(Stack, { direction: "row-reverse", spacing: 2, alignItems: "center", sx: {
                                 py: 1,
                             }, children: [jsx(SubmitButton, { text: "save changes", loadingText: "loading" }), formState?.strapiErrors && (jsx(StrapiErrors, { error: formState?.strapiErrors })), formState?.message && (jsx(Alert, { severity: "error", children: formState?.message }))] }) })] }) }) }));
 }

package/dist/esm/src/data/actions/auth-actions.js

@@ -54,7 +54,8 @@ async function registerUserAction(prevState, formData) {
                 : "Ops! Something went wrong. Please try again.",
         };
     }
-    cookies().set("jwt", responseData.jwt, config);
+    const cookieStore = await cookies();
+    cookieStore.set("jwt", responseData.jwt, config);
     if (!formData.get("redirect")) {
         return redirect("/dashboard");
     }
@@ -113,7 +114,8 @@ async function loginUserAction(prevState, formData) {
         };
     }
     // Set the JWT cookie and redirect the user
-    cookies().set("jwt", responseData.jwt, config);
+    const cookieStore = await cookies();
+    cookieStore.set("jwt", responseData.jwt, config);
     const redirectURL = formData.get("redirect")?.toString() ?? null;
     const successRedirectURL = `${redirectURL ? redirectURL : "/dashboard"}?login=success`;
     redirect(successRedirectURL);
@@ -204,7 +206,8 @@ async function resetPasswordAction(prevState, formData) {
     };
 }
 async function logoutAction() {
-    cookies().set("jwt", "", { ...config, maxAge: 0 });
+    const cookieStore = await cookies();
+    cookieStore.set("jwt", "", { ...config, maxAge: 0 });
     redirect("/");
 }
 

package/dist/esm/src/data/services/get-token.js

@@ -8,7 +8,7 @@
 import { cookies } from 'next/headers';
 
 async function getAuthToken() {
-    const cookieStore = cookies();
+    const cookieStore = await cookies();
     const token = cookieStore.get("jwt")?.value;
     return token ?? null;
 }