@popmenu/ordering-ui 0.113.0 → 0.113.2

package/build/components/MenuDropdown/MenuDropdownProps.d.ts

@@ -10,4 +10,6 @@ export interface MenuDropdownProps {
     menuOptions: MenuDropdownOption[];
     /** current menu select value */
     selectedOptionId: number | string;
+    /** label for the dropdown */
+    label: string;
 }

package/build/components/MenuSection/MenuSectionProps.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
-export interface MenuSectionProps {
+import { BoxProps } from '@material-ui/core';
+export interface MenuSectionProps extends BoxProps {
     /** when true, will render a skeleton in place of the section title */
     loading?: boolean;
     /** the name of a section, will render as the section's title */

package/build/index.es.js

@@ -1517,12 +1517,12 @@ StatusTag.defaultProps = {
 StatusTag.displayName = 'StatusTag';
 
 var MenuItem = forwardRef(function (props, ref) {
-    var onClick = props.onClick, id = props.id, description = props.description, isOutOfStock = props.isOutOfStock, title = props.title, loading = props.loading, isFeatured = props.isFeatured, image = props.image, likeCount = props.likeCount, reviewCount = props.reviewCount, price = props.price, available = props.available, itemTags = props.itemTags, className = props.className;
+    var onClick = props.onClick, id = props.id, description = props.description, isOutOfStock = props.isOutOfStock, title = props.title, loading = props.loading, isFeatured = props.isFeatured, image = props.image, likeCount = props.likeCount, reviewCount = props.reviewCount, price = props.price, available = props.available, itemTags = props.itemTags, className = props.className, restProps = __rest$1(props, ["onClick", "id", "description", "isOutOfStock", "title", "loading", "isFeatured", "image", "likeCount", "reviewCount", "price", "available", "itemTags", "className"]);
     var classes = useMenuItemStyles(props);
     var handleClick = function (event) {
         onClick(id, event);
     };
-    return (React__default.createElement(Card, { className: classNames(classes.card, className), ref: ref, elevation: 0, "data-component-type": "menu-item" },
+    return (React__default.createElement(Card, __assign$1({ className: classNames(classes.card, className), ref: ref, elevation: 0, "data-component-type": "menu-item" }, restProps),
         React__default.createElement(CardActionArea, { className: classes.cardActionArea, onClick: handleClick, disabled: loading },
             React__default.createElement(MenuItemInfo, null,
                 isFeatured && React__default.createElement(StatusTag, { color: "highlight", label: "Featured", variant: "filled", size: "sm" }),
@@ -1812,7 +1812,7 @@ var QuantityPicker = function (props) {
             onChange(event, { quantity: parseInt(event.target.value), reason: 'change' });
         }
     };
-    return (React__default.createElement(TextField, { classes: fieldClasses, type: "number", variant: variation === 'itemCount' ? 'filled' : 'standard', defaultValue: value, value: value, disabled: disabled, onChange: handleChange, InputProps: {
+    return (React__default.createElement(TextField, { classes: fieldClasses, type: "number", variant: variation === 'itemCount' ? 'filled' : 'standard', value: value, disabled: disabled, onChange: handleChange, InputProps: {
             classes: inputClasses,
             disableUnderline: true,
             endAdornment: (React__default.createElement(IconButton, { "aria-label": "plus one", className: endAdornmentClasses.root, color: "default", onClick: onIncrement, disabled: disabled || disableIncrement },
@@ -2049,6 +2049,10 @@ var useMenuDropdownStyles = makeStyles(function (theme) {
         },
         select: {
             '& .MuiSelect-root': (_b = {
+                    '&:focus': {
+                        outline: '2px solid #0076CB',
+                        borderRadius: 8,
+                    },
                     color: '#212121',
                     padding: theme.spacing(1, 0.5, 1, 0.5),
                     zIndex: 10
@@ -2075,7 +2079,7 @@ var MenuDropdown = function (props) {
         return breakpoints.down('md');
     });
     return (React__default.createElement(FormControl, { hiddenLabel: true, classes: { root: classes.formControl } },
-        React__default.createElement(Select, { open: open, value: selectedOptionId, id: "menu-dropdown-select", onClick: function () { return setOpen(!open); }, disableUnderline: true, onChange: function (event) { return onSelect(event.target.value); }, fullWidth: true, startAdornment: React__default.createElement(InputAdornment, { position: "start" },
+        React__default.createElement(Select, { open: open, value: selectedOptionId, id: "menu-dropdown-select", "aria-label": props.label, onClick: function () { return setOpen(!open); }, 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(Icon, { color: "#0076CB", icon: open ? SvgChevronUp : SvgChevronDown, size: "large" }))); }, MenuProps: {
                 disablePortal: true,
@@ -2511,10 +2515,12 @@ var overrides = {
     },
     MuiCssBaseline: {
         '@global': {
-            '*:focus-visible': {
-                outline: '2px solid #0076CB',
-                outlineOffset: '-4px',
-                borderRadius: 8,
+            '*:focus-visible, a:focus-visible': {
+                '&': {
+                    outline: '2px solid #0076CB',
+                    outlineOffset: '-4px',
+                    borderRadius: 8,
+                },
             },
         },
     },