@popmenu/ordering-ui 0.125.4 → 0.125.6

package/build/index.es.js

@@ -1512,7 +1512,7 @@ var MenuItem = forwardRef(function (props, ref) {
             React__default.createElement(MenuItemInfo, null,
                 isFeatured && React__default.createElement(StatusTag, { color: "highlight", label: "Featured", variant: "filled", size: "sm" }),
                 React__default.createElement(Box, { display: "flex", gridGap: 8, alignItems: "center" },
-                    React__default.createElement(Typography$1, { component: "h3", className: classes.cardTitle },
+                    React__default.createElement(Typography$1, { component: "h2", className: classes.cardTitle },
                         loading ? React__default.createElement(Skeleton, null) : title,
                         isOutOfStock && (React__default.createElement("span", { className: classes.outOfStockTag },
                             React__default.createElement(StatusTag, { color: "warning", label: "Out of stock", variant: "outlined", size: "sm" }))))),
@@ -2172,8 +2172,8 @@ var MenuDropdown = function (props) {
     });
     return (React__default.createElement(FormControl, { hiddenLabel: true, classes: { root: classes.formControl } },
         React__default.createElement("label", { id: "menu-dropdown-label", className: "sr-only" }, props.label),
-        React__default.createElement(Select, { SelectDisplayProps: { 'aria-labelledby': 'menu-dropdown-label' }, value: selectedOptionId, onOpen: function () { return setOpen(true); }, onClose: function () { return setOpen(false); }, disableUnderline: true, onChange: function (event) { return onSelect(event.target.value); }, fullWidth: true, startAdornment: React__default.createElement(InputAdornment, { position: "start" },
-                React__default.createElement(Icon, { icon: SvgRestaurantMenu, size: isMobile ? 'extra-large' : 'large' })), IconComponent: function () { return (React__default.createElement(InputAdornment, { position: "end" },
+        React__default.createElement(Select, { SelectDisplayProps: { 'aria-labelledby': 'menu-dropdown-label' }, value: selectedOptionId, onOpen: function () { return setOpen(true); }, onClose: function () { return setOpen(false); }, disableUnderline: true, onChange: function (event) { return onSelect(event.target.value); }, fullWidth: true, open: open, startAdornment: React__default.createElement(InputAdornment, { position: "start", onClick: function () { return setOpen(true); } },
+                React__default.createElement(Icon, { icon: SvgRestaurantMenu, size: isMobile ? 'extra-large' : 'large' })), IconComponent: function () { return (React__default.createElement(InputAdornment, { position: "end", onClick: function () { return setOpen(true); } },
                 React__default.createElement(Icon, { color: "#0076CB", icon: open ? SvgChevronUp : SvgChevronDown, size: "large" }))); }, MenuProps: {
                 disablePortal: true,
                 anchorOrigin: {
@@ -2358,7 +2358,7 @@ var MenuSection = forwardRef(function (props, ref) {
     var classes = useStyles$3();
     return (React__default.createElement(Box, __assign$1({}, restProps, { ref: ref, component: 'section' }, { "data-component-type": "menu-section", style: { scrollMarginTop: '70px' } }),
         React__default.createElement(Box, { marginTop: 1, marginBottom: 4 },
-            React__default.createElement(Typography$1, { component: "h2", className: classes.title }, loading ? React__default.createElement(Skeleton, null) : name)),
+            React__default.createElement(Typography$1, { component: "h1", className: classes.title }, loading ? React__default.createElement(Skeleton, null) : name)),
         children));
 });
 MenuSection.displayName = 'MenuSection';
@@ -2400,7 +2400,7 @@ var DialogTitle = function (props) {
     return (React__default.createElement(DialogTitle$1, null,
         React__default.createElement(Box, { display: "flex", alignItems: "center", gridGap: 16 },
             Icon && Icon,
-            React__default.createElement(Typography$1, { component: "h1", style: { fontSize: '1.25rem', fontWeight: 500, lineHeight: 1.6 }, id: titleId }, title)),
+            React__default.createElement(Typography$1, { variant: "h1", id: titleId }, title)),
         onClose && (React__default.createElement(IconButton$1, { color: "inherit", className: classes.closeButton, "aria-label": "Close dialog", onClick: onClose },
             React__default.createElement(SvgX, null)))));
 };
@@ -2649,14 +2649,14 @@ var typography = {
     htmlFontSize: 16,
     fontFamily: fonts.join(', '),
     h1: {
-        fontWeight: 400,
-        fontSize: '1.25rem',
-        lineHeight: '1.875rem',
+        fontWeight: 500,
+        fontSize: '1.5rem',
+        lineHeight: '100%',
     },
     h2: {
-        fontWeight: 500,
-        fontSize: '1.125rem',
-        lineHeight: '1.6875rem',
+        fontWeight: 600,
+        fontSize: '1.25rem',
+        lineHeight: '100%',
     },
     h3: {
         fontWeight: 500,
@@ -2665,18 +2665,18 @@ var typography = {
     },
     h4: {
         fontWeight: 500,
-        fontSize: '1.125rem',
-        lineHeight: '1.6875rem',
+        fontSize: '1.25rem',
+        lineHeight: '1.875rem',
     },
     h5: {
         fontWeight: 500,
-        fontSize: '1.125rem',
-        lineHeight: '1.6875rem',
+        fontSize: '1.25rem',
+        lineHeight: '1.875rem',
     },
     h6: {
         fontWeight: 500,
-        fontSize: '1.125rem',
-        lineHeight: '1.6875rem',
+        fontSize: '1.25rem',
+        lineHeight: '1.875rem',
     },
     body1: {
         fontWeight: 400,

package/build/index.js

@@ -1549,7 +1549,7 @@ var MenuItem = React.forwardRef(function (props, ref) {
             React__default['default'].createElement(MenuItemInfo, null,
                 isFeatured && React__default['default'].createElement(StatusTag, { color: "highlight", label: "Featured", variant: "filled", size: "sm" }),
                 React__default['default'].createElement(core.Box, { display: "flex", gridGap: 8, alignItems: "center" },
-                    React__default['default'].createElement(core.Typography, { component: "h3", className: classes.cardTitle },
+                    React__default['default'].createElement(core.Typography, { component: "h2", className: classes.cardTitle },
                         loading ? React__default['default'].createElement(lab.Skeleton, null) : title,
                         isOutOfStock && (React__default['default'].createElement("span", { className: classes.outOfStockTag },
                             React__default['default'].createElement(StatusTag, { color: "warning", label: "Out of stock", variant: "outlined", size: "sm" }))))),
@@ -2209,8 +2209,8 @@ var MenuDropdown = function (props) {
     });
     return (React__default['default'].createElement(core.FormControl, { hiddenLabel: true, classes: { root: classes.formControl } },
         React__default['default'].createElement("label", { id: "menu-dropdown-label", className: "sr-only" }, props.label),
-        React__default['default'].createElement(core.Select, { SelectDisplayProps: { 'aria-labelledby': 'menu-dropdown-label' }, value: selectedOptionId, onOpen: function () { return setOpen(true); }, onClose: function () { return setOpen(false); }, disableUnderline: true, onChange: function (event) { return onSelect(event.target.value); }, fullWidth: true, startAdornment: React__default['default'].createElement(core.InputAdornment, { position: "start" },
-                React__default['default'].createElement(Icon, { icon: SvgRestaurantMenu, size: isMobile ? 'extra-large' : 'large' })), IconComponent: function () { return (React__default['default'].createElement(core.InputAdornment, { position: "end" },
+        React__default['default'].createElement(core.Select, { SelectDisplayProps: { 'aria-labelledby': 'menu-dropdown-label' }, value: selectedOptionId, onOpen: function () { return setOpen(true); }, onClose: function () { return setOpen(false); }, disableUnderline: true, onChange: function (event) { return onSelect(event.target.value); }, fullWidth: true, open: open, startAdornment: React__default['default'].createElement(core.InputAdornment, { position: "start", onClick: function () { return setOpen(true); } },
+                React__default['default'].createElement(Icon, { icon: SvgRestaurantMenu, size: isMobile ? 'extra-large' : 'large' })), IconComponent: function () { return (React__default['default'].createElement(core.InputAdornment, { position: "end", onClick: function () { return setOpen(true); } },
                 React__default['default'].createElement(Icon, { color: "#0076CB", icon: open ? SvgChevronUp : SvgChevronDown, size: "large" }))); }, MenuProps: {
                 disablePortal: true,
                 anchorOrigin: {
@@ -2395,7 +2395,7 @@ var MenuSection = React.forwardRef(function (props, ref) {
     var classes = useStyles$3();
     return (React__default['default'].createElement(core.Box, __assign$1({}, restProps, { ref: ref, component: 'section' }, { "data-component-type": "menu-section", style: { scrollMarginTop: '70px' } }),
         React__default['default'].createElement(core.Box, { marginTop: 1, marginBottom: 4 },
-            React__default['default'].createElement(core.Typography, { component: "h2", className: classes.title }, loading ? React__default['default'].createElement(lab.Skeleton, null) : name)),
+            React__default['default'].createElement(core.Typography, { component: "h1", className: classes.title }, loading ? React__default['default'].createElement(lab.Skeleton, null) : name)),
         children));
 });
 MenuSection.displayName = 'MenuSection';
@@ -2437,7 +2437,7 @@ var DialogTitle = function (props) {
     return (React__default['default'].createElement(core.DialogTitle, null,
         React__default['default'].createElement(core.Box, { display: "flex", alignItems: "center", gridGap: 16 },
             Icon && Icon,
-            React__default['default'].createElement(core.Typography, { component: "h1", style: { fontSize: '1.25rem', fontWeight: 500, lineHeight: 1.6 }, id: titleId }, title)),
+            React__default['default'].createElement(core.Typography, { variant: "h1", id: titleId }, title)),
         onClose && (React__default['default'].createElement(core.IconButton, { color: "inherit", className: classes.closeButton, "aria-label": "Close dialog", onClick: onClose },
             React__default['default'].createElement(SvgX, null)))));
 };
@@ -2686,14 +2686,14 @@ var typography = {
     htmlFontSize: 16,
     fontFamily: fonts.join(', '),
     h1: {
-        fontWeight: 400,
-        fontSize: '1.25rem',
-        lineHeight: '1.875rem',
+        fontWeight: 500,
+        fontSize: '1.5rem',
+        lineHeight: '100%',
     },
     h2: {
-        fontWeight: 500,
-        fontSize: '1.125rem',
-        lineHeight: '1.6875rem',
+        fontWeight: 600,
+        fontSize: '1.25rem',
+        lineHeight: '100%',
     },
     h3: {
         fontWeight: 500,
@@ -2702,18 +2702,18 @@ var typography = {
     },
     h4: {
         fontWeight: 500,
-        fontSize: '1.125rem',
-        lineHeight: '1.6875rem',
+        fontSize: '1.25rem',
+        lineHeight: '1.875rem',
     },
     h5: {
         fontWeight: 500,
-        fontSize: '1.125rem',
-        lineHeight: '1.6875rem',
+        fontSize: '1.25rem',
+        lineHeight: '1.875rem',
     },
     h6: {
         fontWeight: 500,
-        fontSize: '1.125rem',
-        lineHeight: '1.6875rem',
+        fontSize: '1.25rem',
+        lineHeight: '1.875rem',
     },
     body1: {
         fontWeight: 400,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@popmenu/ordering-ui",
-  "version": "0.125.4",
+  "version": "0.125.6",
   "license": "MIT",
   "author": "Popmenu Design System Team",
   "description": "React components specifically for the popmenu Online Ordering web app.",
@@ -32,5 +32,5 @@
     "acorn-jsx": "^5.3.2"
   },
   "sideEffects": false,
-  "gitHead": "a05120a23506ef5e31c491cec1200ece631e9762"
+  "gitHead": "426766c0f6bb92f8cb6914444f2317dc1c5bedc5"
 }