@popmenu/ordering-ui 0.83.0 → 0.84.0

package/build/components/DishCheckoutCard/DishCheckoutCardProps.d.ts

@@ -1,14 +1,16 @@
 export interface DishCheckoutCardProps {
     /** Modifiers of the dish in tuple format */
-    modifiers?: Array<[string | number, string | number]>;
+    modifiers?: [string, string][];
     /** Id of the dish */
     id: number;
+    /** disables all interactive elements in the card, like "edit" or "delete" */
+    disabled?: boolean;
     /** Name of the dish */
     name: string;
     /** Quantity of dish selected */
     quantity: number;
     /** Price of description should be formatted in the correct currency before passing as a prop */
-    price: string;
+    price: number | string;
     /** Callback for edit button */
     onEdit: () => void;
     /** Callback for delete button */
@@ -16,5 +18,5 @@ export interface DishCheckoutCardProps {
     /** Callback that runs when the select value is changed. Expects two arguments, the id of the selected dish and the new value that is being changed from the dropdown. Callback should update the dish */
     onChange: (id: number, value: number | string) => void;
     /** Special instructions text */
-    specialInstructions?: string | undefined;
+    specialInstructions?: string | null;
 }

package/build/components/OrderingAppContext/OrderingAppContext.d.ts

@@ -1,13 +1,14 @@
-import React from 'react';
-declare type OrderingAppContextState = {
+import React, { PropsWithChildren } from 'react';
+declare type OrderingAppContextValue = {
     currencySymbol?: string;
     basePath: string;
     restaurantId: number;
-} | null;
-declare type OrderingAppContextType = [OrderingAppContextState, React.Dispatch<React.SetStateAction<OrderingAppContextState>>];
+};
+declare type OrderingAppContextType = [OrderingAppContextValue, React.Dispatch<React.SetStateAction<OrderingAppContextValue>>];
 export declare const OrderingAppContext: React.Context<OrderingAppContextType | null>;
 export declare const useOrderingAppContext: () => OrderingAppContextType;
-export declare const OrderingAppContextProvider: (props: {
-    children: React.ReactNode;
-}) => JSX.Element;
+declare type OrderingAppContextProviderProps = PropsWithChildren<{
+    defaultContext: OrderingAppContextValue;
+}>;
+export declare const OrderingAppContextProvider: (props: OrderingAppContextProviderProps) => JSX.Element;
 export {};

package/build/components/PageSection/PageSection.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export declare const PageSection: (props: {
+    children: React.ReactNode;
+}) => JSX.Element;

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

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

package/build/components/index.d.ts

@@ -20,3 +20,4 @@ export { SelectedMenuFiltersList, SelectedMenuFiltersListProps } from './Selecte
 export { MenuSectionGroup } from './MenuSectionGroup';
 export { MenuSection, MenuSectionProps } from './MenuSection';
 export { MenuItemGroup } from './MenuItemGroup';
+export { PageSection } from './PageSection';

package/build/index.es.js

@@ -1,7 +1,7 @@
 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 } from '@material-ui/core';
 export * from '@material-ui/core';
 import * as React from 'react';
-import React__default, { forwardRef, createElement, useState, createContext, useContext } from 'react';
+import React__default, { forwardRef, createElement, createContext, useContext, useState } from 'react';
 import { makeStyles, useTheme, lighten } from '@material-ui/core/styles';
 import '@material-ui/lab/Alert';
 import '@material-ui/core/AppBar';
@@ -1245,8 +1245,7 @@ var useDishCheckoutCardStyles = makeStyles(function (theme) { return ({
         gridGap: theme.spacing(2),
         border: '1px',
     },
-    deleteIcon: {
-        height: theme.spacing(2.5),
+    deleteButton: {
         color: theme.palette.info.main,
     },
     editButton: {
@@ -1283,10 +1282,26 @@ var useDishCheckoutCardStyles = makeStyles(function (theme) { return ({
     },
 }); });
 
+var OrderingAppContext = createContext(null);
+var useOrderingAppContext = function () {
+    var context = useContext(OrderingAppContext);
+    if (!context) {
+        throw new Error('useOrderingAppContext has to be used within <OrderingAppContext.Provider>');
+    }
+    return context;
+};
+var OrderingAppContextProvider = function (props) {
+    var context = useState(props.defaultContext);
+    return React__default.createElement(OrderingAppContext.Provider, { value: context }, props.children);
+};
+
 var DishCheckoutCard = function (props) {
-    var id = props.id, name = props.name, quantity = props.quantity, modifiers = props.modifiers, onDelete = props.onDelete, onEdit = props.onEdit, onChange = props.onChange, price = props.price, specialInstructions = props.specialInstructions;
+    var _a;
+    var id = props.id, name = props.name, quantity = props.quantity, modifiers = props.modifiers, onDelete = props.onDelete, onEdit = props.onEdit, onChange = props.onChange, price = props.price, specialInstructions = props.specialInstructions, disabled = props.disabled;
     var classes = useDishCheckoutCardStyles(props);
-    var _a = useState(false), open = _a[0], setOpen = _a[1];
+    var appContext = useOrderingAppContext()[0];
+    var _b = useState(false), open = _b[0], setOpen = _b[1];
+    var formattedPrice = typeof price === 'number' ? "" + ((_a = appContext.currencySymbol) !== null && _a !== void 0 ? _a : '') + price.toFixed(2) : price;
     return (React__default.createElement(Box, { className: classes.root },
         React__default.createElement(Box, { display: "flex", justifyContent: "space-between", gridGap: 3 },
             React__default.createElement(Box, null,
@@ -1300,13 +1315,13 @@ var DishCheckoutCard = function (props) {
                     "\"",
                     specialInstructions,
                     "\"")),
-            React__default.createElement(Box, { display: "flex", gridGap: 1, height: "100%" },
-                React__default.createElement(Button$1, { className: classes.editButton, variant: "text", onClick: onEdit }, "Edit"),
-                React__default.createElement(IconButton, { onClick: onDelete },
-                    React__default.createElement(Icon, { icon: SvgTrash, className: classes.deleteIcon })))),
+            React__default.createElement(Box, { display: "flex", gridGap: 1, height: "100%", alignItems: "center" },
+                React__default.createElement(Button$1, { disabled: disabled, className: classes.editButton, variant: "text", onClick: onEdit }, "Edit"),
+                React__default.createElement(IconButton, { disabled: disabled, onClick: onDelete, classes: { root: classes.deleteButton } },
+                    React__default.createElement(Icon, { icon: SvgTrash, size: "large" })))),
         React__default.createElement(Box, { display: "flex", gridGap: 16, alignItems: "center" },
             React__default.createElement(FormControl, { variant: "outlined", hiddenLabel: true },
-                React__default.createElement(Select, { open: open, value: quantity, labelId: "select-label-" + id, onClick: function () { return setOpen(!open); }, disableUnderline: true, onChange: function (event) { return onChange(id, event.target.value); }, fullWidth: true, startAdornment: React__default.createElement(InputAdornment, { position: "start" },
+                React__default.createElement(Select, { disabled: disabled, open: open, value: quantity, labelId: "select-label-" + id, onClick: function () { return setOpen(!open); }, disableUnderline: true, onChange: function (event) { return onChange(id, event.target.value); }, fullWidth: true, startAdornment: React__default.createElement(InputAdornment, { position: "start" },
                         React__default.createElement(Icon, { icon: open ? SvgChevronUp : SvgChevronDown, size: "large" })), inputProps: { shrink: false }, MenuProps: {
                         disablePortal: true,
                         anchorOrigin: {
@@ -1320,7 +1335,7 @@ var DishCheckoutCard = function (props) {
                         getContentAnchorEl: null,
                         classes: { paper: classes.selectPaper },
                     }, className: classes.select }, Array.from({ length: 99 }, function (_, index) { return (React__default.createElement(MenuItem$1, { key: index + 1, value: index + 1 }, index + 1)); }))),
-            React__default.createElement(Typography, { className: classes.price }, price))));
+            React__default.createElement(Typography, { className: classes.price }, formattedPrice))));
 };
 
 var DishDetailsReview = forwardRef(function (props) {
@@ -1499,19 +1514,6 @@ StatusTag.defaultProps = {
 };
 StatusTag.displayName = 'StatusTag';
 
-var OrderingAppContext = createContext(null);
-var useOrderingAppContext = function () {
-    var context = useContext(OrderingAppContext);
-    if (!context) {
-        throw new Error('useOrderingAppContext has to be used within <OrderingAppContext.Provider>');
-    }
-    return context;
-};
-var OrderingAppContextProvider = function (props) {
-    var context = useState(null);
-    return React__default.createElement(OrderingAppContext.Provider, { value: context }, props.children);
-};
-
 var Label = function (props) {
     var name = props.name, price = props.price;
     return (React__default.createElement(Box, { display: "flex", flexDirection: "column" },
@@ -1974,6 +1976,8 @@ var MenuItemGroup = forwardRef(function (props, ref) {
 });
 MenuItemGroup.displayName = 'MenuItemGroup';
 
+var PageSection = function (props) { return (React__default.createElement(Box, { p: 4, borderBottom: "1px solid #E0E0E0" }, props.children)); };
+
 var palette = {
     primary: {
         light: '#7B7FA3',
@@ -2088,5 +2092,5 @@ var orderingTheme = {
     props: props,
 };
 
-export { Button$1 as Button, DishCheckoutCard, DishDetailsReview, DishModifierCard, ItemTag, ItemTagGroup, LocationCard, MenuDropdown, MenuFilter, MenuItem, MenuItemGroup, MenuSection, MenuSectionGroup, OrderingAppContext, OrderingAppContextProvider, QuantityPicker, ReactionCounter, ReactionCounterGroup, SelectableChip, SelectableChipGroup, SelectedMenuFiltersList, StatusTag, orderingTheme, useOrderingAppContext };
+export { Button$1 as Button, DishCheckoutCard, DishDetailsReview, DishModifierCard, ItemTag, ItemTagGroup, LocationCard, MenuDropdown, MenuFilter, MenuItem, MenuItemGroup, MenuSection, MenuSectionGroup, OrderingAppContext, OrderingAppContextProvider, PageSection, QuantityPicker, ReactionCounter, ReactionCounterGroup, SelectableChip, SelectableChipGroup, SelectedMenuFiltersList, StatusTag, orderingTheme, useOrderingAppContext };
 //# sourceMappingURL=index.es.js.map