@popmenu/ordering-ui 0.85.1 → 0.86.0

package/build/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const Checkbox: import("react").ComponentType<Pick<import("@material-ui/core").CheckboxProps, "checked" | "color" | "translate" | "hidden" | "size" | "style" | "icon" | "disabled" | "indeterminate" | "checkedIcon" | "className" | "innerRef" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "tabIndex" | "title" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "ref" | "form" | "key" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "value" | "disableFocusRipple" | "edge" | "action" | "buttonRef" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "onFocusVisible" | "TouchRippleProps" | "inputProps" | "inputRef" | "readOnly" | "required" | "indeterminateIcon"> & import("@material-ui/core").StyledComponentProps<"checked" | "root">>;

package/build/components/Checkbox/index.d.ts

@@ -0,0 +1 @@
+export { Checkbox } from './Checkbox';

package/build/components/DishModifierCard/DishModifierCardProps.d.ts

@@ -6,6 +6,7 @@ declare type ModifierValue = {
 declare type Modifier = {
     id: number;
     name: string;
+    outOfStock: boolean;
     price?: string;
 };
 declare type OnChange = (value: Array<ModifierValue>, checked?: boolean) => void;

package/build/components/MenuItem/MenuItemProps.d.ts

@@ -28,4 +28,6 @@ export interface MenuItemProps {
     onClick: (id: string, event: React.MouseEvent<HTMLButtonElement>) => void;
     /** Whether or not the menu item is available for ordering */
     available: boolean;
+    /** Renders out of stock tag */
+    isOutOfStock?: Maybe<boolean>;
 }

package/build/components/Radio/Radio.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const Radio: import("react").ComponentType<Pick<import("@material-ui/core").RadioProps, "checked" | "color" | "translate" | "hidden" | "size" | "style" | "icon" | "disabled" | "checkedIcon" | "className" | "innerRef" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "tabIndex" | "title" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "ref" | "form" | "key" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "value" | "disableFocusRipple" | "edge" | "action" | "buttonRef" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "onFocusVisible" | "TouchRippleProps" | "inputProps" | "inputRef" | "readOnly" | "required"> & import("@material-ui/core").StyledComponentProps<"checked" | "root">>;

package/build/components/Radio/index.d.ts

@@ -0,0 +1 @@
+export { Radio } from './Radio';

package/build/components/StatusTag/StatusTagProps.d.ts

@@ -5,4 +5,6 @@ export interface StatusTagProps {
     label: string;
     /** Renders the color of the tag */
     color: 'default' | 'error' | 'warning';
+    /** Changes the padding sizes */
+    size?: 'md' | 'sm';
 }

package/build/components/Switch/Switch.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const Switch: import("react").ComponentType<Pick<import("@material-ui/core").SwitchProps, "checked" | "color" | "translate" | "hidden" | "size" | "style" | "icon" | "disabled" | "checkedIcon" | "className" | "innerRef" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "tabIndex" | "title" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "ref" | "form" | "key" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "type" | "value" | "disableFocusRipple" | "edge" | "action" | "buttonRef" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "onFocusVisible" | "TouchRippleProps" | "inputProps" | "inputRef" | "readOnly" | "required"> & import("@material-ui/core").StyledComponentProps<"checked" | "switchBase" | "thumb" | "track">>;

package/build/components/Switch/index.d.ts

@@ -0,0 +1 @@
+export { Switch } from './Switch';

package/build/components/index.d.ts

@@ -23,3 +23,6 @@ export { MenuItemGroup } from './MenuItemGroup';
 export { PageSection } from './PageSection';
 export { DialogTitle } from './DialogTitle';
 export { DialogSection } from './DialogSection';
+export { Switch } from './Switch';
+export { Checkbox } from './Checkbox';
+export { Radio } from './Radio';

package/build/index.es.js

@@ -1,4 +1,4 @@
-import { Button as Button$2, makeStyles as makeStyles$1, Box, Typography as Typography$1, Link as Link$1, Paper as Paper$1, Avatar as Avatar$1, Card, CardActionArea, FormControl, Select, InputAdornment, MenuItem as MenuItem$1, FormControlLabel as FormControlLabel$1, Checkbox as Checkbox$1, Radio as Radio$1, Menu, TextField, Tabs, Chip, DialogTitle as DialogTitle$1, IconButton as IconButton$1 } from '@material-ui/core';
+import { Button as Button$2, makeStyles as makeStyles$1, Box, Typography as Typography$1, Link as Link$1, Paper as Paper$1, Avatar as Avatar$1, Card, CardActionArea, FormControl, Select, InputAdornment, MenuItem as MenuItem$1, FormControlLabel as FormControlLabel$1, Checkbox as Checkbox$2, Radio as Radio$2, Menu, TextField, Tabs, Chip, DialogTitle as DialogTitle$1, IconButton as IconButton$1, withStyles, Switch as Switch$2 } from '@material-ui/core';
 export * from '@material-ui/core';
 import * as React from 'react';
 import React__default, { forwardRef, createElement, createContext, useContext, useState } from 'react';
@@ -765,12 +765,12 @@ var Button = forwardRef(function (props, ref) {
 });
 Button.displayName = 'Button';
 
-var Checkbox = forwardRef(function (props, ref) {
+var Checkbox$1 = forwardRef(function (props, ref) {
     var label = props.label, disabled = props.disabled, LabelProps = props.LabelProps, muiProps = __rest(props, ["label", "disabled", "LabelProps"]);
     var control = React__default.createElement(MuiCheckbox, __assign({ disabled: label ? undefined : disabled }, muiProps));
     return label ? (React__default.createElement(FormControlLabel, __assign({ disabled: disabled, inputRef: ref, control: control, label: label }, LabelProps))) : (control);
 });
-Checkbox.displayName = 'Checkbox';
+Checkbox$1.displayName = 'Checkbox';
 
 var getBackground = function (theme) { return function (props) {
     var variant = props.variant, severity = props.severity;
@@ -1040,12 +1040,12 @@ Paper.defaultProps = {
     legacyStyles: false,
 };
 
-var Radio = forwardRef(function (props, ref) {
+var Radio$1 = forwardRef(function (props, ref) {
     var label = props.label, disabled = props.disabled, LabelProps = props.LabelProps, muiProps = __rest(props, ["label", "disabled", "LabelProps"]);
     var control = React__default.createElement(MuiRadio, __assign({ disabled: label ? undefined : disabled }, muiProps));
     return label ? (React__default.createElement(FormControlLabel, __assign({ disabled: disabled, inputRef: ref, control: control, label: label }, LabelProps))) : (control);
 });
-Radio.displayName = 'Radio';
+Radio$1.displayName = 'Radio';
 
 makeStyles(function () { return ({
     textfield: {
@@ -1085,13 +1085,13 @@ var useSwitchStyles = makeStyles(function (theme) { return ({
     track: {},
 }); });
 
-var Switch = forwardRef(function (props, ref) {
+var Switch$1 = forwardRef(function (props, ref) {
     var label = props.label, disabled = props.disabled, LabelProps = props.LabelProps, muiProps = __rest(props, ["label", "disabled", "LabelProps"]);
     var classes = useSwitchStyles(props);
     var control = React__default.createElement(MuiSwitch, __assign({ classes: classes, disabled: label ? undefined : disabled }, muiProps));
     return label ? (React__default.createElement(FormControlLabel, __assign({ disabled: disabled, inputRef: ref, control: control, label: label }, LabelProps))) : (control);
 });
-Switch.displayName = 'Switch';
+Switch$1.displayName = 'Switch';
 
 var useToggleButtonStyles = makeStyles(function (theme) { return ({
     root: {
@@ -1265,8 +1265,112 @@ var MenuItemTags = function (props) {
     return (React__default.createElement(ItemTagGroup, null, itemTags === null || itemTags === void 0 ? void 0 : itemTags.slice(0, 5).map(function (itemTag) { return (React__default.createElement(ItemTag, { key: itemTag.name, alt: itemTag.name, color: itemTag.color }, itemTag.abbr)); })));
 };
 
+var useStatusTagStyles = makeStyles(function (theme) { return ({
+    root: {
+        borderRadius: '5px',
+        display: 'flex',
+        padding: theme.spacing(1),
+        alignItems: 'center',
+        justifyContent: 'center',
+        width: 'fit-content',
+    },
+    filled: {
+        backgroundColor: theme.palette.grey[100],
+        color: theme.palette.grey[900],
+    },
+    outlined: {
+        border: "1px solid var(--surfaces-card-stroke, " + theme.palette.grey[900] + ")",
+    },
+    small: {
+        padding: theme.spacing(0.25, 0.75),
+    },
+    default: {
+        color: theme.palette.grey[900],
+    },
+    warning: {
+        borderColor: theme.palette.warning.dark,
+        color: theme.palette.warning.dark,
+    },
+    error: {
+        borderColor: theme.palette.error.main,
+        color: theme.palette.error.main,
+    },
+}); });
+
+var classnames = {exports: {}};
+
+/*!
+  Copyright (c) 2018 Jed Watson.
+  Licensed under the MIT License (MIT), see
+  http://jedwatson.github.io/classnames
+*/
+
+(function (module) {
+/* global define */
+
+(function () {
+
+	var hasOwn = {}.hasOwnProperty;
+
+	function classNames() {
+		var classes = [];
+
+		for (var i = 0; i < arguments.length; i++) {
+			var arg = arguments[i];
+			if (!arg) continue;
+
+			var argType = typeof arg;
+
+			if (argType === 'string' || argType === 'number') {
+				classes.push(arg);
+			} else if (Array.isArray(arg)) {
+				if (arg.length) {
+					var inner = classNames.apply(null, arg);
+					if (inner) {
+						classes.push(inner);
+					}
+				}
+			} else if (argType === 'object') {
+				if (arg.toString === Object.prototype.toString) {
+					for (var key in arg) {
+						if (hasOwn.call(arg, key) && arg[key]) {
+							classes.push(key);
+						}
+					}
+				} else {
+					classes.push(arg.toString());
+				}
+			}
+		}
+
+		return classes.join(' ');
+	}
+
+	if (module.exports) {
+		classNames.default = classNames;
+		module.exports = classNames;
+	} else {
+		window.classNames = classNames;
+	}
+}());
+}(classnames));
+
+var classNames = classnames.exports;
+
+var StatusTag = function (props) {
+    var variant = props.variant, label = props.label, _a = props.size, size = _a === void 0 ? 'md' : _a, _b = props.color, color = _b === void 0 ? 'default' : _b;
+    var classes = useStatusTagStyles(props);
+    return (React__default.createElement(Box, { className: classNames([classes.root, classes[color], classes[variant], size === 'sm' ? classes.small : '']) },
+        React__default.createElement(Typography, { variant: "caption" }, label)));
+};
+StatusTag.defaultProps = {
+    color: 'default',
+    error: false,
+};
+StatusTag.displayName = 'StatusTag';
+
 var MenuItem = forwardRef(function (props, ref) {
-    var onClick = props.onClick, id = props.id, title = props.title, description = props.description;
+    var onClick = props.onClick, id = props.id, title = props.title, description = props.description, isOutOfStock = props.isOutOfStock;
     var classes = useDishCardStyles(props);
     var handleClick = function (event) {
         onClick(id, event);
@@ -1274,7 +1378,9 @@ var MenuItem = forwardRef(function (props, ref) {
     return (React__default.createElement(Card, { className: classes.card, ref: ref, elevation: 0, "data-component-type": "menu-item" },
         React__default.createElement(CardActionArea, { className: classes.cardActionArea, onClick: handleClick },
             React__default.createElement(MenuItemInfo, null,
-                React__default.createElement(Typography$1, { className: classes.cardTitle }, title),
+                React__default.createElement(Box, { display: "flex", gridGap: 8, alignItems: "center" },
+                    React__default.createElement(Typography$1, { className: classes.cardTitle }, title),
+                    isOutOfStock && React__default.createElement(StatusTag, { color: "warning", label: "Out of stock", variant: "outlined", size: "sm" })),
                 React__default.createElement(Typography$1, { className: classes.cardDescription, paragraph: true }, description),
                 React__default.createElement(MenuItemReactions, { likeCount: props.likeCount, reviewCount: props.reviewCount }),
                 React__default.createElement(Box, { display: "flex", justifyContent: "space-between", alignItems: "end", flexGrow: 1 },
@@ -1467,117 +1573,21 @@ var useLabelStyles = makeStyles(function (theme) { return ({
     label: {
         margin: theme.spacing(0.5, 0),
     },
-    price: {
-        color: theme.palette.grey[700],
-    },
-}); });
-
-var useStatusTagStyles = makeStyles(function (theme) { return ({
-    root: {
-        borderRadius: '5px',
-        display: 'flex',
-        padding: theme.spacing(1),
-        alignItems: 'center',
-        justifyContent: 'center',
-        width: 'fit-content',
-    },
-    filled: {
-        backgroundColor: theme.palette.grey[100],
-        color: theme.palette.grey[900],
-    },
-    outlined: {
-        border: "1px solid var(--surfaces-card-stroke, " + theme.palette.grey[900] + ")",
-    },
-    default: {
-        color: theme.palette.grey[900],
-    },
-    warning: {
-        borderColor: theme.palette.warning.dark,
+    outOfStock: {
         color: theme.palette.warning.dark,
     },
-    error: {
-        borderColor: theme.palette.error.main,
-        color: theme.palette.error.main,
+    price: {
+        color: theme.palette.grey[700],
     },
 }); });
 
-var classnames = {exports: {}};
-
-/*!
-  Copyright (c) 2018 Jed Watson.
-  Licensed under the MIT License (MIT), see
-  http://jedwatson.github.io/classnames
-*/
-
-(function (module) {
-/* global define */
-
-(function () {
-
-	var hasOwn = {}.hasOwnProperty;
-
-	function classNames() {
-		var classes = [];
-
-		for (var i = 0; i < arguments.length; i++) {
-			var arg = arguments[i];
-			if (!arg) continue;
-
-			var argType = typeof arg;
-
-			if (argType === 'string' || argType === 'number') {
-				classes.push(arg);
-			} else if (Array.isArray(arg)) {
-				if (arg.length) {
-					var inner = classNames.apply(null, arg);
-					if (inner) {
-						classes.push(inner);
-					}
-				}
-			} else if (argType === 'object') {
-				if (arg.toString === Object.prototype.toString) {
-					for (var key in arg) {
-						if (hasOwn.call(arg, key) && arg[key]) {
-							classes.push(key);
-						}
-					}
-				} else {
-					classes.push(arg.toString());
-				}
-			}
-		}
-
-		return classes.join(' ');
-	}
-
-	if (module.exports) {
-		classNames.default = classNames;
-		module.exports = classNames;
-	} else {
-		window.classNames = classNames;
-	}
-}());
-}(classnames));
-
-var classNames = classnames.exports;
-
-var StatusTag = function (props) {
-    var variant = props.variant, label = props.label, _a = props.color, color = _a === void 0 ? 'default' : _a;
-    var classes = useStatusTagStyles(props);
-    return (React__default.createElement(Box, { className: classNames([classes.root, classes[color], classes[variant]]) },
-        React__default.createElement(Typography, { variant: "caption" }, label)));
-};
-StatusTag.defaultProps = {
-    color: 'default',
-    error: false,
-};
-StatusTag.displayName = 'StatusTag';
-
 var Label = function (props) {
-    var name = props.name, price = props.price, disabled = props.disabled;
+    var name = props.name, price = props.price, disabled = props.disabled, isOutOfStock = props.isOutOfStock;
     var classes = useLabelStyles();
     return (React__default.createElement(Box, { display: "flex", flexDirection: "column", className: classes.label },
-        React__default.createElement(Typography$1, null, name),
+        React__default.createElement(Box, { display: "flex", alignItems: "center", gridGap: 8 },
+            React__default.createElement(Typography$1, null, name),
+            !isOutOfStock && disabled && (React__default.createElement(Typography$1, { variant: "caption", className: classes.outOfStock }, "Out of stock"))),
         price && React__default.createElement(Typography$1, { className: !disabled ? classes.price : '' },
             "+ ",
             price)));
@@ -1599,9 +1609,9 @@ var CheckboxGroup = function (props) {
     };
     return (React__default.createElement(Box, { display: "flex", flexDirection: "column" }, modifiers.map(function (modifier, index) {
         var targetValue = value === null || value === void 0 ? void 0 : value.find(function (v) { return v.id == modifier.id; });
-        return (React__default.createElement(FormControlLabel$1, { key: index, value: modifier.id, control: React__default.createElement(Checkbox$1, { className: classes.radio, disabled: (!targetValue && disableNewSelections) || isOutOfStock }), label: React__default.createElement(Label, { name: modifier.name, price: modifier.price
+        return (React__default.createElement(FormControlLabel$1, { key: index, value: modifier.id, control: React__default.createElement(Checkbox$2, { className: classes.radio, disabled: (!targetValue && disableNewSelections) || isOutOfStock || modifier.outOfStock }), label: React__default.createElement(Label, { name: modifier.name, price: modifier.price
                     ? "" + (appContext && appContext.currencySymbol) + Number(modifier.price).toFixed(2)
-                    : null, disabled: isOutOfStock }), className: classes.root, checked: !!targetValue, onChange: handleChange }));
+                    : null, disabled: isOutOfStock || modifier.outOfStock, isOutOfStock: isOutOfStock }), className: classes.root, checked: !!targetValue, onChange: handleChange }));
     })));
 };
 var RadioGroup = function (props) {
@@ -1619,7 +1629,7 @@ var RadioGroup = function (props) {
             },
         ]);
     };
-    return (React__default.createElement(MuiRadioGroup, { name: "selectedModifiers", value: value ? value[0].id : '', onChange: handleChange }, modifiers.map(function (modifier, index) { return (React__default.createElement(FormControlLabel$1, { key: index, value: modifier.id, control: React__default.createElement(Radio$1, { className: classes.radio, disabled: isOutOfStock }), label: React__default.createElement(Label, { name: modifier.name, price: modifier.price ? "" + (appContext && appContext.currencySymbol) + Number(modifier.price).toFixed(2) : null, disabled: isOutOfStock }) })); })));
+    return (React__default.createElement(MuiRadioGroup, { name: "selectedModifiers", value: value ? value[0].id : '', onChange: handleChange }, modifiers.map(function (modifier, index) { return (React__default.createElement(FormControlLabel$1, { key: index, value: modifier.id, control: React__default.createElement(Radio$2, { className: classes.radio, disabled: isOutOfStock || modifier.outOfStock }), label: React__default.createElement(Label, { name: modifier.name, price: modifier.price ? "" + (appContext && appContext.currencySymbol) + Number(modifier.price).toFixed(2) : null, disabled: isOutOfStock || modifier.outOfStock, isOutOfStock: isOutOfStock }) })); })));
 };
 
 var ModifierOptionsControl = function (props) {
@@ -1637,17 +1647,18 @@ var ModifierOptionsControl = function (props) {
 var DishModifierCard = function (props) {
     var name = props.name, disableNewSelections = props.disableNewSelections, modifiers = props.modifiers, value = props.value, messages = props.messages, onChange = props.onChange, type = props.type, error = props.error, isRequired = props.isRequired, isOutOfStock = props.isOutOfStock;
     var optionalText = messages.optionalText, outOfStockText = messages.outOfStockText, requiredText = messages.requiredText, helperText = messages.helperText;
+    var isFullyOutOfStock = isOutOfStock || !modifiers.some(function (modifier) { return !modifier.outOfStock; });
     var classes = useDishModifierCardStyles();
     var color = 'default';
     switch (true) {
         case error:
             color = 'error';
-        case isOutOfStock:
+        case isFullyOutOfStock:
             color = 'warning';
     }
     var label = optionalText;
     switch (true) {
-        case isOutOfStock:
+        case isFullyOutOfStock:
             label = outOfStockText;
             break;
         case isRequired:
@@ -1659,11 +1670,11 @@ var DishModifierCard = function (props) {
             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 || isOutOfStock ? 'outlined' : 'filled', label: label, color: color }))),
-            React__default.createElement(Typography, { variant: "subtitle1", className: error ? classes.error : undefined }, helperText)),
+                    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(Box, null,
             React__default.createElement(FormControl, null,
-                React__default.createElement(ModifierOptionsControl, { type: type, modifiers: modifiers, value: value, onChange: onChange, disableNewSelections: disableNewSelections, isOutOfStock: isOutOfStock })))));
+                React__default.createElement(ModifierOptionsControl, { type: type, modifiers: modifiers, value: value, onChange: onChange, disableNewSelections: disableNewSelections, isOutOfStock: isFullyOutOfStock })))));
 };
 DishModifierCard.displayName = 'DishModifierCard';
 
@@ -2081,6 +2092,50 @@ var DialogSection = function (props) {
     return (React__default.createElement(Box, { paddingTop: 4, paddingBottom: props.borderBottom ? 4 : 0, paddingX: props.edgeToEdge ? 0 : 2, borderBottom: props.borderBottom ? '1px solid #E0E0E0' : undefined }, props.children));
 };
 
+var Switch = withStyles(function (_a) {
+    var palette = _a.palette;
+    return ({
+        checked: {
+            '& $thumb': {
+                backgroundColor: palette.success.main,
+            },
+            '&& + $track': {
+                backgroundColor: palette.success.main,
+                opacity: 0.5,
+            },
+        },
+        switchBase: {
+            color: palette.grey[300],
+        },
+        thumb: {},
+        track: {},
+    });
+})(Switch$2);
+
+var Checkbox = withStyles(function (_a) {
+    var palette = _a.palette;
+    return ({
+        checked: {},
+        root: {
+            '&$checked': {
+                color: palette.info.main,
+            },
+        },
+    });
+})(Checkbox$2);
+
+var Radio = withStyles(function (_a) {
+    var palette = _a.palette;
+    return ({
+        checked: {},
+        root: {
+            '&$checked': {
+                color: palette.info.main,
+            },
+        },
+    });
+})(Radio$2);
+
 var palette = {
     primary: {
         light: '#7B7FA3',
@@ -2242,5 +2297,5 @@ var orderingTheme = {
     props: props,
 };
 
-export { Button$1 as Button, DialogSection, DialogTitle, DishCheckoutCard, DishDetailsReview, DishModifierCard, ItemTag, ItemTagGroup, LocationCard, MenuDropdown, MenuFilter, MenuItem, MenuItemGroup, MenuSection, MenuSectionGroup, OrderingAppContext, OrderingAppContextProvider, PageSection, QuantityPicker, ReactionCounter, ReactionCounterGroup, SelectableChip, SelectableChipGroup, SelectedMenuFiltersList, StatusTag, orderingTheme, useOrderingAppContext };
+export { Button$1 as Button, Checkbox, DialogSection, DialogTitle, DishCheckoutCard, DishDetailsReview, DishModifierCard, ItemTag, ItemTagGroup, LocationCard, MenuDropdown, MenuFilter, MenuItem, MenuItemGroup, MenuSection, MenuSectionGroup, OrderingAppContext, OrderingAppContextProvider, PageSection, QuantityPicker, Radio, ReactionCounter, ReactionCounterGroup, SelectableChip, SelectableChipGroup, SelectedMenuFiltersList, StatusTag, Switch, orderingTheme, useOrderingAppContext };
 //# sourceMappingURL=index.es.js.map