@popmenu/ordering-ui 0.88.0 → 0.89.1

package/build/components/DialogTitle/DialogTitle.d.ts

@@ -2,7 +2,7 @@ import { ReactNode } from 'react';
 interface DialogTitleProps {
     title: string;
     Icon?: ReactNode;
-    onClose: () => void;
+    onClose?: () => void;
 }
 export declare const DialogTitle: (props: DialogTitleProps) => JSX.Element;
 export {};

package/build/index.es.js

@@ -1544,15 +1544,8 @@ var useDishModifierCardStyles = makeStyles(function (theme) { return ({
         color: theme.palette.error.main,
     },
     name: {
-        fontSize: '18px',
-        width: 'max-content',
-    },
-    nameContainer: {
-        display: 'flex',
-        alignItems: 'center',
-    },
-    statusTagContainer: {
-        margin: theme.spacing(0, 2),
+        fontSize: theme.spacing(2.25),
+        marginBottom: theme.spacing(2),
     },
 }); });
 var useRadioModifierFormStyles = makeStyles(function (theme) { return ({
@@ -1673,12 +1666,10 @@ var DishModifierCard = function (props) {
             break;
     }
     return (React__default.createElement(Box, { className: classes.root },
-        React__default.createElement(Box, { display: "flex", justifyContent: "space-between", width: "100%", alignItems: "center", height: "fit-content" },
-            React__default.createElement(Box, { className: classes.nameContainer },
-                React__default.createElement(Typography, { className: classes.name }, name),
-                React__default.createElement(Box, { className: classes.statusTagContainer },
-                    React__default.createElement(StatusTag, { variant: isRequired || isFullyOutOfStock ? 'outlined' : 'filled', label: label, color: color }))),
+        React__default.createElement(Box, { display: "flex", justifyContent: "space-between", width: "100%", alignItems: "center", height: "fit-content", marginBottom: 2 },
+            React__default.createElement(StatusTag, { variant: isRequired || isFullyOutOfStock ? 'outlined' : 'filled', label: label, color: color }),
             !isFullyOutOfStock && (React__default.createElement(Typography, { variant: "subtitle1", className: error ? classes.error : undefined }, helperText))),
+        React__default.createElement(Typography, { className: classes.name }, name),
         React__default.createElement(Box, null,
             React__default.createElement(FormControl, null,
                 React__default.createElement(ModifierOptionsControl, { type: type, modifiers: modifiers, value: value, onChange: onChange, disableNewSelections: disableNewSelections, isOutOfStock: isFullyOutOfStock })))));
@@ -2092,8 +2083,8 @@ var DialogTitle = function (props) {
         React__default.createElement(Box, { display: "flex", alignItems: "center", gridGap: 16 },
             Icon && Icon,
             React__default.createElement(Typography$1, { component: "h1", variant: "h6" }, title)),
-        React__default.createElement(IconButton$1, { color: "inherit", className: classes.closeButton, "aria-label": "Close dialog", onClick: onClose },
-            React__default.createElement(SvgX, null))));
+        onClose && (React__default.createElement(IconButton$1, { color: "inherit", className: classes.closeButton, "aria-label": "Close dialog", onClick: onClose },
+            React__default.createElement(SvgX, null)))));
 };
 
 var DialogSection = function (props) {