@popmenu/ordering-ui 0.126.0 → 0.126.2

package/build/esm/components/MenuDropdown/index.d.ts

@@ -0,0 +1,2 @@
+export { MenuDropdown as default } from './MenuDropdown';
+export { MenuDropdownProps, MenuDropdownOption } from './MenuDropdownProps';

package/build/esm/components/MenuFilter/LeafIcon.d.ts

@@ -0,0 +1 @@
+export { default as LeafIcon } from '../../assets/leaf-icon.svg';

package/build/esm/components/MenuFilter/MenuFilter.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { MenuFilterProps } from './MenuFilterProps';
+export declare const MenuFilter: (props: MenuFilterProps) => JSX.Element;

package/build/esm/components/MenuFilter/MenuFilter.js

@@ -0,0 +1,47 @@
+import { Button, Menu, MenuItem, Box } from '@material-ui/core';
+import { Icon } from '@popmenu/common-ui';
+import React__default, { useState } from 'react';
+import { ItemTag } from '../ItemTag/ItemTag.js';
+import SvgLeafIcon from '../../assets/leaf-icon.svg.js';
+import { useMenuFilterStyles } from './MenuFilter.styles.js';
+
+var MenuFilter = function (props) {
+    var options = props.options, onChange = props.onChange, onClear = props.onClear, value = props.value, _a = props.triggerLabel, triggerLabel = _a === void 0 ? 'Add Filter' : _a, _b = props.noOptionsLabel, noOptionsLabel = _b === void 0 ? 'Reset Filters' : _b;
+    var triggerId = 'menu-filter-trigger';
+    var popoverId = 'menu-filter-popover';
+    var classes = useMenuFilterStyles();
+    var _c = useState(null), anchorEl = _c[0], setAnchorEl = _c[1];
+    var open = Boolean(anchorEl);
+    var optionIds = options.map(function (opt) { return opt.id; });
+    var valueIds = value.map(function (val) { return val.id; });
+    var availableIds = optionIds.filter(function (optionId) { return !valueIds.includes(optionId); });
+    var availableFilters = options.filter(function (opt) { return availableIds.includes(opt.id); });
+    var allFiltersSelected = availableFilters.length === 0;
+    var handleChange = function (value, event) {
+        onChange(value, event);
+        setAnchorEl(null);
+    };
+    var handleTriggerClick = function (event) {
+        setAnchorEl(event.currentTarget);
+    };
+    var handleClose = function () {
+        setAnchorEl(null);
+    };
+    var handleClear = function () {
+        onClear();
+        setAnchorEl(null);
+    };
+    if (allFiltersSelected) {
+        return (React__default.createElement(Button, { size: "small", startIcon: React__default.createElement(Icon, { icon: SvgLeafIcon }), classes: { label: classes.triggerLabel }, onClick: handleClear }, noOptionsLabel));
+    }
+    return (React__default.createElement(React__default.Fragment, null,
+        React__default.createElement(Button, { id: triggerId, "aria-controls": popoverId, "aria-haspopup": "true", "aria-expanded": open, onClick: handleTriggerClick, size: "small", startIcon: React__default.createElement(Icon, { icon: SvgLeafIcon }), classes: { label: classes.triggerLabel } }, triggerLabel),
+        React__default.createElement(Menu, { id: popoverId, anchorEl: anchorEl, open: open, onClose: handleClose }, availableFilters.map(function (option, index) {
+            return (React__default.createElement(MenuItem, { key: index, value: option.id, onClick: function (event) { return handleChange(option, event); } },
+                React__default.createElement(ItemTag, { alt: option.abbr, color: option.color }, option.abbr),
+                React__default.createElement(Box, { ml: 1 }, option.name)));
+        }))));
+};
+
+export { MenuFilter };
+//# sourceMappingURL=MenuFilter.js.map

package/build/esm/components/MenuFilter/MenuFilter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuFilter.js","sources":["../../../../src/components/MenuFilter/MenuFilter.tsx"],"sourcesContent":["import { Box, Button, Menu, MenuItem } from '@material-ui/core'\nimport { Icon } from '@popmenu/common-ui'\nimport React, { MouseEvent, useState } from 'react'\nimport ItemTag from '../ItemTag'\nimport { LeafIcon } from './LeafIcon'\nimport { useMenuFilterStyles } from './MenuFilter.styles'\nimport { MenuFilterChangeHandler, MenuFilterOption, MenuFilterProps } from './MenuFilterProps'\n\nexport const MenuFilter = (props: MenuFilterProps): JSX.Element => {\n  const { options, onChange, onClear, value, triggerLabel = 'Add Filter', noOptionsLabel = 'Reset Filters' } = props\n  const triggerId = 'menu-filter-trigger'\n  const popoverId = 'menu-filter-popover'\n  const classes = useMenuFilterStyles()\n  const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\n  const open = Boolean(anchorEl)\n  const optionIds = options.map((opt) => opt.id)\n  const valueIds = value.map((val) => val.id)\n  const availableIds = optionIds.filter((optionId) => !valueIds.includes(optionId))\n  const availableFilters = options.filter((opt) => availableIds.includes(opt.id))\n  const allFiltersSelected = availableFilters.length === 0\n  const handleChange: MenuFilterChangeHandler = (value, event) => {\n    onChange(value, event)\n    setAnchorEl(null)\n  }\n\n  const handleTriggerClick = (event: MouseEvent<HTMLElement>) => {\n    setAnchorEl(event.currentTarget)\n  }\n\n  const handleClose = () => {\n    setAnchorEl(null)\n  }\n\n  const handleClear = () => {\n    onClear()\n    setAnchorEl(null)\n  }\n\n  if (allFiltersSelected) {\n    return (\n      <Button\n        size=\"small\"\n        startIcon={<Icon icon={LeafIcon} />}\n        classes={{ label: classes.triggerLabel }}\n        onClick={handleClear}\n      >\n        {noOptionsLabel}\n      </Button>\n    )\n  }\n\n  return (\n    <React.Fragment>\n      <Button\n        id={triggerId}\n        aria-controls={popoverId}\n        aria-haspopup=\"true\"\n        aria-expanded={open}\n        onClick={handleTriggerClick}\n        size=\"small\"\n        startIcon={<Icon icon={LeafIcon} />}\n        classes={{ label: classes.triggerLabel }}\n      >\n        {triggerLabel}\n      </Button>\n      <Menu id={popoverId} anchorEl={anchorEl} open={open} onClose={handleClose}>\n        {availableFilters.map((option: MenuFilterOption, index) => {\n          return (\n            <MenuItem key={index} value={option.id} onClick={(event) => handleChange(option, event)}>\n              <ItemTag alt={option.abbr} color={option.color}>\n                {option.abbr}\n              </ItemTag>\n              <Box ml={1}>{option.name}</Box>\n            </MenuItem>\n          )\n        })}\n      </Menu>\n    </React.Fragment>\n  )\n}\n"],"names":["React","LeafIcon"],"mappings":"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"}

package/build/esm/components/MenuFilter/MenuFilter.styles.d.ts

@@ -0,0 +1 @@
+export declare const useMenuFilterStyles: (props?: any) => import("@material-ui/styles").ClassNameMap<"triggerLabel">;

package/build/esm/components/MenuFilter/MenuFilter.styles.js

@@ -0,0 +1,11 @@
+import { makeStyles } from '@material-ui/core';
+
+var useMenuFilterStyles = makeStyles(function (theme) { return ({
+    triggerLabel: {
+        color: theme.palette.info.main,
+        whiteSpace: 'nowrap',
+    },
+}); });
+
+export { useMenuFilterStyles };
+//# sourceMappingURL=MenuFilter.styles.js.map

package/build/esm/components/MenuFilter/MenuFilter.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuFilter.styles.js","sources":["../../../../src/components/MenuFilter/MenuFilter.styles.ts"],"sourcesContent":["import { makeStyles } from '@material-ui/core'\n\nexport const useMenuFilterStyles = makeStyles((theme) => ({\n  triggerLabel: {\n    color: theme.palette.info.main,\n    whiteSpace: 'nowrap',\n  },\n}))\n"],"names":[],"mappings":";;AAEa,IAAA,mBAAmB,GAAG,UAAU,CAAC,UAAC,KAAK,EAAK,EAAA,QAAC;AACxD,IAAA,YAAY,EAAE;AACZ,QAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI;AAC9B,QAAA,UAAU,EAAE,QAAQ;AACrB,KAAA;CACF,EAAC,EAAA;;;;"}

package/build/esm/components/MenuFilter/MenuFilterProps.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+export declare type MenuFilterOption = {
+    id: string;
+    abbr: string;
+    color: string;
+    name: string;
+};
+export declare type MenuFilterChangeHandler = (value: MenuFilterOption, event: React.MouseEvent<HTMLElement>) => void;
+export declare type MenuFilterClearHandler = () => void;
+export interface MenuFilterProps {
+    /** Callback for setting menu filters  */
+    onChange: MenuFilterChangeHandler;
+    /** Callback for setting menu filters  */
+    onClear: MenuFilterClearHandler;
+    /** options to set menu filter with */
+    options: MenuFilterOption[];
+    /** selected options to set menu filter with */
+    value: MenuFilterOption[];
+    /** label for menu filter button */
+    triggerLabel?: string;
+    /** label used when no options are available for selection */
+    noOptionsLabel?: string;
+}

package/build/esm/components/MenuFilter/index.d.ts

@@ -0,0 +1,2 @@
+export { MenuFilter as default } from './MenuFilter';
+export { MenuFilterProps, MenuFilterOption, MenuFilterChangeHandler } from './MenuFilterProps';

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

@@ -0,0 +1,3 @@
+import React from 'react';
+import { MenuItemProps } from './MenuItemProps';
+export declare const MenuItem: React.ForwardRefExoticComponent<MenuItemProps & React.RefAttributes<unknown>>;

package/build/esm/components/MenuItem/MenuItem.js

@@ -0,0 +1,40 @@
+import { __rest, __assign } from 'tslib';
+import React__default, { forwardRef } from 'react';
+import { Card, CardActionArea, Box, Typography } from '@material-ui/core';
+import { useMenuItemStyles } from './MenuItem.styles.js';
+import { MenuItemImg } from './MenuItemImg.js';
+import { MenuItemInfo } from './MenuItemInfo.js';
+import { MenuItemReactions } from './MenuItemReactions.js';
+import { MenuItemPrice } from './MenuItemPrice.js';
+import { MenuItemTags } from './MenuItemTags.js';
+import { StatusTag } from '../StatusTag/StatusTag.js';
+import { Skeleton } from '@material-ui/lab';
+import classNames from '../../node_modules/classnames/index.js';
+
+var MenuItem = forwardRef(function (props, ref) {
+    var ariaLabel = props.ariaLabel, 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(props, ["ariaLabel", "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, __assign({ 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, "aria-label": ariaLabel },
+            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, { 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" }))))),
+                React__default.createElement(Typography, { className: classes.cardDescription, paragraph: true }, loading ? React__default.createElement(Skeleton, null) : description),
+                loading ? (React__default.createElement(Skeleton, null,
+                    React__default.createElement(MenuItemReactions, { likeCount: likeCount, reviewCount: reviewCount }))) : (React__default.createElement(MenuItemReactions, { likeCount: likeCount, reviewCount: reviewCount })),
+                loading ? (React__default.createElement(Skeleton, { style: { flexGrow: 1 }, width: 100, height: 48 })) : (React__default.createElement(Box, { display: "flex", justifyContent: "space-between", alignItems: "end", flexGrow: 1 },
+                    React__default.createElement(MenuItemPrice, { price: price, available: available }),
+                    React__default.createElement(MenuItemTags, { itemTags: itemTags })))),
+            loading ? React__default.createElement(Skeleton, { height: 100, width: 100 }) : React__default.createElement(MenuItemImg, { image: image }))));
+});
+MenuItem.displayName = 'MenuItem';
+
+export { MenuItem };
+//# sourceMappingURL=MenuItem.js.map

package/build/esm/components/MenuItem/MenuItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.js","sources":["../../../../src/components/MenuItem/MenuItem.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\nimport { Box, Card, CardActionArea, Typography } from '@material-ui/core'\n\nimport { MenuItemProps } from './MenuItemProps'\nimport { useMenuItemStyles } from './MenuItem.styles'\nimport { MenuItemImg } from './MenuItemImg'\nimport { MenuItemInfo } from './MenuItemInfo'\nimport { MenuItemReactions } from './MenuItemReactions'\nimport { MenuItemPrice } from './MenuItemPrice'\nimport { MenuItemTags } from './MenuItemTags'\nimport StatusTag from '../StatusTag'\nimport { Skeleton } from '@material-ui/lab'\nimport classNames from 'classnames'\n\nexport const MenuItem = forwardRef((props: MenuItemProps, ref) => {\n  const {\n    ariaLabel,\n    onClick,\n    id,\n    description,\n    isOutOfStock,\n    title,\n    loading,\n    isFeatured,\n    image,\n    likeCount,\n    reviewCount,\n    price,\n    available,\n    itemTags,\n    className,\n    ...restProps\n  } = props\n  const classes = useMenuItemStyles(props)\n  const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    onClick(id, event)\n  }\n\n  return (\n    <Card\n      className={classNames(classes.card, className)}\n      ref={ref}\n      elevation={0}\n      data-component-type=\"menu-item\"\n      {...restProps}\n    >\n      <CardActionArea\n        className={classes.cardActionArea}\n        onClick={handleClick}\n        disabled={loading}\n        aria-label={ariaLabel}\n      >\n        <MenuItemInfo>\n          {isFeatured && <StatusTag color=\"highlight\" label=\"Featured\" variant=\"filled\" size=\"sm\" />}\n          <Box display=\"flex\" gridGap={8} alignItems=\"center\">\n            <Typography component=\"h2\" className={classes.cardTitle}>\n              {loading ? <Skeleton /> : title}\n              {isOutOfStock && (\n                <span className={classes.outOfStockTag}>\n                  <StatusTag color=\"warning\" label=\"Out of stock\" variant=\"outlined\" size=\"sm\" />\n                </span>\n              )}\n            </Typography>\n          </Box>\n          <Typography className={classes.cardDescription} paragraph>\n            {loading ? <Skeleton /> : description}\n          </Typography>\n          {loading ? (\n            <Skeleton>\n              <MenuItemReactions likeCount={likeCount} reviewCount={reviewCount} />\n            </Skeleton>\n          ) : (\n            <MenuItemReactions likeCount={likeCount} reviewCount={reviewCount} />\n          )}\n          {loading ? (\n            <Skeleton style={{ flexGrow: 1 }} width={100} height={48} />\n          ) : (\n            <Box display=\"flex\" justifyContent=\"space-between\" alignItems=\"end\" flexGrow={1}>\n              <MenuItemPrice price={price} available={available} />\n              <MenuItemTags itemTags={itemTags} />\n            </Box>\n          )}\n        </MenuItemInfo>\n        {loading ? <Skeleton height={100} width={100} /> : <MenuItemImg image={image} />}\n      </CardActionArea>\n    </Card>\n  )\n})\n\nMenuItem.displayName = 'MenuItem'\n"],"names":["React"],"mappings":"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"}

package/build/esm/components/MenuItem/MenuItem.styles.d.ts

@@ -0,0 +1 @@
+export declare const useMenuItemStyles: (props?: any) => import("@material-ui/styles").ClassNameMap<"cardActionArea" | "card" | "cardTitle" | "cardDescription" | "outOfStockTag">;

package/build/esm/components/MenuItem/MenuItem.styles.js

@@ -0,0 +1,67 @@
+import { makeStyles } from '@material-ui/core';
+
+var useMenuItemStyles = makeStyles(function (theme) {
+    var _a, _b;
+    return ({
+        cardActionArea: (_a = {
+                display: 'flex',
+                gridGap: 16,
+                height: '100%'
+            },
+            _a[theme.breakpoints.up('lg')] = {
+                border: '1px solid #E0E0E0',
+                borderRadius: theme.spacing(2),
+                padding: theme.spacing(2),
+            },
+            _a),
+        card: (_b = {},
+            _b[theme.breakpoints.down('md')] = {
+                '&:after': {
+                    content: '""',
+                    position: 'absolute',
+                    backgroundColor: '#E0E0E0',
+                    width: '100%',
+                    height: 1,
+                    bottom: -16,
+                    left: 0,
+                },
+            },
+            _b.height = 185,
+            _b.position = 'relative',
+            _b.overflow = 'visible',
+            _b),
+        cardTitle: {
+            flexGrow: 1,
+            fontWeight: 500,
+            fontSize: 18,
+            lineHeight: '27px',
+            color: theme.palette.grey[900],
+            '-webkit-line-clamp': 2,
+            display: '-webkit-box',
+            '-webkit-box-orient': 'vertical',
+            textOverflow: 'ellipsis',
+            overflow: 'hidden',
+        },
+        cardDescription: {
+            fontWeight: 400,
+            fontSize: 14,
+            lineHeight: '20px',
+            margin: theme.spacing(0.5, 0, 1, 0),
+            color: theme.palette.grey[800],
+            '-webkit-line-clamp': 2,
+            display: '-webkit-box',
+            '-webkit-box-orient': 'vertical',
+            textOverflow: 'ellipsis',
+            overflow: 'hidden',
+        },
+        outOfStockTag: {
+            minWidth: '90px',
+            marginLeft: theme.spacing(1),
+            display: 'inline-block',
+            verticalAlign: 'bottom',
+        },
+    });
+});
+
+export { useMenuItemStyles };
+//# sourceMappingURL=MenuItem.styles.js.map

package/build/esm/components/MenuItem/MenuItem.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.styles.js","sources":["../../../../src/components/MenuItem/MenuItem.styles.ts"],"sourcesContent":["import { makeStyles } from '@material-ui/core'\n\nexport const useMenuItemStyles = makeStyles((theme) => ({\n  cardActionArea: {\n    display: 'flex',\n    gridGap: 16,\n    height: '100%',\n    [theme.breakpoints.up('lg')]: {\n      border: '1px solid #E0E0E0',\n      borderRadius: theme.spacing(2),\n      padding: theme.spacing(2),\n    },\n  },\n  card: {\n    [theme.breakpoints.down('md')]: {\n      '&:after': {\n        content: '\"\"',\n        position: 'absolute',\n        backgroundColor: '#E0E0E0',\n        width: '100%',\n        height: 1,\n        bottom: -16,\n        left: 0,\n      },\n    },\n    height: 185,\n    position: 'relative',\n    overflow: 'visible',\n  },\n  cardTitle: {\n    flexGrow: 1,\n    fontWeight: 500,\n    fontSize: 18,\n    lineHeight: '27px',\n    color: theme.palette.grey[900],\n    '-webkit-line-clamp': 2,\n    display: '-webkit-box',\n    '-webkit-box-orient': 'vertical',\n    textOverflow: 'ellipsis',\n    overflow: 'hidden',\n  },\n  cardDescription: {\n    fontWeight: 400,\n    fontSize: 14,\n    lineHeight: '20px',\n    margin: theme.spacing(0.5, 0, 1, 0),\n    color: theme.palette.grey[800],\n    '-webkit-line-clamp': 2,\n    display: '-webkit-box',\n    '-webkit-box-orient': 'vertical',\n    textOverflow: 'ellipsis',\n    overflow: 'hidden',\n  },\n  outOfStockTag: {\n    minWidth: '90px',\n    marginLeft: theme.spacing(1),\n    display: 'inline-block',\n    verticalAlign: 'bottom',\n  },\n}))\n"],"names":[],"mappings":";;AAEa,IAAA,iBAAiB,GAAG,UAAU,CAAC,UAAC,KAAK,EAAA;;AAAK,IAAA,QAAC;QACtD,cAAc,GAAA,EAAA,GAAA;AACZ,gBAAA,OAAO,EAAE,MAAM;AACf,gBAAA,OAAO,EAAE,EAAE;AACX,gBAAA,MAAM,EAAE;;YACR,EAAC,CAAA,KAAK,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,CAAG,GAAA;AAC5B,gBAAA,MAAM,EAAE,mBAAmB;AAC3B,gBAAA,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAC9B,gBAAA,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAC1B,aAAA;AACF,YAAA,EAAA,CAAA;QACD,IAAI,GAAA,EAAA,GAAA,EAAA;YACF,EAAC,CAAA,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAG,GAAA;AAC9B,gBAAA,SAAS,EAAE;AACT,oBAAA,OAAO,EAAE,IAAI;AACb,oBAAA,QAAQ,EAAE,UAAU;AACpB,oBAAA,eAAe,EAAE,SAAS;AAC1B,oBAAA,KAAK,EAAE,MAAM;AACb,oBAAA,MAAM,EAAE,CAAC;oBACT,MAAM,EAAE,GAAG;AACX,oBAAA,IAAI,EAAE,CAAC;AACR,iBAAA;AACF,aAAA;AACD,YAAA,EAAA,CAAA,MAAM,GAAE,GAAG;AACX,YAAA,EAAA,CAAA,QAAQ,GAAE,UAAU;AACpB,YAAA,EAAA,CAAA,QAAQ,GAAE,SAAS;AACpB,YAAA,EAAA,CAAA;AACD,QAAA,SAAS,EAAE;AACT,YAAA,QAAQ,EAAE,CAAC;AACX,YAAA,UAAU,EAAE,GAAG;AACf,YAAA,QAAQ,EAAE,EAAE;AACZ,YAAA,UAAU,EAAE,MAAM;YAClB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;AAC9B,YAAA,oBAAoB,EAAE,CAAC;AACvB,YAAA,OAAO,EAAE,aAAa;AACtB,YAAA,oBAAoB,EAAE,UAAU;AAChC,YAAA,YAAY,EAAE,UAAU;AACxB,YAAA,QAAQ,EAAE,QAAQ;AACnB,SAAA;AACD,QAAA,eAAe,EAAE;AACf,YAAA,UAAU,EAAE,GAAG;AACf,YAAA,QAAQ,EAAE,EAAE;AACZ,YAAA,UAAU,EAAE,MAAM;AAClB,YAAA,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;YACnC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;AAC9B,YAAA,oBAAoB,EAAE,CAAC;AACvB,YAAA,OAAO,EAAE,aAAa;AACtB,YAAA,oBAAoB,EAAE,UAAU;AAChC,YAAA,YAAY,EAAE,UAAU;AACxB,YAAA,QAAQ,EAAE,QAAQ;AACnB,SAAA;AACD,QAAA,aAAa,EAAE;AACb,YAAA,QAAQ,EAAE,MAAM;AAChB,YAAA,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAC5B,YAAA,OAAO,EAAE,cAAc;AACvB,YAAA,aAAa,EAAE,QAAQ;AACxB,SAAA;KACF;AAzDsD,CAyDrD;;;;"}

package/build/esm/components/MenuItem/MenuItemImg.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { MenuItemProps } from './MenuItemProps';
+export declare const MenuItemImg: (props: Pick<MenuItemProps, 'image'>) => JSX.Element | null;

package/build/esm/components/MenuItem/MenuItemImg.js

@@ -0,0 +1,22 @@
+import React__default from 'react';
+import { makeStyles, Box } from '@material-ui/core';
+
+var useStyles = makeStyles(function () { return ({
+    img: {
+        objectFit: 'cover',
+        width: '100%',
+        height: '100%',
+    },
+}); });
+var MenuItemImg = function (props) {
+    var _a = props.image, image = _a === void 0 ? {} : _a;
+    var src = image.src;
+    var classes = useStyles();
+    if (!src) {
+        return null;
+    }
+    return (React__default.createElement(Box, { width: 125, height: "100%", borderRadius: 16, overflow: "hidden", flexShrink: 0 }, React__default.createElement("img", { src: src, alt: "", className: classes.img })));
+};
+
+export { MenuItemImg };
+//# sourceMappingURL=MenuItemImg.js.map

package/build/esm/components/MenuItem/MenuItemImg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemImg.js","sources":["../../../../src/components/MenuItem/MenuItemImg.tsx"],"sourcesContent":["import React from 'react'\nimport { Box, makeStyles } from '@material-ui/core'\n\nimport { MenuItemProps } from './MenuItemProps'\n\nconst useStyles = makeStyles(() => ({\n  img: {\n    objectFit: 'cover',\n    width: '100%',\n    height: '100%',\n  },\n}))\n\nexport const MenuItemImg = (props: Pick<MenuItemProps, 'image'>) => {\n  const { image = {} } = props\n  const { src } = image\n  const classes = useStyles()\n\n  if (!src) {\n    return null\n  }\n\n  return (\n    <Box width={125} height=\"100%\" borderRadius={16} overflow=\"hidden\" flexShrink={0}>\n      {<img src={src} alt=\"\" className={classes.img} />}\n    </Box>\n  )\n}\n"],"names":["React"],"mappings":";;;AAKA,IAAM,SAAS,GAAG,UAAU,CAAC,YAAA,EAAM,QAAC;AAClC,IAAA,GAAG,EAAE;AACH,QAAA,SAAS,EAAE,OAAO;AAClB,QAAA,KAAK,EAAE,MAAM;AACb,QAAA,MAAM,EAAE,MAAM;AACf,KAAA;CACF,EAAC,EAAA,CAAC;AAEI,IAAM,WAAW,GAAG,UAAC,KAAmC,EAAA;IACrD,IAAA,EAAA,GAAe,KAAK,CAAV,KAAA,EAAV,KAAK,GAAG,EAAA,KAAA,MAAA,GAAA,EAAE,KAAA;AACV,IAAA,IAAA,GAAG,GAAK,KAAK,CAAA,GAAV;AACX,IAAA,IAAM,OAAO,GAAG,SAAS,EAAE;IAE3B,IAAI,CAAC,GAAG,EAAE;AACR,QAAA,OAAO,IAAI;AACZ;AAED,IAAA,QACEA,cAAC,CAAA,aAAA,CAAA,GAAG,IAAC,KAAK,EAAE,GAAG,EAAE,MAAM,EAAC,MAAM,EAAC,YAAY,EAAE,EAAE,EAAE,QAAQ,EAAC,QAAQ,EAAC,UAAU,EAAE,CAAC,EAC7E,EAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAC,EAAE,EAAC,SAAS,EAAE,OAAO,CAAC,GAAG,EAAI,CAAA,CAC7C;AAEV;;;;"}

package/build/esm/components/MenuItem/MenuItemInfo.d.ts

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

package/build/esm/components/MenuItem/MenuItemInfo.js

@@ -0,0 +1,9 @@
+import React__default from 'react';
+import { Box } from '@material-ui/core';
+
+var MenuItemInfo = function (props) {
+    return (React__default.createElement(Box, { display: "flex", flexGrow: 1, flexDirection: "column", height: "100%" }, props.children));
+};
+
+export { MenuItemInfo };
+//# sourceMappingURL=MenuItemInfo.js.map

package/build/esm/components/MenuItem/MenuItemInfo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemInfo.js","sources":["../../../../src/components/MenuItem/MenuItemInfo.tsx"],"sourcesContent":["import React from 'react'\nimport { Box } from '@material-ui/core'\n\nexport const MenuItemInfo = (props: { children: React.ReactNode }) => {\n  return (\n    <Box display=\"flex\" flexGrow={1} flexDirection=\"column\" height=\"100%\">\n      {props.children}\n    </Box>\n  )\n}\n"],"names":["React"],"mappings":";;;AAGO,IAAM,YAAY,GAAG,UAAC,KAAoC,EAAA;IAC/D,QACEA,cAAC,CAAA,aAAA,CAAA,GAAG,EAAC,EAAA,OAAO,EAAC,MAAM,EAAC,QAAQ,EAAE,CAAC,EAAE,aAAa,EAAC,QAAQ,EAAC,MAAM,EAAC,MAAM,EAClE,EAAA,KAAK,CAAC,QAAQ,CACX;AAEV;;;;"}

package/build/esm/components/MenuItem/MenuItemPrice.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { MenuItemProps } from './MenuItemProps';
+export declare const MenuItemPrice: (props: Pick<MenuItemProps, 'price' | 'available'>) => JSX.Element;

package/build/esm/components/MenuItem/MenuItemPrice.js

@@ -0,0 +1,28 @@
+import React__default from 'react';
+import { Icon } from '@popmenu/common-ui';
+import { Plus, Lock } from '@popmenu/web-icons';
+import { makeStyles, Box, Typography } from '@material-ui/core';
+
+var useStyles = makeStyles(function (_a) {
+    var palette = _a.palette, spacing = _a.spacing;
+    return ({
+        plusIcon: {
+            height: '100%',
+            padding: spacing(0.25),
+            background: function (props) { return (props.available ? palette.info.main : 'none'); },
+            color: function (props) { return (props.available ? palette.info.contrastText : palette.warning.main); },
+            borderRadius: '30px',
+            marginRight: spacing(1),
+        },
+    });
+});
+var MenuItemPrice = function (props) {
+    var classes = useStyles(props);
+    return (React__default.createElement(Box, { display: "flex", alignItems: "center" },
+        React__default.createElement(Box, { display: "flex", className: classes.plusIcon },
+            React__default.createElement(Icon, { icon: props.available ? Plus : Lock, size: "medium" })),
+        React__default.createElement(Typography, null, props.price)));
+};
+
+export { MenuItemPrice };
+//# sourceMappingURL=MenuItemPrice.js.map

package/build/esm/components/MenuItem/MenuItemPrice.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemPrice.js","sources":["../../../../src/components/MenuItem/MenuItemPrice.tsx"],"sourcesContent":["import React from 'react'\nimport { Icon } from '@popmenu/common-ui'\nimport { Plus, Lock } from '@popmenu/web-icons'\nimport { Box, Theme, Typography, makeStyles } from '@material-ui/core'\n\nimport { MenuItemProps } from './MenuItemProps'\n\nconst useStyles = makeStyles<Theme, Pick<MenuItemProps, 'price' | 'available'>>(({ palette, spacing }) => ({\n  plusIcon: {\n    height: '100%',\n    padding: spacing(0.25),\n    background: (props) => (props.available ? palette.info.main : 'none'),\n    color: (props) => (props.available ? palette.info.contrastText : palette.warning.main),\n    borderRadius: '30px',\n    marginRight: spacing(1),\n  },\n}))\n\nexport const MenuItemPrice = (props: Pick<MenuItemProps, 'price' | 'available'>) => {\n  const classes = useStyles(props)\n  return (\n    <Box display=\"flex\" alignItems=\"center\">\n      <Box display=\"flex\" className={classes.plusIcon}>\n        <Icon icon={props.available ? Plus : Lock} size=\"medium\" />\n      </Box>\n      <Typography>{props.price}</Typography>\n    </Box>\n  )\n}\n"],"names":["React"],"mappings":";;;;;AAOA,IAAM,SAAS,GAAG,UAAU,CAAoD,UAAC,EAAoB,EAAA;QAAlB,OAAO,GAAA,EAAA,CAAA,OAAA,EAAE,OAAO,GAAA,EAAA,CAAA,OAAA;AAAO,IAAA,QAAC;AACzG,QAAA,QAAQ,EAAE;AACR,YAAA,MAAM,EAAE,MAAM;AACd,YAAA,OAAO,EAAE,OAAO,CAAC,IAAI,CAAC;YACtB,UAAU,EAAE,UAAC,KAAK,EAAA,EAAK,QAAC,KAAK,CAAC,SAAS,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,GAAG,MAAM,EAAC,EAAA;YACrE,KAAK,EAAE,UAAC,KAAK,EAAK,EAAA,QAAC,KAAK,CAAC,SAAS,GAAG,OAAO,CAAC,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC,OAAO,CAAC,IAAI,EAAC,EAAA;AACtF,YAAA,YAAY,EAAE,MAAM;AACpB,YAAA,WAAW,EAAE,OAAO,CAAC,CAAC,CAAC;AACxB,SAAA;KACF;AATyG,CASxG,CAAC;AAEI,IAAM,aAAa,GAAG,UAAC,KAAiD,EAAA;AAC7E,IAAA,IAAM,OAAO,GAAG,SAAS,CAAC,KAAK,CAAC;IAChC,QACEA,cAAC,CAAA,aAAA,CAAA,GAAG,EAAC,EAAA,OAAO,EAAC,MAAM,EAAC,UAAU,EAAC,QAAQ,EAAA;QACrCA,cAAC,CAAA,aAAA,CAAA,GAAG,EAAC,EAAA,OAAO,EAAC,MAAM,EAAC,SAAS,EAAE,OAAO,CAAC,QAAQ,EAAA;YAC7CA,cAAC,CAAA,aAAA,CAAA,IAAI,IAAC,IAAI,EAAE,KAAK,CAAC,SAAS,GAAG,IAAI,GAAG,IAAI,EAAE,IAAI,EAAC,QAAQ,GAAG,CACvD;QACNA,cAAC,CAAA,aAAA,CAAA,UAAU,QAAE,KAAK,CAAC,KAAK,CAAc,CAClC;AAEV;;;;"}

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

@@ -0,0 +1,41 @@
+import React from 'react';
+export declare type Maybe<T> = T | null;
+export interface MenuItemProps {
+    /** Label for the CardActionArea. */
+    ariaLabel: string;
+    /** Renders the title of the dish */
+    title?: Maybe<string>;
+    /** Renders the price of the dish */
+    price?: Maybe<string>;
+    /** Renders the description of the dish */
+    description?: Maybe<string>;
+    /** The item's additional CSS class name */
+    className?: string;
+    /** The item's id */
+    id: string;
+    /** The image to be displayed. */
+    image?: {
+        alt?: Maybe<string>;
+        src?: Maybe<string>;
+    };
+    /** List of item tags for a dish */
+    itemTags?: Array<{
+        abbr: string;
+        color: string;
+        name: string;
+    }>;
+    /** Number of likes */
+    likeCount?: Maybe<number>;
+    /** when true, shows a skeleton in place of content */
+    loading?: boolean;
+    /** Number of reviews */
+    reviewCount?: Maybe<number>;
+    /** Callback for when MenuItem is clicked */
+    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>;
+    /** Renders the featured tag when true */
+    isFeatured?: Maybe<boolean>;
+}

package/build/esm/components/MenuItem/MenuItemReactions.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { MenuItemProps } from './MenuItemProps';
+export declare const MenuItemReactions: (props: Pick<MenuItemProps, 'likeCount' | 'reviewCount'>) => JSX.Element;

package/build/esm/components/MenuItem/MenuItemReactions.js

@@ -0,0 +1,16 @@
+import React__default from 'react';
+import { Heart, Reviews } from '@popmenu/web-icons';
+import { ReactionCounter } from '../ReactionCounter/ReactionCounter.js';
+import { ReactionCounterGroup } from '../ReactionCounterGroup/ReactionCounterGroup.js';
+
+var MenuItemReactions = function (props) {
+    var likeCount = props.likeCount, reviewCount = props.reviewCount;
+    var showLikes = likeCount ? likeCount > 0 : false;
+    var showReviews = reviewCount ? reviewCount > 0 : false;
+    return (React__default.createElement(ReactionCounterGroup, null,
+        showLikes && React__default.createElement(ReactionCounter, { icon: Heart, count: likeCount !== null && likeCount !== void 0 ? likeCount : 0, label: "likes" }),
+        showReviews && React__default.createElement(ReactionCounter, { icon: Reviews, count: reviewCount !== null && reviewCount !== void 0 ? reviewCount : 0, label: "reviews" })));
+};
+
+export { MenuItemReactions };
+//# sourceMappingURL=MenuItemReactions.js.map

package/build/esm/components/MenuItem/MenuItemReactions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemReactions.js","sources":["../../../../src/components/MenuItem/MenuItemReactions.tsx"],"sourcesContent":["import React from 'react'\nimport { Heart, Reviews } from '@popmenu/web-icons'\n\nimport { MenuItemProps } from './MenuItemProps'\nimport ReactionCounter from '../ReactionCounter'\nimport ReactionCounterGroup from '../ReactionCounterGroup'\n\nexport const MenuItemReactions = (props: Pick<MenuItemProps, 'likeCount' | 'reviewCount'>) => {\n  const { likeCount, reviewCount } = props\n  const showLikes = likeCount ? likeCount > 0 : false\n  const showReviews = reviewCount ? reviewCount > 0 : false\n  return (\n    <ReactionCounterGroup>\n      {showLikes && <ReactionCounter icon={Heart} count={likeCount ?? 0} label=\"likes\" />}\n      {showReviews && <ReactionCounter icon={Reviews} count={reviewCount ?? 0} label=\"reviews\" />}\n    </ReactionCounterGroup>\n  )\n}\n"],"names":["React"],"mappings":";;;;;AAOO,IAAM,iBAAiB,GAAG,UAAC,KAAuD,EAAA;IAC/E,IAAA,SAAS,GAAkB,KAAK,CAAA,SAAvB,EAAE,WAAW,GAAK,KAAK,CAAA,WAAV;AAC9B,IAAA,IAAM,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,CAAC,GAAG,KAAK;AACnD,IAAA,IAAM,WAAW,GAAG,WAAW,GAAG,WAAW,GAAG,CAAC,GAAG,KAAK;IACzD,QACEA,6BAAC,oBAAoB,EAAA,IAAA;QAClB,SAAS,IAAIA,6BAAC,eAAe,EAAA,EAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,KAAT,IAAA,IAAA,SAAS,cAAT,SAAS,GAAI,CAAC,EAAE,KAAK,EAAC,OAAO,EAAG,CAAA;QAClF,WAAW,IAAIA,cAAC,CAAA,aAAA,CAAA,eAAe,EAAC,EAAA,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,KAAA,IAAA,IAAX,WAAW,KAAX,MAAA,GAAA,WAAW,GAAI,CAAC,EAAE,KAAK,EAAC,SAAS,EAAA,CAAG,CACtE;AAE3B;;;;"}

package/build/esm/components/MenuItem/MenuItemTags.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { MenuItemProps } from './MenuItemProps';
+export declare const MenuItemTags: (props: Pick<MenuItemProps, 'itemTags'>) => JSX.Element;

package/build/esm/components/MenuItem/MenuItemTags.js

@@ -0,0 +1,11 @@
+import React__default from 'react';
+import { ItemTag } from '../ItemTag/ItemTag.js';
+import { ItemTagGroup } from '../ItemTagGroup/ItemTagGroup.js';
+
+var MenuItemTags = function (props) {
+    var itemTags = props.itemTags;
+    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)); })));
+};
+
+export { MenuItemTags };
+//# sourceMappingURL=MenuItemTags.js.map

package/build/esm/components/MenuItem/MenuItemTags.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemTags.js","sources":["../../../../src/components/MenuItem/MenuItemTags.tsx"],"sourcesContent":["import React from 'react'\n\nimport ItemTag from '../ItemTag'\nimport ItemTagGroup from '../ItemTagGroup'\nimport { MenuItemProps } from './MenuItemProps'\n\nexport const MenuItemTags = (props: Pick<MenuItemProps, 'itemTags'>) => {\n  const { itemTags } = props\n  return (\n    <ItemTagGroup>\n      {itemTags?.slice(0, 5).map((itemTag) => (\n        <ItemTag key={itemTag.name} alt={itemTag.name} color={itemTag.color}>\n          {itemTag.abbr}\n        </ItemTag>\n      ))}\n    </ItemTagGroup>\n  )\n}\n"],"names":["React"],"mappings":";;;;AAMO,IAAM,YAAY,GAAG,UAAC,KAAsC,EAAA;AACzD,IAAA,IAAA,QAAQ,GAAK,KAAK,CAAA,QAAV;IAChB,QACEA,cAAC,CAAA,aAAA,CAAA,YAAY,EACV,IAAA,EAAA,QAAQ,aAAR,QAAQ,KAAA,MAAA,GAAA,MAAA,GAAR,QAAQ,CAAE,KAAK,CAAC,CAAC,EAAE,CAAC,CAAE,CAAA,GAAG,CAAC,UAAC,OAAO,EAAA,EAAK,QACtCA,cAAC,CAAA,aAAA,CAAA,OAAO,EAAC,EAAA,GAAG,EAAE,OAAO,CAAC,IAAI,EAAE,GAAG,EAAE,OAAO,CAAC,IAAI,EAAE,KAAK,EAAE,OAAO,CAAC,KAAK,EAAA,EAChE,OAAO,CAAC,IAAI,CACL,EACX,EAAA,CAAC,CACW;AAEnB;;;;"}

package/build/esm/components/MenuItem/index.d.ts

@@ -0,0 +1,2 @@
+export { MenuItem } from './MenuItem';
+export { MenuItemProps } from './MenuItemProps';

package/build/esm/components/MenuItemGroup/MenuItemGroup.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export declare const MenuItemGroup: React.ForwardRefExoticComponent<{
+    children: React.ReactNode;
+    className?: string | undefined;
+} & React.RefAttributes<unknown>>;

package/build/esm/components/MenuItemGroup/MenuItemGroup.js

@@ -0,0 +1,15 @@
+import { __rest, __assign } from 'tslib';
+import React__default, { forwardRef } from 'react';
+import { Box } from '@material-ui/core';
+import { useStyles } from './MenuItemGroupStyles.js';
+import classNames from '../../node_modules/classnames/index.js';
+
+var MenuItemGroup = forwardRef(function (props, ref) {
+    var classes = useStyles();
+    props.children; var className = props.className, restProps = __rest(props, ["children", "className"]);
+    return (React__default.createElement(Box, __assign({ className: classNames(classes.main, className) }, { ref: ref }, { "data-component-type": "menu-item-group" }, restProps), props.children));
+});
+MenuItemGroup.displayName = 'MenuItemGroup';
+
+export { MenuItemGroup };
+//# sourceMappingURL=MenuItemGroup.js.map

package/build/esm/components/MenuItemGroup/MenuItemGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemGroup.js","sources":["../../../../src/components/MenuItemGroup/MenuItemGroup.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\nimport { Box } from '@material-ui/core'\nimport { useStyles } from './MenuItemGroupStyles'\nimport classNames from 'classnames'\nexport const MenuItemGroup = forwardRef((props: { children: React.ReactNode; className?: string }, ref) => {\n  const classes = useStyles()\n  const { children, className, ...restProps } = props\n  return (\n    <Box\n      className={classNames(classes.main, className)}\n      {...{ ref }}\n      data-component-type=\"menu-item-group\"\n      {...restProps}\n    >\n      {props.children}\n    </Box>\n  )\n})\n\nMenuItemGroup.displayName = 'MenuItemGroup'\n"],"names":["React"],"mappings":";;;;;;IAIa,aAAa,GAAG,UAAU,CAAC,UAAC,KAAwD,EAAE,GAAG,EAAA;AACpG,IAAA,IAAM,OAAO,GAAG,SAAS,EAAE;AACnB,IAAsC,KAAK,CAAnC,QAAA,CAAA,KAAE,SAAS,GAAmB,KAAK,CAAxB,SAAA,CAAA,CAAK,SAAS,GAAK,MAAA,CAAA,KAAK,EAA7C,CAAA,UAAA,EAAA,WAAA,CAAqC;AAC3C,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,GAAG,EAAA,QAAA,CAAA,EACF,SAAS,EAAE,UAAU,CAAC,OAAO,CAAC,IAAI,EAAE,SAAS,CAAC,EAC1C,EAAA,EAAE,GAAG,EAAA,GAAA,EAAE,EAAA,EAAA,qBAAA,EACS,iBAAiB,EAAA,EACjC,SAAS,CAAA,EAEZ,KAAK,CAAC,QAAQ,CACX;AAEV,CAAC;AAED,aAAa,CAAC,WAAW,GAAG,eAAe;;;;"}

package/build/esm/components/MenuItemGroup/MenuItemGroupStyles.d.ts

@@ -0,0 +1 @@
+export declare const useStyles: (props?: any) => import("@material-ui/styles").ClassNameMap<"main">;

package/build/esm/components/MenuItemGroup/MenuItemGroupStyles.js

@@ -0,0 +1,21 @@
+import { makeStyles } from '@material-ui/core';
+
+var useStyles = makeStyles(function (_a) {
+    var _b;
+    var breakpoints = _a.breakpoints;
+    return ({
+        main: (_b = {},
+            _b[breakpoints.down('md')] = {
+                gridTemplateColumns: '1fr',
+            },
+            _b[breakpoints.up('lg')] = {
+                gridTemplateColumns: 'repeat(2, minmax(280px, 1fr))',
+            },
+            _b.display = 'grid',
+            _b.gridGap = 32,
+            _b),
+    });
+});
+
+export { useStyles };
+//# sourceMappingURL=MenuItemGroupStyles.js.map

package/build/esm/components/MenuItemGroup/MenuItemGroupStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemGroupStyles.js","sources":["../../../../src/components/MenuItemGroup/MenuItemGroupStyles.ts"],"sourcesContent":["import { makeStyles } from '@material-ui/core'\n\nexport const useStyles = makeStyles(({ breakpoints }) => ({\n  main: {\n    [breakpoints.down('md')]: {\n      gridTemplateColumns: '1fr',\n    },\n    [breakpoints.up('lg')]: {\n      gridTemplateColumns: 'repeat(2, minmax(280px, 1fr))',\n    },\n    display: 'grid',\n    gridGap: 32,\n  },\n}))\n"],"names":[],"mappings":";;AAEa,IAAA,SAAS,GAAG,UAAU,CAAC,UAAC,EAAe,EAAA;;AAAb,IAAA,IAAA,WAAW,GAAA,EAAA,CAAA,WAAA;AAAO,IAAA,QAAC;QACxD,IAAI,GAAA,EAAA,GAAA,EAAA;AACF,YAAA,EAAA,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAG,GAAA;AACxB,gBAAA,mBAAmB,EAAE,KAAK;AAC3B,aAAA;AACD,YAAA,EAAA,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,CAAG,GAAA;AACtB,gBAAA,mBAAmB,EAAE,+BAA+B;AACrD,aAAA;AACD,YAAA,EAAA,CAAA,OAAO,GAAE,MAAM;AACf,YAAA,EAAA,CAAA,OAAO,GAAE,EAAE;AACZ,YAAA,EAAA,CAAA;KACF;AAXwD,CAWvD;;;;"}

package/build/esm/components/MenuItemGroup/index.d.ts

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

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

@@ -0,0 +1,3 @@
+import React from 'react';
+import { MenuSectionProps } from './MenuSectionProps';
+export declare const MenuSection: React.ForwardRefExoticComponent<MenuSectionProps & React.RefAttributes<unknown>>;

package/build/esm/components/MenuSection/MenuSection.js

@@ -0,0 +1,18 @@
+import { __rest, __assign } from 'tslib';
+import React__default, { forwardRef } from 'react';
+import { Box, Typography } from '@material-ui/core';
+import { useStyles } from './MenuSectionStyles.js';
+import { Skeleton } from '@material-ui/lab';
+
+var MenuSection = forwardRef(function (props, ref) {
+    var name = props.name, children = props.children, loading = props.loading, restProps = __rest(props, ["name", "children", "loading"]);
+    var classes = useStyles();
+    return (React__default.createElement(Box, __assign({}, 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, { component: "h1", className: classes.title }, loading ? React__default.createElement(Skeleton, null) : name)),
+        children));
+});
+MenuSection.displayName = 'MenuSection';
+
+export { MenuSection };
+//# sourceMappingURL=MenuSection.js.map

package/build/esm/components/MenuSection/MenuSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuSection.js","sources":["../../../../src/components/MenuSection/MenuSection.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\nimport { Box, Typography } from '@material-ui/core'\nimport { MenuSectionProps } from './MenuSectionProps'\nimport { useStyles } from './MenuSectionStyles'\nimport { Skeleton } from '@material-ui/lab'\n\nexport const MenuSection = forwardRef((props: MenuSectionProps, ref) => {\n  const { name, children, loading, ...restProps } = props\n  const classes = useStyles()\n  return (\n    <Box\n      {...restProps}\n      {...{ ref, component: 'section' }}\n      data-component-type=\"menu-section\"\n      style={{ scrollMarginTop: '70px' }}\n    >\n      <Box marginTop={1} marginBottom={4}>\n        <Typography component=\"h1\" className={classes.title}>\n          {loading ? <Skeleton /> : name}\n        </Typography>\n      </Box>\n      {children}\n    </Box>\n  )\n})\n\nMenuSection.displayName = 'MenuSection'\n"],"names":["React"],"mappings":";;;;;;IAMa,WAAW,GAAG,UAAU,CAAC,UAAC,KAAuB,EAAE,GAAG,EAAA;IACzD,IAAA,IAAI,GAAsC,KAAK,CAAA,IAA3C,EAAE,QAAQ,GAA4B,KAAK,CAAjC,QAAA,EAAE,OAAO,GAAmB,KAAK,QAAxB,EAAK,SAAS,UAAK,KAAK,EAAjD,CAAyC,MAAA,EAAA,UAAA,EAAA,SAAA,CAAA,CAAF;AAC7C,IAAA,IAAM,OAAO,GAAG,SAAS,EAAE;IAC3B,QACEA,6BAAC,GAAG,EAAA,QAAA,CAAA,EAAA,EACE,SAAS,EACT,EAAE,GAAG,EAAA,GAAA,EAAE,SAAS,EAAE,SAAS,EAAE,EACb,EAAA,qBAAA,EAAA,cAAc,EAClC,KAAK,EAAE,EAAE,eAAe,EAAE,MAAM,EAAE,EAAA,CAAA;QAElCA,cAAC,CAAA,aAAA,CAAA,GAAG,IAAC,SAAS,EAAE,CAAC,EAAE,YAAY,EAAE,CAAC,EAAA;YAChCA,cAAC,CAAA,aAAA,CAAA,UAAU,EAAC,EAAA,SAAS,EAAC,IAAI,EAAC,SAAS,EAAE,OAAO,CAAC,KAAK,EAAA,EAChD,OAAO,GAAGA,cAAA,CAAA,aAAA,CAAC,QAAQ,EAAA,IAAA,CAAG,GAAG,IAAI,CACnB,CACT;QACL,QAAQ,CACL;AAEV,CAAC;AAED,WAAW,CAAC,WAAW,GAAG,aAAa;;;;"}

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+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 */
+    name: string;
+    children: React.ReactNode;
+}

package/build/esm/components/MenuSection/MenuSectionStyles.d.ts

@@ -0,0 +1 @@
+export declare const useStyles: (props?: any) => import("@material-ui/styles").ClassNameMap<"title">;

package/build/esm/components/MenuSection/MenuSectionStyles.js

@@ -0,0 +1,12 @@
+import { makeStyles } from '@material-ui/core';
+
+var useStyles = makeStyles(function () { return ({
+    title: {
+        fontWeight: 400,
+        fontSize: 20,
+        lineHeight: '30px',
+    },
+}); });
+
+export { useStyles };
+//# sourceMappingURL=MenuSectionStyles.js.map

package/build/esm/components/MenuSection/MenuSectionStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuSectionStyles.js","sources":["../../../../src/components/MenuSection/MenuSectionStyles.ts"],"sourcesContent":["import { makeStyles } from '@material-ui/core'\n\nexport const useStyles = makeStyles(() => ({\n  title: {\n    fontWeight: 400,\n    fontSize: 20,\n    lineHeight: '30px',\n  },\n}))\n"],"names":[],"mappings":";;IAEa,SAAS,GAAG,UAAU,CAAC,YAAA,EAAM,QAAC;AACzC,IAAA,KAAK,EAAE;AACL,QAAA,UAAU,EAAE,GAAG;AACf,QAAA,QAAQ,EAAE,EAAE;AACZ,QAAA,UAAU,EAAE,MAAM;AACnB,KAAA;CACF,EAAC,EAAA;;;;"}

package/build/esm/components/MenuSection/index.d.ts

@@ -0,0 +1,2 @@
+export { MenuSection } from './MenuSection';
+export { MenuSectionProps } from './MenuSectionProps';

package/build/esm/components/MenuSectionGroup/MenuSectionGroup.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export declare const MenuSectionGroup: React.ForwardRefExoticComponent<{
+    id: string;
+    children: React.ReactNode;
+} & React.RefAttributes<unknown>>;